/* your styles go here */

.logos .img1 {
  background-image: url(../png/tai.png);
}
.logos .img2 {
  /* margin: 0 10px 10px; */
  background-image: url(../png/logochangan.png);
}
.logos .img3 {
  background-image: url(../png/sunlogo.png);
}
.logos .img4 {
  background-image: url(../png/dinghe.png);
}
.logos .img5 {
  background-image: url(../png/people.png);
}
.logos .img6 {
  background-image: url(../png/dadi.png);
}
.logos .img7 {
  background-image: url(../png/guohua.png);
}
.logos .img8 {
  background-image: url(../png/pingan.png);
}
.logos .img9 {
  background-image: url(../png/taikang.png);
}
.logos .img10 {
  background-image: url(../png/taiping.png);
}
.logos .img11 {
  background-image: url(../png/zhongguorenshou.png);
}
.logos .img15 {
  background-image: url(../png/newzhbx.png);
}
.logos .img13 {
  background-image: url(../png/zijin.png);
}
.logos .img14 {
  background-image: url(../png/guoren.png);
}

.logos a {
  margin: 0 10px 10px;
}

.partnerlogo {
  width: 160px;
  height: 63px;
  background-position: 50% 50%;
  background-size: 100%;
  background-repeat: no-repeat;
  /* margin-right: 10px; */
  background-color: #fff;
  border: 1px solid black;
  transition: transform 0.3s ease;
}

.partnerlogo:hover {
  transform: scale(1.1); /* 鼠标悬停时放大至原来的110% */
}

.logos {
  margin: 15px 5%;
  display: flex;
  justify-content: center;
  flex-flow: wrap;
}

.img-box {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.5);
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 999;
}

.img-box .img-box-con {
  overflow: hidden;
  width: 90%;
  height: 80%;
  background: #fff;
}

.cooperat-ul {
  list-style: none; /* 移除列表项的默认样式 */
  padding: 0; /* 移除内边距 */
  margin: 0; /* 移除外边距 */
  white-space: nowrap; /* 防止列表项内的文本换行 */
  overflow-x: auto; /* 当内容溢出时，提供水平滚动条 */
}

.cooperat-ul li {
  display: inline-block; /* 使列表项在一行内显示 */
  margin-right: 10px; /* 列表项之间的间距 */
  vertical-align: top; /* 垂直对齐 */
}

.box-show img {
  width: 320px;/* 图片宽度，根据需要调整 */
  height: auto; /* 图片高度自适应 */
}

.text-about{
  font-size: 1rem;
}

.title-box{
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #eee;
  color: #262626;
  font-size: 18px;
  padding: 16px;
}

.img-box .img-box-con {
  overflow: hidden;
  width: 90%;
  height: 80%;
  background: #fff;
}

#cooperatChildBox {
  list-style: none; /* 移除列表项的默认样式 */
  padding: 0 58px; 
  margin: 35px 0 16px 0; 
  display: flex; /* 设置为弹性容器 */
  flex-wrap: wrap; /* 允许子元素换行 */
  justify-content: flex-start; /* 可选，根据需要设置子元素之间的间距 */
  height: calc(100% - 150px);
}

#cooperatChildBox .show-more-child {
  margin-bottom: 10px; /* 给每个列表项设置底部边距 */
  width: calc(25% - 10px); /* 可以添加宽度属性，例如：width: calc(33.333% - 10px); 来控制每行显示的图片数量和间距 */
}

.box-show img {
  width: 80%; /* 根据需要设置图片宽度，这里设置为充满其父容器 */
  height: auto; /* 保持图片的宽高比 */
  display: block; /* 移除图片的默认间距 */
  margin: 10px 0px 20px 10px;
  z-index: 9999;
  transition: transform 0.3s ease; /* 平滑过渡效果 */
  box-sizing: border-box; /* 确保宽度和高度包括边框和内边距 */
}

.box-show:hover img {
  transform: scale(1.05); /* 鼠标悬停时放大至原来的105% */
}

/* 初始状态：图片大小为原大小 */
.img-about-1 {
  transition: transform 1s ease-out; /* 平滑过渡效果 */
  transform-origin: center center; /* 缩放中心点 */
  opacity: 0.5; /* 初始透明度 */
  transform: scale(0.5); /* 初始缩放比例 */
}

/* 图片进入视口时的动画状态 */
.img-about-1.animate {
  opacity: 1; /* 透明度变为完全不透明 */
  transform: scale(1); /* 放大到原始大小 */
}