/* CSS Document */

article {
	display: grid;
	grid-template-columns: 1fr var(--wrap) 1fr;
}

article > * {
	grid-column: 2;
}

#detail {
	padding-top: 24px;
	overflow: hidden;
}

@media (min-width: 1200px) {
	#detail {
		padding-top: 40px;
	}
}

#detailHeader {
	display: contents;
}

#detailHeader > * {
	grid-column: 2;
}

#detailHeader h2 {
	order: -2;
	display: grid;
	font-weight: 700;
	font-size: 24px;
}

@media (min-width: 992px) {
	#detailHeader h2 {
		font-size: 32px;
	}
}

#detailHeader h2:before {
	content: attr(data-ruby);
	font-size: 13px;
	letter-spacing: 0.05em;
}

#detailFavorite {
	display: flex;
	justify-content: center;
	margin-top: 48px;
}

@media (min-width: 992px) {
	#detailFavorite {
		margin-top: 72px;
	}
}

#detailFavorite a {
	display: grid;
	grid-template-columns: 1fr 6px auto;
	align-items: center;
	width: min(100%, 288px);
	min-height: 60px;
	padding: 4px 16px 4px 48px;
	background: var(--color-theme) url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><path fill="white" d="M.55,6.66h5.85L8.99.79l2.58,5.87h5.87l-4.66,4.32,1.92,6.22-5.71-3.39-5.68,3.39,1.9-6.22L.55,6.66Z"/></svg>') 16px center no-repeat;
	background-size: 24px;
	border-radius: 8px;
	color: #fff;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-decoration: none;
}

#detailFavorite a[data-fav-status="on"] {
	background-color: #c2c2c2;
}

#detailFavorite a:before {
	content: "";
	order: 1;
	aspect-ratio: 1;
	background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 6 6"><polygon fill="white" points="6 6 0 3 6 0 6 6"/></svg>') center right no-repeat;
	background-size: contain;
}

#detailFavorite a:after {
	content: attr(data-count);
	order: 2;
	display: grid;
	padding: 0 8px;
	min-width: 44px;
	height: 20px;
	align-items: center;
	background: #fff;
	border-radius: 2px;
	color: var(--color-theme);
	font-size: 13px;
	letter-spacing: 0.03em;
	text-align: center;
	line-height: 1;
}

#detailFavorite a[data-fav-status="on"]:after {
	color: #c2c2c2;
}

#detailPhoto {
	order: -1;
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	grid-gap: 48px 16px;
	margin-top: 32px;
}

@media (min-width: 992px) {
	#detailPhoto {
		grid-row-gap: 72px;
	}
}

#detailPhoto ul:not(.slick-slider) {
	justify-self: center;
	display: grid;
	width: min(calc(100% - 32px), 714px);
}

#detailPhoto ul:not(.slick-slider) li {
	grid-column: 1;
	grid-row: 1;
	margin: 0 12px;
}

#detailPhoto img {
	aspect-ratio: 1 / 0.667;
	object-fit: cover;
}

#detailPhotoSlide {
	display: contents;
}

#detailPhotoSlide li {
	display: none;
}

#detailPhotoSlide li:before {
	grid-column: 1;
	grid-row: 1;
	content: attr(data-caption);
	align-self: end;
	display: grid;
	align-content: end;
	min-height: 80px;
	padding: 16px;
	background: linear-gradient(0deg, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));
	color: #fff;
	text-align: center;
	pointer-events: none;
	z-index: 1;
}

#detailPhotoSlide li[data-caption=""]:before {
	content: none;
}

#detailPhotoSlide li a {
	grid-column: 1;
	grid-row: 1;
}

#detailPhotoSlide li.slick-slide {
	display: grid;
	overflow: hidden;
}

#detailPhotoSlide .slick-list {
	justify-self: center;
	grid-column: 1 / 4;
	width: min(calc(100% - 32px), 714px);
	overflow: visible;
}

#detailPhotoSlide .slick-slide {
	margin: 0 12px;
}

#detailPhotoSlide .slick-arrow {
	all: unset;
	position: relative;
	grid-row: 2;
	aspect-ratio: 1;
	align-self: center;
	width: 32px;
	background: #fff;
	border: 1px solid currentColor;
	border-radius: 100%;
	color: var(--color-variable);
	font-size: 0;
	cursor: pointer;
}

#detailPhotoSlide .slick-arrow: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 16 16"><path d="M14.24,7.36l-4.7-4.7c-.35-.35-.93-.35-1.28,0-.35.35-.35.93,0,1.28l2.99,2.99H2.56c-.59,0-1.07.48-1.07,1.07s.48,1.07,1.07,1.07h8.69l-2.99,2.99c-.35.35-.35.93,0,1.28.18.18.41.26.64.26s.46-.09.64-.26l4.7-4.7c.35-.35.35-.93,0-1.28Z"/></svg>') center no-repeat;
	-webkit-mask-size: 16px;
}

#detailPhotoSlide .slick-prev {
	grid-column: 1;
}

#detailPhotoSlide .slick-prev:before {
	transform: scale(-1, 1);
}

#detailPhotoSlide .slick-next {
	grid-column: 3;
}

#detailPhotoSlideNav li {
	cursor: pointer;
}

#detailPhotoSlideNav a {
	pointer-events: none;
}

#detailPhotoSlideNav .slick-slide {
	margin: 0 5px;
}

#detailPhotoSlideNav .slick-track:not(:has(li:nth-child(4))) {
	transform: none !important;
}

@media (min-width: 576px) {
	#detailPhotoSlideNav .slick-track:not(:has(li:nth-child(6))) {
		transform: none !important;
	}
}

@media (min-width: 992px) {
	#detailPhotoSlideNav .slick-track:not(:has(li:nth-child(8))) {
		transform: none !important;
	}
}

@media (min-width: 1200px) {
	#detailPhotoSlideNav .slick-track {
		transform: none !important;
	}
}

#detailBody {
	display: contents;
}

#detailBody > * {
	grid-column: 2;
}

#detailBody h3 {
	order: -2;
	margin-top: 16px;
	color: var(--color-variable);
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 0.05em;
}

@media (min-width: 992px) {
	#detailBody h3 {
		font-size: 20px;
	}
}

#detailBody h3 + div {
	justify-self: center;
	width: min(100%, 960px);
	margin-top: 48px;
	letter-spacing: 0.05em;
}

@media (min-width: 992px) {
	#detailBody h3 + div {
		margin-top: 72px;
	}
}

#detailTopics {
	grid-column: 1 / 4;
	overflow: hidden;
}

#detailTopics section {
	display: grid;
	grid-template-columns: 1fr min(var(--wrap-fit), 960px) 1fr;
	margin-top: 64px;
}

@media (min-width: 992px) {
	#detailTopics section {
		margin-top: 80px;
	}
}

#detailTopics section > * {
	grid-column: 2;
}

#detailTopics h3 {
	display: grid;
	grid-template-columns: 6px 1fr;
	grid-gap: 0 16px;
	font-weight: 700;
	font-size: 24px;
	letter-spacing: 0.05em;
}

#detailTopics h3:before {
	content: "";
	margin-top: 0.25em;
	background: var(--color-variable);
}

#detailTopics dl {
	position: relative;
	display: grid;
	grid-gap: 8px;
}

#detailTopics dl:nth-child(n + 2) {
	display: none;
}

#detailTopics dl:has(a):hover img {
	opacity: 0.8;
}

#detailTopics dt {
	font-weight: 700;
	font-size: 18px;
	letter-spacing: 0.05em;
}

#detailTopics dd {
	letter-spacing: 0.05em;
}

#detailTopics dd:has(img) {
	order: -1;
}

#detailTopics dd:has(a) {
	display: contents;
}

#detailTopics dd img {
	aspect-ratio: 1 / 0.667;
	object-fit: cover;
	border-radius: 8px;
	transition: opacity 0.2s ease-out;
}

#detailTopics dd a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	font-size: 0;
}

#detailTopics .fr-view {
	margin-top: 24px;
}

#detailTopics .slide {
	grid-column: 1 / 4;
	justify-self: center;
	display: grid;
	width: min(var(--wrap-fit), 1080px);
	margin-top: 40px;
}

#detailTopics .slide > dl{
	grid-column: 1;
	grid-row: 1;
	aspect-ratio: 1;
	width: min(100%, 240px);
	visibility: hidden;
	}

#detailTopics .slick-slider {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	column-gap: 24px;
}

#detailTopics .slick-slider:has(img):before {
	content: "";
	grid-column: 2;
	grid-row: 1;
	aspect-ratio: 1 / 0.667;
}

@media (min-width: 576px) {
	#detailTopics .slick-slider:has(img):before {
		width: calc(50% - 16px);
	}
}

@media (min-width: 768px) {
	#detailTopics .slick-slider:has(img):before {
		width: calc(33.33% - 16px);
	}
}

@media (min-width: 1200px) {
	#detailTopics .slick-slider:has(img):before {
		width: calc(25% - 16px);
	}
}

#detailTopics .slick-list {
	grid-column: 2;
	margin: 0 -12px;
	overflow: visible;
}

@media (min-width: 1200px) {
	#detailTopics .slick-list {
		overflow: hidden;
	}
}

#detailTopics .slick-slider:has(img) .slick-list {
	grid-row: 1 / 3;
}

#detailTopics .slick-slide {
	margin: 0 12px;
}

#detailTopics .slick-arrow {
	all: unset;
	position: relative;
	aspect-ratio: 1;
	align-self: center;
	width: 40px;
	background: #999;
	border-radius: 100%;
	color: #fff;
	font-size: 0;
	z-index: 1;
	cursor: pointer;
}

#detailTopics .slick-arrow: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 16 16"><path d="M14.24,7.36l-4.7-4.7c-.35-.35-.93-.35-1.28,0-.35.35-.35.93,0,1.28l2.99,2.99H2.56c-.59,0-1.07.48-1.07,1.07s.48,1.07,1.07,1.07h8.69l-2.99,2.99c-.35.35-.35.93,0,1.28.18.18.41.26.64.26s.46-.09.64-.26l4.7-4.7c.35-.35.35-.93,0-1.28Z"/></svg>') center no-repeat;
	-webkit-mask-size: 16px;
}

#detailTopics .slick-prev:before {
	transform: scale(-1, 1);
}

#detailBasic {
	grid-column: 1 / 4;
	display: grid;
	grid-template-columns: 1fr min(var(--wrap-fit), 960px) 1fr;
	background: #f9f9f9;
	margin-top: 64px;
	padding: 64px 0;
}

@media (min-width: 992px) {
	#detailBasic {
		margin-top: 80px;
		padding: 80px 0;
	}
}

#detailBasic > * {
	grid-column: 2;
}

#detailBasic h3 {
	padding: 16px;
	background: var(--color-variable);
	border-radius: 8px 8px 0 0;
	color: #fff;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-align: center;
}

#detailBasic h3 + div {
	padding: 16px 24px;
	background: #fff;
	border: 1px solid var(--color-variable);
	border-radius: 0 0 8px 8px;
	letter-spacing: 0.05em;
}

@media (min-width: 992px) {
	#detailBasic h3 + div {
		padding: 16px 32px;
	}
}

#detailBasic h3 + div + div {
	margin-top: 16px;
}

#detailBasic h3 + div + div p {
	padding-left: 1em;
	text-indent: -1em;
	font-size: 14px;
	letter-spacing: 0.05em;
}

#detailBasic dl {
	display: grid;
}

@media (min-width: 576px) {
	#detailBasic dl {
		grid-template-columns: 1fr 2fr;
	}
}

#detailBasic dt {
	display: grid;
	grid-template-columns: 1em 1fr;
	grid-gap: 8px;
	padding: 16px 0;
	letter-spacing: 0.05em;
}

#detailBasic dt:before {
	content: "";
	aspect-ratio: 1;
	background: var(--color-variable);
	transform: translateY(0.4em);
}

#detailBasic dt:nth-of-type(n + 2) {
	border-top: 1px solid var(--color-border);
}

@media (min-width: 576px) {
	#detailBasic dt + dd {
		padding-top: 16px;
	}
	#detailBasic dt + dd:nth-of-type(n + 2) {
		border-top: 1px solid var(--color-border);
	}
}


#detailBasic dd {
	padding-bottom: 16px;
	letter-spacing: 0.05em;
}

@media (min-width: 576px) {
	#detailBasic dd {
		grid-column: 2;
	}
}

#detailBasicSns {
	display: flex;
	grid-gap: 24px;
}

#detailBasicSns a {
	display: grid;
	aspect-ratio: 1;
	width: 28px;
	background: currentColor;
	font-size: 0;
	-webkit-mask-position: center;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 28px;
}

#detailBasicSns a[href*="instagram.com"] {
	position: relative;
	background: -webkit-linear-gradient(-65deg, #7638fa 25%, #ff0069 50%) no-repeat;
	-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><path d="M14,2.52c3.74,0,4.18.01,5.66.08,1.37.06,2.11.29,2.6.48.65.25,1.12.56,1.61,1.05.49.49.79.96,1.05,1.61.19.49.42,1.23.48,2.6.07,1.48.08,1.92.08,5.66s-.01,4.18-.08,5.66c-.06,1.37-.29,2.11-.48,2.6-.25.65-.56,1.12-1.05,1.61-.49.49-.96.79-1.61,1.05-.49.19-1.23.42-2.6.48-1.48.07-1.92.08-5.66.08s-4.18-.01-5.66-.08c-1.37-.06-2.11-.29-2.6-.48-.65-.25-1.12-.56-1.61-1.05-.49-.49-.79-.96-1.05-1.61-.19-.49-.42-1.23-.48-2.6-.07-1.48-.08-1.92-.08-5.66s.01-4.18.08-5.66c.06-1.37.29-2.11.48-2.6.25-.65.56-1.12,1.05-1.61.49-.49.96-.79,1.61-1.05.49-.19,1.23-.42,2.6-.48,1.48-.07,1.92-.08,5.66-.08ZM14,0c-3.8,0-4.28.02-5.77.08-1.49.07-2.51.3-3.4.65-.92.36-1.7.84-2.48,1.61-.78.78-1.26,1.56-1.61,2.48-.35.89-.58,1.91-.65,3.4-.07,1.49-.08,1.97-.08,5.77s.02,4.28.08,5.77c.07,1.49.3,2.51.65,3.4.36.92.84,1.7,1.61,2.48.78.78,1.56,1.26,2.48,1.61.89.35,1.91.58,3.4.65,1.49.07,1.97.08,5.77.08s4.28-.02,5.77-.08c1.49-.07,2.51-.3,3.4-.65.92-.36,1.7-.84,2.48-1.61.78-.78,1.26-1.56,1.61-2.48.35-.89.58-1.91.65-3.4.07-1.49.08-1.97.08-5.77s-.02-4.28-.08-5.77c-.07-1.49-.3-2.51-.65-3.4-.36-.92-.84-1.7-1.61-2.48-.78-.78-1.56-1.26-2.48-1.61-.89-.35-1.91-.58-3.4-.65-1.49-.07-1.97-.08-5.77-.08ZM14,6.81c-3.97,0-7.19,3.22-7.19,7.19s3.22,7.19,7.19,7.19,7.19-3.22,7.19-7.19-3.22-7.19-7.19-7.19ZM14,18.67c-2.58,0-4.67-2.09-4.67-4.67s2.09-4.67,4.67-4.67,4.67,2.09,4.67,4.67-2.09,4.67-4.67,4.67ZM21.47,4.85c-.93,0-1.68.75-1.68,1.68s.75,1.68,1.68,1.68,1.68-.75,1.68-1.68-.75-1.68-1.68-1.68Z"/></svg>');
}

#detailBasicSns a[href*="instagram.com"]:before,
#detailBasicSns a[href*="instagram.com"]:after {
	position: absolute;
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#detailBasicSns a[href*="instagram.com"]:before {
	background: -webkit-linear-gradient(45deg, transparent 50%, #d300c5) no-repeat;
}

#detailBasicSns a[href*="instagram.com"]:after {
	background: -webkit-linear-gradient(-135deg, transparent 55%, #ff7a00 65%, #ffd600) no-repeat;
}

#detailBasicSns a[href*="facebook.com"] {
	background: #3b5996;
	-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><path d="M16.24,28v-9.81c.94,0,3.3-.07,3.3-.07l.53-3.97h-3.82s.03-2.12.03-3.24c.09-.93.68-1.41,1.57-1.5.68-.06,2.29-.16,2.29-.16v-3.61s-3.63-.39-5.32.3c-2.02.82-2.86,2.49-2.97,4.58-.05,1.01,0,2.02-.02,3.04v.58c-1.01,0-2.9,0-2.9,0h-.66l.02,4.08h3.53v9.79C6.64,27.47.27,22.49,0,14.48-.24,6.93,5.77.37,13.26.02c7.94-.38,14.18,5.7,14.7,12.94.61,8.68-5.89,14.29-11.72,15.04Z"/></svg>');
}

#detailBasicSns a[href*="x.com"] {
	background: #000;
	-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><path d="M16.23,12.16L24.98,2h-2.07l-7.59,8.82L9.25,2H2.26l9.17,13.34L2.26,26h2.07l8.02-9.32,6.4,9.32h6.99l-9.51-13.84h0ZM13.4,15.46l-.93-1.33L5.08,3.56h3.18l5.96,8.53.93,1.33,7.75,11.09h-3.18l-6.33-9.05h0Z"/></svg>');
}

#detailMovie {
	order: 1;
	justify-self: center;
	width: min(100%, 960px);
	margin: 48px 0 24px 0;
}

@media (min-width: 992px) {
	#detailMovie {
		margin-top: 64px;
	}
}

#detailMovie h3 {
	position: relative;
	margin-left: 24px;
	color: var(--color-variable);
	font-weight: 700;
	font-size: 24px;
	letter-spacing: 0.08em;
}

@media (min-width: 1200px) {
	#detailMovie h3 {
		margin-left: 0;
	}
}

#detailMovie h3:before {
	content: "";
	position: absolute;
	top: 10px;
	right: calc(100% + 32px);
	width: 100vw;
	height: 28px;
	background: currentColor;
	-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 10"><circle cx="6.5" cy="1.5" r="1.5"/></svg>') top right;
	-webkit-mask-size: 8px 10px;
}

#detailMovie h3 + div {
	justify-self: center;
	width: min(100%, 720px);
	margin: 48px auto 0 auto;
}

@media (min-width: 992px) {
	#detailMovie h3 + div {
		margin-top: 64px;
	}
}

#detailMovie h4 {
	font-weight: 700;
	font-size: 24px;
	letter-spacing: 0.05em;
}

#detailMovie iframe {
	aspect-ratio: 16 / 9;
	width: 100%;
	height: auto;
	margin-top: 24px;
}

@media (min-width: 992px) {
	#detailMovie iframe {
		margin-top: 32px;
	}
}

#detailCategory,
#detailDetailed {
	order: 1;
	justify-self: center;
	width: min(100%, 960px);
	margin-top: 48px;
}

@media (min-width: 992px) {
	#detailCategory,
	#detailDetailed {
		margin-top: 64px;
	}
}

#detailCategory h3,
#detailDetailed h3 {
	position: relative;
	margin-left: 24px;
	color: var(--color-variable);
	font-weight: 700;
	font-size: 24px;
	letter-spacing: 0.08em;
}

@media (min-width: 1200px) {
	#detailCategory h3,
	#detailDetailed h3 {
		margin-left: 0;
	}
}

#detailCategory h3:before,
#detailDetailed h3:before {
	content: "";
	position: absolute;
	top: 10px;
	right: calc(100% + 32px);
	width: 100vw;
	height: 28px;
	background: currentColor;
	-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 10"><circle cx="6.5" cy="1.5" r="1.5"/></svg>') top right;
	-webkit-mask-size: 8px 10px;
}

#detailCategory h3 + div,
#detailDetailed h3 + div {
	margin-top: 24px;
}

@media (min-width: 992px) {
	#detailCategory h3 + div,
	#detailDetailed h3 + div {
		margin-top: 32px;
	}
}

#detailCategory ul,
#detailDetailed ul {
	display: flex;
	flex-wrap: wrap;
	grid-gap: 8px;
}

#detailCategory a,
#detailDetailed a {
	display: grid;
	grid-template-columns: 1fr 10px;
	align-items: center;
	grid-gap: 16px;
	min-height: 32px;
	padding: 4px 8px 4px 16px;
	border: 1px solid var(--color-border);
	border-radius: 16px;
	color: inherit;
	font-size: 14px;
	table-layout: 0.05em;
	text-decoration: none;
}

#detailCategory a:hover,
#detailDetailed a:hover {
	border-color: currentColor;
	color: var(--color-theme);
}

#detailCategory a:after,
#detailDetailed a:after {
	content: "";
	aspect-ratio: 1;
	background: currentColor;
	-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 10" style="fill: none; stroke: black; stroke-miterlimit: 10;"><polyline points="2.98 9.05 7.02 5 2.98 .95"/></svg>') center no-repeat;
	-webkit-mask-size: contain;
}

#detailShare {
	order: 1;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	grid-gap: 8px 24px;
	margin: 56px 0 64px 0;
}

@media (min-width: 992px) {
	#detailShare {
		margin: 72px 0 80px 0;
	}
}

#detailShare h3 {
	display: none;
}

#detailShare a[href*="twitter.com"] {
	display: grid;
	grid-template-columns: 10px 1fr;
	align-items: center;
	grid-gap: 4px;
	min-height: 20px;
	padding: 0 8px;
	border-radius: 10px;
	background: #000;
	color: #fff;
	font-size: 10px;
	text-decoration: none;
}

#detailShare a[href*="twitter.com"]:before {
	content: "";
	aspect-ratio: 1;
	background: currentColor;
	-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><path d="M16.23,12.16L24.98,2h-2.07l-7.59,8.82L9.25,2H2.26l9.17,13.34L2.26,26h2.07l8.02-9.32,6.4,9.32h6.99l-9.51-13.84h0ZM13.4,15.46l-.93-1.33L5.08,3.56h3.18l5.96,8.53.93,1.33,7.75,11.09h-3.18l-6.33-9.05h0Z"/></svg>');
}

#detailShare iframe {
	vertical-align: unset;
}

#detailShare #fb-root {
	margin: -8px 0;
}

#detailFooter{
	grid-column: 1 / 4;
	}

#detailMap {
	display: grid;
	grid-template-columns: 1fr min(var(--wrap-fit), 960px) 1fr;
	grid-row-gap: 56px;
	background: #f9f9f9;
	padding-bottom: 92px;
}

@media (min-width: 992px) {
	#detailMap {
		grid-row-gap: 72px;
		padding-bottom: 120px;
	}
}

#detailMap > * {
	grid-column: 2;
}

#detailMap #detailMapEmbed,
#detailMap #detailMapApi {
	grid-column: 1 / 4;
	grid-row: 1;
	height: min(75vh, 600px);
	background: #ccc;
}

@media (min-width: 576px) {
	#detailMap #detailMapEmbed,
	#detailMap #detailMapApi {
		height: min(75vw, 600px);
	}
}

#detailMapEmbed {
	position: relative;
}

#detailMapEmbed iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#detailMapApi {
	position: relative;
	z-index: 1;
}

#detailMapApi #gMap {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#detailMapLink {
	order: 1;
	display: flex;
	flex-wrap: wrap;
	grid-gap: 16px 40px;
	justify-content: center;
}

@media (min-width: 992px) {
	#detailMapLink {
		column-gap: 92px;
	}
}

#detailMapLink a {
	display: grid;
	align-items: center;
	width: min(100%, 280px);
	min-height: 64px;
	padding: 4px 16px;
	border-radius: 32px;
	background: var(--color-variable);
	color: #fff;
	letter-spacing: 0.05em;
	text-align: center;
	text-decoration: none;
}

#detailMapLink #detailMapApiToggle {
	cursor: pointer;
}

#detailMapCategory ul {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(80vw, 200px), 1fr));
	grid-gap: 8px 24px;
	padding: 16px 24px;
	background: #fff;
	border: 1px solid var(--color-border);
}

@media (min-width: 992px) {
	#detailMapCategory ul {
		padding: 24px 48px;
	}
}

#detailMapCategory li {
	display: grid;
	grid-template-columns: auto 1fr;
	grid-gap: 8px;
}

#detailMapCategory input {
	transform: translateY(0.35em);
}

#detailMapCategory label {
	display: grid;
	grid-template-columns: 24px 1fr;
	grid-gap: 4px;
}

#detailMapCategory label:before {
	content: "";
	aspect-ratio: 1;
	background: var(--color-theme);
	-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="M22.32,8.24c-.23-.46-.64-.82-1.13-.98-.29-.1-.82-.32-1.27-.51-.43-.18-.8-.33-1.02-.41-.73-.24-1.65-.06-2.19.43-.13.12-.23.27-.31.42.04-.07.08-.15.09-.23.04-.2,0-.4-.12-.57-.12-.17-.29-.28-.49-.32l-.88-.16c-.64-.13-1.25-.02-1.7.31-.07.05-.14.12-.21.19-.05-.17-.16-.32-.31-.42-.52-.33-1.61-.34-2.18-.02-.16.09-.26.23-.32.38-.68-.79-1.88-.44-2.9-.15l-.19.05c-.4.11-.64.53-.53.94.05.2.18.36.36.46.18.1.38.12.58.07l.26-.07c.87-.25,1.18-.27,1.29-.27.1.26.15,1.17.19,1.85.03.58.07,1.3.15,2.13.04.39.36.69.76.69h.07c.42-.04.73-.41.69-.83-.07-.79-.11-1.47-.15-2.08-.04-.79-.08-1.38-.17-1.84.22.09.47.1.67-.01.1-.05.53-.05.61-.02.12.08.27.12.41.12.05,0,.11,0,.16-.02.05,0,.08-.04.12-.05-.02.09-.04.17-.05.27l-.27,3.9,1.52.1.27-3.9c0-.13.04-.22.09-.26.07-.05.25-.09.49-.03l.89.16c.2.04.4,0,.57-.12.07-.05.12-.11.17-.17-.26.55-.25,1.26.07,1.96.1.22-.13,1.17-.36,1.64-.19.38-.03.83.34,1.02.18.09.39.1.58.04.19-.06.35-.2.44-.38.04-.08.89-1.86.38-2.95-.17-.37-.12-.65-.05-.71.11-.11.45-.18.67-.1.19.06.55.22.99.4.48.2.97.41,1.31.52.11.04.2.11.25.21.03.07.03.12.03.13-.09.25-.53.84-.83,1.23-.31.41-.61.8-.78,1.12-.37.69-1.09,2.7-1.3,3.54-.12.5-1.01.92-1.87,1.26-.89.36-2.15.54-3.72.54-.81,0-2.37-.05-3.73-.37-1.16-.28-1.9-.67-2.51-1.92-1.2-2.49-2.31-3.88-2.97-4.71l-.22-.28s-.05-.12-.03-.19c.01-.07.05-.12.09-.15.98-.55,2-.79,2.38-.81.02.03.04.08.08.17l.46,2.01c.04.2.16.37.34.47.17.11.37.14.57.1.2-.04.37-.16.47-.34s.14-.38.1-.57l-.47-2.04-.02-.07c-.35-1.03-1-1.25-1.49-1.25-.52,0-1.84.27-3.16,1.01-.43.24-.74.67-.84,1.17-.1.51.01,1.03.32,1.43l.23.3c.62.78,1.66,2.09,2.79,4.43.86,1.77,2.03,2.37,3.52,2.73,1.51.36,3.21.42,4.08.42,1.77,0,3.21-.22,4.29-.65,1.18-.47,2.47-1.08,2.78-2.3.18-.72.86-2.62,1.17-3.19.12-.22.39-.57.66-.93.46-.6.89-1.17,1.05-1.65.14-.42.11-.88-.1-1.3Z"/></svg>') center no-repeat;
	-webkit-mask-size: contain;
	transform: translateY(2px);
}

#detailMapCategory label[for="c2"]:before {
	-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.13,10.99l-2.13-2.61-1.74.63-1.9-5.84-2.84-.71-1.9,2.92-1.42,3.71-1.34-.95-2.76,5.29-.55,2.76,1.66,1.5,4.26,2.37,4.19-.87,3.48.47,3.32-2.37-.32-6.32ZM6.99,8.85l.95.69-.39,1.17-.55-1.86ZM9.39,19.48l-1.78-1.18,1.9-5.45-.12,6.63ZM10.07,5.42l1.62-2.33,1.3.36-2.92,1.97ZM13.18,12.9l.28-6.34.95,4.16-1.23,2.18ZM14.7,18.8l1.57-5.89.77,6.22-2.34-.33Z"/></svg>');
}

#detailMapCategory label[for="c3"]:before {
	-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13.91,18.99h-4.29c-.28,0-.5.22-.5.5s.22.5.5.5h4.29c.28,0,.5-.22.5-.5s-.22-.5-.5-.5ZM11.94,15.6c-.01-.74-.5-1.8-2.64-2.91-2.59-1.33-1.47-3.39.51-5.08l-1.01-1.12c-.26-.29-.65-.45-1.04-.43-.39.02-.76.22-.98.54l-3.18,4.47c-.91,1.52,1.83,4.57,7.01,4.57.44,0,.88-.02,1.33-.05ZM10.78,17.39c0-.28-.22-.5-.5-.5h-4.29c-.28,0-.5.22-.5.5s.22.5.5.5h4.29c.28,0,.5-.22.5-.5ZM20.06,11.07l-4.91-6.55c-.24-.33-.63-.52-1.03-.52-.41,0-.79.19-1.04.51l-2.77,3.66c-.72.86-1.41,1.77-.32,2.34,1.02.54,4.8,1.17,6.16,4.35,2.93-.84,4.98-2.26,3.92-3.8ZM17.89,16.89h-4.29c-.28,0-.5.22-.5.5s.22.5.5.5h4.29c.28,0,.5-.22.5-.5s-.22-.5-.5-.5ZM16.75,18.99h-1.25c-.28,0-.5.22-.5.5s.22.5.5.5h1.25c.28,0,.5-.22.5-.5s-.22-.5-.5-.5Z"/></svg>');
}

#detailMapCategory label[for="c4"]:before {
	-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19.37,15.03c-.46,0-.84.38-.84.84s.38.84.84.84.84-.38.84-.84-.38-.84-.84-.84ZM19.37,16.15c-.16,0-.28-.13-.28-.28s.13-.28.28-.28.28.13.28.28-.13.28-.28.28ZM7.75,15.33h.56v-4.02h-.56v4.02ZM9.35,14.28h.56v-2.97h-.56v2.97ZM19.37,7.18c-.94,0-1.7.76-1.7,1.7h0s-11.34,0-11.34,0h0c0-.94-.76-1.7-1.7-1.7s-1.7.76-1.7,1.7v6.99c0,.94.76,1.7,1.7,1.7h14.73c.94,0,1.7-.76,1.7-1.7v-6.99c0-.94-.76-1.7-1.7-1.7ZM4.63,17.01c-.63,0-1.14-.51-1.14-1.14s.51-1.14,1.14-1.14,1.14.51,1.14,1.14-.51,1.14-1.14,1.14ZM6.32,15.95s0-.05,0-.08v-5.36h11.34v5.36s0,.05,0,.08H6.32ZM19.37,17.01c-.63,0-1.14-.51-1.14-1.14s.51-1.14,1.14-1.14,1.14.51,1.14,1.14-.51,1.14-1.14,1.14ZM10.94,15.33h.56v-4.02h-.56v4.02ZM15.74,15.33h.56v-4.02h-.56v4.02ZM12.54,13.97h.56v-2.66h-.56v2.66ZM4.63,15.03c-.46,0-.84.38-.84.84s.38.84.84.84.84-.38.84-.84-.38-.84-.84-.84ZM4.63,16.15c-.16,0-.28-.13-.28-.28s.13-.28.28-.28.28.13.28.28-.13.28-.28.28Z"/></svg>');
}

#detailMapCategory label[for="c5"]:before {
	-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21.2,4.5c-3.1.49-6.23.62-9.36.62s-6.26-.13-9.36-.62l.64,2.1c1.19.17,2.38.3,3.58.4l-.12,2.99h-2.63v1.74h2.56l-.3,7.7,1.86.07.31-7.77h6.94l.31,7.77,1.86-.07-.3-7.7h2.56v-1.74h-2.63l-.12-2.99c1.2-.1,2.39-.23,3.58-.4l.64-2.1ZM10.91,9.99h-2.47l.11-2.86c.79.04,1.57.07,2.36.08v2.78ZM12.77,9.99v-2.78c.79-.01,1.57-.04,2.36-.08l.11,2.86h-2.47Z"/></svg>');
}

#detailMapCategory label[for="c6"]:before {
	-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3.89,18.99h6.05v-4.57h4.15v4.57h6.05V7.22H3.89v11.76ZM17.69,8.29h1.45v1.45h-1.45v-1.45ZM17.69,10.47h1.45v1.45h-1.45v-1.45ZM17.69,12.66h1.45v1.45h-1.45v-1.45ZM15.5,8.29h1.45v1.45h-1.45v-1.45ZM15.5,10.47h1.45v1.45h-1.45v-1.45ZM15.5,12.66h1.45v1.45h-1.45v-1.45ZM7.09,8.29h1.45v1.45h-1.45v-1.45ZM7.09,10.47h1.45v1.45h-1.45v-1.45ZM7.09,12.66h1.45v1.45h-1.45v-1.45ZM4.9,8.29h1.45v1.45h-1.45v-1.45ZM4.9,10.47h1.45v1.45h-1.45v-1.45ZM4.9,12.66h1.45v1.45h-1.45v-1.45ZM2.98,5.6v1.16h18.08v-1.16H2.98Z"/></svg>');
}

#detailMapCategory label[for="c7"]:before {
	-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19.69,9.88h-4.07l-1.76-4.32c-.08-.19-.29-.28-.48-.2-.19.08-.28.29-.2.48l1.65,4.04h-4.69l1.65-4.04c.08-.19-.01-.4-.2-.48-.19-.08-.4.01-.48.2l-1.76,4.32h-4.07c-.39,0-.7.31-.7.7s.31.7.7.7h14.41c.39,0,.7-.31.7-.7s-.31-.7-.7-.7ZM19.42,11.76H5.54c-.05,0-.1.02-.13.06-.03.04-.05.09-.04.14l1.06,5.47c.15.77.98,1.37,1.89,1.37h8.32c.91,0,1.74-.6,1.89-1.37l1.06-5.47c0-.05,0-.1-.04-.14-.03-.04-.08-.06-.13-.06ZM8.12,17.98s-.04,0-.06,0c-.17,0-.32-.12-.34-.29l-.81-4.93c-.03-.19.1-.37.29-.4.19-.03.37.1.4.29l.81,4.93c.03.19-.1.37-.29.4ZM9.88,17.98s-.02,0-.03,0c-.18,0-.33-.13-.35-.32l-.48-4.93c-.02-.19.12-.36.31-.38.19-.02.36.12.38.31l.48,4.93c.02.19-.12.36-.31.38ZM11.63,17.99s0,0-.01,0c-.19,0-.34-.15-.35-.34l-.16-4.93c0-.19.14-.35.34-.36.19,0,.35.15.36.34l.16,4.93c0,.19-.14.35-.34.36ZM13.75,17.65c0,.19-.16.34-.35.34,0,0,0,0-.01,0-.19,0-.34-.17-.34-.36l.16-4.93c0-.19.17-.34.36-.34.19,0,.34.17.34.36l-.16,4.93ZM15.53,17.67c-.02.18-.17.32-.35.32-.01,0-.02,0-.03,0-.19-.02-.33-.19-.31-.38l.48-4.93c.02-.19.19-.33.38-.31.19.02.33.19.31.38l-.48,4.93ZM17.3,17.69c-.03.17-.18.29-.34.29-.02,0-.04,0-.06,0-.19-.03-.32-.21-.29-.4l.81-4.93c.03-.19.21-.32.4-.29.19.03.32.21.29.4l-.81,4.93Z"/></svg>');
}

#detailMapCategory label[for="c8"]:before {
	-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15.46,11.59c-.27-.52-.44-1.08-.6-1.62-.07-.22-.14-.45-.21-.67-1.3.09-2.44.09-3.62-.18-.15-.03-.26-.16-.27-.3-.02-.15.07-.29.2-.35.2-.09.44-.18.7-.26.26-.09.55-.19.79-.3,0,0,0,0,0,0-.48-.2-.97-.41-1.45-.75-.25-.18-.5-.52-.76-.89-.06-.08-.13-.17-.19-.26-.48.04-.96.13-1.45.28-3.3.95-4.39,4.88-4.97,8.2-.33,1.9-.44,3.93,1.26,4.62,2.16.87,4.41.19,6.51-.58.27-.1.55-.19.83-.29,1.41-.49,2.86-1,3.93-2.01.79-.75,1.09-1.95,1.12-3.04-.78-.09-1.55-1.09-1.81-1.58ZM6.09,13.1s-.75,1.43-1.13.99c-.38-.44,1.13-.99,1.13-.99ZM5.05,17.34c-.38-.44,1.13-.99,1.13-.99,0,0-.75,1.43-1.13.99ZM9.1,10.33s-.75,1.43-1.13.99c-.38-.44,1.13-.99,1.13-.99ZM7.38,9.28c-.38-.44,1.13-.99,1.13-.99,0,0-.75,1.43-1.13.99ZM7.92,14.33c-.38-.44,1.13-.99,1.13-.99,0,0-.75,1.43-1.13.99ZM8.89,17.43c-.38-.44,1.13-.99,1.13-.99,0,0-.75,1.43-1.13.99ZM10.83,14.43c-.38-.44,1.13-.99,1.13-.99,0,0-.75,1.43-1.13.99ZM11.89,11.32c-.38-.44,1.13-.99,1.13-.99,0,0-.75,1.43-1.13.99ZM12.38,16.71c-.38-.44,1.13-.99,1.13-.99,0,0-.75,1.43-1.13.99ZM14.32,14.18c-.38-.44,1.13-.99,1.13-.99,0,0-.75,1.43-1.13.99ZM21.07,7.24c-1.21-.85-3.03-.72-4.45-.28-.11.03-.23.07-.33.1,0,0,0,0,0,0-.11.04-.22.08-.32.13-.01-.05-.03-.09-.04-.14-.09-.31-.18-.62-.29-.92-.14-.37-.48-1.16-1.04-1.64.02.25.06.51.1.78.06.4.12.81.11,1.22,0,.05,0,.1,0,.16,0,.08-.04.14-.09.2-.07.08-.18.14-.28.13-.14,0-.25-.09-.3-.21-.03-.03-.05-.06-.07-.1-.07-.15-.24-.32-.45-.48-.47-.37-1.15-.7-1.47-.73-.14-.01-.28-.02-.43-.04-.41-.04-.86-.08-1.27-.07.06.08.13.17.2.26.06.08.11.15.17.23.03.04.06.08.09.12.18.25.38.51.51.61.41.3.84.48,1.31.67.2.08.4.17.6.26.1.05.18.14.2.25.02.11-.01.22-.09.31-.23.24-.56.42-.9.56.74.05,1.5.02,2.34-.05h.03c.14,0,.28.09.33.23.12.31.21.63.31.95.16.53.32,1.04.56,1.5.16.3.47.7.78.96-.06-.2-.13-.4-.2-.61-.22-.65-.45-1.32-.42-2.03,0,0,0-.01,0-.02.01-.15.12-.26.26-.3.03,0,.05-.02.08-.02h.29s.32-.02.32-.02c.47-.01.96-.05,1.41-.03-.27-.25-.67-.52-1.02-.69-.08-.04-.27-.07-.43-.11-.38-.07-.74-.14-.94-.37-.04-.05-.07-.1-.09-.15.09-.05.2-.09.32-.14.02,0,.04-.02.06-.02.11-.04.22-.07.33-.11,1.22-.37,2.83-.52,3.82.19.16.11.38.07.49-.08.11-.16.07-.38-.08-.49Z"/></svg>');
}

#detailMapCategory label[for="c9"]:before {
	-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.67,15.18v-2.48h-6.04v2.48l-1.19.54v.86h8.42v-.86l-1.19-.54ZM19.59,15.18h-3.88v-.97h3.88v.97ZM13.83,18.63h.97v-1.62h-.97v1.62ZM20.5,18.63h.97v-1.62h-.97v1.62ZM18.89,17.91h.97v-.89h-.97v.89ZM15.44,17.91h.97v-.89h-.97v.89ZM13.31,8.86c.02-.13.03-.27.03-.4,0-1.53-1.15-2.79-2.62-2.97-.74-.8-1.8-1.3-2.97-1.3-2.25,0-4.07,1.82-4.07,4.07,0,.01,0,.02,0,.04-.85.57-1.4,1.54-1.4,2.64,0,1.5,1.05,2.76,2.45,3.09.28.7.97,1.19,1.77,1.19.3,0,.58-.07.83-.19v3.61h2.19v-2.37l.85-1.46c.87-.06,1.61-.61,1.94-1.38,1.06-.4,1.81-1.42,1.81-2.62,0-.76-.3-1.45-.79-1.95ZM9,15.63v-1.14c.2.12.43.22.66.27l-.66.87Z"/></svg>');
}

#detailMapCategory label[for="c10"]:before {
	-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12.06,6.02c1.01,0,1.82-.82,1.82-1.82s-.82-1.82-1.82-1.82-1.82.82-1.82,1.82.82,1.82,1.82,1.82ZM16.02,17.35l-.84-4.45-.37-3.95c-.24-2.62-2.78-2.43-4.02-1.22l-2.06,2.11-1.93.62-.38-2.15c-.04-.24-.27-.39-.5-.35-.24.04-.39.27-.35.5l.4,2.27-.05.02c-.37.14-.58.54-.46.93v.03c.11.33.43.55.77.52l1.58,8.98c.04.24.27.39.5.35.24-.04.39-.27.35-.5l-1.59-9.01,1.72-.39c.4-.09.78-.26,1.13-.49l1.12-.75.4,3.01c.03.22-.23,1.15-.29,1.36l-1.69,5.72c-.13.46.14.94.6,1.07h.03c.44.13.89-.1,1.05-.52l2.28-5.58.6,2.54c.08.17.2.32.33.45l2.69,2.85c.32.31.82.32,1.16.03l.04-.03c.17-.15.28-.36.29-.59.01-.23-.06-.45-.22-.62l-2.3-2.76ZM17.55,12.59c.31-.03.59-.18.79-.41.2-.24.29-.54.26-.85l-.25-2.73c-.06-.64-.62-1.11-1.26-1.05l-1.4.13.47,5.04,1.4-.13Z"/></svg>');
}

#detailMapCategory label[for="c11"]:before {
	-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.7,12.73c-.12-.36-.47-.76-.72-1.01-.6-.58-1.24-.87-1.55-1.04-.23-.14-.53-.06-.67.19-.13.25-.05.55.18.7,1.49,1.02,1.73,2.23.66,3.5-.32.38-.75.68-1.38,1.03-1.03.58-3.17,1.09-5.21,1.09-2.05,0-4.18-.51-5.21-1.09-.63-.35-1.06-.65-1.38-1.03-1.08-1.27-.83-2.49.66-3.5.23-.15.31-.45.18-.7-.13-.25-.43-.33-.67-.19-.32.17-.96.46-1.55,1.04-.25.24-.6.65-.72,1.01-.12.35-.2.74-.2,1.14s.08.83.22,1.21c.25.67.69,1.24,1.24,1.74.83.74,1.92,1.31,3.18,1.71,1.27.4,2.71.62,4.25.62s2.99-.22,4.25-.62c1.27-.4,2.36-.97,3.18-1.71.55-.49.99-1.07,1.24-1.74.14-.38.22-.79.22-1.21,0-.4-.07-.79-.19-1.14ZM11.43,13.66c.24.54.55.9.79,1.09.24.19.43.25.58.17.15-.08.18-.29.12-.59-.06-.3-.18-.66-.26-1.08-.09-.42-.15-.97-.15-1.57,0-.3.02-.59.08-.89.06-.3.16-.59.3-.96.14-.36.29-.79.36-1.22.08-.43.09-.84.07-1.22-.05-.74-.19-1.41-.44-1.95-.24-.54-.56-.9-.79-1.09-.24-.19-.43-.25-.58-.17-.15.08-.18.3-.12.59.06.3.18.66.26,1.08.09.42.15.97.15,1.57,0,.3-.03.59-.08.89-.06.3-.16.59-.3.96-.14.36-.28.79-.36,1.22-.08.43-.09.84-.07,1.22.05.74.19,1.41.44,1.95ZM14.83,13.25c.25.49.55.79.78.95.23.15.42.19.56.1s.17-.29.12-.56c-.05-.27-.17-.58-.25-.95-.08-.36-.13-.83-.12-1.36,0-.26.03-.51.09-.75.06-.25.16-.5.3-.82.14-.32.29-.7.38-1.1.08-.39.1-.78.09-1.13-.02-.35-.06-.66-.14-.96-.07-.3-.17-.58-.29-.82-.25-.49-.55-.79-.78-.95-.23-.15-.42-.19-.56-.1s-.17.29-.12.56c.05.27.17.58.25.95.08.36.13.83.12,1.36,0,.26-.03.51-.09.75-.06.25-.16.5-.3.82-.14.32-.29.7-.38,1.1-.08.39-.1.78-.09,1.13.02.35.06.66.14.96.07.3.17.58.29.82ZM7.9,13.25c.25.49.55.79.78.95.23.15.42.19.56.1.14-.09.17-.29.12-.56-.05-.27-.17-.58-.25-.95-.08-.36-.13-.83-.12-1.36,0-.26.03-.51.09-.75.06-.25.16-.5.3-.82.14-.32.29-.7.38-1.1.09-.39.1-.78.09-1.13-.02-.35-.06-.66-.14-.96-.07-.3-.17-.58-.29-.82-.25-.49-.55-.79-.78-.95-.23-.15-.42-.19-.56-.1-.14.09-.17.29-.12.56.05.27.17.58.25.95.08.36.13.83.12,1.36,0,.26-.03.51-.09.75-.06.25-.16.5-.3.82-.14.32-.29.7-.38,1.1-.08.39-.1.78-.09,1.13.02.35.07.66.14.96.07.3.17.58.29.82Z"/></svg>');
}

#related {
	display: grid;
	grid-row-gap: 40px;
	padding: 40px 0 48px 0;
	background: var(--color-variable-bg);
}

#related:not(:has(section)) {
	display: none;
}

@media (min-width: 992px) {
	#related {
		grid-row-gap: 56px;
		padding: 56px 0 64px 0;
	}
}

#related h2 {
	display: none;
}

#related section {
	justify-self: center;
	width: min(100%, 960px);
}

#related section > * {
	grid-column: 2;
}

#related h3 {
	position: relative;
	margin-left: 24px;
	color: var(--color-variable);
	font-weight: 700;
	font-size: 24px;
	letter-spacing: 0.08em;
}

@media (min-width: 1200px) {
	#related h3 {
		margin-left: 0;
	}
}

#related h3:before {
	content: "";
	position: absolute;
	top: 10px;
	right: calc(100% + 32px);
	width: 100vw;
	height: 28px;
	background: currentColor;
	-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 10"><circle cx="6.5" cy="1.5" r="1.5"/></svg>') top right;
	-webkit-mask-size: 8px 10px;
}

#related h3 + div {
	display: grid;
	grid-gap: 16px 24px;
	margin-top: 16px;
}

@media (min-width: 576px) {
	#related h3 + div {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 992px) {
	#related h3 + div {
		grid-gap: 20px 40px;
	}
}

#related h3 + div dl {
	position: relative;
	display: grid;
	grid-template-columns: min(36vw, 180px) 1fr;
	grid-gap: 16px;
	padding: 8px 24px 8px 8px;
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
}

@media (min-width: 576px) {
	#related h3 + div dl {
		grid-template-columns: min(20vw, 180px) 1fr;
	}
}

#related h3 + div dl:not(:has(img)):before {
	content: "";
	grid-column: 1;
	grid-row: 1;
	aspect-ratio: 1 / 0.667;
	background: var(--dummy);
	background-size: 50% auto;
	border-radius: 2px;
	transition: opacity 0.2s ease-out;
}

#related h3 + div dl:has(a):hover:before,
#related h3 + div dl:has(a):hover img {
	opacity: 0.8;
}

#related h3 + div dl dt {
	align-self: center;
	font-weight: 700;
	letter-spacing: 0.05em;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	max-height: calc(1.65em * 3);
	overflow: hidden;
}

@media (min-width: 992px) {
	#related h3 + div dl dt {
		font-size: 18px;
	}
}

#related h3 + div dl dd:has(img) {
	order: -1;
}

#related h3 + div dl dd:has(a) {
	display: contents;
}

#related h3 + div dl dd img {
	aspect-ratio: 1 / 0.667;
	border-radius: 2px;
	transition: opacity 0.2s ease-out;
}

#related h3 + div dl dd a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	font-size: 0;
}

#recommend {
	grid-row-gap: 64px;
	padding: 64px 0 72px 0;
	overflow: hidden;
}

@media (min-width: 992px) {
	#recommend {
		grid-row-gap: 80px;
		padding: 80px 0 96px 0;
	}
}

#recommend h2 {
	display: none;
}

#recommend h2 + div {
	display: grid;
	grid-gap: 16px 24px;
	width: min(100%, 960px);
	margin: 0 auto;
}

@media (min-width: 576px) {
	#recommend h2 + div {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 992px) {
	#recommend h2 + div {
		grid-gap: 20px 40px;
	}
}

#recommend h2 + div dl {
	position: relative;
	display: grid;
	grid-template-columns: min(36vw, 180px) 1fr;
	grid-gap: 8px 16px;
	padding: 8px 40px 8px 8px;
	background: #fff;
	border: 1px solid var(--color-border);
	border-radius: 8px;
}

@media (min-width: 576px) {
	#recommend h2 + div dl {
		grid-template-columns: min(20vw, 180px) 1fr;
	}
}

@media (min-width: 768px) {
	#recommend h2 + div dl {
		padding-right: 56px;
	}
}

#recommend h2 + div dl:has(a):hover img {
	opacity: 0.8;
}

#recommend h2 + div dl#recommendReserve dt {
	@media (min-width: 992px) {
		align-self: end;
	}
}

#recommend h2 + div dl#recommendReserve dt + dd {
	display: none;
}

@media (min-width: 992px) {
	#recommend h2 + div dl#recommendReserve dt + dd {
		display: block;
		max-width: 10em;
	}
}

#recommend h2 + div dl#recommendReserve dd:has(img) {
	@media (min-width: 992px) {
		grid-row: 1 / 3;
	}
}

#recommend h2 + div dl dt {
	align-self: center;
	color: var(--color-variable);
	font-weight: 700;
	letter-spacing: 0.05em;
}

@media (min-width: 992px) {
	#recommend h2 + div dl dt {
		font-size: 18px;
	}
}

#recommend h2 + div dl dd {
}

#recommend h2 + div dl dd:has(img) {
	order: -1;
}

#recommend h2 + div dl dd:has(a) {
	display: contents;
}

#recommend h2 + div dl dd img {
	aspect-ratio: 1 / 0.667;
	border-radius: 2px;
	transition: opacity 0.2s ease-out;
}

#recommend h2 + div dl dd a {
	position: absolute;
	top: 0;
	left: 0;
	display: grid;
	grid-template-columns: 1fr 24px;
	align-items: center;
	width: 100%;
	height: 100%;
	padding: 8px;
	font-size: 0;
}

@media (min-width: 768px) {
	#recommend h2 + div dl dd a {
		grid-template-columns: 1fr 32px;
		padding: 16px;
	}
}

#recommend h2 + div dl dd a:hover:before,
#recommend h2 + div dl dd a:hover:after {
	transform: translateX(4px);
}

#recommend h2 + div dl dd a:before,
#recommend h2 + div dl dd a:after {
	content: "";
	grid-column: 2;
	grid-row: 1;
	aspect-ratio: 1;
	transition: transform 0.2s ease-out;
}

#recommend h2 + div dl dd a:before {
	background: var(--color-variable);
	border-radius: 100%;
}

#recommend h2 + div dl dd a:after {
	background: #fff;
	-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 10"><path d="M9.16,4.57l-3.13-3.13c-.24-.24-.62-.24-.85,0-.24.24-.24.62,0,.85l1.99,1.99H1.38c-.39,0-.71.32-.71.71s.32.71.71.71h5.79l-1.99,1.99c-.24.24-.24.62,0,.85.12.12.27.18.43.18s.31-.06.43-.18l3.13-3.13c.24-.24.24-.62,0-.85Z"/></svg>') center no-repeat;
	-webkit-mask-size: 10px;
}
#recommend section {
	grid-column: 1 / 4;
	display: grid;
	grid-template-columns: 1fr min(var(--wrap-fit), 960px) 1fr;
	grid-row-gap: 24px;
}

@media (min-width: 992px) {
	#recommend section {
		grid-row-gap: 32px;
	}
}

#recommend section > * {
	grid-column: 2;
}

#recommend section dl {
	position: relative;
	display: grid;
	grid-gap: 8px;
}

#recommend section dl:nth-child(n+2) {
	display: none;
}

#recommend section dl:not(:has(img)):before {
	content: "";
	grid-column: 1;
	grid-row: 1;
	aspect-ratio: 1 / 0.667;
	background: var(--dummy);
	background-size: 50% auto;
	border-radius: 8px;
	transition: opacity 0.2s ease-out;
}

#recommend section dl:has(a):hover:before,
#recommend section dl:has(a):hover img {
	opacity: 0.8;
}

#recommend section dt {
	font-weight: 700;
	font-size: 18px;
	letter-spacing: 0.05em;
}

#recommend section dd {
	letter-spacing: 0.05em;
}

#recommend section dd:has(img) {
	order: -1;
}

#recommend section dd:has(a) {
	display: contents;
}

#recommend section dd img {
	aspect-ratio: 1 / 0.667;
	object-fit: cover;
	border-radius: 8px;
	transition: opacity 0.2s ease-out;
}

#recommend section dd a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	font-size: 0;
}

#recommend h3 {
	position: relative;
	margin-left: 24px;
	color: var(--color-variable);
	font-weight: 700;
	font-size: 24px;
	letter-spacing: 0.08em;
}

@media (min-width: 1200px) {
	#recommend h3 {
		margin-left: 0;
	}
}

#recommend h3:before {
	content: "";
	position: absolute;
	top: 10px;
	right: calc(100% + 32px);
	width: 100vw;
	height: 28px;
	background: currentColor;
	-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 10"><circle cx="6.5" cy="1.5" r="1.5"/></svg>') top right;
	-webkit-mask-size: 8px 10px;
}

#recommend h3+div {
	display: grid;
	grid-gap: 16px 24px;
}

@media (min-width: 576px) {
	#recommend h3+div {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 992px) {
	#recommend h3+div {
		grid-gap: 20px 40px;
	}
}

#recommend .slide {
	grid-column: 1 / 4;
	justify-self: center;
	width: min(var(--wrap-fit), 1080px);
}

#recommend .slick-slider {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	column-gap: 24px;
}

#recommend .slick-slider:before {
	content: "";
	grid-column: 2;
	grid-row: 1;
	aspect-ratio: 1 / 0.667;
}

@media (min-width: 576px) {
	#recommend .slick-slider:has(img):before {
		width: calc(50% - 16px);
	}
}

@media (min-width: 768px) {
	#recommend .slick-slider:has(img):before {
		width: calc(33.33% - 16px);
	}
}

@media (min-width: 1200px) {
	#recommend .slick-slider:has(img):before {
		width: calc(25% - 16px);
	}
}

#recommend .slick-list {
	margin: 0 -12px;
	overflow: visible;
}

@media (min-width: 1200px) {
	#recommend .slick-list {
		overflow: hidden;
	}
}

#recommend .slick-slider:has(img) .slick-list {
	grid-column: 2;
	grid-row: 1 / 3;
}

#recommend .slick-slide {
	margin: 0 12px;
}

#recommend .slick-arrow {
	all: unset;
	position: relative;
	aspect-ratio: 1;
	align-self: center;
	width: 40px;
	background: #999;
	border-radius: 100%;
	color: #fff;
	font-size: 0;
	z-index: 1;
	cursor: pointer;
}

#recommend .slick-arrow: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 16 16"><path d="M14.24,7.36l-4.7-4.7c-.35-.35-.93-.35-1.28,0-.35.35-.35.93,0,1.28l2.99,2.99H2.56c-.59,0-1.07.48-1.07,1.07s.48,1.07,1.07,1.07h8.69l-2.99,2.99c-.35.35-.35.93,0,1.28.18.18.41.26.64.26s.46-.09.64-.26l4.7-4.7c.35-.35.35-.93,0-1.28Z"/></svg>') center no-repeat;
	-webkit-mask-size: 16px;
}

#recommend .slick-prev:before {
	transform: scale(-1, 1);
}

.pswp__counter{
	display: none;
}