/* 全局样式 */

* {
    outline: none;
}

a:hover {
    text-decoration: none;
}

/* banner背景 公共样式1 固定图片，根据不同分辨设定不同absolut的left 或者padding值

    <div id="party-banner" class="container-fluid banner-area px-0">
        <!-- 背景图片 -->
        <img src="../image/biitt_image/slices_img/dangj-banner-bg.png" alt="xxxxx">
        <!-- 背景文字 -->
        <div class="container">
            <p>党建工作</p>
            <!-- 面包屑导航 -->
            <div class="crumb-nav m-0 p-0">
                <ul class="breadcrumb shouye mx-0 p-0">
                    <li class="breadcrumb-item mr-2">
                        <a href="../skin/index.html">首页</a>
                    </li>
                    <li class="breadcrumb-item">
                        <a href="">党建工作</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
*/

/* @media screen and (min-width:1600px) {
    .banner-area>div.banner-content {
        left: 20% !important;
    }
}

@media screen and (min-width:1200px) and (max-width:1599px) {
    .banner-area>div.banner-content {
        left: 8.3%;
        left: 2.5%\0;
        
    }
} */

/* @media screen and (min-width:992px) and (max-width:1199px) {
    .banner-area>div.banner-content {
        margin-left: 24px !important;
        margin-right: 24px !important;
    }
} */

@media screen and (min-width:768px) and (max-width:991px) {
    /* .banner-area>div.banner-content {
        margin-left: 16px !important;
        margin-right: 16px !important;
    } */
    .banner-area>div p:first-child {
        font-size: 2.2rem!important;
        line-height: 2.5rem!important;
        margin-bottom: 1rem!important;
    }
    .banner-area>div.banner-content div li a {
        font-size: 1rem!important;
        line-height: 1rem!important;
    }
}

@media screen and (max-width:767px) {
    /* .banner-area>div.banner-content {
        margin-left: 64px !important;
        margin-right: 98px !important;
        top: 56% !important;
    } */
    .banner-area>div p:first-child {
        font-size: 2rem!important;
        line-height: 2rem!important;
        margin-bottom: 1rem!important;
    }
    .banner-area>div.banner-content div li a {
        font-size: 1rem!important;
        line-height: 1rem!important;
    }
}

@media screen and (max-width:575px) {
    /* .banner-area>div.banner-content {
        top: 76% !important;
        margin-left: 16px !important;
        margin-right: 16px !important;
    } */
    .banner-area>div p:first-child {
        font-size: 1.3rem!important;
        line-height: 1.3rem!important;
        margin-bottom: 0.6rem!important;
    }
    .banner-area>div.banner-content div li a {
        font-size: 0.8rem!important;
    }
}

.banner-area {
    position: relative;
}

.banner-area>img {
    width: 100%;
    height: auto;
}

.banner-area>div.banner-content {
    position: absolute;
    top: 50%;
	left: 0;
	width: 100%;
	-webkit-transform: translate(0, -50%);
	-ms-transform: translate(0, -50%);
	transform: translate(0, -50%);
    padding: 0px;
}

.banner-area ul.breadcrumb {
    background-color: rgba(0, 0, 0, 0)!important;
}

.banner-area>div.banner-content p {
    font-size: 50px;
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 500;
    color: rgba(255, 255, 255, 1);
    line-height: 70px;
}

.banner-area>div.banner-content div li a {
    font-size: 24px;
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 500;
    line-height: 33px;
}

.banner-area>div.banner-content li:first-child a {
    color: #E46110!important;
}

.banner-area>div.banner-content li a {
    color: rgba(255, 255, 255, 1)!important;
}

.banner-area>div.banner-content .breadcrumb-item+.breadcrumb-item::before {
    color: #fff!important;
    content: ">"!important;
}

/* banner 公共样式结束 */

/* /////////////////////////////////////////////////////////////////////// */

/* 二级导航栏 样式

html中的结构为：
    <div class="container p-0">
        <div class="navbar ejdaohang-bg">
            <ul class="nav navbar-nav nav-justified">
                <li class="nav-item">
                    <a class="nav-link" href="">集团新闻</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="">行业资讯</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="">专题展会</a>
                </li>
            </ul>
        </div>
    </div>

*/

@media screen and (min-width:1200px) {
    .ejdaohang-bg li a {
        font-size: 1.1rem !important;
        line-height: 1.25rem !important;
    }
}

@media screen and (min-width:992px) and (max-width:1199px) {
    .ejdaohang-bg li a {
        font-size: 1.25rem !important;
        line-height: 1.25rem !important;
    }
}

@media screen and (min-width:768px) and (max-width:991px) {
    .ejdaohang-bg li {
        margin-right: 2rem!important;
    }
    .ejdaohang-bg li a {
        font-size: 1rem !important;
        line-height: 1rem !important;
    }
}

@media screen and (max-width:767px) {
    .ejdaohang-bg li {
        margin-right: 1.2rem!important;
    }
    .ejdaohang-bg .navbar {
        padding-bottom: 0px !important;
    }
}

@media screen and (max-width:575px) {
    .ejdaohang-bg li {
        margin-right:1rem!important;
    }
    .ejdaohang-bg li a {
        font-size: 0.6rem !important;
        line-height: 1rem !important;
    }
    .ejdaohang-bg {
        padding: 4px 0px !important;
    }
    .ejdaohang-bg .navbar {
        padding-bottom: 0px !important;
    }
}

#ejdaohangFixedTop {
    padding-left: 0px;
    padding-right: 0px;
}

.ejdaohang-bg li:last-child {
    margin-right: 0rem !important;
}

.ejdaohang-bg {
    background: rgba(228, 97, 16, 0.7);
    padding: 13px 0px;
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    align-items: center;
    margin-top: -10px;
}

.ejdaohang-bg .navbar {
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    align-content: center;
}

.ejdaohang-bg li a:hover {
    color: rgba(255, 255, 255, 1);
}

.ejdaohang-bg li a:active {
    color: rgba(255, 255, 255, 1);
}

.ejdaohang-bg li a {
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 500!;
    color: rgba(0, 0, 0, 1);
    margin-left: 0rem!;
    margin-right: 0rem!;
    white-space: nowrap;
}

.ejdaohang-bg li {
    margin-right: 3rem;
}

.ejdaohang-bg li:last-child {
    margin-right: 0rem;
}

.ejdaohang-bg ul {
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    align-items: center;
    width: 80%;
}

/* 二级导航栏 固定在页面上端的样式 */

/* .sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 100;
} */

.fixed-top .ejdaohang-bg {
    background: rgba(228, 97, 16, 1);
}

.ejdaohang-bg li a.nav-link.active {
    color: #fff;
}

/* 二级导航栏样式结束 */

/*--------------------------------------------------------------------------------------*/

/* 主营业务 字体样式 
html中结构如下：
<!-- 主要业务-头 -->
        <div class="row m-0 px-5 mt-5">
            <div class="col-sm-12 p-0">
                <h1 class="zyyw">主营业务</h1>
            </div>
        </div>
*/

@media screen and (min-width:992px) {
    .zyyw {
  /*      height: 4rem;*/
		 height:auto;
        font-size: 2rem;
        line-height: 2rem;
    }
}

@media screen and (min-width:768px) and (max-width:991px) {
    .zyyw {
        font-size: 2rem;
        line-height: 2rem;
    }
}

@media screen and (max-width:767px) {
    .zyyw {
        height: 2rem;
        font-size: 1.8rem;
        line-height: 2rem;
    }
}

@media screen and (max-width:575px) {
    a.ljgd {
        font-size: 1rem !important;
        line-height: 2rem !important;
    }
    #main-business {
        padding: 0 1rem !important;
    }
    a.ljgd>i {
        font-size: 1rem !important;
        line-height: 2rem !important;
    }
}

#main-business {
    padding: 0rem;
}

.zyyw {
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 500;
    color: rgba(3, 29, 86, 1);
  /*  text-indent: 8px;*/
 padding-left: 10px;
	line-height: 2rem;
}

/*--------------------------------------------------------------------------------------*/

/* 橘白两色拼接横线 样式

此样式为首页中主营业务标题下方的，橘色和白色两种颜色拼接的横线，html中结构如下：
    <div class="ml-5 yw-hengxian">
        <div class="yw-hengxian1"></div>
        <div class="yw-hengxian2"></div>
    </div> 

*/

.yw-hengxian {
    height: 2px;
    clear: both;
    margin-bottom: 26px;
}

.yw-hengxian1 {
    border-bottom: solid 2px rgba(3, 29, 86, 1);
    width: 45px;
    float: left;
}

.yw-hengxian2 {
    border-bottom: solid 2px rgba(228, 97, 16, 1);
    width: 80px;
    float: left;
}

/* 橘白两色拼接横线样式结束 */

/* ----------------------------------------------------------------------------------------------------------- */

/* 了解更多带箭头 样式

html中代码结构如下：
    <div class="row m-0 px-5">
        <div class="col-sm-12 p-0 text-between">
            <h1 class="zyyw">主营业务</h1>
            <a class="ljgd" href="">
                了解更多
                <img src="../image/biitt_image/slices_img/shuangjt@2x.png" alt="xxxxx" class="ml-2">
            </a>  
        </div>
    </div>

*/

a.ljgd {
    font-size: 1.5rem;
    line-height: 2rem;
    float: right;
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 500;
    color: rgba(3, 29, 86, 1);
    transition: all 3s;
}

a.ljgd>i {
    font-size: 2rem;
    line-height: 2rem;
}

a.ljgd>i:hover {
    transform: scale3d(1.3, 1.3, 1.3)!important;
    color: rgba(223, 101, 20, 1);
}

a.ljgd:hover {
    text-decoration: none!important;
    color: rgba(223, 101, 20, 1);
}

/* 图片响应式 样式 */

/* 业务模块样式

此样式为首页中，主营业务下方的业务方块样式，html结构如下：
    <div class="col-lg-3 col-md-6 col-sm-12 p-0 text-center pr-md-3 pr-sm-0 mb-sm-4">
        <a href="">
            <div class="mainbusi-block">
                <img src="../image/biitt_image/slices_img/ditie@2x.png" alt="xxxxx" >
                <p class="mainbusi-block-title">轨道智慧交通</p>
                <p class="content">AFC自动售检票系统、ACC自 动售检票清分清算系统、PIS 乘客信息系统</p>
                <div>
                    <img src="../image/biitt_image/slices_img/huangjt@2x.png" alt="xxxxx">
                </div>
            </div>
        </a>
    </div>

*/

@media screen and (min-width:992px) {
    #main-business {
        margin-top: 4.1rem;
        margin-bottom: 8.3rem;
    }
    #main-business .mainbusi-block-xs {
        padding: 0rem;
    }
}

@media screen and (min-width:768px) and (max-width:991px) {
    #main-business {
        margin-top: 2rem;
        margin-bottom: 5rem;
    }
    #main-business .mainbusi-block-xs {
        padding: 0rem;
    }
}

@media screen and (max-width:767px) {
    #main-business {
        margin-top: 2rem;
        margin-bottom: 3rem;
    }
    #main-business .mainbusi-block-xs {
        margin-bottom: 1.5rem;
        padding: 0rem;
    }
}

@media screen and (max-width:575px) {
    #main-business {
        margin-top: 2rem;
        margin-bottom: 3rem;
    }
    .mainbusi-block-xs {
        margin-bottom: 1.5rem;
        padding: 0rem;
    }
}

.mainbusi-block {
    background: rgba(240, 244, 247, 1);
    display: flex;
    flex-flow: column wrap;
    justify-content: flex-end;
    align-items: center;
    border-bottom: solid 5px rgba(3, 29, 86, 1);
    transition: all 0.3s;
}

.mainbusi-block:hover {
    transform: scale3d(1.1, 1.1, 1.1)!important;
    background: rgba(3, 29, 86, 1);
    color: rgba(255, 255, 255, 1);
    border-bottom: solid 5px rgba(223, 101, 20, 1);
}

.mainbusi-block:hover p.mainbusi-block-title {
    color: rgba(255, 255, 255, 1)!important;
}

.mainbusi-block:hover p.content {
    color: rgba(255, 255, 255, 1)!important;
}

.mainbusi-block:hover div.mainbusi-block-ditie {
    background: url("../images/ditie-select.png") no-repeat;
}

.mainbusi-block:hover div.mainbusi-block-dianxin {
    background: url("../images/dianxin-select.png") no-repeat;
}

.mainbusi-block:hover div.mainbusi-block-yunying {
    background: url("../images/yuying@2x.png") no-repeat;
}

.mainbusi-block:hover div.mainbusi-block-diannao {
    background: url("../images/diannao-select.png") no-repeat;
}

.mainbusi-block-ditie {
    background: url("../images/ditie@2x.png") no-repeat;
    width: 66px;
    height: 62px;
    margin-top: 3rem;
    margin-bottom: 1rem;
}

.mainbusi-block-dianxin {
    background: url("../images/dianxin@2x.png") no-repeat;
    width: 46px;
    height: 62px;
    margin-top: 3rem;
    margin-bottom: 1rem;
}

.mainbusi-block-yunying {
    background: url("../images/yuying@2x.png") no-repeat;
    width: 62px;
    height: 62px;
    margin-top: 3rem;
    margin-bottom: 1rem;
}

.mainbusi-block-diannao {
    background: url("../images/diannao@2x.png") no-repeat;
    width: 62px;
    height: 62px;
    margin-top: 3rem;
    margin-bottom: 1rem;
}

.mainbusi-block>p.mainbusi-block-title {
    width: 220px;
    height: 45px;
    font-size: 16px;
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 500;
    color: rgba(0, 0, 0, 1)!important;
    margin-bottom: 1.5rem;
    overflow: hidden!important;
}

.mainbusi-block>p.content {
    width: 220px;
    height: 80px;
    overflow: hidden!important;
    font-size: 14px;
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 500;
    color: rgba(0, 0, 0, 1);
    margin-bottom: 3rem !important;
}

.mainbusi-block-aniu {
    width: 40px;
    height: 40px;
    margin-bottom: 0px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 3px 6px 0px rgba(179, 179, 179, 0.5);
    display: flex;
    flex-flow: column wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: -1.2rem !important;
    transition: all 0.3s;
}

.mainbusi-block-aniu:hover {
    transform: scale3d(1.1, 1.1, 1.1)!important;
    background: rgba(223, 101, 20, 1);
}

.mainbusi-block-aniu i {
    font-size: 23px;
    color: rgba(223, 101, 20, 1);
}

.mainbusi-block-aniu:hover i {
    color: rgba(255, 255, 255, 1);
}

/* 业务模块样式结束 */

/* ----------------------------------------------------------------------------------------------------------- */

/* 文章详情页 分页样式 

在html中，结构如下：
    <div class="yw-fanye">    
        <ul class="pagination">
            <li><a href="">上一篇</a></li>
            <li><a href="#">❮</a></li>
            <li><a href="#">❯</a></li>
            <li><a href="">下一篇</a></li>
        </ul> 
    </div>
*/

@media screen and (max-width:575px) {}

.yw-fanye {
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    align-items: center;
    margin-top: 90px;
    margin-bottom: 40px;
}

.disabled {
    pointer-events: none;
    cursor: default;
}

ul.pagination {
    padding: 0;
    margin: 0;
}

ul.pagination li {
    display: inline;
}

ul.pagination li a {
    float: left;
    padding: 8px 16px;
    margin-right: 20px;
    text-decoration: none;
    transition: background-color .3s;
    font-size: 18px;
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 500;
    color: rgba(0, 29, 86, 1);
    line-height: 20px;
}

ul.pagination li:first-child a {
    padding-right: 10px;
    padding-left: 10px;
}

ul.pagination li:last-child a {
    padding-right: 10px;
    padding-left: 10px;
    margin-right: 0px;
}

ul.pagination li:nth-child(2) a {
    margin-right: 20px;
    border: 1px solid #fff;
    background: #eeeeee;
}

ul.pagination li:nth-child(3) a {
    margin-left: 20px;
    border: 1px solid #fff;
    background: #eeeeee;
}

/* 文章分页样式结束 */

/* ----------------------------------------------------------------------------------------------------------- */

/* 新闻模块 样式
html中代码格式如下：
<div class="news-block">
    <div>
        <img src="../image/biitt_image/slices_img/news-img-2.png" alt="xxxxx">
    </div>
    <div>
        <p class="news-block-title">凝心聚力 驰援疫情防控</p>
        <p class="news-block-content">与社会各界凝心聚力，为抗击…</p>
        <div class="news-block-date">
            <a href="">2020-02-05</a>
        </div>
        <div class="news-block-icon">
            <a href="">
                <img src="../image/biitt_image/slices_img/baidi-hsejt-da.png" alt="xxxxx">
            </a>
        </div>
    </div>
</div>

*/

@media screen and (min-width:992px) and (max-width:1200px) {
    /* .news-block>div:first-child>img {
        width: 300px !important;
    } */
    .news-block>div:last-child {
        position: absolute;
        left: 10px;
        right: 10px;
        top: 12rem !important;
    }
}

@media screen and (min-width:768px) and (max-width:991px) {
    /* .news-block>div:first-child>img {
        width: 220px !important;
    } */
    .news-block>div:last-child {
        position: absolute;
        left: 10px;
        right: 10px;
        top: 8.5rem !important;
    }
}

@media screen and (max-width:767px) {
    .news-block>div:last-child {
        position: absolute;
        left: 10px;
        right: 10px;
        top: 22rem !important;
    }
    .news-block {
        margin-bottom: 290px;
    }
    .new-mokuai {
        margin-bottom: 50px !important;
    }
}

@media screen and (max-width:575px) {
    .new-mokuai {
        padding: 1rem !important;
    }
    .news-block>div:last-child {
        position: absolute;
        left: 10px;
        right: 10px;
        top: 14rem !important;
    }
    .new-mokuai {
        margin-bottom: 20px !important;
    }
    .news-center {
        margin: 30px 0 40px 0 !important;
    }
}

.new-mokuai {
    padding: 0px;
}

.news-block {
    position: relative;
    transition: all 0.3s;
    margin-bottom: 300px;
}

.news-block>div:first-child {
    overflow: hidden;
}

.news-block:hover {
    transform: scale3d(1.1, 1.1, 1.1)!important;
}

.content-area .news-block>div:first-child img {
    width: 100%;
    height: 264px;
}

.news-block>div:last-child {
    height: 13.43rem;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.22);
    border-bottom: solid 5px rgba(3, 29, 86, 1);
    padding: 20px 31px 35px 31px;
    position: absolute;
    left: 10px;
    right: 10px;
    top: 14rem;
}

.news-block>div:last-child:hover {
    border-bottom: solid 5px rgba(228, 97, 16, 1);
}

.news-block>div:last-child .news-block-title {
    height: 3.5rem;
    font-size: 1.25;
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 500;
    color: rgba(1, 1, 1, 1);
    line-height: 1.75rem;
    margin-bottom: 10px;
    overflow: hidden!important;
}

.news-block>div:last-child .news-block-content {
    height: 4.68rem;
    font-size: 1rem;
    font-family: PingFang-SC-Regular, PingFang-SC;
    font-weight: 400;
    color: rgba(0, 0, 0, 1);
    line-height: 1.56rem;
    margin-bottom: 20px;
    overflow: hidden!important;
}

.news-block>div:last-child .news-block-date a {
    font-size: 1rem;
    font-family: PingFang-SC-Regular, PingFang-SC;
    font-weight: 400;
    color: rgba(60, 110, 168, 1);
    line-height: 1.37rem;
}

.news-block .news-block-icon {
    text-align: center;
    margin-bottom: -30px;
}

.news-block-icon>a>div {
    height: 62px;
    background: url("../images/baidi-hsejt-da.png") no-repeat;
    background-position: center;
}

.news-block-icon>a>div:hover {
    height: 62px;
    background: url("../images/dajiantou-select.png") no-repeat;
    background-position: center;
}

/* 新闻模块样式 结束 */

/* ------------------------------------------------------------------------- */

/* 新闻文章详情 页面样式 
html中代码格式如下：
    <div class="news-product">
        <div class="news-product-title">
            <h2>凝心聚力 共克时艰 京投交通科技向武汉捐赠100万元驰援疫情防控</h2>
        </div>
        <div class="news-product-content">
            <p></p>
        </div>
    </div>
*/

.news-product {
    margin-top: 5.6rem;
    margin-bottom: 5.6rem;
    padding: 0px;
}

@media screen and (max-width:575px) {
    .news-product {
        margin-top: 5.6rem;
        margin-bottom: 5.6rem;
        padding: 0 1rem;
    }
}

.news-product-title {
    text-align: center;
    font-size: 2.25rem;
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 500;
    color: rgba(0, 0, 0, 1);
    line-height: 50px;
    margin: 0 0 50px 0;
}

.news-product-content {
    font-size: 1.5rem;
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 500;
    color: rgba(0, 0, 0, 1);
    line-height: 2.75rem;
    letter-spacing: 1px;
}

/*新闻文章详情 页面样式  结束 */

/* ------------------------------------------------------------------------- */

/* 股东资料详情页
    <div class="container details-content">
        <div class="content-title">
            <h4>2019财政年</h4>
        </div>
        <div class="content-section">
            <p>近期，新超负荷运转</p>
        </div>
        <div class="yw-fanye">
            <ul class="pagination">
                <li><a href="">上一篇</a></li>
                <li><a href="#">❮</a></li>
                <li><a href="#">❯</a></li>
                <li><a href="">下一篇</a></li>
            </ul>
        </div>
    </div>
*/

@media screen and (max-width:575px) {
    .details-content {
        padding: 0 1rem !important;
    }
}

.details-content {
    margin-top: 5.6rem;
    margin-bottom: 5.6rem;
    padding: 0px;
}

/* 带图片的新闻列表样式 
html中代码结构如下：
    <div class="news-list-card">
        <ul class="list-unstyled">
            <li class="media">
                <img src="../image/biitt_image/slices_img/news-list-img2.png" class="align-self-center" alt="...">
                <div class="media-body">
                    <h5></h5>
                    <p></p>
                </div>
                <div class="news-list-day">
                    <div>
                        <a href="">2020-02-05</a>
                    </div>
                    <div>
                        <div></div>
                        <a href="">131</a>
                    </div>
                </div>
            </li>
        </ul>
    </div>
*/

@media screen and (min-width:768px) and (max-width:991px) {
    .media-body p {
        display: none;
    }
}

@media screen and (max-width:767px) {
    .media-body p {
        display: none;
    }
    .news-list-card .media-body {
        /* padding-right: 10px !important;
        padding-left: 10px !important; */
    }
    .news-list-card .media-body>h5 {
        width: auto;
        height: auto!important;
        font-size: 16px!important;
        line-height: 25px!important;
        overflow: hidden!important;
        margin-bottom: 10px;
    }
    .media-body {
        display: block !important;
    }
    .news-list-day {
        padding-left: 0rem !important;
    }
    .news-list {
        margin-top: 30px !important;
    }
}

@media screen and (max-width:575px) {
    .news-list {
        margin-top: 30px !important;
        padding: 0rem 15px !important;
    }
}

.news-list {
    margin-top: 75px;
    margin-bottom: 90px;
    padding: 0px;
}

.news-list-day {
    white-space: nowrap;
    padding-left: 4rem;
}

.media-body {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: flex-start;
}

.news-list-day>a {
    font-size: 16px;
    font-family: PingFang-SC-Regular, PingFang-SC;
    font-weight: 400;
    color: rgba(60, 110, 168, 1)!important;
    line-height: 22px;
}

.news-list-card .media {
    border-bottom: 1px solid #e1e1e1;
    padding-top: 30px;
    padding-bottom: 30px;
    /* margin: 30px 0 30px 0; */
}

.news-list-card .media:first-child {
    padding-top: 0px;
}

.news-list-card .media>img {
    width: 160px;
    height: auto;
}

.news-list-card .media-body {
    padding-left: 20px;
}

.news-list-card .media-body>h5 {
    width: auto;
    height: 28px;
    font-size: 20px;
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 500;
    color: rgba(0, 0, 0, 1);
    line-height: 28px;
    overflow: hidden!important;
    margin-bottom: 10px;
}

.news-list-card .media-body>p {
    width: auto;
    height: 62px;
    font-size: 16px;
    font-family: PingFang-SC-Regular, PingFang-SC;
    font-weight: 400;
    color: rgba(0, 0, 0, 1);
    line-height: 25px;
    overflow: hidden!important;
    margin: 0px;
}

.news-list-card {
    width: 100%;
    height: auto;
    /* overflow-y: auto; */
}

.news-list-card .media:hover>div h5, .news-list-card li.media:hover>div p {
    color: rgba(228, 97, 16, 1);
}

li.media:hover div.news-list-day>a {
    color: rgba(228, 97, 16, 1) !important;
}

/* 带下载的新闻列表样式 */

/* .info-public {
    width: 100%;
    height: auto;
} */

/* 浏览次数图标 */

/* .news-list-card li.media:hover .news-list-day>div>div {
    background: url("../images/liulan-img-orange.png");
} */

/*  新闻列表样式 结束 */

/* ------------------------------------------------------------------------- */

/* 垂直时间轴 样式 
html中代码结构：
    <ul id="myScrollspy" class="news-list-data nav navbar-nav">
        <li class="nav-item">
            <a class="nav-link" href="#2020year"><i class="fa fa-circle"></i>2020年</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="#2019Year"><i class="fa fa-circle"></i>2019年</a>
        </li>
    </ul>
*/

@media screen and (max-width:767px) {
    .news-list-data {
        display: none !important;
    }
    .yincan-data-list {
        display: block !important;
        padding-left: 98px !important;
        padding-right: 98px !important;
    }
    #yincang-year {
        padding-left: 98px !important;
        padding-right: 98px !important;
    }
}

@media screen and (max-width:575px) {
    .news-list-data {
        display: none !important;
    }
    .yincan-data-list {
        display: block !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    #yincang-year {
        padding-left: 16px !important;
        padding-right: 16px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
}

.news-list-data {
    border-left: 1px solid #e1e1e1;
    /* width: 100%; */
    height: auto;
    white-space: nowrap;
}

/* 更新时间轴样式 最新版 */

.news-list-data-fixed {
    top: 20px;
    position: fixed;
    background: rgba(255, 255, 255, 1);
    z-index: 100;
}

ul.news-list-data.nav li.nav-item a.nav-link.active {
    color: rgba(228, 97, 16, 1);
}

ul.news-list-data.nav li.nav-item a.nav-link.active i {
    color: rgba(228, 97, 16, 1);
}

ul.news-list-data.nav li.nav-item a {
    font-size: 1.5rem;
    color: rgba(0, 0, 0, 1);
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 400;
    line-height: 33px;
}

ul.news-list-data.nav li.nav-item a i {
    margin-right: 20px;
    color: rgba(225, 225, 225, 1);
}

ul.news-list-data.nav li.nav-item {
    margin-left: -10px;
    margin-bottom: 15px;
}

ul.news-list-data.nav li.nav-item a.nav-link {
    padding-top: 0px;
}

.news-list-data li:hover a {
    color: rgba(228, 97, 16, 1) !important;
}

.news-list-data li:hover a i {
    color: rgba(228, 97, 16, 1) !important;
}

/* ////////////////////////////////////////////////// */

/* 隐藏时间轴 样式 */

.yincan-data-list {
    display: none;
    border-bottom: 1px solid #eeeeee;
    margin-top: 1.6rem;
    line-height: 3rem;
}

.yincan-data-list ul, #yincang-year ul {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: center;
    padding: 0rem;
    margin-bottom: 0rem;
}

.yincan-data-list li, #yincang-year li {
    list-style: none;
}

.yincan-data-list li a, #yincang-year li a {
    color: rgba(0, 0, 0, 1);
}

.yincan-data-list li:active a {
    color: rgba(228, 97, 16, 1);
}

.yincan-data-list li:active {
    border-bottom: 1px solid rgba(228, 97, 16, 1);
}

.yincan-data-list li.active a {
    color: rgba(228, 97, 16, 1);
}

.yincan-data-list li.active {
    border-bottom: 1px solid rgba(228, 97, 16, 1);
}

#yincang-year li a:active {
    color: rgba(228, 97, 16, 1);
}

#yincang-year {
    background: #eeeeee;
    width: 100%;
    height: auto;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    line-height: 3rem;
}

/* 垂直时间轴 样式 结束 */

/* ------------------------------------------------------------------------- */

/* 隐藏年份标题 */

@media screen and (max-width:767px) {
    div.luyan-year.container {
        display: block !important;
        margin-top: 30px !important;
        padding: 0px !important;
    }
}

@media screen and (max-width:575px) {
    div.luyan-year.container {
        display: block !important;
        margin-top: 30px !important;
        /* padding-left: 16px !important; */
    }
}

div.luyan-year.container {
    display: none;
}

.luyan-year {
    margin-bottom: 30px;
}

.luyan-year {
    font-size: 24px;
    font-family: PingFang-SC-Regular, PingFang-SC;
    font-weight: 400;
    color: rgba(0, 0, 0, 1);
    line-height: 33px;
    padding-right: 50px;
}

/* 隐藏年份标题样式结束 */

/* 新闻列表分页 样式 

在html中，结构如下：
    <div class="news-list-fenye">    
        <ul class="pagination">
            <li><a href="">❮</a></li>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="">❯</a></li>
        </ul> 
    </div>
*/

@media screen and (max-width:767px) {
    .news-list-fenye ul.pagination li a {
        padding: 1px 8px !important;
        font-size: 18px !important;
        line-height: 22px !important;
        margin: 0 1px !important;
    }
    .news-list-fenye ul.pagination li {
        margin-right: 8px !important;
    }
}

.news-list-fenye {
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    align-items: center;
    margin-top: 65px;
    margin-bottom: 40px;
}

.news-list-fenye ul.pagination {
    padding: 0;
    margin: 0;
}

.news-list-fenye ul.pagination li {
    display: inline;
    margin-right: 10px;
}

.news-list-fenye ul.pagination li:last-child {
    margin-right: 0px;
}

.news-list-fenye ul.pagination li a {
    padding: 6px 14px;
    text-decoration: none;
    transition: background-color .3s;
    font-size: 20px;
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 500;
    color: rgba(0, 29, 86, 1);
    line-height: 28px;
    border: 1px solid rgba(246, 246, 246, 1);
    border-radius: 10%;
    margin: 0 4px;
    background: rgba(246, 246, 246, 1);
}

ul.pagination li a:hover {
    color: rgba(255, 255, 255, 1) !important;
    background: rgba(223, 101, 20, 1) !important;
}

.news-list-fenye .SimpleTurnPager span {
    padding: 6px 14px;
    text-decoration: none;
    transition: background-color .3s;
    font-size: 20px;
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 500;
    color: rgba(0, 29, 86, 1);
    line-height: 28px;
    border: 1px solid rgba(246, 246, 246, 1);
    border-radius: 10%;
    margin: 0 4px;
    background: rgba(246, 246, 246, 1);
}

ul.pagination .SimpleTurnPager span:hover {
    color: rgba(255, 255, 255, 1) !important;
    background: rgba(223, 101, 20, 1) !important;
}

/* 新闻列表分页 样式结束 */

/* ----------------------------------------------------------------------------------------------------------- */

/* 联系我们 
    <div id="contact-us" class="container-fluid px-0">
        <div class="contact-us">
            <div class="zyyw">联系我们</div>
            <div class="yw-hengxian">
                <div class="yw-hengxian1"></div>
                <div class="yw-hengxian2"></div>
            </div>
            <div class="contact-tu">
                <span>“</span>
                <img src="../image/biitt_image/slices_img/cotact-renl.png" alt="xxxxx">
                <span>”</span>
            </div>
            <button class="contact-anniu">联系我们</button>
        </div>
    </div>
*/

@media screen and (max-width:767px) {
    /* .contact-anniu {
        width: 560px !important;
        height: 80px !important;
        font-size: 1.8rem !important;
    } */
    .contact-us {
        height: 400px !important;
    }
}

@media screen and (max-width:575px) {
    .contact-anniu {
        width: 300px !important;
        height: 60px !important;
        font-size: 1.8rem !important;
        margin-top: 0px !important;
    }
    .contact-us {
        height: 400px !important;
        width: auto !important;
        margin-bottom: 0px !important;
    }
}

#contact-us {
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    align-items: center;
    background: rgba(246, 246, 246, 1);
    width: 100%;
    height: auto;
    padding: 46px 0px;
}

.contact-us {
    width: 500px;
    height: 500px;
    background: url("../images/contact-bg.png") no-repeat;
    background-size: 100% auto;
    display: flex;
    flex-flow: column nowrap;
    justify-self: start;
    align-items: center;
    padding-top: 33px;
    margin-bottom: 46px;
}

a.contact-anniu {
    display: block;
    text-align: center;
    width: 590px;
    height: 100px;
    background: #FF4400;
    font-size: 40px;
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 500;
    color: rgba(255, 255, 255, 1);
    line-height: 100px;
    margin-top: 50px;
    color: rgba(255, 255, 255, 1);
    border-radius: 5px;
}

a.contact-anniu:hover {
    background: rgba(3, 29, 86, 1);
}

.contact-tu {
    margin-top: 20px;
}

.contact-tu>span {
    font-size: 72px;
    font-family: PingFang-SC-Medium, PingFang-SC;
    font-weight: 500;
    color: rgba(223, 101, 20, 1);
    line-height: 100px;
    letter-spacing: 1px;
}

.contact-tu>img {
    vertical-align: text-bottom;
    padding-left: 47px;
    padding-right: 47px;
}

/* 手机屏幕下 标题在上方，图片在下方 公共样式
<!-- 隐藏头 -->
    <div class="yincan-title">
        <div class="zyyw">公司简介</div>
        <div class="yw-hengxian">
            <div class="yw-hengxian1"></div>
            <div class="yw-hengxian2"></div>
        </div>
    </div>
*/

@media screen and (min-width:768px) and (max-width:991px) {
    .yincan-title {
        display: block !important;
        margin-left: 24px;
        margin-right: 24px;
        margin-bottom: 10px;
    }
    .show-title {
        display: none !important;
    }
}

@media screen and (max-width:767px) {
    .yincan-title {
        display: block !important;
        margin-left: 98px;
        margin-right: 98px;
        margin-bottom: 10px;
    }
    .show-title {
        display: none !important;
    }
}

@media screen and (max-width:575px) {
    .yincan-title {
        display: block !important;
        padding: 1rem !important;
        margin: 0rem !important;
    }
    .show-title {
        display: none !important;
    }
}

.yincan-title {
    display: none;
}

.yincan-title .zyyw {
    margin-bottom: 20px;
}

/*  */