/*
* @Author: hongyu.duan
* @Date:   2019-03-13 15:45:46
* @Last Modified by:   Marte
* @Last Modified time: 2020-02-18 13:12:30
*/
/* 全局配置 */
html,body{
    width:100%;
}
body,div,h1,ul,li,p{
    padding:0;
    margin:0 auto;
}
ul,li{
    list-style-type: none;
}

body{
    background:#f6f7f9;
}
body,html{
    line-height:24px;
    font-family:微软雅黑,Arial,Verdana;
    color:#666;
    font-size:12px;
}
.fl{
    float:left;
}
.fr{
    float:right;
}
.clear{
    clear:both;
}
a{
    text-decoration:none;
    color:#666;
    border:0;
}
a:link{
    color:#666;
}
a:hover{
    color:#ec1500;
}
img{
    vertical-align:middle;
    border:0;
    width:210px;
    /*height:160px;*/
}
.w{
    width:100%;
}
@font-face{
    font-family:'share_ico';
    src: url('font/icomoon.eot');
    src: url('font/icomoon.eot?#iefix') format('embedded-opentype'),
             url('font/icomoon.woff') format('woff'),
             url('font/icomoon.ttf')  format('truetype');
}
div{
	box-sizing: border-box;
}
/* header start */
.header{
    height:406px;
    background:#2b333b url('../images/banner_bg.jpg') center center/cover;
    position:relative;
}
.header .header_box{
    max-width:1200px;
    margin:0 auto;
    text-align: center;
    color: #fff;
    padding: 0 2%;
}
.header .header_box .box_tit{
    padding-top:7%;
    font-size:48px;
    line-height:1.4;
}
.header .header_box .box_desc{
    margin-top: 24px;
    font-size: 14px;
    line-height:2;
    width: 100%;
    height: 50px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.header .header_box .box_desc .showmore{
    width:20%;
    height:25px;
}
 .header .header_box .box_desc p{
    font-size: 14px;
    line-height: 28px;
    color: #fff;
    width: 100%;
    height: 25px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor:pointer;
}
.header .header_box .share{
	display: inline-block;
    margin:3% auto;
}
.header .header_box button{
    background-color:rgb(210,118,163);
    border:none;
    position:absolute;
    bottom:10px;
    left:45%;
    width: auto;
    height: 50px;
    font-size: 18px;
    border-radius: 20px;
}
.header .header_box button a{
    color:#fff;
}
.header .header_box .share:after{
    content: '\0020';
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.header .header_box .share .share_content:after{
    content:'.';
    visibility: hidden;
    display: block;
    height: 0;
    clear: both;
}
.header .header_box .share .share_content a{
    cursor: pointer;
    width:54px;
    height:54px;
    font-size:36px;
    display: block;
    background:none;
    margin:0;
    padding-left: 0;
    line-height:54px;
    margin-right: 24px;
    color:rgba(255,255,255,.6);
    border-radius: 50%;
    border:2px solid rgba(255,255,255,.6);
    font-family:'share_ico';
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
}
.header .header_box .share .share_content a:hover{
    opacity: .8;
}
.header .header_box .share .share_content a:first-child:before{
    content:"\e646";
}
.header .header_box .share .share_content a:nth-child(2):before{
    content:"\e645";
}
.header .header_box .share .share_content a:nth-child(3):before{
    content:"\e647";
}

/*内容 start*/
.content{
    width:100%;
    margin:0 auto;
}
.content .wrap{
    padding-bottom: 48px;
}
.content .wrap .type-one{
    width:980px;
    margin:0 auto;
    box-sizing: border-box;
}
.content .wrap .type-one .c_tit{
    padding: 48px 0 0;
    font-size: 32px;
    font-weight: 700;
    text-align: center;
    color: #07111B;
    line-height: 48px;
    margin-bottom: 36px;
}
.content .wrap .type-one .course{
    height:456px;
    margin-bottom: 24px;
    position: relative;
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 16px 0 rgba(7,17,27,.1);
}
.content .wrap .type-one .course .course_l{
    width:210px;
    position:relative;
    height:inherit;
}
.content .wrap .type-one .course .course_l .cl_top{
    /*height:168px;
    overflow:hidden;*/
}
.content .wrap .type-one .course .course_l .cl_teacher{
    padding:0 20px 10px;
    position: relative;
}
.content .wrap .type-one .course .course_l .cl_teacher a img{
    width:62px;
    height:62px;
    border: 2px solid #FFF;
    border-radius: 50%;
    box-shadow: 0 4px 8px 0 rgba(7,17,27,.2);
    position: absolute;
    top: -31px;
    left: 35%;
}
.content .wrap .type-one .course .course_l .cl_teacher .tinfo{
    padding:45px 0 0 0px;
    text-align:center;
}
.content .wrap .type-one .course .course_l .cl_teacher .tinfo .tname{
    font-size: 16px;
    color: #FFF;
    line-height: 24px;
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.content .wrap .type-one .course .course_l .cl_teacher .tinfo .ttitle{
    font-size: 12px;
    color: #FFF;
    line-height: 16px;
    font-weight: 200;
}
.content .wrap .type-one .course .course_l .cl_teacher .tdesc{
    margin-top: 26px;
    color: #FFF;
    font-size: 12px;
    line-height: 24px;
    font-weight: 200;
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
}
.content .wrap .type-one .course .course_l .cl_teacher .t_more{
    font-size: 12px;
    color: rgba(255,255,255,.8);
    line-height: 24px;
    display: block;
    margin-top: 20px;
    font-weight: 200;
}
.content .wrap .type-one .course .course_l .cl_teacher .t_more:hover{
    color:#fff;
}
.content .wrap .type-one .course .course_l .cl_teacher .t_more .icon_r{
    margin-left:4px;
    display:inline-block;
    font-family: 'share_ico';
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.icon_r:before{
    content:'\e625';
}
.content .wrap .type-one .course .course_r{
    height: 100%;
    background-color: #fff;
    position: relative;
    padding: 4% 4% 80px 4%;
    width: 770px;
}
.content .wrap .type-one .course:hover{
    box-shadow: 0 8px 16px 0 rgba(7,17,27,.2);
    cursor: pointer;
}
.content .wrap .type-one .course .course_r .cont_box a{
    font-size: 24px;
    line-height: 36px;
    display: block;
    margin-bottom: 16px;
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.content .wrap .type-one .course .course_r .cont_box p{
    font-size: 14px;
    line-height: 28px;
    color: #4D555D;
    min-height: 84px;
    font-weight: 200;
	overflow: hidden;

}
.content .wrap .type-one .course .course_r .more_btn{
	position: absolute;
    bottom: 20px;
    right: 3%;
}
.content .wrap .type-one .course .course_r .more_btn .mbtn{
    padding: 12px 36px;
    font-size: 16px;
    color: #FFF;
    line-height: 24px;
    border-radius: 24px;
}
.content .wrap .free{
    width:980px;
    margin:0 auto;
}
.content .wrap .free .free-box{
    margin: 0 auto;
    padding-top: 36px;

    /*
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: flex-start;
    display: flex;
    flex-wrap: wrap; */
}
.content .wrap .free .free-box:after{
    content: '\0020';
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.content .wrap .free .free-box .free-cont{
    position: relative;
    border-radius: 4px;
    /* float: left; */
    display:inline-block;
    vertical-align:top;
    width:224px;
    transition: .3s all linear;
    margin-bottom: 32px;
    margin:10px;
}
.content .wrap .free .free-box .free-cont a{
    display: block;
    position: relative;
    z-index: 1;
    overflow: hidden;
    text-overflow: -o-ellipsis-lastline;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.content .wrap .free .free-box .free-cont a .img{
    width:100%;
    overflow: hidden;
    border-radius: 8px;
    opacity: .8;
    position: relative;
    z-index: 88;
}
.content .wrap .free .free-box .free-cont a:hover .img{
    opacity:1;
}
.content .wrap .free .free-box .free-cont .img .tag{
    position: absolute;
    left: 8px;
    bottom: 8px;
    z-index: 99;
}
.content .wrap .free .free-box .free-cont .img .tag li{
    background: rgba(7,17,27,.4);
    border-radius: 12px;
    float: left;
    text-align: center;
    margin-right: 5px;
    font-size: 12px;
    color: #FFF;
    line-height: 24px;
    padding: 0 8px;
}
.content .wrap .free .free-box .free-cont .card-title{
    text-align:left;
    max-height: 100px;
    box-sizing: border-box;
}
.content .wrap .free .free-box .free-cont .card-title a{
    display: block;
    position: relative;
    z-index: 1;
    overflow: hidden;
    text-overflow: -o-ellipsis-lastline;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.content .wrap .free .free-box .free-cont .card-title a h3{
    font-size: 16px;
    line-height: 24px;
    max-height: 48px;
    text-overflow: ellipsis;
    word-break: break-all;
    word-wrap: break-word;
    overflow: hidden;
    text-overflow: -o-ellipsis-lastline;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    letter-spacing: -.1px;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
}
.content .wrap .free .free-box .free-cont .card-title .users{
    line-height: 24px;
    font-size: 12px;
    text-align: left;
    font-weight: 200;
}
.content .wrap .free .free-box .free-cont .card-title .users .users-cont{
    font-size: 12px;
    color: #4D555D;
    line-height: 24px;
}
.free-cont .card-title .users .users-cont span{
    margin:0 3px 0 0;
}
@font-face{
    font-family:'uicon';
    src: url('font/imwap.eot');
    src: url('font/imwap.eot?#iefix') format('embedded-opentype'),
             url('font/imwap.ttf')  format('truetype');
}
.free-cont .card-title .users .users-cont .u-icon{
    font-family: 'uicon';
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.free-cont .card-title .users .users-cont .u-icon:before{
    content: "\e92b";
}
.content .more{
    background-color:#d9dde1;
    padding-top:48px;
}
.content .more .more-box{
    width:980px;
    margin:auto;
    overflow:hidden;
}
.content .more .more-box dl:after{
    content: '\0020';
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.more-list dd{
    float: left;
    width:44%;
    height: 124px;
    background-image: linear-gradient(-90deg,#07111b 0,rgba(7,17,27,0) 100%);
    border-radius: 6px;
    color: #fff;
    margin-bottom: 36px;
    box-sizing: border-box;
    padding: 24px 32px 0;
    background-size:100%;
}
.more-list dd:hover{
    cursor:pointer;
}

.more-list a{
    color:#fff;
    display:block;
}
.more-list a p{
    font-size: 20px;
    line-height: 24px;
    color: rgba(255,255,255,.8);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.more-list dd > p{
    font-size: 12px;
    line-height: 24px;
    color: rgba(255,255,255,.6);
    font-weight: 200;
    margin-top: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.more-list dd .show-m{
    margin-top: 8px;
    font-size: 12px;
    font-weight: 200;
    color: rgba(240,20,20,.6);
    line-height: 16px;
}
.more-list dd .show-m i{
    font-family: 'share_ico';
    margin-left: 4px;
    display: inline-block;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
}
.more-list dd .show-m i:before{
    content: "\e625";
}
.more-list dd:hover .show-m{
    color:#F01414;
    opacity:1;
}
.more-list dd:hover p{
    color:#fff;
    opacity:1;
}
.more-box .btn-more{
    text-align: center;
    margin-bottom: 48px;
}
.more-box .btn-more a{
    border: 1px solid #F01414;
    border-radius: 24px;
    font-size: 16px;
    color: #F01414;
    line-height: 24px;
    padding: 12px 36px;
    display: inline-block;
}
.more-box .btn-more a:hover{
    color: #fff;
    background-color: #f01414;
}
footer {
	background: #181824;
	text-align: center;
	line-height: 20px;
	color: #5b5b5f;
	font-size: 12px;
	padding: 20px 0;
}

footer p {
	margin: 0;
}
footer p a:link{
	color: #666;
}
footer p br {
	display: none;
}
.c_tit{
	text-align: center;
	font-size: 40px;
	color: #000;
	line-height: 1.5;
}