:root { color-scheme: light; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: #e9ece9; }
body {
  margin: 0;
  min-width: 320px;
  padding: 44px 0 72px;
  background:
    linear-gradient(90deg, rgba(255,255,255,.5) 0 1px, transparent 1px 100%),
    #e9ece9;
  color: #0a3159;
}
.map-header {
  position: sticky;
  inset-block-start: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  gap: 24px;
  width: min(calc(100% - 96px), 1120px);
  min-height: 72px;
  margin: -24px auto 24px;
  padding: 10px 16px;
  border: 1px solid #c8d2d8;
  background: rgb(255 255 255 / .96);
  box-shadow: 0 8px 24px rgb(19 38 57 / .09);
  backdrop-filter: blur(10px);
}
.map-brand { display: flex; align-items: center; gap: 12px; min-width: 250px; color: #0a3159; font-size: 12px; font-weight: 700; line-height: 1.45; text-decoration: none; }
.map-brand img { width: 152px; height: auto; }
.map-brand span { padding-inline-start: 12px; border-inline-start: 1px solid #cad2d7; }
.map-nav { display: flex; flex: 1; justify-content: center; gap: 18px; }
.map-nav a { color: #0a3159; font-size: 12px; font-weight: 800; text-decoration: none; white-space: nowrap; }
.map-nav a:hover { color: #087c82; }
.map-jobs, .map-line { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 0 15px; border-radius: 5px; font-size: 12px; font-weight: 800; text-decoration: none; white-space: nowrap; }
.map-jobs { border: 1px solid #0a3159; color: #0a3159; background: #fff; }
.map-line { background: #00b956; color: #031f11; }
@media (max-width: 1000px) {
  .map-header { gap: 8px; }
  .map-nav { display: none; }
  .map-brand { flex: 1; }
}
.skip-link { position: fixed; left: 1rem; top: -4rem; z-index: 30; padding: .75rem 1rem; background: #fff; color: #0a3159; }
.skip-link:focus { top: 1rem; }
.visual-panel {
  position: relative;
  width: min(calc(100% - 96px), 1120px);
  margin: 0 auto;
  overflow: hidden;
  background: #f6f4ee;
  box-shadow: 0 16px 42px rgba(19, 38, 57, .14);
}
.visual-panel + .visual-panel { margin-top: 34px; }
.visual-panel picture, .visual-panel img { display: block; width: 100%; height: auto; }
.hotspot { position: absolute; z-index: 2; display: block; border-radius: 4px; outline-offset: -4px; }
.hotspot:focus-visible { outline: 3px solid #00a95c; }
.hero-map { top: 60%; height: 15%; }
.map-01 { left: 3%; width: 22%; }
.map-02 { left: 27%; width: 22%; }
.map-03 { left: 51%; width: 22%; }
.map-04 { left: 75%; width: 22%; }
.hero-cta { top: 77.5%; height: 12%; }
.hero-primary { left: 3%; width: 46%; }
.hero-secondary { left: 51%; width: 46%; }
.section-cta { left: 3%; top: 86%; width: 94%; height: 11%; }
.service-cta { height: 14%; }
.recruitment-line { left: 5.2%; top: 82.6%; width: 31.6%; }
.recruitment-timerex { left: 38.6%; top: 82.6%; width: 28%; }
.support-diagnosis { left: 3.8%; top: 80.7%; width: 34.7%; }
.support-line { left: 40.2%; top: 80.7%; width: 38.7%; }
.education-line { left: 5.2%; top: 72.7%; width: 44.1%; }
.education-timerex { left: 51.2%; top: 72.7%; width: 43.4%; }
.footer-cta { left: 56%; width: 40%; height: 18%; }
.footer-line { top: 14%; }
.footer-timerex { top: 37%; }
.footer-link { top: 85%; height: 10%; }
.footer-privacy { left: 15%; width: 20%; }
.footer-disclosure { left: 39%; width: 27%; }
.footer-top { left: 72%; width: 18%; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
@media (max-width: 700px) {
  body { padding: 12px 0 30px; }
  .map-header { width: calc(100% - 20px); min-height: 58px; margin: 0 auto 12px; padding: 8px 10px; gap: 8px; }
  .map-brand { min-width: 0; flex: 1; }
  .map-brand img { width: 126px; }
  .map-brand span, .map-nav { display: none; }
  .map-jobs, .map-line { min-height: 38px; padding: 0 9px; font-size: 10px; }
  .visual-panel {
    width: calc(100% - 20px);
    box-shadow: 0 8px 22px rgba(19, 38, 57, .13);
  }
  .visual-panel + .visual-panel { margin-top: 14px; }
  .hero-map { top: 47%; height: 8%; }
  .map-01, .map-02, .map-03, .map-04 { left: 18%; width: 64%; }
  .map-01 { top: 47%; }
  .map-02 { top: 55%; }
  .map-03 { top: 63%; }
  .map-04 { top: 71%; }
  .hero-cta { left: 5%; width: 90%; height: 7%; }
  .hero-primary { top: 84%; }
  .hero-secondary { top: 92%; }
  .section-cta { left: 3%; top: 88%; width: 94%; height: 10%; }
  .service-cta { height: 8%; }
  .recruitment-line { left: 7.1%; top: 83%; width: 85.8%; }
  .recruitment-timerex { left: 7.1%; top: 91.2%; width: 85.8%; height: 7.4%; }
  .support-diagnosis { left: 4.8%; top: 88.3%; width: 43.9%; }
  .support-line { left: 51%; top: 88.3%; width: 44%; }
  .education-line { left: 10.6%; top: 81.2%; width: 78%; height: 7%; }
  .education-timerex { left: 10.6%; top: 89.2%; width: 78%; height: 6.7%; }
  .footer-cta { left: 5%; width: 90%; height: 11%; }
  .footer-line { top: 38%; }
  .footer-timerex { top: 51%; }
  .footer-link { top: 91%; height: 7%; }
  .footer-privacy { left: 4%; width: 30%; }
  .footer-disclosure { left: 35%; width: 38%; }
  .footer-top { left: 74%; width: 23%; }
}
.map-corporate-footer { width: min(calc(100% - 96px), 1120px); margin: 28px auto 0; text-align: center; }
.map-corporate-footer a { color: #33566d; font-size: 13px; font-weight: 700; text-underline-offset: 4px; }
.map-corporate-footer a:hover, .map-corporate-footer a:focus-visible { color: #087c82; }
@media (max-width: 700px) {
  .map-corporate-footer { width: calc(100% - 20px); margin-top: 18px; }
  .map-corporate-footer a { font-size: 12px; }
}
