body {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

:root {
  color-scheme: light;

  --content-width: 1320px;
  --rental-blue: #0070be;
  /* 黄色は「塗り」専用。暗い文字を載せれば 17.47:1 だが、
     白地に線として引くと 1.07:1 でほぼ見えない。ボーダーには使わないこと。 */
  --rental-yellow: #ffff23;
  --content-bg-color-blue: #eaf8fa;
  /* 明るい地の上で使うサブカラー。白 4.87:1 / 淡青 4.47:1（旧 #56a0d4 は 2.85:1 で AA 未達）。 */
  --rental-light-blue: #2f76ad;
  /* 黒地（フルスクリーンメニュー）専用。明るい地用のトークンは暗い地では 4.32:1 で足りないため分ける。 */
  --rental-blue-on-dark: #8cc3e8;
}

.main {
  padding-top: 76px;
}

.hero-container,
.about-container,
.purpose-container,
.equipment-container,
.price-container,
.caution-container,
.faq-container,
.access-container {
  scroll-margin-top: 96px;
}

.admin-bar .hero-container,
.admin-bar .about-container,
.admin-bar .purpose-container,
.admin-bar .equipment-container,
.admin-bar .price-container,
.admin-bar .caution-container,
.admin-bar .faq-container,
.admin-bar .access-container {
  scroll-margin-top: 128px;
}

.pc-none {
  display: none;
}

.sp-none {
  display: block;
}

.content-wrapper {
  max-width: var(--content-width);
  margin: 0 auto;
  padding: 80px 160px;
}

.content-header {
  position: relative;
  color: var(--rental-blue);
}

.content-header-wrapper {
  width: 100%;
  overflow: hidden;
}

.content-header .title-ja {
  position: relative;
  font-size: 46px;
  z-index: 2;
}

.content-header .title-en {
  position: relative;
  font-size: 24px;
  display: block;
  color: var(--rental-light-blue);
  z-index: 2;
}

.content-header-wrapper::after {
  content: '////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////';
  letter-spacing: 0.05em;
  font-size: 12px;
  margin-top: 8px;
  display: block;
  color: var(--rental-light-blue);
}

@media screen and (max-width: 767px) {
  .pc-none {
    display: block;
  }

  .sp-none {
    display: none;
  }

  .main {
    padding-top: 64px;
  }

  .hero-container,
  .about-container,
  .purpose-container,
  .equipment-container,
  .price-container,
  .caution-container,
  .faq-container,
  .access-container {
    scroll-margin-top: 80px;
  }

  .admin-bar .hero-container,
  .admin-bar .about-container,
  .admin-bar .purpose-container,
  .admin-bar .equipment-container,
  .admin-bar .price-container,
  .admin-bar .caution-container,
  .admin-bar .faq-container,
  .admin-bar .access-container {
    scroll-margin-top: 126px;
  }

  .content-wrapper {
    padding: 40px 20px;
  }

  .content-header .title-ja {
    font-size: 28px;
  }

  .content-header .title-en {
    font-size: 13px;
  }

  .content-header-wrapper::after {
    font-size: 10px;
  }
}
