@charset "utf-8"; .index_wrap .inner_wrap { max-width: 1580px; width: 90%; } 

.section1 .main_more_wrap { margin-top: 5rem; overflow: hidden; } 

.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); } 
 }

.index_wrap .mySwiper .swiper-slide.swiper-slide-active .slide_bg { animation: zoom_in 5000ms; transition: transform 5000ms ease-in-out, opacity 1000ms ease 0s; } 

.section1 .main_more_btn { color: #fff; font-size: 1.7rem; font-weight: 400; } 

.main_more_btn { display: inline-block; border: 1px solid #ffffff85; transition: all .4s; color: #fff; font-size: 1.7rem; font-weight: 400; } 

.swiper-slide-active .main_more_btn { animation: text-up 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay: 0.5s; } 

.main_more_btn a { color: #fff; font-size: 1.7rem; font-weight: 400; padding: 2rem 4rem; } 

.main_more_btn span { display: flex; flex-direction: row; align-items: center; } 

.main_more_btn span b { font-weight: inherit; margin-right: 1.5rem; } 

.main_more_btn span i { width: 4rem; height: auto; transition: all .4s; position: relative; left: 0; } 

.main_more_btn:hover { background: #f9f9f914; backdrop-filter: blur(9px); border: 1px solid #fff; } 

.main_more_btn:hover i { position: relative; left: 1rem; } 

.line_box { position: relative; margin-top: 0rem; padding-bottom: 3rem; } 

.swiper-slide.swiper-slide-active .main_line { display: block; position: absolute; left: 0; bottom: 3rem; --width: 100%; height: 2px; background: #fff; animation: line_left 2s; animation-fill-mode: forwards; } 

.index_wrap { line-height: 1; overflow: hidden; } 

/* .index_wrap::before { content: ''; display: block; width: 1px; height: 100%; background: #dcdcdc; left: 8rem; position: fixed; z-index: 10000; } 

.index_wrap::after { content: ''; display: block; width: 1px; height: 100%; background: #dcdcdc; top: 0; right: 8rem; left: unset; position: fixed; z-index: 10000; } */

.index_wrap .section1 { height: 100vh; border-bottom: 1px solid #dcdcdc; } 

.index_wrap .section1::after { content: ''; display: block; width: 100%; height: 1px; background: #dcdcdc; bottom: 10rem; position: absolute; } 

.index_wrap .section1 .swiper { width: 90vw; width: 96%; max-width: calc(100% - 16rem - 2px); height: calc(100vh - 20rem); overflow: hidden; position: absolute; top: 10rem; left: 50%; transform: translateX(-50%); } 

.index_wrap .section h2 { font-weight: 700; } 

.index_wrap .section_wrap { width: 90%; margin: 0 auto; } 

.section1 .mySwiper .swiper-slide .slide_bg { height: 80vh; overflow: hidden; background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; } 

.section1 .mySwiper .swiper-slide .slide_bg::before { content: ''; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #00000036; } 

.section1 .mySwiper .swiper-slide .visual_wrap { position: absolute; top: 35%; left: 50%; transform: translateX(-50%); width: fit-content; width: 94%; max-width: 1540px; color: #fff; font-size: 1.6rem; font-weight: 200; } 

.section1 .mySwiper .swiper-slide .visual_wrap .img_box { margin-top: 4rem; } 

.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h2 { font-size: 6.6rem; font-weight: 900; line-height: 1.3; font-family: var(--font-logo); } 

.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info h3 { font-size: 2.4rem; font-weight: 100; line-height: 1.6; font-family: var(--font-fam); } 

.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info h4 { font-size: 1.4em; font-weight: 200; } 

.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1 { font-size: 7em; transition: all .3s; line-height: 1; position: relative; } 

.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1 img { max-width: fit-content; width: 100%; } 

.section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h1 strong { text-shadow: 3px 2px 4px #676767; } 

.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 .visual_info .img_box { margin-bottom: 4rem; } 

.index_wrap .mySwiper .swiper-slide .visual_info h2 strong { font-weight: 700; } 

.sec1_arrow_box { width: 8rem; height: 10rem; background: var(--main-color); position: absolute; bottom: 0; } 

.sec1_arrow_box { display: flex; align-items: center; justify-content: center; } 

.sec1_arrow_box .img_box { max-width: 2.6rem; } 

.main_btn { margin-top: 9rem; transition: all .3s; border: 1px solid #dcdcdc; color: #666; display: flex; transition: all .3s; max-width: 28rem; width: 100%; } 
.main_btn:hover { border: 1px solid #999; } 
.main_btn span:nth-child(1) { width: 19rem; display: flex; align-items: center; padding-left: 2rem; height: 6.6rem; } 
.main_btn .arrow_box { width: 6.6rem; height: 6.6rem; background: #111; display: flex; align-items: center; justify-content: center; } 
.main_btn .arrow_box.rotate { transform: rotate(270deg); } 
.main_btn .arrow_box img { display: block; max-width: 3rem; transition: all .3s; left: 0; top: 0; } 

.main_btn:hover .arrow_box img { position: relative; left: 7px; top: 7px; } 
.main_btn:hover a { color: #222 } 

.main_btn a { display: flex; justify-content: space-between; align-items: center; flex-direction: row; flex-wrap: nowrap; color: inherit; } 

.main_btn a i { font-size: 25px; } 

.index_wrap .section1 .swiper-wrapper { transition-timing-function: linear; } 

.index_wrap .mySwiper .swiper-slide.swiper-slide-active .title_box, .index_wrap .mySwiper .swiper-slide.swiper-slide-active .visual_info { overflow: hidden; margin-bottom: 3rem; } 

.index_wrap .mySwiper .swiper-slide.swiper-slide-active .title_box h2 { animation: text-up 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; } 

.index_wrap .mySwiper .swiper-slide.swiper-slide-active .visual_info h3 { animation: text-up 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay: 0.2s; margin-right: 4px; } 

.index_wrap .mySwiper .swiper-slide.swiper-slide-active .visual_info h4 { animation: text-up 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay: 0.4s; margin-right: 4px; } 

.index_wrap .section3 .info_box >ul >li ul { overflow: hidden; } 

.index_wrap .section3 .info_box >ul >li.on ul li { animation: fadeInUp 1s cubic-bezier(0.4, 0, 0.2, 1) both; } 

/* pagnation */
.pg_line { display: flex; flex-direction: column-reverse; flex-wrap: nowrap; align-items: center; width: 1rem; height: 1rem; border-radius: 50%; background: #fff; } 

.arrow_wrap .swiper-pagination-bullet { } 

.arrow_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active::before { content: ''; display: block; position: absolute; width: 2rem; height: 2rem; border: 2px solid #ffff; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 50%; } 

.arrow_wrap .swiper-pagination { text-align: left; position: relative; display: flex; justify-content: space-between; align-items: center; top: 0; margin: 0 2rem; } 

.arrow_wrap .swiper-pagination span { height: 0.7rem; width: 0.7rem; opacity: 1; display: block !important; position: relative; border-radius: 50%; background: #fff; } 

.arrow_wrap .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .control_wrap .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet { margin-left: 0; width: 7px; height: 7px; border-radius: 50%; background: #ffffff45; position: relative; transition: all .4s; margin: 0; } 

.arrow_wrap .swiper-pagination > span.swiper-pagination-bullet.swiper-pagination-bullet-active { background: #ffffff00; } 

/* arrow_wrap */
.arrow_wide { position: absolute; color: #fff; left: 50%; transform: translateX(-50%); top: 68%; max-width: 1540px; width: 94%; z-index: 10; } 

.arrow_wrap { width: fit-content; display: flex; justify-content: space-between; width: 170px; width: 17rem; } 

.arrow_wrap .custom_prev, .arrow_wrap .custom_next { cursor: pointer; /* border: 1px solid #fff; */
 border-radius: 50%; width: 6rem; display: flex; align-items: center; justify-content: center; } 

.arrow_wrap .custom_prev i, .arrow_wrap .custom_next i { font-size: 2.3rem; } 

.sw_number_fraction { position: absolute; color: #fff; left: 50%; transform: translateX(-50%); top: 33%; max-width: 1540px; width: 94%; z-index: 10; font-size: 1.6rem; } 

.sw_number_fraction .sw_fraction { width: fit-content; display: flex; align-items: center; } 

.sw_number_fraction .sw_fraction span { display: block; } 

.sw_number_fraction .sw_fraction span.fr_bar { width: 3rem; height: 1px; background: #fff; ); margin: 0 1.5rem; } 

.sw_number_fraction .sw_fraction span.swiper-pagination-total { color: #ffffff94; } 

/* mouse wheel */
.cursor_circle { position: absolute; width: 15.3rem; height: 15.2rem; border-radius: 50%; right: 62%; top: -10%; z-index: 4; background: var(--main-color); } 

.cursor_circle:after { content: ''; display: block; width: 13.3rem; height: 13.2rem; position: absolute; top: 1rem; left: 1rem; background: url(../img/more_view.png) no-repeat center / cover; animation: cursor_circle 6s linear infinite; animation-delay: 0s; transition: 5s linear infinite; z-index: 0; } 

.cursor_circle .wrap { position: relative; width: 100%; height: 100%; } 
.cursor_circle .wrap a { position: relative; z-index: 1; } 
.cursor_circle .wrap::before { content:''; display:block; position:absolute; left:50%; top: 50%; transform: translate(-50%,-50%); width:3rem; background:#fff; height:2px } 
.cursor_circle .wrap::after { content:''; display:block; position:absolute; left:50%; top: 50%; transform: translate(-50%,-50%); width: 2px; background:#fff; height:3rem } 

.cursor_circle .wrap i { color: #fff; font-size: 4rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } 

.cursor_circle .wrap img { display: block; position: absolute; top: 45%; left: 45%; font-size: 2rem; color: #fff; font-weight: 100; line-height: 1.4; margin: 0 auto; text-align: center; } 

/* ani */
@-webkit-keyframes cursor_circle { 
 from { transform: rotate(0deg); } 

 to { transform: rotate(360deg); } 
 }

/* 로딩바 애니메이션 */
@-webkit-keyframes LoadingBar { 
 from { height: 0px; } 

 to { height: 100%; } 
 }

@keyframes LoadingBar { 
 from { height: 0px; } 

 to { height: 100%; } 
 }

/* SECTION2 */
.index_wrap .section h3 { padding-bottom: 2rem; font-family: 'Gowun Batang'; font-weight: 800; } 
.index_wrap .section.section2 { padding: 14rem 0; } 
.index_wrap .section.section2 .flex_box { display: flex; align-items: center; } 
.vertical { height: 5.7rem; display: block; background: #444; width: 1px; margin: 4rem 0; } 
.index_wrap .section.section2 b { color: #111; } 

/* SECTION3 */
.index_wrap .section.section3 { padding-bottom: 14rem; } 
.index_wrap .section.section3 .slider_wrap { position: relative; overflow: unset; } 
.index_wrap .section.section3 .slider_wrap .busi_navi { display: flex; position: absolute; top: 20%; right: 9%; z-index: 10; color: #666; justify-content: space-between; cursor: pointer; } 
.index_wrap .section.section3 .slider_wrap .busi_navi .arrow_bar { padding: 0; display: block; } 
.index_wrap .section.section3 .slider_wrap .busi_navi > div { } 
.index_wrap .section.section3 .slider_wrap .busi_navi span { padding: 0 2rem; } 
.index_wrap .section.section3 .swiper-slide.swiper-slide-active { height: 100%; } 
.index_wrap .section.section3 .swiper-wrapper { display: flex; align-items: flex-end; height: 60rem; } 
.index_wrap .section.section3 .swiper-slide { transition: all .4s; display: flex; flex-direction: column; justify-content: flex-end; } 

.index_wrap .section.section3 .swiper-slide.swiper-slide-next { } 
.index_wrap .section.section3 .swiper-slide .img_box img { } 
.index_wrap .section.section3 .swiper-slide.swiper-slide-next a .img_box { height: 100%; } 
.index_wrap .section.section3 .swiper-slide.swiper-slide-active a { height: 60rem; } 
.index_wrap .section.section3 .swiper-slide a { height: 40rem; overflow: hidden; transition: height .3s; } 
.index_wrap .section.section3 .swiper-slide a { } 
.index_wrap .section.section3 .swiper-slide a .img_box { height: 100%; } 
.index_wrap .section.section3 .swiper-slide a .img_box b { position: absolute; bottom: 4rem; left: 4rem; color: #fff; } 

/* SECTION4 */
.index_wrap .section.section4 { padding-bottom: 14rem; } 

/* SECTION5 */
.index_wrap .section.section5 { background: var(--main-color); padding: 10rem 0; } 
.index_wrap .section.section5 .flex_box { display: flex; align-items: center; } 
.index_wrap .section.section5 ul { display: flex; color: #fff; flex-direction: row; align-items: center; } 
.index_wrap .section.section5 ul li { width: 21rem; height: 21rem; border: 1px solid #fff; border-radius: 50%; display: flex; justify-content: center; align-items: center; text-align: center; line-height: 1.3; transition: all .3s; } 
.index_wrap .section.section5 ul li a { display: flex; align-items: center; justify-content: center; color: #fff; transition: all .3s; } 
.index_wrap .section.section5 ul li:hover a { color: var(--main-color); } 
.index_wrap .section.section5 ul li:hover { background: #fff; color: var(--main-color); } 
.index_wrap .section.section5 .box2 .career_txt { font-size: 9rem; color: #fff; } 


/* SECTION6 */
.index_wrap .section6 .partner_wrap { display: flex; justify-content: flex-start; flex-direction: row; align-items: center; position: relative; padding: 4rem 0; } 
.index_wrap .section6 .partner_wrap p { font-weight: 700; margin-left: 8%; margin-right: 6rem; } 
.index_wrap .section6 .part_slider_wrap { flex-grow: 1; width: 84%; display: flex; align-items: center; position: relative; } 
.index_wrap .section6 .partner_pg_wrap { width: 14rem; } 
.index_wrap .section6 .partner_pg_wrap .partner_pg { display: flex; align-items: center; font-size: 3.4rem; justify-content: space-between; width: 100%; } 
.index_wrap .section6 .part_slieder { position: relative; flex: 1; } 
.index_wrap .section6 .part_slieder::before { content: ''; display: block; position: absolute; left: 0; width: 5rem; height: 100%; background: linear-gradient(90deg, #fff, #11111100); z-index: 10; display: none; } 
.index_wrap .section6 .img_box { padding: 2rem 0; display: flex; align-items: center; justify-content: center; background: #fff; } 


/****************** RESPONSIVE SETTING ********************/
@media (max-width: 1580px){
 .index_wrap .section.section5 .box2 .career_txt { font-size: 8rem; } 
.index_wrap .section.section2 .flex_box .box1 { margin-right: 4%; } 
 .index_wrap .section.section2 { padding: 10rem 0; } 
 .index_wrap .inner_wrap { width: calc(100% - 30rem); } 
 .index_wrap .section.section3 .swiper-slide.swiper-slide-active a { height: 48rem; } 
 .index_wrap .section.section3 .swiper-slide a { height: 30rem; } 
 .index_wrap .section.section3 .swiper-wrapper { height: 50rem; } 
 .cursor_circle { top: -14%; } 
 .index_wrap .section.section3 .slider_wrap .busi_navi { top: 26%; } 
 }

/* DESKTOP */
@media (max-width: 1270px) { /* .fp-section, .fp-tableCell { height: auto !important; } 
.index_wrap .section1,.index_wrap .section2,.index_wrap .section3 { height: 100vh; } */
.index_wrap .section1 .swiper { width: 100%; max-width: calc(100% - 12rem); height: calc(100vh - 16rem); top: 6rem; } 
 .section1 .mySwiper .swiper-slide .slide_bg { height: 83vh; } 
 .index_wrap .section1 { height: 96vh; position: relative; } 
 .sec1_arrow_box { width: 6rem; height: 6rem; bottom: 0; } 
 .index_wrap .section1::after { bottom: 6rem; } 
 .index_wrap .section2 p br { display: none; } 
 .main_btn { margin-top: 5rem; } 
 .index_wrap .inner_wrap { width: calc(100% - 24rem); } 
.index_wrap .section.section3 .swiper-wrapper { height: 40rem; } 
 .cursor_circle { right: 29%; top: -24%; } 
 .index_wrap .section.section3 .box1 { margin-bottom: 6rem; } 
 .index_wrap .section.section3 .swiper-slide.swiper-slide-active a { height: 40rem; } 
 .index_wrap .section.section3 .swiper-slide .img_box img { object-fit: cover; height: 100%; width: 100%; max-width: unset; } 
 .index_wrap .section.section3 .slider_wrap .busi_navi { top: 13%; right: 4%; } 
 .index_wrap .section.section4 { padding-bottom: 10rem; } 
 .index_wrap .section.section5 .box2 .career_txt { font-size: 7rem; } 
 }

@media (max-width: 1080px){
 .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info h3 { font-size: 2.2rem; } 
 .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h2 { font-size: 5.2rem; } 
 .index_wrap .section.section5 .box2 .career_txt { font-size: 5.4rem; } 
 }

@media (max-width: 840px){
 .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h2 { font-size: 4.2rem; } 
 .index_wrap .section.section2 .flex_box .box1 { margin-right: 0; overflow: hidden; margin-bottom: 4rem; flex: 100%; } 
.index_wrap .section.section2 .flex_box .box1 .img_box { height: 40rem; position: relative; } 
 .index_wrap .section.section2 .flex_box .box1 .img_box img { position: absolute; top: -100px; } 
 .vertical { margin: 3rem 0; height: 5rem; } 
 .index_wrap .section.section5 .box2 { z-index: 0; } 
 .index_wrap .section.section5 ul { width: 100%; order: 1; } 
.index_wrap .section.section5 ul li { width: 33%; height: auto; position: relative; } 
 .index_wrap .section.section5 ul li a { } 
 .index_wrap .section.section5 ul li:before { content:''; display: block; padding-bottom: 100%; } 
 .index_wrap .inner_wrap { width: calc(100% - 20rem); } 
 .cursor_circle { width: 11rem; height: 11rem; right: 19%; } 
 .cursor_circle:after { width: 9rem; height: 9rem; } 
 .cursor_circle .wrap::before { width: 2rem; } 
 .cursor_circle .wrap::after { height: 2rem; } 
 .index_wrap .section.section3 { padding-bottom: 10rem; } 
 .index_wrap .section6 .partner_wrap { padding: 2.4rem 0; } 
 .index_wrap .section6 .img_box { padding: 1rem 0; } 
 .index_wrap .section6 .img_box img { height: 4rem; } 
 .index_wrap .section.section5 { padding: 5rem 0; } 
 .index_wrap .section.section3 .swiper-wrapper { height: 30rem; } 
 .index_wrap .section.section3 .swiper-slide a { height: 20rem; } 
 .index_wrap .section.section3 .slider_wrap .busi_navi { top: -119px; } 
 .index_wrap .section.section3 .slider_wrap .busi_navi span { padding: 0 1rem; } 
 .index_wrap .section.section3 .swiper-slide a .img_box b { left: 2rem; bottom: 2rem; } 
 .main_btn { max-width: 26rem; margin-top: 3rem; } 
 .main_btn span:nth-child(1) { height: 6rem; } 
 .main_btn .arrow_box { width: 6rem; height: 6rem; } 
 }

@media (max-width: 780px){
 .index_wrap .section.section3 .grid_4 { grid-template-columns: repeat(2, 1fr); } 
 .index_wrap .section.section3 .box::before { padding-bottom: 100%; } 
 }

@media (max-width: 480px){
 .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info h3 { font-size: 1.7rem; width: 70%; } 
 .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info h3 br { display:none; } 
 .section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h2 { font-size: 2.4rem; } 
 .index_wrap .section1 .swiper { max-width: calc(100% - 4rem); top: 6.7rem; } 
 .sec1_arrow_box { left: 2rem; } 
 .index_wrap .section.section2 { padding: 0; } 
 .index_wrap .inner_wrap { width: calc(100% - 4rem); } 
 .index_wrap .section.section2 .flex_box .box1 .img_box { height: 22rem; } 
 .index_wrap .section.section2 .flex_box .box2 { padding: 2rem; } 
 .index_wrap .section.section2 .flex_box .box1 { margin: 2rem 2rem 0 2rem; } 
 .vertical { margin: 2rem 0; height: 4rem; } 
.main_btn span:nth-child(1) { height: 4rem; } 
 .main_btn .arrow_box { width: 5rem; height: 4rem; } 
 .main_btn .arrow_box img { max-width: 2.6rem; } 
 .index_wrap .section.section3 .box1 { padding: 2rem; } 
 .index_wrap .section.section3 .slider_wrap .busi_navi { top: -46px; left: 2rem; right: unset; } 
 .cursor_circle { top: -15%; right: 15%; width: 9rem; height: 9rem; } 
 .cursor_circle:after { width: 7rem; height: 7rem; } 
 .index_wrap .section.section3 { padding-bottom: 4rem; } 
 .index_wrap .section.section4 { padding-bottom: 4rem; padding: 2rem 2rem 4rem 2rem; } 
 .index_wrap .section h3 { padding-bottom: 1rem; } 
 .index_wrap .section.section5 { padding: 3rem 2rem; } 
 .index_wrap .section.section5 .box2 .career_txt { font-size: 3rem; padding-bottom: 2rem; } 
 .index_wrap .section6 .img_box img { height: 3rem; } 
 .index_wrap .section6 .img_box { padding: 0; } 
.section1 .mySwiper .swiper-slide .visual_wrap { width: 90%; } 
 .sw_number_fraction { width: 90%; } 
 .arrow_wide { width: 90%; top: 65%; } 
 .main_btn { max-width: 20rem; } 
 .index_wrap .section.section4 .main_btn { margin-top: 2rem; margin-bottom: 1rem; height: 4rem; } 
 }
