.video-component-area{background-color:#000;box-sizing:border-box;height:100%;position:relative;transition:all .2s;width:100%}.video-component-area .time-mo{display:none}.video-component-area .float-task{align-items:center;background-color:alpha;border-radius:8px;display:flex;flex-direction:row;height:50px;justify-content:center;position:absolute;top:5%;transition:background-color .2s;width:50px}.video-component-area .float-task:hover{background-color:#d9261c;cursor:pointer}.video-component-area .modal-close-button{right:3%}.video-component-area .more-function-button{right:calc(3% + 50px)}.video-component-area .more-function-menu{background-color:alpha;color:#515151;display:none;height:100%;left:0;position:absolute;top:0;width:100%;z-index:910}.video-component-area .more-function-menu .more-function-menu__list{background-color:#fff;border-radius:3px;box-shadow:0 2px 3px 1px #0004;height:auto;max-height:250px;overflow:scroll;padding:10px 0;position:absolute;right:calc(3% + 50px);scrollbar-width:none;top:calc(5% + 30px);width:220px}.video-component-area .more-function-menu .more-function-menu__list::-webkit-scrollbar{display:none}.video-component-area .more-function-menu .more-function-menu__list .menu-option-li{list-style:none}.video-component-area .more-function-menu .more-function-menu__list .menu-option{height:40px;line-height:40px;margin:0;padding:0 20px;transition:all .1s}.video-component-area .more-function-menu .more-function-menu__list .menu-option:hover{background-color:#00000022;cursor:pointer}.video-component-area .more-function-menu .pictureinpicture-not-allowed{color:#aaa;font-size:11px;padding:3px 20px 0}.video-component-area .loading-text-mask{align-items:center;background-color:alpha;display:flex;flex-direction:row;height:80px;justify-content:center;left:calc(50% - 40px);position:absolute;top:calc(50% - 40px);width:80px}.video-component-area .hi-video,.video-component-area .hi-video video{height:100%;width:100%}.video-controller-bar{backdrop-filter:blur(10px);background-color:#a4a4a4ad;border-radius:0 0 0 0;bottom:0;box-sizing:border-box;display:none;height:40px;padding:0;position:absolute;transition:all .1s;width:100%;z-index:900}.video-controller-bar .v-ctrl-play-button{align-items:center;display:flex;flex-direction:row;height:40px;justify-content:center;padding:0 15px;transition:all .1s;width:auto}.video-controller-bar .v-ctrl-play-button:hover{background-color:#bcbcbcad;cursor:pointer}.video-controller-bar .v-ctrl-play-progress{align-items:center;display:flex;flex:1;flex-direction:row;height:40px;margin:0 10px}.video-controller-bar .v-ctrl-play-progress .progress-slider-area{display:flex;flex-direction:column;height:10px;justify-content:center;position:relative;width:100%}.video-controller-bar .v-ctrl-play-progress .progress-slider-area .indicator{background:linear-gradient(90deg,#c2c2c2,#c2c2c2 0,#000 0,#000);border-radius:3px;height:6px;left:0;position:absolute;width:100%}.video-controller-bar .v-ctrl-play-progress .progress-slider-area .handler{background-color:#fff;border-radius:5px;cursor:pointer;height:10px;left:60%;position:absolute;top:0;width:10px}.video-controller-bar .time-pc{height:40px;padding:0 8px;text-align:center;width:auto}.video-controller-bar .time-pc span{line-height:40px}.video-controller-bar .time-pc .current-time,.video-controller-bar .time-pc .time-divider{color:#fff}.video-controller-bar .time-pc .left-time{color:#c1c1c1}.video-controller-bar .v-ctrl-volume-bar{align-items:center;display:flex;flex-direction:row;height:40px;padding:0 8px;width:auto}.video-controller-bar .v-ctrl-volume-bar .volume-slider-area{display:flex;flex-direction:column;height:10px;justify-content:center;margin-left:10px;position:relative;width:80px}.video-controller-bar .v-ctrl-volume-bar .volume-slider-area .indicator{background:linear-gradient(90deg,#c2c2c2,#c2c2c2 calc(100% + 5px),#000 0,#000);border-radius:3px;height:6px;left:0;position:absolute;width:100%}.video-controller-bar .v-ctrl-volume-bar .volume-slider-area .handler{background-color:#fff;border-radius:5px;cursor:pointer;height:10px;left:60%;position:absolute;top:0;transition:background-color .1s;width:10px}.video-controller-bar .v-ctrl-volume-bar .volume-slider-area .handler:hover{background-color:#ff4339}.video-controller-bar .v-ctrl-volume-bar .horn-button{fill:#fff;cursor:pointer}.video-controller-bar .v-ctrl-fullscreen-button{align-items:center;display:flex;flex-direction:row;height:40px;justify-content:center;padding:0 15px;transition:all .1s;width:auto}.video-controller-bar .v-ctrl-fullscreen-button:hover{background-color:#bcbcbcad;cursor:pointer}.loading-rotate{animation:loading-rotation 2.5s linear infinite;transform:rotate(1turn)}.current-option{color:#ff4339;font-weight:600}@keyframes loading-rotation{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@media screen and (max-width:780px){.video-component-area{background-color:#000;border-radius:0!important;box-sizing:border-box;height:28vh;height:25vh!important;position:relative;transition:all .2s;width:100%;width:90%!important}.video-component-area .time-mo{bottom:0;display:block;font-size:13px;position:absolute;right:8px}.video-component-area .time-mo .current-time,.video-component-area .time-mo .time-divider{color:#fff}.video-component-area .time-mo .left-time{color:#c1c1c1}.video-component-area .hi-video,.video-component-area .hi-video video{height:100%;width:100%}.video-controller-bar{background-color:#6d6d6d;bottom:-40px;box-sizing:border-box;display:flex;display:flex block;height:40px;padding:0 6px;position:absolute;transition:all .1s;width:100%}.video-controller-bar .v-ctrl-play-button{align-items:center;display:flex;flex-direction:row;height:40px;justify-content:center;padding:0 15px;transition:all .1s;width:auto}.video-controller-bar .v-ctrl-play-button:hover{background-color:#bcbcbcad;cursor:pointer}.video-controller-bar .v-ctrl-play-progress{align-items:center;display:flex;flex:1;flex-direction:row;height:40px;margin:0 10px}.video-controller-bar .v-ctrl-play-progress .progress-slider-area{display:flex;flex-direction:column;height:10px;justify-content:center;position:relative;width:100%}.video-controller-bar .v-ctrl-play-progress .progress-slider-area .indicator{background:linear-gradient(90deg,#c2c2c2,#c2c2c2 0,#000 0,#000);border-radius:3px;height:6px;left:0;position:absolute;width:100%}.video-controller-bar .v-ctrl-play-progress .progress-slider-area .handler{background-color:#fff;border-radius:5px;cursor:pointer;height:10px;left:60%;position:absolute;top:0;width:10px}.video-controller-bar .time-pc{height:40px;padding:0 8px;text-align:center;width:auto}.video-controller-bar .time-pc span{line-height:40px}.video-controller-bar .time-pc .current-time,.video-controller-bar .time-pc .time-divider{color:#fff}.video-controller-bar .time-pc .left-time{color:#c1c1c1}.video-controller-bar .v-ctrl-volume-bar{align-items:center;display:flex;flex-direction:row;height:40px;padding:0 8px;width:auto}.video-controller-bar .v-ctrl-volume-bar .volume-slider-area{display:flex;flex-direction:column;height:10px;justify-content:center;margin-left:10px;position:relative;width:80px}.video-controller-bar .v-ctrl-volume-bar .volume-slider-area .handler{background-color:#fff;border-radius:5px;cursor:pointer;height:10px;left:60%;position:absolute;top:0;transition:background-color .1s;width:10px}.video-controller-bar .v-ctrl-volume-bar .volume-slider-area .handler:hover{background-color:#ff4339}}