:root {
  --font-sans: "Noto Sans JP", "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  --font-serif: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
  --font-latin: "Montserrat", sans-serif;

  --color-text: #232529;
  --color-primary: #ea3f00;
  --color-primary-light: #ffe1d8;
  --color-primary-shadow: #e8c1b6;
  --color-background: #faf4f2;
  --color-accent: #36a79b;
  --color-white: #ffffff;
  --color-gray: #c7c7c7;
  --color-gray-dark: #666666;
  --color-blue: #032057;
  --color-blue-button: #082057;
  --color-light-blue: #f5f8fd;
  --color-blue-panel: #d9e2f1;
  --color-panel: #f7f8fa;
  --color-line: #e4e8ee;
  --color-wire-gold: #b8862b;
  --color-wire-gold-soft: #f5edd8;
  --color-wire-hero-gold: #ffd98a;

  --gradient-primary: linear-gradient(90deg, #ff6a2f 0%, #ff2f4f 100%);
  --gradient-modal: linear-gradient(155deg, #0b2a5b 0%, #071d40 100%);

  --container: 1280px;
  --container-mid: 1180px;
  --container-min: 980px;
  --radius: 6px;
  --radius-large: 20px;
  --section-space: 4.5rem;
  --page-gutter: 24px;
  --header-height: 106px;
}

@media (min-width: 768px) {
  :root {
    --section-space: 6rem;
    --page-gutter: 40px;
    --header-height: 104px;
  }
}

@media (min-width: 1200px) {
  :root {
    --header-height: 67px;
  }
}

@media (min-width: 1520px) {
  :root {
    --header-height: 108px;
  }
}