/* common reset */
html {
  font-size: 100px !important;
}

.main .step-three .content__box .product__items .product-img {
  padding-top: 0;
  border-top-left-radius: 0.12rem;
  border-top-right-radius: 0.12rem;
  overflow: hidden;
}
.main .step-three .content__box .product__items .product-img img {
  max-height: 1.8rem;
}

.proup-mask .proup__inner .proup__bd {
  font-size: .22rem;
  padding-right: 0.1rem;
}

.common__tit2 .btn-recharge-intro {
  margin-left: 0.1rem;
}

:root {
  --item-active-bd: #6F4D20;
  --item-active-sd: #FFBA00;
  --item-active-radio: #FFBA00;
  --theme-color: #FFBA00;
  --proup-btn-bg: #FFBA00;
  --proup-btn-c: #6F4D20;
  --info-value: #fff;
}

.nav__wrap {
  box-shadow: unset;
}

.container {
  background: linear-gradient(to bottom,#29282A,#3E3138);
}

.step__content {
  --step-active-bg: #FFBA00;
  --step-active-color: #3B2406;
  background: linear-gradient(to bottom,#604832,#9B7750);
}

.step__content.step-three {
  background:unset;
}

.step-three .content__box {
  background: linear-gradient(to bottom,#604933,#9A764F);
}

.proup-mask .proup__inner {
  background: linear-gradient(to bottom,#604933,#9A764F);
  padding: 0.3rem 0.4rem 0.3rem 0.5rem;
}

.steps__wrap,.step__conten-wrap{
  background: initial;
}

.steps__wrap .step__item-num {
  border-color: var(--step-active-color);
  background-color: var(--step-active-color);
}

.steps__wrap .step__item.is-active .step__item-num , 
.main .login__btn{
  color: var(--step-active-color);
}

.steps__wrap .step__item::after{
  background-color: var(--step-active-color);
}

.step-two .info__details-item .item-sel-wrap .sel-val {
  background-color: var(--step-active-color);
  box-shadow: 0 0 0.06rem 0 var(--step-active-color);
}

.steps__wrap .step__item-txt, .step-one .game__about .game__name, .step-one .step-tips ,.info__details,
.common__tit , .user__infos-item .infos-item-name ,.user__infos-item 
,.product__items .product-name, .proup-mask .proup__hd, .proup-mask .proup__bd ,
.proup-mask.popup-tips .proup__inner .popup-content{
  color: #fff;
}

.proup-mask.popup-tips .proup__inner {
  border-left: none;
}

.proup-mask .proup__inner-box.common-box .warn-icon {
  background-image: url(./img/rectangle.png);
}

.step-one .step-tips i {
  color: var(--step-active-color);
  background-color: var(--step-active-bg);
}

.step-two .info__details-item {
  border-bottom-color: var(--step-active-color);
}

.step-two .info__details-item .item-sel-wrap .default-val::after {
  border-top-color: var(--step-active-bg);
}

.step-two .info__details-item .item-sel-wrap {
  border-radius: 0.3rem;
  background-color: var(--step-active-color);
  min-width: 3rem;
  max-width: 3.5rem;
  width: unset;
}

.step-two .info__details-item .item-sel-wrap .sel-val .sel-val-item:hover {
  background-color: #211403;
}

.common__tit2 , .user__infos-item .change-user {
  color: var(--step-active-bg);
}

.method__items {
  background-color: #fff;
  border: none;
}

.product__box .product__items {
  background: linear-gradient(to bottom,#372104,#9e7336);
  overflow: unset;
}

.product__box .product__items:hover::before {
    content: "";
    display: block;
    border-style: solid;
    border-width: .06rem .06rem;
    border-image: url(./img/bg-product-item1.png) 6 6 fill;
    border-image-repeat: stretch;
    transform: translate3d(0, 0, 0);
    position: absolute;
    top: -0.07rem;
    right: -0.07rem;
    bottom: -0.07rem;
    left: -0.07rem;
    z-index: -1;
  }

.product__box .product__items .old {
  color: #432a09;
}

.product__box .product__items .new {
  color: #ffe850;
}

.method__items, .product__items {
  --item-bd-c: var(--item-active-bd);
}

.content__box:has(.common__tit) {
  background: url(./img/bg-step-three.jpg) center /  12.3rem 3.08rem no-repeat;
}

.product__items .product-txt {
  font-size: 0.25rem;
  --shadow-color: #815A20;
}

.product__items .product-txt span {
  /* filter: drop-shadow(-1px -1px 0 var(--shadow-color)) drop-shadow(1px 1px 0 var(--shadow-color)) drop-shadow(0 1.5px 0 var(--shadow-color)) drop-shadow(1.5px 0 0 var(--shadow-color)); */
  text-shadow: -0.01rem -0.01rem 0 var(--shadow-color), 0.01rem -0.01rem 0 var(--shadow-color), -0.01rem 0.01rem 0 var(--shadow-color), 0.01rem 0.01rem 0 var(--shadow-color);
}

.proup-mask .proup__bd::-webkit-scrollbar {
  background: #5B452D;
  border-radius: 0.1rem;
  width: 0.12rem;
}

.proup-mask .proup__bd::-webkit-scrollbar-thumb {
  background: var(--theme-color);
  border-radius: 0.1rem;
}

/* 弹窗字体颜色 */
.proup-mask .proup__bd .info-items-tit ,
.proup-mask .pay-num b{
  color: var(--theme-color) !important;
}

.proup-mask .btns-item:hover {
  --proup-btn-bg:#fad256;
}

.product__items:hover {
  /* box-shadow:0 0 0 0.04rem #FFE76C; */
  box-shadow:none;
}

.product__items .product-txt, 
.product__items:hover .product-txt {
  background: url(./img/btn-product-item.png) center / cover no-repeat;
}

.product__status .status__item .checkbox.checked {
  background: var(--theme-color);
}

.control__wrap .lang-list {
  overflow-x: hidden;
}

body::after {
  position: fixed;
  top: 200%;
  left: -200%;
  opacity: 0;
  content: "";
  background: url(./img/bg-product-item1.png);
}

@media (min-width: 1000px) {
  .product-tag {
    min-width: 1.15rem;
    width: auto;
    padding: 0 0.3rem 0 0.15rem;
    height: 0.29rem;
    display: flex;
    justify-content: center;
    align-items: center;
    background: none;
    transform: none;
    color: #3d2607;
    font-size: 0.17rem;
    top: -0.01rem;
    left: -0.01rem;
    font-weight: bold;
    box-sizing: border-box;
  }

  .product-tag::before {
    content: "";
    display: block;
    border-style: solid;
    border-width: .01rem 0.35rem .01rem .01rem;
    border-image: url(./img/tag.png) 1 35 1 1 fill;
    border-image-repeat: stretch;
    transform: translate3d(0, 0, 0);
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
  }
}

@media (orientation: portrait) and (max-width: 767px) {
  html {
    font-size: calc(100vw / 6.4) !important;
  }
  .proup-mask .proup__inner .proup__bd {
    font-size: .26rem;
  }

  :root {
    --box-gap: 0rem;
  }

  .step__content {
    background: none;
  }
  .step__content .steps__wrap {
    background: linear-gradient(to bottom,#7C5F41,#9A764F);
  }
  .step__content .step__conten-wrap {
    background: linear-gradient(to bottom,#5F4832,#9A7750);
  }
  .product-tag {
    background: linear-gradient(225deg, #FFE869 50%, #FFFDF3);
    color: #3d2607;
    font-weight: bold;
  }
  .step__content.step-three {
    padding: 0.25rem 0.25rem 0;
  }
}