/* MKボウル上賀茂 2026共通ヘッダー/フッター。既存のCSSを上書きする専用名前空間 */
:root { --mk-navy:#111e31; --mk-navy2:#192b44; --mk-orange:#f47723; --mk-white:#f9fbfe; --mk-muted:#b4c0d0; }
html { scroll-padding-top:130px; }
body > header.mk-modern-header,body > header.mk-modern-header *,footer.mk-modern-footer,footer.mk-modern-footer * { box-sizing:border-box; }
body > header.mk-modern-header { position:fixed !important; top:0 !important; left:0 !important; right:0 !important; width:100% !important; height:116px !important; margin:0 !important; background:var(--mk-navy) !important; z-index:9999 !important; box-shadow:0 3px 14px rgba(0,0,0,.18) !important; font-family: 'Noto Sans JP','Yu Gothic',Meiryo,sans-serif; }
body > #contents { padding-top:116px !important; margin-top:0 !important; }
body > header.mk-modern-header .mk-topbar { height:65px !important; background:var(--mk-navy) !important; }
body > header.mk-modern-header .mk-topbar-inner { height:100% !important; max-width:1320px; padding:0 22px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:18px; }
body > header.mk-modern-header .mk-brand { height:100%; display:inline-flex !important; align-items:center; gap:13px; text-decoration:none !important; color:#fff !important; flex-shrink:0; }
body > header.mk-modern-header .mk-brand img { width:51px !important; height:51px !important; object-fit:contain; border-radius:8px; background:#fff; display:block; }
body > header.mk-modern-header .mk-brand-copy { display:flex; flex-direction:column; gap:1px; white-space:nowrap; }
body > header.mk-modern-header .mk-brand-copy strong { color:white; font-size:19px; line-height:1.3; letter-spacing:.02em; }
body > header.mk-modern-header .mk-brand-copy small { font-size:10px; color:#aebdd1; letter-spacing:.12em; line-height:1.4; }
body > header.mk-modern-header .mk-top-actions { display:flex; align-items:center; gap:20px; height:100%; }
body > header.mk-modern-header .mk-social { display:flex; align-items:center; gap:9px; }
body > header.mk-modern-header .mk-social a { width:34px; height:34px; display:flex; align-items:center; justify-content:center; border-radius:8px; background:#26374e; transition:background .2s,transform .2s; }
body > header.mk-modern-header .mk-social a:hover { background:#3d5370; transform:translateY(-2px); }
body > header.mk-modern-header .mk-social img { width:27px !important; height:27px !important; object-fit:contain; display:block; }
body > header.mk-modern-header .mk-top-reserve { background:var(--mk-orange) !important; color:#fff !important; border-radius:7px; padding:11px 16px; font-size:13px; font-weight:700; text-decoration:none !important; white-space:nowrap; line-height:1.3; }
body > header.mk-modern-header .mk-top-reserve:hover { background:#e26410 !important; }
body > header.mk-modern-header nav.mk-main-nav { display:block !important; float:none !important; position:relative !important; width:100% !important; height:51px !important; min-height:0 !important; margin:0 !important; padding:0 !important; background:var(--mk-navy2) !important; border-top:1px solid #304056 !important; }
body > header.mk-modern-header #gNav.mk-nav-list { display:flex !important; flex-wrap:nowrap !important; align-items:stretch; justify-content:center; gap:0; max-width:1320px; width:100% !important; height:50px !important; margin:0 auto !important; padding:0 12px !important; float:none !important; position:static !important; background:transparent !important; list-style:none !important; }
body > header.mk-modern-header #gNav.mk-nav-list > li { display:flex !important; width:auto !important; height:50px !important; flex:1 1 auto !important; float:none !important; position:relative !important; margin:0 !important; padding:0 !important; border:0 !important; background:transparent !important; text-align:center; }
body > header.mk-modern-header #gNav.mk-nav-list > li > a { display:flex !important; width:100% !important; height:50px !important; align-items:center; justify-content:center; margin:0 !important; padding:0 12px !important; color:#f9fbff !important; text-decoration:none !important; font-size:13px !important; font-weight:650; border:0 !important; background:transparent !important; white-space:nowrap; line-height:1.4; }
body > header.mk-modern-header #gNav.mk-nav-list > li > a:hover,body > header.mk-modern-header #gNav.mk-nav-list > li:focus-within > a { color:#fff !important; background:#2b4160 !important; box-shadow:inset 0 -3px 0 var(--mk-orange); }
body > header.mk-modern-header .mk-sub-toggle { display:none !important; }
body > header.mk-modern-header .mk-submenu { display:none !important; position:absolute !important; top:100% !important; left:0 !important; width:240px !important; height:auto !important; margin:0 !important; padding:8px 0 !important; background:#182941 !important; box-shadow:0 10px 25px rgba(0,0,0,.26); border-radius:0 0 9px 9px; list-style:none !important; text-align:left; }
body > header.mk-modern-header .mk-dropdown:hover > .mk-submenu,body > header.mk-modern-header .mk-dropdown:focus-within > .mk-submenu { display:block !important; }
body > header.mk-modern-header .mk-submenu li { float:none !important; display:block !important; width:100% !important; height:auto !important; border:0 !important; margin:0 !important; }
body > header.mk-modern-header .mk-submenu a { display:block !important; height:auto !important; padding:12px 18px !important; color:white !important; background:transparent !important; font-size:13px; text-align:left; text-decoration:none; line-height:1.4; }
body > header.mk-modern-header .mk-submenu a:hover { background:#304862 !important; }
body > header.mk-modern-header .mk-menu-toggle { display:none !important; }
/* Footer */
footer.mk-modern-footer { display:block !important; clear:both; background:var(--mk-navy) !important; color:#fff !important; margin:0 !important; padding:0 !important; font-family:'Noto Sans JP','Yu Gothic',Meiryo,sans-serif; width:100% !important; text-align:left !important; }
footer.mk-modern-footer .mk-footer-container { width:min(1200px, calc(100% - 48px)); max-width:1200px; margin:0 auto; }
footer.mk-modern-footer .mk-footer-cta { background:linear-gradient(100deg,#e76312,#fa862c) !important; padding:29px 0 !important; }
footer.mk-modern-footer .mk-footer-cta-inner { display:flex; gap:24px; align-items:center; justify-content:space-between; }
footer.mk-modern-footer .mk-footer-kicker { display:block; color:#fff1e0; letter-spacing:.16em; font-size:11px; font-weight:750; margin-bottom:6px; }
footer.mk-modern-footer .mk-footer-cta h2 { margin:0 0 5px !important; padding:0 !important; border:0 !important; background:none !important; font-size:25px !important; line-height:1.35; font-weight:750; color:#fff !important; }
footer.mk-modern-footer .mk-footer-cta p { margin:0 !important; color:#fffaf4 !important; font-size:13px; line-height:1.6; }
footer.mk-modern-footer .mk-footer-cta-button { display:inline-flex; align-items:center; justify-content:center; gap:10px; background:#fff !important; color:#b64f11 !important; padding:15px 22px; border-radius:8px; font-size:14px; font-weight:750; text-decoration:none !important; white-space:nowrap; }
footer.mk-modern-footer .mk-footer-main { display:grid; grid-template-columns:1.35fr 1fr 1fr 1.2fr; gap:34px; padding-top:52px; padding-bottom:44px; }
footer.mk-modern-footer .mk-footer-intro strong { display:block; font-size:22px; line-height:1.4; color:white; }
footer.mk-modern-footer .mk-footer-intro > span { font-size:10px; letter-spacing:.14em; color:var(--mk-muted); }
footer.mk-modern-footer .mk-footer-intro p { margin:20px 0 16px; color:var(--mk-muted); font-size:13px; }
footer.mk-modern-footer .mk-footer-sns { display:flex; gap:9px; }
footer.mk-modern-footer .mk-footer-sns a { display:flex; align-items:center; justify-content:center; background:#263a53; width:36px; height:36px; border-radius:7px; }
footer.mk-modern-footer .mk-footer-sns img { width:27px !important; height:27px !important; display:block; object-fit:contain; }
footer.mk-modern-footer .mk-footer-column h3 { font-size:15px !important; font-weight:750 !important; margin:0 0 20px !important; padding:0 0 12px !important; background:none !important; border:0 !important; border-bottom:2px solid var(--mk-orange) !important; color:#fff !important; line-height:1.5; }
footer.mk-modern-footer .mk-footer-column ul { list-style:none !important; padding:0 !important; margin:0 !important; }
footer.mk-modern-footer .mk-footer-column li { list-style:none !important; padding:0 !important; margin:0 0 12px !important; line-height:1.5; background:none !important; }
footer.mk-modern-footer .mk-footer-column a,footer.mk-modern-footer .mk-footer-bottom a { color:#bbc8da !important; font-size:13px; text-decoration:none !important; }
footer.mk-modern-footer .mk-footer-column a:hover,footer.mk-modern-footer .mk-footer-bottom a:hover { color:#fff !important; }
footer.mk-modern-footer .mk-footer-bottom { border-top:1px solid #304155; display:flex; justify-content:space-between; gap:12px; padding:20px 0 25px; font-size:11px; color:#91a2ba; }
#gotop { position:fixed !important; right:22px !important; bottom:22px !important; display:none; z-index:9990 !important; width:52px !important; height:52px !important; margin:0 !important; padding:0 !important; }
#gotop a { display:flex !important; flex-direction:column; align-items:center; justify-content:center; width:52px !important; height:52px !important; background:var(--mk-orange) !important; color:#fff !important; text-decoration:none !important; border-radius:13px !important; box-shadow:0 5px 20px rgba(0,0,0,.23); border:0 !important; font-size:22px; line-height:1.1; }
#gotop small { display:block; font-size:9px; font-weight:700; line-height:1.3; }
@media (max-width:900px) {
 html { scroll-padding-top:70px; }
 body > header.mk-modern-header { height:68px !important; }
 body > #contents { padding-top:68px !important; }
 body > header.mk-modern-header .mk-topbar { height:68px !important; }
 body > header.mk-modern-header .mk-topbar-inner { padding:0 13px !important; gap:8px; }
 body > header.mk-modern-header .mk-brand { gap:8px; }
 body > header.mk-modern-header .mk-brand img { width:44px !important; height:44px !important; }
 body > header.mk-modern-header .mk-brand-copy strong { font-size:14px; }
 body > header.mk-modern-header .mk-brand-copy small { font-size:8px; letter-spacing:.06em; }
 body > header.mk-modern-header .mk-top-actions { gap:10px; }
 body > header.mk-modern-header .mk-top-reserve { display:none !important; }
 body > header.mk-modern-header .mk-social { gap:4px; }
 body > header.mk-modern-header .mk-social a { width:31px; height:34px; background:transparent; }
 body > header.mk-modern-header .mk-social img { width:27px !important; height:27px !important; }
 body > header.mk-modern-header .mk-menu-toggle { width:42px !important; height:42px !important; flex:none; display:flex !important; flex-direction:column; gap:5px; align-items:center; justify-content:center; background:#2c3c50 !important; border:1px solid #53647a !important; border-radius:8px !important; margin:0 !important; padding:0 !important; cursor:pointer; }
 body > header.mk-modern-header .mk-menu-toggle span { width:21px; height:2px; display:block; background:#fff; border-radius:3px; }
 body > header.mk-modern-header nav.mk-main-nav { position:static !important; height:0 !important; width:100% !important; border:0 !important; }
 body > header.mk-modern-header #gNav.mk-nav-list { display:none !important; position:absolute !important; top:68px !important; left:0 !important; width:100% !important; height:auto !important; max-height:calc(100dvh - 68px); overflow-y:auto; flex-direction:column !important; padding:10px 15px 20px !important; background:var(--mk-navy2) !important; box-shadow:0 9px 16px rgba(0,0,0,.23); }
 body > header.mk-modern-header #gNav.mk-nav-list.mk-open { display:flex !important; }
 body > header.mk-modern-header #gNav.mk-nav-list > li { display:flex !important; width:100% !important; flex:0 0 auto !important; flex-wrap:wrap; height:auto !important; min-height:49px; border-bottom:1px solid #405069 !important; }
 body > header.mk-modern-header #gNav.mk-nav-list > li > a { width:auto !important; flex:1; justify-content:flex-start; height:49px !important; padding:0 10px !important; font-size:15px !important; }
 body > header.mk-modern-header .mk-sub-toggle { display:block !important; flex:none; width:46px; background:transparent !important; border:0 !important; color:#fff !important; font-size:25px; cursor:pointer; }
 body > header.mk-modern-header .mk-submenu { display:none !important; position:static !important; flex:0 0 100%; width:100% !important; padding:0 0 8px 8px !important; box-shadow:none !important; background:#233951 !important; }
 body > header.mk-modern-header .mk-dropdown:hover > .mk-submenu, body > header.mk-modern-header .mk-dropdown:focus-within > .mk-submenu { display:none !important; }
 body > header.mk-modern-header .mk-dropdown.mk-sub-open > .mk-submenu { display:block !important; }
 footer.mk-modern-footer .mk-footer-main { grid-template-columns:repeat(2,minmax(0,1fr)); gap:35px; }
}
@media (max-width:600px) {
 body > header.mk-modern-header .mk-brand-copy small { display:none; }
 body > header.mk-modern-header .mk-brand-copy strong { font-size:12px; }
 body > header.mk-modern-header .mk-topbar-inner { padding:0 9px !important; }
 body > header.mk-modern-header .mk-top-actions { gap:4px; }
 body > header.mk-modern-header .mk-social { gap:1px; }
 body > header.mk-modern-header .mk-social a { width:29px; }
 body > header.mk-modern-header .mk-social img { width:25px !important; height:25px !important; }
 body > header.mk-modern-header .mk-menu-toggle { width:39px !important; }
 footer.mk-modern-footer .mk-footer-container { width:calc(100% - 36px); }
 footer.mk-modern-footer .mk-footer-cta { padding:26px 0 !important; }
 footer.mk-modern-footer .mk-footer-cta-inner { flex-direction:column; align-items:stretch; gap:18px; }
 footer.mk-modern-footer .mk-footer-cta h2 { font-size:21px !important; }
 footer.mk-modern-footer .mk-footer-cta-button { width:100%; }
 footer.mk-modern-footer .mk-footer-main { grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px 16px; padding-top:34px; padding-bottom:32px; }
 footer.mk-modern-footer .mk-footer-intro { grid-column:1 / -1; }
 footer.mk-modern-footer .mk-footer-column h3 { font-size:13px !important; }
 footer.mk-modern-footer .mk-footer-column a { font-size:12px !important; }
 footer.mk-modern-footer .mk-footer-bottom { flex-direction:column; gap:8px; }
 #gotop { right:12px !important; bottom:12px !important; }
}
@media (max-width:370px) {
 body > header.mk-modern-header .mk-brand-copy { display:none; }
 body > header.mk-modern-header .mk-social a { width:30px; }
}

/* SNS の背景をページ固有のCSSから隔離（ボウリングページの白背景対策） */
body > header.mk-modern-header .mk-topbar .mk-topbar-inner .mk-top-actions,
body > header.mk-modern-header .mk-topbar .mk-topbar-inner .mk-social {
  background:transparent !important;
  background-color:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  outline:0 !important;
}
body > header.mk-modern-header .mk-topbar .mk-topbar-inner .mk-social {
  display:flex !important;
  align-items:center !important;
  margin:0 !important;
  padding:0 !important;
}
body > header.mk-modern-header .mk-topbar .mk-topbar-inner .mk-social > a {
  background:#26374e !important;
  border:0 !important;
  box-shadow:none !important;
  outline:0 !important;
  padding:0 !important;
}
body > header.mk-modern-header .mk-topbar .mk-topbar-inner .mk-social > a:hover,
body > header.mk-modern-header .mk-topbar .mk-topbar-inner .mk-social > a:focus-visible {
  background:#3d5370 !important;
}
body > header.mk-modern-header .mk-topbar .mk-topbar-inner .mk-social > a > img {
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  margin:0 !important;
  padding:0 !important;
}
@media screen and (max-width:700px) {
  body > header.mk-modern-header .mk-topbar .mk-topbar-inner .mk-social > a {
    background:transparent !important;
  }
}
