.head-container{
  display: flex;           /* 启用Flex布局 */
  justify-content: space-between; /* 子项两端对齐 */ 
  width: 95%;
  align-items: center;     /* 垂直居中 */
  /* height: auto; */
  margin-left: 2.5%;
 
}

/* 前两个靠左 */ /* 将后续元素推到右边 */
/* .head-container > *:nth-child(1),
.head-container > *:nth-child(2) {
  margin-right: auto;
} */

/* 子元素宽度分配 */
.head-container > *:nth-child(1) { width: 50%; }
.head-container > *:nth-child(2) { width: 50%; }

.head-container .left{
  /* height: 80px; */
  width: 50%;
  margin-bottom: 20px;
}
.head-container .right{
  height: 100px;
  width: 50%;
  display: flex;           /* 启用Flex布局 */
  justify-content: flex-start; /* 子项两端对齐 */
  align-items: center;     /* 垂直居中 */
  gap:20px;
}
.head-container .right> li{
  padding-top: 39.5px;
  padding-bottom: 39.5px;
  height: 100%;
  font-size: 16px;
  background-color: #fff;
  /* 移除 overflow: hidden */
  display: flex;          /* 使用 Flex 控制布局 */
  align-items: center;    /* 垂直居中 */
  border:none;
  transition: all 0.8s ease; /* 添加过渡效果 */
}
/*导航*/
#nav_header {
  width: 100%;
background: white; /* 避免内容透过header */
  position: fixed;
  z-index: 1000;
  top: 0px;
  left: 0px;
  display: flex;
  align-items: center; /* 垂直居中 */
  min-height: 60px; /* 最低高度 */
  padding: 0; /* 通过padding控制高度 */

}
#nav_header .navbar {
  margin: 0;
  border-radius: unset;
  box-shadow: 0 0px 10px 0 rgba(0, 0, 0, 0.1);
}
#nav_header .navbar-default {
  background-color: rgb(255, 255, 255);
  color: #595959;
  width: 100%;
  border-color: transparent;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

/* #nav_header .navbar-header {
  margin: 10px 0;
} */
/* #nav_header .navbar-header > .navbar-brand {
  width: 25px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
} */
a .navbar-brand{
  margin-top: 35px;
  width: 100px;
  /* height: 20px; */
 }
.navbar-brand img {
  /* margin-left: 60px; */
  margin-top: 25px;
  width: 121px;
  /* height: 20px; */
}


#nav_header .CHUZHOU{
  display: flex;
  flex-direction: column; /* 让 <p> 垂直排列（换行） */
  font-weight: 600;
  margin-top: 35px;
  font-size: 19px;  
  color: #333;
  /* margin-bottom: 20; */
}
.CHUZHOU p{
margin-top: 0px;
  margin-bottom: 0;
}
.navbar-collapse{
display: flex;
justify-content:space-between;
align-items: center;
}
/* 导航菜单项 */
.navbar-nav > li > a {
  color: #454545;
  font-weight: 500;
  padding: 15px 20px;
  transition: all 0.3s ease;
}
/* a是主菜单不是悬浮子菜单 */
.navbar-nav > li > a:hover,
.navbar-nav > li > a:focus {
    margin:none;
  padding: none;
  color: #D11034;
  background-color: transparent;
}
/* 主菜单 */
.dropdown a{
  transition: all 0.75s ease;
  color: #333;
  font-weight: 500;
  font-family: Source Han Sans CN;

  white-space: nowrap; /* 禁止换行 */

}


/* 下拉菜单 */
.dropdown-menu {
  position: absolute;     /* 绝对定位，不受父容器限制 */
  z-index: 1000;         /* 确保悬浮层在最上层 */
  background-color: #D11034;
  border: none;
  border-radius: 0;
  margin: 0;
  padding: 0;
  min-width: 200px;
  top: 100px; /* 将箭头向上移动，使其与菜单顶部对齐 */
  width: 300px;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s;
  display: block;
  box-shadow: 0 0 10px rgba(0,0,0,0.0.2);
}

.dropdown-menu::after {
  content: "";
  display: block;
  width: 0; 
  height: 0;
  position: absolute;
  top: -10px; /* 将箭头向上移动，使其与菜单顶部对齐 */
  left: 20px; /* 从菜单左侧开始定位 */
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #D11034; /* 与菜单背景色相同 */
  transform: none; /* 移除之前的居中变换 */
}
/* .dropdown:hover .dropdown{
background-color: #999;
} */
.dropdown:hover .dropdown-menu {
  opacity: 1;
  visibility: visible;
}
/* .dropdown:hover .head-container > li{

  background-color: #eafa05;
  border-top: #D11034;
} */
/* 悬停效果 */
/* .head-container .right> .dropdown:hover {
  background-color: #ebebeb;
  border-top:4px solid #D11034;
} */
/* 修改悬停效果 - 添加平滑的边框动画 */
.head-container .right > .dropdown {
  position: relative; /* 为伪元素定位做准备 */
 /* overflow: hidden;  隐藏超出部分的伪元素 */
}

.head-container .right > .dropdown:hover {
  background-color: #ebebeb;
  /* 移除原来的border-top */
  border-top: none;
}

/* 使用伪元素创建动画边框 */
.head-container .right > .dropdown::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 0; /* 初始宽度为0 */
  height: 3px;
  background-color: #D11034;
  transition: width 0.3s ease-out; /* 只动画宽度 */
}

.head-container .right > .dropdown:hover::before {
  width: 100%; /* 悬停时宽度扩展到100% */
}



.dropdown-menu li a {
  color: white;
  padding: 10px 20px;
  transition: all 0.2s ease;
}

/* 这个a才是悬浮子菜单 */
.dropdown-menu li a:hover {
  background-color: #8d0a22!important;
  color: white;
}

.search-dialog {
   display: none; /* 默认隐藏 */
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
}
.search-dialog.show {
  display: flex !important; /* 显示时强制使用flex */
}
.dialog-content {
  background: white;
  padding: 20px;
  border: 4px solid #999;
  width: 80%;
}
/* 输入框无边框样式 */
#searchInput {
  border: none;           /* 移除默认边框 */
  outline: none;          /* 移除聚焦时的轮廓线 */
  background: #dfdfdf; /* 透明背景（可选） */
  width: 100%;            /* 撑满容器宽度 */
  padding: 10px;          /* 内边距保持输入舒适度 */
  margin: 15px 0;    /* 与按钮间距 */

  
}

/* 按钮无边框样式 */
#confirmSearch, 
#cancelSearch {
  border: none;           /* 移除边框 */
  outline: none;          /* 移除聚焦轮廓 */
  background: transparent; /* 透明背景 */
  padding: 8px 15px;      /* 内边距 */
  margin: 0 5px;          /* 按钮间距 */
  cursor: pointer;        /* 手型指针 */
  transition: all 0.3s;   /* 悬停动画 */
}

/* 按钮悬停效果（可选） */
#confirmSearch:hover {
  background: #dfdfdf;             /* 主按钮悬停颜色 */
}
#cancelSearch:hover {
 background: #dfdfdf;         /* 取消按钮悬停颜色 */
}
.dialog-buttons {
  display: flex;
  justify-content: flex-end;
  margin-top: 15px;
  gap: 10px;
  border: none;
}
.search-container img{
 width: 50px;
 height: auto;
 transition: all 0.5s ease; /* 添加平滑过渡效果 */
}
.search-container:hover img{
content: url(../imgs/icons/search_active.png);
}
@media (max-width: 1600px) {

}
@media (max-width: 1100px) {
}


@media (max-width: 1100px) {

  .nav>li>a{
    padding: 15px 10px !important;
  }
  .navbar-nav {
    margin: 0px -15px;
  }
}

@media screen and (max-width: 767px) {

  #nav_header {
    display: block;
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 2222;
  }
  #nav_header .navbar-header {
    margin: unset;
  }


  #bs-example-navbar-collapse {

    position: fixed;
    top: 60px;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2222;
  }
  #bs-example-navbar-collapse .navbar-right {
    display: none;
  }

  .dropdown-menu > li > a {

    font-size: 12px;
    padding: 5px 20px;
  }
  .icon-bar {
    background-color: #fff;
  }
  #nav_header .navbar-nav > li > a {
    font-size: 12px;
    padding: 8px 12px;

    height: 47px;
    display: block;
    line-height: 34px;
  }
  #nav_header .navbar-nav > li {
    width: 80%;
    clear: both;
    position: relative;
  }
  .dropdown-menu {
    opacity: 0;
    transition: all 0.5s;
    display: none;
    position: relative;
    padding: 0 5%;
    border: 0;

    width: 100%;

  }
  .dropdown-menu > li {
    position: relative;
  }

}

/* 底部信息 */
footer {
  /* margin-top: 124px; */
  background-color: #EEEEEE;
  height: 441px;
  display: grid;

  justify-items: center;
  padding: 1.5rem 1.5rem 0.3rem 1.5rem;
 
}
.footer-menus {
  width: 100%;
  display: grid;
  grid-template-columns: 2fr 2fr 2fr 1fr;
  /* padding: 0 1rem; */
  position: relative;
}
.contact-us {

  justify-self: start;
  color: var(--text-color-lightest);
    /* font-size: 0.2rem; */
    font-size: 16px;
    color: #454545;
}
.img{
  
  margin-bottom: 20px;
}
.footer-menu {
  display: flex;
  flex-direction: column;
  align-items: flex-start; /* 改为左对齐（默认是 center） */
}

/* 如果 menu-title 和 menu-items 是类名 */
.menu-title,
.menu-items {
  width: 100%; /* 确保宽度撑满父容器，方便左对齐 */
  text-align: left; /* 文字也左对齐（可选） */
}
.menu-items{
  margin-top: 20px;
  line-height: 20px;
}
.menu-items li {
  margin-bottom: 10px; /* 每个 <li> 下方增加 10px 间距 */
}
.menu-title {
  /* font-size: 0.2rem; */
  font-size: 20px;
  color: #454545;
  font-weight: 550;
  /* margin-bottom: 0.25rem; */
}
   /* 小横杠 */
    .menu-title::after {
   content: "";
  display: block;
  text-align: center;
  height: 1px;
  width: 40px;
  margin-top: 10px;
  border-bottom: 2px solid #D11034;
}
.footer-menu:hover .menu-title{
  color: #D11034;
}
.qr-code {
  display: flex;
  flex-direction: column;
  align-items: center;

 
}

.footer-link {
  color: #454545;
  text-decoration: none;
  transition: color 0.3s ease;
}
.footer-link:hover {
  color: #D11034;
  text-decoration: underline; /* 悬停时显示下划线 */
  text-decoration-thickness: 5px; /* 控制下划线粗细（可选） */
}
.footer-logo {
  width: 170px;
  height: 30px;
}
.logo {
  width: 41px;
  height: 41px;
}

/* 细的下划线 */
.footer-divider {
   border: none;
  height: 1px; /* 原始高度 */
  background: #999;
  margin: 20px 0;
  transform: scaleY(0.5); /* 垂直压缩为 0.5px */
  transform-origin: 0 0; /* 确保从顶部开始缩放 */
  margin-top: 20px;             /* 上下边距 */
  width: 100%;

}
.icp-info {
  margin-top: 24px;
  margin-bottom: 16px;
}
.icp-info,
.rights {
  grid-column: 1 / -1;
  justify-self: center;
  color: #454545;
}

.scroll-to-top {
  display: none;
  position: relative;
  z-index: 300;
}
.scroll-to-top a {
  width: 32px;
  height: 32px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--primary-color);
  color: white;
  text-decoration: none;
  position: fixed;
  bottom: 60px;
  right: 30px;
}

 @media (max-width: 1600px) {
.head-container{
  width: 100%;
  align-items: center;
}
/* 子元素宽度分配 */
.head-container > *:nth-child(1) { width: 40%; }
.head-container > *:nth-child(2) { width: 60%; }
a .navbar-brand{
  margin-top: 35px;
  width: 100px;
  /* height: 20px; */
 }
.navbar-brand img {
  /* margin-left: 60px; */
  margin-top: 25px;
  width: 80px;
  /* height: 20px; */
}


#nav_header .CHUZHOU{
  display: flex;
  flex-direction: column; /* 让 <p> 垂直排列（换行） */
  font-weight: 600;
  margin-top: 35px;
  font-size: 14px;  
  color: #333;
  /* margin-bottom: 20; */
}
.CHUZHOU p{
margin-top: 0px;
  margin-bottom: 0;
  font-size: 14px;  
}
}
 @media (max-width: 1060px) {
  /* 变挤压型 */
  /* 子元素宽度分配 */
.head-container > *:nth-child(1) { width: 30%; }
.head-container > *:nth-child(2) { width: 70%; }
.head-container{
  gap: 0;
}
.head-container .right{
  margin-left: 0px;
  height: 100px;

  display: flex;           /* 启用Flex布局 */
  justify-content: flex-start; /* 子项两端对齐 */
  align-items: center;     /* 垂直居中 */
  gap:0px;

}
.search-container img{
  margin-left: 5px;
 
}
.head-container .right> li{
  padding-top: 39.5px;
  padding-bottom: 39.5px;
  height: 100%;
  font-size: 16px;
  background-color: #fff;
  /* overflow: hidden ; */
  display: flex;          /* 使用 Flex 控制布局 */
  align-items: center;    /* 垂直居中 */
  border:none;
  transition: all 0.8s ease; /* 添加过渡效果 */
  max-width: 134px;
   position: relative; /* 创建定位上下文 */
  z-index: 1; /* 设置较低层级 */
}
.dropdown-menu {
  /* 不管用 */
 position: absolute;
  top: 100%;
  left: 0;
  z-index: 100000; /* 高于父级 */
  transform: translateZ(0); /* 强制启用 GPU 渲染，绕过裁剪 */
}
 }
 @media (max-width: 855px) {
  /* 不见型 */
/* 默认隐藏 .right */
.head-container .right {
  display: none;
}

/* 强制显示 .search-container */
.head-container .right .search-container {
  display: block; /* 或其他需要的值（flex/inline-block等） */
}
 } 