@charset "utf-8";
/*!
 * yichu 主题补充样式
 *
 * g.css / s.css / index.css 三个文件是原站（ks-yichu.com）样式表的原样拷贝，不改动。
 * 原站的每个页面在 <head> 里还各带一段内联 <style>，本文件把它们按页归类收拢在一起，
 * 只做了两处必要调整：
 *   1. .child_banner 的背景由 /static/image/child_banner.jpg 换到主题内的 ../image/；
 *   2. 需要区分页面的规则（如产品详情页标题左对齐）用 body 上的 pg-* 类限定范围。
 */

/* ---------- 全站：内页小banner 与面包屑（原内联样式，路径改为主题内） ---------- */
.child_banner {
    background: url(../image/child_banner.jpg) no-repeat center center;
    background-size: cover;
    text-align: center;
    height: 300px;
}

.page .ico {
    height: 60px;
}

.page .ico img {
    padding-top: 20px;
}

/* 没有子栏目的单页不输出左侧栏目树，右侧内容区改为一整行 */
.s_main .right.w-full {
    width: 100%;
    float: none;
}

/* ---------- 顶部导航：栏目数不固定，按实际项数等分 ----------
 * 原样式 .g_header .main .nav > li{width:12.5%} 是按 8 个栏目写死的。
 * 模板（header.html）会按「首页 + 可见顶层栏目」的实际数量算出百分比写在每个 li 的行内样式上，
 * 所以这里不再覆盖宽度；窄屏下导航变成竖列，行内百分比要让位给 width:auto。
 */
@media (max-width: 1024px) {
    .g_header .main .nav > li {
        width: auto !important;
    }
}

/* ---------- 产品网格：首页「最新产品」与产品列表页（原内联样式） ---------- */
.s_main .right .con .product .list {
    margin-left: -38px;
    overflow: hidden;
    margin-bottom: -35px;
    margin-top: 35px;
}

.s_main .right .con .product .list > li {
    float: left;
    width: 33.33%;
    padding-left: 38px;
    padding-bottom: 35px;
}

.s_main .right .con .product .list > li .box .pic img {
    border: 1px solid #eaeaea;
    width: 100%;
}

.s_main .right .con .product .list > li .box .p1 {
    text-align: center;
    font-size: 16px;
    color: #666;
    padding-top: 20px;
}

.s_main .right .con .product .list > li:nth-child(3n+1) {
    clear: both;
}

@media (max-width: 1024px) {
    .s_main .right .con .product .list > li {
        width: 33.33%;
    }

    .s_main .right .con .product .list > li .box .pic img {
        width: 100%;
    }
}

@media (max-width: 800px) {
    .s_main .right .con .product .list > li {
        width: 50%;
    }

    .s_main .right .con .product .list > li:nth-child(n) {
        clear: none;
    }

    .s_main .right .con .product .list > li:nth-child(2n+1) {
        clear: both;
    }
}

@media (max-width: 600px) {
    .s_main .right .con .product .list > li {
        width: 100%;
    }
}

/* ---------- 新闻列表（原内联样式） ---------- */
.s_main .right .con .news .list > li .box {
    display: block;
    overflow: hidden;
    padding: 14px 0 18px 0;
    border-bottom: 1px solid #eaeaea;
}

.s_main .right .con .news .list > li .box .pic {
    float: left;
    padding-right: 17px;
}

.s_main .right .con .news .list > li .box .font {
    float: left;
}

.s_main .right .con .news .list > li .box .font .p1 {
    font-size: 16px;
    color: #333;
    padding-top: 10px;
}

.s_main .right .con .news .list > li .box .font .time {
    font-size: 12px;
    color: #999;
    padding: 10px 0 6px 0;
}

.s_main .right .con .news .list > li .box .font .p2 {
    font-size: 12px;
    color: #999;
    line-height: 24px;
}

.s_main .right .con .news .list > li .box .font .more {
    display: inline-block;
    font-size: 12px;
    padding: 11px 28px;
    color: #fff;
    background: #acaeb0;
    margin-top: 10px;
}

.s_main .right .con .news .list > li .box:hover .font .more {
    background: #3bb35c;
}

/* 列表缩略图：参考导出里这一格是空图，这里给固定尺寸；无缩略图时用主题内的 nopic.png */
.s_main .right .con .news .list > li .box .pic img {
    display: block;
    width: 200px;
    height: 140px;
    object-fit: cover;
}

@media (max-width: 1024px) {
    .s_main .right .con .news .list > li .box .pic {
        float: none;
        padding-right: 0;
        text-align: center;
    }

    .s_main .right .con .news .list > li .box .font {
        float: none;
        max-width: none;
    }

    .s_main .right .con .news .list > li .box .pic img {
        margin: 0 auto;
    }
}

/* ---------- 详情页正文 / 单页正文（原内联样式） ---------- */
.s_main .right .con .fb_time {
    text-align: center;
    font-size: 12px;
    color: #999;
    padding: 18px 0 24px 0;
}

.s_main .right .con .g_content {
    font-size: 14px;
    color: #666;
    line-height: 30px;
}

/* ---------- 产品详情页（原内联样式；标题左对齐只在产品详情页生效） ---------- */
body.pg-product-show .s_main .right .con .title {
    text-align: left;
}

.s_main .right .com .cp_detail {
    margin-top: 26px;
}

.s_main .right .com .cp_detail .t {
    overflow: hidden;
}

.s_main .right .com .cp_detail .t .pic {
    float: left;
}

.s_main .right .con .font {
    float: left;
    padding: 13px 0 0 0;
}

.s_main .right .con .s1 {
    display: block;
    font-size: 16px;
    color: #333;
    line-height: 30px;
}

.s_main .right .com .cp_detail .b {
    overflow: hidden;
    margin-top: 30px;
}

.s_main .right .com .cp_detail .b .p1 {
    border-bottom: 1px solid #eaeaea;
}

.s_main .right .com .cp_detail .b .p1 .bt {
    padding: 15px 30px;
    background: #3bb35c;
    display: inline-block;
    color: #fff;
}

.s_main .right .com .cp_detail .b .g_content {
    font-size: 14px;
    color: #666;
    margin-top: 35px;
    line-height: 30px;
}

@media (max-width: 1024px) {
    .s_main .right .com .cp_detail .t .pic {
        float: none;
        text-align: center;
    }

    .s_main .right .com .cp_detail .t .font {
        float: none;
        padding: 13px 0 0 0;
        text-align: center;
    }
}

/* ---------- 分页 ----------
 * addons/cms/paginator/Page.php 输出 Bootstrap 风格的
 * <ul class="pagination"><li><a>..</a></li><li class="active"><span>..</span></li></ul>，
 * 而原站样式（s.css）里的 .g_page > ul > li 只匹配 .g_page 的直接子 ul；
 * 这里的分页放在原站自己的 .diy_page 容器里，所以整套外观在主题内补齐。
 * Page.php 由默认主题共用，前后翻页的 « / » 用 CSS 换成「上一页 / 下一页」。
 */
.g_page .diy_page ul.pagination {
    display: inline-block;
    overflow: hidden;
}

.g_page .diy_page ul.pagination > li {
    float: left;
    margin: 0 5px;
    line-height: 35px;
}

.g_page .diy_page ul.pagination > li > a,
.g_page .diy_page ul.pagination > li > span {
    display: block;
    margin: 0;
    padding: 0 15px;
    background: #fff;
    border: 1px solid #e8e8e8;
    color: #888;
}

.g_page .diy_page ul.pagination > li > a:hover,
.g_page .diy_page ul.pagination > li.active > span {
    background: #3bb35c;
    border-color: #3bb35c;
    color: #fff;
}

.g_page .diy_page ul.pagination > li.disabled > span {
    color: #ccc;
    cursor: not-allowed;
}

.g_page .diy_page ul.pagination > li:first-child > a,
.g_page .diy_page ul.pagination > li:first-child > span,
.g_page .diy_page ul.pagination > li:last-child > a,
.g_page .diy_page ul.pagination > li:last-child > span {
    font-size: 0;
}

.g_page .diy_page ul.pagination > li:first-child > a:before,
.g_page .diy_page ul.pagination > li:first-child > span:before {
    content: "上一页";
    font-size: 14px;
}

.g_page .diy_page ul.pagination > li:last-child > a:before,
.g_page .diy_page ul.pagination > li:last-child > span:before {
    content: "下一页";
    font-size: 14px;
}

/* 共 N 条 / 当前 X/Y 页（对应原站 .diy_page .page-status） */
.g_page .page-status {
    margin: 0 10px;
}

/* 首页产品区底部的「查看更多」按钮（沿用原站 .main4 .offset .btn .more 的外观） */
.g_page .diy_page .more {
    display: inline-block;
    padding: 18px 45px;
    background: #12425f;
    color: #fff;
    font-size: 16px;
}

.g_page .diy_page .more:hover {
    background: #3bb35c;
    color: #fff;
}

/* ---------- 空数据提示 ---------- */
.g_page .no-data,
.s_main .no-data {
    padding: 60px 0;
    text-align: center;
    color: #999;
}

/* ---------- 产品详情主图 ----------
 * 原站给主图写死 width/height=378，这里只限制最大宽度，避免图片被拉变形。
 */
.s_main .right .com .cp_detail .t .pic img {
    max-width: 378px;
}

/* ---------- 站内搜索表单 / 标签云 ----------
 * 原站没有导出这两块的样式（站上也没有搜索入口），按站点配色补最小实现。
 */
.search-form {
    padding: 30px 0 60px 0;
    text-align: center;
}

.search-form .search-input {
    width: 420px;
    max-width: 70%;
    height: 44px;
    line-height: 44px;
    padding: 0 15px;
    border: 1px solid #eaeaea;
    font-size: 14px;
    color: #666;
}

.search-form .search-btn {
    height: 44px;
    padding: 0 35px;
    border: 0;
    background: #3bb35c;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
}

.search-form .search-btn:hover {
    background: #12425f;
}

.tag-cloud .tag {
    display: inline-block;
    margin: 0 10px 12px 0;
    padding: 10px 18px;
    border: 1px solid #eaeaea;
    font-size: 14px;
    color: #666;
}

.tag-cloud .tag:hover {
    background: #3bb35c;
    border-color: #3bb35c;
    color: #fff;
}

.tag-cloud .tag .count {
    margin-left: 8px;
    color: #3bb35c;
}

.tag-cloud .tag:hover .count {
    color: #fff;
}
