:root {
  /* ==================================================
      Font family (Google Fonts)
  ================================================== */
  --font_sans: "Noto Sans JP", sans-serif;
  --font_roboto: "Roboto", sans-serif;

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

  /* ==================================================
      Spacing tokens (px scale)
  ================================================== */
  --2: 0.125rem; /* 2px */
  --4: 0.25rem; /* 4px */
  --6: 0.375rem; /* 6px */
  --8: 0.5rem; /* 8px */
  --10: 0.625rem; /* 10px */
  --12: 0.75rem; /* 12px */
  --16: 1rem; /* 16px */
  --18: 1.125rem; /* 18px */
  --20: 1.25rem; /* 20px */
  --24: 1.5rem; /* 24px */
  --28: 1.75rem; /* 28px */
  --30: 1.875rem; /* 30px */
  --32: 2rem; /* 32px */
  --36: 2.25rem; /* 36px */
  --40: 2.5rem; /* 40px */
  --44: 2.75rem; /* 44px */
  --48: 3rem; /* 48px */
  --50: 3.125rem; /* 50px */
  --64: 4rem; /* 64px */

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

  /* ==================================================
      Layout
  ================================================== */
  /* --layout-content-max: 768px; */
  --layout-content-max: 600px;
  --layout-content-size: min(50%, var(--layout-content-max));
  --layout-section-gap: var(--16);

    /* バリアブルサイズ計算変数（画面幅に比例して上昇する数値） */
  --variableSize__minWindow:  1366; /* 想定する最小画面幅 */
  --variableSize__maxWindow:  1920; /* 想定する最大画面幅 */
  --variableSize__minSize:       0; /* 最小画面幅時の目標サイズ */
  --variableSize__maxSize:      96; /* 最大画面幅時の目標サイズ */
  --variableSize__calc: ((var(--variableSize__minSize) * 1px) + (var(--variableSize__maxSize) - var(--variableSize__minSize)) * (100vw - (var(--variableSize__minWindow) * 1px))/(var(--variableSize__maxWindow) - var(--variableSize__minWindow)));

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

  /* ==================================================
      Color
  ================================================== */
  --color_base: #f5efef;
  --color_bg_pc: #f5efef;
  --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);
}

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

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