@charset "utf-8";
/* 홈페이지 제작 화면 본문 (서비스 안내 / 웹사이트 제작) */
.sub_page {font-size:14px; line-height:1.7; color:var(--mn-text);}
.sub_page a {text-decoration:none;}
.sub_page h3, .sub_page h4, .sub_page p, .sub_page ul, .sub_page ol, .sub_page dl, .sub_page dd {margin:0; padding:0;}
.sub_page ul, .sub_page ol {list-style:none;}
.sub_page i.bi {line-height:1;}

/* 공통 : 소제목 / 문의 상자 */
.us_h, .pk_h {display:flex; align-items:center; gap:10px; margin:40px 0 16px !important; font-size:18px; font-weight:800; letter-spacing:-.4px; color:var(--mn-ink);}
.us_h:first-child, .pk_h:first-child {margin-top:0 !important;}
.us_h i, .pk_h i {width:34px; height:34px; border-radius:10px; background:var(--mn-green-l); color:var(--mn-green); font-size:17px; display:inline-flex; align-items:center; justify-content:center; flex:none;}
.ec_small {margin-left:8px; font-size:12px; font-weight:500; color:var(--mn-mute);}
.us_cta {display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-top:44px; padding:26px 30px; border-radius:20px; color:#fff;
	background:radial-gradient(600px 240px at 90% -20%, rgba(6,182,212,.5), transparent 60%), var(--mn-ink);}
.us_cta strong {display:block; font-size:18px; font-weight:800; letter-spacing:-.4px;}
.us_cta span {display:block; margin-top:4px; font-size:13px; color:#b6c2d6;}
.us_cta p {display:flex; gap:8px; flex-wrap:wrap;}
.us_cta a, .pk_cta a {display:inline-flex; align-items:center; gap:8px; height:44px; padding:0 20px; border-radius:999px; border:1px solid rgba(255,255,255,.35); color:#fff !important; font-size:14px; font-weight:700; transition:transform .15s, background .15s;}
.us_cta a:hover, .pk_cta a:hover {transform:translateY(-2px); background:rgba(255,255,255,.12);}
.us_cta a.main, .pk_cta a.main {background:#fff; color:var(--mn-ink) !important; border-color:#fff;}
.us_cta a.main:hover, .pk_cta a.main:hover {background:#eaf1ff;}

/* 안내 문구 (리드) */
.us_lead {display:flex; align-items:flex-start; gap:16px; padding:22px 24px; margin-bottom:8px; border-radius:var(--mn-radius); background:var(--mn-green-l);}
.us_lead > i {flex:none; width:44px; height:44px; border-radius:14px; background:linear-gradient(135deg, var(--mn-green), var(--mn-accent2)); color:#fff; font-size:22px; display:inline-flex; align-items:center; justify-content:center;}
.us_lead p {font-size:14.5px; line-height:1.8;}
.us_lead strong {color:var(--mn-green-d);}
.si_end {margin-top:40px;}

/* 아이콘 + 글 목록 */
.us_prep, .us_attn {display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px;}
.us_prep li, .us_attn li {display:flex; align-items:flex-start; gap:14px; padding:18px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff; transition:box-shadow .2s, transform .2s;}
.us_prep li:hover, .us_attn li:hover {box-shadow:var(--mn-shadow); transform:translateY(-2px);}
.us_ic {flex:none; width:44px; height:44px; border-radius:12px; background:var(--mn-green-l); color:var(--mn-green); font-size:21px; display:inline-flex; align-items:center; justify-content:center;}
.us_ic.warn {background:#fff1ea; color:#ea580c;}
.us_prep h4, .us_attn h4 {margin-bottom:6px !important; font-size:15px; font-weight:800; color:var(--mn-ink); letter-spacing:-.3px;}
.us_prep h4 em {display:inline-flex; width:20px; height:20px; margin-right:8px; border-radius:6px; background:var(--mn-green); color:#fff; font-size:11px; font-style:normal; align-items:center; justify-content:center; vertical-align:1px;}
.us_prep p, .us_attn p {font-size:13px; color:var(--mn-sub); line-height:1.7;}
.us_attn {grid-template-columns:minmax(0, 1fr);}

/* 서비스안내 : Promise */
.si_promise {display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px;}
.si_promise li {position:relative; padding:22px 18px 18px; border-radius:var(--mn-radius); background:var(--mn-soft); text-align:center;}
.si_promise b {position:absolute; left:14px; top:12px; font-size:12px; font-weight:800; color:var(--mn-mute); letter-spacing:1px;}
.si_promise i {display:block; margin:6px 0 10px; font-size:30px; color:var(--mn-green);}
.si_promise p {font-size:13px; line-height:1.65; word-break:keep-all;}

/* 제작과정 */
.pr_list {display:flex; flex-direction:column; gap:12px; margin-top:20px;}
.pr_list li {position:relative; display:flex; align-items:flex-start; gap:16px; padding:18px 20px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff;}
.pr_no {flex:none; width:38px; font-size:20px; font-weight:800; color:var(--mn-green); letter-spacing:-.5px; line-height:44px;}
.pr_list h4 {font-size:15.5px; font-weight:800; color:var(--mn-ink); margin-bottom:4px !important;}
.pr_list h4 small {margin-left:8px; font-size:11px; font-weight:600; letter-spacing:.5px; color:var(--mn-mute);}
.pr_list p {font-size:13px; color:var(--mn-sub);}

/* 웹표준 */
.sd_box {padding:22px 24px; border-radius:var(--mn-radius); background:var(--mn-soft);}
.sd_box p + p {margin-top:10px !important;}
.sd_quote {display:flex; align-items:flex-start; gap:8px; font-size:17px; font-weight:800; color:var(--mn-green-d); letter-spacing:-.4px;}
.sd_quote i {color:var(--mn-green); font-size:24px;}
.sd_layers {display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px;}
.sd_layers li {padding:22px 16px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); text-align:center;}
.sd_layers .us_ic {margin:0 auto 12px;}
.sd_layers strong {display:block; font-size:16px; color:var(--mn-ink);}
.sd_layers em {display:block; margin:2px 0 8px; font-size:12px; font-style:normal; color:var(--mn-green-d); font-weight:700;}
.sd_layers p {font-size:13px; color:var(--mn-sub);}
.sd_list {display:flex; flex-direction:column; border-top:2px solid var(--mn-green);}
.sd_list li {padding:13px 6px; border-bottom:1px solid var(--mn-line); font-size:13.5px;}
.sd_list b {display:inline-block; min-width:170px; margin-right:12px; color:var(--mn-ink);}
.sd_lang {display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px;}
.sd_lang section {padding:20px; border:1px solid var(--mn-line); border-radius:var(--mn-radius);}
.sd_lang h4 {display:flex; align-items:center; gap:8px; margin-bottom:12px !important; font-size:15px; font-weight:800; color:var(--mn-ink);}
.sd_lang dt {margin-top:10px; font-weight:800; color:var(--mn-green-d); font-size:13px;}
.sd_lang dd {font-size:13px; color:var(--mn-sub);}
.sd_browsers {display:flex; flex-wrap:wrap; gap:10px; margin-top:16px !important;}
.sd_browsers li {display:inline-flex; align-items:center; gap:8px; padding:9px 16px; border-radius:999px; background:#fff; border:1px solid var(--mn-line); font-size:13px; font-weight:600;}
.sd_browsers i {color:var(--mn-green); font-size:16px;}

/* 웹사이트 제작 : 히어로 */
.pk_hero {position:relative; overflow:hidden; padding:38px 36px; margin-bottom:22px; border-radius:22px; color:#fff;
	background:radial-gradient(700px 300px at 90% -20%, rgba(6,182,212,.55), transparent 60%), radial-gradient(500px 300px at 0% 120%, rgba(37,99,235,.7), transparent 60%), var(--mn-ink);}
.pk_hero_ic {position:absolute; right:28px; bottom:-14px; font-size:120px; opacity:.12;}
.pk_hero .mn_hero_badge {display:inline-block; padding:4px 14px; border:1px solid rgba(255,255,255,.3); border-radius:999px; background:rgba(255,255,255,.08); color:#cfe3ff; font-size:12.5px; font-weight:700;}
.pk_title {margin-top:14px !important; font-size:30px; line-height:1.3; font-weight:800; letter-spacing:-1px;}
.pk_desc {max-width:620px; margin-top:12px !important; font-size:14.5px; line-height:1.8; color:#b6c2d6;}
.pk_cta {position:relative; display:flex; flex-wrap:wrap; gap:8px; margin-top:22px;}

/* 핵심 요약 4칸 */
.pk_feat {display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:12px;}
.pk_feat li {display:flex; align-items:center; gap:12px; padding:16px; border-radius:var(--mn-radius); background:var(--mn-soft);}
.pk_feat li > i {flex:none; width:40px; height:40px; border-radius:12px; background:#fff; color:var(--mn-green); font-size:19px; display:inline-flex; align-items:center; justify-content:center;}
.pk_feat li > span {font-size:13px; font-weight:700; line-height:1.4; color:var(--mn-ink);}

/* 카드 격자 */
.pk_grid {display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px;}
.pk_grid > li {position:relative; display:flex; flex-direction:column; gap:6px; padding:20px 20px 20px 78px; min-height:84px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff; transition:box-shadow .2s, transform .2s;}
.pk_grid > li:hover {box-shadow:var(--mn-shadow); transform:translateY(-2px);}
.pk_ic {position:absolute; left:20px; top:20px; width:44px; height:44px; border-radius:12px; background:var(--mn-green-l); color:var(--mn-green); font-size:21px; display:inline-flex; align-items:center; justify-content:center;}
.pk_grid > li > strong {font-size:15px; font-weight:800; color:var(--mn-ink); letter-spacing:-.3px;}
.pk_grid > li > strong a {color:inherit;}
.pk_grid > li > strong a:hover {color:var(--mn-green);}
.pk_grid > li > span:not(.pk_ic) {font-size:13px; color:var(--mn-sub); line-height:1.7;}
.ec_pr {display:block; margin-bottom:4px; font-style:normal; font-weight:700; color:var(--mn-green-d); font-size:12.5px;}
.t4_chips {display:flex; flex-wrap:wrap; gap:6px; margin-top:4px;}
.t4_chips li {padding:4px 11px; border-radius:999px; background:var(--mn-soft); font-size:12.5px; color:var(--mn-text);}

/* 키워드 광고 안내 상자 */
.mk_kwcta {display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:26px; padding:20px 24px; border-radius:var(--mn-radius); background:#fff7ed; border:1px solid #fed7aa;}
.mk_kwcta > i {flex:none; font-size:28px; color:#ea580c;}
.mk_kwcta div {flex:1 1 260px;}
.mk_kwcta strong {display:block; font-size:15px; color:var(--mn-ink);}
.mk_kwcta span {display:block; margin-top:2px; font-size:13px; color:var(--mn-sub);}
.mk_kwcta a {display:inline-flex; align-items:center; gap:6px; padding:9px 16px; border-radius:999px; background:#ea580c; color:#fff !important; font-size:13px; font-weight:700;}

/* 단계 */
.pk_steps {display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:12px; counter-reset:none;}
.mall_steps {grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));}
.pk_steps li {position:relative; display:flex; flex-direction:column; align-items:center; gap:4px; padding:22px 14px 18px; border-radius:var(--mn-radius); background:var(--mn-soft); text-align:center;}
.pk_step_ic {font-size:28px; color:var(--mn-green); margin-bottom:6px;}
.pk_steps b {position:absolute; left:12px; top:10px; width:22px; height:22px; border-radius:7px; background:var(--mn-green); color:#fff; font-size:12px; display:inline-flex; align-items:center; justify-content:center;}
.pk_steps strong {font-size:14px; color:var(--mn-ink);}
.pk_steps span {font-size:12.5px; color:var(--mn-sub); line-height:1.6;}

/* 알림 상자 / 모바일 / 전자카탈로그 */
.pk_note {margin-top:18px; padding:20px 22px; border-radius:var(--mn-radius); background:var(--mn-soft);}
.pk_note strong {display:flex; align-items:center; gap:8px; margin-bottom:8px; font-size:14.5px; color:var(--mn-ink);}
.pk_note p {font-size:13px; color:var(--mn-sub);}
.mb_about p {font-size:14px; line-height:1.85;}
.kw_what {display:grid; grid-template-columns:minmax(0, 1fr); gap:16px; padding:22px 24px; border:1px solid var(--mn-line); border-radius:var(--mn-radius);}
.kw_term {display:flex; align-items:flex-start; gap:14px;}
.kw_term > i {flex:none; width:44px; height:44px; border-radius:12px; background:var(--mn-green-l); color:var(--mn-green); font-size:21px; display:inline-flex; align-items:center; justify-content:center;}
.kw_term strong {display:block; font-size:15px; color:var(--mn-ink);}
.kw_term span {font-size:13px; color:var(--mn-sub);}
.kw_flow {display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap; padding:16px; border-radius:12px; background:var(--mn-soft);}
.kw_flow > div {display:flex; flex-direction:column; align-items:center; gap:6px; min-width:110px; font-size:13px; font-weight:700;}
.kw_flow > div i {font-size:26px; color:var(--mn-green);}
.kw_arrow {color:var(--mn-mute); font-size:18px;}
.ec_free {display:flex; align-items:center; gap:16px; padding:18px 22px; border-radius:var(--mn-radius); background:var(--mn-green-l);}
.ec_free > i {font-size:30px; color:var(--mn-green);}
.ec_free strong {display:block; font-size:15px; color:var(--mn-ink);}
.ec_free span {font-size:13px; color:var(--mn-sub);}
.ec_price {display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:12px;}
.ec_price li {display:flex; flex-direction:column; align-items:center; gap:4px; padding:18px 12px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); text-align:center;}
.ec_price li span {font-size:12.5px; color:var(--mn-sub);}
.ec_price li b {font-size:18px; font-weight:800; color:var(--mn-ink); letter-spacing:-.4px; font-variant-numeric:tabular-nums;}
.ec_price li.ec_more {background:var(--mn-soft); border-style:dashed;}
.ec_price li.ec_more b {font-size:14px;}

/* 하단 견적 버튼 */
.pk_cta_center {display:flex; justify-content:center; margin-top:36px !important;}
.wa_btn {display:inline-flex; align-items:center; gap:8px; height:50px; padding:0 30px; border-radius:999px; background:var(--mn-green); color:#fff; font-size:15px; font-weight:700; transition:background .15s, transform .15s;}
.pk_cta_center a:hover .wa_btn {background:var(--mn-green); transform:translateY(-2px);}

/* 왼쪽 바로가기 */
.hp_quick li a {font-size:13.5px;}

@media (max-width:1024px) {
	.si_promise, .ec_price {grid-template-columns:repeat(2, minmax(0, 1fr));}
	.pk_feat, .pk_steps {grid-template-columns:repeat(2, minmax(0, 1fr));}
}
@media (max-width:720px) {
	.us_prep, .sd_layers, .sd_lang, .pk_grid, .si_promise, .ec_price {grid-template-columns:minmax(0, 1fr);}
	.pk_hero {padding:28px 22px;}
	.pk_title {font-size:24px;}
	.us_cta {padding:22px;}
	.sd_list b {display:block; min-width:0; margin:0 0 2px;}
	.pk_hero_ic {font-size:90px;}
}

/* 솔루션 첫 화면 */
.mn_sub:has(.sol_body) .mn_sub_head {display:none;}
.mn_sub:has(.sol_body) .mn_sub_body {padding:0; border:0; background:transparent; box-shadow:none;}
.sol_body {margin-top:0 !important;}
.sol_grid {display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:16px;}
.sol_item {display:flex; flex-direction:column; padding:22px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff; transition:box-shadow .2s, transform .2s; scroll-margin-top:90px;}
.sol_item:hover {box-shadow:var(--mn-shadow); transform:translateY(-2px);}
.sol_hl {border:2px solid var(--mn-green); background:linear-gradient(180deg, var(--mn-green-l), #fff 40%);}
.sol_head {display:flex; align-items:center; gap:12px; margin-bottom:14px;}
.sol_head h3 {margin:0; font-size:17px; font-weight:800; letter-spacing:-.4px; color:var(--mn-ink);}
.sol_ic {flex:none; width:44px; height:44px; border-radius:12px; background:var(--mn-green-l); color:var(--mn-green); font-size:21px; display:inline-flex; align-items:center; justify-content:center;}
.sol_hl .sol_ic {background:linear-gradient(135deg, var(--mn-green), var(--mn-accent2)); color:#fff;}
.sol_item ul {flex:1; list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; font-size:13px; color:var(--mn-sub);}
.sol_item li {display:flex; gap:8px; align-items:flex-start; line-height:1.55;}
.sol_item li i {flex:none; color:var(--mn-green); margin-top:2px;}
.sol_btn {margin:18px 0 0;}
.sol_btn a {display:inline-flex; align-items:center; gap:6px; height:40px; padding:0 18px; border-radius:999px; background:var(--mn-green); color:#fff !important; font-size:13px; font-weight:700; text-decoration:none; transition:background .15s;}
.sol_btn a:hover {background:var(--mn-green);}
.sol_down {display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px;}
.sol_down a {display:flex; flex-direction:column; gap:6px; padding:20px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:var(--mn-soft); text-decoration:none; transition:box-shadow .2s, background .2s;}
.sol_down a:hover {background:#fff; box-shadow:var(--mn-shadow);}
.sol_down strong {display:flex; align-items:center; gap:8px; font-size:15px; color:var(--mn-ink);}
.sol_down strong i {color:var(--mn-green); font-size:20px;}
.sol_down .date {font-size:12px; color:var(--mn-mute);}
.sol_down .spec {font-size:12.5px; color:var(--mn-sub); line-height:1.7;}
.mn_svc_count {list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px;}
.mn_svc_count li {display:flex; justify-content:space-between; align-items:center; padding:10px 14px; border-radius:10px; background:var(--mn-soft); font-size:13px;}
.mn_svc_count b {font-size:16px; color:var(--mn-green-d); font-variant-numeric:tabular-nums;}
.mn_sol {list-style:none; margin:0; padding:0; display:flex; flex-direction:column;}
.mn_sol li a {display:block; padding:10px 4px; border-bottom:1px dashed var(--mn-line); font-size:13.5px; color:var(--mn-text); text-decoration:none;}
.mn_sol li:last-child a {border-bottom:0;}
.mn_sol li a:hover {color:var(--mn-green);}
@media (max-width:720px) {
	.sol_grid, .sol_down {grid-template-columns:minmax(0, 1fr);}
}
.mn_card_title i.bi {margin-right:8px; color:var(--mn-green); vertical-align:-1px;}

/* ---- 원본 디자인(녹색 톤) 맞춤 ---- */
.pk_hero, .sol_hero {background:linear-gradient(120deg, #fdf3d7, #e9f7ec); color:var(--mn-text);}
.pk_hero::after {content:''; position:absolute; right:-70px; top:-90px; width:300px; height:300px; border-radius:50%; background:rgba(45,178,74,.14);}
.pk_hero_ic {color:var(--mn-green); opacity:.18; z-index:0;}
.pk_hero .mn_hero_badge {border-color:var(--mn-green); background:transparent; color:var(--mn-green-d);}
.pk_title {color:var(--mn-green-d);}
.pk_desc {color:var(--mn-sub);}
.pk_cta {z-index:1;}
.us_cta a, .pk_cta a {border:1px solid var(--mn-green); color:var(--mn-green-d) !important; background:#fff;}
.us_cta a:hover, .pk_cta a:hover {background:var(--mn-green-l);}
.us_cta a.main, .pk_cta a.main {background:var(--mn-green); color:#fff !important; border-color:var(--mn-green);}
.us_cta a.main:hover, .pk_cta a.main:hover {background:var(--mn-green-d);}
.us_cta {background:var(--mn-green-l); color:var(--mn-text);}
.us_cta span {color:var(--mn-sub);}
.wa_btn {background:var(--mn-green);}
.pk_cta_center a:hover .wa_btn {background:var(--mn-green-d);}
.sol_btn a {background:var(--mn-green);}
.sol_btn a:hover {background:var(--mn-green-d);}
.pk_steps b {background:var(--mn-green);}
.us_card, .pk_grid > li, .us_prep li, .us_attn li, .sol_item {box-shadow:none;}

/* ---- 메인 화면 ---- */
.mn_hero_default {position:relative; overflow:hidden;}
.mn_hero_default::before, .mn_hero_default::after {content:''; position:absolute; border-radius:50%; background:rgba(45,178,74,.14); pointer-events:none;}
.mn_hero_default::before {right:-60px; top:-70px; width:330px; height:330px;}
.mn_hero_default::after {right:80px; top:90px; width:230px; height:230px;}
.mn_hero_default > * {position:relative; z-index:1;}
.mn_hero_cta {display:flex; flex-wrap:wrap; gap:10px; margin-top:22px;}
.mn_body .mn_hero_cta a {display:inline-flex; align-items:center; height:42px; padding:0 20px; border-radius:6px; background:var(--mn-green); color:#fff; font-size:14px; font-weight:700; text-decoration:none;}
.mn_body .mn_hero_cta a:hover {background:var(--mn-green-d);}
.mn_body .mn_hero_cta a.alt {background:#fff; color:var(--mn-green-d); border:1px solid var(--mn-green);}
.mn_body .mn_hero_cta a.alt:hover {background:var(--mn-green-l);}
.mn_quick {display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:14px;}
.mn_quick a {display:flex; align-items:center; justify-content:center; gap:10px; height:56px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff; font-size:14px; font-weight:700; color:var(--mn-text); text-decoration:none; transition:border-color .15s, color .15s;}
.mn_quick a i {color:var(--mn-green); font-size:18px;}
.mn_quick a:hover {border-color:var(--mn-green); color:var(--mn-green-d);}
.mn_prod {display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:16px;}
.mn_prod > a {position:relative; display:flex; flex-direction:column; gap:10px; padding:20px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff; text-decoration:none; color:var(--mn-text); transition:border-color .15s, box-shadow .15s;}
.mn_prod > a:hover {border-color:var(--mn-green); box-shadow:0 6px 18px rgba(0,0,0,.06);}
.pd_top {display:flex; align-items:center; justify-content:space-between;}
.pd_ic {width:44px; height:44px; border-radius:10px; font-size:22px; display:inline-flex; align-items:center; justify-content:center; background:#e8f0fe; color:#2563eb;}
.pd_lnx .pd_ic {background:#fff0e6; color:#e95420;}
.pd_mail .pd_ic {background:#e9f7ec; color:var(--mn-green-d);}
.pd_srv .pd_ic {background:#f1f3f5; color:#495057;}
.pd_top .tag {padding:2px 10px; border-radius:6px; background:var(--mn-green-l); color:var(--mn-green-d); font-size:12px; font-weight:800;}
.mn_prod strong {font-size:16px; font-weight:800;}
.mn_prod .spec {list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:5px; font-size:13px; color:var(--mn-sub);}
.mn_prod .spec i {margin-right:7px; color:var(--mn-mute);}
.pd_foot {display:flex; align-items:center; justify-content:space-between; margin-top:4px; padding-top:12px; border-top:1px dashed var(--mn-line);}
.pd_foot .price {font-size:16px; font-weight:800; color:var(--mn-green-d);}
.pd_foot i {font-size:20px; color:var(--mn-green);}
.mn_svc {display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px;}
.mn_svc > a {display:flex; flex-direction:column; gap:4px; padding:20px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); text-decoration:none; color:var(--mn-text); transition:border-color .15s;}
.mn_svc > a:hover {border-color:var(--mn-green);}
.mn_svc > a i {font-size:26px; color:var(--mn-green); margin-bottom:6px;}
.mn_svc > a span {font-size:12.5px; color:var(--mn-sub);}
.mn_sol small {display:block; margin-top:2px; font-size:12px; color:var(--mn-mute);}
.mn_tel {margin:0 0 8px; font-size:26px; font-weight:800; color:var(--mn-green);}
.mn_kv {margin:0; font-size:12.5px; line-height:1.8; color:var(--mn-sub);}
.mn_kv b {color:var(--mn-text);}
.mn_bank_btns {display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-top:14px;}
.mn_bank_btns a {display:block; padding:9px 0; text-align:center; font-size:12px; font-weight:600; border-radius:6px; background:var(--mn-soft); color:var(--mn-text); text-decoration:none;}
.mn_bank_btns a:hover {background:var(--mn-green-l); color:var(--mn-green-d);}
.mn_ns p {margin:0 0 8px; font-size:13px;}
.mn_ns b {display:block;}
.mn_ns span {font-size:12px; color:var(--mn-mute);}
@media (max-width:720px) {
	.mn_quick {grid-template-columns:repeat(2, minmax(0, 1fr));}
	.mn_prod, .mn_svc {grid-template-columns:minmax(0, 1fr);}
}

/* 아티보드 5 : 라이선스 / 정식등록 */
.lc_wrap {overflow-x:auto;}
.lc_table {width:100%; border-collapse:collapse; font-size:13.5px;}
.lc_table th, .lc_table td {padding:13px 14px; border-bottom:1px solid var(--mn-line); text-align:left; vertical-align:middle;}
.lc_table thead th {background:var(--mn-soft); border-top:2px solid var(--mn-green); text-align:center; font-weight:800; white-space:nowrap;}
.lc_table thead th i {margin-right:6px; color:var(--mn-green);}
.lc_table tbody th {width:200px; background:#fafbfc; font-weight:700; white-space:nowrap;}
.lc_table i {margin-right:6px;}
.lc_paid {background:var(--mn-green-l) !important; color:var(--mn-green-d);}
.lc_yes {color:var(--mn-green-d); font-weight:600;}
.lc_yes i {color:var(--mn-green);}
.lc_no {color:var(--mn-mute);}
.lc_tabs {display:flex; gap:6px; margin-bottom:12px;}
.lc_tabs button {display:inline-flex; align-items:center; gap:6px; padding:10px 18px; border-radius:999px; background:var(--mn-soft); color:var(--mn-sub); font-size:13.5px; font-weight:700;}
.lc_tabs button.on {background:var(--mn-green); color:#fff;}
.lc_panel[hidden] {display:none;}
.lc_terms {counter-reset:lc; display:flex; flex-direction:column; gap:8px; padding:20px 22px; border-radius:var(--mn-radius); background:var(--mn-soft);}
.lc_terms li {position:relative; padding-left:30px; font-size:13px; line-height:1.75; color:var(--mn-text); counter-increment:lc;}
.lc_terms li::before {content:counter(lc); position:absolute; left:0; top:2px; width:20px; height:20px; border-radius:6px; background:var(--mn-green); color:#fff; font-size:11px; font-weight:800; display:inline-flex; align-items:center; justify-content:center;}
.lc_cert {display:flex; align-items:flex-start; gap:18px; padding:22px 24px; border:1px solid var(--mn-line); border-radius:var(--mn-radius);}
.lc_cert > i {flex:none; font-size:40px; color:var(--mn-green);}
.lc_cert dl {flex:1; margin:0; display:flex; flex-direction:column; gap:8px;}
.lc_cert dl > div {display:flex; gap:14px; font-size:13.5px;}
.lc_cert dt {flex:none; width:190px; font-weight:700; color:var(--mn-text);}
.lc_cert dd {margin:0; color:var(--mn-sub);}
.pr_plans {display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; list-style:none; margin:0; padding:0;}
.pr_plans > li {display:flex; flex-direction:column; gap:8px; padding:22px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff;}
.pr_plans h4 {display:flex; align-items:center; gap:8px; margin:0; font-size:16px; font-weight:800;}
.pr_plans h4 i {color:var(--mn-green); font-size:20px;}
.pr_price {margin:0; font-size:28px; font-weight:800; letter-spacing:-.5px; color:var(--mn-green-d); font-variant-numeric:tabular-nums;}
.pr_price small {font-size:14px; font-weight:600; color:var(--mn-sub);}
.pr_desc {flex:1; margin:0; font-size:13px; color:var(--mn-sub); line-height:1.7;}
.pr_plans .wa_btn {height:42px; padding:0 22px; font-size:14px;}
.pr_sale {display:flex; align-items:center; gap:16px; padding:20px 22px; margin-bottom:16px; border-radius:var(--mn-radius); background:var(--mn-green-l);}
.pr_sale > i {flex:none; font-size:32px; color:var(--mn-green);}
.pr_sale p {margin:0; font-size:13.5px; line-height:1.8;}
.lc_table .ar {text-align:right; font-variant-numeric:tabular-nums;}
.pr_info {font-size:12.5px; color:var(--mn-sub); line-height:1.8; text-align:center !important;}
.pr_vat {display:flex; align-items:center; gap:6px; margin:10px 0 0; font-size:12.5px; color:var(--mn-mute);}
@media (max-width:720px) {
	.pr_plans {grid-template-columns:minmax(0, 1fr);}
	.lc_cert dl > div {flex-direction:column; gap:2px;}
	.lc_cert dt {width:auto;}
}
.pr_stop {display:flex; align-items:center; gap:14px; padding:18px 22px; margin-bottom:22px; border:1px solid #fed7aa; border-radius:var(--mn-radius); background:#fff7ed;}
.pr_stop > i {flex:none; font-size:26px; color:#ea580c;}
.pr_stop strong {display:block; font-size:15px; color:var(--mn-text);}
.pr_stop span {display:block; margin-top:2px; font-size:13px; color:var(--mn-sub);}

/* K 웹에디터 / 웹메일 솔루션 */
.ek_tools {grid-template-columns:repeat(4, minmax(0, 1fr)) !important;}
.ek_tools > li {flex-direction:row !important; align-items:center; padding:14px 16px !important; min-height:0 !important; gap:10px !important;}
.ek_tools > li > i {color:var(--mn-green); font-size:20px;}
.ek_tools > li > span {font-size:13px !important; color:var(--mn-text) !important; font-weight:600;}
.ek_groups > li {padding-left:78px;}
.ek_groups .t4_chips {margin-top:6px;}
.ek_code {margin:16px 0 0; padding:18px 20px; border-radius:var(--mn-radius); background:#1f2328; color:#e6edf3; font-size:13px; line-height:1.7; overflow-x:auto;}
.ek_code code {font-family:Consolas, 'D2Coding', monospace;}
.p2p_flow {display:grid; grid-template-columns:repeat(auto-fill, minmax(190px, 1fr)); gap:10px; list-style:none; margin:0; padding:0;}
.p2p_flow li {display:flex; align-items:center; gap:10px; padding:12px 14px; border-radius:10px; background:var(--mn-soft); font-size:13px; font-weight:600;}
.p2p_flow b {flex:none; width:22px; height:22px; border-radius:7px; background:var(--mn-green); color:#fff; font-size:12px; display:inline-flex; align-items:center; justify-content:center;}
.p2p_flow_note {display:flex; align-items:center; gap:6px; margin:10px 0 0; font-size:12.5px; color:var(--mn-mute);}
@media (max-width:1024px) {.ek_tools {grid-template-columns:repeat(2, minmax(0, 1fr)) !important;}}
@media (max-width:720px) {.ek_tools {grid-template-columns:minmax(0, 1fr) !important;}}

/* ---- 웹메일 솔루션 (새 디자인) ---- */
.wm {--wm-bg:#0f1316; --wm-panel:#171c20; --wm-line:rgba(255,255,255,.1);}
.wm_hero {position:relative; display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1.05fr); align-items:center; gap:28px; padding:38px 34px; border-radius:22px; overflow:hidden; color:#fff;
	background:radial-gradient(520px 260px at 100% 0%, rgba(45,178,74,.35), transparent 65%), radial-gradient(420px 260px at 0% 110%, rgba(45,178,74,.18), transparent 60%), var(--wm-bg);}
.wm_hero_sm {grid-template-columns:minmax(0, 1fr); padding:34px;}
.wm_hero_ic {position:absolute; right:36px; bottom:-10px; font-size:130px; color:var(--mn-green); opacity:.22;}
.wm_badge {display:inline-flex; align-items:center; gap:6px; padding:5px 14px; border:1px solid rgba(255,255,255,.22); border-radius:999px; background:rgba(255,255,255,.07); color:#b9f0c6; font-size:12.5px; font-weight:700;}
.wm_title {margin:16px 0 0 !important; font-size:30px; line-height:1.3; font-weight:800; letter-spacing:-1px;}
.wm_desc {margin:12px 0 0 !important; font-size:14px; line-height:1.8; color:#aab4bd; max-width:520px;}
.wm_cta {display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; position:relative; z-index:1;}
.wm_cta a {display:inline-flex; align-items:center; gap:8px; height:44px; padding:0 20px; border-radius:999px; border:1px solid rgba(255,255,255,.28); color:#fff !important; font-size:14px; font-weight:700; transition:transform .15s, background .15s;}
.wm_cta a:hover {transform:translateY(-2px); background:rgba(255,255,255,.1);}
.wm_cta a.main {background:var(--mn-green); border-color:var(--mn-green);}
.wm_cta a.main:hover {background:var(--mn-green-d);}

/* 메일함 목업 */
.wm_mock {border-radius:14px; overflow:hidden; background:var(--wm-panel); border:1px solid var(--wm-line); box-shadow:0 24px 50px rgba(0,0,0,.45); transform:perspective(1200px) rotateY(-6deg) rotateX(2deg);}
.wm_bar {display:flex; align-items:center; gap:6px; padding:10px 14px; background:#1d2328; border-bottom:1px solid var(--wm-line); font-size:12px; color:#8a95a0;}
.wm_bar i {width:9px; height:9px; border-radius:50%; background:#3a434b;}
.wm_bar i:nth-child(1) {background:#ff5f57;} .wm_bar i:nth-child(2) {background:#febc2e;} .wm_bar i:nth-child(3) {background:#28c840;}
.wm_bar span {margin-left:8px;}
.wm_body {display:grid; grid-template-columns:132px minmax(0, 1fr); min-height:230px;}
.wm_folders {list-style:none; margin:0; padding:10px 8px; border-right:1px solid var(--wm-line); display:flex; flex-direction:column; gap:2px;}
.wm_folders li {display:flex; align-items:center; gap:7px; padding:7px 9px; border-radius:8px; font-size:12px; color:#9aa5af; white-space:nowrap;}
.wm_folders li.on {background:rgba(45,178,74,.18); color:#7ee094; font-weight:700;}
.wm_folders b {margin-left:auto; padding:0 6px; border-radius:999px; background:var(--mn-green); color:#fff; font-size:10px; line-height:16px;}
.wm_list {list-style:none; margin:0; padding:6px; display:flex; flex-direction:column;}
.wm_list li {display:flex; align-items:center; gap:10px; padding:10px 10px; border-radius:8px; border-bottom:1px solid var(--wm-line);}
.wm_list li:last-child {border-bottom:0;}
.wm_list .dot {flex:none; width:7px; height:7px; border-radius:50%; background:transparent;}
.wm_list .new .dot {background:var(--mn-green);}
.wm_list div {flex:1; min-width:0;}
.wm_list strong {display:block; font-size:12.5px; color:#d6dde3; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600;}
.wm_list .new strong {color:#fff; font-weight:800;}
.wm_list small {display:block; margin-top:1px; font-size:11px; color:#7b8691; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.wm_list time {flex:none; font-size:11px; color:#7b8691;}

/* 핵심 4칸 */
.wm_stats {list-style:none; margin:16px 0 0; padding:0; display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:12px;}
.wm_stats li {display:flex; align-items:center; gap:12px; padding:16px; border-radius:var(--mn-radius); background:var(--wm-bg); color:#fff;}
.wm_stats li > i {flex:none; width:40px; height:40px; border-radius:12px; background:rgba(45,178,74,.2); color:#7ee094; font-size:19px; display:inline-flex; align-items:center; justify-content:center;}
.wm_stats span {font-size:13px; font-weight:700; line-height:1.4;}

/* 로그인 */
.wm_login {display:grid; grid-template-columns:300px minmax(0, 1fr); gap:20px; align-items:center;}
.wm_login_card {display:flex; flex-direction:column; gap:8px; padding:24px; border-radius:16px; background:var(--wm-panel); border:1px solid var(--wm-line); color:#fff; box-shadow:0 14px 30px rgba(0,0,0,.25);}
.wm_login_ic {width:42px; height:42px; border-radius:11px; background:#fff; color:#1f2328; font-size:20px; display:inline-flex; align-items:center; justify-content:center;}
.wm_login_card strong {margin-top:6px; font-size:17px;}
.wm_login_card small {font-size:11.5px; color:#9aa5af; line-height:1.5;}
.wm_field {display:block; padding:10px 12px; border-radius:8px; background:#0f1316; border:1px solid var(--wm-line); font-size:12px; color:#6e7a85;}
.wm_opts {display:flex; justify-content:space-between; font-size:11px; color:#9aa5af;}
.wm_opts em {font-style:normal; display:inline-flex; align-items:center; gap:4px;}
.wm_btn {display:block; padding:10px 0; border-radius:8px; background:#fff; color:#1f2328; text-align:center; font-size:13px; font-weight:800;}
.wm_links {text-align:center; font-size:11px; color:#7b8691;}
.wm_login_list {list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px;}
.wm_login_list li {display:flex; gap:12px; padding:16px; border:1px solid var(--mn-line); border-radius:var(--mn-radius);}
.wm_login_list li > i {flex:none; width:38px; height:38px; border-radius:10px; background:var(--mn-green-l); color:var(--mn-green); font-size:18px; display:inline-flex; align-items:center; justify-content:center;}
.wm_login_list strong {display:block; font-size:14px; color:var(--mn-ink);}
.wm_login_list span {display:block; margin-top:2px; font-size:12.5px; color:var(--mn-sub); line-height:1.6;}

/* 기능 페이지 */
.wm_sec {margin-top:8px;}
.wm_gw {display:flex; align-items:center; gap:18px; padding:22px 24px; border-radius:var(--mn-radius); background:var(--wm-bg); color:#fff;}
.wm_gw > i {flex:none; font-size:36px; color:#7ee094;}
.wm_gw strong {display:block; font-size:15px;}
.wm_gw span {display:block; margin-top:4px; font-size:13px; color:#aab4bd; line-height:1.7;}

@media (max-width:1024px) {
	.wm_hero {grid-template-columns:minmax(0, 1fr);}
	.wm_mock {transform:none;}
	.wm_stats {grid-template-columns:repeat(2, minmax(0, 1fr));}
	.wm_login {grid-template-columns:minmax(0, 1fr);}
}
@media (max-width:720px) {
	.wm_hero {padding:26px 20px;}
	.wm_title {font-size:24px;}
	.wm_login_list {grid-template-columns:minmax(0, 1fr);}
	.wm_body {grid-template-columns:minmax(0, 1fr);}
	.wm_folders {display:none;}
}

/* 웹메일 : 기능 바로가기 / 더보기 */
.wm_jump {list-style:none; margin:16px 0 8px; padding:0; display:flex; flex-wrap:wrap; gap:8px;}
.wm_jump a {display:inline-flex; align-items:center; gap:6px; padding:9px 16px; border-radius:999px; background:var(--mn-soft); color:var(--mn-text); font-size:13px; font-weight:700; text-decoration:none; transition:background .15s, color .15s;}
.wm_jump a i {color:var(--mn-green);}
.wm_jump a:hover {background:var(--mn-green); color:#fff;}
.wm_jump a:hover i {color:#fff;}
.wm_sec {scroll-margin-top:20px;}
.wm_sec[id] {scroll-margin-top:20px;}
.wm_more {margin:16px 0 0; text-align:right;}
.wm_more a {display:inline-flex; align-items:center; gap:6px; font-size:13.5px; font-weight:700; color:var(--mn-green-d); text-decoration:none;}
.wm_more a:hover {text-decoration:underline;}
.wm_login_list {grid-template-columns:repeat(2, minmax(0, 1fr));}
.pk_grid > li > span ul.t4_chips {margin-top:10px;}

/* ---- 웹메일 : 간격 정리 (.sub_page ul 의 margin:0 보다 우선) ---- */
.sub_page.wm .wm_hero {margin-bottom:0;}
.sub_page.wm .wm_stats {margin:20px 0 0;}
.sub_page.wm .wm_jump {margin:20px 0 0;}
.sub_page.wm .wm_sec {margin-top:0;}
.sub_page.wm .wm_sec > .pk_h {margin-top:44px !important;}
.sub_page.wm .wm_jump + .wm_sec > .pk_h {margin-top:28px !important;}
.sub_page.wm > .pk_h {margin-top:44px !important;}
.sub_page.wm .wm_stats + .pk_h {margin-top:36px !important;}
.sub_page.wm .pk_grid {margin-top:0;}
.sub_page.wm .wm_gw {margin:0 0 14px;}
.sub_page.wm .wm_more {margin:18px 0 0;}
.sub_page.wm .wm_login {margin:0;}
.sub_page.wm .pk_steps {margin:0;}
.sub_page.wm .us_cta {margin-top:48px;}
.sub_page.wm .mk_kwcta {margin-top:44px;}
.sub_page.wm .pk_cta_center {margin-top:44px !important;}
.sub_page.wm .wm_hero_txt {min-width:0;}

/* 웹메일 : 로그인 영역 좌우 높이 맞춤 */
.sub_page.wm .wm_login {align-items:stretch;}
.sub_page.wm .wm_login_card {justify-content:center;}
.sub_page.wm .wm_login_list {grid-auto-rows:1fr; align-content:stretch;}
.sub_page.wm .wm_login_list li {align-items:flex-start; height:100%; box-sizing:border-box;}

/* ---- 아티보드 소개 : 관리자 콘솔 목업 / 모듈 카드 ---- */
.ab_mock .wm_body {grid-template-columns:130px minmax(0, 1fr);}
.ab_dash {padding:14px; display:flex; flex-direction:column; gap:12px;}
.ab_cards {display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:8px;}
.ab_cards div {padding:10px 12px; border-radius:10px; background:#1d2328; border:1px solid var(--wm-line);}
.ab_cards small {display:block; font-size:10.5px; color:#8a95a0;}
.ab_cards b {display:block; margin-top:2px; font-size:18px; color:#fff; font-variant-numeric:tabular-nums;}
.ab_chart {display:flex; align-items:flex-end; gap:8px; height:84px; padding:10px 12px 0; border-radius:10px; background:#1d2328; border:1px solid var(--wm-line);}
.ab_chart span {flex:1; border-radius:5px 5px 0 0; background:rgba(45,178,74,.35);}
.ab_chart span.on {background:var(--mn-green);}
.ab_cap {font-size:10.5px; color:#7b8691;}
.sub_page.ab .ab_modules {list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px;}
.ab_modules li {position:relative; display:flex; flex-direction:column; gap:6px; padding:22px 20px 20px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff; overflow:hidden; transition:border-color .2s, transform .2s;}
.ab_modules li:hover {border-color:var(--mn-green); transform:translateY(-2px);}
.ab_modules li > i {width:42px; height:42px; border-radius:12px; background:var(--mn-green-l); color:var(--mn-green); font-size:20px; display:inline-flex; align-items:center; justify-content:center;}
.ab_modules strong {margin-top:6px; font-size:15.5px; color:var(--mn-ink);}
.ab_modules li > span:not(.ab_no) {font-size:12.5px; line-height:1.7; color:var(--mn-sub);}
.ab_no {position:absolute; right:16px; top:12px; font-size:26px; font-weight:800; letter-spacing:-1px; color:var(--mn-line);}
@media (max-width:720px) {
	.sub_page.ab .ab_modules {grid-template-columns:minmax(0, 1fr);}
	.ab_cards {grid-template-columns:repeat(3, minmax(0, 1fr));}
}

/* ---- K 웹에디터 : 에디터 목업 / 언어 칩 ---- */
.ke_mock {transform:perspective(1200px) rotateY(-5deg) rotateX(2deg);}
.ke_tools {display:flex; align-items:center; flex-wrap:wrap; gap:2px; padding:8px 10px; background:#1d2328; border-bottom:1px solid var(--wm-line);}
.ke_tools i {width:26px; height:26px; border-radius:6px; font-size:14px; color:#aab4bd; display:inline-flex; align-items:center; justify-content:center;}
.ke_tools i.on {color:#7ee094; background:rgba(45,178,74,.18);}
.ke_tools b {padding:4px 10px; border-radius:6px; background:#0f1316; border:1px solid var(--wm-line); font-size:11px; font-weight:600; color:#c6cfd6; margin-right:2px;}
.ke_tools .sp {width:1px; height:16px; margin:0 6px; background:var(--wm-line);}
.ke_tools2 {border-bottom:1px solid var(--wm-line);}
.ke_doc {padding:22px 24px; min-height:150px; background:#f7f8fa; display:flex; flex-direction:column; gap:9px;}
.ke_doc strong {font-size:16px; color:#1f2328;}
.ke_doc span {display:block; height:8px; border-radius:4px; background:#d7dce1;}
.ke_doc span.w80 {width:80%;} .ke_doc span.w60 {width:60%;}
.ke_doc em {display:flex; align-items:center; justify-content:center; height:54px; margin-top:4px; border-radius:8px; background:#e1e6ea; color:#9aa5af; font-size:22px;}
.ke_status {display:flex; align-items:center; gap:4px; padding:7px 12px; background:#1d2328; border-top:1px solid var(--wm-line); font-size:11px; color:#8a95a0;}
.ke_status span {padding:3px 10px; border-radius:6px;}
.ke_status span.on {background:rgba(45,178,74,.18); color:#7ee094; font-weight:700;}
.ke_status small {margin-left:auto; font-size:10.5px;}
.sub_page.ke .ke_langs {list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:10px;}
.ke_langs li {padding:12px 20px; border-radius:999px; background:var(--mn-soft); border:1px solid var(--mn-line); font-size:14px; font-weight:700; color:var(--mn-ink);}
.sub_page.ke .ke_ext {margin-top:14px;}
@media (max-width:1024px) {.ke_mock {transform:none;}}

/* 홈페이지 제작 · 솔루션 화면 : 본문 폭 1200px (가운데 정렬) */
.cs_wrap.hp_wrap {max-width:1200px; margin-left:auto; margin-right:auto;}

/* 솔루션 첫 화면 : 사이드(mn_side)를 왼쪽으로 */
@media (min-width:861px) {
	.mn_body.sol_body {grid-template-columns:240px minmax(0, 1fr);}
	.mn_body.sol_body > .mn_side {order:-1;}
}
@media (min-width:861px) and (max-width:1024px) {
	.mn_body.sol_body {grid-template-columns:240px minmax(0, 1fr);}
}

/* ---- 프로그램개발 서비스 안내 ---- */
.pg_flow {padding:20px; border-radius:16px; background:var(--wm-panel); border:1px solid var(--wm-line); box-shadow:0 24px 50px rgba(0,0,0,.4);}
.pg_flow_head {display:flex; align-items:center; gap:10px; margin-bottom:14px; color:#fff;}
.pg_flow_head i {color:#7ee094; font-size:18px;}
.pg_flow_head strong {font-size:14px;}
.pg_flow_head small {margin-left:auto; padding:2px 10px; border-radius:999px; background:rgba(255,255,255,.08); font-size:11px; color:#9aa5af;}
.sub_page.pg .pg_flow ol {list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0;}
.pg_flow li {position:relative; display:flex; align-items:center; gap:12px; padding:10px 0;}
.pg_flow li:not(:last-child)::after {content:''; position:absolute; left:13px; top:36px; bottom:-8px; width:2px; background:var(--wm-line);}
.pg_flow .no {flex:none; width:28px; height:28px; border-radius:50%; background:#232a30; border:1px solid var(--wm-line); color:#8a95a0; font-size:12px; font-weight:800; display:inline-flex; align-items:center; justify-content:center; position:relative; z-index:1;}
.pg_flow li.done .no {background:var(--mn-green); border-color:var(--mn-green); color:#fff;}
.pg_flow li.now .no {border-color:#7ee094; color:#7ee094; box-shadow:0 0 0 4px rgba(45,178,74,.2);}
.pg_flow li div strong {display:block; font-size:13px; color:#e6edf3;}
.pg_flow li div small {display:block; margin-top:1px; font-size:11px; color:#7b8691;}
.pg_flow li:not(.done):not(.now) div strong {color:#8a95a0;}
.pg_bar {height:6px; margin-top:12px; border-radius:999px; background:#232a30; overflow:hidden;}
.pg_bar span {display:block; height:100%; border-radius:999px; background:linear-gradient(90deg, var(--mn-green), #7ee094);}
.pg_areas {display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px;}
.pg_areas section {padding:20px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff;}
.pg_areas h4 {display:flex; align-items:center; gap:8px; margin:0 0 12px; font-size:15px; font-weight:800; color:var(--mn-ink);}
.pg_areas h4 i {width:32px; height:32px; border-radius:9px; background:var(--mn-green-l); color:var(--mn-green); font-size:16px; display:inline-flex; align-items:center; justify-content:center;}
.sub_page.pg .pg_areas .t4_chips {margin:0;}
@media (max-width:1024px) {.pg_areas {grid-template-columns:minmax(0, 1fr);}}

/* ---- 마케팅 ---- */
.kw_serp {max-width:560px; padding:18px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff;}
.kw_bar {display:flex; align-items:center; gap:10px; padding:11px 16px; border:2px solid var(--mn-green); border-radius:999px; color:var(--mn-mute); font-size:13px;}
.kw_bar i {color:var(--mn-green);}
.kw_ad {margin-top:14px; padding:14px 16px; border-radius:12px; background:var(--mn-green-l); border:1px dashed var(--mn-green);}
.kw_ad em {display:flex; align-items:center; gap:6px; font-style:normal; font-weight:800; font-size:13.5px; color:var(--mn-green-d);}
.kw_ad span {display:block; margin-top:2px; font-size:12.5px; color:var(--mn-sub);}
.kw_row {height:10px; margin-top:14px; border-radius:5px; background:var(--mn-soft);}
.kw_row.kw_short {width:60%;}
.mk_portals {display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px;}
.mk_portal {display:flex; flex-direction:column; gap:12px; padding:22px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff;}
.mk_portal header {display:flex; align-items:center; gap:10px;}
.mk_portal header strong {font-size:16px; color:var(--mn-ink);}
.mk_brand {padding:4px 12px; border-radius:6px; background:#03c75a; color:#fff; font-size:12px; font-weight:800; letter-spacing:.5px;}
.mk_daum .mk_brand {background:#2d7ff9;}
.mk_portal p {margin:0; font-size:13px; line-height:1.7; color:var(--mn-sub);}
.sub_page .mk_flow {list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px;}
.mk_flow li {display:flex; align-items:center; gap:8px; padding:10px 12px; border-radius:10px; background:var(--mn-soft); font-size:12.5px; font-weight:600;}
.mk_flow li i {color:var(--mn-green); font-size:16px;}
.mk_go {display:inline-flex; align-items:center; justify-content:center; gap:8px; height:44px; margin-top:auto; border-radius:10px; background:var(--mn-green); color:#fff !important; font-size:13.5px; font-weight:700; text-decoration:none;}
.mk_go:hover {background:var(--mn-green-d);}
@media (max-width:1024px) {.mk_portals {grid-template-columns:minmax(0, 1fr);}}

/* ---- 유지보수 ---- */
.mt_board {padding:20px; border-radius:16px; background:var(--wm-panel); border:1px solid var(--wm-line); box-shadow:0 24px 50px rgba(0,0,0,.4);}
.mt_board_head {display:flex; align-items:center; gap:10px; margin-bottom:12px; color:#fff;}
.mt_board_head i {color:#7ee094; font-size:18px;}
.mt_board_head strong {font-size:14px;}
.mt_board_head small {margin-left:auto; padding:2px 10px; border-radius:999px; background:rgba(255,255,255,.08); font-size:11px; color:#9aa5af;}
.sub_page.mt .mt_board ul {list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
.mt_board li {display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:10px; background:#1d2328; border:1px solid var(--wm-line);}
.mt_board .st {flex:none; padding:3px 10px; border-radius:999px; font-size:11px; font-weight:800;}
.mt_board .st.done {background:rgba(45,178,74,.2); color:#7ee094;}
.mt_board .st.now {background:rgba(251,191,36,.18); color:#fcd34d;}
.mt_board .st.wait {background:rgba(255,255,255,.1); color:#b6c0c9;}
.mt_board li strong {display:block; font-size:13px; color:#e6edf3;}
.mt_board li small {display:block; margin-top:1px; font-size:11px; color:#7b8691;}
.sub_page.mt .mt_types {list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px;}
.mt_types li {position:relative; display:flex; flex-direction:column; gap:10px; padding:24px 20px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff; transition:border-color .2s, transform .2s;}
.mt_types li:hover {border-color:var(--mn-green); transform:translateY(-2px);}
.mt_types .no {position:absolute; right:16px; top:12px; font-size:26px; font-weight:800; letter-spacing:-1px; color:var(--mn-line);}
.mt_types i {width:44px; height:44px; border-radius:12px; background:var(--mn-green-l); color:var(--mn-green); font-size:21px; display:inline-flex; align-items:center; justify-content:center;}
.mt_types strong {font-size:15.5px; color:var(--mn-ink);}
.sub_page.mt .mt_need {list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px;}
.mt_need li {display:flex; align-items:center; gap:12px; padding:14px 16px; border-radius:12px; background:var(--mn-soft); font-size:13.5px; line-height:1.5;}
.mt_need li i {flex:none; font-size:18px; color:var(--mn-green);}
.sub_page.mt .mt_plans {list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:12px;}
.mt_plans li {position:relative; padding:22px 18px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff; transition:box-shadow .2s, transform .2s;}
.mt_plans li:hover {box-shadow:var(--mn-shadow); transform:translateY(-2px);}
.mt_plans li.rec {border:2px solid var(--mn-green); background:linear-gradient(180deg, var(--mn-green-l), #fff 38%);}
.mt_plans .tag {position:absolute; right:14px; top:-11px; padding:2px 12px; border-radius:999px; background:var(--mn-green); color:#fff; font-size:11px; font-weight:800;}
.mt_plans h4 {margin:0; font-size:15px; font-weight:800; color:var(--mn-ink);}
.mt_plans .pr {margin:8px 0 14px; font-size:24px; font-weight:800; letter-spacing:-.5px; color:var(--mn-green-d);}
.mt_plans .pr small {font-size:12px; font-weight:600; color:var(--mn-sub);}
.mt_plans dl {margin:0; display:grid; grid-template-columns:1fr auto; gap:9px 8px; font-size:12.5px;}
.mt_plans dt {color:var(--mn-sub);}
.mt_plans dd {margin:0; font-weight:700; color:var(--mn-text); text-align:right;}
.mt_plans dd.none {color:var(--mn-mute); font-weight:500;}
.mt_note {display:flex; align-items:center; gap:6px; margin:12px 0 0; font-size:12.5px; color:var(--mn-sub);}
.mt_groups {display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px;}
.mt_groups section {padding:18px 20px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff;}
.mt_groups h4 {display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:0 0 10px; font-size:14.5px; font-weight:800; color:var(--mn-ink);}
.mt_groups h4 i {width:30px; height:30px; border-radius:9px; background:var(--mn-green-l); color:var(--mn-green); font-size:15px; display:inline-flex; align-items:center; justify-content:center;}
.mt_groups h4 small {font-size:11.5px; font-weight:500; color:var(--mn-mute);}
.sub_page.mt .mt_groups ul {list-style:none; margin:0; padding:0;}
.mt_groups li {display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 0; border-top:1px dashed var(--mn-line); font-size:13px;}
.mt_groups li:first-child {border-top:0;}
.mt_groups li em {display:block; font-style:normal; font-size:11.5px; color:var(--mn-mute);}
.mt_groups li b {flex:none; color:var(--mn-green-d); font-variant-numeric:tabular-nums;}
@media (max-width:1024px) {
	.sub_page.mt .mt_plans {grid-template-columns:repeat(2, minmax(0, 1fr));}
	.mt_groups {grid-template-columns:minmax(0, 1fr);}
}
@media (max-width:720px) {
	.sub_page.mt .mt_types, .sub_page.mt .mt_need, .sub_page.mt .mt_plans {grid-template-columns:minmax(0, 1fr);}
}

/* ---- 마케팅 서비스 안내 ---- */
.mk_serp_mock {display:flex; flex-direction:column; gap:10px; padding:20px; border-radius:16px; background:var(--wm-panel); border:1px solid var(--wm-line); box-shadow:0 24px 50px rgba(0,0,0,.4);}
.mk_serp_mock .bar {display:flex; align-items:center; gap:10px; padding:10px 16px; border:2px solid var(--mn-green); border-radius:999px; font-size:12.5px; color:#8a95a0;}
.mk_serp_mock .bar i {color:#7ee094;}
.mk_serp_mock .ad, .mk_serp_mock .reg {padding:12px 14px; border-radius:10px;}
.mk_serp_mock .ad {background:rgba(251,191,36,.12); border:1px dashed rgba(251,191,36,.5);}
.mk_serp_mock .reg {background:rgba(45,178,74,.14); border:1px solid rgba(45,178,74,.4);}
.mk_serp_mock em {display:flex; align-items:center; gap:6px; font-style:normal; font-weight:800; font-size:12.5px; color:#fcd34d;}
.mk_serp_mock .reg em {color:#7ee094;}
.mk_serp_mock span {display:block; margin-top:2px; font-size:11.5px; color:#9aa5af;}
.mk_serp_mock .row {height:9px; border-radius:5px; background:#232a30;}
.mk_serp_mock .row.s {width:58%;}
.sub_page.mk .mk_svcs {list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px;}
.mk_svcs > li {position:relative; display:flex; flex-direction:column; gap:8px; padding:24px 20px 20px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff; transition:border-color .2s, transform .2s;}
.mk_svcs > li:hover {border-color:var(--mn-green); transform:translateY(-2px);}
.mk_svcs .no {position:absolute; right:16px; top:12px; font-size:26px; font-weight:800; letter-spacing:-1px; color:var(--mn-line);}
.mk_svcs > li > i {width:44px; height:44px; border-radius:12px; background:var(--mn-green-l); color:var(--mn-green); font-size:21px; display:inline-flex; align-items:center; justify-content:center;}
.mk_svcs strong {margin-top:4px; font-size:16px; color:var(--mn-ink);}
.mk_svcs p {margin:0; font-size:13px; color:var(--mn-sub); line-height:1.6;}
.sub_page.mk .mk_svcs ul {list-style:none; margin:4px 0 8px; padding:0; display:flex; flex-direction:column; gap:6px; flex:1;}
.mk_svcs ul li {position:relative; padding-left:14px; font-size:12.5px; line-height:1.55; color:var(--mn-text);}
.mk_svcs ul li::before {content:''; position:absolute; left:0; top:.6em; width:5px; height:5px; border-radius:50%; background:var(--mn-green);}
.mk_svcs > li > a {display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:700; color:var(--mn-green-d); text-decoration:none;}
.mk_svcs > li > a:hover {text-decoration:underline;}
.sub_page.mk .lc_table tbody th {width:110px;}
.sub_page.mk .lc_table td {font-size:13px;}
@media (max-width:1024px) {.sub_page.mk .mk_svcs {grid-template-columns:minmax(0, 1fr);}}

/* 홈페이지 제작 첫 화면 */
.hp_price {display:inline-block; margin-left:6px; padding:1px 9px; border-radius:999px; background:var(--mn-green-l); color:var(--mn-green-d); font-size:11.5px; font-style:normal; font-weight:800; vertical-align:2px;}
.sub_page.hpm .ab_modules strong a {color:inherit;}
.sub_page.hpm .ab_modules strong a:hover {color:var(--mn-green);}

/* ---- 호스팅 ---- */
.hs_status {padding:20px; border-radius:16px; background:var(--wm-panel); border:1px solid var(--wm-line); box-shadow:0 24px 50px rgba(0,0,0,.4);}
.hs_status_head {display:flex; align-items:center; gap:10px; margin-bottom:12px; color:#fff;}
.hs_status_head i {color:#7ee094; font-size:18px;}
.hs_status_head strong {font-size:14px;}
.hs_status_head small {margin-left:auto; padding:2px 10px; border-radius:999px; background:rgba(255,255,255,.08); font-size:11px; color:#9aa5af;}
.sub_page.hs .hs_status ul {list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
.hs_status li {display:flex; align-items:center; gap:12px; padding:11px 14px; border-radius:10px; background:#1d2328; border:1px solid var(--wm-line);}
.hs_status li > i {flex:none; width:34px; height:34px; border-radius:9px; background:rgba(45,178,74,.16); color:#7ee094; font-size:17px; display:inline-flex; align-items:center; justify-content:center;}
.hs_status li div {flex:1; min-width:0;}
.hs_status li strong {display:block; font-size:13px; color:#e6edf3;}
.hs_status li small {display:block; margin-top:1px; font-size:11px; color:#7b8691;}
.hs_status .ok {flex:none; padding:3px 10px; border-radius:999px; background:rgba(45,178,74,.2); color:#7ee094; font-size:11px; font-weight:800;}
.hs_what {display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; margin-top:16px;}
.hs_what > div {display:flex; gap:14px; padding:20px; border-radius:var(--mn-radius); background:var(--mn-soft);}
.hs_what .ic {flex:none; width:44px; height:44px; border-radius:12px; background:#fff; color:var(--mn-green); font-size:21px; display:inline-flex; align-items:center; justify-content:center;}
.hs_what strong {display:block; font-size:15px; color:var(--mn-ink);}
.hs_what p {margin:4px 0 0; font-size:13px; line-height:1.7; color:var(--mn-sub);}
.hs_tabs {display:flex; flex-wrap:wrap; gap:6px; margin:0 0 14px;}
.hs_tabs button {display:inline-flex; align-items:center; gap:6px; padding:10px 18px; border-radius:999px; background:var(--mn-soft); color:var(--mn-sub); font-size:13.5px; font-weight:700; transition:background .15s, color .15s;}
.hs_tabs button:hover {background:var(--mn-green-l); color:var(--mn-green-d);}
.hs_tabs button[aria-selected=true] {background:var(--mn-green); color:#fff;}
.hs_panel[hidden] {display:none;}
.hs_table th, .hs_table td {text-align:center;}
.hs_table tbody th {text-align:left;}
.hs_table td.ac {text-align:center;}
.hs_table small {font-weight:600; color:var(--mn-green-d);}
.hs_btn {display:inline-block; padding:7px 14px; border-radius:8px; background:var(--mn-green); color:#fff !important; font-size:12.5px; font-weight:700; text-decoration:none;}
.hs_btn:hover {background:var(--mn-green-d);}
.sub_page.hs .hs_support {margin:0; border-top:2px solid var(--mn-green);}
.hs_support > div {display:flex; gap:16px; padding:12px 8px; border-bottom:1px solid var(--mn-line); font-size:13px;}
.hs_support dt {flex:none; width:130px; font-weight:800; color:var(--mn-ink);}
.hs_support dd {margin:0; color:var(--mn-sub); line-height:1.7;}
.sub_page.hs .hs_servers {list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px;}
.hs_servers > li {position:relative; display:flex; flex-direction:column; gap:8px; padding:22px 20px 18px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff; transition:border-color .2s, transform .2s;}
.hs_servers > li:hover {border-color:var(--mn-green); transform:translateY(-2px);}
.hs_servers .no {position:absolute; right:16px; top:12px; font-size:26px; font-weight:800; letter-spacing:-1px; color:var(--mn-line);}
.hs_servers > li > i {width:44px; height:44px; border-radius:12px; background:var(--mn-green-l); color:var(--mn-green); font-size:21px; display:inline-flex; align-items:center; justify-content:center;}
.hs_servers strong {font-size:16px; color:var(--mn-ink);}
.sub_page.hs .hs_servers ul {list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:5px; font-size:12.5px; color:var(--mn-sub);}
.hs_servers ul li i {margin-right:7px; color:var(--mn-mute);}
.hs_servers .pr {margin:6px 0 0; padding-top:12px; border-top:1px dashed var(--mn-line); font-size:18px; font-weight:800; color:var(--mn-green-d);}
.hs_servers .pr small {margin-right:6px; font-size:12px; font-weight:600; color:var(--mn-sub);}
.hs_servers > li > a {display:inline-flex; align-items:center; gap:6px; margin-top:4px; font-size:13px; font-weight:700; color:var(--mn-green-d); text-decoration:none;}
.hs_servers > li > a:hover {text-decoration:underline;}
.hs_ns {display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px;}
.hs_ns > div {display:flex; align-items:center; gap:12px; padding:16px 18px; border-radius:var(--mn-radius); background:var(--mn-soft);}
.hs_ns i {color:var(--mn-green); font-size:20px;}
.hs_ns strong {font-size:14px; color:var(--mn-ink);}
.hs_ns span {margin-left:auto; font-size:12.5px; color:var(--mn-sub);}
/* 서버관리대행 */
.sv_formula {display:flex; align-items:stretch; flex-wrap:wrap; gap:10px;}
.sv_formula > div {flex:1 1 180px; display:flex; flex-direction:column; gap:4px; padding:18px; border-radius:var(--mn-radius); background:var(--mn-soft);}
.sv_formula > div i {font-size:26px; color:var(--mn-green);}
.sv_formula strong {font-size:14.5px; color:var(--mn-ink);}
.sv_formula span {font-size:12.5px; color:var(--mn-sub); line-height:1.6;}
.sv_formula em {align-self:center; font-style:normal; font-size:22px; font-weight:800; color:var(--mn-mute);}
.sub_page .sv_plans {list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:12px;}
.sv_plans li {padding:20px 18px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff;}
.sv_plans h4 {display:flex; align-items:center; gap:8px; margin:0; font-size:14.5px; font-weight:800; color:var(--mn-ink);}
.sv_plans h4 i {color:var(--mn-green);}
.sv_price {margin:10px 0 12px; font-size:24px; font-weight:800; letter-spacing:-.5px; color:var(--mn-green-d);}
.sv_price small {font-size:12px; font-weight:600; color:var(--mn-sub);}
.sv_plans dl {margin:0; display:flex; flex-direction:column; gap:6px; font-size:12.5px;}
.sv_plans dl > div {display:flex; justify-content:space-between;}
.sv_plans dt {color:var(--mn-sub);}
.sv_plans dd {margin:0; font-weight:700;}
.sv_sub {display:flex; align-items:center; gap:8px; margin:22px 0 12px !important; font-size:15px; font-weight:800; color:var(--mn-ink);}
.sv_sub i {color:var(--mn-green);}
.sub_page .mg_plans {grid-template-columns:repeat(2, minmax(0, 1fr));}
.mg_plans .mg_best {border:2px solid var(--mn-green); background:linear-gradient(180deg, var(--mn-green-l), #fff 38%);}
.mg_plans h4 i {color:var(--mn-green); margin-right:6px;}
.mg_plans .t4_chips {margin-top:6px;}
.sub_page .mh_notes {list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
.mh_notes li {display:flex; align-items:flex-start; gap:10px; padding:12px 16px; border-radius:10px; background:var(--mn-soft); font-size:13px; line-height:1.6;}
.mh_notes li i {flex:none; margin-top:2px; color:var(--mn-green);}
.mh_notes li.hl {background:var(--mn-green-l); font-weight:700; color:var(--mn-green-d);}
/* 웹메일 호스팅 */
.sub_page .mh_plans {list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:12px;}
.mh_plans > li {display:flex; flex-direction:column; gap:10px; padding:22px 18px; border:1px solid var(--mn-line); border-radius:var(--mn-radius); background:#fff; transition:box-shadow .2s, transform .2s;}
.mh_plans > li:hover {box-shadow:var(--mn-shadow); transform:translateY(-2px);}
.mh_plans h4 {display:flex; align-items:center; gap:8px; margin:0; font-size:14.5px; font-weight:800; color:var(--mn-ink);}
.mh_plans h4 i {color:var(--mn-green);}
.mh_size {margin:0; font-size:28px; font-weight:800; letter-spacing:-1px; color:var(--mn-green-d);}
.mh_size small {font-size:12px; font-weight:600; color:var(--mn-sub);}
.mh_plans .mh_spec {margin:0;}
.mh_plans .mh_spec li {font-size:12px; gap:4px;}
.mh_price {margin:0; display:flex; flex-direction:column; gap:6px; font-size:12.5px;}
.mh_price > div {display:flex; justify-content:space-between; padding-top:6px; border-top:1px dashed var(--mn-line);}
.mh_price dt {color:var(--mn-sub);}
.mh_price dd {margin:0; font-weight:700; font-variant-numeric:tabular-nums;}
.mh_price .mh_main dd {color:var(--mn-green-d);}
.mh_plans > li > a {margin-top:auto; text-align:center; text-decoration:none;}
.mh_plans .wa_btn {height:42px; padding:0 18px; font-size:13.5px; width:100%; justify-content:center; box-sizing:border-box;}
@media (max-width:1100px) {
	.sub_page .sv_plans, .sub_page .mh_plans {grid-template-columns:repeat(2, minmax(0, 1fr));}
}
@media (max-width:720px) {
	.hs_what, .sub_page.hs .hs_servers, .hs_ns, .sub_page .mg_plans, .sub_page .sv_plans, .sub_page .mh_plans {grid-template-columns:minmax(0, 1fr);}
	.hs_support > div {flex-direction:column; gap:2px;}
	.hs_support dt {width:auto;}
}

/* 호스팅 서비스 안내 */
.sub_page .mk_svcs.hs_svcs {grid-template-columns:repeat(2, minmax(0, 1fr));}
.hs_guide th, .hs_guide td {text-align:left;}
.hs_guide thead th {text-align:left;}
.hs_guide tbody th {width:55%;}
@media (max-width:720px) {.sub_page .mk_svcs.hs_svcs {grid-template-columns:minmax(0, 1fr);}}

.hs_what.hs_what_one {grid-template-columns:minmax(0, 1fr);}
.mk_svcs > li > a + a {margin-top:-4px;}

/* ---- 고객센터 안내 ---- */
.cc_phone {display:flex; flex-direction:column; gap:6px; padding:24px; border-radius:16px; background:var(--wm-panel); border:1px solid var(--wm-line); box-shadow:0 24px 50px rgba(0,0,0,.4); color:#fff;}
.cc_phone .lbl {display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:700; color:#7ee094;}
.cc_phone strong {font-size:34px; font-weight:800; letter-spacing:-1px;}
.sub_page.cc .cc_phone dl {margin:8px 0 0; display:flex; flex-direction:column; gap:7px; font-size:12.5px;}
.cc_phone dl > div {display:flex; justify-content:space-between; padding-top:7px; border-top:1px solid var(--wm-line);}
.cc_phone dt {color:#8a95a0;}
.cc_phone dd {margin:0; font-weight:700; color:#e6edf3;}
.sub_page.cc .cc_types {margin:0;}
.sub_page.cc .cc_faq {list-style:none; margin:0; padding:0; border-top:2px solid var(--mn-green);}
.cc_faq li {border-bottom:1px solid var(--mn-line);}
.cc_faq a {display:flex; align-items:center; gap:10px; padding:14px 8px; font-size:13.5px; color:var(--mn-text); text-decoration:none;}
.cc_faq a:hover {color:var(--mn-green-d);}
.cc_faq .cat {flex:none; padding:2px 10px; border-radius:999px; background:var(--mn-green-l); color:var(--mn-green-d); font-size:11.5px; font-weight:800;}
.sub_page.cc .ab_modules strong a {color:inherit; text-decoration:none;}
.sub_page.cc .ab_modules strong a:hover {color:var(--mn-green);}

/* 솔루션 첫 화면 : 다른 서브 페이지와 같은 틀 */
.hs_status .ok.stop {background:rgba(255,255,255,.1); color:#b6c0c9;}
.sub_page.sl .sol_grid {margin-top:0;}
.sub_page.sl .sl_trio {margin-top:36px;}
.sub_page.sl .sl_trio .mn_list {list-style:none; margin:0; padding:0;}
.sub_page.sl .sl_trio .mn_list li {display:flex; align-items:center; gap:8px; padding:7px 0; font-size:13px;}
.sub_page.sl .sl_trio .mn_list a {color:var(--mn-text); text-decoration:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.sub_page.sl .sl_trio .mn_list a:hover {color:var(--mn-green-d);}
.sub_page.sl .sl_trio .mn_empty {margin:0; padding:20px 0; font-size:13px; text-align:center; color:var(--mn-mute); background:var(--mn-soft); border-radius:10px;}

/* 솔루션 카드 버튼 간격 10px */
.sol_btn {display:flex; flex-wrap:wrap; gap:10px;}

/* 호스팅 상품 카드 : 기간 옆 무료 개월 표시 */
.mh_price dt small {margin-left:4px; font-size:11px; font-weight:700; color:var(--mn-green-d);}

/* 상품 카드 3개일 때 3열 */
.sub_page .mh_plans.mh_plans3 {grid-template-columns:repeat(3, minmax(0, 1fr));}
@media (max-width:1100px) {.sub_page .mh_plans.mh_plans3 {grid-template-columns:repeat(2, minmax(0, 1fr));}}
@media (max-width:720px) {.sub_page .mh_plans.mh_plans3 {grid-template-columns:minmax(0, 1fr);}}

/* 호스팅 신청서 */
.hs_apply .hs_opts {display:flex; flex-wrap:wrap; gap:10px; margin:0 0 18px;}
.hs_apply .hs_opt {flex:1 1 180px; cursor:pointer;}
.hs_apply .hs_opt input {position:absolute; opacity:0;}
.hs_apply .hs_opt span {display:block; padding:14px 16px; border:1px solid #d9dfd9; border-radius:10px; background:#fff; text-align:center;}
.hs_apply .hs_opt span strong {display:block; font-size:15px;}
.hs_apply .hs_opt span em {font-style:normal; color:#666; font-size:13px;}
.hs_apply .hs_opt input:checked + span {border-color:#2e9e44; box-shadow:0 0 0 2px rgba(46,158,68,.25); background:#f3fbf5;}
.hs_apply .hs_opt input:focus-visible + span {outline:2px solid #2e9e44;}
.hs_apply .hs_sum {margin:6px 0 24px;}
.hs_apply .hs_sum th {width:34%; text-align:left; border-top:0; border-bottom:1px solid #e3e7e3;}
.hs_apply .hs_sum td {text-align:left;}
.hs_apply .hs_sum tr.tot th, .hs_apply .hs_sum tr.tot td {font-weight:700; font-size:16px; color:#1c7a31;}
.hs_apply .hs_fields {display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:20px;}
.hs_apply .hs_fields label {display:flex; flex-direction:column; gap:6px; font-weight:600; font-size:13.5px;}
.hs_apply .hs_fields label.wide {grid-column:1 / -1;}
.hs_apply .hs_fields small {font-weight:400; color:#777;}
.hs_apply .hs_fields input, .hs_apply .hs_fields textarea {padding:10px 12px; border:1px solid #cfd6cf; border-radius:8px; font:inherit; font-weight:400;}
.hs_apply .hs_agree {display:block; margin-top:12px; font-weight:600;}
.hs_apply button.wa_btn {border:0; cursor:pointer; font:inherit;}
@media (max-width:640px) {.hs_apply .hs_fields {grid-template-columns:1fr;}}

/* 메인(첫) 화면 : 사이드(mn_side)를 왼쪽으로, 가로폭은 서브페이지 사이드(cs_side)와 같은 240px */
@media (min-width:861px) {
	#mn_page.mn_body {grid-template-columns:240px minmax(0, 1fr); gap:28px;}
	#mn_page.mn_body > .mn_side {order:-1;}
}

/* ---- 메인 화면 : 서브페이지와 같은 디자인 ---- */
.hm {display:flex; flex-direction:column; gap:0;}
.hm .mn_hero {border-radius:22px;}
.hm .wm_hero {padding:44px 40px;}
.hm .wm_hero .wm_hero_txt {max-width:640px; position:relative; z-index:1;}
.hm .wm_hero .wm_title {font-size:34px;}
.hm .wm_hero .wm_hero_ic {font-size:170px; right:40px; bottom:-20px;}
.hm .pk_h:first-of-type {margin-top:34px !important;}
.hm .pk_h .ec_small {margin-left:auto; font-size:12.5px; font-weight:500; color:var(--mn-mute);}
.hm .pk_h .mn_more {color:var(--mn-sub);}
.hm_quick li > span a {color:inherit; text-decoration:none;}
.hm_quick li > span a:hover {color:var(--mn-green);}
.hm_quick li {position:relative;}
.hm_quick li > span a::after {content:""; position:absolute; inset:0;}
.hm_plans .mh_price > div {border-top:0; padding-top:0;}
.hm_plans .mh_price dd {font-size:17px;}
@media (max-width:1100px) {.hm_plans {grid-template-columns:repeat(2, minmax(0, 1fr)) !important;}}
@media (max-width:720px) {
	.hm .wm_hero {padding:30px 22px;}
	.hm .wm_hero .wm_title {font-size:26px;}
	.hm .wm_hero .wm_hero_ic {display:none;}
	.hm_plans {grid-template-columns:minmax(0, 1fr) !important;}
	.hm .pk_h .ec_small {display:none;}
	.hm .pk_feat, .hm .wm_stats {grid-template-columns:repeat(2, minmax(0, 1fr));}
}