.art-container {
	display:flex;
}
.art-container .left-sider {
	width:300px;
	flex-shrink: 0; /* 禁止缩小 */
	background:#E8F5FF;
	border:1px solid #B4CCF1;
	border-top:0;
}
.art-container .left-sider .category-container {
	display:grid;
	grid-template-columns: repeat(3, 1fr); /* 3列，每列平均分配宽度 */
}
.art-container .left-sider .category-container a {
	display:block;
	text-align:center;
	border:1px solid #B4CCF1;
	margin:2px;
	padding:4px;
	border-radius:3px;
	background:#CFEAFF;
}
.art-container .left-sider .category-container a:hover {
	background:#33AAFF;
	color:#ffffff;
	border:1px solid #199DFF;
}
.art-container .left-sider .left-title {
	display:block;
	padding-left:8px;
	background:#9BD4FF;
	padding-top:3px;
}
.art-container .left-sider .left-title-2 {
	display:block;
	padding-left:8px;
	background:#9BD4FF;
	padding-top:3px;
	font-weight:bold;
}
.art-container .left-sider .left-title span {
	padding:3px 16px;
	margin-bottom:-1px;
	display:inline-block;
	cursor:pointer;
}
.art-container .left-sider .left-title span.on {
	background:#E8F5FF;
	font-weight:bold;
}
.art-container .left-sider .left-title span:nth-child(2) {
	margin-left:-1px;
}
.art-container .left-sider .left-list-container {
	border-top:1px solid #B4CCF1;
}
.art-container .left-sider .left-list-container div:nth-child(2) {
	display:none;
}
.art-container .left-sider .left-list-container ol {
	padding:2px;
	margin:0;
	list-style: none; /* 移除默认样式 */
	counter-reset: my-counter; /* 初始化计数器 */
}
.art-container .left-sider .left-list-container ol li {
	counter-increment: my-counter; /* 递增计数器 */
	padding-left: 28px; /* 给数字预留空间 */
	margin:1px 0;
	line-height:24px;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
	position: relative;
}
.art-container .left-sider .left-list-container ol li::before {
	content: counter(my-counter); /* 显示数字 + 点 */
	position: absolute;
	left: 0;
	width: 1.7em; /* 设置宽度 */
	height: 1.7em; /* 设置高度 */
	background: #9BD4FF; /* 设置背景色 */
	color: white; /* 数字颜色 */
	text-align: center; /* 数字居中 */
	line-height: 1.7em; /* 垂直居中 */
	/* border-radius: 50%; 可选：圆形背景 */
	margin-right: 0.5em; /* 可选：数字与文本间距 */
}
.art-container .left-sider .left-list-container ol li span a {
	color:#0066B4;
}
.art-container .art-list, .art-container .art-content {
	flex-grow: 1; 
	margin-left:3px;
}
.art-container .art-list .art-cover-container {
	display:flex;
	height:202px;
	overflow:hidden;
	border-bottom:2px solid #E6F2FF;
	margin:2px 0 1px 0;
}
.art-container .art-list .art-cover-container .art-cover-image {
	width:350px;
	border:1px solid #E6F2FF;
}
.art-container .art-list .art-cover-container .art-intro {
	flex-grow: 1; 
}
.art-container .art-list .art-cover-container .art-intro h2 {
	padding:0 3px 3px 3px;
	margin:0;
}
.art-container .art-list .art-cover-container .art-intro .art-cut {
	padding:3px 0 3px 5px;
	line-height:21px;
}
.art-container .art-list .art-cover-container .art-intro .art-cut p {
	padding:0;
	margin:0;
}
.art-container .art-list ul {
	padding:0;
	margin:0;
	list-style:none;
}
.art-container .art-list ul li {
	display:flex;
	border-bottom:1px solid #CCE5FF;
	line-height:22px;
	margin-top:1px;
}
.art-container .art-list ul li:hover {
	border-bottom:1px solid red;
	background:#F7F7F7;
}
.art-container .art-list ul li span {
}
.art-container .art-list ul li span a {
	display:block;
	padding:3px;
}
.art-container .art-list ul li span:nth-child(1) {
	width:75px;
	text-align:center;
	background:#CCE5FF;
}
.art-container .art-list ul li span:nth-child(1) a:hover {
	background:#33AAFF;
	color:#ffffff;
}
.art-container .art-list ul li span:nth-child(2) {
	flex-grow: 1; 
}
.art-container .art-list ul li span:nth-child(3) {
	width:90px;
	text-align:center;
	padding:3px;
}
.art-container .art-list ul li span:nth-child(4) {
	width:80px;
	text-align:right;
	padding:3px;
	font-size:12px;
}
.page-navi {
	padding:3px;
}

.art-container .art-content {

}
.art-container .art-content h2 {
	padding:4px;
	margin:0;
}
.art-container .art-content .art-info {
	padding:3px;
	margin-top:4px;
	color:gray;
}
.art-container .art-content .art-info em:nth-child(1) {
	
}
.art-container .art-content .art-info em:nth-child(2) {
	float:right;
}

.art-container .art-content .art-info:after {
	content: '.';
	display: block;
	clear: both;
	overflow: hidden;
	height: 0;
}
.art-content-detail {
	line-height:22px;
}