/*启动页*/
.hide{display: none}

html,body{
    height: 100%;
    width: 100%;
    overflow: hidden;
}
.start_bg{
    position: relative;
    background: url("../images/start/start_bg.jpg") no-repeat;
    background-size: 100% 100%;

}
.bagua_img{
    top: 60%;
    right: 20%;
}
.text_1,.text_2,.text_3,.text_4,.text_5,.text_6{  top: 13%;}
.text_1{  right: 49%;}
.text_2{  right: 54%;}
.text_3{  right: 58%;}

.text_4{  right: 62%;}
.text_5{  right: 66%;}
.text_6{  right: 70%;}




.start_nav{
    position: absolute;
    top: 75%;
    left: 20%;
}
.start_nav >li{
    float: left;
    padding-right: 20px;
    padding-left: 5px;
}
.start_nav >li a{
    font-family: "KaiTi";
	font-weight:400;
    font-size: 18px;
    color: #fff;
    line-height: 33px;
}
.start_nav >li:hover{
    background: url("../images/start/text_bg.png") no-repeat 0 0;
}
.start_nav >li:hover a{color:#fff}
.start_logo{
    right: 47%;
    top: 20%;
}
.start_jdl{
    right: 10%;
    bottom: 0;;
}

.start_jdl_luokuan{
    right: 6%;
    bottom: 3%;;
}


/*动画*/

@-webkit-keyframes bounceInRight{
    0%,100%,60%,75%,90%{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}
    0%{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}
    60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}
    75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}
    90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}
    100%{-webkit-transform:none;transform:none}
}
@keyframes bounceInRight{
    0%,100%,60%,75%,90%{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}
    0%{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}
    60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}
    75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}
    90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}
    100%{-webkit-transform:none;transform:none}
}
.bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}


.animated{
    -webkit-animation-duration:2s;
    animation-duration:2s;
    -webkit-animation-fill-mode:both;
    animation-fill-mode:both;
}


@-webkit-keyframes bounceInUp{
    0%,100%,60%,75%,90%{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}
    0%{opacity:0;-webkit-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0)}
    60%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}
    75%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}
    90%{-webkit-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}
    100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
}
@keyframes bounceInUp{
    0%,100%,60%,75%,90%{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}
    0%{opacity:0;-webkit-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0)}
    60%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}
    75%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}
    90%{-webkit-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}
    100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
}
.bounceInUp{-webkit-animation-name:bounceInUp;animation-name:bounceInUp}

.leaf_rotate{-webkit-animation-name:leaf_rotate;animation-name:leaf_rotate}
@-webkit-keyframes leaf_rotate{
    0%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,-200deg);transform:rotate3d(0,0,1,-200deg);opacity:0}
    100%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:none;transform:none;opacity:1}
}
@keyframes leaf_rotate{
    0%{
        -webkit-transform-origin:center;
        transform-origin:center;
        -webkit-transform:rotate3d(0,0,1,-360deg);
        transform:rotate3d(0,0,1,-360deg);

    }
    100%{
        -webkit-transform-origin:center;
        transform-origin:center;
        -webkit-transform:none;
        transform:none;
    }
}
.leaf_animated{
    -webkit-animation-duration:3s;
    animation-duration:3s;
    -webkit-animation-fill-mode:both;
    animation-fill-mode:both;
    -webkitanimation-timing-function:linear;
    animation-timing-function:linear;
}
.leaf_animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}
@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}
@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}
.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}
/*载入等待动画*/
.loading{
    width: 60px;
    height: 60px;
    position: relative;
    margin: -30px auto;
    top: 50%;
}
.loading #rate{
    font-size: 9px;
    width: 100%;
    text-align: center;
    height: 20px;
    line-height: 20px;
    color: #0062e0;
    position: absolute;
    top: 100%;
}
.double-bounce1,.double-bounce2{
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #0062e0;
    left: 0;
    top: 0;
    position: absolute;
    opacity: .6;
}

.double-bounce1 {
    -webkit-animation:bounce 2s infinite ease-in-out 0s;
}
.double-bounce2 {
    -webkit-animation:bounce2 2s infinite ease-in-out 0s;
}

@-webkit-keyframes bounce{
    0%, 100%{
        transform:scale(0);
    }
    50%{
        transform:scale(1);
    }
}
@-webkit-keyframes bounce2{
    0%, 100%{
        transform:scale(1);
    }
    50%{
        transform:scale(0);
    }
}











