body{background:#f5f5f5;}
.pad-lr{padding:0px 20%;}
.container{margin:auto;width:1200px;position:relative;}
header{height:60px;}
.banner{}
.banner img{width:100%;}
.clear{clear:both;}
._title{font-size:30px;font-weight:bold;text-align:center;padding-top:50px;}
._line{width:60px;height:3px;background:#e71021;text-align:center;margin:8px auto;}
.p50{padding-top:50px;}
.container .t1,.container .t2{text-align: center;padding:10px 20px;}
.container .t1{font-size:30px;padding-top:80px;font-weight:bold;}
.container .t2{font-size:12px;color:#666666;line-height:24px;margin:20px 0px;}
.tel_400{display:none;}


.container .logo{margin:10px 0px;float:left;}
.container .logo a img{height:25px;padding-left:10px;}
.container .tel2{float:right;display:flex;margin:10px 0px;}
.container .tel2 img{width:200px;}
.container .tel2 a{color:#e71021;font-size:30px;font-weight:bold;line-height:40px;}

.wap{display:none;}
.pc{display:block;}
.tab-content{display:none;}
.tab-content.act{display:block;}



.u_nav{margin:30px auto;
  display: flex;  /* 启用grid布局 */
  justify-content: center;  /* 水平居中 */
}
.tab-btn {
  display: inline-block;
  padding: 20px 50px;
  margin: 0 5px;
  border-radius: 10px; /* 圆角边框 */
  background-color: #F5f5f5;
  color: #333;
  cursor: pointer;
  border:1px solid #e1e1e1;
  transition: background-color 0.3s ease;
  font-size:18px;
}

/* 鼠标悬停效果 */
.tab-btn:hover {
  background-color: #e71021; /* 红色背景 */
  color: white;
}

/* 当前活动选项卡样式 */
.tab-btn.act {
  background-color: #e71021;
  color: white;
}

/* 居中显示 */
.tabs-container {
  text-align: center;
  margin: 20px 0;
}
.u_list.tab-content ul {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); /* 自动填充，每列至少300px */
  gap: 24px; /* 间距 */
  list-style: none;
  padding: 0;
  margin: 0;
}

/* 大屏幕：强制每行3列 */
@media (min-width: 1024px) {
  .u_list.tab-content ul {
    grid-template-columns: repeat(3, 1fr);
  }
}

.u_list.tab-content li {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  overflow: hidden;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.u_list.tab-content li:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

.u_list.tab-content .pad {
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 1.5rem;
}

.u_list.tab-content .imgs {
  margin-bottom: 1rem;
  overflow: hidden;
  aspect-ratio: 16/9; /* 固定图片区域比例 */
}

.u_list.tab-content .imgs img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.u_list.tab-content .imgs:hover img {
  transform: scale(1.05);
}

.u_list.tab-content h2 {
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 1rem;
  color: #1e293b;
  line-height: 1.3;
}

.u_list.tab-content .desc {
  flex-grow: 1; /* 自动填充剩余空间，确保底部对齐 */
}

.u_list.tab-content .desc p {
  margin-bottom: 0.5rem;
  color: #64748b;
  line-height: 1.6;
}

.u_list.tab-content .more {
  margin-top: auto; /* 固定在底部 */
}

.u_list li{width:100%;}
.u_list li .imgs img{transition: transform 0.3s ease;cursor: pointer;}
.u_list li .imgs img:hover {
  transform: scale(1.1); /* 鼠标悬停时放大10% */
}
.u_list li .pad{padding:20px;margin:0px 10px;background:white;}
.u_list li .pad h2{font-size:18px;text-align:center;margin:15px 0px;line-height:24px;}
.u_list li .pad p{font-size:12px;line-height:24px;color:#333;}

.u_list li .pad p::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  background-color: #333; /* 黑点颜色 */
  border-radius: 50%; /* 圆形 */
  margin-right: 0.5em;
  margin-bottom: 2px; /* 垂直对齐 */
  vertical-align: middle;
}
.u_list li .pad .more{width:100%;margin:10px 0px;}
.u_list li .pad .more a{display:block;color:white;background:#e71021;text-align:center;padding:20px 0px;font-size:18px;border-radius:10px;}

.u_yy ul li{width:33.33%;float:left;}
.u_yy .uli{padding:0px 10px;}
.u_yy .uli .t3{font-size:18px;font-weight:bold;margin:30px 0px;}
.u_yy .uli .imgs{position:relative;}

.u_yy .uli .imgs .abg{width:100%;height:60px;background-color: rgba(0, 0, 0, 0.5);position:absolute;bottom:0px;}
.u_yy .uli .imgs a{
/*border:1px solid white;*/
/*border-radius:10px; */
display:block;text-align:center;font-size:14px;color:white;font-weight:bold;line-height:60px;height:60px;}
.u_yy .uli .imgs a:hover{background:#e71021;border-color:#e71021;}
.u_service{}
.u_service .bg{background-image: url(../images/index_05.jpg);
background-repeat: no-repeat; /* 防止图片重复 */
background-position: center; /* 让图片居中 */
background-size: cover; /* 使图片覆盖整个元素 */
height:190px;}

.u_service .zx
{ position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);}
.u_service .zx .tel{margin-left:-30px;}
.u_service .zx .tel img{width:50px;float:left;}
.u_service .zx .tel span{color:white;font-size:36px;line-height:50px;margin-left:10px;}
.u_service .zx a{width:260px;height:50px;color:white;text-align:center;font-size:20px;background:#e71021;line-height:50px;border-radius:10px;margin-top:10px;}


.transition{margin-top:50px;}
.transition .bg{background-image: url(../images/bg_02.jpg);
background-repeat: no-repeat; /* 防止图片重复 */
background-position: center; /* 让图片居中 */
background-size: cover; /* 使图片覆盖整个元素 */
height:180px;}

.transition .bg .tel{float:left;margin-top:30px;width:50%;}
.transition .bg .desc{color:white;font-size:20px;margin:20px 0px;}
.transition .bg .tel img{width:40px;float:left;}
.transition .bg .tel span{color:white;font-size:30px;line-height:40px;margin-left:10px;}
.transition .bg .zx{float:right;}
.transition .bg .zx a{width:260px;height:50px;line-height:50px;color:white;font-size:20px;border-radius:10px;border:1px solid white;text-align:center;margin-top:70px;}

@media (max-width:1360px)
{
.container{width:1200px;margin:auto;} 
}


@media (max-width:1280px)
{
.container{width:100%;margin:auto;} 
}

@media (max-width:1024px)
{
.container{width:100%;margin:auto;} 
#lianxi{padding:20px;}
}


/* 平板及以上 */
@media (max-width: 768px) {

.pc{display:none;}
.wap{display:block;}

.u_list.tab-content .desc{padding:20px 0px;}

.tel_400{display:block;}
.container{width:100%;}
.container .tel2{display:none;}
._title{font-size:21px;}
.banner{padding-top:0px;}
._line{width:30px;height:2px;margin:5px auto;}


.box .logo a img{width:120px;}
.box .tel2 img{width:30px;height:30px;}
.box .tel2 a{font-size:21px;line-height:28px;}
.u_yy ul li{width:50%;}
.box .tel2{margin:30px 0px;}

.container .t1{padding-top:30px;line-height:30px;}

..u_nav{flex-wrap: nowrap;}
.container .t1{font-size:20px;}
.container .t2{font-size:12px;margin:5px 0px;}
.u_list li{width:100%;margin-top:20px;}
.u_list li .pad h2{font-size:16px;margin:0px;}
.u_list li .pad .more a{font-size:14px;padding:20px 20px;}

.u_yy .uli .t3{font-size:14px; margin:20px 0px;}


.u_service .zx a{width:120px; font-size:14px;height:40px;line-height:40px;}
.u_service .zx .tel img{width:30px;}
.u_service .zx .tel span{font-size:21px;line-height:30px;}

.tab-btn{padding:10px 21px;font-size:16px;}

.transition .bg .tel{width:100%;}
.transition .bg .desc{font-size:14px;line-height:24px;}
.transition .bg .tel img{width:30px;}
.transition .bg .tel span{font-size:21px;line-height:30px;}
.transition .bg{height:130px;}
.transition .bg .tel{margin-top:0px;}
.u_service .bg{height:130px;}


#lianxi{padding:10px;}
}



