@charset "utf-8";
/* TOP（/）だけで読む。2026-11-01 本部承認：TOPは今の内容・写真・配置・リンク・動きのまま、CSSを足すだけ。
 * ⚠ 下は zip の home/home-subtle-refinements.css を **1文字も変えずに** 写したもの。
 * ⚠ 読み込むのは pages.json の "/" だけ。.top-ttl-area は /news・/fc などでも使っているので、
 *   他のページの css に足さないこと（見出しが全部変わる）。
 * ⚠ 以前の全面リデザイン案（kid-academy-home.html）は不採用。使わない。
 */
/* TOP第2段階：数字エリアの読みやすさと指定写真の切り取りだけを調整。 */
/* 本番ではTOPページのルートだけに読み込む。画像・文章・数値は変更しない。 */
#top-stats {
  padding-top: clamp(54px, 6vw, 86px) !important;
  padding-bottom: clamp(54px, 6vw, 86px) !important;
}
#top-stats .stats-hd { margin-bottom: 44px !important; }
#top-stats .stats-hd .en {
  font-family: Georgia, "Times New Roman", serif !important;
  font-style: italic;
  font-size: clamp(18px, 2vw, 23px) !important;
  font-weight: 400;
  letter-spacing: 0.06em !important;
  line-height: 1.5;
  color: #c7c4bf !important;
  margin-bottom: 14px;
}
#top-stats .stats-hd h2 {
  font-weight: 500 !important;
  font-size: clamp(23px, 2.8vw, 34px) !important;
  line-height: 1.7 !important;
  letter-spacing: 0.035em !important;
  color: #fff !important;
}
#top-stats .stats-list .num { white-space: nowrap; }
#top-stats .stats-list .n {
  font-weight: 400 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.1 !important;
}
#top-stats .stats-list .u {
  color: #cfccc7 !important;
  margin-left: 7px;
  font-size: 12px;
}
#top-stats .stats-list .lb {
  color: #c0bdb8 !important;
  font-size: 12px !important;
  line-height: 1.9 !important;
  letter-spacing: 0.035em;
  margin-top: 15px !important;
}
#top-stats .stats-list > li + li { border-color: rgba(255,255,255,.18) !important; }

/* 5枚目の参考に合わせ、同じ写真を横長に切り取り、右下の角を大きく丸める。 */
#top-service .biz-list .thumb,
#top-blog .blog-list .thumb,
#top-fc .top-fc-photo {
  aspect-ratio: 1.73 / 1;
  width: 100%;
  height: auto !important;
  overflow: hidden;
  border-radius: 8px 8px clamp(50px, 5vw, 96px) 8px !important;
}
#top-service .biz-list .thumb img,
#top-blog .blog-list .thumb img,
#top-fc .top-fc-photo img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: 1.73 / 1;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: inherit !important;
}
#top-recruit .recruit > img,
#top-recruit .recruit > .thumb,
#top-recruit .recruit-photo,
#top-recruit .recruit-photo img {
  aspect-ratio: 1.73 / 1;
  width: 100%;
  height: auto !important;
  object-fit: cover;
  object-position: center;
  overflow: hidden;
  border-radius: 8px 8px clamp(50px, 5vw, 96px) 8px !important;
}
/* ロゴ・動画・他の画像は対象外。 */
@media (max-width: 767px) {
  #top-stats .stats-hd { margin-bottom: 30px !important; }
  #top-stats .stats-list .lb { font-size: 11px !important; margin-top: 10px !important; }
  #top-stats .stats-list .u { font-size: 11px; margin-left: 4px; }
  #top-service .biz-list .thumb,
  #top-blog .blog-list .thumb,
  #top-fc .top-fc-photo,
  #top-recruit .recruit > img,
  #top-recruit .recruit-photo { border-bottom-right-radius: 60px !important; }
}

/* ── ここから下は zip の外（2026-11-02 追加）──
 * ⚠ 上の #top-stats の padding-bottom（54〜86px）だけだと、次の #top-service のカーブ
 *   （svg：top -30px／561px〜 -50px／1025px〜 -100px・z-index:2・fill:#FAFAFA）が帯の下に覆いかぶさり、
 *   「全国の教室数」「伴走したお子さま」がカーブに塗りつぶされて見切れた（本部指摘）。
 *   上のデザインの余白はそのまま、カーブの高さぶんを足す（top-own.css の 60／80／150px と同じ考え方）。 */
#top-stats { padding-bottom: calc(clamp(54px, 6vw, 86px) + 30px) !important; }
@media (min-width: 561px) { #top-stats { padding-bottom: calc(clamp(54px, 6vw, 86px) + 50px) !important; } }
@media (min-width: 1025px) { #top-stats { padding-bottom: calc(clamp(54px, 6vw, 86px) + 100px) !important; } }
