@charset "utf-8";

.campus_recent{position: relative; background-color: #f3f8ff; line-height: 1.5; padding: 100px 0 155px;}
.campus_recent .container{max-width: 1860px; padding: 0 30px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between;}
.campus_recent .shadowImg{position: absolute; width: 21%; padding-bottom: 21%; border-radius: 15px; overflow: hidden; border: 1px solid #eaeaea; max-width: 400px; max-height: 400px; height: 100%;}
.campus_recent .shadowImg img{position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; transition: left .5s;}
.campus_recent .shadowImg p{display: none;}
.campus_recent .shadowImg_0{top: 250px; left: 50vw; transform: translateX(-52.5vw); opacity: 0;}
.campus_recent .shadowImg_1{top: 390px; left: 50vw; transform: translateX(-67.5vw); opacity: 0;}
.campus_recent .shadowImg_2{top: 250px; left: 50vw; transform: translateX(-43.6vw); opacity: 0;}
.campus_recent .shadowImg_3{top: 460px; right: 50vw; transform: translateX(32.9vw); opacity: 0;}
.campus_recent .shadowImg_4{top: 394px; right: 50vw; transform: translateX(56.7vw); opacity: 0;}
.campus_recent .shadowImg_5{top: 460px; right: 50vw; transform: translateX(42.7vw); opacity: 0;}
.campus_recent .shadowImg_6{top: 394px; right: 50vw; transform: translateX(56.7vw); opacity: 0;}
.campus_recent .campus-header{text-align: right; width: 100%; position: relative; right: -100px; opacity: 0; filter: blur(5px); transition: filter .3s;}
.campus_recent .campus-header h1{font-size: 50px; color: #000000; font-family: "SBA Medium"; position: relative; display: inline-block;}
.campus_recent .campus-header h1::before{content:""; display: block; position: absolute; left: -24px; top: -4px; width: 18px; height: 18px; background: url(../images/campus_dots.png);}
.campus_recent .campus-header p{font-size: 18px; color: #000000; letter-spacing: .025em; margin-top: 9px;}
.campus_recent .campus-header .campus-remote{display: flex; align-items: center; flex-wrap: wrap; justify-content: end; margin-top: 55px;}
.campus_recent .campus-header .campus-remote .current,
.campus_recent .campus-header .campus-remote .total{font-size: 16px; color: #333333; font-family: "SBA Medium";}
.campus_recent .campus-header .campus-remote .slick-dots{position: static; display: flex; flex-wrap: wrap; margin: 0 18px; width: 165px;}
.campus_recent .campus-header .campus-remote .slick-dots li{width: 33px; height: 2px; margin: 0;}
.campus_recent .campus-header .campus-remote .slick-dots li button{width: 100%; height: 100%; background-color: #c8c8c8; padding: 0;}
.campus_recent .campus-header .campus-remote .slick-dots li button::before{display: none;}
.campus_recent .campus-header .campus-remote .slick-dots li.slick-active button{background-color: #1174ff}
.campus_recent .campus-header .campus-remote .campus-playstop{margin: 0 15px;}
.campus_recent .campus-header .campus-remote .campus-playstop button{display: none; width: 24px; height: 24px; border-radius: 50%; background-repeat: no-repeat; background-position: center center; border: 1px solid #1174ff; font-size: 0;}
.campus_recent .campus-header .campus-remote .campus-playstop button.on{display: block;}
.campus_recent .campus-header .campus-remote .campus-playstop button.play {background-image: url(../images/news_play.png)}
.campus_recent .campus-header .campus-remote .campus-playstop button.stop {background-image: url(../images/news_stop.png)}
.campus_recent .campus-header .campus-remote .campus-arrow{margin-left: 18px;}
.campus_recent .campus-header .campus-remote .campus-arrow button{font-size: 0; width: 55px; height: 55px; border: 1px solid #d8d8d8; background-color: white; background-repeat: no-repeat; background-position: center center; border-radius: 50%; margin-right: 5px;}
.campus_recent .campus-header .campus-remote .campus-arrow button:last-child{margin-right: 0;}
.campus_recent .campus-header .campus-remote .campus-arrow button.campus-prev{background-image: url(../images/news_prev.png);}
.campus_recent .campus-header .campus-remote .campus-arrow button.campus-next{background-image: url(../images/news_next.png);}
.campus_recent .campus-header .campus-remote .campus-arrow button:hover{background-color: #efefef;}
.campus_recent .campus-header .campus-remote .campus-arrow button.campus-prev:hover{background-image: url(../images/news_prev_on.png);}
.campus_recent .campus-header .campus-remote .campus-arrow button.campus-next:hover{background-image: url(../images/news_next_on.png);}
.campus_recent .campus-header .campus-remote .campus-more{margin-left: 10px;}
.campus_recent .campus-header .campus-remote .campus-more a{display: inline-block; border-radius: 50px; font-family: "SBA Medium"; font-size: 12px; color: white; background: #1174ff; padding: 19px 47px 18px 21px; position: relative;}
.campus_recent .campus-header .campus-remote .campus-more a::after{content:""; display: block; position: absolute; right: 20px; top: 50%; margin-top: -5px; width: 10px; height: 10px; background: url(../images/more_white.png) no-repeat center center / cover; transition: transform .5s;}
.campus_recent .campus-header .campus-remote .campus-more a:hover::after{transform: rotate(180deg);}
.campus_recent .inner{margin-top: -130px; opacity: 0;}
.campus_recent .inner .list {max-width: 540px; position: relative; margin: 0 auto; left: -5.4%; border-radius: 15px; overflow: hidden;}
.campus_recent .inner .list .campus-image-box{margin-bottom: 0;}
.campus_recent .inner .list .campus-text-box{position: absolute; left: 0; bottom: 0; width: 100%;}
.campus_recent .inner .slick-slide .campus-list-box{position: relative; display: block !important; overflow: hidden;}
.campus_recent .inner .slick-slide .campus-list-box a:hover{text-decoration: underline;}
.campus_recent .inner .slick-slide .thumb{position: relative; padding-bottom: 113%;}
.campus_recent .inner .slick-slide .thumb img{position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s;}
.campus_recent .inner .list .campus-text-box .content::before{content:""; display: block; position: absolute; left: 50%; top: 0; transform: translateX(-50%); width: 200%; height: 200%; background-color: rgba(0,111,106,.8); text-align: center; border-top-right-radius: 50%; border-top-left-radius: 50%;}
.campus_recent .inner .list .campus-text-box .content > span{color: #ffffff; font-size: 18px;  line-height: 30px; display: inline-block; font-family: "SBA Light"; width: 100%;  padding: 50px 80px 45px; position: relative; z-index: 2; word-break: break-all; text-align: center;}
.campus_recent .inner .list .campus-text-box .content > span span{background-image: linear-gradient(#ffffff, #ffffff); background-repeat: no-repeat; background-position: left 0 bottom 0; background-size: 0 2px; transition: background-size .5s;}
.campus_recent .inner .list .campus-text-box :hover .content > span span{background-size: 100% 2px;}
.campus_recent .inner .slick-slide .campus-list-box:hover .thumb img{transform: scale(1.1);}

.mCSB_container .campus_recent .campus-header{right: 0; opacity: 1;}
.mCSB_container .campus_recent .shadowImg_1{opacity: 1;}
.mCSB_container .campus_recent .shadowImg_2{opacity: 1;}
.mCSB_container .campus_recent .inner{opacity: 1;}
.mCSB_container .campus_recent .shadowImg_3{opacity: 1;}
.mCSB_container .campus_recent .shadowImg_4{opacity: 1;}

@media screen and (min-width: 1921px) {
	.campus_recent .inner .list{left: -5.2vw;}
	.campus_recent .shadowImg{padding-bottom: 0;}
	.campus_recent .shadowImg_0{transform: translateX(-1860px); display: block;}
	.campus_recent .shadowImg_1{transform: translateX(-1400px);}
	.campus_recent .shadowImg_2{transform: translateX(-941px);}
	.campus_recent .shadowImg_3{transform: translateX(528px);}
	.campus_recent .shadowImg_4{transform: translateX(987px);}
	.campus_recent .shadowImg_5{transform: translateX(1445px); display: block;}
	.campus_recent .shadowImg_6{transform: translateX(1903px); display: block;}
}

@media screen and (max-width: 3300px) {
	.campus_recent .inner .list{left: -8.4vw;}
}

@media screen and (max-width: 1920px) {
	.campus_recent .inner .list{left: -5.4%;}
	.campus_recent .shadowImg_0,
	.campus_recent .shadowImg_5,
	.campus_recent .shadowImg_6{display: none;}
}

@media screen and (max-width: 1200px) {
	.campus_recent{padding: 78px 0 119px;}
    .campus_recent .campus-header{padding-right: 9px;}
	.campus_recent .campus-header h1{font-size: 30px;}
	.campus_recent .campus-header p{font-size: 14px; margin-top: 2px;}
	.campus_recent .campus-header .campus-remote{margin-top: 26px;}
	.campus_recent .campus-header .campus-remote .current,
	.campus_recent .campus-header .campus-remote .total{font-size: 14px; line-height: 24px;}
	.campus_recent .campus-header .campus-remote .slick-dots{margin: 0 10px; width: 125px;}
	.campus_recent .campus-header .campus-remote .slick-dots li{width: 12px;}
	.campus_recent .campus-header .campus-remote .campus-playstop{margin: 0 14px 0 0;}
	.campus_recent .campus-header .campus-remote .campus-arrow{margin-left: 28px;}
	.campus_recent .campus-header .campus-remote .campus-arrow button{width: 40px; height: 40px; background-size: 8px;}
	.campus_recent .campus-header .campus-remote .campus-more{flex-basis: 100%; margin-top: 30px;}
	.campus_recent .inner{margin-top: -112px;}
	.campus_recent .inner .list{max-width: 450px; width: 45vw; left: -16.3%;}
	.campus_recent .inner .slick-slide .thumb{padding-bottom: 111.12%;}
	.campus_recent .shadowImg{width: 30%; padding-bottom: 30%; height: auto;}
	.campus_recent .shadowImg_1{display: none;}
	.campus_recent .shadowImg_2{top: 246px; transform: translateX(-72.7vw);}
	.campus_recent .shadowImg_3{top: 437px; transform: translateX(39.5vw);}
	.campus_recent .shadowImg_4{top: 346px; transform: translateX(73vw);}
	.campus_recent .inner .list .campus-text-box .content > span{font-size: 16px; line-height: 26px; max-width: 450px; padding: 51.5px 40px 47.5px;}
}

@media screen and (max-width: 768px) {
	.campus_recent{padding: 44px 0 84px;}
	.campus_recent .container{padding: 0 20px;}
	.campus_recent .campus-header{width: 100%; position: relative; padding-right: 0;}
	.campus_recent .campus-header h1{font-size: 24px;}
	.campus_recent .campus-header p{font-size: 12px; margin-top: 13px;}
	.campus_recent .campus-header .campus-remote .campus-more{position:  absolute; left: 0; bottom: -4px; margin-top: 0; margin-left: 0;}
	.campus_recent .campus-header .campus-remote .campus-more a{padding: 13.5px 37px 13.5px 21px}
	.campus_recent .campus-header .campus-remote{margin-top: 16px;}
	.campus_recent .campus-header .campus-remote .current,
	.campus_recent .campus-header .campus-remote .total{font-size: 12px; line-height: 24px;}
	.campus_recent .campus-header .campus-remote .slick-dots{margin: 0 10px 0 12px; width: 100px;}
	.campus_recent .campus-header .campus-remote .slick-dots li{width: 20px;}
	.campus_recent .campus-header .campus-remote .campus-playstop{margin: 0 14px 0 0;}
	.campus_recent .campus-header .campus-remote .campus-arrow{margin-left: 20px;}
	.campus_recent .campus-header .campus-remote .campus-arrow button{width: 35px; height: 35px;}
	.campus_recent .inner .list{max-width: 300px; left: -.3%; width: 60vw;}
	.campus_recent .inner{margin-top: 38px;}
	.campus_recent .inner .slick-slide .thumb{padding-bottom: 113.4%;}
	.campus_recent .shadowImg{width: 44%; padding-bottom: 44%;}
	.campus_recent .shadowImg_2{top: 230px; transform: translateX(-80.4vw);}
	.campus_recent .shadowImg_3{top: 371px; transform: translateX(79.5vw);}
	.campus_recent .shadowImg_4{display: none;}
	.campus_recent .inner .list .campus-text-box .content > span{font-size: 12px; line-height: 22px; padding: 30px 25px 27px; max-width: 300px;}
}