﻿ .custom-container {
   /* width: 100%; */
   max-width: 1440px;
   /* padding-right: 15px;
   padding-left: 15px; */
   margin-right: auto;
   margin-left: auto;
 }

 .custom-container .row3 {
   display: flex;
   justify-content: center;
   margin-left: auto;
   margin-right: auto;
 }

 .custom-container .row3 .col-md-1,
 .custom-container .row3 .col-md-2 {
   /* If you want to maintain a fixed gap between the columns, you can specify a margin here */
   margin: 0 5px;
   /* Adjust the 15px to increase or decrease the space between columns */
 }

 /* Ensure the image column also centers its content */
 .custom-container .row3 .col-md-2 {
   display: flex;
   justify-content: center;
   /* This will center the image horizontally in the last column */
   align-items: center;
   /* This will center the image vertically in the last column */
 }

 /* 增加左列的右边距 */
 .custom-container .row3 .col-md-6 {
   margin-right: 40px;
   /* 或者你需要的值 */
 }


 /* Make sure the footer expands to the width it needs */
 footer.bg-dark {
   width: 100%;
 }

 .custom-container-index {
   max-width: 1440px;
   margin: 0 auto;
   /* border: 1px solid red; */
   /* 居中显示 */
   /* padding: 0 20px; */
   /* 左右留出空白
      /* width: 100%;
      padding-right: 0;
      padding-left: 0;
      margin-right: auto;
      margin-left: auto; */
 }

 /* CSS */
 .custom-margin {
   margin-bottom: 3rem;
   /* 或者使用您需要的任何尺寸 */
 }

 .row {
   /* border: 1px solid red; */
   background-color: #ffffff;
   /* 设置背景色为白色 */
 }

 .card {
   min-height: 220px;
   /* 根据实际需要调整这个值 */
 }

 .col-md-1,
 .col-md-2,
 .col-md-3,
 .col-md-4,
 .col-md-6,
 .col-md-8,
 .col-md-9,
 .col-md-10,
 .col-sm-6 {
   /* border: 2px solid rgb(0, 89, 255); */
 }

 .row2 {

   margin-right: 0;
   margin-left: 0;
 }

 .row3 {
   margin-right: 0;
   margin-left: 0;
   background-color: transparent;
   /* 设置背景色为透明 */
 }

 .row4 {

   background-color: #f5f5f5ce;
 }

 /* 自定义样式 */
 .sidebar img {
   width: 100%;
   /* 使图片在其容器内宽度自适应 */
   height: auto;
   /* 保持图片的原始宽高比 */
 }

 .content-image img {
   /* width: 100%; */
   /* 使图片在其容器内宽度自适应 */
   max-width: 100%;
   /* 最大宽度为容器宽度，不超过图片原始尺寸 */
   height: auto;
   /* 保持图片的原始宽高比 */
 }

 /**只能缩小不能放大**/
 .col-md-1.content-image3 img {
   /* width: 100%; */
   /* 使图片在其容器内宽度自适应 */
   max-width: 100%;
   /* 最大宽度为容器宽度，不超过图片原始尺寸 */
   max-height: 100%;
   /* 最大高度为容器高度，不超过图片原始尺寸 */
   height: auto;
   /* 保持图片的原始宽高比 */
 }


 .content-image2 img {
   width: auto;
   /* 使图片在其容器内宽度自适应 */
   height: 100%;
   /* 保持图片的原始宽高比 */
 }

 .img-fluid {
   max-width: 100%;
   height: auto;
 }

 .footer-logo img {
   width: auto;
   /* 自动调整宽度 */
   height: 50px;
   /* 高度固定，保持品牌一致性 */
 }

 .text-content {
   padding: 15px;
   /* 文本内容的内间距 */
 }

 .bold-text {
   font-weight: bold;
   /* 加粗文本 */
   color: #000;
   /* 黑色文本 */
   font-size: 16px;
   /* 16像素的字号 */
 }

 .light-text—0 {
   font-weight: normal;
   /* 普通字体 */
   color: #333;
   /* 深灰色 */
   font-size: 16px;
   /* 16像素的字号 */
 }

 .light-text {
   font-weight: normal;
   /* 普通字体 */
   color: #777;
   /* 浅色文本 */
   font-size: 16px;
   /* 16像素的字号 */
 }

 .table-image {
   width: 100%;
   /* 使图片宽度自适应容器宽度 */
   height: auto;
   /* 保持图片的原始宽高比 */
   margin-top: 20px;
   /* 图片上方间隔 */
   margin-bottom: 20px;
   /* 图片下方间隔 */
 }

 /* 修改横幅样式 */
 .banner {
   max-width: 1440px;
   padding-left: 15px;
   /* 根据需要调整 */
   padding-right: 15px;
   /* 根据需要调整 */
 }

 .banner img {
   width: calc(100% - 30px);
   /* 减去左右内边距的宽度 */
   height: auto;
   display: block;
 }

 /* 全屏宽度容器的样式 */
 .container-fluid {
   padding-right: 0;
   padding-left: 0;
   margin-right: auto;
   margin-left: auto;
 }

 /* 导航链接的自定义样式 */
 .nav-link {
   transition: border-bottom 0.3s ease-in-out;
   /* 平滑的过渡效果 */
 }

 /* 导航栏激活状态的样式 */
 .nav-link.active {
   border-bottom: 3px solid red;
 }

 /* 自定义导航栏容器样式，只影响导航栏 */

 .navbar-container {
   max-width: 85%;
   /* padding-left: 2rem ;
   padding-right: 2rem; */
   margin-left: auto;
   margin-right: auto;
 }

 /* 对于中等屏幕设备 */
 @media (max-width: 1700px) {
   .navbar-container {
     max-width: 100%;
   }

   .navbar-nav .nav-item {
     margin-right: 15px;
     /* 右边距为15px */
   }

   .navbar-nav .nav-item:not(:last-child) {
     margin-right: 15px;
     /* 右边距为15px */
   }
 }

 .navbar-nav .nav-link:hover {
   color: #6c757d !important;
   /* 设置鼠标滑过时的文本颜色为灰色 */
 }

 /* 增加左侧图片区域与右侧文本区域之间的间距 */
 .sidebar {
   margin-right: 30px;
   /* 或者您希望的间距大小 */
 }

 /* 增加导航选项之间的间距 */
 .navbar-nav .nav-item {
   margin-right: 35px;
   /* 右边距为15px */
 }

 /* 如果您想在最后一个项目后不添加间距，可以使用 :not() 选择器和 :last-child 伪类 */
 .navbar-nav .nav-item:not(:last-child) {
   margin-right: 35px;
   /* 右边距为15px */
 }

 /* 下拉菜单样式，居中对齐下拉菜单 */
 .navbar-nav .nav-item.dropdown .dropdown-menu {
   /* width: 150px !important;
   padding: 5px 0 !important; */
   margin-top: 0;
   left: 50%;
   transform: translateX(-50%);
   text-align: center;
 }

 /* 下拉菜单项样式 */
 .navbar-nav .nav-item.dropdown .dropdown-menu .dropdown-item {
   white-space: nowrap;
   width: auto;
 }

 /* 鼠标悬停时显示下拉菜单 */
 .navbar-nav .nav-item.dropdown:hover .dropdown-menu {
   display: block;
 }

 /* 下拉菜单项在悬停时的样式 */
 .dropdown-menu .dropdown-item:hover,
 .dropdown-menu .dropdown-item:focus {
   background-color: red;
   color: white;
 }

 .active-dropdown-item,
 .dropdown-item.active {
   background-color: red !important;
   /* 确保使用 !important 来覆盖任何其他样式 */
   color: white !important;
 }

 /* 下拉菜单文本居中（如果需要） */
 .dropdown-menu .dropdown-item {
   text-align: center;
   /* 文本居中 */
   display: block;
   /* 使链接填满整个菜单项，便于点击 */
 }

 .nav-link {
   margin-bottom: 0;
   /* 其他样式 */
 }

 .row.no-gutters {
   margin-right: 0;
   margin-left: 0;
 }

 .row.no-gutters>[class^="col-"],
 .row.no-gutters>[class*=" col-"] {
   padding-right: 0;
   padding-left: 0;
 }

 ul.list-unstyled {
   list-style-type: none;
   /* 移除默认列表符号 */
   padding-left: 0;
   /* 移除默认列表内边距 */
   margin-top: -3px;
   /* 微调整个列表的顶部边距，可能需要根据小红点的大小进行调整 */
 }

 ul.list-unstyled li {
   position: relative;
   /* 设置相对定位，作为小红点的定位参照 */
   padding-left: 20px;
   /* 左侧填充足够空间放置小红点和文本缩进 */
   margin-top: -1px;
   /* 微调每个列表项的顶部边距，可能需要根据小红点的大小进行调整 */
   line-height: 1.5;
   /* 根据小红点的大小调整行高 */
 }

 ul.list-unstyled li .bullet {
   position: absolute;
   /* 绝对定位，脱离文本流，可以放置在特定位置 */
   top: 10%;
   /* 顶部对齐，设置为50%使其垂直居中于行高 */
   margin-top: 0px;
   /* 向上偏移半个小红点的高度，根据小红点的高度进行调整 */
   left: 0;
   /* 左侧对齐，根据实际需要调整 */
   width: 10px;
   height: 10px;
   background-color: red;
   border-radius: 50%;
   margin-right: 5px;
 }

 body {
   background-color: #FBFBFB;
   /* 这里设置为你想要的灰色 */
 }

 .custom-container footer ul {
   padding-left: 0;
 }

 .custom-container footer ul li {
   list-style-type: none;
   font-size: 0.83em;
   /* 1 less than the font-size of h6 */
 }

 .custom-container footer h6 {
   margin-bottom: 0.5rem;
   /* Adjust as needed */
   margin-bottom: 1.5rem;
 }



 .custom-container footer .custom-list {
   padding-left: 0;
   /* 移除默认的左边距 */
 }

 .custom-container footer .custom-list li {
   list-style-type: none;
   /* 移除默认的列表标记 */
   margin-left: -1.3rem;
   /* 补偿移除的默认左边距 */
   margin-bottom: 0.8rem;
   /* 调整此值以控制列表项之间的垂直间距 */
 }

 .content-image {
   flex: 1;
   /* 元素占据剩余空间 */
 }

 .content-image2 {
   display: flex;
   align-items: flex-start;
 }

 .image-wrapper {
   width: auto;
   /* 设置图片容器的宽度为自动 */
 }

 .image-wrapper img {
   max-width: 100%;
   /* 设置图片最大宽度为100%，以防止图片放大 */
   height: auto;
   /* 高度自适应 */
 }

 /* 在小于或等于768像素宽的屏幕上应用样式 */
 @media (max-width: 1000px) {
   .navbar-nav .dropdown-menu {
     position: absolute;
     left: 50%;
     transform: translateX(-50%);
   }


 }

 /* 默认字号 */
 .text-custom-size {
   font-size: 16px;
   /* 默认字号 */
 }

 /* 针对小屏幕的媒体查询 */
 @media (max-width: 767.98px) {
   .text-custom-size {
     font-size: 10px;
     /* 小屏幕上的字号 */
   }
 }

 /* 小屏幕样式 */
 @media (max-width: 767.98px) {

   .row3 .col-md-6,
   .row3 .col-md-2 {
     /* 强制小屏幕上的文本居中对齐 */
     justify-content: center !important;
   }
     #myVideo2 {
   width: 100%;
   /* Adjust based on your preference */
   height: auto;
 }

 }

 /* 自定义面包屑导航链接样式 */
 .breadcrumb {
   background-color: transparent;
   /* 设置面包屑导航背景色为透明 */
 }


 /* 自定义面包屑导航链接样式 */
 .breadcrumb-item a {
   color: #6c757d;
   /* 设置链接字体颜色为灰色 */
   text-decoration: none;
   /* 可选：去除链接下划线 */
 }

 /* 自定义分隔符样式 */
 .breadcrumb-item+.breadcrumb-item::before {
   content: ">";
   padding: 0 5px;
   color: #6c757d;
   /* 设置分隔符颜色为灰色 */
 }

 /* 视频样式 */
 #fullscreen-video {
   position: fixed;
   top: 50px;
   /* 与导航栏底部对齐 */
   left: 0;
   width: 100%;
   height: calc(100% - 50px);
   /* 剩余高度填满 */
   object-fit: cover;
   z-index: 9999;
   display: none;
   /* 初始隐藏 */
 }

 /* 将视频定位到页面顶部，使其覆盖整个屏幕 */

 #fullscreen-video {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
   z-index: 9999;
   display: none;
   /* 初始隐藏 */
 }

 #videoContainer {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: black;
   display: none;
   /* initially hidden */
   justify-content: center;
   align-items: center;
   z-index: 9999;
 }
  #videoContainer2 {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: black;
   display: none;
   /* initially hidden */
   justify-content: center;
   align-items: center;
   z-index: 9999;
 }

 #myVideo {
   width: 90%;
   /* Adjust based on your preference */
   height: auto;
 }



#closeBtn {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 40px;
  height: 40px;
  background: rgba(0, 0, 0, 0.4);
  border-radius: 50%;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

#closeBtn::before,
#closeBtn::after {
  content: '';
  position: absolute;
  width: 25px;
  /* X图标大小 */
  height: 3px;
  /* X图标粗细 */
  background-color: white;
}

#closeBtn::before {
  transform: rotate(45deg);
}

#closeBtn::after {
  transform: rotate(-45deg);
}
