body{
	background-color: #f8f8f8;
}
#main .title h3{
	font-size: 45px;
	color: #333;
	font-weight: bold;
	font-family: "myriadbold";
	margin-bottom: 22px;
}
#main .title .line{
	width: 60px;
	height: 8px;
	background-color: #4087bd;
}
.sec1{
	padding: 180px 0 6.25%;
}
.sec1 .text{
	font-size: 16px;
	color: #666;
	line-height: 1.875;
	margin: 4.6% 0;
}
.sec1 ul{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	-webkit-display: flex;
	-webkit-align-items: flex-end;
	-webkit-justify-content: space-between;
	-moz-display: flex;
	-moz-align-items: flex-end;
	-moz-justify-content: space-between;
	-ms-display: flex;
	-ms-align-items: flex-end;
	-ms-justify-content: space-between;
	-o-display: flex;
	-o-align-items: flex-end;
	-o-justify-content: space-between;
}
.sec1 li{
	text-align: center;
	width: 42.7%;
}
.sec1 li .img-box{
	display: inline-block;
	position: relative;
}
.sec1 li .img-box .img{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
}
.sec1 li .img-box .bg{
	width: 100%;
}
.sec1 li .img1{
	width: 55.67%;
}
.sec1 li .img1 .img:nth-child(1),.sec1 li .img1 .img:nth-child(3){
	-webkit-animation: 5s linear 0s normal none infinite running rot;
	-moz-animation: 5s linear 0s normal none infinite running rot;
	-ms-animation: 5s linear 0s normal none infinite running rot;
	-moz-animation: 5s linear 0s normal none infinite running rot;
	animation: 5s linear 0s normal none infinite running rot;
}
.sec1 li .img1 .img:nth-child(2){
	-webkit-animation: 5s linear 0s normal none infinite running rot2;
	-moz-animation: 5s linear 0s normal none infinite running rot2;
	-ms-animation: 5s linear 0s normal none infinite running rot2;
	-moz-animation: 5s linear 0s normal none infinite running rot2;
	animation: 5s linear 0s normal none infinite running rot2;
}
@keyframes rot {
	0% {
	    transform: rotate(0deg);
	}
	100% {
	    transform: rotate(360deg);
	}
}
@-webkit-keyframes rot {
	0% {
	    -webkit-transform: rotate(0deg);
	}
	100% {
	    -webkit-transform: rotate(360deg);
	}
}
@-moz-keyframes rot {
	0% {
	    -moz-transform: rotate(0deg);
	}
	100% {
	    -moz-transform: rotate(360deg);
	}
}
@-ms-keyframes rot {
	0% {
	    -ms-transform: rotate(0deg);
	}
	100% {
	    -ms-transform: rotate(360deg);
	}
}
@-o-keyframes rot {
	0% {
	    -o-transform: rotate(0deg);
	}
	100% {
	    -o-transform: rotate(360deg);
	}
}
@keyframes rot2 {
	0% {
	    transform: rotate(0deg);
	}
	100% {
	    transform: rotate(-360deg);
	}
}
@-webkit-keyframes rot2 {
	0% {
	    -webkit-transform: rotate(0deg);
	}
	100% {
	    -webkit-transform: rotate(-360deg);
	}
}
@-moz-keyframes rot2 {
	0% {
	    -moz-transform: rotate(0deg);
	}
	100% {
	    -moz-transform: rotate(-360deg);
	}
}
@-ms-keyframes rot2 {
	0% {
	    -ms-transform: rotate(0deg);
	}
	100% {
	    -ms-transform: rotate(-360deg);
	}
}
@-o-keyframes rot2 {
	0% {
	    -o-transform: rotate(0deg);
	}
	100% {
	    -o-transform: rotate(-360deg);
	}
}
.sec1 li .img2{
	width: 74.59%;
}
.sec1 li .img2 img{
	opacity: 0;
}
.sec1 li .img2 .img.flat,.sec1 li .img2 .img.goods{
	opacity: 1;
}
.sec1 li .img2.active .img.cir{
	-webkit-animation: 2s linear 3s infinite showhide;
	-moz-animation: 2s linear 3s infinite showhide;
	-ms-animation: 2s linear 3s infinite showhide;
	-o-animation: 2s linear 3s infinite showhide;
	animation: 2s linear 3s infinite showhide;
}
.sec1 li .img2 .img.cover{
	overflow: hidden;
	opacity: 0;
}
.sec1 li .img2 .img.cover.cover1{
	width: 33.1%;
	left: 27.34%;
	top: 45.9%;
}
.sec1 li .img2 .img.cover.cover2{
	width: 38.61%;
	left: 47.48%;
	top: 49.18%;
}
.sec1 li .img2.active .img.cover{
	opacity: 1;
}
.sec1 li .img2 .img.cover img{
	position: static;
}
.sec1 li .img2.active .img.cover img{
	opacity: 1;
}
.sec1 li .img2 .img.cover div{
	position: absolute;
	background-color: #012955;
	height: 100%;
	width: 100%;
}
.sec1 li .img2 .img.cover.cover1 div{
	-webkit-transform: rotate(45deg) translateY(10%);
	-moz-transform: rotate(45deg) translateY(10%);
	-ms-transform: rotate(45deg) translateY(10%);
	-o-transform: rotate(45deg) translateY(10%);
	transform: rotate(45deg) translateY(10%);
	left: -100%;
	top: -100%;
}
.sec1 li .img2.active .img.cover.cover1 div{
	-webkit-animation: 4s linear 0.5s infinite cover1;
	-moz-animation: 4s linear 0.5s infinite cover1;
	-ms-animation: 4s linear 0.5s infinite cover1;
	-o-animation: 4s linear 0.5s infinite cover1;
	animation: 4s linear 0.5s infinite cover1;
}
.sec1 li .img2.active .img.cover.cover1 img{
	-webkit-transition: all 0s 1.25s;
	-moz-transition: all 0s 1.25s;
	-ms-transition: all 0s 1.25s;
	-o-transition: all 0s 1.25s;
	transition: all 0s 1.25s;
}
@keyframes cover1 {
	0% {
		left: -100%;
		top: -100%;
	}
	50% {
		left: 100%;
		top: 100%;
	}
	100% {
		left: 100%;
		top: 100%;
	}
}
@-webkit-keyframes cover1 {
	0% {
		left: -100%;
		top: -100%;
	}
	50% {
		left: 100%;
		top: 100%;
	}
	100% {
		left: 100%;
		top: 100%;
	}
}
@-moz-keyframes cover1 {
	0% {
		left: -100%;
		top: -100%;
	}
	50% {
		left: 100%;
		top: 100%;
	}
	100% {
		left: 100%;
		top: 100%;
	}
}
@-ms-keyframes cover1 {
	0% {
		left: -100%;
		top: -100%;
	}
	50% {
		left: 100%;
		top: 100%;
	}
	100% {
		left: 100%;
		top: 100%;
	}
}
@-o-keyframes cover1 {
	0% {
		left: -100%;
		top: -100%;
	}
	50% {
		left: 100%;
		top: 100%;
	}
	100% {
		left: 100%;
		top: 100%;
	}
}
.sec1 li .img2 .img.cover.cover2 div{
	-webkit-transform: rotate(-31deg) translateY(-10%);
	-moz-transform: rotate(-31deg) translateY(-10%);
	-ms-transform: rotate(-31deg) translateY(-10%);
	-o-transform: rotate(-31deg) translateY(-10%);
	transform: rotate(-31deg) translateY(-10%);
	left: -100%;
	top: 100%;
}
.sec1 li .img2.active .img.cover.cover2 div{
	-webkit-animation: 4s linear 1s infinite cover2;
	-moz-animation: 4s linear 1s infinite cover2;
	-ms-animation: 4s linear 1s infinite cover2;
	-o-animation: 4s linear 1s infinite cover2;
	animation: 4s linear 1s infinite cover2;
}
.sec1 li .img2.active .img.cover.cover2 img{
	-webkit-transition: all 0s 2.25s;
	-moz-transition: all 0s 2.25s;
	-ms-transition: all 0s 2.25s;
	-o-transition: all 0s 2.25s;
	transition: all 0s 2.25s;
}
@keyframes cover2 {
	0% {
		left: -100%;
		top: 100%;
	}
	50% {
		left: 100%;
		top: -100%;
	}
	100% {
		left: 100%;
		top: -100%;
	}
}
@-webkit-keyframes cover2 {
	0% {
		left: -100%;
		top: 100%;
	}
	50% {
		left: 100%;
		top: -100%;
	}
	100% {
		left: 100%;
		top: -100%;
	}
}
@-moz-keyframes cover2 {
	0% {
		left: -100%;
		top: 100%;
	}
	50% {
		left: 100%;
		top: -100%;
	}
	100% {
		left: 100%;
		top: -100%;
	}
}
@-ms-keyframes cover2 {
	0% {
		left: -100%;
		top: 100%;
	}
	50% {
		left: 100%;
		top: -100%;
	}
	100% {
		left: 100%;
		top: -100%;
	}
}
@-o-keyframes cover2 {
	0% {
		left: -100%;
		top: 100%;
	}
	50% {
		left: 100%;
		top: -100%;
	}
	100% {
		left: 100%;
		top: -100%;
	}
}
@keyframes showhide {
	0% {
	    opacity: 0;
	}
	50% {
	    opacity: 1;
	}
	100% {
	    opacity: 0;
	}
}
@-webkit-keyframes showhide {
	0% {
	    opacity: 0;
	}
	50% {
	    opacity: 1;
	}
	100% {
	    opacity: 0;
	}
}
@-moz-keyframes showhide {
	0% {
	    opacity: 0;
	}
	50% {
	    opacity: 1;
	}
	100% {
	    opacity: 0;
	}
}
@-ms-keyframes showhide {
	0% {
	    opacity: 0;
	}
	50% {
	    opacity: 1;
	}
	100% {
	    opacity: 0;
	}
}
@-o-keyframes showhide {
	0% {
	    opacity: 0;
	}
	50% {
	    opacity: 1;
	}
	100% {
	    opacity: 0;
	}
}
.sec1 li h5{
	font-size: 30px;
	color: #333;
	font-weight: bold;
	font-family: "myriadbold";
	margin: 8.5% 0 5.76%;
}
.sec1 li p{
	font-size: 16px;
	color: #666;
	line-height: 1.875;
	text-align: left;
}
.sec2{
	background-color: #ecf1f4;
	padding: 6.35% 0 4.32%;
}
.sec2 .text{
	font-size: 16px;
	color: #666;
	line-height: 1.875;
	margin: 4.6% 0;
}
.sec2 li{
	margin-bottom: 3.7%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	-webkit-display: flex;
	-webkit-align-items: center;
	-webkit-justify-content: space-between;
	-moz-display: flex;
	-moz-align-items: center;
	-moz-justify-content: space-between;
	-ms-display: flex;
	-ms-align-items: center;
	-ms-justify-content: space-between;
	-o-display: flex;
	-o-align-items: center;
	-o-justify-content: space-between;
}
.sec2 li:nth-child(odd){
	-webkit-flex-direction: row-reverse;
	-moz-flex-direction: row-reverse;
	-ms-flex-direction: row-reverse;
	-o-flex-direction: row-reverse;
	flex-direction: row-reverse;
}
.sec2 li:last-child{
	margin-bottom: 0;
}
.sec2 li .img-box{
	display: inline-block;
	position: relative;
}
.sec2 li .img-box .bg{
	width: 100%;
}
.sec2 li .img-box .img{
	position: absolute;
	left: 0;
	top: 0;
	opacity: 0;
}
.sec2 li .img-box.active .img{
	opacity: 1;
}
.sec2 li .img-box img{
	width: 100%;
}
.sec2 li .img1{
	width: 50.7%;
}
.sec2 li .img-box.img1.active .img{
	opacity: 1;
}
.sec2 li .img-box.img1.active .img:nth-child(1){
	-webkit-transition: all 1s 0.5s;
	-moz-transition: all 1s 0.5s;
	-ms-transition: all 1s 0.5s;
	-o-transition: all 1s 0.5s;
	transition: all 1s 0.5s;
}
.sec2 li .img-box.img1.active .img:nth-child(2){
	-webkit-transition: all 1s 1.5s;
	-moz-transition: all 1s 1.5s;
	-ms-transition: all 1s 1.5s;
	-o-transition: all 1s 1.5s;
	transition: all 1s 1.5s;
}
.sec2 li .img-box.img1.active .img:nth-child(3){
	-webkit-transition: all 1s 2.5s;
	-moz-transition: all 1s 2.5s;
	-ms-transition: all 1s 2.5s;
	-o-transition: all 1s 2.5s;
	transition: all 1s 2.5s;
}
.sec2 li .img2{
	width: 37.6%;
}
.sec2 li .img2 .flat{
	-webkit-transform: translateY(-10%);
	-moz-transform: translateY(-10%);
	-ms-transform: translateY(-10%);
	-o-transform: translateY(-10%);
	transform: translateY(-10%);
}
.sec2 li .img2.active .flat{
	-webkit-transform: translateY(0%);
	-moz-transform: translateY(0%);
	-ms-transform: translateY(0%);
	-o-transform: translateY(0%);
	transform: translateY(0%);
	-webkit-transition: all 1s 0.5s;
	-moz-transition: all 1s 0.5s;
	-ms-transition: all 1s 0.5s;
	-o-transition: all 1s 0.5s;
	transition: all 1s 0.5s;
}
.sec2 li .img2 .ok{
	width: 3.89%;
	-webkit-transform: translateY(50%);
	-moz-transform: translateY(50%);
	-ms-transform: translateY(50%);
	-o-transform: translateY(50%);
	transform: translateY(50%);
}
.sec2 li .img2 .ok1{
	left: 15.34%;
	top: 39.32%;
	-webkit-transition-delay: 1.5s;
	-moz-transition-delay: 1.5s;
	-ms-transition-delay: 1.5s;
	-o-transition-delay: 1.5s;
	transition-delay: 1.5s;
}
.sec2 li .img2 .ok2{
	left: 26.38%;
	top: 32.8125%;
	-webkit-transition-delay: 1.75s;
	-moz-transition-delay: 1.75s;
	-ms-transition-delay: 1.75s;
	-o-transition-delay: 1.75s;
	transition-delay: 1.75s;
}
.sec2 li .img2 .ok3{
	left: 38.855%;
	top: 25.52%;
	-webkit-transition-delay: 2s;
	-moz-transition-delay: 2s;
	-ms-transition-delay: 2s;
	-o-transition-delay: 2s;
	transition-delay: 2s;
}
.sec2 li .img2 .ok4{
	left: 50.31%;
	top: 20.3125%;
	-webkit-transition-delay: 2.25s;
	-moz-transition-delay: 2.25s;
	-ms-transition-delay: 2.25s;
	-o-transition-delay: 2.25s;
	transition-delay: 2.25s;
}
.sec2 li .img2 .ok5{
	left: 66.05%;
	top: 20.573%;
	-webkit-transition-delay: 2.5s;
	-moz-transition-delay: 2.5s;
	-ms-transition-delay: 2.5s;
	-o-transition-delay: 2.5s;
	transition-delay: 2.5s;
}
.sec2 li .img2 .ok6{
	left: 72.8%;
	top: 34.64%;
	-webkit-transition-delay: 2.75s;
	-moz-transition-delay: 2.75s;
	-ms-transition-delay: 2.75s;
	-o-transition-delay: 2.75s;
	transition-delay: 2.75s;
}
.sec2 li .img2 .ok7{
	left: 62.17%;
	top: 40.1%;
	-webkit-transition-delay: 3s;
	-moz-transition-delay: 3s;
	-ms-transition-delay: 3s;
	-o-transition-delay: 3s;
	transition-delay: 3s;
}
.sec2 li .img2 .ok8{
	left: 50.72%;
	top: 48.96%;
	-webkit-transition-delay: 3.25s;
	-moz-transition-delay: 3.25s;
	-ms-transition-delay: 3.25s;
	-o-transition-delay: 3.25s;
	transition-delay: 3.25s;
}
.sec2 li .img2 .ok9{
	left: 39.47%;
	top: 57.29%;
	-webkit-transition-delay: 3.5s;
	-moz-transition-delay: 3.5s;
	-ms-transition-delay: 3.5s;
	-o-transition-delay: 3.5s;
	transition-delay: 3.5s;
}
.sec2 li .img2.active .ok{
	z-index: 0;
	-webkit-transform: translateY(0%);
	-moz-transform: translateY(0%);
	-ms-transform: translateY(0%);
	-o-transform: translateY(0%);
	transform: translateY(0%);
	-webkit-transition-property: all;
	-webkit-transition-duration: 0.5s;
	-moz-transition-property: all;
	-moz-transition-duration: 0.5s;
	-ms-transition-property: all;
	-ms-transition-duration: 0.5s;
	-o-transition-property: all;
	-o-transition-duration: 0.5s;
	transition-property: all;
	transition-duration: 0.5s;
}
.sec2 li .img2 .people{
	-webkit-transform: translateX(5%) translateY(5%);
	-moz-transform: translateX(5%) translateY(5%);
	-ms-transform: translateX(5%) translateY(5%);
	-o-transform: translateX(5%) translateY(5%);
	transform: translateX(5%) translateY(5%);
}
.sec2 li .img2.active .people{
	-webkit-transform: translateX(0%) translateY(0%);
	-moz-transform: translateX(0%) translateY(0%);
	-ms-transform: translateX(0%) translateY(0%);
	-o-transform: translateX(0%) translateY(0%);
	transform: translateX(0%) translateY(0%);
	-webkit-transition: all 1s 4s;
	-moz-transition: all 1s 4s;
	-ms-transition: all 1s 4s;
	-o-transition: all 1s 4s;
	transition: all 1s 4s;
}
.sec2 li .img2.active .line{
	-webkit-transition: all 0.5s 5s;
	-moz-transition: all 0.5s 5s;
	-ms-transition: all 0.5s 5s;
	-o-transition: all 0.5s 5s;
	transition: all 0.5s 5s;
}
.sec2 li .img2 .forbidden{
	-webkit-transform: translateY(5%);
	-moz-transform: translateY(5%);
	-ms-transform: translateY(5%);
	-o-transform: translateY(5%);
	transform: translateY(5%);
}
.sec2 li .img2.active .forbidden{
	-webkit-transform: translateY(0%);
	-moz-transform: translateY(0%);
	-ms-transform: translateY(0%);
	-o-transform: translateY(0%);
	transform: translateY(0%);
	-webkit-transition: all 1s 5.5s;
	-moz-transition: all 1s 5.5s;
	-ms-transition: all 1s 5.5s;
	-o-transition: all 1s 5.5s;
	transition: all 1s 5.5s;
}
.sec2 li .img2.active .cir{
	opacity: 0;
	-webkit-animation: 2s linear 6.5s infinite showhide;
	-moz-animation: 2s linear 6.5s infinite showhide;
	-ms-animation: 2s linear 6.5s infinite showhide;
	-o-animation: 2s linear 6.5s infinite showhide;
	animation: 2s linear 6.5s infinite showhide;
}
.sec2 li .img3{
	width: 32.15%;
	overflow: hidden;
}
.sec2 li .img3 .line{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
}
.sec2 li .img3.active .line{
	-webkit-transition: all 0.5s 1s;
	-moz-transition: all 0.5s 1s;
	-ms-transition: all 0.5s 1s;
	-o-transition: all 0.5s 1s;
	transition: all 0.5s 1s;
	opacity: 1;
}
.sec2 li .img3.active .line .cover{
	-webkit-transition: all 1s 1.5s;
	-moz-transition: all 1s 1.5s;
	-ms-transition: all 1s 1.5s;
	-o-transition: all 1s 1.5s;
	transition: all 1s 1.5s;
	transform: scale(4,4);
}
.sec2 li .img3.active .img:nth-child(2){
	-webkit-transition: all 1s 0.5s;
	-moz-transition: all 1s 0.5s;
	-ms-transition: all 1s 0.5s;
	-o-transition: all 1s 0.5s;
	transition: all 1s 0.5s;
}
.sec2 li .img3.active .img:nth-child(3){
	-webkit-transition: all 0.5s 2s;
	-moz-transition: all 0.5s 2s;
	-ms-transition: all 0.5s 2s;
	-o-transition: all 0.5s 2s;
	transition: all 0.5s 2s;
}
.sec2 li .img3.active .img:nth-child(4){
	-webkit-transition: all 0.5s 2.25s;
	-moz-transition: all 0.5s 2.25s;
	-ms-transition: all 0.5s 2.25s;
	-o-transition: all 0.5s 2.25s;
	transition: all 0.5s 2.25s;
}
.sec2 li .img3.active .img:nth-child(5){
	-webkit-transition: all 0.5s 2.5s;
	-moz-transition: all 0.5s 2.5s;
	-ms-transition: all 0.5s 2.5s;
	-o-transition: all 0.5s 2.5s;
	transition: all 0.5s 2.5s;
}
.sec2 li .img3.active .img:nth-child(6){
	-webkit-transition: all 0.5s 2.75s;
	-moz-transition: all 0.5s 2.75s;
	-ms-transition: all 0.5s 2.75s;
	-o-transition: all 0.5s 2.75s;
	transition: all 0.5s 2.75s;
}
.sec2 li .img3.active .img:nth-child(7){
	-webkit-transition: all 0.5s 3s;
	-moz-transition: all 0.5s 3s;
	-ms-transition: all 0.5s 3s;
	-o-transition: all 0.5s 3s;
	transition: all 0.5s 3s;
}
.sec2 li .img3.active .img:nth-child(8){
	-webkit-transition: all 0.5s 3.25s;
	-moz-transition: all 0.5s 3.25s;
	-ms-transition: all 0.5s 3.25s;
	-o-transition: all 0.5s 3.25s;
	transition: all 0.5s 3.25s;
}
.sec2 li .img3.active .img:nth-child(9){
	-webkit-transition: all 0.5s 3.5s;
	-moz-transition: all 0.5s 3.5s;
	-ms-transition: all 0.5s 3.5s;
	-o-transition: all 0.5s 3.5s;
	transition: all 0.5s 3.5s;
}
.sec2 li .text-box{
	width: 51.5%;
}
.sec2 li .text-box h5{
	font-size: 30px;
	color: #333;
	font-weight: bold;
	font-family: "myriadbold";
	margin-bottom: 	4.48%;
}
.sec2 li .text-box p{
	font-size: 16px;
	color: #666;
	line-height: 1.875;
}
@media only screen and (max-width:768px){
	body{
		background-color: #fff;
	}
	#main .title h3{
		font-size: 1.40625rem;
		margin-bottom: 0.625rem;
	}
	#main .title .line{
		width: 1.875rem;
		height: 0.25rem;
	}
	.sec1{
		padding: 4.625rem 0 3.9375rem;
	}
	.sec1 .text{
		font-size: 0.6875rem;
		line-height: 1.125rem;
		margin: 1.5625rem 0 1.6875rem;
	}
	.sec1 ul{
		display: block;
		-webkit-display: block;
		-moz-display: block;
		-ms-display: block;
		-o-display: block;
	}
	.sec1 li{
		width: 100%;
	}
	.sec1 li:first-child{
		margin-bottom: 1.6875rem;
	}
	.sec1 li .img1{
		width: 44.78%;
	}
	.sec1 li .img2{
		width: 60%;
	}
	.sec1 li h5{
		font-size: 0.9375rem;
		margin: 1.375rem 0 1.125rem;
	}
	.sec1 li p{
		font-size: 0.6875rem;
		line-height: 1.125rem;
	}
	.sec2{
		padding: 2.9375rem 0 2.625rem;
	}
	.sec2 .text{
		font-size: 0.6875rem;
		line-height: 1.125rem;
		margin: 1.25rem 0 1.625rem;
	}
	.sec2 li{
		margin-bottom: 1.375rem;
		display: block;
		-webkit-display: block;
		-moz-display: block;
		-ms-display: block;
		-o-display: block;
		text-align: center;
	}
	.sec2 li .img1{
		width: 100%;
	}
	.sec2 li .img2{
		width: 70.86%;
	}
	.sec2 li .img3{
		width: 60.58%;
	}
	.sec2 li .text-box{
		width: 100%;
		padding-top: 2rem;
		text-align: left;
	}
	.sec2 li .text-box h5{
		font-size: 0.9375rem;
		margin-bottom: 	0.875rem;
	}
	.sec2 li .text-box p{
		font-size: 0.6875rem;
		line-height: 1.125rem;
	}
}