:root {
  /* ==================================================
      Font family (Google Fonts)
  ================================================== */
  --font_sans: "Noto Sans JP", sans-serif;
  --font_sen: "Sen", sans-serif;
  --font_shippori: "Shippori Mincho", serif;
  --font_inter: "Inter", sans-serif;

  /* ==================================================
      Base unit
  ================================================== */
  --px: 0.0625rem; /* 1px */

  /* ==================================================
      Spacing tokens (px scale)
  ================================================== */
  --2: 0.125rem;
  --3: 0.1875rem;
  --4: 0.25rem;
  --5: 0.3125rem;
  --6: 0.375rem;
  --8: 0.5rem;
  --10: 0.625rem;
  --12: 0.75rem;
  --15: 0.9375rem;
  --16: 1rem;
  --17: 1.0625rem;
  --18: 1.125rem;
  --20: 1.25rem;
  --24: 1.5rem;
  --25: 1.5625rem;
  --28: 1.75rem;
  --29: 1.8125rem;
  --30: 1.875rem;
  --32: 2rem;
  --34: 2.125rem;
  --35: 2.1875rem;
  --36: 2.25rem;
  --38: 2.375rem;
  --40: 2.5rem;
  --44: 2.75rem;
  --48: 3rem;
  --50: 3.125rem;
  --60: 3.75rem;
  --62: 3.875rem;
  --64: 4rem;
  --80: 5rem;
  --90: 5.625rem;
  --100: 6.25rem;
  --120: 7.5rem;
  --160: 10rem;

  /* ==================================================
      Font size tokens (px scale)
  ================================================== */
  --fs-10: 0.625rem;
  --fs-11: 0.6875rem;
  --fs-12: 0.75rem;
  --fs-13: 0.8125rem;
  --fs-14: 0.875rem;
  --fs-15: 0.9375rem;
  --fs-16: 1rem;
  --fs-18: 1.125rem;
  --fs-20: 1.25rem;
  --fs-22: 1.375rem;
  --fs-24: 1.5rem;
  --fs-28: 1.75rem;
  --fs-30: 1.875rem;
  --fs-32: 2rem;
  --fs-36: 2.25rem;
  --fs-40: 2.5rem;
  --fs-48: 3rem;
  --fs-64: 4rem;

  /* ==================================================
      Layout
  ================================================== */
  --layout-content-max: 480px; /* SP コンテンツ（要突合） */
  --layout-pc-max: 1920px;
  --layout-content-max-pc: 1246px;
  /* PC 中間幅の線形スケール端点（896px = min / 1246px = max） */
  --layout-fluid-bp-min: 896px;
  --layout-fluid-bp-max: 1246px;

  --layout-section-gap: var(--16);
  --layout-header-height-pc: 80px;
  --layout-header-height-sp: 60px;

  /* ==================================================
      Viewport scale (SP 390px 基準)
      calc(ピクセル値 * var(--vw-sp)) 
  ================================================== */
  --base-sp: 390;
  --vw-sp: calc(100vw / var(--base-sp));

  /* ==================================================
      Color
  ================================================== */
  --color_base: #f4efe2;
  --color_page_bg: #fefaef;
  --color_bg_pc: #e8e8e8;
  --color_main: #332e24;
  --color_main_90: rgba(51, 46, 36, 0.9);
  --color_main_80: rgba(51, 46, 36, 0.8);
  --color_main_70: rgba(51, 46, 36, 0.7);
  --color_main_60: rgba(51, 46, 36, 0.6);
  --color_main_50: rgba(51, 46, 36, 0.5);
  --color_main_45: rgba(51, 46, 36, 0.45);
  --color_main_40: rgba(51, 46, 36, 0.4);
  --color_main_35: rgba(51, 46, 36, 0.35);
  --color_main_30: rgba(51, 46, 36, 0.3);
  --color_main_25: rgba(51, 46, 36, 0.25);
  --color_main_20: rgba(51, 46, 36, 0.2);
  --color_main_15: rgba(51, 46, 36, 0.15);
  --color_main_12: rgba(51, 46, 36, 0.12);
  --color_main_10: rgba(51, 46, 36, 0.1);
  --color_works_bg: #474238;
  --color_nav: rgba(124, 124, 123, 0.8);
  --color_footer_muted: #7c7c7a;
  --color_footer_map_underline: rgba(124, 124, 122, 0.3);
  --color_footer_copyright: rgba(124, 124, 122, 0.5);
  --color_footer_link: rgba(51, 46, 36, 0.8);
  --color_footer_icon: rgba(124, 124, 122, 0.5);
  --color_accent: #ff7619;
  --color_accent_lime: #f1f200;
  --color_top_contact_overlay: rgba(51, 46, 36, 0.9);
  --color_top_contact_line: rgba(255, 255, 255, 0.5);
  --color_top_contact_note: rgba(255, 255, 255, 0.7);
  --color_header_bg: var(--color_page_bg);
  --color_white: #ffffff;
  --color_text: rgba(0, 0, 0, 0.8);
  --color_text_sub: rgba(0, 0, 0, 0.5);
  --color_border: rgba(0, 0, 0, 0.1);

  /* ==================================================
      Letter spacing and link underline offset
  ================================================== */
  --letter-spacing: 0.15em;
  --link-underline-offset: 0.25em;
}

html {
  font-family: var(--font_sans);
  font-feature-settings: "palt";
}

*,
*::before,
*::after {
  letter-spacing: var(--letter-spacing);
}

a[href] {
  text-underline-offset: var(--link-underline-offset);
}

@media (any-hover: hover) {
  a[href] {
    transition: opacity 0.1s;
  }
  a[href]:hover {
    transition: opacity 0.2s;
    opacity: 0.7;
  }
}