html,body{height:100%;background:#000}.story-main-box{height:100%}.video-box{position:absolute;top:0;bottom:0;left:0;right:0}.video-box .video{width:100%;height:100%;object-fit:cover;object-position:center center}.gradient-box{position:absolute;top:0;bottom:0;left:0;right:0}.gradient-box .top-gradient{position:absolute;top:0;left:0;right:0;height:170px;background:linear-gradient(#000, rgba(255,255,255,0));opacity:0.3}.gradient-box .bottom-gradient{position:absolute;bottom:0;left:0;right:0;height:90px;background:linear-gradient(rgba(255,255,255,0), #000);opacity:0.2}.right-action-box{position:absolute;right:15px;bottom:150px}.right-action-box .director-avatar{width:50px;height:50px;border-radius:25px;border:1px solid #fff;box-sizing:border-box;background-repeat:no-repeat;background-position:0;background-size:50px;margin-bottom:44px;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}.right-action-box .director-avatar .follow-btn{position:absolute;top:44px;left:4px;right:4px;width:44px;height:16px;line-height:16px;border-radius:2px;text-align:center;font-size:8px;font-weight:600;color:#fff;background:#45ddea;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}.right-action-box .director-avatar .name{position:absolute;top:64px;left:-10px;right:-10px;color:#fff;font-size:14px;font-weight:600;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.right-action-box .like-btn{position:relative;width:50px;height:50px;border-radius:25px;background:rgba(0,0,0,0.2);cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);margin-bottom:30px}.right-action-box .like-btn .icon{width:100%;height:100%;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath fill='%23fff' stroke='rgba(0,0,0,0)' stroke-width='0' style='' d='M25.9,9.3h-3.2c0-0.4,0-0.8,0-1.2V5.8C22.7,2.6,20.2,0,17,0c-3.2,0-5.8,2.6-5.8,5.8v2.3c0,1.9-1.5,3.2-3.8,3.2 H4.8C2.1,11.2,0,13.4,0,16v11.2C0,29.9,2.1,32,4.8,32h17.2c4.9,0,5.9-2.4,8.6-10.7l0-0.1c0.9-2.6,1.4-4.6,1.4-5.9 C32,12,29.3,9.3,25.9,9.3z M27.8,20.3l0,0.1c-2.9,8.7-3.3,8.7-5.8,8.7H4.8c-1,0-1.8-0.8-1.8-1.8V16c0-1,0.8-1.8,1.8-1.8h2.6 c3.9,0,6.7-2.6,6.7-6.1V5.8c0-1.6,1.3-2.8,2.8-2.8c1.6,0,2.8,1.3,2.8,2.8v2.3c0,0.8-0.1,1.6-0.2,2.3c-0.1,0.4,0,0.9,0.3,1.2 c0.3,0.3,0.7,0.5,1.1,0.5h4.9c1.7,0,3.2,1.4,3.2,3.2C29.1,16.2,28.6,18,27.8,20.3z M20.4,22.2c-1.5,2.1-3.2,3.2-5.1,3.2 c0,0-0.1,0-0.1,0c-3-0.1-4.9-2.9-5.1-3.2c-0.4-0.7-0.3-1.6,0.4-2c0.7-0.4,1.6-0.3,2,0.4c0.3,0.5,1.5,1.9,2.8,1.9c0,0,0,0,0,0 c1.1,0,2.1-1.1,2.7-2c0.5-0.7,1.4-0.8,2-0.3C20.7,20.7,20.9,21.6,20.4,22.2z' /%3E%3C/svg%3E") no-repeat 50%;background-size:26px}.right-action-box .like-btn .count{position:absolute;top:50px;left:-10px;right:-10px;color:#fff;font-size:14px;font-weight:500;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.right-action-box .comment-btn{position:relative;width:50px;height:50px;border-radius:25px;background:rgba(0,0,0,0.2);cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}.right-action-box .comment-btn .icon{width:100%;height:100%;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath fill='%23fff' stroke='rgba(0,0,0,0)' stroke-width='0' style='' d='M30.7,10c-1.2-3-3.3-5.6-6-7.3c-1.4-0.9-2.9-1.6-4.6-2.1C18.5,0.1,16.7-0.1,15,0c-1.7,0.1-3.3,0.5-4.8,1.1 C8.4,1.8,6.8,2.8,5.4,4C4,5.3,2.8,6.8,1.9,8.6c-0.9,1.8-1.5,3.8-1.7,5.8c-0.1,0.7-0.1,1.5-0.1,2.1c0.1,1.1,0.2,2.3,0.6,3.6 c0.4,1.7,1.1,3.4,1.9,5c0,0.6,0,1.2,0,1.8l0,0.6c0,0.7,0,1.4,0,2.1c0,0,0,0.1,0,0.1c0,0.1,0,0.2,0.1,0.4c0.2,0.6,0.6,1.2,1.2,1.4 c0.3,0.1,0.5,0.2,0.7,0.2c0,0,0.1,0,0.1,0L8,31.9c1.5,0,3.1,0.1,4.6,0.1c1.1,0,2.3,0,3.4,0c0,0,0,0,0,0c0,0,0,0,0,0c1,0,2-0.1,3-0.3 c2.1-0.4,4.1-1.2,5.9-2.4c2.2-1.5,4-3.6,5.3-6c1.1-2.1,1.7-4.5,1.7-6.9C31.9,14.2,31.5,12,30.7,10z M27.4,21.9 c-1,1.9-2.4,3.6-4.2,4.8c-1.4,1-3,1.6-4.7,2c-0.8,0.1-1.6,0.2-2.4,0.2c-1.1,0-2.2,0-3.4,0c-1.5,0-3.1-0.1-4.6-0.1l-2.3,0 c0-0.4,0-0.8,0-1.2l0-0.6c0-0.7,0-1.4,0-2.2c0-0.3-0.1-0.5-0.2-0.8c-0.8-1.5-1.4-3.1-1.8-4.6c-0.3-1.1-0.4-2.1-0.5-3 c0-0.5,0-1.1,0-1.7c0.1-1.6,0.6-3.2,1.4-4.7c0.7-1.4,1.7-2.6,2.8-3.6c1.1-1,2.4-1.8,3.8-2.3c1.2-0.5,2.5-0.8,3.9-0.9 c1.4-0.1,2.8,0.1,4.2,0.4c1.3,0.4,2.5,0.9,3.7,1.7c2.1,1.4,3.8,3.5,4.8,5.9c0.7,1.6,1,3.4,0.9,5.2C28.7,18.3,28.2,20.2,27.4,21.9z M11.6,13.8c0,0.9-0.7,1.6-1.6,1.6H6.2c-0.9,0-1.6-0.7-1.6-1.6c0-0.9,0.7-1.6,1.6-1.6H10C10.9,12.2,11.6,12.9,11.6,13.8z M23.1,13.8 c0,0.9-0.7,1.6-1.6,1.6h-3.9c-0.9,0-1.6-0.7-1.6-1.6c0-0.9,0.7-1.6,1.6-1.6h3.9C22.4,12.2,23.1,12.9,23.1,13.8z' /%3E%3C/svg%3E") no-repeat 50%;background-size:26px}.right-action-box .comment-btn .count{position:absolute;top:50px;left:-10px;right:-10px;color:#fff;font-size:14px;font-weight:500;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-popup-box{position:absolute;top:0px;left:0px;right:0px;height:54px;z-index:2}.top-popup-box .container,.top-popup-box .story-container,.top-popup-box .app-container{position:absolute;top:0px;left:0px;right:0px;bottom:0px;background:#fff;padding:0px 10px;display:flex;flex-direction:row;align-items:center;color:#000}.top-popup-box .container .image,.top-popup-box .story-container .image,.top-popup-box .app-container .image{flex:0 0 40px;width:40px;height:40px;border-radius:8px;border:0.5px solid #d9d9d9;box-sizing:border-box;background-image:url("/static/image/web/video_collection/applogo.png");background-size:100%;background-repeat:no-repeat;background-position:0}.top-popup-box .container .info,.top-popup-box .story-container .info,.top-popup-box .app-container .info{flex:1 1 auto;padding:0 10px;overflow:hidden}.top-popup-box .container .info .title,.top-popup-box .story-container .info .title,.top-popup-box .app-container .info .title{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-popup-box .container .info .desc,.top-popup-box .story-container .info .desc,.top-popup-box .app-container .info .desc{color:#666;font-size:10px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-popup-box .container .btn,.top-popup-box .story-container .btn,.top-popup-box .app-container .btn{flex:0 0 84px;background:#45ddea;height:30px;line-height:30px;border-radius:3px;text-align:center;font-size:11px;font-weight:600;color:#fff;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}.top-popup-box .app-container{display:none}.top-popup-box .story-container .image{flex:0 0 30px;width:30px;border-radius:2px;background-size:30px 40px;margin:0 5px}.play-btn{position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;width:64px;height:70px;background:url("/static/image/web/video_collection/video_play.png") no-repeat 0 0;background-size:100%;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}.end-page{position:absolute;top:0;bottom:0;left:0;right:0;background:rgba(0,0,0,0.8);color:#fff;z-index:1;display:none}.end-page .story-end-text{position:absolute;top:0;bottom:55px;left:0;right:0;margin:auto;width:80px;height:30px;line-height:30px;font-size:21px;font-weight:600;text-align:center}.end-page .replay{position:absolute;top:55px;bottom:0;left:0;right:0;margin:auto;width:70px;height:70px;background:rgba(255,255,255,0.13);border-radius:8px;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}.end-page .replay .image{width:33px;height:33px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath fill='%23fff' stroke='rgba(0,0,0,0)' stroke-width='0' style='' d='M30.1,18.5C30.1,26.1,23.9,32,16,32S1.9,26.1,1.9,18.5c0-1,0.6-1.8,1.6-1.8c1,0,1.8,0.8,1.8,1.8v0 c0,5.5,4.8,10.1,10.7,10.1c5.9,0,10.7-4.5,10.7-10.1C26.7,13,21.9,8.5,16,8.5h-6l1.8,1.9c0.7,0.7,0.9,1.8,0.2,2.5 c-0.7,0.7-1.8,0.7-2.5,0c0,0,0,0,0,0L4.8,7.9c-0.7-0.7-0.7-1.8,0-2.5l4.7-4.9c0.7-0.7,1.8-0.7,2.5-0.1c0.7,0.7,0.5,1.8-0.2,2.5 l-2,2.1H16C23.9,5.1,30.1,10.9,30.1,18.5z' /%3E%3C/svg%3E") no-repeat 50%;background-size:100%;margin:2px 0 5px}.end-page .replay .text{color:#cdcdcd;font-size:11px}.end-page .play-next-btn{position:absolute;bottom:25px;left:20px;right:20px;background:#45ddea;height:45px;line-height:45px;border-radius:3px;text-align:center;font-size:18px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}.collection-info-box{position:absolute;top:68px;left:0;right:0;color:#fff;padding:0 20px}.collection-info-box .collection-name{font-size:28px;font-weight:600}.collection-info-box .kv-info{display:flex;flex-direction:row;align-items:center;justify-content:left;margin-bottom:10px}.collection-info-box .kv-info .number{color:#ffdb21;font-size:15px;font-weight:600}.collection-info-box .kv-info .copy-btn{width:26px;height:14px;line-height:14px;color:#45ddea;font-size:9px;font-weight:600;text-align:center;border:1.5px solid #45ddea;border-radius:3px;margin-left:8px;margin-bottom:2px;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}.collection-info-box .tips{width:210px;font-size:12px;color:#45ddea;background:rgba(255,255,255,0.15);border-radius:2px;padding:10px;position:relative}.collection-info-box .tips::before{content:"";position:absolute;top:-10px;left:110px;border:5px solid transparent;border-width:5px 4px;border-bottom-color:rgba(255,255,255,0.15)}.copy-popup-box{position:absolute;top:0;left:0;right:0;bottom:0;z-index:4;display:none}.copy-popup-box .message{position:absolute;top:0;left:0;right:0;bottom:0;margin:auto;background:#fff;width:110px;height:40px;line-height:40px;color:#666;font-size:16px;font-weight:600;text-align:center;border-radius:5px}.guide-page{position:absolute;top:0;bottom:0;left:0;right:0;background:rgba(0,0,0,0.8);color:#fff;z-index:3;display:none}.guide-page .container,.guide-page .top-popup-box .app-container,.top-popup-box .guide-page .app-container,.guide-page .top-popup-box .story-container,.top-popup-box .guide-page .story-container{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center}.guide-page .container .popup,.guide-page .top-popup-box .app-container .popup,.top-popup-box .guide-page .app-container .popup,.guide-page .top-popup-box .story-container .popup,.top-popup-box .guide-page .story-container .popup{position:relative;background:linear-gradient(180deg, #7654D8 0%, #5840C9 94.27%);width:280px;border-radius:8px;padding:20px}.guide-page .container .popup .cat,.guide-page .top-popup-box .app-container .popup .cat,.top-popup-box .guide-page .app-container .popup .cat,.guide-page .top-popup-box .story-container .popup .cat,.top-popup-box .guide-page .story-container .popup .cat{position:absolute;top:18px;right:28px;width:85px;height:94px;background-image:url("/static/image/web/video_collection/guide_cat.png");background-size:100%;background-repeat:no-repeat;background-position:0}.guide-page .container .popup .close-btn,.guide-page .top-popup-box .app-container .popup .close-btn,.top-popup-box .guide-page .app-container .popup .close-btn,.guide-page .top-popup-box .story-container .popup .close-btn,.top-popup-box .guide-page .story-container .popup .close-btn{position:absolute;top:5px;right:5px;width:40px;height:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath fill='rgba(255,255,255,0.6)' stroke='rgba(0,0,0,0)' stroke-width='0' style='' d='M30.6,27.3c1.1,1.1,1,2.9-0.1,3.9C30,31.7,29.3,32,28.6,32c-0.7,0-1.5-0.3-2-0.8L15.8,20L5,30.8 c-0.5,0.5-1.3,0.8-2,0.8c-0.7,0-1.4-0.3-2-0.8C0,29.8,0,28,1.1,26.9L11.9,16L1,4.7C0,3.6,0,1.9,1.1,0.8C2.2-0.3,4-0.3,5,0.8L15.9,12 L27,0.8c1.1-1.1,2.8-1.1,3.9,0c1.1,1.1,1.1,2.8,0,3.9L19.7,16L30.6,27.3z' /%3E%3C/svg%3E");background-size:12px;background-repeat:no-repeat;background-position:50%;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}.guide-page .container .popup .collection-name,.guide-page .top-popup-box .app-container .popup .collection-name,.top-popup-box .guide-page .app-container .popup .collection-name,.guide-page .top-popup-box .story-container .popup .collection-name,.top-popup-box .guide-page .story-container .popup .collection-name{color:#fff;font-size:22px;font-weight:600}.guide-page .container .popup .title,.guide-page .top-popup-box .app-container .popup .title,.top-popup-box .guide-page .app-container .popup .title,.guide-page .top-popup-box .story-container .popup .title,.top-popup-box .guide-page .story-container .popup .title{color:rgba(255,255,255,0.8);font-size:12px;padding:0 10px;margin-top:10px}.guide-page .container .popup .detail,.guide-page .top-popup-box .app-container .popup .detail,.top-popup-box .guide-page .app-container .popup .detail,.guide-page .top-popup-box .story-container .popup .detail,.top-popup-box .guide-page .story-container .popup .detail{background:rgba(255,255,255,0.16);border-radius:5px;padding:15px 20px;margin-top:10px}.guide-page .container .popup .detail .step-title,.guide-page .top-popup-box .app-container .popup .detail .step-title,.top-popup-box .guide-page .app-container .popup .detail .step-title,.guide-page .top-popup-box .story-container .popup .detail .step-title,.top-popup-box .guide-page .story-container .popup .detail .step-title{color:#fff;font-size:14px;font-weight:600;margin-bottom:10px}.guide-page .container .popup .detail .step,.guide-page .top-popup-box .app-container .popup .detail .step,.top-popup-box .guide-page .app-container .popup .detail .step,.guide-page .top-popup-box .story-container .popup .detail .step,.top-popup-box .guide-page .story-container .popup .detail .step{position:relative;color:#fff;font-size:12px;padding:0 15px;margin-bottom:10px}.guide-page .container .popup .detail .step::before,.guide-page .top-popup-box .app-container .popup .detail .step::before,.top-popup-box .guide-page .app-container .popup .detail .step::before,.guide-page .top-popup-box .story-container .popup .detail .step::before,.top-popup-box .guide-page .story-container .popup .detail .step::before{content:"";position:absolute;top:0;left:0}.guide-page .container .popup .detail .step.s1::before,.guide-page .top-popup-box .app-container .popup .detail .step.s1::before,.top-popup-box .guide-page .app-container .popup .detail .step.s1::before,.guide-page .top-popup-box .story-container .popup .detail .step.s1::before,.top-popup-box .guide-page .story-container .popup .detail .step.s1::before{content:"1."}.guide-page .container .popup .detail .step.s1 .kv-info,.guide-page .top-popup-box .app-container .popup .detail .step.s1 .kv-info,.top-popup-box .guide-page .app-container .popup .detail .step.s1 .kv-info,.guide-page .top-popup-box .story-container .popup .detail .step.s1 .kv-info,.top-popup-box .guide-page .story-container .popup .detail .step.s1 .kv-info{display:inline-block;margin-top:5px}.guide-page .container .popup .detail .step.s1 .kv-info .kv-container,.guide-page .top-popup-box .app-container .popup .detail .step.s1 .kv-info .kv-container,.top-popup-box .guide-page .app-container .popup .detail .step.s1 .kv-info .kv-container,.guide-page .top-popup-box .story-container .popup .detail .step.s1 .kv-info .kv-container,.top-popup-box .guide-page .story-container .popup .detail .step.s1 .kv-info .kv-container{background:rgba(255,255,255,0.1);display:flex;flex-direction:row;align-items:center;justify-content:left;border-radius:2px;padding:4px 10px}.guide-page .container .popup .detail .step.s1 .kv-info .number,.guide-page .top-popup-box .app-container .popup .detail .step.s1 .kv-info .number,.top-popup-box .guide-page .app-container .popup .detail .step.s1 .kv-info .number,.guide-page .top-popup-box .story-container .popup .detail .step.s1 .kv-info .number,.top-popup-box .guide-page .story-container .popup .detail .step.s1 .kv-info .number{color:#ffdb21;font-size:14px;font-weight:600}.guide-page .container .popup .detail .step.s1 .kv-info .copy-btn,.guide-page .top-popup-box .app-container .popup .detail .step.s1 .kv-info .copy-btn,.top-popup-box .guide-page .app-container .popup .detail .step.s1 .kv-info .copy-btn,.guide-page .top-popup-box .story-container .popup .detail .step.s1 .kv-info .copy-btn,.top-popup-box .guide-page .story-container .popup .detail .step.s1 .kv-info .copy-btn{width:26px;height:14px;line-height:14px;color:#45ddea;font-size:9px;font-weight:600;text-align:center;border:1.5px solid #45ddea;border-radius:3px;margin-left:8px;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}.guide-page .container .popup .detail .step.s2,.guide-page .top-popup-box .app-container .popup .detail .step.s2,.top-popup-box .guide-page .app-container .popup .detail .step.s2,.guide-page .top-popup-box .story-container .popup .detail .step.s2,.top-popup-box .guide-page .story-container .popup .detail .step.s2{margin-bottom:2px}.guide-page .container .popup .detail .step.s2::before,.guide-page .top-popup-box .app-container .popup .detail .step.s2::before,.top-popup-box .guide-page .app-container .popup .detail .step.s2::before,.guide-page .top-popup-box .story-container .popup .detail .step.s2::before,.top-popup-box .guide-page .story-container .popup .detail .step.s2::before{content:"2."}.guide-page .container .popup .detail .step.s2 .image,.guide-page .top-popup-box .app-container .popup .detail .step.s2 .image,.top-popup-box .guide-page .app-container .popup .detail .step.s2 .image,.guide-page .top-popup-box .story-container .popup .detail .step.s2 .image,.top-popup-box .guide-page .story-container .popup .detail .step.s2 .image{display:block;width:194px;height:48px;background-image:url("/static/image/web/video_collection/guide_stip_2.png");background-size:100%;background-repeat:no-repeat;background-position:0;margin-left:-5px}.guide-page .container .popup .detail .step.s3::before,.guide-page .top-popup-box .app-container .popup .detail .step.s3::before,.top-popup-box .guide-page .app-container .popup .detail .step.s3::before,.guide-page .top-popup-box .story-container .popup .detail .step.s3::before,.top-popup-box .guide-page .story-container .popup .detail .step.s3::before{content:"3."}.guide-page .container .popup .detail .step-tips,.guide-page .top-popup-box .app-container .popup .detail .step-tips,.top-popup-box .guide-page .app-container .popup .detail .step-tips,.guide-page .top-popup-box .story-container .popup .detail .step-tips,.top-popup-box .guide-page .story-container .popup .detail .step-tips{color:rgba(255,255,255,0.6);font-size:10px;text-align:center;margin-left:-7px;padding:0 15px}.guide-page .container .popup .btn,.guide-page .top-popup-box .app-container .popup .btn,.top-popup-box .guide-page .app-container .popup .btn,.guide-page .top-popup-box .story-container .popup .btn,.top-popup-box .guide-page .story-container .popup .btn{background:#45ddea;width:160px;height:36px;line-height:36px;color:#fff;font-size:14px;font-weight:600;text-align:center;border-radius:3px;margin:15px auto 0;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}