﻿@charset "utf-8";
/* 声明CSS文档使用的字符编码为UTF-8 */
/* CSS Document */
<!-- -->

/* 页面整体样式设置 */
body {
	background: #0948b3; /* 页面背景色设置为深蓝色 */
	margin:0; /* 清除默认外边距 */
	padding:0; /* 清除默认内边距 */
	font-size: 14px; /* 全局字体大小设置为14px */
}

/* 遮罩层容器样式 */
.mask-overlay {
  position: relative; /* 相对定位，作为遮罩层的父容器 */
}

/* 遮罩层效果实现 */
.mask-overlay::before {
  content: ""; /* 伪元素必须设置content属性 */
  position: absolute; /* 绝对定位，覆盖整个容器 */
  top: 0; /* 顶部对齐 */
  left: 0; /* 左侧对齐 */
  width: 100%; /* 宽度占满父容器 */
  height: 100%; /* 高度占满父容器 */
  background: rgba(0, 0, 0, 0.5); /* 黑色半透明背景（透明度50%） */
  z-index: 1; /* 层级设置为1，位于背景之上，内容之下 */
}

/* 带背景图的容器样式（akk） */
.akk {
	border-radius: 15px; /* 圆角边框，半径15px */
	border:none; /* 无边框 */
	background: url(/static/picture/7398764.jpeg) #020d20 center no-repeat; /* 背景图+背景色，居中且不重复 */
	background-size: cover; /* 背景图自适应容器大小 */
	background-position: right 50% top 25px; /* 背景图定位：右侧50%，顶部25px */
	position: relative; /* 相对定位，作为内部元素的定位参考 */
}

/* akk容器的遮罩层 */
.akk::before {
  content: ''; /* 伪元素内容为空 */
  position: absolute; /* 绝对定位，覆盖整个akk容器 */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.85); /* 黑色半透明背景（透明度85%） */
  border-radius: 15px; /* 与容器保持相同圆角 */
}

/* 带背景图的容器样式（zkk） */
.zkk {
	border-radius: 15px; /* 圆角边框 */
	border:none; /* 无边框 */
	background: url(/static/picture/7504581.jpeg) #020d20 center no-repeat; /* 背景图+背景色设置 */
	background-size: cover; /* 背景图自适应 */
	background-position: right 0 top 0; /* 背景图定位：右侧0，顶部0 */
	position: relative; /* 相对定位 */
	padding: 50px 40px; /* 内边距：上下50px，左右40px */
}

/* 内容容器样式（置于遮罩上方） */
.container {
  position: relative; /* 相对定位 */
  z-index: 2; /* 层级2，高于遮罩层（z-index:1） */
  color: white; /* 文字颜色为白色 */
  max-width:950px; /* 最大宽度950px */
  margin:0 auto; /* 水平居中 */
}

/* 提高层级的元素样式 */
.zin {
	z-index: 2; /* 层级2，确保在遮罩上方显示 */
    position: relative; /* 相对定位 */
}

/* 图片定位样式 */
.pic1 {
	width: 317px; /* 图片宽度 */
    height: 188px; /* 图片高度 */
    position: absolute; /* 绝对定位 */
    margin-top: -158px; /* 向上偏移158px */
    right: 0; /* 右对齐 */
    z-index: 1; /* 层级1，可能位于部分内容下方 */
}

/* 列表和链接基础样式重置 */
ul,li {
	list-style-type:none; /* 清除列表默认样式（无项目符号） */
	padding:0; /* 清除内边距 */
	margin:0; /* 清除外边距 */
}
a {
	text-decoration: none; /* 清除链接默认下划线 */
}

/* 弹性布局工具类 */
.flex {
	display: flex; /* 启用弹性布局 */
}
.dlign {
	align-items: baseline; /* 弹性项目基线对齐 */
}

/* 头部区域样式 */
.head {
	margin-top: 40px; /* 顶部外边距40px */
    margin-bottom: 20px; /* 底部外边距20px */
	height: 80px; /* 头部高度80px */
}
.head h1 {
	font-size:14px; /* 标题字体大小14px */
	color: yellow; /* 标题颜色黄色 */
	margin-left: 5px; /* 左侧外边距5px */
}
.head .logo{
	float:left; /* 左浮动 */
	margin-left: 18px; /* 左侧外边距18px */
}
.head .logo img {
	width:128px; /* logo图片宽度128px */
}

/* 一级导航菜单（dh1）样式 */
.head .dh1 {
	float:right; /* 右浮动 */
}
.head .dh1 a:link {
	color:#FFFFFF; /* 未访问链接颜色白色 */
}

.head .dh1 ul {
  display: flex; /* 弹性布局，水平排列 */
  list-style: none; /* 无列表样式 */
  padding: 0; /* 清除内边距 */
  margin: 0; /* 清除外边距 */
  gap: 10px; /* 列表项之间间距10px */
}
.head .dh1 li a{
	border: 1px solid #06c; /* 1px蓝色边框 */
    padding: 10px 15px; /* 内边距：上下10px，左右15px */
    border-radius: 10px; /* 圆角边框，半径10px */
	    font-weight: bold; /* 添加这行：默认文字加粗 */

    font-size: 14px; /* 字体大小14px */
}
/* 已访问链接颜色设置 */
.head .dh1 a:visited,.head .dh2 a:visited,.head .dh3 a:visited {
  color: #ffffff; /* 已访问链接颜色白色 */
}

/* 主内容区图片样式 */
.main img {
    margin-right: 15px; /* 图片右侧外边距15px */
}

/* 一级导航链接样式 */
.head .dh1 ul li a {
  text-decoration: none; /* 无下划线 */
  color: #333; /* 链接颜色深灰色 */
}

/* 一级导航链接 hover 效果 */
.head .dh1 ul li a:hover {
  color: #000000; /* 鼠标悬停时文字颜色黑色 */
  background:#ffffff; /* 鼠标悬停时背景色白色 */
}

/* 清除浮动工具类 */
.clear {
	clear: both; /* 清除左右浮动影响 */
}
.pad15 {
	padding-top: 5px; /* 顶部内边距5px */
}

/* 二级导航菜单（dh2）样式 */
.head .dh2 {
	float:left; /* 左浮动 */
	width:470px; /* 宽度470px */
}

.head .dh2 ul {
  display: flex; /* 弹性布局 */
  list-style: none; /* 无列表样式 */
  padding: 0;
  margin: 0;
}
.head .dh2 li {
    padding: 10px 30px; /* 内边距：上下10px，左右30px */
}

.head .dh2 li a {
    font-size: 14px; /* 字体大小14px */
	color:#ffffff; /* 文字颜色白色 */
	  font-weight: bold; /* 添加这行：默认文字加粗 */
}

/* 二级导航第一个列表项样式 */
.head .dh2 li:nth-child(1) {
	border-top-left-radius: 10px; /* 左上角圆角 */
	border-bottom-left-radius: 10px; /* 左下角圆角 */
	border-left: 1px solid #06c; /* 左侧边框 */
	border-top: 1px solid #06c; /* 上边框 */
	border-bottom: 1px solid #06c; /* 下边框 */
	width: 156px; /* 宽度156px */
}

/* 二级导航第二个列表项样式 */
.head .dh2 li:nth-child(2) {
	border: 1px solid #06c; /* 四周边框 */
	width: 157px; /* 宽度157px */
}

/* 二级导航第三个列表项样式 */
.head .dh2 li:nth-child(3)  {
    border-top-right-radius: 10px; /* 右上角圆角 */
    border-bottom-right-radius: 10px; /* 右下角圆角 */
	border-right: 1px solid #06c; /* 右侧边框 */
	border-top: 1px solid #06c; /* 上边框 */
	border-bottom: 1px solid #06c; /* 下边框 */
	width: 157px; /* 宽度157px */
}

/* 二级导航链接样式 */
.head .dh2 ul li a {
  text-decoration: none; /* 无下划线 */
}

/* 二级导航 hover 效果 */
.head .dh2 ul li:hover a {
   color: #000000; /* 鼠标悬停时文字颜色黑色 */
}

/* 三级导航菜单（dh3）样式 */
.head .dh3 {
	float:right; /* 右浮动 */
	width:470px; /* 宽度470px */
}
.head .dh3 a:link {
	color:#ffff00; /* 未访问链接颜色黄色 */
}

.head .dh3 ul {
  display: flex; /* 弹性布局 */
  list-style: none; /* 无列表样式 */
  padding: 0;
  margin: 0;
}
.head .dh3 li a {
    font-size: 14px; /* 字体大小14px */
	    font-weight: bold; /* 添加这行：默认文字加粗 */

}
.head .dh3 li  {
    padding: 10px 30px; /* 内边距：上下10px，左右30px */
}

/* 三级导航第一个列表项样式 */
.head .dh3 li:nth-child(1) {
	border-top-left-radius: 10px; /* 左上角圆角 */
	border-bottom-left-radius: 10px; /* 左下角圆角 */
	border-left: 1px solid #06c; /* 左侧边框 */
	border-top: 1px solid #06c; /* 上边框 */
	border-bottom: 1px solid #06c; /* 下边框 */
	width:156px; /* 宽度156px */
}

/* 三级导航第二个列表项样式 */
.head .dh3 li:nth-child(2) {
	border: 1px solid #06c; /* 四周边框 */
	width:157px; /* 宽度157px */
}

/* 三级导航第三个列表项样式 */
.head .dh3 li:nth-child(3) {
    border-top-right-radius: 10px; /* 右上角圆角 */
    border-bottom-right-radius: 10px; /* 右下角圆角 */
	border-right: 1px solid #06c; /* 右侧边框 */
	border-top: 1px solid #06c; /* 上边框 */
	border-bottom: 1px solid #06c; /* 下边框 */
	width:157px; /* 宽度157px */
}

/* 三级导航链接样式 */
.head .dh3 ul li a {
  text-decoration: none; /* 无下划线 */
}

/* 三级导航 hover 效果 */
.head .dh3 ul li:hover a {
  color:#000000; /* 鼠标悬停时文字颜色黑色 */
}

/* 主内容区样式 */
.main {
    padding: 50px; /* 内边距50px */
}

/* 容器样式（kk） */
.kk {
	border-right: 1px solid #f3f3f3; /* 右侧边框 */
    border-top: 3px solid #f3f3f3; /* 上边框（3px粗） */
    border-bottom: 1px solid #f3f3f3; /* 下边框 */
    border-left: 1px solid #f3f3f3; /* 左侧边框 */
    border-radius: 15px; /* 圆角边框 */
	background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#0948b3)); /* 从上到下的黑色到深蓝色渐变背景（webkit内核兼容） */
}

/* 容器样式（kp） */
.kp {
	border-right: 1px none #ffffff; /* 右侧无边框 */
    border-top: 1px solid #ffffff; /* 上边框 */
    border-bottom: 1px none #ffffff; /* 下无边框 */
    border-left: 1px none #ffffff; /* 左无边框 */
    border-radius: 15px; /* 圆角边框 */
	background: -webkit-gradient(linear, left top, left bottom, from(#0948b3), to(#000000)); /* 从上到下的深蓝色到黑色渐变背景 */
}

/* 容器样式（kl） */
.kl {
	border-right: 1px none #ffffff; /* 右侧无边框 */
    border-top: 1px solid #ffffff; /* 上边框 */
    border-bottom: 1px none #ffffff; /* 下无边框 */
    border-left: 1px none #ffffff; /* 左无边框 */
    border-radius: 15px; /* 圆角边框 */
}

/* 宽度工具类 */
.wid50 {
	width:50%; /* 宽度50% */
}
.mar40 {
	margin-top:40px; /* 顶部外边距40px */
}
.abso {    
    margin-top: -30px; /* 顶部负外边距30px（向上偏移） */
    width: 100%; /* 宽度100% */
}

/* 列布局样式 */
.col {
    flex: 1; /* 弹性布局占比1，平均分配宽度 */
    padding: 30px; /* 内边距20px */
    text-align: center; /* 文字居中 */
}
.col ul {
    margin-top: 20px; /* 顶部外边距20px */
}
.col li {
	height: 36px; /* 高度36px */
    line-height: 36px; /* 行高36px，文字垂直居中 */
    border-bottom-width: 1px; /* 下边框宽度1px */
    border-bottom-style: dotted; /* 下边框样式为虚线 */
    border-bottom-color: #444444; /* 下边框颜色深灰色 */
    text-align: left; /* 文字左对齐 */
	font-size: 14px; /* 字体大小14px */
	overflow: hidden; /* 超出部分隐藏 */
}
.col li .date {
	float: right; /* 日期右浮动 */
	color: #BBB; /* 日期颜色浅灰色 */
}
.col li a{
	color:#FFFFFF; /* 链接颜色白色 */
}
.col li a:hover{
	color:rgb(255, 255, 0); /* 鼠标悬停时链接颜色黄色 */
	text-decoration: underline; /* 下划线 */
	font-weight: bold; /* 粗体 */
}

/* 标题样式 */
.tit {
	border-right: 1px solid #ffffff; /* 右侧边框 */
    border-top: 1px solid #ffffff; /* 上边框 */
    border-bottom: 1px solid #ffffff; /* 下边框 */
    border-left: 1px solid #ffffff; /* 左侧边框 */
    border-radius: 15px; /* 圆角边框 */
    background-color: rgb(9, 72, 179); /* 背景色深蓝色 */
	font-family:Source Han Sans,Geneva,sans-serif; /* 字体族 */
	font-size:14px; /* 字体大小14px */
	text-align:center; /* 文字居中 */
	padding:10px 20px; /* 内边距：上下10px，左右20px */
	color:#FFFFFF; /* 文字颜色白色 */
}

/* 宽度65%的容器样式 */
.wid65 {
	width: 80%; /* 宽度80% */
    margin: 0 auto; /* 水平居中 */
    margin-top: -20px; /* 顶部负外边距20px（向上偏移） */
}

/* 红色按钮样式 */
.redbutt {    
	background: #ff0000; /* 背景色红色 */
    padding: 15px 20px; /* 内边距：上下15px，左右20px */
    color: #ffffff; /* 文字颜色白色 */
    border-radius: 15px; /* 圆角边框，半径30px */
    font-size: 15px; /* 字体大小15px */
}

/* 黄色按钮样式 */
.orgbutt {    
	background: rgb(255, 255, 0); /* 背景色黄色 */
    padding: 15px 20px; /* 内边距：上下15px，左右20px */
    color: #000000; /* 文字颜色黑色 */
    border-radius: 15px; /* 圆角边框 */
    font-size: 15px; /* 字体大小15px */
}

/* 青色按钮样式 */
.blubutt {
	background: rgb(0, 255, 255); /* 背景色青色 */
    padding: 15px 20px; /* 内边距：上下15px，左右20px */
    color: #000000; /* 文字颜色黑色 */
    border-radius: 15px; /* 圆角边框 */
    font-size: 15px; /* 字体大小15px */
}

/* 图标样式 */
.icon {
	font-size: 14px !important; /* 字体大小14px，!important强制优先级 */
}

/* 列表项样式（带图片） */
.w-list-item {
    padding: 0; /* 无内边距 */
    margin: 0; /* 无外边距 */
    padding-bottom: 10px; /* 底部内边距10px */
    margin-bottom: 10px; /* 底部外边距10px */
    position: relative; /* 相对定位 */
    min-height: 80px; /* 最小高度80px */
    border-bottom-color: #444444; /* 下边框颜色 */
    border-bottom-width: 1px; /* 下边框宽度 */
    border-bottom-style: dotted; /* 下边框样式虚线 */
}
.w-list-item a,a:visited {
	color:#FFff00; /* 链接及已访问链接颜色黄色 */
}
.w-list-item a:hover {
    color: #ff0000; /* 鼠标悬停时链接颜色红色 */
    text-decoration: underline; /* 下划线 */
}

/* 列表项左侧图片容器 */
.w-list-l  {
    margin-right: 10px; /* 右侧外边距10px */
    width: 80px; /* 宽度80px */
    height: 80px; /* 高度80px */
	float:left; /* 左浮动 */
}
.w-list-l img {
	width:100%; /* 图片宽度占满容器 */
}

/* 列表项右侧内容区域（未设置具体样式，预留） */
.w-list-r {}

/* 页脚样式 */
.foot a {
	color:#ffff00; /* 链接颜色黄色 */
	padding:0 10px; /* 左右内边距10px */
}
.addr{text-align:center;}
.foot .wid20 {
    width: 20%; /* 宽度20% */
    text-align: right; /* 文字右对齐 */
    margin-right: 25px; /* 右侧外边距20px */
}
.foot .org {
text-align:center;
	color: #ffff00; /* 颜色黄色 */
}
.foot .mali {
	margin-top:15px; /* 顶部外边距15px */
	align-items: center; /* 弹性项目居中对齐（如果父容器是flex） */
}

.foot .addr p {
	font-size:14px; /* 字体大小14px */
	line-height:14px; /* 行高14px */
}

/* 导航列表项文本控制 */
.head .dh2 li,
.head .dh3 li {
  white-space: nowrap; /* 强制文字在一行显示，不换行 */
  overflow: hidden;    /* 超出容器部分隐藏（避免破坏布局） */
}

/* 确保链接填充整个按钮区域 */
.dh2 a, .dh3 a {
  display: block;
  padding: 10px 30px;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}

/* 移除<li>元素的内边距 */
.head .dh2 li, 
.head .dh3 li {
  padding: 0 !important;
}

/* 移动端适配：屏幕宽度≤768px时生效（累计左移29px） */
@media screen and (max-width: 1400px) {
    /* 1. 底部右侧联系信息：强制左移29px（优先级拉满） */
    .foot .wid20 {
        margin-left: 80px !important; /* 直接负margin左移，比calc更可靠，!important强制覆盖 */
        margin-right: 0 !important; /* 清除原有右侧边距，避免抵消左移效果 */
        padding-right: 0 !important; /* 清除右侧内边距，确保左移无阻碍 */
        float: right !important; /* 保持右对齐的同时左移（关键） */
        width: auto !important; /* 取消固定宽度限制，避免位移后布局错乱 */
    }

    /* 2. 底部logo：保持之前的强制左移（根据你的实际结构选择一个） */
    /* 若logo有.container类（之前沟通的结构） */
    .foot .container {
        margin-left: 80px !important;
        float: left !important;
    }
    /* 若logo是img标签，补充这行（根据实际情况选择） */
    .foot .container img {
        margin-left: 0 !important; /* 清除图片自身边距，避免叠加异常 */
    }
}