.showcase {
	width:1200px;
	height:100%;
	margin:0 auto;
	position:relative
}
.showleft {
	width:350px;
	height:420px;
	position:absolute;
	left:100px;
	top:50%;
	color:#999;
	margin-top:-220px
}

.bannernav {
	margin:50px 0 0 5px;
	overflow:hidden
}
.bannernav li {
	font-size:20px;
	color:#333;
	text-align:left;
	overflow:hidden;
	display:block;
	cursor:pointer
}
.bannernav li span {
	display:inline-block;
	padding:10px 7px 10px 11px;
	border-radius:4px
}
.bannernav li:hover {
	color:#cf0b23
}
.bannernav li.on span {
	background:#cf0b23;
	color:#fff;
	position:relative
}

.wechat {
	width:120px;
	height:141px;
	background:url(../images/wechat2_4524a6f.png) no-repeat;
	margin:60px 0 0 5px
}
.showright {
	width:272px;
	height:483px;
	padding:77px 69px 141px 60px;
	background:url(../images/phone_b04ec95.png) no-repeat;
	background-size:100% 100%;
	
	right:120px;
	float:right;
	bottom:30px;
	top:100px\9;
	bottom:0\9;
	overflow:hidden
}
.bannerbox {
	width:215px;
	height:382px;
	position:relative;
	overflow:hidden
}
.imgbox {
	width:1236px;
	height:100%;
	position:absolute;
	left:0;
	top:0
}
.imgbox div {
	width:215px;
	height:100%;
	float:left
}

.swiper-container {
	width:100%;
	height:100%
}
.swiper-container {
	margin:0 auto;
	position:relative;
	overflow:hidden;
	z-index:1
}
.center2 {
	width:945px;
	height:447px;
	position:absolute;
	top:50%;
	margin-top:-278px;
	margin-top:-228px\9;
	left:50%;
	margin-left:-472px
}



.s1.active .girl {
	opacity:1\9;
-webkit-animation:slideRight 1s ease-in forwards .3s;
-moz-animation:slideRight 1s ease-in forwards .3s;
-ms-animation:slideRight 1s ease-in forwards .3s;
-o-animation:slideRight 1s ease-in forwards .3s;
animation:slideRight 1s ease-in forwards .3s
}
.s1.active .toptit {
	opacity:1\9;
	-webkit-animation:slideLeft 1s ease-in forwards;
	-moz-animation:slideLeft 1s ease-in forwards;
	-ms-animation:slideLeft 1s ease-in forwards;
	-o-animation:slideLeft 1s ease-in forwards
}
.s1.active .callnum {
	opacity:1\9;
-webkit-animation:slideLeft 1s ease-in forwards .2s;
-moz-animation:slideLeft 1s ease-in forwards .2s;
-ms-animation:slideLeft 1s ease-in forwards .2s;
-o-animation:slideLeft 1s ease-in forwards .2s
}
.s1.active .wechatbox {
	opacity:1\9;
-webkit-animation:slideLeft 1s ease-in forwards .4s;
-moz-animation:slideLeft 1s ease-in forwards .4s;
-ms-animation:slideLeft 1s ease-in forwards .4s;
-o-animation:slideLeft 1s ease-in forwards .4s
}
.s2.active .title {
	opacity:0;
	opacity:1\9;
	-webkit-animation:ifadeIn 1s linear forwards;
	-moz-animation:ifadeIn 1s linear forwards;
	-ms-animation:ifadeIn 1s linear forwards;
	-o-animation:ifadeIn 1s linear forwards
}
.s2.active .service {
	opacity:0;
	opacity:1\9;
-webkit-animation:ifadeIn 1s linear forwards .5s;
-moz-animation:ifadeIn 1s linear forwards .5s;
-ms-animation:ifadeIn 1s linear forwards .5s;
-o-animation:ifadeIn 1s linear forwards .5s
}
.s2.active .serviceIco1 {
	opacity:0;
	opacity:1\9;
-webkit-animation:scaleBig .6s ease-in-out forwards .8s;
-moz-animation:scaleBig .6s ease-in-out forwards .8s;
-ms-animation:scaleBig .6s ease-in-out forwards .8s;
-o-animation:scaleBig .6s ease-in-out forwards .8s
}
.s2.active .serviceIco2 {
	opacity:0;
	opacity:1\9;
-webkit-animation:scaleBig .6s ease-in-out forwards 1s;
-moz-animation:scaleBig .6s ease-in-out forwards 1s;
-ms-animation:scaleBig .6s ease-in-out forwards 1s;
-o-animation:scaleBig .6s ease-in-out forwards 1s
}
.s2.active .serviceIco3 {
	opacity:0;
	opacity:1\9;
-webkit-animation:scaleBig .6s ease-in-out forwards 1.2s;
-moz-animation:scaleBig .6s ease-in-out forwards 1.2s;
-ms-animation:scaleBig .6s ease-in-out forwards 1.2s;
-o-animation:scaleBig .6s ease-in-out forwards 1.2s
}
.s2.active .serviceIco4 {
	opacity:0;
	opacity:1\9;
-webkit-animation:scaleBig .6s ease-in-out forwards 1.4s;
-moz-animation:scaleBig .6s ease-in-out forwards 1.4s;
-ms-animation:scaleBig .6s ease-in-out forwards 1.4s;
-o-animation:scaleBig .6s ease-in-out forwards 1.4s
}
.s2.active .serviceIco5 {
	opacity:0;
	opacity:1\9;
-webkit-animation:scaleBig .6s ease-in-out forwards 1.6s;
-moz-animation:scaleBig .6s ease-in-out forwards 1.6s;
-ms-animation:scaleBig .6s ease-in-out forwards 1.6s;
-o-animation:scaleBig .6s ease-in-out forwards 1.6s
}
.s2.active .serviceIco6 {
	opacity:0;
	opacity:1\9;
-webkit-animation:scaleBig .6s ease-in-out forwards 1.8s;
-moz-animation:scaleBig .6s ease-in-out forwards 1.8s;
-ms-animation:scaleBig .6s ease-in-out forwards 1.8s;
-o-animation:scaleBig .6s ease-in-out forwards 1.8s
}
.s2.active .serviceIco7 {
	opacity:0;
	opacity:1\9;
-webkit-animation:scaleBig .6s ease-in-out forwards 2s;
-moz-animation:scaleBig .6s ease-in-out forwards 2s;
-ms-animation:scaleBig .6s ease-in-out forwards 2s;
-o-animation:scaleBig .6s ease-in-out forwards 2s
}
.s2.active .servicebox {
	opacity:0;
	opacity:1\9;
	-webkit-animation:ifadeIn 1s linear forwards 2.4s;
	-moz-animation:ifadeIn 1s linear forwards 2.4s;
	-ms-animation:ifadeIn 1s linear forwards 2.4s;
	-o-animation:ifadeIn 1s linear forwards 2.4s
}
.s3.active .lefttop {
	opacity:0;
	opacity:1\9;
-webkit-animation:islideLeft 1s linear forwards .8s;
-moz-animation:islideLeft 1s linear forwards .8s;
-ms-animation:islideLeft 1s linear forwards .8s;
-o-animation:islideLeft 1s linear forwards .8s
}
.s3.active .wechat {
	opacity:0;
	opacity:1\9;
	-webkit-animation:ifadeIn 1s linear forwards 1.7s;
	-moz-animation:ifadeIn 1s linear forwards 1.7s;
	-ms-animation:ifadeIn 1s linear forwards 1.7s;
	-o-animation:ifadeIn 1s linear forwards 1.7s
}
.s3.active .bannernav {
	opacity:0;
	opacity:1\9;
	-webkit-animation:ifadeIn 1s linear forwards 1.5s;
	-moz-animation:ifadeIn 1s linear forwards 1.5s;
	-ms-animation:ifadeIn 1s linear forwards 1.5s;
	-o-animation:ifadeIn 1s linear forwards 1.5s
}
.s3.active .showright {
	opacity:0;
	opacity:1\9;
	-webkit-animation:slideRight 1s linear forwards;
	-moz-animation:slideRight 1s linear forwards;
	-ms-animation:slideRight 1s linear forwards;
	-o-animation:slideRight 1s linear forwards
}
.s4.active .title2 {
	opacity:0;
	opacity:1\9;
	-webkit-animation:ifadeIn 1s linear forwards;
	-moz-animation:ifadeIn 1s linear forwards;
	-ms-animation:ifadeIn 1s linear forwards;
	-o-animation:ifadeIn 1s linear forwards
}
.s4.active .featureico1 {
	opacity:0;
	opacity:1\9;
-webkit-animation:scaleBig .6s ease-in-out forwards .6s;
-moz-animation:scaleBig .6s ease-in-out forwards .6s;
-ms-animation:scaleBig .6s ease-in-out forwards .6s;
-o-animation:scaleBig .6s ease-in-out forwards .6s
}
.s4.active .featureico2 {
	opacity:0;
	opacity:1\9;
-webkit-animation:scaleBig .6s ease-in-out forwards .8s;
-moz-animation:scaleBig .6s ease-in-out forwards .8s;
-ms-animation:scaleBig .6s ease-in-out forwards .8s;
-o-animation:scaleBig .6s ease-in-out forwards .8s
}
.s4.active .featureico3 {
	opacity:0;
	opacity:1\9;
-webkit-animation:scaleBig .6s ease-in-out forwards 1s;
-moz-animation:scaleBig .6s ease-in-out forwards 1s;
-ms-animation:scaleBig .6s ease-in-out forwards 1s;
-o-animation:scaleBig .6s ease-in-out forwards 1s
}
.s4.active .h21 {
	opacity:0;
	opacity:1\9;
-webkit-animation:ifadeIn 1s linear forwards .6s;
-moz-animation:ifadeIn 1s linear forwards .6s;
-ms-animation:ifadeIn 1s linear forwards .6s;
-o-animation:ifadeIn 1s linear forwards .6s
}
.s4.active .h22 {
	opacity:0;
	opacity:1\9;
-webkit-animation:ifadeIn 1s linear forwards .8s;
-moz-animation:ifadeIn 1s linear forwards .8s;
-ms-animation:ifadeIn 1s linear forwards .8s;
-o-animation:ifadeIn 1s linear forwards .8s
}
.s4.active .h23 {
	opacity:0;
	opacity:1\9;
	-webkit-animation:ifadeIn 1s linear forwards 1s;
	-moz-animation:ifadeIn 1s linear forwards 1s;
	-ms-animation:ifadeIn 1s linear forwards 1s;
	-o-animation:ifadeIn 1s linear forwards 1s
}
.s4.active .p1 {
	opacity:0;
	opacity:1\9;
	-webkit-animation:ifadeIn 1s linear forwards 1s;
	-moz-animation:ifadeIn 1s linear forwards 1s;
	-ms-animation:ifadeIn 1s linear forwards 1s;
	-o-animation:ifadeIn 1s linear forwards 1s
}
.s4.active .p2 {
	opacity:0;
	opacity:1\9;
	-webkit-animation:ifadeIn 1s linear forwards 1.3s;
	-moz-animation:ifadeIn 1s linear forwards 1.3s;
	-ms-animation:ifadeIn 1s linear forwards 1.3s;
	-o-animation:ifadeIn 1s linear forwards 1.3s
}
.s4.active .p3 {
	opacity:0;
	opacity:1\9;
	-webkit-animation:ifadeIn 1s linear forwards 1.6s;
	-moz-animation:ifadeIn 1s linear forwards 1.6s;
	-ms-animation:ifadeIn 1s linear forwards 1.6s;
	-o-animation:ifadeIn 1s linear forwards 1.6s
}
.s5.active .centerline {
	opacity:1\9;
	-webkit-animation:moveheight 1s linear forwards;
	-moz-animation:moveheight 1s linear forwards;
	-ms-animation:moveheight 1s linear forwards;
	-o-animation:moveheight 1s linear forwards
}
.s5.active .inline {
	opacity:0;
	opacity:1\9;
	-webkit-animation:ifadeIn 1s linear forwards 1s;
	-moz-animation:ifadeIn 1s linear forwards 1s;
	-ms-animation:ifadeIn 1s linear forwards 1s;
	-o-animation:ifadeIn 1s linear forwards 1s
}
.s5.active .dotted1 {
	opacity:0;
	opacity:1\9;
-webkit-animation:ifadeIn 1s linear forwards .1s;
-moz-animation:ifadeIn 1s linear forwards .1s;
-ms-animation:ifadeIn 1s linear forwards .1s;
-o-animation:ifadeIn 1s linear forwards .1s
}
.s5.active .dotted2 {
	opacity:0;
	opacity:1\9;
-webkit-animation:ifadeIn 1s linear forwards .2s;
-moz-animation:ifadeIn 1s linear forwards .2s;
-ms-animation:ifadeIn 1s linear forwards .2s;
-o-animation:ifadeIn 1s linear forwards .2s
}
.s5.active .dotted3 {
	opacity:0;
	opacity:1\9;
-webkit-animation:ifadeIn 1s linear forwards .3s;
-moz-animation:ifadeIn 1s linear forwards .3s;
-ms-animation:ifadeIn 1s linear forwards .3s;
-o-animation:ifadeIn 1s linear forwards .3s
}
.s5.active .dotted4 {
	opacity:0;
	opacity:1\9;
-webkit-animation:ifadeIn 1s linear forwards .4s;
-moz-animation:ifadeIn 1s linear forwards .4s;
-ms-animation:ifadeIn 1s linear forwards .4s;
-o-animation:ifadeIn 1s linear forwards .4s
}
.s5.active .dotted5 {
	opacity:0;
	opacity:1\9;
-webkit-animation:ifadeIn 1s linear forwards .5s;
-moz-animation:ifadeIn 1s linear forwards .5s;
-ms-animation:ifadeIn 1s linear forwards .5s;
-o-animation:ifadeIn 1s linear forwards .5s
}
.s5.active .dotted6 {
	opacity:0;
	opacity:1\9;
-webkit-animation:ifadeIn 1s linear forwards .6s;
-moz-animation:ifadeIn 1s linear forwards .6s;
-ms-animation:ifadeIn 1s linear forwards .6s;
-o-animation:ifadeIn 1s linear forwards .6s
}
.s5.active .dotted7 {
	opacity:0;
	opacity:1\9;
-webkit-animation:ifadeIn 1s linear forwards .7s;
-moz-animation:ifadeIn 1s linear forwards .7s;
-ms-animation:ifadeIn 1s linear forwards .7s;
-o-animation:ifadeIn 1s linear forwards .7s
}
.s5.active .dotted8 {
	opacity:0;
	opacity:1\9;
-webkit-animation:ifadeIn 1s linear forwards .8s;
-moz-animation:ifadeIn 1s linear forwards .8s;
-ms-animation:ifadeIn 1s linear forwards .8s;
-o-animation:ifadeIn 1s linear forwards .8s
}
.s5.active .leftachive1 {
	opacity:0;
	opacity:1\9;
	-webkit-animation:slideLeft 1s ease-in forwards;
	-moz-animation:slideLeft 1s ease-in forwards;
	-ms-animation:slideLeft 1s ease-in forwards;
	-o-animation:slideLeft 1s ease-in forwards
}
.s5.active .leftachive2 {
	opacity:0;
	opacity:1\9;
-webkit-animation:slideLeft 1s ease-in forwards .1s;
-moz-animation:slideLeft 1s ease-in forwards .1s;
-ms-animation:slideLeft 1s ease-in forwards .1s;
-o-animation:slideLeft 1s ease-in forwards .1s
}
.s5.active .leftachive3 {
	opacity:0;
	opacity:1\9;
-webkit-animation:slideLeft 1s ease-in forwards .2s;
-moz-animation:slideLeft 1s ease-in forwards .2s;
-ms-animation:slideLeft 1s ease-in forwards .2s;
-o-animation:slideLeft 1s ease-in forwards .2s
}
.s5.active .leftachive4 {
	opacity:0;
	opacity:1\9;
-webkit-animation:slideLeft 1s ease-in forwards .3s;
-moz-animation:slideLeft 1s ease-in forwards .3s;
-ms-animation:slideLeft 1s ease-in forwards .3s;
-o-animation:slideLeft 1s ease-in forwards .3s
}
.s5.active .leftachive5 {
	opacity:0;
	opacity:1\9;
-webkit-animation:slideLeft 1s ease-in forwards .4s;
-moz-animation:slideLeft 1s ease-in forwards .4s;
-ms-animation:slideLeft 1s ease-in forwards .4s;
-o-animation:slideLeft 1s ease-in forwards .4s
}
.s5.active .rightachive1 {
	opacity:1\9;
	-webkit-animation:slideRight 1s ease-in forwards;
	-moz-animation:slideRight 1s ease-in forwards;
	-ms-animation:slideRight 1s ease-in forwards;
	-o-animation:slideRight 1s ease-in forwards
}
.s5.active .rightachive2 {
	opacity:1\9;
-webkit-animation:slideRight 1s ease-in forwards .1s;
-moz-animation:slideRight 1s ease-in forwards .1s;
-ms-animation:slideRight 1s ease-in forwards .1s;
-o-animation:slideRight 1s ease-in forwards .1s
}
.s5.active .rightachive3 {
	opacity:1\9;
-webkit-animation:slideRight 1s ease-in forwards .2s;
-moz-animation:slideRight 1s ease-in forwards .2s;
-ms-animation:slideRight 1s ease-in forwards .2s;
-o-animation:slideRight 1s ease-in forwards .2s
}
.s5.active .rightachive4 {
	opacity:1\9;
-webkit-animation:slideRight 1s ease-in forwards .3s;
-moz-animation:slideRight 1s ease-in forwards .3s;
-ms-animation:slideRight 1s ease-in forwards .3s;
-o-animation:slideRight 1s ease-in forwards .3s
}
.s6.active .pepole {
	opacity:0;
	opacity:1\9;
-webkit-animation:ifadeIn 1s ease-in forwards .3s;
-moz-animation:ifadeIn 1s ease-in forwards .3s;
-ms-animation:ifadeIn 1s ease-in forwards .3s;
-o-animation:ifadeIn 1s ease-in forwards .3s
}
.s6.active .infortop {
	opacity:0;
	opacity:1\9;
-webkit-animation:ifadeIn 1s ease-in forwards .8s;
-moz-animation:ifadeIn 1s ease-in forwards .8s;
-ms-animation:ifadeIn 1s ease-in forwards .8s;
-o-animation:ifadeIn 1s ease-in forwards .8s
}
.s6.active .infortop2 {
	opacity:0;
	opacity:1\9;
-webkit-animation:ifadeIn 1s ease-in forwards .9s;
-moz-animation:ifadeIn 1s ease-in forwards .9s;
-ms-animation:ifadeIn 1s ease-in forwards .9s;
-o-animation:ifadeIn 1s ease-in forwards .9s
}
.s6.active .infortext {
	opacity:0;
	opacity:1\9;
	-webkit-animation:ifadeIn 1s ease-in forwards 1s;
	-moz-animation:ifadeIn 1s ease-in forwards 1s;
	-ms-animation:ifadeIn 1s ease-in forwards 1s;
	-o-animation:ifadeIn 1s ease-in forwards 1s
}
.s6.active .mediatit {
	opacity:0;
	opacity:1\9;
	-webkit-animation:ifadeIn 1s ease-in forwards 1.1s;
	-moz-animation:ifadeIn 1s ease-in forwards 1.1s;
	-ms-animation:ifadeIn 1s ease-in forwards 1.1s;
	-o-animation:ifadeIn 1s ease-in forwards 1.1s
}
.s6.active .mediainfor1 {
	opacity:0;
	opacity:1\9;
	-webkit-animation:ifadeIn 1s ease-in forwards 1.2s;
	-moz-animation:ifadeIn 1s ease-in forwards 1.2s;
	-ms-animation:ifadeIn 1s ease-in forwards 1.2s;
	-o-animation:ifadeIn 1s ease-in forwards 1.2s
}
.s6.active .mediainfor2 {
	opacity:0;
	opacity:1\9;
	-webkit-animation:ifadeIn 1s ease-in forwards 1.3s;
	-moz-animation:ifadeIn 1s ease-in forwards 1.3s;
	-ms-animation:ifadeIn 1s ease-in forwards 1.3s;
	-o-animation:ifadeIn 1s ease-in forwards 1.3s
}
.s6.active .mediainfor3 {
	opacity:0;
	opacity:1\9;
	-webkit-animation:ifadeIn 1s ease-in forwards 1.4s;
	-moz-animation:ifadeIn 1s ease-in forwards 1.4s;
	-ms-animation:ifadeIn 1s ease-in forwards 1.4s;
	-o-animation:ifadeIn 1s ease-in forwards 1.4s
}


@media screen and (max-height:780px) {
.header {
height:70px
}
.girl {
width:481px;
height:505px
}
.pepole {
width:368px;
height:578px;
left:50px
}
.showright {
width:215px;
height:382px;
padding:61px 55px 112px 48px;
bottom:-30px;
margin-top:180px;
margin-right: 34px;
}
.imgbox div {
width:215px
}
.infortext {
margin-top:37px
}
.mediatit {
margin-top:45px
}
.title2 {
margin:50px auto
}
.bannernav {
margin:20px 0 0 5px
}
.wechat {
margin:30px 0 0 5px
}
.showleft {
margin-top:195px
}
.infor1 {
margin-top:140px
}
.center {
margin-top:-200px
}
.servicelist li p {
margin-top:7px
}
.center2 {
margin-top:-248px
}
.center3 {
margin-top:-227px
}
.course {
margin-top:0
}
}