﻿.container, .layout-main, .ad-banner, .top-search-container, .tj-box, .province-sections, .channel-links, .footer { width: 1560px; margin: 0 auto; }
@media screen and (max-width: 1599px) { .container, .layout-main, .ad-banner, .top-search-container, .tj-box, .province-sections, .channel-links, .footer { width: 1190px; } }

* { margin: 0; padding: 0; font-size: 14px; color: #333; text-align: left; font-family: "微软雅黑", sans-serif; }
a { text-decoration: none; color: inherit; }
img { border: 0; max-width: 100%; display: block; }
.fl { float: left; } .fr { float: right; } .clear { clear: both; }
.text-center { text-align: center; } .text-left { text-align: left; } .text-right { text-align: right; }
.relative { position: relative; } .absolute { position: absolute; }
.mt-10 { margin-top: 10px; } .mb-10 { margin-bottom: 10px; } .ml-10 { margin-left: 10px; } .mr-10 { margin-right: 10px; } .pb-20 { padding-bottom: 20px; }
.bg-white { background-color: #fff; } 
.bg-gray-light { background-color: #f6f6f6; }
 .bg-gray-lighter { background-color: #f7f7f7; } 
 .bg-red-primary { background-color: #e62a2a; } 
 .bg-red-dark { background-color: #d11120; } 
 .bg-orange-highlight { background-color: #ff6a00; }
.border-top-red { border-top: 2px solid #ff6a00; } .border-top-orange { border-top: 2px solid #ff6a00; } .border-dashed-gray { border: 1px dashed #cecece; }
.location-bar { width: 100%; height: 40px; line-height: 40px; font-size: 18px; }

@font-face { font-family: "iconfont"; src: url('/css/iconfont/iconfont.eot'); src: url('/css/iconfont/iconfont.eot#iefix') format('embedded-opentype'), url('/css/iconfont/iconfont.woff') format('woff'), url('/css/iconfont/iconfont.ttf') format('truetype'), url('/css/iconfont/iconfont.svg#iconfont') format('svg'); }
.iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale; }

.top-banner { background-color: #f6f6f6; border-bottom: 1px #e6e6e6 solid; height: 34px; }
.top-banner-cell { line-height: 34px; }
.link-blue { color: #005fc4; margin-right: 10px; }
.app-download { position: relative; display: inline-block; text-align: center; padding: 0 5px; }
.app-download:hover .app-qrcode { display: block; }
.app-qrcode { position: absolute; z-index: 999; border: 5px solid #fff; border-radius: 3px; margin-top: 15px; margin-left: -30px; display: none; transition: opacity 0.3s, visibility 0.3s; }

.top { width: 100%; min-width: 1190px; background-color: #f6f6f6; border-bottom: 1px solid #e6e6e6; box-sizing: border-box; }
.top-section-1 { height: 34px; line-height: 34px; }
.top-box { width: 1190px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; height: 100%; box-sizing: border-box; padding: 0 10px; }
.top-box-left { font-size: 12px; color: #666; white-space: nowrap; }
.top-box-left a { color: #005fc4; margin-left: 8px; font-size: 12px; text-decoration: none; }
.top-box-left a:hover { text-decoration: underline; }
.top-box-right { display: flex; align-items: center; gap: 15px; }
.box-right-sm { position: relative; display: flex; align-items: center; font-size: 12px; color: #666; white-space: nowrap; cursor: default; }
.box-right-sm-title .iconfont { font-size: 10px; margin-left: 2px; }
.box-right-sm-img { position: absolute; top: 100%; right: 0; width: 100px; height: 100px; background-color: #fff; border: 1px solid #ddd; padding: 5px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); opacity: 0; visibility: hidden; z-index: 1000; }
.box-right-sm:hover .box-right-sm-img { opacity: 1; visibility: visible; }
.top-box-right a { color: #005fc4; font-size: 12px; text-decoration: none; }
.top-box-right a:hover { text-decoration: underline; }
.top-section-2 { padding: 10px 0; background-color: #fff; }
.top-section-2-container { width: 1190px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; box-sizing: border-box; }
.logo img { height: 60px; width: auto; display: block; }
.search.search-pc { display: flex; align-items: center; flex-grow: 1; max-width: 520px; margin: 0 20px; border:2px #e62a2a solid; }
.search-box { flex-grow: 1; position: relative; display: flex; align-items: center;  }
.search-box .iconfont { position: absolute; left:10px; color: #999; z-index: 2; }
.search-input { width: 300px; height: 40px; padding: 0 30px; font-size: 14px;  height: 40px; border: 0px;  background: linear-gradient(#bbbbbb 0% ,#ffffff 20%,#ffffff 100%); }
.search-input:focus { border-color: #e62a2a; }
.search-btn-box { display: flex; height: 42px; }
.search-input-box { display: inline-block; margin-left: 20px; }

.search-button { width: 80px; height: 42px; border: 0; background-color: #e62a2a; color: #fff; font-size: 16px; cursor: pointer; margin-left: -5px; }
.search-button:hover { background-color: #d11120; }

.s-product, .s-company { display: flex; align-items: center; justify-content: center; width:80px; height: 100%; background-color: #e62a2a; color: #fff; font-size: 14px; font-weight: bold; cursor: pointer; user-select: none; border: 0px solid #e62a2a; border-left-width: 1px; }
.s-product { border-radius: 0 0 0 0; } .s-company { border-radius: 0 4px 4px 0; }
.s-product:hover, .s-company:hover { background-color: #d11120; }
.contact-phone { font-size: 14px; color: #333; white-space: nowrap; }
.contact-phone i { font-style: normal; margin-right: 5px; color: #666; }
.contact-phone span { color: #e62a2a; font-weight: bold; }
.top-section-3 { background-color: #fff; border-top: 1px solid #eee; border-bottom: 1px solid #eee; box-shadow: 0 2px 4px -1px rgba(0,0,0,0.06); }
.top-section-3 > div { width: 1190px; margin: 0 auto; display: flex; align-items: center; min-height: 46px; box-sizing: border-box; }
.nav-links { flex-grow: 1; padding: 0 10px; }
.nav-links a { padding: 0px 25px;  height: 30px; line-height: 30px;  font-size: 16px;  color: #222;  margin-right: 10px; font-weight: bolder; }
.nav-links a:hover { color: #e62a2a; }
.search-keywords.search-pc { padding: 0 10px; font-size: 0; }
.search-keywords span { font-size: 14px; color: #999; line-height: 46px; margin-right: 8px; }
.search-keywords a { display: inline-block; font-size: 13px; color: #005fc4; text-decoration: none; line-height: 46px; margin: 0 5px; padding: 2px 6px; border-radius: 3px; }
.search-keywords a:hover { color: #e62a2a; background-color: #f8f8f8; }

.nav-link { display: inline-block; padding: 0 15px; height: 46px; line-height: 46px; color: #333; }
.nav-link:hover { color: #e62a2a; }
.search-tab-active { background: linear-gradient(to bottom, #e62a2a, #d11120); color: #fff !important; }
.search-keyword { margin: 0 5px; color: #005fc4; font-size: 12px; }
.search-keyword:hover { color: #e62a2a; text-decoration: underline; }

.container-narrow { width: 1190px; margin: 0 auto; }
.ad-banner-narrow { width: 1190px; height: auto; margin: 15px auto; overflow: hidden; }
.ad-banner-narrow img { width: 100%; max-width: 100%; }

.footer { background: #fff; text-align: left; border-top: 1px #cecece solid; padding: 10px 0 20px; height: auto; overflow: hidden; display: flex; justify-content: center; align-items: flex-start; }
.footer_content { display: flex; justify-content: flex-start; align-items: center; width: 1560px; gap: 20px; padding: 0 10px; box-sizing: border-box; }
.foot_logo { flex-shrink: 0; }
.foot_logo a img { height: 50px; width: auto; display: block; }
.foot_info { flex-grow: 1; text-align: left; line-height: 30px; color: #5b5555; display: flex; flex-wrap: wrap; gap: 5px; align-items: center; }
.foot_info a { color: #5b5555; text-decoration: none; padding: 0 5px; white-space: nowrap; }
.foot_info a:hover { color: #e62a2a; text-decoration: underline; }
@media screen and (max-width: 1599px) { .footer_content { width: 1190px; } }
@media only screen and (max-width: 900px) { .footer_content { width: 100%; flex-direction: column; align-items: center; gap: 10px; padding: 0 5px; } .foot_logo { order: 1; text-align: center; } .foot_info { order: 2; justify-content: center; text-align: center; font-size: 12px; } .foot_info a { padding: 0 3px; font-size: inherit; } }

@media only screen and (max-width: 900px) {
    .container, .container-narrow, .ad-banner-narrow { width: 100%; margin: 0 auto; }
    .ad-banner-narrow { display: none !important; }
    .mobile-reg-ad { display: block !important; }
    .mobile-reg-ad img { display: block !important; width: 100%; }
    .mobile-ads-grid { border: 1px #cecece solid; border-top: 1px solid; box-sizing: border-box; margin: 1%; width: 98%; display: block; float: left; }
    .hidden-pc { display: none !important; }
    .top-nav-mobile { display: block; overflow: hidden; clear: both; }
    .nav-tabs-mobile { display: block; width: 100%; height: auto; overflow: hidden; justify-content: center; }
    .nav-tabs-mobile a { width: 25%; padding: 0; height: auto; line-height: 25px; font-size: 15px; color: #222; margin-right: 0; float: left; text-align: center; overflow: hidden; display: inline-block; }
    .nav-tabs-mobile a i { width: 100%; text-align: center; display: inline-block; font-size: 24px; color: #d11120; line-height: 35px; }
    .nav-tabs-mobile a:nth-child(1) i::before { content: "\e67e"; }
    .nav-tabs-mobile a:nth-child(2) i::before { content: "\e61e"; }
    .nav-tabs-mobile a:nth-child(3) i::before { content: "\e791"; }
    .nav-tabs-mobile a:nth-child(4) i::before { content: "\e600"; }
    .nav-tabs-mobile a:nth-child(5) i::before { content: "\e64a"; }
    .nav-tabs-mobile a:nth-child(6) i::before { content: "\e64b"; }
    .nav-tabs-mobile a:nth-child(7) i::before { content: "\e621"; }
    .nav-tabs-mobile a:nth-child(8) i::before { content: "\e7d8"; }
    .mobile-logo-search { display: block; width: 100%; margin: 10px auto; height: auto; overflow: hidden; clear: both; }
    .mobile-search-container { width: 65%; height: 40px; background: linear-gradient(#bbb 0%, #fff 20%, #fff 100%); border: 2px #e62a2a solid; float: left; align-items: center; margin-left: 0; }
    .mobile-search-container span { color: #e6e6e6; font-size: 20px; margin: 0 10px; }
    .mobile-search-input { width: 56%; line-height: 40px; height: 40px; border: 0; background: linear-gradient(#bbb 0%, #fff 20%, #fff 100%); }
    .mobile-search-btn-container { width: 30%; float: left; background: #fff; border: 2px #e62a2a solid; border-left: 0; }
    .mobile-search-btn { background: #e62a2a; display: block; font-size: 13px; width: 100%; height: 40px; line-height: 40px; text-align: center; color: #fff; }
    .mobile-search-btn:first-child { text-indent: 10px; }
    .mobile-search-btn:last-child { text-indent: 10px; margin-left: 1px; }
    .section-card { background: #fff; border: 1px #cecece solid; border-top: 2px #ff6a00 solid; padding: 10px; box-sizing: border-box; margin: 1%; width: 98%; display: block; float: left; }
    .main-content, .sidebar, .w240 { width: 98%; clear: both; margin-bottom: 10px; }
    .w930 { width: 100%; }
    .tieba-container { display: block; width: 100%; }
    .content-wrapper { width: 98%; margin: 0 auto; height: auto; display: block; align-items: center; }
    .sidebar-extra, .tieba-link { display: none; }
    .list-container { border: 1px #d5d8dc solid; margin: 1%; width: 98%; display: block; overflow: hidden; clear: both; }
    .list-container-inner { display: block; flex-wrap: wrap; padding: 10px 0; }
    .list-container-inner a { width: 100%; }
    .company-list-item { border: 1px #cecece solid; border-top: 2px #ff6a00 solid; padding: 1%; box-sizing: border-box; margin: 1%; width: 98%; display: block; float: left; overflow: hidden; clear: both; }
    .item-with-icon { width: 100%; line-height: 35px; height: 35px; overflow: hidden; float: left; }
    .item-with-icon a::before { content: "\e607"; }
    .item-type { width: 100%; float: left; margin-left: 10px; display: inline-block; }
    .row-between { display: block; justify-content: space-between; }
    .state-list a { display: inline-block; width: 50%; overflow: hidden; height: 28px; white-space: nowrap; text-overflow: ellipsis; color: #767676; }
    .industry-list a { display: inline-block; width: 100%; overflow: hidden; height: 28px; white-space: nowrap; text-overflow: ellipsis; color: #767676; padding-right: 10px; box-sizing: border-box; }
    .company-list a { display: inline-block; width: 50%; overflow: hidden; height: 28px; white-space: nowrap; text-overflow: ellipsis; color: #767676; padding-right: 10px; box-sizing: border-box; }
    .channel-links-mobile { display: none; width: 100%; margin: 5px auto 10px; }
    .link-title-hidden { display: none; }
    .footer-main, .footer-logo, .footer-links { width: 100%; }
    .footer-content { display: block; float: left; }
    .links-flex-box { display: block; float: left; }
    .links-flex-box a { padding: 0 5px; line-height: 25px; }
    .copyright-info { text-align: left; line-height: 30px; display: block; float: left; }
    .copyright-info a { padding: 0 4px; line-height: 25px; }
    .row-between { display: block; }
    .state-list a { width: 50%; }
    .industry-list a { width: 100%; padding-right: 10px; }
    .company-list a { width: 50%; }
    .channel-links-mobile { display: none; width: 100%; }
    .hidden-qr-code { display: none; }
}

/* 云黄页特有样式 - 公共部分 */
.main-page-container { width: 100%; box-sizing: border-box; }
.mobile-reg-ad { display: none; }
/* 修正 .section-card 样式，使其更适合新的布局结构 */
.section-card { 
    background: #fff; 
    border: 1px #cecece solid; 
    border-top: 2px #ff6a00 solid; /* 顶部橙色强调线 */
    padding: 15px; /* 增加内边距 */
    box-sizing: border-box; 
    margin-bottom: 20px; /* 使用 margin-bottom 替代之前的百分比 margin 和 float */
    width: 100%; /* 占满容器宽度 */
    clear: both; /* 清除可能的浮动影响 */
}
/* 为 .section-card 内的标题添加样式 */
.section-card h1, .section-card h2 { 
    height: auto; /* 覆盖可能存在的固定高度 */
    font-size: 18px; /* 设置合适的字号 */
    line-height: 24px; /* 设置合适的行高 */
    font-weight: 600; 
    margin: 0 0 10px 0; /* 添加下边距，与内容区分开 */
    color: #333; /* 设置颜色 */
    padding: 0; /* 重置可能的内边距 */
}

/* 定义 .section 与 .sec_title 样式，复用 .section-card 的框架 */
.section { 
    background: #fff; 
    border: 1px #cecece solid; 
    border-top: 2px #ff6a00 solid; /* 顶部橙色强调线 */
    padding: 15px; /* 增加内边距 */
    box-sizing: border-box; 
    margin-bottom: 20px; /* 使用 margin-bottom 与其他元素保持距离 */
    width: 100%; /* 占满容器宽度 */
    clear: both; /* 清除可能的浮动影响 */
}

.sec_title { 
    height: auto; /* 覆盖可能存在的固定高度 */
    font-size: 18px; /* 设置合适的字号 */
    line-height: 24px; /* 设置合适的行高 */
    font-weight: 600; 
    margin: 0 0 10px 0; /* 添加下边距，与内容区分开 */
    color: #333; /* 设置颜色 */
    padding: 0; /* 重置可能的内边距 */
}

/* 定义 .main_title 样式，通常用于页面的主要标题 */
.main_title {
    font-size: 20px; /* 比 sec_title 稍大 */
    line-height: 28px; /* 比 sec_title 稍高 */
    font-weight: bold; /* 更加突出 */
    color: #222; /* 可以使用不同的颜色 */
    /* 继承 .sec_title 的其他样式，如 margin, padding */
}

/* 新增 .content_box 样式，用于包裹列表内容 */
.content_box {
    padding: 0; /* 可根据需要调整 */
    width: 100%;
    box-sizing: border-box;
}

.channel-links { border: 1px solid #cccccc; border-top: 1px solid #d11120; text-align: left; }
.links-header { display: flex; justify-content: space-between; background-color: #f7f7f7; }
.links-category-tab { line-height: 40px; height: 40px; color: #d11120; width: 120px; text-align: center; cursor: pointer; }
.links-category-tab.active { background-color: #d11120; color: #ffffff; }
.links-title-section { line-height: 40px; color: #d11120; display: flex; flex-grow: 1; justify-content: flex-end; }
.links-title-section a { margin: 0 10px; }
.links-contact-qq { position: relative; padding-top: 7px; box-sizing: border-box; height: 40px; }
.links-content { padding: 15px; box-sizing: border-box; }
.links-border-box { border: 1px #ccc solid; border-top: 1px #d11120 solid; text-align: left; }
.industry-item { border-bottom: 1px #cecece solid; padding: 15px 0; box-sizing: border-box; display: block; width: 100%; }
h3 { font-size: 16px; font-weight: 600; }
.description-text { color: #767676; }
.dashed-border-box { border: 1px #cecece dashed; padding: 10px; margin: 1%; width: 98%; display: block; float: left; box-sizing: border-box; }
.company-table { border-collapse: collapse; margin: 15px auto 10px; width: 100%; }
.company-table td { padding: 0; border: 1px solid #ccc; }
.table-cell-left { text-align: right; width: 20%; background: #f7f7f7; vertical-align: top; line-height: 40px; }
.table-cell-right { text-align: left; width: 80%; vertical-align: top; line-height: 40px; text-indent: 5px; }
.baidu-ad-container {}
.links-section { width: 1560px; margin: 30px auto 20px; border: 1px #cecece solid; background-color: #fffafa; }
.links-section-header { display: flex; justify-content: space-between; }
.links-section-tab { border-right: 1px #cecece solid; border-bottom: 1px #cecece solid; text-align: center; height: 40px; line-height: 40px; padding: 0px 20px; white-space: nowrap; }
.links-section-tab.active { border-bottom: 1px #fffafa solid; cursor: pointer; }
.links-section-title-row { width: 100%; display: flex; justify-content: flex-end; border-bottom: 1px #cecece solid; height: 40px; line-height: 40px; }
.links-section-title-row a { margin: 0px 20px; }
.links-section-content { }
.links-section-content-item { display: none; margin: 15px auto; height: 60px; overflow-y: auto; justify-content: flex-start; flex-wrap: wrap; }
.links-section-content-item.active { display: flex; }
.links-section-content-item a { height: 18px; line-height: 18px; margin: 0px 3px 0px 3px; font-size: 12px; }
.links-section-content-item a:hover { color: #000000; }
.image-and-text-link { height: 52px; width: 330px; display: flex; justify-content: space-between; background-color: #fbfbfb; }
.image-and-text-link:hover { background-color: #f3f3f3; }
.image-and-text-link-thumb { height: 50px; width: 50px; align-items: center; display: flex; justify-content: center; object-fit: contain; background-color: #f1f1f1; border: 1px #cecece solid; }
.image-and-text-link-thumb img { max-width: 50px; max-height: 50px; }
.image-and-text-link-text { flex-grow: 1; display: flex; align-items: center; margin-left: 10px; }
.generic-h1 { font-weight: inherit; display: inherit; padding: 0px 10px; box-sizing: border-box; }

.ct_div {
    border: 1px solid #cccccc;
    border-top: 1px solid #d11120;
    text-align: left;
    padding: 15px;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.ct_div a {
    display: block;
    padding: 8px 15px;
    background-color: #f0f0f0;
    color: #333;
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.3s ease;
    flex: 0 0 auto;
    max-width: 200px;
    word-wrap: break-word;
    text-align: center;
    border: 1px solid transparent;
}

.ct_div a:hover {
    background-color: #e0e0e0;
    color: #005fc4;
    transform: translateY(-1px);
}

.ct_div a.current-category {
    background-color: #d11120;
    color: white;
    font-weight: bold;
    border-color: #d11120;
}

.a_div {
    width: 290px;
    line-height: 35px;
    height: 35px;
    overflow: hidden;
    text-align: left;
    margin-bottom: 10px;
}

.a_div a {
    display: block;
    padding: 0 10px;
    text-decoration: none;
    color: inherit;
    transition: color 0.2s ease;
}

.a_div a:hover {
    color: #e62a2a;
}

@media only screen and (max-width: 900px) {
    .ct_div {
        gap: 5px;
        padding: 10px;
    }
    .ct_div a {
        padding: 6px 10px;
        font-size: 12px;
        max-width: calc(50% - 5px);
        flex-basis: calc(50% - 5px);
    }

    .a_div {
        width: 100%;
        max-width: 290px;
    }

    /* 响应式调整 .section, .section-card, .sec_title, .main_title */
    .section, .section-card {
        padding: 10px; /* 减小移动端内边距 */
        margin-bottom: 15px; /* 减小移动端下边距 */
    }
    .sec_title, .section-card h1, .section-card h2 {
        font-size: 16px; /* 减小移动端标题字号 */
        line-height: 22px; /* 调整移动端标题行高 */
        margin-bottom: 8px; /* 调整移动端标题下边距 */
    }
    .main_title {
        font-size: 18px; /* 减小移动端 main_title 字号 */
        line-height: 24px; /* 调整移动端 main_title 行高 */
    }
}

.map_a_box a {
    display: inline-block;
    padding: 5px 10px;
    margin: 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
    text-decoration: none;
    color: #005fc4;
}

.map_a_box a:hover {
    background-color: #f0f0f0;
    color: #e62a2a;
}