@charset "utf-8";
/* CSS Document */

.res{ display:none}

@media screen and (max-width:1400px){
.res.h1400{ display: block}

html:not(.allOn) #header .top_wrap .etc_wrap .langBtn{ display:flex; align-items:center; gap:0 .25em; padding:.75em; border-radius:.5em .5em 0 0}
html:not(.allOn) #header .top_wrap .etc_wrap .langBtn .t1{ font-weight:700 }
html:not(.allOn) #header .top_wrap .etc_wrap .langBtn:after{ content:"\e941"; font-family:xeicon; margin-left:.25em}
html:not(.allOn) #header .top_wrap .etc_wrap .langList{ position:absolute; left:0; top:100%; width:100%; min-width:5em; box-sizing:border-box color:#fff; flex-direction:column; gap:.25em 0; box-sizing:border-box; padding:.5em; padding-top:0; background:#fff; border-radius:0 0 .5em .5em; display:none}
html:not(.allOn) #header .top_wrap .etc_wrap .langList > li{ width:100%}
html:not(.allOn) #header .top_wrap .etc_wrap .langList > li > a{ color:#111; text-align:left; padding:.25em .5em; background:#f5f5f5; border-radius:.5em; justify-content:space-between}
html:not(.allOn) #header .top_wrap .etc_wrap .langList > li > a .ico{ order:1; display:block}
html:not(.allOn) #header .top_wrap .etc_wrap .langList > li > a .ico:before{content:"\e907"}
html:not(.allOn) #header .top_wrap .etc_wrap .langList > li.on{ display:none}
html:not(.allOn) #header .top_wrap .etc_wrap .langOn .langBtn{ background:#fff; color:#111}
html:not(.allOn) #header .top_wrap .etc_wrap .langOn .langList{ display:block}

}
@media screen and (max-width:1280px){
.res.h1280{ display: block}
body{ font-size:15px}

#header .top_wrap .logo{ transform:translateY(20%)}
#header .top_wrap .etc_wrap{ margin-left:auto}
#header .top_wrap .gnb_wrap{ display:none}
#header .top_wrap .allBtn .btn{ padding:0 .5em}
#header .top_wrap .allBtn .btn .ico{ font-size:2.25em}
#header .top_wrap .allBtn .btn .ico:before{content:"\e91c"}

.allOn{ overflow-y:hidden}
.allOn #header:before{ content:""; position:fixed; left:0; top:0; width:100%; height:100%; background:#000; opacity:.7}
.allOn #header .top_wrap{ position:fixed; right:0; top:0; width:90%; max-width:30em; height:100%; overflow-y:auto; background:#fff}
.allOn #header .top_wrap .wrapIn{ flex-wrap:wrap; height:auto; padding:2em 0; gap:2em 1em}
.allOn #header .top_wrap .logo{ margin-left:1em; transform:translateY(25%)}
.allOn #header .top_wrap .logo > a img{ height:2em}
.allOn #header .top_wrap .etc_wrap .langBtn{ display:none}
.allOn #header .top_wrap .allBtn{ margin-right:1em; transform:translate(10%, -5%)}
.allOn #header .top_wrap .allBtn .btn .ico:before{content:"\e9af"}
.allOn #header .top_wrap .gnb_wrap{ display:block; order:1; width:100%; border-top:1px solid #ddd}
.allOn #header .top_wrap .gnb_wrap .gnb{ flex-direction:column}
.allOn #header .top_wrap .gnb_wrap .gnb > li{ position: relative}
.allOn #header .top_wrap .gnb_wrap .gnb > li:after{ content:""; position:absolute; left:0; top:0; width:.5em; height:100%; background:#ddd}
.allOn #header .top_wrap .gnb_wrap .gnb > li.on:after{ background:#e31e26}
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp1{ text-align:left; border-bottom:1px solid #ddd; padding:0 2em}
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp1 .va:after{ display:none}

.mainNewsSlide .el .wrap_in .con .tt{ display:none}

}
@media screen and (max-width:1024px){
body{ font-size:13px}

.visualSlide_wrap .visual_slogan .slogan{ font-size:.75em}

.visualSlide_wrap .visual_bottom{ width:100%; overflow:hidden}
.visualSlide_wrap .visual_bottom .img{ width:auto; max-width:none; height:5em; position:relative; left:50%; transform:translateX(-50%)}
.visualSlide_wrap .visual_bottom .control{ width:80%}
.wrap_hide[data-link='new']{ transform:translateY(-1em)}

.scroll .mainT { margin-top:0em;}

.inquiry_cate{ gap:.5em; justify-content:flex-start}
.inquiry_cate > li{ width:calc(33.33% - .3333em)}
.inquiry_cate > li .label .in{ padding:1.5em}
}
@media screen and (max-width:840px){

#footer{ margin-top:5em}
#contents .sub_visual .wrap_con{ height:30vh}
#contents .sub_visual .wrap_con .slogan_wrap{ font-size:.75em}
#contents .sub_visual .wrap_con .slogan_wrap .slogan .t2 br{ display:none}

.visualSlide_wrap.st1 .visualSlide .el{ height:calc(100vh - 60vw)}
.visualSlide_wrap .visual_slogan{ flex-direction:column; align-items:flex-start}
.visualSlide_wrap .paging{ flex-direction:row; margin-bottom:2.5em}
.visualSlide_wrap .visual_slogan .slogan .t1{ font-size:3em; line-height:1.1}

.mainNewsSlide_wrap .control{ margin-top:.5em}

.mainT.st1{ margin-top:-3vw}

.main_tit{ font-size:.75em}

.main_cont{ margin-top:2em}
.main_cont.gap1{ gap:1em}
.main_cont .wrap_box.w2{ width:calc(50% - .5em)}
.main_cont .wrap_box{ padding:3em 1em}

.board_news_list.d1 > li{ width:calc(50% - .5em)}
.board_news_list.d2{ gap:3em}
.board_news_list.d2 > li{ width:100%}
.board_news_list.d1 > li.allMore{ width:100%}
.allMore .board_news .img_wrap .resize{ padding:2em}

.inquiry_cate > li{ width:calc(50% - .25em)}

.form_st.st1 > li.w1{ width:100%; padding-right:0}
.form_st.st1 > li.w1:nth-child(2n){ padding-left:0}
.form_lab .lab_tit{ width:8em; margin-right:1em}


/*BOARD*/
.board_search,
.board_search .search { display: block;}
.board_search .total { justify-content: flex-start;}
.board_search .search .input_st { margin-top: 0.5em;}
.board_search .search label,
.board_search .search .grow,
.board_search .search .input_st,
.board_search .search .select,
.board_search .search .inp { width: 100%;} 
}

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

.visualSlide_wrap .visual_bottom .control { width:50%;}



}

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

.visualSlide_wrap .visual_bottom .control { width:60%;}

}

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

.main_cont .wrap_box.w2 {width: calc(100% - 0.5em); margin-bottom: 1em;}

.board_viewT.news .vTit { font-size:1.8em;}
.board_viewF { display:block;}
.board_viewF .wrap_tit { margin-bottom:1em;}

}

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

.form_lab .lab_con .grow {min-width: 18em;}

#footer .menu { display:block;}
#footer .menu .point { margin-bottom:.5em; text-align:center;}

}

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


#contents .sub_visual .wrap_con .slogan_wrap .slogan .t1 { font-size: 2.8em;}
#contents .sub_visual .wrap_con .slogan_wrap .slogan .t2 { font-size:1.2em;}

}

@media all and (orientation:landscape){

}