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

@media screen and (max-width: 600px) {
	.c_nav li{ width: 100%; max-width: 100%;}
	.c_nav li a{ padding: 3vw 2vw;}
	.c_nav li a span span{ font-size: 13px;}
}

/* ---------------------------------------------------
slider
------------------------------------------------------ */
.slick_dots .slick-slide {
	margin: 0 15px; line-height: 1;
	opacity: .5; transition: opacity .8s;
}
.slick_dots .slick-slide.slick-current { opacity: 1; }

@media screen and (max-width: 600px) {
	.slick_dots .slick-slide { margin: 0;}
}

/* ---------------------------------------------------
sec01 - 07
------------------------------------------------------ */
[id^=sec]{ padding: 95px 0;}
[id^=sec] .tit_icon .ja span{ font-size: 30px;}

[id^=sec] .detail_col{
	margin-top: 30px;
	display: grid;
	grid-template-columns: calc(95% - 474px) auto 474px;
	grid-template-rows: max-content 40px 1fr;
}

[id^=sec] .txt{
	grid-column: 1 / 2;
	grid-row: 1 / 2;
}
[id^=sec] .detail{
	grid-column: 3 / 4;
	grid-row: 1 / 4;
}
[id^=sec] .more{
	grid-column: 1 / 2;
	grid-row: 3 / 4;
}

[id^=sec] .cmn_outline dt{ width: 170px;}
[id^=sec] .cmn_outline dd{ width: calc(100% - 170px);}
[id^=sec] .icon img{ vertical-align: text-bottom;}

@media screen and (max-width: 600px) {
	[id^=sec]{ padding: 12.5vw 0;}
	[id^=sec] .tit_icon .ja span{ font-size: 20px;}
	[id^=sec] .detail_col{
		grid-template-columns: auto;
		grid-template-rows: auto auto auto;
	}
	
	[id^=sec] .txt{
		padding-bottom: 10vw;
		grid-column: 1 / 2;
		grid-row: 1 / 2;
	}
	[id^=sec] .detail{
		padding-bottom: 10vw;
		grid-column: 1 / 2;
		grid-row: 2 / 3;
	}
	[id^=sec] .more{
		grid-column: 1 / 2;
		grid-row: 3 / 4;
	}
	[id^=sec] .cmn_outline { flex-direction: row;}
	[id^=sec] .cmn_outline dt{
		padding: 6px 3.5vw; width: 35%;
		line-height: 1.6;
	}
	[id^=sec] .cmn_outline dd{
		padding: 6px 3.5vw; width: 65%;
		line-height: 1.6;
	}
}


/* ---------------------------------------------------
info_col
------------------------------------------------------ */
#info_col{ padding: 85px 0;}

@media screen and (max-width: 600px) {
	#info_col{ padding: 10vw 0;}
}
