/** CSS Reset **/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form, fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0;-webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-tap-highlight-color: transparent; }
table { border-collapse:collapse; border-spacing:0; }
fieldset,img { border:0; vertical-align: bottom;}
address,caption,cite,code,dfn,em,strong,th,var { font-style:normal; font-weight:normal; }
ol,ul { list-style:none; }
caption,th { text-align:center; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
abbr,acronym { border:0; }
textarea, input, select{resize: none;outline:none;background:none;border:none;}
button {overflow:visible;width:auto;margin:0;padding:0;border:0 none;outline:none;}
input{border:0}
a{text-decoration:none; color:#333;-webkit-tap-highlight-color:transparent; -webkit-touch-callout:none;}
a:hover{ text-decoration:none;color:#000;}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;font-size: 0;}
.clearfix{display:inline-block;}
/* Hide from IE Mac */
.clearfix {display:block;}
html{width: 100%;height:100%;}
body{color:#333;font-size:18px;line-height:160%;font-family: "Microsoft YaHei";width: 100%;height:100%;}
.fl{float:left;}
.fr{float:right;}
.pc{display:block;}
.mobile{display:none;}
.m1000{width:1000px;margin:0 auto;overflow: hidden;}

.stage {position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 5;pointer-events: none}
/* banner */
.header {width: 100%;background:url(../images/header_bg.png) no-repeat center top;height: 640px;position: relative;z-index:2;}
.header .header_t img{margin:30px auto 0;display: block;}

.title{text-align: center;padding:10px 0;}
.page{padding:30px 0;}

/*page1*/
.page1{position: relative;}
.page1 .bg{position: absolute;bottom:-50px;}
.page1 p{padding: 55px 30px;line-height:200%;background:url(../images/page1.png) no-repeat center top;}

/*page2*/
.box{background:url(../images/bg_1.png) no-repeat center top;-webkit-background-size:100% 100%;background-size:100% 100%;position: relative;z-index:2;}
.page2 .content span{text-align: center;font-size: 24px;font-weight:bold;margin:20px auto 15px;color:#fff;display: block;width:280px;padding:10px 0;border-radius: 50px;-moz-box-shadow:5px 5px 0px #fcfa7b; -webkit-box-shadow:5px 5px 0px #fcfa7b; box-shadow:5px 5px 0px #fcfa7b;background:#db0018;}
.page2 .content ul li{padding:12px 0;position: relative;}
.page2 .content ul li b{height: 50px;line-height: 50px;text-align: center;font-size: 24px;background:url(../images/page2.png) no-repeat center center;width: 55px;position: absolute;top:10px;left:0;}
.page2 .content ul li p{padding:10px 2%;border-radius: 10px;background:url(../images/page2_line.png) repeat-x;-webkit-background-size:100% 100%;background-size:100% 100%;margin-left:80px;}

/*page3*/
.page3 .content li{margin:20px 0;}
.page3 .content li p{border-radius: 10px;border:1px solid #ffe181;padding-right:3px;padding-bottom:3px;border-radius: 5px;margin-left: 5px; }
.page3 .content li p b{margin-left: -3px;margin-top: -3px;text-align: center;display: block;background:url(../images/page2_line.png) repeat-x;-webkit-background-size: 100% 100%;background-size: 100% 100%;border-radius: 5px;height: 55px;line-height: 55px;font-size: 24px;}
.page3 .content li p span{margin-left: -3px;margin-top: -3px;display: block;background:url(../images/page2_line.png) repeat-x;-webkit-background-size: 100% 100%;background-size: 100% 100%;border-radius: 5px;padding:5px 2%;height: 45px;color:#5c3d35;line-height: 120%;}
.page3 .content li p.one span{height: 30px;padding-top: 15px;}
.page3 .content li p.fl{width: 20%;}
.page3 .content li p.fr{width: 75%;}

/*page4*/
.page4{position: relative;}
.page4 .bg1{position: absolute;bottom:-400px;left:0;}
.page4 .bg2{position: absolute;top:-240px;right:0;}
.page4 .teacher li{float: left;width: 46%;margin: 40px 4% 30px 1.5%;position: relative;border:1px solid #de3b10;padding-bottom: 3px;}
.page4 .teacher li.last{margin-right: 0;}
.page4 .teacher li span{border-radius:  0px 0px 20px 0px;border:1px solid #de3b10;padding-right:3px;padding-bottom: 14px;position: absolute;top: -20px;left: -10px;background: #fff;}
.page4 .teacher li span i{padding: 5px 40px 10px 20px;font-style: normal;font-size: 30px;color:#fff;font-weight: bold;background:#de3b10;border-radius: 0px 0px 20px 0px;margin-left: -5px;}
.page4 .teacher li div{border:1px solid #de3b10;padding: 60px 4% 20px;height: 150px;width: 92%;margin-top: -5px;margin-left: -5px;background: #fff;}
.page4 .teacher li div b{padding-bottom: 10px;display: block;}
.page4 .teacher li div p{font-size: 16px;}
.page4 .boxWrap{color: #fff;background:url(../images/page4.png) no-repeat center top;}
.page4 .boxWrap .fl{width: 40%;padding:52px 5%;}
.page4 .boxWrap .fr{width: 35%;}
.page4 .boxWrap .fl p{font-size: 36px;font-weight: bold;line-height: 160%;}
.page4 .boxWrap .fl p.textRight{text-align: right;}
.page4 .boxWrap .fr p{padding:20px 0 0px 25px;background:url(../images/page4_li.png) no-repeat left 30px;}

/*page5*/
.zxyy{background:url(../images/bg_2.png) no-repeat center top;position: relative;z-index:2;}
.form-wrap form label{border:none;}
.form-wrap .btn-wrap{background: #ffe480;color:#333;}

@media screen and (max-width:1000px) {
  body{font-size: 22px;line-height: 160%;-webkit-text-size-adjust: none;}
  .m1000{width:96%;margin:0 auto;padding: 0;}
  .pc{display:none;}
  .mobile{display:block;}
  .page{padding: 2rem 0;}
  .title {margin: 1rem 0;}

  /*header*/
  .header {height:38rem;}
  .header .m1000{width: 100%;}
  .header .header_t img{width: 90%;margin: 60px auto 0;}

  /*page1*/
  .page1 .m1000{width: 100%;}
  .page1 p{-webkit-background-size: 100% 100%;background-size: 100% 100%;}

  /*page3*/
  .page3 .content li p span{height: auto;padding: 10px 2%;line-height: 160%}
  .page3 .content li p.one span{height: auto;padding-top: 10px;}

  /*page4*/
  .page4 .teacher li{width: 98%}
  .page4 .boxWrap{background: url(../images/page4.png) no-repeat 20% top;}
  .page4 .boxWrap .fr p {padding: 14px 0 0px 25px;}
  .page4 .boxWrap .fr {width: 25%;}

  .reg_mobile{width: 80%; margin: 20px auto 0;}

}
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
@-webkit-keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}