body, html {
  width: 100%;
    margin: 0;
    padding: 0;
    /* font-family: Arial, "Microsoft YaHei"; 不带勾的逗号*/
    font-family: Arial, sans-serif;
     scroll-behavior: smooth;
     overflow-x: hidden;  /*隐藏水平滚动条 */
}
.navbar {
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 display: flex;
 align-items: center;
 justify-content: center;
 padding: 20px 20px;
 /* background-color: #9abfd1; */
 transition: background-color 0.3s;
 z-index: 1000;
 background-color: rgba(23, 116, 170, 0.801);
 display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    will-change: transform; 
    box-sizing: border-box;
}

.navbar .logo {
  margin: 0 ; /* 去除可能的外边距 */
  padding: 0 ; /* 去除可能的内边距 */
  display: flex;
  align-items: center; /* 垂直居中 */
  justify-content: flex-start; /* 水平起始对齐 */
  transition: transform 0.5s ease; /* 平滑过渡效果 */
  /* margin-left: -20px; */
}

.logo img {
  width: auto;
  height: 46px; /* 保持图片比例 */
  margin-left: 5%;
  display: block;
  /* vertical-align: bottom;   这个也可以解决底部有空间，图标上下移动问题*/    
}

   .nav-list{
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: flex;
    margin-left: 180px;
       }

   .nav-item {
   position: relative;
   margin: 0 15px;
   will-change: transform; 
 }
 .nav-item > a {
 display: block;
 color: white;
 font-size: 19px;
 margin-top: -15px; 
  padding:18px 10px;
 text-decoration:none;
 /* background-color: aqua; */
 transition: transform 0.3s ease; /* 平滑过渡效果 */
 }

 .nav-item  li a{
   transition: transform 0.3s ease; /* 平滑过渡效果 */
 }
 .nav-item > a:hover {
   transform: scale(1.2) translateY(-2px); /* 放大并上浮 */
 }
 .nav-item#sousuo > a:hover {
  transform:  scale(1.05) translateY(-1px);  /* 覆盖父级的放大和上浮效果 */
}

       .nav-list > li{
           float: left;
           width: 99px;
           height: 50px;
           text-align: center;
           /* background-color: black; */
           line-height: 50px;
           /* border-right:1px solid white; */
           position: relative;/* 用于导航栏子内容页div的相对定位 */
       }

       .dropdown{
           display: none;
          position: absolute;
          /* min-width: auto; */
          list-style-type: none;
          left: -45px;
          z-index: 999;
          will-change: opacity, max-height; 
       }

       .dropdown li{
           /* width: 200px; */
           /* height: 30px; */
           line-height: 30px;
           display: block;
            margin-left: -36px;   /*子导航栏背景*/
       }
       .dropdown li a {
           color: black;
        padding: 4px 1px;
       text-decoration: none;
       background-color: white;
       display: block;
       text-align: center;
       width: 180px;
       border-bottom: 1px dashed #ddd; /* 虚线样式 */
       position: relative; /* 确保层叠上下文 */
       /* border-radius: 5px; */
       z-index: 1000; /* 确保高于父元素 */
       transition: transform 0.3s ease, background-color 0.3s ease, color 0.3s ease;
      will-change: transform;
}

    .dropdown li a:hover {
   transform: scale(1.1) translateY(-1px); /* 放大并上浮 */
     background-color: #0e3db1;
     color: white !important;
    }

main {
 margin-top: -15px; /* 确保内容不会被导航栏遮挡 */
 padding: 20px;
 margin-bottom: 10px;
 box-sizing: border-box; /* 如果没有设置 box-sizing，padding 会导致宽度超出 */
}

section {
 padding: 20px;
 border-bottom: 1px solid #ddd;
 box-sizing: border-box; /* 如果没有设置 box-sizing，padding 会导致宽度超出 */
}

/* 清除浮动影响 */
.clearfix::after {
  content: "";
  display: table;
  clear: both;
}
/* 响应式设计 */
@media (max-width: 768px) {
 .nav-list {
   flex-direction: column;
   background-color: rgba(255, 255, 255, 0.9);
   position: absolute;
   top: 60px;
   left: 0;
   width: 100%;
   display: none;
 }

 .nav-item {
   text-align: center;
   width: 100%;
   margin: 0;
 }

 .nav-item a {
   padding:  15px;
   
 }

 .navbar:hover .nav-list {
   display: flex;
 }
}


/*搜索框*/
#fdj{
    width: 30px;
    height: 30px;
    margin-left: -50px;
    margin-top: 5px;
   }

   #sousuo .dropdown .searchbox{
    display: flex;
    min-width: 280px;
    align-items: center; /* 垂直居中 */
    justify-content: space-between; /* 水平分布 */
    border-radius: 1px;
    border: 1px solid #cfcfcf;
    background-color: white;
   }
   #sousuo .dropdown .searchbox #key{
    height: 35px;
    width: 82%; /* 占据剩余空间 */
    margin-right: 10px; /* 与按钮的间距 */
    border: none;
    overflow: hidden;
   }
   #sousuo .dropdown .searchbox #key:focus {
            border-color:#0e3db1 ; /* 点击时边框颜色 */
            outline: none; /* 去掉默认的轮廓 */ 
        }
        
        #sousuo .dropdown .searchbox #btnSearch{
        border: none;
        background: none;  
        width: 5%; /* 按钮宽度占总宽度的 20% */
        margin-right: -8px;
        }



      /* 友情链接 */ 
      


      i {
        font-style: normal; /* 设置为正常字体，非斜体 */
    }


.nav-list #sousuo .dropdown{
  left: -250px;
}




.foot{
  margin-top: 30px;
  width: 100%;
  padding: 15px;
  background-color: #0e3db1;
  text-align: center;
 }
 
 .foot p{
  margin: 20px;
  font-size: 18px;
  color: #f6f6f6;
 }
 .foot p span{
  margin: 20px;
  font-size: 18px;
  color: #f6f6f6;
 }


 .swiper-caption h3 .lunbo11 {
  width: 100%;
  height: 90px;
}


/* 定义轮播文字动画 */
@keyframes slideUp {
  from {
      top: 0; /* 从底部开始 */
      opacity: 0; /* 初始透明度为0 */
  }
  to {
      top: 35%; /* 滑动到距离底部50%的位置 */
      opacity: 1; /* 最终透明度为1 */
  }
}

/* 定义特殊动画 */
@keyframes slideUpSpecial {
  from {
      top: 0; /* 从底部开始 */
      opacity: 0; /* 初始透明度为0 */
  }
  to {
      top: 26%; /* 滑动到距离底部28%的位置 */
      opacity: 1; /* 最终透明度为1 */
  }
}

.swiper-caption {
  position: absolute;
  color: rgba(248, 248, 255, 0.904);
  padding: 30px;
  border-radius: 5px;
  opacity: 0;
  transition: opacity 3s ease-in-out;
  top: 0; /* 初始位置在顶部 */
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.swiper-caption h3 img {
  width: 100%;
  height: 110px;
}

/* 当动画触发时 */
.swiper-caption.active {
  animation: slideUp 3s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;  /*使用更平滑的缓动函数 */
  /*  animation: slideUp 3s cubic-bezier(0.42, 0, 0.58, 1) forwards;/*使用更平滑的缓动函数，平滑加减速 */
/*  animation: slideUp 3s cubic-bezier(0.1, 0.7, 1, 1) forwards;/* 快速启动，缓慢结束 */
/*  animation: slideUp 3s cubic-bezier(0.4, 0, 0.2, 1) forwards;/* 缓慢启动，快速结束 */
}

/* 特殊 caption 动画 */
.swiper-caption.special-caption {
  animation: slideUpSpecial 3s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards; /* 使用更平滑的缓动函数 */
}


/* .swiper-caption.uplunbo11{
  top:28%;
} */