/* ============================================================
   nb-easy.cn 主样式表
   保留原网站视觉风格，现代化底层布局
   ============================================================ */

/* --- 基础重置 --- */
* { margin:0; padding:0; box-sizing:border-box; }

body {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #333;
    background: #fff;
    line-height: 1.6;
}

img { border: 0; vertical-align: bottom; }
a { color: #333; text-decoration: none; }
a:hover { color: #000; text-decoration: underline; }

/* --- 页面容器 --- */
.page {
    width: 100%;
    max-width: 790px;
    margin: 0 auto;
    background: #fff;
}

/* --- 头部 --- */
.head {
    background: #fff;
    padding: 0;
}

#menu {
    width: 100%;
    border-collapse: collapse;
}

#menu td {
    background: 
        url('../images/menu-LC.png') no-repeat left top,
        url('../images/menu-RC.png') no-repeat right top,
        url('../images/menu-BG.gif') repeat-x;
}

#menu th {
    width: 1px;
}

#menu th em {
    display: block;
    height: 45px;
}

#menu ul {
    list-style: none;
    margin: 4px 0;
    padding: 0 0 0 15px;
    overflow: hidden;
    height: 37px;
}

#menu li {
    float: left;
    margin: 0;
    padding: 0;
    list-style: none;
}

#menu a {
    display: block;
    float: left;
    height: 37px;
    padding: 13px 25px 10px;
    color: #f5f5f5;
    font-weight: bold;
    text-decoration: none;
    background: url('../images/menu-link-BG.gif') no-repeat 100% 0;
    letter-spacing: 1px;
    white-space: nowrap;
}

#menu a:hover,
#menu a.active {
    background: url('../images/menu-link-active-BG.gif') no-repeat 100% 0;
    color: #ffffcc;
}

/* --- 搜索框 --- */
.head input#keyword {
    border: 1px solid #ccc;
    padding: 3px 4px;
    font-size: 12px;
    width: 128px;
}

/* --- 圆角边框（保留原png风格） --- */
.body-struct { width: 100%; border-collapse: collapse; }
.body-struct .E1, .body-struct .E3,
.body-struct .E7, .body-struct .E9 { width: 14px; height: 14px; }
.body-struct .E1 { background: url('../images/body-struct-E1.png') no-repeat; }
.body-struct .E2 { background: url('../images/body-struct-E2.png') repeat-x top; }
.body-struct .E3 { background: url('../images/body-struct-E3.png') no-repeat; }
.body-struct .E4 { background: url('../images/body-struct-E4.png') repeat-y; width: 14px; }
.body-struct .E6 { background: url('../images/body-struct-E6.png') repeat-y; width: 14px; }
.body-struct .E7 { background: url('../images/body-struct-E7.png') no-repeat; position: relative; }
.body-struct .E8 { background: url('../images/body-struct-E8.png') repeat-x top; }
.body-struct .E9 { background: url('../images/body-struct-E9.png') no-repeat; position: relative; }
.body-struct .E7 .LC { margin-top: -86px; background: url('../images/body-content-BG.gif') no-repeat; width: 10px; position: absolute; height: 86px; margin-left: -3px; }
.body-struct .E9 .RC { margin-top: -91px; background: url('../images/body-content-BG.gif') no-repeat; width: 10px; position: absolute; height: 86px; margin-left: -7px; }

.body-content {
    background: #fff url('../images/body-content-BG.gif') repeat-x 0px 100%;
    padding: 3px 0;
}

.body-content .hr { margin: 18px 0; }

/* 左右布局 */
.body-content-struct { width: 100%; padding: 0 8px; }
.column-1 { width: auto; padding: 0 0 0 20px; }
.column-2 { width: 180px; min-width: 180px; vertical-align: top; }

/* --- 左侧分类面板 --- */
.lpanel {
    background: url('../images/lpanel-BG.gif') repeat-y right;
    padding: 10px 10px 10px 15px;
}

.lpanel h2 {
    font-size: 12px;
    color: #333;
    margin: 0 0 5px 0;
    padding: 0;
}

.lpanel h2 a {
    color: #4A4F80;
    font-weight: bold;
    text-decoration: none;
}

.lpanel h2 a:hover { color: #6C70AA; }

.lpanel ul {
    list-style: none;
    padding: 0 0 5px 15px;
    margin: 0;
}

.lpanel ul li {
    padding: 2px 0;
    background: url('../images/li-item.gif') no-repeat left center;
    padding-left: 12px;
}

.lpanel ul li a {
    color: #555;
    font-size: 11px;
}

.lpanel ul li a:hover { color: #000; }

/* --- 产品展示区域 --- */
h2 span.prev01 {
    font-size: 14px;
    color: #4A4F80;
    font-weight: bold;
}

.prev01 {
    padding: 5px 0;
    line-height: 1.7;
    color: #444;
}

.prev01 p { margin: 5px 0; }

.chugreen {
    color: #4A4F80;
    font-weight: bold;
    font-size: 11px;
    text-align: center;
}

.green03 { color: #555; font-size: 11px; }

.preview {
    background: #f5f5f0;
    border: 1px solid #ddd;
    padding: 8px 12px;
    margin: 5px 0;
}

.preview a { color: #4A4F80; font-weight: bold; }

/* --- 产品网格（适应现代浏览器） --- */
.product-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: center;
    padding: 10px 0;
}

.product-item {
    width: 176px;
    text-align: center;
}

.product-item img {
    max-width: 176px;
    height: auto;
}

/* --- 底部 --- */
.body-foot-struct { width: 100%; margin: 10px 0; }
.body-foot-struct td {
    width: 33%;
    text-align: center;
    padding: 8px;
    vertical-align: top;
}
.body-foot-struct td.last { border-right: none; }
.body-foot-struct .bigIco { margin-bottom: 5px; }

.foot {
    padding: 5px 0;
    text-align: center;
}

.foot-links { padding: 10px; }
.foot-links-struct { width: 100%; }
.foot-links-struct .copy { color: #666666; font-size: 11px; }
.foot-links-struct .links { text-align: right; }
.foot-links-struct .links a {
    color: #666666;
    font-size: 11px;
    padding: 0 5px;
}
.foot-links-struct .links a.last { border-right: none; }

/* --- 分页 --- */
.pagination {
    text-align: center;
    margin: 15px 0;
    font-size: 11px;
}

.pagination a,
.pagination span {
    display: inline-block;
    padding: 3px 8px;
    margin: 0 2px;
    border: 1px solid #ddd;
    color: #333;
    text-decoration: none;
    border-radius: 2px;
}

.pagination .current {
    background: #4A4F80;
    color: #fff;
    border-color: #4A4F80;
}

.pagination .disabled { color: #ccc; border-color: #eee; }

.pagination input {
    width: 30px;
    padding: 2px;
    border: 1px solid #ddd;
    text-align: center;
    font-size: 11px;
}

/* --- 登录页 --- */
.page-index p .grey14.red { color: #cc0000; font-size: 14px; font-weight: bold; }
.black { color: #333; }
.text { border: 1px solid #ccc; padding: 3px; font-size: 12px; }

/* --- 响应式（手机适配） --- */
@media (max-width: 768px) {
    .page { width: 100%; border: none; }
    .body-content-struct, .body-content-struct tr,
    .body-content-struct td { display: block; width: 100%; }
    .column-2 { width: 100%; min-width: 100%; }
    .lpanel { background: none; border-bottom: 1px solid #ddd; }
    #menu ul { flex-wrap: wrap; }
    #menu ul li { flex: 1; text-align: center; }
    #menu ul li a { padding: 0 10px; font-size: 11px; }
    .head table { width: 100%; }
    .head table td { display: block; width: 100%; text-align: center; }
}

/* --- 清除浮动 --- */
.clear { clear: both; }
.mV10 { margin-bottom: 10px; }
.b { font-weight: bold; }
