@charset "utf-8";


.content{ background: url(../images/body_bg.png) no-repeat; background-size: cover; background-position: center center;}
.mode01{ padding-top: 41px;}
.gp-title{ border-bottom: 1px solid #e1e1e3;}
.channelName{padding: 0 0 10px 31px; position: relative; border-bottom: 2px solid #004a94;}
.channelName::before{ content: ''; display: block; width: 21px; height: 19px; position: absolute; left: 0; top: 3px;}
.iconImg::before{ background: url(../images/pic_icon.png) no-repeat;}
.bookImg::before{ background: url(../images/book_icon.png) no-repeat;}
.voiceImg::before{ background: url(../images/voice_icon.png) no-repeat;}
.studentImg::before{ background: url(../images/student_icon.png) no-repeat;}
.learningImg::before{ background: url(../images/learning_icon.png) no-repeat;}
.fileImg::before{ background: url(../images/file_icon.png) no-repeat;}
.slick{ margin-top: 17px;}
.slick > li{ position: relative;}
.slick{ position: relative; overflow: hidden;}
li.slick-slide::after{ content: ''; display: block; width: 100%; height: 100px; position: absolute; bottom: 0; z-index: 0;
    background: -webkit-linear-gradient(rgba(255, 255, 255,0), rgba(0, 0, 0 ,.8)); /* 谷歌浏览器上白->黑*/
    background: -o-linear-gradient(rgba(255, 255, 255,0), rgba(0, 0, 0 ,.8)); /* Opera浏览器上红->蓝 */
    background: -moz-linear-gradient(rgba(255, 255, 255,0), rgba(0, 0, 0 ,.8)); /* 火狐浏览器上绿->粉红 */
    background: linear-gradient(rgba(255, 255, 255,0), rgba(0, 0, 0 ,.8)); /* 标准的语法 */ }
.slick li .title{ position: absolute; bottom: 0; color: #fff; z-index: 10; line-height: 26px; width: 77.75%; margin: 0 0 15px 30px;}
.slick-dots{ padding: 9px 10px; position: absolute; right: 0px; top: 0px; margin: 10px 11px 0 0; z-index: 999; border-radius: 13px; background-color: rgba(0, 0, 0, .5);}
.slick-dots button{ display: none;}
.slick-dots li{ width: 8px; height: 8px; border-radius: 50%; margin: 0 5px; float: left; background-color: #fff; opacity: 0.3;}
.slick-dots .slick-active{ opacity: 1;}
 .left,.center,.right{ width: 31.25%;}
.left .img{ padding-bottom: 56%;}
.center{ margin: 0 40px;}
.list{ margin-top: 8px; padding-bottom: 3px; border-bottom: 1px solid #d9dde2;}
.list li{ padding-left: 18px; position: relative; margin-bottom: 5px; transition: all .3s ease;}
.list li:hover{ text-indent: 0.3em;}
.list a{ line-height: 24px;}
.list li::before{ content: ''; display: block; width: 7px; height: 8px; background: url(../images/triangle_right.png) no-repeat; background-size: cover; position: absolute; left: 0; top: 8px;}

.mode02{ width: 100%; margin-top: 40px;}
.mode02 .gp-img-responsive{ display: block; padding-bottom: 7.8125%;}

.mode03{ margin-top: 41px; padding-bottom: 40px;}




/* 响应式样式 */
@media screen and (max-width:1600px){
    .header_bg{ background-size: cover;}
}

@media screen and (max-width:1440px) {
    
}

@media screen and (max-width:1400px) {
}

@media screen and (max-width:1280px) {
    .center{ margin: 0 35px;}
}

@media screen and (max-width:1200px) {
    .center{ margin: 0 25px;}
}

@media screen and (max-width:1100px) {
    .mode01 .left{ width: 100%; margin-bottom: 30px;}
    .mode01 .center,.mode01 .right{ width: 48%;}
    .mode01 .center{ margin: 0;}
}

@media screen and (max-width:1024px) {
}

@media screen and (max-width:997px) {
    .left,.center,.right,.mode01 .center, .mode01 .right{ float: none; width: 100%; margin: 30px 0;}
    .mode01{ padding-top: 0;}
    .mode02{ margin-top: 10px;}
}

@media screen and (max-width:768px) {
}

@media screen and (max-width:540px) {
}

@media screen and (max-width:414px) {
    .gp-menu{ top: 25%;}
}

@media screen and (max-width:320px) {

}