.body {
  /* width:100%; */
  /* height:100vh; */
  margin: 0;
}

.top {
  background-image: url(/imgs/topbg.jpg);
  /* width:100%; */
  height: 17.73rem; /*665px*/
  background-size: cover;
  position: relative;
}
.top > .top-fixed-img {
  width: 100%;
  height: 1.07rem; /*39px*/
  position: fixed;
  top: 0;
  z-index: 1;
}
.top >.download-btn-wrap{
    width: 3.84rem; /*144px*/
  height: 1.52rem; /*57px*/
  position: absolute;
  /* position: relative; */
  top: 7.413rem; /*278px*/
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius:1.07rem;
  overflow: hidden;
}
.top >.download-btn-wrap>.download-btn {
  width: 3.84rem; /*144px*/
  height: 1.52rem; /*57px*/
  /* position: absolute; */
  /* position: relative; */
 /* top: 7.413rem;*/ /*278px*/
  /* left: 50%; */
  /* transform: translate(-50%, -50%); */
  /* transition: box-shadow 0.3s ease; */
  /* background: linear-gradient(to right, red, yellow);
  color: transparent;
  -webkit-background-clip: text; /* 为WebKit浏览器设置 *
  background-clip: text; /* 标准属性 *
  transition: background 0.3s ease; */
}
/* .element {
    transition: box-shadow 0.3s ease;
  } */

/* .top > .download-btn:hover {
  /* box-shadow: 0 0 10px rgba(255, 255, 255, 0.8); 白色发光效果 *
  background: linear-gradient(to right, red, yellow, green);
} */
 
.top>.download-btn-wrap::after {
    content: "";
    position: absolute;
    inset: -20%;
    background: linear-gradient(125deg,
            rgba(255, 255, 255, 0) 40%,
            rgba(255, 255, 255, 0.7),
            rgba(255, 255, 255, 0) 60%);
    animation: scan-wrap 2s infinite;
    transform: translateX(-20%);
}
@keyframes scan-wrap {
    to {
        transform: translateX(100%);
    }
}

.top > .join-now-btn,
.top > .proxy-btn {
  width: 2.35rem; /*88px*/
  height: 0.96rem; /*35px*/
  position: absolute;
  right: 1.87rem; /*70px*/
}
.top > .join-now-btn {
  top: 9.97rem; /*374px*/
}
.top > .proxy-btn {
  top: 11.2rem; /*420px*/
}
.middle {
  background-image: url(./imgs/middlebg.jpg);
  /* width:100%; */
  height: 14.8rem; /*555px*/
  background-size: cover;
  position: relative;
}
.middle > img {
  width: 5.65rem; /*212px*/
  height: 1.07rem; /*40px*/
  position: absolute;
  left: 50%;
  top: 48%;
  transform: translate(-50%, -50%);
}
.bottom {
  background-image: url(./imgs/bottombg.jpg);
  /* width:100%; */
  height: 13.33rem; /*499px*/
  background-size: cover;
  position: relative;
}
.bottom > img {
  width: 9.07rem; /*339px*/
  height: 1.07rem; /*40px*/
  position: fixed; /*absolute*/
  left: 50%;
  bottom: 8%; /*22%*/
  transform: translateX(-50%);
  /* transform: translate(-50%, -50%); */
}