/* ============================================
   CSS変数定義
   FUJITA築育サイト
   ============================================ */

:root {
  /* -----------------------------------------------
     カラー
  ----------------------------------------------- */
  --color-green:       #0E845C;  /* メイングリーン（ボタン・強調） */
  --color-green-dark:  #195E47;  /* ダークグリーン（フッター背景） */
  --color-blue:        #0867AE;  /* ブルー（正解・強調文言・リンク） */
  --color-blue-nav:    #1C5191;  /* ナビ・ふりがなボタン文字色 */
  --color-text:        #414141;  /* 本文グレー */
  --color-white:       #FFFFFF;  /* 白 */

  /* -----------------------------------------------
     フォント
  ----------------------------------------------- */
  --font-main: 'Zen Kaku Gothic New', sans-serif;
  --font-num:  'Inter', sans-serif; /* コイン数値表示用 */

  /* -----------------------------------------------
     フォントサイズ
  ----------------------------------------------- */
  --fs-xs:   12px;
  --fs-sm:   14px;
  --fs-base: 16px;
  --fs-md:   18px;
  --fs-lg:   20px;
  --fs-xl:   24px;
  --fs-2xl:  32px;
  --fs-3xl:  36px;
  --fs-4xl:  40px;
  --fs-5xl:  56px;
  --fs-6xl:  60px;
  --fs-7xl:  80px;

  /* -----------------------------------------------
     レイアウト
  ----------------------------------------------- */
  --max-width: 1070px;

  /* -----------------------------------------------
     スペーシング
  ----------------------------------------------- */
  --space-xs:  8px;
  --space-sm:  16px;
  --space-md:  24px;
  --space-lg:  40px;
  --space-xl:  60px;
  --space-2xl: 80px;
  --space-3xl: 120px;

  /* -----------------------------------------------
     角丸
  ----------------------------------------------- */
  --radius-sm:     4px;
  --radius-md:     8px;
  --radius-lg:     16px;
  --radius-pill:   9999px;
  --radius-circle: 50%;

  /* -----------------------------------------------
     トランジション
  ----------------------------------------------- */
  --transition: 0.3s ease;

  /* -----------------------------------------------
     z-index
  ----------------------------------------------- */
  --z-float:   90;
  --z-header:  100;
  --z-overlay: 190;
  --z-menu:    200;
}