/* ============================================================
   山东九方紧固件有限公司 — 原站风格还原主题 (legacy)
   配色：页面蓝底 #0056e8 / 品牌蓝 #4681bc / 强调橙 #ff6600
   字体：宋体 12px / 行高 200%
   布局：980px 居中，左栏 200 + 右栏 760
   ============================================================ */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
    background-color: #0056e8;
    font-family: "宋体", SimSun, "Microsoft YaHei", Arial, sans-serif;
    font-size: 12px;
    color: #333333;
    line-height: 2;
}
a { color: #333333; text-decoration: none; }
a:hover { color: #ff6600; text-decoration: underline; }
a:visited { color: #333333; }
img { border: 0; vertical-align: middle; }
ul, li { list-style: none; margin: 0; padding: 0; }

/* 980 居中容器 */
.wrap { width: 980px; margin: 0 auto; background: #ffffff; }

/* ===================== 顶栏 ===================== */
.topbar { width: 980px; margin: 0 auto; background: #ffffff; height: 120px; }
.topbar .logo { float: left; width: 220px; height: 120px; padding: 5px 0 0 12px; }
.topbar .logo img { width: 180px; height: 110px; }
.topbar .topright { float: right; width: 748px; height: 120px; }
.topbar .topright .tools { text-align: right; padding: 10px 14px 0 0; color: #666666; }
.topbar .topright .tools a { color: #333333; }
.topbar .topright .tools a:hover { color: #ff6600; }

/* ===================== 主导航 ===================== */
.mainnav { width: 980px; margin: 0 auto; background: #ffffff; border-top: 2px solid #4681bc; border-bottom: 2px solid #4681bc; height: 42px; }
.mainnav ul { width: 980px; }
.mainnav li { float: left; width: 122px; height: 42px; text-align: center; border-right: 1px solid #e3ecf6; }
.mainnav li:last-child { border-right: 0; }
.mainnav li a { display: block; color: #333333; }
.mainnav li a .cn { display: block; font-size: 14px; font-weight: bold; line-height: 22px; margin-top: 2px; }
.mainnav li a .en { display: block; font-size: 10px; line-height: 14px; color: #999999; letter-spacing: 1px; }
.mainnav li a:hover { color: #ffffff; background: #4681bc; text-decoration: none; }
.mainnav li a:hover .cn, .mainnav li a:hover .en { color: #ffffff; }
.mainnav li.active a { color: #ffffff; background: #4681bc; }
.mainnav li.active a .cn, .mainnav li.active a .en { color: #ffffff; }

/* ===================== 主体两栏 ===================== */
.layout { width: 980px; margin: 0 auto; background: #ffffff; overflow: hidden; }
.layout .cols { width: 980px; }
.layout .side { float: left; width: 200px; }
.layout .main { float: right; width: 760px; padding: 0 10px 20px; min-height: 430px; }

/* 面包屑 / 当前位置 */
.position { background: #4681bc; height: 28px; line-height: 28px; color: #ffffff; padding-left: 18px; font-size: 13px; font-weight: bold; margin: 8px 0; }
.position a { color: #ffffff; }
.position a:hover { color: #ffe08a; text-decoration: underline; }
.position span { color: #ffffff; }

/* ===================== 左侧栏 ===================== */
.side-box { margin-bottom: 10px; }
.side-hd { background: #4681bc; color: #ffffff; height: 31px; line-height: 31px; padding-left: 14px; font-weight: bold; font-size: 14px; }
.side-bd { border: 1px solid #c7dcee; border-top: 0; padding: 4px 0; }
.p_list1 { padding: 5px 0 5px 14px; border-bottom: 1px dashed #e0e0e0; }
.p_list1 img { margin-right: 4px; }
.p_list1 a { color: #333333; }
.p_list1 a:hover { color: #ff6600; }

/* 联系方式块 */
.contact-box .side-bd { padding: 10px 12px; line-height: 1.9; color: #333333; font-size: 12px; }
.contact-box .side-bd b { color: #4681bc; }
.contact-box .side-bd .row { margin-bottom: 2px; }

/* ===================== 焦点图轮播 ===================== */
.slideBox { width: 720px; height: 230px; overflow: hidden; position: relative; border: 1px solid #dddddd; margin: 8px auto 0; }
.slideBox .bd { position: relative; height: 100%; }
.slideBox .bd ul { margin: 0; padding: 0; }
.slideBox .bd li { zoom: 1; display: none; }
.slideBox .bd li:first-child { display: block; }
.slideBox .bd img { width: 720px; height: 230px; display: block; }
.slideBox .hd { height: 15px; overflow: hidden; position: absolute; right: 5px; bottom: 5px; z-index: 2; }
.slideBox .hd ul { overflow: hidden; zoom: 1; float: left; }
.slideBox .hd ul li { float: left; margin-right: 2px; width: 15px; height: 15px; line-height: 14px; text-align: center; background: #ffffff; color: #333; cursor: pointer; font-size: 11px; }
.slideBox .hd ul li.on { background: #f00; color: #fff; }

/* ===================== 区块标题 ===================== */
.sec-hd { width: 720px; margin: 14px auto 0; height: 28px; line-height: 28px; border-bottom: 2px solid #4681bc; position: relative; }
.sec-hd .t { font-size: 15px; font-weight: bold; color: #4681bc; padding-left: 4px; }
.sec-hd .more { position: absolute; right: 6px; top: 0; font-size: 12px; }
.sec-hd .more a { color: #888; }
.sec-hd .more a:hover { color: #ff6600; }

/* ===================== 产品展示网格 ===================== */
.pro-grid { width: 720px; margin: 8px auto 0; }
.pro-grid ul { overflow: hidden; }
.pro-grid li { float: left; width: 138px; margin: 6px 6px; text-align: center; }
.pro-grid li a.img { display: block; border: 1px solid #cccccc; padding: 3px; }
.pro-grid li a.img:hover { border-color: #ff6600; }
.pro-grid li a.img img { width: 130px; height: 108px; }
.pro-grid li .name { display: block; height: 22px; line-height: 22px; overflow: hidden; color: #333; }
.pro-grid li .name:hover { color: #ff6600; }

/* ===================== 新闻列表 ===================== */
.news-list { width: 720px; margin: 8px auto 0; }
.news-list li { height: 28px; line-height: 28px; border-bottom: 1px dotted #cccccc; padding-left: 14px; background: url(/images/plus.gif) no-repeat 2px 10px; overflow: hidden; }
.news-list li a { color: #333; }
.news-list li a:hover { color: #ff6600; }
.news-list li .date { float: right; color: #999; padding-right: 6px; }

/* ===================== 内容正文 ===================== */
.detail { padding: 6px 4px; }
.detail .title { text-align: center; font-size: 18px; font-weight: bold; color: #4681bc; padding: 10px 0; }
.detail .meta { text-align: center; color: #999; border-bottom: 1px solid #eee; padding-bottom: 8px; margin-bottom: 10px; }
.detail .meta em { font-style: normal; margin: 0 8px; }
.detail .content { line-height: 2; font-size: 13px; color: #333; }
.detail .content img { max-width: 100%; height: auto; border: 1px solid #ccc; padding: 3px; margin: 6px 0; }
.detail .content p { margin: 6px 0; text-indent: 2em; }
.detail .spec { margin-top: 14px; border: 1px solid #e3e3e3; background: #fafcff; }
.detail .spec-hd { background: #4681bc; color: #fff; font-weight: bold; padding: 6px 12px; }
.detail .spec-bd { padding: 10px 12px; line-height: 2; font-size: 13px; color: #333; white-space: pre-wrap; }
.page-content { line-height: 2; font-size: 13px; color: #333; }
.page-content img { max-width: 100%; height: auto; border: 1px solid #ccc; padding: 3px; margin: 6px 0; }

/* 列表分页 */
.pager { text-align: center; margin: 14px 0; }
.pager a, .pager span { display: inline-block; padding: 3px 10px; margin: 0 2px; border: 1px solid #ddd; color: #333; }
.pager a:hover { border-color: #ff6600; color: #ff6600; text-decoration: none; }
.pager .active { background: #4681bc; color: #fff; border-color: #4681bc; }
/* ThinkPHP 默认 Bootstrap 分页结构：ul.pagination > li > a/span，位于 .news-list 内部时需覆盖 li 样式 */
.pager .pagination { margin: 0; padding: 0; display: inline-block; }
.pager .pagination li {
    display: inline-block;
    float: none;
    width: auto;
    height: auto;
    line-height: normal;
    border: 0;
    padding-left: 0;
    background: none;
    overflow: visible;
    margin: 0 2px;
}
.pager .pagination li a,
.pager .pagination li span {
    display: inline-block;
    padding: 3px 10px;
    border: 1px solid #ddd;
    color: #333;
}
.pager .pagination li.active span,
.pager .pagination li a:hover {
    background: #4681bc;
    color: #fff;
    border-color: #4681bc;
    text-decoration: none;
}

/* ===================== 页脚 ===================== */
.footer { width: 980px; margin: 0 auto; background: #ffffff; padding: 12px 0 18px; text-align: center; font-size: 12px; color: #666; border-top: 2px solid #4681bc; clear: both; }
.footer .divider { height: 6px; background: url(/images/ffoo.gif) repeat-x; margin-bottom: 10px; }
.footer .keywords { margin: 4px 0; }
.footer .keywords a { color: #333; font-weight: bold; margin: 0 4px; }
.footer .keywords a:hover { color: #ff6600; }
.footer .copyright { line-height: 1.9; color: #666; }
.footer .copyright a { color: #4681bc; }
.footer .lic { margin: 8px 0; }
.footer .lic a img { border: 1px solid #ddd; padding: 2px; }

/* 访客留言表单 */
.guest-form { padding: 10px 4px; }
.guest-form .form-row { margin: 8px 0; }
.guest-form label { display: inline-block; width: 80px; text-align: right; color: #4681bc; }
.guest-form input[type=text], .guest-form textarea { border: 1px solid #999; background: #d6e7f3; padding: 4px; width: 320px; font-size: 12px; }
.guest-form textarea { height: 90px; }
.guest-form .btn { background: #4681bc; color: #fff; border: 0; padding: 6px 22px; cursor: pointer; font-size: 13px; margin-left: 84px; }
.guest-form .btn:hover { background: #0056e8; }

/* 响应式（移动端简单适配，保持可用） */
@media (max-width: 1000px) {
    .wrap, .topbar, .mainnav, .mainnav ul, .layout, .layout .cols, .footer { width: 100%; }
    .topbar .logo, .topbar .topright { float: none; width: 100%; height: auto; text-align: center; }
    .mainnav li { width: 25%; }
    .layout .side, .layout .main { float: none; width: 100%; }
    .slideBox, .sec-hd, .pro-grid, .news-list { width: 100%; }
    .slideBox .bd img { width: 100%; }
    .pro-grid li { width: 46%; margin: 6px 2%; }
}