/* pc_jj 模板补充样式 —— 与 jj.qqdio.cn 目标站配色一致(主色青绿 #009688 / 链接蓝 #0080FF / 价格红 #ec3b3b) */
* { box-sizing: border-box; }
body { background: #f5f5f5; color: #333; font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif; font-size: 14px; }
a { color: #333; text-decoration: none; }
a:hover { color: #0080FF; }
.clear { clear: both; }
img { border: 0; }

/* 通用容器 */
.bodybox { background: #f5f5f5; padding: 15px 0 30px; }
.wp, .w1200, .w1210 { width: 1200px; margin: 0 auto; }
.keke_doc_clearfix:after { content: ""; display: block; clear: both; }

/* 面包屑 */
.bread_box { padding: 14px 0 4px; font-size: 13px; color: #999; }
.bread_box a { color: #999; }
.bread_box a:hover { color: #0080FF; }
.bread { color: #999; line-height: 30px; height: 30px; }
.bread a { color: #999; }
.bread a:hover { color: #0080FF; }
.bread cite, .bread i { color: #ccc; font-style: normal; margin: 0 4px; }

/* 首页/列表 标题通用 */
.mod_top_nav { position: relative; margin: 18px 0 14px; }
.mod_top_nav h2 { display: inline-block; font-size: 20px; color: #333; padding: 0 0 8px 4px; margin: 0 0 0 14px; position: relative; }
.mod_top_nav h2:before {
    content: '';
    position: absolute;
    left: -14px;
    top: 4px;
    width: 4px;
    height: 22px;
    background: #009688;
    border-radius: 0;
    z-index: 1;
}
.mod_top_nav h2 a { color: #333; }
.mod_top_nav h2 a:hover { color: #0080FF; }
.mod_top_nav .right_nav { position: absolute; right: 0; bottom: 8px; color: #999; }
.mod_top_nav .right_nav a { color: #999; }
.mod_top_nav .right_nav cite { color: #ccc; margin: 0 4px; font-style: normal; }
.top_nav_breadcrumb { position: absolute; right: 110px; top: 4px; font-size: 13px; white-space: nowrap; max-width: 560px; overflow: hidden; text-overflow: ellipsis; }
.top_nav_breadcrumb a { color: #999; margin: 0 4px; }
.top_nav_breadcrumb cite { color: #ccc; font-style: normal; }
.top_nav_breadcrumb cite:last-child { display: none; }

/* 最新资料双栏 / 浏览排行：首页由 index.css（同级 hd_left/slideBox 样式文件）原生接管，
   这里不再重复定义，避免与 index.css 的 .newleft/.right_userlist/.newdoclist/.ranking_num 冲突。
   列表页/详情页不加载 index.css，相关卡片样式见下方 .mod_list/.course-mod 区块。 */

/* 首页内容板块卡片（course-mod，目标站 index.css 风格） */
.mod_list { margin: 0 -8px; }
.mod_list .course-mod { float: left; width: 210px; margin: 8px; background: #fff; border: 1px solid #eee; transition: all .2s; }
.mod_list .course-mod:hover { box-shadow: 0 4px 14px rgba(0,0,0,.12); border-color: #009688; }
.mod_content { position: relative; padding: 8px; }
.mod_content_top { width: 100%; height: 130px; overflow: hidden; background: #fafafa; }
.mod_content_top img { width: 100%; height: 100%; object-fit: cover; }
.icomarkers { position: absolute; top: 12px; left: 12px; background: rgba(0,150,136,.9); color: #fff; font-size: 12px; padding: 2px 8px; border-radius: 2px; }
.mod_content_center { font-size: 14px; color: #333; height: 40px; line-height: 20px; overflow: hidden; margin: 8px 0; }
.mod_bottom { line-height: 22px; }
.doc_price { color: #ec3b3b; font-weight: bold; }
.doc_price.active { color: #ec3b3b; }
.mod_bottom_detail-info { float: right; color: #999; font-size: 12px; }
.viewbtn { display: block; text-align: center; margin-top: 6px; }
.viewbtn .actives { display: inline-block; background: #009688; color: #fff; padding: 4px 16px; border-radius: 2px; font-size: 13px; }

/* ========== 列表页（对齐 jj.qqdio.cn list.css：doc-mod 卡片） ========== */
/* 覆盖 list.css 中 .listnav 的 -100px 上移(目标站有头图,我们无头图) */
.listnav { margin-top: -55px !important; }
.listnavsub a { display: inline-block; padding: 4px 14px; margin: 4px 6px 4px 0; background: #f5f5f5; color: #666; border-radius: 2px; }
.listnavsub a.actives, .listnavsub a:hover { background: #009688; color: #fff; }

/* doc-mod 卡片补充(主体样式由 list.css 提供) */
.mod_list .doc-mod { padding-left: 20px; }
.mod_list .doc-mod .mod_content { padding: 0 0 14px; }
.mod_list .doc-mod .mod_content_top img { border: 0; }
.mod_list .doc-mod .mod_content_center { font-size: 14px; line-height: 20px; height: 40px; padding: 0 10px; }
.mod_list .doc-mod .mod_bottom { padding: 0 10px; }

/* 分页 */
.pagination { text-align: center; margin: 24px 0; }
.pagination li, .pagination a, .pagination span { display: inline-block; }
.pagination a, .pagination span { min-width: 32px; padding: 6px 12px; margin: 0 3px; border: 1px solid #ddd; color: #666; border-radius: 2px; background: #fff; }
.pagination .active span, .pagination a:hover { background: #009688; color: #fff; border-color: #009688; }
.pagination .disabled span { color: #ccc; }

/* ========== 详情页（对齐 jj.qqdio.cn view.css：viewtop + mainpart） ========== */
/* viewtop 文档信息区补充 */
.viewtop .docinfobox h2 { font-size: 22px; line-height: 1.5; }
.viewtop .docsummary a { color: #666; }
.viewtop .docsummary a:hover { color: #0080FF; }
.viewtop .price .f-num { color: #ec3b3b; font-size: 24px; }

/* 正文 */
.doc_content { line-height: 2; color: #444; word-break: break-all; font-size: 15px; }
.doc_content img { max-width: 100%; }
.doc_content p { margin: 0 0 12px; }

/* 上一篇/下一篇(pageinfo 样式 view.css 已提供,补充边距) */
.viewpage .pageinfo { padding-top: 10px; border-top: 1px dashed #eee; }

/* 付费提示框 */
.doc_paybox { background: #fff8f0; border: 1px solid #ffd9a8; padding: 16px 20px; margin-bottom: 16px; border-radius: 2px; }
.doc_paytip { color: #e65100; font-size: 14px; margin-bottom: 10px; }
.doc_paytip b { color: #009688; }
.doc_paytip a.actives { display: inline-block; background: #009688; color: #fff; padding: 3px 14px; border-radius: 2px; margin-left: 6px; font-size: 13px; }
.doc_paybtns a { display: inline-block; background: #009688; color: #fff; padding: 9px 26px; border-radius: 2px; margin-right: 12px; font-size: 14px; }
.doc_paybtns a:hover { background: #e67500; color: #fff; }

/* Archives 模型硬编码的"内容已隐藏"提示框（.alert-paid），改 pc_jj 青绿 CTA 风格 */
.alert.alert-paid {
    background: #f5fbfa;
    border: 1px dashed #80cbc4;
    color: #888;
    padding: 28px 20px;
    margin: 24px auto;
    text-align: center;
    border-radius: 4px;
    font-size: 14px;
    line-height: 1.8;
}
.alert.alert-paid a {
    display: inline-block;
    margin-top: 12px;
    padding: 7px 22px;
    background: #009688;
    color: #fff !important;
    border-radius: 3px;
    text-decoration: none;
    font-size: 14px;
    transition: background .2s;
}
.alert.alert-paid a:hover { background: #00897b; }

/* 全部分类页 */
.cate_index { background: #fff; border: 1px solid #eee; padding: 10px 20px 16px; margin-bottom: 20px; clear: both; overflow: hidden; }

/* 详情页下载/购买按钮居中并增加上下间距 */
.downbtnbox { text-align: center; margin: 20px 0; }
.downbtnbox .downbtn { margin: 0 8px; }

/* 正文区模型自动生成的“立即下载”按钮（Archives.php .btn-download-now） */
.btn-download-now { display: table; margin: 20px auto; }

/* 基础标题文字美化（无 banner 版） */
.listtitle { float: none; margin: 15px 0 8px; color: #333; line-height: 26px; }
.listtitle h2 { float: none; display: inline-block; font-size: 22px; font-weight: 600; color: #333; line-height: 26px; vertical-align: middle; }
.countnum { float: none; display: inline-block; margin-left: 20px; margin-top: 0; color: #999; line-height: 26px; vertical-align: middle; }
.countnum .active { color: #009688; font-weight: 600; }
.cate_card { border-bottom: 1px dashed #f0f0f0; padding: 14px 0; }
.cate_card:last-child { border-bottom: 0; }
.cate_card_hd { margin-bottom: 10px; }
.cate_card_hd a { font-size: 16px; font-weight: bold; color: #333; }
.cate_card_hd a:hover { color: #0080FF; }
.cate_card_hd a:before { content: ""; display: inline-block; width: 4px; height: 15px; background: #009688; vertical-align: -2px; margin-right: 8px; }
.cate_card_bd a.cate_sub { display: inline-block; padding: 5px 14px; margin: 0 8px 8px 0; background: #f5f5f5; color: #666; border-radius: 2px; font-size: 13px; }
.cate_card_bd a.cate_sub:hover { background: #009688; color: #fff; }

/* 专题页 */
.special_banner { position: relative; height: 220px; background-size: cover; background-position: center; margin-bottom: 16px; }
.special_title { position: absolute; left: 0; bottom: 0; width: 100%; padding: 24px 20px 16px; background: linear-gradient(-180deg, rgba(0,0,0,0), rgba(0,0,0,.55)); }
.special_title h1 { font-size: 22px; color: #fff; margin: 0 0 8px; }
.special_title h1 a { color: #fff; }
.special_intro { color: rgba(255,255,255,.85); font-size: 14px; margin: 0; }

/* ========== 导航栏「首页」active 背景对齐底线 ========== */
/* 根因：#nex_top_nav 高度38px(含2px底边框)，但 .nex_Nav_box ul li a 高度40px，
   导致 actives 背景色溢出导航容器底部2px，看起来"往下掉"。 */
#nex_top_nav { overflow: visible; }
.nex_Nav_box ul li a { height: 36px; line-height: 36px; }
.nex_Nav_box ul li.actives a {
    background-color: #009688;
    color: #fff !important;
    border-radius: 2px 2px 0 0;
    margin-bottom: -2px; /* 与底部border无缝衔接 */
}

/* ========== 导航栏「关注公众号」：常驻显示 ========== */
/* 覆盖 style2.css 把 .nex_nav_focusinter 当弹窗的旧设计 */
/* 结构：二维码图片(模拟手机图标) + 关注公众号 文字，常驻可见 */
.nex_nav_focus {
    overflow: visible !important;
}
.nex_nav_focus_qr {
    display: inline-block !important;
    width: 40px !important;
    height: 40px !important;
    vertical-align: middle !important;
    border: 2px solid #009688 !important;
    border-radius: 6px !important;
    padding: 2px !important;
    background: #fff !important;
}
.nex_nav_focus_txt {
    display: inline-block !important;
    margin-left: 6px !important;
    color: #009688 !important;
    font-size: 14px !important;
    vertical-align: middle !important;
}

/* ========== 右侧悬浮工具栏：二维码默认隐藏，hover 显示 ========== */
/* 根因：style2.css 的 .action-item-inner 定义了 visibility:hidden+opacity:0，
   但 layout.html 中父级 .action 容器可能被其他样式覆盖或结构不匹配，
   导致二维码默认可见。此处强制覆盖确保隐藏。 */
.action .action-item-inner {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}
.action .action-item:hover > .action-item-inner,
.action .action-item:hover .action-item-inner {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: translateX(-5px);
}

/* 右侧悬浮栏整体样式微调 */
.nex_sidetool_bar .action {
    width: auto;
}
.nex_sidetool_bar .action-color-1 .action-item {
    --action-color: #009688;
}

/* ========== 头部搜索框图标 ========== */
.scbar_btn {
    background-color: #009688 !important;
    background-image: none !important;
    color: #fff !important;
    font-size: 14px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}
.scbar_btn:before {
    content: "\f002";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 16px;
}

/* ========== 首页左侧栏 3 个按钮均匀分布 + popup 顶部对齐 ========== */
/* index.css 把每个 navTitleBox 写死 height:80px，3 个挤在顶部、下方留白。
   这里把 .hd_left 设为 flex 纵向，每个 .left_item 固定 116px（348/3）并垂直居中；
   同时 .left_item 不加 position:relative，保证 .popup 的 top:0 仍然以 .hd_left 为
   包含块，从而 hover 任意按钮时 popup 都从左侧栏顶部开始（与目标站一致）。 */
.hd_left {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
}
.hd_left .left_item {
    height: 116px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-bottom: 1px solid #f5f5f5 !important;
}
.hd_left .left_item:last-child {
    border-bottom: 0 !important;
}
.hd_left .left_item .navTitleBox {
    height: 110px !important;
    border-bottom: 0 !important;
}


/* 首页五宫格整体上移：index.css .web-module{margin-top:15px} 叠加首屏容器下边距偏大 */
.web-module {
    margin-top: 0 !important;
}

/* 浏览排行：放开 index.css 的限制
   .right_userlist .bd{height:190px;overflow:hidden} → 容器裁掉多余条目（只显示1条）
   .right_userlist li{height:190px} → 每条撑190px导致条目飞开 */
.right_userlist .bd {
    height: auto !important;
    overflow: visible !important;
}
.right_userlist .bd .newdoclist li {
    height: auto !important; /* 恢复 .newdoclist li 原生 37px 行高 */
}

/* ========== 分类列表-文字列表（WORD 类型 list_word.html） ========== */
/* 与 jj.qqdio.cn list_word.html 一致：3 列文字列表，仅作用于 .mod_list 内的 <li>，
   不影响 doc-mod 卡片网格（卡片是 <a class="doc-mod">，非 <li>）。 */
.mod_list li {
    line-height: 35px;
    float: left;
    width: 33.33%;
    box-sizing: border-box;
    padding-right: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.mod_list li span {
    float: right;
    color: #999;
    margin: 0 20px;
}
.mod_list li a {
    font-size: 14px;
    color: #000;
    white-space: nowrap;
    font-weight: 400;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mod_list li a:hover { color: #009688; }
.mod_list li .myfont { font-size: 14px; margin-right: 0; }
.mod_list li .mgl2 { font-size: 12px; margin-right: 5px; }
.mod_list li .doc { font-size: 16px; margin-right: 6px; color: #009688; }

/* ========== myfont iconfont 字体本地化 ========== */
/* 根因：base.css 中 @font-face 引用阿里云 at.alicdn.com 的字体文件，
   服务器访问外网受限/地址失效，导致 iconfont 图标（&#xe60d; 等）显示为空白。
   修复：将字体文件下载到本地 ./fonts/，覆盖 @font-face 指向本地。 */
@font-face {
    font-family: 'myfont';
    src: url('./fonts/myfont.woff2') format('woff2'),
         url('./fonts/myfont.woff') format('woff'),
         url('./fonts/myfont.ttf') format('truetype');
}
/* 用户中心 */
.user_head { background: #fff; border: 1px solid #eee; padding: 28px 20px; text-align: center; margin-bottom: 16px; }
.user_head img { width: 96px; height: 96px; border-radius: 50%; border: 3px solid #009688; }
.user_head h2 { font-size: 20px; color: #333; margin: 12px 0 6px; }
.user_head h2 a { color: #333; }
.user_head p.user_bio { color: #999; margin: 0 0 14px; }
.user_stat { color: #666; font-size: 14px; }
.user_stat b { color: #009688; margin: 0 3px; }
.user_tabs { background: #fff; border: 1px solid #eee; border-bottom: 0; padding: 0 16px; margin-bottom: 16px; }
.user_tabs a { display: inline-block; padding: 12px 20px; color: #666; margin-right: 8px; }
.user_tabs a.actives, .user_tabs a:hover { color: #009688; border-bottom: 2px solid #009688; }