#main{position: relative; }
#section1{overflow: hidden;}
.msec1{position: relative;}
.msec1 .swiper-slide{overflow:hidden}
.msec1 .swiper-slide .slogan{position:absolute; z-index:10; top:30%; left:50%; transform: translateX(-50%); width:100%; padding:0 2rem; max-width:var(--container); }
.msec1 .swiper-slide .slogan p{color:#fff; font-weight: bold; position: relative; text-shadow: 0 0 0.5rem rgba(0,0,0,0.1); text-align: center;}
.msec1 .swiper-slide .slogan .text1{top:0; opacity:0; font-size:6rem; font-family: var(--font-eng); font-weight: 800; transition:0.5s 0.5s}
.msec1 .swiper-slide .slogan .text2{top:10px;opacity:0; filter: blur(10px); font-size:3.6rem;  transition:0.5s 1s}
/*.msec1 .swiper-slide .slogan .text2 span{color:var(--main_color)}*/
.msec1 .swiper-slide .slogan .text3{top:10px;opacity:0; filter: blur(10px); font-size:2.4rem;  transition:0.5s 1s}
.img01{position: absolute; top:20%; left: 60%;}

.msec1 .swiper-slide .bg{transform:scale(1.1);transition:10s; height:100vh; position: relative;}
.msec1 .swiper-slide .bg::before{content: ''; width: 100%; height: 100%; background: rgba(0,0,0,0.3); position: absolute; top: 0; left: 0;}
.msec1 .swiper-slide .bg img{width:100%; height: 100%; object-fit: cover;}

.msec1 .swiper-slide-active .bg{transform:scale(1)}
.msec1 .swiper-slide-active .slogan .text1{top:0;opacity:1; letter-spacing:normal;}
.msec1 .swiper-slide-active .slogan .text2{top:0;opacity:1; filter:blur(0)}
.msec1 .swiper-slide-active .slogan .text3{top:0;opacity:1; filter:blur(0)}

/*swiper*/
.msec1 .swiper-button-prev,
.msec1 .swiper-button-next{width: 5rem; height: 5rem; color:#fff; background: none; bottom:10rem; top:auto; font-size: 5rem; }

.msec1 .swiper-button-prev{left:auto; left: calc(80% - 5rem); }
.msec1 .swiper-button-next{left:auto;  left: 80%; right:0}
.msec1 .swiper-pagination{max-width:var(--container); font-weight: bold; padding:0 2rem; color:#fff; text-align: left; position: absolute; left: 50%; transform: translate(-50%);  bottom: 10rem;}

.msec1 .swiper-progress-bar {position:  absolute; left: 50%; transform: translate(-50%);; width:100%; max-width: var(--container); display: block; z-index: 1; height:.5rem; }
.msec1 .swiper-progress-bar .slide_progress-bar {position: absolute; height: .3rem; background:#fff; width:50rem; clear: both; opacity:1; bottom: 15rem; left: 50%; transform: translateX(-50%); right: 0; }
.msec1 .swiper-progress-bar .slide_progress-bar:after {position: absolute; top: 0; left: 0; background:var(--sub_color); height: 100%; width: 0; content: ""; transition: 0.1s width linear;}
.msec1 .swiper-progress-bar.active .slide_progress-bar {opacity: 1;}
.msec1 .swiper-progress-bar.animate .slide_progress-bar:after {transition: width linear;transition-delay: unset; width: 100%; transition-duration: 5s;}


/* pagenation */

/*.msec1 .swiper-pagination-bullet{opacity: 0.5; width: 15px; height: 15px; background: #fff; box-shadow: 0px 0px 3px #fff; }
.msec1 .swiper-pagination-bullet-active{background:#fff; opacity: 1;}
*/


.msec1 .swiper-pagination-bullet {
    background: transparent; width: 4rem; height: 4rem;
  }
  .msec1 .swiper-pagination-bullet-active .path {
    display: inline-block !important;
    stroke-dasharray: 1000;
    stroke-dashoffset: 0;
    -webkit-animation: dash linear 120s;
            animation: dash linear 120s;
    -webkit-animation-iteration-count: unset;
            animation-iteration-count: unset;
  }
  .path {
    display: none;
  }
  @-webkit-keyframes dash {
    from {
      stroke-dashoffset: 1000;
    }
    to {
      stroke-dashoffset: 0;
    }
  }
  @keyframes dash {
    from {
      stroke-dashoffset: 1000;
    }
    to {
      stroke-dashoffset: 0;
    }
  }

/* 제품소개 */
.main_product{padding: 10rem 0; background: url(../images/main/world_gray.png) no-repeat top right; position: relative;}
.main_product .inner{position: relative; overflow: hidden;}
.main_product h2{font-weight: bold; font-size: 4rem; margin-bottom: 5rem;}
.main_product h2 span{display: block; font-size: 3rem; color:var(--main_color); text-transform: uppercase;}

.product_slide .swiper-slide::before{content: ''; width: 100%; height: 50%; background: #9CA29E; border-top-right-radius: 5rem; position: absolute; bottom: 0; left: 0; z-index: -1;}
.product_slide .swiper-slide-active::before{content: ''; width: 100%; height: 80%; background:var(--main_color); border-top-right-radius: 5rem; position: absolute; bottom: 0; left: 0; z-index: -1;}

.product_slide p{text-align: center;}
.product_slide dl{padding:2rem 4rem; color:#fff;}
.product_slide dl dt{font-weight: bold; font-size: 3.4rem;}

.product_slide .swiper-scrollbar{display: block !important;  position: relative; width: 100%; left: 0; bottom: 0; margin-top: 5rem; }
.product_slide .swiper-scrollbar-drag{background: var(--main_color);}

/* 메인 하단 */
.main_bottom{background: url(../images/main/bottom_bg.jpg) no-repeat center; padding:14rem 0; color:#fff; position: relative;}
.main_bottom::before{content: ''; width: 100%; height: 100%; background: rgba(0,0,0,0.5); position: absolute; top: 0; left: 0;}
.main_bottom .inner{display: flex; gap:20rem}

.bottom_left{width: 50%; position: relative;}
.bottom_left h2{margin-bottom: 3.2rem;}
.bottom_left dl dt{font-weight: bold; font-size: 3.6rem; margin-bottom: 2.8rem;}
.bottom_left dl dd{font-size: 2rem;}

.notice_list{margin-top: 6.2rem;}
.notice_list a{display: flex; gap:2.7rem; color:#fff;}
.notice_list li{border-top:1px solid rgba(255,255,255,0.5); padding:2rem 0}
.notice_list p{text-align: center; font-size: 1.3rem;}
.notice_list p span{display: block; font-weight: bold; font-size: 3rem;}
.notice_list dl dt{font-weight: bold; font-size: 2rem; margin-bottom: 1.5rem;}
.notice_list dl dd{font-size: 1.5rem;}


.bottom_right{width: 50%;}
.bottom_box{display: flex; flex-wrap: wrap; gap:3rem; position: relative; margin-right: -3rem; }
.bottom_box a{background: #10461F; height: 21.2rem; display: block; padding:3rem; position: relative;color:#fff}
.bottom_box a span{position: absolute; top: 2rem; right: 2rem;}
.bottom_box a p{position: absolute; bottom: 2rem; left: 2rem; font-size:2.2rem;}
.bottom_box li:nth-child(1),
.bottom_box li:nth-child(2){width:calc(50% - 3rem)}
.bottom_box li:nth-child(2) a{background: #9CA29E; border-top-right-radius: 5rem;}
.bottom_box li:nth-child(3){width:calc(100% - 3rem);}
.bottom_box li:nth-child(3) a{background: var(--main_color);}