index.scss 2.22 KB
@import '@/styles/_support';

.content {
  padding-bottom: 2.25rem;
}

.top-space {
  height: 2.25rem;
}

.box {
  position: relative;
}

// banner 轮播
.banner {
  box-shadow: 0 0 1.75rem 0 rgba(255, 87, 0, 0.1);
}

// 推荐产品
.recommend {
  display: flex;
  justify-content: space-between;
  margin-top: 2.25rem;

  &-item {
    position: relative;
    width: 25.833333rem;
    border-radius: .75rem;
    box-shadow: 0 0 1.5rem 0 rgba(255, 87, 0, 0.15);
    background-color: #fbfbfb;

    .btn {
      position: absolute;
      // width: 13.5rem;
      // height: 4.1rem;
      // top: 30.2rem;
      width: 52%;
      height: 11%;
      top: 81%;
      left: 0;
      right: 0;
      margin: 0 auto;
      cursor: pointer;
    }

    img {
      width: 100%;
    }
  }
}

// 了解我们
.more {
  margin: 3.5rem auto 0;
  position: relative;

  .btn {
    position: absolute;
    width: 26%;
    height: 8%;
    top: 83%;
    left: 69%;
    z-index: 1;
  }

  .cont {
    position: relative;
    margin: 0 auto;
    // @extend .fcc;
    width: 85%;

    img {
      width: 100%;
    }
  }
}

// 新闻资讯
.news {
  margin: 4.25rem auto 0;

  .linear {
    width: 100%;
    height: 2.04rem;
    background-image: url('~@/assets/images/index/linear.png');
  }

  .tit {
    font-family: MicrosoftYaHei;
    text-align: center;
    color: #f05a23;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 1.8px;
  }

  .under-line {
    margin: .75rem auto 0;
    width: 4rem;
    height: .25rem;
    background-color: #275d40;
  }

  .news-wrap {
    margin: 3.2rem auto 0;
    max-width: 66.75rem;

    .more {
      text-align: right;
      margin-bottom: .5rem;
    }

    .news-item {
      height: 4.25rem;
      color: #4c4948;
      display: flex;
      justify-content: space-between;
      align-items: center;
      border-top: solid 1px #dcdddd;

      &-tit {
        cursor: pointer;
      }

      &-date {}

      &:last-child {
        border-bottom: solid 1px #dcdddd;
      }
    }
  }
}


.swiper-button-prev {
  background-image: url('~@/assets/images/common/button-prev.png');
}

.swiper-button-next {
  background-image: url('~@/assets/images/common/button-next.png');
}

@media (max-width: 950px) {
  .box {
    width: 96%;
  }
}