@charset "utf-8";

/* 키비주얼 배경이미지 & 텍스트 기본 설정*/
.main_vis { width: 100vw; height: 100%; overflow: hidden; position: relative; }
.main_vis .inner { height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 100; }

.main_vis .swiper-container .vis { width: 100%; height: 100%; position: relative; overflow: hidden; }
.main_vis .swiper-container .vis .vis_bg { width: 100vw; height: 100%; position: absolute; top: 0; left: 0; }
.main_vis .swiper-container .vis .vis_bg::before { content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(0,0,0,0.15); z-index: 1; }

    /* vis_bg 샘플링 */
    .vis1 .vis_bg { background: url('/resources/img/main/main_vis_01.jpg') no-repeat center center/cover; }
    .vis2 .vis_bg { background: url('/resources/img/main/main_vis_02.jpg') no-repeat center center/cover; }
    .vis3 .vis_bg { background: url('/resources/img/main/main_vis_04.jpg') no-repeat center center/cover; }


    /* Parallax-slide 기본설정 */
    :after, :before, * { box-sizing: border-box; }

    .main_vis .parallax_slide .vis_wrap { width: 100%; height: 100vh; display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; z-index: 0; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition:all .4s ease; }
    .main_vis .parallax_slide .vis_wrap .swiper-container { width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
    .main_vis .parallax_slide .vis_wrap .swiper-container .swiper-slide { overflow: hidden; color: #fff; }
    .main_vis .parallax_slide .vis .vis_bg { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
    .main_vis .parallax_slide .inner.parallax-box { top: 0; left: 18.7%; }


/* 스와이퍼 컨트롤 버튼들*/
.main_vis .swiper-control { width: auto; position: absolute; left: 12.5vw; bottom: 240px; box-sizing: border-box; z-index: 5; }
.pagenation-bullet { display: flex; gap: 0 8px; }
.pagenation-bullet > span { width: 10px; height: 10px; background: rgba(255, 255, 255, 0.85); }
.pagenation-bullet .swiper-pagination-bullet-active { width: 24px; border-radius: 10px; }


/* 배경 & 텍스트 이중 스와이퍼 시 */
.main-txt-slide { width: 100%; height: 100%; background-color: rgba(0,0,0,0.55); position: absolute; top: 0; left: 0; z-index: 2; }
.main-txt-slide .main-txt { width: 100%; padding: 88px 0; text-align: center; position: absolute; left: 0; top: 40%; transform: translateY(-50%); } 

.main-txt-slide .main-txt::before,
.main-txt-slide .main-txt::after { content: ''; width: 45px; height: 40px; background: url('/resources/img/main/main_ico_quotes.png') no-repeat center/contain; position: absolute; left: calc(50% - 23px); opacity: 0.45; }
.main-txt-slide .main-txt::before { top: 0; }
.main-txt-slide .main-txt::after { bottom: 0; transform: rotateX(180deg) rotateY(180deg); }
.main-txt-slide .main-txt > p { font: 500 32px/155% 'SUIT'; color: #fff; }

.news-wrap { width: 920px; min-height: 195px; padding: 42px 80px 40px 12.5vw;  position: absolute; left: 0; bottom: 0; } 
.news-wrap::before { content: ''; width: 960px; height: 100%; background-color: rgba(0,0,0,0.55); transform: skewX(-10deg); position: absolute; left: -30px; bottom: 0; z-index: 1; }

.news-wrap .tit-box { width: 100%; color: #fff; position: relative; z-index: 5; }
.news-wrap .tit-box p { float: left; }
.news-wrap .tit-box p span.tit { display: inline-block; font: 500 22px/100% 'AlbertSans'; margin-right: 12px; }
.news-wrap .tit-box p span { font: 400 16px/140% 'SUIT'; }
.news-wrap .tit-box > a { display: block; color: #fff; font: 400 16px/100% 'AlbertSans'; position: relative; padding: 2px 0 2px 20px; float: right; }
.news-wrap .tit-box > a::before { content: ''; width: 11px; height: 1px; background-color: #fff; position: absolute; left: 0; top: 50%; }
.news-wrap .tit-box > a::after { content: ''; width: 1px; height: 11px; background-color: #fff; position: absolute; left: 5px; top: calc(50% - 5px); }

.news-wrap .news-box { padding-top: 32px; position: relative; z-index: 5; }
.news-wrap .news-box .cont a { display: flex; align-items: center; padding: 8px 0 5px; }
.news-wrap .news-box .cont a > p { color: #fff; font: 400 16px/100% 'SUIT'; }
.news-wrap .news-box .cont a > p.tit { width: calc(100% - 120px); height: 18px; line-height: 18px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.news-wrap .news-box .cont a > p.date { width: 120px; text-align: right; font-weight: 300; font-size: 14px; opacity: 0.8; }


.main-txt-slide .main-txt-kor { display: block; }
.main-txt-slide .main-txt-eng { display: none; }
.main-eng .main-txt-slide .main-txt-kor { display: none; }
.main-eng .main-txt-slide .main-txt-eng { display: block; }

.main-txt-slide .news-wrap-kor { display: block; }
.main-txt-slide .news-wrap-eng { display: none; }
.main-eng .main-txt-slide .news-wrap-kor { display: none; }
.main-eng .main-txt-slide .news-wrap-eng { display: block; }


@media screen and (max-width:1440px){
    .main-txt-slide .main-txt > p { font-size: 31px; }
    .news-wrap { width: 840px; padding: 42px 80px 40px; }
    .news-wrap::before { width: 860px; }

}
@media screen and (max-width:1366px){
    .main-txt-slide .main-txt::before,
    .main-txt-slide .main-txt::after { width: 40px; }
    .main-txt-slide .main-txt > p { font-size: 30px; }

    .news-wrap { width: 750px; }
    .news-wrap::before { width: 770px; }
}
@media screen and (max-width:1024px){
    .main-txt-slide .main-txt { padding: 72px 0; }
    .main-txt-slide .main-txt::before,
    .main-txt-slide .main-txt::after { width: 36px; height: 32px; }
    .main-txt-slide .main-txt > p { font-size: 26px; }

    .news-wrap { width: 100%; padding: 40px 48px; }
    .news-wrap::before { width: 100%; left: 0; transform: skew(0deg); }

    .main_vis .swiper-control { left: 40px; }
}
@media screen and (max-width:768px){
    .main-txt-slide .main-txt { padding: 64px 0; }
    .main-txt-slide .main-txt::before,
    .main-txt-slide .main-txt::after { width: 30px; height: 28px; }
    .main-txt-slide .main-txt > p { font-size: 22px; }

    /* 영문 */
    .main-eng .main-txt-slide .main-txt > p { display: inline; }
}
@media screen and (max-width:500px){
    .main-txt-slide .main-txt { padding: 48px 12px; top: 36%; opacity: 0; animation: mbFadeInUp 0.8s ease 0.9s 1 normal forwards; }
    .main-txt-slide .main-txt > p { display: inline; font-size: 18px; }
    .main-txt-slide .main-txt > p.wow.fadeInUp { animation: none; }

    .main_vis .swiper-control { left: 50%; transform: translateX(-50%); }
    .pagenation-bullet { gap: 0 6px; }
    .pagenation-bullet > span { width: 8px; height: 8px; }

    .news-wrap { padding: 28px; min-height: unset; }
    .news-wrap .news-box { padding-top: 16px; }
    .news-wrap .tit-box p span { display: block; margin-top: 6px; font: 300 14px/100% 'SUIT'; }
    .news-wrap .tit-box p span.tit { margin-top: 0; }

    .news-wrap .news-box .cont a { flex-direction: column; align-items: flex-start; }
    .news-wrap .news-box .cont a > p.tit { width: 100%; font-size: 15px; }
    .news-wrap .news-box .cont a > p.date { width: 100%; margin-top: 6px; font-size: 14px; text-align: left; }
    /* 영문 */
    .news-wrap .tit-box > a { position: absolute; right: 0; }
}

@keyframes mbFadeInUp {
    0% { opacity: 0; transform: translateY(-50%); }
    100% { opacity: 1; transform: translateY(-52%); }
}