@charset "utf-8";
/* CSS Document */
@media screen and (max-width:1680px){	
body{ font-size:15px;}

}

@media screen and (max-width:1400px){

.box1{ max-width: 94%;}
.box2{}

}

@media screen and (max-width:1280px){	

}

@media screen and (max-width:1024px){

[data-aos^=fade][data-aos^=fade]{ opacity:1 !important; transform:translateZ(0) !important;}

.moAc{ text-align:center !important;}
.moAl{ text-align:left !important;}
.moBr br{ display:block !important;}

#header .gnb_wrap,
.goTop{ display:none;}

#header .inner{ justify-content: space-between;} 

.visualSlider_wrap .slogan .t1{ font-size: 1.125rem;}
.visualSlider_wrap .slogan .t2{ font-size: 2em;}
.visualSlider_wrap .slogan .t3{ font-size: 1.25em;}

.main_layout > li{  flex: 1 1 100% !important;}
.main_layout > li .p1{ padding: 0em;}
.main_con.bg1:before{ display: none;}
.main_txt .t11{ font-size: 2rem;}
.main_txt .t9 {font-size: 2rem;}
.main_txt .t8 {font-size: 1.5rem;}
.main_txt .t4{ font-size: 1.125rem;}

.visualSlider_wrap .prod-visual {/* top: 20vw; */ display: none;}
.visualSlider_wrap .prod-visual .in-wrap {width: 30vw; height: 30vw;}

#footer .info_wrap .wrap_in{ flex-direction: column-reverse;}
#contents .sub_page_menu > .box1 .dp2on{ display: none;}
#contents .sub_page_tit .sub_txt{ max-width: 90%;}

.history_tab:before{ content: ""; position: absolute; top: 50%; transform: translate(0%, -50%); left: 10%; width: 80%; height: 2px; background: #c1101c;}
.page_col > li.w2.mbw100{ width: 100%;}
.history_tab{ display: flex; align-items: center;}
.history_tab > li{ width: 33.33%;}
.history_tab > li:not(.on){ width: 25%;}
.history_tab > li + li{ margin-top: 0em;}
.page_pd{ padding: 0;}
.resize.s2.mbpb100{ padding-bottom: 100%;}
.rnd-container,
.location-con .loca-info .info-box{  flex-direction: column;}

.rnd-title-wrap .rnd-img > img{ height: 15em; width: 100%; object-fit: cover;}
#header .all_wrap .all_layer .all_inner > .wrap-bg{ width: 100%; height: 10em; }
#header .all_wrap .all_layer .all_inner > .wrap_in{ padding: 5vh 3em 3em;}

.rnd-line{ width: 100%;}
.rnd-swiper{ width: 100%;}

.rnd-swiper .swiper-slide-active > h1{ font-size: 2.85em;}
.rnd-swiper .swiper-slide{ }
#contents .sub_page_tit .sub_en .tt{ font-size: 1.675em;}
#contents .sub_page_tit .sub_tit .tt{ font-size: 3em;}
.prod-wrap .title-wrap .t1{ font-size: 2.5em;}
.prod-wrap .title-wrap .t2{ font-size: 1.3em;}

.menu-list .list > li .inner-img{ padding: 10% 0;}
.menu-list .list{ flex-direction: column;}

.prod-sub-tt > h3{ font-size: 2.35em;}
.prod-sub-tt > p{ font-size: 1.15em;}

.prod-list .list > li{ flex: 1 1 33.33%;}
.prod-list .list{ flex-wrap: wrap;}

.prod-search-wrap .wrap-in .prod-search,
.prod-search-wrap .wrap-in > button{ font-size: 1.35em;}

.case-tab-wrap {padding-bottom: 0;}
.case-tab-wrap .tab_idx > li {flex: 1; padding-bottom: 1em;}
.case-tab-wrap .tab_idx > li {flex: 1; padding-bottom: 1em; height: 4em;}
.case-tab-wrap .tab_idx > li:after {bottom: 0;}

.case-con .case-txt .txt-wrap {flex-direction: column; gap: 1.5em;}
.case-con .case-img .img-wrap {height: 35vh;}

.main_about .ico_list > li .in{ padding: .5em;}
.main_txt .t8{ font-size: 1.75em;}

.monitoring-list{ flex-direction: column; align-items: center;}
.monitoring-list .prod-box-wrap{flex-direction: row; align-items: start;}
/* .monitoring-list .communication-st .prod-box-wrap .box-inner{ height: 15em;} */
.monitoring-list .prod-box-wrap .box-inner .img-wrap:not(.single) .imgfix {height: 12rem;}
.monitoring-list > .sensor-st{ padding-bottom: 3.5em;}
.monitoring-list > .line-wrap{ height: 0px;}
.monitoring-list > li.line-wrap .svg-wrap{ transform: rotate(90deg);}
.monitoring-list .communication-st .in{ position: relative; bottom: 1.5em;}
.monitoring-list .prod-box-wrap .box-inner .img-wrap:not(.single){ width: 50%; height: 100%;}
.monitoring-list > li.line-wrap{ position: relative;}
.monitoring-list .center-arrow.m_Bleft{ position: relative; display: flex; min-width: 6.5em; transform: translateX(-13em);}
.monitoring-list .center-arrow.m_Bleft .dot-arrow{ transform: rotate(90deg);}
.monitoring-list .center-arrow.m_Bright{ position: relative; display: flex; min-width: 6.5em; transform: translateX(13em);}
.monitoring-list .center-arrow.m_Bright .dot-arrow{ transform: rotate(90deg);}
.monitoring-list .prod-box-wrap .box-inner.Tcp{ flex-direction: column;}
.monitoring-list .prod-box-wrap .box-inner.Tcp .img-wrap{ width: 100%;}
.monitoring-list > li.line-wrap.st2{ flex-direction: row;}
.main_monitoring{ padding-top: 3.5em;}
.monitoring-list > li.line-wrap.st2{ margin: 0 1em 1em 1em;} 


.prod-list .list .inner{ flex-direction: column;}
.prod-list .list .inner .prod-inner .img-wrap .resize{ padding-bottom: 30%;}
.prod-list .list > li .prod-info{ padding: 2em;}
.prod-list .list > li .prod-info .info-list{ flex-wrap: wrap;}
.prod-list .list > li .prod-info .info-list > li{ flex: 1 1 45%;}
.prod-list .list > li .prod-inner:before{ display: none;}
.prod-list .list > li .prod-info .info-list > li .info-txt .page_tt.s3{ font-size: 1em;}
.prod-list .list{ margin: 0em;}

.agency-wrap .map-container .map-inner{ flex-direction: column-reverse; }
.loc-list-wrap .loc-list > li .con-in{flex-direction: column; }
.loc-list-wrap .loc-list{ display: flex; flex-wrap: wrap; gap: 1em;}
.loc-list-wrap .loc-list > li{ flex: 1 1 48%; height: 17em;}
.loc-list-wrap .loc-list > li .con-in .txt-list > li .page_tt.s4{ font-size: 1em;}
.loc-list-wrap .loc-list > li .con-in .txt-list{ margin-top: .5em;}
.loc-list-wrap .loc-list > li .con-in .txt-list > li:before{ top: 6px;}


}

@media screen and (max-width:768px){
body{ font-size:14px;}

.main_solutions .img_list{ flex-direction: column;}
.main_solutions .img_list > li .in{ height: 15em;}
.main_con.bg2:before{ height: 80vh;}

.page_col.mbolie_col{ flex-direction: column;}
.page_col.mbolie_col > li.w1{ width: 100%; height: 15em;}
.page_col > li .p1.mbolie_gp{  padding: 0em 0 0em 9em;}
.page_col > li .p1.mbp2{ padding: 2em 0 0 0;}
.page_con.bg2:before{ width: 20vw;}
.page_con{ padding: 4em 0;}
.page_list.st1 > li .tit{ width: 12em;}

.prod_tab .tab > li{ flex: 1 1 49%;}
.prod-wrap .prod-bg{ height: 40vh; padding: 2em;}


.prod-search-wrap .wrap-in .prod-search,
.prod-search-wrap .wrap-in > button{ font-size: 1em;}
.prod-list .list > li .inner .txt-wrap > p{ font-size: 1.15em;}
.agency-wrap .agency-list > li .inner{ flex-direction: column; gap: 2em;}
.agency-wrap .left{ font-size: 1.5em;}
.agency-wrap .right .info-list > li .txt,
.agency-wrap .right .info-list > li .title{ font-size: 1.05em;}
.agency-wrap .right .info-list > li .title{ min-width: 6em;}
.w_date,
.w_hit,
.w_no{ display: none;}

.board_search .search .inp{ width: 8em;}
.board_gallery > li{ width: 50%;}

.case-con {margin-top: 1em;}
.case-tab-wrap {border-bottom: none;}
.case-tab-wrap .tab_idx {flex-wrap: wrap;}
.case-tab-wrap .tab_idx > li {flex: 1 1 33%; padding-bottom: 0;}
.case-tab-wrap .tab_idx > li > span {font-size: 1.25em;}


.monitoring-list .center-arrow.m_Bleft{ position: relative; display: flex; min-width: 6.5em; transform: translateX(-10em);}
.monitoring-list .center-arrow.m_Bright{ position: relative; display: flex; min-width: 6.5em; transform: translateX(10em);}
.main_txt .t8{ font-size: 1.45em;}
.rnd-container{ gap: 1.5em; padding: 0em;}
.case-tab-wrap .case-tab > li .page_tt.s5{ font-size: 1em;}
.case-tab-wrap .case-tab > li{ flex: 1 1 20%; margin-right: .5em;}
.case-tab-wrap .case-tab > li:last-of-type{ margin-right: 0em;}


.page_tt.s4{ font-size: 1.15em;}
.page_tt.s8{ font-size: 1.675em;}
.main_txt .t9{ font-size: 2.425em;}
.page_tt.s10 {font-size: 2.25em;}

}
@media screen and (max-width:600px){
.monitoring-list .center-arrow.m_Bleft{ position: relative; display: flex; min-width: 6.5em; transform: translateX(-7em);}
.monitoring-list .center-arrow.m_Bright{ position: relative; display: flex; min-width: 6.5em; transform: translateX(7em);}
.posi_re:before{ top: -18px; left: 17px;}

.col-wrap .field.mr10{ margin-right: 0px !important;}
.col-wrap .field.ml10{ margin-left: 0px !important;}
.col-wrap .field .label_select .input_st.ml10{ margin-left: 0px !important; margin-top: 10px !important;}
.col-wrap .at{ width: 100%;}
.sub_customer_qna.mt50{ margin-top: 0px !important;}


.rnd-title-wrap{ flex-direction: column;  align-items: flex-start !important;}
.rnd-title-wrap .rnd-title.ad_point{ width: 100%;}
}

@media screen and (max-width:460px){

#header .logo > .in img{ width: 8em;}
.visualSlider_wrap .slogan .t1{ font-size: 1.4em;}
.visualSlider_wrap .slogan .t2{ font-size: 2.15em;}
.visualSlider_wrap .slogan .t3{ font-size: 1em;}

.main_txt{ margin-bottom: 1.5em;}

.main_txt .t11{ font-size: 2.65em;}
.main_txt .t4{ font-size: 1em;}

.main_con{ padding: 3.5em 0;}

.history_wrap .his_list > li .year{ width: 4em;}
.history_wrap .his_list > li .list > li .txt{ font-size: 1em;}
#header .side_wrap{ gap: 0 1.5em;}

.location-con .loca-info .info-box{ padding: 2em; gap: 2em;}
.location-con .loca-info .info-box .info-tit{ font-size: 1.65em;}
.location-con .loca-info .info-box .info-txt{ font-size: 1.05em;}
.location-con .loca-info .info-box .contact-list > li .subway-ico{ padding: .25em .35em;}

.rnd-title-wrap .rnd-img > img{ width: 100%; object-fit: cover;}
.rnd-title-wrap .rnd-title > h3{ font-size: 2.25em;}
.rnd-right{ marign-top: 0em;}


#contents .sub_page_tit .sub_en .tt{ font-size: 1.475em;}
#contents .sub_page_tit .sub_tit .tt{ font-size: 2.5em;}
#contents .sub_page_tit .sub_txt .tt{ font-size: 1.05em;}

.prod-sub-tt > h3{ font-size: 2em;}
.prod-sub-tt > p{ font-size: 1.05em;}
.menu-list .list > li .inner-img .info-txt > h3{ font-size: 1.35em;}

#header .all_wrap .all_layer .wrap_middle .gnb > li .dp2 > li > a .tt{ font-size: 1.175em;}
#header .all_wrap .all_layer .wrap_middle .gnb > li .dp1 .tt{ font-size: 1.5em;}

.board_gallery > li{ width: 100%;}
#contents .sub_page_top{ height: 30em;}

.monitoring-list .communication-st .prod-box-wrap .box-inner{ flex-direction: column;}
.monitoring-list .prod-box-wrap .box-inner .img-wrap:not(.single){ width: 100%; height: 7em;}
.monitoring-list .prod-box-wrap .box-inner{ gap: 1.5em;}
.monitoring-list > li.line-wrap .svg-wrap svg{ width: 28px;}
.monitoring-list .communication-st .prod-box-wrap .box-inner .inner_txt{ flex-direction: column;}
.monitoring-list .center-arrow.m_Bleft{ position: relative; display: flex; min-width: 6.5em; transform: translateX(-5em);}
.monitoring-list .center-arrow.m_Bright{ position: relative; display: flex; min-width: 6.5em; transform: translateX(5em);}
.monitoring-list .prod-box-wrap .box-inner .img-wrap.single{ height: inherit;}


.page_col > li .p1.mbolie_gp{  padding: 0em 0 0em 7em;}
.location-con .loca-info .info-box .contact-list > li{ font-size: 1em;}
.location-con .loca-info .info-box .contact-list > li .subway-ico{ font-size: .75rem;}

.prod-list .list .inner .prod-inner .img-wrap .resize{ padding-bottom: 55%;}
.posi_re:before{ top: -8px; left: -1px;}


.main_txt .t9{ font-size: 1.925em;}
.monitoring-list .communication-st .prod-box-wrap .box-inner{ height: 20em;}
.board_st th, .board_st td{ font-size: .95em;}
.w_form_tit{ width: 8em;}

.rnd-title-wrap .rnd-title.ad_point{ padding: 1em;}
.rnd-title-wrap .rnd-title.ad_point .page_tt.s5{ font-size: 1em;}

.loc-list-wrap .loc-list > li .con-in .txt-list{ padding: 0.8em 0.8em 0.8em 2em;}
.loc-list-wrap .loc-list > li{ height: 15em;  padding: 1.5em; flex: 1 1 25%;}
.loc-list-wrap .loc-list > li .con-in .txt-list > li:before{ top: 6px;}
.map-in .img-sizing{ border: 1px solid #dddd; border-radius: 2em; padding: 1em; box-sizing: border-box;}
.loc-list-wrap .loc-list > li .con-in .tit .page_tt{ font-size: 1.35em;}
}

@media screen and (max-width:380px){
body{ font-size:12px;}
.monitoring-list .center-arrow.m_Bleft{ position: relative; display: flex; min-width: 6.5em; transform: translateX(-3em);}
.monitoring-list .center-arrow.m_Bright{ position: relative; display: flex; min-width: 6.5em; transform: translateX(3em);}

.main_con.bg2:before{ height: 65vh;}

}

@media screen and (max-width:320px){

}

@media screen and (max-width:280px){
body{ font-size:10px;}

}

@media all and (max-width:1024px) and (orientation:landscape){

}

@media screen and (max-device-width:1024px){

}

