@charset "UTF-8";



body,
html {

    height: 100%
}



.top-nav,

body {

    min-width: 1200px
}



.m,

.welcom {

    overflow: hidden
}



.jspContainer,

.jspScrollable,

.jspVerticalBar .jspArrow:focus,

a {

    outline: 0
}



a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {

    margin: 0;

    padding: 0;

    border: 0;

    font-family: inherit;

    font-size: 100%;

    vertical-align: baseline;

    outline: 0
}



.partner img,

.top-nav .logo img,

caption,
td,
th {

    vertical-align: middle
}



html {

    line-height: 1;

    overflow-x: hidden
}



body {

    -webkit-font-smoothing: antialiased;

    font-family: 'Microsoft Yahei';

    font-size: 14px;

    color: #4d4d4d;

    line-height: 1.8;

    background: #213a59;

    visibility: hidden
}



ol,
ul {

    list-style: none
}



table {

    border-collapse: collapse;

    border-spacing: 0
}



caption,
td,
th {

    text-align: left;

    font-weight: 400
}



blockquote,
q {

    quotes: none
}



blockquote:after,

blockquote:before,

q:after,
q:before {

    content: "";

    content: none
}



a,
img {

    border: none
}



article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {

    display: block
}



.c-page,

body.loaded {

    visibility: visible;

    -moz-animation: fadeIn 3s ease;

    -webkit-animation: fadeIn 3s ease;

    animation: fadeIn 3s ease
}



a {

    text-decoration: none;

    color: #7f7f7f
}



.yellow {

    //color: #ffa200;

    color: #FFFF00;

}



.inner {

    width: 1200px;

    margin: 0 auto;

    position: relative
}



.i-btn:after,

.scale-for-small,

.top-nav,

.top-nav .qp {

    position: absolute
}



.col-left,

.col-right {

    display: none
}



.scale-for-small {

    -moz-transition: all .3s ease;

    -o-transition: all .3s ease;

    -webkit-transition: all .3s ease;

    transition: all .3s ease;

    z-index: 1
}



.chapter-title {

    height: 38px;

    margin-bottom: 20px;

    background-image: url(../images/text.png);

    background-repeat: no-repeat
}



.chapter-title span {

    display: block;

    padding: 20px 0 0 162px
}



.i-btn:after {

    display: none;

    content: '';

    z-index: 1;

    -moz-transition: all .3s ease;

    -o-transition: all .3s ease;

    -webkit-transition: all .3s ease;

    transition: all .3s ease;

    width: 0;

    height: 100%;

    left: 0;

    top: 0;

    background: #ffa200;

    opacity: 0
}



.i-btn:hover:after {

    opacity: 1;

    width: 100%
}



.ie6 .top-nav {

    position: absolute
}



.top-nav {

    width: 100%;

    height: 135px;

    line-height: 135px;

    z-index: 22;

    display: none
}



.top-nav .qp {

    width: 16px;

    height: 16px;

    background: #f60;

    border-radius: 50%;

    opacity: 0;

    left: 250px;

    top: 35px
}



.top-nav .qp-1 {

    -moz-animation: qp-1 3s 1.2s linear infinite;

    -webkit-animation: qp-1 3s 1.2s linear infinite;

    animation: qp-1 3s 1.2s linear infinite;

    left: 190px
}



.top-nav .qp-2 {

    -moz-animation: qp-2 3s 1.5s linear infinite;

    -webkit-animation: qp-2 3s 1.5s linear infinite;

    animation: qp-2 3s 1.5s linear infinite;

    background: #fff;

    left: 175px
}



.top-nav .qp-3 {

    -moz-animation: qp-3 3s 2s linear infinite;

    -webkit-animation: qp-3 3s 2s linear infinite;

    animation: qp-3 3s 2s linear infinite;

    left: 180px
}



.top-nav .qp-4 {

    -moz-animation: qp-4 2s 2.1s linear infinite;

    -webkit-animation: qp-4 2s 2.1s linear infinite;

    animation: qp-4 2s 2.1s linear infinite;

    left: 190px
}



.top-nav .qp-5 {

    -moz-animation: qp-5 3s 2.4s linear infinite;

    -webkit-animation: qp-5 3s 2.4s linear infinite;

    animation: qp-5 3s 2.4s linear infinite;

    background: #fff
}



.top-nav .qp-6 {

    -moz-animation: qp-6 2s 2.4s linear infinite;

    -webkit-animation: qp-6 2s 2.4s linear infinite;

    animation: qp-6 2s 2.4s linear infinite;

    background: #fff
}



.top-nav .qp-7 {

    -moz-animation: qp-7 3s 2.4s linear infinite;

    -webkit-animation: qp-7 3s 2.4s linear infinite;

    animation: qp-7 3s 2.4s linear infinite;

    left: 170px
}



.top-nav .qp-8 {

    -moz-animation: qp-8 3.5s 2.4s linear infinite;

    -webkit-animation: qp-8 3.5s 2.4s linear infinite;

    animation: qp-8 3.5s 2.4s linear infinite;

    left: 230px
}



.top-nav .qp-9 {

    -moz-animation: qp-8 2s 2.4s linear infinite;

    -webkit-animation: qp-8 2s 2.4s linear infinite;

    animation: qp-8 2s 2.4s linear infinite;

    background: #fff;

    left: 170px
}



.top-nav .logo {

    float: left;

    margin-left: 100px
}



.top-nav .logo img {

    max-width: 200px;

}



.top-nav .nav-list {

    float: right;

    position: relative
}



.top-nav .nav-list ul {

    position: relative;

    z-index: 2
}



.top-nav .nav-list a {

    color: #fff;

    display: block;

    //width: 56px;

    padding: 0 38px;

    height: 100%;

    text-align: center
}



.fixed-nav .nav-border,

.fixed-nav .qp,

.ie .top-nav .nav-border,

.ie .top-nav .qp,

.ie7 .top-nav .nav-border,

.ie7 .top-nav .qp,

.ie8 .top-nav .nav-border,

.ie8 .top-nav .qp,

.ie9 .top-nav .nav-border,

.ie9 .top-nav .qp {

    display: none
}



.top-nav .nav-list .nav-label {

    position: absolute;

    z-index: 1;

    height: 100%;

    background: #4fa8cd;

    -moz-transition: all .5s ease;

    -o-transition: all .5s ease;

    -webkit-transition: all .5s ease;

    transition: all .5s ease;

    left: 0;

    width: 132px
}



.top-nav .nav-border {

    position: absolute;

    width: 100%;

    height: 1px;

    background: #98aac0;

    left: 0;

    bottom: 0
}



.top-nav li {

    float: left
}



.fixed-nav,

.ie .top-nav,

.ie7 .top-nav,

.ie8 .top-nav,

.ie9 .top-nav {

    position: fixed;

    background: #5484b6;

    height: 56px;

    top: 0;

    left: 0;

    line-height: 56px
}



.fixed-nav img,

.ie .top-nav img,

.ie7 .top-nav img,

.ie8 .top-nav img,

.ie9 .top-nav img {

    width: 140px
}



.top-nav .ch-en-a-box {

    position: absolute;

    top: 12px;

    left: 320px;

    width: auto;

    height: 40px;

    line-height: 40px;

}

.to-ch-a,
.to-en-a {

    color: #fff;

    display: inline-block;

    width: 40px;

    text-align: center;

    background: #3C6F9B;

    height: 20px;
    ;

    line-height: 20px;

    border: 1px solid #3A668C;

    margin-left: 5px;

}

.to-ch-a {}

.to-en-a:hover,
.to-ch-a:hover {

    background: #4FA8CD;

}

.to-ch-a-hover {

    background: #4fa8cd;

}

.back-to-top .ch-en-a-box {

    top: 49px;

    left: 330px;

}

.top-nav .logo-home {

    display: block;

}

.top-nav .logo-page {

    display: none;

}

.fixed-nav .logo-home {

    display: none;

}

.fixed-nav .logo-page {

    display: block;

}

.about-us .company-info {

    height: 320px;

}



.welcom,

.welcom .title {

    width: 100%;

    position: absolute
}



.welcom {

    -moz-perspective: 500px;

    -webkit-perspective: 500px;

    perspective: 500px;

    height: 100%;

    background: url(../images/m1.jpg) top center no-repeat;

    -moz-background-size: cover;

    -o-background-size: cover;

    -webkit-background-size: cover;

    background-size: cover
}



.welcom .title {

    left: 0;

    top: 20%;

    text-align: center;

    visibility: hidden
}



.loaded .welcom .title {

    visibility: visible
}



.loaded .welcom .title-1 {

    -moz-animation: titleDrop 2.5s ease;

    -webkit-animation: titleDrop 2.5s ease;

    animation: titleDrop 2.5s ease
}



.loaded .welcom .title-2 {

    -moz-animation: titleUp 2.5s ease;

    -webkit-animation: titleUp 2.5s ease;

    animation: titleUp 2.5s ease
}



.welcom .winter {

    position: absolute;

    opacity: .8;

    visibility: hidden
}



.loaded .welcom .winter {

    visibility: visible;

    -moz-animation: winterFadeIn 6s ease;

    -webkit-animation: winterFadeIn 6s ease;

    animation: winterFadeIn 6s ease
}



.welcom .winter-1 {

    left: 22%;

    top: 7%
}



.welcom .winter-2 {

    left: 12%;

    top: 34%
}



.welcom .winter-3 {

    left: 80%;

    top: 30%
}



.welcom .winter-4 {

    left: 65%;

    top: 15%
}



.welcom .winter-5 {

    left: 10%;

    top: 75%
}



.welcom .winter-6 {

    left: 90%;

    top: 77%
}



.welcom .rocket {

    position: absolute;

    width: 427px;

    height: 446px;

    -moz-transform-style: preserve-3d;

    -webkit-transform-style: preserve-3d;

    transform-style: preserve-3d;

    left: 25%;

    top: 101%
}



.welcom .rocket img {

    position: absolute;

    width: 100%;

    left: 0;

    top: 0
}



.welcom .rocket img:nth-child(2) {

    -moz-animation: rocketFire .5s linear infinite;

    -webkit-animation: rocketFire .5s linear infinite;

    animation: rocketFire .5s linear infinite
}



.welcom .start {

    position: absolute;

    width: 78px;

    height: 86px;

    left: 50%;

    top: 50%;

    margin-left: -39px;

    margin-top: 86px;

    display: none;

    background: url(../images/down2.png) no-repeat
}



.video,

.wrap {

    position: relative
}



.welcom .ready {

    -moz-animation: ready 3s ease-in-out infinite;

    -webkit-animation: ready 3s ease-in-out infinite;

    animation: ready 3s ease-in-out infinite;

    -moz-transform: scale(1.3, 1.3);

    -ms-transform: scale(1.3, 1.3);

    -webkit-transform: scale(1.3, 1.3);

    transform: scale(1.3, 1.3)
}



.go .rocket {

    -moz-animation: flyUp 3s ease-in-out;

    -webkit-animation: flyUp 3s ease-in-out;

    animation: flyUp 3s ease-in-out
}



.welcomed .welcom {

    z-index: 1;

    -moz-animation: scaleFadeOut 2s ease;

    -webkit-animation: scaleFadeOut 2s ease;

    animation: scaleFadeOut 2s ease
}



.welcomed .wrap {

    z-index: 2;

    display: block;

    -moz-animation: fadeIn 2s ease;

    -webkit-animation: fadeIn 2s ease;

    animation: fadeIn 2s ease
}



.video,

.video video {

    z-index: 1;

    width: 100%
}



.welcomed .top-nav {

    display: block;

    -moz-animation: dropDown 2s ease;

    -webkit-animation: dropDown 2s ease;

    animation: dropDown 2s ease
}



.about-us .more,

.about-us.show-more .about-more,

.about-us.show-more li,

.wrap {

    display: none
}



.welcomed .fixed-nav {

    -moz-animation: dropDown2 1s ease;

    -webkit-animation: dropDown2 1s ease;

    animation: dropDown2 1s ease
}



.video {

    height: auto;

    background: #000
}



.video video {

    position: absolute;

    left: 0;

    top: 0;

    height: 100%;

    object-fit: cover
}



.video .video-mask {

    position: absolute;

    width: 100%;

    height: 100%;

    z-index: 2;

    background: url(../images/video-mask.png)
}



.about-us {

    height: 730px;

    background: url(../images/about-bg.jpg) top center no-repeat
}



.about-title {

    display: none;

    text-align: center;

    color: #155896;

    font-size: 36px;

    font-weight: bold;

    padding: 40px 0 20px;

}

.about-title span {

    display: block;

    color: #155896;

    font-size: 22px;

    font-weight: normal;

    line-height: 22px;

}

.about-title span:before,
.about-title span:after {

    content: '';

    display: inline-block;

    width: 70px;

    vertical-align: middle;

    border-bottom: 1px solid #155896;

}

.about-title span:before {

    margin-right: 10px;

}

.about-title span:after {

    margin-left: 10px;

}



.about-us .about-cont {

    display: none;

    position: relative;

    width: 665px;

    height: 290px;

    padding: 20px;

    margin-top: 50px;

    font-size: 14px;

    color: #155896;

    line-height: 24px;

    border: 1px solid #fff;

    overflow-y: auto;

    overflow-x: hidden;

}

.about-us .about-cont p {

    text-indent: 2rem;

}



.about-us .about-cont i {
    position: absolute;
    width: 36px;
    height: 25px;
    background: url(../images/about-el.png) no-repeat 0 0;
}

.about-us .about-cont .l {
    top: -25px;
    left: -56px;
    _left: -106px;
    background-position: 0 -25px;
}

.about-us .about-cont .r {
    bottom: -16px;
    _top: 12em;
    right: -56px;
    _right: 0;
    background-position: 0 -0;
}



.about-us .about-more {

    position: absolute;

    width: 18px;

    height: 18px;

    right: 10px;

    top: 343px;

    background: url(../images/more-btn.png) no-repeat
}



.about-us .col-left {

    width: 615px;

    left: 0;

    top: 75px;

    z-index: 2
}



.about-us .col-right {

    width: 775px;

    height: 305px;

    left: 600px;

    top: 183px;

    overflow: hidden
}



.about-us.active .col-right {

    -moz-animation: none;

    -webkit-animation: none;

    animation: none
}



.about-us .more,

.development .dev-list li {

    -moz-animation: fromBottom2 1s ease;

    -webkit-animation: fromBottom2 1s ease
}



.about-us .ipad,

.about-us .iphone {

    position: absolute;

    z-index: 1;

    display: none
}



.about-us .iphone {

    z-index: 2;

    right: 0;

    top: 130px
}



.about-us .chapter-title {

    background-position: 0 0;

    color: #bfbfbf
}



.about-us .chapter-title span {

    padding: 20px 0 0 163px
}



.about-us .company-info {

    height: 305px;

    overflow: auto
}



.about-us .company-info ul {

    margin-right: 10px
}



.about-us li {

    text-indent: 2em;

    background: url(../images/list-style.png) left 5px no-repeat;

    border-bottom: 1px dotted #e2e2e2;

    margin-bottom: 5px;

    padding-bottom: 5px
}



.about-us .more {

    animation: fromBottom2 1s ease
}



.about-us.show-more .more {

    display: block
}



.about-us li:last-child,

.about-us li:nth-child(4) {

    border-bottom: none
}



.branch {

    height: 719px;

    background: url(../images/branch-bg.jpg) top center no-repeat
}



.branch-title {

    display: none;

    text-align: center;

    color: #155896;

    font-size: 36px;

    font-weight: bold;

    padding: 40px 0 20px;

}

.branch-title span {

    display: block;

    color: #155896;

    font-size: 22px;

    font-weight: normal;

    line-height: 22px;

}

.branch-title span:before,
.branch-title span:after {

    content: '';

    display: inline-block;

    width: 70px;

    vertical-align: middle;

    border-bottom: 1px solid #155896;

}

.branch-title span:before {

    margin-right: 10px;

}

.branch-title span:after {

    margin-left: 10px;

}



.branch-cont {

    display: none;

    float: left;

    width: 450px;

    height: 416px;

    color: #155896;

    border: 1px solid #fff;

    padding: 20px;

    margin-top: 20px;

    overflow-y: auto;

    overflow-x: hidden;

}



.branch-img {

    display: none;

    float: right;

    margin-top: 20px;

}



.branch-img img {

    display: block;

    margin-bottom: 4px;

}



.branch-img li {

    float: left;

    width: 226px;

    margin-left: 4px;

}



.branch-img li .branch-l {

    float: left;

    margin-right: 4px;



}



.culture {

    height: 582px;

    background: url(../images/culture-bg.jpg) top center no-repeat
}



.culture-title {

    display: none;

    text-align: center;

    color: #828282;

    font-size: 36px;

    font-weight: bold;

    padding: 40px 0 20px;

}

.culture-title span {

    display: block;

    color: #828282;

    font-size: 22px;

    font-weight: normal;

    line-height: 22px;

}

.culture-title span:before,
.culture-title span:after {

    content: '';

    display: inline-block;

    width: 70px;

    vertical-align: middle;

    border-bottom: 1px solid #828282;

}

.culture-title span:before {

    margin-right: 10px;

}

.culture-title span:after {

    margin-left: 10px;

}



.culture .culture-cont {

    display: block;

    overflow: hidden;

    padding: 50px 0;

}

.culture .culture-li {

    display: none;

    width: 276px;

    height: auto;

    float: left;

    text-align: center;

    margin-right: 24px;

}

.culture .culture-li:nth-child(1) span {

    color: #2e9655;

}

.culture .culture-li:nth-child(2) span {

    color: #4c70b2;

}

.culture .culture-li:nth-child(3) span {

    color: #be4a54;

}

.culture .culture-li:nth-child(4) span {

    color: #ef8133;

}

.culture .culture-li p {

    font-size: 20px;

    color: #999;

}





.jspContainer {

    overflow: hidden;

    position: relative
}



.jspHorizontalBar,

.jspPane,

.jspVerticalBar {

    position: absolute
}



.jspVerticalBar {

    top: 0;

    right: 0;

    width: 4px;

    height: 380px
}



.jspHorizontalBar {

    bottom: 0;

    left: 0;

    width: 100%;

    height: 1px;

    background: #fff;

    display: none
}



.jspHorizontalBar *,

.jspVerticalBar * {

    margin: 0;

    padding: 0
}



.jspCap {

    display: none
}



.jspHorizontalBar .jspCap {

    float: left
}



.jspTrack {

    position: relative;

    border-left: 1px solid #947f78
}



.jspDrag {

    position: relative;

    height: 8px;

    top: 0;

    left: -2px;

    cursor: pointer;

    background-color: #4b4342
}



.jspHorizontalBar .jspDrag,

.jspHorizontalBar .jspTrack {

    float: left;

    height: 100%
}



.jspArrow {

    background: #50506d;

    text-indent: -20000px;

    display: block;

    cursor: pointer
}



.jspArrow.jspDisabled {

    cursor: default;

    background: #80808d
}



.jspVerticalBar .jspArrow {

    height: 16px
}



.jspHorizontalBar .jspArrow {

    width: 16px;

    float: left;

    height: 100%
}



.jspCorner {

    background: #eeeef4;

    float: left;

    height: 100%
}



.development {

    position: relative;

    /*    height: 760px;*/

    background: url(../images/development-bg.jpg) top center no-repeat
}



.development-title {

    display: none;

    text-align: center;

    color: #fff;

    font-size: 36px;

    font-weight: bold;

    padding: 40px 0 20px;

}

.development-title span {

    display: block;

    color: #fff;

    font-size: 22px;

    font-weight: normal;

    line-height: 22px;

}

.development-title span:before,
.development-title span:after {

    content: '';

    display: inline-block;

    width: 70px;

    vertical-align: middle;

    border-bottom: 1px solid #fff;

}

.development-title span:before {

    margin-right: 10px;

}

.development-title span:after {

    margin-left: 10px;

}



.development .dev-cont {

    margin: 0 95px;

}



.development .years {

    margin-left: 200px;

    color: #fff;

    font-size: 20px;

    text-align: center;

}

.development .years li {

    float: left;

    width: 76px;

    height: 100px;

    padding-top: 20px;

    margin-right: 38px;

    background: url(../images/development-el.png) no-repeat -76px 0;

    cursor: pointer;

}

.development .years .active {

    background-position: 0 0;

}



.development .jspTrack {

    border-color: #F6F8FB
}



.development .jspDrag {

    background-color: #2A2E35
}



.development .col-left {

    width: 770px;

    height: 430px;

    left: -15px;

    top: 160px;

    background: url(../images/mac.png) no-repeat
}



.development .col-right {

    width: 475px;

    left: 705px;

    top: 175px
}



.development .map {

    position: relative;

    width: 551px;

    height: 283px;

    left: 107px;

    top: 60px;

    background: url(../images/map.png) no-repeat
}



.development .time-line {

    position: absolute;

    width: 718px;

    height: 358px;

    left: 20px;

    top: 20px;

    background: url(../images/time-line.png) no-repeat
}



.development .time-dot {

    position: absolute;

    width: 19px;

    height: 20px;

    background: url(../images/flag.png) -47px 0 no-repeat;

    display: none
}



.development .year-2016 .dev-2016 {
    display: block;
}



.development .time-dot-2012 {
    left: 251px;
    top: 296px;
}

.development .time-dot-2013 {
    left: 343px;
    top: 250px;
}

.development .time-dot-2014 {
    left: 440px;
    top: 226px;
}

.development .time-dot-2015 {
    left: 519px;
    top: 151px;
}

.development .time-dot-2016 {
    left: 605px;
    top: 109px;
}



.development .time-flag {

    position: absolute;

    width: 56px;

    height: 90px;

    background: url(../images/flag.png) 0 -20px no-repeat;

    display: none
}



.development .time-flag span {

    display: block;

    color: #fff;

    text-align: center;

    padding-top: 18px
}



.development .drop {

    display: block;

    -moz-animation: dropDown 1.5s ease-out;

    -webkit-animation: dropDown 1.5s ease-out;

    animation: dropDown 1.5s ease-out
}





.development .time-flag-2012 {
    left: 232px;
    top: 216px;
}

.development .time-flag-2013 {
    left: 325px;
    top: 170px;
}

.development .time-flag-2014 {
    left: 421px;
    top: 146px;
}

.development .time-flag-2015 {
    left: 500px;
    top: 72px;
}

.development .time-flag-2016 {
    left: 586px;
    top: 29px;
}



.development .active {

    background-position: -57px -20px
}



.development .chapter-title {

    margin-left: 110px;

    background-position: 0 -41px;

    color: #80bdff;

    -moz-transition: all 1s ease;

    -o-transition: all 1s ease;

    -webkit-transition: all 1s ease;

    transition: all 1s ease
}



.development .chapter-title span {

    padding: 18px 0 0 160px
}



.development .dev-summary {

    color: #fff
}



.development.listed .dev-show-btn,

.development.listed .dev-summary {

    display: none
}



.development.listed .chapter-title {

    margin-top: -60px
}



.development .dev-show-btn,

.development .dev-show-btn span {

    display: block;

    margin: 20px auto 0;

    overflow: hidden;

    position: relative
}



.development.listed .dev-list {

    display: block
}



.development .dev-show-btn {

    width: 246px;

    height: 66px;

    border: 1px solid #fff;

    border-radius: 3px;

    -moz-transition: border-color .3s ease;

    -o-transition: border-color .3s ease;

    -webkit-transition: border-color .3s ease;

    transition: border-color .3s ease;

    border-left-width: 2px;

    border-right-width: 2px
}



.development .dev-show-btn span {

    width: 162px;

    height: 25px;

    background: url(../images/text.png) 0 -237px no-repeat;

    text-indent: -9999em;

    z-index: 2
}



.development .dev-show-btn:hover {

    border-color: #ffa200
}



.development .dev-list {

    color: #555;

    /*padding-left: 45px;*/

    /*width: 470px;*/

    /*height: 415px;*/

    height: 395px;

    display: none;

    overflow: auto
}



.development .dev-list li {

    padding-left: 82px;

    text-indent: -82px;

    margin-bottom: 4px;

    margin-right: 10px;

    display: none;

    animation: fromBottom2 1s ease
}



.development .year-2011 .dev-2011,

.development .year-2012 .dev-2012,

.development .year-2013 .dev-2013,

.development .year-2014 .dev-2014,

.development .year-2015 .dev-2015,

.development .year-all li {

    display: block
}



.cent-line {

    display: block;

    height: 2px;

    width: 100%;

    position: absolute;

    left: 0;

    top: 450px;

    background-color: #85c6fc;

}

.dev-history {

    display: none;

    width: 100%;

    height: 470px;

    position: relative;

    margin-top: 86px;

}

.dev-history .bd {

    width: 1080px;

    height: 470px;

    margin: 0 auto;

    overflow: hidden;

}

.dev-history .bd ul {

    height: 470px;

}

.dev-history .bd ul li {

    float: left;

    width: 190px;

    height: 470px;

    text-align: center;

    position: relative;

    height: 100%;

    margin-right: -12px;

}

.dev-history .bd ul li.top {

    background: url(../images/line_05.png) no-repeat center 108px;

}

.dev-history .bd ul li.bot {

    background: url(../images/line_06.png) no-repeat center 222px;

}

.dev-history .bd ul li .date {

    font-size: 28px;

    line-height: 48px;

    width: 100%;

    position: absolute;

    left: 0;

}

.dev-history .bd ul li.top .date {

    top: 228px;

    color: #fab92d;

}

.dev-history .bd ul li.bot .date {

    top: 162px;

    color: #fab92d;

}

.dev-history .bd ul li .word {

    line-height: 20px;

    font-size: 14px;

    color: #fff;

    width: 90%;

    position: absolute;

    left: 0;

    padding: 5%;

}

.dev-history .bd ul li.top .word {

    bottom: 370px;

}

.dev-history .bd ul li.bot .word {

    top: 332px;

}

.dev-history .butn {

    display: block;

    width: 27px;

    height: 52px;

    position: absolute;

    cursor: pointer;

}

.dev-history .prev {

    background: url(../images/butn-p.png) no-repeat center;

    left: -28px;

    top: 194px;

}

.dev-history .next {

    background: url(../images/butn-n.png) no-repeat center;

    right: -28px;

    top: 194px;

}



.honor {

    height: 762px;

    background: url(../images/m4.png) top center no-repeat
}



.honor .col-left {

    width: 601px;

    height: 419px;

    position: relative;

    background: url(../images/honor.png) no-repeat;

    left: 55px;

    top: 155px
}



.honor .col-right {

    width: 475px;

    left: 733px;

    top: 140px
}



.honor .chapter-title {

    height: 36px;

    margin-left: 110px;

    background-position: 0 -119px;

    color: #bebebe
}



.honor .chapter-title span {

    padding: 17px 0 0 150px
}



.honor .honor-year {

    position: absolute;

    width: 56px;

    height: 56px;

    background: url(../images/circle.png) no-repeat
}



.honor .honor-year span {

    display: block;

    width: 56px;

    height: 56px;

    text-align: center;

    line-height: 56px;

    color: #fff
}



.honor .active {

    background-position: -56px 0
}



.honor .honor-btn-2012 {

    left: 506px;

    top: 250px
}



.honor .honor-btn-2013 {

    left: 390px;

    top: 230px
}



.honor .honor-btn-2014 {

    left: 278px;

    top: 192px
}



.honor .honor-btn-2015 {

    left: 169px;

    top: 144px
}

.honor .honor-btn-2016 {

    left: 70px;

    top: 83px
}



.honor .honor-list {

    width: 430px;

    height: 413px;

    overflow-y: auto;

    overflow-x: hidden
}



.honor .honor-list li {

    padding-left: 82px;

    margin-right: 10px;

    text-indent: -82px;

    margin-bottom: 5px;

    display: none;

    -moz-animation: fromBottom2 1s ease;

    -webkit-animation: fromBottom2 1s ease;

    animation: fromBottom2 1s ease
}



.honor.honor-all li {

    display: block
}



.honor.year-2012 li,

.honor.year-2013 li,

.honor.year-2014 li,

.honor.year-2015 li,

.honor.year-2016 li {

    display: none
}



.honor.year-2012 .honor-2012,

.honor.year-2013 .honor-2013,

.honor.year-2014 .honor-2014,

.honor.year-2015 .honor-2015,

.honor.year-2016 .honor-2016 {

    display: block
}



.honor .star {

    position: absolute;

    background-image: url(../images/start.png);

    background-repeat: no-repeat
}



.honor .star-1 {

    width: 26px;

    height: 25px;

    left: 127px;

    top: 10px;

    background-position: -61px 0
}



.honor .star-2 {

    width: 58px;

    height: 57px;

    left: 440px;

    top: 0;

    background-position: 0 0
}



.honor .star-3,

.honor .star-4,

.honor .star-5 {

    width: 30px;

    height: 31px;

    background-position: -58px -26px
}



.honor .star-3 {

    left: 0;

    top: 200px
}



.honor .star-4 {

    left: 155px;

    top: 220px
}



.honor .star-5 {

    left: 574px;

    top: 183px
}



/* 荣誉 */

.honor {

    height: 505px;

    background: #303030;

}

.honor-title {

    font-size: 36px;

    color: #ff5842;

    line-height: 42px;

    padding: 40px 0 40px;

}

.honor-title span {

    display: block;

    color: #fff;

    font-size: 22px;

    padding-left: 75px;

}

.honor-txt {

    width: 600px;

    margin-left: 75px;

}

.honor-txt ul li {

    font-size: 16px;

    color: #fff;

}

.honor-img {

    position: absolute;

    top: 0px;

    right: 0px;

    width: 470px;

    height: 435px;

    -webkit-animation: moveUp 4s linear infinite;

    -moz-animation: moveUp 4s linear infinite;

    animation: moveUp 4s linear infinite;

}



@-webkit-keyframes moveUp {

    0% {

        margin-top: 30px;

    }

    50% {

        margin-top: 70px;

    }

    100% {

        margin-top: 30px;

    }

}

@keyframes moveUp {

    0% {

        margin-top: 30px;

    }

    50% {

        margin-top: 70px;

    }

    100% {

        margin-top: 30px;

    }

}



.platform {

    /*height: 880px;*/

    height: 500px;

    background: none;
}



.platform-title {

    display: none;

    text-align: center;

    color: #fff;

    font-size: 36px;

    font-weight: bold;

    padding: 40px 0 20px;

}

.platform-title span {

    display: block;

    color: #fff;

    font-size: 22px;

    font-weight: normal;

    line-height: 22px;

}

.platform-title span:before,
.platform-title span:after {

    content: '';

    display: inline-block;

    width: 70px;

    vertical-align: middle;

    border-bottom: 1px solid #fff;

}

.platform-title span:before {

    margin-right: 10px;

}

.platform-title span:after {

    margin-left: 10px;

}



.platform .col-left {

    position: static;

    padding-top: 75px
}



.platform .chapter-title {

    background-position: 0 -155px;

    color: #a3a3a3
}



.platform .platform-summary {

    display: none;

    width: 420px;

    margin: 0 auto;

    font-size: 16px;

    color: #fff;

    margin-bottom: 40px;

}



.platform .platform-list {}



.platform .platform-list li {

    display: none;

    float: left;

    width: 568px;

    height: 487px;

    position: relative;

}



.platform .platform-list li.platform-1 {

    float: right
}



.platform .platform-list li:hover {}



.platform .platform-tip {

    width: 202px;

    height: 202px;

    margin: 0 auto;

    text-align: center;

    background: url(../images/platform-tip.png) no-repeat center;

}



.platform .platform-tip img {

    padding: 70px 0;

}



.platform .platform-info {

    width: 568px;

    height: 384px;

    background: url(../images/platform-info.png) no-repeat center;

    position: absolute;

    left: 0;

    bottom: 0;

}



.platform .platform-text {

    color: #fff;

    text-indent: 2rem;

    font-size: 14px;

    line-height: 24px;

    padding: 130px 60px 20px;

}





.platform .platform-list .show {

    display: block;

    -moz-animation: fromBottom 1s ease;

    -webkit-animation: fromBottom 1s ease;

    animation: fromBottom 1s ease
}



.platform .platform-list a {

    display: block;

    height: 100%;

    position: relative;

    overflow: hidden;

    color: #fff;

    z-index: 9;

}



.platform .platform-list a:after {

    /*background: #222c42*/

}



.platform .platform-list span {

    display: block;

    margin: 10px 95px;

    font-size: 16px;

    line-height: 1.5;

    text-indent: 2rem;

    position: relative;

    z-index: 2
}



.partner .no-margin,

.platform .platform-list .platform-37m {

    margin-right: 0
}



.platform .platform-list-title {

    width: 712px;

    height: 44px;

    /*margin: 120px 0 100px 244px;*/

    margin: 100px 0 60px 244px;

    background: url(../images/line.png) center no-repeat;

    display: none;

    -moz-animation: rotate 1.5s ease;

    -webkit-animation: rotate 1.5s ease;

    animation: rotate 1.5s ease
}



.platform .platform-list-title span {

    display: block;

    width: 377px;

    height: 44px;

    margin: 0 auto;

    text-align: center;

    font-size: 36px;

    color: #fff;

    line-height: 44px;

    overflow: hidden
}





.team {

    height: 760px;

    background: url(../images/team-bg.jpg) top center no-repeat;

}



.team-title {

    display: none;

    text-align: center;

    color: #fff;

    font-size: 36px;

    font-weight: bold;

    padding: 40px 0 20px;

}

.team-title span {

    display: block;

    color: #fff;

    font-size: 22px;

    font-weight: normal;

    line-height: 22px;

}

.team-title span:before,
.team-title span:after {

    content: '';

    display: inline-block;

    width: 70px;

    vertical-align: middle;

    border-bottom: 1px solid #fff;

}

.team-title span:before {

    margin-right: 10px;

}

.team-title span:after {

    margin-left: 10px;

}



.team-list {

    display: none;

    padding: 20px 0;

    overflow: hidden;

}



.team-list li {

    float: left;

    width: 285px;

    height: 250px;

    margin-bottom: 20px;

    margin-left: 20px;

}



.team-list li:nth-child(4n+1) {

    margin-left: 0;

}



.team-list li a {

    display: block;

    width: 285px;

    height: 250px;

    overflow: hidden;

    position: relative;

}



.team-list li a img {

    width: 295px;

    height: 250px;



    -webkit-transition: all .3s ease-in;

    -moz-transition: all .3s ease-in;

    -ms-transition: all .3s ease-in;

    -o-transition: all .3s ease-in;

    transition: all .3s ease-in;

}



.team-list li a p {

    width: 220px;

    line-height: 28px;

    color: #c6c6c6;

    text-align: center;

    position: absolute;

    left: 50%;

    margin-left: -110px;

    bottom: 100px;

    z-index: 2;



    -webkit-transition: all .3s ease-in;

    -moz-transition: all .3s ease-in;

    -ms-transition: all .3s ease-in;

    -o-transition: all .3s ease-in;

    transition: all .3s ease-in;

}



.team-list li a .bg-mask {

    width: 100%;

    height: 100%;

    background: #000;

    opacity: .5;

    filter: alpha(opacity=50);

    position: absolute;

    left: 0;

    top: 0;

    z-index: 1;



    -webkit-transition: all .3s ease-in;

    -moz-transition: all .3s ease-in;

    -ms-transition: all .3s ease-in;

    -o-transition: all .3s ease-in;

    transition: all .3s ease-in;

}

.team-list li a .bg-font {

    width: 100%;

    height: 52px;

    text-align: center;

    color: #fff;

    line-height: 52px;

    background: #cf1132;

    opacity: .9;

    filter: alpha(opacity=90);

    position: absolute;

    left: 0;

    bottom: -52px;

    z-index: 1;



    -webkit-transition: all .3s ease-in;

    -moz-transition: all .3s ease-in;

    -ms-transition: all .3s ease-in;

    -o-transition: all .3s ease-in;

    transition: all .3s ease-in;

}





.team-list li a:hover img {

    transform: translateX(-10px);

}

.team-list li a:hover p {

    bottom: 0px;

    color: #fff;

}

.team-list li a:hover .bg-mask {

    opacity: 0;

    filter: alpha(opacity=0);

}

.team-list li a:hover .bg-font {

    bottom: 0;

}



.team .col-left {

    position: static;

    padding-top: 85px
}



.team .chapter-title {

    background-position: 0 -196px;

    color: #bebebe
}



.footer a,

.footer p {

    color: #fff
}

.footer .beian,
.footer .beian2 {

    display: inline-block;

    position: relative;

    width: 20px;

    height: 20px;

    top: 3px;

}



.team .member {

    position: absolute;

    width: 100%;

    height: 453px;

    left: 0;

    top: 195px;

    overflow: hidden;

    color: #fff;

    z-index: 9;

    display: none;

    background: #000
}



.team .member ul {

    width: 2827px;

    position: relative;

    padding: 0 50px 0 20px;

    -moz-user-select: none;

    -webkit-user-select: none;

    -ms-user-select: none;

    -khtml-user-select: none;

    user-select: none;

    -moz-transition: -moz-transform 1s ease .5s;

    -o-transition: -o-transform 1s ease .5s;

    -webkit-transition: -webkit-transform 1s ease;

    -webkit-transition-delay: .5s;

    transition: transform 1s ease .5s
}



.team .member li {

    float: left;

    width: 257px;

    height: 453px;

    position: relative;

    overflow: hidden;

    background-repeat: no-repeat;

    cursor: url(../images/handler2.ico), move
}



.team .member .lyf {

    background-image: url(../images/lyf.jpg)
}



.team .member .zkt {

    background-image: url(../images/zkt.jpg)
}



.team .member .hyh {

    background-image: url(../images/hyh.jpg)
}



.team .member .yj {

    background-image: url(../images/yj.jpg-v=0.jpg)
}



.team .member .lx {

    background-image: url(../images/lx.jpg);

    background-position: 0 -12px
}



.team .member .xzg {

    background-image: url(../images/xzg.jpg)
}



.team .member .zhm {

    background-image: url(../images/zhm.jpg)
}



.team .member .hxx {

    background-image: url(../images/hxx.jpg)
}



.team .member .wzq {

    background-image: url(../images/wzq.jpg)
}



.team .member .zzh {

    background-image: url(../images/zzh.jpg)
}



.team .member .lzp {

    background-image: url(../images/lzp.jpg)
}



.team .member.moving ul {

    -moz-transition: none;

    -o-transition: none;

    -webkit-transition: none;

    transition: none
}



.team .f-mask {

    position: absolute;

    padding: 15px;

    left: 0;

    bottom: 0
}



.team .f-name {

    display: block;

    height: 32px;

    padding-top: 38px;

    background-image: url(../images/name.png);

    background-repeat: no-repeat;

    position: relative;

    z-index: 2;

    opacity: 0;

    filter: alpha(opacity=0)
}



.team .f-name i {

    margin-right: 5px
}



.team .f-name-bottom {

    position: absolute;

    bottom: 0;

    width: 100%;

    opacity: 1;

    filter: alpha(opacity=100);

    -moz-animation: fromBottom2 .5s ease;

    -webkit-animation: fromBottom2 .5s ease;

    animation: fromBottom2 .5s ease
}



.team .lyf .f-name {

    background-position: 0 0
}



.team .zkt .f-name {

    background-position: 0 -70px
}



.team .hyh .f-name {

    background-position: 0 -140px
}



.team .yj .f-name {

    background-position: 0 -210px
}



.team .lx .f-name {

    background-position: 0 -280px
}



.team .xzg .f-name {

    background-position: 0 -350px
}



.team .zhm .f-name {

    background-position: 0 -420px
}



.team .hxx .f-name {

    background-position: 0 -490px
}



.team .wzq .f-name {

    background-position: 0 -560px
}



.team .zzh .f-name {

    background-position: 0 -630px
}



.team .lzp .f-name {

    background-position: 0 -700px
}



.team .mask-after,

.team .mask-before {

    -webkit-transition: all .5s ease;

    height: 0;

    left: 50%;

    top: 50%;

    background: #000;

    opacity: 0;

    filter: alpha(opacity=0)
}



.team .f-summary {

    position: relative;

    z-index: 2;

    opacity: 0;

    filter: alpha(opacity=0)
}



.partner li span,

.team .mask-after,

.team .mask-before {

    position: absolute;

    z-index: 1
}



.team .mask-before {

    -moz-transition: all .5s ease;

    -o-transition: all .5s ease;

    transition: all .5s ease;

    width: 200%;

    -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg) skew(80deg);

    -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg) skew(80deg);

    -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg) skew(80deg);

    transform: translateX(-50%) translateY(-50%) rotate(45deg) skew(80deg)
}



.team .mask-after {

    -moz-transition: all .5s ease;

    -o-transition: all .5s ease;

    transition: all .5s ease;

    width: 100%;

    -moz-transform: translateX(50%) translateY(50%) rotate(-45deg) skew(-60deg);

    -ms-transform: translateX(50%) translateY(50%) rotate(-45deg) skew(-60deg);

    -webkit-transform: translateX(50%) translateY(50%) rotate(-45deg) skew(-60deg);

    transform: translateX(50%) translateY(50%) rotate(-45deg) skew(-60deg)
}



.team li:hover .mask-after,

.team li:hover .mask-before {

    left: 0;

    top: 0;

    opacity: .4;

    filter: alpha(opacity=40);

    height: 100%;

    -moz-transform: translateX(0) translateY(0) rotate(0) skew(0);

    -ms-transform: translateX(0) translateY(0) rotate(0) skew(0);

    -webkit-transform: translateX(0) translateY(0) rotate(0) skew(0);

    transform: translateX(0) translateY(0) rotate(0) skew(0)
}



.team li:hover .f-name {

    opacity: 1;

    filter: alpha(opacity=100);

    -moz-animation: fromTop 1s ease;

    -webkit-animation: fromTop 1s ease;

    animation: fromTop 1s ease
}



.team li:hover .f-name-bottom {

    display: none
}



.team li:hover .f-summary {

    opacity: 1;

    filter: alpha(opacity=100);

    -moz-animation: fromBottom 1s ease;

    -webkit-animation: fromBottom 1s ease;

    animation: fromBottom 1s ease
}



.team .move-tips {

    text-align: center;

    padding-top: 570px
}



.team .move-tips img {

    -moz-animation: fadeInOut 2s ease-in-out infinite;

    -webkit-animation: fadeInOut 2s ease-in-out infinite;

    animation: fadeInOut 2s ease-in-out infinite
}



.partner {

    height: 770px;

    background: url(../images/m7.jpg) top center no-repeat
}



.partner .partner-title {

    width: 712px;

    height: 44px;

    padding: 100px 0;

    margin: 0 auto;

    background: url(../images/line.png) center no-repeat;

    display: none;

    -moz-animation: rotate 1.5s ease;

    -webkit-animation: rotate 1.5s ease;

    animation: rotate 1.5s ease
}



.partner .partner-title span {

    display: block;

    width: 377px;

    height: 44px;

    margin: 0 auto;

    text-align: center;

    font-size: 36px;

    color: #fff;

    line-height: 44px;

    /* background: url(../images/text.png-v=1.png) 0 -409px no-repeat;

    text-indent: -9999em;*/

    overflow: hidden
}



.partner-list {
    padding-left: 115px;
}



.partner li {

    float: left;

    width: 144px;

    height: 144px;

    margin: 0 64px 25px 0;

    line-height: 144px;

    text-align: center;

    border: 1px solid #dbe5f0;

    border-radius: 50%;

    display: none;

    -moz-animation: partnerRotate 2s ease;

    -webkit-animation: partnerRotate 2s ease;

    animation: partnerRotate 2s ease
}



.partner a,

.partner li span {

    height: 100%;

    border-radius: 50%
}



.partner li span {

    width: 100%;

    background: #fff;

    left: 0;

    top: 0;

    opacity: 0;

    -moz-transition: all .5s ease;

    -o-transition: all .5s ease;

    -webkit-transition: all .5s ease;

    transition: all .5s ease;

    -moz-transform: scale(0);

    -ms-transform: scale(0);

    -webkit-transform: scale(0);

    transform: scale(0)
}



.partner a {

    display: block;

    position: relative;

    cursor: default
}



.partner i {

    position: absolute;

    width: 153px;

    height: 153px;

    background: url(../images/dot.png) right center no-repeat;

    left: -4px;

    top: -4px;

    -moz-transition: all 1s ease;

    -o-transition: all 1s ease;

    -webkit-transition: all 1s ease;

    transition: all 1s ease
}



.partner li:nth-child(1) a:hover i {

    -moz-transform: rotate(-360deg);

    -ms-transform: rotate(-360deg);

    -webkit-transform: rotate(-360deg);

    transform: rotate(-360deg)
}



.partner li:nth-child(2) i {

    -moz-transform: rotate(-30deg);

    -ms-transform: rotate(-30deg);

    -webkit-transform: rotate(-30deg);

    transform: rotate(-30deg)
}



.partner li:nth-child(2) a:hover i {

    -moz-transform: rotate(-390deg);

    -ms-transform: rotate(-390deg);

    -webkit-transform: rotate(-390deg);

    transform: rotate(-390deg)
}



.partner li:nth-child(3) i {

    -moz-transform: rotate(-60deg);

    -ms-transform: rotate(-60deg);

    -webkit-transform: rotate(-60deg);

    transform: rotate(-60deg)
}



.partner li:nth-child(3) a:hover i {

    -moz-transform: rotate(-420deg);

    -ms-transform: rotate(-420deg);

    -webkit-transform: rotate(-420deg);

    transform: rotate(-420deg)
}



.partner li:nth-child(4) i {

    -moz-transform: rotate(-90deg);

    -ms-transform: rotate(-90deg);

    -webkit-transform: rotate(-90deg);

    transform: rotate(-90deg)
}



.partner li:nth-child(4) a:hover i {

    -moz-transform: rotate(-450deg);

    -ms-transform: rotate(-450deg);

    -webkit-transform: rotate(-450deg);

    transform: rotate(-450deg)
}



.partner li:nth-child(5) i {

    -moz-transform: rotate(-120deg);

    -ms-transform: rotate(-120deg);

    -webkit-transform: rotate(-120deg);

    transform: rotate(-120deg)
}



.partner li:nth-child(5) a:hover i {

    -moz-transform: rotate(-480deg);

    -ms-transform: rotate(-480deg);

    -webkit-transform: rotate(-480deg);

    transform: rotate(-480deg)
}



.partner li:nth-child(6) i {

    -moz-transform: rotate(-150deg);

    -ms-transform: rotate(-150deg);

    -webkit-transform: rotate(-150deg);

    transform: rotate(-150deg)
}



.partner li:nth-child(6) a:hover i {

    -moz-transform: rotate(-510deg);

    -ms-transform: rotate(-510deg);

    -webkit-transform: rotate(-510deg);

    transform: rotate(-510deg)
}



.partner li:nth-child(7) i {

    -moz-transform: rotate(-180deg);

    -ms-transform: rotate(-180deg);

    -webkit-transform: rotate(-180deg);

    transform: rotate(-180deg)
}



.partner li:nth-child(7) a:hover i {

    -moz-transform: rotate(-540deg);

    -ms-transform: rotate(-540deg);

    -webkit-transform: rotate(-540deg);

    transform: rotate(-540deg)
}



.partner li:nth-child(8) i {

    -moz-transform: rotate(-210deg);

    -ms-transform: rotate(-210deg);

    -webkit-transform: rotate(-210deg);

    transform: rotate(-210deg)
}



.partner li:nth-child(8) a:hover i {

    -moz-transform: rotate(-570deg);

    -ms-transform: rotate(-570deg);

    -webkit-transform: rotate(-570deg);

    transform: rotate(-570deg)
}



.partner li:nth-child(9) i {

    -moz-transform: rotate(-240deg);

    -ms-transform: rotate(-240deg);

    -webkit-transform: rotate(-240deg);

    transform: rotate(-240deg)
}



.partner li:nth-child(9) a:hover i {

    -moz-transform: rotate(-600deg);

    -ms-transform: rotate(-600deg);

    -webkit-transform: rotate(-600deg);

    transform: rotate(-600deg)
}



.partner li:nth-child(10) i {

    -moz-transform: rotate(-270deg);

    -ms-transform: rotate(-270deg);

    -webkit-transform: rotate(-270deg);

    transform: rotate(-270deg)
}



.partner li:nth-child(10) a:hover i {

    -moz-transform: rotate(-630deg);

    -ms-transform: rotate(-630deg);

    -webkit-transform: rotate(-630deg);

    transform: rotate(-630deg)
}



.partner li:nth-child(11) i {

    -moz-transform: rotate(-300deg);

    -ms-transform: rotate(-300deg);

    -webkit-transform: rotate(-300deg);

    transform: rotate(-300deg)
}



.partner li:nth-child(11) a:hover i {

    -moz-transform: rotate(-690deg);

    -ms-transform: rotate(-690deg);

    -webkit-transform: rotate(-690deg);

    transform: rotate(-690deg)
}



.partner li:nth-child(12) i {

    -moz-transform: rotate(-360deg);

    -ms-transform: rotate(-360deg);

    -webkit-transform: rotate(-360deg);

    transform: rotate(-360deg)
}



.partner li:nth-child(12) a:hover i {

    -moz-transform: rotate(-720deg);

    -ms-transform: rotate(-720deg);

    -webkit-transform: rotate(-720deg);

    transform: rotate(-720deg)
}



.partner img {

    position: relative;

    z-index: 2
}



.partner a:hover span {

    opacity: .7;

    -moz-transform: scale(1);

    -ms-transform: scale(1);

    -webkit-transform: scale(1);

    transform: scale(1)
}



.footer {

    padding: 40px 0;

    background: #19242a;

}



.footer p {

    text-align: center
}



.footer .yellow {

    color: #ffa200
}



.footer a:hover {

    text-decoration: underline
}



.up {

    position: fixed;

    width: 94px;

    height: 176px;

    right: 20px;

    bottom: 20px;

    background: url(../images/up2.png) no-repeat;

    z-index: 12;

    display: none
}



.flying {

    background-image: url(../images/up2.png)
}



@-moz-keyframes scaleFadeOut {

    from {

        opacity: 1
    }

    to {

        opacity: 0;

        -moz-transform: scale(1.2, 1.2);

        transform: scale(1.2, 1.2)
    }

}



@-webkit-keyframes scaleFadeOut {

    from {

        opacity: 1
    }

    to {

        opacity: 0;

        -webkit-transform: scale(1.2, 1.2);

        transform: scale(1.2, 1.2)
    }

}



@keyframes scaleFadeOut {

    from {

        opacity: 1
    }

    to {

        opacity: 0;

        -moz-transform: scale(1.2, 1.2);

        -ms-transform: scale(1.2, 1.2);

        -webkit-transform: scale(1.2, 1.2);

        transform: scale(1.2, 1.2)
    }

}



@-moz-keyframes winterFadeIn {

    from {

        opacity: 0
    }

    to {

        opacity: .8
    }

}



@-webkit-keyframes winterFadeIn {

    from {

        opacity: 0
    }

    to {

        opacity: .8
    }

}



@keyframes winterFadeIn {

    from {

        opacity: 0
    }

    to {

        opacity: .8
    }

}



@-moz-keyframes rocketFire {

    0%,

    100% {

        opacity: 0
    }

    50% {

        opacity: 1
    }

}



@-webkit-keyframes rocketFire {

    0%,

    100% {

        opacity: 0
    }

    50% {

        opacity: 1
    }

}



@keyframes rocketFire {

    0%,

    100% {

        opacity: 0
    }

    50% {

        opacity: 1
    }

}



@-moz-keyframes flyUp {

    0% {

        top: 100%;

        -moz-transform: perspective(500px) rotateZ(30deg);

        transform: perspective(500px) rotateZ(30deg)
    }

    70% {

        -moz-transform: perspective(500px) translateX(1500px) translateY(-800px) translateZ(-250px) scale(.95) rotateZ(-100deg);

        transform: perspective(500px) translateX(1500px) translateY(-800px) translateZ(-250px) scale(.95) rotateZ(-100deg)
    }

    80% {

        opacity: 1
    }

    100% {

        opacity: 0;

        -moz-transform: perspective(500px) translateX(500px) translateY(-1800px) translateZ(-650px) scale(.3) rotateZ(-120deg);

        transform: perspective(500px) translateX(500px) translateY(-1800px) translateZ(-650px) scale(.3) rotateZ(-120deg)
    }

}



@-webkit-keyframes flyUp {

    0% {

        top: 100%;

        -webkit-transform: perspective(500px) rotateZ(30deg);

        transform: perspective(500px) rotateZ(30deg)
    }

    70% {

        -webkit-transform: perspective(500px) translateX(1500px) translateY(-800px) translateZ(-250px) scale(.95) rotateZ(-100deg);

        transform: perspective(500px) translateX(1500px) translateY(-800px) translateZ(-250px) scale(.95) rotateZ(-100deg)
    }

    80% {

        opacity: 1
    }

    100% {

        opacity: 0;

        -webkit-transform: perspective(500px) translateX(500px) translateY(-1800px) translateZ(-650px) scale(.3) rotateZ(-120deg);

        transform: perspective(500px) translateX(500px) translateY(-1800px) translateZ(-650px) scale(.3) rotateZ(-120deg)
    }

}



@keyframes flyUp {

    0% {

        top: 100%;

        -moz-transform: perspective(500px) rotateZ(30deg);

        -ms-transform: perspective(500px) rotateZ(30deg);

        -webkit-transform: perspective(500px) rotateZ(30deg);

        transform: perspective(500px) rotateZ(30deg)
    }

    70% {

        -moz-transform: perspective(500px) translateX(1500px) translateY(-800px) translateZ(-250px) scale(.95) rotateZ(-100deg);

        -ms-transform: perspective(500px) translateX(1500px) translateY(-800px) translateZ(-250px) scale(.95) rotateZ(-100deg);

        -webkit-transform: perspective(500px) translateX(1500px) translateY(-800px) translateZ(-250px) scale(.95) rotateZ(-100deg);

        transform: perspective(500px) translateX(1500px) translateY(-800px) translateZ(-250px) scale(.95) rotateZ(-100deg)
    }

    80% {

        opacity: 1
    }

    100% {

        opacity: 0;

        -moz-transform: perspective(500px) translateX(500px) translateY(-1800px) translateZ(-650px) scale(.3) rotateZ(-120deg);

        -ms-transform: perspective(500px) translateX(500px) translateY(-1800px) translateZ(-650px) scale(.3) rotateZ(-120deg);

        -webkit-transform: perspective(500px) translateX(500px) translateY(-1800px) translateZ(-650px) scale(.3) rotateZ(-120deg);

        transform: perspective(500px) translateX(500px) translateY(-1800px) translateZ(-650px) scale(.3) rotateZ(-120deg)
    }

}



@-moz-keyframes titleDrop {

    from {

        opacity: 0;

        -moz-transform: translate(30px, 0);

        transform: translate(30px, 0)
    }

    to {

        opacity: 1;

        -moz-transform: translate(0, 0);

        transform: translate(0, 0)
    }

}



@-webkit-keyframes titleDrop {

    from {

        opacity: 0;

        -webkit-transform: translate(30px, 0);

        transform: translate(30px, 0)
    }

    to {

        opacity: 1;

        -webkit-transform: translate(0, 0);

        transform: translate(0, 0)
    }

}



@keyframes titleDrop {

    from {

        opacity: 0;

        -moz-transform: translate(30px, 0);

        -ms-transform: translate(30px, 0);

        -webkit-transform: translate(30px, 0);

        transform: translate(30px, 0)
    }

    to {

        opacity: 1;

        -moz-transform: translate(0, 0);

        -ms-transform: translate(0, 0);

        -webkit-transform: translate(0, 0);

        transform: translate(0, 0)
    }

}



@-moz-keyframes titleUp {

    from {

        opacity: 0;

        -moz-transform: translate(-30px, 0);

        transform: translate(-30px, 0)
    }

    to {

        opacity: 1;

        -moz-transform: translate(0, 0);

        transform: translate(0, 0)
    }

}



@-webkit-keyframes titleUp {

    from {

        opacity: 0;

        -webkit-transform: translate(-30px, 0);

        transform: translate(-30px, 0)
    }

    to {

        opacity: 1;

        -webkit-transform: translate(0, 0);

        transform: translate(0, 0)
    }

}



@keyframes titleUp {

    from {

        opacity: 0;

        -moz-transform: translate(-30px, 0);

        -ms-transform: translate(-30px, 0);

        -webkit-transform: translate(-30px, 0);

        transform: translate(-30px, 0)
    }

    to {

        opacity: 1;

        -moz-transform: translate(0, 0);

        -ms-transform: translate(0, 0);

        -webkit-transform: translate(0, 0);

        transform: translate(0, 0)
    }

}



@-moz-keyframes rotate {

    from {

        -moz-transform: rotateX(90deg);

        transform: rotateX(90deg);

        opacity: 0
    }

    to {

        -moz-transform: rotateX(0);

        transform: rotateX(0);

        opacity: 1
    }

}



@-webkit-keyframes rotate {

    from {

        -webkit-transform: rotateX(90deg);

        transform: rotateX(90deg);

        opacity: 0
    }

    to {

        -webkit-transform: rotateX(0);

        transform: rotateX(0);

        opacity: 1
    }

}



@keyframes rotate {

    from {

        -moz-transform: rotateX(90deg);

        -webkit-transform: rotateX(90deg);

        transform: rotateX(90deg);

        opacity: 0
    }

    to {

        -moz-transform: rotateX(0);

        -webkit-transform: rotateX(0);

        transform: rotateX(0);

        opacity: 1
    }

}



@-moz-keyframes fadeInOut {

    50% {

        opacity: .5
    }

    100% {

        opacity: 1
    }

}



@-webkit-keyframes fadeInOut {

    50% {

        opacity: .5
    }

    100% {

        opacity: 1
    }

}



@keyframes fadeInOut {

    50% {

        opacity: .5
    }

    100% {

        opacity: 1
    }

}



@-moz-keyframes dropDown {

    from {

        -moz-transform: translate3d(0, -100px, 0);

        transform: translate3d(0, -100px, 0);

        opacity: 0
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-webkit-keyframes dropDown {

    from {

        -webkit-transform: translate3d(0, -100px, 0);

        transform: translate3d(0, -100px, 0);

        opacity: 0
    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@keyframes dropDown {

    from {

        -moz-transform: translate3d(0, -100px, 0);

        -webkit-transform: translate3d(0, -100px, 0);

        transform: translate3d(0, -100px, 0);

        opacity: 0
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-moz-keyframes dropDown2 {

    from {

        -moz-transform: translate3d(0, -100px, 0);

        transform: translate3d(0, -100px, 0);

        opacity: 0
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-webkit-keyframes dropDown2 {

    from {

        -webkit-transform: translate3d(0, -100px, 0);

        transform: translate3d(0, -100px, 0);

        opacity: 0
    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@keyframes dropDown2 {

    from {

        -moz-transform: translate3d(0, -100px, 0);

        -webkit-transform: translate3d(0, -100px, 0);

        transform: translate3d(0, -100px, 0);

        opacity: 0
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-moz-keyframes fromLeft {

    from {

        -moz-transform: translate3d(-100px, 0, 0);

        transform: translate3d(-100px, 0, 0);

        opacity: 0
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-webkit-keyframes fromLeft {

    from {

        -webkit-transform: translate3d(-100px, 0, 0);

        transform: translate3d(-100px, 0, 0);

        opacity: 0
    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@keyframes fromLeft {

    from {

        -moz-transform: translate3d(-100px, 0, 0);

        -webkit-transform: translate3d(-100px, 0, 0);

        transform: translate3d(-100px, 0, 0);

        opacity: 0
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-moz-keyframes fromRight {

    from {

        -moz-transform: translate3d(100px, 0, 0);

        transform: translate3d(100px, 0, 0);

        opacity: 0
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-webkit-keyframes fromRight {

    from {

        -webkit-transform: translate3d(100px, 0, 0);

        transform: translate3d(100px, 0, 0);

        opacity: 0
    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@keyframes fromRight {

    from {

        -moz-transform: translate3d(100px, 0, 0);

        -webkit-transform: translate3d(100px, 0, 0);

        transform: translate3d(100px, 0, 0);

        opacity: 0
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-moz-keyframes fromBottom {

    from {

        -moz-transform: translate3d(0, 100px, 0);

        transform: translate3d(0, 100px, 0);

        opacity: 0
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-webkit-keyframes fromBottom {

    from {

        -webkit-transform: translate3d(0, 100px, 0);

        transform: translate3d(0, 100px, 0);

        opacity: 0
    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@keyframes fromBottom {

    from {

        -moz-transform: translate3d(0, 100px, 0);

        -webkit-transform: translate3d(0, 100px, 0);

        transform: translate3d(0, 100px, 0);

        opacity: 0
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-moz-keyframes fromBottom2 {

    from {

        -moz-transform: translate3d(0, 15px, 0);

        transform: translate3d(0, 15px, 0);

        opacity: 0
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-webkit-keyframes fromBottom2 {

    from {

        -webkit-transform: translate3d(0, 15px, 0);

        transform: translate3d(0, 15px, 0);

        opacity: 0
    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@keyframes fromBottom2 {

    from {

        -moz-transform: translate3d(0, 15px, 0);

        -webkit-transform: translate3d(0, 15px, 0);

        transform: translate3d(0, 15px, 0);

        opacity: 0
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-moz-keyframes iPhoneFromBottom {

    from {

        -moz-transform: translate3d(0, 173px, 0);

        transform: translate3d(0, 173px, 0);

        opacity: .5
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-webkit-keyframes iPhoneFromBottom {

    from {

        -webkit-transform: translate3d(0, 173px, 0);

        transform: translate3d(0, 173px, 0);

        opacity: .5
    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@keyframes iPhoneFromBottom {

    from {

        -moz-transform: translate3d(0, 173px, 0);

        -webkit-transform: translate3d(0, 173px, 0);

        transform: translate3d(0, 173px, 0);

        opacity: .5
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-moz-keyframes iPadFromBottom {

    from {

        -moz-transform: translate3d(0, 200px, 0);

        transform: translate3d(0, 200px, 0);

        opacity: 0
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-webkit-keyframes iPadFromBottom {

    from {

        -webkit-transform: translate3d(0, 200px, 0);

        transform: translate3d(0, 200px, 0);

        opacity: 0
    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@keyframes iPadFromBottom {

    from {

        -moz-transform: translate3d(0, 200px, 0);

        -webkit-transform: translate3d(0, 200px, 0);

        transform: translate3d(0, 200px, 0);

        opacity: 0
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-moz-keyframes fromTop {

    from {

        -moz-transform: translate3d(0, -20px, 0);

        transform: translate3d(0, -20px, 0);

        opacity: 0
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-webkit-keyframes fromTop {

    from {

        -webkit-transform: translate3d(0, -20px, 0);

        transform: translate3d(0, -20px, 0);

        opacity: 0
    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@keyframes fromTop {

    from {

        -moz-transform: translate3d(0, -20px, 0);

        -webkit-transform: translate3d(0, -20px, 0);

        transform: translate3d(0, -20px, 0);

        opacity: 0
    }

    to {

        -moz-transform: translate3d(0, 0, 0);

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        opacity: 1
    }

}



@-moz-keyframes ready {

    50% {

        -moz-transform: translate(0, 80px) scale(.8);

        transform: translate(0, 80px) scale(.8)
    }

    100% {

        -moz-transform: translate(0, 0) scale(1.3);

        transform: translate(0, 0) scale(1.3)
    }

}



@-webkit-keyframes ready {

    50% {

        -webkit-transform: translate(0, 80px) scale(.8);

        transform: translate(0, 80px) scale(.8)
    }

    100% {

        -webkit-transform: translate(0, 0) scale(1.3);

        transform: translate(0, 0) scale(1.3)
    }

}



@keyframes ready {

    50% {

        -moz-transform: translate(0, 80px) scale(.8);

        -ms-transform: translate(0, 80px) scale(.8);

        -webkit-transform: translate(0, 80px) scale(.8);

        transform: translate(0, 80px) scale(.8)
    }

    100% {

        -moz-transform: translate(0, 0) scale(1.3);

        -ms-transform: translate(0, 0) scale(1.3);

        -webkit-transform: translate(0, 0) scale(1.3);

        transform: translate(0, 0) scale(1.3)
    }

}



@-moz-keyframes fadeIn {

    from {

        opacity: 0
    }

    to {

        opacity: 1
    }

}



@-webkit-keyframes fadeIn {

    from {

        opacity: 0
    }

    to {

        opacity: 1
    }

}



@keyframes fadeIn {

    from {

        opacity: 0
    }

    to {

        opacity: 1
    }

}



@-moz-keyframes changeWidth {

    from {

        width: 0
    }

    to {

        width: 718px
    }

}



@-webkit-keyframes changeWidth {

    from {

        width: 0
    }

    to {

        width: 718px
    }

}



@keyframes changeWidth {

    from {

        width: 0
    }

    to {

        width: 718px
    }

}



@-moz-keyframes starShine {

    0%,

    100% {

        -moz-transform: scale(0, 0);

        transform: scale(0, 0);

        opacity: .8
    }

    50% {

        -moz-transform: scale(1, 1);

        transform: scale(1, 1);

        opacity: 1
    }

}



@-webkit-keyframes starShine {

    0%,

    100% {

        -webkit-transform: scale(0, 0);

        transform: scale(0, 0);

        opacity: .8
    }

    50% {

        -webkit-transform: scale(1, 1);

        transform: scale(1, 1);

        opacity: 1
    }

}



@keyframes starShine {

    0%,

    100% {

        -moz-transform: scale(0, 0);

        -ms-transform: scale(0, 0);

        -webkit-transform: scale(0, 0);

        transform: scale(0, 0);

        opacity: .8
    }

    50% {

        -moz-transform: scale(1, 1);

        -ms-transform: scale(1, 1);

        -webkit-transform: scale(1, 1);

        transform: scale(1, 1);

        opacity: 1
    }

}



@-moz-keyframes partnerRotate {

    0% {

        opacity: 0;

        -moz-transform: rotateY(90deg);

        transform: rotateY(90deg)
    }

    100% {

        opacity: 1;

        -moz-transform: rotateY(0);

        transform: rotateY(0)
    }

}



@-webkit-keyframes partnerRotate {

    0% {

        opacity: 0;

        -webkit-transform: rotateY(90deg);

        transform: rotateY(90deg)
    }

    100% {

        opacity: 1;

        -webkit-transform: rotateY(0);

        transform: rotateY(0)
    }

}



@keyframes partnerRotate {

    0% {

        opacity: 0;

        -moz-transform: rotateY(90deg);

        -webkit-transform: rotateY(90deg);

        transform: rotateY(90deg)
    }

    100% {

        opacity: 1;

        -moz-transform: rotateY(0);

        -webkit-transform: rotateY(0);

        transform: rotateY(0)
    }

}



@-moz-keyframes qp-1 {

    75% {

        opacity: 1;

        -moz-transform: translate(-60px, 0);

        transform: translate(-60px, 0)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(-50px, 0);

        transform: translate(-50px, 0);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@-webkit-keyframes qp-1 {

    75% {

        opacity: 1;

        -webkit-transform: translate(-60px, 0);

        transform: translate(-60px, 0)
    }

    95% {

        opacity: 0;

        -webkit-transform: translate(-50px, 0);

        transform: translate(-50px, 0);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@keyframes qp-1 {

    75% {

        opacity: 1;

        -moz-transform: translate(-60px, 0);

        -ms-transform: translate(-60px, 0);

        -webkit-transform: translate(-60px, 0);

        transform: translate(-60px, 0)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(-50px, 0);

        -ms-transform: translate(-50px, 0);

        -webkit-transform: translate(-50px, 0);

        transform: translate(-50px, 0);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@-moz-keyframes qp-2 {

    65% {

        opacity: 1;

        -moz-transform: translate(-80px, 0);

        transform: translate(-80px, 0)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(-60px, 0) scale(.8);

        transform: translate(-60px, 0) scale(.8);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@-webkit-keyframes qp-2 {

    65% {

        opacity: 1;

        -webkit-transform: translate(-80px, 0);

        transform: translate(-80px, 0)
    }

    95% {

        opacity: 0;

        -webkit-transform: translate(-60px, 0) scale(.8);

        transform: translate(-60px, 0) scale(.8);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@keyframes qp-2 {

    65% {

        opacity: 1;

        -moz-transform: translate(-80px, 0);

        -ms-transform: translate(-80px, 0);

        -webkit-transform: translate(-80px, 0);

        transform: translate(-80px, 0)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(-60px, 0) scale(.8);

        -ms-transform: translate(-60px, 0) scale(.8);

        -webkit-transform: translate(-60px, 0) scale(.8);

        transform: translate(-60px, 0) scale(.8);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@-moz-keyframes qp-3 {

    80% {

        opacity: .5;

        -moz-transform: translate(-50px, 0) scale(.3);

        transform: translate(-50px, 0) scale(.3)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(0, 0) scale(.35);

        transform: translate(0, 0) scale(.35);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@-webkit-keyframes qp-3 {

    80% {

        opacity: .5;

        -webkit-transform: translate(-50px, 0) scale(.3);

        transform: translate(-50px, 0) scale(.3)
    }

    95% {

        opacity: 0;

        -webkit-transform: translate(0, 0) scale(.35);

        transform: translate(0, 0) scale(.35);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@keyframes qp-3 {

    80% {

        opacity: .5;

        -moz-transform: translate(-50px, 0) scale(.3);

        -ms-transform: translate(-50px, 0) scale(.3);

        -webkit-transform: translate(-50px, 0) scale(.3);

        transform: translate(-50px, 0) scale(.3)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(0, 0) scale(.35);

        -ms-transform: translate(0, 0) scale(.35);

        -webkit-transform: translate(0, 0) scale(.35);

        transform: translate(0, 0) scale(.35);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@-moz-keyframes qp-4 {

    70% {

        opacity: 1;

        -moz-transform: translate(20px, 0);

        transform: translate(20px, 0)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(-10, 0) scale(.9);

        transform: translate(-10, 0) scale(.9);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@-webkit-keyframes qp-4 {

    70% {

        opacity: 1;

        -webkit-transform: translate(20px, 0);

        transform: translate(20px, 0)
    }

    95% {

        opacity: 0;

        -webkit-transform: translate(-10, 0) scale(.9);

        transform: translate(-10, 0) scale(.9);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@keyframes qp-4 {

    70% {

        opacity: 1;

        -moz-transform: translate(20px, 0);

        -ms-transform: translate(20px, 0);

        -webkit-transform: translate(20px, 0);

        transform: translate(20px, 0)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(-10, 0) scale(.9);

        -ms-transform: translate(-10, 0) scale(.9);

        -webkit-transform: translate(-10, 0) scale(.9);

        transform: translate(-10, 0) scale(.9);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@-moz-keyframes qp-5 {

    85% {

        opacity: 1;

        -moz-transform: translate(30px, 0);

        transform: translate(30px, 0)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(0, 0) scale(.95);

        transform: translate(0, 0) scale(.95);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@-webkit-keyframes qp-5 {

    85% {

        opacity: 1;

        -webkit-transform: translate(30px, 0);

        transform: translate(30px, 0)
    }

    95% {

        opacity: 0;

        -webkit-transform: translate(0, 0) scale(.95);

        transform: translate(0, 0) scale(.95);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@keyframes qp-5 {

    85% {

        opacity: 1;

        -moz-transform: translate(30px, 0);

        -ms-transform: translate(30px, 0);

        -webkit-transform: translate(30px, 0);

        transform: translate(30px, 0)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(0, 0) scale(.95);

        -ms-transform: translate(0, 0) scale(.95);

        -webkit-transform: translate(0, 0) scale(.95);

        transform: translate(0, 0) scale(.95);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@-moz-keyframes qp-6 {

    25% {

        opacity: 1;

        -moz-transform: translate(30px, 0);

        transform: translate(30px, 0)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(0, 0) scale(.3);

        transform: translate(0, 0) scale(.3);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@-webkit-keyframes qp-6 {

    25% {

        opacity: 1;

        -webkit-transform: translate(30px, 0);

        transform: translate(30px, 0)
    }

    95% {

        opacity: 0;

        -webkit-transform: translate(0, 0) scale(.3);

        transform: translate(0, 0) scale(.3);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@keyframes qp-6 {

    25% {

        opacity: 1;

        -moz-transform: translate(30px, 0);

        -ms-transform: translate(30px, 0);

        -webkit-transform: translate(30px, 0);

        transform: translate(30px, 0)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(0, 0) scale(.3);

        -ms-transform: translate(0, 0) scale(.3);

        -webkit-transform: translate(0, 0) scale(.3);

        transform: translate(0, 0) scale(.3);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@-moz-keyframes qp-7 {

    85% {

        opacity: 1;

        -moz-transform: translate(80px, 0) scale(.5);

        transform: translate(80px, 0) scale(.5)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(70px, 0) scale(.4);

        transform: translate(70px, 0) scale(.4);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@-webkit-keyframes qp-7 {

    85% {

        opacity: 1;

        -webkit-transform: translate(80px, 0) scale(.5);

        transform: translate(80px, 0) scale(.5)
    }

    95% {

        opacity: 0;

        -webkit-transform: translate(70px, 0) scale(.4);

        transform: translate(70px, 0) scale(.4);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@keyframes qp-7 {

    85% {

        opacity: 1;

        -moz-transform: translate(80px, 0) scale(.5);

        -ms-transform: translate(80px, 0) scale(.5);

        -webkit-transform: translate(80px, 0) scale(.5);

        transform: translate(80px, 0) scale(.5)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(70px, 0) scale(.4);

        -ms-transform: translate(70px, 0) scale(.4);

        -webkit-transform: translate(70px, 0) scale(.4);

        transform: translate(70px, 0) scale(.4);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@-moz-keyframes qp-8 {

    45% {

        opacity: 1;

        -moz-transform: translate(30px, 0);

        transform: translate(30px, 0)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(-10px, 0) scale(.5);

        transform: translate(-10px, 0) scale(.5);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@-webkit-keyframes qp-8 {

    45% {

        opacity: 1;

        -webkit-transform: translate(30px, 0);

        transform: translate(30px, 0)
    }

    95% {

        opacity: 0;

        -webkit-transform: translate(-10px, 0) scale(.5);

        transform: translate(-10px, 0) scale(.5);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@keyframes qp-8 {

    45% {

        opacity: 1;

        -moz-transform: translate(30px, 0);

        -ms-transform: translate(30px, 0);

        -webkit-transform: translate(30px, 0);

        transform: translate(30px, 0)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(-10px, 0) scale(.5);

        -ms-transform: translate(-10px, 0) scale(.5);

        -webkit-transform: translate(-10px, 0) scale(.5);

        transform: translate(-10px, 0) scale(.5);

        margin-top: -30px
    }

    100% {

        opacity: 0
    }

}



@-moz-keyframes qp-9 {

    25% {

        opacity: .5;

        -moz-transform: translate(45px, 0);

        transform: translate(45px, 0)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(-55px, 0) scale(.6);

        transform: translate(-55px, 0) scale(.6);

        margin-top: -60px
    }

    100% {

        opacity: 0
    }

}



@-webkit-keyframes qp-9 {

    25% {

        opacity: .5;

        -webkit-transform: translate(45px, 0);

        transform: translate(45px, 0)
    }

    95% {

        opacity: 0;

        -webkit-transform: translate(-55px, 0) scale(.6);

        transform: translate(-55px, 0) scale(.6);

        margin-top: -60px
    }

    100% {

        opacity: 0
    }

}



@keyframes qp-9 {

    25% {

        opacity: .5;

        -moz-transform: translate(45px, 0);

        -ms-transform: translate(45px, 0);

        -webkit-transform: translate(45px, 0);

        transform: translate(45px, 0)
    }

    95% {

        opacity: 0;

        -moz-transform: translate(-55px, 0) scale(.6);

        -ms-transform: translate(-55px, 0) scale(.6);

        -webkit-transform: translate(-55px, 0) scale(.6);

        transform: translate(-55px, 0) scale(.6);

        margin-top: -60px
    }

    100% {

        opacity: 0
    }

}





.active .about-title,

.active .platform-title,

.active .development-title,

.active .culture-title,

.active .branch-title,

.active .team-title {

    display: block;

    -moz-animation: fromTop 3s ease;

    -webkit-animation: fromTop 3s ease;

    animation: fromTop 3s ease
}



.active .about-cont,
.active .branch-cont {

    display: block;

    -moz-animation: fromLeft 3.5s ease;

    -webkit-animation: fromLeft 3.5s ease;

    animation: fromLeft 3.5s ease
}



.active .branch-img {

    display: block;

    -moz-animation: fromRight 3.5s ease;

    -webkit-animation: fromRight 3.5s ease;

    animation: fromRight 3.5s ease
}



.active .dev-history {

    display: block;

    -moz-animation: dropDown 3.5s ease;

    -webkit-animation: dropDown 3.5s ease;

    animation: dropDown 3.5s ease
}



.active .culture-li {

    display: block;

    -moz-animation: fromRight 3.5s ease;

    -webkit-animation: fromRight 3.5s ease;

    animation: fromRight 3.5s ease
}



.active .platform-summary {

    display: block;

    -moz-animation: iPhoneFromBottom 3s ease;

    -webkit-animation: iPhoneFromBottom 3s ease;

    animation: iPhoneFromBottom 3s ease
}



.active .team-list {

    display: block;

    -moz-animation: iPhoneFromBottom 3s ease;

    -webkit-animation: iPhoneFromBottom 3s ease;

    animation: iPhoneFromBottom 3s ease
}



.active .iphone {

    display: block;

    -moz-animation: iPhoneFromBottom 1.3s ease;

    -webkit-animation: iPhoneFromBottom 1.3s ease;

    animation: iPhoneFromBottom 1.3s ease
}



.active .ipad {

    display: block;

    -moz-animation: iPadFromBottom 1.5s ease;

    -webkit-animation: iPadFromBottom 1.5s ease;

    animation: iPadFromBottom 1.5s ease
}



.active .col-right,

.active .member {

    display: block;

    -moz-animation: fromRight 1.5s ease;

    -webkit-animation: fromRight 1.5s ease;

    animation: fromRight 1.5s ease
}



.active .map {

    -moz-animation: fadeIn 3s ease;

    -webkit-animation: fadeIn 3s ease;

    animation: fadeIn 3s ease
}



.active .time-line {

    -moz-animation: changeWidth 2.5s ease-in;

    -webkit-animation: changeWidth 2.5s ease-in;

    animation: changeWidth 2.5s ease-in
}



.active .star {

    -moz-animation: starShine 3.5s ease-in-out infinite;

    -webkit-animation: starShine 3.5s ease-in-out infinite;

    animation: starShine 3.5s ease-in-out infinite
}



.active .star-1,

.active .star-3 {

    -moz-animation-duration: 2.5s;

    -webkit-animation-duration: 2.5s;

    animation-duration: 2.5s
}



.active .star-2,

.active .star-4 {

    -moz-animation-duration: 4s;

    -webkit-animation-duration: 4s;

    animation-duration: 4s
}



.active .partner-list li,

.active .partner-title {

    display: block
}



.ie .bsie,

.ie6 .bsie,

.ie7 .bsie,

.ie8 .bsie,

.ie9 .bsie {

    display: block !important
}



.ie .sbie,

.ie6 .sbie,

.ie7 .sbie,

.ie8 .sbie,

.ie9 .sbie {

    display: none !important
}



@-moz-keyframes kvLeave {

    0% {

        -moz-transform: translate(0, 0);

        transform: translate(0, 0)
    }

    100% {

        -moz-transform: translate(0, -315px);

        transform: translate(0, -315px)
    }

}



@-webkit-keyframes kvLeave {

    0% {

        -webkit-transform: translate(0, 0);

        transform: translate(0, 0)
    }

    100% {

        -webkit-transform: translate(0, -315px);

        transform: translate(0, -315px)
    }

}



@keyframes kvLeave {

    0% {

        -moz-transform: translate(0, 0);

        -ms-transform: translate(0, 0);

        -webkit-transform: translate(0, 0);

        transform: translate(0, 0)
    }

    100% {

        -moz-transform: translate(0, -315px);

        -ms-transform: translate(0, -315px);

        -webkit-transform: translate(0, -315px);

        transform: translate(0, -315px)
    }

}



@-moz-keyframes kvCome {

    0% {

        -moz-transform: translate(0, 315px);

        transform: translate(0, 315px)
    }

    100% {

        -moz-transform: translate(0, 0);

        transform: translate(0, 0)
    }

}



@-webkit-keyframes kvCome {

    0% {

        -webkit-transform: translate(0, 315px);

        transform: translate(0, 315px)
    }

    100% {

        -webkit-transform: translate(0, 0);

        transform: translate(0, 0)
    }

}



@keyframes kvCome {

    0% {

        -moz-transform: translate(0, 315px);

        -ms-transform: translate(0, 315px);

        -webkit-transform: translate(0, 315px);

        transform: translate(0, 315px)
    }

    100% {

        -moz-transform: translate(0, 0);

        -ms-transform: translate(0, 0);

        -webkit-transform: translate(0, 0);

        transform: translate(0, 0)
    }

}



.c-page {

    background: url(../images/c-bg.jpg) top center no-repeat #f0f0f0
}



.c-page .top-nav {

    display: block;

    position: relative;

    min-width: 1000px;

    height: 80px;

    line-height: 80px
}



.c-page .logo {

    margin: 6px 0 0
}



.c-page .kv {

    width: 950px;

    height: 315px;

    margin: 80px auto 0;

    background: #d8d8d8;

    position: relative;

    overflow: hidden
}



.c-page .kv-list,

.c-page .kv-list img,

.c-page .kv-list li {

    width: 690px;

    height: 315px
}



.c-page .kv-list {

    overflow: hidden;

    background: #4083c1
}



.c-page .kv-list li {

    position: absolute;

    left: 0;

    top: 0;

    z-index: 1;

    visibility: hidden;

    overflow: hidden;

    -moz-transition: width .8s ease;

    -o-transition: width .8s ease;

    -webkit-transition: width .8s ease;

    transition: width .8s ease
}



.c-page .kv-list .current {

    z-index: 3;

    -moz-animation: kvCome .8s ease;

    -webkit-animation: kvCome .8s ease;

    animation: kvCome .8s ease;

    visibility: visible
}



.c-page .kv-list .leave {

    z-index: 2;

    -moz-animation: kvLeave .8s ease;

    -webkit-animation: kvLeave .8s ease;

    animation: kvLeave .8s ease;

    visibility: visible
}



.c-page .kv-label,

.c-page .kv-tab {

    position: absolute;

    width: 260px;

    right: 0
}



.c-page .kv-tab {

    height: 315px;

    top: 0;

    z-index: 2
}



.c-page .kv-tab li {

    height: 63px;

    padding-left: 30px;

    cursor: default;

    color: #616f7b;

    border-right-width: 5px;

    border-right-style: solid;

    -moz-transition: color .3s ease;

    -o-transition: color .3s ease;

    -webkit-transition: color .3s ease;

    transition: color .3s ease;

    line-height: 1.5
}



.c-page .kv-tab .sup-title {

    font-size: 16px;

    padding-top: 8px
}



.c-page .kv-tab .sub-title {

    font-size: 14px
}



.c-page .kv-tab li:nth-child(1) {

    border-color: #2ba9cd
}



.c-page .kv-tab li:nth-child(2) {

    border-color: #81c433
}



.c-page .kv-tab li:nth-child(3) {

    border-color: #f3a01d
}



.c-page .kv-tab li:nth-child(4) {

    border-color: #c65151
}



.c-page .kv-tab li:nth-child(5) {

    border-color: #6d58a3
}



.c-page .kv-tab .current {

    color: #fff
}



.c-page .kv-label {

    height: 63px;

    z-index: 1;

    top: 315px;

    -moz-transition: all .3s ease;

    -o-transition: all .3s ease;

    -webkit-transition: all .3s ease;

    transition: all .3s ease
}



.c-page .kv-0 .kv-label {

    background: #2ba9cd;

    top: 0
}



.c-page .kv-1 .kv-label {

    background: #81c433;

    top: 63px
}



.c-page .kv-2 .kv-label {

    background: #f3a01d;

    top: 126px
}



.c-page .kv-3 .kv-label {

    background: #c65151;

    top: 189px
}



.c-page .kv-4 .kv-label {

    background: #6d58a3;

    top: 252px
}



.c-wrap {

    width: 1150px;

    margin: 0 auto
}



.c-header {

    height: 441px;

    position: relative
}



.c-header .page-top {

    color: #fff;

    width: 640px;

    margin: 40px auto 0
}



.c-header .page-title {

    padding-top: 90px;

    // padding: 45px 0 15px;

    // margin-bottom: 9px;

    // color: #296cb3;

    // font-size: 24px;

    text-align: center;

    // border-bottom: 1px solid #296cb3;

    // letter-spacing: 2px

}



.c-header .corner-left,

.c-header .corner-right {

    position: absolute;

    width: 12px;

    height: 34px;

    bottom: 1px
}



.c-header .corner-left {

    background: url(../images/corner-left.png);

    left: 13px
}



.c-header .corner-right {

    background: url(../images/corner-right.png);

    right: 13px
}



.c-content {

    padding-top: 20px;

    position: relative;

    -moz-animation: fromBottom 1s ease;

    -webkit-animation: fromBottom 1s ease;

    animation: fromBottom 1s ease
}



.c-content .page-sub-title {

    font-size: 38px;

    color: #4184bd;

    border-bottom: 1px solid #afafaf
}



// .page-products .page-title {

//     background: url(../images/title-products.png) top center no-repeat

// }



// .pro-title {

//     background: url(../images/title-products.png) top center no-repeat

// }



.page-products .products-more {

    position: absolute;

    width: 18px;

    height: 18px;

    right: 0;

    top: 55px;

    background: url(../images/more-btn.png) no-repeat
}



.page-products .m-products-more {

    top: 1007px
}



.page-news .c-header {

    height: 475px
}



.page-news .c-content {

    padding-left: 22px;

    padding-right: 22px;

    /*height: 750px*/

}



.page-news .news-tab {

    height: 34px;

    border-bottom: 1px solid #ffa200;

    position: relative
}



.page-news .news-tab li {

    float: left;

    width: 85px;

    height: 14px;

    text-align: center;

    font-size: 18px;

    cursor: default;

    line-height: 14px;

    border-right: 1px solid #7f7f7f;

    margin-top: 10px;

    -moz-transition: color .5s ease;

    -o-transition: color .5s ease;

    -webkit-transition: color .5s ease;

    transition: color .5s ease
}



.page-news .news-tab .current {

    color: #ffa200
}



.page-news .news-tab li:nth-child(4) {

    border-right: none
}



.page-news .news-tab .news-label {

    position: absolute;

    width: 0;

    height: 0;

    border: 6px solid transparent;

    border-bottom-color: #ffa200;

    top: 22px;

    left: -10px;

    -moz-transition: all .5s ease;

    -o-transition: all .5s ease;

    -webkit-transition: all .5s ease;

    transition: all .5s ease
}



.page-news .news-list {

    margin-top: 30px;

    /*height: 540px;*/

    overflow: hidden
}



.page-news .news-list ul {

    display: none;

    margin-right: 20px
}



.page-news .news-0 .news-list-2015,

.page-news .news-1 .news-list-2014,

.page-news .news-2 .news-list-2013,

.page-news .news-3 .news-list-2012,

.page-news .news-4 .news-list-2011,

.page-news .news-list a {

    /*display: block*/

}



.page-news .news-list .current {

    display: block;

    -moz-animation: fromBottom2 .5s ease;

    -webkit-animation: fromBottom2 .5s ease;

    animation: fromBottom2 .5s ease
}



.page-news .news-list li {

    height: 170px;

    margin-bottom: 30px;

    overflow: hidden;

    /*height: 45px;*/

    /*line-height: 45px;*/

    /*background: url(../images/news-list-style.png) left center no-repeat;*/

    /*padding-left: 25px*/

}



.page-news .news-list a:hover .news-top {

    /*color: #3e7fbf*/

    color: #f00;

}



.page-news .news-date {

    float: left;

    width: 110px;

    text-align: center;

    font-size: 16px;

    color: #000;

    padding-top: 50px;

}



.page-news .news-date span {

    display: block;

    font-size: 32px;

}



.page-news .news-img {

    float: left;

    width: 230px;

}



.page-news .news-txt {

    float: right;

    width: 560px;

}



.page-news .news-txt .news-top {

    font-size: 16px;

    color: #000;

    margin-bottom: 10px;

}

.page-news .news-txt .news-mid {

    font-size: 14px;

    color: #000;

    height: 100px;

    overflow: hidden;

    text-overflow: ellipsis;

    margin-bottom: 10px;

}

.page-news .news-txt .news-mid img {

    width: 230px;

    height: 170px;

}

.page-news .news-txt .news-btm {

    font-size: 12px;

}

.page-news .news-txt .news-btm span {

    color: #4184bd;

}



.page-news .news-0 .news-label {

    left: 37px
}



.page-news .news-1 .news-label {

    left: 122px
}



.page-news .news-2 .news-label {

    left: 208px
}



.page-news .news-3 .news-label {

    left: 293px
}



.page-news .news-4 .news-label {

    left: 379px
}



.page-article .c-header {

    height: 475px
}



.page-article .c-content {

    padding-left: 22px;

    padding-right: 22px;

    padding-bottom: 50px;

    min-height: 750px
}



.page-article .back-to-news {

    position: absolute;

    right: 20px;

    top: 50px;

    color: #afafaf
}



.page-article .back-to-news:hover {

    color: #387bc2
}



.page-article .article {

    padding-top: 30px
}



.page-article .article-t {

    text-align: center;

    margin-bottom: 20px
}



.page-article .article-t h1 {

    height: 40px;

    line-height: 40px;

    font-size: 24px;

    color: #4184bd;

    margin-bottom: 10px
}



.page-article .article-t span {

    margin: 0 10px
}



.page-article .article-c {

    font-size: 14px;

    line-height: 2
}



.products-list {

    padding-top: 20px;

    overflow: hidden
}



.products-list li {

    float: left;

    width: 465px;

    height: 415px;

    overflow: hidden;

    margin-bottom: 45px;

    position: relative;

    background: #fffdfe;

    box-shadow: 10px 10px 15px #ebebeb;

}



.products-list li p {

    margin: 0 0 0 20px;

    font: 14px "Microsoft YaHei";

    color: #9f9f9f;

}



.products-list li:nth-child(even) {

    margin-left: 69px
}



.products-list h3 {

    color: #383838;

    font: 700 20px/32px "Microsoft YaHei";

    margin: 18px 0 0 20px;

    height: 32px;

    overflow: hidden;

}



.products-list .link-1 a,
.products-list .link-1 img {

    display: block;

    width: 465px;

    height: 265px;

}



.products-list .link-1:hover {}



.products-list .link-2 {

    position: absolute;

    bottom: 20px;

    right: 20px;

    display: block;

    width: 88px;

    height: 30px;

    font: 12px/30px "Micosoft YaHei";

    text-align: center;

    color: #9f9f9f;

    background: url(../images/link-2.png) no-repeat 0 0;

    background-position: 0 -30px;

}



.products-list .link-2:hover {

    color: #fff;

    background-position: 0 0;

    -webkit-transition: all .2s ease-out;

    -moz-transition: all .2s ease-out;

    -ms-transition: all .2s ease-out;

    -o-transition: all .2s ease-out;

    transition: all .2s ease-out;



    -webkit-animation: ani-gw-link .3s linear .2s 1 normal 300ms 0 ease;

    -moz-animation: ani-gw-link .3s linear .2s 1 normal 300ms 0 ease;

    -ms-animation: ani-gw-link .3s linear .2s 1 normal 300ms 0 ease;

    -o-animation: ani-gw-link .3s linear .2s 1 normal 300ms 0 ease;

    animation: ani-gw-link .3s linear .2s 1 normal 300ms 0 ease;



    -moz-animation: ani-gw-link .3s linear .2s 1 normal;

    -webkit-animation: ani-gw-link .3s linear .2s 1 normal;

    -o-animation: ani-gw-link .3s linear .2s 1 normal;

    -ms-animation: ani-gw-link .3s linear .2s 1 normal;

    animation: ani-gw-link .3s linear .2s 1 normal;

}



@keyframes ani-gw-link {

    0% {

        transform: translate(0, 0);

    }

    50% {

        transform: translate(0, 3px);

    }



    100% {

        transform: translate(0, 0);

    }

}



.business-list {

    padding-top: 110px;

    overflow: hidden
}



.business-list li {

    float: left;

    width: 200px;

    height: 125px;

    padding: 0 65px;

    margin-bottom: 80px;

    overflow: hidden
}



.business-list li:nth-child(2),

.business-list li:nth-child(5) {

    border-left: 1px solid #d9d9d9;

    border-right: 1px solid #d9d9d9
}



.business-list .name,

.business-list h3 {

    font-size: 20px;

    color: #387bc2;

    border-bottom: 1px dotted #b2b2b2;

    height: 34px
}



.business-list .name {

    border-bottom: none
}



.business-list .email,

.business-list .qq {

    padding-left: 20px;

    background: url(../images/com-icon.png) 0 7px no-repeat
}



.business-list .qq {

    background-position: 0 -22px
}



.clearfix:after {

    content: '\0020';

    display: block;

    height: 0;

    clear: both;

    visibility: hidden;

}

.clearfix {
    *zoom: 1;
}



.position-title {

    font-size: 38px;

    color: #4184bd;

    border-bottom: 1px solid #afafaf;

}

.position-list {

    padding: 20px 0 40px;

}

.position-head {

    background: #e4e4e4;

    border-top: 1px solid #cecece;

    border-bottom: 1px solid #cecece;

}

.position-tip {



    cursor: pointer;

    border-bottom: 1px solid #cecece;

}

.position-head li,
.position-tip li {

    float: left;

    width: 155px;

    line-height: 40px;

    padding-left: 20px;

    text-align: center;

}

li.position-one {

    width: 280px;

    text-align: left;

}

li.position-five {

    text-align: left;

}

.position-icon {

    position: relative;

}

.position-icon:after {

    content: '';

    display: block;

    width: 0;

    height: 0;

    border-left: 10px solid transparent;

    border-right: 10px solid transparent;

    border-top: 10px solid #4184bd;

    position: absolute;

    top: 15px;

    right: 25px;

    cursor: pointer;

}

.position-tab {

    background: #fcfcfc;

}

.position-tab:hover {

    background: #f2fbff;

}

.position-detail {

    display: none;

    padding: 20px;

    background: #f2fbff;

    border-bottom: 1px solid #cecece;

}

.positon-des,
.positon-req {

    text-indent: 2rem;

}

.position-note {

    text-indent: 2rem;

    color: #009900;

    padding-top: 10px;

}



/*分页*/

.page-code {

    text-align: center;

}

.pagination {

    display: inline-block;

    padding-left: 0;

    margin: 20px 0;

    border-radius: 4px;

}

.pagination>li {

    display: inline;

}

.pagination>li>a,

.pagination>li>span {

    position: relative;

    float: left;

    padding: 6px 12px;

    margin-left: -1px;

    line-height: 1.42857143;

    color: #337ab7;

    text-decoration: none;

    background-color: #fff;

    border: 1px solid #ddd;

}

.pagination>li:first-child>a,

.pagination>li:first-child>span {

    margin-left: 0;

    border-top-left-radius: 4px;

    border-bottom-left-radius: 4px;

}

.pagination>li:last-child>a,

.pagination>li:last-child>span {

    border-top-right-radius: 4px;

    border-bottom-right-radius: 4px;

}

.pagination>li>a:hover,

.pagination>li>span:hover,

.pagination>li>a:focus,

.pagination>li>span:focus {

    z-index: 3;

    color: #23527c;

    background-color: #eee;

    border-color: #ddd;

}

.pagination>.active>a,

.pagination>.active>span,

.pagination>.active>a:hover,

.pagination>.active>span:hover,

.pagination>.active>a:focus,

.pagination>.active>span:focus {

    z-index: 2;

    color: #fff;

    cursor: default;

    background-color: #337ab7;

    border-color: #337ab7;

}

.pagination>.disabled>span,

.pagination>.disabled>span:hover,

.pagination>.disabled>span:focus,

.pagination>.disabled>a,

.pagination>.disabled>a:hover,

.pagination>.disabled>a:focus {

    color: #777;

    cursor: not-allowed;

    background-color: #fff;

    border-color: #ddd;

}



.business-cont {

    width: 888px;

    height: 415px;

    margin: 20px auto;

    border: 1px solid #fff;

}



.business-cont .bus-gl {

    float: left;

    width: 50%;

    height: 100%;

    background-color: #e0f4ff;

    text-align: center;

}

.business-cont .bus-gw {

    float: right;

    width: 50%;

    height: 100%;

    background-color: #fff;

    text-align: center;

}



.business-cont .name {

    display: inline-block;

    font-size: 36px;

    color: #1c85cf;

    font-weight: bold;

    padding: 30px 0 10px;

    border-bottom: 2px solid #1c85cf;

    margin-bottom: 20px;

}



.business-cont .qq {

    display: inline-block;

    padding-left: 40px;

    font-size: 20px;

    background: url(../images/bus-qq.png) no-repeat left center;

}



.business-cont .email {

    display: inline-block;

    padding-left: 40px;

    font-size: 20px;

    background: url(../images/bus-email.png) no-repeat left center;

}



.map {

    padding: 40px 0;

}

.map .map-tip {

    text-align: center;

}

.map .map-tip span {

    display: inline-block;

    font-size: 36px;

    color: #1c85cf;

    font-weight: bold;

    padding: 5px 0;

    border-bottom: 2px solid #1c85cf;

    margin-bottom: 10px;

}

.map .map-tip em {

    display: inline-block;

    padding-left: 40px;

    font-size: 20px;

    font-style: normal;

    color: #555;

    line-height: 2;

    background: url(../images/bus-add.png) no-repeat left center;

}

.map .map-img {

    width: 710px;

    margin: 20px auto;

}

/*
华为云
 */

/*腾讯云*/

/*.mqcloud{width:100%; overflow:hidden;height:498px;background:#000D27 url(../images/mqcloud-bg.jpg) top center no-repeat;padding:20px 0 0 0;}*/

/*.mqcloud-c{width:1240px; overflow:hidden;margin:0 auto;background:;}*/

/*.mqcloud-title{width:1240px;margin:0 auto;overflow:hidden;text-align:center;font-size:18px;line-height:25px;margin-bottom:30px;color:#999;}*/

/*.mqcloud-title h3{font-size:30px;font-weight:normal;line-height:60px;color:#fff;}*/

/*.mqcloud-c>ul{width:100%; overflow:hidden;background:;}*/

/*.mqcloud-c>ul>li{width:293px;height:164px; background:url(../images/ico-cur.png);float:left;margin-right:22px;border-radius:5px;margin-bottom:22px;cursor:pointer;margin-top:0;transition:margin 0.3s,background 0.3s;}*/

/*.mqcloud-c>ul>li:nth-child(4n){margin-right:0px;}*/

/*.mqcloud-c>ul>li:nth-child(5){clear:left;}*/

/*.mqcloud-c>ul>li:hover{background:url(../images/ico-cur1.png);margin-top:-5px;}*/

/*.mqcloud-c>ul>li>p{float:left;width:120px;text-align:center; overflow:hidden;color:#ccc;font-size:16px;line-height:65px;background:;border-right:1px solid #313C51;margin:8px 0 0 0;}*/

/*.mqcloud-c>ul>li>p>img{ display:block;margin:0 auto;margin-top:8px;}*/

/*.mqcloud-c>ul>li>ul{float:right;width:145px;margin:15px 0 0 0;}*/

/*.mqcloud-c>ul>li>ul>li>a{display:inline-block;font-size:14px;line-height:32px;color:#ccc;}*/

/*.mqcloud-c>ul>li>ul>li>a:hover{color:#2A71B9;}*/

/*.mqcloud-c>ul>li:hover>p{color:#fff;border-right:1px solid #313C51;}*/

/*.mqcloud-c>ul>li:hover>ul>li>a{color:#fff;}*/

/*.mqcloud-c>ul>li:hover>ul>li>a:hover{color:#2A71B9;}*/



/*全球*/

.quanqiu {
    width: 100%;
    overflow: hidden;
    padding: 20px 0 0 0;
}

.quanqiu-title {
    width: 1240px;
    margin: 0 auto;
    overflow: hidden;
    text-align: center;
    font-size: 18px;
    line-height: 25px;
    margin-bottom: 30px;
}

.quanqiu-title h3 {
    font-size: 30px;
    font-weight: normal;
    line-height: 60px;
    color: #373737;
}

.quanqiu-title a {
    font-size: 18px;
    line-height: 25px;
    color: #3CAAFF;
}

.quanqiu-c {
    width: 1240px;
    overflow: hidden;
    margin: 0 auto;
    padding: 30px 0;
}

.quanqiu-c ul {
    float: left;
    width: 320px;
    padding-top: 113px;
    overflow: hidden;
}

.quanqiu-c ul li {
    text-align: center;
    height: 130px;
}

.quanqiu-c ul li h3 {
    font-size: 60px;
    width: 151px;
    border-bottom: 1px solid #666;
    display: inline-block;
}

.quanqiu-c ul li span {
    text-align: center;
    font-size: 16px;
    display: block;
    line-height: 40px;
}

.quanqiu-c img {
    float: right;
}

.quanqiu-c1 {
    width: 1000px;
    margin: 0 auto;
    text-align: center;
    margin-top: 50px;
    margin-bottom: 50px;
}

.quanqiu-c1 img {
    padding: 50px;
    box-shadow: 0 1px 10px 5px #f3f3f3;
    border-radius: 2px;
}



/* 公共样式 */

/* 居中 */

.warp {

    width: 1200px;

    margin: 0 auto;

}



/* 公共标题 */

.about_title {

    margin-top: 56px;

    margin-bottom: 40px;

    text-align: center;

    font-family: "微软雅黑";

}



.about_title h3 {

    font-size: 24px;

    color: #333;

    margin-bottom: 10px;

}



.about_title span {

    display: block;

    width: 30px;

    margin: 0 auto;

    height: 3px;

    background: #2e7fe1;

}







/* 招贤纳士 */

.recruit {

    /*    margin-bottom: 100px;*/

}



.recruit .fleft {

    float: left;

}



.recruit_cont {

    padding: 20px 0;

    border: 1px solid #e5e5e5;

    color: #666;

    box-shadow: 0px 6px 8px #efeeee;

    margin-bottom: 12px;

}



.recruit_cont .left {

    height: 82px;

    line-height: 86px;

    text-align: center;

    font-size: 14px;

    width: 196px;

}



.recruit_cont .right {

    border-left: 1px solid #c9c9c9;

    padding: 10px 0;

    padding-left: 32px;

    width: 968px;

}



.recruit_cont .right .right_01 {

    width: 234px;

}



.recruit_cont .right .right_02 {

    width: 190px;

}



.recruit_cont .right .right_03 {

    width: 270px;

}



.recruit_cont .right .right_04 {

    width: 260px;

}



.recruit_cont .right p {

    font-size: 14px;

}



.recruit_cont .right a {

    display: block;

    font-size: 14px;

    width: 116px;

    height: 34px;

    text-align: center;

    margin: 0 auto;

    margin-top: 10px;

    line-height: 34px;

    background: #dcdcdc;

    color: #555;

}



.recruit_cont .right .right_04 a {

    float: left;

    margin-left: 6px;

}



.recruit_cont .right a.active {

    background: #e30a19;

    color: #fff;

}



.recruit_cont .right .detailed {

    display: none;

}



.recruit_cont .right .detailed p {

    line-height: 24px;

    color: #666;

}