﻿/* 回到顶部按钮样式 */
.back-to-top {
    position: fixed;
    right: 20px;
    bottom: 20px;
    width: 50px;
    height: 50px;
    background-color: #3d4599;
    color: #fff;
    border: none;
    border-radius: 50%;
    font-size: 12px;
    cursor: pointer;
    display: none; /* 默认隐藏 */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
    transition: opacity 0.3s;
  }
  
  /* 悬停时的效果 */
  .back-to-top:hover {
    background-color: #242c7f;
  }

  /*------------*/
  body {
    min-width: 1280px;
    overflow-x: auto;
    background-color: #f8f8f8;
    background-image: url('/static/default/images/hbgbg.png'); 
    background-position: center calc(100% - 320px); 
    background-repeat: no-repeat;           
    background-size: auto;                 
}
/* 导航栏样式 */
.navbar {
  background: linear-gradient(to bottom, rgba(26, 35, 126, 0.6), rgba(26, 35, 126, 0)) !important; 
    transition: all 0.3s ease;
    position: absolute;
    width: 100%;
    z-index: 1000;
    padding-top: 2px;
    padding-bottom: 2px;
}

.navbar.scrolled {
  background: linear-gradient(to right, rgba(26, 35, 126, 1), rgba(106, 27, 154, 1)) !important;
    /* box-shadow: 0 2px 10px rgba(0,0,0,0.1); */
    position: fixed;
    padding-top: 2px;
    padding-bottom: 2px;
}

/* 轮播容器全屏 */
#mainCarousel {
    height: 68vh;
    overflow: hidden;
}

/* 轮播项设置 */
.carousel-item {
    height: 68vh;
    background: no-repeat center center;
    background-size: cover;
    transition: transform 0.5s ease-in-out;
}

/* 确保图片和背景同步滚动 */
.carousel-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    transition: opacity 0.5s ease-in-out; /* 添加透明度过渡 */
}

/* 覆盖默认指示器样式 */
.carousel-indicators [data-bs-target] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin: 0 8px;
    background-color: rgba(255,255,255,0.5);
    border: 2px solid transparent;
}

.carousel-indicators .active {
    background-color: white;
    border-color: white;
}
/* 默认隐藏 */
.slide-up {
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 1s ease-out, transform 1s ease-out;
  }
  
  /* 滚动触发后显示动画 */
  .slide-up.show {
    opacity: 1;
    transform: translateY(0);
  }
  
  
  /* 动画：从下往上滑入 + 渐显 */
  @keyframes slideUp {
    0% {
      opacity: 0;
      transform: translateY(50px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  /* 标题动画：延迟2秒出现 */
  .slide-up.title {
    font-size: 68px;
    margin-bottom: 60px;
    animation: slideUp 1s ease-out forwards;
    animation-delay: 0s;
  }
  
  /* 内容动画：标题出来后再等0.5秒出现 */
  .slide-up.content {
    font-size: 36px;
    margin-bottom: 160px;
    animation: slideUp 1s ease-out forwards;
    animation-delay: 0.5s;
  }
  
  
  
          /* 控制按钮样式 */
          .carousel-control-prev-icon,
          .carousel-control-next-icon {
              width: 3rem;
              height: 3rem;
              background-size: 100% 100%;
              filter: drop-shadow(0 0 2px rgba(0,0,0,0.5));
          }
  
          /* 内容区域 */
          section {
              /* padding: 100px 0; */
          }
  
  /* 导航栏基本样式 */
  .navbar-nav {
      list-style: none;
      padding: 0;
      margin: 0;
      display: flex;
      /* background-color: rgba(26, 54, 93, 0.6); */
  }
  
  .nav-item {
      position: relative;
  }
  
  .nav-link {
      color: white; /* 默认字体颜色为白色 */
      text-decoration: none;
      padding: 10px 15px;
      display: block;
      background-color: transparent; /* 默认无背景 */
      transition: background-color 0.3s, color 0.3s; /* 添加过渡效果 */
      margin-left: 6px;
      margin-right: 6px;
  }
  
  /* 鼠标悬停时导航项的样式 */
  .nav-item:hover > .nav-link {
      background-color: white; /* 导航项背景为白色 */
      color: #1a365d; /* 导航项字体颜色为红色 */
  }
  
  /* 下拉菜单样式 */
  .dropdown-menu {
      display: none; /* 默认隐藏 */
      position: absolute;
      top: 100%; /* 在父元素下方显示 */
      left: 0;
      background-color: white; /* 下拉菜单背景为白色 */
      min-width: 160px; /* 最小宽度 */
      z-index: 1000; /* 确保在下拉菜单在最上层 */
      padding: 2;
      margin: 0;
      list-style: none;
      border: 0px;
      border-radius: 0px;
      margin-left: 6px;
      margin-top: -3px;
  }
  
  .dropdown-menu .nav-link {
      color: #333; /* 下拉菜单字体颜色为红色 */
      padding: 10px 15px;
      display: block;
      background-color: white; /* 下拉菜单背景为白色 */
  }
  
  /* 鼠标悬停时保持下拉菜单项的背景和字体颜色 */
  .dropdown-menu .nav-link:hover {
      background-color: #f0f0f0; /* 下拉菜单项悬停时背景变为浅灰色 */
      color: #1a365d; /* 保持字体颜色为红色 */
      border-left: 2px solid #1a365d;
  }
  
  /* 鼠标悬停时显示下拉菜单 */
  .nav-item.dropdown:hover .dropdown-menu {
      display: block;
  }
  
  /* 鼠标移到下拉框时，保持导航项的白色背景 */
  .nav-item.dropdown:hover > .nav-link {
      background-color: white; /* 保持导航项的背景为白色 */
      color: #1a365d; /* 保持导航项的字体颜色为红色 */
  }
         /* 轮播容器 */
  .slider-container {
      width: 100%;
      max-width: 1280px;
      margin: 0 auto;
      overflow: hidden;
      /* border: 1px solid #ccc; */
  }
  
  /* 轮播内容 */
  .slider-wrapper {
      display: flex;
      transition: transform 0.5s ease-in-out;
  }
  
  /* 轮播项（替换为 slidertxt-item） */
  .slidertxt-item {
      flex: 0 0 25%; /* 每次显示四个 div */
      box-sizing: border-box;
      padding: 10px;
  }
  
  .slidertxt-itembox {
      height: 98px;
      text-align: center;
      display: flex;
      align-items: center; /* 垂直居中对齐 */
      justify-content: space-between; /* 水平分配空间 */
      border: 1px solid rgba(26, 35, 126, 1); /* 边框 */
      position: relative; /* 确保伪元素定位在这个容器内 */
      overflow: hidden; /* 确保背景不溢出 */
      color: #333; /* 默认文本颜色为黑色 */
      background-color: #fff; /* 默认背景色为白色 */
      transition: color 0.5s ease; /* 过渡效果 */
  }
  
  /* ::before 用来创建从下往上的背景 */
  .slidertxt-itembox::before {
      content: '';
      position: absolute;
      bottom: 0; /* 放置在容器的底部 */
      left: 0;
      width: 100%;
      height: 0; /* 初始高度为 0 */
      background-color: rgba(26, 35, 126, 1); /* 背景颜色 */
      transition: height 0.5s ease; /* 背景高度的过渡动画 */
      z-index: 0; /* 确保背景在最底层 */
  }
  
  /* 鼠标悬停时，背景从下往上扩展 */
  .slidertxt-itembox:hover::before {
      height: 100%; /* 背景高度扩展至容器的100% */
  }
  
  /* 鼠标悬停时的文本颜色变化 */
  .slidertxt-itembox:hover .timea,
  .slidertxt-itembox:hover .timeb,
  .slidertxt-itembox:hover .listiteminfo a {
      color: #fff; /* 鼠标悬停时，文本颜色变为白色 */
  }
  
  .div-slidertxt-itembox {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%;
      position: relative;
      z-index: 1; /* 确保文本和元素在背景上方 */
  }
  
  .timebox {
      width: 68px;
      height: 98px;
      text-align: center;
      border-right: 1px solid rgba(26, 35, 126, 1);
      border-left: 3px solid rgba(26, 35, 126, 1);
  }
  
  .timea {
      width: 58px;
      font-size: 28px;
      margin-top: 16px;
      font-weight: bold;
      color: rgba(26, 35, 126, 1); /* 默认文字颜色 */
  }
  
  .timeb {
      font-size: 12px;
      color: rgba(26, 35, 126, 1); /* 默认文字颜色 */
  }
  
  .listiteminfo {
      text-align: left;
      padding-left: 12px;
      flex-grow: 1; /* 让列表项扩展以填充剩余空间 */
  }
  
  .listiteminfo a {
      font-size: 16px;
      color: #333; /* 默认文字颜色 */
      text-decoration: none;
      transition: color 0.3s ease; /* 文字颜色变化过渡 */
  }
  
  
  
  
  
  /* 数字按钮 */
  .slider-controls {
      text-align: center;
      margin-top: 10px;
  }
  
  .slider-controls button {
      margin: 5px;
      /* padding: 5px 5px; */
      cursor: pointer;
      background-color: rgba(123, 31, 126, 0.6);
      color: white;
      border: none;
      border-radius: 11px;
      height: 22px;
      width: 22px;
      font-size: 12px;
  }
  
  .slider-controls button:hover {
    background-color: rgba(123, 31, 126, 0.8);
  }
  
  .slider-controls button.active {
    background-color: rgba(123, 31, 126, 0.8);
  }
  .box_info{margin-bottom: 68px;}
  
  /*title*/
  .title-container {
      display: flex;
      justify-content: space-between;
      align-items: center;
      max-width: 1200px;
      /* margin: 20px auto; */
      /* padding: 0 15px; */
      margin-bottom: 30px;
  }
  
  .title-container3 {
    padding: 8px;
    border-bottom: 2px solid rgba(26, 35, 126, 1);
    background-color:  rgba(26, 35, 126, 1);
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2px;
}
  .title-text {
      font-size: 32px;
      /* font-weight: 600; */
      color: #333;
      margin: 0;
      border-bottom: 2px solid rgba(26, 35, 126, 1);  /* 2px实线边框 */
      padding-bottom: 3px;           /* 文字与边框间距 */
      display: inline-block;         /* 使边框长度自适应文字 */
  }
  .title-text3 {
    font-size: 22px;
    /* font-weight: 600; */
    color: #fff;
    margin: 0;
    padding-bottom: 3px;           /* 文字与边框间距 */
    display: inline-block;         /* 使边框长度自适应文字 */
    text-align: left;
}
  
  .more-icon {
      display: flex;
      gap: 4px;
      cursor: pointer;
      padding: 8px;
      transition: all 0.3s ease;
  }
  
  .more-icon:hover {
      opacity: 0.8;
  }
  
  .more-icon span {
      display: block;
      width: 4px;
      height: 4px;
      background-color: #666;
      border-radius: 50%;
  }
  
  .more-link {
      display: flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
      color: #666;
      transition: all 0.3s ease;
      position: relative;
      padding: 6px 12px;
      border-radius: 4px;
      padding: 8px;
  }
  
  /**/
  .list-container {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
    border-bottom: 1px solid #cccccc;  /* 2px实线边框 */
    padding: 18px;
  }
  .list-container:hover {
    background-color: #f0f0f0;
  }
  .listtime {
    white-space: nowrap;
    color: #fff;
    font-size: 14px;
    border-radius:12px;
    background-color: #5b36bf;
    padding: 3px;
    padding-left: 8px;
    padding-right: 8px;
  }
  
  .listtitle {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 18px;
    padding-left: 20px;
  }
  
  .listtitle a {
    color: #333;
    text-decoration: none;
    font-size: 18px;
  }
  
  .listtitle a:hover {
    color:rgba(26, 35, 126, 1);
  }
  /*---*/
  .list-container2 {
    align-items: center;
    margin-bottom: 8px;
    border-bottom: 1px solid #cccccc;  /* 2px实线边框 */
    padding: 12px;
  }
  .list-container2:hover {
    background-color: #f0f0f0;
  }
  .listtime2 {
    white-space: nowrap;
    color: #616060;
    font-size: 14px;
    border-radius:12px;
    background-color: #dfe2fc;
    padding: 3px;
    padding-left: 8px;
    padding-right: 8px;
  }

  .list-container3 {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    border-bottom: 1px solid #ffffff;  /* 2px实线边框 */
    padding: 8px;
  }
  .list-container3:hover {
    background-color: #f0f0f0;
  }
  .listtime3 {
    float:left;
    white-space: nowrap;
    color: #616060;
    font-size: 14px;
    border-radius:5px;
    background-color: #ffffff;
    padding: 3px;
    padding-left: 3px;
    padding-right: 3px;
    width: 98px;
  }
  
  .listtitle2 {
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 18px;
    padding-left: 10px;
    margin-bottom: 8px;
  }
  .listdescription2 {
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 14px;
    color: #666;
    padding-left: 10px;
  }
  
  .listtitle2 a {
    color: rgba(26, 35, 126, 1);
    text-decoration: none;
    font-size: 18px;
  }
  
  .listtitle2 a:hover {
    color:rgba(26, 35, 126, 1);
  }


  .listtitle3 {
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 14px;
    padding-left: 10px;
    margin-bottom: 8px;
    text-align: left;
  }
  
  .listtitle3 a {
    color: rgba(26, 35, 126, 1);
    text-decoration: none;
    font-size: 14px;
  }
  
  .listtitle3 a:hover {
    color:rgba(26, 35, 126, 1);
  }
  
  /*-----*/
  .list3-container {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
    border-bottom: 1px solid #cccccc;  /* 2px实线边框 */
    padding: 18px;
  }
  .list3-container:hover {
    background-color: #f0f0f0;
  }
  .list3time {
      width: 58px;
    white-space: nowrap;
    color: #5b36bf;
    font-size: 14px;
    border-top-left-radius:8px;
    border-bottom-right-radius:8px;
    padding: 3px;
    padding-left: 8px;
    padding-right: 8px;
    border: 1px solid #5b36bf;  /* 2px实线边框 */
  }
  
  .list3title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 18px;
    padding-left: 20px;
  }
  
  .list3title a {
    color: #333;
    text-decoration: none;
    font-size: 18px;
  }
  
  .list3title a:hover {
    color:rgba(26, 35, 126, 1);
  }
  
  /**/
  .foot_icon2{
      border-bottom: 1px solid #3d4599;  /* 2px实线边框 */
      margin-bottom: 12px;
      padding-bottom: 12px;
  
  }
  .foot_icon3{
      color: #ded5f5;
      font-size: 12px;
      position: relative;
      display: inline-block;
      text-align: center;
      border: #fff solid 1px;
      height: 60px;
      width: 60px;
      border-radius: 30px;
      margin-top: 32px;
      padding-top: 12px;
  }
      /* 隐藏二维码 */
  .qrcode {
    display: none;
    position: absolute;
    bottom: 100%; /* 显示在上方 */
    left: 50%;
    transform: translateX(-50%);
    width: 120px;
    padding: 5px;
    background: #fff;
    border: 1px solid #ccc;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    z-index: 10;
    margin-bottom: 20px;
  }
  
  /* 二维码图片样式 */
  .qrcode img {
    width: 100%;
    height: 100%;
    max-width: 120px;
    max-height: 120px;
  }
  
  /* 鼠标悬停时显示二维码 */
  .foot_icon3:hover .qrcode {
    display: block;
  }
  .foot_text2{
      padding: 12px;
      font-size: 14px;
      color: #a9aab8;
      line-height: 26px;
      text-align: left;
      padding-left: 60px;
  }
  
  
  
  .icon_item {
    display: flex;
    color: #242c7f;
    font-size: 58px;
    border: 1px solid #3d4599;
    text-align: center;
    align-items: center; /* 垂直居中 */
    justify-content: center; /* 水平居中（可选） */
    padding-top: 20px;
    padding-bottom: 20px;
    transition: background-color 0.2s, color 0.2s;
  }
  
  /* 鼠标悬停效果 */
  .icon_item:hover {
    background-color: #3d4599;
    color: #fff;
  }
  
  .foot_link{
      line-height: 32px;
      text-align: left;
      font-size: 12px;
  }
  .foot_link a{
      font-size: 12px;
      line-height: 32px;
      text-decoration: none;
      margin-right: 20px;
      color: #ccc;
      text-align: left;
  }
  
  /*search*/
  /* 搜索容器 */
  .search-container {
      position: relative;
      display: inline-block;
  }
  
  /* 搜索图标 */
  .bi-search {
      cursor: pointer; /* 鼠标悬停时显示手型 */
      transition: color 0.3s ease; /* 添加颜色过渡效果 */
  }
  
  /* 搜索框 */
  /* 搜索容器 */
  .search-container {
      position: relative;
      display: inline-block;
  }
  
  /* 搜索图标 */
  .bi-search {
      cursor: pointer; /* 鼠标悬停时显示手型 */
      transition: color 0.3s ease; /* 添加颜色过渡效果 */
  }
  
  /* 搜索框和按钮的容器 */
  .search-box-wrapper {
      position: absolute;
      top: 100%; /* 将搜索框和按钮放在图标的下方 */
      left: 50%; /* 水平居中 */
      transform: translateX(-80%); /* 水平居中 */
      display: flex; /* 使用 Flex 布局 */
      align-items: center; /* 垂直居中 */
      width: 0; /* 初始宽度为0 */
      overflow: hidden; /* 隐藏超出部分 */
      opacity: 0; /* 初始透明度为0 */
      visibility: hidden; /* 初始隐藏 */
      transition: width 0.3s ease, opacity 0.3s ease; /* 添加过渡效果 */
  }
  
  /* 搜索框 */
  .search-box {
      flex: 1; /* 占据剩余空间 */
      padding: 5px 10px; /* 内边距 */
      border: none;
      outline: none;
      background-color: rgba(255, 255, 255, 0.8); /* 背景颜色 */
      color: rgb(21, 49, 115);
      font-size: 14px;
      border-radius: 4px 0 0 4px; /* 左侧圆角 */
  }
  
  /* 搜索按钮 */
  .search-button {
      padding: 5px 10px; /* 内边距 */
      border: none;
      outline: none;
      background-color: #ffcc00; /* 按钮背景颜色 */
      color: white;
      font-size: 14px;
      cursor: pointer; /* 鼠标悬停时显示手型 */
      border-radius: 0 4px 4px 0; /* 右侧圆角 */
      transition: background-color 0.3s ease; /* 添加颜色过渡效果 */
  }
  
  /* 鼠标悬停时显示搜索框和按钮 */
  .search-container:hover .search-box-wrapper {
      width: 300px; /* 搜索框和按钮的总宽度 */
      opacity: 1; /* 完全显示 */
      visibility: visible; /* 显示 */
  }
  
  /* 鼠标悬停时图标颜色变化 */
  .search-container:hover .bi-search {
      color: #ffcc00; /* 图标颜色变化 */
  }
  
  /* 鼠标悬停时按钮背景颜色变化 */
  .search-button:hover {
      background-color: #e6b800; /* 按钮背景颜色变化 */
  }



/*areicle*/
.breadcrumb {
  /* background-color: #ffffff;  */
  margin-top: 20px;
  margin-bottom: 20px;
}
.breadcrumb-items {
  color: #333; /* 修改 breadcrumb-item 的文字颜色 */
  font-size: 14px;
  padding-right: 12px;
}
.breadcrumb-item {
  color: #333; /* 修改 breadcrumb-item 的文字颜色 */
  font-size: 14px;
}
.breadcrumb-item a {
  color: #333; /* 修改链接文字颜色 */
  font-size: 14px;
  text-decoration: none;
}
.breadcrumb-item.active {
  color: #333; /* 修改激活（当前页面）的 breadcrumb-item 的文字颜色 */
}
.breadcrumb-item.active a {
  color: #333; /* 修改激活（当前页面）的链接文字颜色 */
}
.articlebody{}

.articleitemtitle{
  font-size: 28px;
  line-height: 68px;
  border-bottom: 1px solid #f0f0f0;
  text-align: center;
  margin-top: 12px ;
}
.articlepar{padding: 28px;}
.articlecontent{
  text-align: left;
  min-height: 512px;
  padding: 58px;
  color: #666666;
}




/*Page*/
.pagination {
  display: flex;
  justify-content: center;
}

.pagination .page-item {
  margin: 0 5px; /* 调整页码项之间的间距 */
  list-style-type: none; /* 去除默认的列表样式 */
  margin-left: 6px;
  margin-right: 6px;
}

.pagination .page-link {
  color: #242c7f; /* 链接文本颜色 */
  border: 1px solid #dee2e6; /* 边框样式 */
  padding: 8px 16px; /* 调整内边距 */
  text-decoration: none; /* 去除下划线 */
  transition: background-color 0.3s ease; /* 过渡效果 */
}

.pagination .page-link:hover {
  background-color: #f0f0f0; /* 鼠标悬停时的背景色 */
}

.pagination .page-item.disabled .page-link {
  color: #6c757d; /* 禁用状态的文本颜色 */
  pointer-events: none; /* 禁止点击 */
  cursor: default; /* 鼠标指针样式 */
}

.pagination .page-item.active .page-link {
  background-color: #242c7f; /* 激活状态的背景色 */
  color: white; /* 激活状态的文本颜色 */
  border-color: #242c7f; /* 激活状态的边框颜色 */
}

.hover-background {
  transition: background-color 0.3s ease; /* 添加过渡效果 */
}

.hover-background:hover {
  background-color: #f9f6fbf6; /* 鼠标悬停时的背景色 */
}


/*图片样式*/
.img-container {
  overflow: hidden; /* 隐藏超出部分 */
  position: relative;
  border-radius: 0px;
}

.img-container img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* 让图片根据容器尺寸缩放且不变形 */
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 0px;
}