.view {
  background-image: url(https://r2beat-web-cdn.xiyouxi.com/images/sub/gift/daily_event/newyear/bg-min.jpg);
  position: relative;
  overflow: hidden;
}

.view .inner {
  max-width: 380px;
  margin: 50px auto;
  position: relative;
  z-index: 2;
}

.square-style {
  color: #fff;
}

.view h4 {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 3.25rem;
}
.view h4 div {
  background: none;
}

.view .wrap-input {
  border-radius: 4px;
  background: #c41c1c;
  border: 2px solid #c41c1c;
}

.view .wrap-input:before {
  border-radius: 4px;
  border: 2px solid #e9d5ff;
}

.view .wrap-input .remain-number {
  background: #7f0f12;
}

.view .wrap-input .btn-check {
  background-image: linear-gradient(to top, #ffbd00, #ffff00);
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  height: 17px;
  box-sizing: unset;
  padding: 2px 5px 1px;
  /* &.1{height:17px} */
}
.view .wrap-input .btn-check:hover {
  background-image: linear-gradient(to top, #8b0101, #ff4949);
  border: 2px solid #8b0101;
  padding: 5px 5px 0 5px;
  text-align: center;
}
.view .wrap-input .btn-check._2 {
  margin-right: 1.5px;
}

.view .wrap-input .btn-check, .view .wrap-input .btn-check:hover {
  border-radius: 1px;
}

.view .wrap-input .btn-check:before {
  border-radius: 3px;
  border: none;
  box-sizing: unset !important;
}

.my-product {
  color: #532f00;
  text-shadow: none;
  vertical-align: text-top;
}

.view .wrap-input .btn-check {
  color: #532f00;
  font-weight: bold;
}
.view .wrap-input .btn-check em {
  transition: 0.3s;
}

.view .wrap-input .btn-check:hover {
  color: #fff;
}
.view .wrap-input .btn-check:hover em {
  color: #fff;
}

.img-tit {
  margin-bottom: 0;
}

.img-tit img {
  height: 7.31rem;
}

#baby-box-wrap {
  background: url(https://r2beat-web-cdn.xiyouxi.com/images/sub/gift/daily_event/newyear/bg-box-min.png) no-repeat center;
  width: 100%;
  display: block;
  background-size: contain;
  text-align: center;
  height: 0;
  padding-bottom: 100%;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
}
#baby-box-wrap img {
  margin-top: 12%;
  max-width: 273px;
  width: 73%;
}

#btn-open-wrap {
  width: 100%;
  margin: 1.0625rem auto 0.9375rem;
  text-align: center;
  display: inline-block;
}
#btn-open-wrap .btn-open {
  display: inline;
  float: left;
  width: calc(50% - 6px);
  margin-left: 3px;
  margin-right: 3px;
  margin-bottom: 1%;
}
#btn-open-wrap .btn-open img {
  width: 100%;
  vertical-align: middle;
}
#btn-open-wrap .btn-open:nth-child(3), #btn-open-wrap .btn-open:last-child {
  margin-bottom: 0;
}

#btn-daily-lottery {
  max-width: 360px;
  width: 100%;
  display: block;
  margin: 0 auto;
  cursor: pointer;
}
#btn-daily-lottery img {
  width: 100%;
}

.cha {
  position: absolute;
  z-index: 1;
}
.cha img {
  width: 100%;
}

.chr-l {
  left: -1%;
  max-width: 390px;
  width: 44%;
  bottom: -7%;
}

.chr-r {
  right: -10px;
  max-width: 479px;
  width: 47%;
  bottom: -26%;
}

.view.notice {
  position: relative;
  z-index: 2;
  background: #7f0f12;
}
.view.notice dd {
  color: #dccbff;
}

#getItemRate .pop-layer {
  border: 4px solid #6726ae;
}
#getItemRate .pop-container .frame h1 {
  color: #fbb7ff;
  border-radius: unset;
  background: linear-gradient(45deg, #7f0f12, rgba(66, 16, 100, 0.6)), url(https://r2beat-web-cdn.xiyouxi.com/images/sub/gift/daily_event/popup-tit-bg-min.png) no-repeat right 0;
}
#getItemRate .pop-container .alert div.desc-basic {
  background: #ececec;
  border: none;
}
#getItemRate .wrap-btn {
  margin: 2.1rem 0 1.4rem;
}
#getItemRate .btn {
  width: 180px;
  height: 50px;
  line-height: 50px;
  background-image: linear-gradient(to top, #53147d, #7736a2);
  transition: 0.3s;
  color: #c978ff;
}
#getItemRate .btn:hover {
  background-image: linear-gradient(to top, #f636ec, #ff7aff);
  color: #fff;
}
#getItemRate .pop-container .close {
  background: url(https://r2beat-web-cdn.xiyouxi.com/images/sub/gift/daily_event/pop-close-min.png) center no-repeat;
  width: 36px;
  height: 36px;
  background-color: #7f0f12;
  top: -3.7rem;
  filter: brightness(1);
}
#getItemRate .pop-container .close:hover {
  filter: brightness(1.3);
}
#getItemRate .daily-item-rate-wrap {
  height: 24rem;
  overflow-y: scroll;
}
#getItemRate .daily-item-rate {
  text-align: center;
  display: inline-block;
}
#getItemRate .daily-item-rate th {
  background-color: #8a55ac;
  padding: 1.25rem 0.5rem;
  color: #fff;
  border-right: 1px solid #a077b9;
  font-size: 0.8125rem;
}
#getItemRate .daily-item-rate th:last-child {
  border-right: 1px solid transparent;
}
#getItemRate .daily-item-rate td {
  background-color: #ececec;
  padding: 1.25rem 0 1.1875rem;
  color: #2b2b2b;
  border-right: 1px solid #e2e2e2;
  font-size: 0.8125rem;
}
#getItemRate .daily-item-rate td:last-child {
  border-right: 1px solid transparent;
}

@media screen and (max-width: 1024px) {
  .img-tit img {
    height: 5.31rem;
  }
  .view h4 {
    margin-bottom: 1.25rem;
  }
}
@media screen and (max-width: 960px) {
  .cha {
    display: none;
  }
}
@media screen and (max-width: 860px) {
  .img-tit {
    margin: 70px auto 23px;
  }
  .img-tit img {
    width: 80%;
    height: auto;
  }
}
@media screen and (max-height: 775px) {
  #getItemRate .daily-item-rate-wrap {
    height: 40vh;
  }
  #getItemRate .wrap-btn {
    margin-top: 0.5rem;
  }
}
@media screen and (max-width: 568px) {
  .img-tit {
    margin: 90px auto 0;
  }
  .img-tit img {
    width: 100%;
  }
  .square-style, .square-style + span {
    font-size: 4vw;
  }
}
