@charset "utf-8";
@import url("styles.css");
/*
   * The wx.zhangruiwoloveni *
   * http://wxizz.com/ *
   * Released on: 2018,12,20 *
*/  

/* header */
.top {
    background-color: #fff;
    box-shadow: 0 0 16px #454545;
    width: 100%;
    padding: 20px 0;
    position: fixed;
    top: 0;
    z-index: 99999;
}
.topheight {
    height: 100px;
}
.header,
.wrapper,
.columns {
    width: 1200px;
    margin: 0 auto;
}
.header {
    position: relative;
}
.header .language {
    position: absolute;
    top: -14px;
    right: 0;
}
.header .language span {
    display: inline-block;
    height: 15px;
    line-height: 15px;
    padding-left: 26px;
    margin-left: 15px;
}
.header .language span.cn {
    background: url(/images/cn.jpg) left top no-repeat;
}
.header .language span.en {
    background: url(/images/en.jpg) left top no-repeat;
}
.header .logo {
    width: 204px;
    height: 60px;
    overflow: hidden;
}
.header .nav {
    width: 786px;
}
.header .nav ul {
    margin: 12px 0 0 40px;
}
.header .nav li {
    float: left;
}
.header .nav li a {
    display: block;
    color: #333;
    padding: 9px 23px 10px;
    border-radius: 18px;
    margin: 0 2px;
}
.header .nav li a:hover,
.header .nav li a.on {
    /* background-color: #1ba754; */
    color: #1ba754;
    text-decoration: none;
    border-bottom: 5px solid #1ba754;
}
.header .contacts {
    width: 150px;
    background: url(/images/toptel.gif) left center no-repeat;
    width: 155px \9;
    background: url(/images/ie8toptel.gif) left center no-repeat \9;
    background-size: 18%;
    min-height: 53px;
    padding-left: 45px;
    margin-top: 2px;
    padding-top: 5px;
    overflow: hidden;
}
.header .contacts span {
    display: block;
    line-height: 16px;
    padding-top: 6px;
}
.header .contacts span.tel-bt {
    padding-top: 3px;
}
.header .contacts span.tel {
    font-size: 20px;
    color: #DD1C21;
}

/* wrapper */
.wrapper > .abouts {
    background-color: #eee;
    margin: 30px 0;
}
.wrapper > .abouts > .pics {
    width: 801px;
    height: 390px;
    overflow: hidden;
} 
/*.wrapper > .abouts > .infos {
    width: 349px;
    height: 340px;
    padding: 25px;
    position: relative;
}*/
.wrapper > .abouts > .infos {
    
    height: 220px;
    padding: 25px;
    position: relative;
}
.wrapper > .abouts > .infos > .title {
    color: #333;
    padding: 10px 0 18px
}
/* .wrapper > .abouts > .infos > .title::after {
    display: block;
    content: "";
    overflow: hidden;
    height: 1px;
    width: 25px;
    border-top: 1px solid #333; 
    margin-top: 15px;
} */
.wrapper > .abouts > .infos > .title > span {
    display: block;
    content: "";
    overflow: hidden;
    height: 1px;
    width: 25px;
    border-top: 1px solid #333; 
    margin-top: 15px;
}
.wrapper > .abouts > .infos > .content {
    color: #666
}
.wrapper > .abouts > .infos > .more {
    position: absolute;
    left: 25px;
    bottom: 38px;
}
.wrapper > .abouts > .infos > .more a {
    display: block;
    width: 120px;
    background-color: #059939;
    color: #fff;
    border-radius: 18px;
}
.wrapper > .abouts > .infos > .more a:hover {
    text-decoration: none;
    background-color: #DD1C21;
}
.product-title {
    width: 100%;
    background-color: #eee;
    padding: 25px 0;
    color: #333;
}
.product-title > span,
.wrapper .news > .title span,
.footer .footer-title span {
    display: block;
    content: "";
    overflow: hidden;
    height: 1px;
    width: 25px;
    margin: 12px auto 0;
    border-top: 1px solid #333;
}
.wrapper .products {
    margin-top: 30px;
}
/* .wrapper .products > .subnav {
    margin: 20px 0
}
.wrapper .products > .subnav li {
    display: inline-block;
    margin: 10px 2px
}
.wrapper .products > .subnav li a {
    color: #343434;
    background-color: #f0f0f0;
    padding: 11px 23px;
    display: inline-block;
    border-radius: 5px;
}
.wrapper .products > .subnav li a:hover {
    text-decoration: none;
    background-color: #DD1C21;
    color: #fff
} */

.pro-subnav {
    width: 250px;
    border: 1px solid #E7E7E7;
    padding: 18px 15px;
    background-color: #fcfcfc;
}
.pro-subnav .sub-title {
    border-bottom: 1px solid #E7E7E7;
    padding: 5px 0 15px 8px;
    color: #059939
}
.pro-subnav .sub-list {
    padding: 10px 0 0;
}
.pro-subnav .sub-list dl {
    padding: 0;
}
.pro-subnav .sub-list dl a i {
    display: inline-block;
    margin-right: 6px;
    color: #999;
    font-weight: bold;
}
.pro-subnav .sub-list dl a:hover i {
    color: #fff;
}
.pro-subnav .sub-list dl a {
    display: block;
    color: #666;
    border-bottom: 1px solid #f2f2f2;
    line-height: 40px;
    padding: 0 0 0 10px;
    font-weight: bold;
}
.pro-subnav .sub-list dl a:hover {
    text-decoration: none;
    color: #fff;
    background-color: #059939;
    border-radius: 2px;
}
.pro-subnav .sub-list dl a.on,
.pro-subnav .sub-list dl a.on i {
    text-decoration: none;
    color: #DD1C21;
}
.pro-subnav .sub-list dd a {
    font-weight: normal;
    font-size: 13px;
    padding-left: 28px;
}
.pro-subnav .sub-list dd a i {
    font-weight: normal;
} 
.wrapper .products > .list {
    width: 910px;
}
.wrapper .products > .list ul {
    overflow: hidden;
}
.wrapper .products > .list ul::after {
    content:'';
    display: block;
    clear: both;
}
.wrapper .products > .list li {
    float: left;
    margin: 0 0 15px 10px;
}
.wrapper .products > .list li img {
    max-width: 213px;
    max-height: 218px;
    width: 100% \9;
}
.wrapper .products > .list li img:hover {
    opacity: 0.8;
    filter:alpha(Opacity=80);
}
.wrapper .products > .list li .link-pic {
    display: table-cell;
    vertical-align: middle;
    overflow: hidden;
    width: 215px;
    height: 220px;
    border: 1px solid #E7E7E7;
}
.wrapper .products > .list li p {
    padding-top: 10px;
}
.wrapper .products > .list li a {
    color: #343434;
}
.wrapper .products > .list li a:hover {
    color: #DD1C21;
}
.wrapper .products > .more,
.wrapper .news > .more {
    margin: 28px 0 50px;
}
.wrapper .products > .more a,
.wrapper .news > .more a {
    display: inline-block;
    width: 122px;
    background-color: #059939;
    color: #fff;
    border-radius: 18px;
}
.wrapper .products > .more a:hover,
.wrapper .news > .more a:hover {
    text-decoration: none;
    background-color: #DD1C21;
}
/* 
.news-main {
    background-color: #eee;
    width: 100%;
}
.wrapper .news {
    padding: 35px 30px 10px;
}
.wrapper .news > .title {
    color: #333;
    margin: 10px 0 27px;
}
.wrapper .news > .list {
    position: relative;
    margin-bottom: 45px;
}
.wrapper .news > .list li {
    float: left;
    background-color: #fff;
    margin: 0 10px;
    width: 360px;
    overflow: hidden;
    position: relative;
}
.wrapper .news > .list li .news-pic {
    height: 238px;
    overflow: hidden;
}
.wrapper .news > .list li .news-pic img {
    width: 100%;
    transition: all 0.6s
}
.wrapper .news > .list li .news-pic img:hover {
    transform: scale(1.1)
}
.wrapper .news > .list li .news-info {
    padding: 20px 20px 30px;
}
.wrapper .news > .list li .title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.wrapper .news > .list li .title,
.wrapper .news > .list li .title a {
    color: #02a645;
}
.wrapper .news > .list li .title a:hover {
    color: #DD1C21;
}
.wrapper .news > .list li .desc {
    color: #999;
    padding: 10px 0 8px
}
.wrapper .news > .list li .time {
    color: #ccc;
    border-top: 1px solid #f5f5f5;
}
.wrapper .news > .list li .time i {
    padding-right: 5px;
    display: inline-block;
}
.wrapper .news > .list li .triangle {
    position: absolute;
    bottom: 0;
    right: 0;
    border: 15px solid transparent;
    border-right-color: #059939;
    border-bottom-color: #059939;
}
.wrapper .news > .list .hd2 .prev,
.wrapper .news > .list .hd2 .next {
    position:absolute;
    top:42%;
    cursor:pointer;
    background: url(/images/index_bar.png) no-repeat;
    width: 45px;
    height: 73px;
}
.wrapper .news > .list .hd2 .prev:hover,
.wrapper .news > .list .hd2 .next:hover {
    background-position: bottom left;
}
.wrapper .news > .list .hd2 .prev {
    left: -70px;
    background-position: left top;
}
.wrapper .news > .list .hd2 .next {
    right: -70px;
    background-position: right top;
}
.wrapper .news > .list .hd2 .next:hover {
    background-position: bottom right;
} */

.wrapper .links {
    margin: 35px 0;
    background-color: #f9f9f9;
    border-right: 8px solid #059939
}
.wrapper .links-left {
    background-color: #059939;
    width: 110px;
    padding: 6px 0
}
.wrapper .links-list {
    width: 1082px;
    padding: 6px 0
}
.wrapper .links-list a {
    color: #9e9e9e;
    padding: 0 12px;
    border-right: 1px solid #bbb
}
.wrapper .links-list a:hover {
    color: #DD1C21
}


/* columns */
.columns {
    padding: 20px 0;
}
.columns .columns-title {
    padding: 40px 0 30px;
}
.columns .columns-title .title {
    color: #333;
}
.columns .columns-title .entitle {
    color: #666;
    text-transform:uppercase;
}
.columns .container {
    padding: 0 100px 50px;
    color: #333;
}
.columns .container a {
    color: #333
}
.columns .container img {
    max-width: 100%;
}


/* list */
.newslist {
    padding: 0 80px 50px;
}
.newslist li {
    margin: 7px 0
}
.newslist li a {
    color: #555;
    display: block;
    background-color: #f6f6f6;
    padding: 16px 15px;
    border-radius: 5px;
}
.newslist li a i {
    color: #777;
    display: inline-block;
    margin: 0 7px 0 2px;
}
.newslist li a span {
    color: #777;
    display: inline-block;
    margin-right: 5px
}
.newslist li a:hover,
.newslist li a:hover i,
.newslist li a:hover span {
    text-decoration: none;
    background-color: #01A945;
    color: #fff;
}
.newslist li a:hover i,
.newslist li a:hover span {
    background-color: 0 none;
    color: #fff;
}

/* details */
.details {
    padding: 0 80px 50px;
}
.details .title {
    color: #059939
}
.details .time {
    background-color: #f9f9f9;
    color: #aaa;
    padding: 6px 0;
    border-radius: 1px;
    margin: 16px 0;
    border: 1px solid #f0f0f0;
}
.details .time i {
    display: inline-block;
    padding: 0 5px 0 5px;
}
.details .pics {
    margin: 35px 0 15px;
}
.details .pics img {
    max-width: 100%;
}
.details .procontent {
    background-color: #f5f5f5;
}
.details .procontent table {
    width: 100%;
}
.details .content,
.details .procontent {
    color: #666;
    padding: 10px 15px 20px;
}
.details .content a,
.details .procontent a {
    color: #666
}
.details .content img,
.details .procontent img {
    max-width: 100%;
}
.details .procontent .down,
.details .procontent .down a {
    display: block;
    color: #333;
}
.details .next {
    border-top: 1px solid #eee;
    color: #888;
    padding: 20px 15px
}
.details .next a {
    color: #888;
}
.details .next a:hover {
    color: #DD1C21
}

.details .info-r {
    width: 860px;
    border: 1px solid #E7E7E7;
    background-color: #fcfcfc;
    padding: 20px;
}


/* product */
.product {
    padding: 0;
}
/*
.product .subnav {
    margin-bottom: 20px;
}
.product .subnav li {
    display: inline-block;
    margin: 10px 2px;
}
.product .subnav li a {
    color: #343434;
    background-color: #f0f0f0;
    padding: 11px 23px;
    display: inline-block;
    border-radius: 5px;
}
.product .subnav li a:hover,
.product .submenu li a:hover,
.product .subnav li a.on,
.product .submenu li a.on {
    text-decoration: none;
    background-color: #DD1C21;
    color: #fff
}
.product .submenu {
    margin-bottom: 25px;
}
.product .submenu li {
    display: inline-block;
    margin: 0 1px 10px;
}
.product .submenu li a {
    color: #666;
    background-color: #f5f5f5;
    padding: 6px 17px;
    border-radius: 3px;
}
*/

/* .product .subnav {
    border: 1px solid #E7E7E7;
    padding: 25px 30px;
    margin-bottom: 15px;
}
.product .subnav dl {
    margin: 5px 0;
    background-color: #f5f5f5;
}
.product .subnav dl::after {
    content: "";
    display: block;
    clear: both;
}
.product .subnav dl a {
    display: inline-block;
}
.product .subnav dl a:hover {
    text-decoration: none;
}
.product .subnav dt {
    float: left;
    text-align: center;
    margin-right: 2px;
}
.product .subnav dt a {
    color: #333;
    width: 120px;
    background-color: #eee;
}
.product .subnav dt a:hover {
    background-color: #DD1C21;
    color: #fff;
}
.product .subnav dd {
    float: left;
    margin-left: 3px; 
    font-size: 13px;
}
.product .subnav dd a {
    color: #666;
    padding: 0 10px;
    border-right: 1px solid #fff;
}
.product .subnav dd a:hover {
    background-color: #DD1C21;
    color: #fff;
} */

.product .productlist {
    width: 910px;
}
.product .productlist ul,
.photo ul {
    overflow: hidden;
}
.product .productlist li,
.photo li {
    float: left;
    margin: 0 0 15px 10px;
}
.product .productlist li img,
.photo li img {
    max-width: 213px;
    max-height: 218px;
    width: 100% \9;
}
.product .productlist li img:hover,
.photo li img:hover {
    opacity: 0.8;
    filter:alpha(Opacity=80);
}
.product .productlist li .link-pic,
.photo li .link-pic {
    display: table-cell;
    vertical-align: middle;
    overflow: hidden;
    width: 215px;
    height: 220px;
    border: 1px solid #E7E7E7;
}
.product .productlist li p,
.photo li p {
    padding-top: 10px;
}
.product .productlist li a,
.photo li a {
    color: #343434;
}
.product .productlist li a:hover,
.photo li a:hover {
    color: #DD1C21;
}

/* photo */
.photo {
    padding: 0;
}
.photo ul {
    margin-right: -10px;
}
.photo li {
    margin: 0 10px 15px 0;
}
.photo li img {
    width: 290px;
    max-height: 220px;
}
.photo li .link-pic {
    display: table-cell;
    vertical-align: middle;
    overflow: hidden;
    width: 290px;
    height: 220px;
    border: 1px solid #E7E7E7;
}

/* Next */
.cp-Next { 
    width:100%;
    padding:15px 0 0;
}

/* message */
.message {
    padding: 0;
}
.message .msg {
    padding: 0;
}
.message .msg-form {
    padding: 0;
}
.message .msg-form li {
    margin-bottom: 8px;
    display: block;
}
.message .msg-form li span {
    display: inline-block;
    vertical-align: top;
}
.message .msg-form li span i {
    color: #f00;
    padding-right: 5px;
}
.message .msg-form li input,
.message .msg-form li textarea {
    border: 0 none;
}
.message .msg-form li .ipt {
    border: 1px solid #BDBFC0;
    padding: 5px;
    width: 55%;
    color: #666;
}
.message .msg-form li .texta {
    height: 80px;
    vertical-align: middle;
}
.message .msg-form li .ipt-code {
    width: 40%;
}
.message .msg-form li img {
    height: 26px;
    display: inline-block;
    vertical-align: -8px;
    margin-left: 3px;
}
.message .msg-form li .btn {
    background: #990000;
    color: #fff;
    padding: 6px 6%;
    cursor: pointer;
    margin-left: 59px;
}

/* footer */
.footer {
    width: 100%;
    background-color: #2C2C2C;
}
.footer .footer-top {
    padding: 55px 0 50px;
    width: 1200px;
    margin: 0 auto;
}
.footer .footer-contacts {
    width: 345px;
    color: #b1b1b1;
}
.footer .footer-contacts li {
    margin: 10px 0;
}
.footer .footer-contacts li i {
    display: inline-block;
    width: 18px;
    text-align: center;
    margin-right: 7px;
}
.footer .footer-columns {
    width:600px;
    padding-right: 10px;
}
.footer .footer-columns li {
    float: left;
    margin: 2px 10px 8px 0;
}
.footer .footer-columns li a {
    color: #b1b1b1;
    display: block;
    border: 1px solid #565656;
    padding: 10px 19px;
}
.footer .footer-columns li a:hover {
    text-decoration: none;
    border-color: #059939;
    background-color: #059939;
    color: #fff;
}
.footer .footer-wechat {
    width: 220px;
}
.footer .footer-wechat .wechat {
    width: 70%;
}
.footer .footer-wechat .wechat img {
    width: 80%;
}
.footer .footer-wechat .wechat-ico {
    width: 30%;
    color: #565656;
}
.footer .footer-wechat .wechat-ico i {
    display: block;
    font-size: 8em;
    color: #565656;
    height: 87px;
    position: relative;
    top: -5px;
}
.footer .footer-title {
    margin-bottom: 25px;
    color: #e8e8e8
}
.footer .footer-title span {
    border-color: #616161;
    margin: 12px 0;
}
.footer .copyright {
    width: 100%;
    background-color: #1F1F1F;
    color: #7e7e7e;
    padding: 18px 0;
}
.footer .copyright a {
    color: #7e7e7e
}
p#back-to-top{
    position:fixed;
    display:none;
    bottom:50px;
    right:20px;
}
p#back-to-top a{
    text-align:center;
    display:block;
    width:50px;
    -moz-transition: color 1s;
    -webkit-transition: color 1s;
    -o-transition: color 1s;
}
p#back-to-top a{
    background:transparent url(/images/top_btn.png) no-repeat;
    display:block;
    height: 50px;
    width: 50px;
    border-radius: 50%;
    border: 1px #F3F3F3 solid;
    -moz-transition:background 1s;
    -webkit-transition:background 1s;
    -o-transition:background 1s;
}