body, div, p, ul, ol, dl, dt, dd, li, form, input, table, img, h1, h2, h3, h4, h5, h6{
margin:0;padding:0;}
body{font-family: poppin,Tahoma,Arial,\5FAE\8F6F\96C5\9ED1,sans-serif;}
a{text-decoration: none;}
ul,li{list-style:none;}
ul:after{content: ""; clear: both; display: block;}
h1,h2,h3,h4,h5,h6{font-weight: normal;}
.vspace{height: 10px; font-size: 0px; line-height: 0px; width: 99%; clear: both;}

.wraper{position: relative; width: 1000px; margin: 0 auto;}
.wraper:after{content: ""; clear: both; display: block;}
.nav-bar{width: 100%; background: #f9f9f9; height: 60px; border-bottom: 1px solid #ddd; z-index: 10;}
.nav-bar .r-bar{height: 60px; line-height: 60px;}
.nav-bar .l-bar{position:relative; float: left; width: 240px; z-index: 2;}
.nav-bar .l-bar:after{content: ""; clear: both; display: block;}
.nav-bar .l-bar a{display: block; width: 120px; line-height: 38px; text-align: center; color: #999; font-size:16px;}
.nav-bar .l-bar a:hover{background-color: #f1f1f1; color:#D43E33;}
.nav-bar .l-bar .active{color:#D43E33;}
.nav-bar .r-bar{float: right; width: 700px;}
.nav-bar .r-bar a{display: inline-block; padding: 0 10px; font-size: 14px; color: #999;}
.nav-bar .r-bar a:hover,.nav-bar .r-bar .on{color: #D43724;}
/*切换乐器*/
.p-musicalTab{position: absolute; top: 22px; left: 48px; font-style: normal; cursor: pointer; color: #D43724; font-size: 14px;}
.p-musicalTab span{padding-left: 10px; color: #999;}
.p-musicalType{display: none; position: absolute; top: 62px; left: 46px; background-color: #fff; border-radius: 3px; 
font-size: 14px; -moz-box-shadow: 0px 1px 16px 0 #99; -webkit-box-shadow: 0px 1px 16px 0 #999; box-shadow: 0px 1px 16px 0 #999;}

.p-wraper{width: 1000px; margin: 0 auto; background-color:#fff;  padding-bottom: 30px;}
.p-collection-title:after{content: ""; clear: both; display: block;}
.p-collection-title{padding-top: 30px; margin-top: 3px;}
.p-collection-title .btn{float: right; padding-right: 20px; margin-top: 5px;}
.p-collection-title .btn-pre{background: url(../img/btn-pre.png) no-repeat; background-size: contain; display: inline-block; width: 20px; height: 20px;}
.p-collection-title .btn-pre:hover{background: url(../img/btn-pre-on.png) no-repeat; background-size: contain; display: inline-block; width: 20px; height: 20px;}
.p-collection-title .btn-next{background: url(../img/btn-next.png) no-repeat; background-size: contain; display: inline-block; width: 20px; height: 20px;}
.p-collection-title .btn-next:hover{background: url(../img/btn-next-on.png) no-repeat; background-size: contain; display: inline-block; width: 20px; height: 20px;}
.p-collection-title h3{font-size: 18px; float: left; color: #D43724; border-left: 6px solid #D43724; padding-left: 12px; height: 30px; line-height: 30px;}
.p-collection-title span{display:block; float: right; font-size: 16px; color: #D43724; margin-top: 4px; padding-right: 20px;}
.p-collection-title i{width:0; height:0; margin-left: 5px; border-top:6px solid transparent; border-bottom:6px solid transparent; 
border-left:6px solid #D43724; display: inline-block;}
.p-collection-content{margin-top: 10px; width: 1000px; overflow: hidden;}
.p-collection-content ul{width: 9999px; overflow: hidden; clear: both;}
.p-collection-content li{float: left; width: 1000px; overflow: hidden;}
.p-collection-content .box{position: relative; width: 164px; height: 164px; overflow: hidden;}
.p-collection-content img{width: 164px; height: 164px; display:block; transition:All 0.5s ease-in-out; -webkit-transition:All 0.5s ease-in-out; -moz-transition:All 0.5s ease-in-out; -o-transition:All 0.5s ease-in-out;}
.p-collection-content img:hover{transform:scale(1.2); -webkit-transform:scale(1.2); -moz-transform:scale(1.2); -o-transform:scale(1.2); -ms-transform:scale(1.2);}
.p-collection-content .mask-text{position: absolute; width: 164px; left: 0; bottom: 0; height: 50px; background-image: url(../img/bj-mask.png); display: block;}
.p-collection-content h4{font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space:nowrap; margin-top: 5px; padding-left:8px; color: #fff; height: 20px;}
.p-collection-content p{font-size: 14px; color: #fff; margin-top: 23px; margin-left: 8px; height: 20px; overflow: hidden; text-overflow: ellipsis; white-space:nowrap;}
.p-collection-content .pic-box{float: left; margin-left: 30px;  margin-top: 30px;}

.p-single-content ul:first-child{border-top: 1px solid #F1F1F1; margin-top: 30px;}
.p-single-content li{padding: 20px; border-bottom: 1px solid #F1F1F1;}
.p-single-content li:hover{ background:#fafafa url(../img/play.png) 880px center no-repeat ;}
.p-single-content li:after{content: ""; clear: both; display: block;}
.p-single-content .l-img{width: 80px; height: 80px; float: left;}
.p-single-content .l-img img{width: 80px; height: 80px; display: block; border-radius: 50%;}
.p-single-content .r-text{float: left; margin-left: 30px; margin-top: 10px;}
.p-single-content h3{font-size: 18px; color: #000;}
.p-single-content h3 em{ display: inline-block; width: 10px;}
.p-single-content h3 img{ display: inline-block;}
.p-single-content p{font-size: 15px; margin-top: 15px; color: #888;}
.p-single-content span{margin-right:20px; float: left;}
.p-single-content .num-dj{background: url(../img/sanjiao.png) left center no-repeat; padding-left: 16px;}
.p-single-content .num-sc{background: url(../img/xin.png) left center no-repeat; padding-left: 16px;}

.page{text-align: center; font-family: poppin,Tahoma,Arial,\5FAE\8F6F\96C5\9ED1,sans-serif; font-size: 16px; line-height: 30px; margin-top: 30px;}
.page a{ margin: 0 5px; display: inline-block; padding: 0 10px; text-align: center;}  
.page a:hover{ border-bottom:1px solid #d53a32;}
.page .active{border:1px solid transparent; background: #d53a32; color: #fff;}



