@charset "utf-8"; .index_wrap { line-height: 1; overflow: hidden; } 
.index_wrap .section { position: relative; /* height: 100vh; */padding-top: 14rem; padding-bottom: 10rem; } 
.index_wrap .section_wrap { width: 90%; margin: 0 auto; } 
/* 여기서부터 수정 */
.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: 51%; left: 50%; transform: translate(-50%, -50%); width: 100%; text-align: center; max-width: 1460px; 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: 4rem; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h2 { font-size: 3.6rem; line-height: 1.4; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1 { font-size: 10rem; transition: all .3s; line-height: 1; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1 span { font-weight: 400; display: block; font-size: 1.24em; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box p { font-size: 1.7em; line-height: 1.3; font-family: 'SUIT'; font-weight: 300; } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box h2 { line-height: 1.4; font-weight: 300; font-family: var(--font-eng); } 
.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info .img_box { margin-bottom: 4rem; } 
.index_wrap .mySwiper .swiper-slide .visual_info h2 strong { font-weight: 700; } 

/* .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); } 

@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 { 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 h2 { animation: text-up 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay: 0.4s; margin-right:4px; } 
.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 */
.control_wrap { display: flex; position: absolute; bottom: 11%; align-items: center; justify-content: space-between; flex-direction: row; left: calc(50% - 14rem); } 
.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: 8rem; border-radius: 0; height: 2px; background: #8d908b; 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; } 
.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: #fff; border-radius: unset; } 


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

 /* mouse wheel */
.mouse_wrap { position: absolute; bottom: 0; left: 9%; z-index: 99; opacity: 1; } 
.mouse_wrap span { display:block; color:#fff; z-index:999; font-weight:400; font-size: 14px; transform: rotate(270deg); position: relative; bottom: 36px; } 
.mouse_wheel { display:block; color:#fff; width: 2px; height: 11rem; background: #ffffff6b; position: relative; left: 50%; } 

/*mouse-wheel icon*/
 .mouse_wheel .moving_bar { animation: scrollDown 2s linear infinite; position:
 absolute; background: #fff; width: 2px; height: 4rem; } 
 @keyframes scrollDown { 0%,100% { top:0; } 
 50% { top: 80px; } 
 }
 
/* 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 */
.index_wrap .section .txt_box { text-align: center; margin-bottom: 6em; position: relative; } 
.index_wrap .section2 .inner { max-width: 1608px; margin: 0 auto; } 
.index_wrap .section h2 { margin-bottom: 2rem; } 
.index_wrap .section2 .inner .flex_box { display: flex; justify-content: center; } 
.index_wrap .section2 .inner .flex_box .box { flex: 0 1 31%; position: relative; } 
.index_wrap .section2 .inner .flex_box .box .info_box { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; color: #fff; } 
.index_wrap .section2 .inner .flex_box .box .info_box h3 { margin-bottom: 1rem; font-weight: 500; } 
.index_wrap .section2 .inner .flex_box .box { overflow: hidden; border-radius: 1.8rem; } 
.index_wrap .section2 .inner .flex_box .box img { transition: all .3s; } 
.index_wrap .section2 .inner .flex_box .box:hover img { transform: scale(1.2); } 

/* SECTION3 */
.index_wrap .section3 { background: url(../../img/main3_bg.jpg) no-repeat center center/cover; color: #fff; height: 100%; width: 100%; margin: 0 auto; position: relative } 
.index_wrap .section3 .arrow_box { display: flex; position: absolute; top: 70%; left: 50%; transform: translate(-50%, -50%); z-index: 100; width: 45%; justify-content: space-between; } 
.index_wrap .section3 .busi_swiper .swiper-wrapper { display: flex; align-items: flex-end; } 
.index_wrap .section3 .busi_swiper .swiper-slide { width: 24% !important; /* 5개 보이게 */
 transition: transform 0.3s ease, opacity 0.3s ease; transform: scale(0.85); border-radius: 10px; overflow: hidden; } 
.index_wrap .section3 .busi_swiper .swiper-slide .info_box { padding: 3rem 2rem; background: #fff; color: #222; } 
.index_wrap .section3 .busi_swiper .swiper-slide .info_box h3 { padding-bottom: 1rem; } 
.index_wrap .section3 .busi_swiper .swiper-slide .info_box p { /* height: 7rem; */ } 
.index_wrap .section3 .busi_swiper .swiper-slide.swiper-slide-active { transform: scale(1); z-index: 2; } 

/* SECTION4 */
.index_wrap .section4 { padding-top: unset; padding-bottom: unset; } 
.index_wrap .section4 .box { flex: 1; position: relative; overflow: hidden; } 
.index_wrap .section4 .box:hover img { transform: scale(1.2); } 
.index_wrap .section4 .box img { transition: all .3s; } 
.index_wrap .section4 .box .img_box img { display: block; width: 101%; } 
.index_wrap .section4 .box .info_box { color: #fff; position: absolute; left: 50%; top: 40%; transform: translate(-50%, -50%); text-align: center; } 
.index_wrap .section4 .box1 { position: relative; } 
.index_wrap .section4 .box1::before { content:''; display:block; position:absolute; left:0; top:0; width:100%; height:100%; background: #00000026; } 
.index_wrap .section4 .box .info_box p { padding: 2rem 0 4rem; } 
.index_wrap .section4 .box .info_box .more_btn { border: 1px solid #fff; border-radius: 50px; max; max-width: 22rem; margin: 0 auto; } 
.index_wrap .section4 .box .info_box .more_btn a { color: #fff; font-family: var(--font-fam); padding: 2rem; display: flex; justify-content: center; align-items: center; transition: all .3s; } 
.index_wrap .section4 .box .info_box .more_btn a i { left: 1rem; font-size: 2rem; transition: all .3s; } 
.index_wrap .section4 .box .info_box .more_btn:hover { background: #fff; color: #111; } 
.index_wrap .section4 .box .info_box .more_btn:hover a { color: #111; } 
.index_wrap .section4 .box .info_box .more_btn:hover a i { position: relative; left: 2rem; } 

/* SECTION5 */
.index_wrap .section5 { background: url(../../img/main4_bg.jpg) no-repeat center center/cover; color: #fff; height: 100vh; width: 100%; margin: 0 auto; position: relative } 
.index_wrap .section5 .inner { max-width: 1400px; margin: 0 auto; width: 94%; color: #fff; } 
.index_wrap .section5 .inner ul li { border-left: 1px solid #fff; padding: 0 3rem; flex: 1; } 
.index_wrap .section5 .inner ul li a { color: #fff; } 
.index_wrap .section5 .inner ul li h3 { font-family: var(--font-fam); } 
.index_wrap .section5 .inner ul li p { margin: 3rem 0; font-weight: 200; font-family: var(--font-eng); } 
.index_wrap .section5 .inner ul li .icon_box img { margin-left: 1rem; } 


/****************** RESPONSIVE SETTING ********************/
 @media (max-width: 1580px) { } 
 @media (max-width: 1300px){
 .index_wrap .section3 .arrow_box { width: 70%; } 
 }
 /* DESKTOP */
 @media (max-width: 1270px) { } 

 @media (max-width: 1080px){
 .index_wrap .section .txt_box h2 { padding-bottom: 2rem; } 
 .index_wrap .section .txt_box { margin-bottom: 6rem; } 
 .index_wrap .section2 .inner .flex_box .box .info_box p { font-size: 2rem !important; } 
 .index_wrap .section2 .inner .flex_box .box .info_box { width: 100%; } 
 .index_wrap .section3 .busi_swiper .swiper-slide { width: 48% !important; } 
 .index_wrap .section3 .arrow_box { width: 90%; } 
 .index_wrap .section3 .arrow_box .img_box { width: 6rem; } 
 .index_wrap .section4 .box { flex: 1 0 50%; height: 40rem; } 
.index_wrap .section4 .box .img_box img { height: 100%; object-fit: cover; } 
 .index_wrap .section4 .box .img_box { width: 100%; height: 100%; } 
 .index_wrap .section4 .box .info_box { top: 50%; } 
 .index_wrap .section4 .box .info_box p { padding: 2rem 0 3rem; } 
 .index_wrap .section5 { height: fit-content; padding-bottom: 16rem; } 
 .index_wrap .section5 ul { position: relative; top: -5rem; } 
 .index_wrap .section5 .inner ul li p { margin: 1.4rem 0; height: 10rem; } 
 .index_wrap .section5 .inner ul li p br { display:none; } 
 .index_wrap .section5 .inner ul li { height: 24rem; padding: 0 2rem; } 
 }
 @media (max-width: 768px){
 .index_wrap .section5 .inner ul li { padding: 0 2rem; flex: 1 0 45%; margin-bottom: 6rem; } 
 .index_wrap .section5 .inner ul li p { height: 7rem; } 
 .index_wrap .section5 { padding-bottom: 0; background: url(../../img/main4_bg_m.jpg) no-repeat bottom center/cover; } 
 }
 @media (max-width: 480px){
 .index_wrap .section1 .slider_1 { background-image: url(../../img/main_visual_1_m.jpg); } 
 .index_wrap .section1 .slider_2 { background-image: url(../../img/main_visual_2_m.jpg); } 
 .index_wrap .section1 .slider_3 { background-image: url(../../img/main_visual_3_m.jpg); } 
 .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box h2 { font-size: 2.2rem !important; } 
 .index_wrap .section { padding-top: 7rem; padding-bottom: 7rem; } 
 .index_wrap .section2 .inner .flex_box .box { flex: 0 1 100%; margin: 1rem 2rem; height: 180px; } 
 .index_wrap .section .txt_box { margin-bottom: 4rem; } 
 .index_wrap .section .txt_box p { font-size: 2rem !important; } 
 .control_wrap { left: 28%; } 
 
 /* 로딩바 애니메이션 */
 @-webkit-keyframes LoadingBar { 
 from { width:0px; } 
 to { width:100%; } 
 }
 @keyframes LoadingBar { 
 from { width:0px; } 
 to { width:100%; } 
 }
 .index_wrap .section3 .busi_swiper .swiper-slide { width: 60% !important; } 
 .index_wrap .section4 { padding-top: 0; padding-bottom: 0; } 
 .index_wrap .section4 .box .info_box { width: 84%; } 
 .index_wrap .section4 .box .info_box .more_btn a { padding: 1.2rem; font-size: 1.4rem; } 
 .index_wrap .section4 .box .info_box .more_btn { width: 80%; } 
 .index_wrap .section5 { background-size: cover; padding-bottom: 13rem; } 
 .index_wrap .section5 ul { top: 0; } 
 .index_wrap .section5 .inner ul li { margin-bottom: 3rem; height: auto; } 
 .index_wrap .section5 .inner ul li p { height: fit-content; } 
 .index_wrap .section5 .inner ul li .icon_box img { margin-top: 1rem; width: 5rem; height: 5rem; object-fit: contain; } 
 .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1 { font-size: 3rem !important; } 
 .section1 .mySwiper .swiper-slide .visual_wrap { top: 54%; } 
 .index_wrap .section h2 { margin-bottom: 0; } 
 .index_wrap .section2 .inner .flex_box .box .info_box h3 { font-size: 2.4rem !important; } 
 .index_wrap .section4 .box .info_box p { height: 11rem; display: flex; justify-content: center; align-items: center; } 
 .index_wrap .section3 .arrow_box { top: 14%; width: 80%; } 
 }