@charset "UTF-8";
/* ==============================
   base.css
   CSS変数・リセット・基本の文字設定（全ページ）
   色・フォントはここで定義し、他のファイルでは var() で使う
   ============================== */
:root {
  /* 文字色 */
  --color-text:       #2C2521;
  --color-text-sub:   #6F6359;
  --color-text-mute:  #7C6F65;
  --color-text-faint: #A3968A;
  --color-beige:      #AF9D93;
  /* 背景 */
  --color-bg:         #FAF6F2;
  --color-bg-alt:     #F4EDE7;
  --color-bg-white:   #FFFFFF;
  --color-bg-input:   #FDFBF9;
  --color-bg-dark:    #231C18;
  --color-bg-hero:    #5E4C42;
  /* アクセント */
  --color-accent:     #CA4D34;
  --color-accent-dk:  #A33A25;
  --color-accent-lt:  #E0A594;
  /* 線 */
  --color-line:       #E6DBD1;
  --color-line-dk:    #D8CCC1;
  --color-line-alt:   #E0D5CA;

  --font-sans:   'Noto Sans JP', system-ui, sans-serif;
  --font-mincho: 'Shippori Mincho', serif;
  --font-en:     'Cormorant Garamond', serif;

  --width-content: 1160px;
  --gutter: 20px;          /* 画面左右の余白 */
  --section-space: 72px;   /* セクション上下の余白 */
  --ease: cubic-bezier(.22, .7, .2, 1);
}
@media (min-width: 768px) {
  :root { --gutter: 32px; --section-space: 96px; }
}
@media (min-width: 1024px) {
  :root { --gutter: 48px; --section-space: 110px; }
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
img { display: block; max-width: 100%; height: auto; }
a { color: var(--color-accent); text-decoration: none; transition: color .2s; }
a:hover { color: var(--color-accent-dk); }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
body.is-menu-open { overflow: hidden; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
