tips-prize-comp.scss 2.33 KB
@import '../../assets/scss/mixins';
@import '../../assets/scss/utils';

.comp-item {
  position: relative;
  width: 654px;
  height: 732px;

  font-weight: 300;

  // background-color: wheat;
  .bg {
    position: absolute;
    width: 654px;
    height: 732px;
  }

  .cont {
    position: relative;
    text-align: center;
    color: #333333;

    .space1 {
      height: 80px;
    }

    .tit {
      color: #ba3038;
      font-size: 36px;
    }

    .name {
      margin-top: 8px;
      font-size: 28px;
      color: #333333;
    }

    .stock {
      text-align: center;
      margin-top: 24px;
    }

    // 有库存
    .stock1 {
      margin: 22px auto 0;
      font-size: 24px;
      width: 410px;
      .tips {
        color: #333333;
      }

      .tips2 {
        color: #999999;
        margin-top: 16px;
      }
    }

    // 无库存
    .stock2 {
      .tips {
        height: auto;
        color: #999999;
        font-size: 24px;
      }
    }

  }


  .btn-wrap {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100px;
    display: flex;
    justify-content: center;
    padding: 0 50px;
    @extend .bb;

    .btn {
      margin: 0 auto;
      @include cb(234px, 64px);
    }

    .btn2 {
      border: solid 1px #b83138;
      background: transparent;
      color: #ba3039;
    }
  }
}

// 心愿
.wish {
  position: relative;
  margin: 0 auto 0;
  display: flex;
  // justify-content: space-between;
  justify-content: center;
  @extend .bb;
  // padding-top: 116px;
  padding: 40px 80px 0;

  &-item {
    position: relative;
    text-align: center;

    .display {
      position: relative;
      height: 180px;
      height: 180px;
      border-radius: 90px;
      background-image: radial-gradient(circle at 0 0, #ffffff, #f2e6e6);
      @extend .fcc;

      .prod {
        max-width: 200px;
        max-height: 200px;
        // margin-bottom: 10px;
      }

      .close {
        width: 30px;
        height: 30px;
        position: absolute;
        bottom: 0;
        right: 0;
      }
    }

    .name {
      width: 160px;
      margin: 8px auto 0;
      color: #333333;
      font-size: 20px;
      // font-weight: 300;
    }

    .val {
      @extend .fcc;
      color: #b93138;
      font-size: 20px;
      margin-top: 12px;

      .icon {
        margin-left: 6px;
        width: 11px;
        height: 18px;
      }
    }
  }
}