:root {
    --box-main-width: 980px;
    --menu-float-item-bg: #077D5F; /* 左右浮动子菜单项背景色 */
}

/* ====== 以下2项适配全部元素 =============== */
*::after, *::before {
    box-sizing: border-box;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box; /* border-box：元素的padding和border被包含在定义的width和height之内；默认值content-box则相反 */
    scroll-behavior: smooth; /* 控制页面滚动的平滑度，使页面滚动更加自然和流畅。 */
}
/* ========================================== */

html {
    width: 100%;
    font-size: 100px; /* 定义1rem=100px。其余标签用rem定义font-size都是html标签的相对单位。 */
}


/*@font-face {
    font-family: 'Source Han Sans CN';
    src: url('/static/font/SourceHanSansCN/SourceHanSansSC-Normal.otf') format('truetype');
}*/

body {
    width: 100%;
    color: #444;
    font-family: 'Microsoft YaHei', sans-serif;
    /*font-family: 'Source Han Sans CN', sans-serif; 思源黑体*/
    /* 禁用网页内容复制
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;*/
}
/*禁用网页内容复制
    -webkit-touch-callout: none;  iOS Safari 
    -webkit-user-select: none;  Safari 
    -khtml-user-select: none;  Konqueror HTML 
    -moz-user-select: none;  Old versions of Firefox 
    -ms-user-select: none;  Internet Explorer/Edge 
    user-select: none;  Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox 
*/


a {
    color: #444;
    text-decoration: none; /*去掉下划线*/
}

    /* 未访问链接、 已访问链接*/
    a:link, a:visited {
        color: #444;
    }

    a:hover {
        color: #0391DB; /*鼠标划过:浅蓝*/
    }

    a:active {
        color: red; /*鼠标按下:红色*/
    }

hr {
    height: 1px;
    border: none;
    border-bottom: 1px dotted #ccc;
}

h1 {
    margin: 10px auto;
    line-height: 0.32rem;
    font-size: 0.22rem;
    font-weight: normal;
    color: #555;
    text-align: center;
}

h2 {
    margin: 20px auto 10px auto;
    line-height: 0.3rem;
    font-size: 0.2rem;
    font-weight: normal;
    color: #555;
}

h3 {
    margin: 15px auto 5px auto;
    line-height: 0.26rem;
    font-size: 0.16rem;
    font-weight: bold;
    color: #666;
}

h4 {
    margin: 10px auto 5px auto;
    line-height: 0.25rem;
    font-size: 0.15rem;
    font-weight: bold;
}

div, p {
    font-size: 0.15rem;
    line-height: 0.25rem;
    text-align: justify;
}
p {
    margin: 0 auto 10px auto;
}

ul small {
    margin-left: 18px;
    color: gray;
}

li {
    font-size: 0.15rem;
    line-height: 0.25rem;
    list-style: none;
}

/* li含多行文字 */
.ul-liMultiLine li {
    text-align: justify;
    margin-bottom: 8px;
}

table {
    width: 100%;
    border-collapse: collapse; /*边线合并*/
}

th {
    font-size: 0.15rem;
    line-height: 0.25rem;
    display: table-cell; /*与下句实现垂直居中*/
    vertical-align: middle; /* 垂直居中 */
    text-align: center; /* 水平居中 */
}

td {
    padding: 0 3px;
    font-size: 0.15rem;
    line-height: 0.25rem;
    display: table-cell; /*与下句实现垂直居中*/
    vertical-align: middle; /* 垂直居中 */
}
/* ================================================== */


.box-main-bg {
    margin: 10px auto 0 auto;
    padding: 35px 0;
    width: 100%;
    background-color: #F9F9F9;
}

.box-main {
    margin: 0 auto;
    padding: 50px 80px;
    width: var(--box-main-width);
    background-color: #fff;
    box-shadow: 0px 0px 8px 4px #ccc;
    min-height: 450px;
}


/* ==== 普通网页的 header ，包括单行菜单。首页重写header ==== */
header {
    margin: 0 auto;
    width: 100%;
    height: 535px; /*背景图的高度450px，导航菜单高度85px*/
    background: url(/images/banner/b.jpg) no-repeat bottom; /*图片 height:450px */
    background-size: initial;
    text-align: center;
}
/* ================================================== */


/* == 网站主题（网页头部banner上的半透明灰底白字） == */
.box-site-title {
    margin: 0 auto;
    padding: 0;
    height: 450px;
    width: 100%;
    /* 以下语句：实现子元素纵向和横向都居中 */
    display: flex; /* 设置为弹性容器，与下面2条语句实现内容垂直和横向居中。这会导致子元素的height和width属性被禁止 */
    justify-content: center; /* 设置弹性盒子中元素在主轴（横轴）方向上的对齐方式 */
    align-items: center; /* 设置弹性盒子中元素在侧轴（纵轴）方向上的对齐方式 */
    /* flex-wrap: wrap;  设置弹性盒子中元素超出父容器时自动换行 */
    z-index: 0;
}

    .box-site-title div {
        margin: 0 auto;
        padding: 30px 0 20px 0;
        width: 1200px;
        max-width: 100%;
        font-weight: normal;
        text-align: center;
        background: rgba(89, 93, 94, 0.5);
        color: #fff;
    }

    .box-site-title h2 {
        margin: 0 auto;
        line-height: 0.70rem;
        font-size: 0.50rem;
        letter-spacing: 1px;
        font-weight: bold;
        color: #fff;
    }

    .box-site-title h3 { /*英文标题*/
        margin: 0 auto;
        line-height: 0.40rem;
        font-size: 0.25rem;
        font-weight: normal;
        color: #fff;
    }

    .box-site-title h4 {
        margin: 0 auto;
        line-height: 0.60rem;
        font-size: 0.40rem;
        font-weight: normal;
        letter-spacing: 1px;
        color: #fff;
    }

    .box-site-title h5 {
        margin: 0 auto;
        line-height: 0.50rem;
        font-size: 0.35rem;
        font-weight: normal;
        letter-spacing: 1px;
        color: #fff;
    }
/* ================================================== */


/* ==== 供各子网页栏头图片下的网页导航 ============= */
.map-nav {
    margin: 10px auto;
    width: var(--box-main-width);
    height: 0.20rem;
    line-height: 0.20rem;
    font-size: 0.14rem;
    font-weight: normal;
    color: #666;
}

    .map-nav a {
        color: #666;
        text-decoration: none
    }

        .map-nav a:link, .map-nav a:visited {
            color: #666;
        }

        .map-nav a:hover { /*鼠标划过:浅蓝*/
            color: #0391DB;
        }

        .map-nav a:active {
            color: red; /*鼠标按下:红色*/
        }

    .map-nav span {
        float: right;
    }
/* ================================================= */


/*  ============= 导航菜单(for pc) ================== */
.menu-main {
    margin: 0 auto;
    padding: 0;
    width: auto; /* 高度由header决定 */
    text-align: center;
    background-color: transparent;
    z-index: 9999; /* 必须浮在最上层  */
}
    /* menu-main 用 table，不需要下面2条语句，用了反而导致top有10px多空白 */
    /* display: inline-block; 使其宽度根据内容自适应 */
    /* white-space: nowrap; 禁止文本换行 */

    /* logo图片容器 */
    .menu-main th {
        margin: 0 auto;
        padding: 0;
        width: auto;
        text-align: center;
        vertical-align: middle;
    }

    /* logo */
    .menu-main img {
        margin: 0 auto;
        height: 85px;
    }

    .menu-main td {
        margin: 0 auto;
        padding: 0 0 15px 0;
        width: auto;
        text-align: center;
        vertical-align: bottom;
    }


    /*导航链接样式*/
    .menu-main td a {
        padding: 10px 20px;
        font-size: 15px;
        color: #333;
        text-decoration: none; /*去掉下划线*/
        /*display: inline-block;设置内联块级元素*/
    }

        .menu-main td a:link, .menu-main td a:visited {
            color: #333;
        }

        .menu-main td a:hover { /*设置鼠标划过:前景色和背景色*/
            color: #fff;
            background: rgba(102,102,102,0.8); /*##666;*/
        }

        .menu-main td a:active {
            color: #FFFF99; /*鼠标按下字体颜色:浅黄*/
        }

.menu-sub { /*给下拉框设置定位*/
    position: relative;
    width: auto;
    display: inline-block;
}
    /*当下拉按扭划过时，则下拉内容显示*/
    .menu-sub:hover .menu-sub-list {
        display: block;
    }

.menu-sub-list { /*下拉内容设置定位*/
    margin: 5px auto 0 auto;
    display: none;
    position: absolute;
    box-shadow: 0 0 15px 0 rgba(0,0,0,0.5);
}

    .menu-sub-list a { /*将下拉内容框里的a标签设置块级元素和字体颜色*/
        margin: 0 auto;
        color: #000;
        text-align: center;
        border-top: solid 1px #fff;
        background: rgba(221,221,221,0.8); /*#ddd;*/
        /* 以下三行保证格式整齐美观 */
        display: block;
        white-space: nowrap; /* 不换行 */
        min-width: 130px; /* 按已知最长的子菜单项，统一宽度*/
    }
        /*设置下拉内容框里的a标签背景*/
        .menu-sub-list a:hover {
            border: none;
        }
/* ================================================== */


/* ======= 页脚 ==================================== */
footer {
    margin: 0 auto;
    padding: 10px 0;
    width: 100%;
    background-color: #000;
    text-align: center;
}

    footer table {
        margin: 0 auto;
        width: auto; /*自适应宽度*/
        text-align: center;
    }

    /* 企业LOGO容器 */
    footer th {
        height:auto;
        line-height: normal;
    }

        /* 企业LOGO */
        footer th img {
            max-height: 90px;
            margin-right:5px;
        }

    footer td {
        width: auto; /*自适应宽度*/
        font-size: 13px;
        line-height: 24px;
        text-align: center;
        color: #939393;
    }
    
        /* 各类备案等小图标 */
        footer td img {
            max-height: 18px;
            max-width: 18px;
            margin-right: 2px;
        }

        footer td a:link, footer td a:visited {
            color: #939393;
            text-decoration: none;
        }

        footer td a:hover {
            color: #0391DB;
            text-decoration: none;
        }

        footer td a:active {
            color: #939393;
            text-decoration: none;
        }

/* ================================================== */


/* ======= 页尾广告 ================================= */
.adv-footer-shell {
    margin: 30px auto 0 auto;
    padding: 40px 80px;
    width: var(--box-main-width);
    background-color: #fafafa;
    box-shadow: 0 0 8px 4px #ccc;
}
    /*版权与免责声明*/
    .adv-footer-shell p b {
        font-size:16px;
    }

/* ==== 内嵌div为广告部分 ======================= */
/* 由于广告文字上面的 Title.html 的 div 的 css 用id定义，为避免元素定义冲突，广告段也必须用id定义 */
#adv-footer p {
    margin: 10px auto;
    font-size: 0.15rem;
    line-height: 0.25rem;
}

#adv-footer h2 {
    margin: 10px auto;
    font-weight: normal;
    font-size: 0.15rem;
    line-height: 0.25rem;
}

#adv-footer a, #adv-footer a:visited {
    color: #21A3AD;
}

    #adv-footer a:hover {
        color: red;
    }
/* ================================================== */


/* ======= 页内锚点 ================================= */
/*  锚点定义不含文字，以免占位或显示，仅定义name或id（须唯一性），
    如：<a class="page-inner-anchor" name="i-StandPrices"></a> 
    邀请函：锚点内置在各包含文件，便于浮动目录菜单导航；
    普通页：比如返回页头顶部(ToTop -> PageHeader) 
*/
.page-inner-anchor {
    float: right;
    margin: -60px 0 0 0; /*不占行高。可放在H2标签下，不因上文内容浮动总高度用 display:inline-block;控制而导致定位不准确; */
    font-size: 10px;
    color: #fff;
}

    .page-inner-anchor a:link, .page-inner-anchor a:visited, .page-inner-anchor a:active {
        color: #fff;
        text-decoration: none;
    }

    .page-inner-anchor a:hover {
        color: #fff;
        text-decoration: none;
    }
/* ================================================== */


/* ===== 返回页顶/页脚：对应锚点在../include/menu.html =========== */
#toTop {
    position: fixed;
    width: 100px;
    right: 10px;
    bottom: 10px;
    text-align: center;
    background: rgba(0,0,0,0.3);
    clip-path: ellipse(42px 25px); /*椭圆形*/
    /*  padding: 17px 20px;
        clip-path:circle(0.3rem); 圆形
    */
}

    #toTop a {
        font-size:28px;
        font-weight: normal;
        color: #EFEFEF;
        display: block;
    }

        #toTop a:visited {
            color: #EFEFEF;
        }

        #toTop a:first-child {
            margin-bottom: 8px;
        }
/* ==================================================== */


/* =======左、右侧浮动窗口：二级菜单。首页也用 ======== */
ul.menu-float-right, ul.menu-float-left {
    position: fixed;
    top:85px;
    bottom: auto;
    width: 150px;
    padding: 6px 8px;
    background-color: rgba(227,227,227,0.85); /*#E3E3E3;*/
    border-radius: 7px;
    text-align: center;
    z-index: 999;
}

ul.menu-float-right {
    right: 10px;
}

ul.menu-float-left {
    left: 10px;
}

ul.menu-float-right li, ul.menu-float-left li {
    list-style: none;
    margin: 6px 0;
    padding: 0;
}

ul.menu-float-right img, ul.menu-float-left img {
    margin: -3px 0;
    padding: 0;
    height: 132px;
    width: 132px;
}

ul.menu-float-right p, ul.menu-float-left p {
    margin: 0;
    padding: 0;
    line-height: 20px;
    font-size: 14px;
    font-weight: bold;
    color: #333;
    /* 以下4句：实现文字纵向和横向都居中，且横向占满空间，因width:100%没用。 */
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}
    /* 目录 或 子标题 */
    ul.menu-float-right span, ul.menu-float-left span {
        margin: 0 auto;
        padding: 5px 0;
        font-size: 15px;
        color: #fff;
        background-color:rgba(229,128,0,0.85); /*#e58000;*/
        /* 以下4句：实现文字纵向和横向都居中，且横向占满空间，因width:100%没用。 */
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    ul.menu-float-right a, ul.menu-float-left a {
        margin: 0 auto;
        padding: 7px 0 5px 0;
        box-sizing: border-box; /* 是的边线在框内，不占外位 */
        border-bottom: solid 2px transparent; /* 配合a:hover 的效果 */
        line-height: 20px;
        font-size: 14px;
        letter-spacing:1px;
        color: #fff;
        background-color: var(--menu-float-item-bg);
        opacity:0.85;
        /* 以下4句：实现文字纵向和横向都居中，且横向占满空间，因width:100%没用。 */
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

        ul.menu-float-right a:link, ul.menu-float-right a:visited, ul.menu-float-left a:link, ul.menu-float-left a:visited {
            color: #fff;
        }

        ul.menu-float-right a:hover, ul.menu-float-left a:hover {
            color: #fff;
            /*background-color: rgba(0,128,0,0.8);*/
            opacity: 1;
            border-bottom: solid 2px #FFD800;
        }

        ul.menu-float-right a:active, ul.menu-float-left a:active {
            color: #FFD800; /*鼠标按下:明黄色*/
        }
/* ================================================= */


/* ===== 预防图片撑破容器 ========================== */
.box-main img {
    max-width:100%;
    max-height:100%;
}
/* ================================================= */

/* ===== 图片居中 ================================== */
.img-center {
    margin: 0 auto;
    width: 100%;
    text-align: center;
}

    .img-center img {
        max-width: 100%;
    }

    .img-center p {
        margin: 0;
        color: gray;
        font-size: 0.14rem;
        line-height: 0.20rem;
        text-align: center;
    }
/* ================================================== */


/* ===== 图片随容器自动宽度 ========================= */
.img-auto-width {
    margin: 0 auto;
    width: 100%;
}

    .img-auto-width img {
        width: 100%;
        height: auto;
    }

    .img-auto-width p {
        margin: 0;
        font-size: 0.14rem;
        line-height: 0.20rem;
        color: gray;
        text-align: right;
    }
/* ================================================== */


/* ===== 仅在移动端显示的图片，随容器自动宽度 ======= */
.img-mob {
    display: none; /* 默认PC段不显示 */
    margin: 0 auto;
    width: 100%;
    text-align: left;
}
    .img-mob img {
        max-width: 100%;
    }
/* ================================================== */


/* ===== 图片随容器自动铺满 ========================= */
.img-auto-fit {
    margin: 0 auto;
    width: 100%;
}

    .img-auto-fit img {
        object-fit: cover; /* CSS的新属性：将图片缩放并切割，以达到等比例的填充效果 */
        width: 100%;
        height: 100%;
    }

    .img-auto-fit p {
        margin: 0;
        color: gray;
        font-size: 0.14rem;
        line-height: 0.20rem;
        text-align: right;
    }
/* ================================================== */


/* ===上下页导航（展后报告、新闻、资讯等页共用）==== */
.ul-obj-nav {
    margin: 10px auto 0 auto;
    padding: 0;
    width: var(--box-main-width);
}
    .ul-obj-nav li {
        margin: 0 auto;
        list-style: none;
        font-size: 14px;
        line-height: 28px;
    }
    /*链接*/
    .ul-obj-nav a:link, .ul-obj-nav a:visited {
        color: #444;
        text-decoration: none;
    }
    .ul-obj-nav a:hover {
        color: #0391DB;
        text-decoration: none;
    }
    .ul-obj-nav a:active {
        color: red;
        text-decoration: none;
    }
/* ================================================= */


/*  === 分页导航（展后报告、新闻、资讯等列表共用）== */
.box-list-nav {
    margin: 20px auto;
    text-align: center;
    width: var(--box-main-width);
    display: block;
}
    .box-list-nav span {
        border: 1px solid #ccc;
        text-align: center;
        line-height: 28px;
        padding: 5px 10px;
        margin: 0 5px;
    }
    .box-list-nav select {
        width: 60px;
        height: 26px;
        padding: 0 1%;
    }
    .box-list-nav option {
        text-align: center;
    }
    .box-list-nav a {
        color: #444;
        text-decoration: none; /*去掉下划线*/
    }
        .box-list-nav a:link, .box-list-nav a:visited {
            color: #444;
        }
        .box-list-nav a:hover { /*鼠标划过:浅蓝*/
            color: #0391DB;
        }
        .box-list-nav a:active {
            color: red; /*鼠标按下:红色*/
        }
/* ================================================= */


/*  ============= 导航菜单(for mob) ================ */
.menu-mob {
    margin: 10px auto;
    padding: 0 20px;
    width: 100%;
}

.menu-mob ul {
    margin: 0 auto;
    text-align: center;
    width: 100%;
    display: inline-block;
}

.menu-mob li {
    float: left;
    margin: 2px 5px;
    padding: 4px;
    list-style: none;
    min-width: 95px;
}
/*导航链接样式*/
.menu-mob a {
    margin: 0 auto;
    padding: 4px 8px;
    border-bottom: solid 3px #ccc; /* 配合a:hover 的效果 */
    text-decoration: none; /*去掉下划线*/
    font-size: 15px;
    color: #fff;
    letter-spacing: 1px;
    background-color: #077D5F;
    opacity: 0.85;
    /* 以下4句：实现文字纵向和横向都居中，且横向占满空间，因width:100%没用。 */
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

    .menu-mob a:link, .menu-mob a:visited {
        color: #fff;
    }

    .menu-mob a:hover { /*设置鼠标划过:前景色和背景色*/
        color: #fff;
        opacity: 1;
        border-bottom: solid 3px #FFD800;
    }

    .menu-mob a:active {
        color: #0391DB; /*鼠标按下，字体颜色:浅蓝*/
    }

.menu-mob h2 {
    margin: 5px auto;
    line-height: 24px;
    font-size: 17px;
    font-weight: normal;
    color: #444;
    border-bottom: solid 1px #ccc;
}
/* ================================================= */


/* =========== 移动设备的快捷导航菜单按钮 ========== */
#menu-mob-btn {
    position: fixed;
    width: 80px;
    bottom: 0;
    right: 5px;
    text-align: center;
    background: rgba(0,0,0,0.6);
    padding: 20px 15px;
    clip-path: ellipse(35px 20px); /*椭圆形*/
    display: none;
}

    #menu-mob-btn a {
        font-size: 0.16rem;
        font-weight: normal;
        color: #fff;
        display: block;
    }
/* ================================================= */




/* 
 *  对于移动设备，px是抽象单位（对应电脑显示器可能是2px到30px物理像素不等），一般移动设备的浏览器为980px，BlackBerry、IE为1024px。
 *  以下css类都在本文档定义的，不会在具体应用中增添属性，可以直接在文末定义其相应的移动版式样，以求在移动端尽快响应
*/
@media only screen and (max-width: 840px) {
    :root {
        --box-main-width: 100%;
    }

    header, .menu-float-left, .menu-float-right, #toTop, footer table {
        display: none; /*隐藏*/
    }

    footer {
        padding: 0;
    }

    /*移动版菜单链接按钮*/
    #menu-mob-btn {
        display: block;
    }

    .box-main-bg {
        margin: 0 auto;
        padding: 0;
        width: 100%;
    }

    .box-main {
        margin: 0 auto;
        padding: 5px 10px;
        width: 100%;
        min-height: 200px;
        height: auto;
        border: none;
        box-shadow: none;
    }

    .adv-footer-shell {
        width: 100%;
        padding: 20px 10px 10px 10px;
    }


    /* 移动端显示显示 */
    .img-mob {
        display: inline-block;
    }

    /*分页导航（展后报告、新闻、咨询等的list列表页）*/
    .box-list-nav {
        line-height: 40px;
    }
}