@charset "utf-8";

/* main **************************************************************************************************************************** */

.main-visual-wrap .main-visual{height:600px;background-position:center top;background-repeat:no-repeat;display:flex;align-items:center;background-size: auto 100%;}
.main-visual-wrap .main-visual .visual-copy{max-width:100%;width:1240px;margin:0 auto;text-align:left;color:#fff;box-sizing:border-box;padding-left:50px;}
.main-visual-wrap .main-visual .visual-copy .m-txt{font-size:4rem;font-weight:700;}
.main-visual-wrap .main-visual .visual-copy .s-txt{font-size:1.8rem;margin-top:20px;}
.main-visual-wrap .main-visual .visual-copy a.main-visual-btn{position:relative;display:inline-block;padding:15px 42px 14px 28px;box-sizing:border-box;margin-top:20px;font-size:1.4rem;color:#125DE6;background:#fff;border-radius: 30px;}
.main-visual-wrap .main-visual .visual-copy a.main-visual-btn:after{content:"";display:block;position:absolute;right:28px;top:50%;transform: translateY(-50%); width:14px;height:14px;background: url(https://static-hosting.nhn.com/imghs/cloudhost/main/main-visual-btn-arrow.png) center center no-repeat;}
.main-visual-wrap .swiper-control{display:flex;justify-content:center;position:absolute;bottom:100px;left:0;right:0;font-size:0;}
.main-visual-wrap .swiper-pagination{position:relative;}
.main-visual-wrap .swiper-pagination .swiper-pagination-bullet{display:inline-flex;width:40px;height:4px;background:#fff;border-radius:0;margin-left:4px;text-indent:-9999px; }
.main-visual-wrap .swiper-pagination .swiper-pagination-bullet:first-of-type{margin:0;}

.main-section{text-align:center;}

.main-sec-title{margin-bottom:60px;}
.main-sec-title h2{font-size:3.6rem;font-weight:700;line-height:1.5em;}
.main-sec-title .s-txt{font-size:1.6rem;color:#777;margin-top:12px;}

.sec-intro{padding:20px 0 100px;}
.sec-intro .hosting-intro{display:flex;justify-content:center;}
.sec-intro .hosting-intro dl{width:330px;margin:0 60px;}
.sec-intro .hosting-intro dl:before{display:block;content:'';width:196px;height:196px;margin:0 auto;}
.sec-intro .hosting-intro dl dt{font-size:2.4rem;font-weight:500;text-align:center;padding:20px 0 16px;}
.sec-intro .hosting-intro dl dd{text-align:left;font-size:1.6rem;color:#777;}
.sec-intro .hosting-intro dl.cloud:before{background:url(https://static-hosting.nhn.com/imghs/cloudhost/main/i_intro_cloud.png) center center / cover no-repeat;}
.sec-intro .hosting-intro dl.server:before{background:url(https://static-hosting.nhn.com/imghs/cloudhost/main/i_intro_server.png) center center / cover no-repeat;}
.sec-intro .hosting-intro .list-intro > li{position:relative;padding-left:10px;margin:2px 0;font-size:1.6rem;}
.sec-intro .hosting-intro .list-intro > li:before{position:absolute;left:0;top:0.65em;display:block;content:'';width:4px;height:4px;border-radius:50%;background-color:#125DE6;}

.sec-service{background-color:#F5F6FA;padding:120px 0;}

.main-service-list{display:flex;flex-wrap:wrap;max-width:1144px;margin:-8px auto;}
.main-service-list .service-item{width:270px;height:232px;margin:8px;}
.main-service-list .service-item a{display:flex;flex-direction:column;align-items:center;width:100%;height:100%;text-align:center;box-sizing:border-box;padding:56px 0 0 0;background-color:#fff;border-radius:20px;box-shadow:6px 12px 25px 0 rgba(14,37,71,0.05);transition:all 0.3s;}
.main-service-list .service-item .s-name{font-size:2rem;font-weight:500;display:block;}
.main-service-list .service-item .s-name:after{display:block;content:'';width:60px;height:60px;margin:32px auto 0 auto;background-image:url(https://static-hosting.nhn.com/imghs/cloudhost/main/i_service_group.png);background-position:0 0;background-repeat:no-repeat;background-size:auto 100%;}
.main-service-list .service-item .s-txt{font-size:1.4rem;color:#fff;line-height:1.42em;margin-top:8px;display:none;}
.main-service-list .service-item.item1 .s-name:after{background-position:0 0;}
.main-service-list .service-item.item2 .s-name:after{background-position:-70px 0;}
.main-service-list .service-item.item3 .s-name:after{background-position:-140px 0;}
.main-service-list .service-item.item4 .s-name:after{background-position:-210px 0;}
.main-service-list .service-item.item5 .s-name:after{background-position:-280px 0;}
.main-service-list .service-item.item6 .s-name:after{background-position:-350px 0;}
.main-service-list .service-item.item7 .s-name:after{background-position:-420px 0;}
.main-service-list .service-item.item8 .s-name:after{background-position:-490px 0;}
.main-service-list .service-item.item9 .s-name:after{background-position:-560px 0;}
.main-service-list .service-item.item10 .s-name:after{background-position:-630px 0;}
.main-service-list .service-item.item11 .s-name:after{background-position:-700px 0;}
.main-service-list .service-item.item12 .s-name:after{background-position:-770px 0;}

.main-service-list .service-item a:hover{background-color:#125DE6;}
.main-service-list .service-item a:hover .s-name{color:#fff;}
.main-service-list .service-item a:hover .s-name:after{display:none;}
.main-service-list .service-item a:hover .s-txt{display:block;}
.main-service-list .service-item a:hover:after{display:block;content:'';width:32px;height:32px;border-radius:50%;background:#fff url(https://static-hosting.nhn.com/imghs/cloudhost/main/arr_service_go.png) center center no-repeat;margin:24px auto 0 auto;background-size:auto 100%;}

.sec-guide{padding:120px;}
.sec-guide > .inner{width:1140px;max-width:100%;margin:0 auto;display:flex;}
.sec-guide .guide-title{text-align:left;margin:0;}
.sec-guide .service-ox-wrap{margin-left:auto;width:715px;}

.service-ox-start{height:366px;display:flex;align-items:center;justify-content:center;background-color:#F5F6FA;}
.service-ox-start .start-msg{font-size:2.4rem;font-weight:700;margin-bottom:40px;}

.service-ox-items .ox-item{height:114px;background-color:#F5F6FA;margin-bottom:12px;display:flex;align-items:center;padding:0 60px;}
.service-ox-items .ox-item:last-child{margin-bottom:0;}
.service-ox-items .ox-q{display:flex;align-items:center;font-size:1.8rem;text-align:left;}
.service-ox-items .ox-q:before{display:block;content:'';width:64px;height:64px;margin-right:40px;flex-shrink:0;background-image:url(https://static-hosting.nhn.com/imghs/cloudhost/main/i_ox_group.png);background-repeat:no-repeat;background-size: auto  100%;}
.service-ox-items .item1 .ox-q:before{background-position:0 0;}
.service-ox-items .item2 .ox-q:before{background-position:-64px 0;}
.service-ox-items .item3 .ox-q:before{background-position:-128px 0;}
.service-ox-items .ox-radio{margin-left:auto;display:flex;align-items:center;margin-right:-10px;}
.service-ox-items .ox-radio label{display:inline-block;width:60px;height:60px;vertical-align:middle;margin:0 10px;cursor:pointer;}
.service-ox-items .ox-radio label input{position:absolute;left:-9999px;}
.service-ox-items .ox-radio label span{display:block;width:60px;height:60px;text-align:left;text-indent:-9999px;border-radius:50%;background-color:#fff;box-shadow:4px 8px 12px rgba(0,0,0,0.05);background-repeat:no-repeat;background-position:center center;background-size:20px auto;}
.service-ox-items .ox-radio label.o span{background-image:url(https://static-hosting.nhn.com/imghs/cloudhost/main/i_o.png);}
.service-ox-items .ox-radio label.o input:checked + span{background-image:url(https://static-hosting.nhn.com/imghs/cloudhost/main/i_o_w.png);background-color:#125DE6;}
.service-ox-items .ox-radio label.x span{background-image:url(https://static-hosting.nhn.com/imghs/cloudhost/main/i_x.png);}
.service-ox-items .ox-radio label.x input:checked + span{background-image:url(https://static-hosting.nhn.com/imghs/cloudhost/main/i_x_w.png);background-color:#125DE6;}

.service-ox-result{height:366px;display:flex;align-items:center;justify-content:center;background-color:#F5F6FA;}
.service-ox-result .s-name{font-size:2.4rem;font-weight:700;}
.service-ox-result .s-name:before{display:block;content:'';width:60px;height:60px;margin:0 auto 12px auto;background-image:url(https://static-hosting.nhn.com/imghs/cloudhost/main/i_ox_group2.png);background-repeat:no-repeat;background-size: auto  100%;}
.service-ox-result .s-txt{font-size:1.4rem;color:#777;margin-top:6px;}
.service-ox-result .btns{margin-top:24px;}
.service-ox-result .btns a{width:150px;height:50px;margin:0 6px;}
.service-ox-result .result-cloudHosting .s-name:before{background-position:0 0;}
.service-ox-result .result-serverHosting .s-name:before{background-position:-60px 0;}
.service-ox-result .result-cloud .s-name:before{background-position:-120px 0;}

.sec-inquiry{height:400px;background:url(https://static-hosting.nhn.com/imghs/cloudhost/main/bg_inquiry.jpg) center top / cover no-repeat;display:flex;align-items:center;justify-content:center;}
.sec-inquiry > .inner{text-align:center;}
.sec-inquiry .inquiry-title{margin-bottom:36px;}
.sec-inquiry .inquiry-title h2{color:#fff;}
.sec-inquiry .inquiry-title .s-txt{color:#fff;}
.sec-inquiry .btn-inquiry{width:150px;height:50px;margin:0 auto;}

/* common **************************************************************************************************************************** */

/* button */
.btn{display:inline-flex;align-items:center;justify-content:center;height:50px;padding:0 30px;color:#fff;font-size:1.65rem;box-sizing:border-box;vertical-align:middle;/*line-height:1em;*/border-radius:25px;transition:all 0.3s;min-width:150px;}

.btn.blue{background-color:#125DE6;}
.btn.blue:hover{background-color:#0042C6;}
.btn.black{background-color:#333;}
.btn.black:hover{background-color:#222;}
.btn.gray{background-color:#999;}
.btn.gray:hover{background-color:#777;}
.btn.lgray{background-color:#f4f4f4;color:#555;}
.btn.lgray:hover{background-color:#eee;}
.btn.red{background-color: #f33535;}
.btn.red:hover{background-color: #ff0000;}
.btn.white{background-color:#fff;border:1px solid #999999;color:#999999;line-height:38px;}

.bottom-btns{text-align:center;display:flex;align-items:center;justify-content:center;margin-top:30px;}
.bottom-btns .btn{margin:0 5px;}
.bottom-btns .a-left{margin-right:auto;}
.bottom-btns .a-right{margin-left:auto;}


.btn.middle{height:40px;padding:0 16px;font-size:1.5rem;border-radius:0;min-width:88px;}
.btn.small{height:30px;padding:0 10px;font-size:1.4rem;border-radius:2px;min-width:auto;}

/* list */
.list-dot > li{position:relative;padding-left:10px;margin:2px 0;font-size:1.4rem;color:#777;}
.list-dot > li:before{position:absolute;left:0;top:0.65em;display:block;content:'';width:4px;height:4px;border-radius:50%;background-color:#125DE6;}
.list-dot.type2 > li:before{position:absolute;left:0;top:0.65em;display:block;content:'';width:4px;height:4px;border-radius:50%;background-color:#aaa;}

/* title */
.con-title{font-size:2.4rem;margin-bottom:16px;}

/* font */
.txt-red{color:#FF0000;}
.txt-blue{color:#125DE6;}
.txt-underline,
.txt-underline:hover{text-decoration:underline;text-underline-position:under;}

/* scroll */
.scrollBox::-webkit-scrollbar {appearance:none;-webkit-appearance:none;}
.scrollBox::-webkit-scrollbar:vertical {width:5px;}
.scrollBox::-webkit-scrollbar:horizontal {height:5px;}
.scrollBox::-webkit-scrollbar-thumb {background-color:#aaa;border-radius:10px;border:none;}
.scrollBox::-webkit-scrollbar-track {border-radius:10px;background-color:#eee;}

/* 레이어팝업 */
.popup-wrap{position:fixed;left:0;top:0;right:0;bottom:0;z-index:100;display:flex;align-items:center;justify-content:center;background-color:rgba(0,0,0,0.45);display:none;}
.popup-wrap .popup-box{width:720px;border-radius:30px;position:relative;min-width:360px;}
.popup-wrap .popup-box.w400px{width:400px;}
.popup-wrap .popup-box.w1200px{width:1200px;}
.popup-wrap .popup-box.w400px .con-title{font-size: 1.8rem;}
.popup-wrap .popup-box .pop-header{height:100px;background-color:#14296C;display:flex;align-items:center;padding:0 30px;position:relative;}
.popup-wrap .popup-box .pop-title{color:#fff;font-size:3rem;font-weight:600;margin-right:10px;}
.popup-wrap .popup-box .pop-close{position:absolute;right:15px;top:50%;margin-top:-20px;}
.popup-wrap .popup-box .pop-close button{width:40px;height:40px;text-align:left;text-indent:-9999px;overflow:hidden;background:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/i_pop_close.svg) center center no-repeat;}
.popup-wrap .popup-box .pop-body{background-color:#fff;padding:40px 40px 30px;border-radius: 4px;}
.popup-wrap .popup-box.w1200px .pop-body{max-height: 800px;overflow-y: auto;}
.popup-wrap .popup-box .pop-body p{font-size: 1.4rem;;}
.popup-wrap.active{display:flex;}
.popup-wrap .popup-box > .close{position: absolute;top:20px;right:20px;width:20px;height:20px;background: url(../img/sub/icon-popup-close.svg) no-repeat 0 0;text-indent: -9999px;}

.con-top-guide h4{position:relative; font-size:1.4rem;line-height: 24px; padding-left:20px;margin:20px 0 8px;}
.con-top-guide h4:after{content:"";width:16px;height:16px;background: url(../img/sub/icon-warning.svg) left 0 no-repeat;position:absolute;left:0;top:5px;background-size: contain;}


/* tab */
.tabContent .tabBar{display:flex;margin-bottom:30px;}
.tabContent .tabBar li{flex:1;height:50px;line-height:40px;border-bottom:1px solid #ddd;text-align:center;}
.tabContent .tabBar li.active{height:47px;border-bottom:4px solid #125DE6;}
.tabContent .tabBar li a{display:block;font-size:1.6rem;color:#333;}
.tabContent .tabPage{display:none;}
.tabContent .tabPage.active{display:block;}

/* table */
.data-regist table{width:100%;table-layout:fixed;border:1px solid #aaa;border-width:1px 0;}
.data-regist th{background-color:#F9F9F9;padding:15px 20px;text-align:left;font-size:1.4rem;line-height:1.5em;border-bottom:1px solid #eee;}
.data-regist td{padding:5px 20px;text-align:left;font-size:1.4rem;line-height:1.5em;border-bottom:1px solid #eee;}
.data-regist tbody tr:last-child th,
.data-regist tbody tr:last-child td{border-bottom:none;}
.data-regist .txt-desc{color:gray}
.data-regist th .checkbox{height:auto;}



.data-regist.type2 > table,
.data-regist.type2 > table > tbody > tr > th,
.data-regist.type2 > table > tbody > tr > td{background:none;border:0;padding-left:0;padding-right:12px;}
.data-regist.type2 > table > tbody > tr > td + th{padding-left:40px;}
.data-regist.type2 > table > tbody > tr > td{padding-right:0;}

.data-regist.estimate-regist table{border-color:#eee;}
.data-regist.estimate-regist .left th,
.data-regist.estimate-regist .left td{text-align: left;font-weight:normal;font-size:1.3rem;}
.data-regist.estimate-regist th{background-color: #555;border-bottom: 1px solid #333;color:#fff;border-right:0;}
.data-regist.estimate-regist td{padding:5px 20px;}

.data-regist.estimate-regist + .data-regist.estimate-regist-type2{margin-top:12px;}

.data-regist.estimate-regist-type2 table{border:0;}
.data-regist.estimate-regist-type2 table thead th{background-color: #555;border-right:0;border-left: 0;color: #fff;font-weight:normal;font-size:1.3rem;text-align: center;}
.data-regist.estimate-regist-type2 table th.left,
.data-regist.estimate-regist-type2 table td.left{text-align: left;}
.data-regist.estimate-regist-type2 table td{border:0;border-top:1px solid #eee;font-size:1.3rem;text-align: center;padding: 5px 20px; height: 50px;}
.data-regist.estimate-regist-type2 table td .input-desc{margin-left:0;}
.data-regist.estimate-regist-type2 table td .input-desc span{color:#222;font-size:1.4rem;}
.data-regist.estimate-regist-type2 table td:first-child{padding-left:40px;}
.data-regist.estimate-regist-type2 table th{background-color: #f4f4f4;border:1px solid #fff;font-size:1.3rem;}
.data-regist.estimate-regist-type2 table th.type1{background-color: #E9F1FF;color:#125DE6;border-left: 1px solid #125DE6 ;}
.data-regist.estimate-regist-type2 table th.type2{background-color: #FFF3F1;color:#FC644B;border-left: 1px solid #FC644B ;}
.data-regist.estimate-regist-type2 table td.type1{background-color: #FFFAE6;border-top: 1px solid #fff ;padding-right:20px;}
.estimate-view {display: none;}
/* .estimate-view:first-child {display: table-row !important;} */
.estimate-view > td{border-right:1px solid #eee !important; border-left:1px solid #eee !important;padding:20px !important;}
.estimate-regist-calc{display: flex;justify-content: space-between;}


.data-view {border:1px solid #aaa;border-width:1px 0;}
.data-view table{width:100%;table-layout:fixed;}
.data-view th{background-color:#F9F9F9;padding:15px 20px;text-align:left;font-size:1.4rem;line-height:1.5em;border-bottom:1px solid #eee;border-left:1px solid #eee;border-right:1px solid #eee;}
.data-view td{padding:14px 20px;text-align:left;font-size:1.4rem;line-height:1.5em;border-bottom:1px solid #eee;border-left:1px solid #eee;border-right:1px solid #eee;}
.data-view tr th:first-child,
.data-view tr td:first-child{border-left:0;}
.data-view tr th:last-child,
.data-view tr td:last-child{border-right:0;}
.data-view tbody tr:last-child th,
.data-view tbody tr:last-child td{border-bottom:none;}
.data-view table.center th,
.data-view table.center td{text-align:center;}
.data-view thead th{text-align:center;}
.data-view tbody th:first-child{border-right:0;}
.data-view tbody th + td{border-left:0;}
.data-view tbody td.txt-price{text-align: right;}


/* input */
.input-tel{display:flex;align-items:center;justify-content:space-between;}
.input-tel select,
.input-tel input{width:calc((100% - 20px) / 3);}

/* contents */
.con-top-guide{margin-bottom:30px;}

/* sub **************************************************************************************************************************** */

.sub-visual{display:flex;justify-content:center;}
.sub-visual .visual-copy{text-align:center;padding:140px 0 178px;}
.sub-visual .visual-copy h2{font-size:3.6rem;color:#fff;line-height:1.5em;}
.sub-visual .visual-copy .s-txt{font-size:1.8rem;color:#fff;line-height:1.5em;margin-top:12px;}
.sub-visual.m1{background:#0E2547 url(https://static-hosting.nhn.com/imghs/cloudhost/layout/sub_visual_cloudHosting.png) no-repeat center top / auto 100%;}
.sub-visual.m2{background:#0042C6 url(https://static-hosting.nhn.com/imghs/cloudhost/layout/sub_visual_serverHosting.png) no-repeat center top / auto 100%;}
.sub-visual.m3{background:#0e2547 url(https://static-hosting.nhn.com/imghs/cloudhost/layout/sub_visual_webHosting.png) no-repeat center top / auto 100%;}
.sub-visual.m4{background:#0042C6 url(https://static-hosting.nhn.com/imghs/cloudhost/layout/sub_visual_addService.png) no-repeat center top / auto 100%;}

.sub-sec-title{text-align:center;margin-bottom:60px;}
.sub-sec-title h3{font-size:3.6rem;}
.sub-sec-title .s-txt{font-size:1.6rem;color:#777;margin-top:12px;}

.sub-sec-title.type2{text-align:center;margin-bottom:40px;}
.sub-sec-title.type2 h3{font-size:2.4rem;}
.sub-sec-title.type2 .s-txt{font-size:1.5rem;color:#333;margin-top:20px;}

.sub-section{padding:120px 0;}
.sub-section.p120{padding:120px 0;}
.sub-section > .inner{width:1140px;margin:0 auto;}
.sub-contents .sub-section:first-child{padding-top:20px;}
.sub-section.gray{background-color:#F5F6FA;}
.sub-section.navy{background-color:#0E2547;}

div + .sub-sec-title{margin-top:80px;}

.sub-title-wrap{display: flex; justify-content: space-between; align-items: end; border-bottom: 1px solid #ccc;padding-bottom:16px; margin-bottom:60px;}
.sub-title-wrap .sub-title h3{font-size:3.2rem;line-height: 46px;}
.sub-title-wrap .title-btn a{height:30px;padding:0 10px; font-size: 1.3rem; min-width:auto; border-radius: 0;}
.sub-title-wrap .title-btn a + a{margin-left:6px;}
.sub-title-wrap + .h3-desc{font-size: 1.4rem; line-height: 20px; margin:-44px 0 60px;color:#777;}

.checkbox input[type="checkbox"] + span{font-size:1.4rem;}
select:disabled{background:#f9f9f9 url(../img/sub/i_select2.svg) right 7px center no-repeat;cursor:default;}
label{cursor:pointer}
.mt70{margin-top:70px}

.service-apply section{margin-bottom: 80px;}
.service-apply section h3{font-size: 2.4rem; line-height: 36px; margin-bottom:12px}

.period-list{display: flex;justify-content: space-between;}
.period-list label{position: relative; width: calc(25% - 15px); }
.period-list label input{position: absolute;margin: 0;appearance: none;-webkit-appearance: none;height:0px;width:0px;font-size:0;}
.period-list label .item-box{position: relative; text-align: center; padding:31px 24px; display: flex; flex-flow: column; height:100%;box-sizing: border-box; border:1px solid #ddd;border-radius: 12px;}
.period-list label input:checked + .item-box{border:1px solid #125DE6;background:#E9F1FF;border-radius: 12px;}
.period-list label .item-box .top-benefit{position: absolute;top:32px; left:0;right:0;display: flex;justify-content: center;}
.period-list label .item-box .top-benefit span{display: inline-flex;margin:0 2px; height:24px;line-height: 24px; padding:0 7px;color:#fff;font-size:14px;}
.period-list label .item-box .top-benefit span.item1{background-color: #20AFE3;}
.period-list label .item-box .top-benefit span.item2{background-color: #125DE6;}
.period-list label .item-box .top-benefit span.item3{background-color: #0E2547;}
.period-list label .item-box strong{margin-top:36px;font-size: 3.2rem; line-height: 46px;}
.period-list label .item-box em{position: relative; margin:22px 0;font-size: 2.4rem; line-height: 32px; font-weight: 700;}
.period-list label .item-box em span{font-size: 1.4rem; line-height: 24px;}
.period-list label .item-box em del{position: absolute;top:-22px;left:0;right:0; font-size:1.3rem;color:#aaa;display: block;font-weight:normal;}
.period-list label .item-box em .sale{color:#125DE6;padding-right:5px;}
.period-list label .item-box em .sale em{font-size:2.4rem}
.period-list label .item-box ul{border-top:1px solid #ddd;padding-top: 24px;}
.period-list label .item-box ul li{position: relative; margin-bottom:4px;padding-left:20px; text-align: left; font-size: 1.3rem; line-height: 22px;}
.period-list label .item-box ul li:last-child{margin-bottom:0;}
.period-list label div ul li:before{content:"";position:absolute;left:0;top:2px;width:20px;height: 20px;background:url(../img/sub/icon-check.svg) center center no-repeat;}

.input-desc-wrap{display: flex;align-items: center;}
.input-desc-wrap select{width:280px;}
.input-desc {display: inline-flex;margin-left:15px;}
.input-desc span{display: inline-flex;position: relative;padding-right:12px;margin-right:12px;color:#777;font-size: 1.3rem;}
.input-desc span:after{content:"";background-color:#ddd;width:1px;height:12px;position:absolute;top:50%;right:0;transform: translateY(-50%);}
.input-desc span:last-child:after{display: none;}
.input-desc.type2 span{color:#222;font-size: 1.4rem;}

.package-th,
.package-th label{display: flex;align-items: center;}
.switch [type="checkbox"] {appearance: none;position: relative;border: 2px solid #aaa;border-radius: 20px;width: 38px;height: 20px;margin-right:5px;cursor: pointer;}
.switch [type="checkbox"]::before {content: "";position: absolute;left: 0;width: 16px;height: 16px;border-radius: 50%;transform: scale(0.8);background-color: #aaa;transition: left 250ms linear;}
.switch [type="checkbox"]:checked {background-color: #125DE6;border-color: #125DE6;}
.switch [type="checkbox"]:checked::before {background-color: white;left: 18px;}
.switch [type="checkbox"]:disabled {border-color: lightgray;opacity: 0.7;cursor: not-allowed;}
.switch [type="checkbox"]:disabled:before {background-color: #999999;}
.switch [type="checkbox"]:disabled + span {opacity: 0.7;cursor: not-allowed;}

.package-wrap{padding:32px;background-color: #F9F9F9;margin-bottom:20px;}
.package-list{display: flex;justify-content: space-between;}
.package-list label{position: relative; width: calc(25% - 10px);}
.package-list label input{position: absolute;margin: 0;appearance: none;-webkit-appearance: none;height:0px;width:0px;font-size:0;}
.package-list label .item-box{position: relative; text-align: center; padding:35px 24px; display: flex; flex-flow: column; height:100%;box-sizing: border-box;border:1px solid #ddd;border-radius: 12px;background:#fff;}
.package-list label input:checked + .item-box{border:1px solid #125DE6;background:#E9F1FF;border-radius: 12px;}
.package-title{display: flex;align-items: end;margin-bottom:16px;}
.package-title h4{font-size:1.8rem;line-height: 28px;}
.package-title span{font-size:1.4rem;padding-left:8px;}
.package-title span .blue{color:#125DE6;}
.package-list label .item-box em{font-size:1.6rem;font-weight:700;line-height: 24px;margin-bottom:2px;}
.package-list label .item-box p{font-size:1.3rem;line-height: 20px;color:#777;}
.package-list label .item-box .top-benefit{position: absolute;top:10px; left:0;right:0;display: flex;justify-content: center;}
.package-list label .item-box .top-benefit .item2{display: inline-flex;margin:0 2px; height:24px;line-height: 24px; padding:0 7px;color:#fff;font-size:1.4rem;background-color: #125DE6;}
.icon-warning{position: relative; display: inline-flex; width:13px;height:12px;background: url(../img/sub/icon-warning.svg) right 0 no-repeat;margin-left:8px;cursor: pointer;}
span.icon-warning:hover .service-tooltip{opacity: 1;z-index: 5;}
.service-tooltip{opacity: 0; position: absolute;top:15px;left:0;background:#2B3240;color:#fff;padding:10px;font-size:1.4rem;transition: all 0.3s linear;z-index: -1;font-weight: normal;width:445px;box-sizing: border-box;}
.service-tooltip ul li{display: flex;position: relative; padding-left: 10px;}
.service-tooltip ul li:before{content: "";position: absolute;left:0;top:8px; width:3px;height:3px;background-color: #fff;}
.service-tooltip h5{font-size: 1.4rem;}
.service-tooltip em{font-weight: 700;flex-shrink: 0;margin-right:5px;}

.payment-wrap{border-top:1px solid #aaa;border-bottom:1px solid #aaa;}
.payment-wrap li h5{display: flex;align-items: center;height:50px;border-bottom:1px solid #eee;font-size: 1.4rem;line-height: 24px;padding:0 20px;box-sizing: border-box;cursor: pointer;}
.payment-wrap li h5 .icon-status{display: inline-flex;width:20px;height:20px;background: url(https://static-hosting.nhn.com/imghs/cloudhost/common/i_select.svg) center center no-repeat;padding-left:4px;transform: rotate(-180deg);transition: all 0.3s linear;}
.payment-wrap li h5.active .icon-status{transform: rotate(0deg);}
.payment-wrap li h5 span.pay{margin-left:auto;}
.payment-wrap li h4{display: flex; justify-content: space-between; line-height:60px;background-color: #f9f9f9;padding:0 20px;font-size: 1.6rem;}
.payment-wrap li h4 .pay{color: #125DE6;}
.payment-info{display: none; border-bottom:1px solid #eee;padding:0 20px 0 30px;font-size: 1.3rem;line-height: 36px;color:#999;}
.payment-info li{display: flex;justify-content: space-between;}

.promotion-wrap{display: flex;align-items: center;justify-content: space-between; height:40px;margin-top:12px;font-size: 1.4rem;}
.promotion-wrap.card{justify-content: start;}
.promotion-wrap a.btn-pm-code{display: block; color: #125DE6;margin-right:12px;}
.promotion-wrap a.btn-pm-init{display: inline-block; text-indent: -9999px;width:21px;height:21px;border-radius: 50%;background: #FF0000 url(../img/sub/icon-popup-close2.png) no-repeat center center;}
.promotion-wrap .code-item1{color:#24A148}
.promotion-wrap .code-item2{margin-left:auto;color: #125DE6;}
.promotion-wrap input[type="text"]{width:245px;margin:0 4px 0 12px;}
.promotion-wrap button.code{font-size: 1.4rem;height:40px;padding:0 10px;border-radius: 0;min-width:auto;}

.service-agree-box{padding:24px 40px;background-color: #F9F9F9;margin-bottom:10px;}
.service-agree-box li{display: flex;align-items: center;justify-content: space-between;font-size: 1.4rem;line-height: 32px;}
.service-agree-box li a{padding-left:6px;}
.service-agree-box li .checkbox{height:auto;}

[class^="icon-th-"]{position: relative;padding-left:34px;}
[class^="icon-th-"]:after{content:"";position: absolute;left:0;top:0;width: 24px; height: 24px; }
.icon-th-linux{background: url(../img/sub/icon-linux.svg) no-repeat 0 0;}
.icon-th-win{background: url(../img/sub/icon-win.svg) no-repeat 0 0;}

.pay-com-wrap{display: flex;align-items: center;justify-content: center; flex-flow: column;min-height:500px;padding:40px 0 80px}
.pay-com-wrap p.desc{position: relative;font-size: 2.4rem;line-height: 36px;font-weight: 700;padding:84px 0 0;}
.pay-com-wrap p.desc:before{content: "";position: absolute;top:0;left:50%;transform: translateX(-50%);width:64px;height:64px;background:url(../img/sub/icon-complete.svg) no-repeat 0 0}
.pay-com-wrap .bottom-btns{margin-top:40px;}
.pay-com-wrap .bottom-btns .btn{font-size: 1.8rem;}
.pay-com-wrap .pay-com-banner{margin-top:100px;}
.pay-com-wrap .pay-com-banner img{width:960px;height:420px;}

.popup-wrap .popup-box .pop-body .benefit-box{padding:32px; background:#f9f9f9; text-align: center;}
.popup-wrap .popup-box .pop-body .benefit-box p{margin-bottom:20px;font-size: 1.6rem;line-height: 24px;}
.popup-wrap .popup-box .pop-body .benefit-box p.type2{font-weight:500;}
.popup-wrap .popup-box .pop-body .benefit-box p:last-of-type{margin-bottom:0;color:#777;}
.popup-wrap .popup-box .pop-body .benefit-wrap .agree-check-wrap{margin-top:10px;}
.popup-wrap .popup-box .pop-body .benefit-wrap .bottom-btns{margin-top:20px;}
.popup-wrap .popup-box .pop-body .benefit-wrap .bottom-btns .btn{font-size: 1.8rem;line-height: 28px;}

.my-estimate-regist{margin-bottom:80px;}
.my-estimate-regist .h4-con-wrap{display: flex;margin-bottom:32px;}
.my-estimate-regist .h4-con-wrap > .sub-title{width: 180px;}
.my-estimate-regist .h4-con-wrap .sub-title .h4-title{font-size:1.6rem;line-height: 40px;}
.my-estimate-regist .h4-con-wrap .h4-con{flex:1;}
.my-estimate-regist .h4-con-wrap .h4-con .h5-title{font-size:1.4rem;line-height: 40px;}
.my-estimate-regist .h4-con-wrap .h4-con .data-view + .sub-title{margin-top: 20px;}
.my-estimate-regist .h4-con-wrap .h4-con .data-view.type2 th{padding:5px 20px;}

.my-estimate-regist .estimate-product-wrap{border:1px solid #ddd;padding:32px 40px;}
.my-estimate-regist .estimate-product-wrap .product-title-wrap{margin-bottom: 10px;}
.my-estimate-regist .estimate-product-wrap .product-title{font-size: 1.4rem;line-height: 24px; font-weight: 500;}
.my-estimate-regist .select-product-wrap {margin-bottom:12px;}
.my-estimate-regist .select-product-wrap select{width: 280px;}
.my-estimate-regist .select-product-wrap .btn{font-size: 1.4rem;padding:0 16px;min-width: auto;border-radius: 2px;}
.my-estimate-regist .input-desc-wrap select{width:130px;}
.my-estimate-regist .input-desc-wrap .input-desc{flex-flow: wrap;}
.my-estimate-regist .input-desc-wrap .input-desc span{font-size: 1.2rem;}
.my-estimate-regist .estimate-product-wrap .type2 th{font-weight:normal;vertical-align: top;}
.my-estimate-regist .estimate-product-wrap .package-list{margin-bottom:5px;}
.my-estimate-regist .estimate-product-wrap .package-list label .item-box{padding:13px 0;border-radius: 8px;}
.my-estimate-regist .estimate-product-wrap .package-list label .item-box em{font-size: 1.4rem; font-weight: 500;line-height: 20px;margin:37px 0 5px;}
.my-estimate-regist .estimate-product-wrap .package-list label .item-box .top-benefit .item2{font-size:1.3rem;}
.my-estimate-regist .bottom-btns{margin-top:60px;}

.my-estimate-list{margin-bottom:80px;}
.estimate-list > table > tbody > tr:nth-child(odd):hover,
.estimate-list > table > tbody > tr.active{cursor: pointer;background-color: #F2F7FF;}
.data-view.estimate-list td{padding:5px 20px;height:50px;}
.data-view.estimate-list .del-tr{color:#f33535;text-decoration: underline;}
.estimate-list .checkbox,
.estimate-list .radio{height:18px;vertical-align: middle;}
.estimate-list .checkbox input[type="checkbox"] + span,
.estimate-list .radio input[type="radio"] + span{width:18px;height:18px;padding-left:0;}
.fw500{font-weight: 500;}
.popup-wrap .popup-box .pop-body tr.estimate:first-child{display: block;}

.cloudHosting-product-wrap{display:flex;margin:0 -15px;}
.cloudHosting-product-wrap .item-box{width:360px;margin:0 15px;border:1px solid #ddd;border-radius:12px;box-sizing:border-box;padding:30px;text-align:left;}
.cloudHosting-product-wrap .p-name h4{font-size:2.4rem;font-weight:700;line-height:1.5em;}
.cloudHosting-product-wrap .p-name p{font-size:1.4rem;color:#777;line-height:1.4em;margin-top:4px;}
.cloudHosting-product-wrap .p-price{margin:8px 0 20px;}
.cloudHosting-product-wrap .p-price em{color:#125DE6;font-size:3.2rem;font-weight:500;}
.cloudHosting-product-wrap .p-price .unit{color:#125DE6;font-size:2rem;font-weight:500;}
.cloudHosting-product-wrap .p-price .info{font-size:1.4rem;color:#777;}
.cloudHosting-product-wrap .p-spec{border-top:1px solid #E5E5E5;padding:20px 0;}
.cloudHosting-product-wrap .p-spec li{display:flex;margin-bottom:6px;font-size:1.4rem;}
.cloudHosting-product-wrap .p-spec li:last-child{margin-bottom:0;}
.cloudHosting-product-wrap .p-spec .lb{color:#999;}
.cloudHosting-product-wrap .p-spec .data{margin-left:auto;text-align:right;}
.cloudHosting-product-wrap .go-app{display:flex;align-items:center;justify-content:center;width:100%;height:50px;border-radius:25px;background-color:#125DE6;color:#fff;font-size:1.4rem;transition:all 0.3s;}
.cloudHosting-product-wrap .go-app:after{display:block;content:'';width:6px;height:10px;background:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/arr_go.svg) center center no-repeat;margin-left:4px;}
.cloudHosting-product-wrap .go-app:hover{background-color:#0042C6;}

.cloudHosting-intro .intro-step{display:flex;justify-content:center;text-align:center;}
.cloudHosting-intro .intro-step [class^="step"]{margin:0 25px;font-size:1.6rem;font-weight:500;}
.cloudHosting-intro .intro-step [class^="step"]:before{display:block;content:'';width:196px;height:196px;border-radius:50%;background-color:#fff;margin:0 auto 10px auto;background-image:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/i_cloudHosting_intro.png);background-repeat:no-repeat;background-size:auto 100%;}
.cloudHosting-intro .intro-step .step1:before{background-position:0 0;}
.cloudHosting-intro .intro-step .step2:before{background-position:-196px 0;}
.cloudHosting-intro .intro-step .step3:before{background-position:-392px 0;}
.cloudHosting-intro .intro-step .arr{padding-top:115px;color:#777;font-size:1.4rem;}
.cloudHosting-intro .intro-step .arr:before{display:block;content:'';width:160px;height:6px;background:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/arr_cloud_step.svg) right center no-repeat;margin-bottom:10px;}
.cloudHosting-intro .list-dot{margin-top:50px;color:#777;font-size:1.4rem;}
.cloudHosting-intro .list-dot > li{margin:6px 0;}

.cloudHosting-advantage ul{display:flex;flex-wrap:wrap;margin:-30px 0;}
.cloudHosting-advantage li{width:50%;display:flex;align-items:center;margin:30px 0;}
.cloudHosting-advantage li:before{display:block;content:'';width:120px;height:120px;margin-right:30px;flex-shrink:0;background-image:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/i_cloudHosting_advantage.png);background-repeat:no-repeat;background-size:auto 100%;}
.cloudHosting-advantage .item1:before{background-position:0 0;}
.cloudHosting-advantage .item2:before{background-position:-120px 0;}
.cloudHosting-advantage .item3:before{background-position:-240px 0;}
.cloudHosting-advantage .item4:before{background-position:-360px 0;}
.cloudHosting-advantage dt{font-weight:500;font-size:1.6rem;}
.cloudHosting-advantage dd{font-size:1.4rem;color:#777;margin-top:8px;}

.sub-sec-banner{height:400px;display:flex;align-items:center;justify-content:center;}
.sub-sec-banner > .inner{text-align:center;}
.sub-sec-banner .banner-title{margin-bottom:36px;}
.sub-sec-banner .banner-title h3{font-size:3.6rem;color:#fff;line-height:1.5em;}
.sub-sec-banner .banner-title .s-txt{color:#fff;line-height:1.5em;margin-top:12px;font-size:1.6rem;}
.sub-sec-banner .btn-inquiry{width:170px;height:50px;margin:0 auto;}
.sub-sec-banner.intro-inquiry{background:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/bg_banner_inquiry.jpg) center top / cover no-repeat;}

.data-regist + .agree-check-wrap{margin-top:10px;}

.install-wrap{display:flex;flex-flow:wrap;}
.install-wrap .item-box{width:25%;padding:6px;box-sizing:border-box;}
.install-wrap .item-box input{display:none;}
.install-wrap .item-box input + label{display:flex;flex-flow:column;justify-content:center;align-items:center;height:120px;padding:0 31px;box-sizing:border-box;border:1px solid #ddd;border-radius:12px;text-align:center;cursor:pointer;}
.install-wrap .item-box input:checked + label{border:1px solid #125DE6;background:#E9F1FF;color:#125DE6;}
.install-wrap .item-box input:checked + label *{color:#125DE6;}
.install-wrap .item-box em{font-size:1.8rem;margin-bottom:3px;font-weight:500;}
.install-wrap .item-box p{font-size:1.3rem;color:#777;}

.guide-box{padding:16px 0;margin-top:20px;text-align:center;font-size:1.4rem;background:#f9f9f9;}

.creat-key{width:calc(100% - 105px);margin-right:10px;}

.pop-body .agree-wrap{height:400px}
.agree-wrap{padding:20px;border:1px solid #eee;height:200px;overflow-y:auto;box-sizing:border-box;font-size:1.4rem;}
.agree-wrap h3{margin-bottom:5px;}
.agree-wrap p,
.agree-wrap ul,
.agree-wrap ol{margin:5px 0;}
.agree-wrap li{text-indent:-15px;padding-left:15px;}
.agree-wrap p + h3,
.agree-wrap ol + h3,
.agree-wrap ul + h3{margin-top:20px;}

.privacy-wrap{padding:20px;border:1px solid #eee;height:200px;overflow-y:auto;box-sizing:border-box;font-size:1.4rem;}
.privacy-wrap li {text-indent:-20px;padding-left:20px;}
.privacy-title-link{padding:10px;border:1px solid #eee;margin-top:10px;}
.privacy-title-link a{line-height:2.4rem;}

.serverHosting-plan-wrap{display: flex; border:1px solid #ccc;border-radius: 8px;overflow:hidden;}
.serverHosting-plan-wrap > div{width:50%;padding:60px 64px;}
.serverHosting-plan-wrap .plan-data-wrap{background-color: #F5F6FA;}
.serverHosting-plan-wrap .serverHosting-plan-item + .serverHosting-plan-item{margin-top:40px;}
.serverHosting-plan-wrap .serverHosting-plan-item .title{font-size: 2.4rem;line-height: 36px;}
.serverHosting-plan-wrap .serverHosting-plan-item .range{display: flex;margin:15px 0 7px;}
.serverHosting-plan-wrap .serverHosting-plan-item .item-legend{display: flex; justify-content: space-between; font-size: 1.8rem;line-height: 28px;color:#555;}
.serverHosting-plan-wrap input[type=range]{-webkit-appearance: none; cursor: pointer; width:100%;}
.serverHosting-plan-wrap input[type=range]::-webkit-slider-thumb {-webkit-appearance: none;width:24px;height:24px;background-color: #fff;border:6px solid #125DE6;border-radius: 50%;margin-top:-8px; box-sizing: border-box;}
.serverHosting-plan-wrap input[type=range]::-moz-range-thumb {-webkit-appearance: none;width:24px;height:24px;background-color: #fff;border:6px solid #125DE6;border-radius: 50%;margin-top:-8px;box-sizing: border-box}
.serverHosting-plan-wrap input[type=range]::-webkit-slider-runnable-track {width:100%;height:8px;background-color: #eee;border-radius: 6px;box-sizing: border-box}
.serverHosting-plan-wrap input[type=range]::-moz-range-track  {width:100%;height:8px;background-color: #eee;border-radius: 6px;box-sizing: border-box}

.serverHosting-plan-wrap .sh-plan-r-title{text-align: center;font-size: 2.4rem;line-height: 36px;margin-bottom: 16px;}
.serverHosting-plan-wrap .sh-plan-r-title span{display: block;font-weight:normal; font-size: 1.8rem;line-height: 28px;color:#777;}
.serverHosting-plan-wrap .spec-price{font-size: 3.2rem;line-height: 44px;color:#125DE6;text-align: right;margin-top: 8px;font-weight: 700;}
.serverHosting-plan-wrap .spec-price span{font-size: 2.0rem;line-height: 28px;font-weight: normal;}
.serverHosting-plan-wrap .spec-price span span{color:#333;}
.data-view.serverHosting-plan{background-color: #fff;border-color: #ddd;}
.data-view.serverHosting-plan th{background:#125DE6;color:#fff;text-align: center;font-weight: normal;height: 56px;font-size: 1.6rem;border-bottom-color: #0042C6;}
.data-view.serverHosting-plan td{font-size: 1.6rem;}
.serverHosting-plan-wrap .plan-data-wrap .bottom-btns a{background-color: #222;}

.data-view.serverHosting-price{border-color: #ddd;}
.data-view.serverHosting-price thead th{background:#125DE6;color:#fff;text-align: center;font-weight: normal;height: 56px;border:0;}
.data-view.serverHosting-price th{text-align: center;background-color: #E9F1FF;border-bottom-color: #D7DFED;height: 56px;}
.data-view.serverHosting-price td{text-align: center;padding:4px 20px;border:1px solid #ddd;border-left:0;border-right: 0;background-color: #fff;}
.data-view.serverHosting-price .sh-price{padding:4px 16px 5px;border:1px solid #125DE6;color:#125DE6;height: 32px;min-width: 84px;font-size: 1.4rem;line-height: 20px;}
.data-view.serverHosting-price tr.active{position: relative; border:2px solid #125DE6;}
.data-view.serverHosting-price tr.active th{position: relative;}
.data-view.serverHosting-price tr.active th:after{content: "";position:absolute;left:-1px;top:-1px;width: 40px;height: 18px;background: url(../img/sub/ic-best-badge.png) no-repeat 0 0 / auto 100%;}

.serverHosting-compare-wrap.type1{padding-bottom: 64px;border-bottom: 1px solid #ddd;}
.serverHosting-compare-wrap .sh-compare-title{text-align: center;font-size: 2.4rem;line-height: 36px;color: #555;margin:-28px 0 24px;}
.serverHosting-compare-wrap.type1 + .sub-sec-title{margin-top:64px;}
.serverHosting-compare-wrap .compare-box-wrap{display: flex;justify-content: space-between;align-items: center;}
.serverHosting-compare-wrap .compare-box{position: relative;display: flex;justify-content: space-between; background-color: #F5F6FA;border-radius: 20px;padding: 40px;flex:1;}
.serverHosting-compare-wrap .compare-box.active{background-color: #125DE6;flex:0;margin-right:20px;box-shadow: 4px 8px 20px rgba(0, 66, 198, 0.3);color:#fff;}
.serverHosting-compare-wrap .compare-box.active:after{border:1px dashed #fff;}
.serverHosting-compare-wrap .compare-box:after{content:"";position: absolute;left:28px;right:28px;bottom:32px;height:31px;border:1px dashed #125DE6;border-radius: 4px;background: rgba(18, 93, 230, 0.08);transform: translateY(20%);opacity:0;transition: all 0.5s linear;}
.serverHosting-compare-wrap.type1 .compare-box:after{bottom: 64px;}
.serverHosting-compare-wrap .compare-box.on:after{transform: translateY(0%);opacity:1;box-shadow: 0 5px 10px rgba(0, 0, 0, .2);}


.serverHosting-compare-wrap .compare-box .compare-item{width:220px;}
.serverHosting-compare-wrap .compare-box .compare-item .compare-title{border-bottom: 1px solid #ddd;}
.serverHosting-compare-wrap .compare-box .compare-item .compare-title em{font-size: 2.4rem;line-height: 36px;color: #125DE6;font-weight: 700;}
.serverHosting-compare-wrap .compare-box .compare-item .compare-title span{font-size: 2.0rem;line-height: 28px;display: block;padding: 8px 0 20px;}
.serverHosting-compare-wrap .compare-box .compare-item .compare-list{margin-top: 20px;}
.serverHosting-compare-wrap .compare-box .compare-item .compare-list li{ margin-bottom: 10px;}
.serverHosting-compare-wrap .compare-box .compare-item .compare-list li:last-child{margin-bottom: 0;}
.serverHosting-compare-wrap .compare-box .compare-item .compare-list li.active{font-weight:500;}
.serverHosting-compare-wrap .compare-box .compare-item .compare-list em{font-size: 1.3rem;line-height: 20px;display: inline-flex;width:46px;color: #aaa;}
.serverHosting-compare-wrap .compare-box .compare-item .compare-list span{font-size: 1.4rem;line-height: 20px;}
.serverHosting-compare-wrap .compare-box.active .compare-title em{color:#fff;}
.serverHosting-compare-wrap .compare-box.active .compare-item .compare-list em{opacity: 0.7;color: #fff;}

.serverHosting-product-wrap{display:flex;margin:0 -10px;}
.serverHosting-product-wrap .item-box{width:25%;padding:30px;margin:0 10px;border-radius:12px;border:1px solid #ddd;box-sizing:border-box;}
.serverHosting-product-wrap .item-box .p-name h4{font-size:2.4rem;font-weight:700;line-height:1.5em;}
.serverHosting-product-wrap .item-box .p-name span img{vertical-align:inherit;padding-left:4px;height:18px;}
.serverHosting-product-wrap .item-box .p-price{margin:8px 0 20px;}
.serverHosting-product-wrap .item-box .p-price em{font-size:3.2rem;font-weight:500;color:#125DE6;}
.serverHosting-product-wrap .item-box .p-price .unit{font-size:2rem;font-weight:500;color:#125DE6;}
.serverHosting-product-wrap .item-box .p-spec{border-top:1px solid #E5E5E5;padding:20px 0;}
.serverHosting-product-wrap .item-box .p-spec li{display:flex;justify-content:space-between;font-size:1.4rem;margin-bottom:6px;}
.serverHosting-product-wrap .item-box .p-spec .lb{color:#999;}
.serverHosting-product-wrap .item-box .go-app{display:flex;justify-content:center;align-items:center;height:50px;border-radius:25px;background-color:#125DE6;color:#fff;font-size:1.4rem;transition:all 0.3s;}
.serverHosting-product-wrap .item-box .go-app:after{display:block;content:'';width:6px;height:10px;background:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/arr_go.svg) center center no-repeat;margin-left:4px;}
.serverHosting-product-wrap .item-box .go-app:hover{background-color:#0042C6;}

.title-type2 .inner{display:flex;justify-content:space-between;}
.title-type2 .sub-sec-title{text-align:left;flex:1;}

.serverHosting-intro .intro-step{display:flex;justify-content:center;}
.serverHosting-intro .intro-step li{position:relative;display:flex;flex-flow:column;align-items:center;width:25%;height:160px;}
.serverHosting-intro .intro-step li:before{content:"";width:120px;height:120px;background:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/i_severHosting_intro.png) no-repeat;background-position:0 0;background-size:auto 100%;}
.serverHosting-intro .intro-step li.step2:before{background-position:-120px 0;}
.serverHosting-intro .intro-step li.step3:before{background-position:-240px 0;}
.serverHosting-intro .intro-step li.step4:before{background-position:-360px 0;}
.serverHosting-intro .intro-step li .lb{font-size:2rem;margin-top:auto;}

.serverHosting-additional li{background:#F5F6FA;margin-bottom:12px;}
.serverHosting-additional li a{position:relative;display:flex;align-items:center;width:715px;height:114px;padding-left:60px;box-sizing:border-box;}
.serverHosting-additional li a:before{content:"";width:64px;height:64px;background:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/i_serverHosting_add.png) no-repeat 0 0 / auto 100%;}
.serverHosting-additional li.item1 a:before{background-position:0 0;}
.serverHosting-additional li.item2 a:before{background-position:-64px 0;}
.serverHosting-additional li.item3 a:before{background-position:-128px 0;}
.serverHosting-additional li a:after{content:"";position:absolute;right:60px;top:50%;transform:translateY(-50%);width:32px;height:32px;background:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/i_serverHosting_arr.png) no-repeat 0 0  / auto 100%;}
.serverHosting-additional li dl{padding-left:40px;}
.serverHosting-additional li dt{font-size:1.8rem;font-weight:500;}
.serverHosting-additional li dd{font-size:1.4rem;color:#777;}

.benefit-step{display:flex;justify-content:space-between;}
.benefit-step li{position:relative;display:flex;flex-flow:column;align-items:center;width:14.28%s;min-height:132px;}
.benefit-step li:before{content:"";width:100px;height:100px;background:url(../img/sub/i_serverHosting_benefit.png) no-repeat 0 0 / auto 100%;}
.benefit-step li.step2:before{background-position:-100px 0;}
.benefit-step li.step7:before{background-position:-600px 0;}
.benefit-step li.step3:before{background-position:-200px 0;}
.benefit-step li.step4:before{background-position:-300px 0;}
.benefit-step li.step5:before{background-position:-400px 0;}
.benefit-step li.step6:before{background-position:-500px 0;}
.benefit-step li .lb{margin-top:10px;text-align:center;font-size:1.5rem;}

.serverHosting-reason{display:flex;justify-content:center;align-items:center;}
.serverHosting-reason .circle-item{display:flex;flex-flow:column;justify-content:center;align-items:center;width:240px;height:240px;border-radius:50%;background:#125DE6;color:#fff;font-size:2rem;font-weight:500;text-align:center;margin-right:80px;}
.serverHosting-reason .circle-item em{font-size:3.6rem;font-weight:700;}
.serverHosting-reason .list-dot > li{font-size:1.6rem;color:#222;margin:3px 0;}

.webHosting-product-wrap .item-box{position:relative;display:flex;align-items:center;flex-flow:wrap;height:260px;padding:60px 80px;margin-bottom:30px;box-sizing:border-box;background:#F5F6FA;border-radius:20px;}
.webHosting-product-wrap .item-box:after{content:"";position:absolute;right:80px;top:50%;transform:translateY(-50%);width:120px;height:120px;background:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/i_webHosting_intro.png) no-repeat 0 0 / auto 100%;}
.webHosting-product-wrap .item2:after{background-position:-120px 0;}
.webHosting-product-wrap .item3:after{background-position:-240px 0;}
.webHosting-product-wrap .item4:after{background-position:-360px 0;}
.webHosting-product-wrap .item-box dl{width:100%;}
.webHosting-product-wrap .item-box dt{font-size:2.4rem;font-weight:700;margin-bottom:8px;}
.webHosting-product-wrap .item-box dd{font-size:1.6rem;color:#777;margin-bottom:24px;}
.webHosting-product-wrap .item-box a{position:relative;font-size:1.6rem;color:#125DE6;padding-right:12px;}
.webHosting-product-wrap .item-box a:after{content:"";width:6px;height:10px;background:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/go_learn.png) no-repeat 0 0 / auto 100%;position:absolute;right:0;top:50%;transform:translateY(-50%);}

.addService-package-wrap ul{display: flex;justify-content: space-between;flex-flow: wrap;}
.addService-package-wrap ul li{position: relative; width: calc(50% - 12px); border: 1px solid #ddd;border-radius: 8px;padding:34px 40px;box-sizing: border-box;margin-bottom: 24px;}
.addService-package-wrap ul li::before{content: "";position: absolute;top:50%;right:40px; transform: translateY(-50%);width:70px;height: 70px;background: url(../img/sub/ic_addService_package.png) no-repeat 0 0 / auto 100%;}
.addService-package-wrap ul li.package-item2:before{background-position: -70px 0 ;}
.addService-package-wrap ul li.package-item3:before{background-position: -140px 0 ;}
.addService-package-wrap ul li.package-item4:before{background-position: -210px 0 ;}
.addService-package-wrap ul li.package-item5:before{background-position: -280px 0 ;}
.addService-package-wrap ul li.package-item6:before{background-position: -350px 0 ;}
.addService-package-wrap ul li.package-item7:before{background-position: -420px 0 ;}
.addService-package-wrap ul li.package-item8:before{background-position: -490px 0 ;}
.addService-package-wrap ul li .title{font-size: 2.4rem; line-height: 36px;margin-bottom: 10px;font-weight:500;}
.addService-package-wrap ul li .title em{color:#125DE6;display: block;font-weight:500;}
.addService-package-wrap ul li span{color: #555;font-size: 1.6rem;line-height: 24px;}
.addService-package-wrap ul li .package-desc{opacity: 0;position: absolute;left:0;right:0;top:0;bottom:0;background-color: #125DE6;padding:40px 39px; z-index: -1;transition: all 0.2s linear;border-radius: 8px;}
.addService-package-wrap ul li .package-desc p{color: #fff;font-size: 1.4rem;line-height: 20px;}
.addService-package-wrap ul li:hover .package-desc{opacity: 1;z-index: 1;}

.addService-product-wrap ul{display:flex;justify-content:space-between;}
.addService-product-wrap ul li{position:relative;display:flex;flex-flow:column;justify-content:center;align-items:center; width:25%;}
.addService-product-wrap ul li:before{content:"";width:120px;height:120px;background:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/i_additional_all.png) no-repeat 0 0 / auto 100%;}
.addService-product-wrap ul li.item2:before{background-position:-120px 0;}
.addService-product-wrap ul li.item3:before{background-position:-240px 0;}
.addService-product-wrap ul li.item4:before{background-position:-360px 0;}
.addService-product-wrap ul li.item5:before{background-position:-480px 0;}
.addService-product-wrap ul li.item6:before{background-position:-600px 0;}
.addService-product-wrap ul li.item7:before{background-position:-720px 0;}
.addService-product-wrap ul li dl{display:flex;flex-flow:column;text-align:center;}
.addService-product-wrap ul li dl dt{position:relative;padding:18px 0;font-size:2rem;font-weight:500;}
.addService-product-wrap ul li dl dt a{position:relative;margin-left:-20px;}
.addService-product-wrap ul li dl dt a:after{content:"";position:absolute;right:-20px;top:50%;transform:translateY(-50%);width:9px;height:15px;background:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/addService_dt_arr.png) no-repeat center center / auto 100%;}
.addService-product-wrap ul li dl dd{color:#777;font-size:1.4rem;}
.addService-product-wrap.type2 ul li{width:33.33%;}

.backup-service{display:flex;justify-content:space-between;align-items:center;}
.backup-service > div{position:relative;width:490px;padding-top:140px;}
.backup-service > div:before{content:"";display:block;position:absolute;left:50%;top:0;transform:translateX(-50%); width:120px;height:120px;background:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/i_additional_all.png) no-repeat 0 0 / auto 100%;}
.backup-service > .item1:before{background-position:-840px;}
.backup-service > .item2:before{background-position:-960px;}
.backup-service > .item1:after{content:"";position:absolute;right:-80px;top:0;width:1px;height:100%;background:#E5E5E5;}
.backup-service .sub-sec-title{margin-bottom:24px;}
.backup-service .bottom-btns{margin-top:24px;}
.backup-service h3{font-size:3.2rem;line-height:4.6rem;}

.service-info{text-align:center;}
.service-info > span > img{width:400px;height:100px;}
.service-info .title{font-size:3.6rem;font-weight:700;color:#fff;margin-top:20px;}
.service-info p{color:#B7BEC8;font-size:1.4rem;}
.service-info .bottom-btns{margin-top:24px;}
.service-info .bottom-btns + p{margin-top:8px;}

/*이벤트*/
.event-wrap > div{width:940px;margin:0 auto;background:#ffffff;}
.event-wrap .event-info{width:563px;margin:0 auto;}
.event-wrap .event-info > ul > li{padding:15px 0;border-bottom:1px solid #eee;}
.event-wrap .event-info > ul > li:first-of-type{padding-top:0;}
.event-wrap .event-info > ul > li:last-of-type{border:0;padding-bottom:32px;}
.event-wrap .info-list{display:flex;}
.event-wrap .info-list .info-title{width:124px;flex-shrink:0;}
.event-wrap .info-list .info-title strong{font-size:1.6rem;color:#125DE6;}
.event-wrap .info-list .info-title strong.info-title-th{display:flex;width:59px;letter-spacing:29px;overflow:hidden;white-space:nowrap;}
.event-wrap .info-list .info-con{width:100%;color:#555;font-size:1.4rem;}
.event-wrap .info-list .info-con .list-dot{margin-left:-10px;}
.event-wrap .info-list .info-con .list-dot li{line-height:24px;letter-spacing:-0.3px;margin:0;color:#555;}
.event-wrap .info-list .info-con .gift-wrap{display:flex;align-items:center;height:68px;margin-bottom:6px; background:#F5F6FA;border-radius:6px;}
.event-wrap .info-list .info-con .gift-wrap span{display:block;width:92px;text-align:center;}
.event-wrap .info-list .info-con .gift-wrap p{line-height:20px;}
.event-wrap .event-section.event-pro{padding:36px 0 31px;background:#F5F6FA;}
.event-wrap .event-section h4{font-size:2.1rem;letter-spacing: -0.5px;color:#125DE6;margin-bottom:18px;text-align: center;}
.event-wrap .event-section.event-pro table{width:568px;margin:0 auto;border-radius: 6px;}
.event-wrap .event-section.event-pro table th{font-size:1.7rem;color:#fff;background:#125DE6;padding:7px 0;border-bottom:2px solid #F5F6FA}
.event-wrap .event-section.event-pro table th:first-child{border-top-left-radius:6px;border-right:2px solid #F5F6FA}
.event-wrap .event-section.event-pro table th:last-child{border-top-right-radius:6px;}
.event-wrap .event-section.event-pro table td{font-size:1.4rem;color:#555;padding:7px 22px;border-right:2px solid #F5F6FA;border-bottom:2px solid #F5F6FA;background:#fff;}
.event-wrap .event-section.event-pro table td:first-child{font-size:1.6rem;text-align:center;}
.event-wrap .event-section.event-pro table td:last-child{border-right:0;}
.event-wrap .event-section.event-pro table td ul li{margin-bottom:14px;}
.event-wrap .event-section.event-pro table td ul li:last-child{margin-bottom:0;}
.event-wrap .event-section.event-pro table tr:last-child td:first-child{border-bottom-left-radius:6px;}
.event-wrap .event-section.event-pro table tr:last-child td:last-child{border-bottom-right-radius:6px;}
.event-wrap .event-section .event-btn-wrap{position:relative;display: flex;justify-content: center;background:#8A6DF4;}
.event-wrap .event-section .event-btn-wrap:after{content:"";position:absolute;right:20%;bottom:0;width:138px;height:102px;background:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/202211/event_icon03.png) no-repeat 0 0;}
.event-wrap .event-section .event-btn-wrap a{position:relative;display: block;color:#fff;font-weight:700;font-size:2.1rem;padding:30px 24px 28px 0;line-height:25px;}
.event-wrap .event-section .event-btn-wrap a:after{content:"";position:absolute;right:0;top:50%;transform: translateY(-50%);width:24px;height:24px;background:url(https://static-hosting.nhn.com/imghs/cloudhost/sub/202211/event_icon_arr.png) no-repeat 0 0;}
.event-wrap .event-section.event-giude{padding:36px 0 53px;}
.event-wrap .event-section.event-giude ul{padding:0 130px 0 188px;box-sizing:border-box;}
.event-wrap .event-section.event-giude ul li{color:#555;margin:0;line-height:24px;}
.end-event{padding:200px 0;border-top:1px solid #ddd;border-bottom:1px solid #ddd;text-align:center;font-size:1.6rem;color:#555;}

/*레이어팝업 추가*/
.popup-wrap .agree-check,
.popup-wrap .agree-box-title{display: flex;justify-content: space-between;align-items: center;}
.popup-wrap .agree-box-title .btn-agree-toggle{color:#767676;}
.popup-wrap .agree-check label{height:auto;}
.popup-wrap .agree-check label>span{font-weight:normal;}
.popup-wrap .agree-box{display:none;border:1px solid #dedede;padding:8px;box-sizing:border-box;color:#767676;height:80px;overflow-y:auto;}
.popup-wrap .agree-box-wrap.active .agree-box{display:block;}

/*메인레이어팝업*/
.main.popup-wrap{align-items:inherit;padding-top:164px;}
.main.popup-wrap .popup-box{width:800px;}
.main.popup-wrap .popup-box .pop-body{padding:50px 40px 20px 40px;}
.main.popup-wrap .popup-box .pop-body .agree-check-wrap{border-top:1px solid #ddd;margin-top:20px;}
.main.popup-wrap .popup-box .close{position:absolute;right:20px;top:20px;width:20px;height:20px;background:url(https://static-hosting.nhn.com/imghs/cloudhost/main/ic-close.png) center center no-repeat;text-indent:-9999px;}

.hide{display: none;}