* {
  margin: 0;
  padding: 0;
}
.top .content > div:nth-child(3) a {
  color: #fff;
  border-bottom: 1px solid #e0e0e0;
}

.page {
  overflow: hidden;
}

.page1 {
  background-color: #202020;
}

.page1 .bg {
  height: auto;
  top: 60px;
  bottom: 0;
  margin: auto auto;
  overflow: hidden;
}

.page1 .text {
  width: 100%;
  position: absolute;
  top: 10%;
  color: #fff;
  text-align: center;
}

.page1 .p {
  display: block;
  margin: 0 auto;
  opacity: 0;
}

.page1 .p1 {
  height: auto;
}

.page1 .p2 {
  width: 100%;
  height: auto;
  margin-top: 36px;
  line-height: 25px;
}

.page1 .p3 {
  margin-top: 1.8518518518518518518518518518519%;
}

.page1 .down {
  width: 100%;
  height: 60px;
  text-align: center;
  line-height: 60px;
  font-size: 28px;
  margin: 0 auto;
  margin-top: 60px;
  opacity: 0;
  position: relative;
}

.page1 .down > a {
  display: block;
  width: 300px;
  height: 100%;
  color: #000;
  border-radius: 8px;
  background-color: #f79d33;
  float: left;
  position: absolute;
  left: 0;
  right: 0;

  margin: 0 auto;
  top: -80%;
}

.page1 .down.bg1 {
  transition: all 0.5s;
}

.page1 .down > a:hover {
  background-color: #ffae4e;
}

.page1 .phone {
  position: absolute;
  top: auto;
  top: auto;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: auto;
  height: 35.555555555555555555555555555556%;
  display: block;
}

.page1 .logo2 {
  position: absolute;
  top: 0;
  width: 8.6328125%;
  height: auto;
  top: 41.458333333333333333333333333333%;
  left: 0;
  right: 0;
  margin: 0 auto;
}

.page1 .play {
  margin-top: 60px;
  width: 20px;
  height: 20px;
  cursor: pointer;
  float: left;
  position: absolute;
  left: 200px;
  right: -200px;
  margin: 0 auto;
  top: 20px;
}

.page2 .bg {
  top: 0px;
  bottom: 0px;
  background-image: url(//img.ejiayou.com/home/image/2-v3.jpg);
  height: auto;
}

.page1 .dialog {
  width: 536px;
  height: 312px;
  background-color: #000;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto auto;
  z-index: 999;
  display: none;
}

.page1 .dialog .close {
  display: block;
  position: absolute;
  width: 46px;
  height: 46px;
  right: 0;
  top: 0;
  cursor: pointer;
}

.page1 .dialog img:hover {
  background-color: rgba(100, 100, 100, 0.3);
}

.page1 .dialog .version {
  width: 100%;
  text-align: center;
  position: absolute;
  top: 54px;
  font-size: 16px;
  color: #fff;
}

.page1 .download_android {
  position: absolute;
  left: 283px;
  top: 112px;
  width: 194px;
  height: 44px;
  display: block;
  background-image: url(//img.ejiayou.com/home/image/andriod_down.png);
  background-repeat: no-repeat;
}

.page1 .download_ios {
  position: absolute;
  left: 283px;
  top: 186px;
  width: 194px;
  height: 44px;
  display: block;
  background-image: url(//img.ejiayou.com/home/image/ios_down.png);
  background-repeat: no-repeat;
}

.page1 .dialog .download_qrcode {
  position: absolute;
  left: 60px;
  top: 112px;
  width: 118px;
  height: 118px;
}

/* .page2 img {
    position: absolute;
    width: 20%;
    height: 43.329775880469583778014941302028%;
    opacity: 0;
    opacity: 1\0;
    transform: rotateZ(6deg);
}

.page2 .img3 {
    width: 12%;
    height: 25.664887940234791889007470651014%;
    top: 34%;
    left: 35%;
}

.page2 .img2 {
    width: 13.5%;
    height: 28.914621131270010672358591248666%;
    top: 32%;
    left: 32.5%;
}

.page2 .img1 {
    width: 16%;
    height: 35.41408751334044823906083244397%;
    top: 29%;
    left: 30%;
}

.page2 .img1-animation {
    animation: img1 2s forwards;
}

.page2 .img2-animation {
    animation: img2 2s forwards;
}

.page2 .img3-animation {
    animation: img3 2s forwards;
}

@keyframes img3 {
    0% {
        opacity: 0;
        left: 36%;
        top: 35%;
    }
    50% {
        opacity: 1;
        left: 35%;
        top: 34%
    }
    100% {
        opacity: 1;
        left: 35%;
        top: 34%
    }
}

@keyframes img2 {
    0% {
        opacity: 0;
        left: 33.5%;
        top: 33%;
    }
    25% {
        opacity: 0;
        left: 33.5%;
        top: 33%;
    }
    75% {
        opacity: 1;
        left: 32.5%;
        top: 32%
    }
    100% {
        opacity: 1;
        left: 32.5%;
        top: 32%
    }
}

@keyframes img1 {
    0% {
        opacity: 0;
        left: 31%;
        top: 30%;
    }
    50% {
        opacity: 0;
        left: 31%;
        top: 30%;
    }
    100% {
        opacity: 1;
        left: 30%;
        top: 29%
    }
} */

.page2 .text {
  width: 100%;
  height: 300px;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}

.page2 .text img {
  height: auto;
}

.page2 p {
  position: absolute;
  color: #fff;
  opacity: 0;
  opacity: 1\0;
}

.page2 .p1 {
  top: 0;
  left: 52.828282828282828282828282828283%;
}

.page2 .p2 {
  left: 52.828282828282828282828282828283%;
  top: 132px;
  line-height: 25px;
}

.page2 .p3 {
  left: 52.828282828282828282828282828283%;
  top: 176px;
}

.page2 .p4 {
  left: 50.808080808080808080808080808081%;
  top: 57.990394877267876200640341515475%;
}

@keyframes p1 {
  0% {
    opacity: 0;
    transform: translateY(60px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}

@keyframes p3 {
  0% {
    opacity: 0;
    transform: translateX(60px);
  }
  33% {
    opacity: 0;
    transform: translateX(60px);
  }
  100% {
    opacity: 1;
    transform: translateX(0%);
  }
}

@keyframes p4 {
  0% {
    opacity: 0;
    transform: translateX(60px);
  }
  33% {
    opacity: 0;
    transform: translateX(60px);
  }
  100% {
    opacity: 1;
    transform: translateX(0%);
  }
}

@keyframes p5 {
  0% {
    opacity: 0;
    transform: translateX(100px);
  }
  33% {
    opacity: 0;
    transform: translateX(100px);
  }
  100% {
    opacity: 1;
    transform: translateX(0%);
  }
}

.page2 .p1-animation {
  animation: p1 2s forwards;
}

.page2 .p2-animation {
  animation: p1 2s forwards;
}

.page2 .p3-animation {
  animation: p3 4s forwards;
}

.page2 .p4-animation {
  animation: p4 4s forwards;
}

.page2 .p5-animation {
  animation: p5 4s forwards;
}

.page3 {
  overflow: hidden;
}

.page3 .bg {
  top: 0px;
  bottom: 0px;
  background-image: url(//img.ejiayou.com/home/image/3-v.jpg);
  height: auto;
}

.page3 .phone {
  height: 73.639274279615795090715048025614%;
  width: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 53.939393939393939393939393939394%;
  margin: auto 0;
}

.page3 .bubble {
  position: absolute;
  height: 0;
  /*     height: 0 !important; */
}

.page3 .bubble1 {
  width: auto;
  height: 17.289220917822838847385272145144%\0;
  left: 47.474747474747474747474747474747%;
  top: 1.7075773745997865528281750266809%;
}

.page3 .bubble2 {
  width: auto;
  height: 22.411953041622198505869797225187%\0;
  left: 68.131313131313131313131313131313%;
  top: -3.4151547491995731056563500533618%;
}

.page3 .bubble3 {
  width: auto;
  height: 17.609391675560298826040554962647%\0;
  left: 72.828282828282828282828282828283%;
  top: 29.455709711846318036286019210245%;
}

.page3 .bubble4 {
  width: auto;
  height: 15.048025613660618996798292422625%\0;
  left: 69.545454545454545454545454545455%;
  top: 55.816435432230522945570971184632%;
}

.page3 .bubble5 {
  width: auto;
  height: 29.775880469583778014941302027748%\0;
  left: 67.373737373737373737373737373737%;
  top: 82.604055496264674493062966915688%;
}

.page3 .bubble6 {
  width: auto;
  height: 16.542155816435432230522945570971%\0;
  left: 49.141414141414141414141414141414%;
  top: 84.418356456776947705442902881537%;
}

.page3 .bubble1-animation {
  animation: bubble1 2.5s forwards;
}

.page3 .bubble2-animation {
  animation: bubble2 2.5s forwards;
}

.page3 .bubble3-animation {
  animation: bubble3 2.5s forwards;
}

.page3 .bubble4-animation {
  animation: bubble4 2.5s forwards;
}

.page3 .bubble5-animation {
  animation: bubble5 2.5s forwards;
}

.page3 .bubble6-animation {
  animation: bubble6 2.5s forwards;
}

@keyframes bubble1 {
  0% {
    height: 0;
    top: 18.143009605122732123799359658485%;
    left: 55.353535353535353535353535353535%;
  }
  0% {
    height: 0;
    top: 18.143009605122732123799359658485%;
    left: 55.353535353535353535353535353535%;
  }
  35% {
    height: 17.289220917822838847385272145144%;
    top: 1.7075773745997865528281750266809%;
    left: 47.474747474747474747474747474747%;
  }
  100% {
    height: 17.289220917822838847385272145144%;
    top: 1.7075773745997865528281750266809%;
    left: 47.474747474747474747474747474747%;
  }
}

@keyframes bubble2 {
  0% {
    height: 0;
    top: 19.103521878335112059765208110993%;
    left: 68.131313131313131313131313131313%;
  }
  20% {
    height: 0;
    top: 19.103521878335112059765208110993%;
    left: 68.131313131313131313131313131313%;
  }
  45% {
    height: 22.411953041622198505869797225187%;
    top: -3.4151547491995731056563500533618%;
    left: 68.131313131313131313131313131313%;
  }
  100% {
    height: 22.411953041622198505869797225187%;
    top: -3.4151547491995731056563500533618%;
    left: 68.131313131313131313131313131313%;
  }
}

@keyframes bubble3 {
  0% {
    height: 0;
    top: 41.088580576307363927427961579509%;
    left: 72.828282828282828282828282828283%;
  }
  30% {
    height: 0;
    top: 41.088580576307363927427961579509%;
    left: 72.828282828282828282828282828283%;
  }
  55% {
    height: 17.609391675560298826040554962647%;
    top: 29.455709711846318036286019210245%;
    left: 72.828282828282828282828282828283%;
  }
  100% {
    height: 17.609391675560298826040554962647%;
    top: 29.455709711846318036286019210245%;
    left: 72.828282828282828282828282828283%;
  }
}

@keyframes bubble4 {
  0% {
    height: 0;
    top: 61.15261472785485592315901814301%;
    left: 69.545454545454545454545454545455%;
  }
  40% {
    height: 0;
    top: 61.15261472785485592315901814301%;
    left: 69.545454545454545454545454545455%;
  }
  65% {
    height: 15.048025613660618996798292422625%;
    top: 55.816435432230522945570971184632%;
    left: 69.545454545454545454545454545455%;
  }
  100% {
    height: 15.048025613660618996798292422625%;
    top: 55.816435432230522945570971184632%;
    left: 69.545454545454545454545454545455%;
  }
}

@keyframes bubble5 {
  0% {
    height: 0;
    top: 82.604055496264674493062966915688%;
    left: 69.949494949494949494949494949495%;
  }
  50% {
    height: 0;
    top: 82.604055496264674493062966915688%;
    left: 69.949494949494949494949494949495%;
  }
  75% {
    height: 29.775880469583778014941302027748%;
    left: 67.373737373737373737373737373737%;
    top: 82.604055496264674493062966915688%;
  }
  100% {
    height: 29.775880469583778014941302027748%;
    left: 67.373737373737373737373737373737%;
    top: 82.604055496264674493062966915688%;
  }
}

@keyframes bubble6 {
  0% {
    height: 0;
    top: 85.485592315901814300960512273212%;
    left: 56.464646464646464646464646464646%;
  }
  60% {
    height: 0;
    top: 85.485592315901814300960512273212%;
    left: 56.464646464646464646464646464646%;
  }
  85% {
    height: 16.542155816435432230522945570971%;
    left: 49.141414141414141414141414141414%;
    top: 84.418356456776947705442902881537%;
  }
  100% {
    height: 16.542155816435432230522945570971%;
    left: 49.141414141414141414141414141414%;
    top: 84.418356456776947705442902881537%;
  }
}

.page3 .text {
  color: #fff;
  font-size: 16px;
  position: absolute;
  top: 28.75882946518668012108980827447%;
  right: 5%;
  width: 511px;
  height: 488px;
}

.page3 .text .p {
  opacity: 0;
  opacity: 1\0;
}

.page3 .p1 {
  width: 65.803108808290155440414507772021;
  top: 0px;
}

.page3 .p2 {
  margin-top: 36px;
  width: 100%;
}

.page3 .p3 {
  margin-top: 24px;
  width: 92.227979274611398963730569948187%;
}

.page3 .p1-animation {
  animation: page3-p1 2s forwards;
}

.page3 .p2-animation {
  animation: page3-p2 2.5s forwards;
}

.page3 .p3-animation {
  animation: page3-p3 2.5s forwards;
}

.page3 .p4-animation {
  animation: page3-p4 2.5s forwards;
}

.page3 .p5-animation {
  animation: page3-p5 2.5s forwards;
}

@keyframes page3-p1 {
  0% {
    transform: translateY(60px);
    opacity: 0;
  }
  100% {
    transform: translateY(0px);
    opacity: 1;
  }
}

@keyframes page3-p2 {
  0% {
    transform: translateX(-100px);
    opacity: 0;
  }
  66% {
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes page3-p3 {
  0% {
    transform: translateX(-150px);
    opacity: 0;
  }
  11% {
    transform: translateX(-150px);
    opacity: 0;
  }
  77% {
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes page3-p4 {
  0% {
    transform: translateX(-200px);
    opacity: 0;
  }
  22% {
    transform: translateX(-200px);
    opacity: 0;
  }
  88% {
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes page3-p5 {
  0% {
    transform: translateX(-250px);
    opacity: 0;
  }
  33% {
    transform: translateX(-250px);
    opacity: 0;
  }
  99% {
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

.page4 .bg {
  background-image: url(//img.ejiayou.com/home/image/4-v.jpg);
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
  height: auto;
}

.page4 .bg > div {
  height: 250px;
  width: 1000px;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto auto;
}

.page4 .carousel-frame {
  width: 600px;
  height: auto;
  position: absolute;
  top: -255px;
  z-index: -1;
}

.page4 .carousel {
  width: 600px;
  height: 250px;
  top: 28.707782672540381791483113069016%;
  left: 50.505050505050505050505050505051%;
}

.page4 .carousel-content {
  width: 480px;
  height: 240px;
  margin-left: 36px;
  position: relative;
  z-index: -2;
}

.page4 .carousel-content > div {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

.page4 .carousel-content > div img {
  width: 100%;
  height: 100%;
}

.page4 .carousel-button {
  position: absolute;
  width: 480px;
  height: 50px;
  top: 250px;
  margin-left: 36px;
  z-index: 999;
  text-align: center;
}

.page4 .carousel-button > div {
  display: inline-block;
  height: 100%;
}

.page4 .carousel-button > div > div {
  width: 10px;
  height: 10px;
  border-radius: 10px;
  display: inline-block;
  background-color: rgba(100, 100, 100, 0.8);
  margin: 10px 4px 0 4px;
  cursor: pointer;
}

.page4 .text {
  color: #fff;
  font-size: 16px;
  top: 28.707782672540381791483113069016%;
  left: 30.505050505050505050505050505051%;
  width: 395px;
  height: 250px;
}

.page4 .text p {
  opacity: 0;
  opacity: 1\0;
}

.page4 .p1 {
  top: 0;
}

.page4 .p2 {
  width: 80.126582278481012658227848101266%;
  margin-top: 36px;
  line-height: 25px;
}

.page4 .p3 {
  top: 156px;
}

.page4 .p4 {
  top: 178px;
}

.page4 .p1-animation {
  animation: page1-p1 2s forwards;
}

.page4 .p2-animation {
  animation: page1-p2 2s forwards;
}

@media screen and (min-height: 0px) and (max-height: 750px) {
  .page1 .down {
    margin-top: 10px;
  }
}
.top {
  height: 60px;
  position: fixed;
  background-color: #202020;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 33;
}
.mobile-number {
  height: 60px;
  font-size: 16px;
  color: #999999;
  line-height: 60px;
  text-align: center;
  position: absolute;
  z-index: 1;
  right: 40px;
  top: 0;
}
.bottom .contact > p {
  padding-right: 180px;
}
.first {
  display: flex;
  flex-flow: wrap;
}
.info {
  display: flex;
  flex-flow: wrap;
}
.info_item {
  width: 124px;
  margin-top: 56px;
}
.info_item_top {
  display: flex;
  flex-flow: wrap;
  margin-top: 12px;
}
.wechat_icon {
  width: 28px;
  height: 28px;
  background-image: url(//img.ejiayou.com/upload/2020/11/0846ab98-8840-4570-9383-4bec4b8e8e4e-1605666144263.png);
  background-repeat: no-repeat;
  background-size: 100%;
  margin-right: 4px;
  margin-bottom: 12px;
}
.wechat_title {
  width: 100%;
  height: 28px;
  font-size: 13px;
  font-weight: 400;
  color: #ddd;
  line-height: 28px;
  text-align: center;
}
.info_item_bottom {
  width: 124px;
  height: 124px;
}
.info_item_bottom img {
  width: 124px;
  height: 124px;
  display: block;
}
.fixed {
  width: 48px;
  height: 148px;
  position: fixed;
  z-index: 33;
  right: 20px;
  top: 50%;
  transform: translate(-50%, -50%);
}
.fixed_call {
  width: 48px;
  height: 48px;
  background-image: url(//img.ejiayou.com/upload/2020/11/fa698edb-6b63-45b3-a265-76d46737104e-1605679106300.png);
  background-repeat: no-repeat;
  background-size: 100%;
  margin-bottom: 20px;
  position: relative;
}
.fixed_wechat {
  width: 48px;
  height: 48px;
  background-image: url(//img.ejiayou.com/upload/2020/11/bc8614e3-8288-4532-9677-be227ef0e10e-1605679139586.png);
  background-repeat: no-repeat;
  background-size: 100%;
  margin-bottom: 20px;
  position: relative;
}
.fixed_qq {
  width: 48px;
  height: 48px;
  background-image: url(//img.ejiayou.com/upload/2020/11/ff6c1de1-fe84-4630-850a-10f8935bc6b6-1605679173535.png);
  background-repeat: no-repeat;
  background-size: 100%;
  position: relative;
}
.fixed_call_info {
  width: 184px;
  height: 48px;
  background: #ffa400;
  border-radius: 24px;
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  opacity: 0;
  display: flex;
  align-items: center;
}
.fixed_call_info:hover {
  opacity: 1;
}
.fixed_call_info_icon {
  width: 48px;
  height: 48px;
  background-image: url(//img.ejiayou.com/upload/2020/11/527aae13-80da-4a6a-9f92-2927a93c628f-1605681132424.png);
  background-repeat: no-repeat;
  background-size: 100%;
}
.fixed_call_info_title {
  line-height: 48px;
  font-size: 16px;
  font-weight: 400;
  color: #ffffff;
}