/* =====================================================================
   feature-child.css — 下層「コープデリの特長 / 子育て応援・割引制度が充実」（B03）
   ヘッダーは feature-assort.css（.p-fahero）を再利用。
   本ファイルは 01〜05 の白カード内コンテンツを担当。
   PC: 角丸カード。SP: 全幅の白バンド（クリーム地と切り替え）。
   ===================================================================== */

.p-child { display: contents; }
/* childページのセクション間は40px（共有の64pxを上書き。詳細度3クラスで確実に勝つ） */
.p-child .p-fasec + .p-fasec { margin-top: var(--space-40); }
/* SP: ヒーローのリード文余白（上45 / 見出し↔本文25 / 下45）。feature-child.cssはB03のみ読込 */
@media (max-width: 599px) {
  .p-fahero__lead { margin-block: 45px; gap: 25px; }
  .p-childtbl .p-childacc + .p-childacc { margin-top: var(--space-16); }  /* SPはアコーディオン間16px（PCは32px）。基本ルールより後方にあるため詳細度で上書き */
  /* きらきらカード: セクションの左右padding(24px)を打ち消して全幅化＋角丸なし（基本ルールが後方にあるため.p-child前置で詳細度を上げる） */
  .p-child .p-childfood { width: calc(100% + var(--space-48)); margin-inline: calc(var(--space-24) * -1); }
  .p-child .p-childfood__inner { border-radius: 0; }
  .p-child .p-childfood__name { font-size: 16px; }  /* SP: 商品名見出しを16px（PCは20px） */
  .p-child .p-childpoint__h { font-size: 16px; }    /* SP: ポイント見出しを16px（PCは20px） */
  .p-child .p-childprod { gap: var(--space-40); }   /* SP: ブランド名→商品画像の間隔を40px（PCは24px） */
  .p-child .p-childprod__grid { gap: var(--space-40); }  /* SP: 商品アイテム間も40px（PCは24px） */
}

/* 各セクション見出し＋導入文 */
.p-child__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-16);
  text-align: center;
}
.p-child__lead {
  font-size: 16px;
  line-height: 1.625;
  color: var(--text-default);
  /* SP: 左寄せ（PCで中央に戻す） */
  text-align: left;
  align-self: stretch;
}

/* ※注釈リスト */
.p-child__notes {
  width: 100%;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  /* 直上（p-childcmpとの間）の隙間を16pxに（p-fasec__inner の gap 40px を相殺） */
  margin-top: calc(var(--space-16) - var(--space-40));
}
.p-child__notes li {
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: .04em;
  color: var(--text-default);
}

/* アウトラインボタン（中央寄せ・固定幅） */
.p-child__btn { min-width: 280px; }
/* SP/タブレット: 親(.p-fasec__inner)の左右padding24pxを除いた全幅にする */
@media (max-width: 1023px) {
  .p-child__btn { width: 100%; min-width: 0; }
}

/* =====================================================================
   01: 手数料割引 3カラム比較
   ===================================================================== */
.p-childcmp {
  width: 100%;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-24);
}
.p-childcmp__card {
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-16);
  overflow: hidden;
}
.p-childcmp__label {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-top: var(--space-8);
  text-align: center;
}
.p-childcmp__card--pink .p-childcmp__label { background: var(--container-pink); }
.p-childcmp__card--cyan .p-childcmp__label { background: var(--container-cyan); }
.p-childcmp__label-s {
  font-size: 16px;
  line-height: 1.5;
  font-weight: var(--fw-bold);
  color: var(--text-default);
}
.p-childcmp__label-b {
  font-size: 24px;
  line-height: 1.6;
  font-weight: var(--fw-bold);
  letter-spacing: .04em;
}
.p-childcmp__label-b--pink { color: var(--text-pink); }
.p-childcmp__label-b--cyan { color: var(--text-cyan); }

.p-childcmp__body {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-16);
  padding: var(--space-24);
  border-top: 2px solid #fff;
}
.p-childcmp__body--kids { background: #fff4f2; }
.p-childcmp__body--baby { background: #f2fafa; }

.p-childcmp__before {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  font-weight: var(--fw-bold);
  color: var(--text-default);
}
.p-childcmp__pre-l { font-size: 16px; line-height: 1.5; }
.p-childcmp__pre-n { font-size: 16px; line-height: 1; }
.p-childcmp__pre-n b { font-size: 28px; letter-spacing: .04em; }
.p-childcmp__pre-u { font-size: 16px; font-weight: var(--fw-light); line-height: 1.6; }
.p-childcmp__arrow { display: block; width: 13px; height: auto; flex-shrink: 0; }
.p-childcmp__after {
  font-weight: var(--fw-bold);
  color: var(--text-pink);
  line-height: 1;
}
.p-childcmp__after b { font-size: 54px; letter-spacing: .1em; }
.p-childcmp__after { font-size: 16px; }

/* =====================================================================
   02: 割引制度詳細
   ===================================================================== */
/* 概要フロー（赤ちゃん割引 →自動更新→ 子育て割引） */
.p-childflow {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: var(--space-16);
}
.p-childflow__row {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}
.p-childflow__item {
  width: 100%;
  display: grid;
  grid-template-columns: 120px 1fr;   /* A=割引名 | B/C=右側 */
  grid-template-rows: auto 1fr;
  grid-template-areas:
    "tag bar"
    "tag val";
  border-radius: var(--radius-16);
  overflow: hidden;
}
.p-childflow__tag {
  grid-area: tag;                      /* 左列を2行ぶち抜き（A） */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: var(--space-4) var(--space-8);
  border-right: 2px solid #fff;
}
.p-childflow__item--pink .p-childflow__tag { background: var(--container-pink); }
.p-childflow__item--cyan .p-childflow__tag { background: var(--container-cyan); }
/* 子育てカードは車がカード外へはみ出すためclipを外し、角丸は各セルに付与して維持 */
.p-childflow__item--cyan { overflow: visible; }
.p-childflow__item--cyan .p-childflow__tag { border-radius: var(--radius-16) 0 0 var(--radius-16); }
.p-childflow__item--cyan .p-childflow__bar { border-top-right-radius: var(--radius-16); }
.p-childflow__item--cyan .p-childflow__val { border-bottom-right-radius: var(--radius-16); }
.p-childflow__tag-t { font-size: 14px; line-height: 1.5; font-weight: var(--fw-bold); letter-spacing: .04em; color: var(--text-default); }
.p-childflow__tag-s { font-size: 12px; line-height: 1.5; letter-spacing: .04em; color: var(--text-default); }
.p-childflow__bar {
  grid-area: bar;                      /* 右上＝手数料ラベル（B） */
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--container-alfa);
  color: var(--text-white);
  font-size: 16px;
  font-weight: var(--fw-bold);
  padding: var(--space-8);
  border-bottom: 2px solid #fff;
}
.p-childflow__val {
  position: relative;                  /* 装飾(deco)の起点 */
  grid-area: val;                      /* 右下＝金額（C） */
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-8);
  padding: var(--space-16);
  font-size: 16px;
  font-weight: var(--fw-bold);
  color: var(--text-default);
}
.p-childflow__val--kids { background: #fff4f2; }
.p-childflow__val--baby { background: rgba(210,238,238,.3); }
.p-childflow__val .u-pink { color: var(--text-pink); font-size: 28px; line-height: 1.4; }
/* 金額の左右を飾る装飾（星・哺乳瓶・車） */
.p-childflow__deco {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  height: auto;
  pointer-events: none;
  z-index: 1;
}
.p-childflow__deco--l { left: 8px; width: 42px; }
.p-childflow__deco--r { right: 8px; width: 52px; }
/* 赤ちゃん割引カード: 「無料」を40pxに拡大し、星・哺乳瓶も大きく外側へ */
.p-childflow__val--kids .u-pink { font-size: 40px; }
.p-childflow__val--kids .p-childflow__deco--l { width: 54px; left: 2px; }
.p-childflow__val--kids .p-childflow__deco--r { width: 68px; right: 2px; }
/* スマホは横幅が狭く金額と重なるため、装飾を小さく端寄せ */
@media (max-width: 599px) {
  .p-childflow__deco--l { left: 2px; width: 28px; }
  .p-childflow__deco--r { right: 2px; width: 32px; }
  /* SP専用アイコン差し替え（aspect-ratio:autoで新SVGの比率に合わせる） */
  .p-childflow__val--kids .p-childflow__deco--r { content: url(../img/child_sp_milk.svg); width: 40px; aspect-ratio: auto; }   /* 赤ちゃん: 哺乳瓶→ミルク */
  /* 子育て: Figma(node 2387:52791)準拠。車=右上でバーに重なる（左右反転）／星=左下 */
  .p-childflow__val--baby .p-childflow__deco--l {   /* 車 */
    content: url(../img/child_sp_car.svg); aspect-ratio: auto;
    width: 71px;
    left: auto; right: -15px;
    top: -31px; transform: none;   /* Figma: カード上端から約11px（実装バーが高いぶん-31px）。左右反転なし */
    z-index: 2;
  }
  .p-childflow__val--baby .p-childflow__deco--r {   /* 星 */
    content: url(../img/child_sp_star_2.svg); aspect-ratio: auto;
    width: 39px;
    right: auto; left: -9px;
    top: auto; bottom: 0; transform: none;
  }
}
.p-childflow__auto {
  display: flex;
  align-items: center;
  justify-content: center;
}
.p-childflow__auto img {
  display: block;
  height: auto;
  max-width: 100%;
}
/* SP: 子育て割引の赤文字が大きく崩れるためフォントを2px小さく */
.p-childflow__val--baby .u-pink { font-size: 26px; }
.p-childflow__note { display: flex; flex-direction: column; gap: var(--space-8); }
.p-childflow__note-t { font-size: 16px; line-height: 1.625; color: var(--text-default); }
.p-childflow__note-s { font-size: 12px; line-height: 1.5; letter-spacing: .04em; color: var(--text-default); }

/* 各地域の手数料テーブル群 */
.p-childtbl {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.p-childtbl__title { margin-bottom: var(--space-24); }   /* タイトル→1つ目は24px維持 */
.p-childacc + .p-childacc { margin-top: var(--space-32); } /* アコーディオン間は32px */
.p-childtbl__title {
  font-size: 24px;
  line-height: 1.6;
  font-weight: var(--fw-bold);
  letter-spacing: .04em;
  color: var(--text-secondary);
  text-align: center;
}

/* アコーディオン（閉=白背景／開=レベル1ベージュ） */
.p-childacc {
  background: var(--container-white);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-16);
  overflow: hidden;
}
.p-childacc:not([open]) { box-shadow: 0 2px 8px rgba(44, 41, 36, .06); }
.p-childacc[open] { background: var(--container-level1); box-shadow: none; }
.p-childacc__sum {
  list-style: none;
  position: relative;            /* ＋/− トグルの起点 */
  display: flex;
  align-items: center;
  gap: var(--space-16);
  padding: var(--space-24);
  padding-right: 56px;           /* ＋/− アイコン分の余白 */
  font-size: 16px;
  font-weight: var(--fw-bold);
  color: var(--text-default);
  cursor: pointer;
}
.p-childacc__sum::-webkit-details-marker { display: none; }
/* ＋ / − トグル（TOPのQ&A .p-faq__toggle を流用） */
.p-childacc__sum::before,
.p-childacc__sum::after {
  content: "";
  position: absolute;
  right: var(--space-24);
  top: 50%;
  width: 18px; height: 2px;
  margin-top: -1px;
  border-radius: 2px;
  background: var(--text-secondary);
}
.p-childacc__sum::after { transform: rotate(90deg); transition: opacity .2s ease, transform .2s ease; }
.p-childacc[open] .p-childacc__sum::after { opacity: 0; transform: rotate(0); }
.p-childacc__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-24);
  padding: 0 var(--space-16) var(--space-24);
}

/* 地域ブロック */
.p-childregion { display: flex; flex-direction: column; gap: var(--space-8); }
.p-childregion__name { font-size: 16px; line-height: 1.625; color: var(--text-default); }
.p-childregion__link { text-align: left; }
.p-childregion__link a {
  font-size: 16px;
  line-height: 1.625;
  color: var(--text-link);
  text-decoration: underline;
}

/* 手数料テーブル */
.p-feetbl {
  width: 100%;
  border-collapse: separate;
  border-spacing: 2px;
  table-layout: fixed;
}
.p-feetbl thead th {
  background: var(--container-alfa);
  color: var(--text-white);
  font-size: 14px;
  font-weight: var(--fw-bold);
  line-height: 1.4;
  text-align: center;
  padding: var(--space-8) var(--space-4);
}
.p-feetbl thead th:first-child { border-top-left-radius: var(--radius-8); }
.p-feetbl thead th:last-child  { border-top-right-radius: var(--radius-8); }
.p-feetbl td {
  background: var(--container-white);
  text-align: center;
  vertical-align: middle;
  padding: var(--space-12) var(--space-4);
  font-size: 14px;
  font-weight: var(--fw-bold);
  line-height: 1.4;
  color: var(--text-default);
}
.p-feetbl td small,
.p-feetbl .p-feetbl__rh small {
  display: block;
  font-size: 12px;
  font-weight: var(--fw-light);
  line-height: 1.5;
  letter-spacing: .04em;
}
.p-feetbl td b { font-size: 18px; letter-spacing: .04em; }
.p-feetbl .p-feetbl__free { color: var(--text-pink); font-size: 16px; }   /* 0円の「円」＝16px */
.p-feetbl .p-feetbl__free b { font-size: 28px; }                          /* 0円の「0」＝28px */
/* 「ご利用金額にかかわらず」（赤ちゃん割引の利用代金セル）はボールドなし */
.p-feetbl .p-feetbl__rh--pink + td { font-weight: normal; }
.p-feetbl .p-feetbl__rh {
  font-size: 14px;
  font-weight: var(--fw-bold);
  line-height: 1.4;
  color: var(--text-default);
  text-align: center;
  padding: var(--space-12) var(--space-8);
}
.p-feetbl .p-feetbl__rh--pink { background: var(--container-pink); }
.p-feetbl .p-feetbl__rh--cyan { background: var(--container-cyan); }
/* 角丸（左列の上下端） */
.p-feetbl tbody tr:first-child .p-feetbl__rh { border-top-left-radius: var(--radius-8); }
.p-feetbl tbody tr:last-child  .p-feetbl__rh,
.p-feetbl tbody tr:last-child  td:first-child:not(.p-feetbl__rh) { border-bottom-left-radius: var(--radius-8); }
.p-feetbl tbody tr:last-child  td:last-child { border-bottom-right-radius: var(--radius-8); }
/* SPのみ改行（≥600pxでは1行） */
@media (min-width: 600px) { .p-child__sp-br { display: none; } }
/* SP: 角丸調整（先頭行の左上を無し／子育て割引(cyan)の左下を丸める） */
@media (max-width: 599px) {
  .p-feetbl tbody tr:first-child .p-feetbl__rh { border-top-left-radius: 0; }
  .p-feetbl .p-feetbl__rh--cyan { border-bottom-left-radius: var(--radius-8); }
}

/* =====================================================================
   03: 離乳食・幼児食 2カード ＋ 3ポイント
   ===================================================================== */
.p-childfood {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: var(--space-40);
}
.p-childfood__card {
  display: flex;
  flex-direction: column;
  align-items: center;
}
/* ブランドロゴ（カード上部にせり出す） */
.p-childfood__logo {
  position: relative;
  z-index: 2;
  height: 95px;
  width: auto;
  margin-bottom: -40px;   /* カード本体に40px重ねる */
}
/* カード本体（淡色地・角丸） */
.p-childfood__inner {
  position: relative;
  z-index: 1;
  width: 100%;
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-24);
  overflow: hidden;
}
.p-childfood__card--baby .p-childfood__inner { background: #f3fae5; }
.p-childfood__card--kids .p-childfood__inner { background: #fff4f2; }
/* バッジ色＝カードのテーマ色 */
.p-childfood__card--baby .p-childbadge { background: #75bb34; }
.p-childfood__card--kids .p-childbadge { background: #e26270; }

/* ヘッダー（タイトル＋商品サムネ） */
.p-childfood__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-24);
  padding: 56px var(--space-24) var(--space-24);   /* 上はロゴ分 */
  text-align: center;
}
.p-childfood__ttl { display: flex; flex-direction: column; gap: var(--space-8); width: 100%; }
.p-childfood__sub {
  font-size: 16px;
  line-height: 1.7;
  font-weight: var(--fw-bold);
  letter-spacing: .04em;
}
.p-childfood__card--baby .p-childfood__sub { color: #75bb34; }
.p-childfood__card--kids .p-childfood__sub { color: #e26270; }
.p-childfood__desc { font-size: 14px; line-height: 1.55; letter-spacing: .04em; color: var(--text-default); }
/* 商品サムネ3点 */
.p-childfood__pkgs {
  list-style: none;
  display: flex;
  align-items: flex-end;     /* 下揃え（パッケージの底を揃える） */
  justify-content: center;
  gap: 15px;
  width: 100%;
}
.p-childfood__pkgs li { flex: 0 1 auto; min-width: 0; }
.p-childfood__pkgs img { display: block; width: auto; height: auto; max-width: 100%; }
/* きらきらキッズは縦中央よせ */
.p-childfood__card--kids .p-childfood__pkgs { align-items: center; }

/* コンテンツ（タグ＋調理例） */
.p-childfood__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: var(--space-40);
  padding: 0 var(--space-24) var(--space-40);
}
.p-childfood__tags { width: 100%; display: flex; gap: var(--space-8); }
.p-childfood__tag {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-8);
  background: var(--container-white);
  border-radius: var(--radius-24);
  padding: var(--space-12);
  text-align: center;
}
.p-childfood__tag-t { font-size: 16px; line-height: 1.625; color: var(--text-default); }
.p-childbadge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  padding: var(--space-4) var(--space-16);
  border-radius: var(--radius-8);
  font-size: 12px;
  letter-spacing: .04em;
  white-space: nowrap;
  color: var(--text-white);
}

.p-childfood__sec { display: flex; flex-direction: column; align-items: center; gap: var(--space-24); }
.p-childfood__ex {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 20px;
  line-height: 1.7;
  font-weight: var(--fw-bold);
  letter-spacing: .04em;
  color: var(--text-secondary);
}
.p-childfood__fork { display: block; height: 20px; width: auto; }
.p-childfood__img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 327 / 207;
  object-fit: cover;
  border-radius: var(--radius-24);
}
.p-childfood__txt { width: 100%; display: flex; flex-direction: column; gap: var(--space-8); text-align: left; }
.p-childfood__name { font-size: 20px; line-height: 1.7; font-weight: var(--fw-bold); letter-spacing: .04em; color: var(--text-default); }
.p-childfood__text { font-size: 16px; line-height: 1.625; color: var(--text-default); }

/* 3ポイント */
.p-childpoint { width: 100%; display: flex; flex-direction: column; gap: var(--space-32); }
.p-childpoint__title {
  font-size: 24px;
  line-height: 1.6;
  font-weight: var(--fw-bold);
  letter-spacing: .04em;
  color: var(--text-secondary);
  text-align: center;
}
.p-childpoint__list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-24);
}
.p-childpoint__item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-16);
  background: var(--container-highlight);
  border-radius: var(--radius-24);
  padding: var(--space-24);
  text-align: left;
}
.p-childpoint__h { font-size: 20px; line-height: 1.7; font-weight: var(--fw-bold); letter-spacing: .04em; color: var(--text-default); }
.p-childpoint__t { font-size: 16px; line-height: 1.625; color: var(--text-default); }

/* =====================================================================
   04: 人気の商品をご紹介
   ===================================================================== */
.p-childprod {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: var(--space-24);
  padding: var(--space-48) var(--space-24);
  border-radius: var(--radius-24);
}
.p-childprod--baby { background: #f3fae5; }
.p-childprod--kids { background: #fff4f2; }
.p-childprod__brand {
  font-size: 20px;
  line-height: 1.6;
  font-weight: var(--fw-bold);
  letter-spacing: .04em;
  text-align: center;
}
.p-childprod__brand--baby { color: #75bb34; }
.p-childprod__brand--kids { color: #e26270; }
/* ブランド見出しの左右の装飾（見出しを起点に左右へオフセット） */
.p-childprod__brand { position: relative; width: fit-content; margin-inline: auto; }
.p-childprod__brand--baby { --deco-gap: 12px; }   /* SP */
.p-childprod__brand--kids { --deco-gap: 12px; }   /* SP */
.p-childprod__deco {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: auto;
  height: auto;
  pointer-events: none;
}
.p-childprod__deco--l { right: calc(100% + var(--deco-gap)); }
.p-childprod__deco--r { left: calc(100% + var(--deco-gap)); }
/* アクセント画像サイズ（セクションごと。base の width/height:auto を上書き） */
.p-childprod__brand--baby .p-childprod__deco--l { width: 38px; height: 51px; }   /* キラキラステップ 左 */
.p-childprod__brand--baby .p-childprod__deco--r { width: 67px; height: 78px; }   /* キラキラステップ 右 */
.p-childprod__brand--kids .p-childprod__deco--l { width: 71px; height: 46px; }   /* きらきらキッズ 左 */
.p-childprod__brand--kids .p-childprod__deco--r { width: 54px; height: 52px; }   /* きらきらキッズ 右 */
/* SP: 緑/ピンクのブロックを画面幅いっぱいに */
@media (max-width: 1023px) {
  .p-childprod {
    align-self: stretch;
    width: auto;
    margin-inline: calc(-1 * var(--space-24));
    border-radius: 0;
  }
}
@media (min-width: 1024px) {
  .p-childprod__brand { font-size: 24px; }   /* PCは24px（SPは20px） */
  .p-childprod__brand--baby { --deco-gap: 50px; }
  .p-childprod__brand--kids { --deco-gap: 25px; }
}
.p-childprod__grid {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-24);
}
.p-childprod__item { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-8); }
.p-childprod__img {
  width: 100%;
  background: var(--container-white);
  border-radius: var(--radius-24);
  overflow: hidden;
  padding: 15px;
}
.p-childprod__img img {
  display: block;
  width: 80%;
  margin: 0 auto;
  height: auto;
  aspect-ratio: 272 / 172;
  object-fit: contain;
}
.p-childprod__cat {
  display: inline-flex;
  align-items: center;
  background: #528dda;
  color: var(--text-white);
  font-size: 14px;
  letter-spacing: .04em;
  border-radius: var(--radius-8);
  padding: 0 var(--space-8);
}
.p-childprod__name { font-size: 20px; line-height: 1.7; font-weight: var(--fw-bold); letter-spacing: .04em; color: var(--text-default); }
.p-childprod__spec { font-size: 16px; line-height: 1.625; color: var(--text-default); }
/* SP: 商品名・スペックのフォントサイズ調整（ベース定義より後方に置き確実に上書き） */
@media (max-width: 599px) {
  .p-childprod__name { font-size: 16px; }   /* 20px → 16px（bold据え置き） */
  .p-childprod__spec { font-size: 12px; }   /* 16px → 12px */
}

/* =====================================================================
   05: きらきらベビープレゼント
   ===================================================================== */
.p-childgift__img {
  display: block;
  width: 100%;
  max-width: 429px;
  height: auto;
  margin: 0 auto;
}

/* =====================================================================
   PC（min-width:1024px）
   ===================================================================== */
@media (min-width: 1024px) {
  .p-child__notes li { font-size: 12px; }
  /* PC: 直上の隙間を16pxに（p-fasec__inner の gap 64px を相殺） */
  .p-child__notes { margin-top: calc(var(--space-16) - var(--space-64)); }
  .p-fahero__h-br { display: none; }   /* PCでは改行しない（SPのみ改行） */
  .p-child__lead { text-align: center; align-self: auto; }   /* PCは中央寄せ */

  /* 01: 3カラム横並び */
  .p-childcmp { flex-direction: row; gap: var(--space-24); }
  .p-childcmp__card { flex: 1; min-width: 0; }
  .p-childcmp__body { gap: var(--space-12); padding: var(--space-24) var(--space-16); }

  /* 02: 概要フローを横並びに（各アイテムは "tag bar" / "tag val" のグリッド） */
  .p-childflow__row { flex-direction: row; align-items: stretch; gap: 0; }
  .p-childflow__item { flex: 1; grid-template-columns: 160px 1fr; }   /* PCはtag列を広めに */
  .p-childflow__bar { padding: var(--space-12); }
  .p-childflow__auto { flex: none; padding: 0; }
  .p-childflow__val--baby .u-pink { font-size: 28px; }   /* PCは通常サイズ */

  .p-childtbl__title { font-size: 28px; letter-spacing: .04em; }
  .p-childacc__body { padding: 0 var(--space-24) var(--space-24); }

  /* テーブルは横並びの本来レイアウトに（左列固定幅） */
  .p-feetbl { border-spacing: 2px; }
  .p-feetbl thead th,
  .p-feetbl td { font-size: 16px; }
  .p-feetbl td b { font-size: 20px; }
  .p-feetbl .p-feetbl__rh { width: 240px; }

  /* 03: 2カード横並び（高さ揃え） */
  .p-childfood__sub { font-size: 20px; }   /* PCは20px（SPは16px） */
  .p-childfood { flex-direction: row; align-items: stretch; gap: var(--space-40); }
  .p-childfood__card { flex: 1; min-width: 0; }
  .p-childfood__inner { flex: 1; }
  .p-childfood__head { padding: 56px var(--space-40) var(--space-24); }
  .p-childfood__content { padding: 0 var(--space-40) var(--space-40); }
  .p-childfood__pkgs { gap: 15px; }
  .p-childpoint__list { flex-direction: row; gap: var(--space-24); }
  .p-childpoint__item { flex: 1; min-width: 0; }

  /* 04: 商品3カラム */
  .p-childprod__grid { flex-direction: row; gap: var(--space-24); }
  .p-childprod__item { flex: 1; min-width: 0; }
}

/* ---------------------------------------------------------------------
   01の装飾イラスト（ベビーカー=左 / 車=右）
   SP: 注釈の下に2枚並べる ／ PC: 見出しの左右に配置（カード上部にまたがる）
   --------------------------------------------------------------------- */
.p-child__sec01 { position: relative; }
/* PCで上部にはみ出す装飾を見せるため、このセクションのみクリップ解除 */
.p-child__sec01 .p-fasec__inner { overflow: visible; }

/* SP: 注釈の下に2枚並べる（PC用は非表示） */
.p-child__deco--pc { display: none; }
.p-child__deco--sp {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: var(--space-24);
  width: 100%;
}
/* sec01（家族＋家/木）: Figma準拠で家/木を左・家族を右に、家族を約19px被せる */
.p-child__deco--sp:not(.p-child__deco--sec02) { gap: 0; }
.p-child__deco--sp .p-child__car { order: -1; width: 141px; height: auto; }
.p-child__deco--sp .p-child__stroller { width: 111px; height: auto; margin-left: -19px; position: relative; z-index: 1; }

@media (min-width: 1024px) {
  /* PC: 見出し(.p-child__head)を起点に、左右へ30px離して配置 */
  .p-child__deco--sp { display: none; }
  .p-child__deco--pc { display: contents; }
  .p-child__head { position: relative; }
  .p-child__deco--pc .p-child__stroller,
  .p-child__deco--pc .p-child__car {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    width: 150px;
    height: auto;
    pointer-events: none;
  }
  .p-child__deco--pc .p-child__stroller { right: calc(100% + 30px); }   /* 見出しの左外側30px */
  .p-child__deco--pc .p-child__car { left: calc(100% + 30px); }         /* 見出しの右外側30px */
}

/* ---------------------------------------------------------------------
   02の装飾イラスト（ツリー＆ハウス=左 / 家族=右）
   SP: 注釈の下に2枚並べる ／ PC: 左=見出し起点30px・右=カード(p-fasec__inner)起点
   --------------------------------------------------------------------- */
.p-child__sec02 { position: relative; }
.p-child__sec02 .p-fasec__inner { overflow: visible; }

/* PC専用画像はSPでは非表示 */
.p-child__house--pc,
.p-child__family--pc { display: none; }

/* 家族イラスト（child-family.svg）は元の向きで使用（左右反転しない） */
.p-child__sec02 .p-child__family { transform: none; }

/* SP: 注釈の下にツリー＆ハウス＋家族を並べる（家族を家に20pxほど被せる） */
.p-child__deco--sec02 { gap: 0; }
.p-child__deco--sec02 .p-child__house { width: 116px; height: auto; }
.p-child__deco--sec02 .p-child__family { width: 168px; height: auto; margin-left: -20px; position: relative; z-index: 1; }

@media (min-width: 1024px) {
  /* 左：見出し(.p-child__head)の左外側30px */
  .p-child__house--pc {
    display: block;
    position: absolute;
    top: 50%;
    right: calc(100% + 30px);
    transform: translateY(-50%);
    width: 173px;
    height: auto;
    z-index: 3;
    pointer-events: none;
  }
  /* 右：カード(.p-fasec__inner)起点で right:5px / top:-80px */
  .p-child__family--pc {
    display: block;
    position: absolute;
    top: -100px;
    right: 5px;
    width: 321px;
    height: auto;
    z-index: 3;
    pointer-events: none;
  }
}