@charset "utf-8";
/* CSS Document */
.PC{ display:none !important}
.PHONE{ display:block !important}

@media screen and (max-width:1024px){
body{ font-size:13px}
.box1{width:100%; max-width:95%;}
.box2{ max-width:98%}
#header .gnb_wrap{ display:none}

#header .all_wrap .gnb > li .dp1{ font-size:.875em}
#header .all_wrap .gnb > li .dp2 > li > a{ font-size:.875em}

.mainVisual_wrap .slogan .line.line1{left:15%;}
.load .mainVisual_wrap .slogan .line.line1{left:15%;}
.load .mainVisual_wrap .slogan .line.line2{width:15%;}
.mainVisual_wrap .slogan .line.line2{right:85%;}
.load .mainVisual_wrap .slogan .line.line4{width:30%;}
.mainVisual_wrap .slogan .line.line5{left:30%;}
.load .mainVisual_wrap .slogan .line.line5{left:30%;}
/*#contents .sub_visual_wrap .va_wrap{ height:17.5em}
#contents .sub_visual_wrap .slogan .tit{ font-size:1.570em}
#contents .sub_visual_wrap .sub_gnb_wrap{ bottom:2.8em}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li{ max-width:100% !important}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li > a{ height:2.5em}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li > a .va{ font-size:.875em}
#contents .sub_tab_wrap .gnb .dp3 > li > a{ font-size:.938em; padding:0 10px}
#contents .sub_tab_wrap{ margin-bottom:1.5em}
#contents .sub_tab_wrap .gnb .va_wrap{ height:50px}*/

/*#contents .doc.st1{ margin-top:-1.5em}*/
#contents .sub_visual_wrap .sub_gnb_wrap{bottom:56px;}

/*SUBPAGE*/
/*sub_cert*/
.certification .board_photo_wrap .img_resize{height:350px;}

.greetings_wrap .left{ width:100%}
.greetings_wrap .t1{ width:100%}
.greetings_wrap .right{ width:40%}


}

@media screen and (max-width:768px){
body{ font-size:13px}
.box2{ max-width:98%}
.doc .box1{ max-width:98%}
#header .gnb_wrap{ display:none}
#quick{ display:none}

/**/
.mainVisual_wrap .slick-track{ height:400px}
.mainVisual_wrap .slogan_wrap{ padding-top:8em}
.mainVisual_wrap .slogan{ padding:50px; margin-left:1.5em}
.mainVisual_wrap .slogan .t1{ padding-bottom:10px}
.mainVisual_wrap .slogan .t1 img{width:80%;}
.mainVisual_wrap .slogan .t2 img{width:80%;}
.mainVisual_wrap .slick-dots{ left:45em}

#contents .sub_visual_wrap .va_wrap{ height:17.5em}
#contents .sub_visual_wrap .slogan .tit{ font-size:1.570em}
#contents .sub_visual_wrap .sub_gnb_wrap{ bottom:40px}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li > a{ height:2.5em}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li > a .va{ font-size:.875em}
#contents .sub_tab_wrap .gnb .dp3 > li > a{ font-size:.938em; padding:0 10px}
#contents .sub_tab_wrap{ margin-bottom:1.5em}
#contents .sub_tab_wrap .gnb .va_wrap{ height:50px}

#contents .doc.st1{ margin-top:-1.5em}

#footer .menu_wrap .gnb_wrap .gnb > li .dp1{ padding:.5em; font-size:.938em}
#footer .menu_wrap .gnb_wrap .gnb > li .dp2 > li > a{ padding:.5em}

/*main*/

.main_con1 .business_wrap > ul > li .txarea > dd{min-height:69px;}

/*SUBPAGE*/
/*sub_overview*/
.overview .sec1 .overview_list li:nth-of-type(n+6){height:300px;}

/*sub_vision*/
.vision .sec1 .vision_dg .dg_mid li{padding:20px;}

/*sub_history*/
.history_area .history_lst{margin-left:100px;}

/*sub_cert*/
.certification .board_photo_wrap .img_resize{height:270px;}

.pro_wrap .pro_list3 .list01 > dt{ width:100%; font-size:1em; padding:1em 1em 0 1em}
.pro_wrap .pro_list3 .list01 > dd{ width:100%; padding:1em}
.pro_wrap .pro_list3 .list01 > dd > ul > li{ padding-right:2em}

.prod_view_wrap > ul > li .inner_box dl{min-height:200px;}
.cont_view_wrap{margin-top:6em;}


}

@media screen and (max-width:500px){
.PHONE1{display:block;}

#header .logo{ width:45%}

.mainVisual_wrap .slick-track{height:300px;}

.mainVisual_wrap .slogan{padding:0; width:95%; margin:0 auto;}
.mainVisual_wrap .slogan .t1 img{width:100%;}
.mainVisual_wrap .slogan .t2 img{width:100%;}

.mainVisual_wrap .slogan .line{display:none;}

.main_con1 .business_wrap.PHONE{position:relative; margin:0;}
.main_con1 .business_wrap > ul{width:80%; margin:0 auto;}
.main_con1 .business_wrap > ul > li .in{margin:0;}
.main_con1 .business_wrap > ul > li .prod1{background:no-repeat center/cover;}
.main_con1 .business_wrap > ul.flex-direction-nav{position:absolute; width:100%; top:50%; transform:translateY(-50%); display:flex; flex-wrap:nowrap; justify-content:space-between;}
.main_con1 .business_wrap > ul.flex-direction-nav li{width:auto;}
.main_con1 .business_wrap > ul.flex-direction-nav .bus_btn_l{width:30px; height:30px; display:block; text-align:center; line-height:30px; border:1px solid #bbb; border-radius:50%; background:#fff; color:#666;}
.main_con1 .business_wrap > ul.flex-direction-nav .bus_btn_r{width:30px; height:30px; display:block; text-align:center; line-height:30px; border:1px solid #bbb; border-radius:50%; background:#fff; color:#666;}

.customer_wrap .customer_slide .tt span{padding:10px 10px;}
.customer_wrap .customer_slide .slides li .notice_tit{margin-left:70px;}
.customer_wrap .customer_slide .slides li .notice_date{display:none;}

.main_con3 .custom_ul{display:flex; flex-wrap:wrap; justify-content:space-between;}
.main_con3 .custom_ul .li_in{width:48%; max-width:48%;}
.main_con3 .custom_ul .li_in:nth-of-type(-n+2){margin-bottom:20px;}
.main_con3 .custom_ul .li_in .con_in .con_tx_wrap .tx{min-height:69px;}

/*SUBPAGE*/
.dp1_company #contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li{width:33% !important; max-width:33% !important;}
/*sub_overview*/
.overview .sec1 .overview_list li:nth-of-type(-n+3){width:33%;}
.overview .sec1 .overview_list li:nth-of-type(n+4):nth-of-type(-n+5){width:50%;}
.overview .sec1 .overview_list li:nth-of-type(n+6){padding:20px;}

/*sub_greeting*/
.greetings .sec1 .box1 .img_box1{display:none;}
.greetings .sec1 .box1 .txt_box1{width:95%; margin:0 auto; float:none;}

/*sub_vision*/
.vision .sec1 .vision_dg .dg_mid{width:95%;}
.vision .sec1 .vision_dg .dg_mid li{border-width:5px; padding:10px;}
.vision .sec1 .vision_dg .dg_bot{width:95%;}

/*sub_history*/
.history_area .history_lst{margin-left:120px;}
.history_area .history_lst .list dt{margin-right:0;}
.history_area .history_lst .list dd{margin:0; padding:0;}
.history_area .history_lst .list dd.first{margin:0; padding:0;}
.history_area .history_lst .list dd strong{padding-right:0; min-width:0;}

/*sub_cert*/
.board_photo_wrap > li {width:50% !important;}

/*sub_location*/
.location .loc_info ul{display:flex; flex-wrap:wrap; justify-content:space-between; width:80%; margin:0 auto;}
.location .loc_info ul li{padding:0; text-align:left;}
.location .loc_info ul li:nth-of-type(1){width:100%; max-width:100%; margin-bottom:10px;}
.location .loc_info ul li:nth-of-type(n+2){width:50%; max-width:50%;}

/*sub_prod*/
.board_search select, .board_search input{ width:44% !important;}
.sub_prod_list .page_tab .tab li{width:50%; max-width:50%;}
.prod_wrap > li{width:50%;}

/*sub_inq*/
.input_st[name='tel[]'], .input_st[name='email[]']{width:26%; max-width:26%;}
.label_select select.input_st{width:30%; max-width:30%;}

.cont_view_wrap{margin-top:6em;}
.prod_view_wrap .di_wrap > li{display:block; width:100% !important;}
.prod_view_wrap .img_wrap .big{width:95%; margin:0 auto;}
.prod_view_wrap .img_wrap .small.st1{width:95%; margin:0 auto;}
.prod_view_wrap > ul > li .inner_box{width:95%; margin-left:2.5%; position:static; margin-top:2em;}
}

@media screen and (max-width:360px){
.PHONE1{display:none;}
#footer .menu_wrap{display:none;}	
#footer .link_wrap .link > li > a{margin-right:1.5em;}

/*SUBPAGE*/
/*sub_overview*/
.overview .sec1 .overview_list li:nth-of-type(n+6){height:330px;}
/*sub_vision*/
.vision .sec1 .vision_dg .dg_mid li{padding:24px;}
.vision .sec1 .vision_dg .dg_mid li img{margin-bottom:0;}
/*sub_location*/
.location .loc_info ul li span{width:24px; height:24px; line-height:24px;}
/*sub_prod*/
.board_search select, .board_search input{ width:42% !important;}
.prod_wrap > li{width:100%;}
/*sub_inq*/
.input_st[name='email[]']{width:37%; max-width:37%;}
.input_st[name='p_name']{width:80%; max-width:80%;}
.label_select select.input_st{width:80%; max-width:80%;}

}