

/* sub visual */
.sub_visual_wrap{position: relative;}
.sub_visual_box { width: 100%; height: 580px; overflow: hidden; position: relative; } 
.sub_page_visual { background-repeat: no-repeat; background-position: center; background-size: cover;  height: 100%; overflow: hidden; } 

/* sub visual + pc_top_menu */
.sub_visual_box .visual_menu_wrap { padding-top: 60px; position: relative; z-index: 1111; } 
.depth_wrap { display: flex; flex-direction: row; flex-wrap: nowrap; width: 100%;margin: 0 auto; height: 100%;  max-width: 1560px;} 
.depth_wrap .depth_name { display: flex; justify-content: space-between; min-width:87px; font-size: 20px; align-items: center; height: 100%; word-break: keep-all; color: #111}  
.depth_wrap > div.home_btn {width: 70px;  } 
.depth_wrap > div.home_btn a{display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;}
.depth_wrap > div.home_btn a span{font-size: 16px; }
.depth_wrap > div { position: relative; width: 100%;} 
.depth_wrap > div::after{content: ""; display: block; width: 1px; height: 25px; background-color: #d6d6d6; position: absolute; top: 50%; right: 0;  transform: translateY(-50%);}
.depth_wrap > div.depth2::after{display: none;}
.depth_wrap > div.home_btn::before{content: ""; display: block; width: 1px; height: 50px; background-color: #ccc; position: absolute; top: 50%; left: 0;  transform: translateY(-50%);}


.depth_wrap > div.depth3 {/* display: none; *//* width: auto; */width: 100%;max-width: 250px; width: 250px;}  
.depth_wrap > div.depth3.show { display:block; } 
.depth_wrap > div
.depth_wrap > div:last-child { border-right: unset; } 
.depth_wrap > div .depth_name i {line-height: 50px; font-size: 25px;} 
.visual_menu_wrap { width: 100%;  height: 90px;  z-index: 99; display: flex; align-items: center;     border-top: 1px solid rgba(255,255,255,0.6); position: absolute; bottom: 0;} 
.visual_menu_wrap.fixed{position: fixed; top: 81px;}
.visual_menu_wrap .com_depth {   width: 100%; display: flex; height: 100%; align-items: center;} 
.visual_menu_wrap .com_depth li{padding: 0 30px; width: 100%; height: 100%; transition: all .3s;}
.visual_menu_wrap .com_depth li:hover a{color: rgba(255,255,255,1);;}
.visual_menu_wrap .com_depth li.on a{color: rgba(255,255,255,1);}
/* .visual_menu_wrap .com_depth li a.on{color: rgba(255,255,255,1); } */
.visual_menu_wrap .com_depth li a { font-size: 20px; width: 100%; height: 100%; color: rgba(255,255,255,0.6); font-weight: 300; display: flex; justify-content: center; align-items: center; text-align: center; transition: all .3s;}  


.visual_menu_wrap .com_depth.sub_depth2 li.on a{ border-top:1px solid rgba(255,255,255,1) ;}


.sub_top_list{position: absolute;  z-index: 10; max-width: 1609px; left: 50%; transform: translateX(-50%); top: 42%; width: 100%;}
.sub_top_list ul{display: flex; align-items: center; justify-content: center;}
.sub_top_list ul li{padding: 0 20px; position: relative;}
.sub_top_list ul li img{transform: translateY(-3px);}
.sub_top_list ul li h2{font-size: 1.6rem; font-weight: 300;color: #fff;}
.sub_top_list ul li::after{content: "";width: 3px; height: 3px; position: absolute;right: -5px; top: 50%; transform: translateY(-50%); display: inline-block; background-color: rgba(255,255,255,0.6); border-radius: 50%;}

.sub_top_list ul li:last-child::after{display: none;}
.sub_top_list ul li:first-child{padding-left: 0;}

.depth_wrap .second_dep.pc ul.sub_depth2 .gnb-3dep{display: none;}

.sub_page_visual1 { background-image: url(../img/sub_visual_1.jpg); } 
.sub_page_visual2 { background-image: url(../img/sub_visual_2.jpg); } 
.sub_page_visual3 { background-image: url(../img/sub_visual_3.jpg); } 
.sub_page_visual4 { background-image: url(../img/sub_visual_4.jpg); } 
 


    /* sub_visual */
    .sub_visual_txt { position: absolute; top: 55%; left: 50%; transform: translate(-50%,-50%); z-index: 10;   width: 90%; max-width: 1530px; } 
    .sub_visual_txt h2 { font-size: 72px;  font-weight: 600; color: #fff; text-align: center; } 
    /* top menu */
   .top_menu .mobile_sub_menu { display: none; } 


   /* top menu mobile */
    .depth_wrap .second_dep.mobile{display: none;}



   
    /*sub공통*/
   .sub_inner{max-width: 1560px; margin:0 auto ; width: 90%;}
   .sub_tit{ text-align: center; color: #111;  font-weight: 600;margin: 100px 0; font-size: 58px;}
    .sub_bottom{margin-bottom: 200px;}


    /*인사말*/
.greetings{}
.greetings .greetings_img{}
.greetings .greetings_img img{width: 100%; border-radius: 10px;}
.greetings .greetings_txt{margin-top: 100px;}
.greetings .greetings_txt ul{}
.greetings .greetings_txt ul li{}
.greetings .greetings_txt ul li:nth-child(1){width: 40%;}
.greetings .greetings_txt ul li:nth-child(2){    width: 56%;}
.greetings .greetings_txt ul li h2{font-size: 3.8rem; color: #333; font-weight: 600; line-height: 1.3;}
.greetings .greetings_txt ul li h2 span{display: block;}
.greetings .greetings_txt ul li div{font-size: 1.8rem; color: #454545; margin-bottom:40px ; line-height: 2;}
.greetings .greetings_txt ul li div.sign{margin-top: 70px;}
.greetings .greetings_txt ul li div.sign span{font-size: 2rem; color: #333; margin-right: 20px;}




/*연혁*/
.history-sec {display: flex;}
.history-sec .history-info-con {width: 25%;}
.history-sec .history-info-con h2 {font-size: 48px;font-weight: 800;color: var(--main-color);line-height: 1;}
.history-sec .history-wrap {padding-left: 7%;width: 100%;}
.history-list-wrap {display: flex;margin-bottom: 60px;}
.history-list-wrap .history-detail-con {position: relative;}
.history-list-wrap:first-child .history-detail-con:before {top: 10px;}
.history-list-wrap .history-detail-con:before {position: absolute;content: '';width: 1px;height: calc(100% + 60px); background: #e0e0e0;}
.history-list-wrap .history-year-con {width: 15%;}
.history-list-wrap .history-year-con .year {font-size: 28px;color: #333;font-weight: 600;line-height: 1;}
.history-list-wrap .history-detail-con dl {position: relative;padding-left: 30px;display: flex;margin-bottom: 15px;}
.history-list-wrap .history-detail-con dl:after {content: '';position: absolute;left: -3px;top: 50%;transform: translateY(-50%);width: 7px;height: 7px;border-radius: 50%;background: var(--main-color);}
.history-list-wrap .history-detail-con dt {font-size: 18px;font-weight: 800;color:var(--main-color);padding-right: 20px;}
/* .history-list-wrap .history-detail-con dl::before{content: ""; position: absolute;left: -7px;top: 50%;transform: translateY(-50%);width: 15px;height: 15px;border-radius: 50%; border: 2px solid var(--main-color);} */
.history-list-wrap .history-detail-con dl dd {font-size: 18px;color: #4e4e4e;}
.history-list-wrap .history-detail-con dl dd span{font-weight: 600; margin-right: 10px;}

/*조직도*/
.organization{}
.organization img{width: 100%;}


/*오시는길*/
.location{margin: 50px 0;}
.company_info{}
.company_info h2{font-size: 40px; border-bottom: 1px solid #ccc; display: flex; justify-content: space-between;}
.company_info h2 span{}
.company_info h2 i{color: var(--main-color); transition: all .3s;}
.company_info h2 i:hover{transform: translateY(-5px);}
.company_info .company_info_txt{}
.company_info .company_info_txt li{display: flex;margin: 20px 0;}
.company_info .company_info_txt li i{font-size: 20px;margin-right: 10px; color: var(--main-color);}
.company_info .company_info_txt li p{font-size: 20px; }
.company_info .company_info_txt li p span{font-weight: 600;display: inline-block; width: 100px;}
.company_info .company_info_txt li p em{font-style: normal;}


/*제품 리스트*/
.pro_list{flex-wrap: wrap;}
.pro_list li{width:calc(100% / 4 - 25px); margin-right: 30px;margin-bottom: 50px;}
.pro_list li:nth-child(4n){margin-right: 0;}
.pro_list li a{display: block; width: 100%; height: 100%;  border-radius: 10px; }
.pro_list li a img{width: 100%;border-radius: 10px; border: 1px solid #ccc; transition: all .3s;}
.pro_list li a p{font-size: 2rem; color: #333; text-align: center; margin-top: 20px; transition: all .3s;}
.pro_list li a p i{font-size: 2rem; margin-left: 10px;}
.pro_list li a:hover img{border: 1px solid var(--main-color);}
.pro_list li a:hover p{color: var(--main-color);}


/*제품상세*/
.pro_view_top{border-bottom: 1px solid #ccc; padding-bottom: 100px; margin-bottom: 70px;}
.pro_view_top li{}
.pro_view_top .pro_view_slide{width: 40%;}
.pro_view_top .pro_view_slide .pro_slide{}
.pro_view_top .pro_view_slide .pro_slide .swiper-slide{}
.pro_view_top .pro_view_slide .pro_slide .swiper-slide img{width: 100%;}
.pro_view_top .pro_view_slide .pro_slide .swiper-pagination{display: flex; justify-content: center; align-items: center;}
.pro_view_top .pro_view_slide .pro_slide .swiper-pagination span{width: 8px; height: 8px; margin: 0 10px;}
.pro_view_top .pro_view_slide .pro_slide .swiper-pagination .swiper-pagination-bullet-active{background-color: #fff; border: 3px solid #05137a; width: 14px; height: 14px;}



.pro_view_top .pro_view_txt{width: 50%;}
.pro_view_top .pro_view_txt h3{font-size: 3.2rem; color: #333; border-bottom: 1px solid #ccc; padding-bottom: 30px;}
.pro_view_top .pro_view_txt .pro_view_txt_box{margin-top: 30px;}
.pro_view_top .pro_view_txt .pro_view_txt_box p{font-size: 1.8rem; color: #454545; line-height: 1.8;}
.pro_view_top .pro_view_txt .pro_view_txt_box p span{}


.pro_view_btn{margin-top: 100px;}
.pro_view_btn a{ align-items: center; justify-content: center; transition: all .3s; border: 1px solid #666; border-radius: 5px; width: 35%; height: 55px;}
.pro_view_btn a span{font-size: 1.6rem; color: #666;}
.pro_view_btn a i{font-size: 2rem; color: #666; margin-left: 15px; transition: all .3s;}
.pro_view_btn a:hover{background-color: var(--main-color); border: none;}
.pro_view_btn a:hover span{ color: #fff;}
.pro_view_btn a:hover i{transform: translateX(5px); color: #fff;}
.pro_view_btn a:first-child{margin-right: 30px;}


.table_wrap .pro_view_btn{margin-top: 0;}
.table_wrap .pro_view_btn a{margin: 0 auto; width: 70%;}


.table_margin{margin-top: 120px;}
.table_wrap{}
.table_wrap table{border-top: 2px solid #ccc;}
.table_wrap table tr th{text-align: center; padding: 20px 10px; font-size: 2rem; color: #131313; border-bottom: 1px solid #ccc; font-weight: 600;border-right: 1px solid #ccc;  line-height: 1.5}
.table_wrap table tr td{text-align: center; padding: 20px 10px; font-size: 1.8rem; color: #333; border-bottom: 1px solid #ccc; border-right: 1px solid #ccc; line-height: 1.8;}
.table_wrap table tr td:last-child{border-right: none;}
.table_wrap table tr th:last-child{border-right: none;}
.table_wrap table tr td img{width: 100%;}
.table_wrap table tr td img.auto{width: auto;}
.table_wrap table tr td.bor{border-right: 1px solid #ccc;}


.pro_list_btn{margin-top: 100px; }
.pro_list_btn a{display: flex; align-items: center; justify-content: center; padding: 10px; border: 1px solid #666; border-radius: 5px; width: 240px; height: 60px; margin: 0 auto; transition: all .3s;}
.pro_list_btn a span{font-size: 1.6rem; color: #666; margin-right: 5px;}
.pro_list_btn a i{font-size: 2rem; color: #666;}
.pro_list_btn a:hover{background-color: var(--main-color); border: none;}
.pro_list_btn a:hover span{color: #fff;}
.pro_list_btn a:hover i{color: #fff;}


.pro_view_bottxt{margin-top: 120px;}
.pro_view_bottxt h3{font-size: 2rem; color: #131313; margin-bottom: 30px; font-weight: 600;}
.pro_view_bottxt p{font-size: 1.8rem; color: #333; margin-bottom: 30px;}
.pro_view_bottxt p.mar{margin-top: 40px;}






/******************************반응형********************************************/
@media (max-width: 1770px) {  
    
   
   
}

@media (max-width: 1540px) {  

     /*sub-top*/
      .sub_top_list{width: 90%;}
      .depth_wrap{width: 95%;}
   
}

@media (max-width: 1380px) {  
     .sub_tit{font-size:4.8rem ;}
     /*sub-top*/
   .sub_visual_txt h2{font-size: 60px;}
    

     /*인사말*/
     .greetings .greetings_txt ul li h2{font-size: 3.5rem;}


      /*제품*/
    .pro_view_btn a{width: 50%;}
     .pro_view_btn a:first-child{margin-right: 15px;}


}

@media (max-width: 1280px) {  
    
    /*sub-top*/
   .sub_visual_txt h2{font-size: 5rem;}
   
      /*인사말*/
     .greetings .greetings_txt ul li h2{font-size: 3.2rem;}


     /*제품*/
     .pro_view_top .pro_view_txt h3{font-size: 3rem;}
.table_wrap .pro_view_btn a{width: 100%;}



}

@media (max-width: 1080px) {  
    
     /*sub-top*/
     .sub_visual_box{height: 500px;}
     .sub_visual_txt h2{font-size: 4.8rem;}
     .depth_wrap{padding-left: 0; justify-content: center;}
     .sub_tit{font-size: 42px; }
     .visual_menu_wrap .com_depth li a{font-size: 1.8rem;}


     /*인사말*/
     .greetings .greetings_txt ul{flex-direction: column;}
     .greetings .greetings_txt{margin-top: 50px;}
     .greetings .greetings_txt ul li:nth-child(1){width: 100%; margin-bottom: 20px;}
     .greetings .greetings_txt ul li:nth-child(2){width: 100%;}
     .greetings .greetings_txt ul li h2{font-size: 3rem;}
     .greetings .greetings_txt ul li div.sign{text-align: right;}


     /*오시는길*/
     .company_info h2{font-size: 36px;}

     /*제품*/
     .pro_list li a p{font-size: 1.8rem;}
     .pro_view_top .pro_view_txt h3{font-size: 2.6rem;}
     .pro_view_btn a{width: 50%; padding: 0 5px;}
     .pro_view_btn a:first-child{margin-right: 15px;}
     .pro_list_btn a{width: 50%;}




}

@media (max-width: 800px) {  
    .sub_bottom{margin-bottom: 100px;}
    /*sub-top*/
   .sub_visual_txt h2{font-size: 40px;}
   .visual_menu_wrap .com_depth li a{font-size: 18px;}
   .sub_tit{font-size: 36px; margin: 80px 0;}

     .visual_menu_wrap{background-color: #fff;}
     .depth_wrap > div.pc{display: none;}
     .depth_wrap .second_dep.mobile{display: block; position: relative; }
     .depth_wrap{border-bottom: 1px solid #ccc;}
     .depth_wrap .second_dep.mobile ul.sub_depth2{  display: none;   }  
     .depth_wrap .second_dep.mobile ul li{  border-bottom: none;  background-color: var(--main-color); height: auto;}
     .depth_wrap .second_dep.mobile ul li a{font-size: 2rem; padding: 15px; border: none;}
     .visual_menu_wrap .com_depth li{padding: 0;}

     .depth_wrap .second_dep.mobile ul.sub_depth2 .gnb-3dep{display: none;}


     /*인사말*/
     .greetings .greetings_txt ul li h2{font-size: 2.5rem;}
     .greetings .greetings_txt ul li div{margin-bottom: 20px;}



     /*연혁*/
   .history-sec {flex-wrap: wrap;}
   .history-sec .history-info-con {width: 100%;margin-bottom: 30px;}
   .history-sec .history-info-con h2 {font-size: 28px;}
   .history-list-wrap .history-year-con {width: 25%;}
   .history-list-wrap .history-year-con .year {font-size: 18px;}
   .history-list-wrap .history-detail-con { width: 75%;}
   .history-sec .history-wrap {padding-left: 3%;width: 100%;}
   .history-list-wrap .history-detail-con dl {padding-left: 20px;}


   
     /*오시는길*/
     .company_info h2{font-size: 32px;}
     .company_info .company_info_txt li p{font-size: 18px;}


     /*제품*/
     .pro_list li{width: calc(100% / 3 - 15px); margin-right: 15px;}
     .pro_list li:nth-child(4n){margin-right: 15px;}
     .pro_list li:nth-child(3n){margin-right: 0px;}
     .pro_view_top{flex-direction: column;}
     .pro_view_top .pro_view_slide{width: 100%;}
     .pro_view_top .pro_view_txt{width: 100%; margin-top: 50px;}
     .pro_view_top .pro_view_txt h3{font-size: 2.4rem;}
     .table_wrap table tr th{font-size: 1.8rem; padding: 8px;}
     .table_wrap table tr td{padding: 8px;}
.pro_view_btn a span{line-height: 1.2;text-align: left;}
.table_wrap .pro_view_btn a{padding: 0 5px;}
   



}
@media (max-width: 650px) {  
      /*sub-top*/
    .sub_visual_txt h2{font-size: 32px;}
    .visual_menu_wrap{    height: 70px; }
    .visual_menu_wrap .com_depth{flex-wrap: wrap; justify-content: center;}
    .sub_tit{font-size: 30px; margin-bottom: 50px; }
     .depth_wrap .second_dep.mobile ul li a{font-size: 1.8rem;}
     .depth_wrap .depth_name{font-size: 1.8rem;}
  

     /*인사말*/
     .greetings .greetings_txt ul li h2{font-size: 2rem;}
     .greetings .greetings_txt ul li div.sign img{width: 90px;}



     /*오시는길*/
    .company_info h2{font-size: 28px;}
    .company_info .company_info_txt li p{font-size: 16px;}


     /*제품*/
     .pro_list{justify-content: space-between;}
     .pro_list li{width:calc(100% / 2 - 8px) ; margin-right: 0;}
     .pro_list li:nth-child(4n){margin-right: 0px;}
     .pro_view_top .pro_view_txt h3{font-size: 2.2rem;}
     .table_margin{margin-top: 100px;}
     .pro_view_bottxt h3{font-size: 1.8rem;}


   
}
@media (max-width: 480px) {  
     /*sub-top*/
    .sub_visual_txt h2{font-size: 28px;}
    .sub_tit{font-size: 24px;}
    .sub_top_list ul li h2{font-size: 1.6rem;}
  .sub_top_list ul li{padding: 0 15px;}
  .sub_top_list ul li:first-child{display: none;}
  .sub_top_list ul li:first-child::after{display: none;}
  .sub_top_list ul li:nth-child(2){padding-left: 0;}

     /*인사말*/
     .greetings .greetings_txt ul li h2{font-size: 1.8rem;}
     .greetings .greetings_txt ul li div{font-size: 1.6rem;}
     .greetings .greetings_txt ul li div.sign span{font-size: 1.8rem;}


     /*오시는길*/
     .company_info h2{font-size: 24px;}
    .company_info .company_info_txt li p em{display: block; margin-top: 5px;}


     /*제품*/
     .pro_list li a p{font-size: 1.7rem;}
     .pro_view_top .pro_view_txt h3{font-size: 2rem;}
     .pro_view_btn{margin-top: 50px; flex-direction: column;}
     .pro_view_btn a{width: 100%;}
     .pro_view_btn a:first-child{margin-right: 0;margin-bottom: 20px; }
     .pro_view_top{padding-bottom: 50px;}
     .pro_list_btn a{width: 100%;}
     .table_wrap table tr th{font-size: 1.7rem;}
     .table_wrap table tr td{font-size: 1.6rem;}
.pro_view_top .pro_view_txt .pro_view_txt_box p{font-size: 1.6rem;}
.pro_view_bottxt p{font-size: 1.6rem;}
  .pro_view_bottxt h3{font-size: 1.7rem;}


}
@media (max-width: 400px) {  
    
     /*sub-top*/
    .sub_visual_txt h2{font-size: 22px;}
    .sub_tit{font-size: 20px;}


      /*오시는길*/
     .company_info h2{font-size: 20px;}

   
     /*제품*/
     .pro_view_top .pro_view_txt h3{font-size: 1.8rem;}


}