﻿@charset "utf-8";

#mainTop-wrap{width:100%; max-width:2000px;margin:0 auto}
.main-visual{display:flex; flex-wrap:wrap;justify-content:space-between;margin-top:125px;width:100%;padding-right:calc(50% - 750px);overflow:hidden;}
.main-visual .mainslid-wrap{position:relative;border-top-right-radius:20px;border-bottom-right-radius:20px;width:70%;overflow:hidden;}
.main-visual .visual-slid img{width:100%;display:block;}
.main-visual .visual-slid .swiper-button-next,.main-visual .visual-slid  .swiper-container-rtl .swiper-button-prev{width:27px; height:14px; background:url(/nanum/site/builder/main/sample01/img/slid-next.png)}
.main-visual .visual-slid .swiper-button-prev,.main-visual .visual-slid  .swiper-container-rtl .swiper-button-next{width:27px; height:14px; background:url(/nanum/site/builder/main/sample01/img/slid-prev.png)}
.main-visual .visual-slid .swiper-button-next,.main-visual .visual-slid .swiper-button-prev{right:30px; left:auto;top:auto; bottom:5%;margin-top:-7px}
.main-visual .visual-slid .swiper-button-prev{margin-right:50px}
.swiper-pagination-fraction{font-size:0; right:0px;bottom:22%; text-align:right; padding-right:30px; color:#fff}
.swiper-pagination-fraction span{font-size:20px}
.swiper-pagination-current{font-weight:600}
.swiper-pagination-total{margin-left:35px; position:relative;font-weight:normal;opacity:.5}
.swiper-pagination-total:before{content:''; position:absolute;width:20px; height:1px; background:#fff; left:-27px; top:50%;margin-top:-1px}
.ban-wrap{width:27%; overflow:hidden;border-radius:20px;overflow:hidden;background:#f5f5f5}
.ban-wrap .ban-slid{position:relative;}
.ban-wrap .ban-slid img{display:block;width:100%}
.swiper-container-horizontal>.swiper-pagination-bullets{bottom:auto; top:10px;text-align:right; padding-right:20px}
.ban-wrap .swiper-pagination-bullet{width:15px; height:2px; background:#fff; border-radius:0;bottom:auto; top:10px;}
.latest-wrap{position:relative;padding:25px 30px 0 30px}
.latest-wrap h2{border-bottom:2px solid #222; margin-bottom:10px; padding-bottom:5px}
.latest-wrap li{display:block; line-height:1}
.latest-wrap li a{display:inline-block; width:100%;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;overflow:hidden;border-bottom:1px dashed rgba(0,0,0,.1);padding:9px 0; color:#595959}
.latest-wrap li:nth-child(4){display:none}
.latest-wrap .btn-more{position:absolute;right:30px;top:25px; color:#999; font-size:16px}

.mainCon-wrap{width:90%; max-width:1500px; margin:0 auto}
.mainCon-wrap h2{font-size:35px;margin-top:45px}

.support-list,.cert-info{width:100%; display:flex; flex-wrap:wrap; justify-content:space-between;}
.support-list{justify-content:flex-start}
.support-list li{width:calc(100%/3 - 30px); background:#f6f6f6; margin-right:calc(90px/2)}
.support-list li:nth-child(3n){margin-right:0}
.support-list li .img{position:relative;width:100%; height:0; padding-bottom:60%;overflow:hidden}
.support-list li .img img{position:absolute; top:50%; left:0; width:100%;-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); }
.support-list li .con{padding:30px}
.support-list li .cate{font-size:16px;color:#f2971b; font-weight:500}
.support-list li .tit{font-size:24px; width:100%;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;overflow:hidden;color:#222; margin-bottom:10px}
.support-list li .txt{font-size:16px; width:100%;color:#666;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;word-wrap:break-word; line-height: 1.5em;height: 4.5em;}

.cert-info li{width:calc(100%/4 - 15px); background:#ba933b url(/nanum/site/builder/main/sample01/img/cert-bg01.png) no-repeat calc(100% - 25px) calc(100% - 25px); color:#fff}
.cert-info li{background-size:50px !important;}
.cert-info li a{display:inline-block; width:100%;}
.cert-info li a > div{padding:23px 25px; font-size:14px; font-weight:300}
.cert-info li a > div .tit{font-size:24px; font-weight:600; margin-bottom:5px}
.cert-info li a > div .txt{padding-right:70px}
.cert-info li a > div .btn{margin-top:15px;font-weight:500}
.cert-info li:nth-child(2){background:#fcbf07 url(/nanum/site/builder/main/sample01/img/cert-bg02.png) no-repeat calc(100% - 25px) calc(100% - 25px);}
.cert-info li:nth-child(3){background:#ed3699 url(/nanum/site/builder/main/sample01/img/cert-bg03.png) no-repeat calc(100% - 25px) calc(100% - 25px);}
.cert-info li:nth-child(4){background:#6bbb3c url(/nanum/site/builder/main/sample01/img/cert-bg04.png) no-repeat calc(100% - 25px) calc(100% - 25px);}

.case-wrap{position:relative;display:flex; flex-wrap:wrap; justify-content:space-between;margin-top:80px;}
.case-wrap h2{font-size:60px; line-height:1.1; font-weight:500; width:20%;margin-top:0}
.case-wrap ul{width:80%;display:flex; flex-wrap:wrap; justify-content:space-between;border-left:1px solid #ddd}
.case-wrap li{width:calc(100%/3); padding:0 20px; border-right:1px solid #ddd}
.case-wrap li .img{position:relative; width:100%; height:0; padding-bottom:64.5%;overflow:hidden}
.case-wrap li .img img{position:absolute; top:50%; left:0; width:100%;-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%);}
.case-wrap li .tit{font-weight:600; color:#222; margin:15px 0 10px 0; font-size:18px; letter-spacing:-0.5px;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;overflow:hidden;}
.case-wrap li .s-tit{display:inline-block;color:#bbb; width:100%;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;overflow:hidden;}
.case-wrap .btn-more{position:absolute; writing-mode: vertical-rl;left:0;top:160px; color:#999}


@media(max-width:1700px){
	
	.main-visual{width:100%; padding-right:5%}
	
}

@media(max-width:1500px){
	.main-visual .mainslid-wrap{width:74%;}
	.ban-wrap{width:23%}
	.latest-wrap{padding:30px; font-size:.9em}
	.latest-wrap .btn-more{right:30px;top:30px;font-size:14px}

	.cert-info li{background-size:50px !important}
	.cert-info li a > div .txt{padding-right:0px}
	.cert-info li a > div{padding:35px;font-size:15px}
	.cert-info li a > div .tit{font-size:24px}
	
	.consulting-step li > div{padding-left:0px;font-size:17px}
	.consulting-step li > div.img{width:80px;padding-left:0}
	.consulting-step li > div.img img{max-width:100%}
	
}

@media(max-width:1300px){
	.latest-wrap{padding:20px; font-size:.9em}
	.latest-wrap .btn-more{right:20px;top:25px;font-size:13px}
	
	.support-list li{width:calc(100%/3 - 20px); margin-right:calc(80px/2)}
	.support-list li:nth-child(3n){margin-right:0}
	
	.cert-info li{background-size:40px !important}
	.cert-info li a > div{padding:30px;font-size:14px}
	.cert-info li a > div .tit{font-size:22px}

}


@media(max-width:1200px){
	.main-visual{margin-top:100px; padding-right:0; width:95%}
	.latest-wrap h2{font-size:18px}
	.latest-wrap {padding:15px 20px; font-size:.85em}
	.latest-wrap li a{padding:10px 0}
	.latest-wrap li:nth-child(4){display:none}
	.latest-wrap .btn-more{right:20px;top:20px;font-size:12px}
	
	.mainCon-wrap h2{font-size:30px}
	.support-list li{width:calc(100%/3 - 10px);margin-right:calc(30px/2)}
	.support-list li:nth-child(3n){margin-right:0}
	.support-list li .con{padding:20px;}
	.support-list li .tit{font-size:20px}
	.support-list li .txt{font-size:14px}

	.cert-info li{width:calc(100%/4 - 10px);background-size:30px; background-position:calc(100% - 25px) calc(100% - 25px) !important;}
	.cert-info li a > div{padding:25px;font-size:14px}
	.cert-info li a > div .tit{font-size:20px; letter-spacing:-.5px}
	
	.case-wrap{margin-top:50px}
	.case-wrap h2{font-size:30px;font-weight:600;margin-top:0; width:100%}
	.case-wrap h2 br{display:none}
	.case-wrap .btn-more{top:0px;left:auto;right:0;writing-mode:horizontal-tb}
	.case-wrap ul{width:100%;margin-top:15px}
	.case-wrap li .tit{font-size:16px}

}

@media(max-width:1100px){
	.main-visual{width:100%;max-width:100%;}
	.main-visual .mainslid-wrap{width:95%}
	.ban-wrap{width:90%;background:none; margin:50px auto 0 auto}
	.ban-wrap{display:flex; flex-wrap:wrap; justify-content:space-between;}
	.ban-wrap .ban-slid{width:calc(50% - 15px);overflow:hidden;border-radius:20px;}
	.ban-wrap .ban-slid img{width:100%}
	.ban-wrap .latest-wrap{width:calc(50% - 15px); background:#efefef; border-radius:20px; overflow:hidden; padding:35px 40px}
	.latest-wrap{font-size:1.1em}
	.latest-wrap li a{padding:12px 0}
	.latest-wrap li:nth-child(4){display:block}
	.latest-wrap .btn-more{top:45px;right:40px; font-size:14px}
	.latest-wrap h2{font-size:22px}

}


@media(max-width:1024px){
	.main-visual{margin-top:80px}
	.ban-wrap .latest-wrap{font-size:.9em; padding:30px}
	.latest-wrap .btn-more{top:25px;right:35px;}
	.ban-wrap .latest-wrap{padding:22px 35px 10px 35px}

	
	.mainCon-wrap h2{font-size:27px; margin-top:35px}
	
	.support-list{justify-content:space-between}
	.support-list li{width:calc(100%/2 - 10px);margin-right:0}
	.support-list li:nth-child(3){display:none}
	
	.cert-info li{width:calc(100%/2 - 10px);background-size:50px}
	.cert-info li:nth-child(n+3){margin-top:20px}
	.cert-info li a{height:auto;}
	.cert-info li a > div .txt{padding-right:50px}

	.case-wrap h2{margin-top:0}


}

@media(max-width:850px){

	.main-visual .mainslid-wrap{border-top-right-radius:10px;border-bottom-right-radius:10px}
	.main-visual .visual-slid .swiper-button-next, .main-visual .visual-slid .swiper-container-rtl .swiper-button-prev{background-position:100% 100%;width:20px;height:11px; background-size:cover; margin-top:-5px }
	.main-visual .visual-slid .swiper-button-prev, .main-visual .visual-slid .swiper-container-rtl .swiper-button-next{background-position:0% 0%;width:20px;height:11px; background-size:cover;margin-right:30px;margin-top:-5px }
	.main-visual .visual-slid .swiper-button-next,.main-visual .visual-slid .swiper-button-prev{bottom:3%}
	.main-visual .swiper-pagination{display:none}
	
	.ban-wrap{margin:30px auto 0 auto}
	.ban-wrap .ban-slid,.ban-wrap .latest-wrap{width:100%;}
	.ban-wrap .latest-wrap{margin-top:30px;padding-bottom:20px}
	
	.mainCon-wrap h2{font-size:24px; margin-top:30px}
	
	.support-list li{width:100%}
	.support-list li:nth-child(n+2){margin-top:10px}
	.support-list li:nth-child(3){display:block}
	.support-list li .cate,.support-list li .txt{font-size:13px}
	.support-list li .tit{font-size:18px}
	
	.cert-info li{width:100%;}
	.cert-info li:nth-child(n+2){margin-top:10px}
	.cert-info li a > div{font-size:13px}
	.cert-info li a > div .tit{font-size:18px}
	
	.case-wrap li{width:50%}
	.case-wrap li:nth-child(3){display:none}
	.case-wrap li .tit{font-size:16px}
	.case-wrap h2{margin-top:0;}
	.case-wrap .btn-more{font-size:14px}
}

@media(max-width:640px){
	.mainCon-wrap h2{font-size:20px}
	
	.case-wrap ul{border:0}
	.case-wrap li{width:100%;padding:0; border:0}
	.case-wrap li:nth-child(n+2){margin-top:20px}
	
}
