/*
Theme Name: makeit
Description: makeit 사이트 제작 서비스 전용 테마
Version: 4.9.9
Author: 도기안
*/
:root{--p:#6A3DE8;--p2:#5228CF;--pl:#F4F0FE;--t:#111;--t2:#444;--line:#e3e3e3;--w:1200px}
*{box-sizing:border-box}
html{scroll-behavior:auto}
body{margin:0;font-family:Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo",sans-serif;color:var(--t);background:#fff;font-weight:400;line-height:1.6;-webkit-font-smoothing:antialiased;word-break:keep-all}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}
img{max-width:100%;height:auto}
.wrap{max-width:var(--w);margin:0 auto;padding:0 20px}
/* scrollbar: 스크롤 중에만 */
html{scrollbar-width:thin;scrollbar-color:transparent transparent;transition:scrollbar-color .2s}html.scrolling{scrollbar-color:#bbb transparent}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:transparent}
html.scrolling::-webkit-scrollbar-thumb{background:#bbb}
/* 버튼 표준 */
.btn{display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 16px;font-size:15px;font-weight:500;color:#111;background:#fff;border:1px solid #ccc;border-radius:0;cursor:pointer;line-height:1;white-space:nowrap}
.btn:hover{background:#f5f5f5;border-color:#999;text-decoration:underline;text-underline-offset:3px}
.btn:active{background:#e8e8e8}
.btn-l{height:48px;padding:0 24px;font-size:16px}
.btn-s{height:30px;padding:0 12px;font-size:13px}
.btn-core{background:var(--p);border-color:var(--p);color:#fff}
.btn-core:hover{background:var(--p2);border-color:var(--p2)}
.btn-ghost{background:transparent;border-color:rgba(255,255,255,.7);color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.12);border-color:#fff}
.btn-white{background:#fff;border-color:#fff;color:var(--t)}
.btn-white:hover{background:#f3efff;border-color:#f3efff}
/* 헤더 */
.hd{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}
.hd .wrap{display:flex;align-items:center;height:68px;gap:28px}
.logo{display:flex;align-items:center;gap:8px;font-size:22px;font-weight:600;letter-spacing:-.3px}
.logo:hover{text-decoration:none}
.logo i{display:inline-block;width:26px;height:26px;background:var(--p);position:relative}
.logo i:after{content:"";position:absolute;left:7px;top:7px;width:12px;height:12px;border:2px solid #fff;border-right:0;border-bottom:0}
.gnb{display:flex;gap:26px;margin-left:auto;font-size:15px;font-weight:500}
.gnb a{color:#222}
.hd .btn{margin-left:6px}
.mtoggle{display:none;margin-left:auto;background:none;border:1px solid #ccc;width:36px;height:36px;cursor:pointer}
/* 히어로 */
.hero{background:linear-gradient(135deg,#7A4CF0 0%,#6A3DE8 45%,#5228CF 100%);color:#fff;padding:96px 0 104px}
.hero .eyebrow{display:inline-block;font-size:14px;font-weight:500;padding:6px 12px;border:1px solid rgba(255,255,255,.5);margin-bottom:22px}
.hero h1{font-size:46px;line-height:1.3;font-weight:600;margin:0 0 20px;letter-spacing:-1px}
.hero p{font-size:18px;margin:0 0 36px;color:rgba(255,255,255,.92);max-width:640px}
.hero .acts{display:flex;gap:10px;flex-wrap:wrap}
.hero .points{display:flex;gap:28px;margin-top:56px;padding-top:28px;border-top:1px solid rgba(255,255,255,.25);flex-wrap:wrap;font-size:15px}
.hero .points b{display:block;font-size:20px;font-weight:600;margin-bottom:2px}
/* 섹션 */
.sec{padding:60px 0}
.sec.alt{background:var(--pl)}
.sec h2{font-size:30px;font-weight:600;margin:0 0 10px;letter-spacing:-.5px}
.sec .lead{font-size:16px;color:var(--t2);margin:0 0 32px}
.tag{display:inline-block;font-size:13px;font-weight:500;color:var(--p);margin-bottom:8px}
.grid{display:grid;gap:16px}
.g4{grid-template-columns:repeat(4,1fr)}.g3{grid-template-columns:repeat(3,1fr)}
.card{background:#fff;border:1px solid var(--line);padding:24px 22px;display:block}
.card:hover{border-color:var(--p);text-decoration:none}
.card h3{font-size:18px;font-weight:600;margin:12px 0 6px}
.card p{font-size:15px;color:var(--t2);margin:0}
.ico{width:40px;height:40px;background:var(--pl);display:flex;align-items:center;justify-content:center}
.sec.alt .ico{background:#fff}
.ico svg{width:22px;height:22px;stroke:var(--p);fill:none;stroke-width:1.8}
.card .more{display:inline-block;margin-top:14px;font-size:14px;font-weight:500;color:var(--p)}
/* 상품 */
.plan{border:1px solid var(--line);background:#fff;padding:30px 26px;display:flex;flex-direction:column}
.plan.best{border:1px solid var(--p);box-shadow:inset 0 3px 0 var(--p)}
.plan h3{font-size:20px;font-weight:600;margin:0 0 6px}
.plan .sub{font-size:15px;color:var(--t2);margin:0 0 18px}
.plan ul{list-style:none;padding:0;margin:0 0 24px;font-size:15px;flex:1}
.plan li{padding:7px 0 7px 22px;position:relative;border-top:1px solid #f0f0f0}
.plan li:before{content:"";position:absolute;left:2px;top:15px;width:9px;height:5px;border-left:2px solid var(--p);border-bottom:2px solid var(--p);transform:rotate(-45deg)}
.plan .price{font-size:15px;font-weight:500;margin-bottom:14px}
/* 모듈 */
.mod{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);padding:18px}
.mod h4{margin:0 0 2px;font-size:16px;font-weight:600}.mod p{margin:0;font-size:14px;color:var(--t2)}
/* 데모 */
.demo{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center}
.demo-box{border:1px solid var(--line);background:#fff}
.demo-tabs{display:flex;border-bottom:1px solid var(--line)}
.demo-tabs button{flex:1;height:44px;border:0;border-right:1px solid var(--line);background:#fff;font:inherit;font-size:15px;font-weight:500;color:#444;cursor:pointer}
.demo-tabs button:last-child{border-right:0}
.demo-tabs button:hover{text-decoration:underline;text-underline-offset:3px;background:#f7f7f7}
.demo-tabs button.on{background:#efefef;color:#111;font-weight:600;box-shadow:inset 0 -2px 0 var(--p)}
.demo-view{padding:26px;min-height:220px}
.demo-view h4{margin:0 0 12px;font-size:17px;font-weight:600}
.demo-view ul{margin:0;padding-left:18px;color:var(--t2);font-size:15px}
.demo-list{list-style:none;padding:0;margin:0 0 24px}
.demo-list li{padding:10px 0;border-bottom:1px solid var(--line);font-size:16px}
.demo-list li b{font-weight:600;color:var(--p);margin-right:8px}
/* 과정 */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);background:#fff}
.step{padding:26px 22px;border-right:1px solid var(--line)}
.step:last-child{border-right:0}
.step .n{font-size:14px;font-weight:600;color:var(--p)}
.step h4{font-size:18px;font-weight:600;margin:6px 0}
.step p{margin:0;font-size:15px;color:var(--t2)}
/* 이사 서비스 */
.move{display:flex;align-items:center;justify-content:space-between;gap:24px;border:1px solid var(--p);background:#fff;padding:30px 32px}
.move h3{margin:0 0 6px;font-size:22px;font-weight:600}.move p{margin:0;color:var(--t2)}
/* 후기 */
.review-empty{border:1px dashed #cfc5f5;background:#fff;padding:40px;text-align:center;color:#444}
/* CTA */
.cta{background:linear-gradient(135deg,#6A3DE8,#5228CF);color:#fff;padding:60px 0}
.cta .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px}
.cta h2{margin:0 0 6px;font-size:28px;font-weight:600}.cta p{margin:0;color:rgba(255,255,255,.9)}
/* 푸터 */
.ft{margin-top:90px;border-top:1px solid var(--line);padding:36px 0 44px;font-size:14px;color:#555}
.cta+.ft{margin-top:0}
.ft .logo{font-size:18px;color:#333;margin-bottom:10px}
.ft .logo i{background:#333;width:20px;height:20px}.ft .logo i:after{left:5px;top:5px;width:9px;height:9px}
.ft nav{display:flex;gap:18px;margin-bottom:10px;color:#333}
/* 모바일 */
@media(max-width:900px){
 .gnb{display:none;position:absolute;top:68px;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);flex-direction:column;gap:0;padding:6px 20px}
 .gnb.open{display:flex}.gnb a{padding:12px 0;border-bottom:1px solid #f0f0f0}
 .mtoggle{display:block}.hd .btn{display:none}
 .g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:1fr}
 .demo{grid-template-columns:1fr}.steps{grid-template-columns:repeat(2,1fr)}
 .step:nth-child(2){border-right:0}.step:nth-child(-n+2){border-bottom:1px solid var(--line)}
}
@media(max-width:600px){
 .hd .wrap{height:58px}.gnb{top:58px}
 .hero{padding:60px 0 64px}.hero h1{font-size:30px}.hero p{font-size:16px}
 .hero .acts{display:grid;grid-template-columns:1fr 1fr}
 .hero .points{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;font-size:13px;margin-top:40px}
 .hero .points b{font-size:16px}
 .sec h2{font-size:24px}.sec .lead{margin-bottom:24px}
 .card{padding:18px 16px}.card h3{font-size:16px}.card p{font-size:14px}
 .move,.cta .wrap{flex-direction:column;align-items:flex-start}
 .move{padding:24px 20px}
 .steps{grid-template-columns:1fr}.step{border-right:0!important;border-bottom:1px solid var(--line)}.step:last-child{border-bottom:0}
 .ft{margin-top:60px}
 .ft nav{flex-wrap:wrap}
}
/* 히어로 2단 + 화면 이미지 */
.hero .wrap.hero-in{display:grid;grid-template-columns:1fr 1.05fr;gap:48px;align-items:center}
.shots{position:relative;height:430px}
.shot{position:absolute;background:#fff;border:1px solid rgba(255,255,255,.6);box-shadow:0 24px 50px rgba(30,10,90,.35)}
.shot .bar{height:22px;background:#f1f1f1;border-bottom:1px solid #e2e2e2;display:flex;align-items:center;gap:5px;padding:0 9px}
.shot .bar i{width:7px;height:7px;border-radius:50%;background:#cfcfcf;display:block}
.shot .bar span{margin-left:8px;font-size:10px;color:#666}
.shot img{display:block;width:100%}
.shot.s1{right:0;top:0;width:88%}
.shot.s2{left:0;bottom:0;width:62%}
/* 제작 사례 */
.works{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
.work{display:block;border:1px solid var(--line);background:#fff}
.work:hover{border-color:var(--p);text-decoration:none}
.work .shot-in{border-bottom:1px solid var(--line);overflow:hidden;aspect-ratio:1200/626}
.work .shot-in img{display:block;width:100%;transition:transform .4s}
.work:hover .shot-in img{transform:scale(1.02)}
.work .meta{padding:20px 22px;display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.work .k{font-size:13px;font-weight:500;color:var(--p)}
.work h3{margin:4px 0 6px;font-size:19px;font-weight:600}
.work p{margin:0;font-size:15px;color:var(--t2)}
.work .go{flex:none;font-size:14px;font-weight:500;color:#111;border:1px solid #ccc;height:30px;padding:0 12px;display:inline-flex;align-items:center}
.work:hover .go{text-decoration:underline;text-underline-offset:3px;background:#f5f5f5;border-color:#999}
@media(max-width:900px){
 .hero .wrap.hero-in{grid-template-columns:1fr;gap:36px}
 .shots{height:auto}.shot{position:relative;width:100%!important}.shot.s2{display:none}
 .works{grid-template-columns:1fr}
}
/* 히어로 일러스트 */
.ill{position:relative;height:420px}
.ill-win{position:absolute;right:0;top:10px;width:92%;background:#fff;box-shadow:0 30px 60px rgba(30,10,90,.32)}
.ill-top{height:26px;background:#f4f1fe;display:flex;align-items:center;gap:6px;padding:0 12px;border-bottom:1px solid #ebe5fd}
.ill-top i{width:8px;height:8px;border-radius:50%;background:#d6ccfa;display:block}
.ill-body{display:flex;height:330px}
.ill-side{width:22%;background:#faf8ff;border-right:1px solid #eee9fd;padding:18px 14px;display:flex;flex-direction:column;gap:12px}
.ill-side b{display:block;width:60%;height:12px;background:var(--p);margin-bottom:10px}
.ill-side span{display:block;height:8px;background:#e6e0fb;width:80%}
.ill-side span.on{background:var(--p);opacity:.55}
.ill-main{flex:1;padding:18px;display:flex;flex-direction:column;gap:14px}
.ill-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.ill-stats div{border:1px solid #eee9fd;padding:10px 12px}
.ill-stats em{display:block;font-style:normal;font-size:11px;color:#666}
.ill-stats strong{font-size:20px;font-weight:600;color:#111}
.ill-chart{flex:1;border:1px solid #eee9fd;display:flex;align-items:flex-end;gap:8%;padding:14px 16px 0}
.ill-chart span{flex:1;background:#ddd3fb}
.ill-chart span.hi{background:var(--p)}
.ill-rows p{margin:0 0 7px;display:flex;align-items:center;gap:8px}
.ill-rows i{width:8px;height:8px;background:var(--p);display:block;opacity:.6}
.ill-rows span{height:7px;background:#ece7fc;flex:1}
.ill-phone{position:absolute;left:0;bottom:0;width:150px;height:270px;background:#fff;border:6px solid #1c1530;border-radius:20px;padding:10px;box-shadow:0 24px 50px rgba(20,5,60,.4);display:flex;flex-direction:column;gap:8px}
.ph-bar{height:8px;width:40%;background:#e6e0fb;margin:2px auto 4px}
.ph-hero{height:90px;background:linear-gradient(135deg,#7A4CF0,#5228CF)}
.ill-phone span{height:7px;background:#ece7fc}.ill-phone span.s{width:60%}
.ph-btn{margin-top:auto;height:26px;background:var(--p)}
/* 기능 모듈 목록형 */
.mods{display:grid;grid-template-columns:repeat(2,1fr);column-gap:48px;border-top:1px solid #d9d0f7}
.mods .mod{background:none;border:0;border-bottom:1px solid #d9d0f7;padding:18px 4px;align-items:center}
.mods .mod .ico{background:#fff}
/* 업종 카드는 링크 아님 */
div.card:hover{border-color:var(--line)}
/* 상담 폼 */
.cta-in{display:grid!important;grid-template-columns:1fr 1.1fr;gap:56px;align-items:start}
.cta-txt h2{font-size:30px;line-height:1.35}
.cform{background:#fff;color:#111;padding:28px;display:flex;flex-direction:column;gap:14px}
.cform label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:500}
.cform input[type=text],.cform input:not([type]),.cform input[type=email],.cform select,.cform textarea{font:inherit;font-size:15px;font-weight:400;border:1px solid #ccc;padding:9px 11px;border-radius:0;background:#fff;color:#111;width:100%}
.cform input:focus,.cform select:focus,.cform textarea:focus{outline:none;border-color:var(--p)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.chips{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:-6px}
.chips label{display:block}
.chips input{position:absolute;opacity:0}
.chips span{display:flex;align-items:center;justify-content:center;height:36px;border:1px solid #ccc;font-size:14px;font-weight:500;cursor:pointer}
.chips span:hover{background:#f5f5f5;border-color:#999;text-decoration:underline;text-underline-offset:3px}
.chips input:checked+span{background:#efefef;border-color:#111;font-weight:600}
.cform .agree{flex-direction:row;align-items:flex-start;gap:8px;font-weight:400;font-size:14px;color:#333}
.cform .agree input{margin-top:3px}
.cform .agree small{color:#555}
.cform .btn{border-color:var(--p);background:var(--p);color:#fff}
.cform .btn:hover{background:var(--p2);border-color:var(--p2)}
.cmsg{margin:0;font-size:14px;color:#111;min-height:1em}
.cdone{padding:40px 10px;text-align:center;font-size:17px;font-weight:500;line-height:1.7}
.hp{position:absolute;left:-9999px}
/* 상담 접수 현황 */
.ptitle{font-size:30px;font-weight:600;margin:0 0 24px}
.ctable{overflow-x:auto}
.ctable table{width:100%;border-collapse:collapse;font-size:15px}
.ctable th{background:#f6f4fd;font-weight:500;text-align:left;padding:10px 12px;border-top:1px solid #111;border-bottom:1px solid var(--line)}
.ctable td{padding:12px;border-bottom:1px solid var(--line);vertical-align:top}
.ctable .nw{white-space:nowrap}.ctable .msg{min-width:240px;color:#333}
.ctable .empty{text-align:center;color:#444;padding:40px}
.ctable select{font:inherit;font-size:14px;border:1px solid #ccc;padding:4px 6px;border-radius:0}
@media(max-width:900px){
 .ill{height:auto}.ill-win{position:relative;width:100%;top:0}.ill-phone{display:none}
 .mods{grid-template-columns:1fr}
 .cta-in{grid-template-columns:1fr;gap:28px}
}
@media(max-width:600px){
 .ill-body{height:240px}.ill-stats strong{font-size:16px}
 .row2{grid-template-columns:1fr}.chips{grid-template-columns:repeat(2,1fr)}
 .cform{padding:20px}.cta-txt h2{font-size:24px}
}
.cform>*,.row2>*,.chips>*{min-width:0}
.cform input,.cform select,.cform textarea{max-width:100%}
/* 헤더 고객전용 */
.gnb a.my{color:#555;font-weight:400;padding-left:18px;border-left:1px solid #ddd}
/* 견적 계산기 */
.est{display:grid;grid-template-columns:1.5fr 1fr;gap:28px;align-items:start}
.est-q{border:1px solid var(--line)}
.est .q{padding:20px 22px;border-bottom:1px solid var(--line)}
.est .q:last-child{border-bottom:0}
.est .q h4{margin:0 0 12px;font-size:16px;font-weight:600}
.est .q h4 small{font-size:13px;font-weight:400;color:#555;margin-left:6px}
.est select{font:inherit;font-size:15px;border:1px solid #ccc;padding:8px 10px;border-radius:0;min-width:260px;background:#fff}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opts button{font:inherit;height:36px;padding:0 14px;font-size:15px;font-weight:500;color:#111;background:#fff;border:1px solid #ccc;border-radius:0;cursor:pointer}
.opts button:hover{background:#f5f5f5;border-color:#999;text-decoration:underline;text-underline-offset:3px}
.opts button.on{background:#efefef;border-color:#111;font-weight:600}
.est-r{position:sticky;top:90px}
.r-in{background:linear-gradient(135deg,#6A3DE8,#5228CF);color:#fff;padding:28px}
.r-k{font-size:14px;opacity:.9}
.r-in strong{display:block;font-size:28px;font-weight:600;margin:4px 0 18px;letter-spacing:-.5px}
.r-row{display:flex;justify-content:space-between;padding:10px 0;border-top:1px solid rgba(255,255,255,.25);font-size:15px}
.r-row b{font-weight:600}
.r-sum{font-size:14px;line-height:1.6;padding:12px 0 18px;border-top:1px solid rgba(255,255,255,.25);opacity:.92}
.r-in .btn{width:100%;background:#fff;border-color:#fff;color:#111}
.r-in .btn:hover{background:#f3efff;border-color:#f3efff}
.r-note{margin:10px 0 0;font-size:13px;opacity:.85}
/* FAQ */
.faq{border-top:1px solid #111}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:18px 40px 18px 4px;font-size:17px;font-weight:500;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"";position:absolute;right:10px;top:24px;width:9px;height:9px;border-right:1.5px solid #333;border-bottom:1.5px solid #333;transform:rotate(45deg)}
.faq details[open] summary:after{transform:rotate(-135deg);top:28px}
.faq summary:hover{text-decoration:underline;text-underline-offset:3px}
.faq details p{margin:0;padding:0 4px 20px;color:#333;font-size:15px;max-width:820px}
/* 업종 상세 */
.phero{background:linear-gradient(135deg,#7A4CF0,#5228CF);color:#fff;padding:56px 0 52px}
.phero .crumb{font-size:14px;opacity:.9}
.phero h1{font-size:36px;font-weight:600;margin:10px 0 8px;letter-spacing:-.5px}
.phero p{margin:0;font-size:17px;opacity:.92}
.stabs{border-bottom:1px solid var(--line);background:#fff}
.stabs .wrap{display:flex;gap:6px;overflow-x:auto;padding-top:12px;padding-bottom:12px}
.stabs a{flex:none;height:34px;padding:0 14px;display:inline-flex;align-items:center;font-size:15px;font-weight:500;border:1px solid #ccc;color:#111}
.stabs a:hover{background:#f5f5f5;border-color:#999}
.stabs a.on{background:#efefef;border-color:#111;font-weight:600}
.two{display:grid;grid-template-columns:1fr 1fr;gap:56px}
.two h2{font-size:26px}
.needs,.feats{list-style:none;padding:0;margin:20px 0 0}
.needs li,.feats li{padding:14px 0 14px 30px;border-bottom:1px solid var(--line);position:relative;font-size:16px}
.needs li:before{content:"?";position:absolute;left:0;top:14px;width:20px;height:20px;background:#f1f1f1;color:#555;font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center}
.feats li:before{content:"";position:absolute;left:4px;top:21px;width:10px;height:5px;border-left:2px solid var(--p);border-bottom:2px solid var(--p);transform:rotate(-45deg)}
.rec{margin-top:22px;background:var(--pl);padding:16px 18px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.rec span{font-size:14px;color:#444}.rec b{font-weight:600;flex:1}
.work-wide{max-width:900px}
/* 고객 전용 */
.portal .ptop{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}
.portal .ptop .ptitle{margin:0}
.login-box{max-width:420px;margin:0 auto;border:1px solid var(--line);padding:32px}
.login-box .ptitle{font-size:26px;margin-bottom:8px}
.login-box form p{margin:0 0 14px}
.login-box label{display:block;font-size:14px;font-weight:500;margin-bottom:6px}
.login-box input[type=text],.login-box input[type=password]{width:100%;font:inherit;border:1px solid #ccc;padding:10px;border-radius:0}
.login-box .login-remember label{display:flex;gap:6px;align-items:center;font-weight:400}
.login-box input[type=submit]{width:100%;height:48px;font:inherit;font-size:16px;font-weight:500;background:var(--p);color:#fff;border:1px solid var(--p);border-radius:0;cursor:pointer}
.login-box input[type=submit]:hover{background:var(--p2);text-decoration:underline;text-underline-offset:3px}
.small{font-size:14px;color:#444}
.cnew,.rnew{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-start;margin-bottom:10px}
.cnew input,.rnew textarea,.rnew select,.rrep input{font:inherit;font-size:15px;border:1px solid #ccc;padding:8px 10px;border-radius:0}
.cnew input{flex:1;min-width:180px}
.rnew textarea{flex:1;min-width:260px}
.rnew .btn,.cnew .btn{height:auto;min-height:40px}
.pmsg{font-size:14px;align-self:center}
.rtabs{display:flex;gap:6px;flex-wrap:wrap;margin:22px 0 14px}
.rtabs button{font:inherit;height:32px;padding:0 12px;font-size:14px;font-weight:500;border:1px solid #ccc;background:#fff;color:#111;cursor:pointer;border-radius:0}
.rtabs button:hover{background:#f5f5f5;border-color:#999;text-decoration:underline;text-underline-offset:3px}
.rtabs button.on{background:#efefef;border-color:#111;font-weight:600}
.req{border:1px solid var(--line);padding:16px 18px;margin-bottom:10px}
.rh{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.rh .dt{font-size:13px;color:#555}.rh .who{font-weight:600}
.rh select{margin-left:auto;font:inherit;font-size:14px;border:1px solid #ccc;padding:3px 6px;border-radius:0}
.badge{font-size:12px;font-weight:600;padding:3px 8px;border:1px solid #ccc;color:#333;background:#fff}
.badge.st-접수{border-color:var(--p);color:var(--p)}
.badge.st-진행중{background:var(--p);border-color:var(--p);color:#fff}
.badge.st-완료{background:#efefef;border-color:#111;color:#111}
.rt{font-size:16px;line-height:1.6}
.rl{margin-top:10px;padding:10px 12px;background:#f7f7f7;font-size:15px}
.rl.adm{background:var(--pl)}
.rl b{font-weight:600;margin-right:8px}.rl .dt{font-size:13px;color:#555}
.rrep{display:flex;gap:6px;margin-top:10px}.rrep input{flex:1}
.empty{color:#444}
@media(max-width:900px){
 .est{grid-template-columns:1fr}.est-r{position:static}
 .two{grid-template-columns:1fr;gap:36px}
 .gnb a.my{padding-left:0;border-left:0}
}
@media(max-width:600px){
 .est select{min-width:0;width:100%}
 .opts{display:grid;grid-template-columns:repeat(3,1fr)}.opts button{padding:0 4px;font-size:14px}
 .phero h1{font-size:26px}
 .faq summary{font-size:16px}
 .login-box{padding:22px}
}
/* 인트라넷 사례: 가로 한 줄 */
.work-row{grid-column:1/-1;display:grid;grid-template-columns:1.35fr 1fr}
.work-row .shot-in{border-bottom:0;border-right:1px solid var(--line)}
.work-row .meta{flex-direction:column;justify-content:center;gap:18px;padding:32px 30px}
.work-row h3{font-size:22px}
@media(max-width:900px){.work-row{grid-template-columns:1fr}.work-row .shot-in{border-right:0;border-bottom:1px solid var(--line)}.work-row .meta{padding:20px 22px}}
/* 업종 상세 히어로 일러스트 */
.phero-in{display:grid;grid-template-columns:1fr 440px;gap:48px;align-items:center}
.sill{background:#fff;box-shadow:0 24px 50px rgba(30,10,90,.32)}
.sill-top{height:24px;background:#f4f1fe;border-bottom:1px solid #ebe5fd;display:flex;align-items:center;gap:6px;padding:0 10px}
.sill-top i{width:7px;height:7px;border-radius:50%;background:#d6ccfa;display:block}
.sill-body{padding:16px;height:250px;display:flex;flex-direction:column;gap:12px;overflow:hidden}
.sill .ln{display:block;height:7px;background:#ece7fc;margin:5px 0}
.si-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.si-card{border:1px solid #eee9fd;padding:8px}
.si-img{height:72px;background:linear-gradient(135deg,#cbbdf8,#9d80f2)}
.si-img.big{height:96px}
.si-price{display:block;height:9px;width:60%;background:var(--p);margin:8px 0 4px}
.si-chips{display:flex;gap:6px}.si-chips i{width:52px;height:18px;border:1px solid #ddd3fb}.si-chips i.on{background:var(--p);border-color:var(--p)}
.si-video{height:120px;background:linear-gradient(135deg,#7A4CF0,#5228CF);display:flex;align-items:center;justify-content:center}
.si-play{width:0;height:0;border-left:20px solid #fff;border-top:12px solid transparent;border-bottom:12px solid transparent}
.si-prog{height:6px;background:#ece7fc}.si-prog i{display:block;height:6px;background:var(--p)}
.si-list p{margin:0;display:flex;align-items:center;gap:8px}.si-list p i{width:12px;height:12px;border:1px solid #c9bdf6;flex:none}.si-list p i.ok{background:var(--p);border-color:var(--p)}.si-list .ln{flex:1}
.si-kanban{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;flex:1}
.si-kanban>div{background:#faf8ff;border:1px solid #eee9fd;padding:8px;display:flex;flex-direction:column;gap:7px}
.si-kanban b{font-size:11px;font-weight:600;color:#444}
.si-tk{height:30px;background:#fff;border:1px solid #e3dbfb}.si-tk.on{border-left:3px solid var(--p)}.si-tk.dn{background:#ece7fc;border-color:#ece7fc}
.si-mast{height:14px;width:45%;background:#111}
.si-news{display:grid;grid-template-columns:1.2fr 1fr;gap:12px}
.si-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.si-cal i{height:22px;border:1px solid #eee9fd}.si-cal i.on{background:var(--p);border-color:var(--p)}.si-cal i.off{background:#f5f5f5}
.si-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.si-slots i{height:24px;border:1px solid #ddd3fb}.si-slots i.on{background:var(--p);border-color:var(--p)}
.si-docs p{margin:0 0 6px;display:flex;align-items:center;gap:10px;border:1px solid #eee9fd;padding:9px 10px}
.si-doc{width:18px;height:22px;border:1.5px solid var(--p);flex:none}.si-docs .ln{flex:1;margin:0}
.si-dl{width:46px;height:18px;background:var(--pl);border:1px solid #ddd3fb;flex:none}
.si-member{display:flex;align-items:center;gap:12px;border:1px solid #eee9fd;padding:12px}
.si-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#cbbdf8,#9d80f2);flex:none}.si-member>div{flex:1}
.si-badge{width:50px;height:20px;background:var(--p)}
.si-wire{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:40px 70px 70px;gap:8px;flex:1}
.si-wire div{border:1.5px dashed #c9bdf6}.si-wire .w1{grid-column:1/-1}.si-wire .w2{grid-column:1/3;grid-row:2/4;background:#faf8ff}.si-wire .w3{grid-column:3/5}.si-wire .w4{grid-column:3}.si-wire .w5{grid-column:4;background:var(--pl)}
@media(max-width:900px){.phero-in{grid-template-columns:1fr;gap:28px}.sill{max-width:440px}}
@media(max-width:600px){.sill-body{height:210px}}
/* ===== 상단 메뉴 + 하위메뉴 ===== */
.hd .wrap{gap:22px}
.gnb{display:flex;gap:4px;margin-left:auto;font-size:15px;font-weight:500}
.gi{position:relative;display:flex;align-items:center}
.gi .gl{padding:0 12px;height:68px;display:flex;align-items:center;color:#222}
.gi.on .gl{color:var(--p);font-weight:600}
.gx{display:none}
.sub{position:absolute;top:100%;left:50%;transform:translateX(-50%);min-width:170px;background:#fff;border:1px solid var(--line);border-top:2px solid var(--p);padding:8px 0;display:none;box-shadow:0 12px 24px rgba(0,0,0,.06);z-index:60}
.sub a{display:block;padding:8px 18px;font-size:14px;font-weight:400;color:#222;white-space:nowrap}
.sub a.cur{font-weight:600;color:var(--p)}
.sub a:hover{background:var(--pl)}
@media(hover:hover) and (min-width:901px){.gi:hover .sub{display:block}}
.gi.show .sub{display:block}
.hmy{font-size:14px;color:#555;padding-left:14px;border-left:1px solid #ddd}
.more-row{margin-top:28px;text-align:center}
.cta-band{display:flex;align-items:center;justify-content:space-between;gap:24px}
/* 푸터 사이트맵 */
.ft-top{display:grid;grid-template-columns:220px 1fr;gap:40px;margin-bottom:26px}
.ft-desc{color:#555;font-size:14px}
.ft-map{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
.ft-map b{display:block;font-size:14px;font-weight:600;color:#222;margin-bottom:8px}
.ft-map a{display:block;font-size:13px;color:#555;padding:3px 0}
.ft-copy{border-top:1px solid var(--line);padding-top:18px;font-size:13px;color:#555}
.ft nav{display:none}
@media(max-width:1100px){.gi .gl{padding:0 8px;font-size:14px}}
@media(max-width:900px){
 .gnb{display:none;position:absolute;top:68px;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);flex-direction:column;gap:0;padding:4px 20px 12px;max-height:calc(100vh - 68px);overflow:auto}
 .gnb.open{display:flex}
 .gi{flex-wrap:wrap;border-bottom:1px solid #f0f0f0}
 .gi .gl{height:auto;padding:13px 0;flex:1}
 .gx{display:block;width:40px;height:44px;background:none;border:0;cursor:pointer;position:relative}
 .gx:after{content:"";position:absolute;left:15px;top:16px;width:8px;height:8px;border-right:1.5px solid #333;border-bottom:1.5px solid #333;transform:rotate(45deg)}
 .gi.show .gx:after{transform:rotate(-135deg);top:20px}
 .sub{position:static;transform:none;width:100%;border:0;box-shadow:none;padding:0 0 10px;background:none;display:none}
 .sub a{padding:7px 12px;color:#444}
 .hmy,.hcta{display:none}
 .ft-top{grid-template-columns:1fr}.ft-map{grid-template-columns:repeat(2,1fr)}
 .cta-band{flex-direction:column;align-items:flex-start}
}
@media(max-width:600px){.gnb{top:58px}}
@media(max-width:900px){.gnb a{border-bottom:0!important}}
/* 하위 페이지 첫 섹션 제목은 페이지 제목과 겹치므로 숨김 */
.stabs + .sec > .wrap > .tag,.stabs + .sec > .wrap > h2,.stabs + .sec > .wrap > .lead,
.phero + .sec > .wrap > .tag,.phero + .sec > .wrap > h2,.phero + .sec > .wrap > .lead{display:none}
/* 개설 후기 */
.reviews{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.review{background:#fff;border:1px solid var(--line);display:flex;flex-direction:column}
.rv-img{aspect-ratio:1200/420;overflow:hidden;border-bottom:1px solid var(--line)}.rv-img img{width:100%;display:block}
.rv-in{padding:22px 24px;display:flex;flex-direction:column;gap:8px;flex:1}
.rv-in .k{font-size:13px;font-weight:500;color:var(--p)}
.rv-in h3{margin:0;font-size:18px;font-weight:600;line-height:1.5}
.rv-in p{margin:0;font-size:15px;color:#333;flex:1}
.rv-by{font-size:14px;color:#444;padding-top:12px;border-top:1px solid #f0f0f0;margin-top:6px}
/* 준비 자료 */
.prep{border-top:1px solid #111}
.pr{display:flex;gap:20px;padding:18px 4px;border-bottom:1px solid var(--line)}
.pr .n{font-size:15px;font-weight:600;color:var(--p);width:28px;flex:none;padding-top:1px}
.pr h4{margin:0 0 4px;font-size:17px;font-weight:600}.pr p{margin:0;color:#333;font-size:15px}
.note{margin:20px 0 0;color:#333;font-size:15px}
/* 회사 소개 */
.about{display:grid;grid-template-columns:1fr 1.3fr;gap:56px;align-items:start}
.ab-lead h2{font-size:32px;line-height:1.35}
.ab-txt p{font-size:17px;line-height:1.8;margin:0 0 16px;color:#222}
/* 게시판 */
.board{max-width:1000px}
.bd-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;font-size:15px;color:#333}
.bd-list{border-top:1px solid #111}
.bd-row{display:grid;grid-template-columns:60px 90px 1fr 100px;align-items:center;padding:15px 6px;border-bottom:1px solid var(--line);font-size:16px}
.bd-row:hover{background:#faf9ff}
.bd-row .no,.bd-row .dt{font-size:14px;color:#555;text-align:center}
.bd-row .cat,.bd-view .cat{font-size:13px;font-weight:500;color:var(--p)}
.nb{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;background:#D62C2B;color:#fff;font-size:10px;font-style:normal;font-weight:600;margin-left:6px;vertical-align:2px}
.bd-foot{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:26px}
.pager{display:flex;gap:4px}
.pager a{min-width:34px;height:34px;display:flex;align-items:center;justify-content:center;border:1px solid #ccc;font-size:14px}
.pager a.on{background:#efefef;border-color:#111;font-weight:600}
.bd-search{display:flex;gap:4px;width:min(100%,286px)}
.bd-search input{flex:1;min-width:0;font:inherit;font-size:14px;border:1px solid #ccc;padding:0 10px;height:30px;border-radius:0}
.bd-view{max-width:820px}
.bv-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:18px;border-bottom:1px solid #111}
.bv-head h1{margin:6px 0 6px;font-size:26px;font-weight:600;line-height:1.4}
.bv-head .dt{font-size:14px;color:#555}
.bv-body{padding:28px 0;font-size:16px;line-height:1.6;color:#111;border-bottom:1px solid var(--line)}
.bv-body a{color:var(--p);text-decoration:underline}
.bv-foot{padding-top:18px;text-align:right}
.bd-write{display:flex;flex-direction:column;gap:10px}
.bw-row{display:flex;gap:8px}
.bd-write select,.bd-write input,.bd-write textarea{font:inherit;font-size:16px;border:1px solid #ccc;padding:10px 12px;border-radius:0;background:#fff}
.bd-write input{flex:1}
.bd-write textarea{line-height:1.6;resize:vertical}
.bw-act{display:flex;align-items:center;gap:12px;justify-content:flex-end}
.bw-act .del{margin-right:auto;background:none;border:0;font:inherit;font-size:14px;color:#555;cursor:pointer}
.bw-act .del:hover{text-decoration:underline;text-underline-offset:3px}
@media(max-width:900px){.reviews{grid-template-columns:1fr}.about{grid-template-columns:1fr;gap:20px}}
@media(max-width:600px){.bd-row{grid-template-columns:1fr auto;gap:4px 10px;padding:13px 2px}.bd-row .no{display:none}.bd-row .cat{grid-column:1/-1}.bd-row .dt{text-align:right}.ab-lead h2{font-size:26px}.bv-head h1{font-size:21px}}
.board{max-width:var(--w)}
.ft-map{grid-template-columns:repeat(6,1fr)}
@media(max-width:900px){.ft-map{grid-template-columns:repeat(2,1fr)}}
/* ===== 하위메뉴 패널 (PC) ===== */
@media(min-width:901px){
 .gi{position:relative}
 .sub{position:absolute;top:calc(100% - 6px);left:0;transform:none;width:280px;background:#fff;border:1px solid #ddd;border-top:3px solid var(--p);box-shadow:0 16px 36px rgba(30,10,90,.14);padding:10px}
 .sub.mega{width:660px}
 .sub-in{display:flex;flex-direction:column;gap:2px}
 .sub.mega .sub-in{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
 .sub a.si{display:flex;align-items:center;gap:12px;padding:11px 12px;color:#111;background:none}
 .sub a.si:hover{background:#f6f3ff;text-decoration:none}
 .sub a.si:hover b{text-decoration:underline;text-underline-offset:3px}
 .sub a.si span{display:flex;flex-direction:column;gap:2px;min-width:0}
 .sub a.si b{font-size:15px;font-weight:500;color:#111}
 .sub a.si em{font-style:normal;font-size:13px;color:#555;white-space:nowrap}
 .sub a.si .ico{width:34px;height:34px;flex:none}
 .sub a.si .ico svg{width:18px;height:18px}
 .sub a.si.cur{background:#efefef}
 .sub a.si.cur b{font-weight:600}
 .sub.mega a.all{grid-column:1/-1;justify-content:center;border-top:1px solid var(--line);margin-top:6px;padding:12px}
 .sub.mega a.all b{font-size:14px;color:var(--p)}
}
@media(max-width:900px){.sub a.si .ico,.sub a.si em{display:none}.sub a.si b{font-weight:400;font-size:15px}}

/* ================= v3: 회색 바탕 + 흰 상자 + 제목·검정선·목록 ================= */
:root{--bg:#f3f3f6}
body{background:var(--bg);font-size:16px}
.hd{border-bottom:1px solid #e6e6ea}
@media(min-width:901px){
 .hd .wrap{height:72px}
 .gnb{margin:0 auto;gap:10px}
 .gi .gl{height:72px;font-size:16px;font-weight:500;padding:0 14px}
 .sub{top:calc(100% - 8px)}
}
.sec,.sec.alt{background:transparent}
.sec h2{font-size:28px}
.sec .lead{font-size:16px;color:#333}
.card,.plan,.work,.review,.mod,.est-q,.steps,.demo-box,.login-box,.req,.si-card{background:#fff}
.faq,.mods,.prep,.bd-list,.needs,.feats,.ctable{background:#fff}
.faq,.prep{border:1px solid #e3e3e8;border-top:2px solid #111;padding:0 24px}
.mods{border:1px solid #e3e3e8;border-top:2px solid #111;padding:0 24px}
.two>div{background:#fff;border:1px solid #e3e3e8;padding:28px}
.about{background:#fff;border:1px solid #e3e3e8;padding:40px}
.board{background:#fff;border:1px solid #e3e3e8;padding:28px}
.stabs{background:#fff}
.ft{background:#fff;margin-top:90px}
.cta{margin-top:60px}

/* 메인 */
.h-hero{background:linear-gradient(135deg,#7A4CF0 0%,#6A3DE8 45%,#5228CF 100%);color:#fff;padding:64px 0}
.h-hero-in{display:grid;grid-template-columns:1.15fr 1fr;gap:40px;align-items:center}
.h-left .eyebrow{display:inline-block;font-size:14px;font-weight:500;padding:6px 12px;border:1px solid rgba(255,255,255,.55);margin-bottom:18px}
.h-left h1{font-size:40px;line-height:1.32;font-weight:600;margin:0 0 14px;letter-spacing:-.8px}
.h-left p{font-size:17px;margin:0 0 22px;color:rgba(255,255,255,.95)}
.h-chips{display:flex;flex-wrap:wrap;gap:8px}
.h-chips a{height:36px;padding:0 14px;display:inline-flex;align-items:center;border:1px solid rgba(255,255,255,.75);color:#fff;font-size:15px;font-weight:500}
.h-chips a:hover{background:#fff;color:var(--p);text-decoration:none}
.h-panel{background:#fff;color:#111;padding:8px 24px 12px;box-shadow:0 24px 50px rgba(30,10,90,.3)}
.hp-head{display:flex;justify-content:space-between;align-items:center;padding:16px 0 14px;border-bottom:2px solid #111}
.hp-head b{font-size:19px;font-weight:600}
.hp-head a{font-size:14px;color:#333}
.hp-row{display:flex;align-items:center;gap:12px;padding:15px 0;border-bottom:1px solid #eee}
.hp-row:last-child{border-bottom:0}
.hp-row span{flex:1;display:flex;flex-direction:column;gap:2px}
.hp-row b{font-size:17px;font-weight:600}
.hp-row em{font-style:normal;font-size:14px;color:#444}
.hp-row i{font-style:normal;font-size:13px;font-weight:500;border:1px solid #ccc;height:30px;padding:0 12px;display:inline-flex;align-items:center;color:#111;flex:none}
.hp-row:hover{text-decoration:none}.hp-row:hover b{text-decoration:underline;text-underline-offset:3px}.hp-row:hover i{background:#f5f5f5;border-color:#999}
.h-steps{background:#fff;border-bottom:1px solid #e6e6ea}
.h-steps .wrap{display:grid;grid-template-columns:repeat(3,1fr)}
.h-steps .wrap>div{display:flex;align-items:center;gap:12px;padding:20px 0}
.h-steps span{width:28px;height:28px;border:1px solid #111;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;flex:none}
.h-steps b{font-size:16px;font-weight:600}.h-steps em{font-style:normal;font-size:14px;color:#444}
.h-sec{padding-top:28px}
.h-sec:first-of-type{padding-top:0}
.tiles{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.tile{background:#fff;border:1px solid #e3e3e8;padding:20px 18px;display:flex;flex-direction:column;gap:4px}
.tile .ico{margin-bottom:10px}
.tile b{font-size:16px;font-weight:600;color:#111}.tile em{font-style:normal;font-size:14px;color:#444}
.tile:hover{border-color:var(--p);text-decoration:none}.tile:hover b{text-decoration:underline;text-underline-offset:3px}
.box{background:#fff;border:1px solid #e3e3e8;padding:26px 28px}
.bh{display:flex;justify-content:space-between;align-items:flex-end;padding-bottom:14px;border-bottom:2px solid #111}
.bh h2{margin:0;font-size:22px;font-weight:600}
.bh a{font-size:14px;color:#333}
.rows4{display:grid;grid-template-columns:repeat(4,1fr);column-gap:28px}
.rows4 a{display:flex;justify-content:space-between;align-items:center;padding:16px 4px;border-bottom:1px solid #eee;font-size:16px;color:#111}
.rows4 a i{font-style:normal;font-size:12px;font-weight:500;border:1px solid #ccc;padding:2px 7px;color:#333;flex:none;margin-left:8px}
.rows4 a:hover{text-decoration:none}.rows4 a:hover span{text-decoration:underline;text-underline-offset:3px}
.h-works{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding-top:20px}
.h-works a{display:flex;flex-direction:column;gap:4px}
.hw-img{aspect-ratio:1200/700;overflow:hidden;border:1px solid #e3e3e8;margin-bottom:8px}.hw-img img{width:100%;display:block}
.h-works .k{font-size:13px;font-weight:500;color:var(--p)}.h-works b{font-size:16px;font-weight:600}
.h-works a:hover{text-decoration:none}.h-works a:hover b{text-decoration:underline;text-underline-offset:3px}
.two-box{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.nlist a{display:flex;justify-content:space-between;gap:12px;padding:15px 2px;border-bottom:1px solid #eee;font-size:16px}
.nlist a span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nlist a em{font-style:normal;font-size:14px;color:#555;flex:none}
.nlist .empty{padding:20px 0}
.h-band{background:linear-gradient(135deg,#6A3DE8,#5228CF);color:#fff;padding:40px 44px;display:grid;grid-template-columns:1.2fr 1fr;gap:32px;align-items:center}
.eyebrow2{font-size:13px;font-weight:600;color:#ffd75e;letter-spacing:.5px}
.h-band h2{font-size:26px;font-weight:600;margin:8px 0 8px}
.h-band p{margin:0 0 20px;color:rgba(255,255,255,.92)}
.hb-nums{display:grid;grid-template-columns:repeat(4,1fr)}
.hb-nums div{padding:0 14px;border-left:1px solid rgba(255,255,255,.3)}
.hb-nums b{display:block;font-size:24px;font-weight:600}.hb-nums em{font-style:normal;font-size:13px;color:rgba(255,255,255,.9)}
.home + .ft{margin-top:90px}
@media(max-width:900px){
 .h-hero-in,.h-band,.two-box{grid-template-columns:1fr}
 .tiles{grid-template-columns:repeat(3,1fr)}
 .rows4{grid-template-columns:repeat(2,1fr)}
 .h-works{grid-template-columns:repeat(2,1fr)}
 .h-steps .wrap{grid-template-columns:1fr}.h-steps .wrap>div{padding:12px 0;border-bottom:1px solid #f0f0f0}
}
@media(max-width:600px){
 .h-hero{padding:40px 0}.h-left h1{font-size:28px}.h-left p{font-size:16px}
 .h-chips{display:grid;grid-template-columns:repeat(3,1fr)}.h-chips a{justify-content:center;padding:0 4px;font-size:14px}
 .h-panel{padding:4px 16px 8px}
 .box{padding:20px 16px}.rows4{grid-template-columns:1fr}
 .tile{padding:14px 10px}.tile em{font-size:13px}
 .h-band{padding:28px 20px}.hb-nums{grid-template-columns:repeat(2,1fr);row-gap:14px}
 .two>div,.about,.board{padding:20px 16px}.faq,.mods,.prep{padding:0 16px}
 .ft{margin-top:60px}.home + .ft{margin-top:60px}
}
/* ===== 제작 사례 페이지 v2 ===== */
.wk-filter{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:20px}
.wk-filter button{font:inherit;height:38px;padding:0 16px;font-size:15px;font-weight:500;background:#fff;border:1px solid #ccc;color:#111;cursor:pointer;border-radius:0}
.wk-filter button i{font-style:normal;font-size:13px;color:#555;margin-left:2px}
.wk-filter button:hover{background:#f5f5f5;border-color:#999;text-decoration:underline;text-underline-offset:3px}
.wk-filter button.on{background:#efefef;border-color:#111;font-weight:600}
.wk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.wk{background:#fff;border:1px solid #e3e3e8;display:flex;flex-direction:column}
.wk:hover{border-color:var(--p);text-decoration:none}
.wk-img{aspect-ratio:16/10;overflow:hidden;border-bottom:1px solid #e3e3e8;background:#f6f6f8}
.wk-img img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;transition:transform .4s}
.wk:hover .wk-img img{transform:scale(1.03)}
.wk-body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:6px;flex:1}
.wk-body .k{font-size:13px;font-weight:500;color:var(--p)}
.wk-body h3{margin:0;font-size:19px;font-weight:600;color:#111}
.wk-body p{margin:0;font-size:15px;color:#333;line-height:1.55;flex:1}
.wk-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.wk-tags i{font-style:normal;font-size:12px;font-weight:500;color:#333;border:1px solid #ddd;padding:3px 8px;background:#fafafa}
.wk-go{margin-top:14px;padding-top:14px;border-top:1px solid #eee;font-size:14px;font-weight:500;color:#111}
.wk-go:after{content:" →"}
.wk:hover .wk-go{text-decoration:underline;text-underline-offset:3px;color:var(--p)}
@media(max-width:900px){.wk-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.wk-grid{grid-template-columns:1fr}.wk-filter{display:grid;grid-template-columns:repeat(3,1fr)}.wk-filter button{padding:0 4px;font-size:14px}}
.reviews{grid-template-columns:repeat(3,1fr)}
.rv-img{aspect-ratio:16/9}.rv-img img{height:100%;object-fit:cover;object-position:top center}
.rv-in h3{font-size:17px}
@media(max-width:900px){.reviews{grid-template-columns:1fr}}
/* ===== v3.3 보강 ===== */
/* 업종 목록 */
.sol-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.sol{background:#fff;border:1px solid #e3e3e8;display:grid;grid-template-columns:240px 1fr}
.sol:hover{border-color:var(--p);text-decoration:none}
.sol-ill{background:linear-gradient(135deg,#7A4CF0,#5228CF);padding:18px;display:flex;align-items:center}
.sol-ill .sill{width:100%;box-shadow:0 10px 20px rgba(20,5,60,.3)}
.sol-ill .sill-body{height:150px;padding:10px;gap:7px}
.sol-ill .si-img{height:40px}.sol-ill .si-video{height:70px}.sol-ill .si-tk{height:18px}.sol-ill .si-cal i{height:13px}.sol-ill .si-img.big{height:50px}.sol-ill .si-slots i{height:14px}.sol-ill .si-wire{grid-template-rows:22px 40px 40px}.sol-ill .si-docs p{padding:5px 8px;margin-bottom:4px}.sol-ill .si-member{padding:6px}.sol-ill .si-avatar{width:28px;height:28px}
.sol-body{padding:20px 22px;display:flex;flex-direction:column;gap:6px}
.sol-body h3{margin:0;font-size:19px;font-weight:600;color:#111}
.sol-body p{margin:0;font-size:15px;color:#333;flex:1}
.sol-meta{font-size:14px;margin-top:6px}.sol-meta span{color:#555;margin-right:8px}.sol-meta b{font-weight:500;color:#111}
.sol-case{font-size:13px;font-weight:500;color:var(--p)}
.sol:hover .wk-go{text-decoration:underline;text-underline-offset:3px;color:var(--p)}
/* 비교표 */
.cmp-wrap{margin-top:28px;background:#fff;border:1px solid #e3e3e8;padding:26px 28px}
.cmp-t{margin:0 0 14px;font-size:20px;font-weight:600}
.cmp{width:100%;border-collapse:collapse;font-size:15px;border-top:2px solid #111}
.cmp th,.cmp td{padding:12px 14px;border-bottom:1px solid #eee;text-align:center}
.cmp th{font-weight:600;background:#fafafa}
.cmp td:first-child,.cmp th:first-child{text-align:left}
.cmp .hl{background:#f6f3ff;font-weight:500}
/* 제작 과정 타임라인 */
.tl{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.tl-step{background:#fff;border:1px solid #e3e3e8;border-top:3px solid var(--p);padding:22px 20px;display:flex;flex-direction:column}
.tl-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.tl-head .n{width:28px;height:28px;background:var(--p);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600}
.tl-head h4{margin:0;font-size:18px;font-weight:600}.tl-head em{margin-left:auto;font-style:normal;font-size:13px;color:#555;border:1px solid #ddd;padding:2px 8px}
.tl-step ul{margin:0;padding:0 0 0 18px;font-size:15px;color:#222;flex:1}.tl-step li{margin-bottom:5px}
.tl-you{margin:14px 0 0;padding-top:12px;border-top:1px solid #eee;font-size:14px;color:#333}
/* 이사 */
.mig{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.mig div{padding:18px 16px 4px;border-right:1px solid #eee}.mig div:last-child{border-right:0}
.mig b{display:block;font-size:17px;font-weight:600;margin-bottom:4px}.mig em{font-style:normal;font-size:14px;color:#333}
/* 상담 안내 */
.cinfo{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid #e3e3e8}
.cinfo div{padding:20px 22px;border-right:1px solid #eee}.cinfo div:last-child{border-right:0}
.cinfo b{display:block;font-size:15px;font-weight:600;margin-bottom:4px}.cinfo em{font-style:normal;font-size:14px;color:#333}
.cinfo a{color:var(--p);text-decoration:underline;text-underline-offset:3px}
.sec + .cta{margin-top:0}
/* 메인 후기 */
.h-rv{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.h-rv a{padding:20px 20px 4px;border-right:1px solid #eee;display:flex;flex-direction:column;gap:10px}
.h-rv a:last-child{border-right:0}
.h-rv b{font-size:16px;font-weight:500;line-height:1.55;color:#111}.h-rv em{font-style:normal;font-size:14px;color:#555}
.h-rv a:hover{text-decoration:none}.h-rv a:hover b{text-decoration:underline;text-underline-offset:3px}
/* 약관 */
.legal{background:#fff;border:1px solid #e3e3e8;padding:32px 36px;max-width:900px}
.legal h3{font-size:17px;font-weight:600;margin:22px 0 6px}.legal h3:first-child{margin-top:0}
.legal p{margin:0;font-size:15px;line-height:1.7;color:#222}
.ft-copy{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.ft-legal{display:flex;gap:16px}.ft-legal a{color:#333}.ft-legal b{font-weight:600}
/* 404 */
.nf{text-align:center}.nf p{font-size:16px;margin:0 0 18px}.nf-links{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
/* 떠 있는 바로가기 */
.qmenu{position:fixed;right:20px;bottom:24px;z-index:70;display:flex;flex-direction:column;gap:6px;opacity:0;visibility:hidden;transition:opacity .2s}
.qmenu.show{opacity:1;visibility:visible}
.qmenu a,.qmenu button{width:62px;height:62px;display:flex;flex-direction:column;align-items:center;justify-content:center;font:inherit;font-size:12px;line-height:1.3;color:#111;background:#fff;border:1px solid #d6d6dc;box-shadow:0 6px 16px rgba(0,0,0,.08);cursor:pointer}
.qmenu a b{font-size:14px;font-weight:600}
.qmenu a:first-child{background:var(--p);border-color:var(--p);color:#fff}
.qmenu a:hover,.qmenu button:hover{text-decoration:underline;text-underline-offset:3px}
.qmenu button{height:40px;font-weight:600}
@media(max-width:900px){
 .sol-grid{grid-template-columns:1fr}.tl{grid-template-columns:repeat(2,1fr)}.mig,.cinfo{grid-template-columns:repeat(2,1fr)}.h-rv{grid-template-columns:1fr}.h-rv a{border-right:0;border-bottom:1px solid #eee;padding:16px 4px}
}
@media(max-width:600px){
 .sol{grid-template-columns:1fr}.sol-ill{padding:14px}
 .tl{grid-template-columns:1fr}.mig,.cinfo{grid-template-columns:1fr}.mig div,.cinfo div{border-right:0;border-bottom:1px solid #eee}
 .cmp-wrap{padding:18px 14px}.cmp{font-size:14px}.cmp th,.cmp td{padding:10px 8px}
 .legal{padding:22px 18px}
 .qmenu{right:12px;bottom:14px}.qmenu a,.qmenu button{width:54px;height:54px}.qmenu button{height:36px}
}
/* 하위메뉴: 업종별 솔루션만 설명, 나머지는 이름만 */
@media(min-width:901px){
 .sub:not(.mega){width:220px;padding:8px}
 .sub:not(.mega) a.si{padding:12px 14px}
 .sub:not(.mega) a.si b{font-size:16px;font-weight:500}
}
/* ===== 메인 첫 화면 A안 ===== */
.h-hero2{background:linear-gradient(135deg,#7A4CF0 0%,#6A3DE8 45%,#5228CF 100%);color:#fff;padding:72px 0 64px;text-align:center}
.h2-eye{margin:0 0 14px;font-size:15px;font-weight:500;color:rgba(255,255,255,.9)}
.h-hero2 h1{margin:0 0 14px;font-size:42px;line-height:1.3;font-weight:600;letter-spacing:-.8px}
.h2-sub{margin:0 0 30px;font-size:17px;color:rgba(255,255,255,.92)}
.h2-pick{display:flex;max-width:620px;margin:0 auto;background:#fff;box-shadow:0 18px 40px rgba(30,10,90,.28)}
.h2-pick select{flex:1;min-width:0;height:58px;border:0;padding:0 44px 0 20px;font:inherit;font-size:16px;color:#111;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23333' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 18px center;appearance:none;-webkit-appearance:none;border-radius:0;cursor:pointer}
.h2-pick select:focus{outline:none}
.h2-pick button{flex:none;width:130px;height:58px;border:0;background:#111;color:#fff;font:inherit;font-size:16px;font-weight:500;cursor:pointer}
.h2-pick button:hover{background:#333;text-decoration:underline;text-underline-offset:3px}
.h2-links{margin-top:20px;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:6px 18px;font-size:15px}
.h2-links span{color:rgba(255,255,255,.85)}
.h2-links a{color:#fff;font-weight:500}
.h2-links a:hover{text-decoration:underline;text-underline-offset:3px}
@media(max-width:600px){
 .h-hero2{padding:48px 0 44px}.h-hero2 h1{font-size:28px}.h2-sub{font-size:15px;margin-bottom:22px}
 .h2-pick select{height:52px;font-size:15px;padding-left:14px}.h2-pick button{width:96px;height:52px;font-size:15px}
 .h2-links{gap:6px 14px;font-size:14px}.h2-links span{width:100%}
}
/* ===== v3.6 업종 34개 · 샘플 사이트 ===== */
.stabs + .sec.keep > .wrap > .tag{display:inline-block}.stabs + .sec.keep > .wrap > h2,.stabs + .sec.keep > .wrap > .lead{display:block}
.ph-btns{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}
.btn-line-w{background:transparent;border-color:rgba(255,255,255,.7);color:#fff}.btn-line-w:hover{background:rgba(255,255,255,.12);border-color:#fff}
/* 메가메뉴: 묶음별 열 */
@media(min-width:901px){
 .sub.mega{width:1080px;padding:22px 24px 0}
 .sub.mega .sub-in{display:block}
 .mg-cols{display:grid;grid-template-columns:repeat(7,1fr);gap:0 18px}
 .mg-col{display:flex;flex-direction:column}
 .mg-h{font-size:14px;font-weight:600;color:#111;padding:0 0 10px;margin-bottom:6px;border-bottom:2px solid #111}
 .sub a.mg-a{padding:6px 0;font-size:14.5px;color:#333;white-space:normal;background:none}
 .sub a.mg-a:hover{background:none;color:#111;text-decoration:underline;text-underline-offset:3px}
 .sub a.mg-a.cur{font-weight:600;color:#111}
 .mg-foot{display:flex;align-items:center;gap:18px;margin:18px -24px 0;padding:14px 24px;border-top:1px solid #e6e6ea;background:#fafafb;font-size:14px}
 .mg-foot span{color:#555;margin-right:auto}.mg-foot a{font-weight:600;color:#111}
}
@media(max-width:900px){
 .mg-cols{display:block}.mg-col{padding:4px 0 8px}
 .mg-h{display:block;font-size:13px;font-weight:600;color:#666;padding:8px 12px 4px}
 .mg-col a.mg-a{display:inline-block;padding:6px 12px;font-size:14px;color:#222}
 .mg-foot{display:flex;flex-wrap:wrap;gap:6px 14px;padding:10px 12px;font-size:14px}.mg-foot span{width:100%;color:#666;font-size:13px}.mg-foot a{font-weight:600}
}
/* 솔루션: 묶음 필터 + 간결 카드 */
.solf{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 30px}
.solf button{height:40px;padding:0 16px;border:1px solid #ccc;background:#fff;font:inherit;font-size:15px;font-weight:500;color:#111;cursor:pointer}
.solf button em{font-style:normal;color:#777;font-size:13px;margin-left:2px}
.solf button:hover{text-decoration:underline;text-underline-offset:3px}
.solf button.on{background:#efefef;border-color:#111;font-weight:600}
.solg{margin-bottom:40px}
.solg-h{display:flex;align-items:baseline;gap:10px;font-size:20px;font-weight:600;margin:0 0 14px;padding-bottom:12px;border-bottom:2px solid #111}
.solg-h span{font-size:14px;font-weight:400;color:#555}
.sol2{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.sol2-i{background:#fff;border:1px solid #e3e3e8;padding:20px 22px;display:flex;flex-direction:column;gap:8px}
.sol2-i:hover{border-color:#111;text-decoration:none}.sol2-i:hover b{text-decoration:underline;text-underline-offset:3px}
.sol2-t{display:flex;align-items:center;gap:12px}.sol2-t .ico{width:38px;height:38px;flex:none}.sol2-t b{font-size:17px;font-weight:600;color:#111}
.sol2-i p{margin:0;font-size:15px;color:#444;line-height:1.55}
.sol2-m{margin-top:auto;padding-top:10px;border-top:1px solid #eee;display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:13px;color:#555}
.sol2-m span{margin-right:auto}
.sol2-m i{font-style:normal;font-weight:500;border:1px solid #ccc;padding:1px 7px;color:#333}.sol2-m i.dm{border-color:var(--p);color:var(--p)}
/* 메인: 묶음별 업종 */
.bh h2 small{font-size:14px;font-weight:400;color:#555;margin-left:6px}
.h-sg{display:grid;grid-template-columns:repeat(7,1fr);gap:0 20px;padding-top:18px}
.h-sg>div{display:flex;flex-direction:column}
.h-sg a{padding:7px 0;font-size:15px;color:#222;display:flex;align-items:center;gap:6px}
.h-sg a.h-sg-h{font-size:15px;font-weight:600;color:#111;padding:0 0 10px;margin-bottom:4px;border-bottom:1px solid #ddd}
.h-sg a i{font-style:normal;font-size:11px;font-weight:600;color:var(--p);border:1px solid var(--p);padding:0 5px;line-height:17px}
/* 샘플 카드 */
.dm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.dm-card{background:#fff;border:1px solid #e3e3e8;display:flex;flex-direction:column}
.dm-card:hover{border-color:#111;text-decoration:none}.dm-card:hover b{text-decoration:underline;text-underline-offset:3px}
.dm-prev{aspect-ratio:16/10;overflow:hidden;position:relative;border-bottom:1px solid #e3e3e8;background:#f6f6f8}
.dm-prev iframe{position:absolute;left:0;top:0;width:1280px;height:800px;border:0;transform:scale(.3);transform-origin:0 0;pointer-events:none}
.dm-meta{padding:18px 20px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
.dm-meta .k{font-size:13px;font-weight:500;color:var(--p)}.dm-meta b{font-size:17px;font-weight:600;color:#111}
.dm-meta p{margin:0;font-size:15px;color:#444}
.dm-meta .go{margin-top:auto;padding-top:10px;font-size:14px;font-weight:600;color:#111}.dm-meta .go:after{content:" →"}
.dm-intro{display:flex;justify-content:space-between;align-items:center;gap:20px;background:#fff;border:1px solid #e3e3e8;padding:22px 26px;margin-bottom:34px}
.dm-intro b{font-size:18px;font-weight:600}.dm-intro p{margin:4px 0 0;color:#444}
.dm-sec{margin-bottom:40px}.dm-row{margin-bottom:26px}
.dm-rh{display:flex;align-items:baseline;gap:10px;margin:0 0 12px}.dm-rh a{font-size:17px;font-weight:600;color:#111}.dm-rh span{font-size:14px;color:#555}
.dm-more{color:#444}.dm-more a{font-weight:600;color:#111;text-decoration:underline}
@media(max-width:1100px){.h-sg{grid-template-columns:repeat(4,1fr);row-gap:18px}}
@media(max-width:900px){.sol2,.dm-grid{grid-template-columns:repeat(2,1fr)}.dm-intro{flex-direction:column;align-items:flex-start}.dm-prev iframe{transform:scale(.27)}}
@media(max-width:600px){.sol2,.dm-grid{grid-template-columns:1fr}.h-sg{grid-template-columns:repeat(2,1fr)}.solf button{height:36px;padding:0 12px;font-size:14px}.dm-prev iframe{transform:scale(.28)}}
/* 쉬운 선택 · 4개 상품 · 호스팅/앱 */
.easy{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding-top:20px}
.ez{border:1px solid #e3e3e8;padding:20px;display:flex;flex-direction:column;gap:6px;background:#fff}
.ez:hover{border-color:#111;text-decoration:none}.ez:hover b{text-decoration:underline;text-underline-offset:3px}
.ez em{font-style:normal;font-size:15px;color:#444;line-height:1.5}
.ez b{font-size:20px;font-weight:600;color:var(--p);margin-top:4px}
.ez p{margin:0;font-size:15px;color:#333;flex:1}
.ez span{font-size:14px;font-weight:600;color:#111;padding-top:8px}.ez span:after{content:" →"}
.ez-n{margin:16px 0 0;font-size:15px;color:#444}
.plans4 .pl-k{font-size:13px;font-weight:600;color:var(--p);margin-bottom:4px}
.cmp th:nth-child(n+2),.cmp td:nth-child(n+2){text-align:center}
.host{display:grid;grid-template-columns:1fr 1fr;gap:40px;background:#fff;border:1px solid #e3e3e8;padding:34px 36px}
.host h2{font-size:26px;margin:0 0 12px}
.host-r{list-style:none;margin:0;padding:0}.host-r li{padding:14px 0;border-bottom:1px solid #eee;display:flex;flex-direction:column}.host-r li:first-child{border-top:2px solid #111}
.host-r b{font-size:17px;font-weight:600}.host-r span{font-size:15px;color:#444}
.host-n{font-size:15px;color:#444;margin:14px 0 0}
.steps4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:20px}
.steps4>div{background:#fff;border:1px solid #e3e3e8;padding:20px;display:flex;flex-direction:column;gap:4px}
.steps4 span{width:28px;height:28px;background:var(--p);color:#fff;font-weight:600;display:inline-flex;align-items:center;justify-content:center;font-size:14px}
.steps4 b{font-size:17px;font-weight:600;margin-top:6px}.steps4 em{font-style:normal;font-size:15px;color:#444}
.dm-one{background:#fff;border:2px solid var(--p);padding:22px 26px;margin-bottom:34px}
.dm-one .solg-h{border-color:var(--p)}
@media(max-width:900px){.easy,.steps4{grid-template-columns:repeat(2,1fr)}.host{grid-template-columns:1fr;padding:24px 20px;gap:20px}}
@media(max-width:600px){.easy,.steps4{grid-template-columns:1fr}}
/* v3.8 솔루션: 사진 카드 + 글자 탭 */
nav.solf{display:flex;flex-wrap:wrap;gap:4px 26px;margin:0 0 34px;padding-bottom:14px;border-bottom:1px solid #ddd}
nav.solf a{font-size:16px;font-weight:500;color:#444;padding:4px 0}
nav.solf a.on{color:#111;font-weight:600;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:8px}
.solg{margin-bottom:46px}.solg-h{border-bottom:0;padding-bottom:0;margin-bottom:16px;font-size:20px}
.sol3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.sol3.n4{grid-template-columns:repeat(4,1fr)}.sol3.n3 .sol3-p{aspect-ratio:16/10}
.sol3-i{display:flex;flex-direction:column;background:#fff;border:1px solid #e3e3e8}
.sol3-i:hover{text-decoration:none;border-color:#111}.sol3-i:hover b{text-decoration:underline;text-underline-offset:4px}
.sol3-p{position:relative;aspect-ratio:4/3;overflow:hidden;background:#ddd}
.sol3-p img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.sol3-i:hover .sol3-p img{transform:scale(1.04)}
.sol3-p:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.72))}
.sol3-p b{position:absolute;left:18px;bottom:14px;z-index:1;color:#fff;font-size:20px;font-weight:600}
.sol3-p i{position:absolute;right:12px;top:12px;z-index:1;font-style:normal;font-size:12px;font-weight:600;background:#fff;color:#111;padding:2px 8px}
.sol3-i p{margin:0;padding:12px 18px 14px;font-size:14.5px;color:#444;line-height:1.5}
/* 업종 상세 상단: 사진 배경 */
.phero.phero-img{background-size:cover;background-position:center;padding:80px 0 72px}
.phero-img h1{font-size:40px}.ph-also{margin-top:10px!important;font-size:15px!important;opacity:.85!important}
@media(max-width:1100px){.sol3.n4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.sol3,.sol3.n4{grid-template-columns:repeat(2,1fr);gap:12px}.sol3.n3 .sol3-p{aspect-ratio:4/3}.sol3-p b{font-size:17px;left:12px;bottom:10px}.sol3-i p{padding:10px 12px;font-size:13.5px}nav.solf{gap:4px 18px}.phero.phero-img{padding:52px 0 46px}.phero-img h1{font-size:28px}}
/* v3.9 업종 상세 */
.sd .stabs + .sd-sec{padding-top:40px}
.sd-sec{padding:0 0 22px}
.sd-k{display:block;font-size:15px;font-weight:500;opacity:.9;margin-top:14px}
.phero-img h1{line-height:1.3;margin-top:6px}
.sd-d{max-width:760px;line-height:1.7}
.sd-key{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.sd-key>div{background:#fff;border:1px solid #e3e3e8;padding:22px 22px 20px;display:flex;flex-direction:column;gap:4px}
.sd-key span{font-size:13px;font-weight:600;color:var(--p)}.sd-key b{font-size:19px;font-weight:600;color:#111}.sd-key em{font-style:normal;font-size:15px;color:#444}
.sd-two{display:grid;grid-template-columns:1fr 1fr;gap:36px}
.sd-two .needs,.sd-two .feats{margin-top:6px}
.bh .sd-tab{display:flex;gap:22px}
.sd-tab a{font-size:15px;font-weight:500;color:#444}
.sd-tab a.on{color:#111;font-weight:600;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:8px}
.sd-fs{display:grid;grid-template-columns:repeat(3,1fr);gap:0 26px;padding-top:6px}
.sd-fs[hidden]{display:none}
.sd-f{display:flex;gap:14px;padding:18px 0;border-bottom:1px solid #eee}
.sd-f>span{font-size:14px;font-weight:600;color:var(--p);min-width:24px;padding-top:2px}
.sd-f b{display:block;font-size:17px;font-weight:600;color:#111;margin-bottom:4px}.sd-f p{margin:0;font-size:15px;color:#444;line-height:1.55}
.sd-note{margin:16px 0 0;font-size:15px;color:#444}.sd-note a{color:#111;font-weight:500;text-decoration:underline;text-underline-offset:3px}
.sd-lead{margin:14px 0 18px;color:#333}
.sd-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:0;padding-top:20px}
.sd-flow>div{position:relative;padding:18px 20px;background:#f7f5fe;margin-right:22px;display:flex;flex-direction:column;gap:2px}
.sd-flow>div:not(:last-child):after{content:"";position:absolute;right:-16px;top:50%;margin-top:-6px;border-left:9px solid var(--p);border-top:6px solid transparent;border-bottom:6px solid transparent}
.sd-flow>div:last-child{margin-right:0}
.sd-flow span{font-size:12px;font-weight:600;color:var(--p);letter-spacing:.5px}.sd-flow b{font-size:18px;font-weight:600}.sd-flow em{font-style:normal;font-size:15px;color:#444}
.sd-adm{display:grid;grid-template-columns:1.05fr 1fr;gap:38px;align-items:start}
.adm{border:1px solid #d9d9e0;background:#fff;box-shadow:0 14px 30px rgba(30,10,90,.08)}
.adm-top{height:32px;background:#f1f1f4;display:flex;align-items:center;gap:6px;padding:0 12px;border-bottom:1px solid #e3e3e8}
.adm-top i{width:9px;height:9px;border-radius:50%;background:#cfcfd6}.adm-top span{margin-left:8px;font-size:12px;color:#555}
.adm-body{display:grid;grid-template-columns:150px 1fr;min-height:300px}
.adm-side{background:#24203a;color:#cfcbe6;padding:16px 0;display:flex;flex-direction:column;font-size:13px}
.adm-side b{color:#fff;font-weight:600;padding:0 16px 12px;font-size:14px}
.adm-side span{padding:8px 16px}.adm-side span.on{background:var(--p);color:#fff}
.adm-main{padding:16px;background:#f7f7fa;display:flex;flex-direction:column;gap:12px}
.adm-kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.adm-kpi div{background:#fff;border:1px solid #e6e6ec;padding:10px 12px}.adm-kpi em{display:block;font-style:normal;font-size:12px;color:#555}.adm-kpi strong{font-size:22px;font-weight:600;color:#111}
.adm-list{background:#fff;border:1px solid #e6e6ec;padding:10px 12px}.adm-list b{display:block;font-size:13px;font-weight:600;margin-bottom:4px}
.adm-list p{margin:0;display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-top:1px solid #f0f0f3;font-size:13px;color:#222}
.adm-list i{font-style:normal;font-size:11px;font-weight:600;padding:1px 6px;border:1px solid #ccc;color:#444}.adm-list i.n{border-color:var(--p);color:var(--p)}
.adm-txt .feats li{font-size:15px;color:#444}.adm-txt .feats li b{font-weight:600;color:#111}
.sd-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding-top:20px}
.sd-p{border:1px solid #e3e3e8;padding:22px;position:relative}
.sd-p.on{border-color:var(--p);box-shadow:inset 0 3px 0 var(--p)}
.sd-r{position:absolute;right:14px;top:14px;font-size:12px;font-weight:600;color:var(--p);border:1px solid var(--p);padding:1px 7px}
.sd-p h3{margin:0;font-size:19px;font-weight:600}.sd-p>p{margin:4px 0 12px;font-size:15px;color:#444}
.sd-p ul{list-style:none;margin:0;padding:0}.sd-p li{padding:8px 0 8px 20px;border-top:1px solid #f0f0f0;font-size:15px;position:relative}
.sd-p li:before{content:"";position:absolute;left:2px;top:15px;width:8px;height:4px;border-left:2px solid var(--p);border-bottom:2px solid var(--p);transform:rotate(-45deg)}
.sd-mods{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding-top:18px}
.sd-mods a{display:flex;align-items:center;gap:12px;border:1px solid #e3e3e8;padding:14px}
.sd-mods a:hover{border-color:#111;text-decoration:none}.sd-mods a:hover b{text-decoration:underline;text-underline-offset:3px}
.sd-mods .ico{width:36px;height:36px;flex:none}.sd-mods span{display:flex;flex-direction:column;min-width:0}.sd-mods b{font-size:15px;font-weight:600;color:#111}.sd-mods em{font-style:normal;font-size:13px;color:#555}
.sd .box .work-wide{margin-top:18px;max-width:none;display:grid;grid-template-columns:1.6fr 1fr}.sd .box .work-wide .shot-in img{width:100%;display:block}.sd .box .work-wide .meta{border:0;border-left:1px solid #eee;align-items:flex-start;flex-direction:column;justify-content:center;gap:14px}@media(max-width:900px){.sd .box .work-wide{grid-template-columns:1fr}.sd .box .work-wide .meta{border-left:0}}
.sd .sd-sec + #faq{padding-top:40px}
@media(max-width:900px){
 .sd-key{grid-template-columns:repeat(2,1fr)}.sd-two,.sd-adm{grid-template-columns:1fr;gap:20px}
 .sd-fs{grid-template-columns:1fr}.sd-flow{grid-template-columns:repeat(2,1fr);gap:10px}.sd-flow>div{margin:0}.sd-flow>div:after{display:none}
 .sd-plans{grid-template-columns:1fr}.sd-mods{grid-template-columns:repeat(2,1fr)}
 .bh{flex-wrap:wrap;gap:8px}.adm-body{grid-template-columns:110px 1fr}
}
@media(max-width:600px){.sd-mods{grid-template-columns:1fr}.sd-key b{font-size:17px}.sd .stabs + .sd-sec{padding-top:24px}}
/* v4.0 업종 상세 정리 */
.sd-strip{display:grid;grid-template-columns:repeat(5,1fr);margin-top:34px;border-top:1px solid rgba(255,255,255,.35)}
.sd-strip>div{padding:14px 16px 0 0;display:flex;flex-direction:column;gap:2px}
.sd-strip>div+div{padding-left:16px;border-left:1px solid rgba(255,255,255,.25)}
.sd-strip b{font-size:16px;font-weight:600;color:#fff}.sd-strip em{font-style:normal;font-size:14px;color:rgba(255,255,255,.85)}
.sd-strip .tm b{color:#ffd75e}
.sd-sect{background:#fff;border-bottom:1px solid #e6e6ea}
.sd-sect .wrap{display:flex;align-items:center;gap:22px;height:50px;overflow-x:auto;white-space:nowrap}
.sd-sect span{font-size:13px;color:#555;flex:none}
.sd-sect a{font-size:15px;font-weight:500;color:#444;flex:none}
.sd-sect a.on{color:#111;font-weight:600;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:8px}
.sd-nav{position:sticky;top:68px;z-index:40;background:#fff;border-bottom:1px solid #e6e6ea;box-shadow:0 6px 14px rgba(0,0,0,.04)}
@media(min-width:901px){.sd-nav{top:72px}}
.sd-nav .wrap{display:flex;align-items:center;gap:26px;height:52px;overflow-x:auto;white-space:nowrap;scrollbar-width:none}
.sd-nav .wrap::-webkit-scrollbar{display:none}
.sd-nav a{font-size:15px;font-weight:500;color:#444;flex:none}
.sd-nav a.on{color:#111;font-weight:600;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:8px}
.sd-nav a.sd-cta{margin-left:auto;height:34px;padding:0 14px;display:inline-flex;align-items:center;background:var(--p);color:#fff;font-weight:600}
.sd-nav a.sd-cta:hover{text-decoration:none;background:var(--p2)}
.sd-first{padding-top:40px!important}
.sd-sec{scroll-margin-top:140px}
.sd-pair{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-top:20px}
.sd-pair>div{border:1px solid #e6e6ea;display:flex;flex-direction:column}
.sd-pair p{margin:0;padding:16px 18px;font-size:15px;line-height:1.55;display:flex;flex-direction:column;gap:6px}
.sd-pair p span{font-size:12px;font-weight:600;letter-spacing:.3px}
.sd-pair .q{color:#333;flex:1}.sd-pair .q span{color:#666}
.sd-pair .a{background:#f7f5fe;color:#111;font-weight:500;border-top:1px solid #ebe6fb}.sd-pair .a span{color:var(--p)}
.sd-ex{margin-top:26px;padding-top:20px;border-top:1px solid #e6e6ea}
.sd-ex h3{margin:0 0 12px;font-size:17px;font-weight:600}
.sd-ex>div:not(.sd-mods){display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.sd-ex>div p{margin:0;background:#f7f7f9;padding:14px 16px;display:flex;flex-direction:column;gap:3px}
.sd-ex>div p b{font-size:15px;font-weight:600}.sd-ex>div p span{font-size:14px;color:#444;line-height:1.5}
.sd-ex .sd-mods{padding-top:0}
.sd-pt{margin-top:12px;padding-top:10px;border-top:1px solid #eee;font-size:14px;color:#444}.sd-pt b{font-weight:600;color:#111;margin-left:4px}
.sd-faq{margin-top:4px;border-top:0}
.sd-sib{padding-top:18px}
.sd-end{height:68px}
@media(max-width:900px){
 .sd-nav{top:58px}.sd-nav .wrap{gap:20px;height:48px}.sd-nav a.sd-cta{display:none}
 .sd-strip{grid-template-columns:1fr;margin-top:24px;border-top:1px solid rgba(255,255,255,.3)}
 .sd-strip>div,.sd-strip>div+div{flex-direction:row;justify-content:space-between;gap:10px;padding:9px 0;border-left:0;border-bottom:1px solid rgba(255,255,255,.18)}
 .sd-strip b{font-size:15px}.sd-strip em{font-size:14px;text-align:right}
 .sd-pair{grid-template-columns:1fr;gap:10px}.sd-ex>div:not(.sd-mods){grid-template-columns:1fr 1fr}
 .adm{max-width:440px}.adm-body{min-height:0}.adm-kpi strong{font-size:18px}
 .sd-sib.sol3.n3{grid-template-columns:repeat(2,1fr)}.sd-end{height:40px}
}
@media(max-width:600px){.sd-ex>div:not(.sd-mods){grid-template-columns:1fr}.adm-side{display:none}.adm-body{grid-template-columns:1fr}.sd-sib.sol3.n3 a:nth-child(3){display:none}}
/* v4.1 휴대폰: 떠 있는 버튼 → 화면 아래 한 줄 */
@media(max-width:900px){
 body{padding-bottom:52px}
 .qmenu{left:0;right:0;bottom:0;flex-direction:row;gap:0;opacity:1;visibility:visible;background:#fff;border-top:1px solid #d6d6dc;box-shadow:0 -4px 14px rgba(0,0,0,.06)}
 .qmenu a,.qmenu button{flex:1;width:auto;height:52px;flex-direction:row;gap:3px;font-size:15px;box-shadow:none;border:0;border-left:1px solid #e6e6ea}
 .qmenu a b{font-size:15px}
 .qmenu a:first-child{border-left:0}
 .qmenu button{flex:0 0 64px;height:52px;font-size:13px}
}
/* ===== v4.2 메인 새 단장 ===== */
.js .rv{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.js .rv.in{opacity:1;transform:none}
/* 첫 화면: 샘플 화면이 흐르는 배경 */
.h-hero2{position:relative;overflow:hidden;padding:96px 0 88px}
.h-hero2>.wrap{position:relative;z-index:2}
.h2-mq{position:absolute;inset:0;z-index:0;display:flex;flex-direction:column;justify-content:center;gap:18px;transform:rotate(-6deg) scale(1.15);opacity:.3}

.mq-row{overflow:hidden}
.mq-track{display:flex;gap:18px;width:max-content;animation:mq 90s linear infinite}
.mq-row.r2 .mq-track{animation-duration:110s;animation-direction:reverse}
.mq-track img{width:300px;height:188px;object-fit:cover;object-position:top;display:block;box-shadow:0 10px 24px rgba(0,0,0,.25)}
@keyframes mq{to{transform:translateX(-50%)}}
.h-hero2:before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse at center,rgba(90,50,220,.55) 0%,rgba(82,40,207,.88) 60%,#4a22c4 100%)}
@media(prefers-reduced-motion:reduce){.mq-track{animation:none}}
/* 숫자 띠 */
.hm-stats{background:#fff;border-bottom:1px solid #e6e6ea}
.hm-stats .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.hm-stats .wrap>div{padding:26px 0 24px;display:flex;flex-direction:column;align-items:center;gap:2px}
.hm-stats .wrap>div+div{border-left:1px solid #eee}
.hm-stats b{font-size:32px;font-weight:600;color:var(--p);letter-spacing:-.5px;line-height:1.2}.hm-stats b small{font-size:17px;margin-left:2px;color:#111}
.hm-stats em{font-style:normal;font-size:15px;color:#444}
/* 구간 */
.hm{padding:80px 0}
.hm-white{background:#fff}.hm-tint{background:#f6f3ff}.hm-gray{background:#f3f3f6}
.hm-dark{background:#1d1640;color:#fff}
.hm-h{margin-bottom:30px}.hm-h.row{display:flex;justify-content:space-between;align-items:flex-end;gap:20px}
.hm-h span,.hm-adm-t>span{font-size:13px;font-weight:600;letter-spacing:1.5px;color:var(--p)}
.hm-h h2{margin:6px 0 8px;font-size:32px;font-weight:600;letter-spacing:-.6px;line-height:1.3}
.hm-h p{margin:0;font-size:16px;color:#444}
.hm-more{flex:none;font-size:15px;font-weight:500;color:#111;border:1px solid #ccc;background:#fff;height:42px;padding:0 18px;display:inline-flex;align-items:center}
.hm-more:after{content:"→";margin-left:8px}
.hm-more:hover{border-color:#111}
.hm .easy{padding-top:0}
.ez{transition:transform .2s,box-shadow .2s,border-color .2s}
.ez:hover{transform:translateY(-3px);box-shadow:0 14px 28px rgba(40,20,110,.10)}
.hm-flow{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:22px;padding:16px 20px;background:#f7f7f9;font-size:15px}
.hm-flow span{font-size:13px;font-weight:600;color:var(--p)}
.hm-flow b{font-weight:500;color:#111}.hm-flow i{width:18px;height:1px;background:#bbb}
.hm-flow a{margin-left:auto;font-weight:500;color:#111;text-decoration:underline;text-underline-offset:3px}
.sol3-i{transition:transform .2s,box-shadow .2s}
.sol3-i:hover{transform:translateY(-3px);box-shadow:0 14px 28px rgba(40,20,110,.12)}
/* 샘플: 노트북 + 휴대폰 */
.hm-tabs{display:flex;flex-wrap:wrap;gap:6px 28px;margin:0 0 26px;padding-bottom:14px;border-bottom:1px solid #ddd}
.hm-tabs a{font-size:16px;font-weight:500;color:#444}
.hm-tabs a.on{color:#111;font-weight:600;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:8px}
.hm-dev{position:relative}
.hm-pane{display:none;grid-template-columns:1fr 300px;gap:40px;align-items:center}
.hm-pane.on{display:grid;animation:fadeup .45s ease}
@keyframes fadeup{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.dv-lap{display:block;position:relative;background:#1b1b22;padding:0 0 0;border:10px solid #1b1b22;border-top-width:0;box-shadow:0 30px 60px rgba(30,15,90,.18)}
.dv-bar{display:flex;align-items:center;gap:6px;height:28px;padding:0 6px;background:#1b1b22}
.dv-bar i{width:9px;height:9px;border-radius:50%;background:#55555f}
.dv-bar em{font-style:normal;font-size:12px;color:#b8b8c4;margin-left:10px;background:#2a2a33;padding:2px 12px}
.dv-lap img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top}
.hm-pane .dv-ph{position:absolute;left:calc(100% - 300px - 40px - 120px);bottom:-30px;width:150px;border:7px solid #1b1b22;border-radius:22px;overflow:hidden;background:#fff;box-shadow:0 20px 40px rgba(0,0,0,.25)}
.dv-ph img{display:block;width:100%;aspect-ratio:9/18;object-fit:cover;object-position:top}
.dv-cap{display:flex;flex-direction:column;gap:10px}
.dv-cap b{font-size:22px;font-weight:600}.dv-cap span{font-size:16px;color:#444;line-height:1.6}
.dv-cap .btn{align-self:flex-start;margin-top:8px}
/* 관리자 (진한 구간) */
.hm-adm{display:grid;grid-template-columns:1fr 1.1fr;gap:60px;align-items:center}
.hm-adm-t>span{color:#b9a6ff}
.hm-adm-t h2{margin:8px 0 22px;font-size:32px;font-weight:600;line-height:1.35;letter-spacing:-.6px;color:#fff}
.hm-adm-t ul{list-style:none;margin:0 0 28px;padding:0}
.hm-adm-t li{padding:14px 0;border-top:1px solid rgba(255,255,255,.14);display:flex;flex-direction:column;gap:2px;font-size:15px;color:rgba(255,255,255,.82)}
.hm-adm-t li b{font-size:17px;font-weight:600;color:#fff}
.hm-dark .adm{border-color:#3a3166;box-shadow:0 30px 70px rgba(0,0,0,.45)}
/* 제작 사례 */
.hm-works{display:grid;grid-template-columns:1.55fr 1fr;gap:34px;align-items:start}
.hw-stage{position:relative}
.hw-stage .dv-lap{display:none}.hw-stage .dv-lap.on{display:block;animation:fadeup .45s ease}
.hw-list{display:flex;flex-direction:column;background:#fff;border:1px solid #e3e3e8}
.hw-list button{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:2px;padding:14px 18px;border-top:1px solid #eee;position:relative}
.hw-list button:first-child{border-top:0}
.hw-list button span{font-size:12px;font-weight:600;color:var(--p)}
.hw-list button b{font-size:16px;font-weight:600;color:#111}
.hw-list button em{font-style:normal;font-size:14px;color:#444;display:none}
.hw-list button:hover b{text-decoration:underline;text-underline-offset:3px}
.hw-list button.on{background:#f6f3ff;box-shadow:inset 3px 0 0 var(--p)}.hw-list button.on em{display:block}
/* 후기 */
.hm-rv{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.hm-rv a{display:flex;flex-direction:column;background:#fff;border:1px solid #e3e3e8;transition:transform .2s,box-shadow .2s}
.hm-rv a:hover{text-decoration:none;transform:translateY(-3px);box-shadow:0 14px 28px rgba(40,20,110,.10)}
.rv-shot{aspect-ratio:16/8;overflow:hidden;border-bottom:1px solid #eee}.rv-shot img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.hm-rv q{display:block;padding:22px 22px 10px;font-size:17px;font-weight:500;line-height:1.6;color:#111;quotes:none;position:relative}
.hm-rv q:before{content:none}
.hm-rv span{margin-top:auto;padding:0 22px 20px;font-size:14px;color:#555;display:flex;gap:8px}.hm-rv span b{color:#111;font-weight:600}
.hm .two-box .box,.hm .h-band{margin:0}
.home .hm:last-child{padding-bottom:0}
@media(max-width:900px){
 .h-hero2{padding:56px 0 52px}.mq-track img{width:200px;height:125px}
 .hm{padding:56px 0}.hm-h h2,.hm-adm-t h2{font-size:24px}.hm-h.row{flex-direction:column;align-items:flex-start}
 .hm-stats .wrap{grid-template-columns:repeat(2,1fr)}.hm-stats .wrap>div:nth-child(3){border-left:0}.hm-stats .wrap>div:nth-child(n+3){border-top:1px solid #eee}
 .hm-stats b{font-size:26px}.hm-stats em{font-size:13px;text-align:center}
 .hm-pane{grid-template-columns:1fr;gap:26px}.hm-pane .dv-ph{display:none}
 .hm-adm,.hm-works{grid-template-columns:1fr;gap:30px}
 .hm-rv{grid-template-columns:1fr}.hm-flow a{margin-left:0}.hm-flow i{display:none}.hm-flow{flex-direction:column;align-items:flex-start;gap:6px}
 .hm-tabs{gap:6px 20px;overflow-x:auto;flex-wrap:nowrap;white-space:nowrap}
}
.hm-dark .adm{color:#111}
.two-box>*{min-width:0}.nlist a{min-width:0}.nlist a span{min-width:0}
/* v4.3 자주 묻는 질문 분류 탭 */
.faqf{display:flex;flex-wrap:wrap;gap:6px 26px;margin:0 0 20px;padding-bottom:12px;border-bottom:1px solid #ddd}
.faqf a{font-size:16px;font-weight:500;color:#444}
.faqf a.on{color:#111;font-weight:600;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:8px}
.faq details p{line-height:1.75}
@media(max-width:600px){.faqf{gap:6px 18px}.faqf a{font-size:15px}}
/* v4.3.1 자주 묻는 질문 답변: 문장마다 한 줄, 회색 상자 안에 가지런히 */
.faq .fa{margin:0 4px 20px;padding:16px 20px;background:#f6f6f8;border-left:2px solid var(--p);display:flex;flex-direction:column;gap:4px}
.faq .fa span{display:block;font-size:15px;line-height:1.7;color:#222}
@media(max-width:600px){.faq .fa{padding:14px 16px;gap:6px}}
/* v4.4 자주 묻는 질문 페이지 */
.fq{padding:50px 0 0}
.fq-in{display:grid;grid-template-columns:270px 1fr;gap:40px;align-items:start}
.fq-side{position:sticky;top:96px;display:flex;flex-direction:column;gap:16px}
.fq-search input{width:100%;height:46px;border:1px solid #ccc;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23555' stroke-width='1.8'%3E%3Ccircle cx='7' cy='7' r='5.5'/%3E%3Cpath d='M11 11l4 4'/%3E%3C/svg%3E") no-repeat right 14px center;padding:0 40px 0 14px;font:inherit;font-size:15px;color:#111}
.fq-search input:focus{outline:none;border-color:#111}
.fq-cats{display:flex;flex-direction:column;background:#fff;border:1px solid #e3e3e8}
.fq-cats a{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;font-size:16px;font-weight:500;color:#333;border-top:1px solid #f0f0f3}
.fq-cats a:first-child{border-top:0}
.fq-cats a em{font-style:normal;font-size:13px;color:#555;background:#f3f3f6;padding:1px 8px}
.fq-cats a:hover span{text-decoration:underline;text-underline-offset:3px}
.fq-cats a:hover{text-decoration:none}
.fq-cats a.on{background:#f6f3ff;color:#111;font-weight:600;box-shadow:inset 3px 0 0 var(--p)}
.fq-cats a.on em{background:var(--p);color:#fff}
.fq-help{background:#1d1640;color:#fff;padding:22px 20px;display:flex;flex-direction:column;gap:6px}
.fq-help b{font-size:17px;font-weight:600}.fq-help p{margin:0 0 10px;font-size:14px;line-height:1.6;color:rgba(255,255,255,.85)}
.fq-help .btn{align-self:flex-start}
.fq-head{display:flex;align-items:baseline;gap:10px;padding-bottom:14px;margin-bottom:16px;border-bottom:1px solid #ddd}
.fq-head h2{margin:0;font-size:22px;font-weight:600}.fq-head span{font-size:15px;color:#555}
.fq-list{display:flex;flex-direction:column;gap:10px}
.fq-i{background:#fff;border:1px solid #e3e3e8;transition:border-color .2s}
.fq-i[open]{border-color:#c9bdf6}
.fq-i summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;padding:18px 54px 18px 20px;position:relative;font-size:17px;font-weight:500;color:#111}
.fq-i summary::-webkit-details-marker{display:none}
.fq-i summary:after{content:"";position:absolute;right:22px;top:50%;width:9px;height:9px;margin-top:-7px;border-right:1.5px solid #333;border-bottom:1.5px solid #333;transform:rotate(45deg);transition:transform .2s}
.fq-i[open] summary:after{transform:rotate(-135deg);margin-top:-2px}
.fq-i summary:hover span{text-decoration:underline;text-underline-offset:3px}
.fq-i summary i,.fq-i .fa>i{flex:none;width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:14px;font-weight:600}
.fq-i summary i{background:var(--p);color:#fff}
.fq-i .fa{display:flex;margin:0 20px 20px;padding:16px 18px;background:#f7f7f9;border-left:0;flex-direction:row;gap:14px;align-items:flex-start}
.fq-i .fa>i{background:#fff;border:1px solid #c9bdf6;color:var(--p)}
.fq-i .fa>div{display:flex;flex-direction:column;gap:4px;padding-top:2px}
.fq-empty{padding:40px;text-align:center;background:#fff;border:1px dashed #ccc;color:#444}
@media(max-width:900px){
 .fq{padding-top:30px}.fq-in{grid-template-columns:1fr;gap:20px}.fq-side{position:static}
 .fq-cats{flex-direction:row;overflow-x:auto;border:0;border-bottom:1px solid #ddd;background:none;gap:20px}
 .fq-cats a{padding:8px 0;border:0;flex:none;gap:6px}.fq-cats a.on{background:none;box-shadow:inset 0 -2px 0 #111}
 .fq-help{display:none}
 .fq-i summary{font-size:16px;padding:15px 44px 15px 14px;gap:10px}.fq-i .fa{margin:0 12px 14px;padding:14px;gap:10px}
}
.fq-i .fa span{display:block;font-size:15px;line-height:1.7;color:#222}
/* v4.5 하위 메뉴(.stabs): 네모 버튼 → 글자 메뉴 */
.stabs .wrap{gap:28px;padding-top:0;padding-bottom:0;height:54px;align-items:center;scrollbar-width:none}
.stabs .wrap::-webkit-scrollbar{display:none}
.stabs a{height:auto;padding:6px 0;border:0;background:none;font-size:16px;font-weight:500;color:#444}
.stabs a:hover{background:none;border:0;color:#111;text-decoration:underline;text-underline-offset:6px}
.stabs a.on{background:none;border:0;color:#111;font-weight:600;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:8px}
@media(max-width:900px){.stabs .wrap{gap:20px;height:50px}.stabs a{font-size:15px}}
/* v4.6 사용 가이드 */
.gd-toc{display:flex;flex-direction:column;background:#fff;border:1px solid #e3e3e8;padding:8px 0}
.gd-toc b{font-size:13px;font-weight:600;color:var(--p);padding:12px 18px 4px}
.gd-toc a{padding:7px 18px;font-size:15px;color:#333}
.gd-toc a:hover{text-decoration:underline;text-underline-offset:3px}
.gd-toc a.on{color:#111;font-weight:600;background:#f6f3ff;box-shadow:inset 3px 0 0 var(--p)}
.gd-grp{margin-bottom:30px}
.gd-grp h3{margin:0 0 12px;font-size:15px;font-weight:600;color:var(--p)}
.gd-c{background:#fff;border:1px solid #e3e3e8;padding:24px 26px;margin-bottom:12px;scroll-margin-top:110px}
.gd-h{display:flex;gap:16px;align-items:flex-start;padding-bottom:16px;border-bottom:1px solid #eee}
.gd-h>span{flex:none;width:40px;height:40px;background:var(--p);color:#fff;font-size:15px;font-weight:600;display:flex;align-items:center;justify-content:center}
.gd-h h4{margin:0 0 2px;font-size:19px;font-weight:600}.gd-h p{margin:0;font-size:15px;color:#444}
.gd-steps{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.gd-steps li{display:flex;flex-direction:column;gap:8px;background:#f7f7f9;padding:16px}
.gd-steps i{font-style:normal;width:26px;height:26px;border:1px solid #c9bdf6;background:#fff;color:var(--p);font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center}
.gd-steps span{font-size:15px;line-height:1.6;color:#222}
.gd-tip{margin:12px 0 0;padding:12px 16px;border-left:2px solid var(--p);background:#faf9ff;font-size:15px;line-height:1.6;color:#333}
.gd-tip b{font-weight:600;color:var(--p);margin-right:10px}
@media(max-width:900px){
 .gd .gd-toc{display:none}.gd-c{padding:18px 16px}.gd-steps{grid-template-columns:1fr}.gd-steps li{flex-direction:row;align-items:flex-start;gap:12px;padding:12px 14px}.gd-steps i{flex:none}
}
/* v4.8 소식 게시판 분류 글자 탭 */
.bd-cats{display:flex;gap:24px;margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid #ddd}
.bd-cats a{font-size:16px;font-weight:500;color:#444}
.bd-cats a.on{color:#111;font-weight:600;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:8px}
/* v4.8.1 메가메뉴: 묶음 제목을 업종 목록과 같은 왼쪽 선에 맞춤, 선은 얇게 */
@media(min-width:901px){
 .sub a.mg-h{padding:0 0 12px;margin-bottom:8px;border-bottom:1px solid #222;background:none;white-space:nowrap}
 .sub a.mg-h:hover{background:none}
 .sub a.mg-a{padding:7px 0}
}

/* v4.8.4 구축 기록 줄맞춤 */
.rv-in h3,.rv-in p,.hm-rv q{word-break:keep-all;text-wrap:pretty}
.rv-in p span{display:block}

/* v4.8.8 사례 이미지 비율 통일 (1200x626, 잘림 없음) */
.wk-img,.rv-img,.rv-shot{aspect-ratio:1200/626}
.hw-stage .dv-lap img{aspect-ratio:1200/626}

/* v4.9 브랜드명 makeit24 */
.logo b,.db-logo b{font-weight:600;color:var(--p);margin-left:-7px;letter-spacing:-.3px}
.ft .logo b{color:#333}
/* v4.9.1 로고 키움 */
.logo{font-size:26px;gap:10px}
.logo i{width:32px;height:32px}.logo i:after{left:9px;top:9px;width:14px;height:14px;border-width:3px}
.logo b{margin-left:-9px}
.ft .logo{font-size:18px;gap:8px}.ft .logo i{width:20px;height:20px}.ft .logo i:after{left:5px;top:5px;width:9px;height:9px;border-width:2px}.ft .logo b{margin-left:-7px}
@media(max-width:900px){.logo{font-size:23px;gap:9px}.logo i{width:28px;height:28px}.logo i:after{left:8px;top:8px;width:12px;height:12px;border-width:2.5px}.logo b{margin-left:-8px}.ft .logo{font-size:18px}}

/* v4.9.3 부담 없이 시작 — 명세서형 */
.own2{background:#fbfaf8;border-top:1px solid #ecebe8;border-bottom:1px solid #ecebe8}
.own2 .wrap,.box.own2-box{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.own2-t span{font-size:13px;font-weight:600;letter-spacing:1.5px;color:var(--p)}
.own2-t h2{margin:10px 0 16px;font-size:34px;font-weight:600;line-height:1.38;letter-spacing:-.8px;color:#111}
.own2-t p{margin:0;font-size:16px;line-height:1.75;color:#444;word-break:keep-all;max-width:440px}
.own2-a{display:flex;align-items:center;gap:20px;margin-top:28px;flex-wrap:wrap}
.own2-l{font-size:15px;color:#333;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#bbb}
.own2-l:hover{text-decoration-color:#333}
.rc{background:#fff;border:1px solid #e3e3e8;padding:30px 34px 26px;box-shadow:0 18px 40px rgba(20,10,60,.06)}
.rc-h{display:flex;justify-content:space-between;align-items:baseline;padding-bottom:16px;border-bottom:1px solid #111}
.rc-h b{font-size:18px;font-weight:600;color:#111}.rc-h span{font-size:13px;color:#666}
.rc dl{margin:0}
.rc dl>div{display:flex;align-items:baseline;gap:12px;padding:18px 0;border-bottom:1px solid #eee}
.rc dt{font-size:16px;color:#222;display:flex;flex-direction:column;gap:2px;white-space:nowrap}
.rc dt small{font-size:13px;color:#777}
.rc dl i{flex:1;border-bottom:1px dotted #ccc;transform:translateY(-4px)}
.rc dd{margin:0;font-size:20px;font-weight:600;color:#111;letter-spacing:-.3px;white-space:nowrap}
.rc dl>div:nth-child(3) dd,.rc dl>div:nth-child(4) dd{color:var(--p)}
.rc-f{margin:16px 0 0;font-size:14px;color:#555}
.box.own2-box{padding:44px 48px!important;background:#fbfaf8}
.own2-box .own2-t h2{font-size:28px}
@media(max-width:900px){.own2 .wrap,.box.own2-box{grid-template-columns:1fr;gap:32px}.own2-t h2{font-size:26px}.box.own2-box{padding:28px 20px!important}.rc{padding:22px 20px 18px}.rc dd{font-size:17px}.rc dt{font-size:15px;white-space:normal}}

/* v4.9.6 나도 할 수 있을까 — 단계 + 3년 비교 */
.own3{background:linear-gradient(180deg,#fff 0%,#f8f6fd 100%);border-top:1px solid #ecebe8}
.own3 .wrap,.box.own3-box{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:stretch}
.own3-t{display:flex;flex-direction:column}
.own3-t>span{font-size:14px;font-weight:600;color:var(--p)}
.own3-t h2{margin:10px 0 14px;font-size:34px;font-weight:600;line-height:1.38;letter-spacing:-.9px;color:#111;word-break:keep-all}
.own3-t h2 em{font-style:normal;color:var(--p);box-shadow:inset 0 -.32em 0 #ece5ff}
.own3-t>p{margin:0;font-size:16px;line-height:1.75;color:#444;word-break:keep-all}
.own3-s{list-style:none;margin:26px 0 0;padding:0;display:flex;flex-direction:column;border-top:1px solid #e6e3ef}
.own3-s li{display:flex;gap:16px;align-items:flex-start;padding:16px 0;border-bottom:1px solid #e6e3ef}
.own3-s li>b{flex:none;width:34px;height:34px;display:flex;align-items:center;justify-content:center;background:var(--p);color:#fff;font-size:15px;font-weight:600}
.own3-s h3{margin:1px 0 3px;font-size:17px;font-weight:600;color:#111}
.own3-s p{margin:0;font-size:14.5px;line-height:1.6;color:#444;word-break:keep-all}
.own3-a{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:26px}
.cmp{background:#fff;border:1px solid #e3e1ea;padding:30px 32px 22px;box-shadow:0 20px 44px rgba(40,20,110,.07);display:flex;flex-direction:column}
.cmp-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding-bottom:14px;border-bottom:1px solid #111;margin-bottom:4px}
.cmp-h b{font-size:18px;font-weight:600;color:#111}.cmp-h span{font-size:13px;color:#666;white-space:nowrap}
.cmp-r{display:grid;grid-template-columns:1fr auto;grid-template-areas:"l v" "bar bar";gap:12px 16px;padding:20px 0;border-bottom:1px solid #eeecf3}
.cmp-l{grid-area:l}.cmp-l b{display:block;font-size:16px;font-weight:600;color:#333;margin-bottom:2px}.cmp-l em{font-style:normal;font-size:13px;color:#777}
.cmp-v{grid-area:v;text-align:right;font-size:24px;font-weight:600;color:#555;letter-spacing:-.5px;line-height:1.2}
.cmp-v small{display:block;font-size:13px;font-weight:400;color:#777;letter-spacing:0;margin-top:4px}
.cmp-bar{grid-area:bar;height:12px;background:#efedf3}.cmp-bar i{display:block;height:100%;background:#bdb9c7}
.cmp-r.me .cmp-l b{color:var(--p)}.cmp-r.me .cmp-v{color:var(--p);font-size:28px}.cmp-r.me .cmp-v small{color:#111;font-weight:500}
.cmp-r.me .cmp-bar i{background:var(--p)}
.cmp-save{margin-top:auto;display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px;background:#f4f0fe;border-left:3px solid var(--p);padding:16px 18px;margin-top:20px}
.cmp-save span{font-size:15px;color:#333}.cmp-save b{font-size:22px;font-weight:600;color:var(--p);letter-spacing:-.4px}
.cmp-f{margin:12px 0 0;font-size:12.5px;color:#777;line-height:1.6}
.box.own3-box{padding:44px 48px!important;background:linear-gradient(180deg,#fff,#f8f6fd)}
.own3-box .own3-t h2{font-size:28px}
@media(max-width:900px){.own3 .wrap,.box.own3-box{grid-template-columns:1fr;gap:28px}.own3-t h2{font-size:25px}.box.own3-box{padding:28px 20px!important}.cmp{padding:20px 18px 16px}.cmp-v{font-size:20px}.cmp-r.me .cmp-v{font-size:22px}.cmp-h{flex-direction:column;gap:2px}}
.own3-n{display:grid;grid-template-columns:1fr 1.25fr 1fr;margin-top:24px;border:1px solid #e3e1ea;background:#fff}
.own3-n>div{padding:16px 16px 14px;display:flex;flex-direction:column;gap:2px}
.own3-n>div+div{border-left:1px solid #e3e1ea}
.own3-n em{font-style:normal;font-size:13px;color:#666}
.own3-n b{font-size:22px;font-weight:600;color:#111;letter-spacing:-.4px}
.own3-n .hi{background:var(--p);border-left:0!important}
.own3-n .hi em{color:#dcd0ff}.own3-n .hi b{color:#fff;font-size:26px}.own3-n .hi small{font-size:12.5px;color:#ece6ff}
.own3-n>div:last-child b{color:var(--p)}
.own3-s{margin-top:20px}
@media(max-width:900px){.own3-n{grid-template-columns:1fr 1fr}.own3-n .hi{grid-column:1/-1;grid-row:1}.own3-n>div:nth-child(1){border-left:0}.own3-n>div:nth-child(1),.own3-n>div:nth-child(3){border-top:1px solid #e3e1ea}.own3-n b{font-size:19px}.own3-n .hi b{font-size:24px}}
.cmp-r{flex:1;align-content:center}
@media(max-width:900px){.cmp-r{flex:none}}
/* v4.9.7 메인 정리: 히어로 상담 버튼, FAQ, 안심 문구 */
.h2-cta{display:flex;justify-content:center;align-items:center;gap:22px;margin-top:18px}
.h2-cta .btn-white{background:#fff;color:#3f1fa8;border-color:#fff;font-weight:500}
.h2-cl{color:#fff;font-size:15px;text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(255,255,255,.5)}
.h2-cl:hover{text-decoration-color:#fff}
.hm-faq{display:grid;grid-template-columns:340px 1fr;gap:56px;align-items:start}
.hm-faq .hm-h{margin:0;position:sticky;top:100px}
.hm-faq .hm-h .hm-more{display:inline-flex;margin-top:22px}
.hm-faq .faq{margin:0}
.hb-ok{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hb-ok li{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);padding:14px 16px;font-size:15px;font-weight:500;color:#fff}
.hb-ok li:before{content:"";flex:none;width:7px;height:12px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg) translateY(-2px);margin:0 4px 0 2px}
@media(max-width:900px){.h2-cta{flex-wrap:wrap;gap:14px}.hm-faq{grid-template-columns:1fr;gap:20px}.hm-faq .hm-h{position:static}.hb-ok{grid-template-columns:1fr}}
.hb-ok li{white-space:nowrap}
/* v4.9.9 서버 사양 카드 */
.spec{margin-top:48px}
.spec-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.spec-h h3{margin:0;font-size:22px;font-weight:600}.spec-h p{margin:0;font-size:14px;color:#555}
.spec-g{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.spec-c{position:relative;background:#fff;border:1px solid #e3e1ea;padding:26px 26px 18px}
.spec-c.on{border:2px solid var(--p);box-shadow:0 18px 40px rgba(60,30,160,.1)}
.spec-c>i{position:absolute;top:-1px;right:-1px;background:var(--p);color:#fff;font-style:normal;font-size:12.5px;font-weight:500;padding:5px 10px}
.spec-c.on>i{top:-2px;right:-2px}
.spec-ct b{display:block;font-size:19px;font-weight:600;color:#111}.spec-ct span{font-size:13.5px;color:#666}
.spec-p{display:flex;align-items:baseline;gap:4px;margin:18px 0 16px;padding-bottom:18px;border-bottom:1px solid #111}
.spec-p em{font-style:normal;font-size:15px;color:#444}.spec-p b{font-size:34px;font-weight:600;letter-spacing:-1px;color:#111;line-height:1}
.spec-c.on .spec-p b{color:var(--p)}
.spec-c dl{margin:0}.spec-c dl>div{display:flex;justify-content:space-between;gap:10px;padding:11px 0;border-bottom:1px solid #f0eef4;font-size:14.5px}
.spec-c dl>div:last-child{border-bottom:0}
.spec-c dt{color:#555}.spec-c dd{margin:0;color:#111;font-weight:500;text-align:right}
.spec-all{list-style:none;margin:16px 0 0;padding:14px 20px;display:flex;flex-wrap:wrap;gap:8px 24px;background:#f6f4fb;font-size:14.5px;color:#333}
.spec-all li:not(:first-child):before{content:"✓";color:var(--p);margin-right:6px;font-weight:600}
.spec-all b{font-weight:600;color:#111}
.spec-n{margin:12px 0 0;font-size:14px;color:#555;line-height:1.6}
@media(max-width:900px){.spec-g{grid-template-columns:1fr}.spec-p b{font-size:30px}.spec-all{flex-direction:column;gap:6px}}
.cmp-f a{color:#333;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}