@charset "UTF-8";
/* 电脑网页版样式 */
@media  (min-width: 1026px) {
    .langimg{top:55px;}  
    .outer-container {
        width: 100%;
        height: 98px; /* 设置大容器高度 */
                        padding: 0px;
            border: 0px solid #FF5733; /* 大盒子添加橙色粗边框 */
        overflow: auto; /* 清除浮动影响 */
    }
    .logo-box {
        margin-top:5px;
        width: 35%;
        float: left;
        display: flex;
        align-items: center;
        justify-content: flex-start;
                padding: 0px;
        padding-left: 10px;
        border: 0px solid #33FF57; /* 左边小盒子添加绿色粗边框 */
        box-sizing: border-box; /* 让边框包含在宽度内 */
    }
    .logo-img {
        max-height: 100%; /* 限制 logo 图片高度 */
        width: 100%;
        object-fit: fill; /* 按自定义尺寸强制拉伸 */
    }
    .custom-image-box {
        margin-top:5px;
        max-height: 98px;
        width: 62%;
        float: right;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        border: 0px solid #5733FF; /* 右边小盒子添加紫色粗边框 */
        box-sizing: border-box; /* 让边框包含在宽度内 */
    }
    .custom-image {
        max-height: 100%; /* 限制自定义图片高度 */
        width: 99%;
        object-fit: fill; /* 按自定义尺寸强制拉伸 */
        margin-left: auto; /* 让图片靠右 */
    }
    .headertel{position:absolute;right:10px;top:10px;z-index:99}
    .topsearchbox{display: none;} /* 隐藏搜索框 */
    .header{
        position:relative;
        height: 98px;
        background:none;
    }
    
    .headertop{
        height:30px;
        line-height:30px;
        background:#b5d1ee;
        color:#333
    }
    .headertop .boxcol .desp{margin:0; }
    .headertop .boxcol .desp p{padding:0;margin:0;  }
    .headertop a{font-size:12px;color:#333}

    /*menu*/
    .menu, body .stricky-fixed{ 
        height: 60px;
        line-height: 60px;
        border-bottom: none;
        z-index: 99;
        background: #2856a1;
        width: 100%; /* 导航条宽度和网站主体一致 */
        margin: 0 auto; /* 居中显示 */   
    } 
    .menu li li a{ 
        border-bottom: 1px solid #7ECFF5;
        height: 40px;
        line-height: 40px;
        display: block;
        padding: 0 10px;
        font-size: 12px;
        transition: padding-left ease .3s;
        -webkit-transition: padding-left ease .3s;
    }
    
    .menu a{
        text-decoration: none;
        display: block;
        color: #fff;
    }
    .menu li{
        position: relative;
        z-index: 200;
    } 
    .menu li.m{
        float: left;
        display: inline;
    }
    .menu a.m{
        font-size: 17px;
        padding: 0 28px;
    }
    .menu li li a{
        display: block;
        padding: 0 10px;
        font-size: 12px;
    }
    .menu ul ul{
        display: none;
        position: absolute;
        width: 180px;
        z-index: 210;
    }
    .menu ul ul ul{
        left: 180px;
        top: 0px;
    }
    .menu li li .sf-sub-indicator{
        top: 15px;
    }
    .menu li li a,
    .menu a:hover,
    .menu a.active{
        background: #43BDF8;
        color: #fff;
    } 
    .menu li li a:hover,
    .menu li li a.active{
        background: #20B3F6;
        color: #fff;
        padding-left: 18px;
        border-left: solid 2px #7ed2f6; 
    } 

    /*bottom menu color, only when pc */
    .color_black .menu{
        background: #2856a1; 
    } 
    .color_black .menu li li a{
        border-bottom: 1px solid #6a6e71; 
    }
    .color_black .menu li li a,
    .color_black .menu a:hover,
    .color_black .menu a.active{
        background: #56595d; 
    }
    .color_black .menu li li a:hover,
    .color_black .menu li li a.active{
        background: #898c90;
        border-left: solid 2px #56595d; 
    } 

    .color_gray .menu a{
        color: #fff;
    }
    .color_gray .menu{
        background: #2856a1; 
    } 
    .color_gray .menu li li a{
        border-bottom: 1px solid #e7e7ee;
        color: #333; 
    }
    .color_gray .menu li li a,
    .color_gray .menu a:hover,
    .color_gray .menu a.active{
        background: #dedede; 
        color: #333;
    }
    .color_gray .menu li li a:hover,
    .color_gray .menu li li a.active{
        background: #e7e7ee;
        border-left: solid 2px #e7e7ee; 
    } 

    .color_orange .menu{
        background: #2856a1; 
    } 
    .color_orange .menu li li a{
        border-bottom: 1px solid #e57152;    
    }
    .color_orange .menu li li a,
    .color_orange .menu a:hover,
    .color_orange .menu a.active{
        background: #ea633e;   
    }
    .color_orange .menu li li a:hover,
    .color_orange .menu li li a.active{
        background: #d58772;
        border-left: solid 2px #d83d13; 
    } 

    .color_red .menu{
        background: #2856a1; 
    } 
    .color_red .menu li li a{
        border-bottom: 1px solid #BA1825; 
        color: #fff;
    }
    .color_red .menu li li a,
    .color_red .menu a:hover,
    .color_red .menu a.active{
        background: #A3151E; 
        color: #fff;
    }
    .color_red .menu li li a:hover,
    .color_red .menu li li a.active{
        background: #831119;
        border-left: solid 2px #86101A; 
    } 

    .color_green .menu{
        background: #2856a1; 
    } 
    .color_green .menu li li a{
        border-bottom: 1px solid #279296;  
    }
    .color_green .menu li li a,
    .color_green .menu a:hover,
    .color_green .menu a.active{
        background: #167f83;  
    }
    .color_green .menu li li a:hover,
    .color_green .menu li li a.active{
        background: #40999c;
        border-left: solid 2px #00B8BE; 
    } 

    .color_purple .menu{
        background: #2856a1; 
    } 
    .color_purple .menu li li a{
        border-bottom: 1px solid #65327b;  
    }
    .color_purple .menu li li a,
    .color_purple .menu a:hover,
    .color_purple .menu a.active{
        background: #7c2f9d;  
    }
    .color_purple .menu li li a:hover,
    .color_purple .menu li li a.active{
        background: #6e3885;
        border-left: solid 2px #774c8a; 
    } 

    .color_yellow .menu{
        background: #2856a1; 
    } 
    .color_yellow .menu li li a{
        border-bottom: 1px solid #b19a39;  
    }
    .color_yellow .menu li li a,
    .color_yellow .menu a:hover,
    .color_yellow .menu a.active{
        background: #dbb61f;  
    }
    .color_yellow .menu li li a:hover,
    .color_yellow .menu li li a.active{
        background: #b2972a;
        border-left: solid 2px #d7bb47; 
    } 

    .color_pink .menu{
        background: #2856a1; 
    } 
    .color_pink .menu li li a{
        border-bottom: 1px solid #d798c4;  
    }
    .color_pink .menu li li a,
    .color_pink .menu a:hover,
    .color_pink .menu a.active{
        background: #f4a4dc;  
    }
    .color_pink .menu li li a:hover,
    .color_pink .menu li li a.active{
        background: #e8a1d3;
        border-left: solid 2px #fbb1e5; 
    } 

    .color_other1 .menu{
        background: #2856a1; 
    } 
    .color_other1 .menu li li a{
        border-bottom: 1px solid #5b54c9;  
    }
    .color_other1 .menu li li a,
    .color_other1 .menu a:hover,
    .color_other1 .menu a.active{
        background: #645ec9;  
    }
    .color_other1 .menu li li a:hover,
    .color_other1 .menu li li a.active{
        background: #6c68bb;
        border-left: solid 2px #9a96e3; 
    } 

    .color_other2 .menu{
        background: #2856a1; 
    } 
    .color_other2 .menu li li a{
        border-bottom: 1px solid #4badc3;  
    }
    .color_other2 .menu li li a,
    .color_other2 .menu a:hover,
    .color_other2 .menu a.active{
        background: #3099b0;  
    }
    .color_other2 .menu li li a:hover,
    .color_other2 .menu li li a.active{
        background: #5cbbd1;
        border-left: solid 2px #46c1dd; 
    } 

    .color_other3 .menu a{
        color: #333;
    }
    .color_other3 .menu{
        background: #2856a1; 
    } 
    .color_other3 .menu li li a{
        border-bottom: 1px solid #caebb7;  
        color: #333;
    }
    .color_other3 .menu li li a,
    .color_other3 .menu a:hover,
    .color_other3 .menu a.active{
        background: #dcfbcb;
        color: #333;  
    }
    .color_other3 .menu li li a:hover,
    .color_other3 .menu li li a.active{
        background: #cef4b8;
        border-left: solid 2px #a6f47b; 
    } 
}

/* 移动设备样式 */
@media  (max-width: 1025px) {
    .header{
        height: 50px;
        background: #fff;  
    }
    .outer-container {
        width: 100%;
        height: 50px; /* 设置大容器高度 */
        border: 3px solid #FF5733; /* 大盒子添加橙色粗边框 */
        overflow: auto; /* 清除浮动影响 */
    }
    .logo-box {
        width: 35%;
        float: left;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding-left: 10px;
        border: 3px solid #33FF57; /* 左边小盒子添加绿色粗边框 */
        box-sizing: border-box; /* 让边框包含在宽度内 */
    }
    .logo-img {
        max-height: 100%; /* 限制 logo 图片高度 */
        width: auto;
        object-fit: fill; /* 按自定义尺寸强制拉伸 */
    }
    .custom-image-box {
        width: 62%;
        float: right;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        border: 3px solid #5733FF; /* 右边小盒子添加紫色粗边框 */
        box-sizing: border-box; /* 让边框包含在宽度内 */
    }
    .custom-image {
        max-height: 100%; /* 限制自定义图片高度 */
        width: auto;
        object-fit: fill; /* 按自定义尺寸强制拉伸 */
        margin-left: auto; /* 让图片靠右 */
    }
    .langimg{
        top: 16px;
        right: 80px;
    }
    .topuser{
        position: absolute;
        top: 15px;
        right: 80px;
    }
    .dmfontsearch { 
        display: none; /* 隐藏搜索框 */
    }

    .topsearchboxshow .topsearchbox { 
        display: none; /* 隐藏搜索框 */
    }

    /*menu*/
    .menusimpletoggle{
        top: 18px;
        right: 5px;
    }
    .menusimpletext{
        top: 60px;
        right: 5px;
    }

    .menu .container{
        padding: 0;
    }/*hack bootstrap container*/
    .menu{
        display: none;
        width: 100%;
        position: absolute;
        top: 50px;
        left: 0px;
        background: #2856a1;
        z-index: 90000;
        height: auto;
    }
    .menushow{
        display: block;
    }
    .stricky-fixed .menu{
        top: 50px;
    }
    .menu li.m {
        width: 100%;
    }
    .menu li ul.sub{
        background: #9dd1f1; 
    }
    .menu li ul.sub ul{
        background: #c3deef; 
    }
    .menu li ul.sub a{
        background: none; 
    }
    .menu li a{
        padding-left: 10px;
        color: #333;
    }
    .menu li li a{
        color: #333;
    }
    .menu a{
        display: block !important;
        height: 40px;
        line-height: 40px;
        background: #2856a1; 
    }
    .menu li li a{
        height: 33px;
        line-height: 30px;
        padding-left: 15px; 
    }
    .menu li li li a{
        padding-left: 25px;
    }
    .menu a{
        border-bottom: 1px solid #1b253b;
    }
    .menu li ul{
        display: none; 
    }
}        