/* =========================================================================
   お子様向けサービス＆設備（room CPT・slug=family_service）専用スタイル。
   特設デザイン。本文（core/html）が出力する
   .family-service-lp 配下にスコープする。各セクションは全幅の背景画像帯、内側コンテンツは
   1000px 中央寄せ（狭幅は max-width で可変）。装飾画像 URL は子テーマ assets を参照する。
   ========================================================================= */
/* 親 constrained は子へ margin-left/right:auto と max-width:contentSize を !important で当てるため、
   詳細度を上げ（.single-main 接頭辞）かつ margin:50%＋translateX(-50%) で確実に全幅化する
   （auto に勝つ・親の位置に依存しない）。セクション帯を全幅にするための土台。
   フロント（.single-main）に加え、ブロックエディタのキャンバス（.editor-styles-wrapper）でも
   同様に全幅化し、編集画面でも左右いっぱいの帯を表示する。 */
.single-main .family-service-lp {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
}
/* エディタのキャンバスでは margin の % 基準が異なり calc が効かないため、
   left:50%＋translateX(-50%) で確実にビューポート全幅へ展開する。 */
.editor-styles-wrapper .family-service-lp {
	position: relative;
	width: 100vw !important;
	max-width: 100vw !important;
	left: 50%;
	transform: translateX(-50%);
	margin-left: 0 !important;
	margin-right: 0 !important;
}
/* 最終セクションの色帯の下に出る白い余白（post-content の下padding）を消し、帯をパンくず手前まで
   届かせる。最終レストランセクションの下余白は section 側(padding-bottom)が持つ。 */
.single-main.family-service-main > .wp-block-post-content { padding-bottom: 0; }
.family-service-lp {
	color: #3b3b3b;
	font-family: var(--wp--custom--brand-body, "Noto Sans JP", sans-serif);
	line-height: 1.8;
	overflow-x: clip;
}
.family-service-lp img { max-width: 100%; height: auto; display: block; }
.family-service-lp a { text-decoration: none; }
/* このページの見出し・ナビ・dt は sans。親テーマの :is(.entry-content) .wp-block-heading
   { font-family: brand-heading(serif) } は !important ではないので、こちらの !important で
   詳細度に関わらず確実に上書きできる。コアブロックの見出し(.wp-block-heading)だけでなく、
   一部セクションの素の h1〜h4 も対象に含める（serif の取りこぼしを防ぐ）。 */
.family-service-lp :is(h1, h2, h3, h4),
.family-service-lp dt,
.family-service-lp .fs-nav a {
	font-family: var(--wp--custom--brand-body, "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", sans-serif) !important;
}

/* PC/SP 出し分け。 */
.family-service-lp .spElement { display: none; }
.family-service-lp .pcElement { display: block; }
@media (max-width: 768px) {
	.family-service-lp .pcElement { display: none; }
	.family-service-lp .spElement { display: block; }
	.family-service-lp .pcInline { display: none; }
}

/* 内側コンテンツの基準幅（1000px・中央寄せ）。左右ガターはサイト共通の --gutter。 */
.family-service-lp .fs-activity__imgs,
.family-service-lp .fs-activity__bottom,
.family-service-lp .fs-cards,
.family-service-lp .fs-pool__map,
.family-service-lp .fs-pool__sub,
.family-service-lp .fs-room__sub {
	width: 1000px;
	max-width: calc(100% - var(--gutter) * 2);
	margin-left: auto;
	margin-right: auto;
}
/* セクション上部の図版は KV（hilton-kv）と同じ最大1320pxで左右いっぱいに（ガターなし・全幅）。
   左右はセクションの全幅地色が埋める。 */
.family-service-lp .fs-figtop {
	width: 100%;
	max-width: 1320px;
	margin-left: auto;
	margin-right: auto;
}

/* ===== トップ（ヒーローは本文の core/image。max-width は他ページKV(hilton-kv)と同じ1320pxに揃え、
   両脇は同画像のぼかしで埋める。見出しh1は視覚非表示でSEO/A11y用に保持） ===== */
.family-service-lp .fs-top { position: relative; overflow: hidden; }
.family-service-lp .fs-top::before {
	content: "";
	position: absolute;
	inset: 0;
	background: url("../images/family_service/top_img.jpg") center center / cover no-repeat;
	filter: blur(24px);
	transform: scale(1.12);
	z-index: 0;
}
.family-service-lp .fs-top__img {
	position: relative;
	z-index: 1;
	margin: 0 auto;
	width: 100%;
	max-width: 1320px;
}
.family-service-lp .fs-top__img img { width: 100%; display: block; }
.family-service-lp .fs-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}
.family-service-lp .fs-top__lead {
	position: absolute;
	z-index: 2;
	bottom: 2%;
	width: 100%;
	margin: 0;
	padding: 20px var(--gutter);
	box-sizing: border-box;
	font-size: 12px;
	letter-spacing: 0.3em;
	text-align: center;
	line-height: 1.5;
}
@media (max-width: 768px) {
	/* スマホでは KV 画像がビューポート幅いっぱいに表示され左右の余白が無いため、
	   PC 用の両脇ぼかし背景は不要。リード文の背後にぼけた写真が透けて見えるのを防ぐ。 */
	.family-service-lp .fs-top::before { display: none; }
	.family-service-lp .fs-top__lead {
		position: static;
		font-size: 13px;
		letter-spacing: 0.04em;
		text-align: left;
		padding: 15px 10px;
		background-color: #f2edd9;
		box-sizing: border-box;
	}
}

/* 共通KVブロックのリード文（ページ固有タイポ。重ね/色/全幅は親 .lp-kv が担当）。 */
.family-service-lp .lp-kv__lead { font-size: 12px; letter-spacing: 0.3em; --lp-kv-lead-bg: #f2edd9; }

/* ===== ページ内リンク（自動目次 acf/lp-nav）。背景画像だけページ固有。折返し・中央寄せ・
   白文字・区切り線・帯高さは親 lp.css の .lp-nav。目次は lp-nav.js が各セクションの
   lp-sechead（nav_label）から自動生成する。 ===== */
.family-service-lp .lp-nav {
	margin-top: 0; /* KV 直下に帯を密着（親 lp.css の 56px 上余白を打ち消す）。 */
	background: url("../images/family_service/nav_bg.jpg") center center / cover no-repeat;
}

/* ===== セクション帯（全幅背景）＋見出し ===== */
.family-service-lp .fs-sec { padding: 0 0 56px; background-position: center top; background-repeat: repeat-y; }
.family-service-lp .fs-activity { background-image: url("../images/family_service/activity_bg.jpg"); }
.family-service-lp .fs-pool { background-image: url("../images/family_service/pool_bg.jpg"); }
.family-service-lp .fs-room { background-image: url("../images/family_service/room_bg.jpg"); }
.family-service-lp .fs-amenity { background-image: url("../images/family_service/amenity_bg.jpg"); }
.family-service-lp .fs-restaurants { background-image: url("../images/family_service/restaurants_bg.jpg"); }

/* 区切り見出しの帯高さ・上下中央寄せ・sans・被せ(z-index)は共通の .lp-sechead__title
   （acf/lp-sechead の style.css）が担う。ここはバナー背景・配色・字サイズだけを上書きする。
   帯高さは figtop の margin-top:-179px と一致させる必要があるため、共通変数を 179px に固定。 */
.family-service-lp {
	--lp-sechead-title-h: 179px;
	--lp-sechead-title-h-tablet: 179px;
}
.family-service-lp .fs-sec__h.wp-block-heading {
	font-size: 30px;
	font-weight: bold;
	color: #ce3062;
	line-height: 1.4;
	letter-spacing: 0.1em;
	background: url("../images/family_service/title_bg.png") top center no-repeat;
	background-size: cover;
	max-width: 1500px;
	margin: 0 auto;
}
.family-service-lp .fs-sec__h.wp-block-heading span { font-size: 20px; color: #00a8e1; }
@media (max-width: 768px) {
	.family-service-lp .fs-sec { padding: 0 0 30px; }
	.family-service-lp .fs-sec__h.wp-block-heading {
		font-size: 14px;
		background-color: #fff;
		background-image: none;
		height: auto;
		padding: 20px 10px;
		max-width: none;
		border-radius: 0 0 50% 50%;
	}
	.family-service-lp .fs-sec__h.wp-block-heading span { font-size: 12px; }
}

/* 上部図版（メイン画像＋キャプション＋装飾）。h2 の下端へ重ねる（負の margin-top）。
   下方向の間隔はセクションの blockGap が与えるため margin-bottom は持たせない。 */
/* 図版は見出し(.fs-sec__h, 高さ約179px)に完全に重ねる。見出しは z-index:2 で前面、
   title_bg と文字が画像の上に乗る。 */
.family-service-lp .fs-figtop { position: relative; margin-top: -179px; line-height: 1; font-size: 0; }
/* 図版は枠（最大1320px）いっぱいに表示。画像が原寸（1000px）のまま左寄せになるのを防ぐため
   img 自身も width:100% にする。 */
.family-service-lp .fs-figtop .main { width: 100%; }
.family-service-lp .fs-figtop .main img { width: 100%; }
.family-service-lp .fs-figtop figcaption,
.family-service-lp .fs-figtop .fs-figcap {
	position: absolute;
	width: 100%;
	bottom: 0;
	left: 0;
	margin: 0;
	text-align: center;
	font-size: 14px;
	line-height: 1.5;
	background: rgba(255, 255, 255, 0.8);
	padding: 25px var(--gutter);
	box-sizing: border-box;
}
.family-service-lp .fs-figtop .sub { position: absolute; bottom: -20px; }
.family-service-lp .fs-figtop .sub1 { left: -200px; }
.family-service-lp .fs-figtop .sub2 { right: -90px; }
.family-service-lp .fs-figtop .sub_1 { right: 0; top: -20px; }
.family-service-lp .fs-figtop .sub_2 { left: 0; bottom: -20px; }
@media (max-width: 768px) {
	.family-service-lp .fs-figtop { margin-top: -40px; }
	.family-service-lp .fs-figtop figcaption,
	.family-service-lp .fs-figtop .fs-figcap { position: static; text-align: left; padding: 15px var(--gutter); }
	.family-service-lp .fs-figtop .sub { display: none; }
}

/* ===== アクティビティ ===== */
/* 3点の画像は本文の core/image（編集可能）。横並び・等幅。 */
.family-service-lp .fs-activity__imgs {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 910px;
}
.family-service-lp .fs-activity__imgs .wp-block-image { width: 30%; margin: 0; }
.family-service-lp .fs-activity__imgs .wp-block-image img { width: 100%; }
.family-service-lp .fs-activity__bottom { padding: 40px; background: #fff; box-sizing: border-box; }
.family-service-lp .fs-activity__bottom p { font-size: 16px; text-align: center; margin: 0; }

/* ===== CTA / リンクボタン（core/buttons ＞ core/button）。ピル型（塗り＋白内枠＋矢印）。
   縦の間隔はセクションの blockGap が与える。配色だけセクション別に上書きする。 ===== */
/* セクション末尾のボタンも他の子要素と同じ縦リズム（56px）にする。親テーマの
   .wp-block-buttons{margin-top:clamp(...24px)} を上書きするため明示する。 */
.family-service-lp .wp-block-buttons { margin: 56px 0 0; justify-content: center; gap: 20px; }
.family-service-lp .wp-block-button { max-width: 100%; }
.family-service-lp .wp-block-button__link {
	position: relative;
	display: block;
	width: auto;
	min-width: 320px;
	max-width: 100%;
	background: #ff89a4;
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	border-radius: 999px;
	padding: 9px 40px;
	line-height: 1.4;
	box-shadow: 3px 3px 3px #ccc;
}
/* 白い内枠（span 罫線）を疑似要素で描く。ピル形に沿わせる。 */
.family-service-lp .wp-block-button__link::before {
	content: "";
	position: absolute;
	inset: 3px;
	border: 1px solid #fff;
	border-radius: 999px;
	pointer-events: none;
}
.family-service-lp .wp-block-button__link::after { content: " ＞"; }
.family-service-lp .wp-block-button__link:hover { opacity: 0.7; }
/* セクション別の配色（背景・装飾だけが違う）。 */
.family-service-lp .fs-pool .wp-block-button__link { background: #5fc2f1; }
.family-service-lp .fs-restaurants .wp-block-button__link { background: linear-gradient(to right, #fcb13b, #fbce39); }
.family-service-lp .fs-room .wp-block-button__link { background: linear-gradient(to right, #ffad82, #ff8d8a); }
.family-service-lp .fs-amenity .wp-block-button__link { background: linear-gradient(to right, #18dfc0, #3bb7f4); }

/* ===== プール ===== */
/* 「ココがおすすめ！」の薄い白背景ボックス。上は重なる見出し用に100px、下も同等のpaddingを取り
   カードが背景の縁に接しないようにする（card は margin ではなく row-gap で行間を取る）。 */
.family-service-lp .fs-pool__rec.wp-block-group { background-color: rgba(255, 255, 255, 0.4); position: relative; padding: 100px 0 70px; }
.family-service-lp .fs-pool__rec h3 {
	position: absolute;
	top: -20px;
	left: 50%;
	transform: translateX(-50%);
	font-size: 24px;
	font-weight: bold;
	color: #fff;
	text-align: center;
	letter-spacing: 0.1em;
	background: #00a8e1;
	border-radius: 30px;
	padding: 10px 0;
	width: 400px;
	max-width: 90%;
	margin: 0;
}

/* シール付きカードグリッド（プール／アメニティ／レストラン／客室共通）。
   行間は row-gap（card 個別の margin ではなく）。カードは自然な高さ（揃えない）。 */
.family-service-lp .fs-cards { display: flex; flex-wrap: wrap; gap: 50px; align-items: flex-start; }
.family-service-lp .fs-card {
	position: relative;
	width: calc(50% - 25px);
	margin: 0;
	padding: 38px 30px 30px;
	background: #fff;
	box-shadow: 3px 3px 3px #ccc;
	box-sizing: border-box;
}
/* カラム幅はブロック設定（ACF columns）で決める。1=全幅 .fs-card--full / 2=半幅（base）。 */
.family-service-lp .fs-card--full { width: 100%; }
/* アメニティは全幅指定でも2カラム幅で揃える。 */
.family-service-lp .fs-amenity .fs-card--full { width: calc(50% - 25px); }
/* InnerBlocks ラッパーはカード内レイアウトに透過させ、記述子セレクタを従来どおり効かせる。 */
.family-service-lp .fs-card .acf-innerblocks-container { display: contents; }

/* === エディター: ACF ブロックは .fs-cards の flex アイテムがラッパー(.wp-block-acf-fs-card)に
   なるため、幅・シールをラッパー基準で付与してフロントと一致させる（内側 .fs-card は 100%）。 === */
.editor-styles-wrapper .fs-cards > .wp-block-acf-fs-card { position: relative; width: calc(50% - 25px); box-sizing: border-box; }
.editor-styles-wrapper .fs-cards > .wp-block-acf-fs-card:has(.fs-card--full) { width: 100%; }
.editor-styles-wrapper .fs-amenity .fs-cards > .wp-block-acf-fs-card:has(.fs-card--full) { width: calc(50% - 25px); }
.editor-styles-wrapper .fs-cards > .wp-block-acf-fs-card > .fs-card { width: 100%; }
/* シール（::before をラッパーに付け、並び順 1/2/2/1。配色は front と同じセクション別 family）。 */
.editor-styles-wrapper .fs-cards > .wp-block-acf-fs-card::before {
	content: ""; position: absolute; top: -35px; left: 50%; transform: translateX(-50%);
	background-repeat: no-repeat; background-size: contain; z-index: 3;
}
.editor-styles-wrapper :is(.fs-pool, .fs-amenity) .fs-cards > .wp-block-acf-fs-card:nth-child(4n + 1 of .wp-block-acf-fs-card)::before,
.editor-styles-wrapper :is(.fs-pool, .fs-amenity) .fs-cards > .wp-block-acf-fs-card:nth-child(4n of .wp-block-acf-fs-card)::before {
	width: 165px; height: 65px; background-image: url("../images/family_service/title_seal_f_1.png");
}
.editor-styles-wrapper :is(.fs-pool, .fs-amenity) .fs-cards > .wp-block-acf-fs-card:nth-child(4n + 2 of .wp-block-acf-fs-card)::before,
.editor-styles-wrapper :is(.fs-pool, .fs-amenity) .fs-cards > .wp-block-acf-fs-card:nth-child(4n + 3 of .wp-block-acf-fs-card)::before {
	width: 195px; height: 71px; background-image: url("../images/family_service/title_seal_f_2.png");
}
.editor-styles-wrapper :is(.fs-room, .fs-restaurants) .fs-cards > .wp-block-acf-fs-card:nth-child(4n + 1 of .wp-block-acf-fs-card)::before,
.editor-styles-wrapper :is(.fs-room, .fs-restaurants) .fs-cards > .wp-block-acf-fs-card:nth-child(4n of .wp-block-acf-fs-card)::before {
	width: 159px; height: 59px; background-image: url("../images/family_service/title_seal_b_1.png");
}
.editor-styles-wrapper :is(.fs-room, .fs-restaurants) .fs-cards > .wp-block-acf-fs-card:nth-child(4n + 2 of .wp-block-acf-fs-card)::before,
.editor-styles-wrapper :is(.fs-room, .fs-restaurants) .fs-cards > .wp-block-acf-fs-card:nth-child(4n + 3 of .wp-block-acf-fs-card)::before {
	width: 159px; height: 65px; background-image: url("../images/family_service/title_seal_b_2.png");
}
.family-service-lp .fs-card .seal { position: absolute; top: -35px; left: 50%; transform: translateX(-50%); width: auto; z-index: 2; }
.family-service-lp .fs-card .seal img { width: auto; }
.family-service-lp .fs-card figure { text-align: center; line-height: 1; margin: 0 0 30px; }
.family-service-lp .fs-card figure img { width: 100%; }
.family-service-lp .fs-card h4 { font-size: 16px; font-weight: bold; color: #3b3b3b; text-align: left; line-height: 1.7; margin: 0 0 8px; letter-spacing: normal; }
.family-service-lp .fs-card h4 span { display: inline-block; font-size: 12px; }
/* プールカードは説明文のみ（見出しでなく段落）。小さめの普通字に。 */
.family-service-lp .fs-pool .fs-card p { font-size: 12px; line-height: 1.7; }
.family-service-lp .fs-card p { font-size: 13px; line-height: 1.7; margin: 0; }
/* カード内CTA（core/buttons）はカード本文の下に余白を取る。 */
.family-service-lp .fs-card .wp-block-buttons { margin-top: 16px; }
.family-service-lp .fs-card .wp-block-button { width: 100%; }
.family-service-lp .fs-card .wp-block-button__link { width: 100%; min-width: 0; font-size: 15px; padding: 10px 16px; }

/* プール other（マップ・サブボックス・詳細CTA）。子の縦間隔は other の blockGap。 */
.family-service-lp .fs-pool__map figure { text-align: center; line-height: 1; font-size: 0; margin: 0; }
.family-service-lp .fs-pool__map p { background: #fff; font-size: 14px; text-align: center; padding: 30px var(--gutter); margin: 0; }
.family-service-lp .fs-pool__map p strong { font-size: 18px; font-weight: bold; color: #ce3062; }
.family-service-lp .fs-pool__map p span { font-size: 11px; }
.family-service-lp .fs-pool__sub.wp-block-group { background: #fff; overflow: hidden; padding: 0; display: flex; gap: 30px; align-items: flex-start; }
/* 短い本文のサブ（更衣室）は画像に対して上下中央。左余白は base の gap:30px が担うため不要。 */
.family-service-lp .fs-pool__sub.wp-block-group:has(p.txt) { align-items: center; }
.family-service-lp .fs-pool__sub figure { flex: 0 0 286px; margin: 0; line-height: 1; font-size: 0; }
.family-service-lp .fs-pool__sub-body { flex: 1 1 auto; min-width: 0; padding: 24px 30px 24px 0; }
/* 無料／有料レンタルは2カラム（横並び）。注記リストはその下に全幅。 */
.family-service-lp .fs-pool__sub-body:has(.fs-rental) { display: flex; flex-wrap: wrap; column-gap: 30px; align-content: flex-start; }
.family-service-lp .fs-pool__sub-body:has(.fs-rental) > .wp-block-list { width: 100%; }
/* レンタル（ラベル＋箇条書き）。ラベルを上・品目リストを下の縦積みにして見やすく。 */
.family-service-lp .fs-rental { width: calc(50% - 15px); margin: 0 0 8px; }
.family-service-lp .fs-rental__label {
	position: relative;
	display: inline-block;
	background: #fff;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	min-width: 220px;
	padding: 10px 24px 10px 60px;
	margin: 0 0 14px;
	box-shadow: 3px 3px 3px #ccc;
}
.family-service-lp .fs-rental .wp-block-list { margin: 0; padding-left: 1.4em; font-size: 14px; line-height: 1.9; }
.family-service-lp .fs-rental .wp-block-list li { margin: 0; }
.family-service-lp .fs-pool__sub p.txt { margin: 0; padding: 0; font-size: 13px; line-height: 1.7; }

/* ===== 客室 sub（バスルーム）。メディアオブジェクト（画像左・本文右）を flex で。 ===== */
.family-service-lp .fs-room__sub.wp-block-group { background: #fff; display: flex; gap: 30px; align-items: center; }
.family-service-lp .fs-room__sub .wp-block-image { flex: 0 0 286px; margin: 0; line-height: 1; font-size: 0; }
.family-service-lp .fs-room__sub .wp-block-image img { width: 100%; display: block; }
.family-service-lp .fs-room__sub-body { flex: 1 1 auto; min-width: 0; padding: 24px 24px 24px 0; }
.family-service-lp .fs-room__sub-body h4 { font-size: 16px; font-weight: bold; color: #3b3b3b; margin: 0 0 8px; }
.family-service-lp .fs-room__sub-body p { font-size: 13px; line-height: 1.7; color: #111; margin: 0; }

/* 小さな注記（※）。 */
.family-service-lp .note { font-size: 12px; text-align: center; }
/* セクション直下の注記は段落のため親テーマのクランプ余白が効き、上だけ詰まる。
   下のセクション余白(56px)と同程度の上余白を取り、上下を揃える。 */
.family-service-lp .fs-sec > .note { margin-top: 56px; }

@media (max-width: 768px) {
	.family-service-lp .fs-activity__imgs { width: auto; }
	/* SP では1カラム化した各要素が広がりすぎないよう上限を設けて中央寄せ
	   （セクション上部の図版＝.fs-figtop は全幅のまま）。 */
	.family-service-lp .fs-cards { gap: 50px; justify-content: center; }
	/* SP では1カラム化した各要素を「画面端から --gutter(16px) のガター＋最大400px」で中央寄せ。
	   セクション上部の図版（.fs-figtop）だけは全幅のまま。 */
	.family-service-lp .fs-cards,
	.family-service-lp .fs-linkbox,
	.family-service-lp .fs-activity__bottom,
	.family-service-lp .fs-activity__imgs,
	.family-service-lp .fs-pool__sub.wp-block-group,
	.family-service-lp .fs-room__sub.wp-block-group,
	.family-service-lp .fs-pool__map,
	.family-service-lp .fs-sec > .note,
	.family-service-lp .fs-sec > .wp-block-list {
		width: calc(100% - var(--gutter) * 2);
		max-width: 400px;
		margin-left: auto;
		margin-right: auto;
		box-sizing: border-box;
	}
	.family-service-lp .fs-card,
	.family-service-lp .fs-amenity .fs-card--full { width: 100%; padding: 38px 14px 14px; }
	.family-service-lp .fs-activity__bottom p { text-align: left; font-size: 14px; }
	/* プールsub・客室sub は狭幅で縦積み（画像→本文）。 */
	.family-service-lp .fs-pool__sub.wp-block-group,
	.family-service-lp .fs-room__sub.wp-block-group { flex-direction: column; gap: 10px; }
	.family-service-lp .fs-pool__sub figure { flex: 0 0 auto; width: 100%; }
	.family-service-lp .fs-pool__sub-body { padding: 16px var(--gutter); }
	.family-service-lp .fs-pool__sub p.txt { padding: 0; }
	.family-service-lp .fs-room__sub .wp-block-image { flex: 0 0 auto; width: 100%; }
	/* SP はレンタルを1カラムに。ラベルはアイコン分の左余白を確保しつつ小さめに。 */
	.family-service-lp .fs-rental { width: 100%; }
	.family-service-lp .fs-rental__label { min-width: 0; width: 100%; box-sizing: border-box; font-size: 13px; padding: 8px 10px 8px 40px; }
	.family-service-lp .fs-rental__label::before { width: 28px; height: 38px; left: 6px; }
	.family-service-lp .fs-room__sub-body { padding: 0 var(--gutter) 16px; }
	.family-service-lp .fs-linkbox .wp-block-button { width: 100%; }
	/* リンクボックスの長いラベルが SP で折り返さないよう文字を小さく。 */
	.family-service-lp .fs-linkbox .wp-block-button__link { font-size: 14px; padding: 10px 16px; }
	/* セクション直下注記の上余白を下のセクション余白(SP 30px)と揃える。 */
	.family-service-lp .fs-sec > .note { margin-top: 30px; }
}

/* =========================================================================
   装飾（テーマ画像）。差し替え対象の写真は本文(media)、非写真の装飾はここでテーマ assets
   から重ねる（サブイラスト・シール・レンタルアイコン・SPタイトル文字・プール帯）。
   ========================================================================= */
/* セクション上部図版の左右にはみ出す装飾サブイラスト（原寸どおり）。 */
.family-service-lp .fs-figtop::before,
.family-service-lp .fs-figtop::after {
	content: "";
	position: absolute;
	background-repeat: no-repeat;
	background-size: contain;
	pointer-events: none;
	z-index: 1;
}
.family-service-lp .fs-activity .fs-figtop::before { left: -80px; bottom: -20px; width: 240px; height: 180px; background-image: url("../images/family_service/activity_top_img_2.png"); }
.family-service-lp .fs-activity .fs-figtop::after { right: -45px; bottom: -20px; width: 132px; height: 192px; background-image: url("../images/family_service/activity_top_img_3.png"); }
.family-service-lp .fs-room .fs-figtop::before { left: -70px; bottom: -40px; width: 200px; height: 198px; background-image: url("../images/family_service/room_top_img_2.png"); }
.family-service-lp .fs-room .fs-figtop::after { right: -70px; bottom: -40px; width: 200px; height: 198px; background-image: url("../images/family_service/room_top_img_3.png"); }
.family-service-lp .fs-amenity .fs-figtop::before { left: -75px; bottom: -20px; width: 170px; height: 159px; background-image: url("../images/family_service/amenity_top_img_2.png"); }
.family-service-lp .fs-amenity .fs-figtop::after { right: -75px; bottom: -20px; width: 170px; height: 159px; background-image: url("../images/family_service/amenity_top_img_3.png"); }
.family-service-lp .fs-restaurants .fs-figtop::before { left: -80px; bottom: -40px; width: 184px; height: 164px; background-image: url("../images/family_service/restaurants_top_img_2.png"); }
.family-service-lp .fs-restaurants .fs-figtop::after { right: -80px; bottom: -40px; width: 184px; height: 164px; background-image: url("../images/family_service/restaurants_top_img_3.png"); }

/* プール上部図版の下に重なる帯（repeat-x）。キャプション文字box（.fs-figcap）の ::after に
   付け、帯の下端をキャプションboxの下端と必ず一致させる。帯はキャプション文字の背面（z-index:-1）。 */
/* 帯が背面に重なる前提で、プールのキャプションは下paddingを広めに取る。 */
.family-service-lp .fs-pool .fs-figcap { z-index: 1; padding-bottom: 50px; }
.family-service-lp .fs-pool .fs-figcap::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	width: 100vw;
	max-width: 1500px;
	height: 197px;
	background: url("../images/family_service/pool_top_img_2.png") center bottom repeat-x;
	background-size: contain;
	z-index: -1;
	pointer-events: none;
}
/* プール上部図版（写真＋キャプション）は帯より前面に。帯が下に重なるぶん、次の
   「ココがおすすめ！」までの間隔を他より広めに取る。 */
.family-service-lp .fs-pool .fs-figtop { z-index: 1; margin-bottom: 80px; }

/* カードのシール（上端中央に重なる装飾テープ）。テープ柄はセクションごとに異なり、
   プール／アメニティ＝熱帯柄(f)、客室／レストラン＝ブルー水玉(b)。各セクション内ではカードの並び順で
   1/2/2/1（_1, _2, _2, _1）を繰り返す（各 .fs-cards の先頭から数え直す）。 */
.family-service-lp .fs-cards > .fs-card::before {
	content: "";
	position: absolute;
	top: -35px;
	left: 50%;
	transform: translateX(-50%);
	background-repeat: no-repeat;
	background-size: contain;
	z-index: 3;
}
/* 熱帯柄(f)＝プール／アメニティ。1・4 番目(4n+1, 4n)=f_1、2・3 番目(4n+2, 4n+3)=f_2。 */
.family-service-lp :is(.fs-pool, .fs-amenity) .fs-cards > .fs-card:nth-child(4n + 1 of .fs-card)::before,
.family-service-lp :is(.fs-pool, .fs-amenity) .fs-cards > .fs-card:nth-child(4n of .fs-card)::before {
	width: 165px; height: 65px; background-image: url("../images/family_service/title_seal_f_1.png");
}
.family-service-lp :is(.fs-pool, .fs-amenity) .fs-cards > .fs-card:nth-child(4n + 2 of .fs-card)::before,
.family-service-lp :is(.fs-pool, .fs-amenity) .fs-cards > .fs-card:nth-child(4n + 3 of .fs-card)::before {
	width: 195px; height: 71px; background-image: url("../images/family_service/title_seal_f_2.png");
}
/* ブルー水玉(b)＝客室／レストラン。1・4 番目=b_1、2・3 番目=b_2。 */
.family-service-lp :is(.fs-room, .fs-restaurants) .fs-cards > .fs-card:nth-child(4n + 1 of .fs-card)::before,
.family-service-lp :is(.fs-room, .fs-restaurants) .fs-cards > .fs-card:nth-child(4n of .fs-card)::before {
	width: 159px; height: 59px; background-image: url("../images/family_service/title_seal_b_1.png");
}
.family-service-lp :is(.fs-room, .fs-restaurants) .fs-cards > .fs-card:nth-child(4n + 2 of .fs-card)::before,
.family-service-lp :is(.fs-room, .fs-restaurants) .fs-cards > .fs-card:nth-child(4n + 3 of .fs-card)::before {
	width: 159px; height: 65px; background-image: url("../images/family_service/title_seal_b_2.png");
}

/* プール レンタルのラベル左のアイコン。 */
.family-service-lp .fs-rental__label::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 8px;
	transform: translateY(-50%);
	width: 40px;
	height: 54px;
	background: url("../images/family_service/title_seal_f_3.png") center/contain no-repeat;
}

/* SP トップの白文字タイトル（装飾グラフィック）。 */
@media (max-width: 768px) {
	.family-service-lp .fs-figtop::before,
	.family-service-lp .fs-figtop::after,
	.family-service-lp .fs-pool .fs-figcap::after { display: none; }
	/* SP は帯を出さないので、プールのキャプション下padding を上(15px)と揃える。 */
	.family-service-lp .fs-pool .fs-figcap { padding-bottom: 15px; }
	.family-service-lp .fs-top__h::after {
		content: "";
		position: absolute;
		left: 50%;
		top: 5px;
		transform: translateX(-50%);
		width: 95%;
		max-width: 727px;
		aspect-ratio: 727 / 100;
		background: url("../images/family_service/top_img_txt.png") center/contain no-repeat;
	}
}
