﻿@charset "utf-8";
/*动画*/
/*发射WiFi信号*/
.router-signal{
	position: absolute;
	z-index: 86;
	width: 64px;
	height:64px;
	background: url(../images/wifi2.png);
	-webkit-animation:wifiRun 900ms steps(3) infinite;
	-moz-animation:wifiRun 900ms steps(3) infinite;
	-ms-animation:wifiRun 900ms steps(3) infinite;
	animation:wifiRun 900ms steps(3) infinite;
}
@-webkit-keyframes wifiRun {
    0% {
    	background-position:0px -0%;
    }
    100% {
    	background-position:0px -300%;
    }
}
@-moz-keyframes wifiRun {
    0% {
    	background-position:0px -0%;
    }
    100% {
    	background-position:0px -300%;
    }
}
@-ms-keyframes wifiRun {
    0% {
    	background-position:0px -0%;
    }
    100% {
    	background-position:0px -300%;
    }
}
@keyframes wifiRun {
    0% {
    	background-position:0px -0%;
    }
    100% {
    	background-position:0px -300%;
    }
}
/*沙发位移*/
.active .sofa{
	-webkit-animation: sofaMove .8s cubic-bezier(0.4, 0, 1, 1);
	-moz-animation: sofaMove .8s cubic-bezier(0.4, 0, 1, 1);
	-ms-animation: sofaMove .8s cubic-bezier(0.4, 0, 1, 1);
	animation: sofaMove .8s cubic-bezier(0.4, 0, 1, 1);
}
@-webkit-keyframes sofaMove{
	from{
		top:45%;
	}
	to{
		top:28%;
	}
}
@-moz-keyframes sofaMove{
	from{
		top:45%;
	}
	to{
		top:28%;
	}
}
@-ms-keyframes sofaMove{
	from{
		top:45%;
	}
	to{
		top:28%;
	}
}
@keyframes sofaMove{
	from{
		top:45%;
	}
	to{
		top:28%;
	}
}
/*灯位移*/
.active .light{
	-webkit-animation: lightMove .8s cubic-bezier(0.4, 0, 1, 1);
	-moz-animation: lightMove .8s cubic-bezier(0.4, 0, 1, 1);
	-ms-animation: lightMove .8s cubic-bezier(0.4, 0, 1, 1);
	animation: lightMove .8s cubic-bezier(0.4, 0, 1, 1);
}
@-webkit-keyframes lightMove{
	from{
		top:20%;
	}
	to{
		top:7%;
	}
}
@-moz-keyframes lightMove{
	from{
		top:20%;
	}
	to{
		top:7%;
	}
}
@-ms-keyframes lightMove{
	from{
		top:20%;
	}
	to{
		top:7%;
	}
}
@keyframes lightMove{
	from{
		top:20%;
	}
	to{
		top:7%;
	}
}
.second-screen.active .check-data, .third-screen.active .check-data, .fourth-screen.active .check-data{
	-webkit-animation: scale09 8s linear 3s forwards;
	-moz-animation: scale09 8s linear 3s forwards;
	-ms-animation: scale09 8s linear 3s forwards;
	animation: scale09 8s linear 3s forwards;
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	-ms-transform:scale(1);
	transform:scale(1);
	opacity: 1;
}
.second-screen.active, .third-screen.active, .fourth-screen.active{
	-webkit-animation: screenScale 10s linear 1s forwards;
	-moz-animation: screenScale 10s linear 1s forwards;
	-ms-animation: screenScale 10s linear 1s forwards;
	animation: screenScale 10s linear 1s forwards;
	-webkit-transform: scale(1.0);
	-moz-transform: scale(1.0);
	-ms-transform: scale(1.0);
	transform: scale(1.0);
}
@-webkit-keyframes screenScale{
	from{
		transform:scale(1);
	}
	to{
		transform:scale(1.1);
	}
}
@-moz-keyframes screenScale{
	from{
		transform:scale(1);
	}
	to{
		transform:scale(1.1);
	}
}
@-ms-keyframes screenScale{
	from{
		transform:scale(1);
	}
	to{
		transform:scale(1.1);
	}
}
@keyframes screenScale{
	from{
		transform:scale(1);
	}
	to{
		transform:scale(1.1);
	}
}
.second-screen.active .title, .third-screen.active .title, .fourth-screen.active .title{
	-webkit-animation: scale09 8s linear 1s forwards;
	-moz-animation: scale09 8s linear 1s forwards;
	-ms-animation: scale09 8s linear 1s forwards;
	animation: scale09 8s linear 1s forwards;
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	-ms-transform:scale(1);
	transform:scale(1);
}
@-webkit-keyframes scale09{
	from{
		transform:scale(1);
	}
	to{
		transform:scale(0.9);
	}
}
@-moz-keyframes scale09{
	from{
		transform:scale(1);
	}
	to{
		transform:scale(0.9);
	}
}
@-ms-keyframes scale09{
	from{
		transform:scale(1);
	}
	to{
		transform:scale(0.9);
	}
}
@keyframes scale09{
	from{
		transform:scale(1);
	}
	to{
		transform:scale(0.9);
	}
}
/*第一屏智能家居数据动画*/
.first-screen.active li:nth-of-type(1) .check-value{
	-webkit-animation: fisTop1 3s ease 2s forwards;
	animation: fisTop1 3s ease 2s forwards;
	top:190px;
}
@-webkit-keyframes fisTop1{
	from{
		top:190px;
	}
	to{
		top:45px;
	}
}
@-moz-keyframes fisTop1{
	from{
		top:190px;
	}
	to{
		top:45px;
	}
}
@-ms-keyframes fisTop1{
	from{
		top:190px;
	}
	to{
		top:45px;
	}
}
@keyframes fisTop1{
	from{
		top:190px;
	}
	to{
		top:45px;
	}
}
.first-screen.active li:nth-of-type(2) .check-value{
	top:190px;
	-webkit-animation: fisTop2 3s ease 2s forwards;
	-moz-animation: fisTop2 3s ease 2s forwards;
	-ms-animation: fisTop2 3s ease 2s forwards;
	animation: fisTop2 3s ease 2s forwards;
}
@-webkit-keyframes fisTop2{
	from{
		top:150px;
	}
	to{
		top:4px;
	}
}
@-moz-keyframes fisTop2{
	from{
		top:150px;
	}
	to{
		top:4px;
	}
}
@-ms-keyframes fisTop2{
	from{
		top:150px;
	}
	to{
		top:4px;
	}
}
@keyframes fisTop2{
	from{
		top:150px;
	}
	to{
		top:4px;
	}
}
.first-screen.active li:nth-of-type(2) .check-value.move4-1-1{
	top:4px;
	-webkit-animation: fisTop411 3s ease 0s forwards;
	-moz-animation: fisTop411 3s ease 0s forwards;
	-ms-animation: fisTop411 3s ease 0s forwards;
	animation: fisTop411 3s ease 0s forwards;
}
@-webkit-keyframes fisTop411{
	from{
		top:4px;
	}
	to{
		top:70px;
	}
}
@keyframes fisTop411{
	from{
		top:4px;
	}
	to{
		top:70px;
	}
}
.first-screen.active li:nth-of-type(2) .check-value.move4-2-1{
	top:70px;
	-webkit-animation: fisTop421 3s ease 0s forwards;
	-moz-animation: fisTop421 3s ease 0s forwards;
	-ms-animation: fisTop421 3s ease 0s forwards;
	animation: fisTop421 3s ease 0s forwards;
}
@-webkit-keyframes fisTop421{
	from{
		top:70px;
	}
	to{
		top:4px;
	}
}
@keyframes fisTop421{
	from{
		top:70px;
	}
	to{
		top:4px;
	}
}
.first-screen.active li:nth-of-type(3) .check-value{
	top:190px;
	-webkit-animation: fisTop3 3s ease 2s forwards;
	-moz-animation: fisTop3 3s ease 2s forwards;
	-ms-animation: fisTop3 3s ease 2s forwards;
	animation: fisTop3 3s ease 2s forwards;
}
@-webkit-keyframes fisTop3{
	from{
		top:150px;
	}
	to{
		top:99px;
	}
}
@-moz-keyframes fisTop3{
	from{
		top:150px;
	}
	to{
		top:99px;
	}
}
@-ms-keyframes fisTop3{
	from{
		top:150px;
	}
	to{
		top:99px;
	}
}
@keyframes fisTop3{
	from{
		top:150px;
	}
	to{
		top:99px;
	}
}
.first-screen.active li:nth-of-type(3) .check-value.move4-1-2{
	top:128px;
	-webkit-animation: fisTop412 3s ease 0s forwards;
	-moz-animation: fisTop412 3s ease 0s forwards;
	-ms-animation: fisTop412 3s ease 0s forwards;
	animation: fisTop412 3s ease 0s forwards;
}
@-webkit-keyframes fisTop412{
	from{
		top:99px;
	}
	to{
		top:128px;
	}
}
@keyframes fisTop412{
	from{
		top:99px;
	}
	to{
		top:128px;
	}
}
.first-screen.active li:nth-of-type(3) .check-value.move4-2-2{
	top:99px;
	-webkit-animation: fisTop422 3s ease 0s forwards;
	-moz-animation: fisTop422 3s ease 0s forwards;
	-ms-animation: fisTop422 3s ease 0s forwards;
	animation: fisTop422 3s ease 0s forwards;
}
@-webkit-keyframes fisTop422{
	from{
		top:128px;
	}
	to{
		top:99px;
	}
}
@keyframes fisTop422{
	from{
		top:128px;
	}
	to{
		top:99px;
	}
}
.first-screen.active li .check-value label{
	top:190px;
	-webkit-animation: fisShowValue 5s ease 2s forwards;
	-moz-animation: fisShowValue 5s ease 2s forwards;
	-ms-animation: fisShowValue 5s ease 2s forwards;
	animation: fisShowValue 5s ease 2s forwards;
}
@-webkit-keyframes fisShowValue{
	from{
		opacity:0;
	}
	to{
		top:1;
	}
}
@-moz-keyframes fisShowValue{
	from{
		opacity:0;
	}
	to{
		top:1;
	}
}
@-ms-keyframes fisShowValue{
	from{
		opacity:0;
	}
	to{
		top:1;
	}
}
@keyframes fisShowValue{
	from{
		opacity:0;
	}
	to{
		top:1;
	}
}
/*第二屏智能家居数据动画*/
.second-screen.active li:nth-of-type(1) .check-value{
	top:190px;
	-webkit-animation: ssTop1 3s ease 2s forwards;
	-moz-animation: ssTop1 3s ease 2s forwards;
	-ms-animation: ssTop1 3s ease 2s forwards;
	animation: ssTop1 3s ease 2s forwards;
}
@-webkit-keyframes ssTop1{
	from{
		top:150px;
	}
	to{
		top:45px;
	}
}
@-moz-keyframes ssTop1{
	from{
		top:150px;
	}
	to{
		top:45px;
	}
}
@-ms-keyframes ssTop1{
	from{
		top:150px;
	}
	to{
		top:45px;
	}
}
@keyframes ssTop1{
	from{
		top:150px;
	}
	to{
		top:45px;
	}
}
.second-screen.active li:nth-of-type(2) .check-value{
	top:190px;
	-webkit-animation: ssTop2 3s ease 2s forwards;
	-moz-animation: ssTop2 3s ease 2s forwards;
	-ms-animation: ssTop2 3s ease 2s forwards;
	animation: ssTop2 3s ease 2s forwards;
}
@-webkit-keyframes ssTop2{
	from{
		top:150px;
	}
	to{
		top:0px;
	}
}
@-moz-keyframes ssTop2{
	from{
		top:150px;
	}
	to{
		top:0px;
	}
}
@-ms-keyframes ssTop2{
	from{
		top:150px;
	}
	to{
		top:0px;
	}
}
@keyframes ssTop2{
	from{
		top:150px;
	}
	to{
		top:0px;
	}
}
.second-screen.active li:nth-of-type(3) .check-value{
	top:190px;
	-webkit-animation: ssTop3 3s ease 2s forwards;
	-moz-animation: ssTop3 3s ease 2s forwards;
	-ms-animation: ssTop3 3s ease 2s forwards;
	animation: ssTop3 3s ease 2s forwards;
}
@-webkit-keyframes ssTop3{
	from{
		top:150px;
	}
	to{
		top:100px;
	}
}
@-moz-keyframes ssTop3{
	from{
		top:150px;
	}
	to{
		top:100px;
	}
}
@-ms-keyframes ssTop3{
	from{
		top:150px;
	}
	to{
		top:100px;
	}
}
@keyframes ssTop3{
	from{
		top:150px;
	}
	to{
		top:100px;
	}
}
.second-screen.active li .check-value label{
	-webkit-animation: ssShowValue 5s ease 2s forwards;
	-moz-animation: ssShowValue 5s ease 2s forwards;
	-ms-animation: ssShowValue 5s ease 2s forwards;
	animation: ssShowValue 5s ease 2s forwards;
}
@-webkit-keyframes ssShowValue{
	from{
		opacity:0;
	}
	to{
		top:1;
	}
}
@-moz-keyframes ssShowValue{
	from{
		opacity:0;
	}
	to{
		top:1;
	}
}
@-ms-keyframes ssShowValue{
	from{
		opacity:0;
	}
	to{
		top:1;
	}
}
@keyframes ssShowValue{
	from{
		opacity:0;
	}
	to{
		top:1;
	}
}
/*第三屏智能家居数据动画*/
.third-screen.active li:nth-of-type(1) .check-value{
	top:190px;
	-webkit-animation: thsTop1 3s ease 2s forwards;
	-moz-animation: thsTop1 3s ease 2s forwards;
	-ms-animation: thsTop1 3s ease 2s forwards;
	animation: thsTop1 3s ease 2s forwards;
}
@-webkit-keyframes thsTop1{
	from{
		top:150px;
	}
	to{
		top:45px;
	}
}
@-moz-keyframes thsTop1{
	from{
		top:150px;
	}
	to{
		top:45px;
	}
}
@-ms-keyframes thsTop1{
	from{
		top:150px;
	}
	to{
		top:45px;
	}
}
@keyframes thsTop1{
	from{
		top:150px;
	}
	to{
		top:45px;
	}
}
.third-screen.active li:nth-of-type(2) .check-value{
	top:190px;
	-webkit-animation: thsTop2 3s ease 2s forwards;
	-moz-animation: thsTop2 3s ease 2s forwards;
	-ms-animation: thsTop2 3s ease 2s forwards;
	animation: thsTop2 3s ease 2s forwards;
}
@-webkit-keyframes thsTop2{
	from{
		top:150px;
	}
	to{
		top:120px;
	}
}
@-moz-keyframes thsTop2{
	from{
		top:150px;
	}
	to{
		top:120px;
	}
}
@-ms-keyframes thsTop2{
	from{
		top:150px;
	}
	to{
		top:120px;
	}
}
@keyframes thsTop2{
	from{
		top:150px;
	}
	to{
		top:120px;
	}
}
.third-screen.active li:nth-of-type(3) .check-value{
	top:190px;
	-webkit-animation: thsTop3 3s ease 2s forwards;
	-moz-animation: thsTop3 3s ease 2s forwards;
	-ms-animation: thsTop3 3s ease 2s forwards;
	animation: thsTop3 3s ease 2s forwards;
}
@-webkit-keyframes thsTop3{
	from{
		top:150px;
	}
	to{
		top:62px;
	}
}
@-moz-keyframes thsTop3{
	from{
		top:150px;
	}
	to{
		top:62px;
	}
}
@-ms-keyframes thsTop3{
	from{
		top:150px;
	}
	to{
		top:62px;
	}
}
@keyframes thsTop3{
	from{
		top:150px;
	}
	to{
		top:62px;
	}
}
.third-screen.active li .check-value label{
	-webkit-animation: thsShowValue 5s ease 2s forwards;
	-moz-animation: thsShowValue 5s ease 2s forwards;
	-ms-animation: thsShowValue 5s ease 2s forwards;
	animation: thsShowValue 5s ease 2s forwards;
}
@-webkit-keyframes thsShowValue{
	from{
		opacity:0;
	}
	to{
		top:1;
	}
}
@-moz-keyframes thsShowValue{
	from{
		opacity:0;
	}
	to{
		top:1;
	}
}
@-ms-keyframes thsShowValue{
	from{
		opacity:0;
	}
	to{
		top:1;
	}
}
@keyframes thsShowValue{
	from{
		opacity:0;
	}
	to{
		top:1;
	}
}
/*首页第四屏智能家居数据动画*/
/*首页第四屏机器1的数值变化动画*/
.fourth-screen.active li:nth-of-type(1) .check-value{
	top:190px;
	-webkit-animation: fosTop1 3s ease 2s forwards;
	-moz-animation: fosTop1 3s ease 2s forwards;
	-ms-animation: fosTop1 3s ease 2s forwards;
	animation: fosTop1 3s ease 2s forwards;
}
@-webkit-keyframes fosTop1{
	from{
		top:150px;
	}
	to{
		top:0px;
	}
}
@-moz-keyframes fosTop1{
	from{
		top:150px;
	}
	to{
		top:0px;
	}
}
@-ms-keyframes fosTop1{
	from{
		top:150px;
	}
	to{
		top:0px;
	}
}
@keyframes fosTop1{
	from{
		top:150px;
	}
	to{
		top:0px;
	}
}
/*首页第四屏机器2的数值变化动画*/
.fourth-screen.active li:nth-of-type(2) .check-value{
	top:190px;
	-webkit-animation: fosTop2 3s ease 2s forwards;
	-moz-animation: fosTop2 3s ease 2s forwards;
	-ms-animation: fosTop2 3s ease 2s forwards;
	animation: fosTop2 3s ease 2s forwards;
}
@-webkit-keyframes fosTop2{
	from{
		top:150px;
	}
	to{
		top:54px;
	}
}
@-moz-keyframes fosTop2{
	from{
		top:150px;
	}
	to{
		top:54px;
	}
}
@-ms-keyframes fosTop2{
	from{
		top:150px;
	}
	to{
		top:54px;
	}
}
@keyframes fosTop2{
	from{
		top:150px;
	}
	to{
		top:54px;
	}
}
/*首页第四屏机器3的数值变化动画*/
.fourth-screen.active li:nth-of-type(3) .check-value{
	top:190px;
	-webkit-animation: fosTop3 3s ease 2s forwards;
	-moz-animation: fosTop3 3s ease 2s forwards;
	-ms-animation: fosTop3 3s ease 2s forwards;
	animation: fosTop3 3s ease 2s forwards;
}
@-webkit-keyframes fosTop3{
	from{
		top:150px;
	}
	to{
		top:99px;
	}
}
@-moz-keyframes fosTop3{
	from{
		top:150px;
	}
	to{
		top:99px;
	}
}
@-ms-keyframes fosTop3{
	from{
		top:150px;
	}
	to{
		top:99px;
	}
}
@keyframes fosTop3{
	from{
		top:150px;
	}
	to{
		top:99px;
	}
}
.fourth-screen.active li .check-value label{
	-webkit-animation: fosShowValue 5s ease 2s forwards;
	-moz-animation: fosShowValue 5s ease 2s forwards;
	-ms-animation: fosShowValue 5s ease 2s forwards;
	animation: fosShowValue 5s ease 2s forwards;
}
@-webkit-keyframes fosShowValue{
	from{
		opacity:0;
	}
	to{
		top:1;
	}
}
@-moz-keyframes fosShowValue{
	from{
		opacity:0;
	}
	to{
		top:1;
	}
}
@-ms-keyframes fosShowValue{
	from{
		opacity:0;
	}
	to{
		top:1;
	}
}
@keyframes fosShowValue{
	from{
		opacity:0;
	}
	to{
		top:1;
	}
}
/*椅子位移*/
.active .chair{
	-webkit-animation: chairMove .8s cubic-bezier(0.4, 0, 1, 1);
	-moz-animation: chairMove .8s cubic-bezier(0.4, 0, 1, 1);
	-ms-animation: chairMove .8s cubic-bezier(0.4, 0, 1, 1);
	animation: chairMove .8s cubic-bezier(0.4, 0, 1, 1);
}
@-webkit-keyframes chairMove{
	from{
		bottom:-10%;
	}
	to{
		bottom:0;
	}
}
@-moz-keyframes chairMove{
	from{
		bottom:-10%;
	}
	to{
		bottom:0%;
	}
}
@-ms-keyframes chairMove{
	from{
		bottom:-10%;
	}
	to{
		bottom:0%;
	}
}
@keyframes chairMove{
	from{
		bottom:-10%;
	}
	to{
		bottom:0%;
	}
}
/*父子位移*/
.active .person{
	-webkit-animation: personMove .6s cubic-bezier(0.4, 0, 1, 1);
	-moz-animation: personMove .6s cubic-bezier(0.4, 0, 1, 1);
	-ms-animation: personMove .6s cubic-bezier(0.4, 0, 1, 1);
	animation: personMove .6s cubic-bezier(0.4, 0, 1, 1);
}
@-webkit-keyframes personMove{
	from{
		top:22%;
	}
	to{
		top:9%;
	}
}
@-moz-keyframes personMove{
	from{
		top:22%;
	}
	to{
		top:9%;
	}
}
@-ms-keyframes personMove{
	from{
		top:22%;
	}
	to{
		top:9%;
	}
}
@keyframes personMove{
	from{
		top:22%;
	}
	to{
		top:9%;
	}
}
/*树位移*/
.active .tree{
	-webkit-animation: treeMove .8s cubic-bezier(0.4, 0, 1, 1);
	-moz-animation: treeMove .8s cubic-bezier(0.4, 0, 1, 1);
	-ms-animation: treeMove .8s cubic-bezier(0.4, 0, 1, 1);
	animation: treeMove .8s cubic-bezier(0.4, 0, 1, 1);
}
@-webkit-keyframes treeMove{
	from{
		bottom:-10%;
	}
	to{
		bottom:0;
	}
}
@-moz-keyframes treeMove{
	from{
		bottom:-10%;
	}
	to{
		bottom:0;
	}
}
@-ms-keyframes treeMove{
	from{
		bottom:-10%;
	}
	to{
		bottom:0;
	}
}
@keyframes treeMove{
	from{
		bottom:-10%;
	}
	to{
		bottom:0;
	}
}
/*草位移*/
.active .grass{
	-webkit-animation: grassMove .8s cubic-bezier(0.4, 0, 1, 1);
	-moz-animation: grassMove .8s cubic-bezier(0.4, 0, 1, 1);
	-ms-animation: grassMove .8s cubic-bezier(0.4, 0, 1, 1);
	animation: grassMove .8s cubic-bezier(0.4, 0, 1, 1);
}
@-webkit-keyframes grassMove{
	from{
		bottom:-10%;
	}
	to{
		bottom:0;
	}
}
@-moz-keyframes grassMove{
	from{
		bottom:-10%;
	}
	to{
		bottom:0;
	}
}
@-ms-keyframes grassMove{
	from{
		bottom:-10%;
	}
	to{
		bottom:0%;
	}
}
@keyframes grassMove{
	from{
		bottom:-10%;
	}
	to{
		bottom:0%;
	}
}
/*母子位移*/
.active .person2{
	-webkit-animation: person2Move .6s cubic-bezier(0.4, 0, 1, 1);
	-moz-animation: person2Move .6s cubic-bezier(0.4, 0, 1, 1);
	-ms-animation: person2Move .6s cubic-bezier(0.4, 0, 1, 1);
	animation: person2Move .6s cubic-bezier(0.4, 0, 1, 1);
}
@-webkit-keyframes person2Move{
	from{
		bottom:-10%;
	}
	to{
		bottom:0%;
	}
}
@-moz-keyframes person2Move{
	from{
		bottom:-10%;
	}
	to{
		bottom:0%;
	}
}
@-ms-keyframes person2Move{
	from{
		bottom:-10%;
	}
	to{
		bottom:0%;
	}
}
@keyframes person2Move{
	from{
		bottom:-10%;
	}
	to{
		bottom:0%;
	}
}
/*首页第五屏产品图4位移动画*/
.overview .fifth-screen.active .cm-router{
	z-index: 1;
	-webkit-animation: fisImgTop4 2s ease;
	-moz-animation: fisImgTop4 2s ease;
	-ms-animation: fisImgTop4 2s ease;
	animation: fisImgTop4 2s ease;
}
@-webkit-keyframes fisImgTop4{
	from{
		top:200px;	
	}
	to{
		top:0;
	}
}
@-moz-keyframes fisImgTop4{
	from{
		top:200px;	
	}
	to{
		top:0;
	}
}
@-ms-keyframes fisImgTop4{
	from{
		top:200px;	
	}
	to{
		top:0;
	}
}
@keyframes fisImgTop4{
	from{
		top:200px;	
	}
	to{
		top:0;
	}
}
/*首页第五屏产品图3,5的位移动画*/
.overview .fifth-screen.active .honour-box, .overview .fifth-screen.active .switch{
	-webkit-animation: fisImgTop3 3s ease;
	-moz-animation: fisImgTop3 3s ease;
	-ms-animation: fisImgTop3 3s ease;
	animation: fisImgTop3 3s ease;
}
@-webkit-keyframes fisImgTop3{
	from{
		top:300px;	
	}
	to{
		top:0px;
	}
}
@-moz-keyframes fisImgTop3{
	from{
		top:300px;	
	}
	to{
		top:0px;
	}
}
@-ms-keyframes fisImgTop3{
	from{
		top:300px;	
	}
	to{
		top:0px;
	}
}
@keyframes fisImgTop3{
	from{
		top:300px;	
	}
	to{
		top:0px;
	}
}
/*首页第五屏产品图2,6的位移动画*/
.overview .fifth-screen.active .lampblack-machine, .overview .fifth-screen.active .bjq{
	-webkit-animation: fisImgTop2 3.5s ease;
	-moz-animation: fisImgTop2 3.5s ease;
	-ms-animation: fisImgTop2 3.5s ease;
	animation: fisImgTop2 3.5s ease;
}
@-webkit-keyframes fisImgTop2{
	from{
		top:400px;	
	}
	to{
		top:0px;
	}
}
@-moz-keyframes fisImgTop2{
	from{
		top:400px;	
	}
	to{
		top:0px;
	}
}
@-ms-keyframes fisImgTop2{
	from{
		top:400px;	
	}
	to{
		top:0px;
	}
}
@keyframes fisImgTop2{
	from{
		top:400px;	
	}
	to{
		top:0px;
	}
}
/*首页第五屏产品图1,7的位移动画*/
.overview .fifth-screen.active .electonic-balance, .overview .fifth-screen.active .f-light{
	-webkit-animation: fisImgTop1 4s ease;
	-moz-animation: fisImgTop1 4s ease;
	-ms-animation: fisImgTop1 4s ease;
	animation: fisImgTop1 4s ease;
}
@-webkit-keyframes fisImgTop1{
	from{
		top: 500px;	
	}
	to{
		top: 0;
	}
}
@-moz-keyframes fisImgTop1{
	from{
		top: 500px;	
	}
	to{
		top:0;
	}
}
@-ms-keyframes fisImgTop1{
	from{
		top: 500px;	
	}
	to{
		top:0;
	}
}
@keyframes fisImgTop1{
	from{
		top: 500px;		
	}
	to{
		top: 0;	
	}
}
/*首页初始化动画-两图同屏分切*/
.twentytwenty-before{
	-webkit-animation: initAnimate 3s linear 100ms 1;
	-moz-animation: initAnimate 3s linear 100ms 1;
	-ms-animation: initAnimate 3s linear 100ms 1;
	animation: initAnimate 3s linear 100ms 1;
}
@-webkit-keyframes initAnimate{
	from{
		clip: rect(0px 970px 1070px 0px);
	}
	50%{
		clip: rect(0px 30px 1070px 0px);
	}
	to{
		clip: rect(0px 970px 1070px 0px);
	}
}
@-moz-keyframes initAnimate{
	from{
		clip: rect(0px 970px 1070px 0px);
	}
	50%{
		clip: rect(0px 30px 1070px 0px);
	}
	to{
		clip: rect(0px 970px 1070px 0px);
	}
}
@-ms-keyframes initAnimate{
	from{
		clip: rect(0px 970px 1070px 0px);
	}
	50%{
		clip: rect(0px 30px 1070px 0px);
	}
	to{
		clip: rect(0px 970px 1070px 0px);
	}
}
@keyframes initAnimate{
	from{
		clip: rect(0px 970px 1070px 0px);
	}
	50%{
		clip: rect(0px 30px 1070px 0px);
	}
	to{
		clip: rect(0px 970px 1070px 0px);
	}
}
.twentytwenty-handle{
	-webkit-animation: initAnimate2 3s linear 100ms 1;
	-moz-animation: initAnimate2 3s linear 100ms 1;
	-ms-animation: initAnimate2 3s linear 100ms 1;
	animation: initAnimate2 3s linear 100ms 1;
}
@-webkit-keyframes initAnimate2{
	from{
		left:970px;
	}
	50%{
		left:30px;
	}
	to{
		left:970px;
	}
}
@-moz-keyframes initAnimate2{
	from{
		left:970px;
	}
	50%{
		left:30px;
	}
	to{
		left:970px;
	}
}
@-ms-keyframes initAnimate2{
	from{
		left:970px;
	}
	50%{
		left:30px;
	}
	to{
		left:970px;
	}
}
@keyframes initAnimate2{
	from{
		left:970px;
	}
	50%{
		left:30px;
	}
	to{
		left:970px;
	}
}
/*路由器第一屏子母路由器的上下位移*/
.hilink-router1{
	position: absolute;
	top:-20%;
	right:5%;
	-webkit-animation: suspension1 4s ease-in-out alternate infinite;
	-moz-animation: suspension1 4s ease-in-out alternate infinite;
	-ms-animation: suspension1 4s ease-in-out alternate infinite;
	animation: suspension1 4s ease-in-out alternate infinite;
}
@-webkit-keyframes suspension1{
	from{
		top:-2%;
	}
	to{
		top:-9%;
	}
}
@-moz-keyframes suspension1{
	from{
		top:-2%;
	}
	to{
		top:-9%;
	}
}
@-ms-keyframes suspension1{
	from{
		top:-2%;
	}
	to{
		top:-9%;
	}
}
@keyframes suspension1{
	from{
		top:-2%;
	}
	to{
		top:-9%;
	}
}
.hilink-router2{
	position: absolute;
	bottom: 8%;
	right:22%;
	-webkit-animation: suspension2 6s ease-in-out alternate infinite;
	-moz-animation: suspension2 6s ease-in-out alternate infinite;
	-ms-animation: suspension2 6s ease-in-out alternate infinite;
	animation: suspension2 6s ease-in-out alternate infinite;
}
@-webkit-keyframes suspension2{
	from{
		bottom:10%;
	}
	to{
		bottom:1%;
	}
}
@-moz-keyframes suspension2{
	from{
		bottom:10%;
	}
	to{
		bottom:1%;
	}
}
@-ms-keyframes suspension2{
	from{
		bottom:10%;
	}
	to{
		bottom:1%;
	}
}
@keyframes suspension2{
	from{
		bottom:10%;
	}
	to{
		bottom:1%;
	}
}

/*首页第五屏放射状动画*/
.fifth-screen.active .circle .circle-a {
	border: 2px solid rgba(74, 144, 226, .6);
	background-color:rgba(74, 144, 226, .7);
    -webkit-animation: linkWifi 4.5s ease-out forwards infinite;
    -moz-animation: linkWifi 4.5s ease-out forwards infinite;
    -ms-animation: linkWifi 4.5s ease-out forwards infinite;
    animation: linkWifi 4.5s ease-out forwards infinite;
}
.fifth-screen.active .circle .circle-b {
	border: 2px solid rgba(74, 144, 226, .4);
	background-color:rgba(74, 144, 226, .5);
    -webkit-animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
    -moz-animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
    -ms-animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
    animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
}
.fifth-screen.active .circle .circle-c {
	border: 2px solid rgba(74, 144, 226, .2);
	background-color:rgba(74, 144, 226, .3);
    -webkit-animation: linkWifi 4.5s ease-out 3s forwards infinite;
    -moz-animation: linkWifi 4.5s ease-out 3s forwards infinite;
    -ms-animation: linkWifi 4.5s ease-out 3s forwards infinite;
    animation: linkWifi 4.5s ease-out 3s forwards infinite;
}
/*鼠标移动到子母路由器时显示WiFi信号*/
.hilink-m:hover .link-wifi-a, .hilink-s:hover .link-wifi-a, .hilink-m.hover .link-wifi-a, .hilink-s.hover .link-wifi-a {
	border: 2px solid rgba(255, 255, 255, .6);
	background-color:rgba(255, 255, 255, .5);
    -webkit-animation: linkWifi 4.5s ease-out forwards infinite;
    -moz-animation: linkWifi 4.5s ease-out forwards infinite;
    -ms-animation: linkWifi 4.5s ease-out forwards infinite;
    animation: linkWifi 4.5s ease-out forwards infinite;
}
.hilink-m:hover .link-wifi-b, .hilink-s:hover .link-wifi-b, .hilink-m.hover .link-wifi-b, .hilink-s.hover .link-wifi-b {
	border: 2px solid rgba(255, 255, 255, .4);
	background-color:rgba(255, 255, 255, .3);
    -webkit-animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
    -moz-animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
    -ms-animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
    animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
}
.hilink-m:hover .link-wifi-c, .hilink-s:hover .link-wifi-c, .hilink-m.hover .link-wifi-c, .hilink-s.hover .link-wifi-c {
	border: 2px solid rgba(255, 255, 255, .2);
	background-color:rgba(255, 255, 255, .1);
    -webkit-animation: linkWifi 4.5s ease-out 3s forwards infinite;
    -moz-animation: linkWifi 4.5s ease-out 3s forwards infinite;
    -ms-animation: linkWifi 4.5s ease-out 3s forwards infinite;
    animation: linkWifi 4.5s ease-out 3s forwards infinite;
}
/*户型选择-大小圆扩散*/
/*小户型信号动画*/
.apartment-wifi-s .apartment-wifi-a{
	border: 2px solid rgba(74, 144, 226, .6);
	background-color:rgba(74, 144, 226, .7);
    -webkit-animation: linkWifi 4.5s ease-out forwards infinite;
    -moz-animation: linkWifi 4.5s ease-out forwards infinite;
    -ms-animation: linkWifi 4.5s ease-out forwards infinite;
    animation: linkWifi 4.5s ease-out forwards infinite;
}
.apartment-wifi-s .apartment-wifi-b {
	border: 2px solid rgba(74, 144, 226, .4);
	background-color:rgba(74, 144, 226, .5);
    -webkit-animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
    -moz-animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
    -ms-animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
    animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
}
.apartment-wifi-s .apartment-wifi-c {
	border: 2px solid rgba(74, 144, 226, .2);
	background-color:rgba(74, 144, 226, .3);
    -webkit-animation: linkWifi 4.5s ease-out 3s forwards infinite;
    -moz-animation: linkWifi 4.5s ease-out 3s forwards infinite;
    -ms-animation: linkWifi 4.5s ease-out 3s forwards infinite;
    animation: linkWifi 4.5s ease-out 3s forwards infinite;
}
/*中户型信号动画*/
.apartment-wifi-m .apartment-wifi-a{
	border: 2px solid rgba(74, 144, 226, .6);
	background-color:rgba(74, 144, 226, .7);
    -webkit-animation: linkWifi 4.5s ease-out forwards infinite;
    -moz-animation: linkWifi 4.5s ease-out forwards infinite;
    -ms-animation: linkWifi 4.5s ease-out forwards infinite;
    animation: linkWifi 4.5s ease-out forwards infinite;
}
.apartment-wifi-m .apartment-wifi-b {
	border: 2px solid rgba(74, 144, 226, .4);
	background-color:rgba(74, 144, 226, .5);
    -webkit-animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
    -moz-animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
    -ms-animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
    animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
}
.apartment-wifi-m .apartment-wifi-c {
	border: 2px solid rgba(74, 144, 226, .2);
	background-color:rgba(74, 144, 226, .3);
    -webkit-animation: linkWifi 4.5s ease-out 3s forwards infinite;
    -moz-animation: linkWifi 4.5s ease-out 3s forwards infinite;
    -ms-animation: linkWifi 4.5s ease-out 3s forwards infinite;
    animation: linkWifi 4.5s ease-out 3s forwards infinite;
}
/*大户型信号动画-大小圆*/
.apartment-wifi-ll .apartment-wifi-a, .apartment-wifi-ls .apartment-wifi-a {
	border: 2px solid rgba(74, 144, 226, .6);
	background-color:rgba(74, 144, 226, .7);
    -webkit-animation: linkWifi 4.5s ease-out forwards infinite;
    -moz-animation: linkWifi 4.5s ease-out forwards infinite;
    -ms-animation: linkWifi 4.5s ease-out forwards infinite;
    animation: linkWifi 4.5s ease-out forwards infinite;
}
.apartment-wifi-ll .apartment-wifi-b, .apartment-wifi-ls .apartment-wifi-b {
	border: 2px solid rgba(74, 144, 226, .4);
	background-color:rgba(74, 144, 226, .5);
    -webkit-animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
    -moz-animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
    -ms-animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
    animation: linkWifi 4.5s ease-out 1.5s forwards infinite;
}
.apartment-wifi-ll .apartment-wifi-c, .apartment-wifi-ls .apartment-wifi-c {
	border: 2px solid rgba(74, 144, 226, .2);
	background-color:rgba(74, 144, 226, .3);
    -webkit-animation: linkWifi 4.5s ease-out 3s forwards infinite;
    -moz-animation: linkWifi 4.5s ease-out 3s forwards infinite;
    -ms-animation: linkWifi 4.5s ease-out 3s forwards infinite;
    animation: linkWifi 4.5s ease-out 3s forwards infinite;
}
@-webkit-keyframes linkWifi {
    0% {
        -webkit-transform: scale(0.8);
        -moz-transform: scale(0.8);
        -ms-transform: scale(0.8);
        transform: scale(0.8);
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    100% {
        -webkit-transform: scale(1.5);
        -moz-transform: scale(1.5);
        -ms-transform: scale(1.5);
        transform: scale(1.5);
        opacity: 0;
    }
}
@-moz-keyframes linkWifi {
    0% {
        -webkit-transform: scale(0.8);
        -moz-transform: scale(0.8);
        -ms-transform: scale(0.8);
        transform: scale(0.8);
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    100% {
        -webkit-transform: scale(1.5);
        -moz-transform: scale(1.5);
        -ms-transform: scale(1.5);
        transform: scale(1.5);
        opacity: 0;
    }
}
@-ms-keyframes linkWifi {
    0% {
        -webkit-transform: scale(0.8);
        -moz-transform: scale(0.8);
        -ms-transform: scale(0.8);
        transform: scale(0.8);
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    100% {
        -webkit-transform: scale(1.5);
        -moz-transform: scale(1.5);
        -ms-transform: scale(1.5);
        transform: scale(1.5);
        opacity: 0;
    }
}
@keyframes linkWifi {
    0% {
        -webkit-transform: scale(0.8);
        -moz-transform: scale(0.8);
        -ms-transform: scale(0.8);
        transform: scale(0.8);
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    100% {
        -webkit-transform: scale(1.5);
        -moz-transform: scale(1.5);
        -ms-transform: scale(1.5);
        transform: scale(1.5);
        opacity: 0;
    }
}