/* 主容器 */
.main{
    padding-top:100px;
    padding-bottom:60px;
}

/* 表格容器 - 仅横向滚动，无纵向滚动 */
.text-box table {
  display: block;
  width: 100% !important;
  overflow-x: auto;
  overflow-y: hidden; /* 禁用纵向滚动条 */
  -webkit-overflow-scrolling: touch;
  padding-bottom: 8px;
  border-collapse: collapse;
}

/* 表格单元格：正常换行，不强制不换行 */
.text-box tr > td {
  border: solid 1px #666666;
  text-align: left;
  padding: 6px;
  white-space: normal; /* 内容自动换行，不撑开表格 */
}
.text-box tr > th {
  white-space: nowrap; /* 单元格内容不自动换行，保持表格宽度 */
  min-width: 100px;
      border: solid 1px #666666;
    text-align: left;
    padding: 6px;
}

/* 文章内容容器 */
.blog-nr{
    max-width:1200px;
    margin:0 auto;
}
.blog-nr h1{
    font-size:36px;
    line-height:1.2;
    margin:20px 0 0;
    font-weight:700;
    color:#333;
    text-align:center;
    text-transform:capitalize;
    word-break: break-word;
}
.blog-nr .tips{
    padding:0 0 20px;
    border-bottom:1px solid #D9D9D9;
    text-align:center;
    margin:35px 0 0;
    position:relative;
    display:flex;
    justify-content:space-between;
    align-items:center;
}
.blog-nr .tips span{
    margin-right:10px;
    line-height:20px;
    display:inline-block;
    font-size:15px;
    color:#666;
}

/* 文章顶部简介 */
.blog-top{
    margin:50px 0 0;
}
.blog-top .txt{
    line-height:24px;
    font-size:17px;
    word-break: break-word;
}
.blog-top .txt p~p{
    margin-top:10px;
}

/* 文章主体布局 */
.blog-content{
    margin:50px 0 0;
    display:flex;
    justify-content:space-between;
    position:relative;
}
.blog-content-left{
    flex:1;
    margin-right:60px;
    overflow:hidden;
}
.blog-content-scroll{
    position:relative;
}

/* 文章正文样式 */
.blog-content .text-box{
    line-height:28px;
    font-size:17px;
    color:#666;
    word-break: break-word;
}
.blog-content .text-box h2{
    padding-top:15px;
    font-size:24px;
    color:#333;
    line-height:1.2;
    text-align:left;
    font-weight:bold;
}
.blog-content .text-box h3{
    padding-top:10px;
    line-height: 1.2;
    font-size:22px;
    color:#000;
    font-weight: bold;
}
.blog-content .text-box p{
    margin-bottom:10px;
}
.blog-content .text-box h5{
    font-size:22px;
    color:#333;
    line-height:1.2;
    font-weight:bold;
    margin-bottom:10px;
}

/* 关键词高亮 */
.inkey{
    font-weight:bold;
}
.inkey:hover{
    font-weight:bold;
    color:#0CF;
}

/* 上一篇下一篇 */
.blog-pnbar{
    margin-top:40px;
}
.blog-pnbar p{
    max-width:100%;
    margin:-1px 0 0 0;
    padding:10px 14px;
    border:1px solid #ddd;
    font-size:18px;
    color:#545454;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
}
.blog-pnbar p:hover a{
    color:var(--active-color,#3E3F80);
}

/* 右侧目录 */
.blog-content-right{
    width:360px;
    position:relative;
    max-width:100%;
    overflow:hidden;
}
.blog-content-nav{
    border:1px solid #9C8D7C;
}
.blog-content-nav h4{
    width:100%;
    padding:20px;
    font-size:20px;
    color:#333;
    font-weight:bold;
    border-bottom:1px solid #9C8D7C;
    position:relative;
    cursor:pointer;
}
.blog-content-nav h4::after{
    display:block;
    font-family:"qico";
    content:"\e699";
    position:absolute;
    top:calc(50% - 20px);
    right:10px;
    width:40px;
    height:40px;
    line-height:40px;
    text-align:center;
    font-size:20px;
    transition: transform .3s ease;
    transform:rotate(180deg);
}
.blog-content-nav h4.close::after{
    transform:rotate(0);
}

/* 目录固定定位 */
.blog-content-right .affix{
    position:fixed;
    top:0;
    width:360px;
}
.blog-content-right .affix-bottom{
    position:absolute;
}

/* 目录列表样式（自动序号） */
.blog-nav{
    padding:20px;
}
.blog-nav > li{
    counter-increment:item;
    font-size:16px;
    color:#333;
    margin-bottom:10px;
}
.blog-nav > li a{
    display:flex;
    align-items:center;
    font-size:18px;
    line-height:22px;
}
.blog-nav > li a::before{
    content:counters(item,".") ". ";
    font-size:16px;
    color:#333;
    margin-right:8px;
}
.blog-nav > li > ul{
    counter-reset:item;
    margin:8px 0 0 16px;
}
.blog-nav > li > ul > li{
    counter-increment:item;
    margin-top:8px;
}
.blog-nav li.active > a{
    color:var(--active-color,#3E3F80);
}

/* 表格专用样式 */
tr>td {
    border: solid 1px #666666;
    text-align: center;
    padding: 6px;
}

/* ==================== 移动端适配 ==================== */
@media screen and (max-width:991px){
    .blog-nr{
        width:100%;
        padding:0 10px;
        box-sizing:border-box;
    }
    .blog-nr h1{
        font-size:30px;
    }
    .blog-content{
        margin:30px 0 0;
        flex-direction:column;
    }
    .blog-content-left{
        width:100%;
        flex:none;
        margin-right:0;
    }
    .blog-content-right{
        width:100%;
    }
    .blog-content-nav{
        display:none;
    }
}

@media screen and (max-width:480px) {
    .blog-nr h1 {
        font-size: 24px;
    }
}