@charset "utf-8";
/* ===================================================
	Rooms CSS
====================================================== */

/* ---------------------------------------------------
cnav & btn_amenity
------------------------------------------------------ */
.cmn_cnav_img { flex-wrap: wrap; padding: 50px 0;}
.cmn_cnav_img li { width: 380px; max-width: calc((100% - 60px) / 3); margin: 30px 0 0;}

.btn_amenity { padding: 0 0 105px; text-align: center;}
.btn_amenity a { display: inline-block; padding: 3px 0 3px 30px; position: relative; border-bottom: 1px solid #2f2f2f;}
.btn_amenity a::before { content: ''; width: 18px; height: 18px; position: absolute; left: 5px; top: 50%; background: url(../img/icon_link_arrow_b.svg) no-repeat center center; background-size: 100% auto; transform: translateY(-50%) rotate(90deg);}
.btn_amenity a::after { content: ''; width: 20px; height: 1px; position: absolute; right: 100%; bottom: -1px; background: #fff;}

@media screen and (hover: hover) {
	@keyframes arrow_hover {
		0% { opacity: 1; }
		60% { opacity: 1;}
		80% { right: -15px;}
		100% { right: -15px; opacity: 0;}
	}
	.btn_amenity a:hover { opacity: 1;}
	.btn_amenity a:hover::after { animation: arrow_hover 1.3s;}
}
@media screen and (max-width: 600px) {
	.cmn_cnav_img { padding: 30px 0;}

	.btn_amenity { padding-bottom: 60px;}
	.btn_amenity a { padding-left: 23px;}
	.btn_amenity a::before { width: 12px; height: 12px;}
}


/* ---------------------------------------------------
section
------------------------------------------------------ */
section { padding: 85px 0 100px;}
section:nth-of-type(odd) { background: #f3ede0;}
section .cmn_tit_h { margin-bottom: 50px;}
section .sec_tit { padding: 20px 0 0; margin-bottom: 40px; position: relative; color: #977901; font-size: 30px; line-height: 1.6; text-align: center;}
section .sec_tit::before { content: ''; width: 90px; height: 1px; position: absolute; top: 0; left: 50%; background: #af9337; transform: translateX(-50%);}
section .sec_tit:not(:first-of-type) { margin-top: 90px;}
section .sec_main .ofi { width: 100%; min-height: 600px;}
section .detail { display: flex; flex-direction: row-reverse; align-items: center; justify-content: space-between; margin-top: 65px;}
section .detail .txt { width: 650px;}
section .detail .layout { max-width: calc(100% - 690px); padding: 0 0 0 30px;}
section .detail .cmn_table { margin: 30px 0 0;}
section .detail .cmn_table th,
section .detail .cmn_table td { padding: 10px 0;}
section .detail .cmn_table th { width: 60px;}
section .items { display: flex; justify-content: space-between; margin-top: 95px;}
section .items li { width: 380px; max-width: calc((100% - 60px) / 3);}
section .items li p { margin: 10px 0 0;}
section .items li p span { font-size: 14px;}
section .cmn_btn { margin-top: 50px;}
section .cmn_btn .cmn_btn_y { width: 600px; margin: 0 auto; min-height: 75px;}
section .cmn_btn img { width: 25px; margin: 0 8px 0 0;}

/* sec05 */
#sec05 .cmn_btn .cmn_btn_y { font-size: 24px; line-height: 1.4;}
#sec05 .cmn_btn .cmn_btn_y span { font-size: 16px;}

/* sec06 */
#sec06 .detail .layout { max-width: calc(100% - 720px); padding: 0;}
#sec06 .items li { width: 327px; max-width: calc((100% - 90px) / 4);}
#sec06 .cmn_btn p { margin: 20px 0 0; text-align: center;}

/* sec07 */
#sec07 .cmn_tit_h { color: #977901;}
#sec07 .items { flex-wrap: wrap; padding: 0 0 45px;}
#sec07 .items li { width: 360px; max-width: calc((100% - 60px) / 3); margin: 0 0 35px;}
#sec07 .info { padding: 60px 100px; background: rgba(255, 255, 255, 0.7);}
#sec07 .info .cmn_table { font-size: 18px;}
#sec07 .info .cmn_table th { width: 190px;}
#sec07 .info dl { margin: 30px 0 0;}
#sec07 .info dd + dt { margin: 20px 0 0;}
#sec07 .info dd li::before { content: '・';}


@media screen and (max-width: 600px) {
	section { padding: 50px 0;}
	section .cmn_tit_h { margin-bottom: 30px;}
	section .sec_tit { padding-top: 10px; margin-bottom: 15px; font-size: 18px;}
	section .sec_tit::before { width: 50px;}
	section .sec_tit:not(:first-of-type) { margin-top: 50px;}
	section .sec_main .ofi { min-height: 200px;}
	section .detail { display: block; margin-top: 20px;}
	section .detail .txt { width: auto; margin: 0 0 30px;}
	section .detail .layout { max-width: none !important; padding: 0; margin: 0 auto; text-align: center;}
	section .detail .cmn_table { margin-top: 15px;}
	section .items { justify-content:space-between; margin-top: 30px;}
	section .items li { width: 49.5%; max-width: none; padding-bottom: 1em; }
	section .items li img { width: 100%;}
	section .items li p { margin-top: 5px; font-size: 13px; line-height: 1.6;}
	section .cmn_btn { margin-top: 30px;}
	section .cmn_btn .cmn_btn_y { width: 100%; min-height: 60px;}
	section .cmn_btn img { width: 25px; margin: 0 8px 0 0;}

	/* sec05 */
	#sec05 .cmn_btn .cmn_btn_y { padding: 10px; font-size: 20px; line-height: 1.6; text-align: center;}
	#sec05 .cmn_btn .cmn_btn_y span { font-size: 14px;}

	/* sec06 */
	#sec06 .items li { width: auto; max-width: none;}
	#sec06 .cmn_btn p { margin-top: 15px; text-align: left;}

	/* sec07 */
	#sec07 .items { display: flex; flex-wrap: wrap; padding-bottom: 30px;}
	#sec07 .items li { width: calc((100% - 5px) / 2); max-width: none; margin-bottom: 10px;}
	#sec07 .info { padding: 10px 20px 20px;}
	#sec07 .info .cmn_table { font-size: 16px;}
	#sec07 .info dl { margin-top: 20px;}
	#sec07 .info dd + dt { margin-top: 10px;}
}

/* ---------------------------------------------------
	Compartment ROOM
------------------------------------------------------ */
main>.cmn_btn { padding: 85px 0 110px; }
main>.cmn_btn .cmn_btn_y { width: 600px; max-width: 100%; min-height: 75px; margin: 0 auto; }

@media screen and (max-width: 600px) {
	main>.cmn_btn { padding: 9vw 0 16vw; }
	main>.cmn_btn .cmn_btn_y { min-height: 60px; }
}

/* lead */
.comp #lead { padding: 75px 0 80px; }
.comp #lead p:not(.cap) { margin-bottom: 2em; }
.comp #lead p:not(.cap):last-child { margin-bottom: 0; }
.comp #lead .cmn_btn{width: 600px;}
.comp #lead > div > a.cmn_btn_y{padding: 10px 5%;  text-align: center; font-size: 20px; line-height: 1.4;}
@media screen and (min-width: 601px) {
	.comp #lead p { text-align: center; }
}
@media screen and (max-width: 600px) {
	.comp #lead { padding: 50px 0 12vw; }
	.comp #lead p:not(.cap) { display: inline-block; margin-bottom: 1.5em; }
	.comp #lead .cmn_btn{max-width: 100%;}
	.comp #lead > div > a.cmn_btn_y{display: block;}
	.comp #lead > div > a.cmn_btn_y span{display: block;}
}

/* cnav */
.comp .cmn_cnav_img { padding: 50px 0 65px; }
.comp .cmn_cnav_img li { margin: 0; }
.comp .cmn_cnav_img a span .lg { position: static; display: inline-block; width: auto; height: auto; padding: 0; font-size: 22px; }
.comp .cmn_cnav_img a span .lg::before { content: none; }
@media screen and (max-width: 600px) {
	.comp .cmn_cnav_img { padding: 30px 0 45px; }
	.comp .cmn_cnav_img li { width: 100%!important; max-width: 100%!important; }
	.comp .cmn_cnav_img a span .lg { font-size: 17px; line-height: 1.2;}
}

/* section */
.comp section section { padding: 0; background: none; }
.comp section section:not(:last-of-type) { padding: 0 0 75px; }
.comp .cmn_table.bg_w, .comp .cmn_table.bg_w th, .comp .cmn_table.bg_w td { border-color: #cdcdcd; }
.comp .point_col { display: flex; }
.comp .point_col>div { display: flex; flex-direction: column; width: 348px; max-width: calc((100% - 9px) / 4); }
.comp .point_col>div dt { order: 2; margin: .75em 0 .5em; padding-right: 1em; font-size: 20px; color: #977901; line-height: 1.5;}
.comp .point_col>div dt .en { font-size: 16px; }
.comp .point_col>div dt .en .num { font-size: 18px; }
.comp .point_col>div dd:not(:last-child) { order: 3; padding-right: 1em; }
.comp .point_col>div dd:last-child { order: 1; }
.comp .point_col>div+div { margin-left: 3px; }
.comp .point_col>div dd  img { width: 100%; }
.comp .sec_tit { padding: 38px 0 0; font-size: 35px; line-height: 1.3; }
.comp .sec_tit>span { display: block; }
.comp .sec_tit .note { font-size: 25px; }
.comp .sec_tit .sub { margin-top: 1em; font-size: 20px; }
.comp section .detail .txt .note { color: #ce4c32; }
.comp section .items { flex-wrap: wrap; justify-content: stretch; }
.comp section .items .cmn_cnav_img { padding: 0; }
.comp section .items .cmn_cnav_img a { position: relative; display: block; height: auto; /*transition: opacity .5s;*/ }
.comp section .items .cmn_cnav_img a::before { position: absolute; top: 50%; left: 50%; z-index: 1; content: ''; width: 83px; height: 83px; transform: translate(-50%, -50%); background: url(../../rooms/img/comp/ico_movie.svg)no-repeat center; }
.comp section .caution { margin-top: 55px; background: rgba(255 255 255/70%); }
@media screen and (hover:hover) {
	/* .comp section .items .cmn_cnav_img a:hover { opacity: .8; } */
	/* .comp section .items .cmn_cnav_img a:hover .ofi { opacity: 1; } */
}
@media screen and (min-width: 601px) {
	.comp section .items li { width: 330px; max-width: calc((100% - 90px) / 4); }
	.comp section .items li+li { margin-left: 30px; }
	.comp section .items li:nth-child(5n) { margin-left: 0; }
	.comp section .items li:nth-child(-n+4) { padding-bottom: 30px; }
}
@media screen and (max-width: 600px) {
	.comp section section:not(:last-of-type) { padding: 0 0 12vw; }
	.comp .point_col { flex-direction: column; }
	.comp .point_col>div { width: 100%; max-width: none; padding-bottom: 2em; }
	.comp .point_col>div dt { margin: .5em 0; padding: 0; font-size: 17px; line-height: 1.3; }
	.comp .point_col>div dt .en { display: inline-block; margin-bottom: 5px; font-size: 14px; }
	.comp .point_col>div dt .en .num { font-size: 16px; }
	.comp .sec_tit { margin-bottom: 25px; padding: 30px 0 0; font-size: 24px; }
	.comp .sec_tit .note { font-size: 18px; }
	.comp .sec_tit .sub { margin-top: 0.5em; font-size: 14px; }
	.comp section .items { justify-content: space-between; }
	.comp section .items li { width: 49.5%; }
	.comp section .items .cmn_cnav_img a::before { width: 54px; height: 54px; }
	.comp section .caution { margin-top: 20px; }
}

/* sec01 */
.comp #sec01 { padding: 85px 0 80px; }
.comp #sec01 .cmn_tit_h { color: #977901; }
.comp #sec01 .caution { padding: 70px 100px 85px; }
.comp #sec01 .caution dt { font-size: 24px; text-align: center; }
.comp #sec01 .caution dd { margin-top: 1.5em; }
.comp #sec01 .caution dd li { text-indent: -1em; padding-left: 1em; }
.comp #sec01 .caution dd li::before { content: '・'; }
@media screen and (max-width: 600px) {
	.comp #sec01 { padding: 12vw 0 9vw; }
	.comp #sec01 .caution { padding: 8vw 6vw 9vw; }
	.comp #sec01 .caution dt { font-size: 20px; }
	.comp #sec01 .caution dd li+li { margin-top: 5px; }
}

/* sec02 */
.comp #sec02 { padding: 105px 0 120px; }
.comp #sec02 .cmn_tit_h { margin: 0 auto; }
@media screen and (max-width: 600px) {
	.comp #sec02 { padding: 12vw 0 13vw; }
}

/* sec03 */
.comp #sec03 { padding: 85px 0 110px; }
.comp #sec03 .cmn_tit_h { color: #977901; }
.comp #sec03>div { display: flex; justify-content: space-between; padding-top: 65px; border-top: 1px solid #d3cdc1; }
.comp #sec03>div dt { font-size: 24px; border-left: 5px solid #af9337; padding-left: 20px;color: #977901; line-height: 1.1; }
.comp #sec03>div .items { margin-top: 2em; }
.comp #sec03 .caution { margin-top: 105px; padding: 50px 100px 85px; }
.comp #sec03 .caution { display: flex; flex-wrap: wrap; font-size: 18px; }
.comp #sec03 .caution dt,
.comp #sec03 .caution dd { padding: 15px 0; border-bottom: 1px solid #d3cdc1; box-sizing: border-box; }
.comp #sec03 .caution .sm { border: none; width: 100%; padding: 0; font-size: 16px; }
.comp #sec03 .caution dt.sm:nth-of-type(3) { margin-top: 30px; }
.comp #sec03 .caution dt.sm { margin-top: 20px; }
.comp #sec03 .caution dd.sm li { text-indent: -1em; padding-left: 1em; }
.comp #sec03 .caution dd.sm li::before { content: '・'; }

@media screen and (min-width: 601px) {
	.comp #sec03 .items { margin-top: 0; justify-content: space-between; }
	.comp #sec03 .items li { width: 360px; max-width: calc((100% - 120px) / 3); padding-bottom: 45px; }
	.comp #sec03 .items li+li { margin-left: 0; }
	.comp #sec03 .items li p { font-size: 18px; line-height: 1.5; }
	.comp #sec03 .items li p span { font-size: 15px; }
	.comp #sec03>div dl:first-child { width: 65%; }
	.comp #sec03>div dl:first-child .items li { max-width: calc((100% - 60px)/ 2); margin-right: 60px; }
	.comp #sec03>div dl:first-child .items li:nth-of-type(2n) { margin: 0; }
	.comp #sec03>div dl:last-child { width: 35%; padding-left: 60px; }
	.comp #sec03>div .items li { width: auto; max-width: none; padding-bottom: 30px; }
	.comp #sec03>div dd .note { font-size: 15px; }
	.comp #sec03 .caution dt { width: 195px; }
	.comp #sec03 .caution dd { width: calc(100% - 195px); }
}
@media screen and (max-width: 600px) {
	.comp #sec03 { padding: 11vw 0 16vw; }
	.comp #sec03>div { flex-direction: column; padding-top: 40px; }
	.comp #sec03>div dl:not(:last-child) { margin-bottom: 35px; }
	.comp #sec03>div dt { font-size: 17px; padding-left: 10px; border-width: 3px; line-height: 1.4; }
	.comp #sec03>div .items { margin-top: 1em; }
	.comp #sec03>div dd .note { font-size: 13px; }
	.comp #sec03>.items { padding-bottom: 20px; }
	.comp #sec03 .caution { display: block; margin-top: 6vw; padding: 6vw 6vw 8vw; font-size: 16px; }
	.comp #sec03 .caution dt { padding-bottom: 0; border-bottom: 0; }
	.comp #sec03 .caution dd { padding-top: 0; font-size: 14px; }
	.comp #sec03 .caution .sm { font-size: 14px; }
	.comp #sec03 .caution dt.sm:nth-of-type(3) { margin-top: 20px; }
	.comp #sec03 .caution dt.sm { margin-top: 10px; }
}