a,abbr,address,article,aside,audio,b,blockquote,body,caption,cite,code,dd,del,dfn,dialog,div,dl,dt,em,fieldset,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,hr,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,sup,tfoot,th,thead,time,tr,ul,var,video,ul,input{border:0;margin:0;outline:0;padding:0;font-size:100%;font-weight:normal;list-style:none}
body *{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:rgba(255,255,255,0);-webkit-font-smoothing:antialiased}
body{margin:0;padding:0;width:100%;height:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-text-size-adjust:none;font:16px/1.25 "Open Sans","Helvetica Neue","微软雅黑",Helvetica,Arial,sans-serif;font-weight:bold;letter-spacing:-0.05em;overflow:auto}
html{-webkit-text-size-adjust:none;height:100%}
::-webkit-scrollbar{width:1px}
::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);border-radius:10px}
::-webkit-scrollbar-thumb{border-radius:10px;background:rgba(0,0,0,0.1);-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.5)}
::-webkit-scrollbar-thumb:window-inactive{background:rgba(0,0,0,0)}
input::placeholder{color:#eeeeee99}
button{padding:0;margin:0;background-color:transparent;border:0px}
select,textarea,input[type="text"],input[type=search],input[type="password"],input[type="datetime"],input[type="datetime-local"],input[type="date"],input[type="month"],input[type="time"],input[type="week"],input[type="number"],input[type="email"],input[type="url"],input[type="tel"],input[type="color"],.input-group{padding:0;margin:0}
.base{height:9em;left:50%;margin:-7.5em;padding:3em;position:absolute;top:50%;width:9em;transform:rotateX(45deg) rotateZ(45deg);transform-style:preserve-3d;box-sizing:unset}
@keyframes anim{50%{transform:translateZ(0.5em)}
}.mcontainer{height:100%;padding-bottom:0rem;overflow:auto}
header{height:auto;border:none;background-color:none}
#section_container{position:absolute;overflow:hidden;top:0;left:0;right:0;bottom:0;z-index:3;background:#000;background-size:cover}
div.popup_tran{background:#ffffffee;border-radius:3vw}
div.popup_tran .layui-layer-content{border-radius:3vw}
div.layui-layer-msg{border-radius:10px}
div.layui-layer-hui{background-color:rgba(0,0,0,0.7)}
div.layui-layer-ok{min-width:100px;background-color:#008d55e0;color:#fff;border:none}
div.layui-layer-msg .layui-layer-content{padding:8px 10px;text-align:center}
.scrollWrapper-container{overflow:auto;position:relative;}
.scrollWrapper{position:relative;padding-bottom:1.4rem;overflow:hidden}
.refresh-container{padding:0;line-height:100px;z-index:100;text-align:center;padding-bottom:0px;position:absolute;width:100%;top:-100px;background:linear-gradient(#00000020,#00000000)}
.refresh-totop{padding:0;z-index:201;text-align:center;position:fixed;width:0.6rem;height:0.6rem;line-height:0.6rem;right:1rem;font-size:0.3rem;bottom:1.5rem;border-radius:0.3rem;opacity:0.5; background:#555;color:#fff;display:none;box-shadow:3px 3px 5px #000560;}
.refresh-icon{font-size:1.1em;display:inline-block;color:#aaa;text-shadow:1px 1px #333}
.refresh-label{font-size:1em;display:inline-block;color:#aaa;text-shadow:1px 1px #333}
.refresh-tip{display:block;padding:3px;font-size:.9em}
.icon-reverse{-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-transition-duration:.5s;transition-duration:.5s}
#section_container_mask{position:absolute;overflow:hidden;top:0;left:0;right:0;bottom:0;z-index:10;display:none}
section{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;overflow:hidden;display:none}
section.anim:after{content:"";position:absolute;display:block;top:0;left:0;bottom:0;right:0}
section.active{z-index:6;display:block}
section.animating{z-index:5;display:block}
article{position:absolute;top:0;bottom:0;width:100%;visibility:hidden;display:none;overflow:hidden;z-index:0;background:none}
article.active{visibility:visible;display:block;z-index:1}
footer{background-color:#262F3D}
footer > a{color:#fff}
footer > a.active{color:#02E6FF}
.separate20px{margin-top:0.2rem}
input[type=search]::-ms-clear{display:none}
.panel-title{color:#eee;font-size:4vw;width:98%;margin:0px;padding:0.03rem 3%;font-weight:normal;display:block}
.panel-title span{
    border-bottom: solid 3px #8a04db;
    padding: 5px;
    display: inline-block;
    letter-spacing: 1px;
    font-weight:600;
}
.panel-title .more{
    color:#999;
    font-size:80%;
    line-height:30px;
    display: inline-block;
    float:right;
    letter-spacing: 1px;
}
input[type=search],input::-webkit-search-decoration,input::-webkit-search-cancel-button{-webkit-appearance:none}
.more-icon{width:0.6rem;height:0.80rem;display:flex;flex-direction:column;justify-content:center;align-items:end}
.more-icon > dot{font-family:arial;font-size:0.2rem;width:0.06rem;height:0.06rem;background:#CCCCCC;margin:0.06rem;border-radius:100px}
.more-icon > .ico{font-size:0.45rem;color:#aaaaaadd;}
.bottombar{position:fixed;bottom:0px;height:1.3rem;margin:3px 0.5% 3px 1.5%;width:98%;background:url(/Content/MNKtv/imgs/ctr_bc.png) no-repeat;background-size:100% 100%;display:flex;justify-content:space-around;box-shadow:none;border:none;padding:0px 0.32rem 0px 0.28rem}
.bottombar > a{padding-top:4vw;display:block;text-align:center;display:flex;flex-flow:column;width:19%;}
.bottombar > a > i{width:0.65rem;height:0.58rem;margin:0 auto;background-image:url(/Content/MNKtv/imgs/sprites.png?v=1);background-size:5rem auto;background-repeat:no-repeat}
.bottombar > a > span{font-size:3vw;color:#dddddd;margin-top:0rem}
.bottombar .controlmenu{width:24%;}
.bottombar .controlmenu > i{margin-top:-0.05rem;position:relative;top:-0.11rem;width:1.02rem;height:1rem;background-size: 8.2rem auto}
.icon-bottombar-mine{background-position:-1.23rem -0.64rem}
.icon-bottombar-mine-active{background-position:-1.85rem -0.64rem}
.icon-bottombar-played{background-position-x:-2.45rem}
.icon-bottombar-played-active{background-position-x:-3.1rem}
.icon-bottombar-playlist{background-position-x:-3.72rem}
.icon-bottombar-playlist-active{background-position-x:-4.34rem}
.icon-bottombar-square{background-position:-0rem -0.64rem}
.icon-bottombar-square-active{background-position:-0.61rem -0.64rem}
.icon-bottombar-controller{background-position-x:0rem}
.icon-bottombar-controller-active{background-position-x:-1.02rem}

.minik-list{height:100%;overflow:auto;padding-bottom: 20px;}
.minik-list > li{display:flex;flex-flow:column}
.minik-list .list-item-base{display:-webkit-flex;display:flex;flex-direction:row;padding:0.15rem 0.3rem;border-bottom:0.01rem solid rgba(255,255,255,0.1);justify-content:space-between;align-items:center}
.minik-list > li.list-grid-item{width:50%;float:left;padding-left:0.3rem;}
.minik-list > li.list-grid-item:nth-child(2){padding-left:0.1rem;padding-right:0.2rem;}
.minik-list .list-grid-item .list-item-base{display:block;position:relative;border:none;padding:0.2rem 0;}
.minik-list .list-grid-item .list-item{max-width:100%;}
.minik-list .list-grid-item .song-title>div{font-size:0.27rem}
.minik-list .list-grid-item .small-song-title{display:block;padding-left:0px; font-size:0.25rem; line-height:0.4rem;}

.minik-list > li.list-load{text-align:center;padding:0.2rem 0px 50px 0px;font-size:3.5vw;width:100%;color:#a0a0a0}
.minik-list > li.list-end{text-align:center;padding:0.2rem 0px 50px 0px;font-size:3.5vw;color:#a0a0a0;width:100%;margin-bottom:80px}
#recharge-ul > li{float:left;width:48%;margin:1%;border:solid 1px #ddd;box-shadow:#efefef 2px 2px}
#recharge-ul li.list-end{display:none}
#recharge-ul > li .song-title > div{font-size:16px;}
#recharge-ul > li .song-title .small-song-title{font-size:14px;color:red}
.record-item-playinfo > span{color:#969696;min-width:1rem;font-size:0.2rem;display:inline-block}
.ibefore-listen:before{width:0.35rem;height:0.18rem;vertical-align:unset;background-position-x:-15.40rem}
.ibefore-like:before{width:0.25rem;height:0.18rem;vertical-align:unset;background-position-x:-14.88rem}
.ibefore-point:before{width:0.25rem;height:0.18rem;vertical-align:unset;background-position-x:-15.88rem}
.list-item{display:flex;flex-direction:row;max-width:85%}
.list-item > img{border-radius:50%}
.list-item-option{width:100%;height:0px;display:flex;justify-content:flex-end;flex-wrap:wrap;align-items:center;overflow:hidden;font-size:0.22rem;padding:0 0.6rem;background:#312161;transition:height 0.2s}
.list-item-option.active{height:0.91rem}
.list-item-option > a{height:0.9rem;width:1.8rem;line-height:0.9rem;color:#e6e6e6;display:block;background-color:transparent}
.list-item-option > a:before{margin-right:0.05rem;width:0.43rem;height:0.43rem}
.btn-collect:before{background-position-x:-9.89rem}
.btn-settop:before{background-position-x:-10.88rem}
.btn-close:before{background-position-x:-9.39rem}
.btn-share:before{background-position-x:-11.38rem}
.btn-follow:before,.btn-followed:before{background-position-x:-10.38rem}
.simple-list{list-style:none}
.simple-list > li{width:92%;margin:0px 4%;padding:0.15rem 2% 0.15rem 5%;height:1.2rem;border-bottom:0.01rem solid #ffffff10}
.simple-list > li > a{color:#eee;font-size:0.3rem;display:block;width:100%;height:0.9rem;line-height:0.9rem;padding:0;text-align:left}
.simple-list > li .lb{color:#eee;font-size:0.3rem;margin-right:0.3rem;float:left;display:block;width:0.9rem;height:0.9rem;line-height:0.9rem;text-align:center;background-image:radial-gradient(ellipse at top left,#ff6699 0%,#6666ff 65%);border-radius:0.2rem;border-top-left-radius:0px}
.simple-list > li .lb1{background-image:radial-gradient(ellipse at top left,#33ccff 0%,#9933ff 45%)}
.simple-list > li .lb2{background-image:radial-gradient(ellipse at top left,#ffcc99 0%,#cc99cc 65%)}
.simple-list > li .lb3{background-image:radial-gradient(ellipse at top left,#ff6699 0%,#1684b9 75%)}
.simple-list > li .lb4{background-image:radial-gradient(ellipse at top left,#6633cc 0%,#7f7fea 65%)}
.simple-list > li .icon{float:right;height:0.9rem;line-height:0.9rem;color:#69629c}
.simple-list > li > a:after{margin-top:0.3rem;float:right;height:0.27rem;width:0.16rem;background-position-x:-16.88rem;background-position-x:-16.9rem}
.top-searchbar{height:1rem;width:100%;padding:0 0.35rem;display:flex;align-items:center;position:fixed;top:0}
.top-searchbar > a{position:absolute;right:0.5rem;cursor:pointer;border:none;margin:0;background:url(/Content/MNKtv/imgs/bt_searchicon.png) no-repeat;background-size:100% 100%;width:0.4rem;height:0.4rem;filter:brightness(0.5)}
.top-searchbar > input{border-radius:0.1rem;margin:0px;height:0.6rem;width:100%;text-align:center;font-size:0.26rem;
                       padding-right:0.6rem;padding-left:0.2rem;border:0.01rem solid #55555599;color:#eee;
                       box-sizing:border-box;background:rgba(255,255,255,0.1);border-radius:0.4rem;line-height:0.7rem;outline:none;}
.top-searchbar > input::placeholder{line-height:0.5rem;text-align:center;font-size:0.22rem}
.top-searchbar .search{position:absolute;top:0.28rem;right:0.24rem;cursor:pointer;border:none;font-size:0.3rem;color:#22c3b6;}
.top-singer-category{position:fixed;top:0;width:100%;height:100%;display:flex;flex-direction:column;z-index:1}
.singer-category-popbutton{display:flex;justify-content:center;align-items:center;height:0.96rem;background:#22c3b6;flex-basis:0.96rem}
.singer-category-popbutton span{color:white;font-size:0.28rem}
.singer-category-popup{flex-grow:1;background:rgba(0,0,0,0.8)}
.singer-category-popup > ul{max-height:6.5rem;overflow:auto}
.singer-category-popup > ul a{background:white;color:#666666;display:inline-block;height:0.9rem;line-height:0.9rem;text-align:center;width:100%;font-size:0.26rem;border-bottom:0.05rem solid #F1F1F1}

.top-titlebar{width:100%;height:1.5rem}
.category-entry-list{padding-bottom:1rem;height:calc(100% - 1.6rem);overflow-y:auto}
#singer-catelist{height:90%}
.category-entry-list > ul{margin-bottom:0.2rem}
.datalist-topbar{width:100%;position:fixed;top:0;z-index:1;color:white;font-size:0.28rem}
.datalist-topbar > .top-searchbar{position:relative}
.datalist-category{padding:0px 0.2rem 0.1rem 0.2rem;display:flex;justify-content:space-between;align-items:center;color:#ddd;}
.datalist-category-popbutton{display:flex;justify-content:center;align-items:center;height:0.3rem}
.datalist-category-popbutton > small{color:#999}
.datalist-category-popbutton > span{margin-right:0.2rem}
.topic-popup{width:100%;height:0px;top:1rem;position:fixed;overflow:auto;z-index:2;transition:all 0.3s}
.topic-popup.active{width:90%;height:auto;max-height:50%;margin-left:5%;box-shadow:1px 1px 5px #000;border-radius:0.2rem;background:#222}
.topic-popup > li{width:100%;overflow-x:auto}
.topic-popup > li > a{min-width:100%;height:0.9rem;background-color:rgba(0,0,0,0.1);color:#fff;display:inline-block;line-height:0.9rem;overflow:hidden;text-align:center;font-size:0.26rem;word-break:keep-all;white-space:nowrap;padding:0px 0.1rem}
.gift-topic-popup > li > a{font-size:0.2rem}
.topic-popup-container{background-color:rgba(0,0,0,0);height:0;width:0;top:1rem;position:fixed;z-index:11;transition:background-color 0.6s}
.topic-popup-container.active{height:100%;width:100%;backdrop-filter:blur(2px)}
#category-entry-container{padding-top:0.96rem}
.singer-profile-picture{width:0.8rem;height:0.8rem}
.song-title{margin-left:0.2rem;display:flex;flex-direction:column;justify-content:space-around;flex-shrink:1}
.song-title > div{font-size:0.28rem;color:#ddd}
.song-lab{font-size:60%;color:#cfcfcf;background:#3c227c;padding:0px 2px;}
.small-song-title{font-size:0.2rem;color:#1d9e62;padding-left:0.2rem}
.song-title > div em,.small-song-title em{color:red;font-style:normal}
#singerlist_container{padding-top:1rem}
.singer-list{padding:10px 6%}
.singer-list > li{display:block;float:left;width:25%;height:2.2rem}
.singer-list .list-item{display:block;max-width:100%;text-align:center}
.singer-list .song-title{margin-left:0px}
.singer-list .song-title > div{padding-top:10px}
.singer-list .list-item-base{border:none;padding:0px;display:block}
.singer-list .list-item > img{border-radius:50%;border:0.09rem solid rgba(0,0,0,0.1);}
.singer-list .singer-profile-picture{width:1.3rem;height:1.3rem}
.top-fixedbar{position:fixed;width:100%;top:0;z-index:10}

.user-info-banner{width:100%;background-color:rgb(34,195,182);height:3.5rem}
.user-profile-picture{font-size:0.3rem;color:white;text-align:center;display:flex;flex-direction:column;align-items:center;letter-spacing:0.003rem;padding-top:.4rem}
.user-profile-picture > img{width:1.36rem;height:1.36rem;border-radius:50%;display:block;margin-bottom:.2rem}
.user-data{display:flex;justify-content:space-between;padding-top:0.3rem;padding-bottom:0.2rem}
.user-data > i{display:block;height:0.40rem;width:1px;margin:auto 0;background:#FFFFFF}
.user-data .myamount>i{color:#ffe400}
.user-data > a{margin:0 0.5rem;display:inline-block;flex-grow:1;text-align:center;color:rgba(255,255,255,0.8)}
.user-data > a > i{display:block;color:#ffffff;font-style:normal;font-size:0.22rem;font-weight:bold}
.user-data > a > span{transform:scale(0.8);font-size:0.16rem}
.tab-splitbar{width:1px;height:0.76rem;margin-top:0.1rem;background-color:#cccccc;margin:auto 0}

.panel-btns{width:100%;display:block;padding:0.2rem;height:auto;text-align:center}
.panel-btns > button{width:23%;height:0.65rem;line-height:0.65rem;display:inline-block;padding:0 0.1rem;border:solid 0.01rem rgba(255,255,255,0.1);border-radius:0.11rem;color:#fff;box-shadow:1px 1px 3px #2a1b44;background:rgba(0,0,0,0.1);margin:0 0.5%;font-size:3vw;overflow:hidden;overflow-wrap:initial;position:relative}
.panel-btns > button .checkmark{position:absolute;right:0.05rem;top:0.05rem;color:#14f344;display:none;font-size:0.3rem;line-height:0.3rem}
.panel-btns > .button-alive .checkmark{display:block}
.star-container{padding-right:1rem}
.user-follow{padding:0.06rem 0.08rem;position:absolute;top:0.17rem;right:0.17rem;border-radius:0.3rem;border:solid 1px rgba(255,255,255,0.8);font-size:0.16rem;letter-spacing:0.002rem;color:rgba(255,255,255,0.8);text-align:center;display:flex;align-items:center}
.user-follow > span{}
.popup_confirm_btns{width:100%;height:1rem;display:flex;justify-content:space-between;align-items:center;border-top:0.02rem solid #f1f1f1}
#tpl-interaction-container .popup_confirm_btns{background:#fff}
.popup_confirm_btns > button{height:0.9rem;flex-grow:1;background-color:white;text-align:center;font-size:0.24rem;font-weight:normal;font-stretch:normal;letter-spacing:0.002rem;color:#22c3b6;border-radius:0}
.popup_confirm_btns > button:first-child{border-right:0.02rem solid #f1f1f1}

.textWraper{word-break:keep-all;white-space:nowrap;margin-left:0;animation:textWraper 4s;animation-iteration-count:infinite;animation-direction:alternate-reverse;animation-play-state:running;animation-timing-function:linear}
.textWraper > span{margin:0 0.2rem}
.textBoxer {
    padding: 0.1rem 0.2rem;
    color: #fff;
    box-shadow: #222 1px 1px 8px;
}

.bdshare_dialog_box{display:none}
.social-share-cs{margin:0.5rem 0;display:flex;justify-content:center;align-items:center;flex-wrap:wrap}
#follow_container{padding-top:1.3rem}
.signalr-state-container{width:100%;height:40px;position:fixed;top:0;left:0;z-index:200;background:#ffffff33;color:#bbb;line-height:40px;padding:0 20px;font-weight:bold}

.home-banner{height:0.8rem;position:relative}
.giftbanner{width:90%;height:auto;display:block;margin:5px auto;border-radius:8px;}
.adsbanner {
    width: 94.5%;
    display:block;
    margin: 5px auto;
    height: auto;
    min-height: 18vw;
    max-height: 30vw;
    border-radius: 8px;
}
.top-titlebar .giftbanner{width:80%;margin:0.3rem auto;}
.home-banner-info{width:100%;position:absolute;top:0;text-align:center}
.home-keyword{margin-top:0rem;z-index:1;width:100%;padding:0.1rem 0.1rem;box-sizing:border-box}
.home-keyword > input{height:0.6rem;width:100%;padding-left:0.2rem;margin:0;border:0.01rem solid #55555599;box-sizing:border-box;background:rgba(255,255,255,0.1);border-radius:0.4rem;line-height:0.7rem;font-size:0.26rem;color:#eee;outline:none;text-align:center;}
.home-keyword > .icon{position:absolute;top:0.2rem;right:0.25rem;cursor:pointer;border:none;font-size:0.3rem;margin:0;color:#aaa;}
.home-banner-info > p{padding:0;margin:0.8rem 0 0.2rem 0;opacity:0.8;font-size:0.4rem;font-weight:normal;font-stretch:normal;letter-spacing:0.006rem;color:#ffffff}
.home-banner-info > span{padding:0;font-size:0.34rem;font-weight:normal;font-stretch:normal;letter-spacing:0.003rem;color:#ffffff;opacity:0.8}
.home-entry{width:97%; height:auto;margin:0.2rem 0 0.2rem 3%;padding-right:3%;display:block;overflow:hidden;overflow-x:auto; white-space:nowrap;line-height:0px;}
.home-entry::-webkit-scrollbar{display:none}

.home-entry > a{width:16vw;height:16vw;margin-bottom:0.1rem;display:inline-block;text-align:center;overflow:hidden;position:relative;line-height:4.5vw;font-size:4.2vw;}
.home-entry > a:nth-child(1){width:33vw;}
.home-entry > a:nth-child(8){width:33vw;}
.home-entry > a > span{width:100%;height:100%; padding:0.1rem;display:flex;text-align:left;color:#fff;white-space:normal;word-break:break-word;align-items:center;text-align:left;}
.home-list{width:100%;height:90%;height:calc(100% - 0.8rem);overflow-y:auto}
.home-empty{width:94%;text-align:center;padding:1rem 0px;font-size:3vw;color:#555;font-style:italic;background:none;margin: 5px auto;}
.homeicon{width:2.24rem;height:2.75rem;background-image:linear-gradient(45deg,#5f03d4,#009ad4);border-radius:2px;}
.home-entry > a:nth-child(2){background-image:linear-gradient(45deg, #007f62, #689d00)}
.home-entry > a:nth-child(3){background-image:linear-gradient(45deg, #7f000c, #7e009d)}
.home-entry > a:nth-child(5){background-image:linear-gradient(45deg, #007f62, #689d00)}
.home-entry > a:nth-child(6){background-image:linear-gradient(45deg, #7f000c, #7e009d)}
.home-entry > a:nth-child(7){background-image:linear-gradient(49deg, #00217f, #004d9d)}
.home-entry > a:nth-child(8){background-image:linear-gradient(313deg, #7f0000, #9d6d00)}
.home-entry > a:nth-child(9){background-image:linear-gradient(45deg, #d3c300, #9d9800)}
.home-entry > a:nth-child(10){background-image:linear-gradient(45deg, #2d1618, #616161)}

/*layui*/
.layui-layer-title{font-size:0.25rem!important;}
.layui-layer-dialog .layui-layer-content{font-size:0.25rem!important;line-height:0.35rem!important;}
.layui-layer-btn a{padding:0px!important;width:45%;text-align:center;line-height:0.5rem;height:0.5rem;margin:0 2%;}
.layui-layer-btn{text-align:center!important}

#user_section .contbox .listbar li{background:#aaaaaa10;color:#ddd;border-bottom-color:#ffffff10;}
#user_section .contbox .listbar li.colorbg_anim{background:linear-gradient(45deg,#00000010,#00000010,#00fff145,#00000010,#00000010);background-size:200% 100%;}




@-webkit-keyframes coverRotate{0%{-webkit-transform:rotate(0deg)}
100%{-webkit-transform:rotate(360deg)}
}#controller-container{height:100%;overflow-y:auto}
#controller-container button{background-color:rgba(0,0,0,0)}

.playsong-panel{height:4rem;width:100%}
.playsong-panel > .playsong-cd{width:4rem;height:4rem;border-radius:50%;display:block;background:url(/content/mnktv/imgs/play-cd.png) no-repeat;background-size:100%;margin:0.54rem auto 0.18rem auto;object-fit:cover;animation-play-state:paused;-webkit-animation:coverRotate 4s infinite linear;animation:coverRotate 14s infinite linear}
.playsong-panel .ctrl-blur-bg{display:inline-block;height:58.4%;width:58.4%;margin:19.8% 21%;border-radius:50%}
.playsong-panel > .playsong-cd-yd {
    width: 2.2rem;
    height: 0.8rem;
    display: block;
    position: absolute;
    right: 0.4rem;
    top: 2.5rem;
    transform-origin: 78% 50%;
}

.playsong-panel > .playsong-info-tr {
    display: block;
    position: absolute;
    right: 0.3rem;
    top: 0.3rem;
    font-size: 0.2rem;
    padding: 0.05rem 0.1rem;
}

.ctrl-infopanel {
    width: 90%;
    text-align: center;
    font-size: 0.22rem;
    letter-spacing: 0.002rem;
    color: #ffffff;
    line-height: 0.8rem;
    margin: auto;
    overflow: hidden;
    border-radius: 10px;
}
.playbtns{display:flex;justify-content:space-between;margin:0.1rem 0.5rem}
.ctrl-playbutton{text-align:center;}
.ctrl-playbutton>span{max-width:1rem;overflow:hidden;margin:0px auto;}
.ctrl-playbutton > span{color:white;font-size:0.2rem;text-align:center;display:block;width:100%;margin-top:0.1rem}
#ctrl-option{height:auto;padding-bottom:1rem}
#ctrl-volume-container{display:none;justify-content:space-between;padding:0.31rem 0.38rem 0.46rem 0.38rem}
.ctrl-volumebar{text-align:center;line-height:0.77rem;color:white;display:flex;justify-content:space-between}
.ctrl-volumebar > *{width:33%;height:100%}
.ctrl-volume{text-align:center;color:white;font-size:0.22rem;width:2.77rem}
.ctrl-volume > span{margin-top:0.18rem;display:block}
#ctrl-option-btns{display:flex;justify-content:space-between;padding:0.2rem 1rem}
#ctrl-option-btns span{display:block;color:white;font-size:0.2rem;margin-top:0.15rem;text-align:center}

.progressbar{display:flex;justify-content:space-between;align-items:center;margin-top:0.3rem;box-sizing:border-box}
.progressbar > button{background-color:transparent;width:1rem;height:1rem;padding:0}
.progressbar input[type=range]{-webkit-appearance:none !important;border-radius:0.1rem !important;height:0.08rem !important;border:none;margin:0 0.1rem;width:4.3rem;background:linear-gradient(to right,#cbcbc1 50%,#6f6f6f 50%)}
.progressbar input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;background:radial-gradient(#0ba6f9 0,#0ba6f9 4px,#16a2ec 4px);border-radius:100%;box-shadow:0px 0px 10px 0.01rem rgba(0,0,0,0.2)}
.ctrlicon {
    width: 1rem;
    height: 1rem;
    background-image: url(/content/mnktv/imgs/sprites.png?v=1);
    background-size: 8rem auto;
    background-repeat: no-repeat
}
.icon-ctrl-pause{width: 1.42rem;height: 1.22rem;font-size: 0.26rem;background-position: 0.1rem -2rem}
.icon-ctrl-play {width: 1.42rem;height: 1.22rem;font-size: 0.26rem;background-position: -1.3rem -2rem;}
.icon-ctrl-light{width:1.23rem;height:1.23rem;background-position: -2.85rem -2rem;}
.icon-ctrl-service{width:1.23rem;height:1.23rem;background-position: -4.85rem -2rem;}
.icon-ctrl-interaction{width:1.23rem;height:1.23rem;background-position: -5.73rem -2rem;}
.icon-ctrl-tone{width:1.23rem;height:1.23rem;background-position:-4.28rem -2rem;}
.icon-ctrl-next{width:0.97rem;height:0.97rem;background-position: -3rem -3.95rem;}
.icon-ctrl-raw{width:0.97rem;height:0.97rem;background-position: -1rem -3.9rem}
.icon-ctrl-music{width:0.97rem;height:0.97rem;background-position: 0rem -3.9rem;}
.icon-ctrl-replay{width:0.97rem;height:0.97rem;background-position: -4rem -4rem;}
.icon-ctrl-voiced{width:0.97rem;height:0.97rem;background-position: -2rem -3.95rem;}
.icon-ctrl-mute{width:0.97rem;height:0.97rem;background-position: -7rem -3.95rem;}
.icon-ctrl-volume-down{background-position-x:-10.8rem;background-position: -5.12rem -4rem;}
.icon-ctrl-volume-up{background-position-x:-11.7rem;background-position: -6.16rem -4rem;}
.icon-ctrl-btn {
    width: 1.1rem;
    height: 1.1rem;
    background-image: linear-gradient(#a65bf2,#8f31e3);
    border-radius: 50%;
    color: #fff;
    font-size: 0.5rem;
    line-height: 1.05rem;
}
.ctrl-volume-wrapper{padding:0.01rem 1rem}
.ctrl-volume-wrapper p{margin-top:0rem;width:100%;text-align:center;font-size:0.2rem;color:#FFF}


/*底部弹出菜单*/
.dropupbox {
    width: 100%;
    height: 100%;
    background: #00000099;
    position: fixed;
    left: 0px;
    top: 0px;
    z-index: 103;
    display: none;
}

.dropupcont {
    width: 100%;
    background: #efefef;
    position: absolute;
    left: 0px;
    bottom: 0px;
    z-index: 104;
    overflow: hidden;
}

.dropupscroll {
    width: 100%;
    height: 3.2rem;
    overflow-y: auto;
}

.dropuphead {
    width: 100%;
    height: 0.5rem;
    line-height: 0.5rem;
    background: #ddd;
    text-align: center;
    font-size: 0.25rem;
}

    .dropuphead .close {
        position: absolute;
        display: block;
        height: 0.5rem;
        line-height: 0.5rem;
        top: 0px;
        right: 0px;
        width: 40px;
        color: #000;
        text-align: center;
    }

.dropuplist {
    width: 96%;
    padding: 0px 2%;
    margin: 0px;
    height: auto;
    overflow: hidden;
}

.dropupitem {
    list-style: none;
    margin: 0px;
    float: left;
    width: 25%;
    min-height: 1.5rem;
    height: auto;
    overflow: hidden;
}

.dropupgray {
    opacity: 0.5;
}

.dropupitem > i, .dropupitem > .ico {
    width: 100%;
    display: block;
    font-size: 0.6rem;
    height: 1rem;
    line-height: 1rem;
    text-align: center;
}

.dropupitem > span {
    width: 100%;
    display: block;
    font-size: 0.22rem;
    line-height: 0.3rem;
    text-align: center;
}

.dropupitem > img {
    width: 100%;
    padding: 0;
    display: block;
    font-size: 0.6rem;
    height: 1rem;
    line-height: 1rem;
    text-align: center;
}

.dropupitem > span > em {
    font-size: 80%;
    color: #ab009e;
    display: block;
    width: 100%;
}