﻿@charset "utf-8";
/* CSS Document */

/*--类--*/
.clearr{clear:both;height:0;overflow:hidden;}
.clearfix:after{content:"";clear:both;display:block;}
.left{float:left;}
.right{float:right;}
.footer_f{position:fixed;left:0;bottom:0;width:100%;}

/*--通用--*/
.block{width:1230px;height:100%;margin:0 auto;}

.header{position:fixed;left:0;top:0;right:0;z-index:3;padding:25px 70px 0;height:47px;}
.header .logo{float:left;background:url(/Content/images/logo.png) center center no-repeat;width:356px;height:100%;opacity:0;margin-left:-50px;
transition:all 0.7s ease-out 0s;-webkit-transition:all 0.7s ease-out 0s;}
.loaded .header .logo{margin-left:0;opacity:1;}
.header .r{float:right;height:100%;margin-right:-50px;opacity:0;position:relative;color:#fff;
transition:all 0.7s ease-out 0s;-webkit-transition:all 0.7s ease-out 0s;}
.loaded .header .r{margin-right:0;opacity:1;}
.header .t{position:absolute;right:85px;top:0;padding-top:8px;text-align:right;}
.header .t .link{font-size:12px;}
.header .t .tel{font-size:18px;font-family:Arial;}
.header .menu{position:absolute;right:0;top:12px;width:50px;cursor:pointer;height:30px;}
.header .menu i{float:right;border-top:3px solid #fff;
transition:all 0.2s ease-out 0s;-webkit-transition:all 0.2s ease-out 0s;}
.header .menu i:nth-child(1){width:100%;position:absolute;right:0;top:0;}
.header .menu i:nth-child(2){width:60%;position:absolute;right:0;top:14px;}
.header .menu i:nth-child(3){width:85%;position:absolute;right:0;top:28px;}
.header .menu:hover i{width:80%;}
.header .r.act{color:#333;}
.header .r.act .menu i{border-color:#333;}
.header .r.act i:nth-child(1){transform:translate(0,14px) rotate(45deg);width:80%;}
.header .r.act i:nth-child(2){opacity:0;}
.header .r.act i:nth-child(3){transform:translate(0,-14px) rotate(-45deg);width:80%;}

.nav_main{position:fixed;right:-465px;top:0;bottom:0;width:465px;background:url(/Content/images/bg_w.png);z-index:2;box-shadow:0 0 15px rgba(0,0,0,0.3);
transition:all 0.6s cubic-bezier(0,1,1,1) 0s;-webkit-transition:all 0.6s cubic-bezier(0,1,1,1) 0s;}
.nav_main.show{right:0;}
.nav_main .inner{padding:0 70px;position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);-webkit-transform:translateY(-50%);}
.nav_main .d{position:relative;}
.nav_main .d span{position:absolute;font-size:72px;color:#ddd;right:10%;bottom:10%;
transform:translate(-0%,0%);}
.nav_main .d:before{width:0%;height:0px;border:1px solid #aaa;border-bottom:none;position:absolute;left:0%;top:0;content:"";opacity:0;}
.nav_main .d:after{width:0%;height:0px;border:1px solid #aaa;border-top:none;position:absolute;right:0%;bottom:0;content:"";opacity:0;}
.nav_main .d:nth-child(even):before{right:0;left:auto;}
.nav_main .d:nth-child(even):after{left:0;right:auto;}
.nav_main .d:hover:before{animation:nav 0.5s cubic-bezier(0,1,1,1) 0s 1 both;-webkit-animation:nav 0.5s cubic-bezier(0,1,1,1) 0s 1 both;}
.nav_main .d:hover:after{animation:nav 0.5s cubic-bezier(0,1,1,1) 0s 1 both;-webkit-animation:nav 0.5s cubic-bezier(0,1,1,1) 0s 1 both;}
.nav_main .d a{display:block;padding:50px 28px;color:#333;text-align:center;position:relative;}
.nav_main .d h3{font-size:30px;font-family:'幼圆';color:#333;}
.nav_main .d h3 i{display:inline-block;width:5px;height:5px;border-radius:100%;vertical-align:middle;margin:0 10px 4px;background:#333;line-height:0;}
.nav_main .d p{margin-top:5px;line-height:1.5;}
@-webkit-keyframes nav{
0%{width:0%;height:0;}
1%{width:0%;height:0;opacity:1;}
50%{width:100%;height:0;opacity:1;}
100%{width:100%;height:30px;opacity:1;}
}
@keyframes nav{
0%{width:0%;height:0;}
1%{width:0%;height:0;opacity:1;}
50%{width:100%;height:0;opacity:1;}
100%{width:100%;height:30px;opacity:1;}
}

.body{overflow:hidden;position:relative;height:100%;}
.body .a_l{position:absolute;bottom:0;top:50%;width:140px;height:96px;margin-left:-22px; margin-top:-70px;z-index:1;border-top:3px solid #fff; font-size:16px; color:white; font-weight:bold; font-family:Arial; text-transform:uppercase; line-height:96px; text-align:center; cursor:pointer;
transform:rotate(90deg);
-ms-transform:rotate(90deg);    /* IE 9 */  
-moz-transform:rotate(90deg);   /* Firefox */  
-webkit-transform:rotate(90deg); /* Safari 和 Chrome */  
-o-transform:rotate(90deg);     /* Opera */  
transition:all 0.7s ease-out 0s;-webkit-transition:all 0.7s ease-out 0s;}
.body .a_l:hover{background-color:rgba(255,255,255,0.15);}
.body .a_l:after{content:"";position:absolute;right:0px;top:-3px;width:100%;height:3px;background:#d32329;
transition:all 0.3s cubic-bezier(0,1,1,1) 0s;-webkit-transition:all 0.3s cubic-bezier(0,1,1,1) 0s;clip:rect(3px 70px 3px 70px);}
.body .a_l:hover:after{clip:rect(0px 140px 3px 0);}
.body .a_r{position:absolute;right:0;top:50%;width:140px;height:96px;margin-right:-22px; margin-top:-70px;z-index:1;border-bottom:3px solid #fff; font-size:16px; color:white; font-weight:bold; font-family:Arial; text-transform:uppercase; line-height:96px; text-align:center; cursor:pointer;
transition:all 0.7s ease-out 0s;-webkit-transition:all 0.7s ease-out 0s;
transform:rotate(90deg);
-ms-transform:rotate(90deg);    /* IE 9 */  
-moz-transform:rotate(90deg);   /* Firefox */  
-webkit-transform:rotate(90deg); /* Safari 和 Chrome */  
-o-transform:rotate(90deg);     /* Opera */  }
.body .a_r:hover{background-color:rgba(255,255,255,0.15);}
.body .a_r:after{content:"";position:absolute;bottom:-3px;left:0;width:100%;height:3px;background:#d32329;
transition:all 0.3s cubic-bezier(0,1,1,1) 0s;-webkit-transition:all 0.3s cubic-bezier(0,1,1,1) 0s;clip:rect(3px 70px 3px 70px);}
.body .a_r:hover:after{clip:rect(0px 140px 3px 0);}

.banner{width:100%;height:100%;position:absolute;left:0;top:0;right:0;bottom:0;overflow:hidden;}
.banner .frame{position:relative;height:100%;overflow:hidden;}
.banner .child{position:absolute;left:0;top:0;width:100%;height:100%;background-position:center center;background-repeat:no-repeat;background-size:cover;z-index:-1;}
.banner .vbg{position:absolute;left:50%;top:50%;width:100%;height:100%;display:none;
transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);}
.banner .vbgm{position:absolute;left:0%;top:0%;width:100%;height:100%;display:none;}
.b_nav{position:absolute;left:0;bottom:30px;right:0;text-align:center;}
.b_nav i{display:inline-block;width:14px;height:14px;margin:0 5px;cursor:pointer;vertical-align:middle; background:url(/Content/images/banner_ico.png) no-repeat left center;
-moz-border-radius:50%; 
 -webkit-border-radius:50%; 
 -khtml-border-radius:50%;
 border-radius:50%;}
.b_nav i.now{ background-position:right center; box-shadow:0 0 6px rgba(0,0,0,0.24);}

.main{position:absolute;left:94px;top:98px;right:94px;bottom:110px;background:rgba(255,255,255,0);}
.main .bdr{position:absolute;background:#ddd;
transition:all 1s cubic-bezier(0,1.3,0.7,1) 0s;-webkit-transition:all 1s cubic-bezier(0,1.3,0.7,1) 0s;}
.main .b1{left:0;top:0;width:1px;height:1px;}
.loaded .main .b1{width:100%;}
.main .b2{right:0;top:0;width:1px;height:1px;}
.loaded .main .b2{height:100%;}
.main .b3{right:0;bottom:0;width:1px;height:1px;}
.loaded .main .b3{width:100%;}
.main .b4{left:0;bottom:0;width:1px;height:1px;}
.loaded .main .b4{height:100%;}

.home{position:relative;height:100%;}
.titbox{position:absolute;left:50%;top:50%;text-align:center;color:#fff;width:860px;cursor:default;display:none;
transform:translate(-50%,-56%);-webkit-transform:translate(-50%,-56%);}
.titbox:first-child{display:block;}
.titbox h3{font-size:68px;font-family:Cambria,Arial;color:#d32329;text-transform:uppercase; font-weight:bold;}
.titbox h4{font-size:52px;margin-top:22px;color:#fff;}
.titbox p{font-size:24px;margin-top:28px; padding-top:30px; background:url(/Content/images/bian_1.png) no-repeat top center;}
.titbox p b{ font-weight:normal;}
.titbox2{position:absolute;left:50%;top:50%;text-align:center;color:#fff;width:600px;cursor:default;opacity:0;
transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);}
.s .titbox2{animation:ht 4s linear 0.3s 1 both;-webkit-animation:ht 4s linear 0.3s 1 both;}
.s.dly .titbox2{animation-delay:3s;-webkit-animation-delay:3s;}
.titbox2 h3{font-size:60px;font-family:Impact;color:#fff;text-transform:uppercase;}
.titbox2 h4{font-size:42px;font-family:'幼圆';margin-top:5px;color:#fff;}
.titbox2 p{font-size:20px;margin-top:8px;}
@-webkit-keyframes ht{
0%{-webkit-transform:translate(-50%,-50%) scale(1);opacity:0;filter:blur(0);}
10%{-webkit-transform:translate(-50%,-48.5%) scale(1.05);opacity:0.7;filter:blur(2px);}
30%{-webkit-transform:translate(-50%,-46.5%) scale(1.3);opacity:0;filter:blur(3px);}
100%{-webkit-transform:translate(-50%,-46.5%) scale(1.3);opacity:0;filter:blur(3px);}
}
@keyframes ht{
0%{transform:translate(-50%,-50%) scale(1);opacity:0;filter:blur(0);}
10%{transform:translate(-50%,-48.5%) scale(1.05);opacity:0.7;filter:blur(2px);}
30%{transform:translate(-50%,-46.5%) scale(1.3);opacity:0;filter:blur(3px);}
100%{transform:translate(-50%,-46.5%) scale(1.3);opacity:0;filter:blur(3px);}
}

.spinner{height:100%;position:relative;}
.container1>div,.container2>div{width:15px;height:15px;background:#fff;border-radius:100%;position:absolute;-webkit-animation:bouncedelay 1.2s ease-in-out 0s infinite;;animation:bouncedelay 1.2s ease-in-out 0s infinite;}
.spinner .spinner-container{position:absolute;width:100%;height:100%;}
.container2{-webkit-transform:rotateZ(45deg);transform:rotateZ(45deg);}
.circle1{top:0;left:0;}
.circle2{top:0;right:0;}
.circle3{right:0;bottom:0;}
.circle4{left:0;bottom:0;}
.container1 .circle1{-webkit-animation-delay:-1.1s;animation-delay:-1.1s;}
.container2 .circle1{-webkit-animation-delay:-1.1s;animation-delay:-1.1s;}
.container1 .circle2{-webkit-animation-delay:-0.9s;animation-delay:-0.9s;}
.container2 .circle2{-webkit-animation-delay:-0.8s;animation-delay:-0.8s;}
.container1 .circle3{-webkit-animation-delay:-0.6s;animation-delay:-0.6s;}
.container2 .circle3{-webkit-animation-delay:-0.5s;animation-delay:-0.5s;}
.container1 .circle4{-webkit-animation-delay:-0.3s;animation-delay:-0.3s;}
.container2 .circle4{-webkit-animation-delay:-0.2s;animation-delay:-0.2s;}
@-webkit-keyframes bouncedelay{0%,80%,100%{-webkit-transform:scale(0.0);}40%{-webkit-transform:scale(1.0);}}
@keyframes bouncedelay{0%,80%,100%{transform:scale(0.0);-webkit-transform:scale(0.0);}40%{transform:scale(1.0);-webkit-transform:scale(1.0);}}

.rotate .left{width:50%;height:100%;overflow:hidden;position:relative;
transform-origin:right center;-webkit-transform-origin:right center;
transition:all 0.6s ease-in 0s;-webkit-transition:all 0.6s ease-in 0s;}
.rotate .right{width:50%;height:100%;overflow:hidden;position:relative;
transform-origin:left center;-webkit-transform-origin:left center;
transition:all 1s ease-in 0s;-webkit-transition:all 1s ease-in 0s;}
.rotate .zoom{transition:all 6s linear 0s;-webkit-transition:all 6s linear 0s;
transform:scale(1.1);-webkit-transform:scale(1.1);}
.rotate .d{width:1680px;height:300%;position:absolute;top:-100%;background-size:1680px auto;
transform:rotate(-180deg);-webkit-transform:rotate(-180deg);}
.rotate .left .d{right:0;transform-origin:right center;background-position:840px center;}
.rotate .right .d{left:0;transform-origin:left center;background-position:-840px center;}
.rotate .d.now{transform:rotate(0deg);}

.showtit i{opacity:0;display:inline-block;vertical-align:text-bottom;
transform:translateY(120px);-webkit-transform:translateY(120px);
transition:all 1s ease-in-out 0s;-webkit-transition:all 1s ease-in-out 0s;
}
.showtit.act i{transform:translateY(0);-webkit-transform:translateY(0);opacity:1;}
.showtxt i{display:inline-block;text-align:left;}
.showtxt i b{opacity:0;display:inline-block;white-space:nowrap;overflow:hidden;
transition:all 0.6s ease-out 0s;-webkit-transition:all 0.6s ease-out 0s;}
.showtxt i b.h{width:0;}
.showtxt.act i b.h{width:100%;opacity:1;}

@-webkit-keyframes hand{
0%{opacity:0;-webkit-transform:scale(1.3);}
60%{opacity:1;-webkit-transform:scale(1);}
100%{opacity:0;-webkit-transform:scale(1);}
}
@keyframes hand{
0%{opacity:0;transform:scale(1.3);}
60%{opacity:1;transform:scale(1);}
100%{opacity:0;transform:scale(1);}
}
.nav_service{position:absolute;left:50%;top:0px;bottom:0px;padding-top:80px;z-index:1;color:#fff;border-left:1px solid rgba(255,255,255,0.7);display:none;}
.nav_service .line{border-left:3px solid rgba(255,255,255,1);position:absolute;top:1px;left:-2px;padding-top:86px;width:45px;}
.nav_service .line span{border-top:3px solid rgba(255,255,255,1);position:absolute;left:0;bottom:0;width:0%;}
.nav_service .inner{position:relative;}
.nav_service .item{margin-bottom:25px;padding:0 0 0 60px;position:relative;}
.nav_service .item:before{content:"";border-top:1px solid rgba(255,255,255,0.7);left:0;top:7px;width:45px;position:absolute;}
.nav_service .item_l{margin-bottom:20px;}
.nav_service h3{font-size:14px;color:#fff;cursor:pointer;}
.nav_service .cur{text-shadow:3px 3px 2px rgba(0,0,0,0.3);}
.nav_service h4{font-size:12px;font-family:Arial;color:#fff;margin-top:6px;text-transform:uppercase;cursor:pointer;}
.nav_service ul{margin-top:15px;padding:3px 0;border-left:1px solid rgba(255,255,255,0.7);display:none;}
.nav_service ul li{margin:14px 0;position:relative;padding-left:30px;}
.nav_service ul li:before{content:"";position:absolute;left:0;top:50%;margin-top:-1px;border-top:1px solid rgba(255,255,255,0.7);width:15px;}

.nav_sm{position:absolute;left:0;bottom:0.5rem;text-align:center;width:50%;display:none;}
.nav_sm i{display:inline-block;width:0.1rem;height:0.1rem;border:2px solid #fff;border-radius:100%;margin:0 0.05rem;opacity:0;
transform:translateY(0.25rem);-webkit-transform:translateY(0.25rem);
transition:all 0.3s ease-out 0s;-webkit-transition:all 0.3s ease-out 0s;}
.nav_sm i:nth-child(2){transition-delay:0.1s;-webkit-transition-delay:0.1s;}
.nav_sm i:nth-child(3){transition-delay:0.2s;-webkit-transition-delay:0.2s;}
.nav_sm i:nth-child(4){transition-delay:0.3s;-webkit-transition-delay:0.3s;}
.nav_sm i:nth-child(5){transition-delay:0.4s;-webkit-transition-delay:0.4s;}
.nav_sm i:nth-child(6){transition-delay:0.5s;-webkit-transition-delay:0.5s;}
.nav_sm i:nth-child(7){transition-delay:0.6s;-webkit-transition-delay:0.6s;}
.nav_sm.show i{transform:translateY(0);-webkit-transform:translateY(0);opacity:1;}
.nav_sm i.now{background:#fff;}