@charset "UTF-8";
:root{--navy:#10245c;--blue:#4965f5;--blue2:#7085ff;--mint:#15c6a3;--ink:#17243b;--muted:#667085;--line:#e5eaf2;--soft:#f5f7ff;--white:#fff;--shadow:0 18px 50px rgba(23,55,110,.10);--radius:26px;}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Pretendard,"Noto Sans KR","Malgun Gothic",Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.55}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.wrap{width:min(1180px,calc(100% - 40px));margin:0 auto}.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid rgba(225,232,243,.8)}.header-inner{height:76px;display:flex;align-items:center;gap:28px}.brand-word{display:inline-flex;align-items:flex-end;gap:9px;white-space:nowrap;color:var(--navy)}.brand-word strong{font-size:28px;line-height:1;font-weight:950;letter-spacing:-2px}.brand-word span{font-size:9px;line-height:1.2;font-weight:900;letter-spacing:.14em;color:var(--blue);padding-bottom:2px}.nav{display:flex;align-items:center;gap:24px;margin-left:auto;font-weight:700;font-size:14px}.nav a{position:relative;padding:26px 0}.nav a:after{content:"";position:absolute;left:0;right:100%;bottom:18px;height:3px;background:linear-gradient(90deg,var(--blue),var(--mint));border-radius:4px;transition:.25s}.nav a:hover:after{right:0}.header-actions{display:flex;align-items:center;gap:12px;font-size:13px}.join-link,.login-link{font-weight:800;color:#4b5874}.join-link{color:var(--blue)}.header-cta{display:inline-flex;align-items:center;justify-content:center;background:var(--blue);color:#fff;border-radius:13px;padding:12px 18px;font-weight:800;box-shadow:0 8px 20px rgba(73,101,245,.22)}.menu-btn{display:none;margin-left:auto;border:0;background:none;font-size:27px;color:var(--navy)}
.hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#f8fbff 0%,#eff7ff 52%,#fff 100%);min-height:650px}.hero-bg{position:absolute;inset:0;background:url('/common/images/araonpick/hero-online-class.jpg') center/cover no-repeat}.hero-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(250,253,255,.98) 0%,rgba(250,253,255,.93) 34%,rgba(250,253,255,.22) 63%,rgba(250,253,255,.03) 100%)}.hero-inner{position:relative;z-index:2;min-height:650px;display:flex;align-items:center}.hero-copy{width:52%;padding:64px 0}.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border:1px solid #cfe0ff;background:rgba(255,255,255,.82);border-radius:999px;color:var(--blue);font-weight:800;font-size:14px}.eyebrow:before{content:"";width:8px;height:8px;background:var(--mint);border-radius:50%;box-shadow:0 0 0 5px rgba(17,201,165,.13)}.hero h1{font-size:52px;line-height:1.16;letter-spacing:-2.8px;margin:22px 0 18px;color:#071b45}.hero h1 .pick{color:var(--blue);position:relative}.hero h1 .pick:after{content:"✓";position:absolute;right:-22px;top:-11px;font-size:24px;color:var(--mint);transform:rotate(-7deg)}.hero-desc{font-size:19px;color:#4c5d78;margin:0 0 30px}.actions{display:flex;gap:12px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 25px;border-radius:14px;font-weight:800;border:1px solid transparent;transition:.2s}.btn-primary{color:#fff;background:linear-gradient(135deg,var(--blue),#0754e8);box-shadow:0 14px 28px rgba(23,105,255,.22)}.btn-outline{border-color:#b9d0ff;background:rgba(255,255,255,.88);color:var(--blue)}.btn:hover{transform:translateY(-2px)}.hero-badges{display:flex;gap:8px;margin-top:28px;flex-wrap:wrap}.hero-badges span{padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.86);border:1px solid #dce8fa;font-size:13px;font-weight:700;color:#445673}.trust-strip{position:relative;z-index:4;margin-top:-44px}.trust-grid{background:#fff;border:1px solid #e8edf5;border-radius:24px;box-shadow:var(--shadow);display:grid;grid-template-columns:repeat(4,1fr);padding:22px 14px}.trust-item{display:flex;align-items:center;gap:13px;padding:8px 20px;border-right:1px solid #edf1f7}.trust-item:last-child{border:0}.trust-icon{width:44px;height:44px;border-radius:14px;background:var(--soft);display:grid;place-items:center;color:var(--blue);font-size:22px;flex:0 0 auto}.trust-item b{display:block;font-size:14px}.trust-item small{display:block;color:var(--muted);font-size:12px;margin-top:3px}
.section{padding:100px 0}.section.soft{background:var(--soft)}.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:38px}.section-title{margin:0;font-size:38px;line-height:1.25;letter-spacing:-1.8px;color:#0b214d}.section-title span{color:var(--blue)}.section-desc{margin:10px 0 0;color:var(--muted);font-size:16px}.kicker{display:block;color:var(--mint);font-size:14px;font-weight:900;letter-spacing:.08em;margin-bottom:9px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.feature-card{background:#fff;border:1px solid #e5ebf4;border-radius:22px;padding:34px;box-shadow:0 12px 35px rgba(38,68,118,.07);transition:.25s}.feature-card:hover{transform:translateY(-6px);box-shadow:0 22px 45px rgba(38,68,118,.11)}.feature-icon{width:62px;height:62px;border-radius:20px;background:linear-gradient(145deg,#eef5ff,#fff);border:1px solid #dbe8ff;display:grid;place-items:center;font-size:30px;margin-bottom:22px}.feature-card h3{margin:0 0 11px;font-size:21px}.feature-card p{margin:0;color:var(--muted);font-size:15px}.lesson-layout{display:grid;grid-template-columns:340px 1fr;align-items:center;gap:54px}.lesson-copy .bullet{margin-top:28px;display:grid;gap:11px}.lesson-copy .bullet span{display:flex;align-items:center;gap:10px;font-weight:700;color:#3d4c67}.lesson-copy .bullet i{font-style:normal;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#e5fff8;color:#08a887;font-size:13px}.lesson-frame{position:relative;background:#fff;padding:14px;border-radius:26px;border:1px solid #dfe8f5;box-shadow:0 25px 60px rgba(13,44,95,.16)}.lesson-frame img{display:block;width:100%;border-radius:18px}.callout{position:absolute;padding:11px 14px;background:rgba(255,255,255,.96);border:1px solid #cfe0ff;border-radius:14px;box-shadow:0 8px 25px rgba(29,69,132,.1);font-size:12px;font-weight:800}.callout.one{right:-22px;top:12%}.callout.two{right:-28px;bottom:17%;border-color:#bfeedd}.callout.three{left:-26px;bottom:10%}
.subject-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.subject-card{background:#fff;border:1px solid #e4ebf5;border-radius:20px;padding:25px;display:flex;gap:15px;align-items:flex-start}.subject-card .ico{width:48px;height:48px;border-radius:14px;background:#eff5ff;display:grid;place-items:center;font-size:24px}.subject-card h3{margin:0 0 6px;font-size:19px}.subject-card p{margin:0;font-size:13px;color:var(--muted)}
.teacher-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.teacher-card{overflow:hidden;background:#fff;border:1px solid #e3e9f2;border-radius:22px;box-shadow:0 12px 30px rgba(32,59,100,.06)}.teacher-photo{aspect-ratio:4/5;overflow:hidden;background:#f5f7fa}.teacher-photo img{width:100%;height:100%;object-fit:cover;object-position:center 22%;display:block;transition:.35s}.teacher-card:hover .teacher-photo img{transform:scale(1.035)}.teacher-info{padding:20px}.teacher-info h3{margin:0 0 7px;font-size:18px}.tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:11px}.tag{font-size:11px;font-weight:800;color:var(--blue);background:#eef5ff;border-radius:999px;padding:5px 9px}.teacher-info p{margin:0;color:var(--muted);font-size:13px}
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:15px;counter-reset:step}.step{position:relative;background:#fff;border:1px solid #e4eaf3;border-radius:20px;padding:25px 20px;min-height:180px}.step:before{counter-increment:step;content:"0" counter(step);display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--blue);color:#fff;font-size:12px;font-weight:900;margin-bottom:18px}.step:not(:last-child):after{content:"→";position:absolute;right:-13px;top:47%;z-index:2;color:#9eb5d5;font-weight:900}.step h3{font-size:17px;margin:0 0 9px}.step p{font-size:13px;color:var(--muted);margin:0}.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.review{background:#fff;border:1px solid #e4eaf3;border-radius:21px;padding:29px;min-height:190px}.quote{color:var(--mint);font-size:36px;font-weight:900;line-height:1}.review p{font-size:15px;line-height:1.75;margin:5px 0 18px}.review small{color:#7a879b;font-weight:700}.final-cta{padding:75px 0}.cta-box{position:relative;overflow:hidden;border-radius:28px;padding:44px 50px;background:linear-gradient(110deg,#4965f5 0%,#5b7cf6 50%,#15c6a3 100%);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:30px}.cta-box:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.11);right:-70px;top:-120px}.cta-box h2{font-size:30px;line-height:1.3;margin:0 0 8px;letter-spacing:-1px}.cta-box p{margin:0;color:rgba(255,255,255,.83)}.cta-actions{display:flex;gap:10px;z-index:2}.cta-actions .btn{background:#fff;color:var(--blue)}.cta-actions .kakao{background:#ffe500;color:#241f00}.site-footer{border-top:1px solid #e5eaf2;background:#fafcff;padding:42px 0 55px}.footer-inner{display:grid;grid-template-columns:1.5fr 2fr 1fr;gap:35px}.footer-logo p{font-size:13px;color:#7b8799}.footer-links{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.footer-links b{display:block;margin-bottom:10px;font-size:14px}.footer-links a{display:block;color:#748095;font-size:12px;margin:6px 0}.footer-contact b{font-size:14px}.footer-contact strong{display:block;font-size:18px;color:var(--navy);margin:8px 0}.footer-contact span{font-size:12px;color:#748095}.copyright{margin-top:28px;padding-top:22px;border-top:1px solid #e7ebf1;color:#98a1b1;font-size:11px}.admin-link{opacity:.45;font-size:11px;margin-left:8px}.mobile-nav{display:none}

.text-link{font-weight:900;color:var(--blue);white-space:nowrap}.ida-flow{display:grid;grid-template-columns:1fr 38px 1fr 38px 1fr;align-items:center;gap:12px;margin-bottom:34px}.ida-flow article{min-height:245px;background:#fff;border:1px solid #e0e6f4;border-radius:24px;padding:30px;box-shadow:0 12px 35px rgba(38,68,118,.06)}.ida-flow article>span{display:grid;place-items:center;width:54px;height:54px;border-radius:18px;background:linear-gradient(145deg,var(--blue),#6e84ff);color:#fff;font-size:28px;font-weight:950;margin-bottom:16px}.ida-flow article small{font-size:10px;letter-spacing:.14em;color:var(--mint);font-weight:950}.ida-flow article h3{margin:5px 0 8px;font-size:20px}.ida-flow article p{margin:0;color:var(--muted);font-size:14px}.ida-flow>i{font-style:normal;text-align:center;font-size:25px;color:#9aa9c8}.learning-room-preview{display:grid;grid-template-columns:360px 1fr;gap:50px;align-items:center;margin-top:54px;padding:46px;border-radius:30px;background:linear-gradient(135deg,#15275f,#294cc1);color:#fff;overflow:hidden}.preview-copy .mini-label{display:inline-block;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.12);font-size:12px;font-weight:800}.preview-copy h3{font-size:30px;line-height:1.3;margin:15px 0 10px}.preview-copy p{color:rgba(255,255,255,.74);font-size:14px;margin:0 0 23px}.preview-copy .btn-primary{background:#fff;color:var(--blue);box-shadow:none}.preview-panel{background:#fff;color:var(--ink);border-radius:23px;padding:25px;box-shadow:0 24px 55px rgba(0,0,0,.23)}.preview-top{display:flex;align-items:center;justify-content:space-between;padding-bottom:18px;border-bottom:1px solid #e8ecf5}.preview-top span{font-size:12px;color:var(--muted)}.preview-top strong{color:var(--blue);font-size:18px}.preview-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}.preview-grid>div{border:1px solid #e4e9f3;background:#f8faff;border-radius:16px;padding:17px}.preview-grid .wide{grid-column:1/-1}.preview-grid small,.preview-grid b,.preview-grid span{display:block}.preview-grid small{color:var(--blue);font-size:11px;font-weight:900}.preview-grid b{font-size:15px;margin:6px 0}.preview-grid span{color:var(--muted);font-size:11px}.role-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.role-grid article{background:#fff;border:1px solid #e1e7f1;border-radius:24px;padding:30px;box-shadow:0 12px 32px rgba(35,60,105,.06)}.role-name{display:inline-flex;padding:6px 11px;border-radius:999px;background:#eef1ff;color:var(--blue);font-size:12px;font-weight:900}.role-name.teacher{background:#e8fbf6;color:#09977c}.role-name.admin{background:#fff2dc;color:#ad6900}.role-grid h3{font-size:23px;margin:14px 0}.role-grid ul{padding:0;margin:0 0 22px;list-style:none;color:var(--muted)}.role-grid li{position:relative;padding:6px 0 6px 20px;font-size:14px}.role-grid li:before{content:"✓";position:absolute;left:0;color:var(--mint);font-weight:900}.role-grid a{font-weight:900;color:var(--blue)}.faq-layout{display:grid;grid-template-columns:330px 1fr;gap:70px;align-items:start}.faq-layout .btn{margin-top:24px}.faq-list details{background:#fff;border:1px solid #e1e7f1;border-radius:16px;margin-bottom:12px;padding:0 20px}.faq-list summary{cursor:pointer;padding:20px 0;font-weight:900;list-style:none}.faq-list summary:after{content:"＋";float:right;color:var(--blue)}.faq-list details[open] summary:after{content:"−"}.faq-list p{margin:0 0 20px;color:var(--muted);font-size:14px}
.sub-hero{padding:82px 0 68px;background:linear-gradient(135deg,#f3f6ff,#ecfbf7);text-align:center}.sub-hero h1{font-size:42px;letter-spacing:-2px;color:var(--navy);margin:5px 0 10px}.sub-hero p{margin:0;color:var(--muted)}.content-page{padding:70px 0 100px}.narrow{max-width:850px}.content-page .faq-list details{box-shadow:0 8px 25px rgba(35,60,105,.04)}.page-actions{display:flex;justify-content:center;gap:12px;margin-top:38px}.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.guide-grid article{position:relative;border:1px solid #e1e7f1;border-radius:22px;padding:30px;min-height:260px;background:#fff}.guide-grid article>span{display:block;color:var(--blue);font-weight:950;font-size:13px;letter-spacing:.1em}.guide-grid h2{font-size:22px;margin:15px 0 10px}.guide-grid p{font-size:14px;color:var(--muted);margin:0 0 18px}.guide-grid a{position:absolute;left:30px;bottom:27px;color:var(--blue);font-weight:900}.guide-callout{margin-top:30px;border-radius:24px;padding:34px 38px;background:#f2f5ff;display:flex;align-items:center;justify-content:space-between;gap:30px}.guide-callout h2{margin:0 0 8px}.guide-callout p{margin:0;color:var(--muted)}
@media(max-width:980px){.nav,.header-actions{display:none}.menu-btn{display:block}.mobile-nav.open{display:flex;position:fixed;left:0;right:0;top:76px;background:#fff;flex-direction:column;padding:20px 24px;box-shadow:0 18px 30px rgba(0,0,0,.1);z-index:49;max-height:calc(100vh - 76px);overflow:auto}.mobile-nav a{padding:12px 0;font-weight:800;border-bottom:1px solid #edf0f5}.hero{min-height:auto}.hero-inner{min-height:720px;align-items:flex-start}.hero-copy{width:100%;padding-top:75px}.hero-bg{background-position:67% center}.hero-bg:after{background:linear-gradient(180deg,rgba(250,253,255,1) 0%,rgba(250,253,255,.96) 42%,rgba(250,253,255,.4) 65%,rgba(250,253,255,.15) 100%)}.hero h1{font-size:43px}.trust-grid{grid-template-columns:repeat(2,1fr)}.trust-item:nth-child(2){border-right:0}.trust-item:nth-child(-n+2){border-bottom:1px solid #edf1f7}.feature-grid{grid-template-columns:1fr}.ida-flow{grid-template-columns:1fr}.ida-flow>i{transform:rotate(90deg)}.learning-room-preview{grid-template-columns:1fr}.lesson-layout{grid-template-columns:1fr}.lesson-copy{text-align:center}.lesson-copy .bullet{max-width:430px;margin:25px auto 0;text-align:left}.role-grid{grid-template-columns:1fr}.subject-grid{grid-template-columns:repeat(2,1fr)}.teacher-grid{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:repeat(2,1fr)}.step:not(:last-child):after{display:none}.review-grid{grid-template-columns:1fr}.faq-layout{grid-template-columns:1fr;gap:32px}.footer-inner{grid-template-columns:1fr 2fr}.footer-contact{grid-column:1/-1}.section{padding:80px 0}}
@media(max-width:640px){.wrap{width:min(100% - 28px,1180px)}.header-inner{height:66px}.brand-word strong{font-size:25px}.mobile-nav.open{top:66px;max-height:calc(100vh - 66px)}.hero-inner{min-height:690px}.hero-copy{padding-top:55px}.hero h1{font-size:36px;letter-spacing:-2px}.hero-desc{font-size:16px}.btn{min-height:50px;padding:0 19px}.hero-bg{background-position:63% bottom;background-size:auto 60%;background-repeat:no-repeat}.hero-badges{display:none}.trust-strip{margin-top:-25px}.trust-grid{grid-template-columns:1fr;padding:8px 15px}.trust-item,.trust-item:nth-child(2){border-right:0;border-bottom:1px solid #edf1f7}.trust-item:last-child{border-bottom:0}.section{padding:65px 0}.section-title{font-size:30px}.section-head{align-items:flex-start;flex-direction:column}.learning-room-preview{padding:27px 20px}.preview-copy h3{font-size:25px}.preview-panel{padding:17px}.preview-grid{grid-template-columns:1fr}.preview-grid .wide{grid-column:auto}.subject-grid,.teacher-grid,.steps{grid-template-columns:1fr}.teacher-grid{grid-template-columns:repeat(2,1fr);gap:12px}.teacher-info{padding:15px}.teacher-info h3{font-size:15px}.teacher-info p{font-size:11px}.feature-card{padding:27px}.callout{display:none}.lesson-frame{padding:8px;border-radius:18px}.lesson-frame img{border-radius:13px}.cta-box{padding:35px 25px;align-items:flex-start;flex-direction:column}.cta-box h2{font-size:25px}.cta-actions{width:100%;flex-direction:column}.cta-actions .btn{width:100%}.footer-inner{grid-template-columns:1fr}.footer-links{grid-template-columns:repeat(3,1fr)}.footer-contact{grid-column:auto}}
@media(max-width:900px){.guide-grid{grid-template-columns:repeat(2,1fr)}.guide-callout{align-items:flex-start;flex-direction:column}}
@media(max-width:640px){.sub-hero{padding:58px 0 50px}.sub-hero h1{font-size:34px}.content-page{padding:45px 0 70px}.guide-grid{grid-template-columns:1fr}.guide-callout{padding:27px}.page-actions{flex-direction:column}.page-actions .btn{width:100%}}
