@charset "UTF-8";
/* ===================================================
	Guest Room CSS
====================================================== */

/* ---------------------------------------------------
Box Local Navigation
------------------------------------------------------ */
.box_lnav{ text-align: center; padding: 50px 0 90px;}
.box_lnav .txt_01{ margin: 0 0 50px; display: inline-block; font-size: 16px; line-height: 1.1; color: #c23e6c; position: relative; }
.box_lnav .lnav{ display: flex; justify-content: center; align-items: stretch;}
.box_lnav .lnav li{ width: 290px; margin: 0 5px;}
.box_lnav .lnav li a{ display: flex; justify-content: center; align-items: center; font-size: 18px; line-height: 1.6; height: 100px; width: 100%; border-top: solid 3px #dfd6d1; position: relative; padding: 0 0 10px;}
.box_lnav .lnav li a::after{ content: ""; display: block; width: 8px; height: 8px; border-bottom: solid 3px #dfd6d1; border-right: solid 3px #dfd6d1; transform: rotate(45deg); position: absolute; bottom: 15px; left: 0; right: 0; margin: 0 auto; transition: bottom 0.5s;}
.box_lnav .lnav li a:hover{ text-decoration: none;}
.box_lnav .lnav li a:hover::after{ bottom: 10px;}

@media screen and (max-width: 600px) {
.box_lnav{ padding: 30px 0;}
.box_lnav .txt_01{ margin: 0 5% 20px; line-height: 1.5; text-align: left;}
.box_lnav .lnav{ flex-direction: column; width: 90%; margin: 0 auto; border-bottom: solid 1px #dfd6d1;}
.box_lnav .lnav li{ width: 100%; margin: 0;}
.box_lnav .lnav li a{ font-size: 16px; line-height: 1.4; height: 60px; border-top: solid 1px #dfd6d1; padding: 0;}
.box_lnav .lnav li a::after{ width: 8px; height: 8px; border-bottom: solid 2px #dfd6d1; border-right: solid 2px #dfd6d1; top: 0; bottom: 0; left: inherit; right: 15px; margin: auto 0;}
.box_lnav .lnav li a:hover::after{ bottom: 3px;}
}

/* ---------------------------------------------------
Section Index Type 01
------------------------------------------------------ */
.sec_index_01{ background: #f3efe9; padding: 100px 0;}
.sec_index_01:nth-of-type(2n){ background: #fff; }
.sec_index_01 a{ display: block;}
.sec_index_01 a:hover{ text-decoration: none;}
.sec_index_01 .inner_md{ display: flex; flex-wrap: wrap; justify-content: space-between;}
.sec_index_01 .tit_01{ width: 100%; line-height: 1.6; }
.sec_index_01 .tit_01 .sub{ font-size: 24px;}
.sec_index_01 .tit_01 .main{ font-size: 35px;}
.sec_index_01 .tit_01 .en{ padding: 0;}
.sec_index_01 .txt_01{ padding: 20px 0 0; width: 100%; font-size: 24px; line-height: 1.7; text-align: center; opacity: 0.7;}
.sec_index_01 .sec_in{ width: 48.3%; max-width: 580px; margin: 60px 0 0;}
.sec_index_01 .box_img_tit{ position: relative; }
.sec_index_01 .box_img_tit .tit_02{ position: absolute; bottom: 40px; left: 0; width: 100%; text-align: center; color: #fff; z-index: 2;}
.sec_index_01 .box_img_tit .tit_02 .sub,
.sec_index_01 .box_img_tit .tit_02 .main{ display: block;}
.sec_index_01 .box_img_tit .tit_02 .sub{ font-size: 16px;}
.sec_index_01 .box_img_tit .tit_02 .main{ font-size: 28px;}
.sec_index_01 .box_img_tit img{ width: 100%; height: auto; position: relative; z-index: 1;}
.sec_index_01 .txt_02{ font-size: 15px; line-height: 1.5; opacity: 0.7; padding: 20px 0 0;}
.sec_index_01 .note_01{ display: block; width: 100%; font-size: 13px; line-height: 1.5; opacity: 0.7; text-align: center; padding: 50px 0 0;}

@media screen and (max-width: 600px) {
.sec_index_01{ padding: 50px 0;}
.sec_index_01 .inner_md{ flex-direction: column;}
.sec_index_01 .tit_01{ width: 100%; line-height: 1.6; }
.sec_index_01 .tit_01 .sub{ font-size: 20px;}
.sec_index_01 .tit_01 .main{ font-size: 28px;}
.sec_index_01 .txt_01{ padding: 10px 0 0; font-size: 20px; line-height: 1.7; text-align: center;}
.sec_index_01 .sec_in{ width: 100%; max-width: 100%; margin: 30px 0 0;}
.sec_index_01 .box_img_tit .tit_02{ bottom: 20px;}
.sec_index_01 .box_img_tit .tit_02 .sub{ font-size: 14px;}
.sec_index_01 .box_img_tit .tit_02 .main{ font-size: 24px;}
.sec_index_01 .txt_02{ font-size: 14px; line-height: 1.5; padding: 10px 0 0;}
.sec_index_01 .note_01{ font-size: 12px; line-height: 1.5; text-align: center; padding: 20px 0 0;}
}

/* ---------------------------------------------------
Section Detail
------------------------------------------------------ */
.sec_detail_01{ padding: 100px 0; }
.sec_detail_01 .tit_01{ display: block; line-height: 1.4;}
.sec_detail_01 .tit_01 .floor{ display: inline-block; border: solid 1px #dfd6d1; padding: 10px 30px; font-size: 15px; line-height: 1; color: rgba(96,50,25,0.7); margin: 0 0 20px;}
.sec_detail_01 .tit_01 .sub{ font-size: 28px;}
.sec_detail_01 .tit_01 .main{ font-size: 35px;}
.sec_detail_01 .tit_01 .en{ padding: 10px 0 50px;}
.sec_detail_01 .txt_01{ text-align: center; font-size: 16px; line-height: 1.9; padding: 20px 0 40px;}
.sec_detail_01 .tbl_01{ width: 100%; margin: 0 0 30px;}
.sec_detail_01 .tbl_01 caption{ font-size: 13px; text-align: left; color: #e78c67; background: #E78C67; background: linear-gradient(to right, #E78C67 0%, #C88BCA 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; letter-spacing: 0.16em; padding: 0 0 15px; display: inline-block;}
.sec_detail_01 .tbl_01 tbody{ border-top: solid 1px #dfd6d1;}
.sec_detail_01 .tbl_01 th,
.sec_detail_01 .tbl_01 td{ padding: 15px 30px; font-size: 15px; line-height: 2; text-align: left; vertical-align: top; border-bottom: solid 1px #dfd6d1;}
.sec_detail_01 .tbl_01 th{ width: 20%; font-weight: 700; background: #f8f5f2; }
.sec_detail_01 .tbl_01 td{ width: 80%;}
.sec_detail_01 .note_01{ font-size: 14px; line-height: 2; opacity: 0.7;}
.sec_detail_01 .box_btns{ display: flex; justify-content: center;}
.sec_detail_01 .btn_01{ margin: 10px auto 0;}
.sec_detail_01 .box_btns .btn_01{ margin: 10px 10px 0;}

@media screen and (max-width: 600px) {
.sec_detail_01{ padding: 50px 0; }
.sec_detail_01 .tit_01 .floor{ padding: 10px 30px; font-size: 13px; margin: 0 0 10px;}
.sec_detail_01 .tit_01 .sub{ font-size: 20px;}
.sec_detail_01 .tit_01 .main{ font-size: 28px;}
.sec_detail_01 .tit_01 .en{ padding: 10px 0 20px;}
.sec_detail_01 .txt_01{ text-align: left; font-size: 15px; line-height: 1.7; padding: 10px 0 20px;}
.sec_detail_01 .tbl_01{ margin: 0 0 20px; display: block; box-sizing: border-box;}
.sec_detail_01 .tbl_01 caption{ font-size: 13px; letter-spacing: 0.16em; padding: 0 0 10px;}
.sec_detail_01 .tbl_01 tr{ display: block;}
.sec_detail_01 .tbl_01 th,
.sec_detail_01 .tbl_01 td{ display: block; padding: 10px; font-size: 14px; line-height: 1.7; box-sizing: border-box;}
.sec_detail_01 .tbl_01 th{ width: 100%; border-bottom: none;}
.sec_detail_01 .tbl_01 td{ width: 100%;}
.sec_detail_01 .note_01{ font-size: 13px; line-height: 1.7;}
.sec_detail_01 .box_btns{ flex-direction: column;}
.sec_detail_01 .btn_01{ margin: 20px 0 0; width: 100%;}
.sec_detail_01 .box_btns .btn_01{ margin: 20px 0 0;}
}

/* ---------------------------------------------------
Section Room Type List
------------------------------------------------------ */
.sec_roomtype_01{ padding: 100px 0; background: #f3efe9; }
.sec_roomtype_01 .tit_01{ text-align: center; font-size: 28px; line-height: 1; padding: 0 0 50px; opacity: 0.7; letter-spacing: 0.1em;}
.sec_roomtype_01 .box_types{ display: flex; justify-content: space-between;}
.sec_roomtype_01 .box_types dl{ width: 19.5%; max-width: 270px; display: flex; flex-direction: column;}
.sec_roomtype_01 .box_types dt{ margin: 0 0 10px;}
.sec_roomtype_01 .box_types dt .thumb{ display: block;}
.sec_roomtype_01 .box_types dt .thumb img{ width: 100%; height: auto;}
.sec_roomtype_01 .box_types dt .tit{ display: flex; flex-direction: column; align-items: center; justify-content: center; height: 90px; font-size: 20px; line-height: 1.4; padding: 0; text-align: center; border-bottom: solid 1px #d6c9bf;}
.sec_roomtype_01 .box_types dt .tit span{ display: block;}
.sec_roomtype_01 .box_types dt .tit small{ display: block; font-size: 14px;}
.sec_roomtype_01 .box_types dd{ padding: 10px 0; text-align: center; font-size: 16px; line-height: 1.5;}
.sec_roomtype_01 .btn_01{ margin: 30px auto 0;}
.sec_roomtype_01 .btn_01.cmn_btn_03 a::after{ background: #fff; }

@media screen and (max-width: 600px) {
.sec_roomtype_01{ padding: 50px 0;}
.sec_roomtype_01 .tit_01{ text-align: center; font-size: 22px; line-height: 1; padding: 0 0 20px; opacity: 0.7; letter-spacing: 0.1em;}
.sec_roomtype_01 .box_types{ display: flex; justify-content: space-between; flex-wrap: wrap;}
.sec_roomtype_01 .box_types dl{ width: 48%; max-width: 48%; display: flex; flex-direction: column; margin: 0 0 20px;}
.sec_roomtype_01 .box_types dt{ margin: 0 0 10px;}
.sec_roomtype_01 .box_types dt .tit{ height: 60px; font-size: 16px; line-height: 1.4;}
.sec_roomtype_01 .box_types dt .tit small{ font-size: 12px;}
.sec_roomtype_01 .box_types dd{ padding: 5px 0; font-size: 14px; line-height: 1.5;}
.sec_roomtype_01 .btn_01{ margin: 0; width: 100%;}
}

/* ---------------------------------------------------
客室追加
------------------------------------------------------ */
#sec_05 .inner_md{ display: flex;flex-wrap: wrap; justify-content: center;}
#sec_02 .sec_in{width: 33%;}
#sec_03{display: flex;    width: 90%; max-width: 1200px;margin: 0 auto;}
#sec_03 .inner_md{display: flex;flex-wrap: wrap;justify-content: space-between;    width: 66.6%;}
#sec_03 .inner_md:last-child{    display: initial;width:initial;width:33.3%}
#sec_03 .inner_md:last-child .sec_in{width:99%;margin-left:6px;}
#sec_03 .sec_in{width:49.5%;}
@media screen and (max-width: 600px) {
	#sec_02 .sec_in, #sec_03 .sec_in{width:initial;}
	#sec_03{display:initial;width:initial;}
	#sec_03 .inner_md,#sec_03 .inner_md:last-child .sec_in{width:90%;}
	#sec_03 .inner_md:last-child .sec_in{ margin: 30px auto;}
	#sec_03  .tit_01{padding: 50px 0 0;}
}

/*Current*/
.room_01 .sec_roomtype_01 .box_types dd.room_01 a,
.room_02 .sec_roomtype_01 .box_types dd.room_02 a,
.room_03 .sec_roomtype_01 .box_types dd.room_03 a,
.room_04 .sec_roomtype_01 .box_types dd.room_04 a,
.room_05 .sec_roomtype_01 .box_types dd.room_05 a,
.room_06 .sec_roomtype_01 .box_types dd.room_06 a,
.room_07 .sec_roomtype_01 .box_types dd.room_07 a,
.room_08 .sec_roomtype_01 .box_types dd.room_08 a{ color: #c23e6c; }
