﻿@charset "utf-8";

#fp-nav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li a.active span, .fp-slidesNav ul li:hover a.active span {
    height: 10px;
    width: 10px;
}
#fp-nav ul li a.active span.fp-sr-only, #fp-nav ul li:hover a.active span.fp-sr-only {
    width: 16px;
    height: 16px;
    border: 1px solid #ec8401;
    background: transparent;
    position: absolute;
    top: 4px;
    left: 4px;
    font-size: 0;
    z-index: 99;
    clip: auto;
}
#fp-nav ul li, .fp-slidesNav ul li{
width: 14px;
height: 14px;
}
#fp-nav ul li a span, .fp-slidesNav ul li a span{
background: #ec8401;
}
.index_main .contain{
width:100%;
height:100%;
position: relative;
}
.index_main .contain .contain-top{
width: 100%;
height: 100%;
position: relative;
}
.index_main .contain .contain-header{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100px;
z-index: 99;
padding: 0 3%;
/*	
background: #00000066;	
background:-webkit-linear-gradient(to right,#cfdef0 25%,#d1e4f3 75%);
background:-ms-linear-gradient(to right,#cfdef0 25%,#d1e4f3 75%);
background:-o-linear-gradient(to right,#cfdef0 25%,#d1e4f3 75%);
background:linear-gradient(to right,#cfdef0 25%,#d1e4f3 75%);
-webkit-box-pack:center;
-webkit-justify-content:center;
-ms-flex-pack:center;
justify-content:center	
*/
	
background:url(../dimg/contain-header.png) no-repeat center top;	
	
}
@media (max-width:1024px){
.index_main{
    display: block;
    transform: none !important;
    overflow: auto;
    height: 100% !important;
}
.fp-section.fp-table, .fp-slide.fp-table,.fp-tableCell,.fp-section{
  height:auto !important;
}
#fp-nav.fp-right{display:none !important;}
.index_main .contain .contain-header{
position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    min-height: auto;
    background: #fff;
    z-index: 99;
    padding: 0 2%;
}
}

/*banner魔方样式*/
.fp-controlArrow{
 display:none;
}
.box5031_1 .carousel-inner > .item {
    z-index: -1;
    width: 100%;
    height: 100vh;
}
.box5031_1 .carousel-inner > .item > a > img {
    margin: 0 auto;
    width: 100%;
    /*height: 100%;*/
    object-position: center top;
   /* object-fit: cover;*/
    max-width: none;
	padding-top: 100px;
}
.box5031_1 .carousel-control {
    display: block;
    width: 62px;
    height: 62px;
    border-radius: 40px;
    padding: 16px 0;
    top: 47%;
    margin: 0px 90px;
    border: 2px dotted #adadad;
    background: none;
    -webkit-transition: width 0.3s, background-color 0.3s;
    transition: ease all .5s;
    text-shadow: none;
    opacity: 0.6;
}
.box5031_1 .carousel-control.left {
    padding-left: 10px;
}
.box5031_1 .carousel-control.right {
    padding-right: 10px;
}
.box5031_1 .carousel-control .btn-right {
    display: inline-block;
    background: none;
    width: 0;
    height: 0;
    border-top: 0 solid transparent;
    border-right: 15px solid transparent;
    border-left: 15px solid transparent;
    border-bottom: 15px solid #fffffd;
    transform: rotate(90deg);
}
.box5031_1 .carousel-control .btn-left {
    display: inline-block;
    background: none;
    width: 0;
    height: 0;
    border-top: 0 solid transparent;
    border-right: 15px solid transparent;
    border-left: 15px solid transparent;
    border-bottom: 15px solid #fffffd;
    transform: rotate(270deg);
}
.box5031_1 .carousel-control h3 {
    display: none;
}
.box5031_1 .carousel-indicators li {
    height: 8px;
    width: 5%;
    border-radius: 0;
    transition: all ease .5s;
}
.box5031_1 .carousel-indicators .active {
    height: 8px;
    width: 5%;
}
.box5031_1 .carousel-control:hover {
    width: 62px;
    background: none;
    border: 2px dotted #fff;
    opacity: 1;
}
.box5031_1 .carousel-indicators {
    bottom: 50px;
}
@media (max-width:1024px){
  .box5031_1 .pc-slide{margin-top:65px;}
.box5031_1 .carousel-indicators {
    bottom: 10px;
	}
	
	.box5031_1 .carousel-inner > .item{ height: auto;}
}
@media(max-width:765px){
.box5031_1 .pc-slide{margin-top:59px;}
.box5031_1 .carousel-inner > .item {
    height: auto;
}
.box5031_1 .carousel-inner > .item > a > img{
    max-width: 100%;
}
.box5031_1 .carousel-control{
   margin: 0 15px;
}
.box5031_1 .carousel-control .btn-left {
    border-top: 0 solid transparent;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
    border-bottom: 10px solid #fffffd;
    top: 11px;
    left: 4px;
}
.box5031_1 .carousel-control .btn-right {
    border-top: 0 solid transparent;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
    border-bottom: 10px solid #fffffd;
    top: 11px;
    left: 8px;
}
}
/*产品样式*/
.product-min{
   width: 100%;
   height:100%;
/*background:#1f1f1f;*/
}
.product-min .product-tap{
    height: 90px;
    /*background: #333333;*/
    width: 100%;
    padding: 0 3%;
    color: #e5e5e5;
    text-align: left;
	
	background:url(../dimg/contain-header.png) no-repeat center top;
}
.product-min .product-tap .product-flex::after,.product-min .product-tap .product-flex::before{
content:'';
display:block;
clear:both;
}
.product-min .product-tap .product-flex .product-tapfl{
width:30%;
float:left;
}
.product-min .product-tap .product-flex .product-tapfr{
width:48.5%;
float:right;
}
.box222_1 .mainCont .mainList li{
  background:none !important;
}
.box222_1 .mainCont h1{display:none;}
.box222_1 .mainCont .mainList {
    margin-top: 0;
    height: 60px;
    padding: 0px 10px;
	margin: 15px 0;
    text-align: right;
}
.box222_1 .mainCont .mainList>ul {
    display: flex;
    justify-content: flex-start;
    align-items: center;
	flex-wrap: wrap;
	
}
.box222_1 .mainCont .mainList li {
    list-style: none;
    float: none;
    background: none;
height: 30px;
    line-height: 30px;
    margin-bottom: 0px; 
	width: 25%;
	text-align: left;
	position:relative;
	padding: 0 10px;
	text-align: center;
	
}
.box222_1 .mainCont .mainList li a {
    line-height: 30px;
    color: #FFFFFF;
    display: block;
    font-size: 16px;
	text-decoration: none;
	white-space: nowrap; /* 文本不换行 */
    overflow: hidden; /* 隐藏溢出内容 */
    text-overflow: ellipsis; /* 溢出内容显示为省略号 */}



.box222_1 .mainCont .mainList li:before{ content: ''; position: absolute; right: 0; top: 50%; margin-top: -5px; width: 1px; height: 10px; background: #fff;}
.box222_1 .mainCont .mainList li:nth-child(4n):before{ display: none;}

.box222_1 .mainCont .mainList li a:hover {
	text-decoration: underline !important;;
}
.box222_1 .mainCont .mainList .fgx {
    background: #FFFFFF !important;
    width: 1px;
    height: 15px;
}
.box222_1 .mainCont .mainList .fgx:last-child{
   display:none;
}
@media (max-width:1024px){
.product-min .product-tap .product-flex .product-tapfr{display:none;}
.product-min .product-tap .product-flex .product-tapfl{
   width:100%;
}
@media (max-width:765px){
.product-min .product-tap{height:70px;}
}
}


.section2{ background:url(../dimg/section2bg.jpg) no-repeat center top;}
/*产品列表魔方*/
.box3003_1 .pro-list {
    padding: 0 2%;
    width: 100%;
    height: auto;
    margin-top: 20px;
    padding-bottom: 10px;
}
.box3003_1 .pro-list .row {
    margin: 0;
}
.box3003_1 .m-product .pro-item {
    margin-bottom: 1%;
    width: 24.25%;
    position: relative;
    padding: 0;
    margin-right: 1%;
    overflow: hidden;
border: 4px solid transparent;
}
.box3003_1 .m-product .pro-item .caption {
    height: 74px;
	line-height: 74px;
	text-align: center;
    padding: 0 15px ;
    -webkit-transition: all ease .5s;
     transition: 0.5s all;
    position:relative;
    width: 100%;
	background: #707070;
}
.box3003_1 .m-product .pro-item:nth-child(4n) {
    margin-right: 0;
}
.box3003_1 .m-product .pro-item:hover .caption {
    background: #707070;
}
.box3003_1 .m-product .pro-item:hover{
    border: 4px solid #ec8401;
    border-radius:4px;
}
.box3003_1 .m-product .pro-item .caption .title{
  color:#e5e5e5;
    font-size: 20px;
overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.box3003_1 .m-product .pro-item:hover .caption .title {
    color: #e5e5e5;
}
.box3003_1 .m-product .pro-item .caption .sub-title{
    color:#f1f1f1;
    margin-top: 2px;
display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}
@media(max-width:1024px){
.box3003_1 .pro-list{
padding: 0;
       padding-bottom: 10px;
}
.box3003_1 .m-product .pro-item{
width: 49.5%;
}
.box3003_1 .m-product .pro-item:nth-child(2n) {
    margin-right: 0;
}
.box3003_1 .m-product .pro-item .caption{
    bottom: 0;
    padding: 5px;
    background: rgba(0, 0, 0, .5);
}
.box3003_1 .m-product .pro-item .caption .title{
  font-size:14px;
}
}
@media (max-width:765px){
.box3003_1 .m-product .pro-item .caption .sub-title{
  display:none;
}
.box3003_1 .m-product .pro-item .caption{
   height:28px;
   line-height:28px;
  padding:0 5px;
text-align: center;
}
}
/*关于我们*/
.section3{ background:url(../dimg/section3bg.jpg) no-repeat center top;}
.contain-about{
width:100%;
height:100%;    

    opacity: .7;
}
.contain-about .about-bacok{
    padding: 100px 0;
    position: relative;
}
/*新闻资讯
.box5050_1 .index_5050 .page-wrap,.box5050_1 .index_5050 .page-wrap .news-wrap{
    background: none;
}
.box5050_1 .index_5050 .page-wrap {
    padding: 0 2%;
}
.box5050_1 .index_5050 .page-wrap .news-wrap{
    padding-top: 25px;
}
.box5050_1 .index_5050 .page-wrap .news-wrap .container{
    max-width: none;
    margin: 0 auto;
    padding: 0;
}
.box5050_1 .index_5050 .page-wrap .news-wrap li{
    width: 24.25%;
    margin-right: 1%;
    float: left;
    background: #fff;
    padding: 0;
    margin-bottom: 20px;
    position: relative;
border:none;
}
.box5050_1 .index_5050 .page-wrap .news-wrap li .news-img a {
    display: block;
}
.box5050_1 .index_5050 .page-wrap .news-wrap li .news-con {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 4% 6%;
    background: rgba(31, 31, 31, .69);
    z-index: 10;
}
.box5050_1 .index_5050 .page-wrap .news-wrap li .news-con h3 a{
color: #ffc000;
font-size:16px;
}
.box5050_1 .index_5050 .page-wrap .news-wrap li:hover .news-con h3 a {
    color:#ffc000;
}
.box5050_1 .news-more,.box5050_1 .index_5050 .page-wrap .news-wrap li .news-con span{display:none}
.box5050_1 .index_5050 .page-wrap .news-wrap li:hover .news-con p {
    color: #999;
}
.box5050_1 .index_5050 .page-wrap .news-wrap li .news-img a::after {
    content: '';
    display: block;
    opacity: 0;
    border: 1px solid #fff;
    z-index: 9;
    position: absolute;
    top: 20px;
    left: 20px;
    height: calc(100% - 40px);
    width: calc(100% - 40px);
    box-shadow: 0 0 9px 5px rgb(0 0 0 / 35%);
    transition: 0.5s all;
}
.box5050_1 .index_5050 .page-wrap .news-wrap li:hover .news-img a::after {
 opacity: 1;
}
.box5050_1 .index_5050 .page-wrap .news-wrap li:nth-child(4n){
margin-right: 0;
}
.box5050_1 .index_5050 .page-wrap .news-wrap li:nth-child(3n){
       margin-right: 1%;
}
@media (max-width:1024px){
.box5050_1 .index_5050 .page-wrap .news-wrap li{
width: 49%;
    margin-right: 1%;
}
.box5050_1 .index_5050 .page-wrap .news-wrap li:nth-child(4n){
margin-right: 0;
}
.box5050_1 .index_5050 .page-wrap .news-wrap li:nth-child(3n){
       margin-right: 1%;
}
}
@media (max-width:992px){
}
@media (max-width:650px){
.box5050_1 .index_5050 .page-wrap .news-wrap li{
  width: 100%;
   margin-right: 0%;
}
.box5050_1 .index_5050 .page-wrap .news-wrap li:nth-child(3n){
       margin-right: 0%;
}
}
*/


/*案例展示*/
.box3020_1 .in-image {
    padding-top: 20px;
}
.box3020_1 .in-image .image-list .item{
    margin-bottom: 18px;
}
.box3020_1 .in-image .image-list .item:hover .img {
    -webkit-transform: none;
    transform: none;
}
.box3020_1 .in-image .image-list .item .img {
    -webkit-transition: none;
    transition: none;
}
.box3020_1 .in-image .image-list .item:hover .title {
/*    -webkit-transform: none;
    transform: none;
    bottom: 0;*/
}
.box3020_1 .in-image .image-list .item .title {
       position: absolute;
    width: 100%;
    color: #fff;
    font-size: 16px;
    bottom: 0px;
    top: auto;
    left: 0;
    display: block;
    height: 50px;
    line-height: 50px;
    text-align: center;
    padding: 0px 25px 0;
    transition: 0.5s all;
    background-color: rgba(0, 0, 0, .5);
	-webkit-transform: translateY(0);
  transform: translateY(0);
}
.box3020_1 .in-image .row{
   margin:0;
}
.box3020_1 .in-image .image-list .item .wrap {
    border: 4px solid transparent;
}
.box3020_1 .in-image .image-list .item:hover .wrap {
    border: 4px solid #eb8203;
    border-radius: 5px;
}
@media (max-width:765px){
.box3020_1 .in-image .image-list .item{
  padding: 0 3px;
margin-bottom: 10px;
}
.box3020_1 .in-image .image-list .item .title{
font-size: 14px;
height: 40px;
    line-height: 40px;
position: relative;
bottom: 0 !important;
    top: auto;
    left: 0;
    padding: 0 10px;
transform: none;
}
}
/**/
.mousescroll{
position: absolute;
    left: 50%;
    bottom: 10%;
    z-index: 9;
    transform: translate(-50%,0);
}
@media (max-width:765px){
 .mousescroll{display:none;}
}
.mouse {
  background: #4e5559 -webkit-linear-gradient(transparent 0%, transparent 50%, #ffffff 50%, #ffffff 100%);
  background: #4e5559 linear-gradient(transparent 0%, transparent 50%, #ffffff 50%, #ffffff 100%);
  position: relative;
width: 20px;
    height: 35px;
  background-size: 100% 100%;
  border-radius: 100px;
  background-size: 225%;
  -webkit-animation: colorSlide 5s linear infinite, nudgeMouse 5s ease-out infinite;
          animation: colorSlide 5s linear infinite, nudgeMouse 5s ease-out infinite;
}
.mouse:before, .mouse:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}
.mouse:before {
      width: 16px;
    height: 32px;
  background-color: #222a30;
  border-radius: 100px;
}
.mouse:after {
  background-color: #ffffff;
  width: 6px;
  height: 6px;
  border-radius: 100%;
  -webkit-animation: trackBallSlide 5s linear infinite;
          animation: trackBallSlide 5s linear infinite;
}
@-webkit-keyframes colorSlide {
  0% {
    background-position: 0% 100%;
  }
  20% {
    background-position: 0% 0%;
  }
  21% {
    background-color: #4e5559;
  }
  29.99% {
    background-color: #ffffff;
    background-position: 0% 0%;
  }
  30% {
    background-color: #4e5559;
    background-position: 0% 100%;
  }
  50% {
    background-position: 0% 0%;
  }
  51% {
    background-color: #4e5559;
  }
  59.99% {
    background-color: #ffffff;
    background-position: 0% 0%;
  }
  60% {
    background-color: #4e5559;
    background-position: 0% 100%;
  }
  80% {
    background-position: 0% 0%;
  }
  81% {
    background-color: #4e5559;
  }
  89.99%, 100% {
    background-color: #ffffff;
  }
}
@keyframes colorSlide {
  0% {
    background-position: 0% 100%;
  }
  20% {
    background-position: 0% 0%;
  }
  21% {
    background-color: #4e5559;
  }
  29.99% {
    background-color: #ffffff;
    background-position: 0% 0%;
  }
  30% {
    background-color: #4e5559;
    background-position: 0% 100%;
  }
  50% {
    background-position: 0% 0%;
  }
  51% {
    background-color: #4e5559;
  }
  59.99% {
    background-color: #ffffff;
    background-position: 0% 0%;
  }
  60% {
    background-color: #4e5559;
    background-position: 0% 100%;
  }
  80% {
    background-position: 0% 0%;
  }
  81% {
    background-color: #4e5559;
  }
  89.99%, 100% {
    background-color: #ffffff;
  }
}
@-webkit-keyframes trackBallSlide {
  0% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-10px);
            transform: scale(1) translateY(-10px);
  }
  6% {
    opacity: 1;
    -webkit-transform: scale(0.9) translateY(5px);
            transform: scale(0.9) translateY(5px);
  }
  14% {
    opacity: 0;
    -webkit-transform: scale(0.4) translateY(20px);
            transform: scale(0.4) translateY(20px);
  }
  15%, 19% {
    opacity: 0;
    -webkit-transform: scale(0.4) translateY(-15px);
            transform: scale(0.4) translateY(-15px);
  }
  28%, 29.99% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-15px);
            transform: scale(1) translateY(-15px);
  }
  30% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-15px);
            transform: scale(1) translateY(-15px);
  }
  36% {
    opacity: 1;
    -webkit-transform: scale(0.9) translateY(5px);
            transform: scale(0.9) translateY(5px);
  }
  44% {
    opacity: 0;
    -webkit-transform: scale(0.4) translateY(20px);
            transform: scale(0.4) translateY(20px);
  }
  45%, 49% {
    opacity: 0;
    -webkit-transform: scale(0.4) translateY(-15px);
            transform: scale(0.4) translateY(-15px);
  }
  58%, 59.99% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-15px);
            transform: scale(1) translateY(-15px);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-15px);
            transform: scale(1) translateY(-15px);
  }
  66% {
    opacity: 1;
    -webkit-transform: scale(0.9) translateY(5px);
            transform: scale(0.9) translateY(5px);
  }
  74% {
    opacity: 0;
    -webkit-transform: scale(0.4) translateY(20px);
            transform: scale(0.4) translateY(20px);
  }
  75%, 79% {
    opacity: 0;
    -webkit-transform: scale(0.4) translateY(-15px);
            transform: scale(0.4) translateY(-15px);
  }
  88%, 100% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-15px);
            transform: scale(1) translateY(-15px);
  }
}
@keyframes trackBallSlide {
  0% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-15px);
            transform: scale(1) translateY(-15px);
  }
  6% {
    opacity: 1;
    -webkit-transform: scale(0.9) translateY(5px);
            transform: scale(0.9) translateY(5px);
  }
  14% {
    opacity: 0;
    -webkit-transform: scale(0.4) translateY(20px);
            transform: scale(0.4) translateY(20px);
  }
  15%, 19% {
    opacity: 0;
    -webkit-transform: scale(0.4) translateY(-15px);
            transform: scale(0.4) translateY(-15px);
  }
  28%, 29.99% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-15px);
            transform: scale(1) translateY(-15px);
  }
  30% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-15px);
            transform: scale(1) translateY(-15px);
  }
  36% {
    opacity: 1;
    -webkit-transform: scale(0.9) translateY(5px);
            transform: scale(0.9) translateY(5px);
  }
  44% {
    opacity: 0;
    -webkit-transform: scale(0.4) translateY(20px);
            transform: scale(0.4) translateY(20px);
  }
  45%, 49% {
    opacity: 0;
    -webkit-transform: scale(0.4) translateY(-20px);
            transform: scale(0.4) translateY(-20px);
  }
  58%, 59.99% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-20px);
            transform: scale(1) translateY(-20px);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-20px);
            transform: scale(1) translateY(-20px);
  }
  66% {
    opacity: 1;
    -webkit-transform: scale(0.9) translateY(5px);
            transform: scale(0.9) translateY(5px);
  }
  74% {
    opacity: 0;
    -webkit-transform: scale(0.4) translateY(20px);
            transform: scale(0.4) translateY(20px);
  }
  75%, 79% {
    opacity: 0;
    -webkit-transform: scale(0.4) translateY(-20px);
            transform: scale(0.4) translateY(-20px);
  }
  88%, 100% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-20px);
            transform: scale(1) translateY(-20px);
  }
}
@-webkit-keyframes nudgeMouse {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  20% {
    -webkit-transform: translateY(8px);
            transform: translateY(8px);
  }
  30% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(8px);
            transform: translateY(8px);
  }
  60% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  80% {
    -webkit-transform: translateY(8px);
            transform: translateY(8px);
  }
  90% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes nudgeMouse {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  20% {
    -webkit-transform: translateY(8px);
            transform: translateY(8px);
  }
  30% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(8px);
            transform: translateY(8px);
  }
  60% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  80% {
    -webkit-transform: translateY(8px);
            transform: translateY(8px);
  }
  90% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes nudgeText {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  20% {
    -webkit-transform: translateY(2px);
            transform: translateY(2px);
  }
  30% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(2px);
            transform: translateY(2px);
  }
  60% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  80% {
    -webkit-transform: translateY(2px);
            transform: translateY(2px);
  }
  90% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes nudgeText {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  20% {
    -webkit-transform: translateY(2px);
            transform: translateY(2px);
  }
  30% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(2px);
            transform: translateY(2px);
  }
  60% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  80% {
    -webkit-transform: translateY(2px);
            transform: translateY(2px);
  }
  90% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes colorText {
  21% {
    color: #4e5559;
  }
  30% {
    color: #ffffff;
  }
  51% {
    color: #4e5559;
  }
  60% {
    color: #ffffff;
  }
  81% {
    color: #4e5559;
  }
  90% {
    color: #ffffff;
  }
}
@keyframes colorText {
  21% {
    color: #4e5559;
  }
  30% {
    color: #ffffff;
  }
  51% {
    color: #4e5559;
  }
  60% {
    color: #ffffff;
  }
  81% {
    color: #4e5559;
  }
  90% {
    color: #ffffff;
  }
}
/* 动画animated */
@media (min-width: 1024px){
.section.active .contain .contain-header{
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
    animation-delay: 0.5s;
}

.section.active .product-tapfl{
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
    animation-delay: 0.5s;
}
.section.active .product-tapfr{
   -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
    animation-delay: 0.5s;
}
.section.active .upanimated{
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
    animation-delay: 0.8s;
}
.section.active .Moresy{
   -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
    animation-delay: 1.6s;
}
.section.active .about-box .about-text h4{
   -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
    animation-delay: 0.5s;
}
.section.active .about-box .about-text>p{
  -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
    animation-delay: 0.8s;
}
.section.active .about-box .about-text .about-detail{
 -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
    animation-delay: 1.6s;
}
.section.active .about-box .more{
-webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
    animation-delay: 2s;
}
.section.active .about-box .mb li{
-webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
    animation-delay: 2.25s;
}
.section.active .c-sbox{
-webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
    animation-delay: 0.5s;
}
.section.active .c-lianxi .c-l{
-webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
    animation-delay: 0.8s;
}
.section.active .c-lianxi .c-r{
-webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
    animation-delay: 1.5s;
}
}


.section4{ background:url(../dimg/section4bg.jpg) no-repeat center top;}
.section5{ background:url(../dimg/section5bg.jpg) no-repeat center top;}
.section6{ background:url(../dimg/section6bg.jpg) no-repeat center top;}
.section7{ background:url(../dimg/section7bg.jpg) no-repeat center top;}
