*{padding:0px; margin:0px; }
a{ text-decoration:none;}
li{list-style-type:none;}

.main{width:100%; margin:0px auto; height:auto; background:skyblue; float:left }
.main-left{width:300px; height:680px; background:#fff; float:left; margin-top:50px; margin-bottom:30px; box-shadow:2px 2px 5px 5px rgba(0,0,0,0.1);
}
.main-left h1{font-size:22px;  
color:#fff; 
font-family:微软雅黑;
 background:#06F;
 padding:5px 8px;
  letter-spacing:0.5px;
  -webkit-transition: all .3s ease-in-out .1s;
	-moz-transition: all .3s ease-in-out .1s;
	transition: all .3s ease-in-out .1s;

}

.hot-class{width:90%; height:210px; margin:30px auto;  background:#f3f3f3; border:1px solid #999 ; padding:8px 5px; position:relative; 
-webkit-transition: all .3s ease-in-out .1s;
	-moz-transition: all .3s ease-in-out .1s;
	transition: all .3s ease-in-out .1s;}

.hot-class:hover{transform: translateY(-5px); background:#06a3e8;}

.hot-class img{	transition: all 1s; overflow:hidden; margin-top:5px; margin-left:10px; width:250px; height:175px;}
.hot-class:hover img{transform:scale(1.1);}


.hot-class  span{font-size:16px; font-family:微软雅黑; color:#333; font-weight:normal; line-height:45px; margin-left:6px; display:block;
-webkit-transition: all .3s ease-in-out .1s;
	-moz-transition: all .3s ease-in-out .1s;
	transition: all .3s ease-in-out .1s;}

.hot-class:hover span{ color:#f1f1f1;}


.hot-class a{ color:#f5f5f5; opacity:0.7; border:thick 1px; background:#006; font-size:12px; display:block; height:22px; width:58px; text-align:center; border-radius:8px; line-height:22px; position:absolute; right:15px; bottom:3px;}

.hot-class:hover a{background-color: #fff; color:#222;
}


.main-right{ width:880px; float:right; height:1286px; background:
url(../images/class_bg1.png) no-repeat; background-position:bottom center; background-size:100%;margin-top:50px; box-shadow:2px 2px 5px 5px rgba(0,0,0,0.1);} 
.main-right ul{width:100%; height:360px; margin:30px auto; text-align:center; }
.main-right h1{font-size:26px; background:#06F; width:100%; height:37px; text-align:center;color:#fff; line-height:37px;}
.teacher{width:260px;height:386px; margin:10px auto; border:1px solid #999;border-radius:6px;line-height:28px;text-align:center; display:block; float:left; padding:0px 5px; margin-left:16px;  background:#f3f3f3; position:relative;transition:0.7s;}
.main-right ul{float:left; margin:23px auto}
.teacher img{width:180px; margin-top:10px; border-radius:10px; border:1px solid #999;}
.teacher:hover{background:rgba(166,234,214,0.7);}
.teacher h2{font-size:16px; font-weight:normal; text-align:center;}

.teacher p{ font-size:14px; font-family:微软雅黑; text-indent:6px; line-height:22px;}
.teacher a{color:#fff; display:block; background:#06F; height:20px; line-height:20px; border-radius:8px; text-align:center; width:85px; margin:auto; margin-top:8px; position:absolute; bottom:8px; left:88px;transition:0.7s;}
.teacher a:hover{ background:#1C53D5; cursor:pointer;text-decoration:underline; transition:0.7s; }