@charset "utf-8";
html,body{width: 100%;/* height: 100%; */font-family: "Microsoft YaHei";}
h1,h2{
    width: 100%;
    /*text-align: center;*/
}
/*a:hover{color: #fff000}*/
img{display: inline-block;}
.wrap{position: relative;width: 100%;height: 100%;}
.banner{width: 100%;position:relative;/* border-bottom: 3px solid #1568ab; */}
.banner img{width: 100%;}
/*nav*/
.navBg{width:  100%;/* background: #0e5c3a; *//* position: absolute; */z-index: 99;/* border-bottom: 3px solid #1568ab; */}
.navBox{width: 1200px;height: 100px;margin: 0 auto;/* padding: 6px 0; */overflow: hidden;line-height: 100px;}
.navBox .logo{float: left;margin-top: 7px;/* width: 104px; */}
.navBox .nav{/* width: 448px; */float: right;margin: 0 auto;height: 100%;}
.nav a{color: #000000;}
.nav li{float: left;font-size: 18px;text-align: center;margin: 0px 29px;letter-spacing: 2px;/* padding: 5px 10px; *//* width: 112px; *//* font-weight: bold; */}
.nav li+li a{}
.nav li.on,.nav li:hover{/* background: url("images/nav-bg.jpg") no-repeat; */}
.nav li:hover a,.nav li.on a{color: #000000;border-bottom: 2px solid #395eb2;padding-bottom: 10px;}
/*banner*/
.banner img{width: 100%;}
.banner-line{width: 100%;height: 10px; background: #1284cc}
/*foot*/
.footer{width:100%;line-height: 30px;text-align: center;font-size: 14px;color: #ababab;background: #395eb2;/* margin-top: 100px; */}
.footer a{color: #000000;}
/*xnav*/
.xnav{text-align: center;/* overflow: hidden; *//* height: 37px; */border-bottom: 1px #d0cfce solid;margin-top: 50px;}
.xnav li{display: inline-block;text-align: center;width: 170px;height: 110px;overflow: hidden;color: #231815;padding-top: 15px;margin:  0;float: left;}
.xnav li+li{/* margin-left: 100px; */}
.xnav li a{color: #3e3a39;font-size: 22px;/* padding: 5px; */overflow: hidden;display: block;}
.xnav li.on{border-bottom: 3px solid #059000;background: #f4fff6;}
.xnav li:hover{border-bottom: 3px solid #059000;background: #f4fff6;}
.xnav li span{display: block;margin-top: 10px;font-size: 16px;font-weight: bold;}
.xnav ul{ overflow: hidden;width: 680px;margin: auto;}
.content{width: 100%;margin: 0 auto;overflow: hidden;}
.top_icon{position: relative;left: 50%;margin-left: -20px;cursor: pointer;}
body{background: #fff;}
/*index*/
.index-bg{position: relative;width: 100%;}
.index2{width: 100%;position: relative;}
.index2 .img{position: absolute;opacity: 0;}
.index-1{
    width: 63.5%;
    top: 20%;
    left: 6%;
    animation: bounceIn 1.3s forwards linear;-webkit-animation: bounceIn 1.3s forwards linear
}
.index-2{
    width: 45.31%;
    left: 72.5%;
    top: 4%;
    margin-left: -46%;
    animation: fadeInUp 0.5s 0.8s forwards linear;
    -webkit-animation: fadeInUp 0.5s 0.8s forwards linear;
}
.index-3{
    width: 85.7%;
    left: 50%;
    top: 14%;
    margin-left: -42.85%;
    animation: bounceIn 1.3s forwards linear;
    -webkit-animation: bounceIn 1.3s forwards linear;
}
.index-4{
    width: 14.21%;
    top: 26%;
    left: 83%;
    animation:bounceIn 1.3s forwards linear, flyUpDown 5s 1.5s infinite linear;
    -webkit-animation:bounceIn 1.3s forwards linear, flyUpDown 5s 1.5s infinite linear;
}
.index-5{
    width: 100%;
}
.index-6{
    width: 100%;
    bottom: 0;
}
.index-7{
    width: 5.6%;
    left: 3%;
    top: 3%;
    animation: bounceIn 1.3s forwards linear;
    -webkit-animation: bounceIn 1.3s forwards linear;
}
.index-8{
    width: 16.4%;
    left: 81%;
    top: 3%;
    animation: bounceIn 1.3s forwards linear;
    -webkit-animation: bounceIn 1.3s forwards linear;
}
.index-btn{
    width: 10.4%;
    position: absolute;
    display: block;
    top: 65%;
    left: 69%;
    /* margin-left: -27%; */
    animation: bounceIn 1.3s forwards linear;
    -webkit-animation: bounceIn 0.8s 1.3s forwards linear,flash 1.5s 2.5s infinite linear;
}
.index-btn img{width: 100%; position: relative}
.xq_box{width: 93%;margin: 0 auto;text-align: justify;line-height: 31px;font-size: 14px;}
@media screen and (max-width:980px) {
    .index{height:33%;}
}
/*鍔ㄧ敾*/
@-webkit-keyframes flyUpDown{
    0%{-webkit-transform:translateY(0);transform:translateY(0);}
    50%{-webkit-transform:translateY(-50%);transform:translateY(-50%);}
    100%{-webkit-transform:translateY(0);transform:translateY(0)}
}
@keyframes flyUpDown{
    0%{-webkit-transform:translateY(0);transform:translateY(0);}
    50%{-webkit-transform:translateY(-50%);transform:translateY(-50%);}
    100%{-webkit-transform:translateY(0);transform:translateY(0)}
}
@-webkit-keyframes zoomIn{
    0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3);}
    50%,100%{opacity:1;}
}
@keyframes zoomIn{
    0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3);}
    50%,100%{opacity:1;}
}
@-webkit-keyframes fadeIn{
    0%{opacity:0;}
    100%{opacity:1;}
}
@keyframes fadeIn{
    0%{opacity:0;}
    100%{opacity:1;}
}
@-webkit-keyframes fly{
    0%{-webkit-transform:translate(600%,0);}
    100%{-webkit-transform:translate(0,0);opacity:1;}
}
@keyframes fly{
    0%{transform:translate(600%,0);}
    100%{transform:translate(0,0);opacity:1;}
}
@-webkit-keyframes xz {
    0% {
        opacity:1;
        -webkit-transform: rotate(0deg);
        -webkit-transform-origin:107px 107px;
    }
    100% {
        opacity: 1;
        -webkit-transform: rotate(360deg);
        -webkit-transform-origin:107px 107px;
    }
}
@keyframes xz {
    0% {
        opacity:1;
        transform: rotate(0deg);
        transform-origin:107px 107px;
    }
    100% {
        opacity: 1;
        transform: rotate(360deg);
        transform-origin:107px 107px;
    }
}
@-webkit-keyframes flash {
    0%,100%{
        opacity: 1
    }
    50% {
        opacity: 0
    }
}
@keyframes flash {
    0%,100%{
        opacity: 1
    }
    50% {
        opacity: 0
    }
}
@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,100%,0);
        transform: translate3d(0,100%,0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,100%,0);
        -ms-transform: translate3d(0,100%,0);
        transform: translate3d(0,100%,0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }
}
@-webkit-keyframes fadeInDown{
    0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);}
    100%{opacity:1;-webkit-transform:none;transform:none;visibility: visible;}
}
@keyframes fadeInDown{
    0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);}
    100%{opacity:1;-webkit-transform:none;transform:none; visibility: visible;}
}
@-webkit-keyframes fadeInLeft{
    0%{-webkit-transform:translateX(-100%);transform:translateX(-100%);opacity:0;}
    100%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1; visibility: visible;}
}
@keyframes fadeInLeft{
    0%{-webkit-transform:translateX(-100%);transform:translateX(-100%);opacity:0;}
    100%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1; visibility: visible;}
}
@-webkit-keyframes fadeInLeft2{
    0%{-webkit-transform:translateX(-50%);transform:translateX(-50%);opacity:0;}
    100%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1; visibility: visible;}
}
@keyframes fadeInLeft2{
    0%{-webkit-transform:translateX(-50%);transform:translateX(-50%);opacity:0;}
    100%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1; visibility: visible;}
}
@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%,0,0);
        transform: translate3d(100%,0,0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
@keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%,0,0);
        -ms-transform: translate3d(100%,0,0);
        transform: translate3d(100%,0,0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }
}
@-webkit-keyframes fadeInRight2 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(50%,0,0);
        transform: translate3d(50%,0,0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
@keyframes fadeInRight2 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(50%,0,0);
        -ms-transform: translate3d(50%,0,0);
        transform: translate3d(50%,0,0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }
}
@-webkit-keyframes bounceIn {
    0%,100%,20%,40%,60%,80% {
        -webkit-transition-timing-function: cubic-bezier(0.215,.61,.355,1);
        transition-timing-function: cubic-bezier(0.215,.61,.355,1)
    }
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }
    20% {
        -webkit-transform: scale3d(1.1,1.1,1.1);
        transform: scale3d(1.1,1.1,1.1)
    }
    40% {
        -webkit-transform: scale3d(.9,.9,.9);
        transform: scale3d(.9,.9,.9)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03,1.03,1.03);
        transform: scale3d(1.03,1.03,1.03)
    }
    80% {
        -webkit-transform: scale3d(.97,.97,.97);
        transform: scale3d(.97,.97,.97)
    }
    100% {
        opacity: 1;
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1)
    }
}
@keyframes bounceIn {
    0%,100%,20%,40%,60%,80% {
        -webkit-transition-timing-function: cubic-bezier(0.215,.61,.355,1);
        transition-timing-function: cubic-bezier(0.215,.61,.355,1)
    }
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        -ms-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }
    20% {
        -webkit-transform: scale3d(1.1,1.1,1.1);
        -ms-transform: scale3d(1.1,1.1,1.1);
        transform: scale3d(1.1,1.1,1.1)
    }
    40% {
        -webkit-transform: scale3d(.9,.9,.9);
        -ms-transform: scale3d(.9,.9,.9);
        transform: scale3d(.9,.9,.9)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03,1.03,1.03);
        -ms-transform: scale3d(1.03,1.03,1.03);
        transform: scale3d(1.03,1.03,1.03)
    }
    80% {
        -webkit-transform: scale3d(.97,.97,.97);
        -ms-transform: scale3d(.97,.97,.97);
        transform: scale3d(.97,.97,.97)
    }
    100% {
        opacity: 1;
        -webkit-transform: scale3d(1,1,1);
        -ms-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1)
    }
}
@-webkit-keyframes bounceInDown{
    0%,60%,75%,90%,100%{-webkit-animation-timing-function:cubic-bezier(0.215,0.610,0.355,1.000);animation-timing-function:cubic-bezier(0.215,0.610,0.355,1.000)}
    0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}
    60%{opacity:1;-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,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:none;transform:none;opacity:1;}
}
@keyframes bounceInDown{
    0%,60%,75%,90%,100%{-webkit-animation-timing-function:cubic-bezier(0.215,0.610,0.355,1.000);animation-timing-function:cubic-bezier(0.215,0.610,0.355,1.000)}
    0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}
    60%{opacity:1;-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,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:none;transform:none;opacity:1;}
}
@-webkit-keyframes bounce{
    0%,100%,20%,53%,80%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
    40%,43%{-webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);transition-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}
    70%{-webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);transition-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}
    90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}
    100%{opacity:1;}
}
@keyframes bounce{
    0%,100%,20%,53%,80%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1);-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
    40%,43%{-webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);transition-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-30px,0);-ms-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}
    70%{-webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);transition-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-15px,0);-ms-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}
    90%{-webkit-transform:translate3d(0,-4px,0);-ms-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}
    100%{opacity:1;}
}
/*about*/
.title{display: block; margin: 0 auto; margin-top: 15px; margin-bottom: 45px;}
.contentW{width: 1200px;margin: 0 auto;padding-bottom: 100px;}
.text-box{color: #666666;font-size: 16px;line-height: 30px;text-indent: 2em;text-align: justify;margin-bottom: 40px;margin-top: 40px;}
.gg-box{ line-height: 35px;}
.gg-box h1{color: #666666;font-size: 16px;text-align: justify;text-indent: 2em;font-weight: bold;margin-top: 35px;margin-bottom: 10px;}
.gg-box p{color: #666666; font-size: 16px; text-align: justify; text-indent: 2em;}
.gg-box span{color: #52a7ff;}