@charset "utf-8";
/* bedrock css */

.main {
background-image: url("../img/common/bg_blk.jpg");
background-repeat: repeat;
}
.sec_intro {
margin-bottom: 80px;
}
.intro_copy {
font-size: 2.4rem;
font-weight: 500;
letter-spacing: 0.2em;
line-height: 180%;
padding-bottom: 32px;
position: relative;
display: block;
text-align: center;
margin-bottom: 50px;
color: #ddd;
}

@media all and (max-width : 1260px ){
.intro_copy {
font-size: 2.2rem;
}
}

@media all and (max-width : 1024px ){
.intro_copy {
font-size: 2.0rem;
margin-bottom: 40px;
}
}

.intro_copy::after {
content: "";
display: block;
background-color: #8E7742;
width: 15px;
height: 1px;
position: absolute;
left: 50%;
bottom: 0;
}
.intro_txt {
font-size: 1.5rem;
line-height: 200%;
letter-spacing: 0.2em;
display: block;
text-align: center;
margin-bottom: 50px;
color: #ddd;
}

@media all and (max-width : 820px ){
.intro_txt {
font-size: 1.4rem;
line-height: 180%;
letter-spacing: 0.15em;
margin-bottom: 40px;
}
}

@media all and (max-width : 767px ){
.sec_intro {
margin-bottom: 35px;
}
.intro_copy {
font-size: 1.6rem;
padding-bottom: 25px;
margin-bottom: 30px;
}
.intro_copy::after {
width: 12px;
height: 1px;
position: absolute;
left: 49%;
bottom: 0;
}
.intro_txt {
font-size: 1.3rem;
line-height: 180%;
letter-spacing: 0.1em;
margin-bottom: 30px;
}
}

.content_inner {
display: flex;
align-items: center;
justify-content: space-between;
padding: 110px 6.21% 0 12.34%;
position: relative;
}

@media all and (max-width : 1366px ){
.content_inner {
padding: 50px 8.21% 0 12.34%;
}
}

.inner_txtbox {
width: 42.1%;
}

@media all and (max-width : 1536px ){
.inner_txtbox {
width: 50%;
}
}

@media all and (max-width : 1024px ){
.content_inner {
display: flex;
align-items: center;
flex-direction: column-reverse;
justify-content: space-between;
padding: 0px 12.34% 0 12.34%;
}
.inner_txtbox {
width: 100%;
}
}

@media all and (max-width : 767px ){
.content_inner {
display: flex;
align-items: center;
flex-direction: column;
justify-content: space-between;
padding: 10px 30px 0 30px;
}
}

.content {
padding: 70px 0 0;
}
.intro_subtitle {
font-size: 2.0rem;
font-weight: 600;
color: #BCA461;
letter-spacing: 0.4em;
margin-bottom: 30px;
}

@media all and (max-width : 820px ){
.intro_subtitle {
font-size: 1.8rem;
letter-spacing: 0.2em;
margin-bottom: 20px;
}
}

@media all and (max-width : 767px ){
.intro_subtitle {
font-size: 1.4rem;
margin-bottom: 10px;
}
}

.use_box {
width: 100%;
border: solid 1px #85723D;
padding: 40px 30px 0 30px;
margin-bottom: 40px;
}
.use_box dl {
display: flex;
align-items: center;
margin-bottom: 40px;
}
.use_box dl dt {
width: 25%;
font-size: 1.8rem;
font-weight: 600;
color: #BCA461;
letter-spacing: 0.2em;
line-height: 100%;
padding-right: 10px;
white-space: nowrap;
}
.use_box dl dd {
width: 75%;
color: #ddd;
padding: 5px 0;
position: relative;
padding-left: 30px;
}
.use_box dl dd::before {
content: "";
display: inline-block;
width: 1px;
height: 100%;
background-color: #707070;
position: absolute;
left: 0;
top: 0;
}

@media all and (max-width : 1260px ){
.use_box dl {
display: flex;
align-items: flex-start;
flex-direction: column;
margin-bottom: 30px;
}
.use_box dl dt {
width: 100%;
padding-right: 0px;
margin-bottom: 15px;
}
.use_box dl dd {
width: 100%;
color: #ddd;
padding: 0;
}
.use_box dl dd::before {
display: none;
}
}

.use_box dl dd .list_price {
font-size: 1.6rem;
}
.use_box dl dd .list_price li {
margin-bottom: 10px;
}
.use_box dl dd .list_price li span {
font-size: 1.2rem;
}
.color_gold {
color: #BCA461;
font-weight: 500;
font-size: 1.4rem;
}
.use_box dl dd .list_time {
display: flex;
align-items: center;
flex-wrap: wrap;
}
.use_box dl dd .list_time li {
font-family: "garamond-premier-pro", serif;
font-weight: 400;
font-size: 1.8rem;
letter-spacing: 0.1em;
margin-right: 20px;
margin-bottom: 20px;
margin: 10px 20px 10px 0;
line-height: 100%;
}
.use_box dl .reserve_tel {
font-family: "garamond-premier-pro", serif;
font-weight: 500;
font-size: 2.2rem;
letter-spacing: 0.1em;
}
.intro_read {
font-size: 1.4rem;
color: #ddd;
margin-bottom: 50px;
}

@media all and (max-width : 767px ){
.use_box {
padding: 20px 20px 0 20px;
margin-bottom: 30px;
}
.use_box dl dt {
font-size: 1.4rem;
}
.use_box dl dd {
font-size: 1.3rem;
}
.use_box dl dd .list_price li {
font-size: 1.3rem;
}
.use_box dl dd .list_time li {
font-size: 1.6rem;
}
.use_box dl .reserve_tel {
font-size: 2.0rem;
}
.intro_read {
font-size: 1.2rem;
margin-bottom: 30px;
}
}


/* flow
-------------------------------------------------- */

.flow_item {
position: relative;
padding-left: 115px;
counter-increment: number;
}
.flow_item:last-of-type {
padding-bottom: 50px;
}
.flow_item:not(:last-child) {
padding-bottom: 70px;
}

@media all and (max-width : 820px ){
.flow_item:not(:last-child) {
padding-bottom: 60px;
}
}

@media all and (max-width : 767px ){
.flow_item {
margin-left: 10px;
padding-left: 60px;
}
.flow_item:last-of-type {
padding-bottom: 30px;
}
.flow_item:not(:last-child) {
padding-bottom: 30px;
}
}

.flow_item:not(:last-child)::before {
content: "";
position: absolute;
top: 90px;
left: 44px;
display: block;
width: 0;
height: calc(100% - 112px);
border-right: 1px solid #aaa;
}

@media all and (max-width : 767px ){
.flow_item:not(:last-child)::before {
content: "";
position: absolute;
top: 48px;
left: 20px;
width: 0;
height: calc(100% - 70px);
}
}

.editor-ttl {
font-size: 1.6rem;
font-weight: 500;
letter-spacing: 0.2em;
color: #ccc;
margin-bottom: 10px;
}

@media all and (max-width : 820px ){
.editor-ttl {
font-size: 1.6rem;
letter-spacing: 0.15em;
}
}

@media all and (max-width : 767px ){
.editor-ttl {
font-size: 1.3rem;
}
}

.editor-ttl::after {
content: counter(number, decimal-leading-zero);
position: absolute;
top: -8px;
left: 5px;
display: flex;
justify-content: center;
align-items: center;
width: 70px;
height: 70px;
line-height: 50px;
letter-spacing: 0.05em;
border-radius: 50%;
text-align: center;
color: #000;
background-color: #EFEFEF;
font-family: "garamond-premier-pro", serif;
font-weight: 400;
font-size: 1.4rem;
}
.flow_txt {
font-size: 1.4rem;
font-weight: 400;
color: #ddd;
line-height: 200%;
}
.flow_txt a {
text-decoration: underline;
color: #8E7742;
}
.flow_txt a:hover {
text-decoration: none;
}

@media all and (max-width : 767px ){
.editor-ttl::after {
content: counter(number, decimal-leading-zero);
position: absolute;
top: -6px;
left: 0px;
width: 40px;
height: 40px;
line-height: 50px;
font-size: 1.1rem;
}
.flow_txt {
font-size: 1.2rem;
line-height: 180%;
}
}

.sec_intro .content_inner {
align-items: flex-start;
margin-bottom: 80px;
}

@media all and (max-width : 767px ){
.sec_intro .content_inner {
margin-bottom: 30px;
}
}

/* swiper
-------------------------------------------------- */

.swiper_ex_wrap {
position: relative;
width: 47%;
overflow: hidden;
padding-bottom: 30px;
}

@media all and (max-width : 1024px ){
.swiper_ex_wrap {
width: 90%;
margin-bottom: 30px;
}
}

.swiper_ex_wrap .swiper-wrapper {
z-index: 5;
}
.swiper-img {
width: 100%;
display: block;
}
.swiper-img img {
width: 100%;
height: auto;
transform: scale(1.1);
display: block;
}
.img_cap {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
display: block;
background: rgba(0, 0, 0, .7);
padding: 10px 5px;
color: #fff;
font-size: 1.4rem;
text-align: center;
}
.swiper_ex_wrap .swiper-pagination-bullet {
width: 5px;
height: 5px;
display: inline-block;
border-radius: 100%;
background: #ddd;
opacity: .2;
margin-right: 10px;
}
.swiper_ex_wrap .swiper-pagination-bullet:last-child {
margin-right: 0px;
}
.swiper_ex_wrap .swiper-pagination-bullet-active {
opacity: 1;
background: #B29458;
}
.swiper_ex_wrap .swiper-pagination {
position: absolute;
bottom: 0;
text-align: right;
}
.swiper_ex_wrap .swiper-pagination-bullet:hover {
cursor: pointer;
}
.swiper-slide-active .swiper-img,
.swiper-slide-duplicate-active .swiper-img,
.swiper-slide-prev .swiper-img {
animation: imgSlide 7s linear 0s normal both;
}

@keyframes imgSlide {
0% {
transform: translate(0px);
}
100% {
transform: translateX(-30px);
}
}

@media all and (max-width : 820px ){
.swiper_ex_wrap {
width: 100%;
margin-bottom: 30px;
}
.swiper-img img {
transform: scale(1.15);
}
}

@media all and (max-width : 767px ){
.swiper_ex_wrap {
padding-bottom: 25px;
margin-bottom: 10px;
}
.swiper-img img {
transform: scale(1.2);
}
.img_cap {
padding: 8px 5px;
font-size: 1.1rem;
}
}


/* page navi
-------------------------------------------------- */

.page_navi {
border-top: solid 1px #85723D;
border-bottom: solid 1px #85723D;
}
.page_navi li a {
color: #BCA461
}
.page_navi li {
border-right: solid 1px #85723D;
}


/*-------------------------------------------------
暁月庵
-------------------------------------------------*/

.sec_akatsuki,
.sec_fugetsu,
.sec_kagetsu {
background: #000;
padding-bottom: 80px;
overflow: hidden;
}

@media all and (max-width : 767px ){
.sec_akatsuki,
.sec_fugetsu,
.sec_kagetsu {
padding-bottom: 40px;
}
}

.head_kv {
position: relative;
width: 100%;
}
.kv_img {
position: relative;
width: 100%;
z-index: 3;
}
.kv_img::after {
content: "";
position: absolute;
left: 0;
top: 0;
background-image: url("../img/common/bg_grid_30.png");
background-repeat: repeat;
background-position: left top;
width: 100%;
height: 100%;
z-index: 4;
}
.kv_img img {
width: 100%;
}
.sec_title_vertical {
position: absolute;
top: 3.13vw;
}
.sec_title_vertical dt,
.sec_title_vertical dd {
color: #fff;
}
.sec_title_vertical dt {
letter-spacing: 0.4em;
}
.movie_blend_title {
font-family: "cormorant-garamond", serif;
font-weight: 500;
line-height: 100%;
font-size: 9.375vw;
letter-spacing: 0;
color: rgba(255, 255, 255, 0.3);
position: absolute;
right: 6.21%;
bottom: -15%;
z-index: 5;
}

@media all and (max-width : 1024px ){
.movie_blend_title {
position: absolute;
right: 9.21%;
}
}

@media all and (max-width : 767px ){
.movie_blend_title {
font-size: 11.375vw;
position: absolute;
right: 1.21%;
}
}

.content_box {
display: flex;
justify-content: space-between;
position: relative;
margin-top: 100px;
}
.content_txtbox {
width: 50.4%;
}
.content_copy {
font-size: 2.4rem;
font-weight: 500;
color: #CDC5AF;
letter-spacing: 0.4em;
padding-bottom: 50px;
margin-bottom: 70px;
position: relative;
}

@media all and (max-width : 1260px ){
.content_copy {
font-size: 2.2rem;
}
}

@media all and (max-width : 1024px ){
.content_copy {
font-size: 2.0rem;
margin-bottom: 60px;
}
}

@media all and (max-width : 820px ){
.content_copy {
font-size: 1.6rem;
letter-spacing: 0.25em;
margin-bottom: 60px;
}
}


.content_copy::after {
content: "";
display: block;
background-color: #B29458;
width: 100px;
height: 1px;
position: absolute;
left: 0;
bottom: 0px;
}
.content_txt {
font-size: 1.5rem;
color: #fff;
line-height: 200%;
}

@media all and (max-width : 820px ){
.content_txt {
font-size: 1.4rem;
line-height: 180%;
}
}

@media all and (max-width : 767px ){
.content_box {
flex-direction: column;
margin-top: 40px;
}
.content_txtbox {
width: 100%;
}
.content_copy {
font-size: 1.4rem;
letter-spacing: 0.3em;
padding-bottom: 30px;
margin-bottom: 40px;
}
.content_copy::after {
width: 50px;
}
.content_txt {
font-size: 1.3rem;
line-height: 180%;
margin-bottom: 30px;
}
}

.bed_box_wrap {
width: 46.03%;
position: relative;
overflow: hidden;
}

@media all and (max-width : 767px ){
.bed_box_wrap {
width: 100%;
}
}

.bed_imgbox {
position: relative;
z-index: 5;
}
.bed_imgbox img {
width: 100%;
}


/* 石の効能
-------------------------------------------------- */

.sec_efficacy {
padding: 80px 0;
}
.efficacy_title {
font-size: 2.4rem;
font-weight: 600;
letter-spacing: 0.2em;
color: #BCA461;
padding-bottom: 10px;
border-bottom: solid 1px #362F22;
margin-bottom: 45px;
}
.rock_box_wrap {
display: flex;
flex-wrap: wrap;
}
.rock_box {
width: calc(50% - 50px / 2);
margin-right: 50px;
margin-bottom: 50px;
display: flex;
align-items: flex-start;
}
.rock_box:nth-child(2n) {
margin-right: 0px;
}
.rock_imgbox {
width: 100px;
margin-right: 40px;
}
.rock_imgbox dt {
width: 100px;
background: #947E42;
padding: 2px 5px;
margin-bottom: 6px;
color: #fff;
font-family: "garamond-premier-pro", serif;
font-weight: 400;
font-size: 1.8rem;
display: block;
text-align: 
center;
}
.rock_imgbox dd {
width: 100px;
}
.rock_imgbox dd img {
width: 100%;
}
.rock_title {
font-size: 1.8rem;
font-weight: 600;
color: #BCA461;
letter-spacing: 0.4em;
margin-bottom: 10px;
}
.rock_subtitle {
font-size: 1.6rem;
font-weight: 600;
margin-bottom: 20px;
color: #ccc;
}
.rock_txt {
font-size: 1.4rem;
line-height: 200%;
color: #ddd;
}
.rock_under_box {
width: 100%;
background: rgba(255,255,255,0.16);
padding: 30px;
}
.rock_feature_box {
margin-bottom: 30px;
}
.rock_feature_box dt {
font-size: 1.8rem;
font-weight: 600;
letter-spacing: 0.2em;
color: #BCA461;
margin-bottom: 10px;
}
.rock_feature_box dd {
font-size: 1.4rem;
line-height: 200%;
color: #ddd;
}

@media all and (max-width : 820px ){
.rock_title {
font-size: 1.6rem;
letter-spacing: 0.2em;
}
.rock_subtitle {
font-size: 1.4rem;
}
.rock_txt {
font-size: 1.3rem;
line-height: 180%;
}
.rock_feature_box dt {
font-size: 1.6rem;
}
}

@media all and (max-width : 767px ){
.sec_efficacy {
padding: 30px 0;
}
.efficacy_title {
font-size: 1.6rem;
margin-bottom: 30px;
}
.rock_box_wrap {
display: flex;
flex-wrap: wrap;
}
.rock_box {
width: 100%;
margin-right: 0px;
padding-bottom: 20px;
border-bottom: solid 1px #333;
margin-bottom: 30px;
}
.rock_imgbox {
width: 80px;
margin-right: 40px;
}
.rock_imgbox dt {
width: 80px;
padding: 2px 0px;
margin-bottom: 5px;
font-size: 1.4rem;
}
.rock_imgbox dd {
width: 80px;
}
.rock_imgbox dd img {
width: 100%;
}
.rock_title {
font-size: 1.3rem;
letter-spacing: 0.1em;
}
.rock_subtitle {
font-size: 1.2rem;
margin-bottom: 15px;
}
.rock_txt {
font-size: 1.2rem;
line-height: 180%;
}
.rock_under_box {
width: 100%;
padding: 20px 10px 5px 20px;
}
.rock_feature_box {
margin-bottom: 30px;
}
.rock_feature_box dt {
font-size: 1.4rem;
}
.rock_feature_box dd {
font-size: 1.2rem;
line-height: 180%;
}
}


/*-------------------------------------------------
風月庵
-------------------------------------------------*/

.fugetsu_bed {
padding-top: 40px;
}


/*-------------------------------------------------
華月案
-------------------------------------------------*/

.sec_kagetsu .content_txtbox {
width: 60%;
}
.sec_kagetsu .bed_box_wrap {
width: 30%;
}
.caution_txt {
font-size: 1.3rem;
line-height: 180%;
color: #ddd;
margin-top: 20px;
}
.kagetsu_bed {
width: 275px;
height: auto;
padding-top: 40px;
}

@media all and (max-width : 820px ){
.sec_kagetsu .bed_box_wrap {
width: 35%;
}
}

@media all and (max-width : 767px ){
.sec_kagetsu .content_txtbox {
width: 100%;
}
.sec_kagetsu .bed_box_wrap {
width: 100%;
}
.caution_txt {
font-size: 1.1rem;
margin-top: 10px;
}
.kagetsu_bed {
width: 200px;
height: auto;
margin: 0 auto;
padding-top: 30px;
}
}