* {
  margin: 0;
  padding: 0;
}
@font-face {
  font-family: "SourceHanSansCNBold";
  src: url('../fonts/sourcehansanscn-bold.ttf') format("truetype");
}
@font-face {
  font-family: "SourceHanSansCNMedium";
  src: url('../fonts/sourcehansanscn-medium.ttf') format("truetype");
}
@font-face {
  font-family: "SourceHanSansCNRegular";
  src: url('../fonts/sourcehansanscn-regular.ttf') format("truetype");
}
@font-face {
  font-family: "SourceHanSerifCNBold";
  src: url('../fonts/SourceHanSerifCN-Bold.otf') format("opentype");
}
@font-face {
  font-family: "SourceHanSerifCNHeavy";
  src: url('../fonts/SourceHanSerifCN-Heavy.ttf') format("truetype");
}
html,
body {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
i {
  display: block;
  font-style: normal;
}
.content {
  width: 100%;
  height: 100vh;
}
.content .section {
  opacity: 0;
}
.content .section {
  max-width: 25.6rem;
  width: 100% !important;
  height: 10.8rem !important;
  overflow: hidden;
  margin: 0 auto;
}
.content .section .fp-tableCell {
  width: 19.2rem !important;
  height: 10.8rem !important;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 auto;
}
.content .section .fp-tableCell .title_i {
  width: 4.94rem;
  height: 2.3rem;
  background: url("../images/title_i.png");
  background-size: 100% 100%;
  position: absolute;
  left: -0.72rem;
  top: 0.66rem;
  z-index: 1;
}
.content .section .fp-tableCell .border_i {
  width: 109%;
  height: 10.8rem;
  background: url('../images/border.png');
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  z-index: 2;
}
.content .section .fp-tableCell .circle_icon {
  width: 7.06rem;
  height: 8.13rem;
  background: url('../images/circle_icon.png');
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  left: -3.4rem;
  z-index: 2;
}
.content .fp-section {
  height: 100% !important;
}
@keyframes scrollAni {
  0% {
    transform: translateY(0);
  }
  25% {
    transform: translateY(0.1rem);
  }
  50% {
    transform: translateY(0);
  }
  75% {
    transform: translateY(-0.1rem);
  }
  100% {
    transform: translateY(0);
  }
}
.content .scroll_i {
  width: 0.47rem;
  height: 0.58rem;
  background: url("../images/scroll.png");
  background-size: 100% 100%;
  animation: scrollAni 2s infinite linear;
  position: absolute;
  bottom: 0.4rem;
}
.content .page1 {
  background: url('../images/bg.jpg');
  background-size: cover;
  background-position: center center;
}
.content .page1 video {
  width: 100%;
  min-width: 19.2rem;
  max-width: 25.6rem;
  height: 10.8rem;
  position: absolute;
  top: 0;
  z-index: 0;
  object-fit: cover;
}
.content .page1 .fp-tableCell {
  z-index: 1;
}
.content .page1 .info_box {
  display: flex;
  flex-direction: column;
  font-size: 0.16rem;
  color: #3c3747;
  position: absolute;
  bottom: 0.3rem;
  right: 0.2rem;
}
.content .page1 .info_box a {
  color: #3c3747;
  margin-right: 0.12rem;
}
.content .page1 .nav_logo {
  width: 3.32rem;
  height: 1.4rem;
  background: url("../images/title.png");
  background-size: 100% 100%;
  position: absolute;
  top: 0.2rem;
  left: 0.2rem;
}
.content .page1 .nav_box {
  width: 4.17rem;
  height: 0.48rem;
  background: url("../images/nav_box2.png");
  background-size: 100% 100%;
  position: absolute;
  top: 0.46rem;
  right: 0.44rem;
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 0rem 0.1rem;
  box-sizing: border-box;
}
.content .page1 .nav_box i {
  transform: translateY(-0.03rem);
  cursor: pointer;
}
.content .page1 .nav_box i a {
  display: block;
  width: 100%;
  height: 100%;
}
.content .page1 .nav_box .music_btn {
  width: 0.36rem;
  height: 0.36rem;
  position: absolute;
  top: 0;
  left: -0.6rem;
  cursor: pointer;
}
.content .page1 .nav_box .music_on {
  background: url("../images/music_on.png");
  background-size: 100% 100%;
}
.content .page1 .nav_box .music_off {
  background: url("../images/music_off.png");
  background-size: 100% 100%;
}
.content .page1 .nav_box .vip {
  width: 0.28rem;
  height: 0.3rem;
  background: url("../images/vip.png");
  background-size: 100% 100%;
  cursor: pointer;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.content .page1 .nav_box .vip .vip_code {
  display: none;
  width: 2.34rem;
  height: 2.67rem;
  background: url("../images/vip_code.png");
  background-size: 100% 100%;
  position: absolute;
  top: 0.3rem;
  z-index: 2;
}
.content .page1 .nav_box .vip .vip_code a {
  display: block;
  width: 1.8rem;
  height: 0.4rem;
  margin: 0 auto;
  margin-top: 2.04rem;
}
.content .page1 .nav_box .vip:hover .vip_code {
  display: block;
}
.content .page1 .nav_box .qw {
  width: 0.36rem;
  height: 0.3rem;
  background: url("../images/qw.png");
  background-size: 100% 100%;
  cursor: pointer;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.content .page1 .nav_box .qw .qw_code {
  display: none;
  width: 2.34rem;
  height: 2.37rem;
  background: url("../images/qw_code.png");
  background-size: 100% 100%;
  position: absolute;
  top: 0.4rem;
}
.content .page1 .nav_box .qw:hover .qw_code {
  display: block;
}
.content .page1 .nav_box .wx {
  width: 0.27rem;
  height: 0.22rem;
  background: url("../images/wx.png");
  background-size: 100% 100%;
  cursor: pointer;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.content .page1 .nav_box .wx .wx_code {
  display: none;
  width: 2.34rem;
  height: 2.37rem;
  background: url("../images/wx_code.png");
  background-size: 100% 100%;
  position: absolute;
  top: 0.4rem;
}
.content .page1 .nav_box .wx:hover .wx_code {
  display: block;
}
.content .page1 .nav_box .titok {
  width: 0.21rem;
  height: 0.25rem;
  background: url("../images/titok.png");
  background-size: 100% 100%;
}
.content .page1 .nav_box .community {
  width: 0.33rem;
  height: 0.29rem;
  background: url("../images/community.png");
  background-size: 100% 100%;
}
.content .page1 .nav_box .qq {
  width: 0.21rem;
  height: 0.23rem;
  background: url("../images/qq.png");
  background-size: 100% 100%;
}
.content .page1 .nav_box .tap {
  width: 0.35rem;
  height: 0.21rem;
  background: url("../images/taptap.png");
  background-size: 100% 100%;
}
.content .page1 .nav_box .bili {
  width: 0.26rem;
  height: 0.23rem;
  background: url("../images/bili.png");
  background-size: 100% 100%;
}
.content .page1 .nav_box .wb {
  width: 0.24rem;
  height: 0.22rem;
  background: url("../images/wb.png");
  background-size: 100% 100%;
}
.content .page1 .user_box {
  width: 2.6rem;
  display: none;
  justify-content: space-between;
  position: absolute;
  top: 1rem;
  right: 0.4rem;
  z-index: 3;
}
.content .page1 .user_box span {
  font-size: 0.24rem;
  color: #000;
}
.content .page1 .user_box .quit {
  cursor: pointer;
}
.content .page1 .play {
  width: 1.05rem;
  height: 1.05rem;
  background: url("../images/play.png");
  background-size: 100% 100%;
  cursor: pointer;
  z-index: 2;
  position: absolute;
  left: 12.6rem;
  top: 5.2rem;
}
.content .page1 .logo {
  width: 10.29rem;
  height: 8.12rem;
  background: url("../images/logo.png");
  background-size: 100% 100%;
  position: absolute;
  top: 2.6rem;
}
.content .page1 .logo .look_btn {
  width: 0.66rem;
  height: 0.22rem;
  position: absolute;
  right: 2.76rem;
  bottom: 1.5rem;
  cursor: pointer;
}
.content .page1 .btn_box_bg {
  width: 10.35rem;
  height: 3.23rem;
  position: absolute;
  bottom: 0.2rem;
}
.content .page1 .btn_box {
  transform: translateX(0.2rem);
  margin-top: 7.8rem;
  display: flex;
  align-items: flex-end;
  z-index: 2;
}
.content .page1 .btn_box .qr_code {
  width: 1.92rem;
  height: 1.52rem;
  background: url("../images/qr_code.png");
  background-size: 100% 100%;
}
.content .page1 .btn_box a {
  display: block;
  width: 100%;
  height: 100%;
}
@keyframes regAni {
  0% {
    background: url("../images/1.png");
    background-size: 100% 100%;
  }
  5% {
    background: url("../images/2.png");
    background-size: 100% 100%;
  }
  10% {
    background: url("../images/3.png");
    background-size: 100% 100%;
  }
  15% {
    background: url("../images/4.png");
    background-size: 100% 100%;
  }
  20% {
    background: url("../images/5.png");
    background-size: 100% 100%;
  }
  25% {
    background: url("../images/6.png");
    background-size: 100% 100%;
  }
  30% {
    background: url("../images/7.png");
    background-size: 100% 100%;
  }
  35% {
    background: url("../images/8.png");
    background-size: 100% 100%;
  }
  40% {
    background: url("../images/9.png");
    background-size: 100% 100%;
  }
  45% {
    background: url("../images/10.png");
    background-size: 100% 100%;
  }
  50% {
    background: url("../images/11.png");
    background-size: 100% 100%;
  }
  55% {
    background: url("../images/12.png");
    background-size: 100% 100%;
  }
  60% {
    background: url("../images/13.png");
    background-size: 100% 100%;
  }
  65% {
    background: url("../images/14.png");
    background-size: 100% 100%;
  }
  70% {
    background: url("../images/15.png");
    background-size: 100% 100%;
  }
  75% {
    background: url("../images/16.png");
    background-size: 100% 100%;
  }
  80% {
    background: url("../images/17.png");
    background-size: 100% 100%;
  }
  85% {
    background: url("../images/18.png");
    background-size: 100% 100%;
  }
  90% {
    background: url("../images/19.png");
    background-size: 100% 100%;
  }
  95% {
    background: url("../images/20.png");
    background-size: 100% 100%;
  }
  100% {
    background: url("../images/21.png");
    background-size: 100% 100%;
  }
}
.content .page1 .btn_box .d_box {
  margin: 0 0.1rem;
}
.content .page1 .btn_box .d_box .android,
.content .page1 .btn_box .d_box .ios {
  width: 2.48rem;
  height: 0.69rem;
  cursor: pointer;
  margin: 0 0.05rem;
}
.content .page1 .btn_box .d_box .ios {
  background: url('../images/ios.png');
  background-size: 100% 100%;
  margin-bottom: 0.16rem;
}
.content .page1 .btn_box .d_box .android {
  background: url('../images/android.png');
  background-size: 100% 100%;
}
.content .page1 .btn_box .pc {
  width: 1.61rem;
  height: 1.54rem;
  background: url('../images/pc.png');
  background-size: 100% 100%;
  position: relative;
}
.content .page1 .btn_box .pc .download_i {
  width: 1.22rem;
  height: 0.89rem;
  background: url('../images/download_i.png');
  background-size: 100% 100%;
  position: absolute;
  right: -0.3rem;
  top: -0.36rem;
}
.content .page1 .btn_box .recharge_btn {
  width: 2.48rem;
  height: 0.69rem;
  background: url('../images/recharge.png');
  background-size: 100% 100%;
  position: relative;
  margin: 0 0.1rem;
}
.content .page1 .btn_box .recharge_btn .recharge_i {
  width: 2.58rem;
  height: 1.28rem;
  background: url('../images/recharge_i_1.png');
  background-size: 100% 100%;
  position: absolute;
  top: -1.2rem;
}
.content .page1 .btn_box .actv_link {
  width: 2.83rem;
  height: 1.93rem;
  background: url('../images/actv_link.png');
  background-size: 100% 100%;
}
.content .page1 .btn_box .actv_link a {
  display: block;
  width: 100%;
  height: 100%;
}
.content .page1 .btn_box .gift {
  width: 1.59rem;
  height: 1.91rem;
  background: url('../images/gift.png');
  background-size: 100% 100%;
}
@keyframes androidAni {
  0% {
    background: url("../images/1.png");
    background-size: 100% 100%;
  }
  5.88% {
    background: url("../images/2.png");
    background-size: 100% 100%;
  }
  11.76% {
    background: url("../images/3.png");
    background-size: 100% 100%;
  }
  17.64% {
    background: url("../images/4.png");
    background-size: 100% 100%;
  }
  23.52% {
    background: url("../images/5.png");
    background-size: 100% 100%;
  }
  29.41% {
    background: url("../images/6.png");
    background-size: 100% 100%;
  }
  35.29% {
    background: url("../images/7.png");
    background-size: 100% 100%;
  }
  41.17% {
    background: url("../images/8.png");
    background-size: 100% 100%;
  }
  47.05% {
    background: url("../images/9.png");
    background-size: 100% 100%;
  }
  52.94% {
    background: url("../images/10.png");
    background-size: 100% 100%;
  }
  58.82% {
    background: url("../images/11.png");
    background-size: 100% 100%;
  }
  64.70% {
    background: url("../images/12.png");
    background-size: 100% 100%;
  }
  70.58% {
    background: url("../images/13.png");
    background-size: 100% 100%;
  }
  76.47% {
    background: url("../images/14.png");
    background-size: 100% 100%;
  }
  82.35% {
    background: url("../images/15.png");
    background-size: 100% 100%;
  }
  88.23% {
    background: url("../images/16.png");
    background-size: 100% 100%;
  }
  94.11% {
    background: url("../images/17.png");
    background-size: 100% 100%;
  }
  100% {
    background: url("../images/1.png");
    background-size: 100% 100%;
  }
}
.content .page1 .reg_box {
  z-index: 2;
  width: 3.32rem;
  height: 0.41rem;
  background: url("../images/reg_bg.png");
  background-size: 100% 100%;
  opacity: 0.8;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.18rem;
  color: #FFFFFF;
  font-family: SourceHanSansCNRegular;
  position: absolute;
  left: 2.4rem;
  bottom: 0.9rem;
}
.content .page1 .reg_box span:nth-child(2) {
  font-family: SourceHanSansCNBold;
  color: #FFD193;
}
.content .page1 .scroll_i {
  background: url("../images/scroll.png");
  background-size: 100% 100%;
  bottom: 0.24rem;
}
.content .page8 {
  background: url('../images/p_bg.jpg');
  background-size: cover;
  background-position: center center;
}
.content .page8 video {
  width: 25.6rem;
  height: 10.8rem;
  position: absolute;
  bottom: 0;
  left: -3.2rem;
  z-index: 1;
}
.content .page8 .bg_i {
  width: 22.84rem;
  height: 10.8rem;
  background: url('../images/bg_i.png');
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  left: 0;
}
.content .page8 .title {
  width: 4.94rem;
  height: 2.3rem;
  background: url("../images/title.png");
  background-size: 100% 100%;
  position: absolute;
  left: -0.72rem;
  top: 0.66rem;
  z-index: 2;
}
.content .page8 .card_box {
  width: 14.28rem;
  height: 6.79rem;
  position: absolute;
  z-index: 3;
  top: 2.24rem;
  left: 3.3rem;
  display: flex;
  justify-content: space-between;
}
.content .page8 .card_box .card_q {
  width: 3.14rem;
  height: 6.18rem;
}
.content .page8 .card_box .card_q a {
  display: block;
  width: 100%;
  height: 100%;
}
.content .page8 .card_box .q_1 {
  background: url('../images/q_1.png');
  background-size: 100% 100%;
  margin-top: 0.61rem;
}
.content .page8 .card_box .q_2 {
  background: url('../images/q_2.png');
  background-size: 100% 100%;
}
.content .page8 .card_box .q_3 {
  background: url('../images/q_3.png');
  background-size: 100% 100%;
  margin-top: 0.61rem;
}
.content .page8 .card_box .q_4 {
  background: url('../images/q_4.png');
  background-size: 100% 100%;
}
.content .page8 .icon_1 {
  width: 4.86rem;
  height: 3.5rem;
  background: url('../images/icon_1.png');
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: -1.2rem;
  z-index: 2;
}
.content .page4 {
  background: url('../images/p_bg.jpg');
  background-size: cover;
  background-position: center center;
}
.content .page4 video {
  width: 25.6rem;
  height: 10.8rem;
  position: absolute;
  bottom: 0;
  left: -3.2rem;
  z-index: 1;
}
.content .page4 .icon_1 {
  width: 5.25rem;
  height: 3.81rem;
  background: url('../images/icon_1.png');
  background-size: 100% 100%;
  position: absolute;
  z-index: 2;
  bottom: 0.62rem;
  left: -1.82rem;
}
.content .page4 .title {
  width: 4.94rem;
  height: 2.3rem;
  background: url("../images/title.png");
  background-size: 100% 100%;
  position: absolute;
  left: -0.72rem;
  top: 0.66rem;
  z-index: 2;
}
.content .page4 .line {
  width: 5.42rem;
  height: 0.18rem;
  background: url("../images/line.png");
  background-size: 100% 100%;
  position: absolute;
  left: 3.54rem;
  top: 4.81rem;
  display: flex;
  justify-content: center;
  z-index: 3;
}
.content .page4 .line .info_box {
  width: 100%;
  display: flex;
  flex-direction: column;
  position: absolute;
  top: 0.4rem;
}
.content .page4 .line .info_box .info_t {
  display: flex;
  align-items: center;
}
.content .page4 .line .info_box .info_t span {
  font-weight: bold;
  font-size: 0.24rem;
  color: #5D7294;
  font-family: SourceHanSansCNMedium;
  margin-left: 0.07rem;
}
.content .page4 .line .info_box .info_b {
  width: 140%;
  font-weight: 500;
  font-size: 0.2rem;
  color: #5D7294;
  font-family: SourceHanSansCNMedium;
  margin-top: 0.22rem;
}
.content .page4 .line .text_box {
  width: 4.28rem;
  height: 0.84rem;
  background: url('../images/text_box1.png');
  background-size: 100% 100%;
  position: absolute;
  top: 1.88rem;
}
.content .page4 .line .text_box .career_btn {
  width: 0.84rem;
  height: 0.84rem;
  position: absolute;
  top: -0.02rem;
  left: 0.22rem;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 0.2rem;
  color: #F1ECDE;
  font-family: SourceHanSerifCNBold;
}
.content .page4 .line .text_box .text {
  width: 2.58rem;
  height: 0.5rem;
  position: absolute;
  top: 0.16rem;
  left: 1.1rem;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  font-size: 0.28rem;
  color: #F1ECDE;
  font-family: SourceHanSerifCNBold;
  white-space: nowrap;
}
.content .page4 .hero1_line .hero_name {
  width: 3.49rem;
  height: 2.53rem;
  background: url("../images/hero1_name.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0.18rem;
}
.content .page4 .hero1_line .hero_name_i {
  width: 3.49rem;
  height: 2.53rem;
  background: url("../images/hero1_name_i.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0.18rem;
}
.content .page4 .hero1_line .hero_name_1_1 {
  background: url("../images/1_1.png");
  background-size: 100% 100%;
}
.content .page4 .hero1_line .hero_name_1_2 {
  background: url("../images/1_2.png");
  background-size: 100% 100%;
}
.content .page4 .hero1_line .hero_name_1_3 {
  background: url("../images/1_3.png");
  background-size: 100% 100%;
}
.content .page4 .hero1_line .hero_icon {
  width: 0.3rem;
  height: 0.27rem;
  background: url("../images/hero1-icon.png");
  background-size: 100% 100%;
}
.content .page4 .hero2_line .hero_name {
  width: 3.56rem;
  height: 2.53rem;
  background: url("../images/hero2_name.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0.18rem;
}
.content .page4 .hero2_line .hero_name_i {
  width: 3.56rem;
  height: 2.53rem;
  background: url("../images/hero2_name_i.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0.18rem;
}
.content .page4 .hero2_line .hero_name_2_1 {
  background: url("../images/2_1.png");
  background-size: 100% 100%;
}
.content .page4 .hero2_line .hero_name_2_2 {
  background: url("../images/2_2.png");
  background-size: 100% 100%;
}
.content .page4 .hero2_line .hero_name_2_3 {
  background: url("../images/2_3.png");
  background-size: 100% 100%;
}
.content .page4 .hero2_line .hero_icon {
  width: 0.24rem;
  height: 0.29rem;
  background: url("../images/hero2-icon.png");
  background-size: 100% 100%;
}
.content .page4 .hero3_line .text_box .text {
  font-size: 0.24rem;
}
.content .page4 .hero3_line .hero_name {
  width: 4.13rem;
  height: 2.78rem;
  background: url("../images/hero3_name.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0.18rem;
}
.content .page4 .hero3_line .hero_name_i {
  width: 4.13rem;
  height: 2.78rem;
  background: url("../images/hero3_name_i.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0.18rem;
}
.content .page4 .hero3_line .hero_name_3_1 {
  background: url("../images/3_1.png");
  background-size: 100% 100%;
}
.content .page4 .hero3_line .hero_name_3_2 {
  background: url("../images/3_2.png");
  background-size: 100% 100%;
}
.content .page4 .hero3_line .hero_name_3_3 {
  background: url("../images/3_3.png");
  background-size: 100% 100%;
}
.content .page4 .hero3_line .hero_name_3_4 {
  background: url("../images/3_4.png");
  background-size: 100% 100%;
}
.content .page4 .hero3_line .hero_name_3_5 {
  background: url("../images/3_5.png");
  background-size: 100% 100%;
}
.content .page4 .hero3_line .hero_icon {
  width: 0.3rem;
  height: 0.29rem;
  background: url("../images/hero3-icon.png");
  background-size: 100% 100%;
}
.content .page4 .hero4_line .hero_name {
  width: 2.53rem;
  height: 2.4rem;
  background: url("../images/hero4_name.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0.18rem;
}
.content .page4 .hero4_line .hero_name_i {
  width: 2.43rem;
  height: 2.4rem;
  background: url("../images/hero4_name_i.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0.18rem;
}
.content .page4 .hero4_line .hero_name_4_1 {
  background: url("../images/4_1.png");
  background-size: 100% 100%;
}
.content .page4 .hero4_line .hero_name_4_2 {
  background: url("../images/4_2.png");
  background-size: 100% 100%;
}
.content .page4 .hero4_line .hero_name_4_3 {
  background: url("../images/4_3.png");
  background-size: 100% 100%;
}
.content .page4 .hero4_line .hero_icon {
  width: 0.27rem;
  height: 0.28rem;
  background: url("../images/hero4-icon.png");
  background-size: 100% 100%;
}
.content .page4 .hero5_line .hero_name {
  width: 2.4rem;
  height: 2.56rem;
  background: url("../images/hero5_name.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0.18rem;
}
.content .page4 .hero5_line .hero_name_i {
  width: 2.4rem;
  height: 2.56rem;
  background: url("../images/hero5_name_i.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0.18rem;
}
.content .page4 .hero5_line .hero_name_5_1 {
  background: url("../images/5_1.png");
  background-size: 100% 100%;
}
.content .page4 .hero5_line .hero_name_5_2 {
  background: url("../images/5_2.png");
  background-size: 100% 100%;
}
.content .page4 .hero5_line .hero_name_5_3 {
  background: url("../images/5_3.png");
  background-size: 100% 100%;
}
.content .page4 .hero5_line .hero_icon {
  width: 0.23rem;
  height: 0.28rem;
  background: url("../images/hero5-icon.png");
  background-size: 100% 100%;
}
.content .page4 .hero6_line .hero_name {
  width: 3.9rem;
  height: 2.28rem;
  background: url("../images/hero6_name.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0.18rem;
}
.content .page4 .hero6_line .hero_name_i {
  width: 3.9rem;
  height: 2.28rem;
  background: url("../images/hero6_name_i.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0.18rem;
}
.content .page4 .hero6_line .hero_name_6_1 {
  background: url("../images/6_1.png");
  background-size: 100% 100%;
}
.content .page4 .hero6_line .hero_name_6_2 {
  background: url("../images/6_2.png");
  background-size: 100% 100%;
}
.content .page4 .hero6_line .hero_name_6_3 {
  background: url("../images/6_3.png");
  background-size: 100% 100%;
}
.content .page4 .hero6_line .hero_icon {
  width: 0.28rem;
  height: 0.3rem;
  background: url("../images/hero6-icon.png");
  background-size: 100% 100%;
}
.content .page4 .hero_people {
  z-index: 2;
}
.content .page4 .hero1 {
  width: 11.08rem;
  height: 9.82rem;
  background: url("../images/hero1.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero1_1 {
  width: 16.8rem;
  height: 9.98rem;
  background: url("../images/hero1_1.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero1_2 {
  width: 11.8rem;
  height: 10.06rem;
  background: url("../images/hero1_2.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero1_3 {
  width: 19.2rem;
  height: 10.8rem;
  background: url("../images/hero1_3.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero2 {
  width: 15.89rem;
  height: 10.48rem;
  background: url("../images/hero2.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero2_1 {
  width: 16.91rem;
  height: 9.64rem;
  background: url("../images/hero2_1.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero2_2 {
  width: 14.61rem;
  height: 10.13rem;
  background: url("../images/hero2_2.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero2_3 {
  width: 19.2rem;
  height: 10.8rem;
  background: url("../images/hero2_3.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero3 {
  width: 11.22rem;
  height: 9.75rem;
  background: url("../images/hero3.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero3_1 {
  width: 14.36rem;
  height: 10.8rem;
  background: url("../images/hero3_1.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero3_2 {
  width: 15.31rem;
  height: 10.53rem;
  background: url("../images/hero3_2.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero3_3 {
  width: 14.82rem;
  height: 9.89rem;
  background: url("../images/hero3_3.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero3_4 {
  width: 19.2rem;
  height: 10.8rem;
  background: url("../images/hero3_4.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero3_5 {
  width: 19.2rem;
  height: 10.8rem;
  background: url("../images/hero3_5.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero4 {
  width: 11.89rem;
  height: 10.8rem;
  background: url("../images/hero4.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0rem;
}
.content .page4 .hero4_1 {
  width: 15.67rem;
  height: 10.33rem;
  background: url("../images/hero4_1.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero4_2 {
  width: 13.35rem;
  height: 9.95rem;
  background: url("../images/hero4_2.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero4_3 {
  width: 19.2rem;
  height: 10.8rem;
  background: url("../images/hero4_3.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero5 {
  width: 11.71rem;
  height: 9.7rem;
  background: url("../images/hero5.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0rem;
}
.content .page4 .hero5_1 {
  width: 19.2rem;
  height: 10.8rem;
  background: url("../images/hero5_1.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero5_2 {
  width: 19.2rem;
  height: 10.8rem;
  background: url("../images/hero5_2.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero5_3 {
  width: 19.2rem;
  height: 10.8rem;
  background: url("../images/hero5_3.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero6 {
  width: 10.79rem;
  height: 10.61rem;
  background: url("../images/hero6.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero6_1 {
  width: 13.41rem;
  height: 10.43rem;
  background: url("../images/hero6_1.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero6_2 {
  width: 12.07rem;
  height: 10.02rem;
  background: url("../images/hero6_2.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .hero6_3 {
  width: 19.2rem;
  height: 10.8rem;
  background: url("../images/hero6_3.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.content .page4 .slide_nav {
  width: 3.42rem;
  height: 7.42rem;
  background: url("../images/slide.png");
  background-size: 100% 100%;
  position: absolute;
  right: -1.58rem;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  /* Calculate the rotation for each circle based on the total angle of 102 degrees */
}
.content .page4 .slide_nav .circle-container {
  position: absolute;
  top: -0.3rem;
  left: -0.5rem;
  width: 7.8rem;
  height: 7.8rem;
  /* Half of the diameter */
  border-radius: 50%;
  transform: rotate(-47.6deg);
  /* Half of the total angle to align first circle */
}
.content .page4 .slide_nav .circle {
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform-origin: 0 0;
  cursor: pointer;
  /* Rotate around the top left corner of the circle */
}
.content .page4 .slide_nav .circle .circle_i {
  width: 0.8rem;
  height: 0.8rem;
}
.content .page4 .slide_nav .circle:nth-child(1) {
  transform: rotate(95deg) translateX(-3.9rem) translateY(-0.4rem);
}
.content .page4 .slide_nav .circle:nth-child(1) .circle_i {
  background: url("../images/1.png");
  background-size: 100% 100%;
  transform: rotate(-47.6deg);
}
.content .page4 .slide_nav .circle:nth-child(1) .circle_i.on {
  background: url("../images/1-1.png");
  background-size: 100% 100%;
}
.content .page4 .slide_nav .circle:nth-child(2) {
  transform: rotate(76deg) translateX(-3.9rem) translateY(-0.4rem);
}
.content .page4 .slide_nav .circle:nth-child(2) .circle_i {
  background: url("../images/2.png");
  background-size: 100% 100%;
  transform: rotate(-28.6deg);
}
.content .page4 .slide_nav .circle:nth-child(2) .circle_i.on {
  background: url("../images/2-1.png");
  background-size: 100% 100%;
}
.content .page4 .slide_nav .circle:nth-child(3) {
  transform: rotate(57deg) translateX(-3.9rem) translateY(-0.4rem);
}
.content .page4 .slide_nav .circle:nth-child(3) .circle_i {
  background: url("../images/3.png");
  background-size: 100% 100%;
  transform: rotate(-9.6deg);
}
.content .page4 .slide_nav .circle:nth-child(3) .circle_i.on {
  background: url("../images/3-1.png");
  background-size: 100% 100%;
}
.content .page4 .slide_nav .circle:nth-child(4) {
  transform: rotate(38deg) translateX(-3.9rem) translateY(-0.4rem);
}
.content .page4 .slide_nav .circle:nth-child(4) .circle_i {
  background: url("../images/4.png");
  background-size: 100% 100%;
  transform: rotate(10.6deg);
}
.content .page4 .slide_nav .circle:nth-child(4) .circle_i.on {
  background: url("../images/4-1.png");
  background-size: 100% 100%;
}
.content .page4 .slide_nav .circle:nth-child(5) {
  transform: rotate(19deg) translateX(-3.9rem) translateY(-0.4rem);
}
.content .page4 .slide_nav .circle:nth-child(5) .circle_i {
  background: url("../images/5.png");
  background-size: 100% 100%;
  transform: rotate(29.6deg);
}
.content .page4 .slide_nav .circle:nth-child(5) .circle_i.on {
  background: url("../images/5-1.png");
  background-size: 100% 100%;
}
.content .page4 .slide_nav .circle:nth-child(6) {
  transform: rotate(0deg) translateX(-3.9rem) translateY(-0.4rem);
}
.content .page4 .slide_nav .circle:nth-child(6) .circle_i {
  background: url("../images/6.png");
  background-size: 100% 100%;
  transform: rotate(48.6deg);
}
.content .page4 .slide_nav .circle:nth-child(6) .circle_i.on {
  background: url("../images/6-1.png");
  background-size: 100% 100%;
}
.content .page5 {
  background: url('../images/p_bg.jpg');
  background-size: cover;
  background-position: center center;
}
.content .page5 video {
  width: 25.6rem;
  height: 10.8rem;
  position: absolute;
  bottom: 0;
  left: -3.2rem;
  z-index: 1;
}
.content .page5 .title {
  width: 4.94rem;
  height: 2.3rem;
  background: url("../images/title1.png");
  background-size: 100% 100%;
  position: absolute;
  left: -0.72rem;
  top: 0.66rem;
  z-index: 2;
}
.content .page5 .fp-tableCell {
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.content .page5 .left_part {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}
.content .page5 .right_part {
  width: 5.8rem;
  height: 3.8rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  z-index: 3;
}
.content .page5 .right_part .tab_box {
  width: 100%;
  height: 0.48rem;
  border-bottom: 0.02rem solid rgba(77, 102, 133, 0.3);
  display: flex;
  align-items: center;
  position: relative;
}
.content .page5 .right_part .tab_box .tab_item {
  width: 0.62rem;
  height: 0.48rem;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  font-size: 0.22rem;
  color: #666666;
  margin-right: 0.3rem;
  cursor: pointer;
}
.content .page5 .right_part .tab_box .tab_item.on {
  border-bottom: 0.04rem solid #4D6685;
}
.content .page5 .right_part .tab_box .more_btn {
  width: 0.23rem;
  height: 0.23rem;
  background: url('../images/more.png');
  background-size: 100% 100%;
  position: absolute;
  right: 0;
  cursor: pointer;
}
.content .page5 .right_part .tab_box .more_btn a {
  width: 100%;
  height: 100%;
  display: block;
}
.content .page5 .right_part .news_list {
  width: 100%;
  height: 3rem;
}
.content .page5 .right_part .news_list a {
  text-decoration: none;
}
.content .page5 .right_part .news_list .news_item {
  width: 100%;
  height: 0.6rem;
  border-bottom: 0.01rem solid rgba(77, 102, 133, 0.3);
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  box-sizing: border-box;
  cursor: pointer;
}
.content .page5 .right_part .news_list .news_item .text {
  width: 4.3rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.content .page5 .right_part .news_list .news_item .text:hover {
  text-decoration: underline;
}
.content .page5 .right_part .news_list .news_item span {
  font-weight: bold;
  font-size: 0.18rem;
  color: #4D6685;
  transform: translateY(-0.1rem);
}
.content .page5 .ani_box {
  width: 9.15rem;
  height: 5.06rem;
  position: absolute;
  cursor: pointer;
  z-index: 2;
  top: 0rem;
  /* background: url('../images/1.png'), url("https://media.zlongame.com/media/pictures/cn/ro/index/img/page4/ani/2.png"), url("https://media.zlongame.com/media/pictures/cn/ro/index/img/page4/ani/3.png"), url("https://media.zlongame.com/media/pictures/cn/ro/index/img/page4/ani/4.png"), url("https://media.zlongame.com/media/pictures/cn/ro/index/img/page4/ani/5.png"), url("https://media.zlongame.com/media/pictures/cn/ro/index/img/page4/ani/6.png"), url("https://media.zlongame.com/media/pictures/cn/ro/index/img/page4/ani/7.png"), url("https://media.zlongame.com/media/pictures/cn/ro/index/img/page4/ani/8.png"), url("https://media.zlongame.com/media/pictures/cn/ro/index/img/page4/ani/9.png"), url("https://media.zlongame.com/media/pictures/cn/ro/index/img/page4/ani/10.png"), url("https://media.zlongame.com/media/pictures/cn/ro/index/img/page4/ani/11.png"), url("https://media.zlongame.com/media/pictures/cn/ro/index/img/page4/ani/12.png"), url("https://media.zlongame.com/media/pictures/cn/ro/index/img/page4/ani/13.png"), url("https://media.zlongame.com/media/pictures/cn/ro/index/img/page4/ani/14.png"), url("https://media.zlongame.com/media/pictures/cn/ro/index/img/page4/ani/15.png"), url("https://media.zlongame.com/media/pictures/cn/ro/index/img/page4/ani/16.png"), url("https://media.zlongame.com/media/pictures/cn/ro/index/img/page4/ani/17.png"); */
  background-size: 100% 100%;
  opacity: 0;
}
.content .page5 .ani_box_i {
  animation: newAni 1s 1 linear;
}
@keyframes newAni {
 
}
.content .page5 .Swiper_4 {
  width: 9.15rem;
  height: 5.06rem;
  overflow: hidden;
}
.content .page5 .Swiper_4 img {
  width: 100%;
  height: 100%;
}
.content .page5 .btn_box {
  margin-top: -0.2rem;
  width: 11.6rem;
  display: flex;
  flex-direction: column;
  z-index: 3;
  cursor: pointer;
}
.content .page5 .btn_box .title_box {
  width: 100%;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.content .page5 .btn_box .title_box .title_t {
  max-width: 90%;
  font-weight: 800;
  font-size: 0.26rem;
  color: #744C37;
  font-family: SourceHanSerifCNHeavy;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.content .page5 .btn_box .title_box .more_btn {
  width: 0.23rem;
  height: 0.23rem;
  background: url("../images/more.png");
  background-size: 100% 100%;
  margin-left: 0.32rem;
}
.content .page5 .btn_box .title_box:hover span {
  text-decoration: underline;
}
.content .page5 .btn_box .desc {
  max-width: 100%;
  font-weight: 600;
  font-size: 0.2rem;
  font-family: SourceHanSerifCNHeavy;
  color: #A58F83;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 0.1rem;
}
.content .page5 .btn_box .time {
  font-weight: 800;
  font-size: 0.16rem;
  color: #A58F83;
  font-family: SourceHanSerifCNHeavy;
  margin-top: 0.1rem;
}
.content .page5 .swiper-pagination {
  width: 1.64rem;
  max-width: 4.28rem;
  position: static;
  display: flex;
  justify-content: center;
  margin-top: 0.1rem;
}
.content .page5 .swiper-pagination .my-bullet {
  flex-shrink: 0;
  width: 0.14rem;
  height: 0.14rem;
  border-radius: 50%;
  border: 0.02rem solid #784F39;
  margin: 0 0.1rem;
  cursor: pointer;
}
.content .page5 .swiper-pagination .my-bullet-active {
  width: 0.14rem;
  height: 0.14rem;
  border-radius: 50%;
  background-color: #784F39;
}
.content .page5 .icon_1 {
  width: 4.45rem;
  height: 4.12rem;
  background: url("../images/icon_1.png");
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: -0.8rem;
  z-index: 2;
}
.content .page5 .icon_2 {
  width: 3.2rem;
  height: 1.2rem;
  position: absolute;
  bottom: 0.36rem;
  left: 0.16rem;
  animation: birdAni 2s infinite linear;
  z-index: 2;
}
.content .page5 .icon_3 {
  width: 6.72rem;
  height: 7.58rem;
  background: url("../images/icon_3.png");
  background-size: 100% 100%;
  position: absolute;
  right: -3.2rem;
  top: 1rem;
  z-index: 2;
}
@keyframes birdAni {
  0% {
    background: url("../images/1.png");
    background-size: 100% 100%;
  }
  2.78% {
    background: url("../images/2.png");
    background-size: 100% 100%;
  }
  5.56% {
    background: url("../images/3.png");
    background-size: 100% 100%;
  }
  8.33% {
    background: url("../images/4.png");
    background-size: 100% 100%;
  }
  11.11% {
    background: url("../images/5.png");
    background-size: 100% 100%;
  }
  13.89% {
    background: url("../images/6.png");
    background-size: 100% 100%;
  }
  16.67% {
    background: url("../images/7.png");
    background-size: 100% 100%;
  }
  19.44% {
    background: url("../images/8.png");
    background-size: 100% 100%;
  }
  22.22% {
    background: url("../images/9.png");
    background-size: 100% 100%;
  }
  25% {
    background: url("../images/10.png");
    background-size: 100% 100%;
  }
  27.78% {
    background: url("../images/11.png");
    background-size: 100% 100%;
  }
  30.56% {
    background: url("../images/12.png");
    background-size: 100% 100%;
  }
  33.33% {
    background: url("../images/13.png");
    background-size: 100% 100%;
  }
  36.11% {
    background: url("../images/14.png");
    background-size: 100% 100%;
  }
  38.89% {
    background: url("../images/15.png");
    background-size: 100% 100%;
  }
  41.67% {
    background: url("../images/16.png");
    background-size: 100% 100%;
  }
  44.44% {
    background: url("../images/17.png");
    background-size: 100% 100%;
  }
  47.22% {
    background: url("../images/18.png");
    background-size: 100% 100%;
  }
  50% {
    background: url("../images/19.png");
    background-size: 100% 100%;
  }
  52.78% {
    background: url("../images/20.png");
    background-size: 100% 100%;
  }
  55.56% {
    background: url("../images/21.png");
    background-size: 100% 100%;
  }
  58.33% {
    background: url("../images/22.png");
    background-size: 100% 100%;
  }
  61.11% {
    background: url("../images/23.png");
    background-size: 100% 100%;
  }
  63.89% {
    background: url("../images/24.png");
    background-size: 100% 100%;
  }
  66.67% {
    background: url("../images/25.png");
    background-size: 100% 100%;
  }
  69.44% {
    background: url("../images/26.png");
    background-size: 100% 100%;
  }
  72.22% {
    background: url("../images/27.png");
    background-size: 100% 100%;
  }
  75% {
    background: url("../images/28.png");
    background-size: 100% 100%;
  }
  77.78% {
    background: url("../images/29.png");
    background-size: 100% 100%;
  }
  80.56% {
    background: url("../images/30.png");
    background-size: 100% 100%;
  }
  83.33% {
    background: url("../images/31.png");
    background-size: 100% 100%;
  }
  86.11% {
    background: url("../images/32.png");
    background-size: 100% 100%;
  }
  88.89% {
    background: url("../images/33.png");
    background-size: 100% 100%;
  }
  91.67% {
    background: url("../images/34.png");
    background-size: 100% 100%;
  }
  94.44% {
    background: url("../images/35.png");
    background-size: 100% 100%;
  }
  97.22% {
    background: url("../images/36.png");
    background-size: 100% 100%;
  }
  100% {
    background: url("../images/1.png");
    background-size: 100% 100%;
  }
}
.content .page6 {
  background: url('../images/p_bg.jpg');
  background-size: 100% 100%;
}
.content .page6 video {
  width: 25.6rem;
  height: 10.8rem;
  position: absolute;
  bottom: 0;
  left: -3.2rem;
  z-index: 1;
}
.content .page6 .bird_1 {
  width: 3rem;
  height: 1.94rem;
  position: absolute;
  z-index: 3;
  top: 2rem;
  right: 2rem;
  animation: bird1Ani 2s infinite linear;
}
@keyframes bird1Ani {
  0% {
    background: url("../images/1.png");
    background-size: 100% 100%;
  }
  2.63% {
    background: url("../images/2.png");
    background-size: 100% 100%;
  }
  5.26% {
    background: url("../images/3.png");
    background-size: 100% 100%;
  }
  7.89% {
    background: url("../images/4.png");
    background-size: 100% 100%;
  }
  10.53% {
    background: url("../images/5.png");
    background-size: 100% 100%;
  }
  13.16% {
    background: url("../images/6.png");
    background-size: 100% 100%;
  }
  15.79% {
    background: url("../images/7.png");
    background-size: 100% 100%;
  }
  18.42% {
    background: url("../images/8.png");
    background-size: 100% 100%;
  }
  21.05% {
    background: url("../images/9.png");
    background-size: 100% 100%;
  }
  23.68% {
    background: url("../images/10.png");
    background-size: 100% 100%;
  }
  26.32% {
    background: url("../images/11.png");
    background-size: 100% 100%;
  }
  28.95% {
    background: url("../images/12.png");
    background-size: 100% 100%;
  }
  31.58% {
    background: url("../images/13.png");
    background-size: 100% 100%;
  }
  34.21% {
    background: url("../images/14.png");
    background-size: 100% 100%;
  }
  36.84% {
    background: url("../images/15.png");
    background-size: 100% 100%;
  }
  39.47% {
    background: url("../images/16.png");
    background-size: 100% 100%;
  }
  42.11% {
    background: url("../images/17.png");
    background-size: 100% 100%;
  }
  44.74% {
    background: url("../images/18.png");
    background-size: 100% 100%;
  }
  47.37% {
    background: url("../images/19.png");
    background-size: 100% 100%;
  }
  50% {
    background: url("../images/20.png");
    background-size: 100% 100%;
  }
  52.63% {
    background: url("../images/21.png");
    background-size: 100% 100%;
  }
  55.26% {
    background: url("../images/22.png");
    background-size: 100% 100%;
  }
  57.89% {
    background: url("../images/23.png");
    background-size: 100% 100%;
  }
  60.53% {
    background: url("../images/24.png");
    background-size: 100% 100%;
  }
  63.16% {
    background: url("../images/25.png");
    background-size: 100% 100%;
  }
  65.79% {
    background: url("../images/26.png");
    background-size: 100% 100%;
  }
  68.42% {
    background: url("../images/27.png");
    background-size: 100% 100%;
  }
  71.05% {
    background: url("../images/28.png");
    background-size: 100% 100%;
  }
  73.68% {
    background: url("../images/29.png");
    background-size: 100% 100%;
  }
  76.32% {
    background: url("../images/30.png");
    background-size: 100% 100%;
  }
  78.95% {
    background: url("../images/31.png");
    background-size: 100% 100%;
  }
  81.58% {
    background: url("../images/32.png");
    background-size: 100% 100%;
  }
  84.21% {
    background: url("../images/33.png");
    background-size: 100% 100%;
  }
  86.84% {
    background: url("../images/34.png");
    background-size: 100% 100%;
  }
  89.47% {
    background: url("../images/35.png");
    background-size: 100% 100%;
  }
  92.11% {
    background: url("../images/36.png");
    background-size: 100% 100%;
  }
  94.74% {
    background: url("../images/37.png");
    background-size: 100% 100%;
  }
  97.37% {
    background: url("../images/38.png");
    background-size: 100% 100%;
  }
  100% {
    background: url("../images/1.png");
    background-size: 100% 100%;
  }
}
.content .page6 .bird_2 {
  width: 2.92rem;
  height: 1.61rem;
  position: absolute;
  z-index: 3;
  top: 1rem;
  left: 5rem;
  animation: bird2Ani 1.6s infinite linear;
}
@keyframes bird2Ani {
  0% {
    background: url("../images/1.png");
    background-size: 100% 100%;
  }
  2.44% {
    background: url("../images/2.png");
    background-size: 100% 100%;
  }
  4.88% {
    background: url("../images/3.png");
    background-size: 100% 100%;
  }
  7.32% {
    background: url("../images/4.png");
    background-size: 100% 100%;
  }
  9.76% {
    background: url("../images/5.png");
    background-size: 100% 100%;
  }
  12.20% {
    background: url("../images/6.png");
    background-size: 100% 100%;
  }
  14.63% {
    background: url("../images/7.png");
    background-size: 100% 100%;
  }
  17.07% {
    background: url("../images/8.png");
    background-size: 100% 100%;
  }
  19.51% {
    background: url("../images/9.png");
    background-size: 100% 100%;
  }
  21.95% {
    background: url("../images/10.png");
    background-size: 100% 100%;
  }
  24.39% {
    background: url("../images/11.png");
    background-size: 100% 100%;
  }
  26.83% {
    background: url("../images/12.png");
    background-size: 100% 100%;
  }
  29.27% {
    background: url("../images/13.png");
    background-size: 100% 100%;
  }
  31.71% {
    background: url("../images/14.png");
    background-size: 100% 100%;
  }
  34.15% {
    background: url("../images/15.png");
    background-size: 100% 100%;
  }
  36.59% {
    background: url("../images/16.png");
    background-size: 100% 100%;
  }
  39.02% {
    background: url("../images/17.png");
    background-size: 100% 100%;
  }
  41.46% {
    background: url("../images/18.png");
    background-size: 100% 100%;
  }
  43.90% {
    background: url("../images/19.png");
    background-size: 100% 100%;
  }
  46.34% {
    background: url("../images/20.png");
    background-size: 100% 100%;
  }
  48.78% {
    background: url("../images/21.png");
    background-size: 100% 100%;
  }
  51.22% {
    background: url("../images/22.png");
    background-size: 100% 100%;
  }
  53.66% {
    background: url("../images/23.png");
    background-size: 100% 100%;
  }
  56.10% {
    background: url("../images/24.png");
    background-size: 100% 100%;
  }
  58.54% {
    background: url("../images/25.png");
    background-size: 100% 100%;
  }
  60.98% {
    background: url("../images/26.png");
    background-size: 100% 100%;
  }
  63.41% {
    background: url("../images/27.png");
    background-size: 100% 100%;
  }
  65.85% {
    background: url("../images/28.png");
    background-size: 100% 100%;
  }
  68.29% {
    background: url("../images/29.png");
    background-size: 100% 100%;
  }
  70.73% {
    background: url("../images/30.png");
    background-size: 100% 100%;
  }
  73.17% {
    background: url("../images/31.png");
    background-size: 100% 100%;
  }
  75.61% {
    background: url("../images/32.png");
    background-size: 100% 100%;
  }
  78.05% {
    background: url("../images/33.png");
    background-size: 100% 100%;
  }
  80.49% {
    background: url("../images/34.png");
    background-size: 100% 100%;
  }
  82.93% {
    background: url("../images/35.png");
    background-size: 100% 100%;
  }
  85.37% {
    background: url("../images/36.png");
    background-size: 100% 100%;
  }
  87.80% {
    background: url("../images/37.png");
    background-size: 100% 100%;
  }
  90.24% {
    background: url("../images/38.png");
    background-size: 100% 100%;
  }
  92.68% {
    background: url("../images/39.png");
    background-size: 100% 100%;
  }
  95.12% {
    background: url("../images/40.png");
    background-size: 100% 100%;
  }
  97.56% {
    background: url("../images/41.png");
    background-size: 100% 100%;
  }
  100% {
    background: url("../images/1.png");
    background-size: 100% 100%;
  }
}
.content .page6 .icon_2 {
  width: 8.26rem;
  height: 2.74rem;
  background: url('../images/icon_2.png');
  background-size: 100% 100%;
  position: absolute;
  bottom: 0;
  right: -3.6rem;
  z-index: 2;
}
.content .page6 .title {
  width: 4.94rem;
  height: 2.3rem;
  background: url("../images/title2.png");
  background-size: 100% 100%;
  position: absolute;
  left: -0.72rem;
  top: 0.66rem;
  z-index: 2;
}
.content .page6 .s_box {
  width: 11.77rem;
  height: 6.16rem;
  background: url("../images/s_bg.png");
  background-size: 100% 100%;
  margin-top: 2.8rem;
  z-index: 2;
}
.content .page6 .s_box .Swiper_5 {
  width: 9.42rem;
  height: 5.3rem;
  overflow: hidden;
  position: absolute;
  top: 0.24rem;
  left: 1.24rem;
}
.content .page6 .s_box .Swiper_5 img {
  width: 100%;
  height: 100%;
}
.content .page6 .s_box .boder_box {
  width: 10.33rem;
  height: 6.26rem;
  background: url("../images/b_bg.png");
  background-size: 100% 100%;
  z-index: 3;
  position: absolute;
  top: 0.2rem;
  left: 1.2rem;
}
.content .page6 .next,
.content .page6 .prev {
  width: 0.51rem;
  height: 0.67rem;
  position: absolute;
  top: 5.27rem;
  cursor: pointer;
  z-index: 2;
}
.content .page6 .next {
  background: url("../images/next.png");
  background-size: 100% 100%;
  right: 2.84rem;
}
.content .page6 .prev {
  background: url("../images/prev.png");
  background-size: 100% 100%;
  left: 2.84rem;
}
.content .page6 .swiper-pagination {
  width: 1.64rem;
  max-width: 8.28rem;
  position: static;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: 1.66rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
}
.content .page6 .swiper-pagination .my-bullet {
  flex-shrink: 0;
  width: 0.14rem;
  height: 0.14rem;
  border-radius: 50%;
  border: 0.02rem solid #784F39;
  margin: 0 0.1rem;
}
.content .page6 .swiper-pagination .my-bullet-active {
  border-radius: 0;
  border: none;
  width: 0.3rem;
  height: 0.31rem;
  background: url("../images/point_on.png");
  background-size: 100% 100%;
}
.content .page7 {
  height: 2.06rem !important;
}
.content .page7 .fp-tableCell {
  height: 2.06rem !important;
}
.content .page7 .bottom {
  width: 100%;
  height: 2.06rem;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.content .page7 .bottom .b_logo {
  width: 5.82rem;
  height: 0.39rem;
  background: url('../images/b_logo.png');
  background-size: 100% 100%;
  margin-bottom: 0.22rem;
}
.content .page7 .bottom .text_box {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.content .page7 .bottom .text_box span {
  font-weight: 500;
  color: #565656;
  font-size: 0.12rem;
}
.content .page7 .bottom .text_box .link_line {
  width: 8.58rem;
  height: 0.01rem;
  background-color: #5B5B5B;
  margin-bottom: 0.22rem;
}
.content .page7 .bottom .text_box .link_box {
  display: flex;
}
.content .page7 .bottom .text_box .link_box a {
  text-decoration: none;
  font-weight: 400;
  color: #5B5B5B;
  font-size: 0.14rem;
}
.content .page7 .bottom .text_box .link_box .line {
  width: 0.01rem;
  height: 0.21rem;
  background-color: #5B5B5B;
  margin: 0 0.06rem;
}
.float_reg {
  width: 1.85rem;
  height: 2.05rem;
  background: url(../images/float.png);
  background-size: 100% 100%;
  position: fixed;
  right: 0;
  bottom: 7.5rem;
  z-index: 2;
}
.float_reg .close {
  width: 0.3rem;
  height: 0.3rem;
  position: absolute;
  top: 0;
  right: 0;
  cursor: pointer;
}
.float_reg a {
  display: block;
  width: 100%;
  height: 100%;
}
.float_box {
  width: 1.74rem;
  height: 5.69rem;
  background: url("../images/float_bg.png");
  background-size: 100% 100%;
  position: fixed;
  right: 0;
  bottom: 1.4rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 2;
}
.float_box .float_btn {
  cursor: pointer;
  width: 0.25rem;
  height: 0.46rem;
  background: url("../images/float_btn.png");
  background-size: 100% 100%;
  position: absolute;
  top: 0.02rem;
  left: -0.25rem;
  font-size: 0.16rem;
  color: #654D3C;
  writing-mode: vertical-rl;
  /* 文字竖排 */
  display: flex;
  align-items: center;
  justify-content: center;
}
.float_box .btn_1,
.float_box .btn_2,
.float_box .btn_3,
.float_box .btn_4,
.float_box .btn_5,
.float_box .btn_6,
.float_box .btn_7,
.float_box .btn_8 {
  width: 1.42rem;
  height: 0.43rem;
  margin-top: 0.1rem;
  cursor: pointer;
}
.float_box .btn_1 a,
.float_box .btn_2 a,
.float_box .btn_3 a,
.float_box .btn_4 a,
.float_box .btn_5 a,
.float_box .btn_6 a,
.float_box .btn_7 a,
.float_box .btn_8 a {
  width: 100%;
  height: 100%;
  display: block;
}
.float_box .btn_6 {
  margin-top: 0.22rem;
  background: url("../images/btn_6.png");
  background-size: 100% 100%;
}
.float_box .btn_8 {
  background: url("../images/btn_8.png");
  background-size: 100% 100%;
}
.float_box .btn_7 {
  background: url("../images/btn_7.png");
  background-size: 100% 100%;
}
.float_box .btn_1 {
  background: url("../images/btn_1.png");
  background-size: 100% 100%;
}
.float_box .btn_2 {
  background: url("../images/btn_2.png");
  background-size: 100% 100%;
}
.float_box .btn_3 {
  background: url("../images/btn_3.png");
  background-size: 100% 100%;
}
.float_box .btn_4 {
  background: url("../images/btn_4.png");
  background-size: 100% 100%;
}
.float_box .btn_5 {
  background: url("../images/btn_5.png");
  background-size: 100% 100%;
  position: relative;
}
.float_box .btn_5 .btn_5_i {
  width: 0.59rem;
  height: 0.57rem;
  background: url("../images/btn_5_i.png");
  background-size: 100% 100%;
  position: absolute;
  right: 1.12rem;
  top: -0.02rem;
  pointer-events: none;
}
.slide {
  width: 0.09rem;
  height: 5.49rem;
  background: url("../images/side_bg.png");
  background-size: 100% 100%;
  position: fixed;
  top: 2.7rem;
  z-index: 8;
  left: 50%;
  margin-left: -9.36rem;
  display: flex;
  align-items: center;
}
.slide .nav_menu {
  position: absolute;
  right: -1.1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  transform: translateY(-0.06rem);
}
.slide .nav_menu i {
  width: 1.02rem;
  height: 0.91rem;
  margin: 0.06rem 0;
}
.slide .nav_menu i a {
  display: inline-block;
  width: 100%;
  height: 100%;
}
.slide .nav_menu .slide_1 {
  background: url("../images/1.png");
  background-size: 100% 100%;
}
.slide .nav_menu .slide_2 {
  background: url("../images/2.png");
  background-size: 100% 100%;
}
.slide .nav_menu .slide_3 {
  background: url("../images/8.png");
  background-size: 100% 100%;
}
.slide .nav_menu .slide_5 {
  background: url("../images/4.png");
  background-size: 100% 100%;
}
.slide .nav_menu .slide_4 {
  background: url("../images/5.png");
  background-size: 100% 100%;
}
.slide .nav_menu .slide_6 {
  background: url("../images/6.png");
  background-size: 100% 100%;
}
.slide .nav_menu .slide_8 {
  background: url("../images/8.png");
  background-size: 100% 100%;
}
.slide .nav_menu .slide_2_on {
  background: url("../images/2-1.png");
  background-size: 100% 100%;
}
.slide .nav_menu .slide_3_on {
  background: url("../images/8-1.png");
  background-size: 100% 100%;
}
.slide .nav_menu .slide_5_on {
  background: url("../images/4-1.png");
  background-size: 100% 100%;
}
.slide .nav_menu .slide_4_on {
  background: url("../images/5-1.png");
  background-size: 100% 100%;
}
.slide .nav_menu .slide_6_on {
  background: url("../images/6-1.png");
  background-size: 100% 100%;
}
.pop {
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.7);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  display: none;
  justify-content: center;
  align-items: center;
}
.pop .close {
  z-index: 8;
  cursor: pointer;
}
.pop .pop_reg {
  width: 10.81rem;
  height: 5.96rem;
  background: url("../images/pop_box.png");
  background-size: 100% 100%;
  position: relative;
  display: none;
  flex-direction: column;
  align-items: center;
}
.pop .pop_reg .close {
  width: 0.64rem;
  height: 0.64rem;
  position: absolute;
  right: 0.14rem;
  top: 0.44rem;
}
.pop .pop_reg .box_1 {
  display: flex;
  flex-direction: column;
  align-items: center;
  transform: translateX(-2rem);
  position: relative;
}
.pop .pop_reg .box_1 .platform {
  display: flex;
  margin-top: 1.4rem;
}
.pop .pop_reg .box_1 .platform .tab_2,
.pop .pop_reg .box_1 .platform .tab_1 {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.pop .pop_reg .box_1 .platform .tab_2 .icon,
.pop .pop_reg .box_1 .platform .tab_1 .icon {
  width: 0.27rem;
  height: 0.27rem;
}
.pop .pop_reg .box_1 .platform .tab_2 .icon.un,
.pop .pop_reg .box_1 .platform .tab_1 .icon.un {
  background: url("../images/un.png");
  background-size: 100% 100%;
}
.pop .pop_reg .box_1 .platform .tab_2 .icon.on,
.pop .pop_reg .box_1 .platform .tab_1 .icon.on {
  background: url("../images/on.png");
  background-size: 100% 100%;
}
.pop .pop_reg .box_1 .platform .tab_2 .icon_1,
.pop .pop_reg .box_1 .platform .tab_1 .icon_1 {
  width: 0.29rem;
  height: 0.36rem;
  background: url("../images/android.png");
  background-size: 100% 100%;
  margin: 0 0.15rem;
}
.pop .pop_reg .box_1 .platform .tab_2 .icon_2,
.pop .pop_reg .box_1 .platform .tab_1 .icon_2 {
  width: 0.31rem;
  height: 0.36rem;
  background: url("../images/ios.png");
  background-size: 100% 100%;
  margin: 0 0.15rem;
}
.pop .pop_reg .box_1 .platform .tab_2 span,
.pop .pop_reg .box_1 .platform .tab_1 span {
  font-family: SourceHanSerifCNBold;
  font-weight: bold;
  font-size: 0.22rem;
  color: #2E2925;
}
.pop .pop_reg .box_1 .platform .tab_2 {
  margin-left: 0.89rem;
}
.pop .pop_reg .box_1 .input_1,
.pop .pop_reg .box_1 .code_box {
  transform: translateX(0.3rem);
  display: flex;
  align-items: center;
  position: relative;
  margin-top: 0.32rem;
}
.pop .pop_reg .box_1 .input_1 span,
.pop .pop_reg .box_1 .code_box span,
.pop .pop_reg .box_1 .input_1 label,
.pop .pop_reg .box_1 .code_box label {
  font-weight: bold;
  font-size: 0.22rem;
  color: #2E2925;
  font-family: SourceHanSerifCNBold;
}
.pop .pop_reg .box_1 .input_1 .send_btn,
.pop .pop_reg .box_1 .code_box .send_btn {
  width: 1.36rem;
  height: 0.5rem;
  background: url("../images/send_btn.png");
  background-size: 100% 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: SourceHanSerifCNHeavy;
  font-weight: 800;
  font-size: 0.18rem;
  color: #64340B;
  cursor: pointer;
}
.pop .pop_reg .box_1 .input_1 label,
.pop .pop_reg .box_1 .code_box label {
  position: absolute;
  left: -0.88rem;
}
.pop .pop_reg .box_1 .input_1 input,
.pop .pop_reg .box_1 .code_box input {
  padding-left: 0.2rem;
  box-sizing: border-box;
}
.pop .pop_reg .box_1 .input_1 input {
  width: 4.14rem;
  height: 0.58rem;
  background: rgba(0, 0, 0, 0.1);
  outline: none;
  border: none;
}
.pop .pop_reg .box_1 .code_box {
  width: 4.14rem;
  justify-content: space-between;
}
.pop .pop_reg .box_1 .code_box input {
  width: 2.65rem;
  height: 0.58rem;
  background: rgba(0, 0, 0, 0.1);
  outline: none;
  border: none;
}
.pop .pop_reg .box_1 .tip_text {
  font-size: 0.16rem;
  color: red;
  position: absolute;
  bottom: 0.9rem;
  display: none;
}
.pop .pop_reg .box_1 .agree_box {
  display: flex;
  align-items: center;
  font-family: SourceHanSerifCNBold;
  font-weight: bold;
  font-size: 0.16rem;
  color: #2E2925;
  margin-top: 0.27rem;
  margin-bottom: 0.25rem;
}
.pop .pop_reg .box_1 .agree_box .un {
  width: 0.16rem;
  height: 0.16rem;
  background: url("../images/un.png");
  background-size: 100% 100%;
  margin-right: 0.09rem;
  cursor: pointer;
}
.pop .pop_reg .box_1 .agree_box .on {
  width: 0.16rem;
  height: 0.16rem;
  background: url("../images/on.png");
  background-size: 100% 100%;
  margin-right: 0.09rem;
  cursor: pointer;
}
.pop .pop_reg .box_1 .agree_box a {
  color: #AE3C34;
  font-weight: bold;
  font-size: 0.16rem;
  text-decoration: none;
}
.pop .pop_reg .box_1 .agree-ani {
  animation: agreeAni 200ms infinite linear;
}
@keyframes agreeAni {
  0% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(0.2rem);
  }
  50% {
    transform: translateX(0);
  }
  75% {
    transform: translateX(-0.2rem);
  }
  100% {
    transform: translateX(0);
  }
}
.pop .pop_reg .box_1 .ok_btn {
  width: 3.17rem;
  height: 0.89rem;
  background: url("../images/ok_btn.png");
  background-size: 100% 100%;
  cursor: pointer;
}
.pop .pop_reg_end {
  width: 7.54rem;
  height: 5.96rem;
  background: url("../images/pop_reg.png");
  background-size: 100% 100%;
  position: relative;
  display: none;
  flex-direction: column;
  align-items: center;
}
.pop .pop_reg_end .close {
  width: 0.64rem;
  height: 0.64rem;
  position: absolute;
  right: 0.14rem;
  top: 0.44rem;
}
.pop .pop_reg_end .box_2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  transform: translateX(-0.3rem);
  position: relative;
}
.pop .pop_reg_end .box_2 span {
  font-size: 0.28rem;
  color: #2E2925;
  font-family: SourceHanSerifCNBold;
  margin-top: 2.53rem;
}
.pop .pop_reg_end .box_2 .ok_btn {
  width: 3.17rem;
  height: 0.89rem;
  background: url("../images/ok_btn.png");
  background-size: 100% 100%;
  margin-top: 1.14rem;
}
.pop .pop_qq {
  width: 7.54rem;
  height: 5.96rem;
  background: url("../images/pop_qq.png");
  background-size: 100% 100%;
  position: relative;
  display: none;
  flex-direction: column;
  align-items: center;
}
.pop .pop_qq .close {
  width: 0.64rem;
  height: 0.64rem;
  position: absolute;
  right: 0.14rem;
  top: 0.44rem;
}
.pop .pop_qq .qq_box {
  display: flex;
  flex-direction: column;
  transform: translateX(0.4rem);
}
.pop .pop_qq .qq_box .qq_item {
  display: flex;
  align-items: center;
  margin-top: 0.16rem;
}
.pop .pop_qq .qq_box .qq_item .qq_info {
  width: 5.39rem;
  height: 0.57rem;
  background: rgba(0, 0, 0, 0.1);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 0.35rem;
  padding-right: 2.22rem;
  box-sizing: border-box;
}
.pop .pop_qq .qq_box .qq_item .qq_info span {
  font-size: 0.22rem;
  color: #2E2925;
  font-family: SourceHanSansCNRegular;
}
.pop .pop_qq .qq_box .qq_item .copy_btn {
  width: 1.55rem;
  height: 0.57rem;
  background: url("../images/copy_btn.png");
  background-size: 100% 100%;
  transform: translateX(-1.36rem);
  cursor: pointer;
}
.pop .pop_qq .qq_box .qq_item .copy_btn a {
  width: 100%;
  height: 100%;
  display: block;
}
.pop .pop_qq .qq_box .qq_item:nth-child(1) {
  margin-top: 1.43rem;
}
.pop .pop_wx {
  width: 100%;
  height: 100%;
  display: none;
  justify-content: center;
  align-items: center;
}
.pop .pop_wx img {
  width: 3rem;
  height: 3rem;
}
.pop .pop_video {
  width: 9.6rem;
  height: 5.4rem;
  position: relative;
  display: none;
}
.pop .pop_video video {
  width: 100%;
  height: 100%;
}
.pop .pop_video .close {
  width: 0.95rem;
  height: 0.7rem;
  background: url('../images/close_video.png');
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  right: -0.95rem;
}
.pop .pop_reward {
  width: 7.54rem;
  height: 5.96rem;
  background: url("../images/pop_bg.png");
  background-size: 100% 100%;
  position: relative;
  display: none;
  flex-direction: column;
  align-items: center;
}
.pop .pop_reward .close {
  width: 0.64rem;
  height: 0.64rem;
  position: absolute;
  right: 0.14rem;
  top: 0.44rem;
}
.pop .pop_reward .title {
  font-weight: bold;
  font-size: 0.4rem;
  color: #65718A;
  font-family: "SourceHanSerifCNBold";
  margin-top: 1.3rem;
  transform: translateX(-0.3rem);
}
.pop .pop_reward .reward_box {
  width: 1.52rem;
  height: 1.57rem;
  background: url("../images/reward_box.png");
  background-size: 100% 100%;
  transform: translateX(-0.3rem);
  margin-top: 0.42rem;
}
.pop .pop_reward .reward_box i {
  width: 1.52rem;
  height: 1.57rem;
}
.pop .pop_reward .reward_box .reward_1 {
  background: url('../images/reward_1.png');
  background-size: 100% 100%;
}
.pop .pop_reward .reward_box .reward_2 {
  background: url('../images/reward_2.png');
  background-size: 100% 100%;
}
.pop .pop_reward .reward_box .reward_3 {
  background: url('../images/reward_3.png');
  background-size: 100% 100%;
}
.pop .pop_reward .reward_box .reward_4 {
  background: url('../images/reward_4.png');
  background-size: 100% 100%;
}
.pop .pop_reward .reward_box .reward_5 {
  background: url('../images/reward_5.png');
  background-size: 100% 100%;
}
.pop .pop_reward .reward_box .reward_6 {
  background: url('../images/reward_6.png');
  background-size: 100% 100%;
}
.pop .pop_reward .reward_box .reward_7 {
  background: url('../images/reward_7.png');
  background-size: 100% 100%;
}
.pop .pop_reward .reward_box .reward_8 {
  background: url('../images/reward_8.png');
  background-size: 100% 100%;
}
.pop .pop_reward .confirm_btn {
  width: 1.57rem;
  height: 0.51rem;
  background: url("../images/confirm_btn.png");
  background-size: 100% 100%;
  margin-top: 0.34rem;
  transform: translateX(-0.3rem);
  cursor: pointer;
}
.pop .pop_tip {
  width: 7.54rem;
  height: 5.96rem;
  background: url("../images/pop_bg.png");
  background-size: 100% 100%;
  position: relative;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.pop .pop_tip .close {
  width: 0.64rem;
  height: 0.64rem;
  position: absolute;
  right: 0.14rem;
  top: 0.44rem;
}
.pop .pop_tip span {
  font-weight: bold;
  font-size: 0.32rem;
  color: #65718A;
  font-family: SourceHanSerifCNBold;
  transform: translateX(-0.3rem);
  text-align: center;
}
.pop .pop_tip .confirm_btn {
  width: 1.57rem;
  height: 0.51rem;
  background: url("../images/confirm_btn.png");
  background-size: 100% 100%;
  transform: translateX(-0.3rem);
  position: absolute;
  bottom: 1.4rem;
  cursor: pointer;
}
.pop .share_pop {
  width: 7.54rem;
  height: 5.96rem;
  background: url("../images/pop_bg.png");
  background-size: 100% 100%;
  position: relative;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.pop .share_pop .close {
  width: 0.64rem;
  height: 0.64rem;
  position: absolute;
  right: 0.14rem;
  top: 0.44rem;
}
.pop .share_pop .tip {
  font-family: SourceHanSerifCNBold;
  font-size: 0.26rem;
  color: #46506C;
  transform: translateX(-0.3rem);
}
.pop .share_pop .input_url {
  width: 5.32rem;
  height: 0.64rem;
  background: rgba(0, 0, 0, 0.1);
  display: flex;
  justify-content: center;
  align-items: center;
  transform: translateX(-0.3rem);
  margin-top: 0.26rem;
  margin-bottom: 0.44rem;
}
.pop .share_pop .input_url span {
  font-weight: 500;
  font-size: 0.18rem;
  color: #65718A;
}
.pop .share_pop .copy_btn {
  width: 1.57rem;
  height: 0.51rem;
  background: url("../images/copy_link.png");
  background-size: 100% 100%;
  transform: translateX(-0.3rem);
  cursor: pointer;
}
.pop .info_pop {
  width: 7.54rem;
  height: 5.96rem;
  background: url("../images/info_pop.png");
  background-size: 100% 100%;
  position: relative;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.pop .info_pop .close {
  width: 0.64rem;
  height: 0.64rem;
  position: absolute;
  right: 0.14rem;
  top: 0.44rem;
}
.pop .info_pop .input_box {
  width: 5.4rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  transform: translateX(-0.3rem);
}
.pop .info_pop .input_box .label_t {
  font-weight: bold;
  font-size: 0.22rem;
  color: #46506C;
  display: flex;
  justify-content: space-between;
  flex-shrink: 0;
}
.pop .info_pop .input_box input {
  width: 4.15rem;
  height: 0.57rem;
  background: rgba(158, 176, 202, 0.5);
  outline: none;
  border: none;
  padding: 0 0.2rem;
  font-size: 0.22rem;
  margin-left: 0.23rem;
  box-sizing: border-box;
}
.pop .info_pop .input_box:nth-child(3) {
  margin: 0.32rem 0;
}
.pop .info_pop .confirm_btn {
  width: 1.57rem;
  height: 0.51rem;
  background: url("../images/confirm_btn.png");
  background-size: 100% 100%;
  transform: translateX(-0.3rem);
  position: absolute;
  bottom: 1rem;
  cursor: pointer;
}
.pop .rewarded_pop {
  width: 7.54rem;
  height: 5.96rem;
  background: url("../images/pop_bg.png");
  background-size: 100% 100%;
  position: relative;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.pop .rewarded_pop .close {
  width: 0.64rem;
  height: 0.64rem;
  position: absolute;
  right: 0.14rem;
  top: 0.44rem;
}
.pop .rewarded_pop .title {
  font-family: SourceHanSerifCNBold;
  font-size: 0.42rem;
  color: #65718A;
  transform: translateX(-0.3rem);
}
.pop .rewarded_pop .con {
  font-family: SourceHanSerifCNBold;
  font-size: 0.24rem;
  color: #65718A;
  text-align: center;
  transform: translateX(-0.3rem);
  margin: 0.3rem 0;
}
.pop .rewarded_pop .tip {
  font-family: SourceHanSerifCNBold;
  font-size: 0.14rem;
  color: #65718A;
  transform: translateX(-0.3rem);
  margin-bottom: 0.42rem;
}
.pop .rewarded_pop .confirm_btn {
  width: 1.57rem;
  height: 0.51rem;
  background: url("../images/confirm_btn.png");
  background-size: 100% 100%;
  transform: translateX(-0.3rem);
  cursor: pointer;
}
.pop .record_pop {
  width: 7.54rem;
  height: 5.96rem;
  background: url("../images/my_reward.png");
  background-size: 100% 100%;
  position: relative;
  display: none;
  flex-direction: column;
  align-items: center;
}
.pop .record_pop .close {
  width: 0.64rem;
  height: 0.64rem;
  position: absolute;
  right: 0.14rem;
  top: 0.44rem;
}
.pop .record_pop .tab_box {
  display: flex;
  transform: translateX(-0.3rem);
  margin-top: 1.5rem;
}
.pop .record_pop .tab_box div {
  width: 2.8rem;
  height: 0.57rem;
  background-color: rgba(109, 144, 193, 0.1);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.22rem;
  color: #46506C;
  font-family: SourceHanSerifCNBold;
  cursor: pointer;
}
.pop .record_pop .tab_box .on {
  background-color: rgba(109, 144, 193, 0.6);
}
.pop .record_pop .record_list {
  width: 5.6rem;
  height: 2.85rem;
  background-color: rgba(109, 144, 193, 0.1);
  margin-top: 0.05rem;
  transform: translateX(-0.3rem);
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: auto;
}
.pop .record_pop .record_list .record_item {
  width: 5.32rem;
  height: 0.64rem;
  display: flex;
  align-items: center;
  justify-content: space-around;
  flex-shrink: 0;
}
.pop .record_pop .record_list .record_item span {
  font-family: SourceHanSansCNMedium;
  font-weight: 500;
  font-size: 0.18rem;
  color: #65718A;
  text-align: center;
}
.pop .record_pop .record_list .record_item .get_i {
  width: 1.2rem;
  height: 0.39rem;
  background: url('../images/get.png');
  background-size: 100% 100%;
  cursor: pointer;
}
.pop .record_pop .record_list .record_item .get_ed {
  width: 1.2rem;
  height: 0.39rem;
  background: url('../images/get_ed.png');
  background-size: 100% 100%;
}
.pop .record_pop .record_list .record_item:nth-child(2n+1) {
  background-color: rgba(109, 144, 193, 0.1);
}
.pop .rule_pop {
  width: 8.97rem;
  height: 9.51rem;
  background: url('../images/rule_pop.png');
  background-size: 100% 100%;
  display: none;
  justify-content: center;
  position: relative;
  padding: 0.5rem 0;
  box-sizing: border-box;
}
.pop .rule_pop .close {
  width: 0.35rem;
  height: 0.34rem;
  background: url('../images/close_rule.png');
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  right: -0.5rem;
}
.pop .rule_pop .rule_box {
  width: 8.6rem;
  display: flex;
  justify-content: center;
  overflow: auto;
}
.pop .rule_pop .rule_box .rule_text {
  width: 7.41rem;
  height: 14.6rem;
  background: url('../images/rule_text.png');
  background-size: 100% 100%;
}
.pop .rule_pop .rule_box::-webkit-scrollbar {
  width: 0.08rem;
  /* 设置滚动条宽度 */
}
.pop .rule_pop .rule_box::-webkit-scrollbar-track {
  /* 设置滚动条背景颜色 */
  border-radius: 0.09rem;
  /* 设置滚动条圆角 */
}
.pop .rule_pop .rule_box::-webkit-scrollbar-thumb {
  background: #cecece;
  /* 设置滚动条滑块颜色 */
  border-radius: 0.09rem;
  /* 设置滚动条滑块圆角 */
}
.pop .relook_pop {
  display: none;
  position: relative;
  width: 5.48rem;
  height: 5.64rem;
}
.pop .relook_pop .close {
  width: 0.64rem;
  height: 0.64rem;
  position: absolute;
  right: 0.14rem;
  top: 0.44rem;
}
.pop .relook_pop .re_pop3_i {
  display: none;
  width: 6.1rem;
  height: 4.28rem;
  background: url('../images/re_pop3.gif');
  background-size: 100% 100%;
  transform: translate(-0.28rem, 0.2rem) scale(0.6);
}
.pop .re_pop1 {
  background: url('../images/re_pop1.png');
  background-size: 100% 100%;
}
.pop .re_pop2 {
  background: url('../images/re_pop2.png');
  background-size: 100% 100%;
}
.pop .re_pop3 {
  background: url('../images/re_pop3.png');
  background-size: 100% 100%;
  display: flex;
  align-items: center;
}
.pop .download_pop {
  width: 7.54rem;
  height: 5.96rem;
  background: url("../images/download_pop.png");
  background-size: 100% 100%;
  position: relative;
  display: none;
  flex-direction: column;
  align-items: center;
}
.pop .download_pop .close {
  width: 0.64rem;
  height: 0.64rem;
  position: absolute;
  right: 0.14rem;
  top: 0.44rem;
}