/* ============================================================
   responsive.css  —  レスポンシブ上書き
   最後に読み込まれ、モバイル（≤768px）で先行レイヤーの
   レイアウトを上書きする。このファイルがカスケードの末尾。
   ============================================================ */

/* モバイル表示（幅768px以下）の調整 */
@media (max-width: 768px) {
  /* ヘッダー：補助リンク帯とナビリンクを隠す */
  .header-top {
    display: none;
  }

  nav {
    padding: 0 20px;
  }

  .nav-links {
    display: none;
  }

  .hamburger {
    display: flex;
  }

  /* ヒーロー：固定ヘッダー高に合わせて余白と文字を縮小 */
  .hero {
    margin-top: 65px;
  }

  .hero-content {
    padding: 0 24px;
  }

  .hero h1 {
    font-size: 28px;
  }

  /* 各セクションの左右パディングを縮小 */
  .philosophy,
  .business,
  .message-section,
  .company-section,
  .history,
  .brands,
  .school-banner,
  .contact-cta {
    padding: 60px 20px;
  }

  /* 多カラムグリッドを1カラムへ */
  .mvv-grid,
  .business-grid,
  .brand-grid,
  .footer-top {
    grid-template-columns: 1fr;
  }

  /* 代表挨拶を縦積みに */
  .message-inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  /* スクールバナーの内側余白を調整 */
  .school-content {
    padding: 0 24px;
  }

  .school-title {
    font-size: 22px;
  }

  /* タイムラインのガイド線位置と年表示幅を縮小 */
  .timeline::before {
    left: 60px;
  }

  .tl-year {
    width: 60px;
    font-size: 12px;
  }

  /* フローティング CTA を小さく寄せる */
  .float-cta {
    bottom: 16px;
    right: 16px;
  }

  .float-btn {
    min-width: 110px;
    font-size: 10px;
  }

  /* フッターを1カラムに */
  .footer-top {
    grid-template-columns: 1fr;
  }

  /* スクールバナーの高さを内容依存に */
  .school-banner {
    height: auto;
    padding: 60px 24px;
  }
}