@charset "utf-8";
/* CSS Document */



@media screen and (max-width:1570px){
#header .gnb_wrap .gnb > li .dp1{padding:0 .8em;}
#header .gnb_wrap .gnb > li .dp1 .va{font-size:1.2em;}

}

@media screen and (max-width:1430px){
#header .gnb_wrap .gnb > li .dp1{padding:0 .5em;}
#header .gnb_wrap .gnb > li .dp1 .va{font-size:1em;}
#header .etc > li > a{width:2.5em;}

.mainNav_wrap{ display:none !important;}
#section1 .enterInfoCon1 .slides{ width:90%; margin:0 auto;}
#section1 .enterInfoCon1 .flex-direction-nav > li > a.flex-prev{ left:1%;}
#section1 .enterInfoCon1 .flex-direction-nav > li > a.flex-next{ right:1%;}
#section1 .enterInfoCon1 .el .img_wrap{ width:48% !important; margin-left:48% !important;}
#section1 .enterInfoCon1 .el .con_wrap{ width:40% !important;}
#section1 .enterInfoCon1 .flex-control-paging{ margin-top:4em !important;}
#section1 .enterInfoCon1 .el .con_wrap .no{ font-size:5em !important;}
.enterInfoCon1 .el .con_wrap .tit:after{ width:120%;}

}
@media screen and (max-width:1330px){
#header .gnb_wrap .gnb > li .dp1{padding:0; min-width:6.5em;}
#header .gnb_wrap .gnb > li .dp1 .va{font-size:.9em;}
#header .all_wrap .allBtn{margin-left:0;}

.enterInfoCon1 .el .con_wrap .tit{ font-size:1.5em;}
.enterInfoCon1 .el .con_wrap .tt{ font-size:.95em;}

}

@media screen and (max-width:1200px){
#header .gnb_wrap .gnb > li .dp1 .va{font-size:.9em;}
#header .all_wrap .allBtn{width:3.5em;}


.section{ background-size:cover !important}
}

@media screen and (max-width:1100px){
body{ font-size:15px}

.sub1_1 .img .m_img{right:90px;}
.sub1_1 .img .line_de{ display:none;}

.mainVisual .img.flex-active-slide .bg{ transform:scale(1.5,1.5) !important}
#section1 .enterInfoCon1 .slides{ width:70%;}
#section1 .enterInfoCon1 .el .img_wrap{ width:100% !important; margin-left:0 !important;}
#section1 .enterInfoCon1 .el .con_wrap{ width:100% !important; padding:1em; box-sizing:border-box; background:rgba(0,0,0,.5); height:120px; top:unset; bottom:0;}
#section1 .enterInfoCon1 .el .con_wrap .no{ font-size:3.5em !important; opacity:.4;}
.enterInfoCon1 .el .con_wrap .tit{ color:#fff;}
.enterInfoCon1 .el .con_wrap .tit:after{ width:100%; background:#fff; height:1px;}
.enterInfoCon1 .el .con_wrap .va{ margin-left:0;}
.enterInfoCon1 .el .con_wrap .tt{ display:none;}
#section1 .flex-control-nav{ width:95%; margin:0 auto;}
#section1 .enterInfoCon1 .flex-control-paging{ margin-top:2em !important;}
.enterInfoCon1 .flex-direction-nav > li > a{ width:3.5em; height:3.5em; line-height:3.5em;}
#section1 .enterInfoCon1 .flex-direction-nav > li > a.flex-next{ right:4%;}
#section1 .enterInfoCon1 .flex-direction-nav > li > a.flex-prev{ left:4%;}

.GLOBAL_N .global_txt .txt_box .tx{ font-size:.75em}

}



@media screen and (max-width:1023px){
.PC{ display:none !important}
.PHONE{ display:block !important}	
.box1{width:95%; max-width:1200px; margin:0 auto; position:relative;}
.box2{width:95%; max-width:1200px; margin:0 auto; position:relative;}

/**/
#header .all_wrap .xi-apps{ margin-left:5px; font-size:30px}

#footer .info_wrap{ padding-bottom:1em; width:100%;}
#footer .menu_wrap{ display:none;}
/**/

#contents .sub_visual_wrap .va_wrap {height:20em;}
#contents .sub_visual_wrap .slogan{ padding-top:20px;}
#contents .sub_visual_wrap .slogan .tit {font-size:1.8em;}
#contents .sub_visual_wrap .slogan .sub_slogan{ font-size:.9em;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li {max-width:16%;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li > a {height:4em;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li > a .va {font-size:.85em;}
 


}



@media screen and (max-width:920px){
.sub1_1 .img .bg_img{ width:320px; right:30px;}
.sub1_1 .img .m_img{ width:320px; right:50px;}
.sub1_1 .tx_b .tx_b_01 .eg_tx{ display:none;}

.mainVisual .img .slogan{ font-size:.750em}


.sub_history_wrap .sub_history > li .history .list .tt{ font-size:.9em;} 


#section4 .wrap_top .m_vod{ width:47%; margin-right:1%;}
#section4 .wrap_top .news_wrap{ width:31%; margin-right:1%;}
#section4 .wrap_top .content{ width:20%;}
#section4 .wrap_top .content li .ct_icon{ width:30%; margin-top:1.5em;}

.project_con .project_list li{ width:46.5%; margin:0 1.5% 20px; }
.project_con .project_list li .list_wrap .txt_con{ display: none;} 

.GLOBAL_N .main_location{ width:85% !important; margin:0 7.5% !important;}
.GLOBAL_N .global_wrap{ width:100% !important;}
.GLOBAL_N .global_txt{ float:none; width:100%;}
.GLOBAL_N .global_txt .txt_box{ display:none;}

}



@media screen and (max-width:768px){
body{ font-size:14px}
.box1{width:95%; margin:0 auto; position:relative;}

/**/
#header {}
#header .va_wrap{ height:3.8em}
#header .menu_wrap {margin-right:0;}
#header .etc > li > a {width:2.5em;}
#header .m_btn {width:2.5em;}
#header .gnb_wrap {display:none;}

.mainVisual .img .slogan{ margin:2.5em}
.mainVisual .img.flex-active-slide .slogan .line.line4{ width:30%}
.mainVisual .img .slogan .line.line5{ left:30%}

#section1 .main_tit .t1,
#section2 .main_tit .t1,
#section3 .main_tit .t1,
#section4 .main_tit .t1{ font-size:1.750em}
#section3 .wrap_top{ height:auto}
#section3 .wrap_bottom .contact{ width:100%}
#section3 .wrap_top .m_vod,
#section3 .wrap_bottom .tt_box{ display:none !important}
#section4 .root_daum_roughmap_landing{ display:none !important}
#section3 .wrap_top .news_wrap{ width:100%; height:200px}
#section3 .wrap_top .news_wrap .news_list li .in_tx{ height:31px}
#section3 .main_tit .tt_more{ margin:1em 0}
#section3 .wrap_top{ margin-top:1em}
#section4 .con4 .right,
#section4 .con4 .left{ width:100%; margin-bottom:1em}

#footer .info_wrap .logo{ display:none}
#footer .info_wrap .info{ width:100%}
#footer .info_wrap .info > li{ font-size:.750em}

/**/
.greet .left{ display:none}
.greet .right{ width:100%}
.greet .right .greet_tit{ font-size:1.570em}

.site ul li{ width:33.33% !important}

.tt_w{ width:100%; padding:1.5em}
.img_w{ width:100%; float:none;}
.img_w > img{ height:200px; width:100%}
.busi_list01.st2 > li,
.busi_list01.st4 > li{ width:100%}
.list_prod.img > li{ width:50%}
.prod_view_dv .l_dv,
.prod_view_dv .r_dv{ width:100%}
.prod_view_dv .r_dv .txt_dv{ width:100%; padding-left:0}
.board_photo_wrap > li{ width:50%}
.recruit .con2 ul li{ width:50%}

.product_equ_wrap .product_slide .item .inner .border_dv .t_img,
.product_equ_wrap .product_slide .item .inner .border_dv .t_img img{ height:220px}
.product_equ_wrap .product_slide .item .inner .border_dv{ margin:0 1em}



/**/
#contents .doc{ padding:3em 0 6em 0}
#contents .sub_tit .tit {font-size:1.3em;}
#contents .sub_visual_wrap .va_wrap {height:11em; margin-top:3em;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb {display:none;}
#contents .sub_visual_wrap .slogan {padding-top:2em;}
#contents .sub_visual_wrap .slogan .tit {font-size:1.250em;}
#contents .sub_visual_wrap .slogan .sec {margin:.8em auto;}
#contents .sub_visual_wrap .slogan .nav {font-size:.625em;}

/**/

 
.BRANCH_W .location_wrap .txt_box{ width:48%;}

.st_3 .in_txt{ right:5%; padding:2em; line-height:1.7;} 
.st_3 .in_img{ width:60%;}

.sub_history_tit .t1{ font-size:2em;}

#section1 .enterInfoCon1 .el .con_wrap{ height:90px;}
#section1 .enterInfoCon1 .el .con_wrap .no{ font-size:2.5em !important;}
#section1 .flex-control-nav{ width:70%;}
.enterInfoCon1 .el .con_wrap .tit{ font-size:1em;}

.container .t_con_box li{ width:100%; padding-left:30px; text-align:left;}
.container .t_con_box li:nth-child(even){ margin-left:0;}

.sub3_1 .sub_tbl .tbl_st tbody td,
.sub3_1 .sub_tbl .tbl_st tbody th{ font-size:.8em;}

.sub5_2 .sub_tbl .tbl_st tbody th,
.sub5_2 .sub_tbl .tbl_st tbody td{ padding:.8em; font-size:.9em;}

}


@media screen and (max-width:500px){
body{ font-size:12px}
.mainVisual .img .slogan{ font-size:.6em}

.enterInfoCon1{ margin-top:5.5em}
.pd10em{ padding-top:5em}

#section3 .wrap_bottom .contact li{ width:100%;}
#section3 .wrap_top .news_wrap{ height:auto}
#section3 .wrap_top .news_wrap .news_list li .in_tx{ height:13px;}
#section3 .wrap_top .news_wrap .news_list li{ padding:20px 0 0 0}
#section3 .wrap_bottom .contact li{ height:auto}
#section3 .wrap_bottom .contact li img{ display:none}
#section1 .main_tit .tt_more,
#section2 .main_tit .tt_more,
#section3 .main_tit .tt_more,
#section4 .main_tit .tt_more{ margin:1em 0}
#section1 .main_tit .tt_more > img,
#section2 .main_tit .tt_more > img,
#section3 .main_tit .tt_more > img,
#section4 .main_tit .tt_more > img{ height:25px}

.product_equ_wrap .product_slide .item .inner .border_dv .t_img,
.product_equ_wrap .product_slide .item .inner .border_dv .t_img img{ height:220px}
.product_equ_wrap .product_slide .item .inner .border_dv{ margin:0 5em}



}

@media screen and (max-width:460px){

#header .etc_wrap .lang .tit .tt{ font-size:.8em;}
#contents .sub_visual_wrap .slogan .sub_slogan{ font-size:.65em;}

.BRANCH_W .sub_location{ width:100%;}
.BRANCH_W .location_wrap .txt_box{ width:100%;}
.BRANCH_W .location_wrap .txt_box .tx{ min-height:150px;}

.sub_history_wrap{ padding-left:30px;}
.sub_history_wrap .sub_history > li .history:before{ left:-20px;}
.sub_history_wrap .sub_history_line{ left:13px;}
.sub_history_tit .t1{ font-size:1.5em;}

.sub1_3 .tab_idx li > a,
.sub3_1 .tab_wrap .tab_ul li > a{ font-size:.8em; padding:0 10px; height:52px; line-height:52px;}

.container .t_con_box li{ font-size:.9em;}
.container .tt02{ font-size:1em; padding-left:30px;}
.container .tt02:after{ width:25px;}

.BRANCH_W .tt02,
.sub1_4 .tt02{ font-size:1.1em;}
.BRANCH_W .tt02:after,
.sub1_4 .tt02:after{ height:18px;}

.sub1_5 .sub_tbl .tbl_st tbody th,
.sub1_5 .sub_tbl .tbl_st tbody td{ padding:1em .5em; font-size:.9em;}

.mainVisual .flex-control-nav{ display:none;}

#section1 .enterInfoCon1 .slides{ width:65%;}
#section4 .wrap_top{ display:none;}
#section4 .wrap_bottom .contact{ width:100%;}
#section4 .wrap_bottom .contact li{ float:none; margin-top:1em; width:100%; height:130px;}

.GLOBAL_N .main_location .point > li{ width:22px; height:32px; }
.GLOBAL_N .main_location .point > li .tt{ font-size:.8em;}

#scrollAni .xi-mouse{ font-size:2.5em;}

.sub_tit_wrap .tt01{ font-size:1em;}
.tt02{ font-size:1.3em;}
.tt02:after{ height:20px;}

.sub1_1 .bo_name{ font-size:.8em;}

}

@media screen and (max-width:420px){


.BRANCH_W .point li:nth-child(1){ top:24.5% !important; left:22% !important;}
.BRANCH_W .point li:nth-child(3){ top:31.5% !important; left:8% !important;}

.sub2_6 .wrap_idx .tab_idx li{ line-height:normal; padding-top:17px;}
.sub2_6 .wrap_idx .tab_idx li.noline_h,
.sub2_6 .wrap_idx .tab_idx li:nth-child(4){ padding-top:10px}

.sub1_1{ padding:0 10px;}


.m_tt{ font-size:1.8em;}
.m_tx{ font-size:.8em;}
.project_con .project_list li .list_wrap .img_con .img_in_tx{ padding:15px;}
.project_con .all_pro_btn a{ margin-top:0; padding:5px 0;}
#section4 .wrap_bottom .contact li{ height:110px;}

#section1 .enterInfoCon1 .slides{ width:100%;}
.enterInfoCon1 .flex-direction-nav > li > a{ margin:-.8em -.5em; top:unset; bottom:0; width:2em; height:2em; line-height:2em;}


}



@media screen and (max-width:360px){
#header .etc_wrap .lang .tit .tt{ font-size:.75em;}

.st_1.container .i_con_box .l_img,
.st_1.container .i_con_box .r_img,
.st_2.container .i_con_box .l_img,
.st_2.container .i_con_box .r_img,
.st_4.i_con_box,
.st_5.i_con_box,
.st_7.container .i_con_box .st_9 .s_box,
.st_7.container .con1_box.st03,
.st_7.container .con2_box.st03,
.st_7.container .con1_box,
.st_7.container .con2_box{ width:100%;}

.st_1.container .i_con_box,
.st_2.container .i_con_box,
.st_4.i_con_box,
.st_7.container .i_con_box,
.container .t_con_box{ padding-left:0;}

.st_1.container .i_con_box .l_img .in_img .pro_img{ height:270px !important;}
.st_1.container .i_con_box .r_img .in_img .pro_img{ height:170px !important;}
.st_1.container .i_con_box .r_img .in_img:nth-child(1),
.st_1.container .i_con_box .r_img .in_img:nth-child(3){ padding-left:0;}

.st_2.container .i_con_box .l_img .in_img .pro_img{ height:270px !important;}
.st_2.container .i_con_box .r_img .in_img .pro_img{ height:170px !important;}

.st_2.container .i_con_box .r_img .in_img:nth-child(2),
.st_2.container .i_con_box .r_img .in_img:nth-child(4){ padding-right:0;}

.st_5.i_con_box{ margin-top:0;}

.st_7.container .i_con_box .st_8 .r_img .in_img{ width:50% !important;}

.sub_history_tit .t1{ font-size:1.2em;}
.sub_history_wrap .sub_history > li .history .year{ font-size:1.5em;}

.BRANCH_W .sub_location .point > li .tt{ font-size:.75em;}

.tit_img_box { height:150px;}
.sub_tit_wrap{ margin:-3em auto 2em; min-height:50px; padding-top:1em;}
.sub_tit_wrap .tt01{ font-size:1em;}

.sub2_5 .wrap_idx .tab_idx{ width:100%;}
.st_3 .in_txt{ padding:1.5em; font-size:.8em;}

/*.input_st.c1,
.input_st.c2,
.input_st.c3,
.input_st.c4{ margin-bottom:10px;}*/


.project_con .project_list li .list_wrap .img_con .img_in_tx .bar{ display:none;}
.project_con .project_list{ margin-top:2em;}

#section4 .wrap_bottom .contact li{ font-size:.75em; height:95px;}

.m_tt{ font-size:1.6em;}
#scrollAni .xi-mouse{ font-size:2em;}


.enterInfoCon1 .el .con_wrap .tit{ font-size:.9em;}
.enterInfoCon1 .flex-control-paging > li > a{ height:.2em;}
#section1 .enterInfoCon1 .el .con_wrap .no{ font-size:2em !important;}
#section1 .enterInfoCon1 .el .con_wrap{ padding:.5em; height:65px;}

.sub_tit_wrap .tt01{ font-size:.8em;}

.s_txt{ font-size:.9em;}
.tt04{ font-size:.85em;}

.video_list{ padding-left:0;}
.add_con_box{padding-left:0;}

}




@media all and (orientation:landscape){

}