/* =====================================================
   QOL v7 — Responsive
   Mobile-first思想。各ブレークポイントで "縮小" ではなく
   "別設計" として体験を組み直す。
===================================================== */

/* =====================================================
   TABLET ≤ 1024px
===================================================== */
@media (max-width: 1024px) {
  :root {
    --wrap-pad: clamp(1.6rem, 3vw, 2.4rem);
    --section-y: 8rem;
  }

  /* Header */
  .site-header__nav { display: none; }
  .site-header__cta { display: none; }
  .site-header__burger { display: flex; }

  /* Hero */
  .hero { padding: 10rem 0 8rem; min-height: auto; }
  .hero__meta {
    position: static;
    padding: 0 var(--wrap-pad);
    margin-top: 2rem;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 1.6rem;
  }
  .hero__copy { margin-top: 4rem; }
  .hero__h1-l2 { padding-left: 1em; }
  .hero__h1-l3 { padding-left: 2em; }
  .hero__services { position: static; margin: 4rem var(--wrap-pad) 0; max-width: 100%; }
  .hero__scroll { display: none; }

  /* Mission */
  .mission__grid { grid-template-columns: 1fr; gap: 4rem; }
  .mission__right { grid-template-columns: repeat(3, 1fr); }
  .mission__right .stat:last-child { grid-column: auto; }

  /* About */
  .about__grid { grid-template-columns: 1fr; gap: 4rem; }
  .awards__grid { grid-template-columns: 1fr; }

  /* Kids */
  .school-grid { grid-template-columns: repeat(2, 1fr); }
  .school:nth-child(3) { grid-column: 1 / -1; max-width: 42rem; }
  .school--offset { margin-top: 4rem; }
  .kids-video { grid-template-columns: 1fr; gap: 2rem; }
  .kids-video__caption { padding-left: 0; }

  /* Clinic */
  .clinic__grid { grid-template-columns: 1fr; gap: 3rem; }
  .clinic__hero { position: relative; top: auto; aspect-ratio: 16 / 10; }
  .chapter__head--kids,
  .chapter__head--kitchen {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .chapter__brand {
    align-items: flex-start;
    border-left: none;
    border-top: 1px solid var(--ink-12);
    padding-top: 1.6rem;
    padding-left: 0;
    flex-direction: row;
    gap: 1.6rem;
    align-items: baseline;
  }

  /* Kitchen */
  .bento-grid { grid-template-columns: 1fr; gap: 3rem; }
  .bento--offset { margin-top: 0; }
  .kitchen-map { grid-template-columns: 1fr; gap: 1.6rem; }

  /* Town */
  .town__grid { grid-template-columns: minmax(0, 1fr); gap: 3rem; }
  .town__aside { position: relative; top: auto; }

  /* Careers */
  .bonus {
    grid-template-columns: 1fr;
    gap: 2rem;
    padding: 2.8rem;
  }
  .bonus__label { border-right: none; border-bottom: 1px solid var(--white-12); padding-right: 0; padding-bottom: 2rem; }
  .flow { grid-template-columns: repeat(2, 1fr); }
  .flow__step:nth-child(2) { border-right: none; }
  .flow__step:nth-child(1),
  .flow__step:nth-child(2) { border-bottom: 1px solid var(--white-12); }
  .flow__step::after { display: none; }
  .cond-grid { grid-template-columns: repeat(2, 1fr); }
  .voices { grid-template-columns: repeat(2, 1fr); }
  .voice:nth-child(3) { grid-column: 1 / -1; max-width: 48rem; margin: 0 auto; }
  .voice--offset { margin-top: 0; }

  /* Contact */
  .contact__grid { grid-template-columns: 1fr; gap: 2rem; }

  /* Footer */
  .site-footer__grid { grid-template-columns: 1fr 1fr; }
  .site-footer__brand { grid-column: 1 / -1; }
}

/* =====================================================
   MOBILE ≤ 640px
===================================================== */
@media (max-width: 640px) {
  :root {
    --wrap-pad: 1.8rem;
    --section-y: 6rem;
  }

  /* Header */
  .site-header { height: 6rem; padding: 0 1.6rem; }
  .site-header__logo-en { font-size: 1.65rem; }
  .site-header__logo-ja { font-size: .9rem; }

  /* Hero — 縮小・折り返しではなく再構成 */
  .hero { padding: 8rem 0 5rem; }
  .hero__mega-line--1,
  .hero__mega-line--3 {
    font-size: clamp(5rem, 20vw, 10rem);
  }
  .hero__mega-line--2 {
    font-size: clamp(2rem, 8vw, 4rem);
  }
  .hero__meta {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-top: 1rem;
  }
  .hero__meta-item {
    padding-left: .8rem;
    gap: .1rem;
  }
  .hero__meta-label { font-size: .9rem; }
  .hero__meta-val { font-size: 1.15rem; }
  .hero__copy { margin-top: 3rem; }
  .hero__eyebrow { font-size: 1.05rem; margin-bottom: 1.6rem; }
  .hero__eyebrow-line { width: 3rem; }
  .hero__h1 {
    font-size: clamp(2.8rem, 9vw, 4.4rem);
    max-width: none;
    margin-bottom: 2rem;
  }
  .hero__h1-l2, .hero__h1-l3 { padding-left: 0; }
  .hero__sub {
    font-size: 1.35rem;
    line-height: 1.95;
    margin-bottom: 2.4rem;
  }
  .hero__sub br { display: none; }
  .hero__actions {
    flex-direction: column;
    gap: 1rem;
  }
  .hero__actions .btn { width: 100%; }
  .hero__services { margin-top: 3.2rem; }
  .hero__services-list a { grid-template-columns: 2.4rem 1fr; }
  .hero__services-list span { font-size: 1.25rem; }
  .hero__services-list small { font-size: 1rem; }

  /* Mission */
  .mission { padding: 4.8rem 0; }
  .mission__ambient { font-size: 20rem; opacity: .6; }
  .mission__phrase {
    font-size: 1.7rem;
    line-height: 1.9;
  }
  .mission__note { font-size: 1.25rem; padding-left: 3rem; }
  .mission__right {
    grid-template-columns: 1fr;
    border-left: none;
    border-top: 1px solid var(--ink-12);
  }
  .stat {
    padding: 1.8rem 1.4rem;
    border-right: none;
  }
  .stat__num { font-size: 3.2rem; }

  /* Chapter */
  .chapter__anchor {
    position: relative;
    top: auto;
    left: auto;
    padding: 0 var(--wrap-pad);
    margin-bottom: 1rem;
    color: var(--ink-30);
  }
  .chapter__anchor-num {
    font-size: clamp(5rem, 18vw, 8rem);
  }
  .chapter__anchor-en { font-size: 1.8rem; }
  .chapter__title {
    font-size: clamp(2.4rem, 7.5vw, 3.6rem);
    line-height: 1.35;
  }
  .chapter__title br { display: none; }
  .chapter__sub { font-size: 1.35rem; line-height: 1.9; }
  .chapter__sub br { display: none; }
  .chapter__brand { min-width: unset; }

  /* Fact table */
  .fact-table th {
    width: 8rem;
    font-size: .95rem;
    padding: 1.2rem .8rem 1.2rem 0;
  }
  .fact-table td {
    font-size: 1.3rem;
    padding: 1.2rem 0;
  }

  /* Timeline */
  .timeline { padding-left: 1.6rem; }
  .timeline__row {
    grid-template-columns: 1fr;
    gap: .3rem;
    padding-left: 1.2rem;
    padding-bottom: 2rem;
  }
  .timeline__row::before { left: -2.1rem; }
  .timeline__year { font-size: 1.2rem; }
  .timeline__text { font-size: 1.3rem; line-height: 1.7; }

  /* Awards */
  .award {
    grid-template-columns: 1fr;
    gap: 1.6rem;
    padding: 2rem 1.6rem;
  }
  .award__badge { width: 12rem; margin: 0 auto; }
  .award__title { font-size: 1.6rem; }
  .award__desc { font-size: 1.25rem; line-height: 1.8; }

  /* Kids */
  .school-grid { grid-template-columns: 1fr; gap: 3.2rem; }
  .school:nth-child(3) { max-width: none; }
  .school--offset { margin-top: 0; }
  .school__img { aspect-ratio: 5 / 4; }
  .school__name { font-size: 1.9rem; }
  .school__desc { font-size: 1.3rem; }
  .kids-video__title { font-size: 1.7rem; }
  .kids-video__caption { font-size: 1.25rem; }

  /* Clinic */
  .clinic__hero-price {
    right: 1rem; bottom: 1rem;
    padding: 1.4rem 1.6rem;
    min-width: 18rem;
  }
  .clinic__hero-price-num { font-size: 3rem; }
  .feature-list li {
    grid-template-columns: 3rem 1fr;
    gap: 1.2rem;
    padding: 1.4rem 0;
  }
  .feature-list__num { font-size: 1.7rem; }
  .feature-list__text { font-size: 1.3rem; line-height: 1.8; }
  .clinic__target { padding: 1.6rem; }
  .clinic__target li { font-size: 1.25rem; padding-left: 1.2rem; }

  /* Kitchen */
  .bento__name { font-size: 2rem; }
  .bento__price { font-size: 2rem; }
  .bento__desc { font-size: 1.3rem; }
  .kitchen-map { padding: 1.6rem; }
  .kitchen-map iframe { height: 20rem; }

  /* Town */
  .town-card, .town-home, .town__aside {
    padding: 2rem 1.6rem;
  }
  .town-card__title, .town-home__name, .aside-title {
    font-size: 1.7rem;
  }
  .town-home__name em { font-size: 1.6em; }
  .fee-row {
    grid-template-columns: 1fr auto;
    gap: .6rem 1rem;
  }
  .fee-row__note {
    grid-column: 1 / -1;
    font-size: 1rem;
    color: var(--ink-50);
    padding-left: .5rem;
  }
  .fee-row__val { font-size: 1.6rem; }
  .fee-total {
    flex-direction: column;
    align-items: flex-start;
    gap: .4rem;
    padding: 1.4rem 1.6rem;
  }
  .fee-total__val { font-size: 2.4rem; }
  .town-home__gallery { grid-template-columns: repeat(2, 1fr); }
  .town-home__gallery img:nth-child(3) { grid-column: 1 / -1; aspect-ratio: 2 / 1; }
  .cond-list li { font-size: 1.25rem; padding-left: 2.6rem; }
  .town__map { height: 18rem; }

  /* Careers */
  .rec-slider { height: 18rem; }
  .rec-slider__track img { width: 18rem; height: 18rem; }
  /* recSlide の移動距離は main.js が画像サイズ変更後に再計算するため、
     ここでの @keyframes 上書きは不要（かつ枚数変更に弱いため削除） */
  .bonus { padding: 2rem 1.6rem; }
  .bonus__amount-num { font-size: 5rem; }
  .bonus__amount-yen { font-size: 2.4rem; }
  .bonus__label-ja { font-size: 1.4rem; }
  .bonus__desc p { font-size: 1.2rem; }

  .flow { grid-template-columns: 1fr; }
  .flow__step {
    border-right: none;
    border-bottom: 1px solid var(--white-12);
    padding: 2rem 1.6rem;
  }
  .flow__step:last-child { border-bottom: none; }
  .flow__num { font-size: 2.8rem; margin-bottom: 1rem; }
  .flow__title { font-size: 1.4rem; }
  .flow__desc { font-size: 1.15rem; }

  .cond-grid { grid-template-columns: repeat(2, 1fr); }
  .cond { padding: 1.6rem 1.2rem; }
  .cond__val { font-size: 1.5rem; }
  .cond__note { font-size: 1.05rem; }

  .voices { grid-template-columns: 1fr; gap: 1.6rem; }
  .voice { padding: 2rem 1.6rem; }
  .voice__q { font-size: 1.25rem; line-height: 1.8; }
  .voice:nth-child(3) { max-width: none; }

  .rec-block__title { font-size: 1.8rem; }

  /* Contact */
  .contact-box { padding: 2rem 1.6rem; }
  .contact-box__title { font-size: 2rem; }
  .contact-box__desc { font-size: 1.25rem; }
  .tel-block { padding: 1.4rem 1.6rem; }
  .tel-block__num { font-size: 2.6rem; }
  .fr input, .fr select, .fr textarea {
    font-size: 1.6rem; /* iOS zoom防止 */
    padding: 1rem 1.1rem;
  }

  /* Footer */
  .site-footer { padding: 5rem 0 3rem; }
  .site-footer__mega { font-size: clamp(5rem, 20vw, 10rem); margin-bottom: 3rem; }
  .site-footer__grid {
    grid-template-columns: 1fr;
    gap: 3rem;
  }
  .site-footer__name { font-size: 1.5rem; }
  .site-footer__addr { font-size: 1.2rem; }
  .site-footer__links a { font-size: 1.25rem; }
  .site-footer__base { flex-direction: column; gap: .8rem; align-items: flex-start; }
  .site-footer__copy, .site-footer__tag { font-size: .95rem; }
}

/* =====================================================
   Small mobile ≤ 380px
===================================================== */
@media (max-width: 380px) {
  :root { --wrap-pad: 1.4rem; }
  .hero__h1 { font-size: 2.6rem; }
  .chapter__title { font-size: 2.2rem; }
  .stat__num { font-size: 2.8rem; }
  .cond-grid { grid-template-columns: 1fr; }
  .tel-block__num { font-size: 2.2rem; }
  .bonus__amount-num { font-size: 4.4rem; }
}
