/*
 * header / MV / アンカーナビ / 追従CTA
 *
 * 数値はすべて Figma の設計値をそのまま rem 換算（1rem = 10px）している。
 *   PC: パルシステムLP_PC   1728px 幅（node 473-17）
 *   SP: パルシステムLP_SP    390px 幅（node 482-11070）
 * PC は 1728px フレーム内で MV / 追従CTA が 1360px 幅、
 * アンカーナビが 1200px 幅の中央寄せになっている。
 */

.mv,
.follow-cta {
  width: 100%;
}

@media (min-width: 768px) {
  .mv,
  .follow-cta {
    max-width: 136rem;
    margin-left: auto;
    margin-right: auto;
  }
}

/* ============ header ============ */
.header {
  position: relative;
  overflow: hidden;
}

/* 上部の赤い帯（中央に凹みのある Subtract シェイプ） */
.header__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.header__logo img,
.header__badge img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.header__nav-list {
  display: flex;
  align-items: center;
  list-style: none;
}

.header__nav-item a {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-family: var(--font-family-base);
  font-weight: 700;
  font-size: 1.6rem;
  line-height: 1;
  color: var(--color-primary);
  white-space: nowrap;
}

.header__nav-dot {
  width: 0.8rem;
  height: 0.8rem;
}

.header__menu {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.header__menu-line {
  display: block;
  width: 3rem;
  height: 0.2rem;
  border-radius: 1rem;
  background-color: var(--color-primary);
}

.header__menu-line + .header__menu-line {
  margin-top: 0.6rem;
}

/* Figma: 3本目だけ 18px と短い（1・2本目は 30px）。
   同じ親に MENU ラベルの span があるため :last-of-type では拾えず、修飾子で指定する */
.header__menu-line--short {
  width: 1.8rem;
}

.header__menu-label {
  margin-top: 0.5rem;
  font-family: var(--font-family-en);
  font-weight: 500;
  font-size: 1.1rem;
  line-height: 1;
  letter-spacing: -0.055rem;
  color: var(--color-primary);
}

/* ============ SPドロワーメニュー ============ */
body.is-drawer-open {
  overflow: hidden;
}

.sp-drawer[hidden] {
  display: none;
}

.sp-drawer {
  position: fixed;
  z-index: 200;
  inset: 0;
  height: 100vh;
  height: 100dvh;
  background-color: rgba(0, 0, 0, 0.7);
  -webkit-backdrop-filter: blur(0.15rem);
  backdrop-filter: blur(0.15rem);
}

.sp-drawer__close {
  position: absolute;
  right: 1rem;
  top: 2.18rem;
  display: flex;
  width: 3.1rem;
  flex-direction: column;
  align-items: center;
  color: var(--color-white);
}

.sp-drawer__close-icon {
  position: relative;
  display: block;
  width: 3rem;
  height: 2.2rem;
}

.sp-drawer__close-icon::before,
.sp-drawer__close-icon::after {
  content: '';
  position: absolute;
  left: 0;
  top: 1rem;
  width: 3rem;
  height: 0.2rem;
  background-color: var(--color-white);
}

.sp-drawer__close-icon::before { transform: rotate(45deg); }
.sp-drawer__close-icon::after { transform: rotate(-45deg); }

.sp-drawer__close-label {
  margin-top: 0.2rem;
  font-family: var(--font-family-en);
  font-weight: 500;
  font-size: 1rem;
  line-height: 1;
  letter-spacing: -0.05rem;
}

.sp-drawer__panel {
  position: absolute;
  right: 1rem;
  top: 7.4rem;
  width: 24.8rem;
  height: 18.4rem;
  padding: 2.4rem;
  border-radius: 1rem;
  background-color: var(--color-primary);
}

.sp-drawer__list {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  list-style: none;
}

.sp-drawer__link {
  display: flex;
  width: 20rem;
  height: 4rem;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  background-color: var(--color-white);
  color: var(--color-primary);
  font-family: var(--font-family-base);
  font-weight: 700;
  font-size: 1.4rem;
  line-height: 1.4;
}

.sp-drawer__close:focus-visible,
.sp-drawer__link:focus-visible {
  outline: 0.2rem solid var(--color-white);
  outline-offset: 0.2rem;
}

@media (max-width: 767px) {
  .header {
    height: 6.8rem;
  }

  .header__bg {
    height: 1.6rem;
    background-image: url('../images/header-bg-sp.svg');
  }

  .header__logo {
    position: absolute;
    left: 1rem;
    top: 2.6rem;
    width: 12.8rem;
    height: 3.2rem;
  }

  .header__badge {
    position: absolute;
    left: 15rem;
    top: 1.6rem;
    width: 9.8rem;
    height: 5.2rem;
  }

  .header__menu {
    position: absolute;
    left: 34.9rem;
    top: 2.5rem;
  }

}

@media (min-width: 768px) {
  .header {
    height: 11.6rem;
  }

  .header__bg {
    height: 4rem;
    background-image: url('../images/header-bg-pc.svg');
  }

  .header__logo {
    position: absolute;
    left: 18.4rem;
    top: 4rem;
    width: 25.8rem;
    height: 6.4rem;
  }

  .header__badge {
    position: absolute;
    left: 47.4rem;
    top: 2.8rem;
    width: 16.5rem;
    height: 8.8rem;
  }

  .header__nav {
    position: absolute;
    right: 18.4rem;
    top: 6.4rem;
  }

  .header__nav-list {
    gap: 3.2rem;
  }
}

/* ============ MV ============ */
.mv {
  position: relative;
}

.mv__photo {
  position: absolute;
  overflow: hidden;
}

/*
 * 画像は Figma のクロップ（拡大率・オフセット）をそのまま再現する。
 * object-fit: cover では Figma と同じトリミングにならないため、
 * 元画像を実寸比率で配置して枠でクリップしている。
 */
.mv__photo img {
  position: absolute;
  display: block;
  max-width: none;
}

.mv__catch {
  position: absolute;
}

.mv__catch-sub,
.mv__catch-main,
.mv__catch-brand {
  background-color: var(--color-white);
  font-family: var(--font-family-base);
  font-weight: 700;
  text-align: center;
  white-space: nowrap;
}

.mv__catch-sub,
.mv__catch-main {
  color: var(--color-text);
}

.mv__catch-brand {
  color: var(--color-primary);
}

.mv__notice {
  position: absolute;
}

.mv__notice-bubble {
  display: block;
  width: 100%;
  height: auto;
}

.mv__notice-text {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-text);
  line-height: 1.4;
  text-align: center;
}

.mv__more {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-primary);
  color: var(--color-white);
  font-family: var(--font-family-base);
  font-weight: 700;
  line-height: 1.4;
}

.mv__more-arrow {
  position: absolute;
}

@media (max-width: 767px) {
  .mv {
    height: 60.4rem;
    margin-top: 1.2rem;
  }

  .mv__photo--hero {
    left: 2rem;
    top: 0;
    width: 35rem;
    height: 28rem;
    border-radius: 0.8rem;
  }

  .mv__photo--hero img {
    width: 122.65%;
    height: 102.14%;
    left: -3.44%;
    top: -2.14%;
  }

  .mv__photo--office {
    left: 2rem;
    top: 29rem;
    width: 12rem;
    height: 14.4rem;
    border-radius: 0.8rem;
  }

  .mv__photo--office img {
    width: 189.75%;
    height: 105.61%;
    left: -63.02%;
    top: -4.17%;
  }

  .mv__photo--bag {
    left: 2rem;
    top: 44.4rem;
    width: 13.6rem;
    height: 16rem;
    border-radius: 0.8rem;
  }

  .mv__photo--bag img {
    width: 209.32%;
    height: 118.75%;
    left: -32.15%;
    top: -14.38%;
  }

  .mv__photo--carrier {
    left: 16.6rem;
    top: 44.4rem;
    width: 20.4rem;
    height: 16rem;
    border-radius: 0.8rem;
  }

  .mv__photo--carrier img {
    width: 149.65%;
    height: 127.44%;
    left: -3.57%;
    top: -3.69%;
  }

  .mv__catch {
    left: 2.8rem;
    top: 14.8rem;
  }

  /* 3枚の白帯は左端を 0 / 8px / 18px と段違いに配置する */
  /* font-size は最大の span に合わせる（行ボックスの基準を揃えて縦位置を確定させるため） */
  .mv__catch-sub {
    width: 21.5rem;
    height: 4rem;
    padding-left: 1.3rem;
    font-size: 2.8rem;
    line-height: 4rem;
    border-radius: 0.4rem;
  }

  .mv__catch-main {
    width: 28.7rem;
    height: 3.6rem;
    padding-left: 1.3rem;
    margin: 0.4rem 0 0 0.8rem;
    border-radius: 0.4rem;
    font-size: 2rem;
    line-height: 3.6rem;
  }

  .mv__catch-brand {
    width: 27.6rem;
    height: 3.6rem;
    margin: 0.4rem 0 0 1.8rem;
    border-radius: 0.4rem;
    font-size: 2rem;
    line-height: 3.6rem;
  }

  .mv__catch-sub-em--me,
  .mv__catch-sub-em--child {
    font-size: 2.8rem;
  }

  .mv__catch-sub-joint {
    font-size: 2rem;
  }

  .mv__notice {
    left: 15rem;
    top: 29rem;
    width: 22rem;
  }

  .mv__notice-text {
    padding-top: 1.2rem;
    font-size: 1.4rem;
  }

  .mv__more {
    left: 15rem;
    top: 39rem;
    width: 22rem;
    height: 4.4rem;
    font-size: 1.6rem;
    border-radius: 0.5rem;
  }

  .mv__more-arrow {
    right: 1.2rem;
    width: 2rem;
    height: 2rem;
  }
}

@media (min-width: 768px) {
  .mv {
    height: 72rem;
    margin-top: 2.8rem;
  }

  .mv__photo--office {
    left: 0;
    top: 0;
    width: 29.6rem;
    height: 38.4rem;
    border-radius: 2rem;
  }

  .mv__photo--office img {
    width: 197.3%;
    height: 101.36%;
    left: -60.81%;
    top: -0.03%;
  }

  .mv__photo--bag {
    left: 109.6rem;
    top: 0;
    width: 26.4rem;
    height: 50.4rem;
    border-radius: 2rem;
  }

  .mv__photo--bag img {
    width: 288.71%;
    height: 100.79%;
    left: -66.7%;
    top: -0.4%;
  }

  .mv__photo--hero {
    left: 31.4rem;
    top: 0;
    width: 76.6rem;
    height: 72rem;
    border-radius: 2rem;
  }

  .mv__photo--hero img {
    width: 143.92%;
    height: 102.32%;
    left: -6.51%;
    top: -0.65%;
  }

  .mv__photo--carrier {
    left: 0;
    top: 40rem;
    width: 29.6rem;
    height: 32rem;
    border-radius: 2rem;
  }

  .mv__photo--carrier img {
    width: 186.03%;
    height: 114.69%;
    left: -30.18%;
    top: 0;
  }

  .mv__catch {
    left: 16rem;
    top: 46.2rem;
  }

  /* 3枚の白帯は左端を 0 / 22px / 44px と段違いに配置する */
  /* font-size は最大の span に合わせる（行ボックスの基準を揃えて縦位置を確定させるため） */
  .mv__catch-sub {
    width: 34.6rem;
    height: 6.4rem;
    padding-left: 2.1rem;
    font-size: 4.4rem;
    line-height: 6.4rem;
    border-radius: 0.8rem;
  }

  .mv__catch-main {
    width: 51.9rem;
    height: 5.9rem;
    padding-left: 2.1rem;
    margin: 1rem 0 0 2.2rem;
    border-radius: 0.8rem;
    font-size: 3.6rem;
    line-height: 5.9rem;
  }

  .mv__catch-brand {
    width: 49.7rem;
    height: 5.9rem;
    margin: 1rem 0 0 4.4rem;
    border-radius: 0.8rem;
    font-size: 3.6rem;
    line-height: 5.9rem;
  }

  .mv__catch-sub-em--me {
    font-size: 4.3rem;
  }

  .mv__catch-sub-em--child {
    font-size: 4.4rem;
  }

  .mv__catch-sub-joint {
    font-size: 3.6rem;
  }

  .mv__notice {
    left: 109.6rem;
    top: 52.8rem;
    width: 26.4rem;
  }

  .mv__notice-text {
    padding-top: 1.8rem;
    font-size: 1.8rem;
  }

  .mv__more {
    left: 109.6rem;
    top: 66.4rem;
    width: 26.4rem;
    height: 5.6rem;
    font-size: 1.8rem;
    border-radius: 1rem;
  }

  .mv__more-arrow {
    right: 1.6rem;
    width: 2.4rem;
    height: 2.4rem;
  }
}

/* ============ アンカーナビゲーション ============ */
.anchor-nav__list {
  list-style: none;
}

.anchor-nav__link {
  position: relative;
  display: block;
  background-color: var(--color-white);
  border-bottom-left-radius: 1rem;
  border-bottom-right-radius: 1rem;
}

/* カード上端のカラー帯 */
.anchor-nav__strip {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.anchor-nav__main {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.8rem;
  font-family: var(--font-family-base);
  font-weight: 700;
  line-height: 1;
}

.anchor-nav__arrow {
  display: block;
}

.anchor-nav__sub {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: 6rem;
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  text-align: center;
}

.anchor-nav__item--women .anchor-nav__main { color: #fb629a; }
.anchor-nav__item--junior .anchor-nav__main { color: #ff7f24; }
.anchor-nav__item--birth .anchor-nav__main { color: #fbbf1c; }

.anchor-nav__item--women .anchor-nav__sub { background-color: #ffecf3; }
.anchor-nav__item--junior .anchor-nav__sub { background-color: #ffe9da; }
.anchor-nav__item--birth .anchor-nav__sub { background-color: #fef2d2; }

@media (max-width: 767px) {
  .anchor-nav {
    margin-top: 2.5rem;
    padding: 0 2rem;
  }

  .anchor-nav__list {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
  }

  .anchor-nav__link {
    box-shadow: 0 0.2rem 0.3rem 0 rgba(226, 203, 209, 0.6);
    padding-top: 1.5rem;
    padding-bottom: 1.4rem;
  }

  .anchor-nav__strip {
    height: 1.2rem;
  }

  .anchor-nav__item--women .anchor-nav__strip {
    background-image: url('../images/anker-subtract-pink-sp.svg');
  }

  .anchor-nav__item--junior .anchor-nav__strip {
    background-image: url('../images/anker-subtract-orange-sp.svg');
  }

  .anchor-nav__item--birth .anchor-nav__strip {
    background-image: url('../images/anker-subtract-yellow-sp.svg');
  }

  .anchor-nav__main {
    font-size: 2rem;
  }

  .anchor-nav__arrow {
    width: 2rem;
    height: 2rem;
  }

  .anchor-nav__sub {
    margin-top: 0.9rem;
    width: 30.2rem;
    height: 2.2rem;
    line-height: 2.2rem;
    font-size: 1.4rem;
  }
}

@media (min-width: 768px) {
  .anchor-nav {
    margin-top: 4rem;
  }

  .anchor-nav__list {
    display: flex;
    gap: 2.4rem;
    max-width: 120rem;
    margin-left: auto;
    margin-right: auto;
  }

  .anchor-nav__item {
    width: 38.4rem;
  }

  .anchor-nav__link {
    box-shadow: 0 0.4rem 0.4rem 0 rgba(226, 203, 209, 0.6);
    padding-top: 1.8rem;
    padding-bottom: 1.6rem;
  }

  .anchor-nav__strip {
    height: 1.6rem;
  }

  .anchor-nav__item--women .anchor-nav__strip {
    background-image: url('../images/anker-subtract-pink.svg');
  }

  .anchor-nav__item--junior .anchor-nav__strip {
    background-image: url('../images/anker-subtract-orange.svg');
  }

  .anchor-nav__item--birth .anchor-nav__strip {
    background-image: url('../images/anker-subtract-yellow.svg');
  }

  .anchor-nav__main {
    font-size: 2.8rem;
  }

  .anchor-nav__arrow {
    width: 2.4rem;
    height: 2.4rem;
  }

  .anchor-nav__sub {
    margin-top: 1rem;
    width: 33.6rem;
    height: 2.4rem;
    line-height: 2.4rem;
    font-size: 1.6rem;
  }
}

/* ============ 追従CTA ============ */
/*
 * Figma では背景の赤い矩形のみ不透明度95%。
 * 要素全体に opacity を掛けると白ボタンまで透けるため、背景色側で表現する。
 */
.follow-cta {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 100;
  background-color: rgba(230, 0, 18, 0.95);
  transform: translateY(100%);
  visibility: hidden;
  transition: transform 0.3s ease, visibility 0.3s ease;
}

.follow-cta.is-visible {
  transform: translateY(0);
  visibility: visible;
}

.follow-cta__text {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-white);
  font-family: var(--font-family-base);
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}

.follow-cta__ear {
  display: block;
  margin-right: 1.1rem;
}

.follow-cta__ear--right {
  margin-right: 0;
  margin-left: 0.3rem;
  transform: scaleX(-1);
}

.follow-cta__buttons {
  display: flex;
}

.follow-cta__button {
  display: flex;
  align-items: center;
  background-color: var(--color-white);
  color: var(--color-primary);
  font-family: var(--font-family-base);
  font-weight: 700;
  line-height: 1.4;
}

.follow-cta__arrow {
  display: block;
  flex-shrink: 0;
}

@media (max-width: 767px) {
  /*
   * 高さ 11rem の内訳:
   * padding-top 1.2 + テキスト2行 4.0（1.6 × 1.25 × 2）+ ボタン上マージン 1.0
   * + ボタン 4.0 + 下余白 0.8。
   */
  .follow-cta {
    height: 11rem;
    border-radius: 1rem;
  }

  /*
   * テキストは 2行組み（.follow-cta__text-line を縦積み）。
   * 最長行「生協未加入の方も生協加入と同時に手続き可能！」は全角22字あり、
   * 1.8rem だと 39.6rem で 390px 幅を超えるため 1.6rem（35.2rem）にする。
   */
  .follow-cta__text {
    flex-direction: column;
    padding-top: 1.2rem;
    font-size: 1.6rem;
    line-height: 1.25;
    transform: translateX(0.3rem);
  }

  .follow-cta__ear {
    width: 2.75rem;
    height: 2rem;
  }

  .follow-cta__buttons {
    gap: 0.4rem;
    margin-top: 1rem;
    padding-left: 1rem;
  }

  /* SP はテキスト左寄せ・矢印右寄せ（両端揃え） */
  .follow-cta__button {
    justify-content: space-between;
    height: 4rem;
    padding-right: 0.8rem;
    border-radius: 0.5rem;
    font-size: 1.4rem;
  }

  .follow-cta__button--document {
    width: 16.2rem;
    padding-left: 2.2rem;
  }

  .follow-cta__button--quote {
    width: 20.3rem;
    padding-left: 2.1rem;
  }

  .follow-cta__arrow {
    width: 2rem;
    height: 2rem;
  }
}

@media (min-width: 768px) {
  .follow-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 9.6rem;
    bottom: 1.3rem;
    /* 左のみ 3.3rem。長文化したテキストの逃げ幅を確保する（先方モック実測値） */
    padding: 0 8rem 0 3.3rem;
    border-radius: 1rem;
    transform: translateY(calc(100% + 1.3rem));
  }

  .follow-cta__text {
    font-size: 1.6rem;
    line-height: 1;
  }

  .follow-cta__ear {
    width: 3.3rem;
    height: 2.4rem;
  }

  .follow-cta__buttons {
    gap: 1.2rem;
  }

  /* PC はテキストをボタン中央に置き、矢印だけ右端に固定 */
  .follow-cta__button {
    position: relative;
    justify-content: center;
    width: 31.6rem;
    height: 5.6rem;
    border-radius: 1rem;
    font-size: 1.8rem;
  }

  .follow-cta__arrow {
    position: absolute;
    right: 1.6rem;
    width: 2.4rem;
    height: 2.4rem;
  }
}

/* ============ TOPへ戻るボタン ============ */
/*
 * Figma にデザインが無い要素のため、形状は支給イメージからの採寸値を設計値として使う。
 *   角丸はボタン辺長の10.2%
 * 矢印は視認性を上げるため採寸値より太く・大きくしている
 * （アイコン＝辺長の0.5倍・線幅 2.8/24・シェブロン幅は辺長の約34%）
 * 配色は赤地（--color-primary）＋白の矢印と枠線で、ホバーで白地＋赤に反転する。
 * 枠線を地色と逆に持たせているのは、赤帯（footerのコピーライト行）や赤い追従CTAと
 * 重なったときに輪郭が消えないようにするため。
 * 表示トリガーは追従CTAと同じ（MVを通り過ぎたら）なので、
 * bottom は「追従CTAの高さ＋余白（PC 1.6rem / SP 0.8rem）」の固定値で常にCTAの上に載る。
 */
.page-top {
  position: fixed;
  z-index: 99;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0.2rem solid var(--color-white);
  background-color: var(--color-primary);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease, background-color 0.2s ease, border-color 0.2s ease;
}

.page-top.is-visible {
  opacity: 1;
  visibility: visible;
}

/*
 * ホバーは base.css の a:hover { opacity: 0.7 } を打ち消し、赤地→白地に反転させる。
 * 不透明度を下げるだけでは背景との差が小さく、変化がほとんど見えないため。
 */
@media (hover: hover) {
  .page-top.is-visible:hover {
    opacity: 1;
    border-color: var(--color-primary);
    background-color: var(--color-white);
  }

  .page-top.is-visible:hover .page-top__icon {
    filter: none;
  }
}

/*
 * 矢印の SVG は赤（ホバー時の色）を原本にしている。
 * 通常状態の白い矢印は brightness(0) で黒化 → invert(1) で白へ反転させて作る
 * （<img> なので CSS で塗り替えられないため）。
 */
.page-top__icon {
  display: block;
  filter: brightness(0) invert(1);
  transition: filter 0.2s ease;
}

@media (max-width: 767px) {
  /*
   * 追従CTA（height: 11rem / bottom: 0）の上に 0.8rem 空けて置く。
   * 右端は 0.8rem まで詰め、ページ最下部でコピーライト文の末尾に重ならないようにしている
   * （390px で約1rem の余白が空く）。合わせてボタン自体も PC より一回り小さくする。
   */
  .page-top {
    right: 0.4rem;
    bottom: 11.8rem;
    width: 4rem;
    height: 4rem;
    border-radius: 0.4rem;
  }

  .page-top__icon {
    width: 2rem;
    height: 2rem;
  }
}

@media (min-width: 768px) {
  /* 追従CTA（height: 9.6rem / bottom: 1.3rem）の上に 1.6rem 空けて置く */
  .page-top {
    /*
     * 追従CTA は max-width: 136rem の中央寄せなので、ビューポート右端を基準にすると
     * 1360px より広い画面で CTA から大きく離れて浮いてしまう。
     * 版面（136rem）の右端にボタンの右端を揃え、
     * 版面が画面幅いっぱいになる狭い側では 0 を下限として使う。
     */
    right: max(0rem, calc(50% - 68rem));
    bottom: 12.5rem;
    width: 6rem;
    height: 6rem;
    border-radius: 0.6rem;
  }

  .page-top__icon {
    width: 3rem;
    height: 3rem;
  }
}

/*
 * 権威訴求 / 女性コース
 *
 * 数値はすべて Figma の設計値をそのまま rem 換算（1rem = 10px）している。
 *   PC: 権威訴求 node 587-5469（920×224）/ 女性コース node 587-5143（1200×4057）
 *   SP: 権威訴求 node 591-12585（350×168）/ 女性コース node 591-11631（350×3607）
 * どちらも Figma のフレーム内で座標を持つ要素が多いため、
 * header / MV と同様に「枠を position: relative、中身を position: absolute」で組んでいる。
 */

/* ============ 権威訴求 ============ */
.authority {
  position: relative;
}

/* 白いカード。金メダルが上にはみ出すぶん、カード上端はセクション上端より下がる */
.authority::before {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: var(--color-white);
}

.authority__badge {
  position: absolute;
  overflow: hidden;
}

/* Figma のクロップ（拡大率・オフセット）をそのまま再現する */
.authority__badge img {
  position: absolute;
  display: block;
  max-width: none;
  width: 111.3%;
  height: 100.5%;
  left: -6.32%;
  top: -0.5%;
}

.authority__underline,
.authority__jcsi {
  position: absolute;
}

.authority__lead,
.authority__title,
.authority__note {
  position: absolute;
  font-family: var(--font-family-base);
  line-height: 1;
  white-space: nowrap;
}

.authority__lead {
  font-weight: 500;
  color: var(--color-text);
}

.authority__title {
  font-weight: 700;
  color: var(--color-primary);
}

.authority__note {
  font-weight: 400;
  color: var(--color-text);
}

/* 「第 1 位」は3要素で文字サイズが異なるため、個別に配置する */
.authority__rank {
  position: absolute;
  left: 0;
  top: 0;
}

.authority__rank-prefix,
.authority__rank-suffix,
.authority__rank-num {
  position: absolute;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

.authority__rank-prefix,
.authority__rank-suffix {
  font-family: var(--font-family-base);
  color: var(--color-text);
}

.authority__rank-num {
  font-family: var(--font-family-serif-en);
  color: var(--color-primary);
}

@media (max-width: 767px) {
  .authority {
    width: calc(100% - 4rem);
    max-width: 35rem;
    height: 16.8rem;
    margin: 2.4rem auto 0;
  }

  .authority::before {
    height: 15.1rem;
    border-radius: 0.5rem;
  }

  .authority__badge {
    left: 2.4rem;
    top: 0;
    width: 12.5rem;
    height: 11.2rem;
  }

  .authority__lead {
    left: 16.1rem;
    top: 3.3rem;
    font-size: 1.2rem;
    letter-spacing: -0.048rem;
  }

  .authority__underline {
    left: 15.8rem;
    top: 5rem;
    width: 16.8rem;
    height: 0.5rem;
  }

  .authority__title {
    left: 17.2rem;
    top: 5.7rem;
    font-size: 2.7rem;
    letter-spacing: 0.081rem;
  }

  .authority__rank-prefix {
    left: 20.6rem;
    top: 13.3rem;
    font-size: 2rem;
  }

  .authority__rank-num {
    left: 22.6rem;
    top: 8.6rem;
    font-size: 8rem;
  }

  .authority__rank-suffix {
    left: 26rem;
    top: 13.3rem;
    font-size: 2rem;
  }

  .authority__note {
    left: 2.4rem;
    top: 11.7rem;
    width: 10.6rem;
    font-size: 1rem;
    line-height: 1.3;
    white-space: normal;
  }

  .authority__jcsi {
    left: 13.4rem;
    top: 11.4rem;
    width: 3.1rem;
    height: 3.5rem;
  }
}

@media (min-width: 768px) {
  .authority {
    width: 92rem;
    height: 22.4rem;
    margin: 4.8rem auto 0;
  }

  .authority::before {
    height: 19.4rem;
    border-radius: 1rem;
  }

  .authority__badge {
    left: 5.7rem;
    top: 0;
    width: 22.3rem;
    height: 20rem;
  }

  .authority__lead {
    left: 31.4rem;
    top: 6.4rem;
    font-size: 2rem;
  }

  .authority__underline {
    left: 31rem;
    top: 9.3rem;
    width: 28.8rem;
    height: 0.954rem;
  }

  .authority__title {
    left: 32.1rem;
    top: 10.5rem;
    font-size: 5.2rem;
    letter-spacing: 0.156rem;
  }

  .authority__rank-prefix {
    left: 60.1rem;
    top: 12.1rem;
    font-size: 3.6rem;
  }

  .authority__rank-num {
    left: 63.7rem;
    top: 6.2rem;
    font-size: 11.2rem;
  }

  .authority__rank-suffix {
    left: 68.8rem;
    top: 12.1rem;
    font-size: 3.6rem;
  }

  .authority__note {
    left: 29.6rem;
    top: 17.4rem;
    font-size: 1.6rem;
  }

  .authority__jcsi {
    left: 75.8rem;
    top: 7rem;
    width: 10.6rem;
    height: 12rem;
  }
}

/* ============ 女性コース ============ */
/* パネル内の見出し下線（疑似要素・z-index: -1）を白背景より前に出すため、
   パネル側でスタッキングコンテキストを作る */
.women-course__panel {
  position: relative;
  z-index: 0;
}

.women-course__panel + .women-course__panel {
  margin-top: 0.4rem;
}

.women-course__panel--intro,
.women-course__panel--hospital,
.women-course__panel--pregnancy,
.women-course__panel--surgery {
  background-color: var(--color-white);
}

/* 保障表パネルは CTA が白カードの下端からはみ出すため、下地を疑似要素で敷く。
   見出しの下線バー（z-index: -1）より更に奥に置く */
.women-course__panel--plan::before {
  content: '';
  position: absolute;
  z-index: -2;
  left: 0;
  top: 0;
  width: 100%;
  background-color: var(--color-white);
}

/* ---- 1. コース概要 ---- */
.women-course__intro-bg,
.women-course__intro-sub,
.women-course__intro-title,
.women-course__intro-illust,
.women-course__intro-logo,
.women-course__condition,
.women-course__conditions-note {
  position: absolute;
}

.women-course__intro-bg {
  left: 0;
  top: 0;
  width: 100%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.women-course__intro-sub {
  background-color: var(--color-women-light);
  border-radius: 6rem;
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  text-align: center;
  white-space: nowrap;
}

.women-course__intro-title {
  left: 0;
  width: 100%;
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-white);
  text-align: center;
  white-space: nowrap;
}

.women-course__intro-illust,
.women-course__intro-logo {
  overflow: hidden;
}

/* Figma のクロップ（拡大率・オフセット）をそのまま再現する */
.women-course__intro-illust img,
.women-course__intro-logo img {
  position: absolute;
  display: block;
  max-width: none;
}

.women-course__intro-illust img {
  width: 136.55%;
  height: 187.27%;
  left: -21.06%;
  top: -54.08%;
}

.women-course__intro-logo img {
  width: 109.95%;
  height: 106.99%;
  left: -6.97%;
  top: -5.94%;
}

.women-course__condition {
  background-color: var(--color-women-light);
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  text-align: center;
}

.women-course__mark {
  font-weight: 400;
  color: var(--color-text-sub);
}

.women-course__conditions-note {
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 400;
  color: var(--color-text-sub);
  line-height: 1;
  white-space: nowrap;
}

/* ---- 共通の見出し（下線バー付き） ---- */
.women-course__heading {
  position: absolute;
  left: 0;
  width: 100%;
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-text);
  line-height: 1.5;
  text-align: center;
  white-space: nowrap;
}

/* 見出し文字の後ろに敷く淡いピンクのバー。幅と左オフセットは見出しごとに異なる */
.women-course__heading::before {
  content: '';
  position: absolute;
  z-index: -1;
  left: 50%;
  width: var(--bar-width);
  margin-left: var(--bar-offset);
  background-color: var(--color-women-light);
}

.women-course__heading-note {
  position: absolute;
  font-family: var(--font-family-base);
  font-weight: 400;
  color: var(--color-text-sub);
  line-height: 1.5;
  white-space: nowrap;
}

/* ---- 2. 入院保障 ---- */
.women-course__plan-label,
.women-course__case-label {
  position: absolute;
  /* Figma では白カードの上に重なる見出しピル。DOM 順ではカードが後に来るため、
     z-index を上げないとカードに隠れてしまう */
  z-index: 1;
  background-color: var(--color-women);
  border-radius: 8rem;
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-white);
  text-align: center;
  white-space: nowrap;
}

.women-course__plan-card,
.women-course__case-card,
.women-course__voice-card {
  position: absolute;
  background-color: var(--color-white);
  border-style: solid;
  border-color: var(--color-women);
}

.women-course__plan-subject,
.women-course__plan-term,
.women-course__plan-unit,
.women-course__plan-amount,
.women-course__plan-yen,
.women-course__plan-mark,
.women-course__plan-note,
.women-course__plan-divider,
.women-course__plan-lead,
.women-course__balloon {
  position: absolute;
}

.women-course__plan-subject,
.women-course__plan-term {
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  color: var(--color-text);
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}

.women-course__plan-subject {
  font-weight: 700;
}

.women-course__plan-term {
  font-weight: 500;
}

.women-course__em {
  color: var(--color-primary);
}

.women-course__plan-unit,
.women-course__plan-yen {
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-text);
  line-height: 1;
}

.women-course__plan-amount {
  font-family: var(--font-family-en);
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1;
}

.women-course__plan-mark,
.women-course__plan-note {
  font-family: var(--font-family-base);
  font-weight: 400;
  color: var(--color-text-sub);
  line-height: 1.5;
  white-space: nowrap;
}

.women-course__plan-divider {
  background-color: var(--color-women-light);
  border-radius: 1rem;
}

.women-course__plan-lead {
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  line-height: 1.5;
}

.women-course__balloon {
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-women);
  text-align: center;
  white-space: nowrap;
}

.women-course__bracket {
  position: absolute;
}

.women-course__bracket--right,
.women-course__bracket--addon-right {
  transform: scaleX(-1);
}

.women-course__cost {
  position: absolute;
  border-radius: 50%;
  background-color: var(--color-women-light);
}

.women-course__cost-arc,
.women-course__cost-illust {
  position: absolute;
}

.women-course__cost-label {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  text-align: center;
  white-space: nowrap;
}

/* ---- 3. 妊娠中の加入 ---- */
.women-course__voice-title,
.women-course__voice-photo,
.women-course__voice-text,
.women-course__voice-notes {
  position: absolute;
}

.women-course__voice-photo {
  z-index: 1;
}

.women-course__voice-title {
  z-index: 1;
  background-color: var(--color-women);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-white);
  text-align: center;
  white-space: nowrap;
}

/* 写真の円から少しずらして覗くピンクの円 */
.women-course__voice-photo::before {
  content: '';
  position: absolute;
  border-radius: 50%;
  background-color: var(--color-women);
}

.women-course__voice-photo-frame {
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  border-radius: 50%;
  background-color: var(--color-women-pale);
}

.women-course__voice-photo-frame img {
  position: absolute;
  display: block;
  max-width: none;
  width: 218.51%;
  height: 150.14%;
  left: -26.37%;
  top: -3.35%;
}

.women-course__voice-tail {
  position: absolute;
}

/*
 * 手書きノート風の破線。行送りごとに1本ずつ引くため、
 * 「縦方向に1pxのライン」を敷いた上に「白い縦ストライプ」を重ねて破線に見せている
 * （カード背景が白なので、ストライプ部分は下地と同化する）。
 */
.women-course__voice-text {
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  background-repeat: repeat;
  /*
   * 罫線は各行の下端に来るため、最終行の1本がボックス下端で切れて描かれない。
   * 背景はパディングボックスまで塗られるので、下に余白を足して1本ぶんの逃げを作る
   * （絶対配置なので後続要素のレイアウトには影響しない）
   */
  padding-bottom: 0.4rem;
}

.women-course__voice-copy--sp {
  white-space: normal;
}

.women-course__voice-em {
  color: var(--color-women);
}

.women-course__voice-notes {
  font-family: var(--font-family-base);
  font-weight: 400;
  color: var(--color-text-sub);
  line-height: 1.5;
}

.women-course__voice-notes li {
  padding-left: 1em;
  text-indent: -1em;
}

/* ---- 4. 日帰り手術 / 上乗せ保障 ---- */
.women-course__case,
.women-course__case-etc,
.women-course__case-note,
.women-course__addon {
  position: absolute;
}

.women-course__case {
  background-color: var(--color-women-light);
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  text-align: center;
}

.women-course__case-etc {
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  line-height: 1.5;
  text-align: center;
  white-space: nowrap;
}

.women-course__case-note {
  font-family: var(--font-family-base);
  font-weight: 400;
  color: var(--color-text-sub);
}

.women-course__addon {
  background-color: var(--color-addon);
}

.women-course__addon-shape {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background-image: url('../images/women-upper-shape.svg');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.women-course__addon-text {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-white);
  text-align: center;
  white-space: nowrap;
}

.women-course__addon-button {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-white);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-addon);
  line-height: 1.4;
}

.women-course__addon-arrow {
  position: absolute;
}

/* ---- 5. 保障表 / CTA ---- */
.women-course__table-scroll {
  position: absolute;
}

.women-course__table {
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  font-family: var(--font-family-base);
  color: var(--color-text);
  line-height: 1.5;
}

.women-course__table th,
.women-course__table td {
  text-align: center;
  vertical-align: middle;
  font-weight: 500;
}

/*
 * Figma のコース見出しは枠線を持たない、単なるベタ塗りの矩形。
 * 見出しどうしの隙間は透明ボーダー＋パディングボックス塗りで作るため、
 * 隙間の向き・太さは PC / SP のブレークポイント側で指定する
 */
.women-course__table thead th {
  background-color: var(--color-women);
  background-clip: padding-box;
  color: var(--color-white);
}

.women-course__table tbody td {
  font-weight: 400;
}

/* 内側の罫線は淡いピンク、外周はピンク */
.women-course__table tbody tr > * {
  border-top: 0.2rem solid var(--color-women-light);
}

.women-course__table tbody tr:first-child > * {
  border-top-color: var(--color-women);
}

.women-course__table tbody tr:last-child > * {
  border-bottom: 0.2rem solid var(--color-women);
}

.women-course__table tbody tr > *:first-child {
  position: relative;
  border-left: 0.2rem solid var(--color-women);
}

.women-course__table tbody tr > *:last-child {
  position: relative;
  border-right: 0.2rem solid var(--color-women);
}

/*
 * 行の border-top（淡ピンク）と外周の border-left / border-right（ピンク）は
 * 同じセルの隣り合う辺なので、CSS のマイター処理で角が斜めに分割され、
 * 行境界ごとに外周ボーダーが淡色に欠ける。
 * Figma の横罫線は外周線の内側から始まり外周を侵さないため、
 * 外周ぶんを疑似要素で塗り直して本来の連続した線に戻す
 */
.women-course__table tbody tr > *:first-child::before,
.women-course__table tbody tr > *:last-child::after {
  content: '';
  position: absolute;
  top: -0.2rem;
  bottom: 0;
  width: 0.2rem;
  background-color: var(--color-women);
}

.women-course__table tbody tr > *:first-child::before {
  left: -0.2rem;
}

.women-course__table tbody tr > *:last-child::after {
  right: -0.2rem;
}

.women-course__table tbody th + td,
.women-course__table tbody td + td {
  border-left: 0.2rem solid var(--color-women-light);
}

/*
 * 1行目の上罫線・最終行の下罫線（濃ピンク）は、同じセルの内側の縦罫線（淡ピンク）と
 * 隣り合う辺なので角がマイターで斜めに分割され、濃い横罫線の端に淡ピンクの三角が食い込む。
 * 外周罫線と同じ手法で、濃い横罫線をボーダー域ごと疑似要素で塗り直して連続させる。
 * 1列目は縦罫線も濃ピンクでマイターが見えないため対象外（かつ ::before は外周罫線で使用済み）
 */
.women-course__table tbody tr:first-child > * + *,
.women-course__table tbody tr:last-child > * + * {
  position: relative;
}

.women-course__table tbody tr:first-child > * + *::before,
.women-course__table tbody tr:last-child > * + *::before {
  content: '';
  position: absolute;
  left: -0.2rem;
  right: 0;
  height: 0;
}

/*
 * 線の太さは height ではなく border で持たせる。0.2rem はルートのスケールで端数 px（PC で 1.975px）
 * になり、ボーダーは整数 px に丸められるのに対し height はそのまま描かれるため、
 * height で持たせると塗り直した箇所だけ 1px 太くなって段差ができる
 */
.women-course__table tbody tr:first-child > * + *::before {
  bottom: 100%;
  border-top: 0.2rem solid var(--color-women);
}

.women-course__table tbody tr:last-child > * + *::before {
  top: 100%;
  border-bottom: 0.2rem solid var(--color-women);
}

.women-course__table-sub {
  font-weight: 400;
}

.women-course__table-badge {
  display: inline-block;
  background-color: var(--color-women-light);
  border-radius: 0.5rem;
  font-weight: 500;
}

.women-course__table-badge-note {
  display: block;
  font-weight: 400;
  color: var(--color-text-sub);
}

/* 「病気死亡」行と「事故死亡」行をつなぐ ＋ は、行の境界にまたがって置く */
.women-course__table tbody tr:nth-child(10) td {
  position: relative;
}

.women-course__table-plus {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-weight: 500;
  line-height: 1;
}

.women-course__table-split {
  display: flex;
  align-items: center;
  justify-content: center;
}

.women-course__table-notes {
  position: absolute;
  font-family: var(--font-family-base);
  font-weight: 400;
  color: var(--color-text-sub);
}

/* 折り返し行は「※」1文字ぶんぶら下げる（Figma は行頭に全角スペースを入れて字下げしている） */
.women-course__table-notes-item {
  padding-left: 1em;
  text-indent: -1em;
}

.women-course__cta {
  position: absolute;
}

.women-course__cta-button {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-white);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1.4;
}

.women-course__cta-arrow {
  position: absolute;
}

.women-course__cta-note {
  position: absolute;
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-white);
  line-height: 1.5;
}

.women-course__table-coverage {
  display: flex;
  align-items: center;
}

.women-course__table-term {
  flex-shrink: 0;
}

@media (max-width: 767px) {
  .women-course {
    width: calc(100% - 4rem);
    max-width: 35rem;
    margin: 4rem auto 0;
  }

  .women-course__panel--intro,
  .women-course__panel--hospital,
  .women-course__panel--pregnancy,
  .women-course__panel--surgery {
    border-radius: 0.8rem;
  }

  .women-course__panel--intro { height: 32.5rem; }
  .women-course__panel--hospital { height: 78.7rem; }
  .women-course__panel--pregnancy { height: 64.7rem; }
  .women-course__panel--surgery { height: 43.4rem; }
  .women-course__panel--plan { height: 129.2rem; }

  .women-course__panel--plan::before {
    height: 118.8rem;
    border-radius: 0.8rem;
  }

  /* 1. コース概要 */
  .women-course__intro-bg {
    height: 12.7rem;
    background-image: url('../images/women-title-bg-sp.svg');
  }

  .women-course__intro-sub {
    left: 2.4rem;
    top: 1.6rem;
    width: 30.2rem;
    height: 2.2rem;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }

  .women-course__intro-title {
    left: 2.4rem;
    top: 4.6rem;
    width: 21.9rem;
    font-size: 2.4rem;
    line-height: 1.2;
  }

  .women-course__intro-title-kern { letter-spacing: -0.96rem; }
  .women-course__intro-title-small { font-size: 1.5rem; }

  .women-course__intro-illust {
    left: 23.5rem;
    top: 5.2rem;
    width: 10.9rem;
    height: 7.9rem;
  }

  .women-course__intro-logo {
    left: 3.2rem;
    top: 13rem;
    width: 13.4rem;
    height: 6.8rem;
  }

  .women-course__condition {
    border-radius: 0.3rem;
    font-size: 1.6rem;
    line-height: 1.4;
  }

  .women-course__condition--age {
    left: 17.8rem;
    top: 13.3rem;
    width: 14.8rem;
    height: 6.8rem;
    padding-top: 1.2rem;
  }

  .women-course__condition--fee {
    left: 2.4rem;
    top: 20.9rem;
    width: 14.7rem;
    height: 6.8rem;
    padding-top: 2.3rem;
  }

  .women-course__condition--pregnancy {
    left: 17.9rem;
    top: 20.9rem;
    width: 14.7rem;
    height: 6.8rem;
    padding-top: 1.2rem;
  }

  .women-course__mark { font-size: 1.2rem; }

  .women-course__conditions-note {
    left: 23.2rem;
    top: 28.5rem;
    font-size: 1.2rem;
  }

  /* 見出し */
  .women-course__heading {
    top: 3.2rem;
    font-size: 2.4rem;
  }

  .women-course__heading::before {
    top: 2.7rem;
    height: 0.8rem;
  }

  .women-course__heading--hospital { --bar-width: 27.1rem; --bar-offset: -13.7rem; }
  .women-course__heading--pregnancy { --bar-width: 29.4rem; --bar-offset: -14.9rem; }
  .women-course__heading--surgery { --bar-width: 21.9rem; --bar-offset: -11.3rem; }
  .women-course__heading--table { --bar-width: 8.8rem; --bar-offset: -4.3rem; }

  .women-course__heading-note {
    top: 7.2rem;
    font-size: 1.2rem;
  }

  .women-course__heading-note--pregnancy { left: 7.2rem; }
  .women-course__heading-note--surgery { left: 3.7rem; }

  /* 2. 入院保障 */
  .women-course__plan-label {
    left: 3.6rem;
    top: 8.8rem;
    width: 27.8rem;
    height: 5.6rem;
    padding-top: 0.7rem;
    border-radius: 6rem;
    font-size: 1.6rem;
    line-height: 1.3;
    white-space: normal;
  }

  .women-course__plan-label-small { font-size: 1.4rem; }

  .women-course__plan-card {
    left: 2.4rem;
    top: 11.6rem;
    width: 30.2rem;
    height: 26.4rem;
    border-width: 0.1rem;
    border-radius: 0.5rem;
  }

  .women-course__plan-subject { left: 17.5rem; top: 15.6rem; font-size: 1.8rem; }
  .women-course__plan-term { left: 17.5rem; top: 18.2rem; font-size: 1.4rem; }
  .women-course__plan-unit { left: 5.9rem; top: 22.2rem; font-size: 2.4rem; }

  .women-course__plan-amount {
    left: 11rem;
    top: 20rem;
    font-size: 5.6rem;
    letter-spacing: -0.28rem;
  }

  .women-course__plan-yen { left: 26.7rem; top: 22.2rem; font-size: 2.4rem; }
  .women-course__plan-mark { left: 27.7rem; top: 20.7rem; font-size: 1.2rem; }
  .women-course__plan-note { left: 4.5rem; top: 26.2rem; font-size: 1.2rem; }

  .women-course__plan-divider {
    left: 3.6rem;
    top: 29.2rem;
    width: 27.8rem;
    height: 0.2rem;
  }

  .women-course__plan-lead {
    left: 3.6rem;
    top: 30.4rem;
    width: 28rem;
    font-size: 1.4rem;
    line-height: 1.4;
  }

  .women-course__balloon {
    left: 17.6rem;
    top: 40rem;
    font-size: 1.8rem;
    line-height: 1.4;
  }

  .women-course__bracket--left,
  .women-course__bracket--right {
    top: 40.64rem;
    width: 2.54081rem;
    height: 5.25878rem;
  }

  .women-course__bracket--left { left: 2.6rem; }
  .women-course__bracket--right { left: 29.86rem; }

  .women-course__cost-label {
    font-size: 1.3rem;
    line-height: 1.4;
  }

  .women-course__cost--transport {
    left: 9.5rem;
    top: 46.1rem;
    width: 16rem;
    height: 16rem;
  }

  .women-course__cost--transport .women-course__cost-arc {
    left: 1.01rem;
    top: 0.95rem;
    width: 14.09rem;
    height: 11.19rem;
  }

  .women-course__cost--transport .women-course__cost-illust {
    left: 2.43rem;
    top: 4.5rem;
    width: 11.54rem;
    height: 3.76rem;
  }

  .women-course__cost--transport .women-course__cost-label { top: 11rem; }

  .women-course__cost--expenses,
  .women-course__cost--cleaning {
    top: 60.7rem;
    width: 14.8rem;
    height: 14.8rem;
  }

  .women-course__cost--expenses { left: 2.4rem; }
  .women-course__cost--cleaning { left: 17.8rem; }

  .women-course__cost--expenses .women-course__cost-arc,
  .women-course__cost--cleaning .women-course__cost-arc {
    left: 0.93rem;
    top: 0.88rem;
    width: 13.04rem;
    height: 10.39rem;
  }

  .women-course__cost--expenses .women-course__cost-illust {
    left: 2.22rem;
    top: 4.35rem;
    width: 11.05rem;
    height: 3.62rem;
  }

  .women-course__cost--expenses .women-course__cost-label { top: 10.24rem; }

  .women-course__cost--cleaning .women-course__cost-illust {
    left: 2.18rem;
    top: 3.06rem;
    width: 9.95rem;
    height: 4.97rem;
  }

  .women-course__cost--cleaning .women-course__cost-label {
    top: 10.44rem;
    line-height: 1.3;
  }

  /* 3. 妊娠中の加入 */
  .women-course__voice-card {
    left: 2.4rem;
    top: 13rem;
    width: 30.2rem;
    height: 48.5rem;
    border-width: 0.1rem;
    border-radius: 1rem;
  }

  .women-course__voice-title {
    left: 3.6rem;
    top: 11rem;
    width: 27.8rem;
    height: 3.6rem;
    border-radius: 6rem;
    font-size: 1.6rem;
    line-height: 3.6rem;
  }

  .women-course__voice-photo {
    left: 3.646rem;
    top: 15.8rem;
    width: 10.268359375rem;
    height: 11.5rem;
  }

  /* Figma の -90deg 回転グループを、回転後の表示座標へ置き換える */
  .women-course__voice-photo::before {
    left: 0.2364509583rem;
    top: 0.3366699219rem;
    width: 10.0319084167rem;
    height: 10.0318977356rem;
  }

  .women-course__voice-photo-frame {
    top: 0;
    width: 10.1062187195rem;
    height: 10.0318977356rem;
    clip-path: circle(5.01595rem at 5.01595rem 5.01595rem);
  }

  .women-course__voice-photo-frame img {
    width: 223.88%;
    height: 150.37%;
    left: -30.2%;
    top: -2.96%;
  }

  .women-course__voice-tail {
    left: 6.3234610404rem;
    top: 9.6063546234rem;
    width: 2.6380197525rem;
    height: 1.3772924423rem;
    transform: rotate(153.49deg);
  }

  .women-course__voice-text {
    left: 4rem;
    top: 17rem;
    width: 27rem;
    padding-left: 0.6rem;
    padding-right: 0.6rem;
    font-size: 1.6rem;
    line-height: 1.9;
    background-image:
      repeating-linear-gradient(to right, transparent 0 0.4rem, var(--color-white) 0.4rem 0.8rem),
      repeating-linear-gradient(to bottom, transparent 0 2.94rem, var(--color-primary-light) 2.94rem 3.04rem);
    background-position: 0 0.06rem;
  }

  .women-course__voice-notes {
    left: 4rem;
    top: 54.5rem;
    width: 27rem;
    font-size: 1.2rem;
  }

  /* 4. 日帰り手術 / 上乗せ保障 */
  .women-course__case-label {
    left: 3.6rem;
    top: 11rem;
    width: 27.8rem;
    height: 3.6rem;
    border-radius: 6rem;
    font-size: 1.6rem;
    line-height: 3.6rem;
  }

  .women-course__case-card {
    left: 2.4rem;
    top: 12.8rem;
    width: 30.2rem;
    height: 14.6rem;
    border-width: 0.1rem;
    border-radius: 0.5rem;
  }

  .women-course__case {
    top: 15.8rem;
    height: 6rem;
    border-radius: 0.3rem;
    font-size: 1.4rem;
    line-height: 1.4;
  }

  .women-course__case--digestive {
    left: 3.7rem;
    width: 16.9rem;
    padding-top: 0.9rem;
  }

  .women-course__case--cataract {
    left: 21.1rem;
    width: 6.8rem;
    padding-top: 2rem;
  }

  .women-course__case-etc { left: 29.9rem; top: 20.1rem; font-size: 1.4rem; }

  .women-course__case-note {
    left: 3.6rem;
    top: 22.4rem;
    width: 27.8rem;
    font-size: 1.2rem;
    line-height: 1.4;
  }

  .women-course__addon {
    left: 2.4rem;
    top: 28.6rem;
    width: 30.2rem;
    height: 12rem;
    border-radius: 0.5rem;
  }

  .women-course__addon-shape { width: 19.1rem; }

  .women-course__addon-text {
    top: 1.4rem;
    width: 24rem;
    font-size: 1.5rem;
    line-height: 1.4;
    white-space: normal;
  }

  .women-course__bracket--addon-left,
  .women-course__bracket--addon-right {
    width: 1.90527rem;
    height: 4.04507rem;
  }

  .women-course__bracket--addon-left { left: 3.5rem; top: 1.6rem; }
  .women-course__bracket--addon-right { left: 25rem; top: 1.7rem; }

  .women-course__addon-button {
    left: 1.2rem;
    top: 6.5rem;
    width: 27.8rem;
    height: 4rem;
    border-radius: 0.5rem;
    font-size: 1.4rem;
  }

  .women-course__addon-arrow {
    right: 0.8rem;
    width: 2rem;
    height: 2rem;
  }

  /* 5. 保障表 / CTA */
  .women-course__table-scroll {
    left: 2.4rem;
    top: 8.8rem;
    width: 30.2rem;
    overflow-x: auto;
  }

  .women-course__table { width: 48rem; }
  /* 列幅は Figma の縦罫線 x 座標から算出（160.5 / 99.5 / 111 / 109）。
     詳細度が同じため、修飾子(--label)は基底クラスより後に書く必要がある */
  .women-course__table-col { width: 11.1rem; }
  .women-course__table-col--label { width: 16.05rem; }
  .women-course__table-col:nth-child(2) { width: 9.95rem; }
  .women-course__table-col:last-child { width: 10.9rem; }

  .women-course__table thead th {
    height: 3.4rem;
    font-size: 1.2rem;
    line-height: 1.2;
  }

  /* Figma SP: 見出しは列境界から始まり、右端を 1.4px 削って隙間を作る
     （実測 160.47-258.57 / 259.97-369.99 / 371.39-480。右端の見出しに隙間は無い） */
  .women-course__table thead th:not(:last-child) {
    border-right: 0.14rem solid transparent;
  }

  .women-course__table th,
  .women-course__table td {
    letter-spacing: -0.06rem;
  }

  .women-course__table-th-small { font-size: 1rem; }

  /* 行高を Figma の罫線 y 座標で固定するため、上下 padding は持たせず
     行の height と vertical-align: middle で中央に置く */
  .women-course__table tbody th {
    padding: 0 1rem;
    font-size: 1.2rem;
    line-height: 1.05;
  }

  .women-course__table tbody td {
    padding: 0 0.4rem;
    font-size: 1.2rem;
    line-height: 1.05;
  }

  /*
   * Figma の行送りは「その行に載っている最大の文字サイズ × 約1.5」で決まるため、
   * 注記サイズ（0.9rem）だけの行は 12.63px、基準サイズ（1.2rem）を含む行は 17.2px になる。
   * CSS は strut があるぶん行ごとに縮められないので、上の 1.05（= 12.6px）を既定にしつつ、
   * 2行目以降にも基準サイズの文字が来るセルだけ 1.43（= 17.16px）に上書きする。
   * 該当: 見出し1行目「性別」/ 4行目「入院」/ 12行目「一部焼壊」、値10行目「100万円」
   */
  .women-course__table tbody tr:nth-child(1) th,
  .women-course__table tbody tr:nth-child(4) th,
  .women-course__table tbody tr:nth-child(12) th,
  .women-course__table tbody tr:nth-child(10) td {
    line-height: 1.43;
  }

  /* Figma の罫線 y 座標から算出した各行の高さ（合計 646px） */
  .women-course__table tbody tr:nth-child(1) { height: 5.3rem; }
  .women-course__table tbody tr:nth-child(2) { height: 7rem; }
  .women-course__table tbody tr:nth-child(3) { height: 3.2rem; }
  .women-course__table tbody tr:nth-child(4) { height: 4.9rem; }
  .women-course__table tbody tr:nth-child(5) { height: 5.3rem; }
  .women-course__table tbody tr:nth-child(6) { height: 6.5rem; }
  .women-course__table tbody tr:nth-child(7) { height: 4.2rem; }
  .women-course__table tbody tr:nth-child(8) { height: 6.5rem; }
  .women-course__table tbody tr:nth-child(9) { height: 3.2rem; }
  .women-course__table tbody tr:nth-child(10) { height: 5rem; }
  .women-course__table tbody tr:nth-child(11) { height: 6.8rem; }
  .women-course__table tbody tr:nth-child(12) { height: 6.7rem; }

  .women-course__table-sub { font-size: 0.9rem; }

  /* Figma で1行に収まる長い見出しは、明示した改行位置だけを使用する */
  .women-course__table tbody tr:nth-child(10) th,
  .women-course__table tbody tr:nth-child(11) th,
  .women-course__table tbody tr:nth-child(12) th {
    white-space: nowrap;
  }

  .women-course__table-coverage {
    /* Figma: テキスト左端 171.4 / バッジ左端 282.83。結合セルの内容左端が 166.5 */
    padding-left: 0.4rem;
    gap: 1.2rem;
  }

  /* Figma のバッジは 173.78×48.41。本文1行 + 注記2行を左揃えで組んでおり、
     td の 1.2rem・中央揃えのままだと本文が2行に折り返して箱が 8px 高くなる */
  .women-course__table-badge {
    width: 17.4rem;
    padding: 0.37rem 0.4rem 0.37rem 0.8rem;
    font-size: 1.05rem;
    line-height: 1.44;
    text-align: left;
  }

  /* 注記の2行目は Figma と同じく1文字ぶら下げる（__table-notes li と同じ手法） */
  .women-course__table-badge-note {
    padding-left: 1em;
    text-indent: -1em;
    font-size: 0.9rem;
  }

  .women-course__table-plus {
    top: -1rem;
    font-size: 1.4rem;
  }

  /* SP は3項目を縦に積み、結合セルの左端から揃える（PC は横1行のまま）。
     横並びのままだと必要幅 331.5px / 343.4px がセル内容幅 307.5px に収まらず、
     各項目が内部で折り返してしまう。行送り 1.43 は Figma 実測の 17.2px 相当 */
  .women-course__table-split {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    row-gap: 0;
    padding-left: 0.4rem;
    line-height: 1.43;
  }

  .women-course__table-notes {
    left: 2.5rem;
    top: 78rem;
    width: 30.1rem;
    font-size: 1.2rem;
    line-height: 1.4;
  }

  .women-course__cta {
    left: 2.4rem;
    top: 105.5rem;
    width: 30.2rem;
    height: 23.7rem;
    background-color: rgba(230, 0, 18, 0.95);
    border-radius: 0.5rem;
  }

  .women-course__cta-button {
    left: 1.6rem;
    width: 27rem;
    height: 4rem;
    border-radius: 0.5rem;
    font-size: 1.4rem;
  }

  .women-course__cta-button--quote { top: 1.6rem; }
  .women-course__cta-button--document { top: 6.4rem; }

  .women-course__cta-arrow {
    right: 0.8rem;
    width: 2rem;
    height: 2rem;
  }

  .women-course__cta-note {
    left: 1.6rem;
    top: 11.6rem;
    width: 27rem;
    font-size: 1.4rem;
  }
}

@media (min-width: 768px) {
  .women-course {
    width: 120rem;
    margin: 8rem auto 0;
  }

  .women-course__panel--intro,
  .women-course__panel--hospital,
  .women-course__panel--pregnancy,
  .women-course__panel--surgery {
    border-radius: 2rem;
  }

  .women-course__panel--intro { height: 35.8rem; }
  .women-course__panel--hospital { height: 85.4rem; }
  .women-course__panel--pregnancy { height: 55.7rem; }
  .women-course__panel--surgery { height: 62.2rem; }
  .women-course__panel--plan { height: 173.7rem; }

  .women-course__panel--plan::before {
    height: 164.7rem;
    border-radius: 2rem;
  }

  /* 1. コース概要 */
  .women-course__intro-bg {
    height: 18rem;
    background-image: url('../images/women-title-bg-pc.svg');
  }

  .women-course__intro-sub {
    left: 25.3rem;
    top: 2.4rem;
    width: 68.8rem;
    height: 4rem;
    font-size: 2.4rem;
    line-height: 4rem;
  }

  .women-course__intro-title {
    top: 8rem;
    font-size: 4rem;
    line-height: 1;
  }

  .women-course__intro-title-kern { letter-spacing: -0.64rem; }

  .women-course__intro-illust {
    left: 83.7rem;
    top: 7.2rem;
    width: 34.3rem;
    height: 25rem;
  }

  .women-course__intro-logo {
    left: 9.6rem;
    top: 18.8rem;
    width: 25.6rem;
    height: 13rem;
  }

  .women-course__condition {
    top: 18.8rem;
    width: 14.4rem;
    height: 10.4rem;
    padding-top: 2.2rem;
    border-radius: 0.5rem;
    font-size: 2rem;
    line-height: 1.5;
  }

  .women-course__condition--age { left: 37.6rem; width: 16.4rem; }
  .women-course__condition--fee { left: 54.8rem; width: 12.4rem; }
  .women-course__condition--pregnancy { left: 68rem; width: 14.4rem; }

  .women-course__mark { font-size: 1.4rem; }

  .women-course__conditions-note {
    left: 70.5rem;
    top: 30.4rem;
    font-size: 1.4rem;
  }

  /* 見出し */
  .women-course__heading {
    top: 4rem;
    font-size: 3.2rem;
  }

  .women-course__heading::before {
    top: 3.6rem;
    height: 1.2rem;
  }

  .women-course__heading--hospital { --bar-width: 35.6rem; --bar-offset: -18.4rem; }
  .women-course__heading--pregnancy { --bar-width: 38.8rem; --bar-offset: -20rem; }
  .women-course__heading--surgery { --bar-width: 29.2rem; --bar-offset: -15.2rem; }
  .women-course__heading--table { --bar-width: 10.4rem; --bar-offset: -5.2rem; }

  .women-course__heading-note {
    top: 9.6rem;
    font-size: 1.4rem;
  }

  .women-course__heading-note--pregnancy { left: 47.7rem; }
  .women-course__heading-note--surgery { left: 43.9rem; }

  /* 2. 入院保障 */
  .women-course__plan-label {
    left: 16rem;
    top: 11.2rem;
    width: 88rem;
    height: 5.6rem;
    font-size: 2.8rem;
    line-height: 5.6rem;
  }

  .women-course__plan-card {
    left: 9.7rem;
    top: 14.1rem;
    width: 100.8rem;
    height: 26.5rem;
    border-width: 0.2rem;
    border-radius: 1rem;
  }

  .women-course__plan-subject { left: 42.5rem; top: 22.8rem; font-size: 2.4rem; }
  .women-course__plan-term { left: 35.7rem; top: 26rem; font-size: 2rem; }
  .women-course__plan-unit { left: 61.3rem; top: 22.3rem; font-size: 3.2rem; }

  .women-course__plan-amount {
    left: 68.5rem;
    top: 18.6rem;
    font-size: 8rem;
    letter-spacing: -0.4rem;
  }

  .women-course__plan-yen { left: 91rem; top: 22.5rem; font-size: 3.2rem; }
  .women-course__plan-mark { left: 92.6rem; top: 20.9rem; font-size: 1.4rem; }
  .women-course__plan-note { left: 64.2rem; top: 27.1rem; font-size: 1.4rem; }

  .women-course__plan-divider {
    left: 16rem;
    top: 30.2rem;
    width: 88rem;
    height: 0.2rem;
  }

  .women-course__plan-lead {
    left: 0;
    top: 32rem;
    width: 100%;
    font-size: 1.8rem;
    text-align: center;
  }

  .women-course__balloon {
    left: 60.4rem;
    top: 43.9rem;
    font-size: 2rem;
    line-height: 1;
  }

  .women-course__bracket--left,
  .women-course__bracket--right {
    top: 43.71rem;
    width: 1.72959rem;
    height: 3.42329rem;
  }

  .women-course__bracket--left { left: 31.6rem; }
  .women-course__bracket--right { left: 86.79rem; }

  .women-course__cost {
    top: 48.9rem;
    width: 32.5rem;
    height: 32.5rem;
  }

  .women-course__cost--transport { left: 9.7rem; }
  .women-course__cost--expenses { left: 43.8rem; }
  .women-course__cost--cleaning { left: 77.9rem; }

  .women-course__cost-arc {
    left: 2.4rem;
    top: 2.4rem;
    width: 27.7rem;
    height: 22.55rem;
  }

  .women-course__cost-label {
    font-size: 1.8rem;
    line-height: 1.5;
  }

  .women-course__cost--transport .women-course__cost-label { top: 23.1rem; }

  .women-course__cost--expenses .women-course__cost-label,
  .women-course__cost--cleaning .women-course__cost-label { top: 24.5rem; }

  .women-course__cost--transport .women-course__cost-illust {
    left: 5.21rem;
    top: 9.85rem;
    width: 22.6rem;
    height: 7.4rem;
  }

  .women-course__cost--expenses .women-course__cost-illust {
    left: 4.72rem;
    top: 10.15rem;
    width: 23.7rem;
    height: 7.8rem;
  }

  .women-course__cost--cleaning .women-course__cost-illust {
    left: 6.25rem;
    top: 7.73rem;
    width: 20rem;
    height: 10rem;
  }

  /* 3. 妊娠中の加入 */
  .women-course__voice-card {
    left: 9.6rem;
    top: 16.9rem;
    width: 100.8rem;
    height: 34.8rem;
    border-width: 0.2rem;
    border-radius: 1rem;
  }

  .women-course__voice-title {
    left: 16rem;
    top: 14.1rem;
    width: 88rem;
    height: 5.6rem;
    border-radius: 8rem;
    font-size: 2.8rem;
    line-height: 5.6rem;
  }

  .women-course__voice-photo {
    left: 16rem;
    top: 21.5rem;
    width: 30.8rem;
    height: 27rem;
  }

  .women-course__voice-photo::before {
    left: 1.2rem;
    top: 0;
    width: 27rem;
    height: 27rem;
  }

  .women-course__voice-photo-frame {
    width: 27.2rem;
    height: 27rem;
  }

  .women-course__voice-photo-frame img {
    width: 223.88%;
    height: 150.37%;
    left: -30.2%;
    top: -2.96%;
  }

  .women-course__voice-tail {
    /* 回転後の表示 bbox を Figma の (271, 100, 37, 71) に合わせる */
    left: 25.4rem;
    top: 11.7rem;
    width: 7.1rem;
    height: 3.7rem;
    transform: rotate(90deg);
  }

  .women-course__voice-text {
    left: 49.2rem;
    top: 21.8rem;
    width: 54.8rem;
    padding-left: 0.4rem;
    font-size: 1.8rem;
    line-height: 1.9;
    background-image:
      repeating-linear-gradient(to right, transparent 0 0.4rem, var(--color-white) 0.4rem 0.8rem),
      repeating-linear-gradient(to bottom, transparent 0 3.32rem, var(--color-primary-light) 3.32rem 3.42rem);
    background-position: 0 0.28rem;
  }

  .women-course__voice-notes {
    left: 49.6rem;
    top: 44rem;
    width: 39.2rem;
    font-size: 1.4rem;
  }

  /* 4. 日帰り手術 / 上乗せ保障 */
  .women-course__case-label {
    left: 16rem;
    top: 14.1rem;
    width: 88rem;
    height: 5.6rem;
    font-size: 2.8rem;
    line-height: 5.6rem;
  }

  .women-course__case-card {
    left: 9.6rem;
    top: 17rem;
    width: 100.8rem;
    height: 21.9rem;
    border-width: 0.2rem;
    border-radius: 1rem;
  }

  .women-course__case {
    top: 21.5rem;
    width: 24.8rem;
    height: 10.4rem;
    border-radius: 0.5rem;
    font-size: 2rem;
    line-height: 1.5;
  }

  .women-course__case--digestive { left: 34.4rem; padding-top: 2.2rem; }
  .women-course__case--cataract { left: 60.8rem; padding-top: 3.7rem; }

  .women-course__case-etc { left: 89rem; top: 29.7rem; font-size: 1.8rem; }

  .women-course__case-note {
    left: 38.6rem;
    top: 33.6rem;
    font-size: 1.4rem;
    line-height: 1.5;
  }

  .women-course__addon {
    left: 9.6rem;
    top: 41.3rem;
    width: 100.8rem;
    height: 16.9rem;
    border-radius: 1rem;
  }

  .women-course__addon-shape { width: 59.2rem; }

  .women-course__addon-text {
    top: 3.3rem;
    font-size: 2rem;
    line-height: 1;
  }

  .women-course__bracket--addon-left,
  .women-course__bracket--addon-right {
    top: 3.11rem;
    width: 1.72959rem;
    height: 3.42329rem;
  }

  .women-course__bracket--addon-left { left: 27.6rem; }
  .women-course__bracket--addon-right { left: 71.7rem; }

  .women-course__addon-button {
    left: 6.4rem;
    top: 8.1rem;
    width: 88rem;
    height: 5.6rem;
    border-radius: 1rem;
    font-size: 1.8rem;
  }

  .women-course__addon-arrow {
    right: 2.4rem;
    width: 2.4rem;
    height: 2.4rem;
  }

  /* 5. 保障表 / CTA */
  .women-course__table-scroll {
    left: 9.6rem;
    top: 12rem;
    width: 100.8rem;
  }

  .women-course__table { width: 100.8rem; }
  /* 詳細度が同じため、修飾子(--label)を基底クラスより後に書く必要がある */
  .women-course__table-col { width: 24rem; }
  .women-course__table-col--label { width: 28.8rem; }

  /* border-left は Figma PC の見出しの隙間（列境界から 2px 右にずれて始まる。
     左端の見出しも同じ）。実測 290-528 / 530-768 / 770-1008（表の左端を 0 とした座標） */
  .women-course__table thead th {
    height: 5.6rem;
    border-left: 0.2rem solid transparent;
    font-size: 1.8rem;
  }

  .women-course__table tbody th {
    padding: 0 4.2rem;
    font-size: 1.6rem;
  }

  .women-course__table tbody td { font-size: 1.6rem; }
  .women-course__table-sub { font-size: 1.4rem; }
  /* Figma PC の「病気入院・事故」の中黒だけ Regular（SP は Figma 未確認のため据え置き） */
  .women-course__table-dot { font-weight: 400; }

  /*
   * Figma の行送りは「その行に載っている最大の文字サイズ × 1.5」。
   * 注記サイズ（1.4rem）だけの行は 21px、基準サイズ（1.6rem）を含む行は 24px になる。
   * セルの strut は基準サイズ由来で常に 24px になってしまうため、1行まるごと注記の
   * かたまりをブロック化して、そのブロック自身の行ボックス（14 × 1.5 = 21px）を持たせる
   * （ジュニア・お誕生前の表で SP に使っているのと同じ手法）
   */
  .women-course__table-sub--line { display: block; }

  /* Figma の罫線位置から算出した各行の高さ（合計 1111px） */
  .women-course__table tbody tr:nth-child(1) { height: 8.8rem; }
  .women-course__table tbody tr:nth-child(2) { height: 10.6rem; }
  .women-course__table tbody tr:nth-child(3) { height: 6.4rem; }
  .women-course__table tbody tr:nth-child(4) { height: 8.8rem; }
  .women-course__table tbody tr:nth-child(5) { height: 10.6rem; }
  .women-course__table tbody tr:nth-child(6) { height: 12.7rem; }
  .women-course__table tbody tr:nth-child(7) { height: 8.5rem; }
  .women-course__table tbody tr:nth-child(8) { height: 12.7rem; }
  .women-course__table tbody tr:nth-child(9) { height: 7.2rem; }
  .women-course__table tbody tr:nth-child(10) { height: 9.4rem; }
  .women-course__table tbody tr:nth-child(11) { height: 10.9rem; }
  .women-course__table tbody tr:nth-child(12) { height: 9rem; }

  /* 「住宅災害〜」の行は、Figma と同じ 204px の文字幅に対して1行目がちょうど 204.00px
     必要になり、わずかな端数で折り返してしまう。改行位置は <br> で持っているため、
     自動折り返しだけを止めて Figma どおりの2行に固定する。 */
  .women-course__table tbody tr:nth-child(12) th { white-space: nowrap; }

  .women-course__table-coverage {
    padding-left: 8.2rem;
    gap: 8.1rem;
  }

  .women-course__table-badge {
    width: 37.3rem;
    padding: 1rem 0 1.1rem;
  }

  .women-course__table-badge-note { font-size: 1.4rem; }

  .women-course__table-plus {
    top: -1.4rem;
    font-size: 2rem;
  }

  .women-course__table-split--family { gap: 7.2rem; }
  .women-course__table-split--disaster { gap: 6.3rem; }

  .women-course__table-notes {
    left: 9.6rem;
    top: 134.8rem;
    width: 100.8rem;
    font-size: 1.4rem;
    line-height: 1.5;
  }

  /*
   * 「※1」のように連番が付く注記は、折り返し行が数字の下に潜らないよう連番ぶんもぶら下げる。
   * Figma PC は折り返し行の行頭に「全角スペース1 + 半角スペース2」を入れており、
   * その幅 21.84px（14px 基準で 1.56em）が設計値。※1〜※4 のどの連番よりも広い
   * （最大は「※3」の 20.78px）。SP の Figma は全角スペース1文字ぶら下げなので対象外
   */
  .women-course__table-notes-item--numbered {
    padding-left: 1.36em;
    text-indent: -1.36em;
  }

  .women-course__cta {
    left: 9.6rem;
    top: 153.5rem;
    width: 100.8rem;
    height: 20.2rem;
    background-color: var(--color-primary);
    border-radius: 1rem;
  }

  .women-course__cta-button {
    top: 3.6rem;
    width: 43.2rem;
    height: 5.6rem;
    border-radius: 1rem;
    font-size: 1.8rem;
  }

  .women-course__cta-button--quote { left: 6.4rem; }
  .women-course__cta-button--document { left: 51.2rem; }

  .women-course__cta-arrow {
    right: 1.6rem;
    width: 2.4rem;
    height: 2.4rem;
  }

  .women-course__cta-note {
    left: 0;
    top: 11.2rem;
    width: 100%;
    font-size: 1.8rem;
    text-align: center;
  }
}

/* ============ ジュニアコース ============ */
/* パネル内の見出し下線（疑似要素・z-index: -1）を白背景より前に出すため、
   パネル側でスタッキングコンテキストを作る */
.junior-course {
  position: relative;
  z-index: 0;
}

/*
 * Figma の「ジュニア_bg」。セクション上端から少し下がった位置から始まり、
 * セクション下端を越えて次セクションの帯（お誕生前_bg）へ受け渡す全幅の下地。
 * パネル（z-index: 0）より奥に敷く。
 */
.junior-course::before {
  content: '';
  position: absolute;
  z-index: -1;
  left: 0;
  width: 100%;
  background-color: var(--color-junior-bg);
}

.junior-course__panel {
  position: relative;
  z-index: 0;
  margin-left: auto;
  margin-right: auto;
  background-color: var(--color-white);
}

.junior-course__panel + .junior-course__panel {
  margin-top: 0.4rem;
}

/* 保障表パネルは CTA が白カードの下端からはみ出すため、下地を疑似要素で敷く。
   見出しの下線バー（z-index: -1）より更に奥に置く */
.junior-course__panel--plan::before {
  content: '';
  position: absolute;
  z-index: -2;
  left: 0;
  top: 0;
  width: 100%;
  background-color: var(--color-white);
}

/* ---- 1. コース概要 ---- */
.junior-course__intro-bg,
.junior-course__intro-sub,
.junior-course__intro-title,
.junior-course__intro-illust,
.junior-course__intro-logo,
.junior-course__condition,
.junior-course__record {
  position: absolute;
}

.junior-course__intro-bg {
  left: 0;
  top: 0;
  width: 100%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.junior-course__intro-sub {
  background-color: var(--color-junior-light);
  border-radius: 6rem;
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  text-align: center;
  white-space: nowrap;
}

.junior-course__intro-title {
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-white);
  text-align: center;
  white-space: nowrap;
}

.junior-course__intro-illust,
.junior-course__intro-logo {
  overflow: hidden;
}
.junior-course__intro-illust {
  z-index: 1;
}

/* Figma のクロップ（拡大率・オフセット）をそのまま再現する */
.junior-course__intro-illust img,
.junior-course__intro-logo img {
  position: absolute;
  display: block;
  max-width: none;
}

.junior-course__intro-illust img {
  width: 169.29%;
  height: 197.87%;
  left: -33.1%;
  top: -48.61%;
}

.junior-course__intro-logo img {
  width: 109.95%;
  height: 106.99%;
  left: -6.97%;
  top: -5.94%;
}

.junior-course__condition {
  background-color: var(--color-junior-light);
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  text-align: center;
}

/* 契約数No.1の白カード。中の要素はこのカード基準で配置する */
.junior-course__record {
  background-color: var(--color-white);
  border-style: solid;
  border-color: var(--color-junior);
  border-radius: 1rem;
}

.junior-course__record-badge,
.junior-course__record-course,
.junior-course__record-underline,
.junior-course__record-label,
.junior-course__record-rank,
.junior-course__record-notes {
  position: absolute;
}

.junior-course__record-course {
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  line-height: 1;
  white-space: nowrap;
}

.junior-course__record-label {
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1;
  white-space: nowrap;
}

.junior-course__record-label-sub,
.junior-course__record-label-main {
  display: block;
}

.junior-course__record-rank {
  font-family: var(--font-family-serif-en);
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1;
  white-space: nowrap;
}

.junior-course__record-notes {
  font-family: var(--font-family-base);
  font-weight: 400;
  color: var(--color-text);
}

.junior-course__record-note-star {
  color: var(--color-primary);
}

/* 「★ 」ぶん（全角スペース＋半角スペース相当）をぶら下げインデントにする */
.junior-course__record-notes li {
  padding-left: 1.5em;
  text-indent: -1.5em;
}

.junior-course__record-badge {
  object-fit: cover;
}

/* ---- 共通の見出し（下線バー付き） ---- */
.junior-course__heading {
  position: absolute;
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-text);
  line-height: 1.5;
}

.junior-course__heading--table {
  white-space: nowrap;
}

/* 見出し文字の後ろに敷く淡いオレンジのバー。位置・幅は見出しごとに異なる */
.junior-course__heading::before {
  content: '';
  position: absolute;
  z-index: -1;
  left: var(--bar-left);
  top: var(--bar-top);
  width: var(--bar-width);
  height: var(--bar-height);
  background-color: var(--color-junior-light);
}

.junior-course__heading-note {
  position: absolute;
  font-family: var(--font-family-base);
  font-weight: 400;
  color: var(--color-text-sub);
  line-height: 1.5;
}

/* ---- 共通のリード文・注記・区切り線 ---- */
.junior-course__lead {
  position: absolute;
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
}

.junior-course__note {
  position: absolute;
  font-family: var(--font-family-base);
  font-weight: 400;
  color: var(--color-text-sub);
}

.junior-course__divider {
  position: absolute;
  background-color: var(--color-junior-light);
  border-radius: 1rem;
}

.junior-course__visit-data,
.junior-course__visit-payment-note {
  position: absolute;
  font-family: var(--font-family-base);
  font-weight: 400;
  color: var(--color-text-sub);
}

/* ---- 共通の吹き出し風テキスト（＼ ／ で挟む） ---- */
.junior-course__balloon {
  position: absolute;
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-junior);
  text-align: center;
  white-space: nowrap;
}

.junior-course__bracket {
  position: absolute;
}

.junior-course__bracket--visit-right,
.junior-course__bracket--hospital-right,
.junior-course__bracket--term-right {
  transform: scaleX(-1);
}

/* ---- 共通の丸イラスト（ケガの例 / 思わぬ出費） ---- */
.junior-course__case,
.junior-course__cost {
  position: absolute;
  border-radius: 50%;
  background-color: var(--color-junior-light);
}

.junior-course__case-arc,
.junior-course__case-illust,
.junior-course__cost-arc,
.junior-course__cost-illust {
  position: absolute;
}

.junior-course__case-label,
.junior-course__cost-label {
  position: absolute;
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  text-align: center;
}

/* ---- 3. 入院保障 ---- */
.junior-course__bubble {
  position: absolute;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.junior-course__bubble-text {
  position: absolute;
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-junior);
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}

.junior-course__days-title,
.junior-course__days-card,
.junior-course__day,
.junior-course__days-note {
  position: absolute;
}

.junior-course__days-title {
  /* 白カードの上に重なる見出しピル（.women-course__plan-label と同じ理由） */
  z-index: 1;
  background-color: var(--color-junior);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-white);
  text-align: center;
}

.junior-course__days-card {
  background-color: var(--color-white);
  border-style: solid;
  border-color: var(--color-junior);
  border-radius: 1rem;
}

.junior-course__day {
  background-color: var(--color-white);
  border-style: solid;
  border-color: var(--color-junior-light);
}

.junior-course__day-name,
.junior-course__day-value {
  position: absolute;
  left: 0;
  width: 100%;
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  text-align: center;
  white-space: nowrap;
}

.junior-course__day-name {
  line-height: 1.5;
}

.junior-course__day-value {
  line-height: 1;
}

.junior-course__day-num {
  font-family: var(--font-family-en);
  font-weight: 700;
  color: var(--color-primary);
}

.junior-course__days-note {
  font-family: var(--font-family-base);
  font-weight: 400;
  color: var(--color-text-sub);
}

/* ---- 4. 加入年齢・保障期間 / 5. お誕生前・上乗せ ---- */
.junior-course__heading-mark {
  font-weight: 400;
}

.junior-course__section-title,
.junior-course__section-card {
  position: absolute;
}

.junior-course__section-title {
  /* 白カードの上に重なる見出しピル（.women-course__plan-label と同じ理由） */
  z-index: 1;
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-white);
  text-align: center;
  white-space: nowrap;
}

.junior-course__section-title--term {
  background-color: var(--color-junior);
}

.junior-course__section-title--birth {
  background-color: var(--color-birth);
}

.junior-course__section-card {
  background-color: var(--color-white);
  border-style: solid;
}

.junior-course__section-card--term {
  border-color: var(--color-junior);
}

.junior-course__section-card--birth {
  border-color: var(--color-birth);
}

/* 保障期間のバーチャート */
.junior-course__chart-age,
.junior-course__chart-bar,
.junior-course__chart-label {
  position: absolute;
}

.junior-course__chart-age {
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-junior);
  line-height: 1.5;
  text-align: center;
  white-space: nowrap;
}

.junior-course__chart-bar--join { background-color: #d4f0e6; }
.junior-course__chart-bar--keep { background-color: #84d4b8; }

.junior-course__chart-label {
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  line-height: 1.5;
  text-align: center;
  white-space: nowrap;
}

/* 左右に罫線を伴う見出し */
.junior-course__ruled,
.junior-course__ruled-line {
  position: absolute;
}

.junior-course__ruled {
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-junior);
  line-height: 1.5;
  text-align: center;
  white-space: nowrap;
}

.junior-course__ruled-line {
  background-color: var(--color-junior);
}

/* 移行コースのカード */
.junior-course__plan,
.junior-course__plan-arrow {
  position: absolute;
}

.junior-course__plan {
  background-color: var(--color-white);
  border-style: solid;
}

.junior-course__plan--current { border-color: var(--color-junior-light); }
.junior-course__plan--recommend { border-color: var(--color-junior); }

.junior-course__plan-title {
  position: absolute;
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  line-height: 1.5;
  text-align: center;
  white-space: nowrap;
}

.junior-course__plan--current .junior-course__plan-title {
  background-color: var(--color-junior-light);
  color: var(--color-text);
}

.junior-course__plan--recommend .junior-course__plan-title {
  background-color: var(--color-junior);
  color: var(--color-white);
}

.junior-course__plan-list li {
  position: absolute;
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  line-height: 1.5;
  white-space: nowrap;
}

/* 行頭の丸ポチ */
.junior-course__plan-list li::before {
  content: '';
  position: absolute;
  left: 0;
  border-radius: 50%;
}

.junior-course__plan--current .junior-course__plan-list li::before {
  background-color: var(--color-junior-light);
}

.junior-course__plan--recommend .junior-course__plan-list li::before {
  background-color: var(--color-junior);
}

/* お誕生前申し込みバナー */
.junior-course__award-badge,
.junior-course__award-course,
.junior-course__award-underline,
.junior-course__award-name,
.junior-course__award-result,
.junior-course__birth-card {
  position: absolute;
}

.junior-course__award-course {
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  text-align: center;
  white-space: nowrap;
}

.junior-course__award-course-sub,
.junior-course__award-course-main {
  display: block;
  line-height: 1.2;
}

.junior-course__award-name,
.junior-course__award-result {
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-primary);
  white-space: nowrap;
}

.junior-course__award-name { line-height: 1.2; }
.junior-course__award-result { line-height: 1; }

/* 下端だけ角丸の白カード。上端は notch 付きの黄色い帯 */
.junior-course__birth-card {
  background-color: var(--color-white);
  border-bottom-left-radius: 1rem;
  border-bottom-right-radius: 1rem;
}

.junior-course__birth-card-top,
.junior-course__birth-sub,
.junior-course__birth-course,
.junior-course__birth-main,
.junior-course__birth-link,
.junior-course__birth-link-icon,
.junior-course__birth-link-tri {
  position: absolute;
}

.junior-course__birth-card-top {
  left: 0;
  top: 0;
  width: 100%;
}

.junior-course__birth-sub {
  transform: translateX(-50%);
  background-color: var(--color-birth-light);
  border-radius: 6rem;
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  text-align: center;
  white-space: nowrap;
}

.junior-course__birth-course,
.junior-course__birth-main {
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  color: var(--color-birth);
  text-align: center;
  white-space: nowrap;
}

.junior-course__birth-course {
  font-weight: 500;
  line-height: 1.3;
}

.junior-course__birth-main {
  font-weight: 700;
  line-height: 1;
}

.junior-course__birth-link {
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  line-height: 1.5;
  text-align: center;
  white-space: nowrap;
}

.junior-course__birth-link-icon {
  border-radius: 50%;
  background-color: var(--color-birth);
}

/* 上乗せ保障バナー（女性コースと同じ形状・カラー） */
.junior-course__addon {
  position: absolute;
  background-color: var(--color-addon);
}

.junior-course__addon-shape {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background-image: url('../images/women-upper-shape.svg');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.junior-course__addon-text {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-white);
  text-align: center;
  white-space: nowrap;
}

.junior-course__addon-button {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-white);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-addon);
  line-height: 1.4;
}

.junior-course__addon-arrow {
  position: absolute;
}

/* ---- 6. お客様の声 ---- */
.junior-course__voice-title,
.junior-course__voice-card,
.junior-course__voice-photo,
.junior-course__voice-tail,
.junior-course__voice-text {
  position: absolute;
}

.junior-course__voice-photo,
.junior-course__voice-tail {
  z-index: 1;
}

.junior-course__voice-title {
  z-index: 1;
  background-color: var(--color-junior);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-white);
  text-align: center;
  white-space: nowrap;
}

.junior-course__voice-card {
  background-color: var(--color-white);
  border-style: solid;
  border-color: var(--color-junior);
  border-radius: 1rem;
}

/* 写真の円から少しずらして覗くオレンジの円 */
.junior-course__voice-photo::before {
  content: '';
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: var(--color-junior);
}

.junior-course__voice-photo-frame {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 50%;
}

/* Figma のクロップ（拡大率・オフセット）をそのまま再現する */
.junior-course__voice-photo-frame img {
  position: absolute;
  display: block;
  max-width: none;
  width: 154.07%;
  height: 102.59%;
  left: -27.78%;
  top: -2.59%;
}

/*
 * 手書きノート風の破線（Figma の Line 46 / dasharray 4 4）。
 * 「行送りごとの横線」を敷いた上に「白い縦ストライプ」を重ねて破線に見せている。
 */
.junior-course__voice-text {
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  background-repeat: repeat;
  /* 最終行の罫線が下端で切れないよう逃げを作る（女性コースと同じ理由） */
  padding-bottom: 0.4rem;
}

.junior-course__voice-copy--sp {
  white-space: normal;
}

.junior-course__voice-em {
  color: var(--color-junior);
}

/* ---- 7. 保障表 / CTA ---- */
.junior-course__table-scroll {
  position: absolute;
}

.junior-course__table {
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  font-family: var(--font-family-base);
  color: var(--color-text);
  line-height: 1.5;
}

.junior-course__table th,
.junior-course__table td {
  text-align: center;
  vertical-align: middle;
  font-weight: 500;
}

.junior-course__table thead th {
  background-color: var(--color-junior);
  background-clip: padding-box;
  color: var(--color-white);
  border: 0.2rem solid var(--color-junior);
  border-bottom: 0;
}

/* コース見出しどうしの2pxの隙間（下地が見える） */
.junior-course__table thead th + th {
  border-left-color: transparent;
}

.junior-course__table tbody td {
  font-weight: 400;
}

/* 内側の罫線は淡いオレンジ、外周はオレンジ */
.junior-course__table tbody tr > * {
  border-top: 0.2rem solid var(--color-junior-light);
}

.junior-course__table tbody tr:first-child > * {
  border-top-color: var(--color-junior);
}

.junior-course__table tbody tr:last-child > * {
  border-bottom: 0.2rem solid var(--color-junior);
}

.junior-course__table tbody tr > *:first-child {
  position: relative;
  border-left: 0.2rem solid var(--color-junior);
}

.junior-course__table tbody tr > *:last-child {
  position: relative;
  border-right: 0.2rem solid var(--color-junior);
}

/* 外周ボーダーが行罫線とのマイターで欠けるのを防ぐ（女性コースと同じ理由） */
.junior-course__table tbody tr > *:first-child::before,
.junior-course__table tbody tr > *:last-child::after {
  content: '';
  position: absolute;
  top: -0.2rem;
  bottom: 0;
  width: 0.2rem;
  background-color: var(--color-junior);
}

.junior-course__table tbody tr > *:first-child::before {
  left: -0.2rem;
}

.junior-course__table tbody tr > *:last-child::after {
  right: -0.2rem;
}

.junior-course__table tbody th + td,
.junior-course__table tbody td + td {
  border-left: 0.2rem solid var(--color-junior-light);
}

/* 濃色の横罫線が縦罫線とのマイターで欠けるのを防ぐ（女性コースと同じ理由） */
.junior-course__table tbody tr:first-child > * + *,
.junior-course__table tbody tr:last-child > * + * {
  position: relative;
}

.junior-course__table tbody tr:first-child > * + *::before,
.junior-course__table tbody tr:last-child > * + *::before {
  content: '';
  position: absolute;
  left: -0.2rem;
  right: 0;
  height: 0;
}

.junior-course__table tbody tr:first-child > * + *::before {
  bottom: 100%;
  border-top: 0.2rem solid var(--color-junior);
}

.junior-course__table tbody tr:last-child > * + *::before {
  top: 100%;
  border-bottom: 0.2rem solid var(--color-junior);
}

.junior-course__table-sub {
  font-weight: 400;
}

/* 「病気死亡」行と「事故死亡」行をつなぐ ＋ は、行の境界にまたがって置く */
.junior-course__table tbody tr:nth-child(10) td {
  position: relative;
}

.junior-course__table-plus {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-weight: 500;
  line-height: 1;
}

.junior-course__table-notes {
  position: absolute;
  font-family: var(--font-family-base);
  font-weight: 400;
  color: var(--color-text-sub);
}

.junior-course__table-notes li {
  padding-left: 1em;
  text-indent: -1em;
}

.junior-course__cta {
  position: absolute;
}

.junior-course__cta-button {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-white);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1.4;
}

.junior-course__cta-arrow {
  position: absolute;
}

.junior-course__cta-note {
  position: absolute;
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-white);
  line-height: 1.5;
}

@media (max-width: 767px) {
  .junior-course {
    margin-top: 5.6rem;
  }

  .junior-course::before {
    top: 4.8rem;
    height: 580.1rem;
  }

  .junior-course__panel {
    width: calc(100% - 4rem);
    max-width: 35rem;
    border-radius: 0.8rem;
  }

  .junior-course__panel--intro { height: 56.3rem; }
  .junior-course__panel--visit { height: 80.3rem; }
  .junior-course__panel--hospital { height: 104.4rem; }

  /* 1. コース概要 */
  .junior-course__intro-bg {
    height: 12.7rem;
    background-image: url('../images/junior-title-bg-sp.svg');
  }

  .junior-course__intro-sub {
    left: 2.4rem;
    top: 1.6rem;
    width: 30.2rem;
    height: 2.2rem;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }

  .junior-course__intro-title {
    left: 2.4rem;
    top: 4.6rem;
    width: 19.6rem;
    font-size: 2.4rem;
    line-height: 1.2;
  }

  .junior-course__intro-illust {
    left: 21.4rem;
    top: 3.8rem;
    width: 12.4rem;
    height: 10.5rem;
  }

  .junior-course__intro-logo {
    left: 3.2rem;
    top: 13rem;
    width: 13.4rem;
    height: 6.8rem;
  }

  .junior-course__condition {
    border-radius: 0.3rem;
    font-size: 1.6rem;
    line-height: 1.4;
  }

  .junior-course__condition--fee {
    left: 17.8rem;
    top: 13.3rem;
    width: 14.8rem;
    height: 6.8rem;
    padding-top: 2.3rem;
  }

  .junior-course__condition--term {
    left: 2.4rem;
    top: 20.9rem;
    width: 14.7rem;
    height: 6.8rem;
    padding-top: 1.2rem;
  }

  .junior-course__condition--cover {
    left: 17.9rem;
    top: 20.9rem;
    width: 14.7rem;
    height: 6.8rem;
    padding-top: 1.2rem;
  }

  .junior-course__record {
    left: 2.4rem;
    top: 29.3rem;
    width: 30.2rem;
    height: 23.8rem;
    border-width: 0.1rem;
  }

  .junior-course__record-badge {
    left: 1.2rem;
    top: 1.6rem;
    width: 8rem;
    height: 7.9rem;
  }

  .junior-course__record-course {
    left: 9.4rem;
    top: 1.8rem;
    font-size: 1.2rem;
    letter-spacing: -0.048rem;
  }

  .junior-course__record-underline {
    left: 10rem;
    top: 3.5rem;
    width: 15.2rem;
    height: 0.5rem;
  }

  .junior-course__record-label {
    left: 10.2rem;
    top: 4.2rem;
    letter-spacing: 0.081rem;
  }

  .junior-course__record-label-sub { font-size: 1.2rem; }
  .junior-course__record-label-main { font-size: 2.8rem; }

  .junior-course__record-rank {
    left: 19.1rem;
    top: 2.2rem;
  }

  .junior-course__record-no { font-size: 3.2rem; }
  .junior-course__record-num { font-size: 7.2rem; }

  .junior-course__record-notes {
    left: 1.2rem;
    top: 10.3rem;
    width: 27.8rem;
    font-size: 1.2rem;
    line-height: 1.4;
  }

  /* 見出し */
  .junior-course__heading {
    font-size: 2.4rem;
    white-space: nowrap;
  }

  .junior-course__heading--visit {
    left: 6.2rem;
    top: 3.2rem;
    --bar-left: 11.8rem;
    --bar-top: 2.7rem;
    --bar-width: 10.9rem;
    --bar-height: 0.8rem;
  }

  .junior-course__heading--hospital {
    left: 3.2rem;
    top: 6.6rem;
    --bar-left: -0.2rem;
    --bar-top: 2.7rem;
    --bar-width: 24rem;
    --bar-height: 0.8rem;
  }

  .junior-course__heading-note {
    font-size: 1.2rem;
  }

  .junior-course__heading-note--visit { left: 11.1rem; top: 10.8rem; }
  .junior-course__heading-note--hospital { left: 11.2rem; top: 14.2rem; }

  /* 2. ケガ通院保障 */
  .junior-course__balloon {
    font-size: 1.8rem;
    line-height: 1.4;
  }

  .junior-course__balloon--visit { left: 17.6rem; top: 14.6rem; }
  .junior-course__balloon--hospital { left: 17.503rem; top: 48.4rem; }

  .junior-course__bracket--visit-left,
  .junior-course__bracket--visit-right {
    top: 15.2412rem;
    width: 2.54081rem;
    height: 5.25875rem;
  }

  .junior-course__bracket--visit-left { left: 2.6rem; }
  .junior-course__bracket--visit-right { left: 29.8591rem; }

  .junior-course__visit-data {
    left: 2.2rem;
    top: 20.7rem;
    width: 30.4rem;
    font-size: 1.2rem;
    line-height: 1.4;
  }

  .junior-course__bracket--hospital-left,
  .junior-course__bracket--hospital-right {
    top: 51.7413rem;
    width: 3.18697rem;
    height: 6.65878rem;
  }

  .junior-course__bracket--hospital-left { left: 2.431rem; }
  .junior-course__bracket--hospital-right { left: 29.368rem; }

  .junior-course__case-label,
  .junior-course__cost-label {
    font-size: 1.3rem;
  }

  .junior-course__case--iron {
    left: 8.5rem;
    top: 24.9rem;
    width: 18rem;
    height: 18rem;
  }

  .junior-course__case--iron .junior-course__case-arc {
    left: 1.1324rem;
    top: 1.0727rem;
    width: 15.8543rem;
    height: 12.5901rem;
  }

  .junior-course__case-illust--iron {
    left: 2.9rem;
    top: 2.1rem;
    width: 6.3434rem;
    height: 6.2523rem;
  }

  .junior-course__case-illust--baby {
    left: 5.525rem;
    top: 5.063rem;
    width: 9.7135rem;
    height: 4.5675rem;
  }

  .junior-course__case--iron .junior-course__case-label {
    left: 9.177rem;
    top: 12.075rem;
    width: 11.7rem;
    line-height: 1.2;
  }

  .junior-course__case--fall,
  .junior-course__case--soccer {
    top: 41.5rem;
    width: 14.8rem;
    height: 14.8rem;
  }

  .junior-course__case--fall { left: 2.4rem; }
  .junior-course__case--soccer { left: 17.8rem; }

  .junior-course__case--fall .junior-course__case-arc,
  .junior-course__case--soccer .junior-course__case-arc {
    left: 0.9311rem;
    top: 0.882rem;
    width: 13.0357rem;
    height: 10.3906rem;
  }

  .junior-course__case-illust--fall {
    left: 3.3rem;
    top: 2.0835rem;
    width: 8.0147rem;
    height: 6.1332rem;
  }

  .junior-course__case--fall .junior-course__case-label {
    left: 7.4004rem;
    top: 9.938rem;
    width: 7.9068rem;
    line-height: 1.4;
  }

  .junior-course__case-illust--soccer {
    left: 3.5rem;
    top: 1.4rem;
    width: 7.5rem;
    height: 7.0137rem;
  }

  .junior-course__case--soccer .junior-course__case-label {
    left: 7.65rem;
    top: 10.2rem;
    width: 9.9rem;
    line-height: 1.3;
  }

  .junior-course__divider--visit {
    left: 2.4rem;
    top: 62.1rem;
    width: 30.2rem;
    height: 0.2rem;
  }

  .junior-course__lead--visit {
    left: 2.4rem;
    top: 63.3rem;
    width: 30.2rem;
    font-size: 1.4rem;
    line-height: 1.4;
  }

  .junior-course__lead-small { font-size: 1.2rem; }

  .junior-course__note--visit {
    left: 2.4rem;
    top: 71.7rem;
    width: 30.2rem;
    font-size: 1.2rem;
    line-height: 1.5;
  }

  .junior-course__note span {
    display: block;
    padding-left: 1em;
    text-indent: -1em;
  }

  .junior-course__visit-payment-note {
    left: 2.2rem;
    top: 57.1rem;
    width: 30.4rem;
    font-size: 1.2rem;
    line-height: 1.4;
  }

  /* 3. 入院保障 */
  .junior-course__bubble {
    left: 8.6rem;
    top: 3.2rem;
    width: 17.8rem;
    height: 3.4rem;
    background-image: url('../images/junior-bubble-sp.svg');
  }

  .junior-course__bubble-text {
    left: 17.6rem;
    top: 3.9rem;
    font-size: 1.4rem;
  }

  .junior-course__lead--hospital {
    left: 2.4rem;
    top: 17.6rem;
    width: 30.2rem;
    font-size: 1.4rem;
    line-height: 1.4;
  }

  .junior-course__days-title {
    left: 3.6rem;
    top: 27.6rem;
    width: 27.8rem;
    height: 5.6rem;
    padding-top: 0.7rem;
    border-radius: 6rem;
    font-size: 1.6rem;
    line-height: 1.3;
  }

  .junior-course__days-card {
    left: 2.4rem;
    top: 29.4rem;
    width: 30.2rem;
    height: 17rem;
    border-width: 0.1rem;
    border-radius: 0.5rem;
  }

  .junior-course__day {
    top: 34.4rem;
    width: 9rem;
    height: 6.4rem;
    border-width: 0.1rem;
    border-radius: 0.3rem;
  }

  .junior-course__day--pneumonia { left: 3.6rem; }
  .junior-course__day--bronchitis { left: 13rem; }
  .junior-course__day--enteric { left: 22.4rem; }

  .junior-course__day-name { font-size: 1.4rem; }

  .junior-course__day-value { font-size: 1.6rem; }

  .junior-course__day-num { font-size: 2.8rem; }

  .junior-course__day--pneumonia .junior-course__day-name { top: 0.6rem; }
  .junior-course__day--pneumonia .junior-course__day-value { top: 2.9rem; }

  .junior-course__day--bronchitis .junior-course__day-name,
  .junior-course__day--enteric .junior-course__day-name { top: 0.5rem; }

  .junior-course__day--bronchitis .junior-course__day-value,
  .junior-course__day--enteric .junior-course__day-value { top: 2.8rem; }

  .junior-course__days-note {
    left: 3.6rem;
    top: 41.4rem;
    width: 27.8rem;
    font-size: 1.2rem;
    line-height: 1.4;
  }

  .junior-course__cost--transport {
    left: 9.5rem;
    top: 59.2rem;
    width: 16rem;
    height: 16rem;
  }

  .junior-course__cost--transport .junior-course__cost-arc {
    left: 1.007rem;
    top: 0.954rem;
    width: 14.0927rem;
    height: 11.1912rem;
  }

  .junior-course__cost--transport .junior-course__cost-illust {
    left: 2.478rem;
    top: 4.527rem;
    width: 11.4434rem;
    height: 3.7088rem;
  }

  .junior-course__cost--transport .junior-course__cost-label {
    left: 8.03rem;
    top: 11rem;
    width: 9.1rem;
    line-height: 1.4;
  }

  .junior-course__cost--bed,
  .junior-course__cost--meal {
    top: 73.8rem;
    width: 14.8rem;
    height: 14.8rem;
  }

  .junior-course__cost--bed { left: 2.4rem; }
  .junior-course__cost--meal { left: 17.8rem; }

  .junior-course__cost--bed .junior-course__cost-arc,
  .junior-course__cost--meal .junior-course__cost-arc {
    left: 0.9311rem;
    top: 0.882rem;
    width: 13.0357rem;
    height: 10.3906rem;
  }

  .junior-course__cost--bed .junior-course__cost-illust {
    left: 3.1rem;
    top: 3.6rem;
    width: 8.5872rem;
    height: 4.4rem;
  }

  .junior-course__cost--bed .junior-course__cost-label {
    left: 7.4004rem;
    top: 10.738rem;
    width: 7.9068rem;
    line-height: 1.4;
  }

  .junior-course__cost--meal .junior-course__cost-illust {
    left: 3.8rem;
    top: 3.3rem;
    width: 7.3244rem;
    height: 4.8rem;
  }

  .junior-course__cost--meal .junior-course__cost-label {
    left: 7.351rem;
    top: 10.941rem;
    width: 8.4175rem;
    line-height: 1.3;
  }

  .junior-course__divider--hospital {
    left: 2.4rem;
    top: 90.2rem;
    width: 30.2rem;
    height: 0.2rem;
  }

  .junior-course__lead--claim {
    left: 2.4rem;
    top: 91.4rem;
    width: 30.2rem;
    font-size: 1.4rem;
    line-height: 1.4;
  }

  .junior-course__note--claim {
    left: 2.4rem;
    top: 95.8rem;
    width: 30.2rem;
    font-size: 1.2rem;
    line-height: 1.5;
  }

  /* 4. 加入年齢・保障期間 */
  .junior-course__panel--term { height: 80.1rem; }

  .junior-course__heading--term {
    left: 2.4rem;
    top: 3.2rem;
    width: 31.2rem;
    white-space: normal;
    --bar-left: 0;
    --bar-top: 2.7rem;
    --bar-width: 14.3rem;
    --bar-height: 0.8rem;
  }

  /* 2行目「満30歳まで」の下線は別途 after で敷く */
  .junior-course__heading--term::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 4.3rem;
    top: 6.3rem;
    width: 7.8rem;
    height: 0.8rem;
    background-color: var(--color-junior-light);
  }

  .junior-course__heading-mark { font-size: 1.2rem; }

  .junior-course__heading-note--term { left: 13.9rem; top: 10.8rem; }

  .junior-course__section-title--term {
    left: 3.6rem;
    top: 14.6rem;
    width: 27.8rem;
    height: 3.6rem;
    padding-top: 0.7rem;
    border-radius: 6rem;
    font-size: 1.6rem;
    line-height: 1.3;
  }

  .junior-course__section-card--term {
    left: 2.4rem;
    top: 16.4rem;
    width: 30.2rem;
    height: 21.4rem;
    border-width: 0.1rem;
    border-radius: 0.5rem;
  }

  .junior-course__chart-age { font-size: 1.2rem; }
  .junior-course__chart-age--0 { left: 4.55rem; top: 19.4rem; }
  .junior-course__chart-age--19 { left: 19.75rem; top: 19.4rem; }
  .junior-course__chart-age--30 { left: 30.2rem; top: 19.4rem; }

  .junior-course__chart-bar {
    top: 21.2rem;
    height: 4.8rem;
  }

  .junior-course__chart-bar--join { left: 4rem; width: 16rem; }
  .junior-course__chart-bar--keep { left: 20rem; width: 11rem; }

  .junior-course__chart-label {
    left: 12rem;
    top: 22.6rem;
    font-size: 1.4rem;
  }

  .junior-course__ruled {
    left: 17.8rem;
    top: 27.2rem;
    font-size: 1.4rem;
  }

  .junior-course__ruled-line {
    top: 28.2rem;
    width: 3.4rem;
    height: 0.1rem;
  }

  .junior-course__ruled-line--left { left: 3.6rem; }
  .junior-course__ruled-line--right { left: 28rem; }

  .junior-course__lead--term {
    left: 3.6rem;
    top: 29.9rem;
    width: 27.8rem;
    font-size: 1.4rem;
    line-height: 1.5;
  }

  .junior-course__balloon--term { left: 17.6rem; top: 40.2rem; }

  .junior-course__bracket--term-left,
  .junior-course__bracket--term-right {
    top: 40.8412rem;
    width: 2.54081rem;
    height: 5.25875rem;
  }

  .junior-course__bracket--term-left { left: 2.6rem; }
  .junior-course__bracket--term-right { left: 29.8591rem; }

  .junior-course__lead--transfer {
    left: 2.4rem;
    top: 46.9rem;
    width: 30.2rem;
    font-size: 1.4rem;
    line-height: 1.4;
  }

  .junior-course__note--transfer {
    left: 2.4rem;
    top: 49.3rem;
    width: 30.2rem;
    font-size: 1.2rem;
    line-height: 1.5;
  }

  .junior-course__plan {
    left: 2.4rem;
    width: 30.2rem;
    border-width: 0.1rem;
    border-radius: 0.5rem;
  }

  .junior-course__plan--current { top: 54.5rem; height: 7.8rem; }
  .junior-course__plan--recommend { top: 66.3rem; height: 10.6rem; }

  .junior-course__plan-title {
    left: 1.6rem;
    top: 1.2rem;
    width: 27rem;
    height: 2.2rem;
    padding-top: 0.1rem;
    border-radius: 6.5rem;
    font-size: 1.4rem;
  }

  .junior-course__plan-list li {
    left: 3.8rem;
    font-size: 1.6rem;
  }

  .junior-course__plan-list li::before {
    top: 0.8rem;
    width: 0.8rem;
    height: 0.8rem;
    margin-left: -1.6rem;
  }

  .junior-course__plan--current .junior-course__plan-list li:first-child { top: 4.2rem; }
  .junior-course__plan--current .junior-course__plan-list li:last-child { left: 17.7rem; top: 4.2rem; }
  .junior-course__plan--recommend .junior-course__plan-list li:first-child { top: 4.2rem; }
  .junior-course__plan--recommend .junior-course__plan-list li:last-child { top: 7rem; }

  .junior-course__plan-arrow {
    left: 15.4215rem;
    top: 63.1rem;
    width: 4.157rem;
    height: 2.4rem;
    transform: rotate(180deg);
  }

  /* 5. お誕生前申し込み / 上乗せ保障 */
  .junior-course__panel--birth { height: 56.4rem; }

  .junior-course__section-title--birth {
    left: 3.6rem;
    top: 3.2rem;
    width: 27.8rem;
    height: 5.6rem;
    padding-top: 0.7rem;
    border-radius: 6rem;
    font-size: 1.6rem;
    line-height: 1.3;
  }

  .junior-course__section-card--birth {
    left: 2.4rem;
    top: 5rem;
    width: 30.2rem;
    height: 35.4rem;
    border-width: 0.1rem;
    border-radius: 0.5rem;
  }

  .junior-course__award-badge {
    left: 3.7rem;
    top: 10.4rem;
    width: 8.4rem;
    height: auto;
  }

  .junior-course__award-course {
    left: 22.05rem;
    top: 10.7rem;
    letter-spacing: -0.048rem;
  }

  .junior-course__award-course-sub { font-size: 1rem; }
  .junior-course__award-course-main { font-size: 1.4rem; }

  .junior-course__award-underline {
    left: 12.8rem;
    top: 14.2rem;
    width: 18.6rem;
    height: 0.5rem;
  }

  .junior-course__award-name {
    left: 13.4rem;
    top: 14.7rem;
    font-size: 1.6rem;
    letter-spacing: 0.048rem;
  }

  .junior-course__award-result {
    left: 23.4rem;
    top: 14.6rem;
    font-size: 3.6rem;
    letter-spacing: 0.108rem;
  }

  .junior-course__birth-card {
    left: 3.6rem;
    top: 20.4rem;
    width: 27.8rem;
    height: 15.8rem;
    box-shadow: 0 0.2rem 0.3rem 0 rgba(226, 203, 209, 0.6);
  }

  .junior-course__birth-card-top { height: 1.2rem; }

  .junior-course__birth-sub {
    left: 14.4rem;
    top: 1.5rem;
    width: 25.4rem;
    height: 5.8rem;
    padding-top: 0.8rem;
    font-size: 1.2rem;
    line-height: 1.2;
  }

  .junior-course__birth-course {
    left: 5.7rem;
    top: 8.1rem;
    font-size: 1.2rem;
  }

  .junior-course__birth-main {
    left: 18.3rem;
    top: 8.6rem;
    font-size: 2rem;
  }

  .junior-course__birth-link {
    left: 12.7rem;
    top: 12.1rem;
    font-size: 1.4rem;
  }

  .junior-course__birth-link-icon {
    left: 18rem;
    top: 12.2rem;
    width: 2rem;
    height: 2rem;
  }

  .junior-course__birth-link-tri {
    left: 18.639rem;
    top: 13.033rem;
    width: 0.72169rem;
    height: 0.5rem;
  }

  .junior-course__note--birth {
    left: 2.4rem;
    top: 37rem;
    width: 22.8rem;
    font-size: 1.2rem;
    line-height: 1.5;
    text-align: center;
  }

  .junior-course__addon {
    left: 2.4rem;
    top: 41.6rem;
    width: 30.2rem;
    height: 12rem;
    border-radius: 0.5rem;
  }

  .junior-course__addon-shape { width: 19.1rem; }

  .junior-course__addon-text {
    top: 1.4rem;
    width: 24rem;
    font-size: 1.5rem;
    line-height: 1.4;
  }

  .junior-course__bracket--addon-left,
  .junior-course__bracket--addon-right {
    width: 1.90527rem;
    height: 4.04507rem;
  }

  .junior-course__bracket--addon-left { left: 3.5rem; top: 1.6rem; }
  .junior-course__bracket--addon-right { left: 25rem; top: 1.7rem; transform: scaleX(-1); }

  .junior-course__addon-button {
    left: 1.2rem;
    top: 6.5rem;
    width: 27.8rem;
    height: 4rem;
    border-radius: 0.5rem;
    font-size: 1.4rem;
  }

  .junior-course__addon-arrow {
    left: 25rem;
    top: 1rem;
    width: 2rem;
    height: 2rem;
  }

  /* 6. お客様の声 */
  .junior-course__panel--voice { height: 68.6rem; }

  .junior-course__heading--voice {
    left: 2.6rem;
    top: 3.2rem;
    width: 30.2rem;
    white-space: normal;
    line-height: 1.4;
    --bar-left: -0.2rem;
    --bar-top: 9.4rem;
    --bar-width: 21.8rem;
    --bar-height: 0.8rem;
  }

  .junior-course__heading-note--voice { left: 7rem; top: 17.2rem; }

  .junior-course__voice-card {
    left: 2.4rem;
    top: 23rem;
    width: 30.2rem;
    height: 42.4rem;
    border-width: 0.1rem;
  }

  .junior-course__voice-title {
    left: 3.6rem;
    top: 21rem;
    width: 27.8rem;
    height: 3.6rem;
    border-radius: 6rem;
    font-size: 1.6rem;
    line-height: 3.6rem;
  }

  .junior-course__voice-photo {
    left: 3.6rem;
    top: 25.8rem;
    width: 10.0319992065rem;
    height: 10.0319992065rem;
  }

  /* Figma の -90deg 回転グループを、回転後の表示座標へ置き換える */
  .junior-course__voice-photo::before {
    left: 0.2829353333rem;
    top: 0.33671875rem;
    width: 10.0319084167rem;
    height: 10.0318977356rem;
  }

  .junior-course__voice-photo-frame {
    top: 0;
  }

  .junior-course__voice-tail {
    left: 9.9699454154rem;
    top: 35.4064034514rem;
    width: 2.6380197525rem;
    height: 1.3772924423rem;
    transform: rotate(153.49deg);
  }

  .junior-course__voice-text {
    left: 4rem;
    top: 27rem;
    width: 27rem;
    padding-left: 0.6rem;
    padding-right: 0.6rem;
    font-size: 1.6rem;
    line-height: 1.9;
    background-image:
      repeating-linear-gradient(to right, transparent 0 0.4rem, var(--color-white) 0.4rem 0.8rem),
      repeating-linear-gradient(to bottom, transparent 0 2.94rem, var(--color-junior-light) 2.94rem 3.04rem);
    background-position: 0 0.06rem;
  }

  /* 7. 保障表 / CTA */
  .junior-course__panel--plan {
    height: 123.5rem;
    background-color: transparent;
  }

  .junior-course__panel--plan::before {
    height: 113.1rem;
    border-radius: 0.8rem;
  }

  .junior-course__heading--table {
    left: 13.2rem;
    top: 3.2rem;
    width: 8.8rem;
    text-align: center;
    --bar-left: 0;
    --bar-top: 2.7rem;
    --bar-width: 8.8rem;
    --bar-height: 0.8rem;
  }

  .junior-course__table-scroll {
    left: 2.4rem;
    top: 8.8rem;
    width: 30.2rem;
    overflow-x: auto;
  }

  .junior-course__table { width: 49rem; }
  /* 列幅は Figma の縦罫線 x 座標から算出（157.8 / 106.8 / 113.7 / 111.7）。
     詳細度が同じため、修飾子(--label)は基底クラスより後に書く必要がある */
  .junior-course__table-col { width: 11.37rem; }
  .junior-course__table-col--label { width: 15.78rem; }
  .junior-course__table-col:nth-child(2) { width: 10.68rem; }
  .junior-course__table-col:last-child { width: 11.17rem; }

  /*
   * フォントサイズは Figma の字形を ink バウンディングボックスで実測して決めた値。
   * 基準 11px / 注記 8.3px、字送りの追加はゼロ（幅・高さとも誤差 0.4px 以内で一致）。
   * 行送りは基準行 16.534px / 注記だけの行 12.400px で、どちらも
   * 「その行の最大フォントサイズ × 1.5」。表の基底で line-height: 1.5 を持っているので
   * ここでの上書きは不要で、1行まるごと注記のかたまりだけ --line で display: block にし、
   * 自分の font-size（0.83rem）基準の行ボックス（12.45px）を持たせる。
   */
  .junior-course__table thead th {
    height: 3.3rem;
    font-size: 1.1rem;
    border-width: 0;
  }

  /* Figma SP: 見出しは列境界から始まり、右端を 1.4px 削って隙間を作る
     （実測 157.82-263.26 / 264.64-376.98 / 378.35-490。右端の見出しに隙間は無い）*/
  .junior-course__table thead th:not(:last-child) {
    border-right: 0.14rem solid transparent;
  }

  .junior-course__table-th-small {
    display: block;
    font-size: 0.83rem;
  }

  /* 行高を Figma の罫線 y 座標で固定するため、上下 padding は持たせず
     行の height と vertical-align: middle で中央に置く */
  .junior-course__table tbody th {
    padding: 0 1rem;
    font-size: 1.1rem;
  }

  .junior-course__table tbody td {
    padding: 0 0.4rem;
    font-size: 1.1rem;
  }

  .junior-course__table-sub--line { display: block; }

  /* Figma の罫線 y 座標から算出した各行の高さ（合計 607px） */
  .junior-course__table tbody tr:nth-child(1) { height: 4.9rem; }
  .junior-course__table tbody tr:nth-child(2) { height: 3.3rem; }
  .junior-course__table tbody tr:nth-child(3) { height: 3.3rem; }
  .junior-course__table tbody tr:nth-child(4) { height: 5rem; }
  .junior-course__table tbody tr:nth-child(5) { height: 5.7rem; }
  .junior-course__table tbody tr:nth-child(6) { height: 7rem; }
  .junior-course__table tbody tr:nth-child(7) { height: 4.5rem; }
  .junior-course__table tbody tr:nth-child(8) { height: 7rem; }
  .junior-course__table tbody tr:nth-child(9) { height: 3.3rem; }
  .junior-course__table tbody tr:nth-child(10) { height: 5.2rem; }
  .junior-course__table tbody tr:nth-child(11) { height: 5.2rem; }
  .junior-course__table tbody tr:nth-child(12) { height: 6.3rem; }

  .junior-course__table-sub { font-size: 0.83rem; }

  /* Figma SP ではこの「（ケガ）」だけ注記サイズではなく基準サイズで組まれている
     （字送り実測 11.1px。すぐ上の行の同じ文字列は 8.4px）。デザインどおりに再現している */
  .junior-course__table-sub--regular { font-size: 1.1rem; }

  .junior-course__table-plus {
    top: -.7rem;
    font-size: 1.4rem;
  }

  .junior-course__table-notes {
    left: 2.5rem;
    top: 74rem;
    width: 30.1rem;
    font-size: 1.2rem;
    line-height: 1.4;
  }

  .junior-course__cta {
    left: 2.4rem;
    top: 99.8rem;
    width: 30.2rem;
    height: 23.7rem;
    background-color: rgba(230, 0, 18, 0.95);
    border-radius: 0.5rem;
  }

  .junior-course__cta-button {
    left: 1.6rem;
    width: 27rem;
    height: 4rem;
    border-radius: 0.5rem;
    font-size: 1.4rem;
  }

  .junior-course__cta-button--quote { top: 1.6rem; }
  .junior-course__cta-button--document { top: 6.4rem; }

  .junior-course__cta-arrow {
    right: 0.8rem;
    width: 2rem;
    height: 2rem;
  }

  .junior-course__cta-note {
    left: 1.6rem;
    top: 11.6rem;
    width: 27rem;
    font-size: 1.4rem;
  }
}

@media (min-width: 768px) {
  .junior-course {
    margin-top: 11.2rem;
  }

  .junior-course::before {
    top: 7.2rem;
    height: 636.1rem;
  }

  .junior-course__panel {
    width: 120rem;
    border-radius: 2rem;
  }

  .junior-course__panel--intro { height: 60.2rem; }
  .junior-course__panel--visit { height: 77.2rem; }
  .junior-course__panel--hospital { height: 110.1rem; }

  /* 1. コース概要 */
  .junior-course__intro-bg {
    height: 18rem;
    background-image: url('../images/junior-title-bg-pc.svg');
  }

  .junior-course__intro-sub {
    left: 25.3rem;
    top: 2.4rem;
    width: 68.8rem;
    height: 4rem;
    font-size: 2.4rem;
    line-height: 4rem;
  }

  .junior-course__intro-title {
    left: 25.3rem;
    top: 8rem;
    width: 68.8rem;
    font-size: 4rem;
    line-height: 1;
  }

  .junior-course__intro-illust {
    left: 84.7rem;
    top: 7.8rem;
    width: 32.9rem;
    height: 28.1rem;
  }

  .junior-course__intro-logo {
    left: 9.6rem;
    top: 18.8rem;
    width: 25.6rem;
    height: 13rem;
  }

  .junior-course__condition {
    top: 18.8rem;
    height: 10.4rem;
    padding-top: 2.2rem;
    border-radius: 0.5rem;
    font-size: 2rem;
    line-height: 1.5;
  }

  .junior-course__condition--fee { left: 37.6rem; width: 14.4rem; }
  .junior-course__condition--term { left: 52.8rem; width: 14.4rem; }
  .junior-course__condition--cover { left: 68rem; width: 20rem; }

  /* PC は「月掛金」と「1,000円〜」で改行する */
  .junior-course__condition--fee span { display: block; }

  .junior-course__record {
    left: 9.6rem;
    top: 33.8rem;
    width: 100.8rem;
    height: 22.4rem;
    border-width: 0.2rem;
  }

  .junior-course__record-badge {
    left: 6.4rem;
    top: 3.2rem;
    width: 16.3rem;
    height: 16rem;
  }

  .junior-course__record-course {
    left: 24.3rem;
    top: 4.5rem;
    font-size: 2rem;
  }

  .junior-course__record-underline {
    left: 23.9rem;
    top: 7.4rem;
    width: 28.8rem;
    height: 0.954rem;
  }

  .junior-course__record-label {
    left: 25rem;
    top: 8.6rem;
  }

  .junior-course__record-label-sub {
    font-size: 2.3rem;
    letter-spacing: -0.046rem;
  }

  .junior-course__record-label-main {
    font-size: 5.2rem;
    letter-spacing: 0.208rem;
  }

  .junior-course__record-rank {
    left: 41.7rem;
    top: 6.8rem;
  }

  .junior-course__record-no { font-size: 5.8rem; }
  .junior-course__record-num { font-size: 11.2rem; }

  .junior-course__record-notes {
    left: 60.4rem;
    top: 4.5rem;
    width: 34rem;
    font-size: 1.4rem;
    line-height: 1.5;
  }

  .junior-course__record-notes li {
    padding-left: 0;
    text-indent: 0;
    white-space: nowrap;
  }

  /* 見出し */
  .junior-course__heading {
    left: 8rem;
    width: 104rem;
    font-size: 3.2rem;
    text-align: center;
  }

  .junior-course__heading--visit {
    top: 4rem;
    --bar-left: 37.9rem;
    --bar-top: 3.6rem;
    --bar-width: 14.1rem;
    --bar-height: 1.2rem;
  }

  .junior-course__heading--hospital {
    top: 10rem;
    --bar-left: 38.3rem;
    --bar-top: 3.6rem;
    --bar-width: 34.9rem;
    --bar-height: 1.2rem;
  }

  .junior-course__heading-note {
    left: 8rem;
    width: 104rem;
    font-size: 1.4rem;
    text-align: center;
  }

  .junior-course__heading-note--visit { top: 9.6rem; }
  .junior-course__heading-note--hospital { top: 15.6rem; }

  /* 2. ケガ通院保障 */
  .junior-course__balloon {
    font-size: 2rem;
    line-height: 1;
  }

  .junior-course__balloon--visit { left: 60.069rem; top: 14.206rem; }
  .junior-course__balloon--hospital { left: 60.069rem; top: 56.506rem; line-height: 1.5; }

  .junior-course__bracket--visit-left,
  .junior-course__bracket--visit-right,
  .junior-course__bracket--hospital-left,
  .junior-course__bracket--hospital-right {
    width: 1.72959rem;
    height: 3.42329rem;
  }

  .junior-course__bracket--visit-left { left: 30.7rem; top: 14.0106rem; }
  .junior-course__bracket--visit-right { left: 87.6894rem; top: 14.0106rem; }
  .junior-course__bracket--hospital-left { left: 11.7rem; top: 56.3106rem; }
  .junior-course__bracket--hospital-right { left: 106.6704rem; top: 56.3106rem; }

  .junior-course__case-label,
  .junior-course__cost-label {
    left: 16.3rem;
    font-size: 1.8rem;
    line-height: 1.5;
    white-space: nowrap;
  }

  .junior-course__case {
    top: 21.9rem;
    width: 32.5rem;
    height: 32.5rem;
  }

  .junior-course__case--iron { left: 9.7rem; }
  .junior-course__case--fall { left: 43.8rem; }
  .junior-course__case--soccer { left: 77.9rem; }

  .junior-course__case-arc,
  .junior-course__cost-arc {
    left: 2.4rem;
    top: 2.4rem;
    width: 27.7rem;
    height: 22.55rem;
  }

  .junior-course__case-illust--iron {
    left: 4.5rem;
    top: 4.5rem;
    width: 12.5604rem;
    height: 11.9546rem;
  }

  .junior-course__case-illust--baby {
    left: 9.51rem;
    top: 10.154rem;
    width: 18.5389rem;
    height: 8.718rem;
  }

  .junior-course__case-illust--fall {
    left: 7.7rem;
    top: 5.9rem;
    width: 17.157rem;
    height: 13.1291rem;
  }

  .junior-course__case-illust--soccer {
    left: 7.2rem;
    top: 3.4rem;
    width: 17.1092rem;
    height: 16rem;
  }

  .junior-course__case-label { top: 23.1rem; }

  .junior-course__divider--visit {
    left: 9.6rem;
    top: 60.5rem;
    width: 100.8rem;
    height: 0.2rem;
  }

  .junior-course__lead--visit {
    left: 26rem;
    top: 62.7rem;
    width: 68rem;
    font-size: 2rem;
    line-height: 1.5;
    text-align: center;
  }

  .junior-course__note--visit {
    left: 9.7rem;
    top: 70.3rem;
    width: 100.7rem;
    font-size: 1.4rem;
    line-height: 1.5;
    text-align: center;
  }

  .junior-course__visit-data {
    left: 38.7rem;
    top: 17.8rem;
    width: 44rem;
    font-size: 1.4rem;
    line-height: 1.5;
    white-space: nowrap;
  }

  .junior-course__visit-payment-note {
    left: 39.8rem;
    top: 56rem;
    width: 42rem;
    font-size: 1.4rem;
    line-height: 1.5;
    white-space: nowrap;
  }

  /* 3. 入院保障 */
  .junior-course__bubble {
    left: 47.4rem;
    top: 4rem;
    width: 25.3rem;
    height: 5.6002rem;
    background-image: url('../images/junior-bubble-pc.svg');
  }

  .junior-course__bubble-text {
    left: 60.25rem;
    top: 5.4rem;
    font-size: 2rem;
  }

  .junior-course__lead--hospital {
    left: 16rem;
    top: 20.1rem;
    width: 88rem;
    font-size: 2rem;
    line-height: 1.5;
    text-align: center;
  }

  .junior-course__days-title {
    left: 16rem;
    top: 28.1rem;
    width: 88rem;
    height: 5.6rem;
    padding-top: 1.4rem;
    border-radius: 8rem;
    font-size: 2.8rem;
    line-height: 1;
  }

  .junior-course__days-card {
    left: 9.6rem;
    top: 30.9rem;
    width: 100.8rem;
    height: 22.3rem;
    border-width: 0.2rem;
    border-radius: 1rem;
  }

  .junior-course__day {
    top: 35.5rem;
    width: 28.2rem;
    height: 11.2rem;
    border-width: 0.2rem;
    border-radius: 0.5rem;
  }

  .junior-course__day--pneumonia { left: 16rem; }
  .junior-course__day--bronchitis { left: 45.8rem; }
  .junior-course__day--enteric { left: 75.6rem; }

  .junior-course__day-name {
    top: 1.6rem;
    font-size: 2rem;
  }

  .junior-course__day-value {
    top: 5rem;
    font-size: 2rem;
  }

  .junior-course__day-num { font-size: 4.8rem; }

  .junior-course__days-note {
    left: 33.9rem;
    top: 47.9rem;
    width: 52.3rem;
    font-size: 1.4rem;
    line-height: 1.5;
    text-align: center;
  }

  .junior-course__cost {
    top: 61.5rem;
    width: 32.5rem;
    height: 32.5rem;
  }

  .junior-course__cost--transport { left: 9.7rem; }
  .junior-course__cost--bed { left: 43.8rem; }
  .junior-course__cost--meal { left: 77.9rem; }

  .junior-course__cost--transport .junior-course__cost-illust {
    left: 5.3rem;
    top: 9.9rem;
    width: 22.415rem;
    height: 7.3rem;
  }

  .junior-course__cost--bed .junior-course__cost-illust {
    left: 7.3rem;
    top: 9.5rem;
    width: 17.957rem;
    height: 9.201rem;
  }

  .junior-course__cost--meal .junior-course__cost-illust {
    left: 8.6rem;
    top: 7.9rem;
    width: 15.259rem;
    height: 10rem;
  }

  .junior-course__cost--transport .junior-course__cost-label { top: 23.1rem; }
  .junior-course__cost--bed .junior-course__cost-label,
  .junior-course__cost--meal .junior-course__cost-label { top: 24.5rem; }

  .junior-course__divider--hospital {
    left: 9.6rem;
    top: 96.4rem;
    width: 100.8rem;
    height: 0.2rem;
  }

  .junior-course__lead--claim {
    left: 29.5rem;
    top: 98.6rem;
    width: 61.1rem;
    font-size: 2rem;
    line-height: 1.5;
    text-align: center;
  }

  .junior-course__note--claim {
    left: 9.7rem;
    top: 103.2rem;
    width: 100.7rem;
    font-size: 1.4rem;
    line-height: 1.5;
    text-align: center;
  }

  /* 4. 加入年齢・保障期間 */
  .junior-course__panel--term { height: 87.7rem; }

  .junior-course__heading--term {
    left: 9.6rem;
    top: 4rem;
    width: 100.8rem;
    --bar-left: 10.5rem;
    --bar-top: 3.6rem;
    --bar-width: 19rem;
    --bar-height: 1.2rem;
  }

  /* 「満30歳まで」に敷く2本目の下線 */
  .junior-course__heading--term::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 54.8rem;
    top: 3.6rem;
    width: 10rem;
    height: 1.2rem;
    background-color: var(--color-junior-light);
  }

  .junior-course__heading-mark { font-size: 1.4rem; }

  .junior-course__heading-note--term {
    left: 55.9rem;
    top: 9.6rem;
    width: auto;
    text-align: left;
  }

  .junior-course__section-title--term {
    left: 16rem;
    top: 14.1rem;
    width: 88rem;
    height: 5.6rem;
    padding-top: 1.4rem;
    border-radius: 8rem;
    font-size: 2.8rem;
    line-height: 1;
  }

  .junior-course__section-card--term {
    left: 9.6rem;
    top: 16.9rem;
    width: 100.8rem;
    height: 32.5rem;
    border-width: 0.2rem;
    border-radius: 1rem;
  }

  .junior-course__chart-age { font-size: 1.8rem; }
  .junior-course__chart-age--0 { left: 17.4rem; top: 21.3rem; }
  .junior-course__chart-age--19 { left: 66.3rem; top: 21.3rem; }
  .junior-course__chart-age--30 { left: 102.2rem; top: 21.3rem; }

  .junior-course__chart-bar {
    top: 24.4rem;
    height: 9.6rem;
  }

  .junior-course__chart-bar--join { left: 16rem; width: 52rem; }
  .junior-course__chart-bar--keep { left: 68rem; width: 36rem; }

  .junior-course__chart-label {
    left: 41.8rem;
    top: 27.9rem;
    font-size: 1.8rem;
  }

  .junior-course__ruled {
    left: 60rem;
    top: 35.6rem;
    font-size: 2rem;
  }

  .junior-course__ruled-line {
    top: 37rem;
    width: 28.4rem;
    height: 0.2rem;
  }

  .junior-course__ruled-line--left { left: 16rem; }
  .junior-course__ruled-line--right { left: 75.6rem; }

  .junior-course__lead--term {
    left: 16rem;
    top: 40.2rem;
    width: 88rem;
    font-size: 2rem;
    line-height: 1.5;
    text-align: center;
  }

  .junior-course__balloon--term {
    left: 60rem;
    top: 52.6rem;
    line-height: 1.5;
  }

  .junior-course__bracket--term-left,
  .junior-course__bracket--term-right {
    top: 52.5106rem;
    width: 1.72959rem;
    height: 3.42329rem;
  }

  .junior-course__bracket--term-left { left: 32.2rem; }
  .junior-course__bracket--term-right { left: 86.0891rem; }

  .junior-course__lead--transfer {
    left: 9.6rem;
    top: 57.5rem;
    width: 100.8rem;
    font-size: 1.8rem;
    line-height: 1.5;
    text-align: center;
  }

  .junior-course__note--transfer {
    left: 9.7rem;
    top: 61rem;
    width: 100.8rem;
    font-size: 1.4rem;
    line-height: 1.5;
    color: var(--color-text);
    text-align: center;
  }

  .junior-course__plan {
    top: 65.1rem;
    width: 41.2rem;
    height: 18.6rem;
    border-width: 0.2rem;
    border-radius: 0.5rem;
  }

  .junior-course__plan--current { left: 16rem; }
  .junior-course__plan--recommend { left: 62.8rem; }

  .junior-course__plan-title {
    left: 3.2rem;
    top: 2.4rem;
    width: 34.8rem;
    height: 4.6rem;
    padding-top: 0.8rem;
    border-radius: 6.5rem;
    font-size: 2rem;
  }

  .junior-course__plan-list li {
    font-size: 2.4rem;
  }

  .junior-course__plan-list li::before {
    top: 1.2rem;
    width: 1.2rem;
    height: 1.2rem;
    margin-left: -2.4rem;
  }

  .junior-course__plan--current .junior-course__plan-list li { left: 14.2rem; }
  .junior-course__plan--recommend .junior-course__plan-list li { left: 7.5rem; }

  .junior-course__plan-list li:first-child { top: 8.2rem; }
  .junior-course__plan-list li:last-child { top: 12.6rem; }

  .junior-course__plan-arrow {
    left: 57.4287rem;
    top: 72.6rem;
    width: 5.54256rem;
    height: 3.6rem;
    transform: rotate(90deg);
  }

  /* 5. お誕生前申し込み / 上乗せ保障 */
  .junior-course__panel--birth { height: 57.6rem; }

  .junior-course__section-title--birth {
    left: 16rem;
    top: 4rem;
    width: 88rem;
    height: 5.6rem;
    padding-top: 1.4rem;
    border-radius: 8rem;
    font-size: 2.8rem;
    line-height: 1;
  }

  .junior-course__section-card--birth {
    left: 9.6rem;
    top: 6.8rem;
    width: 100.8rem;
    height: 27.5rem;
    border-width: 0.2rem;
    border-radius: 1rem;
  }

  .junior-course__award-badge {
    left: 16rem;
    top: 11.9rem;
    width: 16.1rem;
    height: auto;
  }

  .junior-course__award-course {
    left: 49.1rem;
    top: 13.7rem;
  }

  .junior-course__award-course-sub { font-size: 1.6rem; }
  .junior-course__award-course-main { font-size: 2.4rem; }

  .junior-course__award-underline {
    left: 33.3rem;
    top: 19.5rem;
    width: 31.6rem;
    height: 0.954rem;
  }

  .junior-course__award-name {
    left: 36.9rem;
    top: 20.6rem;
    font-size: 2.3rem;
  }

  .junior-course__award-result {
    left: 51rem;
    top: 20.6rem;
    font-size: 5.2rem;
  }

  .junior-course__birth-card {
    left: 66.9rem;
    top: 11.6rem;
    width: 37.1rem;
    height: 16.6rem;
    box-shadow: 0 0.4rem 0.4rem 0 rgba(226, 203, 209, 0.6);
  }

  .junior-course__birth-card-top { height: 1.6rem; }

  .junior-course__birth-sub {
    left: 18.6rem;
    top: 1.8rem;
    width: 33.6rem;
    height: 5rem;
    padding-top: 0.7rem;
    font-size: 1.4rem;
    line-height: 1.3;
  }

  .junior-course__birth-course {
    left: 7.4rem;
    top: 7.6rem;
    font-size: 1.6rem;
  }

  .junior-course__birth-main {
    left: 24.2rem;
    top: 8.3rem;
    font-size: 2.8rem;
  }

  .junior-course__birth-link {
    left: 17rem;
    top: 12.6rem;
    font-size: 1.6rem;
  }

  .junior-course__birth-link-icon {
    left: 23.4rem;
    top: 12.6rem;
    width: 2.4rem;
    height: 2.4rem;
  }

  .junior-course__birth-link-tri {
    left: 24.167rem;
    top: 13.4rem;
    width: 0.866026rem;
    height: 0.6rem;
  }

  .junior-course__note--birth {
    left: 92.1rem;
    top: 29rem;
    width: auto;
    transform: translateX(-50%);
    font-size: 1.4rem;
    line-height: 1.5;
    color: var(--color-text);
    white-space: nowrap;
  }

  .junior-course__addon {
    left: 9.6rem;
    top: 36.7rem;
    width: 100.8rem;
    height: 16.9rem;
    border-radius: 1rem;
  }

  .junior-course__addon-shape { width: 59.2rem; }

  .junior-course__addon-text {
    top: 3.3rem;
    font-size: 2rem;
    line-height: 1;
  }

  .junior-course__bracket--addon-left,
  .junior-course__bracket--addon-right {
    top: 3.1106rem;
    width: 1.72959rem;
    height: 3.42329rem;
  }

  .junior-course__bracket--addon-left { left: 27.6rem; }
  .junior-course__bracket--addon-right { left: 71.3rem; transform: scaleX(-1); }

  .junior-course__addon-button {
    left: 6.4rem;
    top: 8.1rem;
    width: 88rem;
    height: 5.6rem;
    border-radius: 1rem;
    font-size: 1.8rem;
  }

  .junior-course__addon-arrow {
    left: 83.2rem;
    top: 1.6rem;
    width: 2.4rem;
    height: 2.4rem;
  }

  /* 6. お客様の声 */
  .junior-course__panel--voice { height: 60.5rem; }

  .junior-course__heading--voice {
    top: 4rem;
    --bar-left: 21.3rem;
    --bar-top: 8.3rem;
    --bar-width: 29.2rem;
    --bar-height: 1.2rem;
  }

  .junior-course__heading-note--voice { top: 14.4rem; }

  .junior-course__voice-card {
    left: 9.6rem;
    top: 21.7rem;
    width: 100.8rem;
    height: 34.8rem;
    border-width: 0.2rem;
  }

  .junior-course__voice-title {
    left: 16rem;
    top: 18.9rem;
    width: 88rem;
    height: 5.6rem;
    border-radius: 8rem;
    font-size: 2.8rem;
    line-height: 5.6rem;
  }

  .junior-course__voice-photo {
    left: 16rem;
    top: 26.3rem;
    width: 27rem;
    height: 27rem;
  }

  .junior-course__voice-photo::before { left: 1.2rem; }

  .junior-course__voice-tail {
    /* 回転後の表示 bbox を Figma の (431, 363, 37, 71) に合わせる */
    left: 41.4rem;
    top: 38rem;
    width: 7.1rem;
    height: 3.7rem;
    transform: rotate(90deg);
  }

  .junior-course__voice-text {
    left: 49.2rem;
    top: 29.5rem;
    width: 54.8rem;
    padding-left: 0.4rem;
    padding-right: 4rem;
    font-size: 1.8rem;
    line-height: 1.9;
    background-image:
      repeating-linear-gradient(to right, transparent 0 0.4rem, var(--color-white) 0.4rem 0.8rem),
      repeating-linear-gradient(to bottom, transparent 0 3.32rem, var(--color-junior-light) 3.32rem 3.42rem);
    background-position: 0 0.1rem;
  }

  /* 7. 保障表 / CTA */
  .junior-course__panel--plan {
    height: 169.2rem;
    background-color: transparent;
  }

  .junior-course__panel--plan::before {
    height: 160.2rem;
    border-radius: 2rem;
  }

  .junior-course__heading--table {
    left: 55.2rem;
    top: 4rem;
    width: 9.6rem;
    --bar-left: -0.4rem;
    --bar-top: 3.6rem;
    --bar-width: 10.4rem;
    --bar-height: 1.2rem;
  }

  .junior-course__table-scroll {
    left: 9.6rem;
    top: 12rem;
    width: 100.8rem;
  }

  .junior-course__table { width: 100.8rem; }
  /* 詳細度が同じため、修飾子(--label)を基底クラスより後に書く必要がある */
  .junior-course__table-col { width: 24rem; }
  .junior-course__table-col--label { width: 28.8rem; }

  .junior-course__table thead th {
    height: 7.2rem;
    font-size: 1.8rem;
  }

  .junior-course__table tbody th {
    padding: 0 4.2rem;
    font-size: 1.6rem;
  }

  .junior-course__table tbody td { font-size: 1.6rem; }
  .junior-course__table-sub { font-size: 1.4rem; }

  /* Figma の罫線 y 座標から算出した各行の高さ（合計 1118px） */
  .junior-course__table tbody tr:nth-child(1) { height: 9rem; }
  .junior-course__table tbody tr:nth-child(2) { height: 6.4rem; }
  .junior-course__table tbody tr:nth-child(3) { height: 6.4rem; }
  .junior-course__table tbody tr:nth-child(4) { height: 8.8rem; }
  .junior-course__table tbody tr:nth-child(5) { height: 10.6rem; }
  .junior-course__table tbody tr:nth-child(6) { height: 12.7rem; }
  .junior-course__table tbody tr:nth-child(7) { height: 8.5rem; }
  .junior-course__table tbody tr:nth-child(8) { height: 12.7rem; }
  .junior-course__table tbody tr:nth-child(9) { height: 7.2rem; }
  .junior-course__table tbody tr:nth-child(10) { height: 9.6rem; }
  .junior-course__table tbody tr:nth-child(11) { height: 8.8rem; }
  .junior-course__table tbody tr:nth-child(12) { height: 11.1rem; }

  .junior-course__table-plus {
    top: -1.2rem;
    font-size: 2rem;
  }

  .junior-course__table-notes {
    left: 9.6rem;
    top: 132.4rem;
    width: 100.8rem;
    font-size: 1.4rem;
    line-height: 1.5;
  }

  .junior-course__cta {
    left: 9.6rem;
    top: 149rem;
    width: 100.8rem;
    height: 20.2rem;
    background-color: var(--color-primary);
    border-radius: 1rem;
  }

  .junior-course__cta-button {
    top: 3.6rem;
    width: 43.2rem;
    height: 5.6rem;
    border-radius: 1rem;
    font-size: 1.8rem;
  }

  .junior-course__cta-button--quote { left: 6.4rem; }
  .junior-course__cta-button--document { left: 51.2rem; }

  .junior-course__cta-arrow {
    right: 1.6rem;
    width: 2.4rem;
    height: 2.4rem;
  }

  .junior-course__cta-note {
    left: 0;
    top: 11.2rem;
    width: 100%;
    font-size: 1.8rem;
    text-align: center;
  }
}

/* ============ お誕生前コース ============ */
.before-birth {
  position: relative;
  z-index: 0;
}

/* Figma の「お誕生前_bg」。ジュニアと同じく全幅の下地を敷く */
.before-birth::before {
  content: '';
  position: absolute;
  z-index: -1;
  left: 0;
  width: 100%;
  background-color: var(--color-birth-bg);
}

.before-birth__panel {
  position: relative;
  z-index: 0;
  margin-left: auto;
  margin-right: auto;
  background-color: var(--color-white);
}

.before-birth__panel + .before-birth__panel {
  margin-top: 0.4rem;
}

/* お手続きパネルは CTA が白カードの下端からはみ出すため、下地を疑似要素で敷く */
.before-birth__panel--flow {
  background-color: transparent;
}

.before-birth__panel--flow::before {
  content: '';
  position: absolute;
  z-index: -2;
  left: 0;
  top: 0;
  width: 100%;
  background-color: var(--color-white);
}

/* ---- タイトル帯 ---- */
.before-birth__intro-bg,
.before-birth__intro-sub,
.before-birth__intro-title,
.before-birth__intro-illust {
  position: absolute;
}

.before-birth__intro-bg {
  left: 0;
  top: 0;
  width: 100%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.before-birth__intro-sub {
  background-color: var(--color-birth-light);
  border-radius: 6rem;
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  text-align: center;
  white-space: nowrap;
}

.before-birth__intro-title {
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-white);
  white-space: nowrap;
}

.before-birth__intro-illust {
  object-fit: cover;
}

/* ---- 吹き出し・見出し ---- */
.before-birth__bubble {
  position: absolute;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.before-birth__bubble-text {
  position: absolute;
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-birth);
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}

/*
 * 見出し背後のマーカーは本数が見出しごとに異なるため、
 * 疑似要素ではなく linear-gradient を重ねた背景として敷く。
 */
.before-birth__heading {
  position: absolute;
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-text);
  line-height: 1.5;
  background-repeat: no-repeat;
}

.before-birth__heading--table {
  white-space: nowrap;
}

/* ---- 見出しピル・白カード ---- */
.before-birth__section-title,
.before-birth__section-card,
.before-birth__divider {
  position: absolute;
}

.before-birth__section-title {
  /* 白カードの上に重なる見出しピル（.women-course__plan-label と同じ理由） */
  z-index: 1;
  background-color: var(--color-birth);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-white);
  text-align: center;
  white-space: nowrap;
}

.before-birth__section-card {
  background-color: var(--color-white);
  border-style: solid;
  border-color: var(--color-birth);
}

.before-birth__divider {
  background-color: var(--color-birth-light);
  border-radius: 1rem;
}

.before-birth__lead {
  position: absolute;
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  background-repeat: no-repeat;
}

/* ---- 1. お誕生前申し込みのポイント ---- */
.before-birth__point {
  position: absolute;
  background-color: var(--color-white);
  border-style: solid;
  border-color: var(--color-birth-light);
  border-radius: 0.5rem;
}

.before-birth__point-badge,
.before-birth__point-num,
.before-birth__point-underline,
.before-birth__point-title,
.before-birth__point-text,
.before-birth__point-note {
  position: absolute;
}

.before-birth__point-num {
  transform: translateX(-50%);
  font-family: var(--font-family-en);
  font-weight: 700;
  color: var(--color-white);
  line-height: 0.88;
  text-align: center;
  white-space: nowrap;
}

.before-birth__point-num-label,
.before-birth__point-num-value {
  display: block;
}

.before-birth__point-title {
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-birth);
  line-height: 1.5;
}

.before-birth__point-text {
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  line-height: 1.5;
  background-repeat: no-repeat;
}

/* Figma は折り返し行の行頭に全角スペースを入れて「※」の下に本文が回り込まないようにしている。
   マークアップに全角スペースを持たせず、ぶら下げインデントで同じ字下げを再現する */
.before-birth__point-note {
  font-family: var(--font-family-base);
  font-weight: 400;
  color: var(--color-text-sub);
  line-height: 1.5;
  padding-left: 1em;
  text-indent: -1em;
}

/* ---- 2. 保障表 ---- */
.before-birth__table-scroll {
  position: absolute;
  overflow-x: auto;
}

.before-birth__table {
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  font-family: var(--font-family-base);
  color: var(--color-text);
  line-height: 1.5;
}

.before-birth__table th,
.before-birth__table td {
  text-align: center;
  vertical-align: middle;
  font-weight: 500;
}

.before-birth__table thead th {
  background-color: var(--color-birth);
  background-clip: padding-box;
  color: var(--color-white);
  border: 0.2rem solid var(--color-birth);
  border-bottom: 0;
}

.before-birth__table tbody td {
  font-weight: 400;
}

/* 内側の罫線は淡い黄色、外周は黄色 */
.before-birth__table tbody tr > * {
  border-top: 0.2rem solid var(--color-birth-light);
}

.before-birth__table tbody tr:first-child > * {
  border-top-color: var(--color-birth);
}

.before-birth__table tbody tr:last-child > * {
  border-bottom: 0.2rem solid var(--color-birth);
}

.before-birth__table tbody tr > *:first-child {
  position: relative;
  border-left: 0.2rem solid var(--color-birth);
}

.before-birth__table tbody tr > *:last-child {
  position: relative;
  border-right: 0.2rem solid var(--color-birth);
}

/* 外周ボーダーが行罫線とのマイターで欠けるのを防ぐ（女性コースと同じ理由） */
.before-birth__table tbody tr > *:first-child::before,
.before-birth__table tbody tr > *:last-child::after {
  content: '';
  position: absolute;
  top: -0.2rem;
  bottom: 0;
  width: 0.2rem;
  background-color: var(--color-birth);
}

.before-birth__table tbody tr > *:first-child::before {
  left: -0.2rem;
}

.before-birth__table tbody tr > *:last-child::after {
  right: -0.2rem;
}

.before-birth__table tbody th + td {
  border-left: 0.2rem solid var(--color-birth-light);
}

/* 濃色の横罫線が縦罫線とのマイターで欠けるのを防ぐ（女性コースと同じ理由） */
.before-birth__table tbody tr:first-child > * + *,
.before-birth__table tbody tr:last-child > * + * {
  position: relative;
}

.before-birth__table tbody tr:first-child > * + *::before,
.before-birth__table tbody tr:last-child > * + *::before {
  content: '';
  position: absolute;
  left: -0.2rem;
  right: 0;
  height: 0;
}

.before-birth__table tbody tr:first-child > * + *::before {
  bottom: 100%;
  border-top: 0.2rem solid var(--color-birth);
}

.before-birth__table tbody tr:last-child > * + *::before {
  top: 100%;
  border-bottom: 0.2rem solid var(--color-birth);
}

.before-birth__table-sub {
  font-weight: 400;
}

/* 「病気死亡」行と「事故死亡」行をつなぐ ＋ は、行の境界にまたがって置く */
.before-birth__table tbody tr:nth-child(10) td {
  position: relative;
}

.before-birth__table-plus {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-weight: 500;
  line-height: 1;
}

.before-birth__table-notes {
  position: absolute;
  font-family: var(--font-family-base);
  font-weight: 400;
  color: var(--color-text-sub);
}

.before-birth__table-notes li {
  padding-left: 1em;
  text-indent: -1em;
}

/* ---- 3. 対象コース ---- */
.before-birth__target-illust,
.before-birth__target-course,
.before-birth__target-underline,
.before-birth__target-logo,
.before-birth__target-plan,
.before-birth__target-note,
.before-birth__target-link,
.before-birth__button {
  position: absolute;
}

.before-birth__target-illust {
  z-index: 2;
}
.before-birth__target-course {
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-women);
  white-space: nowrap;
}

/* Figma のクロップ（拡大率・オフセット）をそのまま再現する */
.before-birth__target-logo img {
  position: absolute;
  display: block;
  max-width: none;
  width: 109.95%;
  height: 106.99%;
  left: -6.97%;
  top: -5.94%;
}

.before-birth__target-plan {
  background-color: var(--color-women-light);
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  text-align: center;
}

.before-birth__target-note {
  font-family: var(--font-family-base);
  font-weight: 400;
  color: var(--color-text-sub);
}

.before-birth__target-link {
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-women);
  line-height: 1.5;
  text-align: center;
  text-decoration: underline;
  white-space: nowrap;
}

.before-birth__button {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-white);
  border-style: solid;
  border-color: var(--color-primary);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1.4;
}

.before-birth__button-arrow {
  position: absolute;
}

/* ---- 4. お手続きの流れ ---- */
.before-birth__timeline {
  position: absolute;
}

.before-birth__timeline-bracket,
.before-birth__timeline-caption,
.before-birth__timeline-bubble,
.before-birth__timeline-bubble-text,
.before-birth__timeline-illust,
.before-birth__timeline-step,
.before-birth__timeline-arrow,
.before-birth__timeline-term,
.before-birth__timeline-up,
.before-birth__timeline-note {
  position: absolute;
}

.before-birth__timeline-bracket--before-right,
.before-birth__timeline-bracket--after-right {
  transform: scaleX(-1);
}

.before-birth__timeline-caption {
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-text);
  line-height: 1.2;
  text-align: center;
  white-space: nowrap;
}

.before-birth__timeline-caption-em {
  color: var(--color-women);
}

.before-birth__timeline-bubble {
  background-image: url('../images/birth-bubble-transfer-pc.svg');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.before-birth__timeline-bubble-text {
  transform: translateX(-50%);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-text);
  line-height: 1;
  text-align: center;
}

.before-birth__timeline-step {
  transform: translateX(-50%);
  border-radius: 0.5rem;
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-white);
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}

.before-birth__timeline-step--1 { background-color: var(--color-women); }
.before-birth__timeline-step--born,
.before-birth__timeline-step--pay { background-color: #ffa0c3; }
.before-birth__timeline-step--2 { background-color: var(--color-addon); }

.before-birth__timeline-term {
  transform: translateX(-50%);
  background-color: var(--color-white);
  border-style: solid;
  border-radius: 0.5rem;
  font-family: var(--font-family-base);
  font-weight: 700;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}

.before-birth__timeline-term--week {
  border-color: var(--color-women);
  color: var(--color-women);
}

.before-birth__timeline-term--month {
  border-color: var(--color-addon);
  color: var(--color-addon);
}

.before-birth__timeline-note {
  transform: translateX(-50%);
  background-color: var(--color-women-light);
  border-radius: 0.5rem;
  font-family: var(--font-family-base);
  font-weight: 500;
  color: var(--color-text);
  line-height: 1.1;
  text-align: center;
  white-space: nowrap;
}

.before-birth__terms {
  position: absolute;
  background-color: var(--color-birth-light);
}

.before-birth__terms-list,
.before-birth__terms-note {
  position: absolute;
  font-family: var(--font-family-base);
}

.before-birth__terms-list {
  font-weight: 400;
  color: var(--color-text);
  line-height: 1.5;
}

.before-birth__terms-note {
  font-weight: 400;
  color: var(--color-text-sub);
  line-height: 1.5;
}

.before-birth__cta {
  position: absolute;
  background-color: var(--color-primary);
}

.before-birth__cta-button {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-white);
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1.4;
}

.before-birth__cta-arrow {
  position: absolute;
}

@media (max-width: 767px) {
  .before-birth {
    margin-top: 5.6rem;
  }

  .before-birth::before {
    top: 4.8rem;
    height: 384rem;
  }

  .before-birth__panel {
    width: calc(100% - 4rem);
    max-width: 35rem;
    border-radius: 0.8rem;
  }

  .before-birth__panel--intro { height: 132.4rem; }
  .before-birth__panel--plan { height: 99.2rem; }
  .before-birth__panel--target { height: 70.4rem; }
  .before-birth__panel--flow { height: 71.4rem; }

  .before-birth__panel--flow::before {
    height: 67.8rem;
    border-radius: 0.8rem;
  }

  /* タイトル帯 */
  .before-birth__intro-bg {
    height: 12.3rem;
    background-image: url('../images/birth-title-bg-sp.svg');
  }

  .before-birth__intro-sub {
    left: 2.4rem;
    top: 1.6rem;
    width: 30.2rem;
    height: 2.2rem;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }

  .before-birth__intro-title {
    left: 2.4rem;
    top: 4.5rem;
    font-size: 2.2rem;
    line-height: 1.2;
  }

  .before-birth__intro-illust {
    left: 24.6rem;
    top: 7rem;
    width: 9.4rem;
    height: 10.2rem;
  }

  /* 吹き出し */
  .before-birth__bubble {
    height: 3.4rem;
  }

  .before-birth__bubble-text {
    font-size: 1.4rem;
  }

  .before-birth__bubble--what {
    left: 3.6rem;
    top: 13.1rem;
    width: 20rem;
    background-image: url('../images/birth-bubble-sp.svg');
  }

  .before-birth__bubble-text--what { left: 13.7rem; top: 13.8rem; }

  .before-birth__bubble--before {
    left: 9.6rem;
    top: 3.2rem;
    width: 15.8rem;
    background-image: url('../images/birth-bubble2-sp.svg');
  }

  .before-birth__bubble-text--before { left: 17.5rem; top: 3.9rem; }

  .before-birth__bubble--flow {
    left: 9.6rem;
    top: 3.2rem;
    width: 15.8rem;
    background-image: url('../images/birth-bubble3-sp.svg');
  }

  .before-birth__bubble-text--flow { left: 17.5rem; top: 3.9rem; }

  /* 見出し */
  .before-birth__heading {
    left: 2.4rem;
    width: 30.2rem;
    background-image:
      linear-gradient(var(--color-birth-light), var(--color-birth-light)),
      linear-gradient(var(--color-birth-light), var(--color-birth-light)),
      linear-gradient(var(--color-birth-light), var(--color-birth-light)),
      linear-gradient(var(--color-birth-light), var(--color-birth-light));
  }

  .before-birth__heading--what {
    top: 16.5rem;
    font-size: 2rem;
    background-size: 12.3rem 0.8rem, 25.9rem 0.8rem, 0 0, 0 0;
    background-position: 17.9rem 2.2rem, 0 5.2rem, 0 0, 0 0;
  }

  .before-birth__heading--target {
    top: 6.6rem;
    font-size: 2.4rem;
    background-size: 5.1rem 0.8rem, 26.4rem 0.8rem, 4.1rem 0.8rem, 5rem 0.8rem;
    background-position: 23.9rem 2.6rem, 0 6.2rem, 0 9.9rem, 9.5rem 9.9rem;
  }

  .before-birth__heading--flow {
    top: 6.6rem;
    font-size: 2.4rem;
    background-size: 5.1rem 0.8rem, 15.5rem 0.8rem, 0 0, 0 0;
    background-position: 23.9rem 2.6rem, 0 6.2rem, 0 0, 0 0;
  }

  .before-birth__heading--table {
    left: 13.2rem;
    top: 3.2rem;
    width: 8.8rem;
    text-align: center;
    font-size: 2.4rem;
    background-size: 8.8rem 0.8rem, 0 0, 0 0, 0 0;
    background-position: 0 2.7rem, 0 0, 0 0, 0 0;
  }

  /* 見出しピル・白カード */
  .before-birth__section-title {
    left: 3.6rem;
    width: 27.8rem;
    height: 3.6rem;
    padding-top: 0.7rem;
    border-radius: 6rem;
    font-size: 1.6rem;
    line-height: 1.3;
  }

  .before-birth__section-card {
    left: 2.4rem;
    width: 30.2rem;
    border-width: 0.1rem;
    border-radius: 0.5rem;
  }

  .before-birth__section-title--point { top: 33.5rem; }
  .before-birth__section-card--point { top: 35.3rem; height: 93.9rem; }

  .before-birth__section-title--target { top: 20.4rem; }
  .before-birth__section-card--target { top: 22.2rem; height: 45rem; }

  .before-birth__section-title--flow { top: 19.4rem; }
  .before-birth__section-card--flow { top: 21.2rem; height: 41rem; }

  /* 1. ポイント */
  .before-birth__point {
    left: 3.6rem;
    width: 27.8rem;
    border-width: 0.1rem;
  }

  .before-birth__point--1 { top: 40.7rem; height: 20.8rem; }
  .before-birth__point--2 { top: 64.5rem; height: 22.4rem; }
  .before-birth__point--3 { top: 89.9rem; height: 29.7rem; }

  .before-birth__point-badge {
    left: 10.3rem;
    top: -2rem;
    width: 7.2rem;
    height: 5.3rem;
  }

  .before-birth__point-num {
    left: 13.836rem;
    top: -0.586rem;
  }

  .before-birth__point-num-label { font-size: 1rem; }
  .before-birth__point-num-value { font-size: 2.4rem; }

  .before-birth__point-underline {
    left: 1.2rem;
    width: 25.4rem;
    height: 0.851778rem;
  }

  .before-birth__point-title {
    font-size: 1.6rem;
  }

  .before-birth__point-text {
    left: 1.2rem;
    width: 25.4rem;
    font-size: 1.4rem;
    background-image:
      linear-gradient(var(--color-birth-light), var(--color-birth-light)),
      linear-gradient(var(--color-birth-light), var(--color-birth-light));
  }

  .before-birth__point-text-small { font-size: 1.2rem; }

  .before-birth__point-note {
    left: 1.2rem;
    width: 25.4rem;
    font-size: 1.2rem;
  }

  .before-birth__point--1 .before-birth__point-underline { top: 6.84rem; }
  .before-birth__point--1 .before-birth__point-title { left: 5.9rem; top: 4.1rem; }
  .before-birth__point--1 .before-birth__point-text {
    top: 8.2rem;
    background-size: 8.4rem 0.6rem, 19.6rem 0.6rem;
    background-position: 8.3rem 1.6rem, 0 5.8rem;
  }
  .before-birth__point--1 .before-birth__point-note { top: 17.4rem; }

  .before-birth__point--2 .before-birth__point-underline { top: 6.84rem; }
  .before-birth__point--2 .before-birth__point-title { left: 1.9rem; top: 4.1rem; }
  .before-birth__point--2 .before-birth__point-text {
    top: 8.2rem;
    background-size: 11.6rem 0.6rem, 10.4rem 0.6rem;
    background-position: 13.8rem 3.7rem, 0 5.8rem;
  }
  .before-birth__point--2 .before-birth__point-note { top: 15.4rem; }

  .before-birth__point--3 .before-birth__point-underline { top: 11.84rem; }
  .before-birth__point--3 .before-birth__point-title { left: 1.2rem; top: 4.1rem; width: 25.4rem; }
  .before-birth__point--3 .before-birth__point-text {
    top: 13.2rem;
    background-size: 3.3rem 0.6rem, 18.1rem 0.6rem;
    background-position: 22.1rem 1.6rem, 0 3.7rem;
  }
  .before-birth__point--3 .before-birth__point-note { top: 24.5rem; }

  .before-birth__lead--point {
    left: 3.6rem;
    top: 121.2rem;
    width: 28rem;
    font-size: 1.4rem;
    line-height: 1.4;
  }

  /* 2. 保障表 */
  .before-birth__table-scroll {
    left: 2.4rem;
    top: 8.8rem;
    width: 30.2rem;
    overflow-x: clip;
  }

  .before-birth__table { width: 30.2rem; }
  /* 列幅は Figma の縦罫線 x 座標から算出（157.8 / 144.2）。
     詳細度が同じため、修飾子(--label)は基底クラスより後に書く必要がある */
  .before-birth__table-col { width: 14.4rem; }
  .before-birth__table-col--label { width: 15.8rem; }

  /*
   * フォントサイズは Figma の字形を ink バウンディングボックスで実測して決めた値
   * （基準 11px / 注記 8.3px・字送りの追加はゼロ。ジュニアコース表と同じ）。
   * 行送りは基準を含む行 16.5px / 注記だけの行 12.45px で、どちらも
   * 「その行の最大フォントサイズ × 1.5」。表の基底が line-height: 1.5 なので
   * セルごとの上書きは不要で、1行まるごと注記のかたまりだけ --line で display: block にし、
   * 自分の font-size（0.83rem）基準の行ボックスを持たせる。
   */
  .before-birth__table thead th {
    height: 3.3rem;
    font-size: 1.1rem;
    border-width: 0;
  }

  /* 行高を Figma の罫線 y 座標で固定するため、上下 padding は持たせず
     行の height と vertical-align: middle で中央に置く */
  .before-birth__table tbody th {
    padding: 0 1rem;
    font-size: 1.1rem;
  }

  .before-birth__table tbody td {
    padding: 0 0.4rem;
    font-size: 1.1rem;
  }

  .before-birth__table-sub--line { display: block; }

  /* 最新 Figma の罫線 y 座標から算出した各行の高さ（合計 589px） */
  .before-birth__table tbody tr:nth-child(1) { height: 3.1rem; }
  .before-birth__table tbody tr:nth-child(2) { height: 3.3rem; }
  .before-birth__table tbody tr:nth-child(3) { height: 3.3rem; }
  .before-birth__table tbody tr:nth-child(4) { height: 5rem; }
  .before-birth__table tbody tr:nth-child(5) { height: 5.7rem; }
  .before-birth__table tbody tr:nth-child(6) { height: 6.9rem; }
  .before-birth__table tbody tr:nth-child(7) { height: 4.5rem; }
  .before-birth__table tbody tr:nth-child(8) { height: 7rem; }
  .before-birth__table tbody tr:nth-child(9) { height: 3.3rem; }
  .before-birth__table tbody tr:nth-child(10) { height: 5.2rem; }
  .before-birth__table tbody tr:nth-child(11) { height: 5.3rem; }
  .before-birth__table tbody tr:nth-child(12) { height: 6.3rem; }

  .before-birth__table-sub { font-size: 0.83rem; }

  /* Figma は PC・SP とも、この行の「（ケガ）」だけ注記サイズではなく基準サイズで組んでいる
     （SP の字送り実測 11.1px。すぐ上の行の同じ文字列は 8.3px）。デザインどおりに再現している */
  .before-birth__table-sub--regular { font-size: 1.1rem; }

  .before-birth__table-plus {
    top: -.7rem;
    font-size: 1.4rem;
  }

  .before-birth__table-notes {
    left: 2.5rem;
    top: 72.2rem;
    width: 30.1rem;
    font-size: 1.2rem;
    line-height: 1.4;
  }

  /* 3. 対象コース */
  .before-birth__target-illust {
    left: 3.6rem;
    top: 19rem;
    width: 6.6786rem;
    height: 6.4rem;
  }

  .before-birth__target-course {
    left: 5.3rem;
    top: 25.8rem;
    font-size: 1.6rem;
    line-height: 1.5;
  }

  .before-birth__target-course-small { font-size: 1.2rem; }

  .before-birth__target-underline {
    left: 3.6rem;
    top: 28.44rem;
    width: 18.6rem;
    height: 0.851778rem;
  }

  .before-birth__target-logo {
    left: 23rem;
    top: 24.8rem;
    width: 8.4rem;
    height: 4.3rem;
  }

  .before-birth__target-plan {
    top: 29.8rem;
    width: 9rem;
    height: 4.8rem;
    padding-top: 0.5rem;
    border-radius: 0.3rem;
    font-size: 1.6rem;
    line-height: 1.2;
  }

  .before-birth__target-plan--2000 { left: 3.6rem; }
  .before-birth__target-plan--3000 { left: 13rem; }
  .before-birth__target-plan--4000 { left: 22.4rem; }

  .before-birth__target-note {
    left: 3.6rem;
    top: 35.4rem;
    width: 27.8rem;
    font-size: 1.2rem;
    line-height: 1.4;
  }

  .before-birth__target-note span {
    display: block;
    padding-left: 1em;
    text-indent: -1em;
  }

  .before-birth__divider--target {
    left: 3.6rem;
    top: 41.7rem;
    width: 27.8rem;
    height: 0.2rem;
  }

  .before-birth__lead--target {
    left: 3.6rem;
    top: 43.1rem;
    width: 27.8rem;
    font-size: 1.4rem;
    line-height: 1.4;
  }

  .before-birth__target-link {
    left: 9.9rem;
    top: 47.9rem;
    font-size: 1.4rem;
  }

  .before-birth__button--quote {
    left: 3.6rem;
    top: 51.6rem;
    width: 27.8rem;
    height: 4rem;
    border-width: 0.1rem;
    border-radius: 0.5rem;
    font-size: 1.4rem;
  }

  .before-birth__button-arrow {
    left: 25rem;
    top: 1rem;
    width: 2rem;
    height: 2rem;
  }

  .before-birth__lead--target-note {
    left: 3.6rem;
    top: 57.2rem;
    width: 27.8rem;
    font-size: 1.4rem;
    line-height: 1.4;
    background-image: linear-gradient(var(--color-women-light), var(--color-women-light));
    background-size: 12.8rem 0.6rem;
    background-position: 1.3rem 3.5rem;
  }

  /* 4. お手続きの流れ */
  /*
   * Figma SP ではこの図全体がアウトライン化されておりフォントサイズを直接読めないが、
   * 各要素の ink バウンディングボックスが PC 版のちょうど 0.34684 倍
   * （ノートのみ 0.49697 倍）で一致するため、PC の設計値をその比率で換算している。
   * 位置は「SP の実測 ink 座標 − PC の（ink − ボックス）オフセット × 比率」で算出。
   */
  .before-birth__timeline {
    left: 3.6rem;
    top: 24.2rem;
    width: 27.7773rem;
    height: 10.5004rem;
  }

  .before-birth__timeline-bracket {
    width: 0.5814rem;
    height: 1.1699rem;
  }

  .before-birth__timeline-bracket--before-left { left: 0.8688rem; top: 0.2114rem; }
  .before-birth__timeline-bracket--before-right { left: 4.3562rem; top: 0.1769rem; }
  .before-birth__timeline-bracket--after-left { left: 15.5056rem; top: 0.2114rem; }
  .before-birth__timeline-bracket--after-right { left: 18.9929rem; top: 0.1767rem; }

  /* 行ボックスの上端が図の枠より 1.39px 上に出るのが Figma どおり */
  .before-birth__timeline-caption {
    top: -0.1393rem;
    font-size: 0.5549rem;
  }

  .before-birth__timeline-caption--before { left: 2.9033rem; }
  .before-birth__timeline-caption--after { left: 17.54rem; }

  .before-birth__timeline-caption-em { font-size: 0.6937rem; }

  .before-birth__timeline-bubble {
    left: 21.9731rem;
    top: 0.1383rem;
    width: 5.8269rem;
    height: 1.6662rem;
  }

  .before-birth__timeline-bubble-text {
    left: 24.9906rem;
    top: 0.5547rem;
    width: 4.9945rem;
    font-size: 0.5549rem;
    white-space: nowrap;
  }

  .before-birth__timeline-illust--step1 { left: 1.3707rem; top: 1.5615rem; width: 3.0176rem; height: 3.0549rem; }
  .before-birth__timeline-illust--step2 { left: 8.9665rem; top: 1.457rem; width: 2.5666rem; height: 3.159rem; }
  .before-birth__timeline-illust--step3 { left: 15.938rem; top: 1.5615rem; width: 3.2257rem; height: 3.0549rem; }
  .before-birth__timeline-illust--money { left: 23.2563rem; top: 2.1861rem; width: 3.2256rem; height: 2.4646rem; }

  .before-birth__timeline-step {
    width: 5.7923rem;
    height: 1.215rem;
    border-radius: 0.1734rem;
    font-size: 0.6243rem;
  }

  .before-birth__timeline-step-num { font-size: 0.8324rem; }

  .before-birth__timeline-step--1 { left: 2.8962rem; top: 5.0328rem; padding-top: 0.1041rem; }
  .before-birth__timeline-step--born { left: 10.2325rem; top: 5.0328rem; padding-top: 0.2775rem; }
  .before-birth__timeline-step--2 { left: 17.5508rem; top: 5.0328rem; padding-top: 0.1041rem; }
  .before-birth__timeline-step--pay { left: 24.8545rem; top: 5.0328rem; padding-top: 0.2775rem; }

  .before-birth__timeline-arrow {
    left: 0;
    top: 6.6045rem;
    width: 27.7773rem;
    height: 2.8715rem;
  }

  .before-birth__timeline-term {
    top: 6.6297rem;
    height: 0.972rem;
    padding-top: 0.0486rem;
    border-width: 0.0347rem;
    border-radius: 0.1734rem;
    font-size: 0.5549rem;
  }

  .before-birth__timeline-term-num { font-size: 0.7284rem; }

  .before-birth__timeline-term--week { left: 3.3582rem; width: 4.9598rem; }
  .before-birth__timeline-term--month { left: 17.5682rem; width: 5.4107rem; }

  .before-birth__timeline-up {
    left: 9.7946rem;
    top: 7.4627rem;
    width: 0.841rem;
    height: 0.5467rem;
  }

  /* ノートだけ図の他要素と縮小率が違い、枠は横 0.497／縦 0.4835 倍で角丸が楕円になる */
  .before-birth__timeline-note {
    left: 17.4569rem;
    top: 8.0826rem;
    width: 13.175rem;
    height: 2.4175rem;
    padding-top: 0.3014rem;
    border-radius: 0.2485rem / 0.2417rem;
    font-size: 0.7952rem;
  }

  .before-birth__divider--flow {
    left: 3.6rem;
    top: 36.3rem;
    width: 27.8rem;
    height: 0.2rem;
  }

  .before-birth__lead--flow {
    left: 3.6rem;
    top: 37.7rem;
    width: 27.8rem;
    font-size: 1.4rem;
    line-height: 1.4;
  }

  .before-birth__terms {
    left: 3.6rem;
    top: 42.9rem;
    width: 27.8rem;
    height: 17.3rem;
    border-radius: 0.3rem;
  }

  .before-birth__terms-list {
    left: 1.2rem;
    top: 1.2rem;
    width: 25.4rem;
    font-size: 1.4rem;
  }

  /* SP は「：」を改行に置き換え、続き行を1文字ぶん字下げする */
  .before-birth__terms-sep { display: none; }

  .before-birth__terms-list li {
    padding-left: 1em;
    text-indent: -1em;
  }

  .before-birth__terms-note {
    left: 1.2rem;
    top: 14.3rem;
    font-size: 1.2rem;
  }

  .before-birth__cta {
    left: 2.4rem;
    top: 64.2rem;
    width: 30.2rem;
    height: 7.2rem;
    background-color: rgba(230, 0, 18, 0.95);
    border-radius: 0.5rem;
  }

  .before-birth__cta-button {
    left: 1.6rem;
    top: 1.6rem;
    width: 27rem;
    height: 4rem;
    border-radius: 0.5rem;
    font-size: 1.4rem;
  }

  .before-birth__cta-arrow {
    left: 24.2rem;
    top: 1rem;
    width: 2rem;
    height: 2rem;
  }
}

@media (min-width: 768px) {
  .before-birth {
    margin-top: 11.2rem;
  }

  .before-birth::before {
    top: 7.2rem;
    height: 440rem;
  }

  .before-birth__panel {
    width: 120rem;
    border-radius: 2rem;
  }

  .before-birth__panel--intro { height: 123.1rem; }
  .before-birth__panel--plan { height: 132.9rem; }
  .before-birth__panel--target { height: 74.8rem; }
  .before-birth__panel--flow { height: 96.8rem; }

  .before-birth__panel--flow::before {
    height: 90.9rem;
    border-radius: 2rem;
  }

  /* タイトル帯 */
  .before-birth__intro-bg {
    height: 18rem;
    background-image: url('../images/birth-title-bg-pc.svg');
  }

  .before-birth__intro-sub {
    left: 25.3rem;
    top: 2.4rem;
    width: 68.8rem;
    height: 4rem;
    font-size: 2.4rem;
    line-height: 4rem;
  }

  /* Figma のタイトルは x=96 / w=870（パネル基準）。
     55.6rem だとテキスト実測 86.9rem が収まらず右のクマイラストに食い込む */
  .before-birth__intro-title {
    left: 9.6rem;
    top: 8rem;
    width: 87rem;
    font-size: 4rem;
    line-height: 1;
    text-align: center;
  }

  .before-birth__intro-illust {
    left: 97.7rem;
    top: 6.4rem;
    width: 18.5rem;
    height: 20rem;
  }

  /* 吹き出し */
  .before-birth__bubble-text {
    font-size: 2rem;
  }

  .before-birth__bubble--what {
    left: 45.8rem;
    top: 18rem;
    width: 28.4rem;
    height: 5.6003rem;
    background-image: url('../images/birth-bubble-pc.svg');
  }

  .before-birth__bubble-text--what { left: 60.2rem; top: 19.4rem; }

  .before-birth__bubble--before {
    left: 48.7rem;
    top: 4rem;
    width: 22.6rem;
    height: 5.5998rem;
    background-image: url('../images/birth-bubble2-pc.svg');
  }

  .before-birth__bubble-text--before { left: 60rem; top: 5.4rem; }

  .before-birth__bubble--flow {
    left: 48.6rem;
    top: 4rem;
    width: 22.8rem;
    height: 5.5998rem;
    background-image: url('../images/birth-bubble3-pc.svg');
  }

  .before-birth__bubble-text--flow { left: 60rem; top: 5.4rem; }

  /* 見出し */
  .before-birth__heading {
    left: 9.6rem;
    width: 100.8rem;
    font-size: 3.2rem;
    text-align: center;
    background-image:
      linear-gradient(var(--color-birth-light), var(--color-birth-light)),
      linear-gradient(var(--color-birth-light), var(--color-birth-light));
  }

  .before-birth__heading--what {
    top: 24rem;
    background-size: 61rem 1.2rem, 0 0;
    background-position: 34.1rem 3.6rem, 0 0;
  }

  .before-birth__heading--target {
    left: 16.7rem;
    top: 10rem;
    width: 86.4rem;
    white-space: nowrap;
    background-size: 47.2rem 1.2rem, 6.9rem 1.2rem;
    background-position: 31.9rem 3.4rem, 30rem 8.3rem;
  }

  .before-birth__heading--flow {
    top: 10rem;
    background-size: 27rem 1.2rem, 0 0;
    background-position: 37rem 3.4rem, 0 0;
  }

  .before-birth__heading--table {
    left: 55.2rem;
    top: 4rem;
    width: 9.6rem;
    background-size: 10.4rem 1.2rem, 0 0;
    background-position: -0.4rem 3.6rem, 0 0;
  }

  /* 見出しピル・白カード */
  .before-birth__section-title {
    left: 16rem;
    width: 88rem;
    height: 5.6rem;
    padding-top: 1.4rem;
    border-radius: 8rem;
    font-size: 2.8rem;
    line-height: 1;
  }

  .before-birth__section-card {
    left: 9.6rem;
    width: 100.8rem;
    border-width: 0.2rem;
    border-radius: 1rem;
  }

  .before-birth__section-title--point { top: 36rem; }
  .before-birth__section-card--point { top: 38.8rem; height: 80.3rem; }

  .before-birth__section-title--target { top: 22rem; }
  .before-birth__section-card--target { top: 24.8rem; height: 46rem; }

  .before-birth__section-title--flow { top: 17.2rem; }
  .before-birth__section-card--flow { top: 20.3rem; height: 59.7rem; }

  /* 1. ポイント */
  .before-birth__point {
    left: 16rem;
    width: 88rem;
    border-width: 0.2rem;
  }

  .before-birth__point--1 { top: 43.6rem; height: 18.6rem; }
  .before-birth__point--2 { top: 63rem; height: 18.6rem; }
  .before-birth__point--3 { top: 82.4rem; height: 25.1rem; }

  .before-birth__point-badge {
    left: 3.2rem;
    top: 2.4rem;
    width: 12.3rem;
    height: 8.9rem;
  }

  .before-birth__point-num {
    left: 9.3rem;
    top: 5.3rem;
  }

  .before-birth__point-num-label { font-size: 1.6rem; }
  .before-birth__point-num-value { font-size: 3.2rem; }

  .before-birth__point-underline {
    left: 17.8rem;
    height: 0.953659rem;
  }

  .before-birth__point-title {
    left: 18.6rem;
    top: 2.4rem;
    font-size: 2.4rem;
  }

  .before-birth__point-text {
    left: 18rem;
    width: 66.8rem;
    font-size: 1.8rem;
    background-image:
      linear-gradient(var(--color-birth-light), var(--color-birth-light)),
      linear-gradient(var(--color-birth-light), var(--color-birth-light));
  }

  .before-birth__point-text-small { font-size: 1.8rem; }

  .before-birth__point-note {
    font-size: 1.4rem;
    white-space: nowrap;
  }

  .before-birth__point--1 .before-birth__point-underline { top: 6.3rem; width: 25.2rem; }
  .before-birth__point--1 .before-birth__point-text {
    top: 7.7rem;
    background-size: 10.9rem 0.8rem, 25.4rem 0.8rem;
    background-position: 10.6rem 1.8rem, -0.2rem 4.5rem;
  }
  .before-birth__point--1 .before-birth__point-note { left: 18rem; top: 14.1rem; }

  .before-birth__point--2 .before-birth__point-underline { top: 6.3rem; width: 37.65rem; }
  .before-birth__point--2 .before-birth__point-text {
    top: 7.7rem;
    background-size: 16.6rem 0.8rem, 11.9rem 0.8rem;
    background-position: 48.9rem 1.8rem, -0.2rem 4.5rem;
  }
  .before-birth__point--2 .before-birth__point-note { left: 7.8rem; top: 14.1rem; }

  .before-birth__point--3 .before-birth__point-underline { top: 10.1rem; width: 67.8rem; }
  .before-birth__point--3 .before-birth__point-title { width: 66.2rem; }
  .before-birth__point--3 .before-birth__point-text {
    top: 11.5rem;
    background-size: 27.3rem 0.8rem, 0 0;
    background-position: 28.4rem 1.8rem, 0 0;
  }
  .before-birth__point--3 .before-birth__point-note { left: 18rem; top: 20.6rem; }

  .before-birth__lead--point {
    left: 9.6rem;
    top: 109.9rem;
    width: 100.8rem;
    font-size: 2rem;
    line-height: 1.5;
    text-align: center;
  }

  /* 2. 保障表 */
  .before-birth__table-scroll {
    left: 9.6rem;
    top: 12rem;
    width: 100.8rem;
  }

  .before-birth__table { width: 100.8rem; }
  /* 詳細度が同じため、修飾子(--label)を基底クラスより後に書く必要がある */
  .before-birth__table-col { width: 57.9rem; }
  .before-birth__table-col--label { width: 42.9rem; }

  .before-birth__table thead th {
    height: 7.2rem;
    font-size: 1.8rem;
  }

  .before-birth__table tbody th {
    padding: 0 3rem;
    font-size: 1.6rem;
  }

  .before-birth__table tbody td { font-size: 1.6rem; }
  .before-birth__table-sub { font-size: 1.4rem; }

  /* Figma の罫線 y 座標から算出した各行の高さ（合計 948px） */
  .before-birth__table tbody tr:nth-child(1) { height: 7.1rem; }
  .before-birth__table tbody tr:nth-child(2) { height: 6.4rem; }
  .before-birth__table tbody tr:nth-child(3) { height: 6.4rem; }
  .before-birth__table tbody tr:nth-child(4) { height: 6.4rem; }
  .before-birth__table tbody tr:nth-child(5) { height: 8.5rem; }
  .before-birth__table tbody tr:nth-child(6) { height: 10.6rem; }
  .before-birth__table tbody tr:nth-child(7) { height: 8.5rem; }
  .before-birth__table tbody tr:nth-child(8) { height: 10.6rem; }
  .before-birth__table tbody tr:nth-child(9) { height: 6.4rem; }
  .before-birth__table tbody tr:nth-child(10) { height: 8.8rem; }
  .before-birth__table tbody tr:nth-child(11) { height: 6.4rem; }
  .before-birth__table tbody tr:nth-child(12) { height: 8.7rem; }

  .before-birth__table-plus {
    top: -1.2rem;
    font-size: 2rem;
  }

  .before-birth__table-notes {
    left: 9.6rem;
    top: 115.5rem;
    width: 100.8rem;
    font-size: 1.4rem;
    line-height: 1.5;
  }

  /* 3. 対象コース */
  .before-birth__target-illust {
    left: 16rem;
    top: 16.8rem;
    width: 16.6964rem;
    height: 16rem;
  }

  .before-birth__target-course {
    left: 40.8rem;
    top: 29.6rem;
    width: 63.2rem;
    font-size: 2.4rem;
    line-height: 1;
    text-align: center;
  }

  .before-birth__target-course-small { font-size: 2.4rem; }

  .before-birth__target-underline {
    left: 40.8rem;
    top: 33.1rem;
    width: 63.2rem;
    height: 0.953659rem;
  }

  .before-birth__target-logo {
    left: 16rem;
    top: 32rem;
    width: 23.6rem;
    height: 12rem;
  }

  .before-birth__target-plan {
    top: 35.2rem;
    width: 20rem;
    height: 7.2rem;
    padding-top: 2.4rem;
    border-radius: 0.5rem;
    font-size: 2.4rem;
    line-height: 1;
  }

  .before-birth__target-plan--2000 { left: 41.6rem; }
  .before-birth__target-plan--3000 { left: 62.4rem; }
  .before-birth__target-plan--4000 { left: 83.2rem; }

  .before-birth__target-note {
    left: 39rem;
    top: 43.2rem;
    font-size: 1.4rem;
    line-height: 1.5;
    white-space: nowrap;
  }

  .before-birth__divider--target {
    left: 16rem;
    top: 47.7rem;
    width: 88rem;
    height: 0.2rem;
  }

  .before-birth__lead--target {
    left: 9.6rem;
    top: 49.9rem;
    width: 83.8rem;
    font-size: 1.8rem;
    line-height: 1.5;
    text-align: center;
    white-space: nowrap;
  }

  .before-birth__target-link {
    left: 92.8rem;
    top: 49.9rem;
    font-size: 1.8rem;
  }

  .before-birth__button--quote {
    left: 38.4rem;
    top: 54.2rem;
    width: 43.2rem;
    height: 5.6rem;
    border-width: 0.2rem;
    border-radius: 1rem;
    font-size: 1.8rem;
  }

  .before-birth__button-arrow {
    left: 39.2rem;
    top: 1.6rem;
    width: 2.4rem;
    height: 2.4rem;
  }

  .before-birth__lead--target-note {
    left: 9.6rem;
    top: 62.2rem;
    width: 100.8rem;
    font-size: 1.8rem;
    line-height: 1.5;
    text-align: center;
    background-image: linear-gradient(var(--color-women-light), var(--color-women-light));
    background-size: 16.5rem 0.6rem;
    background-position: 57.5rem 2rem;
  }

  /* 4. お手続きの流れ */
  .before-birth__timeline {
    left: 16rem;
    top: 24.6rem;
    width: 88rem;
    height: 29.1rem;
  }

  .before-birth__timeline-bracket {
    width: 1.72959rem;
    height: 3.42329rem;
  }

  .before-birth__timeline-bracket--before-left { left: 7.2rem; top: 1.0106rem; }
  .before-birth__timeline-bracket--before-right { left: 17.3081rem; top: 0.9106rem; }
  .before-birth__timeline-bracket--after-left { left: 49.4rem; top: 1.0106rem; }
  .before-birth__timeline-bracket--after-right { left: 59.5081rem; top: 0.9106rem; }

  .before-birth__timeline-caption {
    top: 0;
    font-size: 1.6rem;
  }

  .before-birth__timeline-caption--before { left: 13.119rem; }
  .before-birth__timeline-caption--after { left: 55.319rem; }

  .before-birth__timeline-caption-em { font-size: 2rem; }

  .before-birth__timeline-bubble {
    left: 68.1rem;
    top: 0.8rem;
    width: 16.8rem;
    height: 4.8rem;
  }

  .before-birth__timeline-bubble-text {
    left: 76.8rem;
    top: 2rem;
    width: 14.4rem;
    font-size: 1.6rem;
  }

  .before-birth__timeline-illust--step1 { left: 8.7rem; top: 4.9rem; width: 8.7rem; height: 8.8rem; }
  .before-birth__timeline-illust--step2 { left: 30.6rem; top: 4.6rem; width: 7.4rem; height: 9.1rem; }
  .before-birth__timeline-illust--step3 { left: 50.7rem; top: 4.9rem; width: 9.3rem; height: 8.8rem; }
  .before-birth__timeline-illust--money { left: 71.8rem; top: 6.7rem; width: 9.3rem; height: 7.1rem; }

  .before-birth__timeline-step {
    width: 16.7rem;
    height: 3.5rem;
    font-size: 1.8rem;
  }

  .before-birth__timeline-step-num { font-size: 2.4rem; }

  .before-birth__timeline-step--1 { left: 13.05rem; top: 14.9rem; padding-top: 0.3rem; }
  .before-birth__timeline-step--born { left: 34.25rem; top: 14.9rem; padding-top: 0.8rem; }
  .before-birth__timeline-step--2 { left: 55.35rem; top: 14.9rem; padding-top: 0.3rem; }
  .before-birth__timeline-step--pay { left: 76.45rem; top: 14.9rem; padding-top: 0.8rem; }

  .before-birth__timeline-arrow {
    left: 0;
    top: 19.2rem;
    width: 88rem;
    height: 8.5rem;
  }

  .before-birth__timeline-term {
    top: 19.5rem;
    height: 2.8rem;
    padding-top: 0.14rem;
    border-width: 0.1rem;
    font-size: 1.6rem;
  }

  .before-birth__timeline-term-num { font-size: 2.1rem; }

  .before-birth__timeline-term--week { left: 13.05rem; width: 14.3rem; }
  .before-birth__timeline-term--month { left: 55.4rem; width: 15.6rem; }

  .before-birth__timeline-up {
    left: 32.9876rem;
    top: 21.9rem;
    width: 2.42487rem;
    height: 1.575rem;
  }

  .before-birth__timeline-note {
    left: 55.35rem;
    top: 23.3rem;
    width: 26.5rem;
    height: 5rem;
    padding-top: 0.7rem;
    font-size: 1.6rem;
  }

  .before-birth__divider--flow {
    left: 16rem;
    top: 55.3rem;
    width: 88rem;
    height: 0.2rem;
  }

  .before-birth__lead--flow {
    left: 9.6rem;
    top: 57.5rem;
    width: 100.8rem;
    font-size: 1.8rem;
    line-height: 1.5;
    text-align: center;
  }

  .before-birth__terms {
    left: 27.6rem;
    top: 61rem;
    width: 64.8rem;
    height: 15.8rem;
    border-radius: 0.5rem;
  }

  .before-birth__terms-list {
    left: 3.2rem;
    top: 2.4rem;
    font-size: 1.8rem;
    white-space: nowrap;
  }

  .before-birth__terms-note {
    left: 3.2rem;
    top: 11.3rem;
    font-size: 1.4rem;
    white-space: nowrap;
  }

  .before-birth__cta {
    left: 9.6rem;
    top: 84rem;
    width: 100.8rem;
    height: 12.8rem;
    border-radius: 1rem;
  }

  .before-birth__cta-button {
    left: 28.8rem;
    top: 3.6rem;
    width: 43.2rem;
    height: 5.6rem;
    border-radius: 1rem;
    font-size: 1.8rem;
  }

  .before-birth__cta-arrow {
    left: 39.2rem;
    top: 1.6rem;
    width: 2.4rem;
    height: 2.4rem;
  }
}

/* ============ 上乗せ保障 ============ */
.extra-coverage {
  position: relative;
  z-index: 0;
}

/* Figma の「安心上乗せ_bg」。ジュニア／お誕生前と同じく全幅の下地を敷く */
.extra-coverage::before {
  content: '';
  position: absolute;
  z-index: -1;
  left: 0;
  width: 100%;
  background-color: var(--color-addon-bg);
}

.extra-coverage__panel {
  position: relative;
  z-index: 0;
  margin-left: auto;
  margin-right: auto;
  background-color: var(--color-white);
}

.extra-coverage__title-bg,
.extra-coverage__sub,
.extra-coverage__title,
.extra-coverage__lead,
.extra-coverage__lead-marker,
.extra-coverage__box,
.extra-coverage__box-title,
.extra-coverage__fee,
.extra-coverage__fee-note,
.extra-coverage__average,
.extra-coverage__source,
.extra-coverage__notes {
  position: absolute;
}

/* ---- タイトル帯 ---- */
.extra-coverage__title-bg {
  left: 0;
  top: 0;
  width: 100%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.extra-coverage__sub {
  background-color: var(--color-addon-light);
  border-radius: 6rem;
  font-weight: 500;
  color: var(--color-text);
  text-align: center;
  white-space: nowrap;
}

.extra-coverage__title {
  font-weight: 700;
  color: var(--color-white);
  text-align: center;
}

/* ---- リード文（《たすけあい》の月掛金＋月々100円…） ---- */
.extra-coverage__lead {
  font-weight: 700;
  line-height: 1.5;
}

.extra-coverage__lead-accent {
  color: var(--color-primary);
}

.extra-coverage__lead-line {
  white-space: nowrap;
}

.extra-coverage__lead-marker {
  background-color: var(--color-addon-light);
}

/* ---- 先進医療特約の枠 ---- */
.extra-coverage__box {
  background-color: var(--color-white);
  border-style: solid;
  border-color: var(--color-addon);
}

.extra-coverage__box-title {
  background-color: var(--color-addon);
  border-radius: 8rem;
  font-weight: 700;
  color: var(--color-white);
  text-align: center;
  white-space: nowrap;
}

/* ---- 月掛金 / 支払い限度額 ---- */
.extra-coverage__fee {
  background-color: var(--color-white);
  border-style: solid;
  border-color: var(--color-addon-light);
}

.extra-coverage__fee-label,
.extra-coverage__fee-value {
  position: absolute;
  white-space: nowrap;
}

.extra-coverage__fee-label {
  font-weight: 500;
  line-height: 1.5;
}

.extra-coverage__fee-value {
  font-weight: 500;
  line-height: 1;
}

.extra-coverage__fee-num {
  font-family: var(--font-family-en);
  font-weight: 700;
  color: var(--color-primary);
}

.extra-coverage__fee-man {
  font-weight: 700;
  color: var(--color-primary);
}

.extra-coverage__fee-note {
  font-weight: 400;
  color: var(--color-text-sub);
  text-align: right;
  white-space: nowrap;
}

/* ---- 主な先進医療の平均技術料 ---- */
.extra-coverage__average {
  background-color: var(--color-addon-light);
}

.extra-coverage__average-title,
.extra-coverage__average-example,
.extra-coverage__average-price {
  position: absolute;
  white-space: nowrap;
}

/* このセクションでのみ使う濃いターコイズ（Figma の見出し色） */
.extra-coverage__average-title {
  font-weight: 700;
  color: #13c3b4;
  line-height: 1.5;
}

.extra-coverage__average-example {
  font-weight: 500;
  line-height: 1.5;
}

.extra-coverage__average-price {
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1.5;
}

.extra-coverage__average-num {
  font-family: var(--font-family-en);
  font-weight: 700;
}

/* ---- 出典・注記 ---- */
.extra-coverage__source {
  font-weight: 500;
}

.extra-coverage__notes {
  font-weight: 400;
  color: var(--color-text-sub);
  line-height: 1.5;
}

@media (max-width: 767px) {
  .extra-coverage {
    margin-top: 5.6rem;
  }

  .extra-coverage::before {
    top: 4.8rem;
    height: 80.4rem;
  }

  .extra-coverage__panel {
    width: calc(100% - 4rem);
    max-width: 35rem;
    height: 74.8rem;
    border-radius: 0.8rem;
  }

  .extra-coverage__title-bg {
    height: 9.8rem;
    background-image: url('../images/extra-title-bg-sp.svg');
  }

  .extra-coverage__sub {
    left: 2.4rem;
    top: 1.6rem;
    width: 30.2rem;
    height: 2.2rem;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }

  .extra-coverage__title {
    left: 3.1rem;
    top: 4.6rem;
    width: 28.8rem;
    font-size: 2.4rem;
    line-height: 1.2;
  }

  .extra-coverage__lead {
    left: 2.4rem;
    top: 10.5rem;
    width: 30.2rem;
    font-size: 2rem;
    text-align: center;
  }

  .extra-coverage__lead-num {
    font-size: 2.4rem;
  }

  .extra-coverage__lead-marker {
    left: 16.5rem;
    top: 13.2rem;
    width: 15.4rem;
    height: 0.8rem;
  }

  .extra-coverage__box {
    left: 2.4rem;
    top: 20.9rem;
    width: 30.2rem;
    height: 50.7rem;
    border-width: 0.1rem;
    border-radius: 0.5rem;
  }

  .extra-coverage__box-title {
    left: 3.6rem;
    top: 19.1rem;
    width: 27.8rem;
    height: 3.6rem;
    font-size: 1.6rem;
    line-height: 3.6rem;
  }

  .extra-coverage__fee {
    top: 23.9rem;
    height: 6.4rem;
    border-width: 0.1rem;
    border-radius: 0.3rem;
  }

  .extra-coverage__fee--premium {
    left: 3.6rem;
    width: 9rem;
  }

  .extra-coverage__fee--limit {
    left: 13rem;
    width: 18.4rem;
  }

  .extra-coverage__fee-label {
    font-size: 1.4rem;
  }

  /* 枠線内の絶対配置は padding edge 基準になるため、Figma のグループ座標から border 1px 分を差し引く */
  .extra-coverage__fee--premium .extra-coverage__fee-label { left: 2.3rem; top: 0.5rem; }
  .extra-coverage__fee--limit .extra-coverage__fee-label { left: 5.6rem; top: 0.4rem; }

  .extra-coverage__fee-value {
    font-size: 1.6rem;
  }

  .extra-coverage__fee--premium .extra-coverage__fee-value { left: 0.9rem; top: 2.8rem; }
  .extra-coverage__fee--limit .extra-coverage__fee-value { left: 1.3rem; top: 2.7rem; }

  .extra-coverage__fee-num {
    font-size: 2.8rem;
  }

  .extra-coverage__fee-man {
    font-size: 1.6rem;
  }

  /* SP のみ「1回あたり／最高」が2行の小さいラベルとして数字の左に入る */
  .extra-coverage__fee-prefix {
    display: inline-block;
    width: 4.4rem;
    margin-right: 0.2rem;
    font-size: 1rem;
    line-height: 1;
    text-align: right;
    white-space: normal;
  }

  .extra-coverage__fee-note {
    left: 3.6rem;
    top: 30.9rem;
    width: 27.8rem;
    font-size: 1.2rem;
    line-height: 1.4;
    text-align: left;
  }

  .extra-coverage__average {
    left: 3.6rem;
    top: 33.8rem;
    width: 27.8rem;
    height: 10.8rem;
    border-radius: 0.3rem;
  }

  .extra-coverage__average-title { left: 4.3rem; top: 1.2rem; font-size: 1.6rem; }
  .extra-coverage__average-example { left: 7.3rem; top: 3.8rem; font-size: 1.4rem; }
  .extra-coverage__average-price { left: 5.3rem; top: 5.7rem; font-size: 1.6rem; }
  .extra-coverage__average-avg { font-size: 1.4rem; }
  .extra-coverage__average-num { font-size: 2.8rem; }

  .extra-coverage__source {
    left: 3.6rem;
    top: 45.8rem;
    width: 27.8rem;
    font-size: 1.4rem;
    line-height: 1.4;
  }

  .extra-coverage__notes {
    left: 3.6rem;
    top: 50.2rem;
    width: 27.8rem;
    font-size: 1.2rem;
  }
}

@media (min-width: 768px) {
  .extra-coverage {
    margin-top: 11.2rem;
  }

  .extra-coverage::before {
    top: 7.2rem;
    height: 96.6rem;
  }

  .extra-coverage__panel {
    width: 120rem;
    height: 86.5rem;
    border-radius: 2rem;
  }

  .extra-coverage__title-bg {
    height: 18rem;
    background-image: url('../images/extra-title-bg-pc.svg');
  }

  .extra-coverage__sub {
    left: 25.3rem;
    top: 2.4rem;
    width: 68.8rem;
    height: 4rem;
    font-size: 2.4rem;
    line-height: 4rem;
  }

  .extra-coverage__title {
    left: 20rem;
    top: 8rem;
    width: 80rem;
    font-size: 4rem;
    line-height: 1;
    white-space: nowrap;
  }

  .extra-coverage__lead {
    left: 9.6rem;
    top: 17.1rem;
    width: 100.8rem;
    font-size: 3.2rem;
    text-align: center;
    white-space: nowrap;
  }

  .extra-coverage__lead-num {
    font-size: 4.7rem;
  }

  .extra-coverage__lead-marker {
    left: 47.2rem;
    top: 22.4rem;
    width: 19.5rem;
    height: 1.2rem;
  }

  .extra-coverage__box {
    left: 9.6rem;
    top: 29.8rem;
    width: 100.8rem;
    height: 52.7rem;
    border-width: 0.2rem;
    border-radius: 1rem;
  }

  .extra-coverage__box-title {
    left: 16rem;
    top: 26.6rem;
    width: 88rem;
    height: 5.6rem;
    font-size: 2.8rem;
    line-height: 5.6rem;
  }

  .extra-coverage__fee {
    top: 35.1rem;
    height: 11.2rem;
    border-width: 0.2rem;
    border-radius: 0.5rem;
  }

  .extra-coverage__fee--premium {
    left: 16rem;
    width: 38rem;
  }

  .extra-coverage__fee--limit {
    left: 55.6rem;
    width: 48.4rem;
  }

  .extra-coverage__fee-label {
    font-size: 2rem;
  }

  /* PC は border 2px 分を同様に補正する */
  .extra-coverage__fee--premium .extra-coverage__fee-label { left: 15.8rem; top: 1.4rem; }
  .extra-coverage__fee--limit .extra-coverage__fee-label { left: 19rem; top: 1.4rem; }

  .extra-coverage__fee-value {
    font-size: 2rem;
  }

  .extra-coverage__fee--premium .extra-coverage__fee-value { left: 13.3rem; top: 4.8rem; }

  /* 支払い限度額のみ Figma 上でテキスト全体が Bold 指定になっている */
  .extra-coverage__fee--limit .extra-coverage__fee-value {
    left: 7.5rem;
    top: 4.8rem;
    font-weight: 700;
  }

  .extra-coverage__fee-num {
    font-size: 4.8rem;
  }

  .extra-coverage__fee-man {
    font-size: 4.8rem;
  }

  .extra-coverage__fee-prefix {
    font-size: 2rem;
  }

  .extra-coverage__fee-note {
    right: 16rem;
    top: 47.1rem;
    font-size: 1.4rem;
    line-height: 1.5;
  }

  .extra-coverage__average {
    left: 16rem;
    top: 51.2rem;
    width: 88rem;
    height: 10rem;
    border-radius: 0.5rem;
  }

  .extra-coverage__average-title { left: 4.4rem; top: 3.2rem; font-size: 2.4rem; }
  .extra-coverage__average-example { left: 36.4rem; top: 4.1rem; font-size: 2rem; }
  .extra-coverage__average-price { left: 56rem; top: 2rem; font-size: 2rem; }
  .extra-coverage__average-num { font-size: 4rem; }

  .extra-coverage__source {
    left: 16rem;
    top: 63.2rem;
    width: 88rem;
    font-size: 1.8rem;
    line-height: 1.5;
  }

  .extra-coverage__notes {
    left: 16rem;
    top: 66.7rem;
    width: 88rem;
    font-size: 1.4rem;
  }
}

/* ============ 加入方法 ============ */
.how-to-join__panel {
  position: relative;
  z-index: 0;
  margin-left: auto;
  margin-right: auto;
  background-color: var(--color-white);
}

.how-to-join__panel + .how-to-join__panel {
  margin-top: 0.4rem;
}

.how-to-join__title-bg,
.how-to-join__sub,
.how-to-join__title,
.how-to-join__lead,
.how-to-join__button,
.how-to-join__note,
.how-to-join__heading,
.how-to-join__heading-marker,
.how-to-join__group {
  position: absolute;
}

/* ---- タイトル帯 ---- */
.how-to-join__title-bg {
  left: 0;
  top: 0;
  width: 100%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.how-to-join__sub {
  background-color: var(--color-join-web-pale);
  border-radius: 6rem;
  font-weight: 500;
  color: var(--color-text);
  text-align: center;
  white-space: nowrap;
}

.how-to-join__title {
  font-weight: 700;
  color: var(--color-white);
  text-align: center;
}

.how-to-join__lead {
  font-weight: 700;
  line-height: 1.5;
}

/* ---- 同時加入ボタン ---- */
.how-to-join__button {
  display: block;
  background-color: var(--color-white);
  border-style: solid;
  border-color: var(--color-primary);
}

.how-to-join__button-text,
.how-to-join__button-arrow {
  position: absolute;
}

.how-to-join__button-text {
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1.4;
  text-align: center;
  white-space: nowrap;
}

.how-to-join__note {
  font-weight: 500;
}

/* ---- 「加入までの流れ」見出し ---- */
.how-to-join__heading {
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  white-space: nowrap;
}

.how-to-join__heading-marker {
  background-color: var(--color-join-web-pale);
}

/* ---- 組合員の方 / まだ組合員でない方 ---- */
.how-to-join__group-box,
.how-to-join__group-title,
.how-to-join__group-lead,
.how-to-join__group-note,
.how-to-join__divider,
.how-to-join__flow {
  position: absolute;
}

.how-to-join__group-box {
  background-color: var(--color-white);
  border-style: solid;
}

.how-to-join__group--member .how-to-join__group-box { border-color: var(--color-join-web); }
.how-to-join__group--new .how-to-join__group-box { border-color: var(--color-join-member); }

.how-to-join__group-title {
  border-radius: 8rem;
  font-weight: 700;
  color: var(--color-white);
  text-align: center;
  white-space: nowrap;
}

.how-to-join__group--member .how-to-join__group-title { background-color: var(--color-join-web); }
.how-to-join__group--new .how-to-join__group-title { background-color: var(--color-join-member); }

.how-to-join__group-lead {
  font-weight: 500;
}

.how-to-join__group-note {
  font-weight: 400;
  color: var(--color-text-sub);
  line-height: 1.5;
}

.how-to-join__divider {
  background-color: var(--color-join-web-pale);
  border-radius: 1rem;
}

/* ---- 加入フロー（Web / Web以外 / 未加入者） ---- */
/* 子要素をすべてフロー枠に対して絶対配置するため、ラッパー自体は高さを持たない */
.how-to-join__flow-title,
.how-to-join__steps {
  height: 0;
}

.how-to-join__flow-bracket,
.how-to-join__flow-title-text,
.how-to-join__flow-line,
.how-to-join__step {
  position: absolute;
}

/* 親 .how-to-join__flow は子が全て絶対配置で幅 0 になるため、
   reset.css の img { max-width: 100% } が効くと幅が 0 に潰れる */
.how-to-join__flow-bracket {
  max-width: none;
}

.how-to-join__flow-bracket--right {
  transform: scaleX(-1);
}

.how-to-join__flow-title-text {
  font-weight: 700;
  text-align: center;
  white-space: nowrap;
}

.how-to-join__flow--online .how-to-join__flow-title-text { color: var(--color-join-web); }
.how-to-join__flow--offline .how-to-join__flow-title-text { color: var(--color-join-offline); }

/* フロー線は step カードより手前、dot より奥に置いて「dot を貫く連続した線」にする。
   .how-to-join__step は position:absolute かつ z-index:auto でスタッキングコンテキストを
   作らないため、子の dot にも同じ文脈で z-index が効く */
.how-to-join__flow-line {
  z-index: 1;
}

.how-to-join__flow--online .how-to-join__flow-line { background-color: var(--color-join-web-light); }
.how-to-join__flow--offline .how-to-join__flow-line { background-color: var(--color-join-offline-light); }
.how-to-join__flow--new .how-to-join__flow-line { background-color: var(--color-join-member-light); }

.how-to-join__step-box,
.how-to-join__step-mask,
.how-to-join__step-dot,
.how-to-join__step-num,
.how-to-join__step-heading,
.how-to-join__step-text {
  position: absolute;
}

.how-to-join__step-box {
  background-color: var(--color-white);
  border-style: solid;
  border-radius: 0.5rem;
}

.how-to-join__flow--online .how-to-join__step-box { border-color: var(--color-join-web); }
.how-to-join__flow--offline .how-to-join__step-box { border-color: var(--color-join-offline); }
.how-to-join__flow--new .how-to-join__step-box { border-color: var(--color-join-member); }

/* 連番がカード枠線に重なるため、白ベタで枠線を隠す */
.how-to-join__step-mask {
  background-color: var(--color-white);
}

.how-to-join__step-dot {
  z-index: 2;
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
}

.how-to-join__flow--online .how-to-join__step-dot { background-color: var(--color-join-web); }
.how-to-join__flow--offline .how-to-join__step-dot { background-color: var(--color-join-offline); }
.how-to-join__flow--new .how-to-join__step-dot { background-color: var(--color-join-member); }

.how-to-join__step-num {
  font-family: var(--font-family-en);
  font-weight: 700;
  line-height: 1;
}

.how-to-join__flow--online .how-to-join__step-num { color: var(--color-join-web-light); }
.how-to-join__flow--offline .how-to-join__step-num { color: var(--color-join-offline-light); }
.how-to-join__flow--new .how-to-join__step-num { color: var(--color-join-member-light); }

.how-to-join__step-heading {
  font-weight: 700;
  line-height: 1.5;
  white-space: nowrap;
}

.how-to-join__flow--online .how-to-join__step-heading { color: var(--color-join-web); }
.how-to-join__flow--offline .how-to-join__step-heading { color: var(--color-join-offline); }

.how-to-join__step-text {
  font-weight: 400;
  line-height: 1.5;
}

/* 未加入者フローは見出しを持たず、本文が太字のキーカラーになる */
.how-to-join__flow--new .how-to-join__step-text {
  font-weight: 700;
  color: var(--color-join-member);
}

@media (max-width: 767px) {
  .how-to-join {
    margin-top: 5.6rem;
  }

  .how-to-join__panel {
    width: calc(100% - 4rem);
    max-width: 35rem;
    border-radius: 0.8rem;
  }

  .how-to-join__panel--intro { height: 43.1rem; }
  .how-to-join__panel--flow { height: 164.9rem; }

  .how-to-join__title-bg {
    height: 12.7rem;
    background-image: url('../images/join-title-bg-sp.svg');
  }

  .how-to-join__sub {
    left: 2.4rem;
    top: 1.6rem;
    width: 30.2rem;
    height: 2.2rem;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }

  .how-to-join__title {
    left: 2.4rem;
    top: 4.6rem;
    width: 30.2rem;
    font-size: 2.4rem;
    line-height: 1.2;
  }

  .how-to-join__lead {
    left: 2.4rem;
    top: 13.5rem;
    width: 30.5rem;
    font-size: 2rem;
  }

  .how-to-join__button {
    left: 2.4rem;
    top: 27.1rem;
    width: 30.2rem;
    height: 5.6rem;
    border-width: 0.1rem;
    border-radius: 0.5rem;
  }

  .how-to-join__button-text {
    left: 3.5rem;
    top: 0.8rem;
    width: 22.1rem;
    font-size: 1.4rem;
  }

  .how-to-join__button-arrow {
    left: 27.4rem;
    top: 1.8rem;
    width: 2rem;
    height: 2rem;
  }

  .how-to-join__note {
    left: 2.4rem;
    top: 33.9rem;
    width: 30.2rem;
    font-size: 1.4rem;
    line-height: 1.4;
  }

  /* ---- 加入までの流れ ---- */
  .how-to-join__heading {
    left: 9.1rem;
    top: 3.2rem;
    width: 16.8rem;
    font-size: 2.4rem;
  }

  .how-to-join__heading-marker {
    left: 8.3rem;
    top: 5.9rem;
    width: 18.4rem;
    height: 0.8rem;
  }

  .how-to-join__group {
    left: 2.4rem;
    width: 30.2rem;
  }

  .how-to-join__group--member { top: 8.8rem; }
  .how-to-join__group--new { top: 104.9rem; }

  .how-to-join__group-box {
    left: 0;
    top: 1.8rem;
    width: 30.2rem;
    border-width: 0.1rem;
    border-radius: 0.5rem;
  }

  .how-to-join__group--member .how-to-join__group-box { height: 92.3rem; }
  .how-to-join__group--new .how-to-join__group-box { height: 55rem; }

  .how-to-join__group-title {
    left: 1.2rem;
    top: 0;
    width: 27.8rem;
    height: 3.6rem;
    font-size: 1.6rem;
    line-height: 3.6rem;
  }

  .how-to-join__group-lead {
    left: 1.2rem;
    top: 4.8rem;
    width: 27.8rem;
    font-size: 1.4rem;
    line-height: 1.4;
  }

  .how-to-join__group-note {
    left: 1.2rem;
    top: 47.2rem;
    width: 27.8rem;
    font-size: 1.2rem;
  }

  .how-to-join__divider {
    left: 1.2rem;
    top: 45.2rem;
    width: 27.8rem;
    height: 0.2rem;
  }

  .how-to-join__flow--online { left: 1.2rem; top: 5.2rem; }
  .how-to-join__flow--offline { left: 1.2rem; top: 47.4rem; }
  .how-to-join__flow--new { left: 1.2rem; top: 14.4rem; }

  .how-to-join__flow-bracket {
    top: 0.1rem;
    width: 1.74118rem;
    height: 3.45786rem;
  }

  /* 右ブラケットの left は Figma の右側グループの「左端」x（Web 232.0 / Web以外 249.0）。
     get_metadata が返すグループ座標は親フレーム基準ではないため、
     見出しグループの右端（248.0 / 265.0）を取り違えるとブラケット1個分だけ右にずれる */
  .how-to-join__flow--online .how-to-join__flow-bracket--left { left: 6.5rem; }
  .how-to-join__flow--online .how-to-join__flow-bracket--right { left: 19.6rem; }
  .how-to-join__flow--offline .how-to-join__flow-bracket--left { left: 5rem; }
  .how-to-join__flow--offline .how-to-join__flow-bracket--right { left: 21.3rem; }

  .how-to-join__flow-title-text {
    top: 0;
    font-size: 1.6rem;
    line-height: 1.4;
  }

  .how-to-join__flow--online .how-to-join__flow-title-text { left: 8.3rem; width: 11.1rem; }
  .how-to-join__flow--offline .how-to-join__flow-title-text { left: 6.8rem; width: 14.3rem; }

  /* SP はステップが縦並びのため、フローの線も縦になる */
  .how-to-join__flow-line {
    left: 5.4rem;
    width: 0.1rem;
  }

  .how-to-join__flow--online .how-to-join__flow-line { top: 8.1rem; height: 26.2rem; }
  .how-to-join__flow--offline .how-to-join__flow-line { top: 9rem; height: 31.6rem; }
  .how-to-join__flow--new .how-to-join__flow-line { top: 3.8rem; height: 24.3rem; }

  .how-to-join__step {
    left: 0;
    width: 27.8rem;
  }

  .how-to-join__flow--online .how-to-join__step--1 { top: 4.3rem; height: 7.3rem; }
  .how-to-join__flow--online .how-to-join__step--2 { top: 12.4rem; height: 9.4rem; }
  .how-to-join__flow--online .how-to-join__step--3 { top: 22.6rem; height: 7.3rem; }
  .how-to-join__flow--online .how-to-join__step--4 { top: 30.7rem; height: 7.3rem; }

  .how-to-join__flow--offline .how-to-join__step--1 { top: 4.3rem; height: 9.4rem; }
  .how-to-join__flow--offline .how-to-join__step--2 { top: 14.5rem; height: 9.4rem; }
  .how-to-join__flow--offline .how-to-join__step--3 { top: 24.7rem; height: 11.5rem; }
  .how-to-join__flow--offline .how-to-join__step--4 { top: 37rem; height: 7.3rem; }

  .how-to-join__flow--new .how-to-join__step--1 { top: 0; height: 7.3rem; }
  .how-to-join__flow--new .how-to-join__step--2 { top: 8.1rem; height: 7.3rem; }
  .how-to-join__flow--new .how-to-join__step--3 { top: 16.2rem; height: 7.3rem; }
  .how-to-join__flow--new .how-to-join__step--4 { top: 24.3rem; height: 7.3rem; }

  .how-to-join__step-box {
    left: 2.1rem;
    top: 0;
    width: 25.7rem;
    height: 100%;
    border-width: 0.15rem;
  }

  .how-to-join__step-mask {
    left: 0.2rem;
    width: 4rem;
    height: 3.5rem;
  }

  .how-to-join__step-num {
    left: 0;
    font-size: 3.2rem;
  }

  .how-to-join__step-dot {
    left: 5rem;
  }

  .how-to-join__step-heading {
    top: 1.2rem;
    font-size: 1.6rem;
  }

  .how-to-join__step-text {
    top: 4rem;
    font-size: 1.4rem;
  }

  /* Web からの加入 */
  .how-to-join__flow--online .how-to-join__step--1 .how-to-join__step-mask { top: 1.9rem; }
  .how-to-join__flow--online .how-to-join__step--1 .how-to-join__step-num { top: 2rem; }
  .how-to-join__flow--online .how-to-join__step--1 .how-to-join__step-dot { top: 3.3rem; }
  .how-to-join__flow--online .how-to-join__step--1 .how-to-join__step-heading { left: 7rem; }
  .how-to-join__flow--online .how-to-join__step--1 .how-to-join__step-text { left: 7rem; width: 11.1rem; white-space: nowrap; }

  .how-to-join__flow--online .how-to-join__step--2 .how-to-join__step-mask { top: 3rem; }
  .how-to-join__flow--online .how-to-join__step--2 .how-to-join__step-num { top: 3.1rem; }
  .how-to-join__flow--online .how-to-join__step--2 .how-to-join__step-dot { top: 4.3rem; }
  .how-to-join__flow--online .how-to-join__step--2 .how-to-join__step-heading { left: 7rem; }
  .how-to-join__flow--online .how-to-join__step--2 .how-to-join__step-text { left: 7rem; width: 19.2rem; }

  .how-to-join__flow--online .how-to-join__step--3 .how-to-join__step-mask { top: 1.9rem; }
  .how-to-join__flow--online .how-to-join__step--3 .how-to-join__step-num { top: 2rem; }
  .how-to-join__flow--online .how-to-join__step--3 .how-to-join__step-dot { top: 3.3rem; }
  .how-to-join__flow--online .how-to-join__step--3 .how-to-join__step-heading { left: 7rem; }
  .how-to-join__flow--online .how-to-join__step--3 .how-to-join__step-text { left: 7rem; width: 16.8rem; white-space: nowrap; }

  .how-to-join__flow--online .how-to-join__step--4 .how-to-join__step-mask { top: 1.9rem; }
  .how-to-join__flow--online .how-to-join__step--4 .how-to-join__step-num { top: 2rem; }
  .how-to-join__flow--online .how-to-join__step--4 .how-to-join__step-dot { top: 3.3rem; }
  .how-to-join__flow--online .how-to-join__step--4 .how-to-join__step-heading { left: 7rem; }
  .how-to-join__flow--online .how-to-join__step--4 .how-to-join__step-text { left: 7rem; width: 18.2rem; white-space: nowrap; }

  /* Web 以外からの加入 */
  .how-to-join__flow--offline .how-to-join__step--1 .how-to-join__step-mask { top: 3rem; }
  .how-to-join__flow--offline .how-to-join__step--1 .how-to-join__step-num { top: 3.1rem; }
  .how-to-join__flow--offline .how-to-join__step--1 .how-to-join__step-dot { top: 4.3rem; }
  .how-to-join__flow--offline .how-to-join__step--1 .how-to-join__step-heading { left: 7.5rem; }
  .how-to-join__flow--offline .how-to-join__step--1 .how-to-join__step-text { left: 7.5rem; width: 18.2rem; }

  .how-to-join__flow--offline .how-to-join__step--2 .how-to-join__step-mask { top: 3rem; }
  /* Figma 上でここだけ連番が 11px 下にずれている（他カードは中央揃え） */
  .how-to-join__flow--offline .how-to-join__step--2 .how-to-join__step-num { top: 3rem; }
  .how-to-join__flow--offline .how-to-join__step--2 .how-to-join__step-dot { top: 4.3rem; }
  .how-to-join__flow--offline .how-to-join__step--2 .how-to-join__step-heading { left: 7rem; }
  .how-to-join__flow--offline .how-to-join__step--2 .how-to-join__step-text { left: 7rem; width: 19.2rem; }

  .how-to-join__flow--offline .how-to-join__step--3 .how-to-join__step-mask { top: 4.1rem; }
  .how-to-join__flow--offline .how-to-join__step--3 .how-to-join__step-num { top: 4.2rem; }
  .how-to-join__flow--offline .how-to-join__step--3 .how-to-join__step-dot { top: 5.4rem; }
  .how-to-join__flow--offline .how-to-join__step--3 .how-to-join__step-heading { left: 7rem; }
  .how-to-join__flow--offline .how-to-join__step--3 .how-to-join__step-text { left: 7rem; width: 19.2rem; }

  .how-to-join__flow--offline .how-to-join__step--4 .how-to-join__step-mask { top: 1.9rem; }
  .how-to-join__flow--offline .how-to-join__step--4 .how-to-join__step-num { top: 2rem; }
  .how-to-join__flow--offline .how-to-join__step--4 .how-to-join__step-dot { top: 3.3rem; }
  .how-to-join__flow--offline .how-to-join__step--4 .how-to-join__step-heading { left: 7rem; }
  .how-to-join__flow--offline .how-to-join__step--4 .how-to-join__step-text { left: 7rem; width: 19.2rem; }

  /* まだ組合員でない方 */
  .how-to-join__flow--new .how-to-join__step-dot { top: 3.3rem; }
  .how-to-join__flow--new .how-to-join__step-text { left: 7rem; top: 1.3rem; width: 19.2rem; font-size: 1.6rem; }

  .how-to-join__flow--new .how-to-join__step--1 .how-to-join__step-mask { top: 1.9rem; }
  .how-to-join__flow--new .how-to-join__step--1 .how-to-join__step-num { top: 2rem; }
  .how-to-join__flow--new .how-to-join__step--2 .how-to-join__step-mask { top: 2rem; }
  .how-to-join__flow--new .how-to-join__step--2 .how-to-join__step-num { top: 2.1rem; }
  .how-to-join__flow--new .how-to-join__step--3 .how-to-join__step-mask { top: 1.9rem; }
  .how-to-join__flow--new .how-to-join__step--3 .how-to-join__step-num { top: 2rem; }
  .how-to-join__flow--new .how-to-join__step--4 .how-to-join__step-mask { top: 1.9rem; }
  .how-to-join__flow--new .how-to-join__step--4 .how-to-join__step-num { top: 2rem; }
}

@media (min-width: 768px) {
  .how-to-join {
    margin-top: 11.2rem;
  }

  .how-to-join__panel {
    width: 120rem;
    border-radius: 2rem;
  }

  .how-to-join__panel--intro { height: 47.4rem; }
  .how-to-join__panel--flow { height: 120.4rem; }

  .how-to-join__title-bg {
    height: 18rem;
    background-image: url('../images/join-title-bg-pc.svg');
  }

  .how-to-join__sub {
    left: 25.6rem;
    top: 2.4rem;
    width: 68.8rem;
    height: 4rem;
    font-size: 2.4rem;
    line-height: 4rem;
  }

  .how-to-join__title {
    left: 22.2rem;
    top: 8rem;
    width: 75.6rem;
    font-size: 4rem;
    line-height: 1;
    white-space: nowrap;
  }

  .how-to-join__lead {
    left: 9.6rem;
    top: 18rem;
    width: 100.8rem;
    font-size: 3.2rem;
    text-align: center;
  }

  .how-to-join__button {
    left: 32rem;
    top: 30rem;
    width: 56rem;
    height: 5.6rem;
    border-width: 0.2rem;
    border-radius: 1rem;
  }

  .how-to-join__button-text {
    left: 7.9rem;
    top: 1.6rem;
    width: 39.2rem;
    font-size: 1.8rem;
  }

  .how-to-join__button-arrow {
    left: 52rem;
    top: 1.6rem;
    width: 2.4rem;
    height: 2.4rem;
  }

  .how-to-join__note {
    left: 28.5rem;
    top: 38rem;
    width: 63.1rem;
    font-size: 1.8rem;
    line-height: 1.5;
    text-align: center;
    white-space: nowrap;
  }

  /* ---- 加入までの流れ ---- */
  .how-to-join__heading {
    left: 48.8rem;
    top: 4rem;
    width: 22.4rem;
    font-size: 3.2rem;
  }

  .how-to-join__heading-marker {
    left: 48.6rem;
    top: 7.6rem;
    width: 22.8rem;
    height: 1.2rem;
  }

  .how-to-join__group {
    left: 9.6rem;
    width: 100.8rem;
  }

  .how-to-join__group--member { top: 11.2rem; }
  .how-to-join__group--new { top: 78rem; }

  .how-to-join__group-box {
    left: 0;
    top: 2.4rem;
    width: 100.8rem;
    border-width: 0.2rem;
    border-radius: 1rem;
  }

  .how-to-join__group--member .how-to-join__group-box { height: 61.2rem; }
  .how-to-join__group--new .how-to-join__group-box { height: 36rem; }

  .how-to-join__group-title {
    left: 6.4rem;
    top: 0;
    width: 88rem;
    height: 5.6rem;
    font-size: 2.8rem;
    line-height: 5.6rem;
  }

  .how-to-join__group-lead {
    left: 6.4rem;
    top: 7.6rem;
    width: 88rem;
    font-size: 1.8rem;
    line-height: 1.5;
    text-align: center;
  }

  .how-to-join__group-note {
    left: 6.4rem;
    top: 31rem;
    width: 88rem;
    font-size: 1.4rem;
  }

  .how-to-join__divider {
    left: 6.4rem;
    top: 32.5rem;
    width: 88rem;
    height: 0.2rem;
  }

  .how-to-join__flow--online { left: 6.4rem; top: 8rem; }
  .how-to-join__flow--offline { left: 6.4rem; top: 35.1rem; }
  .how-to-join__flow--new { left: 6.4rem; top: 14.6rem; }

  .how-to-join__flow-bracket {
    top: 0;
    width: 1.72959rem;
    height: 3.42329rem;
  }

  /* 右ブラケットの left は Figma の見出しグループ左端基準（Web=179.187 / Web以外=219.187）。
     get_metadata が返す GROUP の x は親フレーム基準ではなく、見出しグループの右端
     （248.0 / 265.0 相当）を返すため、absoluteBoundingBox で取り直した値を使う。
     ずれていると括弧の中でテキストが中央に来ない */
  .how-to-join__flow-bracket--left { left: 0; }
  .how-to-join__flow--online .how-to-join__flow-bracket--right { left: 17.92rem; }
  .how-to-join__flow--offline .how-to-join__flow-bracket--right { left: 21.92rem; }

  .how-to-join__flow-title-text {
    left: 2.82rem;
    top: 0;
    font-size: 2rem;
    line-height: 1.5;
  }

  .how-to-join__flow--online .how-to-join__flow-title-text { width: 13.8rem; }
  .how-to-join__flow--offline .how-to-join__flow-title-text { width: 17.8rem; }

  .how-to-join__flow-line { height: 0.1rem; }

  .how-to-join__flow--online .how-to-join__flow-line { left: 10.6rem; top: 9.9rem; width: 66.9rem; }
  .how-to-join__flow--offline .how-to-join__flow-line { left: 10.6rem; top: 9.9rem; width: 69.3rem; }
  .how-to-join__flow--new .how-to-join__flow-line { left: 9.7rem; top: 5.8rem; width: 67.9rem; }

  /* 連番はカード上辺からはみ出すため、li の枠はカードより 24px 高い */
  .how-to-join__step-box {
    left: 0;
    top: 2.4rem;
    width: 100%;
    height: calc(100% - 2.4rem);
    border-width: 0.15rem;
  }

  .how-to-join__step-mask { top: 0.8rem; height: 3.4rem; }
  .how-to-join__step-num { top: 0; font-size: 4.8rem; }
  .how-to-join__step-dot { top: 5.4rem; }
  .how-to-join__step-heading { top: 7.4rem; font-size: 2rem; }
  .how-to-join__step-text { top: 10.8rem; font-size: 1.6rem; text-align: center; white-space: nowrap; }

  /* Web からの加入 */
  .how-to-join__flow--online .how-to-join__step { top: 4.1rem; width: 21.1rem; height: 18rem; }
  .how-to-join__flow--online .how-to-join__step--1 { left: 0; }
  .how-to-join__flow--online .how-to-join__step--2 { left: 22.3rem; }
  .how-to-join__flow--online .how-to-join__step--3 { left: 44.6rem; }
  .how-to-join__flow--online .how-to-join__step--4 { left: 66.9rem; }
  .how-to-join__flow--online .how-to-join__step-dot { left: 10.2rem; }

  .how-to-join__flow--online .how-to-join__step--1 .how-to-join__step-mask { left: 7.3rem; width: 6.5rem; }
  .how-to-join__flow--online .how-to-join__step--1 .how-to-join__step-num { left: 7.9rem; }
  .how-to-join__flow--online .how-to-join__step--1 .how-to-join__step-heading { left: 5.7rem; }
  .how-to-join__flow--online .how-to-join__step--1 .how-to-join__step-text { left: 4.2rem; width: 12.7rem; }

  .how-to-join__flow--online .how-to-join__step--2 .how-to-join__step-mask { left: 6.8rem; width: 7.5rem; }
  .how-to-join__flow--online .how-to-join__step--2 .how-to-join__step-num { left: 7.4rem; }
  .how-to-join__flow--online .how-to-join__step--2 .how-to-join__step-heading { left: 5.6rem; }
  .how-to-join__flow--online .how-to-join__step--2 .how-to-join__step-text { left: 2.6rem; width: 16rem; }

  .how-to-join__flow--online .how-to-join__step--3 .how-to-join__step-mask { left: 6.7rem; width: 7.7rem; }
  .how-to-join__flow--online .how-to-join__step--3 .how-to-join__step-num { left: 7.3rem; }
  .how-to-join__flow--online .how-to-join__step--3 .how-to-join__step-heading { left: 8.6rem; }
  .how-to-join__flow--online .how-to-join__step--3 .how-to-join__step-text { left: 4.2rem; width: 12.8rem; }

  .how-to-join__flow--online .how-to-join__step--4 .how-to-join__step-mask { left: 6.7rem; width: 7.8rem; }
  .how-to-join__flow--online .how-to-join__step--4 .how-to-join__step-num { left: 7.3rem; }
  .how-to-join__flow--online .how-to-join__step--4 .how-to-join__step-heading { left: 6.6rem; }
  /* 「受付完了のメールが／到着する」の2行組み。1行目9文字×1.6rem＝14.4rem をカード幅21.1rem の中央に置く */
  .how-to-join__flow--online .how-to-join__step--4 .how-to-join__step-text { left: 3.35rem; width: 14.4rem; }

  /* Web 以外からの加入 */
  .how-to-join__flow--offline .how-to-join__step { top: 4.1rem; height: 20.4rem; }
  .how-to-join__flow--offline .how-to-join__step--1 { left: 0; width: 20.8rem; }
  .how-to-join__flow--offline .how-to-join__step--2 { left: 22rem; width: 25.2rem; }
  .how-to-join__flow--offline .how-to-join__step--3 { left: 48.4rem; width: 22.4rem; }
  .how-to-join__flow--offline .how-to-join__step--4 { left: 72rem; width: 16rem; }

  .how-to-join__flow--offline .how-to-join__step--1 .how-to-join__step-mask { left: 7.2rem; width: 6.5rem; }
  .how-to-join__flow--offline .how-to-join__step--1 .how-to-join__step-num { left: 7.6rem; }
  .how-to-join__flow--offline .how-to-join__step--1 .how-to-join__step-dot { left: 10rem; }
  .how-to-join__flow--offline .how-to-join__step--1 .how-to-join__step-heading { left: 5.4rem; }
  .how-to-join__flow--offline .how-to-join__step--1 .how-to-join__step-text { left: 1.6rem; width: 17.6rem; }

  .how-to-join__flow--offline .how-to-join__step--2 .how-to-join__step-mask { left: 8.9rem; width: 7.5rem; }
  .how-to-join__flow--offline .how-to-join__step--2 .how-to-join__step-num { left: 9.4rem; }
  .how-to-join__flow--offline .how-to-join__step--2 .how-to-join__step-dot { left: 12.2rem; }
  .how-to-join__flow--offline .how-to-join__step--2 .how-to-join__step-heading { left: 2.6rem; }
  .how-to-join__flow--offline .how-to-join__step--2 .how-to-join__step-text { left: 1.6rem; width: 22rem; white-space: normal; }

  .how-to-join__flow--offline .how-to-join__step--3 .how-to-join__step-mask { left: 7.4rem; width: 7.7rem; }
  .how-to-join__flow--offline .how-to-join__step--3 .how-to-join__step-num { left: 8rem; }
  .how-to-join__flow--offline .how-to-join__step--3 .how-to-join__step-dot { left: 10.8rem; }
  .how-to-join__flow--offline .how-to-join__step--3 .how-to-join__step-heading { left: 9.2rem; }
  .how-to-join__flow--offline .how-to-join__step--3 .how-to-join__step-text { left: 1.6rem; width: 19.2rem; }

  .how-to-join__flow--offline .how-to-join__step--4 .how-to-join__step-mask { left: 4.1rem; width: 7.8rem; }
  .how-to-join__flow--offline .how-to-join__step--4 .how-to-join__step-num { left: 4.7rem; }
  .how-to-join__flow--offline .how-to-join__step--4 .how-to-join__step-dot { left: 7.6rem; }
  .how-to-join__flow--offline .how-to-join__step--4 .how-to-join__step-heading { left: 4rem; }
  /* 「受付証が郵送される」9文字×1.6rem＝14.4rem をカード幅16rem の中央に置く */
  .how-to-join__flow--offline .how-to-join__step--4 .how-to-join__step-text { left: 0.8rem; width: 14.4rem; }

  /* まだ組合員でない方 */
  .how-to-join__flow--new .how-to-join__step { top: 0; height: 15.2rem; }
  .how-to-join__flow--new .how-to-join__step--1 { left: 0; width: 18.8rem; }
  .how-to-join__flow--new .how-to-join__step--2 { left: 20rem; width: 22.6rem; }
  .how-to-join__flow--new .how-to-join__step--3 { left: 43.8rem; width: 22.6rem; }
  .how-to-join__flow--new .how-to-join__step--4 { left: 67.6rem; width: 20.4rem; }
  .how-to-join__flow--new .how-to-join__step-text { top: 7.4rem; font-size: 1.8rem; }

  .how-to-join__flow--new .how-to-join__step--1 .how-to-join__step-mask { left: 6.2rem; width: 6.5rem; }
  .how-to-join__flow--new .how-to-join__step--1 .how-to-join__step-num { left: 6.6rem; }
  .how-to-join__flow--new .how-to-join__step--1 .how-to-join__step-dot { left: 9rem; }
  .how-to-join__flow--new .how-to-join__step--1 .how-to-join__step-text { left: 1.6rem; width: 15.6rem; }

  .how-to-join__flow--new .how-to-join__step--2 .how-to-join__step-mask { left: 7.6rem; width: 7.5rem; }
  .how-to-join__flow--new .how-to-join__step--2 .how-to-join__step-num { left: 8.1rem; }
  .how-to-join__flow--new .how-to-join__step--2 .how-to-join__step-dot { left: 10.9rem; }
  .how-to-join__flow--new .how-to-join__step--2 .how-to-join__step-text { left: 1.4rem; width: 19.8rem; }

  .how-to-join__flow--new .how-to-join__step--3 .how-to-join__step-mask { left: 7.5rem; width: 7.7rem; }
  .how-to-join__flow--new .how-to-join__step--3 .how-to-join__step-num { left: 8.1rem; }
  .how-to-join__flow--new .how-to-join__step--3 .how-to-join__step-dot { left: 10.9rem; }
  .how-to-join__flow--new .how-to-join__step--3 .how-to-join__step-text { left: 1.4rem; width: 19.8rem; }

  .how-to-join__flow--new .how-to-join__step--4 .how-to-join__step-mask { left: 6.3rem; width: 7.8rem; }
  .how-to-join__flow--new .how-to-join__step--4 .how-to-join__step-num { left: 6.9rem; }
  .how-to-join__flow--new .how-to-join__step--4 .how-to-join__step-dot { left: 9.8rem; }
  .how-to-join__flow--new .how-to-join__step--4 .how-to-join__step-text { left: 1.4rem; width: 17.6rem; }
}

/*
 * 安心材料 / footer
 *
 * 数値はすべて Figma の設計値をそのまま rem 換算（1rem = 10px）している。
 *   PC: 安心材料 node 748-1970（1200×656）/ footer node 748-1943（1728×328）
 *   SP: 安心材料 node 758-27278（350×843）/ footer node 758-27248（390×417）
 * 安心材料のキーカラーは加入方法セクションの Web 導線と同一（#FF5A5A / #FFEDED）のため
 * --color-join-web / --color-join-web-pale をそのまま使う。
 */

/* ============ 安心材料 ============ */
.trust__panel {
  position: relative;
  z-index: 0;
  margin-left: auto;
  margin-right: auto;
  background-color: var(--color-white);
}

.trust__title-bg,
.trust__mascot,
.trust__badge-shape,
.trust__badge,
.trust__title,
.trust__lead,
.trust__card {
  position: absolute;
}

/* ---- タイトル帯 ---- */
.trust__title-bg {
  left: 0;
  top: 0;
  width: 100%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

/* Figma の Ellipse 33。100か月バッジの下地になる白い楕円 */
.trust__badge-shape {
  border-radius: 50%;
  background-color: var(--color-white);
}

/*
 * object-fit は Figma の画像塗り（既定の「切り抜き」）に合わせて残している。
 * PC は枠 116×100 が元画像 232×200 と同じ比率なので実質無効。
 * SP は枠 44.238×37.432 の方が横長で、上下が計 0.7px ぶん切り取られる（外すと縦に伸びる）。
 */
.trust__badge {
  object-fit: cover;
  z-index: 1;
}

.trust__title {
  font-weight: 700;
  color: var(--color-white);
  text-align: center;
}

.trust__lead {
  font-weight: 700;
  line-height: 1.5;
}

/* ---- メリットカード ---- */
/*
 * 枠線と背景は ::before で敷く。カード本体に border を持たせると
 * 子要素の絶対座標が border 分だけ内側にずれ、Figma の座標と合わなくなるため。
 */
.trust__card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-style: solid;
  border-color: var(--color-join-web-pale);
  border-radius: 0.5rem;
  background-color: var(--color-white);
}

.trust__figure-shape,
.trust__figure-tail,
.trust__figure-photo,
.trust__card-underline,
.trust__card-title,
.trust__marker,
.trust__card-text,
.trust__card-link {
  position: absolute;
}

/* 写真の背面にずらして敷く赤い円（吹き出しの下地） */
.trust__figure-shape {
  border-radius: 50%;
  background-color: var(--color-join-web);
}

/* 吹き出しのしっぽ。Figma の Polygon 4 / Polygon 5 は同形状のため1ファイルを使い回す */
.trust__figure-tail {
  background-image: url('../images/trust-bubble-tail.svg');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.trust__figure-photo {
  overflow: hidden;
  border-radius: 50%;
}

.trust__figure-photo img {
  position: absolute;
  max-width: none;
}

.trust__card-underline {
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.trust__card-title {
  font-weight: 700;
  color: var(--color-join-web);
  text-align: center;
}

.trust__marker {
  background-color: var(--color-join-web-pale);
}

.trust__card-text {
  font-weight: 500;
  line-height: 1.5;
}

.trust__card-link {
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-join-web);
  text-decoration: underline;
}

/* ============ footer ============ */
.footer {
  position: relative;
}

.footer__cta {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
}

.footer__button {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-white);
  color: var(--color-primary);
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}

.footer__button-arrow {
  position: absolute;
}

.footer__body {
  background-color: var(--color-white);
}

.footer__inner,
.footer__obi-inner {
  position: relative;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
}

.footer__logo,
.footer__notes {
  position: absolute;
}

.footer__notes {
  color: var(--color-text-sub);
  line-height: 1.5;
}

.footer__obi {
  background-color: var(--color-primary);
}

.footer__links {
  display: flex;
}

.footer__links-item + .footer__links-item {
  position: relative;
}

/* リンク間の白い縦罫線（Figma: Line 68） */
.footer__links-item + .footer__links-item::before {
  content: '';
  position: absolute;
  top: 50%;
  width: 0.1rem;
  background-color: var(--color-white);
  transform: translateY(-50%);
}

.footer__link,
.footer__copyright {
  color: var(--color-white);
  font-weight: 500;
  line-height: 1.5;
  white-space: nowrap;
}

@media (max-width: 767px) {
  /* ---- 安心材料（SP） ---- */
  .trust {
    margin-top: 4.8rem;
  }

  .trust__panel {
    width: calc(100% - 4rem);
    max-width: 35rem;
    height: 84.3rem;
    border-radius: 0.8rem;
  }

  .trust__title-bg {
    height: 9.7rem;
    background-image: url('../images/trust-title-bg-sp.svg');
  }

  .trust__mascot {
    left: 0.8rem;
    top: 4.7rem;
    width: 3.7rem;
    height: 5.5rem;
  }

  .trust__badge-shape {
    left: 29.104rem;
    top: 5.3rem;
    width: 4.8958rem;
    height: 5rem;
  }

  .trust__badge {
    left: 29.294rem;
    top: 5.975rem;
    width: 4.4238rem;
    height: 3.7432rem;
  }

  .trust__title {
    left: 2.4rem;
    top: 1.4rem;
    width: 30.2rem;
    font-size: 2.4rem;
    line-height: 1.2;
  }

  .trust__lead {
    left: 2.4rem;
    top: 10.6rem;
    width: 30.7rem;
    font-size: 1.8rem;
  }

  .trust__card {
    left: 2.4rem;
    width: 30.2rem;
  }

  .trust__card::before {
    border-width: 0.1rem;
  }

  .trust__card--1 { top: 23.4rem; height: 12.8rem; }
  .trust__card--2 { top: 37.4rem; height: 14.9rem; }
  .trust__card--3 { top: 53.526rem; height: 10.7rem; }
  .trust__card--4 { top: 65.4779rem; height: 15.7rem; }

  .trust__figure-shape,
  .trust__figure-photo {
    width: 7.1257rem;
    height: 7.1257rem;
  }

  .trust__figure-tail {
    top: 5.48rem;
    width: 1.87607rem;
    height: 0.97789rem;
  }

  /* 写真が左のカード（1・3） */
  .trust__card--1 .trust__figure-shape,
  .trust__card--3 .trust__figure-shape { left: 0.182rem; top: -0.202rem; }
  .trust__card--1 .trust__figure-photo,
  .trust__card--3 .trust__figure-photo { left: 0; top: -0.4rem; }
  .trust__card--1 .trust__figure-tail,
  .trust__card--3 .trust__figure-tail { left: 5.68rem; transform: rotate(131.11deg); }

  /* 写真が右のカード（2・4） */
  .trust__card--2 .trust__figure-shape,
  .trust__card--4 .trust__figure-shape { left: 22.892rem; top: -0.201rem; }
  .trust__card--2 .trust__figure-photo { left: 23.0748rem; top: -0.4002rem; }
  .trust__card--4 .trust__figure-photo { left: 23.0743rem; top: -0.4rem; }
  .trust__card--2 .trust__figure-tail,
  .trust__card--4 .trust__figure-tail { left: 22.65rem; transform: rotate(48.89deg) scaleY(-1); }

  .trust__card--1 .trust__figure-photo img { left: -74.14%; top: -86.5%; width: 257.12%; height: auto; }
  .trust__card--2 .trust__figure-photo img { left: -4.27%; top: -1.45%; width: 155.56%; height: auto; }
  .trust__card--3 .trust__figure-photo img { left: -131.89%; top: -14.16%; width: 249.62%; height: auto; }
  .trust__card--4 .trust__figure-photo img { left: -102.88%; top: -14.84%; width: 267.29%; height: auto; }

  .trust__card-underline {
    width: 21.4rem;
    height: 0.85178rem;
    background-image: url('../images/trust-underline-sp.svg');
  }

  .trust__card-title {
    top: 1.2rem;
    width: 21.4rem;
    font-size: 1.6rem;
    line-height: 1.3;
  }

  .trust__card--1 .trust__card-underline,
  .trust__card--3 .trust__card-underline { left: 7.6rem; }
  .trust__card--1 .trust__card-title,
  .trust__card--3 .trust__card-title { left: 7.6rem; }

  .trust__card--2 .trust__card-underline,
  .trust__card--4 .trust__card-underline { left: 1.2rem; }
  .trust__card--2 .trust__card-title,
  .trust__card--4 .trust__card-title { left: 1.2rem; }

  .trust__card--1 .trust__card-underline,
  .trust__card--2 .trust__card-underline { top: 5.9rem; }
  .trust__card--3 .trust__card-underline,
  .trust__card--4 .trust__card-underline { top: 3.8rem; }

  .trust__card-text {
    left: 1.2rem;
    width: 27.8rem;
    font-size: 1.4rem;
  }

  .trust__card--1 .trust__card-text,
  .trust__card--2 .trust__card-text { top: 7rem; }
  .trust__card--3 .trust__card-text,
  .trust__card--4 .trust__card-text { top: 4.9rem; }

  .trust__card--3 .trust__card-text { left: 5.2rem; width: 23.9rem; }

  .trust__card-indent {
    display: inline-block;
    width: 2.384rem;
  }

  .trust__marker { height: 0.6rem; }

  .trust__card--1 .trust__marker--a { left: 1.2rem; top: 8.6rem; width: 15.9rem; }
  .trust__card--2 .trust__marker--a { left: 1.2rem; top: 8.6rem; width: 16.8rem; }
  .trust__card--3 .trust__marker--a { left: 18.7rem; top: 6.5rem; width: 10.3rem; }
  .trust__card--3 .trust__marker--b { left: 5.2rem; top: 8.5rem; width: 7.8rem; }
  .trust__card--4 .trust__marker--a { left: 20.8rem; top: 8.5rem; width: 8rem; }
  .trust__card--4 .trust__marker--b { left: 1.2rem; top: 10.6rem; width: 10.9rem; }

  .trust__card-link {
    left: 1.2rem;
    top: 12rem;
    font-size: 1.4rem;
  }

  /* ---- footer（SP） ---- */
  .footer {
    margin-top: 5.6rem;
    padding-top: 6rem;
  }

  .footer__cta {
    width: 35rem;
    max-width: calc(100% - 4rem);
    height: 12rem;
    border-radius: 0.5rem;
    /* Figma では赤い矩形のみ不透明度95%。白ボタンまで透けないよう背景色側で表現する */
    background-color: rgba(230, 0, 18, 0.95);
  }

  .footer__button {
    left: 1.6rem;
    width: 31.8rem;
    height: 4rem;
    padding-right: 2.8rem;
    border-radius: 0.5rem;
    font-size: 1.4rem;
  }

  .footer__button--document { top: 1.6rem; padding-left: 2.8rem; }
  .footer__button--quote { top: 6.4rem; padding-left: 1.2rem; }

  .footer__button-arrow {
    right: 0.8rem;
    width: 2rem;
    height: 2rem;
  }

  .footer__body { height: 28.7rem; }

  .footer__inner {
    width: 35rem;
    max-width: calc(100% - 4rem);
  }

  .footer__logo {
    left: 50%;
    top: 7.6rem;
    width: 30.2rem;
    height: 7.5rem;
    transform: translateX(-50%);
  }

  .footer__notes {
    left: 0;
    top: 16.3rem;
    width: 100%;
    font-size: 1.2rem;
  }

  .footer__obi { height: 7rem; }

  .footer__obi-inner { width: 100%; }

  .footer__links {
    position: absolute;
    left: 50%;
    top: 0.8rem;
    transform: translateX(-50%);
  }

  .footer__links-item + .footer__links-item { margin-left: 1.6rem; }

  .footer__links-item + .footer__links-item::before {
    left: -0.8rem;
    height: 1.6rem;
  }

  .footer__copyright {
    position: absolute;
    left: 50%;
    top: 3.4rem;
    transform: translateX(-50%);
    white-space: nowrap;
  }

  .footer__link,
  .footer__copyright { font-size: 1.2rem; }

  /* Figma: Line 70。帯の下端から10px上に引かれた白い横罫線 */
  .footer__obi-line {
    position: absolute;
    left: 0;
    top: 6rem;
    width: 100%;
    height: 0.1rem;
    background-color: var(--color-white);
  }
}

@media (min-width: 768px) {
  /* ---- 安心材料（PC） ---- */
  .trust {
    margin-top: 8rem;
  }

  .trust__panel {
    width: 120rem;
    height: 65.6rem;
    border-radius: 2rem;
  }

  .trust__title-bg {
    height: 13.2rem;
    background-image: url('../images/trust-title-bg-pc.svg');
  }

  .trust__mascot {
    left: 4rem;
    top: 1.6rem;
    width: 8.1rem;
    height: 12rem;
  }

  .trust__badge-shape {
    left: 100.9rem;
    top: 1.9rem;
    width: 15.1rem;
    height: 13.7rem;
  }

  .trust__badge {
    left: 102.7rem;
    top: 3.8rem;
    width: 11.6rem;
    height: 10rem;
  }

  .trust__title {
    left: 13.3rem;
    top: 3.1rem;
    width: 88rem;
    font-size: 4rem;
    line-height: 1;
    white-space: nowrap;
  }

  .trust__lead {
    left: 9.6rem;
    top: 13.2rem;
    width: 100.8rem;
    font-size: 2.4rem;
    text-align: center;
  }

  .trust__card {
    width: 49.2rem;
  }

  .trust__card::before {
    border-width: 0.2rem;
  }

  .trust__card--1 { left: 9.6rem; top: 23.7rem; height: 14.8rem; }
  .trust__card--2 { left: 61.2rem; top: 23.7rem; height: 14.8rem; }
  /*
   * Figma では --3 が 14.8rem だが、隣の --4（リンク1行ぶん高い 21rem）と
   * 段違いに見えるため高さを --4 に合わせている。それに伴い吹き出し円と
   * しっぽも --4 と同じ縦位置（shape top: 10.006rem）まで +2.54rem 下げている。
   */
  .trust__card--3 { left: 9.6rem; top: 40.1rem; height: 21rem; }
  .trust__card--4 { left: 61.2rem; top: 40.1rem; height: 21rem; }

  .trust__figure-shape,
  .trust__figure-photo {
    width: 11.234rem;
    height: 11.234rem;
  }

  .trust__card--4 .trust__figure-shape,
  .trust__card--4 .trust__figure-photo {
    width: 11.1953rem;
    height: 11.1953rem;
  }

  .trust__figure-tail {
    width: 2.95683rem;
    height: 1.54213rem;
  }

  .trust__card--1 .trust__figure-shape { left: 0.3rem; top: -8.1rem; }
  .trust__card--1 .trust__figure-photo { left: 0; top: -8.4rem; }
  .trust__card--1 .trust__figure-tail { left: 8.98rem; top: 0.85rem; transform: rotate(131.24deg); }

  .trust__card--2 .trust__figure-shape { left: 37.575rem; top: -7.6rem; }
  .trust__card--2 .trust__figure-photo { left: 37.875rem; top: -7.9rem; }
  .trust__card--2 .trust__figure-tail { left: 37.176rem; top: 1.35rem; transform: rotate(48.76deg) scaleY(-1); }

  .trust__card--3 .trust__figure-shape { left: 0.3rem; top: 10.006rem; }
  .trust__card--3 .trust__figure-photo { left: 0; top: 10.306rem; }
  .trust__card--3 .trust__figure-tail { left: 8.98rem; top: 10.75rem; transform: rotate(-131.24deg) scaleY(-1); }

  .trust__card--4 .trust__figure-shape { left: 37.673rem; top: 10.006rem; }
  .trust__card--4 .trust__figure-photo { left: 37.972rem; top: 10.305rem; }
  .trust__card--4 .trust__figure-tail { left: 37.27rem; top: 10.74rem; transform: rotate(-48.76deg); }

  .trust__card--1 .trust__figure-photo img { left: -76.05%; top: -89.38%; width: 260.96%; height: auto; }
  .trust__card--2 .trust__figure-photo img { left: -4.27%; top: -1.45%; width: 155.56%; height: auto; }
  .trust__card--3 .trust__figure-photo img { left: -131.89%; top: -14.16%; width: 249.62%; height: auto; }
  .trust__card--4 .trust__figure-photo img { left: -102.88%; top: -14.84%; width: 267.29%; height: auto; }

  .trust__card-underline {
    top: 5.7rem;
    height: 0.95366rem;
  }

  .trust__card-title {
    top: 2rem;
    font-size: 2.4rem;
    line-height: 1.3;
    white-space: nowrap;
  }

  .trust__card--1 .trust__card-underline {
    width: 39.2rem;
    background-image: url('../images/trust-underline-400-pc.svg');
  }

  .trust__card--2 .trust__card-underline {
    width: 37.6rem;
    background-image: url('../images/trust-underline-376-pc.svg');
  }

  .trust__card--3 .trust__card-underline,
  .trust__card--4 .trust__card-underline {
    width: 40rem;
    background-image: url('../images/trust-underline-400-pc.svg');
  }

  .trust__card--1 .trust__card-underline { left: 8.4rem; }
  .trust__card--1 .trust__card-title { left: 8.4rem; width: 39.2rem; }
  .trust__card--2 .trust__card-underline { left: 2.4rem; }
  .trust__card--2 .trust__card-title { left: 2.4rem; width: 37.6rem; }
  .trust__card--3 .trust__card-underline { left: 4.6rem; }
  .trust__card--3 .trust__card-title { left: 4.6rem; width: 40rem; }
  .trust__card--4 .trust__card-underline { left: 4.6rem; }
  .trust__card--4 .trust__card-title { left: 4.6rem; width: 40rem; }

  .trust__card-text {
    top: 7rem;
    width: 44.4rem;
    font-size: 1.8rem;
  }

  .trust__card--1 .trust__card-text { left: 2.4rem; }
  .trust__card--2 .trust__card-text { left: 2.4rem; }
  /*
   * --3 は本文が2行しかなく、高さを --4 に合わせたぶん下側が空くため、
   * 本文ブロック（本文＋マーカー）をまとめて 2rem 下げている。
   * Figma の設計値は本文 top: 7rem / marker--a 8.9rem / marker--b 11.6rem。
   */
  .trust__card--3 .trust__card-text { left: 13.1rem; top: 9rem; width: 30.7rem; }
  .trust__card--4 .trust__card-text { left: 2.4rem; }

  .trust__marker { height: 0.8rem; }

  .trust__card--1 .trust__marker--a { left: 2.4rem; top: 8.8rem; width: 20.4rem; }
  .trust__card--2 .trust__marker--a { left: 2.3rem; top: 8.8rem; width: 21.7rem; }
  .trust__card--3 .trust__marker--a { left: 27.5rem; top: 10.9rem; width: 15rem; }
  .trust__card--3 .trust__marker--b { left: 13.1rem; top: 13.6rem; width: 10.2rem; }
  .trust__card--4 .trust__marker--a { left: 11.3rem; top: 11.6rem; width: 23.7rem; }

  .trust__card-link {
    left: 2.4rem;
    top: 15.9rem;
    font-size: 1.8rem;
  }

  /* ---- footer（PC） ---- */
  .footer {
    margin-top: 8rem;
    padding-top: 7.3rem;
  }

  .footer__cta {
    width: 100.8rem;
    height: 13.6rem;
    border-radius: 1rem;
    background-color: var(--color-primary);
  }

  .footer__button {
    top: 4rem;
    width: 43.2rem;
    height: 5.6rem;
    padding-right: 4rem;
    border-radius: 1rem;
    font-size: 1.8rem;
  }

  /* Figma のテキスト中心（ボタン左端から208px / 209.5px）に合わせて左右パディングを非対称にしている */
  .footer__button--document { left: 6.4rem; padding-left: 2.4rem; }
  .footer__button--quote { left: 51.2rem; padding-left: 2.7rem; }

  .footer__button-arrow {
    right: 1.6rem;
    width: 2.4rem;
    height: 2.4rem;
  }

  .footer__body { height: 22.3rem; }

  .footer__inner { width: 120rem; }

  .footer__logo {
    left: 0;
    top: 9.5rem;
    width: 38.7rem;
    height: 9.6rem;
  }

  .footer__notes {
    left: 45.1rem;
    top: 10.1rem;
    width: 74.9rem;
    font-size: 1.4rem;
  }

  .footer__obi { height: 3.2rem; }

  .footer__obi-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 120rem;
  }

  .footer__links-item + .footer__links-item { margin-left: 3.2rem; }

  .footer__links-item + .footer__links-item::before {
    left: -1.6rem;
    height: 2rem;
  }

  .footer__link,
  .footer__copyright { font-size: 1.4rem; }
}

/* ============ 保障表の外枠（PC） ============ */
@media (min-width: 768px) {
  /*
   * Figma の表本体は、各セルが外周線を持つのではなく、内罫線の上に
   * 1008px 幅の単一外枠を重ねた構造。セルごとの疑似線を止めることで
   * 外枠の二重描画・見出しとのずれ・横方向のオーバーフローを防ぐ。
   */
  .women-course__table-scroll,
  .junior-course__table-scroll,
  .before-birth__table-scroll {
    overflow-x: clip;
  }

  .women-course__table-scroll::after,
  .junior-course__table-scroll::after,
  .before-birth__table-scroll::after {
    content: '';
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    bottom: 0;
    box-sizing: border-box;
    border: 0.2rem solid;
    pointer-events: none;
  }

  .women-course__table-scroll::after {
    top: 5.6rem;
    border-color: var(--color-women);
  }

  .junior-course__table-scroll::after {
    top: 7.2rem;
    border-color: var(--color-junior);
  }

  .before-birth__table-scroll::after {
    top: 7.2rem;
    border-color: var(--color-birth);
  }

  .women-course__table tbody tr:first-child > *,
  .junior-course__table tbody tr:first-child > *,
  .before-birth__table tbody tr:first-child > * {
    border-top: 0;
  }

  .women-course__table tbody tr:last-child > *,
  .junior-course__table tbody tr:last-child > *,
  .before-birth__table tbody tr:last-child > * {
    border-bottom: 0;
  }

  .women-course__table tbody tr > *:first-child,
  .junior-course__table tbody tr > *:first-child,
  .before-birth__table tbody tr > *:first-child {
    border-left: 0;
  }

  .women-course__table tbody tr > *:last-child,
  .junior-course__table tbody tr > *:last-child,
  .before-birth__table tbody tr > *:last-child {
    border-right: 0;
  }

  .women-course__table tbody tr > *:first-child::before,
  .women-course__table tbody tr > *:last-child::after,
  .women-course__table tbody tr:first-child > * + *::before,
  .women-course__table tbody tr:last-child > * + *::before,
  .junior-course__table tbody tr > *:first-child::before,
  .junior-course__table tbody tr > *:last-child::after,
  .junior-course__table tbody tr:first-child > * + *::before,
  .junior-course__table tbody tr:last-child > * + *::before,
  .before-birth__table tbody tr > *:first-child::before,
  .before-birth__table tbody tr > *:last-child::after,
  .before-birth__table tbody tr:first-child > * + *::before,
  .before-birth__table tbody tr:last-child > * + *::before {
    content: none;
  }
}

/* ============ 保障表の外枠（SP） ============ */
@media (max-width: 767px) {
  /*
   * SP の表も Figma と同じく、内罫線とは独立した単一の外枠を重ねる。
   * 行ごとの疑似外枠を止めることで、角の二重描画と罫線のはみ出しを防ぐ。
   * 女性・ジュニア表の外枠は、横スクロール時に表本体と一緒に移動する。
   */
  .women-course__table-scroll::after,
  .junior-course__table-scroll::after,
  .before-birth__table-scroll::after {
    content: '';
    position: absolute;
    z-index: 2;
    left: 0;
    bottom: 0;
    box-sizing: border-box;
    pointer-events: none;
  }

  .women-course__table-scroll::after {
    top: 3.4rem;
    width: 48rem;
    border: 0.14rem solid var(--color-women);
  }

  .junior-course__table-scroll::after {
    top: 3.3rem;
    width: 49rem;
    border: 0.14rem solid var(--color-junior);
  }

  .before-birth__table-scroll::after {
    top: 3.3rem;
    width: 30.2rem;
    border: 0.12rem solid var(--color-birth);
  }

  .women-course__table tbody tr > * {
    border-top-width: 0.14rem;
  }

  .women-course__table tbody th + td,
  .women-course__table tbody td + td {
    border-left-width: 0.14rem;
  }

  .junior-course__table tbody tr > * {
    border-top-width: 0.14rem;
  }

  .junior-course__table tbody th + td,
  .junior-course__table tbody td + td {
    border-left-width: 0.14rem;
  }

  .before-birth__table tbody tr > * {
    border-top-width: 0.12rem;
  }

  .before-birth__table tbody th + td {
    border-left-width: 0.12rem;
  }

  .women-course__table tbody tr:first-child > *,
  .junior-course__table tbody tr:first-child > *,
  .before-birth__table tbody tr:first-child > * {
    border-top: 0;
  }

  .women-course__table tbody tr:last-child > *,
  .junior-course__table tbody tr:last-child > *,
  .before-birth__table tbody tr:last-child > * {
    border-bottom: 0;
  }

  .women-course__table tbody tr > *:first-child,
  .junior-course__table tbody tr > *:first-child,
  .before-birth__table tbody tr > *:first-child {
    border-left: 0;
  }

  .women-course__table tbody tr > *:last-child,
  .junior-course__table tbody tr > *:last-child,
  .before-birth__table tbody tr > *:last-child {
    border-right: 0;
  }

  .women-course__table tbody tr > *:first-child::before,
  .women-course__table tbody tr > *:last-child::after,
  .women-course__table tbody tr:first-child > * + *::before,
  .women-course__table tbody tr:last-child > * + *::before,
  .junior-course__table tbody tr > *:first-child::before,
  .junior-course__table tbody tr > *:last-child::after,
  .junior-course__table tbody tr:first-child > * + *::before,
  .junior-course__table tbody tr:last-child > * + *::before,
  .before-birth__table tbody tr > *:first-child::before,
  .before-birth__table tbody tr > *:last-child::after,
  .before-birth__table tbody tr:first-child > * + *::before,
  .before-birth__table tbody tr:last-child > * + *::before {
    content: none;
  }
}