/* LANGX 共通スタイル（TOP / 学校向けページ）
   ガラスの層そのものは equ-glass.css。ここはベース、ヘッダー、ボタンの状態、フッターなど。
   ブレークポイント：767px 以下をモバイル（参照 390px）、768px 以上をPC（参照 1440px、間は流動）。 */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--eg-paper);
  color: var(--eg-ink);
  font-family: 'Inter', 'Noto Sans JP', 'Hiragino Sans', 'Yu Gothic UI', sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
img, video { max-width: 100%; }
input, textarea, button, select { font: inherit; }
h1, h2, h3, h4 { word-break: auto-phrase; }
a { color: #1F4472; }

/* 文節で折り返す単位 */
.nb { display: inline-block; }
/* ® の上付き */
.reg { font-size: .6em; vertical-align: .6em; line-height: 0; }
.reg-sm { font-size: .65em; vertical-align: .55em; line-height: 0; }

.sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: absolute; left: 16px; top: -100px; z-index: 100;
  padding: 10px 16px; border-radius: 10px; background: var(--eg-navy); color: #fff;
  font-size: 14px; font-weight: 700; text-decoration: none;
}
.skip-link:focus { top: 12px; }

/* フォーカスリング（参照ファイルでは未デザインのため実装側で追加） */
a:focus-visible, button:focus-visible, [tabindex]:focus-visible, summary:focus-visible {
  outline: 3px solid rgba(14, 42, 71, .35); outline-offset: 2px;
}
.on-dark a:focus-visible, .on-dark button:focus-visible { outline-color: rgba(238, 242, 248, .7); }

/* ---------- ボタンの状態（参照の .b-navy / .b-white / .b-ghost / .b-card / .b-link） ---------- */
.b-navy { transition: background 120ms cubic-bezier(.22,.61,.36,1), transform 120ms cubic-bezier(.22,.61,.36,1); }
.b-navy:hover { background: var(--eg-navy-900); }
.b-navy:active { transform: scale(.98); }
.b-white { transition: background 120ms cubic-bezier(.22,.61,.36,1); }
.b-white:hover { background: var(--eg-navy-050) !important; }
.b-ghost { transition: background 120ms cubic-bezier(.22,.61,.36,1); }
.b-ghost:hover { background: var(--eg-navy-050); }
.b-card { transition: box-shadow 220ms cubic-bezier(.22,.61,.36,1), transform 220ms cubic-bezier(.22,.61,.36,1); }
a.b-card:hover { box-shadow: 0 20px 40px -12px rgba(14,42,71,.16), 0 4px 8px rgba(14,42,71,.04); transform: translateY(-2px); }
.b-link:hover { text-decoration: underline; }

/* ---------- ヘッダー ---------- */
.site-header {
  height: 72px; padding: 0 40px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.site-header__logo { display: flex; align-items: center; min-height: 44px; }
.site-header__logo img { display: block; height: 18px; width: auto; }
.site-header__nav { display: flex; align-items: center; gap: 8px; }
.hbtn {
  display: inline-flex; align-items: center; min-height: 44px; border-radius: 10px;
  font-size: 14px; text-decoration: none; white-space: nowrap;
}
.hbtn--ghost { padding: 0 16px; font-weight: 500; color: var(--eg-navy); }
.hbtn--primary { padding: 0 20px; font-weight: 700; }
.menu-toggle {
  display: none; align-items: center; justify-content: center;
  width: 44px; height: 44px; padding: 0; border: 0; border-radius: 10px;
  background: transparent; color: var(--eg-navy); cursor: pointer;
}
.menu-toggle .icon-close { display: none; }
.menu-toggle[aria-expanded="true"] .icon-open { display: none; }
.menu-toggle[aria-expanded="true"] .icon-close { display: block; }

/* ---------- 矢印アイコン ---------- */
.ico { flex: none; display: block; }

/* ---------- フッター ---------- */
.site-footer { border-top: 1px solid #E5E7EB; padding: 48px 40px 56px; background: #FFFFFF; }
.site-footer__inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px 48px;
}
.site-footer__logo { display: inline-flex; align-items: center; min-height: 44px; }
.site-footer__logo img { display: block; height: 24px; width: auto; }
.site-footer__nav { display: flex; flex-wrap: wrap; gap: 4px 28px; font-size: 14px; }
.site-footer__nav a { display: inline-flex; align-items: center; min-height: 44px; color: #374151; text-decoration: none; }
.site-footer__note { margin: 24px auto 0; max-width: 1200px; font-size: 12px; line-height: 1.8; color: #64748B; }

@media (max-width: 767px) {
  .site-footer { padding: 40px 16px 48px; }
  .site-footer__inner { flex-direction: column; align-items: flex-start; gap: 16px; }
  .site-footer__logo img { height: 20px; }
  .site-footer__nav { gap: 4px 24px; }
  .site-footer__note { margin-top: 24px; }
}

@media print {
  .eg-header { position: static !important; }
  [data-noprint] { display: none !important; }
}