/* =============================================================
   CAMMA theme — details.css
   フロントページ「Details」セクション (Sauna / Cafe / Work)
   Figma: 1:1506 "Details" のうち
     Sauna 1:812 (Y 8132-10735)  … 開いた中身なし
     Cafe  1:776 (Y 10988-15103.5)
     Work  1:642 (Y 15352.5-19061)
   px→rem は全て ÷10 (1920px設計 = 192rem)。PC専用のためメディアクエリは書かない。

   3セクション共通のマークアップ構造を1組のクラスで使い回し、
   Cafe/Workのみに存在する「開いた中身」(.details__panel 以下)は
   スライダー・定義リストの項目数に依存しないよう通常フローで組み、
   JS側で scrollHeight を測って max-height を切り替えるアコーディオンにしている
   (Cafeは定義リストが3項目、Workは2項目と行数が異なるため、絶対配置ではなく
   通常フローにしないと開閉アニメーションの高さが合わない)。
   ============================================================= */

/* -------------------------------------------------------------
   このファイル固有の色
   base.css の :root トークンに無い色のため、.details__section に
   スコープしたカスタムプロパティとして追加する(base.css 自体は編集しない)。
   #572A13 … Details セクション内の文字・アイコンの共通色 (Figma実測値)
   #815F4E … More Detail バーの罫線 / ドットの非アクティブ色 (Figma実測値)
   ------------------------------------------------------------- */
.details__section {
	--details-color-text: #572a13;
	--details-color-rule: #815f4e;

	position: relative;
	width: 100%;
	background-color: var(--color-white);
	/* ヘッダーが position:fixed / 高さ10remのため、アンカー移動時に隠れないように */
	scroll-margin-top: 10rem;
	padding-bottom:250px
}

/* 背景写真〜More Detailバーまでの「常に見えている」部分。
   背景画像(.details__bg)のみ position:absolute の背景レイヤーで、その上に載る
   .details__body は通常フローで組む(title→photo→subheading→cap→toggle を margin で縦積み)。
   高さは .details__body の内容で決まり(1920で約260.6rem)、後続の .details__panel が
   その下に通常フローで続く。 */
.details__top {
	position: relative;
	overflow: hidden;
	/* 旧: height:260.6rem固定(絶対配置の子が高さを持たないため必要だった)。子を通常
	   フロー化したので高さは内容(.details__body)で決まり、狭幅でcap等が折返して伸びても
	   後続の.details__panelが自然に追従する。 */
}

/* 全面の背景写真レイヤー。position:absolute のまま残す(理由): これは「配置のための
   absolute」ではなく全幅の背景画像レイヤー。PCでは content の上(0〜108rem)に置き、
   SPでは content がこの画像に重なる(bodyのpadding-topより背が高い)ため役割が
   ブレイクポイントで変わり、通常フローの単一ブロックでは表現できない。
   幅100%・高さremで幅可変に追従するため崩れは起きない。 */
.details__bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 108rem;
	overflow: hidden;
}

.details__bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* タイトル〜More Detailバーの位置決めコンテキスト。
   Sauna単体はFigma上 left:34.8rem 前後だが、Cafe/Workは 36.4rem に揃っており
   3セクション共通クラスにするため 36.4rem に正規化した(1.6remの差はFigma側の
   インスタンス間の作成誤差と判断)。 */
.details__body {
	position: relative;
	width: 119.1rem;
	margin: 0 auto; /* 旧:left36.4rem。左右ほぼ対称(36.4/36.5rem)なので中央寄せ */
	padding-top: 128rem; /* 旧:子のtitle top128rem。bgは絶対配置の背景なので、bodyのpaddingで最初のtitle位置を作る */
}

.details__title {
	display: flex;
	flex-direction: column;
}

.details__title-en {
	font-family: var(--font-en-title); /* Figma指定どおり Libre Baskerville */
	font-size: 42px;
	font-weight: 500;
	line-height: 34px;
	letter-spacing: 4.2px;
	color: var(--details-color-text);
	white-space: nowrap;
}

.details__title-ja {
	margin-top:5px;
	font-family: var(--font-ja-gothic); /* Figma指定どおり Zen Kaku Gothic New */
	font-weight: 500;
	font-size: 24px;
	line-height: 28px;
	letter-spacing: 2.4px;
	color: var(--details-color-text);
	white-space: nowrap;
}

.details__photo {
	margin-top: 7.3rem; /* 旧:top142rem(title下端134.7から) */
	width: 119.1rem;
	height: 72.1rem;
	overflow: hidden;
}

.details__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.details__subheading {
	margin-top: 10rem; /* 旧:top224.1rem(photo下端214.1から) */
	width: 100%;
	font-family: var(--font-ja);
	font-weight: 500;
	font-size: 20px;
	line-height: 36px;
	letter-spacing: 2px;
	color: var(--details-color-text);
}

.details__cap {
	margin-top: 3.3rem; /* 旧:top231rem(subheading下端227.7から) */
	width: 119.1rem;
	font-family: var(--font-ja);
	font-weight: 500;
	font-size: 16px;
	line-height: 28px;
	color: var(--details-color-text);
}

/* -------------------------------------------------------------
   More Detail 開閉バー (.details__toggle)
   上下罫線 + 左「More Detail」+ 右40x40の+/×アイコン。
   ------------------------------------------------------------- */
.details__toggle {
	margin-top: 9.6rem; /* 旧:top246.2rem(cap下端236.6から)。capが折返して伸びても常にcap下に流れ重ならない */
	width: 119.1rem;
	height: 14.4rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-top: 0.1rem solid var(--details-color-rule);
	border-bottom: 0.1rem solid var(--details-color-rule);
	text-align: left;
}

.details__toggle-label {
	font-family: var(--font-en);
	font-size: 24px;
	line-height: 1;
	color: var(--details-color-text);
	white-space: nowrap;
}

.details__toggle-icon {
	position: relative;
	width: 4rem;
	height: 4rem;
	flex: 0 0 auto;
}

.details__toggle-icon-img {
	position: absolute;
	top: 0;
	left: 0;
	width: 4rem;
	height: 4rem;
}

/* aria-expanded で + / × を切り替える */
.details__toggle[aria-expanded='true'] .details__toggle-icon-img--plus {
	display: none;
}

.details__toggle[aria-expanded='false'] .details__toggle-icon-img--close {
	display: none;
}

.details__toggle[aria-expanded="true"] {
    border-bottom: 0px;
}

/* -------------------------------------------------------------
   開いた中身 (.details__panel)
   高さが可変(Cafeは定義リスト3項目、Workは2項目)のため通常フローで組み、
   details.js が scrollHeight を測って max-height を切り替える。
   ------------------------------------------------------------- */
.details__panel {
	position: relative;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.4s ease;
}

.details__panel-inner {
	position: relative;
	z-index: 0; /* .details__divider(z-index:-1)をこの内側に閉じ込め、文字の後ろに沈めるための起点 */
	width: 119.1rem;
	margin: 0 auto;
	padding-bottom: 8rem;
}

/* -------------------------------------------------------------
   スライダー (.details__slider)
   1191x454のマスク内を583x454の画像が横に流れる。アクティブ画像は
   ビューポート中央に置き、両隣が左右にのぞく(Figma node 1:474)。
   中央寄せのオフセット((ビューポート幅-スライド幅)/2)は details.js が
   transform に付与する(CSS側はトラックの並びとマスクのみ担当)。
   左右端に60x454のオーバーレイ矢印ボタン、下にドット(中央のアクティブ
   画像の下 = ビューポート中央に justify-content:center で揃う)。
   ------------------------------------------------------------- */
.details__slider {
	position: relative;
}

.details__slider-viewport {
	position: relative;
	width: 119.1rem;
	height: 45.4rem;
	overflow: hidden;
}

.details__slider-track {
	display: flex;
	gap: 2.5rem;
	height: 100%;
	transition: transform 0.4s ease;
	will-change: transform;
}

.details__slider-slide {
	flex: 0 0 auto;
	width: 58.3rem;
	height: 45.4rem;
}

.details__slider-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 4.5rem;
}

.details__slider-arrow {
	position: absolute;
	top: 0;
	width: 6rem;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
}

.details__slider-arrow--prev {
	left: 0;
}

.details__slider-arrow--next {
	right: 0;
}

.details__slider-arrow img {
	width: 3rem;
	height: auto;
	/* アイコン自体は白ストロークのSVG(スライダー写真の上に重ねて視認させる意図) */
}

.details__slider-dots {
	margin-top: 2.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1.6rem;
}

.details__slider-dot {
	width: 1rem;
	height: 1rem;
	border-radius: 50%;
	border: 0.1rem solid var(--details-color-rule);
	background-color: transparent;
}

.details__slider-dot.is-active {
	background-color: var(--details-color-text);
	border-color: var(--details-color-text);
}

/* -------------------------------------------------------------
   定義リスト (.details__dl)
   Price/Time/Plan/Notice。上の罫線+見出しラベル+内容テキストの繰り返し。
   dl/dt/dd を使用。
   ------------------------------------------------------------- */
.details__dl {
	margin-top: 9.7rem;
}

.details__dl-label {
	font-family: var(--font-en);
	font-size: 24px;
	line-height: 29px;
	color: var(--details-color-text);
	padding-bottom: 0.3rem;
	border-bottom: 0.1rem solid var(--details-color-rule);
}

.details__dl-label:not(:first-child) {
	margin-top: 5.4rem;
}

.details__dl-content {
	margin: 1.5rem 0 0;
	font-family: var(--font-ja-gothic); /* Figma指定どおり Zen Kaku Gothic New */
	font-size: 16px;
	line-height: 32px;
	color: var(--details-color-text);
}

/* Notice欄のみ13px/24pxとFigma上サイズが異なる(箇条書きの注意書きのため) */
.details__dl-content--notice {
	font-size: 13px;
	line-height: 24px;
}

/* -------------------------------------------------------------
   Close ボタン
   中央に×アイコン(28x28) + "Close" テキスト。
   ------------------------------------------------------------- */
.details__close {
	margin: 7.2rem auto 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1.2rem;
}

.details__close-icon {
	width: 2.83rem;
	height: 2.83rem;
}

.details__close-label {
	font-family: var(--font-en);
	font-size: 18px;
	line-height: 1;
	color: var(--details-color-text);
}

/* -------------------------------------------------------------
   中央の縦罫線 (Work のみ。Figma 1:528, x=960, h=602)
   CafeにはFigma上対応するノードが無いため実装しない。
   ------------------------------------------------------------- */
.details__divider {
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	width: 0.1rem; /* 1px罫線。極細のため0への丸めは行わない(layout.cssの.l-footer__dividerと同じ方針) */
	height: 60.2rem;
	background-color: var(--details-color-rule);
	z-index: -1; /* dl/Closeボタンの文字より奥に沈める(.details__panel-innerのz-index:0が受け皿) */
}

/* =============================================================
   SP (max-width: 920px)
   Figma: SPトップ全体 (fileKey hq2oZ2NymsckMJQirVNzJJ) のシンボル 20:384
   (390x9102.5, ページ絶対 y=4438〜) のうち Sauna(20:683) / Cafe(20:642+20:606)
   / Work(20:545+20:509) を担当。px→rem は PC 同様 ÷10 (SPは1rem=10px@390px、
   base.css 末尾の SP スケーリング参照)。

   3セクションとも Sauna(グループ315) / Cafe(グループ316+335) / Work(グループ332+338)
   の実測値がほぼ一致 (bg写真高さ562pxで3セクション完全一致、タイトル/写真/小見出し/
   本文の相対オフセットもSauna・Cafeで一致)。一部 Sauna と Cafe/Work で数px の差異が
   あったものは、PC同様「Figma側のインスタンス間の作成誤差」と判断し、多数決 (Cafe/Work
   側) の値に正規化して1組の共有クラスに揃えている。

   なお「見出し」「コンポーネント13-N」(小見出し/本文/Price・Access の見出し&本文)
   という名前の一部ノードは、get_design_context・get_screenshot のどちらでも
   テキストが描画されない (Figma側のコンポーネントインスタンス起因と思われる実データ側の
   不具合。周囲のbg色に関わらず再現するため色コントラストの問題ではない)。該当箇所の
   font-size はテキスト内容が確認できないため「PCのfont-sizeを維持し、line-heightのみ
   実測のバウンディングボックス高さに合わせて調整する」方針で見積もった値であることを
   ここに明記する(bbox自体はレンダリング不具合の影響を受けないため信頼できる)。
   ============================================================= */
@media (max-width: 920px) {

	.details__section {
		scroll-margin-top: 9rem; /* SPヘッダー高さ 9rem (layout.css .l-header 参照)に合わせて実測値化 */
		padding-bottom: 8rem; /* SPでは More Detail 開閉バーの下に余白を追加して、閉じた状態でも下端が画面端に張り付かないようにする */
		padding-bottom:120px
	}

	/* 常時表示部分(bg〜More Detailバー)の高さ。Sauna実測1304px・Cafe/Work実測1312pxで
	   8pxの差異があったため、多数決でCafe/Work側の1312pxに正規化。 */
	.details__top {
		height:auto;
	}

	/* 背景写真。Sauna/Cafe/Work とも実測562pxで完全一致。 */
	.details__bg {
		height: 56.2rem;
	}

	/* 本文コンテンツ列。SP実測 x=36 / 幅318 (390px幅のうち左右36pxずつ余白)。 */
	.details__body {
		/* モバイルでは absolute による固定配置をやめ、相対配置で
		   内部要素を通常フローで並べられるようにする。
		   既存デザインの絶対トップ位置(63.6rem)を pad-top にして
		   子要素の位置は margin-top の差分で再現する。 */
		position: relative;
		margin-left: 3.6rem;
		width: 31.8rem;
		padding-top: 32rem; /* 旧 .details__title top に相当 */
		top: auto;
		left: auto;
	}

	.details__title {
		position: static;
		margin: 0; /* パディングでトップ位置を確保しているためリセット */
	}

	/* .details__title-en と .details__title-ja の font-size/line-height/
	   letter-spacing はファイル末尾のSPフォントブロック(2段のメディアクエリ)に
	   集約した。ただしこのセッションもFigma MCP (get_design_context) が未認証で
	   SP固有の再計測ができておらず、暫定的にPCのrem値をpx化して流用している
	   (要Figma再検証。詳細はそちらのコメント参照)。 */

	.details__photo {
		position: static;
		margin-top: 6.6rem; /* 76.2 - 63.6 */
		margin-left: 2rem; /* 旧 left を再現 */
		width: 27.8rem;
		height: 19rem;
	}

	.details__subheading {
		position: static;
		margin-top: 6rem; /* 101.2 - 76.2 */
		width: 31.8rem;
	}

	.details__cap {
		position: static;
		margin-top: 4rem; /* 110.2 - 101.2 */
		width: 31.8rem;
	}

	.details__toggle {
		position: static;
		margin-top: 7.3rem; /* 126.5 - 110.2 */
		width: 31.8rem;
		height: 5.9rem;
		display: flex;
		align-items: center;
		justify-content: space-between;
		border-top: 0.1rem solid var(--details-color-rule);
		border-bottom: 0.1rem solid var(--details-color-rule);
		text-align: left;
	}

	/* .details__toggle-label の font-size はファイル末尾のSPフォントブロックに集約
	   (get_design_contextで直接テキスト取得できた実測値16pxをそのまま使用)。 */

	.details__toggle-icon {
		/* Figma実測: 長方形(タップ領域)35x35に対し、中の+/×グリフ自体は20x20で中央配置。
		   アイコン画像(icon-plus.svg/icon-close.svg)は内側に余白のない40x40のため、
		   ボックスと画像サイズを分けてグリフのみ縮小・中央寄せしている。 */
		width: 3.5rem;
		height: 3.5rem;
	}

	.details__toggle-icon-img {
		width: 2.5rem;
		height: 2.5rem;
		top: 50%;
		left: 10%;
		transform: translate(-50%, -50%);
	}
	.details__panel{
		padding-top:40px;
	}

	.details__panel-inner {
		width: 31.8rem;
		padding-bottom: 6rem; /* PC(8rem)からモバイル向けに比例して調整(実測なし・目安) */
	}

	/* スライダーは本文列(318)からはみ出して画面幅いっぱい(390px)のマスクにし、
	   その中で PC と同じく「1枚を中央・両隣(前/次)がのぞく」レイアウトにする。
	   PC(viewport 119.1rem / slide 58.3rem / gap 2.5rem / height 45.4rem)を
	   SPマスク幅39rem(=390px)に合わせて比例縮小(×39/119.1≒0.3275)した値。
	   中央寄せのオフセットは details.js が幅を実測して自動計算するためJS変更は不要。 */
	.details__slider-viewport {
		width: calc(100% + 7.2rem); /* 本文列の左右余白(3.6rem)を打ち消して390px幅 */
		margin-left: -3.6rem;
		height: 14.9rem; /* PC 45.4rem × 0.3275 */
		border-radius: 0;
	}

	.details__slider-track {
		gap: 0.8rem; /* PC 2.5rem × 0.3275。両隣がのぞくよう1枚ずつの間に隙間を作る */
	}

	.details__slider-slide {
		width: 19.1rem; /* PC 58.3rem × 0.3275。1枚を中央に置き両隣がのぞく幅 */
		height: 14.9rem;
	}

	.details__slider-slide img {
		border-radius: 1.5rem; /* PC 4.5rem × 0.3275(スライド幅に対する角丸比率を維持) */
	}

	.details__slider-arrow {
		width: 2.8rem; /* PC(6rem)から比例して縮小(目安) */
	}

	.details__slider-arrow img {
		width: 2.2rem; /* PC(3rem)から比例して縮小(目安) */
	}

	.details__slider-dots {
		margin-top: 2rem;
		gap: 1.2rem;
	}

	.details__slider-dot {
		width: 0.8rem;
		height: 0.8rem;
	}

	.details__dl {
		/* スライダー下端(マスク175+ドット部)からdl先頭までの実測ギャップ。
		   Cafe・Workどちらも約59pxで一致。 */
		margin-top: 5.9rem;
	}

	/* .details__dl-label の font-size/line-height はファイル末尾のSPフォントブロックに
	   集約(font-sizeはトグルの"More Detail"と同じ扱いで2.4rem→1.6remに縮小。
	   bbox高さ20pxとも整合)。 */

	.details__dl-label:not(:first-child) {
		/* Cafe(Price→Time、Time→Notice)・Workどちらも約64pxで一致した実測値。
		   PC(5.4rem)より広いが、Figma実測をそのまま採用。 */
		margin-top: 6.4rem;
	}

	/* .details__dl-content(--notice含む)の font-size/line-height はファイル末尾の
	   SPフォントブロックに集約(font-sizeはいずれもPCの値を維持)。 */

	.details__close {
		margin-top: 6.8rem; /* Work実測: 直前のdl本文末尾からCloseボタンまで約68px */
		gap: 1rem;
	}

	.details__close-icon {
		width: 2.26rem; /* Figma実測(Cafe/Work/Saunaパターン共通で約22.6px) */
		height: 2.26rem;
	}

	/* .details__close-label の font-size はファイル末尾のSPフォントブロックに集約。
	   PC実測(font-size 1.8rem/line-height 1)のままでbboxともほぼ一致(実測19px)する
	   ため、スマホpxもPCと同じ18pxを採用している(line-heightは引き続きunitlessの1)。 */

	.details__divider {
		/* SP Figma の Work 開閉パネルには中央罫線に相当するノードが見当たらない
		   (単一カラム積みでは左右分割の区切り線という役割自体が成立しないため、
		   意図的に省いたデザインと判断)。非表示にする。 */
		display: none;
	}
}

/* =============================================================
   SP フォント: タブレット/スマホ2段の固定px化
   理由はlayout.css冒頭の同名コメント参照(remのfont-sizeは920pxに近づくほど
   vwに比例して膨らむため、px指定でこの2段に切り離す。レイアウトのremは
   上のブロックに残したまま)。倍率調整はタブレットブロックの数値のみ。

   注記(このセッションの制約): Figma MCP (get_design_context) が未認証のため
   直接の再計測ができなかった。以下の方針で値を決めている。
     - .details__toggle-label / .details__dl-label: 上のブロックに元々あった
       コメントの通りget_design_context実測値(16px)が既に判明していたため、
       それをそのまま採用。
     - .details__close-label: PC実測(18px)がFigmaのbboxとほぼ一致すると
       既に確認済みだったため、PCと同じ18pxを採用。
     - .details__subheading / .details__cap / .details__dl-content
       (--notice含む): ファイル冒頭のSPブロックコメントの通り、該当ノードが
       コンポーネントインスタンスのレンダリング不具合でテキストを取得できず
       PCのfont-sizeを維持する方針が既に確定していたため、その値をpx化した。
     - .details__title-en / .details__title-ja: 唯一、SP固有の実測値が
       これまで一度も記録されていない(過去の集約コメントは記述のみで実体を
       欠いていた)。今回もFigma再計測ができなかったため、暫定的にPCのrem値を
       そのままpx化して採用した(42px/24px)。Figma認証が復旧し次第、
       この2つだけは実測での再検証を推奨する(詳細は実装報告参照)。
   ============================================================= */

/* SP フォント: タブレット (768–920px)。スマホpx × 約1.35。倍率調整はこのブロックの値のみ。 */
@media (min-width: 768px) and (max-width: 920px) {

	.details__title-en {
		font-size: 40.5px; /* 30px(390pxデザイン実測) × 1.35 = 40.5 */
		line-height: 32.5px; /* 24px × 1.35 = 32.4 */
		letter-spacing: 4px; /* 3px × 1.35 = 4.05 */
	}

	.details__title-ja {
		font-size: 23px; /* 17px × 1.35 = 22.95 */
		line-height: 27px; /* 20px × 1.35 = 27 */
		letter-spacing: 2.3px; /* 1.7px × 1.35 = 2.3 */
	}

	.details__subheading {
		font-size: 27px; /* 20px(PC値を維持) × 1.35 = 27 */
		line-height: 40.5px; /* 30px × 1.35 = 40.5 */
		letter-spacing: 2.5px; /* 2px × 1.35 = 2.7 */
	}

	.details__cap {
		font-size: 21.5px; /* 16px(PC値を維持) × 1.35 = 21.6 */
		line-height: 32.5px; /* 24px × 1.35 = 32.4 */
	}

	.details__toggle-label {
		font-size: 21.5px; /* 16px(Figma実測値) × 1.35 = 21.6 */
	}

	.details__dl-label {
		font-size: 21.5px; /* 16px(Figma実測値) × 1.35 = 21.6 */
		line-height: 27px; /* 20px × 1.35 = 27 */
	}

	.details__dl-content {
		font-size: 21.5px; /* 16px(PC値を維持) × 1.35 = 21.6 */
		line-height: 40.5px; /* 30px × 1.35 = 40.5 */
	}

	.details__dl-content--notice {
		font-size: 17.5px; /* 13px(PC値を維持) × 1.35 = 17.55 */
		line-height: 29.5px; /* 22px × 1.35 = 29.7 */
	}

	.details__close-label {
		font-size: 24.5px; /* 18px(PC値=Figmaのbboxとほぼ一致) × 1.35 = 24.3 */
	}
}

/* SP フォント: スマホ (≤767px)。390pxデザインの実px。 */
@media (max-width: 767px) {

	.details__title-en {
		font-size: 30px; /* 390pxデザイン実測(Saunaのcap高20px≒font30px)。Events見出しと同水準 */
		line-height: 24px;
		letter-spacing: 3px;
	}

	.details__title-ja {
		font-size: 17px; /* title-en(30px)にPC比率(24/42)を適用。SPデザインではJP副題は目立たない */
		line-height: 20px;
		letter-spacing: 1.7px;
		margin-top: 8px;
	}
	.details__subheading {
		font-size: 16px; /* PC(2rem)を維持(コンポーネント側のテキスト取得不可のため。ファイル冒頭コメント参照) */
		line-height: 30px;
		letter-spacing: 2px;
	}

	.details__cap {
		font-size: 13px; /* PC(1.6rem)を維持(同上) */
		line-height: 24px;
	}
	.details__cap br {
		display: none; /* PCでは改行ありだが、SPでは1行に収めるため非表示 */
	}

	.details__toggle-label {
		font-size: 16px; /* get_design_contextで直接テキスト取得できた実測値 */
	}

	.details__dl-label {
		font-size: 16px; /* トグルの"More Detail"と同じ扱いで2.4rem→1.6remに縮小(bbox高さ20pxとも整合) */
		line-height: 20px;
	}

	.details__dl-content {
		font-size: 16px; /* PC(1.6rem)を維持(同上) */
		line-height: 30px;
	}

	.details__dl-content--notice {
		font-size: 13px; /* PC(1.3rem)を維持(同上) */
		line-height: 22px;
	}

	.details__close-label {
		font-size: 18px; /* PC実測(1.8rem)のままFigmaのbboxともほぼ一致(実測19px) */
	}
}