/* 织梦58（dede58.com）做最好的织梦整站模板下载网站 */
@charset "utf-8";
html {
	position: relative;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	width: 100%
}
body {
	position: relative;
	width: 100%;
	background: #fff;
	font-size: 14px;
	font-family: "Microsoft YaHei", Arial, Helvetica
}
.container, .navbar-fixed-bottom, .navbar-fixed-top, .navbar-static-top, body {
	min-width: 1020px
}
.navbar {
	margin-bottom: 0
}
.navbar-brand {
	height: 86px;
	font-size: 24px;
	line-height: 56px
}
.navbar-brand>img {
	display: inline-block
}
.nav {
	font-size: 18px
}
.nav.navbar-default>li>a {
	padding: 29px 20px 33px
}
.navbar-nav>li>a {
	padding-top: 29px;
	padding-bottom: 33px
}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover, .navbar-default.s0 .navbar-nav>.active>a, .navbar-default.s0 .navbar-nav>.active>a:focus, .navbar-default.s0 .navbar-nav>.active>a:hover, .navbar-default.s1 .navbar-nav>.active>a, .navbar-default.s1 .navbar-nav>.active>a:focus, .navbar-default.s1 .navbar-nav>.active>a:hover, .navbar-default.s2 .navbar-nav>.active>a, .navbar-default.s2 .navbar-nav>.active>a:focus, .navbar-default.s2 .navbar-nav>.active>a:hover, .navbar-default.s3 .navbar-nav>.active>a, .navbar-default.s3 .navbar-nav>.active>a:focus, .navbar-default.s3 .navbar-nav>.active>a:hover, .navbar-default.s4 .navbar-nav>.active>a, .navbar-default.s4 .navbar-nav>.active>a:focus, .navbar-default.s4 .navbar-nav>.active>a:hover, .navbar-default.s5 .navbar-nav>.active>a, .navbar-default.s5 .navbar-nav>.active>a:focus, .navbar-default.s5 .navbar-nav>.active>a:hover {
	background-color: transparent;
	border-top: 5px solid transparent;
	color: #017ce1
}
.navbar-default.s1 .navbar-nav>.active>a, .navbar-default.s1 .navbar-nav>.active>a:focus, .navbar-default.s1 .navbar-nav>.active>a:hover {
	color: #017ce1
}
.navbar-default .navbar-nav>li>a, .navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover, .navbar-default.s0 .navbar-nav>li>a, .navbar-default.s0 .navbar-nav>li>a:focus, .navbar-default.s0 .navbar-nav>li>a:hover {
	background-color: none;
	border-top: 5px solid transparent;
	color: #fff
}
.navbar-default.s1 .navbar-nav>li>a, .navbar-default.s1 .navbar-nav>li>a:focus, .navbar-default.s1 .navbar-nav>li>a:hover, .navbar-default.s2 .navbar-nav>li>a, .navbar-default.s2 .navbar-nav>li>a:focus, .navbar-default.s2 .navbar-nav>li>a:hover, .navbar-default.s3 .navbar-nav>li>a, .navbar-default.s3 .navbar-nav>li>a:focus, .navbar-default.s3 .navbar-nav>li>a:hover, .navbar-default.s4 .navbar-nav>li>a, .navbar-default.s4 .navbar-nav>li>a:focus, .navbar-default.s4 .navbar-nav>li>a:hover, .navbar-default.s5 .navbar-nav>li>a, .navbar-default.s5 .navbar-nav>li>a:focus, .navbar-default.s5 .navbar-nav>li>a:hover {
	color: #000
}
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover, .navbar-default .navbar-nav>li>a.dropdown-toggle, .navbar-default .navbar-nav>li>a:focus.dropdown-toggle, .navbar-default .navbar-nav>li>a:hover.dropdown-toggle, .navbar-default.s0 .navbar-nav>.open>a, .navbar-default.s0 .navbar-nav>.open>a:focus, .navbar-default.s0 .navbar-nav>.open>a:hover, .navbar-default.s0 .navbar-nav>li>a.dropdown-toggle, .navbar-default.s0 .navbar-nav>li>a:focus.dropdown-toggle, .navbar-default.s0 .navbar-nav>li>a:hover.dropdown-toggle {
	background-color: transparent;
	padding: 5px 20px;
	margin-top: 29px;
	border: 1px solid #fff;
	border-radius: 0;
	font-size: 14px;
	margin-left: 30px;
	color: #fff
}
.navbar-default.s1 .navbar-nav>.open>a, .navbar-default.s1 .navbar-nav>.open>a:focus, .navbar-default.s1 .navbar-nav>.open>a:hover, .navbar-default.s1 .navbar-nav>li>a.dropdown-toggle, .navbar-default.s1 .navbar-nav>li>a:focus.dropdown-toggle, .navbar-default.s1 .navbar-nav>li>a:hover.dropdown-toggle, .navbar-default.s2 .navbar-nav>.open>a, .navbar-default.s2 .navbar-nav>.open>a:focus, .navbar-default.s2 .navbar-nav>.open>a:hover, .navbar-default.s2 .navbar-nav>li>a.dropdown-toggle, .navbar-default.s2 .navbar-nav>li>a:focus.dropdown-toggle, .navbar-default.s2 .navbar-nav>li>a:hover.dropdown-toggle, .navbar-default.s3 .navbar-nav>.open>a, .navbar-default.s3 .navbar-nav>.open>a:focus, .navbar-default.s3 .navbar-nav>.open>a:hover, .navbar-default.s3 .navbar-nav>li>a.dropdown-toggle, .navbar-default.s3 .navbar-nav>li>a:focus.dropdown-toggle, .navbar-default.s3 .navbar-nav>li>a:hover.dropdown-toggle, .navbar-default.s4 .navbar-nav>.open>a, .navbar-default.s4 .navbar-nav>.open>a:focus, .navbar-default.s4 .navbar-nav>.open>a:hover, .navbar-default.s4 .navbar-nav>li>a.dropdown-toggle, .navbar-default.s4 .navbar-nav>li>a:focus.dropdown-toggle, .navbar-default.s4 .navbar-nav>li>a:hover.dropdown-toggle, .navbar-default.s5 .navbar-nav>.open>a, .navbar-default.s5 .navbar-nav>.open>a:focus, .navbar-default.s5 .navbar-nav>.open>a:hover, .navbar-default.s5 .navbar-nav>li>a.dropdown-toggle, .navbar-default.s5 .navbar-nav>li>a:focus.dropdown-toggle, .navbar-default.s5 .navbar-nav>li>a:hover.dropdown-toggle {
	border: 1px solid #000;
	color: #000
}
.navbar-default.s0 {
	border: 1px solid transparent
}
.navbar-default.s1 {
	border: 1px solid #eee
}
.navbar-default.s2 {
	border: 1px solid #dcdcdc
}
.navbar-default.s3 {
	border: 1px solid #eee
}
.navbar-default.s4 {
	border: 1px solid #dcdcdc
}
.navbar-default.s5 {
	border: 1px solid #95cfff
}
.navbar-nav>li>.dropdown-menu {
	margin-top: 1px;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px
}
.navbar-default .dropdown-menu>li>a, .navbar-default.s0 .dropdown-menu>li>a {
	font-size: 13px;
	color: #3486f7
}
.navbar-default .dropdown-menu>li>a:hover, .navbar-default.s0 .dropdown-menu>li>a:hover {
	color: #5499f8
}
.navbar-default {
	background-color: transparent;
	border-color: transparent
}
@keyframes fade-in {
0%, 40% {
opacity:0
}
100% {
opacity:1
}
}
@-webkit-keyframes fade-in {
0%, 40% {
opacity:0
}
100% {
opacity:1
}
}
.top-nav-collapse {
	background-color: rgba(255,255,255,.8);
	animation: fade-in;
	animation-duration: 1.5s;
	-webkit-animation: fade-in 1.5s
}
.toolbar {
	position: fixed;
	width: 24px;
	top: 50%;
	right: 10px;
	z-index: 1
}
.toolbar .nav>li {
	position: relative
}
.toolbar .nav>li>a {
	width: 14px;
	height: 14px;
	display: inline-block;
	background-color: #fdfdfd;
	border: 2px solid #c2c6c8;
	padding: 0
}
.toolbar .nav-pills>li>a {
	border-radius: 14px;
	margin: 1px;
	position: relative
}
.toolbar .nav-pills>li>a:hover {
	border-radius: 16px;
	margin: 1px;
	width: 16px;
	height: 16px;
	background-color: #fdfdfd;
	border: 2px solid #3486f7
}
.toolbar .nav>li>a:focus {
	text-decoration: none;
	background-color: #fdfdfd
}
.toolbar .nav-pills>li.active>a {
	background-color: #3586f7;
	border: 2px solid #3586f7
}
.toolbar .nav-pills>li.active>a:hover {
	margin: 0;
	background-color: #fdfdfd
}
.toolbar .nav-pills>li.active>a:focus {
	text-decoration: none;
	background-color: #3586f7
}
.toolbar .nav-pills>li>a:hover>.tip, .toolbar .nav-pills>li>a>.tip {
	position: absolute;
	border-radius: 4px;
	color: #3486f7;
	padding: 10px 12px;
	background-color: #f5f5f5;
	border: 1px solid #cde1fc;
	font-size: 14px
}
.toolbar .nav-pills>li>a>.tip {
	top: -17px;
	right: 25px;
	display: none
}
.toolbar .nav-pills>li>a:hover>.tip {
	top: -16px;
	right: 26px;
	display: inline-block
}
.toolbar .nav-pills>li>a:hover>.tip1 {
	min-width: 114px
}
.toolbar .nav-pills>li>a:hover>.tip2 {
	min-width: 230px
}
.toolbar .nav-pills>li>a:hover>.tip3 {
	min-width: 145px
}
.toolbar .nav-pills>li>a:hover>.tip4 {
	min-width: 175px
}
.toolbar .nav-pills>li>a:hover>.tip5 {
	min-width: 124px
}
.toolbar .nav-pills>li>a:hover>.tip6 {
	min-width: 110px
}
.toolbar .nav-pills>li>a:hover>.tip7 {
	min-width: 85px
}
.toolbar .arrow-right {
	position: absolute;
	width: 0;
	height: 0;
	border-top: 6px solid transparent;
	border-bottom: 6px solid transparent;
	border-left: 6px solid #f5f5f5;
	top: 38%;
	right: -6px
}
.section {
	position: relative;
	box-sizing: border-box;
	height: 600px;
	text-align: center
}
.tc-section {
	background: url(img/one-bg.png) no-repeat center center;
	background-size: cover
}
.tc-section-bg {
	background: url(img/one-bg-f.png) no-repeat center 50px
}
.tc-section .col-lg-4 img {
	padding-right: 170px
}
.tc-section h1 {
	font-size: 38px;
	color: #fff;
	margin-bottom: 15px;
	margin-top: -15px
}
.tc-section .b {
	position: relative;
	padding-top: 0;
	text-align: left;
	margin-left: -15px
}
.tc-section h3 {
	font-size: 24px;
	font-weight: 400;
	color: #fff;
	margin-top: 15px;
	margin-bottom: 15px
}
.tc-section p {
	color: #f8f8f8;
	font-size: 18px;
	line-height: 30px
}
.tc-section .btn-w {
	margin-top: 18px;
	margin-bottom: 24px;
	padding: 15px 96px
}
.tc-section .arrow_box {
	position: relative;
	display: inline-block;
	background: #ffde00;
	border: none;
	color: #000;
	padding: 10px 20px;
	margin-top: 7px;
	border-radius: 3px
}
.mirror-section {
	background-color: #fdfdfd
}
.mirror-section h1 {
	font-size: 38px;
	color: #000;
	margin-bottom: 20px
}
.mirror-section p {
	margin-bottom: 20px;
	font-size: 18px;
	color: #666
}
.control-section {
	position: relative;
	background-color: #dfdfdd
}
.control-section h1 {
	font-size: 38px;
	color: #000;
	margin-bottom: 20px
}
.control-section p {
	color: #4d4d4d;
	font-size: 18px;
	margin-bottom: 20px
}
.carousel-section {
	position: relative;
	background-color: #2079f1
}
.carousel-section h1 {
	font-size: 38px;
	color: #fff;
	margin-bottom: 20px
}
.carousel-section p {
	color: #fff;
	font-size: 18px;
	margin-bottom: 20px
}
.topspeed-section {
	background-color: #fff
}
.topspeed-section h1 {
	color: #000;
	font-size: 38px;
	margin-bottom: 30px
}
.topspeed-section p {
	font-size: 18px;
	color: #4d4d4d;
	margin-bottom: 5%
}
.compatibility-section {
	background-color: #fff
}
.compatibility-section h1 {
	color: #000;
	font-size: 38px;
	margin-bottom: 25px
}
.compatibility-section p {
	color: #4d4d4d;
	font-size: 18px;
	margin-bottom: 20px
}
.compatibility-section .pln {
	color: #bd3613
}
.compatibility-section .str {
	color: #000
}
.compatibility-section .kwd {
	color: #859900
}
.compatibility-section .com {
	color: #586175;
	font-style: italic
}
.compatibility-section .typ {
	color: #b58900
}
.compatibility-section .lit {
	color: #2aa198
}
.compatibility-section .clo, .compatibility-section .opn, .compatibility-section .pun {
	color: #839496
}
.compatibility-section .tag {
	color: #268bd2
}
.compatibility-section .atn {
	color: #586175
}
.compatibility-section .atv {
	color: #2aa198
}
.compatibility-section .dec, .compatibility-section .var {
	color: #268bd2
}
.compatibility-section .fun {
	color: red
}
.compatibility-section .black {
	color: #000
}
.compatibility-section span.input0 {
	position: absolute;
	display: inline-block;
	text-align: left;
	opacity: .7;
	white-space: nowrap;
	overflow: hidden;
	border-right: 1px solid;
	-webkit-animation: typing 1.5s steps(16, end), blink-caret 1s step-end 1.5s;
	animation: typing 1.5s steps(16, end), blink-caret 1s step-end 1.5s;
	top: 83px;
	left: 185px;
	font-size: 12px
}
.compatibility-section span.input1, .compatibility-section span.input2, .compatibility-section span.input3, .compatibility-section span.input4 {
	position: absolute;
	display: inline-block;
//opacity:.7;
	overflow: hidden;
	border-right: 1px solid
}
.compatibility-section span.input1 {
	top: 51px;
	left: 63px;
	height: 7px;
	width: 42px
}
.compatibility-section span.input2 {
	top: 51px;
	right: 95px;
	height: 7px;
	width: 42px
}
.compatibility-section span.input3 {
	top: 114px;
	left: 16px;
	height: 7px;
	width: 48px
}
.compatibility-section span.input4 {
	top: 114px;
	right: 54px;
	height: 7px;
	width: 48px
}
.compatibility-section span.input1>span, .compatibility-section span.input2>span, .compatibility-section span.input3>span, .compatibility-section span.input4>span {
	width: 100%;
	height: 7px;
	display: block;
	background-color: #fff;
	text-align: right;
	float: right;
	-webkit-animation: typing1 3s;
	animation: typing1 3s;
	opacity: 0
}
@-webkit-keyframes typing1 {
from {
width:100%
}
to {
	width: 0
}
0% {
opacity:0
}
1%, 100% {
opacity:1
}
}
@keyframes typing1 {
from {
width:100%
}
to {
	width: 0
}
0% {
opacity:0
}
1%, 100% {
opacity:1
}
}
@-webkit-keyframes typingMid {
from {
width:0
}
to {
	width: 100%
}
}
@keyframes typingMid {
from {
width:0
}
to {
	width: 100%
}
}
@-webkit-keyframes typing {
from {
width:0
}
to {
	width: 140px
}
}
@keyframes typing {
from {
width:0
}
to {
	width: 140px
}
}
@-webkit-keyframes typingLast {
from {
width:0
}
to {
	width: 10px
}
}
@keyframes typingLast {
from {
width:0
}
to {
	width: 10px
}
}
@-webkit-keyframes typingNone {
from {
width:0
}
to {
	width: 10px
}
}
@keyframes typingNone {
from {
width:0
}
to {
	width: 10px
}
}
@-webkit-keyframes blink-caret {
from, to {
border-color:transparent
}
50% {
border-color:#000
}
}
@keyframes blink-caret {
from, to {
border-color:transparent
}
50% {
border-color:#000
}
}
.compatibility-section .hand {
	position: absolute;
	z-index: 11;
	left: 270px;
	top: 215px;
	opacity: 0;
	-webkit-animation: hand 5s ease;
	animation: hand 5s ease
}
@-webkit-keyframes hand {
0% {
opacity:0;
left:400px;
top:250px
}
40% {
opacity:0
}
50% {
opacity:1;
left:270px;
top:215px
}
70% {
opacity:1
}
75% {
opacity:0
}
}
@keyframes hand {
0% {
opacity:0;
left:400px;
top:250px
}
40% {
opacity:0
}
50% {
opacity:1;
left:270px;
top:215px
}
70% {
opacity:1
}
75% {
opacity:0
}
}
.compatibility-section .hand-b {
	position: absolute;
	left: 255px;
	top: 205px;
	display: inline-block;
	z-index: 10;
	width: 52px;
	height: 20px;
	border: 1px solid #9d9fa0;
	opacity: 0;
	-webkit-animation: hand-b 5s ease;
	animation: hand-b 5s ease
}
@-webkit-keyframes hand-b {
0%, 50% {
opacity:0
}
55%, 70% {
opacity:1
}
75% {
opacity:0
}
}
@keyframes hand-b {
0%, 50% {
opacity:0
}
55%, 70% {
opacity:1
}
75% {
opacity:0
}
}
.compatibility-section .animation-bg {
	position: absolute;
	left: 68px;
	top: 8px;
	display: inline-block;
	width: 478px;
	height: 292px;
	z-index: 1;
	background-color: #000;
	opacity: 0;
	-webkit-animation: a-bg 5s ease;
	animation: a-bg 5s ease
}
@-webkit-keyframes a-bg {
0% {
opacity:0
}
10%, 15%, 70% {
opacity:.75
}
100%, 75% {
opacity:0
}
}
@keyframes a-bg {
0% {
opacity:0
}
10%, 15%, 70% {
opacity:.75
}
100%, 75% {
opacity:0
}
}
.compatibility-section .frame-box {
	position: absolute;
	left: 119px;
	top: 69px;
	z-index: 2;
	display: inline-block;
	width: 194px;
	height: 130px;
	background: url(img/frame-box.png) no-repeat 0 0;
	border: 1px solid #00aeff;
	opacity: 0;
	-webkit-animation: frame-box 5s ease;
	animation: frame-box 5s ease
}
@-webkit-keyframes frame-box {
0% {
opacity:0;
width:0;
height:0
}
12% {
opacity:0
}
15% {
opacity:1;
width:0;
height:0
}
30% {
width:194px;
height:130px
}
70% {
opacity:1
}
75% {
opacity:0
}
}
@keyframes frame-box {
0% {
opacity:0;
width:0;
height:0
}
12% {
opacity:0
}
15% {
opacity:1;
width:0;
height:0
}
30% {
width:194px;
height:130px
}
70% {
opacity:1
}
75% {
opacity:0
}
}
.compatibility-section .frame-box>div {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: block
}
.compatibility-section .frame-box .dot1, .compatibility-section .frame-box .dot2, .compatibility-section .frame-box .dot3, .compatibility-section .frame-box .dot4, .compatibility-section .frame-box .dot5, .compatibility-section .frame-box .dot6, .compatibility-section .frame-box .dot7, .compatibility-section .frame-box .dot8 {
	position: absolute;
	width: 5px;
	height: 5px;
	display: inline-block;
	background-color: #00aeff
}
.compatibility-section .frame-box .dot1 {
	top: -2px;
	left: -2px
}
.compatibility-section .frame-box .dot2 {
	margin-left: -2.5px;
	top: -2px;
	left: 50%
}
.compatibility-section .frame-box .dot3 {
	top: -2px;
	right: -2px
}
.compatibility-section .frame-box .dot4 {
	bottom: -2px;
	left: -2px
}
.compatibility-section .frame-box .dot5 {
	margin-left: -2.5px;
	bottom: -2px;
	left: 50%
}
.compatibility-section .frame-box .dot6 {
	bottom: -2px;
	right: -2px
}
.compatibility-section .frame-box .dot7 {
	margin-top: -5px;
	top: 50%;
	left: -2px
}
.compatibility-section .frame-box .dot8 {
	margin-top: -5px;
	top: 50%;
	right: -2px
}
.compatibility-section .yes-or-no1 {
	position: absolute;
	top: 202px;
	left: 96px;
	z-index: 6;
	opacity: 0;
	-webkit-animation: yes-or-no1 5s ease;
	animation: yes-or-no1 5s ease
}
@-webkit-keyframes yes-or-no1 {
0%, 35% {
opacity:0
}
45%, 70% {
opacity:1
}
75% {
opacity:0
}
}
@keyframes yes-or-no1 {
0%, 35% {
opacity:0
}
45%, 70% {
opacity:1
}
75% {
opacity:0
}
}
.compatibility-section .sd {
	position: absolute;
	bottom: 75px;
	right: 75px;
	z-index: 6;
	opacity: 0;
	-webkit-animation: sd 5s ease;
	animation: sd 5s ease
}
@-webkit-keyframes sd {
0%, 75% {
opacity:0
}
80%, 95% {
opacity:1
}
100% {
opacity:0
}
}
@keyframes sd {
0%, 75% {
opacity:0
}
80%, 95% {
opacity:1
}
100% {
opacity:0
}
}
.compatibility-section .btn-bar {
	position: absolute;
	bottom: 75px;
	right: 75px;
	z-index: 6
}
.compatibility-section .img2-hand {
	position: absolute;
	z-index: 10;
	opacity: 0;
	-webkit-animation: img2-hand 6s ease;
	animation: img2-hand 6s ease
}
@-webkit-keyframes img2-hand {
0%, 40% {
opacity:0
}
45% {
left:338px;
top:256px;
opacity:1
}
70% {
opacity:0;
left:338px;
top:256px
}
71% {
opacity:0;
left:0;
top:0
}
80% {
opacity:0
}
85% {
opacity:1;
left:356px;
top:88px
}
95% {
opacity:1
}
100% {
left:356px;
top:88px;
opacity:0
}
}
@keyframes img2-hand {
0%, 40% {
opacity:0
}
45% {
left:338px;
top:256px;
opacity:1
}
70% {
opacity:0;
left:338px;
top:256px
}
71% {
opacity:0;
left:0;
top:0
}
80% {
opacity:0
}
85% {
opacity:1;
left:356px;
top:88px
}
95% {
opacity:1
}
100% {
left:356px;
top:88px;
opacity:0
}
}
.compatibility-section .img2-00 {
	position: absolute;
	left: 240px;
	top: 20px;
	opacity: 1;
	-webkit-animation: img2-00 6s ease;
	animation: img2-00 6s ease
}
@-webkit-keyframes img2-00 {
0%, 50%, 55%, 70% {
opacity:1
}
80%, 95% {
opacity:0
}
100% {
opacity:1
}
}
@keyframes img2-00 {
0%, 50%, 55%, 70% {
opacity:1
}
80%, 95% {
opacity:0
}
100% {
opacity:1
}
}
.compatibility-section .img2-0 {
	position: absolute;
	left: 68px;
	top: 10px;
	width: 479px;
	height: 293px;
	z-index: 1;
	background-color: #000;
	opacity: 0;
	-webkit-animation: img2-0 6s ease;
	animation: img2-0 6s ease
}
@-webkit-keyframes img2-0 {
0% {
opacity:0
}
10%, 20%, 70% {
opacity:.75
}
80% {
opacity:0
}
}
@keyframes img2-0 {
0% {
opacity:0
}
10%, 20%, 70% {
opacity:.75
}
80% {
opacity:0
}
}
.compatibility-section .img2-1 {
	position: absolute;
	left: 268px;
	top: 85px;
	width: 89px;
	height: 68px;
	border: 1px solid #00aeff;
	z-index: 2;
	background: url(img/qie.png) no-repeat 0 0;
	opacity: 0;
	-webkit-animation: img2-1 6s ease;
	animation: img2-1 6s ease
}
@-webkit-keyframes img2-1 {
0% {
opacity:1;
width:0;
height:0
}
20% {
width:0;
height:0
}
35% {
width:89px;
height:68px
}
70% {
opacity:1
}
75% {
opacity:0
}
}
@keyframes img2-1 {
0% {
opacity:1;
width:0;
height:0
}
20% {
width:0;
height:0
}
35% {
width:89px;
height:68px
}
70% {
opacity:1
}
75% {
opacity:0
}
}
.compatibility-section .yes-or-no {
	position: absolute;
	z-index: 4;
	left: 248px;
	top: 248px;
	opacity: 0;
	-webkit-animation: yes-or-no 5s ease;
	animation: yes-or-no 5s ease
}
@-webkit-keyframes yes-or-no {
0%, 40% {
opacity:0
}
45%, 70% {
opacity:1
}
80% {
opacity:0
}
}
@keyframes yes-or-no {
0%, 40% {
opacity:0
}
45%, 70% {
opacity:1
}
80% {
opacity:0
}
}
.compatibility-section .img2-2 {
	position: absolute;
	z-index: 5;
	top: 75px;
	left: 240px;
	opacity: 0;
	-webkit-animation: img2-2 6s ease;
	animation: img2-2 6s ease
}
@-webkit-keyframes img2-2 {
0%, 65% {
opacity:0
}
90% {
opacity:1
}
95% {
opacity:0
}
}
@keyframes img2-2 {
0%, 65% {
opacity:0
}
90% {
opacity:1
}
95% {
opacity:0
}
}
.compatibility-section .img2-3 {
	position: absolute;
	left: 360px;
	top: 83px;
	z-index: 7;
	opacity: 0;
	-webkit-animation: img2-3 6s ease;
	animation: img2-3 6s ease
}
@-webkit-keyframes img2-3 {
0% {
opacity:0
}
65% {
opacity:0;
width:12px
}
75% {
width:16px
}
85% {
width:12px
}
90% {
opacity:1
}
95% {
opacity:0
}
}
@keyframes img2-3 {
0% {
opacity:0
}
65% {
opacity:0;
width:12px
}
75% {
width:18px
}
85% {
width:12px
}
90% {
width:12px;
opacity:1
}
95% {
opacity:0
}
}
.compatibility-section .zoon {
	position: absolute;
	left: 70px;
	top: 12px;
	opacity: 1;
	-webkit-animation: zoon 3s ease;
	animation: zoon 3s ease
}
@-webkit-keyframes zoon {
0%, 60% {
opacity:0
}
100%, 70%, 80% {
opacity:1
}
}
@keyframes zoon {
0%, 60% {
opacity:0
}
100%, 70%, 80% {
opacity:1
}
}
.compatibility-section .magnifier {
	position: absolute;
	top: 155px;
	left: 77px;
	opacity: 0;
	-webkit-animation: magnifier 3s ease;
	animation: magnifier 3s ease
}
@-webkit-keyframes magnifier {
0% {
opacity:0
}
10% {
opacity:0;
top:162px;
left:87px;
width:16px
}
20% {
opacity:1;
top:155px;
left:77px;
width:37px
}
50% {
opacity:1
}
100%, 60% {
opacity:0
}
}
@keyframes magnifier {
0% {
opacity:0
}
10% {
opacity:0;
top:162px;
left:87px;
width:16px
}
20% {
opacity:1;
top:155px;
left:77px;
width:37px
}
50% {
opacity:1
}
100%, 60% {
opacity:0
}
}
.compatibility-section .hand-0 {
	position: absolute;
	top: 50px;
	left: 184px;
	-webkit-animation: movetb 2s ease infinite;
	animation: movetb 2s ease infinite
}
@keyframes movetb {
0% {
top:50px
}
50% {
top:70px
}
100% {
top:50px
}
}
@-webkit-keyframes movetb {
0% {
top:50px
}
50% {
top:70px
}
100% {
top:50px
}
}
.compatibility-section .hand-1 {
	position: absolute;
	top: 188px;
	left: 470px;
	-webkit-animation: movelr 2s ease .5s infinite;
	animation: movelr 2s ease .5s infinite
}
@keyframes movelr {
0% {
left:460px
}
50% {
left:480px
}
100% {
left:460px
}
}
@-webkit-keyframes movelr {
0% {
left:460px
}
50% {
left:480px
}
100% {
left:460px
}
}
.compatibility-section .gridlines {
	position: absolute;
	top: 170px;
	left: 503px;
	-webkit-animation: gridlines 4s ease;
	animation: gridlines 4s ease
}
@keyframes gridlines {
0%, 50%, 95% {
opacity:1
}
100% {
opacity:0
}
}
@-webkit-keyframes gridlines {
0%, 50%, 95% {
opacity:1
}
100% {
opacity:0
}
}
.compatibility-section .trace {
	position: absolute;
	top: 90px;
	left: 277px;
	-webkit-animation: trace 4s ease;
	animation: trace 4s ease
}
@keyframes trace {
0% {
opacity:0
}
10%, 100%, 95% {
opacity:1
}
}
@-webkit-keyframes trace {
0% {
opacity:0
}
10%, 100%, 95% {
opacity:1
}
}
.compatibility-section .gesture {
	position: absolute;
	top: 95px;
	left: 320px;
	-webkit-animation: gesture 4s ease-in;
	animation: gesture 4s ease-in
}
@keyframes gesture {
0% {
top:105px;
left:280px;
opacity:0
}
10% {
top:105px;
left:280px;
opacity:1
}
15% {
top:105px;
left:280px
}
40% {
top:95px;
left:320px
}
100%, 95% {
opacity:1
}
}
@-webkit-keyframes gesture {
0% {
top:105px;
left:280px;
opacity:0
}
10% {
top:105px;
left:280px;
opacity:1
}
15% {
top:105px;
left:280px
}
40% {
top:95px;
left:320px
}
100%, 95% {
opacity:1
}
}
.compatibility-section .txt-img {
	position: absolute;
	top: 80px;
	left: 380px;
	-webkit-animation: txt-img 4s ease-in;
	animation: txt-img 4s ease-in;
	opacity: 0
}
@keyframes txt-img {
0% {
opacity:0
}
30% {
top:80px;
left:260px;
opacity:0
}
40% {
top:80px;
left:260px;
opacity:1
}
65% {
top:95px;
left:410px;
opacity:1
}
100%, 70% {
opacity:0
}
}
@-webkit-keyframes txt-img {
0% {
opacity:0
}
30% {
top:80px;
left:260px;
opacity:0
}
40% {
top:80px;
left:260px;
opacity:1
}
65% {
top:95px;
left:410px;
opacity:1
}
100%, 70% {
opacity:0
}
}
.compatibility-section .excel {
	position: absolute;
	top: 170px;
	left: 503px;
	-webkit-animation: excel 4s ease;
	animation: excel 4s ease
}
@keyframes excel {
0%, 50%, 65% {
opacity:0
}
100% {
opacity:1
}
}
@-webkit-keyframes excel {
0%, 50%, 65% {
opacity:0
}
100% {
opacity:1
}
}
.dis1, .dis2, .dis3, .dis4, .img1, .img2, .img3, .img4 {
	display: none
}
.compatibility-section .block {
	margin-bottom: 20px;
	width: 618px;
	margin-left: auto;
	margin-right: auto;
	position: relative
}
.compatibility-section .block.img4>.click1 {
	position: absolute;
	width: 46px;
	height: 46px;
	background-color: transparent;
	border-radius: 46px;
	cursor: pointer;
	top: 112px;
	left: 182px;
	-webkit-animation: circle 2s ease infinite;
	animation: circle 2s ease infinite
}
@keyframes circle {
40% {
box-shadow:0 0 10px rgba(0,100,100,1)
}
50% {
box-shadow:0 0 10px rgba(0,100,100,.3)
}
60% {
box-shadow:0 0 10px rgba(0,100,100,1)
}
}
@-webkit-keyframes circle {
40% {
box-shadow:0 0 10px rgba(0,100,100,1)
}
50% {
box-shadow:0 0 10px rgba(0,100,100,.3)
}
60% {
box-shadow:0 0 10px rgba(0,100,100,1)
}
}
.compatibility-section .block.img4>.click2 {
	position: absolute;
	width: 25px;
	height: 25px;
	background-color: transparent;
	border-radius: 25px;
	cursor: pointer;
	top: 192px;
	left: 434px;
	-webkit-animation: circle 2s ease infinite;
	animation: circle 2s ease infinite
}
@keyframes circle {
40% {
box-shadow:0 0 10px rgba(0,100,100,1)
}
50% {
box-shadow:0 0 10px rgba(0,100,100,.3)
}
60% {
box-shadow:0 0 10px rgba(0,100,100,1)
}
}
@-webkit-keyframes circle {
40% {
box-shadow:0 0 10px rgba(0,100,100,1)
}
50% {
box-shadow:0 0 10px rgba(0,100,100,.3)
}
60% {
box-shadow:0 0 10px rgba(0,100,100,1)
}
}
.function-section {
	background-color: #fff
}
.function-section .nav-tabs>.col-xs-4 {
	padding: 0
}
.function-section .nav-tabs>li>a {
	border: none;
	height: 100px;
	border-bottom: 3px solid #eaeaea;
	background-color: transparent;
	font-size: 32px;
	color: #0c0c0c;
	line-height: 1;
	padding: 5px 15px;
	margin-right: 0;
	position: relative
}
.function-section .nav-tabs>li>a>.triangle {
	position: absolute;
	bottom: -15px;
	left: 50%;
	display: none;
	margin-left: -20px
}
.function-section .nav-tabs>li>a>span {
	font-size: 14px;
	color: #ca0205;
	line-height: 20px
}
.function-section .nav-tabs>li>a>i {
	position: absolute;
	top: -5px;
	right: 15%
}
.function-section .nav-tabs>li>#tabs3-title>i {
	position: absolute;
	top: -5px;
	right: 10%
}
.function-section .nav-tabs>li>a>p {
	margin-top: 10px;
	font-size: 14px;
	color: #4d4d4d;
	line-height: 20px
}
.function-section #free>span {
	color: #3a9a00
}
.function-section .nav-tabs>li.active>a>p {
	color: #797979
}
.function-section .nav-tabs>li.active>a:focus>.triangle, .function-section .nav-tabs>li.active>a:hover>.triangle, .function-section .nav-tabs>li.active>a>.triangle {
	display: inline-block
}
.function-section .nav-tabs>li.active>a, .function-section .nav-tabs>li.active>a:focus, .function-section .nav-tabs>li.active>a:hover {
	border: none;
	border-bottom: 3px solid #eaeaea;
	background-color: transparent;
	cursor: pointer;
	color: #797979
}
.function-section h1 {
	font-size: 30px;
	color: #000;
	margin-bottom: 20px
}
.function-section .table {
	text-align: left;
	border-right: 1px solid #eee
}
.function-section .table tr td {
	border-top: 1px solid #eee;
	border-right: none;
	background-color: #fff;
	line-height: 20px;
	padding: 0
}
.function-section #tabs1 .table tr td:last-child, .function-section #tabs1 .table tr:last-child td {
	border-bottom: 1px solid #eee
}
.function-section #tabs1 .table tr:last-child td:last-child {
	border-right: 1px solid #eee
}
.function-section .table tr td .txt {
	width: 160px;
	color: #000;
	display: inline-block
}
.function-section .table tr td .txt small {
	color: #aeaeae;
	font-size: 12px
}
.compatible-section {
	background-color: #89c4f4
}
.compatible-section h1 {
	margin-bottom: 20px;
	color: #fefefe;
	font-size: 48px
}
.compatible-section .container>p {
	color: #fff;
	font-size: 18px;
	margin-bottom: 22px
}
.compatible-section .container>p.old-version {
	color: #000113;
	font-size: 18px;
	margin-bottom: 2px
}
.compatible-section .container>p.old-version>a {
	font-size: 20px;
	color: #0034d7;
	text-decoration: underline
}
.compatible-section .container>p.old-version>a:hover {
	opacity: .9
}
.compatible-section .btn-block {
	margin-bottom: 30px
}
.compatible-section .footer>p {
	color: #777;
	font-size: 12px
}
.footer>p>a>img, .footer>p>img {
	vertical-align: inherit;
	margin-right: 20px
}
.compatible-section .footer>p>span {
	display: inline-block;
	text-align: left;
	height: 52px
}
[class*=" icon28-"], [class^=icon28-] {
height:28px;
width:28px;
display:inline-block;
margin-right:8px;
opacity:.8;
vertical-align:middle
}
.icon28-download {
	height: 30px;
	width: 30px;
	margin-right: 4px;
	background: url(img/icon-download.png) no-repeat center center
}
.icon28-download-old {
	height: 30px;
	width: 30px;
	margin-right: 4px;
	background: url(img/icon28-download-old.png) no-repeat center center
}
.icon28-play {
	height: 30px;
	width: 30px;
	margin-right: 4px;
	background: url(img/icon-play.png) no-repeat center center
}
.icon28-back {
	height: 30px;
	width: 30px;
	margin-right: 4px;
	background: url(img/icon-back.png) no-repeat center center
}
[class*=" icon38-"], [class^=icon38-] {
display:inline-block;
vertical-align:top
}
.icon38-sigma-paste {
	background: #d7c672 url(img/icon38-sigma-paste.png) no-repeat center center
}
.icon38-boss-mode {
	background: #335292 url(img/icon38-boss-mode.png) no-repeat center center
}
.icon38-h2 {
	background: #335292 url(img/icon38-h2.png) no-repeat center center
}
.icon38-muti-touch {
	background: #335292 url(img/icon38-muti-touch.png) no-repeat center center
}
.icon38-no-java {
	background: #335292 url(img/icon38-no-java.png) no-repeat center center
}
.icon38-shortcut-icon {
	background: #d7c672 url(img/icon38-shortcut-icon.png) no-repeat center center
}
.icon38-keyboard {
	background: #3e62ae url(img/icon38-keyboard.png) no-repeat center center
}
.icon38-flash {
	background: #3e62ae url(img/icon38-flash.png) no-repeat center center
}
.icon38-plus {
	background: #3e62ae url(img/icon38-plus.png) no-repeat center center
}
.icon38-note {
	background: #3e62ae url(img/icon38-note.png) no-repeat center center
}
.icon38-picture {
	background: #5383c3 url(img/icon38-picture.png) no-repeat center center
}
.icon38-script {
	background: #5383c3 url(img/icon38-script.png) no-repeat center center
}
.icon38-lollipop {
	background: #5383c3 url(img/icon38-lollipop.png) no-repeat center center
}
.icon38-facetime-video {
	background: #5383c3 url(img/icon38-facetime-video.png) no-repeat center center
}
.icon38-expression {
	background: #2ca9e1 url(img/icon38-expression.png) no-repeat center center
}
.icon38-file {
	background: #2ca9e1 url(img/icon38-file.png) no-repeat center center
}
.icon38-screenshot {
	background: #2ca9e1 url(img/icon38-screenshot.png) no-repeat center center
}
.icon38-h {
	background: #2ca9e1 url(img/icon38-h.png) no-repeat center center
}
.icon38-link {
	background: #59b9c7 url(img/icon38-link.png) no-repeat center center
}
.icon38-record-script {
	background: #59b9c7 url(img/icon38-record-script.png) no-repeat center center
}
.icon38-mouse {
	background: #59b9c7 url(img/icon38-mouse.png) no-repeat center center
}
.icon38-copy {
	background: #59b9c7 url(img/icon38-copy.png) no-repeat center center
}
.icon38-fast {
	background: #f0bc5e url(img/icon38-fast.png) no-repeat center center
}
.icon38-search {
	background: #f0bc5e url(img/icon38-search.png) no-repeat center center
}
.icon38-img {
	background: #f0bc5e url(img/icon38-img.png) no-repeat center center
}
.icon38-driver {
	background: #f0bc5e url(img/icon38-driver.png) no-repeat center center
}
.icon38-set {
	background: #d7c672 url(img/icon38-set.png) no-repeat center center
}
.icon38-x86 {
	background: #d7c672 url(img/icon38-x86.png) no-repeat center center
}
.btn-block-center {
	display: block;
	padding-top: 15px;
	text-align: center
}
.btn-w {
	background-color: #fff;
	color: #017ce1;
	border: none;
	opacity: .95;
	font-size: 18px;
	vertical-align: middle;
	padding: 15px 40px
}
.btn-w:focus, .btn-w:hover {
	background-color: #fff;
	color: #017ce1;
	opacity: 1
}
.btn-1 {
	background-color: #3488e2;
	color: #FFF;
	border: none;
	opacity: .95;
	font-size: 17px;
	vertical-align: middle;
	padding: 14px 38px
}
.btn-1:focus, .btn-1:hover {
	background-color: #3488e2;
	color: #FFF;
	opacity: 1
}
.btn-2 {
	background-color: #1b60b5;
	color: #fff;
	border: none;
	opacity: .95;
	font-size: 17px;
	vertical-align: middle;
	padding: 14px 38px
}
.btn-2:focus, .btn-2:hover {
	background-color: #1b60b5;
	color: #fff;
	opacity: 1
}
.btn-b {
	background-color: #89c4f4;
	color: #fff;
	border: 2px solid #fff;
	opacity: .9;
	font-size: 18px;
	vertical-align: middle;
	padding: 13px 24px
}
.btn-b:focus, .btn-b:hover {
	background-color: #89c4f4;
	color: #fff;
	opacity: 1
}
.btn-blue {
	background-color: #6092e7;
	color: #fff;
	border: none;
	opacity: .9;
	font-size: 16px;
	vertical-align: middle;
	padding: 13px 17px
}
.btn-blue:focus, .btn-blue:hover {
	background-color: #6092e7;
	color: #fff;
	opacity: 1
}
.btn-gray {
	background-color: #b1b1b1;
	color: #fff;
	border: none;
	opacity: .9;
	font-size: 16px;
	vertical-align: middle;
	padding: 17px 20px;
	margin: 0 7px
}
.btn-gray.active, .btn-gray:focus, .btn-gray:hover {
	background-color: #6092e7;
	color: #fff;
	opacity: 1
}
.btn-gray.active {
	position: relative
}
.btn-gray.active:after, .btn-gray.active:before {
	top: 0;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none
}
.btn-gray.active:before {
	border-color: rgba(96,146,231,0);
	border-top-color: #f4f5f9;
	border-width: 8px;
	margin-left: -8px
}
.footer {
	width: 100%;
	height: 25%;
	position: absolute;
	bottom: 0;
	background-color: #fff;
	padding-top: 4%;
	min-height: 120px
}
.friendly-link {
	width: 100%;
	position: absolute;
	bottom: 0;
	height: 32px;
	line-height: 32px;
	background: #FFF;
	font-size: 12px;
	border-top: 1px dashed #e7e7e7
}
.friendly-link p {
	color: #b0b0b0
}
.friendly-link p span a {
	color: #b0b0b0;
	text-decoration: none
}
.friendly-link p span a:hover {
	color: #b0b0b0;
	text-decoration: underline
}
.friendly-link p span a:visited {
	color: #b0b0b0;
	text-decoration: none
}
.modal-dialog .help-block {
	display: inline-block;
	margin-top: 0
}
.tc-info {
	position: absolute;
	bottom: 0;
	width: 100%;
	min-height: 162px;
	background: url(img/tc-info-animation-bg.jpg) no-repeat center center;
	background-size: cover;
	text-align: center;
	margin: 0 auto
}
.circle-progress-block-1, .circle-progress-block-2, .circle-progress-block-3 {
	position: relative;
	width: 160px;
	height: 157px;
	display: inline-block
}
.circle-progress-block-1 {
	background: url(img/c3.gif) no-repeat center
}
.circle-progress-block-2 {
	background: url(img/c1.gif) no-repeat center
}
.circle-progress-block-3 {
	background: url(img/c2.gif) no-repeat center
}
.circle-progress-block {
	position: relative;
	width: 134px;
	height: 134px;
	display: inline-block;
	border-radius: 50%;
	overflow: hidden;
	-webkit-box-shadow: 0 0 10px 15px #0c53a1;
	-moz-box-shadow: 0 0 10px 15px #0c53a1;
	box-shadow: 0 0 10px 15px #0c53a1
}
.circle-left, .circle-right {
	width: 67px;
	height: 134px;
	overflow: hidden;
	position: relative;
	float: left
}
.circle-left {
	border-radius: 134px 0 0 134px;
	background-color: #FFF
}
.circle-right {
	border-radius: 0 134px 134px 0;
	background-color: #FFF
}
.circle-left div, .circle-right div {
	content: "";
	position: absolute;
	top: -1px;
	left: -1px;
	display: block;
	width: 68.8px;
	height: 136px;
	background-color: #0c53a1;
	transition: all .5s;
	transform: rotateZ(0deg)
}
.circle-left div {
	border-radius: 136px 0 0 136px;
	transform-origin: right center
}
.circle-right div {
	border-radius: 0 136px 136px 0;
	transform-origin: left center
}
.circle-block {
	position: absolute;
	left: 3px;
	top: 3px;
	padding-top: 25px;
	width: 128px;
	height: 128px;
	color: #fff;
	font-size: 16px;
	border-radius: 50%;
	background: -webkit-gradient(linear, left top, left bottom, from(#0058ac), to(#0184d7))
}
.circle-progress-block-1>.circle-block, .circle-progress-block-2>.circle-block, .circle-progress-block-3>.circle-block {
	position: absolute;
	left: 14px;
	top: 14px;
	border-radius: 0;
	background: 0 0
}
.tc-info>.list-inline>li {
	margin: 0 10px;
	position: relative;
	vertical-align: middle;
	text-align: center
}
.download-num, .phone-num, .sale-num {
	font-size: 42px;
	text-align: right
}
.download-unit, .phone-unit, .sale-unit {
	font-size: 14px
}
.phone-num, .phone-unit {
	color: #00f0ff
}
.download-num, .download-unit {
	color: #ff9300
}
.sale-num, .sale-unit {
	color: #ff78a8
}
.phone-num {
	min-width: 99px
}
.download-num {
	min-width: 74px
}
.sale-num {
	min-width: 50px
}
// A?????????????????? @-webkit-keyframes rotateA {
0%, 25% {
transform:rotateZ(0deg)
}
50%, 75% {
transform:rotateZ(180deg)
}
100% {
transform:rotateZ(360deg)
}
}
// B?????????????????? @-webkit-keyframes rotateB {
25%, 50% {
transform:rotateZ(180deg)
}
100%, 75% {
transform:rotateZ(360deg)
}
}
.adv-tcp {
	height: 600px;
	width: 100%;
	background: red url(img/adv-tcp-bg.png) no-repeat center center;
	background-size: cover;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1039;
	box-sizing: border-box;
	text-align: center;
	animation: myAdvTcp 10s forwards;
	-moz-animation: myAdvTcp 10s forwards;
	-webkit-animation: myAdvTcp 10s forwards;
	-o-animation: myAdvTcp 10s forwards
}
@keyframes myAdvTcp {
0%, 10%, 85% {
opacity:1
}
100% {
opacity:0;
visibility:hidden
}
}
@-moz-keyframes myAdvTcp {
0%, 10%, 85% {
opacity:1
}
100% {
opacity:0;
visibility:hidden
}
}
@-webkit-keyframes myAdvTcp {
0%, 10%, 85% {
opacity:1
}
100% {
opacity:0;
visibility:hidden
}
}
@-o-keyframes myAdvTcp {
0%, 10%, 85% {
opacity:1
}
100% {
opacity:0;
visibility:hidden
}
}
.adv-tcp>img {
	margin-top: 5%
}
.adv-tcp>.adv-btn {
	font-size: 30px;
	color: #ca0205;
	box-sizing: border-box;
	display: inline-block;
	padding: 23px 54px;
	background-color: #ffcc52;
	border-radius: 5px;
	margin-left: 5px;
	margin-right: 5px;
	margin-top: 14px;
	border: none;
	text-decoration: none
}
.carousel-section>img {
	text-align: center;
	display: inline-block
}
.carousel-inner>.item>a>img, .carousel-inner>.item>img, .img-responsive, .thumbnail a>img, .thumbnail>img {
	display: inline-block
}
.carousel-indicators li {
	width: 18px;
	height: 18px;
	margin: 0 1px;
	border: 2px solid #fff
}
.carousel-indicators .active {
	width: 18px;
	height: 18px
}
.tab-content {
	height: 88%;
	text-align: left;
	background-color: transparent
}
.tab-pane {
	padding: 3% 0
}
.text-y {
	color: #f37e00;
	font-weight: 400
}
.table.table-new {
	text-align: left
}
.table.table-new tr>td, .table.table-new tr>th {
	border: none;
	font-weight: 400;
	padding: 8px 10px;
	border-right: 2px solid #fff;
	font-size: 14px;
	color: #000;
	text-align: center
}
.table.table-new tr>td:first-child {
	text-align: left
}
.table.table-new tr>th {
	background-color: #3794dd;
	color: #fff
}
.table.table-new tr.even>td {
	background-color: #f8f8f8
}
.table.table-new tr>td>span {
	width: 90%;
	display: inline-block;
	vertical-align: middle
}
.table.table-new tr.odd>td {
	background-color: #fff
}
.tab2-img {
	vertical-align: middle;
	display: inline-block;
	max-width: 178px;
	max-height: 178px
}
.tab2-img img {
	width: 100%
}
.tab2-txt {
	display: inline-block;
	vertical-align: middle;
	width: 60%;
	box-sizing: border-box;
	padding-left: 23px;
	padding-right: 15px;
	font-size: 14px;
	color: #7e7e7e
}
.tab2-txt label {
	color: #000;
	font-size: 18px;
	font-weight: 400
}
#tabs2 div.tab-box, #tabs3 div.tab-box {
	position: relative;
	margin-bottom: 18px;
	background-color: #f4f6f8
}
#tabs3 .title {
	color: #7e7e7e;
	font-size: 14px
}
#tabs3 .title>span {
	position: relative;
	background-color: #2f57aa;
	width: 280px;
	height: 45px;
	box-sizing: border-box;
	padding: 10px 0 12px 50px;
	display: inline-block;
	vertical-align: middle;
	margin-bottom: 4px;
	margin-right: 10px;
	color: #fffefe;
	font-size: 18px
}
#tabs3 .title>span>i {
	display: inline-block;
	position: absolute;
	left: 0;
	top: -12px;
	width: 23px;
	height: 12px;
	background: url(img/arrow.png) no-repeat 0 0
}
#vs>span {
	display: inline-block;
	box-sizing: border-box;
	line-height: 30px;
	background-color: #3794dd;
	font-size: 26px;
	text-align: center;
	padding: 8px;
	color: #fff;
	margin-bottom: 15px;
	border: none
}
.active #vs>span {
	background-color: #82bcea;
	color: #fff
}
.compatibility-div {
	position: relative;
	height: 150px
}
.section {
	padding-top: 60px
}
.function-section .table {
	font-size: 14px
}
.animation {
	max-width: 616px;
	max-height: 357px;
	position: relative
}
.animation>.img1-02 {
	position: absolute
}
.animation>.img1-01, .animation>.img1-03, .animation>.img1-04, .animation>.img1-05, .animation>.img1-07, .animation>.img1-09, .animation>.img1-box-06, .animation>.img1-box-08 {
	-webkit-animation: img1 14s ease-in-out 0s infinite;
	-moz-animation: img1 14s ease-in-out 0s infinite;
	animation: img1 14s ease-in-out 0s infinite;
	opacity: 0
}
@-moz-keyframes img1 {
0%, 3%, 50% {
opacity:1
}
100%, 55% {
opacity:0
}
}
@-webkit-keyframes img1 {
0%, 3%, 50% {
opacity:1
}
100%, 55% {
opacity:0
}
}
@-o-keyframes img1 {
0%, 3%, 50% {
opacity:1
}
100%, 55% {
opacity:0
}
}
@keyframes img1 {
0%, 3%, 50% {
opacity:1
}
100%, 55% {
opacity:0
}
}
.animation>.img1-03, .animation>.img1-04, .animation>.img1-05, .animation>.img1-07, .animation>.img1-09, .animation>.img1-box-06, .animation>.img1-box-08 {
	position: absolute
}
.animation>.img1-02 {
	z-index: 20;
	top: 0;
	left: 23px
}
.animation>.img1-03 {
	left: 10px;
	bottom: 8px;
	z-index: 7
}
.animation>.img1-04 {
	left: 80px;
	bottom: 48px;
	z-index: 1
}
.animation>.img1-05 {
	left: 98px;
	bottom: 38px;
	z-index: 6
}
.animation>.img1-06 {
	text-align: center
}
.animation>.img1-box-06 {
	width: 122px;
	height: 243px;
	display: inline-block;
	top: 34px;
	left: 230px;
	z-index: 5;
	box-sizing: border-box;
	padding-top: 40px
}
.animation>.img1-07 {
	top: 34px;
	left: 230px;
	z-index: 4
}
.animation>.img1-08 {
	text-align: center
}
.animation>.img1-box-08 {
	width: 101px;
	height: 188px;
	display: inline-block;
	left: 10px;
	bottom: 8px;
	z-index: 8;
	box-sizing: border-box;
	padding-top: 30px
}
.animation>.img1-09 {
	top: 7px;
	right: 80px;
	z-index: 4
}
.animation>.img2-01, .animation>.img2-02, .animation>.img2-03, .animation>.img2-04 {
	-webkit-animation: img2 14s ease-in-out 0s infinite;
	-moz-animation: img2 14s ease-in-out 0s infinite;
	animation: img2 14s ease-in-out 0s infinite;
	opacity: 0;
	position: absolute
}
@-moz-keyframes img2 {
0% {
opacity:0
}
3%, 50% {
opacity:1
}
100%, 55% {
opacity:0
}
}
@-webkit-keyframes img2 {
0% {
opacity:0
}
3%, 50% {
opacity:1
}
100%, 55% {
opacity:0
}
}
@-o-keyframes img2 {
0% {
opacity:0
}
3%, 50% {
opacity:1
}
100%, 55% {
opacity:0
}
}
@keyframes img2 {
0%, 50% {
opacity:0
}
55%, 97% {
opacity:1
}
100% {
opacity:0
}
}
.animation>.img2-01 {
	top: 0;
	left: 0;
	z-index: 10
}
.animation>.img2-02 {
	top: 32px;
	left: 130px;
	z-index: 11
}
.animation>.img2-03 {
	top: 7px;
	right: 82px;
	z-index: 12
}
.animation>.img2-04 {
	bottom: 42px;
	left: 79px;
	z-index: 14
}
.shake-chunk {
	display: inline-block;
	-webkit-animation: swinging 5s ease-in-out 0s infinite;
	-moz-animation: swinging 5s ease-in-out 0s infinite;
	animation: swinging 5s ease-in-out 0s infinite;
	-webkit-transform-origin: 50% 0;
	-moz-transform-origin: 50% 0;
	transform-origin: 50% 0;
	animation-duration: 3s
}
@-webkit-keyframes swinging {
0% {
-webkit-transform:rotate(0)
}
5% {
-webkit-transform:rotate(10deg)
}
10% {
-webkit-transform:rotate(-9deg)
}
15% {
-webkit-transform:rotate(8deg)
}
20% {
-webkit-transform:rotate(-7deg)
}
25% {
-webkit-transform:rotate(6deg)
}
30% {
-webkit-transform:rotate(-5deg)
}
35% {
-webkit-transform:rotate(4deg)
}
40% {
-webkit-transform:rotate(-3deg)
}
45% {
-webkit-transform:rotate(2deg)
}
100%, 50% {
-webkit-transform:rotate(0)
}
}
@-moz-keyframes swinging {
0% {
-moz-transform:rotate(0)
}
5% {
-moz-transform:rotate(10deg)
}
10% {
-moz-transform:rotate(-9deg)
}
15% {
-moz-transform:rotate(8deg)
}
20% {
-moz-transform:rotate(-7deg)
}
25% {
-moz-transform:rotate(6deg)
}
30% {
-moz-transform:rotate(-5deg)
}
35% {
-moz-transform:rotate(4deg)
}
40% {
-moz-transform:rotate(-3deg)
}
45% {
-moz-transform:rotate(2deg)
}
100%, 50% {
-moz-transform:rotate(0)
}
}
@keyframes swinging {
0% {
transform:rotate(0)
}
5% {
transform:rotate(10deg)
}
10% {
transform:rotate(-9deg)
}
15% {
transform:rotate(8deg)
}
20% {
transform:rotate(-7deg)
}
25% {
transform:rotate(6deg)
}
30% {
transform:rotate(-5deg)
}
35% {
transform:rotate(4deg)
}
40% {
transform:rotate(-3deg)
}
45% {
transform:rotate(2deg)
}
100%, 50% {
transform:rotate(0)
}
}
@keyframes shake-chunk {
2% {
transform:translate(11px, 12px) rotate(-8deg)
}
4% {
transform:translate(9px, 8px) rotate(10deg)
}
6% {
transform:translate(13px, 13px) rotate(11deg)
}
8% {
transform:translate(14px, -1px) rotate(-14deg)
}
10% {
transform:translate(6px, 9px) rotate(-10deg)
}
12% {
transform:translate(-7px, -5px) rotate(7deg)
}
14% {
transform:translate(5px, 7px) rotate(2deg)
}
16% {
transform:translate(7px, 2px) rotate(-12deg)
}
18% {
transform:translate(14px, 6px) rotate(-5deg)
}
20% {
transform:translate(-5px, -8px) rotate(7deg)
}
22% {
transform:translate(14px, -13px) rotate(-3deg)
}
24% {
transform:translate(15px, -3px) rotate(-3deg)
}
26% {
transform:translate(8px, -11px) rotate(5deg)
}
28% {
transform:translate(1px, -11px) rotate(-3deg)
}
30% {
transform:translate(15px, 11px) rotate(0deg)
}
32% {
transform:translate(4px, 10px) rotate(1deg)
}
34% {
transform:translate(-11px, 11px) rotate(-6deg)
}
36% {
transform:translate(2px, -12px) rotate(4deg)
}
38% {
transform:translate(-2px, -6px) rotate(5deg)
}
0%, 100%, 40% {
transform:translate(0, 0) rotate(0)
}
}
.shake-little {
	animation-duration: 5s;
	animation-iteration-count: infinite;
	animation-name: shake-little;
	animation-timing-function: ease-in-out
}
@keyframes shake-little {
2% {
transform:translate(1px, 1px) rotate(0.5deg)
}
4% {
transform:translate(1px, 0) rotate(0.5deg)
}
10%, 6%, 8% {
transform:translate(1px, 1px) rotate(0.5deg)
}
12%, 14% {
transform:translate(0px, 1px) rotate(0.5deg)
}
16% {
transform:translate(0px, 0) rotate(0.5deg)
}
18% {
transform:translate(1px, 0) rotate(0.5deg)
}
20% {
transform:translate(0px, 1px) rotate(0.5deg)
}
22% {
transform:translate(0px, 0) rotate(0.5deg)
}
24%, 26% {
transform:translate(1px, 0) rotate(0.5deg)
}
28% {
transform:translate(0px, 0) rotate(0.5deg)
}
30% {
transform:translate(0px, 1px) rotate(0.5deg)
}
32% {
transform:translate(1px, 1px) rotate(0.5deg)
}
34% {
transform:translate(0px, 0) rotate(0.5deg)
}
36%, 38% {
transform:translate(1px, 0) rotate(0.5deg)
}
40% {
transform:translate(0px, 1px) rotate(0.5deg)
}
42% {
transform:translate(1px, 1px) rotate(0.5deg)
}
44% {
transform:translate(1px, 0) rotate(0.5deg)
}
46%, 48% {
transform:translate(1px, 1px) rotate(0.5deg)
}
50%, 52% {
transform:translate(0px, 1px) rotate(0.5deg)
}
54% {
transform:translate(0px, 0) rotate(0.5deg)
}
56% {
transform:translate(1px, 0) rotate(0.5deg)
}
58% {
transform:translate(0px, 1px) rotate(0.5deg)
}
60% {
transform:translate(1px, 0) rotate(0.5deg)
}
62% {
transform:translate(0px, 1px) rotate(0.5deg)
}
64% {
transform:translate(1px, 0) rotate(0.5deg)
}
66%, 68% {
transform:translate(1px, 1px) rotate(0.5deg)
}
70%, 72% {
transform:translate(0px, 0) rotate(0.5deg)
}
74% {
transform:translate(1px, 0) rotate(0.5deg)
}
76% {
transform:translate(1px, 1px) rotate(0.5deg)
}
78% {
transform:translate(0px, 0) rotate(0.5deg)
}
80% {
transform:translate(1px, 0) rotate(0.5deg)
}
82% {
transform:translate(0px, 0) rotate(0.5deg)
}
84% {
transform:translate(1px, 1px) rotate(0.5deg)
}
86% {
transform:translate(1px, 0) rotate(0.5deg)
}
88% {
transform:translate(0px, 0) rotate(0.5deg)
}
90% {
transform:translate(1px, 0) rotate(0.5deg)
}
92% {
transform:translate(0px, 0) rotate(0.5deg)
}
94% {
transform:translate(0px, 1px) rotate(0.5deg)
}
96% {
transform:translate(0px, 0) rotate(0.5deg)
}
98% {
transform:translate(0px, 1px) rotate(0.5deg)
}
0%, 100% {
transform:translate(0, 0) rotate(0)
}
}
.adv-tcp>img {
	width: 40%
}
@media (min-width:735px) {
.tc-section-bg {
	background-position-y: 0
}
.section {
	height: 600px;
	padding-top: 40px;
	overflow: hidden
}
.tc-section>.container {
	padding-top: 80px
}
.compatibility-div {
	height: 100px
}
.compatibility-section h1 {
	margin-bottom: 15px
}
.compatibility-section {
	padding-top: 15px
}
.compatibility-section .block {
	height: 350px
}
.carousel-section .item {
	height: 550px
}
.carousel-section {
	padding-top: 30px
}
.carousel-section .item img {
	width: 55%
}
.function-section {
	min-height: 1050px
}
.function-section .table tr td .txt {
	width: 175px
}
.adv-tcp {
	height: 600px
}
.adv-tcp>img {
	width: 40%
}
}
@media (min-width:1068px) {
.tc-section-bg {
	background-position-y: 50px
}
.section {
	height: 800px
}
.tc-section>.container {
	padding-top: 140px
}
.compatibility-div {
	height: 150px
}
.compatibility-section h1 {
	margin-bottom: 15px
}
.compatibility-section {
	padding-top: 80px
}
.carousel-section {
	padding-top: 70px
}
.carousel-section .item {
	height: 680px
}
.carousel-section .item img {
	width: auto
}
.function-section {
	height: 1100px
}
.function-section .table tr td .txt {
	width: 170px
}
.adv-tcp {
	height: 800px
}
.adv-tcp>img {
	width: auto
}
}
@media (min-width:1442px) {
.tc-section-bg {
	background-position-y: 50px
}
.section {
	height: 800px
}
.tc-section>.container {
	padding-top: 140px
}
.compatibility-div {
	height: 150px
}
.compatibility-section h1 {
	margin-bottom: 15px
}
.compatibility-section {
	padding-top: 80px
}
.carousel-section {
	padding-top: 70px
}
.carousel-section .item {
	height: 680px
}
.carousel-section .item img {
	width: auto
}
.function-section {
	height: 1100px
}
.function-section .table tr td .txt {
	width: 170px
}
.adv-tcp {
	height: 800px
}
.adv-tcp>img {
	width: auto
}
}
.function-section {
	height: 1100px;
	box-sizing: border-box;
	padding-top: 70px
}
#tabs1, #tabs2, #tabs3 {
	padding-top: 50px
}
[class*=" icon38-"], [class^=icon38-] {
height:88px;
width:72px
}
.function-section .table tr td .txt {
	padding: 15px 0 2px 12px;
	line-height: 20px
}
.tc-section {
	padding-top: 0
}
.adv-tcp>img.close-adv-tcp {
	position: absolute;
	top: -5%;
	right: 40px;
	cursor: pointer;
	width: 68px
}
body>a {
	color: transparent;
	height: 0
}
.qqBoxs {
	width: 170px;
	background: #fff;
	position: fixed;
	top: 100px;
	right: -170px;
	z-index: 999
}
.qqBoxs .floatDtt {
	width: 100%;
	height: 45px;
	line-height: 45px;
	background: #f08326;
	color: #fff;
	font-size: 18px;
	text-indent: 22px;
	position: relative
}
.qqBoxs .floatDqq {
	padding: 0 14px
}
.qqBoxs .floatDqq li {
	vertical-align: middle;
	height: 45px;
	line-height: 45px;
	font-size: 15px;
	border-bottom: 1px solid #e3e3e3;
	text-align: left
}
.qqBoxs .floatDqq li img {
	float: left;
	margin-top: 9px;
	margin-right: 8px;
	vertical-align: middle
}
.qqBoxs .floatDtxt {
	font-size: 18px;
	color: #333;
	padding: 12px 14px
}
.qqBoxs .floatDtel {
	padding: 0 0 15px 10px;
	font-size: 12px;
	color: #f08326
}
.qqBoxs .floatImg {
	text-align: center;
	padding: 10px;
	background: #EBEBEB
}
.qqBoxs .floatImg img {
	margin-bottom: 5px;
	max-width: 150px
}
.qqBoxs .floatDtel img {
	display: block
}
.qqBoxs .floatDbg {
	width: 100%;
	height: 20px;
	background: url(img/online_botbg.jpg) no-repeat;
	box-shadow: -2px 0 3px rgba(0,0,0,.25)
}
.floatShadow {
	background: #fff;
	box-shadow: -2px 0 3px rgba(0,0,0,.25)
}
.rightArrow {
	width: 50px;
	height: 45px;
	background: url(img/online_arrow.jpg) no-repeat -50px 0;
	position: fixed;
	top: 100px;
	right: 0;
	z-index: 999
}
.rightArrow a {
	display: block;
	height: 45px
}