@charset "UTF-8";

section {
padding: var(--space-lg) 0;
}

.slider {
overflow: hidden;
inline-size: 100vw;
	li {
	inline-size: 100%;
	block-size: 85vh;
	object-fit: cover;
	}
	img {
	object-fit: cover;
	inline-size: 100%;
	block-size: 100%;
	}
}
.add-animation { animation: fadezoom 7s 0s forwards;}
@keyframes fadezoom { 0% {transform: scale(1);} 100% {transform: scale(1.15);} }

#concept {
text-align: center;
	img { display: block; margin: 0 auto var(--space-md);}
	h1{ font-size: var(--font-middle); line-height: 2.2em; letter-spacing: 0.1em; padding-bottom: var(--space-mlg);}
}

#location p { text-align: center; }

#rooms {
	h2 + img { padding-bottom: clamp(30px, 3.5vw, 50px); }
	ul:last-child {padding-top: var(--space-md);}
	.slide li {
		h3,p { text-align: center; }
		img { padding-bottom: var(--space-sm); }
		p { line-height:1em; }
	}
}

#amenities .list {
position: relative; padding-bottom: clamp(80px, 8vw, 150px);
	li:nth-child(1){ transform: translateY(60px); }
	li:nth-child(2){ transform: translateY(100px); }
	li:nth-child(3){ transform: translateY(140px); }
	li {
		h3 { text-align: center; font-weight: 500; font-size: var(--font-middle); padding-bottom: var(--space-md); }
		h3:after { display: block; content: ""; background: #000; margin: 5px auto 0; inline-size: 30px; block-size: 3px; }
		img { padding-bottom: var(--space-sm); }
		p span { display:block; font-size:0.8em; }
	}
}
#amenities .list:before { position: absolute; display: block; content: ""; background: var(--accent-color); z-index: -1; }
#amenities .list:nth-child(odd):before { right: 0; }
#amenities .list:nth-child(even):before { left: 0; }
#amenities .amenity {
background: var(--accent-color);
padding: var(--space-md);
	li{ border-bottom: var(--border-blk); padding-bottom: 20px; margin-bottom: 20px; }
	li:last-of-type{ border-bottom: none; padding-bottom: 0; margin-bottom: 0; }
}

#activity ul { display: flex; flex-wrap: wrap;
	li { display: flex; flex-direction: column; padding-bottom: var(--space-lg);
		img { inline-size: 100%; object-fit: cover; padding-bottom: clamp(6px, 0.75vw, 8px); }
		h3{ padding-bottom: clamp(6px, 0.75vw, 8px); }
		p { margin-bottom: 15px; font-size: 0.9em; }
		a{ text-align: center; display: block; background: var(--accent-color); color: var(--color); border-radius: 5px; padding: 5px 0; font-size: var(--font-base);margin-top: auto; }

	}
}

#access {
padding-bottom: clamp(100px, 7.5vw, 150px);
	.w1280{ position: relative;
		div div{ display: flex; justify-content: center; }
	}
	.w1280:after{ position: absolute; display: block; content: ""; background: var(--accent-color); z-index: -1; }
	.logo { display: block; margin-inline: auto; padding-bottom: 20px;}
	th, td { display: inline-block; }
	tr:last-of-type th, tr:last-of-type td { margin-bottom: 0; }
	p { padding-bottom: var(--space-md); inline-size: 310px; margin-inline: auto; }
	a { background: var(--color); color: #fff; border-radius: 5px; }
}

#news {
background: var(--accent-color); color: #423000;
	a {background: var(--accent-color); color: #423000;}
	ul { display: table; margin-inline: auto;
		li { padding-bottom: var(--space-md);
			time { padding-right: var(--space-sm); }
		}
		li:last-child { padding-bottom: 0; }
	}
}

#notes {
	h3{ font-weight: 500; padding-bottom: var(--space-sm); }
	p { padding-bottom:var(--space-md);
		span{ display: block; font-weight: 500; color: #B30002; padding-top: var(--space-sm); }
	}
	ol { padding-bottom:30px; counter-reset: count 0;
		li { text-indent: -1.5em; padding-bottom: 5px; padding-left: 25px; }
		li:before { content: counter(count) "."; counter-increment: count 1; }
	}
	ol:last-of-type { padding-bottom: 0; }
}

@media (max-width: 560px){
.no-br.on{
display: none;
}

#concept {
	img { inline-size: 50%; }
	h1{ font-size: 4.2vw; }
}
#location p {
display: table;
margin-inline: auto;
}

#amenities {
	.list {
		li { inline-size: 80%; padding-bottom: 50px;
			h3 { font-size: 4.8vw; }
			h3:after { background: #fff; }
		}
	}
	.list:last-of-type{ padding-bottom: 60px; }
	.list:before{ inline-size: 60%; block-size: 90%; }
}
#amenities .amenities--clm2 {
	li.scroll-up:nth-child(1){ transform: translate(5%,100px); }
	li.scroll-up.done:nth-child(1) { transform: translate(5%,50px); }
	li.scroll-up:nth-child(2) { transform: translate(15vw,100px); }
	li.scroll-up.done:nth-child(2) { transform: translate(15vw,50px); }
}
#amenities .amenities--clm3 {
	li.scroll-up:nth-child(1), li.scroll-up:nth-child(3) { transform: translate(5%,100px); }
	li.scroll-up.done:nth-child(1), li.scroll-up.done:nth-child(3) { transform: translate(5%,50px); }
	li.scroll-up:nth-child(2) { transform: translate(15vw,100px); }
	li.scroll-up.done:nth-child(2) { transform: translate(15vw,50px); }
}

#activity ul {
	li { inline-size: 48%; padding-right: 4%; 
		p { font-size: 3.5vw; }
		a { font-size: 14px; }
	}
	li:nth-of-type(2n){ padding-right: 0; }
	li:nth-last-child(-n+2){ padding-bottom: 0; }
	li:nth-child(odd){ transition: 1.2s; }
	li:nth-child(even){ transition: 1.6s; }
}

#access {
padding: 50px 0 100px 0;
	.w1280:after{ top: -70px; left: 50%; transform: translateX(-50%); inline-size: 80%; block-size: 100vh; }
	iframe { block-size: 35vh; margin-bottom: 20px; }
	.logo { inline-size: 50%; }
	table { inline-size: 250px; margin: 0 auto 20px;
		th { margin: 0 20px 5px 0; }
		td{ margin-bottom: 5px; }
	}
	div a { padding: 5px 15px 7px; }
	div a:first-of-type{ margin-right: 10px; }
}

#notes ol li:before { padding-right: 5px; }
}

@media (min-width: 561px){
.no-br { display: none; }

#concept img { inline-size: 30%;}

#rooms .slide {
display: flex;
	li{ inline-size: 30%; margin-right: 5%; }
	li:nth-child(3n){ margin-right: 0; }
}

#amenities {
	.list {
	display: flex; justify-content: center; align-items: flex-start;
		li:nth-child(1) { transform: translateY(130px); }
		li:nth-child(2) { transform: translateY(170px); }
		li:nth-child(3) { transform: translateY(210px); }
		li:last-of-type { padding-right: 0; }
	}
	.list:before { inline-size: 80%; block-size: 30vh; }
	ul .scroll-up.done:nth-child(1){ transform : translateY(60px); }
	ul .scroll-up.done:nth-child(2){ transform : translateY(100px); }
	ul .scroll-up.done:nth-child(3){ transform : translateY(140px); }
}
.amenities--clm2 li{ inline-size: clamp(250px, 40%, 400px); padding: 0 2.5%; }
.amenities--clm3 li{ inline-size: clamp(170px, 30%, 360px); padding-right: 3%; }

#activity ul {
	li { inline-size: 30%; margin-right: 5%;
		h3, p { padding-left: 5px; }
	}
	li:nth-of-type(3n){ margin-right: 0; }
	li:nth-child(3n+1) { transition: 1.3s; }
	li:nth-child(3n+2) { transition: 1.6s; }
	li:nth-child(3n) { transition: 1.9s; }
}

#access{
	.w1280 { display: flex; justify-content: space-between; align-items: center; }
	.w1280:after { bottom: -60px; left: 0; inline-size: 80%; block-size: 25vh; }
	.logo { inline-size: 40%; }
	table { margin: 0 auto 20px;
		th { margin: 0 20px 5px 0; }
		td{ margin-bottom: 5px; }
	}
	a { padding: 5px 20px 7px; }
	a:first-of-type { margin-right: 20px; }
}

#notes ol li:before { padding-right: 10px; }
#notes ol li { padding-bottom: 5px; padding-left: 25px; }
}

@media (min-width: 561px) and (max-width: 1024px){
.slider li {block-size: 70vh;}

#access {
	iframe { inline-size: 50%; block-size: 50vh; padding-left: 3%; }
	.w1280 > div { inline-size: 42%;
		div { flex-direction: column; }
		a { display: block; margin-bottom: 15px; text-align: center;}
		a:first-of-type { margin-right: 0; }
	}
}
}

@media (min-width: 1025px){
#concept img { inline-size: 20%;}
#amenities.w1280, #location.w1280 {
max-inline-size: 1024px;
margin-inline: auto;
}

#access {
	iframe { inline-size: 53%; block-size: 500px; margin-left: 5%; }
	.w1280 > div { inline-size: 38%; }
}
}