/* seach */
.seach{ width: 100%; display: block; background: #1d2088; padding: .58rem 0 .68rem;}
.seach h3{ color: #fff; font-size: .16rem; line-height: 1.5; margin-bottom: .32rem; display: block;}
.seach form{ width: 100%; display: flex; justify-content: space-between;}
.seach form select{ width: 28%; line-height: .4rem; height: .4rem; background: #fff;padding: 0 .14rem; box-sizing: border-box; border: none; outline:none;}
.seach form input{ width: 28%; line-height: .4rem; height: .4rem; box-sizing: border-box; padding: 0 .14rem; outline:none;}
.seach form button{ width: 6%; line-height: .36rem; height: .4rem; max-width: 1.2rem; outline:none;}
.nav-list{ position: relative;}
.nav-list ul{ justify-content: center; flex-wrap: nowrap}
.nav-list::after{ content: ""; width: 100%; height: 2px; background: #eee; top: .8rem; position: absolute; left: 0;}
.nav-list ul > li{ width: 16%; box-sizing: border-box;}
/* .nav-list ul > li:nth-of-type(4n){ border-right: 2px solid #eee;} */
.nav-list ul > li:first-of-type{ border-left: none;}
.nav-list ul > li:last-of-type{ border-right: none;}
.nav-list ul > li a{ height: .8rem; box-sizing: border-box; padding: .18rem; text-transform: uppercase; line-height: .24rem; font-size: .18rem;}


/* .nav-list ul > li:last-of-type{ border-right: 2px solid #eee;} */
/* .nav-list ul > li a{ padding: 0 .1rem; box-sizing: border-box; width: auto;} */

/* productlist */
.products-zt{ display: inline-block; vertical-align: top; padding: .4rem 0 .4rem; box-sizing: border-box; width: 100%; font-size: 0; border-bottom: 1px solid #ccc;}
.products-zt .main > .tit{ display: block;}
.products-zt .main > .tit h2{ font-size: .36rem; font-weight: bold; line-height: .94rem; text-transform: uppercase; text-align: center; display: block; position: relative; color: #1d2088; margin-bottom: .23rem;}
.products-zt .main > .tit h2::after{ content: ""; width: .52rem; height: .03rem; position: absolute; left: 50%; margin-left: -.26rem; bottom: 0; background: #1d2088}


.productslist{ width: 100%; display: block; font-size: 0; margin-top: .3rem;}
.productslist ul{ display: flex; width: 100%; text-align: center;}
.productslist ul li{ width: 17%; display: flex; border-bottom: 1px solid #f5f5f5; align-items: center; align-content: center; justify-content: center;}
.productslist ul li:nth-of-type(2n){ background: #eee;}
.productslist ul li .text{ width: 100%; }
.productslist ul li .text .tit{ display: block; width: 100%; box-sizing: border-box; padding: 0 .2rem; line-height: 1.5; color: #b5b5b5; font-size: .16rem; transition: all 0.3s ease-in-out;}
.productslist ul li .pic {height: 1.38rem;display: flex;justify-content: center;align-items: center;}
.productslist ul li .pic img {max-height: 80%;max-width: 90%;}

.productslist ul.title{ background: #1d2088; line-height: .36rem;}
.productslist ul.title li{ font-size: .14rem; color: #fff; background: #1d2088; position: relative; text-transform: uppercase;}
.productslist ul.title li::after{ content: ""; position: absolute; right: 0; top: .06rem; height: .24rem; width: 1px; background: #fff;}
.productslist ul.title li:last-of-type::after{ display: none;}


.productslist ol {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.productslist ol li {
    margin-bottom: .2rem;
    width: 24%;
    cursor: pointer;
    position: relative;
}
.productslist ol li::after {
    content: '\e60e';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgba(0, 0, 0, .3);
    color: #eee;
    font-family: iconfont;
    font-size: .6rem;
    opacity: 0;
    transition: opacity .4s ease-in-out;
    pointer-events: none;
}
.productslist ol li:hover::after {
    opacity: 1;
}
.productslist ol li img {
    max-width: 100%;
}

@media screen and ( max-width:768px) {
    .productslist ul.pc-only {display: none;}
    .products-zt {padding-bottom: 0;}
    .nav-list-pr ul {
        flex-wrap: wrap;
        padding: 2% 0;
    }
    .nav-list-pr ul li{ width: 96%; margin: 2% 4% 2%;}
    .nav-list-pr ul li a h2{ font-size: .24rem}
    .nav-list-pr ul li a button{ height: .4rem; opacity: 1; line-height: .36rem;}

    .seach form {flex-wrap: wrap;}
    .seach form select {width: 48%; margin-bottom: .15rem;}
    .seach form input {width: 48%;border: 0;}
    .seach form button {width: 48%;max-width: unset; background-color: #fff;border: 0;}
    .product-wap {margin-bottom: .4rem;}
    .product-wap .produvt-wap-img {box-sizing: border-box; border: 1px solid #1d2088; text-align: center; width: 50%;height: 1.41rem; display: inline-block;vertical-align: top;}
    .product-wap .produvt-wap-img .picture-text {height: .21rem;line-height: .21rem;text-transform: uppercase; background-color: #1d2088;color: #fff;text-align: center;font-size: .12rem;}
    .product-wap .produvt-wap-img img {position: relative; top: .6rem; transform: translateY(-50%); max-width: 1.35rem;max-height: 1.1rem;}
    .product-wap .parames {line-height: 2; padding-left: .12rem; box-sizing: border-box; width: 50%;display: inline-block;vertical-align: top;}
    .product-wap .parames .parames-name {font-size: .12rem;color:#1d2088; }
    .product-wap .parames .parames-content {font-size: .12rem; color: #999;}
    .product-wap .parames span.parames-content {width: 1rem;float: right;}
    .product-wap .oem{margin-top: .1rem; display: flex;}
    .product-wap .oem .oem-name {font-size: .14rem; width: 50%; display: flex; justify-content: center; align-items: center; min-height: .38rem;line-height: .38rem; background-color: #1d2088;color: #fff;}
    .product-wap .oem .oem-content {padding: .06rem; margin-left: 1%; text-align: center; border: 1px solid #1d2088;box-sizing: border-box; display: flex; justify-content: center;align-items: center; width: 50%;font-size: .12rem;color: #999; }

    .productslist ol li {
        width: 48%;
    }
}