@charset "utf-8";
/* CSS Document */
.banner{position: relative;z-index: 1}
/* Browser Resets
*********************************/
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;}
/* FlexSlider Necessary Styles
*********************************/ 
.flexslider {margin: 0; padding: 0;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;position:relative} /* Hide the slides before the JS is loaded. Avoids image jumping */
.banner .flexslider .slides > li a{display: block;height: 0;padding-bottom:25%;overflow:hidden;position: relative;}
.banner .flexslider ul li.flex-active-slide img{ transition:transform 6000ms linear 0s;
 -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}
.flexslider .slides > li.clone{position:relative}
.flexslider .slides img {width: 100%; display: block;}
.flex-pauseplay span {text-transform: capitalize;}
/* Clearfix for the .slides element */
.slides:after {content: "\0020"; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
html[xmlns] .slides {display: block;}
* html .slides {height: 1%;}
/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}

/* FlexSlider Default Theme
*********************************/
.flexslider { position: relative;zoom:1; }
.flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; }
.loading .flex-viewport { max-height: 300px; }
.flexslider .slides { zoom: 1; }
.carousel li { margin-right: 5px; }

/* Direction Nav */
.flex-direction-nav {*height: 0;}
.flex-direction-nav a  { /*! text-decoration:none; */ display: block; width: 100px; height: 100px;  overflow: hidden; cursor: pointer;transition: all 0.35s ease-in-out;border-radius: 50%;/*! border: rgba(255,255,255,0.5) 2px solid; */}
.flex-direction-nav a:hover{text-shadow: 1px 1px 0 #666;}
.flex-direction-nav .flex-prev {}
.flex-direction-nav .flex-next {}
.flexslider:hover .flex-prev {}
.flexslider:hover .flex-next {}
.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover { }
.flex-direction-nav .flex-disabled { opacity: 0!important; filter:alpha(opacity=0); cursor: default; }
/* Pause/Play */
.flex-pauseplay a { display: block; width: 20px; height: 20px; position: absolute; bottom: 5px; left: 10px; opacity: 0.8; z-index: 10; overflow: hidden; cursor: pointer; color: #000; background:#ddd}
.flex-pauseplay a:before  { font-family: "flexslider-icon"; font-size: 20px; display: inline-block; content: '\f004'; }
.flex-pauseplay a:hover  { opacity: 1; }
.flex-pauseplay a.flex-play:before { content: '\f003'; }
/* Control Nav */ 
.flex-control-nav {width: 100%; position: absolute; bottom: -2px; /*! left:0; */ text-align: center; z-index:9999; }
.flex-control-nav li {margin: 10px 6px 0; display: block; zoom: 1; *display: inline;vertical-align: bottom;}
.flex-control-paging li a {width: 8px; height: 8px; display: block;  cursor: pointer;  }
.flex-control-paging li a:hover {  }
.flex-control-paging li a.flex-active { }

.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
.flex-control-thumbs li {width: 25%; float: left; margin: 0;}
.flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}
.flex-control-thumbs img:hover {opacity: 1;}
.flex-control-thumbs .flex-active {opacity: 1; cursor: default;}

.banner .flex-direction-nav{ }
.banner .flex-direction-nav .flex-prev{ background: url(/chem/2021/images/arrow_lf.png) no-repeat center rgba(0,0,0,0.4); position: absolute;left: 10%;top: 50%;z-index: 9;margin-top: -50px;}
.banner .flex-direction-nav .flex-next{ background: url(/chem/2021/images/arrow_rt.png) no-repeat center rgba(0,0,0,0.4); position: absolute;right: 10%;top: 50%;z-index: 9;margin-top: -50px;}
.banner .flex-direction-nav .flex-prev:hover{background: url(/chem/2021/images/arrow_lf.png) no-repeat center rgba(150,0,20,0.4); }
.banner .flex-direction-nav .flex-next:hover{background: url(/chem/2021/images/arrow_rt.png) no-repeat center rgba(150,0,20,0.4); }

.banner .flex-control-paging{  position: absolute;bottom:30px;right:18%;z-index: 1045;width: auto;} 
.banner .flex-control-nav li{margin:0 5px; overflow: hidden;display: inline-block;}
.banner .flex-control-nav li a{text-indent: 0;display: inline-block;width: 28px; height: 28px;background: url(/chem/2021/images/icon1.png) no-repeat center;}
.banner .flex-control-nav li a.flex-active{background: url(/chem/2021/images/icon2.png) no-repeat center;}
.banner .flexslider{ position: relative;z-index: 0; }

.banner .flexslider .slides > li .slideText { position: absolute; left: 0; bottom: 0; width: 100%;
background-color:rgba(0,0,0,0.6);
background: -webkit-linear-gradient(bottom, rgba(0,0,0,0.6),rgba(0,0,0,0)); /* Safari 5.1 - 6.0 */
background: -o-linear-gradient(top, rgba(0,0,0,0.6), rgba(0,0,0,0)); /* Opera 11.1 - 12.0 */
background: -moz-linear-gradient(top,rgba(0,0,0,0.6), rgba(0,0,0,0)); /* Firefox 3.6 - 15 */
background: linear-gradient(to top, rgba(0,0,0,0.6), rgba(0,0,0,0)); /* 标准的语法 */ }
.banner .flexslider .slides > li .slideText p{ margin: 40px 13%; height: 30px;line-height: 30px;overflow: hidden;width: 50%;}



.Banner .flex-direction-nav a { width: 40px; height: 40px; }
.Banner .flex-direction-nav .flex-prev {  background: url(/chem/2021/images/arrow_lf.png) no-repeat center rgba(0,0,0,0.5); float: left;}
.Banner .flex-direction-nav .flex-next {  background: url(/chem/2021/images/arrow_rt.png) no-repeat center rgba(0,0,0,0.5); float: right;}
.Banner .flex-direction-nav { position: absolute; top: 50%; margin:-20px 0 0 0; width: 100%;z-index: 999;}
.Banner .flex-control-nav { display: none; }
.til_slides {  width: 100%; height: 30px; line-height: 30px; background: rgba(0,0,0,0.5); z-index: 99; position: absolute; left: 0px; bottom: 0px; color: #fff; text-align: center; }



/*新闻经纬*/
.mode01 { margin: 45px auto 40px auto; overflow: hidden; }
.mode01 > .gp-fl{ width: 45.8%; overflow: hidden;}
.mode01 > .gp-fr{ width: 49%; overflow: hidden;position: relative;}
.articleTitle01{ overflow: hidden; margin-bottom: 22px;}
.articleTitle01 .title{ display: block; float: left;background: url(/chem/2021/images/icon3.png) no-repeat left center; padding-left: 24px; }
.articleTitle01 .title b{ color: #999; font-weight: normal; }
.articleTitle01 .more{display: block;float: right; color: #999; line-height: 30px; transition: all 0.3s ease;}
.articleTitle01 .more:hover{ color: #9e1620;  }

.articleList01{ overflow: hidden; }
.articleList01 .artImg{ width: 320px; height: 180px; }
.articleList01 .artText{ margin-left: 340px; }
.articleList01 .artText a{ display: block; overflow: hidden;transition: all 0.2s ease;}
.articleList01 .artText a:hover{ padding-left: 10px; }
.articleList01 .artTitle { line-height: 28px; height: 112px; }
.articleList01 .date{ margin: 48px 0 0 0; color: #960014; background: url(/chem/2021/images/datebg.png) no-repeat left center; padding-left: 24px;}


.list1{ overflow: hidden; margin-top: 12px;}
.list1 li{ padding: 13px 0; border-bottom: #EBEBEB 1px solid;overflow: hidden; }
.list1 .rightDate{ float: right;color: #960014; background: url(/chem/2021/images/datebg.png) no-repeat left center; padding-left: 24px;margin-left: 24px;}
.list1 li a{ line-height: 26px;height: 52px; overflow: hidden; display: block;border-right: #eeeeee 1px solid;padding-right: 28px; transition: all 0.2s ease;}
.list1 li:hover a{ padding-left:10px; } 
 
/*通知公告*/
.list2 { overflow: hidden; margin: -15px -22px;}
.list2 li{ overflow: hidden;transition: all 0.3s ease;}
.list2 li a{ display: block; padding:15px 24px; margin: 15px 22px;border:#ecc777 1px solid; transition: all 0.2s ease;overflow: hidden;}
.list2 .listTitle{ line-height: 26px; height: 52px; margin-bottom: 20px;}
.list2 .date{ display: block; color: #960014; background: url(/chem/2021/images/datebg.png) no-repeat left center; padding-left: 24px;position: relative;}
.list2 .date:before{ content: ""; display: block;width: 30px; height: 1px;background: #eeeeee; position: absolute; left: 0; top: -11px; }
.list2 li a:hover{box-shadow: 0px 9px 9px rgba(15,0,20,0.2);
background-color:#960014;
background: -webkit-linear-gradient(60deg, #960014, #70000f); /* Safari 5.1 - 6.0 */
background: -o-linear-gradient(60deg, #960014, #70000f); /* Opera 11.1 - 12.0 */
background: -moz-linear-gradient(60deg,#960014, #70000f); /* Firefox 3.6 - 15 */
background: linear-gradient(60deg, #960014 , #70000f); /* 标准的语法 */ } 
.list2 li a:hover *{ color: #fff; }
.list2 li a:hover .date{ background: url(/chem/2021/images/datebg2.png) no-repeat left center; }
.list2 li a:hover .date:before{ opacity: 0.2; }
/*tab start*/
.tabArticleList{ margin-top: -47px;}
.tabArticleList .tabListTitle{ margin-left: 203px; overflow:hidden; height: 22px;line-height: 22px; display: inline-block; margin-bottom: 22px;}
.tabArticleList .tab_menu h3{ width:auto; float:left; position: relative;}
.tabArticleList .tab_menu h3 a{ display:block;text-align:center;float:left;font-size:16px; width:auto;
 position: relative; font-weight: normal;padding: 0 15px; color: #666;} 
.tabArticleList .tab_menu h3:after{ content: ""; display: block; width: 2px;height: 16px;background: #959595; position: absolute;
right: 0; top: 4px; }
.tabArticleList .tab_menu h3:first-child:before{ content: ""; display: block; width: 2px;height: 16px;background: #959595; position: absolute;
left: 0; top: 4px; }
.tabArticleList .tab_menu h3:hover a,.tabArticleList .tab_menu h3.on a{display:block; width:auto;color: #333;}
.tabArticleList .tab_menu h3 a:hover{}
.tabArticleList .more_tab{ display: none;}
/*.tabArticleList .tabListTitle .more{ float:right; padding-top:10px;}*/
.tabArticleList .tabListTitle .tab_more{ position: absolute; right: 0; top: 4px;  }
.tabArticleList .tabListTitle .more_tab{ color: #959595; font-size: 14px; }
.tabArticleList .more_tab.on{ display: block; }

.tabArticleList .tabList{position:relative;}
.tabArticleList .tabListBox .more{display: block;float: right;text-align: center;color: #144A74;border: #144A74 1px solid;width: 70px;height: 22px;
 line-height: 22px;border-radius: 20px; position:absolute; right:0; top:-58px; transition: all 0.3s ease;}
.tabArticleList .tabListBox .more:hover{ background:#144A74; color: #fff;  }
.tabArticleList .tabListBox{ display:none;}
/*tab end*/



.wrap_mode02{ background: url(/chem/2021/images/modebg.jpg) no-repeat center top; overflow: hidden; padding: 45px 0 15px 0;background-size: cover;}
.mode02 > .gp-fl{ width: 45.8%; overflow: hidden;}
.mode02 > .gp-fr{ width: 49%; overflow: hidden;position: relative;}
.articleTitle02 .title{ display: block; float: left;background: url(/chem/2021/images/icon1.png) no-repeat left center; background-size:22px; padding-left: 24px; }
.articleTitle02 .title b{ color: #fff; font-weight: normal; }
.articleTitle02 .more{display: block;float: right; color: #fff; line-height: 30px; transition: all 0.3s ease;}
.articleTitle02 .more:hover{ color: #fff;  }

.list3{ padding-left: 70px; }
.list3 li{ margin-bottom: 30px; }
.list3 a { display: block; background: #fff; padding: 15px 30px; position: relative; transition: all 0.2s ease;}
.list3 .listDate{ display: block; width: 50px; height: 36px;background: #e2a557; line-height: 20px;text-align: right; padding: 10px;
position: absolute; left: -70px; top: 0;}
.list3 .listTitle{ height: 48px; line-height: 24px; margin-bottom: 7px;}
.list3 .listCon{ line-height: 22px; height: 44px; color: #999999; border-top: #eeeeee 1px solid;padding-top: 7px;}
.list3 a:hover{ box-shadow: -5px 16px 12px -2px rgba(0,0,0,0.5); margin-top: -2px;}


.list4{}
.list4 li.li1{ width: 41%; float: left; overflow: hidden; margin-bottom: 30px;margin-right: 8%;}
.list4 li.li3{ width: 41%; float: right; overflow: hidden; }
.list4 li.li2{ width: 51%;  overflow: hidden; margin-bottom: 30px;}
.list4 li.li4{ width: 51%; float: left; overflow: hidden; }
.list4 li.li1 a,.list4 li.li3 a{ display: block; background: #fff; transition: all 0.2s ease; }
.list4 li.li2 a,.list4 li.li4 a{ display: block; background: #fff; padding: 12px 30px 38px 30px; position: relative;}
.list4 .listTitle{height: 48px; line-height: 24px; transition: all 0.2s ease;}
.list4 .li1 .listText,.list4 .li3 .listText{ padding: 8px 16px; position: relative;overflow: visible;}
.list4 .li1 .listDate,.list4 .li3 .listDate{ display: inline-block; padding: 3px 18px; background: #ecc777; color: #fff; position: absolute;top: -25px;right: 0;}
.list4 a:hover{ box-shadow: -5px 16px 12px -2px rgba(0,0,0,0.5);  }
.list4 .listCon{ line-height: 24px; height: 96px; color: #999; border-top: #eeeeee 1px solid;padding-top: 13px;margin-top: 13px;}
.list4 .li2 .listDate,.list4 .li4 .listDate{ display: inline-block; padding: 3px 18px; background: #ecc777; color: #fff; position: absolute;bottom:0 ;right: 0;}
.list4 li a:hover .listTitle { padding-left: 10px; }










@media screen  and (max-width:1440px) { 
    .banner .flex-direction-nav .flex-prev{ left: 3%; }
    .banner .flex-direction-nav .flex-next{ right: 3%; }
    .banner .flexslider .slides > li .slideText p{ margin: 40px 11%; }
    .banner .flex-control-paging{ right: 11%; }
    .list4 li.li2 a, .list4 li.li4 a{ padding:12px 26px 26px 30px; }
    .list4 .listCon{ height: 72px; }
    .list3 .listTitle{ height: 24px; }
    .tabArticleList .tabListTitle{ margin-left: 180px; }
    .tabArticleList .tab_menu h3 a{ padding:0 10px; }
}


@media screen  and (max-width:1360px) {
      .flex-direction-nav a{ width: 60px; height:60px; }
}

 
@media screen  and (max-width:1120px) {
    .banner .flex-direction-nav a{ width: 40px; height: 40px; background-size: 10px !important;}
    .banner .flexslider .slides > li .slideText p{ margin: 15px;font-size: 16px; }
    .banner .flex-control-paging{ right: 15px;bottom: 15px; }
    .articleList01 .artImg{ width: 255px; height: 145px;}
    .articleList01 .artText{ margin-left: 274px; }
    .articleList01 .artTitle{ height: 84px; }
    .articleList01 .date{ margin: 40px 0 0 0; }
}


@media screen and (max-width: 997px) {
    .mode01{margin: 25px auto;}
    .wrap_mode02{ padding:25px 0; }
    .mode01 > .gp-fl,.mode02 > .gp-fl{ width: 100%;float: none; }
    .mode01 > .gp-fr,.mode02 > .gp-fr{ width: 100%; float: none; margin-top: 25px; }
    .list1 li a{/*! height: auto; */}
    .list2{ margin: -5px; }
    .list2 li a{ margin: 5px; }
    .list3 li{ margin-bottom: 18px; }
    .list4 li.li1{ width: 46%; margin-right: 3%; }
    .list4 li.li3{ width: 46%; }
}

@media screen and (max-width:640px) {
	  .banner .flex-control-paging,.banner .flexslider .slides > li .slideText,.banner .flex-direction-nav{ display: none; }
    .list2 .listTitle{ max-height: 52px; height: auto;}
    .list4 li{ width: 100% !important; float:none !important; margin-bottom: 18px !important;}
    .tabArticleList{ margin-top: 0; }
    .tabArticleList .tabListTitle{ margin-left: 0; margin-bottom: 15px; }
    .articleList01 .artImg{ width: 100%; height: auto; float: none; }
    .articleList01 .artText{ margin: 15px 0 0 0; }
    .articleList01 .artTitle{ height: auto; }
    .articleList01 .date{ margin: 10px 0 0 0; }
}

@media screen and (max-width:480px) {
    .articleTitle01 .title{ font-size: 1.6rem; font-size: 16px; }
    .articleTitle02 .title b{ font-size: 0.9rem; font-size: 9px; }
}