* {
  box-sizing: border-box;
  padding: 0;
  margin: 0; }

a {
  text-decoration: none; }

li {
  list-style: none; }

.specials-container {
  margin: 0 auto;
  padding-top: 90px;
  min-width: 1300px;
  max-width: 1920px;
  width: 100%;
  display: flex;
  flex-direction: column;
  color: #FFFFFF; }
  .specials-container a {
    display: block; }
  .specials-container .panel {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center; }
    .specials-container .panel.p1 {
      height: 4.39063rem;
      background-image: url("/static/specials/images/qyps5_bg1.png");
      background-repeat: no-repeat;
      background-size: 100% 100%; }
      .specials-container .panel.p1 .bag-tips {
        font-size: 0.125rem;
        font-weight: bold;
        color: #281156;
        line-height: 0.15104rem;
        margin-top: 3.97396rem;
        margin-right: 0.05208rem; }
    .specials-container .panel.p2 {
      height: 5.29167rem;
      background-image: url("/static/specials/images/qyps5_bg2.png");
      background-repeat: no-repeat;
      background-size: 100% 100%; }
      .specials-container .panel.p2 .btn {
        width: 1.82292rem;
        height: 0.42708rem;
        margin-top: 0.23958rem; }
        .specials-container .panel.p2 .btn.star {
          background-image: url("/static/specials/images/qyps5_btn_star.png");
          background-repeat: no-repeat;
          background-size: 100% 100%;
          cursor: pointer; }
        .specials-container .panel.p2 .btn.star-dis {
          background-image: url("/static/specials/images/qyps5_btn_star_dis.png");
          background-repeat: no-repeat;
          background-size: 100% 100%; }
        .specials-container .panel.p2 .btn.star-over {
          background-image: url("/static/specials/images/qyps5_btn_star_over.png");
          background-repeat: no-repeat;
          background-size: 100% 100%; }
      .specials-container .panel.p2 .count {
        margin-top: 0.05729rem;
        font-size: 0.125rem;
        color: #E4D2FF;
        line-height: 0.125rem; }
      .specials-container .panel.p2 .waiting {
        margin-top: 0.57813rem;
        width: 5.72917rem;
        height: 2.83854rem; }
      .specials-container .panel.p2 .slogan {
        margin-top: 0.31771rem;
        width: 4.10938rem;
        height: 0.42188rem; }
      .specials-container .panel.p2 .tips {
        margin-top: 0.03125rem;
        font-size: 0.125rem;
        font-style: italic;
        color: #CCAAFF;
        line-height: 0.13542rem; }
    .specials-container .panel.p3 {
      height: 6rem;
      background-image: url("/static/specials/images/qyps5_bg3.png");
      background-repeat: no-repeat;
      background-size: 100% 100%;
      position: relative; }
      .specials-container .panel.p3 .ljb-wrapper {
        width: 8.13021rem;
        height: 2.28646rem;
        margin-top: 0.15104rem;
        margin-left: 0.07292rem;
        background-image: url("/static/specials/images/qyps5_ljb_bg.png");
        background-repeat: no-repeat;
        background-size: 100% 100%;
        position: relative; }
        .specials-container .panel.p3 .ljb-wrapper .item {
          font-size: 0.09375rem;
          color: #FFFFFF;
          line-height: 0.11979rem;
          position: absolute; }
          .specials-container .panel.p3 .ljb-wrapper .item span {
            font-weight: bold; }
          .specials-container .panel.p3 .ljb-wrapper .item.item1 {
            top: 0.28646rem;
            left: 1.02604rem; }
          .specials-container .panel.p3 .ljb-wrapper .item.item2 {
            top: 0.89063rem;
            left: 0.64583rem; }
          .specials-container .panel.p3 .ljb-wrapper .item.item3 {
            top: 1.54688rem;
            left: 1.07292rem; }
          .specials-container .panel.p3 .ljb-wrapper .item.item4 {
            text-align: right;
            top: 0.22917rem;
            right: 1.03125rem; }
          .specials-container .panel.p3 .ljb-wrapper .item.item5 {
            text-align: right;
            top: 0.88542rem;
            right: 0.65625rem; }
          .specials-container .panel.p3 .ljb-wrapper .item.item6 {
            text-align: right;
            top: 1.54688rem;
            right: 1.125rem; }
      .specials-container .panel.p3 .ljb-btn {
        width: 1.82292rem;
        height: 0.42708rem;
        background-image: url("/static/specials/images/qyps5_btn_ljb.png");
        background-repeat: no-repeat;
        background-size: 100% 100%;
        padding-top: 0.11458rem;
        padding-left: 0.40625rem;
        font-size: 0.15104rem;
        font-weight: bold;
        color: #000000;
        display: block;
        text-decoration: none; }
      .specials-container .panel.p3 .rule-title {
        margin-top: 0.8125rem;
        width: 1.64063rem;
        height: 0.42188rem; }
      .specials-container .panel.p3 .rule-content {
        position: absolute;
        left: 3.18229rem;
        bottom: 0.40625rem; }
        .specials-container .panel.p3 .rule-content .item {
          font-size: 0.125rem;
          color: #FFFFFF;
          line-height: 0.1875rem; }

.mask {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 99; }
  .mask .modal-bg {
    position: absolute;
    width: 3.375rem;
    height: 1.79167rem;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #FFFFFF;
    text-align: center;
    background-image: url("/static/specials/images/qyps5_modal_bg.png");
    background-repeat: no-repeat;
    background-size: 100% 100%; }
    .mask .modal-bg .close-icon {
      width: 0.36458rem;
      height: 0.28125rem;
      background-image: url("/static/specials/images/qyps5_modal_close.png");
      background-repeat: no-repeat;
      background-size: 100% 100%;
      position: absolute;
      top: -0.0625rem;
      right: -0.11458rem;
      cursor: pointer; }
    .mask .modal-bg .coupon-wrapper {
      left: 0.78125rem;
      top: 0.18229rem;
      width: 2.15625rem;
      height: 0.59375rem;
      position: absolute;
      background-image: url("/static/specials/images/qyps5_coupon_bg.png");
      background-repeat: no-repeat;
      background-size: 100% 100%; }
      .mask .modal-bg .coupon-wrapper .name {
        position: absolute;
        left: 0.78125rem;
        top: 0.17708rem;
        font-size: 0.10417rem;
        color: #FFFFFF;
        line-height: 0.15625rem; }
      .mask .modal-bg .coupon-wrapper .tip {
        position: absolute;
        left: 0.89063rem;
        top: 0.32813rem;
        font-size: 0.125rem;
        color: #FFFFFF;
        line-height: 0.15625rem;
        font-weight: bold; }
    .mask .modal-bg .btn-use {
      display: block;
      margin-top: 0.89583rem;
      margin-left: 1.20313rem;
      width: 1.08333rem;
      height: 0.27604rem;
      background-image: url("/static/specials/images/qyps5_btn_recieve.png");
      background-repeat: no-repeat;
      background-size: 100% 100%;
      cursor: pointer; }
    .mask .modal-bg .reward-tip {
      margin-top: 0.15625rem;
      margin-left: 0.07813rem;
      font-size: 0.125rem;
      font-weight: bold;
      color: #FFFFFF;
      line-height: 0.18229rem;
      text-align: center; }