.container{display:flex;flex-direction:row;position:relative;max-width:520px;width:100vw;height:100vh}
.swiper_w{height:calc(100% - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 56px);background-color:#000;display:flex;align-items:center;justify-content:center;max-width:520px;margin:0 auto;width:100%}
.swiper{width:100%;height:100%;color:#fff}
.swiper-slide .video_box{width:100%;height:100%;font-size:10px;position:relative}
.video_box .video_wrap{width:100%;height:100%;display:flex;align-items:center}
.video_wrap video{width:100%;height:100%;object-position:inherit;object-fit:cover}
.video_bar{position:absolute;height:44px;bottom:0;left:0;right:0;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-transform:translateZ(0);transform:translateZ(0);overflow:hidden;z-index:9999}
.video_bar.video_bar_opacity{padding:0 10px;bottom:10px}
.video_controls{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;flex-grow:1;margin:0}
.video_bar.video_bar_opacity .video_controls{margin:0 8.5px}
.video_current_time,.video_duration{height:14.5px;line-height:14.5px;margin-top:15px;margin-bottom:14.5px;font-size:12px;color:#fff;display:none}
.video_bar.video_bar_opacity .video_current_time{display:block}
.video_bar.video_bar_opacity .video_duration{display:block}
.video_progress_container{-webkit-box-flex:2;-webkit-flex-grow:2;flex-grow:2}
.video_bar.video_bar_opacity .video_progress_container{position:relative}
.video_progress{position:absolute;bottom:0px;width:100%;z-index:999}
.video_bar.video_bar_opacity .video_progress{padding:0 5px}
.video_progress_wrap{background:hsla(0,0%,100%,.2);transition:all .1s;box-shadow:0 0 8px rgba(0,0,0,.4);height:4px;cursor:pointer}
.video_progress_wrap.video_progress_active{height:12px}
.video_bar.video_bar_opacity .video_progress_wrap{margin-bottom:20px;border-radius:20px}
.video_bar.video_bar_opacity .video_progress_wrap.video_progress_active{height:12px;margin-bottom:16px}
.video_progress_buffered{position:relative;background:#ff3d6f;width:0px;height:4px}
.video_bar.video_bar_opacity .video_progress_buffered{border-radius:20px}
.video_progress_active .video_progress_buffered{height:12px;background:#fff}
.video_bar_opacity .video_progress_buffered:after{content:"";position:absolute;right:-4px;bottom:-2px;width:8px;height:8px;background:#fefefe;border-radius:20px;transition:all .1s}
.video_progress_active .video_progress_buffered:after{width:16px;height:16px;background:#fd2c54}
.video_right{position:absolute;right:.52rem;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;-webkit-box-align:center;-webkit-align-items:center;align-items:center;font-size:.24rem;color:#fff;line-height:1.32rem;z-index:999;transform:translateX(0%) translateY(-50%);text-align:center;top:50%}
.video_right p.text{text-align:center;white-space:nowrap;font-size:15px;color:#fff}
img.icon{margin-top:10px;width:2.48rem}
.video_bottom{position:absolute;bottom:45px;left:0;right:42px;padding-left:10px;padding-right:15px;flex-direction:row;justify-content:space-between;align-items:center;display:flex;z-index:999}
.video_bottom_item{display:flex;flex-direction:column}
.video_title{color:rgb(255,255,255);font-size:16px;font-weight:600;padding:5px 0px}
.video_blurb{color:rgb(255,255,255);font-size:14px;padding:5px;text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}
.item_tag_list{flex-direction:row;margin:7px 0;display:flex}
.item_tag{background-color:rgba(0,0,0,.5);font-size:12px;color:#fff;margin-right:5px;padding:5px 5px;border-radius:7px}
.video_box .play{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,0.6);z-index:998}
.video_box .play img{width:75px;height:75px}
.play.playing{opacity:0}