
a {
    text-decoration: none;
    color: currentColor;
    font-size: 100%;
}

a:hover {
    text-decoration: none;
    color: #428bc9
}

.wrap {
    margin: 0 auto;
    width: 1205px;
    min-height: 650px;
}
.overflow {
    overflow: hidden;
}
.list-main {
    float: right;
    width: 100%;
}
.list-main-inner {
    margin-top: 18px;
}
.header-menu {
    border-radius: 5px 5px 4px 4px;
    margin-bottom: 20px;
    width: 1205px;
    position: relative;
    border: 1px solid #eee;
    overflow: hidden;
}
.letter-spacing {
    margin: 0 10px;
    border-bottom: 1px dotted #e3e3e3;
}
.letter-spacing:last-child{
    border-bottom: 0;
}
.letter-spacing a {
    /* padding-right: 2%; */
    display: inline-block;
    text-align: center;
    padding: 1rem 1.8rem;
    line-height: 1;
    border-radius: 5px;
    box-sizing: content-box;
    margin: 5px 0;
}
.category_images {
    float: left;
    padding-right: 25px;
    padding-left: 3px;
    border-radius: 5px 5px 4px 4px;
    overflow: hidden;
    width:487px;height:245px
}
.category_images img {
    width:487px;height:245px;
}
.category-shadow {
    /* height: 20.4rem; */
    height: 245px;
    box-shadow: 3px 3px 10px 3px #d4d4d4;
}
.list-course {
    margin-right: -20px;
}
.course-item a {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
}

.course-item a:after {
	content: " ";
	position: absolute;
	left: 6px;
	top: 6px;
	width: 212px;
	height: 128.88px;
	background: rgba(0,0,0,0.6) url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNTU4NTkwNDE4MjA5IiBjbGFzcz0iaWNvbiIgc3R5bGU9IiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjUzOTUiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNTAiIGhlaWdodD0iNTAiPjxkZWZzPjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PC9zdHlsZT48L2RlZnM+PHBhdGggZD0iTTUxMS40NTYgMC42NEMyMjkuNjY0IDAuNjQgMC40MTYgMjI5LjkyIDAuNDE2IDUxMS42OGMwIDI4MS44MjQgMjI5LjI0OCA1MTEuMDQgNTExLjA0IDUxMS4wNCAyODEuNzkyIDAgNTExLjA0LTIyOS4yMTYgNTExLjA0LTUxMC45NzZDMTAyMi40OTYgMjMwLjAxNiA3OTMuMjggMC42NCA1MTEuNDU2IDAuNjR6IG0wIDk0OS4wMjRjLTI0MS4zNDQgMC00MzcuOTUyLTE5Ni42NzItNDM3Ljk1Mi00MzcuOTUyIDAtMjQxLjMxMiAxOTYuNjA4LTQzNy45NTIgNDM3Ljk1Mi00MzcuOTUyIDI0MS4zMTIgMCA0MzcuOTIgMTk2LjYwOCA0MzcuOTIgNDM3Ljk1MiAwIDI0MS4zMTItMTk2LjYwOCA0MzcuOTItNDM3LjkyIDQzNy45MnoiIHAtaWQ9IjUzOTYiIGZpbGw9IiNmZmZmZmYiPjwvcGF0aD48cGF0aCBkPSJNMzcwLjg4IDY1Ny4yMTZjMCA0MC40NDggMjguNDE2IDU2Ljc2OCA2My4yIDM2Ljg5NmwyNTEuMjY0LTE0NS41MDRjMzQuNzg0LTE5Ljg0IDM0Ljc4NC01My4yMTYgMC03My4xMmwtMjUxLjI2NC0xNDUuNDcyYy0zNC43ODQtMTkuODcyLTYzLjE2OC0zLjU1Mi02My4xNjggMzYuODk2djI5MC4zMDR6IiBwLWlkPSI1Mzk3IiBmaWxsPSIjZmZmZmZmIj48L3BhdGg+PC9zdmc+) no-repeat center;
	opacity: 0;
	transition: all .5s;
}

.course-item a:hover:after {
	opacity: 1
}

.course-item a:hover h4 {
	color: #c34
}

.clearfix .course-item:hover {
	box-shadow: 0 0 0 1px #aaa !important;
}

.list-course .clearfix .course-item:hover:hover {
	box-shadow: 0 0 0 1px #ddd;
}

.course-item {
	width: 225px;
	float: left;
	margin: 0px 18px 20px 1px;
	position: relative;
	z-index: 10;
	box-shadow: 0 0 0 1px #d4d4d4;
	border-radius: 5px 5px 4px 4px;
	overflow: hidden;
	border-bottom: 1px solid #eee;
	height: 245px;
	background-color: #fff;
	box-sizing: border-box;
}
.course-item .course-item-cover img {
	width: 225px;
	height: 141.88px;
	display: block;
	border-radius: 5px 5px 0 0;
	padding: 6px;
	box-sizing: border-box;
}
.course-item .course-item-info span{
	color: #d25;
	font-size: 15px;
	display: block;
	font-family: Arial,sans-serif;
	/*margin: 9px 8px 0;*/margin: 9px 11px 0;
	line-height: 1;
}
.course-item .course-item-info span i{
	font-style: normal;
	color: #aaa;
	float: right;
	line-height: 1;
	margin-right: 9px;
    font-size: 12px;
}
/*.course-item{width: 225px;float: left;margin: 0 20px 20px 0;position: relative;z-index: 10;}*/
.course-item:hover{box-shadow: 0 2px 8px 0 rgba(0,0,0,.04);}
.course-item .course-item-cover{position: relative;}
/*.course-item .course-item-cover img{border-top-left-radius: 12px;border-top-right-radius: 12px;width: 225px;}*/
.course-item .course-item-cover .course-item-shade{position: absolute;bottom: 0;left: 0;width: 100%;height: 100%;opacity: 0;transition: opacity,.18s;background-color: transparent;/*background-image: linear-gradient(transparent 60%,rgba(0,0,0,.8) 100%);*/}
.course-item .course-item-cover .course-item-shade span{position: absolute;bottom: 0;width: 100%;padding: 5px 10px;text-align: right;color: #fff;font-size: 12px;}
.course-item:hover .course-item-cover .course-item-shade{opacity: 1;}

/*.course-item .course-item-info{border:1px solid #eee;border-top: none;}*/

.course-item .course-item-title{padding: 10px 10px 0px;height: 60px;overflow: hidden;}
.course-item .course-item-title h4 a{color: #333;display: block;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;max-height: 40px\0;}
.course-item .course-item-title h4 a:hover{color: #428bca;}
.course-item .course-item-data{border-top: 1px solid #eee;color: #999;overflow: hidden;margin: 0 20px;height: 46px;line-height: 46px;}
.course-item .course-item-data span{display: block;border-left: 1px solid #eee;font-size: 12px;}
.course-item .course-item-data span:first-child{border-left: none;}
.course-item .course-item-data span b{font-size: 14px;color: #222;}

.course-item .course-item-data .free{float: left;padding-right: 10px;width: 45%;}
.course-item .course-item-data .price{float: right;font-size: 20px;color: #00b76f;width: 55%;text-align: right;}
.course-item .course-item-data .price span{display: block;}
.course-item .course-item-data .price sub{font-size: 12px;bottom: 0;}
.course-item .course-item-data .price b{font-size: 12px;color: #00b76f;}

.course-item .course-item-price{overflow: hidden;padding: 10px 20px;border-top: 1px solid #eee;display: none;}
.course-item .course-item-price span{display: block;}
.course-item .course-item-price .name{float: left;width: 40%;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
.course-item .course-item-price .views{float: right;width: 60%;text-align: right;font-size: 12px;color: #999; white-space: nowrap;}
.course-item .course-item-price .views b{font-size: 14px;}

.course-item .course-item-data{font-family: 'dinregular', 'Microsoft Yahei', sans-serif;}

.cs-label{background-color: #ec5a12;color: #fff;padding: 2px 10px;position: absolute;top: 0px;left: -4px;box-shadow: 1px 2px 3px rgba(0,0,0,0.25);z-index: 100;}
.cs-label:after{position: absolute;left: 0px;top: -6px;border-width: 3px 2px;border-style: solid;border-color: rgba(0, 0, 0, 0) #f47d43 #f47d43 rgba(0, 0, 0, 0);content: "";width: 0;height: 0;}

.course-item-title h4{font-size: 14px;line-height: 23px;overflow: hidden;margin:0;}
.category-active {
    border: 1px solid #428bca;
    color: #428bca !important;
}