@charset "utf-8";
/* CSS Document */
@charset "utf-8";

/*product*/
.proListMain{width: 1200px; position: relative; }
.proListMain .bigItem{ width:50%; float:left; height:340px; overflow:hidden; padding:0;}
.proListMain .proItem{ width: 23%;
    float: left;
    margin: 0 1%;
    height: 370px;
    overflow: hidden;}
.proListMain .proItem>div h2,.proListMain .proItem span{ font-size:14px; margin-bottom:3px;}
.proListMain .proItem {
    text-align: center;
    font-size: 15px;
    line-height: 18px;
    color: #000;
    background-color: #fff;
    position:relative;
    margin-top: 4%;
}
.proListMain .proItem a{ position:absolute; left:0; top:0; display:block; width:100%; height:100%; z-index:999;}
.proListMain .proItem a:hover{ color:#f08519;}
.proListMain .proItem .img{ position:relative; overflow:hidden;}
.proListMain .proItem .img img { font-size: 0; display: inline-block;transition:0.3s;}
.proListMain .proItem a:hover img{  transform:scale3d(1.2,1.2,1.2);}
.proListMain .proItem a h2{ font-size:16px;}
.proListMain .proItem span { display: inline-block; padding-bottom: 33px;}
.proListMain .proItem>div{ cursor:pointer;}
/*.proListMain .proItem>div:hover{box-shadow:0px 10px 50px rgba(0,0,0,0.4);}*/
.proListMain .proItem>div,.proListMain .proItem>div:hover{-moz-transition:all .3s linear; -webkit-transition:all .3s linear; transition:all .3s linear;}

@media(max-width:640px){
    .proListMain .bigItem{ width:100%; float:left; height:340px; overflow:hidden; padding:0;}
    .proListMain .proItem>div{margin:0 0px;}
    .proListMain .proItem { text-align: center; font-size: 15px; line-height: 18px; margin-bottom: 40px; width: 48%; height:280px; float: left;color: #000;}
    .proListMain{ width:100%;position:relative; }
}


/* CSS Document */
.proListMain .bigItem { text-align: center; *margin-bottom:40px;}
.proListMain .bigItem.colWhite {color: #1c1c1c;}
.proListMain .bigItem.twoPro .greenBtn{
    display:none;
}
.proListMain .bigItem.twoPro .col{
    padding-top: 105px;
}
.proListMain .bigItem.colWhite .col { background: #fff;}
.proListMain .bigItem.colBlueGray { color: #000;}
.proListMain .bigItem.colBlueGray .col {
    background: -webkit-linear-gradient(#e8eff6, #f2f6fd);
    background: linear-gradient(#e8eff6, #f2f6fd);
    background: #edf4ff\9;
}
.proListMain .bigItem .col {
    padding: 57px 0 52px;
    /*background: -webkit-linear-gradient(#bec6cd, #dcdee2);*/
    /*background: linear-gradient(#bec6cd, #dcdee2);*/
    /*background: #bec6cd\9;*/
}
.proListMain .bigItem .num {
    display: inline-block;margin:0 auto;
    margin-bottom: 30px;
    font-size: 16px;
    padding-bottom: 6px;
    border-bottom: 2px solid #000; *width:85px;
}

.proListMain .bigItem .num.whiteNum {
    border-bottom: 2px solid #fff;
}
.proListMain .colWhite .num.whiteNum {
    border-bottom: 2px solid #000;
}
.proListMain .bigItem h2 {
    font-size: 32px;
    margin-bottom: 22px;
}
.proListMain .bigItem .secondTitle {
    display: inline-block;
    font-size: 14px;
    margin-bottom: 20px;
}
.proListMain .bigItem .greenBtn {
    width: 145px;
    height: 46px;
    background: url("../images/icon-greenBtn.png") center no-repeat;
    background-size: 100%;
    position: relative;
    margin: 0 auto; cursor:pointer;
}
.proListMain .bigItem .greenBtn a {
    color: #fff;
    font-size: 14px;
    letter-spacing: 2px;
    line-height: 46px;
}


/*.proListMain .bigItem .greenBtn .hideBtn{ display:none;}*/
/*.proListMain .bigItem .active .hideBtn{ display: block;}*/
/*.proListMain .bigItem .active .moreBtn{ display:none;}*/

.listItem,.listBox{ overflow:hidden; width:100%; }
.listBox{display: none;}


.layer_box {position: fixed; display: flex;align-items: center;width:100%;height:100%;top:0;left:0;background: rgba(0, 0, 0, 0.61); z-index: 10000; display: none;}
.layer_box .main { position: absolute;width:1200px;height:700px;top: 50%;left: 50%;padding:60px;background:#fafafa; transform: translate(-50%,-50%);}
.layer_box .main .close_btn { position: absolute;width: 22px;height:22px;top:20px;right:20px;background:url("../images/case_close.png") no-repeat center; cursor: pointer;}
.layer_box .main .left_box { float: left; width:450px; margin-right: 20px; position:relative; overflow: hidden;}
.layer_box .main .bigImg .Ispic{ background:#fff; padding-bottom:100%; background-repeat:no-repeat; background-size: cover;}
.layer_box .main .right_box { position: relative;float: right;width: 560px; height: 100%;}

.layer_box .main .right_box li {box-sizing:border-box;margin:0px 0px 20px;padding:0px;width:560px;float:left; text-align: left;}
.layer_box .main .right_box .txt { color:#000;}
.layer_box .main .right_box .txt .box{ text-align:left; max-height:540px; margin-bottom:2%; overflow:auto;}
.layer_box .main .right_box .txt h3{ margin-top:0;font-size: 18px; font-weight: normal;}
.layer_box .main .right_box .imgList {  position: absolute;width: 100%;bottom: 0; display:none;}
.layer_box .main .imgList .Ispic{padding-bottom:100px}
.layer_box .main .right_box p{ height:auto; white-space:normal;}
.layer_box .main .right_box .btn a{ position:static; color: #fff; width: 145px; height: 46px; background: url(../images/icon-greenBtn.png) center no-repeat; background-size: 100%; font-size: 14px; letter-spacing: 2px; line-height: 46px; float:left; margin-right:20px;}
.layer_box .main .imgList .swiper-slide {border:2px solid #fff; cursor: pointer;}
.layer_box .main .imgList .swiper-slide-thumb-active {border:2px solid #eea57f}
.swiper-pagination{ display:block; position:absolute; bottom:0; left:50%; z-index:999;}
.swiper-pagination .swiper-pagination-bullet swiper-pagination-bullet-active{ display: inline-block; width: 7px; height: 7px; border-radius: 10px; background: #999; background: #fff; margin: 0 3px; cursor: pointer; border: 1px solid #000;}
.swiper-pagination .swiper-pagination-bullet{ display: inline-block; width: 7px; height: 7px; border-radius: 10px; background: #999; background: #fff; margin: 0 3px; cursor: pointer; border: 1px solid #000; padding:0!important;}

.swiper-button-prev {background:url("../images/case_prev.png") no-repeat center rgba(0,0,0,0.6); position: absolute; left: 0; top: 50%; width: 40px; height: 40px; z-index: 10}
.swiper-button-next {background:url("../images/case_next.png") no-repeat center rgba(0,0,0,0.6); position: absolute; right: 0; top: 50%; width: 40px; height: 40px; z-index: 10}
.copy .swiper-button-prev,.copy .swiper-button-next{ display:none;}

@media (max-width:768px) {
    .layer_box .main {width:100%;height:100%;padding:20px;overflow:auto;}
    .layer_box .main .close_btn { z-index: 80;}
    .layer_box .main .left_box,
    .layer_box .main .right_box{float: none;width:100%;}
    .layer_box .main .bigImg .Ispic {padding-bottom:100%;}
    .layer_box .main .right_box {width:100%;height: auto;}
    .layer_box .main .right_box .txt p {margin: 2% 0;}
    .layer_box .main .right_box .imgList { position: relative; margin-bottom: 2%;}
}
.products{
    background-color: #fafafa;
    width: 100%;
}
.products2{
    background-color: #fafafa;
    width: 100%;
    margin-top: -3%;
}