@charset "utf-8"; .index_wrap { line-height: 1.2; overflow: hidden; } 
.index_wrap .section { position: relative; margin-top: 14rem; margin-bottom: 14rem; } 
/* 여기서부터 수정 */
.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: 52%; left: 50%; transform: translate(-50%, -50%); text-align: center; color: #fff; } 
.section1 .mySwiper .swiper-slide .visual_wrap .txt_wrap1 { margin-bottom: 3rem; } 
.section1 .mySwiper .swiper-slide .visual_wrap .img_box { position: relative; border-radius: 15px; overflow: hidden; } 
.section1 .mySwiper .swiper-slide .visual_wrap .img_box h3 { position: absolute; z-index: 2; bottom: 10%; left: 50%; transform: translateX(-50%); width: 90%; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h2 { font-weight: 700; letter-spacing: -1px; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1 { transition: all .3s; line-height: 1; overflow: hidden; } 
.section1 .mySwiper .swiper-slide { overflow: hidden; } 
.section1 .mySwiper .swiper-slide .visual_wrap a .img_box:hover img { scale: 1.1; } 
.section1 .mySwiper .swiper-slide .visual_wrap a .img_box img { transition: all .3s; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_info p { line-height: 1.3; font-weight: 300; } 

/* .index_wrap .slider_1 { background-image: url(../img/main_visual_1.jpg); } 
.index_wrap .slider_2 { background-image: url(../img/main_visual_1.jpg); } 
.index_wrap .slider_3 { background-image: url(../img/main_visual_1.jpg); } */

.section1 .mySwiper .swiper-slide .slide_bg { height: 100vh; overflow: hidden; background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; } 
.bg-video { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: -1; } 
.bg-video__content { height: 100%; width: 100%; object-fit: cover; } 


@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 .slide_bg { animation: zoom_in 5000ms; transition: transform 5000ms ease-in-out, opacity 1000ms ease 0s; } 
.index_wrap .mySwiper .swiper-slide-active .txt_wrap1, .index_wrap .mySwiper .swiper-slide-active .txt_wrap2 { overflow:hidden; } 
.index_wrap .mySwiper .swiper-slide-active .title_box h1 strong { animation: text-up 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay:0.4s; } 
.index_wrap .mySwiper .swiper-slide-active .visual_info h2 { animation: text-up 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay: 0.4s; } 
.index_wrap .mySwiper .swiper-slide-active .visual_info p { animation: text-up 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay: 0.6s; } 

/* pagnation */
.control_wrap { display: flex; align-items: center; justify-content: space-between; flex-direction: row; } 
.control_wrap .swiper-pagination { text-align:left; position: relative; display: flex; justify-content: space-between; align-items: center; top: 0; } 
.control_wrap .swiper-pagination-bullet { width: 6rem; border-radius: 0; height: 2px; background: #ffffffbd; opacity:1; margin-right: 2rem; display: block; } 
.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, 
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 0.5rem; } 
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet em { position: absolute; top: -2.6rem; color: #fff; font-style: normal; font-size: 1.4rem; font-family: var(--font-fam); } 
.control_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active { position: relative; /* background:var(--main-color); */ } 
.control_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active::before { animation:LoadingBar 5s both; animation-delay: 0.3s; content:''; display:block; position:absolute; width: 100%; height: 100%; background:var(--main-color); border-radius: unset; } 

/* 로딩바 애니메이션 */
@-webkit-keyframes LoadingBar { 
 from { width:0px; } 
 to { width:100%; } 
 }
 @keyframes LoadingBar { 
 from { width:0px; } 
 to { width:100%; } 
 }

/* section1 하단 */
.section1 .bottom_box { position: absolute; z-index: 10; bottom: 6%; left: 50%; transform: translateX(-50%); display: flex; flex-direction: row; align-items: center; } 
.section1 .bottom_box .arrow_wrap { display: flex; color: #fff; margin-left: 2rem; } 
.section1 .bottom_box .arrow_wrap i { font-size: 2rem; } 
.section1 .bottom_box .arrow_wrap .play_btn { position: relative; width: 2rem; height: 2rem; display: flex; justify-content: center; align-items: center; margin: 0 1rem; } 
.section1 .bottom_box .arrow_wrap .play_btn i { position: absolute; top: 0; left: 0; opacity: 0; transition: opacity 0.3s ease; pointer-events: none; /* 클릭 충돌 방지 */ } 
.section1 .bottom_box .arrow_wrap > * { cursor: pointer; } 
 /* 초기 상태 — 재생 중이므로 pause 아이콘 보임 */
 .section1 .bottom_box .play_btn .xi-pause { opacity: 1; pointer-events: auto; } 
 /* 활성 상태 변경용 클래스 */
 .section1 .bottom_box .play_btn.playing .xi-pause { opacity: 1; pointer-events: auto; } 
 .section1 .bottom_box .play_btn.playing .xi-play { opacity: 0; } 
 .section1 .bottom_box .play_btn.paused .xi-pause { opacity: 0; } 
 .section1 .bottom_box .play_btn.paused .xi-play { opacity: 1; pointer-events: auto; } 

/* SECTION 공통 */
/* .bg { background: url(../img/main3_img.jpg) no-repeat center center/cover; color: #fff; height: 84%; width: 96%; margin: 0 auto; position: relative; } */

/* SECTION2 */
.section2 .top_box { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 3rem; } 
.section2 .top_box .more_btn a { font-size: 1.8rem; font-weight: 300; display: flex; align-items: center; } 
.section2 .top_box .more_btn a span { margin-right: 0.5rem; } 
.section2 .busi_swiper .slide_wrap { display: flex; flex-direction: row; align-items: stretch; } 
.section2 .busi_swiper .slide_wrap .swiper-slide { border: 1px solid #dcdcdc; height: 100%; padding: 4rem 2rem; text-align: center; } 
.section2 .busi_swiper .slide_wrap .swiper-slide h3 { text-align: center; font-weight: 300; padding-top: 2rem; height: 7rem; display: flex; align-items: center; justify-content: center; } 
.arrow_box .box_wrap { width: 6rem; height: 6rem; background: var(--main-color); color: #fff; display: flex; justify-content: center; align-items: center; position: absolute; top: 50%; z-index: 1; cursor: pointer; } 
.arrow_box .box_wrap i { font-size: 2rem; } 
.arrow_box .box_wrap.prev { left: -2%; } 
.arrow_box .box_wrap.next { right: -2%; } 


/* SECTION3 */
.index_wrap .section3 .box1 { background: url(../img/main3_img1.jpg) no-repeat 50% 50% /cover; color: #fff; width: 100%; margin: 0 auto; position: relative } 
.index_wrap .section3 .box2 { background: url(../img/main3_img2.jpg) no-repeat 50% 50% /cover; color: #fff; /* height: 100vh; */width: 100%; margin: 0 auto; position: relative } 
.section3 .box { padding: 8rem; flex: 1 0 50%; height: 80rem; } 
.section3 .box .txt_box { position: relative; z-index: 1; } 
.section3 .box .txt_box h2 { margin-bottom: 4rem; line-height: 1; font-family: var(--font-fam); } 
.section3 .box .txt_box p { font-size: 2.4rem; font-weight: 300; opacity: 0; transition: all .3s; } 
.section3 .overlab { display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #c3000091; z-index: 1; opacity: 0; transition: all .3s; } 
.section3 .box:hover .overlab { opacity: 1; } 
.section3 .box:hover p { opacity: 1; } 
.index_wrap .section3 { margin-bottom: 0 !important; } 

/* SECTION4 */
.index_wrap .section4 { background: #f1f0f1; padding: 14rem 0; margin-top: 0 !important; } 
/* SECTION5 */
.section5 .youtube_wrap { display: flex; gap: 3rem; } 
.index_wrap .section5 .youtube_wrap iframe { display: block; margin: 0 auto; margin-top: 9rem; } 
.section5 .tit_box { text-align: center; } 
.section5 .tit_box h2 { text-align: center; } 
.index_wrap .section5 .youtube_wrap iframe {display: block;margin: 0 auto;margin-top: 9rem;height: 400px;} 
/* SECTION6 */
.index_wrap .section6 { background: url(../img/main_img6.jpg) no-repeat 50% 50% /cover; color: #fff; margin: 0 auto; padding: 14rem; position: relative } 
.index_wrap .tit_box h2 { font-family: var(--font-fam); font-weight: 600; line-height: 1.1; margin-bottom: 3rem; } 
.index_wrap .tit_box p { font-size: 3.4rem; font-weight: 300; } 

/* SECTION7 */
.index_wrap .section7 .info_box { display: flex; justify-content: space-around; margin-top: 10rem; text-align: center; } 
.index_wrap .section7 .txt_box { margin-top: 2rem; } 
.index_wrap .section7 .txt_box h3 { margin-bottom: 1rem; } 
.index_wrap .section7 .txt_box p { font-weight: 300; } 

/* SECTION8 */
.index_wrap .section8 { background: url(../img/main8_img.jpg) no-repeat 50% 0% /cover; color: #fff; height: 100rem; width: 100%; margin: 0 auto; position: relative; padding-top: 14rem; position: relative; top: 0; } 

/****************** RESPONSIVE SETTING ********************/
 @media (max-width: 1580px) { } 
 @media (max-width: 1300px){
 .index_wrap .section2 .solu_sw_wrap { margin-left: 0; } 
 .index_wrap .section2 .solu_pg_wrap { margin-left: 3rem; } 
 .index_wrap .section2 .swiper-pagination-bullet { width: calc(100% / 8); } 
 .index_wrap .section2 .swiper-pagination-bullet.swiper-pagination-bullet-active { width: calc(100% / 5); } 
 .index_wrap .section2 .solu_swiper1 { margin-right: 0%; } 
 .index_wrap .section4 > .flex_box { margin-left: 4%; } 
 }
 /* DESKTOP */
 @media (max-width: 1270px) { } 

 @media (max-width: 1080px){
 .index_wrap .section { margin-top: 8rem; margin-bottom: 10rem; } 
 .index_wrap .section8 { margin-bottom: 0 !important; } 
 .section1 .mySwiper .swiper-slide .visual_wrap { top: 50%; } 
 .index_wrap .section .txt_box { margin-bottom: 3rem; } 
 .index_wrap .mySwiper .visual_info { line-height: 1; } 
 .index_wrap .section2 .solu_swiper2 { display: none; } 
 .index_wrap .section2 .solu_swiper1 { width: 100%; } 
 .index_wrap .section2 .swiper-pagination-bullet.swiper-pagination-bullet-active { width: calc(100% / 8); } 
 .index_wrap .section2 .solu_bottom_box { width: 59%; margin-left: 42%; } 
 .index_wrap .section2 .solu_pg_wrap { margin-left: 5rem; } 
.index_wrap .section3 .data_flex { max-width: unset; } 
 .section3 .box .txt_box p { opacity: 1; } 
 .section3 .box { padding: 8rem 5rem; height: 60rem; } 
 .section3 .box:hover .overlab { opacity: unset; } 
 .section3 .overlab { background: #07213c82; opacity: 1; } 
 .data_flex li a { padding: 5rem; } 
 .index_wrap .section4 .navi_box li { flex: 1; } 
 .index_wrap .section4 .box2 .img_box { height: 100%; object-fit: cover; } 
 .index_wrap .section4 .box2 .img_box img { height: 100%; object-fit: cover; } 
 .index_wrap .section4 { padding: 9rem 0px; } 
 .index_wrap .section2 .solu_sw_wrap { height: 45vh; } 
 .index_wrap .tit_box p { font-size: 3rem; } 
 .index_wrap .tit_box h2 { margin-bottom: 2rem; } 
 .index_wrap .section5 .youtube_wrap iframe { width: 100%; margin-top: 5rem; height: 53vw; } 
 .index_wrap .section6 { padding: 10rem 3rem; } 
 .index_wrap .section7 .info_box { margin-top: 6rem; } 
 .index_wrap .section7 .info_box img { max-width: 14rem; } 
 .index_wrap .section8 { height: 70rem; padding-top: 10rem; } 
 }
 @media (max-width: 768px) { } 
 @media (max-width: 480px){
 .section1 .arrow_box .box_wrap { width: 5.7rem; } 
 .section1 .arrow_box { top: 26%; } 
 .section1 .mySwiper .swiper-slide .visual_wrap { top: 52%; } 
 .main_visu_btn { width: 25rem; } 
 .section1 .mySwiper .swiper-slide .visual_wrap .visual_info p { width: 97%; margin: 0 auto; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h2 { letter-spacing: 0; } 
 .index_wrap .tit_box p { font-size: 2.2rem; } 
 .index_wrap .tit_box p br { display:none; } 
 .index_wrap .section { margin-top: 6rem; margin-bottom: 7rem; } 
 .index_wrap .section2 .v_btn span { font-size: 1.6rem; } 
 .index_wrap .section2 .solu_swiper1 .img_box { width: 180px; } 
 .index_wrap .section2 .info_box { margin-left: 6%; margin-right: 4%; flex: 1 1 50%; } 
 .index_wrap .section2 .solu_sw_wrap { height: 40vh; } 
 .index_wrap .section2 .solu_bottom_box { bottom: 0; margin-left: 41%; } 
 .data_flex li { flex: 1 0 100%; margin-right: 0; padding: 1.4rem; border-radius: 10px; } 
 .data_flex li:before { padding-bottom: 0; } 
 .data_flex li a { padding: 0; padding-top: 2rem; display: flex; justify-content: center; position: relative; } 
 .data_flex li a .bottom_box { display: flex; } 
 .data_flex li a > p { order: 2; padding-top: 1rem; font-size: 1.5rem !important; } 
 .data_flex li a .bottom_box .img_box { margin-right: 2rem; width: 40%; } 
 .data_flex li a .bottom_box .img_box img { width: auto; height: 8rem; margin: 0 auto; } 
 .section3 .box .txt_box p { font-size: 2.1rem; } 
 .section3 .box .txt_box p br { display:none; } 
 .index_wrap .section4 .box1 { width: 100%; margin-right: 4%; } 
 .index_wrap .section4 { padding: 4rem 0 1rem; } 
 .index_wrap .section4 .box2 { margin-right: 4%; } 
 .index_wrap .section4 .navi_box li h3 i { top: 0.5rem; } 
 .index_wrap .section .txt_box { margin-bottom: 0; } 
 .data_flex li a .bottom_box h3 { padding: 0 0 1rem; } 
 .section3 .box { height: auto; } 
 .index_wrap .section4 .navi_box li { width: 100%; margin-right: 0; flex: 0 1 100%; border: 1px solid #dcdcdc; padding: 1.4rem; border-radius: 10px; } 
 .index_wrap .section4 .navi_box li p { padding-top: 0rem; } 
 .index_wrap .section4 .navi_box li h3 i { width: 1.6rem; height: 1.6rem; } 
 .index_wrap .section .txt_box h2 { padding-bottom: 1rem; margin-bottom: 2rem; } 
 .arrow_box .box_wrap { width: 4rem; height: 4rem; } 
 .section2 .busi_swiper .slide_wrap .swiper-slide { padding: 3rem 2rem; } 
 .index_wrap .section5 .youtube_wrap iframe { margin-top: 0rem; } 
 .index_wrap .section6 { padding: 8rem 0; } 
 .index_wrap .section7 .info_box { margin-top: 0; } 
 .index_wrap .section7 .info_box img { width: 7rem; } 
 .index_wrap .section7 .info_box li { margin: 1%; } 
 }