/* 新版充值 */
.pay-alert-contanier {
  background: #dce9ed !important;
  border-radius: 10px !important;
  padding: 20px;
}
.pay-alert-contanier .product-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 960px;
  padding: 0px 4px;
}
.pay-alert-contanier .product-list > li {
  width: 220px;
  height: 160px;
  background-color: #fff;
  border-radius: 8px;
  margin-bottom: 22px;
  margin-top: 7px;
}
.pay-alert-contanier .product-list > li:not(:last-child) {
  margin-right: 20px;
}
.pay-alert-contanier .product-list > li:nth-child(4) {
  margin-right: 0px;
}
.pay-alert-contanier .product-item {
  color: #fff;
}
.pay-alert-contanier .product-item .head {
  background: url(https://image.xunyou.com/2023/0406/product-head.png) center
    no-repeat;
  width: 128px;
  height: 28px;
  width: 100%;
  margin-top: -7px;
}
.pay-alert-contanier .product-item .title {
  line-height: 1;
  margin: 16px 0;
  font-size: 18px;
  font-weight: 600;
  color: #000;
}
.pay-alert-contanier .product-item .price {
  line-height: 1;
  color: #ff7800;
  font-size: 20px;
  margin-bottom: 15px;
}
.pay-alert-contanier .product-item .price > span {
  font-size: 34px;
}
.pay-alert-contanier .product-item .des {
  background: #78acd1;
  margin: 0 26px;
}
.pay-alert-contanier .product-item .des-discount {
  margin: 0 26px;
  background: #fff;
}
.pay-alert-contanier .product-item .des-discount .discount {
  color: #989898;
  font-weight: 600;
}
.pay-alert-contanier .product-active {
  outline: 3px solid #53c08b;
  position: relative;
}
.pay-alert-contanier .product-active .head {
  background-image: url(https://image.xunyou.com/2023/0406/product-head-active.png);
  position: absolute;
  margin-top: -9px;
}
.pay-alert-contanier .product-active .title {
  margin-top: 38px;
}
.pay-alert-contanier .product-active .des {
  background-color: #53c08b;
}
.pay-alert-contanier .bottom {
  background-color: #fff;
  border-radius: 10px;
  /* height: 255px; */
  padding: 0 0 20px 30px;
}
.pay-alert-contanier .bottom .protocol {
  line-height: 26px;
  text-align: right;
  padding: 10px 12px 5px 0;
  opacity: hidden;
}
.pay-alert-contanier .bottom .protocol:hover .xufei {
  display: block;
}
.pay-alert-contanier .bottom .protocol > a {
  color: #7c7c7c;
  text-decoration: underline;
}
.pay-alert-contanier .bottom .protocol > a img {
  position: relative;
  top: 2px;
  margin-left: 5px;
}
.pay-alert-contanier .bottom .protocol .xufei {
  display: none;
  text-align: left;
  width: 300px;
  position: absolute;
  right: 10px;
  background: #fff;
  box-sizing: border-box;
  padding: 10px;
  box-shadow: 2px 2px 8px grey;
  border-radius: 8px;
  color: #7c7c7c;
}
.pay-alert-contanier .bottom .bt-wrap {
  width: 420px;
  margin: 0 auto;
  display: flex;
}
.pay-alert-contanier .bottom .bt-left {
  box-sizing: border-box;
  /* width: 200px;
  height: 190px; */
  background-color: #dce9ed;
  padding: 10px;
  margin-right: 12px;
}
.pay-alert-contanier .bottom .bt-left .code-wrap {
  /* box-sizing: border-box; */
  /* background: #fff; */
  /* padding: 10px; */
  width: 170px;
  height: 170px;
  /* display: flex; */
  /* align-items: center; */
  /* justify-content: center; */
}
.pay-alert-contanier .bottom .bt-right {
  width: 240px;
}
.pay-alert-contanier .bottom .bt-right .price {
  line-height: 1;
  color: #ff7800;
  font-size: 30px;
  border-bottom: 1px dotted #bcd9e2;
  margin-bottom: 17px;
  padding: 25px 0 27px;
}
.pay-alert-contanier .bottom .bt-right .price > span {
  font-size: 50px;
}
.pay-alert-contanier .bottom .bt-right .green {
  color: #31b434;
  font-weight: 600;
}
.pay-alert-contanier .bottom .bt-right .blue {
  color: #3b9bff;
  font-weight: 600;
}
.pay-alert-contanier .shadow {
  position: absolute;
  width: 170px;
  height: 170px;
  background: rgba(0, 0, 0, 0.6);
  display: none;
  line-height: 170px;
}
.pay-alert-contanier .bt-left .pay-alert-success {
  background: url(https://image.xunyou.com/act/20221111/pay_success.jpg) center
    top no-repeat;
  position: absolute;
  width: 170px;
  height: 170px;
}
.pay-alert-contanier .shadow .refresh-qrcode {
  color: #fff;
}
.pay-alert-contanier .shadow .refresh-qrcode:hover {
  color: #53c08b;
}
.pay-alert-contanier .layui-layer-setwin {
  right: 50%;
  top: 105%;
}
.pay-alert-contanier .layui-layer-setwin .layui-layer-close {
  background: url(https://image.xunyou.com/act/20221111/close_icon.png) 0 0;
  width: 30px;
  height: 86px;
}

/* 充值成功后 二次拉充弹框（典藏卡） */
.secondpay-alert-contanier #secondQrcode .shadow {
  position: absolute;
  width: 170px;
  height: 166px;
  line-height: 166px;
  background: rgba(0, 0, 0, 0.6);
  display: none;
}
.secondpay-alert-contanier #secondQrcode .pay-alert-success {
  background: url(https://image.xunyou.com/act/20221111/pay_success.jpg) center
    top no-repeat;
  width: 170px;
  height: 166px;
}
.secondpay-alert-contanier #secondQrcode .shadow a {
  color: #fff;
  font-size: 18px;
}
#secondpay-alert-wrapper .pay-alert-close {
  color: #fff;
  cursor: pointer;
  position: absolute;
  bottom: 40px;
  right: 24px;
  text-decoration: underline;
}
#secondpay-alert-wrapper .pay-alert-close:hover {
  text-decoration: none;
}
.pay-alert-contanier .pay-alert .pay-alert-close {
  position: absolute;
  background: url(https://image.xunyou.com/act/20221111/close_icon.png) center
    top no-repeat;
  width: 30px;
  height: 86px;
  bottom: -60px;
  left: 330px;
  cursor: pointer;
}
.layui-layer.secondpay-alert-contanier {
  background: url(https://image.xunyou.com/2023/0406/secode_cz_bg.png) center
    no-repeat;
  height: 593px;
}
#secondpay-alert-wrapper {
  display: flex;
}
#secondpay-alert-wrapper .left {
  position: absolute;
  top: 100px;
  left: 60px;
}
#secondpay-alert-wrapper .right {
  color: #000;
  position: absolute;
  /* top: 245px; */
  right: 77px;
}
.secondpay-alert-contanier .userAccount {
  margin: 78px 0 35px;
  text-align: left;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  width: 170px;
}
.secondpay-alert-contanier .right .money {
  color: #fb4ef5;
  line-height: 36px;
  margin: 10px 0 20px;
}
#second-sure-alert {
  align-items: center;

  display: flex;

  justify-content: center;
}
.second-sure-alert {
  /* background: url(/2022/20221207/second_sure_btn.png) center no-repeat; */
  width: 396px;
  height: 227px;
  background-image: linear-gradient(
    to right bottom,
    #d7f4ec,
    #f9fdfc,
    #d7f4ec
  ) !important;
}
.second-sure-alert .layui-layer-btn0,
.second-sure-alert .layui-layer-btn1 {
  width: 116px;
  height: 40px;
  box-sizing: border-box;
  line-height: 40px;
  font-size: 18px;
  font-weight: 300;
  border-radius: 8px;
  border: none;
  color: #fff;
}
.second-sure-alert .layui-layer-btn0 {
  background-image: linear-gradient(to right bottom, #ebe6e6, #b1b1b1);
}
.second-sure-alert .layui-layer-btn1 {
  background-image: linear-gradient(to right bottom, #63ddac, #01c778);
}
.second-sure-alert .layui-layer-btn {
  position: relative;
  bottom: 30px;
}