/* =========================================================
   로이수학학원 — 하위 페이지 공통 (제일학원 서브 레이아웃 구조 참고)
   좌측: 섹션 타이틀 박스 + LNB + 상담 박스 / 우측: 제목·브레드크럼 + 본문
   ========================================================= */
.header--sub{border-bottom:0;box-shadow:inset 0 -3px 0 transparent;background-image:var(--gold-grad);background-size:100% 3px;background-position:bottom;background-repeat:no-repeat;background-color:#fff}
.gnb>ul>li[aria-current]>a{color:var(--navy)}
.gnb>ul>li[aria-current]>a::after{width:100%}

.sub-wrap{display:grid;grid-template-columns:220px minmax(0,1fr);gap:56px;padding-top:40px;padding-bottom:90px;align-items:start}

/* ---------- 좌측 SNB ---------- */
.snb__head{position:relative;overflow:hidden;height:120px;border-radius:6px 6px 0 0;border-bottom:3px solid var(--gold);background:linear-gradient(135deg,var(--navy-d),var(--navy) 60%,#2a3d9a);display:flex;align-items:center;justify-content:center}
.snb__head h2{position:relative;background:var(--gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:24px;font-weight:800;letter-spacing:-.04em}
.snb__sym{position:absolute;right:-6px;bottom:-34px;font-size:130px;font-weight:900;color:rgba(255,214,90,.22);font-family:"Times New Roman",serif;line-height:1}
.snb__list{border:1px solid var(--line);border-top:0}
.snb__list li+li{border-top:1px solid var(--line)}
.snb__list a{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;font-size:15px;color:#333;transition:background .2s,color .2s}
.snb__list svg{width:14px;height:14px;stroke-width:2.6;color:var(--gold-d);opacity:0;transition:opacity .2s,transform .2s}
.snb__list a:hover{background:#f5f7ff;color:var(--navy)}
.snb__list a:hover svg{opacity:.5}
.snb__list .is-on a{color:var(--navy);font-weight:700;background:#f5f7ff}
.snb__list .is-on svg{opacity:1}
.snb__contact{margin-top:36px;border:1px solid var(--line);border-top:2px solid var(--gold)}
.snb__contact h3{font-size:19px;font-weight:700;color:#222;padding:12px 12px 6px}
.snb__tel{display:block;padding:2px 12px 6px;font-size:21px;font-weight:800;color:var(--blue);letter-spacing:.01em}
.snb__addr{background:none!important;padding:0 12px 12px!important;font-size:12px!important;line-height:1.5;color:#777!important;display:block!important}
.snb__contact ul{padding:0 12px 12px}
.snb__contact li{display:flex;justify-content:space-between;font-size:13px;padding:3px 0}
.snb__contact li span{color:#555}
.snb__contact li span::before{content:"• ";color:var(--blue)}
.snb__contact li a{color:var(--blue);letter-spacing:.02em}
.snb__contact p{background:#e9e9e9;padding:8px 12px;font-size:12px;color:#555;display:grid;gap:4px}
.snb__contact p b{display:inline-block;background:#999;color:#fff;border-radius:3px;padding:0 6px;margin-right:6px}

/* ---------- 페이지 헤드 ---------- */
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding-bottom:22px;border-bottom:1px solid #ddd;margin-bottom:40px;scroll-margin-top:20px}
.page-head__title{font-size:34px;font-weight:800;color:#222;letter-spacing:-.04em}
.page-head__desc{font-size:14px;color:#999;margin-top:8px}
.crumb{display:flex;align-items:center;font-size:13px;color:#555;flex:none;list-style:none;padding:0;margin:0}
.crumb li+li::before{content:"›";margin:0 8px;color:#aaa}
.crumb svg{width:16px;height:16px;color:#999;vertical-align:-3px}
.crumb [aria-current]{color:var(--blue)}

/* ---------- 본문 공통 ---------- */
.sec{margin-bottom:64px;scroll-margin-top:24px}
.sec__title{font-size:24px;font-weight:800;color:#222;letter-spacing:-.04em;margin-bottom:20px;display:flex;align-items:center;gap:10px}
.sec__title::before{content:"";width:6px;height:24px;background:var(--gold-grad);border-radius:2px}
.sec__title small{font-size:14px;font-weight:500;color:#999;margin-left:4px}
.lead{font-size:22px;line-height:1.5;color:#222;font-weight:500;letter-spacing:-.03em;margin-bottom:22px}
.lead em{font-style:normal;color:var(--blue);font-weight:800}
.prose p{font-size:15px;line-height:1.85;color:#555;margin-bottom:14px}
.prose b{color:#222}
.note{font-size:13px;color:#888;margin-top:12px}
.note::before{content:"※ "}
.placeholder{display:grid;place-items:center;background:repeating-linear-gradient(135deg,#f1f3f8 0 12px,#e9ecf4 12px 24px);color:#8a93ad;font-size:13px;font-weight:600;text-align:center;border-radius:8px}

/* 표 */
.tbl{width:100%;border-collapse:collapse;border-top:2px solid #555;font-size:14px}
.tbl th,.tbl td{border-bottom:1px solid var(--line);padding:13px 14px;text-align:left;vertical-align:top;line-height:1.6}
.tbl thead th{background:#f7f7f7;text-align:center;font-weight:700;color:#333}
.tbl tbody th{background:#f7f8fc;color:var(--navy);font-weight:700;width:150px;white-space:nowrap}
.tbl td{color:#444}
.tbl--center td{text-align:center}
.tbl-wrap{overflow-x:auto}

/* 버튼 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:48px;padding:0 28px;border-radius:40px;font-size:16px;font-weight:700;transition:transform .2s,box-shadow .2s;border:0;cursor:pointer}
.btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.12)}
.btn--navy{background:var(--navy);color:#fff}
.btn--yellow,.btn--gold{position:relative;overflow:hidden;background:var(--gold-grad);color:var(--navy-d)}
.btn--line{background:#fff;color:#333;border:1px solid #ccc}
.btn--sm{height:36px;padding:0 16px;font-size:14px;border-radius:4px}

/* CTA */
.cta-box{position:relative;overflow:hidden;border-bottom:3px solid var(--gold);display:flex;justify-content:space-between;align-items:center;gap:20px;background:linear-gradient(120deg,var(--navy-d),#2a3d9a);color:#fff;border-radius:12px;padding:30px 36px;margin-top:20px}
.cta-box p{font-size:22px;font-weight:800;letter-spacing:-.03em}
.cta-box small{display:block;font-size:14px;font-weight:400;opacity:.75;margin-top:6px}
.cta-box div{display:flex;gap:10px;flex:none}

/* ---------- 과정 페이지 ---------- */
.course-hero{position:relative;overflow:hidden;border-radius:12px;padding:44px 44px 40px;color:#fff;margin-bottom:28px;background:linear-gradient(120deg,var(--navy-d),#3450c9)}
.course-hero--elementary{background:linear-gradient(120deg,#5aa52c,#8fd14f)}
.course-hero--middle{background:linear-gradient(120deg,#139a9d,#2fc7c9)}
.course-hero--high{background:linear-gradient(120deg,#1c2a6b,#3450c9)}
.course-hero--suneung{background:radial-gradient(circle at 80% 20%,#3d4150,#15171d 70%)}
.course-hero--clinic{background:linear-gradient(120deg,#a55ac9,#d79bf0)}
.course-hero::after{content:attr(data-sym);position:absolute;right:30px;top:50%;transform:translateY(-50%);font-size:220px;line-height:1;font-family:"Times New Roman",serif;color:rgba(255,255,255,.12);pointer-events:none}
.course-hero__kicker{display:inline-block;background:rgba(255,255,255,.18);border-radius:20px;padding:4px 14px;font-size:14px;font-weight:700}
.course-hero--suneung .course-hero__kicker{background:var(--red)}
.course-hero h3{font-size:42px;font-weight:900;line-height:1.15;letter-spacing:-.05em;margin:14px 0 12px;position:relative;z-index:1}
.course-hero h3 em{font-style:normal;background:var(--gold-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.course-hero p{font-size:16px;opacity:.92;position:relative;z-index:1;max-width:560px;line-height:1.6}
.course-hero__meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;position:relative;z-index:1}
.course-hero__meta li{background:#fff;color:#222;border-radius:30px;padding:7px 16px;font-size:14px}
.course-hero__meta b{color:var(--navy);margin-right:6px}

.toc{position:sticky;top:0;z-index:5;display:flex;gap:4px;background:#fff;border-bottom:1px solid var(--line);margin-bottom:36px;overflow-x:auto}
.toc a{flex:none;padding:14px 16px;font-size:15px;font-weight:600;color:#888;border-bottom:3px solid transparent;margin-bottom:-1px}
.toc a.is-on,.toc a:hover{color:var(--navy);border-color:var(--navy)}

.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.cards--2{grid-template-columns:repeat(2,1fr)}
.cards--4{grid-template-columns:repeat(4,1fr)}
.card{border:1px solid var(--line);border-radius:10px;padding:26px 22px;background:#fff;transition:border-color .2s,transform .2s}
.card:hover{border-color:var(--navy);transform:translateY(-3px)}
.card__num{font-size:13px;font-weight:800;color:var(--gold-d);letter-spacing:.08em}
.card__ico{width:56px;height:56px;border-radius:14px;background:#f0f3ff;display:grid;place-items:center;color:var(--navy);font-size:28px;margin-bottom:14px}
.card__ico svg{width:28px;height:28px}
.card h4{font-size:19px;font-weight:800;color:#222;margin:8px 0 10px;letter-spacing:-.03em}
.card p{font-size:14px;line-height:1.65;color:#666}

.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:step}
.steps li{position:relative;text-align:center;padding:0 12px}
.steps li::before{counter-increment:step;content:counter(step,decimal-leading-zero);display:grid;place-items:center;width:76px;height:76px;margin:0 auto 14px;border-radius:50%;background:#f0f3ff;color:var(--navy);font-size:22px;font-weight:900;border:2px solid #fff;box-shadow:0 0 0 2px #dfe5fb}
.steps li:not(:last-child)::after{content:"";position:absolute;top:38px;left:calc(50% + 46px);right:calc(-50% + 46px);border-top:2px dashed #cdd5f3}
.steps b{display:block;font-size:17px;color:#222;margin-bottom:6px}
.steps span{font-size:13px;color:#777;line-height:1.55;display:block}

.check{display:grid;gap:10px}
.check li{display:flex;gap:10px;font-size:15px;color:#444;line-height:1.55}
.check li::before{content:"✓";flex:none;width:22px;height:22px;border-radius:50%;background:var(--navy);color:#fff;font-size:12px;font-weight:900;display:grid;place-items:center;margin-top:1px}

/* 과정 페이지 우측 목차 퀵메뉴 */
.quick--toc{background:#fff}
.quick--toc .quick__head{background:var(--red);color:#fff;text-align:center;padding:16px 8px;font-size:13px;font-weight:600;line-height:1.3}
.quick--toc .quick__head b{display:block;font-size:15px;word-break:keep-all;font-weight:900;margin-top:4px;letter-spacing:-.04em}
.quick--toc a.quick__toc{justify-content:flex-start;text-align:left;min-height:0;padding:9px 8px;font-size:12px;font-weight:600;border-bottom:1px dashed #ccc;color:#333}
.quick--toc a.quick__toc.is-on{color:var(--red)}
.quick--toc a::after{display:none}
.quick--toc .quick__tel{flex-direction:column;background:var(--red)!important;color:#fff!important;font-size:13px;padding:12px 6px}
.quick--toc .quick__tel b{font-size:10px;letter-spacing:-.03em;white-space:nowrap;margin-top:2px}
.quick--toc .quick__top{background:#111}

/* ---------- 학원소개 ---------- */
.greet{display:grid;grid-template-columns:1fr 240px;gap:40px;align-items:start}
.greet__photo{aspect-ratio:3/4}
.greet__img{display:block;width:100%;height:auto;background:linear-gradient(180deg,#f3eee8,#e7ddd1);border-radius:12px;padding:24px 12px 0}
.teacher__img{display:block;width:100%;aspect-ratio:4/3;object-fit:contain;object-position:center bottom;background:linear-gradient(180deg,#f3eee8,#e7ddd1);padding-top:14px}
.map-frame{display:block;width:100%;height:380px;border:0;border-radius:8px;margin-bottom:12px;background:#eee}
.map-links{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}
.greet__sign{text-align:right;margin-top:24px;font-size:15px;color:#555}
.greet__sign b{font-size:22px;color:#222;margin-left:8px}
.greet__quote{font-size:30px;font-weight:900;letter-spacing:-.05em;line-height:1.3;color:var(--navy);margin-bottom:24px}
.greet__quote em{font-style:normal;color:var(--gold-d)}

.teachers{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.teacher{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.teacher__photo{aspect-ratio:4/3;border-radius:0}
.teacher__body{padding:18px 20px 22px}
.teacher__role{font-size:12px;font-weight:700;color:var(--blue)}
.teacher__name{font-size:20px;font-weight:800;color:#222;margin:4px 0 10px}
.teacher__name small{font-size:14px;color:#888;font-weight:500;margin-left:6px}
.teacher ul{font-size:13px;color:#666;line-height:1.7}
.teacher ul li::before{content:"· "}
.teachers--4{grid-template-columns:repeat(2,1fr)}
.teacher__noimg{aspect-ratio:4/3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:linear-gradient(180deg,#fbf6e6,#f1e6c6);color:#a8780a;font-size:13px;font-weight:600}
.teacher__noimg img{opacity:.85}
.teacher__subj{font-size:14px;color:#555;margin-bottom:6px}
.teacher__msg{margin-top:12px;padding-top:12px;border-top:1px dashed #ddd;font-size:14px;color:var(--navy);font-weight:600}

.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.gallery figure{margin:0}
.gallery .placeholder{aspect-ratio:4/3}
.gallery figcaption{font-size:14px;color:#444;margin-top:8px;font-weight:600}
.gallery figcaption span{display:block;font-size:13px;color:#888;font-weight:400;margin-top:2px}

.map{height:380px;margin-bottom:20px}

/* ---------- 입학안내 ---------- */
.form{display:grid;gap:18px;max-width:720px}
.form[hidden]{display:none}
.form__row{display:grid;grid-template-columns:140px 1fr;align-items:center;gap:14px}
.form__row>label,.form__row>.form__label{font-size:15px;font-weight:700;color:#333}
.form__row .req{color:var(--red);margin-left:2px}
.form input[type=text],.form input[type=tel],.form input[type=date],.form select,.form textarea{width:100%;height:46px;border:1px solid #ccc;border-radius:6px;padding:0 14px;font:inherit;font-size:15px;background:#fff}
.form textarea{height:120px;padding:12px 14px;resize:vertical}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid var(--blue);outline-offset:-1px;border-color:transparent}
.form__opts{display:flex;flex-wrap:wrap;gap:8px}
.form__opts label{display:flex;align-items:center;gap:6px;border:1px solid #ccc;border-radius:30px;padding:8px 16px;font-size:14px;cursor:pointer}
.form__opts input{accent-color:var(--navy)}
.form__opts label:has(input:checked){border-color:var(--navy);background:#f0f3ff;color:var(--navy);font-weight:700}
.form__agree{background:#f7f7f7;border-radius:8px;padding:16px 18px;font-size:13px;color:#666;line-height:1.6}
.form__agree label{display:flex;gap:8px;margin-top:10px;font-size:14px;color:#333;font-weight:600;cursor:pointer}
.form__submit{display:flex;justify-content:center;margin-top:10px}
.form__done{display:none;text-align:center;padding:40px 20px;border:2px solid var(--navy);border-radius:12px;background:#f5f7ff}
.form__done.is-on{display:block}
.form__done b{display:block;font-size:22px;color:var(--navy);margin-bottom:8px}

.tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px}
.tabs button{padding:10px 20px;border:1px solid #ccc;border-radius:30px;font-size:15px;font-weight:600;color:#666;background:#fff}
.tabs button.is-on{background:var(--navy);border-color:var(--navy);color:#fff}
.tab-panel{display:none}
.tab-panel.is-on{display:block}
.tt td{text-align:center;font-size:13px;height:56px;vertical-align:middle}
.tt td.c{background:#f0f3ff;color:var(--navy);font-weight:700}
.tt td.c small{display:block;font-weight:400;color:#777;font-size:12px}
.tt thead th:first-child{width:110px}

.calendar{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.calendar li{border:1px solid var(--line);border-radius:10px;padding:16px 18px}
.calendar b{display:block;font-size:20px;color:var(--navy);margin-bottom:6px}
.calendar span{font-size:13px;color:#666;line-height:1.7;display:block}

/* ---------- 커뮤니티 ---------- */
.board-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:14px;color:#666}
.board-top b{color:var(--navy)}
.btbl{width:100%;border-collapse:collapse;border-top:2px solid #555;font-size:14px}
.btbl th{background:#f7f7f7;font-weight:600;color:#333;padding:13px 8px;border-bottom:1px solid #ddd}
.btbl td{padding:14px 8px;border-bottom:1px solid var(--line);text-align:center;color:#777}
.btbl td.t{text-align:left}
.btbl td.t a{color:#333}
.btbl td.t a:hover{color:var(--navy);text-decoration:underline}
.btbl tr.pin{background:#fffbea}
.btbl tr.pin td.t a{font-weight:700}
.pin-badge{display:inline-block;background:var(--red);color:#fff;font-size:11px;font-weight:700;border-radius:3px;padding:2px 6px}
.new-badge{display:inline-block;background:var(--blue);color:#fff;font-size:10px;font-weight:800;border-radius:3px;padding:1px 4px;margin-left:6px;vertical-align:1px}
.btbl .empty{padding:60px 0;color:#999}
.paging{display:flex;justify-content:center;gap:4px;margin:30px 0}
.paging button{min-width:34px;height:34px;border:1px solid #ddd;background:#fff;font-size:13px;color:#555}
.paging button.is-on{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:700}
.paging button:disabled{opacity:.4;cursor:default}
.search{display:flex;justify-content:center;gap:6px;background:#f7f7f7;border:1px solid #eee;padding:22px}
.search select,.search input{height:38px;border:1px solid #ccc;padding:0 10px;font:inherit;font-size:14px;background:#fff}
.search input{width:320px}
.view{border-top:2px solid #555}
.view__head{padding:22px 10px;border-bottom:1px solid #ddd}
.view__head h3{font-size:22px;color:#222;font-weight:700;letter-spacing:-.03em}
.view__meta{display:flex;gap:16px;font-size:13px;color:#999;margin-top:8px}
.view__body{padding:34px 10px 50px;border-bottom:1px solid #ddd;font-size:15px;line-height:1.85;color:#444;min-height:200px}
.view__body p{margin-bottom:12px}
.view__body ul{list-style:disc;padding-left:22px;margin-bottom:12px}
.view__body a{color:var(--blue);text-decoration:underline}
.view__body ol{list-style:decimal;padding-left:22px;margin-bottom:12px}
.view__body h2{font-size:21px;color:#222;margin:22px 0 10px}
.view__body h3{font-size:18px;color:#222;margin:18px 0 8px}
.view__body blockquote{margin:0 0 12px;padding:10px 16px;border-left:4px solid var(--gold);background:#faf8f0}
.view__body img{max-width:100%;height:auto;border-radius:6px;margin:6px 0}
.view__nav{border-bottom:1px solid #ddd;font-size:14px}
.view__nav a,.view__nav span{display:flex;gap:20px;padding:13px 10px;color:#555}
.view__nav a+a,.view__nav a+span,.view__nav span+a{border-top:1px solid var(--line)}
.view__nav em{font-style:normal;color:#999;width:50px;flex:none}
.view__btns{display:flex;justify-content:flex-end;margin-top:20px}

.reviews{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.review{border:1px solid var(--line);border-radius:12px;padding:24px;background:#fff;position:relative}
.review__tag{font-size:12px;font-weight:700;color:var(--blue)}
.review__grade{display:flex;align-items:center;gap:10px;margin:10px 0 12px}
.review__grade span{font-size:15px;font-weight:700;color:#999;background:#f1f1f1;border-radius:6px;padding:4px 10px}
.review__grade i{font-style:normal;color:#ccc}
.review__grade b{font-size:15px;font-weight:800;color:#fff;background:var(--red);border-radius:6px;padding:4px 10px}
.review h4{font-size:18px;font-weight:800;color:#222;letter-spacing:-.03em;margin-bottom:10px}
.review p{font-size:14px;color:#666;line-height:1.7}
.review__who{margin-top:14px;font-size:13px;color:#999}
.review::after{content:"”";position:absolute;right:20px;top:4px;font-size:80px;color:#eef1fb;font-family:Georgia,serif;line-height:1}

.faq{border-top:2px solid #555}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;gap:12px;align-items:center;padding:18px 10px;font-size:16px;font-weight:600;color:#222}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"Q";flex:none;width:28px;height:28px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-size:14px;font-weight:800}
.faq summary::after{content:"+";margin-left:auto;font-size:22px;color:#999;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details>div{display:flex;gap:12px;padding:0 10px 20px;font-size:15px;line-height:1.75;color:#555}
.faq details>div::before{content:"A";flex:none;width:28px;height:28px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;font-size:14px;font-weight:800}

.policy h3{font-size:20px;color:#222;margin:34px 0 12px;scroll-margin-top:20px}
.policy h4{font-size:16px;color:#333;margin:20px 0 8px}
.policy p,.policy li{font-size:14px;line-height:1.8;color:#555}
.policy ol,.policy ul{padding-left:20px;list-style:decimal}

/* ---------- 반응형 ---------- */
@media (min-width:1411px){ .toc{display:none} }
@media (max-width:1100px){
  .sub-wrap{grid-template-columns:200px minmax(0,1fr);gap:32px}
  .teachers,.gallery{grid-template-columns:repeat(2,1fr)}
  .cards--4,.calendar{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .header--sub{border-bottom-width:1px}
  .sub-wrap{grid-template-columns:minmax(0,1fr);gap:0;padding-top:0}
  .snb{margin:0 -16px 24px}
  .snb__head{height:auto;border-radius:0;padding:22px 16px;justify-content:flex-start}
  .snb__head h2{font-size:20px}
  .snb__sym{font-size:90px;bottom:-24px}
  .snb__list{display:flex;overflow-x:auto;border:0;border-bottom:1px solid var(--line);background:#fff}
  .snb__list li+li{border-top:0}
  .snb__list a{white-space:nowrap;padding:14px 14px;font-size:14px}
  .snb__list svg{display:none}
  .snb__list .is-on a{background:none;box-shadow:inset 0 -3px 0 var(--navy)}
  .snb__contact{display:none}
  .page-head{flex-direction:column;align-items:flex-start;margin-bottom:26px}
  .page-head__title{font-size:26px}
  .crumb{order:-1;font-size:12px}
  .course-hero{padding:30px 22px}
  .course-hero h3{font-size:30px}
  .course-hero::after{font-size:140px;right:10px}
  .toc{top:70px;margin-left:-16px;margin-right:-16px;padding:0 8px}
  .cards,.cards--2{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr;row-gap:28px}
  .steps li::after{display:none}
  .greet{grid-template-columns:1fr}
  .greet__photo{max-width:240px;order:-1}
  .greet__quote{font-size:24px}
  .reviews{grid-template-columns:1fr}
  .form__row{grid-template-columns:1fr;gap:6px}
  .cta-box{flex-direction:column;align-items:flex-start;padding:24px}
  .cta-box p{font-size:19px}
  .tbl tbody th{width:96px;white-space:normal}
  .search{flex-wrap:wrap}
  .search input{width:auto;flex:1;min-width:0}
  .btbl .hide-m{display:none}
  .map{height:260px}
  .map-frame{height:280px}
}
@media (max-width:560px){
  .teachers,.teachers--4,.gallery,.cards--4,.calendar{grid-template-columns:1fr}
  .cta-box div{flex-direction:column;width:100%}
  .cta-box .btn{width:100%}
}
.sub-wrap--full{grid-template-columns:minmax(0,1fr);max-width:960px}

/* 준비 중 안내 */
.soon{text-align:center;border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:12px;padding:48px 20px;background:linear-gradient(180deg,#fffdf4,#fff)}
.soon img{display:block;margin:0 auto 16px}
.soon b{display:block;font-size:22px;color:#222;letter-spacing:-.03em}
.soon p{font-size:15px;color:#666;margin:10px 0 22px;line-height:1.6}
.soon div{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}

/* =========================================================
   설명회 자료 반영 (2026.11 개강) — 영어과 · 펜클래스 · 커리큘럼
   ========================================================= */
.course-hero--english{background:linear-gradient(120deg,#0a2540,#1f4f8a)}
.course-hero--pen{background:radial-gradient(circle at 85% 20%,#2a3d9a,#121c4c 70%)}
.course-hero--english .course-hero__kicker,.course-hero--pen .course-hero__kicker{background:var(--gold);color:var(--navy-d)}

/* 연혁 */
.timeline{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding-top:30px}
.timeline::before{content:"";position:absolute;left:0;right:0;top:9px;height:2px;background:linear-gradient(90deg,#dfe5fb,var(--gold))}
.timeline li{position:relative}
.timeline li::before{content:"";position:absolute;top:-28px;left:0;width:16px;height:16px;border-radius:50%;background:#fff;border:3px solid var(--navy)}
.timeline li:last-child::before{background:var(--gold);border-color:var(--gold-d)}
.timeline time{display:block;font-size:20px;font-weight:900;color:var(--navy);letter-spacing:-.02em}
.timeline b{display:block;font-size:16px;color:#222;margin:6px 0 4px}
.timeline span{font-size:13px;color:#777;line-height:1.6}
.callout{margin-top:22px;padding:18px 22px;border-radius:10px;background:#f5f7ff;border-left:4px solid var(--gold);font-size:16px;font-weight:700;color:var(--navy);line-height:1.6}

/* 데일리 · 주간 · 월간 학습보고 */
.reports{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.report{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.report__head{padding:18px 22px;background:var(--navy);color:#fff}
.report__head small{display:block;font-size:12px;font-weight:800;letter-spacing:.14em;color:var(--gold-l)}
.report__head b{font-size:20px}
.report:nth-child(2) .report__head{background:#2a3d9a}
.report:nth-child(3) .report__head{background:var(--navy-d)}
.report .check{padding:20px 22px}
.report .check li{font-size:14px}

/* 펜클래스 사례 */
.exam-sheet{display:grid;grid-template-columns:repeat(auto-fill,minmax(32px,1fr));gap:6px;margin:6px 0 18px;max-width:620px}
.exam-sheet span{height:34px;border-radius:6px;display:grid;place-items:center;font-size:13px;font-weight:700;background:#eef7ee;color:#3a8a3a}
.exam-sheet span.x{background:#fde8e7;color:var(--red);box-shadow:inset 0 0 0 2px var(--red)}
.cases{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.case{border:1px solid var(--line);border-radius:12px;padding:22px;background:#fff;display:flex;flex-direction:column;gap:10px}
.case__no{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:800;color:#999;letter-spacing:.06em}
.case__no b{font-size:22px;color:var(--red);letter-spacing:-.02em}
.case p{font-size:14px;color:#555;line-height:1.65}
.case__cause{align-self:flex-start;font-size:17px;font-weight:900;color:var(--navy);background:#f0f3ff;border-radius:6px;padding:4px 12px}
.case__rx{margin-top:auto;padding-top:12px;border-top:1px dashed #ddd;font-size:13px!important}
.case__rx b{color:var(--gold-d);margin-right:6px}

/* 영어과 */
.pill-list{display:flex;flex-wrap:wrap;gap:8px}
.pill-list li{border:1px solid var(--line);border-radius:30px;padding:7px 16px;font-size:14px;font-weight:600;color:#333;background:#fff}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.stat{border:1px solid var(--line);border-radius:12px;padding:20px;text-align:center;background:#fff}
.stat b{display:block;font-size:34px;font-weight:900;color:var(--navy);letter-spacing:-.04em;line-height:1.1}
.stat span{display:block;font-size:13px;color:#777;margin-top:6px}
.motto{display:grid;gap:10px}
.motto li{display:grid;grid-template-columns:120px 1fr;align-items:center;gap:16px;padding:18px 22px;border-radius:12px;background:#f7f8fc;font-size:20px;font-weight:700;color:#222;letter-spacing:-.03em}
.motto small{font-size:12px;font-weight:800;color:var(--gold-d);letter-spacing:.1em}
.motto s{color:#aaa;font-weight:500}
.motto em{font-style:normal;color:var(--blue);font-weight:900}
.profile{display:grid;grid-template-columns:200px 1fr;gap:30px;align-items:center;padding:30px;border-radius:14px;background:linear-gradient(120deg,#0a2540,#1f4f8a);color:#fff;margin-bottom:28px}
.profile__mark{aspect-ratio:1;border-radius:50%;display:grid;place-items:center;font-size:90px;font-weight:900;background:rgba(255,255,255,.08);border:3px solid var(--gold);color:var(--gold-l)}
.profile__photo{width:100%;object-fit:cover;object-position:center 15%}
.profile__role{font-size:13px;font-weight:700;color:var(--gold-l);letter-spacing:.06em}
.profile h3{font-size:34px;font-weight:900;letter-spacing:-.04em;margin:6px 0 10px}
.profile h3 small{font-size:16px;font-weight:600;opacity:.75;margin-left:8px}
.profile p{font-size:16px;opacity:.9;line-height:1.6}
.profile blockquote{margin:0 0 10px;font-size:22px;font-weight:800;color:var(--gold-l)}
.vs{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.vs .card h4 small{font-size:13px;font-weight:600;color:#999;margin-left:6px}
.vs dl{display:grid;grid-template-columns:70px 1fr;gap:8px 12px;font-size:14px;margin-top:12px}
.vs dt{font-weight:700;color:var(--navy)}
.vs dd{margin:0;color:#555}

@media (max-width:900px){
  .timeline{grid-template-columns:1fr 1fr;row-gap:36px}
  .reports,.cases,.vs{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr 1fr}
  .profile{grid-template-columns:1fr;padding:24px;text-align:center}
  .profile__mark{width:140px;margin:0 auto;font-size:64px}
  .motto li{grid-template-columns:1fr;gap:4px;font-size:17px}
}
.steps--2{grid-template-columns:repeat(2,1fr)}
.steps--3{grid-template-columns:repeat(3,1fr)}
@media (max-width:900px){ .steps--3{grid-template-columns:1fr} }

/* ---------- 펜클래스 확장 (로이수학 앱 내용) ---------- */
.pen-callout{margin-top:18px;text-align:center;font-size:20px;color:#222;letter-spacing:-.03em;padding:18px;border-radius:10px;background:linear-gradient(180deg,#fffdf4,#fbf3d9);border:1px solid #f0dfa8}
.pen-callout b{color:var(--gold-d)}
.trace{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.trace__item{position:relative;border-radius:12px;padding:24px 22px;background:var(--navy-d);color:#cdd3ea;overflow:hidden}
.trace__item::after{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--gold-grad)}
.trace__item span{font-size:12px;font-weight:800;letter-spacing:.12em;background:var(--gold-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.trace__item h4{font-size:18px;color:#fff;margin:8px 0;letter-spacing:-.03em}
.trace__item p{font-size:14px;line-height:1.65}
.pen-sub{font-size:19px;color:#222;margin:40px 0 22px;text-align:center;letter-spacing:-.03em}
.steps--3{grid-template-columns:repeat(3,1fr)}
.pen-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.pen-stat{border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:10px;padding:18px 16px;background:#fff}
.pen-stat__k{font-size:12px;font-weight:700;color:#888}
.pen-stat b{display:block;font-size:40px;font-weight:900;letter-spacing:-.04em;color:var(--navy);margin:6px 0 8px}
.pen-stat p{font-size:13px;line-height:1.6;color:#666}
.pen-more{margin-top:14px}
.pen-more .card p b{color:var(--navy)}
.pen-next{margin-top:14px;border-radius:12px;padding:22px 24px;background:#f5f7ff;border:1px solid #dfe5fb}
.pen-next__t{font-weight:800;color:var(--navy);margin-bottom:12px}
.pen-next li{font-size:14px;color:#555;line-height:1.6;padding:6px 0;border-top:1px dashed #d5dcf3}
.pen-next li:first-child{border-top:0}
.pen-next li b{display:inline-block;min-width:150px;color:#222;margin-right:8px}
.pen-teaser{display:flex;justify-content:space-between;align-items:center;gap:24px;border-radius:12px;padding:30px 32px;background:radial-gradient(circle at 85% 20%,#2a3d9a,var(--navy-d) 70%);color:#cdd3ea;border-bottom:3px solid var(--gold)}
.pen-teaser__k{font-size:12px;letter-spacing:.14em;font-weight:700;color:var(--gold-l)}
.pen-teaser__t{font-size:28px;font-weight:900;color:#fff;margin:6px 0 10px;letter-spacing:-.04em}
.pen-teaser__t em{font-style:normal;background:var(--gold-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.pen-teaser__d{font-size:14px;line-height:1.7;max-width:520px}
.pen-teaser .btn{flex:none}
.teacher--wide{display:grid;grid-template-columns:280px 1fr;max-width:720px}
.teacher--wide .teacher__noimg{aspect-ratio:auto;min-height:200px}
.teacher--wide .teacher__body{display:flex;flex-direction:column;justify-content:center;padding:24px 28px}
@media (max-width:1100px){ .pen-stats{grid-template-columns:repeat(2,1fr)} }
@media (max-width:900px){
  .trace,.steps--3{grid-template-columns:1fr}
  .pen-teaser{flex-direction:column;align-items:flex-start;padding:24px}
  .teacher--wide{grid-template-columns:1fr}
  .pen-next li b{display:block;min-width:0}
}
@media (max-width:560px){ .pen-stats{grid-template-columns:1fr} }

/* ---------- 펜클래스 영상 + 피드백 과정 ---------- */
.pen-film{margin-top:-6px}
.pen-video{position:relative;border-radius:16px;overflow:hidden;background:#03051a;aspect-ratio:16/9;box-shadow:0 30px 70px rgba(18,28,76,.35);border-bottom:3px solid var(--gold)}
.pen-video video{display:block;width:100%;height:100%;object-fit:cover}
.pen-video__cap{margin-top:12px;font-size:14px;color:#888;text-align:center}
.pen-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;counter-reset:none}
.pen-flow li{position:relative;border:1px solid var(--line);border-radius:12px;padding:24px 20px;background:#fff}
.pen-flow li:not(:last-child)::after{content:"›";position:absolute;right:-12px;top:50%;transform:translateY(-50%);width:22px;height:22px;border-radius:50%;background:var(--navy);color:var(--gold-l);font-size:16px;font-weight:900;display:grid;place-items:center;z-index:1}
.pen-flow__n{font-size:13px;font-weight:800;color:var(--gold-d);letter-spacing:.08em}
.pen-flow b{display:block;font-size:19px;color:#222;margin:8px 0 10px;letter-spacing:-.03em}
.pen-flow b em{font-style:normal;color:var(--gold-d)}
.pen-flow p{font-size:14px;line-height:1.65;color:#666}
.pen-flow li.is-result{background:radial-gradient(circle at 85% 15%,#2a3d9a,var(--navy-d) 70%);border-color:transparent;border-bottom:3px solid var(--gold)}
.pen-flow li.is-result b{background:var(--gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:22px}
.pen-flow li.is-result p{color:#cdd3ea}
.pen-flow li.is-result .pen-flow__n{color:var(--gold-l);font-size:18px}
@media (max-width:1100px){ .pen-flow{grid-template-columns:repeat(2,1fr)} .pen-flow li:nth-child(2):not(:last-child)::after{display:none} }
@media (max-width:560px){ .pen-flow{grid-template-columns:1fr} .pen-flow li:not(:last-child)::after{display:none} }

/* =========================================================
   하위 페이지 모바일 정리 (≤900px) — 짧고 훑어보기 쉽게
   ========================================================= */
@media (max-width:900px){
  .toc{top:60px}                                   /* 모바일 헤더 높이 60px */
  .snb__head{padding:14px 16px}
  .snb__head h2{font-size:18px}
  .page-head{padding-bottom:16px;margin-bottom:22px}
  .sec{margin-bottom:44px}
  .sec__title{font-size:21px;margin-bottom:14px}
  .lead{font-size:18px}

  /* 단계: 큰 원형 4칸 → 왼쪽 작은 번호 + 오른쪽 설명 목록 */
  .steps,.steps--2,.steps--3{grid-template-columns:1fr;row-gap:0}
  .steps li{display:grid;grid-template-columns:44px 1fr;column-gap:14px;align-items:center;text-align:left;padding:12px 0;border-bottom:1px dashed #e1e5f2}
  .steps li:last-child{border-bottom:0}
  .steps li::before{grid-row:1/3;width:44px;height:44px;margin:0;font-size:15px;box-shadow:0 0 0 2px #dfe5fb}
  .steps b{margin-bottom:2px;font-size:16px}

  /* 강사: 세로 큰 카드 → 사진 왼쪽 + 정보 오른쪽 */
  .teachers,.teachers--4{grid-template-columns:1fr;gap:12px}
  .teacher{display:grid;grid-template-columns:110px 1fr}
  .teacher__img,.teacher__noimg{aspect-ratio:auto;height:100%;min-height:130px}
  .teacher__noimg{font-size:11px;gap:6px}
  .teacher__noimg img{width:40px;height:auto}
  .teacher__body{padding:14px 14px 16px}
  .teacher__name{font-size:18px;margin:2px 0 6px}

  /* 원장 사진 */
  .greet__img{max-width:200px;margin:0 auto;padding-top:14px}

  /* 시설 사진 2열 */
  .gallery{grid-template-columns:1fr 1fr;gap:10px}
  .gallery figcaption{font-size:13px}
  .gallery figcaption span{font-size:12px}

  /* 넓은 표: 줄이지 않고 옆으로 밀어서 보기 */
  .tbl-wrap{position:relative;margin:0 -16px;padding:0 16px}
  .tbl-wrap>.tbl:has(thead th:nth-child(5)){min-width:600px}
  .tbl-wrap.is-scroll::before{content:"← 옆으로 밀어서 보기 →";display:block;font-size:12px;color:#999;text-align:right;margin-bottom:6px;position:sticky;left:0}
}
@media (max-width:560px){
  .gallery{grid-template-columns:1fr 1fr}
}