@charset "UTF-8";
.swiper-container .swiper-wrapper .swiper-slide, .popup-alert {
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -o-box-pack: center;
  box-pack: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -o-box-align: center;
  box-align: center;
  align-items: center;
  justify-content: center;
  -webkit-align-items: center;
  -webkit-justify-content: center; }

html {
  font-size: 62.5%; }

@media only screen and (min-width: 320px) {
  html {
    font-size: 75% !important;
    /* 12÷16=73.4% */ } }
@media only screen and (min-width: 360px) {
  html {
    font-size: 84.375% !important;
    /* 12÷16=73.4% */ } }
@media only screen and (min-width: 375px) {
  html {
    font-size: 87.890625% !important;
    /* 14.0625÷16=73.2% */ } }
@media only screen and (min-width: 410px) {
  html {
    font-size: 97.03% !important;
    /* 15.525÷16=94% */ } }
@media only screen and (min-width: 480px) {
  html {
    font-size: 112.5% !important;
    /* 18÷16=94% */ } }
@media only screen and (min-width: 560px) {
  html {
    font-size: 131.25% !important;
    /* 21÷16=109% */ } }
@media only screen and (min-width: 640px) {
  html {
    font-size: 150% !important;
    /* 24÷16=125% */ } }
@media only screen and (min-width: 720px) {
  html {
    font-size: 168.75% !important;
    /* 27÷16=146.43% */ } }
@media only screen and (min-width: 750px) {
  html {
    font-size: 131.25% !important;
    /* 28.125÷16=146.43% */ } }
@media only screen and (min-width: 800px) {
  html {
    font-size: 131.25% !important;
    /* 30÷16=187.5% */ } }
@media only screen and (min-width: 960px) {
  html {
    font-size: 131.25% !important;
    /* 36÷16=225% */ } }
@media only screen and (min-width: 1080px) {
  html {
    font-size: 131.25% !important;
    /* 40.5÷16=253.125% */ } }
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  color: white;
  outline: none;
  border: 0px;
  background-repeat: no-repeat; }

img {
  display: block; }

body, html {
  height: 100%;
  width: 100%;
  position: relative;
  background-color: #322a46; }

.swiper-container {
  height: 2.2755555556rem;
  width: 24.3911111111rem;
  border-radius: 0.7111111111rem;
  margin: 0.5688888889rem auto;
  background-color: #463f58;
  position: relative; }
  .swiper-container .swiper-wrapper {
    height: 100%;
    width: 100%;
    position: relative; }
    .swiper-container .swiper-wrapper .swiper-slide {
      display: -webkit-box;
      display: -moz-box;
      display: -ms-flexbox;
      display: -o-box;
      display: box;
      -webkit-box-orient: horizontal;
      -moz-box-orient: horizontal;
      display: flex;
      display: -webkit-flex;
      flex-direction: row;
      font-size: 0.8533333333rem; }
      .swiper-container .swiper-wrapper .swiper-slide img {
        height: 1.7066666667rem;
        width: 1.7066666667rem;
        border-radius: 0.8533333333rem;
        margin-right: 0.3555555556rem; }

.page-footer {
  height: 4.5511111111rem;
  width: 100%;
  background-color: #ffeaca;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 10;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -o-box;
  display: box;
  -webkit-box-orient: horizontal;
  -moz-box-orient: horizontal;
  display: flex;
  display: -webkit-flex;
  flex-direction: row;
  align-items: center;
  -webkit-align-items: center; }
  .page-footer .article {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    -o-box-flex: 1;
    box-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -o-box;
    display: box;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    display: flex;
    display: -webkit-flex;
    flex-direction: column;
    justify-content: center;
    -webkit-justify-content: center; }
    .page-footer .article .name {
      font-size: 0.9955555556rem;
      color: #845b58;
      margin-bottom: 0.1777777778rem; }
    .page-footer .article .tips {
      margin-bottom: 0.1777777778rem;
      color: #845b58;
      font-size: 0.8533333333rem; }
      .page-footer .article .tips span {
        color: #fa583f; }
  .page-footer .button {
    position: absolute;
    top: 50%;
    right: 1.1377777778rem;
    height: 2.2755555556rem;
    width: 6.3288888889rem;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    border-radius: 1.1377777778rem;
    box-shadow: 0 1px 4px 0 rgba(247, 89, 70, 0.5);
    background-color: #f75946;
    font-size: 0.9955555556rem;
    color: white; }
  .page-footer .icon {
    height: 3.6266666667rem;
    width: 3.6266666667rem;
    position: relative;
    margin-left: 1.1377777778rem;
    margin-right: 0.5688888889rem;
    border-radius: 0.5688888889rem;
    border: 0.5px solid #DDDDDD;
    background-color: white; }
    .page-footer .icon img {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -moz-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      -o-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      height: 3.4133333333rem;
      width: 3.4133333333rem;
      border-radius: 0.5688888889rem; }

.content-list-wrap {
  height: auto;
  width: 24.3911111111rem;
  padding-top: 1.1377777778rem;
  margin: 1.1377777778rem auto 0;
  box-shadow: inset 0 -4px 0 0 #ffdec4;
  border-radius: 0.8533333333rem;
  background-color: white;
  position: relative; }
  .content-list-wrap .content-title {
    color: #f75946;
    font-size: 1.28rem;
    font-weight: 900;
    margin-left: 1.1377777778rem; }
  .content-list-wrap .item {
    height: 5.4044444444rem;
    width: 100%;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -o-box;
    display: box;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    display: flex;
    display: -webkit-flex;
    flex-direction: row;
    align-items: center;
    -webkit-align-items: center;
    position: relative; }
  .content-list-wrap .balance {
    font-size: 1.7066666667rem;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    top: 50%;
    right: 1.1377777778rem;
    color: #f75946; }
    .content-list-wrap .balance span {
      font-size: 0.7822222222rem;
      color: #f75946;
      margin-left: 0.1422222222rem;
      margin-right: 0.1422222222rem; }
  .content-list-wrap .article {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    -o-box-flex: 1;
    box-flex: 1;
    flex: 1; }
    .content-list-wrap .article .tips {
      font-size: 0.8533333333rem;
      color: #b5b5b5;
      margin-top: 0.5688888889rem; }
    .content-list-wrap .article .name {
      font-size: 1.1377777778rem;
      color: #3A3A3A; }
  .content-list-wrap .icon {
    height: 3.6266666667rem;
    width: 3.6266666667rem;
    position: relative;
    margin-left: 1.1377777778rem;
    margin-right: 0.5688888889rem;
    border-radius: 0.5688888889rem;
    border: 0.5px solid #DDDDDD;
    background-color: white; }
    .content-list-wrap .icon img {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -moz-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      -o-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      height: 3.4133333333rem;
      width: 3.4133333333rem;
      border-radius: 0.5688888889rem; }

.header {
  height: auto;
  width: 24.8177777778rem;
  position: relative;
  margin: 1.1377777778rem auto 0; }
  .header img {
    height: auto;
    width: 100%; }

.popup-alert {
  height: 100vh;
  width: 100vw;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  background-color: rgba(0, 0, 0, 0.75);
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -o-box;
  display: box;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  display: flex;
  display: -webkit-flex;
  flex-direction: column; }
  .popup-alert .content-alert {
    height: 24.5333333333rem;
    width: 20.4088888889rem;
    background-color: white;
    border-radius: 0.5688888889rem;
    position: relative; }
    .popup-alert .content-alert .tips {
      position: absolute;
      top: 15.6444444444rem;
      text-align: center;
      width: 100%;
      font-size: 0.8533333333rem;
      color: #3a3a3a; }
    .popup-alert .content-alert .banner {
      height: 8.5333333333rem;
      width: 16.9955555556rem;
      background-image: url("../image/back.png");
      background-size: 100%;
      background-position: center;
      position: absolute;
      top: 5.3333333333rem;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -moz-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      -o-transform: translateX(-50%);
      transform: translateX(-50%); }
      .popup-alert .content-alert .banner .name {
        font-size: 0.9955555556rem;
        color: #3a3a3a;
        position: absolute;
        top: 3.0577777778rem;
        left: 6.0444444444rem;
        width: auto; }
      .popup-alert .content-alert .banner .icon {
        position: absolute;
        top: 50%;
        left: 2.4888888889rem;
        height: 2.56rem;
        width: 2.56rem;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%); }
        .popup-alert .content-alert .banner .icon img {
          height: 100%;
          width: 100%;
          display: block; }
    .popup-alert .content-alert .title {
      position: absolute;
      top: 2.2755555556rem;
      text-align: center;
      width: 100%;
      font-size: 1.1377777778rem;
      color: #3a3a3a; }
    .popup-alert .content-alert .name {
      color: #f75946;
      font-size: 1.1377777778rem;
      width: 100%;
      text-align: center;
      position: absolute;
      top: 3.9111111111rem; }
    .popup-alert .content-alert .button {
      height: 3.4133333333rem;
      width: 15.5733333333rem;
      position: absolute;
      bottom: 2.2755555556rem;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -moz-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      -o-transform: translateX(-50%);
      transform: translateX(-50%);
      font-size: 1.1377777778rem;
      color: white;
      background: #f75946;
      box-shadow: 0 1px 4px 0 rgba(247, 89, 70, 0.5);
      border-radius: 1.7066666667rem; }
    .popup-alert .content-alert .close {
      position: absolute;
      bottom: -3.5555555556rem;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -moz-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      -o-transform: translateX(-50%);
      transform: translateX(-50%);
      height: 1.7066666667rem;
      width: 1.7066666667rem;
      background-image: url("../image/close.png");
      background-repeat: no-repeat;
      background-size: 1.7066666667rem; }

/*# sourceMappingURL=xx.css.map */
