/* 产品系列 */
.product-nav-list{ display: block; text-align: center; font-size: 0; margin: .28rem 0;}
.product-nav-list ul{ display: block;}
.product-nav-list ul li{ display: inline-block; margin: .1rem;}
.product-nav-list ul li a{ color: #fff; font-size: .24rem; height: 1.5rem; line-height: 1.5rem; width: 4rem; display: block; position: relative; z-index: 1; transition: all 0.3s ease-in-out;}
.product-nav-list ul li a span{ position: relative; z-index: 3;}
.product-nav-list ul li a .img{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: block; z-index: 1;}
.product-nav-list ul li a::after{ content: ""; width: 100%; height: 100%; display: block; position: absolute; left: 0; top: 0; background: #007909; opacity: .4; z-index: 2; transition: all 0.3s ease-in-out;}
.product-nav-list ul li a.cur::after{ opacity: .8;}
.product-nav-list ul li a:hover::after{ opacity: .8;}
.product-nav-list .title{ display: block; text-align: center; font-size: 0; position: relative; margin: .5rem 0 .43rem;}
.product-nav-list .title::before,.product-nav-list .title::after{ content: ""; vertical-align: middle; height: 1px; width: 2.2rem; display: inline-block; background: #a6a6a6;}
.product-nav-list .title .tit{ display: inline-block; padding: 0 .26rem; vertical-align: middle;}
.product-nav-list .title .tit h2{ display: block; color: #20853a; font-size: .24rem; line-height: .32rem; font-weight: bold;}
.product-nav-list .title .tit h3{ display: block; color: #878787; font-size: .16rem;}


/* productlist */
.productslist{ width: 100%; display: block; font-size: 0; background: #fff;}
.productslist li{ width: 25%; display: inline-block; height: auto; box-sizing: border-box; padding: .15rem;}
.productslist li a{ width: 100%; float: left; position: relative;}
.productslist li .pic{ position: relative; z-index: 2; border: 12px solid #20853a; overflow: hidden; transition: all 0.3s ease-in-out}
.productslist li .pic img{ max-width: 100%; max-height: 100%; float: left;}
.productslist li .tit{ width: 100%; background: #eee; font-size: .14rem; text-align: center; line-height: .4rem; color: #007909; font-weight: bold;}
.productslist li a:hover{ opacity: .7;}


.products{ font-size: .12rem;}


/* 产品详情 */
.n-cp-view{ width: 100%; display: block;}
.n-cp-view .ms{ width: 100%; display: block; text-align: center; font-size: .14rem; color: #666; line-height: .24rem; margin-bottom: .6rem;}
.n-cp-view .ms span{ display: block;}
.n-cp-view .text{ display: block; font-size: 0;}
.n-cp-view .text .list{ display: inline-block; width: 50%; position: relative; vertical-align: top;}
.n-cp-view .text .list li{text-align: center;}
.n-cp-view .text .list img{max-width: 520px;}
.n-cp-view .text .list .prev,
.n-cp-view .text .list .next{ position: absolute; width: .4rem; height: .6rem; line-height: .6rem; text-align: center; font-size: .48rem; font-family: "iconfont"; color: #23863c; top: 50%; transform: translateY(-50%); z-index: 99; cursor: pointer;}
.n-cp-view .text .list .prev{ left: 0; }
.n-cp-view .text .list .next{ right: 0px;}

.n-cp-view .text .list .swiper-pagination-bullet-active{ background: #20853a !important;}
.n-cp-view .text .type{ width: 46%; margin-left: 4%; display: inline-block; vertical-align: top;}
.n-cp-view .text .type .thumbs{ display: block; border-width: 1px 0 1px 0; border-style: solid; border-color: #ddd;}
.n-cp-view .text .type .thumbs li{ display: inline-block; background: #eee; line-height: .24rem; text-align: center; font-size: .16rem; padding: .12rem .08rem; border-right: 1px solid #ddd; color: #666; cursor: pointer; transition: all 0.3s ease-in-out;}
.n-cp-view .text .type .thumbs li:nth-last-child(1){ border: none;}
.n-cp-view .text .type .thumbs li.swiper-slide-thumb-active{ background: #20853a; color: #fff;}



.n-cp-view .text .type .gallery{ display: block; margin-top: .2rem;}
.n-cp-view .text .type .gallery li{ display: block;}
.n-cp-view .text .type .gallery li p{ font-size: .16rem; line-height: 1.5; display: block;}
.n-cp-view .text .type .gallery li .parameter{ display: block; background: #f5f5f5; line-height: .48rem}
.n-cp-view .text .type .gallery li .parameter:nth-of-type(2n){ background: #fff;}
.n-cp-view .text .type .gallery li .parameter b{ width: 40%; display: inline-block; color: #333; font-size: .16rem; padding-left: .2rem; box-sizing: border-box;}
.n-cp-view .text .type .gallery li .parameter span{ width: 60%; display: inline-block; color: #333; font-size: .16rem; padding-left: .2rem; box-sizing: border-box;}
.n-cp-view .case-photo{ display: block; margin-top: .3rem;}
.n-cp-view .case-photo .name{ background: #eee; display: block;}
.n-cp-view .case-photo .name b{ width: 2rem; text-align: center; line-height: .6rem; font-size: .24rem; font-weight: bold; color: #fff; background: #20853a; display: inline-block;}
.n-cp-view .case-photo ul {font-size: 0;}
.n-cp-view .case-photo ul img {width: 24%; margin: 1% 0.66%; display: inline-block; vertical-align: top;}
.n-cp-view .case-photo ul img:nth-child(4n-3) {margin-left: 0}
.n-cp-view .case-photo ul img:nth-child(4n) {margin-right: 0}

@media screen and (max-width: 734px){
    .main{ width: 100%; padding: 0;}
    .product-nav-list{ margin: 0;}
    .product-nav-list ul{ display: flex; margin-top: .1rem; flex-wrap: wrap; justify-content: center;}
    .product-nav-list ul li{ width: 30%; margin: 1%; overflow: hidden;}
    .product-nav-list ul li a{ width: 100%; font-size: .16rem; line-height: 1rem; height: 1rem;}
    .product-nav-list ul li img{max-height: 100%;}
    .product-nav-list .title{ margin: .3rem 0;}
    .product-nav-list .title::before,.product-nav-list .title::after{ width: .8rem;}
    .productslist li{ width: 50%; display: inline-block; height: auto; box-sizing: border-box; padding: 1%;}
    .productslist li .pic{ border: .1rem solid #20853a;}

    /* 产品详情 */
    .n-cp-view .ms{ text-align: left; box-sizing: border-box; padding: 0 .2rem;}
    .n-cp-view .ms span{ display: inline;}
    .n-cp-view .text .list{ width: 100%; box-sizing: border-box; padding: 0 .2rem;}
    .n-cp-view .text .type{ width: 100%; margin-left: 0; box-sizing: border-box; padding: 0 .2rem;}
    .n-cp-view .text .type .thumbs{ display: flex; justify-content: space-between; background: #eee;}



    .n-cp-view .text .type .gallery{ display: block; margin-top: .1rem;}
    .n-cp-view .text .type .gallery li{ display: block;}
    .n-cp-view .text .type .gallery li p{ font-size: .16rem; line-height: 1.5; margin: .05rem 0; display: block;}
    .n-cp-view .case-photo{ display: block; margin-top: .2rem; box-sizing: border-box; padding: 0 .2rem;}
    .n-cp-view .case-photo .name{ background: #eee; display: block;}
    .n-cp-view .case-photo .name b{ width: 1.5rem; text-align: center; line-height: .48rem; font-size: .18rem; font-weight: bold; color: #fff; background: #20853a; display: inline-block;}

}