/* CSS Document */

#pagePath{
	display: none;
	}

#siteName{
	opacity: 1;
	pointer-events: none;
	@media (min-width: 1400px) {
		transform-origin: left top;
		transition: transform 0.2s ease-out;
		.scrollTop &{
			transform: translate(40px, 40px);
		}
	}
}

#hero{
	display: grid;
	@media (max-width: 1199.98px) {
		grid-template-columns: 1fr var(--wrap) 1fr;
		justify-content: center;
		#heroText{
			grid-column: 2;
		}
		#heroSlide{
			grid-column: 1 / 4;
			grid-row: 1;
			margin-bottom: 32px;
		}
	}
	@media (min-width: 1200px) {
		grid-template-columns: auto 1fr;
		align-items: start;
		#heroText{
			margin-top: clamp(24px, calc(48 / 1400 * 100dvw), 48px);
			padding: 0 48px;
		}
		#heroSlide{
			grid-column: 2;
		}
	}
	@media (min-width: 1400px) {
		#heroText{
			min-width: 400px;
			margin-top: 80px;
		}
	}
}

#heroText{
	display: grid;
	grid-gap: 8px;
	font-weight: 700;
	font-family: "Shippori Mincho", var(--font-min);
	word-break: keep-all;
	overflow-wrap: anywhere;
	& h1{
		font-size: clamp(24px, calc(30 / 768 * 100dvw), 30px);
		letter-spacing: 0.05em;
		&:not(:lang(ja), :lang(zh-TW)){
			line-height: 1.4;
		}
	}
	& h1+div{
		font-size: clamp(16px, calc(18 / 768 * 100dvw), 18px);
		letter-spacing: 0.05em;
	}
	@media (min-width: 1200px) {
		grid-gap: 16px;
		&:lang(ja){
			align-content: center;
			writing-mode: vertical-rl;
			& h1{
				height: 9em;
			}
			& h1+div{
				height: 21em;
			}
		}
		&:lang(en){
			max-width: clamp(400px, calc(440 / 1400 * 100dvw), 440px);
			& h1{
				font-size: clamp(24px, calc(28 / 1400 * 100dvw), 28px);
			}
			& h1+div{
				font-size: clamp(16px, calc(18 / 1400 * 100dvw), 18px);
			}
		}
		&:lang(zh-TW){
			align-content: center;
			writing-mode: vertical-rl;
			& h1{
				height: 7.4em;
			}
			& h1+div{
				height: 19em;
			}
		}
	}
}

#heroSlide{
	& ul{
		display: grid;
	}
	& li{
		grid-column: 1;
		grid-row: 1;
	}
	& a{
		display: block;
	}
	& img{
		aspect-ratio: 3 / 2;
		aspect-ratio: 256 / 129;
		object-fit: cover;
	}
	.slick-slider{
		display: grid;
		grid-template-columns: auto 1fr auto;
	}
	.slick-list{
		grid-column: 1 / 4;
		grid-row: 1;
	}
	.slick-arrow{
		all: unset;
		box-sizing: border-box;
		cursor: pointer;
		grid-row: 1;
		align-self: center;
		position: relative;
		aspect-ratio: 1;
		width: clamp(48px, calc(64 / 1200 * 100dvw), 64px);
		margin: 8px;
		background: rgba(200, 170, 20, 0.8);
		border-radius: 100%;
		color: #fff;
		font-size: 0;
		z-index: 1;
		&:before{
			content: "";
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background: currentColor;
			-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path d="M25.14,16c0-.58-.22-1.17-.67-1.62L10.76.67c-.89-.89-2.34-.89-3.23,0-.89.89-.89,2.34,0,3.23l12.1,12.1-12.1,12.1c-.89.89-.89,2.34,0,3.23.89.89,2.34.89,3.23,0l13.71-13.71c.45-.45.67-1.03.67-1.62Z"/></svg>') no-repeat center / 50%;
		}
		&.slick-prev:before{
			transform: scale(-1, 1);
		}
	}
	.slick-prev{
		grid-column: 1;
	}
	.slick-next{
		grid-column: 3;
	}
	.slick-dots{
		grid-column: 2;
		grid-row: 1;
		align-self: end;
		position: relative;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		grid-gap: clamp(16px, calc(24 / 1200 * 100dvw), 24px);
		padding-bottom: clamp(16px, calc(32 / 1200 * 100dvw), 32px);
		z-index: 1;
		& li{
			aspect-ratio: 1;
			width: 8px;
			background: #fff;
			border-radius: 100%;
			overflow: hidden;
			cursor: pointer;
			&.slick-active{
				background: var(--color-theme);
			}
		}
		& button{
			visibility: hidden;
		}
	}
}

#news{
	display: grid;
	width: var(--wrap);
	margin-inline: auto;
	margin-top: clamp(72px, calc(144 / 1200 * 100dvw), 144px);
	& h2{
		position: relative;
		display: grid;
		justify-content: center;
		padding-bottom: 8px;
		font: 700 clamp(28px, calc(36 / 768 * 100dvw), 36px) "Shippori Mincho", var(--font-min);
		letter-spacing: 0.1em;
		text-align: center;
		border-bottom: 2px solid #999;
		&:before{
			content: attr(data-caption);
			font-size: clamp(40px, calc(68 / 768 * 100dvw), 68px);
			background: radial-gradient(circle at center, #c8aa14, #7d6e00);
			-webkit-background-clip: text;
			-webkit-text-fill-color: transparent;
		}
		&:after{
			content: "";
			position: absolute;
			right: 50%;
			width: 50%;
			bottom: -2px;
			border-bottom: 2px solid var(--color-theme);
		}
	}
	@media (max-width: 1199.98px) {
		& h2{
			justify-self: center;
		}
		#newsTab{
			margin-top: 40px;
		}
	}
	@media (min-width: 1200px) {
		grid-template-columns: auto 1fr;
		grid-template-rows: auto 1fr;
		column-gap: 96px;
		& h2{
			grid-column: 1;
			grid-row: 1 / 3;
			align-self: start;
			&:after{
				right: 100%;
				width: 100dvw;
			}
		}
		#newsList{
			align-self: start;
		}
	}
}

#newsTab{
	position: relative;
	filter: drop-shadow(3px 3px 3px rgba(4, 0, 0, 0.2));
	&:before{
		content: "";
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		border-bottom: 1px solid #717171;
		z-index: 1;
	}
	& ul{
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		justify-content: start;
		column-gap: clamp(4px, calc(8 / 768 * 100dvw), 8px);
	}
	& li{
		position: relative;
		display: grid;
		align-content: center;
		align-items: center;
		padding: 0.5em 0;
		background: #fff;
		border: solid #717171;
		border-width: 1px 1px 0 1px;
		border-radius: 4px 4px 0 0;
		font-weight: 500;
		font-size: clamp(16px, calc(18 / 768 * 100dvw), 18px);
		letter-spacing: 0.1em;
		line-height: 1.25;
		text-align: center;
		cursor: pointer;
		&:not(.select){
			background: #adadad;
			color: #fff;
		}
		&.select{
			pointer-events: none;
			z-index: 2;
			&:after{
				content: "";
				position: absolute;
				left: 10%;
				bottom: 0;
				width: 80%;
				border-bottom: 2px solid var(--color-theme);
			}
		}
	}
	& span{
		font-size: clamp(12px, calc(14 / 768 * 100dvw), 14px);
	}
	@media (min-width: 992px) {
		& span{
			&:before{
				content: "（";
			}
			&:after{
				content: "）";
			}
		}
	}
}

#newsList{
	padding: clamp(8px, calc(24 / 1200 * 100dvw), 24px) clamp(16px, calc(48 / 1200 * 100dvw), 48px) 24px clamp(16px, calc(48 / 1200 * 100dvw), 48px);
	background: #fff;
	border: solid #717171;
	border-width: 0 1px 1px 1px;
	border-radius: 0 0 4px 4px;
	filter: drop-shadow(3px 3px 2px rgba(4, 0, 0, 0.2));
	& summary{
		display: none;
	}
	& summary+div{
		&:not(:has(section)){
			text-align: center;
		}
	}
	& summary+div+div{
		display: flex;
		justify-content: center;
		margin-top: 8px;
		& a{
			display: grid;
			grid-template-columns: 1fr auto;
			align-items: center;
			min-height: 40px;
			padding: 0.25em 1em;
			border: 1px solid #999;
			border-radius: 2px;
			color: inherit;
			font-weight: 500;
			letter-spacing: 0.1em;
			text-decoration: none;
			&:after{
				content: "";
				aspect-ratio: 1;
				width: 16px;
				background: currentColor;
				transform: translateX(0.5em);
				-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" style="fill: none; stroke: black; stroke-miterlimit: 10;"><polyline points="5.5 3 10.5 8 5.5 13"/></svg>') no-repeat center / contain;
			}
			&:lang(ja){
				font-family: "Zen Kaku Gothic New", var(--font);
			}
		}
	}
	& section{
		position: relative;
		display: grid;
		padding: 16px 0;
		&:has(a){
			& h3{
				text-decoration: underline;
			}
		}
		&:nth-child(n+2){
			border-top: 1px solid #999;
		}
		& h3{
			order: 1;
		}
		@media (max-width: 991.98px) {
			& h3{
				margin-top: 8px;
			}
		}
		@media (min-width: 992px) {
			grid-template-columns: auto 1fr;
			grid-template-rows: auto 1fr;
			align-items: center;
			grid-gap: 8px 32px;
			& h3{
				grid-column: 2;
				grid-row: 2;
			}
			& h3+div{
				display: contents;
			}
			& time{
				grid-column: 1;
				grid-row: 1;
			}
			& ul:nth-of-type(1){
				grid-column: 2;
				grid-row: 1;
			}
			& ul:nth-of-type(2){
				grid-column: 1;
				grid-row: 2;
				align-self: start;
				display: grid;
			}
		}
	}
	& h3{
		font-size: 18px;
		letter-spacing: 0.1em;
	}
	& h3+div{
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		grid-gap: 8px;
		& time{
			letter-spacing: 0.05em;
		}
		& ul{
			display: flex;
			flex-wrap: wrap;
			grid-gap: 8px;
			&:nth-of-type(1){
				order: 1;
				& li{
					display: grid;
					align-items: center;
					min-height: 20px;
					padding: 0 1em;
					background: var(--color-theme);
					border-radius: 2px;
					color: #fff;
					font-size: 14px;
					letter-spacing: 0.05em;
					text-transform: uppercase;
					&.tagNew{
						background: #d80c18;
					}
				}
			}
			&:nth-of-type(2){
				& li{
					display: grid;
					align-items: center;
					min-height: 24px;
					padding: 0 1em;
					border: 1px solid currentColor;
					border-radius: 12px;
					color: var(--color-theme);
					font-size: 14px;
					letter-spacing: 0.05em;
					text-align: center;
					&[data-cat="02"]{
						color: #e71f19;
					}
					&[data-cat="04"]{
						color: #1e4672;
					}
				}
			}
		}
		& a{
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			font-size: 0;
		}
	}
}

#process{
	position: relative;
	display: grid;
	grid-template-columns: var(--wrap);
	justify-content: center;
	margin-top: clamp(64px, calc(160 / 1200 * 100dvw), 160px);
	scroll-margin-top: clamp(64px, calc(80 / 1200 * 100dvw), 80px);
	&:after{
		content: "";
		position: absolute;
		top: calc(0px - clamp(200px, calc(256 / 1200 * 100dvw), 256px));
		left: 0;
		width: 100%;
		height: calc(100% + clamp(200px, calc(256 / 1200 * 100dvw), 256px) + 380px);
		background: #eee5b8 url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 66 66" width="66" height="66" fill="white" opacity="0.5"><path d="M0,66h66V0H0v66ZM1.87,65.22l20.13-20.13,9.9,9.9-10.22,10.22H1.87ZM34.1,33l9.9-9.9,9.9,9.9-9.9,9.9-9.9-9.9ZM42.9,44l-9.9,9.9-9.9-9.9,9.9-9.9,9.9,9.9ZM33,31.9l-9.9-9.9,9.9-9.9,9.9,9.9-9.9,9.9ZM31.9,33l-9.9,9.9-9.9-9.9,9.9-9.9,9.9,9.9ZM23.87,65.22l9.13-9.13,9.13,9.13h-18.25ZM44.32,65.22l-10.22-10.22,9.9-9.9,20.13,20.13h-19.8ZM65.22,64.13l-20.13-20.13,9.9-9.9,10.22,10.22v19.8ZM65.22,42.13l-9.13-9.13,9.13-9.13v18.25ZM65.22,21.68l-10.22,10.22-9.9-9.9L65.22,1.87v19.81ZM64.13.78l-20.13,20.13-9.9-9.9L44.32.78h19.8ZM42.13.78l-9.13,9.13L23.87.78h18.25ZM21.68.78l10.22,10.22-9.9,9.9L1.87.78h19.81ZM.78,1.87l20.13,20.13-9.9,9.9L.78,21.68V1.87ZM.78,23.87l9.13,9.13L.78,42.13v-18.25ZM.78,44.32l10.22-10.22,9.9,9.9L.78,64.13v-19.8Z"/></svg>') repeat center;
		z-index: -1;
		-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" viewBox="0 0 16 16"><rect width="100%" height="100%"/></svg>') no-repeat center bottom / 100% calc(100% - clamp(80px, calc(256 / 1200 * 100dvw), 256px)), url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" viewBox="0 0 1536 270"><path d="M1536,0C1024.22,30,511.78,240,0,270h1536V0Z"/></svg>') no-repeat center top / 100% clamp(80px, calc(256 / 1200 * 100dvw), 256px);
	}
	& h2{
		display: grid;
		grid-template-columns: auto auto;
		justify-content: center;
		column-gap: 0.5em;
		font: 700 clamp(24px, calc(36 / 768 * 100dvw), 36px) "Shippori Mincho", var(--font-min);
		letter-spacing: 0.1em;
		text-align: center;
		&:before{
			content: "";
			aspect-ratio: 1 / 2;
			height: 1em;
			background: #c8aa14;
			transform: translateY(calc(0.825em - 50%));
			-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 32"><polygon points="0 0 0 32 16 16 0 0"/></svg>') no-repeat center / contain;
		}
	}
	& h2+div{
		display: grid;
		grid-gap: 64px 16px;
		margin-top: 64px;
		@media (min-width: 992px) {
			grid-template-columns: repeat(4, 1fr);
			& section{
				grid-template-rows: subgrid;
				grid-row: span 2;
				&:nth-child(n+2){
					&:after{
						content: "";
						position: absolute;
						top: 50%;
						left: 0;
						aspect-ratio: 1 / 2;
						width: 16px;
						background: var(--color-theme);
						transform: translate(-100%, -50%);
						-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 40"><polygon points="0 0 0 40 16 20 0 0"/></svg>') no-repeat left center / contain;
					}
				}
			}
		}
	}
	& section{
		counter-increment: count;
		position: relative;
		display: grid;
		grid-row-gap: 16px;
		padding: 40px 20px 20px 20px;
		background: #fff;
		border: 1px solid var(--color-theme);
		border-radius: 16px;
		filter: drop-shadow(3px 3px 3px rgba(4, 0, 0, 0.2));
		&:before{
			content: counter(count);
			position: absolute;
			top: 0;
			left: 50%;
			display: grid;
			align-items: center;
			aspect-ratio: 1;
			width: 56px;
			background: var(--color-theme);
			border-radius: 100%;
			color: #fff;
			font-weight: 700;
			font-size: 32px;
			text-align: center;
			line-height: 1;
			transform: translate(-50%, -50%);
		}
		&:lang(ja):before{
			font-family: "Zen Kaku Gothic New", var(--font);
		}
	}
	& h3{
		display: grid;
		justify-items: center;
		grid-gap: 8px 24px;
		padding: 0 0.5em;
		color: var(--color-theme);
		font-weight: 700;
		font-size: clamp(18px, calc(24 / 1200 * 100dvw), 24px);
		letter-spacing: 0.05em;
		text-align: center;
		word-break: keep-all;
		overflow-wrap: anywhere;
		&:before{
			content: "";
			aspect-ratio: 1;
			width: 64px;
			background: currentColor;
			-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><rect width="100%" height="100%"/></svg>') no-repeat center / contain;
		}
		&:lang(ja){
			font-family: "Zen Kaku Gothic New", var(--font);
		}
		@media (min-width: 576px) and (max-width: 991.98px) {
			grid-template-columns: auto auto;
			justify-content: center;
			align-items: center;
		}
	}
	& h3+div{
		font-weight: 500;
		letter-spacing: 0.08em;
		&:lang(ja){
			font-family: "Zen Kaku Gothic New", var(--font);
		}
		& ul{
			margin-top: 1em;
			padding: 0.5em 1em;
			border: 1px solid #999;
		}
		& li{
			padding-left: 1.1em;
			text-indent: -1.1em;
		}
		& a{
			color: var(--color-theme);
			&[href$="/signup/index.html"]{
				color: #c1272d;
			}
		}
		@media (max-width: 991.98px) {
			display: grid;
			justify-items: center;
		}
	}
	#processLocal{
		margin-top: clamp(80px, calc(120 / 1200 * 100dvw), 120px);
	}
}

#processRsv{
	display: grid;
	&:before{
		content: "Reservation Process";
		display: block;
		margin-bottom: 16px;
		font: 700 clamp(32px, calc(68 / 768 * 100dvw), 68px) "Shippori Mincho", var(--font-min);
		text-align: center;
		background: radial-gradient(circle at center, #c8aa14, #7d6e00);
		line-height: 1;
		letter-spacing: 0.1em;
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
	}
	& section:nth-child(1) h3:before{
		-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M16.57,33.69h-4.43c-.33,0-.6.27-.6.6v4.43c0,.33.27.6.6.6h4.43c.33,0,.6-.27.6-.6v-4.43c0-.33-.27-.6-.6-.6ZM15.14,14.59c1.24,0,2.24-1.01,2.24-2.24v-2.76c0-1.24-1.01-2.24-2.24-2.24s-2.24,1.01-2.24,2.24v2.76c0,1.24,1.01,2.24,2.24,2.24ZM34.97,14.59c1.24,0,2.24-1.01,2.24-2.24v-2.76c0-1.24-1.01-2.24-2.24-2.24s-2.24,1.01-2.24,2.24v2.76c0,1.24,1.01,2.24,2.24,2.24ZM16.57,23.58h-4.43c-.33,0-.6.27-.6.6v4.43c0,.33.27.6.6.6h4.43c.33,0,.6-.27.6-.6v-4.43c0-.33-.27-.6-.6-.6ZM38.55,28.6v-4.43c0-.33-.27-.6-.6-.6h-4.43c-.33,0-.6.27-.6.6v4.43c0,.33.27.6.6.6h4.43c.33,0,.6-.27.6-.6ZM27.26,33.69h-4.43c-.33,0-.6.27-.6.6v4.43c0,.33.27.6.6.6h4.43c.33,0,.6-.27.6-.6v-4.43c0-.33-.27-.6-.6-.6ZM63.5,54.08l-5.62-5.62c1.33-2.11,2.1-4.61,2.07-7.28-.09-7.33-6.06-13.24-13.41-13.24-.14,0-.28,0-.42,0v-14.61c0-.54-.44-.98-.98-.98h-5.75c0,2.44-1.98,4.41-4.41,4.41s-4.41-1.98-4.41-4.41h-11c0,2.44-1.98,4.41-4.41,4.41s-4.41-1.98-4.41-4.41h-5.75c-.54,0-.98.44-.98.98v32.57c0,.54.44.98.98.98h29.34c2.15,4.73,6.96,7.99,12.53,7.87,3.42-.08,6.51-1.46,8.84-3.64l5.39,5.39c.33.33.77.5,1.21.5s.87-.17,1.21-.5c.67-.67.67-1.75,0-2.42ZM33.25,43.11H7.77v-24.01h34.56v9.51c-5.35,1.76-9.21,6.8-9.21,12.74,0,.6.04,1.19.12,1.76ZM46.72,50.94c-5.44.1-9.88-4.33-9.78-9.78.1-5.13,4.28-9.32,9.41-9.41,5.44-.1,9.88,4.33,9.78,9.78-.1,5.13-4.28,9.32-9.41,9.41ZM27.26,23.58h-4.43c-.33,0-.6.27-.6.6v4.43c0,.33.27.6.6.6h4.43c.33,0,.6-.27.6-.6v-4.43c0-.33-.27-.6-.6-.6Z"/></svg>');
	}
	& section:nth-child(2) h3:before{
		-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M29.52,18.78v10.27l-9.25-2.85c-.95-.29-1.96.24-2.26,1.19-.29.95.24,1.96,1.19,2.26l11.59,3.57c.17.05.35.08.53.08.38,0,.76-.12,1.07-.35.46-.34.73-.88.73-1.45v-12.71c0-1-.81-1.8-1.8-1.8s-1.8.81-1.8,1.8ZM31.32,49.56c-9.81,0-17.79-7.98-17.79-17.79s7.98-17.79,17.79-17.79,17.79,7.98,17.79,17.79c0,.88-.07,1.75-.19,2.6,1.56.25,2.86.28,4.44.82.19-.7.28-2.32.28-3.42,0-5.96-2.32-11.57-6.54-15.79-4.22-4.22-9.82-6.54-15.79-6.54s-11.57,2.32-15.79,6.54c-4.22,4.22-6.54,9.82-6.54,15.79s2.32,11.57,6.54,15.79c4.22,4.22,9.82,6.54,15.79,6.54,1.51,0,2.99-.15,4.43-.44-.13-1.04-.82-2.71-.8-4.47-1.17.24-2.39.37-3.63.37ZM49,36.56c-6.63,0-12,5.37-12,12s5.37,12,12,12,12-5.37,12-12-5.37-12-12-12ZM56.47,46.25l-8,7.57c-.29.27-.66.41-1.03.41s-.71-.13-1-.38l-4.64-4.12c-.62-.55-.68-1.5-.13-2.12.55-.62,1.5-.68,2.12-.13l3.61,3.2,7-6.62c.6-.57,1.55-.54,2.12.06s.54,1.55-.06,2.12Z"/></svg>');
	}
	& section:nth-child(3) h3:before{
		-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M31.17,33.37c.2.26.5.42.83.42s.63-.15.83-.42l11.08-11.42c.14-.18.21-.4.21-.62,0-.16-.04-.32-.11-.46-.18-.35-.54-.57-.93-.57h-4.9v-10.33c0-.57-.46-1.04-1.04-1.04h-10.27c-.57,0-1.04.46-1.04,1.04v10.33h-4.9c-.39,0-.75.22-.93.57-.07.15-.11.31-.11.46,0,.22.07.44.21.62l11.08,11.42ZM49.86,25.13h-5.39l-3.5,3.6h5.56l-14.54,11.41-14.54-11.41h5.56l-3.5-3.6h-5.39c-2.28,0-4.14,1.85-4.14,4.14v21.68c0,2.28,1.86,4.14,4.14,4.14h35.73c2.28,0,4.14-1.85,4.14-4.14v-21.68c0-2.28-1.85-4.14-4.14-4.14ZM50.4,50.95c0,.29-.24.53-.53.53H14.13c-.29,0-.53-.24-.53-.53v-20.65l17.27,13.54s0,0,.01,0h0s.09.07.14.1c.02.01.04.02.05.03.04.02.07.04.11.06.02,0,.03.02.05.02.05.02.1.05.16.06,0,0,0,0,0,0,.06.02.12.04.18.05.01,0,.02,0,.03,0,.05.01.1.02.15.02.01,0,.03,0,.04,0,.06,0,.12.01.18.01,0,0,0,0,0,0,0,0,0,0,0,0,.06,0,.12,0,.18-.01.01,0,.03,0,.04,0,.05,0,.1-.01.15-.02.01,0,.02,0,.03,0,.06-.01.12-.03.18-.05,0,0,0,0,0,0,.05-.02.11-.04.16-.06.02,0,.03-.02.05-.02.04-.02.08-.04.11-.06.02-.01.04-.02.05-.03.05-.03.1-.06.14-.1h0s0,0,.01-.01l17.27-13.54v20.65Z"/></svg>');
	}
	& section:nth-child(4) h3:before{
		-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M26.58,7.75l-13.77,13.77v34.72h38.38V7.75h-24.61ZM26.38,12.46v8.86h-8.86l8.86-8.86ZM48.01,53.06H15.99v-28.93h13.19v-13.19h18.82v42.12ZM22.66,46.14h18.68v-2.45h-18.68v2.45ZM22.66,32.74h18.68v-2.45h-18.68v2.45ZM22.66,39.44h18.68v-2.45h-18.68v2.45Z"/></svg>');
	}
	#processLink{
		grid-row: 3;
		margin-top: 24px;
	}
}

#processLocal{
	&:before{
		//content: "On the Day";
		display: block;
		margin-bottom: 16px;
		font: 700 clamp(32px, calc(68 / 768 * 100dvw), 68px) "Shippori Mincho", var(--font-min);
		text-align: center;
		background: radial-gradient(circle at center, #c8aa14, #7d6e00);
		line-height: 1;
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
	}
	& section:nth-child(1) h3:before{
		-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M52,24.01h-1.46v-2.35c0-1.61-1.32-2.92-2.92-2.92h-1.78v-4.97l-7.5-7.12h-19.83v12.09h-2.12c-1.61,0-2.92,1.32-2.92,2.92v2.35h-1.46c-2.6,0-4.72,2.13-4.72,4.72v13.97c0,2.6,2.13,4.72,4.72,4.72h6.5v9.93h27.33v-9.93h6.17c2.6,0,4.72-2.13,4.72-4.72v-13.97c0-2.6-2.13-4.72-4.72-4.72ZM38.35,10.55l3.37,3.18h-3.37v-3.18ZM43.02,54.54h-21.71v-18.73h21.71v18.73ZM43.02,24.01h-21.71v-14.55h14.23v7.09h7.48v7.47ZM47.97,31.71c-1.06,0-1.91-.86-1.91-1.91s.86-1.91,1.91-1.91,1.91.86,1.91,1.91-.86,1.91-1.91,1.91ZM34.33,38.81h-10.72v3.38h10.72v-3.38ZM40.62,45.38h-17v3.38h17v-3.38Z"/></svg>');
	}
	& section:nth-child(2) h3:before{
		-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M22.14,31.14c1.25-3.35,4.47-5.59,8.05-5.59h5.24V3.09c0-1.7-1.39-3.09-3.09-3.09H3.09C1.39,0,0,1.39,0,3.09v29.25c0,1.7,1.39,3.09,3.09,3.09h17.16l1.9-4.29ZM15.09,20.99v7.59h-4.86V6.85h8.05c4.22,0,6.91,2.96,6.91,7.05,0,4.38-2.64,7.1-6.99,7.1h-3.11ZM17.19,11.22h-2.18v5.41h2.2c1.74,0,3.12-.67,3.12-2.7s-1.39-2.7-3.15-2.7ZM20.7,61.63c0,.69.56,1.25,1.25,1.25h3.85c.69,0,1.25-.56,1.25-1.25v-2.39h-6.35v2.39ZM51.62,61.63c0,.69.56,1.25,1.25,1.25h3.85c.69,0,1.25-.56,1.25-1.25v-2.39h-6.35v2.39ZM60.8,38.35h-4.19l-2.72-6.15c-.82-2.28-2.99-3.81-5.42-3.81h-18.29c-2.43,0-4.6,1.53-5.42,3.81l-2.72,6.15h-4.19c-1.07,0-1.94.65-1.94,1.45v1.14c0,.61.52,1.16,1.29,1.36l1.98.53-.05.07c-.95,1.18-1.47,2.66-1.47,4.17v6.1c0,1.92,1.28,3.54,3.03,4.06v.09h37.27v-.09c1.75-.52,3.03-2.15,3.03-4.06v-6.05c0-1.56-.55-3.08-1.56-4.27h0s2.02-.55,2.02-.55c.77-.21,1.29-.75,1.29-1.36v-1.14c0-.8-.87-1.45-1.94-1.45ZM27.68,33.35l.02-.06c.37-1.06,1.37-1.77,2.49-1.77h18.29c1.12,0,2.12.71,2.49,1.77l.02.06,2.87,6.48h-29.04l2.87-6.48ZM25.33,51.78c-1.71,0-3.11-1.39-3.11-3.11s1.39-3.11,3.11-3.11,3.11,1.39,3.11,3.11-1.39,3.11-3.11,3.11ZM47.02,50.37h-15.37v-3.4h15.37v3.4ZM53.34,51.78c-1.71,0-3.11-1.39-3.11-3.11s1.39-3.11,3.11-3.11,3.11,1.39,3.11,3.11-1.39,3.11-3.11,3.11Z"/></svg>');
	}
	& section:nth-child(3) h3:before{
		-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M57.79,15.79c-.59-.66-1.6-.71-2.26-.12-.66.59-.71,1.6-.12,2.26,3.59,3.99,5.39,9.02,5.39,14.07,0,5.05-1.8,10.08-5.39,14.07-.59.66-.54,1.67.12,2.26.66.59,1.67.54,2.26-.12,4.14-4.6,6.21-10.41,6.21-16.21,0-5.8-2.07-11.62-6.21-16.21ZM43.75,26.27c-.66.59-.71,1.6-.12,2.26.89.99,1.33,2.22,1.33,3.46,0,1.24-.44,2.48-1.33,3.47-.59.66-.54,1.67.12,2.26.66.59,1.67.54,2.26-.12,1.43-1.59,2.16-3.6,2.15-5.61,0-2-.72-4.02-2.15-5.61-.59-.66-1.6-.71-2.26-.12ZM37.56,11.84c-.69-.4-1.45-.59-2.22-.59s-1.54.2-2.24.6l-14.68,8.53h-9.4c-4.98,0-9.03,4.04-9.03,9.01v5.2c0,4.97,4.05,9.01,9.03,9.01h9.4l14.68,8.53c.69.4,1.46.6,2.24.6s1.53-.2,2.22-.59c1.38-.79,2.23-2.26,2.23-3.86V15.7c0-1.59-.85-3.06-2.23-3.86ZM17.03,39.16h-8.01c-2.53,0-4.58-2.04-4.58-4.56v-5.2c0-2.52,2.05-4.56,4.58-4.56h8.01v14.33ZM35.34,48.3l-15.71-9.14v-14.33h0l15.71-9.14v32.6ZM51.9,21.09c-.59-.66-1.6-.71-2.26-.12-.66.59-.71,1.6-.12,2.26,2.24,2.48,3.36,5.62,3.36,8.77s-1.12,6.29-3.36,8.77c-.59.66-.54,1.67.12,2.26.66.59,1.67.54,2.26-.12,2.79-3.09,4.18-7.01,4.18-10.91,0-3.9-1.4-7.82-4.18-10.91Z"/></svg>');
	}
	& section:nth-child(4) h3:before{
		-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M40.09,19.68h-5.29l-2.8,5.46-2.8-5.46h-5.29l3.66,7.14h-4.72v4.19h6.58v1.92h-6.58v4.19h6.58v7.22h5.14v-7.22h6.58v-4.19h-6.58v-1.92h6.58v-4.19h-4.72l3.66-7.14ZM32,8.9c-12.74,0-23.1,10.36-23.1,23.1s10.36,23.1,23.1,23.1,23.1-10.36,23.1-23.1-10.36-23.1-23.1-23.1ZM32,51.1c-10.53,0-19.1-8.57-19.1-19.1s8.57-19.1,19.1-19.1,19.1,8.57,19.1,19.1-8.57,19.1-19.1,19.1Z"/></svg>');
	}
}

#processLink{
	display: grid;
	justify-items: center;
	grid-row-gap: 16px;
	& h4{
		display: flex;
		justify-content: center;
		font: 600 clamp(20px, calc(22 / 768 * 100dvw), 22px) "Shippori Mincho", var(--font-min);
		letter-spacing: 0.05em;
		text-align: center;
		&:before,
		&:after{
			content: "\FF5C";
		}
		&:before{
			transform: rotate(-30deg);
		}
		&:after{
			transform: rotate(30deg);
		}
	}
	& a{
		display: grid;
		grid-template-columns: 1fr auto;
		align-items: center;
		min-width: min(100%, 300px);
		min-height: 48px;
		padding: 0.25em 1.5em;
		background: var(--color-theme);
		border-radius: 24px;
		color: #fff;
		font-weight: 500;
		letter-spacing: 0.05em;
		text-align: center;
		text-decoration: none;
		filter: drop-shadow(3px 3px 3px rgba(4, 0, 0, 0.2));
		&:after{
			content: "";
			aspect-ratio: 1;
			width: 24px;
			background: currentColor;
			transform: translateX(0.5em);
			-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M2.82,10.79h-.4v.99h.41c.32,0,.57-.12.57-.5s-.26-.5-.58-.5ZM6.3,10.86h-.47v2.29h.48c.65,0,1.02-.42,1.02-1.14s-.37-1.14-1.03-1.14ZM15.68.57h0s-11.05,0-11.05,0c-.66,0-1.2.54-1.2,1.2v5.36h1.6V2.17h9.05v5.11h5.11v14.54H5.03v-4.96h-1.6v5.36c0,.66.54,1.2,1.2,1.2h14.96c.66,0,1.2-.54,1.2-1.2V5.68s0,0,0,0L15.68.57ZM15.68,5.68v-2.84l2.84,2.84h-2.84ZM13.14,15.26v-6.52c0-.22-.18-.4-.4-.4H.4C.18,8.34,0,8.52,0,8.74v6.52C0,15.48.18,15.66.4,15.66h12.33c.22,0,.4-.18.4-.4ZM3.01,12.59h-.57v1.4h-.89v-4h1.48c.78,0,1.27.55,1.27,1.3,0,.81-.49,1.31-1.29,1.31ZM7.78,13.48c-.34.35-.81.54-1.37.54h-1.58v-4.03h1.57c1.14,0,1.91.81,1.91,2.02,0,.61-.18,1.12-.53,1.48ZM11.59,10.77h-1.67v.94h1.45v.76h-1.45v1.53h-1.01v-4.01h2.68v.78Z"/></svg>') no-repeat center / contain;
		}
		&:lang(ja){
			font-family: "Zen Kaku Gothic New", var(--font);
		}
	}
}

#reservation{
	position: relative;
	display: grid;
	grid-template-columns: var(--wrap);
	justify-content: center;
	margin-top: clamp(240px, calc(384 / 1200 * 100dvw), 384px);
	scroll-margin-top: clamp(64px, calc(80 / 1200 * 100dvw), 80px);
	background: #ebebeb;
	&:before{
		content: "Parking Reservation";
		content: "PARKING RESERVATION";
		font: 700 clamp(32px, calc(68 / 768 * 100dvw), 68px) "Shippori Mincho", var(--font-min);
		text-align: center;
		background: radial-gradient(circle at center, #1e963c, #105a30);
		letter-spacing: 0.1em;
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
	}
	&:after{
		content: "";
		position: absolute;
		top: calc(0px - clamp(160px, calc(240 / 1200 * 100dvw), 240px));
		left: 0;
		width: 100%;
		height: calc(100% + clamp(160px, calc(240 / 1200 * 100dvw), 240px) + clamp(96px, calc(192 / 1200 * 100dvw), 192px));
		background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" viewBox="0 0 16 16" fill="%23ebebeb"><rect width="100%" height="100%"/></svg>') no-repeat center bottom / 100% calc(100% - clamp(32px, calc(64 / 768 * 100dvw), 64px) - 32px), url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" viewBox="0 0 375 32" fill="%23ebebeb"><path d="M375,9.1c-125,31.52-250-31.52-375,0v22.9h375V9.1Z"/></svg>') no-repeat center 32px / 100% clamp(32px, calc(64 / 768 * 100dvw), 64px), url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" viewBox="0 0 375 80" fill="white"><path d="M375,.32C250-5.98,125,82.28,0,75.98v4.02h375V.32Z"/></svg>') no-repeat center top / 100% clamp(80px, calc(120 / 768 * 100dvw), 120px);
		z-index: -1;
		-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" viewBox="0 0 16 16"><rect width="100%" height="100%"/></svg>') no-repeat center top / 100% calc(100% - clamp(32px, calc(112 / 1200 * 100dvw), 112px) + 1px), url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" viewBox="0 0 1536 112"><path d="M1536,60.66c-67.13,19-136.27,31-206.4,40-178.35,22-348.68,12-525.03-30-52.1-13-99.19-27-151.3-36-29.06-4-56.11-10-84.16-12-3.01,0-7.01-2-10.02-2-117.23-13-230.45-14-347.68,0C139.27,29.66,69.14,42.66,0,60.66V0h1536v60.66Z"/></svg>') no-repeat center bottom / 100% clamp(32px, calc(112 / 1200 * 100dvw), 112px);
	}
	& h2{
		margin-top: clamp(16px, calc(64 / 1200 * 100dvw), 64px);
		font: 700 clamp(24px, calc(36 / 768 * 100dvw), 36px) "Shippori Mincho", var(--font-min);
		letter-spacing: 0.1em;
		text-align: center;
	}
	& h2+div{
		justify-self: center;
		margin-top: clamp(24px, calc(32 / 1200 * 100dvw), 32px);
		font-weight: 500;
		letter-spacing: 0.03em;
		&:lang(ja){
			font-family: "Zen Kaku Gothic New", var(--font);
		}
		& ul{
			margin-top: 0.5em;
			color: #c1272d;
		}
		@media (max-width: 767.98px) {
			& ul{
				padding-left: 1em;
				text-indent: -1em;
			}
		}
		@media (min-width: 768px) {
			text-align: center;
			letter-spacing: 0.08em;
		}
	}
	#reservationForm{
		justify-self: center;
		width: min(100%, 860px);
		margin-top: clamp(32px, calc(64 / 1200 * 100dvw), 64px);
	}
	#reservationLogin{
		margin-top: clamp(32px, calc(64 / 1200 * 100dvw), 64px);
	}
	@media (min-width: 992px) {
		&:after{
			background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" viewBox="0 0 16 16" fill="%23ebebeb"><rect width="100%" height="100%"/></svg>') no-repeat center bottom / 100% calc(100% - 104px), url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" viewBox="0 0 1536 104" fill="%23ebebeb"><path d="M0,4.04v99.96h1536v-8.75C1024,125.65,512-26.36,0,4.04Z"/></svg>') no-repeat center top / 100% 104px, url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" viewBox="0 0 1536 104" fill="%23f3f3f3"><path d="M1536,4.04C1024-26.36,512,125.65,0,95.25v8.75h1536V4.04Z"/></svg>') no-repeat center top / 100% 104px;
		}
	}
}

#reservationForm{
	display:grid;
	grid-row-gap: 24px;
	padding: clamp(16px, calc(40 / 1200 * 100dvw), 40px);
	background: #fff;
	border: 1px solid #b6b6b6;
	border-radius: clamp(16px, calc(24 / 1200 * 100dvw), 24px);
	filter: drop-shadow(3px 3px 3px rgba(4, 0, 0, 0.2));
	overflow: hidden;
	& h3{
		font-weight: 500;
		font-size: clamp(20px, calc(26 / 768 * 100dvw), 26px);
		letter-spacing: 0.08em;
	}
	& form{
		display: contents;
	}
	& dl{
		display: grid;
		grid-gap: 8px 16px;
		@media (min-width: 576px) {
			grid-template-columns: repeat(2, 1fr);
			&>*{
				grid-column: 1 / 3;
			}
			& dd{
				&:nth-of-type(2){
					grid-column: 1;
				}
				&:nth-of-type(3){
					grid-column: 2;
				}
			}
		}
	}
	& dt{
		counter-increment: count;
		display: grid;
		grid-template-columns: auto auto 1fr;
		align-items: baseline;
		font-weight: 500;
		font-size: clamp(18px, calc(22 / 768 * 100dvw), 22px);
		letter-spacing: 0.08em;
		&:before,
		&:after{
			color: var(--color-theme);
			font: 700 clamp(24px, calc(32 / 768 * 100dvw), 32px) "Shippori Mincho", var(--font-min);
		}
		&:before{
			content: "STEP";
			order: -1;
			font-size: clamp(16px, calc(20 / 768 * 100dvw), 20px);
		}
		&:after{
			content: counter(count);
			order: -1;
			margin-right: 0.5em;
			transform: translateY(5%);
		}
		& small{
			grid-column: 3;
			font-size: clamp(12px, calc(14 / 768 * 100dvw), 14px);
			letter-spacing: 0em;
		}
	}
	& label{
		font-weight: 500;
		font-size: clamp(14px, calc(18 / 768 * 100dvw), 18px);
	}
	& input{
		padding: 0.25em clamp(16px, calc(24 / 1200 * 100dvw), 24px);
		background: #ebebeb;
		border-color: transparent;
		border-radius: 4px;
		font-size: clamp(16px, calc(18 / 768 * 100dvw), 18px);
	}
	& select{
		padding: 0.25em clamp(16px, calc(24 / 1200 * 100dvw), 24px);
		background-color: #ebebeb;
		border-color: transparent;
		border-radius: 4px;
		font-size: clamp(16px, calc(18 / 768 * 100dvw), 18px);
	}
}

#reservationSubmit{
	& a{
		all: unset;
		box-sizing: border-box;
		display: grid;
		grid-template-columns: auto auto;
		justify-content: center;
		align-items: center;
		column-gap: 1em;
		width: 100%;
		min-height: 56px;
		background: var(--color-theme);
		border-radius: 4px;
		color: #fff;
		font-size: clamp(16px, calc(20 / 768 * 100dvw), 20px);
		letter-spacing: 0.08em;
		cursor: pointer;
		&:after{
			content: "";
			aspect-ratio: 1;
			width: 1.3em;
			background: currentColor;
			-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26 26" style="fill: none; stroke: black; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3px;"><circle cx="11.5" cy="11.5" r="9.5"/><line x1="18.5" y1="18.5" x2="24.5" y2="24.5"/></svg>') no-repeat center / contain;
		}
	}
}

#reservationNote{
	display: grid;
	grid-row-gap: 8px;
	padding: clamp(16px, calc(24 / 1200 * 100dvw), 24px);
	background: #ebebeb;
	border-radius: 4px;
	font-size: clamp(14px, calc(18 / 768 * 100dvw), 18px);
	letter-spacing: 0.08em;
	& strong{
		color: #c1272d;
	}
	& a{
		display: grid;
		grid-template-columns: auto auto;
		justify-content: center;
		align-items: center;
		column-gap: 0.5em;
		width: 100%;
		min-height: 48px;
		background: #fff;
		border-radius: 4px;
		color: var(--color-theme);
		font-weight: 500;
		font-size: clamp(16px, calc(20 / 768 * 100dvw), 20px);
		letter-spacing: 0.08em;
		text-decoration: none;
		&:after{
			content: "";
			aspect-ratio: 1;
			width: 1em;
			background: currentColor;
			-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 14 14"><path d="M11.16,12.45H1.55V2.84h4.45v-1.55H.77c-.43,0-.77.35-.77.77v11.16c0,.43.35.77.77.77h11.16c.21,0,.4-.08.55-.23.15-.15.23-.34.23-.55v-5.23h-1.55v4.45ZM13.95.35c0-.17-.14-.31-.31-.31l-5.25-.05c-.18,0-.34.07-.46.2-.12.13-.18.3-.16.48.03.33.29.57.62.58l3.32.03-6.37,6.37c-.28.28-.29.74-.01,1.01.13.13.31.2.49.2s.38-.08.52-.22l6.37-6.37.03,3.32c0,.33.25.59.58.62.02,0,.03,0,.05,0,.17,0,.33-.07.44-.19.12-.12.18-.28.18-.45l-.05-5.24Z"/></svg>') no-repeat center / contain;
		}
	}
}

#reservationLogin{
	display: grid;
	justify-self: center;
	& h3{
		display: flex;
		justify-content: center;
		font: 600 clamp(20px, calc(22 / 768 * 100dvw), 22px) "Shippori Mincho", var(--font-min);
		letter-spacing: 0.05em;
		text-align: center;
		&:before,
		&:after{
			content: "\FF5C";
		}
		&:before{
			transform: rotate(-30deg);
		}
		&:after{
			transform: rotate(30deg);
		}
		& span{
			display: contents;
			color: #c1272d;
		}
	}
	& h3+div{
		margin-top: 16px;
	}
	& ul{
		display: grid;
	}
	& a{
		display: grid;
		grid-template-columns: 1fr auto;
		align-items: center;
		min-height: 56px;
		padding: 8px 32px;
		background: var(--color-theme);
		border-radius: 2px;
		color: #fff;
		font-weight: 500;
		letter-spacing: 0.1em;
		text-align: center;
		text-decoration: none;
		&:after{
			content: "";
			aspect-ratio: 1;
			width: 16px;
			background: currentColor;
			transform: translateX(24px);
			-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" style="fill: none; stroke: black; stroke-miterlimit: 10;"><polyline points="5.5 3 10.5 8 5.5 13"/></svg>') no-repeat center / contain;
		}
		&:lang(ja){
			font-family: "Zen Kaku Gothic New", var(--font);
		}
		&[href$="/signup/index.html"]{
			background: #c1272d;
		}
	}
	@media (max-width: 575.98px) {
		& h3{
			&:before{
				transform: rotate(-30deg) translate(8px, 6px);
			}
			&:after{
				transform: rotate(30deg) translate(-8px, 6px);
			}
		}
		& ul{
			grid-row-gap: 16px;
			justify-content: center;
		}
	}
	@media (min-width: 576px) {
		& ul{
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			column-gap: 40px;
		}
	}
}

#slide{
	display: grid;
	grid-template-columns: 1fr var(--wrap) 1fr;
	margin-top: clamp(160px, calc(256 / 1200 * 100dvw), 256px);
	overflow: hidden;
	& ul{
		grid-column: 2 / 4;
		display: grid;
		overflow: hidden;
	}
	& li{
		grid-column: 1;
		grid-row: 1;
	}
	& img{
		aspect-ratio: 3 / 2;
		object-fit: cover;
	}
	.slick-slider{
		display: grid;
		align-items: center;
		.slick-list{
			grid-row: 1;
			overflow: visible;
		}
		.slick-arrow{
			grid-row: 1;
		}
		.slick-prev{
			grid-column: 1;
		}
	}
	.slick-arrow{
		all: unset;
		box-sizing: border-box;
		cursor: pointer;
		position: relative;
		aspect-ratio: 1;
		width: clamp(48px, calc(64 / 1200 * 100dvw), 64px);
		margin: 8px;
		background: rgba(200, 170, 20, 0.8);
		border-radius: 100%;
		color: #fff;
		font-size: 0;
		z-index: 1;
		&:before{
			content: "";
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background: currentColor;
			-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path d="M25.14,16c0-.58-.22-1.17-.67-1.62L10.76.67c-.89-.89-2.34-.89-3.23,0-.89.89-.89,2.34,0,3.23l12.1,12.1-12.1,12.1c-.89.89-.89,2.34,0,3.23.89.89,2.34.89,3.23,0l13.71-13.71c.45-.45.67-1.03.67-1.62Z"/></svg>') no-repeat center / 50%;
		}
		&.slick-prev:before{
			transform: scale(-1, 1);
		}
	}
	@media (max-width: 991.98px) {
		.slick-slider{
			grid-template-columns: 0 var(--wrap) 1fr;
			.slick-list{
				grid-column: 1 / 3;
			}
			.slick-next{
				grid-column: 2;
				justify-self: end;
			}
		}
	}
	@media (min-width: 992px) {
		.slick-slider{
			grid-template-columns: auto 1fr auto;
			.slick-list{
				grid-column: 1 / 4;
			}
			.slick-next{
				grid-column: 3;
			}
		}
	}
}

#useful{
	display: grid;
	grid-template-columns: var(--wrap);
	justify-content: center;
	margin-top: clamp(56px, calc(72 / 1200 * 100dvw), 72px);
	&:before{
		content: "USEFUL INFORMATION";
		font: 700 clamp(32px, calc(68 / 768 * 100dvw), 68px) "Shippori Mincho", var(--font-min);
		text-align: center;
		background: radial-gradient(circle at center, #c8aa14, #7d6e00);
		letter-spacing: 0.1em;
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
	}
	& h2{
		font: 700 clamp(24px, calc(36 / 768 * 100dvw), 36px) "Shippori Mincho", var(--font-min);
		letter-spacing: 0.1em;
		text-align: center;
	}
	&:not(:has(hgroup)){
		& h2{
			margin-top: clamp(16px, calc(64 / 1200 * 100dvw), 64px);
		}
	}
	& hgroup{
		justify-self: center;
		display: grid;
		margin-top: clamp(16px, calc(64 / 1200 * 100dvw), 64px);
		& h2{
			order: 1;
		}
		& p{
			font-weight: 700;
			font-size: clamp(18px, calc(24 / 1200 * 100dvw), 24px);
			letter-spacing: 0.05em;
			text-align: center;
		}
	}
	& hgroup+div,
	& h2+div{
		justify-self: center;
		display: grid;
		grid-row-gap: 1em;
		margin-top: clamp(24px, calc(32 / 1200 * 100dvw), 32px);
		font-weight: 500;
		letter-spacing: 0.03em;
		&:lang(ja){
			font-family: "Zen Kaku Gothic New", var(--font);
		}
		@media (min-width: 768px) {
			text-align: center;
			letter-spacing: 0.08em;
			word-break: keep-all;
			overflow-wrap: anywhere;
		}
	}
	#usefulLink{
		justify-self: center;
		margin-top: clamp(40px, calc(64 / 1200 * 100dvw), 64px);
	}
}

#usefulLink{
	display: grid;
	grid-gap: 24px 72px;
	filter: drop-shadow(3px 3px 3px rgba(4, 0, 0, 0.2));
	@media (min-width: 1200px) {
		grid-template-columns: repeat(2, 1fr);
	}
	& dl{
		justify-self: center;
		position: relative;
		display: grid;
		grid-template-columns: auto 1fr;
		width: min(100%, 510px);
		background: #fff;
		border: 1px solid #999;
	}
	& dt{
		align-self: center;
		display: grid;
		align-items: center;
		padding: 0.25em 1em;
		font-weight: 600;
		font-size: clamp(14px, calc(20 / 768 * 100dvw), 20px);
		font: 600 clamp(14px, calc(20 / 768 * 100dvw), 20px) "Shippori Mincho", var(--font-min);
		word-break: keep-all;
		overflow-wrap: anywhere;
		&:lang(zh-TW){
			font-family: inherit;
		}
		& small{
			color: var(--color-theme);
		}
	}
	& dd{
		&:has(img){
			order: -1;
			width: clamp(120px, calc(180 / 768 * 100dvw), 180px);
		}
		& img{
			aspect-ratio: 180 / 150;
			width: 100%;
			object-fit: cover;
		}
		&:has(a){
			display: contents;
		}
		& a{
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			font-size: 0;
			&:before{
				content: "";
				position: absolute;
				right: clamp(8px, calc(12 / 768 * 100dvw), 12px);
				bottom: clamp(8px, calc(12 / 768 * 100dvw), 12px);
				aspect-ratio: 1;
				width: clamp(8px, calc(12 / 768 * 100dvw), 12px);
				background: currentColor;
				-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12"><polygon points="12 12 0 12 12 0 12 12"/></svg>') no-repeat center / contain;
			}
		}
	}
}

#faq{
	display: grid;
	grid-template-columns: 1fr var(--wrap) 1fr;
	margin-top: clamp(80px, calc(160 / 1200 * 100dvw), 160px);
	overflow: hidden;
	&>*{
		grid-column: 2;
	}
	& h2{
		justify-self: start;
		position: relative;
		padding-bottom: 8px;
		font: 700 clamp(28px, calc(36 / 768 * 100dvw), 36px) "Shippori Mincho", var(--font-min);
		letter-spacing: 0.1em;
		text-align: center;
		border-bottom: 2px solid #999;
		&:after{
			content: "";
			position: absolute;
			right: 100%;
			bottom: -2px;
			width: 100dvw;
			border-bottom: 2px solid var(--color-theme);
		}
	}
	#faqList{
		margin-top: clamp(32px, calc(40 / 1200 * 100dvw), 40px);
	}
	@media (max-width: 991.98px) {
		#faqPhoto{
			justify-self: center;
			width: min(100%, 480px);
			margin-top: 40px;
		}
	}
	@media (min-width: 992px) {
		grid-template-rows: auto 1fr;
		& h2{
			grid-row: 1;
			margin-top: clamp(64px, calc(80 / 1200 * 100dvw), 80px);
		}
		#faqList{
			grid-row: 2;
			width: clamp(560px, calc(690 / 1200 * 100dvw), 690px);
		}
		#faqPhoto{
			grid-column: 2 / 4;
			grid-row: 1 / 3;
			align-self: start;
			width: min(100%, 1350px);
			padding-left: clamp(600px, calc(800 / 1200 * 100dvw), 800px);
			z-index: -1;
		}
	}
}

#faqList{
	border-top: 1px solid #999;
	& details{
		counter-increment: count;
		display: grid;
		grid-template-columns: auto 1fr;
		column-gap: 16px;
		border-bottom: 1px solid #999;
		&:before{
			content: "Q"counter(count);
			color: var(--color-theme);
			font: 500 30px "Source Code Pro", monospace;
			letter-spacing: 0.05em;
			line-height: 64px;
		}
		&::details-content{
			grid-column: 2;
		}
		&[open]::details-content{
			margin: 8px 0 16px 0;
			padding: clamp(16px, calc(24 / 1200 * 100dvw), 24px);
			background: #f3f3f3;
		}
	}
	& summary{
		display: grid;
		grid-template-columns: 1fr auto;
		align-items: center;
		column-gap: 0.5em;
		min-height: 64px;
		padding: 8px 0;
		font-weight: 500;
		font-size: clamp(16px, calc(18 / 768 * 100dvw), 18px);
		&:after{
			content: "\FF0B";
			color: var(--color-theme);
			font-size: 24px;
		}
		[open] &:after{
			content: "\FF0D";
		}
		&:lang(ja):after{
			font-family: "Zen Kaku Gothic New", var(--font);
		}
	}
}

#faqPhoto{
	display: grid;
	grid-row-gap: 8px;
	& img{
		aspect-ratio: 354 / 413;
		object-fit: cover;
	}
	& figcaption{
		letter-spacing: 0.02em;
		& strong{
			display: block;
			letter-spacing: 0.08em;
		}
	}
}

#administrator{
	display: grid;
	grid-template-columns: var(--wrap);
	justify-content: center;
	margin-top: clamp(72px, calc(96 / 1200 * 100dvw), 96px);
	padding: 48px 0;
	background: #f3f3f3;
	& h2{
		font: 700 22px "Shippori Mincho", var(--font-min);
		letter-spacing: 0.05em;
		text-align: center;
	}
	& h2+div{
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		grid-gap: 32px 56px;
		margin-top: 32px;
	}
	& dl{
		display: grid;
		justify-items: center;
		grid-row-gap: 8px;
		width: 234px;
	}
	& dt{
		order: 1;
		font-size: 13px;
		letter-spacing: 0.05em;
		text-align: center;
	}
	& dd{
		& a{
			display: block;
		}
		& img{
			display: block;
			aspect-ratio: 234 / 60;
			width: 234px;
		}
	}
}