﻿@charset "UTF-8";
.cd-vertical-nav a:before {background-color: #3966ce;}
.cd-vertical-nav a.active:before{border:2px solid #3966ce;}

#section1{position:relative;width:100%;height:1035px;margin:0 auto;text-align:center;overflow:hidden;}
#section1:before {position:absolute;content:"";display:block;top:288px;width:100%;height:450px;background:#0c5fbf;}
#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; padding-left:100px;}
.iden_txt ul li{display:block;text-align:left;font-size:50px;line-height:120%;letter-spacing:22px;font-weight:200;}
.iden_txt ul li:nth-child(2){letter-spacing:68px;}
.iden_txt ul li:nth-child(3){letter-spacing:10px;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:106px;left:570px;}
#section1 .object02{position:absolute;bottom:10px;left:660px;}
#section1 .object03{position:absolute;bottom:-50px;left:260px;}

#section2{position:relative;width:100%;margin:-100px 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 {width:65%; margin:0 auto;}
#section2 .content-wrapper .content-box .txt-box h3{color:#0c5fbf;margin-top: 180px;margin-bottom:100px;font-size:50px;line-height:120%;letter-spacing:15px;font-weight:300;text-align:center;}
#section2 .content-wrapper .content-box .txt-box span:first-child {display:block;letter-spacing:46px;margin-left:30px;}
#section2 .content-wrapper .content-box .txt-box span:first-child + span{display:block;letter-spacing:31px;margin-left:14px;}
#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:#0c5fbf;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 #0c5fbf}
#section2 .content-wrapper .style p{display:block;text-align:center;font-size:26px;font-weight:600;line-height:120%;color:#0c5fbf;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:#0c5fbf;} 
#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:-417px;right:53px;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:#0c5fbf;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_recruit.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:110px;} 
.iden_txt{width:1100px;}

#section1 .object01 img{width:80%;}
#section1 .object02 img{width:80%;}
#section1 .object01{bottom:190px;left:495px;}
#section1 .object02{bottom:120px;left:570px;}
#section1 .object03{bottom:-25px;left:210px;}

#section2 .content-wrapper .content-box .txt-box h3{margin-top: 100px;}
#section2 .content-wrapper .style ul li img{width:98%;}

}

@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 {}
#section1:before {height:600px;}
#section1 .object-box .obbox{width:95%;height:1200px;}
#section1 .object01{left:1%;bottom:22%;}
#section1 .object01 img{width:80%;}
#section1 .object02{left:22%;bottom:17%;}
#section1 .object02 img{width:80%;}
#section1 .object03{left:50%;bottom:14%}
#section1 .object03 img{width:100%;}
.bt_txt {width:90%;margin:0 auto;padding:500px 0 20px;} 


.iden_txt{width:85%;}
.iden_txt h1{width:100%;text-align:center;padding: 0 10px 0 0px;} 
.iden_txt ul {float:none;display:block;margin:180px auto 0; padding-left: 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:11px;padding-left:0px;padding-right: 10px;}
.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 h1 {}
.iden_txt ul li{font-size:34px;line-height:60%}
.iden_txt ul li:nth-child(2){letter-spacing:56px;padding-left:34px}
.iden_txt ul li:nth-child(3){letter-spacing:12px;padding-left:0px}
.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:160px;font-size:36px;letter-spacing:18px;}
#section2 .content-wrapper .content-box .txt-box h3 span:first-child {letter-spacing:44px;}
#section2 .content-wrapper .content-box .txt-box h3 span:first-child + span {letter-spacing:32px;}
#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{margin: 200px auto 50px;}
#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:60%}
#section1 .object03 img {width:80%}
#section1 .object01{bottom:-19%;left:5%}
#section1 .object02{bottom:-21%;left:9%}
#section1 .object03{bottom:-33%;left:45%}
.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}
#section2 .content-wrapper .content-box .txt-box h3{letter-spacing:4px;}
#section2 .content-wrapper .content-box .txt-box h3 span:first-child {letter-spacing:22px;}
#section2 .content-wrapper .content-box .txt-box h3 span:first-child + span {letter-spacing:13px;}

#section3{margin: 280px auto 50px;}
#section3 .object01 img{width:50%}
#section3 .object02 img{width:50%}
#section3 .object01{bottom:-380px;right:-2%;}
#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:22px;letter-spacing:32px}
.iden_txt ul li:nth-child(3){padding-left:6px;letter-spacing:4.5px}
.iden_txt ul li:nth-child(4){padding-left:10px;letter-spacing:19px}

#section1 {height:auto;min-height: 670px;}
#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:180px}
#section1 .object03 img {width:230px}
#section1 .object01{bottom:-18%;left:2%}
#section1 .object02{bottom:-0;left:59%}
#section1 .object03{bottom:-24%;left:45%}
.bt_txt {padding:90px 0 0} 

#section2{margin: 0px auto;}
#section2 .content-wrapper .content-box .txt-box {width:100%;text-align:center;padding-top:0px}
#section2 .content-wrapper .content-box .txt-box h3{font-size:28px;letter-spacing:6px; margin-top: 100px;}



#section2 .content-wrapper .content-box .txt-box h3 span:first-child {letter-spacing: 22.1px;margin-left: 15px;}
#section2 .content-wrapper .content-box .txt-box h3 span:first-child + span {letter-spacing: 14px;margin-left: 6px;}

#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:#0c5fbf;} 

#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:90%;}
#section1 .object02 img {width:90%;}
/* #section1 .object03 img {width:210px} */
#section1 .object01{top:65%;left:0;}
#section1 .object02{bottom:-19%;left:6px;}
#section1 .object03{display:none;}
.bt_txt {padding:70px 0 0} 

#section2 .content-wrapper .content-box .txt-box h3 {margin-bottom: 50px;}
#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}

}

@media screen and (max-width: 360px) {
#section2 .content-wrapper .content-box .txt-box h3 {letter-spacing: 3px;margin-top: 50px;}
#section2 .content-wrapper .content-box .txt-box h3 span:first-child {letter-spacing: 16.1px;margin-left: 12px;}
#section2 .content-wrapper .content-box .txt-box h3 span:first-child + span {letter-spacing: 10px;margin-left: 6px;}


}
