.wrap_1720 {max-width: 1720px; margin: 0 auto; width: 100%;}
.main_wrap {overflow: hidden;}

#section01 {min-height: 100vh;}
.visualSlideBox {overflow: hidden; position: relative;}
.visualSlideBox ul li:nth-child(1){background:url('https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/batangseak/main_visual_img4.jpg') no-repeat center center; background-size:cover;}
.visualSlideBox ul li:nth-child(2){background:url('https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/batangseak/main_visual_img3.jpg') no-repeat center center; background-size:cover;}
.visualSlideBox ul li:nth-child(3){background: url('https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/batangseak/main_visual_img.jpg') no-repeat center center;
  background-size: cover;
}
.visualSlideBox ul li:nth-child(4){
  background: url('https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/batangseak/main_visual_img2.jpg') no-repeat center center;
  background-size: cover;
}


.visual_title {color:#fff; font-weight: 900; font-size:90px; margin-bottom:70px; line-height: 103px;}

.visual_sub_title {margin-left: 320px; width:650px; display: flex; color:#fff; font-size:20px;justify-content:space-around}
.visual_sub_title > span {font-size: 20px; font-weight: 300; font-family: 'Roboto';}
.visual_sub_title div span {display:block; font-size: 20px;}

.visual_content_inner {width: 1720px; height:100%; margin:0 auto;}
.visual_content_inner .text {transform: translateY(124%);}
.visualSlideBox .control_box {display: flex; flex-direction: row; position: absolute; left: 5%; bottom: 10%; z-index: 2; align-items: center;}
.visualSlideBox .control_box .btn_pause {width: 9px; height: 11px; background: url('/resources/img/main/btn_stop.png'); cursor: pointer; margin: 0 15px;}
.visualSlideBox .control_box .btn_pause.on {background: url('/resources/img/main/btn_start.png');}
.visualSlideBox .control_box .pager {display: flex; flex-direction: row;}
.visualSlideBox .control_box .pager button{opacity:.25;position:relative;display:flex;justify-content:center;align-items:center;width:auto;height:auto;border-radius:50%;font-size:15px;color:#fff;cursor:pointer;background:transparent;transition:.3s;font-family:var(--e-font); transform: scale(0.5);}
.visualSlideBox .control_box .pager button:before {display: block; position: absolute; top: -200px; writing-mode: vertical-rl; font-size: 25px; transform: rotate(180deg); opacity: 0; transition: all 0.2s;}
.visualSlideBox .control_box .pager button.on:before {opacity: 1;}
.visualSlideBox .control_box .pager button:nth-child(1):before {content: "|\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0 01";}
.visualSlideBox .control_box .pager button:nth-child(2):before {content: "|\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0 02";}
.visualSlideBox .control_box .pager button:nth-child(3):before {content: "|\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0 03";}
.visualSlideBox .control_box .pager button:nth-child(4):before {content: "|\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0 04";}
.visualSlideBox .control_box .pager button span{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%); font-size: 20px;}
.visualSlideBox .control_box .pager button.on{opacity:1}
.visualSlideBox .control_box .pager .progress{transform:rotate(-90deg)}
.visualSlideBox .control_box .pager .circle-origin{fill:transparent;stroke:rgb(255, 255, 255);stroke-width:1;stroke-linecap:round;stroke-dasharray:125.664px;stroke-dashoffset:125.664px}
.visualSlideBox .control_box .pager button.on .circle-origin{animation:progress 5s}
@keyframes progress{0%{stroke-dashoffset:125.664px}90%{stroke-dashoffset:0}100%{stroke-dashoffset:-125.664px}}
.visualSlideBox .navi_box {display: flex; flex-direction: row; align-items: center; position: absolute; right: 5%; bottom: 10%; z-index: 2;}
.visualSlideBox .navi_box .swiper-button-next, .visualSlideBox .navi_box .swiper-button-prev {position: relative; margin-top: 0; left: 0; width: 43px; height: 12px; background-size: 43px 12px;}
.visualSlideBox .navi_box .swiper-button-prev {background-image: url('/resources/img/main/btn_prev.png');}
.visualSlideBox .navi_box .swiper-button-next {background-image: url('/resources/img/main/btn_next.png');}
.visualSlideBox .navi_box p {color: #fff; margin: 0 15px; font-size: 9px; font-weight: 100;}

.visualSlideBox .scroll {position: absolute; bottom: 10%; left: 27%; z-index: 2;}
.visualSlideBox .scroll #spin_txt {position: absolute; left: 0; animation: rotate_image 6s linear infinite;transform-origin: 50% 50%;}
@keyframes rotate_image{
  100% {
      transform: rotate(-360deg);
  }
}

.title_box h5 {font-family: 'Roboto'; font-size: 30px; font-weight: 600;}
.title_box h4 {font-size: 60px; font-weight: 800; line-height: 81px; margin: 30px 0 20px;}
.title_box p {font-size: 20px; font-weight: 400;}

.flow_text {font-family: 'Roboto'; font-size: 180px; text-shadow: -2px 0px #e3e3e3, 0px 2px #e3e3e3, 2px 0px #e3e3e3, 0px -2px #e3e3e3; font-weight: 800; color: #fff; text-align: right; position: relative; left: 200px; margin: 60px 0;}

#section02 .wrap_1720 {display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end;}
.btn_more {display: flex; flex-direction: row; justify-content: center; align-items: center;}
.btn_more p {margin-right: 15px;}
#section02 .title_box {padding-top: 13vw;}
#section02 .scroll_box {position: relative;}
#section02 .scroll_box .content {width: 100%; height: 100vh;}
#section02 .scroll_box .content .img_wrap {position: absolute; top: 0; left: 50%; transform: translateX(-50%); height: 100%; overflow: hidden; margin: 0 auto; width: 50%; min-height: 100vh;}
#section02 .scroll_box .content .img_wrap > img {width: 100%; height: 100%; object-fit: cover;}
#section02 .scroll_box .content .text_box {position: absolute; top: 70vh; right: 0; width: 50%; transform: scale(0.8); }
#section02 .scroll_box .content .text_box li {margin-bottom: 350px;}
#section02 .scroll_box .content .text_box li h5 {font-size: 80px; font-weight: 600; color: #fff; opacity: 0.7; transition: all 0.2s; display: inline-block; line-height: 88px;}
#section02 .scroll_box .content .text_box li div {display: flex; flex-direction: row; align-items: center; justify-content: flex-start; opacity: 0; transition: all 0.2s; margin-top: 20px;}
#section02 .scroll_box .content .text_box li div p {font-size: 22px; color: #fff; margin-right: 10px;}
#section02 .scroll_box .content .text_box li:hover h5, #section02 .scroll_box .content .text_box li.active h5 {color: #fff; opacity: 1; font-weight: 800; background-size: 100% 1px; font-size: 85px;}
#section02 .scroll_box .content .text_box li:hover div, #section02 .scroll_box .content .text_box li.active div {opacity: 1;}


#section03 {background: url('/resources/img/main/section03_bg.jpg'); background-position: center; background-size: cover; width: 100%; height: 90vh; position: relative; display: flex; flex-direction: column; justify-content: center; overflow: hidden;}
#section03 .title_box {color: #fff; display: flex; flex-direction: column; align-items: flex-start;}
#section03 .btn_more {margin-top: 260px;}
#section03 .btn_more p {color: #fff;}
#section03 .wrap_1720 h1 {font-family: 'Roboto'; color: #9b9c9e; font-size: 9.375vw; font-weight: 600; position: absolute; top: 67%; left: 78%; transform: translate(-50%, -50%); opacity: 0.7;}
#section03 .content_box img {position: absolute;}
#section03 .content_box img:nth-child(1) {top: 23%; left: 50%; transform: translate(-50%, -50%);}
#section03 .content_box img:nth-child(2) {top: 40%; left: 82%; transform: translate(-50%, -50%);}
#section03 .content_box img:nth-child(3) {top: 57%; left: 58%; transform: translate(-50%, -50%);}
#section03 .content_box img:nth-child(4) {top: 88%; left: 35%; transform: translate(-50%, -50%);}

#section04 {background: url('/resources/img/main/section04_bg.jpg'); background-position: center; background-size: cover; width: 100%; height: 100vh;}
#section04 .wrap_1720 {height: 100%; display: flex; flex-direction: column; justify-content: center;}
#section04 .title_box {color: #fff;}
#section04 .content_box {display: flex; flex-direction: row; justify-content: space-evenly; gap: 1%; max-width: 1520px; width: 100%; margin: 0 auto; flex-wrap: wrap; opacity: 1;}
#section04 .content_box a {width: calc(93%/4); position: relative; background-size: 105%; background-position: center; border-radius: 25px; transition: background-size .5s ease; -moz-transition: background-size .5s ease; -web-kit-transition: background-size .5s ease; background-repeat: no-repeat;}
#section04 .content_box a:after {content: ""; display: block; padding-top: 158%;}
#section04 .content_box a:hover {background-size: 115%;}
#section04 .content_box a:nth-child(1) {background-image: url('/resources/img/main/section04_01.png'); }
#section04 .content_box a:nth-child(2) {background-image: url('/resources/img/main/section04_02.png'); }
#section04 .content_box a:nth-child(3) {background-image: url('/resources/img/main/section04_03.png'); }
#section04 .content_box a:nth-child(4) {background-image: url('/resources/img/main/section04_04.png'); }
#section04 .content_box a:nth-child(odd) {top: 30px;}
#section04 .content_box a div p {width: 100%; text-align: center; color: #fff; font-size: 20px; font-weight: 800; position: relative; top: 3vw;}

#section05 {padding: 10vw 0;}
#section05 .title_box {display: flex; flex-direction: row; justify-content: space-between; margin-bottom: 50px; align-items: flex-end;}
#section05 .title_box .btn_more {border: 1px solid #cccccc; padding: 3px 15px; border-radius: 20px; letter-spacing: 2px;}
#section05 .news_box ul li {border-bottom: 1px solid #e5e5e5; padding:30px 0;}
#section05 .news_box ul li:first-child {border-top: 1px solid #e5e5e5;}
#section05 .news_box .wrap_1720 {display: flex; flex-direction: row; align-items: center; justify-content: space-between; position: relative;}
#section05 .news_box .wrap_1720 > div {display: flex; flex-direction: row; align-items: center;}
#section05 .news_box .wrap_1720 .new_date::before {display: block; content: ""; height: 1px; width: 100%; background-color: #e5e5e5; margin-bottom: 40px;}
#section05 .news_box .wrap_1720 .new_date {color: #848484; font-weight: 300; position: relative}
#section05 .news_box .wrap_1720 .news_txt_box {padding-left: 10%;}
#section05 .news_box .wrap_1720 .news_txt_box h5 {font-size: 24px; font-weight: 600;}
#section05 .news_box .wrap_1720 .news_txt_box p {overflow: hidden; white-space: noraml; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: keep-all; font-size: 18px; color: #848484 ; margin: 20px 0 15px; max-width: 700px;}
#section05 .news_box .wrap_1720 .news_txt_box .banner {background: rgb(2,62,152);
  background: linear-gradient(142deg, rgba(2,62,152,0.8407738095238095) 39%, rgba(61,170,223,1) 64%); display: inline-block; color: #fff; padding: 5px 10px ; border-radius: 5px;}
#section05 .news_box .news_thumb {max-width: 500px; min-width: 500px; width: 100%; background-repeat: no-repeat; background-position: center; position: absolute; right: 0; top: -6px;}
#section05 .news_box .news_thumb::after {display: block; content: ""; padding-top: 27%;}

#section06 .tit_box h4 { font-family: 'Roboto'; font-size: 30px; font-weight: 700; text-align: center;}
#section06 .tit_box h5 { font-size: 24px; font-weight: 700; text-align: center;}
#section06 .swiper-slide > div {height: 225px; background: #f7f7f7; border-radius: 20px; display: flex; align-items: center; justify-content: center;}
#section06 .swiper-slide.in > div {background: #fff; border: 1px solid #e5e5e5; padding: 10%;}
#section06 .swiper-slide.in > div img {width: 100%;}
#section06 .swiper-slide.in p {font-size: 18px; text-align: center; margin-top: 10px;}
#section06 .swiper-wrapper {position: relative; left: -175px;}
#section06 .co-swiper {margin: 45px 0 180px; position: relative;}
#section06 .img_box {display: flex; flex-direction: row; justify-content: center; margin: 45px 0 180px;}
#section06 .img_box > div > div {width: 300px; height: 220px;border-radius: 20px; display: flex; align-items: center; justify-content: center;border: 1px solid #e5e5e5; padding: 10%; margin: 0 10px;}
#section06 .img_box > div p {font-size: 18px; text-align: center; margin-top: 10px;}
#section06 .co_control {display: block; position: absolute; right: 50px; top: -40px; width: 148px;}
#section06 .swiper-button-next, #section06 .swiper-button-prev {width: 44px; height: 11px; background-size: auto;}
#section06 .swiper-button-next, #section06 .swiper-container-rtl .swiper-button-prev {background-image: url('/resources/img/main/co_next.png');}
#section06 .swiper-button-prev, #section06 .swiper-container-rtl .swiper-button-next {background-image: url('/resources/img/main/co_prev.png');}
#section06 .swiper-button-prev::after {content: "|"; display: block; position: absolute; right: -23px; top: -6px;}



@media screen and (max-width: 1800px) {
  .wrap_1720 {padding: 0 20px;}

  #section05 .news_box .news_thumb  {right: 20px;}
}

@media screen and (max-width: 1350px) {


  #section05 .news_box .news_thumb  {position: relative; right: 0; max-width: 100%; min-width: 100%; max-height: auto; background-size: cover;}
  #section05 .news_box .wrap_1720 > div {flex-direction: column; align-items: flex-start;}
  #section05 .news_box .wrap_1720 .news_txt_box {padding-left: 0;}
  #section05 .news_box .wrap_1720 .news_txt_box p {max-width: inherit; }
  #section05 .news_box .wrap_1720 .new_date::before {width: 150%; margin-bottom: 0; position: absolute; right: -125px; top: 9px;}
}

@media screen and (max-width: 1024px) {
  .title_box h5 {font-size: 4.16vw;}
  .title_box h4 {font-size: 8.333vw; line-height: 9.5vw;}
  .title_box p {font-size: 3.611vw;}
  .btn_more {margin-top: 20px;}
  .btn_more img {width: 5vw; height: 5vw;}
  .visualSlideBox .scroll, .visualSlideBox .navi_box, .visualSlideBox .control_box .btn_pause {display: none;}

  .visualSlideBox .control_box {bottom: 4%;}
  .visualSlideBox {height: 100vh; height: -webkit-fill-available; height: fill-available;}
  .visualSlideBox ul li:nth-child(1){background:url('https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/batangseak/m_main_visual_img4.jpg') no-repeat center center; background-size: cover;}
  .visualSlideBox ul li:nth-child(2){background: url('https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/batangseak/m_main_visual_img3.jpg') no-repeat center center; background-size: cover;}
  .visualSlideBox ul li:nth-child(3){background: url('https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/batangseak/m_main_visual_img.jpg') no-repeat center center; background-size: cover;}
  .visualSlideBox ul li:nth-child(4){background: url('https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/batangseak/m_main_visual_img2.jpg') no-repeat center center; background-size: cover;}
  .visualSlideBox .control_box .pager button:before {top: -110px;}
  .visual_content_inner .text {transform: translateY(95%);}
  .visual_title {font-size: 10.278vw; margin-bottom: 40px; line-height: 50px;}
  .visual_title h3:last-child {margin-left: 0;}
  .visual_sub_title {margin-left: 0; flex-direction: column;}
  .visual_sub_title > span {font-size: 3.611vw; margin-bottom: 40px;}
  .visual_sub_title div span {font-size: 3.611vw;}


  .flow_text {left: 150px; font-size: 20.417vw;}
  #section02 .wrap_1720 {flex-direction: column; justify-content: center; align-items: flex-start;}
  #section02 .scroll_box .content .text_box {width: 65%;}
  #section02 .scroll_box .content .text_box li {margin-bottom: 100px;}
  #section02 .scroll_box .content .text_box li h5 {font-size: 8.333vw; line-height: 11vw; opacity: 1;}
  #section02 .scroll_box .content .text_box li:hover h5, #section02 .scroll_box .content .text_box li.active h5 {font-size: 8.9vw;}
  #section02 .scroll_box .content .text_box li div {opacity: 1;}
  #section02 .scroll_box .content .text_box li div p {font-size: 4.333vw;}
  #section02 .scroll_box .content .text_box li div img {width: 7.333vw;}

  #section03 {background-position: 25%; height: auto; padding-top: 50px;}
  #section03 .content_box {position: relative; padding-bottom: 125vw;}
  #section03 .btn_more {margin-top: 20px;}
  #section03 .title_box {margin-bottom: 30px;}
  #section03 .content_box img {width: 35vw;}
  #section03 .content_box img:nth-child(1) {top: 12%;}
  #section03 .content_box img:nth-child(2) {}
  #section03 .content_box img:nth-child(3) {left: 40%;}
  #section03 .content_box img:nth-child(4) {left: 25%;}
  #section03 .wrap_1720 h1 {top: 81%; font-size: 20.375vw;}

  #section04 {height: auto; padding: 150px 0; background-position: 38%;}
  #section04 .content_box {gap: 3%; padding: 30px 0;}
  #section04 .content_box a {width: calc(95%/2); margin-bottom: 3%;}
  #section04 .content_box a:nth-child(odd) {top: 0;}
  #section04 .content_box a div p {font-size: 3.61vw; top: 8vw;}

  #section05 {padding: 80px 0 80px 0}
  #section05 .title_box {margin-bottom: 30px;}
  #section05 .news_box .wrap_1720 .news_txt_box h5 {font-size: 5vw;}
  #section05 .news_box .wrap_1720 .news_txt_box p {font-size: 3.611vw;}
  #section05 .news_box .news_thumb {margin-top: 15px;}

  #section06 .swiper-slide > div {height: 130px;}
  #section06 .swiper-slide.in > div img {width: 100%;}
  #section06 .swiper-slide > div {padding: 10%;}
  #section06 .swiper-wrapper {left: -75px;}

}
@media screen and (max-width: 640px) {
  #section06 .img_box > div {width: calc(85%/2);}
  #section06 .img_box > div > div {width: 100%; height: 130px; margin: 0; padding: 5%;}
  #section06 .img_box > div > div img {width: 100%;}
  #section06 .img_box {gap: 10px;}
  #section06 .img_box > div p {font-size: 16px;}
  #section06 .co-swiper {margin: 90px 0 180px;}
  #section06 .co_control {top: -15%; left: 50%; right: inherit; transform: translate(-50%, -50%);}
  #section06 .swiper-button-prev::after {top: -4px;}
  #section06 .swiper-slide.in p {font-size: 3.5vw;}
}
