@charset "utf-8";
/* 
 * Project Name:沃特塞恩电子
 * Author:默默
 * Date:2019-09-16
 */
@font-face {
  font-family: 'fonts/iconfont';
  src: url('fonts/iconfont.eot');
  src: url('fonts/iconfont.eot?#iefix') format('embedded-opentype'),
  url('fonts/iconfont.woff') format('woff'),
  url('fonts/iconfont.ttf') format('truetype'),
  url('fonts/iconfont.svg#iconfont') format('svg');
}
.iconfont{
  font-family:"iconfont" !important;
  font-size:16px;font-style:normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;
}
@font-face {
  font-family: "PT_Sans_Narrow_Bold";
  src: url("fonts/PT_Sans_Narrow_Bold.woff2") format("woff2"),
       url("fonts/PT_Sans_Narrow_Bold.woff") format("woff"),
       url("fonts/PT_Sans_Narrow_Bold.ttf") format("truetype"),
       url("fonts/PT_Sans_Narrow_Bold.eot") format("embedded-opentype"),
       url("fonts/PT_Sans_Narrow_Bold.svg") format("svg");
}

@font-face {
  font-family: "Helvetica Bold";
  src: url("fonts/Helvetica Bold.woff2") format("woff2"),
       url("fonts/Helvetica Bold.woff") format("woff"),
       url("fonts/Helvetica Bold.ttf") format("truetype"),
       url("fonts/Helvetica Bold.eot") format("embedded-opentype"),
       url("fonts/Helvetica Bold.svg") format("svg");
}
	
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0px; border: 0; font-size: 100%; outline: none; }
html { font-size: 100%; overflow-x: hidden;}
/* always display scrollbars */
body { font: 12px/1.8 "arial", "Microsoft YaHei New","Microsoft Yahei","微软雅黑","Hiragino Sans GB","冬青黑体","Arial","Helvetica","SimHei","黑体","STXihei","华文细黑",sans-serif; margin: 0 auto; color: #000000; background-color: #fff; _background-attachment:fixed; 
_background-image:url(about:blank); overflow-y:visible\9; -webkit-text-size-adjust: 100% !important; overflow: hidden;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
input, select { vertical-align: middle; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
strong { font-weight: bold; }
input { outline: none; padding:0;}
img { border: 0; }
input[type="text"], input[type="button"], input[type="submit"], input[type="reset"] ,select{ -webkit-appearance: none; border-radius: 0;}
textarea { -webkit-appearance: none; border-radius: 0; background:none; outline:none; padding:0; margin:0; border:none;}
::-moz-selection { background: #f7a300; color: #fff; text-shadow: none; }
::selection { background: #f7a300; color: #fff; text-shadow: none; }
a { text-decoration: none; blr: expression(this.onFocus=this.blur()); -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; }
a:link, a:visited { text-decoration: none; color:inherit;}
a:active, a:hover { text-decoration: none; color:inherit;}
.clearfix:before, .clearfix:after { display: table; content: ""; line-height: 0px; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1;}
.fc { text-align: center; }
.fr { text-align: right; }
.l { float: left; display: inline-block; }
.r { float: right; display: inline-block; }
.vt { vertical-align: top; }
.vm { vertical-align: middle; }
.inner { width:1270px; margin: auto;}

.header{ position: fixed; width: 100%; left: 0; top: 0; z-index: 99; transition: 0.5s;}
.header.bg{ background: #111;}
.header.flex,.header.flex1{ background: #111;}
.header.flex .logo,.header.flex1 .logo{ width: 128px; margin-left: 35px; margin-top: 15px;}
.header.flex .navs,.header.flex1 .navs{ margin-top: 0;}
.header.flex .navs >li >a,.header.flex1 .navs >li >a{ padding: 25px 2px;}
.header.flex .headerbtn,.header.flex1 .headerbtn{ margin-top: 26px;}
.header.flex .menuflexs,.header.flex1 .menuflexs{ top: 69px;}

.logo{ display: block; float: left; margin-left: 51px; width: 170px; margin-top: 30px; transition: 0.3s;}
.header-wr{ position: relative; z-index: 10;}
.header-ri{ float: right;}
.navs{ float: left; margin-right: 80px; margin-top: 20px; transition: 0.4s;}
.navs >li{ float: left; padding-right: 38px; position: relative;}
.navs >li:last-child{ padding-right: 0;}
.navs >li >a{ position: relative; display: block; line-height: 1.2; color: #FFFFFF; font-size: 16px; padding: 25px 2px 26px; font-weight: bold;}
.navs >li >a:before{ content: ""; width: 0; height: 6px; background: #E77B2C; position: absolute; right: 0; bottom: 0; transition: 0.4s;}
.navs >li >a:hover:before,.navs >li.current >a:before{ width: 100%; right: auto; left: 0;}
.leval-menu{ padding-top: 55px; padding-bottom: 35px; z-index: 10; float: right; margin-right: 746px;}
.leval-menu li{ margin-bottom: 14px;}
.leval-menu li a{ display: inline-block; line-height: 1.2; color: #FFFFFF; font-size: 16px; font-weight: bold; white-space: nowrap;}
.leval-menu li a:hover{ color: #E77B2C;}
.leval-menu1{ margin-right: 574px;}
.leval-menu12{ margin-right: 0; width:600px;}
.menubtn{transition: 0.4s; display: none; position:relative; margin-right: 5%; margin-top:  20px; z-index: 20; float: right;}
.menubtn span{ display:block; width:24px; height:3px; margin-right: 20px; background:transparent; margin:auto; position:relative; vertical-align: middle; -webkit-transition-duration: .3s,.3s; -moz-transition-duration: .3s,.3s; -ms-transition-duration: .3s,.3s; -o-transition-duration: .3s,.3s; transition-duration: .3s,.3s;-webkit-transition-delay: .3s,0s; -moz-transition-delay: .3s,0s; -ms-transition-delay: .3s,0s; -o-transition-delay: .3s,0s; transition-delay: .3s,0s;}
.menubtn span:after,
.menubtn span:before { content: ""; position: absolute; display: inline-block; width: 24px; height: 3px; left: 0;
 background: #E77B2C; -webkit-transition-duration: .3s,.3s; -moz-transition-duration: .3s,.3s; -ms-transition-duration: .3s,.3s;-o-transition-duration: .3s,.3s; transition-duration: .3s,.3s;-webkit-transition-delay: .3s,0s;-moz-transition-delay: .3s,0s;-ms-transition-delay: .3s,0s;-o-transition-delay: .3s,0s; transition-delay: .3s,0s}
.menubtn span:before {top: -7px;-webkit-transition-property: top,transform;-moz-transition-property: top,transform;-ms-transition-property: top,transform;-o-transition-property: top,transform;transition-property: top,transform;}
.menubtn span:after { width: 14px; bottom: -7px;-webkit-transition-property: bottom,transform;-moz-transition-property: bottom,transform;-ms-transition-property: bottom,transform;-o-transition-property: bottom,transform;
transition-property: bottom,transform;}
.menubtn.active span {background: transparent;-webkit-transition-delay: 0s,0s;-moz-transition-delay: 0s,0s;-ms-transition-delay: 0s,0s;-o-transition-delay: 0s,0s;transition-delay: 0s,0s}
.menubtn.active span:after,.menubtn.active span:before {-webkit-transition-delay: 0s,.3s;-moz-transition-delay: 0s,.3s; -ms-transition-delay: 0s,.3s; -o-transition-delay: 0s,.3s; transition-delay: 0s,.3s}
.menubtn.active span:before {top: 0px;-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-ms-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg)}
.menubtn.active span:after {bottom:0px;-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-ms-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg); width: 24px;}
.iphnetel{ float: right; margin-right: 24px; display: none; margin-top: 12px;}
.iphnetel a{ display: block; font-size: 20px; color: #E77B2C; line-height: 1;}

.headerbtn{ float: left; margin-top: 46px; margin-right: 55px; transition: 0.4s;}
.headerbtn a{ display: block; float: left; line-height: 1;}
.headerbtn a.langular{ color: #fff; font-size: 16px; font-weight: bold; margin-right: 32px; margin-top: 4px;}
.headerbtn a.searchbtn{ font-size: 20px; color: #fff;}
.headerbtn a:hover{ color: #E77B2C;}
.searchbox{ width: 100%; position: absolute; left: 0; top: 100%; background: #000; filter:alpha(opacity=80); background: rgba(0,0,0,0.8); padding: 28px 0; display: none;}
.search-en{ float: left; margin-left: 67px; margin-top: 10px;}
.search-en h3{ display: block; line-height: 1; color: #E77B2C; font-size: 48px; font-weight: bold; float: left;}
.search-en b{ display: block; color: #E77B2C; font-size: 20px; line-height: 1; float: left; font-weight: normal; margin-left: 24px; margin-top: 15px;}
.searchfix{ float: right; margin-right: 48px;}
.searchfix .text{ padding: 0; margin: 0; border: none; padding-left: 25px; width: 455px; height: 64px; line-height: 64px; color: #E6E6E6; font-size: 14px; background: #fff; filter:alpha(opacity=20); background: rgba(255,255,255,0.2); float: left;}
.searchfix .text::-webkit-input-placeholder{
	color:#E6E6E6;
}
.searchfix .text::-moz-placeholder{  
	color:#E6E6E6;
}
.searchfix .text:-moz-placeholder{   
	color:#E6E6E6;
}
.searchfix .text:-ms-input-placeholder{ 
	color:#E6E6E6;
}
.searchfix .text:focus::-webkit-input-placeholder{ opacity: 0; visibility: hidden;}
.searchfix .sub{ padding: 0; margin: 0; border: 0; width: 110px; height: 64px; text-align: center; line-height: 64px; cursor: pointer; float: left; color: #fff; font-size: 14px; background: #E77B2C; margin-left: 2px; transition: 0.5s;}
.searchfix .sub:hover{ background: #FFB94F;}

.menuflexs{ position: fixed; width: 100%; top: 90px; background: #000; filter:alpha(opacity=80); background: rgba(0,0,0,0.8); z-index: 3; height: 0; overflow: hidden;}
.menuinfo{ overflow: hidden; position: absolute; left: 0; top: 0; width: 100%; opacity: 0; visibility: hidden;}
.menuinfo:first-child{ height: 0 !important;}
.menuinfo.show{ opacity: 1; visibility: visible; transition: 0.8s;}
.menu_en{ float: left; margin-left: 67px; margin-top: 58px; width: 257px;}
.menu_en small{ display: block; color: #E77B2C; font-size: 48px; line-height: 1.3; margin-bottom: 24px; font-weight: bold;}
.menu_en b{ display: block; width: 20px; height: 20px; background: url(../images/add1.png) center no-repeat; transition: 0.4s;} 
.menu_en a:hover b{ transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg);}
.recommend{ float: left; margin-top: 75px; padding-bottom: 75px;}
.recommend li{ float: left; margin-right: 48px; width: 240px; position: relative; overflow: hidden;}
.recommend li a:before{ content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 3; background: #000; opacity: 0.5; filter:alpha(opacity=50); transition: 0.5s;}
.recommend li a{ display: block;}
.recommend li a:after{ content: ""; width: 100%; height: 0; position: absolute; left: 0; bottom: 0; background: url(../images/shabox3.png) center no-repeat; background-size: cover; z-index: 3; transition: 0.5s;}
.recommend li img{ display: block; width: 100%; height: auto; transition: 0.45s; z-index: 5;}
.recommend li span{ display: block; color: #FFFFFF; font-size: 16px; font-weight: bold; line-height: 1.3; position: absolute; left: 16px; right: 16px; bottom: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: 0.38s; z-index: 5;}
.recommend li a:hover img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.recommend li a:hover:before{ opacity: 0; visibility: hidden;}
.recommend li a:hover:after{ height: 100%; bottom: auto; top: 0;}
.recommend1{ float: right; margin-right: 216px;}
.recommend1 li{ margin-right: 0; margin-left: 48px;}
.recommend1 li:first-child{ margin-left: 0;}
.navigate{ width: 100%; position: fixed; left: 0; top: 0; bottom: 0; background: #000000; display: none; height: 0; transition: 1s cubic-bezier(0.77, 0, 0.175, 1); overflow: hidden;}
.navigate.show{ height: 100%;}
.navigate-wr{ position: relative; height: 100vh;}
.navslist{ padding-top: 120px;}
.navslist li{ margin-bottom: 26px; text-align: center;}
.navslist li:last-child{ margin-bottom: 0;}
.navslist li a{ display: inline-block; color: #FFFFFF; font-size: 16px;}
.menubox{ width: 100%; height: 100%; position: absolute; left: 100%; top: 0; box-sizing: border-box; padding-top: 120px; text-align: center; background: #000; overflow: hidden; transition: 0.9s cubic-bezier(0.77, 0, 0.175, 1);}
.menubox.show{ left: 0;}
.menubox span{ display: inline-block; color: #E77B2C; font-size: 16px;}
.menuleval{ margin-top: 38px;}
.menuleval li{ margin-bottom: 24px; text-align: center;}
.menuleval li a{ display: inline-block; color: #fff; font-size: 16px; font-weight: bold;}
.menuen{ position: absolute; right: 32px; bottom: 150px;}
.menuen a{ display: block; color: #fff;}
.menuen a.en{ font-size: 16px; font-weight: bold; font-family: "Helvetica Bold"; margin-bottom: 45px; text-align: center; line-height: 1;}
.menuen a.menusear{ font-size: 20px; line-height: 1; text-align: center;}
.menu-btn{ text-align: center; width: 100%; position: absolute; left: 0; bottom: 31px;}
.menu-btn li{ width: 25%; float: left; text-align: center;}
.menu-btn li a{ display: inline-block; color: #fff; font-size: 20px; line-height: 28px;}
.menu-btn li a:hover{ color: #E77B2C;}
.menu-btn li:nth-child(3) a{ font-size: 28px;}

.slick-list { overflow: hidden; width: 100%; height: 100%; }
.slick-track { position: relative; left: 0; top: 0; display: block; zoom: 1; }
.slick-track:before, .slick-track:after { content: ""; display: table; }
.slick-track:after { clear: both;}
.banner-box{ position: relative; z-index: 3;}
.banner{  position: relative; z-index: 2; overflow: hidden;}
.banner .slick-list{ position: relative; z-index: 2;}
.item{ float: left; position: relative;}
.item figure{ display: block; position: relative; line-height: 1; overflow: hidden;}
.item figure img{ position: relative; display: block; width: 100%; height: auto;}
.btext{ position: absolute; left: 16.6666%; top: 44%; margin-top: -143px; z-index: 10;}
.item .btext{ visibility: hidden;}
.item.slick-current .btext{ visibility: visible;}
.btext small{ display: inline-block; color: #E77B2C; font-size: 16px; font-weight: bold; line-height: 1; position: relative; margin-left: -69px; letter-spacing: 22px; padding-right: 116px; font-family: "PT_Sans_Narrow_Bold"; text-transform: uppercase;}
.btext small span{ display: inline-block; opacity: 0; visibility: hidden; transform: translateX(14px); -webkit-transform: translateX(14px); -moz-transform: translateX(14px); transition: 0s;}

.btext small:before{ content: ""; width: 100px; height: 1px; background: #E77B2C; position: absolute; right: 0; top: 50%; transition: 0.45s;}
.btext strong{ display: block; color: #fff; font-size: 56px; line-height: 1.4; margin-top: 36px; margin-bottom: 52px;}
.btext b{ display: inline-block; color: #E77B2C; font-size: 14px; line-height: 1; position: relative; font-weight: normal;}
.btext b:before{ content: ""; width: 0; height: 1px; background: #E77B2C; position: absolute; right: 0; bottom: -3px; transition: 0.4s;}
.btext b:hover:before{ width: 100%; right: auto; left: 0;}
.item .btext strong{ opacity: 0; visibility: hidden; transform: translateY(40px); -webkit-transform: translateY(40px); -moz-transform: translateY(40px); transition: 0s;}
.item .btext b{ opacity: 0; visibility: hidden; transform: translateY(40px); -webkit-transform: translateY(40px); -moz-transform: translateY(40px); transition: 0s;} 

.item.slick-current small span{ opacity: 1; visibility: visible; transform: translateX(0px); -webkit-transform: translateX(0px); -moz-transform: translateX(0px);}
.item.slick-current .btext strong,.item.slick-current .btext b{ opacity: 1; visibility: visible; transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px); transition: 0.65s 0.15s;}
.item.slick-current .btext b{ transition-delay: 0.3s;}


.bline{ position: absolute; right: 12.18%; bottom: 58px; z-index: 10; padding-right: 100px;}
.bline:before{ content: ""; width: 100px; height: 5px; position: absolute; right: 0; top: -2px; background: #E77B2C;}
.bline span{ display: block; width: 625px; height: 1px; background: #E77B2C; filter:alpha(opacity=20); background: rgba(231,123,44,0.2);}
.bline span i{ width: 100px; height: 1px; background: #E77B2C; position: absolute; left: 0; top: 0;}
.videobtn{ width: 72px; height: 72px; border-radius: 50%; position: absolute; right: 12.91%; bottom: 126px; z-index: 10; cursor: pointer;}
.videobtn span{ position: absolute; left: 50%; top: 50%; margin-left: -20px; margin-top: -20px; display: block; width: 40px; height: 40px; border-radius: 50%; background: #E77B2C; background: linear-gradient(180deg,rgba(255,185,79,1) 0%,rgba(231,123,44,1) 100%); opacity: 0.2; filter:alpha(opacity=20);}
.videobtn i{ display: block; width: 12px; height: 16px; background: url(../images/stop.png) center no-repeat; position: absolute; left: 50%; margin-left: -6px; top: 50%; margin-top: -8px; opacity: 1; z-index: 3;}
.videobtn2{ display: none;}

.videobtn:after,.videobtn:before { width:100%; height:100%; content:''; display:block;
-webkit-box-sizing:border-box; box-sizing:border-box; position:absolute; top:0; left:0; border-style:solid; border-color:#E77B2C; border-radius:50%; border-width:1px;-webkit-transition-timing-function:cubic-bezier(.215,.61,.355,1); transition-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transition-property:opacity,-webkit-transform; transition-property:opacity,-webkit-transform; transition-property:transform,opacity; transition-property:transform,opacity,-webkit-transform;}
.videobtn:after { opacity:0; -webkit-transform:scale(.8); transform:scale(.8);}
.videobtn:hover:after,.videobtn:hover:before { -webkit-transition-duration:1.2s;transition-duration:1.2s}
.videobtn:hover:before {opacity:0; -webkit-transform:scale(1.4);transform:scale(1.4);}
.videobtn:hover:after { opacity:1; -webkit-transform:scale(1); transform:scale(1);}
.videobtn.stop i{ background: url(../images/play.png) center no-repeat;}
.mouses{ width: 20px; height: 31px; position: absolute; left: 46px; bottom: 32px; z-index: 10; background: url(../images/mouse.png) center no-repeat;}
.mouses i{ display: block; width: 2px; height: 5px; background: url(../images/moused.png) center no-repeat; position: absolute; left: 50%; margin-left: -1px; top: 7px; animation:moveDownSpot 1000ms infinite; -webkit-animation:moveDownSpot 1000ms infinite; -moz-animation:moveDownSpot 1000ms infinite;}

@keyframes moveDownSpot {
	from{
		opacity: 1;
		top: 5px;
	}
	to{
		opacity: 0;
		top: 15px;
	}
}
.banner .slick-dots{ position: absolute; left: 16.19%; bottom: 38px; z-index: 10;}
.banner .slick-dots li{ cursor: pointer; float: left; margin-right: 10px; width: 48px; height: 48px; position: relative;}
.banner .slick-dots li:after{ content: ""; width: 46px; height: 46px; position: relative; border: 1px solid #E77B2C; border-radius: 50%; position: absolute; left: 50%; top: 50%; margin-left: -24px; margin-top: -24px; opacity: 0; visibility: hidden; transform: scale(0.8); -webkit-transform: scale(0.8); -moz-transform: scale(0.8); transition: 0.4s cubic-bezier(.215,.61,.355,1);}
.banner .slick-dots li:before{ content: ""; width: 70px; height: 70px; border: 1px dashed #E77B2C; border-radius: 50%; position: absolute; left: 50%; top: 50%; margin-left: -36px; margin-top: -36px; opacity: 0; visibility: hidden; transform: scale(0.8); -webkit-transform: scale(0.8); -moz-transform: scale(0.8); transition: 0.4s cubic-bezier(.215,.61,.355,1); animation:rolate 3000ms linear infinite; -webkit-animation:rolate 3000ms linear infinite; -moz-animation:rolate 3000ms linear infinite;}
.banner .slick-dots li span{ padding: 0; margin: 0; border: none; width: 26px; height: 26px; text-align: center; line-height: 26px; border-radius: 50%; position: absolute; left: 50%; top: 50%; margin-left: -13px; margin-top: -13px; color: #fff; font-size: 14px; font-family: "PT_Sans_Narrow_Bold"; z-index: 3;}
.banner .slick-dots li span:before{ content: ""; width: 100%; height: 100%; border-radius: 50%; position: absolute; left: 0; top: 0; background: #FFB94F; filter:alpha(opacity=20); background: rgba(255,185,79,0.2); transition: 0.4s cubic-bezier(.215,.61,.355,1); transform: scale(0); -webkit-transform: scale(0); -moz-transform: scale(0); visibility: hidden;}
.banner .slick-dots li.slick-active span:before{ opacity: 1; visibility: visible; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1);}
.banner .slick-dots li.slick-active:after{ opacity: 1; visibility: visible; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); transition-delay: 0.1s;}
.banner .slick-dots li.slick-active:before{ opacity: 1; visibility: visible; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); transition-delay: 0.2s;}
.video-box{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 5;}
.vidoes{ object-fit: initial; width: 100%; height: 100%; position: absolute; left: 0; top: 0; object-position: 100% 100%; z-index: 2;}

.vbBox{ height: 100%; width:100%; left:0; top:0; display: none; position:absolute; overflow: hidden; background-repeat: no-repeat; background-size: cover; background-position: center center; z-index:5;}
.jwplayer{ opacity:0; height:100% !important;}
.jwlogo{ display: none !important;}
#bsPanel{ background: none !important; padding: 0 !important; border: 1px solid #e6e6e6 !important;}

@keyframes rolate {
	from{
		transform: rotate(0deg);
	}
	to{
		transform: rotate(360deg);
	}
}
.linebox{ display: none;}
.linebox .line{ position: fixed; top: 0; width: 1px; height: 100%; background: #707070; opacity: 0.1; filter:alpha(opacity=10); z-index: 29; pointer-events: none;}
.linebox .line.line1{ left: 16.66%;}
.linebox .line.line2{ left: 33.32%;}
.linebox .line.line3{ left: 49.98%;}
.linebox .line.line4{ left: 66.64%;}
.linebox .line.line5{ left: 83.3%;}

.home-about{ padding: 113px 0 57px; position: relative; z-index: 3; background: #e6e6e6;}
.home-about .aboutbg{ width: 66.64%; background: #111111; opacity: 0.1; filter:alpha(opacity=10); position: absolute; right: 0; top: 83px; bottom: -248px; z-index: -1;}
.about-icon{ width: 50%; position: absolute; height: 113px; right: 0; top: 0; z-index: 4; background: linear-gradient(153deg,rgba(255,185,79,1) 0%,rgba(231,123,44,1) 100%);}
.about-icon small{ display: block; float: right; margin-right: 84px; color: #fff; font-size: 12px; font-family: "PT_Sans_Narrow_Bold"; line-height: 1; margin-top: 50px; position: relative; padding-right: 130px; text-transform: uppercase; letter-spacing: 24px;}
.about-icon small:before{ content: ""; width: 100px; height: 1px; background: #fff; position: absolute; right: 0; top: 50%;}
.aboutleft{ float: left; margin-left: 7.29%;}
.abouten p,.abouten b{ display: block; color: #E77B2C; font-size: 110px; font-family: "PT_Sans_Narrow_Bold"; line-height: 0.84; text-transform: uppercase;}
.abouten b{ color: #FFB94F; font-weight: normal;}
.aboutsys{ margin-top: 36px;}
.aboutsys strong{ display: block; color: #333333; font-size: 32px; line-height: 1; position: relative; padding-left: 23px;}
.aboutsys strong:before{ content: ""; width: 10px; height: 30px; background: #E77B2C; position: absolute; left: 0; top: 50%; margin-top: -15px;}
.solids{ margin-top: 72px;}
.solids small{ display: block; line-height: 1; color: #E77B2C; font-family: "PT_Sans_Narrow_Bold"; text-transform: uppercase; padding-top: 15px; position: relative;}
.solids small i{ display: block; color: #E77B2C; font-weight: normal; font-weight: lighter; font-style: normal; opacity: 0.6;}
.solids small:before{ content: ""; width: 72px; height: 2px; background: #E77B2C; position: absolute; left: -25px; top: 0;}
.solids b{ display: block; line-height: 1; color: #E77B2C; font-size: 18px; margin-top: 22px;}
.about-main{ width: 33.32%; float: right; margin-right: 16.66%; margin-top: 210px;}
.about-text{ position: relative; margin-left: 26%; padding-top: 28px;}
.about-text:before{ content: ""; width: 320px; height: 2px; background: #E77B2C; position: absolute; left: -21px; top: 0;}
.about-text p{ color: #333333; font-size: 16px;}
.about-text span{ display: inline-block; margin-top: 23px; color: #E77B2C; font-size: 14px; position: relative; line-height: 1.4;}
.about-text span:before{ content: ""; width: 0; height: 2px; background: #E77B2C; position: absolute; right: 0; bottom: 0; transition: 0.4s;}
.about-text a:hover span:before{ width: 100%; right: auto; left: 0;}
.about-img{ position: relative; margin-top: 68px; margin-bottom: -96px; z-index: 5; height: 396px;}
.about-img .abouthidd{ display: block; overflow: hidden;}
.about-img img{ display: block; width: 100%; position: relative; z-index: 3; transition: 0.65s;}
.about-img:hover img{ transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05);}
.about-img:before{ content: ""; position: absolute; left: 84px; top: 93px; right: -44px; bottom: -53px; background: url(../images/shabox1.png) left bottom repeat-x;}
.home-product{ padding: 177px 0 115px 7.18%; position: relative; z-index: 2;}
.home-product:before{ content: ""; width: 66.64%; height: 50%; position: absolute; right: 0; bottom: 0; z-index: -1; background: #111; opacity: 0.1; filter:alpha(opacity=10);}
.hometitle{ position: relative; display: block; padding-left: 24px; color: #333333; font-size: 32px; line-height: 1; font-weight: bold;}
.hometitle:before{ content: ""; width: 10px; height: 30px; background: #E77B2C; position: absolute; left: 0; top: 50%; margin-top: -15px;}
.productbox{ margin-top: 28px; padding: 139px 0 32px; background-attachment: fixed; background-position: center; background-size: cover;}
.prolist{ padding-left: 10.2%;}
.prolist li{ float: left; width: 18.75%; padding: 45px 0 32px; margin-left: 1.7%; border-top: 1px solid #E77B2C; text-align: center; position: relative; z-index: 3;}
.prolist li:before{ content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: -1; background: #000000; opacity: 0.3; filter:alpha(opacity=30); transition: 0.68s;}
.prolist li:after{ content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url(../images/shabox2.png) center top no-repeat; background-size: cover; transition: 0.68s; opacity: 0; visibility: hidden;}
.prolist li:first-child{ margin-left: 0;}
.prolist li a{ display: block; position: relative; z-index: 3;}
.prolist li a b{ display: block; line-height: 1; height: 56px; font-weight: normal; text-align: center; font-size: 56px; color: #E77B2C; transition: 0.35s;}
.prolist li a b img{ max-height: 100%;}
.prolist li a strong{ display: block; line-height: 1; text-align: center; color: #fff; font-size: 20px; margin-top: 22px; margin-bottom: 28px;}
.protext{ height: 140px; padding: 0 16px;}
.protext p{ color: #fff; text-align: center; font-size: 14px; line-height: 1.8;}
.prolist li a i{ position: relative; display: block; width: 42px; height: 42px; margin: auto; border: 3px solid #E77B2C; border: 3px solid rgba(231,123,44,0.3); color: #E77B2C; font-size: 16px; text-align: center; line-height: 42px; font-family: "Helvetica Bold"; font-style: normal; border-radius: 50%; transition: 0.4s;}
.prolist li a i:before{ content: ""; width: 48px; height: 48px; position: absolute; left: -3px; top: -3px; border-radius: 50%; background: linear-gradient(180deg,rgba(255,185,79,1) 0%,rgba(231,123,44,1) 100%); z-index: -1; transform: scale(0); -webkit-transform: scale(0); -moz-transform: scale(0); transition: 0.45s; visibility: hidden; opacity: 0;}
.prolist li:nth-child(2n+2){ margin-top: 100px;}
.prolist li:hover:before{ opacity: 0; visibility: hidden;}
.prolist li:hover:after{ opacity: 1; visibility: visible;}
.prolist li:hover b{ transform: translateY(-6px); -webkit-transform: translateY(-6px); -moz-transform: translateY(-6px);}
.prolist li:hover i{ color: #fff;}
.prolist li:hover i:before{ opacity: 1; visibility: visible; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1);}
.promore{ margin-right: 18%; text-align: right; margin-top: 108px;}
.promore a{ display: inline-block; line-height: 1.3; color: #E77B2C; font-size: 14px; position: relative; padding-right: 18px;}
.promore a:before{ content: ""; width: 0; height: 2px; background: #E77B2C; position: absolute; right: 0; bottom: -2px; transition: 0.4s;}
.promore a:after{ content: ">"; color: #E77B2C; font-size: 14px; position: absolute; right: 0; top: 50%; margin-top: -9px;}
.promore a:hover:before{ width: 100%; right: auto; left: 0;} 
.universal{ margin-top: 18px;}
.universal a{ display: inline-block; color: #E77B2C; font-size: 14px; line-height: 20px; padding-left: 30px; position: relative;}
.universal a:before{ content: ""; width: 0; height: 2px; background: #E77B2C; position: absolute; right: 0; bottom: -3px; transition: 0.45s;}
.universal a i{ display: block; width: 20px; height: 20px; position: absolute; left: 0; top: 0; border-radius: 50%; background: #E77B2C url(../images/universal.png) center no-repeat;}
.universal a:hover:before{ width: 100%; right: auto; left: 0;}

.solution{ position: relative; z-index: 2; padding: 101px 0 150px;}
.solution:before{ content: ""; width: 66.64%; height: 100%; position: absolute; right: 0; bottom: 0; z-index: -2; background: #111; opacity: 0.1; filter:alpha(opacity=10);}
.solutebg{ width: 83.3333%; height: 100%; position: absolute; left: 0; top: 0; z-index: -1; background-position: left center; background-repeat: no-repeat; background-size: cover;}
.solute-top{ margin-bottom: 139px;}
.solute-top .hometitle{ float: left; margin-left: 7.29%; color: #fff; margin-top: 8px;}
.solutebox{ width: 33.32%; min-height: 317px; float: right; position: relative; margin-right: 33.3333%;}
.solutebox figure{ display: block; line-height: 1; overflow: hidden; position: relative; z-index: 3; }
.solutebox figure img{ display: block; width: 100%; height: auto; line-height: 0; transition: 0.58s;} 
.solutebox:before{ content: ""; position: absolute; left: 89px; top: 57px; right: -48px; bottom: -57px; background: url(../images/shabox1.png) center bottom repeat-x; z-index: -1;}
.solutefix{ width: 410px; position: absolute; left: -114px; top: 50%; margin-top: -60px; z-index: 10;}
.solutefix strong{ display: block; color: #fff; font-size: 28px; line-height: 1.4; font-weight: normal; margin-bottom: 30px;}
.solutefix span{ display: inline-block; line-height: 1.3; color: #E77B2C; position: relative;}
.solutefix span:before{ content: ""; width: 0; height: 2px; background: #E77B2C; position: absolute; right: 0; bottom: -2px; transition: 0.4s;}
.solutebox:hover .solutefix span:before{ width: 100%; right: auto; left: 0;}
.solutebox:hover figure img{ transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05);}
.solute-list{ position: relative;}
.solute-list:before{ content: ""; width:  56px; height: 2px; background: #E77B2C; position: absolute; left: 8.333%; margin-left: -28px; top: 38px;}
.solute-list li{ width: 16.66%; float: left;}
.solute-list li:first-child{ margin-left: 16.66%;}
.solute-list li b{ position: relative; display: block; width: 62px; height: 62px; border: 1px solid #E77B2C; font-weight: normal; text-align: center; margin-bottom: 15px; transition: 0.4s; top: 0;}
.solute-list li b img{ display: block; max-width: 100%; max-height: 100%; position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; transition: 0.35s;}
.solute-list li p{ color: #fff; font-size: 14px; height: 52px; margin-bottom: 10px; width: 190px; max-width: 100%; overflow: hidden; padding-right: 10px; box-sizing: border-box;}
.solute-list li i{ display: inline-block; line-height: 1; color: #E77B2C; font-size: 18px; font-weight: bold; position: relative; left: 0; transition: 0.4s;}
.solute-list li a:hover i{ left: 5px;}
.solute-list li a:hover b{ top: -8px;}
.solute-en{ position: absolute; right: 13.8%; top: 100px; z-index: 5;}
.checkmore{ position: absolute; left: 33.32%; bottom: -50px; z-index: 10; width: 16.66%;}
.checkmore a{ display: block; padding-left: 42.5%; line-height: 100px; height: 100px; position: relative; color: #fff; font-size: 14px; background: linear-gradient(179deg,rgba(255,185,79,1) 0%,rgba(252,177,75,1) 0%,rgba(231,123,44,1) 100%);}
.checkmore a:before{ content: ""; width: 30%; height: 1px; background: #fff; position: absolute; left: 25px; top: 50%;}
.home-news{ padding: 178px 0 29px; position: relative; z-index: 1;}
.home-news:before{  content: ""; display: block; width: 66.64%; height: 100%; position: absolute; right: 0; bottom: 0; z-index: -2; background: #111; opacity: 0.1; filter:alpha(opacity=10);}
.newsleft{ margin-left: 7.29%;}
.newsleft .aboutsys{ margin-top: 8px; float: left;}
.newsleft .solids{ margin-top: 158px;}
.newsbann{ width: 49.98%; float: right; margin-right: 16.66%;}
.newswr{ margin-left: 52px;}
.news-item{ width: 100%; float: left; margin-bottom: 160px;}
.newslist li{ margin-bottom: 28px;}
.newslist li span{ display: block; float: left; line-height: 20px; color: #333; font-size: 16px; max-width: 70%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: 0.35s;}
.newslist li time{ display: block; float: right; line-height: 20px; color: #777; font-size: 14px; padding-right: 24px; position: relative; transition: 0.35s;}
.newslist li time b{ display: block; width: 20px; height: 20px; background: linear-gradient(180deg,rgba(255,185,79,1) 0%,rgba(231,123,44,1) 100%); border-radius: 50%; position: absolute; right: 0; top: 0; opacity: 0; visibility: hidden; transform: scale(0); -webkit-transform: scale(0); -moz-transform: scale(0); transition: 0.42s;}
.newslist li time b:before{ content: ""; width: 6px; height: 6px; background: url(../images/add.png) center no-repeat; position: absolute; left: 50%; top: 50%; margin-left: -3px; margin-top: -3px; opacity: 0; visibility: hidden; transition: 0.4s;}
.newslist li a:hover span{ color: #E77B2C;}
.newslist li a:hover time{ color: #E77B2C;}
.newslist li a:hover time b{ opacity: 1; visibility: visible; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1);}
.newslist li a:hover time b:before{ opacity: 1; visibility: visible; transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); transition-delay: 0.3s;}
.newswr .slick-dots{ height: 6px; line-height: 0;}
.newswr .slick-dots li{ float: left; margin-right: 23px;}
.newswr .slick-dots li button{ display: block; padding: 0; border: 0; border: 0; width: 6px; height: 6px; background: #fff; transition: 0.4s; cursor: pointer; text-indent: 999999px; overflow: hidden; border-radius: 50%; outline: none;}
.newswr .slick-dots li.slick-active button{ background: linear-gradient(180deg,rgba(255,185,79,1) 0%,rgba(231,123,44,1) 100%);}
.news-icon{ top: auto; bottom: -18px;}
.news-icon .newsmore{ display: block; position: absolute; left: 85px; top: 50%; margin-top: -8px; line-height: 1.2; color: #fff; font-size: 14px;}
.news-icon .newsmore:before{ content: ""; width: 100px; height: 1px; background: #fff; position: absolute; left: -120px; top: 50%;}
.footer{ background: #000000;}
.footer-top{ padding: 87px 10% 94px 65px;}
.footer-navs{ float: left;}
.fnav{ float: left; display: block; margin-left: 129px;}
.fnav:first-child{ margin-left: 0;}
.fnav dt{ display: block; font-weight: bold; line-height: 1.2; margin-bottom: 21px;}
.fnav dt a{ display: inline-block; color: #E77B2C; font-size: 14px; font-weight: bold; line-height: 1.2;}
.fnav dd{ display: block;}
.proitems a{ display: inline-block; color: #FFFFFF; font-size: 14px; line-height: 32px;}
.proitems a:hover{ color: #E77B2C;}
.relative{ float: right;}
.address{ width: 243px; float: left; margin-right: 162px;}
.address-item{ display: block; margin-top: 30px;}
.address-item:first-child{ margin-top: 0;}
.address-item dt{ display: block; color: #fff; font-size: 14px; line-height: 1.2; margin-bottom: 8px;}
.address-item dd{ display: block; color: #fff; font-size: 16px; line-height: 1.5;}
.eq{ float: left; width: 120px;}
.eq p{ text-align: center; color: #FFFFFF; font-size: 14px; line-height: 1;} 
.eq img{ max-width: 100%; height: auto; margin-top: 12px; margin-bottom: 14px;}
.eq p.eqcolor{ color: #777777;}
.footer-bott{ padding: 35px 50px 36px 65px; border-top: 1px solid rgba(51,51,51,0.5);} 
.eidtes{ float: left;}
.eidtes p,.eidtes a{ color: #777; line-height: 16px;}
.eidtes a.relativebtn{ display: block; float: left;}
.eidtes p{ margin-right: 37px; float: left;}
.eidtes a:hover{ color: #fff;}
.footer-share{ float: right;}
.share{ margin-right: 230px; float: left;}
.share a{ display: block; line-height: 1; float: left; color: #fff; font-size: 16px; margin-left: 36px;}
.share a:first-child{ margin-left: 0;} 
.share a:hover{ color: #E77B2C;}
.footer-s{ float: right;}
.footer-s a{ display: block; float: left; color: #777777; line-height: 16px; margin-right: 31px;}
.footer-s a:hover{ color: #fff;}
.footer-s span{ display: block; float: right; color: #777777; font-size: 12px; line-height: 16px; cursor: pointer; transition: 0.4s;}
.footer-s span i{ vertical-align: middle; display: inline-block; font-style: normal; color: #777777; width: 16px; height: 16px; background: url(../images/top.png) center no-repeat; margin-left: 10px; position: relative; top: 0; transition: 0.35s;}
.footer-s span:hover{ color: #fff;}
.footer-s span:hover i{ top: -3px; background: url(../images/top1.png) center no-repeat;}
.relativeadd{ display: none; color: #E77B2C; font-size: 16px; line-height: 1; text-transform: uppercase; font-weight: bold; margin-bottom: 26px;}
.relative-bg{ width: 100%; height: 100%; position: fixed; left: 0; top: 0; background: rgba(255,255,255,0.8); z-index: 9999; opacity: 0; visibility: hidden; transition: 0.68s;}
.relative-box{ width: 362px; background: #000000; opacity: 0.9; filter:alpha(opacity=90); position: absolute; left: 60%; margin-left: -181px; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); opacity: 0; visibility: hidden; transition: 0.58s;}
.relative-box span{ display: block; height: 64px; line-height: 64px; text-align: center; color: #FFFFFF; font-size: 18px; font-weight: bold; position: relative; background: linear-gradient(180deg,rgba(255,185,79,1) 0%,rgba(231,123,44,1) 100%);}
.relative-box span i{ display: block; color: #fff; line-height: 1; font-size: 16px; position: absolute; right: 21px; top: 50%; margin-top: -8px; cursor: pointer; transition: 0.4s;}
.relative-box span i:hover{ transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg);}
.relativedown { padding: 36px 0 50px;}
.relativedown li{ margin-top: 15px; text-align: center;}
.relativedown li:first-child{ margin-top: 0;}
.relativedown li a{ display: inline-block; margin: auto; color: #FFFFFF; font-size: 16px;}
.relativedown li a:hover{ color: #E77B2C;}
.relative-bg.show{ opacity: 1; visibility: visible;}
.relative-bg.show .relative-box{ left: 50%; opacity: 1; visibility: visible;}
.solids.article-block{ opacity: 0; visibility: hidden; transform: translateY(50px); -webkit-transform: translateY(50px); -moz-transform: translateY(50px); transition: 0.58s 0.1s;}
.solids.articleShow{ opacity: 1; visibility: visible; transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px);}
.about-text.article-block:before{ width: 0; transition: 0.78s;}
.about-text.articleShow:before{ width: 320px;}
.about-text.article-block p,.about-text.article-block span{ opacity: 0; visibility: hidden; transform: translateY(50px); -webkit-transform: translateY(50px); -moz-transform: translateY(50px); transition: 0.65s 0.25s;}
.about-text.article-block span{ transition-delay: 0.4s;}
.about-text.articleShow p,.about-text.articleShow span{ opacity: 1; visibility: visible; transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px);}

.about-img.article-block:before{ opacity: 0; visibility: hidden; transition: 5s;}
.about-img.article-block a{ height: 0; padding-bottom: 0; transition: 0.98s cubic-bezier(0.77, 0, 0.175, 1);}
.about-img.articleShow:before{ opacity: 1; visibility: visible;}
.about-img.articleShow a{ padding-bottom: 62.5%;}

.prolist.article-block li{ opacity: 0; visibility: hidden; transform: translateY(70px); -webkit-transform: translateY(70px); -moz-transform: translateY(70px); transition: 0.68s;}
.prolist.articleShow li{ opacity: 1; visibility: visible; transform: translateX(0px); -webkit-transform: translateX(0px); -moz-transform: translateX(0px);}
.prolist.article-block li:nth-child(2){ transition-delay: 0.3s;}
.prolist.article-block li:nth-child(3){ transition-delay: 0.6s;}
.prolist.article-block li:nth-child(4){ transition-delay: 0.9s;}

.solutebox.article-block figure{ height: 0; padding-bottom: 0; overflow: hidden; transition: 1s cubic-bezier(0.77, 0, 0.175, 1);}
.solutebox.article-block:before{ opacity: 0; visibility: hidden; transition: 3s;}
.solutebox.articleShow:before{ opacity: 1; visibility: visible;}
.solutebox.articleShow figure{ padding-bottom: 50%;}
.solutebox.article-block .solutefix{ opacity: 0; visibility: hidden; transform: translateX(50px); -webkit-transform: translateX(50px); -moz-transform: translateX(50px); transition: 0.65s 0.35s;}
.solutebox.articleShow .solutefix{ opacity: 1; visibility: visible; transform: translateX(0px); -webkit-transform: translateX(0px); -moz-transform: translateX(0px);}

.solute-list.article-block:before{ width: 0; transition: 0.65s;}
.solute-list.articleShow:before{ width: 56px;}
.solute-list.article-block li{ transform: translateX(50px); -webkit-transform: translateX(50px); -moz-transform: translateX(50px); transition: 0.65s 0.3s; opacity: 0; visibility: hidden;}
.solute-list.article-block li:nth-child(2){ transition-delay: 0.6s;}
.solute-list.article-block li:nth-child(3){ transition-delay: 0.9s;}
.solute-list.article-block li:nth-child(4){ transition-delay: 1.2s;}
.solute-list.articleShow li{ opacity: 1; visibility: visible; transform: translateX(0px); -webkit-transform: translateX(0px); -moz-transform: translateX(0px);}
.checkmore.article-block{ opacity: 0; visibility: hidden; transform: translateX(60px); -webkit-transform: translateX(60px); -moz-transform: translateX(60px); transition: 0.65s;}
.checkmore.articleShow{ opacity: 1; visibility: visible; transform: translateX(0px); -webkit-transform: translateX(0px); -moz-transform: translateX(0px);}
.newswr.article-block{ opacity: 0; visibility: hidden; transition: 0.88s;}
.newswr.articleShow{ opacity: 1; visibility: visible; transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px);}

.sliders{ position: fixed; right: 7px; top: 50%; margin-top: -96px; z-index: 99;}
.sliderli li{ width: 48px; height: 48px; position: relative;}
.sliderli li a{ position: relative; z-index: 3; display: block; line-height: 48px; text-align: center; color: #fff; font-size: 20px; background: #000; filter:alpha(opacity=50); background: rgba(0,0,0,0.5); font-weight: normal;}
.sliderli li a.qq{ font-size: 26px;}
.sliderli li a:before{ content: ""; width: 100%; height: 100%; background: linear-gradient(180deg,rgba(255,185,79,1) 0%,rgba(231,123,44,1) 100%); position: absolute; left: 0; top: 0; z-index: -1; opacity: 0; visibility: hidden; transition: 0.44s;}
.sliderli li:hover a:before{ opacity: 1; visibility: visible;}
.sliderli li:hover .tels{ opacity: 1; visibility: visible; transform: translateX(0px); -webkit-transform: translateX(0px); -moz-transform: translateX(0px);}
.tels{ position: absolute; right: 100%; top: 0; height: 48px; padding-right: 14px; opacity: 0; visibility: hidden; transform: translateX(-14px); -webkit-transform: translateX(-14px); -moz-transform: translateX(-14px); transition: 0.4s;}
.tels:before{ content: ""; width:0; height:0; border-top:5px solid transparent;  border-bottom: 5px solid transparent; border-left: 8px solid #FFB94F; position:absolute; right: 6px; top:50%; margin-top: -5px; transition: 0.36s;}
.tels span{ display: block; background: linear-gradient(180deg,rgba(255,185,79,1) 0%,rgba(231,123,44,1) 100%); line-height: 48px; color: #fff; font-size: 16px; padding: 0 20px;}

.pbanner{ position: relative;}
.pimg{ line-height: 1; height: 0; overflow: hidden; padding-bottom: 36.458%;}
.pimg img{ display: block; width: 100%; height: auto;}
.ptexts{ position: absolute; left: 50%; margin-left: -635px; top: 50%; margin-top: -122px;}
.btextwr{ float: left; max-width: 100%;}
.btextwr strong{ display: block; font-size: 40px; line-height: 1; font-weight: bold; margin-bottom: 34px;}
.ptextbox{ margin-bottom: 50px; width: 640px; max-width: 100%;}
.btextwr p{ color: #FFFFFF; font-size: 16px;}
.btextwr b{ position: relative; display: inline-block; margin-top: 0 !important; color: #E77B2C; font-size: 14px; padding-right: 15px; cursor: pointer; font-weight: normal;}
.btextwr b:after{ content: ""; width: 0; height: 2px; background: #E77B2C; position: absolute; right: 0; bottom: 0; transition: 0.48s;}
.btextwr b:before{ content: ""; width: 9px; height: 6px; background: url(../images/arrow1.png) center no-repeat; position: absolute; right: 0; top: 6px; transition: 0.35s; animation:gomove 1s infinite forwards;}
.btextwr b:hover:after{ width: 100%; right: auto; left: 0;}
.btextwr b:hover:before{ margin-top: -1px;}
.bsmall{ float: right; margin-top: 200px;}
.bsmall small{ display: block; padding-right: 80px; position: relative; color: #D6D6D6; line-height: 1; text-transform: uppercase; font-family: "PT_Sans_Narrow_Bold"; letter-spacing: 20px;}
.bsmall small:before{ content: ""; width: 100px; height: 1px; background: #E77B2C; position: absolute; right: -47px; top: 50%;}
.menusbox{ width: 100%; position: absolute; left: 0; bottom: 0; line-height: 0; background: #000; filter:alpha(opacity=20); background: rgba(0,0,0,0.2); text-align: center;}
.menusbox.flexs{ position: fixed; bottom: auto; top: 69px; background: #fff; filter:alpha(opacity=80); background: rgba(255,255,255,0.8); border-bottom: 1px solid #E6E6E6; z-index: 49;}
.menusbox.flexs .menuwr li a{ height: 48px; line-height: 48px; color: #333;}
.menusbox.flexs .menuwr:before{ opacity: 0; visibility: hidden;}
.menuwr{ position: relative;}
.menuwr:before{ content: ""; width: 4px; height: 64px; background:#E77B2C; position: absolute; left: 0; top: 0; z-index: 5; transition: 0s;}
.menuwr li{ float: left;}
.menuwr li a{ display: block; line-height: 64px; height: 64px; width: 130px; text-align: center; color: #FFFFFF; font-size: 14px; position: relative; z-index: 3;}
.menuwr li a:before{ content: ""; width: 100%; height: 100%; background: linear-gradient(124deg,rgba(255,185,79,1) 0%,rgba(231,123,44,1) 100%); position: absolute; left: 0; bottom: 0; z-index: -1; height: 0; transition: 0.54s;}
.menuwr li:hover a:before,.menuwr li.active a:before{ height: 100%; bottom: auto; top: 0;}
.posites{ position: absolute; right: 75px; bottom: 80px;}
.posites a{ display: block; float: left; line-height: 1.5; color: #FFFFFF; font-size: 14px;} 
.posites a i{ display: inline-block; color: #fff; font-size: 12px; margin-right: 8px; font-style: normal;}
.posites a:hover{ color: #FFB94F;}
.posites b{ display: block; float: left; color: #fff; font-size: 14px; line-height: 1.5; margin: 0 8px; font-weight: normal;}
.field{ width: 695px; margin: auto; max-width: 90%; padding: 142px 0 105px;}
.field strong{ display: block; color: #333333; font-size: 24px; line-height: 1.3; margin-bottom: 52px;}
.filed-text{/* margin-left: 49px; */}
.filed-info{ display: flex; display: -webkit-flex;}
.filed-info span{ display: block; float: left; color: #E77B2C; font-size: 30px; font-family: arial; font-weight: bold; font-style: italic; margin-right: 15px; text-transform: uppercase; line-height: 40px; min-width: 20px; text-align: center;}
.filed-info p{ color: #666666; font-size: 16px; float: left; line-height: 40px;}
.abouts{ padding-bottom: 0; position: relative; z-index: 2;}
.about-video{ width: 49.94%; position: relative; margin-right: -10%; float: left;}
.about-video figure{ line-height: 1; overflow: hidden;}
.about-video figure img{ display: block; width: 100%; height: auto;}
.aboutbtn{ width: 56px; height: 56px; right: 50%; margin-right: -28px; bottom: 50%; margin-bottom: -28px;} 
.aboutbtn i{ background: url(../images/play.png) center no-repeat;}
.aboutes{ width: 57.72%; float: right; background: #fff; position: relative; z-index: 3; margin-top: 138px;}
.aboutwr{ padding: 60px 50px 94px;}
.aboutwr small{ display: block; line-height: 1; color: #E77B2C; font-size: 40px; font-family: "PT_Sans_Narrow_Bold"; margin-bottom: 20px;}
.aboute p{ color: #707070; font-size: 16px; text-align: justify; line-height: 2;}
.aboute i{ display: block; color: #707070; font-size: 16px; line-height: 2; font-style: normal; transition: 0.34s;} 
.aboute i.hide{ text-indent: 99999px; height: 0;}
.aboutwr span{ display: inline-block; margin-top: 42px; color: #E77B2C; font-size: 14px; position: relative; padding-right: 16px; cursor: pointer;}
.aboutwr span:after{ content: ""; width: 0; height: 2px; background: #E77B2C; position: absolute; right: 0; bottom: 0; transition: 0.48s;}
.aboutwr span:before{ content: ""; width: 9px; height: 6px; background: url(../images/arrow1.png) center no-repeat; position: absolute; right: 0; top: 50%; margin-top: -3px;}
.abouthide{ display: none;}
.viewsd .bsharebox{ float: right; line-height: 1.8 !important;} 
@-webkit-keyframes gomove {
  0% {
    -webkit-transform: translateY(0px);
  }
  50% {
    -webkit-transform: translateY(6px);
  }
  100% {
    -webkit-transform: translateY(0px);
  }
}
@keyframes gomove {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(6px);
  }
  100% {
    transform: translateY(0px);
  }
}

.popUpblack{ background:#000\9; filter:alpha(opacity=80); background:rgba(0,0,0,0.8); width: 100%; height: 100%; position: fixed; left: 0px; top: 0px; z-index: 1010; display: none;}
.popUp { width: 220px; border: 2px solid #E77B2C; background: #fff; position: fixed; left: 50%; top: 50%; margin: -87px 0 0 -115px; z-index: 1004; }
.popUp .t { padding: 0 0 0 10px; height: 26px; line-height: 26px; color: #666; font-weight: bold; border-bottom: 1px solid #e8e8e8; background: #f2f2f2; }
.popUp .t .close{ padding: 0 10px 0 0; float: right; cursor: pointer; color: #666; font-weight: normal;}
.popUp .img { padding: 20px; }
.popUp .img img { width: 100%; display: block;}

.aboutwr span:hover:after{ width: 100%; right: auto; left: 0;}
.about-speed{ padding-bottom: 250px;}
.speedwr{ position: relative; padding: 64px 14%;}
.speedwr:before{ content: ""; width: 72px; height: 6px; background: #E77B2C; position: absolute; left: 0; top: 65px;}
.speedwr strong{ display: block; color: #333333; font-size: 32px; font-weight: bold; line-height: 1.5;}
.speedwr i{ display: block; line-height: 1; color: #E77B2C; font-weight: bold; font-size: 56px; position: absolute; font-style: normal; font-family: "PT_Sans_Narrow_Bold";}
.speedwr i.symbol1{ left: 98px; top: 0;}
.speedwr i.symbol2{ right: 0; bottom: 0;}
.area{ padding-bottom: 134px; background-position: center; background-size: cover;}
.area-wr{ position: relative;}
.area-bann{  width: 1034px; max-width: 100%; position: relative; float: right; margin-top: -95px; z-index: 2;}
.area-item{ position: relative; float: left; width: 100%;}
.area-item figure{ display: block; width: 69.82%; line-height: 1; float: right; overflow: hidden; position: relative; z-index: 2;}
.area-item figure img{ display: block; width: 100%; height: auto;}
.area-item p{ display: block; line-height: 1; color: #FFFFFF; font-size: 20px; padding-top: 40px; position: absolute; left: 0; bottom: 68px;}
.area-item p span{ display: inline-block; opacity: 0; visibility: hidden; transform: translateX(15px); -webkit-transform: translateX(15px); -moz-transform: translateX(15px);}
.area-item.slick-current p span{ opacity: 1; visibility: visible; transform: translateX(0px); -webkit-transform: translateX(0px); -moz-transform: translateX(0px);}
.area-item p:before{ content: ""; width: 323px; height: 6px; background: #E77B2C; position: absolute; left: 0; top: 0; z-index: 10; width: 0;}
.area-item.slick-current p:before{ width: 323px; transition: 0.65s;}
.areabtn{ position: absolute; right: 0; bottom: 0; z-index: 11;}
.areabtn span{ display: block; width: 56px; height: 56px; z-index: 10; line-height: 56px; float: left; color: #fff; font-size: 16px; background:#E77B2C; text-align: center; cursor: pointer; transition: 0.4s; position: relative; z-index: 10;}
.areabtn span.next{ background: #FFB94F;}
.areabtn span:before{ content: ""; width: 100%; height: 100%; background: linear-gradient(180deg,rgba(255,185,79,1) 0%,rgba(231,123,44,1) 100%); position: absolute; left: 0; top: 0; z-index: -1; opacity: 0; visibility: hidden; transition: 0.45s;}
.areabtn span:hover:before{ opacity: 1; visibility: visible;}
.areabtn span.prev:hover{ text-indent: -3px;}
.areabtn span.next:hover{ text-indent: 3px;}

.aim{ padding: 116px 0 26px;}
.aim-item{ width: 50%; float: left; margin-bottom: 74px;}
.aim-item .aim-left{ width: 68px; height: 68px; border: 2px solid #E77B2C; border-radius: 50%; float: left; text-align: center; line-height: 68px; font-size: 32px; color: #E77B2C;}
.aim-text{ margin-left: 102px; padding-top: 3px;}
.aim-text strong{ display: block; color: #E77B2C; font-size: 16px; font-weight: bold; line-height: 1; margin-bottom: 18px;}
.aim-text p{ color: #333333; font-size: 20px; line-height: 1.3; font-weight: bold; height: 52px; margin-right: 8px;}

.idea{ padding: 115px 0; background-attachment: fixed; background-position: center; background-size: cover;}
.idea-fix{ padding-bottom: 62px; position: relative; float: right; margin-right: 22.9%;}
.idea-fix:before{ content: ""; width: 24px; height: 2px; background: #fff; position: absolute; left: 0; bottom: 0;}
.idea-fix span{ display: block; color: #E77B2C; font-size: 16px; font-weight: bold; line-height: 1; margin-bottom: 32px;}
.idea-fix strong{ color: #fff; font-size: 40px; font-weight: bold; line-height: 1.2;}

.vwrap { display: none; z-index: 1040; width: 100%; position: fixed; left: 0; top: 0; }
.vwrap .videobtg { z-index: 900; position: fixed; width: 100%; height: 100%; left: 0; top: 0; background: #000; opacity: 0.8; filter: alpha(opacity=80); overflow: hidden; }
.vwrap .videobox { z-index: 990; width: 860px; height: 480px; background-color: #fff; position: fixed; left: 50%; top: 50%; margin-top: -240px; margin-left: -430px; }
.vwrap .videobox #videobox { width: 100%; display: inline-block; height: 100%; background: #80abde; }
#videobox_wrapper { height: 100% !important; }
.vwrap .close { z-index: 999; width: 23px; height: 24px; cursor: pointer; position: absolute; top: -28px; right: 0px; font-size: 24px; transition: 0.45s; color: #fff; line-height: 1;}
.vwrap .close:hover{ -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }
#videobox_display_button { background: none no-repeat !important; }
.jwplayer .jwicon:hover { opacity: 1; filter: alpha(opacity=100); }
.jwlogo, .jwclick { display: none !important;}

.btextwr.article-block .ptextbox{ opacity: 0 ;visibility: hidden; position: relative; top: 50px; transition: 0.56s;}
.btextwr.articleShow .ptextbox{ opacity: 1; visibility: visible; top: 0;}
.btextwr.article-block b{ opacity: 0 ;visibility: hidden; position: relative; top: 40px; transition: 0.5s 0.3s;}
.btextwr.articleShow b{ opacity: 1; visibility: visible; top: 0;}
.bsmall.article-block small:before{ width: 0; transition: 0.8s 0.3s;}
.bsmall.articleShow small:before{ width: 100px;}

.history-box{ background: #F5F5F5; padding: 148px 0 200px;}
.history{ position: relative; z-index: 3;}
.history:before{ content: ""; width: 204px; height: 100%; background: url(../images/coursebg.png) left top repeat-y; z-index: -1; position: absolute; left: 69px;}
.historyli{ padding-left: 29px;}
.historyli li{ margin-top: 76px; background: #fff; padding: 34px 24px;}
.historyli li:first-child{ margin-top: 0;}
.htime{ float: left;}
.htime b{ display: block; float: left; width: 32px; height: 32px; text-align: center; line-height: 32px; background: #FFB94F; filter:alpha(opacity=20); background: rgba(255,185,79,0.2); color: #E77B2C; font-size: 18px; border-radius: 50%; font-weight: normal; text-indent: 5px;}
.htime time{ display: block; float: left; color: #E77B2C; font-size: 28px; line-height: 32px; font-family: "PT_Sans_Narrow_Bold"; margin-left: 12px;}
.history-text{ margin-left: 318px;}
.history-text p{ color: #666666; font-size: 16px; line-height: 32px;}
.historyli li.hisortyitem1{ margin-left: 157px;}
.historyli li.hisortyitem2{ margin-left: 49px;}
.historyli li.hisortyitem3{ margin-left: 0;}
.historyli li.hisortyitem4{ margin-left: 99px;}

.honor-box{ padding: 77px 0 80px;}
.honor-btn{ text-align: center; margin-bottom: 96px;}
.honor-btn a{ display: inline-block; margin-left: 52px; line-height: 1; color: #333333; font-size: 24px; font-weight: bold; padding: 0 12px 20px; position: relative;}
.honor-btn:first-child{ margin-left: 0;}
.honor-btn a:before{ content: ""; width: 0; height: 6px; background: #E77B2C; position: absolute; right: 0; bottom: 0; transition: 0.45s;}
.honor-btn a:hover,.honor-btn a.active{ color: #E77B2C;}
.honor-btn a:hover:before,.honor-btn a.active:before{ width: 100%; right: auto; left: 0;}

.honors{ width: calc(100% + 52px); margin-left: -26px;}
.honors li{ width: 25%; float: left; margin-bottom: 80px;}
.honors li figure{ cursor: pointer; display: block; margin: 0 26px; border: 1px solid #E6E6E6; text-align: center;}
.honors li figure a{ display: block; text-align: center; position: relative; overflow: hidden; height: 259px;}
.honors li figure a img{ display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; transition: 0.68s; max-width: 90%; max-height: 90%;}
.honors li figure span{ display: flex; display: -webkit-flex; display: -ms-flexbox; height: 82px; vertical-align: middle; color: #333333; font-size: 14px; text-align: center; line-height: 1.5; padding: 0 8px; justify-content: center; -webkit-justify-content: center; -moz-justify-content: center; align-items: center; -webkit-align-items: center; -moz-align-items: center; transition: 0.5s; position: relative; z-index: 3;}
.honors li figure span:before{ content: ""; width: 100%; height: 100%; position: absolute; left: 0; bottom: 0; z-index: -1; background: linear-gradient(153deg,rgba(255,185,79,1) 0%,rgba(231,123,44,1) 100%); height: 0; transition: 0.56s;}
.honors li figure:hover a img{ transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05);}
.honors li figure:hover span{ color: #fff;}
.honors li figure:hover span:before{ height: 100%; bottom: auto; top: 0;}

.investor{ padding: 140px 0 156px;}
.investors{ width: calc(100% + 20px); margin-left: -1%;}
.investor-item{ float: left; line-height: 0;}
.investor-item a{ display: block; margin-left: 1%; position: relative; float: left; width: 24%; margin-bottom: 1%;}
.investor-item a img{ direction: block; width: 100%; height: auto;}
.investorwr{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 3; background: #E77B2C; height: 0; overflow: hidden; transition: 0.6s cubic-bezier(0.77, 0, 0.175, 1);}
.inverwr{ padding-top: 37px; text-align: center;}
.inverwr strong{ display: block; line-height: 1; color: #fff; font-size: 16px; text-align: center; padding-bottom: 17px; position: relative;}
.inverwr strong:before{ content: ""; width: 4px; height: 12px; background: #fff; position: absolute; left: 50%; margin-left: -2px; bottom: 0;}
.inverwr span{ display: block; text-align: center; line-height: 1; color: #fff; font-size: 14px; margin-top: 23px;}
.investor-item a:hover .investorwr{ height: 100%;}
.investors .slick-dots{ width: 100%; text-align: center; margin-top: 78px; line-height: 0; height: 8px;}
.investors .slick-dots li{  display: inline-block; margin-left: 16px; line-height: 1;}
.investors .slick-dots li:first-child{ margin-left: 0;}
.investors .slick-dots li button{ padding: 0; margin: 0; border: 0; width: 8px; height: 8px; background: #999999; border-radius: 50%; outline: none; text-indent: 99999px; overflow: hidden; cursor: pointer; transition: 0.4s;}
.investors .slick-dots li.slick-active button{ background: #E77B2C;}
.party{ padding: 100px 0 118px; position: relative; z-index: 30;}
.party-list li{ margin-bottom: 24px; background: #F5F5F5;}
.party-img{ width: 50%; float: right; position: relative; overflow: hidden;}
.party-img a{ display: block; position: relative; z-index: 3;}
.party-img img{ display: block; width: 100%; height: auto; transition: 0.65s;}
.party-img:before{ content: ""; width: 100%; height: 100%; background: #E77B2C; opacity: 0.3; filter:alpha(opacity=30); position: absolute; left: 0; top: 0; transition: 0.65s; opacity: 0; visibility: hidden; z-index: 3;}
.partys:after{ content: ""; width: 64px; width: 0; transition: 0.5s; height: 6px; background: #E77B2C; position: absolute; right: -16px; z-index: 5; top: 140px;}
.partys{ width: 50%; float: left; position: relative;}
.partywr{ padding: 38px 16.87% 0 50px;}
.datas{ margin-bottom: 62px;}
.datas b{ display: block; float: left; color: #E77B2C; font-size: 28px; line-height: 1; font-family: "PT_Sans_Narrow_Bold"; margin-right: 10px; transition: 0.4s;}
.datas time{ display: block; float: left; color: #E77B2C; font-size: 14px; line-height: 1; margin-top: 3px; transition: 0.4s;}
.partytext strong{ display: block; color: #111111; font-size: 24px; line-height: 1.5; font-weight: normal; height: 72px; overflow: hidden; margin-bottom: 92px; transition: 0.4s;}
.partytext span{ display: inline-block; color: #E77B2C; font-size: 14px; line-height: 1;}
.party-list li:hover .party-img img{ transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05);}
.party-list li:hover .party-img:before{ opacity: 0.3; visibility: visible;}
.party-list li:hover .partys:after{ width: 64px;}
.party-list li:hover .datas b{ color: #999999;}
.party-list li:hover .datas time{ color: #999999;}
.party-list li:hover .partytext strong{ color: #E77B2C;}
.party-list{ padding-bottom: 74px;}

.pages a{ display: block; float: left; width: 40px; height: 40px; text-align: center; line-height: 40px; color: #FFFFFF; font-size: 14px; font-family: "PT_Sans_Narrow_Bold"; background: #999999; margin-right: 20px;}
.pages .text{ padding: 0; border: 0; outline: none; width: 100px; height: 40px; line-height: 40px; text-align: center; color: #999; background: #F5F5F5; float: left; margin-left: 34px;}
.pages .text:focus::-webkit-input-placeholder{ opacity: 0; visibility: hidden;}
.pages a.last{ width: 100px;}
.pages a:hover,.pages a.active{ background: #E77B2C;}

.recuites{ padding: 102px 0 72px;}
.recuite-top{ margin-bottom: 60px;}
.recuite-top strong{ display: block; color: #333333; font-size: 32px; line-height: 1.2; font-weight: bold; margin-bottom: 26px;}
.recuite-top p{ color: #666666; font-size: 16px; line-height: 2;}
.platform span{ display: block; float: left; color: #111111; font-size: 16px; line-height: 49px; margin-right: 36px;}
.platformli{ float: left;}
.platformli li{ float: left; margin-right: 47px;}
.platformli li img{ display: block; position: relative; top: 0; width: 116px; height: auto; transition: 0.48s;}
.platformli li a:hover img{ top: -6px;}

.job{ padding-bottom: 168px;}
.joblist li{ position: relative;}
.job-top{ transition: 0.5s; background: #fff; position: relative;}
.job-top:before{ content: ""; width: 100%; height: 0; background: #E77B2C; position: absolute; left: 0; bottom: 0; transition: 0.65s;}
.jobwr{ position: relative; height: 108px; cursor: pointer;}
.jobwr:before{ content: ""; width: 100%; height: 1px; background: #E6E6E6; position: absolute; left: 0; bottom: 0; transition: 0.3s;}
.jobwr span{ display: block; color: #333333; font-size: 16px; line-height: 21px; margin-left: 27px; padding-left: 34px; position: relative; top: 44px; transition: 0.35s;}
.jobwr span i{ display: block; line-height: 1; color: #E77B2C; font-size: 16px; font-style: normal; position: absolute; left: 0; top: 50%; margin-top: -8px; transition: 0.35s;}
.jobwr b{ display: block; position: absolute; right: 90px; top: 50%; margin-top: -8px; line-height: 1; font-size: 16px; color: #999999; transition: 0.35s;}
.jobwr b.hide{ color: #fff; opacity: 0; visibility: hidden;}
.jobbox{ padding: 68px 0 75px; border-bottom: 1px solid #E6E6E6; display: none;}
.jobbox .job-need,.jobbox .jobdown{ width: 900px; max-width: 90%; margin: auto;}
.job-need p,.job-need strong{ color: #333333; font-size: 14px;}
.job-need strong{ display: block; font-weight: bold;}
.jobbox .jobdown{ margin-top: 42px;}
.jobdown p{ color: #E77B2C; font-size: 12px; line-height: 2;}
.job-top:hover:before,.job-top.active:before{ height: 100%; bottom: auto; top: 0;}
.job-top:hover .jobwr:before,.job-top.active .jobwr:before{ visibility: hidden; opacity: 0;}
.job-top:hover .jobwr span,.job-top.active .jobwr span{ color: #fff;}
.job-top:hover .jobwr span i,.job-top.active .jobwr span i{ color: #fff;}
.job-top:hover .jobwr b,.job-top.active .jobwr b{ color: #fff;}
.job-top.active .jobwr b.show{ opacity: 0; visibility: hidden;}
.job-top.active .jobwr b.hide{ opacity: 1; visibility: visible;}
.posites1{ bottom: 24px;}

.products{ background: #E6E6E6; position: relative; padding: 118px 0 70px;}
.promenu{ position: absolute; left: 0; top: 118px; z-index: 10;}
.promenu.flex{ position: fixed;}
.promenu.flex1 .pmenus li a{ color: #fff;}
.promenu.flex1 .pmenus li.active a,.promenu.flex1 .pmenus li:hover a{ color: #E77B2C;}
.pmenus li{ margin-bottom: 10px;}
.pmenus li a{ display: inline-block; padding-left: 24px; position: relative; line-height: 32px; color: #333333; font-size: 14px;}
.pmenus li a:before{ content: ""; width: 8px; height: 32px; background: #E77B2C; position: absolute; left: 0; bottom: 0; transition: 0.45s; height: 0;}
.pmenus li.active a,.pmenus li:hover a{ color: #E77B2C;}
.pmenus li.active a:before{ height: 32px; bottom: auto; top: 0;}
.productlist li{ margin-bottom: 75px; background: #fff; position: relative; box-shadow: 0 3px 12px rgba(0,0,0,0.2); z-index: 3;}
.productlist li:before{ content: ""; display: block; width: 100%; height: 0; background: #E77B2C; position: absolute; left: 0; bottom: 0; transition: 0.68s; z-index: -1;}
.productlist li:hover:before{ height: 100%; bottom: auto; top: 0;}
.productlist li:hover .proimg img{ transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05);}
.productlist li:hover .protexts span{ color: #fff;}
.productlist li:hover .protexts strong{ color: #fff;}
.productlist li:hover .protexts p{ color: #fff;}
.productlist li:hover .protexts b{ color: #fff;}

.productlist li{ padding: 53px 0 56px 60px; position: relative;}
.protexts{ width: 58.77%; float: left;}
.protexts span{ display: block; color: #E77B2C; font-size: 14px; margin-bottom: 12px; line-height: 1; transition: 0.38s;}
.protexts strong{ display: block; color: #333333; font-size: 24px; line-height: 1.2; font-weight: bold; margin-bottom: 16px; transition: 0.35s;}
.protexts p{ color: #707070; font-size: 16px; margin-bottom: 46px; height: 56px; overflow: hidden; transition: 0.35s;}
.protexts b{ display: inline-block; color: #E77B2C; font-size: 14px; line-height: 1; font-weight: normal; transition: 0.35s;}
.proimg{ position: absolute; right: 50px; top: 0; height: 100%; width: 300px; text-align: center;}
.proimg img{ display: block; max-width: 100%; max-height: 100%; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; height: auto; transition: 0.65s;}

.features{ padding: 79px 0 92px; background-attachment: fixed; background-position: center; background-size: cover;}
.featutt{ color: #E77B2C; font-size: 24px; line-height: 1; font-weight: bold; margin-bottom: 52px;}
.prolist1{ margin-top: 54px; padding-left: 0;}
.prolist1 li{ width: 23.6%; margin-top: 0 !important; margin-left: 1.8666%; margin-right: 0;}
.prolist1 li:first-child{ margin-left: 0;}
.prolist1 li a strong{ color: #E77B2C;}
.prolist1 li:before{ background: linear-gradient(180deg,rgba(255,185,79,1) 0%,rgba(231,123,44,0.12) 100%); opacity: 0.1;}
.notes{ margin-top: 48px;}
.notes p{ color: #999999; font-size: 12px; line-height: 2; font-weight: lighter;}

.ptop1{ height: 124px;}
.proposite{ border-bottom: 1px solid #E6E6E6; position: fixed; background: #ffff; width: 100%; left: 0; top: 69px; z-index: 29;}
.porbtn a{ display: block; float: left; line-height:  54px; height: 54px; color: #666666; font-size: 14px; margin-right: 36px; position: relative;}
.porbtn a:before{ content: ""; width: 0; height: 6px; background: #E77B2C; position: absolute; right: 50%; margin-right: 0; bottom: 0; transition: 0.4s;}
.porbtn a:hover,.porbtn li.active a{ color: #E77B2C;}
.porbtn a:hover:before,.porbtn li.active a:before{ width: 72px; margin-right: -36px;}
.proposite .posites{ position: absolute; right: 33px; bottom: 18px;}
.posites a,.posites a i{ color: #999999;}
.posites b{ color: #999;}
.posites a:hover{ color: #E77B2C;}
.product-view{ margin-top: 64px; position: relative;}
.viewbann{ width: 50%; float: left; position: relative; box-shadow:0 0 4px rgba(0,0,0,0.16);}
.items{ width: 100%; float: left; position: relative; text-align: center;}
.items img{ display: block; width: 100%; height: auto;}
.viewbann .slick-dots{ line-height: 0; position: absolute; right: 35px; bottom: 31px; z-index: 10; height: 8px;}
.viewbann .slick-dots li{ float: left; margin-left: 16px; line-height: 1;}
.viewbann .slick-dots li button{ padding: 0; border: 0; margin: 0; width: 8px; height: 8px; border-radius: 50%; background: #999999; transition: 0.35s; text-indent: 99999px; overflow: hidden; outline: none; cursor: pointer;}
.viewbann .slick-dots li.slick-active button{ background:#E77B2C;}
.views{ width: 46%; float: right; position: absolute; right: 0; top: 0; height: 100%;}
.views-top strong{ display: block; color: #E77B2C; font-size: 24px; line-height: 1.2; margin-bottom: 22px;}
.views-top p{ color: #707070; font-size: 14px; line-height: 2;}
.viewsd{ position: absolute; left: 0; bottom: 25px; width: 100%;}
.viewsd .commbtn{ display: block; float: left; color: #666666 !important; font-size: 14px; position: relative;}
.viewsd .commbtn i{ display: inline-block; color: #E77B2C; font-size: 18px; font-style: normal; margin-right: 8px; vertical-align: middle; position: relative; top: -2px;}
.viewsd .commbtn:hover{ color: #E77B2C !important;}
.viewsd .fr{ float: right; margin-left: 34px;}
.bshare-custom #bshare-more-icon{ padding: 0!important; background: none !important;}

.viewsin{ border-top: 1px solid #E6E6E6;}
.viewsfix{ width: 1000px; margin: auto; max-width: 90%; padding-bottom: 70px;}
.parameter{ padding: 62px 0 80px;}
.paramett{ display: block; color: #333333; font-size: 24px; line-height: 1.2; margin-bottom: 26px;}

.patable{ width: 100%; border-collapse:collapse; border-spacing:0;}
.patable thead tr th{ background: #FE8401; height: 40px; color: #FFFFFF; font-size: 14px;}
.patable thead tr th.span1{ padding-left: 24px; width: 55.3%; text-align: left;}
.patable thead tr th.span2,.patable thead tr th.span3,.patable thead tr th.span4{ width: 11.2%; text-align: center;}
.patable tbody td{ color: #333333; font-size: 14px; height: 40px; text-align: center;}
.patable tbody tr{ background:#F5F5F5;}
.patable tbody tr:nth-child(2n+2){ background: #fff;}
.patable tbody tr td.span1{ padding-left: 24px; width: 55.3%; text-align: left;}
.patable tbody tr td.span2,.patable tbody tr td.span3,.patable tbody tr td.span4{ width: 11.2%;}
.parameter-item{ display: block; padding: 38px 0 40px; border-top: 1px solid #D6D6D6;}
.parameter-item dt{ display: block; float: left; color: #333333; font-size: 24px; line-height: 26px; width: 34.5%; font-weight: bold;}
.parameter-item dd{ display: block; margin-left: 34.5%; min-height: 64px;}
.parameter-item dd p{ color: #707070; font-size: 16px; line-height: 2;}
.parameter-item dd p img{ max-width: 100%; width: auto !important; height: auto !important;}
.parameter table{max-width: 100%; margin-left: 0 !important;}

.recommedpro{ padding: 43px 0 72px; background: #F5F5F5; position: relative; z-index: 30;}
.recommtt{ position: relative; color: #333333; font-size: 24px; font-weight: bold; line-height: 1; padding-left: 10px; border-left: 8px solid #E77B2C;}
.recommedli{ margin-top: 16px;}
.recommedli li{ width: 23.4%; float: left; margin-left: 2.1333%; margin-bottom:25px;}
.recommedli li:nth-child(4n+1) { margin-left: 0; }
.recommedli li a{ display: block; position: relative; background: #fff;}
.recommedli li figure{ display: block; position: relative; overflow: hidden; height: 259px; text-align: center;}
.recommedli li figure img{ max-width: 80%; max-height: 80%; display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; transition: 0.65s;}
.recommedli span{ position: relative; height: 56px; color: #333333; font-size: 14px; display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; padding: 0 24px; transition: 0.45s;}
.recommedli span:before{ content: ""; width: 24px; height: 1px; background: #E77B2C; position: absolute; left: 24px; top: 0;}
.recommedli li a:hover figure img{ transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05);}
.recommedli li a:hover span{ background: #E77B2C; color: #fff;}

.solute-box{ padding: 120px 0 150px; background: #F5F5F5;}
.solute-li li{ position: relative; margin-bottom: 56px;}
.solute-li li figure{ display: block; line-height: 1; overflow: hidden; width: 50%;}
.solute-li li figure img{ display: block; width: 100%; height: auto; transition: 0.68s;}
.solute-s{ width: 62.5%; background: #fff; position: absolute; right: 0; bottom: 0; z-index: 5;}
.solute-s:before{ content: ""; width: 72px; height: 6px; background: #E77B2C; position: absolute; left: -28px; top: 51px; transition: 0.38s;}
.solute-s:after{ content: ""; width: 100%; height: 0; position: absolute; left: 0; bottom: 0; transition: 0.68s; background: #E77B2C; z-index: -1;}
.solutewr{ padding: 45px 17.25% 42px 7.75%;}
.solutewr strong{ display: block; color: #111111; line-height: 1.2; font-size: 18px; font-weight: normal; margin-bottom: 20px; transition: 0.34s;}
.solutewr p{ color: #707070; font-size: 14px; text-align: justify; margin-bottom: 24px; height: 75px; overflow: hidden; transition: 0.34s;}
.solutewr span{ display: inline-block; line-height: 1; color: #E77B2C; font-size: 14px; transition: 0.35s;}
.solute-li li:hover figure img{ transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05);}
.solute-li li:hover .solute-s:after{ height: 100%; bottom: auto; top: 0;} 
.solute-li li:hover .solute-s:before{ background: #fff;}
.solute-li li:hover .solutewr strong{ color: #fff;}
.solute-li li:hover .solutewr p,.solute-li li:hover .solutewr span{ color: #fff;}

.pageprev{ width: 120px; background: #fff; position: fixed; left: 0; top: 50%; margin-top: -90px; box-shadow: 0px 3px 12px rgba(0,0,0,0.16); z-index: 59;}
.pageprev a{ height: 60px; display: block; line-height: 60px; color: #333333; font-size: 14px; text-align: center; position: relative; z-index: 3;}
.pageprev a:before{ content: ""; width: 100%; height: 0; background:linear-gradient(180deg,rgba(255,185,79,1) 0%,rgba(231,123,44,1) 100%); position: absolute; left: 0; bottom: 0; z-index: -1; transition: 0.4s;}
.pageprev a i{ display: inline-block; color: #666666; font-size: 18px; font-style: normal; margin-right: 10px; transition: 0.35s; position: relative; top: 2px;}
.pageprev a:hover{ color: #fff;}
.pageprev a:hover i{ color: #fff;}
.pageprev a:hover:before{ height: 100%; bottom: auto; top: 0;}
.soluteshare{ width: auto; bottom: 24px; left: 50%; margin-left: -635px;}

.solutetext{ background: #F5F5F5; padding: 116px 0;}
.solute-tops{ width: 1000px; margin: auto; max-width: 90%;}
.solute-tops p{ color: #707070; font-size: 16px; text-align: justify;}
.solutedown{ width: 1000px; margin: auto; max-width: 90%; padding: 100px 0;}
.solutedown strong{ display: block; color: #E77B2C; font-size: 20px; line-height: 1.3;}
.solutedown p{ color: #707070; font-size: 16px; line-height: 2;}
.solutedown img{ max-width: 100%; width: auto; height: auto;}

.relevant{ background: #F5F5F5; padding: 49px 0 87px;}
.relevant .recommtt{ margin-bottom: 36px;}
.relevants li{ position: relative; margin-bottom: 24px; background: #fff;}
.relatetext{ padding: 38px 0 33px; width: 58.6%; margin-left: 47px;}
.relatetext span{ display: inline-block; color: #111111; font-size: 16px; margin-bottom: 18px; transition: 0.4s;} 
.relatetext span i{ display: inline-block; color: #999999; font-size: 16px; font-style: normal; position: relative; vertical-align: middle; top: -2px; margin-right: 10px; transition: 0.4s;}
.relatetext p{ color: #999999; font-size: 14px; line-height: 2; height: 56px; overflow: hidden;}
.relatetext b{ display: inline-block; color: #E77B2C; font-size: 14px; line-height: 1; margin-top: 16px; font-weight: normal;}
.relevants li figure{ position: absolute; right: 10px; top: 10px; bottom: 10px; width: 240px; text-align: center; overflow: hidden; display: block;}
.relevants li figure img{ height: 100%; width: auto; max-width: 100%; max-height: 100%;}
.relevants li:hover .relatetext span{ color: #E77B2C;}
.relevants li:hover .relatetext span i{ color: #E77B2C;}
.porbtn1{ margin-top: 0; position: relative; top: 0;}
.porbtn1 a{  text-align: center; margin-right: 20px;}
.porbtn1 a:hover:before, .porbtn1 a.active:before{ width: 96px; margin-right: -48px;}

.solutett{ padding: 84px 0 76px; border-bottom: 1px solid #E6E6E6;}
.solutett strong{ display: block; line-height: 1.2; color: #E77B2C; font-size: 48px; font-weight: bold; margin-bottom: 20px;}
.solutett p{ color: #333333; font-size: 18px; width: 800px; max-width: 100%;}
.soluydwon{padding: 58px 0 100px;}
.soluydwon img { max-width:100%;}
.sulteimg { width: 50%; float: right; overflow: hidden; }
.sulteimg img{ display: block; width: 100%; height: auto;}
.solutefixs{ width: 46%; float: left;}
.solutefixs p{ color: #707070; font-size: 16px; text-align: justify; line-height: 2;}

.news-box{ background: #F5F5F5;}
.news{ padding: 120px 0 190px;}
.news-info{ background: #fff; margin-bottom: 73px;}
.news-info figure{ display: block; line-height: 1; width: 43.75%; float: left; overflow: hidden;} 
.news-info figure img{ display: block; width: 100%; height: auto; transition: 0.65s;}
.news-text{ width: 43.75%; float: right; margin-right: 6.25%; padding-top: 38px;}
.news-text time{ display: block; line-height: 1; color: #E77B2C; font-size: 12px; margin-bottom: 13px; font-weight: bold;}
.news-text strong{ display: block; color: #333333; font-size: 24px; line-height: 1.3; font-weight: normal; margin-bottom: 16px; height: 62px; overflow: hidden; transition: 0.35s;}
.news-text p{ color: #707070; font-size: 14px; margin-bottom: 46px; line-height: 2; height: 56px; overflow: hidden;}
.news-text span{ display: inline-block; color: #E77B2C; font-size: 14px; line-height: 1;}
.news-info:hover figure img{ transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05);}
.news-info:hover .news-text strong{ color: #E77B2C;}

.newsli{ padding-bottom: 30px;}
.newsli li{ position: relative; background: #fff; z-index: 3; margin-bottom: 32px;}
.newsli li:before{ content: ""; width: 100%; height: 100%; background: #E77B2C; position: absolute; left: 0; bottom: 0; height: 0; transition: 0.56s; z-index: -1;}
.data{ position: absolute; left: 47px; top: 50%; width: 88px; padding: 26px 0 25px; border: 1px solid #D6D6D6; border-top: 4px solid #E77B2C; margin-top: -50px; transition: 0.5s;}
.data strong{ display: block; text-align: center; color: #999999; font-size: 20px; line-height: 1; font-weight: normal; margin-bottom: 9px; font-family: "PT_Sans_Narrow_Bold"; transition: 0.35s;}
.data b{ display: block; line-height: 1; text-align: center; font-weight: normal; color:#999999; font-size: 14px; font-family: "PT_Sans_Narrow_Bold"; transition: 0.35s;}
.news-t{ padding: 35px 0 32px; margin-left: 23.4%; margin-right: 68px;}
.news-t strong{ display: block; color: #333333; font-size: 18px; line-height: 1.2; font-weight: normal; margin-bottom: 18px; transition: 0.35s; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.news-t p{ color: #707070; font-size: 14px; line-height: 2; margin-bottom: 28px; transition: 0.35s;}
.news-t b{ display: inline-block; font-weight: normal; line-height: 1; color: #E77B2C; font-size: 14px; transition: 0.35s;}
.newsli li:hover:before{ height: 100%; bottom: auto; top: 0;}
.newsli li:hover .data{ border-color: #E77B2C; transition-delay: 0.1s; background: #E77B2C;}
.newsli li:hover .data strong{ color: #fff;}
.newsli li:hover .data b{ color: #fff;}
.newsli li:hover .news-t strong{ color: #fff;}
.newsli li:hover .news-t p{ color: #fff;}
.newsli li:hover .news-t b{ color: #fff;}

.exhibite-box{ background: #F5F5F5;}
.exhibite{ padding: 100px 0 160px;}
.exhibiteli{ text-align: center; margin-bottom: 88px;}
.exhibiteli a{ display: inline-block; margin-left: 48px; width: 120px; line-height: 1; color: #999999; font-size: 28px; font-family: "PT_Sans_Narrow_Bold"; padding-bottom: 9px; border-bottom: 4px solid #999999; text-align: center;}
.exhibiteli a:first-child{ margin-left: 0;}
.exhibiteli a:hover,.exhibiteli a.active{ width: 180px; color: #E77B2C; border-color: #E77B2C;}
.newsd li{ margin-bottom: 40px; background: #fff; position: relative;}
.news-time{ width: 164px; padding-left: 28px; padding-top: 25px; height: 95px; background: #E77B2C; float: left;}
.news-time p{ color: #fff; font-size: 24px; line-height: 1; font-family: "PT_Sans_Narrow_Bold"; margin-bottom: 23px;}
.news-time b{ display: block; line-height: 1; color: #fff; font-size: 16px; font-weight: normal; font-family: "PT_Sans_Narrow_Bold";}
.newste{ margin-left: 193px; background: #fff; padding: 26px 30px 0 33px; position: relative; z-index: 3;}
.newste:before{ content: ""; width: 100%; height:  0; background: #E77B2C; position: absolute; left: 0; bottom: 0; transition: 0.5s; z-index: -1;}
.newste strong{ display: block; color: #333333; font-size: 16px; font-weight: normal; line-height: 1.2; margin-bottom: 22px; transition: 0.35s; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.newsdo p{ float: left; color: #777777; font-size: 14px; line-height:34px; margin-right: 20px; transition: 0.35s;}
.newsdo p i{ display: inline-block; color: #E77B2C; font-size: 16px; font-style: normal; margin-right: 8px; vertical-align: middle; position: relative; top: -1px; transition: 0.35s;}
.newsdo span{ display: block; float: right; color: #E77B2C; font-size: 16px; line-height: 1; font-family: "PT_Sans_Narrow_Bold"; transition: 0.35s; line-height: 34px;}
.newsd li:hover .newste:before{ height: 100%; bottom: auto; top: 0;}
.newsd li:hover .newste strong{ color: #fff;}
.newsd li:hover .newsdo p{ color: #fff;}
.newsd li:hover .newsdo p i{ color: #fff;}
.newsd li:hover .newsdo span{ color: #fff;}
.posinews{ margin-top: 69px; padding-top: 19px;}
.posinews .posites{ float: right; position: relative; margin-right: 40px; bottom: 0; right: 0;}
.news-view{ width: 1000px; max-width: 90%; margin: auto; padding: 100px 0 130px;}
.newstop{ margin-bottom: 60px;}
.newstop strong{ display: block; color: #333333; font-size: 40px; line-height: 1.2; font-weight: normal; height: 108px; margin-bottom: 28px;}
.newslfext p{ float: left; color: #999999; line-height: 1; margin-right: 24px;}
.newslfext span{ display: block; float: left; color: #E77B2C; line-height: 1; margin-right: 24px; font-family: "PT_Sans_Narrow_Bold";}
.newslfext .viewsd{ position: relative; bottom: 0; float: right; width: auto; margin-top: -6px;}
.news-content p,.news-content a{ color: #707070; font-size: 16px; line-height: 2;}
.news-content img{ max-width: 100%;}

.pageb{ padding: 36px 0; border-top: 1px solid #E6E6E6;}
.pagewr{ position: relative;}
.pagein{ float: left;}
.pageitem:first-child{ margin-bottom: 32px;}
.pageitem span{ display: block; float: left; color: #707070; font-size: 14px; margin-right: 27px; transition: 0.35s; line-height: 1.3; }
.pageitem p{ float: left; color: #707070; font-size: 14px; line-height: 1.3; transition: 0.35s;}
.pageitem a:hover span,.pageitem a:hover p{ color: #E77B2C;}
.pagewr .backin{ display: block; position: absolute; right: 0; bottom: 0; line-height: 1.3; color: #E77B2C; font-size: 14px;}
.pagewr .backin:hover{ text-decoration: underline;}
.reads{ padding: 50px 0 84px; background: #F5F5F5;}
.read-list{ margin-top: 38px; padding-left: 20px; border-left: 1px solid #E77B2C;}
.read-list li{ margin-bottom: 16px;}
.read-list li:last-child{ margin-bottom: 0;}
.read-list li p{ line-height: 1.2; float: left; color: #777777; font-size: 14px; transition: 0.35s; width: 80%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.read-list li time{ display: block; float: right; line-height: 1.2; color: #777777; font-size: 14px; transition: 0.35s;}
.read-list li a:hover p{ color: #E77B2C;}
.read-list li a:hover time{ color: #E77B2C;}
.support{ padding: 114px 0;}
.supportli li{ position: relative;}
.supportli li .suppicon{ display: block; width: 70px; height: 70px; border: 1px solid #E77B2C; border-radius: 50%; float: left; text-align: center; line-height: 70px; color: #E77B2C; font-size: 32px; margin-top: 25px; margin-left: 41px; font-weight: normal;}
.supportin{ padding: 27px 0 52px; border-top: 1px solid #D6D6D6; margin-left: 137px;}
.supportin strong{ display: block; line-height: 1.2; color: #333333; font-size: 24px; margin-bottom: 20px; font-weight: normal;}
.supportin p{ color: #707070; font-size: 16px;}
.servih{ margin-top: 20px;}
.servih a{ display: inline-block;}
.servih a i{ display: inline-block; color: #E77B2C; font-size: 24px; font-style: normal; padding-right: 9px; float: left; line-height: 1;}
.servih a span{ float: left; direction: block; border-bottom: 2px solid #E77B2C; font-weight: bold; color: #E77B2C; font-size: 14px; line-height: 1; padding-bottom: 7px; position: relative;}
.supportin .moresd{ display: inline-block; color: #E77B2C; font-size: 16px;}
.supportin .moresd:hover{ text-decoration: underline;}

.problem{ padding: 110px 0 100px;}
.probelm-li li{ margin-bottom: 66px;}
.problem-top{ margin-bottom: 40px; padding-left: 15px; position: relative;}
.problem-top:before{ content: ""; width: 7px; height: 24px; background: #E77B2C; position: absolute; left: 0; top: 50%; margin-top: -12px;}
.problem-top i{ display: block; float: left; color: #E77B2C; font-size: 24px; font-style: normal; margin-right: 20px; line-height: 1;}
.problem-top strong{ display: block; float: left; color: #111111; font-size: 20px; font-weight: normal; line-height: 24px; position: relative; top: -2px; transition: 0.38s;}
.problemdown{ position: relative; margin-top: 40px; margin-left: 25%; padding-right: 42px;}
.problemtext{ background: #F5F5F5; border-radius: 12px; padding: 24px 30px 18px; position: relative; transition: 0.54s;}
.problemtext:before{ content:""; width:0; height:0; border-top:10px solid transparent;  border-bottom: 10px solid transparent; border-left: 10px solid #F5F5F5; position:absolute; right: -10px; bottom: 8px; transition: 0.54s;}
.problemtext p{ color: #333333; font-size: 16px; margin-bottom: 26px; transition: 0.35s;}
.problemtext span{ display: inline-block; color: #E77B2C; font-size: 14px; line-height: 1.2; transition: 0.35s;}
.problemdown .procion{ display: block; color: #E77B2C; font-size: 24px; position: absolute; right: 0; bottom: 0;}
.probelm-li li:hover .problem-top strong{ color: #E77B2C;}
.probelm-li li:hover .problemtext{ background: #E77B2C;}
.probelm-li li:hover .problemtext:before{ border-left: 12px solid #E77B2C;}
.probelm-li li:hover .problemtext p,.probelm-li li:hover .problemtext span{ color: #fff;}

.videosd{ padding: 130px 0 170px;}
.videolist li{ width: 43.75%; float: left; margin-bottom: 98px; cursor: pointer;}
.videolist li:nth-child(2n+2){ float: right;}
.videolist li figure{ display: block; line-height: 1; overflow: hidden; position: relative;}
.videolist li figure img{ display: block; width: 100%; height: auto; transition: 0.65s;}
.videolist li figure:before{ content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: #E77B2C; opacity: 0; visibility: hidden; transition: 0.5s; filter:alpha(opacity=20); z-index: 3;}
.videolist li figure span{ display: block; width: 34px; height: 34px; position: absolute; left: 50%; top: 50%; margin-left: -17px; margin-top: -17px; z-index: 5; background: url(../images/play1.png) center no-repeat; transition: 0.4s;}
.videos{ box-shadow: 0px 3px 6px rgba(0,0,0,0.16); position: relative; background: #fff;}
.videos span{ display: block; height: 88px; position: relative; color: #111111; font-size: 16px; display: table-cell; vertical-align: middle; padding: 0 24px; transition: 0.45s;}
.videolist li:hover figure img{ transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05);}
.videolist li:hover figure:before{ opacity: 0.2; visibility: visible;}
.videolist li:hover figure span{ background: url(../images/play2.png) center no-repeat;}
.videolist li:hover .videos span{ color: #E77B2C;}
.mapbox{ position: relative;}
.map{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 10;}
.mapbox .mapimg{ display: block; width: 100%; height: auto;}
.BMap_mask{ background: rgba(0,0,0,0.5) !important;}
.BMap_bubble_title{ color: #E77B2C !important; font-size: 16px;}
.anchorBL{ display: none !important;}
.BMap_stdMpCtrl{ left: auto !important; right: 40px !important; top: auto !important; bottom: 30px !important;}
.posites2 a,.posites2 b,.posites2 a i{ color: #fff;}

.contactfix{ width: 1000px; margin: auto; max-width: 90%;}
.contact-item{ padding-top: 66px; }
.contactin .recommtt{ margin-bottom: 0;}
.contactmain{ margin-top: 30px; padding-top: 36px; padding-bottom: 56px; border-top: 1px solid #D6D6D6; border-bottom: 1px solid #D6D6D6;}
.contactmain p{ color: #333333; font-size: 16px; line-height: 2;}
.contactlist li{ width: 50%; float: left; padding: 42px 0 33px;}
.contactlist li strong{ display: block; color: #333333; font-size: 18px; line-height: 1.2;  margin-bottom: 40px;}
.contactlist li span{ display: block; color: #333333; font-size: 14px; line-height: 1.2; margin-bottom: 20px;}
.contactlist li p{ color: #707070; font-size: 14px; line-height: 2.2;}
.messagfe{ padding: 43px 0 40px; border-top: 1px solid #D6D6D6; border-bottom: 1px solid #D6D6D6; margin-top: 24px;}
.messagfe h3{ color: #333333; font-size: 18px; line-height: 1.2; margin-bottom: 40px;}
.messagfe span{ display: block; color: #333333; font-size: 14px; line-height: 1.2; margin-bottom: 20px;}
.messagfe p{ color: #707070; font-size: 14px; line-height: 2.2;}
.contactfix{ padding-bottom: 60px;}
.message-box{ padding: 49px 0 128px; background-attachment: fixed; background-position: center; background-size: cover;}
.messages{ width: 1000px; margin: auto; max-width: 90%;}
.messageb{ margin-top: 70px;}
.row{ position: relative; width: 48%; float: left; margin-bottom: 46px;}
.row .text{ box-sizing: border-box;  width: 100%; padding-bottom: 28px; border: 0; border-bottom: 1px solid #666666; line-height: 19px; font-size: 14px; color: #777777; background: none; outline: none; transition: 0.38s;}
.row .text:focus{ border-color: #E77B2C;}

.row1{ float: right;}
.rows{ float: left; width: 100%; margin-bottom: 50px;}
.rows textarea{ box-sizing: border-box; width: 100%; height: 203px; border: 1px solid #666666; padding: 23px 22px; line-height: 19px; color: #777777; font-size: 14px; font-family: "微软雅黑"; transition: 0.38s; resize: none;}
.rows textarea:focus{ border-color: #E77B2C;}
.row2{ margin-left: 21px; margin-right: 0; width: auto;}
.row2 .text{ width: 250px;}
.textimgs{ float: right; margin-right: 29px; margin-top: ;}
.textimgs img{ display: block; float: left; margin-right: 32px;}
.textimgs span{ display: block; float: left; line-height: 19px; color: #E77B2C; font-size: 14px; cursor: pointer;}
.messbtn{ float: left; margin-top: 32px; position: relative; cursor: pointer;}
.messbtn.active span:before{ visibility: hidden; opacity: 0; transform: scale(0); -webkit-transform: scale(0);} 
.messbtn span{ display: block; width: 19px; height: 19px; border: 1px solid #666666; position: relative; float: left;}
.messbtn span:before{ content: ""; width: 11px; height: 11px; background: #E77B2C; position: absolute; left: 50%; top: 50%; margin-left: -5px; margin-top: -6px; transition: 0.35s;}
.messbtn input{ width: 21px; height: 21px; position: absolute; left: 0; top: 0; margin: 0; padding: 0; opacity: 0; filter:alpha(opacity=0)}
.messbtn p{ float: left; color: #666666; font-size: 14px; line-height: 21px; margin-left: 12px;}
.messbtns{ float: right; position: relative; z-index: 3; background: #E77B2C;}
.messbtns .subs{ width: 320px; height: 85px; float: right; text-align: center; line-height: 85px; cursor: pointer; border: none; float: right; outline: none; border: none; color: #fff; font-size: 14px; position: relative; z-index: 3; background: none;}
.messbtns:before{ content: ""; width: 100%; height: 100%; background: linear-gradient(180deg,rgba(255,185,79,1) 0%,rgba(231,123,44,1) 100%); position: absolute; left: 0; bottom: 0; z-index: -1; opacity: 0; visibility: hidden; transition: 0.4s;}
.messbtns:hover:before{ opacity: 1; visibility: visible;}
.messages .recommtt{ color: #fff;}
.testing { width: 100%; float: left;}
.messagesub { float: left; width: 100%;}
.soluteshare .commbtn{ margin-left: 0;}

.searbox{ position: absolute; left: 50%; margin-left: -296px; top: 50%; text-align: center; margin-top: -77px;}
.searbox strong{ display: block; text-align: center; line-height: 1; color: #E77B2C; font-size: 48px; margin-bottom: 42px;}
.searbox .searchfix{ float: none; margin-right: 0;}
.keywords{ padding: 38px 0 200px;}
.keytt{ padding-bottom: 96px; border-bottom: 1px solid #D6D6D6; color: #333333; font-size: 16px; font-weight: bold;}
.keytt b{ color: #E77B2C;}
.searchli{ padding-top: 52px;}
.searchli li{ margin-bottom: 26px;}
.searchli li b{ display: block; float: left; color: #333333; font-size: 16px; width: 50px; font-weight: normal;}
.searchli li span{ display: block; float: left; color: #E77B2C; font-size: 16px; width: 139px;}
.searchli li p{ float: left; color: #666666; font-size: 16px;}
.searchli li p em{ color: #E77B2C; font-style: normal;}
.abouten.article-block{ opacity: 0; visibility: hidden; transition: 2s;}
.abouten.articleShow{ opacity: 1; visibility: visible;}

.error{ width: 100%; height: 100%; position: absolute; left: 0; top: 0;}
.errortext{ width: 90%; position: absolute; left: 50%; margin-left: -45%; top: 50%; transform: translateY(-50%); text-align: center;}
.errortext strong{ display: block; line-height: 1; text-align: center; color: #E77B2C; font-size: 160px; font-family: "Helvetica Bold"; margin-bottom: 13px;}
.errortext p{ text-align: center; color: #666666; font-size: 14px;}
.errorbtn{ margin-top: 72px; text-align: center;}
.errorbtn a{ display: inline-block; width: 160px; height: 64px; line-height: 64px; color: #fff; font-size: 14px; background: #FFB94F; position: relative; z-index: 3;}
.errorbtn a:before{ content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: -1; background: linear-gradient(to right, #FFB94F 0%,#E77B2C 100%); opacity: 0; visibility: hidden; transition: 0.56s;}
.errorbtn a:first-child{ margin-right: 26px;}
.errorbtn a:hover:before{ opacity: 1; visibility: visible;}