@charset "UTF-8";

/* visual */
.visual{position:relative; padding:0 20px;}
.visual .inner{position:relative; max-width:1440px; height:74rem; margin:0 auto;}
.visual_slide{position:absolute !important; left:50%; top:50%; width:100vw; height:100%; transform: translate(-50%, -50%); z-index: -1;}
.visual_slide .swiper-slide img{width:100%; min-height:100%; object-fit: cover;}
.visual_slide_side{position:absolute !important; bottom:7rem; right:0; width:46rem; max-width:100%; height:9rem;}
.visual_slide_side .swiper-slide{position:relative; border-radius: 0.3rem; cursor: pointer; overflow: hidden;}
.visual_slide_side .swiper-slide::after{content:""; display:block; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.5);}
.visual_slide_side .swiper-slide.swiper-slide-thumb-active::after{outline:3px solid #B62B5B; outline-offset: -3px; background:rgba(0,0,0,0);}
.visual_slide_side .swiper-slide img{position:absolute; left:50%; top:50%; width:100%; transform: translate(-50%, -50%); height:100%; object-fit: cover;}
.visual .item{position:relative; padding:12rem 0; color:#fff; z-index: 1;}
.visual .item p{color:#C3E9FE; font-size:2rem; font-weight:500; line-height:1.6;}
.visual .item h2{margin:2.4rem 0; font-size:4.4rem; line-height:1.3; font-weight:400; font-family: 'Chungbuk-National-University';}
.visual .item h2 em{display:block; font-size:4.8rem; font-weight:700;}
.visual .assi{display:flex; gap:1.2rem;}
.visual .assi button{display:block; position:relative; width:7rem; height:7rem; border-radius: 50%; backdrop-filter: blur(4px);}
.visual .assi button::after{content:""; display:block; position:absolute; left:50%; top:50%; width:3.2rem; height:3.2rem; background-repeat: no-repeat; background-size:auto; background-position:50% 50%; transform: translate(-50%, -50%);}
.visual .assi .visual_prev_btn, 
.visual .assi .visual_next_btn{border: 1px solid rgba(255, 255, 255, 0.10); background: rgba(255, 255, 255, 0.10);}
.visual .assi .visual_prev_btn::after{background-image:url("../../../images/site/main/ico_prev.svg");}
.visual .assi .visual_next_btn::after{background-image:url("../../../images/site/main/ico_next.svg");}
.visual .assi .play::after{background-image:url("../../../images/site/main/ico_play.svg");} 
.visual .assi .pause::after{background-image:url("../../../images/site/main/ico_pause.svg");}

/* notice */
.notice{position:relative; margin:4rem 0 0;}
.notice .title{margin-bottom:3.4rem; padding-bottom:2rem; border-bottom:1px solid #151515; font-size:2.6rem; font-weight:700; font-family: 'Chungbuk-National-University';}
.notice_slide{overflow: hidden;}
.notice_slide .swiper-slide > a{display:block; padding:2rem; border:1px solid #DDD; border-radius: 0.6rem; transition: all .35s;}
.notice_slide .swiper-slide > a .tag{display:inline-block; margin-right:0.6rem; padding:0.6rem 1.4rem; border-radius: 10rem; font-size:16px; line-height:1.5;}
.notice_slide .swiper-slide > a .tag.type1{background-color:#F6E5EB; color:#DC001A;}
.notice_slide .swiper-slide > a .tag.type2{background-color:#E5F3F6; color:#0082BA;}
.notice_slide .swiper-slide > a .tag.type3{background-color:#F1E5F6; color:#4B00C3;}
.notice_slide .swiper-slide > a .date{color:#58616A; font-size:16px;}
.notice_slide .swiper-slide > a .tit{display:-webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; min-height:5.1rem; margin:1.4rem 0 2.6rem; font-size:1.8rem;}
.notice_slide .swiper-slide > a .more{display:inline-block; padding:0.4rem 1rem; border:1px solid rgba(0,0,0,0); border-radius: 0.3rem; background:#E2E6EA; color:#58616A; font-size:16px; transition: all .5s;}
.notice_slide .swiper-slide > a:hover,
.notice_slide .swiper-slide > a:focus{border-color:#555;}
.notice_slide .swiper-slide > a:hover .more,
.notice_slide .swiper-slide > a:focus .more{border-color:#58616A; background:#fff;}
.notice .assi{display:flex; align-items: center; gap:0.2rem; position:absolute; right:0; top:1rem;}
.notice .assi button{width:24px; height:24px; background-repeat: no-repeat; background-position:50% 50%; background-size:cover;}
.notice .assi button.swiper-button-disabled{opacity: 0.5;}
.notice .assi .notice_prev{background-image:url("../../../images/site/main/ico_prev_black.svg");}
.notice .assi .notice_next{background-image:url("../../../images/site/main/ico_next_black.svg");}
.notice .assi .pause{background-image:url("../../../images/site/main/ico_pause_black.svg");}
.notice .assi .play{background-image:url("../../../images/site/main/ico_play_black.svg");}

/* media query */
@media screen and (max-width:1440px){
    .visual .inner{height:600px;}
    .visual .item{padding:60px 0;}
}
@media screen and (max-width:1024px){
    .visual .inner{height:320px;}
    .visual .item{padding:40px 0;}
    .visual .item p{font-size:16px;}
    .visual .item h2{margin:10px 0 20px; font-size:30px;}
    .visual .item h2 em{font-size:34px;}
    .visual .assi button{width:44px; height:44px;}
    .visual .assi button::after{background-size:24px;}
    .visual_slide_side{bottom:30px; width:330px; height:64px;}
}
@media screen and (max-width:1024px) and (min-width:521px){
    .notice_slide.swiper-grid{height: auto;}
    .notice_slide.swiper-grid .swiper-slide{height: calc((100% - 1.6rem) / 2) !important;}
    .notice_slide .swiper-slide > a .tit{margin:14px 0 20px; font-size:18px;}
}
@media screen and (max-width:768px){
    .visual .item p{font-size:15px;}
    .visual .item h2{font-size:26px;}
    .visual .item h2 em{font-size:30px;}
    .visual .visual_slide_side{display:none;}
}
@media screen and (max-width:520px){
    .notice_slide{height: 520px;}
    .notice_slide.swiper-grid .swiper-slide{height: calc((100% - 42px) / 4) !important;}
    .notice_slide .swiper-slide > a{position:relative; display:block; height:100%; padding:14px 18px; box-sizing: border-box; background:#fff;}
    .notice_slide .swiper-slide > a .tag{padding: 4px 12px; font-size:14px;}
    .notice_slide .swiper-slide > a .date{font-size:14px;}
    .notice_slide .swiper-slide > a .tit{min-height: 48px; margin:8px 0 0; font-size:16px;}
    .notice_slide .swiper-slide > a .more{position:absolute; right:18px; top:14px; font-size:13px;}
}
@media screen and (max-width:365px){
    .notice_slide .swiper-slide > a .more{display:none;}
}

/* page load animation */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.visual .item p {
    animation: fadeInUp 1.2s cubic-bezier(0.16, 1, 0.3, 1) 0.15s both;
}

.visual .item h2 {
    animation: fadeInUp 1.2s cubic-bezier(0.16, 1, 0.3, 1) 0.35s both;
}

.visual .item .assi {
    animation: fadeInUp 1.2s cubic-bezier(0.16, 1, 0.3, 1) 0.55s both;
}

.visual_slide_side {
    animation: fadeInUp 1.2s cubic-bezier(0.16, 1, 0.3, 1) 0.7s both;
}

.notice {
    animation: fadeInUp 1.2s cubic-bezier(0.16, 1, 0.3, 1) 0.9s both;
}

@media (prefers-reduced-motion: reduce) {
    .visual .item p,
    .visual .item h2,
    .visual .item .assi,
    .visual_slide_side,
    .notice {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}