/* CSS Document */

#wrapper{}
	@media (min-width: 992px) {
		#wrapper #header{
			transition: opacity 0.2s ease-out;
			}
		#wrapper #nav{
			transition: margin 0.2s ease-out;
			}
		.scrollTop #wrapper #header{
			opacity: 0;
			}
		.scrollTop #wrapper #nav{
			margin: 0;
			}
		}

#pagePath{
	display: none;
	}

#main{}
	@media (min-width: 992px) {
		#main:before{
			content: "";
			display: block;
			height: 140px;
			margin: 24px;
			-webkit-mask: var(--logo) top left no-repeat;
			-webkit-mask-size: contain;
			background: currentColor;
			}
		}

#hero{
	display: grid;
	grid-template-areas: 'main';
	background: #ccc;
	background: var(--color-theme) url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="50" cy="50" fill="none" stroke="rgba(255, 255, 255, 0.5)" stroke-width="8" r="35" stroke-dasharray="164.93361431346415 56.97787143782138"><animateTransform attributeName="transform" type="rotate" repeatCount="indefinite" dur="1s" values="0 50 50;360 50 50" keyTimes="0;1"></animateTransform></circle></svg>') center no-repeat;
	background-size: 160px;
	}
	#hero #heroSlide{
		grid-area: main;
		}
	#hero #heroMovie{
		grid-area: main;
		}

#heroSlide{
	transition: opacity 0.2s ease-out;
	opacity: 0;
	}
	#heroSlide dl{
		position: relative;
		display: grid;
		grid-template-rows: 1fr auto auto;
		grid-template-areas: 'title' 'catch' 'link';
		grid-gap: clamp(20px, 3.6vw, 24px);
		aspect-ratio: 390 / 540;
		padding: clamp(20px, 3.6vw, 24px);
		background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4) 57%);
		color: #fff;
		}
	#heroSlide dt{
		grid-area: title;
		display: grid;
		place-items: center;
		font-size: clamp(24px, 4.8vw, 32px);
		writing-mode: vertical-rl;
		line-height: 1.65em;
		text-shadow: 0 0 5px #000;
		}
	#heroSlide dt+dd{}
		#heroSlide dt+dd:empty{
			display: none;
			}
	#heroSlide dd{}
		#heroSlide dd:nth-last-child(2){
			grid-area: catch;
			font-size: 18px;
			line-height: 1.65em;
			text-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
			}
		#heroSlide dd:last-child{
			display: contents;
			}
		#heroSlide dd img{
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			object-fit: cover;
			z-index: -1;
			}
		#heroSlide dd a{
			grid-area: link;
			display: grid;
			justify-self: center;
			grid-template-columns: auto 4px;
			grid-gap: 16px;
			align-items: center;
			min-height: 40px;
			padding: 8px 16px;
			border: 1px solid rgba(255, 255, 255, 0.4);
			color: inherit;
			text-align: center;
			z-index: 1;
			}
			#heroSlide dd a:after{
				content: "";
				aspect-ratio: 1;
				-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4 8"><polygon points="4 4 0 8 0 0 4 4"/></svg>') center no-repeat;
				-webkit-mask-size: contain;
				background: currentColor;
				}
	#heroSlide.slick-slider{
		display: grid;
		grid-template-areas: 'main';
		}
	#heroSlide.slick-dotted{}
		#heroSlide.slick-dotted dl{
			padding-bottom: 32px;
			}
	#heroSlide.slick-initialized{
		display: grid;
		grid-template-areas: 'main';
		opacity: 1;
		}
	#heroSlide .slick-list{
		grid-area: main;
		}
	#heroSlide .slick-slide{
		position: relative;
		}
	#heroSlide .slick-arrow{
		grid-area: main;
		align-self: center;
		position: relative;
		color: #fff;
		filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.6));
		}
	#heroSlide .slick-prev{
		justify-self: start;
		margin-left: 20px;
		}
	#heroSlide .slick-next{
		justify-self: end;
		margin-right: 20px;
		}
	#heroSlide .slick-dots{
		position: absolute;
		left: 0;
		bottom: 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		grid-gap: 16px;
		width: 100%;
		padding: 16px;
		z-index: 1;
		}
		#heroSlide .slick-dots li{
			width: 8px;
			height: 8px;
			border: 1px solid rgba(255, 255, 255, 0.4);
			border-radius: 4px;
			overflow: hidden;
			}
			#heroSlide .slick-dots li.slick-active{
				background: #fff;
				}
		#heroSlide .slick-dots button{
			opacity: 0;
			}
	@media (min-width: 576px) {
		#heroSlide dl{
			grid-template-columns: 1fr auto;
			grid-template-rows: 1fr auto;
			grid-template-areas: 'title title' 'catch link';
			align-items: center;
			aspect-ratio: 2 / 1;
			background: linear-gradient(rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0.4));
			}
		#heroSlide dd{}
			#heroSlide dd a{
				justify-self: end;
				}
		}
	@media (min-width: 992px) {
		#heroSlide dl{
			grid-template-areas: 'title title title' 'catch line link';
			grid-template-columns: 1fr auto auto;
			grid-column-gap: 0;
			}
		#heroSlide dd:nth-last-child(2){
			display: contents;
			}
			#heroSlide dd:nth-last-child(2):after{
				content: "";
				grid-area: line;
				width: max(calc(50vw - 188px), 80px);
				height: 0;
				margin-left: 16px;
				border-top: 1px solid rgba(255, 255, 255, 0.4);
				}
		#heroSlide dd{}
			#heroSlide dd a{
				width: 160px;
				}
		#heroSlide.slick-dotted{}
			#heroSlide.slick-dotted dl{
				padding-bottom: 40px;
				}
		#heroSlide .slick-prev{
			margin-left: 60px;
			}
		#heroSlide .slick-next{
			margin-right: 60px;
			}
		#heroSlide .slick-dots{
			bottom: 24px
			}
		}
	@media (min-width: 1200px) {
		#heroSlide dl{
			padding: 48px;
			}
		#heroSlide dt{
			font-size: 48px;
			}
		#heroSlide dd{}
			#heroSlide dd:nth-last-child(2){
				font-size: 20px;
				}
		}

#heroMovie{
	position: relative;
	aspect-ratio: 390 / 540;
	transition: opacity 0.2s ease-out;
	opacity: 0;
	overflow: hidden;
	}
	#heroMovie:before{
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0) 77%);
		z-index: 1;
		}
	#heroMovie.done{
		opacity: 1;
		}
	#heroMovie div{
		display: contents;
		}
	#heroMovie .playerBox{
		top: 50% !important;
		left: 50% !important;
		width: 100% !important;
		height: 100% !important;
		transform: translate(-50%, -50%) scale(2.5);
		z-index: -1;
		}
	@media (min-width: 576px) {
		#heroMovie{
			aspect-ratio: 2 / 1;
			}
			#heroMovie:before{
				background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0) 57%);
				}
			#heroMovie .playerBox{
				transform: translate(-50%, -50%) scale(1.5);
				}
		}

#about{
	position: relative;
	display: grid;
	grid-gap: 10px;
	width: var(--wrap);
	grid-gap: clamp(16px, 3.6vw, 24px);
	margin: 0 auto;
	padding: clamp(32px, 8.4vw, 56px) 0;
	}
	#about:after{
		content: "";
		position: absolute;
		left: 50%;
		bottom: 0;
		width: 100vw;
		border-bottom: 1px solid var(--color-border);
		transform: translateX(-50%);
		}
	#about h2{
		justify-self: center;
		font-size: clamp(24px, 4.8vw, 32px);
		}
	@media (min-width: 992px) {
		#about{
			grid-template-columns: 1fr 1fr;
			}
		#about h2{
			justify-self: start;
			}
		}
	@media (min-width: 1200px) {
		#about h2{
			font-size: 48px;
			}
		#about h2+div{
			font-size: 18px;
			}
		}

#recommend{
	width: var(--wrap);
	margin: 80px auto;
	}
	#recommend h2+div{
		display: grid;
		grid-gap: 16px 24px;
		margin-top: clamp(24px, 4.8vw, 32px);
		}
		#recommend h2+div p{
			text-align: center;
			}
	#recommend section{
		margin-top: clamp(24px, 4.8vw, 32px);
		}
		#recommend section:not(.select){
			display: none;
			}
	#recommend h3{
		display: none;
		}
	#recommend h3+div{
		opacity: 0;
		transition: opacity 0.2s ease-out;
		}
	#recommend dl{
		position: relative;
		display: grid;
		grid-template-areas: 'photo';
		grid-gap: 16px;
		}
		#recommend dl:before{
			content: "NO PHOTO";
			grid-area: photo;
			background: var(--dummy);
			background-size: contain;
			aspect-ratio: 1;
			}
	#recommend dt{
		color: #595757;
		font-size: clamp(16px, 2.7vw, 18px);
		font-weight: 500;
		line-height: 1.65;
		}
	#recommend dd{
		display: contents;
		}
		#recommend dd img{
			grid-area: photo;
			width: 100%;
			height: 100%;
			aspect-ratio: 1;
			object-fit: cover;
			}
		#recommend dd a{
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			font-size: 0;
			}
	#recommend .slick-slider{
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		grid-gap: 24px 16px;
		}
	#recommend .slick-initialized{
		opacity: 1;
		}
	#recommend .slick-list{
		grid-column: 1 / 3;
		grid-row: 1;
		padding-right: 20px;
		overflow: visible;
		}
	#recommend .slick-slide{
		margin: 0 20px 0 0;
		}
	#recommend .slick-prev{
		justify-self: end;
		}
	@media (min-width: 992px) {
		#recommend .slick-list{
			margin: 0 -20px;
			padding-right: 0;
			overflow: hidden;
			}
		#recommend .slick-slide{
			margin: 0 20px;
			}
		}
	@media (min-width: 1200px) {
		#recommend h2+div{
			grid-template-columns: auto auto;
			align-items: center;
			justify-content: start;
			padding-top: 20px;
			}
		}

#ranking{
	width: var(--wrap);
	margin: 80px auto;
	}
	#ranking h2{
		display: flex;
		align-items: center;
		}
	#ranking h2+div{
		display: grid;
		grid-gap: 18px 24px;
		margin-top: clamp(24px, 4.8vw, 32px);
		}
	#ranking section{
		margin-top: clamp(24px, 4.8vw, 32px);
		}
		#ranking section:not(.select){
			display: none;
			}
		#ranking section div{
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			grid-gap: 24px 10px;
			}
			#ranking section div:not(.select){
				display: none;
				}
	#ranking h3{
		display: none;
		}
	#ranking dl{
		position: relative;
		display: grid;
		grid-template-areas: 'photo' 'title';
		align-content: start;
		grid-gap: 16px;
		background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80"><polygon points="0 80 0 0 80 0 0 80" style="fill:%23fff; opacity:.8;"/></svg>') left top no-repeat;
		background-size: 60px;
		}
		#ranking dl:before{
			content: "NO PHOTO";
			grid-area: photo;
			background: var(--dummy);
			background-size: contain;
			aspect-ratio: 1 / 0.66;
			z-index: -1;
			}
		#ranking dl:after{
			content: "";
			grid-area: photo;
			width: 40px;
			aspect-ratio: 1;
			-webkit-mask-position: center;
			-webkit-mask-repeat: no-repeat;
			-webkit-mask-size: 50%;
			background: currentColor;
			}
			#ranking dl:nth-child(1):after{
				-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 17.17 22.21"><path d="m16.71,0l-.17.14c-1.88,1.45-3.93,2.83-6.09,4.08-2.15,1.25-4.46,2.16-6.85,2.71l-.28.06.33.92.22-.06c.7-.19,1.43-.42,2.18-.69.74-.26,1.5-.56,2.24-.89.74-.32,1.45-.67,2.12-1.03.39-.21.75-.42,1.1-.63L0,22.21l3.98-.78.06-.11c.71-1.38,1.64-2.99,2.75-4.8,1.12-1.82,2.3-3.71,3.52-5.6,1.2-1.87,2.43-3.75,3.64-5.58,1.2-1.81,2.24-3.39,3.12-4.72l.11-.17-.46-.46Z"/></svg>');
				-webkit-mask-size: 40%;
				}
			#ranking dl:nth-child(2):after{
				-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 23.14 22.34"><path d="m12.27,15.54c1.36-.57,2.7-1.18,3.99-1.81,1.31-.63,2.48-1.36,3.49-2.15,1.02-.8,1.85-1.72,2.46-2.75.62-1.04.94-2.24.94-3.59,0-.64-.13-1.29-.38-1.91-.25-.63-.65-1.2-1.18-1.69-.53-.49-1.19-.89-1.98-1.19-.79-.3-1.72-.46-2.79-.46-1.23,0-2.34.22-3.3.64-.96.42-1.78.97-2.44,1.63s-1.17,1.39-1.51,2.18c-.35.79-.52,1.55-.52,2.28,0,.99.27,1.8.8,2.39.54.6,1.27.9,2.17.9.68,0,1.31-.17,1.85-.52.54-.34.97-.8,1.29-1.37l.1-.19-.45-.34-.13.06c-.29.13-.53.24-.73.32-.17.07-.4.1-.69.1-.62,0-1.11-.24-1.51-.73-.41-.51-.6-1.06-.6-1.7,0-.7.16-1.33.47-1.88.32-.56.72-1.04,1.2-1.43.48-.39,1.03-.69,1.62-.9.6-.2,1.18-.31,1.74-.31,1.29,0,2.24.39,2.91,1.19.67.8,1,1.87,1,3.16,0,.8-.12,1.58-.35,2.33-.23.74-.66,1.5-1.27,2.26-.62.77-1.51,1.54-2.63,2.29-1.13.76-2.61,1.56-4.4,2.38-3.81,1.73-6.68,3.2-8.53,4.36-2.55,1.6-2.9,2.21-2.9,2.59,0,.12,0,.23.02.32.01.08.08.33.47.33.22,0,.44-.16.7-.5.19-.26.45-.54.76-.85.3-.3.7-.57,1.19-.81.48-.24,1.1-.35,1.83-.35.65,0,1.28.13,1.86.38.6.26,1.2.54,1.79.83.59.29,1.15.58,1.7.86.58.3,1.16.45,1.73.45,1.02,0,1.98-.22,2.83-.67.85-.44,1.62-1,2.3-1.69.68-.68,1.29-1.44,1.81-2.26.52-.82.99-1.62,1.39-2.4l.16-.31-.81-.12-.08.16c-.23.47-.55,1.02-.93,1.64-.38.61-.81,1.18-1.27,1.7-.46.51-.98.96-1.53,1.32-.53.34-1.08.52-1.64.52-.39,0-.89-.12-1.47-.34-.61-.24-1.24-.49-1.88-.76-.67-.27-1.32-.51-1.95-.74-1-.36-1.75-.42-2.44-.29.54-.29,1.1-.57,1.69-.83,1.31-.58,2.67-1.17,4.02-1.74Z"/></svg>');
				}
			#ranking dl:nth-child(3):after{
				-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 23.14 22.34"><path d="m21.98,2.84c-.21-.57-.55-1.07-1-1.5-.45-.42-1.01-.75-1.67-.99-.65-.24-1.44-.35-2.34-.35s-1.82.15-2.63.46c-.81.3-1.53.72-2.13,1.25-.61.53-1.1,1.13-1.46,1.81-.36.69-.55,1.42-.55,2.18s.24,1.41.7,1.96c.47.56,1.14.85,1.99.85.66,0,1.27-.18,1.8-.54.56-.38.86-.87.89-1.45l.02-.43-.38.19c-.25.12-.46.2-.62.24-.17.04-.4.05-.67.05-.55,0-.95-.2-1.21-.62-.28-.45-.42-.95-.42-1.49s.12-.98.35-1.38c.23-.41.54-.76.92-1.05.38-.29.81-.51,1.3-.66.49-.15.99-.23,1.47-.23,1.05,0,1.8.32,2.3.98.51.67.77,1.51.77,2.49,0,.89-.17,1.64-.49,2.24-.33.6-.77,1.11-1.31,1.5-.55.4-1.19.71-1.89.95-.72.23-1.47.41-2.24.53-.78.12-1.57.21-2.34.28-.79.07-1.51.14-2.15.22l-.22.03v1.15l.29-.04c.37-.05.74-.09,1.12-.12.38-.03.76-.04,1.12-.04,1.13,0,2.01.31,2.62.91.61.6.92,1.48.92,2.6,0,.99-.22,1.9-.65,2.7-.44.81-1.01,1.5-1.72,2.06-.71.56-1.53,1.01-2.44,1.32-.92.31-1.88.47-2.86.47-1.3,0-2.4-.31-3.26-.91-.84-.6-1.25-1.48-1.25-2.72,0-1.13.27-2,.81-2.59.54-.59,1.16-.88,1.9-.88.14,0,.31.02.5.07l.24.06.14-.54-.1-.1c-.29-.29-.66-.52-1.08-.7-.43-.17-.85-.26-1.25-.26-1.19,0-2.14.43-2.82,1.27-.66.83-.99,1.82-.99,2.94,0,.84.21,1.61.62,2.27.4.65.94,1.22,1.61,1.68.66.45,1.43.8,2.28,1.04.85.23,1.73.35,2.62.35,1.32,0,2.63-.18,3.89-.53,1.26-.35,2.4-.85,3.39-1.49,1-.64,1.81-1.43,2.42-2.35.61-.93.92-1.97.92-3.08,0-1.46-.44-2.58-1.31-3.33-.55-.48-1.21-.82-1.98-1.03.63-.12,1.27-.26,1.9-.42,1.08-.28,2.07-.66,2.93-1.12.88-.47,1.61-1.06,2.16-1.77.57-.72.85-1.6.85-2.61,0-.62-.11-1.21-.32-1.77Z"/></svg>');
				}
			#ranking dl:nth-child(4):after{
				-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22.69 24.94"><polygon points="22.69 3.67 19.78 3.97 11.59 16.4 2.46 16.4 22.34 0 20.51 0 0 17.38 10.98 17.38 6.01 24.94 9.47 24.44 13.98 17.38 18.87 17.38 19.44 16.4 14.58 16.4 22.69 3.67"/></svg>');
				}
			#ranking dl:nth-child(5):after{
				-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 23.14 22.34"><path d="m22.98.42l-.2.15c-.41.31-.87.57-1.37.77-.87.36-2.02.48-3.24-.06-.54-.24-1.03-.6-1.46-1.08l-.18-.2L6.08,10.67l.55.44.15-.08c.65-.36,1.34-.67,2.04-.92.69-.24,1.42-.37,2.16-.37,1.09,0,1.91.3,2.43.9.53.6.8,1.44.8,2.49s-.18,2.05-.54,3.01-.87,1.84-1.52,2.58c-.64.74-1.43,1.34-2.34,1.78-.91.43-1.93.66-3.03.66-1.26,0-2.28-.35-3.01-1.03-.73-.68-1.1-1.65-1.1-2.88,0-.92.26-1.69.78-2.3.52-.6,1.16-.89,1.97-.89.12,0,.24,0,.35.02.11.01.23.03.36.06l.23.05.13-.52-.09-.1c-.69-.74-1.53-1.12-2.5-1.12-1.16,0-2.12.41-2.83,1.22-.71.8-1.06,1.79-1.06,2.95,0,.92.2,1.74.59,2.44.39.7.92,1.28,1.57,1.74.65.46,1.39.8,2.2,1.02.81.22,1.64.33,2.49.33,1.28,0,2.54-.25,3.75-.74,1.21-.49,2.31-1.14,3.27-1.94.96-.8,1.75-1.74,2.34-2.79.59-1.06.89-2.16.89-3.26,0-1.59-.49-2.8-1.45-3.61-.95-.79-2.27-1.2-3.92-1.2-.74,0-1.39.08-1.93.23-.26.07-.52.15-.78.24l6.12-6.12c.6.26,1.11.48,1.53.65.8.33,1.86.47,3.06.04.47-.17.93-.39,1.37-.66.43-.27.85-.57,1.23-.9.39-.33.7-.67.92-1.01l.1-.15-.38-.5Z"/></svg>');
				}
	#ranking dt{
		grid-area: title;
		color: #595757;
		font-weight: 500;
		line-height: 1.65;
		}
	#ranking dd{
		display: contents;
		}
		#ranking dd img{
			grid-area: photo;
			width: 100%;
			aspect-ratio: 1 / 0.66;
			object-fit: cover;
			z-index: -1;
			}
		#ranking dd a{
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			font-size: 0;
			}
	#ranking footer{
		display: grid;
		grid-gap: 16px 24px;
		margin-top: clamp(32px, 6vw, 40px);
		}
	#ranking .tabB{}
		#ranking .tabB li{
			min-width: 12em;
			}
	@media (max-width: 767.98px) {
		#ranking dl:first-child{
			grid-column: 1 / 3;
			}
		}
	@media (max-width: 575.98px) {
		#ranking .tabA li{
			font-size: 10px;
			padding: 4px 0px;
			}
		}
	@media (max-width: 767.98px) {
		#ranking h2{
			display: grid;
			}
		}
	@media (min-width: 768px) {
		#ranking section div{
			display: grid;
			grid-template-columns: 1.7fr 1fr 1fr;
			grid-gap: 24px;
			}
		#ranking dl{}
			#ranking dl:first-child{
				grid-row: 1 / 3;
				}
				#ranking dl:first-child:before,
				#ranking dl:first-child img{
					aspect-ratio: 1;
					}
			#ranking dl:nth-child(n+4){
				align-self: end;
				}
			#ranking dt{
				white-space: nowrap;
				text-overflow: ellipsis;
				overflow: hidden;
				}
		}
	@media (min-width: 1200px) {
		#ranking section div{
			grid-gap: 48px;
			}
		#ranking h2+div{
			grid-template-columns: auto auto;
			align-items: center;
			justify-content: space-between;
			padding-top: 20px;
			}
		#ranking dl{
			background-size: 80px;
			}
			#ranking dl:after{
				width: 50px;
				}
		#ranking dt{
			font-size: 18px;
			}
		#ranking footer{
			grid-template-columns: 320px 320px;
			justify-content: center;
			}
		}

#information{
	display: grid;
	grid-template-columns: 1fr var(--wrap) 1fr;
	grid-gap: clamp(32px, 6vw, 40px) 0;
	padding: 80px 0;
	background: var(--color-theme);
	color: #fff;
	}
	#information > *{
		grid-column: 2;
		}
	#information h2+div{
		display: grid;
		grid-gap: 24px;
		width: min(100%, 1000px);
		margin: 0 auto;
		}
	#information .topicsList{
		color: #fff;
		}
		#information .topicsList li{
			color: var(--color);
			border-color: transparent;
			}
	#information .button{
		background: transparent;
		color: #fff;
		}
	@media (min-width: 1200px) {
		#information h2{
			grid-row: 1;
			}
		#information h2+div+div{
			grid-row: 1;
			justify-self: end;
			}
		}

#map{
	display: grid;
	grid-template-columns: 1fr var(--wrap) 1fr;
	padding: 80px 0;
	grid-gap: clamp(32px, 6vw, 40px) 0;
	background: var(--color-theme);
	color: #fff;
	}
	#map > *{
		grid-column: 2;
		}
	#map h2+div{
		display: grid;
		grid-template-areas: 'main';
		place-items: center;
		}
		#map h2+div a{
			grid-area: main;
			z-index: 1;
			}
		#map h2+div img{
			grid-area: main;
			aspect-ratio: 2 / 1;
			object-fit: cover;
			object-position: top center;
			opacity: 0.4;
			}
	#map h2+div+div a{
		background: transparent;
		color: #fff;
		border-color: rgba(255, 255, 255, 0.4);
		}

#instagram{
	display: grid;
	grid-gap: clamp(32px, 6vw, 40px);
	width: var(--wrap);
	margin: 80px auto;
	}
	#instagram h2{
		display: none;
		}
	#instagram h2+div a{
		grid-template-columns: 1em auto;
		}
		#instagram h2+div a:after{
			order: -1;
			-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 23.96 24"><path d="m11.98,5.86c-3.38,0-6.14,2.75-6.14,6.14s2.75,6.14,6.14,6.14,6.14-2.75,6.14-6.14-2.75-6.14-6.14-6.14Zm0,10.12c-2.2,0-3.99-1.79-3.99-3.99s1.79-3.99,3.99-3.99,3.99,1.79,3.99,3.99-1.79,3.99-3.99,3.99Zm6.44-11.83c-.81,0-1.46.66-1.46,1.46s.66,1.46,1.46,1.46,1.46-.66,1.46-1.46-.66-1.46-1.46-1.46Zm-1.42-4.16H6.97C3.13,0,0,3.13,0,6.97v10.06c0,3.84,3.13,6.97,6.97,6.97h10.02c3.84,0,6.97-3.13,6.97-6.97V6.97c0-3.84-3.13-6.97-6.97-6.97Zm4.77,17.03c0,2.63-2.14,4.77-4.77,4.77H6.97c-2.63,0-4.77-2.14-4.77-4.77V6.97c0-2.63,2.14-4.77,4.77-4.77h10.02c2.63,0,4.77,2.14,4.77,4.77v10.06Z"/></svg>');
			}

/*
#instagram{
	display: grid;
	grid-gap: clamp(32px, 6vw, 40px);
	width: var(--wrap);
	margin: 80px auto;
	}
	#instagram h2{
		display: grid;
		font-size: clamp(32px, 7.2vw, 48px);
		grid-gap: 24px;
		letter-spacing: 0.2em;
		}
		#instagram h2:before{
			content: "";
			border: 0 solid var(--color-border);
			}
		#instagram h2:after{
			content: attr(data-ruby);
			font-size: 24px;
			letter-spacing: 0;
			}
	#instagram h2+div{
		width: min(100%, 1000px);
		margin: auto;
		}
	#instagram ul{
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-gap: 8px;
		}
	#instagram li{
		display: contents;
		}
		#instagram li img{
			width: 100%;
			height: auto;
			background: var(--color-theme);
			aspect-ratio: 1;
			}
		#instagram li a{
			display: block;
			}
	#instagram .button{
		grid-template-columns: 1em auto;
		}
		#instagram .button:after{
			order: -1;
			-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 23.96 24"><path d="m11.98,5.86c-3.38,0-6.14,2.75-6.14,6.14s2.75,6.14,6.14,6.14,6.14-2.75,6.14-6.14-2.75-6.14-6.14-6.14Zm0,10.12c-2.2,0-3.99-1.79-3.99-3.99s1.79-3.99,3.99-3.99,3.99,1.79,3.99,3.99-1.79,3.99-3.99,3.99Zm6.44-11.83c-.81,0-1.46.66-1.46,1.46s.66,1.46,1.46,1.46,1.46-.66,1.46-1.46-.66-1.46-1.46-1.46Zm-1.42-4.16H6.97C3.13,0,0,3.13,0,6.97v10.06c0,3.84,3.13,6.97,6.97,6.97h10.02c3.84,0,6.97-3.13,6.97-6.97V6.97c0-3.84-3.13-6.97-6.97-6.97Zm4.77,17.03c0,2.63-2.14,4.77-4.77,4.77H6.97c-2.63,0-4.77-2.14-4.77-4.77V6.97c0-2.63,2.14-4.77,4.77-4.77h10.02c2.63,0,4.77,2.14,4.77,4.77v10.06Z"/></svg>');
			}
	@media (max-width: 575.98px) {
		#instagram h2{
			justify-items: center;
			}
			#instagram h2:before{
				grid-row: 2;
				width: 60px;
				border-top-width: 1px;
				}
		}
	@media (min-width: 576px) {
		#instagram h2{
			grid-template-columns: repeat(3, auto);
			align-items: center;
			justify-content: center;
			}
		#instagram h2:before{
			order: -1;
			height: 60px;
			border-left-width: 1px;
			}
		#instagram h2:after{
			order: -2;
			}
		}
	@media (min-width: 768px) {
		#instagram ul{
			grid-template-columns: repeat(4, 1fr);
			}
		}
	@media (min-width: 1200px) {
		#instagram h2{
			justify-content: start;
			grid-gap: 36px;
			font-size: 60px;
			}
		}
*/

#banner{
	display: grid;
	grid-template-columns: 1fr var(--wrap) 1fr;
	padding-top: clamp(48px, 10.8vw, 72px);
	background: var(--color-theme);
	}
	#banner > *{
		grid-column: 2;
		}
	#banner h2{
		display: none;
		}
	#banner ul{
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		align-items: center;
		grid-gap: 16px;
		}
	#banner a{
		display: grid;
		}
	#banner img{
		width: 100%;
		height: auto;
		}
	@media (min-width: 768px) {
		#banner ul{
			grid-template-columns: repeat(3, 1fr);
			}
		}
	@media (min-width: 1200px) {
		#banner ul{
			grid-template-columns: repeat(4, 1fr);
			grid-gap: 24px;
			}
		}

.title{
	display: grid;
	font-size: 24px;
	grid-gap: 1em;
	}
	.title:before{
		content: "";
		border: 0 solid var(--color-border);
		}
	.title:after{
		content: attr(data-ruby);
		font-size: clamp(32px, 7.2vw, 48px);
		letter-spacing: 0.2em;
		}
	@media (max-width: 575.98px) {
		.title{
			justify-items: center;
			}
			.title:before{
				grid-row: 2;
				width: 60px;
				border-top-width: 1px;
				}
			.title:after{
				grid-row: 1;
				}
		}
	@media (min-width: 576px) {
		.title{
			grid-template-columns: repeat(3, auto);
			align-items: center;
			justify-content: center;
			}
		.title:before{
			order: 1;
			height: 60px;
			border-left-width: 1px;
			}
		.title:after{
			order: 2;
			}
		}
	@media (min-width: 1200px) {
		.title{
			justify-content: start;
			grid-gap: 1.5em;
			}
		.title:after{
			font-size: 60px;
			}
		}

.tabA{
	display: flex;
	justify-content: center;
	}
	.tabA li{
		position: relative;
		display: grid;
		align-content: center;
		margin: 16px -1px 0 0;
		padding: clamp(4px, 1.2vw, 8px) clamp(12px, 2.4vw, 16px);
		background: #fff;
		border: 1px solid var(--color-border);
		color: inherit;
		font-size: clamp(12px, 2.4vw, 16px);
		line-height: 1.65;
		text-align: center;
		text-decoration: none;
		cursor: pointer;
		}
		.tabA li:before{
			content: "";
			position: absolute;
			right: 1px;
			bottom: 1px;
			width: 4px;
			height: 4px;
			-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 6 6"><polygon points="6 0 6 6 0 6 6 0"/></svg>') center no-repeat;
			-webkit-mask-size: contain;
			background: currentColor;
			pointer-events: none;
			}
		.tabA li.select{
			margin-top: 0;
			font-weight: 500;
			pointer-events: none;
			}
	@media (max-width: 575.98px) {
		.tabA li{
			width: 50%;
			}
		}
	@media (min-width: 768px) {
		.tabA li{}
			.tabA li:before{
				right: 2px;
				bottom: 2px;
				width: 6px;
				height: 6px;
				}
		}
	@media (min-width: 1200px) {
		.tabA li{
			margin-top: 0;
			}
			.tabA li.select{
				margin-top: -20px;
				}
		}

.tabB{
	display: flex;
	justify-content: center;
	}
	.tabB li{
		position: relative;
		display: grid;
		align-content: center;
		padding: clamp(4px, 1.2vw, 8px) clamp(12px, 2.4vw, 16px);
		background: #fff;
		border: 1px solid var(--color-border);
		color: inherit;
		font-size: clamp(12px, 2.4vw, 16px);
		line-height: 1.65;
		text-align: center;
		text-decoration: none;
		cursor: pointer;
		}
		.tabB li:before{
			position: absolute;
			top: 100%;
			left: 0;
			width: 100%;
			height: 10px;
			background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 20"><polygon points="0,-1 30,-1 15,19" style="fill:%23333333; stroke:%23808080; stroke-miterlimit:10;"/></svg>') center bottom no-repeat;
			background-size: 20px 20px;
			}
		.tabB li.select{
			background: var(--color-theme);
			color: #fff;
			font-weight: 500;
			pointer-events: none;
			}
			.tabB li.select:before{
				content: "";
				}
		.tabB li:nth-child(n+2){
			border-left-width: 0;
			}
	@media (max-width: 575.98px) {
		.tabB li{
			width: 50%;
			}
		}
	@media (min-width: 768px) {
		.tabB li{}
			.tabB li:before{
				height: 15px;
				}
		}

.button{
	display: grid;
	grid-template-columns: auto 18px;
	grid-gap: 16px;
	align-items: center;
	width: min(100%, 320px);
	min-height: 50px;
	margin: 0 auto;
	padding: 4px 16px;
	background: #fff;
	border: 1px solid var(--color-border);
	text-align: center;
	line-height: 1.65;
	text-decoration: none;
	}
	.button:after{
		content: "";
		aspect-ratio: 1;
		-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 17.16 15.71"><polygon points="9.31 0 8.6 .71 15.25 7.35 0 7.35 0 8.35 15.25 8.35 8.6 15 9.31 15.71 17.16 7.85 9.31 0"/></svg>') center no-repeat;
		-webkit-mask-size: 17.16px 15.71px;
		background: currentColor;
		}