/* 面包屑容器 */
.breadcrumb-box {
	margin: 15px auto 0px;
	max-width: 1200px;
}
.layui-breadcrumb a{
	font-size: 16px;
	text-decoration: none;
}

.layui-breadcrumb a:hover{
	color: #2373c8 !important;
}

/* 主容器：layui栅格布局核心 */
.main-container {
	width: 90%;
	max-width: 1200px;
	margin: 20px auto;
	border-radius: 4px; /* 轻微圆角更美观 */
	box-sizing: border-box; /* 保证padding不超出宽度 */
	display: flex;
}
/* 左侧隐私政策内容区 */
.content-left {
	padding: 20px 3%;
	background-color: #fff;
	border-radius: 4px;
	box-shadow: 0 1px 2px rgba(0,0,0,0.05);
	box-sizing: border-box;
	width: 70%;
}

/* 标题样式 */
.article-title {
	text-align: center;
	font-weight: bold;
	margin: 10px 0 20px;
	padding-bottom: 20px;
	border-bottom: 1px solid #eee; /* 标题下方分隔线 */
	width: 100%;
}

.article-title h2{
	margin-bottom: 10px;
}

.article-time {
	font-size: 14px;
	color: #9b9b9b;
	text-align: right;
}

.article-right-sidebar {
	width: 335px;
	border-radius: 6px;
	cursor: pointer;
	margin-bottom: 20px;
}

/* 右侧相关文章区 */
.content-right {
	box-sizing: border-box;
	height: fit-content; /* 高度自适应内容 */
	margin-left: 20px; /* 大屏下左右间距20px */
	width: 28%;
}

.content-right-related {
	padding: 15px 6%;
	background-color: #fff;
	border-radius: 4px;
	box-shadow: 0 1px 2px rgba(0,0,0,0.05);
	width: 100%;
}

/* ========== 右侧相关文章核心样式 ========== */
/* 相关文章标题（带下划线） */
.related-title {
	font-size: 20px;
	font-weight: bold;
	color: #333;
	padding-bottom: 15px;
	border-bottom: 1px solid #eee; /* 标题下方横线 */
}
/* 文章列表项 */
.related-item {
	padding: 10px 0;
	border-bottom: 1px solid #f5f5f5;
}
.related-item:last-child {
	border-bottom: none; /* 最后一项去掉分隔线 */
}
/* 文章标题：一行溢出显示... */
.related-item-title {
	font-size: 14px;
	color: #333;
	line-height: 1.4;
	margin-bottom: 5px;
	text-decoration: none;
	/* 核心：一行溢出显示... */
	white-space: nowrap;    /* 强制一行显示 */
	overflow: hidden;       /* 溢出隐藏 */
	text-overflow: ellipsis;/* 溢出显示省略号 */
	display: block;         /* 保证宽度生效 */
}
.related-item-title:hover {
	color: #0066cc; /*  hover 变蓝色 */
}
/* 文章时间 */
.related-item-date {
	font-size: 12px;
	color: #9b9b9b;;
}

/* ========== 响应式适配 ========== */
@media (max-width: 750px) {
	.breadcrumb-box {
		display: none;
	}
	.main-container {
		margin-top: 20%;
		display: block;
	}

	.content-left {
		margin:0;
		padding: 10px 8%;
		width: 100%;
	}

	.content-right {
		padding: 10px 8%;
		background-color: #fff;
		border-radius: 4px;
		box-shadow: 0 1px 2px rgba(0,0,0,0.05);
		box-sizing: border-box;
		height: fit-content; /* 高度自适应内容 */
		margin-top: 20px; /* 大屏下左右间距20px */
		margin-left: 0;
		width: 100%;
	}

	.article-right-sidebar {
		padding: 20px;
		margin: 20px 0 0 20px;
	}

	.related-title {
		text-align: center;
	}
}