@charset "utf-8";
body, html {  width: 100%; overflow-x: hidden; }   
body {overflow-x: hidden;  }
* { margin: 0; padding: 0; -webkit-box-sizing: border-box; -ms-box-sizing: border-box;  -moz-box-sizing: border-box; box-sizing: border-box; 
font-family:"苹方","微软雅黑";}  
body, p, h1, h2, h3, h4, h5, table, ul, li, form, input { margin: 0; padding: 0; color: #000;  line-height: 1; }  
body, p { font-size: 14px; border: none; color: #000; }  
a { font-size: 14px; color: #000; text-decoration: none; border: none; padding: 0; margin: 0; }  
table { border-collapse: collapse; }  
img { border: 0; margin: 0; padding: 0; display: block; }  
ul, li { list-style: none; border: 0; margin: 0; padding: 0; } 
dl, dt, dd { margin: 0; padding: 0; -webkit-margin-start: 0; }  
h1, h2, h3, h4, h5 { font-weight: normal; font-size: 12px; display: block; }  
strong, b { font-weight: normal; }  
table, tr, td { border-spacing: 0; }  
em, i, b { font-style: normal; }  
p { line-height: 170%; color: #555; font-size: 14px; }  
input,button{ border: none; background: none; }  
figcaption { display: block; }  
input:focus { outline: none; }  
::-webkit-input-placeholder { /* WebKit browsers */ font-size: 14px; color: #555; }  
::-ms-input-placeholder { /* Internet Explorer 10+ */ font-size:14px; color: #555; }  


.clearfix { *zoom: 1; }  
.clearfix:before, .clearfix:after { display: table; line-height: 0; content: ""; }  
.clearfix:after { clear: both; } 
.clear { clear: both; }

.fl{ float: left;}
.fr{ float: right;}
svg:focus{ outline: none; }

 input[type="button"], input[type="submit"], input[type="reset"] {-webkit-appearance: none;}
.container{ max-width: 1520px; margin: 0 auto; width: 100%;  }

#blocwrap{overflow: hidden; position: fixed; height: 100%; width: 100%;top: 0;left: 0;right: 0;bottom: 0;}
#bloc{ width: 100%; overflow-x: hidden; position: absolute;overflow: hidden;z-index: 10;backface-visibility: hidden;transform-style: preserve-3d; }
#blocwrap.on{ position: relative; height: initial;}
.header{ display: flex; align-items: center; padding: 12px 0; z-index: 333; height:80px;}
.header .logo{ display: block; margin-right: auto; z-index: 0; position: relative;}
.navbar ul{ display: flex; align-items: center;}
.navbar ul>li{ margin: 0 50px;  position: relative; display: inline-block; vertical-align: middle;}
.navbar ul>li>a{ font-size:18px; color: #333333;  display: inline-block; vertical-align: middle;}
.subnav{ position: absolute; top: 40px; border:1px solid #e0e0e0; left: -20px; right: -20px; padding: 10px; background: #fff; 
transform: translateY(10px); opacity: 0; visibility: hidden; transition: all 0.56s;  z-index: 33333;}
.subnav::before{ display: block; content: ''; position: absolute; left: 0; right: 0; transform-origin: center; background: #000; height: 3px; transition: all 0.6s;
top: -1px; transform: scaleX(0);}
.navbar li:hover .subnav{ visibility: visible; opacity: 1; transform: none;}
.navbar li:hover .subnav::before{ transform: scaleX(0.3);}
.subnav a{ display: block; text-align: center; font-size: 16px; line-height: 40px; height: 40px;  color: #888; transition: all 0.36s;}
.subnav a:hover{ color: #000;}
.header .zoom{ margin-left: 10px; display: block; cursor: pointer; position: relative; height: 20px; width: 20px; position: relative;}
.header .zoom::before{ background: url(../images/zoom.png) no-repeat center; height: 20px; width:20px; display: block; content: ''; transition: all 0.6s;
opacity:1; visibility: visible;}
.header .zoom::after{ background: url(../images/close.png) no-repeat center; height: 20px; width:20px; display: block; content: '';  transition: all 0.6s;
opacity: 0; visibility: hidden; position: absolute; top: 0; left: 0;}
.header .zoom.on{ z-index: 333;}
.header .zoom.on::after{ opacity: 1; visibility: visible; z-index: 333;}
.header .zoom.on::before{ opacity: 0; visibility: hidden;}
.headerwrap{ position: fixed; left: 0; right: 0; background: #fff; z-index: 33333; width: 100%; max-width: 100%;}
.headerwrap.on{ animation: down10 1s; border-bottom: 1px solid #E0E0E0;}

.search-box{ position: fixed; left: 0; right: 0;  top:80px; padding: 20px 150px;  display: flex; align-items: center;  z-index: -1; height: 200px;}
.search-box::before{  background: #000; content: ""; display: block; transition: all 1s; position: absolute;
top:0px; right: 0; left: 0; bottom: 0; z-index: -1; opacity: 0; visibility: hidden;}
.search-box .row-div{ transition: all 1s; transform: translateY(10px); opacity: 0; width: 100%; display: flex; justify-content: center;}
.search-box .row{ position: relative; border:1px solid rgba(255,255,255,0.3); width: 100%; max-width: 600px; box-sizing: border-box; height: 50px;
border-right: none; transition: all 0.6s;}
.search-box button{ display: block; border-radius: 0px; height: 50px; width: 100px; text-align: center; background: #fff; cursor: pointer; font-size: 16px;
color: #333;}
.search-box.on { z-index: 33;}
.search-box.on .row-div{ transform: none; opacity: 1;}
.search-box.on::before{ opacity: 1; visibility: visible;}
.search-box label{ position: absolute; left:10px;  top: 0px; height: 50px; line-height: 50px; transition: all 0.3s; color: #fff; cursor: text; opacity: 0.6;}
.search-box .key{ width: 80%; height: 50px; line-height: 50px; padding-left: 10px; z-index: 2; position: relative; color: #fff;}
.search-box .key:focus+label {  top: -50px; opacity: 0;}
.search-box .key:not(:focus):not(:placeholder-shown) + label {color: rgba(0, 0, 0, 0);}
.search-box .key:not(:focus):not(:-ms-input-placeholder) + label {color: rgba(0, 0, 0, 0);}
.search-box:hover .row{ border-color: rgba(255,255,255,0.6);}


.banner{ width: 100%; overflow: hidden; position: relative; z-index: 1; margin-top: 80px;}
.banner img{ display: block; width: 100%; margin: 0 auto; overflow: hidden;}
.banner .swiper-slide { position: relative;}
.banner .swiper-slide img{width:100%;height:auto;min-height:100%;transition:1s linear 2s;transform:scale(1.05,1.05);}
.banner .swiper-slide-active img,.banner .swiper-slide-duplicate-active img{transition:6s linear;transform:scale(1,1);}
.banner .swiper-pagination{ bottom: 40px !important;}
.banner .swiper-pagination-bullet{ width:20px; height:3px; border-radius: 0; transition: all 1s; background: #fff; opacity: 0.8; margin: 0 5px !important;  
display: inline-block; opacity: 0.6;}
.banner .swiper-pagination-white .swiper-pagination-bullet-active{ background: #fff; width: 50px; opacity: 1;}

.index-title{ display: flex; justify-content: space-between; align-items: center;}
.index-title-left h3{ color: #000000; font-weight: bold; font-family: arial; font-size: 40px;}
.index-title-left h4{ color: #333333; 	font-size: 18px; padding: 25px 0;}
.index-title-left i{ width: 18px;	height: 3px;	background-color: #222222; display: block; } 
.index-title-right ul{ display: flex; }
.index-title-right ul li a{ color: #333333; font-size: 18px; margin-left: 95px; display: block; position: relative;}
.index-title-right li a::before{ content: ''; display: block; position: absolute; left: 0; bottom: -10px; background: #222; height: 1px; transition: all 0.6s;
right: 0; transform: scaleX(0); transform-origin: left top;}
.index-title-right li.on a::before,.index-title-right li:hover a::before{ transform: scaleX(1);}
.index-product{ padding: 50px 0 70px 0;}
.product-item{ display: flex; padding-top: 60px; }
.index-product .item-shadow{ box-shadow: inset 0px 0px 15px 0px rgba(6, 0, 1, 0.06);  height: 100%; width: 100%;  transition: all 0.6s; padding: 10px 15px;}

.index-prodiv1{   border:1px solid #f2f2f2; padding: 10px; height: 640px; width: 100%; transition: all 0.6s; flex-shrink: 1.3; width: 33%;}
.index-prodiv1 .item-img{ max-width: 370px; max-height: 250px; width: 100%; height: auto;  overflow: hidden; min-width: 300px; }
.index-prodiv1 .item-shadow{ display: flex; justify-content: center; align-items: center; flex-direction: column; align-self: center; }

/* .index-prodiv2{  width: 67.1%; } */
.index-prodiv2 ul{ display: flex; flex-wrap: wrap; }
.index-prodiv2 li{ width: 33%; border:1px solid #f2f2f2; flex-grow: 1; padding: 10px;  transition: all 0.6s;}
.index-prodiv2 li:nth-child(1){ border-bottom:1px solid transparent; border-right:1px solid transparent;}
.index-prodiv2 li:nth-child(2){ border-bottom: 1px solid transparent; }
/* .index-prodiv2 li:nth-child(3){ border-right: 1px solid transparent; } */
.index-prodiv2 .item-shadow{  padding: 10px 20px 10px 15px;}
.index-prodiv2 .item-img{ width: 100%; margin-right: 30px; overflow: hidden; }
.product-item .index-prodiv1 .item-text{ padding-top: 65px;}
.product-item .item-text h3{ font-size: 20px;line-height:30px;margin-top:10px; text-align: center; color: #000000; }
.product-item .item-text p{ font-size: 14px; text-align: center; color: #888888; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
margin: 20px 0 35px 0;}
.product-item .item-text a{ width: 120px;height: 40px;background-color: #f7fafb;border: solid 1px #ebeeef; display: block;
text-align: center; color: #000000; font-family: arial; line-height: 40px; margin: 0 auto; position: relative; z-index: 2; transition-duration: 380ms;}
.product-item .item-img img{ display: block; height: auto; width: 100%; overflow: hidden; transition: all 0.6s;}
.product-item .index-prodiv2 .item-text a{ margin: 0;}
/* .product-item .index-prodiv2 .item-text h3,.product-item .index-prodiv2 .item-text p{ text-align: left;} */
.product-item .item-shadow:hover img{ transform: scale(1.05);}
.index-product .item-shadow:hover{ box-shadow: none;}
.product-item .item-text a::before{top: 0;position: absolute;left: 0;width: 100%; height: 100%; display: block; content: ''; z-index: -1;transform: scaleX(0);
 transform-origin: right 50%; transition-property: transform; transition-duration: 380ms; background-color: #000; padding-bottom: 2px;}
.product-item .item-text a:hover::before {transform: scaleX(1); transform-origin: left 50%;}			
.product-item .item-text a:hover{ color: #fff;}
.index-prodiv2 li:hover,.index-prodiv1:hover{ border:1px solid #000}


.index-designer{ display: flex;  position: relative; width: 100%; overflow: hidden;  }
.des-leftimg { width: 20%; height: 720px;  overflow: hidden; }
.des-leftimg img{ display:block; object-fit: cover; position: relative; z-index: -1; width: 100%;}
.des-right{background-color: #f5f5f5;  height: 450px; padding:3% 4% 4% 4%; width: 80%; margin-top: 60px; }
.des-rightdiv1{ display: flex; justify-content: space-between; max-width: 1250px; width: 100%; }

.des-right .morebtn{ width: 180px; height: 50px; border: solid 2px #222222; color: #000000; 	font-size: 16px; line-height: 50px; text-align: center; 
display: block; position: relative; box-sizing: content-box; z-index: 3; transition-duration: 380ms;}
.des-right .morebtn::before{top: 0;position: absolute;left: 0;width: 100%; height: 100%; display: block; content: ''; z-index: -1;transform: scaleX(0);
 transform-origin: right 50%; transition-property: transform; transition-duration: 380ms; background-color: #000; padding-bottom: 2px;}
.des-right .morebtn:hover::before {transform: scaleX(1); transform-origin: left 50%;}	
.des-right .morebtn:hover{ color: #fff;}
.des-rightdiv1{ display: flex; justify-content: space-between;}
.index-designer .des-tit h2{ color: #000000; font-size: 28px;}
.index-designer .des-tit h2::after{ width: 100px;	height: 3px; background: #000; content: ''; display: inline-block; vertical-align: middle; margin-left: 15px;}.index-designer .des-right .containerwrap{ max-width: 1260px;  margin: 0; position: relative;}
.index-designer .des-tit p{ color: #666666; font-size: 16px; margin-top: 20px;}
.index-designer .desname{  color: #000000;	font-size: 20px;}
.index-designer .desjianjie{  color: #000000;	font-size: 16px; padding: 20px 0 35px 0;}
.index-designer .desptext{  color: #666666;	font-size: 16px;  max-width: 850px;  overflow: hidden; height: 60px;
line-height: 30px; text-overflow: ellipsis;}
.index-designer .des-swiper{  margin-top:40px; }
.index-designer .swiper-slide a{ display: flex;}
.index-designer .swiper-slide .item-img{ display: block; margin-right: 3%; width: 25%;}
.index-designer .swiper-slide .item-img img{ display: block; width: 100%; height: auto;}
.index-designer .item-text{ height: auto; margin-top: 10%; width: 67%;}
.white-bg{  background-color: #ffffff; box-shadow: 0px 0px 20px 0px rgba(6, 0, 1, 0.1); position: absolute; left: -11%; right: 0%;
bottom: -8%; height:19vw;}
.index-designer .swiper-pagination-bullet{ background: #9a9a9a; opacity: 1; width: 6px; height: 6px; margin: 0 3px;}
.index-designer .swiper-pagination-bullet-active{  background-color: #000000;}
.index-designer .swiper-button-next:after, .index-designer .swiper-container-rtl .swiper-button-prev:after{ content: ''; outline: none;}
.index-designer .swiper-button-prev:after, .index-designer .swiper-container-rtl .swiper-button-next:after{ content: '';}
.index-designer .swiper-button-next i{ display: block; width: 2px; height: 23px; background: #898989; margin: 0 3px;}
.index-designer .swiper-button-next .i2{height: 15px; animation-delay: 0.1s;}
.index-designer .swiper-button-next .i3{height: 5px;  animation-delay: 0.2s}
.index-designer .swiper-pagination{ position: relative;}

.index-designer .swiper-button-prev i{ display: block; width: 2px; height: 5px; background: #898989; margin: 0 3px; transform-origin: center;}
.index-designer .swiper-button-prev .i2{ height: 15px; animation-delay: 0.1s;}
.index-designer .swiper-button-prev .i3{ height: 23px;  animation-delay: 0.2s;}
.index-designer .swiper-button-prev:hover .i1,.index-designer .swiper-button-next:hover .i1{ animation: grow1 0.45s infinite alternate linear; }
.index-designer .swiper-button-prev:hover .i2,.index-designer .swiper-button-next:hover .i2{ animation: grow2 0.45s infinite alternate linear; }
.index-designer .swiper-button-prev:hover .i3,.index-designer .swiper-button-next:hover .i3{ animation: grow3 0.45s infinite alternate linear; }

.index-designer .swiper-button-prev:hover i,.index-designer .swiper-button-next:hover i{ background: #000;}

.index-designer .pos{ display: flex; align-items: center; justify-content: space-between; 	width: 223px;	position: absolute; right: 5%; bottom: 0;}
.index-designer .swiper-button-next{ left: auto; bottom: auto; right: auto; top: auto;  position: relative; margin-top: 0;}
.index-designer .swiper-button-prev{ left: auto; bottom: auto; right: auto; top: auto;  position: relative; margin-top: 0;}
.index-designer .swiper-button-next:focus,.index-designer .swiper-button-prev:focus{ outline: none;}



.index-youshi { background: url(../images/map.png) no-repeat top center; margin-top: 70px;}
.title-wrap{ text-align: center; width: 100%;}
.title h3{ color: #000000; 	font-size: 40px; text-align: center;} 
.title p{ color: #666666; 	font-size: 16px; text-align: center; margin-top: 20px;}  
.dragdiv{ display: flex; justify-content: flex-end;}

.dragdiv .drag-tu{ align-self: flex-end; margin-right: 45px;}
.dragdiv .drag-tu img{ animation: rotatein 3.5s infinite linear ; display: block;}

.index-youshi .drag-text{ width: 300px; background-color: #ffffff; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1); border-radius: 10px;}
.index-youshi .drag-text p{  color: #555555; line-height: 30px; font-size: 14px; padding: 30px; }
.youshi-ul{ display: flex; justify-content: space-between;  margin-top: 110px;}
.youshi-ul li{background-color: #ffffff;box-shadow: 0px 0px 20px 0px rgba(6, 0, 1, 0.1); flex-grow: 1; width: 100%; padding: 25px 20px;
margin-right: 40px; transition: all 0.6s; position: relative; overflow: hidden;} 
.youshi-ul li:last-child{ margin-right: 0;}
.youshi-ul li p{ color: #555555; font-size: 14px; line-height: 26px; margin-top:30px; padding: 0 15px; transition: all 0.6s}
.youshi-ul li h3{ background: #4c4c4c; padding: 20px 25px; color: #ffffff; font-size: 22px; transition: all 0.6s; letter-spacing: 0;}
.youshi-ul li h3 span{ color: #ffffff; font-size: 40px; font-family: "宋体";  transition: all 0.6s}
.youshi-ul li:hover{ transform: translateY( -20px);  background: #4c4c4c;}
.youshi-ul li:hover h3,.youshi-ul li:hover h3 span{  background: #fff; color: #222;}
.youshi-ul li:hover p{ color: #fff;}


.index-zhiliang{  background: #f5f5f5; padding: 55px 0 25px 0; margin-top: 70px;}
.zhiliang-ul{ display: flex; flex-wrap: wrap; margin-left:-30px; margin-right: -30px; margin-top: 55px;}
.zhiliang-ul li{ background-color: #ffffff;  padding:60px 40px; width: calc(100% / 3 - 60px); margin: 0 30px 50px 30px;  position: relative; width: 33%; max-width: 460px;
overflow: hidden; }
.zhiliang-ul li span{ display: block; transition: all 0.6s;}
.zhiliang-ul li p{ color: #000000; 	font-size: 18px; margin-top: 20px; line-height: 40px; position: relative; z-index: 3; transition: all 0.6s; height: 80px;
overflow: hidden;}
.zhiliang-ul li svg{ position: absolute; left: 0; right: 0;  width: 100%; bottom: -240px; height: 230px; transform: rotate(180deg); transition: all 0.6s;
z-index: 0; }
.zhiliang-ul li svg path{fill: #000; stroke: #000; }
.zhiliang-ul li:hover p{ color: #fff; transform: translateY(30px);}
.zhiliang-ul li:hover svg{ bottom: 0;}
.zhiliang-ul li:hover span{ transform: translateX(50%); margin-left: -60px;}

.index-news{ padding: 65px 0;}

.news-ul{ margin-top: 50px;}
.news-ul ul{ display: flex; margin-left: -20px; margin-right: -20px;}
.news-ul li{ margin: 0 20px;  width: calc(100% / 4 - 40px);  position: relative; }
.news-ul li i{ display: block; width: 20px; height: 2px; background-color: #000000; margin: 35px 0 30px 0;}
.news-ul li h3{ line-height: 32px; color: #000000; 	font-size: 22px; margin-bottom: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.news-ul li p{  color: #666666; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.news-ul li .item-img { overflow: hidden; background: #000; }
.news-ul li .item-img img{display: block; width: 100%;  transition:transform .45s; }
.news-ul li:hover .item-img img{ transform: scale(1.05);}
.news-ul li::before{position: absolute;left: 0; width: 100%; height: 2px; display: block; content: ''; z-index: -1;transform: scaleX(0);
 transform-origin: left 50%; transition-property: transform; transition-duration: 600ms;  bottom: -20px;  background-color: #000; }
.news-ul li:hover::before {transform: scaleX(1); transform-origin: right 50%;}	

.footer{ background-color: #333333; width: 100%; padding: 75px 0 0 0;}
.footer .div1{ display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid rgba(255,255,255,0.1); padding-bottom: 40px;}
.footer .div1 p a{ color: #ffffff; font-size: 16px; display: inline-block; margin-left: 70px; position: relative;}
.footer .div1 p a::before{ position: absolute;left: 0; width: 100%; height: 1px; display: block; content: '';transform: scaleX(0);
 transform-origin: right 50%; transition-property: transform; transition-duration: 380ms;  bottom: -20px;  background-color: rgba(255,255,255,1); }
.footer .div1 p a:hover::before {transform: scaleX(1); transform-origin: left 50%;}	

.footer .div2{ display: flex; padding-bottom:55px; padding-top: 55px; border-bottom: 1px solid rgba(255,255,255,0.1);}
.footer .div2 span{ display: flex;  align-items: center; justify-content: center; border:1px solid rgba(255,255,255,0.1);
width: 50px; height: 50px; border-radius: 100%;  position: relative; margin-bottom: 25px;}
.footer .div2 span::before{ position: absolute; top: -5px; right: -5px; left: -5px; bottom: -5px; border-radius: 100%; border:1px solid rgba(255,255,255,0.05);
content: ''; display: block;  transition: all 1250ms cubic-bezier(0.19, 1, 0.22, 1); transform: scale(0); opacity: 0}
.footer .div2 span:hover::before{transform: scale(1.1); opacity: 1; }
.footer .div2 span:hover{ overflow: hidden; animation: jello 1s;}


.footer .foot-left{  margin-right: auto; display: flex;}
.footer .div2 p{ color: #666;  	font-size: 14px;}
.footer .div2 h3{  color: #ffffff; font-weight: bold; 	font-size: 30px; padding: 15px 0;}
.footer .div2-2 { margin-left: 130px;}
.footer .div2-2 p{ margin-bottom: 20px;}
.footer .div2-3 .code{ border:1px solid rgba(255,255,255,0.1); padding: 13px;}
.footer .div2-3 p{ color: #aaaaaa; font-size: 14px; text-align: center; margin-top: 15px;}
.footer .div3{ display: flex; justify-content: space-between; align-items: center; padding: 35px 0;}
.footer .div3 p{ color: #666;  	font-size: 14px;}
.footer .div3 p a{ color: #666666; font-size: 14px; display: inline-block; margin-left: 40px; position: relative;}
.footer .div3 p a::before{ position: absolute;left: 0; width: 100%; height: 1px; display: block; content: '';transform: scaleX(0);
 transform-origin: right 50%; transition-property: transform; transition-duration: 380ms;  bottom: -5px;  background-color: rgba(255,255,255,0.2); }
.footer .div3 p a:hover::before {transform: scaleX(1); transform-origin: left 50%;}	



/* 新闻 */
.bgf5{ background-color: #f5f5f5;}

.neibanner{position: relative;   margin-top: 80px; overflow: hidden;}
.neibanner img{ object-fit: cover; display: block; width: 100%;}

.breadcrumb{ border-bottom: 1px solid #dbdbdb;}
.breadcrumbcont{ background: #fff; height: 80px; display: flex; justify-content: space-between; align-items: center;}
.breadcrumb-left{ display: flex; align-items: center;}
.breadcrumb-left a{ display: block; margin-right: 25px; color: #333333;	font-size: 16px;}
.breadcrumb-right { display: flex; align-items: center; /* margin-left: 110px;*/}
.breadcrumb-right a{  color: #333333;font-size: 18px;margin-right: 60px;display: block;position: relative;}
.breadcrumb-right a::before {content: '';display: block;position: absolute;left: 0;bottom: -32px;background: #222;height: 2px;transition: all 0.6s;right: 0;transform: scaleX(0);transform-origin: left top;}
.breadcrumb-right a:hover::before,.breadcrumb-right a.on::before {transform: scaleX(1);}
.breadcrumb-back a img{ display: inline-block; vertical-align: middle; margin-top: -3px; margin-left: 20px; transition: all 0.369s;}
.breadcrumb-back a:hover img{ margin-left: 10px;}
.newspage{padding-bottom: 120px;}
.newspage .index-news { padding: 50px 0 0 0;}
.newspage .index-news ul{ flex-wrap: wrap; margin-bottom: -60px;}
.newspage .index-news ul li{ margin-bottom: 50px;}
.newspage .news-ul{ margin-top: 0;}
.newspage .index-news .news-ul li::before {bottom: -20px; z-index: 333;}
.fenye{ display: flex; align-items: center; justify-content: center; padding-top: 30px;}
.fenye a{ width: 40px;height: 40px;background-color: #ffffff; color: #666666; font-size: 14px;border: solid 1px #e0e0e0; display: block; line-height: 40px; text-align: center; box-sizing: content-box; border-radius: 100%; margin:  0 6px; transition: all 0.36s;}
.fenye .prevye,.fenye  .nextye{ width: 77px;height: 40px; line-height: 40px; text-align: center; box-sizing: content-box;background-color: #ffffff;border-radius: 20px;border: solid 1px #e0e0e0;}
.fenye a.on,.fenye a:hover{ background-color: #666666; color: #fff;}
.fenye a.prev{width:70px;border-radius: 20px;}

/* 团队 */
.teampage{ padding-bottom: 120px;}
.teampage .team-ul { padding-top: 50px;}
.teampage .team-ul ul{ display: flex; flex-wrap: wrap;  margin-left: -16px; margin-right:-16px; margin-bottom: -45px;}
.teampage .team-ul li{ width: calc(100% / 4 - 32px); margin-left: 16px; margin-right: 16px; margin-bottom: 45px; box-shadow: 0px 0px 20px 0px rgba(6, 0, 1, 0.1);}
.teampage li .item-img{ position: relative; overflow: hidden;}
.teampage li .item-img img{ display: block; width: 100%; height: auto; transition: all 0.6s; overflow: hidden; transform: scale(1);}
.teampage li .item-img .jia{ display: block; background: url(../images/jia.png) no-repeat center; height: 15px; width: 15px;}
.teampage li .item-text{ background: #fff; padding: 25px 30px; position: relative; z-index: 3;}
.teampage li .item-name{ position: absolute; left: 0; right: 0; height: 60px; bottom: 0px;background-color: rgba(0,0,0,0.37); display: flex; justify-content: space-between; align-items: center; padding: 0 30px; transition: all 0.6s;}
.teampage .item-name span{ color: #ffffff; font-size: 20px;}
.teampage .item-text h3{ color: #000000; font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;  transition: all 0.6s ;} 
.teampage .item-text p{ color: #888888; font-size: 14px; line-height: 24px; height: 48px; overflow: hidden; margin-top: 20px; transition: all 0.6s;}
.teampage li:hover .item-img img{ transform: scale(1.05);}
.teampage li:hover .item-text h3,.teampage li:hover .item-text p{ color: #fff;}
.teampage .item-text::before{ content: ''; display: block;  position: absolute; left: 0; right: 0; bottom: 0; width: 100%; background: #000;  z-index: -1;
 transition: all 0.6s ; height: 0%; top: auto;}
 .teampage li:hover .item-text::before{ top: 0; height: 100%; }
 .teampage li:hover .item-name{ background-color: rgba(255,255,255,0.37);}
 
 /* 联系 */
 .contactpage{ padding-bottom:80px; padding-top: 75px;}
 .contact-title { text-align: center;}
 .contact-title h3{ color: #000000; 	font-size: 40px; font-family: arial; text-align: center;}
 .contact-title p{ color: #333333; 	font-size: 18px; font-family: arial; text-align: center; padding: 20px 0 30px 0;}
 .contact-title i{ width: 18px; height: 3px; background-color: #222222; display: block;  margin: 0 auto;}
 .contactpage ul{ display: flex; justify-content: space-around; padding-top: 88px;}
 .contactpage li img{ display: block; margin: 0 auto;}
 .contactpage li p{ color: #000; font-size: 18px; text-align: center; margin-top: 20px;}
 .contactpage li:hover img{ animation: jello 1s;}}
 .contactmap img{ display: block; width: 100%; overflow: hidden; height: auto;  }
 
 /* 案例 */
.casepage{ padding-bottom: 80px;}
 .casepage .index-prodiv1{ background: #fff;  height: 620px; margin-right: 30px; max-width: 490px;}
 
 .casepage .index-prodiv2 .item-shadow,.casepage .index-prodiv1 .item-shadow{ height: 100%;}
 .casepage .index-prodiv2 ul{ margin-left: -15px; margin-right: -15px; margin-bottom: -30px;}
 .casepage .index-prodiv2 li{ background: #fff; border:border: solid 1px #f2f2f2; margin-bottom:30px; margin-left: 15px; margin-right: 15px;
  width: calc(100% / 2 - 30px);float:left;}
  
 .casepage .index-prodiv2bt { width: 100%; margin-top: 30px;}
 .casepage .index-prodiv2bt li{ background: #fff; border: solid 1px #f2f2f2; margin-bottom:30px;  margin-left: 15px; margin-right: 15px;
  width: calc(100% / 3 - 30px);  max-width: 486px; }
/*  .casepage .index-prodiv2bt li:nth-child(3n+1){ max-width: 490px;} */
 .casepage .product-item2{ padding-top: 0;}
 /* .product-item .item-text{ width: 50%;} */
/* .product-item .item-text h3{ white-space: initial; line-height: 1.3;} */
.casepage .index-prodiv2 ul{ display: block; flex-wrap: none; }
.casepage .index-prodiv2 li.index-prodiv1{   border:1px solid #f2f2f2; height: 623px; transition: all 0.6s; flex-shrink: 1.3; }
.casepage .index-prodiv2 li.index-prodiv1 .item-img{ width: 100%;  width: 100%;   overflow: hidden;  }
.casepage .index-prodiv2 li.index-prodiv1 .item-shadow{ display: flex; justify-content: center; align-items: center; flex-direction: column; align-self: center; }
.casepage .index-prodiv2 li.index-prodiv1 .item-text a{    margin: 0 auto;}
.casepage .index-prodiv2 li.index-prodiv1 .item-text p,.casepage .index-prodiv2 li.index-prodiv1 .item-text h3{ text-align:center;}



 /* 关于 */
 .about-sec1wrap{ position: relative;}
 .about-sec1{ display: flex; justify-content: space-between; padding: 80px 0 0 0;}
 .about-sec1left{ width: 36%; position: relative;}
 .about-sec1left h3 { color: #333333; font-size: 32px; margin-bottom: 30px;} 
 .about-sec1left p{ color: #666666; font-size:16px; line-height: 46px;}  
 .about-sec1left .item{ max-width: 100%; overflow: hidden; position: absolute; bottom: 0; left: 0; right: 0; height: 328px; display: flex; justify-content: center;}
 .about-sec1right{ width: 52.5%;}
 .about-sec1right .item{ max-width: 100%; overflow: hidden;  height: 537px; display: flex; justify-content: center;}
 .about-sec1right p{ color: #666666; font-size:16px; line-height: 46px; margin-top: 30px; margin-bottom: 70px;}  
 .about-sec1wrap .bg-block1{ display: block; position: absolute; right: 0; bottom: 0; background-color: #f5f5f5; top: 28%; left: 42%; z-index: -1;}
 .about-sec1wrap .bg-block1.reveal-holder .reveal-block::before{ background: #fff;}
 
 .about-sec2{ background: #F5F5F5; padding: 75px 0 100px 0; margin-top: 80px;}
 .about-tit h2{ color: #000000;	font-size: 32px; line-height: 1;}
 .about-tit h2 b{ width: 100px;height: 3px; background: #000; display: inline-block; vertical-align: middle;}
 .about-tit p{ color: #666666;	font-size: 16px; line-height: 1; margin-top:25px;}
 .about-sec2ul{ display: flex; margin-left: -24px; margin-right: -24px; margin-top: 55px;}
 .about-sec2ul li{width: calc(100% / 3 - 48px); margin-left: 24px; margin-right: 24px; max-width: 476px; }
 .about-sec2ul .item-img{ display: block; overflow: hidden; /*height:360px;*/}
 .about-sec2ul .item-img img{width:100%;}
 .about-sec2ul .item-text{ background: #fff; padding: 50px 40px;} 
 .about-sec2ul .item-text h3{ color: #333333; font-size: 24px; line-height: 1;} 
 .about-sec2ul .item-text p{ color: #666666; font-size: 16px; margin-top: 25px; line-height: 1;} 

 .about-sec3wrap{ margin-top: -50px;}
 .about-tit2 { text-align: right; } 
 .about-tit2 h2{ color: #000000;	font-size: 32px; line-height: 1; overflow: hidden; clear: both;}
 .about-tit2 b{ height: 100px; width: 3px; background: #000;  vertical-align: middle; display: block; float: right; margin-right:14px;
 margin-bottom: 30px;}
.about-tit2 p{ color: #666666;	font-size: 16px; line-height: 1; margin-top:25px;}
.about-sec3left{ width: 46%; overflow: hidden; height: 760px; position: relative; z-index: 3; display: flex; align-items: center;}
.about-sec3left img{ display: block; object-fit: cover;}
.about-sec3right{ background: url(../images/aboutptu7.png) no-repeat center; width: 58%; margin-top: 8%; margin-left: -100px; height: 760px;
padding-left: 150px; padding-top: 155px; background-size: cover; padding-right: 100px;}
.about-sec3right h3{ color: #333;	font-size: 32px;  }
.about-sec3right p{ color: #666666;	font-size: 20px; margin-top: 90px;  }

.about-sec4{ background: #f5f5f5; padding: 1px 0 120px 0; margin-top: 80px;}
.about-sec5{ padding: 85px 0;}
.about-sec5 ul{ display: flex;  flex-wrap: wrap; margin-left: -25px; margin-right: -25px; margin-top: 80px; margin-bottom: -50px;}
.about-sec5 ul li{  width: calc(100% / 4 - 50px);  margin: 0 25px 0 25px; max-width: 340px; padding: 30px; border: solid 1px #dcdcdc; margin-bottom: 50px;
position: relative;}
.about-sec5 ul li img{ display: block; width: 100%;}
.about-sec5 ul li p{ color: #333333;	font-size: 20px; text-align: center; line-height: 1; margin-top: 22px;}
.bar {position: absolute;background-color: #333; transition: background-color 0.2s, top 1.6s cubic-bezier(0.630, 0, 0.355, 1), left 1.6s cubic-bezier(0.630, 0, 0.355, 1), bottom 1.6s cubic-bezier(0.630, 0, 0.355, 1), right 1.6s cubic-bezier(0.630, 0, 0.355, 1);}
.about-sec5 li .bar.top {left: -1px;right: 100%;height: 1px;top: -1px;}
.about-sec5 li .bar.left {top: 100%;bottom: -1px;width: 1px;left: -1px;}
.about-sec5 li .bar.right {top: -1px;bottom: 100%;width: 1px;right: -1px;}
.about-sec5 li .bar.bottom {left: 100%;right: -1px;height: 1px;bottom: -1px;}
.about-sec5 li .ball {position: absolute;width: 5px;height: 5px;background-color: #333; border-radius: 100%;transition: background-color 0.2s, top 1.6s cubic-bezier(0.630, 0, 0.355, 1), left 1.6s cubic-bezier(0.630, 0, 0.355, 1), bottom 1.6s cubic-bezier(0.630, 0, 0.355, 1), right 1.6s cubic-bezier(0.630, 0, 0.355, 1);
opacity: 0;}
.about-sec5 li .ball.tl {top: 100%;left: -3px;}
.about-sec5 li .ball.tr {top: -3px;right: 100%;}
.about-sec5 li .ball.bl {bottom: -3px;left: 100%;}
.about-sec5 li .ball.br {bottom: 100%;right: -3px;}
.about-sec5 ul li:hover .bar.top{ right: -1px;}
.about-sec5 ul li:hover .bar.left{ top: -1px}
.about-sec5 ul li:hover .bar.right{ bottom: -1px;}
.about-sec5 ul li:hover .bar.bottom{left: -1px;}
.about-sec5 ul li:hover .ball.tl{ top: -3px;}
.about-sec5 ul li:hover .ball.tr{right: -3px;}
.about-sec5 ul li:hover .ball.bl{left: -3px;}
.about-sec5 ul li:hover .ball.br{bottom: -3px;}
.about-sec5 ul li:hover .ball{ opacity: 1;}

/* 案例详情 */
.casedetail-sec1wrap{ background: #f5f5f5; padding: 50px 0;}
.casedetail-sec1{ display: flex; align-items: center;}
.casede-sec1left{ position: relative; display: flex; height: 684px; width:48% ;}
.casede-sec1left .bigImg{ position: relative; background: #fff; width: 100% !important; height: 684px !important; border: solid 1px #000000;}
.casede-sec1left .bigImg li{ position: relative; height: 100%; padding: 30px;}
.casede-sec1left .bigImg .item-img { height: 546px; display: flex;  align-items: center; align-self: center;}
.casede-sec1left .bigImg .item-img img{ display: block; margin: 0 auto; max-width: 368px;	max-height: 243px; overflow: hidden; width: 100%; }
.casede-sec1left .bigImg .item-text{ position: absolute; bottom: 84px; left: 0; right: 0;}
.casede-sec1left .bigImg h3{ color: #000000; font-size: 20px; text-align: center;}
.casede-sec1left .bigImg p{ color: #888; font-size: 14px; text-align: center; margin-top: 15px;}
.casede-sec1left .smallScroll { display: flex; justify-content: center; flex-direction: column; align-items: center; margin-left: 25px; position: relative;}
.casede-sec1left .smallImg ul{  overflow: hidden; }
.casede-sec1left .smallImg li { width: 141px;	height: 132px !important; cursor: pointer; float: none !important; display: flex; justify-content: center;
 align-items: center; background: #fff; margin-bottom: 17px; padding: 15px; transition: all 0.6s;border:1px solid transparent;}
.casede-sec1left .smallImg li img{ display: block; width: 100%; height: auto; max-height: 102px;}
.casede-sec1left .sPrev { margin-bottom: 17px; display: block;}
.casede-sec1left .sNext{ display: block;}
.casede-sec1left .smallImg li.on{ border:1px solid #000}
.casede-sec1left .smallImg li.on.clone{ border-color: #fff !important;}
.casede-sec1right{ width: 45.6%; margin-left: auto}
.casede-sec1right hr{ margin-top: 4px;}
.casede-sec1right h5{ color: #888888; font-size:16px; padding-bottom: 50px;}
.casede-sec1right h3{ color: #141418; font-size: 40px; padding-bottom: 20px;}
.casede-sec1right .div-text{ margin-top: 45px;}
.casede-sec1right .div-text strong{ color: #141418; font-size: 20px; font-weight: bold; display: block; margin-bottom: 25px;}
.casede-sec1right .div-text p{ color: #666666; font-size: 14px;  line-height: 30px;}

.casedetail-sec2 { padding: 85px 0 35px 0;}
.casedetail-sec2 .casede-tit{ color: #141418;	font-size: 37px; font-weight: bold;}
.casedetail-sec2 .casede-p{ color: #666666; font-size: 18px; margin-top: 45px; line-height: 38px; margin-bottom: 50px;} 
.casedetail-sec2 img{ width: 100%; display: block; height: auto;}
.casedetail-sec2 .casede-divp{ padding: 40px 0; text-align: center;  font-size: 16px; line-height: 40px;}
.casedetail-sec2 .casede-divp img{ width: 100%; display: block; height: auto;}
.casedetail-sec2 .casede-divp p{ text-align: center; color: #666666; font-size: 16px; line-height: 40px;}
.preloader {display: flex; align-items: center; justify-content: center;background: #000;overflow: hidden; position: fixed; top: 0;
left: 0; right: 0; bottom: 0; z-index: 336666; height: 100vh;}
.preloader figure {display: flex;align-items: center;justify-content: center;height: 100vh;width: 100vw;}
.preloader svg {padding: 5vw;width: 90vw;}
.preloader svg > * {fill: #fff; stroke: #fff; stroke-width: 0.85px;}
.preloader:hover:after {content: "Hover to Slow Motion";position: absolute;left: 0;right: 0;bottom: 1vh;color: #1C1C1C;text-align: center;
text-transform: uppercase;letter-spacing: 0.5px;font: 700 9px/14px Tahoma, sans-serif;animation: tip 2.5s forwards;}

.newsdetail{ padding: 50px 0; background: #F5F5F5;}
.newscontainer{ max-width: 1300px; margin: 0 auto; background: #fff; padding: 50px 50px;}
.newsdetail .det-tit h3{ font-size: 24px; text-align: center; color: #000;}
.newsdetail .det-tit p{ text-align: center;}
.newsdetail .det-tit .div1 {display: flex;justify-content: center;padding: 20px 0;border-bottom: 1px solid #F5F5F5;margin-bottom: 20px;}
.newsdetail .det-tit .div1 span{ display: block; font-size: 16px; padding: 0 15px;}
.newsdetail .de-text p{ line-height: 36px; color: #333; font-size: 16px;}
.newsdetail .de-text img{ display: block; max-width: 100%; height: auto; margin: 10px auto;}
.fenpian{ display: flex; justify-content: space-between; padding-top: 20px;  border-top: 1px solid #F5F5F5; margin-top: 50px; align-items: center;}
.fenpian div a{ display: block; color: #000; font-size: 16px; margin-bottom: 20px;}
.fenpian .backlist-btn{ border:1px solid #E0E0E0; background: #000; color: #fff; padding: 12px 30px;}
.fenpian .backlist-btn img{ display: inline-block; vertical-align: middle; height: 20px; margin-right: 10px;}


.content{background:#fff;overflow:hidden;padding-top:50px;}
.content a{color:#000;font-size:16px;}
.content dl{margin-bottom: 20px;border: 1px solid #f9f9f9;}
.topChild{background:#f9f9f9;padding:20px 20px;}
.child{background: #fffbfb;overflow: hidden;}
.childCate{float:left;margin-left:8px;padding:15px;}

/*案例详情*/

.position-weizhi{padding: 25px 0; color: #666666; border-bottom: 1px solid #e0e0e0; box-sizing: border-box;}
.position-weizhi img{display: inline-block; vertical-align: sub; margin-right: 10px;}


.w1200{ width: 1200px; margin: 0 auto;}
.w1260{ width: 1260px; margin: 0 auto;}
.case-display .title {margin: 40px 0;}
.case-display .title h1{font-size: 22px; font-weight: bold;}
.baiduwrap{margin-left: 20px;}
.case-display-bg{background: url(../images/zl-bg1.jpg)no-repeat center top; background-size: cover; max-height: 800px;}
.case-display-pic{width: 1200px; margin: 0 auto; overflow: hidden; position: relative;}
.case-display-pic .bd{width: 1000px; margin: 0 auto;}
.case-display-pic .prev,.case-display-pic .next {
    position: absolute;
    left: 1%;
    top: 50%;
    margin-top: -30px;
    display: block;
    width: 60px;
    height: 60px;
    background: url(../images/slider-arrow.png) -195px 0 no-repeat;
    filter: alpha(opacity=50);
    opacity: 0.5;}
.case-display-pic .next {
    left: auto;
    right: 1%;
    background-position: 8px 0;}
.case-display-pic .prev:hover, .case-display-pic .next:hover {
    filter: alpha(opacity=100);
    opacity: 1;}
    
.case-display-pic-list li{position: relative;}  
.case-display-pic-list li em,.case-display-pic-list li em img{display: block; margin: 0 auto;} 
.case-display-pic-list li .text{position: absolute; bottom: 0; padding: 10px; color: #ffffff; font-size: 16px;
 text-align: center; width: 100%; background-color: rgba(0,0,0,.5);}    
 .case-display-pic-list li .text p{color:#fff;}
.case-display-text{background: #f5f5f5 url(../images/zl-bg2.jpg) no-repeat center top; }    
/* .case-display-text>.w1260{height: 885px; overflow: hidden; } */
.case-display-pic .bd{  position: relative; max-height: 800px; width: 1000px; }
/*.case-display-pic-list li {
    position: relative;
    top: -50%;
   transform: translate(-50%,-50%); left: 50%;}    */
 
.align-vertical { height: 100%; width: 100%; position: relative; display: table; }
.vertical-inner { display: table-cell; vertical-align: middle; }
.case-display-pic-list li{height:800px;}
    
.loster{ width:920px; border-right: 1px solid #e0e0e0; overflow:hidden;  box-sizing:border-box;background:#fff ; }
.loster .xiang{ width:100%; overflow:hidden; position:relative; padding:40px 40px 15px 40px; box-sizing: border-box;}
.loster .xiang .ming{ overflow:hidden;}
.loster .xiang .ming h2{ font-size:24px; font-weight:bold; overflow:hidden;white-space: nowrap; text-overflow: ellipsis;}
.loster .xiang .ming span{color: #e62128; display: inline-block; font-size: 20px; font-family: arial;}
.loster .xiang .ming span img{display: inline-block; margin-right: 10px;}
.loster .xiang .data{ width:100%; overflow:hidden; padding:30px 0; line-height:20px; color:#888; font-size:12px;}
.loster .xiang .data span{ display:block; float:left; margin-right:20px;}
.loster .xiang .qing table{border:1px solid #eee;border-collapse: collapse;border-spacing: 0;font-size: 14px;table-layout: fixed;  color:#666;}
.loster .xiang .qing table th{width:97px;background:#f8f8f8; padding:17px 0 17px 15px;text-align: left;font-weight: normal;border: 1px dotted #e0e0e0;}
.loster .xiang .qing table td{padding:17px 20px; border-bottom:1px dotted #e0e0e0;}
.loster .xiang .sjln{ width:100%; overflow:hidden; margin-top:30px; padding-bottom: 40px; border-bottom: 1px solid #e0e0e0;}
.loster .xiang .sjln figure{ overflow:hidden; margin-bottom: 20px; }
.loster .xiang .sjln figure span{ display:block; float:left; width:12px; height:12px; background:#d72128; margin:9px 10px 0 0;}
.loster .xiang .sjln figure h4{ font-size:20px; float:left;}
.loster .xiang .sjln figcaption{ overflow:hidden; padding:0 0 20px; height: 240px; overflow-y: scroll;}
.loster .xiang .sjln figcaption p{ color:#555; font-size:15px; line-height:40px;}
.loster .xiang .spacen{ width:100%; overflow:hidden; margin-top:15px;}
.loster .xiang .spacen .ppre{ display:block; overflow:hidden; color:#141418; font-size:16px;  width:48%; padding:10px 0; transition:all 300ms;}
.loster .xiang .spacen .ppre:hover{ color:#d72128;}
.loster .xiang .spacen .ppre img{display: inline-block; margin-right: 10px;}
.loster .xiang .spacen .ppre2{text-align: right;}    
.loster .xiang .spacen .ppre img{display: inline-block; margin-left: 10px;}
.ad4{width: 1005;}
.ad4 a img{display: block; width: 100%;}
.case-display-text{padding-top: 50px;}
.xinde{ width:340px; position:relative; overflow:hidden;}
.xinde .jayua{ overflow:hidden; background:#fff;}
.xinde .jieshao {width: 100%; position: relative; }
.jieshao-info{width: 100%; overflow: hidden;position: relative;}
.jieshao-img{padding: 30px 65px 10px 30px; box-sizing: border-box; border-bottom: 1px solid #e0e0e0;}
.jieshao-img img{display: block; width: 100%; margin-bottom: 20px;}
.jieshao-img h2{font-size: 16px; color: #333333; text-align: center;}
.jieshao-img p{color:#555555; font-size:12px; line-height: 30px; margin: 0 5px 10PX; text-align: center; }
.jieshao-more a{ transition: all 0.6s; display: block; font-size:16px; margin: 20PX auto; color: #e62128; border: 1px solid #e62128; text-align: center; border-radius: 35px; width: 209px; height: 37px; line-height: 37px;}
.jieshao-yuyue{position: absolute;   bottom: 185px;  right: 30px;}
.jieshao-yuyue a{display: block; font-size:14px; margin: 5px auto; color: #ffffff; background:#e62128; text-align: center;  width: 145px; height: 40px; line-height: 40px;}
.jieshao-more a:hover{background: #e62128; color: #ffffff;}
.xinde .jayua .layer{ padding:30px 10px 20px 10px; overflow:hidden; text-align:center;}
.xinde .jayua .layer h2{ color:#d72128; font-size:24px;}
.xinde .jayua .layer p{ color:#888; padding-top:10px;}
.xinde .jayua .hayou{padding:0 25px; overflow:hidden;}
.xinde .jayua .hayou .input_item{ border:1px #e0e0e0 solid; overflow:hidden; margin-bottom:15px;}
.xinde .jayua .hayou .input_item .text{ width:100%; background:none; border:none; height:40px; line-height:40px; text-align:center; color:#888;}
.xinde .jayua .privacy{ width:100%; overflow:hidden; font-size:12px; color:#888; text-align:center; padding-bottom:10px;}
.xinde .jayua .price_btn{ padding:0 25px; overflow:hidden;}
.xinde .jayua .price_btn .sub{ width:100%; height:44px; line-height:44px; background:#2a2a2a; color:#fff; border:none; cursor:pointer; transition:all 0.3s; font-size:16px;}
.xinde .jayua .price_btn .sub:hover{ background:#d72128;}
.xinde .z-display-form>p{font-size: 18px; color: #333333; text-align: left; padding-bottom: 25px;}
.cixh{margin-top: 60px;}
.cixh>.w1260>h2{font-weight: bold; color: #333333; font-size: 22px; margin-bottom: 20px;}
.cixh .anlimt{padding: 0;}
.cixh .anlimt li .wode .cont .name{border-bottom: none;  padding: 15px 0;}
.cixh .anlimt li .wode .cont .jibie{padding: 5px 20px 15px;}
.youmei{ width:100%; overflow:hidden; padding:50px 0 50px; }
.youmei .toumi{ width:100%; overflow:hidden; }
.youmei .toumi strong{ display:block; float:left; overflow:hidden;}
.youmei .toumi strong h2{color: #333333; font-size: 22px; font-weight: bold;}
.youmei .toumi strong sup{ display:block; float:left; color:#b2b2b2; font-family:Arial, Helvetica, sans-serif; font-size:16px; font-weight:bold;}
.youmei .toumi a{ display:block; float:right; font-size:16px; color:#333;}
.youmei .toumi a:hover{ color:#288567;}
.youde{ width:100%; overflow:hidden; padding-top:20px;}
.youde ul{ overflow:hidden; width:48%;}
.youde ul li{ line-height:54px; overflow:hidden; white-space: nowrap; text-overflow: ellipsis; border-bottom:1px #e0e0e0 dotted;}
.youde ul li i{ display:inline-block; font-size:16px; color:#141418;  padding-right:12px;  font-weight:bold; float: left;}
.youde ul li span{ color:#555;display: inline-block; float: right;}
.youde ul li p{float: left; width: 76%; overflow: hidden;}
.youde ul li:hover p{ color:#e62128;}
.youde ul li span.span2{font-size: 14px; font-family: arial; width: 90px; text-align: right;}

.z-display-form{ padding:30px 20px; background:#fff; overflow:hidden;  border: 1px solid #d1d1d1;}
.z-display-form h3{ text-align:center; padding-bottom:5px; font-size:22px; font-weight:bold; color:#333333}
.z-display-form p{ text-align:center;  font-size:14px;color:#666666; padding-bottom:15px;}
.z-display-form figure{ padding:0 10px; border:1px #eee solid; overflow:hidden; margin-bottom:20px; position:relative;}
.z-display-form figure input.text{ width:100%; height:38px; line-height:38px; border:none; color:#999;}
.z-display-form figure textarea.text{ width:100%; border:none; color:#999; outline:none;}
.z-display-form figure span{ position:absolute; right:10px;}
.z-display-form strong{ display:block; overflow:hidden;}
.z-display-form strong p{ font-size:14px; color:#666666; padding-bottom:10px; margin-top: 10px; line-height: 23px;}
.z-display-form strong p b{font-size: 20px; color: #e62129;}
.z-display-form strong p i{ color: #e62129;}
.z-display-form strong input.sub{ width:100%; border:none; background:#e62129; height:40px; line-height:40px; color:#fff; font-size:16px; cursor:pointer;}

.anlimt{ width:100%; overflow:hidden; padding:0 10px; box-sizing: border-box;}
.anlimt li{ width:32%; float:left; overflow:hidden; margin-left: 2%; -webkit-box-shadow:0 0 10px 1px #d0d0d0;  
  -moz-box-shadow:0 0 10px 1px #d0d0d0;  
  box-shadow:0 0 10px 1px #d0d0d0;  margin-bottom: 40px;}
.anlimt li .wode{ display:block; overflow:hidden; box-sizing: border-box; transition: all 0.3s; -ms-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s;}
.anlimt li .wode .tupic{ width:100%; position:relative; overflow:hidden;}
.anlimt li .wode .tupic em{ display:block; overflow:hidden; background:#000;}
.anlimt li .wode .tupic em img{ display:block; width:100%; -webkit-transition:all 0.3s linear; -moz-transition:all 0.3s linear; -o-transition:all 0.3s linear; transition:all 0.3s linear; -webkit-transform:scale(1.06); -moz-transform:scale(1.06); -ms-transform:scale(1.06); -o-transform:scale(1.06); transform:scale(1.06);}
.anlimt li .wode:hover .tupic em img{ -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1); opacity:0.7;}
.anlimt li .wode .tupic .master{ padding:20px; color:#fff; position:absolute; top:0; left:0; width:100%; height:100%;box-sizing: border-box;
text-transform: uppercase;-webkit-backface-visibility: hidden;backface-visibility: hidden;}
.anlimt li .wode .tupic .master::before,.anlimt li .wode .tupic .master::after{pointer-events:none;}
.anlimt li .wode .tupic .master::before,.anlimt li .wode .tupic .master::after{ position:absolute; left:30px; right:30px; bottom:30px; top:30px; content:""; opacity:0;
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;transition: opacity 0.35s, transform 0.35s;}
.anlimt li .wode .tupic .master::before{ border-top:1px #fff solid; border-bottom:1px #fff solid; -webkit-transform:scale(0,1); transform:scale(0,1);}
.anlimt li .wode .tupic .master::after{ border-right:1px #fff solid; border-left:1px #fff solid; -webkit-transform:scale(1,0); transform:scale(1,0);}
.anlimt li .wode .tupic .master span{ text-align:center; display:block; opacity:0; font-size:20px;
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;transition: opacity 0.35s, transform 0.35s;
	position:relative;top:50%;-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);-o-transform: translateY(-50%);transform: translateY(-50%);}
.anlimt li .wode:hover .tupic .master::before,.anlimt li .wode:hover .tupic .master::after{ opacity:1; -webkit-transform:scale(1); transform:scale(1);}
.anlimt li .wode:hover .tupic .master span{opacity: 1;}
.anlimt li .wode .cont{ width:100%; overflow:hidden; background:#fff;}
.anlimt li .wode .cont .name{ padding:20px; overflow:hidden; border-bottom:1px #e0e0e0 solid;}
.anlimt li .wode .cont .name .tit{  overflow:hidden;white-space:nowrap; text-overflow: ellipsis; font-size:16px; text-align: center;}

.anlimt li .wode .cont .jibie{ padding:14px 20px; overflow:hidden; text-align:center;}
.anlimt li .wode .cont .jibie span{ display:inline-block; padding:0 15px; color:#666;}
.anlimt li .wode:hover{ box-shadow:0px 5px 15px rgba(0,0,0,.2);}
.anlimt li:nth-child(4n+1){margin-left: 0;}
.tuijian-nav{height: 55px; line-height: 55px; margin-bottom: 40px;}
.tuijian-nav li{float: left; text-align: center; color: #ffffff; font-size: 18px; font-weight: bold; width: calc(100%/2); background: #333333;}
.tuijian-nav li.on{background: #e62129;}
.ad2 em{margin: 20px auto; display: block;}
.ad2 em img{display: block; width: 100%;}




@keyframes tip {
  0%, 100% {
    opacity: 0;
  }
  10%, 80% {
    opacity: 1;
  }
}


@keyframes jello {
	0%,
	11.1%,
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	22.2% {
		-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
		transform: skewX(-12.5deg) skewY(-12.5deg)
	}
	33.3% {
		-webkit-transform: skewX(6.25deg) skewY(6.25deg);
		transform: skewX(6.25deg) skewY(6.25deg)
	}
	44.4% {
		-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
		transform: skewX(-3.125deg) skewY(-3.125deg)
	}
	55.5% {
		-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
		transform: skewX(1.5625deg) skewY(1.5625deg)
	}
	66.6% {
		-webkit-transform: skewX(-.78125deg) skewY(-.78125deg);
		transform: skewX(-.78125deg) skewY(-.78125deg)
	}
	77.7% {
		-webkit-transform: skewX(.390625deg) skewY(.390625deg);
		transform: skewX(.390625deg) skewY(.390625deg)
	}
	88.8% {
		-webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg);
		transform: skewX(-.1953125deg) skewY(-.1953125deg)
	}
}
@keyframes down10{
	from{ transform: translateY(-30px);}
	to{ transform: translateY(0);}
}
@keyframes grow1{
	from{ height: 5px;}
	to{ height: 23px;}
}
@keyframes grow2{
	from{ height: 15px;}
	to{ height:10px;}
}
@keyframes grow3{
	from{ height: 23px;}
	to{ height: 15px;}
}

@keyframes rotatein{
		0%{-webkit-transform:rotate(0deg);}
 
		50%{-webkit-transform:rotate(180deg);}
 
		100%{-webkit-transform:rotate(360deg);}
}

@media (max-width:1600px) {		
	.container{ padding: 0 50px;}
	.newsdetail{ padding: 50px;}
	.about-sec1{padding: 50px 50px 0 50px;}	
	.index-prodiv2 .item-img{ margin-right: 15px;}
	.des-leftimg {  height: 600px;}
	.white-bg{ height: 300px;}
	.index-designer .item-text{ margin-top: 9%;}
	.des-right{ padding-left: 3%;}
	.zhiliang-ul { margin-left: -20px; margin-right: -20px;}
	.zhiliang-ul li{ width:calc(100% / 3 - 40px); margin: 0 20px 50px 20px; }
	.news-ul ul{ display: flex; margin-left: -15px; margin-right: -15px;}
	.news-ul li{ margin: 0 15px;  width: calc(100% / 4 - 30px);  position: relative; }
	.footer{ padding-top: 50px;}
	.footer .div2{ padding-top: 40px; padding-bottom: 40px;}

}

@media (max-width:1440px) {	
	.navbar ul>li{ margin: 0 40px;}
	.white-bg{ bottom: -5%;}
	.about-sec1left h3{font-size: 28px;}
}

@media (max-width:1400px) {	
	.about-sec1left h3{font-size: 28px;}
}


@media (max-width:1200px) {	
	.navbar ul>li{ margin: 0 30px;}
	.about-sec1left h3{font-size: 26px;}
}