@charset "utf-8";
/* CSS Document */
@media screen and (max-width:1680px){
#header .allWrap .all .all_gnb .gnb > li .dp1{padding:1em;}
#header .allWrap .all .all_gnb .gnb > li .dp2{padding:0 1em 1em 1em;}

#header .allWrap .all .all_gnb .gnb > li .dp1 .tt{font-size:1.125em;}
#header .allWrap .all .all_gnb .gnb > li .dp2 > li > a .tt{font-size:1.075em;}

#header .allWrap .all .all_gnb .gnb > li .dp2 > li .dp3 > li{}
#header .allWrap .all .all_gnb .gnb > li .dp2 > li .dp3 > li > a{}
#header .allWrap .all .all_gnb .gnb > li .dp2 > li .dp3 > li > a:hover{}
#header .allWrap .all .all_gnb .gnb > li .dp2 > li .dp3 > li > a .tt{font-size:.875em;}

}

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

.line .round:after { top: 7px; left: -40px;}
body{ font-size:14px;}
#footer .infoWrap > .inner{flex-direction:column;}
#footer .infoWrap .copy_wrap{padding-left:0; margin-top:1.25em;}

#footer .infoWrap .side_wrap{order:2; margin-top:2em;}
#footer .infoWrap .copy_wrap{order:3;}
}
@media screen and (max-width:1024px){

body{ font-size:13px;}
html.hidden,
html.hidden #header .headerWrap{ margin-right:0;}

#header .gnb_wrap{ display:none}
.visualSlider_wrap .mainSlogan .slogan .t1{font-size:3em;}

.main_visual_wrap .slogan{ font-size:.813em}
.main_visual_wrap .visual_line{ top:10%}
.main_visual_wrap .visual_prod .img .item{ top:60%}
.storeSlide_wrap .pagingInfo{ font-size:.75em}
.sub_tt.dot:before{top:6px;}

#header .allWrap .all .wrap_in{overflow-y:auto}
#header .allWrap .all .all_gnb{height:100%;}
#header .allWrap .all .all_gnb .gnb{flex-wrap:wrap;}
#header .allWrap .all .all_gnb .gnb > li{fleX:1 1 33.33%}

.company_wrap .circle_wrap .circle{width:10em; height:10em;}
.company_wrap .circle_wrap .circle:last-of-type{margin-left:2em;}

.monitoring > div{flex:1 1 100%;}
.monitoring .monitoring_left{text-align:center!Important; padding-right:0; width:85%; margin:0 auto;}
}

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

body{ font-size:12px;}

.monitoring > div{flex:1 1 100%;}
.monitoring .monitoring_left{padding-left:0; margin-bottom:2em;}

.sub_greeting .img_wrap{ margin-top:0}
.sub_org > li .in{ width:12em}

.pageWrap .pageCon{flex-wrap:wrap;}
.pageWrap .pageCon .tit{width:100%; margin-bottom:2.5em;}
.pageWrap .pageCon .con{flex:1 1 100%; width:100%; max-width:100%}
.ipmp_wrap.w2 > .con.con_img{flex:1 1 100%; width:100%; max-width:100%}
.main_bnList1_1 > .list > li .wrap_in:hover:before{transform:scale(1,1)}

.ipmp_wrap .ipmp_con.pro{border-right:none;}
.pageWrap .pageCon .ipmp_wrap{flex-direction:column}
.step_wrap .step_con{padding-left:0;}
.step_wrap .step_con .step{width:100%;}
.step_wrap .step_con .text{flex:1 1 100%; margin-top:1em;}
.line .round:after{left:-35px;}

.board_st.gallery .list > li { width: 50%;}

.flex.aos-init.aos-animate { display:flex;}
.num_wrap { flex-direction: row;}

.line .round:after {  left: -17px;  top: 0px;}
.pageWrap .pageCon .row{flex-direction:column;}
.main_bnList1_1 > .list > li, .main_bnList1_1 > .list > li .wrap_in{flex:1 1 100%;}

.list_tab li{flex:1 1 33.33%}

.pageWrap .pageCon .con.con_img:last-of-type{margin-top:2em;}
.sub_tt.dot{margin-bottom:1em;}
#footer .infoWrap .copy_wrap .info > li:not(.br){flex:1 1 100%;}
.num_wrap .num_con:not(:last-of-type){flex:inherit; width:20em; margin:0 auto; margin-bottom:2em;}
.num_wrap .num_con:after{display:none;}

.main_layout3 .inner > .layL{width:100%; margin-bottom:2em;}
.main_layout3 .inner > .layR{flex:inherit; width:100%; padding-left:0;}

.sub_process > li .wrap_in .line{display:none;}
.sub_process > li .wrap_in{margin-top:5em;}

.company_wrap .con .in .t1{font-size:1.65em;}
.sub_tt.t1{font-size:1.3em;}
.num_wrap.flex.wrap.ac.stepAni .flex.vc { margin-bottom: 2em;}
.num_wrap .num_con { flex: inherit;  width: 33.333%; margin: 0 auto; margin-bottom: 2em;}
.num_wrap.flex.wrap.ac.stepAni .flex.vc { margin-bottom: 0em;}
.num_wrap_1 .num_con {  flex: 1 1 33.333%;}
}

@media screen and (max-width:800px){
.num_wrap .num_con { flex: inherit;  width: 33.333%; margin: 0 auto; margin-bottom: 2em;}
.pageTbl { width:100%; overflow:auto;}
.board_st.list { white-space:nowrap; border-collapse: collapse; width:800px; }
}

@media screen and (max-width:768px){
#header .allWrap .all .all_gnb{padding-top:13em;}
#header .all_wrap .all .wrap_in{ height:100vh; overflow-y:auto}
#header .all_wrap .all .wrap_in .box0{ max-width:100%}
#header .all_wrap .all .all_gnb .gnb{ display:block}
#header .all_wrap .all .all_gnb .gnb > li::before{ width:100%; height:1px}
#header .all_wrap .all .all_gnb .gnb > li::after{ display:none}

#contents .sub_page_top{ height:30vh}
#contents .sub_tit_wrap{ padding-bottom:2em}
#contents .sub_page_top .sub_menu{ display:none;}
#contents .sub_tit_wrap .sub_nav{ margin:1em 0 0 .5em}

.visualSlider_wrap .mainSlogan .slogan .t1{font-size:2em;}
.visualSlider_wrap .mainSlogan .slogan .t2{font-size:1.125em;}
.visualSlider_wrap .mainSlogan .slogan .t2 br{display:none;}

.board_st.list td { padding: 0.25em 1em !important;}

.main_layout .inner{flex-direction:column; padding:0;}
.main_layout .inner > .layL{width:100%; max-width:100%; padding-right:0; display:flex; justify-content:space-between; align-items:center; align-content:center; margin-bottom:2em;}
.main_txt > .tit{margin-bottom:0;}
.main_layout .inner > .layR{flex:inherit; width:100%;}

.main_bnList1 > .list > li, .main_bnList1 > .list > li .wrap_in{flex:1 1 100%;}
.main_bnList1 > .list > li .wrap_in:hover:before{transform:scale(1)}

.main_more > .more{padding:.5em .85em;}

.main_layout2 .inner{flex-direction:column;}
.main_layout2 .inner > .layL{flex:inherit; width:100%; margin-bottom:2em; padding-bottom:57%;}
.main_layout2 .inner > .layR{width:100%; padding:2em 0 0 0;}

.main_visual_wrap,
.main_visual_wrap .visual,
.main_visual_wrap .visual .el{ height:60vh; max-height:50em}
.main_visual_wrap .slogan{ top:11em}
.main_visual_wrap .slogan .mark2 img{ height:5em}
.main_visual_wrap .slogan .t1{ font-size:2.75em}
.load .main_visual_wrap .visual_prod .img .item{ transform:translate(-35%, -60%) scale(0.65)}
.main_visual_wrap .visual_line{ top:1em}

.storeSlide_wrap{ padding:0 10%}
.storeSlide_wrap .pagingInfo{ left:10%; top:0}
.main_product .txt_wrap{ left:30%}


.main_about .in{ width:70%}
.main_about .in.img{ width:30%; padding-right:5%}
.main_about .in .img_z{ height:100%}

.main_certi .in{ width:70%}
.main_certi .certi_in{ padding-bottom:5em}
.main_certi .in.img{ width:30%; padding-left:5%}
.main_certi .in .img_z{ height:120%}
.main_certi .slide_wrap{ margin-top:0}
.main_certi .slide_wrap .cert_wrap{ padding:2em 3%; margin-left:0}

.main_cs .flex{ flex-direction:column}
.main_cs .in{ width:100%}
.main_cs .in .notice_box{ min-height:inherit; padding-bottom:5em}
.main_cs .in .notice_box .bd_tw{ text-align:center}
.main_cs .in .qna_box{ margin-right:0; padding:0; height:15em; margin-top:3em}
.main_cs .in .qna_box > li .in_w .t2{ line-height:1.5en; height:4.5em; overflow:hidden}

.sub_greeting .img_wrap{ width:90%; margin-bottom:2em}
.sub_greeting .con_wrap{ width:100%; order:2}

.sub_org { font-size:.625em}

.sub_history .rail,
.sub_history .line{ left:1em}
.history{ margin-left:1em}
.history > li .tit_wrap{ width:90%; padding:0 0 0 5em; box-sizing:border-box}
.history > li .tit_wrap .img{ width:50%}
.history > li .con_wrap{ width:100%; margin-top:2em}

.history > li:nth-child(2n-1) .tit_wrap{ text-align:left}
.history > li:nth-child(2n) .tit_wrap{ order:-1}
.history > li:nth-child(2n) .con_wrap .list > li:before{ right:auto; left:-4.5em;}
.history > li:nth-child(2n) .con_wrap .list > li:after{ right:auto; left:-5.25em;}
.history > li:nth-child(2n) .con_wrap .list > li{ text-align:left}
.history > li:nth-child(2n) .con_wrap .list > li .date{order:-1}

.sub_prod_list > li{ width:100%}
.subProdV_tit{ flex-wrap:wrap; text-align:center}
.subProdV_tit .logo{ width:100%;  order:-1; width:100%; margin-bottom:2em}
.subProdV_tit .t2{ text-align:left}
.subProdV_detail_sm{ padding:2em}
.subProdV_ftable > li{ width:100%}

.ipmp_wrap.w2 > .con.con_img{flex:1 1 100%; max-width:100%; margin-bottom:1.25em;}
.resize.s5{padding-bottom:45%;}
.ipmp_wrap .ipmp_con .sub_tt.t2.ac{text-align:left!Important;}
.sub_tt.ac{text-align:left!important;}
.step_wrap .step_con{padding-left:0;}

#header .allWrap .all .all_gnb .gnb > li{flex:1 1 50%; margin-bottom:1.25em;}
.sub_process{flex-direction:column;}
.sub_process > li{width:75%; margin:0 auto; }

.company_wrap .con .mt_p > .sub_tt{display:inline;}

.monitoring > div{flex-direction:column;}
.color_wrap .system{flex:inherit; width:85%; margin:0 auto; margin-bottom:2em;}
.color_wrap .system:last-of-type{margin-right:auto;}

.agree_wrap .check .flex.space{flex-direction:column; text-align:left;}
.agree_wrap .check .flex.space .mgl{margin-left:0;}
}

@media screen and (max-width:600px){
.num_wrap_1 .num_con {  flex: 1 1 50%;}

}

@media screen and (max-width:500px){
.company_wrap .circle_wrap .circle:first-of-type{}
.company_wrap .circle_wrap > p{width:100%; text-align:center; transform:rotate(90deg)!Important;}

}


@media screen and (max-width:480px){
.main_customer .main_cus > li{flex:1 1 100%; margin-bottom:1.25em;}
.main_customer .main_cus > li .con_wrap{min-height:16.5em}

.main_layout .inner > .layL{flex-direction:column; align-content:flex-start; align-items:flex-start;}
.main_more > .more{padding:1em 2em;}
.board_st.gallery .list > li { width: 100%;}

.main_product .txt_wrap{left:10%;}
#footer .infoWrap .copy_wrap .menu{display:none;}
.mainControl{display:none;}
}

@media screen and (max-width:400px){
.num_wrap.flex.wrap.ac.stepAni .flex.vc { margin-bottom: 1em;}
.num_wrap_1 .num_con {  flex: 1 1 100%;}
}

@media screen and (max-width:380px){
#header .headerWrap .logo > .in, #header .headerWrap .logo > .in img{width:9.5em;}

}

@media screen and (max-width:360px){
.list_tab li.on:before { right: 0.1em;}

}