@charset "utf-8";
#footer{background: #e8e8e8;}
#footer_wrap{color: #636363;}
#footer_wrap .dc_text{color: #333; font-weight: 600;}
#footer_wrap a.f_call{color: #222;}

#main_gal{position:relative;}
#main_gal .banner_container{position:relative;width:100%;overflow:hidden;}
#banner_content {position:relative;width:100%; height:700px;}
#banner_content>div {position:absolute;top:0;left:0;width:100%;height:100%; overflow:hidden;}
#banner_content div.area{display:block; width:100%; height:100%;}
/*#banner_content div.area img{position: absolute;top:160px;left:50%;margin-left:-480px;width:514px;height:auto;}*/

#banner_content div.img1 {background: url('../img/main/main1.jpg') center center no-repeat ; background-size: cover;}
#banner_content div.img2 {background: url('../img/main/main2.jpg') center center no-repeat ;  background-size: cover;}
#banner_content div.img3 {background: url('../img/main/main3.jpg') center center no-repeat ;  background-size: cover;}

#main_gal .banner_container .slogan {position:absolute;top:50%;margin-top: -140px;width: 600px;left: 50%; margin-left: -580px; overflow:hidden; text-align: left; font-weight: 300; color: #fff; letter-spacing: -2px;}
#main_gal .banner_container .slogan p.p1{font-size:54px; line-height: 64px; text-shadow: 2px 2px rgba(0,0,0,0.12); font-weight: 100; letter-spacing: -2px;}
#main_gal .banner_container .slogan p.p1 .c1{ font-weight: 700;}
#main_gal .banner_container .slogan p.p2{margin-top: 35px; opacity: 0.8; letter-spacing: 0px; font-size: 20px; font-weight: 500; text-indent: 5px;}
	
#banner_nav{position:absolute;width:100px;bottom:180px;text-align:left; left: 50%; margin-left: -575px;}
#banner_nav li{display:inline-block;}
#banner_nav li a{display:inline-block;width:13px;height:13px;margin:0;overflow:hidden;padding:0;background:url(/img/main/visual_bt.png)no-repeat 0 0;text-indent:-9999px; border-radius: 8px;}
#banner_nav li a.select {background:url(/img/main/visual_bt.png)no-repeat 0 -13px;} 

.cs_bt{position: absolute ; width: 100%; text-align: center; bottom: -5px;}
.cs_bt ul{display: inline-block;}
.cs_bt ul li{float: left;}
.cs_bt ul li a{color: #fff; font-size: 19px; font-weight: 500; display: inline-block;  width:280px ; border-radius: 20px 20px 0 0; background: #22346a; height: 65px; line-height: 65px; margin:  0 3px}
.cs_bt ul li:nth-child(2) a{background: #12192e;}
.cs_bt ul li:nth-child(4) a{background: #12192e;}
.cs_bt i{display: inline-block; vertical-align: top; font-size: 19px; line-height: 65px;}

@media screen and (max-width:1260px) {
#main_gal .banner_container .slogan {top:50%;margin-top: -160px;width: 600px;left: 30px; margin-left: -0px; }
#banner_nav{position:absolute;width:100px;bottom:170px;text-align:left; left: 30px; margin-left: 0px;}

}

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

#banner_content {height:500px;}
#banner_content div.img1 {background: url('../img/main/main1.jpg') 55% center no-repeat; background-size: cover;}
#banner_content div.img2 {background: url('../img/main/main2.jpg') 55% center no-repeat;  background-size: cover;}
#banner_content div.img3 {background: url('../img/main/main3.jpg') 55% center no-repeat;  background-size: cover;}
#main_gal .banner_container .slogan {top:50%;margin-top: -110px;  width: 100%; padding: 0 25px; left: 0;}
#main_gal .banner_container .slogan p.p1{font-size:40px; line-height: 46px;  }
#main_gal .banner_container .slogan p.p2{margin-top: 20px;}
#banner_nav{left: 25px; bottom: 120px;}



.cs_bt ul li a{ font-size: 17px;     height:55px; line-height: 55px; margin:  0 3px; }
.cs_bt i{ font-size: 19px; line-height: 55px;}

}	

@media screen and (max-width:768px) {
/*팝업창 이미지 사이즈 재설정 - 필수*/
.drag_pop{max-width:310px !important;}

#banner_content {height:400px;}
#main_gal .banner_container .slogan {margin-top: -90px; }
#main_gal .banner_container .slogan p.p1{font-size:36px; line-height: 42px;  }
#main_gal .banner_container .slogan p.p2{font-size: 16px;}
#banner_nav{left: 25px; bottom: 100px;}
#banner_nav li a{width:9px;height:9px;background:url(/img/main/visual_bt.png)no-repeat 0 0; background-size: 9px;}
#banner_nav li a.select {background:url(/img/main/visual_bt.png)no-repeat 0 -9px;  background-size: 9px;}


.cs_bt{position: absolute ; width: 100%; text-align: center; bottom: -5px;}
.cs_bt ul {display: inline-block;}
.cs_bt ul li{width:170px;   margin:  0 3px;  float: left;}
.cs_bt ul li a{ font-size: 14px; display: inline-block;  width:100% ;  height:55px; line-height: 55px; margin:  0 0%}
.cs_bt i{ font-size: 19px; line-height: 55px;}
}

@media screen and (max-width:480px) {
#banner_content {height:260px;}
#banner_content div.img1 {background: url('../img/main/main1.jpg') 35% center no-repeat; background-size: cover;}
#main_gal .banner_container .slogan {top:50%;margin-top: -65px; padding: 0 15px;}
#main_gal .banner_container .slogan p.p1{font-size:26px; line-height:32px; }
#main_gal .banner_container .slogan p.p2{ font-size: 12px;margin-top: 10px;}
#banner_nav{left: 18px; bottom: 70px;}

.cs_bt{bottom: -5px}
.cs_bt ul {}
.cs_bt ul li{width:110px;   margin:  0 2px; }
.cs_bt ul li a{ font-size: 12px;   height:43px; line-height: 43px; letter-spacing: -1px;}
.cs_bt ul li a span{display: none;}
.cs_bt i{ font-size: 15px; line-height: 43px;}
}
@media screen and (max-width:380px) {
#main_gal .banner_container .slogan p.p1{font-size:21px; line-height:28px; letter-spacing: -2px; }	
#banner_content div.img1 {background-position: 40% center;}
#banner_content div.img2 {background-position: 60% center;}
}


#bn_area{position: relative; padding-top: 50px}
#bn_area ul li{float: left; width:49%; border:1px solid #091c55;}
#bn_area ul li a{color: #fff; padding: 35px 30px; display: inline-block; width: 100%; height: 100%;}
#bn_area ul li:nth-child(1) {background: url(/img/main/bt1.jpg) no-repeat center center; margin-right: 2%; background-size: cover;}
#bn_area ul li:nth-child(2) {background: url(/img/main/bt2.jpg) no-repeat center center; background-size: cover;}
#bn_area ul li p{font-size: 24px; line-height: 28px; font-weight: 600; margin-bottom: 5px}
#bn_area ul li span{font-size: 14px; font-weight: 300; letter-spacing: 0; opacity: 0.7;}

@media screen and (max-width:768px) {
#bn_area{position: relative; padding-top: 40px}
#bn_area ul li{height: 117px;}
#bn_area ul li a{ padding:25px 20px; }
#bn_area ul li p{font-size: 20px; margin-bottom: 5px}
#bn_area ul li span{font-size: 12px; line-height:16px;  display: inline-block;}
#bn_area ul li:nth-child(1) {background: url(/img/main/bt1.jpg) no-repeat 60% center; margin-right: 2%; background-size: cover;}
#bn_area ul li:nth-child(2) {background: url(/img/main/bt2.jpg) no-repeat 60% center; background-size: cover;}
}

@media screen and (max-width:480px) {
#bn_area ul li{height: 107px;}
#bn_area ul li a{ padding:20px 15px; }
#bn_area ul li p{font-size: 20px; margin-bottom: 5px}
#bn_area ul li span{font-size: 12px; line-height:16px;  display: inline-block;}
}


.section{padding: 125px 0;}
#s1{padding-top: 80px}
#s1>div{color: #333; padding-left: 640px; min-height: 428px; background: url(/img/main/s1.jpg) no-repeat top left; padding-top: 25px;}
#s1>div .p1{font-size: 16px; font-weight: 800; letter-spacing: 0;}
#s1>div .p2{font-size:32px; line-height: 40px; font-weight: 200;  margin: 20px 0 20px; word-break: keep-all;}
#s1>div .p2 span{font-weight: 700;}
#s1>div .p3{font-size: 15px; line-height: 25px; color: #777; font-weight: 300; word-break: keep-all;}
#s1>div a{letter-spacing: 0px; display: inline-block; padding:7px 40px; border:1px solid #999; margin-top: 50px;}
#s1>div a:hover{background: #222; color: #fff; border:1px solid #222; }

@media screen and (max-width:1100px) {
#s1>div{padding-left: 500px; min-height: 428px;  padding-top: 22px; background-size: 440px;}

}

@media screen and (max-width:980px) {
#s1>div .p2{font-size:28px; line-height: 35px;  margin: 15px 0 25px;}
	}

@media screen and (max-width:768px) {
.section{padding: 60px 0;}
#s1{padding-top: 40px}
#s1>div{background: none; padding-left: 0; padding-top: 0; min-height: auto;}	
#s1>div .p1{font-size: 14px; }
#s1>div .p2{font-size:26px; line-height: 34px;  margin: 10px 0 20px;}
#s1>div .p3{font-size: 14px; line-height: 21px; }
#s1>div a{margin-top: 30px;}
}

@media screen and (max-width:480px) {
.section{padding: 40px 0;}
#s1>div .p1{font-size: 12px; }
#s1>div .p2{font-size:22px; line-height: 28px;  margin: 3px 0 12px;}
#s1>div a{margin-top: 20px; padding:5px 30px; font-size: 13px;}
}	


#s2{background:#22346a; text-align: center; background-size: cover;}
.section .tit{font-size: 46px;line-height: 46px; font-weight: 800; color: #fff; letter-spacing: 0;}
.section .s_tit{font-size: 16px; opacity: 0.7; color: #fff; font-weight: 300; margin-top: 15px; word-break: keep-all;}

#s2 ul.b1{margin-top: 50px;}
#s2 ul.b1 li{float: left; width: 33.333%; position: relative; height: 350px;}
#s2 ul.b1 li a{display: inline-block; width: 100%; height: 100%; color: #fff; }
#s2 ul.b1 li.bg1{background: #051431;}
#s2 ul.b1 li.bg2{background: #2b3f62;}
#s2 ul.b1 li.bg3{background: #112634;}

#s2 ul.b1 li .img{opacity:0.4;  width: 100%; height: 100%;}
#s2 ul.b1 li .img1{background: url(/img/main/s2_1.jpg)no-repeat center center; background-size: cover;}
#s2 ul.b1 li .img2{background: url(/img/main/s2_2.jpg)no-repeat center center; background-size: cover;}
#s2 ul.b1 li .img3{background: url(/img/main/s2_3.jpg)no-repeat center center; background-size: cover;}

#s2 ul.b1 li .txt{position: absolute; width: 100%; height: 100%; top:0; left:0;  padding:38% 10px 0;}
#s2 ul.b1 li .txt .p1{font-size: 26px; font-weight: 700;}
#s2 ul.b1 li .txt .p2{opacity: 0.8; margin-top: 15px; font-weight: 300; letter-spacing: 0;}

#s2 ul.b1 li:hover .img{opacity:0.8; }

@media screen and (max-width:1100px) {
#s2 ul.b1 li{ height: 300px;}
}

@media screen and (max-width:980px) {
#s2 ul.b1 li{ height: 280px;}
}
@media screen and (max-width:768px) {
.section .tit{font-size: 40px;line-height: 40px;}
.section .s_tit{font-size: 14px; margin-top: 10px;}

#s2 ul.b1{margin-top: 30px;}
#s2 ul.b1 li{width: 100%;  height:180px;}
#s2 ul.b1 li .img1{background: url(/img/main/s2_1m.jpg)no-repeat center center; background-size: cover;}
#s2 ul.b1 li .img2{background: url(/img/main/s2_2m.jpg)no-repeat center bottom; background-size: cover;}
#s2 ul.b1 li .img3{background: url(/img/main/s2_3m.jpg)no-repeat center bottom; background-size: cover;}

#s2 ul.b1 li .txt{position:absolute; width: 100%; height: 100%; top:0; left:0;  padding:63px 10px 0 ;}
#s2 ul.b1 li .txt .p1{font-size: 24px; }
#s2 ul.b1 li .txt .p2{ margin-top: 15px;}

}
@media screen and (max-width:480px) {
.section .tit{font-size: 32px;line-height: 32px;}
.section .s_tit{font-size: 13px; margin-top: 10px; line-height: 19px;}	

#s2 ul.b1{margin-top: 25px;}
#s2 ul.b1 li{  height:160px;}


#s2 ul.b1 li .txt{position:absolute; width: 100%; height: 100%; top:0; left:0;  padding:55px 10px 0 ;}
#s2 ul.b1 li .txt .p1{font-size: 20px; }
#s2 ul.b1 li .txt .p2{ margin-top: 12px; font-size: 13px; line-height: 18px;}

}	


#s2 ul.b2{margin-top: 55px;}
#s2 ul.b2 li{float: left; width:33.333%; padding:0 20px; position: relative;padding-left: 180px; border-right: 1px solid #3f4f88; text-align: left; }
#s2 ul.b2 li:nth-child(3){border-right: none;}

#s2 ul.b2 li img{position: absolute; top:-6px; left: 100px; width: 60px;}
#s2 ul.b2 li .p1{color: #fff; font-weight: 700; font-size: 20px; }
#s2 ul.b2 li .p2{color: #fff; font-weight: 300; margin-top: 5px; line-height: 20px; letter-spacing: 0; font-size: 13px; text-indent:2px; opacity: 0.5;}
#s2 ul.b2 li:hover .p1{color: #62c8e8; }

@media screen and (max-width:1100px) {
#s2 ul.b2 li img{ left: 60px; width: 54px;}
#s2 ul.b2 li{ padding-left: 130px; }
}


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


#s2 ul.b2 li{width: 33.333%; padding:0 10px; text-align: center; }

#s2 ul.b2 li img{ top:0px; left:0px; width: 40px; position: relative;}
#s2 ul.b2 li .p1{font-size: 18px;  margin-top: 10px;}
#s2 ul.b2 li .p2{ margin-top:4px; line-height: 19px; font-size: 12px;}
}
@media screen and (max-width:480px) {
#s2 ul.b2{margin-top: 30px;}
#s2 ul.b2 li img{ width: 35px; }
#s2 ul.b2 li .p1{font-size: 14px;  margin-top: 10px;}	
#s2 ul.b2 li .p2{display: none;}
}	


#s4{background: url(/img/main/s4_bg.jpg) no-repeat center center; background-size: cover; text-align: center; padding: 150px 0 150px; }

#s4 .tit{font-weight: 700; word-break: keep-all;}
#s4 .s_tit{line-height: 24px; margin-top: 20px;}

#s4 ul{margin-top: 50px;text-align: center;}
#s4 ul li {display: inline-block; width: 280px;margin:0 5px;  text-align: center;border:1px solid #22346a; }
#s4 ul li a{background: #fff; padding:16px 0px; color: #22346a;display: inline-block; width: 100%; height: 100%; font-size: 16px; font-weight: 500;}
#s4 ul li:nth-child(1) a{background: #22346a; color: #fff; }
#s4 ul li:hover a{opacity: 0.8;}




@media screen and (max-width:768px) {
#s4{ padding: 70px 0 60px; background-attachment: scroll;}
#s4 .tit{font-weight: 700; word-break: keep-all; font-size: 32px; line-height: 40px;}
#s4 ul{margin-top: 40px;}
#s4 ul li { width: 180px;margin:0 3px;  }
#s4 ul li a{ padding:14px 0px;  font-size: 14px; }
}
@media screen and (max-width:480px) {
#s4{ padding: 50px 0 50px;}
#s4 .tit{ font-size: 22px; line-height: 28px;}
#s4 .s_tit{line-height: 20px;}
#s4 ul{margin-top: 30px;}
#s4 ul li { width: 130px;margin:0 3px;  }
#s4 ul li a{ padding:10px 0px;  font-size: 14px; }


}	





#f_bn_wrap{background: #fff; padding: 20px 0; }
#f_bn_wrap .slick-slide{margin:0 10px;}
@media screen and (max-width:768px) {

#f_bn_wrap{ padding: 15px 0;}


}

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

#f_bn_wrap{ padding: 10px 0;}
#f_bn_wrap .slick-slide{margin:0 5px;}
	}