/* v2-shell.css — 안쪽 페이지용 v2 헤더·드로어·푸터. 기존 style.css와 충돌하지 않게 전부 .gh / .drawer / .gf 범위 안에서만 적용 */
@import url("/fonts/pretendard/pretendardvariable-dynamic-subset.css");

.gh,.drawer,.gf{--v-ink:#0b1220;--v-ink-2:#2b3441;--v-muted:#5b6573;--v-muted-2:#8a93a0;--v-line:#e4e7ec;--v-line-2:#d3d8df;--v-bg-2:#f6f7f9;--v-brand:#0a9b6f;--v-brand-ink:#067552;--v-brand-soft:#e8f6f0;--v-ease:cubic-bezier(.22,.61,.36,1);--v-gutter:24px;
  font-family:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR",sans-serif;letter-spacing:-.01em;word-break:keep-all;box-sizing:border-box}
.gh *,.drawer *,.gf *{box-sizing:border-box}
.gh a,.drawer a,.gf a{color:inherit;text-decoration:none}
.gh ul,.gf ul{margin:0;padding:0;list-style:none}
.gh .wrap,.gf .wrap{width:100%;max-width:1248px;margin:0 auto;padding-inline:var(--v-gutter)}
.gh .ico,.drawer .ico{width:24px;height:24px;flex:none;display:block}

/* header */
.gh{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.88);backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--v-line);color:var(--v-ink)}
.gh-in{display:flex;align-items:center;gap:32px;height:68px}
.gh .logo,.gf .logo{display:inline-flex;align-items:center;gap:9px;font-weight:780;font-size:21px;letter-spacing:-.04em;color:var(--v-ink)}
.gh .logo img,.gf .logo img{height:26px;width:auto;display:block}
.gnav{display:flex;align-items:center;gap:4px;margin-left:12px}
.gnav>li{position:relative}
.gnav>li>a,.gnav>li>button{display:inline-flex;align-items:center;gap:4px;height:40px;padding:0 14px;border-radius:10px;border:0;background:none;font:inherit;font-size:15.5px;font-weight:600;color:var(--v-ink-2);cursor:pointer}
.gnav>li>a:hover,.gnav>li>button:hover,.gnav>li>a[aria-current="page"]{color:var(--v-ink);background:var(--v-bg-2)}
.gnav>li>button::after{content:"";width:6px;height:6px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:translateY(-2px) rotate(45deg);margin-left:4px;opacity:.6}
.gh-cta{flex:none;margin-left:auto;display:flex;align-items:center;gap:10px}
.gh-tel{white-space:nowrap;font-size:15px;font-weight:650;color:var(--v-ink-2);padding:0 8px;font-variant-numeric:tabular-nums}
.gh-burger{display:none;width:44px;height:44px;border:0;background:none;align-items:center;justify-content:center;border-radius:10px;color:var(--v-ink);cursor:pointer}
.mega{position:absolute;left:-12px;top:calc(100% + 10px);width:720px;padding:14px;background:#fff;border:1px solid var(--v-line);border-radius:16px;box-shadow:0 12px 32px -12px rgba(11,18,32,.16),0 2px 6px rgba(11,18,32,.04);display:grid;grid-template-columns:1fr 1fr;gap:4px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .18s var(--v-ease),transform .18s var(--v-ease),visibility .18s}
.mega::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.gnav>li:hover .mega,.gnav>li:focus-within .mega,.gnav>li.open .mega{opacity:1;visibility:visible;transform:none}
.mega a{display:flex;gap:14px;padding:11px 12px;border-radius:12px}
.mega .mg{display:flex;flex-direction:column;padding:6px 4px}
.mega .mg-h{font-size:12.5px;font-weight:750;color:var(--v-brand-ink,#067552);letter-spacing:.02em;padding:4px 12px 6px}
.mega a:hover{background:var(--v-bg-2)}
.mega .mi{width:40px;height:40px;border-radius:10px;background:var(--v-brand-soft);color:var(--v-brand-ink);display:grid;place-items:center;flex:none}
.mega b{display:block;font-size:15px;font-weight:680;color:var(--v-ink);line-height:1.4}
.mega small{display:block;font-size:13px;color:var(--v-muted);line-height:1.5;margin-top:2px}
.gh .btn,.drawer .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 16px;border-radius:10px;border:1px solid transparent;font:inherit;font-size:15px;font-weight:650;white-space:nowrap;cursor:pointer;transition:background .2s,border-color .2s}
.gh .btn-primary,.drawer .btn-primary{background:var(--v-ink);color:#fff}
.gh .btn-primary:hover,.drawer .btn-primary:hover{background:#1f2937}
.drawer .btn-line{background:#fff;border-color:var(--v-line-2);color:var(--v-ink);height:50px}
.drawer .btn-primary{height:50px}

/* drawer */
.drawer{position:fixed;inset:68px 0 0 0;z-index:999;background:#fff;color:var(--v-ink);padding:12px var(--v-gutter) calc(32px + env(safe-area-inset-bottom,0px));overflow:auto;display:none}
.drawer.open{display:block}
.drawer .dg{padding:16px 0;border-bottom:1px solid var(--v-line)}
.drawer .dg>b{display:block;font-size:13px;color:var(--v-muted-2);font-weight:650;margin-bottom:6px}
.drawer .dg a{display:flex;align-items:center;justify-content:space-between;padding:12px 0;font-size:17px;font-weight:650}
.drawer .dcta{display:grid;gap:10px;margin-top:24px}
body.drawer-open{overflow:hidden}

/* footer */
.gf{background:var(--v-bg-2);border-top:1px solid var(--v-line);padding:72px 0 40px;font-size:14.5px;line-height:1.7;color:var(--v-muted);margin-top:0}
.gf-top{display:grid;grid-template-columns:1.4fr repeat(4,minmax(0,1fr));gap:32px;padding-bottom:48px;border-bottom:1px solid var(--v-line)}
.gf-brand p{margin:16px 0 0;max-width:300px;line-height:1.65}
.gf nav b{display:block;color:var(--v-ink);font-size:14.5px;font-weight:700;margin-bottom:14px}
.gf nav a{display:block;padding:5px 0}
.gf nav a:hover{color:var(--v-ink)}
.gf-legal{display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap;padding-top:32px;font-size:13px;line-height:1.8;color:var(--v-muted-2)}
.gf-legal p{margin:0}
.gf-legal .links{display:flex;gap:18px}
.gf-legal .links a:first-child{color:var(--v-ink-2);font-weight:650}

@media (max-width:1080px){
  .gnav,.gh-tel{display:none}
  .gh-burger{display:inline-flex;margin-left:4px}
  .gh-in{gap:8px}
  .gf-top{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gf-brand{grid-column:1/-1}
}
@media (max-width:640px){
  .gh,.drawer,.gf{--v-gutter:20px}
  .gh-in{height:60px}
  .drawer{inset:60px 0 0 0}
  .gh .btn{height:40px;padding:0 14px;font-size:14.5px}
  .gf-top{gap:28px 20px}
  .gf-legal{flex-direction:column;gap:16px}
}