.maincolor {
    color: #888;
    /*文字*/
    color: #494949;
    /*重文字*/
    color: #333/*特重文字*/
    color：#d2a779/*主色调*/
    color：#ddd;
    /*边框*/
    color: #f4f4f4;
    /*背景*/
}

.content {
    padding-top: 0;
}

@media screen and (max-width: 767px) {
    .content {
        padding-top: 64px;
    }
}

/*kv*/

.column_kv {
    position: relative;
}

.column_kv .kv_con {
    position: relative;
    height: calc(100vh - 64px);
    overflow: hidden;
}

.column_kv .kv_con:after {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    content: '';
    height: 192px;
    z-index: 2;
    background: linear-gradient(to bottom, rgba(255, 255, 255, .7) 0%, rgba(255, 255, 255, .5) 30%, rgba(238, 238, 238, 0) 100%);
}

.column_kv .bg_container {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.column_kv .video_container {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    z-index: 1;
}

.column_kv .video_container video {
    height: 100%;
    width: calc(1600vh / 9);
    margin: 0 (50% - 800vh / 9);
    -o-object-fit: cover;
    object-fit: cover;
    background: #000;
    z-index: 1;
}

.column_kv .video_container canvas {
    position: absolute;
    height: 100%;
    width: calc(1600vh / 9);
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
}

.column_kv .isandroid .video_container video {
    display: none;
}

.column_kv .kvtxt {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 75%;
    color: #333;
    padding: 10em 0 8em;
    min-width: 1400px;
    transform: translate(-50%, -50%);
    /* background: url(/uploads/image/gltsimages/kvtxt_bg.png) no-repeat center center; background-size:contain; */
    z-index: 5;
    text-align: center;
}

.column_kv .kvtxt h3 {
    font-size: 48px;
    line-height: 150%;
    font-weight: lighter;
    text-shadow: 0 10px 20px rgba(255, 255, 255, .2);
    position: relative;
    z-index: 6;
}

.column_kv .kvtxt h4 {
    font-size: 36px;
    line-height: 167%;
    font-weight: lighter;
    text-shadow: 0 10px 20px rgba(255, 255, 255, .2);
    position: relative;
    z-index: 6;
}

.column_kv .kvtxt p {
    font-size: 16px;
    line-height: 250%;
    font-weight: lighter;
    text-shadow: 0 4px 8px rgba(255, 255, 255, .2);
    position: relative;
    z-index: 6;
}

.column_kv .kvtxt strong {
    font-weight: bold;
}

.column_kv .kvtxt span {
    display: inline-block;
}

.column_kv .more {
    display: inline-block;
    background: #d2a779;
    /*border:1px solid #fff;*/
    color: #fff;
    padding: 8px 32px;
    margin-top: 30px;
    position: relative;
    z-index: 6;
}

/* .column_kv .swiper-container-horizontal>.swiper-pagination-bullets,.column_kv .swiper-pagination{position: absolute; width:16px; left: auto; bottom:auto;right: 10px;top: 50%;transform: translate3d(0px,-50%,0);}
 .column_kv .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.column_kv .swiper-pagination-switch{ background: none; width: 16px; height: 16px; margin: 2px 0; opacity: 1; position: relative; border: 1px solid transparent;outline: none !important; display: inline-block; border-radius: 50%; cursor: pointer;}
.column_kv .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet:after,.column_kv .swiper-pagination-switch:after{ content: ""; position: absolute; width: 6px; height: 6px; left: 4px; top:4px; border-radius: 50%; background: #fff;}
.column_kv .arrow{display: none;}
.column_kv .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active,.column_kv .swiper-active-switch{border-left-color: #fff;border-bottom-color: #fff;} */

.column_kv .swiper-container-horizontal>.swiper-pagination-bullets, .column_kv .swiper-pagination {
    left: 0;
    right: 0;
    position: absolute;
    bottom: 8px;
    text-align: center;
}

.column_kv .swiper-pagination-bullet, .column_kv .swiper-pagination-switch {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin: 4px 3px !important;
    border-radius: 50%;
    background-color: #fff;
    opacity: 1;
    outline: none;
    transform: scale(.75);
    opacity: .7;
    border: 1px solid #333;
}

.column_kv .swiper-pagination-bullet-active, .column_kv .swiper-active-switch {
    background-color: #fff;
    transform: scale(1);
    opacity: 1;
}

.column_kv .swiper-button-prev, .column_kv .swiper-button-next {
    left: 4%;
    top: 50%;
    width: 30px;
    height: 30px;
    outline: none;
    position: absolute;
    margin-top: -37px;
    color: #333;
    font-size: 30px;
    line-height: 30px;
    text-align: left;
    z-index: 5;
    cursor: pointer;
    transform: scaley(2);
    opacity: .5;
}

.column_kv .swiper-button-prev:hover, .column_kv .swiper-button-next:hover {
    color: #d2a779;
    opacity: 1;
}

.column_kv .swiper-button-prev:after {
    content: "<";
}

.column_kv .swiper-button-next:after {
    content: ">";
}

.column_kv .swiper-button-next {
    left: auto;
    right: 4%;
    text-align: right;
}

@media screen and (max-width: 1440px) {
    .column_kv .kvtxt {
        min-width: 0;
        width: 100%;
        padding: 10em 20px 8em;
    }
}

/* @media screen and (max-width: 1280px){
    .column_kv .kvtxt h3{font-size: 36px;}
    .column_kv .kvtxt h4{font-size: 27px;}
    .column_kv .kvtxt p{font-size: 12px;}
    .column_kv .kvtxt br{display: none;}
} */

@media screen and (max-width: 767px) {
    /* .column_kv .video_container canvas{height: 100%; width: calc((1600vh - 1024)/ 9);} */
    .column_kv .kvtxt {
        width: 94%;
        top: 40%;
        padding: 10em 0 8em;
    }
    .column_kv .kvtxt h3 {
        font-size: 28px;
    }
    .column_kv .kvtxt h4 {
        font-size: 21px;
    }
    .column_kv .kvtxt p {
        font-size: 12px;
        line-height: 216.67%;
    }
    .column_kv .kvtxt br {
        display: block;
    }
    .column_kv .more {
        padding: 4px 20px;
    }
    .column_kv .arrow {
        display: block;
        position: absolute;
        left: 45.5%;
        bottom: 0;
        z-index: 10;
        width: 9%;
        height: 0;
        padding: 9% 0 0;
        overflow: hidden;
        cursor: pointer;
        background: url(/uploads/image/gltsimages/arrow.png) no-repeat center center;
        background-size: 100%;
        animation: btn_sx 2s linear infinite;
        margin-bottom: 40px;
    }
}

@media screen and (min-aspect-ratio:16/9) {
    .column_kv .video_container video {
        width: 100%;
        height: 56.25vw;
        margin: calc(50vh - 28.125vw) 0;
    }
    .column_kv .video_container canvas {
        width: 100%;
        height: 56.25vw;
    }
}

.content {
    padding-top: 0;
}

.column_kv .kv_con {
    height: 100vh;
}

@media screen and (max-width: 1280px) {
    .column_kv .kv_con {
        height: 100vh;
    }
}

@keyframes btn_sx {
    0% {
        bottom: 0;
        opacity: 1;
    }
    50% {
        bottom: 16px;
        opacity: .3;
    }
    100% {
        bottom: 0;
        opacity: 1;
    }
}

.btn_more {
    display: inline-block;
    width: 10em;
    line-height: 200%;
    text-align: center;
    color: #fff;
    background: #d2a779;
    border-radius: .25em;
    border: 1px solid #d2a779
}

a:hover .btn_more, .btn_more:hover {
    background: #494949;
    color: #fff;
}

/*关于我们 左文字右背景 
<div class="column_about lefttxt_rightimg">
    <div class="indent_content">
        <div class="column_title">
            <h2>关于我们</h2>
            <h3>about us</h3>
        </div>
        <div class="column_content">
            <div class="img_container"><div class="bg_container"><img ></div></div>
            <div class="txt_container">
                <p>国家开发投资集团有限公司（简称“国投”）成立于1995年5月5日，是中央直接管理的国有重要骨干企业，是中央企业中唯一的投资控股公司，是首批国有资本投资公司改革试点单位。国投注册资本338亿元，截至2019年末，资产总额约6300亿元，员工约5万...</p>
                <a href="company.html" class="more">查看更多</a>
            </div>
        </div>
    </div>
</div>
*/

.lefttxt_rightimg .column_content {
    position: relative;
    padding: 0 47.5% 0 0;
}

.lefttxt_rightimg .column_content .img_container {
    position: absolute;
    width: 42.5%;
    right: 0;
    bottom: 0;
    top: 0;
    margin: 0;
}

.lefttxt_rightimg .column_content .bg_container {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
}

.lefttxt_rightimg .txt_container {
    padding: 0 0 2em;
    min-height: 252px;
}

.lefttxt_rightimg .txt_container p {
    text-align: justify;
}

.lefttxt_rightimg .txt_container .more {
    display: inline-block;
    border: 1px solid #ddd;
    color: #333;
    padding: 0 2em;
    margin-top: 1.875em;
    transition: color .5s linear, border .5s linear;
    line-height: 250%;
}

.lefttxt_rightimg .txt_container .more:hover {
    border-color: #d2a779;
    color: #d2a779;
}

@media screen and (max-width: 767px) {
    .lefttxt_rightimg .column_content {
        padding: 0;
    }
    .lefttxt_rightimg .column_content .img_container {
        display: none;
    }
}

/*关于我们 多个icon 标题在一行
<div class="iconsinoneline column_about">
    <div class="indent_content">
        <div class="column_title_class2">
            <h2>关于我们</h2>
        </div>
        <div class="column_content">
            <ul>
                <li>
                    <a href="organization.html" class="con">
                        <div class="icon_container"><img ></div>
                        <h3>组织架构</h3>
                    </a>
                </li>
                ...
            </ul>	
        </div>
    </div>
</div>*/

.iconsinoneline {
    position: relative;
}

.iconsinoneline {
    /* background: url(/uploads/image/gltsimages/bg1.jpg) center center no-repeat; */
}

.iconsinoneline .column_content>ul {
    margin: 0 auto;
    overflow: hidden;
    list-style-type: none;
    padding: 1px 0 0;
}

.iconsinoneline .column_content>ul>li {
    float: left;
    width: 25%;
    padding: 0 10px 2em;
    margin: 20px 0;
}

.iconsinoneline .con {
    background: #fff;
    display: block;
    border: 1px solid #ddd;
    border-radius: 3px;
    padding: 27% 0 15%;
    text-align: center;
    position: relative;
    margin: 0 10px 30px;
}

.iconsinoneline .con .icon_container img {
    width: 56px;
    filter: grayscale(100%);
}

.iconsinoneline .con h3 {
    line-height: 300%;
    color: #272727;
    font-size: 24px;
    padding: 4% 0 3%;
}

.iconsinoneline .con p {
    max-width: 82%;
    margin: 0 auto;
    color: #666;
    height: 78px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.iconsinoneline .con:after {
    content: '>';
    position: absolute;
    font-size: 1.5em;
    line-height: 2em;
    width: 2em;
    margin: 0 0 -1em -1em;
    left: 50%;
    bottom: 0;
    background: #d2a779;
    color: #fff;
    text-align: center;
    border-radius: 50%;
    opacity: 0;
}

.iconsinoneline .con:hover {
    border: 2px solid #d2a779;
    margin: 0 9px 28px;
}

.iconsinoneline .con:hover .icon_container img {
    filter: grayscale(0);
}

.iconsinoneline .con:hover:after {
    opacity: 1;
}

.iconsinoneline .con:hover h3 {
    color: #d2a779;
}
.swiper-pagination {
    text-align: center;
}
/* .swiper-pagination .swiper-pagination-switch{
    width: 8px;
    height: 8px;
    background-color: rgba(0, 0, 0, .5);
    display: inline-block;
    border-radius: 50%;
    margin: 0 5px;
}
.swiper-pagination .swiper-active-switch{
    background-color: #d2a779;
} */
.iconsinoneline .swiper-button-prev,
.iconsinoneline .swiper-button-next {
    left: 2%;
    top: 50%;
    width: 30px;
    height: 30px;
    outline: none;
    position: absolute;
    margin-top: -34px;
    color: #333;
    font-size: 30px;
    line-height: 30px;
    text-align: left;
    z-index: 5;
    cursor: pointer;
    transform: scaley(2);
    opacity: .5;
    display: none;
}
.iconsinoneline:hover .swiper-button-prev,
.iconsinoneline:hover .swiper-button-next {
    display: block;
}

.iconsinoneline .swiper-button-prev:hover, .iconsinoneline .swiper-button-next:hover {
    color: #d2a779;
    opacity: 1;
}

.iconsinoneline .swiper-button-prev:after {
    content: "<";
}

.iconsinoneline .swiper-button-next:after {
    content: ">";
}

.iconsinoneline .swiper-button-next {
    left: auto;
    right: 2%;
    text-align: right;
}

@media screen and (max-width: 1024px) {
    .iconsinoneline .con:after {
        font-size: 1.25em;
    }
}

@media screen and (max-width: 767px) {
    .iconsinoneline .column_content>ul>li {
        width: 50%;
    }
    .iconsinoneline .con:after {
        font-size: 1em;
    }
}

/*其他栏目 三栏目一行
<div class="threeinline column_products">
    <div class="indent_content">
        <div class="column_title_class2">
            <h2>产品中心</h2>
        </div>
        <div class="column_content">
            <ul>
                <li>1</li>
                <li>2</li>
                <li>3</li>
            </ul>
        </div>
    </div>
</div>*/

.threeinline {
    position: relative;
    padding: 0 0 4%;
}
.threeinline .column_title_class2{
    text-align:left;
}
.threeinline .column_title_class2 h2:after{
    left:0;
    background: #333333;
}
.threeinline .column_title_class2 .tab{
    text-align:right;
    margin: -36px 0 0;
}

.threeinline .column_content>ul {
    margin: 0 -10px;
    overflow: hidden;
    list-style-type: none;
}

.threeinline .column_content>ul:after {
    content: '';
    display: block;
    clear: both;
}

.threeinline .column_content>ul>li {
    float: left;
    width: 33.33%;
    padding: 0 10px;
}
.new-box{
    color:#666;
}
.new-box .n-left{
    position: relative;
    width: 44.35%;
    float:left;
}
.new-box .n-left .idea{
    position: absolute;
    bottom:0;
    right:0;
    padding:30px;
    width:59.4%;
    background: #ffffff;
    box-shadow: 0px 0px 32px 3px rgba(0, 0, 0, 0.09);
}
.new-box .n-left  p{
    opacity: 0.6;
}
.new-box .n-left .bg_container{
    padding:0 0 400px;
}
.new-box:nth-child(2) li{
    float: left;
    width:48%;
    display: inline-block;
}
.new-box:nth-child(2) li:nth-child(odd){
    margin-right: 4%;
    float: left;
}
.new-box .n-left .bg_container img{
    display:none;
}
.new-box h2{
    color:#333;
    font-size: 18px;
    margin: 0 0 10px;
    max-height: 2em;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.new-box a:hover h2{
    color:#d2a779;
}
.new-box .time{
    color:#d2a779;
    font-size: 14px;
    display:inline-block;
}
.new-box .n-right{
    width: 50%;
    float:right;
}
.new-box ul li{
    position:relative;
    border-left:6px solid #d2a779;
    background: #ffffff;
    box-shadow: 0px 0px 32px 3px rgba(0, 0, 0, 0.09);
    padding: 22px 130px 14px 40px;
    margin:0 0 20px;
}
.new-box ul .time{
    position: absolute;
    right: 30px;
    top: 25px;
    color: #b71254;
}
.new-box p{
    max-height: 3.4em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
@media screen and (max-width: 1280px) {
    .threeinline .column_title_class2 .tab{
        margin: 20px 0 0;
    }
    .column_title_class2 .tab li{
        margin:0 5px 0 0;
    }
    .column_title_class2 .tab li:last-child{
        margin:0;
    }
}

@media screen and (max-width: 840px) {
    .threeinline .column_content>ul {
        margin: 0 -6px;
    }
    .threeinline .column_content>ul>li {
        padding: 0 6px 2em;
        width: 100%;
    }
}
@media screen and (max-width: 767px) {
    .new-box .n-left,
    .new-box .n-right{
        width:100%;
    }
}

@media screen and (max-width: 640px) {
    .threeinline .column_content>ul>li {
        width: 100%;
        padding: 0 6px 2em;
    }
    .new-box:first-child li{
        width: 100%;
    }
    .new-box:first-child li:nth-child(odd){
        margin-right: 0;
    }
}

/*产品中心 子栏目
<div class="threeinline slidedoor column_products">
    <div class="column_content">
        <ul>
            <li>
                <a href="productinto.html" class="product_con">
                    <div class="img_container"><div class="bg_container"><img ></div></div>
                    <div class="txt_container">
                        <h3>应用范围</h3>
                        <p>铜层合金厚度要求0.2-1.0；钢基层：优轧碳钢或合金钢板</p>
                        <span class="btn_more">查看详情</span>
                    </div>
                </a>
            </li>
        </ul>
    </div>
</div>
*/

.column_products .product_con {
    display: block;
    position: relative;
    text-align: center;
}

.column_products .product_con .img_container {
    overflow: hidden;
    position: relative;
    background: #fff;
}

.column_products .product_con .bg_container {
    height: 0;
    overflow: hidden;
    padding: 0 0 80.1%;
    background-size: contain;
    transition: transform .5s linear;
}

/* .column_products .product_con:hover .bg_container {
    transform: scale(1.05);
} */
.column_products .img-box{
    position: relative;
}
.column_products .product_con .time{
    position: absolute;
    bottom: -20px;
    left: 50%;
    width: 150px;
    line-height: 40px;
    background: #ffffff;
    box-shadow: 0px 0px 32px 3px rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    transform: translatex(-50%);
}
.column_products .product_con .txt_container {
    padding: .5em;
}

.column_products .product_con .txt_container h3 {
    font-size: 20px;
    line-height: 120%;
    color: #333;
    margin: 60px auto 0;
    max-width: 340px;
}

.column_products .product_con .txt_container p {
    line-height: 150%;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    text-align: justify;
    height: 4.5em;
    color: #888;
    margin: 0 0 .5em;
}

.column_products .product_con:hover .txt_container h3 {
    color: #d2a779;
}

@media screen and (max-width: 640px) {
    .column_products .product_con .txt_container h3 {
        font-size: 16px;
        margin: 40px auto 0;
    }
}

/*新闻中心*/

.column_news {
    position: relative;
    padding: 0 0 4%;
}

.column_news .bg_container {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-position: right bottom;
    background-color: #385890;
}

.column_news .column_content {
    position: relative;
    padding: 1em;
    background: #fff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, .3);
    overflow: hidden;
}

.column_news .column_content ul {
    list-style: none;
    overflow: hidden;
}

.column_news .column_content li {
    padding: .25em 0;
    white-space: nowrap;
    float: left;
    width: 49%;
    margin: 0 2% 0 0;
}

.column_news .column_content li:nth-child(2n) {
    margin: 0 -2% 0 0;
}

.column_news .column_content li a {
    display: block;
    padding: 0 80px 0 12px;
    position: relative;
    line-height: 250%;
}

.column_news .column_content li h4 {
    overflow: hidden;
    width: 100%;
    text-overflow: ellipsis;
    color: #494949;
}

.column_news .column_content li a:hover h4 {
    color: #d2a779;
}

.column_news .column_content li .time {
    font-size: 12px;
    color: #aaa;
    line-height: 18px;
    position: absolute;
    right: 12px;
    top: 50%;
    margin-top: -9px;
}

@media screen and (max-width: 767px) {
    .column_news .column_content li {
        width: 100%;
        margin: 0 -2% 0 0;
    }
}

/*子新闻
<div class="subcolumn_news">
    <div class="subtil">
        <a href="partybuilding.html"><h3>党建动态</h3></a>
    </div>
    <div class="subcon">
        <ul>
            <li><a href="partybuildinginto.html"><h4>再捐3620万元、200吨酒精再捐3620万元、200吨酒精</h4><span class="time">2019-02-14</span></a></li>
            <li><a href="partybuildinginto.html"><h4>再捐3620万元、200吨酒精</h4><span class="time">2019-02-14</span></a></li>
            <li><a href="partybuildinginto.html"><h4>再捐3620万元、200吨酒精</h4><span class="time">2019-02-14</span></a></li>
        </ul>
    </div>
</div>
*/

.subcolumn_news .subtil {
    position: relative;
    font-size: 32px;
    line-height: 250%;
    padding: 0 0 0 36px;
}

.subcolumn_news .subtil a:before {
    content: '';
    position: absolute;
    left: 12px;
    width: 3px;
    height: .75em;
    top: 0.9375em;
    background: #d2a779;
}

.subcolumn_news .subtil h3 {
    color: #494949;
}

.subcolumn_news .subtil h3:before {
    content: '';
    position: absolute;
    left: 18px;
    width: 3px;
    height: .75em;
    top: 0.9375em;
    background: #d2a779;
}

.subcolumn_news .subtil:after {
    content: '';
    position: absolute;
    left: 24px;
    width: 3px;
    height: .75em;
    top: 0.9375em;
    background: #d2a779;
}

.subcolumn_news .subtil h3:after {
    content: '>';
    position: absolute;
    right: 12px;
    top: 0em;
    color: #d2a779;
}

.subcolumn_news .subtil a:hover h3:after {
    color: #494949;
}

.subcolumn_news .subcon ul {
    list-style-type: none;
}

.subcolumn_news .subcon li {
    padding: .25em 0;
    white-space: nowrap;
}

.subcolumn_news .subcon li a {
    display: block;
    background: #f7f7f7;
    padding: 0 80px 0 12px;
    position: relative;
    line-height: 250%;
}

.subcolumn_news .subcon li h4 {
    overflow: hidden;
    width: 100%;
    text-overflow: ellipsis;
    color: #494949;
}

.subcolumn_news .subcon li h4:before {
    content: '▶';
    color: #d2a779;
    transform: scale(.5);
    display: inline-block;
    transform-origin: left center;
}

.subcolumn_news .subcon li a:hover h4 {
    color: #d2a779;
}

.subcolumn_news .subcon li .time {
    font-size: 12px;
    color: #aaa;
    line-height: 18px;
    position: absolute;
    right: 12px;
    top: 50%;
    margin-top: -9px;
}

@media screen and (max-width: 1440px) {
    .subcolumn_news .subtil {
        font-size: 28px;
    }
}

@media screen and (max-width: 1024px) {
    .subcolumn_news .subtil {
        font-size: 24px;
    }
}

/*企业党建*/

.column_partys {
    position: relative;
    padding: 0 0 4%;
}

/* 子新闻 日期 图片 分类标题导语更多 在一行 
<ul class="subnews_class2">
    <li>
        <a href="partynewsinto.html">
            <span class="time"><span class="d">05</span><span class="m">08</span><span class="y">2020</span></span>
            <div class="img_container"><div class="bg_container"><img ></div></div>
            <div class="txt_container">
                <span class="type">党建动态</span>
                <h3>亚行与中国水环境集团共同助力全球生态安全</h3>
                <p>签约仪式上，亚行负责私营部门和公共—私营部门合作（ppp）的副行长迪瓦卡·古普塔（diwakar gupta）表示，水务行业是亚行在中国的重要业务领域之一，中国水环境集团完善的商业模式与专业高效的技术运营实力给亚行留下了深刻印将持续向更多地区推广签约仪式上，亚行负责私营部门和公共—私营部门合作...</p>
                <span class="btn_more">查看详情</span>
            </div>
        </a>
    </li>
</ul>*/

.subnews_class2 {
    border-top: 1px solid #ddd;
}

.subnews_class2 li {
    border-bottom: 1px solid #ddd;
    padding: 1em 0;
    position: relative;
}

.subnews_class2 li a {
    display: block;
}

.subnews_class2 .time {
    margin: 0 32px;
    width: 64px;
    color: #fff;
    background: #d2a779;
    border-radius: 4px;
    text-align: center;
    display: inline-block;
    vertical-align: top;
}

.subnews_class2 .time .d {
    font-size: 1.5em;
    line-height: 200%;
    display: block;
}

.subnews_class2 .time .m {
    font-size: 1em;
    line-height: 200%;
    display: block;
    border-top: 1px solid rgba(255, 255, 255, .2);
}

.subnews_class2 .time .y {
    display: none;
}

.subnews_class2 .img_container {
    overflow: hidden;
    position: relative;
    background: #ddd;
    display: inline-block;
    border-radius: 4px;
    vertical-align: middle;
    margin: 0 32px 0 0;
    width: 300px;
}

.subnews_class2 .bg_container {
    height: 0;
    overflow: hidden;
    padding: 0 0 75%;
    background-size: contain;
    transition: transform .5s linear;
}

.subnews_class2 a:hover .bg_container {
    transform: scale(1.05);
}

.subnews_class2 .txt_container {
    overflow: hidden;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 492px);
}

.subnews_class2 .txt_container .type {
    font-size: 12px;
    color: #d2a779;
}

.subnews_class2 .txt_container h3 {
    font-size: 20px;
    color: #333;
    line-height: 150%;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-align: justify;
    margin: 0 0 .25em;
}

.subnews_class2 .txt_container p {
    margin: 0 0 .5em;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    text-align: justify;
    color: #888
}

.subnews_class2 a:hover .txt_container h3 {
    color: #d2a779;
}

@media screen and (max-width: 1024px) {
    .subnews_class2 .time {
        margin: 0 16px 0 0;
    }
    .subnews_class2 .img_container {
        margin: 0 16px 0 0;
    }
    .subnews_class2 .txt_container {
        width: calc(100% - 412px);
    }
}

@media screen and (max-width:767px) {
    .subnews_class2 .time {
        margin: 0;
        position: absolute;
        right: 0;
        top: 1em
    }
    .subnews_class2 .img_container {
        margin: 0;
        width: calc(100% - 72px);
    }
    .subnews_class2 .txt_container {
        width: 100%;
        padding: 1em 0 0;
    }
}

/* 带背景双栏目，左栏目白底 右栏目带背景
<div class="column_joinus bgtwocol ">
    <div class="bg_container"><img ></div>
    <div class="indent_content">
        <div class="column_title_class2">
            <h2>加入我们</h2>
        </div>
        <div class="column_content">
            <div class="firstcol">
                <div class="info_content">
                    <h3>人才理念</h3>
                    <p>公司始终坚持“以人为本”的用人理念，为广大员工提供人才发挥的最大潜能机会和平台。在公平、公正、公开的原则下，建立科学地、有效的绩效管理机制，为波林人提供广阔的职业发展空间。</p>
                </div>
                <div class="btn_content">
                    <a href="talentconcept.html" class="btn_more">查看详情</a>
                </div>
            </div>
            <div class="secondcol">
                <div class="bg_container"><img ></div>
                <div class="info_content">
                    <h3>招聘信息</h3>
                    <p>岗位一：产品研发工程师（2人）</p>
                </div>
                <div class="btn_content">
                    <a href="joinus.html" class="more">查看更多 ></a>
                </div>
            </div>
        </div>
    </div>
</div>
*/

.bgtwocol {
    position: relative;
    padding: 0 0 4%;
}

.bgtwocol .bg_container {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-position: right bottom;
    background-color: #385890;
}

.bgtwocol .column_content {
    position: relative;
    padding: 0 27em 0 0;
    background: #fff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, .3);
    overflow: hidden;
}

.bgtwocol .firstcol {
    position: relative;
    padding: 1em 4em 6em;
}

.bgtwocol .secondcol {
    position: absolute;
    right: 0;
    top: 0;
    width: 27em;
    bottom: 0;
    padding: 1em 4em 6em;
}

.bgtwocol .info_content {
    position: relative;
    min-height: 12em;
}

.bgtwocol .info_content h3 {
    font-size: 32px;
    line-height: 300%;
    color: #494949;
}

.bgtwocol .info_content p {
    line-height: 150%;
    text-align: justify;
}

.bgtwocol .btn_content {
    position: absolute;
    height: 4em;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0 4em;
    border-top: 1px solid #fff;
}

.bgtwocol .secondcol .info_content, .bgtwocol .secondcol .info_content h3 {
    color: #fff;
}

.bgtwocol .secondcol .btn_content:before {
    content: '';
    float: left;
    width: 2em;
    height: 4em;
    background: url(/uploads/image/gltsimages/indexjoinus_bg3.png) no-repeat left center;
    background-size: 100%;
}

.bgtwocol .secondcol .btn_content {
    text-align: right;
    line-height: 400%;
}

.bgtwocol .secondcol .btn_content .more {
    color: #fff;
}

@media screen and (max-width: 1024px) {
    .bgtwocol .column_content {
        padding: 0 19em 0 0;
    }
    .bgtwocol .firstcol {
        padding: 0em 2em 5em;
    }
    .bgtwocol .secondcol {
        width: 19em;
        padding: 0em 2em 5em;
    }
    .bgtwocol .info_content {
        min-height: 10.5em;
    }
    .bgtwocol .info_content h3 {
        font-size: 24px;
    }
    .bgtwocol .btn_content {
        padding: 0 2em;
    }
}

@media screen and (max-width: 767px) {
    .bgtwocol .column_content {
        padding: 0;
    }
    .bgtwocol .firstcol {
        padding: 0em 1em 5em;
    }
    .bgtwocol .secondcol {
        width: 100%;
        position: relative;
        padding: 0em 1em 5em;
    }
    .bgtwocol .secondcol .bg_container {
        background-size: auto 100%;
    }
    .bgtwocol .btn_content {
        padding: 0 1em;
    }
}

/*宣传片
<div class="column_video">
    <div class="column_content">
        <div class="video_container" data-mp4="static/images/video.mp4">
            <div class="bg_container"><img ></div>
        </div>
    </div>
</div>*/

.column_video {
    padding: 0;
}

.column_video .video_container {
    height: 0;
    overflow: hidden;
    padding: 0 0 36%;
    position: relative;
}

.column_video .video_container .bg_container {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
}

.column_video .video_container .bg_container:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: rgba(0, 0, 0, .2);
}

.column_video .video_container .vodeo_slogan {
    position: absolute;
    left: 50%;
    top: 50%;
    white-space: nowrap;
    display: inline-block;
    color: #fff;
    transform: translate(-50%, -50%);
    font-size: 20px;
    line-height: 300%;
    cursor: pointer;
}

.column_video .video_container .vodeo_slogan:before {
    content: '';
    display: block;
    margin: 0 auto;
    background: url(/uploads/image/gltsimages/indexvideo_icon.png) no-repeat center center;
    background-size: 100%;
    width: 3.2em;
    height: 0;
    padding: 0 0 3.2em;
    overflow: hidden;
}

@media screen and (max-width: 767px) {
    .column_video .video_container {
        padding: 0 0 48%;
    }
    .column_video .video_container .vodeo_slogan:before {
        width: 2.4em;
        padding: 0 0 2.4em;
    }
}

@media screen and (max-width: 408px) {
    .column_video .video_container {
        padding: 0 0 56.25%;
    }
    .column_video .video_container .vodeo_slogan:before {
        width: 1.5em;
        padding: 0 0 1.5em;
    }
}

.index-info {
    background: url(/uploads/image/gltsimages/banner_bussiness.jpg) center center no-repeat;
    background-size: cover;
    padding: 0 0 6%;
}

.index-info .index-introduction {
    position: relative;
    margin: -1.4% 0 0;
    background: rgba(255, 255, 255, 0.6);
    border-radius: 5px;
    min-height: 332px;
}

.index-info .left {
    width: 79.42%;
    padding: 5% 6%;
    font-size: 14px;
    line-height: 1.875;
    display: flex;
    justify-content: center;
    flex-direction: column;
    min-height: 332px;
}

.index-info .left p {
    padding: 0 0 20px;
}

.index-info .right {
    background: #d2a779;
    position: absolute;
    right: 0;
    top: 0;
    width: 20.58%;
    height: 100%;
    color: #fff;
    font-size: 16px;
    text-align: center;
    display: flex;
    justify-content: center;
    flex-direction: column;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.index-info .right dl {
    padding: 12% 0;
    width: 100%;
}

.index-info .right dl:first-child {
    border-bottom: 1px solid #fff;
}

.index-info .right dt {
    font-size: 56px;
    line-height: 1;
    font-weight: bold;
    padding: 0 0 10px;
}

@media screen and (max-width: 1024px) {
    .index-info .right dt {
        font-size: 40px;
    }
}

@media screen and (max-width: 768px) {
    .index-info .left {
        width: 100%;
    }
    .index-info .right {
        width: 100%;
        position: relative;
    }
    .index-info .right dl {
        padding: 40px 0;
    }
}

.index-culture {
    padding: 0 0 4%;
}

.index-party-list {
    vertical-align: top;
    text-align: justify;
    text-align-last: justify;
    max-width: 1174px;
    margin: 0 auto;
}

.index-party-list .card-item {
    vertical-align: top;
    width: 31.5%;
    display: inline-block;
    border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}

.index-party-list .card-item .card-meta {
    padding: 1.5em 1.8em;
    text-align: left;
    text-align-last: left;
    border: 1px solid rgba(229, 229, 229, 1);
}

.index-party-list .card-item .card-meta .title {
    font-size: 20px;
    font-weight: 500;
    color: #333;
    line-height: 1.875;
    margin-bottom: 10px;
}

.index-party-list .card-item .card-meta p {
    color: #666;
    line-height: 1.875;
    font-size: 14px;
}
.index-party-list .card-item .card-meta .time{
    font-size:12px;
}

.index-party-list .card-item .card-meta a.more {
    font-size: 12px;
    height: 34px;
    line-height: 34px;
    border-radius: 5px;
    background: #d2a779;
    color: #ffffff;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    display: inline-block;
    width: 130px;
    text-align: center;
    text-align-last: center;
    margin-top: 5%;
}

.index-party-list .bg_container{
    padding: 0 0 66.5%;
}
.index-party-list img {
    max-width: 100%;
    display: none;
}
.more-box{
    width: 180px;
    line-height: 40px;
    background: #969696;
    border-radius: 5px;
    display: block;
    margin: 4% auto 2%;
    color: #fff;
    text-align: center;
}
.threeinline .more-box{
    float: left;
    width: 100%;
    margin: 0;
    background: none;
}
.more-box span {
    width: 180px;
    line-height: 40px;
    background: #969696;
    border-radius: 5px;
    display: block;
    margin: 4% auto 2%;
    color: #fff;
    text-align: center;
}
.more-box:hover span{
    color: #fff;
    background: #d2a779;
}


@media screen and (max-width:1366px) {
    .index-party-list .card-item {
        width: 30%;
    }
}

@media screen and (max-width:767px) {
    .index-party-list .card-item {
        width: 100%;
        margin-bottom: 2em;
    }
    
    .more-box{
        margin: 10px auto 40px;
    }
}

.index-block.gray-block {
    background: rgba(38, 38, 38, .7);
    padding: 4.3% 0;
}

.index-form-wrap {
    display: block;
    text-align: center;
}

.gray-block .column_title_class2 {
    padding: 0;
}

.gray-block .column_title_class2 h2 {
    color: #fff;
}

.index-form-wrap input {
    width: 500px;
    height: 60px;
    line-height: 60px;
    background: rgba(255, 255, 255, 1);
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border: none;
    padding: 0 2%;
    vertical-align: top;
}

.index-form-wrap .submit {
    margin-left: 15px;
    width: 140px;
    height: 60px;
    border: none;
    background: #d2a779;
    border-radius: 5px;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    color: rgba(255, 255, 255, 1);
    line-height: 30px;
    vertical-align: top;
}

@media screen and (max-width:767px) {
    .index-block.gray-block {
        padding: 10% 0;
    }
    .index-form-wrap input {
        width: 200px;
        height: 40px;
        line-height: 40px;
        padding: 0 4%;
    }
    .index-form-wrap .submit {
        width: 80px;
        height: 40px;
        line-height: 40px;
    }
}

.moving{
    text-align:center;
    padding:0 0 65px;
    border-bottom:1px solid rgba(0, 0, 0, .1);
    max-width:1400px;
    margin:0 auto 100px;
}
.moving a{
    display:inline-block;
    font-size:20px;
    color:#d2a779;
    margin:0 5.7%;
}
.moving img,
.moving span{
    vertical-align: middle;
    margin: 0 7px;
}

@media screen and (max-width:767px) {
    .moving{
        padding:0 0 35px;
        margin: 0 0 50px;
    }
}