﻿body {
    font-size: 14px;
    padding: 0;
    margin: 0
}

a,a:hover {
    color: #333;
    text-decoration: none
}

.font-blue {
    color: #006fba
}

/* head */
header {
    background: #fff;
    z-index: 100;
    width: 100%;
    top: 0;
    left: 0;
    box-shadow: 0px 0px 3px #888
}

.logo {
    float: left
}

.head-contact {
    margin-top: 5px
}

.head-phone {
    float: left;
    font-size: 18px;
    font-weight: 700;
    margin-right: 30px;
    margin-top: 3px
}

.head-contact .form-control {
    border-right: 0!important
}
.head-search-btn {
    background: transparent;
    border: 1px solid #ccc;
    border-left: 0!important
}

@media(min-width:768px) and (max-width:992px) {
    .nav>li>a {
        padding-left: 5px;
        padding-right: 5px
    }
}

.nav>li.active>a,
.nav li a:hover,
.nav .open>a,
.nav .open>a:hover,
.nav .open>a:focus {
    background: #006fba;
    color: #fff;
}
/* head */

/* side */
.aside * {
    color: #fff
}
.aside h3 {
    font-size: 20px;
    margin:0;
    background: #006fba;
    text-align: center;
    padding: 8px 0;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px
}

.aside .class-list li {
    position: relative
}
.aside .class-list li a {
    background: #005c99;
    display: block;
    padding: 10px 0 10px 24px;
    border-bottom: 1px solid #006fba
}
.aside .class-list li i {
    position: absolute;
    left: 5px;
    top: 10px
}

.aside .form-control {
    border: 2px solid #006fba;
    color: #000
}
.side-search-btn {
    background: #006fba
}

.font-black {
    color: #000!important;
    display: table;
    margin-top: 10px;
    font-size: 14px
}

.side-pro li {
    margin: 15px 0;
    font-size: 16px
}

/* side */

/* index */
.banner .swiper-slide {
    position: relative
}

.banner .caption {
    position: absolute;
    z-index: 10;
    left: 10%;
    top: 30%
}
.banner .caption span {
    font-size: 18px
}
.banner .caption h1 {
    text-transform: uppercase;
    font-weight: 700;
    margin-top: 3px
}
.banner .caption p {
    color: #555
}
@media(min-width:768px) and (max-width:992px) {
    .banner .caption {
        top: 20%
    }
    .banner .caption h1 {font-size:30px}
}

.banner .swiper-pagination {
    bottom: 10px;
    width: 100%
}

.banner .swiper-pagination-bullet {
    margin: 0 5px;
    opacity: 0.8
}

.my-breadcrumb {
    border-bottom: 1px solid #ddd;
    margin-bottom: 20px;
    font-size: 12px
}
.my-breadcrumb .breadcrumb {
    background: transparent;
    display: table;
    float: left;
    margin-bottom: 0
}
.my-breadcrumb i {
    float: left;
    margin-top: 4px;
    color: #006fba
}

a.more-btn {
    display: table;
    padding: 8px 15px;
    background: #006fba;
    color: #fff;
    font-weight: 600
}

.home-tit {
    text-align: center;
    margin-bottom: 30px
}
.home-tit h2 {
    font-weight: 600
}
.home-tit p {
    color: #555
}

.about-con {
    margin-top: 15px;
    margin-bottom: 30px
}

.about-con img {
    margin: 0 auto
}
.aboutImg01 {
    box-shadow: 6px 6px 0px #006fba
}

.product-con,.cert-con {
    padding: 15px 0 50px 0;
    background: #f0f0f0
}

.homePro-item {
    background: #fff
}
.homePro-item img,.cert-item img {
    margin: auto
}
.homePro-img {position: relative}
.homePro-img:before {
    position: absolute;
    content: " ";
    width: 0;
    height: 0;
    z-index: 10;
    top: 45%
}
.homePro-img.imgL:before {
    left: 0;
    border-top: 10px solid transparent;
    border-left: 15px solid #fff;
    border-bottom: 10px solid transparent
}
.homePro-img.imgR:before {
    right: 0;
    border-top: 10px solid transparent;
    border-right: 15px solid #fff;
    border-bottom: 10px solid transparent
}

.homePro-img img {
	opacity: 0.4
}
.homePro-item:hover .homePro-img img {
	opacity: 1
}

.homePro-item .caption {
    background: #fff;
    overflow: hidden;
    padding: 10px 0
}
.homePro-item .caption h4 {
    margin: 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #ddd
}
.homePro-item .caption p {
    margin-top: 20px;
    margin-bottom: 0;
    line-height: 1.8em
}
.product-con a.more-btn {
    margin-top: 30px;
    margin-left: auto;
    margin-right: auto;
    font-weight: normal
}

.news-con {
    padding: 15px 0 30px 0
}

.news-item {
    margin-bottom: 30px
}

.news-item img {
    margin: 0 auto 10px auto
}
.news-item h5 a {
    font-weight: 600;
    height: 31px;
    word-break:break-all;
    overflow: hidden;
    display: block
}
.news-item p {
    color: #777
}

.cert-item {
    margin-bottom: 15px
}

.contact-con {padding: 15px 0}
.contact-con h3 {margin-top: 0}
.contact-con h3 a {
    color: #006fba
}
.contact-con p {
    color: #666
}
.contact-con>div>a {
    background: #006fba;
    color: #fff;
    padding: 8px 20px;
    border-radius: 5px;
    font-weight: 600;
    font-size: 16px;
    margin-top: 12px;
    display: table
}

.post-content {
    margin-bottom: 40px
}

.bg-gray {
    background: #f5f5f5;
    padding-bottom: 50px;
    position: relative;
    margin-bottom: 50px
}

.contact-msg,.contact-map {position: relative}
.contact-msg>div {
    background: #fff;
    padding: 15px;
    height: 100%;
    border-radius: 5px
}

form .input-group-addon {
    padding-top: 3px;
    padding-bottom: 3px
}

.childList li a {
    display: table;
    padding: 5px 15px;
    border: 1px solid #ddd
}
.childList li.active a {
	font-weight: bold;
    color: #f17b12
}

.product-list>h4,.post-container>h4 {
    margin-top: 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #ddd;
    position: relative;
    padding-left: 10px;
    margin-bottom: 15px
}
.product-list>h4:before,
.post-container>h4:before {
    content: " ";
    position: absolute;
    width: 2px;
    height: 15px;
    left: 0;
    top: 3px;
    background: #006fba
}

.product-list-item {
    position: relative;
    border-radius: 5px;
    box-shadow: 0px 2px 4px #aaa;
    overflow: hidden;
    margin-bottom: 30px
}
.product-list-item>a>img {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    margin: 0 auto 50px auto
}

.product-list-item .caption {
    padding: 10px;
    position: absolute;
    left: 0;
    bottom: -80px;
    background: #fff;
    width: 100%;
    transition: all 0.8s ease-in-out
}
.product-list-item .caption h4 {
    margin-bottom: 20px
}
.product-list-item .caption h4 a {
    display: block;
    overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap
}
.product-list-item .caption p {
    color: #8e8e8e
}
.product-list-item .add-btn {
    position: absolute;
    right: 10px;
    top:-20px
}

.product-list-item:hover .caption {
    bottom: 0
}

.spec-items {
    display: block;
    margin-top: 15px;
    margin-bottom: 30px
}
.spec-items>ul {
    display: block
}
.spec-items>ul>li {
    width: 20%;
    width: 20%\9;
    float: left;
    padding: 2px 5px
}
.spec-items>ul>li>a {
    width: 100%
}

.pro-summary .email {
    background: #006fba;
    color: #fff;
    display: table;
    width: 100%;
    text-align: center;
    padding: 5px 0
}

.check-card {
    height: 30px;
    border-bottom: 1px solid #ddd;
    margin-top: 30px
}
.check-card span {
    display: table;
    text-align: center;
    padding: 5px 20px;
    color: #fff;
    background: #0065b3
}

.product-content {
    padding: 20px 0
}
.product-content table {
    width: 100%;
    border: 1px solid #ddd;
    border-collapse:collapse
}
.product-content table td {
    border: 1px solid #ddd;
    word-break: break-all
}
.product-content img {
    display: block;
    max-width: 100%;
    height: auto
}

.sup-box {
    margin-bottom: 40px
}

.news-list li {
    margin: 15px 0;
    border: 1px dashed transparent;
    border-bottom: 1px dashed #ddd;
    padding-left: 15px;
    padding-right: 15px;
    transition: 0.3s all

}
.news-list li span {margin-top: 10px;margin-left: 10px}
.news-list li:hover {
    border-color: #006fba;
    border-style: solid
}

.news-page h2,.news-page .main-content {
    border-bottom: 1px solid #ddd;
    padding-bottom: 15px
}

.rela-prod,.rela-news {
    box-shadow: 0px 0px 5px #666;
    margin-bottom: 15px
}
.rela-prod .caption {
    padding: 5px 10px 5px 10px
}

.rela-news {
    padding: 10px;
    
}

/* index */

/* foot */
footer {
    color: #aaa;
    background: #252525
}
footer a { color: #aaa}

.foot-main {
    padding: 30px 0 20px 0
}

.foot-main h4 {
    color: #fff;
    margin-bottom: 20px
}

.foot-main address {
    margin-bottom: 6px
}

.foot-pclass {
    padding-left: 10px
}
.foot-pclass li {
    margin: 10px 0
}
.foot-pclass a:hover {
    color: #006fba
}

.foot-main .input-group,.foot-main .form-control {
    width: 100%;
    max-width: 255px;
}
.foot-main .form-control {
    background: #303030;
    border: 0;
    margin-bottom: 15px
}
.footer-search-btn {
    background: #006fba;
    color: #fff;
    border-radius: 5px;
    font-size: 12px;
    padding-left: 25px;
    padding-right: 25px
}

.foot-bottom {
    background: #1a1a1a;
    padding: 8px 0
}

/* foot */

.my-breadcrumb:before,.my-breadcrumb:after,.side-pro li:before,.side-pro li:after,.news-list li:before,.news-list li:after,.spec-items:before,.spec-items:after {
    content: " ";
    display: table
}
.my-breadcrumb:after,.side-pro li:after,.news-list li:after,.spec-items:after {
    clear: both
}

@media(min-width:768px) {
    .navbar-collapse .nav {
        margin-top: 16px
    }

    .navbar-right .dropdown-menu {
        left: 0;
        right: auto
    }

    .nav li {
        margin-left: 3px;
        margin-right: 3px
    }

    .pl-0 {
        padding-left: 0
    }
    .pr-0 {
        padding-right: 0
    }
    .p-0 {
        padding: 0
    }
    .mRow {
        margin-left: 0;
        margin-right: 0
    }

    .homePro-item .caption {
        padding:10px;
        min-height: 180px
    }
    .homePro-item .caption h4 {
        font-size: 18px
    }
    .homePro-item .caption p {
        margin-top: 10px;
        line-height: 1.8em;
        font-size: 14px
    }

    header .input-group {
        max-width: 206px
    }
}

@media(min-width:992px) {
    .nav li {
        margin-left: 6px;
        margin-right: 6px
    }

    .homePro-item .caption {
        padding:20px;
        height: 235px
    }
    .homePro-item .caption h4 {
        font-size: 20px
    }
    .homePro-item .caption p {
        margin-top: 20px
    }

    .contact-con>div>a {
        position: absolute;
        right: 0;
        top: 0
    }

    .contact-msg>div,.contact-map>div {
        position: absolute;
        box-shadow: 2px 2px 3px #999;
        top: -60px
    }
    .contact-msg,.contact-map {
        float: left;
        padding-left: 15px;
        padding-right: 15px
    }
    .contact-msg {
        width: 33%
    }
    .contact-map {
        width: 66%
    }
    .contact-msg,.contact-map,.contact-map img {
        height: 412px
    }

    .side-pl-0 {
        padding-left: 0
    }
}

@media(min-width:1200px) {
    .nav>li {
        margin-left: 15px;
        margin-right: 15px
    }

    .homePro-item .caption {
        height: 285px
    }
}

@media(max-width:768px) {
    .logo {
        width: 90px
    }

    .head-contact {
        margin-bottom: 10px
    }

    .clear-768 {
        clear: both;
    }

    .home-tit p {
        display: none
    }

    .homePro-item {
        margin-bottom: 15px
    }
    .homePro-item .caption p {
        margin-top: 10px
    }

    .foot-main>div>div>div {
        margin-bottom: 15px
    }

    form .form-inline .btn-primary {
        margin-top: 15px
    }
}
/*手机端底部菜单*/
.mobile-nav{position: fixed;bottom: 0;left: 0;right: 0;height: 48px; background: #006fba;z-index: 999;display: flex;border-top: 2px solid #fff;}
.mobile-nav .item{width: 25%;border-left: 1px solid rgba(255,255,255,.2);}
.mobile-nav .item a{font-size: 12px;color: #fff;display: block; text-align: center;line-height: 20px;padding-top: 8px;}
.mobile-nav .item:first-child{border-left: 0px;}
.mobile-nav .item a:before{font-family: fontawesome; font-size: 14px; color: #fff;display: block; line-height: 16px;}
.mobile-nav .mobile-nav-home:before{content: "\f015";font-family: fontawesome; font-size: 14px;}
.mobile-nav .mobile-nav-pro:before{content: "\f07a";font-family: fontawesome; font-size: 14px;}
.mobile-nav .mobile-nav-tel:before{content: "";font-family: fontawesome; font-size: 14px;}
.mobile-nav .mobile-nav-feedback:before{content: "\f0e0";font-family: fontawesome; font-size: 14px;}

.reveal-modal-bg{position:fixed;height:100%;width:100%;z-index:1000;display:none;top:0;left:0;background:rgba(00,00,00,0.8);}
.reveal-modal{visibility:hidden;top:50px;left:50%;margin-left:-45%;width:90%;position:absolute;z-index:1001;padding:25px;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;-moz-box-shadow:0 0 10px rgba(0,0,0,.4);-webkit-box-shadow:0 0 10px rgba(0,0,0,.4);-box-shadow:0 0 10px rgba(0,0,0,.4);background-color:#FFF;}
.reveal-modal h2{font-size:20px;text-align:center;}
.reveal-modal .close-reveal-modal{font-size:30px;line-height:0.5;position:absolute;top:8px;right:11px;color:#333;text-shadow:0 -1px 1px rbga(0,0,0,.6);font-weight:bold;cursor:pointer;}
.reveal-modal-pro{visibility:hidden;top:0;left:0;width:100%;position:absolute;z-index:1001;background-color:#f7f7f7;height:100vh; overflow-y:auto;}
.reveal-modal-pro h2{width:100%;text-align:center;font-size:18px;text-transform:uppercase;line-height:45px;background:#fff;margin-bottom:0;}
.reveal-modal-pro h3{width:100%;font-size:16px;text-transform:uppercase;line-height:45px;font-weight:bold;background:#e4e4e4;padding-left:15px;margin-bottom:0;}
.reveal-modal-pro ul,.reveal-modal-pro ul li{list-style:none;padding:0;margin:0;}
.reveal-modal-pro .mb-pro-nav>li{border-top:1px solid #fff;border-bottom:1px solid #ddd;font-size:14px;line-height:1.2;text-transform:capitalize;position:relative;}
.reveal-modal-pro .mb-pro-nav>li>a{padding-left:20px;}
.reveal-modal-pro .mb-pro-nav>li a{display:block;padding-top:12px;padding-bottom:12px;padding-right:20px;}
.reveal-modal-pro .mb-pro-nav>li ul{display:none;}
.reveal-modal-pro .mb-pro-nav .hasul>a:after{content:'\f107';font-family:fontawesome;color:#999;font-size:18px;position:absolute;width:12px;height:18px;line-height:18px;text-align:center;right:10px;top:13px;font-weight:400;}
.reveal-modal-pro .mb-pro-nav>li.active>a{font-weight:bold;background:#eee;}
.reveal-modal-pro .mb-pro-nav>li.active{background:#eee;border-bottom:3px solid #dadada;}
.reveal-modal-pro .mb-pro-nav>li ul li{border-top:1px dotted #ccc;font-size:12px;}
.reveal-modal-pro .mb-pro-nav>li ul li a{padding-left:36px;}
.reveal-modal-pro .close-reveal-modal{font-size:30px;line-height:0.5;position:absolute;top:11px;right:11px;color:#333;text-shadow:0 -1px 1px rbga(0,0,0,.6);font-weight:bold;cursor:pointer;}

@media(max-width:768px) {
    .totop{z-index: 99;bottom: 60px;}
    footer {margin-bottom: 48px; }
}