/* CSS Document */

.news{width: 100%;height: auto;}
.news ul{display: flex; /* 使用流动布局 */
    justify-content: center; /* 水平居中 */
    align-items: center; /* 垂直居中，如果需要 */

  list-style-type: none;
  padding: 0;
  margin: 0 auto;;

  flex-wrap: wrap; /* 允许换行 */ }
.news ul li{ flex: 0 0 33.333%; /* 每行显示三个 */
  box-sizing: border-box;
  padding: 10px;}
.news li img{width: 100%;
	height: auto;
  flex: 1; /* 每个li标签占据等分的空间 */
  text-align: center; /* 文本居中 */
  padding: 10px; /* 设置li的内边距 */
  
  box-sizing: border-box; /* 防止边框导致的宽度计算错误 */}
@media (max-width: 600px) {
.news {
    flex: 0 0 100%; /* li标签分散对齐 */
  }
}



.news .xiaozi{width:100%;float:left;color:#0066a1; font-family:"微软雅黑"; font-size:16px; font-weight:bold;  background:url(../images/jh_xiaotu.jpg) no-repeat left center; padding-left:15px;}
.news .xiaozi span{ float:right;color:#006650;margin-right: 3%; font-family:"微软雅黑"; font-size:12px; font-weight:bold; }
.works{ width:33.3%; height:285px; float:left;  }
.works p{ width:39px; height:285px; float:left; color:#333333; font-family:"微软雅黑"; text-align:center; font-size:12px;}
.works p img{ width:39px; height:40px; overflow:hidden;}
.works p span{ font-size:22px;}
.con{ width:277px; height:285px; float:left; line-height:18px; color:#999999;}
.con h2{ font-size:14px; font-family:"微软雅黑"; margin-top:10px; color:#333; border-bottom:1px solid #cfc8c8; padding-bottom:5px;}

.con h3 { width:277px; font-size:10px;font-family:"微软雅黑"; color:#666;border-bottom:1px solid #cfc8c8; margin-bottom:3px; padding:5px 0px 7px; }
.con h3 .s1{ display:inline-block; height:14px; width:28%; background:url(../images/bg092.jpg) 0px center no-repeat; padding-left:15px;}
.con h3 .s2{display:inline-block; height:14px; width:28%; background:url(../images/bg102.jpg)  0px center no-repeat; padding-left:15px;}
.con h3 .s3{display:inline-block; height:14px; width:26%; background:url(../images/bg112.jpg)  0px center no-repeat; padding-left:15px;}
.con h4 a{ width:277px; display:inline-block; text-align:right; color:#333; font-family:"微软雅黑"; margin-top:10px;}
.con h4 a:hover{ color:#ce0001;}
@media screen and (max-width: 768px) {
  .news ul li {
    width: 100%; /* 移动端一列显示 */
    float: none; /* 取消浮动 */
  }
}
.product{ width:100%; height: auto; margin:0 auto;}
.product .xiaopin{ width:100%;;float:left;color:#0066a1; font-family:"微软雅黑"; font-size:16px; font-weight:bold;  background:url(../images/jh_xiaotu.jpg) no-repeat left center; padding-left:15px;}
.product .xiaopin span{ float:right;color:#006650; font-family:"微软雅黑"; font-size:12px; font-weight:bold;margin-right: 3%; }
.product img{width: 478px;height: 213px;overflow: hidden;}
.art{width:100%; height:316px; margin:auto;position:relative; z-index:1;}
.art .hd .next{ position:absolute;left:0px; top:106px;z-index:2}
.art .hd .prev{ position:absolute; left:971px; top:106px;z-index:2}
.art .bd{height:294px; margin-left:45px; overflow:hidden;}
.art .bd ul{height:294px;}
.art .bd ul li{width:22.7%;height:267px; margin-right:20px;float:left; border:1px solid #cccccc;}
.art .bd ul li img{ width:192px; height:125px; overflow:hidden; margin:9px;}
.art .bd ul li h2{ margin-left:13px; color:13px; color:#333; font-family:"微软雅黑"; font-size:14px; line-height:20px;}
.art .bd ul li span{ width:190px; height:auto; display:inline-block; margin-left:13px; margin-top:5px;line-height:18px; color:#999;}
.more1{ width:192px; display:inline-block; text-align:right; color:#333; font-family:"微软雅黑"; margin-top:5px;}


 
/* 仅在视口宽度小于600px时应用 */
@media (max-width: 600px) {
.hezi {
    justify-content: space-around; /* li标签分散对齐 */
  }
}
.nhh {
	display: flex; /* 使用流动布局 */
    justify-content:center;
	
   width: 100%;
	 list-style-type: none;
 height: auto;
  flex-wrap: wrap; /* 允许换行 */
	
}
 
.nhhl{
	
flex: 0 0 auto; /* 不伸缩，固定宽度 */
  width: 35%; /* 或者其他你需要的固定宽度 */
 
		}
.nhhl img{  width: 100%; /* 使图片宽度等于父容器宽度 */
  height: auto; /* 保持图片纵横比 */
 max-width: 100%; /* 确保图片不会超过其容器 */
    max-height: 100%}
.nhhr{
	margin-right: 1em;

	width: 60%;

	}
.nhhr ul{
	  flex: 1 1 auto; /* 可伸缩，占据剩余空间 */
  margin: 0; /* 列表无内边距 */
  padding: 0 0.1rem; /* 列表内部有一些填充 */
  list-style: none;
	}
.nhhr ul li{height: 65px;
	display: flex;
	align-items:center;
	justify-content:flex-end;
	 border-bottom: 1px dashed #ccc; 
	flex: 1;

	}
		.nhhr .morem{
			line-height: 52px;
margin-bottom: 1em;
			background-color:#003271;

	}
.nhhr .morem span{
	margin-left: 2em;
			color: #fff;
	

	}
	.nhhr .morem a{
			color: #fff;
		float: right;
		margin-right: 2em;

	}
.nhhr .morem a:hover{
			color:#E4DEDE;
		

	}
.nhhr ul li span{
	margin-left: auto;

	}
.hezi {
	display: flex; /* 使用流动布局 */
    justify-content:center;
	flex: 1;
   width: 100%;
	 list-style-type: none;
 height: auto;
  flex-wrap: wrap; /* 允许换行 */
	
}
.hezi li {width: 33%;
	height: auto;
  
  text-align: center; /* 文本居中 */
  padding: 1em; /* 设置li的内边距 */
  
}
.hezi li a{
	width: 100%;
	margin-bottom: 1em;
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);
    transition: box-shadow 0.3s ease;
}
.hezi li img{
	width: 100%;
	
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);
    transition: box-shadow 0.3s ease;
}
.hezi li img:hover{
	 box-shadow: 0px 6px 8px rgba(0, 0, 0, 0.8);
}
@media (max-width: 600px) {
  .nhh{
    flex-direction: column; /* 在小屏幕上改为纵向排列 */
  }
}
@media (max-width: 600px) {
  .nhhl{
    width: 100%;
	  height: auto;
  }
}@media (max-width: 600px) {
  .nhhr{
    width: 100%;
	  height: auto;
  }
}
/* 仅在视口宽度小于600px时应用 */
@media (max-width: 600px) {
.hezi {
    justify-content: space-around; /* li标签分散对齐 */
	flex-wrap: wrap; /* 允许换行 */
  }
}
@media (max-width: 600px) {
.hezi li {
    justify-content: space-around; /* li标签分散对齐 */
	flex-wrap: wrap; /* 允许换行 */
	width: 100%;
  }
}
.xwzx{display: flex;align-items: center;justify-content: center;margin-bottom: 1em;font-size: 2em;}
.cpzx{display: flex;align-items: center;justify-content: center;margin-top: 1em;}

.cpzxm{display: flex;align-items: center;justify-content: center; margin-bottom: 2em;}
.didi{
	width: 100%;
	height: auto;
	background-color: #A5A5A5;
	padding-top: 1em;
	padding-bottom: 2em;
	
}
.dilian {
	
   width: 100%;
	text-align: center;
	 list-style-type: none;
  margin-top: 1em;
	
}
.dilian li {
	display: inline;
  text-align: center; /* 文本居中 */
  padding: 1em; /* 设置li的内边距 */
  
}
.dilian li a:hover{color: red;}
.copyr {margin-top: 1em;
	clear: both;
   width: 100%;
	text-align: center;
	
 height: auto;
  
	
}
.erm{
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 1em;
}
.erm ul{
	
	justify-content: center;
	align-items: center;
	width: 80%;
	display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch; /* 移动端滚动更流畅 */
  list-style-type: none;
  padding: 0;
	margin: 0;
	
}
.erm ul li{
	b
	 flex: 0 1 auto; /* 根据内容自动伸缩 */
	margin-right: 1em;
	text-align: center;
   /* 图片之间的间隔 */
  /* 可以添加更多样式，比如边框、阴影等 */
}
.erm ul li:last-child {
  margin-right: 0; /* 最后一个图片不需要间隔 */
}
.erm ul li img{
	 max-width: 100%; /* 图片不超过容器宽度 */
  width: 100%;/* 图片宽度自适应 */
  height: auto; /* 图片高度按比例缩放 */
	
}

@media (max-width: 600px) {
	.erm ul {
display: flex; /* 使用流动布局 */
    justify-content: center; /* 水平居中 */
    align-items: center; /* 垂直居中，如果需要 */
width:100%;
  list-style-type: none;
  padding: 0;
  margin: 0;

  flex-wrap: wrap; /* 允许换行 */ 
  }
}
@media (max-width: 600px) {
.erm ul li {
	margin-right: 0.3em;
	width:30%; /* 每行显示三个 */
  flex-wrap: wrap; /* 允许换行 */
  }
}