* {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
a,
img {
  border: 0;
}
/* body {
  background: #d7e9fc;
} */
.mianBox {
  width: 100%;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  height: calc(100vh - 52px);
}
.mianBox > img {
  position: absolute;
  z-index: 100;
}
.yun0 {
  right: 220px;
  top: 10%;
  -webkit-animation: flying 5s infinite;
  -moz-animation: flying 5s infinite;
  -o-animation: flying 5s infinite;
  animation: flying 5s infinite;
  width: 140px;
}
.yun1 {
  left: 10%;
  top: 48%;
  -webkit-animation: flying 4s infinite;
  -moz-animation: flying 4s infinite;
  -o-animation: flying 4s infinite;
  animation: flying 4s infinite;
  width: 120px;
}
.yun2 {
  right: 25%;
  top: 75%;
  -webkit-animation: flying 3s infinite;
  -moz-animation: flying 3s infinite;
  -o-animation: flying 3s infinite;
  animation: flying 3s infinite;
  width: 90px;
}
.san {
  left: 50%;
  bottom: 80px;
  -webkit-animation: dn400 1.5s 0s ease both;
  -moz-animation: dn400 1.5s 0s ease both;
  animation: dn400 1.5s 0s ease both;
  width: 640px;
  max-width: 45%;
  margin-left: -320px;
}
.bird {
  left: 27%;
  top: 15%;
  -webkit-animation: flying 3s infinite;
  -moz-animation: flying 3s infinite;
  -o-animation: flying 3s infinite;
  animation: flying 3s infinite;
}
.disk {
  left: 234px;
  top: 98px;
  z-index: 9;
  -webkit-animation: flying 2s infinite;
  -moz-animation: flying 2s infinite;
  -o-animation: flying 2s infinite;
  animation: flying 2s infinite;
}
.light {
  left: 330px;
  top: 188px;
  z-index: 8;
  -webkit-animation: light 1s infinite;
  -moz-animation: light 1s infinite;
  -o-animation: light 1s infinite;
  animation: light 1s infinite;
}
.man {
  left: 400px;
  top: 310px;
  z-index: 7;
  -webkit-animation: hide 2s 0.5s infinite;
  -moz-animation: hide 2s 0.5s infinite;
  -o-animation: hide 2s 0.5s infinite;
  animation: hide 2s 0.5s infinite;
}
.picv {
  left: 15%;
  top: 390px;
}
.tipInfo {
  position: absolute;
  z-index: 99;
  /* margin-left: 150px; */
  /* border: 4px solid #c0ece7;
  border-color: rgba(192, 237, 232, 07);
  border-radius: 5px;
  derbackground: #c0ece7;
  background: rgba(192, 237, 232, 07);*/
  width: 736px;
}
.tipInfo .in {
  background: #fff;
  padding: 0 10%;
}
.tipInfo .in h2 {
  font-size: 42px;
  font-family: "宋体";
  background: url("../images/link.png") no-repeat left center / 120px;
  height: 120px;
  vertical-align: bottom;
  padding: 0 0 32px 140px;
  display: flex;
  align-items: flex-end;
}
.tipInfo .in h3 {
  font-size: 36px;
  font-family: "宋体";
}

.tipInfo .in h3 span {
  color: #ed672f;
  font-size: 45px;
}

.tipInfo .in h4 {
  font-size: 24px;
  text-align: center;
  padding: 12px 0;
}

.tipInfo .in h4 span {
  text-decoration: underline;
  color: #415887;
}

.tipInfo .in .link {
  display: block;
  margin: 15px 0;
  text-align: center;
}

.tipInfo .in .link img {
  width: 260px;
}

.tipInfo .in p {
  text-align: center;
  color: #ed672f;
  font-size: 20px;
}

.beian {
  height: 52px;
  line-height: 52px;
  text-align: center;
  /* background-color: #f77f2f; */
  color: #000;
  position: absolute;
  bottom: 0;
  width: 100%;
  -webkit-animation: dn400 1.5s 0s ease both;
  -moz-animation: dn400 1.5s 0s ease both;
  animation: dn400 1.5s 0s ease both;
}
.beian a {
  color: #000;
  text-decoration: none;
}
@-webkit-keyframes cloudLarge {
  0% {
    right: -140px;
  }
  100% {
    right: 118%;
  }
}
@-moz-keyframes cloudLarge {
  0% {
    right: -140px;
  }
  100% {
    right: 118%;
  }
}
@-o-keyframes cloudLarge {
  0% {
    right: -140px;
  }
  100% {
    right: 118%;
  }
}
@keyframes cloudLarge {
  0% {
    right: -140px;
  }
  100% {
    right: 118%;
  }
}
@-webkit-keyframes cloudSmall {
  0% {
    left: 5%;
  }
  100% {
    left: 108%;
  }
}
@-moz-keyframes cloudSmall {
  0% {
    left: 5%;
  }
  100% {
    left: 105%;
  }
}
@-o-keyframes cloudSmall {
  0% {
    left: 5%;
  }
  100% {
    left: 105%;
  }
}
@keyframes cloudSmall {
  0% {
    left: 5%;
  }
  100% {
    left: 105%;
  }
}
@-webkit-keyframes cloudMedium {
  0% {
    left: 16%;
  }
  100% {
    left: -18%;
  }
}
@-moz-keyframes cloudMedium {
  0% {
    left: 16%;
  }
  100% {
    left: -18%;
  }
}
@-o-keyframes cloudMedium {
  0% {
    left: 16%;
  }
  100% {
    left: -18%;
  }
}
@keyframes cloudMedium {
  0% {
    left: 16%;
  }
  100% {
    left: -18%;
  }
}
@-webkit-keyframes light {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 100;
  }
}
@-moz-keyframes light {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 100;
  }
}
@-o-keyframes light {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 100;
  }
}
@keyframes light {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 100;
  }
}
@-webkit-keyframes hide {
  0% {
    opacity: 100;
  }
  100% {
    opacity: 0;
  }
}
@-moz-keyframes hide {
  0% {
    opacity: 100;
  }
  100% {
    opacity: 0;
  }
}
@-o-keyframes hide {
  0% {
    opacity: 100;
  }
  100% {
    opacity: 0;
  }
}
@keyframes hide {
  0% {
    opacity: 100;
  }
  100% {
    opacity: 0;
  }
}
@keyframes flying {
  0% {
    margin-top: 0px;
  }
  50% {
    margin-top: 10px;
  }
  100% {
    margin-top: 0px;
  }
}
@-webkit-keyframes flying {
  0% {
    margin-top: 0px;
  }
  50% {
    margin-top: 10px;
  }
  100% {
    margin-top: 0px;
  }
}
@-moz-keyframes flying {
  0% {
    margin-top: 0px;
  }
  50% {
    margin-top: 10px;
  }
  100% {
    margin-top: 0px;
  }
}
@-o-keyframes flying {
  0% {
    margin-top: 0px;
  }
  50% {
    margin-top: 10px;
  }
  100% {
    margin-top: 0px;
  }
}
@keyframes flying {
  0% {
    margin-top: 0px;
  }
  50% {
    margin-top: 10px;
  }
  100% {
    margin-top: 0px;
  }
}
@-webkit-keyframes flying {
  0% {
    margin-top: 0px;
  }
  50% {
    margin-top: 10px;
  }
  100% {
    margin-top: 0px;
  }
}
@-moz-keyframes flying {
  0% {
    margin-top: 0px;
  }
  50% {
    margin-top: 10px;
  }
  100% {
    margin-top: 0px;
  }
}
@-o-keyframes flying {
  0% {
    margin-top: 0px;
  }
  50% {
    margin-top: 10px;
  }
  100% {
    margin-top: 0px;
  }
}
@-webkit-keyframes down900 {
  0% {
    opacity: 0;
    -webkit-transform: translate(0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(900, 900);
  }
}
@-moz-keyframes down900 {
  0% {
    opacity: 0;
    -moz-transform: translate(0, 0);
  }
  100% {
    opacity: 1;
    -moz-transform: translate(900, 900);
  }
}
@-o-keyframes down900 {
  0% {
    opacity: 0;
    -o-transform: translate(0, 0);
  }
  100% {
    opacity: 1;
    -o-transform: translate(900, 900);
  }
}
@keyframes down900 {
  0% {
    opacity: 0;
    transform: translate(0, 0);
  }
  100% {
    opacity: 1;
    transform: translate(900, 900);
  }
}
@-webkit-keyframes dn400 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(200px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}
@-moz-keyframes dn400 {
  0% {
    opacity: 0;
    -moz-transform: translateY(200px);
  }
  100% {
    opacity: 1;
    -moz-transform: translateY(0);
  }
}
@-o-keyframes dn400 {
  0% {
    opacity: 0;
    -o-transform: translateY(200px);
  }
  100% {
    opacity: 1;
    -o-transform: translateY(0);
  }
}
@keyframes dn400 {
  0% {
    opacity: 0;
    transform: translateY(200px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
