a,body,html,input,li,p,span,ul{padding:0;margin:0;list-style:none;text-decoration:none;-moz-user-select:none;user-select:none;-webkit-user-select:none;font-family:'微软雅黑'}.wrapper,body,html{width:100%;overflow:hidden}body::-webkit-scrollbar{width:16px;background-color:rgba(0,0,0,.856)}body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.281);box-shadow:inset 0 0 10px rgba(0,0,0,.582)}.wrapper .wrapper-top .wrapper-top-nav{width:1000px;height:80px;background:#fff;margin:0 auto;position:relative}.wrapper .wrapper-top .wrapper-top-nav .top-nav-img{position:absolute;top:21px;left:30px;width:70px;height:38px;display:flex;justify-content:space-around;align-items:center}.wrapper .wrapper-top .wrapper-top-nav .top-nav-img div{width:15px;height:15px;border-radius:50%;box-shadow:0 0 2px rgba(0,0,0,.308)}.wrapper .wrapper-top .wrapper-top-nav .top-nav-img div:nth-child(1){background:#FF6258}.wrapper .wrapper-top .wrapper-top-nav .top-nav-img div:nth-child(2){background:#FFC02C}.wrapper .wrapper-top .wrapper-top-nav .top-nav-img div:nth-child(3){background:#29CC41}.wrapper .wrapper-top .wrapper-top-nav .top-nav-input{width:300px;height:40px;border:1px solid #ccc;position:relative;top:19px;left:50%;transform:translateX(-50%);z-index:999}.wrapper .wrapper-top .wrapper-top-nav .top-nav-input #list{width:302px;border-top:none;background:#fff;position:absolute;top:41px;left:-1px;z-index:1000;display:none;border-bottom:1px solid #ccc}.wrapper .wrapper-top .wrapper-top-nav .top-nav-input #list li{width:280px;height:30px;font-size:12px;line-height:30px;padding-left:20px;border:1px solid #ccc;border-top:none;border-bottom:none;cursor:pointer;transition:all .3s;position:relative;color:#123;white-space:pre}.wrapper .wrapper-top .wrapper-top-nav .top-nav-input #list li #co{left:30px;width:150px;overflow:hidden}.wrapper .wrapper-top .wrapper-top-nav .top-nav-input #list li span{position:absolute;left:200px}.wrapper .wrapper-top .wrapper-top-nav .top-nav-input #list li:hover{background:#ccc}.wrapper .wrapper-top .wrapper-top-nav .top-nav-input input{height:39px;position:absolute;width:260px;left:10px;top:1px;border:none;outline:0;font-size:16px}.wrapper .wrapper-top .wrapper-top-nav .top-nav-input div{width:30px;position:absolute;line-height:40px;right:0;top:0;cursor:pointer}.wrapper .wrapper-top .wrapper-top-nav .top-nav-input #bs{width:16px;height:16px;background:url(./../img//search.png) no-repeat;background-size:cover;position:absolute;top:50%;transform:translateY(-50%);right:10px}.top-nav-right{position:absolute;top:50%;transform:translateY(-50%);right:30px;cursor:pointer}.wrapper #wrapper-bg{width:100%;height:calc(100vh - 80px);position:relative;overflow:hidden;background:#050505}.wrapper #wrapper-bg #img-bg{width:100%;height:100%;position:absolute;filter:blur(90px);opacity:.6;background-position:center center!important;background-size:cover!important}.wrapper #wrapper-bg .bg-content{position:relative;width:1000px;height:500px;margin:0 auto}.play-head{width:24px;height:24px;background:url(./../img/1.png) no-repeat;background-size:cover;position:absolute;top:-14px;left:148px;z-index:11}.play-bar{width:89px;height:123px;background:url(./../img/needle-ip6.png) no-repeat;background-size:cover;position:absolute;top:-2px;left:146px;z-index:10;transform-origin:top left;transform:rotate(-26deg);transition:transform .3s}.play-active{transform:rotate(7deg)!important}.wrapper #wrapper-bg .bg-content .content-left{position:absolute;top:80px;left:30px;width:260px;height:260px;animation:rotation 20s linear infinite;overflow:hidden;border-radius:50%;background:url(./../img/disc-ip6.png) no-repeat;background-size:cover}.left-active{animation-play-state:paused!important}@keyframes rotation{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.wrapper #wrapper-bg .bg-content .content-right{position:absolute;right:0;top:30px;width:650px;height:500px;z-index:2}.wrapper #wrapper-bg .bg-content .content-right h1{color:#fff;height:50px;font-weight:500;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.center-h1{text-align:center!important}.wrapper #wrapper-bg .bg-content .content-right p{position:relative;height:50px;font-size:16px}.wrapper #wrapper-bg .bg-content .content-right p #left{position:absolute;left:0;color:rgba(255,255,255,.2)}.wrapper #wrapper-bg .bg-content .content-right p #left-content{position:absolute;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:200px;left:50px;color:#fff;cursor:pointer}.wrapper #wrapper-bg .bg-content .content-right p #right{position:absolute;right:300px;color:rgba(255,255,255,.2)}.wrapper #wrapper-bg .bg-content .content-right p #right-content{position:absolute;width:150px;right:150px;color:#fff;text-align:left;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wrapper #wrapper-bg .bg-content .content-left #left-img{position:absolute;width:66%;height:66%;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%)}.wrapper #wrapper-bg .bg-content .content-right .main{width:100%;position:relative;left:0;overflow:hidden;min-height:calc(100vh - 400px)}.wrapper #wrapper-bg .bg-content .content-right .main::-webkit-scrollbar{width:5px}.wrapper #wrapper-bg .bg-content .content-right .main::-webkit-scrollbar-thumb{background:0 0}.wrapper #wrapper-bg .bg-content .content-right .main div:nth-child(2){right:100px!important}.wrapper #wrapper-bg .bg-content .content-right .main .main-content{width:70%;position:absolute;top:160px;left:0;transition:top .4s ease-out!important}.wrapper #wrapper-bg .bg-content .content-right .main p{height:40px;line-height:40px;color:rgba(255,255,255,.2);font-size:15px;font-weight:400;text-align:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;transition:all .3s ease}#text-center,.text-c{text-align:center}.action{color:#fff!important;font-size:15px}.active{color:rgba(246,8,48,.52)!important}.wrapper .fixed-bottom{position:fixed;bottom:0;left:0;width:100%;height:100px;z-index:2;background:rgba(14,17,20,.342)}.wrapper .fixed-bottom .bottom-main{position:relative;width:1000px;height:100px;margin:0 auto}.wrapper .fixed-bottom .bottom-main i{vertical-align:middle;line-height:100px;margin-left:5px;cursor:pointer}.wrapper .fixed-bottom .bottom-main .play{display:none;width:60px;height:60px;background:url(./../img/btn.png) 0 -60px no-repeat}.wrapper .fixed-bottom .bottom-main .play:hover{background-position:-60px -60px}.wrapper .fixed-bottom .bottom-main .next{display:inline-block;width:36px;height:36px;background:url(./../img/btn.png) -144px -143px no-repeat}.wrapper .fixed-bottom .bottom-main .next:hover{background-position:-180px -143px}.wrapper .fixed-bottom .bottom-main .prev{display:inline-block;width:36px;height:36px;background:url(./../img/btn.png) 0 -143px no-repeat}.wrapper .fixed-bottom .bottom-main .prev:hover{background-position:-36px -143px}.wrapper .fixed-bottom .bottom-main .pause:hover{background-position:-60px 0}.wrapper .fixed-bottom .bottom-main .pause{display:inline-block;width:60px;height:60px;background:url(./../img/btn.png) no-repeat}.wrapper .fixed-bottom .bottom-main .music-img{position:absolute;top:50%;left:210px;transform:translateY(-50%);width:60px;height:60px}.wrapper .fixed-bottom .bottom-main .music-img img{width:100%;height:100%}.wrapper .fixed-bottom .bottom-main #icon{position:absolute;top:50%;transform:translateY(-50%);left:20px}.wrapper .fixed-bottom .bottom-main .progress{position:absolute;left:50%;bottom:40px;transform:translateX(-50%);width:400px;height:4px;background:rgba(255,255,255,.151);border-radius:5px;cursor:pointer}.wrapper .fixed-bottom .bottom-main .progress .progress-w{width:0;height:4px;border-bottom-left-radius:5px;border-top-left-radius:5px;background:rgba(246,8,48,.52)}.wrapper .fixed-bottom .bottom-main .progress .progress-x{position:absolute;top:50%;transform:translateY(-50%);left:0;width:12px;height:12px;border-radius:50%;background:#d3d3d3}.wrapper .fixed-bottom .bottom-main #content-time{position:absolute;top:25px;right:300px;color:rgba(255,255,255,.342);font-size:12px}.wrapper .fixed-bottom .bottom-main .musicName{position:absolute;width:180px;left:300px;top:25px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:12px;color:rgba(255,255,255,.658)}.wrapper .fixed-bottom .bottom-main .sound{position:absolute;top:0;right:200px;width:40px;height:70px;text-align:center}.wrapper .fixed-bottom .bottom-main .sound i{margin-left:0}.wrapper .fixed-bottom .bottom-main .sound .sound-set{position:absolute;left:0;top:-120px;width:40px;height:140px;background:linear-gradient(-45deg,#333540,#070708,#333540);border-radius:5px;display:none;cursor:pointer;z-index:999}.wrapper .fixed-bottom .bottom-main .sound .sound-set .triangle{position:absolute;left:50%;transform:translateX(-50%) rotate(45deg);bottom:-5px;width:10px;height:10px;background:#262b33}.wrapper .fixed-bottom .bottom-main .sound .sound-set .sY{position:absolute;top:20px;left:50%;transform:translateX(-50%);width:3px;height:100px;background:rgba(255,255,255,.151);border-radius:5px}.wrapper .fixed-bottom .bottom-main .sound:hover .sound-set{display:block}.icon-sound{cursor:pointer;display:block;width:16px;height:16px;background:url(./../img/btn.png) -64px -195px no-repeat;position:absolute;bottom:12px;left:50%;transform:translateX(-50%)}.wrapper .fixed-bottom .bottom-main .sound .sound-set .sY .sY-Y{position:absolute;bottom:30px;width:10px;height:10px;left:50%;transform:translateX(-50%);background:#d3d3d3;border-radius:50%;z-index:999;top:0}.wrapper .fixed-bottom .bottom-main .sound .sound-set .sY .sY-H{position:absolute;bottom:0;width:3px;border-bottom-left-radius:5px;border-bottom-right-radius:5px;background:rgba(246,8,48,.52);height:100px}.wrapper .fixed-bottom .bottom-main .download{position:absolute;right:100px;top:25px;width:50px;height:50px;background:green}.wrapper .fixed-bottom .bottom-main .mlist{position:absolute;right:30px;width:60px;height:22px;top:50%;transform:translateY(-50%);border-radius:15px;background:url(./../img//btn.png) 0 -120px no-repeat;cursor:pointer}.wrapper .fixed-bottom .bottom-main .mlist i{line-height:25px;margin-left:-1px}.wrapper .fixed-bottom .bottom-main .mlist .num{color:#fff;font-size:12px;margin-left:30px}.wrapper .fixed-bottom .bottom-main .mlist .mlist-content{width:350px;height:300px;background:rgba(0,0,0,.6);position:absolute;top:-338px;left:-300px;display:none}.wrapper .fixed-bottom .bottom-main .mlist .mlist-content .bar{width:350px;height:250px}.wrapper .fixed-bottom .bottom-main .mlist .mlist-content ul{width:340px;height:250px;overflow-y:auto}.wrapper .fixed-bottom .bottom-main .mlist .mlist-content ul::-webkit-scrollbar{width:6px}.wrapper .fixed-bottom .bottom-main .mlist .mlist-content ul::-webkit-scrollbar-thumb{background:rgba(255,255,255,.243);border-radius:10px}.wrapper .fixed-bottom .bottom-main .mlist .mlist-content ul li{position:relative;line-height:30px;height:30px;padding:5px 10px 5px 60px;margin:0 auto;text-align:left;color:#d3d3d3;font-size:14px;list-style:none}.wrapper .fixed-bottom .bottom-main .mlist .mlist-content ul li .id{position:absolute;width:35px;left:5px;top:0;height:40px;line-height:40px;text-align:right;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#666;font-size:12px}.wrapper .fixed-bottom .bottom-main .mlist .mlist-content ul li .nameList{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:rgba(255,255,255,.801);width:200px}.wrapper .fixed-bottom .bottom-main .mlist .mlist-content ul li .del{display:none;position:absolute;right:20px;top:50%;width:16px;height:16px;text-align:center;transform:translateY(-50%);background:url(./../img/btn.png) -240px -80px no-repeat}.wrapper .fixed-bottom .bottom-main .mlist .mlist-content ul li .del:hover{background-position:-240px -64px}.wrapper .fixed-bottom .bottom-main .mlist .mlist-content ul li:hover .del{display:block}.wrapper .fixed-bottom .bottom-main .mlist .mlist-content ul li:hover{background:0 0}.wrapper .fixed-bottom .bottom-main .mlist .mlist-content .mlist-head{width:100%;height:50px;line-height:50px;color:#fff;box-shadow:0 1px 1px rgba(255,255,255,.048);text-align:center}.wrapper .fixed-bottom .bottom-main .mlist .mlist-content .mlist-head .icon{width:20px;height:20px;position:relative;left:310px;top:-50%;transform:translateY(-50%);line-height:30px;font-size:20px;background:url(./../img//shut.png) no-repeat;background-size:cover}#esc{width:20px;height:20px;background:url(./../img//shut.png) no-repeat;background-size:cover}.download,.floatList .to{height:50px;position:absolute}.download{top:440px;left:48px;width:230px;background:url(../img/downlaod.png) no-repeat;cursor:pointer;z-index:2}.download:hover{background-position:-231px 0}.floatList{display:none;position:fixed;top:80px;left:50%;transform:translateX(-50%);width:800px;background:#fff;padding-bottom:50px;z-index:50}.floatList .floatHeader,.floatList .head,.floatList .head:hover,.floatList .to{background:#f8f8f8}.floatList .to{width:800px;left:50%;bottom:0;transform:translate(-50%);font-size:12px;color:#666;text-align:center;line-height:50px}.floatList .icon{color:#000;font-size:20px;position:absolute;top:20px;right:15px;cursor:pointer}.floatList .head,.floatList ul li{position:relative;transition:all .2s ease;cursor:pointer}.floatList .floatHeader{width:100%;height:60px}.floatList .floatHeader .name{width:100px;height:58px;font-size:18px;color:#262b33;font-weight:700;line-height:60px;text-align:center;margin-left:10px;border-bottom:2px solid #169af3}.floatList p{padding:0 10px;color:#666;font-size:12px;line-height:50px}.floatList p span{color:#169af3}.floatList .head{color:#666;height:60px;font-size:14px}.floatList .search{height:calc(100vh - 400px);overflow:hidden}.floatList #listS{width:100%;height:calc(100vh - 400px);overflow-y:auto}.floatList ul li{width:100%;height:60px;background:#fff;color:#262b33;font-size:14px;border-bottom:1px solid #f8f8f8}.floatList ul li:hover{background:rgba(255,30,0,.055)}.floatList .head .mName,.floatList ul li .mName{position:absolute;height:60px;line-height:60px;left:60px;width:300px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.floatList ul li img{position:absolute;left:460px;top:50%;transform:translateY(-50%);width:22px;height:22px;border-radius:22px;overflow:hidden}.floatList ul li img:hover{background:0 0}.floatList ul li img:active{background:#a8c7e5}.hint,.loading{background:0 0}.floatList ul::-webkit-scrollbar{width:7px}.floatList ul::-webkit-scrollbar-thumb{background:0 0}.floatList .head .mAlbum,.floatList ul li .mAlbum{position:absolute;height:60px;top:0;width:200px;left:500px;line-height:60px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.floatList ul li .mAlbum{margin-left:40px;left:460px}.floatList .head .mTime,.floatList ul li .mTime{position:absolute;height:60px;top:0;right:50px;line-height:60px}.floatList ul li .mTime{right:40px!important;color:#666;font-size:12px}.floatList ul li .nums{position:absolute;height:60px;width:20px;top:0;left:20px;line-height:60px;color:#666;font-size:12px;text-align:right}.hint{position:fixed;padding:30px 50px;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;border-radius:4px}#canvasContent,.fr,.switchover,.switchover .icon{position:absolute}.switchover{top:50%;right:135px;width:30px;height:30px;transform:translateY(-50%);line-height:16px}.switchover .icon{width:16px;height:16px;top:50%;left:50%;transform:translate(-50%,-50%) scale(1.1);text-align:center;background:url(../img/btn.png) -64px -179px no-repeat;cursor:pointer}.fr{top:50%;left:50%;transform:translate(-50%,-50%)}#canvasContent{width:100%;bottom:100px;z-index:1;left:50%;overflow:hidden;transform:translateX(-50%)}#canvasContent #canvas{width:100%;height:calc(100vh - 180px);opacity:.3;position:relative;bottom:-4px}.loading{position:fixed;z-index:99999;width:100vw;height:100vh;top:0;left:0;display:none;justify-content:center;align-items:center}.loading .load{width:50px;height:50px;animation:loadR 1s linear infinite}@keyframes loadR{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}