/* STC 홈페이지 공통 디자인 (V1 디자인 키트) — 2026-10-09 11개 페이지에서 똑같던 부분을 모음.
   여기를 고치면 홈페이지 11개 페이지가 모두 바뀝니다. 한 페이지만 바꾸려면 그 페이지 안 <style> 에서 고치세요.
   고친 뒤에는 11개 페이지의 stc-design.css?v=날짜 를 새 날짜로 바꿔 올리세요. */
/* ══════════ STC V1 디자인 키트 (index.html 과 같은 모양) ══════════ */
:root{--v1-bg:#F2F3F5;--v1-mist:#F7F8FA;--v1-line:#E6E8EC;--v1-ink:#111318;--v1-ink2:#3A3F4A;--v1-ink3:#5B6170;--v1-blue:#1A5FD8;--v1-yellow:#FFD400;--v1-night:#0A0D18;
  --v1-r:28px;--v1-shadow:0 1px 2px rgba(17,19,24,.04),0 12px 32px -14px rgba(17,19,24,.12);--v1-shadow-d:0 1px 2px rgba(17,19,24,.04),0 12px 32px -14px rgba(17,19,24,.2);
  --v1-num:"Archivo","Pretendard Variable",Pretendard,sans-serif}
.v1-wrap{max-width:1240px;margin:0 auto;padding:0 clamp(20px,5vw,60px)}
.v1-sec{padding:clamp(56px,6vw,88px) 0;background:#fff}
.v1-sec--mist{background:var(--v1-mist);border-top:1px solid var(--v1-line);border-bottom:1px solid var(--v1-line)}
.v1-sec--gray{background:var(--v1-bg)}
.v1-sec--dark{background:var(--v1-night);color:#fff}
.v1-eyebrow{margin:0;font-family:var(--v1-num);font-weight:700;font-size:13px;letter-spacing:.2em;color:var(--v1-blue);text-transform:uppercase}
.v1-sec--dark .v1-eyebrow{color:var(--v1-yellow)}
.v1-h2{margin:12px 0 0;font-weight:800;font-size:clamp(30px,3.6vw,50px);line-height:1.2;letter-spacing:-.035em;text-wrap:balance}
.v1-sub{margin:16px 0 0;max-width:34em;font-size:17px;line-height:1.75;color:var(--v1-ink2);text-wrap:pretty}
.v1-sec--dark .v1-sub{color:#C9CDD4}
.v1-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 40px;margin-bottom:clamp(32px,4vw,52px)}
.v1-head>div{flex:1 1 480px}
.v1-head>p{flex:0 1 430px;margin:0;font-size:17px;line-height:1.75;color:var(--v1-ink2)}
.v1-head--center{display:block;text-align:center}
.v1-head--center .v1-sub{margin-left:auto;margin-right:auto}
.v1-chip{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;border-radius:999px;background:var(--v1-bg);font-size:14px;font-weight:600;color:var(--v1-ink)}
.v1-chip i{width:8px;height:8px;border-radius:50%;background:var(--v1-blue)}
.v1-chip--yellow{background:var(--v1-yellow);font-weight:700}
.v1-card{background:#fff;border-radius:var(--v1-r);box-shadow:var(--v1-shadow);padding:clamp(24px,3vw,36px)}
.v1-card--line{border:1px solid var(--v1-line);border-radius:24px;box-shadow:0 12px 32px -18px rgba(17,19,24,.18)}
.v1-card--blue{background:var(--v1-blue);color:#fff;box-shadow:var(--v1-shadow-d)}
.v1-card--ink{background:var(--v1-ink);color:#fff;box-shadow:var(--v1-shadow-d)}
.v1-card--yellow{background:var(--v1-yellow);color:var(--v1-ink)}
.v1-tile{transition:transform .25s ease,box-shadow .25s ease;text-decoration:none;color:inherit}
.v1-tile:hover{transform:translateY(-3px);box-shadow:0 2px 4px rgba(17,19,24,.05),0 22px 44px -18px rgba(17,19,24,.22)}
.v1-label{margin:0;font-family:var(--v1-num);font-weight:700;font-size:12.5px;letter-spacing:.14em;color:var(--v1-ink3)}
.v1-card--blue .v1-label,.v1-card--ink .v1-label{color:#AEB3BD}
.v1-big{font-family:var(--v1-num);font-weight:800;font-size:clamp(64px,7vw,108px);line-height:.85;letter-spacing:-.05em}
.v1-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 26px;border-radius:18px;border:0;background:var(--v1-blue);color:#fff;font-size:17px;font-weight:700;text-decoration:none;cursor:pointer;transition:transform .2s ease,filter .2s ease;white-space:nowrap}
.v1-btn:hover{transform:translateY(-1px);filter:brightness(1.08)}
.v1-btn--ghost{background:var(--v1-bg);color:var(--v1-ink);font-size:16px}
.v1-btn--white{background:#fff;color:var(--v1-ink)}
.v1-btn--ink{background:var(--v1-ink);color:#fff}
.v1-btn svg{width:16px;height:16px;flex:none}
.v1-go{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff;transition:transform .2s ease}
.v1-tile:hover .v1-go{transform:translate(2px,-2px)}

/* 페이지 첫 화면 (벤토) */
.v1-hero{background:var(--v1-bg);padding:24px clamp(20px,5vw,60px) clamp(48px,5vw,72px)}
.v1-bento{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.v1-hero__main{grid-column:1/span 8;position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:340px;padding:36px 40px 38px}
.v1-hero__main .v1-chips{position:relative;display:flex;flex-wrap:wrap;gap:8px}
.v1-hero__deco{position:absolute;right:-70px;top:-70px;width:330px;height:330px;pointer-events:none}
.v1-h1{position:relative;margin:auto 0 0;padding-top:36px;font-weight:800;font-size:clamp(36px,4.8vw,68px);line-height:1.08;letter-spacing:-.035em;text-wrap:balance}
.v1-h1 em{font-style:normal;color:var(--v1-blue)}
.v1-lead{position:relative;margin:20px 0 0;max-width:34em;font-size:18px;line-height:1.7;color:var(--v1-ink2)}
.v1-hero__btns{position:relative;margin-top:28px;display:flex;flex-wrap:wrap;gap:10px}
.v1-hero__side{grid-column:9/span 4;display:grid;gap:16px;grid-auto-rows:1fr}
.v1-hero__side>*{display:flex;flex-direction:column;justify-content:space-between;gap:14px;padding:24px 26px}
.v1-crumb{max-width:1240px;margin:0 auto 14px;font-size:13.5px;color:var(--v1-ink3);display:flex;gap:8px;align-items:center}
.v1-crumb a{color:var(--v1-ink3);text-decoration:none}
.v1-crumb a:hover{color:var(--v1-blue)}

/* 아래 레벨테스트 안내 띠 */
.v1-cta{position:relative;overflow:hidden;background:var(--v1-blue);color:#fff}
.v1-cta__mark{position:absolute;right:-30px;bottom:-90px;font-family:var(--v1-num);font-weight:800;font-size:320px;line-height:1;letter-spacing:-.06em;color:rgba(255,255,255,.07);pointer-events:none}
.v1-cta__in{position:relative;max-width:1240px;margin:0 auto;padding:clamp(56px,6vw,88px) clamp(20px,5vw,60px);display:flex;flex-wrap:wrap;gap:32px 64px;align-items:flex-end;justify-content:space-between}
.v1-cta__in>div:first-child{flex:1 1 460px;min-width:0}
.v1-cta .v1-eyebrow{color:rgba(255,255,255,.92);letter-spacing:.18em}
.v1-cta h2{margin:14px 0 0;font-weight:800;letter-spacing:-.04em;line-height:1.12}
.v1-cta h2 span{display:block;font-size:clamp(20px,2.1vw,28px);font-weight:700;letter-spacing:-.025em;margin-bottom:10px}
.v1-cta h2 b{display:block;font-size:clamp(36px,4.4vw,60px);font-weight:800}
.v1-cta p.v1-cta__txt{margin:20px 0 0;max-width:520px;font-size:17px;line-height:1.75;color:rgba(255,255,255,.94)}
.v1-cta__btns{display:flex;flex-wrap:wrap;gap:10px;flex:0 1 auto}
.v1-cta__tel{display:inline-flex;flex-direction:column;justify-content:center;min-height:64px;padding:10px 20px;border-radius:16px;background:#fff;color:var(--v1-ink);text-decoration:none;transition:transform .2s}
.v1-cta__tel:hover{transform:translateY(-1px)}
.v1-cta__tel small{font-size:12.5px;font-weight:700;color:var(--v1-ink3)}
.v1-cta__tel strong{font-family:var(--v1-num);font-weight:800;font-size:20px}
.v1-cta__go{display:inline-flex;align-items:center;gap:10px;min-height:64px;padding:0 24px;border-radius:16px;background:var(--v1-ink);color:#fff;font-size:17px;font-weight:800;text-decoration:none;transition:transform .2s}
.v1-cta__go:hover{transform:translateY(-1px)}

/* 하단 */
.v1-foot{background:#111318;color:#fff}
.v1-foot a{color:inherit;text-decoration:none}
.v1-foot a:hover{text-decoration:underline}
.v1-foot__in{max-width:1240px;margin:0 auto;padding:clamp(40px,4vw,56px) clamp(20px,5vw,60px) 28px}
.v1-foot__top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:18px;padding-bottom:26px;border-bottom:1px solid rgba(255,255,255,.14)}
.v1-foot__brand{margin:0;display:flex;align-items:baseline;gap:10px}
.v1-foot__brand b{font-family:var(--v1-num);font-weight:800;font-size:38px;letter-spacing:.01em;line-height:1}
.v1-foot__brand span{font-weight:700;font-size:18px}
.v1-foot__tag{margin:0;font-size:14px;color:#AEB3BD}
.v1-foot__cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:24px 36px;padding:28px 0;font-size:15px;line-height:1.8}
.v1-foot__cols h3{margin:0 0 4px;font-size:15px;font-weight:700}
.v1-foot__cols p{margin:0;color:#C9CDD4}
.v1-foot__bot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;padding-top:20px;border-top:1px solid rgba(255,255,255,.14);font-size:13.5px;color:#AEB3BD}

@media(max-width:860px){
  .v1-bento{grid-template-columns:1fr}
  .v1-hero__main,.v1-hero__side{grid-column:1/-1}
  .v1-hero__main{padding:26px 24px 28px;min-height:0}
  .v1-hero__deco{display:none}
  .v1-hero__side{grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));grid-auto-rows:auto}
  .v1-lead{font-size:16.5px}
}
@media(prefers-reduced-motion:reduce){.v1-tile,.v1-btn,.v1-go,.v1-cta__tel,.v1-cta__go{transition:none}}

/* v1-tile-fix */.v1-card--blue.v1-tile,.v1-card--ink.v1-tile{color:#fff}.v1-card--yellow.v1-tile{color:#111318}

/* 시계 장식 바늘이 천천히 돎 (2026-10-09c 원장님 「b」) — 긴 바늘 10초 · 짧은 바늘 2분에 한 바퀴 (10-09d 원장님 「너무 느린데」). 9개 페이지 첫 화면 오른쪽 위 시계 */
@keyframes v1-clk{to{transform:rotate(360deg)}}
.v1-clk-m,.v1-clk-h{transform-box:view-box;transform-origin:150px 150px;animation:v1-clk 10s linear infinite}
.v1-clk-h{animation-duration:120s}
@media(prefers-reduced-motion:reduce){.v1-clk-m,.v1-clk-h{animation:none}}

/* 맨 위 메뉴 줄 「관리 화면」 버튼 (2026-10-30 원장님 「화면 내려도 관리 화면이 따라와서 늘 상단에」) — 메뉴 줄은 원래 위에 붙어 있음 · 휴대폰에서도 보임 */
.head .admbtn{display:inline-flex;align-items:center;height:36px;padding:0 14px;border:1px solid var(--v1-line);border-radius:999px;background:#fff;color:var(--v1-ink2);font-size:.82rem;font-weight:700;text-decoration:none;white-space:nowrap;transition:border-color .18s,color .18s}
.head .admbtn:hover{border-color:var(--v1-blue);color:var(--v1-blue)}
@media(max-width:1000px){.head .admbtn{height:38px;padding:0 12px;font-size:.78rem}}
/* 2026-11-02 원장님 「관리 화면은 무조건 로그인 후에」 — 원장님 · 선생님 계정으로 로그인했을 때만 버튼이 보임 (stc-auth.js 가 html 에 stc-on · stc-staff 를 붙임)
   · 로그인 전 '필연성장' 글자 숨김 (로그인 뒤 이름은 그대로) · 휴대폰에서 STC 로고 두 번 → 한 번 */
.head .admbtn{display:none}
html.stc-staff .head .admbtn{display:inline-flex}
html:not(.stc-on) .head .auth.plain,html:not(.stc-on) .util__right .sep.auth{display:none}
@media(max-width:1000px){.util__center .mark{display:none}}