/* 放課後フリースクール®（2026-11-08 リニューアル）
   style-lp_freeschool2026.css（全日制）の部品をそのまま使い、ここでは黄色をキーカラーにする差分と、このページだけの部品を書く。
   ページの中身は .fs-after の中だけ。共通ヘッダー・フッターには触らない */
.fs-after{--af-yellow-pale:#FFF6D6}

/* ヒーロー：背景を黄色に。CTA は濃い青 */
.fs-after .fs-hero{background:var(--fs-yellow)}
.fs-after .fs-hero .bt-top .fs-kicker{background:var(--fs-navy);color:#fff}
.fs-after .fs-hero .fs-lead .l1{color:var(--fs-navy)}
.fs-after .fs-hero .fs-lead .l2{color:#e2a300}
.fs-after .fs-hero .fs-lead em{background:var(--fs-blue);color:#fff}
.fs-after .bt-cta{background:var(--fs-navy);color:#fff}
.fs-after .bt-arrow{background:var(--fs-yellow);color:var(--fs-navy)}
.fs-after .bt-tools{background:#fff;color:var(--fs-navy)}
.fs-after .bt-tools b:nth-child(2){color:#e2a300}
.fs-after .bt-tools b:nth-child(3){color:var(--fs-navy)}
.fs-after .bt-tag{background:#fff}
.fs-after .fs-eyebrow:before{background:var(--fs-yellow)}
@media(max-width:900px){
  .fs-after .fs-hero .fs-lead{font-size:clamp(40px,11.5vw,64px)}
}

/* 薄い黄色の帯 */
.af-pale{background:var(--af-yellow-pale)}

/* 概要（時間・教室・料金） */
.af-summary{padding:40px 0}
.af-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.af-facts>div{background:#fff;border:2px solid var(--fs-yellow);border-radius:16px;padding:20px 24px}
.af-facts dt{font-size:13px;font-weight:800;letter-spacing:.1em;color:var(--fs-navy);margin-bottom:6px}
.af-facts dd{font-size:17px;font-weight:800;color:var(--fs-navy);line-height:1.6}
.af-facts small{display:block;font-size:13px;font-weight:500;color:var(--fs-sub)}

/* 特徴（丸い画像） */
.af-features{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.af-features article{text-align:center;background:var(--af-yellow-pale);border-radius:16px;padding:32px 24px}
.af-features img{width:200px;height:200px;border-radius:50%;margin:0 auto 16px;object-fit:cover}
.af-features h3{font-size:19px;font-weight:800;color:var(--fs-navy);margin-bottom:8px}
.af-features p{font-size:15px;color:var(--fs-sub);text-align:left}

/* 写真カード（4枚） */
.af-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.af-cards article{background:#fff;border-radius:16px;overflow:hidden;display:flex;flex-direction:column}
.af-cards img{width:100%;aspect-ratio:1/1;object-fit:cover}
.af-cards h3{font-size:18px;font-weight:800;color:var(--fs-navy);margin:16px 18px 6px}
.af-cards p{font-size:14px;color:var(--fs-sub);margin:0 18px 20px!important;line-height:1.8}

/* キャンペーン＋体験ボタン */
.af-camp{text-align:center;margin-top:48px}
.af-camp p{font-weight:800;color:var(--fs-navy);margin-bottom:12px!important}

/* 声（画像に文字入り） */
.af-sub{text-align:center;margin:8px 0 24px!important;font-size:24px}
.af-voices{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.af-voices img{border-radius:12px}
.fs-after #place .fs-title p{margin-bottom:6px}

/* サポート */
.af-support{align-items:start;margin-bottom:0}
.af-points{list-style:none;padding:0;margin:0;display:grid;gap:14px;counter-reset:pt}
.af-points li{background:var(--af-yellow-pale);border-radius:14px;padding:18px 22px 18px 64px;position:relative;counter-increment:pt}
.af-points li:before{content:counter(pt);position:absolute;left:18px;top:18px;width:32px;height:32px;border-radius:50%;background:var(--fs-yellow);color:var(--fs-navy);font-weight:900;display:grid;place-items:center}
.af-points h3{font-size:17px;font-weight:800;color:var(--fs-navy);margin-bottom:4px}
.af-points p{font-size:14px;color:var(--fs-sub);margin:0!important}

/* 1日の流れ */
.af-flow{list-style:none;padding:0;margin:0;display:grid;gap:20px;position:relative}
.af-flow>li{display:grid;grid-template-columns:320px 1fr;gap:28px;background:#fff;border-radius:16px;padding:20px;align-items:center;position:relative}
.af-flow>li img{border-radius:10px;width:100%;aspect-ratio:690/376;object-fit:cover}
.af-flow h3{font-size:19px;font-weight:800;color:var(--fs-navy);margin-bottom:8px}
.af-flow p{font-size:15px;color:var(--fs-sub)}
.af-flow small{display:block;font-size:13px;margin-top:6px}
.af-flow ul{list-style:none;padding:0;margin:8px 0!important;display:flex;flex-wrap:wrap;gap:8px}
.af-flow ul li{background:var(--af-yellow-pale);color:var(--fs-navy);font-size:14px;font-weight:700;padding:4px 14px;border-radius:999px}
.af-time{display:inline-block;background:var(--fs-navy);color:var(--fs-yellow);font-weight:900;font-size:14px;padding:2px 12px;border-radius:6px;margin-bottom:8px}

/* 日程・料金・教室 */
.af-price{background:var(--af-yellow-pale);margin-bottom:24px}
.af-price dl{display:grid;grid-template-columns:6em 1fr;gap:14px 0}
.af-price dt{font-weight:800;color:var(--fs-navy);font-size:15px}
.af-price dd{font-size:16px}
.af-price strong{font-size:22px;color:var(--fs-navy)}
.af-bases .fs-base{border-top-color:var(--fs-yellow);background:#fff;border:2px solid var(--af-yellow-pale);border-top:6px solid var(--fs-yellow)}

/* よくある質問 */
.af-qas{display:grid;gap:12px;max-width:880px;margin:0 auto}
.af-qa{background:#fff;border-radius:12px;overflow:hidden}
.af-qa summary{list-style:none;cursor:pointer;padding:18px 56px 18px 54px;font-weight:800;color:var(--fs-navy);position:relative;line-height:1.6}
.af-qa summary::-webkit-details-marker{display:none}
.af-qa summary:before{content:"Q";position:absolute;left:18px;top:16px;width:26px;height:26px;border-radius:50%;background:var(--fs-yellow);display:grid;place-items:center;font-size:14px}
.af-qa summary:after{content:"+";position:absolute;right:22px;top:14px;font-size:24px;font-weight:700;transition:transform .2s}
.af-qa[open] summary:after{transform:rotate(45deg)}
.af-qa>div{padding:0 24px 20px 54px;color:var(--fs-sub);font-size:15px}
.af-qa a{text-decoration:underline;color:var(--fs-navy)}

/* 全日制への案内 */
.af-zen{padding:64px 0}
.af-zen .fs-course{max-width:760px;margin:0 auto}
.af-zen .fs-course h3{font-size:22px}

/* 体験（黄色） */
.fs-after .fs-cta .fs-eyebrow:before{background:#fff}
.fs-after .fs-cta{background:var(--fs-yellow)}
.fs-after .fs-cta .fs-btn{background:var(--fs-navy);color:#fff;box-shadow:0 4px 0 #032f3d}

@media(max-width:900px){
  .af-facts,.af-features,.af-voices{grid-template-columns:1fr}
  .af-cards{grid-template-columns:1fr 1fr;gap:12px}
  .af-cards h3{font-size:16px;margin:12px 12px 4px}
  .af-cards p{font-size:13px;margin:0 12px 14px!important}
  .af-flow>li{grid-template-columns:1fr;gap:14px;padding:16px}
  .af-price{padding:22px}
  .af-price dl{grid-template-columns:1fr;gap:4px}
  .af-price dd{margin-bottom:10px}
  .af-qa summary{padding:16px 44px 16px 50px}
  .af-qa>div{padding:0 18px 18px 50px}
  .af-sl{display:none}
}
