@charset "UTF-8";
/*************课程信息概览 start***********/
.video_bg{
    position:relative;
    width:100%;
    min-width:1400px;
    background:url("../images/video_bg.jpg") no-repeat top center;
    background-size:100% auto;
    overflow:hidden;
    box-sizing: border-box;
}
#position span,#position a{
    color:#fff!important;
}
#position a cite{
    color:#fff!important;;
}
/*上 start*/
.message_box{
    width:100%;
    background:#fff;
    border-radius:20px;
    box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.08);
    margin:0 auto;
    overflow:hidden;
}
.message{
    position:relative;
    width:100%;
    padding:25px;
    min-height: 330px;
    margin:0 auto;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.m_left{
    position:absolute;
    left:25px;
    width:420px;
    height:280px;
    border-radius:8px;
    overflow:hidden;
}
.m_left img{ width:100%;}
.m_nav{
    position:relative;
    width:100%;
    padding:10px 0 0 450px;
    overflow:hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.m_title{
    display:block;
    width:100%;
    line-height:30px;
    font-size:20px;
    font-weight:bold;
    color:#000;
    margin-bottom:15px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
}
.m_title:hover{
    color:#000;
    text-decoration:underline;
}
.m_tap{
    width:100%;
    margin:10px 0;
    overflow:hidden;
}
.m_nav p{
    width:100%;
    line-height:35px;
    font-size:15px;
    color:#333;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
}
.m_nav p span{
    float:left;
    min-width:200px;
    margin-right:15px;
}
.m_detail{
    width:100%;
    color:#333;
    line-height:26px;
    text-align: justify;
    overflow:hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp:3;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.m_study{
    display:block;
    width:150px;
    height:45px;
    line-height:41px;
    background:#fb5323;
    border:2px solid #fb5323;
    border-radius:45px;
    color:#fff;
    font-size:16px;
    margin-top:20px;
    text-align:center;
    transition:all 0.36s;
    overflow:hidden;
    box-sizing: border-box;
}
.m_study:hover{
    bottom:15px;
    width:170px;
    background:#fff;
    color:#fb5323;
}
.collect{
    cursor: pointer;
}
.collect i{
    display:inline-block;
    width:25px;
    height:25px;
    background:url("../images/video_collect1.png") no-repeat center;
    background-size:cover;
    vertical-align: -7px;
}
.collect.sel i{
    background:url("../images/video_collect2.png") no-repeat center;
    background-size:cover;
    vertical-align: -7px;
}
/*上 end*/

/* 切换按钮 start */
.detail_btn{
    width:100%;
    height:75px;
    background:#f9fafb; 
    padding:0 25px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.detail_btn li{
    position:relative;
    float:left;
    font-size:17px;
    color:#000;
    line-height:44px;
    padding:0 15px;
    border-radius:8px;
    margin:15px 20px 0 0;
    transition:all 0.3s;
    overflow:hidden;
    cursor:pointer;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.detail_btn li.sel,.detail_btn li:hover{
    color:#fff;
    background:#fb5323;
}
.detail_btn li i{
    float:left;
    width:30px;
    height:30px;
    background-size:cover;
    margin:7px 5px 0 0;
    transition:all 0.3s;
}
.detail_btn li.item1 i{background:url(../images/xq_tb1.png) no-repeat;}
.detail_btn li.item2 i{background:url(../images/xq_tb2.png) no-repeat;}
.detail_btn li.item3 i{background:url(../images/xq_tb3.png) no-repeat;}
.detail_btn li.item4 i{background:url(../images/xq_tb4.png) no-repeat;}
.detail_btn li.item5 i{background:url(../images/xq_tb5.png) no-repeat;}
.detail_btn li.item6 i{background:url(../images/xq_tb6.png) no-repeat;}
.detail_btn li.item7 i{background:url(../images/xq_tb7.png) no-repeat;}
.detail_btn li.item1.sel i,.detail_btn li.item1:hover i{background:url(../images/xq_w_tb1.png) no-repeat;}
.detail_btn li.item2.sel i,.detail_btn li.item2:hover i{background:url(../images/xq_w_tb2.png) no-repeat;}
.detail_btn li.item3.sel i,.detail_btn li.item3:hover i{background:url(../images/xq_w_tb3.png) no-repeat;}
.detail_btn li.item4.sel i,.detail_btn li.item4:hover i{background:url(../images/xq_w_tb4.png) no-repeat;}
.detail_btn li.item5.sel i,.detail_btn li.item5:hover i{background:url(../images/xq_w_tb5.png) no-repeat;}
.detail_btn li.item6.sel i,.detail_btn li.item6:hover i{background:url(../images/xq_w_tb6.png) no-repeat;}
.detail_btn li.item7.sel i,.detail_btn li.item7:hover i{background:url(../images/xq_w_tb7.png) no-repeat;}
/* 切换按钮 end */

.detail_nav{
    min-width:1400px;
    background:#fff;
    border-radius:20px;
    box-shadow: 0 0 5px 1px rgba(0,0,0,0.08);
    margin:20px auto 25px;
    overflow:hidden;
}
.detail_list{
    width:100%;
    display:none;
}
/*课程目录 start*/
.sub_list{
    width:100%;
    padding:0 20px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.sub_list li{
    position:relative;
    width:100%;
    height:65px;
    line-height:65px;
    background:#fff6f4;
    border-radius:10px;
    font-size:16px;
    margin-top:20px;
    transition:all .5s;
    overflow:hidden;
}
.sub_list li:hover p,.sub_list li.col p{
    color:#fb5323;
    text-decoration:underline;
}
.sub_list li a{
    display:block;
    width:100%;
    overflow:hidden;
}
.sub_list li a i{
    position:absolute;
    left:20px;
    top:18.5px;
    width:28px;
    height:28px;
    background:url("../images/icon_video.png") no-repeat center;
    background-position:0 0;
}
.sub_list li:hover i{
    background-position:0 -28px;
}
.sub_list li a p{
    width:100%;
    padding:0 170px 0 60px;
    overflow:hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.sub_list li a .study_btn{
    position:absolute;
    top:12.5px;
    right:20px;
    width:120px;
    line-height:36px;
    border:2px solid #fb5323;
    border-radius:36px;
    color:#fb5323;
    font-size:15px;
    text-align: center;
    transition:all .5s;
    overflow:hidden;
}
.sub_list li .study_btn:hover{
    background:#fb5323;
    color:#fff;
}
/*课程目录 end*/

/*知识图谱、学习笔记 start*/
.biji_list{
    width:100%;
    padding:20px 20px 5px;
    overflow:hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.biji_list li{
    position:relative;
    width:100%;
    background:#fff6f4;
    border-radius:8px;
    padding:15px;
    margin-bottom:15px;
    overflow:hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.biji_list img{
    position:absolute;
    left:15px;
    top:50%;
    transform:translate(0,-50%);
    width:40px;
}
.biji_list h2{
    width:100%;
    line-height:40px;
    font-size:16px;
    padding:0 230px 0 45px;
    overflow:hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.biji_list span{
    position:absolute;
    right:160px;
    top:50%;
    transform:translate(0,-50%);
    color:#777;
    font-size:14px;
    line-height:35px;
    cursor:pointer;
}
.biji_list span i{
    float:right;
    width:24px;
    height:24px;
    background:url(../images/icon_shoucang1.png) no-repeat center;
    background-size:cover;
    margin-top:5px;
}
.biji_list span i.sel{
    background:url(../images/icon_shoucang2.png) no-repeat center;
    background-size:cover;
}
.biji_btn{
    position:absolute;
    right:15px;
    top:50%;
    transform:translate(0,-50%);
    width:120px;
    line-height:40px;
    background:#fb5323;
    border-radius:40px;
    color:#fff;
    text-align:center;
    transition:all .3s;
    overflow:hidden;
}
.biji_btn:hover{
    color:#fff;
    opacity:0.8;
}
/*知识图谱、学习笔记 end*/

/*相关课程 start*/
.tea_item{
    padding:0 25px 25px; 
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.tea_item li{
    border-bottom:1px dashed #ddd;
    border-radius:0;
    margin:0;
}
.tea_item li:last-child{border:0;}
.tea_item .t_left{ left:0;}
/*相关课程 end*/

/*专家简介 start*/
.teacher_box{
    width:100%;
    padding:40px;
    overflow:hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.teacher_box img{
    float:left;
    width:220px;
    border-radius:6px;
}
.teacher_nav{
    position:relative;
    float:right;
    width:calc(100% - 250px);
    padding:25px 0;
    overflow:hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.teacher_nav h1{
    display:inline-block;
    line-height:40px;
    background:#fb5323;
    border-radius:5px;
    color:#fff;
    font-size:18px;
    padding:0 25px;
    text-align: center;
}
.teacher_nav p{
    line-height:30px;
    background:#fff6f4;
    border-radius:6px;
    color:#333;
    padding:15px 20px;
    text-align: justify;
    margin-top:25px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
/*专家简介 end*/

.test_list{ margin:0 auto;}
/* ::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px;
}
::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: rgba(0,0,0,.5);
    -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
} */
/****************课程信息概览 end**************/