body { overflow: hidden; }
.top { height: 44px; background-color: #000; position: fixed; left: 0; top: 0; z-index: 99; width: 100%; }
.top_main { width: 1000px; margin: 0 auto; }
.top_main img { margin-top: 8px; }
.top_r { float: right; height: 14px; margin-top: 14px; }
.top_r a { float: left; height: 14px; color: #fff; padding: 0 12px; }
.top_r a:hover { color: #faf504; }
.top_r span { border-right: #fff 1px solid; width: 1px; height: 12px; margin-top: 3px; float: left; overflow: hidden; }
.content { position: relative; top: 0px; overflow: hidden; }
.screen { position: relative; overflow: hidden; }
.imgs { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 0; }
.s1_1 { position: absolute; left: 80px; top: 0; }
.hellotext{border-radius:6px;position:absolute; left: 44px; top: 66px;width:467px; height:40px;background-color:#b61b22; padding-left:20px;}
.hellotext_wrapper b{overflow:hidden; display: inline-block;letter-spacing: 8px; font-size:18px; color:#fff; line-height:40px;font-weight:normal; }
.s1_3 { position: absolute; left: 0; top: 0; }
.s1_4 { position: absolute; left: 557px; top: 0; }
.screen1_main { width: 576px; height: 130px; margin: 0 auto; position: relative; }
.downtb { display: inline-block; position: absolute; left: 48%; bottom: 40px; width: 100px; height: 47px; }
.items { position: fixed; right: 48px; top: 35%; z-index: 99999; }
.items li { margin-bottom: 30px; border-radius: 28px; cursor: pointer; width: 22px; height: 22px; border: transparent 3px solid; background-color: #b61b22; transition: all 0.3s ease-in-out; }
.items li.e, .items li:hover { background-color: #fff; width: 22px; height: 22px; border: #b61b22 3px solid; }
.screen2 { background-color: #f1f1f1; }
.screen2_main { width: 728px; height: 688px; margin: 0 auto; position: relative; }
.s2_1 { position: absolute; left: 115px; top: 250px; }
.s2_2 { position: absolute; }
.s2_3 { position: absolute;}
.s2_4 { position: absolute;}
.s2_5 { position: absolute; }
.s2_border { width: 8px; height: 210px; position: absolute; left: 348px; top: 85px; text-align: center; }
.s2_border i { width: 4px; height: 4px; border-radius: 4px; border: #121212 2px solid; display: block; }
.s2_border span { border-right: #121212 1px solid; width: 3px; height: 200px; overflow: hidden; display: block; }
.screen2_main h2 { text-align: center; font-size: 60px; color: #1b1b1b; font-family: "微软雅黑"; }
.screen3_main { width: 958px; height: 594px; margin: 0 auto; position: relative; }
.s3_1 { position: absolute; left: 260px; top: 203px; }
.s3_2 { position: absolute; left: 42px; top: 376px; }
.s3_3 { position: absolute; left: 636px; top: 425px; }
.screen3_main h2 { color: #fff; font-size: 60px; position: absolute; left: 475px; top: 0; }
.screen3_main h6 { color: #fff; font-size: 36px; position: absolute; left: 475px; top: 76px; }

.s3_border i { width: 4px; height: 4px; border-radius: 4px; border: #121212 2px solid; display: block; position: absolute; left: 817px; top: 142px; }
.s3_border span.one { border-right: #121212 2px solid; width: 1px; height: 200px; overflow: hidden; position: absolute; left: 819px; top: 150px; }
.s3_border span.two { border-right: #121212 2px solid; width: 1px; height: 99px; overflow: hidden; position: absolute; left: 750px; top: 319px; -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); }
.screen4 { background-color: #f1f1f1; }
.screen4_main { width: 1000px; height: 470px; margin: 0 auto; position: relative; }
.s4_1 { position: absolute; left: 355px; top: 0; z-index: 2; }
.s4_2 { position: absolute; left: 544px; top: 200px; z-index: 1; }
.screen4_main h2 { color: #1b1b1b; font-size: 60px; position: absolute; left: 0; top: 0; }
.screen4_main h6 { color: #696969; font-size: 36px; position: absolute; left: 0; top: 80px; }
.s4_border i { width: 4px; height: 4px; border-radius: 4px; border: #121212 2px solid; display: block; position: absolute; left: 360px; top: 98px; }
.s4_border span.one { border-right: #121212 2px solid; width: 1px; height: 200px; overflow: hidden; position: absolute; left: 362px; top: 106px; }
.s4_border span.two { border-right: #121212 2px solid; width: 1px; height: 99px; overflow: hidden; position: absolute; left: 432px; top: 276px; -o-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -moz-transform: rotate(-45deg); }
.foot{ text-align:center; position:absolute; left:0; bottom:20px; width:100%; color:#919191;}
/**第一屏动画*/
.imgs{ -webkit-animation:imgs 10s linear infinite;-o-animation:imgs 10s linear infinite;-ms-animation:imgs 10s linear infinite;-moz-animation:imgs 10s linear infinite;}
@keyframes imgs {
    0% { transform: scale(1) translateX(0px); }
    25% {transform: scale(1.04) translateX(10px); }
    50% {transform: scale(1.08) translateX(0px); }
    70% {transform: scale(1.04) translateX(-10px); }
    85% {transform: scale(1.02) translateX(5px); }
    100% {transform: scale(1) translateX(0px); }
}
@-webkit-keyframes imgs {
    0% { -webkit-transform: scale(1) translateX(0px); }
    25% {-webkit-transform: scale(1.04) translateX(10px); }
    50% {-webkit-transform: scale(1.08) translateX(0px); }
    70% {-webkit-transform: scale(1.04) translateX(-10px); }
    85% {-webkit-transform: scale(1.02) translateX(5px); }
    100% {-webkit-transform: scale(1) translateX(0px); }
}
@-moz-keyframes imgs {
    0% { -moz-transform: scale(1) translateX(0px); }
    25% {-moz-transform: scale(1.04) translateX(10px); }
    50% {-moz-transform: scale(1.08) translateX(0px); }
    70% {-moz-transform: scale(1.04) translateX(-10px); }
    85% {-moz-transform: scale(1.02) translateX(5px); }
    100% {-moz-transform: scale(1) translateX(0px); }
}
@-ms-keyframes imgs {
    0% { -ms-transform: scale(1) translateX(0px); }
    25% {-ms-transform: scale(1.04) translateX(10px); }
    50% {-ms-transform: scale(1.08) translateX(0px); }
    70% {-ms-transform: scale(1.04) translateX(-10px); }
    85% {-ms-transform: scale(1.02) translateX(5px); }
    100% {-ms-transform: scale(1) translateX(0px); }
}@-o-keyframes imgs {
    0% { -o-transform: scale(1) translateX(0px); }
    25% {-o-transform: scale(1.04) translateX(10px); }
    50% {-o-transform: scale(1.08) translateX(0px); }
    70% {-o-transform: scale(1.04) translateX(-10px); }
    85% {-o-transform: scale(1.02) translateX(5px); }
    100% {-o-transform: scale(1) translateX(0px); }
}
.u-kuoquanquan { z-index: 99999; border-radius: 50%; display: block; height: 100px; position: absolute; width: 100px;}
.u-kuoquanquan .bg { border-radius: 50%; cursor: pointer; height: 100%; left: 0; position: absolute; top: 0; -webkit-transform: scale(0.4);-moz-transform: scale(0.4);-ms-transform: scale(0.4);-o-transform: scale(0.4); -ms-transition: all 150ms ease; -o-transition: all 150ms ease; -webkit-transition: all 150ms ease; -moz-transition: all 150ms ease; width: 100%; }
.u-kuoquanquan .bg--pulse { -o-animation: 2s linear infinite running pulser 2s;-webkit-animation: 2s linear infinite running pulser 2s;-ms-animation: 2s linear infinite running pulser 2s;-moz-animation: 2s linear infinite running pulser 2s; background-color: transparent; border-radius: 100px; border: 2px #fff solid; height: 80px; margin: 0 auto; opacity: 0.1; width: 80px; z-index: 10; }
.u-kuoquanquan.no3 .bg--pulse {-o-animation: 2s linear infinite running pulser 2.5s;-webkit-animation: 2s linear infinite running pulser 2.5s;-ms-animation: 2s linear infinite running pulser 2.5s;-moz-animation: 2s linear infinite running pulser 2.5s; background-color: transparent; border-radius: 100px; border: 2px #fff solid; height: 80px; margin: 0 auto; opacity: 0.1; width: 80px; z-index: 10; }
.u-kuoquanquan.no2 .bg--pulse { -o-animation: 2s linear infinite running pulser 0.7s;-webkit-animation: 2s linear infinite running pulser 0.7s;-ms-animation: 2s linear infinite running pulser 0.7s;-moz-animation: 2s linear infinite running pulser 0.7s; background-color: transparent; border-radius: 100px; border: 2px #fff solid; height: 80px; margin: 0 auto; opacity: 0.1; width: 80px; z-index: 10; }
.u-kuoquanquan.no4 .bg--pulse { -moz-animation: 1.8s linear infinite running pulser 0.5s; -ms-animation: 1.8s linear infinite running pulser 0.5s; -o-animation: 1.8s linear infinite running pulser 0.5s; -webkit-animation: 1.8s linear infinite running pulser 0.5s; background-color: transparent; border-radius: 100px; border: 2px #fff solid; height: 80px; margin: 0 auto; opacity: 0.1; width: 80px; z-index: 10; }
.u-kuoquanquan.no5 .bg--pulse {-moz-animation: 3s linear infinite running pulser;-ms-animation: 3s linear infinite running pulser;-o-animation: 3s linear infinite running pulser;-webkit-animation: 3s linear infinite running pulser; background-color: transparent; border-radius: 150px; border: 2px #fff solid; height:150px; margin: 0 auto; opacity: 0.1; width: 150px; z-index: 10; }
.u-kuoquanquan.no1 { left: 20%; top: 60%; }
.u-kuoquanquan.no2 { left: 45%; top: 38%; }
.u-kuoquanquan.no3 { left: 70%; top: 20%; }
.u-kuoquanquan.no4 { left: 50%; bottom: 20%; }
.u-kuoquanquan.no5 { left: -70px;top: 40%;}

@-o-keyframes pulser {
    0% { opacity: 0; -o-transform: scale(0); }
    18% { opacity: 1; -o-transform: scale(0); }
    100% { opacity: 0; -o-transform: scale(1); }
}
@-moz-keyframes pulser {
    0% { opacity: 0; -moz-transform: scale(0); }
    18% { opacity: 1; -moz-transform: scale(0); }
    100% { opacity: 0; -moz-transform: scale(1); }
}
@-ms-keyframes pulser {
    0% { opacity: 0; -ms-transform: scale(0); }
    18% { opacity: 1; -ms-transform: scale(0); }
    100% { opacity: 0; -ms-transform: scale(1); }
}
@-webkit-keyframes pulser {
    0% { opacity: 0; -webkit-transform: scale(0); }
    18% { opacity: 1; -webkit-transform: scale(0); }
    100% { opacity: 0; -webkit-transform: scale(1); }
}

@-o-keyframes pulser2 {
    0% { opacity: 0; -o-transform: scale(0); }
    48% { opacity: 1; -o-transform: scale(0); }
    100% { opacity: 0; -o-transform: scale(1); }
}
@-moz-keyframes pulser2 {
    0% { opacity: 0; -moz-transform: scale(0); }
    48% { opacity: 1; -moz-transform: scale(0); }
    100% { opacity: 0; -moz-transform: scale(1); }
}
@-ms-keyframes pulser2 {
    0% { opacity: 0; -ms-transform: scale(0); }
    48% { opacity: 1; -ms-transform: scale(0); }
    100% { opacity: 0; -ms-transform: scale(1); }
}
@-webkit-keyframes pulser2 {
    0% { opacity: 0; -webkit-transform: scale(0); }
    48% { opacity: 1; -webkit-transform: scale(0); }
    100% { opacity: 0; -ms-transform: scale(1); }
}

/**第二屏动画*/
.s2_1,.s2_2,.s2_3,.s2_4,.s2_5{-o-transform:scale(0);-moz-transform:scale(0);-webkit-transform:scale(0);-ms-transform:scale(0);opacity:0;}
.s2_2,.s2_3,.s2_4,.s2_5{left:350px; top:390px; -o-transition:all 800ms cubic-bezier(.36,-0.31,.03,1.32);-webkit-transition:all 800ms cubic-bezier(.36,-0.31,.03,1.32);-ms-transition:all 800ms cubic-bezier(.36,-0.31,.03,1.32);-moz-transition:all 800ms cubic-bezier(.36,-0.31,.03,1.32) }
.s2_1.animate1{-moz-animation:s2_1 0.4s linear;-o-animation:s2_1 0.4s linear;-webkit-animation:s2_1 0.4s linear;-ms-animation:s2_1 0.4s linear;opacity:1;}
@-o-keyframes s2_1 {
    0% { opacity: 0; -o-transform: scale(0);}
    50%{ opacity:0.5; -o-transform: scale(0.5);}
    100% { opacity: 1; -o-transform: scale(1);}
}
@-moz-keyframes s2_1 {
    0% { opacity: 0; -moz-transform: scale(0);}
    50%{ opacity:0.5; -moz-transform: scale(0.5);}
    100% { opacity: 1; -moz-transform: scale(1);}
}
@-webkit-keyframes s2_1 {
    0% { opacity: 0; -webkit-transform: scale(0);}
    50%{ opacity:0.5; -webkit-transform: scale(0.5);}
    100% { opacity: 1; -webkit-transform: scale(1);}
}
@-ms-keyframes s2_1 {
    0% { opacity: 0; -ms-transform: scale(0);}
    50%{ opacity:0.5; -ms-transform: scale(0.5);}
    100% { opacity: 1; -ms-transform: scale(1);}
}
.s2_1.animate1,.s2_2.animate2,.s2_3.animate2,.s2_4.animate2,.s2_5.animate2{transform: scale(1);-ms-transform: scale(1);-o-transform: scale(1);-webkit-transform: scale(1);-moz-transform: scale(1);}
.s2_2.animate2,.s2_3.animate2,.s2_4.animate2,.s2_5.animate2{ opacity:1;}
.s2_2.animate2{ left: 496px; top: 262px;}
.s2_3.animate2{ left: 496px; top: 431px; }
.s2_4.animate2{ left: 0; top: 262px; }
.s2_5.animate2{ left: 0; top: 431px;}
.s2_border span{-webkit-transform:scaleY(0);-ms-transform:scaleY(0);-moz-transform:scaleY(0);-o-transform:scaleY(0);-ms-transform-origin:left bottom;-o-transform-origin:left bottom;-webkit-transform-origin:left bottom;-moz-transform-origin:left bottom;}
.s2_border i{ opacity:0;}
.s2_border.animate4 span{ -moz-transform:scaleY(1);-webkit-transform:scaleY(1);-o-transform:scaleY(1);-ms-transform:scaleY(1); -ms-transition:all 0.4s linear;-o-transition:all 0.4s linear;-webkit-transition:all 0.4s linear;-moz-transition:all 0.4s linear;}
.s2_border.animate5 i{ opacity:1;-o-transition:all 0.2s linear;-ms-transition:all 0.2s linear;-webkit-transition:all 0.2s linear;-moz-transition:all 0.2s linear;}
.screen2_main h2{ opacity:0; -o-transform:translateY(20px);-webkit-transform:translateY(20px);-ms-transform:translateY(20px);-moz-transform:translateY(20px); transition:all 0.2s linear;}
.screen2_main h2.animate6{ opacity:1; -o-transform:translateY(0); -ms-transform:translateY(0); -webkit-transform:translateY(0); -moz-transform:translateY(0);}

/**第三屏动画*/
.s3_1{ opacity:0; -moz-transform:translateX(1000px);-o-transform:translateX(1000px);-webkit-transform:translateX(1000px);-ms-transform:translateX(1000px);}
.s3_2{ opacity:0; -o-transform:translateX(-500px);-ms-transform:translateX(-500px);-webkit-transform:translateX(-500px);-moz-transform:translateX(-500px); }
.s3_3{ opacity:0; transform:translateX(800px);}
.s3_1,.s3_2,.s3_3{ -ms-transition:all 0.5s cubic-bezier(.36,-0.31,.03,1.32); -o-transition:all 0.5s cubic-bezier(.36,-0.31,.03,1.32); -moz-transition:all 0.5s cubic-bezier(.36,-0.31,.03,1.32); -webkit-transition:all 0.5s cubic-bezier(.36,-0.31,.03,1.32);}
.s3_1.animate1,.s3_2.animate2,.s3_3.animate3{opacity:1; -webkit-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);-moz-transform:translateX(0);}
.s3_border span.two{-webkit-transform:scaleX(0) rotate(45deg);-o-transform:scaleX(0) rotate(45deg);-ms-transform:scaleX(0) rotate(45deg);-moz-transform:scaleX(0) rotate(45deg);-o-transform-origin:bottom left;-webkit-transform-origin:bottom left;-ms-transform-origin:bottom left;-moz-transform-origin:bottom left;}
.s3_border span.one{-moz-transform:scaleY(0);-o-transform:scaleY(0);-ms-transform:scaleY(0);-webkit-transform:scaleY(0);-moz-transform-origin:left bottom;-ms-transform-origin:left bottom;-webkit-transform-origin:left bottom;-moz-transform-origin:left bottom;}
.s3_border i{ opacity:0;}
.s3_border.animate4 span.two{ -o-transform:scaleX(1) rotate(45deg);-moz-transform:scaleX(1) rotate(45deg);-webkit-transform:scaleX(1) rotate(45deg);-ms-transform:scaleX(1) rotate(45deg); -moz-transition:all 0.2s linear;-o-transition:all 0.2s linear;-webkit-transition:all 0.2s linear;-ms-transition:all 0.2s linear;}
.s3_border.animate4 span.one{ -o-transform:scaleY(1);-moz-transform:scaleY(1);-ms-transform:scaleY(1);-webkit-transform:scaleY(1); -o-transition:all 0.3s linear;-ms-transition:all 0.3s linear;-webkit-transition:all 0.3s linear;-moz-transition:all 0.3s linear;}
.s3_border.animate5 i{ opacity:1;-ms-transition:all 0.2s linear;-o-transition:all 0.2s linear;-webkit-transition:all 0.2s linear;-moz-transition:all 0.2s linear;}
.screen3_main h2{ opacity:0; -o-transform:translateY(20px);-webkit-transform:translateY(20px);-ms-transform:translateY(20px);-moz-transform:translateY(20px);-webkit-transition:all 0.2s linear;-ms-transition:all 0.2s linear;-o-transition:all 0.2s linear;-moz-transition:all 0.2s linear;}
.screen3_main h2.animate6{ opacity:1; -moz-transform:translateY(0);-webkit-transform:translateY(0);-o-transform:translateY(0);-ms-transform:translateY(0);}
.screen3_main h6{ opacity:0; -moz-transform:translateY(10px);-o-transform:translateY(10px);-webkit-transform:translateY(10px);-ms-transform:translateY(10px); -webkit-transition:all 0.2s linear;-ms-transition:all 0.2s linear;-o-transition:all 0.2s linear;-moz-transition:all 0.2s linear;}
.screen3_main h6.animate7{ opacity:1; -webkit-transform:translateY(0);-o-transform:translateY(0);-ms-transform:translateY(0);-moz-transform:translateY(0);}

/**第四屏动画*/
.s4_1{ opacity:0; -moz-transform:translateX(-2500px);-webkit-transform:translateX(-2500px);-o-transform:translateX(-2500px);-ms-transform:translateX(-2500px);}
.s4_1.animate1{opacity:1; -moz-transform:translateX(0);-o-transform:translateX(0);-webkit-transform:translateX(0);-ms-transform:translateX(0);}
.s4_2{ opacity:0; -moz-transform:translateX(2500px);-o-transform:translateX(2500px);-ms-transform:translateX(2500px);-webkit-transform:translateX(2500px);}
.s4_2.animate2{opacity:1; -o-transform:translateX(0);-webkit-transform:translateX(0);-ms-transform:translateX(0);-moz-transform:translateX(0);}
.s4_1,.s4_2{-ms-transition:all 0.6s cubic-bezier(.36,-0.31,.03,1.32);-moz-transition:all 0.6s cubic-bezier(.36,-0.31,.03,1.32);-webkit-transition:all 0.6s cubic-bezier(.36,-0.31,.03,1.32);-o-transition:all 0.6s cubic-bezier(.36,-0.31,.03,1.32);}
.s4_border span.two{-ms-transform:scaleX(0) rotate(-45deg);-o-transform:scaleX(0) rotate(-45deg);-webkit-transform:scaleX(0) rotate(-45deg);-moz-transform:scaleX(0) rotate(-45deg);-o-transform-origin:bottom right;-webkit-transform-origin:bottom right;-ms-transform-origin:bottom right;-moz-transform-origin:bottom right;}
.s4_border span.one{-o-transform:scaleY(0);-webkit-transform:scaleY(0);-ms-transform:scaleY(0);-moz-transform:scaleY(0);-moz-transform-origin:left bottom;-webkit-transform-origin:left bottom;-o-transform-origin:left bottom;-ms-transform-origin:left bottom;}
.s4_border i{ opacity:0;}
.s4_border.animate3 span.two{ transform:scaleX(1) rotate(-45deg);-o-transform:scaleX(1) rotate(-45deg);-ms-transform:scaleX(1) rotate(-45deg);-webkit-transform:scaleX(1) rotate(-45deg);-moz-transform:scaleX(1) rotate(-45deg);  -webkit-transition:all 0.2s linear;-ms-transition:all 0.2s linear;-o-transition:all 0.2s linear;-moz-transition:all 0.2s linear;}
.s4_border.animate3 span.one{ -o-transform:scaleY(1);-webkit-transform:scaleY(1);-ms-transform:scaleY(1);-moz-transform:scaleY(1); -o-transition:all 0.3s linear;-webkit-transition:all 0.3s linear;-ms-transition:all 0.3s linear;-moz-transition:all 0.3s linear;}
.s4_border.animate4 i{ opacity:1;-webkit-transition:all 0.2s linear;-ms-transition:all 0.2s linear;-o-transition:all 0.2s linear;-moz-transition:all 0.2s linear;}
.screen4_main h2{ opacity:0; -o-transform:translateY(20px); -webkit-transform:translateY(20px); -ms-transform:translateY(20px); -moz-transform:translateY(20px); -webkit-transition:all 0.2s linear;-ms-transition:all 0.2s linear;-o-transition:all 0.2s linear;-moz-transition:all 0.2s linear;}
.screen4_main h2.animate5{ opacity:1; -moz-transform:translateY(0);-o-transform:translateY(0);-webkit-transform:translateY(0);-ms-transform:translateY(0);}
.screen4_main h6{ opacity:0;  -o-transform:translateY(10px); -webkit-transform:translateY(10px); -ms-transform:translateY(10px); -moz-transform:translateY(10px); -webkit-transition:all 0.2s linear;-ms-transition:all 0.2s linear;-o-transition:all 0.2s linear;-moz-transition:all 0.2s linear;}
.screen4_main h6.animate6{ opacity:1; -moz-transform:translateY(0);-o-transform:translateY(0);-webkit-transform:translateY(0);-ms-transform:translateY(0);}
.foot{ -o-transform:translateY(100px); -webkit-transform:translateY(100px); -ms-transform:translateY(100px); -moz-transform:translateY(100px);  -o-transition:all 0.3s cubic-bezier(.36,-0.31,.03,1.32);-webkit-transition:all 0.3s cubic-bezier(.36,-0.31,.03,1.32);-moz-transition:all 0.3s cubic-bezier(.36,-0.31,.03,1.32);-ms-transition:all 0.3s cubic-bezier(.36,-0.31,.03,1.32);}
.foot.animates{ -ms-transform:translateY(0);-o-transform:translateY(0);-webkit-transform:translateY(0);-moz-transform:translateY(0);}