nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 80px;
    z-index: 1000;
}

nav.white {
    background-color: #fff;
    box-shadow: 0 3px 10px #00000020;
}

nav .center-area {
    height: 100%;
}

.nav-title {
    flex: auto;
    margin-left: 26px;
    color: #fff;
    font-size: 16px;
}

nav.white .nav-title {
    color: #666;
}

.nav-logo {
    width: 130px;
    height: 42px;
    background-image: url("../image/nav/logo.png");
    background-size: cover;
}

nav.white .nav-logo {
    background-image: url("../image/nav/logo1.png");
}

.nav-tel {
    padding-left: 28px;
    height: 18px;
    line-height: 18px;
    font-size: 16px;
    color: #fff;
    background-image: url("../image/nav/tel.png");
    background-size: 18px 18px;
    background-position: 0 0;
    background-repeat: no-repeat;
    margin-right: 24px;
}

nav.white .nav-tel {
    color: #666;
    background-image: url("../image/nav/tel1.png");
}

.nav-btn-contact {
    width: 158px;
    height: 48px;
    border: 1px solid #fff;
    border-radius: 6px;
    text-align: center;
    line-height: 48px;
    font-size: 18px;
    color: #fff;
}

.nav-btn-contact:hover {
    background-color: #00000020;
}

nav.white .nav-btn-contact {
    border: 1px solid #FF6727;
    background-color: #FF6727;
}

nav.white .nav-btn-contact:hover {
    border: 1px solid #fc5d19;
    background-color: #fc5d19;
}

.nav-qq {
    padding-left: 25px;
    height: 18px;
    line-height: 18px;
    font-size: 16px;
    color: #fff;
    background-image: url("../image/nav/qq.png");
    background-size: 15px 18px;
    background-position: 0 0;
    background-repeat: no-repeat;
    margin-right: 40px;
}

nav.white .nav-qq {
    color: #666;
    background-image: url("../image/nav/qq1.png");
}