/* ==========================================================================
   リセット & 基本タイポグラフィ
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

/* ヘッダーが固定なのでアンカー着地位置をずらす（#access 等）。
   ヘッダーの実高さと同じにする（余分に足すと見出しが画面中ほどに落ちる） */
:target { scroll-margin-top: var(--header-h); }

body {
  margin: 0;
  background: var(--c-white);
  color: var(--c-text);
  font-family: var(--font-base);
  font-weight: var(--fw-medium);
  font-size: 16px;
  line-height: var(--lh-body);
  font-feature-settings: "palt";
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
}

p, ul, ol, dl, figure, table { margin: 0; }
ul, ol { padding-left: 0; list-style: none; }

img, svg, video { max-width: 100%; height: auto; vertical-align: bottom; }

a { color: inherit; text-decoration: none; transition: color .2s var(--ease), opacity .2s var(--ease); }
a:hover { color: var(--c-text-hover); }   /* 制作指示書 p4 */

button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }

/* リンク先 URL が未設定で <span role="link"> にしているボタン（オンラインショップ系）も、
   <a> のボタンと見た目・挙動を揃える。hover 色だけ効いてカーソルが矢印のままだと
   ちぐはぐになる（2026-09-15 指摘）。 */
[role="link"] { cursor: pointer; }

/* 画面外へ出すが読み上げには残す */
.u-visually-hidden {
  position: absolute; width: 1px; height: 1px; margin: -1px;
  padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* 中央寄せコンテナ */
.l-container { width: min(100% - var(--gutter) * 2, var(--w-content)); margin-inline: auto; }
.l-container--wide { width: min(100% - var(--gutter) * 2, var(--w-wide)); margin-inline: auto; }

/* PC / SP 出し分け。ブレークポイントは 1080px（docs/03_THEME_CONVENTIONS.md §4）で統一する */
@media (min-width: 1080px) { .u-sp-only { display: none !important; } }
@media (max-width: 1079px) { .u-pc-only { display: none !important; } }

/* 動きを減らす設定の尊重 */
@media (max-width: 1079px) {
  :target { scroll-margin-top: var(--header-h-sp); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}