﻿* {
    margin:0;
    padding:0
}
body {
    line-height:1.4;
    min-width:1280px;
    font-family:Pingfang SC, microsoft yahei, Helvetica
}
li, ul {
    list-style:none
}
a {
    text-decoration:none;
    outline:none;
    -webkit-tap-highlight-color:transparent
}
img {
    border:none;
    vertical-align:middle
}
.clear:after {
    content:""
}
.clear:after, .float-clear {
    display:block;
    height:0;
    clear:both
}
article, aside, figure, footer, header, main, nav, section {
    display:block
}
strong {
    font-weight:400
}
address {
    font-style:normal
}
.body-header .banner-wrapper {
    position:relative;
    width:100%;
/*    height:550px;*/
    overflow:hidden
}
.body-header .banner-wrapper .banner{
    position:absolute;
    top:0;
    bottom:0;
    left:50%;
    margin-left:-50%;
    width:100%;
    *height:100%
}
.body-header .banner-wrapper .banner img {
    width:100%;
    height:100%;
    object-fit:cover
}
.body-header .banner-wrapper .banner img:nth-child(2) {
    display:none
}
.body-header .banner-wrapper .banner .banner-cover {
    position:absolute;
    left:0;
    right:0;
    top:0;
    bottom:0;
    background-color:#0071ff;
    opacity:.2
}
.body-header .banner-wrapper .nav-container {
    position:absolute;
    left:0;
    right:0;
    top:0;
    z-index:2
}
.body-header .banner-wrapper .nav-container .nav-bg {
    position:absolute;
    display:block;
    left:0;
    right:0;
    top:0;
    height:50px;
    background-color:#2d1704;
    filter:alpha(opacity=20);
    opacity:.2
}
.body-header .banner-wrapper .nav-container:hover .nav-bg {
    background-color:#000;
    filter:alpha(opacity=65);
    opacity:.65
}
.body-header .banner-wrapper .nav-container .nav-wrapper {
    position:relative;
    z-index:2;
    margin:0 auto;
    width:1280px
}
.body-header .banner-wrapper .logo-container {
    float:left;
    *width:330px
}
.body-header .banner-wrapper .logo-container .logo {
    margin:10px 0;
    width:190px
}
.body-header .banner-wrapper .logo-container .title {
    display:inline-block;
    *display:inline;
    vertical-align:middle;
    margin-left:10px;
    padding-left:10px;
    border-left:1px solid #ccc;
    line-height:1;
    font-weight:400;
    color:#fff;
    font-size:18px
}
.body-header .banner-wrapper .nav-list {
    float:right
}
.body-header .banner-wrapper .nav-list>li {
    float:left;
    font-size:16px
}
.body-header .banner-wrapper .nav-list>li a {
    display:block;
    position:relative;
    padding:0 18px;
    white-space:nowrap;
    color:#fff
}
.body-header .banner-wrapper .nav-list>li a:hover {
    color:#00c568
}
.body-header .banner-wrapper .nav-list>li a .iconfont {
    width:16px
}
.body-header .banner-wrapper .nav-list>li a .icon-arrow-up {
    display:none
}
.body-header .banner-wrapper .nav-list>li>a {
    line-height:50px
}
.body-header .banner-wrapper .nav-list>li .sub-nav {
    display:none;
    position:absolute;
    z-index:1;
    font-size:14px
}
.body-header .banner-wrapper .nav-list>li .sub-nav .sub-bg {
    position:absolute;
    z-index:0;
    left:0;
    top:0;
    right:0;
    bottom:0;
    background-color:#000;
    filter:alpha(opacity=65);
    opacity:.65
}
.body-header .banner-wrapper .nav-list>li .sub-nav ul {
    position:relative;
    z-index:1;
    padding:8px 0
}
.body-header .banner-wrapper .nav-list>li .sub-nav a {
    padding:8px 18px
}
.body-header .banner-wrapper .nav-list>li.active>a:after {
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:3px;
    background-color:#00c568
}
.body-header .banner-wrapper .nav-list>li:hover>a:after {
    background-color:transparent
}
.body-header .banner-wrapper .nav-list>li:hover>a .icon-arrow-down {
    display:none
}
.body-header .banner-wrapper .nav-list>li:hover>a .icon-arrow-up {
    display:inline;
    display:initial
}
.body-header .banner-wrapper .nav-list>li:hover .sub-nav {
    display:block
}
.body-header .banner-wrapper .slogan-container {
    position:relative;
    z-index:1;
    margin:0 auto;
    width:1280px
}
.body-header .banner-wrapper .slogan-container .slogan-wrapper {
    padding-top:210px;
    margin-left:200px;
    color:#fff;
    text-shadow:0 0 3px rgba(0, 0, 0, .3)
}
.body-header .banner-wrapper .slogan-container .slogan-wrapper h2 {
    margin-bottom:30px;
    font-size:38px
}
.body-header .banner-wrapper .slogan-container .slogan-wrapper p {
    margin-bottom:10px;
    font-size:26px;
    letter-spacing:6px;
    line-height:20px
}
.mobile-nav-container {
    display:none;
    position:fixed;
    z-index:1000;
    top:0;
    left:0;
    height:100%;
    width:100%;
    overflow:hidden;
    background-color:#1a1a1a;
    color:#fff;
    background-size:contain;
    transition:height .2s ease-in
}
.mobile-nav-container.close {
    height:11.7vw
}
.mobile-nav-header {
    position:relative;
    background-color:#0e0e0e;
    text-align:center
}
.mobile-nav-header .icon-menu {
    position:absolute;
    right:0;
    top:50%;
    width:11.7vw;
    height:11.7vw;
    line-height:11.7vw;
    font-size:7vw;
    transition:transform .2s ease-in;
    transform:translateY(-50%)
}
.mobile-nav-header .icon-menu:active {
    background-color:hsla(0, 0%, 100%, .1)
}
.mobile-nav-header img {
    height:8.1vw;
    padding:1.8vw 0
}
.mobile-nav-wrapper {
    position:relative;
    padding-left:8.8vw
}
.mobile-nav-wrapper:before {
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:0;
    height:1px;
    background-color:#575757;
    transform:scaleY(.5)
}
.mobile-nav-wrapper li {
    position:relative
}
.mobile-nav-wrapper li:after {
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:1px;
    background-color:#575757;
    transform:scaleY(.5);
    transform-origin:50% 100%
}
.mobile-nav-wrapper li h2 {
    font-weight:300;
    font-size:4.5vw
}
.mobile-nav-wrapper li h2 a {
    display:block;
    padding:3.3vw 0 3.3vw 6vw;
    color:#fff;
    letter-spacing:.2vw;
    outline:none;
    -webkit-tap-highlight-color:transparent
}
.mobile-nav-wrapper li h2 a:active {
    background-color:#00c568
}
@media screen and (max-width:768px) {
    .body-header .banner-wrapper {
        height:12vw;
        background-color:#2e3132
    }
    .body-header .banner-wrapper .banner {
        top:11.7vw
    }
    .body-header .banner-wrapper .banner img:first-of-type {
        display:none
    }
    .body-header .banner-wrapper .banner img:nth-child(2) {
        display:block
    }
    .body-header .banner-wrapper .nav-container {
        display:none
    }
    .body-header .banner-wrapper .mobile-nav-container {
        display:block
    }
    .body-header .banner-wrapper .slogan-container {
        padding-top:11.7vw
    }
}
.body-footer {
    background-color:#ffffff;
    color:#ddd;
    padding:20px;
}
.body-footer .service {
    position:fixed;
    z-index:999;
    right:0;
    top:50%;
    margin-top:-150px;
    box-shadow:0 0 3px 0 rgba(0, 0, 0, .1)
}
@media screen and (min-width:0px) {
    .body-footer .service {
        margin-top:0;
        transform:translateY(-50%);
        /*display: none;*/
    }
}
.body-footer .service>a, .body-footer .service>span {
    display:block;
    position:relative;
    width:70px;
    height:80px;
    padding-top:20px;
    background-color:#00c568;
    border-bottom:1px solid #fff;
    text-align:center;
    color:#fff;
    text-shadow:1px 1px 1px rgba(0, 0, 0, .05);
    transition:all .15s ease-in;
    text-decoration:none;
}

@media screen and (min-width:0px) {
    .body-footer .service>a, .body-footer .service>span {
        background-color:#00c568;
        border-bottom:1px solid hsla(0, 0%, 100%, .7)
    }
}
.body-footer .service>a#go-top, .body-footer .service>span#go-top {
    padding:0;
    height:70px;
    *padding-top:20px;
    *height:40px
}
.body-footer .service>a:last-of-type, .body-footer .service>span:last-of-type {
    border-bottom:none
}
.body-footer .service>a>p, .body-footer .service>span>p {
    transition:all .15s ease-in
}
.body-footer .service>a>p .iconfont, .body-footer .service>span>p .iconfont {
    font-size:30px
}
.body-footer .service>a>p span, .body-footer .service>span>p span {
    display:block;
    font-size:12px
}
.body-footer .service>a>.number, .body-footer .service>span>.number {
    display:none;
    position:absolute;
    right:70px;
    top:28%;
    *top:14%;
    padding:10px 15px;
    background-color:#000;
    border-radius:4px;
    white-space:nowrap;
    text-align:right;
    font-size:20px;
    opacity:0;
    transform:translate(100%, -50%) scale(0);
    transform-origin:10% 50%;
    transition:all .15s ease-in
}
@media screen and (min-width:0px) {
    .body-footer .service>a>.number, .body-footer .service>span>.number {
        display:block;
        top:50%;
        background-color:rgba(0, 0, 0, .75)
    }
}
.body-footer .service>a>.number:after, .body-footer .service>span>.number:after {
    content:"";
    position:absolute;
    width:0;
    height:0;
    border:7px solid rgba(0, 0, 0, .75);
    border-left-color:transparent;
    border-bottom-color:transparent;
    transform:rotate(45deg) translateY(-10px);
    right:0;
    top:50%
}
.body-footer .service>a>.wechat-container, .body-footer .service>span>.wechat-container {
    padding:10px;
    top:-110%;
    *top:-210%
}
@media screen and (min-width:0px) {
    .body-footer .service>a>.wechat-container, .body-footer .service>span>.wechat-container {
        top:50%
    }
}
.body-footer .service>a>.wechat-container>p, .body-footer .service>span>.wechat-container>p {
    text-align:center
}
.body-footer .service>a>.wechat-container .qrcode_sales, .body-footer .service>span>.wechat-container .qrcode_sales {
    width:256px
}
.body-footer .service>a:hover, .body-footer .service>span:hover {
    background-color:#00c568
}
.body-footer .service>a:hover>p, .body-footer .service>span:hover>p {
    transform:scale(1.1)
}
.body-footer .service>a:hover>.number, .body-footer .service>span:hover>.number {
    display:block;
    opacity:1;
    transform:translate(-6%, -50%) scale(1)
}
.body-footer .service>a:hover>.wechat-container, .body-footer .service>span:hover>.wechat-container {
    display:block
}
.body-footer>ul {
    margin:0 auto;
    width:1280px
}
.body-footer>ul>li {
    float:left;
    width:280px;
    line-height:1.5
}
.body-footer>ul>li:nth-child(2) {
    width:400px
}
.body-footer>ul>li .box {
    padding:110px 0 0 30px
}
.body-footer>ul>li .box .title {
    margin-bottom:15px;
    height:38px;
    line-height:38px;
    color:#fff;
    font-size:22px;
    font-weight:400
}
.body-footer>ul>li .qrcode {
    display:block;
    margin:50px auto;
    width:220px
}
.body-footer>ul>li .mobile-footer-content {
    display:none
}
.body-footer>ul>li a {
    color:#ddd
}
.body-footer>ul>li a:hover {
    text-decoration:underline
}
.body-footer .copyright {
    padding:0 0 10px;
    text-align:center;
    font-size:12px;
    color:#999;
    clear:both
}
.body-footer .copyright a {
    color:#999
}
.body-footer .copyright a:hover {
    text-decoration:underline
}
.body-footer #mobile-show .layer {
    width:100%;
    height:100%;
    position:fixed;
    top:0;
    background-color:rgba(0, 0, 0, .8);
    z-index:999
}
.body-footer #mobile-show .layer .qr-content {
    width:50%;
    height:50%;
    position:absolute;
    top:0;
    bottom:0;
    right:0;
    left:0;
    margin:auto
}
.body-footer #mobile-show .layer .qr-content p {
    margin-top:20px;
    margin-bottom:20px;
    text-align:center
}
.body-footer #mobile-show .layer .qr-content img {
    width:100%;
    position:absolute;
    top:0;
    bottom:0;
    right:0;
    left:0;
    margin:auto
}
.body-footer #mobile-show .layer .qr-content i {
    display:inline-block;
    width:25px;
    height:25px;
    font-size:25px;
    position:absolute;
    bottom:20px;
    right:0;
    left:0;
    margin:0 auto
}
.body-footer .wx_hide {
    display:none
}
.body-footer .wx_show {
    display:block
}
@media screen and (max-width:768px) {

    .body-footer ul {
        width:84vw
    }
    .body-footer ul li {
        width:67%;
        font-size:3vw
    }
    .body-footer ul li:first-child, .body-footer ul li:nth-child(3) {
        display:none
    }
    .body-footer ul li:nth-child(2) {
        width:65%;
        margin-right:2%
    }
    .body-footer ul li:last-of-type {
        width:33%
    }
    .body-footer ul li:last-of-type .qrcode {
        margin:8vw auto;
        width:100%
    }
    .body-footer ul li .mobile-footer-content {
        display:block
    }
    .body-footer ul li .box {
        padding:7vw 0
    }
    .body-footer ul li .box .title {
        margin-bottom:4vw;
        height:auto;
        font-size:4.25vw;
        line-height:1.4
    }
    .body-footer ul li .box>p {
        margin-bottom:.8vw
    }
    .body-footer .copyright {
        position:relative;
        margin:0 auto;
        width:84vw;
        padding-top:3vw;
        font-size:2.9vw
    }
    .body-footer .copyright:before {
        content:"";
        position:absolute;
        left:0;
        right:0;
        top:0;
        height:1px;
        background-color:#575757;
        transform:scaleY(.5)
    }
    .body-footer .copyright a {
        display:block
    }

    html.mobile .body-footer {
        background-color:#ffffff;
        color:#ddd;
        /*padding:20px;*/
    }
    html.mobile .body-footer .service {
        position:fixed;
        z-index:999;
        right:0;
        top:80%;
        margin-top:-150px;
        box-shadow:0 0 3px 0 rgba(0, 0, 0, .1)
    }
    html.mobile .body-footer .service>a, .body-footer .service>span {
        display:block;
        position:relative; 
        *height:40px;
        padding-top:0px;
        background-color:#00c568;
        border-bottom:1px solid #fff;
        text-align:center;
        color:#fff;
        text-shadow:1px 1px 1px rgba(0, 0, 0, .05);
        transition:all .15s ease-in
    }

}
@media screen and (max-width:768px) {
    body {
        min-width:320px
    }
}
