@charset "utf-8";
body {
  max-width: 100%;
  display: grid;
  align-items: center;
  /*justify-content:center;*/
  /*margin:0 auto;*/
  /*height:100vh;*/
  background-color: #FFFFFF;
}
.header {
  max-width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 5%;
  background-color: #fff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  position: sticky;
  top: 0;
  z-index: 100;
}
.General-Hyperlink {
  color: #2394D2;
  text-decoration: none;
}
/* 左侧Logo和公司名称 */
.logo-container {
  display: flex;
  align-items: center;
  gap: 15px;
}
.logo-img {
  height: 80px;
  width: auto;
}
.company-name {
  font-size: 1.5rem;
  font-weight: bold;
  color: #333;
  padding-left: 5vw;
}
/* 右侧语言选择 */
.language-selector {
  position: relative;
  display: inline-block;
  margin-right: 10%;
}
.language-btn {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 1rem;
  color: #555;
  display: flex;
  align-items: flex-end;
  gap: 5px;
}
.language-dropdown {
  display: none;
  position: absolute;
  right: 0;
  background-color: #fff;
  min-width: 120px;
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  z-index: 1;
}
.language-dropdown a {
  color: #333;
  padding: 10px 15px;
  text-decoration: none;
  display: block;
  text-align: left;
  border-bottom: 1px solid #f1f1f1;
}
.language-dropdown a:hover {
  background-color: #f8f8f8;
}
.language-selector:hover .language-dropdown {
  display: block;
}
.nav-container {
  max-width: 100%;
  display: flex;
  justify-content: center;
  background-color: #f8f9fa;
  padding: 15px 0px;
  font-family: Arial, sans-serif;
}
.nav-button {
  flex: 1;
  text-align: center;
  padding: 12px 0px;
  color: #333;
  text-decoration: none;
  font-size: 16px;
  transition: all 0.3s ease;
  border-right: #ddd 1px solid; /*nav 中的分割线*/
}
.nav-button:last-child {
  border-right: none;
}
.nav-button:hover {
  font-weight: bold;
  background-color: #e9ecef;
}
.buttom-container {
  display: flex;
  justify-content: space-around;
  background-color: #304C8E;
  padding: 30px 15px 50px 15px;
  font-family: Arial, sans-serif;
  bottom: 0;
}
.buttom2-container {
  flex: 1;
  display: grid;
  justify-content: Flex-start;
  padding: 15px 30px;
  font-family: Arial, sans-serif;
  border-right: #ddd 1px solid; /*nav 中的分割线*/
  transition: all 0.3s ease;
}
.buttom2-container h3 {
  margin-bottom: 10px;
  color: #EDEDED;
  font-size: 20px;
}
.buttom2-container a {
  display: block;
  color: #B0B0B0;
  margin-bottom: 10px;
}
.buttom2-container:last-child {
  border-right: none;
}
/*index中的slier部分*/
.slider-container {
  position: relative;
  width: 100%;
  max-width: 100%;
  overflow:hidden;
}
.slider {
  display:flex;
  width: 300%; /* 3张图片，每张100% */
  transition: transform 0.5s ease;
  height: 300px;
	padding:5vh 0;
}
.sliderImgContainer{
	  width: 100%; /* 使用视口宽度 */
	display:flex;
	align-content: center;
	justify-content: center;

}
.sliderImg {
  height:100%;
	width:auto;
  max-width: 50%; /* 确保不超过容器 */
	 object-fit: contain;
	display:block;
}

.prev { left: 25%; 
	  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.5);
  color: white;
  border: none;
  padding: 10px 15px;
  cursor: pointer;}
.next { right: 25%; 
	  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.5);
  color: white;
  border: none;
  padding: 10px 15px;
  cursor: pointer;}
/*about.html Design*/
	.map {
		padding:30px 30px 80px 30px;
		display:flex;
	}
	.map img{
		width:100%;
		max-width: 1000px;
		height:auto;
	}

	
.about {
	padding:30px 20% 80px 20%;
	width:100%;
	max-width:100%;
	display:grid;
}

.about p {
		font-size: 18px;
	}
@media ( max-width : 600px ){
    .about {
       padding:30px 5% 80px 5%;
    }
}


.contact {
    padding: 30px 30px 80px 30px;
	width:100%;
    height:650px;
    overflow: hidden; /* 防止图片溢出 */
}

.ProductContainer {
  display: flex;
  flex-direction: column;
}
.ProductBanner {
  Position:relative;
  width: 100%;
  height: 200px;
  border: 1px solid #ccc;
  overflow: hidden;
}
        .BannerBackground {
            position: absolute;
            width: 100%;
            height: 100%;
            object-fit: fill;
        }
        
        .BannerProduct {
            position: absolute;
            max-width: 100%;  /* 两边各5px，共10px */
            max-height: 100%; /* 上下各5px，共10px */
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            object-fit: contain;
}

        .BannerDescription {
            position: absolute;
            max-width: 100%;  /* 两边各5px，共10px */
            max-height: 100%; /* 上下各5px，共10px */
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
}

.Bannertext{
	color:#000000;
	text-align:center;
	  font-weight:normal;
	margin-top:0.5vh;
	Font-size:16px;
	
}

.ProductLowerContainer {
  display: flex;
  width: 100%;
}
.ProductList {
  Display: inline-Flex;
  flex-direction: column;
  width: 30%;
  background: #f0f0f0;
  border: 1px solid #ccc;
  padding: 3%;
}

.ProductListLink{
  margin-top: 15px;
  margin-bottom: 15px;
  font-size:20px;
  color: #000000;
  text-decoration: none;	
}
.ProductList p {
  text-indent: 2em;
  font-size: 20px;
  color: #4D4D4D;
  text-decoration: none;
}
.ProductMain {
  Display: Flex;
  flex-wrap: wrap; /* 允许换行 */
  justify-content: center;
  align-items: flex-start;
  width: 70%;
  height: auto;
  padding: 30px 15px;
  background: #f0f0f0;
  border: 1px solid #ccc;
}
.item {
  width: 250px;
  height: 250px;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
  margin-left: 10px; /* 水平间距 */
  margin-right: 10px; /* 水平间距 */
  margin-bottom: 20px; /* 垂直间距 */
}
.img-container {
  height: 200px; /* 固定高度 */
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center; /* 垂直居中 */
  background: #f5f5f5; /* 可选：背景色 */
  overflow: hidden; /* 隐藏溢出部分 */
  padding: 10%;
}
.ProductImagelink {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.product_img {
  max-height: 100%;
  max-width: 100%;
  object-fit: contain; /* 保持比例，完整显示图片 */
}
.product_name {
  padding: 10px;
  text-align: center;
  font-size: 16 px;
  color: #333;
  margin-top: 2px;
  font-weight: bold;
}

.PoliceRegistration{
  max-width: 100%;
  display: flex;
  justify-content: flex-end;
  padding: 0 5%;
  background-color:#FFFFFF;
}
.PoliceImg{
	        text-align: center; /* 文字居中 */
            margin: 10px;
}
.PoliceImg IMG{
            max-width: 100%; /* 图片宽度不超过容器 */
            height: auto; /* 保持宽高比 */
}
.PoliceCaption {
            font-size: 10px;
            color:#000000;
        }

@media (max-width : 600px) {
  .item {
    width: 100px;
    height: 120px;
    margin-left: 3px; /* 水平间距 */
    margin-right: 3px; /* 水平间距 */
    margin-bottom: 5px; /* 垂直间距 */
  }
  .product_name {
    font-size: 9px;
	padding: 3px;
  }
.ProductListLink{
  font-size:10px;
}
	.ProductList p{
		  text-indent: 0.5em;
  font-size:8px;
}
}
@media (max-width : 600px) {
  .nav-container {
    flex-direction: column;
  }
  .nav-button {
    border-right: none;
    border-bottom: 1px solid #ddd;
  }
  .nav-button:last-child {
    border-bottom: none;
  }
  .company-name {
    display: none;
  }
}
@media (max-width : 930px) {
  .buttom-container {
    display: none;
  }
	.PoliceRegistration{
		display:none;
	}
}
/* CSS Document */