html,body{background-color: #f5f5f5;}
.c-navbar{box-shadow: 0 0 8px rgba(0, 0, 0, 0.16);z-index: 1000;position: relative;}
.course-cate {margin-bottom: 10px;}
.course-cate>ul{border-bottom: 1px solid #dcdcdc;}
.course-cate>ul li{display: inline-block;margin-right: 40px;font-size: 16px;font-weight: bold;line-height: 35px;padding: 10px 0;color: #333;}
.course-cate>ul li .cate-box{display: none;}
.course-cate>ul li .icon{font-size: 18px;}

.course-cate>ul li .cate-box{
    position: absolute;margin-top: 8px;background: #fff;z-index: 100;
    box-shadow: 0 2px 5px rgba(0,0,0,.1);padding: 15px;
}
.course-cate>ul li .cate-box:before {
    content: " ";width: 15px;height: 15px;background: #fff;position: absolute;top: -8px;left: 45px;box-shadow: 0 1px 2px rgba(0,0,0,.05);
    transform:rotate(135deg);
}
.course-cate>ul li .cate-box dl{position: relative;margin-bottom: 15px;}
.course-cate>ul li .cate-box dl dt{position: absolute;left: 0;top: 2px;}
.course-cate>ul li .cate-box dl dt a{font-size: 14px;font-weight: bold;}
.course-cate>ul li .cate-box dl dd{margin-left: 130px;max-width: 460px;line-height: 26px;}
.course-cate>ul li .cate-box dl dd a{font-size: 12px;white-space:nowrap;display: inline-block;}
.course-cate>ul li .cate-box dl dd a:after{content:" | ";display: inline-block;margin-left: 10px;margin-right: 5px;}
.course-cate>ul li .cate-box dl dd a:hover:after{color: #333;}
.course-cate>ul li .cate-box dl dd a:last-child:after{content:"";margin:0;}
.course-cate>ul li .cate-box dl:last-child {margin-bottom: 0;}

.course-cate>ul li.active .cate-box{display:block;}
.course-cate>ul li.active>a,
.course-cate>ul li.active>a:visited,
.course-cate>ul li.active>a:focus{color: #ff783c;}

.course-cate>ul li a:hover{color: #ff783c;}

.course-menu-tab{padding: 15px 0;z-index: 100;background-color: #f5f5f5;}
.course-menu-tab>a {padding: 2px;border-bottom: 2px solid transparent;margin-right: 20px;}
.course-menu-tab>a.active{color: #ff783c;border-bottom: 2px solid #ff783c;}
.course-menu-tab .pull-right{color: #40c78d;}

.course-list-new {padding-top: 10px;}
.course-list-new ul {margin-right: -20px;}
.course-list-new ul li{width: 285px;margin-bottom: 20px;position: relative;display: inline-block;margin-right: 20px;}
.course-list-new ul li a{color: #333;display: block;height: 320px;background: #fff;border-radius: 0 0 6px 6px;}
.course-list-new ul li a img{width:285px;height: 214px;display:block;}
.course-list-new ul li a h3{height: 35px;line-height: 35px;font-size: 16px;margin-top: 5px;padding: 0 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.course-list-new ul li a p{padding:5px 10px 0;font-size:12px;color: #999;}
.course-list-new ul li a p .icon{font-size: 12px;}
.course-list-new ul li a p .price-span{float: right;}
.course-list-new ul li a p .price-span.free{color:#40c78d;}
.course-list-new ul li a p .price-span.credit{color:#e85308;}
.course-list-new ul li a p .price-span.money{color:#e85308;}

.course-list-new ul li a .course-num{position: absolute;top: 185px;color: #fff;background: rgba(0,0,0,.5);padding: 2px 7px; border-radius: 20px;font-size: 12px;left: 10px;}

.course-list-new ul li a:hover{box-shadow: 0 2px 10px rgba(0,0,0,.08);}
.course-list-new ul li a:hover h3{color: #ff783c;}

.c-listpage{margin: 15px 0 20px;}