@charset "UTF-8";
/* ===== ヘッダー（スクロール追従） ===== */
/* 1920pxのデザイン（ロゴ318.5 / 見出し1020 / CTA480 / 帯の高さ100）を基準に、
   画面幅に比例して3つの画像と白帯の高さを同じ比率で縮める。
   幅は%指定（レイアウト幅基準）、高さだけ%が使えないので同じ比率をcalcで作る。 */
.site-header {
  position: sticky;
  top: 0;
  z-index: 10;
  height: min(100px, max(100vw, var(--w-min)) * 0.052083);
  background: var(--c-white);
  /* ロゴは帯からはみ出してKVに重なる（デザイン準拠） */
}
.site-header__logo {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: min(318.5px, 16.5885%); /* 318.5/1920 */
}
.site-header__logo img {
  width: 100%;
}
.site-header__catch {
  position: absolute;
  left: 44%;
  top: 50%;
  width: min(1020px, 53.125%); /* 1020/1920 */
  transform: translate(-50%, -50%);
}
.site-header__catch img {
  width: 100%;
}
.site-header__cta {
  position: absolute;
  right: min(30px, 1.5625%); /* 30/1920 */
  top: 50%;
  display: block;
  width: min(480px, 25%); /* 480/1920 */
  transform: translateY(-50%);
}
.site-header__cta img {
  width: 100%;
}

/* ===== キービジュアル ===== */
.kv img {
  width: 100%;
}

/* 本文はKVの下端に角丸で重なる */
main {
  position: relative;
  z-index: 1;
  margin-top: -99.5px;
  border-radius: 60px 60px 0 0;
  background: var(--c-white);
}

/* ===== セクション共通 ===== */
.hero,
.recommend,
.about,
.programs,
.points,
.message,
.plan,
.faq {
  position: relative;
}

/* ===== セクション背景 ===== */
/* KVの下から緑セクションまではグリッド（55pxタイル / 線は9px間隔） */
.hero,
.recommend,
.faq {
  /* グリッドは透過素材なので下地の白を敷く（重なった緑が透けないように） */
  background: var(--c-white) url(../images/bg_grid.png) repeat;
}

/* 緑背景（モザイクテクスチャを重ねる） */
.about,
.plan {
  background: var(--c-green) url(../images/bg_dot_green.png) top center/1920.5px 800.5px repeat;
}

/* 水色背景 */
.programs {
  background: var(--c-sky);
}

.points {
  background: var(--c-sky);
}

.message {
  background: var(--c-sky);
}

/* 背景のあるセクションは上端を角丸にして、後ろのセクションを覗かせる */
.hero,
.about,
.programs,
.plan,
.faq {
  border-radius: 60px 60px 0 0;
}

/* ===== セクション見出し（ワードマーク + 和文サブ） ===== */
.sec-head {
  text-align: center;
}
.sec-head__wm {
  margin: 0 auto;
}
.sec-head__sub {
  margin-top: 20.5px;
  font-family: var(--f-round);
  font-weight: 800;
  font-size: 40px;
  line-height: 1;
  letter-spacing: 0.1em;
  text-indent: 0.1em;
}
.sec-head--plan .sec-head__sub {
  color: var(--c-white);
}
.points .sec-head__sub {
  margin-top: 33.5px;
  letter-spacing: 0.0125em;
}
.plan .sec-head__sub {
  margin-top: 35px;
}
.faq .sec-head__sub {
  margin-top: 24px;
  letter-spacing: 0.01em;
}

/* ===== フッター ===== */
.footer {
  padding: 60px 0 60px;
  text-align: center;
}
.footer__logo img {
  margin: 0 auto;
}
.footer__org {
  margin-top: 45px;
  font-size: 20px;
  line-height: 1;
  letter-spacing: 0.04em;
  font-weight: 800;
}
.footer__nav {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 23px;
  font-size: 15px;
  line-height: 1;
}
.footer__nav a {
  text-decoration: underline;
  text-underline-offset: 4px;
}
.footer__copy {
  margin-top: 37px;
  font-size: 11.5px;
  line-height: 1;
}
.footer__disclaimer {
  margin-top: 26.5px;
  font-size: 11.5px;
  line-height: 1.5;
}

/* ===== 画面下部固定のCTA（SPのみ表示） ===== */
.float-cta {
  display: none;
}

/*# sourceMappingURL=layout.css.map */