/* 全ページ共通のヘッダー・スマホ用メニュー・フッター */
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:#fff;color:var(--ink);padding:8px 14px;border-radius:8px}
.skip:focus{left:8px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ヘッダー */
.nav{position:sticky;top:0;z-index:50;background:rgba(247,248,254,.82);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:border-color .3s;padding-top:env(safe-area-inset-top,0px)}
.nav.scrolled,.nav.solid{border-bottom-color:rgba(21,17,110,.10)}
.nav .wrap{display:flex;align-items:center;gap:28px;height:72px;max-width:1240px}
.nav .logo{flex:none}
.nav .logo img{height:26px;width:auto}
.gnav{margin-left:auto}
.gnav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0;font-size:14px;font-weight:500}
.gnav a{position:relative;color:var(--ink)}
.gnav a::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;background:var(--blue);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.gnav a:hover::after,.gnav a.on::after{transform:scaleX(1)}
.gnav a.on{color:var(--blue)}
.nav-cta{flex:none;display:inline-flex;align-items:center;font-weight:700;font-size:13px;padding:10px 20px;border-radius:999px;background:var(--blue);color:#fff;box-shadow:0 10px 26px -12px rgba(7,118,235,.8);transition:transform .25s}
.nav-cta:hover{transform:translateY(-2px)}
.menu-btn{display:none;flex:none;width:44px;height:44px;border:0;border-radius:12px;background:#fff;box-shadow:0 0 0 1px rgba(21,17,110,.10) inset;cursor:pointer;position:relative}
.menu-btn i{position:absolute;left:13px;right:13px;height:2px;border-radius:2px;background:var(--ink);transition:transform .25s, top .25s, opacity .2s}
.menu-btn i:nth-child(1){top:16px}
.menu-btn i:nth-child(2){top:26px}
.nav.open .menu-btn i:nth-child(1){top:21px;transform:rotate(45deg)}
.nav.open .menu-btn i:nth-child(2){top:21px;transform:rotate(-45deg)}
.spmenu{display:none}

@media (max-width: 900px){
  .gnav{display:none}
  .nav .wrap{gap:12px}
  .nav-cta{margin-left:auto;padding:10px 16px}
  .menu-btn{display:block}
  .spmenu{display:block;position:fixed;z-index:49;inset:calc(72px + env(safe-area-inset-top,0px)) 0 0 0;background:var(--paper);overflow-y:auto;padding:12px max(16px, env(safe-area-inset-left,0px)) 40px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .25s, transform .25s, visibility 0s .25s}
  body.menu-open .spmenu{opacity:1;visibility:visible;transform:none;transition:opacity .25s, transform .25s}
  .spmenu ul{list-style:none;margin:0;padding:0}
  .spmenu li a{display:flex;justify-content:space-between;align-items:center;padding:16px 4px;border-bottom:1px solid rgba(21,17,110,.10);font-family:var(--display);font-weight:700;font-size:18px;color:var(--ink)}
  .spmenu li a::after{content:"→";font-family:var(--en);color:var(--blue);font-size:15px}
  .spmenu li.sub a{font-family:var(--body);font-weight:500;font-size:15px;padding-left:18px;color:#2D3352}
  .spmenu .sp-cta{display:flex;justify-content:center;margin-top:24px;padding:16px;border-radius:999px;background:var(--blue);color:#fff;font-weight:700}
  body.menu-open{overflow:hidden}
}

/* フッター */
.site-foot{background:var(--ink);color:#C9D0F0;margin-top:0;font-size:13.5px;padding-bottom:env(safe-area-inset-bottom,0px)}
.site-foot a{color:#fff}
.site-foot a:hover{color:var(--yellow)}
.fgrid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:40px;padding-block:64px 40px;max-width:1240px}
.fbrand img{height:28px;width:auto}
.fbrand .tag{font-family:var(--display);font-weight:700;color:#fff;font-size:16px;line-height:1.6;margin:18px 0 12px}
.fbrand .addr{margin:0;line-height:1.8}
.fcol .fh{font-family:var(--en);font-size:11px;letter-spacing:.18em;color:var(--yellow);font-weight:600;margin:4px 0 14px}
.fcol ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.fbottom{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding-block:22px 32px;border-top:1px solid rgba(255,255,255,.12);max-width:1240px}
.fbottom .sns{display:flex;gap:18px;flex-wrap:wrap}
.fbottom small{font-size:12px;color:#9AA3D0}
@media (max-width: 900px){
  .fgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 20px;padding-block:48px 32px}
  .fbrand{grid-column:1 / -1}
}
@media (prefers-reduced-motion: reduce){
  .gnav a::after,.nav-cta,.spmenu,.menu-btn i{transition:none}
}
