.movetoRight {
  animation: moveRight 1s linear forwards;
}

.movetoLeft {
  animation: moveLeft 1s linear forwards;
}

.movetoBottom {
  animation: moveBottom .8s linear forwards;
}

@keyframes moveRight {
  0% {
    opacity: .1;
    transform: translateX(-.3rem);
  }

  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes moveLeft {
  0% {
    opacity: .1;
    transform: translateX(.3rem);
  }

  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes moveBottom {
  0% {
    opacity: .1;
    transform: translateY(-2rem);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/* pc样式 */
@media (min-width: 1025px) and (orientation: landscape) {
  body {
    min-width: 1200px;
    display: block;
    margin-top:12%;

  }

  .indexbody {
    height: 100%;
    background: #fff url(../img/bg@2x.png) center center no-repeat;
    background-size: cover;
  }

  .subbody {
    height: 100%;
    background: #fff;
    background-size: cover;
  }

  .header {
    width: 100%;
    min-height: 50px;
    margin-top:-12%;
    /* height: 15vh; */
    color: #ff6a02;
    padding: 0.05rem 0.45rem;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: Circular-Bold;
    position: relative;
    background:#fff;
    border-bottom:1px solid #000000;

  }

  .logo_box {
    height: 100%;
    display: flex;
    align-items: center;
  }

  .logo {
    height:0.235rem;
    margin-right: 0.0521rem;
  }

  .logo1 {
    height: 0.097rem;
    background-size:cover;
  }

  .logo_text {
    /* font-size: 40px; */
    font-size:0;
    width:0.633rem;
    height:0.2rem;
    background:url(../img/2@2x.png) no-repeat;
    background-size:cover;
  }

  .menu_mobile_icon {
    display: none;
  }

  .menu {
    position: fixed !important;
    width: 100%;
    bottom: 0;
    left: 0;
    justify-content: center;
    height: 0.40625rem;
    background-color:#fff;
    border-top:1px solid #000;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
    z-index:1000;
  }
  .menu1{
    
  }
  .menu_item {
    font-size: 0.086rem;
  }

  .menu_item2 {
    margin: 0 .31rem;
  }

  .menu_item3 {
    margin-right: .31rem;
  }

  .menu_item a {
    color:#000;
    font-family: Circular-Bold;
  }

  .content {
    position: relative;
    overflow-x: hidden;
    /* width: 1200px; */
    margin-bottom:100px;
    margin: 0 auto;
  }

  .rightbox {
    float: right;
    margin-top:13%;
    margin-right:15%;
  }

  .bigTitle {
    color: #000;
    font-size:0.34375rem;
    font-family: Circular-Bold;
  }

  .downbox {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top:0.18rem;
  }

  .downbox .link {
    display: inline-block;
    background:#000;
    border:2px solid rgba(255, 255, 255, 0.08);
    /* width: 155px; */
    padding: 0.045rem 0.08rem;
    /* height: 50px; */
    display: flex;
    justify-content: space-around;
    align-items: center;
    border-radius:0.08333rem;
  }

  .link .dimg {
    width:0.1rem;
    /* height:33px; */
    margin-right:0.0429rem;
    background-size:cover;
  }
  .infos{
    color:#fff;
    font-weight: normal !important;
  }
  .infos .mainTitle{
    font-size:0.062rem;
    margin-top:0.02rem;
  }
  .infos .subTitle{
    font-size:0.08rem;
    /* margin-top:-0.02rem; */
  }

  .left {
    box-sizing: border-box;
    margin-right: .1875rem;
    color: #ffffff;
    font-family: Circular-Bold;
    float: right;
    /* width: 3rem; */
    width: 47.5%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    height: 3rem;
    background: url(../img/combined-shape@3x.png) no-repeat center;
    background-size: 100% 100%;
    /* padding-top: .25rem; */
  }

  .left .home_title1 {
    width: 2.16rem;
    font-size: .21875rem;
    margin-bottom: 0.06rem;
    color: #ff6a02;
  }

  .left .home_title2 {
    font-size: .4375rem;
    margin-bottom: .31rem;
    color: #ff6a02;
    padding-left: .375rem;
  }

  .download_box {
    position: absolute;
    z-index: 9;
    right: 0.46875rem;
    top: 0.1953rem;
    display: flex;
    align-items: center;
    height: .25rem;
  }

  .download_box a {
    display: block;
  }

  .download_box a img {
    width: 0.832rem;
    height: .25rem;
    display: block;
  }

  .download_box .android {
    margin-right: .2rem;
  }

  .right {
    float: left;
    display: flex;
    align-items: baseline;
    padding-top: .3rem;
    padding-left: 1.36718rem;
    /* padding-right: 1.16rem; */
  }

  .right img:nth-of-type(1) {
    width: 1rem;
    position: relative;
    z-index: 2;
  }

  .right img:nth-of-type(2) {
    width: 0.8rem;
    margin-left: -.21rem;
    position: relative;
    z-index: 1;
  }

  /*协议样式*/
  .main_content {
    width: 3.84375rem;
    margin: 0 auto;
    /* color: #ffffff; */
    padding-bottom: .5rem;
  }

  .title {
    font-size: 0.15625rem;
    margin-bottom: 0.22rem;
    margin-top: 0.3rem;
    font-family: Circular-Bold;
    color: #000;
  }

  .title1 {
    font-family: Circular-Bold;
    font-size: 0.1rem;
    margin-bottom: 0.1rem;
    color: #000;
  }

  .text {
    margin-bottom: 0.2rem;
    color: #000;
  }

  .text div {
    font-size: 0.078rem;
    font-family: Circular-Book;
  }

  .text ul {
    padding-left: 0.117rem;
    font-size: 0.078rem;
    font-family: Circular-Book;
    margin-bottom: 0.1rem;

  }

  .text p {
    font-size: 0.078rem;
    font-family: Circular-Book;
    margin-bottom: 0.1rem;

  }

  .text p:nth-last-of-type() {
    margin-bottom: 0;
  }

  .menu_mobile_icon,
  .menu_mobile_box,
  .mask {
    display: none;
  }
}

@media (min-width: 415px) and (max-width: 768px),
(min-width: 415px) and (orientation: portrait) {}

@supports (bottom: constant(safe-area-inset-bottom)) or (bottom: env(safe-area-inset-bottom)) {
  .menu {
    padding-bottom: constant(safe-area-inset-bottom) !important;
    padding-bottom: env(safe-area-inset-bottom) !important;
  }
}

/* 移动端样式 */
@media (max-width: 1024px) {
  body {
    box-sizing: border-box;
    /* padding: .24rem 0; */
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
  }
  .indexbody {
    background: #fff url(../img/bgh5@2x.jpg)  no-repeat;
    background-size: cover;
  }

  .subbody {
    height: 100%;
    background: #fff;
    background-size: cover;
  }

  .header {
    position: relative;
    padding: .2rem .24rem;
    display:flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    border-bottom:1px solid #000;
  }

  .logo_box {
    display: flex;
    align-items: center;
    font-size: .32rem;
    color: #ffd500;
    max-width: 50%;
  }

  .logo {
    width: .56rem;
    height: .56rem;
    margin-right: .12rem;
  }
  .logo1 {
    width: 1.44rem;
    height: .32rem;
  }

  .logo_text {
    font-family: Circular-Bold;
    font-size:0;
    background:url(../img/2@2x.png) no-repeat;
    width:1.26rem;
    height:0.4rem;
    background-size:cover;
  }

  .menu_mobile_icon {
    width: 0.56rem;
    height: 0.56rem;
    z-index: 9;
    cursor: pointer;
  }

  .mask {
    position: fixed;
    z-index: 99;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .5);
    display: none;
  }

  .menu_mobile_box {
    width: 100%;
    height: 4rem;
    background-color: #fff;
    position: fixed;
    z-index: 100;
    left: 0rem;
    top: -4rem;
    border-radius: 0 0 .32rem .32rem;
  }

  .menu_mobile_con {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .menu_mobile_item {
    display: block;
    width: 100%;
    color: #000;
    text-align: center;
    font-size: .32rem;
    font-weight: bold;
    font-family: Circular-Bold;
    box-sizing: border-box;
    height: .96rem;
    line-height: .96rem;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-focus: none;
    -moz-user-select: none;
  }

  .menu_mobile_item:active {
    color: #ffffff;
  }

  .menu {
    padding: .16rem 0;
    position: fixed;
    z-index: 9;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #ff6a02;
    display: flex;
    align-items: center;
    flex-direction: column;
    display: none;
  }

  .menu_item {
    text-align: center;
    height: .68rem;
    line-height: .68rem;
  }

  .menu_item a {
    font-size: .28rem;
    font-weight: bold;
    color:#000;
    display: block;
  }

  .content {
    padding: 0 .4rem;
    position: relative;

  }

  .rightbox {
    width: 3.5rem;
    margin: 0 auto;
    margin-top: 8.5rem;
  }

  .bigTitle {
    /* width: 3.5rem; */
    margin:0 auto;
    color: #000;
    font-size:.66rem;
    font-family: Circular-Bold;
  }

  .downbox {
    margin-top:0.4rem;
    display: flex;
    /* justify-content: center; */
    align-items: center;
  }

  .downbox .link {
    display: inline-block;
    background:#000;
    border:2px solid rgba(255, 255, 255, 0.08);
    padding: .18rem .49rem;
    height:.58rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
    border-radius: .16rem;
  }

  .link .dimg {
    width:.29rem;
    height:.31rem;
    display:inline-block;
    margin-right:.1rem;
    background-size:cover;
  }
  .infos{
    color:#fff;
    font-weight: normal !important;
  }
  .infos .mainTitle{
    font-size:.14rem;
  }
  .infos .subTitle{
    font-size:.2rem;
    /* margin-top:-0.09rem; */
  }
  .main_content {
    padding-bottom: 3rem;
  }

  .home_title1 {
    width: 3.4rem;
    text-align: center;
    height: 1.12rem;
    margin: .56rem auto;
    margin-bottom: .16rem;
    font-family: Circular-Bold;
    font-size: .44rem;
    /* color: #b03df3; */
    color: #1e1e1e;
  }

  .home_title2 {
    font-family: Circular-Bold;
    font-size: .96rem;
    text-align: center;
    /* color: #b03df3; */
    color: #1e1e1e;
    padding-top: .54rem;
    padding-bottom: 2.14rem;
  }

  .download_box {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    /* top: 3.8rem; */
    top: 3.2rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9;
  }

  .android,
  .ios {
    width: 2.14rem;
    height: .64rem;
    display: none;
  }

  .android img,
  .ios img {
    width: 100%;
    height: 100%;
    display: block;
  }

  .right {
    padding: 0 .04rem;
    overflow: hidden;
    position: relative;
    height: 6.74rem;
    padding-bottom: .8rem;
  }

  .right img {
    width: 3.24rem;
    height: 6.74rem;
    position: absolute;
  }

  .right img:nth-of-type(1) {
    left: .48rem;
    top: 0;
    z-index: 2;
  }

  .right img:nth-of-type(2) {
    top: 0;
    left: 2.98rem;
    z-index: 1;
  }

  /* 协议条款的样式 */
  .title {
    padding-top: .64rem;
    padding-bottom: .48rem;
    /* color: #b03df3; */
    color: #000;
    font-size: .44rem;
    font-family: Circular-Bold;
  }

  .title1 {
    /* color: #b03df3; */
    color: #000;
    font-size: .32rem;
    font-family: Circular-Bold;
    margin-top: .64rem;
    margin-bottom: .32rem;
  }

  .text p,
  .text ul li {
    font-size: .28rem;
    /* color: #b03df3; */
    color: #000;
    font-family: Circular-Book;
  }

  .text p {
    margin-bottom: .48rem;
  }

  .text p:nth-last-of-type() {
    margin-bottom: 0;
  }
}