.Lottery {
  position: relative;
  width: 49.71vw;
  height: 10.93vw;
  max-height: 60px;
  background: linear-gradient(180deg, #ffdc7b 0%, #fec75c 100%);
  display: flex;
  text-align: center;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #ffff;
  font-size: 1.2em;
  font-weight: 600;
  color: #9d5f28;
  border-radius: 1.1em;
  box-shadow: 6px 4px 4px #cd8133;
  margin-top: -3%;
  cursor: pointer;
}

.block-container {
  display: block;
  width: 100%;
  height: 100%;
}

.allMachineStyle {
  position: relative;
  width: 100%;
  padding: 42%;
  // width: 74vw;
  // height: 61vw;

  .SlotMachineBG {
    .img {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
    }

    .title {
      position: absolute;
      top: 3%;
      left: 50%;
      transform: translateX(-50%);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;

      .count {
        font-size: 6vw;
        font-weight: 400;
        color: #f4efa8;
        text-shadow: 0 0 1px #2c3287, 0 0 0 #a9a214, 0 0 3px rgba(255, 216, 155, 0.73);

        background: linear-gradient(-14deg, #fdfdf1 0%, #f3ed9d 100%);
        -webkit-background-clip: text;
        // -webkit-text-fill-color: transparent;
      }

      .count-message {
        font-size: 2vw;
        font-weight: 400;
        color: #fadf80;
        text-shadow: 0 0 0 #cd9a60, 0 1px 1px rgba(0, 0, 0, 0.4);
        background: linear-gradient(0deg, #f9dc6d 0%, #fbe7ab 100%);
        -webkit-background-clip: text;
        margin-top: -10%;
        transform: scale(0.9);
      }
    }

    .btn {
      position: absolute;
      width: 28%;
      top: 60%;
      left: 50%;
      transform: translateX(-50%);
      z-index: 3;
      cursor: pointer;

      .btn-box {
        width: 100%;
        height: 100%;

        img {
          width: 100%;
          height: 100%;
        }
      }
    }

    .mask {
      position: absolute;
      width: 75.5%;
      // height: 28%;
      // top: 30%;
      height: 34%;
      top: 23%;
      left: 12.5%;
      background: linear-gradient(to bottom, #333 0%, #eee 45%, #fff 50%, #eee 75%, #333 120%);
      border-radius: 1vw;
      overflow: hidden;

      :nth-child(1) {
        width: 100% !important;
        height: 100% !important;
      }
    }

    .windows-img {
      position: absolute;
      top: 19.5%;
      left: 9%;
      width: 83%;
      height: 46%;
    }

    .ticket {
      position: absolute;
      top: 86%;
      left: 14%;
      width: 72%;
      height: 69%;
      z-index: 3;
      transform: translateY(0);
      transition: 1s;
      // background-size: ;
      // background-image: ;
      // background的值的顺序是background-color，background-image，background-repeat，background-attachment，background-position,background-size。
      background: url(//img.maimairen.com/low-code/components/slot001/ticket.png) no-repeat center
        bottom/ 100% 100%;

      img {
        width: 100%;
        height: 100%;
      }
    }

    .noTicket {
      position: absolute;
      top: 86%;
      left: 14%;
      width: 72%;
      height: 0;
      transform: translateY(-50%);
      // background: url('') center top/ no-repeat;
      // background-image: url(//img.maimairen.com/low-code/components/slot001/ticket.png);

      img {
        width: 100%;
        height: 100%;
      }
    }

    .textDescription {
      position: absolute;
      display: flex;
      width: 100%;
      height: 100%;
      flex-direction: column;
      align-items: center;
      justify-content: center;

      .title {
        position: absolute;
        top: 17%;
        font-size: 4vw;
        font-weight: 500;
        color: #84642e;
        line-height: 8px;
        transform: scale(0.9) translateX(-54%);
      }

      .icon {
        position: absolute;
        top: 22%;
        width: 26%;
      }

      .noIcon {
        display: none;
      }

      .message {
        position: absolute;
        top: 54%;
        font-size: 3vw;
        font-weight: 500;
        color: #84642e;
        line-height: 8px;
        transform: scale(0.9);
      }

      .getBtn {
        position: absolute;
        top: 68%;
        text-align: center;
        width: 55%;
        height: 16%;

        .outer {
          display: flex;
          align-items: center;
          justify-content: center;
          width: 100%;
          height: 100%;
          background-color: #faf6f0;
          border-radius: 5vw;
          cursor: pointer;

          .inner {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            height: 100%;
            background: linear-gradient(#fc7d2b, #d3241e);
            border-radius: 5vw;
            font-size: 3vw;
            font-family: Source Han Sans CN;
            font-weight: 800;
            color: #fffffd;
          }
        }
      }
    }
  }
}
