.index_wrap{width: 100%;}
/*메인공통*/
.main_inner{max-width: 1500px;margin:80px auto;width: 90%; }


.main_tit.s_event{opacity: 0; filter:Alpha(opacity=0);  transition: 0.8s; transform: translateY(50%);}
.main_tit.s_event.move{opacity: 1; filter:Alpha(opacity=1);  transition: 0.8s; transition-delay: 0.1s;  transform: translateY(0%);}

.main_move.s_event{opacity: 0; filter:Alpha(opacity=0); transform: translateY(50%); transition: 0.8s; }
.main_move.s_event.move{opacity: 1; filter:Alpha(opacity=1); transform: translateY(0%); transition: 0.8s; transition-delay: 0.12s;}

/*============* MAIN VISUAL ============*/
.section1 .mySwiper .swiper-slide .slide_bg { height: 100vh; overflow: hidden; background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; } 
.section1 .mySwiper .swiper-slide .visual_wrap { position: absolute; top: 50%; left: 13%; transform: translateY(-50%); width: 50%; max-width: 1500px; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box { color: #fff; } 

.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1 { font-size: 76px; padding-bottom: 2.6rem; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1 span{font-size: 22px; display: block; font-weight: 400; margin-bottom: 5px;}
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info p{font-size:24px; font-weight: 300;} 

/* main_btn */
.main_btn { background: var(--sub-color); width: 240px; margin-top: 80px; transition:all .3s; } 
.main_btn:hover { box-shadow: 1px 0px 7px 1px #d3d3d3; } 
.main_btn a { padding: 22px 0px; font-size: 1.6rem; color: #fff; text-align: center; } 
.main_btn a b { font-weight: 400; } 
.main_btn a i { font-size: 25px; } 
.index_wrap .slider_1 { background-image: url(../../img/main_visual_1.jpg); } 
.index_wrap .slider_2 { background-image: url(../../img/main_visual_2.jpg); } 
.index_wrap .slider_3 { background-image: url(../../img/main_visual_3.jpg); } 
 

@keyframes zoom_in { 
    0% { transform: scale(1.2); /* background-size: 100% 100%; */ } 
    100% { transform: scale(1) rotate(0.003deg); } 
    }
   
   .index_wrap .mySwiper .swiper-slide.swiper-slide-active .slide_bg { animation: zoom_in 5000ms; transition: transform 5000ms ease-in-out, opacity 1000ms ease 0s; } 
   .index_wrap .mySwiper .swiper-slide.swiper-slide-active .title_box, 
   .index_wrap .mySwiper .swiper-slide.swiper-slide-active .visual_info { overflow:hidden } 
   .index_wrap .mySwiper .swiper-slide.swiper-slide-active .title_box h1 { animation: text-up 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay:0.3s; } 
   .index_wrap .mySwiper .swiper-slide.swiper-slide-active .visual_info p { animation: text-up 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay: 0.4s; margin-right:4px; } 

   @keyframes text-up { 
    from { transform: translate3d(0, 150%, 0); } 
    to { transform: translate3d(0, 0, 0); } 
    }
   
    /* pagnation */
   .control_wrap { display: flex; position: absolute; bottom: 28%; left: 13.2%; width: 150px; height: 40px; align-items: center; justify-content: space-between; flex-direction: row; } 
   .control_wrap .swiper-pagination { text-align:left; position: relative; width: 100px; display: flex; height: 40px; justify-content: space-between; align-items: center; top: 0; } 
   .control_wrap .swiper-pagination-bullet { width: 8px; height: 8px; background: #fff; opacity:1; } 
   .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, 
   .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet { margin: unset; } 
   .control_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active { position: relative; } 
   .control_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active::before { content:''; display:block; position:absolute; width: 20px; height: 20px; border:1px solid #fff; border-radius:50%; top:50%; left:50%; transform:translate(-50%, -50%); } 
   
 /* 정지재생 */
 .slide_btn { cursor: pointer; z-index: 100; position: relative; width: 10%; margin-bottom: 3%; } 
 .slide_btn span { display: none; position: relative; top: 3px; } 
 .slide_btn span.on { display: inline-block; } 
 .slide_btn i { color: #fff; font-size:18px; font-weight: 100; } 



/*메인2*/

.main2{display: flex; width: 100%; height: 100%; align-items: center;}
.main2 li{width:calc(100% / 2 ); }
.main2 .main2_txt{width: 33%; padding-left: 100px; margin-top: 100px;}
.main2 .main2_txt span{font-size: 25px; color: var(--main-color); font-weight: 600;}
.main2 .main2_txt h2{font-size: 34px; margin: 30px 0; font-weight: 200;word-break: keep-all;}
.main2 .main2_txt h2 span{font-weight: 600; font-size: 34px;}
.main2 .main2_txt h2 em{font-style: normal; color: var(--main-color);}
.main2 .main2_txt p{font-size: 20px;}
.main2 .main2_txt p i{display: block;}
.main2 .main2_txt .main2_btn{width: 220px; height: 60px; display: flex; justify-content: space-around;align-items: center;border: 1px solid var(--main-color);margin-top: 150px;}
.main2 .main2_txt .main2_btn span{color: var(--main-color); font-size: 16px; transition: all .3s;}
.main2 .main2_txt .main2_btn img{transition: all .3s;}
.main2 .main2_txt .main2_btn .white_arr{display: none;}
.main2 .main2_txt .main2_btn .blue_arr{}

.main2 .main2_txt .main2_btn:hover{background-color: var(--main-color);}
.main2 .main2_txt .main2_btn:hover span{color: #fff;}
.main2 .main2_txt .main2_btn:hover .blue_arr{display: none;}
.main2 .main2_txt .main2_btn:hover .white_arr{display: block;}




/*메인3*/

.section3{background: url(../../img/section3_bg.jpg) no-repeat; width: 100%; height: 100%; background-size: cover; background-position: center;}
.section3 .main_tit{font-size: 25px; text-align: center; color: #fff;}
.section3 h2{font-size: 38px; text-align: center; color: #fff; margin: 40px 0 100px 0;}

.main_vid{}
.main_vid .ring{border: 1px solid #fff; width: 150px; height: 150px; border-radius: 50%; display: flex; justify-content: center; align-items: center; margin: 0 auto; position: relative;}
.main_vid a img{ transition: all .3s;}
.main_vid .ring:hover img{transform: scale(1.2);}

.main_vid .ring span{ display:block;position:absolute;top:calc(50% - 2px);left:50%; width:50%;height:4px;background:transparent;transform-origin:left;animation:animate 3s linear infinite;}
.main_vid .ring span::before{content:'';position:absolute;width:16px;height:16px;border-radius:50%; background:#fff; top:-6px; right:-8px;box-shadow:0 0 20px #fff;}

.main_vid_pop{ position: absolute;width: 100%; height: 100%;top: 0; left: 0; display: none;}
.main_vid_pop .video_wrap{width: 1200px; position: absolute; top: 55%; left: 50%; transform: translate(-50%, -50%); z-index: 50;}
.main_vid_pop .video_wrap .close_btn{position: absolute; top: -40px;right: 0; font-size: 30px; color: #fff; transition: all .5s;}
.main_vid_pop .video_wrap .close_btn:hover{transform: rotate(360deg);}
@keyframes animate
{
  0%
  {
    transform:rotate(45deg);
  }
  100%
  {
    transform:rotate(405deg);
  }
}




/*메인4*/

.section4{ width: 100%; height: 100%; position: relative; }
.section4::before{content: "";background: url(../../img/section4_bg.jpg) no-repeat right;background-size: cover; width: 50%; height: 100%;display: block;position: absolute;right: 0; } 

.section4 .pro_slide{display: flex; align-items: center;}

.section4 .pro_slide .wrap1{width: 27%; margin-left: 200px;}
.section4 .pro_slide .wrap1 .main_tit{font-size: 25px;color: #094da0; }

.section4 .pro_slide .wrap1 .pro_list{margin: 50px 0;}
.section4 .pro_slide .wrap1 .pro_list .main_p_tab{font-size: 19px; position: relative;margin-bottom: 30px; cursor: pointer;}
.section4 .pro_slide .wrap1 .pro_list .main_p_tab i{display: block;}
.section4 .pro_slide .wrap1 .pro_list .swiper-wrapper{flex-direction: column;}
.section4 .pro_slide .wrap1 .pro_list .swiper-wrapper .swiper-slide{width: 100% !important;}

.section4 .pro_slide .wrap1 .pro_list .swiper-wrapper .swiper-slide-thumb-active .main_p_tab{font-weight: 700;}
.section4 .pro_slide .wrap1 .pro_list .swiper-wrapper .swiper-slide-thumb-active .main_p_tab::after{content: ""; width: 150px; height: 2px;background-color: var(--main-color);position: absolute;right: -20px; bottom: 0;}

.section4 .pro_slide .wrap1 .main4_logo_list{display: flex;}
.section4 .pro_slide .wrap1 .main4_logo_list li{width: calc(100% / 4 - 20px); margin: 0 10px;}
.section4 .pro_slide .wrap1 .main4_logo_list li img{width: 100%;}

.section4 .wrap2{width:70%;position: relative;margin-left: 100px; }
.section4 .wrap2 .swiper-slide { position: relative; padding: 60px 50px;  background-color: #fff; width:500px; height: 500px; border: 1px solid #ccc;} 

.section4 .wrap2 .swiper-slide::after { content:''; display: block; position: absolute; width:100%; height:100%; box-shadow: 4px 5px 11px 0px #dcdcdc; left: 0; top: 0; opacity:0; transition: all .3s; z-index: -1; } 
.section4 .wrap2 .swiper-slide:hover::after { opacity:1; } 
.section4 .wrap2 .swiper-slide:hover{box-shadow: rgba(0, 0, 0, 0.5) 0px 5px 15px;}
.section4 .wrap2 .swiper-slide >a{display: block; width: 100%;  }
.main_pro_img{text-align: center;}
.main_pro_img img{width: 100%; max-width: fit-content; height: 100%; }
.main_pro_txt{text-align: center; margin-top: 30px;}
.main_pro_txt h4{font-size: 19px; }
.main_pro_txt p{font-size: 18px;line-height: 1.5; margin: 20px 0;}
.main_pro_txt .main_pro_more{display: block; width: 100%; height: 100%; color: #094da0; font-size: 16px;}




/*메인5*/

.section5{position: relative; width: 100%; height: 100%;}
.section5::after{content: "";background: url(../../img/section5_bg.png) no-repeat right bottom; width:360px; height: 92px; }

.section5 .main_tit{font-size: 25px; text-align: center; color: var(--main-color); font-weight: 600;}
.section5 h2{font-size: 36px; color: #333; margin: 20px 0 60px 0; text-align: center; font-weight: 200;}
.section5 h2 b{font-weight: 600;}

.main_news{position: relative;}
.main_news .control_arrow { width: 95px; display: flex; justify-content: space-between; position: absolute; right: 0; top: -80px; } 
.main_news .control_arrow .custom_arrow { background: #fff;  box-shadow: 1px 1px 3px 0px #cacaca; padding: 10px;  cursor: pointer;}
.main_news .control_arrow .custom_arrow i{font-size: 20px; color: var(--main-color); font-weight: 700;}











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

  /*메인2*/
  .main2{justify-content: space-between;}
  .main2 li{width: calc(100% / 2 - 40px);}
  .main2 li> img{width: 100%;}
  .main2 .main2_txt{padding-left: 0; width: 50%;}
 

 }
 @media (max-width: 1540px) {  
    .section1 .mySwiper .swiper-slide .visual_wrap{width: 100%; left: 5%;}
    .control_wrap{left: 5%;}
   
     /*메인2*/
     .main2 .main2_txt span{font-size: 22px;}
     .main2 .main2_txt h2{font-size: 32px;}

     /*메인4*/
     .section4 .pro_slide .wrap1{margin-left: 100px;}
     .section4 .pro_slide .wrap1 .pro_list .swiper-wrapper .swiper-slide-thumb-active .main_p_tab::after{width: 80px;}
    
}
@media (max-width: 1380px) {  
    .section1 .mySwiper .swiper-slide .visual_wrap{width: 90%; left: 50%; transform: translate(-50%, -50%);}
    .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1{font-size: 70px;}
    .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info p{font-size: 24px;}
     /*메인2*/
     .main2 .main2_txt span{font-size: 20px;}
     .main2 .main2_txt h2{font-size: 26px;}
     .main2 .main2_txt h2 span{font-size: 28px;}

      /*메인3*/
      .section3 h2{font-size: 36px;}
      .main_vid_pop .video_wrap{width: 80%;}


}
@media (max-width: 1280px) {
    .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1{font-size: 60px;}  

     /*메인2*/
     .main2{background: url(../../img/section2_bg.png) no-repeat; width: 100%; height: 100%; background-size: cover; padding-top: 100px;}
     .main2 li:nth-child(1){width: 0%;}
     .main2 li:nth-child(1) img{display: none;}
     .main2 .main2_txt{width: 80%; margin: 0 auto; text-align: center; background-color: rgba(255, 255, 255, 0.7);padding: 50px; }
     .main2 .main2_txt .main2_btn{margin: 50px auto 0;}
    /*메인3*/
     .main_vid_pop .video_wrap div iframe{height: 450px;}

   /*메인4*/
   .section4 .pro_slide .wrap1 .main_tit{font-size: 23px;}
   .section4 .pro_slide .wrap1 .pro_list .main_p_tab{font-size: 18px;}
   .main_pro_txt p{font-size: 17px;}
   .section4 .wrap2 .swiper-slide{padding: 60px 40px;}

   /*메인5*/
   .section5 h2{font-size:32px;}


}
@media (max-width: 1024px) { 
    .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1{font-size: 50px;}  

    /*메인2*/
    .main2 .main2_txt h2{font-size: 24px;}
    .main2{padding-top: 0px;}
    /*메인3*/
     .section3 h2{font-size: 32px;}
     .main_vid_pop .video_wrap{width: 90%;}

    /*메인4*/
    .section4::before{width: 100%;}
    .section4 .pro_slide{flex-direction: column;}
    .section4 .pro_slide .wrap1{width: 90%; margin-left: 0;}
    .section4 .pro_slide .wrap1 .pro_list .main_p_tab{color: #fff; text-align: center; font-weight: 200; line-height: 1.5;}
    .section4 .pro_slide .wrap1 .main_tit{color: #fff; padding-left: 30px;} 
    .section4 .pro_slide .wrap1 .pro_list .swiper-wrapper{flex-direction: row;}
    .section4 .pro_slide .wrap1 .pro_list .swiper-wrapper .swiper-slide{width:calc(100% / 5 - 20px) !important; margin: 0 10px;}
    /* .section4 .pro_slide .wrap1 .pro_list .main_p_tab i{display: block;} */
    .section4 .pro_slide .wrap1 .pro_list .swiper-wrapper .swiper-slide-thumb-active .main_p_tab::after{right: 23%; bottom: -15px; background-color: #fff; }
    .section4 .wrap2{width: 90%; margin: 0 auto;}
    .section4 .wrap2 .swiper-slide{width: 60%; padding: 60px 40px; height: auto;}
    .section4 .pro_slide .wrap1 .main4_logo_list{display: none;}
    .section4 .pro_slide .wrap1 .pro_list .swiper-wrapper .swiper-slide-thumb-active .main_p_tab{font-weight: normal;}
    
    /*메인5*/
    .section5 .main_tit{font-size: 22px;}
    .section5 h2{font-size:28px;}

}
@media (max-width: 800px) { 
    .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1{font-size: 40px;}  
    .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info p{font-size: 20px;}

    

    /*메인3*/
    .main_vid .ring{width: 130px; height: 130px;}
    .section3 h2{font-size: 28px;}
  

     /*메인4*/
     .section4 .pro_slide .wrap1 .pro_list .swiper-wrapper .swiper-slide{width: calc(100% / 4 - 20px) !important;}
     .main_pro_txt h4{font-size: 20px;}
     .main_pro_txt p{font-size: 16px;}

     /*메인5*/
    .section5 .main_tit{font-size: 20px;}
    .section5 h2{font-size:24px;}
    .main_news .control_arrow{top: -60px;}

}
@media (max-width: 650px) { 
    .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1{font-size: 36px; }  
    .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1 span{margin-bottom: 15px;}

    /*메인2*/
   
    .main2 .main2_txt{width: 85%;}
    .main2 .main2_txt h2{font-size: 22px; margin: 20px 0;}
    .main2 .main2_txt h2 span{font-size: 24px;}
    .main2 .main2_txt .main2_btn{width: 250px;}
    .main2 .main2_txt span{font-size: 18px;}

    /*메인3*/
    .section3 h2{font-size: 24px; margin: 20px 0 80px;}
    .section3 .main_tit{font-size: 22px;}

    /*메인4*/
    .section4 .pro_slide .wrap1 .pro_list .swiper-wrapper .swiper-slide{width: calc(100% / 3 - 20px) !important;}
    .section4 .wrap2 .swiper-slide{width: 100%; padding: 40px;}
   
    /*메인5*/
    .section5 h2{font-size: 22px; margin: 20px 0 80px;}

}
@media (max-width: 480px) { 
    .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1 span{font-weight: 300; font-size: 18px;}
    .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1{font-size: 30px; }  
    .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info p{font-size: 18px;}
    .control_wrap{bottom: 10%;}

    /*메인2*/
    .main2 .main2_txt{padding: 50px 30px;}
    .main2 .main2_txt p{font-size: 16px;}
    .main2 .main2_txt p i{display: inline;}
    .main2 .main2_txt h2{font-size: 20px;}
    .main2 .main2_txt span{font-size: 16px;}

    /*메인3*/
    .section3 h2{font-size: 22px; }
    .main_vid .ring{width: 110px; height: 110px;}

     /*메인4*/
     .section4 .pro_slide .wrap1 .main_tit{font-size: 22px; padding-left: 10px;}
     .section4 .pro_slide .wrap1 .pro_list{margin: 30px 0 50px;}
     .section4 .pro_slide .wrap1 .pro_list .swiper-wrapper .swiper-slide{width: calc(100% / 2 - 20px) !important;}
 
    .section4 .pro_slide .wrap1 .pro_list .main_p_tab i{display: inline;}
}

@media (max-width: 400px) { 

   /*메인4*/
  



}