@charset "UTF-8";
/* ============================================================================
   pg-tone.css ── トンマナ統一層 v2「ホームの声」（第5次改修・2026-08-19）
   ----------------------------------------------------------------------------
   仕様の正: _scripts/design_system_2026-08-18.md §14（ホーム・トンマナ規範）
   CEO決裁: 「ホームのデザインは崩さない。下層のトンマナをホームに合わせる。
             大前提はホームのデザインにトンマナを合わせる」（2026-08-19）

   【v1（第4次・unbot参照）からの変更】
     - 第2の声 Archivo を廃止。ホーム実測（§14）で、ホームの英字・数字・採番は
       すべてシステムサンス（-apple-system→ヒラギノ）と確定したため。
       ホームに存在しない声を下層に置かない。フォント実体は残置（参照ゼロ）。
     - 見出し・ラベルの太さ/字間をホーム実測値に整列:
         h1/h2 = 700（ホームのヒーロー/一覧見出しと同じ）
         h3    = 600（ホームのサービス名 24px/600 と同じ役割）
         リード = 400（ホームのリードと同じ）
         小型ラベル（標番・索引番号）= 600 / +0.14em
         （ホームの採番キャプション・眉 13px/600/+0.14em と同一の声）
     - CTA = 700 ＋ hover scale(1.04)（ホームのCTAと同じ形・同じ動き）
     - 桁揃えは font-variant-numeric: tabular-nums で維持（SF は tnum 対応）

   【第4次から維持するもの（構造資産）】
     - 測度 1120px（c7 本文列 = 1行40字。ホームはフルスクリーン演出で測度の
       概念が異なるため、下層の紙面設計として維持＝CEO了承済み）
     - カラム中央寄せの座標系・全幅装置の一般式（§3）
     - 標番・扉・巻末プレート・索引・罫の規律・赤アクセント（構造資産）

   【読み込み順】必ず最後（pg-lift の後・優先度15）。トップ（ID127）では読まれない
   ＝トップの座標系・書体は 1px も変わらない。

   【禁止事項の継承】新色ゼロ・新ブレークポイントゼロ（1200/960/782のみ）・
   角丸は pill のみ・AIっぽい装飾なし。仕様書 §1〜§3 の全制約を継承する。
   ============================================================================ */
/* ============================================================
   1. フォントトークン ── ホームの声に一本化
   ------------------------------------------------------------
   --scy-num: ホームに等幅書体は存在しない（採番・統計数字もサンス）ため、
     サンススタックへ向け直す。桁揃えが必要な箇所（標番・年表の年・条番号・
     記録値）は各定義済みの font-variant-numeric: tabular-nums が引き続き
     効く（SF / ヒラギノとも tnum 対応）。
   --scy-sans: Windows のフォールバックを明示（Yu Gothic Medium を Regular より
     先に置くのは、游ゴシック Regular が細すぎて灰色に見える既知事象への対処）。
     Mac/iOS はこれまでどおりヒラギノで 1px も変わらない（第4次から維持）。
   （v1 の --scy-disp は廃止。見出しは page-title.css / pg-core.css の
     --scy-sans がそのまま受ける＝ホームの見出しと同じスタック）
   ============================================================ */
:root {
	--scy-num: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Hiragino Sans", "Yu Gothic Medium", "Yu Gothic", "Noto Sans JP", "Meiryo", sans-serif;
	--scy-sans: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Hiragino Sans", "Yu Gothic Medium", "Yu Gothic", "Noto Sans JP", "Meiryo", sans-serif;
}

/* ============================================================
   2. 測度 1120px
   ------------------------------------------------------------
   .scy-wide の --scy-bodyw を 1600 → 1120 に締める。
   本ファイルは 20ページ（19＋社会貢献）でしか読まれないため、
   トップ（1600px・pages.css 定義）はこの規則の影響を受けない。
   1120 の根拠: c7 本文列 = 640px = 16px フォントで 1行40字
   ＝ 仕様書 §4-2「走り文36〜46字（P8 実在中央値40）」の中央値。
   ============================================================ */
.scy-wide {
	--scy-bodyw: 1120px;
}

/* ============================================================
   3. 座標系の切り替え ── 左アンカー → カラム中央寄せ
   ------------------------------------------------------------
   旧: 測度1600 ≧ ビューポートのため「カラム左端 = 左ガター48px」が常に成立し、
       全幅装置は left:calc(-48px + sb/2) の固定式で戻せた。
   新: 測度1120 < ビューポート（>1216px）ではカラムが中央に寄るため、
       同じ式では全幅装置がカラムごと右にずれる。
       一般式 left:calc(50% - 50vw + sb/2) に置き換える。この式は
       ビューポート ≦ 1216px では旧式と数学的に同値（50% - 50vw = -pad - sb/2）
       ＝ 1024 / 768 / 390 の描画は改修前と 1px も変わらない。
   ヘッダー・パンくず・フッターも同じカラム幅（1120 + 48×2 = 1216）に
   揃える。「基準線」の定義が「ビューポート左から48px」から「カラム左端」へ
   変わるだけで、全要素が1本の縦線に揃うことは不変（S1 の趣旨を維持）。
   ============================================================ */
@media (min-width: 960px) {
	/* --- 本文カラムの中央寄せ --- */
	.scy-wide #content.l-container {
		margin-inline: auto;
	}
	/* --- ヘッダー内側を同じカラムに --- */
	.scy-lift #header .l-header__inner {
		max-width: calc(var(--scy-bodyw, 1120px) + var(--swl-pad_container, 0px) * 2);
		margin-inline: auto;
	}
	/* --- パンくずを同じカラムに（SWELL 既定 1296px を上書き） --- */
	.scy-lift .p-breadcrumb__list {
		max-width: calc(var(--scy-bodyw, 1120px) + var(--swl-pad_container, 0px) * 2);
		margin-inline: auto;
	}
	/* --- フッター上「SUPER CITY Group」ブロックを同じカラムに
	       （pages.css §13 の max-width:none / margin 0 を上書き） --- */
	.l-footer__widgetArea .l-container {
		max-width: calc(var(--scy-bodyw, 1120px) + var(--swl-pad_container, 0px) * 2);
		margin-inline: auto;
		padding-inline: var(--swl-pad_container, 0px);
	}

	/* --- 全幅装置の一般式化（4式。旧式と同じ並び順で上書き） --- */
	/* (a) SWELL alignfull（nav.css (5) の再アンカーを一般式へ） */
	.l-mainContent__inner > .post_content > .alignfull {
		left: calc(50% - 50vw + var(--swl-scrollbar_width, 0px) / 2);
	}
	/* (b) 全幅バンド .scy-band（pg-core §7） */
	:is(.scy-pg .post_content, .scy-pg) .scy-band:not(.alignfull):not(.alignwide) {
		left: calc(50% - 50vw + var(--swl-scrollbar_width, 0px) / 2);
	}
	/* (c) 巻末プレート .scy-foot（pg-core §8） */
	:is(.scy-pg .post_content, .scy-pg) .scy-foot:not(.alignfull):not(.alignwide) {
		left: calc(50% - 50vw + var(--swl-scrollbar_width, 0px) / 2);
	}
	/* (d) 扉（pg-lift §2） */
	.scy-pg .post_content > .scy-pagehead,
	.scy-pg .l-mainContent__inner > .scy-pagehead,
	.scy-lift .scy-soc__sec--head > .scy-soc__inner > .scy-soc__pghead {
		left: calc(50% - 50vw + var(--swl-scrollbar_width, 0px) / 2);
		/* 面はフルブリードのまま、字はカラム左端から始める。
		   max(48px, 50vw - 測度/2) は ≦1216px で 48px に退化＝旧挙動と同一 */
		padding-inline: max(var(--swl-pad_container, 0px), calc(50vw - var(--scy-bodyw, 1120px) / 2));
	}

	/* --- 全幅装置の「内側」をカラムへ戻す --- */
	/* 巻末プレートの内側（pg-core の左アンカー margin:0 を中央寄せへ） */
	:is(.scy-pg .post_content, .scy-pg) .scy-foot__in {
		max-width: calc(var(--scy-bodyw, 1120px) + var(--swl-pad_container, 0px) * 2);
		margin-inline: auto;
	}
	/* SWELL 全幅ブロックの内側（nav.css (6) の左アンカーを中央寄せへ） */
	.swell-block-fullWide__inner.l-article {
		margin-inline: auto;
	}
	.swell-block-fullWide__inner.l-container {
		margin-inline: auto;
	}
	/* リロケーション支援: ヒーロー文字とグループ内側（nav.css (7) の左アンカーを中央寄せへ） */
	:is(.scy-pg .post_content, .scy-pg) .scy-gm__hero-copy {
		left: max(var(--swl-pad_container, 0px), calc(50vw - var(--scy-bodyw, 1120px) / 2));
		right: max(var(--swl-pad_container, 0px), calc(50vw - var(--scy-bodyw, 1120px) / 2));
	}
	.scy-gm__group-inner {
		margin-inline: auto;
	}
	/* 社会貢献: 帯の内側（social.css の margin: 0 auto 0 0 ＝左アンカーを中央寄せへ） */
	.scy-lift .scy-soc__inner {
		margin-inline: auto;
	}
}

/* ============================================================
   4. 太さ・字間・モーションのホーム整列（§14-3）
   ------------------------------------------------------------
   ホーム実測（1440px・2026-08-19）:
     ヒーロー h1  = sans 68px / 700 / -0.015em
     一覧見出し   = sans fs-h2 / 700 / -0.01em
     サービス名   = sans 24px / 600
     リード       = sans 18.7px / 400
     採番・眉     = sans 13px / 600 / +0.14em
     CTA          = pill / 700 / hover scale(1.04)
     リンク       = 600 / 矢印スライド
   下層の同役割要素をこの声に整列する。サイズは変えない（ホームが「叫ぶ」
   68px／下層が「静かに大きい」63px という表紙と中面の関係は維持）。
   ============================================================ */

/* --- 見出し: h1 / h2 = 700（ホームのヒーロー・一覧見出しと同じ太さ） --- */
:is(.scy-pg .post_content, .scy-pg) .scy-pagehead__title,
.scy-pg .scy-pagehead__title,
.scy-lift .scy-pagehead__title,
:is(.scy-pg .post_content, .scy-pg) h1.scy-gm__hero-title {
	font-weight: 700;
}
:is(.scy-pg .post_content, .scy-pg) h2.scy-h2,
:is(.scy-pg .post_content, .scy-pg) .scy-h2 {
	font-weight: 700;
}

/* --- h3 = 600（ホームのサービス名 24px/600 と同じ役割・同じ太さ） --- */
:is(.scy-pg .post_content, .scy-pg) h3.scy-h3,
:is(.scy-pg .post_content, .scy-pg) .scy-h3 {
	font-weight: 600;
}

/* --- リード = 400（ホームのリードと同じ。階層はサイズ1.25倍と測度34emが担う。
       §4-2「二重差」は §14 でホーム準拠に改定） --- */
:is(.scy-pg .post_content, .scy-pg) .scy-lead {
	font-weight: 400;
}

/* --- 小型ラベル（標番・索引番号・カテゴリ）= +0.14em
       ホームの採番キャプション（data-num）・眉（WELCOME TO TOKYO）と同一の声。
       太さ600・13pxは既定のまま＝ホームと同値 --- */
:is(.scy-pg .post_content, .scy-pg) .scy-mark__no,
:is(.scy-pg .post_content, .scy-pg) .scy-mark__cat,
:is(.scy-pg .post_content, .scy-pg) .scy-idx__n {
	letter-spacing: .14em;
}

/* --- CTA = 700（ホームのCTAボタンと同じ太さ） --- */
:is(.scy-pg .post_content, .scy-pg) .scy-cta {
	font-weight: 700;
}

/* --- CTA hover = scale(1.04)（ホームのCTAと同じ動き。イージング・時間も
       ホームのトークンを既に共有。reduced-motion では動かさない） --- */
@media (prefers-reduced-motion: no-preference) {
	:is(.scy-pg .post_content, .scy-pg) .scy-cta:hover {
		transform: scale(1.04);
	}
	:is(.scy-pg .post_content, .scy-pg) .scy-cta:active {
		transform: scale(1.04) translateY(1px);
	}
}
