@charset "utf-8";
/* ===================================================
	Home CSS
====================================================== */
/* ---------------------------------------------------
Main Image ( Eye Catch Slide )
------------------------------------------------------ */
#main_img{	position:relative; z-index: 1;}
#eyecatch{ height:100vh; overflow: hidden; opacity: 0;}
#eyecatch::before{ content: ""; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); position: absolute; top: 0; left: 0; z-index: 2;}
#eyecatch .slick-list,
#eyecatch .slick-track{ height:100%; }
#eyecatch .slick-slide{ position:relative; height:100vh; overflow:hidden; }
#eyecatch .slick-slide img.ofi{ width:100%; min-width:1280px; height:100vh; object-fit:cover; display:block; transform:scale(1); transition:transform 6s linear; }
#eyecatch .slick-slide.slick-animate img.ofi{ transform:scale(1.1); }
#main_img .logo,
#main_img .txt,
#main_img .open{ position: absolute; top: 50%; left: 50%; z-index: 3; opacity: 0;}
#main_img .logo{ transform: translate( -50%, -80%); width: 75px;}
#main_img .txt{ transform: translate( -50%, 100px); font-size: 25px; line-height: 2; letter-spacing: 0.15em; text-align: center; white-space: nowrap;}
#main_img .open{ transform: translate( -50%, 220px); font-size: 22px; letter-spacing: 0.15em; text-align: center; white-space: nowrap;}
.your-slider-class:not(.slick-initialized) > *:not(:first-child) { display: none;}
#main_img .txt.delay500{ animation-delay: 500ms;}
#main_img .open.delay1000{ animation-delay: 1000ms;}
#eyecatch.delay3000{ animation-delay: 3000ms;}

@media screen and (max-width: 600px) {
#eyecatch .slick-slide img.ofi{ min-width:100%;}
#main_img .logo{ transform: translate( -50%, -95%); width: 62px;}
#main_img .txt{ transform: translate( -50%, 40px); font-size: 20px; line-height: 1.8; letter-spacing: 0.15em;}
#main_img .open{ transform: translate( -50%, 140px); font-size: 18px; letter-spacing: 0.15em;}
}

/* アイキャッチエリアでボヤけながら表示させる */
.blurIn{ opacity: 0; filter: blur(10px); animation: blurIn 1.5s ease-out forwards; }

@keyframes blurIn {
0% { opacity: 0; filter: blur(10px); }
100% { opacity: 1; filter: blur(0); }
}

/* ---------------------------------------------------
Section Concept
------------------------------------------------------ */
.sec_concept{ background: #212121 url(../../img/concept_bg_01.webp) no-repeat center top; background-size: 100%; position: relative; min-height: 1400px; padding: 0 0 0 70px;}
.sec_concept .tit_01,
.sec_concept .box_txt_01,
.sec_concept .box_txt_02,
.sec_concept .img_01,
.sec_concept .img_02,
.sec_concept .img_03{ position: absolute; left: 50%; overflow: hidden;}
.sec_concept .tit_01{ font-size: 30px; line-height: 2.16; top: 230px; margin: 0 0 0 -530px;}
.sec_concept .box_txt_01{ width: 620px; top: 230px; margin: 0 0 0 -300px;}
.sec_concept .box_txt_02{ width: 510px; top: 830px; margin: 0 0 0 130px;}
.sec_concept .img_01{ width: 280px; height: 375px; top: 330px; margin: 0 0 0 360px;}
.sec_concept .img_02{ width: 500px; height: 320px; top: 700px; margin: 0 0 0 -570px;}
.sec_concept .img_03{ width: 300px; height: 220px; top: 980px; margin: 0 0 0 -240px;}
.sec_concept .txt_01{ font-size: 16px; line-height: 2.5; padding: 0 0 3em;}

@media screen and (max-width: 600px) {
.sec_concept{ background: #212121 url(../../img/concept_bg_02.webp) no-repeat center top; min-height: auto; padding: 100px 0 70px;}
.sec_concept .tit_01,
.sec_concept .box_txt_01,
.sec_concept .box_txt_02,
.sec_concept .img_01,
.sec_concept .img_02,
.sec_concept .img_03{ position: static; height: auto;}
.sec_concept .tit_01{ font-size: 24px; line-height: 2.16; margin: 0 auto 40px; transform: none;}
.sec_concept .box_txt_01{ width: 85%; margin: 0 auto;}
.sec_concept .box_txt_02{ width: 85%; margin: 0 auto;}
.sec_concept .img_01{ width: 46%; margin: 0 0 0 auto;}
.sec_concept .img_02{ width: 63%; margin: 0 auto 0 0;}
.sec_concept .img_03{ width: 40%; margin: -15px 0 2em 46%;}
.sec_concept .txt_01{ font-size: 15px; line-height: 2.5; padding: 0 0 2em;}
}

/* ---------------------------------------------------
Section Rooms
------------------------------------------------------ */
.sec_rooms{ padding: 100px 0;}
.sec_rooms .box_tabs{ position: relative; z-index: 2; width: 1060px; margin: 0 auto; display: flex; justify-content: space-between; border-right: solid 1px #787878; border-left: solid 1px #787878;}
.sec_rooms .box_tabs.top{ margin: 0 auto 80px;}
.sec_rooms .box_tabs.btm{ margin: 140px auto 0;}
.sec_rooms .box_tabs .switch_tab{ width: 50%; background: #212121; cursor: pointer; padding: 20px 0; transition: filter 0.5s; text-align: center; position: relative;}
.sec_rooms .box_tabs .switch_tab.on{ background: #cecece; color: #212121;}
.sec_rooms .box_tabs.top .switch_tab.on::before{ content: ""; display: block; width: 1px; height: 50px; position: absolute; bottom: -50px; left: 50%; background-color: #cecece;}
.sec_rooms .box_tabs .switch_tab:hover{ filter: brightness(1.2);}
.sec_rooms .box_tabs .switch_tab span{ font-size: 20px;}
.sec_rooms .box_tabs .switch_tab span.reading{ font-size: 14px; color: #7f7f7f;}
.sec_rooms .box_tabs .switch_tab.on span.reading{ color: #5d5d5d;}
.sec_rooms .box_details{ position: relative; z-index: 3; width: 90%; max-width: 1270px; margin: 0 auto;}
.sec_rooms .box_details .switch_detail{ display: none; opacity: 0; transition: opacity 0.6s ease, transform 0.6s ease;}
.sec_rooms .box_details .switch_detail.view{ display: flex; flex-direction: column; animation: fadeIn 0.6s ease forwards;}
.sec_rooms .sec_in{ display: flex; justify-content: space-between; align-items: flex-start;}
.sec_rooms .sec_in.lead{ padding: 0 0 50px 0; border-bottom: solid 1px #373737;}
.sec_rooms .sec_in.feature{ padding: 80px 0 0 0;}
.sec_rooms .sec_in.offer{ padding: 80px 0 0 0;}
.sec_rooms .sec_in.info{ padding: 80px 0 80px 0;}
.sec_rooms .sec_in .box_txt{ width: 420px;}
.sec_rooms .sec_in .tit_01{ font-size: 34px; line-height: 1.35; text-align: center; padding: 50px 0;}
.sec_rooms .sec_in .tit_01 span.reading{ font-size: 20px;}
.sec_rooms .sec_in .txt_01{ font-size: 24px; padding: 0 0 20px;}
.sec_rooms .sec_in .txt_02{ font-size: 16px; line-height: 1.8;}
.sec_rooms .sec_in .box_imgs{ width: 800px; height: 550px;}
.sec_rooms .sec_in .box_imgs img{ width: 100%; height: auto;}
.sec_rooms .sec_in .box_imgs .slick-current img{ animation:blurAnim 10s ease forwards;}
.sec_rooms .sec_in .tit_02{ display: flex; justify-content: flex-start; align-items: center; width: 180px; font-size: 22px;}
.sec_rooms .sec_in .list_01,
.sec_rooms .sec_in .data,
.sec_rooms .sec_in .box_txt.full{ width: 1050px;}
.sec_rooms .sec_in .list_01{ width: 660px; counter-reset: listnum;}
.sec_rooms .sec_in .list_01 dt{ font-size: 18px; padding: 0 0 10px 0;}
.sec_rooms .sec_in .list_01 dt::before{  counter-increment: listnum; content: counter(listnum) ". ";}
.sec_rooms .sec_in .list_01 dd{ font-size: 16px; line-height: 1.8; padding: 0 0 40px 0;}
.sec_rooms .sec_in .box_imgs2{ width: 300px;}
.sec_rooms .sec_in .box_imgs2 img{ width: 100%; height: auto;}
.sec_rooms .sec_in .data > div{ display: flex; border-bottom: solid 1px #373737;}
.sec_rooms .sec_in .data dt,
.sec_rooms .sec_in .data dd{ box-sizing: border-box;}
.sec_rooms .sec_in .data dt{ width: 10em; padding: 15px 0 15px 40px;}
.sec_rooms .sec_in .data dd{ width: calc( 100% - 10em ); padding: 15px 40px 15px 0;}
.sec_rooms .btn_01{ width: 350px; height: 60px; margin: 0 auto;}
.sec_rooms .btn_01 a{ width: 100%; height: 100%; background-color: #8e5943; transition: all 0.5s; text-align: center; font-size: 18px; line-height: 60px; display: block;}
.sec_rooms .btn_01 a:hover{ background-color: #a6674d; text-decoration: none;}

@media screen and (max-width: 600px) {
.sec_rooms{ padding: 50px 0 20px;}
.sec_rooms .cmn_tit_01 span.ja { font-size: 16px; padding: 15px 0 50px; }
.sec_rooms .box_tabs{ width: 85%; flex-direction: column; border-right: none; border-left: none;}
.sec_rooms .box_tabs.top{ margin: 0 auto 0;}
.sec_rooms .box_tabs.btm{ margin: 60px auto 0;}
.sec_rooms .box_tabs .switch_tab{ width: 100%; background: #3c3c3c; color: #fff; padding: 20px 0; margin: 0 0 15px; /* border: solid 1px #7c7c7c; */ position: relative;}
.sec_rooms .box_tabs .switch_tab::after{ content: ""; width: 10px; height: 10px; border-right: solid 1px #7f7f7f;  border-bottom: solid 1px #7f7f7f; position: absolute; right: 20px; top: 25px; transform: rotate(45deg);}
.sec_rooms .box_tabs .switch_tab.on{ background: #cecece; color: #212121; border: solid 1px #cecece;}
.sec_rooms .box_tabs .switch_tab.on::after{ border-right: solid 1px #7f7f7f;  border-bottom: solid 1px #7f7f7f;}
.sec_rooms .box_tabs.top .switch_tab.on::before{ display: none;}
.sec_rooms .box_tabs .switch_tab span{ font-size: 18px;}
.sec_rooms .box_tabs .switch_tab span.reading{ font-size: 12px;}
.sec_rooms .box_details{ max-width: 85%;}
.sec_rooms .sec_in{ flex-direction: column;}
.sec_rooms .sec_in.lead{ padding: 0 0 30px 0;}
.sec_rooms .sec_in.feature{ padding: 30px 0 0 0;}
.sec_rooms .sec_in.offer{ padding: 0;}
.sec_rooms .sec_in.info{ padding: 30px 0 50px 0;}
.sec_rooms .sec_in .box_txt{ width: 90%; margin: 0 auto;}
.sec_rooms .sec_in .tit_01{ font-size: 26px; line-height: 1.35; padding: 30px 0 40px;}
.sec_rooms .sec_in .tit_01 span.reading{ font-size: 15px; line-height: 1.8;}
.sec_rooms .sec_in .txt_01{ font-size: 20px; padding: 0 0 10px;}
.sec_rooms .sec_in .txt_02{ font-size: 15px; line-height: 1.8;}
.sec_rooms .sec_in .box_imgs{ width: 100%; height: auto; padding: 40px 0 0;}
.sec_rooms .sec_in .tit_02{ width: 100%; font-size: 20px; -webkit-writing-mode: horizontal-tb; -ms-writing-mode: lr-tb; writing-mode: horizontal-tb; padding: 0 0 20px;}
.sec_rooms .sec_in .list_01,
.sec_rooms .sec_in .data,
.sec_rooms .sec_in .box_txt.full{ width: 100%;}
.sec_rooms .sec_in .list_01{ flex-direction: column; width: 100%; counter-reset: listnum;}
.sec_rooms .sec_in .list_01 dt{ font-size: 17px; padding: 0 0 10px 0;}
.sec_rooms .sec_in .list_01 dt::before{  counter-increment: listnum; content: counter(listnum) ". ";}
.sec_rooms .sec_in .list_01 dd{ font-size: 15px; line-height: 1.8; padding: 0 0 30px 0;}
.sec_rooms .sec_in .box_imgs2{ width: 100%; display: flex;}
.sec_rooms .sec_in .box_imgs2 img{ width: 50%;}
.sec_rooms .sec_in .data{ border-top: solid 1px #373737;}
.sec_rooms .sec_in .data > div{ display: block;}
.sec_rooms .sec_in .data dt{ width: 100%; padding: 15px 0 0; font-size: 16px;}
.sec_rooms .sec_in .data dd{ width: 100%; padding: 10px 0 15px; font-size: 15px; line-height: 1.8;}
.sec_rooms .btn_01{ width: 80%;}
.sec_rooms .btn_01 a {font-size: 16px;}
}

@keyframes fadeIn {
0% { opacity: 0; }
100% { opacity: 1; }
}
@keyframes blurAnim{
0%{ opacity:0; filter:blur(12px); }
15%{ opacity:1; filter:blur(0); }
100%{ opacity:1; filter:blur(0); }
}

/* ---------------------------------------------------
Section Breakfast
------------------------------------------------------ */
.sec_breakfast{ padding: 120px 0;}
.sec_breakfast .box_in{ width: 90%; max-width: 1220px; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start;}
.sec_breakfast .box_txt{ width: 380px;}
.sec_breakfast .box_txt .cmn_tit_01{ text-align: left;}
.sec_breakfast .box_txt .txt_01{ font-size: 24px; padding: 0 0 20px;}
.sec_breakfast .box_txt .txt_02{ font-size: 16px; line-height: 1.8;}
.sec_breakfast .box_img{ width: 770px;}
.sec_breakfast .box_img img{ width: 100%; height: auto;}

@media screen and (max-width: 600px) {
.sec_breakfast{ padding: 50px 0 90px;}
.sec_breakfast .box_in{ width: 85%; max-width: 85%; flex-direction: column;}
.sec_breakfast .box_txt{ width: 100%;}
.sec_breakfast .box_txt .cmn_tit_01{ text-align: center;}
.sec_breakfast .box_txt .txt_01{ font-size: 20px; padding: 0 0 20px;}
.sec_breakfast .box_txt .txt_02{ font-size: 15px; line-height: 1.8;}
.sec_breakfast .box_img{ width: 100%; padding: 30px 0 0;}
}

/* ---------------------------------------------------
Section Dining / Cafe
------------------------------------------------------ */
.sec_dining{ padding: 100px 0 130px; background-color: #dedede; color: #212121; transition: all ease 1.2s;/* background-color: transparent; transition: all ease 1.2s; */}
.is-district .sec_dining{  background-color: #212121; color: #eee;}
.sec_dining .cmn_tit_01 span.ja { padding: 20px 0 50px;}
.sec_dining .box_in{ width: 90%; max-width: 1270px; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start; padding: 0 0 70px;}
.sec_dining .logo{ width: 171px; margin: 0 auto 50px; padding: 0 20px 0 0;}
.sec_dining .img_01{ width: 770px;}
.sec_dining .img_01 img,
.sec_dining .logo img{ width: 100%; height: auto;}
.sec_dining .box_txt{ width: 420px; display: flex; justify-content: center; flex-direction: column;}
.sec_dining .txt_01{ font-size: 24px; line-height: 2; display: flex; justify-content: center; align-items: center; height: fit-content; padding: 0 0 40px; }
.sec_dining .txt_02{ line-height: 2.1; padding: 0 0 1.5em;}
.sec_dining .tit_01{ width: 100%; max-width: 1270px; margin: 0 auto 20px; font-size: 22px; color: #545454;}
.sec_dining .marquee-container { overflow: hidden; width: 100%; }
.sec_dining .marquee { display: flex; padding: 0; margin: 0; list-style: none; width: max-content; animation: marquee-reverse 40s linear infinite; }
.sec_dining .marquee li { flex-shrink: 0; margin: 0 5px;}
.sec_dining .marquee img { display: block; }

@media screen and (max-width: 600px) {
.sec_dining{ padding: 50px 0 80px;}
.sec_dining .cmn_tit_01 span.ja { padding: 20px 0 30px;}
.sec_dining .box_in{ width: 85%; max-width: 85%; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start; flex-direction: column; padding: 0 0 10px;}
.sec_dining .logo{ width: 171px; margin: 40px auto 30px; padding: 0 20px 0 0;}
.sec_dining .img_01{ width: 100%;}
.sec_dining .img_01 img,
.sec_dining .logo img{ width: 100%; height: auto;}
.sec_dining .box_txt{ width: 100%; display: flex; justify-content: center; flex-direction: column;}
.sec_dining .txt_01{ font-size: 20px; line-height: 2; display: flex; justify-content: center; align-items: center; height: fit-content; padding: 0 0 20px; }
.sec_dining .txt_02{ font-size: 15px; line-height: 1.8; padding: 0 0 1.5em;}
.sec_dining .tit_01{ width: 90%; max-width: 90%; margin: 0 auto 20px; font-size: 20px; color: #545454;}
.sec_dining .marquee img { width: 250px; }
}

@keyframes marquee-reverse {
0% { transform: translateX(0); }
100% { transform: translateX(-50%); }
}

/* ---------------------------------------------------
Section Lounge
------------------------------------------------------ */
/* .sec_lounge{ padding: 120px 0;}
.sec_lounge .box_in{ width: 90%; max-width: 1220px; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start;}
.sec_lounge .box_txt{ width: 380px;}
.sec_lounge .box_txt .cmn_tit_01{ text-align: left;}
.sec_lounge .box_txt .txt_01{ font-size: 24px; padding: 0 0 20px;}
.sec_lounge .box_txt .txt_02{ font-size: 16px; line-height: 1.8;}
.sec_lounge .box_img{ width: 770px;}
.sec_lounge .box_img img{ width: 100%; height: auto;}

@media screen and (max-width: 600px) {
.sec_lounge{ padding: 40px 0 0;}
.sec_lounge .box_in{ width: 85%; max-width: 85%; flex-direction: column;}
.sec_lounge .box_txt{ width: 100%;}
.sec_lounge .box_txt .cmn_tit_01{ text-align: center;}
.sec_lounge .box_txt .txt_01{ font-size: 20px; padding: 0 0 20px;}
.sec_lounge .box_txt .txt_02{ font-size: 15px;}
.sec_lounge .box_img{ width: 100%; padding: 30px 0 0;}
} */


/* ---------------------------------------------------
Section Higashi Chaya District
------------------------------------------------------ */
.sec_district{ padding: 100px 0; background-color: #dedede; color: #525252; transition: all ease 1.2s;}
.is-district .sec_district{ background-color: #212121; color: #eee;}
.sec_district .box_lead{ position: relative;}
.sec_district .box_lead .img_01{ width: 100%;}
.sec_district .box_lead .img_01 img{ width: 100%; height: auto;}
.sec_district .box_lead .box_txt{ position: absolute; top: 50%; left: 50%; transform: translate( 150px, -50% ); display: flex; flex-direction: column; justify-content: center; align-items: flex-start; width: 410px;}
.sec_district .box_lead .txt_01{ font-size: 24px; padding: 0 0 20px;}
.sec_district .box_lead .txt_02{ font-size: 16px; line-height: 1.8; padding: 0 0 2em;}
.sec_district .box_in{ width: 100%; max-width: 1270px; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start; position: relative; padding: 90px 0 0;}
.sec_district .box_in .tit_01{ position: sticky; top: 20px; z-index: 10; display: flex; justify-content: flex-start; align-items: center; width: 180px; font-size: 22px; height: fit-content;  }
.sec_district .box_in .box_flow{ width: 1050px;}
.sec_district .list_imgs{ display: flex; justify-content: space-between; margin: 90px 0 0 0;}
.sec_district .list_imgs:first-of-type{ margin: 0;}
.sec_district .list_imgs li{ width: 340px; text-align: right;}
.sec_district .list_imgs li img{ width: 100%; height: auto;}
.sec_district .list_imgs li small{ font-size: 15px; line-height: 1; color: #8c8c8c;}
.sec_district .tit_02{ font-size: 22px; line-height: 1; padding: 50px 0;}
.sec_district .list_01 { padding: 10px 0 0 5px; margin: 0; overflow: hidden;}
.sec_district .list_01 > div { position: relative; padding-left: 32px; padding-bottom: 48px;  margin-top: -10px; }
.sec_district .list_01 > div:last-child { padding-bottom: 0; }
.sec_district .list_01 > div::before { content: ""; position: absolute; left: 4px; top: 8px; width: 1px; background-color: #8c8c8c; bottom: 0;  }
.sec_district .list_01 > div::after { content: ""; position: absolute; left: 0; top: 8px; width: 9px; height: 9px; background-color: #8c8c8c; border-radius: 50%; z-index: 2; }
.sec_district .list_01 dt { font-size: 20px; line-height: 1.5; margin-bottom: 15px; }
.sec_district .list_01 dd { margin-left: 0; font-size: 16px; line-height: 1.8; }

@media screen and (max-width: 600px) {
.sec_district{ padding: 50px 0;}
.sec_district .cmn_tit_01 span.en2{ font-size: 30px;}
.sec_district .box_lead{ position: relative;}
.sec_district .box_lead .box_txt{ position: static; transform: none; width: 100%; padding: 50px 5% 0;}
.sec_district .box_lead .txt_01{ font-size: 20px; padding: 0 0 20px;}
.sec_district .box_lead .txt_02{ font-size: 15px; padding: 0 0 1.7em;}
.sec_district .box_in{ width: 85%; max-width: 85%; margin: 0 auto; display: block; position: static; padding: 0;}
.sec_district .box_in .tit_01{ position: static; display: block; width: 100%; font-size: 18px; height: fit-content; -webkit-writing-mode: horizontal-tb; -ms-writing-mode: lr-tb; writing-mode: horizontal-tb; padding: 50px 0 20px;}
.sec_district .box_in .box_flow{ width: 100%;}
.sec_district .list_imgs{ margin: 50px 0 0 0;}
.sec_district .list_imgs:first-of-type{ margin: 0;}
.sec_district .list_imgs li{ width: 32%;}
.sec_district .list_imgs li small{ font-size: 12px;}
.sec_district .tit_02{ font-size: 16px; padding: 20px 0;}
.sec_district .list_01 { padding: 10px 0 0 5px; margin: 0;}
.sec_district .list_01 > div { position: relative; padding-left: 32px; padding-bottom: 48px;  margin-top: -10px; }
.sec_district .list_01 dt { font-size: 16px; line-height: 1.5;}
.sec_district .list_01 dd { font-size: 15px;}
}

/* ---------------------------------------------------
Section Access
------------------------------------------------------ */
.sec_access{ padding: 100px 0 0;}
.sec_access .box_gmap{ width: 1270px; height: 480px; margin: 0 auto; filter: grayscale(1);}
.sec_access .box_gmap iframe{ width: 100%; height: 100%;}
.sec_access .tabs .panel:not(:first-of-type) { display: none;}
.sec_access .tabs ul { position: relative; z-index: 2; width: 100%; display: flex; justify-content: center; border-bottom: solid 1px #787878; margin: 90px 0 0;}
.sec_access .tabs ul li { width: 335px; height: 60px; margin: 0 0 -1px;}
.sec_access .tabs ul li a { cursor: pointer; padding: 0; text-align: center; position: relative; box-sizing: border-box; display: block; width: 100%; height: 100%; font-size: 18px; line-height: 60px; transition: background-color 0.5s;}
.sec_access .tabs ul li a:hover{ text-decoration: none; background-color: rgba(255, 255, 255, 0.05); border-bottom: solid 1px #787878;}
.sec_access .tabs ul li a.active { background-color: #212121; border-top: solid 1px #787878; border-left: solid 1px #787878; border-right: solid 1px #787878; border-bottom: solid 1px #212121;}
.sec_access .tabs .panel { padding: 100px 0;}
.sec_access .tabs .panel h3 { padding: 0 0 40px; font-size: 24px; text-align: center;}
.sec_access .tabs .panel img { display: block; width: 1000px; margin: 0 auto;}
.sec_access .sec_detail { margin: 80px 0 0;}
.sec_access .sec_detail dl { display: flex; padding: 26px 0; border-bottom: 1px solid #d9d9d9;}
.sec_access .sec_detail dl dt { width: 280px;}
.sec_access .sec_detail dl dd { width: calc(100% - 280px);}
.sec_access .sec_detail dl+a { display: table; margin: 15px 0 0 auto; padding: 0 0 10px 30px; background: url(../img/h_arrow.svg)no-repeat left 4px; background-size: 15px; border-bottom: 1px solid #d9d9d9;}
.sec_access .note{ width: 90%; max-width: 1000px; margin: 40px auto 0; display: flex; justify-content: center; padding: 0 0 0 1em; text-indent: -1em; box-sizing: border-box;}

@media screen and (max-width: 600px) {
.sec_access { padding: 50px 0 20px;}
.sec_access .box_gmap{ width: 85%; height: 300px; overflow: hidden;}
.sec_access .tabs ul { display: none;}
.sec_access .tabs .panel { margin: 40px auto 0; padding: 30px 0; border: solid 1px #545454; width: 85%;}
.sec_access .tabs .panel:not(:first-of-type) { display: inherit;}
.sec_access .tabs .panel h3 { padding: 0 0 20px; font-size: 18px;}
.sec_access .box_route { width: 90%; margin: 0 auto;}
.sec_access .box_route dl{ padding: 0 0 20px;}
.sec_access .box_route .acc_tit{ background: #eaeaea; color: #212121; text-align: center; padding: 10px 0; font-size: 15px; line-height: 1.8; line-height: 1.8; position: relative;}
.sec_access .box_route .acc_tit span { display: block;}
.sec_access .box_route .acc_tit::after{ content: ""; display: block; width: 7px; height: 7px; border-bottom: solid 1px #585858; border-right: solid 1px #585858; transform: rotate(45deg); position: absolute; top: calc(50% - 3.5px); right: 20px; transition: transform 0.5s;}
.sec_access .box_route .acc_tit.active::after{ transform: rotate(-135deg); }
.sec_access .box_route .acc_contents ol{ list-style-type: none; position: relative;}
.sec_access .box_route .acc_contents ol::after{ content: ""; display: block; width: 1px; height: 100%; background: #d0d0d0; position: absolute; top: 0; left: 50%; z-index: 1;}
.sec_access .box_route .acc_contents ol li{ position: relative; z-index: 2; line-height: 1.5;}
.sec_access .box_route .acc_contents ol li.way{ font-size: 15px; line-height: 1.8; text-align: center; padding: 20px 0;}
.sec_access .box_route .acc_contents ol li.way span{ width: 100%; padding: 10px 0; display: inline-block; background: #fff; color: #212121;}
.sec_access .box_route .acc_contents ol li.point{ background: #f5f5f5; font-size: 15px; line-height: 1.8; text-align: center; padding: 10px 0; color: #212121;}
.sec_access .box_route .acc_contents ol li.goal{ background: #454546; color: #fff; font-size: 15px; line-height: 1.8; text-align: center; padding: 10px 0;}
.sec_access .box_route .acc_contents ol li.goal span{ font-size: 17px;}
.sec_access .sec_detail { margin: 50px 0 0;}
.sec_access .sec_detail dl { display: block; padding: 10px 0;}
.sec_access .sec_detail dl dd { width: 100%;}
.sec_access .note{ width: 90%; max-width: 90%; margin: 0 auto 0; font-size: 15px;}
}

/* ---------------------------------------------------
Section Information
------------------------------------------------------ */
.sec_info{ padding: 100px 0 150px;}
.sec_info .data{ width: 90%; max-width: 1070px; margin: 0 auto;}
.sec_info .data > div{ display: flex; border-bottom: solid 1px #373737;}
.sec_info .data dt,
.sec_info .data dd{ box-sizing: border-box; line-height: 2.1;}
.sec_info .data dt{ width: 16em; padding: 20px 40px;}
.sec_info .data dd{ width: calc( 100% - 16em ); padding: 20px 40px;}
.sec_info .data dd .open{ padding: 0 0 0 1em;}

@media screen and (max-width: 600px) {
.sec_info{ padding: 50px 0 80px;}
.sec_info .data{ width: 85%; max-width: 85%; border-top: solid 1px #373737;}
.sec_info .data > div{ display: block;}
.sec_info .data dt{ width: 100%; padding: 10px 0 0; font-size: 16px; line-height: 1.5;}
.sec_info .data dd{ width: 100%; padding: 5px 0 10px; font-size: 15px;}
.sec_info .data dd .open{ padding: 0;}
}

/* ---------------------------------------------------
Fixed Background Image
------------------------------------------------------ */
.fixed_bg{ position:relative; width:100%; height:500px; overflow:hidden; background-position:center center; background-size:cover; background-repeat:no-repeat; background-attachment:fixed; }

/* room */
.fixed_bg.room{ background-image:url("../../img/fixed_bg_01.webp"); }
.room_img{ }

/* cafe */
.fixed_bg.cafe{ background-image:url("../../img/fixed_bg_02.webp"); }

@media screen and (max-width: 600px) {
.fixed_bg{ height: 250px; background-attachment: scroll; }
}