* { margin: 0px; padding: 0px; }
body {background: #003e33 url("../images/banner.png") center top no-repeat; -webkit-text-size-adjust: none; font-family: "Microsoft YaHei", "PingFang SC",Arial, "Helvetica Neue", Helvetica, STHeiTi, sans-serif;}
html {min-width: 1200px; }
.wraper {width: 100%;margin: 0 auto;min-width: 1200px}
.wrap {width: 1200px; margin: 0px auto; }
.fl {float: left; }
.fr {float: right; }
dl, dt, ul { list-style: none; text-decoration: none; padding-inline-start: 0px; }
a {text-decoration: none; color: #333;}
.clearfix::before, .clearfix::after { content: ""; display: table; clear: both; }
.un {transition: all 0.3s ease-out 0s; }
.none {display: none; }
.ellipsis {text-overflow: ellipsis;white-space: nowrap; overflow: hidden}

.logo{margin-top: 30px; margin-left: 10px;}
.title{margin-top: 34px;margin-bottom: 0px;x;text-align: center;}
.tit{text-align: center; color: #fff; font-size: 28px; height: 50px; line-height: 25px; font-weight: bold;}
.tit1{background: url(../images/tit1.png) center no-repeat;}
.tit2{background: url(../images/tit2.png) center no-repeat;}
.introduce .box{background: url(../images/bg1.png) center no-repeat;height: 106px;box-sizing: border-box;padding: 14px 24px 0;color: #fff;margin-top: 25px;font-size: 14px;}
.introduce .box p{line-height: 24px;margin-bottom: 0px;}
.famous{margin-top: 50px;}
.famous ul{margin-top: 30px;}
.famous ul li{background: url(../images/bg2.png) center no-repeat; width: 274px; height: 280px; margin-right: 30px; box-sizing: border-box; padding: 35px 20px 0 25px; font-size: 14px; color: #fff;}
.famous ul li h2{color: #fbe494;font-size: 34px;font-weight: bold;text-align: center;position: relative;left: -5px;}
.famous ul li h3{text-align: center; margin-top: 35px; margin-bottom: 25px; font-size: 20px;}
.famous ul li p{ line-height: 20px; opacity: .9;}
.famous ul li:nth-child(4){margin-right: 0;}

.howFamous img.un{position: absolute; z-index: 1; top: -15px;}
.howFamous .linear{background: url(../images/li1.png) center no-repeat;width: 583px;height: 115px;position: relative;z-index: 100;box-sizing: border-box;padding: 27px 20px 0;color: #fff;font-size: 14px;}
.howFamous .linear.linear1{background: url(../images/li3.png) center no-repeat;}
.howFamous .linear h2{font-size: 22px;margin-bottom: 5px;}
.howFamous .linear h2 img{margin-right: 6px;}
.howFamous ul{margin-top: 25px;}
.howFamous ul li{margin-right: 34px;position: relative;margin-top: 20px;}
.howFamous ul li:nth-child(2n){margin-right: 0;}
.howFamous ul li:hover img.un{z-index: 200; top: -20px;}
.howFamous ul li:hover .linear{transform: translateY(-2px);}

.themes{margin-top: 50px;}
.themes ul{margin-top: 40px;}
.themes li{width: 270px;height: 376px;box-sizing: border-box;padding: 40px 20px 0;background: url(../images/li2.png) center no-repeat;text-align: center;margin-right: 30px;}
.themes li h2{margin-top: 8px; margin-bottom: 25px; color: #fbe494; font-size: 22px;}
.themes li p{text-align: left; color: rgba(255,255,255,.8); font-size: 14px; line-height: 22px;}

.themes li:hover{-webkit-animation:swing 1s .2s ease both;-moz-animation:swing 1s .2s ease both;}
@-webkit-keyframes swing {
20%, 40%, 60%, 80%, 100% {
-webkit-transform-origin:top center
}
20% {
-webkit-transform:rotate(7deg)
}
40% {
-webkit-transform:rotate(-5deg)
}
60% {
-webkit-transform:rotate(2deg)
}
80% {
-webkit-transform:rotate(-2deg)
}
100% {
-webkit-transform:rotate(0deg)
}
}
@-moz-keyframes swing {
20%, 40%, 60%, 80%, 100% {
-moz-transform-origin:top center
}
20% {
-moz-transform:rotate(7deg)
}
40% {
-moz-transform:rotate(-5deg)
}
60% {
-moz-transform:rotate(2deg)
}
80% {
-moz-transform:rotate(-2deg)
}
100% {
-moz-transform:rotate(0deg)
}
}

.guest{margin-top: 78px;}
.guest ul{margin-top: 34px;background: url(../images/circle.png) left top no-repeat;padding-bottom: 40px;}
.guest ul li{padding-bottom: 40px;}
.guest .time{color: #fff;font-size: 24px;margin-left: 58px;}
.guest .content{background: url(../images/content.png) bottom right no-repeat;height: 346px;position: relative;padding-left: 323px;padding-top: 100px;box-sizing: border-box;margin-top: 30px;}
.guest .content .teacher{position: absolute;left: 40px;top: -17px;}
.guest .left a{background: url(../images/guankan.png) center no-repeat; position: absolute; width: 118px; height: 33px; line-height: 33px; text-align: center; font-size: 16px; color: #fff; top: 275px; left: 100px; cursor: pointer;}
.guest .left a:hover{animation-name: pulse;
	-webkit-animation-name: pulse;	
	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;}
@keyframes pulse {
	0% {
		transform: scale(0.95);
		opacity: 0.7;		
	}
	50% {
		transform: scale(1);
		opacity: 1;	
	}	
	100% {
		transform: scale(0.95);
		opacity: 0.7;	
	}			
}
@-webkit-keyframes pulse {
	0% {
		-webkit-transform: scale(0.95);
		opacity: 0.7;		
	}
	50% {
		-webkit-transform: scale(1);
		opacity: 1;	
	}	
	100% {
		-webkit-transform: scale(0.95);
		opacity: 0.7;	
	}			
}
.guest .right{width: 760px; color: #fff;}
.guest .right .name{font-size: 30px;}
.guest .right p{opacity: .8; font-size: 14px; margin-top: 15px; margin-bottom: 15px;}
.guest .right .name span{font-size: 20px; font-weight: normal; margin-left: 25px;}
.guest .right img{display: block; margin-bottom: 10px;}
.guest .right h2{font-size: 20px; opacity: .98; line-height: 30px;}

.map{background:url(../images/map.png) center no-repeat; height: 330px; margin-top: 30px; box-sizing: border-box; padding-left: 650px; padding-top: 40px;}
.map .numb{font-size: 14px; width: 20px; height: 20px; line-height: 20px; border-radius: 50%; background-color: #1fa390; color: #fff; text-align: center; margin-right: 10px; position: relative; top: 3px;}
.map .clearfix{margin-bottom: 20px; color: #fff; line-height: 24px; font-size: 18px;}