/* ═══════════════════════════════════════
   徳増卓球クラブ 共通スタイル
   全ページ共通（ナビ・フッター・ベース）
═══════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --navy:   #1a2640;
  --navy-d: #111b2e;
  --blue:   #1a60d0;
  --blue-l: #3a80f0;
  --sky:    #e8f0fd;
  --gold:   #e8a020;
  --cream:  #f7f9fc;
  --white:  #ffffff;
  --ink:    #1a2640;
  --mid:    #4a5d72;
  --lt:     #8da0b5;
  --line:   #dde4ef;
  --ff:     'Noto Sans JP','Zen Maru Gothic',sans-serif;
  --ff2:    'Zen Maru Gothic','Noto Sans JP',sans-serif;
  --max:    1100px;
  --r:      14px;
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--ff);
  background:var(--cream);
  color:var(--ink);
  font-size:16px;
  line-height:1.85;
  overflow-x:hidden;
  font-weight:400;
}
p{max-width:600px;margin-left:auto;margin-right:auto}
h1,h2,h3,h4{font-family:var(--ff2);line-height:1.4;letter-spacing:.02em;font-weight:900}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

/* ── STICKY BOTTOM CTA ── */
.s-cta{
  display:none;
  position:fixed;bottom:0;left:0;right:0;z-index:500;
  background:rgba(26,38,64,.97);
  padding:12px 16px 16px;
  box-shadow:0 -4px 24px rgba(0,0,0,.2);
}
.s-cta.show{display:block}
.s-cta a{
  display:block;
  background:var(--blue);color:var(--white);
  text-align:center;padding:14px;border-radius:50px;
  font-weight:700;font-size:15px;letter-spacing:.04em;
}

/* ── NAV ── */
#gnav{
  position:fixed;top:0;left:0;right:0;z-index:300;
  background:rgba(255,255,255,.97);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
  height:60px;padding:0 20px;
  display:flex;align-items:center;justify-content:space-between;
}
.gnav-logo img{height:30px;width:auto}
.gnav-links{display:flex;align-items:center;gap:2px}
.gnav-links a{
  font-size:13px;font-weight:700;color:var(--mid);
  padding:7px 10px;border-radius:8px;
  transition:background .15s,color .15s;white-space:nowrap;
}
.gnav-links a:hover,.gnav-links a.active{background:var(--sky);color:var(--blue)}
.gnav-cta{
  background:var(--blue);color:var(--white) !important;
  font-weight:700;font-size:13px;
  padding:9px 16px;border-radius:50px;margin-left:4px;
  white-space:nowrap;transition:background .15s;
}
.gnav-cta:hover{background:var(--blue-l) !important}
/* ハンバーガー */
.gnav-ham{
  display:none;flex-direction:column;gap:5px;
  width:36px;height:36px;align-items:center;justify-content:center;
  cursor:pointer;border:none;background:none;
}
.gnav-ham span{display:block;width:22px;height:2px;background:var(--ink);border-radius:2px;transition:.2s}
.gnav-ham.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.gnav-ham.open span:nth-child(2){opacity:0}
.gnav-ham.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
/* モバイルドロワー */
.gnav-drawer{
  display:none;
  position:fixed;top:60px;left:0;right:0;bottom:0;z-index:290;
  background:rgba(255,255,255,.98);
  flex-direction:column;
  padding:24px 24px 40px;
  gap:4px;overflow-y:auto;
}
.gnav-drawer.open{display:flex}
.gnav-drawer a{
  font-size:16px;font-weight:700;color:var(--ink);
  padding:14px 0;border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:8px;
}
.gnav-drawer a:last-child{border-bottom:none}
.gnav-drawer .d-cta{
  margin-top:12px;
  background:var(--blue);color:var(--white) !important;
  text-align:center;padding:16px;border-radius:50px;
  border-bottom:none;justify-content:center;
  font-size:16px;
}
@media(max-width:740px){
  .gnav-links{display:none}
  .gnav-ham{display:flex}
}

/* ── SECTION BASE ── */
section{padding:72px 20px}
.container{max-width:var(--max);margin:0 auto}
.sec-head{text-align:center;margin-bottom:48px}
.eyebrow{
  display:inline-block;
  background:var(--sky);color:var(--blue);
  font-weight:700;font-size:11px;letter-spacing:.14em;
  padding:5px 16px;border-radius:99px;margin-bottom:14px;
}
.sec-title{
  font-size:clamp(22px,5vw,34px);
  font-weight:900;color:var(--ink);line-height:1.45;margin-bottom:8px;
}
.sec-title .em{color:var(--blue)}
.sec-lead{font-size:15px;color:var(--mid);line-height:1.9;max-width:480px;margin:0 auto}

/* ── PAGE HERO (内部ページ用) ── */
.page-hero{
  background:var(--navy);
  padding:90px 20px 40px;
  text-align:center;
}
.page-hero h1{
  font-size:clamp(20px,5vw,32px);
  font-weight:900;color:var(--white);margin-bottom:10px;
}
.breadcrumb{
  font-size:13px;color:rgba(255,255,255,.5);
  display:flex;align-items:center;justify-content:center;gap:6px;
}
.breadcrumb a{color:rgba(255,255,255,.6);transition:color .15s}
.breadcrumb a:hover{color:var(--white)}
.breadcrumb span{color:rgba(255,255,255,.4)}

/* ── BUTTONS ── */
.btn-main{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:var(--blue);color:var(--white);
  font-weight:700;font-size:16px;
  padding:16px 36px;border-radius:50px;
  letter-spacing:.04em;
  box-shadow:0 4px 20px rgba(26,96,208,.35);
  transition:background .15s,transform .12s;
}
.btn-main:hover{background:var(--blue-l);transform:translateY(-2px)}
.btn-line{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:#06C755;color:var(--white);
  font-weight:700;font-size:15px;
  padding:14px 32px;border-radius:50px;
  transition:background .15s,transform .12s;
}
.btn-line:hover{background:#00A040;transform:translateY(-2px)}

/* ── BIG CTA SECTION ── */
.bigcta{
  background:linear-gradient(135deg,var(--navy) 0%,var(--blue) 100%);
  text-align:center;padding:72px 20px;position:relative;overflow:hidden;
}
.bigcta::before{
  content:'';position:absolute;
  width:400px;height:400px;border-radius:50%;
  background:rgba(255,255,255,.05);top:-100px;right:-100px;
}
.bigcta-inner{position:relative;z-index:1;max-width:520px;margin:0 auto}
.bigcta h2{
  font-size:clamp(20px,5vw,34px);
  font-weight:900;color:var(--white);line-height:1.45;margin-bottom:12px;
}
.bigcta p{
  color:rgba(255,255,255,.8);font-size:15px;
  margin-bottom:32px;line-height:1.9;max-width:none;
}
.btn-cta{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:var(--white);color:var(--blue);
  font-weight:900;font-size:17px;font-family:var(--ff2);
  padding:18px 44px;border-radius:50px;
  box-shadow:0 6px 24px rgba(0,0,0,.2);
  transition:transform .12s,box-shadow .12s;
  letter-spacing:.04em;
}
.btn-cta:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(0,0,0,.25)}
.cta-note{
  margin-top:20px;
  display:flex;justify-content:center;gap:20px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.5);
}
.cta-note span{display:flex;align-items:center;gap:4px}

/* ── FOOTER ── */
footer{
  background:var(--navy-d);
  color:rgba(255,255,255,.55);
  padding:48px 20px 24px;
}
.foot-inner{max-width:var(--max);margin:0 auto;display:grid;gap:32px}
.foot-logo img{height:26px;filter:brightness(0) invert(1) opacity(.7);margin-bottom:12px}
.foot-desc{font-size:13px;line-height:1.8;max-width:none}
.foot-links{display:flex;flex-wrap:wrap;gap:6px 20px;margin-top:4px}
.foot-links a{font-size:13px;color:rgba(255,255,255,.5);transition:color .15s}
.foot-links a:hover{color:rgba(255,255,255,.9)}
.foot-contact{display:flex;flex-direction:column;gap:6px}
.foot-contact a{font-size:14px;font-weight:700;color:rgba(255,255,255,.6);transition:color .15s}
.foot-contact a:hover{color:var(--white)}
.foot-col-head{font-size:12px;font-weight:700;color:rgba(255,255,255,.35);margin-bottom:12px;letter-spacing:.1em}
.foot-btm{
  border-top:1px solid rgba(255,255,255,.08);
  margin-top:32px;padding-top:16px;
  text-align:center;font-size:12px;
}
@media(min-width:700px){
  .foot-inner{grid-template-columns:2fr 1fr 1fr}
}
@media(min-width:720px){
  section{padding:96px 24px}
}

/* ── REVEAL ANIMATION ── */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .5s ease}
.reveal.in{opacity:1;transform:none}

/* ── MOBILE BOTTOM NAV (モバイル固定下ナビ) ── */
.mob-nav{
  display:none;
  position:fixed;bottom:0;left:0;right:0;z-index:400;
  background:var(--white);
  border-top:1px solid var(--line);
  display:flex;
  padding-bottom:env(safe-area-inset-bottom,0);
}
.mob-nav a{
  flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;
  padding:10px 4px 8px;font-size:10px;font-weight:700;color:var(--mid);
  transition:color .15s;
}
.mob-nav a:hover,.mob-nav a.active{color:var(--blue)}
.mob-nav .icon{font-size:18px;line-height:1}
.mob-nav .tel-link{color:var(--blue)}
.mob-nav .cta-link{color:var(--white);background:var(--blue);border-radius:8px;margin:4px 4px 0;flex:1.2}
@media(min-width:741px){.mob-nav{display:none !important}}

/* SHARED JS SNIPPET */