/* =========================================================
   layout.css
   ---------------------------------------------------------
   全体レイアウト（共通枠）
   - .wrap（幅と余白）
   - 見出し（h2 / h3）
   - トップナビ（.topnav）
   - ロゴ（h1 / .logo）
   - ページトップ
   ※ セクション固有（featured / ig / tiktok 等）は含めない
   ========================================================= */
body.modal-lock{
  position: fixed;
  width: 100%;
  overflow: hidden;
}
/* =========================================================
   1) Variables / Base
   ========================================================= */
.wrap{
  max-width: var(--max);
  width: 88%;
  margin: 0 auto;
}


/* =========================================================
   3) Headings
   ========================================================= */
h2,
h3{
  margin-bottom: 2rem;
  color: var(--blue);
  text-align: center;
}
h2{
  font-size: 36px;
  text-transform: uppercase;
}
h3{
  font-size: calc(18px * var(--official-font-scale, 1));
}
@media (max-width: 767px){
  /* ---------- Headings ---------- */
  h2{
    font-size: 28px;
  }
  h3{
    font-size: calc(16px * var(--official-font-scale, 1));
  }
}
/* =========================
   4) PageTop
   ========================= */
#page_top {
  position: fixed;
  right: 32px;
  bottom: 32px;
  z-index: 999;
  width: 54px;
  height: 54px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  /* サイト全体の背景色に合わせたグラデーション */
  background: