#xjdj {
  padding-top: 2rem;
  margin-bottom: 1rem;
}
#xjdj .xjdj_content {
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 4.69rem);
  justify-content: center;
  column-gap: 0.16rem;
  row-gap: 0.28rem;
  width: 14.4rem;
}
#xjdj .xjdj_content img {
  width: 4.69rem;
  height: 1.47rem;
  display: block;
}
#xjdj .xjdj_content img.rank1 {
  grid-column: 1 / 4;
  justify-self: center;
  width: 7.5rem;
  height: 2.35rem;
}
#jsjl {
  user-select: none;
  margin-bottom: 1rem;
}
#jsjl .jl {
  width: 12.74rem;
  height: 2.21rem;
  background-image: url(../images/rewards/jsjl_bg.png);
  background-size: 12.74rem 2rem;
  background-position: 0 100%;
  background-repeat: no-repeat;
  margin: 0 auto 0.5rem;
  padding-left: 0.67rem;
  position: relative;
}
#jsjl .jl:nth-last-child(1) {
  margin-bottom: 0;
}
#jsjl .jl .jb {
  width: 0.91rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#jsjl .jl .jb img {
  width: 100%;
  height: auto;
}
#jsjl .jl .jb p {
  margin-top: 0.2rem;
  font-size: 0.24rem;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
}
#jsjl .jl ul {
  width: 8.7rem;
  position: absolute;
  right: 0.5rem;
  top: 0.45rem;
  display: flex;
  justify-content: space-around;
  align-items: center;
}
#jsjl .jl ul li {
  width: 1.18rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#jsjl .jl ul li .jl-box {
  width: 1.18rem;
  height: 1.18rem;
  background: url(../images/rewards/reward_bg.png) no-repeat 0 0 / 100% 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
#jsjl .jl ul li .jl-box img {
  width: 85%;
  height: auto;
}
#jsjl .jl ul li p {
  margin-top: 0.12rem;
  white-space: nowrap;
  color: #fff;
  font-size: 0.16rem;
  text-align: center;
}
#jsjl .jl ul li:nth-child(2) .jl-box img,
#jsjl .jl ul li:nth-last-child(1) .jl-box img {
  width: 99%;
}
#jsjl .jl.jl1 ul {
  width: 9rem;
}
#hxjl .tit3 {
  margin-bottom: 0;
}
#hxjl .ftit {
  width: 3.66rem;
  margin-bottom: 0.2rem;
}
#hxjl .ftit.ftit-tts {
  margin-bottom: 0;
}
#hxjl .box {
  margin: 0 auto;
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
#hxjl .box-tit {
  display: block;
  margin: 0 auto;
  height: auto;
}
#hxjl .box-777 {
  width: 14.02rem;
  height: 7.77rem;
  background-image: url(../images/rewards/777.png);
  padding-top: 0.5rem;
  margin-bottom: 0.28rem;
}
#hxjl .box-777 .box-tit {
  width: 1.52rem;
  margin-bottom: 0.25rem;
}
#hxjl .box-777 ul {
  width: calc(1000 / 1402 * 100%);
  margin: 0 auto;
}
#hxjl .box-777 ul li {
  padding-left: 0.4rem;
  height: 0.6rem;
  line-height: 0.6rem;
  color: #fff;
  font-size: 0.24rem;
  position: relative;
}
#hxjl .box-777 ul li::before {
  content: '·';
  position: absolute;
  left: 0.2rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.2rem;
  font-weight: 700;
}
#hxjl .box-777 ul li:nth-child(2n+1) {
  background-color: rgba(32, 23, 99, 0.34);
}
#hxjl .box-931 {
  margin-top: 0.4rem;
  padding-top: 0.6rem;
  width: 13.73rem;
  height: 9.31rem;
  background-image: url(../images/rewards/931.png);
}
#hxjl .box-931 .box-tit {
  width: 1.52rem;
  margin-bottom: 0.23rem;
}
#hxjl .box-931 ul {
  width: 11.04rem;
  margin: 0 auto;
}
#hxjl .box-931 ul li {
  display: flex;
  align-items: center;
  margin-bottom: 0.52rem;
  min-height: 1.35rem;
}
#hxjl .box-931 ul li:last-child {
  margin-bottom: 0;
}
#hxjl .box-931 ul li .round {
  width: 2.37rem;
  min-height: 1.35rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  background: rgba(98, 90, 230, 0.51);
  color: #fff;
  font-size: 0.3rem;
  font-weight: 700;
}
#hxjl .box-931 ul li .reward-detail {
  flex: 1;
}
#hxjl .box-931 ul li .reward-line {
  display: flex;
  align-items: center;
  height: 0.665rem;
  padding: 0 0.24rem;
  color: #fff;
  font-size: 0.24rem;
  line-height: 1.4;
  background-color: rgba(32, 23, 99, 0.34);
}
#hxjl .box-931 ul li .reward-line img {
  width: 0.59rem;
  height: zuto;
  margin-right: 0.1rem;
  flex: none;
}
#hxjl .box-931 ul li .reward-line .status {
  width: 0.6rem;
  margin-right: 0.16rem;
  flex: none;
}
#hxjl .box-931 ul li .reward-line p {
  flex: 1;
  white-space: nowrap;
}
#hxjl .box-931 ul li .reward-line.reward-lose {
  background-color: rgba(32, 23, 99, 0.6);
}
#hxjl .box-931 ul li .reward-line.reward-lose img {
  width: 0.57rem;
}
#hxjl .box-994 {
  margin-top: 0.36rem;
  width: 13.73rem;
  height: 9.94rem;
  background-image: url(../images/rewards/994.png);
  padding-top: 0.54rem;
}
#hxjl .box-994 .box-tit {
  width: 1.52rem;
  margin-bottom: 0.23rem;
}
#hxjl .box-994 ul {
  width: 11.04rem;
  margin: 0 auto;
}
#hxjl .box-994 ul li {
  width: 100%;
  background-color: rgba(32, 23, 99, 0.34);
  display: flex;
  margin-bottom: 0.3rem;
}
#hxjl .box-994 ul li .round {
  width: 1.72rem;
  min-height: 1.35rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  background: rgba(98, 90, 230, 0.51);
  color: #fff;
  font-size: 0.3rem;
  font-weight: 700;
}
#hxjl .box-994 ul li .reward-detail {
  flex: 1;
  padding-left: 0.4rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 0.24rem;
  color: #fff;
}
#hxjl .box-694 {
  transform: translateX(-0.15rem);
  width: 14rem;
  height: 6.94rem;
  background-image: url(../images/rewards/694.png);
  margin-top: 0.55rem;
  margin-bottom: 0.5rem;
  padding-top: 0.75rem;
}
#hxjl .box-694 .box-tit {
  width: 2.96rem;
  margin-bottom: 0.35rem;
}
#hxjl .box-694 ul {
  width: 11.04rem;
  margin: 0 auto;
}
#hxjl .box-694 ul li {
  width: 100%;
  background-color: rgba(32, 23, 99, 0.34);
  display: flex;
  margin-bottom: 0.3rem;
}
#hxjl .box-694 ul li .round {
  width: 1.72rem;
  min-height: 0.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  background: rgba(98, 90, 230, 0.51);
  color: #fff;
  font-size: 0.3rem;
  font-weight: 700;
}
#hxjl .box-694 ul li .reward-detail {
  flex: 1;
  padding-left: 0.4rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 0.24rem;
  color: #fff;
}
#jsjl-last .box-js {
  width: 14rem;
  height: 6.94rem;
  background-image: url(../images/rewards/694.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: 0 0;
  margin: 0 auto;
  padding-top: 0.75rem;
}
#jsjl-last .box-js .box-tit {
  height: 0.64rem;
  width: auto;
  margin: 0 auto 0.15rem;
  display: block;
}
#jsjl-last .box-js .reward-detail {
  width: 11.04rem;
  margin: 0 auto 0.46rem;
}
#jsjl-last .box-js .reward-detail .reward-line {
  display: flex;
  align-items: center;
  height: 0.665rem;
  padding: 0 0.24rem;
  color: #fff;
  font-size: 0.24rem;
  line-height: 1.4;
  background-color: rgba(32, 23, 99, 0.34);
}
#jsjl-last .box-js .reward-detail .reward-line img {
  width: 0.59rem;
  height: zuto;
  margin-right: 0.1rem;
  flex: none;
}
#jsjl-last .box-js .reward-detail .reward-line .status {
  width: 0.6rem;
  margin-right: 0.16rem;
  flex: none;
}
#jsjl-last .box-js .reward-detail .reward-line p {
  flex: 1;
  white-space: nowrap;
}
#jsjl-last .box-js .reward-detail .reward-line.reward-lose {
  background-color: rgba(32, 23, 99, 0.6);
}
#jsjl-last .box-js .reward-detail .reward-line.reward-lose img {
  width: 0.57rem;
}
#jsjl-last .box-jsxsfwq .box-tit-jsxsfwq {
  height: 0.57rem;
  margin-bottom: 0.4rem;
}
#jsjl-last .box-jsxsfwq ul {
  width: 11.04rem;
  margin: 0 auto;
}
#jsjl-last .box-jsxsfwq ul li {
  width: 100%;
  background-color: rgba(32, 23, 99, 0.34);
  display: flex;
  margin-bottom: 0.23rem;
}
#jsjl-last .box-jsxsfwq ul li .round {
  width: 2.04rem;
  min-height: 0.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  background: rgba(98, 90, 230, 0.51);
  color: #fff;
  font-size: 0.3rem;
  font-weight: 700;
}
#jsjl-last .box-jsxsfwq ul li .reward-detail {
  flex: 1;
  padding-left: 0.4rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 0.24rem;
  color: #fff;
  margin-bottom: 0;
}
@media screen and (max-width: 750px) {
  body,
  #app {
    overflow-x: hidden;
  }
  .page-area .tit {
    margin-bottom: 0.2rem;
  }
  #xjdj {
    margin-bottom: 0.5rem;
  }
  #xjdj .xjdj_content {
    display: block;
    width: 100%;
  }
  #xjdj .xjdj_content img {
    margin-left: -0.1rem;
    width: 7.5rem;
    height: 2.35rem;
  }
  #xjdj .xjdj_content img.rank1 {
    justify-self: unset;
    margin: 0 auto;
    display: block;
    margin-left: -0.1rem;
  }
  #jsjl {
    margin-bottom: 0;
  }
  #jsjl .jl {
    transform: scale(0.6);
    transform-origin: 0 0;
    margin-bottom: -0.6rem;
  }
  #jsjl .jl ul li p {
    font-size: 0.22rem;
  }
  #hxjl .box-777 {
    transform: scale(0.7);
    transform-origin: -4rem 0;
    margin-bottom: -2rem;
  }
  #hxjl .box-931 {
    transform: scale(0.72);
    transform-origin: -4rem 0;
    margin-bottom: -2rem;
  }
  #hxjl .box-994 {
    transform: scale(0.72);
    transform-origin: -3.5rem 0;
    margin-bottom: -2rem;
    margin-top: 0;
  }
  #hxjl .box-694 {
    margin-top: 0;
    transform: scale(0.72);
    transform-origin: -3.5rem 0;
    margin-bottom: -1rem;
  }
  #jsjl-last .box-js {
    transform: scale(0.72);
    transform-origin: -3.5rem 0;
    margin-bottom: -1.5rem;
  }
}