@charset "UTF-8";
.cd-vertical-nav a:before {background-color: #cc3300;}
.cd-vertical-nav a.active:before{border:2px solid #cc3300;}

#section1{position:relative;width:100%;margin:0 auto;text-align:center;overflow:hidden;}
#section1:before {position:absolute;content:"";display:block;top:288px;width:100%;height:450px;background:#cc3300;}
#section1 .content-wrapper{position:relative;width:100%;margin:0 auto;text-align:center;height:100%;vertical-align:top;}
.iden_txt h1{position:absolute;padding:0 10px 0 100px;top:0;left:0;text-align:left;transition:all ease 0.5s;} 
.iden_txt{position:relative;display:block;vertical-align:top;max-width:1300px;min-height:400px;margin:0 auto;text-align:center;color:#fff;overflow:hidden;margin-top:150px;}
.iden_txt ul{float:left;margin-top:230px;}
.iden_txt ul li{display:block;text-align:left;font-size:50px;line-height:120%;letter-spacing:11px;font-weight:200;}
.iden_txt ul li:nth-child(2){letter-spacing:68px;}
.iden_txt ul li:nth-child(3){letter-spacing:39px;padding-left:5px}
.iden_txt ul li:nth-child(4){letter-spacing:29px;}
.bt_txt {width:100%;padding:305px 0 20px;text-align:center;font-size:14px;color:#666;line-height:140%;} 

#section1 .object-box{position:absolute;width:100%;margin:0 auto;text-align:center;top:0;}
#section1 .object-box .obbox{position:relative;width:1100px;margin:0 auto;text-align:center;height:800px;}
#section1 .object01{position:absolute;bottom:-130px;left:390px;}
#section1 .object02{position:absolute;bottom:-80px;left:260px;}

#section2{position:relative;width:100%;margin:0 auto;text-align:center;overflow:hidden;}
#section2 .content-wrapper{position:relative;display:block;left:0;width:92%;margin:0 auto;text-align:center;vertical-align:top;}

#section2 .content-wrapper .content-box {display:block;max-width:1100px;margin:0 auto 10px;overflow:hidden;}
#section2 .content-wrapper .content-box .txt-box {float:left; width:65%;text-align:right;}
#section2 .content-wrapper .content-box .txt-box h3{color:#cc3300;margin-top:150px;font-size:50px;line-height:120%;letter-spacing:2px;font-weight:300;}
#section2 .content-wrapper .content-box .txt-box span {display:block;letter-spacing:0px;}
#section2 .content-wrapper .content-box .txt-box p {padding:20px 10px 0 0;font-size:14px;color:#666;line-height:140%;} 

#section2 .content-wrapper .content-box .object-box{float:left; width:35%;text-align:left}
#section2 .content-wrapper .content-box .object01{margin-top:150px;padding-left:50px}

#section2 .content-wrapper .style{display:block;max-width:1100px;margin:0 auto;overflow:hidden;}
#section2 .content-wrapper .style ul{padding:0;display:block;overflow:hidden;margin:20px 0 80px 0;}
#section2 .content-wrapper .style ul li{float:left;width:22%;display:table;box-sizing:border-box;margin-left:4%;font-size:13px;line-height:150%;color:#cc3300;letter-spacing:-0.5px;word-break:keep-all;word-wrap:break-word;}
#section2 .content-wrapper .style ul li:first-child {margin-left:0}
#section2 .content-wrapper .style ul li img{display:block;margin:0 auto;margin-bottom:20px;border:1px solid #cc3300}
#section2 .content-wrapper .style p{display:block;text-align:center;font-size:26px;font-weight:600;line-height:120%;color:#cc3300;letter-spacing:-2px;margin-bottom:10px}

#section3{position:relative;width:100%;margin:0 auto 50px;border-top:1px solid #e0e1e2;border-bottom:1px solid #e0e1e2;height:45vh;}
#section3 .content-wrapper{position:relative;display:block;left:0;width:100%;margin:0 auto;text-align:center;vertical-align:top;padding:30px 0 0 0;}
#section3 .content-wrapper .conbox{display:block;margin:0 auto;width:1100px;padding:40px 0 70px;overflow:hidden;}
#section3 .content-wrapper .coninfo{float:left;width:60%;word-break:keep-all;word-wrap:break-word;}
#section3 .content-wrapper .coninfo h3{display:block;color:#666;margin:0 auto;text-align:left;letter-spacing:-1px;overflow:hidden;padding:20px 0 70px 0;font-size:18px;font-weight:300;}
#section3 .content-wrapper .coninfo span{font-size:11px;display:block;text-align:left;color:#000;font-weight:400;margin-bottom:28px;}
#section3 .content-wrapper .coninfo strong{position:relative;display:block;text-align:left;color:#000;font-size:16px;font-weight:500;}
#section3 .content-wrapper .coninfo strong:before{position:absolute;content:"";display:block;top:-14px;left:0;width:27px;height:4px;background:#cc3300;} 
#section3 .content-wrapper .contact{float:left;width:40%;position:relative;margin-top:20px}

#section3 .object-box{position:absolute;width:100%;margin:0 auto;top:0;}
#section3 .object-box .obbox{position:relative;width:1100px;margin:0 auto;}
#section3 .object01{position:absolute;bottom:-420px;right:20px;z-index:100}
#section3 .object02{position:absolute;bottom:-400px;right:170px;z-index:100}
#section3 .content-wrapper .contact a{position:relative;display:block;width:212px;height:212px;background:#cc3300;border-radius:50%;font-size:14px;color:#fff;text-align:center;box-sizing:border-box;padding-top:142px}
#section3 .content-wrapper .contact a:before{position:absolute;content:"";display:block;top:75px;left:50%;margin-left:-66px;width:132px;height:37px;background:url(../img/a_server.png) no-repeat 0 0;} 
#section3 .content-wrapper .contact a:after{position:absolute;content:"";display:block;top:130px;left:50%;margin-left:-72.5px;width:145px;height:1px;background:#fff;} 

/* 반응형 */

@media screen and (max-width: 1400px) {

.iden_txt h1{padding-left:0;} 
.iden_txt{width:1100px;}

#section1 .object01 img{width:100%;}
#section1 .object02 img{width:80%;}
#section1 .object01{bottom:-20px;left:460px;}
#section1 .object02{bottom:-22px;left:380px;}

}

@media screen and (max-width: 1200px) {
	
#section2 .content-wrapper .style{width:100%;max-width:100%;}
#section2 .content-wrapper .style ul li img {width:100%;}

#section3 .content-wrapper .conbox{width:94%;margin:0 auto;}

}

@media screen and (max-width: 1100px) {

#section1 {height:auto;}
#section1:before {height:600px;}
#section1 .object-box .obbox{width:95%;height:1200px;}
#section1 .object01{left:3%;bottom:15%;}
#section1 .object01 img{width:70%;}
#section1 .object02{left:65%;bottom:16%}
#section1 .object02 img{width:70%;}
.bt_txt {width:90%;margin:0 auto;padding:500px 0 20px;} 

.iden_txt{width:85%;}
.iden_txt h1{width:100%;text-align:center;} 
.iden_txt ul {float:none;display:block;margin:180px auto 0;}
.iden_txt ul li{margin-bottom:20px;text-align:center;font-size:45px;line-height:70%}
.iden_txt ul li:nth-child(2){letter-spacing:64px;padding-left:50px}
.iden_txt ul li:nth-child(3){letter-spacing:37px;padding-left:25px}
.iden_txt ul li:nth-child(4){letter-spacing:28px;padding-left:10px}

#section2 .content-wrapper h3{margin-top:150px;}
#section2 .object01 img{width:80%;}
#section2 .object02 img{width:80%;}

#section3 .content-wrapper .coninfo{width:55%}
#section3 .content-wrapper .contact{width:45%;}
#section3 .object-box .obbox{width:95%;}

}

@media screen and (max-width: 1024px) {
		
#section1:before {height:580px;}
#section1 .object-box .obbox{width:95%;height:1150px;}
.bt_txt {padding:450px 0 20px;} 

.iden_txt{width:98%;}
.iden_txt ul li{font-size:34px;line-height:60%}
.iden_txt ul li:nth-child(2){letter-spacing:55px;padding-left:37px}
.iden_txt ul li:nth-child(3){letter-spacing:31px;padding-left:20px}
.iden_txt ul li:nth-child(4){letter-spacing:24px;padding-left:10px}

#section2{height:80vh;}
#section2 .content-wrapper p {padding-top:30px;}
#section2 .content-wrapper .content-box .txt-box h3{margin-top:120px;font-size:36px;}
#section2 .content-wrapper .content-box .txt-box h3 span {letter-spacing:1px;}
#section2 .content-wrapper .style p{font-size:22px;} 
#section2 .content-wrapper .content-box .object01{margin-top:100px;padding-left:40px}
#section2 .content-wrapper .content-box .object01 img{width:80%}

#section3 .content-wrapper .contact p {right:-8%}
#section3 .content-wrapper .contact p img {width:80%;}

#section3 .object01 img{width:80%}
#section3 .object02 img{width:80%}

}

@media screen and (max-width: 900px) {

#section1:before {height:500px;}
#section1 .object-box .obbox{height:760px;}
#section1 .object01 img {width:480px}
#section1 .object02 img {width:100px}
#section1 .object01{bottom:-15%;left:18%}
#section1 .object02{bottom:-13%;left:70%}
.bt_txt {padding:340px 0 20px;} 

#section2 .content-wrapper .style ul li{width:48%;margin-left:4%;margin-bottom:}
#section2 .content-wrapper .style ul li:nth-child(3) {margin-left:0}

#section3 .object01 img{width:50%}
#section3 .object02 img{width:50%}
#section3 .object01{bottom:-380px;right:-5%;}
#section3 .object02{bottom:-360px;right:5%;}

}


@media screen and (max-width: 640px) {

.iden_txt{margin-top:118px;}
.iden_txt ul {margin-top:100px}
.iden_txt ul li{font-size:26px;line-height:40%;letter-spacing:10px}
.iden_txt ul li:nth-child(2){padding-left:33px;letter-spacing:45px}
.iden_txt ul li:nth-child(3){padding-left:20px;letter-spacing:25px}
.iden_txt ul li:nth-child(4){padding-left:10px;letter-spacing:19px}

#section1 {height:auto}
#section1 h1 img{max-width:253px;}
#section1:before {top:180px;height:360px;}

#section1 .object-box .obbox{height:535px;}
#section1 .object01 img {width:340px}
#section1 .object02 img {width:80px}
#section1 .object01{bottom:-10%;left:18%}
#section1 .object02{bottom:-11%;left:70%}
.bt_txt {padding:90px 0 0} 

#section2 .content-wrapper .content-box .txt-box {width:100%;text-align:center;padding-top:60px}
#section2 .content-wrapper .content-box .txt-box h3{font-size:28px;letter-spacing:2px;}
#section2 .content-wrapper .content-box .txt-box h3 span {letter-spacing:1px;}

#section2 .content-wrapper .content-box .object-box{width:100%;text-align:center;}
#section2 .content-wrapper .content-box .object01{margin-top:60px;padding-right:-100px}
#section2 .content-wrapper .content-box .object01{position:absolute;top:0;right:50%;margin-right:-55px}
#section2 .content-wrapper .content-box .object01 img{width:110px;}

#section2 .content-wrapper h3{margin-top:220px;}

#section2 .content-wrapper .style ul{margin:20px 0 40px 0;}
#section2 .content-wrapper .style ul li{width:100%;float:none;display:block;margin:0 auto;margin-bottom:5px;font-size:14px}
#section2 .content-wrapper .style ul li img {width:80%;}
#section2 .content-wrapper .style ul li span {display:block;width:80%;margin:0 auto;}
#section2 .content-wrapper p {padding-top:20px}

#section3{margin:0 auto 20px;}
#section3 .content-wrapper .conbox{padding:20px 0 40px;}
#section3 .content-wrapper .coninfo{width:100%;text-align:center;}
#section3 .content-wrapper .coninfo h3{padding:0 0 20px 0;text-align:center;font-size:16px;}
#section3 .content-wrapper .coninfo span{margin-bottom:28px;text-align:center;}
#section3 .content-wrapper .coninfo strong{margin-bottom:10px;text-align:center;}
#section3 .content-wrapper .coninfo strong:before{position:absolute;content:"";display:block;top:-14px;left:48%;width:5%;height:4px;background:#cc3300;} 

#section3 .content-wrapper .contact{width:100%;}
#section3 .content-wrapper .contact a{margin:0 auto;font-size:15px;font-weight:400}
#section3 .object01{bottom:-500px;right:50%;margin-right:-240px}
#section3 .object02{bottom:-500px;right:50%;margin-right:-150px}

}

@media screen and (max-width: 480px) {

#section1:before {height:340px;}

#section1 .object-box .obbox{height:510px;}
#section1 .object01 img {width:300px}
#section1 .object02 img {width:70px}
#section1 .object01{bottom:-10%;left:10%}
#section1 .object02{bottom:-11%;left:75%}
.bt_txt {padding:70px 0 0} 

#section2 .content-wrapper .style ul li img {width:94%;}
#section2 .content-wrapper .style ul li span {width:94%;}

#section3 .object01{margin-right:-150px}
#section3 .object01 img {width:100px}

}