.new_info{
    width: 96%;
    padding: 2%;
    display: inline-block;
    border-bottom: 5px solid #ededed;
}
.new_info .new_title{
    padding:0 5%;
    font-size: 1.2em;
    font-weight: bold;
    line-height: 1.5em;
    text-align: center;
}
.new_info .author{
    display: block;
    margin: 20px 0 10px 0;
    width: 100%;
    font-size: 0.8em;
    color: #9e9e9e;
    line-height: 1em;
    text-align: center;
}
.new_info .article{
    font-size: 1em;
    line-height: 1.2em;
    color: #5b5b5b;

}
.new_info .article img{
    max-width: 100%;
    padding:5% 0;
    margin: auto;
}

.new_info .new_info_more{
    display: block;
    margin: 15px auto;
    width: 25%;
    padding: 4px 0px 4px 0px;
    color: #fff;
    border-radius: 4px;
    background: var(--brand-primary);
    border: 1px solid var(--brand-primary);
    font-size: 12px;
    text-align: center;
}
.comment{
    width: 100%;
    padding:2% 0px;
}
.comment h2{
    font-size: 1.2em;
    font-weight: bold;
    line-height: 1.5em;
    text-align: center;
    margin-bottom:10px;
}
.comment .num{
    display: block;
    margin: 5px 0 10px 0;
    width: 100%;
    font-size: 0.8em;
    color: #9e9e9e;
    line-height: 1em;
    text-align: center;
}
.comment_info{
    display: inline-block;
    width: 96%;
    padding:2%;
    border-bottom: 1px solid #ededed;
}
.comment_head{
    float: left;
    width: 10%;
}
.comment_right{
    float: right;
    margin-left: 2%;
    width: 88%;
}
.comment_name{
    font-size: 1em;
    float: left;
    color: #afb1b5;
}
.comment_time{
    font-size: 1em;
    float: right;
    color: #afb1b5;
}
.comment_info p{
    clear: both;
    margin: 10px auto;
}
.comment_more{
    display: block;
    margin: 10px auto;
    width: 20%;
    padding: 4px 0px 4px 0px;
    color: #fff;
    border-radius: 4px;
    background: var(--brand-primary);
    border: 1px solid var(--brand-primary);
    font-size: 12px;
    text-align: center;
}
@media screen and (max-width: 480px) {
    .comment_info{
        padding:0 2%;
    }
}

/* newsinfo.css - 用于修复 reset.css 对 Markdown 标签的样式影响 */

/* 1. 基础样式：设置根字体和全局默认值 */
html {
    font-size: 16px; /* 1rem = 16px，作为基准单位 */
}

/* 文章内容容器：限制最大宽度，居中显示，增加内边距 */
.news-content {
    max-width: 800px;
    margin: 0 auto;
    padding: 2rem 1rem;
    font-family: "PingFang SC", "Microsoft YaHei", sans-serif; /* 适配中文的无衬线字体 */
    color: #333; /* 正文默认颜色 */
    line-height: 1.6; /* 全局行高，提升可读性 */
}


    /* 2. 标题标签（h1-h6）：保持层级差异 */
    .news-content h1 {
        font-size: 2rem; /* 32px */
        font-weight: 700;
        margin: 2rem 0 1.2rem;
        color: #222; /* 比正文稍深 */
    }

    .news-content h2 {
        font-size: 1.75rem; /* 28px */
        font-weight: 700;
        margin: 1.8rem 0 1rem;
        color: #222;
    }

    .news-content h3 {
        font-size: 1.5rem; /* 24px */
        font-weight: 700;
        margin: 1.5rem 0 0.8rem;
        color: #222;
    }

    .news-content h4 {
        font-size: 1.25rem; /* 20px */
        font-weight: 600;
        margin: 1.2rem 0 0.6rem;
    }

    .news-content h5 {
        font-size: 1.1rem; /* 17.6px */
        font-weight: 600;
        margin: 1rem 0 0.5rem;
    }

    .news-content h6 {
        font-size: 1rem; /* 16px */
        font-weight: 600;
        margin: 0.8rem 0 0.4rem;
        color: #555;
    }


    /* 3. 段落与换行 */
    .news-content p {
        margin-bottom: 1rem; /* 段落之间的间距 */
    }

    /* 处理硬换行（Markdown 中的两个空格+回车） */
    .news-content br {
        line-height: 1.8;
    }


    /* 4. 列表（有序列表/无序列表） */
    .news-content ul,
    .news-content ol {
        margin: 1rem 0 1rem 1.5rem; /* 左缩进，上下间距 */
        padding-left: 1rem;
    }

    /* 无序列表 */
    .news-content ul {
        list-style-type: disc; /* 圆点符号 */
    }

    /* 有序列表 */
    .news-content ol {
        list-style-type: decimal; /* 数字编号 */
    }

    /* 列表项 */
    .news-content li {
        margin-bottom: 0.5rem; /* 列表项之间的间距 */
    }

    /* 嵌套列表调整 */
    .news-content ul ul,
    .news-content ol ol,
    .news-content ul ol,
    .news-content ol ul {
        margin-top: 0.5rem;
        margin-bottom: 0;
        list-style-position: inside; /* 嵌套列表符号向内缩进 */
    }


    /* 5. 链接 */
    .news-content a {
        color: #2c6ecb; /* 链接默认蓝色 */
        text-decoration: none;
        border-bottom: 1px solid transparent; /* 下划线预占位 */
        transition: all 0.2s;
    }

        .news-content a:hover {
            color: #1a4b99; /* hover 时加深颜色 */
            border-bottom-color: #1a4b99; /* 显示下划线 */
        }


    /* 6. 强调（粗体/斜体） */
    .news-content strong {
        font-weight: 700; /* 粗体 */
        color: #222; /* 稍深于正文 */
    }

    .news-content em {
        font-style: italic; /* 斜体 */
        color: #555; /* 稍浅于正文 */
    }


    /* 7. 代码块与行内代码 */
    /* 行内代码（`code`） */
    .news-content code {
        font-family: "Consolas", "Monaco", monospace; /* 等宽字体 */
        font-size: 0.9rem; /* 稍小于正文 */
        padding: 0.15rem 0.3rem;
        background-color: #f5f5f5;
        border-radius: 3px;
        color: #e53935; /* 代码颜色（红色系） */
    }

    /* 代码块（```包裹的内容，通常渲染为 <pre><code>） */
    .news-content pre {
        margin: 1.2rem 0;
        padding: 1rem;
        background-color: #f8f8f8;
        border-radius: 6px;
        border-left: 3px solid #61dafb; /* 左侧标识线 */
        overflow-x: auto; /* 横向滚动（避免长代码换行） */
    }

        .news-content pre code {
            padding: 0;
            background: none;
            color: #333; /* 代码块内文字颜色 */
            font-size: 0.9rem;
            line-height: 1.5;
        }


    /* 8. 引用块（> 开头的内容） */
    .news-content blockquote {
        margin: 1.2rem 0;
        padding: 0.8rem 1rem;
        border-left: 3px solid #9e9e9e; /* 左侧灰色线 */
        background-color: #fafafa;
        color: #666; /* 引用文字稍浅 */
        font-style: italic; /* 可选：斜体增强引用感 */
    }

        .news-content blockquote p {
            margin-bottom: 0; /* 清除引用内段落的默认间距 */
        }


    /* 9. 图片 */
    .news-content img {
        max-width: 100%; /* 响应式：不超过容器宽度 */
        height: auto; /* 保持宽高比 */
        margin: 1.5rem auto; /* 上下间距，居中显示 */
        display: block; /* 确保 margin: auto 生效 */
        border-radius: 4px; /* 轻微圆角 */
        box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* 轻微阴影增强层次感 */
    }


    /* 10. 水平分割线（---） */
    .news-content hr {
        margin: 2rem 0;
        height: 1px;
        border: none;
        background-color: #e0e0e0; /* 浅灰色分割线 */
    }


/* 响应式调整：小屏幕适配 */
@media (max-width: 768px) {
    html {
        font-size: 15px; /* 小屏幕缩小基准字体 */
    }

    .news-content {
        padding: 1.5rem 0.8rem;
    }

        /* 标题缩小 */
        .news-content h1 {
            font-size: 1.8rem;
        }

        .news-content h2 {
            font-size: 1.6rem;
        }

        .news-content h3 {
            font-size: 1.4rem;
        }
}