:root {
  --blue: #024bae;
  --blue-deep: #062653;
  --blue-dark: #051f45;
  --blue-light: #dff3ff;
  --blue-pale: #eff9ff;
  --yellow: #f2d83f;
  --ink: #061d43;
  --muted: #53637a;
  --white: #ffffff;
  --skin: #f6d5b8;   /* イラストの肌トーン */
  --beige: #f5f0e6;
  --beige-light: #fbf8f1;
  --line: rgba(6, 48, 106, 0.18);
  --shadow: 0 24px 60px rgba(4, 41, 91, 0.12);

  /* ===== 共通デザイントークン =====
     角丸・罫線・影・ボタン形状はサイト全体でこの4つを参照する。
     数値の変更はここ1箇所で完結する。 */
  --radius-card: 12px;                       /* カード・テーブル・入力欄の角丸 */
  --radius-btn: 999px;                       /* ボタン・タグ類の角丸 */
  --card-border: 1.5px solid var(--blue-deep);
  --card-shadow: 4px 4px 0 0 var(--yellow);  /* カードの立体感（オフセット影） */
  --btn-border-w: 2px;
  --page: min(100% - 54px, 1060px);
}
@media (max-width: 768px) {
  :root {
    --page: calc(100% - 48px);
  }
}
@media (max-width: 768px) {
  :root {
    --page: calc(100% - 36px);
  }
}

/* ===== フォントサイズ トークン =====
   本文・見出しのサイズはすべてここで定義する。
   CSS側では font-size に本トークンのみを使用し、px/rem の直書きは行わない。
   @media 外がPC、@media (max-width: 768px) 内がSPの値。 */
:root {
  /* --- PC --- */
  --fs-display: clamp(110px, 16.56vw, 221px);
  --fs-display-c: clamp(52px, 6.44vw, 85px);   /* TOPヒーロー2行目（大） */
  --fs-h1-i: clamp(27px, 3vw, 43px);   /* TOPヒーロー1行目（小） */
  --fs-h1-j: clamp(21px, 2.1vw, 30px);   /* コンセプト版ヒーロー1行目 */
  --fs-h1-k: clamp(31px, 3.2vw, 46px);   /* コンセプト版ヒーロー2行目 */
  --fs-h1-f: clamp(38px, 4.6vw, 61px);
  --fs-h1-g: clamp(42px, 4.14vw, 59px);
  --fs-h1-h: clamp(39px, 4.05vw, 57px);
  --fs-h2-b: clamp(38px, 3.76vw, 55px);
  --fs-h2-d: 45px;
  --fs-h2-e: clamp(30px, 3.2vw, 45px);
  --fs-h2-i: clamp(28px, 2.9vw, 42px);   /* コンセプト版セクション見出し */
  --fs-h2-f: 40px;
  --fs-h2-g: 39px;
  --fs-h3-c: 35px;
  --fs-h3-d: 33px;
  --fs-h3-e: 29px;
  --fs-h3-f: 29px;   /* スマホに継承されるためPCも据え置き */
  --fs-h3-g: 28px;   /* スマホに継承されるためPCも据え置き */
  --fs-h4: 26px;
  --fs-h4-b: 26px;   /* スマホに継承されるためPCも据え置き */
  --fs-h4-c: 25px;   /* スマホに継承されるためPCも据え置き */
  --fs-h4-d: 23px;
  --fs-h4-e: 22px;   /* 据え置き */
  --fs-body: 21px;   /* 据え置き */
  --fs-body-b: 20px;   /* 据え置き */
  --fs-body-c: 18px;   /* 据え置き */
  --fs-body-d: 17px;   /* 据え置き */
  --fs-body-e: 16px;   /* 据え置き */
  --fs-body-f: 15px;   /* 据え置き */
  --fs-ui: 14px;   /* 据え置き */
  --fs-ui-b: 13px;   /* 据え置き */
  --fs-ui-c: 12px;   /* 据え置き */
  --fs-ui-d: 10px;   /* 据え置き */
  /* --- SP（変更なし） --- */   /* TOPヒーロー2行目（大・769〜1024px） */   /* TOPヒーロー1行目（小・769〜1024px） */
  --fs-sp-h2-c: 48px;
  --fs-sp-h2-e: 46px;
  --fs-sp-h2-f: 42px;   /* TOPヒーロー2行目（大・SP） */   /* TOPヒーロー1行目（小・SP） */
  --fs-sp-h3-b: 38px;
  --fs-sp-h3-c: 35px;
  --fs-sp-h3-d: 34px;
  --fs-sp-h3-e: 31px;
  --fs-sp-h3-f: 30px;
  --fs-sp-h4: 27px;
  --fs-sp-h4-b: 25px;
  --fs-sp-h4-c: 24px;
  --fs-sp-h4-d: 23px;
  --fs-sp-body: 18px;
  --fs-sp-body-b: 16px;
  --fs-sp-body-c: 15px;
  --fs-sp-ui: 14px;
  --fs-sp-ui-b: 13px;
  --fs-sp-ui-c: 12px;
}