@charset "UTF-8";

.main-content-box03 .main-mini-wrap{position:relative;}
.main-content-box03 .main-noti-side-txt-box{position:absolute;top:-3px;left:-3px;height:100%;overflow:hidden;z-index:1;}
.main-content-box03 .main-noti-side-txt{font-size:20rem;line-height:1.2;letter-spacing:-0.04em;writing-mode:sideways-rl;white-space:nowrap;color:var(--white12);}
.main-content-box03 .main-mini-box{position:relative;padding:13rem 2rem;background:var(--color10) url(/_res/yonsei_rc/uc/img/main/bg-main-content03.png) no-repeat left bottom/cover;}
.main-content-box03 .main-noti-wrap{display:flex;justify-content:space-between;align-items:flex-start;gap:2rem;margin:0 auto;max-width:156rem;width:100%;box-sizing:border-box;}
.main-content-box03 .noti-left-box{flex:0 0 clamp(36rem, 30vw, 43.4rem);position:sticky;top:clamp(14rem, calc(13rem + 2vw), 18rem);z-index:1;}
.main-content-box03 .noti-title-box{padding:0 0 4.4rem;}
.main-content-box03 .noti-sub-title-box{padding:0 0 6.4rem;}

.main-content-box03 .noti-right-box{flex:1;min-width:0;max-width:70rem;}
.main-content-box03 .noti-right-box .mini-board-content{position:relative;cursor:none;}
.main-content-box03 .main-noti-list{display:grid;grid-template-columns:repeat(2, 1fr);gap:clamp(2rem, calc(4.47vw - 2.5rem), 6.4rem) clamp(2rem, calc(4.47vw - 2.5rem), 6rem);}
.main-content-box03 .main-noti-list > li{max-width:32rem;aspect-ratio:320/320;}
.main-content-box03 .main-noti-list > li:nth-of-type(2n){transform:translateY(11.7rem);}
.main-content-box03 .main-noti-list > li > a{display:block;position:relative;width:100%;height:100%;}
.main-content-box03 .main-noti-list .noti-box{display:flex;flex-direction:column;justify-content:space-between;position:relative;padding:3.2rem;height:100%;border-radius:2rem;background:linear-gradient(180deg, var(--white100) 0%, var(--color11) 100%);box-sizing:border-box;}
.main-content-box03 .main-noti-list .noti-box .news-date{display:inline-block;padding:0 0 2rem;font-weight:var(--font-weight-medium);font-size:2rem;line-height:1.5;letter-spacing:-0.02em;color:var(--color12);}
.main-content-box03 .main-noti-list .noti-box .noti-mini-tit{display:-webkit-box;font-weight:var(--font-weight-bold);font-size:2.4rem;line-height:1.5;letter-spacing:-0.025em;-webkit-line-clamp:2;-webkit-box-orient:vertical;text-overflow:ellipsis;color:var(--color13);overflow: hidden;}
.main-content-box03 .main-noti-list .noti-box .noti-more-box{display:flex;flex-shrink:0;justify-content:center;align-items:center;align-self:flex-end;width:5.2rem;height:5.2rem;border:1px solid var(--color14);border-radius:8px;box-sizing:border-box;}
.main-content-box03 .main-noti-list .noti-box .noti-more-box::before{content:'';display:inline-block;width:2.4rem;height:2.4rem;background:url(/_res/yonsei_rc/uc/img/main/btn-maon-noti01@2x.png) no-repeat center/100%;}

.main-content-box03 .noti-scroll-follow{display:flex;justify-content:center;align-items:center;position:absolute;top:0;left:0;width:8.8rem;aspect-ratio:1;border-radius:50%;backdrop-filter:blur(3px);font-weight:var(--font-weight-bold);font-size:1.6rem;line-height:1.4;letter-spacing:-0.025em;text-align:center;color:var(--color15);box-shadow:0px 4px 4px 0px var(--black40);pointer-events:none;opacity:0;transform:translate(-50%, -50%);transition:opacity 0.2s ease;z-index: 10;}
.main-content-box03 .noti-scroll-follow::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;padding:1px;border-radius:50%;background:linear-gradient(-45deg, var(--white100), var(--white00) 35%, var(--white00) 65%, var(--white100));-webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);-webkit-mask-composite:destination-out;mask-composite:exclude;}

.main-content-box03 .main-noti-list > li > a:hover .noti-box{background:var(--white12);backdrop-filter:blur(3px);overflow:hidden;}
.main-content-box03 .main-noti-list > li > a:hover .noti-box::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;padding:1px;border-radius:2rem;background:linear-gradient(-45deg, var(--white100), var(--white00) 35%, var(--white00) 65%, var(--white100));-webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);-webkit-mask-composite:destination-out;mask-composite:exclude;}
.main-content-box03 .main-noti-list > li > a:hover .noti-box::after{content:'';position:absolute;left:0;top:0;width:0%;height:2px;animation:mainNotiHover 5s linear infinite;offset-path:rect(0% auto 100% auto);background:linear-gradient(45deg, transparent, var(--white100), transparent);box-shadow: 0 0 3rem var(--white100);transition:0.3s ease;z-index:1;}
.main-content-box03 .main-noti-list > li > a:hover .noti-box .news-date{color:var(--white100);}
.main-content-box03 .main-noti-list > li > a:hover .noti-box .noti-mini-tit{color:var(--white100);}
.main-content-box03 .main-noti-list > li > a:hover .noti-more-box{border:1px solid var(--white100);}
.main-content-box03 .main-noti-list > li > a:hover .noti-more-box::before{background:url(/_res/yonsei_rc/uc/img/main/btn-maon-noti02@2x.png) no-repeat center/100%;}


@keyframes mainNotiHover {
    0% {
        offset-distance:0%;
    }
    100% {
        offset-distance:100%;
    }
    10%, 38%, 63%, 85% {
        width: 75%
    }
    0%, 25%, 50%, 75%, 100% {
        width: 0;
    }
}


@media screen and (max-width:1024.98px){
	.main-content-box03 .main-noti-side-txt-box{display:none;}
	.main-content-box03 .main-mini-box{padding:6.4rem 2rem;}
	.main-content-box03 .main-noti-wrap{flex-direction:column;gap:6.4rem;max-width:unset;}
	.main-content-box03 .noti-left-box{flex:unset;position:static;}
	.main-content-box03 .noti-title-box{padding:0 0 2.4rem;}
	.main-content-box03 .noti-sub-title-box{padding:0 0 2.4rem;}
	
	.main-content-box03 .noti-right-box{max-width:unset;width:100%;}
	.main-content-box03 .main-noti-list{grid-template-columns:1fr;gap:2rem;}
	.main-content-box03 .main-noti-list > li{max-width:unset;width:100%;height:22.4rem;aspect-ratio:unset;}
	.main-content-box03 .main-noti-list > li:nth-of-type(2n){transform:none;}
	.main-content-box03 .main-noti-list .noti-box .noti-btn-scroll{display:none;}
	.main-content-box03 .main-noti-list .noti-box .news-date{padding:0 0 8px;font-size:1.6rem;}
	.main-content-box03 .main-noti-list .noti-box .noti-mini-tit{font-size:2rem;}
	.main-content-box03 .main-noti-list .noti-box .noti-more-box{width:4rem;height:4rem;}
}