html {
  font-size: calc(100vw * 16 / 375);

  @media (min-width: 768px) {
    font-size: calc(100vw * 16 / 768);
  }

  @media (min-width: 1240px) {
    font-size: calc(100vw * 18 / 1240);
  }

  @media (min-width: 1440px) {
    font-size: calc(100vw * 20 / 1440);
  }
}

body {
  font-family: Jost, "Noto Serif JP", "Noto Sans", sans-serif;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  position: relative;
  font-size: 1.6rem;
}

h1, h2, h3, h4, h5 {
  font-size: 5rem; /* 50px */
}

.footer {
  background-color: #536A80;
}

.footer>div {
  max-width: 980px;
  margin: 0 auto;
}

@media screen and (min-width: 375px) {
  body {
    font-family: 'Segoe UI', Arial, sans-serif;
    display: flex;
    min-height: 100vh;
    margin: 0 auto; /* 水平中央寄せ */
  }
}

.pc {
  display: none;
}

.sp {
  display: block;
}

@media (min-width: 768px) {
  .pc {
    display: block;
  }

  .sp {
    display: none;
  }
}