/*  */
.table-wrapper{width:100%;text-align: center; margin-top: 10px;}
.table-wrapper .box{width:100%;box-sizing:border-box; box-shadow: 0px 5px 24px 0 rgba(42, 57, 85, 0.31);border-radius:10px;overflow:hidden;margin-top:46px;}
.table-wrapper .status-title{display:table;width:100%;border-collapse:collapse;text-align: center;}
.table-wrapper .status-title span{display: table-cell;box-sizing:border-box;font-size:20px;color:#fff;font-weight:500;letter-spacing:-0.4px;background:#21242d;padding:15px 0;}
.table-wrapper .status-title span + span{border-left:1px solid #666;}
.table-wrapper .status-title span:nth-child(1){width:15%;}
.table-wrapper .status-title span:nth-child(3){width:24%;}
.table-wrapper .status-title span:nth-child(4){width:16%;}
.table-wrapper .status-container{height:560px !important}
.table-wrapper .status-container .slick-slide{border:none;border-top:1px solid #ddd;height:56px;box-sizing:border-box;}
.table-wrapper .status-container .status-list{display:table !important;font-size:0;}
.table-wrapper .status-container .status-list span{font-size:17px;color:#666;font-weight:400;letter-spacing:-0.34px;background:#fff;padding:14px 0;display:table-cell;box-sizing:border-box;}
.table-wrapper .status-container .status-list span + span{border-left:1px solid #ddd;}
.table-wrapper .status-container .status-list span:nth-child(1){width:15%;}
.table-wrapper .status-container .status-list span:nth-child(3){width:24%;}
.table-wrapper .status-container .status-list span:nth-child(4){width:16%;}
.table-wrapper .status-container .status-list span.title{color:#333;}
.table-wrapper .status-container .status-list span.nopay{color:#28adb2;font-weight:500;}
.table-wrapper .status-container .status-list span.pay{color:#2846b2;font-weight:500;}
.table-wrapper .btn_more{display: inline-block;box-sizing:border-box;background:transparent;border:1px solid #555;width:240px;height:70px;line-height:66px;font-size:20px;color:#333;font-weight:400;letter-spacing:-0.8px;margin-top:60px;text-align: center;transition:all 0.5s;}
.table-wrapper .btn_more:hover{background:#2846b2;border:1px solid #2846b2;color:#fff;transition:all 0.5s;}

.blurred {display: inline-block;  filter: blur(5px);   color: inherit; background-color: rgba(255, 255, 255, 0.5);}
.main_title{text-align: center; padding-top: 30px; padding-bottom: 30px;}
.main_title h3{font-size:50px;color:#222;font-weight:500;letter-spacing:-1px;position: relative;padding:20px;}
.main_title p { font-size: 22px; color: #333; font-weight: 400;letter-spacing: -0.4px; margin-top: 9px;}
.text{font-size: 16px;color: #fff;font-weight: 500;line-height: 23px;opacity: 0.7;}

/*  */
.process{margin-left:-20px;font-size:0;    margin-top: 46px;}
.process > li{display:inline-block;margin-left:20px;width:calc(25% - 20px);margin-top:20px;text-align:center;vertical-align:top;}
.process > li p.tit{font-size:19px;color:rgb(54, 54, 54);margin-top:20px;}
.process > li p.tit span{background:url("../image/sub/busi_sbg.png") repeat-x left bottom;}
.process > li p.text{color:rgb(54, 54, 54);opacity:1;letter-spacing:-0.5px;margin-top:20px;min-height:80px;margin-bottom:20px;} 
.process img{ left: calc((100% - 150px) / 2); border-radius: 30px;}
.process li:after {content: '';position: absolute; width: 15px; height: 27px;background: url("../../img/arro.png") no-repeat center center; left: 370px; top: 185px;}

/* 주의사항 */
.caution {width:100%;box-sizing:border-box;border-radius:10px;box-shadow:0 5px 24px 0 rgba(42,57,85,0.31);overflow:hidden;display:flex;margin-top:40px;background:#fff;}
.caution dt, .caution dd {box-sizing:border-box;}
.caution dt {background:#f5f5f5;font-size:1.575rem;color:#333;font-weight:500;letter-spacing:-0.44px;padding:0 30px;display:flex;align-items:center;}
.caution dd {padding:10px 20px;}
.caution dd ul li {font-size:17px;color:#666;letter-spacing:-0.32px;line-height:2rem;position:relative;box-sizing:border-box;padding-left:13px;text-align:left;margin-bottom:10px;}
.caution dd ul li:before {width:3px;height:3px;content:"";background:#aaa;box-sizing:border-box;border-radius:100%;position:absolute;left:0;top:50%;transform:translateY(-50%);}

/* lms유지관리 이미지 레이어 팝업 */
.image-popup-overlay { display: none; position: fixed; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.85); justify-content: center; align-items: center; }
.image-popup-overlay.active { display: flex; }
.image-popup-overlay img { width: 1400px; height: 650px; max-width: 95vw; max-height: 95vh; object-fit: contain; border-radius: 12px; box-shadow: 0 0 30px rgba(0,0,0,0.5); transition: transform 0.3s ease; transform: scale(1.05); }
.image-popup-overlay .close-btn { position: absolute; top: 30px; right: 40px; font-size: 32px; color: #fff; cursor: pointer; font-weight: bold; z-index: 10000; }
@media screen and (max-width: 768px){ .image-popup-overlay img { max-width: 90vw; max-height: 80vh; } }
@media screen and (max-width: 480px){ .image-popup-overlay img { max-width: 85vw; max-height: 70vh; } }
@media screen and (max-width:640px){ .process { margin-left:-10px; font-size:0; } .process > li { margin-left:10px; width:calc(50% - 10px); } .process > li > span { display:block; border-radius:30px; overflow:hidden; } }
@media screen and (max-width:420px){ .process > li { margin-left:10px; width:calc(100% - 10px); } .process { margin-left:0px; font-size:0; } }
@media (max-width: 767px){
  .table-wrapper .status-title span { font-size:16px; }
  .table-wrapper .status-container .status-list span { font-size:13px; }
  .main_title h3 { font-size:26px; }
  .main_title p { font-size:18px; }
  .process > li p.tit { font-size:16px; }
  .process > li p.text { margin-top:10px; min-height:60px; margin-bottom:10px; }
  .text { font-size:14px; }
  .caution dt { font-size:18px; }
  .caution dd ul li { font-size:14px; line-height:14px; }
}
@media (max-width: 480px){
  .table-wrapper .status-container .status-list span { font-size:10px; }
  .caution dt { font-size:12px; padding:0 20px; }
  .caution dd ul li { font-size:12px; line-height:1.5rem; }
}
@media (max-width: 500px){ .company-name { display:none !important; } }

/* 플랜 박스 컨테이너 */
.plans { display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; padding:40px 0 0 0; width:100%; }
.plan { background:#f9f9f9; border-radius:12px; width:350px; box-shadow:0 5px 24px rgba(42,57,85,0.31); display:flex; text-align:left; flex-direction:column; overflow:hidden; }
.plans h1 { font-weight:700; font-size:2.2rem; margin-bottom:40px; position:relative; }
.plans h1::before { content:'•'; position:absolute; left:50%; top:-25px; transform:translateX(-50%); font-size:2.5rem; color:#3054f1; }
.plan-header { background-color:#3e6ded; padding:25px 20px 20px; color:#fff; position:relative; border-radius:12px 12px 0 0; font-weight:500; }
.plan.basic .plan-header { background-color:#5a6f9f; }
.plan.standard .plan-header { background-color:#3f4d81; }
.plan.premium .plan-header { background-color:#2a3760; }

/* 상단 설명 텍스트 */
.plan-desc { font-size:16px; opacity:0.8; margin-bottom:10px; line-height:1.3; }
.plan-name { font-size:30px; margin-bottom:8px; }
.plan-monthly { display:inline-block; border:1.6px solid #fff; font-weight:600; font-size:20px; padding:4px 16px; margin-bottom:14px; }
.plan-monthly .plan-avt { font-size:12px; color:#e1e1e1; margin-top:-5px; text-align:right; }
.plan-list { padding:25px 20px; flex-grow:1; background:#fff; border-radius:0 0 12px 12px; box-sizing:border-box; font-size:16px; text-align:left; }
.plan-list-item { display:flex; justify-content:space-between; margin-bottom:14px; border-bottom:1px solid #e3e3e3; padding-bottom:6px; line-height:1.3; }
.plan-list-item span:first-child { color:#555; font-weight:500; }
.plan-list-item span:first-child small { display:block; font-size:10px; color:#999; font-weight:400; margin-top:2px; }
.plan-list-item span:last-child { font-weight:600; color:#333; white-space:nowrap; }

/* 반응형 */
@media (max-width: 1024px){ .plans { justify-content:space-around; } }
@media (max-width: 740px){ .plans { flex-direction:column; align-items:center; } .plan { width:100%; margin-bottom:30px; } }

/* 전체 wrapper */
.section-wrapper { display:flex; flex-wrap:wrap; gap:20px; justify-content:center; margin-top:45px; margin-bottom:45px; }
.section-wrapper .box { flex:1 1 400px; max-width:560px; background:#fff; border-radius:16px; padding:30px 24px; box-shadow:0 4px 20px rgba(0,0,0,0.05); display:flex; flex-direction:column; align-items:center; text-align:center; }
.section-wrapper .box .img { width:100%; max-width:600px; margin-bottom:24px; }
.section-wrapper .box .title { font-weight:700; font-size:22px; margin-bottom:16px; }
.section-wrapper .box .highlight { color:#1476ff; font-weight:600; margin-bottom:10px; }
.section-wrapper .box .text { font-size:14px; color:#333; margin-bottom:6px; line-height:1.6; }
.section-wrapper .box .features { font-size:13px; color:#555; }
.section-wrapper .box .badge { margin-top:20px; display:inline-block; background:#2b3761; color:#fff; font-size:12px; font-weight:600; border-radius:12px; padding:4px 12px; margin-bottom:8px; }

/* 반응형 */
@media (max-width: 768px){
  .section-wrapper { flex-direction:column; align-items:center; }
  .section-wrapper .box { width:100%; max-width:100%; margin:0 auto; }
}

/*  */
.plan{ width:100%;}
.maintenance-plan-table { min-width: 1000px;}
.maintenance-plan-table thead tr th{font-size:20px;color:#333;font-weight:500;letter-spacing:-0.4px;background:#f2f2f2;padding:15px 0;text-align: center; border-bottom: 1px solid #ddd}
.maintenance-plan-table tbody tr th{border-right:1px solid #ddd;box-sizing:border-box;background:rgba(221,221,221,0.3);text-align:center;font-size:17px;color:#333;font-weight:400;line-height:22px;vertical-align: middle;padding:10px 0 10px 5px;}
.maintenance-plan-table tbody tr th span{font-size:14px;color:#666;}
.maintenance-plan-table tbody tr + tr th{border-top:1px solid #ddd;}
.maintenance-plan-table tbody tr td{font-size:16px;font-weight:400;letter-spacing:-1px;background:#fff;padding:6px 0;vertical-align: middle;padding-left:20px;line-height:25px; }
.maintenance-plan-table tbody tr td.price{font-size:17px;color:#333;padding:0 10px;text-align: center;}
.maintenance-plan-table tbody tr + tr td{border-top:1px solid #ddd;}
.maintenance-plan-table tbody tr td + td{border-left:1px solid #ddd;}
.maintenance-plan-table tbody tr td ul li{color:#666;line-height:24px;position: relative;box-sizing:border-box;padding-left:11px;}
.maintenance-plan-table tbody tr td ul li:before{width:3px;height:3px;content:"";background:#aaa;box-sizing:border-box;border-radius:100%;position: absolute;left:0;top:12px;}
.maintenance-plan-table tbody tr td ul li + li{margin-top:12px;}
.maintenance-ep { background-color: #5a6f9e !important; text-align: left !important; padding: 25px 20px 20px !important; color: white !important; position: relative !important; font-weight: 500 !important; }
.maintenance-bp { background-color: #404e82 !important; text-align: left !important; padding: 25px 20px 20px !important; color: white !important; position: relative !important; font-weight: 500 !important; }
.maintenance-sp { background-color: #2b3761 !important; text-align: left !important; padding: 25px 20px 20px !important; color: white !important; position: relative !important; font-weight: 500 !important; }

@media screen and (max-width: 1000px){
    .plan{ overflow-x: scroll; font-size:13px;}
    .plan-desc{ font-size:14px;}
    .maintenance-plan-table tbody tr td{ font-size:13px;}
    .maintenance-plan-table tbody tr th{ font-size:14px;}
    .maintenance-ep{padding:10px !important;}
    .maintenance-bp{padding:10px !important;}
    .maintenance-sp {padding:10px !important;}
}

.basic { color: #0000cb; }
.special { color: #d30000; }
.attack-container { display: flex; flex-wrap: wrap; }
.attack-box { flex: 1; min-width: 300px; box-sizing: border-box; padding: 15px; }
.attack-title { margin-bottom: 10px; font-size: 16px; font-weight: bold; }
.attack-table { width: 100%; border-collapse: collapse; text-align: left; font-size: 14px; }
.attack-table th { text-align: center; }
.attack-table th, .attack-table td { padding: 8px; border: 1px solid #e3e3e3; }
.attack-table td:nth-child(1),
.attack-table td:nth-child(3) {
    text-align: center;
}

.attack-table thead tr { background: #2b3761; color: #fff; }
@media (max-width: 700px){ .attack-container { flex-direction: column; } }

/*ddos보호*/
.maintenance-plan-table2 { min-width: auto;}
.maintenance-plan-table2 thead tr th{font-size:20px;color:#333;font-weight:500;letter-spacing:-0.4px;background:#f2f2f2;padding:15px 0;text-align: center; border-bottom: 1px solid #ddd}
.maintenance-plan-table2 tbody tr th{width:200px; border-right:1px solid #ddd;box-sizing:border-box;background:rgba(221,221,221,0.3);text-align:center;font-size:17px;color:#333;font-weight:400;line-height:22px;vertical-align: middle;padding:10px 0 10px 5px;}
.maintenance-plan-table2 tbody tr th span{font-size:14px;color:#666;}
.maintenance-plan-table2 tbody tr + tr th{border-top:1px solid #ddd;}
.maintenance-plan-table2 tbody tr td{font-size:16px;font-weight:400;letter-spacing:-1px;background:#fff;padding:6px 0;vertical-align: middle;padding-left:20px;line-height:25px; }
.maintenance-plan-table2 tbody tr td.price{font-size:17px;color:#333;padding:0 10px;text-align: center;}
.maintenance-plan-table2 tbody tr + tr td{border-top:1px solid #ddd;}
.maintenance-plan-table2 tbody tr td + td{border-left:1px solid #ddd;}
.maintenance-plan-table2 tbody tr td ul li{color:#666;line-height:24px;position: relative;box-sizing:border-box;padding-left:11px;}
.maintenance-plan-table2 tbody tr td ul li:before{width:3px;height:3px;content:"";background:#aaa;box-sizing:border-box;border-radius:100%;position: absolute;left:0;top:12px;}
.maintenance-plan-table2 tbody tr td ul li + li{margin-top:12px;}
.maintenance2-ep { background-color: #5a6f9e !important; text-align: left !important; padding: 25px 20px 20px !important; color: white !important; position: relative !important; font-weight: 500 !important; }


/* 플랜 박스 컨테이너 */
.plans2 { display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; padding:40px 0 0 0; width:55%;margin: 0 auto; max-width: 1200px;}
.plans2 h1 { font-weight:700; font-size:2.2rem; margin-bottom:40px; position:relative; }
.plans2 h1::before { content:'•'; position:absolute; left:50%; top:-25px; transform:translateX(-50%); font-size:2.5rem; color:#3054f1; }
.plan2{ width:100%;}
.plan2 { background:#f9f9f9; border-radius:12px; width:60%; box-shadow:0 5px 24px rgba(42,57,85,0.31); display:flex; text-align:left; flex-direction:column; overflow:hidden; justify-content : center; }
.plan2-header { background-color:#5a6f9f; padding:25px 20px 20px; color:#fff; position:relative; border-radius:12px 12px 0 0; font-weight:500; }
.plan2.basic2 .plan2-header { background-color:#5a6f9f; }
.plan2.standard .plan2-header { background-color:#3f4d81; }
.plan2.premium .plan2-header { background-color:#2a3760; }

/* 상단 설명 텍스트 */
.plan2-desc { font-size:16px; opacity:0.8; margin-bottom:10px; line-height:1.3; }
.plan2-name { font-size:30px; margin-bottom:8px; }
.plan2-monthly { display:inline-block; border:1.6px solid #fff; font-weight:600; font-size:20px; padding:4px 16px; margin-bottom:14px; }
.plan2-monthly .plan-avt { font-size:10px; color:#e1e1e1; margin-top:-5px; text-align:right; }

/* 반응형 */
@media (max-width: 740px) {
    .plan2 {
        flex-direction: column;
        align-items: center;
        width: 100%;
    }
    .plan2-desc {
        font-size: 14px;
        line-height: 1.5;
    }
    
    .maintenance-plan-table2 tbody tr th, .maintenance-plan-table2 thead tr th{
        font-size:16px;
        width:80px;
    }
}

