@charset "UTF-8";
/* ==========================================================================
   tokens.css — デザイントークン（SPD-v2）
   値は Figma「blue-ptn1」PC(1600) の実寸 px÷10。SP値は SP 375 基準で調整。
   ========================================================================== */

:root {
  /* color */
  --cl-key: #073b68;        /* 見出しの紺 */
  --cl-navy: #0c2543;       /* ボタンの濃紺 */
  --cl-blue: #0a3179;       /* テキストリンク */
  --cl-green: #0c4a3a;      /* 深緑（工法名・進捗バー） */
  --cl-green-dk: #052f24;   /* CTA背景 */
  --cl-green-md: #186054;   /* PDFラベル */
  --cl-gold: #a89058;       /* キッカー・アクセント */
  --cl-gold-dk: #8b691a;    /* 金ボタン */
  --cl-gold-lt: #e4d8a8;    /* 暗背景上のキッカー */
  --cl-gold-ln: #d9c989;    /* PDFラベル枠 */
  --cl-txt: #22302b;        /* 本文 */
  --cl-txt-sub: #4f5d57;    /* 補足テキスト */
  --cl-txt-mute: #5d6963;   /* 弱いテキスト */
  --cl-quote: #2a3645;      /* 引用 */
  --cl-gr: #7a847e;         /* グレーテキスト */
  --cl-gr-cert: #6a756f;    /* 認定表記 */
  --cl-wh: #fff;
  --cl-offwh: #f6f5f0;
  --cl-card: #fdfdfb;
  --cl-bggr: #f4f4f7;       /* 会社情報・ニュース背景 */
  --cl-bgpk: #e0e1e6;       /* PICK UP 背景 */
  --cl-ln: #e7e5de;         /* 罫線 */
  --cl-ln-card: #e4e1d7;    /* カード枠 */
  --cl-ln-tag: #d4d0c2;     /* タグ枠 */
  --cl-ln-news: #c9c3b2;    /* ニュースのタグ枠 */
  --cl-ln-foot: #d9d5c8;    /* フッター罫線 */
  --cl-cta-from: #9d7e47;   /* ヘッダーCTAグラデ */
  --cl-cta-to: #8c7449;
  --cl-error: #b3261e;

  /* font family */
  --ff-sans: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", sans-serif;
  --ff-serif: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --ff-en: "Lato", "Noto Sans JP", sans-serif;
  --ff-num: "Jost", "Lato", sans-serif;

  /* spacing（SP値） */
  --sp-xs: 1rem;
  --sp-s: 2rem;
  --sp-m: 3rem;
  --sp-l: 6rem;
  --sp-sec: 6rem;           /* セクション上下 */

  /* font-size（SP値） */
  --fs-xs: 1.1rem;
  --fs-s: 1.2rem;
  --fs-m: 1.4rem;           /* body基準 */
  --fs-l: 1.7rem;
  --fs-xl: 2.2rem;
  --fs-2xl: 2.4rem;
  --fs-3xl: 2.8rem;         /* セクション見出し */
  --fs-4xl: 3rem;
  --fs-kv: 3.4rem;
  --fs-display: 4rem;

  /* layout */
  --inner-max: 144rem;      /* ABOUT・事業一覧など広い中身 */
  --inner-min: 124.8rem;    /* カタログ・会社情報・フッター */
  --inner-pad: 2rem;
  --header-h: 6rem;

  /* motion */
  --ease-t: 0.3s;
  --ease-t-slow: 0.5s;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);   /* ホバー・押下の動き（出だしが速く、静かに止まる） */
}

@media print, screen and (min-width: 640px) {
  :root {
    --inner-pad: 4rem;
  }
}

@media print, screen and (min-width: 1024px) {
  :root {
    --sp-xs: 1.5rem;
    --sp-s: 4rem;
    --sp-m: 6rem;
    --sp-l: 12rem;
    --sp-sec: 9.6rem;

    --fs-xs: 1.2rem;
    --fs-s: 1.4rem;
    --fs-m: 1.6rem;
    --fs-l: 2.2rem;
    --fs-xl: 3rem;
    --fs-2xl: 4rem;
    --fs-3xl: 5rem;
    --fs-4xl: 6.2rem;
    --fs-kv: 6.4rem;
    --fs-display: 7.3rem;

    --header-h: 9.6rem;
  }
}