body {
    margin     : 0 auto;
    padding    : 0;
    background : #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-size  : 14px;
    line-height: 1.5;
}

/*滚动条样式*/
::-webkit-scrollbar {
    width : 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    /* background:#f2ddc6; */
}

::-webkit-scrollbar-thumb {
    /* background:#e61c24; */
    /* height:60px; */
}

::-webkit-scrollbar-thumb:window-inactive {
    background: #e61c24
}

::-webkit-scrollbar-thumb:vertical:hover {
    background: #e61c24
}

div {
    box-sizing: border-box;
}

ul {
    margin : 0;
    padding: 0;
}

ul li {
    list-style: none;
}

img {
    border   : 0;
    max-width: 100%;
}

a img {
    border: 0;
}

a {
    text-decoration: none;
}

div {
    box-sizing: border-box;
}

.clear {
    clear: both;
}

.pull-left {
    float: left;
}

.pull-right {
    float: right;
}

.container {
    width : 1200px;
    margin: 0 auto;
}

.header {
    position: relative;
    height  : 805px;
}

.header .top {
    width      : 1200px;
    position   : absolute;
    left       : 50%;
    top        : 0;
    margin-left: -600px;
    z-index    : 99999;
    height     : 145px;
}

.header .top .logo {
    margin-left: 35px;
    margin-top : 30px;
    float      : left;
}

.header .top .nav {
    margin-top  : 50px;
    float       : right;
    margin-right: 15px;
}

.header .top .nav ul li {
    float    : left;
    padding  : 15px 15px 50px;
    font-size: 20px;
    color    : #ffffff;
    position : relative;
}

.header .top .nav ul li a {
    color: #ffffff;
}


.header .top .nav ul li .children {
    position               : absolute;
    top                    : 92px;
    left                   : 0;
    z-index                : 999999;
    display                : none;
    float                  : left;
    padding                : 5px 0;
    margin                 : 2px 0 0;
    font-size              : 14px;
    text-align             : left;
    list-style             : none;
    width                  : 150%;
    background-color       : #fff;
    -webkit-background-clip: padding-box;
    background-clip        : padding-box;
    background             : rgba(0, 0, 0, 0.5);
    border                 : 1px solid #ccc;
    border                 : 1px solid rgba(0, 0, 0, .15);
    border-radius          : 4px;
    -webkit-box-shadow     : 0 6px 12px rgba(0, 0, 0, .175);
    box-shadow             : 0 6px 12px rgba(0, 0, 0, .175);
}

.header .top .nav ul li .children li {
    height       : 60px;
    padding      : 15px;
    border-bottom: 1px solid #e7e7e7;
    width        : 100%;
    box-sizing   : border-box;

}

.header .top .nav ul li .children li:last-child {
    border-bottom: none;
}

.header .top .nav ul li:hover ul {
    display: block;
}

.header .banner ul li {
    text-align: center;
    height    : 805px;
    display   : none;
    position  : absolute;
    top       : 0;
    left      : 0;
    z-index   : 11111;
}

.header .banner ul li.on {
    display: block;
}

.header .banner_btn {
    width      : 1200px;
    position   : absolute;
    left       : 50%;
    top        : 566px;
    margin-left: -600px;
    z-index    : 99999;
}

.header .banner_btn .show {
    width        : 250px;
    height       : 145px;
    background   : #000000;
    border-radius: 8px 0 0 8px;
    padding-top  : 35px;
    padding-left : 20px;
}

.header .banner_btn .show .number {
    font-size  : 52px;
    line-height: 52px;
    color      : #ffffff;
    float      : left;
}

.header .banner_btn .show .btn {
    float     : right;
    margin-top: 70px;
}

.header .banner_btn .show .btn div {
    float       : left;
    margin-right: 30px;
    cursor      : pointer;
}

.header .banner_btn .more {
    margin-top   : 45px;
    font-size    : 12px;
    font-weight  : bold;
    padding      : 10px 15px;
    border       : 1px solid #b3b3b3;
    border-radius: 20px;
    text-align   : center;
    width        : 240px;
    margin-left  : 80px;
}

.header .banner_btn .more a {
    color: #1173ba;
}

.header .header-nav {
    position          : fixed;
    right             : 0;
    left              : 0;
    z-index           : 999999;
    -webkit-transition: all 0.5s;
    transition        : all 0.5s;
    display           : block;
    min-height        : 145px;
    background        : rgba(0, 0, 0, 0.5);
}

.x-header {
    width        : 1200px;
    background   : #ffffff;
    max-width    : 1200px;
    margin       : auto;
    margin-bottom: 20px;
}

.x-header .logo {
    margin-top: 15px;
    width     : 25%;
}

.x-header .logo img {
    max-width: 100%;
    height   : auto;
    height   : 100%;
}

.x-header .meeu {
    margin-top: 15px;
    width     : 58.33333333%;
}

.x-header .meeu ul li {
    line-height: 50px;
    height     : 50px;
    text-align : center;
    float      : left;
    position   : relative;
}

.x-header .meeu ul li a {
    display    : block;
    line-height: 50px;
    color      : #333;
    height     : 50px;
    font-size  : 16px;
    padding    : 0 23px 26px;
}

.x-header .meeu ul li a:hover {
    color          : #00a2ff;
    text-decoration: none;
    background     : none;
}

.x-header .meeu ul li.active a {
    color: #00a2ff;
}

.x-header .meeu ul li .children {
    position               : absolute;
    top                    : 72px;
    left                   : 0;
    z-index                : 999999;
    display                : none;
    float                  : left;
    padding                : 5px 0;
    margin                 : 2px 0 0;
    font-size              : 14px;
    text-align             : left;
    list-style             : none;
    width                  : 150%;
    background-color       : #fff;
    -webkit-background-clip: padding-box;
    background-clip        : padding-box;
    border                 : 1px solid #ccc;
    border                 : 1px solid rgba(0, 0, 0, .15);
    border-radius          : 4px;
    -webkit-box-shadow     : 0 6px 12px rgba(0, 0, 0, .175);
    box-shadow             : 0 6px 12px rgba(0, 0, 0, .175);
}

.x-header .meeu ul li:hover ul {
    display: block;
}

.pagebanner {
    position: relative;
    width   : 100%;
    overflow: hidden;
}

.banner_inner {
    width            : 100%;
    height           : 100%;
    animation        : imgZoomIn 2s ease 0s forwards;
    -webkit-animation: imgZoomIn 2s ease 0s forwards;
    -ms-animation    : imgZoomIn 2s ease 0s forwards;
}

.pagebanner img {
    display: block;
    width  : 100%;
}

.breadcrumb-box {
    height       : 50px;
    line-height  : 50px;
    position     : relative;
    padding      : 4px 0;
    margin-bottom: 30px;
}

.breadcrumb>li+li::before {
    content: ">";
    padding: 0 5px;
    color  : rgb(102, 102, 102);
}

.breadcrumb>li {
    display: inline-block;
}

.breadcrumb li a {
    color: #000;
}

.breadcrumb li a:hover {
    text-decoration: underline;
    color          : #000;
}

.breadcrumb li .fa {
    padding-right: 6px;
}

.lb {
    text-align: center;
}

.lb li {
    display      : inline-block;
    margin       : 0 10px;
    margin-bottom: 10px;
}

.lb li a {
    padding    : 10px 20px;
    color      : #4c4c4c;
    transition : .5s;
    font-size  : 14px;
    line-height: 14px;
    background : #f2f2f2;
    display    : inline-block;
}

.lb .cur {
    background: #469fd5;
}

.lb .cur a {
    color     : #fff !important;
    background: #469fd5 !important;
}

.lb li a:hover {
    color     : #fff !important;
    background: #469fd5;
}

.product {
    margin-top   : 20px;
    margin-bottom: 40px;
}

.product .name {
    font-size  : 38px;
    line-height: 200px;
    height     : 200px;
    text-align : center;
}

.product .product_rolling {
    position: relative;
    overflow: hidden;
}

.product .bd ul li {
    width     : 280px;
    float     : left;
    margin    : 10px 9px;
    box-sizing: border-box;
    height    : 276px;
}

.product .bd ul li .img {
    width   : 280px;
    height  : 200px;
    overflow: hidden;
}

.product .bd ul li img {
    width     : 280px;
    height    : 200px;
    transition: all 0.6s;
}

.product .bd ul li:hover img {
    transform : scale(1.1, 1.1);
    transition: all 0.6s ease-out;
}

.product .bd ul li .title {
    font-size  : 16px;
    color      : #000000;
    line-height: 30px;
    height     : 50px;
    overflow   : hidden;
    padding    : 10px;
}

.product .more {
    font-size                  : 24px;
    color                      : #333333;
    line-height                : 51px;
    height                     : 55px;
    width                      : 270px;
    /* background              : #6aa4c7; */
    border                     : 2px solid #9a9a9a;
    border-radius              : 5px;
    text-align                 : center;
    margin                     : 30px auto 0;
    -webkit-transform          : perspective(1px) translateZ(0);
    -moz-transform             : perspective(1px) translateZ(0);
    transform                  : perspective(1px) translateZ(0);
    -webkit-box-shadow         : 0 0 1px rgba(0, 0, 0, 0);
    -moz-box-shadow            : 0 0 1px rgba(0, 0, 0, 0);
    box-shadow                 : 0 0 1px rgba(0, 0, 0, 0);
    position                   : relative;
    -webkit-transition-property: color;
    -o-transition-property     : color;
    -moz-transition-property   : color;
    transition-property        : color;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration   : 0.3s;
    -o-transition-duration     : 0.3s;
    transition-duration        : 0.3s;

}


.product .more a {
    color     : #9a9a9a;
    transition: 0.3s;
}


.product .more::before {
    content                           : "";
    position                          : absolute;
    z-index                           : -1;
    top                               : 0;
    bottom                            : 0;
    left                              : 0;
    right                             : 0;
    background                        : #6aa4c7;
    -webkit-transform                 : scale(0);
    -moz-transform                    : scale(0);
    -ms-transform                     : scale(0);
    -o-transform                      : scale(0);
    transform                         : scale(0);
    -webkit-transition-property       : transform;
    -webkit-transition-property       : -webkit-transform;
    transition-property               : -webkit-transform;
    -o-transition-property            : -o-transform;
    -moz-transition-property          : transform, -moz-transform;
    transition-property               : transform;
    transition-property               : transform, -webkit-transform, -moz-transform, -o-transform;
    -webkit-transition-duration       : 0.3s;
    -moz-transition-duration          : 0.3s;
    -o-transition-duration            : 0.3s;
    transition-duration               : 0.3s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function   : ease-out;
    -o-transition-timing-function     : ease-out;
    transition-timing-function        : ease-out;
}

.product .more:hover:before {
    background       : #6aa4c7;
    -webkit-transform: scaleY(1);
    -moz-transform   : scaleY(1);
    -ms-transform    : scaleY(1);
    -o-transform     : scaleY(1);
    transform        : scaleY(1);
}

.product .more:hover {
    border: 2px solid #6aa4c7;
}

.product .more:hover a {
    color: #ffffff;
}

.about {
    background    : url('../images/about_bj.jpg') bottom center no-repeat;
    padding-top   : 80px;
    padding-bottom: 100px;
}

.about .name {
    font-size  : 38px;
    line-height: 40px;
    height     : 40px;
    color      : #333333;
    font-weight: bold;
    text-align : center;
}

.about .line {
    height    : 6px;
    text-align: center;
}

.about .en {
    font-size  : 38px;
    color      : #bdbdbd;
    font-weight: bold;
    text-align : center;
}

.about .content {
    margin-top: 20px;
    font-size : 16px;
    color     : #0869a3;
    text-align: center;
}

.about .more {
    width                      : 190px;
    height                     : 55px;
    line-height                : 55px;
    font-size                  : 20px;
    /* background              : #6aa4c7; */
    border                     : 2px solid #9a9a9a;
    border-radius              : 5px;
    text-align                 : center;
    margin                     : 90px auto 0;
    -webkit-transform          : perspective(1px) translateZ(0);
    -moz-transform             : perspective(1px) translateZ(0);
    transform                  : perspective(1px) translateZ(0);
    -webkit-box-shadow         : 0 0 1px rgba(0, 0, 0, 0);
    -moz-box-shadow            : 0 0 1px rgba(0, 0, 0, 0);
    box-shadow                 : 0 0 1px rgba(0, 0, 0, 0);
    position                   : relative;
    -webkit-transition-property: color;
    -o-transition-property     : color;
    -moz-transition-property   : color;
    transition-property        : color;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration   : 0.3s;
    -o-transition-duration     : 0.3s;
    transition-duration        : 0.3s;

}


.about .more a {
    color     : #9a9a9a;
    transition: 0.3s;
}


.about .more::before {
    content                           : "";
    position                          : absolute;
    z-index                           : -1;
    top                               : 0;
    bottom                            : 0;
    left                              : 0;
    right                             : 0;
    background                        : #6aa4c7;
    -webkit-transform                 : scale(0);
    -moz-transform                    : scale(0);
    -ms-transform                     : scale(0);
    -o-transform                      : scale(0);
    transform                         : scale(0);
    -webkit-transition-property       : transform;
    -webkit-transition-property       : -webkit-transform;
    transition-property               : -webkit-transform;
    -o-transition-property            : -o-transform;
    -moz-transition-property          : transform, -moz-transform;
    transition-property               : transform;
    transition-property               : transform, -webkit-transform, -moz-transform, -o-transform;
    -webkit-transition-duration       : 0.3s;
    -moz-transition-duration          : 0.3s;
    -o-transition-duration            : 0.3s;
    transition-duration               : 0.3s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function   : ease-out;
    -o-transition-timing-function     : ease-out;
    transition-timing-function        : ease-out;
}

.about .more:hover:before {
    background       : #6aa4c7;
    -webkit-transform: scaleY(1);
    -moz-transform   : scaleY(1);
    -ms-transform    : scaleY(1);
    -o-transform     : scaleY(1);
    transform        : scaleY(1);
}

.about .more:hover {
    border: 2px solid #6aa4c7;
}

.about .more:hover a {
    color: #ffffff;
}

.pageshow {
    background    : url('../images/pageshow_bj.jpg') top center no-repeat;
    padding-top   : 100px;
    padding-bottom: 100px;
}

.pageshow .left {
    width     : 550px;
    background: rgba(17, 115, 186, 0.7);
    float     : left;
    padding   : 55px 10px ;
}

.pageshow .right {
    width     : 650px;
    background: rgba(17, 115, 186, 0.7);
    float     : right;
    padding   : 55px 9px ;
}

.news {
    background    : #e1e0dc;
    padding-top   : 80px;
    padding-bottom: 55px;
}

.news_list {
    background: none;
}

.news .name {
    font-size  : 38px;
    color      : #b8b7b4;
    line-height: 40px;
    height     : 40px;
    text-align : center;
    font-weight: bold;
}

.news .en {
    font-size  : 37px;
    color      : #333333;
    line-height: 40px;
    height     : 40px;
    text-align : center;
    margin-top : -20px;
    font-weight: bold;
}

.news .list {
    margin-top: 100px;
}

.news_list .list {
    margin: 0;
}

.news_list .list ul li {
    margin: 20px 0;
}

.news_list .list ul li a {
    color         : #333;
    font-size     : 18px;
    line-height   : 18px;
    padding-bottom: 15px;
    display       : block;
    overflow      : hidden;
    text-overflow : ellipsis;
    white-space   : nowrap;
}

.news img {
    display           : inline-block;
    -moz-transition   : 0.3s;
    -webkit-transition: 0.3s;
    -ms-transition    : 0.3s;
    transition        : .3s;
}

.news .list ul li:hover img {
    transform        : scale(1.1);
    -ms-transform    : scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform     : scale(1.1);
    -moz-transform   : scale(1.1);
}

.news .list .left {
    float   : left;
    width   : 485px;
    overflow: hidden;
}

.news .list .right {
    float: right;
    width: 690px;
}

.news .list .right .title {
    font-size  : 20px;
    font-weight: bold;
    line-height: 35px;
    height     : 45px;
    overflow   : hidden;
    margin-top : 10px;
}

.news .list .right .title a {
    color: #666;
}

.news .list .right .title em {
    height       : 1px;
    width        : 0px;
    background   : #ddd;
    transition   : all .5s;
    display      : block;
    margin-bottom: 15px;
}

.news .list .right .title:hover a {
    color: #469fd5;
}

.news .list .right:hover em {
    width: 100%;
}

.news .list .right .date {
    padding-top: 10px;
    color      : #999;
    font-size  : 12px;
    line-height: 12px;
}

.news .list .right .desc {
    color      : #666;
    margin-top : 20px;
    line-height: 30px;
    height     : 90px;
    font-size  : 16px;
    overflow   : hidden;
}



.new_info_tit h1 {
    font-size    : 30px;
    margin-bottom: 10px;
}

.new_info_tit .time {
    font-size    : 14px;
    color        : #888;
    line-height  : 30px;
    border-bottom: 1px solid #eee;
    margin-bottom: 25px;
}

.text-center {
    text-align: center;
}

.info-content {
    padding: 40px 20px;
}



.page_info {
    width      : 100%;
    text-align : center;
    line-height: 40px;
    margin     : 40px auto 40px;
}

.page {
    display      : inline-block;
    padding-left : 0;
    border-radius: 40px;
}

.page>li {
    display: inline;
}

.page>li>a {
    color: #686868;
}

.page>.current>a,
.page>.current>span {
    z-index         : 2;
    color           : #ffffff;
    cursor          : default;
    background-color: #00a2ff;
    border-color    : #00a2ff;
}

.page>li>a,
.page>li>span {
    position        : relative;
    float           : left;
    padding         : 8px 15px;
    margin-left     : -1px;
    line-height     : 1.428571429;
    text-decoration : none;
    background-color: #ffffff;
    border          : 1px solid #e5e5e5;
}



.footer {
    background: #469fd5;
    min-width : 1200px;
}

.footer .container {
    padding: 60px 20px 40px;
}

.footer .left {
    float: left;
    width: 640px;
}

.footer .left .line {
    width     : 88px;
    height    : 2px;
    background: #22eab8;
    margin-top: 10px;
}

.footer .left .desc {
    margin-top : 10px;
    font-size  : 18px;
    line-height: 25px;
    height     : 125px;
    color      : #000000;
}

.footer .left .link {
    margin-top: 20px;

}

.footer .left .link ul li {
    margin-right: 15px;
    float       : left;
}

.footer .left .link ul li.ewm {
    position: relative;
}

.footer .left .link ul li .ewm-box {
    position          : absolute;
    z-index           : 1;
    padding           : 5px;
    background        : #292e39;
    width             : 110px;
    right             : -35px;
    bottom            : 60px;
    opacity           : 0;
    /* visibility     : hidden; */
    -webkit-transform : translateY(0);
    transform         : translateY(0);
    -webkit-transition: all .7s;
    transition        : all .7s;
}

.footer .left .link ul li.ewm .ewm-box::after {
    content         : '';
    position        : absolute;
    right           : 50px;
    bottom          : -10px;
    width           : 0;
    height          : 0;
    line-height     : 0;
    font-size       : 0;
    overflow        : hidden;
    border-width    : 5px;
    border-top-width: 5px;
    cursor          : pointer;
    border-style    : solid dashed dashed dashed;
    border-top-style: dashed;
    border-color    : #292e39 transparent transparent transparent;
}

.footer .left .link ul li.ewm:hover .ewm-box {
    opacity   : 1;
    visibility: visible;
}

.footer .left .link ul li.tel {
    position: relative;
}

.footer .left .link ul li .wz {
    display       : inline-block;
    line-height   : 57px;
    font-size     : 14px;
    color         : #fff;
    vertical-align: middle;
    padding-left  : 10px;
}

.footer .left .link ul li .wz {
    position          : absolute;
    z-index           : 1;
    padding           : 5px;
    background        : #292e39;
    width             : 130px;
    right             : -50px;
    bottom            : 60px;
    opacity           : 0;
    /* visibility     : hidden; */
    text-align        : center;
    -webkit-transform : translateY(0);
    transform         : translateY(0);
    -webkit-transition: all .7s;
    transition        : all .7s;
}

.footer .left .link ul li .wz::after {
    content         : '';
    position        : absolute;
    right           : 65px;
    bottom          : -10px;
    width           : 0;
    height          : 0;
    line-height     : 0;
    font-size       : 0;
    overflow        : hidden;
    border-width    : 5px;
    border-top-width: 5px;
    cursor          : pointer;
    border-style    : solid dashed dashed dashed;
    border-top-style: dashed;
    border-color    : #292e39 transparent transparent transparent;
}

.footer .left .link ul li.tel:hover .wz {
    opacity   : 1;
    visibility: visible;
}

.footer .right {
    float: right;
    width: 265px;
    color: #ffffff;
}

.footer .right .name {
    font-size  : 16px;
    font-weight: bold;
    line-height: 30px;
    height     : 30px;
}

.footer .right .line {
    background: #22eab8;
    width     : 40px;
    height    : 2px;
    margin    : 20px 0;
}

.footer .right .row {
    padding      : 10px;
    background   : rgba(255, 255, 255, 0.2);
    margin-bottom: 15px;
}

.footer .right .row .rn {
    height     : 25px;
    line-height: 25px;
}

.footer .right .row .rn img {
    vertical-align: middle;
    margin-right  : 5px;
}

.footer .right .row .con {
    margin-top: 5px;
}

.lastnext {
    width    : 1170px;
    font-size: 16px;
    margin   : 20px auto;
}

.lastnext .last {
    width      : 45%;
    float      : left;
    text-align : left;
    line-height: 50px;
    height     : 50px;
    overflow   : hidden;
}

.lastnext .next {
    width      : 45%;
    float      : right;
    text-align : left;
    line-height: 50px;
    height     : 50px;
    overflow   : hidden;
}

.lastnext a {
    color: #469fd5;
}