@font-face{
	font-family:"Microsoft YaHei";
	src:url("./font/chinese.msyh.ttf");
}
@font-face{
	font-family:"Gill Sans MT Bold";
	src:url("./font/ufonts.com_gill-sans-mt-bold.ttf");
}
@font-face{
	font-family: "SimSum";
	src:url("./font/SIMSUN.ttf");
}

html, body, .main{
	padding: 0;
	margin: 0;
	height: 100%;
	min-width: 1205px;
}

/*顶部提醒*/
.m-top .top_reminder{ 
	width: 100%;
	height: 35px; 
	background-color: #F0F0F0;
	color: #484848; 
	font-size: 12px;
}
.m-top .top_reminder span{
	display: inline-block;
	height: 35px;
	line-height: 35px;
	margin-right: 10px;
}
.m-top #left_reminder{
	margin-left:7%;
	display: inline-block;
}
.m-top #close{
	display: inline-block;
	float: right;
	margin-right: 9%;
}
.m-top #close:hover{
	cursor: pointer;
}
.m-top #close div:first-child{
	background: url(./image/icon-sprite.png) no-repeat -8px -90px;
	height: 15px;
    width: 15px;
    display: inline-block;
}

/*顶部导航栏*/
.m-nav{
	width: 100%; 
	/*margin-top: 20px;*/
	height: 20px; 
	font-size: 22px; 
	font-family: "Microsoft YaHei"; 
	line-height: 20px; 
}
.m-nav .left{ 
	float: left; 
	margin-left: 7%; 
}
.left_title{ 
	display: inline-block; 
	vertical-align: text-bottom; 
	margin-bottom: 0; 
}
.title_EDU{ 
	font-family: "Gill Sans MT Bold"; 
	font-size: 28px; 
	color:#439326; 
	border-right: 1px solid #439326; 
	padding-right:10px; 
}
.m-nav .title_text{ 
	color: #333333; 
}
.m-nav .focus { 
	width: 56px; 
	height: 23px; 
	background-color: #459947; 
	border: none; 
	margin-left:20px; 
	color: white; 
}
.m-nav .focus:hover{ 
	background-color: #4DAA46; 
	cursor: pointer;
}

.m-nav .after_focus{
	width: 113px;
	height: 28px;
	display: none;
	padding: 2px;
	background-color: #F6F6F6;
	/*position: relati?ve;*/
	margin-left: 10px;
	line-height: 22px;
	vertical-align: middle;
	font-size: 0;
	border:1px solid #EDEDED;
	text-align: center;
	box-sizing: border-box;
}

.m-nav .after_focus img{
	height: 13px;
	width: 13px;
	display: inline-block;
	float: left;
	margin-top: 1px;
	vertical-align: middle;
}
.m-nav .after_focus div{
	height: 22px;
	line-height: 22px;
	width: 40px;
	display: inline-block;
	font-size: 12px;
	vertical-align: middle;
	text-align: center;
	box-sizing: border-box;
	/*color: #D7D7D7;*/
}
.m-nav .after_focus div:last-child{
	vertical-align: middle;
	line-height: 22px;
	height: 22px;
	color: #9C9C9C;
	border-left: 1px solid #D7D7D7;
	margin-left: 3px;
}
.m-nav .after_focus div:last-child:hover{
	text-decoration: none;
	color: #479E53;
	cursor: pointer;
	
}

.m-nav .title_fans{ 
	font-family: "SimSum"; 
	font-size: 12px; 
	color: #535353; 
	margin-left: 15px; 
}
.m-nav .right{ 
	float: right; 
	margin-right: 9%; 
	margin-top: 12px;
}
.m-nav .right_title { 
	display: inline-block; 
	font-size: 16px; 
	margin-left: 50px; 
	vertical-align: text-bottom;
}
.m-nav .menu a{
	color: #666666; 
	text-decoration: none;
}
.m-nav .menu a:hover{
	color: #439326; 
}
.m-nav .search{ 
	height:20px; 
	width: 20px; 
	background: url(./image/search_icon.png) no-repeat 0 0; 
	margin-left: 30px;
}

.m-nav .box-login{
	display: none;
	margin:auto;
	position: absolute;
	top: 945px;
	left: 0;
    right: 0;
    bottom: 0;
    width: 388px;
    height: 290px;
    background:white;
    z-index: 1001;
}

.m-nav .box-login div:first-child{
	color: #575757;
	font-size: 18px;
	font-family: "'Microsoft YaHei';";
	width: 132px;
	height: 18px;
	margin:30px 0 7px 40px;
	display: inline-block;
}

.m-nav .box-login input{
	width: 295px;
	height: 45px;
	background-color: #F9F9F9;
	border: 1px solid #D7D7D7;
	display: block;
	margin-top:13px;
	margin-left: 47px;
	color: #D7D7D7;
	padding-left: 8px;
	box-sizing: border-box;
}

.m-nav #js-open-login{
	width: 295px;
	height: 46px;
	display: block;
	background:url(./image/login-button.png);
	margin-top:23px;
	margin-left: 47px;
}

/*轮播图*/
.m-banner{
	margin-top: 60px; 
	height: 460px; 
	width: 100%; 
	/*vertical-align: top; */
}
/*#imgwrap{
	height: 460px;
	width: 100%;
}*/

.slider_pic{
	position: absolute;
	width: 100%;
	height: 460px;
	-webkit-transition: opacity 0.5s linear;
	-moz-transition: opacity 0.5s linear;
	-o-transition: opacity 0.5s linear;
	transition: opacity 0.5s linear;
	opacity:0;
	display: inline-block;
	z-index: 1;
}

@media screen and (max-width: 1205px) {
	 .slider_pic{
		width: 1205px;
	}
}

.m-banner .slider_pic:hover{
	cursor: pointer;
}
.m-banner #pic1{
	background: url(./image/banner1.jpg) no-repeat;
	background-position: center;
}
.m-banner #pic2{
	background: url(./image/banner2.jpg) no-repeat;
	background-position: center;
}
.m-banner #pic3{
	background: url(./image/banner3.jpg) no-repeat;
	background-position: center;
}

.m-banner .fadein{
	opacity: 100;
	filter: alpha(opacity=100);
	z-index: 100;

}

.m-products{ 
	margin-top: 54px;
	width: 100%;
	height: 228px; 
	text-align: center;
}

.m-products .three_courses{
	height: 183px;
	width: 343px;
	display: inline-block;
	font-family: 'Microsoft YaHei';
	text-align: left;
}

.m-products #cloud_course{
	margin: 0 3%;
}

.m-products .course_icon{
	width: 80px;
	height: 183px;
	float: left;
	margin-right: 18px;
	display: inline-block;
}

.m-products .course_title{
	font-size: 22px;
	font-weight: bold; 
}

.m-products .course_body{
	font-size: 14px;
	margin-top: 15px;
}

.m-products .course_more{
	font-size: 14px;
	margin-top: 28px;
}


.m-products #public_course .course_icon{
	margin-top: 15px;
	background: url(./image/public_course.png) no-repeat top;
}

.m-products #cloud_course .course_icon{
	margin-top: 15px;
	background: url(./image/cloud_course.png) no-repeat top;
}

.m-products #MOOC .course_icon{
	margin-top: 15px;
	background: url(./image/MOOC.png) no-repeat top;
}

.m-environment{ 
	height: 220px;
	width: 100%;
	text-align: center;
}

.m-environment .work{
	width: 19%;
	height: 220px;
	display: inline-block;
}

.m-environment #work01{
	background: url(./image/gym.png) no-repeat center;
}

.m-environment #work02{
	background: url(./image/discussion.png) no-repeat center;
}

.m-environment #work03{
	background: url(./image/readroom.png) no-repeat center;
}

.m-environment #work04{
	background: url(./image/photography.png) no-repeat center;
}

.m-environment #work05{
	background: url(./image/foods.png) no-repeat center;
}


@media screen and (max-width: 1205px) {
	.work{
		/*width: 319px;*/
		width: 24%;
	}

	#work01, #work05{
		width: 12%;
		height: 220px;
	}

}



.m-MainContent{ 
	/*top: 1102px;*/ 
	width: 100%;
	height: 1345px;
	background-color: #F6F6F6;
	 
}

.m-MainContent .side_bar{
	/*position: relative;*/
	float: right;
	margin-right: 100px;
	width: 227px;
	height: 1080px;
	/*background-color: yellow;*/
	padding-top: 78px;
}

.m-MainContent .courses{
	width: 1000px;
	height: 1242px;
	padding-top: 78px;
	/*background-color: red;*/
	margin:0 2%;
}


.m-MainContent .tab{
	width: 500px;
	height: 55px;
	font-size: 0;
}

.m-MainContent .tab:hover{
	cursor: pointer;
}


.m-MainContent .tab>div{
	width: 200px;
	height: 55px;
	text-align: center;
	display: inline-block;
	font-family: 'Microsoft YaHei';
	font-size:20px;
	color: #535353;
	line-height: 55px;
	background-color: white;
	border-style: outset;
	border-width: 0px 1px 2px 0px;
	border-color: #E5E6E7;
	border-style: solid;
}



.m-MainContent #left_tab{
	background-color: #439326;
	color: white;
}


.overlay{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,.8);
    z-index: 1000;
}
.m-video .box-video{
    display: none;
    margin: auto;
    position: absolute;
    top: 1845px;
    left: 0;
    right: 0;
    bottom: 0;
    width: 940px;
    height: 670px;
    background: #fff;
    z-index: 1001;
}

 .m-video:hover{
	border: 1px solid #E1E1E1;
	box-sizing: border-box;
	/*height: 281px;*/
}

.m-video{
	margin-bottom: 20px;
}

 .m-video #close-video,.m-nav #close-login{
	background: url(./image/videopicclose.png) no-repeat;
	width: 18px;
	height: 18px;
	float: right;
	margin-right: 30px;
	margin-top: 10px;
	display: inline-block;
}
 .m-video #close-video:hover, .m-nav #close-login:hover{
	cursor: pointer;
}

.m-video #js-open-video:hover, .m-nav #js-open-login:hover{
	cursor: pointer;
}

 .sidebar-title{
	border-bottom: 1px solid #E1E1E1;
	background-color: white;
	padding-left: 20px;
	font-size: 16px;
	font-family: "'Microsoft YaHei';";
	color: #2B2B2B;
	height: 55px;
	line-height: 55px;
	font-weight: bold;
}
 .m-video .sidebar-subtitle{
	border-top: 1px solid #E1E1E1;
	/*width: 175px;*/
	height: 225px;
	background-color: white;
	box-sizing: border-box;
}

 .m-video .sidebar-subtitle div{
	font-size: 14px;
	padding-left: 20px;
	padding-top: 20px;
	/*width: 185px;
	height: 50px;*/
}


 .m-hot_courses #HotCourse{
	height: 725px;
	font-size: 0;
	border-top: 1px solid #E1E1E1;
	/*padding-left: 20px;*/
	background-color: white;
}



 .m-hot_courses:hover{
	border: 1px solid #E1E1E1;
	box-sizing: border-box;
}

  .HotCourseContent{
	width: 122px;
	height: 50px;
	display: inline-block;
	margin-left: 12px;
	font-size: 14px;
	/*margin-top: 20px;*/

}

  .eachHotCourse{
	margin-top: 20px;
	margin-left: 20px;
}

  .HotCoursePhoto{
	display: inline-block;
	float: left;
	height: 50px;
	width: 50px;
}

  .HotCourseName{
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	height: 20px;
	width: 122px;
	margin-bottom: 10px;
	/*padding: 0;*/
}
  .HotCourseLearner{
	height: 15px;
	font-size: 0;
}

  .learnerNumHot{
	width: 80px;
	height: 15px;
	line-height: 15px;
	font-size: 14px;
	color: #8A8D9F;
	display: inline-block;
	margin-left: 2px;
	vertical-align: middle;
}

.learnerImg{
	vertical-align: middle;
}

.course_list{
	/*width: %;*/
	/*width: 1100px;*/
	width: 100%;
	height: 1100px;
	/*background-color: blue;*/
}

 .page{
	width: 303px;
	height: 20px;
	float: right;
	margin: 0 150px 0 0;
}
 .page div{
	display: inline-block;
	height: 20px;
	width: 20px;
	vertical-align: middle;
	text-align: center;
	line-height: 20px;
	margin: 0 4px;
}

 .page div:first-child, .page div:last-child{
	height: 20px;
	width: 30px;
}

 .page div:hover{
	background-color: #8DD2A1;
	color: white;
	cursor: pointer;
}

 #pageSelected{
	color: #8DD2A1;
}

 #pageSelected:hover{
	color: white;
	cursor: pointer;
}



@media screen and (max-width: 1205px) {
	.course_list{
		width: 65%;
	
	}
}

 .CourseLargeNode{
	margin-top: 20px;
	position: absolute;
	width: 420px;
	height: 320px;
	background-color: white;
	z-index: 10;
	border:2px solid #C8C7C8;
	display: none;
}

 .courseNode{
	display: inline-block;
	width: 100%;
	margin-right: 2%;
	margin-top: 20px;
}

 .courseNode:hover{
	border:1px solid #E1E1E1;
	cursor: pointer;
	color: #39a030;
}

.courseFont{
	font-family: "'Microsoft YaHei';";
	font-size: 12px;
	/*overflow: hidden;*/
	margin-left: 10px;
	/*height: 21px;*/
	text-overflow: ellipsis;
	width: 178px;
	overflow: hidden;
	white-space: nowrap;
	/*ellipisis*/
}
 .learners{
	height:12px;
	width: 40px;
	border: 1px solid #A7A7A7;
	font-size: 0;
	/*line-height: 10px;*/
	margin-left:  10px;
	color: #A7A7A7;
	/*text-align: center;*/
	vertical-align: middle;

}
.learnerNum{
	font-size: 10px;
	height: 12px;
	/*padding: 0;*/
	line-height: 12px;
	
	display: inline-block;
	margin-left: 2px;
}

.price{
	color: #E23528;
	font-size: 12px;
	margin-left: 10px;
}


.footer{ 
	height: 262px; 
	width: 100%;
	background-color: #2A333A;
	/*padding-left: 15%;
	padding-right: 15%;*/
	padding-top: 95px;
}

.footer_left{
	height: 90px;
	width: 396px;
	float: left;
	margin-left: 13%;
}

#footer_left_top{
	height: 25px;
	width: 240px;
}

#footer_left_top p{
	line-height: 25px;
	height: 25px;
}

#footer_left_top p:last-child{
	font-size: 22px;
	color: #439326;
	margin-left: 6px;
}

#footer_left_bottom{
	color: #9EA9AF;
	width: 400px;
	height: 40px;
	line-height: 30px;
	font-size: 13px;
	font-family: "SimSum";
	margin-top: 50px;
}

.footer_right{
	width: 407px;
	height: 105px;
	float: right;
	margin-right: 13%;
	/*vertical-align: middle;*/
	color: #9EA9AF;
	font-family: 'Microsoft YaHei';
	font-size: 0;
}

.footer_right a{
	color: #9EA9AF;
}

.footer_columns{
	display: inline-block;
	vertical-align: top;
	margin-left: 14%;
	font-size: 15px;
}

.footer_columns p:first-child{
	font-size: 13px;
}

.footer_columns p:hover{
	text-decoration: underline;
	cursor: pointer;
}

.footer_columns p:first-child:hover{
	text-decoration: none;
}

#footer_right_two img{
	height: 17px;
	width: 20px;
	display: inline-block;
	margin-left: 10px;
}

#with_picture{
	margin-top: 0;
	display: inline-block;
	vertical-align: top;
}