﻿@charset "utf-8";



.gb-nav.show,

.gb-header.show {

    top: 0;

    opacity: 1;

    -webkit-opacity: 1;

    -moz-opacity: 1;

}



.header {

    height: 110px;

}



.gb-nav,

.gb-header {

    top: -98px;

    -webkit-transition: all 0.5s;

    -moz-transition: all 0.5s;

    -o-transition: all 0.5s;

    transition: all 0.5s;

    opacity: 0;

    -webkit-opacity: 0;

    -moz-opacity: 0;

}



.gb-header,

.gb-nav {

    height: 98px;

    background: transparent none;

    position: fixed;

    left: 0;

    right: 0;

    z-index: 8;

}



.container {

    width: 1200px;

    margin: 0 auto;

}



.header .logo,

.gb-nav .logo {

    float: left;

    display: inline;

    margin-top: 5px;

}



.header .nav {

    float: right;

    display: inline;

    margin-top: 36px;

}



.header .nav li {

    float: left;

    display: inline;

    margin-left: 30px;

    font-size: 14px;

}



.header .nav li a {

    display: block;

    height: 24px;

    line-height: 24px;

    overflow: hidden;

}



.header .nav li span {

    font-size: 15px;

    color: #fff;

    display: block;

    transition: all 0.3s ease-in-out 0s;

}



.header .nav li span.s2 {

    color: #fff;

    font-weight: bold;

}



.header .nav li a:hover .s1,

.header .nav li.selected a .s1 {

    margin-top: -24px;



}



.first {

    text-align: center;

    background-image: url(../image/bg01.jpg);

    background-repeat: no-repeat;

    background-position: center;

    background-size: cover;

}



.first .tit01 img {

    opacity: 0;

    -webkit-transform: translateX(-100px);

}



.first .tit02 img {

    opacity: 0;

    -webkit-transform: translateX(-100px);

}



.first .tit03 img {

    opacity: 0;

    -webkit-transform: translateX(-100px);

}



.first.current .tit01 img {

    opacity: 1;

    transition: all 1s ease-out 0.3s;

    -webkit-transform: translateX(0);

}



.first.current .tit02 img {

    opacity: 1;

    transition: all 1s ease-out 0.6s;

    -webkit-transform: translateX(0);

}



.first.current .tit03 img {

    opacity: 1;

    transition: all 1s ease-out 0.9s;

    -webkit-transform: translateX(0);

}



.first .tit02 {

    margin-top: 60px;

    margin-bottom: 30px;

}



.second {

    background-image: url(../image/bg02.jpg);

    background-repeat: no-repeat;

    background-position: center;

    background-size: cover;

}



/*.second li {

    width: 16.66%;

    float: left;

    display: inline;

    text-align: center;

    color: #fff;

    height: 100%;

    position: relative;

    -webkit-transition: all 1s;

    -moz-transition: all 1s;

    -o-transition: all 1s;

    transition: all 1s;

    opacity: 0;

    -webkit-opacity: 0;

    -moz-opacity: 0;

}



.second li.l1 {

    -webkit-transform: translate3d(-600px, 0, 0);

    -ms-transform: translate3d(-600px, 0, 0);

    transform: translate3d(-600px, 0, 0);

}



.second li.l2 {

    -webkit-transform: translate3d(-300px, 0, 0);

    -ms-transform: translate3d(-300px, 0, 0);

    transform: translate3d(-300px, 0, 0);

}



.second li.l3 {

    -webkit-transform: translate3d(300px, 0, 0);

    -ms-transform: translate3d(300px, 0, 0);

    transform: translate3d(300px, 0, 0);

}



.second li.l4 {

    -webkit-transform: translate3d(600px, 0, 0);

    -ms-transform: translate3d(600px, 0, 0);

    transform: translate3d(600px, 0, 0);

}



.second.active li {

    -webkit-transform: translate3d(0, 0, 0);

    -ms-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

    opacity: 1;

    -webkit-opacity: 1;

    -moz-opacity: 1;

}



.second li a {

    font-size: 16px;

    line-height: 4;

    color: #fff;

    text-decoration: none;

}



.second li p.desc {

    height: 100px;

}



.second li p {

    margin-top: 30px;

    line-height: 24px;

}



.second li.selected .bg {

    height: 100%;

}



.second li .bg {

    position: absolute;

    left: 0;

    right: 0;

    bottom: 0;

    background: #9a02e0;

    height: 0;

    -webkit-transition: all 0.5s;

    -moz-transition: all 0.5s;

    -o-transition: all 0.5s;

    transition: all 0.5s;

}



.second li.l2 .bg {

    background-color: #acd146;

}



.second li.l3 .bg {

    background-color: #04afa6;

}



.second li.l4 .bg {

    background-color: #f8c200;

}



.second li .wrap {

    position: absolute;

    left: 30px;

    right: 30px;

    top: 50%;

    margin-top: -110px;

}



.second ul {

    height: 100%;

}



.second .container {

    height: 100%;

}*/



.three {

    background-image: url(../image/bg03.jpg);

    background-repeat: no-repeat;

    background-position: center;

    background-size: cover;

}



.m3_box {

    position: relative;

    cursor: pointer;

    float: left;

    width: 599px;

    height: 330px;

}



.m3_box .bg {

    z-index: 999;

    width: 100%;

    height: 100%;

    position: absolute;

    left: 0;

    right: 0;

}



.m3_box .bg {

    left: 0;

    top: 0;

    position: absolute;

    width: 100%;

    height: 100%;

    background-color: rgba(0, 0, 0, 0.5);

}







.m3_box1 {

    margin-right: 1px;

    margin-bottom: 1px;

}



.m3_box2 {

    margin-bottom: 1px;

}



.m3_box3 {

    margin-right: 1px;

}



.three .m3_box1 {

    opacity: 0;

    -webkit-transform: translateX(-100px);

    z-index: 9;

}



.three.current .m3_box1 {

    opacity: 1;

    transition: all 0.4s linear 0.3s;

    -webkit-transform: translateX(0);

}



.three .m3_box2 {

    opacity: 0;

    -webkit-transform: translateX(-100px);

    z-index: 8;

}



.three.current .m3_box2 {

    opacity: 1;

    transition: all 0.4s linear 0.6s;

    -webkit-transform: translateX(0);

}



.three .m3_box3 {

    opacity: 0;

    -webkit-transform: translateX(100px);

    z-index: 6;

}



.three.current .m3_box3 {

    opacity: 1;

    transition: all 0.4s linear 1.2s;

    -webkit-transform: translateX(0);

}



.three .m3_box4 {

    opacity: 0;

    -webkit-transform: translateY(-100px);

    z-index: 7;

}



.three.current .m3_box4 {

    opacity: 1;

    transition: all 0.4s linear 0.9s;

    -webkit-transform: translateY(0);

}



.m3_box.selected .bg {

    background-color: #024b93;

    z-index: 9999999;

}



.three .til {

    -webkit-transition: all 0.3s ease;

    transition: all 0.3s ease;

    left: 250px;

    top: 100px;

    width: 200px;

    text-align: center;

    z-index: 99999999999999;

    position: absolute;

}



.three .img {

    position: absolute;

    left: 170px;

    top: 100px;

    width: 200px;

    z-index: 99999999999999;

}



.three .info {

    -webkit-transition: all 0.3s ease;

    transition: all 0.3s ease;

    display: none;

    position: absolute;

    top: 100px;

    left: 0;

    width: 500px;

    text-align: center;

    color: #fff;

    font-size: 14px;

    line-height: 2;

    color: #fff;

    z-index: 99999999999;

    padding: 30px 50px;

}



.three .til h2 {

    font-size: 18px;

    color: #fff;

    font-weight: normal;

    line-height: 2;

}



.three .til span {

    width: 50px;

    height: 2px;

    background: #fff;

    display: inline-block;

    margin: 0px auto;

}



.three .til p {

    text-transform: uppercase;

    font-size: 12px;

    color: #fff;

    line-height: 3;

}



.m3_box.selected .img {

    display: none;

}



.m3_box.selected .til {
    width: 100%;
    text-align: center;
    left: 0px;
    top: 20px;
    width: 100%;
    text-align: center;
    z-index: 99999999999999;
    position: absolute;
}


.m3_box.selected .info {

    display: block;

}























.four {

    background-image: url(../image/bg04.jpg);

    background-repeat: no-repeat;

    background-position: center;

    background-size: cover;

}



.four h2 {

    font-size: 30px;

    color: #fff;

    line-height: 1.5;

    text-transform: uppercase;

    font-weight: normal;

}



.four h3 {

    font-size: 24px;

    color: #fff;

    line-height: 1.5;

    text-transform: uppercase;

    font-weight: normal;

}



.four ul {

    margin-top: 20px;

}



.four ul li {

    font-size: 14px;

    color: #fff;

    line-height: 3;

    padding-left: 35px;

}



.four ul li.li1 {

    background: url(../image/li1.png) left center no-repeat;

}



.four ul li.li2 {

    background: url(../image/li2.png) 2px center no-repeat;

}



.four ul li.li3 {

    background: url(../image/li3.png) 2px center no-repeat;

}



.four ul li.li4 {

    background: url(../image/li4.png) 2px center no-repeat;

}



.four .left.fl {

    opacity: 0;

    -webkit-transform: translateX(-100px);

}



.four.current .left.fl {

    opacity: 1;

    transition: all 1s ease-out 0.3s;

    -webkit-transform: translateX(0);

}



.four .right.fr {

    opacity: 0;

    -webkit-transform: translateX(100px);

}



.four.current .right.fr {

    opacity: 1;

    transition: all 1s ease-out 0.3s;

    -webkit-transform: translateX(0);

}



.message {

    margin-top: 20px;

}



.input_box {

    width: 450px;

    font-size: 14px;

    color: #9c9c9c;

    line-height: 32px;

    border: 1px solid #eeeeee;

    border-radius: 5px;

    padding: 4px 10px;

    margin-bottom: 20px;

    background-color: rgba(245, 245, 245, 0.8);

}



.input_box input {

    font-size: 14px;

    border: none;

    padding: 0;

    margin: 0;

    width: 98%;

    display: block;

    margin-left: 2%;

    height: 32px;

    line-height: 32px;

    outline: none;

    background: none;

}



.textarea {

    border: none;

    font-size: 14px;

    outline: none;

    border-radius: 5px;

    height: 100px;

    padding: 10px;

    width: 430px;

    background: none;

    font-family: "Microsoft YaHei";

}



.submit {

    border-radius: 5px;

    width: 220px;

    height: 44px;

    line-height: 44px;

    border: 1px solid #024b93;

    background-color: #024b93;

    text-align: center;

    font-size: 14px;

    color: #fff;

}







.footer {

    width: 100%;

    min-width: 1200px;

    background-color: rgba(0, 0, 0, 0.5);

    color: #fff;

    font-size: 13px;

    position: absolute;

    bottom: 0;

    left: 0;

}



.copy {

    height: 35px;

    line-height: 35px;

}



.footer .left {

    float: left;

}



.footer .right {

    float: right;

}



.footer .icon {

    margin-top: -2px;

    margin-right: 5px;

}



img.icon {

    vertical-align: middle;

}



.footer a {

    color: #fff;

}



.banner {

    width: 100%;

    height: 250px;

}



.banner img {

    width: 100%;

    height: 250px;

}



.local {

    width: 100%;

    height: 120px;

    position: relative;

}



.local-left-bg {

    width: 50%;

    position: absolute;

    left: 0px;

    height: 90px;

    background: #014e86;

    z-index: 1

}



.local-right-bg {

    width: 50%;

    position: absolute;

    right: 0px;

    height: 90px;

    background: #ebebeb;

    z-index: 1

}



.local-all {

    width: 100%;


    position: absolute;

    z-index: 3;

}



.local-all-wrap {

    width: 1100px;

    height: 90px;

    margin: 0 auto;

    background: #ebebeb;

}



.l-a-w-left {

    width: 230px;

    height: 90px;

    background: #014e86;

}



.l-a-w-left span {

    font-size: 22px;

    color: #FFF;

    display: block;

}



.l-a-w-right {

    width: 870px;

    height: 100px;

}



.l-a-w-right dl dt {
    text-indent: 2em;
    height: 28px;
    background: #024b93;
    /* text-align: center; */
    line-height: 28px;
    margin-top: 32px;
    margin-left: 30px;
    padding-right: 20px;
    float: left;
}


.l-a-w-right dl dt a {
    text-decoration: underline;
    color: #FFF;

}



.all {

    width: 1200px;

    height: auto;

    margin: 0 auto;

}



.main {

    margin-top: 50px;

    padding-bottom: 20px;

}



.mt {

    text-align: center;

}



.mt span {

    font-size: 22px;

    font-family: 微软雅黑;

    padding-left: 15px;

    padding-right: 15px;

    background: rgb(255, 255, 255);

}


.page-show {
    font-size: 16px;
    margin-top: 50px;
    line-height: 2;
}





.news {

    margin-top: 50px;

}



.news dl {

    padding-bottom: 25px;

    height: 159px;

    margin-bottom: 25px;

    border-bottom: 1px solid #ddd;

    clear: both;

    margin-top: 20px;

}



.news dl dt {

    width: 207px;

    height: 160px;

    float: left;

}



.news dl dt img {

    width: 207px;

    height: 160px;

    vertical-align: top;

}



.news dl dd {

    width: 840px;

    float: left;

    margin-left: 40px;

    text-align: left;

    font-size: 12px;

    color: #797979;

    line-height: 185%;

}



.news dl dd .title {

    width: 100%;

    height: 33px;

    line-height: 33px;

    white-space: normal;

    overflow: hidden;

    text-overflow: ellipsis;

}



.news dl dd .title a {

    font-size: 16px;

    color: #024b93;

    font-weight: bold;

}



.news dl dd .time {

    width: 100%;

    height: 20px;

    line-height: 20px;

    font-size: 12px;

    color: #555;

}



.news dl dd .des {

    width: 100%;

    height: 65px;

    overflow: hidden;

    margin-top: 7px;

}



.news dl dd .more {

    width: 100%;

    margin-top: 15px;

}



.news dl dd .more a {

    display: block;

    width: 92px;

    height: 24px;

    background: #4A4A4A;

    color: #FFF;

    text-align: center;

    line-height: 24px;

}



.news dl dd .more a:hover {

    background: #E95D2B;

}



.con-tt {

    margin-bottom: 20px;

    margin-top: 30px;

}



.con-tt h2 {

    text-align: center;

    margin-bottom: 10px;

    color: #666;

}



.con-tt p {

    text-align: center;

    font-size: 13px;

    color: #666;

}



.con-tt p span {

    margin-right: 20px;

}



.page {

    margin-top: 20px;

    margin-bottom: 20px;

    text-align: center;

    font-size: 13px;

}



.page a {

    border: 1px solid #ccc;

    display: inline;

    padding: 3px 10px 3px 10px;

    margin-right: 5px;

    border-radius: 3px;

    -moz-border-radius: 3px;

    -webkit-border-radius: 3px;

    cursor: pointer;

    background: #fff;

    text-decoration: none;

    color: #999;

}



.page a:hover {

    border: 1px solid #FF6600;

    background-color: #FF6600;

    color: #fff;

}



.page span {

    border: 1px solid #FF6600;

    display: inline;

    padding: 3px 10px 3px 10px;

    margin-right: 5px;

    border-radius: 3px;

    -moz-border-radius: 3px;

    -webkit-border-radius: 3px;

    background: #FFEEE5;

    color: #FF6600;

}



.products {

    margin-top: 50px;

}



.products ul li {

    width: 230px;



    margin: 22px;

    float: left;

    text-align: center;

}



.products ul li img {

    width: 228px;

  

    border: 1px solid #CCC;

}



.products ul li p {

    height: 40px;

    line-height: 20px;

    text-align: center;

    font-size: 13px;

    margin-top: 5px;

}



.mt {

    text-align: center;

}



.mt span {

    font-size: 22px;

    background: #FFF;

    padding-left: 15px;

    padding-right: 15px;

}



.con-tt {

    margin-bottom: 20px;

    margin-top: 30px;

}



.con-tt h2 {

    text-align: center;

    margin-bottom: 10px;

    color: #666;

}



.con-tt p {

    text-align: center;

    font-size: 13px;

    color: #666;

}



.con-tt p span {

    margin-right: 20px;

}