

body{ font-family: "sourcehansans";}
.clear{ clear: both; line-height: 0; height: 0; font-size: 0;}
.w1200{ max-width: 1180px; padding: 0 10px !important; margin: 0 auto;}	
.w1400{ max-width: 1400px; margin: 0 auto;}	

font{ font-family: "SourceHanSerif";}

.header.header-bg{ background: none;}
.header{ height: .99rem;}

.header .lang{ position: relative; font-size: .14rem;}
.header .lang .sub-menu {
display: none;
 position:absolute;
 top:100%;
 right:-55px;
 width:300%;
 background:#b18a51;
 -o-transition:all .3s ease;
 transition:all .3s ease;
 -webkit-transition:all .3s ease;
 z-index:2;
 /*opacity:0;*/
 filter:alpha(opacity=0);
 -webkit-transform:translatex(-50%);
 -ms-transform:translatex(-50%);
 -o-transform:translatex(-50%);
 transform:translatex(-50%)
}
.header .lang .sub-menu .arrow {
 position:absolute;
	display: none;
 top:-10px;
 left:50%;
 width:0;
 height:0;
 border-style:solid;
 border-color:transparent transparent #b18a51;
 border-width:0 10px 10px;
 margin:0 0 0 -10px
}
.header .lang .sub-menu .sub-link {
 position:relative
}
.header .lang .sub-menu .sub-link:hover a {
 background:#835e2d
}
.header .lang .sub-menu .sub-link .sub-sort {
 position:absolute;
 top:0;
 left:99.6%;
 min-width:100%;
 display:none
}
.header .lang .sub-menu .sub-link .sub-sort a {
 background:#835e2d;
 border-bottom:1px solid rgba(255,255,255,.05)
}
.header .lang .sub-menu .sub-link .sub-sort a:last-child {
 border-bottom:0
}
.header .lang .sub-menu .sub-link:hover .sub-sort {
 display:block
}
.header .lang .sub-menu a {
 background:#b18a51;
 display:block;
 font-size:.16rem;
 line-height:.5rem;
 text-align:center;
 color:#fff;
 white-space:nowrap;
 padding:0 .1rem
}
.header .lang .sub-menu a:hover {
 background:#835e2d
}



.header ul li{ height: .99rem; line-height: .99rem; font-size: 15px;}
.header .logo img{ width: 1.35rem; height: .75rem; margin: .12rem 0 0;}
.header ul li.active > a{ color: #144e98; border-bottom: .01rem solid #144e98;}
.header ul li .name{  padding: 0; font-size: 15px;}
.header ul li .name:hover{color: #144e98;}

.header .nav-trigger{top: 0.55rem;}

.banner{ height: 4rem; padding-top:1rem;}
.banner .dtitle{ text-align:center; padding-top:1.4rem; position:relative; height:100%}

.dposition{ height: 60px; line-height: 60px; border-bottom: 1px solid #808080; font-size: 16px; font-family:"sourcehansans" !important; position:relative;}	
.dposition a{color: #666; padding: 0 5px;}
/*.vpro .dposition{color: #fff;}
.vpro .dposition a{color: #fff;}*/

.dposition .w1280{ padding:0 10px; }

.baona .dtitle {-webkit-transform:translate(0,-60px);-ms-transform:translate(0,-60px);-o-transform:translate(0,-60px);transform:translate(0,-60px);transition:all 1s}
.baona .swiper-slide-active .dtitle{-webkit-transform:translate(0,0);-ms-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0);-webkit-transition-delay:.4s;-o-transition-delay:.4s;transition-delay:.4s}




.main{ padding: 35px 0;}
.title.green{ position: relative; transform: translateY(-50%);}
.title.green i{font-family: "SourceHanSerif" !important; font-size: .15rem; color: #e5c687; font-style: normal; text-transform:Uppercase;}
.title.green h2{font-family: "SourceHanSerif" !important; font-size: .5rem; color: #e5c687; line-height:auto !important;}
.title.green .line{display: block;width: 86px;height: 3px;background: #e5c687; margin: 0 auto;  margin-top: 8px;}
.title.green .iline{display: block;width: 86px;height: 3px;background: #e5c687; margin: 0 auto;  margin-top: 8px;}

.about-page .page-container{ padding:10px;}
.about-article{ font-family: "sourcehansans" !important;}
.about-page .page-container .about-article p{ font-size:16px;}

.productv-page{ margin-top: -60px;}
.productv-page .pro{ padding-top:120px; background:url(../img/probg.png) 50% 50% no-repeat #626262; -webkit-background-size:cover; background-size:cover; text-align: center; overflow:hidden;}

.productv-page .pro .title{ font-size:28px; line-height:24px; color:#fff; margin-bottom: 34px; font-family: "sourcehansans" !important;}
.productv-page .pro .pic{padding: 20px 0;   }
.productv-page .pro .pic img{ width:150px;}
.productv-page .pro .info { margin:0 auto; background:rgba(0,0,0,.2); font-family: "sourcehansans" !important;}
.productv-page .pro .info .mt{ height:45px; line-height:45px; color:#fff; background:rgba(0,0,0,.2); font-size:20px;}
.productv-page .pro .info .mc{ text-align:left; color:#fff; padding:20px 30px; margin-bottom:50px;}
.productv-page .pro .info .mc p{ line-height24px; padding:5px 0px; font-size:16px;}
.productv-page .pro .info .mc strong{ font-weight: bold; color: #e5c687;}

.prolist .proLi{width: calc(100% / 4); height: auto;float: left; position: relative; overflow: hidden; padding: 10px;}	
.prolist .proLi .pic{ position:relative;overflow:hidden;width:auto;height:0px;padding-bottom:74%;border:1px solid #f1f1f1;border-bottom:0}	
.prolist .proLi .pic img {position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;transition:all .5s ease;height:100%;object-fit:contain;object-position:top center}	
.prolist .proLi .info{ position:relative; overflow:hidden;width:100%;height:auto;padding:20px 20px 10px;border:1px solid #f2f2f2	}	
.prolist .proLi .info .name{font-family: "sourcehansans" !important; font-size:16px;color:#333; overflow:hidden;text-overflow:ellipsis;position:relative;white-space:nowrap;width:100%; padding-bottom:8px	}
.prolist .proLi .info .more{font-family: "sourcehansans" !important; position:relative;display:block; color:#777; height:38px; line-height:38px; border-top:1px solid #e5e5e5	}
	
	
.prolist .proLi .info .more .details {position:relative;display:block;color:#777;height:38px;line-height:38px;}
.prolist .proLi .info .more .arrowsR {position:absolute;top:50%;right:0px;transform:translate(0,-50%);width:30px}
.prolist .proLi .info .more .arrowsR img {position:absolute;transition:all .5s ease}
.prolist .proLi .info .more .arrowsR .harr {opacity:0}	
	
	
.prolist .proLi .pic .showBox {position:absolute;top:0px;left:0px;width:100%;height:100%;opacity:0;background:rgba(0,0,0,.6);transition:all .5s ease}
.prolist .proLi:hover .pic .showBox{ opacity: 1;} 	
	
.prolist .proLi .pic .showBoxLink {font-family: "sourcehansans" !important; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); display:block; width:60%; color:#fff; text-align:center; font-size:16px; line-height: 23px; padding:8px 0}
.prolist .proLi .pic .showBoxLink:before { content:''; position:absolute; top:0px; left:50%; transform:translateX(-50%); width:16px; height:1px; background:#fff; transition:all .5s ease}
.prolist .proLi .pic .showBoxLink:after { content:''; position:absolute; bottom:0px; left:50%; transform:translateX(-50%); width:16px; height:1px; background:#fff; transition:all .5s ease}
	
.prolist .proLi:hover .info .more .arrowsR .barr { opacity:0}
.prolist .proLi:hover .info .more .arrowsR .harr { opacity:1}
.prolist .proLi .pic .proLi:hover .showBox { opacity:1}
.prolist .proLi .pic .proLi:hover .proImg { transform:translate(-50%,-50%) scale(1.1)}
.prolist .proLi .pic .proLi:hover .showBoxLink:before {  width:16px;}
.prolist .proLi .pic .proLi:hover .showBoxLink:after { width:16px;}	


.certificatelist { width:100%;}
.certificatelist .p_MatteIcon .iconfont:before {content:'\e602';}
.certificatelist >div {animation-fill-mode:both;}
.certificatelist .p_products {width:100%; transition:0.3s ease 0s; font-size:14px;}
.certificatelist .p_products ul { font-size:0px;}

.certificatelist .p_products li {width: calc(100% / 4); height: auto;float: left; position: relative; overflow: hidden; padding: 10px;}
.certificatelist .p_products li a { font-size:0px; overflow:hidden; text-align:center; background:#fff; width:100%; margin:0 auto; display:block;}
.certificatelist .p_products li a:before { content:''; display:inline-block; vertical-align:middle; height:100%; width:0px;}
.certificatelist .p_products img { display:inline-block; vertical-align:middle; transition:0.5s linear 0s; width:auto; height:auto; max-height:87%; max-width:90%; margin-left:0px; transform:scale(.9);}
.certificatelist .p_products h4 {display:none;}
.certificatelist .p_products li span { color:#666; white-space:nowrap; transition:0.3s ease 0s; display:block; width:100%; text-align:center; overflow:hidden; text-overflow:ellipsis; font-size:16px; padding:3% 10px; box-sizing:border-box; border:none;}

.fullpage{width: 100%;font-size: 0;text-align: center;margin: 30px 0;}
.fullpage li{ display:inline-block;}
.fullpage li a{display: inline-block;vertical-align: middle;border: 1px solid #e5e5e5; padding:0 15px; height: 46px;text-align: center;line-height: 46px;font-size: 16px;color: #666;margin: 0 3px;transition: all .4s ease; border-radius: 4px;}
.fullpage li a:hover,.fullpage li.active a{background: #ff6700;border-color: #ff6700;color: #fff;}


@media screen and (min-width: 769px) { 
 .certificatelist .p_products li:hover img { transform:scale(1);}
 .certificatelist .p_products li:hover span { color:#e5c687; background:#ffffff;}
}

@media screen and (max-width: 810px) { 
 .certificatelist .p_products li {width: calc(100% / 3); }
 .certificatelist .p_products img{transform: scale(1);}
}
@media screen and (max-width: 1100px) {
 .certificatelist .p_products li a { height: 21.2vw;}
}

@media screen and (max-width: 768px) {
 .certificatelist .p_products {  padding:0px; }
 .certificatelist .p_products li { width: calc(100% / 2)  margin-bottom: 5%;}
 .certificatelist .p_products li a { height: 31vw; padding: 0;}
 .certificatelist .p_products li span { padding: 2vw; font-size: 14px;}
/* .certificatelist .p_products li:nth-child(2n+1) { margin-left: 0%;}
.certificatelist .p_products li:nth-child(2n+0) { margin-left: 4%; }*/
}

@media screen and (max-width: 1500px) {
 .certificatelist .p_products li span { font-size: 14px }
}
.certificatelist .p_page .pre .iconfont:before { shadow-angle:0px; shadow-distance:0px; shadow-angle-ofInset:0px; shadow-distance-ofInset:0px;}
.certificatelist .p_page .next .iconfont:before {shadow-angle:0px; shadow-distance:0px; shadow-angle-ofInset:0px; shadow-distance-ofInset:0px;}
.certificatelist .p_more .iconfont:before {shadow-angle:0px; shadow-distance:0px; shadow-angle-ofInset:0px; shadow-distance-ofInset:0px;}
.certificatelist .p_loading .iconfont:before { shadow-angle:0px; shadow-distance:0px; shadow-angle-ofInset:0px; shadow-distance-ofInset:0px;}
.certificatelist .stylebox_top { height:auto;}
.certificatelist .title_sub { position:relative; color:#1c3079; font-size:28px; margin-left:0px; padding-left:15px}
.certificatelist .title_sub:before { content:''; position:absolute; left:0px; top:8px; height:24px; width:2px; background:#1c3079; z-index:1;}
.certificatelist .title_main { font-size:30px; color:#eaa317;}
.certificatelist .stylebox_content { padding-top:30px;}
.certificatelist { width:100%;}	

#videolist .videolist { position:relative; }
#videolist .videolist:hover{ cursor: pointer; }

#videolist .videos{ display:none; position: absolute;width: 800px;height: 600px; background: #000;top: 0;left:0;right:0;bottom:0; margin: auto; z-index: 9999;}
#videolist .vclose { position:absolute;right:1%; top:1%; border-radius:100%; cursor: pointer; }
#video{ width:800px; height:600px; }	
	
	
.videoslist{font-family: "sourcehansans" !important;}

.videoslist .pro {
 height:auto;
 margin:0 auto;
 overflow:hidden;
 padding:0px
}
.videoslist .proUl {
 margin:0rem 0;
 overflow:hidden;
 display:grid;
 grid-template-columns:1fr 1fr;
 grid-gap:15px
}

.videoslist .proLi{ padding:10px;}

.videoslist .leftBox {
 width:75%;
 height:100%;
 padding-top:10px
}
.videoslist .proTitle {
 color:#fff;
 font-size:16px;
 height:28px;
 line-height:28px;
 overflow:hidden;
 white-space:nowrap;
 text-overflow:ellipsis
}
.videoslist .proSummry {
 height:20px;
 color:rgba(255,255,255,.6);
 line-height:20px;
 font-size:14px;
 overflow:hidden;
 white-space:nowrap;
 text-overflow:ellipsis
}
.videoslist .rightBox {
 width:25%;
 height:100%;
 display:flex;
 align-items:center;
 justify-content:center
}
.videoslist .icon {
 display:flex;
 width:100%;
 height:1rem;
 align-items:center;
 justify-content:center;
 color:#fff;
 border-left:1px solid rgba(255,255,255,.2)
}
.videoslist .proLink {
 position:relative;
 display:block;
 width:100%;
 height:0px
}
.videoslist .proImgBox {
 position:absolute;
 width:100%;
 height:100%
}
.videoslist .proImg {
 width:100%;
 height:100%;
 transition:all .5s ease
}
.videoslist .txtBox {
 position:absolute;
 left:50%;
 width:calc(100% - 70px);
 padding:10px;
 height:90px;
 border-top:1px solid rgba(255,255,255,.4);
 background:rgba(0,0,0,.35);
 transform:translate(-50%,-20%);
 display:flex;
 transition:all .5s ease
}

.video-article .mt{ font-size:24px; line-height:50px; text-align:center; margin:20px 0;}
.video-article .d-video{ max-width:740px; max-height:406px; margin:0 auto; margin-bottom:20px;}

@media only screen and (max-width:1200px) {
	.productv-page .pro{ padding:0 10px; padding-top: 120px;}
}

@media only screen and (max-width:768px) {
  .productv-page .pro .title{ font-size:24px;}	
	
 .videoslist .proLi {
  width:100%;
  margin:1rem 0;
  overflow:hidden
 }
 .videoslist .proLink {
  padding-bottom:53%
 }
 .videoslist .txtBox {
  top:60%
 }
 
 .videoslist .proUl {
 margin:0rem 0;
 overflow:hidden;
 display:block;
 grid-template-columns:1fr 1fr;
 grid-gap:15px
}
}
@media only screen and (min-width:769px) {
	
 .videoslist .proLi {
  position:relative;
  width:auto;
  float:none;
  overflow:hidden
 }
 .videoslist .proLink {
  padding-bottom:53%
 }
 .videoslist .proImgBox {
  width:auto;
  height:auto;
  overflow:hidden
 }
 .videoslist .proImg {
  width:100%;
  height:100%;
  transition:all .5s ease
 }
 .videoslist .txtBox {
  top:60%
 }
 .videoslist .proLi:hover .proImg {
  transform:scale(1.1)
 }
 .videoslist .proLi:hover .txtBox {
  top:70%
 }
}
@media only screen and (max-width:739px) {
	.video-article .d-video{ padding:0 10px;}

}
.videoslist .p_page .pre .iconfont:before {
 shadow-angle:0;
 shadow-distance:0;
 shadow-angle-ofInset:0;
 shadow-distance-ofInset:0
}
.videoslist .p_page .next .iconfont:before {
 shadow-angle:0;
 shadow-distance:0;
 shadow-angle-ofInset:0;
 shadow-distance-ofInset:0
}
.videoslist .p_more .iconfont:before {
 shadow-angle:0;
 shadow-distance:0;
 shadow-angle-ofInset:0;
 shadow-distance-ofInset:0
}
.videoslist .p_loading .iconfont:before {
 shadow-angle:0;
 shadow-distance:0;
 shadow-angle-ofInset:0;
 shadow-distance-ofInset:0
}

.dfooter{  background: #353535; color: #fff;}	
.dfooter a{color: #fff;}	
.dfooter .fline{ height: 20px; position: relative;}
.dfooter .fline:before{ content: ""; background: rgba(255,255,255,0.2); position: absolute; top: 50%; height: 1px; margin-top: .5px; width: 100%; display: block;}
.dfooter .fbottom{ font-size: 12px; color: #D3D3D3; padding: 20px 0 40px;}
.dfooter .fnav{padding: 80px 0 20px;}	
.dfooter .fnav li a{float: left;margin-right: 4%;color: #fff; font-size: 16px;	}
.dfooter .w1280{ padding:0 10px;}


@media screen and (max-width:960px) {
    .header.header-bg { background: rgba(0,0,0,.2);}	
	.header .nav{top: 1.1rem;}	
	.article .padding-large{ padding: 0;}
	
	.header{ height:1.1rem !important;}
	.header .d-bar{ display:none !important;}
	.header .nav-trigger { top: 0.15rem !important;}
	.header .nav li.plang{ display:block !important;}
}

@media screen and (max-width:720px) {
.main{padding: 0px 0;}	
	
.prolist .proLi{width: calc(100% / 2);}		
	
}

@media screen and (max-width:500px) {
.productv-page .pro .title{ font-size:20px;}	
	.certificatelist .p_products li {width: calc(100% / 2); }	
	
	
.prolist .proLi{width: calc(100% / 2);}	
.dfooter .fnav{ display:none;}
.dfooter .fline{ display:none;}
.dfooter .fbottom{padding: 20px 0 20px;}
.dfooter .fbottom p{ text-align:center;}
.dfooter .fbottom p span{ display:block;}


}