/* --- 公用样式 --- */
html,body{
background:#FFF;
max-width: 767px;
margin: 0 auto;
}
.icon{font-family:iconfont;}
html{font-size:62.5%; font-size:10px;}
span{display:block;}
.left{float:left;}
.right{float:right;}
p{line-height:100%;}
@media only screen and (min-width:321px) {html {font-size:62.5%!important}}
@media only screen and (min-width:361px) {html {font-size:70.31%!important}}
@media only screen and (min-width:376px) {html {font-size:73.24%!important}}
@media only screen and (min-width:481px) {html {font-size:94%!important}}
@media only screen and (min-width:561px) {html {font-size:109%!important}}
@media only screen and (min-width:641px) {html {font-size:125%!important}}
/* --- 头部 --- */
.header0{
left: 0;
position: fixed;
z-index: 4;
top: 0;
display: block;
box-sizing: content-box;
width: 100%;
padding: 0;
-webkit-transition: all .6s cubic-bezier(.19,1,.22,1);
transition: all .6s cubic-bezier(.19,1,.22,1);
-webkit-transform: translateZ(0);
transform: translateZ(0);
border: 0;
outline: 0;
}
.header{background:#DE3031; overflow:hidden;}
/* 用户 */
.header .user{float:left; width: 15%;margin-left: 10%;}
.header .user a{background:url(../images/top-user.png) no-repeat 90% center; display:block; background-size:2.4rem; height:5rem;}
/* logo */
.header .logo{float:left; width:50%;}
.header .logo a{background:url(../images/logo.png) no-repeat center; display:block; background-size:12rem; height:5rem;}
/* 关注 */
.header .follow{float:right; width:12.5%;}
.header .follow .icon{background:url(../images/top-follow.png) no-repeat center center; background-size:2.4rem; height:5rem; cursor:pointer;}
/* --- 二维码 --- */
#follow-form{display:none;border:1em solid #FFF;width:60%;position:fixed;top:15%;left:19%;z-index:9999;background: white; }
#follow-form a{float: right;}
#over{width: 100%;height: 100%;opacity:0.8;filter:alpha(opacity=80);display: none;position:fixed;top:0;left:0;z-index:999;background: silver;}
#over a{width: 100%;height: 100%;position: fixed;}
/* --- 助力 --- */
#zhuli-form{display:none;border:0 solid #FFF;position:fixed;left:0;top:0;z-index:9999;background: white;height: 100%;width: 100%; }
#zhuli-form .close{text-align: right;font-size: 1.5rem;padding-right: 15px;width: 100%;height: 5%;}
#zhuli-over{display:none;width: 100%;height: 100%;opacity:0.8;filter:alpha(opacity=80);position:fixed;top:0;left:0;z-index:999;}
#zhuli-over a{width: 100%;height: 100%;position: fixed;}
.index-ad{width: 100%;height: 95%;display: block;}
.index-ad img{width: 100%;height: 100%;}
.ctop{padding-top: 5px;}
.ctop img{width: 100%;}
/* 搜索 */
.header .search{float:right; width:12.5%;}
.header .search .icon{background:url(../images/top-search.png) no-repeat center center; background-size:2.4rem; height:5rem; cursor:pointer;}
/* 搜索 */
.header_gzs .search{float:right; width:12.5%;}
.header_gzs .search .icon{background:url(../images/top-search.png) no-repeat center center; background-size:2.4rem; height:5rem; cursor:pointer;}
/* 弹出 */
.drawer-nav{z-index:200;}
.drawer-nav li{height:3.5rem; line-height:3.5rem; text-align:center; border-bottom:1px solid #efefef; font-size:1.4rem;}
/* --- 搜索框 --- */
.search-form{background:#f5f5f5; padding:1rem; display:none;}
.search-form input{width:100%; height:3.5rem; line-height:3.5rem; border:none; padding-left:3rem; font-size:1.4rem; box-shadow: 10px 10px 20px #ddd; background:url(../images/search-btn.png) no-repeat #fff 1rem center; background-size:1.4rem;}
/* --- 导航 --- */
.nav{background:#fff; overflow:hidden;margin-top: 5rem;}
/* 链接 */
.nav ul{width:90%; float:left;}
.nav ul li{float:left; width:33.333%; text-align:center; font-size:1.4rem; height:3.5rem; line-height:3.5rem;}
.nav ul li a.now{color:#DE3031;}
/* 箭头 */
.nav .arrow{float:right; background:url(../images/arrow-down.png) no-repeat center center; height:3.5rem; width:10%; background-size:1.4rem; cursor:pointer;}
/* --- 更多导航 --- */
.nav-more{background:#fff; border-top:1px solid #efefef; overflow:hidden; display:none;}
.nav-more li{float:left; width:33.333%; text-align:center; font-size:1.4rem; line-height:3.5rem;}
/* --- banner --- */
.banner .swiper-slide img{width:100%;}
/* --- 音乐--- */
.mic {width:100%;text-align:center;}
/* --- 滚动--- */
.gundong {width:100%;}
.gundong span{font-weight: bolder;font-size: 16px;color:#DE3031;}
.gundong a{color:#DE3031;}
/* --- 今日头条 --- */
.the-headlines{overflow:hidden; position:relative;margin-bottom: 0.3rem;background: #E8E7E7;}
/* 标题 */
.the-headlines .title{background:#DE3031; height:4.5rem; padding-top:.3rem; padding-bottom:.3rem; position:relative; box-shadow: 0px 10px 10px #ececec;}
.the-headlines .title .text{float:left; color:#fff; width:25%; text-align:center; text-shadow :#670B06 0px 0px 5px;}
.the-headlines .title .text em{font-size:.8rem; text-transform:uppercase;}
.the-headlines .title .text p{font-size:1.4rem;font-weight: bold;}
.the-headlines .title h3{float:left; width:72%; text-align: center; line-height:3.5rem;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;color: #FFF;}
.the-headlines .title h3 a{color:#fff;font-size:1.8rem;}
.the-headlines .title:before{content:""; background:url(../images/headlines-left.png) no-repeat; top:4.5rem; position:absolute; width:1.5rem; height:3rem; background-size:1.5rem;}
.the-headlines .title:after{content:""; background:url(../images/headlines-right.png) no-repeat; top:4.5rem; right:0; position:absolute; width:1.5rem; height:3rem; background-size:1.5rem;}
/* 内容 */
.the-headlines .box{background:#fff; padding:1rem; overflow:hidden; margin:1.5rem; margin-top:0; box-shadow:0px 10px 20px #ddd;}
.the-headlines .box .pic{float:left; width:35%; margin-top:.3rem;}
.the-headlines .box .pic img{width:100%;}
.the-headlines .box .text{float:right; width:61%;height: 8.2rem;overflow: hidden;}
.the-headlines .box .text p{font-size:1.2rem; line-height:1.6rem;}
.the-headlines .box h4 {
text-transform: uppercase;
font-size: 1.2rem;
margin-bottom: 1rem;
margin-top: .8rem;
line-height: 100%;
color: #DE3031;
text-align: left;
margin-left: -.5rem;
}
.the-headlines .box h4:before{ color:#ddd; margin-right:1rem; }
.the-headlines .box h4:after{ color:#ddd; margin-left:1rem; }
/* --- 栏目 --- */
.column{border-bottom: 1px solid #efefef;height: 3.5rem;line-height: 3.5rem;background: #E8E7E7;display: flex; justify-content: space-between;}
.column h2{font-size: 1.4rem;border-left: .5rem solid #DE3031;padding-left: 1rem;float: left;line-height: 3.5rem;font-weight: bold;white-space:nowrap;}
.column .more {
float: right;
margin-right: 1rem;
overflow-x: auto;
white-space: nowrap;
overflow-y: hidden;
}
.column .more a{margin-left:.5rem; font-size: 1.2rem;white-space: nowrap;}
/* --- 列表 --- */
.article-list{}
.article-list li {border-bottom:1px solid #efefef; overflow:hidden; position:relative; padding-bottom:1rem; margin-bottom:1rem;}
.article-list li .pic{float:left; width:35%;}
.article-list li .pic img{width:100%;}
.article-list li .text{float:right; width:60%; color:#999;}
.article-list li .text h3{font-size:1.6rem; margin-bottom:.5rem;height: 4.2rem;overflow: hidden;line-height: 2.1rem; }
.article-list li .text p{font-size:1.2rem; color:#999; margin-bottom:.5rem; }
.article-list li .text em.right{background:url(../images/author.png) no-repeat 0 center; background-size:1rem; padding-left:1.5rem;}
/* --- 更多 --- */
.article-more{text-align:center; font-size:1.4rem;}
/* --- 课程与教学 --- */
.class{background:#fff; padding:1rem;clear: both;}
/* 推荐 */
.class .recommend{position:relative; margin-bottom:1.5rem;}
.class .recommend .pic img{width:100%;}
.class .recommend .text{position:absolute; bottom:0; left:0; width:100%; background-color:rgba(0,0,0,0.5);
height:3rem; line-height:3rem; text-align:center;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;color:#fff; font-size:1.2rem; }
.class .recommend .text a{color:#fff; font-size:1.2rem;}
/* --- 广告 --- */
.ad{margin-bottom:1rem;}
.ad img{width:100%;}
.poster{margin-bottom:1rem;}
.poster img{width:100%;height: auto !important;}
/* --- 展评与活动 --- */
.show{background:#fff; padding:1rem;}
/* 列表 */
.show li{overflow:hidden; margin-bottom:1rem; border-bottom:1px solid #efefef; padding-bottom:1rem;}
.show li .pic{position:relative; margin-bottom:1rem;}
.show li .pic em{position:absolute; bottom:0; left:0; width:100%; background-color:rgba(0,0,0,0.5); color:#fff; height:3rem; line-height:3rem; text-align:center; color:#fff; font-size:1.2rem;}
.show li .pic img{width:100%;}
.show li .text{margin-bottom:1rem; font-size:1.2rem; color:#999;}
.show li .text p{line-height:150%; font-size:1.2rem;}
.show li .info em.right{background:url(../images/author.png) no-repeat 0 center; background-size:1rem; padding-left:1.5rem;}
/* --- 社区与家庭 --- */
/* .family{background:#fff; padding:1rem; margin-bottom:1rem;} */
/* 推荐 */
/* .family .recommend{overflow:hidden; border-bottom:1px solid #efefef; margin-bottom:1rem;clear: both;} */
.class .recommend .family{width:103%;}
.class .recommend .family li{width:47%; float:left; margin-right:3%; margin-bottom:1rem;}
.class .recommend .family .pic{margin-bottom:.5rem;}
.class .recommend .family .pic img{width:100%;}
.class .recommend .family li .text{
margin-bottom: .5rem;
font-size: 1.2rem;
height: 3.6rem;
line-height: 150%;
overflow: hidden;
background: #fff;
color: #333;
position: relative;
}
.class .recommend .family li .info{color:#999; font-size:1.2rem;}
.class .recommend .family li .info em.right{background:url(../images/author.png) no-repeat 0 center; background-size:1rem; padding-left:1.5rem;}
/* --- 音教通 --- */
.music{background:#fff; padding:.5rem; overflow:hidden; margin-bottom:1rem;}
.music li{float:left; width:50%; text-align:center; padding:.5rem;white-space:nowrap;}
.music li a{padding:1.5rem 0rem; display:block;}
.music li a h3{font-size:1.4rem; color:#fff; margin-bottom:.5rem;}
.music li a p{font-size:1.1rem; color:#fff;}
.music li.li01 a{background:#807C61;}
.music li.li02 a{background:#457774;}
.music li.li03 a{background:#856357;}
.music li.li04 a{background:#2C4049;}
.music li.li05 a{background:#4E5239;}
.music li.li06 a{background:#52865F;}
/* --- 品牌乐器展播 --- */
.music-brand{ padding:1rem; background:#fff;}
.music-brand li{margin-bottom:1rem;}
.music-brand li img{width:100%;}
.music-brand li:last-child{margin-bottom:0;}
/* --- 底部 --- */
.footer{background: #E8E7E7; text-align:center; font-size:1rem; padding:1rem; color:#999;}
.footer p{line-height:180%; margin-bottom:.5rem;}
/* 分页 */
#pages { padding:14px 0 10px; font-family:宋体;font-size: 0px;}
#pages i{font-size: 1.3rem;}
#pages a {font-size: 1.3rem; display:inline-block; background:#fff; border:1px solid #e3e3e3; text-align:center; color:#333; padding:0 10px;margin: 0 2px;}
/*#pages a.a1 { background:url(../images/admin_img/pages.png) no-repeat 0 5px; width:56px; padding:0; }*/
#pages a:hover { background: #de3031; color:#FFF; text-decoration:none }
#pages span {font-size: 1.3rem; display:inline-block; background: #de3031; border:1px solid #de3031; color:#fff; text-align:center;padding:0 10px;margin: 0 2px;}
.page .noPage { display:inline-block; width:56px; height:22px; line-height:22px; background:url(../img/icu/titleBg.png) repeat-x 0 -55px ; border:1px solid #e3e3e3; text-align:center; color:#a4a4a4; }
.text-c{text-align: center}.text-l{text-align: left}.text-r{text-align: right}
/*频道*/
.location {
margin-top: 5rem;
background: #f3f3f3;
line-height: 2;
padding: 10px;
font-size: 15px;
}
.category .category-list li{
background: url(../images/dot-right.png) no-repeat 0 center;
background-size: 5px;
padding-left: 15px;
line-height: 300%;
font-size: 1.5rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
border-bottom: 1px solid #ddd;
}
.InfoContent{padding: 8px;}
.InfoContent .title h2{font-size: 2rem;text-align: center;}
.InfoContent .date{font-size: 1.2rem;text-align: right;border-bottom: 1px dashed #aaa;margin-bottom: 5px;color:#aaa;}
.InfoContent .Content {font-size: 1.4rem;margin-bottom: 15px;border-bottom: 1px dashed #aaa;}
.InfoContent .Content p{ line-height: 1.5;margin-bottom: 10px;}
.InfoContent .Content img{max-width: 100%;height: auto !important;}
.InfoContent .Content .backword img{width: 20px;height: 20px;margin-right: 5px;margin-top: -3px;}
.InfoContent .Content .backword{display: inline-block;height: 20px;line-height: 14px;padding-left: 5px;font-size: 16px;font-weight: bold; color:#C6171D;}
.InfoContent .Content .backsohu{display: inline-block;vertical-align: top;}
.clear{clear: both;}
/*详情页*/
.infoTime{width:auto;height: 55px;line-height: 30px;color: #5c5c5c; font-size: 1.2rem; padding: 11px 0;border-bottom: 1px solid #f0f0f0;border-top: 1px solid #f0f0f0;position: relative;}
.infoTime .name{width: 50%;height: 42px;float: left;}
.infoTime .name dt{width: 35px;height: 35px;float: left;position: relative;}
.infoTime .name dt img{width: 100%;border-radius: 50%;}
.infoTime .name dd{width: 75%;line-height: 3rem;overflow: hidden;padding-left: 5px;float: left;}
.infoTime .name dd i{font-family: Arial;font-weight: bold;}
.infoTime .textShare{width: 46%;height: 42px;overflow: hidden;float: right;margin-right: -10px;}
.textShare dt{width: 55px;float: left;overflow: hidden;}
/*详情页上下篇*/
.pageTo{overflow: hidden;font-size: 1.6rem; margin-bottom: 1rem;}
.pageTo dl{float: left;width: 100%; margin-top: 1rem;}
.pageTo li{font-size: 0.8em;text-overflow: ellipsis;white-space: nowrap; overflow: hidden;}
.siblingLinks{height: 20px;background: url(../images/line4.png) no-repeat center;}
.sfq{text-align: center;font-size: 1.2rem;}
/*登录注册也底部*/
.list-imp{margin: 0;padding-left: 0;font-size: 1.4rem;font-weight: 400;}
.m-footer{background-color: #333;color: #ddd;}
.tt-l {line-height: 40px;margin-bottom: 0!important;border-bottom: 1px solid #444;text-align: center;}
.m-footer .s-color-y {color: #fc3;font-size: 1.8rem;font-family: "Microsoft YaHei",tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;}
.col-xs-12 {width: 100%;}
.m-mm {color: #fff;font-size: 1.4rem;}
.m-footer dt{margin-bottom: 18px;color: #fff; font-weight: bold;}
.m-footer-copyright {
background-color: #000;
font-family: "Microsoft YaHei",tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;
color: #ddd;
}
.m-footer-copyright li{line-height: 4rem; border-bottom: 1px solid #444;font-weight: bold;text-align: center;}
.m-footer-copyright a{color: #fff;font-size: 1.4rem;}
.text-center {line-height: 3rem; padding-bottom: 15px; padding-top: 15px;text-align: center;}
.text-center p{line-height: 2rem;}
.u-icon {
background: url(../images/icons.png) no-repeat;
display: inline-block;
zoom: 1;
vertical-align: middle;
}
.u-icon-wb {
width: 38px;
height: 38px;
line-height: 40px;
background-position: -30px -30px;
}
.u-icon-wx {
width: 38px;
height: 38px;
line-height: 40px;
background-position: 4px -30px;
}
.u-icon-qq {
width: 38px;
height: 38px;
line-height: 40px;
background-position: -72px -30px;
}
.u-icon-db {
width: 38px;
height: 38px;
line-height: 40px;
background-position: -111px -30px;
}
.ad-box{
display: none;
width: 100%;
height: 100%;
position: absolute;
z-index: 999999;
top: 0;
left: 0;
}
.showad{width: 100%;height: 95%;}
.showad img{width: 100%;height: 100%;}
.ad-top{height: 5%;width:100%;background:#FFF;}
.ad_time{ height:5%; padding:5px; position:absolute; top:0; right: 80px; color:#f00;white-space: nowrap;font-size: 16px;text-align: right;}
.ad_time span{ font-weight:bold; color:#F00; padding:0 5px;display: inline-block;font-size: 16px;}
.close{height: 5%;position: absolute;top: 0;right: 15px;cursor: pointer;text-align: right;padding: 5px;font-size: 16px;}
.cd-top {
background: url(../images/top.gif) center center no-repeat;
cursor: pointer;
overflow: hidden;
visibility: hidden;
opacity: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
height: 35px;
width: 35px;
position: fixed;
right: 10px;
bottom: 85px;
border-radius: 50%;
box-shadow: 0px 0px 10px #ccc;
bottom: 85px;
z-index: 9;
}
.cd-top.cd-is-visible{
visibility: visible;
opacity: 1;
}