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

.container {background: #FFF;}

/*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(../images/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: #972524; /*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; display: none;}
.column_kv .swiper-pagination-bullet,.column_kv .swiper-pagination-switch{ display: inline-block; width: 12px; height: 12px; margin: 4px 8px !important; border-radius: 50%; background-color: #FFF; opacity: 1;outline: none;transform: scale(.75); opacity: .7; border:1px solid #FFF}
.column_kv .swiper-pagination-bullet-active,.column_kv .swiper-active-switch{background-color: #972524;transform: scale(1);opacity: 1;}
.column_kv .swiper-button-prev,.column_kv .swiper-button-next{ left:3%; top:50%; width: 30px; height:30px; outline: none; position: absolute; margin-top: -15px; color: #FFF; font-size: 30px; line-height: 30px; text-align: left; z-index: 5; cursor: pointer; font-family: Arial, Helvetica, sans-serif; opacity: .5;}
.column_kv .swiper-button-prev:hover,.column_kv .swiper-button-next:hover{color:#972524;}
.column_kv .swiper-button-prev:after{content: "<"; display: inline-block; transform: scale(1,2);}
.column_kv .swiper-button-next:after{content: ">"; display: inline-block; transform: scale(1,2);}
.column_kv .swiper-button-next{left: auto; right:3%;text-align: right;}
.column_kv .swiper-slide{width: 100%;}
@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(../images/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;
  }
}

/*关于我们 左文字右背景 背景会被剪裁 
<div class="column_about">
    <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 src="static/images/indexabout.jpg"></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>
*/
.column_about .column_content{position: relative; padding:0 47.5% 0 0;}
.column_about .column_content .img_container{ position: absolute; width: 42.5%; right: 0; bottom:0;top:0;margin: 0;}
.column_about .column_content .bg_container{position: absolute; left:0; right: 0; bottom:0;top:0; }
.column_about .txt_container{padding: 0 0 2em;min-height: 252px;}
.column_about .txt_container p{text-align: justify;}
.column_about .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%;}
.column_about .txt_container .more:hover{ border-color: #972524;color:#972524;}
@media screen and (max-width: 767px){
    .column_about .column_content{padding: 0;}
    .column_about .column_content .img_container{display:none;} 
}

/*关于我们2 左文字右图片 
<div class="indent_content">
    <div class="column_about_class2">
        <div class="column_content">
            <div class="img_container"><div class="bg_container"><img src="static/images/indexabout.png"></div></div>
            <div class="txt_container">
                <div class="column_title">
                    <h2>公司简介</h2>
                    <h3>COMPANY PROFILE</h3>
                </div>
                <p>　　国投钦州发电有限公司成立于2004年1月8日，是由国投电力控股股份有限公司、广西投资集团有限公司两方按61：39股权比例投资组成的有限责任公司，主要负责钦州电厂的建设与经营。公司通过吹沙填海新生造地面积1350亩，创造了“精卫填海”、“愚公移山”的现代神话。</p>
                <p>　　乘风破浪会有时，直挂云帆济沧海。公司将在国投集团、国投电力的坚强领导下，坚定信心，把握机遇，迎接挑战，攻坚克难，在战略定位上有新提升，在改革创新上有新突破，在经营发展上有新成就，在党的建设上有新高度，确保全面完成全年各项目标任务，为国投集团建设具有全球竞争力的世界一流资本投资公司，为庆祝中华人民共和国成立70周年，书写成色更纯、底色更亮、根基更牢的发展新答卷。</p>
                <a href="CompanyProfile.html" class="btn_more">查看更多</a>
            </div>
        </div>
    </div>
</div>*/
.column_about_class2{ padding: 7.25% 0;}
.column_about_class2 .column_content{position: relative; padding:0 40% 0 0;}
.column_about_class2 .column_content .img_container{ position: absolute; width: 36%; right: 0; bottom:0;top:0;margin: 0;}
.column_about_class2 .column_content .bg_container{position: absolute; left:0; right: 0; bottom:0;top:0;background-size: contain; }
.column_about_class2 .txt_container p{text-align: justify; margin-bottom:1em;line-height: 1.75em;}
.column_about_class2 .txt_container .btn_more{display: inline-block; color: #FFF; padding: 0 2em;  transition:opacity .5s linear;line-height: 200%; border-radius: 1em; background: #972524; opacity: .5;}
.column_about_class2 .txt_container .btn_more:hover{opacity: 1;}
@media screen and (max-width: 767px){
    .column_about_class2 .column_content{padding: 0;}
    .column_about_class2 .column_content .img_container{display:none;} 
}

/*关于我们3 带全通背景色左文字右图片居底 
<div class="column_about_class3">
    <div class="indent_content">
        <div class="column_content">
            <div class="img_container">
                <div class="bg_container"><img src="static/images/indexhuman.png"></div>
            </div>
            <div class="txt_container">
                <div class="column_title">
                    <h2>人才理念</h2>
                    <h3>Talent Concept</h3>
                </div>
                <p>国投坚持以人为本的发展理念，维护员工基本权益；<br> 建立科学的培训机制和职业晋升机制</p>
                <a href="RecruitmentInformation.html" class="btn_more">查看更多 &gt;</a>
            </div>
        </div>
    </div>
</div>*/
.column_about_class3 .column_content{position: relative; padding:3em 40% 3em 0;}
.column_about_class3 .column_content:before{content: ''; position: absolute; width: 100vw; left: 50%; top:0; bottom: 0; min-width: 320px; transform: translate(-50% , 0); background: #dfe3e9;}
.column_about_class3 .column_content .img_container{ position: absolute; width: 50%; right: 0; bottom:0;top:0;margin: 0;}
.column_about_class3 .column_content .bg_container{position: absolute;left:0;right: 0;bottom:0;top:0;background-size:contain; background-position: center bottom; }
.column_about_class3 .txt_container{position: relative;}
.column_about_class3 .txt_container p{text-align: justify; margin-bottom:1em; line-height: 1.75em;}
.column_about_class3 .txt_container p span{display: inline-block;}
.column_about_class3 .txt_container .btn_more{display: inline-block; color: #333; }
.column_about_class3 .txt_container .btn_more:hover{ color: #972524;}
@media screen and (max-width: 767px){
    .column_about_class3 .column_content{padding:3em 0 56.25%;}
    .column_about_class3 .column_content .img_container{width: 100%; top:auto; height: 0; padding: 0 0 56.25%; overflow: hidden;}
    .column_about_class3 .txt_container p{font-size: .875em; }
}

.column_about_class4{ padding: 0 0 4%; position: relative;}
.column_about_class4 .bg_container{position: absolute; left: 0; top:0; right: 0; bottom: 0;}
.column_about_class4 .column_content{position: relative; overflow: hidden; background: rgba(255,255,255,.6);}
.column_about_class4 .txt_container{float: left; width: calc(100% - 10em); padding: 2em;text-align: justify;}
.column_about_class4 .gdnuminfo{width: 10em; text-align: center; float: right; background: #972524;}
.column_about_class4 .gdnuminfo li{border-top:1px solid #FFF; padding: 1.5em 0; color: #FFF; font-size: .75em; line-height: 2;}
.column_about_class4 .gdnuminfo li:first-child{border:none;}
.column_about_class4 .gdnuminfo li dd span{display: inline-block; font-size: 2em;}
.column_about_class4 .more{margin-left: 0 !important;}
@media screen and (max-width: 767px){
    .column_about_class4 .txt_container{width: 100%; float: none;}
    .column_about_class4 .gdnuminfo{ width: 100%; float: none; overflow: hidden; display: table;}
    .column_about_class4 .gdnuminfo li{border: none;  border-left: 1px solid #FFF; display: table-cell; width: 50%;}
}

/*关于我们5
<div class="column_about_class5">
    <div class="column_title">
        <h2>国投海伦能源</h2>
        <h3>SDIC BIOENERGY HAILUN</h3>
    </div>
    <div class="column_content indent_content">
        <div class="txt_con">
            <p>国投生物能源(海伦)有限公司于2018年02月10日成立。公司经营范围包括：玉米加工、销售；饲料（含DDGS）、饲料添加剂生产、销售；玉米油加工、销售；粮食收购、销售、加工、烘干、储存、搬运；进出口贸易经营等</p>
        </div>
        <ul class="sub_con">
            <li><a href="CompanyProfile.html">
                    <span class="icon_container"><img src="static/images/about_icon1.png"></span>
                    <h3>公司介绍</h3>
                    <p>Company Profile</p>
                </a></li>
            <li><a href="organization.html">
                    <span class="icon_container"><img src="static/images/about_icon2.png"></span>
                    <h3>组织架构</h3>
                    <p>Organizational Structure</p>
                </a></li>
            <li><a href="developmenthistory.html">
                    <span class="icon_container"><img src="static/images/about_icon3.png"></span>
                    <h3>发展历程</h3>
                    <p>Development History</p>
                </a></li>
        </ul>
    </div>
</div>
*/ 
.column_about_class5{position: relative; padding: 0 0 5%;}
.column_about_class5 .txt_con{ width: 70%; margin: 0 auto 2em; text-align: center;}
.column_about_class5 .txt_con h2{font-weight: bold; font-size: 1.755em; line-height: 1.5em; color: #333;}
.column_about_class5 .txt_con h3{font-weight:lighter; font-size:1.167em; line-height: 1.5em; margin-bottom: 2em;}
.column_about_class5 .sub_con{list-style-type: none; overflow: hidden;}
.column_about_class5 .sub_con li{float: left; padding: 2em 0 0; margin: 0 0 2em 12.5%; width: 25%; text-align: center;}
.column_about_class5 .sub_con li:first-child{margin-left: 0;}
.column_about_class5 .sub_con li a{display: block; border-radius: .5em; border:1px solid #DDD; position: relative;}
.column_about_class5 .sub_con li .icon_container{ display:block;width: 6em; height: 4em;margin: -2em auto 0; background: #FFF;}
.column_about_class5 .sub_con li .icon_container img{height: 100%;}
.column_about_class5 .sub_con li h3{ color: #333; margin: 1em auto 2em; font-weight: bold;overflow: hidden; max-width: 80%; white-space: nowrap; text-overflow: ellipsis;}
.column_about_class5 .sub_con li a:hover h3{color: #972524;}
.column_about_class5 .sub_con li p{position: absolute; padding: 0 1em; overflow: hidden; bottom: 0; left: 50%;  background: #FFF; transform: translate(-50% ,50%); white-space: nowrap;}
@media screen and (max-width: 1366px){
    .column_about_class5 .sub_con li{margin: 0 0 2em 5%; width: 30%;}
    .column_about_class5 .sub_con li:first-child{margin-left: 0;}
}
@media screen and (max-width: 1024px){
    .column_about_class5 .txt_con{ width: 90%;}
    .column_about_class5 .sub_con li p{padding: 0 .5em;}
}
@media screen and (max-width: 767px){
    .column_about_class5 .txt_con{ width: 100%; text-align: left;}
    .column_about_class5 .sub_con li{ float: none; margin: 0 auto 2em !important; width: 96%;}
}
/*关于我们6
<div class="column_about_class6">
    <div class="bg_container"><img src="static/images/indexparty.jpg"></div>
    <div class="column_content indent_content">
        <div class="txt_con">
            <div class="column_title">
                <h2>主题党日</h2>
                <h3>Party Building</h3>
            </div>
            <p>国投生物能源(海伦)有限公司于2018年02月10日成立。公司经营范围包括：玉米加工、销售；饲料（含DDGS）、饲料添加剂生产、销售；玉米油加工、销售；粮食收购、销售、加工、烘干、储存、搬运；进出口贸易经营等</p>
            <a href="PartyBuilding.html" class="btn_more">了解更多</a>
        </div>
        
    </div>
</div>*/ 
.column_about_class6{ position: relative; background: url(../images/indexparty_bg.jpg) no-repeat left bottom; background-size: auto 100%; text-align: center;}
.column_about_class6 .bg_container{ position: absolute; left: 50%; top:0; right: 0; bottom:0;}
.column_about_class6:before{display: inline-block; width: 1px; height: 0; padding: 0 0 31.25%; vertical-align: middle; margin: 0 -.33em 0 -1px; content: "";}
.column_about_class6 .column_content{display: inline-block;vertical-align: middle;}
.column_about_class6 .txt_con{width: 45%; text-align: right; padding: 2em 0;}
.column_about_class6 .txt_con .column_title{text-align: right;}
.column_about_class6 .txt_con .btn_more{display: block; margin: 1.5em 0 0 auto; text-align: center; border-radius: .25em; line-height: 2; border:1px solid #972524; color: #972524; font-size: .75em; width: 9em;}
.column_about_class6 .txt_con p{line-height: 1.5; font-size: .875em;}
.column_about_class6 .txt_con .btn_more:hover{background: #972524; color: #FFF;}
@media screen and (max-width: 767px){
    .column_about_class6{background-size: 100%;}
    .column_about_class6 .bg_container{position: relative; height: 0; padding-bottom: 62.5%; left: 0;}
    .column_about_class6:before{display: none;}
    .column_about_class6 .column_content{display: block;}
    .column_about_class6 .txt_con{width: auto; text-align: left;}
    .column_about_class6 .txt_con .column_title{text-align: center;}
}

/*宣传片
<div class="column_video">
    <div class="column_content">
        <div class="video_container" data-mp4="static/images/video.mp4">
            <div class="bg_container"><img src="static/images/indexvideo.jpg"></div>
        </div>
    </div>
</div>*/
.column_video .column_content{width: 75%; min-width: 1326px; margin: 0 auto;}
.column_video .video_container{position: relative; margin: 0 -16.67%;}
.column_video .video_container .bg_container{position: relative;}
.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:after{content: '';position: absolute;left:50%;top:50%; background:url(../images/indexvideo_icon.png) no-repeat center center; background-size: 100%; width: 12.6%; height: 0; padding: 0 0 12.6%; margin: -6.3% 0 0 -6.3%;cursor: pointer;}
@media screen and (max-width: 1366px){
    .column_video .column_content{width: 100%; min-width: 0;}
}
@media screen and (max-width: 767px){
    .column_video .video_container{margin: 0 -25%;}
    .column_video .video_container:after{width: 18%;padding: 0 0 18%; margin: -9% 0 0 -9%;}
}

.column_videoclass2{ position: relative; height: 0; padding: 0 0 36%; overflow: hidden;}
.column_videoclass2 .video_con{position: absolute; top:0; top:0; right: 0; bottom:0}
@media screen and (max-width: 767px){
    .column_videoclass2{padding: 0 0 56.25%;}
}

/*子新闻
<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: #972524;}
.subcolumn_news .subtil h3{color:#494949;}
.subcolumn_news .subtil h3:before{content:'';position: absolute;left: 18px; width: 3px; height: .75em; top:0.9375em; background: #972524;}
.subcolumn_news .subtil:after{content:'';position: absolute;left: 24px; width: 3px; height: .75em; top:0.9375em; background: #972524;}
.subcolumn_news .subtil h3:after{content:'>';position: absolute;right:12px;  top:0em;color:#972524;}
.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:#972524;transform: scale(.5); display: inline-block; transform-origin: left center;}
.subcolumn_news .subcon li a:hover h4{color:#972524;}
.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;}
}
/*子新闻2
<div class="subcolumn_news_class2">
    <div class="subtil">
        <h3>公司新闻</h3><a href="News.html" class=btn_more>MORE &gt;&gt;</a>
    </div>
    <ul>
        <li>
            <a href="NewsInto.html">
                <span class="time"><span class="d">09</span><span class="m">01</span><span class="y">2020</span></span>
                <h4>全力打造文化出海国家平台，未来电视海外版客户端惊艳亮相CES 2020</h4>
                <p>1月7日至10日，国际消费电子展（CES 2020）在美国拉斯维加斯隆重举行。作为全球...</p>
            </a>
        </li>
    </ul>
</div>
*/ 
.subcolumn_news_class2 .subtil{position: relative; overflow: hidden;}
.subcolumn_news_class2 .subtil h3{color:#333; font-size: 1.25em; line-height: 200%; float: left;}
.subcolumn_news_class2 .subtil .btn_more{float: right; line-height: 3.333em;font-size: .75em; color: #888;}
.subcolumn_news_class2 .subtil .btn_more:hover{color: #972524;}
.subcolumn_news_class2 ul{list-style-type: none; overflow: hidden;}
.subcolumn_news_class2 li{position: relative;padding:0.5em 0 0.5em 4.5em; display: block; white-space: nowrap;}
.subcolumn_news_class2 ul a{ display:inline-block;width: 100%;vertical-align: middle; }
.subcolumn_news_class2 ul li:after{content: ""; width: 1px; height: 3.75em; display: inline-block; vertical-align: middle; margin: 0 -.33em 0 -1px;}
.subcolumn_news_class2 ul .time{position: absolute; left: 0; top:0.5em;width:4em; text-align: center; color: #969696;direction:rtl;line-height:100%; }
.subcolumn_news_class2 ul .time span{direction:ltr; display: inline-block; line-height: 200%; font-size: .875em;}
.subcolumn_news_class2 ul .time .d{font-size: 2em;line-height:100%; display: block;}
.subcolumn_news_class2 ul .time .y:after{content: "-";}
.subcolumn_news_class2 ul h4{ line-height:1.5em; color:#333;overflow: hidden; position: relative; top:-3px; margin-bottom: -3px; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:2; height: 3em;  white-space: normal;}
.subcolumn_news_class2 ul p{font-size:.75em; line-height:1.5em;color:#888;margin-bottom: 3px; overflow: hidden;text-overflow: ellipsis; white-space: nowrap;}
.subcolumn_news_class2 ul a:hover h4{ color:#972524;}


/*子栏目 焦点图新闻 固定高度
<div class="subcolumn_hotnews swiper-container">
    <div class="swiper-wrapper">
        <div class="swiper-slide">
            <a href="NewsInto.html">
                <div class="img_container">
                    <div class="bg_container"><img src="static/images/indexnews.jpg"></div>
                </div>
                <div class="txt_container">
                    <h4>再捐3620万元、200吨酒精！</h4>
                    <span class="time">2020-01-12</span>
                </div>
            </a>
        </div>
    </div>
    <div class="swiper-pagination"></div>
</div>
<script>
if ($(".subcolumn_hotnews").length > 0) {
    var hotnews = new Swiper('.subcolumn_hotnews', {
        pagination: '.subcolumn_hotnews .swiper-pagination',
        paginationClickable: true,
        resizeReInit: true,
        loop: true,
        autoplay: 4000,//可选选项，自动滑动
        autoplayDisableOnInteraction: false,
    });
}
</script>
*/
.subcolumn_hotnews .swiper-slide{position: relative;width: 100%;}
.subcolumn_hotnews .img_container{height:0;padding: 0 0 56.25%;position: relative; width: 100%;overflow: hidden;}
.subcolumn_hotnews .bg_container{ position: absolute; left: 0; top:0;right:0;bottom:0;transition:transform .5s linear;}
.subcolumn_hotnews .txt_container{position: absolute; left: 0; bottom: 0; width: 100%; padding: 0 6em 0 1em; height: 3em; }
.subcolumn_hotnews .txt_container:before{content:'';opacity: .5; position: absolute; left: 0; right: 0; top:0;bottom:0; background: #000; transition: background .5s linear;}
.subcolumn_hotnews .txt_container h4{position: relative; width: 100%; line-height:300%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: #FFF;}
.subcolumn_hotnews .txt_container .time{position: absolute; white-space: nowrap; font-size: 12px; right: 1em; line-height: 400%; bottom:0; color: #FFF;}
.subcolumn_hotnews a:hover .bg_container{transform:scale(1.05);}
.subcolumn_hotnews a:hover .txt_container:before{background: #972524;}
.subcolumn_hotnews .swiper-container-horizontal>.swiper-pagination-bullets,.subcolumn_hotnews .swiper-pagination{text-align: center; line-height: 200%;position: relative; clear: both;}
.subcolumn_hotnews .swiper-pagination-bullet,.subcolumn_hotnews .swiper-pagination-switch{ display: inline-block; width: .75em; height: .75em; margin: 0 .25em !important; border-radius: 50%; background-color: #DDD; opacity: 1;outline: none;border:1px solid #FFF;}
.subcolumn_hotnews .swiper-pagination-bullet-active,.subcolumn_hotnews .swiper-active-switch{background-color: #972524;}
@media screen and (max-width: 960px){
    .subcolumn_hotnews .txt_container {position: relative; height: 3.5em; padding: .25em 1em 0;opacity: 1;}
    .subcolumn_hotnews .txt_container:before{opacity: 1;}
    .subcolumn_hotnews a:hover .txt_container:before{background: #000;}
    .subcolumn_hotnews .txt_container h4{line-height: 150%;}
    .subcolumn_hotnews .txt_container .time{left: 1.25em; line-height: 200%;bottom:4px;}
    
}

/*子栏目 焦点图新闻 固定高度
<div class="subcolumn_photonews swiper-container">
    <div class="swiper-wrapper">
        <div class="swiper-slide">
            <a href="CompanyNewsinto.html">
                <div class="img_container">
                    <div class="bg_container"><img src="static/images/img43.jpg"></div>
                </div>
                <div class="txt_container">
                    <h4>再捐3620万元、200吨酒精！再捐3620万元、200吨酒精！再捐3620万元、200吨酒精！</h4>
                    <span class="time">2020-01-12</span>
                    <p>导语导语导语导语导语导语导语导语导语导语导语导语导语导语导语导语导语导语导语导语导语导语</p>
                </div>
            </a>
        </div>
    </div>
</div>
*/
.subcolumn_photonews .swiper-slide{ width: 100%;}
.subcolumn_photonews .img_container{position: relative; overflow: hidden; width: 400px; margin-right: 4%; display: inline-block; vertical-align: middle;}
.subcolumn_photonews .bg_container{ position: relative;overflow: hidden;height:0; padding: 0 0 75%;transition:transform .5s linear;}
.subcolumn_photonews a:hover .bg_container{transform:scale(1.05);}
.subcolumn_photonews .txt_container{display: inline-block; vertical-align: middle; width: calc(96% - 400px); margin-right: -2em;}
.subcolumn_photonews .txt_container h4{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:3; line-height: 1.5;overflow: hidden; color: #333; font-size: 1.25em;}
.subcolumn_photonews a:hover .txt_container h4{color: #972524;}
.subcolumn_photonews .txt_container .time{ font-size: .75em; color: #969696; line-height: 3; display: block; }
.subcolumn_photonews .txt_container p{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:3; line-height: 1.5;overflow: hidden; color: #333; color: #888;}
.subcolumn_photonews .txt_container:after{content: "查看详情 "; font-size: .75em; display: block; width: 8em; line-height: 2; margin: 1em 0 0; text-align: center; background: #972524; color: #FFF;}
.subcolumn_photonews .swiper-pagination{display: none;}
.subcolumn_photonews .swiper-button-prev,.subcolumn_photonews .swiper-button-next{ left:400px; top:-30px; width: 30px; height:30px; outline: none; position: absolute; margin-top: 300px; color: #FFF; font-size: 24px; line-height: 30px; text-align: center; z-index: 5; cursor: pointer; font-family: Arial, Helvetica, sans-serif; opacity: .7; background: #AAA; margin-left: -60px;}
.subcolumn_photonews .swiper-button-prev:hover,.subcolumn_photonews .swiper-button-next:hover{background:#972524;}
.subcolumn_photonews .swiper-button-prev:after{content: "<"; display: inline-block; transform: scale(1,1.25);}
.subcolumn_photonews .swiper-button-next:after{content: ">"; display: inline-block; transform: scale(1,1.25);}
.subcolumn_photonews .swiper-button-next{margin-left: -30px;}
@media screen and (max-width: 767px){
   .subcolumn_photonews .img_container{width: 100%; margin-bottom: 1em;} 
   .subcolumn_photonews .txt_container{width: 100%;}
   .subcolumn_photonews .swiper-button-prev,.subcolumn_photonews .swiper-button-next{left: 100%; margin-top:75%;}
}

/*新闻
<ul class="newslist_class4">
    <li>
        <a href="CompanyNewsInto.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 src="static/images/news169.jpg"></div>
            </div>
            <div class="txt_container">
                <h3>亚行与中国水环境集团共同助力全球生态安全</h3>
                <p>签约仪式上，亚行负责私营部门和公共—私营部门合作（PPP）的副行长迪瓦卡·古普塔（Diwakar</p>
            </div>
        </a>
    </li>
</ul>
*/
.newslist_class4{list-style: none;}
.newslist_class4 li{padding-bottom: 1em;}
.newslist_class4 li a{ display: block; position: relative;}
.newslist_class4 li .img_container{display: inline-block; vertical-align: top; overflow: hidden;position: relative; width: 288px; margin:  0 2em 0 0; border-radius: .25em;}
.newslist_class4 li .bg_container{position: relative; height: 0; padding: 0 0 56.25%; overflow: hidden;transition:transform .5s linear;}
.newslist_class4 li a:hover .bg_container{ transform: scale(1.05);}
.newslist_class4 li .txt_container{display: inline-block; vertical-align: top; overflow: hidden; width: calc(100% - 12em - 288px); margin: 0 -2em 0 -.33em; }
.newslist_class4 li h3{font-size: 1.25em; line-height: 2em; width: 100%; white-space: nowrap; text-overflow: ellipsis;overflow: hidden; color: #333; ;}
.newslist_class4 li a:hover h3{color: #972524;}
.newslist_class4 li p{overflow: hidden; font-size: .875em; line-height: 1.75em;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2; color: #888; height: 3.5em;}
.newslist_class4 li .time{ position: absolute; font-size: .75em; color: #DDD; left: calc(288px + 2em); bottom:0; line-height: 1.5;}
.newslist_class4 li .txt_container:after{content: "查看详情"; position: absolute; right:0; top:50%; width: 8em; text-align: center; color: #972524; border: 1px solid #972524; background: #FFF;; border-radius: .25em; line-height: 2em; font-size: .75em;}
.newslist_class4 li a:hover .txt_container:after{background: #972524; color: #FFF;}
@media screen and (max-width: 1024px){
    .newslist_class4 li .img_container{width: 192px;margin:  0 2em 0 0; }
    .newslist_class4 li .txt_container{width: calc(100% - 12em - 192px);}
    .newslist_class4 li h3{margin-top: -.5em;}
    .newslist_class4 li .time{left: calc(192px + 2em);}
}
@media screen and (max-width: 768px){
    .newslist_class4 li .time{top:0; bottom: auto; right: 0; left: auto;}
    .newslist_class4 li .img_container{width: calc(100% - 5em); }
    .newslist_class4 li .txt_container{width: 100%; margin: 0;}
    .newslist_class4 li h3{white-space: normal; line-height: 1.5; padding: .5em 0; margin: 0; font-size: 1em;}
    .newslist_class4 li .txt_container:after{ top:-6em; margin: 56.25% 0 0; width: 6em;}
}
/*图片列表  
<ul class="newslist_class5">
    <li>
        <a href="YangpuPortNewsinto.html" class="con">
            <div class="img_container">
                <div class="bg_container"><img src="static/images/cultural.jpg"></div>
            </div>
            <div class="txt_container">
                <h3>人民网访谈王会生：为国而投服务国家战略</h3>
                <p>以及企业背景、财务、法律、商业模式等方面的咨询服务。关注行业包括:医疗产业、互联网...</p>
                <span class="btnmore">查看详情</span>
            </div>
        </a>
    </li>
</ul>
*/
.newslist_class5{ list-style-type: none; overflow: hidden; margin: 0 -8px;}
.newslist_class5 li{width: 33.33%; display: inline-block;  padding: 8px; vertical-align: top; margin: 0 -.33em 1em 0; }
.newslist_class5 li .img_container{height: 0; overflow: hidden; padding: 0 0 56.25%; position: relative;  transition: box-shadow .5s linear;}
.newslist_class5 li .bg_container{position: absolute; left:0; top:0; right:0; bottom:0; overflow: hidden;transition: transform .5s linear;}
.newslist_class5 li a{display: block; border:1px solid #DDD; overflow: hidden; border-radius: .25em;}
.newslist_class5 li a:hover .img_container{box-shadow: 0 2px 6px rgba(0,0,0,.5);}
.newslist_class5 li a:hover .bg_container{transform: scale(1.05);}
.newslist_class5 li .txt_container{overflow: hidden; padding: 1em; position: relative;}
.newslist_class5 li .txt_container h3{white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width:100%; color: #333; text-align: left; line-height:150%; font-size: 1.125em; }
.newslist_class5 li a:hover .txt_container h3{color: #972524;}
.newslist_class5 li .txt_container p{overflow: hidden;color: #969696;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;line-height: 1.75; height: 3.5em;}
.newslist_class5 li .txt_container .btnmore{ display: block; width: 8em; line-height: 2; margin: 1.5em 0 1em; text-align: center; background: #972524; color: #FFF;}
@media screen and (max-width: 767px){
    .newslist_class5 li{ width: 50%;  }
    .newslist_class5 li:first-child{width: 100%;}
    .newslist_class5 li .txt_container h3{ font-size: 1em;}
    .newslist_class5 li .txt_container p{ font-size: .75em; }
    .newslist_class5 li .txt_container .btnmore{font-size: .75em; }
}
@media screen and (max-width: 408px){
    .newslist_class5 li{ width: 100%;}
}

/*子栏目
<div class="subcolumn_class2">
    <div class="subtil">
        <a href="IndicatorData.html">
            <h3>环保指标</h3>
            <h4>Environmental indicators</h4>
        </a>
    </div>
    <div class="subcon">
        
    </div>
</div>
*/ 
.subcolumn_class2 .subtil{position: relative; border-bottom:1px solid #DDD ;}
.subcolumn_class2 .subtil h3{color:#333;line-height: 150%;font-size: 24px;}
.subcolumn_class2 .subtil h4{font-size: 10px;color: #DDD;line-height: 150%;text-transform: uppercase; position: relative; top:-.5em}
.subcolumn_class2 .subtil h3:after{content:'>';position: absolute;right:.5em;  top:0em;color:#972524; line-height: 200%;}
.subcolumn_class2 .subtil a:hover h3:after{color:#494949;}
.subcolumn_class2 .subtil:after{content:""; position: absolute; left: 0; bottom:-1px; width: 1.5em; height: 1px; background: #972524; }
.subcolumn_class2 .subcon{padding: 1em 0; margin: 0 auto; max-width: 360px; }
.subcolumn_class2 .subcon .img_container{position: relative; padding: 0 0 75%; overflow: hidden;}
.subcolumn_class2 .subcon .bg_container{position: absolute; left: 0; top:0; right: 0; bottom: 0;}
@media screen and (max-width: 1024px){
    .subcolumn_class2 .subtil h3{font-size: 20px;}
}
@media screen and (max-width: 767px){
    .subcolumn_class2 .subtil h3{font-size: 18px;}
}

.businesslist{list-style-type: none;margin: 0 -8px; text-align: center;}
.businesslist li{display: inline-block; width: 25%; padding: 0 8px 2em; vertical-align: top; margin: 0 -.33em 0 0;}
.businesslist li a{display: block; position: relative; padding: 1.5em 0 3em; border:1px solid #DDD; border-radius: .25em;}
.businesslist li a:hover{border-color: #972524;}
.businesslist li .icon{display: block; width: 4em; margin: 0 auto 1em; height: 4em; overflow: hidden; filter: grayscale(100);}
.businesslist li .icon img{width: 100%; vertical-align: top;}
.businesslist li a:hover .icon{filter: grayscale(0);}
.businesslist li h3{ color: #333; line-height: 1.50; font-size: 1.25em; margin-bottom: 1em;}
.businesslist li p {line-height: 1.5em; height: 3em; overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:2; color: #969696; margin: 0 1em;}
.businesslist li a:hover h3{color: #972524;}
.businesslist li a:after{ content: ">"; text-align: center; line-height: 1.5em; width: 1.5em; height: 1.5em; position: absolute; left: 50%; bottom:-.75em; margin-left: -.75em; color: #FFF; font-family: simSun; background: #972524; border-radius: 50%; display: none;}
.businesslist li a:hover:after{ display: block;}
@media screen and (max-width: 1024px){
    .businesslist li h3{font-size: 1.125em;}
    .businesslist li p{font-size: .875em;}
    .businesslist li .icon{font-size: .875em;}
}
@media screen and (max-width: 767px){
    .businesslist li{width: 50%;}
    .businesslist li h3{font-size: 1em;}
    .businesslist li p{font-size: .75em;}
    .businesslist li .icon{font-size: .75em;}
}

.newslist_class2{list-style-type: none;  columns:auto 2;}
.newslist_class2 li a{display: block;position: relative; padding: .875em 0 ;}
.newslist_class2 li .number{position: absolute; left: 0; text-align: center; line-height: 2em; font-size: .75em; top:50%; margin-top: -1em;width: 1.5em; box-shadow: 0 0 3px rgba(0, 0, 0,.1);}
.newslist_class2 li .time{font-size: .75em; line-height: 1.5;}
.newslist_class2 li h4{white-space: nowrap; width: 100%; overflow: hidden; text-overflow: ellipsis; line-height: 2em; color: #333;}
.newslist_class2 li h4::before{content: "▶"; display: inline-block; transform: scale(.75); color: #972524; margin-right: .25em;}
.newslist_class2 li a:hover h4{color: #972524;}
@media screen and (max-width: 767px){
    .newslist_class2{columns:auto 1;}
    .newslist_class2 li a{ padding: .125em 0 ;}
}

.column_news .btn_more{font-size: .75em; width: 8em; display: block; margin: 1em auto 3em; color: #AAA;}
.column_news .btn_more:after{content: ">";}
.column_news .btn_more:hover{color: #972524;}


.column_product{position: relative; padding: 5% 0;}
.column_product > .bg_container{ position: absolute; left: 0; width: 100%; top:0; bottom:0; overflow: hidden;}
.column_product .column_content{position: relative; overflow: hidden;}
.column_product .column_content .column_title{ padding: 0;float: left;color: #FFF; text-align: left;}
.column_product .column_content .column_title h2{color: #FFF; font-weight: bold; font-size: 2em;line-height: 2em;}
.column_product .indexnews{ float: right; width: calc(60% + 10em); margin: 0 -2.5em;}
.column_product .con{margin: 0 2.5em; background: rgba(255, 255, 255,.7); display: block; padding: 2em 2.5em 1em;}
.column_product .con .til{padding: 0; margin-bottom: .5em; position: relative;}
.column_product .con .til h3{ line-height: 1.5em;color: #333; overflow: hidden; width: 100%;white-space: nowrap; text-overflow: ellipsis; font-weight: bold;}
.column_product .con .til .type{width: 100%;overflow: hidden; text-overflow: ellipsis;white-space: nowrap; font-size: .75em; color: #888;}
.column_product .con .til .type .t{color: #972524;}
.column_product .con .til .type span:before{content:"/"; color:#888; margin-left: .25em;}
.column_product .con .til .type span:first-child:before{display: none;}
.column_product .con p{ clear: both; height:6em; line-height: 1.5em; font-size: .875em;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:4; color: #666;}
.column_product .con:after{content:"查看详情";display: block; margin: 1em 0 0; font-size: .875em; text-decoration: underline;  color: #494949;}
.column_product .con:hover .til h3{color: #972524;}
.column_product .con:hover:after{color: #972524;}

.column_product .swiper-button-prev,.column_product .swiper-button-next{ position: absolute; left:0%;top:auto;bottom:0;right: auto; align-items:normal;display: block; outline: none; width: 2em; height: 2em; margin: 0; border-radius:1em; border:1px solid #FFF;cursor: pointer; text-align: center; line-height: 1.875; font-family: simSun; color: #FFF;  font-weight: bold;}
.column_product .swiper-button-prev:after,.column_product .swiper-button-next:after{display: none;}
.column_product .swiper-button-prev:before{content:"<";}
.column_product .swiper-button-next:before{content:">";}
.column_product .swiper-button-prev:hover,.column_product .swiper-button-next:hover{ background: #972524;border:1px solid #972524;}
.column_product .swiper-button-next{ left: 2.5em; }

@media screen and (max-width: 1024px){
    .column_product .column_content .column_title{margin: 0 0 1em; float: none;}
    .column_product .indexnews{ float:none; width:auto; margin: 0 -.5em;}
    .column_product .con{margin: 0 .5em;}
    .column_product .swiper-button-prev,.column_product .swiper-button-next{top:1.5em; bottom:auto; right: 2.5em; left: auto;}
    .column_product .swiper-button-next{right:0;}
}
@media screen and (max-width: 767px){
    .column_product .column_title{margin: 0 0 2em; width: 100%; left: 0;}
    .column_product .column_content .column_title h2{font-size: 1.75em;}
    .column_product .con{padding: 1em;}
}