@import "../../res.less";

.prizepage_wrap {
  width: 750px;
  height: 1624px;
  left: 0px;
  top: 0px;
  position: absolute;
  background-color: #fff5d3;

  .prizepage {
    width: 750px;
    height: 1624px;
    left: 0px;
    // top: -200px;
    position: absolute;
    background-color: #fff5d3;

    // transform: translateY(-50%);

    .bg {
      width: 750px;
      height: 1624px;
      left: 0px;
      top: 0px;
      position: absolute;
      .sparkBg("PrizePage/bg.png");
    }

    .all_tab {
      width: 665px;
      height: 80px;
      position: absolute;
      left: 40px;
      top: 347px;
      overflow-x: auto;
      display: flex;
      flex-direction: row;
      flex-wrap: nowrap;
      .hideScrollbar();

      .tab_item {
        width: 122px;
        height: 70px;
        text-align: center;
        left: 0;
        top: 0;
        position: relative;
        margin-right: 40px;
        flex-shrink: 0;
        font-size: 29px;
        color: #fff;
        font-weight: 700;
        line-height: 70px;
        .lineClamp1();

        .stick {
          position: absolute;
          left: 31px;
          top: 60px;
          width: 59px;
          height: 5px;
          background-color: rgb(255, 255, 254);
        }

      }

      .opacity {
        background-image:none !important;
        // opacity: 0.6;
      }
    }

    .list {
      width: 683px;
      height: calc(50vh + 340px);
      left: 31px;
      top: 443px;
      // bottom: 20px;
      position: absolute;
      overflow-y: scroll;

      .item {
        width: 683px;
        height: 155px;
        left: 0px;
        top: 0px;
        position: relative;
        margin-bottom: 13px;

        .bg_item {
          width: 683px;
          height: 155px;
          left: 0px;
          top: 0px;
          position: absolute;
          .sparkBg("PrizePage/bg_item.png");
        }

        .img {
          width: 112px;
          height: 112px;
          left: 26px;
          top: 19px;
          position: absolute;
          // border: 1px solid #e5c362;
          border-radius: 10px;
        }

        .name {
          width: 350px;
          // height: 28px;
          left: 160px;
          top: 20px;   
          position: absolute;
          font-size: 26px;
          // line-height: 28px;  
          color: #262626;
          .lineClamp1();
          font-weight: bold;
        }

        .prize_time {
          width: 450px;
          height: 28px;
          left: 160px;
          top: 75px;
          position: absolute;
          font-size: 18px;
          // line-height: 28px;
          color: #afafaf;
          .lineClamp1();
        }

        .expire_time {
          width: 450px;
          height: 28px;
          left: 160px;
          top: 105px;
          position: absolute;
          font-size: 18px;
          // line-height: 28px;
          color: #afafaf;
          .lineClamp1();
        }

        .gobtn {
          width: 152px;
          height: 57px;
          left: 510px;    
          top: 60px; 
          position: absolute;
          .sparkBg("PrizePage/go-btn.png");
        }

        .gray_btn {
          width: 152px;
          height: 57px;
          left: 510px;    
          top: 60px; 
          position: absolute;
          .sparkBg("PrizePage/gray_btn.png");
        }
      }
      
      .empty_wrap {
        left: 44px;
        top: 110px;
        width: 600px;
        height: 378px;
        position: absolute;
        .empty_img {
          opacity: 0.569;
          left: 0px;
          top: 0px;
          width: 600px;
          height: 378px;
          position: absolute;
          .sparkBg("PrizePage/empty.png");
        }
        .empty {
          width: 100%;
          font-weight: bold;
          height: 30px;
          line-height: 30px;
          top: 360px;
          position: absolute;
          left: 0;
          text-align: center;
          font-size: 30px;
          color: rgb(70, 136, 22);
        }
      }
    }

    .back {
      left: 31px;
      top: 243px;
      width: 56px;
      height: 56px;
      transform-origin: left center;
      position: absolute;
      .sparkBg("PrizePage/back.png");
    }
  }
}