$deviceWidth: 750;
@function vmin($rpx) {
  @return #{$rpx * 100 / $deviceWidth}vmin;
}

@mixin vertical-screen {
    &.win-lottery {
      position: relative;
      display: flex;
      overflow: hidden;
      align-items: center;
      flex-direction: column;
      justify-content: space-between;
      box-sizing: border-box;
      height: 100%;
      padding-top: vmin(108);
      .win-lottery-top{
        display: flex;
        overflow: hidden;
        align-items: center;
        flex-direction: column;
        box-sizing: border-box;
      }
      .title {
        width: vmin(530);
        height: vmin(128);
        margin-bottom: vmin(32);
      }
      .check-winners{
        color: #fff;
        font-weight: 500;
        font-size: vmin(28);
        display: inline-flex;
        align-items: center;
        .inner {
          display: inline-flex;
          align-items: center;
          .right-arrow-icon {
            width: vmin(36);
            height: vmin(36);
          }
        }
      }
      .prize-card-box {
        display: flex;
        align-items: center;
        height: vmin(424);
        // 缩放以兼容不同机型（主要是iphone5/6/7/8/plus）
        @media only screen and (min-width: 376px) and (max-width : 414px) and (max-height : 736px) {
          zoom: 0.75;
        }
        @media only screen and (min-width: 321px) and (max-width: 375px) and (max-height: 667px) {
          zoom: 0.7;
        }
        @media only screen and (max-width: 320px) and (max-height: 568px) {
          zoom: 0.65;
        }
      }
      .join {
        display: flex;
        align-items: center;
        flex-direction: column;
        padding-bottom: vmin(20);
        .prompt {
          margin-bottom: vmin(20);
          height: vmin(32);
          color: #fff;
          font-size: 24rpx;
        }
        .join-btn {
          box-sizing: border-box;
          width: vmin(480);
          height: vmin(80);
          border: none;
          background: #ffeb66;
          box-shadow: 0 6px 8px 0 rgba(233, 27, 22, 0.3);
          color: #ff3c38;
          font-weight: 500;
          font-size: vmin(32);
        }
      }
    }
}  

.vertical-screen {
  @include vertical-screen;
}
// 竖屏pad
@media screen and (min-width: 768px) and (orientation: portrait) {
  $deviceWidth: 1536 !global;

  .vertical-screen {
      @include vertical-screen;
  }
}
// PC 放大适配
@media screen and (min-height: 630px) and (orientation: landscape) {
  $deviceWidth: 1260 !global;

  .vertical-screen {
    @include vertical-screen;
  }
}
// 横屏pad
@media screen and (min-height: 768px) and (orientation: landscape) {
  $deviceWidth: 1536 !global;

  .vertical-screen {
      @include vertical-screen;
  }
}