.InteractiveFile{height:100%}.InteractiveFile .collect-bar{width:100%;height:80px;background:#272c33;box-shadow:0 4px 8px 0 rgba(18,21,26,.6);padding:0 20px 0 48px;display:flex;align-items:center;font-size:20px;color:#fff;letter-spacing:0;font-weight:600}.InteractiveFile .collect-bar .collect-qp{width:32px;height:32px;border-radius:16px;background:hsla(0,0%,100%,.1);border:1px solid hsla(0,0%,100%,.2);display:flex;align-items:center;justify-content:center;margin-right:16px;cursor:pointer}.InteractiveFile .collect-bar .collect-qp .icon-qp{display:inline-block;width:16px;height:16px;background-image:url(../../static/img/icon-qp.fa46641e.png);background-repeat:no-repeat;background-size:100%}.InteractiveFile .collect-bar .collect-qp .icon-collapse{display:inline-block;width:16px;height:16px;background-image:url(../../static/img/icon-collapse.0ee60d14.png);background-repeat:no-repeat;background-size:100%}.InteractiveFile .collect-bar .collect-download{width:76px;height:32px;background:hsla(0,0%,100%,.1);border:1px solid hsla(0,0%,100%,.2);border-radius:19px;display:flex;align-items:center;justify-content:center;margin-right:16px;cursor:pointer}.InteractiveFile .collect-bar .collect-download .icon-download{display:inline-block;width:16px;height:16px;background-image:url(../../static/img/icon-download.ea1dab2a.png);background-repeat:no-repeat;background-size:100%}.InteractiveFile .collect-bar .collect-download .download-text{font-size:14px;font-family:PingFang SC,PingFang SC-Semibold;font-weight:600;text-align:left;color:#fff}.InteractiveFile .collect-bar .collect-btn{background:hsla(0,0%,100%,.1);border:1px solid hsla(0,0%,100%,.4);border-radius:19px;height:32px;width:78px;font-size:14px;color:#fff;font-weight:600;display:flex;align-items:center;justify-content:center;cursor:pointer}.InteractiveFile .collect-bar .collect-btn img{display:inline-block;width:16px;height:16px;margin-right:4px;margin-top:-1px}.InteractiveFile .collect-bar .close{padding:0 10px;color:#fff;margin-left:30px;cursor:pointer}.InteractiveFile .collect-bar .close img{display:inline-block;width:16px;height:16px}.InteractiveFile .drawe-body{height:calc(100% - 80px);display:flex;align-items:center;justify-content:space-between;background:#12151a}.InteractiveFile .drawe-body .drawe-left{position:relative;flex:1;height:100%;margin-right:-32px;background:#12151a}.InteractiveFile .drawe-body .drawe-left .preview-page-wrap{display:flex;justify-content:center}.InteractiveFile .drawe-body .drawe-left .preview-page-wrap .preview-page{display:inline-block;margin-top:24px;text-align:center;font-weight:600;margin-bottom:20px;padding:4px 12px;background:rgba(18,21,26,.4);border-radius:4px}.InteractiveFile .drawe-body .drawe-left .preview-page-wrap .preview-page .current-page{font-size:16px;color:#fff}.InteractiveFile .drawe-body .drawe-left .preview-page-wrap .preview-page .total-page{font-size:16px;color:hsla(0,0%,100%,.4)}.InteractiveFile .drawe-body .drawe-left .preview-img{width:100%;height:calc(100% - 70px);background-size:contain!important;background-position:50%!important}.InteractiveFile .drawe-body .drawe-left .preview-pagetion{width:100%;display:flex;flex-direction:column;position:absolute;bottom:0}.InteractiveFile .drawe-body .drawe-left .preview-pagetion .icon{cursor:pointer;display:flex;justify-content:flex-end;margin-right:34px;font-size:24px;color:#fff;margin-bottom:34px}.InteractiveFile .drawe-body .drawe-left .preview-pagetion .icon:before{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:rgba(18,21,26,.4);border-radius:4px}.InteractiveFile .drawe-body .drawe-left .preview-pagetion .nextDisabled,.InteractiveFile .drawe-body .drawe-left .preview-pagetion .preDisabled{cursor:not-allowed!important;color:#4a4e52!important}.InteractiveFile .drawe-body>img{z-index:1}.InteractiveFile .drawe-body .drawe-right{position:relative;width:264px;padding:0 12px;height:100%;background:#272c33;overflow-y:scroll;overflow-x:hidden}.InteractiveFile .drawe-body .drawe-right .img-list{margin-top:24px}.InteractiveFile .drawe-body .drawe-right .img-list .img-item{position:relative;height:148px;border-radius:4px;box-sizing:border-box}.InteractiveFile .drawe-body .drawe-right .img-list .img-item .img-No{position:absolute;width:44px;height:24px;border-radius:0 0 8px 0;background:rgba(0,0,0,.75);text-align:center;line-height:24px;font-size:16px;font-weight:600;color:#fff}.InteractiveFile .drawe-body .drawe-right .img-list .img-item img{position:absolute;top:10px;right:-14px}.InteractiveFile .drawe-body .drawe-right .img-list .img-item .imgNoAcitve{background:#409fff}.InteractiveFile .drawe-body .drawe-right .img-list .itemActive{box-shadow:0 4px 8px 0 #0e418c;border:2px solid #409fff}