/* ========================================
   Typography
======================================== */

:root {
  /* 本文系 */
  --japan-font-xs: clamp(11px, calc(10.5px + 0.15vw), 12px);
  --japan-font-sm: clamp(13px, calc(12.5px + 0.15vw), 14px);
  --japan-font-base: clamp(16px, calc(15px + 0.25vw), 18px);
  --japan-font-lg: clamp(18px, calc(17px + 0.3vw), 21px);
  --japan-font-xl: clamp(22px, calc(20px + 0.5vw), 26px);

  /* 見出し系 */
  --japan-font-h3: clamp(24px, calc(21px + 0.8vw), 32px);
  --japan-font-h2: clamp(28px, calc(24px + 1.2vw), 40px);
  --japan-font-h1: clamp(32px, calc(26px + 2vw), 52px);

  /* Parallax */
  --japan-font-mv-xs: clamp(11px, 0.8vw, 13px);
  --japan-font-mv-sm: clamp(13px, 1vw, 16px);
  --japan-font-mv-base: clamp(15px, 1.2vw, 18px);
  --japan-font-mv-lg: clamp(18px, 1.6vw, 24px);
  --japan-font-mv-xl: clamp(22px, 2.2vw, 32px);
  --japan-font-mv-2xl: clamp(26px, 2.8vw, 40px);
  --japan-font-mv-3xl: clamp(30px, 3.6vw, 52px);
  --japan-font-mv-title: clamp(30px, 4vw, 56px);

  /* ==============================
  Font Weight
  ============================== */
  --japan-font-weight-light: 300;
  --japan-font-weight-normal: 400;
  --japan-font-weight-medium: 500;
  --japan-font-weight-bold: 700;
  --japan-font-weight-black: 900;
}

.font-xs   { font-size: var(--japan-font-xs) !important; }
.font-sm   { font-size: var(--japan-font-sm) !important; }
.font-base { font-size: var(--japan-font-base) !important; }
.font-lg   { font-size: var(--japan-font-lg) !important; }
.font-xl   { font-size: var(--japan-font-xl) !important; }

.heading-font-h1 { font-size: var(--japan-font-h1) !important; }
.heading-font-h2 { font-size: var(--japan-font-h2) !important; }
.heading-font-h3 { font-size: var(--japan-font-h3) !important; }


.font-mv-xs   { font-size: var(--japan-font-mv-xs) !important; }
.font-mv-sm   { font-size: var(--japan-font-mv-sm) !important; }
.font-mv-base { font-size: var(--japan-font-mv-base) !important; }
.font-mv-lg   { font-size: var(--japan-font-mv-lg) !important; }
.font-mv-xl   { font-size: var(--japan-font-mv-xl) !important; }
.font-mv-2xl   { font-size: var(--japan-font-mv-2xl) !important; }
.font-mv-3xl   { font-size: var(--japan-font-mv-3xl) !important; }

.font-weight-light   { font-weight: var(--japan-font-weight-light) !important; }
.font-weight-normal   { font-weight: var(--japan-font-weight-normal) !important; }
.font-weight-medium { font-weight: var(--japan-font-weight-medium) !important; }
.font-weight-bold   { font-weight: var(--japan-font-weight-bold) !important; }
.font-weight-black   { font-weight: var(--japan-font-weight-black) !important; }