* {
  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: 5.625rem;
      background-image: url("/static/specials/images/shrqhd_bg1.jpg");
      background-repeat: no-repeat;
      background-size: 100% 100%; }
    .specials-container .panel.p2 {
      height: 5.20833rem;
      background-image: url("/static/specials/images/shrqhd_bg2.png");
      background-repeat: no-repeat;
      background-size: 100% 100%; }
      .specials-container .panel.p2 .gift-group {
        width: 4.96354rem;
        margin-top: 0.25rem;
        margin-left: 0.05208rem;
        display: flex;
        justify-content: space-between; }
        .specials-container .panel.p2 .gift-group .btn {
          margin-top: 0.05208rem;
          margin-left: 0.05208rem;
          width: 2.24479rem;
          height: 0.61458rem;
          cursor: pointer; }
        .specials-container .panel.p2 .gift-group .gift-normal {
          width: 2.32292rem;
          height: fit-content;
          display: flex;
          flex-flow: column;
          position: relative;
          cursor: pointer; }
          .specials-container .panel.p2 .gift-group .gift-normal .cover-wrapper {
            position: relative; }
            .specials-container .panel.p2 .gift-group .gift-normal .cover-wrapper .cover {
              width: 100%; }
            .specials-container .panel.p2 .gift-group .gift-normal .cover-wrapper .tips {
              display: none;
              position: absolute;
              width: 1.91667rem;
              height: 1.95313rem;
              left: 50%;
              transform: translateX(-50%);
              top: -1.5625rem; }
            .specials-container .panel.p2 .gift-group .gift-normal .cover-wrapper:hover .tips {
              display: block; }
          .specials-container .panel.p2 .gift-group .gift-normal .btn.normal {
            width: 2.24479rem;
            height: 0.61458rem;
            background-image: url("/static/specials/images/shrqhd_btn_normal_recieve_off.png");
            background-repeat: no-repeat;
            background-size: 100% 100%; }
          .specials-container .panel.p2 .gift-group .gift-normal .btn.nothing {
            width: 2.21354rem;
            height: 0.58333rem;
            background-image: url("/static/specials/images/shrqhd_btn_normal_nothing.png");
            background-repeat: no-repeat;
            background-size: 100% 100%; }
          .specials-container .panel.p2 .gift-group .gift-normal .btn.view {
            width: 2.21354rem;
            height: 0.58333rem;
            background-image: url("/static/specials/images/shrqhd_btn_normal_view.png");
            background-repeat: no-repeat;
            background-size: 100% 100%; }
        .specials-container .panel.p2 .gift-group .gift-vip {
          width: 2.29167rem;
          height: fit-content;
          display: flex;
          flex-flow: column;
          position: relative; }
          .specials-container .panel.p2 .gift-group .gift-vip .cover-wrapper {
            position: relative; }
            .specials-container .panel.p2 .gift-group .gift-vip .cover-wrapper .cover {
              width: 100%; }
            .specials-container .panel.p2 .gift-group .gift-vip .cover-wrapper .tips {
              display: none;
              position: absolute;
              width: 1.91667rem;
              height: 1.29688rem;
              left: 50%;
              transform: translateX(-50%);
              top: -0.90625rem; }
            .specials-container .panel.p2 .gift-group .gift-vip .cover-wrapper:hover .tips {
              display: block; }
          .specials-container .panel.p2 .gift-group .gift-vip .btn.normal {
            width: 2.24479rem;
            height: 0.61458rem;
            background-image: url("/static/specials/images/shrqhd_btn_vip_recieve_on.png");
            background-repeat: no-repeat;
            background-size: 100% 100%; }
          .specials-container .panel.p2 .gift-group .gift-vip .btn.nothing {
            width: 2.21354rem;
            height: 0.58333rem;
            background-image: url("/static/specials/images/shrqhd_btn_vip_nothing.png");
            background-repeat: no-repeat;
            background-size: 100% 100%; }
          .specials-container .panel.p2 .gift-group .gift-vip .btn.view {
            width: 2.21354rem;
            height: 0.58333rem;
            background-image: url("/static/specials/images/shrqhd_btn_vip_view.png");
            background-repeat: no-repeat;
            background-size: 100% 100%; }
      .specials-container .panel.p2 .act-time-range {
        margin-top: 1.69792rem;
        width: 5.98438rem;
        height: 0.45313rem; }
    .specials-container .panel.p3 {
      height: 7.09375rem;
      background-image: url("/static/specials/images/shrqhd_bg3.png");
      background-repeat: no-repeat;
      background-size: 100% 100%;
      position: relative; }
      .specials-container .panel.p3 .rule-num {
        position: absolute;
        width: 0.57813rem;
        height: 4.35938rem;
        left: 2.5rem;
        top: 1.04167rem;
        background-image: url("/static/specials/images/shrqhd_rule_num.png");
        background-repeat: no-repeat;
        background-size: 100% 100%; }
      .specials-container .panel.p3 .rule-bg {
        position: absolute;
        left: 3.33854rem;
        top: 1.06771rem;
        width: 4.05208rem;
        height: 4.27083rem;
        background-image: url("/static/specials/images/shrqhd_rule.png");
        background-repeat: no-repeat;
        background-size: 100% 100%; }

.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;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #FFFFFF;
    text-align: center; }
    .mask .modal-bg .close-icon {
      width: 0.15625rem;
      height: 0.15625rem;
      background-image: url("/static/specials/images/shrqhd_btn_close.png");
      background-repeat: no-repeat;
      background-size: 100% 100%;
      position: absolute;
      top: 0.11979rem;
      right: 0.27604rem;
      cursor: pointer; }
    .mask .modal-bg .content {
      margin-top: 1.17188rem;
      color: #D01F1B;
      text-align: center;
      font-size: 0.1875rem;
      line-height: 0.29167rem; }
    .mask .modal-bg .btn-copy {
      margin-top: 0.14583rem;
      width: 0.59896rem;
      height: 0.26042rem;
      background-image: url("/static/specials/images/shrqhd_btn_copy.png");
      background-repeat: no-repeat;
      background-size: 100% 100%;
      cursor: pointer; }
    .mask .modal-bg .btn-vip-tip {
      margin-top: 1.77604rem;
      width: 1.63021rem;
      height: 0.26042rem;
      background-image: url("/static/specials/images/shrqhd_btn_vip_tip.png");
      background-repeat: no-repeat;
      background-size: 100% 100%;
      cursor: pointer;
      display: block; }

#modal-suc-normal .modal-bg {
  width: 3.35938rem;
  height: 2.63542rem;
  background-image: url("/static/specials/images/shrqhd_suc_normal_bg.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  display: flex;
  flex-flow: column;
  align-items: center; }

#modal-suc-vip .modal-bg {
  width: 3.35938rem;
  height: 2.63542rem;
  background-image: url("/static/specials/images/shrqhd_suc_vip_bg.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  display: flex;
  flex-flow: column;
  align-items: center; }

#modal-vip-tip .modal-bg {
  width: 3.35938rem;
  height: 2.63542rem;
  background-image: url("/static/specials/images/shrqhd_viptip_bg.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  display: flex;
  flex-flow: column;
  align-items: center; }
