body, div, p, ul, ol, dl, dt, dd, li, form, input, table, img, h1, h2, h3, h4, h5, h6{
margin:0;padding:0;}
body{background:#fff none;color:#333;font-size:12px;font-style:normal;font-weight:normal; font-family: Helvetica,PingFangSC-Regular,"PingFang SC","Sarasa UI SC","Hiragino Sans GB","Noto Sans CJK SC","Source Han Sans SC",arial,"Microsoft YaHei",sans-serif;}
em, b, i{font-style:normal;font-weight: normal;}

a{color:#333333;text-decoration:none;}
a:hover, a:active{text-decoration:underline;}
a.on:hover, a.cur:hover, .on a:hover, .cur a:hover{text-decoration:none;}
img, a img{border:0 none;}
ul, ol{list-style-type:none;}
a:hover{ text-decoration: none;}
input[type="text"],input[type="button"], input[type="submit"], input[type="reset"],textarea {-webkit-appearance: none;}
.color-red{color: #FF3F5D;}
iframe{border:0;}

.clear-both{
	clear: both;
}
.site-header{
	width: 100%;
	-moz-box-shadow: 0px 2px 1px 0px rgba(0,0,0,0.11); 
    -webkit-box-shadow: 0px 2px 1px 0px rgba(0,0,0,0.11); 
    box-shadow: 0px 2px 1px 0px rgba(0,0,0,0.11);
	padding: 17px 0 10px 0;
	height: 76px;
}
.site-header .container{
	width: 1299px;
    margin: 0 auto;
}
.site-header .header-top{
	float: left;
}
.site-header .header-top .logo-wrapper{
	width: 165px;
	float: left;
}
.site-header .header-top .logo-wrapper a{
	width: 100%;
}
.site-header .header-top .logo-wrapper a img{
	width: 100%;
}
.site-header .search-box{
	width: 478px;
	float: left;
	margin-left: 35px;
	position: relative;
}
.site-header .search-box-main{
	width: 100%;
	height: 40px;
	background: #f6f6f6;
	border: 1.5px solid #FF7171;
	border-radius: 26px;
	position: relative;
	z-index: 10;
}
.site-header .search-box-main .search-btn{
	position: absolute;
    width: 53px;
    height: 43px;
    top: -1.5px;
    right: -1.5px;
	color: #ffffff;
	font-size: 14px;
	background: #FF7171;
	text-align: left;
	line-height: 44px;
	padding-left: 12px;
	border-top-right-radius: 40px;
	border-bottom-right-radius: 40px;
	cursor: pointer;
}
.site-header .search-box-main i:after{
    content: "";
    position: absolute;
    width: 23px;
    height: 23px;
    top: 8px;
    left: 15px;
	background: url(/public/static/ccguitar/images/search-icon.png) no-repeat 100%/100%;
}
.site-header .search-box-main .search-input-box{
	height: 100%;
}
.site-header .search-box-main input{
    width: 83%;
    height: 108%;
	color: #979797;
    font-size: 14px;
    border: 0;
    background: 0;
    margin-left: 55px;
    padding-left: 3px;
	outline: none;
}
.site-header .search-box-main input::-webkit-input-placeholder {
  	color: #979797;
	font-size: 14px;
}
.site-header .search-box-main input::-moz-placeholder {
  	color: #979797;
	font-size: 14px;
}
.site-header .search-box-main input:-ms-input-placeholder {
  	color: #979797;
	font-size: 14px;
}
.site-header .search-box-word{
    width: 100%;
	color: #afafaf;
    overflow: hidden;
    margin-top: 13px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.site-header .search-box-word a{
	color: #afafaf;
	font-size: 12px;
	margin-right: 8px;
}
.site-header .search-box-word a:hover{
	color: #FF3F5D;
}
.site-header .header-nav{
    float: right;
    width: 280px;
    height: 69px;
    line-height: 69px;
}
.site-header .header-nav ul{
	width: 100%;
}
.site-header .header-nav ul li{
	float: left;
	padding: 0 17px;
	position: relative;
	display: inline-block;
    height: 35px;
    line-height: 36px;
	margin-top: 16px;
}
.site-header .header-nav ul li.user-link{
	margin-top: 9px;
}
.site-header .header-nav ul li.login-link{
	border: 1px solid #FF3F5D;
    border-radius: 35px;
}
.site-header .header-nav ul li.login-link a{
	color: #FF3F5D;
	font-weight: 500;
}
.site-header .header-nav ul li:last-child{
	padding-right: 0;
}
.site-header .header-nav ul li a{
	float: left;
	font-size: 17px;
	font-weight: 400;
	color: #000000;
}
.site-header .header-nav ul li a:hover{
	color: #FF3F5D;
}
.site-content{
    width: 80%;
	width: 1299px;
	margin: 0 auto;
	margin-top: 10px; 
}
.site-content .navbar{
	float: left;
	width: 14%;
	min-width: 195px; 
}
.site-content .navbar nav{
	width: 100%;
}
.site-content .navbar ul{
    width: 85%;
	min-width: 130px;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 1px 1px 3px 0px rgb(0 0 0 / 19%);
    border: .4px solid rgb(0 0 0 / 5%);
	border-right: 0;
	overflow: hidden;
}
.site-content .navbar ul li{
	width: auto;
	cursor: pointer;
	position: relative;
}
.site-content .navbar ul li.rank:before{
    content: "";
    position: absolute;
    width: 24px;
    height: 24px; 
    top: 10px; 
    left: 95px;
	background: url(/public/static/ccguitar/images/hot-icon.png?v1.0) no-repeat 100%/100%;
}
.site-content .navbar ul li.active.rank:before{
	background: url(/public/static/ccguitar/images/hot-icon-active.png?v1.0) no-repeat 100%/100%;
}
.site-content .navbar ul li.seek:before{
    content: "";  
    position: absolute;
    width: 58px;
    height: 19px;
    top: -2px;
    left: 66px;
	background: url(/public/static/ccguitar/images/sk-icon.png?v1.0) no-repeat 100%/100%;
}
.site-content .navbar ul li.active.seek:before{
	background: url(/public/static/ccguitar/images/sk-icon-active.png?v1.0) no-repeat 100%/100%;
}
.site-content .navbar ul li.active{
	background: #FF7171;
}
.site-content .navbar ul li.active a{
	color: #ffffff;
}
.site-content .navbar ul li:nth-child(1){
	padding-top: 5px;
}
.site-content .navbar ul li:last-child{
	padding-bottom: 5px;
}
.site-content .navbar ul li:hover{
	background: #F2F2F2;
	transform: scale(1.1, 1.1);
}
.site-content .navbar ul li.active:hover{
	background: #FF7171;
	transform: scale(1.1, 1.1);
}
.site-content .navbar ul li a:before{
	content: "";
    position: absolute;
    width: 26px;
    height: 26px;
    top: 11px;
    left: 16px;
}
.site-content .navbar ul li:nth-child(1):before{
	top: 16px;
}
.site-content .navbar ul li.pu a:before{
	background: url(/public/static/ccguitar/images/nav-01.png) no-repeat 100%/100%;
}
.site-content .navbar ul li.rank a:before{
	background: url(/public/static/ccguitar/images/nav-02.png) no-repeat 100%/100%;
}
.site-content .navbar ul li.album a:before{
	background: url(/public/static/ccguitar/images/nav-05.png) no-repeat 100%/100%;
}
.site-content .navbar ul li.teacher-rank a:before{
	background: url(/public/static/ccguitar/images/nav-06.png) no-repeat 100%/100%;
}
.site-content .navbar ul li.singer a:before{
	background: url(/public/static/ccguitar/images/nav-07.png) no-repeat 100%/100%;
}
.site-content .navbar ul li.seek a:before{
	background: url(/public/static/ccguitar/images/nav-08.png) no-repeat 100%/100%;
}
.site-content .navbar ul li.ukulele a:before{
	background: url(/public/static/ccguitar/images/nav-09.png) no-repeat 100%/100%;
}
.site-content .navbar ul li.course a:before{
	background: url(/public/static/ccguitar/images/nav-10.png) no-repeat 100%/100%;
}
.site-content .navbar ul li.pu.active a:before{
	background: url(/public/static/ccguitar/images/nav-01-active.png) no-repeat 100%/100%;
}
.site-content .navbar ul li.rank.active a:before{
	background: url(/public/static/ccguitar/images/nav-02-active.png) no-repeat 100%/100%;
}
.site-content .navbar ul li.album.active a:before{
	background: url(/public/static/ccguitar/images/nav-05-active.png) no-repeat 100%/100%;
}
.site-content .navbar ul li.teacher-rank.active a:before{
	background: url(/public/static/ccguitar/images/nav-06-active.png) no-repeat 100%/100%;
}
.site-content .navbar ul li.singer.active a:before{
	background: url(/public/static/ccguitar/images/nav-07-active.png) no-repeat 100%/100%;
}
.site-content .navbar ul li.seek.active a:before{
	background: url(/public/static/ccguitar/images/nav-08-active.png) no-repeat 100%/100%;
}
.site-content .navbar ul li.ukulele.active a:before{
	background: url(/public/static/ccguitar/images/nav-09-active.png) no-repeat 100%/100%;
}
.site-content .navbar ul li.course.active a:before{
	background: url(/public/static/ccguitar/images/nav-10-active.png) no-repeat 100%/100%;
}
.site-content .navbar ul li a{
    color: #313131;
    font-size: 14px;
    display: block;
    width: 100%;
    height: 100%;
    padding: 14px 0;
	padding-left: 50px;
	position: relative;
}
.site-content>.content{
	float: left;
	width: 82%;
	padding-top: 2px;
	min-height: 500px;
	padding-bottom: 100px;
}
.opern-option{
	width: 100%;
}
.opern-option .opern-tab{
	width: 100%;
}
.opern-option .opern-tab ul{
	width: 100%;
	overflow: hidden;
}
.opern-option .opern-tab ul li{
	float: left;
	border: 1.5px solid #ffffff;
	border-radius: 20px;
	cursor: pointer;
	margin-right: 10px;
}
.opern-option.seek-option .opern-tab ul li{ 
	padding: 1px 10px;
	margin-right: 50px;
}
.opern-option .opern-tab ul li a{
	color: #313131;
	font-size: 14px;
	display: block;
    width: 100%;
    height: 100%;
	font-weight: 600;
	padding: 2px 15px;
}
.opern-option .opern-tab ul li.active{
	border: 1.5px solid #FF3A56;
}
.opern-option .opern-tab ul li.active a{
	color: #FF3A56;
}
.opern-option .opern-tab ul li:hover{
	border: 1.5px solid #FF3A56;
}
.opern-option .opern-tab ul li:hover a{
	color: #FF3A56;
}
.opern-option .degree-reduction-tab, .opern-option .degree-reduction-tab-small{
	width: 100%;
	margin-top: 20px;
	padding-left: 18px;
}
.opern-option .degree-reduction-tab label, .opern-option .degree-reduction-tab-small label{
	float: left;
	color: #313131;
	font-weight: 600;
	font-size: 12px;
	margin-right: 20px;
}
.opern-option .degree-reduction-tab ul li a{
	font-size: 12px;
}
.opern-option .degree-reduction-tab ul, .opern-option .degree-reduction-tab-small ul{
	overflow: hidden;
}
.opern-option .degree-reduction-tab ul li, .opern-option .degree-reduction-tab-small ul li{
	float: left;
	width: 90px;
}
.opern-option .degree-reduction-tab ul li.active a, .opern-option .degree-reduction-tab-small ul li.active a{
	color: #FF7171;
}
.opern-option .degree-reduction-tab ul li:hover a, .opern-option .degree-reduction-tab-small ul li:hover a{
	color: #FF7171;
}
.opern-option .degree-reduction-tab-small ul li{
	width: 27px;
}
.first-recommend{
	width: 100%;
	margin-top: 30px;
}
.first-recommend ul{
	width: 100%;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.first-recommend ul li{
	width: 32.3333%;
	height: 162px;
	-webkit-transition: all .3s;
    transition: all .3s;
}
.first-recommend ul li:hover {
    margin-top: -5px;
    margin-bottom: 5px;
}
.first-recommend ul li a{
	float: left;
    width: 100%;
	height: 100%;
    display: block;
    border-radius: 6px;
    overflow: hidden;
}
.first-recommend ul li a img{
	width: 100%;
	height: 100%;
}
.recommend-list{
	width: 101.5%;
	margin-top: 20px;
	margin-left: -7.5px;
}
.swiper-container .recommend-list{
	margin-left: -5.5px;
}
.recommend-list ul{
	width: 100%;
	padding-bottom: 10px;
	display: block; 
}
.recommend-list.recommend-auto-list ul{
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.recommend-list ul li{
	float: left;
	width: 33.3333%;
	display: flex;
	position: relative;
	margin-bottom: 20px;
	-webkit-transition: all .3s;
    transition: all .3s;
}
.recommend-list ul li:hover {
    margin-top: -5px;
	margin-bottom: 25px;
}
.recommend-list.recommend-auto-list ul li{
	float: initial;
	width: 32.3333%;
}
.recommend-list ul li a{
	float: left;
	width: 96%;
	display: block;
    overflow: hidden;
	margin: 0 auto;
	border: 1px solid #e5e5e5;
	border-radius: 5px;
	box-shadow: 2px 2px 2px 0px rgba(82,82,82,0.12); 
}
.recommend-list.recommend-auto-list ul li a{
	width: 100%;
}
.recommend-list ul li a .recommend-div{
	width: 93%;
	margin: 0 auto;
	padding: 12px 0;
}
.recommend-list ul li .opern-play.position{
	position: absolute;
    top: 44px;
    left: 20px;
    height: 25px;
    width: 173px;
}
.recommend-list ul li .opern-play.position.active{
	background: #fee8ee !important
}
.recommend-list ul li .opern-play.position .play-btn{
	width: 18.5px;
    height: 18.5px;
}
.recommend-list ul li .opern-play.position .play-time{
	padding-left: 27px;
}
.opern-play{
    background: #e8e8e8;
    border-radius: 12px;
    overflow: hidden;
    width: 153px;
    height: 23px;
    margin-top: 31px;
	cursor: pointer;
	float: left;
}
.opern-play.margin-left-40{
	position: absolute;
    top: -2px; 
    left: 310px;
    line-height: initial;
}
.opern-play.margin-left-40.active{
	background: #fee8f0 !important;
}
.opern-play.position{
	position: absolute;
    top: -2px; 
    left: 327px;
    line-height: initial;
}
.opern-play.position.active{
	background: #fee8f0 !important;
}
.opern-play.active .play-time{
	color: #ff3f5d !important;
}
.opern-play .play-btn{
	width: 17px;
    height: 17px;
    float: left;
    margin: 3px 0 0 3px;
}
.opern-play .play-show{
	width: 71px;
    height: 16px;
    float: left;
    padding-left: 10px;
    padding-top: 3px;
}
.opern-play .play-time{
    float: left;
    padding-left: 10px;
    padding-right: 10px;
    color: #9f9f9f;
    font-size: 12px;
    padding-top: 6px;
}
.opern-play .play-show img{
	width: 100%;
    height: 100%;
}
.opern-play .play-btn img{
	width: 100%;
    height: 100%;
}
.recommend-list ul li a .entry-header{
    overflow: hidden;
    height: 30px;
    line-height: 30px;
	padding-left: 45px;
}
.recommend-list ul li a .entry-header i{
    font-size: 12px;
    border: 1px solid #0bbf83;
    border-radius: 2px;
    color: #0bbf83;
    position: absolute;
    top: 20px;
    left: 18px;
    width: 32px;
    height: 14px;
    line-height: 14px;
    text-align: center;
}
.recommend-list ul li a .entry-header h2{
    display: inline-block;
    font-size: 15px;
    width: 267px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.recommend-list.recommend-block-list ul li a .entry-header h2{
	margin-top: 0;
}
.recommend-list ul li a .entry-header span{
    font-size: 12px;
    padding-left: 20px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    width: 130px;
}
.recommend-list ul li a .entry-category{
	padding-top: 5px;
}
.recommend-list ul li a .entry-category span{
    font-size: 12px;
    padding-right: 3px;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.recommend-list ul li a .entry-category span:nth-child(1){
	min-width: 100px;
	max-width: 103px;
}
.recommend-list ul li a .entry-category span:nth-child(2){
	min-width: 100px;
	max-width: 208px;
}
.recommend-list ul li a .entry-meta{
	padding-top: 44px;
}
.recommend-list ul li a .entry-meta span{
    font-size: 12px;
    width: 25%;
    display: inline-block;
	color: #585858;
}
.recommend-list ul li a .entry-meta span:nth-child(3){
	width: 28%;
}
.recommend-list ul li a .entry-meta span.look{
	width: 18%;
    text-align: right;
	position: relative;
}
.recommend-list ul li a .entry-meta span.look:before{
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    top: 0px;
    left: 6px;
	background: url(/public/static/ccguitar/images/look.png) no-repeat 100%/100%;
}
.site-footer{
	width: 100%;
	background: #303030;
	padding-top: 35px;
	padding-bottom: 35px;
	min-height: 192px;
}
.site-footer .site-footer-content{
	width: 70%;
	min-width: 1000px;
	margin: 0 auto;
}
.site-footer .left{
	width: 70%;
	float: left;
}
.site-footer .right{
	width: 30%;
	float: left;
}
.site-footer .right .block{
    overflow: hidden;
}
.site-footer .right .li{
	width: 100px;
	float: left;
	margin-right: 98px;
}
.site-footer .right .li:last-child{
	margin-right: 0;
}
.site-footer .right .img{
	width: 100%;
}
.site-footer .right .img img{
	width: 100%;
}
.site-footer .right p{
	color: #F6F6F6;
    font-size: 12px;
    margin-top: 4px;
}
.site-footer .container{
	width: 100%;
	margin-top: 17px;
}
.site-footer .container .friendlinks-ul{
	width: 346px;
	color: #f6f6f6;
	font-weight: 500;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
	position: relative;
}
.site-footer .container .friendlinks-ul li a{
	color: #f6f6f6;
	font-size: 12px;
	cursor: pointer;
}
.site-info p{
	color: #f6f6f6;
	margin-top: 20px;
}
.site-info p a{
	color: #f6f6f6;
}
.rank-list .head{
	width: 100%;
	min-width: 1040px;
	margin-bottom: 10px;
	overflow: hidden;
}
.rank-list .head .p{
	width: 95px;
	display: inline-block;
	text-align: center;
	font-size: 13px;
	font-weight: 600;
	color: #1a1a1a;
	float: left;
}
.rank-list .head .p label{
	font-size: 13px;
	color: #313131;
}
.rank-list .head .p:nth-child(1) label{
	padding-left: 0;
}
.rank-list .body .li .p span{
	display: inline-block;
	float: left;
}
.rank-list .body .li .p span.table-song{
	margin-left: 10px;
}
.rank-list .body .li .p span.table-source{
    width: 43px;
    padding-top: 28px;
    font-size: 12px;
    color: #9A9B9B;
    position: relative;
    text-align: center;
	margin-right: 23px;
}
.rank-list .body .li .p span.table-source-bak{
	width: 0px;
    padding-top: 28px;
    font-size: 12px;
    color: #9A9B9B;
    position: relative;
    text-align: center;
    margin-right: 14px;
}
.rank-list .body .li .p span.table-source:before{
    content: "";
    position: absolute;
    width: 43px;
    height: 13px;
    top: 43px;
    left: 0;
	background: url(/public/static/ccguitar/images/source-icon.png?v1.0) no-repeat 100%/100%;
}
.rank-list .body .li a label{
	cursor: pointer;
}
.rank-list .body .li .table-serial-number{
    font-size: 24px;
    font-weight: 400;
    color: #444444;
    width: 61px;
    text-align: center;
    padding-top: 28px;
    margin-left: -5px;
}
.rank-list .body .li:nth-child(1) .table-serial-number.color-red,
.rank-list .body .li:nth-child(2) .table-serial-number.color-red,
.rank-list .body .li:nth-child(3) .table-serial-number.color-red{
	color: #FF2B44;
}
.rank-list .body .li .table-tag{
	position: relative;
	width: 50px;
}
.rank-list .body .li .table-tag label{
	font-size: 12px;
	color: #0bbf83;
	border: 1px solid #0bbf83;
	border-radius: 2px;
	padding: 1px 2px;
	position: absolute;
    top: 21px;
    left: 0;
    display: inline-block;
	height: 13px;
    line-height: 13px;
	width: 32px;
    text-align: center;
}
.rank-list .body{
	width: 100%;
	min-width: 994px;
}
.rank-list .body .li{
	border: 1px solid #e5e5e5;
	border-radius: 5px;
	box-shadow: 2px 2px 2px 0px rgba(82,82,82,0.12); 
	margin-bottom: 10px;
	height: 80px;
	line-height: 80px;
	overflow: hidden;
	cursor: pointer;
	-webkit-transition: all .3s;
    transition: all .3s;
	position: relative;
}
.rank-list .body .li:hover{
	transform: scale(1.01, 1.01);
}
.rank-list .body .li .p{
	width: 95px;
	height: 80px;
	display: inline-block;
	text-align: center;
	color: #585858;
	font-size: 12px;
	position: relative;
	float: left;
}
.rank-list .body .li .p.color-red{
	color: #FF3F5D;
}
.rank-list .head .p:nth-child(1){
	width: 550px;
	text-align: left; 
	padding-left: 10px;
}
.rank-list .head .p:last-child, .rank-list .body .li .p:last-child{
	width: 126px;
}
.site-user-content .rank-list .head .p:last-child, .site-user-content .rank-list .body .li .p:last-child{
	width: 102px;
}
.rank-list .body .li .p:nth-child(1){
	width: 550px;
	height: 79px;
	text-align: left;
	overflow: hidden;
	line-height: initial;
	padding-left: 10px;
}
.pu-rank-list.rank-list .head .p:nth-child(1), .rank-list.pu-rank-list .body .li .p:nth-child(1){
	width: 543px;
}
.pu-rank-list.rank-list .body .li .p, .pu-rank-list.rank-list .head .p{
	width: 94px;
}
.pu-rank-list.rank-list .body .li .p.singer, .pu-rank-list.rank-list .head .p.singer{
	width: 135px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.tag-title{
	width: 100%;
	margin-bottom: 25px;
	position: relative;
}
.tag-title h3{
	font-size: 16px;
	font-weight: 600;
	min-height: 20px;
}
.tag-title h3 label{
	font-size: 12px; 
	font-weight: 400;
	color: #313131;
	margin-left: 15px; 
}
.big-tag-title{
	width: 100%;
	margin-bottom: 25px;
}
.big-tag-title h3{
	font-size: 20px;
	font-weight: 600;
	color: #FF7171;
}
.rank-list{
    width: 102%;
    margin-top: 30px;
    margin-left: -10px;
}
.rank-list ul{
	width: 100%;
	overflow: hidden;
	padding-bottom: 10px;
}
.rank-list.musician-rank-list ul{
	overflow: initial;
}
.rank-list ul li{
	float: left;
	width: 33.3333%;
	display: flex;
	position: relative;
	margin-bottom: 18px;
	-webkit-transition: all .3s;
    transition: all .3s;
}
.rank-list.musician-rank-list ul li:hover {
    margin-top: -5px;
    margin-bottom: 23px;
}
.rank-list ul li a{
	float: left;
	width: 94%;
	min-width: 290px;
	display: block;
    overflow: hidden;
	margin: 0 auto;
	border: 1px solid #e5e5e5;
	border-radius: 5px;
	box-shadow: 1px 1px 2px 0px rgba(82,82,82,0.12); 
	position: relative;
}
.rank-list ul li a .ranking{
	position: absolute;
    top: 38px;
    left: 14px;
	font-size: 13px;
	color: #FF3F5D;
	font-weight: bold;
}
.rank-list ul li:nth-child(1) a:before{
    content: "";
    position: absolute;
    width: 26px;
    height: 35px;
    top: -1px;
    left: 4px;
	background: url(/public/static/ccguitar/images/ranking-1.png) no-repeat 100%/100%;
}
.rank-list ul li:nth-child(2) a:before{
    content: "";
    position: absolute;
    width: 26px;
    height: 35px;
    top: -1px;
    left: 4px;
	background: url(/public/static/ccguitar/images/ranking-2.png) no-repeat 100%/100%;
}
.rank-list ul li:nth-child(3) a:before{
    content: "";
    position: absolute;
    width: 26px;
    height: 35px;
    top: -1px;
    left: 4px;
	background: url(/public/static/ccguitar/images/ranking-3.png) no-repeat 100%/100%;
}
.rank-list ul li a .rank-div{
	width: 93%;
	margin: 0 auto;
	padding: 12px 0;
	overflow: hidden;
	padding-left: 36px;
	padding-top: 15px;
    padding-bottom: 15px;
}
.rank-list ul li a .rank-div .photo{
	width: 60px;
	height: 60px;
	border-radius: 50%;
    overflow: hidden;
	float: left;
}
.rank-list ul li a .rank-div .photo img{
	width: 100%;
	height: 100%;
}
.rank-list ul li a .rank-div .info{
	float: left;
	padding-left: 12px;
}
.rank-list ul li a .rank-div .info h2{
	font-size: 15px;
	font-weight: 600;
	margin-top: 5px;
}
.rank-list ul li a .rank-div .info .sj{
	margin-top: 15px;
}
.rank-list ul li a .rank-div .info .sj span{
	font-size: 12px;
	font-weight: 400;
	margin-right: 20px;
}
.singer-list{
	width: 100%;
	margin-top: 45px;
}
.singer-list ul{
	width: 100%;
	overflow: hidden;
	padding-bottom: 10px;
}
.singer-list ul li{
	float: left;
	width: 20%;
	height: 22px;
	display: flex;
	position: relative;
	margin-bottom: 18px;
}
.singer-list ul li a{
	float: left;
	width: 94%;
	min-width: 50px;
	display: block;
	margin: 0 auto;
	overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap;
}
.singer-list ul li:hover a{
	color: #FF7171;
}
.seek-list{
	width: 100%;
	margin-top: 20px;
	padding-bottom: 100px;
}
.seek-list .seek-div{
	width: 100%;
	display: none;
}
.seek-list .seek-div img{
	width: 100%;
}
.spectrum-list{
    width: 102%;
    margin-top: 23px;
    margin-left: -10px;
}
.spectrum-list ul{
	width: 100%;
	padding-bottom: 10px;
}
.spectrum-list ul li{
	float: left;
	width: 20%;
	height: 203px;
	display: flex;
	position: relative;
	margin-bottom: 22px; 
	-webkit-transition: all .3s;
    transition: all .3s;
}
.spectrum-list ul li:hover {
    margin-top: -5px;
    margin-bottom: 27px;
}
.spectrum-list ul li a{
	float: left;
	width: 89%;
	min-width: 170px;
	display: block;
    overflow: hidden;
	margin: 0 auto;
}
.spectrum-list ul li a .spectrum-div{
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
}
.spectrum-list ul li a .spectrum-div .photo{
	width: 181px;
	height: 181px;
    overflow: hidden; 
	border-radius: 5px;
}
.spectrum-list ul li a .spectrum-div .photo img{
	width: 100%;
	height: 100%;
}
.spectrum-list ul li a .spectrum-div .info h2{
	color: #000000;
	font-size: 13px;
	font-weight: 600;
	padding-top: 5px;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.spectrum-list ul li a .spectrum-div .info .describe{
	padding-top: 3px;
}
.spectrum-list ul li a .spectrum-div .info .describe span{
	color: #4C4B4B;
	font-size: 12px;
	font-weight: 400;
	display: block;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.fex-head{
	width: 100%;
	padding: 10px 0 20px 10px;
	overflow: hidden;
}
.fex-head .fex-head-img{
	width: 65px;
	height: 65px;
	border-radius: 50%;
	overflow: hidden;
	float: left;
}
.fex-head .fex-head-img img{
	width: 100%;
	height: 100%;
}
.fex-head .info{
    padding-left: 15px;
    float: left;
}
.fex-head .info h1{
	font-weight: 600;
	color: #000000;
	font-size: 18px;
	padding-top: 8px;
}
.fex-head .info p{
	font-weight: 400;
	color: #000000;
	font-size: 12px;
	padding-top: 5px;
}
.no-data{
    width: 877px;
    margin: 0 auto; 
    margin-top: 67px;
	overflow: hidden;
	margin-bottom: 90px;
}
.no-data .left{
	float: left;
	width: 230px;
}
.no-data .left img{
	width: 100%;
}
.no-data .right{
	float: left;
	margin-left: 50px;
}
.no-data .right h4{
	font-size: 15px;
	line-height: 24px;
	margin-top: 11px;
}
.no-data .right .img{
	width: 106px;
	margin-top: 30px;
}
.no-data .right .img img{
	width: 100%;
}
.no-data .right p{
	font-size: 12px;
	color: #686868;
	margin-top: 5px;
}
.no-data.m-no-data{
    width: 350px;
    margin-top: 100px;
}
.no-data img{
	width: 100%;
}
.seek-list.content-tab .seek-div.div_show{
	display: block;
}
.rank-list .body .li .p.look-num label{
	position: relative;
	padding-left: 21px;
}
.look-num label:before{
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    top: -1px;
    left: 1px;
	background: url(/public/static/ccguitar/images/look.png) no-repeat 100%/100%;
}
.rank-list .body .li .table-song label:nth-child(1){
	font-size: 16px;
    font-weight: 600;
    color: #444444;
    padding-left: 50px;
    display: block;
	width: 165px;
	padding-top: 18px;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.rank-list .body .li .table-song label:nth-child(2){
	font-size: 12px;
	font-weight: 400;
	color: #444444;
	padding-left: 50px;
	display: block;
	width: 165px;
	padding-top: 6px;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.rank-list .body .li .table-singer{
	font-size: 12px;
	font-weight: 400;
	color: #444444;
	padding-top: 24px;
	width: 92px;
	padding-left: 20px;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.site-content>.content .head{
	width: 100%;
	height: auto;
	margin-bottom: 10px;
}
.site-content>.content .head.new-head{
	height: 138px;
}
.site-content>.content .head img{
	width: 100%;
	height: 100%;
	border-radius: 5px;
}
.site-content>.content .new-list{
	margin-top: 15px;
}
.new-list ul li{
	border: 1px solid #c3c3c3;
	border-radius: 5px;
	box-shadow: 2px 2px 12px 0px rgba(0,0,0,0.08); 
	padding: 16px 0 20px 0;
	cursor: pointer;
	margin-bottom: 15px;
	height: 200px;
	-webkit-transition: all .3s;
    transition: all .3s;
}
.new-list ul li:hover {
    transform: scale(1.01, 1.01);
}
.new-list ul li a{
	display: block;
}
.new-list ul li:hover{
	border: 1px solid #979797;
}
.new-list ul li a>div{
	width: 96%;
	margin: 0 auto;
}
.new-list ul li a>div h2{
	font-size: 25px;
	font-weight: 600;
	color: #313131;
	margin-bottom: 15px;
}
.new-list ul li a>div .content{
	overflow: hidden;
}
.new-list ul li a>div .content .left{
    float: left;
	width: 30%;
	height: 151px;
}
.new-list ul li a>div .content .right{
    float: left;
	width: 70%;
	height: 151px;
}
.new-list ul li a>div .content .left img{
	width: 100%;
	height: 100%;
}
.new-list ul li a>div .content .right .text{
    margin-left: 40px;
    margin-top: 7px;
    line-height: 22px;
    max-height: 140px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
    overflow: hidden;
    font-size: 13px;
}
.last{
	overflow: hidden;
}
.last .lc{
    width: 150px;
    float: right;
	text-align: right;
}
.last .lc span{
	margin-left: 20px;
	position: relative;
	font-size: 13px;
}
.last .lc span:nth-child(1):before{
	content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    top: -0.5px;
    left: -26px;
	background: url(/public/static/ccguitar/images/look-01.png) no-repeat 100%/100%;
}
.new-detail{
	overflow: hidden;
	width: 102.5%;
}
.new-detail .left{
	float: left;
	width: 75%;
}
.new-detail .right{
	float: left;
	width: 25%;
}
.container{
	margin-top: 0;
}
.container h1{
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 15px;
}
.container p{
	line-height: 22px;
	margin-bottom: 15px;
	font-size: 13px;
}
.container p img{
	width: 100%; 
}
.more{
	width: 86%;
	border: 0.5px solid #b9b9b9;
	border-radius: 4px;
	margin-left: 0;
}
.more li:hover h2{
	color: #FF3F5D;
}
.more h5{
	width: 91%;
    font-size: 14px;
    font-weight: 600;
    padding: 13px 0 4px 0;
	padding-left: 18px;
    color: #444444;
    margin: 0;
	position: relative;
}
.more h5:before{
	content: "";
	width: 4px;
	height: 16px;
	background: #FF7171;
	position: absolute;
    top: 15.5px;
    left: 5px;
}
.more li .img{
	width: 96%;
	height: 123px;
	margin: 0 auto;
	margin-top: 5px;
}
.more li .img img{
	width: 100%;
	height: 100%;
	border-radius: 4px;
}
.more li h2{
	width: 96%;
	margin: 0 auto;
	font-size: 14px;
	font-weight: 600;
	margin-top: 7px;
	color: #000000;
}
.more li p{
	width: 96%;
	font-size: 12px;
	margin: 0 auto;
	margin-top: 3px;
	color: #787878;
	margin-bottom: 15px;
}
.site-content>.content.qupu-content{
	width: 1087px;
	float: initial;
	margin: 0 auto;
	margin-top: 20px; 
}
.audio-btn .play{
	display: none;
}
.tool{
	border: 1.12px solid #d1d1d1;
	border-radius: 5px;
}
.tool .btn-fast .audio-btn{
    width: 40px;
    height: 40px;
    position: absolute;
    top: 17px;
    left: -4.4px;
	cursor: pointer;
}
.tool .btn-fast{
	width: 93%;
	margin: 0 auto;
	position: relative;
}
.tool .btn-fast .audio-btn img{
	width: 100%;
	height: 100%;
}
.tool .btn-fast .full-screen-btn{
    width: 30px;
    height: 30px;
    position: absolute;
    top: 17px;
    right: 0;
	cursor: pointer;
}
.tool .btn-fast .full-screen-btn img{
	width: 100%;
	height: 100%;
}
.rotation-btn{
	width: 200px;
	height: 50px;
    margin: 0 auto;
	text-align: center;
	padding-top: 20px;
	overflow: hidden;
}
.rotation-btn img{
	width: 28px;
    height: 28px;
	float: left;
}
.rotation-btn .page{
	font-size: 20px;
    padding-top: 4px;
    width: 62px;
}
.rotation-btn .page label.page-index{
	color: #FF7171;
}
.page-pap{
	background: #4e4e4ea6;
    color: #ffffff;
    font-size: 14px;
    width: 90px;
    height: 32px;
    line-height: 32px;
    position: absolute;
    right: 0;
    bottom: 0;
    text-align: center;
    z-index: 20;
    letter-spacing: 2px;
    border-top-left-radius: 20px;
}
.audio-fast{
	width: 93%;
    height: 40px;
	margin: 0 auto;
}
.audio-fast .progress {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin-bottom: 0;
	height: 6px;
    overflow: inherit;
    background-color: #D8D8D8;
    border-radius: 4px;
    -webkit-box-shadow: none;
    box-shadow: none;
	margin-top: 2px;
}
.audio-fast .progress .progress-ing {
    width: 0;
    background-color: #FF7171;
	height: 100%;
    border-radius: .106667rem;
}
.audio-fast .progress .progress-ing-button {
    width: 10px;
    background-color: transparent;
    position: relative;
}
.audio-fast .progress .progress-ing-button::before {
	content: '';
    display: block;
    width: 15px;
    height: 15px;
    position: absolute;
    left: -4.4px;
    top: -4.4px;
    background: url(/public/static/ccguitar/images/progress-ing-button.png) no-repeat 100%/100%;
    z-index: 100;
	cursor: pointer;
}
.qupu-content .new-detail .left{
	width: 65%;
}
.qupu-content .new-detail .right{
	width: 32%;
}
.login-box-view .utils li a#forget_password_botton{
	display: none;
}
.qupu-content .new-detail .right .more{
	width: 92%;
    margin-left: 4%;
	border: 0;
}
.audio-time{
	margin-top: 11px;
	font-size: 12px;
	margin-left: -3px;
}
.audio-time label.music-cur{
	color: #FF7171;
}
.swiper-pattern{
	width: 99.7%;
	height: 852px;
    border: 1px solid #d1d1d1;
    border-radius: 5px;
    overflow: hidden;
	margin-top: 10px;
	position: relative;
}
.swiper-pattern .swiper-container{
	width: 86%; 
	height: 100%;
}
.swiper-pattern.fix{
	position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: #ffffff;
    margin: 0;
    z-index: 9999;
}
.swiper-pattern.fix .swiper-wrapper{
	margin: 0 auto;
}
.swiper-pattern .swiper-container .swiper-slide{
	width: 100%;
}
.swiper-pattern .swiper-container .swiper-slide img{
	width: 100%;
}
.swiper-pattern .top-pages, .swiper-pattern .turn-pages{
	position: absolute;
    top: 50%;
    width: 40px;
    height: 40px;
    z-index: 10;
    cursor: pointer;
}
.swiper-pattern .top-pages {
	left: 12px;
}
.swiper-pattern .turn-pages {
	right: 12px;
}
.qupu-content .new-detail .left .introduce{
	background: #f6f6f6;
	border-radius: 5px;
	margin-top: 10px;
	padding: 15px;
	min-height: 137px;
}
.qupu-content .new-detail .left .introduce h2{
	font-size: 18px;
	font-weight: 500;
	color: #000000;
	margin-bottom: 7px;
}
.qupu-content .new-detail .left .introduce div.h3{
	font-size: 16px;
	font-weight: 400;
	color: #000000;
	margin-bottom: 7px;
}
.qupu-content .new-detail .left .introduce p{
	font-size: 12px;
	color: #8c8c8c;
}
.site-content>.content.qupu-content .tab{
	margin-top: 50px;
}
.site-content>.content.qupu-content .tab li{
	float: left;
}
.site-content>.content.qupu-content .tab span{
	font-size: 14px;
	color: #A3A3A3;
	background: #ffffff;
	border: 1px solid #a3a3a3;
	padding: 4px 10px;
	margin-right: 20px;
	cursor: pointer;
}
.site-content>.content.qupu-content .tab li.active span{
	color: #ffffff;
	background: #ff7171;
	border: 1px solid #ff7171;
}
.site-content>.content.qupu-content .tag-title{
	margin-bottom: 0;	
}
.site-content>.content.qupu-content .tag-title h3{
	margin-top: 30px;
}
.site-content>.content.qupu-content .user .recommend-list {
    margin-top: 15px;
	margin-left: -4px;
}
.site-content>.content.qupu-content .user .recommend-list h3{
	margin: 0 0 10px 15px;
}
.site-content>.content .comment{
	border: 1px solid #d1d1d1;
	border-radius: 5px;
	margin-top: 20px;
	display: none;
}
.site-content>.content .comment .ct{
	width: 97%;
	margin: 0 auto;
	margin-top: 15px;
	margin-bottom: 20px;
}
.site-content>.content .comment .ct h3{
	font-size: 14px;
	color: #000000;
	margin-bottom: 10px;
	margin-left: 5px;
}
.site-content>.content .comment .ct h3 span{
	font-size: 12px;
	color: #999999;
	margin-left: 30px;
	font-weight: initial;
}
.site-content>.content .comment .add-comment{
	border-top: 1px solid #D8D8D8;
}
.site-content>.content .comment .add-comment .add-main{
	width: 93%;
	margin: 0 auto;
	margin-top: 20px;
}
.site-content>.content .comment .add-comment .add-main textarea{
    background: #f4f4f4;
    border-radius: 5px;
    width: 98.2%;
    height: 77px;
    border: 0;
    outline: none;
    color: #91979d;
    padding: 10px;
}
.site-content>.content .comment .add-comment .comment-btn{
	width: 100px;
    height: 30px;
    line-height: 30px;
    background: #FF7171;
    text-align: center;
    color: #ffffff;
    font-size: 13px;
	float: right;
	margin-top: 10px;
}
.site-content>.content .comment .comment-list{
	margin-top: 30px;
}
.site-content>.content .comment .comment-list h3{
	color: #000000;
    font-size: 13px;
	margin-left: 0;
	margin-bottom: 15px;
}
.site-content>.content .comment .comment-list .list ul li{
	border-bottom: 1px solid #e8eaeb;
	padding-top: 10px;
	padding-bottom: 10px;
}
.site-content>.content .comment .comment-list .list ul li:last-child{
	border-bottom: 0;
	padding-bottom: 0;
}
.site-content>.content .comment .comment-list .list ul li h2{
	color: #5a5a5a;
	font-size: 13px;
	margin-bottom: 5px;
}
.site-content>.content .comment .comment-list .list ul li span{
	color: #A3A3A3;
	font-size: 13px;
	margin-bottom: 5px;
	display: inline-block;
}
.site-content>.content .comment .comment-list .list ul li p{
	color: #5A5A5A;
	font-size: 13px;
	margin-bottom: 5px;
}
.qupu-content .content-tab .rank-list{
	display: none;
}
.qupu-content .content-tab .rank-list.div_show{
	display: block;
}
.site-content>.content .comment.div_show{
	display: block;
}
.qupu-content .new-detail .right .more .info{
	border: 0.5px solid #d1d1d1;
	border-radius: 6px;
	box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.12); 
	padding: 15px;
}
.qupu-content .new-detail .right .more .info .head{
	position: relative;
	margin-top: 2px;
	margin-bottom: 0;
}
.qupu-content .new-detail .right .more .info .head i {
    font-size: 12px;
    border: 1px solid #0bbf83;
    border-radius: 2px;
    color: #0bbf83;
    position: absolute;
    bottom: 0;
    left: -1px;
    width: 32px;
    height: 14px;
    line-height: 14px;
    text-align: center;
}
.qupu-content .new-detail .right .more .info .head i.i1{
	color: #00C37E;
	border: 1px solid #00C37E;
}
.qupu-content .new-detail .right .more .info .head i.i2{
	color: #FF2B44;
	border: 1px solid #FF2B44;
}
.qupu-content .new-detail .right .more .info .head i.i3{
	color: #FFAA00;
	border: 1px solid #FFAA00;
}
.qupu-content .new-detail .right .more .info .head h1{
	font-size: 16px;
	font-weight: bold;
	color: #000000;
	padding-left: 42px;
	width: 242px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.qupu-content .new-detail .right .more .info .head .zj{
	position: absolute;
    right: 0;
    bottom: 0;
    font-size: 12px;
    color: #000000;
	display: flex;
	display: none;
}
.qupu-content .new-detail .right .more .info .head .zj span{
	display: inline-block;
    width: 105px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.qupu-content .new-detail .right .more .info .singer{
	margin-top: 22px;
	overflow: hidden;
	display: flex;
	position: relative;
}
.qupu-content .new-detail .right .more .info .singer span:nth-child(2){
    padding-left: 19px;
    width: 120px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
}
.qupu-content .new-detail .right .more .info .difficulty{
	position: relative;
}
.qupu-content .new-detail .right .more .info .difficulty .gz{
	display: inline-block;
	position: absolute;
    top: -2px;
    right: 0;
}
.qupu-content .new-detail .right .more .info .difficulty .gz img{
    width: 23px;
    margin-left: 17px;
}
.qupu-content .new-detail .right .more .info .singer span:nth-child(3){
    position: absolute;
    top: 0;
    right: 0;
}
.qupu-content .new-detail .right .more .info .reduction-degree{
	margin-top: 15px;
	overflow: hidden;
}
.qupu-content .new-detail .right .more .info .reduction-degree span{
	float: left;
}
.qupu-content .new-detail .right .more .info .difficulty{
	margin-top: 15px;
}
.qupu-content .new-detail .right .more .info .information{
	margin-top: 20px;
	color: #818181;
	font-size: 13px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.qupu-content .new-detail .right .more .info .information span{
	display: inline-block;
	position: relative;
}
.qupu-content .new-detail .right .more .info .information span:nth-child(2){
	padding-left: 10px;
}
.qupu-content .new-detail .right .more .info .information span.look-num:before {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    top: 0px;
    left: -10px;
    background: url(/public/static/ccguitar/images/look.png) no-repeat 100%/100%;
}
.qupu-content .new-detail .right .more .add-vip{
	border: 1px solid #ff7171;
	border-radius: 5px;
	box-shadow: 0px 2px 7px 0px rgb(0 0 0 / 14%), 0px 2px 2px 0px rgb(0 0 0 / 4%); 
	margin-top: 10px;
	overflow: hidden;
}
.qupu-content .new-detail .right .more .add-vip .gt{
	overflow: hidden;
}
.qupu-content .new-detail .right .more .add-vip .gt .li{
    float: left;
	width: 33.33333%;
	text-align: center;
    height: 21px;
	font-weight: 500;
	color: #373737;
	font-size: 13px;
	position: relative;
	padding-top: 64px;
}
.qupu-content .new-detail .right .more .add-vip .gt .li:nth-child(1){
	width: 30%;
}
.qupu-content .new-detail .right .more .add-vip .gt .li:nth-child(2){
	width: 40%;
}
.qupu-content .new-detail .right .more .add-vip .gt .li:nth-child(3){
	width: 30%;
}
.qupu-content .new-detail .right .more .add-vip .gt .li:before{
	content: '';
    position: absolute;
    width: 37px;
    height: 37px;
    top: 20px;
    left: 50%;
    margin-left: -18.5px;
}
.qupu-content .new-detail .right .more .add-vip .gt .li:nth-child(1):before{
	background: url(/public/static/ccguitar/images/gt-icon-01.png) no-repeat 100%/100%;
}
.qupu-content .new-detail .right .more .add-vip .gt .li:nth-child(2):before{
	background: url(/public/static/ccguitar/images/gt-icon-02.png) no-repeat 100%/100%;
}
.qupu-content .new-detail .right .more .add-vip .gt .li:nth-child(3):before{
	background: url(/public/static/ccguitar/images/gt-icon-03.png) no-repeat 100%/100%;
}
.qupu-content .new-detail .right .more .add-vip .gt .li:nth-child(1):after,
.qupu-content .new-detail .right .more .add-vip .gt .li:nth-child(2):after{
	content: '';
    position: absolute;
    width: 1px;
    height: 77px;
    top: 12px;
    right: 0;
    background: #FF9494;
}
.qupu-content .new-detail .right .more .add-vip div.h1_vip{
    color: #ff7171;
    text-align: center;
    padding-bottom: 7px;
	background: #ffe7e7;
    padding-top: 7px;
    font-size: 20px;
    font-weight: 400;
}
.qupu-content .new-detail .right .more .add-vip .btn{
	color: #ffffff;
    text-align: center;
    font-weight: 600;
    font-size: 15px;
    background: #ff7171;
    border-radius: 4px;
    box-shadow: 0px 1px 3px 0px rgb(255 198 198 / 50%) inset;
    padding: 0;
    width: 93%;
    margin: 0 auto;
    margin-top: 15px;
    margin-bottom: 10px;
    cursor: pointer;
    height: 33px;
    line-height: 33px;
}
.add-operation{
	margin-top: 25px;
	position: relative;
}
.add-operation .li{
	background: #FFE7E7;
    border-radius: 3px;
    margin-bottom: 13px;
    height: 38px;
    line-height: 38px;
    color: #FF7171;
    font-size: 14px;
    font-weight: 500;
    padding-left: 142px;
	cursor: pointer;
	position: relative;
}
.add-operation p{
	color: #7a7878;
	font-size: 14px;
	padding-left: 34%;
	padding-top: 12px;
	padding-bottom: 25px;
}
.add-operation img{
    position: absolute;
    top: 7px;
    left: 102px;
    width: 25px;
    cursor: pointer;
}
.add-operation img.collection, .add-operation img.no-collection{
	display: none;
}
.add-operation .operation{
	border-top: 1px solid #b3b3b3;
}
.add-operation .operation .operation-main{
	width: 66%;
	margin: 0 auto;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
	padding-top: 20px;
	padding-bottom: 10px;
}
.add-operation .operation .opern-down{
	color: #7c7a7a;
	font-size: 13px;
	cursor: pointer;
	position: relative;
	padding-top: 36px;
}
.add-operation .operation .opern-print{
	color: #7c7a7a;
	font-size: 13px;
	cursor: pointer;
	position: relative;
	padding-top: 34px;
}
.add-operation .operation .opern-share{
	color: #7c7a7a;
	font-size: 13px;
	cursor: pointer;
	position: relative;
	padding-top: 34px;
	display: none;
}
.add-operation .operation .opern-down:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 30px;
    top: 0px;
    left: 11px;
    background: url(/public/static/ccguitar/images/qupu-down.png) no-repeat 100%/100%;
}
.add-operation .operation .opern-print:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 30px;
    top: 0px;
    left: 11px;
    background: url(/public/static/ccguitar/images/qupu-print.png) no-repeat 100%/100%;
}
.add-operation .operation .opern-share:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 30px;
    top: 0px;
    left: 11px;
    background: url(/public/static/ccguitar/images/qupu-share.png) no-repeat 100%/100%;
}
.qupu-content .new-detail .right .more .user{
	border: 0.5px solid #d1d1d1;
	border-radius: 5px;
	box-shadow: 0px 2px 4px 0px rgb(0 0 0 / 9%); 
	margin-top: 25px;
}
.qupu-content .new-detail .right .more .user .img{
	width: 60px;
    height: 60px;
	border: 1px solid #b8b8b8;
	border-radius: 50%;
	margin: 0 auto;
	margin-top: 20px;
	overflow: hidden;
}
.qupu-content .new-detail .right .more .user .img img{
	width: 100%;
    height: 100%;
}
.qupu-content .new-detail .right .more .user .nickname{
	font-size: 16px;
	font-weight: 600;
	text-align: center;
	color: #2d2d2d;
	margin-top: 10px;
}
.qupu-content .new-detail .right .more .user .follow{
    width: 152px;
    height: 22px;
    line-height: 24.5px;
    color: #595858;
    font-size: 14px;
    margin: 0 auto;
    margin-top: 14px;
    margin-bottom: 25px;
    padding-right: 13px;
    text-align: right;
    border: 0.5px solid #ff7171;
    border-radius: 4px;
    position: relative;
    overflow: hidden;
}
.qupu-content .new-detail .right .more .user .follow i{
    position: absolute;
    top: 0;
    left: 0;
    width: 56px;
    height: 100%;
    text-align: center;
    background: #FF7171;
    color: #ffffff;
    letter-spacing: 1px;
	cursor: pointer;
}
.recommend-list.recommend-block-list ul{
	width: 94%;
	margin: 0 auto;
	display: block;
}
.recommend-list.recommend-block-list ul li{
	width: 100%;
	margin-bottom: 10px;
}
.recommend-list.recommend-block-list ul li:hover{
	margin-top: 0;
    margin-bottom: 10px;
}
.recommend-list.recommend-block-list ul li a .entry-meta{
	padding-top: 9px;
}
.qupu-content .rank-list .head p:first-child label {
    padding-left: 52px;
}
.qupu-content .rank-list .head p:nth-child(1){
	width: 487px;
}
.qupu-content .rank-list .head p {
   width: 62px;
   overflow: hidden;
}
.qupu-content .rank-list .head {
    min-width: 836px;
	overflow: hidden;
}
.qupu-content .rank-list .body {
    min-width: 833px;
}
.qupu-content .rank-list .body .li .p:nth-child(1){
	width: 578px;
}
.qupu-content .opern-play.margin-left-40 {
    margin-left: 64px;
}
.qupu-content .rank-list .body .li .p{
	width: 84px;
}
.qupu-content .rank-list .head .p:nth-child(1){
	width: 578px;
}
.qupu-content .rank-list .head .p{
	width: 84px;
	float: left;
}
.buy-vip-poup{
    position: absolute;
    width: 100%;
    height: 485px;
    bottom: 0px;
    left: 0;
    background: linear-gradient(180deg,rgba(255,255,255,0.80) 0%, #ffffff 31%, #fefefe);
    z-index: 9;
}
.buy-vip-poup p{
	text-align: center;
    font-size: 18px;
    font-weight: 400;
    margin-top: 137px;
	margin-bottom: 30px;
}
.buy-vip-poup .buy-vip-btn, .buy-vip-poup .buy-opern-btn, .buy-vip-poup .look-opern{
    background: #ff7171;
    color: #fefefe;
    width: 213px;
    height: 37px;
    line-height: 37px;
    text-align: center;
    border-radius: 26px;
    font-size: 16px;
    margin: 0 auto;
    margin-bottom: 20px;
    border: 1px solid #ff7171;
	cursor: pointer;
}
.buy-vip-poup .buy-opern-btn{
	border: 1px solid #979797;
	background: #ffffff;
	color: #5D5D5D;
}
.record-list .head{
	width: 100%;
	min-width: 1040px;
	margin-bottom: 10px;
}
.record-list .head p{
	width: 67px;
	display: inline-block;
	text-align: center;
	font-size: 14px;
	font-weight: 600;
	color: #1a1a1a;
}
.record-list .head p label{
	font-size: 13px;
	color: #313131;
}
.record-list{
	width: 100%;
	margin-top: 30px;
}
.record-list ul{
	width: 100%;
	overflow: hidden;
	padding-bottom: 10px;
}
.record-list ul li{
	float: left;
	width: 33.3333%;
	display: flex;
	position: relative;
	margin-bottom: 18px;
}
.record-list ul li a{
	float: left;
	width: 94%;
	min-width: 290px;
	display: block;
    overflow: hidden;
	margin: 0 auto;
	border: 1px solid #e5e5e5;
	border-radius: 5px;
	box-shadow: 1px 1px 2px 0px rgba(82,82,82,0.12); 
}
.record-list ul li a .rank-div{
	width: 93%;
	margin: 0 auto;
	padding: 12px 0;
	overflow: hidden;
	padding-left: 36px;
	padding-top: 15px;
    padding-bottom: 15px;
}
.record-list ul li a .rank-div .photo{
	width: 60px;
	height: 60px;
	border-radius: 50%;
    overflow: hidden;
	float: left;
}
.record-list ul li a .rank-div .photo img{
	width: 100%;
	height: 100%;
}
.record-list ul li a .rank-div .info{
	float: left;
	padding-left: 12px;
}
.record-list ul li a .rank-div .info h2{
	font-size: 15px;
	font-weight: 600;
	margin-top: 5px;
}
.record-list ul li a .rank-div .info .sj{
	margin-top: 15px;
}
.record-list ul li a .rank-div .info .sj span{
	font-size: 12px;
	font-weight: 400;
	margin-right: 20px;
}
.record-list .body .li .p span{
	display: inline-block;
	float: left;
}
.record-list .body .li .table-serial-number{
	font-size: 24px;
	font-weight: 400;
	color: #ff2b44;
	width: 50px;
	text-align: center;
	padding-top: 28px;
}
.record-list .body .li .table-tag{
	position: relative;
	width: 50px;
}
.record-list .body .li .table-tag label{
	font-size: 12px;
	color: #0bbf83;
	border: 1px solid #0bbf83;
	border-radius: 2px;
	padding: 1px 2px;
	position: absolute;
    top: 21px;
    left: 0;
    display: inline-block;
	height: 13px;
    line-height: 13px;
	width: 32px;
    text-align: center;
}
.record-list .body{
	width: 100%;
	min-width: 941px;
}
.record-list .body .li{
	margin-bottom: 10px;
	height: 55px;
	line-height: 55px;
	overflow: hidden;
}
.record-list .body .li .p{
	width: 70px;
	display: inline-block;
	text-align: center;
	color: #585858;
	font-size: 12px;
	position: relative;
	float: left;
}
.record-list .body .li .p.color-red{
	color: #FF3F5D;
}
.record-list .head p:nth-child(1), .record-list .body .li .p:nth-child(1){
	width: 30%;
}
.record-list .head p:nth-child(2), .record-list .body .li .p:nth-child(2){
	width: 20%;
}
.record-list .head p:nth-child(3), .record-list .body .li .p:nth-child(3){
	width: 49%;
}
.record-list .body .li:nth-child(odd){
    background: #EEF2F5;
}
.money-head{
	width: 100%;
	height: 100px;
	background: #eef2f5;
	border-radius: 5px;
	margin-bottom: 40px;
	position: relative;
}
.money-head h3{
	font-size: 14px;
	color: #000000;
	font-weight: bold;
	padding-left: 20px;
	padding-top: 22px;
}
.money-head p{
	font-size: 13px;
	color: #000000;
	margin-top: 15px;
	padding-left: 20px;
}
.money-head p label{
	font-size: 16px;
	font-weight: bold;
}
.buy-btn{
    position: absolute;
    right: 25px;
	top: 34px;
	background: #899ba9;
	border-radius: 15px;
	color: #FCFCFC;
	font-size: 14px;
	padding: 4px 20px;
	cursor: pointer;
}
.buy-btn:hover{
	background: #607F97;
}
.manage_my_money .recharge_record li {
    height: 170px;
    border-radius: 4px;
    overflow: hidden; 
}
.manage_my_money .recharge_record li h1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #eef2f5;
    color: #4B4B4B;
    font-size: 13px;
    padding: 0 10px;
    height: 43px;
	font-weight: 500;
    overflow: hidden; 
}
.manage_my_money .recharge_record li h1 span:first-child {
    margin-right: 40px; 
}
.manage_my_money .recharge_record li .item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding-left: 10px;
	height: 108px;
	border: 1px solid #E8EAEB;
	border-top: none; 
}
.manage_my_money .recharge_record li .item .left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1; 
}
.manage_my_money .recharge_record li .item .right {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 153px;
    text-align: center;
    border-left: 1px solid #E8EAEB;
    height: 109px;
    line-height: 109px;
    font-size: 14px;
}
.manage_my_money .recharge_record li .item .right .icon{
	color: #91979D;
}
.manage_my_money .recharge_record li .item .right .icon.success {
	color: #FE7526; 
}
.manage_my_money .recharge_record li .item .l_left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 75%;  
}
.manage_my_money .recharge_record li .item .l_left .img {
    width: 92px;
    height: 92px;
    margin-right: 28px; 
}
.manage_my_money .recharge_record li .item .l_left .img img {
	width: 100%;
	height: 100%;
}
.manage_my_money .recharge_record li .item .l_left .text h2 {
	font-size: 17px;
	color: #201F1C;
	margin-bottom: 25px; 
}
.manage_my_money .recharge_record li .item .l_left .text p {
	font-size: 12px;
	color: #91979D; 
}
.manage_my_money .recharge_record li .item .l_right {
	font-size: 18px;
	color: #161616; 
	font-weight: bold;
}
.block-head{
	width: 100%;
	padding: 10px 0 20px 10px;
	overflow: hidden;
	border: 1px solid #e5e5e5;
	border-radius: 4px;
	margin-bottom: 10px;
}
.block-head .block-head-img{
    width: 133px;
    height: 133px;
	overflow: hidden;
	float: left;
	border-radius: 5px;
}
.block-head .block-head-img img{
	width: 100%;
	height: 100%;
}
.block-head .info{
    padding-left: 15px;
    float: left;
}
.block-head .info h1{
	font-weight: 600;
	color: #000000;
	font-size: 29px;
	padding-top: 8px;
}
.block-head .info p{
	font-weight: 400;
	color: #000000;
	font-size: 12px;
	padding-top: 29px;
}
.breadcrumbs{
	margin-bottom: 10px;
	font-size: 14px;
}
.breadcrumbs a{
	margin-bottom: 10px;
	font-size: 14px;
}
.user-link{
	/* display: none; */
    width: 51px;
    height: 51px;
    margin-top: 9px;
}
.user-link img{
    width: 100%;
    height: 100%;
    border-radius: 50%;
}
.site-content.site-user-content>.content{
	width: 81%;
    margin-left: 20px;
}
.site-content.site-user-content>.content .rank-list{
	width: 100%;
    margin-left: 0;
}
.content-tab .rank-list{
	width: 100%;
    margin-left: 0;
}
.recommend-list.recommend-auto-list{
	width: 100%;
}
.close-full-screen{
	cursor: pointer;
	width: 40px;
    height: 40px;
    position: absolute;
    top: 30px;
    right: 51px;
    z-index: 999999;
	display: none;
}
.user-link img.vip-status{
    position: absolute;
    top: 37px;
    right: 7px;
    width: 13px;
    height: 12px;
	display: none;
}
._B_Pagination {
	width: 100%;
	margin-bottom: 1rem; 
}
._B_Pagination .s_l_pagination {
	margin-top: 40px; 
}
._B_Pagination .s_l_pagination .s_d_p {
	position: relative;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%); 
	overflow: hidden;
	display: inline-block;
}
._B_Pagination .s_l_pagination li{
	float: left;
}
._B_Pagination .s_l_pagination li a {
	padding: 0 5px;
	font-size: 14px;
	width: auto;
	height: 23px;
	text-align: center;
	line-height: 23px;
	margin: 0 7px;
	text-align: center; 
	color: #9F9F9F;
	display: inline-block;
	border: 1px solid #979797;
}
._B_Pagination .s_l_pagination li span {
	font-size: 14px; 
}
._B_Pagination .s_l_pagination li.active a {
	background-color: #FF4160; 
	color: white !important;
	border: 1px solid #FF4160;
}
.recommend-list ul li a .entry-header i.i1{
	color: #00C37E;
	border: 1px solid #00C37E;
}
.recommend-list ul li a .entry-header i.i2{
	color: #FF2B44;
	border: 1px solid #FF2B44;
}
.recommend-list ul li a .entry-header i.i3{
	color: #FFAA00;
	border: 1px solid #FFAA00;
}
.select-tab{
	position: absolute;
    top: 0;
    right: 0;
}
.select-tab ul li{
	color: #585858;
    font-size: 13px;
    display: inline-block;
    border: 1px solid #979797;
    float: left;
}
.select-tab ul li a{
	padding: 5px 13px;
	display: block;
}
.select-tab ul li.active{
	border: 1px solid #FF7171;
	background: #FF7171;
}
.select-tab ul li.active a{
	color: #FCFCFC;
}
.select-tab ul li:not(:last-child){
	border-right: 0;
}
.select-tab ul li:not(:first-child){
	border-left: 0;
}
.rank-list .body .li .table-tag label.i1{
	color: #00C37E;
	border: 1px solid #00C37E;
}
.rank-list .body .li .table-tag label.i2{
	color: #FF2B44;
	border: 1px solid #FF2B44;
}
.rank-list .body .li .table-tag label.i3{
	color: #FFAA00;
	border: 1px solid #FFAA00;
}
.site-content>.content.qupu-content .more-btn a{
	color: #FF3F5D;
    font-size: 13px;
    border: 1px solid #FF3F5D;
    border-radius: 3px;
    text-align: center;
    margin: 0 auto;
    margin-bottom: 20px;
	display: block;
	padding: 5px 20px;
	width: 95px;
	margin-top: 10px;
}
.site-content .navbar .manage_user_info ul li:hover{
	background: initial;
}
.site-content .navbar .manage_user_info ul li:hover a{
	color: initial;
}
.site-content.site-user-content>.content .tab{
	margin-top: 0;
}
.site-content.site-user-content>.content .tab li{
	float: left;
}
.site-content.site-user-content>.content .tab span{
	font-size: 14px;
	color: #A3A3A3;
	background: #ffffff;
	border: 1px solid #a3a3a3;
	padding: 4px 10px;
	margin-right: 20px;
	cursor: pointer;
}
.site-content.site-user-content>.content .tab li.active span{
	color: #ffffff;
	background: #ff7171;
	border: 1px solid #ff7171;
}
.linkage{
	background: #ffffff;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    z-index: 9;
    padding-top: 42px;
    border: 1px solid #ff7171;
    border-radius: 25px;
    box-shadow: 0px 5px 6px 0px rgb(0 0 0 / 11%);
    padding-bottom: 23px;
	display: none;
}
.linkage .linkage-main{
	width: 93%;
    margin: 0 auto;
	margin-top: 25px;
	display: none;
	position: relative;
}
.linkage .linkage-main .del-btn{
    position: absolute;
    top: 0px;
    right: 10px;
    width: 12px;
    height: 16px;
	cursor: pointer;
}
.linkage .linkage-main.linkage-main-hot{
	display: block;
}
.linkage h3{
	font-size: 12px;
}
.linkage ul{ 
	width: 105.2%;
	max-height: 159px; 
    overflow: hidden;
}
.linkage ul li{
	display: inline-block;
    padding: 13px 0 0 0;
    margin-right: 18px;
    width: 98px;
    overflow: hidden;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.linkage ul li a{
	cursor: pointer;
}
.linkage ul li a:hover{
	color: #FF3F5D;
}
.site-content.site-content-login{
	height: 90%; 
}
.similarity-progress {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin-bottom: 0;
	height: 6px;
    overflow: inherit;
    border-radius: 4px;
    -webkit-box-shadow: none;
    box-shadow: none;
	margin-top: 2px;
    border: 0.88px solid #afafaf;
    background: #e9e9e9;
    width: 50%;
    float: left;
    margin-left: 20px;
    margin-top: 4px;
}
.similarity-progress .similarity-progress-ing {
    width: 0;
    background-color: #FF7171;
	height: 100%;
    border-radius: .106667rem;
}
.similarity-progress .similarity-progress-ing-button {
    width: 10px;
    background-color: transparent;
    position: relative;
}
.similarity-progress .similarity-progress-ing-button::before {
	content: '';
    display: block;
    width: 15px;
    height: 15px;
    position: absolute;
    left: -4.4px;
    top: -4.4px;
    background: url(/public/static/ccguitar/images/progress-ing-button.png) no-repeat 100%/100%;
    z-index: 100;
	cursor: pointer;
}
.a-b-main{
	width: 68px;
	position: fixed;
    right: 13px;
    bottom: 142px;
	background: #ffffff;
	padding-bottom: 7px;
    padding-top: 5px; 
	border-radius: 5px;
	box-shadow: 0px 2px 4px 0px rgb(0 0 0 / 10%);
}
.a-b-main02{
	bottom: 60px;
}
.a-b-main .a-b-bottom {
	text-align: center;
    font-size: 12px;
    color: #7C818A;
    position: relative;
    cursor: pointer;
    width: 92%;
    margin: 0 auto;
}
.a-b-main .a-b-bottom.a-b-bottom-rz{
	border-top: 1px solid #d8d8d8;
	margin-top: 7px;
}
.a-b-main .a-b-bottom>img, .a-b-main .a-b-bottom a>img {
    width: 31px;
    height: auto;
    margin-top: 5px;
}
.a-b-main .a-b-bottom p.font-size-min {
    font-size: 12px;
	padding: 3px;
	color: #7C818A;
}
.a-b-main .a-b-bottom .max-qr {
    position: absolute;
    z-index: 100;
    display: none;
    right: 1.3rem;
    bottom: 0;
}
.a-b-main .find-div-body {
    position: relative;
    top: 79px;
    right: 49px;
    width: 115px;
    height: 131px;
    padding: 6px 4px;
    background-color: #FFFFFF;
    border: #cccccc solid 1px;
    border-radius: 9px;
}
.a-b-main .a-b-bottom p:nth-child(1) {
    padding-bottom: 5px;
    font-size: 13.5px;
    font-weight: 500;
}
.a-b-main .a-b-bottom .hot {
    color: #D23D3D;
    font-size: 13px;
    padding-bottom: 9px;
}
.a-b-main .a-b-bottom p.font-size-min.font-padding {
    padding-top: 10px;
    padding-bottom: 14px;
    font-size: 13px;
    letter-spacing: 1px;
}
.a-b-main .a-b-bottom .max-qr img {
    width: 91%;
    height: auto;
}
.adv{
	width: 87%;
    margin-top: 10px; 
}
.adv a{
	display: block;
}
.adv a img{
	width: 100%;
}
.site-content.site-content-down {
    height: 558.9px;
	background: #FCFCFC;
}
.site-content.site-content-down .down-info { 
    width: 1140px;
    margin: 0 auto; 
    overflow: hidden;
}
.site-header.site-header-down{
	background: #eaeaea;
}
.site-header.site-header-down .header-nav{
	width: 289px;
}
.site-header.site-header-down .header-nav ul li{
	margin-right: 71px;
	height: 25px;
    line-height: 25px;
	margin-top: 37px;
	border: 1px solid #eaeaea;
}
.site-header.site-header-down .header-nav ul li:hover{
	border: 1px solid #FF3F5D;
    border-radius: 35px;
	color: #FF3F5D;
}
.site-header.site-header-down .header-nav ul li a{
	font-size: 13px;
}
.site-header.site-header-down .header-nav ul li:last-child{
    padding: 0 15px;
	height: 25px;
    line-height: 25px;
	border: 1px solid #FF3F5D;
}
.site-header.site-header-down.site-header-404 .header-nav ul li:last-child{
	border: 1px solid #eaeaea;
}
.site-header.site-header-down.site-header-404 .header-nav ul li:last-child:hover{
	border: 1px solid #FF3F5D;
	border-radius: 17px;
}
.down-info .left{
    float: left;
	width: 60%;
}
.down-info .left .img{
    width: 99%;
}
.down-info .left .img img{
	width: 100%;
}
.down-info .right{
    float: left;
	width: 40%;
}
.down-info .right .qrcode{
	margin-top: 219px;
}
.down-info .right .qrcode p{
	font-size: 13px;
	font-weight: 400;
	color: #000000;
}
.down-info .right .qrcode .img{
	width: 117px;
	margin-top: 5px;
}
.down-info .right .qrcode .img img{
	width: 100%;
}
.down-info .right .down-btn{
	margin-left: 152px;
    margin-top: -25px;	
}
.down-info .right .down-btn ul li{
    background: #f5f5f7;
    border-radius: 9px;
    width: 133px;
    margin-bottom: 10px;
	position: relative;
}
.down-info .right .down-btn ul li a{
	color: #000000;
	font-size: 12px;
	display: block;
	line-height: 18px;
	padding: 7px 0;
    padding-left: 54px;
}
.down-info .right .down-btn ul li a:before{
    content: "";
    position: absolute;
    width: 35px;
    height: 35px;
    top: 8px;
    left: 9px;
}
.down-info .right .down-btn ul li:nth-child(1) a:before{
	background: url(/public/static/ccguitar/images/down-app-store.png) no-repeat 100%/100%;
}
.down-info .right .down-btn ul li:nth-child(2) a:before{
	background: url(/public/static/ccguitar/images/down-app-an.png) no-repeat 100%/100%;
}
.down-info .right .down-btn ul li:nth-child(3) a:before{
	background: url(/public/static/ccguitar/images/down-app-win.png) no-repeat 100%/100%;
}
.site-footer .container .friendlinks-ul li{
    position: relative;
}
.contact-wechat{
	position: absolute;
    left: 3px;
    bottom: 7px;
    background-image: url(../images/contact-bg.png);
    background-size: 100% 100%;
    height: 214px;
    z-index: 999;
	display: none;
}
.contact-wechat h4{
    color: #FF444F;
    font-size: 13px;
    text-align: left;
    padding: 8.5px 26px;
    font-weight: 400;
}
.contact-wechat ul{
	overflow: hidden;
    width: 165px;
    margin: 0 auto;
    text-align: center;
    padding-left: 37px;
    margin-top: 5px;
}
.contact-wechat ul li{
	width: 100px;
	float: left;
	margin: 0 5px;
}
.contact-wechat ul li .img{
	width: 109px;
}
.contact-wechat ul li .img img{
	width: 100%;
}
.contact-wechat ul li p{
	color: #585858;
	font-size: 14px;
	text-align: left;
}
.contact-wechat .close{
    position: absolute;
    right: 18px;
    top: 14px;
    width: 18px;
    height: 18px;
	cursor: pointer;
}
.err404{
	overflow: hidden;
	padding-top: 100px;
}
.err404 .img{
	width: 210px;
	margin: 0 auto;
}
.err404 .img img{ 
	width: 100%;
}
.err404 p{
    text-align: center;
}
.err404 p:nth-child(2){
    color: #868686;
	font-weight: 400;
	font-size: 20px;
}
.err404 p:nth-child(3){
    color: #868686;
	font-weight: 400;
	font-size: 16px;
	margin-top: 5px;
}
.err404 p:nth-child(4){
	margin-top: 15px;
}
.err404 p:nth-child(4) a{
    color: #FF7171;
	font-weight: 400;
	font-size: 13px;
}
.qupu-content.qupu2-content .new-detail .right .more .info .head h1{
	padding-left: 0;
}
.video-wrap{
	height: 450px;
}
.qupu-content.qupu3-content .new-detail .right .more .info .head h1{
	padding-left: 0;
}
.qupu-content.qupu3-content .new-detail .right .more .info .singer{
	margin-top: 15px;
}
.qupu-content.qupu3-content .new-detail .left .introduce{
	padding: 0;
	margin-top: 30px;
	height: auto;
	background: initial;
}
.qupu-content.qupu3-content .new-detail .left .introduce.top30{
	margin-top: 40px;
}
.qupu-content.qupu3-content .new-detail .left .introduce p{
    font-size: 13px;
    line-height: 20px;
}
.qupu-content.qupu3-content .new-detail .left .introduce h3{
	margin-bottom: 15px;
}
.qupu-content.qupu3-content .new-detail .left .introduce .user{
	border: 1px solid #d3d3d3;
    border-radius: 5px;
    overflow: hidden;
    padding: 22px 10px;
}
.qupu-content.qupu3-content .new-detail .left .introduce .user .img{
    width: 62px;
    height: 62px;
    float: left;
    border-radius: 50%;
    overflow: hidden;
}
.qupu-content.qupu3-content .new-detail .left .introduce .user .img img{
	width: 100%;
	height: 100%;
}
.qupu-content.qupu3-content .new-detail .left .introduce .user .info{
	float: left;
	padding-left: 25px;
}
.qupu-content.qupu3-content .new-detail .left .introduce .user .info h3{
	font-size: 14px;
	font-weight: bold;
	color: #000000;
	margin-bottom: 9px;
	margin-top: 8px;
}
.qupu-content.qupu3-content .new-detail .left .introduce .user .info p{
	font-size: 12px;
	color: #000000;
}
.qupu-content.qupu3-content .new-detail .left{
	width: 69%;
}
.qupu-content.qupu3-content .new-detail .right{
	width: 28%;
}
.wechat-code {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 999999;
}
.letter-rac, #banner-box-5-1{
	display: none;
}
#siwper1-middle-play{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 5.1rem;
	margin: auto;
	cursor: pointer;
	z-index: 9;
}
#spectrum-siwper-next, #spectrum-siwper-prev{
	display: block;
}
#spectrum-siwper-next1, #spectrum-siwper-prev1{
	display: none;
} 
#banner-box-5-0 {
    height: 264px;
}
.content-letter .rank-list{
	display: block;
}
.content-letter .recommend-list{
	display: none;
}
.content-pulist .rank-list{
	display: block;
}
.content-pulist .recommend-list{
	display: none;
}
.content-ukulele .rank-list{
	display: block;
}
.content-ukulele .recommend-list{
	display: none;
}
.content-pu-type .rank-list{
	display: block;
}
.content-pu-type .recommend-list{
	display: none;
}
.content-musician .rank-list{
	display: block;
}
.content-musician .recommend-list{
	display: none;
}
.content-sp .rank-list{
	display: block;
}
.content-sp .recommend-list{
	display: none;
}
.content-search .rank-list{
	display: block;
}
.content-search .recommend-list{
	display: none;
}
.qupu-content .content-tab .rank-list.div_show{
	display: block;
}
.qupu-content .content-tab .recommend-list, .look-opern, .info-list, .info-h5, .down-app-adv, .down-list, .header-h5, .pu-banner, .down.down-bt, .search-head{
	display: none;
}
.bg-fg{
    width: 100%;
    height: 10px;
    background: #F6F6F6;
}
.content-search .linkage{
	display: none;
}
.header-h5{
	display: none;
}
@media screen and (max-width: 1000px) {
	.qupu-content.qupu3-content .new-detail .left{
		width: 100%;
	}
	.qupu-content.qupu3-content .new-detail .left .introduce{
		display: block;
	    width: 94%;
	    margin: 0 auto;
	    margin-top: 23px;
	}
	.qupu-content.qupu3-content .new-detail .left .introduce.top30{
		margin-top: 22px;
	}
	.video-wrap {
	    height: 204px;
	}
	.header-h5{
		display: block;
	}
	.down.down-bt {
	    display: block;
	    background: linear-gradient(
	180deg,#ff6b6b, #ff5c5c);
	    border-radius: 20px;
	    box-shadow: 0px 0.02rem 0.025rem 0px rgb(0 0 0 / 25%);
	    border: 0;
	    color: #fff;
	    font-size: 14px;
	    width: 95px;
	    padding: .1rem 0;
	    position: fixed;
	    left: 50%;
	    bottom: 20px;
	    margin-left: -47px;
	    z-index: 999;
	    text-align: center;
	}
	input{outline: none;} 
	.search-head{
		overflow: hidden;
	    width: 100%;
	    background: #fff;
	    padding-bottom: 0;
	    position: fixed;
	    z-index: 999;
	    top: 0;
	    left: 0;
	    height: 52px;
	}
	.search-head .search-head-ontent{
	    width: 94%;
	    margin: 0 auto;
	}
	.back-btn{
		width: 10%;
	    float: left;
	}
	.back-btn img{
		width: 20px;
	    margin-top: 7px;
	}
	.back-btn{
		float: left;
	}
	.search-head .search-box-main{
		width: 87%;
		background: #f6f6f6;
	}
	.search-box-main a{
		display: block;
		width: 100%;
		height: 100%;
	}
	.search-head .search-head-ontent .title{
	    float: left;
	    font-weight: 500;
	    font-size: .5rem;
	    color: #000000;
	    text-align: center;
	    width: 90%;
	    margin-left: -.45rem;
	}
	.search-head.title-head{
		padding: .4rem 0;
	}
	.search-head.title-head .back-btn img{
		margin-top: 0.02rem;
	}
	.search-box-main{
		width: 90%;
	    height: 34px;
	    line-height: 34px;
	    margin: 0 auto;
	    position: relative;
	    overflow: hidden;
	    background: #FFFFFF;
	    border-radius: 20px;
	    margin-top: 10px;
	}
	.search-input-box{
	    height: 100%;
	    font-weight: 400;
	    color: #939393;
	    padding-left: 33px;
	    font-size: 14px;
	}
	.search-input-box input{
		width: 74%;
	    height: 100%;
	    border: 0;
	    padding-left: 0;
	    font-size: 14px;
		background: none;
	}
	.search-box-main .search-btn{
		background: #fee0e0;
	    border-radius: 1rem;
	    color: #FF5B5B;
	    font-size: 14px;
	    border: 0;
	    padding: .11rem .47rem;
	    position: absolute;
	    top: 50%;
	    right: 5px;
	    width: 60px;
	    height: 26px;
	    margin-top: -13px;
	}
	.search-box-main i{
		width: 16px;
	    height: 16px;
	    background: url(/public/static/ccguitar/images/search-icon.png) no-repeat 100%/100%;
	    position: absolute;
		top: 8px;
	    left: 10px;
	}
	.tag-title h3{
		font-size: 14px;
	}
	.linkage{
		background: #ffffff;
	    position: fixed;
	    top: 10px;
	    left: 0;
	    width: 100%;
	    height: 100%;
	    z-index: 9;
		overflow: hidden;
		display: none;
		border: 0;
	}
	.linkage .linkage-main{
		width: 93%;
	    margin: 0 auto;
		margin-top: .4rem;
		display: none;
		position: relative;
		margin-bottom: .9rem;
	}
	.linkage .linkage-main .del-btn{
	    position: absolute;
	    top: .1rem;
	    right: .2rem;
	    width: .36rem;
	    height: .46rem;
		cursor: pointer;
	}
	.linkage .linkage-main.linkage-main-hot{
		display: block;
		margin-top: .5rem;
	}
	.linkage h3{
		font-size: 14px;
		margin-bottom: 10px;
	}
	.linkage ul{ 
	    width: 100%;
		max-height: 357px;
	    overflow: hidden;
	}
	.linkage ul li{
		display: inline-block;
	    padding: 13px 0 0 0;
	    margin-right: 18px;
	    width: 98px;
	}
	.linkage ul li a{
		cursor: pointer;
	    padding: .05rem .3rem;
	    background: #F6F6F6;
	    border-radius: .4rem;
	    font-size: .4rem; 
	    display: inline-block;
	    overflow: hidden;
	    overflow: hidden;
	    text-overflow: ellipsis;
	    white-space: nowrap;
	    max-width: 90%;
	}
	.linkage .linkage-main-hot ul li{
		width: 44%; 
	}
	.linkage .linkage-main-hot ul li a{
		background: none;
		padding-left: .03rem;
		color: #949596;
		font-size: 14px;
	}
	.linkage .linkage-main-hot ul li.color-red a{
		color: #020202;
	}
	.linkage .linkage-main-hot ul li.color-red a span{
		color: #FF3B58;
	}
	.no-data{
		width: 100%; 
	}
	.swiper-pagination{
		bottom: 8px;
	    left: 0;
	    width: 100%;
	    position: absolute;
	    text-align: center;
	    -webkit-transition: .3s opacity;
	    -o-transition: .3s opacity;
	    transition: .3s opacity;
	    -webkit-transform: translate3d(0,0,0);
	    transform: translate3d(0,0,0);
	    z-index: 10;
	}
	.swiper-pagination-switch {
		width: 8px;
	    height: 8px;
	    display: inline-block;
	    border-radius: 100%;
	    background: #000;
	    opacity: .2;
		margin: 0 3px;
	}
	.swiper-pagination-switch.swiper-active-switch {
		opacity: 1;
    	background: #007aff;
	}
	.pu-banner{
		width: 100%;
		height: 150px;
		background: #fff;
		padding: 10px 0;
		margin-top: 10px;
		display: block;
	} 
	.pu-banner .swiper-container {
	    width: 98%;
		height: 100%;
	    border-radius: .25rem;
	}
	.pu-banner .swiper-container .img {
		width: 100%;
		height: 100%;
	}	
	.pu-banner .swiper-container .img img {
		width: 100%;
		height: 100%;
	}	
	.site-content>.content{
		padding-bottom: 50px;
	}
	.tool{
		border: 0;
	}
	.down-list{
	    display: block;
	    position: absolute;
	    top: 10px;
	    right: 3px;
	}
	.down-list ul{
		padding-top: 6px;
	}
	.down-list ul li{
		float: left;
		position: relative;
	}
	.down-list ul li{
		float: left;
		position: relative;
		font-size: 14px;
		padding-left: 16px;
		height: 15px;;
		margin-left: 18px;
	}
	.down-list ul li img{
		position: absolute;
	    top: 1px;
	    left: -5px;
	    width: 20px;
	}
	.down-list ul li:before {
	    content: "";
	    position: absolute;
	    width: 48px;
	    height: 14px;
	    top: -10px;
	    right: -2px;
	    background: url(/public/static/m_ccguitar/images/app-icon.png) no-repeat 100%/100%;
	}
	.swiper-pattern .swiper-container{
		width: 93%;
	}
	.qupu-content .info-h5 .singer span, .qupu-content .info-h5 .reduction-degree span, .qupu-content .info-h5 .difficulty span{
		font-size: 14px;
	}
	.site-content>.content.qupu-content .breadcrumbs,
	.site-content>.content.qupu-content .tool,
	.site-content>.content.qupu-content .swiper-pattern,
	.site-content>.content.qupu-content .info-list,
	.site-content>.content.qupu-content .info-h5,
	.site-content>.content.qupu-content .down-app-adv,
	.site-content>.content.qupu-content .tab,
	.site-content>.content.qupu-content .tag-title{
		width: 94%;
		margin: 0 auto;
	}
	.qupu-content .content-tab .recommend-list,
	.site-content>.content.qupu-content.recommend-list{
		width: 97%;
		margin: 0 auto;
	}
	.site-content>.content.qupu-content .info-h5{
		width: 92%;
	}
	.qupu-content .recommend-list{
		margin-left: 0;
		margin: 0 auto;
	}
	.down-app-adv{
		display: block;
	    overflow: hidden;
		background: #fff;
		margin-bottom: 5px;
	    padding: 20px 10px;
	    padding-left: 12px;
		position: relative;
	}
	.down-app-adv .img{
		float: left;
		width: 49px;
	}
	.down-app-adv .img img{
		float: left;
		width: 100%;
	}
	.down-app-adv .info{
		float: left;
		padding-left: 10px;
	}
	.down-app-adv .info h3:nth-child(1){
	    font-size: 16px;
	    margin-bottom: 7px;
	}
	.down-app-adv .info h3{
		font-size: 14px;
		font-weight: 400;
		color: #000000;
		margin-top: .05rem;
	}
	.down-app-adv button{
	    background: #feefef;
	    border: 1px solid #ff0000;
	    border-radius: 20px;
	    font-size: 14px;
	    font-weight: 400;
	    color: #ff001d;
	    padding: 1.5px 13px;
	    position: absolute;
	    right: 13px;
	    top: 20px;
	}
	.qupu-content .info-h5{
		display: block;
		padding: 20px 5px;
	}
	.qupu-content .info-h5 .head{
		position: relative;
		margin-top: 2px; 
		margin-bottom: 0;
	}
	.qupu-content .info-h5 .head i {
	    font-size: 12px;
	    border: 1px solid #0bbf83;
	    border-radius: 2px;
	    color: #0bbf83;
	    position: absolute;
	    bottom: 3px;
	    left: -1px;
	    width: 32px;
	    height: 14px;
	    line-height: 14px;
	    text-align: center;
	}
	.qupu-content .info-h5 .head i.i1{
		color: #00C37E;
		border: 1px solid #00C37E;
	}
	.qupu-content .info-h5 .head i.i2{
		color: #FF2B44;
		border: 1px solid #FF2B44;
	}
	.qupu-content .info-h5 .head i.i3{
		color: #FFAA00;
		border: 1px solid #FFAA00;
	}
	.qupu-content .info-h5 .head h1{
		font-size: 16px;
		font-weight: bold;
		color: #000000;
		padding-left: 42px;
		width: 242px;
	    white-space: nowrap;
	    overflow: hidden;
	    text-overflow: ellipsis;
	}
	.qupu-content .info-h5 .head .zj{
		position: absolute;
	    right: 0;
	    bottom: 0;
	    font-size: 12px;
	    color: #000000;
		display: flex;
		display: none;
	}
	.qupu-content .info-h5 .head .zj span{
		display: inline-block;
	    width: 105px;
	    white-space: nowrap;
	    overflow: hidden;
	    text-overflow: ellipsis;
	}
	.qupu-content .info-h5 .singer{
		margin-top: 10px;
		overflow: hidden;
		display: flex;
		position: relative;
	}
	.qupu-content .info-h5 .singer span:nth-child(2){
	    padding-left: 19px;
	    width: 120px;
	    white-space: nowrap;
	    overflow: hidden;
	    text-overflow: ellipsis;
	    display: inline-block;
	}
	.qupu-content .info-h5 .difficulty{
		position: relative;
	}
	.qupu-content .info-h5 .difficulty .gz{
		display: inline-block;
		position: absolute;
	    top: -2px;
	    right: 0;
	}
	.qupu-content .info-h5 .difficulty .gz img{
	    width: 23px;
	    margin-left: 17px;
	}
	.qupu-content .info-h5 .singer span:nth-child(3){
	    position: absolute;
	    top: 0;
	    right: 0;
	}
	.qupu-content .info-h5 .reduction-degree{
		margin-top: 10px;
		overflow: hidden;
	}
	.qupu-content .info-h5 .reduction-degree span{
		float: left;
	}
	.qupu-content .info-h5 .difficulty{
		margin-top: 10px;
	}
	.qupu-content .info-h5 .information{
		margin-top: 20px;
		color: #818181;
		font-size: 13px;
		display: -webkit-box;
	    display: -ms-flexbox;
	    display: flex;
	    -webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	    justify-content: space-between;
	}
	.qupu-content .info-h5 .information span{
		display: inline-block;
		position: relative;
	}
	.qupu-content .info-h5 .information span:nth-child(2){
		padding-left: 10px;
	}
	.qupu-content .info-h5 .information span.look-num:before {
	    content: "";
	    position: absolute;
	    width: 16px;
	    height: 16px;
	    top: 0px;
	    left: -10px;
	    background: url(/public/static/ccguitar/images/look.png) no-repeat 100%/100%;
	}
	.info-list .info-list-main {
	    width: 99%;
	    margin: 0 auto;
	    display: -webkit-box;
	    display: -ms-flexbox;
	    display: flex;
	    -webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	    justify-content: space-between;
	}
	.info-list{
		display: block;
		background: #fff;
	    padding-bottom: 10px;
	    padding-top: 10px;
	}
	.info-list span {
	    font-size: 14px;
	    font-weight: 400;
	    color: #707070;
	    position: relative;
	}
	.info-list span label {
	    padding-left: 10px;
	}
	.info-list span:nth-child(2):before {
	    content: "";
	    position: absolute;
	    width: 20px;
	    height: 20px;
	    top: 0;
	    left: -13px;
	    background: url(/public/static/ccguitar/images/look.png) no-repeat 100%/100%;
	}
	.site-content>.content.qupu-content .tag-title{
		margin-top: 5px;
	}
	.site-content>.content.qupu-content .tag-title h3{
		margin-top: 5px;
	}
	.tool .btn-fast .audio-btn{
		width: 30px;
    	height: 30px;
		top: 8px;
	}
	.audio-fast{
		padding-top: 56px;
	}
	.rotation-btn, .tool .btn-fast .full-screen-btn, .page-pap{
		display: none;
	}
	.page-pap{
		width: 73px; 
	    height: 24px;
	    line-height: 26px;
	}
	.buy-vip-poup .look-opern{
		display: block;
		width: 173px;
	    height: 30px;
	    line-height: 30px;
		margin-top: 20px;
	}
	.buy-vip-poup p, .buy-vip-poup .buy-vip-btn, .buy-vip-poup .buy-opern-btn{
		display: none;
	}
	.swiper-pattern .top-pages {
		left: 5px;
	}
	.swiper-pattern .turn-pages {
	    right: 5px;
	}
	.swiper-pattern .top-pages, .swiper-pattern .turn-pages{
		top: 45%;
		width: 30px;
    	height: 30px;
	}
	.swiper-pattern{
		height: 500px;
		border: 0;
	}
	.buy-vip-poup{
		height: 73px;
	}
	.buy-vip-poup p{
		margin-top: 34px;
	}
	.site-content>.content.qupu-content .tab{
		margin-top: 25px;
	}
	.qupu-content .new-detail .left .introduce{
		/*display: none;*/
	}
	.site-content>.content.qupu-content{
		width: 100%;
		margin-top: 10px;
	}
	.qupu-content .new-detail .left{
		width: 100%;
	}
	.qupu-content .content-tab .rank-list.div_show{
		display: none;
	}
	.qupu-content .content-tab .recommend-list{
		display: block;
		padding-top: 21px;
	}
	.content-search .rank-list{
		display: none;
	}
	.content-search .recommend-list{
		display: block;
	}
	.block-head{
		width: 95%;
		padding-bottom: 10px;
		margin-bottom: 25px;
	}
	.block-head .block-head-img{
		width: 97px;
    	height: 97px;
	}
	.block-head .info h1{
		font-size: 20px;
	}
	.content-sp .rank-list{
		display: none;
	}
	.content-sp .recommend-list{
		display: block;
	}
	.spectrum-list ul li a{
	    width: 92%;
    	min-width: 148px;
	}
	.spectrum-list ul li a .spectrum-div .photo{
		width: 162px;
    	height: 162px;
	}
	.spectrum-list ul li{
		width: 50%;
		height: 185px;
	}
	.content-musician .rank-list{
		display: none;
	}
	.content-musician .recommend-list{
		display: block;
	}
	.content-pu-type .opern-option .degree-reduction-tab ul li, .content-pu-type .opern-option .degree-reduction-tab-small ul li{
		width: 70px;
	}
	.tag-title{
		margin-top: 5px;
		margin-bottom: 15px;
	}
	.select-tab ul li a{
		padding: 3px 11px;
	}
	.content-pu-type .rank-list{
		display: none;
	}
	.content-pu-type .recommend-list{
		display: block;
	}
	.new-detail .container{
		margin-top: 20px;
	}
	.site-content>.content .new-detail{
		width: 100%;
		margin-top: 10px;
	}
	.site-content>.content .new-detail .head{
		display: block;
		margin-top: 0;
	}
	.new-detail .left{
		width: 100%;
		float: inherit;
	}
	.new-detail .right{
		display: none;
	}
	.site-content>.content .head.new-head{
		display: block;
		height: 61px;
	}
	.content-ukulele ._B_Pagination .s_l_pagination{
		margin-top: 40px;
	}
	.new-list ul li{
		height: 121px;
	}
	.new-list ul li a>div h2{
		font-size: 15px;
		overflow: hidden;
	    text-overflow: ellipsis;
	    white-space: nowrap;
	}
	.new-list ul li a>div .content .left{
		height: 65px;
	}
	.new-list ul li a>div .content .right .text{
		margin-left: 13px;
    	margin-top: -3px;
		-webkit-line-clamp: 3;
		font-size: 12px;
	}
	.new-list ul li a>div .content .right{
	    height: 77px;
	}
	.content-ukulele .rank-list{
		display: none;
	}
	.content-ukulele .recommend-list{
		display: block;
	}
	.opern-option.seek-option .opern-tab ul li.active{
		margin-right: 4px;
		padding: 1px 7px;
	}
	.opern-option.seek-option .opern-tab ul li{
		margin-right: 4px;
		padding: 1px 7px;
	}
	.opern-option.seek-option .opern-tab ul li:first-child a{
		padding-left: 14px;
	}
	.content-singer .opern-option .degree-reduction-tab-small ul li{
		width: 26px;
	}
	.singer-list ul li{
		width: 25%;
	}
	.rank-list.musician-rank-list{
		margin-left: -5px;
		margin-top: 15px;
	}
	.rank-list.musician-rank-list ul li{
		float: inherit;
		width: 100%;
	}
	.content-pulist .opern-option .degree-reduction-tab ul li, .content-pulist.opern-option .degree-reduction-tab-small ul li{
		width: 67px;
	}
	.content-pulist .opern-option .opern-tab ul li:first-child a{
		padding-left: 14px;
	}
	.content-letter .opern-option .degree-reduction-tab-small ul li {
	    width: 27px;
	}
	.content-letter .rank-list{
		display: none;
	}
	.content-letter .recommend-list{
		display: block;
	}
	.content-pulist .rank-list{
		display: none;
	}
	.content-pulist .recommend-list{
		display: block;
	}
	#banner-box-5-0{
		display: none; 
	}
	#spectrum-siwper-next, #spectrum-siwper-prev{
		display: none;
	}
	#spectrum-siwper-next1, #spectrum-siwper-prev1{
		display: block;
	}
	#spectrum-siwper-next1{
	   	right: -5px;
	    top: 107px;
	    width: 17px;
	}
	#spectrum-siwper-prev1{
		left: -5px;
	    top: 107px;
	    width: 17px;
	}
	#banner-box-5-1{
		display: block;
	}
	.site-content{
		width: 100%;
	}
    .site-header {
        display: none;
    }
    .site-content .navbar{
		display: none;
    }
    .recommend-list ul li{
		float: inherit;
    	width: 100%; 
    }
    .site-footer .site-footer-content{
		min-width: inherit;
    }
    .a-b-main{
		display: none;
    }
    .site-footer{
		display: none;
    }
    .first-recommend{
		display: none;
    }
    #spectrum .swiper-slide .ul li{
		margin-right: 0 !important;
    }
    .site-content>.content{
		margin: 0 auto;
	    float: inherit;
	    width: 92%;
    }
    .site-content>.content.content-search{
		margin-top: 0;
    }
    .recommend-list{
		margin-left: -4px;
    	margin-top: 10px;
    }
    .opern-option .degree-reduction-tab, .opern-option .degree-reduction-tab-small{
    	margin-top: 11px;
		padding-left: 4px;
    }
    .opern-option .opern-tab ul li{
		margin-right: 0px;
    }
    .opern-option .opern-tab ul li a{
		padding: 2px 14px;
    }
    .opern-option .opern-tab ul{
		white-space: nowrap;
    	overflow-x: auto;
    }
    .opern-option .opern-tab ul li{
		display: inline-block;
    	float: initial;
    }
    #banner-box-5{
		display: none; 
    }
    ._B_Pagination .s_l_pagination{
		margin-top: 10px;
    }
    .site-content #spectrum .swiper-slide .ul li, #letter .swiper-slide .ul li{
		padding: 15px 0 20px !important;
    }
    .site-content #spectrum .swiper-slide .ul li img{
		width: 130px !important;
	    height: 130px !important;
    }
    .site-content #spectrum #banner-box-5-1 .swiper-slide .ul li{
	    width: 50%;
    }
    .site-content #spectrum .info-box>div.name{
		text-align: center;
    }
    .site-content #spectrum .info-box>div, #letter .info-box>div{
		text-align: center;
    	width: 100%;
    }
	.site-content #spectrum .info-box>div.name {
	    width: 100%; 
	}
	.site-content #banner-box-5-1{
		width: 90%; 
	}
	.site-content .content-box-7 #spectrum-siwper-next.swiper5-button{
		right: -5px;
    	top: 107px;
		width: 17px;
	}
	.site-content .content-box-7 #spectrum-siwper-prev.swiper5-button{
		left: -5px;
    	top: 107px;
		width: 17px;
	}
	.site-content #banner-box-5-1{
		height: 202px;
	}
	.site-content #spectrum h1.title, .site-content #letter h1.title{
		font-size: 20px;
	}
	.site-content .letter-select{
		width: 78%;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	.site-content .letter-select ul li{
		width: 16px;
		margin-bottom: 8px;
		padding: 2px 0;
	}
	.site-content #letter .swiper-wrapper{
		margin-top: 0;
	}
	.site-content #letter #banner-box-6{
		display: none; 
	}
	.letter-rac{
	    display: block;
	    width: 90%;
	    margin: 0 auto;
	}
	.letter-rac li{
		 margin-bottom: 15px;
		 overflow: hidden;
	}
	.letter-rac li a{
	    display: block;
	    width: 100%;
		color: #201F1C;
	}
	.letter-rac li a .zm-title{
		width: 56%;
		float: left;
		position: relative;
		padding-left: 45px;
		color: #201F1C;
		font-weight: 400;
		font-size: 13px;
	}
	.letter-rac li a .zm-fr{
		width: 26%;
	    float: left;
	    overflow: hidden;
	    text-overflow: ellipsis;
	    white-space: nowrap;
		text-align: right;
	}
	.letter-rac li a .zm-title i{
		position: absolute;
		top: 0;
		left: 0;
		padding: 1px 3px;
		border-radius: 3px;
		font-size: 12px;
	}
	.letter-rac li a .zm-title h3{
	    width: 159px;
	    overflow: hidden;
	    text-overflow: ellipsis;
	    white-space: nowrap;
		color: #201F1C;
	}
	.letter-rac li a .zm-title i.i1{
		color: #00C37E;
		border: 1px solid #00C37E;
	}
	.letter-rac li a .zm-title i.i2{
		color: #FF2B44;
		border: 1px solid #FF2B44;
	}
	.letter-rac li a .zm-title i.i3{
		color: #FFAA00;
		border: 1px solid #FFAA00;
	}
	.content-box-7 #letter-siwper-next.swiper5-button{
		display: none; 
	}
	.content-box-7 #letter-siwper-prev.swiper5-button{
		display: none; 
	}
	.opern-option .degree-reduction-tab label, .opern-option .degree-reduction-tab-small label{
		margin-right: 10px;
	}
	.opern-option .degree-reduction-tab ul li, .opern-option .degree-reduction-tab-small ul li{
		width: 58px;
	}
	.opern-option .degree-reduction-tab-small ul li{
		margin-bottom: 5px; 
	} 
	.site-content>.content .head{
		display: none; 
	}
	.site-content>.content.qupu-content .tab li:nth-child(2){
		display: none; 
	}
	.header-h5{
      width: 100%;
      height: 48px;
      background: #ffffff;
      display: block;
      position: relative;
      z-index: 9999;
	  display: block;
	}
    .header-h5 .defalut .d-top {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      height: 48px;
      border-bottom: 1px solid #E7EAEB;
      -webkit-box-shadow: 0px 2px 48px 0px rgba(0, 0, 0, 0.06);
      box-shadow: 0px 2px 48px 0px rgba(0, 0, 0, 0.06);
      background-color: #FFFFFF;
  	  position: fixed;
      left:0;
      top:0;
      width: 100%;
      z-index: 999;
      transition: top .5s; }
   	  .header-h5 .defalut .search{
	    position: absolute;
	    width: 90%;
	    right: 4px;
	    top: 3px;
	    margin-left: -45%;
	    border-radius: .1rem;
	    height: .85rem;
	    line-height: .85rem;
	    font-size: .35rem;
	    text-align: center;
	    color: #7C818A;
   	  }
   	  .header-h5 .defalut .search span{
		position: relative;
   	  	padding-left: .4rem;
   	  }
	  .header-h5 .defalut .search span img{
		position: absolute;
	    left: -.2rem;
	    top: -.05rem;
	    width: .5rem;
   	  }
   	  .header-h5 .defalut .d-top.hhidden{
		top: -1.333333rem;
   	  }
      .header-h5 .defalut .d-top a.logo {
        display: block;
		width: 85px;
	    height: 32px;
        background-image: url("/public/static/ccguitar/images/logo.png");
        background-size: 100% 100%;
		margin-left: 15px; }
      .header-h5 .defalut .d-top .input {
		width: 123px;
	    height: 25px;
	    border-radius: 22px;
	    background-color: #f9f9f9;
	    display: -webkit-box;
	    display: -ms-flexbox;
	    display: flex;
	    -webkit-box-align: center;
	    -ms-flex-align: center;
	    align-items: center;
	    padding: 0 5px;
	    border: 1px solid #FF5B5B;
	    position: relative; }
      .header-h5 .defalut .d-top img.user{
      	display: none;
		width: .9rem;
      	height: .8rem; }
	  .header-h5 .defalut .d-top img.user-vip{
	  	display: none;
		width: .9rem;
      	height: .8rem; }
      .header-h5 .defalut .d-top .down {
        color: #FF5B5B;
		font-size: 14px; }
	  .header-h5 .defalut .d-top .login {
        color: #1FD39B;
		font-size: .36rem; }
        .header-h5 .defalut .d-top .input .icon.search {
		  margin-right: 5px;
	      display: block;
	      width: 18px;
	      height: 18px;
          background-image: url("/public/static/ccguitar/images/search-icon.png");
          background-size: 100% 100%; }
        .header-h5 .defalut .d-top .input p {
          font-size: 14px;
          padding-left: 10px;
          color: #979797; }
      .header-h5 .defalut .d-top a.more {
		border: 0;
	    display: block;
	    width: 16px;
	    height: 16px;
	    background-image: url(/public/static/ccguitar/images/more.png);
	    background-size: 100% 100%;
	    margin-right: 15px; }
        .header-h5 .defalut .d-top a.more.active {
          background-image: url("/public/static/ccguitar/images/icon-close-h5.png"); }
    .header-h5 .defalut .nav {
      background: rgba(0, 0, 0, 0.5);
      height: 100vh;
      display: none; }
      .header-h5 .defalut .nav .header-h5-nav-close {
        color: #fff;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        font-size: .426667rem;
        margin-top: .64rem; }
        .header-h5 .defalut .nav .header-h5-nav-close i.nav-back {
	    display: block;
	    width: 15px;
	    height: 15px;
	    background-image: url(/public/static/ccguitar/images/nav_back.png);
	    background-size: 100% 100%;
	    margin-left: 5px; }
        .header-h5 .defalut .nav .header-h5-nav-close .button {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          font-size: 14px;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center; }
      .header-h5 .defalut .nav ul {
        background-color: white;
        padding: 0 10px;
		padding-top: 46px; }
        .header-h5 .defalut .nav ul li {
          padding: 15px 10px; }
          .header-h5 .defalut .nav ul li i.icon {
		    display: block;
		    width: 25px;
		    height: 25px;
		    background-size: 100% 100%;
		    margin-right: 9px; }
            .header-h5 .defalut .nav ul li i.icon.home {
              background-image: url("/public/static/ccguitar/images/nav-01.png"); }
            .header-h5 .defalut .nav ul li i.icon.gqp {
              background-image: url("/public/static/ccguitar/images/nav-02.png"); }
            .header-h5 .defalut .nav ul li i.icon.gqjp {
              background-image: url("/public/static/ccguitar/images/nav-05.png"); }
            .header-h5 .defalut .nav ul li i.icon.ycds {
              background-image: url("/public/static/ccguitar/images/nav-06.png"); }
            .header-h5 .defalut .nav ul li i.icon.yyr {
              background-image: url("/public/static/ccguitar/images/nav-06.png"); }
			.header-h5 .defalut .nav ul li i.icon.singer {
              background-image: url("/public/static/ccguitar/images/nav-07.png"); }
            .header-h5 .defalut .nav ul li i.icon.sq {
              background-image: url("/public/static/ccguitar/images/nav-08.png"); }
			.header-h5 .defalut .nav ul li i.icon.uk {
              background-image: url("/public/static/ccguitar/images/nav-09.png"); }
			.header-h5 .defalut .nav ul li i.icon.new {
              background-image: url("/public/static/ccguitar/images/nav-10.png"); }
          .header-h5 .defalut .nav ul li a {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            font-size: 14px;
            color: #201F1C; }
        .header-h5 .defalut .nav ul li + li {
          border-top: 1px solid #E7EAEB; }
    .header-h5 .detail {
      height: 1.333333rem;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      padding: 0 .533333rem;
      background-color: #fff;
      -webkit-box-shadow: 0px 2px 0.64rem 0px rgba(0, 0, 0, 0.06);
      box-shadow: 0px 2px 0.64rem 0px rgba(0, 0, 0, 0.06); }
      .header-h5 .detail a.back {
        display: block;
        width: .56rem;
        height: .56rem;
        background-size: 100% 100%; }
      .header-h5 .detail p {
        font-size: .426667rem;
        color: #000; }
      .header-h5 .detail a.search {
        display: block;
        width: .533333rem;
        height: .533333rem;
        background-size: 100% 100%; }
}