html, body {
  /* 设置html和body元素的宽度和高度为视口的100%，确保内容填满整个页面 */
  width: 100%; /* 设置宽度为100% */
  height: 100%; /* 设置高度为100% */
  margin: 0; /* 去掉默认的外边距 */
  padding: 0; /* 去掉默认的内边距 */
  background: rgba(14, 18, 45, 1); /* 设置背景颜色为深蓝色 */
}

.titleText {
  /* 标题文字的样式 */
  font-size: 24px; /* 调整字体大小为24px */
  font-family: PingFang-SC-Medium; /* 使用PingFang-SC-Medium字体 */
  font-weight: 500; /* 设置字体粗细为500（中等粗细） */
  color: rgba(27, 146, 253, 1); /* 设置字体颜色为亮蓝色 */
}

.main {
  /* 主容器的样式 */
  width: 100%; /* 设置宽度为100% */
  height: 100%; /* 设置高度为100% */
  margin-left: auto; /* 左外边距自动，以居中对齐 */
  margin-right: auto; /* 右外边距自动，以居中对齐 */
  min-width: 1560px; /* 设置最小宽度为1560px */
}

.main .header {
  /* 头部区域的样式 */
  position: relative; /* 相对定位，用于内部绝对定位的子元素 */
  width: 100%; /* 设置宽度为100% */
  height: 140px; /* 设置高度为140px */
  display: flex; /* 使用Flexbox布局 */
  align-items: center; /* 垂直居中对齐 */
  justify-content: center; /* 水平居中对齐 */
}

.main .header .dateBox {
  /* 日期容器的样式 */
  width: 363px; /* 设置宽度为363px */
  position: absolute; /* 绝对定位，位置相对于父元素 */
  right: 10px; /* 右边距10px */
}

.main .header .dateBox span {
  /* 日期文本的样式 */
  font-size: 20px; /* 调整字体大小为20px */
  font-family: HiraginoSansGB-W3; /* 使用HiraginoSansGB-W3字体 */
  font-weight: normal; /* 正常字体粗细 */
  color: rgba(255, 255, 255, 1); /* 设置字体颜色为白色 */
}

.main .content .middleBox .baiduMap {
  /* 中间区域百度地图的样式 */
  height: 925px; /* 设置高度为925px */
  background: rgba(50, 72, 106, 0.2); /* 设置背景颜色和透明度 */
  position: relative; /* 相对定位，用于内部绝对定位的子元素 */
}

.main .content .middleBox .baiduMap #container {
  /* 百度地图容器的样式 */
  height: 925px; /* 设置高度为925px */
  border: 1px solid rgba(27, 146, 253, 0.5); /* 设置边框为1px实线，颜色为半透明蓝色 */
}

.anchorBL {
  /* 隐藏锚点的样式 */
  display: none; /* 不显示元素 */
}

.listhead {
  /* 列表头部的样式 */
  height: 55px; /* 设置高度为55px */
  display: flex; /* 使用Flexbox布局 */
  justify-content: space-between; /* 水平分布内容 */
}

.listnav {
  /* 列表内容区域的样式 */
  height: calc(925px - 55px); /* 高度为总高度925px减去listhead的高度55px */
}

.listnav ul li {
  /* 列表项的样式 */
  display: flex; /* 使用Flexbox布局 */
  justify-content: space-between; /* 水平分布内容 */
  height: 55px; /* 设置高度为55px */
}

.listhead span,
.listnav li span {
  /* 列表头部和列表项文本的样式 */
  width: 100%; /* 宽度为100% */
  align-items: center; /* 垂直居中对齐 */
  justify-content: center; /* 水平居中对齐 */
  display: flex; /* 使用Flexbox布局 */
  font-size: 16px; /* 调整字体大小为16px */
  height: 55px; /* 设置高度为55px */
}

.listhead2 span {
  /* 列表头部第二部分文本的样式 */
  font-size: 28px; /* 调整字体大小为28px */
  color: #3486da; /* 设置字体颜色为蓝色 */
  border-bottom: 1px solid #0c2854; /* 设置底部边框为1px实线，颜色为深蓝色 */
  font-weight: bold; /* 设置字体为粗体 */
}

.listnav2 ul li:nth-child(odd) {
  /* 列表项的背景色样式（奇数项） */
  background: #0c2854; /* 设置背景色为深蓝色 */
}

.text-green {
  /* 绿色文本的样式 */
  color: #00ea37; /* 设置字体颜色为绿色 */
}

.text-red {
  /* 红色文本的样式 */
  color: #ff0006; /* 设置字体颜色为红色 */
}

.scrollDiv {
  /* 可滚动内容区域的样式 */
  overflow-y: auto; /* 垂直方向自动滚动 */
  height: calc(925px - 55px); /* 高度为总高度925px减去listhead的高度55px */
}

::-webkit-scrollbar {
  /* 自定义滚动条的宽度 */
  width: 5px; /* 设置宽度为5px */
  height: 5px; /* 设置高度为5px */
}

::-webkit-scrollbar-thumb {
  /* 自定义滚动条的滑块样式 */
  background-color: #5bc0de; /* 设置滑块的背景颜色为蓝色 */
}

::-webkit-scrollbar-track {
  /* 自定义滚动条的轨道样式 */
  background-color: #ddd; /* 设置轨道的背景颜色为浅灰色 */
}

.boxall {
  /* 外部容器的样式 */
  height: calc(100% - 0.25rem); /* 设置高度 */
  padding: 0; /* 去掉内边距 */
  border: 0.5px solid rgb(146, 146, 148); /* 添加边框，边框宽度为0.5px */
  box-sizing: border-box; /* 确保边框不会影响总高度 */
}

.tit04 {
  /* 标题的样式 */
  color: #ff0006; /* 设置字体颜色为红色 */
  text-align: center; /* 水平居中对齐 */
  font-size: 24px; /* 字体大小示例 */
  font-family: Arial, sans-serif; /* 字体示例 */
  font-weight: bold; /* 字体粗细示例 */
}

.boxnav {
  /* 导航区域的样式 */
  padding: 0 10px; /* 设置内边距 */
}

.listhead {
  /* 列表头部的样式 */
  height: 55px; /* 设置高度 */
  display: flex; /* 使用Flexbox布局 */
  justify-content: space-between; /* 水平分布内容 */
  align-items: center; /* 垂直居中对齐 */
  background: #385a91; /* 设置背景色为深蓝色 */
  color: #ffffff; /* 设置字体颜色为白色 */
}

.listhead span {
  /* 列表头部中的文本样式 */
  font-size: 18px; /* 设置字体大小 */
  flex: 1; /* 使每个span均等分配空间 */
  text-align: center; /* 文本居中对齐 */
}

.listnav {
  /* 列表内容区域的样式 */
  height: calc(100% - 55px); /* 设置高度为总高度减去列表头部高度 */
  overflow-y: auto; /* 垂直方向自动滚动 */
}

.listnav ul.smjl {
  /* 列表项的样式 */
  list-style: none; /* 去掉默认的列表样式 */
  padding: 0; /* 去掉内边距 */
  margin: 0; /* 去掉外边距 */
}

.listnav ul.smjl li {
  /* 列表项的样式 */
  display: flex; /* 使用Flexbox布局 */
  justify-content: space-between; /* 水平分布内容 */
  height: 55px; /* 设置高度 */
  padding: 0 10px; /* 设置内边距 */
  border-bottom: 1px solid #ddd; /* 设置底部边框颜色 */
}

.listnav ul.smjl li span {
  /* 列表项中的文本样式 */
  font-size: 18px; /* 设置字体大小 */
  flex: 1; /* 使每个span均等分配空间 */
  text-align: center; /* 文本居中对齐 */
}

.text-green {
  /* 绿色文本的样式 */
  color: #00ea37; /* 设置字体颜色为绿色 */
}

.text-red {
  /* 红色文本的样式 */
  color: #ff0006; /* 设置字体颜色为红色 */
}