/* =====================================================================
   base.css — 共通ベース（YakuHanJP＝約物半角 前提）
   ---------------------------------------------------------------------
   ・このプロジェクトでは日本語の約物（、。「」（）！？ など）を半角幅にする
     「YakuHanJP」を既定で適用する。
   ・HTMLの <head> の一番先頭でこの base.css を読み込むこと。
   ・LP固有のレイアウトCSSはここには書かず、index.html 側の <style> に書く。
   ===================================================================== */

/* YakuHanJP（約物半角）を CDN から読み込む。必ず先頭に置く。 */
@import url("https://cdn.jsdelivr.net/npm/yakuhanjp@4.1.1/dist/css/yakuhanjp.min.css");

/* ---- リセット ---- */
*,
*::before,
*::after {
  box-sizing: border-box; /* 余白・線を含めた幅計算にして崩れを防ぐ */
}

body,
h1,
h2,
h3,
h4,
p,
figure,
figcaption,
ul,
ol {
  margin: 0; /* ブラウザ既定の余白をリセット */
}

/* ---- 色トークン（仕様書の配色） ---- */
:root {
  --navy: #1E3A5F;   /* 見出し用ネイビー */
  --blue: #3B82F6;   /* リンク・アクセント青 */
  --orange: #F97316; /* ボタン・強調オレンジ */
}

/* ---- 本文の既定（font-family の先頭に必ず YakuHanJP を置く） ---- */
body {
  font-family: "YakuHanJP", "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Yu Gothic", sans-serif;
  color: var(--navy);
  line-height: 1.7;
  -webkit-text-size-adjust: 100%; /* スマホで勝手に文字サイズが変わるのを防ぐ */
}

/* 画像はレスポンシブ既定（はみ出し防止） */
img {
  max-width: 100%;
}
