/* 239971340+徐梦槿*/
body {
	background-image: url('../党建/素材包/背景.png');
	padding: 0;
	margin: 0;
	width: 100%;
	height: 100%;
}

.part1 {
	position: relative;
	background-image: url('../党建/素材包/组 1.png');
	width:1900px; 
	height: 775px; /* 设置高度，根据需要调整 */
	margin: 0 auto;
}
.part1-1{
	position: absolute;
	width: 200px;
	height: 100px;
	top: 30px;
	left: 550px;
	text-align: center;
}
.part1-1 p{
	color: firebrick;
	font-size: 20px;
	font-weight: bold; /* 加粗文本 */
}
.part1-2{
	position: absolute;
	width: 800px;
	height: 100px;
	top: 270px;
	left: 550px;
	text-align: center;
	display: inline-block;
	margin: 0 20px;
	transform-style: preserve-3d; /* 保持子元素的3D变换 */
}
.part1-2 p{
	color: yellow;
	font-size: 60px;
	font-weight: bold; /* 加粗文本 */
	text-shadow: 
	      2px 2px 0 #60214a, 
	      -2px -2px 0 #60214a,  
	      2px -4px 0 #60214a,
	      -2px 2px 0 #60214a,
	      2px 2px 0 #60214a,
	      -2px -2px 0 #60214a,
	      2px -2px 0 #60214a,
	      -2px 2px 0 #60214a; /* 多重阴影创建3D效果 */
}
.part1-3{
	position: absolute;
	width: 500px;
	height: 50px;
	bottom: 180px;
	left: 750px;
	text-align: center;
	display: inline-block;
	margin: 0 20px;
	transform-style: preserve-3d; /* 保持子元素的3D变换 */
}
.part1-3 p{
	color: white;
	font-size: 22px;
	font-weight: bold; /* 加粗文本 */
	text-shadow:
	      1px 1px 0 #84372e, 
	      -1px -1px 0 #84372e,  
	      1px -1px 0 #84372e,
	      -1px 1px 0 #84372e,
	      2px 2px 0 #84372e,
	      -2px -2px 0 #84372e,
	      2px -2px 0 #84372e,
	      -2px 2px 0 #84372e; /* 多重阴影创建3D效果 */
}

.red {
	background-image: url('../党建/素材包/红色1.png');
    position: relative; /* 使子元素能够相对于此元素定位 */
    width: 1900px; /* 根据需要调整宽度 */
    height: 60px; /* 根据图片高度或所需高度调整 */
	background-size: cover;
    overflow: hidden; /* 隐藏超出容器的内容 */
	margin: 0 auto;

}

.red img {
	width: 100%; /* 图片宽度设为100%，以适应容器 */
	height: auto; /* 保持图片比例 */
	position: absolute; /* 绝对定位图片 */
	top: 0; /* 图片顶部对齐容器顶部 */
	left: 0; /* 图片左侧对齐容器左侧 */
	z-index: 1; /* 图片层级设为1，确保被导航条覆盖 */
	transition: opacity 0.5s ease-in-out;
	opacity: 0.5; /* 图片透明度设为0.5，以便看到导航条 */
}

.nav-container {
	top: 5px; /* 导航条顶部对齐容器顶部 */
	left: 200px;
	width: 1500px; 
	padding: 20px 0; 
	margin: 0 auto;
}
.nav{
	left: 500px;
}
.nav ul {
	list-style: none; /* 移除列表项默认样式 */
	margin: 0; /* 移除外边距 */
	padding: 0; /* 移除内边距 */
}
.nav li {
	display: inline; /* 使列表项水平排列 */
	margin: 0 10px; /* 为列表项添加左右间距 */
	color: white; /* 设置文本颜色为白色 */
	font-size: 17px; /* 可选：设置字体大小 */	
}
.nav-container .nav ul li:hover {
    background-color: #000000; 
}
	

.part2{
	background-image: url('../党建/素材包/背景2.png');
	width: 1100px;
	height: 2500px;
	background-size: cover; /* 确保背景图片覆盖整个div（可能会裁剪图片） */
	background-position: center; /* 背景图片居中 */
	background-repeat: no-repeat; /* 防止背景图片重复 */
	margin: 0 auto;
	margin-bottom: 40px;
}
.part2-1 {
	width: 1100px;
	height: 380px;
    text-align: center; 
	position: relative;
	top: 30px; /* 向下平移30像素 */
	left: 10px;
}
.xmj1{
	width: 100px;
	height: 30px;
	margin-top: -55px;
	margin-left: 40px;
}
.xmj1 p{
	color: brown;
	font-size: 25px;
	font-weight: bold;
}
.xg1 {
	max-width: 96%; 
}

.xdd {
    display: flex;
    justify-content: center; 
    align-items: center; 
    top: 2px; /* 添加一些顶部间距以区分第一张图片和下面的内容 */
	width: 98%;
	height: 340px;
}
 
.xdd img {
    width: 600px;
	height: 300px;
}

.xdd-text {
	width: 500px;
	height: 300px;
	color: darkgray;
	margin-top: 50px;
	margin-right: 20px; /* 添加一些右侧间距以区分图片和文字 */
	margin-left: 20px; /* 添加一些右侧间距以区分图片和文字 */
	text-align: left; /* 确保段落内容是左对齐的 */
}

.part2-2 {
    width: 1100px;
    height: 350px;
    text-align: center; /* 可选，用于居中显示 */
    position: relative;
    top: 30px; /* 向下平移30像素 */
    left: 10px;
}
.xmj2{
	width: 100px;
	height: 30px;
	margin-top: -55px;
	margin-left: 40px;
}
.xmj2 p{
	color: brown;
	font-size: 25px;
	font-weight: bold;
}
.xg2 {
    max-width: 96%; /* 或设置具体宽度 */
}
 
.sc {
    display: flex; /* 使用flexbox布局 */
    justify-content: center; /* 水平居中（可选） */
    align-items: center; 
    top: 20px; /* 与上方内容之间的间距 */
	width: 98%;
	height: 340px;
}
 
.sc-zp {
    width:500px; /* 示例宽度，根据需要调整 */
}
.container {
    display: flex;
    flex-direction: column; /* 垂直布局 */
	margin-top: 80px;
}
 
.sc-zp {
    /* 针对第一张图片的样式 */
    max-width: 98%;
    height: auto;
}
 
.sc-zp1-wrapper {
    display: flex;
    flex-direction: column; /* 垂直布局图片和段落 */
    margin-top: -50px; /* 与上方图片留一些空间 */
	width: 500px;
}

.sc-zp1 {
    /* 针对第二张图片的样式 */
    max-width: 98%;
    height: auto;
}
 
.jd {
    margin-top: -50px; /* 与上方图片留一些空间 */
	margin-left:-300px;
}
.jd p{
	color: white;
}
.sc-text {
    width: 500px;
    height: 280px;
    color: darkgray;
    right: 20px; /* 添加一些右侧间距以区分图片和文字 */
    margin-left: 20px; /* 添加一些右侧间距以区分图片和文字 */
    text-align: left; 
	margin-top: -70px;
}
h4:hover {
    color: firebrick;
}
.sc-text p{
	font-size: 13px;
	margin-top: -16px;
	color: darkgray;
	
}
.part2-3 {
	width: 1100px;
	height: 280px;
	text-align: center; 
	position: relative;
	top: 60px; /* 向下平移40像素 */
	left: 5px;
}

.xg3 {
    max-width:96%; 
}
 
.bs-container {
    display: flex; /* 启用flexbox布局 */
    justify-content: space-between; /* 项目之间的间隙均匀分布 */
    align-items: center; /* 垂直方向居中对齐 */
    flex-wrap: nowrap; /* 防止项目换行 */
    gap: 0px; /* 项目之间的间隙 */
	margin-top: 20px; /* 与上方内容之间的间距 */
}
 
.bs-item {
    flex: 1 1 calc(25% - 20px); /* 每个项目占据容器宽度的25%（减去间隙的宽度），并允许缩小和增长 */
    box-sizing: border-box; /* 确保padding和border不会增加元素的宽度 */
    text-align: center; 
}
 
.bs-text {
	max-width: 93%;
    color: darkgray;
	text-align: left; /* 确保段落内容是左对齐的 */
	font-size: 14px;
}
 
.bs-text p {
    margin: 0; /* 移除段落默认的上下边距 */
    margin-left: 5px;
	margin-top: 5px;
}
 
.bs-item img {
    max-width: 93%; 
    height: auto; /* 保持图片比例 */
    display: block;
	margin-left: 7px;
}
.part2-4 {
	width: 1100px;
	height: 650px;
	text-align: center;
	position: relative;
	top: 60px; /* 向下平移60像素 */
	left: 10px;
}
.xmj3{
	width: 100px;
	height: 40px;
	margin-top: -55px;
	margin-left: 40px;
}
.xmj3 p{
	color: brown;
	font-size: 25px;
	font-weight: bold;
}
.wj{
	display: flex;
	flex-wrap: wrap; /* 允许子项换行 */
}
 .xg4 {
     max-width:96%; /* 根据需要调整宽度 */
 }
.jp {
    flex: 1 1 calc(33.333% - 20px); /* 每个子项占据容器宽度的三分之一（减去间隙），并允许缩小和增长 */
    margin: 9px; /* 为子项添加外边距以创建间隙 */
	margin-top: 20px;
    
}
 
.jp img {
    max-width: 96%; /* 确保图片不会超出其父容器的宽度 */
    height: auto; /* 保持图片比例 */
    display: block; /* 移除图片底部的间隙 */
}
.jp-text {
    text-align: left; /* 确保文本内容左对齐 */
	color: darkgray;
	font-size: 15px;
	margin-top: -10px;
}
.jp-text p{
	margin-top: -15px;
}
.part2-5 {
	width: 1100px;
	height: 320px;
	text-align: center; 
	position: relative;
	top: 70px; 
	left: 10px;
}
.sk-text1{
	margin-left: 40px;
}
.sk-text2{
	margin-left: 50px;
}
.xg5 {
    max-width:96%; /* 根据需要调整宽度 */
}
.xmj4{
	width: 100px;
	height: 40px;
	margin-top:-55px ;
	margin-left: 40px;
}
.xmj4 p{
	color: brown;
	font-size: 25px;
	font-weight: bold;
}
.sk {
	margin-top: 20px;
	margin-left: 10px;
    width: 1000px;
    display: flex; /* 将父容器设置为Flex容器 */
    justify-content: space-between; /* 子元素之间的空间均匀分布，首尾不贴近边缘 */
	margin-bottom: 10px;
}
 
.sk-zp, .sk-text1, .sk-text2 {
    box-sizing: border-box; /* 确保padding和border不影响元素的总宽度 */
}
.sk-zp p{
	margin-top: 1px;
	color: darkgray;
}
.sk-text1, .sk-text2 {
    font-size: 13px;
	
}
 
.zq {
    list-style-type: square; /* 设置列表项前的标记为方形 */
    padding: 0;
    margin: 0;
}
 
.zq li {
    margin-bottom: 18px; /* 为列表项添加垂直间距 */
}
.zq li:not(:last-child) {
    margin-right: -50px; /* 添加水平间距 */
}
a:link{
	color: darkgray;
	text-decoration: none;
}
a:hover{
	color: red;
	text-decoration: underline;
}
span:hover{
	text-decoration: underline;
}
ul li{
	width: 300px;
}
ul li span{
	display: block;
	float: right;

}
.part2-6{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap; /* 虽然这里不需要换行，但保留以防万一 */
    justify-content: space-between; /* 在子元素之间添加间距 */
	width: 1100px;
	margin-top: 70px;
}
.xg6 {
    width:96%; /* 根据需要调整宽度 */
	margin-left: 20px;
}
.jr{
	display: flex;
	flex-wrap: wrap; /* 允许子项换行 */
}
.xmj5{
	width: 100px;
	height: 40px;
	margin-top:-50px ;
	margin-left: 40px;
}
.xmj5 p{
	color: brown;
	font-size: 25px;
	font-weight: bold;
}
.bh {
	display: flex;
	align-items: center; /* 垂直居中对齐 */
	width: 48%; /* 每张卡片占据大约一半的宽度，留一些空间用于间距 */
	box-sizing: border-box; /* 包括内边距和边框在内计算宽度 */
	margin-top: 8px; /* 每个块的底部外边距，用于分隔两行 */
	margin-left: 20px;
}

.bh img {
	max-width: 50%; /* 图片的最大宽度，相对于.bh容器的宽度 */
	height: auto; /* 保持图片的宽高比 */
}

.bh-text {
	margin-left: 20px; /* 图片和文字之间的间距 */
	padding: 10px; /* 文字容器的内边距 */
	flex: 1; /* 占据剩余的空间 */
	color: darkgray;
	font-size: 15px;
	margin-left: 3px;
}


.part3 {
    background-image: url('../党建/素材包/红色2.png');
    background-repeat: no-repeat;
    width: 1900px;
    height: 110px;
    position: relative;
	background-size: cover;
	overflow: hidden; /* 隐藏超出容器的内容 */
	background-position: center; /* 背景图片居中 */
	margin: 0 auto;

}
.nav-container1 {
    position: absolute;
    font-size: 15px;
    top: 10%; /* 调整以适应布局 */
    left: 0;
    right: 0;
    display: flex;
    flex-direction: column; /* 改为列布局，如果需要 */
    justify-content: center;
    align-items: center; /* 垂直居中 */
    color: white;
    z-index: 3;
	margin: 0 auto;
}
 
.nav1 ul {
    list-style: none; /* 移除列表项默认样式 */
    margin: 0; /* 移除外边距 */
    padding: 0; /* 移除内边距 */
}
 
.nav1 li {
    display: inline; /* 使列表项水平排列 */
    margin: 0 10px; /* 为列表项添加左右间距 */
    color: white; /* 设置文本颜色为白色 */
    font-size: 17px; 
}
 
.nav2 {
    position: absolute;
    top: 30px;
    left: 0;
    right: 0;
    text-align: center; /* 水平居中 */
    color: white;
}