@charset "UTF-8";
/*
 * @Author: whj 
 * @Date: 2021-08-06 14:06:03 
 * @Last Modified by: whj
 * @Last Modified time: 2022-08-26 11:15:38
 */
* {
  padding: 0;
  margin: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  cursor: default;
}
a,
button {
  -webkit-tap-highlight-color: transparent;
  outline: none;
}
img {
  vertical-align: top;
}
mark {
  background-color: transparent;
}
ul,
li {
  list-style: none;
}
html {
  font-size: 100px;
}
@font-face {
  font-family: 'iconfont';
  /* Project id 2719783 */
  src: url("//at.alicdn.com/t/font_2719783_y8ayte8sed.woff2?t=1628499125153") format("woff2"), url("//at.alicdn.com/t/font_2719783_y8ayte8sed.woff?t=1628499125153") format("woff"), url("//at.alicdn.com/t/font_2719783_y8ayte8sed.ttf?t=1628499125153") format("truetype");
}
.iconfont, .d-close::before {
  font-family: "iconfont";
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.d-bg {
  position: fixed;
  z-index: 99;
  width: 100vw;
  height: 100vh;
  left: 0;
  top: 0;
  background-color: rgba(0, 0, 0, 0.85);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.d-bar {
  position: relative;
  width: 4.36rem;
  margin-top: -.2rem;
  -webkit-animation: aniDialog 0.1s ease;
          animation: aniDialog 0.1s ease;
}
.d-hd {
  text-align: center;
  padding: 0.2rem 0;
}
.d-ft {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 0.2rem 0;
}
.d-close {
  position: absolute;
  z-index: 5;
  top: .02rem;
  right: .02rem;
  width: 0.4rem;
  height: 0.4rem;
  font-size: 0.4rem;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.d-close::before {
    content: "\E643";
}
.d-close:hover {
    -webkit-animation: aniRotateHalf .3s 1 ease-out;
            animation: aniRotateHalf .3s 1 ease-out;
}
.d-btn {
  width: 0.74rem;
  height: 0.4rem;
}
.area-bar {
  width: 5.8rem;
}
.area-item {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 0.86rem;
  margin-left: 0.4rem;
  margin-bottom: 0.26rem;
  position: relative;
}
.area-item, .area-select {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 5rem;
  background-color: #eee;
  border-radius: 0.16rem;
}
.area-label {
  width: 1.28rem;
  text-align: right;
  margin-right: 0.18rem;
}
.area-ipt {
  width: 3.5rem;
  height: 0.8rem;
  line-height: 0.8rem;
}
.area-side {
  position: relative;
}
.area-side::after {
    position: absolute;
    top: .3rem;
    content: "";
    width: .2rem;
    height: .2rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/preheat/ic-sel.png");
}
.area-side.is-down::after {
    -webkit-transform: rotate(-180deg);
            transform: rotate(-180deg);
}
.area-select {
  z-index: 2;
  position: absolute;
  left: 0;
  top: 0.64rem;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding: 0.16rem .2rem;
}
.area-option {
  width: 46%;
  text-align: center;
  padding: 0.1rem 0;
  margin: 0 2%;
  border-radius: .06rem;
}
.area-option:hover {
    background-color: rgba(0, 0, 0, 0.1);
}
.area-select, .area-option {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.area-tip {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #ffdb6f;
  margin-bottom: .2rem;
}
.area-tip::before {
    content: "";
    width: .18rem;
    height: .18rem;
}
.d-msg {
  position: fixed;
  left: 50%;
  top: -100vh;
  z-index: 201;
  max-width: 7.2rem;
  padding: 0.1rem 0.2rem;
  border: 1px solid;
  border-radius: 0.1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  word-break: break-all;
  -webkit-transform: translate(-50%);
          transform: translate(-50%);
  transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
}
.d-msg__icon {
    margin-right: 0.1rem;
}
.d-msg__success {
    color: #67c23a;
    background-color: #f0f9eb;
    border-color: #e1f3d8;
}
.d-msg__warning {
    color: #e6a23c;
    background-color: #fdf6ec;
    border-color: #faecd8;
}
.d-msg__error {
    color: #f56c6c;
    background-color: #fef0f0;
    border-color: #fde2e2;
}
.d-msg__ua {
    font-size: 24px;
    color: #f56c6c;
    background-color: rgba(0, 0, 0, 0.9);
    width: 100%;
    max-width: 100%;
    height: 100%;
    border-radius: 0;
    border: 0;
    top: 0 !important;
}
.d-msg__info {
    color: #fff;
    background-color: rgba(0, 0, 0, 0.8);
}
#fn-loading {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 200;
  background-color: rgba(0, 0, 0, 0.75);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100vw;
  height: 100vh;
  color: #e28b69;
}
#fn-loading__pic {
    font-size: 0.36rem;
    -webkit-animation: aniRotate 1.5s linear infinite;
            animation: aniRotate 1.5s linear infinite;
}
.m-eq {
  display: inline-block;
  background: no-repeat 0 0;
  background-size: 100% 100%;
  width: 46px;
  height: 46px;
  position: relative;
}
.m-eq.is-lock::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 46px;
    height: 46px;
    background: url("https://web-resource.17m3.com/cdn/m3-eq/ic-lock.png") no-repeat 0 0;
    background-size: 100% 100%;
}
.m-eq.is-num::after {
    position: absolute;
    content: attr(data-num);
    right: 1px;
    bottom: 1px;
    background-color: #111322;
    color: #d5d5d3;
    padding: 0 2px;
    font-size: 12px;
    line-height: 1;
    border: 0.01rem solid #a7966b;
}
.fn-tips {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 101;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #fff;
}
.fn-tips__desc {
    width: 375px;
    font-size: 12px;
    background-color: #1b1a18;
    padding: 10px;
    background-color: #1f1c1a;
    border: 1px solid #76582a;
    -webkit-box-shadow: 0 0 1px #3d301c inset;
            box-shadow: 0 0 1px #3d301c inset;
}
.preload-bar {
  position: fixed;
  z-index: 100;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.9);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #2472bd;
  font-size: .32rem;
}
#fn-error {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.8);
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 99;
  text-align: center;
  font-size: .48rem;
}
@media screen and (max-width: 639px) {
html {
    font-size: 50px;
}
.m-eq {
    width: 0.68rem;
    height: 0.68rem;
}
.m-eq.is-lock::before {
      width: 0.68rem;
      height: 0.68rem;
}
.m-eq.is-num::after {
      padding: 1px;
      font-size: 9px;
      line-height: 0.8;
}
.fn-tips {
    left: 0 !important;
    top: 0 !important;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.8);
}
.fn-tips__bd {
      width: 100%;
      max-width: 7.5rem;
}
.fn-tips__desc {
      font-size: 0.2rem;
      padding: 0.2rem;
      max-width: 7.5rem;
}
.fn-tips__pic {
      max-width: 100%;
      display: block;
      margin: 0 auto;
}
}
@-webkit-keyframes aniDialog {
0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 0;
}
100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
}
}
@keyframes aniDialog {
0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 0;
}
100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
}
}
@-webkit-keyframes aniRotate {
from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
}
to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
}
}
@keyframes aniRotate {
from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
}
to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
}
}
@-webkit-keyframes aniRotateHalf {
0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
}
100% {
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
}
}
@keyframes aniRotateHalf {
0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
}
100% {
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
}
}
/*
 * @Author: whj 
 * @Date: 2021-06-24 15:03:46 
 * @Last Modified by: whj
 * @Last Modified time: 2022-09-02 17:07:45
 */
html {
  font-size: 100px;
}
body {
  color: #fff9d0;
  background-color: #fff;
}
.bg-none, .area-side::after, .area-tip::before, a,
button, .d-bar, .d-hd, .rule-bd, .rule-bg, .history-tip::before, .invitation-tip::before {
  background: no-repeat center center transparent;
  background-size: 100% 100%;
}
a,
button {
  border: 0;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  outline: none;
}
img {
  vertical-align: top;
}
.fc-mark {
  color: #d45c3d;
}
.preload-bar {
  background-color: #220f06;
}
.preload-desc {
  width: 1.88rem;
  height: 1.88rem;
  -webkit-animation: aniRotate 5s infinite linear;
          animation: aniRotate 5s infinite linear;
}
.preload-pic {
  position: absolute;
  left: 50%;
  top: 50%;
  margin-top: -.8rem;
  margin-left: -.96rem;
  width: 2.35rem;
  height: 1.76rem;
  -webkit-animation: aniPreloadPerson 1s infinite linear;
          animation: aniPreloadPerson 1s infinite linear;
}
@font-face {
  font-family: 'jinkai';
  src: url("https://web-resource.17m3.com/m3guo/202209/home/HYJinKaiJ.ttf");
}
.d-bar {
  width: 5.84rem;
  padding-top: .24rem;
}
.d-close {
  text-indent: -999rem;
  width: 0.3rem;
  height: 0.3rem;
  background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-close.png");
  right: .2rem;
  top: .2rem;
}
.d-hd {
  width: 4.27rem;
  height: .27rem;
  padding: 0;
  margin: 0 auto;
  text-indent: -999rem;
}
.d-btn {
  width: 2.4rem;
  height: .8rem;
  background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-sure.png");
  text-indent: -999rem;
  margin: 0 .2rem;
}
.area-bar {
  background-image: url("https://web-resource.17m3.com/m3guo/202209/home/area-bg.png");
}
.area-bar .d-ft {
    padding-top: 0.1rem;
}
.area-title {
  background-image: url("https://web-resource.17m3.com/m3guo/202209/home/area-title.png");
  margin-bottom: .38rem;
}
.area-item {
  background-color: #fffaed;
  border: .02rem solid #ecd2b4;
  color: #a1837d;
  font-size: .2rem;
}
.area-label {
  width: 1.2rem;
}
.area-side::after {
  top: .26rem;
  right: .1rem;
  content: "";
  width: .3rem;
  height: .3rem;
  background-image: url("https://web-resource.17m3.com/m3guo/202209/home/ic-sel.png");
  -webkit-transition: all .3s ease-out;
  transition: all .3s ease-out;
}
.area-select {
  left: -.02rem;
  background-color: #fffaed;
  border: .02rem solid #ecd2b4;
  border-top: 0;
  border-radius: 0 0 .2rem .2rem;
}
.area-option {
  -webkit-transition: all .3s ease-out;
  transition: all .3s ease-out;
  cursor: default;
}
.area-option:hover {
    color: #fef0c8;
    background-color: #e08d71;
}
.area-tip {
  margin-bottom: 0;
  color: #d45c3d;
  font-size: .18rem;
}
.area-tip::before {
    content: "";
    width: .3rem;
    height: .3rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/ic-tip-1.png");
}
.rule-bar {
  width: 5.57rem;
  height: 7.32rem;
  font-size: .18rem;
}
.rule-bd, .rule-bg {
  position: absolute;
}
.rule-bd {
  z-index: 2;
  top: 0;
  width: 5.57rem;
  height: 7.32rem;
  background-image: url("https://web-resource.17m3.com/m3guo/202209/home/rule-bg.jpg");
  -webkit-box-shadow: 0 0 0.1rem rgba(0, 0, 0, 0.7);
          box-shadow: 0 0 0.1rem rgba(0, 0, 0, 0.7);
  padding-top: 1.1rem;
}
.rule-bg {
  z-index: 1;
  left: -.2rem;
  top: -.14rem;
  width: 6rem;
  height: 7.9rem;
  background-image: url("https://web-resource.17m3.com/m3guo/202209/home/rule-bg-2.png");
}
.rule-item {
  padding: 0 .36rem;
  line-height: 2.3;
  color: #a1837d;
  margin-bottom: .6rem;
}
.rule-item.mb0 {
    margin-bottom: 0;
}
.rule-label {
  font-weight: bold;
  color: #b57c52;
}
.rule-mark {
  color: #c92012;
  text-align: center;
  margin-bottom: .6rem;
}
.history-bar {
  width: 5.46rem;
  height: 5.15rem;
  color: #a1837d;
  font-size: .2rem;
  padding-top: 0;
}
.history-bar.is-gift {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/history-bg-get.png");
}
.history-bar.is-share {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/history-bg-share.png");
}
.history-bar .d-close {
    top: .1rem;
}
.history-none {
  text-align: center;
  padding-top: 1.5rem;
  color: #c5763c;
}
.history-nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.history-nav__item {
    width: 1.5rem;
    height: .56rem;
    margin-left: .05rem;
    text-indent: -999rem;
    background-color: rgba(0, 0, 0, 0);
}
.history-table__hd, .history-table__bd {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 5.2rem;
  margin: 0 auto;
  border-bottom: .01rem solid #f0d1a5;
}
.history-table__hd {
  height: .72rem;
}
.history-table__bd {
  height: 1rem;
}
.history-table__item {
  width: 2.1rem;
  text-align: center;
}
.history-tip {
  position: absolute;
  left: 0;
  top: 4.46rem;
  width: 100%;
  color: #c1a48b;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.history-tip::before {
    content: "";
    width: .3rem;
    height: .3rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/ic-tip-2.png");
}
.history-page {
  height: 3.76rem;
  overflow: auto;
  width: 5.3rem;
  margin: 0 auto;
}
.history-page::-webkit-scrollbar {
    width: .04rem;
}
.history-page::-webkit-scrollbar-thumb {
    background-color: #854e27;
    border-radius: .1rem;
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
            box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
}
.history-page::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
            box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    background-color: #f0d1a5;
}
.copy-bar {
  min-height: 3.84rem;
  background-image: url("https://web-resource.17m3.com/m3guo/202209/home/area-bg.png");
}
.copy-title {
  background-image: url("https://web-resource.17m3.com/m3guo/202209/home/share-title.png");
}
.copy-bd {
  min-height: 210px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  color: #a1837d;
  font-size: .22rem;
  padding: 0 30px;
}
.copy-btn {
  background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-copy.png");
}
.invitation-bar {
  min-height: 3.84rem;
  background-image: url("https://web-resource.17m3.com/m3guo/202209/home/area-bg.png");
  color: #a1837d;
  font-size: .22rem;
}
.invitation-bar .d-bd {
    text-align: center;
    padding-top: .7rem;
    height: 2.2rem;
}
.invitation-name {
  color: #c5763c;
}
.invitation-tip {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #c1a48b;
  font-size: .2rem;
  margin-top: .4rem;
}
.invitation-tip::before {
    content: "";
    width: .3rem;
    height: .3rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/ic-tip-2.png");
}
.btn-inject {
  background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-inject.png");
}
.btn-accept {
  background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-accept.png");
}
@-webkit-keyframes aniMoveX {
0%,
  5%,
  95%,
  100% {
    -webkit-transform: translateX(-20px);
            transform: translateX(-20px);
}
50% {
    -webkit-transform: translateX(20px);
            transform: translateX(20px);
}
}
@keyframes aniMoveX {
0%,
  5%,
  95%,
  100% {
    -webkit-transform: translateX(-20px);
            transform: translateX(-20px);
}
50% {
    -webkit-transform: translateX(20px);
            transform: translateX(20px);
}
}
@-webkit-keyframes aniMoveXReverse {
0%,
  5%,
  95%,
  100% {
    -webkit-transform: translateX(20px);
            transform: translateX(20px);
}
50% {
    -webkit-transform: translateX(-20px);
            transform: translateX(-20px);
}
}
@keyframes aniMoveXReverse {
0%,
  5%,
  95%,
  100% {
    -webkit-transform: translateX(20px);
            transform: translateX(20px);
}
50% {
    -webkit-transform: translateX(-20px);
            transform: translateX(-20px);
}
}
@keyframes aniRotate {
0% {
    -webkit-transform: rotate(-360deg);
            transform: rotate(-360deg);
    -webkit-transform-origin: center;
            transform-origin: center;
}
to {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: none;
            transform: none;
}
}
@-webkit-keyframes heroNavBurning {
0%,
  100% {
    opacity: 1;
}
50% {
    opacity: .8;
}
}
@keyframes heroNavBurning {
0%,
  100% {
    opacity: 1;
}
50% {
    opacity: .8;
}
}
@-webkit-keyframes heroPagePrev {
0%,
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
}
50% {
    -webkit-transform: translateX(-10px);
            transform: translateX(-10px);
}
}
@keyframes heroPagePrev {
0%,
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
}
50% {
    -webkit-transform: translateX(-10px);
            transform: translateX(-10px);
}
}
@-webkit-keyframes heroPageNext {
0%,
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
}
50% {
    -webkit-transform: translateX(10px);
            transform: translateX(10px);
}
}
@keyframes heroPageNext {
0%,
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
}
50% {
    -webkit-transform: translateX(10px);
            transform: translateX(10px);
}
}
@-webkit-keyframes heroSubBack {
0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
}
60%,
  70% {
    -webkit-transform: translateX(-10px);
            transform: translateX(-10px);
    opacity: .5;
}
80% {
    -webkit-transform: translateX(-10px);
            transform: translateX(-10px);
    opacity: 0;
}
100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 0;
}
}
@keyframes heroSubBack {
0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
}
60%,
  70% {
    -webkit-transform: translateX(-10px);
            transform: translateX(-10px);
    opacity: .5;
}
80% {
    -webkit-transform: translateX(-10px);
            transform: translateX(-10px);
    opacity: 0;
}
100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 0;
}
}
@-webkit-keyframes aniActivityPerson {
0% {
    -webkit-transform: translate(-20px, -20px);
            transform: translate(-20px, -20px);
    opacity: 0;
}
100% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
    opacity: 1;
}
}
@keyframes aniActivityPerson {
0% {
    -webkit-transform: translate(-20px, -20px);
            transform: translate(-20px, -20px);
    opacity: 0;
}
100% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
    opacity: 1;
}
}
@-webkit-keyframes aniActivityGift {
0% {
    -webkit-transform: translate(20px, 20px);
            transform: translate(20px, 20px);
    opacity: 0;
}
100% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
    opacity: 1;
}
}
@keyframes aniActivityGift {
0% {
    -webkit-transform: translate(20px, 20px);
            transform: translate(20px, 20px);
    opacity: 0;
}
100% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
    opacity: 1;
}
}
@-webkit-keyframes aniActivityBuff {
0% {
    -webkit-transform: translateY(30px);
            transform: translateY(30px);
    opacity: 0;
}
100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
}
}
@keyframes aniActivityBuff {
0% {
    -webkit-transform: translateY(30px);
            transform: translateY(30px);
    opacity: 0;
}
100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
}
}
@-webkit-keyframes aniPageHide {
0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-filter: blur(3px);
            filter: blur(3px);
}
50% {
    -webkit-transform: scale(2);
            transform: scale(2);
}
100% {
    -webkit-transform: scale(1);
            transform: scale(1);
}
}
@keyframes aniPageHide {
0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-filter: blur(3px);
            filter: blur(3px);
}
50% {
    -webkit-transform: scale(2);
            transform: scale(2);
}
100% {
    -webkit-transform: scale(1);
            transform: scale(1);
}
}
@-webkit-keyframes aniPreloadPerson {
0%, 100% {
    -webkit-transform: translateY(-5px);
            transform: translateY(-5px);
}
50% {
    -webkit-transform: translateY(5px);
            transform: translateY(5px);
}
}
@keyframes aniPreloadPerson {
0%, 100% {
    -webkit-transform: translateY(-5px);
            transform: translateY(-5px);
}
50% {
    -webkit-transform: translateY(5px);
            transform: translateY(5px);
}
}
@media screen and (min-width: 320px) and (max-width: 750px) {
  /*
 * @Author: whj 
 * @Date: 2021-06-24 15:04:24 
 * @Last Modified by: whj
 * @Last Modified time: 2021-09-23 16:59:18
 */
html {
    font-size: 50px;
}
body {
    font: 0.24rem/1.6 '\5FAE\8F6F\96C5\9ED1';
    padding-top: 0 !important;
    background-color: #52290b;
}
.bg-no, .eq-wait, .m-title, .banner-logo, .banner-year, .container, .cake-main::before, .cake-top, .cake-top::after, .cake-item.is-lock::before, .cake-eq, .cake-eq.is-success::after, .cake-tip, .user-bar, .activity-hd, .activity-year__nav__item, .activity-year__nav__item::before, .activity-year__nav__item::after, .activity-year__person, .activity-year__title, .activity-year__gift__item, .activity-year__ft, .activity-year__ft__hero, .activity-travel::before, .activity-travel::after, .activity-travel__item, .activity-travel__title, .activity-travel__gift__item, .activity-bd, .activity-ft__item, .hero-nav__item, .hero-nav__item::before, .hero-page__bd, .live-room, .live-room::before, .live-room__title, .live-room__iframe, .live-menu, .live-gift::before, .other-item, .other-btn, .info-bar, .info-person::after, .info-skill__title, .info-skill__title::before, .info-nav__item, .info-page__next, .info-page__prev, .info-page__close {
    background: no-repeat 0 0;
    background-size: 100% 100%;
}
.m-eq {
    width: .68rem;
    height: .68rem;
}
.eq-wait {
    width: .68rem;
    height: .68rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-eq-wait.png");
}
#app {
    max-width: 428px;
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
}
.part {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 7.5rem;
    margin: 0 auto;
    position: relative;
}
.m-title {
    content: "";
    width: 7.5rem;
    height: 2.18rem;
    text-indent: -999rem;
}
.banner-bar {
    width: 100%;
}
.banner-bg {
    width: 100%;
}
.banner-logo, .banner-year {
    position: absolute;
    top: .2rem;
    left: 50%;
    text-indent: -999rem;
}
.banner-logo {
    margin-left: -1.46rem;
    width: 1.47rem;
    height: 1.23rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/logo.png");
}
.banner-year {
    margin-left: .2rem;
    width: 1.26rem;
    height: 1.22rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/logo-2.png");
}
.container {
    height: 79.62rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-container-bg.jpg");
}
.cake-bar {
    padding-top: 1.88rem;
    height: 16.4rem;
}
.cake-title {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-cake-title.png");
    margin-bottom: .36rem;
}
.cake-main {
    position: absolute;
    z-index: 5;
    top: 5.3rem;
    left: 50%;
    margin-left: -3.2rem;
    width: 6.4rem;
    height: 8.72rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding-top: 1.76rem;
}
.cake-main::before {
      position: absolute;
      content: "";
      z-index: 1;
      left: 50%;
      top: 0;
      margin-left: -3.5rem;
      width: 6.94rem;
      height: 8.72rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/cake-bd.png");
      pointer-events: none;
}
.cake-top {
    z-index: 3;
    width: 1.31rem;
    height: 1.11rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/cake-box-close.png");
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.cake-top::after {
      position: absolute;
      content: "";
      width: 2.57rem;
      height: .87rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/cake-strawberry.png");
      left: 50%;
      margin-left: -1.29rem;
      bottom: -.3rem;
      pointer-events: none;
}
.cake-top.is-open {
      width: 1.35rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/cake-box-open.png");
      background-size: 1.35rem .95rem;
}
.cake-top .m-eq {
      opacity: 0;
}
.cake-bd {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.cake-item {
    position: relative;
    z-index: 3;
}
.cake-item.is-1 {
      height: 1.78rem;
}
.cake-item.is-2 {
      height: 1.7rem;
}
.cake-item.is-3 {
      height: 1.86rem;
}
.cake-item.is-lock::before {
      position: absolute;
      z-index: 5;
      left: 50%;
      top: 0;
      margin-left: -1.85rem;
      content: "";
      width: 3.9rem;
      height: 1.48rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/cake-before-2.png");
      -webkit-animation: aniMoveX infinite 7s linear;
              animation: aniMoveX infinite 7s linear;
      pointer-events: none;
}
.cake-item.is-2.is-lock::before {
      -webkit-animation: aniMoveX infinite 8s linear;
              animation: aniMoveX infinite 8s linear;
}
.cake-item.is-3.is-lock::before {
      -webkit-animation: aniMoveX infinite 6s linear;
              animation: aniMoveX infinite 6s linear;
      top: .26rem;
      width: 7.09rem;
      margin-left: -3.55rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/cake-before-3.png");
}
.cake-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.cake-eq {
    width: 1.36rem;
    height: 1.5rem;
    margin: 0 .2rem;
    padding: .26rem .12rem .12rem .12rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/eq-gray.png");
}
.cake-eq.is-success {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/eq-light.png");
      position: relative;
}
.cake-eq.is-success::after {
        position: absolute;
        content: "";
        left: 50%;
        bottom: -.1rem;
        margin-left: -.50rem;
        width: .97rem;
        height: .37rem;
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/status-get.png");
}
.cake-close, .cake-unlock {
    width: 1.29rem;
    height: .53rem;
    text-indent: -999rem;
    position: absolute;
    z-index: 9;
    left: 50%;
    margin-left: -.65rem;
    bottom: -.1rem;
}
.cake-unlock.is-1 {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-unlock-1.png");
}
.cake-unlock.is-2 {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-unlock-2.png");
}
.cake-unlock.is-3 {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-unlock-3.png");
}
.cake-close {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-unlock-0.png");
}
.cake-tip {
    position: absolute;
    left: .5rem;
    top: -.3rem;
    width: 3.11rem;
    height: .74rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/cake-tip.png");
    pointer-events: none;
    opacity: 0;
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
    color: #fdf9cb;
    font-size: .14rem;
    text-indent: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 0 0 .12rem .56rem;
}
.cake-tip.is-show {
      top: -.6rem;
      opacity: 1;
}
.cake-ft {
    position: absolute;
    left: 0;
    top: 8.8rem;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}
.cake-btn {
    width: 2.76rem;
    height: 1.12rem;
    text-indent: -999rem;
}
.cake-btn.is-share {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-share.png");
}
.cake-btn.is-gift {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-gift.png");
}
.cake-rule {
    position: absolute;
    z-index: 2;
    top: 12rem;
    left: 50%;
    margin-left: 1.5rem;
    width: 2.84rem;
    height: 1.62rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-rule-default.png");
    text-indent: -999rem;
}
.task-t03-1,
  .task-t03-3 {
    margin-top: -.2rem;
}
.user-bar {
    min-width: 3.31rem;
    height: .53rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/user-bg.png");
    font-size: .14rem;
    color: #fff9d0;
    padding: 0 1.1rem .06rem .28rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: relative;
}
.user-link {
    font-size: .14rem;
    color: #fff9d0;
}
.user-link.is-login {
      text-indent: -999rem;
      width: 1.01rem;
      height: .59rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-login.png");
}
.user-history {
    position: absolute;
    right: -.04rem;
    top: -.04rem;
    width: 1.01rem;
    height: .59rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/user-get.png");
    text-indent: -999rem;
}
.activity-bar {
    height: 20.57rem;
}
.activity-title {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-title.png");
    margin-bottom: .1rem;
}
.activity-hd {
    width: 5.88rem;
    height: .86rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-desc.png");
    text-indent: -999rem;
    margin: 0 auto;
    color: #fdecbd;
}
.activity-year__hd {
    position: absolute;
    top: 7.46rem;
    left: 0;
    width: 100%;
    text-align: center;
    font-family: 'jinkai';
    font-size: .2rem;
}
.activity-year__nav {
    position: absolute;
    width: .93rem;
    right: 0;
    top: .66rem;
}
.activity-year__nav__item {
      width: .93rem;
      height: 1.52rem;
      text-indent: -999rem;
      position: relative;
      margin-top: -.2rem;
}
.activity-year__nav__item::before {
        position: absolute;
        z-index: 2;
        content: "";
        left: 0;
        top: 0;
        width: .93rem;
        height: 1.52rem;
}
.activity-year__nav__item::after {
        position: absolute;
        z-index: 1;
        content: "";
        top: -.1rem;
        left: 50%;
        margin-left: -.12rem;
        width: 0.24rem;
        height: 0.38rem;
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-sub-side.png");
}
.activity-year__nav__1::before {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-sub-1.png");
}
.activity-year__nav__1.is-crt::before {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-sub-1-crt.png");
}
.activity-year__nav__2::before {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-sub-2.png");
}
.activity-year__nav__2.is-crt::before {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-sub-2-crt.png");
}
.activity-year__nav__3::before {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-sub-3.png");
}
.activity-year__nav__3.is-crt::before {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-sub-3-crt.png");
}
.activity-year__item {
    position: absolute;
    padding-top: 2.48rem;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.activity-year__item.is-crt {
      -webkit-animation: aniActivityBuff .5s 1 ease-out;
              animation: aniActivityBuff .5s 1 ease-out;
}
.activity-year__person {
    position: absolute;
    z-index: 1;
    pointer-events: none;
    width: 7.5rem;
    left: 50%;
    margin-left: -3.75rem;
}
.activity-year__person__1 {
      top: -1.46rem;
      height: 4.92rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-year-person-1.png");
}
.activity-year__person__2 {
      top: -2.1rem;
      height: 6.32rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-year-person-2.png");
}
.activity-year__person__3 {
      top: -1rem;
      height: 6rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-year-person-3.png");
}
.activity-year__title {
    position: relative;
    z-index: 2;
    width: 2.42rem;
    height: .69rem;
    text-indent: -999rem;
    margin-bottom: .2rem;
}
.activity-year__title__1 {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-year-title-1.png");
}
.activity-year__title__2 {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-year-title-2.png");
}
.activity-year__title__3 {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-year-title-3.png");
}
.activity-year__gift {
    position: relative;
    z-index: 2;
    width: 3.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.activity-year__gift__item {
      width: .88rem;
      height: .88rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-year-eq.png");
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin: 0 .13rem .12rem;
}
.activity-year__ft {
    position: absolute;
    z-index: 5;
    top: 7.98rem;
    left: 50%;
    margin-left: -2.49rem;
    width: 4.98rem;
    height: .93rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-year-ft.png");
}
.activity-year__ft__hero {
      position: absolute;
      top: .07rem;
      right: .47rem;
      text-indent: -999rem;
      width: .76rem;
      height: .77rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-year-avatar.png");
}
.activity-travel {
    position: relative;
}
.activity-travel::before, .activity-travel::after {
      position: absolute;
      content: "";
      pointer-events: none;
}
.activity-travel::before {
      left: 0;
      top: 0;
      width: 3.6rem;
      height: 2.8rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-travel-left.png");
}
.activity-travel::after {
      right: 0;
      top: 5.2rem;
      width: 3.08rem;
      height: 3.92rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-travel-right.png");
}
.activity-travel__item {
      width: 3.82rem;
      height: 5.25rem;
      position: absolute;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-travel-item.png");
      display: none;
      left: 50%;
      margin-left: -1.91rem;
      top: 1.5rem;
      padding-top: .28rem;
      color: #ebcc81;
}
.activity-travel__item.is-crt {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-animation: aniActivityBuff .5s 1 ease-out;
                animation: aniActivityBuff .5s 1 ease-out;
}
.activity-travel__title {
      width: 3.8rem;
      height: .4rem;
      text-indent: -999rem;
      margin-bottom: .06rem;
}
.activity-travel__title__1 {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-travel-1.png");
}
.activity-travel__title__2 {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-travel-2.png");
}
.activity-travel__title__3 {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-travel-3.png");
}
.activity-travel__process {
      font-family: 'jinkai';
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      width: 100%;
      background: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-travel-line.png") no-repeat center center;
      background-size: 3.45rem .14rem;
      margin-bottom: .2rem;
}
.activity-travel__mark {
      color: #fba94e;
}
.activity-travel__gift {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
}
.activity-travel__gift__item {
        width: 1.06rem;
        height: 1.05rem;
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-travel-eq.png");
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin: 0 .25rem .13rem;
}
.activity-travel__ft {
      font-family: 'jinkai';
      text-align: center;
}
.activity-travel__prev, .activity-travel__next {
      position: absolute;
      width: .4rem;
      height: .74rem;
      text-indent: -999rem;
      top: 3.98rem;
}
.activity-travel__prev {
      left: 0;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/other-prev.png");
}
.activity-travel__next {
      right: 0;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/other-next.png");
}
.activity-travel__page {
      position: absolute;
      left: 0;
      top: 7.6rem;
      width: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
}
.activity-travel__page__item {
        text-indent: -999rem;
        width: .5rem;
        height: .13rem;
        border-radius: .06rem;
        background-color: #976d31;
        -webkit-transition: all .5s ease-out;
        transition: all .5s ease-out;
        margin: 0 .05rem;
}
.activity-travel__page__item.is-crt {
          background-color: #e8c97e;
}
.activity-nav {
    position: absolute;
    left: 0;
    top: 9.08rem;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.activity-nav__item {
      width: 2.13rem;
      height: .76rem;
      text-indent: -999rem;
}
.activity-nav__1 {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-nav-1.png");
}
.activity-nav__1.is-crt {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-nav-1-crt.png");
}
.activity-nav__2 {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-nav-2.png");
}
.activity-nav__2.is-crt {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-nav-2-crt.png");
}
.activity-bd {
    position: absolute;
    top: 4.74rem;
    left: 50%;
    margin-left: -3.63rem;
    width: 7.26rem;
    height: 9.67rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-bg.png");
}
.activity-ft {
    position: absolute;
    left: 0;
    top: 15.1rem;
    font-family: 'jinkai';
}
.activity-ft__list {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      width: 100%;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
}
.activity-ft__item {
      width: 3.75rem;
      height: 2.12rem;
      padding: .74rem .24rem 0;
}
.activity-ft__1 {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-ft-1.png");
}
.activity-ft__2 {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-ft-2.png");
}
.activity-ft__3 {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-ft-3.png");
}
.activity-ft__4 {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-ft-4.png");
}
.activity-ft__3, .activity-ft__4 {
      margin-top: -.2rem;
}
.activity-ft__time {
      text-align: center;
      color: #b0934a;
}
.activity-ft__desc {
      font-size: .2rem;
      color: #a97946;
      line-height: 1.4;
}
.activity-mark {
    color: #dc884f;
}
.hero-bar {
    height: 12.12rem;
}
.hero-title {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-hero-title.png");
}
.hero-home {
    position: absolute;
    width: 14rem;
    height: 7.76rem;
    left: 50%;
    top: 2.4rem;
    margin-left: -7rem;
}
.hero-nav {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
.hero-nav__item {
      position: absolute;
      width: 2.48rem;
      height: 5.41rem;
      -webkit-transition: all .5s ease-out;
      transition: all .5s ease-out;
}
.hero-nav__item::before {
        position: absolute;
        z-index: 1;
        content: "";
        width: 2.56rem;
        height: 6.78rem;
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-nav-crt.png");
        left: 50%;
        top: 50%;
        margin-left: -1.28rem;
        margin-top: -3.4rem;
        opacity: 0;
        -webkit-transition: all .5s ease-out;
        transition: all .5s ease-out;
}
.hero-nav__item.is-crt::before {
        opacity: 1;
        -webkit-animation: heroNavBurning infinite 2s linear;
                animation: heroNavBurning infinite 2s linear;
}
.hero-nav__person {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      z-index: 3;
      text-indent: -999rem;
}
.hero-nav__0 {
      left: 5.76rem;
      top: 1.4rem;
      z-index: 3;
}
.hero-nav__1, .hero-nav__6 {
      -webkit-transform: scale(0.9);
              transform: scale(0.9);
      z-index: 2;
      top: 1.4rem;
}
.hero-nav__1 {
      left: 9.22rem;
}
.hero-nav__6 {
      left: 2.3rem;
}
.hero-nav__2, .hero-nav__3, .hero-nav__4, .hero-nav__5 {
      -webkit-transform: scale(0.75);
              transform: scale(0.75);
      top: .6rem;
      -webkit-filter: blur(3px);
              filter: blur(3px);
      z-index: 1;
      opacity: .7;
}
.hero-nav__2 {
      left: 11.13rem;
}
.hero-nav__3 {
      left: 7.62rem;
}
.hero-nav__4 {
      left: 4.28rem;
}
.hero-nav__5 {
      left: .9rem;
}
.hero-page {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: absolute;
    left: 0;
    top: 8rem;
    z-index: 5;
    width: 100%;
}
.hero-page__prev, .hero-page__next {
      width: .44rem;
      height: .44rem;
}
.hero-page__prev {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-page-prev.png");
      -webkit-animation: heroPagePrev infinite 2s ease-out;
              animation: heroPagePrev infinite 2s ease-out;
}
.hero-page__next {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-page-next.png");
      -webkit-animation: heroPageNext infinite 2s ease-out;
              animation: heroPageNext infinite 2s ease-out;
}
.hero-page__bd {
      width: 1.92rem;
      height: .1rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-page-main.png");
}
.live-bar {
    height: 16.3rem;
}
.live-title {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-live-title.png");
}
.live-room {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    height: 5.24rem;
    width: 7.24rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-live-screen.jpg");
    margin: 1.9rem auto 3.07rem;
}
.live-room::before {
      position: absolute;
      top: -1.9rem;
      left: 50%;
      margin-left: -3.62rem;
      content: "";
      width: 7.25rem;
      height: 1.16rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-live-left.jpg");
      margin-bottom: .6rem;
}
.live-room__title {
      position: absolute;
      top: -.34rem;
      left: 50%;
      margin-left: -2.03rem;
      width: 4.07rem;
      height: .97rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/live-hd.png");
      color: #6b370f;
      font-size: .2rem;
      font-family: 'jinkai';
      text-align: center;
      padding-top: .48rem;
}
.live-room__iframe {
      width: 5.7rem;
      height: 3.22rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-live-cover.jpg");
      border: .02rem solid #66310c;
}
.live-menu {
    position: absolute;
    top: 5.36rem;
    left: 50%;
    margin-left: -3.62rem;
    width: 7.24rem;
    height: 2.96rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-live-menu.jpg");
}
.live-gift {
    position: relative;
    padding-top: 1.3rem;
    height: 2.62rem;
    background: url("https://web-resource.17m3.com/m3guo/202209/home/app-live-gift.png") no-repeat center bottom;
    background-size: 7.5rem 2rem;
}
.live-gift::before {
      content: "";
      position: absolute;
      top: 0;
      left: 50%;
      margin-left: -3.59rem;
      width: 7.18rem;
      height: 1.46rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-live-gift-title.png");
}
.live-gift__list {
      position: absolute;
      left: 0;
      top: 1.28rem;
      width: 15rem;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
}
.live-gift__item {
      margin: 0 .23rem;
      -webkit-transition: all .1s linear;
      transition: all .1s linear;
}
.live-gift__pic {
      width: 1.8rem;
      height: 1.06rem;
}
.other-bar {
    height: 13.6rem;
}
.other-title {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-other-title.png");
    margin-bottom: .16rem;
}
.other-bd {
    position: relative;
}
.other-prev, .other-next {
    position: absolute;
    top: 4.42rem;
    width: .4rem;
    height: .74rem;
    text-indent: -999rem;
}
.other-prev {
    left: 0;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/other-prev.png");
}
.other-next {
    right: 0;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/other-next.png");
}
.other-list {
    position: absolute;
    left: 50%;
    top: 0;
    margin-left: -4.28rem;
    width: 17.27rem;
    height: 10.65rem;
    background: url("https://web-resource.17m3.com/m3guo/202209/home/app-other-bd.png") repeat 0 0;
    background-size: 8.56rem 10.65rem;
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
}
.other-list.is-next {
      margin-left: -12.84rem;
}
.other-item {
    width: 5.17rem;
    height: 4.77rem;
    position: absolute;
    padding: 2.78rem .56rem 0 .5rem;
    font-family: 'jinkai';
    font-size: .21rem;
    color: #a97946;
}
.other-item__adou, .other-item__year {
      left: 1.74rem;
}
.other-item__wechat, .other-item__kd {
      left: 10.32rem;
}
.other-item__adou, .other-item__wechat {
      top: -.04rem;
}
.other-item__year, .other-item__kd {
      top: 4.52rem;
}
.other-item__adou {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-other-adou.png");
}
.other-item__year {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-other-year.png");
}
.other-item__wechat {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-other-wechat.png");
}
.other-item__kd {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-other-kd.png");
}
.other-mark {
    color: #dc884f;
}
.other-btn {
    position: absolute;
    left: 50%;
    bottom: .4rem;
    margin-left: -.8rem;
    width: 1.6rem;
    height: .46rem;
    text-indent: -999rem;
}
.other-btn__download {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-other-download.png");
}
.other-btn__go {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-other-go.png");
}
.hero-mark {
    color: #fcce8b;
}
.info-bar {
    margin-top: -1rem;
    width: 7.17rem;
    height: 10.57rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-hero-bg.png");
    color: #f7f1d3;
    font-family: 'jinkai';
    font-size: .24rem;
}
.info-bd {
    height: 9.72rem;
    overflow-y: auto;
    padding-top: .24rem;
    width: 6.96rem;
    margin: 0 auto;
}
.info-bd::-webkit-scrollbar {
      width: .08rem;
}
.info-bd::-webkit-scrollbar-thumb {
      width: .08rem;
      background-color: #52290b;
}
.info-bd::-webkit-scrollbar-track {
      background-color: #382415;
}
.info-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.info-person {
    position: relative;
    margin-bottom: .28rem;
}
.info-person::after {
      position: absolute;
      content: "";
      left: 50%;
      bottom: -.13rem;
      margin-left: -3.29rem;
      width: 6.58rem;
      height: .41rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-hero-person-ft.png");
}
.info-person__pic {
      width: 6.72rem;
      height: 4.14rem;
}
.info-skill {
    width: 6.72rem;
    background: url("https://web-resource.17m3.com/m3guo/202209/home/app-skill-bg.png") no-repeat center top;
    background-size: 100% auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.info-skill__gif {
      width: 6.72rem;
      height: 4.07rem;
      border: .04rem solid #caa257;
      margin-bottom: .2rem;
}
.info-skill__title {
      position: relative;
      width: 6.7rem;
      height: .6rem;
      text-indent: -999rem;
      margin-bottom: .2rem;
}
.info-skill__title::before {
        position: absolute;
        content: "";
        left: 0;
        top: 0;
        width: 6.7rem;
        height: .6rem;
        pointer-events: none;
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-skill-name-bg.png");
}
.info-skill__desc {
      padding: 0 .2rem .4rem;
}
.info-nav__item {
    position: absolute;
    left: 5.94rem;
    width: .46rem;
    height: 1.07rem;
    text-indent: -999rem;
    z-index: 2;
}
.info-nav__1 {
    top: 1.32rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-type-1.png");
}
.info-nav__1.is-crt {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-type-1-crt.png");
}
.info-nav__2 {
    top: 2.48rem;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-type-2.png");
}
.info-nav__2.is-crt {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-type-2-crt.png");
}
.info-page {
    position: absolute;
    bottom: -1rem;
    left: 50%;
    margin-left: -3.12rem;
    width: 6.24rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.info-page__next, .info-page__prev, .info-page__close {
      text-indent: -999rem;
}
.info-page__next, .info-page__prev {
      width: .41rem;
      height: .73rem;
}
.info-page__prev {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-skill-prev.png");
}
.info-page__next {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-skill-next.png");
}
.info-page__close {
      width: .68rem;
      height: .68rem;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-btn-close.png");
}
.info-skill__sll {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-skill-sll.png");
}
.hero-nav__sll {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-nav-sll.png");
}
.info-skill__ll {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-skill-ll.png");
}
.hero-nav__ll {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-nav-ll.png");
}
.info-skill__ml {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-skill-ml.png");
}
.hero-nav__ml {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-nav-ml.png");
}
.info-skill__cc {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-skill-cc.png");
}
.hero-nav__cc {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-nav-cc.png");
}
.info-skill__sh {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-skill-sh.png");
}
.hero-nav__sh {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-nav-sh.png");
}
.info-skill__zy {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-skill-zy.png");
}
.hero-nav__zy {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-nav-zy.png");
}
.info-skill__zj {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/app-skill-zj.png");
}
.hero-nav__zj {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-nav-zj.png");
}
}
@media screen and (min-width: 751px) {
  /*
 * @Author: whj 
 * @Date: 2021-06-24 15:04:20 
 * @Last Modified by: whj
 * @Last Modified time: 2022-09-05 10:54:31
 */
.topBar,
  #M3-footer {
    display: block;
}
html,
  body {
    overflow: hidden;
}
body {
    font: 14px/1.6 '\5FAE\8F6F\96C5\9ED1';
}
#M3-footer {
    position: fixed;
    left: 0;
    bottom: -160px;
    width: 100%;
    z-index: 12;
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out;
}
#M3-footer.fn-show {
      bottom: 0;
}
#M3-footer__btn {
      position: absolute;
      right: 54px;
      top: -28px;
      width: 118px;
      height: 28px;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/cr-btn.png");
}
#M3-footer__btn::before {
        position: absolute;
        content: "";
        width: 17px;
        height: 17px;
        top: 50%;
        margin-top: -9px;
        right: 17px;
        background: url("https://web-resource.17m3.com/m3guo/202209/home/cr-down.png") no-repeat 0 0;
        -webkit-transition: all .3s ease-out;
        transition: all .3s ease-out;
}
#M3-footer__btn.fn-show::before {
        -webkit-transform: rotate(180deg);
                transform: rotate(180deg);
}
#app {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
}
.topBar {
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
}
.topBar.fn-hide {
      top: -42px;
}
.eq-wait {
    width: 46px;
    height: 46px;
    background: url("https://web-resource.17m3.com/m3guo/202209/home/eq-wait.png") no-repeat 0 0;
}
.part {
    position: absolute;
    z-index: 2;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    min-width: 1920px;
    background: no-repeat center top;
    background-size: 100% auto;
    -webkit-transition: all 1s ease-out;
    transition: all 1s ease-out;
    overflow: hidden;
    -webkit-transform: scale(1);
            transform: scale(1);
}
.part.is-other {
      -webkit-animation: aniPageHide .6s 1 ease-in;
              animation: aniPageHide .6s 1 ease-in;
      pointer-events: none;
}
.part.is-crt {
      z-index: 11;
}
.door-bar {
    position: fixed;
    z-index: 999;
    width: 100%;
    height: 100%;
    pointer-events: none;
}
.door-bar.is-crt {
      pointer-events: auto;
}
.door-bar.is-crt .door-left,
      .door-bar.is-crt .door-right {
        left: 0;
}
.door-item {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background: no-repeat 0 0;
    background-size: 100% 100%;
    -webkit-transition: all .3s linear;
    transition: all .3s linear;
}
.door-left {
    left: -100%;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/door-left.webp");
}
.door-right {
    left: 100%;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/door-right.webp");
}
.m-title {
    width: 417px;
    height: 740px;
    background: no-repeat 0 0;
    text-indent: -9999px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -940px;
    margin-top: -430px;
}
.m-bd {
    width: 1920px;
    height: 1080px;
    position: absolute;
    z-index: 2;
    left: 50%;
    top: 50%;
    margin-left: -960px;
    margin-top: -540px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.banner-bar {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/banner-bg.jpg");
}
.banner-logo, .banner-year, .banner-enter, .banner-download {
    position: absolute;
    z-index: 5;
    text-indent: -9999px;
    background: no-repeat 0 0;
}
.banner-logo {
    top: 64px;
    left: 48px;
    width: 147px;
    height: 123px;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/logo.png");
}
.banner-year {
    top: 62px;
    left: 202px;
    width: 126px;
    height: 122px;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/logo-2.png");
}
.banner-enter, .banner-download {
    width: 75px;
    height: 23px;
    top: 98px;
}
.banner-enter {
    right: 135px;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-enter.png");
}
.banner-download {
    right: 52px;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-download.png");
}
.banner-next {
    width: 226px;
    height: 226px;
    position: absolute;
    z-index: 5;
    left: 50%;
    margin-left: -113px;
    top: 640px;
}
.banner-next__desc, .banner-next__animate {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      background: no-repeat 0 0;
}
.banner-next__desc {
      z-index: 3;
      text-indent: -9999px;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/home-open-desc.png");
}
.banner-next__animate {
      z-index: 2;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/home-open-bg.png");
      -webkit-animation: aniRotate infinite 5s linear;
              animation: aniRotate infinite 5s linear;
}
.banner-video {
    position: absolute;
    width: 1920px;
    height: 1080px;
    z-index: 1;
    top: 0;
    left: 50%;
    margin-left: -960px;
}
.nav-bar {
    position: fixed;
    z-index: 12;
    top: 50%;
    margin-top: -209px;
    right: -254px;
    width: 418px;
    height: 418px;
    background: url("https://web-resource.17m3.com/m3guo/202209/home/nav-bg.png") no-repeat 0 0;
}
.nav-bar::before {
      position: absolute;
      content: "";
      z-index: 1;
      left: 50%;
      top: 50%;
      margin-top: -141px;
      margin-left: -141px;
      width: 282px;
      height: 282px;
      border-radius: 50%;
      background: url("https://web-resource.17m3.com/m3guo/202209/home/nav-inside.png") no-repeat 0 0;
      -webkit-animation: aniRotate infinite 5s linear;
              animation: aniRotate infinite 5s linear;
}
.nav-item, .nav-home {
    position: absolute;
    width: 72px;
    height: 72px;
    background: no-repeat 0 0;
    text-indent: -9999px;
}
.nav-home {
    z-index: 5;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/nav-home.png");
    top: 168px;
    left: 89px;
}
.nav-home:hover {
      -webkit-transition: all .5s ease-out;
      transition: all .5s ease-out;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/nav-home-hover.png");
}
.nav-list {
    position: absolute;
    z-index: 3;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
}
.nav-item {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transition: .5s ease-out;
    transition: .5s ease-out;
}
.nav-pos__1 {
    left: 109px;
    top: -21px;
}
.nav-pos__2 {
    left: 8px;
    top: 54px;
}
.nav-pos__3 {
    left: -31px;
    top: 172px;
}
.nav-pos__4 {
    left: 12px;
    top: 294px;
}
.nav-pos__5 {
    left: 115px;
    top: 367px;
}
.nav-pos__6 {
    left: 241px;
    top: 367px;
}
.nav-pos__7 {
    left: 342px;
    top: 294px;
}
.nav-pos__8 {
    left: 378px;
    top: 172px;
}
.nav-pos__9 {
    left: 338px;
    top: 54px;
}
.nav-pos__10 {
    left: 234px;
    top: -21px;
}
.nav-item__5 {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/nav-5.png");
}
.nav-item__5:hover, .nav-item__5.is-crt {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/nav-5-crt.png");
}
.nav-item__4 {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/nav-4.png");
}
.nav-item__4:hover, .nav-item__4.is-crt {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/nav-4-crt.png");
}
.nav-item__3 {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/nav-3.png");
}
.nav-item__3:hover, .nav-item__3.is-crt {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/nav-3-crt.png");
}
.nav-item__2 {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/nav-2.png");
}
.nav-item__2:hover, .nav-item__2.is-crt {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/nav-2-crt.png");
}
.nav-item__1 {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/nav-1.png");
}
.nav-item__1:hover, .nav-item__1.is-crt {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/nav-1-crt.png");
}
.activity-bar {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-bg.jpg");
}
.activity-title {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-title.png");
}
.activity-mark {
    color: #dc884f;
}
.activity-hd {
    width: 821px;
    height: 53px;
    background: url("https://web-resource.17m3.com/m3guo/202209/home/activity-desc.png") no-repeat center top;
    position: absolute;
    z-index: 1;
    width: 100%;
    top: 50%;
    margin-top: -470px;
    text-indent: -9999px;
}
.activity-bd {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -516px;
    margin-top: -380px;
    width: 1026px;
    height: 552px;
}
.activity-bd::before {
      position: absolute;
      content: "";
      width: 1026px;
      height: 58px;
      background: url("https://web-resource.17m3.com/m3guo/202209/home/activity-hd.png") no-repeat 0 0;
      z-index: 1;
      left: 0;
      top: -30px;
}
.activity-year, .activity-travel {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 515px;
    background: no-repeat 57px 0;
}
.activity-year {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-year-bg.png");
}
.activity-year__nav {
      position: absolute;
      z-index: 5;
      width: 93px;
      right: -5px;
      top: 36px;
}
.activity-year__nav__item {
        width: 93px;
        height: 152px;
        text-indent: -9999px;
        position: relative;
        margin-top: -24px;
        cursor: pointer;
}
.activity-year__nav__item::before, .activity-year__nav__item::after {
          position: absolute;
          content: "";
          background: no-repeat 0 0;
}
.activity-year__nav__item::before {
          z-index: 1;
          left: 50%;
          margin-left: -13px;
          top: -9px;
          width: 24px;
          height: 38px;
          background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-sub-side.png");
}
.activity-year__nav__item::after {
          z-index: 2;
          width: 100%;
          height: 100%;
          left: 0;
          top: 0;
}
.activity-year__nav__1::after {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-sub-1.png");
}
.activity-year__nav__1.is-crt::after {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-sub-1-crt.png");
}
.activity-year__nav__2::after {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-sub-2.png");
}
.activity-year__nav__2.is-crt::after {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-sub-2-crt.png");
}
.activity-year__nav__3::after {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-sub-3.png");
}
.activity-year__nav__3.is-crt::after {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-sub-3-crt.png");
}
.activity-year__hd {
      position: absolute;
      top: 45px;
      left: 369px;
      font-family: 'jinkai';
      font-size: 20px;
      color: #fdecbd;
      width: 592px;
      text-align: center;
}
.activity-year__ft {
      width: 498px;
      height: 93px;
      background: url("https://web-resource.17m3.com/m3guo/202209/home/app-activity-year-ft.png") no-repeat 0 0;
      position: absolute;
      left: 402px;
      top: 289px;
}
.activity-year__ft__hero {
        position: absolute;
        left: 380px;
        top: 7px;
        text-indent: -9999px;
        width: 76px;
        height: 77px;
        background: url("https://web-resource.17m3.com/m3guo/202209/home/activity-year-avatar.png") no-repeat 0 0;
}
.activity-year__item {
      position: absolute;
      z-index: 3;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
}
.activity-year__item.is-crt .activity-year__person {
        -webkit-animation: aniActivityPerson .5s 1 ease-out;
                animation: aniActivityPerson .5s 1 ease-out;
}
.activity-year__item.is-crt .activity-year__title,
      .activity-year__item.is-crt .activity-year__gift {
        -webkit-animation: aniActivityGift .5s 1 ease-out;
                animation: aniActivityGift .5s 1 ease-out;
}
.activity-year__person {
      position: absolute;
      pointer-events: none;
      background: no-repeat 0 0;
}
.activity-year__person__1 {
        left: -180px;
        top: -183px;
        width: 727px;
        height: 681px;
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-year-person-1.webp");
}
.activity-year__person__2 {
        left: -216px;
        top: -160px;
        width: 805px;
        height: 687px;
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-year-person-2.webp");
}
.activity-year__person__3 {
        left: -246px;
        top: -60px;
        width: 1018px;
        height: 588px;
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-year-person-3.webp");
}
.activity-year__title {
      position: absolute;
      top: 30px;
      left: 308px;
      z-index: 5;
      width: 131px;
      height: 288px;
      background: no-repeat 0 0;
      text-indent: -9999px;
}
.activity-year__title__1 {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-year-title-1.png");
}
.activity-year__title__2 {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-year-title-2.png");
}
.activity-year__title__3 {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-year-title-3.png");
}
.activity-year__gift {
      position: absolute;
      left: 318px;
      top: 76px;
      z-index: 2;
      width: 647px;
      height: 200px;
      background: url("https://web-resource.17m3.com/m3guo/202209/home/activity-year-bd.png") no-repeat 0 0;
      padding-left: 100px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
}
.activity-year__gift__item {
        width: 75px;
        height: 74px;
        background: url("https://web-resource.17m3.com/m3guo/202209/home/activity-year-eq.png") no-repeat 0 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin-right: 11px;
}
.activity-travel {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-travel-bg.png");
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding-top: 26px;
    font-family: 'jinkai';
}
.activity-travel::before, .activity-travel::after {
      position: absolute;
      content: "";
      background: no-repeat 0 0;
      pointer-events: none;
}
.activity-travel::before {
      left: -224px;
      top: 22px;
      width: 360px;
      height: 280px;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-travel-left.png");
      -webkit-animation: aniActivityGift 1s 1 ease-out;
              animation: aniActivityGift 1s 1 ease-out;
}
.activity-travel::after {
      left: 842px;
      top: 90px;
      width: 308px;
      height: 395px;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-travel-right.png");
      -webkit-animation: aniActivityPerson 1s 1 ease-out;
              animation: aniActivityPerson 1s 1 ease-out;
}
.activity-travel__item {
      width: 255px;
      height: 368px;
      background: url("https://web-resource.17m3.com/m3guo/202209/home/activity-travel-item.png") no-repeat 0 0;
      margin: 0 32px;
      padding-top: 15px;
      -webkit-animation: aniActivityBuff 1s 1 ease-out;
              animation: aniActivityBuff 1s 1 ease-out;
}
.activity-travel__title {
      width: 255px;
      height: 30px;
      background: no-repeat 0 0;
      text-indent: -9999px;
}
.activity-travel__title__1 {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-travel-1.png");
}
.activity-travel__title__2 {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-travel-2.png");
}
.activity-travel__title__3 {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-travel-3.png");
}
.activity-travel__process {
      background: url("https://web-resource.17m3.com/m3guo/202209/home/activity-travel-line.png") no-repeat center center;
      text-align: center;
      font-size: 16px;
      color: #ebcc81;
      margin-bottom: 15px;
}
.activity-travel__mark {
      color: #f9760d;
}
.activity-travel__gift {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      width: 206px;
      margin: 0 auto 10px;
}
.activity-travel__gift__item {
        width: 71px;
        height: 70px;
        background: url("https://web-resource.17m3.com/m3guo/202209/home/activity-travel-eq.png") no-repeat 0 0;
        margin: 0 16px 8px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
}
.activity-travel__ft {
      text-align: center;
      color: #fde5a3;
      line-height: 1.4;
}
.activity-nav {
    position: absolute;
    z-index: 9;
    width: 426px;
    left: 50%;
    top: 405px;
    margin-left: -213px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.activity-nav__item {
      text-indent: -9999px;
      width: 213px;
      height: 76px;
}
.activity-nav__1 {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-nav-1.png");
}
.activity-nav__1.is-crt {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-nav-1-crt.png");
}
.activity-nav__2 {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-nav-2.png");
}
.activity-nav__2.is-crt {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-nav-2-crt.png");
}
.activity-ft {
    position: absolute;
    width: 1200px;
    left: 50%;
    top: 50%;
    margin-left: -600px;
    margin-top: 170px;
}
.activity-ft::before, .activity-ft::after {
      position: absolute;
      content: "";
      background: no-repeat 0 0;
      pointer-events: none;
      z-index: 2;
}
.activity-ft::before {
      left: -105px;
      top: 62px;
      width: 153px;
      height: 161px;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-ft-left.png");
}
.activity-ft::after {
      right: -111px;
      top: -5px;
      width: 433px;
      height: 204px;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-ft-right.png");
}
.activity-ft__list {
      width: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      font-family: 'jinkai';
}
.activity-ft__item {
      width: 296px;
      height: 182px;
      background: no-repeat center center;
      padding-top: 65px;
}
.activity-ft__time {
      color: #b0934a;
      font-size: 20px;
      text-align: center;
}
.activity-ft__desc {
      width: 270px;
      margin: 0 auto;
      color: #a97946;
      font-size: 18px;
}
.activity-ft__4 {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-ft-4.png");
}
.activity-ft__3 {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-ft-3.png");
}
.activity-ft__2 {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-ft-2.png");
}
.activity-ft__1 {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/activity-ft-1.png");
}
.hero-bar {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-bg.jpg");
}
.hero-bar .hero-sub {
      -webkit-transform: scale(0);
              transform: scale(0);
}
.hero-bar.is-sub .hero-title {
      -webkit-transform: translateX(-1000px);
              transform: translateX(-1000px);
}
.hero-bar.is-sub .hero-home {
      -webkit-transform: scale(0);
              transform: scale(0);
}
.hero-bar.is-sub .hero-sub {
      -webkit-transform: scale(1);
              transform: scale(1);
}
.hero-title, .hero-home, .hero-sub {
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
}
.hero-title {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-title.png");
}
.hero-home {
    position: absolute;
    width: 1400px;
    height: 776px;
    left: 50%;
    top: 50%;
    margin-left: -700px;
    margin-top: -388px;
}
.hero-nav {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
.hero-nav__item {
      position: absolute;
      width: 248px;
      height: 541px;
      background: no-repeat 0 0;
      text-indent: -9999px;
      -webkit-transition: all .5s ease-out;
      transition: all .5s ease-out;
}
.hero-nav__item::before {
        position: absolute;
        z-index: 1;
        content: "";
        width: 256px;
        height: 678px;
        background: url("https://web-resource.17m3.com/m3guo/202209/home/hero-nav-crt.png") no-repeat 0 0;
        left: 50%;
        top: 50%;
        margin-left: -128px;
        margin-top: -339px;
        opacity: 0;
        -webkit-transition: all .5s ease-out;
        transition: all .5s ease-out;
}
.hero-nav__item.is-crt::before {
        opacity: 1;
        -webkit-animation: heroNavBurning infinite 2s linear;
                animation: heroNavBurning infinite 2s linear;
}
.hero-nav__person {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      z-index: 3;
      text-indent: -9999px;
}
.hero-nav__0 {
      left: 576px;
      top: 140px;
      z-index: 3;
}
.hero-nav__1, .hero-nav__6 {
      -webkit-transform: scale(0.9);
              transform: scale(0.9);
      z-index: 2;
      top: 140px;
}
.hero-nav__1 {
      left: 922px;
}
.hero-nav__6 {
      left: 230px;
}
.hero-nav__2, .hero-nav__3, .hero-nav__4, .hero-nav__5 {
      -webkit-transform: scale(0.75);
              transform: scale(0.75);
      top: 60px;
      -webkit-filter: blur(3px);
              filter: blur(3px);
      z-index: 1;
      opacity: .7;
}
.hero-nav__2 {
      left: 1113px;
}
.hero-nav__3 {
      left: 762px;
}
.hero-nav__4 {
      left: 428px;
}
.hero-nav__5 {
      left: 90px;
}
.hero-page {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: absolute;
    z-index: 5;
    width: 1080px;
    left: 50%;
    margin-left: -540px;
    top: 748px;
}
.hero-page__prev, .hero-page__next {
      width: 44px;
      height: 44px;
}
.hero-page__prev {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-page-prev.png");
      -webkit-animation: heroPagePrev infinite 2s ease-out;
              animation: heroPagePrev infinite 2s ease-out;
}
.hero-page__next {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-page-next.png");
      -webkit-animation: heroPageNext infinite 2s ease-out;
              animation: heroPageNext infinite 2s ease-out;
}
.hero-page__bd {
      width: 192px;
      height: 10px;
      background: url("https://web-resource.17m3.com/m3guo/202209/home/hero-page-main.png") no-repeat 0 0;
}
.hero-sub {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -700px;
    margin-top: -453px;
    width: 1400px;
    height: 906px;
}
.hero-sub__back {
      position: absolute;
      right: 0;
      top: 0;
      width: 69px;
      height: 48px;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-back-desc.png");
      text-indent: -9999px;
}
.hero-sub__back::before {
        position: absolute;
        content: "";
        width: 48px;
        height: 48px;
        background: url("https://web-resource.17m3.com/m3guo/202209/home/hero-back.png") no-repeat 0 0;
        left: -54px;
        top: 0;
        -webkit-animation: heroSubBack 2s infinite linear;
                animation: heroSubBack 2s infinite linear;
}
.hero-side {
    position: absolute;
    z-index: 9;
    top: -26px;
    left: -44px;
    width: 528px;
    height: 960px;
    background: url("https://web-resource.17m3.com/m3guo/202209/home/hero-side-bg.png") no-repeat 0 0;
}
.hero-side__item {
      position: absolute;
      width: 90px;
      height: 90px;
      margin-left: -45px;
      margin-top: -45px;
      background: no-repeat 0 0;
      text-indent: -9999px;
      -webkit-transform-origin: center;
              transform-origin: center;
      background-size: 100% 100%;
}
.hero-side__item.is-crt {
        width: 130px;
        height: 130px;
        margin-top: -65px;
        margin-left: -65px;
}
.hero-pos__0 {
    top: 163px;
    left: 120px;
}
.hero-pos__1 {
    top: 256px;
    left: 57px;
}
.hero-pos__2 {
    top: 359px;
    left: 17px;
}
.hero-pos__3 {
    top: 483px;
    left: 9px;
}
.hero-pos__4 {
    top: 607px;
    left: 18px;
}
.hero-pos__5 {
    top: 708px;
    left: 58px;
}
.hero-pos__6 {
    top: 800px;
    left: 122px;
}
.hero-item {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
}
.hero-item.is-crt .hero-person,
    .hero-item.is-crt .hero-ll__nav {
      opacity: 1;
      -webkit-transform: translateX(0);
              transform: translateX(0);
}
.hero-item.is-crt .hero-skill {
      opacity: 1;
      -webkit-transform: translateY(0);
              transform: translateY(0);
}
.hero-person, .hero-skill, .hero-ll__nav {
    position: absolute;
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
    opacity: 0;
}
.hero-person {
    -webkit-transform: translate(-1000px, 1000px);
            transform: translate(-1000px, 1000px);
}
.hero-person__sll {
      left: -260px;
      top: -87px;
}
.hero-person__ll {
      left: -260px;
      top: -87px;
}
.hero-person__ml {
      left: -170px;
      top: -1px;
}
.hero-person__cc {
      left: -112px;
      top: 17px;
}
.hero-person__sh {
      left: -32px;
      top: -87px;
}
.hero-person__zy {
      left: -132px;
      top: 17px;
}
.hero-person__zj {
      left: -260px;
      top: -87px;
}
.hero-ll {
    opacity: 0;
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
    -webkit-transform: scale(0.3);
            transform: scale(0.3);
}
.hero-ll.is-crt {
      opacity: 1;
      -webkit-transform: scale(1);
              transform: scale(1);
}
.hero-ll__nav {
      position: absolute;
      z-index: 9;
      left: 624px;
      top: 436px;
      -webkit-transform: translate(-1000px, 1000px);
              transform: translate(-1000px, 1000px);
}
.hero-ll__nav__item {
        width: 46px;
        height: 107px;
        text-indent: -9999px;
        margin-bottom: 5px;
}
.hero-ll__nav__1 {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-type-1.png");
}
.hero-ll__nav__1.is-crt {
          background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-type-1-crt.png");
}
.hero-ll__nav__2 {
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-type-2.png");
}
.hero-ll__nav__2.is-crt {
          background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-type-2-crt.png");
}
.hero-skill {
    width: 480px;
    left: 762px;
    top: 150px;
    background: url("https://web-resource.17m3.com/m3guo/202209/home/skill-bg.png") no-repeat 0 0;
    -webkit-transform: translate(1000px, 1000px);
            transform: translate(1000px, 1000px);
}
.hero-gif {
    width: 480px;
    height: 290px;
    border: 2px solid #caa257;
}
.hero-info {
    padding-top: 15px;
}
.hero-info__title {
      width: 480px;
      height: 40px;
      position: relative;
      text-indent: -9999px;
}
.hero-info__title::before {
        position: absolute;
        content: "";
        left: 0;
        top: 0;
        width: 100%;
        height: 40px;
        background: url("https://web-resource.17m3.com/m3guo/202209/home/skill-name-bg.png") no-repeat 0 0;
}
.hero-info__desc {
      font-family: 'jinkai';
      color: #f7f1d3;
      font-size: 16px;
      padding: 15px;
      min-height: 360px;
      line-height: 1.8;
}
.hero-mark {
    color: #fcce8b;
}
.hero-nav__sll {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-nav-sll.webp");
}
.hero-side__sll {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-side-sll.webp");
}
.hero-side__sll.is-crt {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-side-sll-crt.webp");
}
.hero-info__sll {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/skill-sll.png");
}
.hero-nav__ll {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-nav-ll.webp");
}
.hero-side__ll {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-side-ll.webp");
}
.hero-side__ll.is-crt {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-side-ll-crt.webp");
}
.hero-info__ll {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/skill-ll.png");
}
.hero-nav__ml {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-nav-ml.webp");
}
.hero-side__ml {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-side-ml.webp");
}
.hero-side__ml.is-crt {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-side-ml-crt.webp");
}
.hero-info__ml {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/skill-ml.png");
}
.hero-nav__cc {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-nav-cc.webp");
}
.hero-side__cc {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-side-cc.webp");
}
.hero-side__cc.is-crt {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-side-cc-crt.webp");
}
.hero-info__cc {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/skill-cc.png");
}
.hero-nav__sh {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-nav-sh.webp");
}
.hero-side__sh {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-side-sh.webp");
}
.hero-side__sh.is-crt {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-side-sh-crt.webp");
}
.hero-info__sh {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/skill-sh.png");
}
.hero-nav__zy {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-nav-zy.webp");
}
.hero-side__zy {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-side-zy.webp");
}
.hero-side__zy.is-crt {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-side-zy-crt.webp");
}
.hero-info__zy {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/skill-zy.png");
}
.hero-nav__zj {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-nav-zj.webp");
}
.hero-side__zj {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-side-zj.webp");
}
.hero-side__zj.is-crt {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/hero-side-zj-crt.webp");
}
.hero-info__zj {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/skill-zj.png");
}
.live-bar {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/other-bg.jpg");
}
.live-title {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/live-title.png");
}
.live-bd {
    padding-top: 144px;
}
.live-room {
    position: relative;
    width: 884px;
    height: 524px;
    background: url("https://web-resource.17m3.com/m3guo/202209/home/live-screen.jpg") no-repeat 0 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.live-room::before {
      position: absolute;
      content: "";
      top: 0;
      left: -190px;
      width: 186px;
      height: 524px;
      background: url("https://web-resource.17m3.com/m3guo/202209/home/live-left.jpg") no-repeat 0 0;
}
.live-room__title {
      position: absolute;
      left: 50%;
      top: -35px;
      margin-left: -203px;
      width: 407px;
      height: 97px;
      background: url("https://web-resource.17m3.com/m3guo/202209/home/live-hd.png") no-repeat 0 0;
      text-align: center;
      color: #6b370f;
      font-family: 'jinkai';
      font-size: 20px;
      padding-top: 48px;
}
.live-room__iframe {
      width: 670px;
      height: 380px;
      background: url("https://web-resource.17m3.com/m3guo/202209/home/live-cover.jpg") no-repeat center center;
      border: 3px solid #66310c;
}
.live-menu {
    position: absolute;
    top: 0;
    right: -260px;
    width: 256px;
    height: 524px;
    background: url("https://web-resource.17m3.com/m3guo/202209/home/live-menu.jpg") no-repeat 0 0;
    padding-top: 100px;
}
.live-menu__item {
      line-height: 79px;
      text-transform: uppercase;
      font-size: 20px;
      font-family: 'jinkai';
      color: #73260c;
      text-align: center;
}
.live-gift {
    position: absolute;
    width: 1440px;
    left: 50%;
    margin-left: -720px;
    top: 670px;
    height: 220px;
    padding-top: 84px;
    background: url("https://web-resource.17m3.com/m3guo/202209/home/live-gift.png") no-repeat center bottom;
    padding-top: 86px;
}
.live-gift::before {
      position: absolute;
      content: "";
      top: -25px;
      left: 0;
      width: 100%;
      height: 131px;
      background: url("https://web-resource.17m3.com/m3guo/202209/home/live-gift-title.png") no-repeat center top;
}
.live-gift__list {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      overflow: hidden;
      width: 1030px;
      margin: 0 auto;
}
.live-gift__item {
      width: 179px;
      height: 106px;
      margin: 0 13px;
}
.other-bar {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/other-bg.jpg");
}
.other-title {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/other-title.png");
}
.other-bd {
    position: relative;
    margin-top: 110px;
    width: 1426px;
    height: 960px;
    background: url("https://web-resource.17m3.com/m3guo/202209/home/other-bd.png") no-repeat 0 0;
}
.other-bd::before, .other-bd::after {
      position: absolute;
      content: "";
      background: no-repeat 0 0;
      pointer-events: none;
}
.other-bd::before {
      left: 76px;
      top: 110px;
      width: 104px;
      height: 169px;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/other-bird-left.png");
}
.other-bd::after {
      right: 0;
      top: -80px;
      width: 120px;
      height: 192px;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/other-bird-right.png");
}
.other-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding-left: 8px;
}
.other-item {
    width: 436px;
    height: 403px;
    background: no-repeat 0 0;
    color: #a97946;
    font-size: 18px;
    font-family: 'jinkai';
    padding: 240px 45px 0 45px;
    margin: -3px 43px 20px;
    text-indent: 36px;
    position: relative;
}
.other-mark {
    color: #dc884f;
}
.other-btn {
    width: 133px;
    height: 37px;
    position: absolute;
    top: 332px;
    left: 50%;
    margin-left: -66px;
    text-indent: -9999px;
}
.other-btn__go {
      cursor: pointer;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/other-go.png");
}
.other-btn__download {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/other-download.png");
}
.other-item__adou {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/other-adou.png");
}
.other-item__year {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/other-year.png");
}
.other-item__wechat {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/other-wechat.png");
}
.other-item__kd {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/other-kd.png");
}
.cake-bar {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/cake-bg.jpg");
}
.cake-title {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/cake-title.png");
}
.cake-bd {
    padding-top: 46px;
}
.cake-main {
    position: relative;
    z-index: 3;
    padding-top: 230px;
    width: 694px;
    background: url("https://web-resource.17m3.com/m3guo/202209/home/cake-bd.png") no-repeat center top;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.cake-top {
    width: 257px;
    height: 72px;
    position: relative;
}
.cake-top::before {
      position: absolute;
      content: "";
      z-index: 2;
      left: 0;
      top: 0;
      width: 100%;
      height: 87px;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/cake-strawberry.png");
      pointer-events: none;
}
.cake-top::after {
      position: absolute;
      content: "";
      z-index: 1;
      left: 50%;
      top: -58px;
      margin-left: -65px;
      width: 131px;
      height: 111px;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/cake-box-close.png");
}
.cake-top.is-open::after {
      top: -50px;
      margin-left: -67px;
      width: 135px;
      height: 95px;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/cake-box-open.png");
}
.cake-top .m-eq {
      position: absolute;
      z-index: 3;
      left: 50%;
      margin-left: -23px;
      top: -25px;
      opacity: 0;
}
.cake-item {
    position: relative;
}
.cake-item.is-lock::before {
      position: absolute;
      content: "";
      z-index: 2;
      left: 50%;
      top: 0;
      margin-left: -195px;
      width: 390px;
      height: 148px;
      background: url("https://web-resource.17m3.com/m3guo/202209/home/cake-before-2.png") no-repeat center center;
      pointer-events: none;
}
.cake-item.is-1 {
      height: 162px;
}
.cake-item.is-1.is-lock::before {
        -webkit-animation: aniMoveX infinite 7s linear;
                animation: aniMoveX infinite 7s linear;
}
.cake-item.is-2 {
      height: 164px;
}
.cake-item.is-2.is-lock::before {
        -webkit-animation: aniMoveXReverse infinite 8s linear;
                animation: aniMoveXReverse infinite 8s linear;
}
.cake-item.is-3 {
      height: 192px;
      margin-bottom: 46px;
}
.cake-item.is-3.is-lock::before {
        -webkit-animation: aniMoveX infinite 6s linear;
                animation: aniMoveX infinite 6s linear;
        height: 148px;
        width: 709px;
        margin-left: -355px;
        top: 30px;
        background-image: url("https://web-resource.17m3.com/m3guo/202209/home/cake-before-3.png");
}
.cake-unlock, .cake-close {
    position: absolute;
    bottom: -26px;
    left: 50%;
    margin-left: -65px;
    width: 129px;
    height: 53px;
    text-indent: -9999px;
    z-index: 5;
}
.cake-close {
    cursor: default;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-unlock-0.png");
}
.cake-unlock.is-1 {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-unlock-1.png");
}
.cake-unlock.is-2 {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-unlock-2.png");
}
.cake-unlock.is-3 {
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-unlock-3.png");
}
.cake-tip {
    position: absolute;
    left: 50px;
    top: -50px;
    width: 331px;
    height: 74px;
    background: url("https://web-resource.17m3.com/m3guo/202209/home/cake-tip.png") no-repeat 0 0;
    color: #fdf9cb;
    font-size: 14px;
    text-indent: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 0 50px 12px;
    pointer-events: none;
    opacity: 0;
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
}
.cake-tip.is-show {
      top: -64px;
      opacity: 1;
}
.cake-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.cake-list.is-2 {
      padding-top: 10px;
}
.cake-list.is-3 {
      padding-top: 20px;
}
.cake-eq {
    margin: 0 20px;
    width: 136px;
    height: 150px;
    padding-top: 14px;
    margin-top: -14px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    background: url("https://web-resource.17m3.com/m3guo/202209/home/eq-gray.png") no-repeat 0 0;
    position: relative;
}
.cake-eq.is-light {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/eq-light.png");
}
.cake-eq.task-t03-2 {
      -webkit-transform: translateY(10px);
              transform: translateY(10px);
}
.cake-eq.is-success {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/eq-light.png");
}
.cake-eq.is-success::before {
        position: absolute;
        content: "";
        z-index: 2;
        left: 18px;
        bottom: 0;
        pointer-events: none;
        width: 97px;
        height: 37px;
        background: url("https://web-resource.17m3.com/m3guo/202209/home/status-get.png") no-repeat 0 0;
}
.cake-rule {
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    width: 284px;
    height: 162px;
    margin-left: 164px;
    margin-top: 158px;
    text-indent: -9999px;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-rule-default.png");
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
}
.cake-rule:hover {
      -webkit-transform: translateX(20px);
              transform: translateX(20px);
}
.cake-ft {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.cake-btn {
    text-indent: -9999px;
    margin: 0 5px;
}
.cake-btn.is-share, .cake-btn.is-gift {
      width: 276px;
      height: 112px;
}
.cake-btn.is-gift {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-gift.png");
}
.cake-btn.is-share {
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-share.png");
}
.cake-shadow {
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    width: 759px;
    margin-left: -380px;
    margin-top: 120px;
    pointer-events: none;
}
.cake-ribbon {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    -webkit-transition: all .5s linear;
    transition: all .5s linear;
}
.user-bar {
    position: absolute;
    z-index: 8;
    top: 32px;
    right: 108px;
    min-width: 331px;
    height: 53px;
    background: url("https://web-resource.17m3.com/m3guo/202209/home/user-bg.png") no-repeat left top;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding-left: 36px;
    padding-right: 90px;
}
.user-bar.is-login {
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      padding: 0 36px;
}
.user-history {
    position: absolute;
    right: -10px;
    width: 101px;
    height: 59px;
    background-image: url("https://web-resource.17m3.com/m3guo/202209/home/user-get.png");
    text-indent: -9999px;
}
.user-link {
    font-size: 14px;
    color: #fff9d0;
}
.user-link.is-login {
      position: absolute;
      z-index: 8;
      top: 32px;
      right: 108px;
      width: 101px;
      height: 59px;
      text-indent: -9999px;
      background-image: url("https://web-resource.17m3.com/m3guo/202209/home/btn-login.png");
}
}
@media screen and (min-width: 751px) and (min-height: 768px) and (max-height: 1000px) {
.m-bd {
    -webkit-transform: scale(0.88) translateY(20px);
            transform: scale(0.88) translateY(20px);
}
.cake-ribbon {
    -webkit-transform: scale(1.3);
            transform: scale(1.3);
}
}
@media screen and (min-width: 751px) and (min-width: 1921px) {
.m-bd {
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
}
.cake-ribbon {
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
}
.banner-video {
    -webkit-transform: scale(1.36) translateY(130px);
            transform: scale(1.36) translateY(130px);
}
}

.slider-row {
  position: relative;
  width: 100%;
  overflow: hidden;
  height: 500px;
}
.slider-row__item {
    position: absolute;
    top: 50px;
}
.slider-row__item::before {
      position: absolute;
      z-index: 2;
      content: "";
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      background-color: #000;
      opacity: 0.5;
      -webkit-transition: all 0.3s ease-out;
      transition: all 0.3s ease-out;
}
.slider-row__item.is-max {
      z-index: 3;
}
.slider-row__item.is-max::before {
        opacity: 0;
}
.slider-row__item.is-max .slider-row__pic {
        z-index: 3;
        width: 120%;
        margin-left: -10%;
        margin-top: -18px;
        -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.8);
                box-shadow: 0 0 10px rgba(0, 0, 0, 0.8);
}
.slider-row__pic {
    width: 100%;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

html {
  font-size: 100px;
}
@media screen and (max-width: 751px) {
html {
    font-size: 50px;
}
}
.slider-circle {
  position: relative;
  width: 7.5rem;
  height: 4rem;
  margin: 0 auto;
  overflow: hidden;
  padding: 0.4rem 0;
}
.slider-circle__item {
    position: absolute;
    left: 50%;
    top: 0.4rem;
    width: 4.6rem;
    margin-left: -2.3rem;
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
    -webkit-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
    opacity: 0;
}
.slider-circle__item.is-crt, .slider-circle__item.is-next, .slider-circle__item.is-prev {
      opacity: 1;
}
.slider-circle__item.is-crt {
      -webkit-transform: scale(1);
              transform: scale(1);
}
.slider-circle__item.is-prev, .slider-circle__item.is-next {
      -webkit-transform: scale(0.8);
              transform: scale(0.8);
}
.slider-circle__item.is-prev {
      margin-left: -7rem;
}
.slider-circle__item.is-next {
      margin-left: 2.4rem;
}
.slider-circle__pic {
    width: 100%;
    pointer-events: none;
}
.slider-circle__preview {
    padding: 0.02rem;
    -webkit-box-shadow: 0 0 0.04rem rgba(255, 165, 0, 0.5);
            box-shadow: 0 0 0.04rem rgba(255, 165, 0, 0.5);
}
.slider-circle__name {
    font-size: 0.24rem;
    padding-top: 0.2rem;
    text-align: center;
}