/*==========css reset==========*/





/*暗黑模式color*/
@media only screen and (max-width:992px) {
    .night #quick_submit,.night #backtop{background:#fff!important;}
}
.night .data-zone{background: #2b333e;}
.night .art-tag a{background: #3c4551}
.night .part .bar{border-bottom:1px solid #353e48;}
.night .search .s-form .arrow{color:#3c4551;}
.night .m-btn i{color:#e6e6e6;}
.night .search .s-form{background: #3c4551;border:none;}
.night .part .art-main h1,.night .part .art-main h2,.night .part .art-main h3,.night .part .art-main h4,.night .part .art-main h5,.night .part .art-main h6,.night .part .tt,.night .part .r-intro .data,.night .part .r-intro .data .fa,.night small{color: #edeef0;}
.night{background:#232931!important;color:#edeef0!important;}
.night #divCommentPost input.text,.night #divCommentPost img{border:none;background:#232931;color: #fff;}
.night .header .submit .a:hover{color:#fff!important;}
.night #light-logo,.night #light-flogo{display:none;}
#light-logo,#light-flogo{display:block;}
.night #dark-logo,.night #dark-flogo{display:block;}
#dark-logo,#dark-flogo{display:none;}
.night .search i.fa,.night .darkmode i.fa{color:#fff;}
.night .footer-copyright  a,.night .breadnav a{color:#a4a6aa!important;}
.night .part h1.tt span{color:#fff;}
.night .ad_zone a{color:#6b7386!important;}
.night .ad_zone a{background:#232931;}
.night .header .nav-bar li.active:after,.header .nav-bar li[class*="li-cate-"]:after{background: transparent!important}
.night .part .post-single .list .btn:hover{color:#fff!important;}
.night .art-copyright,.night #txaArticle,.night .comment-main,.night .header .nav-bar ul li > ul{background:#232931!important;border:none!important;}
.night #divCommentPost input.button,.night .part .post-single .list .btn,.night .page-tips,.night .submit-form input,.night .post-btn,.night #reg_verfiycode,.night .part .post-single .list .tag a{background:#3f4957!important;border:none!important;}
.night .art-title a{color:#fff!important;}
.night .edui-listitem-body .edui-default{color:#333;}
.night iframe.view{background: #c8cfd9!important;}
.night .edui-default .edui-toolbar .edui-combox .edui-combox-body{background-color: #d8dfe8;color:#333;}
.night .edui-default .edui-editor-toolbarboxouter{background-image:none;background-color: #d8dfe8;}
.night .part,.night .part .tt,.night .quick-nav,.night #quick_submit,.night #backtop,.night .part .art-item,.night .part .post-single .pic,.night .pagebar .current{background:#2b333e;}
.night .h-fix{background:#232931;box-shadow: 0 1px 3px rgba(255, 255, 255, 0);border-bottom:1px solid #2c333c;}
.night .pagebar .current{border:1px solid #434c57;}
.night .page-numbers{background:#232931;border:1px solid #434c57;}
.night .part .art-item{box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.1);}
.night .part .art-item:hover{background:#303a48;}
.night #quick_submit{color:#6b7386!important;}
.night #quick_submit:hover{color:#007bff!important;}
.night .part .tt{border-bottom:1px solid #36404f}
.night .pagebar{background: #2b333e}
.night .part .item .a h3{color:#fff;}
.night .part .item .link .fa{color:#fff;}
.night .part .item .link:hover .fa {border: 1px solid #fff;background:#111;}
.night .part .item .a:hover,.night .part .art-item:hover {box-shadow: 0px 5px 28px 0px rgba(13, 12, 12, 0.2);}
.night a{color:#edeef0!important;}
.night a:hover{color:#007bff!important;}
/* Tooltip */
.tooltip{padding:5px;font-size:12px;opacity:.8;background-repeat:no-repeat;background-image:url(../images/tooltip.gif)}
.tooltip-inner{padding:5px 10px;max-width:200px;pointer-events:none;color:#fff;text-align:center;background-color:#000;border-radius:3px;box-shadow:0 0 3px rgba(0,0,0,.15)}
.tooltip-bottom{background-position:top center}
.tooltip-top{background-position:bottom center}
.tooltip-left{background-position:right center}
.tooltip-right{background-position:left center}
/* transition */
.transition{-webkit-transition:all ease .4s;-moz-transition:all ease .4s;-ms-transition:all ease .4s;-o-transition:all ease .4s;transition:all ease .4s}
/* 图片高斯模糊 */
.blur {-webkit-filter: blur(10px);-moz-filter: blur(10px);-ms-filter: blur(10px);filter: blur(10px);filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=10, MakeShadow=false);}
/*----------- 头部 -----------*/
body{background:#f1f5f8;color:#6b7386;}
.h-fix{position:fixed;top:0;left:0;z-index:9999;background:#fff;width:100%;box-shadow: 0 4px 20px rgba(0,0,0,0.05);}
.header {display:block;height:72px;position:relative;left:0;-webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;z-index:9}
.header .logo {
    float:left;
    overflow:hidden;
    height:72px;
    min-width:120px;
    width: auto;
    max-width: 300px;
    display: flex;
    align-items: center;
}
.header .logo h1,.header .logo div {height:100%;display:block;}
.header .logo a {
    height:100%;
    display:flex;
    align-items: center;
    position:relative;
    white-space: nowrap;
}
.header .logo a img {width:auto;max-width:100%;height:55px;display: block;}
.header .logo a span#light-logo{
    font-size: 22px;
    color: #4C7D71;
    font-weight: 700;
    letter-spacing: 0.5px;
}
/* 占位元素仅用于撑开宽度，完全不影响视觉 */
.header .logo a .placeholder {
    visibility: hidden; /* 隐藏视觉显示 */
    display: inline-block; /* 确保宽度由内容决定 */
    font-size: 25px; /* 与#light-logo保持一致 */
    height: 0; /* 消除占位元素的高度影响 */
    overflow: hidden; /* 避免意外换行导致高度变化 */
}
.header .nav-bar {
    float:left;
    margin-left:40px;
    max-width: 55%; /* 限制导航最大宽度 */
    overflow: hidden; /* 隐藏溢出内容 */
    white-space: nowrap; /* 强制不换行 */
    height: 72px; /* 固定高度 */
    display: flex; /* 使用flex布局 */
    align-items: center; /* 垂直居中 */
}
.tel-footer{
    display: none;
}
.header .nav-bar li {
    display: inline-flex; /* 使用inline-flex */
    height: 72px;
    line-height: 72px;
    position: relative;
    vertical-align: top;
    margin: 0 3px;
    align-items: center; /* 垂直居中 */
    flex-shrink: 0; /* 防止压缩 */
}
.header .nav-bar li a {
    display: flex;
    padding: 0 12px;
    color: #555;
    font-size: 14px;
    font-weight: 500;
    position: relative;
    z-index: 2;
    min-width: auto;
    text-align: center;
    border-radius: 6px;
    height: 36px;
    line-height: 36px;
    margin: 18px 0; /* 上下边距替代margin-top */
    transition: all 0.3s;
    white-space: nowrap; /* 强制不换行 */
    overflow: hidden; /* 隐藏溢出文字 */
    text-overflow: ellipsis; /* 显示省略号 */
    max-width: 120px; /* 限制单个菜单项最大宽度 */
    align-items: center; /* 文字垂直居中 */
    justify-content: center; /* 文字水平居中 */
}
.header .nav-bar li em[class*="dot"] {display:inline-block;position:relative;left:-10px;z-index:1;width:16px;}
.header .nav-bar li em[class*="dot"] .fa {color:#666;font-size:16px;width:16px;display:block;}
.header .nav-bar li a:hover {color:#4C7D71;background: #EDF2F1;}
.header .nav-bar li.active:before,.header .nav-bar li[class*="li-cate-"]:before{
    display: none;
}
.header .nav-bar li.active:after,.header .nav-bar li[class*="li-cate-"]:after{
    display: none;
}
.header .nav-bar li.active > a{
    color:#4C7D71;
    background: #EDF2F1;
    font-weight: 600;
}
@-webkit-keyframes shine {from{-webkit-mask-position: 150%;}to{-webkit-mask-position: -50%;}}
/*二级高亮*/
.header .nav-bar ul li>ul {width:100%;min-width:140px;position:absolute;top:60px;left:50%;transform:translateX(-50%) translateY(10px);right:0;background:#fff;z-index:888;visibility:hidden;opacity:0;border-radius: 8px;box-shadow:0px 8px 20px 0px rgba(0,0,0,0.1);-webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;padding: 8px 0;}
.header .nav-bar ul li>ul li {width:100%;height:36px;line-height:36px;display:block;margin: 0;}
.header .nav-bar ul li>ul li a {
    width:100%;
    text-align:left;
    height:36px;
    line-height:36px;
    font-size:14px;
    color:#666;
    opacity:1;
    margin: 0;
    padding: 0 20px;
    border-radius: 0;
    font-weight: 400;
}
.header .nav-bar ul li.on a:hover {color:#4C7D71;background: #EDF2F1;}
.header .nav-bar ul li.on>ul {visibility:visible;opacity:1;transform:translateX(-50%) translateY(0);}
.header .nav-bar ul li>ul li em[class*="dot"] {position:absolute;right:5px;left:auto;top:10px;z-index:3;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);-o-transform:rotate(-90deg);transform:rotate(-90deg);}
.header .nav-bar ul li.on>ul li em[class*="dot"] .fa {color:#6b7386;}
/*三级高亮*/
.header .nav-bar ul li>ul li .sub-menu {visibility:hidden;opacity:0;display:none;left:-100%;transform:none;}
.header .nav-bar ul li>ul li.on .sub-menu {right:-100%;left:auto;top:0;visibility:visible;opacity:1;display:block;}
.header .nav-bar ul li>ul li.on .sub-menu li a,.header .nav-bar ul li>ul li.on .sub-menu li a:hover {background:rgba(0,0,0,0);color:#6b7386);}
.header .nav-bar ul li>ul li.on .sub-menu li.on a,.header .nav-bar ul li>ul li.on .sub-menu li.on a:hover {color:#4C7D71;}
/*移动端*/
.m-btn {
    position: absolute;
    top: 0;
    left: auto; 
    right: 15px;
    height: 100%;
    display: none;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 1000;
}
.m-btn i {
    color: #333;
    opacity: 0.8;
    font-size: 20px;
    line-height: 1; /* 重置行高 */
}
.m-btn .fa-remove{color:#fff;}
.m-btn:hover i {opacity:1}
.m-nav {width:280px;background:#fff;position:fixed;top:0;bottom:0;left:-280px;-webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;z-index:999;overflow-y: scroll;overflow-x: hidden;box-shadow: 4px 0 20px rgba(0,0,0,0.1);}
.m-nav .m-btn {height:48px;line-height:48px;left:auto;right:-45px;display:none;}
.m-nav ul {padding-top:20px;}
.m-nav li {width:100%;position:relative;}
.m-nav li a {padding:0 25px;line-height:50px;color:#333;display:block;border-bottom:1px solid #f5f5f5;font-size: 15px;}
.m-nav li a:hover {background:#EDF2F1;color: #4C7D71;}
.m-nav ul li>ul {display:none;}
.m-nav li em[class*="dot"] {position:absolute;top:0px;right:0px;width:50px;height:50px;text-align:center;border-left:1px solid rgba(255,255,255,0);cursor:pointer;}
.m-nav li em[class*="dot"] .fa {font-size:16px;color:#999;-webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;position:absolute;width:50px;line-height:50px;top:0;left:0;}
.m-nav li em[class*="dot"] .fa.open {-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg);}
.m-nav ul li>ul li {background:#fcfcfc;}
.m-nav ul li>ul li a {border-bottom:1px solid #f0f0f0;opacity:0.9;font-size:14px;text-indent:1em;color: #666;}
/*搜索和黑暗模式*/
.search,.darkmode {float:right;margin-left:20px;position:relative;height: 72px;display: flex;align-items: center;}
.darkmode i{font-weight: 900;}
.search i.fa,.darkmode i.fa {color:#555;line-height:36px;opacity:0.8;font-size:18px;padding:0;-webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;cursor:pointer;display:block;width: 36px;height: 36px;text-align: center;border-radius: 50%;}
.search i.fa:hover,.darkmode i.fa:hover {opacity:1;background: #EDF2F1;color: #4C7D71;}
.search .s-form {padding:15px;line-height:none;display:block;background:#fff;position:absolute;right:0;top:72px;display:none;box-shadow:0px 8px 20px 0px rgba(0,0,0,0.1);border-radius: 8px;z-index:1;border: 1px solid #f0f0f0;}
.search .s-form .sform {width:260px;padding-right:0;position:relative;display: flex;}
.search .s-form button {border:medium none;background:#4C7D71;position:absolute;top:0;right:0;cursor:pointer;height: 36px;border-radius: 0 4px 4px 0;}
.search .s-form button i {color:#fff;font-size:16px;height:36px;line-height:36px;padding:0;width: 40px;}
.search .s-form button:hover {opacity:0.9}
.search .s-form .sinput {background:#f8f9fa;border:1px solid #eee;padding: 0 10px;height:36px;line-height:36px;width:100%;font-size: 14px;border-radius: 4px;color: #333;}
.search .s-form .sinput:focus {border-color: #4C7D71;background: #fff;}
.search .s-form .arrow {position:absolute;top:-14px;right:10px;line-height:20px;color:#fff;font-size:20px;opacity: 1;text-shadow: 0 -2px 3px rgba(0,0,0,0.05);}
#mask {position:fixed;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.5);z-index:899;display:none;}

/*----------- 响应式 -----------*/
@media only screen and (max-width:1200px) {
    .wrapper,.header .container,.crumb {padding:0 15px;}
    #nav-box { display: none; } /* 隐藏主导航菜单 */
    .m-btn { 
        
            float: right;
    position: relative;
    height: 72px;
    display: flex;
    align-items: center;
     } /* 显示汉堡菜单按钮 */
    .header-search-order-btn{
        display: none;
    }
    body.open .m-nav {left:0px;}
}
@media only screen and (max-width:992px) {
    .wrapper,.header .container {padding:0 15px;}
    .header .logo a {min-width:140px;}
    .header .logo a span#light-logo{
        font-size: 22px;
    }
    .search i.fa,.header .nav-bar li {height:56px;line-height:56px;}
    .header {top:0;width:100%;z-index:898;}
    
    /* 导航菜单在平板端的优化 */
    .header .nav-bar {
        max-width: 70%; /* 平板端增加导航宽度限制 */
        overflow-x: auto; /* 允许水平滚动 */
        overflow-y: hidden; /* 隐藏垂直滚动 */
        white-space: nowrap; /* 强制不换行 */
        scrollbar-width: none; /* 隐藏滚动条 */
        -ms-overflow-style: none; /* IE隐藏滚动条 */
        height: 56px; /* 固定高度 */
        display: flex; /* 使用flex布局 */
        align-items: center; /* 垂直居中 */
    }
    
    .header .nav-bar::-webkit-scrollbar {
        display: none; /* Chrome/Safari隐藏滚动条 */
    }
}
@media only screen and (max-width:768px) {
    .header,.header .logo {height:56px;display:inline-block;margin:0 auto;font-size:0;}
    .header .container {
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 100%;
        padding: 0 15px;
        gap: 10px; /* 添加间距 */
    }

    .header .logo {
        float: none;
        display: inline-block;
        height: 56px;
        min-width: auto;
        flex: 1; /* 占据剩余空间 */
        justify-content: flex-start; /* 左对齐 */
        margin-left: 0;
    }

    .header .logo a span#light-logo{
        font-size: 20px; /* 稍微减小字体 */
        text-align: left;
        white-space: nowrap; /* 防止换行 */
        overflow: hidden; /* 隐藏溢出 */
        text-overflow: ellipsis; /* 省略号 */
        max-width: 200px; /* 最大宽度限制 */
    }

    .nav-bar {display:none;}
    .search i.fa,.header .nav-bar li,.darkmode i.fa,.header .nav-bar li  {height:56px;line-height:56px;}
    .darkmode i{font-weight:900;}
    
    /* 移动端菜单按钮 - 放在最右侧 */
    .m-btn {
        display: flex !important;
        position: relative;
        top: auto;
        bottom: auto;
        right: auto;
        left: auto;
        height: 56px;
        padding: 0 0 0 15px; /* 左边距 */
        margin-right: 0;
        order: 99; /* 放到最后面 */
        flex-shrink: 0; /* 防止压缩 */
    }
    
    /* 搜索和用户图标容器 */
    .search-container {
        display: flex;
        align-items: center;
        gap: 10px; /* 图标间距 */
        flex-shrink: 0; /* 防止压缩 */
    }
    
    .search, .darkmode {
        float: none;
        margin-left: 0; /* 移除左边距 */
        height: 56px;
    }

    .header-search-order-btn {
        display: none;
    }

    

    body.open .m-nav {left:0px;}
    body.open .m-btn {display:none !important;}
    body.open .m-nav .m-btn {display:block !important;}
}

/* 超小屏幕导航优化 */
@media only screen and (max-width:480px) {
    .header .nav-bar {
        max-width: 80%; /* 小屏幕进一步限制导航宽度 */
    }
    
    .header .nav-bar li a {
        max-width: 100px; /* 小屏幕进一步限制菜单项宽度 */
        font-size: 13px; /* 减小字体 */
        padding: 0 8px; /* 减小内边距 */
    }
}

/* 超小屏幕适配 */
@media only screen and (max-width:480px) {
    .header .container {
        padding: 0 10px; /* 减小内边距 */
        gap: 8px; /* 减小间距 */
    }
    
    .header .logo a span#light-logo{
        font-size: 18px; /* 更小字体 */
        max-width: 150px; /* 更小最大宽度 */
    }
    
    .m-btn {
        padding: 0 0 0 10px; /* 减小左边距 */
    }
    
    .search-container {
        gap: 8px; /* 减小图标间距 */
    }
}
.container{margin-right:auto;margin-left:auto;padding-left:10px;padding-right:10px}
.container:after,.container:before{content:"";display:table}
.container:after{clear:both}
@media (min-width:768px){.container{width:100%}
}
@media (min-width:992px){.container{width:100%}
}
@media (min-width:1200px){.container{max-width:1200px}
}



/*申请收录btn*/
.header .submit i{padding-right:4px;}
.header .submit .a {
    display: block;
    margin: 17px 20px;
    height: 36px;
    line-height: 36px;
    padding: 0 1em;
    text-align: center;
    border-radius: 4px;
    background-color: #4C7D71;
    color: #fff;
    font-size:14px;
}
.header .submit .a:hover{background-color: #3b6359;}

.header .submit .a:hover {animation-name: shakeAnim;}
@keyframes shakeAnim {0% {left: 0}1% {left: 0}2% {left: 0}3% {left: 0}4% {left: 0}5% {left: 0}6% {left: 0}7% {left: 0}}
@keyframes shake {10%, 90% {transform: translate3d(-1px, 0, 0);}20%, 80% {transform: translate3d(2px, 0, 0);}
    30%, 50%, 70% {transform: translate3d(-4px, 0, 0);}40%, 60% {transform: translate3d(4px, 0, 0);}}


/* 底部导航优化 */
.footer-nav{
    display: none;
}
@media (max-width: 1200px) {
    .footer-nav {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: #fff;
        display: flex;
        justify-content: space-around;
        padding: 6px 0 4px;
        box-shadow: 0 -4px 20px rgba(0,0,0,0.08);
        z-index: 999;
        border-top: 1px solid #f5f5f5;
    }
}

.nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #999;
    font-size: 11px;
    padding: 0 10px;
    transition: all 0.3s ease;
    flex: 1;
    position: relative;
    justify-content: center;
    height: 50px;
}
.nav-item.active {
    color: #4C7D71;
    font-weight: 500;
}
.nav-icon {
    font-size: 20px;
    margin-bottom: 4px;
    transition: transform 0.3s;
}
.nav-item:active .nav-icon {
    transform: scale(0.9);
}
.nav-item.active .nav-icon {
    transform: scale(1.1);
}
