﻿/* top S */
.myscroll { height: 585px; margin: 0 auto;  line-height: 26px; font-size: 12px; overflow: hidden;}
.myscroll li {  overflow: hidden;display: inline-block;    width: 276px;margin: 10px;}
.myscroll img { border: 0 none;width: 100%;height: 200px;}
.myscroll h4{text-align: center;}

.yqlj li {
  float: left;
    margin: 0 auto;
    padding: 0 10px;
}
.yqlj ul {
    width: 1200px;
    margin: 0 auto;
}
.yqlj {
        background-color: #211f20;
    color: white;
    text-align: center;
    height: 30px;
    line-height: 30px;
}

.body_youshibg {
    width: 100%;
    background: url(../images/body_youshititlebg.jpg);
    margin: 0 auto;
}
.body_youshi {
    width: 1180px;
    height: 160px;
    background: url(../images/body_youshititle.jpg);
    margin: 0 auto;
}
.body_youshititle {
    width: 1180px;
    height: 55px;
    font-size: 40px;
    color: #01408f;
    padding-top: 45px;
    font-weight: bold;
    text-align: center;
}
.body_youshititle span {
    color: #ee9a14;
    font-weight: bold;
    text-align: center;
}
.body_youshititle02 {
    width: 1180px;
    height: 60px;
    font-size: 24px;
    color: #01408f;
    padding-top: 0px;
    text-align: center;
}
.body_youshi01 {
    width: 1180px;
    height: 380px;
    background: url(../images/body_youshi01.jpg);
    margin: 0 auto;
}
.body_youshileft {
    width: 590px;
    height: 380px;
    background: url(../images/body_youshileft.jpg);
    float: left;
}
.body_youshi01title {
    width: 430px;
    height: 60px;
    font-size: 23px;
    color: #000000;
    padding-top: 100px;
    padding-left: 160px;
    font-weight: bold;
    text-align: left;
}
.body_youshi01title span {
    font-size: 23px;
    color: #cb0101;
    font-weight: bold;
    text-align: left;
}
.body_youshi022title {
    width: 417px;
    height: 215px;
    font-size: 15px;
    color: #666666;
    padding-top: 0px;
    padding-left: 173px;
    line-height: 30px;
    text-align: left;
}
.body_youshiright {
    width: 590px;
    height: 380px;
    background: url(../images/body_youshitu01.jpg);
    float: left;
}
.body_youshi02 {
    width: 1180px;
    height: 430px;
    background: url(../images/body_youshi02.jpg);
    margin: 0 auto;
}
.body_youshi02left {
    width: 565px;
    height: 430px;
    background: url(../images/body_youshitu02.jpg);
    float: left;
}
.body_youshi02right {
    width: 615px;
    height: 430px;
    background: url(../images/body_youshi02right.jpg);
    float: left;
}
.body_youshi02title {
    width: 515px;
    height: 55px;
    font-size: 23px;
    color: #000000;
    padding-top: 140px;
    padding-left: 100px;
    font-weight: bold;
    text-align: left;
}
.body_youshi02title span {
    font-size: 23px;
    color: #cb0101;
    font-weight: bold;
    text-align: left;
}
.body_youshi02_02title {
    width: 340px;
    height: 230px;
    font-size: 15px;
    color: #666666;
    padding-top: 0px;
    padding-left: 123px;
    line-height: 28px;
    text-align: left;
}
.body_youshi03 {
    width: 1180px;
    height: 380px;
    margin: 0 auto;
}
.body_youshi03left {
    width: 590px;
    height: 380px;
    background: url(../images/body_youshi03left.jpg);
    float: left;
}
.body_youshi03title {
    width: 430px;
    height: 57px;
    font-size: 23px;
    color: #000000;
    padding-top: 103px;
    padding-left: 160px;
    font-weight: bold;
    text-align: left;
}
.body_youshi03title span {
    font-size: 23px;
    color: #cb0101;
    font-weight: bold;
    text-align: left;
}
.body_youshi03_02title {
    width: 330px;
    height: 220px;
    font-size: 15px;
    color: #666666;
    padding-top: 0px;
    padding-left: 175px;
    line-height: 31px;
    text-align: left;
}
.body_youshi03right {
    width: 590px;
    height: 380px;
    background: url(../images/body_youshitu03.jpg);
    float: left;
}
.body_youshi04 {
    width: 1180px;
    height: 350px;
    margin: 0 auto;
}
.body_youshi04left {
    width: 580px;
    height: 350px;
    background: url(../images/body_youshitu04.jpg);
    float: left;
}
.body_youshi04right {
    width: 600px;
    height: 350px;
    background: url(../images/body_youshi04right.jpg);
    float: left;
}
.body_youshi04title {
    width: 430px;
    height: 55px;
    font-size: 23px;
    color: #000000;
    padding-top: 35px;
    padding-left: 92px;
    font-weight: bold;
    text-align: left;
}
.body_youshi04title span {
    font-size: 23px;
    color: #cb0101;
    font-weight: bold;
    text-align: left;
}
.body_youshi04_02title {
    width: 350px;
    height: 230px;
    font-size: 15px;
    color: #666666;
    padding-top: 0px;
    padding-left: 113px;
    line-height: 34px;
    text-align: left;
}





.page_about_right img{max-width: 100%;}
#index_case .js_frame img{height: 190px;}
#top {
    background: #efefef;
    border-bottom: 1px solid #ddd;
    height: 30px;
    font-size: 12px;
    line-height: 30px;
}

.top {
    width: 1200px;
    margin: 0 auto;
    height: 30px;
}

.top_left {}

.top_right {}

.top_right span {
    display: inline-block;
    line-height: 30px;
    margin-right: 10px;
    min-width: 30px;
    
    text-indent: 30px;
    cursor: pointer;
}

.top_right span:nth-child(1) {
    background: url(../images/phone.png) 5px 50% no-repeat;
    background-size: 15px;
    ;
}

.top_right span:nth-child(2) {
    background: url(../images/kf.png) 5px 50% no-repeat;
    background-size: 15px;
    ;
}

.top_right span:nth-child(3) {
    background: url(../images/qrcode.png) 5px 50% no-repeat;
    background-size: 20px;
}

.top_right span>img {
    width: 20px;
    display: table-cell;
    vertical-align: middle;
}

.qrcodebtn {
    position: relative;
}

.qrcodebox {
    position: absolute;
    left: -55px;
    top: 40px;
    display: none;
}

.qrcodebox img {
    width: 150px;
}


/* top E */


/* header S */

#header {}

.header {
    width: 1200px;
    height: 120px;
    margin: 0 auto;
}

.header_log {}

.header_log img {
    
    margin-top: 20px;
}

.header_search {margin-top: 15px;}

.header_search form {
    margin-top: 30px;
}

.header_search .keyword {
    margin-top: 5px;
    font-weight: 700;
}


/* header E */


.fullscreen_list_div {
    background: #ff675d;
}

.fullscreen_list_div {
    display: none;
    position: relative;
    z-index: 9999;
}

.fullscreen_list_div .fullscreen_list_ul {
    width: 1200px;
    margin: 0 auto;
}

.fullscreen_list_div .fullscreen_list_ul li {
    width: 100px;
    display: inline-block;
    text-align: center;
    padding: 5px 0;
    margin: 5px 8px;
    background: #fb503c;
}

.fullscreen_list_div .fullscreen_list_ul li:hover,
.fullscreen_list_div .fullscreen_list_ul li.close {
    background: #fb160e;
    cursor: pointer;
}

.fullscreen_list_div .fullscreen_list_ul li a {
    color: #fff;
    font-size: 12px;
    display: block;
}


/* nav E */


/* banner S */

#banner {
    border-bottom: 1px solid #efefef;
}


/* banner E */


/* index about S */

#index_about {
    width: 1200px;
    margin: 50px auto;
}

.index_title {
    width: 200px;
    text-align: center;
    margin: 20px auto;
    position: relative;
    font-size: 25px;
}

.index_title:before {
    content: '';
    background: #fb503c;
    width: 50px;
    height: 1px;
    position: absolute;
    top: 18px;
    left: -20px;
}

.index_title:after {
    content: '';
    background: #fb503c;
    width: 50px;
    height: 1px;
    position: absolute;
    top: 18px;
    right: -20px;
}


/* index about E */


/* index product S */

#index_product {
    width: 1200px;
    margin: 50px auto;
}

.index_product_sort {
    margin-bottom: 40px;
}

.index_product_sort>li {
    display: inline-block;
    margin-right: 10px;
    position: relative;
}

.index_product_sort>li>a {
    padding: 5px 10px;
    border: 2px solid #555;
    border-radius: 10px;
    display: block;
}

.index_product_sort_children {
    position: absolute;
    top: 33px;
    z-index: 999;
    width: 1200px;
    display: none;
}

.index_product_sort>li:hover .index_product_sort_children {
    display: block;
}

.index_product_sort_children>li {
    display: inline-block;
    position: relative;
}

.index_product_sort_children>li>a {
    padding: 10px 10px;
    display: block;
    font-size: 12px;
}

.index_product_info {}

.index_product_info a {
    display: block;
}


/* index product E */


/*index new S*/

#index_new {
    width: 1200px;
    margin: 50px auto;
}

.index_new_ul {}

.index_new_ul li {
    width: 550px;
    padding: 20px;
    float: left;
    margin: 5px;
    background: #f7f7f7;
}

.index_new_li_title {
    font-size: 14px;
    margin-bottom: 10px;
    display: block;
}

.index_new_li_description {
    font-size: 12px;
    color: #888;
    text-indent: 20px;
    margin-bottom: 15px;
}

.index_new_li_time {
    font-size: 12px;
    color: #888;
}


/*index new E*/


/*footer S*/

#footer {
    background: #005bac;
    margin-top: 50px;
    padding-top: 20px;
}

.footer {
    width: 1200px;
    margin: 0 auto;
}

.footer_ul {}

.footer_ul_li {
    float: left;
    color: #fff;
    width: 120px;
    padding-right: 15px;
}

.footer_ul_li_ul {}

.footer_ul_li_ul li:first-child {
    margin-bottom: 10px;
    font-weight: 700;
}

.footer_ul_li_ul li {
    margin-bottom: 5px;
}

.footer_ul_li_ul li a {
    display: block;
    
    line-height: 30px;
    font-size: 12px;
    color: #fff;
}

.footer_qrcode {
    width: 160px;
    float: right;
}

.footer_bottom {
    background: #222;
    color: #fff;
    text-align: center;
    font-size: 12px;
    line-height: 50px;
}


/*footer E*/


/*在线留言悬浮框 S*/

#mbtn {
    width: 40px;
    height: 40px;
    position: fixed;
    z-index: 999;
    background: url(../images/mbtn.png) no-repeat 50% 50% #fb503c;
    background-size: 80% 80%;
    right: 5px;
    bottom: 5px;
    cursor: pointer;
}

.mcbtn {
    float: right;
    width: 25px;
    height: 25px;
    background: url(../images/mcbtn.png) no-repeat 50% 50%;
    background-size: 80% 80%;
    cursor: pointer;
}

#message {
    position: fixed;
    right: 5px;
    bottom: 0px;
    width: 188px;
    z-index: 9999;
    background: #fff;
    padding: 20px;
    border-radius: 5px 5px 0 0;
    border: 1px solid #efefef;
    box-shadow: 2px -2px 2px #efefef;
    display: none;
}

.message_title {
    font-size: 16px;
    margin-bottom: 15px;
    border-bottom: 1px solid #efefef;
    padding-bottom: 10px;
}

#message input,
#message textarea {
    margin-bottom: 5px;
}

#message buttoon {}


/*在线留言悬浮框 E*/


/*内页 S*/

#page_about,
#sort_product,
#info_product,
#message_page,
#sitemap,
#search_page {
    width: 1200px;
    margin: 35px auto;
}

.sort_product_right_ul {
    margin-top: 30px;
}

.sort_product_right_ul li {
    width: 215px;
    float: left;
    padding: 5px;
    margin: 6px;
    box-shadow: 2px 2px 2px #efefef;
}

.sort_product_right_ul li a {
    display: block;
    text-align: center;
}

.sort_product_right_ul li a img {
    max-width: 100%;
    height: 150px;
}

.sort_product_right_ul li a h4 {
    text-align: center;
    line-height: 30px;
}

.sort_new_right_ul {
    margin-top: 30px;
    word-break: break-word;
}

.sort_new_right_ul li {
    margin-bottom: 10px;
    padding-bottom: 5px;
    border-bottom: 1px solid #efefef;
    clear:both;
}

.sort_new_right_ul li a {
    display: block;
}
.sort_new_right_ul li a img{
    float:left;
    width: 100px;
    height: 80px;
    margin-right: 30px;
}

.sort_new_right_ul li a h4 {
    font-size: 16px;
    margin-bottom: 15px;
}

.sort_new_right_ul li a p {
    font-size: 12px;
    color: #777;
    text-indent: 20px;
    margin-bottom: 10px;
}

.sort_new_right_ul li a .time {
    font-size: 12px;
    color: #777;
}

.info_product_right_time,
.info_product_right_page_view {
    font-size: 12px;
    float: left;
    margin-right: 10px;
}

.info_product_right_image {
    margin-top: 20px;
}

.info_product_right_description {
    word-break: break-word;
    margin-top: 20px;
}

.info_product_right_description img {
    max-width: 100%;
}

.rightbox_relation {
    margin-top: 20px;
}

.rightbox_relation_title {
    margin-bottom: 10px;
    font-size: 18px;
    border: none
}

.rightbox_product_relation_ul {}

.rightbox_product_relation_ul li {
    width: 170px;
    padding: 5px;
    margin: 5px;
    float: left;
    background: #f6f6f6;
}

.rightbox_product_relation_ul li a {
    display: block;
    text-align: center;
}

.rightbox_product_relation_ul li a img {
    max-width: 100%;
    height: 120px;
}

.rightbox_product_relation_ul li a h4 {
    line-height: 30px;
    text-align: center;
    font-size: 12px;
}

.rightbox_new_relation_ul {
    word-break: break-word;
}

.rightbox_new_relation_ul li {
    padding: 10px;
    margin: 5px 0;
    background: #f9f9f9;
}

.rightbox_new_relation_ul li a {
    display: block;
}

.rightbox_new_relation_title {
    font-size: 14px;
    margin-bottom: 10px;
}

.rightbox_new_relation_time {
    font-size: 12px;
    margin-bottom: 10px;
    color: #666;
}

.rightbox_new_relation_description {
    font-size: 12px;
    color: #666;
    text-indent: 20px;
}

.leftbox_ul p {
    line-height: 24px;
}

.rightbox_message_form {
    margin-top: 20px;
}

.rightbox_message_form input,
.rightbox_message_form textarea {
    margin-bottom: 5px;
}

.sitemap_right_box {
    border: 1px solid #efefef;
    margin-bottom: 10px;
    padding: 10px;
}

.sitemap_right_box_title {
    margin-bottom: 10px;
    font-size: 14px;
    border: none;
    font-weight: 700;
}

.sitemap_right_box_ul {}

.sitemap_right_box_ul li {
    float: left;
    margin: 5px 10px;
}

.search_page_right_form {
    margin-top: 20px;
}

.search_page_right_ul {
    margin-top: 20px;
}

.search_page_right_ul li {
    border-bottom: 1px solid #efefef;
    margin-bottom: 5px;
    padding: 10px 5px;
}

.search_title {
    font-size: 14px;
    margin-bottom: 8px;
}

.search_chunk {
    float: left;
    margin-right: 10px;
    font-size: 12px;
    color: #888;
    position: relative;
}

.search_chunk:after {
    content: '';
    position: absolute;
    top: 8px;
    right: -5px;
    width: 2px;
    height: 2px;
    border-radius: 50%;
    background: #888;
}

.search_sort {
    float: left;
    font-size: 12px;
    color: #888;
    margin-right: 20px;
}

.search_time {
    float: left;
    font-size: 12px;
    color: #888;
}


/*--------------------------------------*/

.leftbox {
    width: 200px;
    float: left;
    padding: 0 10px 10px 10px;
}

.leftbox_ul {
    border-bottom: 1px solid #efefef;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.leftbox_ul li:first-child,
.leftbox_title {
    margin-bottom: 10px;
    border: none
}

.leftbox_ul li {
    margin-bottom: 5px;
    padding-bottom: 5px;
    font-size: 12px;
    border-bottom: 1px dashed #efefef;
}

.rightbox {
    width: 950px;
    float: right;
    position: relative;
}

.rightbox_title {
    margin-bottom: 10px;
    font-size: 18px;
    border: none
}

.rightbox_frame {
    position: absolute;
    top: 10px;
    right: 0px;
}

.rightbox_frame li {
    float: left;
    margin-right: 10px;
    position: relative;
}

.rightbox_frame li:after {
    content: '';
    width: 2px;
    height: 2px;
    position: absolute;
    top: 9px;
    right: -5px;
    background: #666;
}

.rightbox_frame li:last-child {
    margin: 0px;
}

.rightbox_frame li:last-child:after {
    display: none;
}

.rightbox_siblings {
    margin-top: 20px;
}

.rightbox_siblings>div {
    margin-bottom: 10px;
}

.makea{
    margin-right: 10px;
}
/*内页 E*/
.ribbon {
    display: block;
    font-family: 'Source Sans Pro', sans-serif;
    background-color: #EB5F5A;
}

.ribbon a {
    display: block;
    padding: 10px 0;
    color: #fff;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
}

.ribbon a:hover {
    background-color: #d7544f;
}

header {
    background: #fff;
}

.testscreen {
    display: block;
    width: 100%;
    height: auto;
    margin: 0 auto;
}

.description {
    max-width: 400px;
    margin: 0 auto;
    padding: 0 20px;
}

.dist {
    display: block;
    width: 170px;
    margin: 20px auto;
    padding: 10px 0;
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 16px;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    background: #09AE9B;
    color: #fff;
}

.dist:hover {
    background: #099681;
}

.examplecode {
    margin: 0 auto 30px;
}

.examplecode:last-child {
    margin-bottom: 0;
}

code {
    font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
    font-size: 12px;
}

tr {
    display: block;
    padding: 0 20px;
    margin-bottom: 20px;
}

.description {
    margin-bottom: 10px;
}

section {
    padding: 40px 0;
}

section:nth-child(odd) {
    background: #ececec;
}

td, th {
    display: block;
    font-family: 'Source Sans Pro', sans-serif;
    line-height: 24px;
    font-weight: 300;
    color: #2E435A;
}

th {
    text-align: left;
    font-weight: 600;
}

footer {
    margin: 0 auto;
    padding: 20px;
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 14px;
    text-align: center;
    background: #2E435A;
    color: #fff;
}

/**
 * Slider specific styles
 */

.slider {
    position: relative;
    width: 320px;
    margin: 0 auto 40px;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: -moz-none;
    -o-user-select: none;
    user-select: none;
}

.frame,
.events_log {
    position: relative;
    width: 270px;
    margin: 0 auto;
    font-size: 0;
    line-height: 0;
    overflow: hidden;
    white-space: nowrap;
}

.frame li {
    position: relative;
    display: inline-block;
    font-family: 'Source Sans Pro', sans-serif;
    height: auto;
    text-align: center;
    font-size: 15px;
    line-height: 30px;
    color: #fff;
}

.slides {
    display: inline-block;
}

.simple li,
.rewind li,
.events li {
    width: 270px;
    margin-right: 10px;
}

.percentage .slides {
    display: block;
}

.percentage .frame {
    width: 87.452%;
}

.percentage li {
    width: 100%;
}

.variablewidth li {
    width: 280px;
    margin-right: 10px;

}

.multipleelements li, .multislides li, .ease li {
    width: 60px;
    margin-right: 10px;
}

.simple li:last-child,
.rewind li:last-child,
.events li:last-child,
.variablewidth li:last-child,
.multipleelements li:last-child,
.multislides li:last-child,
.ease li:last-child {
    margin-right: 0;
}

.prev, .next {
    position: absolute;
    top: 50%;
    margin-top: -25px;
    display: block;
    cursor: pointer;
}

.next {
    right: 0;
}

.prev {
    left: 0;
}

.next svg, .prev svg {
    width: 25px;
}

.events_log {
    display: block;
    font-size: 12px;
    line-height: 1.6;
    text-align: center;
    background-color: #fcfcfc;
    border: 1px solid #d2d2d2;
    margin-top: -20px;
    margin-bottom: 20px;
}

.events_log > span {
    display: none;
}

.events_log > span:nth-last-child(-n+5) {
    display: block;
}

@media screen and (min-width: 640px ) {
    /**
     * Demo Page Styles
     */
    .examplecode, .frame, .events_log {
        width: 580px;
    }

    .testscreen {
        width: 500px;
    }

    table {
        width: 580px;
        margin: 0 auto;
    }

    tr {
        padding: 0;
    }

    /**
     * Slider specific styles
     */
    .slider {
        width: 640px;
        margin: 0 auto 20px;
    }

    .simple li,
    .rewind li,
    .events li {
        width: 580px;
    }

    .variablewidth li {
        width: 280px;
        margin-right: 10px;
    }

    .multipleelements li, .multislides li, .ease li {
        width: 130px;
        margin-right: 20px;
    }
}

@media screen and (min-width: 980px ) {
    /**
     * Demo Page Styles
     */
    .examplecode {
        width: 880px;
    }

    /**
     * Slider specific styles
     */
    .slider {
        width: 1200px;
    }

    .frame,
    .events_log {
        width: 1150px;
    }

    .simple li,
    .rewind li,
    .events li {
        width: 1200px;
    }

    .variablewidth li {
        width: 280px;
        margin-right: 10px;
    }

    .multipleelements li, .multislides li, .ease li {
        width: 205px;
        margin-right: 20px;
    }
}



/*客服 S*/
.kf {
    position: fixed;
    right: -230px;
    bottom: 0px;
    _position: absolute;
    width: 230px;
    height: 100%;
    background: #009aff;
    z-index: 99999999999;
    _margin-bottom: 0px;
    _top: expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));
    transition: all .5s ease;
}

.kf .hoverbtn {
    width: 30px;
    height: 100px;
    padding-top: 20px;
    cursor: pointer;
    position: absolute;
    top: 55%;
    margin-top: -66px;
    left: -30px;
    font-size: 14px;
    color: #fff;
    background: #009aff;
    -webkit-border-radius: 3px 0px 0px 3px;
    -moz-border-radius: 3px 0px 0px 3px;
    -o-border-radius: 3px 0px 0px 3px;
    border-radius: 3px 0px 0px 3px;
    -moz-box-shadow: -4px 4px 4px -4px #000;
    -webkit-box-shadow: -4px 4px 4px -4px #000;
    box-shadow: -4px 4px 4px -4px #000;
}

.kf .hoverbtn span {
    width: 30px;
    height: 19px;
    line-height: 19px;
    text-align: center;
    overflow: hidden;
    float: left;
}

.kf .hoverbtn .hoverimg {
    width: 13px;
    height: 9px;
    margin: 10px 0px 0px 10px;
    float: left;
    display: inline;
    background-repeat: no-repeat;
}

.hoverimg2 {
    background: url(../images/hoverbtnbg1.png) no-repeat;
}

.kf .conter {
    width: 186px;
    height: 560px;
    margin-left: 22px;
    position: absolute;
    top: 55%;
    *margin-top: -140px;
    margin-top: -280px;
}

.kf .conter .con1 {
    border-bottom: 1px solid #6a6a6a;
    padding-bottom: 22px;
}

.kf .conter .con1 dl dt {
    width: 31px;
    height: 31px;
    float: left;
    position: relative;
    top: 5px;
}

.kf dl .f1 {
    width: 142px;
    height: 36px;
    line-height: 36px;
    float: right;
    font-size: 16px;
    _font-size: 14px;
    *font-size: 15px;
    color: #fff;
    vertical-align: top;
}

.kf dl .f2 {
    width: 142px;
    float: right;
    font-size: 12px;
    color: #fff;
    line-height: 30px;
    float: right;
}

.kefuQQ a {
    background: url(../images/button-custom-qq.gif) no-repeat;
    width: 70px;
    height: 20px;
    display: inline-block;
    vertical-align: middle;
}

.kefuQQ a:hover {
    background: url(../images/button-custom-qq-h.gif) no-repeat;
}

.kf .conter .con1 dl dd .ph_num {
    font: 18px 'Microsoft yahei';
    *font-size: 16px;
    _font-size: 16px;
    color: #fff;
    height: 25px;
}

.kf .qqcall {
    padding: 22px 0px;
    border-bottom: 1px solid #6a6a6a;
}

.kf .qqcall dl dt {
    width: 31px;
    height: 31px;
    float: left;
    position: relative;
    top: 5px;
}

.kf .weixincall {
    float: right;
    padding: 22px 0;
    border-bottom: 1px solid #6a6a6a;
}

.kf .weixincall dl dt {
    width: 31px;
    height: 31px;
    float: left;
    position: relative;
    top: 5px;
}

.kf .weixincall .f3 {
    float: right;
    width: 75px;
    height: auto;
    margin-right: 69px;
    display: inline;
}

.kf .weixincall .f3 img {
    width: 100px;
    height: auto;
}

.kf .dytimer {
    float: right;
    width: 160px;
    height: 40px;
    padding: 16px 0px 15px 0px; /* background: #007b77; */
    margin: 20px 0px 0px 0px;
}

.kf .dytimer span {
    display: block;
    height: 20px;
    line-height: 20px;
    font-size: 14px;
    color: #fff;
}

.kf .dytimer span a {
    color: #fff;
}

.diyou {
    _position: absolute;
    _bottom: auto;
    _margin-bottom: 0px;
    z-index: 99999999999;
    _top: expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));
}

.diyoumask {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 100000;
    width: 100%;
    height: 100%;
    opacity: 0.3;
    filter: alpha(Opacity=30);
    background: #000;
    display: none;
}

.fn_cle:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

/***联系我们***/

/*客服 E*/


body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td {
    margin: 0;
    padding: 0;
}

body {
    background: #fff;
    color: #555;
    font-size: 14px;
    font-family: '微软雅黑', '宋体', 'Arial';
}

td, th, caption {
    font-size: 14px;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
    font-size: 100%;
}

address, caption, cite, code, dfn, em, strong, th, var {
    font-style: normal;
    
}

a {
    color: #555;
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

img {
    border: none;
}

ol, ul, li {
    list-style: none;
}

input, textarea, select, button {
    font: 14px Verdana, Helvetica, Arial, sans-serif;
}

table {
    border-collapse: collapse;
}

html {
    overflow-y: scroll;
}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {
    *zoom: 1;
}

.pull-left {
    float: left;
}

.pull-right {
    float: right;
}

input, textarea {
    border: 1px solid #ccc;
    padding: 5px 0px;
    border-radius: 3px;
    padding-left: 5px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    width: 100%;
}

input:focus, textarea:focus {
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6)
}

button {
    border: none;
    background: #fb503c;
    display: inline-block;
    padding: 6px 6px;
    color: #fff;
    font-size: 12px;
    border-radius: 3px;
}

.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px;
}

.pagination > li {
    display: inline;
}

.pagination > li > a,
.pagination > li > span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #428bca;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;
}

.pagination > li:first-child > a,
.pagination > li:first-child > span {
    margin-left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.pagination > li:last-child > a,
.pagination > li:last-child > span {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
    color: #2a6496;
    background-color: #eee;
    border-color: #ddd;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    z-index: 2;
    color: #fff;
    cursor: default;
    background-color: #428bca;
    border-color: #428bca;
}

.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
    color: #999;
    cursor: not-allowed;
    background-color: #fff;
    border-color: #ddd;
}

.pagination-lg > li > a,
.pagination-lg > li > span {
    padding: 10px 16px;
    font-size: 18px;
}

.pagination-lg > li:first-child > a,
.pagination-lg > li:first-child > span {
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
}

.pagination-lg > li:last-child > a,
.pagination-lg > li:last-child > span {
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
}

.pagination-sm > li > a,
.pagination-sm > li > span {
    padding: 5px 10px;
    font-size: 12px;
}

.pagination-sm > li:first-child > a,
.pagination-sm > li:first-child > span {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

.pagination-sm > li:last-child > a,
.pagination-sm > li:last-child > span {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.pager {
    padding-left: 0;
    margin: 20px 0;
    text-align: center;
    list-style: none;
}

.pager li {
    display: inline;
}

.pager li > a,
.pager li > span {
    display: inline-block;
    padding: 5px 14px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 15px;
}

.pager li > a:hover,
.pager li > a:focus {
    text-decoration: none;
    background-color: #eee;
}

.pager .next > a,
.pager .next > span {
    float: right;
}

.pager .previous > a,
.pager .previous > span {
    float: left;
}

.pager .disabled > a,
.pager .disabled > a:hover,
.pager .disabled > a:focus,
.pager .disabled > span {
    color: #999;
    cursor: not-allowed;
    background-color: #fff;
}








@charset "utf-8";
/* CSS Document */
/*common*/
.mb10 { margin-bottom:10px;}
.ml10 { margin-left:10px;}
.bg { background:#FFF;}
em,i{ font-style:normal; }

body{min-width: 1200px; width: 100%;}


.we_bj{background: url(../images/we_bj.jpg) no-repeat  center 0; height:570px;overflow: hidden;}
.we { width:1200px; margin: 0 auto; overflow: hidden;}
.wewz{ width:564px; padding-top: 72px; float: left; overflow: hidden;}
.wewz h3{height:124px; border-bottom: 1px solid #c9c9c9; overflow: hidden;background: url(../images/we.jpg) no-repeat  0 0; padding: 20px 0 0 195px; font-size:38px; color:#333333; line-height: 44px;margin-bottom: 18px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.wewz h3 span{display: block; font-size: 25px;}
.wewz p{padding-left: 26px;background: url(../images/list_ico01.png) no-repeat  0 15px; font-size: 16px; line-height: 36px; color:#323232;}
.wepic{margin-top: 94px; width:606px; overflow: hidden; float: right;}
.wepic img{ width:606px;height:350px;}


.g_pro{background:url(../images/cpbg.jpg) no-repeat center top;height: 960px; padding-top: 30px;}
.g_pro h2{ text-align: center; font-weight: normal; font-size: 15px; color: #666; line-height:30px; }
.g_pro h2 i{ display: block; color: #000; font-size:38px; line-height: normal;font-weight:bold;}
.g_pro h2 em{ display: block; color: #000; font-size: 24px; padding:5px 0 59px 0; line-height: normal;background:url(../images/lin2.png) no-repeat center 49px;}

.g_pro .m_pro{float: left;width: 242px;border-right:1px solid #efefef;}
.g_pro .m_pro h3{background:url(../images/fltit.jpg) no-repeat;padding: 100px 0 0 43px;font-size: 22px;font-weight: bold;color: #fff; height: 57px;}
.g_pro .m_pro h3 a{color: #fff;}
.g_pro .flc{background: #fff;}
.g_pro .flc h4{background:url(../images/flh2.jpg) no-repeat;margin: 20px auto 0;width: 174px;}
.g_pro .flc h4 a{color: #252525;width: 174px;height: 36px;line-height: 36px;font-size: 16px;color: #252525;font-weight: bold;text-align: center; display: block;}
.g_pro .flc h4 a:hover{background:url(../images/flh2h.jpg) no-repeat;color: #fff;}
.g_pro .flc .flst{padding-top: 10px; display:none;}
.g_pro .flc .db{display:block;}
.g_pro .flc li{height: 42px;line-height: 42px;border-bottom: 1px solid #efefef;text-align: center;overflow: hidden;font-size: 16px;color: #666666; width: 174px;margin: 0 auto;}
.g_pro .flc li a{color: #666666;}
.g_pro .flmore{margin-top: 21px;}

.g_pro .m_hotcp{float: right;width: 900px;margin-right: 20px;padding-top: 16px;}
.g_pro .m_hotcp .hotcphd{height: 52px;line-height: 52px;border-bottom: 1px solid #d5e4e9;margin-bottom: 18px;}
.g_pro .m_hotcp .hotcphd li{float: left;}
.g_pro .m_hotcp .hotcphd li a{display: block;float: left;padding: 0 15px;font-size: 20px;color: #2a2a2a;font-weight:bold;}
.g_pro .m_hotcp .hotcphd li.on a{font-weight: bold;color: #252525;}
.ptcp a{display: block;float: left;padding: 0 15px;font-size: 20px;color: #747474;}
.g_pro .m_hotcp .cpban{width: 896px;border: 1px solid #e2e2e2;margin-bottom: 22px;}



/*优势*/
.ys_tbg h2{ text-align: center; font-weight: normal; font-size: 15px; color: #666; line-height:30px; }
/*.ys_tbg h2 span{ display: block;}*/
.ys_tbg h2 i{ display: block; color: #000; font-size:38px; line-height: normal;font-weight:bold;}
.ys_tbg h2 em{ display: block; color: #000; font-size: 24px; padding:5px 0 59px 0; line-height: normal;background:url(../images/lin2.png) no-repeat center 49px;}

.ys_tbg{ background:url(../images/ys_tbg.jpg) no-repeat center 0; height:180px; padding:38px 0 0; overflow:hidden;}
.ys_tbg .four_t{ background:url(../images/ys_line.gif) no-repeat center 68px;}
.ys_tbg .four_t span,.about .four_t span{font-size: 16px;color: #666; padding:5px 0 0;}
.ys01{ background:url(../images/ys_bg01.jpg) no-repeat center 0; height:411px; overflow:hidden;}
.ys02{ background:url(../images/ys_bg02.jpg) no-repeat center 0; height:410px; overflow:hidden;}
.ys03{ background:url(../images/ys_bg03.jpg) no-repeat center 0; height:448px; overflow:hidden;}
.ys04{ background:url(../images/ys_bg04.jpg) no-repeat center 0; height:400px; overflow:hidden;}
.ys05{ background:url(../images/ys_bg05.jpg) no-repeat center 0; height:387px; overflow:hidden;}
.ys dl{width: 510px; display:inline-block;padding-top:60px;}
.ys dl dt{width: 80px;height: 80px;text-align: center;line-height: 80px;font-size: 50px;color: #fff;font-weight: bold;background: #005bac; font-family:"Times New Roman", Times, serif;float: left;}
.ys dl dd{ padding:0 0 0 30px;width: 400px;float: left;}
.ys dl dd h5{font-size: 28px;color: #006060;line-height: 32px;height: 100px;}
.ys dl dd h5 em{display: block;font-size: 14px;color: #d9d9d9;font-weight: normal;text-transform: uppercase; font-family:Arial, Helvetica, sans-serif;width: 236px;text-align: center;height: 32px;line-height: 32px;background: #fff; border:#e0e0e0 2px solid; margin:12px 0 0;}
.ys dl dd p{font-size: 18px;color: #333;line-height: 32px; background:url(../images/ys_ico01.png) no-repeat 0 14px; padding:0 0 0 20px;}
.ys02 .ys dl,.ys04 .ys dl{ padding:70px 0 0 690px;}



/*服务与品质同行*/
.pin_bg{ background:url(../images/pin_bg.jpg) no-repeat center 0;height: 788px;overflow: hidden;padding-top:60px;margin-top:40px;}

.pin_bg h2{ text-align: center; font-weight: normal; font-size: 15px; color: #fff; line-height:30px; }
.pin_bg h2.slide-top.til01 i{ display: block; color: #fff; font-size:38px; line-height: normal;font-weight:bold;}
.pin_bg h2 em{ display: block; color: #fff; font-size: 24px; padding:5px 0 59px 0; line-height: normal;background:url(../images/lin2.png) no-repeat center 49px;}

.pin dl{width: 18.5%;height: 300px;background: #fff;color: #135390;border-radius:10px;float: left; margin-right:20px;}
.pin dl dt{width: 75px;height: 65px; margin:36px auto 0; background-repeat:no-repeat; background-image:url(../images/pin_ico02.png);}
.pin dl dd{width: 200px; margin:0 auto; padding:20px 0 0;}
.pin dl dd h5{font-size: 20px;font-weight: bold;height: 30px;line-height: 30px;text-align: center;}
.pin dl dd p{font-size: 16px;line-height: 25px;height: 72px;overflow: hidden; padding:16px 0 0;}
.pin dl:hover{color: #fff;background: #135390;}
.pin dl:hover dt{ background-image:url(../images/pin_ico01.png);}
.pin .pin_dl01 dt{ background-position:0 0;}
.pin .pin_dl02 dt{ background-position:-75px 0;}
.pin .pin_dl03 dt{ background-position:-150px 0;}
.pin .pin_dl04 dt{ background-position:-225px 0;}
.pin .pin_dl05 dt{ background-position:-300px 0;}
.pin .pin_dl01{margin: 0;}
.pin_bot{display: block;text-align: center; height: 60px;color:#fff;font-size:30px;padding-top:50px;}
.pin_bott{display: block;text-align: center; height:60px;color:#fff;font-size:30px;margin-bottom:16px;}
.pin_tel{font-size: 36px;color: #fff;background:url(../images/pin_tel.png) no-repeat 0 5px;
width: 310px; margin:0 auto; padding:0 0 20px 105px;height: 65px;}
.pin_tel i{display: block;font-size: 20px;font-weight: normal; padding:0 0 10px 26px;}
.pin_tel .pin_btn{display: block;font-size: 14px;color: #fff;width: 170px;height: 30px;text-align: center;line-height: 30px;background: #135390;font-weight: normal; margin:25px 0 0;}


/* 客户案例 */

.al_bj{background:#fff;height:657px;}
.anl{padding-top:58px;}

.anl h2{ text-align: center; font-weight: normal; font-size: 15px; color: #1a1a1a; line-height:30px; }
.anl h2 i{ display: block; color: #1a1a1a; font-size:38px; line-height: normal;font-weight:bold;}
.anl h2 em{ display: block; color: #333; font-size: 24px; padding:5px 0 59px 0; line-height: normal;background:url(../images/lin2.png) no-repeat center 49px;}

.al_nr{position: relative;}
.al_nr li {float:left;width:380px;background: #ebebeb;height:396px;margin-right:30px;}
.al_nr li p {font-size:0;line-height: 0;position: relative;}
.al_nr li p img{width:380px;height:213px;}
.al_nr li span {position: absolute;height: 50px;line-height: 50px;font-size:20px;width:100%;background: rgba(0,26,48,0.5);display: block;left:0;bottom:0;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
.al_nr li span a {padding-left:25px;font-size:18px;color: #fff;}
.al_nr li em {font-size:14px;padding:29px 30px 0 35px;display: block;height: 98px;font-style: normal;}
.al_nr li i a{display: block;width:142px;height: 32px;line-height: 32px;text-align: center;color: #fff;font-size:14px;background: url(../images/al_ico1.jpg) no-repeat;font-style: normal;margin-left:35px;}
.al_nr li:last-child{margin:0;} 
.al_j1,.al_j2{position: absolute;top:194px;z-index: 99;}
.al_j1{left:-50px;}
.al_j2{right:-50px;}


/* 走进 */

.f_pr{position:relative; }
.f_pa{position:absolute;}
.g_zj{    height: 430px;
    padding-top: 117px;
    background: url(../images/zjbg.jpg) no-repeat center top;}
.g_zj h2{position: absolute;left:860px;top:0;font-size: 34px;line-height: 46px;color: #fff;font-weight: bold; width:196px;}
.g_zj h2 a{color: #fff;}
.g_zj h2 em{display: block;font-size: 16px;color: #fff;font-weight: normal;}
.g_zj .u_dlst1{padding: 0 0 0 164px;width:50%;}
.g_zj .u_dlst1 h4{height: 78px;}
.g_zj .u_dlst1 h3{ height: 30px;line-height: 30px; overflow: hidden; font-size: 18px;color: #000000;font-weight: bold;margin-bottom: 10px;}
.g_zj .u_dlst1 h3 a{color: #000;text-decoration: none;}
.g_zj .wz{height: 200px;position: relative;overflow: hidden;}
.g_zj p{font-size: 14px;line-height: 25px;color: #333333;}
.g_zj em{position: absolute;}



.xc{margin: 67px auto 0;width:1280px;height:362px; overflow: hidden;font-family:"Microsoft Yahei";}
.xc_nav{height:62px; overflow: hidden;margin-left: 240px;}
.xc_nav li{ float: left;width:60px; overflow: hidden;width:400px;margin-right: -1px; position: relative;}
.xc_nav li a{display: inline-block;width:400px;height:60px; font-size: 18px; border:1px solid #e1e1e1; color:#111111;text-align: center;line-height: 60px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}
.xc_nav li a:hover ,.xc_nav li.cur a{background:#1857a3; color:#fff;font-weight: bold;}
.xcprev{margin-top: 119px; background:url(../images/xcprev.png) no-repeat center top;width:21px;height:32px;z-index: 8; float: left;}
.xcnext{margin-top: 119px; background:url(../images/xcnext.png) no-repeat center top;width:21px;height:32px;z-index: 8; float: right;}
.xcprev:hover{background:url(../images/xcprev1.png) no-repeat center top;}
.xcnext:hover{background:url(../images/xcnext1.png) no-repeat center top;}
.xcimg{width:1200px; float: left;margin-left: 19px; overflow: hidden;  margin-top: 32px;}
.xcimg li{ float: left;width:273px; height:225px;position: relative; overflow: hidden;margin-right: 35px;}
.xcimg li img{height:225px;}
.xcimg li span{display: block;width:273px; height:225px;position: absolute; top: 0;left: 0; font-size: 14px; color:#fff; line-height: 40px;text-align: center;background:rgba(24,87,163,0.8); display:none;}
.xcimg li span img{display: block;width:45px;height:45px;margin: 70px  auto 0;}
.xcimg li:hover span{display: block;}




.nes{ height: 665px; padding-top: 98px; background: #f7f7f7;}
.nes h2{ text-align: center; font-weight: normal; font-size: 15px; color: #666; line-height:30px; }
.nes h2 i{ display: block; color: #1a1a1a; font-size:38px; line-height: normal;font-weight:bold;}
.nes h2 em{ display: block; color: #333; font-size: 24px; padding:5px 0 59px 0; line-height: normal;background:url(../images/lin2.png) no-repeat center 49px;}
.nes_l{ width: 374px; margin-right: 39px;}
.nes_r{ margin-right: 0;}
.nes_l h3{ padding-bottom: 20px;padding-left: 12px;}
.nes_l h3 a{ font-size: 18px; color: #333;}
.nes_l h3 span{ display: inline-block; float: right; font-weight: normal; padding-top:5px;}
.nes_l h3 span a{ color: #999999; font-size: 12px; text-transform: uppercase;}
.nes_l p{ position: relative; font-size:0;width: 374px; height: 228px;}
.nes_l p img{ width: 374px; height: 228px;}
.nes_l p span{ display: inline-block; position: absolute; left: 0; width: 100%; height: 50px; line-height: 50px; background:url(../images/spm.png) repeat; bottom:0;}
.nes_l p span a{  padding-left: 17px; font-size: 14px; font-weight: bold; color: #fff;}
.nes_l ul{ padding: 10px 20px 15px; background: #fff;}
.nes_l ul li{ line-height: 35px; padding-left: 17px;background:url(../images/fz_d.png) no-repeat 0 9px; }
.nes_l ul li a{ font-size: 14px; color: #555;}
.nes_l ul li a:hover{ color: #005bac;}
.nes_l ul:hover{ box-shadow: 0 0 15px #ccc;}







.link_bj{background: url(../images/link_bj.jpg) repeat-y center 0 ;height:60px; overflow: hidden;}
.link{width:1200px; margin: 0 auto; height: 60px; overflow: hidden;font-family:"Microsoft Yahei";}
.link h2{ width:80px; overflow: hidden; float: left; font-size:14px; line-height: 60px; overflow: hidden;color:#333;}
.link p{  width: 820px; float: left; font-size: 14px;overflow: hidden; line-height: 60px; color:#333;}
.link p a{ color:#333; padding:0 20px;}
@charset "utf-8";
html{color:#000;background:#FFF; }
body { color:#666;font:12px/1.231 "Microsoft YaHei";} /*网站字体颜色*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,th,var,optgroup{font-style:inherit;font-weight:inherit;}
del,ins{text-decoration:none;}
li{list-style:none;}
caption,th{text-align:left;}
q:before,q:after{content:'';}
abbr,acronym{border:0;font-variant:normal;}
sup{vertical-align:baseline;}
sub{vertical-align:baseline;} 
input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}
input,button,textarea,select{*font-size:100%;}
input,select{vertical-align:middle;}
i,em{ font-style:normal;}
select,input,button,textarea,button{font:99% arial,helvetica,clean,sans-serif;}
table{font-size:inherit;font:100%; border-collapse:collapse;}
pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}
/*title*/
h1 { font-size:32px;}
h2 { font-size:26px;}
h3 { font-size:20px;}
h4 { font-size:14px;}
h5 { font-size:12px;}
h6 { font-size:10px;}

.mt10{ margin-top:10px;}

a { color:#666; text-decoration:none;}  /*for ie f6n.net*/
a:focus{outline:0;} /*for ff f6n.net*/
.vam { vertical-align:middle;}
.clear{ clear:both; height:0; line-height:0; font-size:0;}
.clearfix:after{ content:""; clear:both; height:0; visibility:hidden; display:block;}
.clearfix{*zoom:1}
p{ word-spacing:-1.5px; line-height: 30px;}
.tr { text-align:right;}
.tl { text-align:left;}
.center { text-align:center;}
.fl { float:left;}
.fr { float:right;}
.pa{ position:absolute;}
.pr{ position:relative}
/* -- 购物车外部框架 -- */
.cart_header , .cart_content , .cart_footer { width:760px; margin:0 auto;}



/* -- 页面整体布局 -- */
.header , .content , .footer { width:1200px; margin:0 auto;  }
.h_nav li a:-webkit-any-link{ display:block;}



    .topWrap {
        height: 271px;
        background: url(../images/t_bj.jpg) no-repeat center 0;
       position: relative;
        z-index: 2;
    }
    
    .topWrap .header {
        width: 1310px;
        margin: 0 auto;
        font-family: "Microsoft YaHei";
    }
    .topc>img {
    margin-top: 32px;
    margin-left: 100px;
}
    .topWrap h5 {
        height: 41px;
        font-size: 14px;
        line-height: 38px;
        padding-top: 5px;
        overflow: hidden;
        color: #666;
        font-weight: normal;
    }
    
    .topWrap h5 span {
        display: inline-block;
        overflow: hidden;
        color: #666;
    }
    
    .topWrap h5 span a {
        display: inline-block;
        color: #666;
        padding: 0 10px;
    }
    
    .topWrap h5 img {
        vertical-align: middle;
    }
    
    .topc {
        height: 161px;
        overflow: hidden;
    }
    
    .topWrap h2 {
       float: left;
    height: 100px;
    margin-top: 32px;
    overflow: hidden;
    }
    
    .topWrap h2 img {
    display: block;
    width: 440px;
    margin-top: 20px;
    }
    
    .topWrap h3 {
        margin: 38px 0 0 17px;
        padding-left: 20px;
        padding-top:8px;
        width: 490px;
        overflow: hidden;
        float: left;
        font-size: 36px;
        color: #111111;
        line-height: 40px;
        height: 84px;
        border-left: 3px solid #d9d9d9;
    }
    
    .topWrap h3 span {
        font-size: 18px;
        font-weight: bold;
        display: block;
        color:#005bac;
    }
    
.topc .tel{ float:right; background:url(../images/tel.jpg) no-repeat 0 38px;font-size: 16px;color: #000; font-weight: bold;padding:45px 0 10px 80px;line-height: 24px;}




/*底部开始*/
.f_gg{background:url(../images/f_bg.jpg) repeat-x; height: 578px;}
.f_on1{ height: 80px; line-height: 80px; overflow: hidden; margin-bottom: 72px;}
.f_on1 span{ display: inline-block; float: right; margin-top: 17px; height: 47px; line-height: 47px;background:url(../images/f_l.jpg) no-repeat; width: 252px;}
.f_on1 span a{ display: block; padding-left: 85px; font-size: 14px; font-weight: bold; color: #2e2e2e;}
.f_on1 i{ display: inline-block; float: left; margin-left: -59px;}
.f_on1 i a{ display: inline-block; padding: 0 58px; font-size: 16px; color: #fff;background:url(../images/f_lin.jpg) no-repeat right 35px; font-weight:bold;}
.f_on1 i a.nob{ background: none;}
.f_on2{ float: left; width: 900px; height: 210px;}
.f_on2 em{ display: inline-block; float: left; width: 190px;}
.f_on2 em.last{ width: 320px;}
.f_on2 em a{ display: block; font-size: 14px; color: #d9d9d9; line-height: 29px;}
.f_on2 em i{ display: block; padding-bottom: 1px; width:100px;}
.f_on2 em i a{ font-size: 14px; font-weight: bold; color: #fff;}
.f_on2 em strong{ display: block; padding-left: 40px;background:url(../images/f_tel.jpg) no-repeat 0 5px; color: #d9d9d9; font-size: 14px; font-weight: normal; margin-bottom: 25px;}
.f_on2 em strong span{ display: block; font-size: 20px; font-weight: bold; color: #fff;}
.f_on2 em strong.bg{background:url(../images/f_ico.jpg) no-repeat 0 5px;}
.f_on2 em strong.bg span{ font-size: 14px; color: #d9d9d9; font-weight: normal;}
.f_on3{ float: right; width: 300px; overflow: hidden;}
.f_on3  em{ display: inline-block; float: left; width: 106px; text-align: center; margin-left: 38px; font-size: 14px; color: #999; line-height: 22px;}
.f_on3  em img{ width: 91px; height: 93px; padding: 6px; background: #fff; border: 1px solid #d2d2d2;}
.f_on3  em span{ display: block; padding-top: 8px;}
.f_bot{border-top: 1px solid #3e3e3e; padding-top: 33px; height: 123px;}
.f_bot h3{ float: left; padding-right: 56px;}
.f_bot p{ float: left; width: 705px; color: #999999; font-size: 14px; line-height: 24px; padding-top: 5px;}
.f_bot p a{ color: #999999;}
.f_bot p span{ display: block;}
.f_bot em{ float: right; text-align: right;}
.f_bot em span{ display: block; padding-top: 5px;}
.f_bot em a{ display: inline-block; padding: 0 10px;}
.link{ height: 60px; line-height: 60px; overflow: hidden;}
.link h3{ float: left;}
.link h3 a{ color: #d9d9d9; font-size: 14px;}
.link  em{ display: inline-block; float: right;}
.link  em a{ font-size: 14px; color: #d9d9d9;}
.link p{ float: left; width: 960px; padding-left: 8px;}
.link p a{ display: inline-block; color: #999999; font-size: 14px; padding: 0 15px;}
/*底部结束*/



    .client-2 {
        position: fixed;
        right: -170px;
        top: 50%;
        z-index: 900;
    }
    
    .client-2 li a {
        text-decoration: none;
    }
    .client-2 li {
        margin-top: 1px;
        clear: both;
        height: 71px;
        position: relative;
    }
    
    .client-2 li i {
        background: url(../images/fx.png) no-repeat;
        display: block;
        width: 30px;
        height: 27px;
        margin: 0px auto;
        text-align: center;
    }
    
    .client-2 li p {
        height: 20px;
        font-size: 12px;
        line-height: 20px;
        overflow: hidden;
        text-align: center;
        color: #fff;
    }
    
    .client-2 .my-kefu-qq i {
        background-position: 4px 5px;
    }
    
    .client-2 .my-kefu-tel i {
        background-position: 0 -21px;
    }
    
    .client-2 .my-kefu-liuyan i {
        background-position: 4px -53px;
    }
    
    .client-2 .my-kefu-weixin i {
        background-position: -34px 4px;
    }
    
    .client-2 .my-kefu-weibo i {
        background-position: -30px -22px;
    }
    
    .client-2 .my-kefu-ftop {
        display: none;
    }
    
    .client-2 .my-kefu-ftop i {
        width: 33px;
        height: 35px;
        background-position: -27px -51px;
    }
    
    .client-2 .my-kefu-left {
        float: left;
        width: 77px;
        height: 47px;
        position: relative;
    }
    
    .client-2 .my-kefu-tel-right {
        font-size: 16px;
        color: #fff;
        float: left;
        height: 24px;
        line-height: 22px;
        padding: 0 15px;
        border-left: 1px solid #fff;
        margin-top: 14px;
    }
    
    .client-2 .my-kefu-right {
        width: 20px;
    }
    
    .client-2 .my-kefu-tel-main {
        background: #1857a3;
        color: #fff;
        height: 56px;
        width: 247px;
        padding:9px 0 6px;
        float: left;
    }
    
    .client-2 .my-kefu-main {
        background: #1857a3;
        width: 97px;
        height: 56px;
        position: relative;
        padding:9px 0 6px;
        float: left;
    }
    
    .client-2 .my-kefu-weixin-pic {
        position: absolute;
        left: -130px;
        top: -24px;
        display: none;
        z-index: 333;
    }
    
    .my-kefu-weixin-pic img {
        width: 115px;
        height: 115px;
    }
    .m_tit>span {
    color: #bfbfbf;
    font-size: 14px;
    font-family: Arial;
    text-transform: uppercase;
    margin: 0 auto;
}
.tc {
    text-align: center;
}
.service_main {
    padding: 30px 0;
}
.w {
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
}
h2.slide-top.til01 i {
    display: block;
    color: #000;
    font-size: 38px;
    line-height: normal;
    font-weight: bold;
}
.service_main .m_cont {
    padding: 25px 0;
}
.service_main .m_cont>div.fl {
    width: 25%;
}

.fl {
    float: left;
}
.service_main .m_cont>div.fl .m_cont_a_pic {
  
    text-align: center;
}
.auto {
    margin-left: auto;
    margin-right: auto;
}
.db {
    display: block;
}
.service_main .m_cont>div.fl .m_cont_a_tit {
    color: #2b2b2b;
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
}
.service_main .m_cont>div.fl .m_cont_note {
    color: #313131;
    font-size: 13px;
    line-height: 25px;
    width: 210px;
    margin: 0 auto;
    text-align: center;
    margin-top: 13px;
}
.youshi img {
    text-align: center;
    width: 100%;
}
.youshi {
    max-width: 2124px;
    margin: 0 auto;
}
.wz em a img {
    margin-top: 25px;
}
@charset "UTF-8";

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.5.2
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2017 Daniel Eden
 */

.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}

.animated.infinite {
  animation-iteration-count: infinite;
}

.animated.hinge {
  animation-duration: 2s;
}

.animated.flipOutX,
.animated.flipOutY,
.animated.bounceIn,
.animated.bounceOut {
  animation-duration: .75s;
}

@keyframes bounce {
  from, 20%, 53%, 80%, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    transform: translate3d(0,-4px,0);
  }
}

.bounce {
  animation-name: bounce;
  transform-origin: center bottom;
}

@keyframes flash {
  from, 50%, to {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

.flash {
  animation-name: flash;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@keyframes pulse {
  from {
    transform: scale3d(1, 1, 1);
  }

  50% {
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    transform: scale3d(1, 1, 1);
  }
}

.pulse {
  animation-name: pulse;
}

@keyframes rubberBand {
  from {
    transform: scale3d(1, 1, 1);
  }

  30% {
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    transform: scale3d(.95, 1.05, 1);
  }

  75% {
    transform: scale3d(1.05, .95, 1);
  }

  to {
    transform: scale3d(1, 1, 1);
  }
}

.rubberBand {
  animation-name: rubberBand;
}

@keyframes shake {
  from, to {
    transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    transform: translate3d(10px, 0, 0);
  }
}

.shake {
  animation-name: shake;
}

@keyframes headShake {
  0% {
    transform: translateX(0);
  }

  6.5% {
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    transform: translateX(0);
  }
}

.headShake {
  animation-timing-function: ease-in-out;
  animation-name: headShake;
}

@keyframes swing {
  20% {
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

.swing {
  transform-origin: top center;
  animation-name: swing;
}

@keyframes tada {
  from {
    transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    transform: scale3d(1, 1, 1);
  }
}

.tada {
  animation-name: tada;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@keyframes wobble {
  from {
    transform: none;
  }

  15% {
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  to {
    transform: none;
  }
}

.wobble {
  animation-name: wobble;
}

@keyframes jello {
  from, 11.1%, to {
    transform: none;
  }

  22.2% {
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}

.jello {
  animation-name: jello;
  transform-origin: center;
}

@keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    transform: scale3d(.3, .3, .3);
  }

  20% {
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    transform: scale3d(.9, .9, .9);
  }

  60% {
    opacity: 1;
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    transform: scale3d(.97, .97, .97);
  }

  to {
    opacity: 1;
    transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  animation-name: bounceIn;
}

@keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    transform: translate3d(0, 25px, 0);
  }

  75% {
    transform: translate3d(0, -10px, 0);
  }

  90% {
    transform: translate3d(0, 5px, 0);
  }

  to {
    transform: none;
  }
}

.bounceInDown {
  animation-name: bounceInDown;
}

@keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    transform: translate3d(25px, 0, 0);
  }

  75% {
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    transform: translate3d(5px, 0, 0);
  }

  to {
    transform: none;
  }
}

.bounceInLeft {
  animation-name: bounceInLeft;
}

@keyframes bounceInRight {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    transform: translate3d(10px, 0, 0);
  }

  90% {
    transform: translate3d(-5px, 0, 0);
  }

  to {
    transform: none;
  }
}

.bounceInRight {
  animation-name: bounceInRight;
}

@keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }

  75% {
    transform: translate3d(0, 10px, 0);
  }

  90% {
    transform: translate3d(0, -5px, 0);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.bounceInUp {
  animation-name: bounceInUp;
}

@keyframes bounceOut {
  20% {
    transform: scale3d(.9, .9, .9);
  }

  50%, 55% {
    opacity: 1;
    transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    transform: scale3d(.3, .3, .3);
  }
}

.bounceOut {
  animation-name: bounceOut;
}

@keyframes bounceOutDown {
  20% {
    transform: translate3d(0, 10px, 0);
  }

  40%, 45% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }
}

.bounceOutDown {
  animation-name: bounceOutDown;
}

@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    transform: translate3d(20px, 0, 0);
  }

  to {
    opacity: 0;
    transform: translate3d(-2000px, 0, 0);
  }
}

.bounceOutLeft {
  animation-name: bounceOutLeft;
}

@keyframes bounceOutRight {
  20% {
    opacity: 1;
    transform: translate3d(-20px, 0, 0);
  }

  to {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }
}

.bounceOutRight {
  animation-name: bounceOutRight;
}

@keyframes bounceOutUp {
  20% {
    transform: translate3d(0, -10px, 0);
  }

  40%, 45% {
    opacity: 1;
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }
}

.bounceOutUp {
  animation-name: bounceOutUp;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  animation-name: fadeIn;
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInDown {
  animation-name: fadeInDown;
}

@keyframes fadeInDownBig {
  from {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInDownBig {
  animation-name: fadeInDownBig;
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInLeft {
  animation-name: fadeInLeft;
}

@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInLeftBig {
  animation-name: fadeInLeftBig;
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInRight {
  animation-name: fadeInRight;
}

@keyframes fadeInRightBig {
  from {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInRightBig {
  animation-name: fadeInRightBig;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInUp {
  animation-name: fadeInUp;
}

@keyframes fadeInUpBig {
  from {
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInUpBig {
  animation-name: fadeInUpBig;
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.fadeOut {
  animation-name: fadeOut;
}

@keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }
}

.fadeOutDown {
  animation-name: fadeOutDown;
}

@keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }
}

.fadeOutDownBig {
  animation-name: fadeOutDownBig;
}

@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(-100%, 0, 0);
  }
}

.fadeOutLeft {
  animation-name: fadeOutLeft;
}

@keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(-2000px, 0, 0);
  }
}

.fadeOutLeftBig {
  animation-name: fadeOutLeftBig;
}

@keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(100%, 0, 0);
  }
}

.fadeOutRight {
  animation-name: fadeOutRight;
}

@keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }
}

.fadeOutRightBig {
  animation-name: fadeOutRightBig;
}

@keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }
}

.fadeOutUp {
  animation-name: fadeOutUp;
}

@keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }
}

.fadeOutUpBig {
  animation-name: fadeOutUpBig;
}

@keyframes flip {
  from {
    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    animation-timing-function: ease-out;
  }

  40% {
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    animation-timing-function: ease-out;
  }

  50% {
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    animation-timing-function: ease-in;
  }

  80% {
    transform: perspective(400px) scale3d(.95, .95, .95);
    animation-timing-function: ease-in;
  }

  to {
    transform: perspective(400px);
    animation-timing-function: ease-in;
  }
}

.animated.flip {
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
  animation-name: flip;
}

@keyframes flipInX {
  from {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    animation-timing-function: ease-in;
  }

  60% {
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    transform: perspective(400px);
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  animation-name: flipInX;
}

@keyframes flipInY {
  from {
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    animation-timing-function: ease-in;
  }

  60% {
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    transform: perspective(400px);
  }
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  animation-name: flipInY;
}

@keyframes flipOutX {
  from {
    transform: perspective(400px);
  }

  30% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

.flipOutX {
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@keyframes flipOutY {
  from {
    transform: perspective(400px);
  }

  30% {
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

.flipOutY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  animation-name: flipOutY;
}

@keyframes lightSpeedIn {
  from {
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    transform: skewX(-5deg);
    opacity: 1;
  }

  to {
    transform: none;
    opacity: 1;
  }
}

.lightSpeedIn {
  animation-name: lightSpeedIn;
  animation-timing-function: ease-out;
}

@keyframes lightSpeedOut {
  from {
    opacity: 1;
  }

  to {
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

.lightSpeedOut {
  animation-name: lightSpeedOut;
  animation-timing-function: ease-in;
}

@keyframes rotateIn {
  from {
    transform-origin: center;
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    transform-origin: center;
    transform: none;
    opacity: 1;
  }
}

.rotateIn {
  animation-name: rotateIn;
}

@keyframes rotateInDownLeft {
  from {
    transform-origin: left bottom;
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    transform-origin: left bottom;
    transform: none;
    opacity: 1;
  }
}

.rotateInDownLeft {
  animation-name: rotateInDownLeft;
}

@keyframes rotateInDownRight {
  from {
    transform-origin: right bottom;
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    transform-origin: right bottom;
    transform: none;
    opacity: 1;
  }
}

.rotateInDownRight {
  animation-name: rotateInDownRight;
}

@keyframes rotateInUpLeft {
  from {
    transform-origin: left bottom;
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    transform-origin: left bottom;
    transform: none;
    opacity: 1;
  }
}

.rotateInUpLeft {
  animation-name: rotateInUpLeft;
}

@keyframes rotateInUpRight {
  from {
    transform-origin: right bottom;
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    transform-origin: right bottom;
    transform: none;
    opacity: 1;
  }
}

.rotateInUpRight {
  animation-name: rotateInUpRight;
}

@keyframes rotateOut {
  from {
    transform-origin: center;
    opacity: 1;
  }

  to {
    transform-origin: center;
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

.rotateOut {
  animation-name: rotateOut;
}

@keyframes rotateOutDownLeft {
  from {
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    transform-origin: left bottom;
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

.rotateOutDownLeft {
  animation-name: rotateOutDownLeft;
}

@keyframes rotateOutDownRight {
  from {
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    transform-origin: right bottom;
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.rotateOutDownRight {
  animation-name: rotateOutDownRight;
}

@keyframes rotateOutUpLeft {
  from {
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    transform-origin: left bottom;
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.rotateOutUpLeft {
  animation-name: rotateOutUpLeft;
}

@keyframes rotateOutUpRight {
  from {
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    transform-origin: right bottom;
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

.rotateOutUpRight {
  animation-name: rotateOutUpRight;
}

@keyframes hinge {
  0% {
    transform-origin: top left;
    animation-timing-function: ease-in-out;
  }

  20%, 60% {
    transform: rotate3d(0, 0, 1, 80deg);
    transform-origin: top left;
    animation-timing-function: ease-in-out;
  }

  40%, 80% {
    transform: rotate3d(0, 0, 1, 60deg);
    transform-origin: top left;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

.hinge {
  animation-name: hinge;
}

@keyframes jackInTheBox {
  from {
    opacity: 0;
    transform: scale(0.1) rotate(30deg);
    transform-origin: center bottom;
  }

  50% {
    transform: rotate(-10deg);
  }

  70% {
    transform: rotate(3deg);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

.jackInTheBox {
  animation-name: jackInTheBox;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@keyframes rollIn {
  from {
    opacity: 0;
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.rollIn {
  animation-name: rollIn;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}

.rollOut {
  animation-name: rollOut;
}

@keyframes zoomIn {
  from {
    opacity: 0;
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

.zoomIn {
  animation-name: zoomIn;
}

@keyframes zoomInDown {
  from {
    opacity: 0;
    transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomInDown {
  animation-name: zoomInDown;
}

@keyframes zoomInLeft {
  from {
    opacity: 0;
    transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomInLeft {
  animation-name: zoomInLeft;
}

@keyframes zoomInRight {
  from {
    opacity: 0;
    transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomInRight {
  animation-name: zoomInRight;
}

@keyframes zoomInUp {
  from {
    opacity: 0;
    transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomInUp {
  animation-name: zoomInUp;
}

@keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    transform: scale3d(.3, .3, .3);
  }

  to {
    opacity: 0;
  }
}

.zoomOut {
  animation-name: zoomOut;
}

@keyframes zoomOutDown {
  40% {
    opacity: 1;
    transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  to {
    opacity: 0;
    transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
    transform-origin: center bottom;
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomOutDown {
  animation-name: zoomOutDown;
}

@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    transform: scale(.1) translate3d(-2000px, 0, 0);
    transform-origin: left center;
  }
}

.zoomOutLeft {
  animation-name: zoomOutLeft;
}

@keyframes zoomOutRight {
  40% {
    opacity: 1;
    transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    transform: scale(.1) translate3d(2000px, 0, 0);
    transform-origin: right center;
  }
}

.zoomOutRight {
  animation-name: zoomOutRight;
}

@keyframes zoomOutUp {
  40% {
    opacity: 1;
    transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  to {
    opacity: 0;
    transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
    transform-origin: center bottom;
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomOutUp {
  animation-name: zoomOutUp;
}

@keyframes slideInDown {
  from {
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.slideInDown {
  animation-name: slideInDown;
}

@keyframes slideInLeft {
  from {
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.slideInLeft {
  animation-name: slideInLeft;
}

@keyframes slideInRight {
  from {
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.slideInRight {
  animation-name: slideInRight;
}

@keyframes slideInUp {
  from {
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.slideInUp {
  animation-name: slideInUp;
}

@keyframes slideOutDown {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    transform: translate3d(0, 100%, 0);
  }
}

.slideOutDown {
  animation-name: slideOutDown;
}

@keyframes slideOutLeft {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    transform: translate3d(-100%, 0, 0);
  }
}

.slideOutLeft {
  animation-name: slideOutLeft;
}

@keyframes slideOutRight {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    transform: translate3d(100%, 0, 0);
  }
}

.slideOutRight {
  animation-name: slideOutRight;
}

@keyframes slideOutUp {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    transform: translate3d(0, -100%, 0);
  }
}

.slideOutUp {
  animation-name: slideOutUp;
}
       
            .fullSlide{min-width:1200px;position:relative;height:600px;overflow:hidden;}
            .fullSlide .bd{position:relative;z-index:0;}
            .fullSlide .bd ul{width:100%!important;}
            .fullSlide .bd li{width:100%!important;height:600px;overflow:hidden;text-align:center;}
            .fullSlide .bd li a{display:block;height:600px; }
            .fullSlide .hd{width:1200px;left:50%;height:40px; margin-left:-620px;position:absolute;z-index:1;bottom:0px;overflow:hidden;}
            .fullSlide .hd ul{margin-left:570px; height:20px;}
            .fullSlide .hd ul li{float:left;margin:0 5px; display:inline-block;cursor:pointer;width:15px;height:15px;background:#ff6600;border-radius: 100%;}
            .fullSlide .hd ul .on{background:none;background:#fff; border:2px solid #ff6600;-webkit-box-sizing: border-box; -moz-box-sizing: border-box;   box-sizing: border-box;}
        

    .blk-main{ width: 1200px; margin:0 auto;}
        .p1-search-1 {
            background: #f2f2f2;
            height: 82px;
            border-bottom: 1px solid #eee;
            overflow: hidden;
            font-size: 14px;
        }
        
        .p1-search-1 p {
            color: #444;
            line-height: 82px;
        }
        
        .p1-search-1 a {
            color: #444;
            display: inline-block;
            margin-right: 15px;
        }
        
        .p1-search-1-inp {
            width: 270px;
            height: 30px;
            border-radius: 20px;
            background: #fff;
            padding-left: 10px;
            margin-top: 28px;
        }
        
        .p1-search-1-inp input {
            border: 0;
        }
        
        .p1-search-1-inp1 {
            width: 224px;
            height: 30px;
            line-height: 30px;
            color: #a9a9a9;
            float: left;
        }
        
        .p1-search-1-inp2 {
            width: 30px;
            height: 30px;
            background: url(../images/viskins-p1.png) no-repeat -258px -936px;
            float: right;
            cursor: pointer;
        }
    
