@charset "UTF-8";
/**************专题页面 start*************/
.subject_banner20{
    position:relative;
    width:100%;
    min-width:1280px;
    height:705px;
    overflow:hidden;
}
.subject_banner20 span{
    position:absolute;
    left:50%;
    transform: translate(-50%,0);
    width:100%;
    min-width:1280px;
    height:705px;
    background:url("../images/subject_banner20.jpg") no-repeat center;
    overflow:hidden;
}
#subject{
    width:100%;
    min-width:1280px;
    background:url("../images/subject_bg20.jpg") no-repeat bottom;
    background-size:100% 100%;
    overflow:hidden;
}
.subject_title{
    position:relative;
    width:100%;
    height:80px;
    padding:10px 0 20px;
    text-align: center;
    overflow:hidden;
}
.page{
    margin:0;
    padding:20px 0;
}
/*开放课程（上） start*/
.subject_list1{
    width:100%;
    overflow:hidden;
}
.subject_list1 li{
    position:relative;
    float:left;
    width:calc(50% - 10px);
    height:253px;
    background:#fff;
    border-radius:8px;
    padding:20px;
    overflow:hidden;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
.subject_list1 li:first-child{ margin-right:20px;}
.subject_list1 .subject_left{
    position:absolute;
    left:20px;
    width:320px;
    height:213px;
    overflow:hidden;
}
.subject_list1 .subject_left img{
    width:100%;
    transition:all .5s;
}
.subject_list1 .subject_left:hover img{
    transform:scale(1.1,1.1);
}
.subject_list1 .subject_left i.s_mask{
    position:absolute;
    z-index:9;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background:#000;
    opacity:0;
}
.subject_list1 .subject_left i.s_play{
    position:absolute;
    z-index:10;
    top:50%;
    left:50%;
    margin:-25px 0 0 -25px;
    width:50px;
    height:50px;
    background:url("../images/icon_play.png") no-repeat center;
    background-size:cover;
    transform: scale(1.5);
    -webkit-transform: scale(1.5);
    transition: all .3s ease-out;
    opacity:0;
}
.subject_list1 .subject_left:hover i.s_mask{
    opacity:0.25;
}
.subject_list1 .subject_left:hover i.s_play{
    transform:scale(1);
    opacity:1;
}
.subject_list1 .subject_right{
    width:100%;
    padding:10px 0 10px 335px;
    overflow:hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.subject_list1 .subject_right a{
    display:block;
    width:100%;
    line-height:30px;
    color:#000;
    font-size:16px;
    margin-bottom:15px;
    overflow:hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
}
.subject_list1 .subject_right p{
    width:100%;
    height:35px;
    line-height:35px;
    color:#999;
    overflow:hidden;
    text-overflow: ellipsis;
    white-space:nowrap;
}
.subject_list1 .subject_right a:hover{
    color:#dc211c;
    text-decoration: underline;
}
.subject_list1 .subject_teacher{
    position:absolute;
    bottom:30px;
    width:100%;
    overflow:hidden;
}
.subject_list1 .subject_teacher span{
    float:left;
    width:45px;
    height:45px;
    border-radius:50%;
    margin-right:10px;
    overflow:hidden;
}
.subject_list1 .subject_teacher span img{
    width:100%;
}
.subject_list1 .subject_teacher h3{
    float:left;
    font-size:16px;
    line-height:45px;
}
/*开放课程（上） end*/

.subject_notice{
    width:100%;
    height:100px;
    line-height:100px;
    font-size:17px;
    color:#fff;
    background:url("../images/subject_notice.jpg") no-repeat center;
    background-size:100%;
    border-radius:8px;
    text-align: center;
    margin-top:20px;
    overflow:hidden;
}

/*课程列表（下） start*/
.subject_list2{
    width:100%;
    overflow:hidden;
}
.subject_list2 li{
    position:relative;
    float:left;
    width:calc(25% - 15px);
    height:395px;
    background:#fff;
    border-radius:8px;
    margin:20px 20px 0 0;
    transition:all .5s ease;
    overflow:hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
} 
.subject_list2 li:nth-child(4n){
    margin-right:0;
}
.subject_list2 li a{
    display:block;
    width:100%;
    overflow:hidden;
}
.subject_list2 li .s_up{
    position:relative;
    width:100%;
    height:100%;
    overflow:hidden;
}
.subject_list2 li .s_up i.s_mask{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:#000;
    opacity:0;
    z-index:8;
}
.subject_list2 li:hover i.s_mask{
    opacity:.3;
}
.subject_list2 li .s_up i.s_play{
    position:absolute;
    top:50%;
    left:50%;
    margin:-25px 0 0 -25px;
    width:50px;
    height:50px;
    background:url("../images/icon_play.png") no-repeat center;
    background-size:cover;
    transform: scale(1.5);
    -webkit-transform: scale(1.5);
    transition: all .3s ease-out;
    z-index:9;
    opacity:0;
}
.subject_list2 li:hover i.s_play{
    transform:scale(1);
    opacity:1;
}
.subject_list2 li .s_up img{
    width:100%;
    transition: all .5s;
}
.subject_list2 li:hover .s_up img{
    transform:scale(1.2,1.2);
}
.subject_list2 li .s_down{
    position:relative;
    z-index:2;
    width:100%;
    padding:15px;
    transition: all .5s;
    overflow:hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.subject_list2 li .s_down h4{
    width:100%;
    line-height:30px;
    color:#000;
    font-size:16px;
    margin-bottom:5px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow:hidden;
}
.subject_list2 li .s_down p {
    width:100%;
    height:30px;
    line-height:30px;
    color:#888;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.subject_list2 .subject_teacher{
    width:100%;
    padding:15px;
    border-top:1px solid #eee;
    overflow:hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.subject_list2 .subject_teacher span{
    float:left;
    width:45px;
    height:45px;
    border-radius:50%;
    margin-right:10px;
    overflow:hidden;
}
.subject_list2 .subject_teacher span img{
    width:100%;
}
.subject_list2 .subject_teacher h3{
    float:left;
    font-size:16px;
    line-height:45px;
}
@media screen and (max-width: 1399px){
    .subject_list2 li{
        height:375px;
    }
}  
/*课程列表（下） end*/

/*弹窗 start*/
.layui-layer-title{
    height:50px!important;
    line-height:50px!important;
    border-radius:6px 6px 0 0!important;
    font-size:17px!important;
    overflow:hidden;
}
.layui-layer-setwin{
    top:13px!important;
}
.s_notice{
    width:100%;
    line-height:30px;
    font-size:16px;
    overflow:hidden;
}
.s_notice i{
    color:#d11e01;
}
/*弹窗 end*/
/**************专题页面 end*************/