.video-wrap{overflow:hidden;display:flex;flex-direction:column;gap:1rem;width:100%;height:auto}
.video-main-wrap{display:block;}
.video-main{display:block;position:relative;overflow:hidden;width:100%;height:0;padding-top:calc(9/16 * 100%);}
.video-main iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none;border-radius:1rem;}
.video-list{display:block;}
.video-list h2{display:block;width:100%;line-height:1.2}
.video-list h2 br{display:none}
.video-info{display:none;flex-direction:column;gap:0.5rem}
.video-youtube span{display:inline-flex;justify-content:center;align-items:center;gap:0.5rem;padding:0.75rem 1rem;border-radius:1.5rem;background-color:#ea577b;font-size:0.8rem;color:#fff;line-height:1}
.video-youtube a{color:#fff;}
.video-youtube i{font-size:1.25rem;}
.video-tag{display:flex;gap:0.5rem;}
.video-tag span{display:flex;justify-content:center;align-items:center;padding:0.75rem 1rem;border-radius:1.5rem;background-color:#2f9d82;font-size:0.8rem;color:#fff;line-height:1}
.video-thumb-wrap{display:flex;gap:0.5rem;}
.video-thumb{width:calc((100% - 0.5rem) / 2);cursor:pointer;transition:0.2s;}
.video-thumb:hover{transform:translateY(-0.5rem);}
.video-thumb .img{overflow:hidden;border:0.4rem solid transparent;border-radius:1rem;}
.video-thumb.on .img{overflow:hidden;border:0.4rem solid #2f9d82;}
.video-thumb img{display:block;width:100%;margin:-10% 0}
.thumb-title{padding-top:0.5rem;font-size:14px;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.video-empty{padding:20px;background:#ffecec;color:#c00;}
@media (min-width:768px){
	.video-wrap{flex-direction:row-reverse;flex-wrap:wrap;gap:1rem;}
	.video-main-wrap{width:calc((100% - 2rem) / 3 * 2)}
	.video-list{display:flex;flex-direction:column;justify-content:space-between;gap:1rem;width:calc((100% - 2rem) / 3)}
	.video-list h2 br{display:block}
}
@media (min-width:1025px){
	.video-wrap{gap:3rem;}
	.video-main-wrap{width:calc((100% - 3rem) / 3 * 2)}
	.video-list{width:calc((100% - 3rem) / 3)}
	.video-thumb .img{border-radius:1rem;}
}
@media (min-width:1200px){
	.video-wrap{gap:4rem;}
	.video-main-wrap{width:calc((100% - 4rem) / 3 * 2)}
	.video-list{width:calc((100% - 4rem) / 3)}
	.video-list h2 br:nth-child(1){display:none}
	.video-info{display:flex;}
}
@media (min-width:1500px){
	.video-wrap{gap:5rem;}
	.video-main-wrap{width:calc((100% - 5rem) / 3 * 2)}
	.video-list{width:calc((100% - 5rem) / 3)}
}