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

.productListPage {
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  position: absolute;
  overflow: hidden;
  background-color: rgb(255, 227, 216);

  .pageTitle {
    position: absolute;
    left: 270px;
    top: 45px;
    width: 210px;
    height: 49px;
    .webpBg("productListPage/title.png");
  }

  .backBtn {
    position: absolute;
    left: 47px;
    top: 53px;
    width: 16px;
    height: 31px;
    .webpBg("productListPage/back.png");
  }

  .listNone {
    position: absolute;
    top: 400px;
    left: 0;
    width: 100%;
    font-size: 32px;
    color: #d62928;
    text-align: center;
    font-weight: bold;
  }

  .list_bg {
    position: absolute;
    left: 19px;
    top: 124px;
    width: 713px;
    height: 1604px;
    .webpBg("productListPage/list_bg.png");
  }

  .products_list {
    width: 680px;
    // height: 696px;
    left: 50px;
    top: 130px;
    bottom: 0;
    position: absolute;
    overflow-y: auto;
    padding-top: 50px;
    padding-right: 27px;
    box-sizing: border-box;

    .product_item {
      width: 653px;
      height: 173px;
      position: relative;

      &:not(:last-child) {
        margin-bottom: 50px;
      }

      .product_name {
        width: 650px;
        height: 30px;
        left: 0px;
        top: 0px;
        position: absolute;
        font-size: 28px;
        line-height: 30px;
        color: rgba(1, 1, 1, 1);
        font-weight: bold;
      }

      .product_rate {
        width: 200px;
        height: 63px;
        left: 0px;
        top: 57px;
        position: absolute;

        .product_rate_label {
          width: 100%;
          height: 20px;
          left: 0px;
          top: 46px;
          position: absolute;
          opacity: 0.6;
          font-size: 20px;
          line-height: 20px;
          color: rgba(1, 1, 1, 1);
          .lineClamp1();
        }

        .product_rate_value {
          width: 100%;
          height: 32px;
          left: 2px;
          top: 0px;
          position: absolute;
          font-size: 32px;
          line-height: 32px;
          color: rgba(211, 26, 25, 1);
          font-weight: bold;
          .lineClamp1();
        }
      }

      .product_shu {
        width: 280px;
        height: 63px;
        left: 222px;
        top: 57px;
        position: absolute;

        .product_shu_label {
          width: 100%;
          height: 20px;
          left: 1px;
          top: 45px;
          position: absolute;
          opacity: 0.6;
          font-size: 20px;
          line-height: 20px;
          color: rgba(1, 1, 1, 1);
          .lineClamp1();
        }

        .product_shu_value {
          width: 100%;
          height: 30px;
          left: 0px;
          top: 0px;
          position: absolute;
          font-size: 28px;
          line-height: 30px;
          color: rgba(0, 0, 0, 1);
          font-weight: bold;
          .lineClamp1();
        }
      }

      .real_btn {
        width: 140px;
        height: 49px;
        left: 513px;
        top: 65px;
        position: absolute;
        .sparkBg("productListPage/real_btn.png");
      }

      .product_line {
        width: 652px;
        height: 2px;
        left: 1px;
        top: 171px;
        position: absolute;
        .sparkBg("productListPage/item_line.png");
      }
    }
  }
}
