$deviceWidth: 750;
@function vmin($rpx) {
  @return #{$rpx * 100 / $deviceWidth}vmin;
}

@mixin reward-list {
    position: relative;
    height: 100%;
    overflow: hidden;
    .go-back-icon {
      position: absolute;
      top: vmin(30);
      left: vmin(20);
      width: vmin(36);
      height: vmin(36);
    }
    .title-box {
      display: flex;
      justify-content: center;
      padding-bottom: vmin(10);
      .title {
        width: vmin(250);
        height: vmin(100);
      }
    }
    .prompt {
      display: flex;
      justify-content: space-between;
      box-sizing: border-box;
      padding: 0 vmin(30) vmin(30) vmin(30);
      .left {
        color: #fff;
        font-size: vmin(24);
        font-weight: 500;
      }
      .right {
        display: flex;
        align-items: center;
        color: #fff;
        font-size: vmin(24);
        font-weight: 500;
        .right-arrow-icon {
          width: vmin(32);
          height: vmin(32);
        }
      }
    }
    .reward-list-box {
      padding: 0 vmin(30);
    }
    .reward-empty {
      display: flex;
      align-items: center;
      flex-direction: column;
      justify-content: center;
      height: calc(100% - #{vmin(180)});
      .empty-icon {
        width: vmin(200);
        height: vmin(200);
      }
      .desc {
        padding-top: vmin(40);
        color: #ffbd67;
        font-size: vmin(28);
      }
    }
}

.reward-list {
    @include reward-list;
}
// 竖屏pad
@media screen and (min-width: 768px) and (orientation: portrait) {
    $deviceWidth: 1536 !global;

    .reward-list {
        @include reward-list;
    }
}
// PC 放大适配
@media screen and (min-height: 630px) and (orientation: landscape) {
  $deviceWidth: 1260 !global;

  .reward-list {
    @include reward-list;
  }
}
// 横屏pad
@media screen and (min-height: 768px) and (orientation: landscape) {
    $deviceWidth: 1536 !global;

    .reward-list {
        @include reward-list;
    }
}