@charset "UTF-8";
.center-3 .article-wrap {
  width: 80%;
  margin-top: 65px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.center-3 .article-wrap .article-ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 50px;
}

.center-3 .article-wrap .article-ul .article-li {
  width: calc(33.3% - 55px);
  -webkit-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  /* 平滑的过渡动画 */
  -webkit-transform-origin: center;
          transform-origin: center;
  /* 设置变换原点为中心 */
  position: relative;
  /* 为z-index做准备 */
  z-index: 1;
  /* 默认层级 */
  background: #ffffff;
  -webkit-box-shadow: 0px 0px 12px 1px rgba(0, 0, 0, 0.16);
          box-shadow: 0px 0px 12px 1px rgba(0, 0, 0, 0.16);
  border-radius: 16px 16px 16px 16px;
  overflow: hidden;
}

.center-3 .article-wrap .article-ul .article-li .li_img_wrap {
  width: 100%;
  height: 55%;
  overflow: hidden;
}

.center-3 .article-wrap .article-ul .article-li .li_img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  -webkit-transition: all 0.6s ease;
  transition: all 0.6s ease;
  /* 图片单独的过渡 */
}

.center-3 .article-wrap .article-ul .article-li .li_time {
  margin-top: 25px;
  margin-left: 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  /* 时间区域的过渡 */
}

.center-3 .article-wrap .article-ul .article-li .li_time .time-icon {
  width: 14px;
  height: 14px;
}

.center-3 .article-wrap .article-ul .article-li .li_time .time-font {
  font-weight: 400;
  font-size: 14px;
  color: #ee4e41;
  margin-left: 15px;
}

.center-3 .article-wrap .article-ul .article-li .li_title {
  font-weight: bold;
  font-size: 20px;
  color: #3a485a;
  margin-top: 10px;
  margin-left: 15px;
  margin-right: 15px;
  line-height: 30px;
  display: -webkit-box;
  word-break: break-all;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  /* 标题的过渡 */
}

.center-3 .article-wrap .article-ul .article-li .li_detail {
  margin: 30px 15px 30px 0;
}

.center-3 .article-wrap .article-ul .article-li .li_detail a {
  font-weight: 400;
  font-size: 14px;
  color: #ee4e41;
  float: right;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  /* 详情链接的过渡 */
}

.center-3 .article-wrap .article-ul .article-li .li_detail a:hover {
  cursor: pointer;
}

.center-3 .article-wrap .article-ul .article-li a:hover {
  cursor: pointer;
}

.center-3 .article-wrap .article-ul .article-li:hover {
  z-index: 10;
  /* 悬停时提高层级 */
}

.center-3 .article-wrap .article-ul .article-li:hover .li_img {
  -webkit-transform: scale(1.09);
          transform: scale(1.09);
  /* 图片轻微放大 */
}

.center-3 .article-wrap .more {
  width: 96px;
  height: 32px;
  background: #ffffff;
  border-radius: 4px 4px 4px 4px;
  border: 1px solid #c3c7d5;
  font-size: 14px;
  color: #64728d;
  line-height: 32px;
  text-align: center;
  margin-top: 62px;
}

@media (max-width: 1000px) {
  .center-3 .article-wrap > .article-ul .article-li .li_title {
    font-size: 14px;
  }
}

@media (max-width: 768px) {
  .center-3 .article-wrap > .article-li {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 100%;
            flex: 1 1 100%;
  }
}

.center-6 {
  width: 100%;
  background: url("../image/home/change_bg.png") no-repeat 100%;
  background-size: cover;
  padding-top: 75px;
  padding-bottom: 100px;
}

.center-6 .center-6-title {
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.center-6 .center-6-title .center-6-title-1 {
  width: 40px;
  height: 0px;
  border: 1px solid #ffffff;
}

.center-6 .center-6-title .center-6-title-2 {
  font-weight: bold;
  font-size: 32px;
  color: #ffffff;
  margin-left: 40px;
  margin-right: 40px;
}

.center-6 .center-6-tip {
  font-weight: 400;
  font-size: 18px;
  color: #ffffff;
  text-align: center;
  margin-top: 10px;
}

.center-6 .center-6-ul {
  margin-top: 48px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0 10%;
  gap: 15px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.center-6 .center-6-ul .center-6-li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 30px 15px 30px 15px;
  width: calc(25%-15px);
  background: #ffffff;
  border-radius: 8px 8px 8px 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.center-6 .center-6-ul .center-6-li .li_img {
  width: 51px;
}

.center-6 .center-6-ul .center-6-li .li_title {
  font-weight: bold;
  font-size: 16px;
  color: #333333;
  margin-top: 20px;
}

.center-6 .center-6-ul .center-6-li .li_content {
  font-weight: 500;
  font-size: 14px;
  color: #555555;
  text-align: center;
  margin-top: 20px;
}

.center-7 {
  width: 100%;
  background: url("../image/home/center7-bg.png") no-repeat 100%;
  background-size: cover;
  padding-top: 75px;
  padding-bottom: 150px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.center-7 .center-7-title {
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.center-7 .center-7-title .center-7-title-1 {
  width: 40px;
  height: 0px;
  border: 1px solid #3a485a;
}

.center-7 .center-7-title .center-7-title-2 {
  font-weight: bold;
  font-size: 32px;
  color: #3a485a;
  margin-left: 40px;
  margin-right: 40px;
}

.center-7 .center-7-tip {
  font-weight: 400;
  font-size: 18px;
  color: #555555;
  text-align: center;
}

.center-7 .center-7-title2 {
  margin-top: 65px;
  font-weight: bold;
  font-size: 16px;
  color: #333333;
  text-align: center;
}

.center-7 .center-7-tip2 {
  margin-top: 8px;
  font-weight: 400;
  font-size: 18px;
  color: #555555;
  text-align: center;
}

.center-7 .center-7-img {
  margin-top: 122px;
  width: 356px;
  height: 352px;
  background: url("../image/home/center_img.png") no-repeat 100%;
  background-size: cover;
  position: relative;
}

.center-7 .center-7-img .img_content-title {
  font-weight: bold;
  font-size: 16px;
  color: #333333;
}

.center-7 .center-7-img .img_content-tip {
  margin-top: 8px;
  font-weight: 400;
  font-size: 18px;
  color: #555555;
}

.center-7 .center-7-img .img_content1 {
  text-align: center;
  position: absolute;
  top: -90px;
}

.center-7 .center-7-img .img_content2 {
  text-align: right;
  position: absolute;
  right: 376px;
  top: 115px;
  width: 300px;
}

.center-7 .center-7-img .img_content3 {
  text-align: left;
  position: absolute;
  left: 376px;
  top: 115px;
  width: 300px;
}

.center-7 .center-7-img .img_content4 {
  text-align: right;
  position: absolute;
  right: 346px;
  bottom: -30px;
  width: 300px;
}

.center-7 .center-7-img .img_content5 {
  text-align: left;
  position: absolute;
  left: 346px;
  bottom: -30px;
  width: 300px;
}

.center-8 {
  width: 100%;
  background: url("../image/home/center-8_bg.png") no-repeat 100%;
  background-size: cover;
  padding-top: 95px;
  padding-bottom: 130px;
  /* 兼容性处理 - 对于不支持aspect-ratio的浏览器 */
}

.center-8 .center-8-title {
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.center-8 .center-8-title .center-8-title-1 {
  width: 40px;
  height: 0px;
  border: 1px solid #ffffff;
}

.center-8 .center-8-title .center-8-title-2 {
  font-weight: bold;
  font-size: 32px;
  color: #ffffff;
  margin-left: 40px;
  margin-right: 40px;
}

.center-8 .center-8-tip {
  font-weight: 400;
  font-size: 18px;
  color: #ffffff;
  text-align: center;
}

.center-8 .center-8-ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0 10%;
  margin-top: 80px;
  gap: 40px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.center-8 .center-8-ul .center-8-li .li_top {
  width: 190px;
  height: 190px;
  background: #c70c1f;
  height: 190px;
  font-weight: 900;
  font-size: 54px;
  color: #ffffff;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 8px 8px 8px 8px;
}

.center-8 .center-8-ul .center-8-li .li_bottom {
  font-weight: 400;
  font-size: 16px;
  color: #ffffff;
  text-align: center;
  margin-top: 10px;
}

@media (max-width: 1000px) {
  .center-8 .center-8 {
    padding: 50px 30px;
  }
  .center-8 .center-8-ul {
    gap: clamp(8px, 1.5vw, 20px);
  }
  .center-8 .li_top {
    font-size: 10px;
  }
  .center-8 .li_bottom {
    font-size: 20px;
  }
}

@supports not (aspect-ratio: 1/1) {
  .center-8 .li_top {
    aspect-ratio: unset;
    height: 0;
    padding-bottom: 100%;
  }
}
/*# sourceMappingURL=index_test.css.map */