﻿@charset "utf-8";
/*

*/

/*Reset*/
*{ padding:0; margin:0}
html,div,ul,li,dl,dt,dd,p,h1,h2,h3,h4,h5,h6,img,form,embed,label{margin:0;padding:0;border:0;  font-weight:normal;font-size:100%;}
fieldset,img{border:none}
ul,ul li{ list-style:none;} 
.cls{clear:both; line-height:0px!important; height:0px!important;font-size:0px!important;} 
button, input, select, textarea { font:12px/1.5 tahoma, arial, \5b8b\4f53; }
a {color:#666;text-decoration:none;/*-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;*/ }
a:hover {color:#d9d9d9;}
a:active {color:#d9d9d9;}
.hidden{ display:none}
i{ font-style:normal}
/*html,body{-webkit-text-size-adjust:none;}*/
table { border-collapse:collapse;  border-spacing:0;}
.clearfix:before,.clearfix:after{content:'.'; display:block; overflow:hidden; visibility:hidden; font-size:0; line-height:0; width:0; height:0;}
.clearfix:after{clear:both;}
.clearfix{zoom:1;}

/*basic*/ 
body{margin:0px; padding:0px;font-family:"\5FAE\8F6F\96C5\9ED1"; font-size:12px;color:#606060; height:100%; background:#181818}  
.wrap{ width:1400px; margin:0 auto;position:relative;}


.head{  width:100%; height:64px; border-bottom:1px solid #252525;position: fixed; top: 0; left: 0; background:#181818;  text-align:center;-ms-transform: translate(0, 0); transform: translate(0, 0); -ms-transition: transform .5s ease-in; transition: transform .5s ease-in; z-index: 1000003;opacity:0.95; }
.head.up { -ms-transform: translate(0, -88px); transform: translate(0, -88px); }



.logo{  padding:18px 0 0 23px; position:absolute; left:0; top:0;}
.logo img{ width:106px;}
.logo a{-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out; display:block}
.logo a:hover{opacity:0.8;}



.nav{ display:inline-block; margin:0 auto;}
.navlist li{display:inline-block;line-height:64px; margin:0 90px; font-size:16px; font-family:"Hum";}
.navlist li a{ display:block}
/*.navlist li a{display:block;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;transition: all 0.2s ease-out; }
.navlist li.hover a,.navlist li a:hover{ color:#d9d9d9; background:url(../images/line.jpg) center bottom no-repeat; }*/
.navlist li span{ position:relative}
.navlist li span:after { content: ''; display: block; height: 1px; background: #d9d9d9; position: absolute; bottom: -24px; left: 0; right: 0; opacity: 0; -ms-transform: scale(0, 1); transform: scale(0, 1); -ms-transition: opacity .2s ease-in,-ms-transform .2s ease-out; transition: opacity .2s ease-in,transform .2s ease-out; z-index: 1; width:26px; margin:0 auto; }
.navlist li:hover span:after { opacity: 1; -ms-transform: scale(1, 1); transform: scale(1, 1); }
.navlist li.hover span:after { opacity: 1; -ms-transform: scale(1, 1); transform: scale(1, 1); }
.navlist li.hover a,.navlist li a:hover{color:#d9d9d9; }


.hwx{ padding:20px 5px 0 0; position:absolute; right:0; top:0; z-index:11}
.hwx a{ display:block;width:27px; height:25px;background:url(../images/wx.svg) no-repeat; background-position:center top; background-repeat:no-repeat;background-size:cover;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.hwx a:hover,.hwx:hover a{background:url(../images/wx2.svg) no-repeat; background-position:center top; background-repeat:no-repeat;background-size:cover;}
.wximg{ position:absolute; z-index:22; left:-52px; top:64px; border:1px solid #252525; background:#181818; padding:9px;opacity:0.95; display:none}
.wximg img{ width:120px; height:120px; display:block}
.hwx:hover .wximg{ display:block}

.hwx1{ padding:20px 38px 0 0; position:absolute; right:0; top:0; z-index:11}
.hwx1 a{ display:block;width:100px; height:25px;background:url(../images/actun.png) no-repeat; background-position:center top; background-repeat:no-repeat;background-size:contain;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.hwx1 a:hover,.hwx1:hover a{background:url(../images/actun.png) no-repeat; background-position:center top; background-repeat:no-repeat;background-size:contain;}
.hwx1:hover{ display:block}



.title{ text-align:center; padding:135px 0 90px 0; float:left; width:100%;}
.title img{ display:block; margin:0 auto;} 
.monav{ display:none}
.mobox{ display:none}
.mobg{ display:none}

.banner_web{ float:left; width:100%;}
.banner_web,
.banner_mobile,
.banner {position: relative; z-index: 1;}
.banner_web img,
.banner_mobile img,
.banner img {width: 100%;}
.banner_mobile {display: none;}
.sp-height{ display:none}
.sp{ display:none}

.main{ float:left; width:100%; margin-top:20px;}
.indexmain{float:left; width:100%; margin-top:20px;}
.mtitle{ padding-top:48px; height:42px;}
.mtitle .sp1{ float:left; color:#606060;font-family:"SF";line-height:26px; text-transform:uppercase;font-style:italic;}
.mtitle .sp1 i{font-size:22px;  font-style:italic; margin-right:5px;font-family:"SFTT";}

.mtitle .sp2{ float:right; line-height:26px;}
.mtitle .sp2 a{ background:url(../images/jiaos.svg) right center no-repeat; padding-right:16px; font-size:20px;font-family:"SFTT"; font-weight:bold}

.list{ height:450px; overflow:hidden;}
.list li{ float:left; width:450px;  margin-right:25px; overflow:hidden; }
.list li img{ height:450px; width:100%;   display:block; object-fit: cover;  }


.list li:nth-child(3){ margin-right:0}
.list li a{ display:block; position:relative;}
.list li h2{ position:absolute; left:0; bottom:0; width:100%; text-align:center; font-size:16px; color:#cfcfcf; z-index:2;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical; overflow:hidden; background:url(../images/mask.png) 0 0 repeat-x;  line-height:100px; padding-top:49px;}

.list li img{transition: all 0.5s;-moz-transition: all 0.5s;-webkit-transition: all 0.5s; -o-transition: all 0.5s;transform: scale(1);-ms-transform: scale(1); -moz-transform: scale(1);-webkit-transform: scale(1); -o-transform: scale(1);}
.list li a:hover img{transform: scale(1.08);-ms-transform: scale(1.08); -moz-transform: scale(1.08);-webkit-transform: scale(1.08); -o-transform: scale(1.08);}


.rel{ position:relative}
.foot{ float:left; width:100%; margin:50px 0; text-align:center}
.foot .m{ margin:0 auto; color:#606060; line-height:28px;}
.foot .l{ position:absolute; left:0; top:0;}
.foot .l img{ margin-right:25px; height:28px;opacity:0.3;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.foot .l img:hover{opacity:1;}
.foot .r { position:absolute; right:0; top:0}
.foot .r a{ display:block;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.foot .r span{ margin-left:20px; float:left; position:relative}
.foot .r .sp1 a{  width:26px; height:25px;background:url(../images/sn1.svg) no-repeat; background-position:center top; background-repeat:no-repeat;background-size:cover;}
.foot .r .sp2 a{  width:27px; height:25px;background:url(../images/wx.svg) no-repeat; background-position:center top; background-repeat:no-repeat;background-size:cover;}
.foot .r .sp3 a{  width:29.5px; height:25px;background:url(../images/sn2.svg) no-repeat; background-position:center top; background-repeat:no-repeat;background-size:cover;}
.foot .r .sp1 a:hover{ background:url(../images/sn11.svg) no-repeat; background-position:center top; background-repeat:no-repeat;background-size:cover;}
.foot .r .sp2 a:hover{ background:url(../images/wx2.svg) no-repeat; background-position:center top; background-repeat:no-repeat;background-size:cover;}
.foot .r .sp3 a:hover{ background:url(../images/sn22.svg) no-repeat; background-position:center top; background-repeat:no-repeat;background-size:cover;}
.wximg2{ position:absolute; z-index:22; left:-62px; bottom:64px; border:1px solid #252525; background:#181818; padding:9px;opacity:0.95; display:none}
.wximg2 img{ width:120px; height:120px; display:block}
.foot .r .sp2 { display:none}
.foot .r .sp2:hover .wximg2{ display:block}


.fwx{ display:none}

.title2{ text-align:center; padding:224px 0 10px 0; float:left; width:100%;}
.title img{ display:block; margin:0 auto;}
.title3{ width:100%; margin:0 auto; text-align:center; line-height:32px; font-size:32px; color:#a1a1a1;display: flex; flex-direction: row;align-items: center;justify-content: center;}
.title3 span{ height:1px; background:#3a3a3a; width:155px; float:left; margin:0 16px;}
.title3 span.sp2{ }

.mnav{ float:left; width:100%; padding:80px 0; text-align:center}
.mnav span{ display:inline-block; font-size:16px; margin:0 48px;}
.mnav span a{ color:#606060}
.mnav span.hover a,.mnav span a:hover{ color:#fff;}

.wrap2{ width:1200px; margin:0 auto; }
.list2 li{ float:left; width:450px; margin-right:25px; overflow:hidden; margin-bottom:25px;}
.list2 li img{ width:100%; height:450px; display:block;object-fit: cover; }
.list2 li:nth-child(3n){ margin-right:0}
.list2 li a{ display:block; position:relative}
.list2 li h2{ position:absolute; left:0; bottom:0; width:100%; text-align:center; font-size:16px; color:#cfcfcf; z-index:2;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical; overflow:hidden; background:url(../images/mask.png) 0 bottom repeat-x;  line-height:100px; padding-top:49px;}


.list2 li img{transition: all 0.5s;-moz-transition: all 0.5s;-webkit-transition: all 0.5s; -o-transition: all 0.5s;transform: scale(1);-ms-transform: scale(1); -moz-transform: scale(1);-webkit-transform: scale(1); -o-transform: scale(1);}
.list2 li a:hover img{transform: scale(1.08);-ms-transform: scale(1.08); -moz-transform: scale(1.08);-webkit-transform: scale(1.08); -o-transform: scale(1.08);}

.pages{ float:left; width:100%; padding:40px 0 0 0; text-align:center}
.pages a{ display:inline-block; width:48px; line-height:48px; margin:0 auto; background:#1a1a1a; color:#606060; font-size:16px; margin:0 10px;}
.pages a.hover,.pages a:hover{ color:#fff}
.pages a.aa{ font-size:20px; font-family:"宋体"}

.worknav{ display:none}

.dett{ float:left; width:100%; padding:130px 0 30px 0; margin-bottom:60px; border-bottom:1px solid #262626}
.dett img{ display:none; margin:0 auto; max-width:100%; margin-bottom:30px;}

.dett h1{ text-align:center; font-size:30px; color:#d9d9d9; margin-bottom:15px;}
.time{font-size:14px; color:#606060; text-align:right}
.decon1{ float:left; width:100%; margin-bottom:60px; display: flex;flex-direction: column;flex-wrap: wrap; height:84px;}


.decontab{ float:left; width:50%; border-left:1px solid #181818;box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;background:#1b1b1b;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical; overflow:hidden;height:42px;}
.detab-1{ font-size:14px; line-height:14px;padding-left:20px; padding-top:20px; color:#888  }
.detab-1 span{width:106px; display:inline-block;}
.decontab2 .detab-1{ padding-top:3px}


.deconmo{ margin-bottom:30px; float:left; width:100%; height:600px;}
.decon2{ float:left; width:100%; overflow:hidden; line-height:32px; font-size:16px; color:#adadad; padding-bottom:30px;}
.decon2 img{ display:block; margin:0 auto; max-width:100%; margin-top:30px;}

.aboutmain{ float:left; width:100%; padding:0 0 0 0;}
/*.aboutmain .wrap{ width:1200px; margin:0 auto}*/    /*原本*/
.aboutmain .wrap{ width:1400px; margin:0 auto}


/*.aboutright{ float:right; width:1000px;}*/
.aboutright{ float:right; width:1316px; padding-top:190px; height:910px;}


.aboutleft{ position:fixed; left:0; z-index:22; top:0; height:100%;  display: flex; flex-direction: column; left:50%;justify-content: center; margin-left:-800px;}
.aboutleft li{line-height:70px; cursor:pointer; }
.aboutleft li a{ color:#606060; font-size:14px; display:block}
.aboutleft li .on{ color:#d9d9d9}
.motitle{ display:none}

.aboutlist2 li{ float:left; width:25%;overflow:hidden}
.aboutlist2 li img{ display:block; width:100%;}
.aboutlist2 li a{ display:block; position:relative; }
.aboutlist2 li .libg{ position:absolute; z-index:2; background:#000;opacity:0.7; height:100%; width:100%; display:none}
.aboutlist2 li .libox{ position:absolute; z-index:3; left:20%; top:28%; display:none}
.aboutlist2 li .libox .p1{ font-size:14px; color:#adadad; font-weight:bold; margin-bottom:15px;}
.aboutlist2 li .libox .p2{ font-size:18px; color:#d9d9d9; font-weight:bold; margin-bottom:30px;}
.aboutlist2 li .libox .line{ width:28px; display:block; height:2px; overflow:hidden; background:#adadad; margin-bottom:30px;}
.aboutlist2 li .libox h2{ font-size:20px; color:#d9d9d9; font-weight:bold; }
.aboutlist2 li .libox h2 i{ font-size:12px; font-family:"SFLI"; color:#adadad; margin-left:15px;vertical-align:bottom}
.aboutlist2 li a:hover .libg,.aboutlist2 li a:hover .libox{ display:block}

.aboutlist2 li a img{transition: all 0.5s;-moz-transition: all 0.5s;-webkit-transition: all 0.5s; -o-transition: all 0.5s;transform: scale(1);-ms-transform: scale(1); -moz-transform: scale(1);-webkit-transform: scale(1); -o-transform: scale(1);}
.aboutlist2 li a:hover img{transform: scale(1.08);-ms-transform: scale(1.08); -moz-transform: scale(1.08);-webkit-transform: scale(1.08); -o-transform: scale(1.08);}
.aboutlist2 li:last-child a:hover img{transform: scale(1);-ms-transform: scale(1); -moz-transform: scale(1);-webkit-transform: scale(1); -o-transform: scale(1);}


.aboutcon1{ float:left; width:100%; line-height:26px; font-size:14px; color:#d9d9d9;}

.aboutconbox{opacity:0.8; line-height:26px;}
.aboutban1{}
.aboutban1 img{ width:100%; float:left; margin-bottom:30px; }

.aboutban2 img{ display:block; width:100%; margin-bottom:20px;}



.agobaidu{ position:absolute; left:37%; top:15%; width:24%; height:16%;  z-index:22}
.agobaidu a{ background:#url(../images/blank.png) repeat; display:block; width:100%; height:100%}

.serlist li{ float:left; width:16.6%; padding-right:20px;box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; margin-bottom:80px; text-align:center }
.serlist li img{ height:64px; margin:0 auto;opacity:1;}


.contact img{ margin-right:7px; vertical-align:middle}
.contact p{ margin-bottom:6px;}


.aboutmain2{ float:left; width:100%; padding:149px 0 100px 0;}
.fanhui{ cursor:pointer; margin-bottom:90px;}
.left{ float:left; width:100%}
.right{ float:right; margin-top:-70px; width:340px;}
.right img{ display:block;width:100%; margin:0 auto;}
.left h1{ font-size:31px; margin-bottom:40px; font-weight:bold; color:#d9d9d9;  }
.left h1 i,.left h2 i{ margin-left:20px;}
.left h2{ font-size:14px; font-weight:bold;color:#d9d9d9}
.leftbox{ margin-top:120px;color:#d9d9d9; line-height:30px; font-size:16px; width:920px; float:left;opacity:0.8;}
.sp-jiao{ display:none}
.aboutmain3{ float:left; width:100%; padding:109px 0 100px 0;}
.fanhui2{ margin-bottom:33px;}
.abouttext{ margin-bottom:40px;}


.aboutlist3 li{ width:450px; margin-bottom:25px; cursor:pointer; margin-right:25px;}
.aboutlist3 li:nth-child(3n){ margin-right:0}
.aboutlist3 li .liboximg{ position:relative; overflow:hidden}
.aboutlist3 li .liboximg img{ width:450px; height:450px; display:block}
.aboutlist3 li .liboximg img{transition: all 0.5s;-moz-transition: all 0.5s;-webkit-transition: all 0.5s; -o-transition: all 0.5s;transform: scale(1);-ms-transform: scale(1); -moz-transform: scale(1);-webkit-transform: scale(1); -o-transform: scale(1);}
.aboutlist3 li:hover .liboximg  img{transform: scale(1.08);-ms-transform: scale(1.08); -moz-transform: scale(1.08);-webkit-transform: scale(1.08); -o-transform: scale(1.08);}

.aboutlist3 li .libg{ position:absolute; z-index:2; background:#000;opacity:0.7; height:100%; width:100%;  display:none;}
.aboutlist3 li .libox{ position:absolute; z-index:3; left:0; width:100%; top:28%; text-align:center; display:none}
.aboutlist3 li .libox .p1{ font-size:30px; color:#d9d9d9; font-weight:bold; margin-bottom:60px;}
.aboutlist3 li .libox .p2{ font-size:22px; font-family:"SFTT"; color:#adadad; font-style:italic; font-weight:bold; margin-bottom:6px;}
.aboutlist3 li .libox .p3{ font-size:14px; font-family:"SFLI"; color:#adadad; font-style:italic; }

.aboutlist3 li:hover .libg,.aboutlist3 li:hover .libox{ display:block}
.aboutcon2{ float:left; width:100%; position:relative}

.aboutlist3{position:relative;display:flex;flex-wrap:wrap;justify-content:flex-star;

	margin-bottom:-1.60584%

}
.aboutcon2 .popin {
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	z-index:100;
	align-items:center;
/*	visibility:hidden;*/
transition:all .5s cubic-bezier(.16, 1.08, .38, .98);
	transition-property:opacity, visibility, transform;
	opacity:1;
	display:none
	
	
	
}



.aboutcon2 .popin .wrapper {

	display:flex;
	align-items:center;
	position:-webkit-sticky;
	position:sticky;
	z-index:1;
	top:150px;
	margin-top:50px;
	margin-bottom:50px
	
}

.aboutcon2 .popin .background {
	background:#000;
	opacity:.85;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%
}



.aboutdivbg{position:fixed; left:0; top:0; width:100%; background:#000; height:100%;opacity:0.7; z-index:22; display:none}

.closebox{ position:absolute; right:30px; top:0; cursor:pointer}
.closebox span{ display:block; width:16px; height:16px; background:url(../images/close.svg) no-repeat;}
.aboutdiv .l{ float:left; padding-left:60px; width:500px; margin-top:30px;}
.aboutdiv .l img{ width:100%}

.aboutdiv .r{ float:left; padding-left:60px; width:583px; font-size:16px; color:#d9d9d9; line-height:30px; margin-top:60px;}
.aboutdiv .r h1{ font-size:42px; font-weight:bold; margin-bottom:30px;}
.aboutdiv .r h2{ font-size:25px; font-family:"SFLI"; color:#606060; font-style:italic; margin-bottom:60px;}
.aboutdiv .r h2 i{ font-weight:bold;font-style:italic; margin-right:10px; font-size:25px;font-family:"SFTT";}
.aboutfoudong{opacity:0.8; color:#d9d9d9}

.sp-box{ display:none}

.deback{ display:none}
.deback2{ display:none}
/*text*/
.b{ font-weight:bold;}
.f8{ font-size:8px;}
.f9{ font-size:9px;}
.f10{ font-size:10px;}
.f11{ font-size:11px;}
.f12{ font-size:12px;}
.f13{ font-size:13px;}
.f14{ font-size:14px;}
.f15{ font-size:15px;}
.f16{ font-size:16px;}
.f18{ font-size:18px;}
.f20{ font-size:20px;}
.f22{ font-size:22px;}
.f24{ font-size:24px;}
.f32{ font-size:32px;}
.f36{ font-size:36px;}
.em{ text-indent:2em;}
.hei{ color:#000;}
.red{ color:#ff0000;}
.Arial{ font-family:"Arial", Helvetica, sans-serif;}
.yahei{ font-family:"\5FAE\8F6F\96C5\9ED1";} 
.tc{ text-align:center}
.tr{ text-align:right}
 

.flex {
	  display: -webkit-box;
	  display: -webkit-flex;
	  display: -ms-flexbox;
	  display: flex;
	}
	
.flex-col {
	  -webkit-box-orient: vertical;
	  -webkit-flex-direction: column;
	  -ms-flex-direction: column;
	  flex-direction: column;
	}
	
	.flex-row {
	  -webkit-box-orient: horizontal;
	  -webkit-flex-direction: row;
	  -ms-flex-direction: row;
	  flex-direction: row;
	}
	
	.flex-1 {
	  -webkit-box-flex: 1;
	  -webkit-flex: 1;
	  -ms-flex: 1;
	  flex: 1;
	}
	
.flex-align-center {
	  -webkit-box-align: center;
	  -webkit-align-items: center;
	  -ms-flex-align: center;
	  align-items: center;
	}
	
.flex-pack-center {
	  -webkit-box-pack: center;
	  -webkit-justify-content: center;
	  -ms-flex-pack: center;
	  justify-content: center;
	}
	
.flex-pack-justify {
	  -webkit-box-pack: justify;
	  -webkit-justify-content: space-between;
	  -ms-flex-pack: justify;
	  justify-content: space-between;
	}
	
.border-box {
	  -moz-box-sizing: border-box;
	  -webkit-box-sizing: border-box;
	  -o-box-sizing: border-box;
	  -ms-box-sizing: border-box;
	  box-sizing: border-box;
	}
	
.flex-text {
	  display: flex;
	  align-items: center;
	  justify-content: center;
	}
	
	/*字体*/
	@font-face {
  font-family: "Hum";
  src: url("hum/Hum521l.ttf");
}

@font-face {
  font-family: "SF";
  src: url("sf/SF-Pro-Text-RegularItalic.otf");
}

@font-face {
  font-family: "SFTT";
  src: url("sf/SF-Pro-Text-HeavyItalic.otf");
}

@font-face {
  font-family: "SFLI";
  src: url("sf/SF-Pro-Text-LightItalic.otf");
}
