html,body,.wrapper{
  width: 100%;
  height: 100%;
}
.wrapper{
  overflow: hidden;
}
.section1{
  width: 100%;
  height: 100%;
  background: url(../images/background1.jpg) no-repeat center;
  background-size: cover;
  position: relative;
}
.section1 .main {
  position: absolute;
  width: 1000px;
  height: 100%;
  left: 50%;
  margin-left: -500px;
}
.section1 .main .title {
  width: 885px;
  height: 450px;
  position: absolute;
  left: 50%;
  top: 18%;
  margin-left: -442px;
  animation: slideIn 1s linear;
  animation-fill-mode: forwards;
}
.goIn{
  width: 308px;
  height: 193px;
  position: absolute;
  left: 50%;
  top: 71%;
  margin-left: -154px;
  animation: upDown 1s linear forwards;
  animation-delay: 1s;
  opacity: 0;
}
@keyframes slideIn{
  0% {
      opacity:0;
      transform: scale(.6);
  }
  50%{
      opacity:1;
      transform: scale(.8);
  }
  100% {
      opacity:1;
      transform: scale(1);
  }
}
@-webkit-keyframes slideIn{
  0% {
      opacity:0;
      transform: scale(.6);
  }
  50%{
      opacity:1;
      transform: scale(.8);
  }
  100% {
      opacity:1;
      transform: scale(1);
  }
}
@keyframes upDown {
  from{
      opacity: 0;
  }
  to{
      opacity: 1;
  }
}
.section2{
  max-width: 1920px;
  background: url(../images/back.jpg) no-repeat center 0;
  padding-top: 90px;
  margin: 0 auto;
  box-sizing: border-box;
}
.area{
  width: 1000px;
  margin: 0 auto 198px;
}
.introduce{
  width: 579px;
  height: 288px;
  margin: 0 auto;
}
.video {
  width: 931px;
  height: 524px;
  box-shadow: -1px 4px 13px 0 rgb(0 0 0 / 50%);
  margin: 50px auto 0;
}
.wrap{
 width: 1200px;
 margin: 0 auto;
}
.people{
  width: 50%;
  float: left;
  position: relative;
}
.people image{
  width: 671px;
  height: auto;
}
