nuxtProject/assets/scss/cus-client/cus-client-page.scss

@import "../base/utils";
@import "cus-client-common";

@mixin setClientPage() {
  /********  describe: 网站首页  author: TX  date:2026-01-04  ********/
  .client-index-page{
     width: 100%;
    /* 网站banner */
    .client-index-banner{
      width: 100%;height: 520px;background-color:#fff;background-position: center;background-repeat: no-repeat;
    }
    /* banner-box */
    .client-banner-box{
        .el-carousel__container{height: 520px;cursor: pointer;}
        .el-carousel__item{
          .index-carousel-box{width:100%;height: 520px;display: block;background-position: center;background-repeat: no-repeat;background-color: #fff;}
        }
    }

    // img list
    .products-services-box img{width: 620px}

    /* 合作客户 */
    .client-customer-box{
      .customer-img-box{
        padding-bottom: 80px;
        li{width: 30%;margin: 32px 5% 0 0;display: inline-block;}
        li:nth-child(3n){margin-right: 0}
        img{transition: all 0.5s;width: 100%;}
        li:hover{
          img{transform: scale(1.04);box-shadow: 0 4px 8px 0 rgba(214, 214, 214, 0.76);border-radius: 6px}
        }
      }
    }

    /* 合作伙伴 */
    .hzhb-ul-box{
      display: flex;flex-wrap: wrap;justify-content: center;gap: 36px;margin-top: 36px;
      li{display: inline-block;font-size: 14px;padding: 4px 20px;color: #84888b;
        border: 1px solid #eee;border-radius: 20px;margin-right: 56px}
    }

    /* 新闻资讯 */
    .client-news-information {
      background: #f9fdfc;padding-bottom: 80px;
      .industry-information-box {
        margin-top: 48px;
        h4{color: #333;}
        h4:hover {cursor: pointer;color: #328971;}
        // 左
        .industry-information-left {
          width: 480px;margin-right: 80px;display: inline-block;vertical-align: top;color: #333;
          div {float: left;border-right: 1px solid #dbdbea;padding: 8px 16px 8px 0;}
          img {width: 480px;margin-bottom: 10px;height: 237px;}
          h4 {@include setFontStyle(-2);margin-bottom: 16px;line-height: 1.6;@include single-line-ellipsis;}
          p {@include setFontStyle(-6);height: 68px;line-height: 22px;padding: 2px 0 0 16px;text-align: justify;@include multi-line-ellipsis(3);}
          b {@include setFontStyle(-4);font-weight: normal;display: block;margin-bottom: 16px;}
          span {@include setFontStyle(-6);display: block;color: #666;}
        }

        // 右
        .industry-information-right {
          width: 630px;
          display: inline-block;
          vertical-align: top;

          li {border-bottom: 1px solid #ccc;margin-bottom: 16px;}
          li:last-child {border: 0;}
          h4 {@include setFontStyle(-4);@include single-line-ellipsis;margin-bottom: 12px;}
          p {@include setFontStyle(-6);color: #666;margin-bottom: 16px;line-height: 1;
            display: flex;align-items: center;@include single-line-ellipsis;}
          span {margin: 0 30px 0 10px;}
          .content-text{
            margin: 0;display: contents;
            p{margin: 0;padding: 0;display: inline-block;}
          }
        }
      }
    }

 }

  /********  describe: 产品与服务  author: TX  date:2026-01-04  ********/
  .client-cpyfw-page{
    // 功能强大的家政管理系统
    .jzgl-box{
      width: 100%;height: 360px;background-position: center;background-size: cover;background-repeat: no-repeat;
      padding: 46px 0 36px;
      .jzgl-box-text{
        width: 1000px;margin: 0 auto;
        color: #333;font-size: 20px;line-height: 2;text-align: center;margin-top: 46px;
      }
    }

    // img list
    .cpyfw-products-services{
      img{width: 580px}
      .products-services-content h5{margin-bottom: 36px;}
      }

    // 家政人员
    .cpyfw-jzry-box{
      width: 100%;height: 560px;background-position: center;background-size: cover;background-repeat: no-repeat;
      .jzry-content-box{position: relative;box-sizing: border-box;padding-top: 260px;}
      .jzry-card{
        width: 332px;box-sizing: border-box;
        position: absolute;display: flex;align-items: center;background: #fff;border-radius: 12px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.05);padding: 12px 16px;
        img{width: 60px;margin-right: 16px;}
        .card-title{font-size: 18px;margin-bottom: 6px;font-weight: bolder;}
        .card-desc{font-size: 16px;}
      }
      .jzry-card:nth-child(1){left: 0}
      .jzry-card:nth-child(2){top: 120px;left: 50%;transform: translateX(-50%);}
      .jzry-card:nth-child(3){right: 0}
      .jzry-img{width: 300px;margin: 0 auto;display: block;}
    }
  }

  /********  describe: 新闻中心  author: TX  date:2026-01-05  ********/
  .client-newsInfor-page{

    // 页面主要内容区域
    .newsInfor-content-box{
      min-height: 304px;
      padding: 48px 0 80px;
      ul{display: inline-block;vertical-align: top}

      // 右侧内容区域
      .newsInfor-content-ul{
        li{margin-bottom: 32px;cursor: pointer;border-bottom: 1px solid #f5f5f5;padding-bottom: 32px}
        li:last-child{margin-bottom: 0;}
        //图片
        .newsInfor-img-box{width:318px;height:178px;display: inline-block;margin-right: 32px;border-radius: 4px;overflow: hidden;vertical-align: top;background-repeat: no-repeat;background-size: cover;background-position: center;}
        //内容区域
        .newsInfor-list-content{
          width: calc(100% - 350px);
          display: inline-block;
          vertical-align: top;

          h5{@include setFontStyle(-2);color: rgba(0,0,0,0.85);margin-bottom: 12px;@include single-line-ellipsis;color: #25ac83;}
          div{
            margin-bottom: 8px;
            i{
              width: 14px;height: 14px;display: inline-block;margin-right: 8px;background-size: cover;
              vertical-align: middle;background-image: url("~static/images/website/common/data-icon.svg");}
            span{@include setFontStyle(-6);display:inline-block;color: #666;margin-right: 60px;vertical-align: middle;}
          }
          p{height: 72px;@include setFontStyle(-6);color: rgba(0,0,0,0.65);line-height: 1.8;margin-bottom: 32px;text-align: justify;@include multi-line-ellipsis(3);overflow: hidden;}
          a{@include setFontStyle(-6);color: #25ac83;}
          a:after{content: "";width: 14px;height: 12px;display:inline-block;background-image: url("~static/images/website/common/jt-icon.svg");margin-left: 8px;}
          a:hover{cursor: pointer;}
        }
      }
    }
  }

  /********  describe: 关于我们  author: TX  date:2026-01-05  ********/
  .client-gywm-page{
    .wywm-cpty-box{justify-content: space-evenly;}
    // 功能强大的家政管理系统
    .lxwm-box{
      width: 100%;height: 550px;background-position: center;background-size: cover;background-repeat: no-repeat;
      padding: 0 0 36px;
      .lxwm-box-text{
        color: #333;font-size: 20px;line-height: 1.8;margin-top: 24px;
      }
    }
  }

}