:root {
  /* =========================================
     1. Primitive Tokens (基礎色パレット)
  ========================================= */
  /* メインカラー */
  --color-main1: #ea002a;
  --color-main2: #ee3355;
  --color-main3: #f2667f;
  --color-main4: #f799aa;
  --color-main5: #fbccd4;
  --color-main6: #fde5e9;
  --color-main7: #fef2f4;
  --color-main8: #fff0f0;
  --color-main-text: #cc0011;

  /* サポートカラー */
  --color-support1: #525b5c;
  --color-support2: #757c7d;
  --color-support3: #979d9d;
  --color-support4: #babdbe;
  --color-support5: #dcdede;
  --color-support6: #eeefef;
  --color-support7: #f6f6f7;

  /* サブカラー: ゴールド */
  --color-sub-gold1: #ffc20f;
  --color-sub-gold2: #ffce3f;
  --color-sub-gold3: #ffda6f;
  --color-sub-gold4: #ffe79f;
  --color-sub-gold5: #fff3cf;
  --color-sub-gold-text: #877525;

  /* サブカラー: パープル */
  --color-sub-purple1: #6b3077;
  --color-sub-purple2: #895992;
  --color-sub-purple3: #a683ad;
  --color-sub-purple4: #c4acc9;
  --color-sub-purple5: #e1d6e4;

  /* サブカラー: ブルー */
  --color-sub-blue1: #00afdb;
  --color-sub-blue2: #33bfe2;
  --color-sub-blue3: #66cfe9;
  --color-sub-blue4: #99dff1;
  --color-sub-blue5: #cceff8;
  --color-sub-blue-text: #007fa5;

  /* サブカラー: オレンジ */
  --color-sub-orange1: #ff701a;
  --color-sub-orange2: #ff8d48;
  --color-sub-orange3: #ffa976;
  --color-sub-orange4: #ffc6a3;
  --color-sub-orange5: #ffe2d1;
  --color-sub-orange-text: #b15e00;

  /* サブカラー: グリーン */
  --color-sub-green1: #9ee483;
  --color-sub-green2: #b1e99c;
  --color-sub-green3: #c5efb5;
  --color-sub-green4: #d8f4cd;
  --color-sub-green5: #ecfae6;
  --color-sub-green-text: #578033;

  /* モノクロ */
  --color-sub-grey: #262c2d;
  --color-sub-black: #222;
  --color-sub-white: #fff;

  /* =========================================
     2. Semantic Tokens (役割・用途別の色)
  ========================================= */
  /* 文字色 */
  --ft-color-main: var(--color-main-text);
  --ft-color-support: var(--color-support1);
  --ft-color-sub-gold: var(--color-sub-gold-text);
  --ft-color-sub-purple: var(--color-sub-purple1);
  --ft-color-sub-blue: var(--color-sub-blue-text);
  --ft-color-sub-orange: var(--color-sub-orange-text);
  --ft-color-sub-green: var(--color-sub-green-text);
  --ft-color-sub-black: var(--color-sub-black);

  /* 背景色 */
  --bg-color-white: var(--color-sub-white);
  --bg-color-grey: var(--color-sub-grey);
  --bg-color-support10: var(--color-support6);
  --bg-color-support5: var(--color-support7);

  /* ボタンのアイコン色 */
  --btn-icon-color: var(--color-main1);

  /* =========================================
     3. Typography Tokens (フォント関連)
  ========================================= */
  /* フォント種別 */
  --font-en-L: "FS Emeric Light", Verdana, sans-serif;
  --font-en-R: "FS Emeric Regular", Verdana, sans-serif;
  --font-en-M: "FS Emeric Medium", Verdana, sans-serif;
  --font-family: Noto Sans JP, ヒラギノ角ゴ ProN W3, Hiragino Kaku Gothic ProN, メイリオ, Meiryo, sans-serif;
  --font-family-en: "FS Emeric Regular", Verdana, sans-serif;
  --font-family-cn: "Noto Sans SC", sans-serif;
  --font-mincho: 游明朝, YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", HG明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  --font-mincho-cn: "Noto Serif SC", serif;

  /* フォントサイズ (clamp: 320px~1024px で可変) */
  /* 特大見出し (MV等) */
  --theme-headline-xxl: clamp(2.4rem, 1.76rem + 1.99vw, 3.8rem);

  /* 共通見出し: fz と theme はスマホで同サイズ、PCで分岐 */
  --fz-headline-xl: clamp(2.1rem, 1.24rem + 2.70vw, 4rem);
  --theme-headline-xl: clamp(2.1rem, 1.60rem + 1.56vw, 3.2rem);

  --fz-headline-lg: clamp(2rem, 1.64rem + 1.14vw, 2.8rem);
  --theme-headline-lg: clamp(2rem, 1.77rem + 0.71vw, 2.5rem);

  --fz-headline-md: clamp(1.8rem, 1.53rem + 0.85vw, 2.4rem);
  --theme-headline-md: clamp(1.8rem, 1.62rem + 0.57vw, 2.2rem);

  --fz-headline-sm: clamp(1.6rem, 1.42rem + 0.57vw, 2rem);
  --theme-headline-sm: clamp(1.6rem, 1.46rem + 0.43vw, 1.9rem);

  --fz-headline-xs: clamp(1.5rem, 1.36rem + 0.43vw, 1.8rem);
  --theme-headline-xs: clamp(1.5rem, 1.41rem + 0.28vw, 1.7rem);

  /* 本文用テキスト */
  --fz-txt-xl: clamp(1.8rem, 1.71rem + 0.28vw, 2rem);
  --fz-txt-lg: clamp(1.6rem, 1.51rem + 0.28vw, 1.8rem);
  --fz-txt-md: clamp(1.4rem, 1.26rem + 0.33vw, 1.6rem);
  --fz-txt-sm: clamp(1.2rem, 1.11rem + 0.28vw, 1.4rem);
  --fz-txt-xs: clamp(1rem, 0.91rem + 0.28vw, 1.2rem);

  /* フォントウェイト */
  --weight-b: 700;
  --weight-m: 500;
  --weight-s: 400;

  /* LINE HEIGHT */
  --lh-sm: 1.5;
  --lh: 1.8;
  --lh-lg: 2;

  /* =========================================
     4. Spacing Tokens (余白・マージン・パディング)
  ========================================= */
  /* 固定の余白（主にミクロなコンポーネント用） */
  --space-4:  0.4rem;
  --space-8:  0.8rem;
  --space-16: 1.6rem;
  --space-24: 2.4rem;
  --space-32: 3.2rem;
  --space-48: 4.8rem;
  --space-64: 6.4rem;
  --space-80: 8.0rem;

  /* 可変の余白（主にマクロなレイアウト用 / clamp: 320px~1024px） */
  --space-fluid-sm: clamp(1.2rem, 1.02rem + 0.57vw, 1.6rem);   /* SP 12px → PC 16px */
  --space-fluid-md: clamp(1.6rem, 1.24rem + 1.14vw, 2.4rem);   /* SP 16px → PC 24px */
  --space-fluid-lg: clamp(2.4rem, 2.04rem + 1.14vw, 3.2rem);   /* SP 24px → PC 32px */
  --space-fluid-xl: clamp(3.2rem, 2.47rem + 2.27vw, 4.8rem);   /* SP 32px → PC 48px */
  --space-fluid-xxl: clamp(4.8rem, 4.07rem + 2.27vw, 6.4rem);  /* SP 48px → PC 64px */
  --space-fluid-xxxl: clamp(6.4rem, 5.67rem + 2.27vw, 8.0rem); /* SP 64px → PC 80px */

  /* =========================================
     5. Layout Tokens (レイアウト・グリッド専用)
  ========================================= */
  /* グリッドのカラム間の隙間（スマホ24px → PC40px） */
  --grid-gap: clamp(2.4rem, 1.67rem + 2.27vw, 4rem);

}