.index_wrap { line-height: 1; overflow: hidden; } 
.index_wrap .section { position: relative; } 

/*메인비주얼얼*/
.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: 55%; left: 50%; transform: translate(-50% , -50%); width: 90%; max-width: 1400px; color: #fff; } 
.section1 .mySwiper .swiper-slide .visual_wrap .img_box { margin-top: 4rem; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box { margin-bottom: 80px; } 

.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1 { font-size: 10rem; transition: all .3s; line-height: 1; position: relative; margin-bottom: 20px; font-weight: 500; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box span { font-weight: 400; display: block; font-size: 3rem; font-family: 'S-Core'; line-height: 1.2; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info a { display: flex; justify-content: space-between; border: 1px solid #fff; border-radius: 30px; padding: 15px; width: 180px; transition: all .2s; align-items: center; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info a span { font-size: 1.6rem; font-family: 'S-Core'; color: #fff; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info a i { color: #fff; font-size: 2rem; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info a:hover { background-color: var(--sub-color); border: none; } 


.main_btn { background: unset; width: 220px; border-radius: 33px; margin-top: 60px; transition:all .3s; border: 1px solid #fff; } 
.main_btn:hover { box-shadow: 1px 0px 3px 1px #787878; background: #fff; border: 1px solid #fff; } 
.main_btn:hover a { color:#222 } 
.main_btn a { padding: 2rem 3rem; display: flex; justify-content: space-between; align-items: center; flex-direction: row; font-size: 1.6rem; flex-wrap: nowrap; color: inherit; } 
.main_btn a i { font-size: 25px; } 
/* .section1 { height: 90vh !important; } */
.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); } 
.index_wrap .slider_4 { background-image: url(../../img/main_visual_4.jpg); } 

@keyframes zoom_in { 
 0% { transform: scale(1.2); /* background-size: 100% 100%; */ } 
 100% { transform: scale(1) rotate(0.003deg); } 
 }

 @keyframes text-up { 
 from { transform: translate3d(0, 150%, 0); } 
 to { transform: translate3d(0, 0, 0); } 
 }

.index_wrap .mySwiper .swiper-slide.swiper-slide-active .slide_bg { 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; } 
.index_wrap .mySwiper .swiper-slide.swiper-slide-active .title_box span { animation: text-up 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; } 
.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; } 

/* pagnation */

.side_text_box { position: absolute; left: 5%; top: 53%; transform: translateY(-50%); display: flex; flex-direction: column-reverse; /* 세로로 정렬 */
 align-items: center; color: #fff; z-index: 10; gap: 16px; } 
/* 세로 글씨 회전 */
.side_text { writing-mode: vertical-rl; transform: rotate(180deg); font-size: 12px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; color: #fff; } 

/* 숫자 스타일 */
.side_num { writing-mode: vertical-rl; transform: rotate(180deg); font-size: 12px; font-weight: 700; } 
/* 컨트롤 (로딩바 영역) */
.control_wrap { position: relative; width: 2px; height: 60px; overflow: hidden; background: rgba(255,255,255,0.3); border-radius: 2px; } 
.loading-bar { position: absolute; bottom: 0; left: 0; width: 100%; height: 0%; background: #fff; animation: LoadingBar 5s linear forwards; } 


@keyframes LoadingBar { 
 0% { height: 0%; } 
 100% { height: 100%; } 
 }
/* 로딩바 세로 진행 */
.swiper-pagination-bullet .bar { position: absolute; bottom: 0; left: 0; width: 100%; height: 0%; background: #fff; } 

/* 로딩 애니메이션 (세로로 차오름) */
@keyframes LoadingBar { 
 0% { height: 0%; } 
 100% { height: 100%; } 
 }



/*공통*/
.main_inner { max-width:1720px; margin: 0 auto; width: 100%; } 
.main_tit { font-size: 6rem; font-weight: 500; } 
.full_inner { padding-top: 100px; width: 100%; height: 100%; display: flex; align-items: center;} 

.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; } 



/*메인2*/
.section2 { } 
.main2_wrap{width: 100%;}
.main2_top { } 
.main2_top h2 { } 
.main2_top p { font-size: 2.4rem; font-weight: 400; line-height: 1.5; margin-top: 30px; } 
.main2_bottom { margin-top:70px; height: 335px; } 
.main2_bottom .main2_list { } 
.main2_bottom .main2_list li { width:calc(100% / 2 - 10px); position: relative; transition: all .5s; } 
.main2_bottom .main2_list li a { display: block; width: 100%; height: 100%; transition: all .5s; } 
.main2_bottom .main2_list li a .main2_img_box { position: relative; height: 330px; overflow: hidden; transition: all .2s; } 
.main2_bottom .main2_list li a .main2_img_box img { width: 100%; height: 100%; } 
.main2_bottom .main2_list li a .main2_img_box p { font-size: 3rem; color: #fff; position: absolute; top:50px; left: 50px; font-weight: 400; } 
.main2_bottom .main2_list li a .main2_hover { margin-top: 20px; opacity: 0; } 
.main2_bottom .main2_list li a .main2_hover h4 { font-size: 2.5rem; margin-bottom: 20px; font-weight: 400; padding-left: 20px; } 
.main2_bottom .main2_list li a .main2_hover p { font-size: 1.8rem; padding-left: 20px; line-height: 1.5; font-weight: 400;} 
.main2_bottom .main2_list li.on { width: calc(100% / 2 - 10px); margin:0 10px; } 
.main2_bottom .main2_list li.on .main2_hover { opacity: 1; } 
.main2_bottom .main2_list li.on a { transform: translateY(-30px); } 


.main_cursor { width: 170px; height: 170px; position: absolute; 
 top: 0; left: 0; z-index: 15; pointer-events: none; } 
.main_cursor_inner { width: 170px; height: 170px; position: absolute; top: 0; left: 0; transform: translate(-50%, -50%); opacity: 0; transition: opacity 0.2s ease; } 
.main_cursor_inner.on { opacity: 1; } 
.main_cursor_inner img{    transition: all .3s; animation: rotate 20s linear infinite;}
@keyframes rotate{
    100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
}
}


/*메인3*/
.section3{position: relative; width: 100%; height: 100%; transition: all .5s;}
.section3.bg1{background: url(../../img/section3_bg1.jpg) no-repeat;background-size: cover; background-position: center; }
.section3.bg2{background: url(../../img/section3_bg2.jpg) no-repeat;background-size: cover; background-position: center; }

.section3::before{content: ""; width: 1px; height: 100%; background-color: #eaecec; position:absolute; top: 0; left: 50%; transform: translateX(-50%);}
.main3_wrap{width: 100%; height: 100%; display: flex; align-items: center;}
.main3_wrap ul{width: 100%; height: 100%;}
.main3_wrap ul li{height: 100%; display: flex; align-items: center;}
.main3_wrap ul li>div{width: 80%; margin: 0 auto;}
.main3_wrap ul li>div h3{font-size: 7.2rem; color: #fff; }
.main3_wrap ul li>div p{font-size: 3rem; font-weight: 400; line-height: 1.2; color: #fff; margin: 40px 0 60px;}
.main3_wrap ul li>div .main3_btn{}
.main3_wrap ul li>div .main3_btn a{display: flex; align-items: center; transition: all .3s;}
.main3_wrap ul li>div .main3_btn a span{font-size: 2.4rem; color: #fff; margin-right: 20px;}
.main3_wrap ul li>div .main3_btn a img{transition: all .3s;}
.main3_wrap ul li>div .main3_btn a:first-child{margin-right: 60px;}
.main3_wrap ul li>div .main3_btn a:hover img{transform: translateX(10px);}


/*메인4*/
.section4{background-color: #ddf0fb;}
.main4_wrap{width: 100%;}
.main4_wrap ul{align-items: center;}
.main4_wrap ul li{}
.main4_wrap ul .main4_left{}
.main4_wrap ul .main4_left .main4_txt{}
.main4_wrap ul .main4_left .main4_txt h2{}
.main4_wrap ul .main4_left .main4_txt p{font-size: 2.4rem; font-weight: 400; margin: 70px 0; line-height: 1.5;}
.main4_wrap ul .main4_left .main4_list{justify-content: space-between;}
.main4_wrap ul .main4_left .main4_list .main4_box{ background-color: #fff; border-radius: 20px;     width: calc(100% / 2 - 20px);}
.main4_wrap ul .main4_left .main4_list .main4_box a{display: flex; align-items: center; padding:20px; transition: all .3s;}
.main4_wrap ul .main4_left .main4_list .main4_box a img{margin-right: 15px;}
.main4_wrap ul .main4_left .main4_list .main4_box a span{font-size: 2.4rem; font-weight: 400;}
.main4_wrap ul .main4_left .main4_list .main4_box a i{font-size: 3.5rem;margin-right: 15px; }
.main4_wrap ul .main4_right{}
.main4_wrap ul .main4_right img{}
.main4_wrap ul .main4_left .main4_list .main4_box a:hover{background-color: var(--sub-color); border-radius: 20px;}
.main4_wrap ul .main4_left .main4_list .main4_box a:hover span{color: #fff;}
.main4_wrap ul .main4_left .main4_list .main4_box a:hover i{color: #fff;}



/*메인5*/
.section5{}
.main5_top{}
.main5_top h2{}
.main5_top p{margin: 60px 0; font-size: 2.4rem; line-height: 1.5;font-weight: 400;}
.section5 .main5_list{justify-content: space-between;}
.section5 .main5_list li{width: calc(100% / 5 - 20px);  border: 1px solid #c3c3c3; border-radius: 10px;}
.section5 .main5_list li:nth-child(-n+5){margin-bottom: 60px;}
.section5 .main5_list li img{width: 100%;  border-radius: 10px;}









/******************************반응형********************************************/
@media (max-width: 1770px) { 
    /*공통*/
.main_inner{width: 90%;}



    /*비주얼*/
.side_text_box{left: 2%;}









} 

@media (max-width: 1540px) {
    /*비주얼*/
    .section1 .mySwiper .swiper-slide .visual_wrap{width: 85%;}
    .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1{font-size: 8rem;}
    
    /*공통*/
    .main_tit{font-size: 5rem;}


    /*main3*/
  .main3_wrap ul li>div h3{font-size: 6rem;}
  .main3_wrap ul li>div p{font-size: 2.5rem;}
  .main3_wrap ul li>div p br{display: none;}

    /*main4*/
    .main4_wrap ul .main4_right img{width: 100%;}
    .main4_wrap ul .main4_left .main4_list .main4_box{width: calc(100% / 2 - 10px); margin: 10px 0;}
.main4_wrap ul .main4_left .main4_list{justify-content: space-between;}
.main4_wrap ul{justify-content: space-between;}
.main4_wrap ul li{width: calc(100% / 2 - 20px) !important;}




 } 

@media (max-width: 1380px) { 
    /*비주얼*/
  .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1{font-size: 6rem;}
  .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box span{font-size: 2.5rem;}
  .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info a{width: 200px;}


    /*공통*/
    .main_tit{font-size: 4.5rem;}

    /*main2*/
    .main2_bottom .main2_list li a .main2_img_box p{font-size: 2.5rem;}

    /*main3*/
    .main3_wrap ul li>div h3{font-size: 5rem;}
    .main3_wrap ul li>div p{font-size: 2.2rem;}

    /*main4*/
  .main4_wrap ul .main4_left .main4_txt p{margin: 50px 0;}
  .main4_wrap ul .main4_left .main4_list .main4_box a span{font-size: 2.2rem;}

    /*main5*/
  .section5 .main5_list li:nth-child(-n+5){margin-bottom: 30px;}




} 

@media (max-width: 1280px) {
    /*비주얼*/
  .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1{font-size: 5rem;}

    /*공통*/
    .main_tit{font-size: 4rem;}
.full_inner{padding-top: 0;}

 [data-aos] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }


    /*main2*/
    .main2_top p{font-size: 2.2rem;}
    .main2_bottom .main2_list li a .main2_img_box p{font-size: 2.2rem;}
.main2_bottom .main2_list li.on { width: 100%;}



    /*main3*/
    .main3_wrap ul li>div h3{font-size: 4rem;}
  .main3_wrap ul li>div .main3_btn a span{font-size: 2.2rem;}
  .main3_wrap ul li>div p{margin: 30px 0;}
  .main3_wrap ul li>div{width: 100%;}
  .main3_wrap ul li.main3_bg2_on{padding-left: 30px;}




 } 

@media (max-width: 1080px) { 
    /*비주얼*/
    .section1 .mySwiper .swiper-slide .visual_wrap{width: 80%;}
  .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1{font-size: 4.5rem;}
  .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box span{font-size: 2.2rem;}

    /*공통*/
    .main_tit{font-size: 3.5rem;}
.full_inner{ padding: 100px 0;}  



    /*main2*/
    .main_cursor{display: none;}
.main2_bottom .main2_list li a .main2_hover{opacity: 1;}
.main2_bottom{height: auto;}
.main2_bottom .main2_list li a .main2_img_box{height: 350px;}
  .main2_bottom .main2_list{flex-wrap: wrap; flex-direction: column;}
  .main2_bottom .main2_list li{width: 100%; margin-bottom: 30px;}
  .main2_bottom .main2_list li:last-child{margin-bottom: 0;}
.main2_bottom .main2_list li.on a { transform: translateY(1px); } 
.main2_bottom .main2_list li.on{ margin: 0 0 30px;}


    /*main3*/
    .section3::before{display: none;}
.section3.bg1{background: none;}
.section3.bg2{background: none;}
.main3_wrap ul{flex-direction: column;}
.main3_wrap ul li{width: 100%; padding: 50px ; border-radius: 10px; }
.main3_wrap ul li.main3_bg1_on{background:url(../../img/section3_bg1.jpg) no-repeat; height: 100%; width: 100%; margin-bottom: 30px; background-position: center;}
.main3_wrap ul li.main3_bg2_on{background:url(../../img/section3_bg2.jpg) no-repeat; height: 100%;width: 100%; background-position: bottom;}
.main3_wrap ul li.main3_bg2_on{padding-left: 50px;}
.main3_wrap ul li>div h3{font-size: 3rem; letter-spacing: 2px;}

  /*main4*/
  .main4_wrap ul{flex-direction: column;}
.main4_wrap ul li{width: 100% !important;}
.main4_wrap ul .main4_right{text-align: center; margin-top: 80px;}
.main4_wrap ul .main4_right img{width: 50%;}

  /*main5*/
.section5 .main5_list li:nth-child(-n+5){margin-bottom: 20px;}
.section5 .main5_list li{margin-bottom: 20px;margin-right: 20px; width: calc(100% / 4 - 20px);}
.section5 .main5_list{justify-content: start;}





} 

@media (max-width: 800px) { 
        /*비주얼*/
  .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1{font-size: 3.5rem;}
  .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box span{font-size: 2rem;}
  .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box span br{display: none;}

    /*공통*/
  .main_tit{font-size: 3rem;}


    /*main2*/
      .main2_top p{font-size: 2rem; margin-top: 20px;}

  .main2_bottom .main2_list li a .main2_hover h4{font-size: 2.2rem;}

    /*main3*/
  .main3_wrap ul li>div h3{font-size: 2.5rem;}
  .main3_wrap ul li>div p{font-size: 2rem;margin: 20px 0;}


  /*main4*/
  .main4_wrap ul .main4_left .main4_txt p{font-size: 2.2rem; margin: 30px 0;}
.main4_wrap ul .main4_left .main4_list .main4_box a img{width: 60px;}
.main4_wrap ul .main4_left .main4_list .main4_box a span{font-size: 2.2rem;}
.main4_wrap ul .main4_right{margin-top: 50px;}
 .main4_wrap ul .main4_left .main4_list .main4_box a span{font-size: 2rem;}


  /*main5*/
.main5_top p{font-size: 2.2rem;}
.section5 .main5_list li{width: calc(100% / 3 - 20px);}






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

    
    /*공통*/
  .main_tit{font-size: 2.5rem;}
.full_inner{padding: 50px 0;}


        /*비주얼*/
  .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1{font-size: 2.8rem;}
  .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box span{font-size: 1.8rem;}

    /*main2*/
.main2_bottom{margin-top: 50px;}
 .main2_top p br{display: none;}
.main2_bottom .main2_list li a .main2_hover h4{margin-bottom: 10px;}
.main2_bottom .main2_list li a .main2_img_box p{font-size: 2rem; top: 30px; left: 30px;}
.main2_bottom .main2_list li a .main2_hover h4{font-size: 2rem;}
.main2_bottom .main2_list li a .main2_img_box{height: auto;}


    /*main3*/
    .main3_wrap ul li{padding: 50px 20px;}
.main3_wrap ul li.main3_bg2_on{padding-left: 20px;}
.main3_wrap ul li>div h3{font-size: 2rem;}
.main3_wrap ul li>div p{font-size: 1.8rem;}
.main3_wrap ul li>div .main3_btn a span{font-size: 2rem;}

 /*main4*/
 .main4_wrap ul .main4_left .main4_list .main4_box{width: calc(100% / 2 - 5px); margin: 5px 0;}
 .main4_wrap ul .main4_left .main4_list .main4_box a span{font-size: 1.8rem;}
.main4_wrap ul .main4_left .main4_txt p{font-size: 2rem;}
.main4_wrap ul .main4_left .main4_txt p br{display: none;}
.main4_wrap ul .main4_right img{width: 70%;}
.main4_wrap ul .main4_left .main4_list .main4_box a i{font-size: 3rem;}


  /*main5*/
.main5_top p{font-size: 2rem; margin: 30px 0;}
.main5_top p br{display: none;}
.section5 .main5_list li{width: calc(100% / 3 - 10px); margin-right: 10px; margin-bottom: 10px;}



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

     /*공통*/
  .main_tit{font-size: 2.2rem;}



        /*비주얼*/
  .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1{font-size: 2rem;}
  .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box span{font-size: 1.6rem;}
  .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info a span{font-size: 1.4rem;}
.side_text_box{left: 135px; top: 40%; transform: translateY(-50%) rotate(90deg);}
.section1 .mySwiper .swiper-slide .visual_wrap{width: 90%;}
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box{margin-bottom: 50px;}
.side_text{font-size: 10px;}

    /*main2*/
  .main2_top p{font-size: 1.8rem;}
.main2_bottom .main2_list li a .main2_hover h4{font-size: 1.8rem; padding-left: 0;}
.main2_bottom .main2_list li a .main2_img_box p{font-size: 1.8rem;}
.main2_bottom .main2_list li a .main2_hover p{font-size: 1.6rem;  padding-left: 0;}


    /*main3*/
.main3_wrap ul li>div .main3_btn{flex-direction: column;}
.main3_wrap ul li>div .main3_btn a:first-child{margin-right: 0; margin-bottom: 10px;}
.main3_wrap ul li>div p{line-height: 1.2; margin: 20px 0 50px;}
.main3_wrap ul li>div .main3_btn a span{font-size: 1.8rem;}
.main3_wrap ul li>div .main3_btn a img{width: 40px;}
.main3_wrap ul li.main3_bg2_on{background-position: 34% 85%;}



 /*main4*/
 .main4_wrap ul .main4_left .main4_txt p{font-size: 1.6rem;}
.main4_wrap ul .main4_left .main4_list .main4_box{width: 100%;}
.main4_wrap ul .main4_right img{width: 90%;}
.main4_wrap ul .main4_left .main4_list .main4_box a img{width: 50px;}


  /*main5*/
.main5_top p{font-size: 1.6rem;}
.section5 .main5_list li{width: calc(100% / 2 - 10px); }
.section5 .main5_list li:nth-child(-n+5){margin-bottom: 10px;}





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

.side_text_box{ top: 180px; }
} 