@charset "UTF-8";

/* ============================================================
   つくろう、未来の笑顔。 東京ディズニーリゾート® 紹介ページ
   ------------------------------------------------------------
   1. Theme（ページ共通の色・フォントのみ変数化）
   2. Base / Layout
   3. KV
   4. Intro
   5. Park banner（TDL / TDS）
   6. Facility panel
   7. Slideshow
   8. Sub block（仲間たち / ヒント）
   9. CTA / Top button
   10. Animation（セクションフェードイン）
   11. Custom cursor（アンティーク調・任意適用）
   12. Responsive（SP 〜959px / PC 960px〜）
   ============================================================ */

/* ----- 1. Theme ----- */
.sfd {
	--sfd-page-bg: #fffcf9;
	--sfd-band-bg: #faf1e7;
	--sfd-panel-bg: #fffdf9;
	--sfd-panel-border: #fbf4e8;
	--sfd-gold: #c9a75c;
	--sfd-gold-dark: #a4813a;
	--sfd-gold-light: #ffc247;
	--sfd-text: #333;
	--sfd-font-jp: "Noto Sans JP", sans-serif;
	--sfd-font-en: Georgia, "Times New Roman", "Noto Serif JP", serif;
}

/* ----- 2. Base / Layout ----- */
.sfd {
	background-color: var(--sfd-page-bg);
	color: var(--sfd-text);
	font-family: var(--sfd-font-jp);
	overflow-x: hidden;
}

.sfd__inner {
	width: 100%;
	max-width: 1240px;
	margin-inline: auto;
	padding-inline: 43px;
	box-sizing: border-box;
}

.sfd img {
	max-width: 100%;
	height: auto;
}

.sfd sup {
	font-size: 0.6em;
	font-weight: 400;
	vertical-align: super;
}

:is(a[href], button, summary, [tabindex="0"]):focus-visible {
	outline: 3px solid #025fcc;
	outline-offset: 2px;
	border-radius: 5px;
}

.sfd-pc-only {
	display: block;
}

.sfd-sp-only {
	display: none;
}

@media screen and (max-width: 959px) {
	.sfd-pc-only {
		display: none;
	}

	.sfd-sp-only {
		display: block;
	}
}

/* ----- 3. KV ----- */
.sfd-kv {
	background: linear-gradient(180deg, #1c90eb 0%, #f4e7b6 100%);
}

.sfd-kv__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 100px;
	width: 100%;
	max-width: 1260px;
	margin-inline: auto;
	padding: 61px 28px 60px 14px;
	box-sizing: border-box;
}

.sfd-kv__logo {
	flex: 0 1 560px;
	margin: 0;
}

.sfd-kv__logo img {
	display: block;
	width: 103%;
	height: auto;
}

.sfd-kv__photo {
	position: relative;
	flex: 0 0 auto;
	width: 560px;
	margin: 0;
}

.sfd-kv__photo picture,
.sfd-kv__photo img {
	display: block;
	width: 100%;
	height: auto;
}

.sfd-kv__photo img {
	border-radius: 20px;
	box-shadow: 8px 8px 20px rgba(0, 0, 0, 0.25);
}

/* ----- 4. Intro ----- */
.sfd-intro {
	padding: 108px 0 116px;
}

.sfd-intro__lead {
	margin: 0 0 51px;
	font-size: 18px;
	line-height: 2;
	letter-spacing: 0.05em;
	text-align: center;
}

.sfd-intro__nav {
	box-sizing: border-box;
	width: 880px;
	max-width: 100%;
	min-height: 100px;
	margin-inline: auto;
	padding: 27px 40px;
	background: url(/tsunagu/smilefuture/tdr/images/nav-frame.png) center / 100% 100% no-repeat;
	transform: translateX(-17px);
}

.sfd-intro__list {
	display: flex;
	justify-content: center;
	gap: 48px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sfd-intro__link {
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 8px 10px;
	color: var(--sfd-text);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.6;
	text-decoration: none;
	letter-spacing: 0.05em;
}

.sfd-intro__link::after {
	content: "";
	flex: 0 0 auto;
	width: 20px;
	height: 32px;
	background: url(/tsunagu/smilefuture/tdr/images/icon-arrow.svg) center / contain no-repeat;
}

.sfd-intro__link:hover,
.sfd-intro__link:focus-visible {
	text-decoration: underline;
}

/* ----- 5. Park banner ----- */
.sfd-park {
	scroll-margin-top: 40px;
}

.sfd-park__banner {
	background: var(--sfd-park-banner-bg, linear-gradient(180deg, #faf1e7 0%, #ece6d3 100%));
}

.sfd-park--tdl {
	--sfd-park-banner-bg: linear-gradient(180deg, #faf1e7 0%, #ece6d3 100%);
	--sfd-park-body-bg-color: transparent;
	--sfd-park-body-bg-image: url(/tsunagu/smilefuture/tdr/images/tdl-bg.png);
	--sfd-park-arrow-prev: url(/tsunagu/smilefuture/tdr/images/arrow-prev.png);
	--sfd-park-arrow-next: url(/tsunagu/smilefuture/tdr/images/arrow-next.png);
	--sfd-facility-divider-bg: url(/tsunagu/smilefuture/tdr/images/divider.svg);
	--sfd-facility-cta-bg: url(/tsunagu/smilefuture/tdr/images/cta-bg.svg);
}

.sfd-park--tds {
	--sfd-park-banner-bg: #e0f2ff;
	--sfd-park-body-bg-color: #f9fdff;
	--sfd-park-body-bg-image: repeating-linear-gradient(
		90deg,
		#f9fdff 0,
		#f9fdff 27.4px,
		#ecf9ff 27.4px,
		#ecf9ff 54.8px
	);
	--sfd-park-arrow-prev: url(/tsunagu/smilefuture/tdr/images/arrow-prev-tds.png);
	--sfd-park-arrow-next: url(/tsunagu/smilefuture/tdr/images/arrow-next-tds.png);
	--sfd-facility-divider-bg: url(/tsunagu/smilefuture/tdr/images/divider-tds.png);
	--sfd-facility-cta-bg: url(/tsunagu/smilefuture/tdr/images/cta-bg-tds.png);
}

.sfd-park--tdl .sfd-park__body {
	background-repeat: repeat-y;
	background-size: 100% auto;
	background-position: top center;
}

.sfd-park--tds .sfd-park__body {
	background-size: auto;
	background-repeat: repeat;
}

.sfd-park__banner-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 80px;
	padding-block: 30px;
}

.sfd-park--tdl .sfd-park__banner-inner {
	padding-right: 136px;
}

.sfd-park__banner-inner--reverse {
	flex-direction: row-reverse;
}

.sfd-park--tds .sfd-park__banner-inner {
	gap: 40px;
	padding-left: 143px;
	padding-right: 59px;
}

.sfd-park__photo {
	flex: 0 0 auto;
	width: 400px;
	max-width: 45%;
	margin: 0;
}

.sfd-park__photo img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 25px;
	box-shadow: 4px 4px 16px rgba(0, 0, 0, 0.25);
}

.sfd-park--tds .sfd-park__photo {
	flex: 0 1 400px;
}

.sfd-park__logo {
	flex: 0 1 440px;
	margin: 0;
}

.sfd-park--tds .sfd-park__logo {
	flex: 0 1 auto;
	transform: translateX(-82px);
}

.sfd-park__logo img {
	display: block;
	width: 100%;
	height: auto;
}

.sfd-park__body {
	padding: 60px 0 119px;
	background-color: var(--sfd-park-body-bg-color, transparent);
	background-image: var(--sfd-park-body-bg-image, none);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.sfd-park__body-inner {
	display: flex;
	flex-direction: column;
	gap: 44px;
	max-width: 1000px;
	padding-inline: 0;
}

/* ----- 6. Facility panel ----- */
.sfd-facility {
	margin: 0;
}

.sfd-facility__panel {
	box-sizing: border-box;
	padding: 84px 92px 66px;
	background: var(--sfd-panel-bg);
	border: 8px solid var(--sfd-panel-border);
	border-radius: 16px;
	box-shadow: 4px 4px 16px rgba(0, 0, 0, 0.25);
}

.sfd-park--tdl .sfd-facility__panel {
	position: relative;
}

.sfd-park--tdl .sfd-facility__panel > * {
	position: relative;
	z-index: 2;
}

.sfd-park--tdl .sfd-facility:nth-child(2) .sfd-facility__panel::after {
	content: "";
	position: absolute;
	left: 0;;
	bottom: 0;
	z-index: 1;
	margin: auto;
	width: 100%;
	height: 26.5%;
	max-height: 720px;
	background-color: #FBF4E8;
	pointer-events: none;
}

.sfd-park--tds .sfd-facility__panel {
	border-color: #eaf6fe;
}

.sfd-facility__name {
	position: relative;
	max-width: 695px;
	margin: 32px auto 0;
	padding: 0;
	text-align: center;
}

.sfd-facility__title {
	margin: 0;
	font-size: 0;
	line-height: 0;
}

.sfd-facility__title img {
	display: block;
	width: 100%;
	height: auto;
}

.sfd-facility__desc {
	margin: 4px -80px 0;
	font-size: 18px;
	line-height: 2;
	letter-spacing: 0.05em;
	text-align: center;
}

.sfd-facility__divider {
	width: 480px;
	max-width: 100%;
	height: 55px;
	margin: 30px auto 0;
	background: var(--sfd-facility-divider-bg, url(/tsunagu/smilefuture/tdr/images/divider.svg)) center / contain no-repeat;
}

/* ----- 7. Slideshow ----- */
.sfd-slideshow {
	position: relative;
	margin-inline: auto;
}

.sfd-slideshow__viewport {
	overflow: hidden;
	border-radius: 16px;
}

.sfd-slideshow__track {
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;
	transition: transform 0.5s ease;
}

.sfd-slideshow.is-static .sfd-slideshow__track {
	transition: none;
}

.sfd-slideshow__slide {
	flex: 0 0 100%;
	min-width: 0;
}

.sfd-slideshow__slide img {
	display: block;
	width: 100%;
	aspect-ratio: 800 / 480;
	object-fit: cover;
}

.sfd-slideshow__arrow {
	position: absolute;
	top: 50%;
	width: 90px;
	height: 90px;
	margin: 7px 0 0;
	padding: 0;
	transform: translateY(-50%);
	background-color: transparent;
	background-position: center;
	background-size: 77px auto;
	background-repeat: no-repeat;
	border: 0;
	border-radius: 30%;
	cursor: pointer;
	appearance: none;
}

.sfd-slideshow__arrow--prev {
	left: -32px;
	background-image: var(--sfd-park-arrow-prev, url(/tsunagu/smilefuture/tdr/images/arrow-prev.png));
}

.sfd-slideshow__arrow--next {
	right: -48px;
	background-image: var(--sfd-park-arrow-next, url(/tsunagu/smilefuture/tdr/images/arrow-next.png));
}

.sfd-slideshow__controls {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 40px;
	margin-top: 20px;
}

.sfd-slideshow--cards .sfd-slideshow__controls {
	position: absolute;
	bottom: 8%;
	left: 50%;
	transform: translateX(-50%);
}

/* メイン写真スライド：プログレス / 再生停止を画像上に重ねる */
.sfd-slideshow:not(.sfd-slideshow--cards):not(.sfd-slideshow--hints) .sfd-slideshow__controls {
	position: absolute;
	left: 50%;
	bottom: 27px;
	z-index: 2;
	margin-top: 0;
	transform: translateX(-50%);
}

.sfd-slideshow:not(.sfd-slideshow--cards):not(.sfd-slideshow--hints) .sfd-slideshow__dot {
	background: #FFFFFF;
	border-color: transparent;
}

.sfd-slideshow:not(.sfd-slideshow--cards):not(.sfd-slideshow--hints) .sfd-slideshow__dot[aria-checked="true"] {
	background: var(--sfd-gold-light);
	border-color: #FBF4E8;
}

.sfd-park--tds .sfd-slideshow:not(.sfd-slideshow--cards):not(.sfd-slideshow--hints) .sfd-slideshow__dot[aria-checked="true"] {
	background: #4ca1da;
}

.sfd-slideshow--cards .sfd-slideshow__dot,
.sfd-slideshow--hints .sfd-slideshow__dot {
	background: #DDD3C0;
}

.sfd-slideshow--cards .sfd-slideshow__dot[aria-checked="true"],
.sfd-slideshow--hints .sfd-slideshow__dot[aria-checked="true"] {
	background: #D8B97A;
}

.sfd-slideshow__dots {
	display: flex;
	gap: 8px;
}

.sfd-slideshow__dot {
	width: 65px;
	height: 8px;
	padding: 0;
	background: #FFFFFF;
	border: 1px solid var(--sfd-panel-border);
	border-radius: 13px;
	cursor: pointer;
	appearance: none;
}

.sfd-slideshow__dot[aria-checked="true"] {
	background: var(--sfd-gold-light);
}

.sfd-slideshow__playback {
	width: 16px;
	height: 20px;
	padding: 0;
	background: url(/tsunagu/smilefuture/tdr/images/icon-pause.svg) center / contain no-repeat;
	border: 0;
	cursor: pointer;
	appearance: none;
}

.sfd-slideshow__playback.is-paused {
	position: relative;
	background-image: none;
}

.sfd-slideshow__playback.is-paused::before {
	content: "";
	position: absolute;
	inset: 0;
	margin: auto;
	width: 0;
	height: 0;
	border-left: 14px solid #FFC247;
	border-top: 9px solid transparent;
	border-bottom: 9px solid transparent;
}

.sfd-park--tds .sfd-slideshow:not(.sfd-slideshow--cards):not(.sfd-slideshow--hints) .sfd-slideshow__playback.is-paused::before {
	border-left-color: #4ca1da;
}

.sfd-facility__copyright {
	margin: 18px 0 0;
	text-align: right;
}

.sfd-facility__copyright img {
	display: inline-block;
	width: 80px;
	height: auto;
	vertical-align: top;
}

/* コントロール不要（1枚のみ）の場合 */
.sfd-slideshow.is-single .sfd-slideshow__arrow,
.sfd-slideshow.is-single .sfd-slideshow__controls {
	display: none;
}

/* ----- 8. Sub block ----- */
.sfd-subblock {
	margin-top: 60px;
	padding: 60px 40px 40px;
	border: 2px solid var(--sfd-gold);
	border-radius: 8px;
}

.sfd-subblock__head {
	margin: -90px auto 40px;
	padding: 14px 40px;
	width: fit-content;
	background: var(--sfd-panel-bg);
	border: 2px solid var(--sfd-gold);
	border-radius: 60px;
	text-align: center;
}

.sfd-subblock__lead {
	margin: 0;
	color: var(--sfd-gold-dark);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.6;
}

.sfd-subblock__title {
	margin: 0;
	font-size: 28px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.05em;
}

/* 仲間たち：見出し＋枠 一体画像（PC/SP 出し分け） */
.sfd-subblock--friends {
	position: relative;
	margin-top: 51px;
	padding: 0;
	overflow: visible;
	background: none;
	border: 0;
	border-radius: 0;
}

.sfd-subblock--friends .sfd-subblock__head {
	position: relative;
	top: auto;
	left: auto;
	z-index: 0;
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
	background: none;
	border: 0;
	border-radius: 0;
	transform: none;
}

.sfd-subblock--friends .sfd-subblock__title {
	font-size: 0;
	line-height: 0;
}

.sfd-subblock--friends .sfd-subblock__title img {
	display: block;
	width: 100%;
	height: auto;
}

.sfd-subblock--friends .sfd-slideshow__viewport {
	position: absolute;
	top: 34%;
	left: 50%;
	z-index: 1;
	width: 75%;
	margin: 0;
	padding-bottom: 10px;
	transform: translateX(-50%);
}

.sfd-subblock--friends .sfd-slideshow__arrow {
	top: 58%;
}

.sfd-subblock--friends .sfd-slideshow__arrow--prev {
	left: 1%;
}

.sfd-subblock--friends .sfd-slideshow__arrow--next {
	right: -1%;
}

/* 5つのヒント：見出し＋枠 一体画像（PC/SP 出し分け） */
.sfd-subblock--hints {
	position: relative;
	margin-top: 39px;
	padding: 0;
	overflow: visible;
	background: none;
	border: 0;
	border-radius: 0;
}

.sfd-subblock--hints .sfd-subblock__head {
	position: relative;
	top: auto;
	left: auto;
	z-index: 0;
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
	background: none;
	border: 0;
	border-radius: 0;
	transform: none;
}

.sfd-subblock--hints .sfd-subblock__title {
	font-size: 0;
	line-height: 0;
}

.sfd-subblock--hints .sfd-subblock__title img {
	display: block;
	width: 100%;
	height: auto;
}

.sfd-subblock--hints .sfd-slideshow__viewport {
	position: absolute;
	top: 36%;
	left: 50%;
	z-index: 1;
	width: 74%;
	margin: 12px 0 0;
	transform: translateX(-50%);
}

.sfd-subblock--hints .sfd-slideshow__arrow {
	top: 60.5%;
}

.sfd-subblock--hints .sfd-slideshow__arrow--prev {
	left: 1.5%;
}

.sfd-subblock--hints .sfd-slideshow__arrow--next {
	right: -1%;
}

.sfd-subblock--hints .sfd-hint__media {
	flex: 0 0 460px;
	max-width: 44%;
}

.sfd-subblock--hints .sfd-hint__media img {
	aspect-ratio: 460 / 360;
	border-radius: 17px;
}

.sfd-subblock--hints + .sfd-facility__action,
.sfd-slideshow--hints + .sfd-facility__action {
	margin-top: 78px;
}

.sfd-subblock--hints .sfd-slideshow__controls {
	position: absolute;
	bottom: 12%;
	left: 50%;
	transform: translateX(-50%);
}

.sfd-cards {
	display: flex;
	gap: 30px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sfd-card {
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	flex: 0 0 calc((100% - 61px) / 3);
	padding: 0 0 16px;
	background: var(--sfd-panel-bg);
	border-radius: 16px;
	box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.12);
	overflow: hidden;
}

.sfd-card__media {
	margin: 0;
}

.sfd-card__media img {
	display: block;
	width: 100%;
	aspect-ratio: 180 / 150;
	object-fit: cover;
	object-position: center;
}

.sfd-card__body {
	flex: 1 1 auto;
	padding: 10px 15px 0;
}

.sfd-card__name {
	margin: 0 0 9px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.4;
	text-align: center;
}

.sfd-card__text {
	margin: 0;
	font-size: 13px;
	line-height: 1.5;
}

.sfd-card__ornament,
.sfd-hint__ornament {
	display: block;
	width: 159px;
	height: 13px;
	margin: 13px auto 0;
	background: url(/tsunagu/smilefuture/tdr/images/card-ornament.svg) center / contain no-repeat;
	transform: scaleY(-1);
}

/* 最終ページの空き枠（PCの perView 埋め）。カード幅を明示して潰さない。SP は非表示＋JS除外 */
.sfd-cards > .sfd-slideshow__slide--spacer {
	flex: 0 0 calc((100% - 61px) / 3);
	width: calc((100% - 61px) / 3);
	min-width: calc((100% - 61px) / 3);
	max-width: calc((100% - 61px) / 3);
	visibility: hidden;
	pointer-events: none;
	background: transparent;
	box-shadow: none;
	overflow: hidden;
}

/* ヒント（写真 + テキストの横並びカード） */
.sfd-hint {
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap;
	gap: 0 40px;
	align-items: center;
	padding: 44px 38px 18px;
	background: var(--sfd-panel-bg);
	border-radius: 14px;
	box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.12);
}

.sfd-hint__media {
	flex: 0 0 230px;
	margin: 0;
}

.sfd-hint__media img {
	display: block;
	width: 100%;
	aspect-ratio: 230 / 180;
	object-fit: cover;
	border-radius: 8px;
}

.sfd-hint__text {
	flex: 1;
	min-width: 0;
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
}

.sfd-hint__ornament {
	flex: 1 0 100%;
}

/* ----- 9. CTA / Top button ----- */
.sfd-facility__action {
	margin: 40px 0 0;
	text-align: center;
}

.sfd-facility__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	box-sizing: border-box;
	width: 440px;
	max-width: 100%;
	min-height: 48px;
	padding: 8px 24px;
	background: var(--sfd-facility-cta-bg, url(/tsunagu/smilefuture/tdr/images/cta-bg.svg)) center / 100% 100% no-repeat;
	color: #fffdf9;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.4;
	text-align: center;
	text-decoration: none;
}

.sfd-facility__cta-text {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
}

.sfd-facility__cta-label {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.4;
}

.sfd-facility__cta-note {
	font-size: 11px;
	font-weight: 500;
	line-height: 1.4;
}

.sfd-facility__cta::after {
	content: "";
	flex: 0 0 auto;
	width: 24px;
	height: 24px;
	background: url(/tsunagu/smilefuture/tdr/images/icon-external.svg) center / contain no-repeat;
	transform: translateX(7px);
}


.sfd-facility__cta:hover,
.sfd-facility__cta:focus-visible {
	opacity: 0.85;
}

.sfd-top {
	padding: 61px 0 60px;
	text-align: center;
	background: #e60012;
}

.sfd-top__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 420px;
	max-width: 100%;
	min-height: 80px;
	padding: 12px 30px;
	background: transparent;
	border: 2px solid #fff;
	border-radius: 40px;
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: 0.16em;
	text-decoration: none;
}

.sfd-top__btn:hover,
.sfd-top__btn:focus-visible {
	opacity: 0.85;
}

/* ----- 10. Animation ----- */
[data-sfd-fade] {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 0.25s ease-out, transform 0.25s ease-out;
}

[data-sfd-fade].is-visible {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	[data-sfd-fade] {
		opacity: 1;
		transform: none;
		transition: none;
	}

	.sfd-slideshow__track {
		transition: none;
	}
}

/* ----- 11. Custom cursor -----
   アンティーク調カーソル（矢印先端が左上向き。intro 用 icon-arrow とは別アセット）。
   ポインタ操作端末のみ適用。キーボード操作・フォーカス表示には影響しない。
   取り下げる場合は本ブロックのみ削除する。 */
@media (hover: hover) and (pointer: fine) {
	.sfd,
	.sfd a,
	.sfd button {
		cursor: url(/tsunagu/smilefuture/tdr/images/icon-cursor.png) 4 4, auto;
	}
}

/* ----- 12. Responsive ----- */
@media screen and (min-width: 960px) {
	.sfd-kv__photo {
		max-width: 50%;
	}
}

@media screen and (max-width: 959px) {
	/* SP デザイン幅 375px 基準。ビューポートに比例スケール（〜430px で上限） */
	.sfd {
		--sfd-sp: min(100vw, 430px);
	}

	.sfd__inner {
		padding-inline: calc(20 / 375 * var(--sfd-sp));
	}

	/* KV */
	.sfd-kv {
		background: linear-gradient(180deg, #f4e7b6 0%, #1c90eb 100%);
	}

	.sfd-kv__inner {
		flex-direction: column;
		gap: calc(39 / 375 * var(--sfd-sp));
		padding: 10.66666667vw 4vw 4vw;
	}

	.sfd-kv__logo {
		flex: none;
		width: 74.66666667vw;
	}

	.sfd-kv__photo {
		width: 100%;
	}

	.sfd-kv__photo img {
		border-radius: 5.31914894vw;
	}


	/* Intro */
	.sfd-intro {
		padding: 67px 0 78px;
	}

	.sfd-intro__lead {
		margin-bottom: calc(30 / 375 * var(--sfd-sp));
		font-size: calc(18 / 375 * var(--sfd-sp));
		line-height: 2;
	}

	.sfd-intro__nav {
		width: calc(315 / 375 * var(--sfd-sp));
		min-height: calc(240 / 375 * var(--sfd-sp));
		padding: calc(73 / 375 * var(--sfd-sp)) calc(47 / 375 * var(--sfd-sp)) calc(73 / 375 * var(--sfd-sp)) calc(49 / 375 * var(--sfd-sp));
		background-image: url(/tsunagu/smilefuture/tdr/images/nav-frame-sp.png);
		background-size: 100% 100%;
		transform: translateX(0);
	}

	.sfd-intro__list {
		flex-direction: column;
		gap: calc(30 / 375 * var(--sfd-sp));
	}

	.sfd-intro__link {
		justify-content: space-between;
		gap: calc(16 / 375 * var(--sfd-sp));
		padding: 0;
		font-size: calc(16 / 375 * var(--sfd-sp));
	}

	.sfd-intro__link::after {
		width: calc(20 / 375 * var(--sfd-sp));
		height: calc(32 / 375 * var(--sfd-sp));
		background-size: contain;
	}

	/* Park banner */
	.sfd-park__banner-inner,
	.sfd-park__banner-inner--reverse {
		gap: 10.66666667vw;
		padding-block: calc(36 / 375 * var(--sfd-sp));
	}

	.sfd-park__banner-inner {
		flex-direction: column-reverse;
	}

	.sfd-park--tdl .sfd-park__banner-inner {
		flex-direction: column-reverse;
		gap: 10.66666667vw;
		padding: 11.2vw 4vw 5.33333333vw;
	}

	.sfd-park__banner-inner--reverse {
		flex-direction: column-reverse;
	}

	.sfd-park__photo {
		width: 100vw;
		max-width: 100%;
	}

	.sfd-park__photo img {
		border-radius: 5.31914894vw;
	}

	.sfd-park__logo {
		flex: none;
		width: 64vw;
		max-width: 70%;
		transform: none;
	}

	.sfd-park--tds .sfd-park__logo {
		transform: none;
	}

	.sfd-park__body {
		padding: 6.66666667vw 2.93333333vw 22vw;
	}

	.sfd-park__body-inner {
		gap: calc(40 / 375 * var(--sfd-sp));
	}

	.sfd-park--tdl {
		--sfd-facility-cta-bg: url(/tsunagu/smilefuture/tdr/images/cta-bg-sp.svg);
	}

	.sfd-park--tds {
		--sfd-park-body-bg-image: repeating-linear-gradient(
			90deg,
			#f9fdff 0,
			#f9fdff 27.4px,
			#ecf9ff 27.4px,
			#ecf9ff 54.8px
		);
		--sfd-facility-cta-bg: url(/tsunagu/smilefuture/tdr/images/cta-bg-tds-sp.svg);
	}

	.sfd-park--tdl .sfd-facility:nth-child(2) .sfd-facility__panel::after {
		max-height: 29%;
	}

	/* Facility */
	.sfd-facility__panel {
		padding: 5.86666667vw 5.86666667vw 5.33333333vw;
		border-width: calc(4 / 375 * var(--sfd-sp));
	}

	.sfd-facility__name {
		max-width: 100%;
		margin-top: calc(43 / 375 * var(--sfd-sp));
		padding: 0;
	}

	.sfd-facility__desc {
		margin: 8vw -4vw 0;
		font-size: calc(16 / 375 * var(--sfd-sp));
		text-align: left;
		text-align: center;
		line-height: 1.8;
		letter-spacing: 0;
	}

	.sfd-facility__divider {
		width: 100%;
		height: calc(32 / 375 * var(--sfd-sp));
		margin-top: calc(32 / 375 * var(--sfd-sp));
	}

	.sfd-hungry-bear .sfd-slideshow:not(.sfd-slideshow--cards):not(.sfd-slideshow--hints) .sfd-slideshow__controls {
		margin-top: calc(16 / 375 * var(--sfd-sp));
	}

	.sfd-facility__cta {
		width: 100%;
		gap: calc(12 / 375 * var(--sfd-sp));
		padding: calc(10 / 375 * var(--sfd-sp)) calc(16 / 375 * var(--sfd-sp));
		font-size: calc(16 / 375 * var(--sfd-sp));
		text-align: center;
	}

	.sfd-facility__cta-label {
		font-size: calc(16 / 375 * var(--sfd-sp));
	}

	.sfd-facility__cta-note {
		font-size: calc(10 / 375 * var(--sfd-sp));
		padding-left: 1em;
		text-align: left;
		text-indent: -1em;
	}

	.sfd-facility__cta::after {
		transform: translateX(2px);
	}

  .sfd-facility__action {
		margin-top: 8vw;
	}

	/* Slideshow */
	.sfd-slideshow__slide img {
		aspect-ratio: 265 / 159;
	}

	.sfd-card__media img {
		aspect-ratio: 180 / 150;
	}

	.sfd-hint__media img {
		aspect-ratio: 180 / 141;
	}

	.sfd-slideshow__arrow {
		width: calc(40 / 375 * var(--sfd-sp));
		height: calc(40 / 375 * var(--sfd-sp));
		background-size: cover;
		top: 45%;
	}

	.sfd-slideshow__arrow--prev {
		left: calc(-17 / 375 * var(--sfd-sp));
	}

	.sfd-slideshow__arrow--next {
		right: calc(-25 / 375 * var(--sfd-sp));
	}

	.sfd-slideshow__controls {
		margin: calc(13 / 375 * var(--sfd-sp)) 0 0;
		gap: 20px;
		width: 100%;
		box-sizing: border-box;
		padding-inline: calc(12 / 375 * var(--sfd-sp));
	}

	.sfd-slideshow--cards .sfd-slideshow__controls {
		position: static;
		transform: none;
	}

	.sfd-slideshow:not(.sfd-slideshow--cards):not(.sfd-slideshow--hints) {
		margin-bottom: calc(36 / 375 * var(--sfd-sp));
	}

	.sfd-slideshow:not(.sfd-slideshow--cards):not(.sfd-slideshow--hints) .sfd-slideshow__controls {
		top: 100%;
		bottom: auto;
		margin-top: calc(16 / 375 * var(--sfd-sp));
		margin-bottom: 0;
		margin-left: 0;
		margin-right: 0;
		width: calc(100% - 24 / 375 * var(--sfd-sp));
		max-width: 100%;
		padding-inline: 0;
	}

	.sfd-slideshow__dots {
		flex: 1 1 auto;
		min-width: 0;
		width: 100%;
		gap: calc(4 / 375 * var(--sfd-sp));
	}

	.sfd-slideshow__dot {
		flex: 1 1 0;
		width: auto;
		min-width: 0;
		height: calc(10 / 375 * var(--sfd-sp));
	}

	.sfd-slideshow__playback {
		flex: 0 0 auto;
		background-image: none;
		background-color: var(--sfd-gold-light);
		-webkit-mask: url(/tsunagu/smilefuture/tdr/images/icon-pause.svg) center / contain no-repeat;
		mask: url(/tsunagu/smilefuture/tdr/images/icon-pause.svg) center / contain no-repeat;
	}

	.sfd-slideshow__playback.is-paused {
		background-color: transparent;
		-webkit-mask: none;
		mask: none;
	}

	.sfd-slideshow__playback.is-paused::before {
		border-left-color: var(--sfd-gold-light);
	}

	.sfd-park--tds .sfd-slideshow:not(.sfd-slideshow--cards):not(.sfd-slideshow--hints) .sfd-slideshow__playback {
		background-color: #4ca1da;
	}

	.sfd-park--tds .sfd-slideshow:not(.sfd-slideshow--cards):not(.sfd-slideshow--hints) .sfd-slideshow__playback.is-paused {
		background-color: transparent;
	}

	.sfd-slideshow:not(.sfd-slideshow--cards):not(.sfd-slideshow--hints) .sfd-slideshow__dot {
		background: #E2E2E2;
	}

	/* Sub block */
	.sfd-subblock {
		margin-top: calc(36 / 375 * var(--sfd-sp));
		padding: calc(46 / 375 * var(--sfd-sp)) calc(16 / 375 * var(--sfd-sp)) calc(24 / 375 * var(--sfd-sp));
	}

	.sfd-subblock__head {
		margin: calc(-70 / 375 * var(--sfd-sp)) auto calc(24 / 375 * var(--sfd-sp));
		padding: calc(10 / 375 * var(--sfd-sp)) calc(20 / 375 * var(--sfd-sp));
	}

	.sfd-subblock__lead {
		font-size: calc(11 / 375 * var(--sfd-sp));
	}

	.sfd-subblock__title {
		font-size: calc(20 / 375 * var(--sfd-sp));
	}

	.sfd-subblock--friends {
		position: relative;
		margin-top: calc(53 / 375 * var(--sfd-sp));
		padding: 0;
		background: none;
		overflow: visible;
	}

	.sfd-subblock--friends .sfd-subblock__head {
		position: relative;
		top: auto;
		left: 50%;
		z-index: 0;
		width: 70.33333333vw;
		max-width: none;
		margin: 0;
		padding: 0;
		transform: translateX(-50%);
	}

	.sfd-subblock--friends .sfd-subblock__title picture,
	.sfd-subblock--friends .sfd-subblock__title img {
		display: block;
		width: 70.33333333vw;
		height: 138.866667vw;
		max-width: none;
	}

	.sfd-subblock--friends .sfd-slideshow__viewport {
		position: absolute;
		top: 36vw;
		left: 50%;
		z-index: 1;
		width: 48vw;
		margin: 0;
		padding-bottom: 10px;
		transform: translateX(-50%);
	}

	.sfd-subblock--friends .sfd-slideshow__arrow {
		top: 40%;
	}

	.sfd-subblock--friends .sfd-slideshow__arrow--prev {
		left: 9px;
	}

	.sfd-subblock--friends .sfd-slideshow__arrow--next {
		right: -1px;
	}

	.sfd-subblock--hints {
		position: relative;
		margin-top: calc(44 / 375 * var(--sfd-sp));
		padding: 0;
		background: none;
		overflow: visible;
	}

	.sfd-subblock--hints .sfd-subblock__head {
		position: relative;
		top: auto;
		left: 50%;
		z-index: 0;
		width: 70.33333333vw;
		max-width: none;
		margin: 0;
		padding: 0;
		transform: translateX(-50%);
	}

	.sfd-subblock--hints .sfd-subblock__title picture,
	.sfd-subblock--hints .sfd-subblock__title img {
		display: block;
		width: 70.33333333vw;
		height: 145.86666667vw;
		max-width: none;
	}

	.sfd-subblock--hints .sfd-slideshow__viewport {
		position: absolute;
		top: 36vw;
		left: 50%;
		z-index: 1;
		width: 48vw;
		margin: 0;
		transform: translateX(-50%);
	}

	.sfd-subblock--hints .sfd-slideshow__arrow {
		top: 38%;
	}

	.sfd-subblock--hints .sfd-slideshow__arrow--prev {
		left: 3%;
	}

	.sfd-subblock--hints .sfd-slideshow__arrow--next {
		right: 0%;
	}

	.sfd-subblock--hints .sfd-hint__media {
		flex: none;
		max-width: none;
		width: 100%;
	}

	.sfd-subblock--hints .sfd-hint__media img {
		aspect-ratio: 360 / 282;
		border-radius: 0;
	}

	.sfd-card {
		flex-basis: 100%;
		height: 92vw;
	}

	.sfd-slideshow__slide--spacer {
		display: none;
	}

	.sfd-card__name {
		margin-bottom: calc(9 / 375 * var(--sfd-sp));
		font-size: calc(18 / 375 * var(--sfd-sp));
	}

	.sfd-slideshow--hints .sfd-slideshow__slide {
		display: flex;
		height: 100vw;
	}

	.sfd-hint {
		flex-direction: column;
		flex-wrap: nowrap;
		align-items: stretch;
		gap: calc(9 / 375 * var(--sfd-sp));
		width: 100%;
		height: 96%;
		padding: 0;
	}

	.sfd-hint__media {
		flex: none;
		width: 100%;
	}

	.sfd-hint__text {
		flex: 0 0 auto;
		padding: 0 4vw 0;
		font-size: calc(13 / 375 * var(--sfd-sp));
		line-height: 1.4;
	}

	.sfd-hint__ornament {
		flex: 0 0 auto;
		margin-top: auto;
		margin-bottom: 12px;
	}

	.sfd-slideshow--hints + .sfd-facility__action {
		margin-top: 40px;
	}

	.sfd-park--tds .sfd-park__banner-inner {
		flex-direction: column-reverse;
		gap: 10.66666667vw;
		padding: 11.2vw 4vw 5.33333333vw;
	}

	.sfd-park--tds .sfd-park__photo {
		flex: 1;
	}

	.sfd-park--tds .sfd-park__logo {
		width: 80vw;
		max-width: 81%;
	}

	.sfd-park--tds .sfd-slideshow__arrow {
		top: 42%;
	}

	.sfd-facility__copyright {
		margin: 11px 0 0;
		text-align: center;
	}

	/* Top button */
	.sfd-top {
		padding: calc(40 / 375 * var(--sfd-sp)) 0 calc(60 / 375 * var(--sfd-sp));
	}

	.sfd-top__btn {
		width: calc(280 / 375 * var(--sfd-sp));
		min-height: calc(100 / 375 * var(--sfd-sp));
		font-size: calc(20 / 375 * var(--sfd-sp));
		padding: 8px 5px;
		letter-spacing: 0.06em;
		border-radius: 60px;
	}
}