/* sub visual */
.sub_visual_wrap{position: relative; max-width: 1920px; margin: 0 auto;}
.sub_visual_box { width: 100%; height: 600px; overflow: hidden; position: relative; } 
.sub_page_visual { background-repeat: no-repeat; background-position: center; background-size: cover; animation: bg-active 5s; height: 100%; overflow: hidden; } 


.sub_visual_txt { position: absolute; top: 55%; left: 50%; transform: translate(-50%,-50%); z-index: 10;   width: 90%; max-width: 1400px; } 
.sub_visual_txt h2 { font-size: 72px; text-align: center;   font-weight: 500; color: #fff; margin-bottom: 10px; } 
.sub_visual_txt p{color: #fff; text-align: center; font-size: 3.6rem; font-weight: 300;}

.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_tit{font-size: 4.8rem; margin: 150px 0 30px; text-align: center;}
.sub_bottom{margin-bottom: 150px;}
.sub_inner{max-width: 1400px; margin: 0 auto;}



/*인사말*/
.greetings_top{}
.greetings_top p{font-size: 3.6rem; text-align: center; font-weight: 300; line-height: 1.3;}
.greetings_bot{position: relative; margin-top: 100px;}
.greetings_bot ul{}
.greetings_bot ul li{ }
.greetings_bot ul .greeting_left{background: url(../img/greeting_left.jpg) no-repeat; width:50%; height: 760px; background-size: cover;}
.greetings_bot ul .greeting_left h3{font-size: 6rem;color: #fff;margin: 170px 0 0 300px; font-weight:500 ;}
.greetings_bot ul .greeting_right{background-color: #ededed; padding: 80px 0 0 50px;}
.greetings_bot ul .greeting_right div{font-size: 2.4rem; margin-bottom: 30px; width: 70%; font-weight: 300; line-height: 1.4;}
.greetings_bot ul .greeting_right div:last-child{margin-bottom: 0;}
.greetings_bot ul .greeting_right div.sign{margin-top: 70px;}
.greetings_bot ul .greeting_right div.sign b{font-size: 4.8rem; margin-left: 10px; display: inline-block; transform: translateY(10px);}

.values_wrap{margin-top:180px ;}
.values{margin-top: 100px;}
.values li{width: calc(100% / 4 - 20px) !important; text-align: center;}
.values li .values_icon{width: 300px;height: 300px; background-color: #f2f5f8; border-radius: 50%; display: flex; justify-content: center; align-items: center; ; margin: 0 auto 50px;}
.values li .values_icon img{}
.values li h4{font-size: 3rem; margin-bottom: 15px; font-weight: 500;}
.values li p{font-size: 2rem; line-height: 1.3; font-weight: 300;}




/*History*/
.history_list { margin-top: 100px; } 
.ag-format-container { margin: 0 auto; position: relative; } 
 .ag-timeline_title-box { padding: 0 0 30px; 
 text-align: center; } 
 .ag-timeline_tagline { font-size: 40px; color: rgb(84, 89, 95); } 

 .ag-timeline_item { margin: 0 0 130px; display: flex; position: relative; } 

 .ag-timeline { display: inline-block; width: 100%; max-width: 100%; margin: 0 auto; 
 position: relative; } 
 .ag-timeline_line { width: 2px; background-color: #ccc; 
 position: absolute; top: 2px; left: 50%; bottom: 0; 
 overflow: hidden; 
 -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); } 
 .ag-timeline_line-progress { width: 100%; height: 20%; background-color: var(--main-color); } 
 .ag-timeline-card_box { position: relative; width: 50%; } 
 .ag-timeline_item:nth-child(2n) .ag-timeline-card_box { order: 2; } 
 .ag-timeline_item:nth-child(even) .ag-timeline-card_meta-box { padding-left: 30px; text-align: left; } 
 .ag-timeline_item:nth-child(2n) .ag-timeline-card_point-box { right: inherit; left: -4px; } 
 .ag-timeline-card_point-box { display: inline-block; position: absolute; right:0; margin-right: -5px; } 
 .ag-timeline_item:nth-child(2n) .ag-timeline-card_point-box {}
 .ag-timeline-card_point { height: 9px; width: 9px; background-color: #aaa; border-radius: 50%; } 
 .js-ag-active .ag-timeline-card_point { background-color: var(--main-color); } 
 .ag-timeline-card_meta-box { display: inline-block; width: 95%; text-align: right; } 
 .ag-timeline-card_meta { margin-top: -10px; font-size: 3.8rem; font-weight: 700; color: #000; } 
 .ag-timeline-card_item { display: inline-block; width: 50%;  position: relative; } 
 .ag-timeline_item:nth-child(2n) .ag-timeline-card_item .ag-timeline-card_info { padding-left: 0; width: 95%; text-align: right; } 

 .ag-timeline-card_arrow { height: 18px; width: 18px; margin-top: 20px; background-color: #282828; 
 z-index: -1; position: absolute; top: 0; right: 0; 
 -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } 
 .ag-timeline_item:nth-child(2n+1) .ag-timeline-card_arrow { margin-left: calc(-18px / 2); margin-right: calc(-18px / 2); } 
 .ag-timeline_item:nth-child(2n) .ag-timeline-card_arrow { margin-left: -10px; 
 right: auto; left: 0; } 
 .ag-timeline-card_img { width: 100%; } 
 .ag-timeline-card_info { padding-left: 40px; } 
 .ag-timeline-card_desc p { color: #555; font-size: 1.8rem; margin-bottom: 15px; line-height: 1.5; display: flex; font-family: var(--font-noto);}
 .ag-timeline-card_desc p:last-child{margin-bottom: 0;}
 .ag-timeline-card_desc p span{color: var(--main-color); font-weight: 600;margin: 0 10px;}
 .ag-timeline-card_title { display: none; margin: 10px 0 0; font-size: 28px; font-weight: 600;}
 .js-ag-active .ag-timeline-card_meta { color: var(--main-color); } 
.ag-timeline_item:nth-child(2n)  .ag-timeline-card_desc p {justify-content: end;}
 
 @media (min-width: 768px) and (max-width: 979px){
 .ag-format-container { width: 750px; } 
 }
 
 @media (min-width: 980px) and (max-width: 1161px){
 .ag-format-container { width: 960px; } 
 }



/*조직도*/
.organization{margin-top: 100px;}
.organization img{}



/*인증서*/
.certificate{padding: 120px 0;  border-bottom: 1px solid #bbb;}
.certificate:last-child{border-bottom: none;padding-bottom: 0;}
.certificate ul{}
.certificate ul li{text-align: center;}
.certificate ul li img{border: 1px solid #ccc;}
.certificate ul li img.thumb{width: 100%;}
.certificate_tit{font-size: 3rem; position: relative; padding-left: 20px; margin-bottom: 20px;}
.certificate_tit::before{content: ""; width: 10px;height: 10px; background-color: var(--main-color); position: absolute; top: 10px; left: 0;}

.certificate ul li p{font-family: var(--font-noto); text-align: center; font-size: 1.6rem; margin-top: 10px;}
.certificate_pop{}
.certificate_pop li{width: calc(100% / 5 - 10px) !important; margin-right: 10px; margin-bottom: 25px;}



/*오시는길*/
.location{margin-bottom: 0;}
.location_list{display: flex; flex-wrap: wrap; margin-top: 100px;}
.location_list li{width:calc(100% / 4 - 20px); margin: 0 10px; box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; border-radius: 18px; text-align: center; padding: 50px 0; display: flex; flex-direction: column; justify-content: center; }
.location_list li .loca_icon{}
.location_list li .loca_icon i{font-size: 4rem; color: var(--main-color);}
.location_list li h3{font-size: 2.2rem; margin: 20px 0;}
.location_list li p{font-size: 1.8rem;}
.location_map{margin-top: 80px;}


/*사업소개*/
.layout_wrap{margin-top: 100px;}
.layout_list{}
.layout_list li{width: calc(100% / 3 - 10px) !important; margin: 0 10px 60px 0; display: flex; align-items: center; }
.business li{padding: 50px;}
.business .business_box1{background: url(../img/business1.jpg) no-repeat; height: 460px; background-size: cover; background-position: center;}
.business .business_box2{background: url(../img/business2.jpg) no-repeat; height: 460px; background-size: cover; background-position: center;}
.business .business_box3{background: url(../img/business3.jpg) no-repeat; height: 460px; background-size: cover; background-position: center;}
.business .business_box4{background: url(../img/business4.jpg) no-repeat; height: 460px; background-size: cover; background-position: center;}
.business .business_box5{background: url(../img/business5.jpg) no-repeat; height: 460px; background-size: cover; background-position: center;}
.business .business_box6{background: url(../img/business6.jpg) no-repeat; height: 460px; background-size: cover; background-position: center;}
.layout_list li .layout_txt{color: #fff;}
.layout_list li .layout_txt h3{font-size: 3.6rem; margin-bottom: 15px; font-weight: 400;}
.layout_list li .layout_txt p{font-size: 2.2rem; position: relative; padding-left: 20px; margin-bottom: 10px; font-weight: 300;}
.layout_list li .layout_txt p::before{content: ""; width: 4px; height: 4px; background-color: #fff; position: absolute; top: 8px; left: 0;}



/*제품*/
.pro_list_category{margin-top: 100px;}
.pro_list_category ul{}
.pro_list_category ul li{width:calc(100% / 5 - 10px) ;margin-right:10px ;transition: all .3s; }
.pro_list_category ul li:last-child{margin-right: 0;}
.pro_list_category ul li a{display: block; width: 100%; height: 100%;font-size: 2.4rem;  text-align: center; padding-bottom: 15px; border-bottom: 4px solid #b9b9b9; color:#a9a9a9; font-weight: 600;}
.pro_list_category ul li:hover a{border-bottom: 4px solid #000; color: #000; opacity: 1;}
.pro_list_category ul li.on a{border-bottom: 4px solid #000; color: #000;}


.product_list{}
.product_list .product_box1{background: url(../img/product_list1.jpg) no-repeat; height: 460px; background-size: cover; background-position: center;}
.product_list .product_box2{background: url(../img/product_list2.jpg) no-repeat; height: 460px; background-size: cover; background-position: center;}
.product_list .product_box3{background: url(../img/product_list3.jpg) no-repeat; height: 460px; background-size: cover; background-position: center;}
.product_list .product_box4{background: url(../img/product_list4.jpg) no-repeat; height: 460px; background-size: cover; background-position: center;}
.product_list .product_box5{background: url(../img/product_list5.jpg) no-repeat; height: 460px; background-size: cover; background-position: center;}
.product_list .product_box6{background: url(../img/product_list6.jpg) no-repeat; height: 460px; background-size: cover; background-position: center;}
.product_list li{}
.product_list li a{display: flex;justify-content: center; align-items: center; width: 100%; height: 100%; transition: all .3s; padding: 50px;}
.product_list li a span{font-size: 3rem; margin-right: 15px; color: #fff;}
.product_list li a i{border: 1px solid #fff; font-size: 1.8rem; color: #fff;padding: 5px; border-radius: 50%; transition: all .3s;}
.product_list .layout_txt p::before{display: none; }
.product_list li .layout_txt p{padding-left: 0; font-size: 2.4rem; line-height: 1.4;}
.product_list li a:hover i{transform: translateX(10px);}



/*제품상세*/
.pro_detail{margin-top: 80px;}
.pro_detail_list{}
.pro_detail_list li{position: relative; border: 1px solid #ddd; width: calc(100% / 3 - 20px) !important; margin: 0 20px 60px 0;}
.pro_detail_list li:nth-child(3n){margin-right: 0;}
.pro_detail_list li .pro_img{}
.pro_detail_list li .pro_img img{width: 100%;}
.pro_detail_list li .pro_link{position: absolute; top: 10px; right: 10px; z-index: 10;}
.pro_detail_list li .pro_link a{}
.pro_detail_list li p{font-size: 1.8rem; border-top: 1px solid #ddd; text-align: center; background-color: #f2f5f8;padding: 20px;}










 /******************************반응형*************************************/

@media all and (max-width:1540px){
/*공통*/
   .sub_inner{width: 95%;}

  /*인사말*/
  .greetings_bot ul .greeting_left{height: 830px;  display: flex; align-items: center; justify-content: center; position: relative;}
.greetings_bot ul .greeting_left h3{margin: 0;}




}

@media all and (max-width:1380px){

/*sub-top*/
    .sub_visual_txt h2{font-size: 6.2rem;}
.sub_visual_txt p{font-size: 3.2rem;}

/*공통*/
.sub_tit{font-size: 4.5rem;}
.greetings_top p{font-size: 3.2rem;}

  /*인사말*/
  .greetings_bot ul .greeting_left h3{font-size: 5rem;}
.greetings_bot ul .greeting_right div{margin-bottom: 20px; width: 100%;}
.greetings_bot ul .greeting_right{padding: 50px;}
  .greetings_bot ul .greeting_left{height: 740px;}
.values_wrap{width: 95%;}
.values li .values_icon{width: 250px; height: 250px;}
.values li .values_icon img{width: 120px;}

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


/*인증서*/
.certificate_pop li{width: calc(100% / 4 - 10px) !important;}





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

/*sub-top*/
    .sub_visual_txt h2{font-size: 5.2rem;}
.sub_visual_txt p{font-size: 3rem;}

/*공통*/
.sub_tit{font-size: 4rem;}
.greetings_top p{font-size: 3rem;}

  /*인사말*/
  .greetings_bot ul .greeting_right div{font-size: 2.2rem;}
.greetings_bot ul .greeting_left h3{font-size: 4rem;}
.values_wrap{margin-top: 100px;}
.values li h4{font-size: 2.5rem;}
.values li p br{display: none;}

/*인증서*/
.certificate{padding: 100px 0;}
.certificate_tit{font-size: 2.8rem;}


/*사업영역*/
.layout_list li .layout_txt h3{font-size: 3.2rem;}
.layout_list li{margin: 0 10px 30px 0;}
    



}
@media all and (max-width:1080px){

   /*sub-top*/
    .sub_visual_txt h2{font-size: 4.5rem;}
.sub_visual_txt p{font-size: 2.5rem;}

/*공통*/
.sub_tit{font-size: 3.5rem;}
.greetings_top p{font-size: 2.5rem;}


  /*인사말*/
.greetings_bot ul{flex-direction: column;}
.greetings_bot ul .greeting_left{width: 100%; height: 100%; padding: 100px 0;}
.greetings_bot ul .greeting_right{width: 100%;}
.greetings_bot ul .greeting_left h3{font-size: 3.5rem; text-align: center;}
.values li .values_icon{width: 200px; height: 200px;}
.values li .values_icon img{width: 100px;}
.values li h4{font-size: 2.3rem;}
.values{margin-top: 50px;}



 /*연혁*/
    .ag-timeline_line { left: 0px; }
    .ag-timeline_item:nth-child(2n) { text-align: left; } 
    .ag-timeline-card_box{width:auto;}
    .ag-timeline-card_meta-box { display: none; } 
    .ag-timeline-card_point-box,
    .ag-timeline_item:nth-child(2n) .ag-timeline-card_point-box { left: -5px; } 
    .ag-timeline-card_item { width: 100%; }
    .ag-timeline_item:nth-child(2n+1) .ag-timeline-card_arrow { right: auto; left: 0; } 
    .ag-timeline-card_title { display: block; } 
    .ag-timeline-card_arrow { margin-top: 12px; } 
    .ag-timeline_item:nth-child(2n) .ag-timeline-card_box{order: 1;}
    .ag-timeline_item:nth-child(2n) .ag-timeline-card_item{order: 2;}
    .ag-timeline_item:nth-child(2n) .ag-timeline-card_item .ag-timeline-card_info{text-align: left; padding-left: 40px;}
    /* .ag-timeline_item:nth-child(2n) .ag-timeline-card_point-box{margin: 0 0 0 30px;} */
    .ag-timeline_item{margin-bottom: 50px;}
    .ag-timeline-card_title{margin-top: 0; margin-bottom: 10px;}
    .js-ag-active .ag-timeline-card_title{color: var(--main-color);}
    .ag-timeline-card_desc p{margin-bottom: 10px; position: relative;}
    .ag-timeline-card_desc p span{display: none;}
    .ag-timeline-card_desc p::before{content: ""; width: 3px; height: 3px; background-color: #555; position: absolute; top: 10px; left: -10px;}
    .ag-timeline_item:nth-child(2n) .ag-timeline-card_desc p{justify-content: start;}



    /*오시는길*/
 .location_list li h3{font-size: 20px;}
 .location_list li p{font-size: 18px;}
 .location_list li{padding: 50px 15px; width: calc(100% / 2 - 20px); margin: 10px;}



/*사업영역*/
.business li{padding:100px 30px;}
.layout_list li .layout_txt h3{font-size: 2.5rem;}
.layout_list li .layout_txt p{font-size: 2rem;}
.business .business_box1, .business .business_box2, .business .business_box3, .business .business_box4, .business .business_box5, .business .business_box6{height: auto;}


/*제품카테고리*/
.pro_list_category ul li a{font-size: 2.2rem; padding-bottom: 10px;}





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


/*sub-top*/
    .sub_visual_txt h2{font-size: 3.5rem;}
.sub_visual_txt p{font-size: 2rem;}

/*공통*/
.sub_tit{font-size: 3rem;}
.greetings_top p{font-size: 2rem;}
.flex .flex4_wid{width: calc(100% / 3 );}
.sub_bottom{margin-bottom: 80px;}



  /*인사말*/
.greetings_bot ul .greeting_left h3{font-size: 3rem;}
.greetings_bot ul .greeting_right div{font-size: 2rem;}
.greetings_bot ul .greeting_right div.sign b{font-size: 4rem;}
.greetings_bot ul .greeting_right div.sign{margin-top: 50px;}
.values{flex-wrap: wrap;}
.values li{width: calc(100% / 2 - 10px) !important; margin-bottom: 30px !important;}



 /*연혁*/
    .ag-format-container { width: 96%; } 
    .his_top_bg{width: 90%; left: 50%; transform: translateX(-50%) !important; text-align: center; height: auto; padding: 50px 20px;}
    .his_top_bg p{font-size: 1.8rem;}
    .ag-timeline-card_point-box, .ag-timeline_item:nth-child(2n) .ag-timeline-card_point-box{margin-right: -2px;}
    .his_top_bg p br{display: none;}

/*인증서*/
    .certificate ul li img{width: 100%;}
.certificate_pop li{width:calc(100% / 3 - 10px) !important ;}
.certificate ul{flex-wrap: wrap;}
.certificate1 li{width:calc(100% / 2 - 10px) !important ;margin-bottom: 15px;}
.certificate_tit{font-size: 2.6rem;}
.certificate_tit::before{top: 7px;}
.certificate1{justify-content: space-between;}


      /*오시는길*/
   .location_list li .loca_icon i{font-size: 30px;}
   .location_list li h3{font-size: 18px;}
    

   /*사업영역*/
   .layout_list{justify-content: space-between;}
.layout_list li{width: calc(100% / 2 - 10px) !important;margin: 0; margin-bottom: 20px;}
.layout_list li .layout_txt h3{font-size: 2.2rem;}
.layout_list li .layout_txt p{font-size: 1.8rem;}


/*제품카테고리*/
.pro_list_category ul li a{font-size: 2rem;}

}
@media all and (max-width:650px){


/*sub-top*/
    .sub_visual_txt h2{font-size: 3rem;}
.sub_visual_txt p{font-size: 1.8rem;}
.sub_visual_box{height: 400px;}


/*공통*/
.sub_tit{font-size: 2.4rem; margin: 80px 0 30px;}
.greetings_top p{font-size: 1.8rem;}


  /*인사말*/
.greetings_bot ul .greeting_left h3{font-size: 2.5rem;}
.greetings_bot ul .greeting_right div{font-size: 1.8rem;}
.greetings_bot ul .greeting_right div.sign b{font-size: 3.5rem;}
.values li h4{font-size: 2rem;}
.values li p{font-size: 1.8rem;}
.values li .values_icon{margin:0 auto 20px ;}
.values li{margin-bottom: 15px;}



    /*연혁*/
    .ag-timeline_title { font-size: 60px; } 
    .ag-timeline-card_info { padding: 10px 15px; } 
    .ag-timeline-card_desc { font-size: 14px; } 
    .ag-timeline-card_point-box, .ag-timeline_item:nth-child(2n) .ag-timeline-card_point-box{margin-right: -6px;}
    .ag-timeline_item:nth-child(2n) .ag-timeline-card_item .ag-timeline-card_info{padding: 10px 15px;}
    .ag-timeline-card_title{font-size: 22px;}
    .ag-timeline-card_desc p{font-size: 16px;}
    .his_tab li span{font-size: 2rem;}
    .history_top{height: 300px;}
    .ag-timeline-card_item{padding-left: 20px;}

/*인증서*/
.certificate{padding: 50px 0;}
.flex .flex4_wid{width: calc(100% / 2 ); margin-bottom: 15px;}
.certificate_pop li{width: calc(100% / 2 - 10px) !important;}
.certificate_tit{font-size: 2.2rem;}
.certificate_tit::before{width: 7px; height: 7px; top:6px ;}


       /*오시는길*/
   .location_list{flex-direction: column;margin-top: 50px;}
   .location_list li{width: 100%; padding: 20px 0; margin: 10px 0;}
   .location_map{margin-top: 20px;}


      /*사업영역*/
    .business li {padding: 50px 20px;}  
.layout_list li .layout_txt h3{font-size: 2rem;}
.layout_list li{width: calc(100% / 2 - 5px) !important; margin-bottom: 10px;}
.layout_wrap{margin-top: 50px;}



}
@media all and (max-width:480px){


   /*sub-top*/
    .sub_visual_txt h2{font-size: 2.4rem;}
.sub_visual_txt p{font-size: 1.6rem;}



/*공통*/
.sub_tit{font-size: 2rem;margin:80px 0 15px 0;}
.greetings_top p{font-size: 1.6rem;}


  /*인사말*/
.greetings_bot ul .greeting_left h3{font-size: 2.2rem;}
.greetings_bot ul .greeting_right div{font-size: 1.6rem;}
.greetings_bot ul .greeting_right div.sign b{font-size: 3rem;}
.greetings_bot ul .greeting_right div.sign{margin-top: 30px;}
.greetings_bot ul .greeting_right{padding: 50px 30px;}
.values li .values_icon{width: 150px; height: 150px;}
.values li .values_icon img{width: 80px;}
.values li h4{font-size: 1.8rem;}
.values li p{font-size: 1.6rem;}


  /*연혁*/
    .ag-timeline_line{left: 10px;}
    .ag-timeline-card_title{font-size: 20px;}
    .ag-timeline_item:nth-child(2n) .ag-timeline-card_item .ag-timeline-card_info{padding: 0 0 0 30px;}
    .ag-timeline-card_info { padding: 0 0 0 30px; }
    .ag-timeline-card_point-box, .ag-timeline_item:nth-child(2n) .ag-timeline-card_point-box{left: 5px;}
    .his_top_bg p{font-size: 1.6rem;}
  
     /*인증서*/
.certificate_tit{font-size: 2rem;}



       /*오시는길*/
   .location_list li h3{margin: 10px 0;}
   .location_list li p{font-size: 16px;}
   .location_list li .loca_icon i{font-size: 26px;}


         /*사업영역*/
         
.layout_list li .layout_txt h3{font-size: 1.8rem;}
.layout_list li .layout_txt p{font-size: 1.6rem;}
.business li{padding: 50px 10px; width: 100% !important;}
.layout_list li .layout_txt p{padding-left: 10px;}




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

    /*연혁*/
    .ag-timeline-card_point-box, .ag-timeline_item:nth-child(2n) .ag-timeline-card_point-box{margin-right: -19px;}

         /*인증서*/
.certificate_tit{font-size: 1.8rem;}



}