@charset "utf-8";

/*
 ** 메인
 */
/* 공통 */
.dis_flex_center {display:flex;align-items:center;justify-content:center}
.sf_swiper {position:relative}
.cont_ttl {display:block;padding-bottom:2.1vw;font-weight:600;font-size:2.6vw;line-height:53px;letter-spacing:-2.8px}
.main_cont.wt .cont_ttl {color:#fff}

.main_wrap {background:linear-gradient(to bottom, #efe5d9 43.3%, #1e1e1e 0%)}
.main_wrap .contents {overflow:hidden;padding-bottom:160px}
/* .contents.main::after {content:'';display:block;position:absolute;top:44.1%;width:100%;height:100%;background:#1e1e1e url('../images/web/background/bg_body.png') no-repeat top center;z-index:0} */

/* visual */
.main_visual {position:relative;height:100vh}
.main_visual img {width:100%;height:100%;object-fit:cover}
.main_visual .main_visual_text {position:absolute;bottom:260px;left:50%;margin-left:-39.6%;font-weight:600;font-size:50px;line-height:65px;letter-spacing:-0.5px;color:#ffffff}
.main_visual .swiper-slide {overflow:hidden}
.swiper-controls {display:flex;align-items:flex-end;position:absolute;bottom:50px;left:50%;transform:translateX(-50%);z-indeX:1}
.swiper-controls .swiper-pagination-bullets {display:flex;align-items:flex-end;column-gap:12px;margin-right:12px}
.swiper-controls .swiper-pagination-bullet {opacity:1;width:70px;height:2px;margin:0!important;border-radius:0;background-color:#ffffff;transition:all .2s;cursor:pointer}
.swiper-controls .swiper-pagination-bullet-active {height:5px}
.swiper-controls :where(.swiper-prev, .swiper-next) {width:10px;height:17px;background:no-repeat center/100% auto;cursor:pointer}
.swiper-controls .swiper-prev {margin-right:17px;background-image:url('../images/web/icon/ico_arr_left_10.png')}
.swiper-controls .swiper-next {background-image:url('../images/web/icon/ico_arr_right_10.png')}

/* 메인 swiper */
.main_cont {position:relative;max-width:1470px;margin:0 auto;z-index:1}
.main_swiper.sf_swiper {position:relative;margin:0 auto;box-sizing:border-box}
.main_swiper.sf_swiper::before {content:'';display:block;position:absolute;top:0;left:-100%;width:100%;height:calc(100% + 30px);background-color:#1e1e1e;z-index:2}
.cont_1 .main_swiper.sf_swiper::before {background-color:#efe5d9}
.main_swiper :where(.swiper-prev, .swiper-next) {position:absolute;top:50%;transform:translateY(-50%);width:4.323vw;height:4.427vw;border-radius:50%;background:no-repeat center/100% auto;box-sizing:border-box;z-index:2}
.main_swiper :where(.swiper-prev, .swiper-next):disabled {opacity:0.8}
.main_swiper .swiper-prev {left:-2.3vw;background-image:url('../images/web/icon/ico_arr_left_50.png')}
.main_swiper .swiper-next {right:-2.3vw;background-image:url('../images/web/icon/ico_arr_right_50.png')}
.main_swiper .col_item {overflow:hidden;position:relative;width:14.06vw;margin-right:30px;padding-top:22.24vw;border-radius:35px;transform:translate3d(0, 15px, 0);box-sizing:border-box}
.main_swiper .col_item .col_img {position:absolute;top:0;left:0;width:100%;height:100%;transition:all .4s}
.main_swiper .col_item:hover .col_img {transform:scale(1.04)}
.main_swiper .col_item .col_img img {width:100%;height:100%;object-fit:cover}
.main_swiper .col_item .col_txt {position:absolute;color:var(--color-wt);box-sizing:border-box;z-index:1}
.main_swiper .col_item .col_txt .ellipsis {overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;text-overflow:ellipsis}
.main_swiper .col_item .col_txt.top {top:0;left:0;width:100%;padding:10.2% 7% 10.2% 10.6%;background:rgba(0,0,0,0.8);font-weight:600;font-size:1.3vw;line-height:1.41;letter-spacing:-0.8px}
.main_swiper .col_item .col_txt.top .menu {display:block}
.main_swiper .col_item .col_txt.top .ellipsis {-webkit-line-clamp:1;max-height:48px}
.main_swiper .col_item .col_txt.bottom {bottom:0;left:0;width:100%;padding:4% 11.1% 2.2% 11.1%;background:rgba(0,0,0,0.65);font-weight:600;font-size:0.83vw;line-height:1.5}
.main_swiper .col_item .col_txt.bottom .date {display:block;margin-top:10px;font-size:0.73vw}
.main_swiper .col_item .col_txt.bottom .ellipsis {-webkit-line-clamp:2;height:2.5vw}
/* .main_swiper .col_item:nth-of-type(1) {transform:translate3d(0, 10px, 0)}
.main_swiper .col_item:nth-of-type(2) {transform:translate3d(0, 15px, 0)}
.main_swiper .col_item:nth-of-type(3) {transform:translate3d(0, 30px, 0)}
.main_swiper .col_item:nth-of-type(4) {transform:translate3d(0, 40px, 0)}
.main_swiper .col_item:nth-of-type(5) {transform:translate3d(0, 50px, 0)}
.main_swiper .col_item:nth-of-type(6) {transform:translate3d(0, 60px, 0)}
.main_swiper .col_item:nth-of-type(7) {transform:translate3d(0, 70px, 0)}
.main_swiper .col_item:nth-of-type(8) {transform:translate3d(0, 80px, 0)}
.main_swiper .col_item:nth-of-type(9) {transform:translate3d(0, 90px, 0)}
.main_swiper .col_item:nth-of-type(10) {transform:translate3d(0, 100px, 0)} */
.main_swiper .col_item .col_txt.brand {display:flex;align-items:center;justify-content:center;top:0;left:0;width:100%;height:100%}
.main_swiper .col_item .col_txt.brand img {width:auto;max-width:68%;max-height:20%}
.main_cont.scr .col_item {transform:translate3d(0, 0, 0);transition:transform .7s cubic-bezier(.25, .5, .75, 1)}
/* .main_cont.scr .col_item:nth-of-type(1) {transition-delay:.01s}
.main_cont.scr .col_item:nth-of-type(2) {transition-delay:.02s}
.main_cont.scr .col_item:nth-of-type(3) {transition-delay:.03s}
.main_cont.scr .col_item:nth-of-type(4) {transition-delay:.04s}
.main_cont.scr .col_item:nth-of-type(5) {transition-delay:.05s}
.main_cont.scr .col_item:nth-of-type(6) {transition-delay:.06s}
.main_cont.scr .col_item:nth-of-type(7) {transition-delay:.07s}
.main_cont.scr .col_item:nth-of-type(8) {transition-delay:.08s}
.main_cont.scr .col_item:nth-of-type(9) {transition-delay:.09s}
.main_cont.scr .col_item:nth-of-type(10) {transition-delay: .1s}
.main_swiper .col_item.swiper-slide-prev {transform:translate3d(0,0,0)} */

/* contents */
.cont_1 {padding-top:142px}
.cont_1 .col_item {border:1px solid #7D7D7D;box-shadow:5px 5px 6px 0px rgba(155,156,151,1)}

.cont_2 {padding-top:140px}

.cont_3 {padding-top:150px}

.cont_4 {padding-top:170px}

.cont_5 {padding-top:158px}
.cont_5 .col_item {width:17.71vw;padding-top:13.55vw}

/* 메인 video */
.main_video {width:100%;max-width:1120px;margin:0 auto;}
.main_video .video_wrap {overflow:hidden;position:relative;width:100%;height:0;margin:0 auto;padding-top:56.2%;border-radius:35px;box-shadow:1px 1px 10px 2px rgba(0,0,0,0.05);transform:translate3d(0, 15px, 0)}
.main_video .video_wrap .video {position:absolute;top:0;left:0;width:100%;height:100%;border-radius:20px;object-fit:cover}
.main_cont.scr .video_wrap {transform:translate3d(0, 0, 0);transition:transform .7s cubic-bezier(.25, .5, .75, 1);}


/* 해상도_1920 이상 */
@media screen and (width >= 1920px) {
    .cont_ttl {padding-bottom:40px;font-size:50px}
    .main_swiper :where(.swiper-prev, .swiper-next) {width:83px;height:85px}
    .main_swiper .col_item {width:270px;padding-top:430px}
    .main_swiper .col_item .col_txt.top {font-size:25px}
    .main_swiper .col_item .col_txt.bottom {font-size:16px}
    .main_swiper .col_item .col_txt.bottom .ellipsis {height:48px}
    .main_swiper .col_item .col_txt.bottom .date {font-size:14px}

    .cont_5 .col_item {width:340px;padding-top:260px}
    .cont_5 .col_item .col_text.bottom {padding:13.6px 38px 7.5px 38px}
}

/* 해상도_1470 */
@media screen and (max-width:1470px) {
    .main_cont {padding-left:60px;padding-right:60px}
    
    .cont_ttl {padding-bottom:26px;font-size:30px;line-height:1;letter-spacing:0px}
    
    /* 메인 swiper */
    .main_swiper .col_item {width:28%;margin-right:22px;padding-top:44.8%}
    .main_swiper .col_item .col_txt.top {padding-lefT:9%;font-size:2.5vw}
    .main_swiper .col_item .col_txt.bottom {padding:5% 5%;font-size:1.6vw}
    .main_swiper .col_item .col_txt.bottom .ellipsis {height:4.8vw}
    .main_swiper .col_item .col_txt.bottom .date {font-size:1.5vw;line-height:1}
    .main_swiper :where(.swiper-prev, .swiper-next) {width:9.6vw;height:9.6vw}
    .main_swiper .swiper-prev {left:-18px}
    .main_swiper .swiper-next {right:-18px}

    .cont_1 {padding-top:80px}
    .cont_1 .cont_ttl {font-size:35px}

    .cont_5 .col_item {width:40%;padding-top:31.5%}
}

/* 해상도_960 */
@media screen and (max-width:960px) {
    .pcDis {display:none!important}
    .moDis {display:block!important}

    .bg_line {top:42%}

    /* 메인 */
    .main_visual {height:480px}
    .main_visual .main_visual_text {bottom:27%;left:6.5%;margin-left:0;font-size:32px;line-height:40px;letter-spacing:0}
    .swiper-controls {bottom:25px}
    .swiper-controls .swiper-pagination-bullets {column-gap:6px;margin-right:6px}
    .swiper-controls .swiper-pagination-bullet {width:35px;height:2px}
    .swiper-controls .swiper-pagination-bullet-active {height:4px}
    .swiper-controls :where(.swiper-prev, .swiper-next) {width:5px;height:8px}
    .swiper-controls .swiper-prev {margin-right:8px}

    .main_cont {padding:50px 25px 0 25px}
    .main_wrap .contents {padding-bottom:37px}
}

/* 모바일ver_640 */
@media screen and (max-width:640px) {
    .main_swiper.sf_swiper::before {display:none}
    .main_swiper .col_item {width:46.67vw;height:80vw;margin-right:25px;border-radius:18px}
    .main_swiper .col_item .col_txt.top {padding:14px 12px;font-size:21px;line-height:28px}
    .main_swiper .col_item .col_txt.top .ellipsis {max-height:56px}
    .main_swiper .col_item .col_txt.bottom {padding:7px 14px 10px 14px;font-size:12px;line-height:18px}
    .main_swiper .col_item .col_txt.bottom .date {margin-top:8px;font-size:10px}
    .main_swiper .col_item .col_txt.bottom .ellipsis {height:36px}

    /* 메인 video */
    .main_video {width:auto;margin:0 -25px}
    .main_video .video_wrap {border-radius:0}
    .main_video .video_wrap .video {border-radius:0}

    .cont_5 .col_item {width:66.67vw;height:53.34vw}
}