.fontIcon{content:"";position:absolute;display:block}.trainContain{margin:20px;background-color:#fff}.trainContain .noData{margin:100px auto;width:100px}.trainContain .listHead{height:54px;box-sizing:border-box;border-bottom:1px solid #ccc;line-height:54px;background:#fff;font-size:16px;padding-left:20px;display:flex;align-items:center}.trainContain .listHead .trainTitle{font-size:16px;color:#666;margin-left:5px}.trainContain .contentList{background:#fff}.trainContain .contentList .alllist{padding:24px;overflow:hidden}.trainContain .contentList .alllist .listcontent li{width:19%;height:35%;margin-left:1.25%;float:left;box-sizing:border-box;margin-bottom:24px;cursor:pointer;position:relative;transition:all .35s ease-in-out}.trainContain .contentList .alllist .listcontent li .singleImg{width:100%;height:100%;display:inline-block}.trainContain .contentList .alllist .listcontent li .red{width:8px;height:8px;border-radius:50%;background-color:#e90a0a;position:absolute;right:-4px;top:-4px;z-index:10}.trainContain .contentList .alllist .listcontent li .sinlgleContent{width:100%;height:41px;margin-top:14px;text-align:center;overflow:hidden;line-height:20px;font-size:16px;color:#666}.trainContain .contentList .alllist .listcontent li .vedioSingleMask{width:100%;height:calc(100% - 57px);position:absolute;left:0;top:0;background:#000;opacity:0}.trainContain .contentList .alllist .listcontent li .vedioSingleMask .playIcon{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.trainContain .contentList .alllist .listcontent li .vedioSingleMask:hover{width:100%;height:calc(100% - 57px);position:absolute;left:0;top:0;background:#000;opacity:.5}.trainContain .contentList .alllist .listcontent li .vedioSingleMask:hover .playIcon{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.trainContain .contentList .alllist .listcontent li .documentSingleMask{width:100%;height:calc(100% - 57px);position:absolute;font-size:18px;left:0;top:0;background:#000;opacity:0}.trainContain .contentList .alllist .listcontent li .documentSingleMask .documentMask{width:60%;height:50px;position:absolute;overflow:hidden;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;justify-content:center;align-items:center}.trainContain .contentList .alllist .listcontent li .documentSingleMask .documentMask .documentMask-left{height:50px;font-size:16px;display:flex;justify-content:center;align-items:center;flex-direction:column}.trainContain .contentList .alllist .listcontent li .documentSingleMask .documentMask .documentMask-left p{margin-top:14px;color:#fff}.trainContain .contentList .alllist .listcontent li .documentSingleMask .documentMask .documentMask-right{width:50%;height:50px;display:flex;justify-content:center;align-items:center;flex-direction:column;font-size:16px;box-sizing:border-box;border-left:2px solid #fff}.trainContain .contentList .alllist .listcontent li .documentSingleMask .documentMask .documentMask-right p{margin-top:14px;color:#fff}.trainContain .contentList .alllist .listcontent li .documentSingleMask:hover{width:100%;height:calc(100% - 57px);position:absolute;left:0;top:0;background:#000;opacity:.5}.trainContain .contentList .alllist .listcontent li .documentSingleMask:hover .documentMask{width:60%;height:50px;position:absolute;overflow:hidden;left:50%;top:50%;transform:translate(-50%,-50%)}.trainContain .contentList .alllist .listcontent li .documentSingleMask:hover .documentMask .documentMask-left{width:50%;height:50px;float:left}.trainContain .contentList .alllist .listcontent li .documentSingleMask:hover .documentMask .documentMask-left p{margin-top:14px;color:#fff}.trainContain .contentList .alllist .listcontent li .documentSingleMask:hover .documentMask .documentMask-right{width:50%;height:50px;float:right;box-sizing:border-box;border-left:2px solid #fff}.trainContain .contentList .alllist .listcontent li:nth-child(5n+1){margin-left:0}.trainContain .peoDialog .video,.trainContain .video-dialog .video{width:100%}.trainContain .size{position:absolute;bottom:65px;right:15px}