/* CSS Document */
@import url('https://use.typekit.net/dga3pzp.css');
/*
Kiro Bold
font-family: "kiro", sans-serif;
font-weight: 700;
font-style: normal;

Cronos Pro Bold
font-family: "cronos-pro", sans-serif;
font-weight: 700;
font-style: normal;
*/


#detailHeader{
	display: grid;
}

#detailHeader:has(figure) #detailPhoto {
	grid-row: 2;
}

@media (min-width: 992px) {
	#detailHeader:has(figure) {
		grid-template-columns: 1fr 1fr;
	}
	#detailHeader:has(figure) h2 {
		grid-column: 1 / 3;
	}
	#detailHeader:has(figure) #detailLead {
		align-self: end;
	}
	#detailHeader:has(figure) #detailPhoto {
		grid-column: 1;
		grid-row: 2 / 4;
	}
	#detailHeader:has(figure) #detailTable {
		grid-column: 1 / 3;
		}
	}
}

@media (min-width: 1200px) {
	#detailHeader:has(figure) {
		grid-template-columns: 1.2fr 1fr;
	}
}

#detailHeader h2 {
	position: relative;
	display: grid;
	grid-template-columns: 1.625em auto;
	align-content: center;
	justify-content: center;
	grid-gap: 8px;
	min-height: 92px;
	padding: 16px var(--wrap-space);
	background: #5ab6b6;
	color: #fff;
	font-weight: 700;
	font-size: 24px;
	letter-spacing: 0.08em;
}

@media (min-width: 992px) {
	#detailHeader h2 {
		min-height: 120px;
		font-size: 32px;
	}
}

#detailHeader h2:before {
	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 52 52"><path d="M11.74,5.57c-1.28,0-2.32,1.04-2.32,2.32,0,.85.46,1.59,1.15,1.99v37.41h2.34V9.88c.68-.4,1.15-1.14,1.15-1.99,0-1.28-1.04-2.32-2.32-2.32ZM44.22,10.21H15.84v23.69h28.38l-4.68-12.36,4.68-11.33Z"/></svg>') center no-repeat;
	-webkit-mask-size: contain;
	transform: translateY(0.1em);
}

#detailHeader h2:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url("/common/images/pattern.webp") center top;
	opacity: 0.3;
	mix-blend-mode: soft-light;
}

#detailLead,
#detailStatus {
	justify-self: center;
	width: calc(100% - 48px);
	max-width: var(--wrap);
}

@media (min-width: 992px) {
	#detailLead,
	#detailStatus {
		width: calc(100% - 128px);
	}
}

#detailLead {
	margin: 32px 0;
	padding-bottom: 24px;
	border-bottom: 1px solid currentColor;
}

@media (min-width: 992px) {
	#detailLead {
		margin: 40px 0 48px 0;
		padding-bottom: 32px;
	}
}

#detailLead .fr-view {
	letter-spacing: 0.05em;
}

#detailStatus {
	justify-self: center;
	display: grid;
	align-content: start;
	grid-gap: 10px;
	margin-bottom: 32px;
}

@media (min-width: 992px) {
	#detailStatus {
		margin-bottom: 48px;
	}
}

#detailStatus dl {
	display: grid;
	grid-template-columns: 120px auto;
	align-items: start;
	grid-gap: 16px;
	margin: 0 8px;
}

#detailStatus dt {
	display: grid;
	align-items: center;
	min-height: 32px;
	padding: 4px 16px;
	border-radius: 16px;
	background: var(--color);
	color: #fff;
	font-size: 15px;
	letter-spacing: 0.05em;
	text-align: center;
	transform: translateY(-0.15em);
}

#detailStatus dd {
	letter-spacing: 0.05em;
}

#detailPhoto {
	position: relative;
	padding-top: 66.67%;
}

#detailPhoto img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#detailTable {
	display: grid;
	grid-template-columns: 1fr var(--wrap) 1fr;
	grid-row-gap: 32px;
	padding: 48px 0 64px 0;
	background: #e7e7e7;
	overflow: hidden;
}

@media (min-width: 768px) {
	#detailTable {
		grid-row-gap: 40px;
		padding: 64px 0 80px 0;
	}
}

#detailTable > * {
	grid-column: 2;
}

#detailTable h3 {
	grid-row: 1;
	display: grid;
	grid-template-columns: 30px 1fr;
	grid-gap: 8px;
	font-weight: 700;
	font-size: 20px;
	letter-spacing: 0.08em;
}

@media (min-width: 768px) {
	#detailTable h3 {
		width: 50%;
	}
}

#detailTable h3:before {
	content: "";
	aspect-ratio: 1;
	background: #5ab6b6;
	-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30"><path d="M15,2.31c-4.78,0-8.65,3.87-8.65,8.65s8.65,15.96,8.65,15.96c0,0,8.65-11.18,8.65-15.96S19.78,2.31,15,2.31ZM15,14.33c-2.15,0-3.89-1.74-3.89-3.89s1.74-3.89,3.89-3.89,3.89,1.74,3.89,3.89-1.74,3.89-3.89,3.89Z"/></svg>') center no-repeat;
	-webkit-mask-size: contain;
}

#detailTable h3 + div {
	counter-reset: count;
	display: grid;
}

#detailTable h3 + div > dl {
	grid-column: 1;
	grid-row: 1;
	aspect-ratio: 1;
	width: min(100%, 240px);
	visibility: hidden;
}

#detailTable dl {
	counter-reset: count;
	position: relative;
	display: grid;
	align-content: start;
	grid-gap: 16px;
	margin-right: 40px;
	padding: 16px;
	background: #fff;
	border-radius: 16px;
	box-shadow: 4px 4px 2px rgba(0, 0, 0, 0.2);
}

#detailTable dl:after {
	content: "";
	position: absolute;
	left: -20px;
	top: 50%;
	aspect-ratio: 1;
	width: 20px;
	background: #5ab6b6;
	-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 13.53 20"><path d="M0,0l13.53,9.98L0,20V0Z"/></svg>') center no-repeat;
	-webkit-mask-size: contain;
	transform: translateX(-50%);
}

#detailTable dl[data-number="1"]:after {
	content: none;
}

#detailTable 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;
}

#detailTable dl:has(a):hover:before,
#detailTable dl:has(a):hover img {
	opacity: 0.8;
}

#detailTable dt {
	letter-spacing: 0.05em;
}

#detailTable dt+dd {
	position: absolute;
	top: -16px;
	left: 50%;
	display: grid;
	align-content: center;
	grid-gap: 6px;
	aspect-ratio: 1;
	width: 56px;
	padding-top: 6px;
	background: var(--color-theme) url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56 56" fill="white"><path d="M22.26,27.21c-.28,0-.5.23-.5.5s.22.5.5.5.5-.22.5-.5-.23-.5-.5-.5ZM25.26,27.21c-.28,0-.5.23-.5.5s.22.5.5.5.5-.22.5-.5-.23-.5-.5-.5ZM34.26,27.21c-.28,0-.5.23-.5.5s.22.5.5.5.5-.22.5-.5-.23-.5-.5-.5ZM28.26,27.21c-.28,0-.5.23-.5.5s.22.5.5.5.5-.22.5-.5-.23-.5-.5-.5ZM31.26,27.21c-.28,0-.5.23-.5.5s.22.5.5.5.5-.22.5-.5-.23-.5-.5-.5Z"/></svg>') center no-repeat;
	background-size: contain;
	-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56 56"><path d="M55.37,36.01c-.37,1.26-2.54,1.84-3.08,3.01-.55,1.19.43,3.21-.28,4.3-.44.68-1.49.92-2.42,1.24-.55.19-1.07.42-1.39.78-.85.98-.49,3.2-1.48,4.05-.98.85-3.12.17-4.22.87-1.09.7-1.36,2.93-2.55,3.47-1.18.53-3.03-.72-4.29-.36-.28.08-.55.25-.8.47-.87.73-1.63,1.99-2.63,2.13-1.27.18-2.7-1.55-4.02-1.55-1.32,0-2.75,1.72-4.03,1.54-1-.14-1.76-1.4-2.62-2.14-.25-.22-.52-.39-.8-.47-1.26-.37-3.12.88-4.3.34-1.19-.55-1.45-2.78-2.54-3.48-1.1-.71-3.24-.03-4.22-.89-.98-.85-.61-3.07-1.46-4.05-.32-.37-.83-.59-1.39-.78-.93-.33-1.97-.57-2.41-1.25-.7-1.09.28-3.11-.26-4.3-.54-1.18-2.71-1.76-3.07-3.02-.36-1.24,1.15-2.9.97-4.2C1.91,30.45,0,29.27,0,27.95,0,26.63,1.92,25.46,2.1,24.19c.19-1.3-1.32-2.97-.95-4.2.37-1.26,2.54-1.84,3.08-3.01.55-1.19-.43-3.21.28-4.3.71-1.1,2.95-1.04,3.81-2.02.85-.98.49-3.19,1.48-4.05.98-.85,3.12-.17,4.22-.87,1.09-.7,1.36-2.93,2.55-3.47,1.18-.54,3.04.72,4.29.35,1.24-.36,2.13-2.42,3.43-2.61,1.27-.18,2.7,1.55,4.02,1.56,1.32,0,2.76-1.73,4.03-1.54,1.3.19,2.19,2.25,3.42,2.62,1.26.37,3.12-.88,4.3-.34,1.19.55,1.45,2.78,2.54,3.48,1.1.71,3.23.03,4.21.88.98.86.61,3.07,1.46,4.06.85.98,3.09.93,3.8,2.03.7,1.09-.28,3.11.27,4.3.53,1.18,2.7,1.76,3.07,3.03.36,1.24-1.15,2.9-.97,4.2.18,1.27,2.09,2.45,2.09,3.77,0,1.32-1.92,2.49-2.11,3.76-.19,1.3,1.32,2.96.95,4.2Z"/></svg>') center no-repeat;
	-webkit-mask-size: contain;
	color: #fff;
	font-size: 20px;
	font-family: kiro, sans-serif;
	line-height: 1;
	text-align: center;
	transform: translateX(-50%);
}

#detailTable dt+dd:before {
	content: "SPOT";
	font-size: 12px;
	letter-spacing: 0.12em;
}

#detailTable dd:has(img) {
	order: -1;
}

#detailTable dd:has(a) {
	display: contents;
}

#detailTable dd img {
	aspect-ratio: 1 / 0.667;
	object-fit: cover;
	border-radius: 8px;
	transition: opacity 0.2s ease-out;
}

#detailTable dd a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	font-size: 0;
}

#detailTable .slick-slider {
	display: contents;
}

#detailTable .slick-list {
	grid-column: 2;
	margin-right: -24px;
	overflow: visible;
}

#detailTable .slick-track {
	display: flex;
	align-items: stretch;
}

#detailTable .slick-slide {
	counter-increment: count;
	float: none;
	display: grid;
	height: auto;
	grid-template-columns: repeat(2, 1fr);
}

#detailTable .slick-slide>div {
	display: contents;
}

#detailTable .slick-slide>div>span {
	display: contents !important;
}

@media (min-width: 768px) {
	#detailTable .slick-slide {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (min-width: 1200px) {
	#detailTable .slick-slide {
		grid-template-columns: repeat(4, 1fr);
	}
}

#detailTable .slick-arrow {
	all: unset;
	position: relative;
	grid-column: 2;
	align-self: center;
	width: 24px;
	aspect-ratio: 1;
	color: #5ab6b6;
	font-size: 0;
}

@media (min-width: 768px) {
	#detailTable .slick-arrow {
		grid-row: 1;
		justify-self: end;
	}
}

#detailTable .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" style="fill: none; stroke: black; stroke-miterlimit: 10; stroke-width: 2px;" stroke-linecap="round" stroke-linejoin="round"><polyline points="5.75 12.5 10.25 8 5.75 3.5"/></svg>') center no-repeat;
	-webkit-mask-size: contain;
}

#detailTable .slick-arrow.slick-disabled {
	color: #999;
	opacity: 0.5;
	pointer-events: none;
}

#detailTable .slick-prev {
	margin-right: min(50%, 420px);
	transform: translateX(100%);
}

#detailTable .slick-prev:before {
	transform: scale(-1, 1);
}

#detailTable .slick-dots {
	grid-column: 2;
	display: grid;
	overflow: hidden;
}

@media (min-width: 768px) {
	#detailTable .slick-dots {
		grid-row: 1;
		justify-self: end;
		align-items: center;
		width: min(50%, 420px);
		padding: 0 32px;
	}
}

#detailTable .slick-dots li {
	grid-row: 1;
	height: 3px;
	background: #999;
	overflow: hidden;
	cursor: pointer;
}

#detailTable .slick-dots li:first-child {
	border-radius: 2px 0 0 2px;
}

#detailTable .slick-dots li:last-child {
	border-radius: 0 2px 2px 0;
}

#detailTable .slick-dots li.slick-active {
	background: #5ab6b6;
}

#detailTable .slick-dots button {
	opacity: 0;
}

#detailCourse {
	display: grid;
	grid-template-columns: 1fr var(--wrap) 1fr;
	background: #f9f9f9;
	padding: 48px 0 64px 0;
	overflow: hidden;
}

@media (min-width: 768px) {
	#detailCourse {
		padding: 64px 0 80px 0;
	}
}

#detailCourse > * {
	grid-column: 2;
}

#detailCourseStart,
#detailCourseGoal {
	justify-self: center;
	position: relative;
	display: grid;
	align-items: center;
	min-height: 48px;
	min-width: 180px;
	background: var(--color);
	border-radius: 24px;
	color: #fff;
	font-weight: 700;
	font-size: 20px;
	letter-spacing: 0.2em;
	text-align: center;
	text-transform: uppercase;
}

#detailCourseStart:before,
#detailCourseGoal:before {
	content: "";
	position: absolute;
	left: 0;
	width: 100%;
	height: 12px;
	background: var(--color);
	-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 12"><polygon points="0 0 5 12 10 0 0 0"/></svg>') center no-repeat;
	-webkit-mask-size: contain;
}

#detailCourseStart {
	margin-bottom: 12px;
}

#detailCourseStart:before {
	top: 100%;
}

#detailCourseGoal {
	margin-top: 12px;
}

#detailCourseGoal:before {
	bottom: 100%;
	transform: scale(1, -1);
}

#detailCourseRoute {
	display: grid;
	margin: 16px 0;
}

#detailFooter {
	display: grid;
	grid-template-columns: 1fr var(--wrap) 1fr;
	background: #f9f9f9;
}

#detailFooter > * {
	grid-column: 2;
}

#detailMap {
	display: grid;
	grid-template-rows: min(75vh, 440px);
	padding-top: 16px;
}

@media (min-width: 576px) {
	#detailMap {
		grid-template-rows: min(75vw, 640px);
	}
}

@media (min-width: 992px) {
	#detailMap {
		grid-template-columns: 1fr min(30vw, 320px);
	}
}

#detailMapText {
	margin-top: 16px;
}

@media (min-width: 992px) {
	#detailMapText {
		grid-column: 1 / 3;
	}
}

#detailMapBody {
	position: relative;
	border: 0 solid currentColor;
	border-width: 1px 1px 0 1px;
	overflow: hidden;
}

@media (min-width: 992px) {
	#detailMapBody {
		border-width: 1px 0 1px 1px;
	}
}

#detailMapBody iframe,
#detailMapBody [id^="gMap"] {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#detailMapBody > img {
	position: absolute;
	width: 32px;
	left: 50%;
	bottom: 16px;
	transform: translate(-50%, 0);
	z-index: 1;
}

#detailMapList {
	position: relative;
	max-height: min(50vw, 240px);
	background: #fff;
	border: 0 solid currentColor;
	border-width: 0 1px 1px 1px;
	overflow: hidden;
}

@media (min-width: 992px) {
	#detailMapList {
		border-width: 1px 1px 1px 0;
		max-height: 100%;
	}
}

#detailMapList:has(menu) {
	display: grid;
	grid-template-rows: auto 1fr auto;
}

#detailMapList ul {
	counter-reset: count;
	padding: 0 16px;
}

#detailMapList menu+ul {
	background: #fff;
	overflow-y: auto;
}

#detailMapList li {
	display: grid;
	grid-template-columns: 32px auto;
	align-content: center;
	grid-gap: 16px;
	padding: 16px 0;
	font-weight: 500;
	letter-spacing: 0.05em;
	cursor: pointer;
}

#detailMapList li:nth-child(n+2) {
	border-top: 1px solid var(--color-border);
}

#detailMapList li:before {
	counter-increment: count;
	content: counter(count);
	display: grid;
	align-content: center;
	aspect-ratio: 1;
	padding-bottom: 2px;
	background: var(--color-theme);
	border-radius: 100%;
	color: #fff;
	font-weight: 700;
	text-align: center;
	letter-spacing: 0;
	line-height: 1;
	transform: translateY(-0.2em);
}

#detailMapList menu {
	all: unset;
	position: relative;
	height: 32px;
	margin: 0;
	padding: 0;
	background: #5ab6b6;
	color: #fff;
	font-size: 0;
	cursor: pointer;
	z-index: 1;
}

#detailMapList menu: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" style="fill: none; stroke: black; stroke-miterlimit: 10; stroke-width: 2px;"><polyline points="2 11 8 5 14 11"/></svg>') center no-repeat;
	-webkit-mask-size: 16px;
}

#detailMapList menu#detailMapListDown {
	transform: scale(1, -1);
}

#detailMapToggle {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	grid-gap: 16px;
	min-height: 64px;
	margin: 0;
	padding: 8px 24px;
	background: #fff;
	border: 1px solid currentColor;
	color: #5ab6b6;
	font-weight: 700;
	font-size: 18px;
	letter-spacing: 0.05em;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
}

#detailMapToggle:after {
	content: "+";
	font-size: 2em;
	line-height: 1;
	transform: translate(8px, -0.1em);
}

#detailMapToggle.open:after {
	content: "\30FC";
}

#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 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;
}

#recommend {
	display: grid;
	grid-template-columns: 1fr min(var(--wrap-fit), 960px) 1fr;
	grid-row-gap: 24px;
	margin: 64px 0 72px 0;
	overflow: hidden;
}

@media (min-width: 992px) {
	#recommend {
		grid-row-gap: 32px;
		margin: 72px 0 88px 0;
	}
}

#recommend > * {
	grid-column: 2;
}

#recommend h2 {
	position: relative;
	margin-left: 24px;
	color: #5ab6b6;
	font-weight: 700;
	font-size: 24px;
	letter-spacing: 0.08em;
}

@media (min-width: 1200px) {
	#recommend h2 {
		margin-left: 0;
	}
}

#recommend h2: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 h2 + div {
	display: grid;
	grid-gap: 16px 24px;
}

#recommend h2 + div > dl{
	grid-column: 1;
	grid-row: 1;
	aspect-ratio: 1;
	width: min(100%, 240px);
	visibility: hidden;
}
@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 dl {
	position: relative;
	display: grid;
	grid-gap: 8px;
}

#recommend dl:nth-child(n + 2) {
	display: none;
}

#recommend 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 dl:has(a):hover:before,
#recommend dl:has(a):hover img {
	opacity: 0.8;
}

#recommend dt {
	font-weight: 700;
	font-size: 18px;
	letter-spacing: 0.05em;
}

#recommend dd {
	letter-spacing: 0.05em;
}

#recommend dd:has(img) {
	order: -1;
}

#recommend dd:has(a) {
	display: contents;
}

#recommend img {
	aspect-ratio: 1 / 0.667;
	object-fit: cover;
	border-radius: 8px;
	transition: opacity 0.2s ease-out;
}

#recommend a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	font-size: 0;
}

#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: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);
}

.date {
	display: grid;
	grid-gap: 8px;
	font-weight: 700;
	font-size: 24px;
	letter-spacing: 0.08em;
	text-align: center;
}

@media (min-width: 1200px) {
	.date {
		font-size: 32px;
	}
}

.date:not(:first-child) {
	margin-top: 24px;
}

.date:not(:last-child) {
	margin-bottom: 24px;
}

.date:before,
.date:after {
	content: "";
	height: 4px;
	border: 0 solid currentColor;
	border-width: 1px 0;
}

.move {
	position: relative;
	display: grid;
	grid-template-columns: 52px auto;
	align-items: center;
	justify-content: center;
	grid-gap: 0 16px;
	padding: 8px 0;
	font-size: 15px;
	letter-spacing: 0.05em;
}

.move:before {
	content: "";
	grid-column: 1;
	grid-row: 1;
	aspect-ratio: 1;
	background: currentColor url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52 52" fill="white"><path d="M36.39,24.15l-3.62-1.9-1.53-3.13c-.77-1.58-2.24-2.7-3.97-3.02l-1.57-.29c-.79-.15-1.6-.04-2.33.3l-4.57,2.16c-.51.24-.91.66-1.13,1.17l-2.03,4.75c-.13.3-.13.64,0,.95.12.3.37.54.67.67l.05.02c.61.25,1.3-.03,1.57-.62l1.87-4.04,2.95-.95-2.93,13.01-2.85,7.11c-.16.39-.14.84.05,1.22.19.38.53.66.94.78l.12.03c.66.18,1.35-.1,1.69-.69l3.38-5.84,2.01-3.99,3.67,4.05,2.71,5.75c.31.65,1.03.99,1.72.81h.03c.4-.11.74-.38.94-.75.2-.37.23-.8.1-1.19l-2-5.79c-.28-.81-.7-1.57-1.23-2.25l-3.24-4.29,1.19-6.19,1.53,1.95c.19.24.44.43.71.56l4.04,1.82c.29.13.62.14.92.02.3-.12.54-.35.66-.65v-.03c.25-.57.01-1.22-.53-1.51ZM27.8,14.71c1.75,0,3.16-1.41,3.16-3.16s-1.41-3.16-3.16-3.16-3.16,1.41-3.16,3.16,1.41,3.16,3.16,3.16Z"/></svg>') center no-repeat;
	background-size: contain;
	border-radius: 100%;
}

.move:not(:first-child) {
	margin-top: 16px;
}

.move:not(:first-child):after {
	content: "";
	position: absolute;
	top: -16px;
	left: 0;
	width: 100%;
	height: 16px;
	background: currentColor;
	-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4 16"><circle cx="2" cy="2" r="2" /><circle cx="2" cy="10" r="2" /></svg>') center top no-repeat;
	-webkit-mask-size: contain;
}

.date+.move {
	margin-top: 0;
}

.date+.move:after {
	content: none;
}

.move[data-type="bus"]:before {
	background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40" fill="white"><path d="M25.27,7.87h-10.55c-2.85,0-5.17,2.31-5.17,5.17v12.57c0,2.42,1.97,4.39,4.39,4.39h12.1c2.42,0,4.39-1.97,4.39-4.39v-12.57c0-2.85-2.31-5.17-5.17-5.17ZM15.52,10.19h8.95v1.49h-8.95v-1.49ZM12.83,15.01c0-.65.53-1.17,1.18-1.17h11.99c.65,0,1.17.53,1.17,1.17v4.96c0,.65-.53,1.17-1.17,1.17h-11.99c-.65,0-1.18-.53-1.18-1.17v-4.96ZM13.95,26.89c-.76,0-1.37-.61-1.37-1.37s.61-1.37,1.37-1.37,1.37.61,1.37,1.37-.61,1.37-1.37,1.37ZM22.7,28.59h-5.14v-2.24h5.14v2.24ZM26.05,26.89c-.76,0-1.37-.61-1.37-1.37s.61-1.37,1.37-1.37,1.37.61,1.37,1.37-.61,1.37-1.37,1.37ZM11.55,29.96v2.06c0,.26.21.47.47.47h2.79c.26,0,.47-.21.47-.47v-1.44h-1.33c-.87,0-1.69-.23-2.4-.62ZM24.72,30.58v1.44c0,.26.21.47.47.47h2.79c.26,0,.47-.21.47-.47v-2.06c-.71.4-1.53.62-2.4.62h-1.33Z"/></svg>');
}

.move[data-type="train"]:before {
	background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40" fill="white"><path d="M29.48,25.44v-11.31c0-2.59-2.1-4.69-4.69-4.69h-2.18l.26-2.31h.48c.51,0,.94.31,1.13.75l.87-.37h0c-.33-.78-1.1-1.32-2-1.33h-6.69c-.9,0-1.67.55-2,1.33l.87.37c.19-.44.62-.75,1.13-.75h.48l.26,2.31h-2.18c-2.59,0-4.69,2.1-4.69,4.69v11.31c0,1.96,1.43,3.6,3.3,3.93l-2.94,4.45h2.62l1.21-1.83h10.59l1.21,1.83h2.62l-2.94-4.45c1.87-.33,3.3-1.96,3.3-3.93ZM21.92,7.12l-.26,2.31h-3.33l-.26-2.31h3.85ZM15.94,11.54h8.13v1.35h-8.13v-1.35ZM13.49,15.92h0c0-.59.48-1.07,1.07-1.07h10.88c.59,0,1.07.48,1.07,1.07v3.56c0,.59-.48,1.07-1.07,1.07h-10.88c-.59,0-1.07-.48-1.07-1.07v-3.56ZM14.51,26.61c-.69,0-1.24-.56-1.24-1.24s.56-1.24,1.24-1.24,1.24.56,1.24,1.24-.56,1.24-1.24,1.24ZM15.49,30.8l.91-1.37h7.2l.91,1.37h-9.02ZM25.49,26.61c-.69,0-1.24-.56-1.24-1.24s.56-1.24,1.24-1.24,1.24.56,1.24,1.24-.56,1.24-1.24,1.24Z"/></svg>');
}

.move[data-type="car"]:before {
	background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40" fill="white"><path d="M9.55,28.47c0,.63.51,1.15,1.15,1.15h1.57c.63,0,1.15-.51,1.15-1.15v-1.64h-3.86v1.64ZM32.41,20.27c-.03-.97-.68-1.81-1.6-2.11l-1.06-.59-1.51-5.5c-.27-1-1.18-1.69-2.21-1.69h-12.05c-1.03,0-1.94.69-2.21,1.69l-1.51,5.5-1.06.59c-.93.29-1.57,1.14-1.6,2.11l-.09,4.27c0,.41.15.81.43,1.11.29.3.68.46,1.09.46h21.94c.41,0,.81-.17,1.09-.46.29-.3.44-.69.43-1.11l-.08-4.27ZM12.16,16.73l1.16-4.23c.08-.29.35-.5.65-.5h12.05c.3,0,.57.2.65.5l1.16,4.23c.03.12,0,.24-.06.33-.07.09-.19.15-.3.15h-14.94c-.12,0-.23-.06-.3-.15-.07-.1-.1-.22-.06-.33ZM11.15,24.22c-1.04,0-1.89-.84-1.89-1.89s.85-1.89,1.89-1.89,1.89.85,1.89,1.89-.85,1.89-1.89,1.89ZM22.88,24.04h-5.75v-1.89h5.75v1.89ZM28.85,24.22c-1.04,0-1.89-.84-1.89-1.89s.85-1.89,1.89-1.89,1.89.85,1.89,1.89-.84,1.89-1.89,1.89ZM26.58,28.47c0,.63.51,1.15,1.15,1.15h1.57c.63,0,1.15-.51,1.15-1.15v-1.64h-3.86v1.64Z"/></svg>');
}

.move[data-type="lightRail"]:before {
	background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40" fill="white"><path d="M6.12,28.77h24.91v-.98H6.12v.98ZM29.72,17.54c-1.42-1.2-6.05-6.43-9.72-6.43l-1.9-.04h-.75c-.09-.01-.18-.01-.27,0H6.11v15.55h21.06c1.97.07,3.59-.19,4.69-.96,2.89-2.01,2.24-4.45-2.13-8.13ZM10.73,24.44h-2.71v-10.31h2.71v10.31ZM14.64,24.44h-2.7v-10.31h2.7v10.31ZM25.29,20c-2.29.65-8.02.71-8.02.71l.04-6.58s3.39-.14,4.58.22c1.19.36,3.44,2.7,4.27,3.53s0,1.87-.87,2.12Z"/></svg>');
}

.move[data-type="bicycle"]:before {
	background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40" fill="white"><path d="M14.77,20.37c.38.6.6,1.3.6,2.06,0,1.06-.43,2.02-1.13,2.72-.7.7-1.65,1.12-2.72,1.13-1.06,0-2.02-.43-2.72-1.13-.7-.7-1.12-1.65-1.12-2.72,0-1.06.43-2.02,1.12-2.72.7-.7,1.65-1.12,2.72-1.13.44,0,.86.08,1.26.21.28-.47.53-.95.77-1.44-.63-.25-1.31-.39-2.03-.39-3.02,0-5.46,2.44-5.46,5.46,0,3.02,2.44,5.46,5.46,5.46,3.02,0,5.46-2.44,5.46-5.46,0-1.38-.52-2.64-1.36-3.6-.27.52-.55,1.04-.86,1.54ZM15.93,11.8c.1.13.15.29.15.45,0,.08-.01.16-.04.23l-.71,2.22c-.78,2.43-1.97,4.71-3.53,6.73l-.95,1.24.96.74.95-1.24c1.46-1.9,2.62-4.02,3.44-6.27h5.86l-1.31,3.65c.41.06.8.2,1.14.41l1.89-5.27h-7.17l.59-1.83c.06-.2.09-.4.09-.61,0-.41-.13-.82-.38-1.17-.37-.51-.97-.81-1.6-.81h-1.89v1.21h1.89c.25,0,.48.12.62.32ZM21.24,13.89l3.69.38c.22.02.41-.13.45-.34l.16-.9c.02-.12-.01-.24-.09-.34-.08-.09-.19-.15-.32-.15h-3.84c-.23,0-.41.19-.41.41v.52c0,.21.16.39.37.41ZM28.99,16.97c-2.58,0-4.74,1.8-5.31,4.21h1.68c.19-.56.5-1.05.91-1.46.7-.7,1.65-1.12,2.72-1.12,1.06,0,2.02.43,2.72,1.12.7.7,1.12,1.65,1.12,2.72,0,1.06-.43,2.02-1.12,2.72-.7.7-1.65,1.12-2.72,1.13-1.06,0-2.02-.43-2.72-1.13-.41-.41-.72-.91-.91-1.46h-1.68c.57,2.41,2.73,4.21,5.31,4.21,3.02,0,5.46-2.44,5.46-5.46,0-3.02-2.44-5.46-5.46-5.46ZM28.99,23.04v-1.21h-5.77c.04.2.06.4.06.61s-.02.41-.06.61h5.77ZM20.77,22.32h-.02c-.05-.17-.2-.31-.39-.31-.23,0-.41.19-.41.42,0,.1.04.19.1.26l1.22,3.04h-.94v1.08h2.72v-1.08h-.92l-1.36-3.41ZM19.91,23.48c-.41-.17-.69-.58-.69-1.05,0-.63.51-1.14,1.14-1.14.63,0,1.14.51,1.14,1.14,0,.16-.03.31-.09.45l.44,1.16c.43-.4.71-.97.71-1.61,0-1.21-.98-2.19-2.19-2.19s-2.19.98-2.19,2.19c0,1.2.97,2.18,2.17,2.19l-.43-1.14Z"/></svg>');
}

.spot {
	counter-increment: count;
	position: relative;
	display: grid;
	grid-gap: 0 24px;
	padding: 24px;
	scroll-margin-top: 24px;
	background: #fff;
	border-radius: 20px;
	box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.2);
	outline: none;
}

@media (min-width: 576px) {
	.spot {
		grid-template-columns: 1fr 1fr;
	}
	.spot > * {
		grid-column: 1 / 3;
	}
}

@media (min-width: 768px) {
	.spot {
		padding: 32px;
	}
}

@media (min-width: 922px) {
	.spot {
		column-gap: 32px;
		padding: 40px 56px;
	}
}

.spot:not(:first-child) {
	margin-top: 48px;
}

.spot:not(:first-child):before {
	content: "";
	position: absolute;
	top: -48px;
	left: 0;
	width: 100%;
	height: 40px;
	background: currentColor;
	-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 14 40"><circle cx="7" cy="2" r="2" /><circle cx="7" cy="10" r="2" /><circle cx="7" cy="18" r="2" /><circle cx="7" cy="26" r="2" /><polygon points="0 31 14 31 7 38"/></svg>') center top no-repeat;
	-webkit-mask-size: contain;
}

.spot:not(:last-child) {
	margin-bottom: 24px;
}

.spot:not(:last-child):after {
	content: "";
	position: absolute;
	bottom: -24px;
	left: 0;
	width: 100%;
	height: 16px;
	background: currentColor;
	-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4 16"><circle cx="2" cy="2" r="2" /><circle cx="2" cy="10" r="2" /></svg>') center top no-repeat;
	-webkit-mask-size: contain;
}

.spot .spotNumber {
	grid-column: 1;
	justify-self: center;
	transform: translateY(-8px);
}

@media (min-width: 576px) {
	.spot .spotNumber {
		grid-row: 1 / 3;
		justify-self: start;
		transform: translate(-8px, -8px);
	}
}

@media (min-width: 922px) {
	.spot .spotNumber {
		margin: -16px 0 0 -16px;
	}
}

.spot .spotName {
	grid-column: 1;
	grid-row: 3;
}

@media (min-width: 576px) {
	.spot .spotName {
		grid-column: 1 / 3;
		grid-row: 2;
		margin-left: 96px;
	}
}

.spot .spotLead {
	grid-column: 1;
	grid-row: 2;
	align-self: end;
}

@media (min-width: 576px) {
	.spot .spotLead {
		grid-column: 1 / 3;
		grid-row: 1;
		margin-left: 96px;
	}
}

.spot .spotPhoto {
	margin-top: 16px;
}

@media (min-width: 768px) {
	.spot .spotPhoto {
		margin-top: 24px;
	}
}

@media (min-width: 1200px) {
	.spot .spotPhoto {
		width: 420px;
	}
}

.spot .spotText {
	margin-top: 16px;
}

@media (min-width: 768px) {
	.spot .spotText {
		margin-top: 24px;
	}
}

.spot .spotData {
	padding: 16px 0 24px 0;
}

@media (min-width: 576px) {
	.spot .spotData {
		order: 1;
		padding: 24px 0;
	}
}

@media (min-width: 922px) {
	.spot .spotData {
		padding: 40px 0 32px 0;
	}
}

.spot .spotDataToggle {
	justify-self: center;
	margin-top: 16px;
}

@media (min-width: 576px) {
	.spot .spotDataToggle {
		grid-column: 1 / 3;
	}
	.spot:has(.spotLink) .spotDataToggle {
		grid-column: 1;
		justify-self: end;
	}
}

@media (min-width: 768px) {
	.spot .spotDataToggle {
		margin-top: 24px;
	}
}

@media (min-width: 922px) {
	.spot:has(.spotLink) .spotDataToggle {
		justify-self: end;
	}
}

@media (min-width: 1200px) {
	.spot:has(.spotLink) .spotDataToggle {
		grid-column: 2;
	}
}

.spot .spotLink {
	justify-self: center;
	margin-top: 16px;
}

@media (min-width: 576px) {
	.spot .spotLink {
		grid-column: 1 / 3;
	}
	.spot:has(.spotData) .spotLink {
		grid-column: 2;
		justify-self: start;
	}
}

@media (min-width: 768px) {
	.spot .spotLink {
		margin-top: 24px;
	}
}

@media (min-width: 922px) {
	.spot:has(.spotData) .spotLink {
		grid-column: 2;
		justify-self: start;
	}
}

@media (min-width: 1200px) {
	.spot:has(.spotData) .spotLink {
		grid-column: 3;
	}
}

.spot .spotSns {
	margin-top: 24px;
}

@media (min-width: 576px) {
	.spot .spotSns {
		order: 1;
	}
}

@media (min-width: 768px) {
	.spot .spotSns {
		margin-top: 32px;
	}
}

@media (min-width: 922px) {
	.spot:has(figure) {
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto auto 1fr;
	}
	.spot:has(figure) .spotName,
	.spot:has(figure) .spotLead,
	.spot:has(figure) .spotData,
	.spot:has(figure) .spotSns {
		grid-column: 1 / 3;
	}
	.spot:has(figure) .spotPhoto {
		grid-column: 1;
	}
	.spot:has(figure) .spotText {
		grid-column: 2;
	}
}

@media (min-width: 1200px) {
	.spot:has(figure) {
		grid-template-columns: auto 1fr 1fr;
	}
	.spot:has(figure) .spotName,
	.spot:has(figure) .spotLead {
		grid-column: 1 / 4;
	}
	.spot:has(figure) .spotPhoto {
		grid-row: 3 / 5;
		margin-right: 32px;
	}
	.spot:has(figure) .spotText,
	.spot:has(figure) .spotData,
	.spot:has(figure) .spotDataToggle,
	.spot:has(figure) .spotLink {
		grid-column: 2 / 4;
	}
	.spot:has(figure) .spotData {
		order: 2;
	}
	.spot:has(figure) .spotSns {
		grid-column: 1;
		justify-self: start;
		align-self: end;
	}
}

.spotNumber {
	display: grid;
	align-content: center;
	grid-gap: 8px;
	aspect-ratio: 1;
	width: 88px;
	padding-top: 8px;
	background: var(--color-theme) url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56 56" fill="white"><path d="M22.26,27.21c-.28,0-.5.23-.5.5s.22.5.5.5.5-.22.5-.5-.23-.5-.5-.5ZM25.26,27.21c-.28,0-.5.23-.5.5s.22.5.5.5.5-.22.5-.5-.23-.5-.5-.5ZM34.26,27.21c-.28,0-.5.23-.5.5s.22.5.5.5.5-.22.5-.5-.23-.5-.5-.5ZM28.26,27.21c-.28,0-.5.23-.5.5s.22.5.5.5.5-.22.5-.5-.23-.5-.5-.5ZM31.26,27.21c-.28,0-.5.23-.5.5s.22.5.5.5.5-.22.5-.5-.23-.5-.5-.5Z"/></svg>') center no-repeat;
	background-size: contain;
	-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56 56"><path d="M55.37,36.01c-.37,1.26-2.54,1.84-3.08,3.01-.55,1.19.43,3.21-.28,4.3-.44.68-1.49.92-2.42,1.24-.55.19-1.07.42-1.39.78-.85.98-.49,3.2-1.48,4.05-.98.85-3.12.17-4.22.87-1.09.7-1.36,2.93-2.55,3.47-1.18.53-3.03-.72-4.29-.36-.28.08-.55.25-.8.47-.87.73-1.63,1.99-2.63,2.13-1.27.18-2.7-1.55-4.02-1.55-1.32,0-2.75,1.72-4.03,1.54-1-.14-1.76-1.4-2.62-2.14-.25-.22-.52-.39-.8-.47-1.26-.37-3.12.88-4.3.34-1.19-.55-1.45-2.78-2.54-3.48-1.1-.71-3.24-.03-4.22-.89-.98-.85-.61-3.07-1.46-4.05-.32-.37-.83-.59-1.39-.78-.93-.33-1.97-.57-2.41-1.25-.7-1.09.28-3.11-.26-4.3-.54-1.18-2.71-1.76-3.07-3.02-.36-1.24,1.15-2.9.97-4.2C1.91,30.45,0,29.27,0,27.95,0,26.63,1.92,25.46,2.1,24.19c.19-1.3-1.32-2.97-.95-4.2.37-1.26,2.54-1.84,3.08-3.01.55-1.19-.43-3.21.28-4.3.71-1.1,2.95-1.04,3.81-2.02.85-.98.49-3.19,1.48-4.05.98-.85,3.12-.17,4.22-.87,1.09-.7,1.36-2.93,2.55-3.47,1.18-.54,3.04.72,4.29.35,1.24-.36,2.13-2.42,3.43-2.61,1.27-.18,2.7,1.55,4.02,1.56,1.32,0,2.76-1.73,4.03-1.54,1.3.19,2.19,2.25,3.42,2.62,1.26.37,3.12-.88,4.3-.34,1.19.55,1.45,2.78,2.54,3.48,1.1.71,3.23.03,4.21.88.98.86.61,3.07,1.46,4.06.85.98,3.09.93,3.8,2.03.7,1.09-.28,3.11.27,4.3.53,1.18,2.7,1.76,3.07,3.03.36,1.24-1.15,2.9-.97,4.2.18,1.27,2.09,2.45,2.09,3.77,0,1.32-1.92,2.49-2.11,3.76-.19,1.3,1.32,2.96.95,4.2Z"/></svg>') center no-repeat;
	-webkit-mask-size: contain;
	color: #fff;
	font-size: 28px;
	font-family: kiro, sans-serif;
	line-height: 1;
	text-align: center;
}

.spotNumber:before {
	content: "SPOT";
	font-size: 18px;
	letter-spacing: 0.12em;
}

.spotName {
	font-weight: 700;
	font-size: 20px;
	letter-spacing: 0.08em;
}

@media (min-width: 922px) {
	.spotName {
		font-size: 28px;
	}
}

.spotLead {
	color: #5ab6b6;
	font-weight: 700;
	letter-spacing: 0.05em;
}

@media (min-width: 922px) {
	.spotLead {
		font-size: 18px;
	}
}

.spotPhoto img {
	aspect-ratio: 1 / 0.667;
	object-fit: cover;
}

.spotText .fr-view {
	letter-spacing: 0.02em;
}

.spotText .limit {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 10;
	max-height: calc(1.65em * 10);
	overflow: hidden;
}

.spotData {
	justify-self: center;
	width: min(100%, 600px);
}

.spotData dl {
	display: grid;
	border: solid #5ab6b6;
	border-width: 2px 0;
}

.spotData dt {
	padding-top: 16px;
	color: #5ab6b6;
	font-weight: 700;
}

.spotData dd + dt {
	border-top: 1px solid var(--color-border);
}

.spotData dd {
	padding-bottom: 16px;
}

.spotDataToggle {
	all: unset;
	display: grid;
	grid-template-columns: 1fr 20px;
	grid-gap: 8px;
	align-items: center;
	width: min(100%, 280px);
	min-height: 48px;
	padding: 4px 10px 4px 24px;
	background: #5ab6b6;
	border-radius: 24px;
	color: #fff;
	letter-spacing: 0.05em;
	text-align: center;
	text-decoration: none;
	box-sizing: border-box;
	cursor: pointer;
	position: relative;
}

.spotDataToggle: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 20 20"><path d="M5.83,8.25c0-.17.07-.35.2-.48.26-.26.69-.26.95,0l3.02,3.02,3.02-3.02c.26-.26.69-.26.95,0,.26.26.26.69,0,.95l-3.5,3.5c-.26.26-.69.26-.95,0l-3.5-3.5c-.13-.13-.2-.3-.2-.48Z"/></svg>') center no-repeat;
	-webkit-mask-size: contain;
}

.spotDataToggle.open:after {
	transform: scale(1, -1);
}

.spotLink {
	width: min(100%, 280px);
}

.spotLink a {
	display: grid;
	grid-template-columns: 1fr 24px;
	grid-gap: 8px;
	align-items: center;
	min-height: 48px;
	padding: 4px 10px 4px 24px;
	border-radius: 24px;
	border: 1px solid currentColor;
	color: inherit;
	letter-spacing: 0.05em;
	text-align: center;
	text-decoration: none;
	position: relative;
}

.spotLink a:before {
	content: "";
	grid-column: 2;
	grid-row: 1;
	aspect-ratio: 1;
	background: #5ab6b6;
	border-radius: 100%;
}

.spotLink a:after {
	content: "";
	grid-column: 2;
	grid-row: 1;
	aspect-ratio: 1;
	background: #fff;
	-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="M17.81,11.4l-4.38-4.38c-.33-.33-.86-.33-1.19,0-.33.33-.33.86,0,1.19l2.79,2.79H6.93c-.55,0-.99.45-.99.99s.44.99.99.99h8.1l-2.79,2.79c-.33.33-.33.86,0,1.19.16.16.38.25.6.25s.43-.08.6-.25l4.38-4.38c.33-.33.33-.86,0-1.19Z"/></svg>') center no-repeat;
	-webkit-mask-size: contain;
}

.spotSns {
	margin-top: 16px;
	justify-self: center;
}

.spotSns ul {
	display: flex;
	grid-gap: 8px;
}

.spotSns a {
	display: grid;
	aspect-ratio: 1;
	width: 48px;
	background: currentColor;
	font-size: 0;
	-webkit-mask-position: center;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 40px;
}

.spotSns 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 40 40"><path d="M20,12.3c-4.25,0-7.7,3.45-7.7,7.7s3.45,7.7,7.7,7.7,7.7-3.45,7.7-7.7-3.45-7.7-7.7-7.7ZM20,25c-2.76,0-5-2.24-5-5s2.24-5,5-5,5,2.24,5,5-2.24,5-5,5ZM28.01,10.19c-.99,0-1.8.81-1.8,1.8s.81,1.8,1.8,1.8,1.8-.81,1.8-1.8-.81-1.8-1.8-1.8ZM34.91,13.82c-.07-1.6-.33-2.69-.7-3.64-.38-.99-.9-1.82-1.73-2.66-.83-.83-1.67-1.35-2.66-1.73-.95-.37-2.04-.62-3.64-.7-1.6-.07-2.11-.09-6.18-.09s-4.58.02-6.18.09c-1.6.07-2.69.33-3.64.7-.99.38-1.82.9-2.66,1.73-.83.83-1.35,1.67-1.73,2.66-.37.95-.62,2.04-.7,3.64-.07,1.6-.09,2.11-.09,6.18s.02,4.58.09,6.18c.07,1.6.33,2.69.7,3.64.38.99.9,1.82,1.73,2.66.83.83,1.67,1.35,2.66,1.73.95.37,2.04.62,3.64.7,1.6.07,2.11.09,6.18.09s4.58-.02,6.18-.09c1.6-.07,2.69-.33,3.64-.7.99-.38,1.82-.9,2.66-1.73s1.35-1.67,1.73-2.66c.37-.95.62-2.04.7-3.64.07-1.6.09-2.11.09-6.18s-.02-4.58-.09-6.18ZM32.21,26.06c-.07,1.46-.31,2.26-.52,2.79-.27.7-.6,1.2-1.12,1.72-.52.52-1.02.85-1.72,1.12-.53.21-1.32.45-2.79.52-1.58.07-2.06.09-6.06.09s-4.48-.02-6.06-.09c-1.46-.07-2.26-.31-2.79-.52-.7-.27-1.2-.6-1.72-1.12-.52-.52-.85-1.02-1.12-1.72-.21-.53-.45-1.32-.52-2.79-.07-1.58-.09-2.06-.09-6.06s.02-4.48.09-6.06c.07-1.46.31-2.26.52-2.79.27-.7.6-1.2,1.12-1.72.52-.52,1.02-.85,1.72-1.12.53-.21,1.32-.45,2.79-.52,1.58-.07,2.06-.09,6.06-.09s4.48.02,6.06.09c1.46.07,2.26.31,2.79.52.7.27,1.2.6,1.72,1.12.52.52.85,1.02,1.12,1.72.21.53.45,1.32.52,2.79.07,1.58.09,2.06.09,6.06s-.02,4.48-.09,6.06Z"/></svg>');
}

.spotSns a[href*="instagram.com"]:before,
.spotSns a[href*="instagram.com"]:after {
	position: absolute;
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.spotSns a[href*="instagram.com"]:before {
	background: -webkit-linear-gradient(45deg, transparent 50%, #d300c5) no-repeat;
}

.spotSns a[href*="instagram.com"]:after {
	background: -webkit-linear-gradient(-135deg, transparent 55%, #ff7a00 65%, #ffd600) no-repeat;
}

.spotSns a[href*="google.co.jp"] {
	background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40"><path d="M20,3.74c-4.44,0-8.06,3.61-8.06,8.06,0,1.21.5,2.8,1.21,4.61.71,1.82,1.65,3.83,2.59,5.71,1.88,3.76,3.76,7,3.76,7,.1.18.29.29.5.29s.39-.11.5-.29c0,0,1.88-3.24,3.76-7,.94-1.88,1.88-3.89,2.59-5.71.71-1.82,1.21-3.41,1.21-4.61,0-4.44-3.61-8.06-8.06-8.06ZM20,17.06c-2.82,0-5.11-2.29-5.11-5.11,0-1.35.54-2.65,1.5-3.61.96-.96,2.26-1.5,3.61-1.5,2.82,0,5.11,2.29,5.11,5.11s-2.29,5.11-5.11,5.11Z"/><path fill="gray" d="M23.61,26.32c-1.11,2.05-1.93,3.48-1.93,3.48-.72,1.23-2.64,1.23-3.36,0,0,0-.83-1.43-1.94-3.49-6.23.55-10.57,2.46-10.57,4.63,0,1.27,1.49,2.49,4.16,3.39,2.66.9,6.27,1.4,10.03,1.4,7.84,0,14.19-2.15,14.19-4.79,0-2.17-4.35-4.07-10.57-4.63Z"/></svg>') center no-repeat;
	background-size: 40px;
}

.spotSns a[href*="google.co.jp"] {
	background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40"><path d="M20,3.74c-4.44,0-8.06,3.61-8.06,8.06,0,1.21.5,2.8,1.21,4.61.71,1.82,1.65,3.83,2.59,5.71,1.88,3.76,3.76,7,3.76,7,.1.18.29.29.5.29s.39-.11.5-.29c0,0,1.88-3.24,3.76-7,.94-1.88,1.88-3.89,2.59-5.71.71-1.82,1.21-3.41,1.21-4.61,0-4.44-3.61-8.06-8.06-8.06ZM20,17.06c-2.82,0-5.11-2.29-5.11-5.11,0-1.35.54-2.65,1.5-3.61.96-.96,2.26-1.5,3.61-1.5,2.82,0,5.11,2.29,5.11,5.11s-2.29,5.11-5.11,5.11Z"/><path fill="gray" d="M23.61,26.32c-1.11,2.05-1.93,3.48-1.93,3.48-.72,1.23-2.64,1.23-3.36,0,0,0-.83-1.43-1.94-3.49-6.23.55-10.57,2.46-10.57,4.63,0,1.27,1.49,2.49,4.16,3.39,2.66.9,6.27,1.4,10.03,1.4,7.84,0,14.19-2.15,14.19-4.79,0-2.17-4.35-4.07-10.57-4.63Z"/></svg>') center no-repeat;
	background-size: 40px;
}

.spotSns a[href*="google.com"] {
	background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40"><path d="M20,3.74c-4.44,0-8.06,3.61-8.06,8.06,0,1.21.5,2.8,1.21,4.61.71,1.82,1.65,3.83,2.59,5.71,1.88,3.76,3.76,7,3.76,7,.1.18.29.29.5.29s.39-.11.5-.29c0,0,1.88-3.24,3.76-7,.94-1.88,1.88-3.89,2.59-5.71.71-1.82,1.21-3.41,1.21-4.61,0-4.44-3.61-8.06-8.06-8.06ZM20,17.06c-2.82,0-5.11-2.29-5.11-5.11,0-1.35.54-2.65,1.5-3.61.96-.96,2.26-1.5,3.61-1.5,2.82,0,5.11,2.29,5.11,5.11s-2.29,5.11-5.11,5.11Z"/><path fill="gray" d="M23.61,26.32c-1.11,2.05-1.93,3.48-1.93,3.48-.72,1.23-2.64,1.23-3.36,0,0,0-.83-1.43-1.94-3.49-6.23.55-10.57,2.46-10.57,4.63,0,1.27,1.49,2.49,4.16,3.39,2.66.9,6.27,1.4,10.03,1.4,7.84,0,14.19-2.15,14.19-4.79,0-2.17-4.35-4.07-10.57-4.63Z"/></svg>') center no-repeat;
	background-size: 40px;
}

.spotSns 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 40 40"><path d="M34.96,18.88c-.55-7.76-7.24-14.27-15.75-13.87-8.03.38-14.47,7.41-14.2,15.5.28,8.58,7.11,13.92,12.66,14.48v-10.49h-3.79l-.02-4.37h.71s2.03,0,3.11,0v-.62c0-1.09-.04-2.17.02-3.25.11-2.24,1.01-4.02,3.18-4.9,1.81-.74,5.7-.32,5.7-.32v3.87s-1.72.1-2.46.17c-.96.09-1.59.61-1.69,1.6,0,1.2-.03,3.47-.03,3.47h4.1l-.57,4.26s-2.52.08-3.53.08v10.51c6.25-.81,13.22-6.82,12.56-16.12Z"/></svg>');
}

.spotSns 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 40 40"><path d="M22.42,18.01h0l9.47-11.01h-2.24l-8.22,9.56-6.57-9.56h-7.58l9.93,14.46-9.93,11.54h2.24l8.68-10.09,6.94,10.09h7.58l-10.3-14.99ZM19.35,21.58h0s-1.01-1.44-1.01-1.44l-8.01-11.45h3.45l6.46,9.24,1.01,1.44,8.4,12.01h-3.45l-6.85-9.8Z"/></svg>');
}




