/*
 * author pulu
 * time 2018 5 28
 */
/*product1.html*/
.single-banner{
	position: relative;
}
.single-banner-image{
	width: 100%;
}
.single-banner .w1200{
	position: absolute;
	height: 100%;
	top: 0;
	left: 50%;
	margin-left: -600px;
}
.single-banner-image1,.single-banner-image2{
	width:730px;
	height:380px;
	position:absolute;
	top:0;
	right:0;
	left:0;
	bottom:0;
	margin:auto 0;
}
.single-banner-image2{
	width: 398px;
	height: 163px;
	left: 800px;
}
.single-banner-image1{
	transform: translateX(-220px);
	-webkit-transform: translateX(-220px);
	-moz-transform: translateX(-220px);
	-o-transform: translateX(-220px);
	animation: sbanner 1s .2s forwards linear;
	-webkit-animation:sbanner 1s .2s forwards linear;
	-moz-animation:sbanner 1s .2s forwards linear;
	-o-animation:sbanner 1s .2s forwards linear;
}
@-webkit-keyframes sbanner{
	0% {
		-webkit-transform: translateX(-220px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0);
		opacity: 1;
	}
}
@-moz-keyframes sbanner{
	0% {
		-moz-transform: translateX(-220px);
		opacity: 0;
	}
	100% {
		-moz-transform: translateX(0);
		opacity: 1;
	}
}
@-o-keyframes sbanner{
	0% {
		-o-transform: translateX(-220px);
		opacity: 0;
	}
	100% {
		-o-transform: translateX(0);
		opacity: 1;
	}
}
@keyframes sbanner{
	0% {
		transform: translateX(-220px);
		opacity: 0;
	}
	100% {
		transform: translateX(0);
		opacity: 1;
	}
}
.single-banner-image2{
	-webkit-animation:flipInY 1s 1.2s ease both;
	-moz-animation:flipInY 1s 1.2s ease both;
	animation:flipInY 1s 1.2s ease both;
	opacity: 1;
}
@-webkit-keyframes flipInY {
	0% {opacity:0;-webkit-transform:perspective(400px) rotateY(90deg);}
	40% {-webkit-transform:perspective(400px) rotateY(-10deg);}
	70% {-webkit-transform:perspective(400px) rotateY(10deg);}
	100% {opacity:1;-webkit-transform:perspective(400px) rotateY(0deg);}
}
@-moz-keyframes flipInY {
	0% {opacity:0;-moz-transform:perspective(400px) rotateY(90deg);}
	40% {-moz-transform:perspective(400px) rotateY(-10deg);}
	70% {-moz-transform:perspective(400px) rotateY(10deg);}
	100% {opacity:1;-moz-transform:perspective(400px) rotateY(0deg);}
}
@-o-keyframes flipInY {
	0% {opacity:0;-o-transform:perspective(400px) rotateY(90deg);}
	40% {-o-transform:perspective(400px) rotateY(-10deg);}
	70% {-o-transform:perspective(400px) rotateY(10deg);}
	100% {opacity:1;-o-transform:perspective(400px) rotateY(0deg);}
}
@keyframes flipInY {
	0% {opacity:0;transform:perspective(400px) rotateY(90deg);}
	40% {transform:perspective(400px) rotateY(-10deg);}
	70% {transform:perspective(400px) rotateY(10deg);}
	100% {opacity:1;transform:perspective(400px) rotateY(0deg);}
}
.product-web-con{
	padding: 100px 0;
}
.product-web-con .product-web-text{
	width: 460px;
	float: left;
}
.product-web-con-right .product-web-text{
	float: right;
}
.product-web-title{
	color: #2b2b2b;
	font-size: 40px;
	font-family: 黑体;
	margin-top: 95px;
	padding: 20px 0;
}
.product-web-text{
	font-size: 18px;
	font-family: 黑体;
}
.product-web-con  .product-web-image{
	float: right;
	margin-right: 20px;
}
.product-web-con-right .product-web-image{
	float: left;
	margin-left: 30px;
}

.handle-icon{
	position: absolute;
	display: inline-block;
	width: 72px;
	height: 60px;
	background: url(../images/system/icon.png) no-repeat;
	background-position: -120px -330px;
	left: 50%;
	margin-left: 60px;
	bottom: -20px;
	animation: handle-ani 1.6s ease infinite;
	-webkit-animation: handle-ani 1.6s ease infinite;
	-moz-animation: handle-ani 1.6s ease infinite;
	-o-animation: handle-ani 1.6s ease infinite;
	webkit-transform: translate(40px,20px);
	-webkit-transform: translate(40px,20px);
	-moz-transform: translate(40px,20px);
	-o-transform: translate(40px,20px);
	opacity: 1;
}
@keyframes handle-ani {
	0% {transform: translate(40px,20px);}
	60% {transform: translate(0,0);}
	70% {transform: translate(1px,1px);}
	100% {transform: translate(0,0);}
}
@-webkit-keyframes handle-ani {
	0% {-webkit-transform: translate(40px,20px);}
	60% {-webkit-transform: translate(0,0);}
	70% {-webkit-transform: translate(1px,1px);}
	100% {-webkit-transform: translate(0,0);}
}
@-moz-keyframes handle-ani {
	0% {-moz-transform: translate(40px,20px);}
	60% {-moz-transform: translate(0,0);}
	70% {-moz-transform: translate(1px,1px);}
	100% {-moz-transform: translate(0,0);}
}
@-o-keyframes handle-ani {
	0% {-o-transform: translate(40px,20px);}
	60% {-o-transform: translate(0,0);}
	70% {-o-transform: translate(1px,1px);}
	100% {-o-transform: translate(0,0);}
}
.to-bottom{
	webkit-animation: bottom-ani 1s  forwards;
	-webkit-animation: bottom-ani 1s  forwards;
	-moz-animation: bottom-ani 1s forwards;
	-o-animation: bottom-ani 1s  forwards;
	transform: translate(0,-200px);
	margin-top: 6%;
}
@keyframes bottom-ani {
	0% {transform: translate(0,-200px);}
	100% {transform: translate(0,0);}
}
@-moz-keyframes bottom-ani {
	0% {-moz-transform: translate(0,-200px);}
	100% {-moz-transform: translate(0,0);}
}
@-webkit-keyframes bottom-ani {
	0% {-webkit-transform: translate(0,-200px);}
	100% {-webkit-transform: translate(0,0);}
}
@-o-keyframes bottom-ani {
	0% {-o-transform: translate(0,-200px);}
	100% {-o-transform: translate(0,0);}
}
/*---------------product.html--------------*/
.single-banner-image3{
	width: 42%;
	position:absolute;
	right: 0;
	bottom: 0;
	transform: translateX(220px);
	-webkit-transform: translateX(220px);
	-moz-transform: translateX(220px);
	-o-transform: translateX(220px);
	animation: sbanner2 1s .2s forwards linear;
	-webkit-animation:sbanner2 1s .2s forwards linear;
	-moz-animation:sbanner2 1s .2s forwards linear;
	-o-animation:sbanner2 1s .2s forwards linear;
}
@-webkit-keyframes sbanner2{
	0% {
		-webkit-transform: translateX(220px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0);
		opacity: 1;
	}
}
@-moz-keyframes sbanner2{
	0% {
		-moz-transform: translateX(220px);
		opacity: 0;
	}
	100% {
		-moz-transform: translateX(0);
		opacity: 1;
	}
}
@-o-keyframes sbanner2{
	0% {
		-o-transform: translateX(-220px);
		opacity: 0;
	}
	100% {
		-o-transform: translateX(0);
		opacity: 1;
	}
}
@keyframes sbanner2{
	0% {
		transform: translateX(220px);
		opacity: 0;
	}
	100% {
		transform: translateX(0);
		opacity: 1;
	}
}
.single-banner-image4{
	position:absolute;
	width:29.6%;
	position:absolute;
	top:30%;
	left: 50%;
	margin-left: -500px;
	-webkit-animation:flipInY 1s 1.2s ease both;
	-moz-animation:flipInY 1s 1.2s ease both;
	animation:flipInY 1s 1.2s ease both;
}
.product-program{
	text-align: center;
	padding: 80px 0;
}
.product-pro-title{
	font-size: 40px;
	margin-bottom: 40px;
}

.product-program-market-item{
	width: 180px;
	height: 90px;
	float: left;
	margin: 10px;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	-o-border-radius: 8px;
	-webkit-box-shadow:0px 0px 8px 6px #f6f6f6;
  -moz-box-shadow:0px 0px 8px 6px #f6f6f6;
	box-shadow: 0px 0px 8px 6px #f6f6f6;
}
.market-image{
	width: 180px;
	height: 90px;
}
.product-pro-des{
	margin: -20px 0 40px ;
}
.glay-bg{
	background: #fafafa;
}
.write-offs{
	text-align: center;
}
.write-off-item{
	display: inline-block;
	width: 300px;
	text-align: center;
	float: left;
	margin: 60px 0;
}
.write-off{
	display: inline-block;
	width: 200px;
	height: 200px;
	background: url(../images/system/icon.png) no-repeat;
	background-position: -120px -120px;
	position: relative;
	
}
.write-off-icon{
	display: inline-block;
	width: 120px;
	height: 120px;
	position: absolute;
	left: 40px;
	top: 40px;
	background: url(../images/system/icon.png) no-repeat;
	background-position: -120px -400px;
	transition: all 0.2s linear;
	-moz-transition:all 0.2s linear;
	-webkit-transition:all 0.2s linear;
	-o-transition:all 0.2s linear;
	-ms-transition: all 0.2s linear;
	cursor: pointer;
}
.write-off-icon-02{
	background-position: 0 -280px;
}
.write-off-icon-03{
	background-position: 0 -400px;
}
.write-off-icon-04{
	background-position: -120px 0;
	
}
.write-off-icon:hover{
	transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-o-transform: scale(1.2);
}
.write-off-text{
	font-size: 18px;
	font-family: "黑体";
	padding: 20px 0;
}
.red-con{
	height: 200px;
	background: #ff3939;
}