﻿body {
	font-family: Arial, sans-serif;
	margin: 0;
	padding: 0;
}
a {
	color: #666; /* 蓝色字体 */
	text-decoration: none; /* 移除下划线 */
}
#DataList1 > br {
	display: none !important;
}
.container {
	max-width: 1000px;
	margin: 0 auto;
	padding: 10px;
	overflow: auto;
}

.article {
	box-sizing: border-box;
	float: left;
	padding: 8px; /* 减小间距，增加移动端空间利用率 */
}

	.article img {
		max-width: 100%;
		height: auto;
		display: block;
		object-fit: cover;
		/*aspect-ratio: 16/9;*/ /* 更适合移动端的宽高比 */
		border-radius: 6px; /* 圆角设计更现代 */
	}

	.article h3 {
		margin-top: 8px;
		font-size: clamp(14px, 3vw, 16px); /* 响应式字体大小 */
		line-height: 1.3;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}

	.article p {
		font-size: clamp(11px, 2vw, 12px); /* 响应式字体大小 */
		color: #666;
		margin-top: 4px;
	}

/* 响应式布局 - 在小屏幕上调整为每行2篇 */
@media (max-width: 768px) {
	.article {
		width: 50%;
	}
}

/* 桌面端和大屏幕 - 每行3篇 */
@media (min-width: 769px) {
	.article {
		width: 33.33%;
	}
}
/* 分页控件容器 */
.pagess {
	display: flex;
	justify-content: center;
	margin: 20px 0;
	clear:both;
}

	/* 分页列表 */
	.pagess ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		list-style: none;
		padding: 0;
		margin: 0;
		gap: 8px; /* 项目间距 */
	}

	/* 分页项 */
	.pagess li {
		padding: 6px 12px;
		border-radius: 4px;
		font-size: 14px;
		transition: all 0.2s ease;
	}

		/* 信息项样式 */
		.pagess li:not(:has(a)) {
			/*color: #666;*/
		}

		/* 链接项样式 */
		.pagess li:has(a) {
			cursor: pointer;
		}

			/* 链接悬停效果 */
			.pagess li:has(a):hover {
				background-color: #f0f7ff;
				color: #165DFF;
			}

	/* 红色标签 */
	.pagess .red-label {
		color: #f53f3f;
		font-weight: 500;
	}

/* 响应式设计 */
@media (max-width: 576px) {
	.pagess ul {
		gap: 4px;
	}

	.pagess li {
		padding: 4px 8px;
		font-size: 12px;
	}
}
.pagess li a {
	color: #666; /* 蓝色字体 */
	text-decoration: none; /* 移除下划线 */
	display: inline-block;
	width: 100%;
	height: 100%;
}

/* 链接悬停效果 */
/*.pagess li:hover {
	background-color: #666;
}*/
/* 通用输入框样式 */
.input-style {
	/* 边框 */
	border: 2px solid #e0e0e0; /* 浅灰色边框 */
	border-radius: 8px 0 0 8px;
	/* 内边距 */
	padding: 6px 8px; /* 上下左右内边距 */
	/* 字体 */
	/*font-size: 14px;*/
	color: #333; /* 文本颜色 */
	/* 去除默认轮廓 */
	outline: none;
	/* 过渡效果 */
	transition: border-color 0.3s ease; /* 边框颜色过渡 */
	border-right:none;
}

	/* 鼠标悬停效果 */
	.input-style:hover {
		border-color: #666; /* 悬停时深灰色边框 */
	}

.btnSearch {
	/* 去除默认样式 */
	border: none;
	outline: none;
	cursor: pointer;
	/* 内边距 */
	padding: 9px 16px;
	/* 字体 */
	font-size: 16px;
	font-weight: 500;
	line-height: 1;
	/* 圆角 */
	border-radius: 0 6px 6px 0;
	/* 过渡效果 */
	transition: all 0.3s ease;
	/*background: #4caf50;*/ /* 蓝色背景 */
	/*color: #fff;*/ /* 白色文字 */
}