.videopage{position:relative;width:100%;height:100vh;overflow:hidden}.videopage .isAcitem .title:before{background:#336df3!important;border:1px solid #336df3!important}.videopage .isActive{right:320px!important}.videopage .isActiveNav{width:320px!important}.videopage .video-left{position:absolute;left:0;top:0;right:0;height:100%;-webkit-transition:.6s linear;transition:.6s linear}.videopage .video-left .openNav{position:absolute;right:0;top:12px;cursor:pointer;z-index:998;width:30px;height:30px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background:#abadb0;border-top-left-radius:20px;border-bottom-left-radius:20px}.videopage .video-left .openNav .iconzk{width:15px;height:15px;display:block}.videopage .video-left .openNav .iconzk.icon1{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAOCAYAAAAmL5yKAAAAPUlEQVQokWP8//8/AxrAEMAHmPDIEQVYsChixBDBAyh2wcAbwEJqqFPdCyykhjrVXTA4YgEd0DEvMDAwAADIZAYgj37m2gAAAABJRU5ErkJggg==) no-repeat 50%;background-size:cover}.videopage .video-left .openNav .iconzk.icon2{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAOCAYAAAAmL5yKAAAANklEQVQokWP8////fwbSACOyaiYSNWMAFnQTSQUUu2DgDQCFAamxQF0vjMYCebFAxbzAwMAAAOv8BiLtfoSoAAAAAElFTkSuQmCC) no-repeat 50%;background-size:cover}.videopage .video-left .main-box,.videopage .video-left .main-box video{width:100%;height:100%}.videopage .nav-left{position:absolute;top:0;right:0;width:0;-webkit-transition:.6s linear;transition:.6s linear}.videopage .nav-left .main-bot{width:320px}.videopage .nav-left .main-bot .top-box{background:#eceef1;padding:20px 15px}.videopage .nav-left .main-bot .top-box .title{font-size:25px;color:#333;font-weight:700;line-height:40px}.videopage .nav-left .main-bot .top-box .midd .midd-top{margin:10px 0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:16px;color:#333}.videopage .nav-left .main-bot .top-box .midd .midd-top .coursTimeNum{margin-right:15px;background:#dbe3ff;font-size:12px;padding:5px 10px;color:#336df3}.videopage .nav-left .main-bot .top-box .midd .midd-bot .isFree{font-size:16px;color:#1dd8a7;font-weight:700}.videopage .nav-left .mian-item{padding:0 15px 20px 0;-webkit-box-sizing:border-box;box-sizing:border-box;height:100vh;overflow:scroll}.videopage .nav-left .mian-item .item{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:45px;line-height:45px;margin-left:35px;border-left:1px solid #eee;cursor:pointer}.videopage .nav-left .mian-item .item .title{font-size:14px;color:#333;padding-left:20px}.videopage .nav-left .mian-item .item .title:before{content:"";position:absolute;left:-6px;top:15px;width:12px;height:12px;border-radius:50%;display:block;-webkit-box-sizing:border-box;box-sizing:border-box;border:1px solid #eee;background:#fff}.videopage .nav-left .mian-item .item .icon{width:25px;height:25px;display:block;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAfZJREFUWEftV7FuE0EQfbNN3IUfIEpaItHQ0CA5P0CqpEGio7UoPGOdFAmuOmnPSopIyQckDVAhfsANRZoUSECFiEKFaCLkhuJ2oz15rcO68935nNiFt7LkmXlv3szOzhEWfGjB+FgRWD4FtNYfATwGsNmwP64AfBGR3Wlx/lNAa20bgua6i0ih0uM/tNbvAexZa0NjzCAIgkETMlEUtZVSbSJ6A+CDiOznxcsSuAbwUCm13e12vzUB9779fv+RMeYrgF8islFGIJV/mlyzkPJlLYqbVeBOCSilnhljXlhrf/d6vbc+mXsjAOAfgDUHTESfmPl5+tszKZPK2Tkba+0JER2KyI8qJZm4Wa6x29lS1ybgnK21fxyJVqt11Ol0XGaFxxMgoqfMfDGZaJbAzxGzraJoOXPikoiOmPm8zMc3YSGBKIrSyRcEgZtguWfKoCq855OAhQRmqOfYhYjOmPllXozKBOI4fg1gnZnDGgp8BnAsIu/KfEpLoLW+GfXAg7JgAL6PgE/LlKvchFV7gIgOhsPhcRiGf8vA/dXN2BVfwyrBZrHJNO70QRTHsXYAzCyzAFUo2xMArxY2iqs8RulznCTJTtNdwKtR9zlOFxIAgyRJwqYkai8kOR07t1aotJJ5tIUupXNLuUag5fsuqEF+LqYrBW4BeSsdMCGOcXkAAAAASUVORK5CYII=) no-repeat 50%;background-size:cover}.videopage .video-js.vjs-1-1,.videopage .video-js.vjs-4-3,.videopage .video-js.vjs-9-16,.videopage .video-js.vjs-16-9,.videopage .video-js.vjs-fluid{height:100vh!important}.videopage .vjs_video_442-dimensions{width:100%!important;height:100%!important;position:inherit!important}