@charset "utf-8";

.slider-wrap { position: relative; height: 1000px; max-height: calc(100vh - 40px); overflow: hidden; }
/* .slider-wrap * { font-family: 'Pretendard-Regular'; } */
.slider-wrap .main-slider { position: relative; height: 100%; margin-bottom:0 !important; }
.slider-wrap .slick-list { height: 100%; }
.slider-wrap .slick-track { height: 100%; }
.slider-wrap .slick-slide { height: 100%;}
.slider-wrap .slick-slide > div { height: 100%; }
.slider-wrap .slide-item { position: relative; height: 100%; overflow: hidden; }
.slider-wrap .slide-item .bg {  z-index: -2; position: absolute; width: 100%; height: 100%; transform: scale(1.05); }
.slider-wrap .slick-current .bg { animation: mv_img forwards linear 3s; }
@keyframes mv_img {
    0% { transform: scale(1); }
    100% { transform: scale(1.05);  }
}
.slider-wrap .slide-item-1 .bg { background: url(/image/main/mv_bg1.jpg) no-repeat center/cover; }
.slider-wrap .slide-item-2 .bg { background: url(/image/main/mv_bg2.jpg) no-repeat center/cover; }
.slider-wrap .slide-item-3 .bg { background: url(/image/main/mv_bg3.jpg) no-repeat center/cover; }
.slider-wrap .slide-item-4 .bg { background: url(/image/main/mv_bg4.jpg) no-repeat center/cover; }
.slider-wrap .slide-item-5 .bg { background: url(/image/main/mv_bg5.jpg) no-repeat center/cover; }
.slider-wrap .slide-item-6 .bg { background: url(/image/main/mv_bg6.jpg) no-repeat center/cover; }
.slider-wrap .slick-slide .video { z-index: 1; position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
.slider-wrap .slick-slide .video video { min-width: 100%; min-height: 100%; max-width: 150%; }

.slider-wrap .slide-item .darkframe {  z-index: -1; position: absolute; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); }


@media (max-width: 1535px) {
    .slider-wrap { height: calc(450px + 20vw); }
}
@media (max-width: 1279px) {
    .slider-wrap { height: calc(350px + 15vw); }
}
@media (max-width: 1023px) {
    .slider-wrap { height: calc(330px + 13vw); }
}
@media (max-width: 767px) {
    .slider-wrap .slide-item .bg img { width: auto; min-width: 100%; max-width: initial; height: 100%; min-height: 100%; max-height: initial; }
}
@media (max-width: 524px) {
    .slider-wrap .slick-slide .video video { max-width: 200%; }
}
@media (max-width: 350px) {
    .slider-wrap .slick-slide .video video { max-width: 230%; }
}

/* 사이드 버튼 */
.main-slider .slick-arrow { display: none !important; }
.arrow_wrap { z-index: 49; position:absolute; left:50%; bottom:123px; transform:translatex(-50%); width: 300px; }
.arrow_wrap .mv_arrow { position: absolute; width: 32px; height: 32px; cursor: pointer; }
.arrow_wrap .arrow_left { left: 0; background: url(/image/main/mv_left.png) no-repeat center/cover; }
.arrow_wrap .arrow_right { right: 0; background: url(/image/main/mv_right.png) no-repeat center/cover; }
@media (max-width: 1279px) {
    .arrow_wrap .mv_arrow { top: 1px; width: 28px; height: 28px; }
    .arrow_wrap .arrow_left { left: 8px; }
    .arrow_wrap .arrow_right { right: 8px; }
}
@media (max-width: 639px) {
    .arrow_wrap .mv_arrow { top: 3px; width: 24px; height: 24px; }
    .arrow_wrap .arrow_left { left: 40px; }
    .arrow_wrap .arrow_right { right: 40px; }
}
/* 페이지 버튼 */
.main-slider .slick-dots { z-index:50; position:absolute; left:50%; bottom:100px; transform:translatex(-50%); width: 200px; font-size:0; }
.main-slider .slick-dots::after { content:""; display:block; clear:both; }
.main-slider .slick-dots > li { width:16.6666%; height:auto; padding-left:0; margin:0; box-sizing:border-box; float:left; }

@media (max-width: 1535px) {
    .arrow_wrap { bottom: 70px; }
    .main-slider .slick-dots { bottom: 47px; }
}
@media (max-width: 1023px) {
    .arrow_wrap { bottom: 60px; }
    .main-slider .slick-dots { bottom: 37px; }
}
@media (max-width: 639px) {
    .arrow_wrap { bottom: 50px; }
    .main-slider .slick-dots { bottom: 27px; width: 150px; }
}

.main-slider .slick-dots > li > button {
    width:100%;
    height:3px;
    background-color:rgba(255, 255, 255, 0.5);
    outline:none;
    position:relative;
    padding:0;
    color:inherit;
    line-height:normal;
    border: 0;
}

.main-slider .slick-dots > li > button::before {
    display:none;
}

.main-slider .slick-dots > li > button > .s-line-fill {
    content:"";
    width:0;
    height:3px;
    background-color:#fff;
    position:absolute;
    top:0;
    left:0;
    opacity:1;
}

.slider-wrap .slick-dots .slick-active > button > .s-line-fill {
    animation:slick-progressbar 4s 1;
    animation-fill-mode: forwards;
}

.slider-wrap[data-slick-autoplay-status="N"] .slick-dots .slick-active > button > .s-line-fill {
    animation-play-state:paused;
}

@keyframes slick-progressbar {
    0% {
        width:0%;
    }
    100% {
        width:100%;
    }
}

/* 페이지 버튼 인디케이터 */
.main-slider .slick-dots > li > button > .s-indicator {
    display: none !important;
    position:absolute;
    left:50%;
    bottom:0;
    transform:translatex(-50%);
    width:100%;
    overflow:hidden;
}

.main-slider .slick-dots > li > button > .s-indicator > .inner-txt {
    font-size:15px;
    font-weight:bold;
    white-space:nowrap;
    display:block;
    width:100%;
    transform:translatey(100%);
    opacity:0;
    transition:all .8s;
    color:#fff;
}

.main-slider .slick-dots > li > button:hover > .s-indicator > .inner-txt {
    transform:translatey(0);
    opacity:1;
    padding-bottom:5px;
}

/* 커스텀 */
.slide-item .contwrap { height: 100%; }

/* .txtbox */
.slider-wrap .slide-item .txtbox { position: relative; top: 50%; transform: translateY(-50%); text-align: left; }
.slider-wrap .slide-item .txtbox .txt1 { font-size: 82px; color: #fff; line-height: 1.3; letter-spacing: -0.025em; }
.slider-wrap .slide-item .txtbox .txt2 { font-size: 55px; color: #fff; line-height: 1.3; letter-spacing: -0.005em; }


.descwrap { z-index: 10; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.descwrap .contwrap { height: 100%; }
.descwrap .txtbox { position: relative; top: 50%; transform: translateY(-50%); text-align: left; }
.descwrap .txtbox .txt1 { font-family: 'GmarketSans'; font-weight: 300; font-size: 82px; color: #fff; line-height: 1.3; letter-spacing: -0.025em; }
.descwrap .txtbox .txt1 b { font-weight: 700; }
.descwrap .txtbox .txt2 { position: absolute; width: 100%; top: 0; left: 0; opacity: 0; font-weight: 300; font-size: 55px; color: #fff; line-height: 1.3; letter-spacing: -0.005em; transition: opacity 0.4s; }
.descwrap .txtbox .txt2.active { opacity: 1; }
.descwrap .txtbox .txt2 b { font-weight: 700; }
.descwrap .txtbox .txtwrap { position: relative; text-align: left; font-weight: 300; font-size: 55px; color: #fff; line-height: 1.3; letter-spacing: -0.005em; }
@media (max-width: 767px) {
    .descwrap .txtbox { top: 55%; text-align: center; }
    .descwrap .txtbox .txtwrap { text-align: center; }
}


/* target_dots */
.process_wrap { z-index: 30; position: relative; margin-top: 20px; text-align: left; }
.target_dots { position: relative; display: inline-block; }
.target_dots .slick-dots { z-index:50; width: 140px; height: 7px; font-size:0; border: 2px solid #f2f6f3; }
.target_dots .slick-dots::after { content:""; display:block; clear:both; }
.target_dots .slick-dots > li { position: relative; width: 33.3333%; height:100%; padding-left:0; margin:0; box-sizing:border-box; float:left; }

@media (max-width: 767px) {
    .process_wrap { margin-top: 15px; display: inline-block; }
    .target_dots .slick-dots { width: 130px; }
}
@media (max-width: 524px) {
    .process_wrap { margin-top: 10px; }
}

.target_dots .slick-dots > li > button {
    position: absolute; top: 0; left: 0;
    width:100%;
    height:100%;
    /* background-color:rgba(255, 255, 255, 0.5); */
    background-color:transparent;
    outline:none;
    padding:0;
    color:inherit;
    line-height:normal;
    border: 0;
}

.target_dots .slick-dots > li > button::before {
    display:none;
}

.target_dots .slick-dots > li > button > .s-line-fill {
    content:"";
    width:0;
    height:100%;
    background-color:#fff;
    position:absolute;
    top:0;
    left:0;
    opacity:1;
}

.target_dots .slick-dots .slick-active > button > .s-line-fill {
    animation:slick-progressbar2 4s 1;
    animation-fill-mode: forwards;
}
@keyframes slick-progressbar2 {
    0% {
        width:0%;
    }
    100% {
        width:100%;
    }
}

/* 페이지 버튼 인디케이터 */
.target_dots .slick-dots > li > button > .s-indicator {
    display: none !important;
    position:absolute;
    left:50%;
    bottom:0;
    transform:translatex(-50%);
    width:100%;
    overflow:hidden;
}

.target_dots .slick-dots > li > button > .s-indicator > .inner-txt {
    font-size:15px;
    font-weight:bold;
    white-space:nowrap;
    display:block;
    width:100%;
    transform:translatey(100%);
    opacity:0;
    transition:all .8s;
    color:#fff;
}

.target_dots .slick-dots > li > button:hover > .s-indicator > .inner-txt {
    transform:translatey(0);
    opacity:1;
    padding-bottom:5px;
}

/* mv_arrow */
.process_wrap .mv_arrow { position: absolute; top: -6px; width: 30px; height: 30px; cursor: pointer; }
.process_wrap .arrow_left { left: 0; background: url(/image/main/mv_left.png) no-repeat center/cover; }
.process_wrap .arrow_right { right: 0; background: url(/image/main/mv_right.png) no-repeat center/cover; }
@media (max-width: 1279px) {
    .process_wrap .mv_arrow { width: 28px; height: 28px; }
}
@media (max-width: 767px) {
    .process_wrap .mv_arrow { top: -4px; width: 24px; height: 24px; }
}

/* 메인비주얼 번호 */
.mv_number { display: none !important; margin-top: 5px; text-align: center; font-weight: 300; font-size: 18px; color: #fff; }