@charset "utf-8";
/* 새글 스킨 (latest) */
.youtube_latest_mix {display:flex;  position: relative;  padding-left: calc(100% - 1540px);}
.youtube_latest_mix .left {width: 65%;overflow:hidden}
.youtube_latest_mix .left a {position: relative; ;}
.youtube_latest_mix .left a > img {width: 100%;}
.youtube_latest_mix .left a > .txt_box {width: 100%;transition: all 0.2s linear;  padding:2rem; height: 6rem;background: rgb(0 0 0 / 70%); color:#fff;	position: absolute; left:0; bottom:-6rem;z-index:1;}
.youtube_latest_mix .left a:hover > .txt_box {bottom:0;}
.youtube_latest_mix .right {width: 35%;}
.youtube_latest_mix .right ul {margin-left:3rem; height: 100%; display: flex;flex-direction: column; justify-content: space-between;	}
.youtube_latest_mix .right ul li { }
.youtube_latest_mix .right ul li:last-child {margin-bottom: 0;}
.youtube_latest_mix .right a {display:flex; align-items: center; cursor: pointer; }
.youtube_latest_mix .right a > .img_box {width: 40%;}
.youtube_latest_mix .right a > .img_box  img {width: 100%;}
.youtube_latest_mix .right a > .txt_box {width: 60%; transition: all 0.2s linear; padding-left:1rem; color:#777; font-size: .9em;}
.youtube_latest_mix .right a:hover .txt_box {text-decoration:underline; font-weight: bold;}

.youtube_latest_mix .youtube_box .img_box{cursor: pointer;}
.youtube_latest_mix .youtube_box .img_box img {width: 100%;display: block;}


@media screen and (max-width: 1024px) {
	.youtube_latest_mix {flex-direction: column;}
	.youtube_latest_mix .left {width: 100%;}
	.youtube_latest_mix .right {width: 100%; margin-top: 1rem;}
	.youtube_latest_mix .right ul {margin-left:0; margin-top: 2rem;display: flex; flex-wrap: wrap; flex-direction: row; margin: 0 -1rem;}
	.youtube_latest_mix .right ul li {width: 50%;margin:1rem 0; padding: 0 1rem;}
	.youtube_latest_mix .right a {align-items: center;}
	
}
@media screen and (max-width: 768px) { 
	.modal-video-movie-wrap {width: 80% !important; position: absolute !important; left: 50%; top: 50%; transform: translate(-50%, -50%) !important;}
	
	.youtube_latest_mix .right a {flex-direction: column; align-items: flex-start;}
	.youtube_latest_mix .right ul {display: flex; flex-wrap: wrap; margin: 2rem -1rem;}
	.youtube_latest_mix .right ul li {width: 50%; padding:0 1rem;}
	.youtube_latest_mix .right a > .img_box {width: 100%;}
	.youtube_latest_mix .right a > .txt_box {width: 100%; padding-left:0 ; margin-top:.5rem;}
	
	
	
	
}
@media screen and (max-width: 568px) { 
	.youtube_latest .swiper-pagination .swiper-pagination-bullet {width: 1rem; height: 1rem}
	.youtube_latest_mix .right a > .txt_box {text-align: center;}
}
