:root {
  /* colors */

  /* 背景（Background）*/
  --c-bg: #03498F;
  --c-bg-image: url('../assets/images/bg_FV.png') center/cover no-repeat;
  --c-bg-gradient: linear-gradient(125deg, rgba(76, 153, 207, 0.8) 0%, rgba(3, 73, 143, 0.8) 100%);
  /* カードなどの背景面 */
  --c-surface: #03498F;
  /* 本文テキスト */
  --c-text: #FFFFFF;
  /* 補助的な文字色 */
  --c-muted: #6b7280;
  /* メインブランドカラー */
  --c-primary: #03498F;
  /* サブ強調色（リンク・CTAなど） */
  --c-accent: #4C99CF;
  /* 枠線や分割線 */
  --c-border: #e5e7eb;


  /* typography */
  --ff-sans: ui-sans-serif, "Noto Sans JP", system-ui, -apple-system, "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic UI", "Yu Gothic", "Meiryo", sans-serif;
  --fs-100: 12px;
  --fs-200: 14px;
  --fs-300: 16px;
  --fs-400: 18px;
  --fs-500: 22px;
  --fs-600: 28px;
  --fs-700: 36px;

  /* spacing */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;

  /* layout */
  --container: 1200px;
  --radius: 50px;
  --shadow: 0 6px 20px rgba(0, 0, 0, .06);
}

@media (width >=768px) {
  :root {
    --fs-300: 17px;
    --fs-400: 19px;
  }
}