:root {
  --font-sans: "Jura", "Noto Sans JP", "system-ui", -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-serif: "Georgia", Georgia, Cambria, "Times New Roman", Times, serif;
  --font-mono: "SFMono-Regular", SFMono-Regular, Menlo, Monaco, Consolas,
    "Liberation Mono", "Courier New", monospace;
  --font-display: var(--font-sans);
}

.font-sans {
  font-family: var(--font-sans);
}
.font-serif {
  font-family: var(--font-serif);
}
.font-mono {
  font-family: var(--font-mono);
}
.font-display {
  font-family: var(--font-display);
}

.font-light {
  font-weight: 300;
}
.font-regular {
  font-weight: 400;
}
.font-medium {
  font-weight: 500;
}
.font-semibold {
  font-weight: 600;
}
.font-bold {
  font-weight: 700;
}
.font-black {
  font-weight: 900;
}

.text-10 {
  font-size: 0.625rem;
}
.text-12 {
  font-size: 0.75rem;
}
.text-14 {
  font-size: 0.875rem;
}
.text-16 {
  font-size: 1rem;
}
.text-18 {
  font-size: 1.125rem;
}
.text-20 {
  font-size: 1.25rem;
}
.text-24 {
  font-size: 1.5rem;
}
.text-28 {
  font-size: 1.75rem;
}
.text-32 {
  font-size: 2rem;
}
.text-36 {
  font-size: 2.25rem;
}
.text-40 {
  font-size: 2.5rem;
}
.text-48 {
  font-size: 3rem;
}
.text-56 {
  font-size: 3.5rem;
}
.text-60 {
  font-size: 3.75rem;
}
.text-64 {
  font-size: 4rem;
}

.leading-100 {
  line-height: 1;
}
.leading-115 {
  line-height: 1.15;
}
.leading-120 {
  line-height: 1.2;
}
.leading-125 {
  line-height: 1.25;
}
.leading-150 {
  line-height: 1.5;
}
.leading-180 {
  line-height: 1.8;
}
.leading-200 {
  line-height: 2;
}
.leading-240 {
  line-height: 2.4;
}
.leading-320 {
  line-height: 3.2;
}

.tracking-0 {
  letter-spacing: 0;
}
.tracking-4 {
  letter-spacing: 0.04em;
}
.tracking-6 {
  letter-spacing: 0.06em;
}
.tracking-8 {
  letter-spacing: 0.08em;
}
.tracking-10 {
  letter-spacing: 0.1em;
}
.tracking-12 {
  letter-spacing: 0.12em;
}
.tracking-16 {
  letter-spacing: 0.16em;
}
.tracking-20 {
  letter-spacing: 0.2em;
}

.text-start {
  text-align: start;
}
.text-center {
  text-align: center;
}
.text-end {
  text-align: end;
}

.text-no-br br {
  display: none;
}
.text-br br {
  display: block;
}

.whitespace-nowrap {
  white-space: nowrap;
}

.vertical-rl {
  writing-mode: vertical-rl;
}

.font-feature-palt {
  font-feature-settings: "palt";
}

@media screen and (min-width: 414px) {
  .sm--text-14 {
    font-size: 0.875rem;
  }
  .sm--text-16 {
    font-size: 1rem;
  }
  .sm--text-18 {
    font-size: 1.125rem;
  }
  .sm--text-20 {
    font-size: 1.25rem;
  }
  .sm--text-24 {
    font-size: 1.5rem;
  }
  .sm--text-28 {
    font-size: 1.75rem;
  }
  .sm--text-32 {
    font-size: 2rem;
  }
  .sm--text-36 {
    font-size: 2.25rem;
  }
  .sm--text-40 {
    font-size: 2.5rem;
  }

  .sm--text-no-br br {
    display: none;
  }
  .sm--text-br br {
    display: block;
  }
}

@media screen and (min-width: 768px) {
  .md--text-14 {
    font-size: 0.875rem;
  }
  .md--text-16 {
    font-size: 1rem;
  }
  .md--text-18 {
    font-size: 1.125rem;
  }
  .md--text-20 {
    font-size: 1.25rem;
  }
  .md--text-24 {
    font-size: 1.5rem;
  }
  .md--text-28 {
    font-size: 1.75rem;
  }
  .md--text-32 {
    font-size: 2rem;
  }
  .md--text-36 {
    font-size: 2.25rem;
  }
  .md--text-40 {
    font-size: 2.5rem;
  }
  .md--text-48 {
    font-size: 3rem;
  }
  .md--text-56 {
    font-size: 3.5rem;
  }
  .md--text-60 {
    font-size: 3.75rem;
  }
  .md--text-64 {
    font-size: 4rem;
  }

  .md--text-no-br br {
    display: none;
  }
  .md--text-br br {
    display: block;
  }

  .md--text-start {
    text-align: start !important;
  }
  .md--text-center {
    text-align: center !important;
  }
  .md--text-end {
    text-align: end !important;
  }
}

@media screen and (min-width: 1024px) {
  .lg--text-14 {
    font-size: 0.875rem;
  }
  .lg--text-16 {
    font-size: 1rem;
  }
  .lg--text-18 {
    font-size: 1.125rem;
  }
  .lg--text-20 {
    font-size: 1.25rem;
  }
  .lg--text-24 {
    font-size: 1.5rem;
  }
  .lg--text-28 {
    font-size: 1.75rem;
  }
  .lg--text-32 {
    font-size: 2rem;
  }
  .lg--text-36 {
    font-size: 2.25rem;
  }
  .lg--text-40 {
    font-size: 2.5rem;
  }
  .lg--text-48 {
    font-size: 3rem;
  }
  .lg--text-56 {
    font-size: 3.5rem;
  }
  .lg--text-60 {
    font-size: 3.75rem;
  }
  .lg--text-64 {
    font-size: 4rem;
  }

  .lg--text-no-br br {
    display: none;
  }
  .lg--text-br br {
    display: block;
  }

  .lg--text-start {
    text-align: start !important;
  }
  .lg--text-center {
    text-align: center !important;
  }
  .lg--text-end {
    text-align: end !important;
  }
}

@media screen and (min-width: 1200px) {
  .xl--text-14 {
    font-size: 0.875rem;
  }
  .xl--text-16 {
    font-size: 1rem;
  }
  .xl--text-18 {
    font-size: 1.125rem;
  }
  .xl--text-20 {
    font-size: 1.25rem;
  }
  .xl--text-24 {
    font-size: 1.5rem;
  }
  .xl--text-28 {
    font-size: 1.75rem;
  }
  .xl--text-32 {
    font-size: 2rem;
  }
  .xl--text-36 {
    font-size: 2.25rem;
  }
  .xl--text-40 {
    font-size: 2.5rem;
  }
  .xl--text-48 {
    font-size: 3rem;
  }
  .xl--text-56 {
    font-size: 3.5rem;
  }
  .xl--text-60 {
    font-size: 3.75rem;
  }
  .xl--text-64 {
    font-size: 4rem;
  }

  .xl--text-no-br br {
    display: none;
  }
  .xl--text-br br {
    display: block;
  }

  .xl--text-start {
    text-align: start !important;
  }
  .xl--text-center {
    text-align: center !important;
  }
  .xl--text-end {
    text-align: end !important;
  }
}