﻿/* public */
html,body,form,ol,ul,li,div,p,dl,dt,dd,h1,h2,h3,h4,h5,h6,table,th,td,font,em,ins,span,a{margin:0; padding:0;}
h1,h2,h3,h4,h5,h6,button,input,select,textarea{font-size:100%;font-weight:normal}
html{_filter:expression(document.execCommand("BackgroundImageCache",false,true));}
ul,li,div,dl,dt,dd{list-style:none;}
h1.wm-public{height:0px; line-height:0px; font-size:0px;}
a{text-decoration:none;}
a{blr:expression(this.onFocus=this.blur());outline:none;}
.fr{float: right;}
.ts-c{text-align: center;}
.mr60{margin-right: 60px;}
img{border:0;}
font,em{font-style:normal; font-family:\5b8b\4f53;}
label{vertical-align:middle; font-family:tahoma;}
textarea,input{resize:none; outline:none;}
ins{float:right; text-decoration:none; font-weight:normal;}
.pub_wsp{word-wrap:break-word; word-break:break-all;}
.pub_abso{vertical-align:middle;}
.pub_clr{clear:both;font-size:0;height:0;line-height:0;overflow:hidden;}
.pub_ani{-webkit-transition:0.4s;-moz-transition:0.4s;-ms-transition:0.4s;-o-transition:0.4s;transition:0.4s;}
.pub_ani2{-webkit-transition:.8s;-moz-transition:.8s;-ms-transition:.8s;-o-transition:.8s;transition:.8s;}
.pub_ani3{-webkit-transition:.2s;-moz-transition:.2s;-ms-transition:.2s;-o-transition:.2s;transition:.2s;}
.pub_yh{font-family:"Microsoft YaHei";}
.none{display:none;}
.textover{text-indent: -9999px; overflow: hidden; cursor: pointer; display: block;}
body{background:#fff; font-size:12px; font-family:"Microsoft YaHei",Verdana,Geneva,sans-serif,\5b8b\4f53; min-width: 1360px;}
.content{ width: 100%;width: 1200px;  overflow: hidden; margin: 0 auto;position: relative;}
.wrap{width: 100%;position: relative;}
.logo{font-size: 30px;font-weight: bold;line-height: 84px;color: #000;float: left;}
.logo a{color: #000;}
.banner{width: 100%;height: 543px;background: url(../images/banner.jpg) no-repeat center top;}
.header{position: relative;width: 100%;height: 84px; background: #9fe0e4;}
.header .btn{margin-left: 25px;font-size: 24px;color: #000;font-weight: bold; display: inline-block;}
.header .btn a{color: #000;}
.header .btn a:hover{opacity: 0.8;}
.headerinfo{float: right;position: relative; height: 84px;line-height: 84px;}
.title{font-size: 40px;color: #363636;height: 120px;font-weight: bold;line-height: 120px; margin-left: 410px;}
.login{width: 90px;height: 40px;background: #32bbc3;color: #fff;text-align: center;line-height: 40px;border-radius: 50px;font-size: 20px;display: inline-block;cursor: pointer;}
.userinfo{display: inline-block;font-size: 16px;}
.logout{margin:  0 0 0 5px;cursor: pointer;}
.swiperhot{width: 1080px;height: 263px;margin: 0 auto;}
.swiperhot .swiper-slide .info{cursor: pointer;}

.swiperhot .swiper-slide{width: 228px;height: 263px; border-radius: 0px;overflow: hidden;position: relative; cursor: pointer;}
.swiperhot .swiper-slide .info{height: 50px;width: 100%; color: #00929A;font-size: 20px; line-height: 50px;position: absolute;bottom: 0;}
.swiperhot .swiper-slide .info .num{float: left;padding-left: 24px;background:url(../images/icon0.png) no-repeat 0 12px;margin: 0 0 0 2px;}
.swiperhot .swiper-slide .info .name{float: right;margin: 0  2px 0 0; font-weight: bold;}
.swiperhot .swiper-slide img{width: 100%;}
.pre{width: 33px;height: 57px;background:url(../images/pre.png) no-repeat; position: absolute; cursor: pointer; z-index: 11;top: 96px;left: 0px;}
.next{width: 33px;height: 57px;background:url(../images/next.png) no-repeat; position: absolute; cursor: pointer; z-index: 11;top: 96px;right: 0px;}

.ranking{width: 1080px;margin: 0 auto 50px;position: relative;overflow: hidden;}
.ranking .tit{height: 80px;text-align: left;line-height: 80px; padding-left: 16px; background: #9fe0e4;color: #00929a;font-size: 30px; font-weight: bold;}
.ranking .hot{width: 330px;height: 360px;float: left;background: #ebf9ff;border-radius: 20px;overflow: hidden;}
.ranking .new{width: 330px;height: 360px;float: left; margin-left: 45px; background: #ebf9ff;border-radius:20px;overflow: hidden;}
.ranking .upup{width: 330px;height: 360px;float: right;background: #ebf9ff;border-radius:20px;overflow: hidden;}
.ranking .playicon{width: 48px;height: 48px;background:url(../images/icon3.png) no-repeat; position: relative; top: -63px; left: 265px;}
.ranking ul{font-size: 24px;color: #00929a;line-height: 52px;margin: -42px 0 0 0;}
.ranking ul li {border-bottom: 1px solid #fff; padding-left:10px;}

.ranking2{width: 1080px;margin: 0 auto 50px;position: relative;overflow: hidden;}
.news {width: 760px; height: 800px; float: left;}
.news .tit {height: 80px;text-align: left;line-height: 80px; color: #363636;font-size: 40px; font-weight: bold;}
.news .newslist {width: 760px; height: 682px; background-color: #EFEFEF;}
.news .newslist ul {padding-top: 2px;}
.news .newslist li {width: 752px; height: 130px; background-color: #fff; border-radius: 10px; margin: 4px;}
.news .newslist span {margin-left: 40px; font-size: 32px; color: #00929A;width: 90px; height: 130px; line-height: 130px;  float: left;}
.news .newslist img {width: 109px; height: 109px; margin: 10px 36px 0px 0px;border-radius:10px;float: left;}
.news .newslist p {font-size: 20px; color: #00929A80;padding-top:5px;}
.news .newslist .name {font-size: 32px; color: #00929A; padding-top: 26px;}
.news .newslist .playicon {width: 48px; height: 48px; background: url(../images/icon2.png) no-repeat; position: relative; right: 50px; bottom: 59px; float: right;}
.news .newslist li:hover {opacity: .8;}

.hots {width: 260px; height: 800px; margin-left: 60px; float: left;}
.hots .tit {height: 80px;text-align: left;line-height: 80px; color: #363636;font-size: 40px; font-weight: bold;}
.hots .hotslist {width: 260px; height: 682px; background-color: #EFEFEF;}
.hots .hotslist ul {padding-top: 2px;}
.hots .hotslist li {width: 255px; height: 62px; background-color: #fff; border-radius: 10px; margin: 5px 2px;}
.hots .hotslist span {margin-left: 30px; font-size: 32px; color: #00929A;width: 50px; height: 62px; line-height: 62px; float: left;}
.hots .hotslist p {font-size: 28px; color: #000; ;float: left;height: 62px; line-height: 62px;}

.right{float: right;}
.foot{height: 170px;width: 100%;background: #9fe0e4;margin: 50px auto 0;}
.foot .right{margin: 20px 60px 0;}
.foot .logo{margin: 40px 0 0 60px;}
.foot p{font-size: 16px;line-height: 24px;}
.foot p a{color: #000;}
.foot p a:hover{opacity: 0.8;}
.pop{width: 100%;height: 100%;position: fixed;left: 0;top: 0;right: 0;bottom: 0; z-index: 100;background: rgba(0, 0, 0, 0.6);display: none;}
.popbox{width: 800px;min-height: 400px;background: #ececec;border-radius: 30px; transform: translate(-50%, -50%);  left: 50%;top: 50%; position: absolute;}
.close{width: 30px;height: 30px;background: url(../images/close.png) no-repeat;position: absolute;right: 20px;top: 20px;cursor: pointer;}
.popbox .form{width: 400px;margin: 10px auto 0;}
.popbox .tit{font-size: 30px;text-align: center;line-height: 100px;color: #32bbc3;font-weight: bold;}
.popbox .row{height: 40px;color: #757575;font-size: 16px;margin: 10px auto 0;}
.inputbox{width: 400px;height: 50px;background: #fff;border-radius: 10px; margin: 0 auto 20px;}
.inputbox label,.inputbox input{font-size: 16px;border: 0;line-height: 48px; vertical-align: middle;}
.inputbox label{width: 90px;display: inline-block;text-align: right;}
.inputbox input{margin: 0 auto 0 10px;border: 0;}
.popbox .btn_login{width: 340px;height: 40px;margin: 0px auto 0;line-height: 40px;text-align: center;background: #32bbc3;border-radius: 50px;color: #fff;font-size: 16px;}
.pop span.msg{display: block;
    text-align: right;
    color: #f56c6c;
    width: 100%;}
.btn_account,.btn_reg{cursor: pointer;}
/* inside */
.inside{display: none;}
.back{font-size: 20px;display: block;width: 100px; color: #fff; text-align: center;right: 450px;top: 100px; cursor: pointer; float: right; margin: 37px;}
.detial_img{width: 600px;height: 600px;margin: 60px auto 0;}
.detial_img img{width: 100%;}
.detial_tit{width: 100%;text-align: center;font-size: 30px;margin: 40px auto 0;}
.detial_name,.detial_group{color: #4f4f4f;font-size: 24px;text-align: center;line-height: 40px;}
.th{width: 100%;font-size: 20px;text-align: center; margin: 30px auto 0;height: 70px;line-height: 70px;}
.td{width: 100%;font-size: 20px;text-align: center; margin: 0px auto 0;height: 70px;line-height: 70px;  background: #fff;border-radius: 10px;color: #32bbc3;}
.th span,.td span{margin: 0 0px 0;width: 33%;display: inline-block;}

.musicPlay{width: 100%;height: 100px;background: #32bbc3;margin: 40px auto 0;position: fixed;z-index: 1;bottom: 0;}
.musicPlay .musicPlayTitle {
    float: left;
    width: 180px; 
    line-height: 24px; 
    line-height: 100px;
    font-size: 20px;
    color: #fff;
}
.musicPlay .musicPlayAudio {
    float: left;
    width: 800px;
    height: 50px;
    margin: 23px auto 0;
}
.policy{background: #fff;}
.musicPlay .musicPlayAudio audio{width: 100%;}
/* policy */
.policy_left{width: 270px;float: left;margin: 50px 0 0 10px;}
.policy_left .tab{width: 270px;height: 120px;background: #ebf9ff; border-radius: 10px;font-size: 24px;text-align: center;color: #32bbc3; display: flex;margin: 50px 0 0 0;justify-items: center; justify-content: center;align-items: center;box-shadow:0px 0px 10px #ccc;cursor: pointer;}
.policy_left .tab.on{color: #fff;background: #32bbc3;}
.policy_right{width: 800px;height: 1150px;background: #ebf9ff;border-radius: 20px;box-shadow: 0px 0px 10px #ccc;float: right;margin: 50px 10px 10px 0 }
.policy_right .con{font-size: 18px;margin: 50px 35px;line-height: 30px; display: none; height: 1050px; overflow: auto;text-indent:2em;}
.policy_right .con p {margin-bottom: 5px;}
/*  */
.uesrbox{width: 910px;height: 260px;background: #ebf9ff;border-radius: 20px;margin: 100px auto   ;box-shadow: 0px 0px 10px #ccc;overflow: hidden;}
.uesrbox .img{margin: 60px 0 0 50px;width: 146px;height: 146px;float: left;}
.uesrbox .user_info{width: 290px;height: 240px;margin: 70px 0 0 50px;float: left;}
.uesrbox .user{font-size: 20px;color: #32bbc3;line-height: 50px;}
.uesrbox .tip{font-size: 16px;}
.photo{width: 130px;height: 40px;}
.photo img{height: 100%;}
h2{color: #4f4f4f;font-size: 30px;font-weight: bold;}
.rechargelist{margin: 20px auto 0;}
.rechargelist ul{display: flex;justify-content: space-between;}
.rechargelist ul li{width: 264px;height: 264px;border-radius: 10px;border: 3px solid #8b8b8b;}
.rechargelist .tit{font-size: 30px;line-height: 90px;text-align: center;}
.rechargelist .price{font-size: 60px;font-weight: bold;text-align: center;}
.rechargelist .sale{font-size: 18px;color: #32bbc3;padding-left: 40px;}
.rechargelist .tip{font-size: 16px;padding-left: 40px;color: #4f4f4f;line-height: 30px;height: 30px;}
.rechargelist .btn_recharge{width: 60px;height: 30px;border-radius: 5px;background: #32bbc3;color: #fff;text-align: center;line-height: 30px;margin: 0 auto 0;cursor: pointer;display: none;}
.rechargelist ul li:hover{border: 3px solid #32bbc3;}
.rechargelist ul li:hover .btn_recharge{display: block;}
.prompt{font-size: 20px;text-align: center;color: #32bbc3;width: 100%;margin: 40px auto 0;}
.faq_box{width: 1200px;height: inherit;background: #ebf9ff;border-radius: 10px;overflow: hidden;font-size: 24px;}
.faq_box .con{margin: 50px 90px; }
.faq_box p{margin: 20px auto;}
.faq_box h3{color: #32bbc3;}
.recharge h2{margin: 20px auto ;}

.ranking li{cursor: pointer;}
.ranking li:hover{opacity: 0.8;}
.popImg {
    padding: 60px 0 0 0;
    height: 262px;
}
.popText {
    text-align: center;
    line-height: 30px;
    font-size: 18px;
    color: #737478;
}
.popImg img {
    display: block;
    margin: 0 auto;
    border: 20px solid #CCc;
}