/*
 * CMS文章内容页排版美化  article_new.css
 * 在原 article.css 基础上叠加，不破坏原有结构/功能
 * 排版参照国际主流阅读体验：适当字号、行高1.8、段落间距、字间距
 */

/* ════ 面包屑导航 ════ */
.qb-cms-crumb {
    max-width: 640px;
    margin: 0 auto;
    background: #fff;
    padding: 12px 15px;
    font-size: 13px;
    color: #9aa0a6;
    border-bottom: 1px solid #f0f0f0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.qb-cms-crumb a {
    color: #9aa0a6;
    text-decoration: none;
}
.qb-cms-crumb a:active { color: #1a73e8; }
.qb-cms-crumb .fa { margin: 0 6px; font-size: 10px; }
.qb-cms-crumb span { color: #5f6368; }

/* ════ 标题区美化 ════ */
.MainInfos .title {
    font-size: 21px;          /* 原24px略偏大，调整为更易读的尺寸 */
    font-weight: 700;
    line-height: 1.5;         /* 原30px固定行高改为相对值，适配多行标题 */
    color: #202124;
    letter-spacing: .3px;
    margin-bottom: 10px;
}

.MainInfos .infos {
    font-size: 13px;
    line-height: 1;
    color: #9aa0a6;
    padding-bottom: 10px;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 4px;
    text-align: center;
}
.MainInfos .infos span {
    padding-right: 16px;
}
.MainInfos .infos .glyphicon,
.MainInfos .infos .si {
    margin-right: 3px;
    color: #c0c4c9;
}

/* ════ 正文排版美化（核心） ════ */
.ShowContent {
    font-size: 16px;          /* 主流移动阅读字号 */
    color: #333333;           /* 深灰而非纯黑，降低视觉疲劳 */
    line-height: 1.85;        /* 行高1.85，舒适阅读间距 */
    letter-spacing: .3px;     /* 微调字间距 */
    margin-top: 16px;
    margin-left: 10px;
    margin-right: 10px;
}
.ShowContent p {
    margin: 0 0 18px;         /* 段落间距 */
    text-align: justify;      /* 两端对齐，更整齐 */
}
.ShowContent p:last-child {
    margin-bottom: 0;
}
.ShowContent h1,
.ShowContent h2,
.ShowContent h3,
.ShowContent h4 {
    font-weight: 700;
    color: #202124;
    line-height: 1.4;
    margin: 28px 0 14px;
}
.ShowContent h1 { font-size: 20px; }
.ShowContent h2 { font-size: 19px; }
.ShowContent h3 { font-size: 18px; }
.ShowContent h4 { font-size: 17px; }
.ShowContent strong,
.ShowContent b {
    font-weight: 700;
    color: #202124;
}
.ShowContent a {
    color: #1a73e8;
    text-decoration: none;
    border-bottom: 1px solid rgba(26,115,232,.3);
}
.ShowContent blockquote {
    margin: 18px 0;
    padding: 12px 16px;
    background: #f8f9fa;
    border-left: 3px solid #1a73e8;
    color: #5f6368;
    font-size: 15px;
    line-height: 1.7;
}
.ShowContent ul,
.ShowContent ol {
    margin: 14px 0;
    padding-left: 22px;
}
.ShowContent li {
    margin-bottom: 8px;
    line-height: 1.75;
}
.ShowContent img {
    max-width: 100%;
    border-radius: 6px;
    margin: 6px 0;
    display: block;
}
.ShowContent table {
    width: 100%;
    margin: 16px 0;
    border-collapse: collapse;
    font-size: 14px;
}
.ShowContent table td,
.ShowContent table th {
    border: 1px solid #eee;
    padding: 8px 10px;
}

/* ════ 自定义字段区美化 ════ */
.OtherInfos .SideBox .tag span {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .3px;
}
.OtherInfos .SideBox .cont {
    font-size: 15px;
    line-height: 1.75;
    color: #444;
    margin-top: 6px;
}

/* ════ 列表区（相关文章/更多）美化 ════ */
.ListMoreInfos .Lists ul li .t a {
    font-size: 16px;
    line-height: 1.5;
    color: #202124;
    font-weight: 600;
}
.ListMoreInfos .Lists ul li .m {
    font-size: 13px;
    color: #9aa0a6;
}

/* ════ 小屏幕适配（与原有断点保持一致） ════ */
@media (max-width: 500px) and (min-width: 401px) {
    .ShowContent { font-size: 14px; line-height: 1.8; }
}
@media (max-width: 400px) {
    .ShowContent { font-size: 15px; line-height: 1.75; }
    .qb-cms-crumb { font-size: 12px; padding: 10px 12px; }
}

/* ════════════════════════════════════════
   PC端内容页 — 面包屑 + 排版美化
════════════════════════════════════════ */
.qb-cms-crumb-pc {
    font-size: 13px;
    color: #9aa0a6;
    margin-bottom: 14px;
    line-height: 1.6;
}
.qb-cms-crumb-pc a {
    color: #9aa0a6;
    text-decoration: none;
}
.qb-cms-crumb-pc a:hover { color: #1a73e8; }
.qb-cms-crumb-pc .fa { margin: 0 7px; font-size: 11px; }
.qb-cms-crumb-pc span { color: #5f6368; }

/* PC端标题/正文（class名跟移动端不同：.title/.infos/.cnt） */
.RightCnt .ShowContent .title {
    font-size: 26px;
    font-weight: 700;
    line-height: 1.5;
    color: #202124;
    letter-spacing: .3px;
    margin-bottom: 14px;
}
.RightCnt .ShowContent .infos {
    font-size: 13px;
    line-height: 1.8;
    color: #9aa0a6;
    padding-bottom: 16px;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 6px;
}
.RightCnt .ShowContent .infos span { padding-right: 18px; }
.RightCnt .ShowContent .cnt {
    font-size: 16px;
    color: #333333;
    line-height: 1.9;
    letter-spacing: .3px;
    margin-top: 18px;
}
.RightCnt .ShowContent .cnt p {
    margin: 0 0 20px;
    text-align: justify;
}
.RightCnt .ShowContent .cnt h1,
.RightCnt .ShowContent .cnt h2,
.RightCnt .ShowContent .cnt h3 {
    font-weight: 700;
    color: #202124;
    line-height: 1.4;
    margin: 30px 0 16px;
}
.RightCnt .ShowContent .cnt a {
    color: #1a73e8;
    text-decoration: none;
    border-bottom: 1px solid rgba(26,115,232,.3);
}
.RightCnt .ShowContent .cnt img {
    max-width: 100%;
    border-radius: 6px;
    margin: 8px 0;
}
