/* ==========================================================================
   Base
   ========================================================================== */
:root {
  --color-black: #171717;
  --color-red: #b40018;
  --color-beige: #b8957c;
  --color-gray: #e7e7e7;
  --color-dark-gray: #5a5a5a;
  --font-sans: "Noto Sans JP", "Noto Sans CJK JP", sans-serif;
  --font-serif: "Noto Serif JP", "Noto Serif CJK JP", serif;
  --font-en: "Roboto Condensed", "Arial Narrow", Arial, sans-serif;
}

html {
  font-size: 2.0833333333vw;
  scroll-behavior: smooth;
}

body {
  min-width: 320px;
  overflow-x: hidden;
  color: var(--color-black);
  background: #fff;
  font-family: var(--font-sans);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.8;
  letter-spacing: 0.01em;
}

body.is-menu-open {
  overflow: hidden;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

::-moz-selection {
  color: #fff;
  background: var(--color-red);
}

::selection {
  color: #fff;
  background: var(--color-red);
}

@media (min-width: 768px) {
  html {
    font-size: 1.1594202899vw;
  }
}
@media (min-width: 1380px) {
  html {
    font-size: 16px;
  }
}
@media (max-width: 767.98px) {
  body {
    font-size: calc(27.569231 / 16 * 1rem);
  }
}