@charset "utf-8";
:root{
	--maincolor:#2c58c8;
}
*{ margin:0; padding:0;}
html, body, div, span, iframe, map, font, img, a img, samp, strong, hr, h1, h2, h3, h4, h5, h6, b, p, blockquote, a, address, code, dl, dt, dd, ol, ul, li, form, label, table, tr, td, th {
	padding: 0;
	margin: 0;
	border: 0;
	font-weight: normal;
	font-family: 'Microsoft YaHei', Arial, Helvetica, sans-serif;
}
ol, ul {
	list-style: none;
}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
}
li{
	list-style: none;
}
a:link {
	text-decoration: none;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: none;
}
a:active {
	text-decoration: none;
}
input,select{
	font-family: 'Microsoft YaHei', Arial, Helvetica, sans-serif;
}
i {
    font-style: normal;
}
a {
	blr:expression(this.onFocus=this.blur());
}
a:focus {
	outline: none;
}
a.hidefocus {
	outline: none
}
input[type=text],input[type=submit], input[type=button] {
	-webkit-appearance: none;
}
input{
	outline: none
}
.wrapper{
	margin:12px 12px 75px 12px;
}
img {
	max-width: 100%;
	display: block;
}
.colorful {
  background: linear-gradient(to right, #007ffe, #2c58c8);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.line2{
	display:grid; 
	grid-template-columns: repeat(2, 1fr);
}
.line3{
	display:grid; 
	grid-template-columns: repeat(3, 1fr);
}
.line4{
	display:grid; 
	grid-template-columns: repeat(4, 1fr);
}
.line5{
	display:grid; 
	grid-template-columns: repeat(5, 1fr);
}
.clear{ 
	clear:both;
}
.fl {
	float: left;
}
.fr {
	float: right;
}
.line-bottom{
  position:relative;
}
.line-bottom::after{
  content:"";
  position: absolute;
  width:70%;
  height:4px;
  left:0;
  bottom:-20px;
  background: linear-gradient(to right, #007ffe, #2c58c8);
  margin-bottom:10px;
}
.flex{
    display: flex;
    display: -webkit-flex;
    justify-content: space-between;
}
.flec{
    display: flex;
    display: -webkit-flex;
    justify-content: space-between;
  align-items:center;
}
.fles{
  display: flex;
    display: -webkit-flex;
    justify-content: flex-start;
}


body {
	min-width: 320px;
	position: relative;
	background-size: 100%;
	background: #ffffff;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}


.container {
  width: 1300px;
  margin: 0 auto;
  }
  
  .header {
  background: #fff;
  border-bottom: 1px solid #e5eaf3;
  }
  
  .header-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 40px 0 40px;
  }
  
  .logo {
  height: 40px;
  }
  

  .header-contact {
    color: #666;
    font-size: 14px;
    }
    
    .header-search {
    display: flex;
    align-items: center;
    margin-left:20px;
    }
    
    .header-search input {
    border: 1px solid #e5eaf3;
    border-radius: 3px 0 0 3px;
    padding: 6px 10px;
    font-size: 14px;
    outline: none;
    }
    

    .header-search button {
      background: #1976d2;
      color: #fff;
      border: none;
      border-radius: 0 3px 3px 0;
      padding: 6px 18px;
      cursor: pointer;
      font-size: 14px;
      }
      .header .login{
        margin-left:20px;
      }
      .header .login a{
        margin-left:10px;
        color:#333;
      }
      .nav {
      display: flex;
      justify-content: center;
      padding: 0 0 0 0;
      margin-top: 12px;
      }
      
      .nav a {
        color: #fff;
        text-decoration: none;
        padding: 0 32px;
        line-height: 44px;
        font-size: 16px;
        transition: background 0.2s;
        font-weight:bold;
      }
      
      
      .breadcrumb {
        width:100%;
       background: #f2f6ff;
      font-size: 13px;
      color: #888;
      padding: 18px 0;
      margin-bottom: 15px;

      }
      .breadcrumb a{
        color:#888;
      }
      
      .pages{
          display: flex;
          justify-content: center;
        margin:60px 0;
        align-items:center;
      }
      .pages b,
      .pages a{
        display: inline-block;
        line-height:30px;
        height:30px;
        width:30px;
        text-align: center;
        color:#333;
        background:#aaa;
        color:#fff;
        border-radius:30px;
        margin:0 10px;
      }
      .pages b{
        background:var(--maincolor);
      }
      .pages span{
        display: inline-block;
        height:6px;
        width:6px;
        border-radius:6px;
        margin:0 4px;
        background:var(--maincolor);
      }
      .pages .points{
        margin-left:10px;
      }
      .pages i{
        color:var(--maincolor);
        font-style:normal;
      }
      .footer {
          background: url(../images/bg-footer.png) no-repeat center center;
        background-size: 100%;
          color: #fff;
          padding: 120px 0 24px 0;
          margin-top: 48px;
        }
        
        .footer-main {
          width: 1200px;
          margin: 0 auto;
          text-align: center;
        }
        
        .footer-logo {
        padding:30px 0;
          margin-bottom:30px;
        text-align: center;
        border-bottom: 1px solid #fff;
        }
        .footer-logo img{
        height:108px;
        display: inline-block;
        }
        
        .footer-title {
          font-size: 20px;
          font-weight: bold;
          margin-bottom: 12px;
        }
        
        .footer-links {
          margin-bottom: 12px;
        }
        
        .footer-links a {
          color: #fff;
          text-decoration: none;
          margin: 0 30px;
          font-size: 16px;
        }
        
        .footer-info {
          font-size: 13px;
          margin:20px 0;
        }
        .footer-info p{
        font-size: 14px;
        margin-bottom: 0;
        }
        .footer-public {
          font-size: 13px;
          color: #b3d1f7;
        }
        .footer-public .ga{
        background: url(../images/ga.png) no-repeat left center;
        padding-left: 20px;
        background-size: 16px 16px;
        }





  /* 用户名头像样式 */
  .layui-nav-item > a {
    display: flex !important;
    align-items: center;
  }
  .layui-nav-img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    object-fit: cover;
    margin-right: 8px;
  }
  #login_user_name {
    font-style: normal;
    white-space: nowrap;
    font-size: 14px;
    color: #000; /* 设置黑色字体 */
  }
  
  /* 主导航 */
  .main-nav {
    background: linear-gradient(to right, #007ffe, #2c58c8);
    font-family: 'Segoe UI', sans-serif;
    width: 100%;
    margin-top: 15px;
    display: flex;
    justify-content: center;
    padding: 0 5%;
    box-sizing: border-box;
  }
  .nav-menu {
    width: 90%;
    display: flex;
    margin: 0;
    padding: 0;
    list-style: none;
    align-items: center;
    justify-content: center;
  }
  .nav-item {
    position: relative;
    flex: 1;
    text-align: center;
  }
  .nav-link {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    color: #ecf0f1;
    text-decoration: none;
    font-size: 16px;
  }
  .nav-link:hover {
    background: #6faff0;
  }
  .dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 220px;
    background: #fff;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    z-index: 1000;
  }
  .nav-item:hover .dropdown-menu {
    display: block;
  }
  .dropdown-link {
    display: block;
    padding: 10px 20px;
    color: #2c3e50;
    text-decoration: none;
  }
  .dropdown-link:hover {
    background: #f0f0f0;
    color: #3498db;
  }
  
/* 移动端控制器 */
.mobile-toggle-label {
    display: none;
    flex-direction: column;
    justify-content: center; /* 改为居中排列 */
    align-items: center; /* 水平居中 */
    width: 30px;
    height: 30px; /* 改为正方形 */
    cursor: pointer;
    position: absolute;
    top: 50%;
    right: 20px;
    z-index: 1001;
    transform: translateY(-50%);
}

.mobile-toggle-label span {
    display: block;
    width: 24px; /* 固定宽度 */
    height: 2px; /* 更细的线条 */
    background: #9b9a9a;
    border-radius: 1px;
    transition: 0.3s;
    position: absolute; /* 绝对定位 */
}

/* 三条线的初始位置 */
.mobile-toggle-label span:nth-child(1) {
    transform: translateY(-8px);
}
.mobile-toggle-label span:nth-child(2) {
    /* 中间线默认位置 */
}
.mobile-toggle-label span:nth-child(3) {
    transform: translateY(8px);
}

  
  /* 切换为 X 图标 */
  #nav-toggle:checked + .mobile-toggle-label span:nth-child(1) {
    transform: rotate(45deg) translate(0);
    top: 50%;
}
#nav-toggle:checked + .mobile-toggle-label span:nth-child(2) {
    opacity: 0;
}
#nav-toggle:checked + .mobile-toggle-label span:nth-child(3) {
    transform: rotate(-45deg) translate(0);
    top: 50%;
}



  /* 内容区样式 */
.content{
  flex: 1;
  background: #fff;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.03);
  font-size: 14px;
}
.content_title  {
  height: auto;
  overflow: hidden;
  border-bottom: 1px solid #eee;
  padding-bottom: 20px;
  margin-bottom: 20px;
}
.content_title  h2 {
  font-size: min(max(14px, 1.2vw), 24px);
  color: #333;
  line-height: 2.0;
  text-align: center;
}

.title-footer {
  display: flex;
  justify-content: space-between; /* 左右两端对齐 */
  align-items: center; /* 垂直居中 */
  margin-top: 10px; /* 根据需要调整 */
}

.author {
  /* 作者信息样式 */
  color: #666;
  font-size: 12px;
}

.actions {
  /* 操作按钮样式 */
  display: flex;
  gap: 15px; /* 按钮之间的间距 */
}



.sidebar {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.03);
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  align-items: left;
  padding: 20px;
}
.sidebar li{
  margin-top:20px;
}
.sidebar .img{
  width:100px;
  border-radius:5px;
  overflow:hidden;
  margin-right:10px;
}
.sidebar .text{
  width:calc(100% - 110px);
}
.sidebar .text span{
  display: block;
  margin-top:10px;
  color:#999;
}
 .sidebar h3 {
  font-size: 18px;
  margin-bottom: 10px;
  text-align: left;
  width:100%;
  font-weight:bold;
}

.sidebar ul {
  list-style: none;
  padding: 0;
  width:100%;
}
 .latest{
  margin-top:20px;
  padding-top:30px;
  border-top:1px solid #eee;
  width: 100%;
}
.sidebar ul.withpoint li{
  position: relative;
  padding-left:20px;
}
 .sidebar ul.withpoint li::after{
  content:"";
  position: absolute;
  left:0;
  top:50%;
  transform:translateY(-50%);
  width:4px;
  height:4px;
  border-radius:2px;
  background:#999;
}
.sidebar ul.withpoint li a{
  color:var(--maincolor);
}

 .sidebar a {
  text-decoration: none;
  color: var(--maincolor);
  font-weight:bold;
}


.category-nav {
  display: flex;
  align-items: center;
  padding: 20px;

  margin-bottom: 20px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.03);
}

.category-title {
  font-weight: bold;
  margin-right: 20px;
  overflow-wrap: break-word;
}

.category-list {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
}

.category-list a {
  padding: 8px 16px;
  background: #f5f5f5;
  color: #666;
  text-decoration: none;
  border-radius: 4px;
  font-size: 14px;
}

.category-list a.active {
  background: rgb(242,246,255);
  color: var(--maincolor);
  font-weight:bold;
}



.activity-list{
  background:#ffffff;
  overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.activity-list .nav {
  display: flex;
  align-items: center;
  padding: 20px 0;
  border-bottom: 1px solid #eee;
}

.activity-list .nav a {
  margin-right: 40px;
  color: #666;
  text-decoration: none;
  font-size: 16px;
  padding:0;
}

.activity-list .nav a.active {
  color: #333;
  font-weight: bold;
  border-bottom:3px solid var(--maincolor);
}

.activity-list .more {
  margin-left: auto;
  color: #999;
  font-size: 14px;
}

.activity-list .list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  padding: 20px 0;
}

.activity-list .item {
  background: white;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  position: relative;
}

.activity-list .item img {
  width: 100%;
  height: 150px;
  object-fit: cover;
}

.activity-list .tag {
  border-radius: 100px;
  font-size: 12px;
  padding:0 0 0 30px;
  background:none;
  margin-top:-30px;
}
.activity-list .tag img{
  width:60px;
  height:60px
}
.activity-list .item h3 {
  padding: 15px;
  font-size: 16px;
  color: var(--maincolor);
  border-bottom:1px solid #ccc;
  margin:0 15px 15px 0; 
  font-weight:bold;
}

.activity-list .info {
  padding: 0 15px 15px;
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: #333;
}


.user_sidebar {
  width: 100%;
  background: #3f6dff;
  border-radius: 12px;
  padding: 24px 0;
  box-shadow: 0 2px 8px rgba(0,0,0,0.03);
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
}
.user_sidebar_item {
display: flex;
width: 140px;
flex-direction:row;
margin-top:10px;
flex: 1 1 calc(25% - 10px); 
white-space: nowrap; /* 避免内容内部换行（图标+文字） */
text-align: center;
color: rgb(255, 255, 255);
cursor: pointer;
padding: 10px 12px 0px;
border-radius: 6px;
transition: background 0.2s ease 0s, color 0.2s ease 0s;
}
.user_sidebar_item i {
display: inline-flex;
line-height: 1;
flex-direction: row;
align-items: center;
vertical-align: middle;
margin-bottom: 7px;

}
.user_sidebar .active{
  background-color:#fff;
  color:#1976d2;
}
.user_sidebar_item i span {
all: unset; /* 移除所有样式 */
padding-left:3px;
display: inline-block;
font-size:14px;

}






  /* 案列样式 */

  

  .recommend {
    display: flex;
    margin-bottom: 40px;
  }

  .recommend-left {
    width: 400px;
    height:390px;
    background: url(../images/bg-hot.png) top center no-repeat;
    background-size:100% 100%;
    color: #fff;
    padding: 40px 30px;
    border-radius: 12px;
    margin-right:20px;
    position: relative;
  }

  .recommend-left h2 {
    font-size: 24px;
    margin-bottom: 10px;
  }

  .recommend-left p {
    font-size: 14px;
    margin-bottom: 30px;
    opacity: 0.8;
  }

  .recommend-left .more {
    display: flex;
    align-items: center;
    cursor: pointer;
    position: absolute;
    bottom:40px;
    left: 30px;
    text-align: center;
  }

  .recommend-left .more span{
    color:#fff;
  }

  .recommend-left .arrow {
    margin-left: 10px;
    font-size: 18px;
    background:url(../images/arrow.png) center center no-repeat;
    background-size:100%;
    width:20px;
    height:10px;
  }

  .recommend-right{
    flex: 1;

  }


.case-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 15px;
  height: 470px;
}

.case-item {
  position: relative;
  border-radius: 10px;
  text-overflow: ellipsis;

  overflow: hidden; /* ✅ 保留，用于图片圆角，但文字要放内部 */
}

.case-item a {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;

}

.case-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.case-item span {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0; /* ✅ 放在图片底部 */
  padding: 10px;
  background: rgba(0, 0, 0, 0.5); /* 黑底半透明 */
  color: #fff;
  font-size: 16px;
  text-align: center;
  z-index: 1;
  box-sizing: border-box;
  text-overflow: ellipsis;

}
.activity-list .item h3 {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.activity-list .item img {
    width: 100%;
    height: 189px;
    object-fit: cover;
}


.search-section {
  margin-bottom: 30px;
}
.search-box input {
  width: 400px;
  padding: 12px 15px;
  border: 1px solid #ddd;
  border-radius: 4px 0 0 4px;
  font-size: 14px;
}

.search-box button {
  padding: 12px 30px;
  background: #4285f4;
  color: #fff;
  border: none;
  border-radius: 0 4px 4px 0;
  cursor: pointer;
  font-size: 14px;
}

  /* 移动端样式 */
  
.category_sidebar {
  width: 100%;
  background: #3f6dff;
  border-radius: 12px;
  padding: 24px 0;
  box-shadow: 0 2px 8px rgba(0,0,0,0.03);
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
}
.category_sidebar_item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 140px;
  text-align: center;
  color: rgb(255, 255, 255);
  font-size: 16px;
  cursor: pointer;
  padding: 10px 12px 0px;
  border-radius: 6px;
  transition: background 0.2s ease 0s, color 0.2s ease 0s;
}
.category_sidebar .active{
  background-color:#fff;
  color:#1976d2;
}
.category_sidebar_item i {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size:60px;

}
.category_sidebar_item i span {
  display: block;
  margin-top: 5px; /* 可选，控制文字和图标的间距 */
  white-space: pre-wrap;
  word-break: break-word;
  display: inline-block;
  margin-bottom: 14px;
  font-size:14px;
}





.article a{
  font-size:16px;
  color:#333;
}
.article-list i{
  font-size:14px;
  color:#999;
}
.article-list .img {
  margin-right: 15px;
  flex:0 0 300px;
  width: 100%;
  height: auto;
}
.article-list .img img {
  width:100%;
  border-radius: 5px;
}
.article-list li{
  line-height:50px;
  margin-bottom:20px;
  padding-bottom:20px;
  border-bottom:1px solid #eee;
}


.article-list .text {
  text-align: left;
}

.article-list .text h2 {
  margin: 0 0 5px 0;
  font-size: 18px;
  text-align: left;
  font-weight:bold;
}

.article-list .text p {
  margin: 0 0 10px 0;
  color: #666;
  text-indent: 0;
  line-height: 1.8;
  font-size:14px;
  text-overflow:ellipsis;
  overflow:hidden;
  -webkit-box-orient:vertical;
  display:-webkit-box;
  -webkit-line-clamp:3;
}
.article-list .link{
  text-align:right;
}
.article-list .link a {
  text-decoration: none;
  color: #fff;
  background: linear-gradient(to right, #007ffe, #2c58c8);
  padding: 5px 20px;
  border-radius: 3px;
}

/*首页*/


.ibanner{
  position: relative;
  background:#fff;
}
.ibanner img{
  width:100%;
}
.ibanner .ibanner-box{
  position: absolute;
  bottom:0;
  left:0;
  width:100%;
  background:url(../images/bg-banner.png) bottom center no-repeat;
  background-size:100%;
  height:400px;
  top:70%;
  z-index:1;
}
.ibanner .swiper-pagination{
  z-index:9;
  left:0;
  right:0;
}
.ibanner .swiper-pagination-bullet{
  margin:0 6px;
  background:#fff;
}

.index .header {
  text-align: center;
  padding: 220px 0 40px 0;
}

.index .header h1 {
  font-size: 32px;
}
.index .header h1 span{
  font-weight:bold;
}
.index .header p {
  font-size: 16px;
  margin: 0;
}

.index .filters {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin: 30px 0;
}

.index .filter {
  border: 1px solid #ddd;
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 150px;
}

.index .filter span {
  color: #333;
}

.index .filter i {
  color: #999;
}
.index .filter select {
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 12px 30px;
  min-width: 150px;
  font-size: 14px;
  color: #333;
  cursor: pointer;
  appearance: none;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8"><path d="M6 8L0 0h12z" fill="%23999"/></svg>');
  background-repeat: no-repeat;
  background-position: right 15px center;
}

.index .filter select:focus {
  outline: none;
  border-color: #1976d2;
}

.index .search-btn {
  display: block;
  margin: 0 auto 40px;
  color: white;
  border: none;
  border-radius: 25px;
  padding: 12px 80px;
  font-size: 16px;
  cursor: pointer;
}

.index .content {
  display: flex;
  gap: 30px;
  max-width: 1200px;
  margin: 0 auto;
}

.index .left {
  width: 300px;
}

.index .news h3 {
  color: #1976d2;
  font-size: 18px;
  margin: 0 0 0 0;
  padding-bottom: 10px;
  position: relative;
}

.index .news .more {
  color: #999;
  font-size: 14px;
}

.index .news ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.index .news li {
  color: #666;
  font-size: 14px;
  line-height: 1.8;
  border-bottom: 1px dotted #999;
  padding: 8px 0;
  margin-bottom:0;
}

.index .news .title{
  border-bottom: 1px solid #999;
}

.index .right {
  flex: 1;
}

.index .services {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 15px;
  margin-bottom: 15px;
}

.index .service {
  background: rgb(196, 227, 255);
  border-radius: 8px;
  padding: 20px 0 0 0;
  text-align: center;
  position: relative;
  border-radius:10px;
  overflow: hidden;
}

.index .service h4 {
  color: #1976d2;
  font-weight:bold;
  font-size: 16px;
  margin: 0 0 5px 0;
}

.index .service p {
  color: #1976d2;
  font-weight:bold;
  font-size: 16px;
  margin: 0 0 15px 0;
}
.index .service .find{
  display: flex;
  align-items: center;
  justify-content: center;
  background:#fff;
}
.index .service i {
  font-size: 20px;
  display: inline-block;
  width:20px;
  height:20px;
  margin-right:6px;
  padding:10px 0;
}
.index .service i.act-1{
  background:url(../images/act-1.png) center center no-repeat;
  background-size:100%;
}
.index .service i.act-2{
  background:url(../images/act-2.png) center center no-repeat;
  background-size:100%;
}
.index .service i.act-3{
  background:url(../images/act-3.png) center center no-repeat;
  background-size:100%;
}
.index .service i.act-4{    
  background:url(../images/act-4.png) center center no-repeat;
  background-size:100%;
}
.index .service span {
  color: #1976d2;
  font-size: 14px;
}

.index .banner {
  background: linear-gradient(to right, #1976d2, #42a5f5);
  color: white;
  border-radius: 8px;
  padding: 30px;
  text-align: center;
  background-image: url('city.jpg');
  background-size: cover;
  background-position: center;
}

.index .banner h2 {
  font-size: 24px;
  margin: 0;
}

.index .cases {
  max-width: 1200px;
  margin: 0 auto;
}

.index .cases h2 {
  color: #1976d2;
  text-align: center;
  font-size: 28px;
  margin: 0 0 30px 0;
  position: relative;
}

.index .cases h2::before {
  left: -150px;
}

.index .cases h2::after {
  right: -150px;
}

.index .tabs {
  display: flex;
  justify-content: center;
  gap: 30px;
  margin-bottom: 30px;
  align-items: center;
}

.index .tabs a {
  color: #666;
  text-decoration: none;
  font-size: 16px;
  padding-bottom: 5px;
}

.index .tabs a.active {
  color: #1976d2;
  border-bottom: 2px solid #1976d2;
}

.index .tabs .more {
  color: #999;
  font-size: 14px;
}

.index .case-list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}

.index .case {
  background: white;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.index .case img {
  width: 100%;
  height: 120px;
  object-fit: cover;
}

.index .case h4 {
  padding: 15px 15px 10px;
  margin: 0;
  font-size: 14px;
  color: #333;
  line-height: 1.4;
}

.index .case .info {
  padding: 0 15px 15px;
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: #999;
}

.index .right,
.index .left{
flex:1;
}
.index .industry .right {
flex: 2;
}

.index .section {
padding: 20px;
border-radius: 8px;
position: relative;
}

.index .section .title{
border-bottom: 1px solid #999;
margin: 0 0 10px 0;
padding-bottom: 10px;
}
.index .section h3 {
font-size: 18px;
font-weight:bold;
}

.index .section .more {
color: #999;
font-size: 14px;
}

.index .section ul {
list-style: none;
padding: 0;
margin: 0;
}

.index .section li a{
display: block;
color: #333;
font-size: 14px;
font-weight:bold;
line-height: 1.8;
border-bottom: 1px dotted #999;
padding: 8px 0;
}

.index .banner {
background: linear-gradient(to right, #1976d2, #42a5f5);
color: white;
border-radius: 8px;
padding: 30px;
margin: 0 auto 40px;
max-width: 1200px;
position: relative;
display: flex;
align-items: center;
}

.index .banner .tag {
background: #1565c0;
padding: 15px 20px;
border-radius: 8px;
font-size: 16px;
font-weight: bold;
margin-right: 30px;
text-align: center;
line-height: 1.2;
}

.index .banner h2 {
font-size: 28px;
margin: 0;
flex: 1;
}

.index .bottom {
display: flex;
gap: 30px;
max-width: 1200px;
margin: 0 auto;
}

.index .bottom .left, .index .bottom .right {
flex: 1;
}

.index .buttons {
display: flex;
gap: 15px;
margin-top:38px;
}

.index .buttons .btn {
padding: 12px 30px;
border: none;
border-radius: 6px;
font-size: 14px;
cursor: pointer;
display: flex;
align-items: center;
gap: 8px;
color:#fff;
width: 50%;
text-align: center;
justify-content: center;

}
.index .buttons .btn i{
width:20px;
height:20px;
}
.index .buttons .btn .member-1{
background:url(../images/member-1.png) center center no-repeat;
background-size:16px;

}
.index .buttons .btn .member-2{
background:url(../images/member-2.png) center center no-repeat;
background-size:16px;
}
  
.related-links {
  margin-top: 60px;
  font-size: 14px;
  color: #1976d2;

}
.related-links .title{
  text-align: left;
  margin-bottom:10px;
}

.related-links span {
  font-size: 16px;
  font-weight: bold;
}
.related-links ul{
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
.related-links a {
  color: #1976d2;
  text-decoration: none;
  margin-right: 8px;
}



  /* 移动端样式 */
  @media (max-width: 992px) {
    .container-news .sidebar,
    .index .bottom,
    .index .content,
    .news li,
    .activity-list .info,
    .category-nav,
    .recommend,
    .company-detail,
    .company-meta,
    .company .timeline,
    .main,
    .mapcontainer .container,
    .company .stats,
    .container-news .newsinfo .flec,
    .container-news .event-info .flex,
    .container-news{
      flex-direction:column;
    }

    .container{
      width:100vw;
      margin:0 auto;
    }
    .header-top{
      padding:10px 70px 0 15px;
      width:calc(100% - 85px);
    }
    .header-search,
    .header-contact{
      display: none;
    }
    .header .menu{
      display: block;
      left: auto;
      right:0;
      top: 10px;
    }
    .header .nav .container{
      display: none;
      flex-direction:column;
    }
    .header .nav.selected .container{
      display: flex;
    }
    .header .nav a{
      line-height:50px;
    }
    .footer{
      background:var(--maincolor);
      padding:15px 0 30px 0;
    }
    .footer-logo{
      padding:15px 0;
    }
    .footer-logo img{
      width:70%;
      height:auto;
      margin:0 auto;
    }
    .footer-main{
      width:100%;
    }
    .footer-links{
      display: none;
      margin:0 5px;
    }
    .footer-info{
      margin:0 15px;
      line-height:2;
    }
    
    .pages{
      margin:30px 0;
    }
    .pages b,
    .pages a{
      margin:0 6px;
    }
    .pages .points{
        display: none;
    }
    .mtb50{
      margin:20px 0;
    }
    .mobile-toggle-label {
      display: flex;
    }
    #login_user_name {
        display: none !important;
    }
    .layui-nav-item .layui-nav-more {
        display: none !important;
    }
  
    .nav-menu {
      display: none;
      flex-direction: column;
      background: linear-gradient(to right, #007ffe, #2c58c8);
      width: 100%;
      position: absolute;
      top: 100%;
      left: 0;
      z-index: 999;
      padding: 10px 0;
    }
  
    #nav-toggle:checked ~ .main-nav .nav-menu {
      display: flex;
    }
  
    .nav-item {
      flex: none;
      text-align: left;
      padding: 0 20px;
    }
  
    .nav-link {
      justify-content: flex-start;
      color: #ffffff;
    }
  
    .dropdown-menu {
      position: static;
      background: rgba(255, 255, 255, 0.1); /* 可根据喜好调整 */
      box-shadow: none;
      display: none;
    }
  
    .nav-item:hover .dropdown-menu {
      display: block;
    }
    .category_sidebar {
      display: flex;
      width: calc(100% - 20px);
      flex-direction: row;
      margin-bottom: 15px;
      padding: 10px;
      flex-wrap: wrap; /* 超出自动换行 */
      gap: 10px; /* 可选，设置间距 */
  }
  .category_sidebar_item {
    display: flex;
    flex-direction:row;
    align-items: center;
    justify-content: center;
    flex: 1 1 calc(25% - 10px);   /* 每行平均 4 个，可调为 33.33% 等 */

    white-space: nowrap; /* 避免内容内部换行（图标+文字） */
    text-align: center;
    color: rgb(255, 255, 255);
    font-size: 16px;
    cursor: pointer;
    padding: 10px 12px 0px;
    border-radius: 6px;
    transition: background 0.2s ease 0s, color 0.2s ease 0s;
}
.category_sidebar_item i {
  display: inline-flex;
  line-height: 1;
  flex-direction: row;
  align-items: center;
  font-size:16px;
  vertical-align: middle;
  margin-bottom: 7px;

}
.category_sidebar_item i span {
  all: unset; /* 移除所有样式 */
  padding-left:3px;
  display: inline-block;

}





  .article-list li{
    flex-direction: column;
  }
    .article-list a{
      line-height:1.5;
      margin-bottom:15px;
    }
    .article-list .link,.article-list span{
      display: none;
    }
    .article-list .img{
      flex: 0;
      width:100%;
      height: auto;
    }
    .article-list img{
      width:100%;
      border-radius: 5px;

    }

    .article-list .text{
      display:flexbox;
      margin-top:15px;
      text-align: left;
    }
    .article-list .text h2 {
      margin: 0 0 5px 0;
      font-size: 18px;
      text-align: left;
      font-weight: 300;
  }
    
    .article-list .text p {
      display: none;
    }
    img {
      max-width: 100%;
      display: block;
  }
  .case-page {
    margin: 0 auto;
}
   .recommend-left{
    display: none;
   }
     .recommend-right{
      width:100%;
      gap: 10px;
    }
    .case-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: 1fr 1fr;
      gap: 15px;
     height: auto; 
  }
  .search-box input {
    width: calc(100% - 130px);
}
.category-nav {
  display: flex;
  align-items: flex-start;
}
.category-title {
  text-align: left;
  margin-bottom: 15px;
}
.activity-list .nav a {
  margin-right: 10px;
  border-bottom: 3px solid rgba(0,0,0,0);
}

.related-links{
  margin-top:15px;
}
.related-links ul{
  gap:6px;
}
.relate li a{
  display: block;
  text-overflow:ellipsis;
  white-space: nowrap;
  overflow: hidden;
}


.index .content{

}
.index .tabs{
  gap:10px;
}
.index .case-list{
  grid-template-columns: repeat(1, 1fr);
  padding:0 15px;
}
.index .bottom .left, .index .bottom .right{
  width:100%;
}
.index .bottom,
.index .content{
  padding:0 15px;
  width:calc(100% - 30px);
  margin:0 auto;
}
.index .section{
  padding:0;
}
.index .left{
  width:100%;
}
.ibanner .ibanner-box{
  height:100px;
}
.index .services{
      grid-template-columns: repeat(2, 1fr);
}
.index .filters{
  flex-direction:column;
  gap:10px;
  padding:15px;
  margin:15px 0;
}
.index .filter{
  border:0;
  justify-content: center;
}
.index .filter select{
  width:100%;
}

.index .header{
  padding:40px 0 20px 0;
}
.index .industry {
  margin-top:30px;
}
  }