@charset "utf-8";
/* CSS Document */
/*切图：yf*/
html{ overflow-x:hidden; overflow-y:auto;}
body{ overflow-x: hidden;}
*{ padding:0; margin:0;}
ul,ol,li,dl,dd,dt{ list-style-type:none; line-height:normal;}
body, button, input, select, textarea{ font-family:'Microsoft yahei' ,Arial; font-size:12px;}
code, kbd, pre, samp { font-family:'Microsoft yahei' ,Arial;}
address, caption, cite, code, dfn, em, th, var {
    font-style: normal;
    font-weight: normal;
}
a{ text-decoration:none; color:#333;
    transition: all 0.5s linear;
    -moz-transition: all 0.5s linear;
    -webkit-transition: all 0.5s linear;
    -o-transition: all 0.5s linear;
    -webkit-tap-highlight-color:rgba(0, 0, 0, 0);
    -webkit-tap-highlight-color: transparent;
}
a:hover{color:#333; cursor:pointer;}
img{border:0; max-width:100%;}
table { border-collapse: collapse; border-spacing: 0; }
h1,h2,h3,h4,h5,h6{ margin:0; font-weight:normal; font-family:'Microsoft yahei' ,Arial;}
h1{font-size:36px;}
h2{font-size:24px;}
h3{font-size:22px;}
h4{font-size:18px;}
h5{font-size:14px;}
h6{font-size:12px;}
input,table,tr,td{ margin:0; padding:0; border:none;}
button,table{ border:none; background:none; margin:0; padding:0;}
select{ margin:0; padding:0; font-family:'Microsoft yahei' ,Arial;}
textarea{ resize:none; outline:0;}
input{ outline:0;}
article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}



/*菜单按钮*/
.menuBtnBox{ position: fixed; width: 64px; height: 64px; left: 50px; top: 45px; z-index: 1600;}
.menuBtnBox.home{ position: absolute;}
.menuBtnBox .menuTit{ position: absolute; width: 44px; height: 44px; left: 10px; top: 10px; overflow: hidden; color: #fff; font-size: 18px; line-height: 44px; text-align: right;  z-index:20; white-space: nowrap;
    border-radius:32px;
    -webkit-border-radius:32px;
    -moz-border-radius:32px;
    -o-border-radius:32px;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
}
.menuBtnBox.active .menuTit{ width: 140px;  height: 64px; left: 0; top: 0; padding-right: 25px; line-height: 64px; background-color: rgba(0,0,0,0.3); }
.menuBtnBox.inner{ left: 20px; top: 23px;}
@media screen and (max-width:1199px){
    .menuBtnBox.inner{ left: 10px;}
}
@media screen and (max-width:767px){
    .menuBtnBox{ left: 20px; }
    .menuBtnBox.inner{ top: 3px;}
}




/*手机按钮*/
.menuph{ position: relative; z-index: 30; margin: 10px; background-color: #ebdbc9;
    float:right;
    cursor: pointer;
    width: 44px;
    height: 44px;
    text-align: center;
    border-radius:50%;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    -o-border-radius:50%;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
}

.menuBtnBox.inner .menuph{ background-color: #000000;}
.menuBtnBox.active .menuph{ background-color: #1c1c1c;}
.menuph .point
{
    display: inline-block;
    width: 16px;
    height: 12px;
    margin-top: 16px;
    position: relative;
}
.menuph .point:hover .navbtn,
.menuph .point:hover .navbtn::after,
.menuph .point:hover .navbtn::before
{
    width: 16px;
}
.menuph .navbtn
{
    position: absolute;
    top: 5px;
    right: 0;
    display: inline-block;
    width: 16px;
    height: 2px;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
    background: #ebdbc9;
}
.menuBtnBox.inner .menuph .navbtn{ background-color: #000000; }
.menuph .navbtn::after,
.menuph .navbtn::before
{
    position: absolute;
    right: 0;
    display: inline-block;
    width: 16px;
    height: 2px;
    content: '';
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
    background: #000;
}
.menuBtnBox.inner .menuph .navbtn::after,
.menuBtnBox.inner .menuph .navbtn::before{ background-color: #fff;}
.menuph .navbtn::after,
.menuph .navbtn::before{ background-color: #000; }
.menuBtnBox.active .menuph .navbtn::after,
.menuBtnBox.active .menuph .navbtn::before{ background: #fff; }

.menuph .navbtn::after
{
    top: -5px;
}
.menuph .navbtn::before
{
    top: 5px;
}
.menuph .point.active .navbtn{
    background: transparent;
}
.menuph .point.active .navbtn::after{
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 0px;
}
.menuph .point.active .navbtn::before
{
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    top: 0px;
}


/*手机下拉*/
.xialaph{
    position: fixed;
    top: 0;
    left: -400px;
    width: 240px;
    height: 100%;
    display: block;
    z-index: 1029;
    background: #ebdbc9;
    padding: 200px 0 0 0;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
}
.xialaph.active{ left: 0;}
.xialaph span{ display: block;}
.xialaph span a{ float: left; width: 100%; padding: 0 35px 0 35px;  color: #b8b8b8; font-size: 18px; line-height: 50px; position: relative;
    background-position: right center;
}
.xialaph span a:hover{ color: #fff; background: url("images/add1.png") right center no-repeat #000; background-size: auto 12px;}
/*.xialaph span a::before{ content: ''; position: absolute; width: 0; height: 1px; left: 0; top: 50%; background-color: #cecece;*/
/*-webkit-transition: all 0.3s linear;*/
/*-moz-transition: all 0.3s linear;*/
/*-o-transition: all 0.3s linear;*/
/*transition: all 0.3s linear;*/
/*}*/
/*.xialaph span a:hover::before,*/
/*.xialaph span a.hover::before{ width: 100%;}*/
.xialaph .shareDown{ position: absolute; width: 100%; left: 0; bottom: 30px; text-align: center; }
.xialaph .shareDown .shareDownBox{ display: inline-block; vertical-align: top;}

.menu .nli{ position: relative;}
.menu .sub{ display: none; position: absolute; width: 150px; left: 100%; top: 0; background-color: rgba(0,0,0,0.5);  overflow: hidden;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}
.menu .sub li{ display: block; width: 100%; padding: 15px 10px; line-height: 18px; text-align: left; font-size: 14px; transition: all .3s ease-out; border-bottom: 1px dashed rgba(255,255,255,.12); }
.menu .sub li a{ color: #fff; display: block;}
.menu .sub li:hover{ background-color: #ebdbc9;}
.menu .sub li:last-child{ border-bottom: 0;}
.menu .sub li:hover a{ color: #b5b5b5;}
.menu .nli:nth-child(4) .sub,
.menu .nli:nth-child(5) .sub,
.menu .nli:nth-child(6) .sub,
.menu .nli:nth-child(7) .sub,
.menu .nli:nth-child(8) .sub,
.menu .nli:nth-child(9) .sub,
.menu .nli:nth-child(10) .sub{ top: auto; bottom: 0; }

.phonemeng{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: .6;
    z-index: 196;
    display: none;
}
.phonemeng.active{
    display: block;
}
@media screen and (max-width:1199px){
    .xialaph{ padding: 150px 0 0 0; }
    .xialaph span a{ float: left; width: 100%; color: #b8b8b8; font-size: 18px; line-height: 50px; position: relative; }
}
@media screen and (max-width:767px){
    .xialaph{ width: 200px; padding: 150px 0 0 0; }
    .xialaph span a{ padding: 0 20px 0 20px; }
}
@media screen and (max-height:662px){
    .xialaph span a{ line-height: 40px; }
}






/*banner*/
.pz_banner{ float:left; width:100%; overflow:hidden; position: relative; line-height: 0;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
}
.pz_banner.active{ margin-top: 66px;}
.pz_banner.home{min-height: 350px;}
@media screen and (max-width:1199px){
    .pz_banner.home{min-height: 280px;}
}
@media screen and (max-width:991px){
    .pz_banner.home{ min-height: 358px;}
}
@media screen and (max-width:767px){
    .pz_banner.home{min-height: 148px;}
}
.pz_main{ float:left; width:100%; background: #fff; }
.pz_down{ float:left; width:100%; background-color: #262626;}


/*banner*/
.bannerBox{ line-height: 0; overflow:hidden; }
.pz_banner .dianBox{position: absolute; width:30px; right: 49px; top: 50%; z-index: 100;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}
.pz_banner .dianBox .dianPic{ float: left; width: 100%; height: 128px; line-height: 0; padding: 0 9px;}
.pz_banner .dian{ float: left; width: 100%; margin-top: 24px; }
.pz_banner .slick-dots{ position: static; float: left; width: 100%; left: auto; bottom: auto;  text-align: center; }
.pz_banner .slick-dots li{ width: 100%; height: auto; margin: 6px 0; }
.pz_banner .slick-dots li button{ float: left; width: 14px; height: 14px; background: 0; border: #fff solid 2px; text-indent: -200px; overflow: hidden; margin:0 8px ;
    border-radius:50%;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    -o-border-radius:50%;
}
.pz_banner .slick-dots li.slick-active button{ background-color: #fff;}
.pz_banner .slick-dots li button::before{ width: 0; height: 0; overflow: hidden;}
.pz_banner .slick-dots li .bs{ display: none; float: left; width: 100%; color: #fff; font-size: 18px; font-weight: bold; line-height: 36px;  text-align: center; }
.pz_banner .slick-dots li.slick-active .bs{ display: block;}
.pz_banner .slick-dots li .bs::after{ display: none; content: ''; float: left; width: 1px; height:65px; background-color: #bcb2ae; margin: 0 0 0 14px; }
.pz_banner .slick-dots li.slick-active .bs::after{ display: block;}
.pz_banner .slick-dots li:last-child.slick-active .bs::after{ display: none;}
@media screen and (max-width:767px){
    .pz_banner .dianBox{ right: 10px; }
    .pz_banner .slick-dots li .bs::after{ height:30px; }
}

/*scroll*/
.scroll{ position: absolute; width: 60px; left: 50%; margin-left: -30px; bottom: 15px; text-align: center; z-index: 100; cursor: pointer;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
}
.scroll:hover{
    -webkit-animation: shakess 1s linear;
    animation:  shakess 1s linear
}
.scroll .wz{ color: #fff; font-size: 14px; line-height: 1; text-transform: uppercase; text-align: center;}
.scroll .sIco{ display: inline-block; vertical-align: top; width: 33px; height: 26px; margin-top: 10px; line-height: 0;}

@-webkit-keyframes shakess {
    0%, to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0)
    }
    20%, 40%, 60%, 80% {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0)
    }
}

@keyframes shakess {
    0%, to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0)
    }
    20%, 40%, 60%, 80% {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0)
    }
}




/*main*/
.homeBack{ background-color: #ebdbc9;}

.homeAbout{ padding:3.18% 0; margin: 0 -50px; }
.homeAbout ul{ float: left; width: 100%; }
.homeAbout ul li{ float: left; width: 50%; padding: 0 50px;}
.homeAbout ul li a{ float: left; width: 100%; margin: 6.802% 0;}
.homeAbout ul li a .aboutPic{ line-height: 0; overflow: hidden; position: relative; }
.homeAbout ul li a .aboutPic .img1{
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    transition: -webkit-transform 2s;
    -ms-interpolation-mode:bicubic;
}
.homeAbout ul li a:hover .aboutPic .img1{
    transform: scale(1.09,1.09);
    -ms-transform: scale(1.09,1.09);
    -webkit-transform: scale(1.09,1.09);
    -o-transform: scale(1.09,1.09);
    -moz-transform: scale(1.09,1.09);
}
.homeAbout ul li a .aboutPic .aboutBack{ position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-color: rgba(0,0,0,0.7);
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    opacity: 0;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
}
.homeAbout ul li a:hover .aboutPic .aboutBack{
    opacity: 1;
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -khtml-opacity: 1;
}

.homeAbout ul li a .aboutPic .aboutTit{ position: absolute; width: 100%; left: 0; top: 50%; margin-top: -30px; color: #fff; font-size: 48px; font-weight: bold; line-height: 60px; text-align: center; text-transform: uppercase; padding: 0 10px; }
.homeAbout ul li a .aboutPic .aboutLine{ position: absolute; width: 1px; height:0 ; background-color: rgba(255,255,255,0.2); left: 50%; bottom: 0;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
}
.homeAbout ul li a:hover .aboutPic .aboutLine{ height:35.78%; }
@media screen and (max-width:1599px){
    .homeAbout{ margin: 0 -37px; }
    .homeAbout ul li{ padding: 0 37px;}
    .homeAbout ul li a .aboutPic .aboutTit{ font-size: 40px; }
}
@media screen and (max-width:1199px){
    .homeAbout{ margin: 0 -30px; }
    .homeAbout ul li{ padding: 0 30px;}
    .homeAbout ul li a .aboutPic .aboutTit{ font-size: 35px; }
}
@media screen and (max-width:991px){
    .homeAbout{ margin: 0 -15px; }
    .homeAbout ul li{ padding: 0 15px;}
    .homeAbout ul li a .aboutPic .aboutTit{ font-size: 30px; }
}
@media screen and (max-width:767px){
    .homeAbout{ margin: 0; }
    .homeAbout ul li{ width: 100%; padding: 0 10px; }
}





/*down*/
.footBox{ padding: 20px 0 27px 0;}
.footBox .footLogo{ float: left; width: 400px; height: 150px; line-height: 0; margin-top: 7px;}
.footBox .footNav{ float: right; width: 835px;}
.copyRight{ float: left; width: 100%; }
.copyRight a{ float: left; color: #ababab; font-size: 16px; line-height: 29px; border-bottom: #262626 solid 1px; margin-left: 88px; }
.copyRight a:hover{ border-bottom-color: #7d7d7d; color: #fff; }
.footShare{ float: left; width: 100%; padding-top: 71px;}
.footShare .shareThis{ float: right; margin-right: 3px; }
@media screen and (max-width:1199px){
    .footBox .footNav{ width: 700px;}
}
@media screen and (max-width:991px){
    .footBox .footNav{ float: left; width: 100%;}
    .copyRight{ padding: 24px 0 0 0;}
    .footShare{ padding-top: 50px;}
}
@media screen and (max-width:767px){
    .footBox .footLogo{ width: 345px; height: 138px; }
}



/*1产品列表*/
.top1{ position: fixed; width: 100%; left: 0; top: 0; padding: 20px 40px 20px 0 ; z-index: 120; background-color: #ebdbc9; height: 110px;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear
}
.top1{ position: absolute;}
.top1.active{  height: 110px;}
.top1 .logo{ float: right; width: 246px; height: 70px; line-height: 0;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear
}
/*.top1.active .logo{ width: 105px; height: 78px;}*/
@media screen and (max-width:1199px){
    .top1{ padding: 20px 20px 20px ; height: 110px; }
}
@media screen and (max-width:767px){
    .top1{ padding: 10px 20px 10px 0; height: 70px; }
    .top1.active{ padding: 10px 20px 10px 0; height: 70px;}
    .top1 .logo{ width: 170px; height: 50px; }
    .top1.active .logo{ width: 83px; height: 50px;}
}






.innerMain{ overflow-y: hidden; margin-top: 110px; background-color: #f8f8f8;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear
}
.pz_main.active .innerMain{ margin-top: 110px;}
.proNavBox{ padding: 54px 0 0 0; position: relative; z-index: 100;}
@media screen and (max-width:1199px){
    .innerMain{ margin-top: 110px; }
}
@media screen and (max-width:767px){
    .innerMain{ margin-top: 70px; }
    .pz_main.active .innerMain{ margin-top: 70px;}
}


.pz_SideLayer{ float:left; width:100%; background: url("images/pro0.jpg") bottom repeat-x; }
.pz_SideLayer .l1{ float:left; padding-right: 29px; position: relative; }
.pz_SideLayer .l1 a{ float:left; padding: 0 10px; color:#666666; font-size: 16px; font-weight: bold; line-height: 52px; border-bottom: transparent solid 4px;}
.pz_SideLayer .l1 a:hover,
.pz_SideLayer .l1 .hover{ color:#000000; border-bottom-color: #000000;}

.pz_SideLayer .two{ display: none; position: absolute; width: 130px; left: 0; top: 100%; background-color: #ebdbc9;}
.pz_SideLayer .two .l2{ float: left; width: 100%; position: relative;}
.pz_SideLayer .two .l2 .span2{ float: left; width: 100%;}
.pz_SideLayer .two .l2 .span2 a{ width: 100%; color: #333; font-size: 14px; line-height: 34px; border: 0;}
.pz_SideLayer .two .l2 .span2 a:hover{ background-color: #000; color: #fff;}
.pz_SideLayer .three{ display: none; position: absolute; width: 120px; left: 100%; top: 0; background-color: #ebdbc9;}
.pz_SideLayer .three li{ float: left; width: 100%;}
.pz_SideLayer .three li a{ width: 100%; border: 0; font-size: 14px; line-height: 34px;}
.pz_SideLayer .three li a:hover{ background-color: #222; color: #fff;}
.pz_SideLayer .two .l2:hover .three{ display: block;}




/*ph边导航*/
.babyser{ position: relative; z-index: 5;}
.babyser h2{ float:left; width:100%; padding: 0 15px; border-bottom:#e1e1e1 solid 1px;  color:#333333; font-size:18px; line-height:48px; }
.babyser h2 .imgr{ float:right; margin:16px 0 0 0;}
@media  screen and (max-width:991px){
    .babyser h2 .imgr{ float:right; margin:16px 0 0 0;
        transition: all 0.2s linear;
    }
    .babyser h2.active .imgr{
        -webkit-transform:rotate(180deg);
        -moz-transform:rotate(180deg);
        -o-transform:rotate(180deg);
        transform:rotate(180deg);
    }
}
.pz_SideLayerph{ position: absolute; width: 100%; left: 0; top: 49px; display:none; background-color:#f1f1f1; }
.pz_SideLayerph .l1{}
.pz_SideLayerph .l1 h3{ color:#333; font-size:14px; line-height:40px; cursor:pointer; border-bottom:#e1e1e1 dashed 1px; position: relative;}
.pz_SideLayerph .l1 h3 a{ color:#333; padding-left:15px;}
.pz_SideLayerph .l1 h3.active a{ color:#000;}
.pz_SideLayerph .l1 h3 img{ position: absolute; right: 0; top: 0; margin:17px 15px 0 0;}
.pz_SideLayerph .l1 h3 img.img3{ display:block;}
.pz_SideLayerph .l1 h3 img.img3h{ display:none;}
.pz_SideLayerph .l1 h3.active img.img3{ display:none;}
.pz_SideLayerph .l1 h3.active img.img3h{ display:block;}
.pz_SideLayerph .l1 .l1ul{ display:none; padding:10px 10px 10px 29px;}
.pz_SideLayerph .l1 .l1ul .l2{ border-bottom:#e1e1e1 dashed 1px;}
.pz_SideLayerph .l1 .l1ul .l2 h4{ padding: 10px 0; font-size:14px; line-height:18px; position: relative;}
.pz_SideLayerph .l1 .l1ul .l2 a{color:#999999;}
.pz_SideLayerph .l1 .l1ul .l2 img{ position: absolute; right: 0; top: 0; margin:17px 15px 0 0;}
.pz_SideLayerph .l1 .l1ul .l2 h4 img.img3{ display:block;}
.pz_SideLayerph .l1 .l1ul .l2 h4 img.img3h{ display:none;}
.pz_SideLayerph .l1 .l1ul .l2 h4.active img.img3{ display:none;}
.pz_SideLayerph .l1 .l1ul .l2 h4.active img.img3h{ display:block;}


.pz_SideLayerph .l2ul{ display:none; padding: 0 0 10px 15px;}
.pz_SideLayerph .l2ul li{ border-top: #e1e1e1 dashed 1px;}
.pz_SideLayerph .l2ul li a{ display: block; color: #333; font-size: 12px; line-height: 28px;}



.proList{ padding: 30px 0 79px 0; margin-right: -1px;}
.proList ul{ float: left; width: 100%;
    display: -webkit-flex; /*webkit*/
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
}
.proList ul li{ float: left; width: 16.66666666666667%; padding: 0 1px 1px 0; }
.proList ul li .proBlock{ line-height: 0; overflow: hidden; position: relative; }
.proList ul li .proBlock .img2{
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    transition: -webkit-transform 2s;
    -ms-interpolation-mode:bicubic;
}
.proList ul li .proBlock:hover .img2{
    transform: scale(1.09,1.09);
    -ms-transform: scale(1.09,1.09);
    -webkit-transform: scale(1.09,1.09);
    -o-transform: scale(1.09,1.09);
    -moz-transform: scale(1.09,1.09);
}
.proList ul li .proBlock .proBack{ position: absolute; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); left: 0; top: 0;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    opacity: 0;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
}
.proList ul li .proBlock:hover .proBack{
    opacity: 1;
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -khtml-opacity: 1;
}
.proList ul li .proBlock h4{ position: absolute; width: 100%; left: 0; top: 50%; margin-top: -10px; padding: 0 10px; color: #fff; font-size: 18px; line-height: 20px; text-align: center;}
@media screen and (max-width:1599px){
    .proList ul li{ width: 20%; }
}
@media screen and (max-width:1199px){
    .proList ul li{ width: 25%; }
}
@media screen and (max-width:991px){
    .proList{ padding: 30px 0 50px 0; }
    .proList ul li{ width: 33.3333%; }
}
@media screen and (max-width:767px){
    .proList{ padding: 20px 0 40px 0; }
    .proList ul li{ width: 50%; }
    .proList ul li .proBlock h4{ font-size: 15px; }
}



/*2产品详情*/
.xqStyle{ padding: 6.36% 0 5.09% 0; }
.xqStyle .xqPic{ float: left; width: 610px; height: 610px; line-height: 0; overflow: hidden;}
.xqStyle .xqPic .img4{
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    transition: -webkit-transform 2s;
    -ms-interpolation-mode:bicubic;
}
.xqStyle .xqPic:hover .img4{
    transform: scale(1.09,1.09);
    -ms-transform: scale(1.09,1.09);
    -webkit-transform: scale(1.09,1.09);
    -o-transform: scale(1.09,1.09);
    -moz-transform: scale(1.09,1.09);
}
.xqStyle .xqRight{ float: right; width: 840px;}
.xqStyle .xqRight .turn{}
.xqStyle .xqRight .turn .turnImg{ float: right; width: 54px; height: 54px; line-height: 0;}
.xqStyle .xqRight .turn .turnImg .imgs{}
.xqStyle .xqRight .turn .turnImg .imgd{ display: none;}
.xqStyle .xqRight .turn .turnImg:hover .imgs{ display: none;}
.xqStyle .xqRight .turn .turnImg:hover .imgd{ display: block;}

.xqStyle .xqRight .xqRd{ padding-right: 130px;}
.xqStyle .xqRight .xqRd h3{ padding: 3.23% 0 6.9% 0; border-bottom: #d8d8d8 solid 1px; color: #222222; font-size: 36px; line-height: 1.25; font-weight: bold; }
.xqStyle .xqRight .xqRd .xqTextBox{ padding: 5px 0 0 0; color: #444444; font-size: 18px; line-height: 36px;}
.xqStyle .xqRight .xqRd .xqTextBox .textLi{ padding-top: 5.07%;}
.xqDetaile{ padding: 0 0 6.36% 0; color: #444444; font-size: 18px; line-height: 36px;}
@media screen and (max-width:1599px){
    .xqStyle .xqPic{ width: 454px; height: 454px; }
    .xqStyle .xqRight{ width: 626px;}
    .xqStyle .xqRight .turn .turnImg{ width: 40px; height: 40px; }
    .xqStyle .xqRight .xqRd{ padding-right: 97px;}
    .xqStyle .xqRight .xqRd h3{ font-size: 28px; }
    .xqStyle .xqRight .xqRd .xqTextBox{ padding: 5px 0 0 0; font-size: 16px; line-height: 28px;}
    .xqDetaile{ padding: 0 0 6.36% 0; color: #444444; font-size: 16px; line-height: 28px;}
}
@media screen and (max-width:1199px){
    .xqStyle .xqPic{ width: 610px; height: 610px; margin-left: 176px; }
    .xqStyle .xqRight{ float: left; width: 100%; padding-top: 4.5%; }
    .xqStyle .xqRight .xqRd{ padding-right: 0;}
}
@media screen and (max-width:991px){
    .xqStyle .xqPic{ margin-left: 64px; }
}
@media screen and (max-width:767px){
    .xqStyle .xqPic{ width: 100%; height: auto; margin-left: 0; }
    .xqStyle .xqRight .turn .turnImg{ width: 34px; height: 34px; }
    .xqStyle .xqRight .xqRd h3{ font-size: 22px; }
    .xqStyle .xqRight .xqRd .xqTextBox{ font-size: 14px; }
    .xqDetaile{ font-size: 14px; }
}



/*3案例列表*/
.pz_SideLayer_list{ float: left; width: 100%; padding: 25px 0 22px 0; }
.pz_SideLayer_list .l2{ float: left; padding-right: 29px; }
.pz_SideLayer_list .l2 a{ float: left; padding: 0 10px; color: #333333; font-size: 14px; line-height: 24px; }
.pz_SideLayer_list .l2 a:hover,
.pz_SideLayer_list .l2 a.hover{ color: #000;}


.choseList{ float: left; width: 100%;}
.choseList .chooseUl{ margin: 0 -10px;}
.choseList .chooseUl ul{ float: left; width: 100%;}
.choseList .chooseUl ul li{ float: left; width: 33.3333%; padding: 10px;}
.choseList .chooseUl ul li a{ float: left; width: 100%; background-color: #dfdfdf; padding: 20px 30px; color: #333333; font-size: 18px; line-height: 20px;}
.choseList .chooseUl ul li a:hover,
.choseList .chooseUl ul li a.hover{ background-color: #262626; color: #fff;}
@media screen and (max-width:1599px){
    .choseList .chooseUl ul li a{ padding: 12px 23px; font-size: 16px; }
}
@media screen and (max-width:991px){
    .choseList .chooseUl ul li{ width: 50%; }
}
@media screen and (max-width:767px){
    .choseList .chooseUl ul li{ width: 100%; padding: 4px 0; }
    .choseList .chooseUl ul li a{ padding: 8px 23px; font-size: 14px; }

}

.brandCase{ padding: 4.45% 0 2.22% 0; text-align: center; }
.brandCase .caseTit{ color: #333333; font-size: 24px; line-height: 1; text-align: center;}
.brandCase .caseIco{ display: inline-block; vertical-align: top; width: 25px; height: 25px; line-height: 0; margin-top: 15px;}
@media screen and (max-width:767px){
    .brandCase .caseTit{ font-size: 20px; }
}

.photos{ line-height: 0; padding: 0 0 6.36% 0; margin: 0 -1px 0 -1px; text-align: center; }
/**/
.photos .photo.small{width:19.4125%}
.photos .photo.middle{width:30.5236%}
.photos .photo.big{width:50.0639%}
.photo{ position: relative; overflow: hidden; display:inline-block; padding:1px;}
.photo img{width:100%;}
.photo .img6{
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    transition: -webkit-transform 2s;
    -ms-interpolation-mode:bicubic;
}
.photo:hover .img6{
    transform: scale(1.09,1.09);
    -ms-transform: scale(1.09,1.09);
    -webkit-transform: scale(1.09,1.09);
    -o-transform: scale(1.09,1.09);
    -moz-transform: scale(1.09,1.09);

}
.photo .proBack{ position: absolute; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); left: 0; top: 0;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    opacity: 0;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
}
.photo:hover .proBack{
    opacity: 1;
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -khtml-opacity: 1;
}
.photo h4{ position: absolute; width: 100%; left: 0; top: 50%; margin-top: -10px; padding: 0 10px; color: #fff; font-size: 18px; line-height: 20px; text-align: center;}
@media screen and (max-width:767px){
    .photo h4{ font-size: 15px; }
}






/*4案例详情*/
.caseInerTop{ padding:6.36% 0 0 0; }
.home_res11{ float: left; width: 1248px;}
.home_res11 .slick_res1l{ float: left; width: 100%;}
.home_res12{ float: right; width: 290px;}
.home_res12 .slick_res2r{ margin: -8px 0;}
.home_res12 .slick_res2r .slick-slide{ padding: 8px 0;}
.home_res12 .slick_res2r .imgk{ line-height: 0; overflow: hidden; position: relative; }
.home_res12 .slick_res2r .imgk .imgky{ display: none; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-color: rgba(0,0,0,0.6); border: #fff solid 8px;}
.home_res12 .slick_res2r .slick-current .imgk .imgky{ display: block;}
@media screen and (max-width:1599px){
    .home_res11{ width: 930px;}
    .home_res12{ width: 216px;}
    .home_res12 .slick_res2r{ margin: -6px 0;}
    .home_res12 .slick_res2r .slick-slide{ padding: 6px 0;}
}
@media screen and (max-width:1199px){
    .home_res11{ width: 766px;}
    .home_res12{ width: 177px;}
    .home_res12 .slick_res2r{ margin: -4px 0;}
    .home_res12 .slick_res2r .slick-slide{ padding: 5px 0;}
}
@media screen and (max-width:991px){
    .home_res11{ width: 100%;}
    .home_res12{ float:left; width: 100%; padding-top: 2%; }
    .home_res12 .slick_res2r{ margin: 0 -1px 0 -2px;}
    .home_res12 .slick_res2r .slick-slide{ padding: 0 2px;}
    .home_res12 .slick_res2r .imgk .imgky{  border: #fff solid 0;}
}



.caseInerDown{}
.caseInerDown h2{ padding: 4.84% 0 2.61% 0; color: #222222; font-size: 36px; line-height:1.11; font-weight: bold; }
.caseInerDown .place{ padding: 1.71% 0; border-bottom: #d8d8d8 solid 1px; border-top: #d8d8d8 solid 1px; color: #444444; font-size: 18px; line-height: 24px;}
.caseInerDown .placetext{ padding: 1.65% 0 2.42% 0; color: #666666; font-size: 18px; line-height: 42px;}
@media screen and (max-width:1199px){
    .caseInerDown h2{ font-size: 24px; }
    .caseInerDown .place{ font-size: 16px; }
    .caseInerDown .placetext{ font-size: 16px; line-height:36px;  }
}
@media screen and (max-width:767px){
    .caseInerDown .place{ font-size: 14px; }
    .caseInerDown .placetext{ font-size: 14px; line-height:28px;  }
}


.caseInerCommet{ padding-bottom: 6.36%;}
.caseInerCommet .comment{ float: left; width: 100%;}
.comment .slick-slide{ padding: 0 1px;}
.comment .slick-slide .over{ overflow: hidden;}
.comment .slick-slide .over .img6{
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    transition: -webkit-transform 2s;
    -ms-interpolation-mode:bicubic;
    height:420px;
}
.comment .slick-slide .over:hover .img6{
    transform: scale(1.09,1.09);
    -ms-transform: scale(1.09,1.09);
    -webkit-transform: scale(1.09,1.09);
    -o-transform: scale(1.09,1.09);
    -moz-transform: scale(1.09,1.09);
}
.comment .slick-dots{ padding: 2.54% 0 0 0; position: static; bottom: auto; line-height: 0;}
.comment .slick-dots li{ display: inline-block; vertical-align: top; width: 14px; height: 14px; background-color: #c8c8c8; margin: 0 8px;
    border-radius:50%;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    -o-border-radius:50%;
}
.comment .slick-dots li.slick-active{ background-color: #262626;}
.comment .slick-dots li button{ display: none; }
@media screen and (max-width:991px){
    .comment .slick-slide .img6{max-height: 180px;}
}
@media screen and (max-width:767px){
    .comment .slick-dots li{ width: 11px; height: 11px; }
}



/*5关于我们*/
.aboutBackIn{ background: url("images/about1.jpg") center no-repeat; background-size: cover; }
.about{ padding: 15.73% 0 17% 0; }
.about .aboutEight{ float: right; width: 640px; padding-bottom: 18px; border-bottom: #fff solid 2px; color: #fff; font-size: 24px; line-height: 60px; }
@media screen and (max-width:1199px){
    .about .aboutEight{width: 480px; font-size: 20px; line-height: 44px; }
}
@media screen and (max-width:991px){
    .about .aboutEight{width: 100%;  }
}
@media screen and (max-width:991px){
    .about{ padding: 35% 0 40% 0; }
    .about .aboutEight{ padding: 0 5% 15px 5%; font-size: 16px; line-height: 30px; border-bottom: #fff solid 1px; }
}



/*6联系我们*/
.contactBox{ padding: 4.84% 0 7.64% 0;}
.contactBox .contTit{}
.contactBox .contTit h4{ color: #000000; font-size: 50px; padding-bottom: 3.5%; line-height: 1; text-transform: uppercase;}
.contactBox .contTit .contEng{ padding-top: 9px; color: #444444; font-size: 18px; line-height: 1;}
.contactBox .contDown{}

.contactBox .downLeft{ float: left; width:49.68%; }
.contactBox .downLeft .actText{ color: #444444; font-size: 16px; line-height: 50px; font-style: italic;}
@media screen and (max-width:1599px){
    .contactBox .downLeft{  width:45.29%; }
    .contactBox .contTit h4{ font-size: 38px; }
}

@media screen and (max-width:1199px){
    .contactBox .downLeft{ width: 100%; }
    .contactBox .contTit .contEng{ font-size: 16px; }
    .contactBox .downLeft .actText{ font-size: 14px; line-height: 40px; }
}
@media screen and (max-width:767px){
    .contactBox .contTit h4{ font-size: 29px; }
}




#aMap{width:100%; height:330px; background: no-repeat}
@media  screen and (max-width:991px){
    #aMap{ height:300px; }
}
@media  screen and (max-width:767px){
    #aMap{ height:195px; }
}

.actRight{ float: right; width: 610px; }
.actMap{}
.actRight .actLine{ border-bottom: #d8d8d8 solid 1px; }
.actRight .actLine .text{ float: left; color: #444444; font-size: 18px; line-height: 74px; padding-left: 20px;}
.actRight .actLine .inRight{ padding-left: 90px;}
.actRight .actLine .inRight_2{ padding-left: 120px;}
.actRight .actInput{ float: left; width: 100%; height: 74px; border: 0;  color: #444444; font-size: 18px; line-height:74px; padding: 0; background: 0;
    -webkit-appearance: none; outline: 0;
}
.actRight  .actArea{ float: left; width: 100%; height: 150px; border: 0;  color: #444444; font-size: 18px; line-height:30px; padding: 22px 0; background: 0;
    -webkit-appearance: none; outline: 0;
}
.actRight .actLine_2{ padding-top: 40px;}
.actRight .actButton{ float: left; padding: 0 47px; background-color: #262626; color: #fff; font-size: 18px; line-height: 50px;
    border-radius:4px;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    -o-border-radius:4px;
    -webkit-appearance: none; outline: 0;
}
.actRight .actButton:hover{ background-color: #3c3c3c;}
@media screen and (max-width:1199px){
    .actRight{ float: left; width: 100%; margin-top: 30px; }
}
@media screen and (max-width:767px){
    .actRight .actLine .text{ font-size: 18px; line-height: 48px; }
    .actRight .actInput{ height: 48px; line-height:48px; }
    .actRight  .actArea{  height: 100px;  font-size: 18px; padding: 10px 0; }
}




.special{}
.special .owl-dots{ width: 100%; margin-top: 4%; text-align: center; line-height: 0;}
.special .owl-dots .owl-dot{ display: inline-block; width: 14px; height: 14px; margin: 0 8px; border:#26a3de solid 1px;
    border-radius:50%;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    -o-border-radius:50%;
}
.special .owl-dots .owl-dot.active{ background: #26a3de;}
@media screen and (max-width:991px){
    .special .owl-dots .owl-dot{  width: 11px; height: 11px; margin: 0 5px; }
}




@-webkit-keyframes buzz-out{
    10%{  -webkit-transform:translateX(3px) rotate(2deg);  transform:translateX(3px) rotate(2deg)}
    20%{  -webkit-transform:translateX(-3px) rotate(-2deg);  transform:translateX(-3px) rotate(-2deg)}
    30%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}
    40%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}
    50%{-webkit-transform:translateX(2px) rotate(1deg);transform:translateX(2px) rotate(1deg)}
    60%{-webkit-transform:translateX(-2px) rotate(-1deg);transform:translateX(-2px) rotate(-1deg)}
    70%{-webkit-transform:translateX(2px) rotate(1deg);transform:translateX(2px) rotate(1deg)}
    80%{-webkit-transform:translateX(-2px) rotate(-1deg);transform:translateX(-2px) rotate(-1deg)}
    90%{-webkit-transform:translateX(1px) rotate(0);transform:translateX(1px) rotate(0)}
    100%{-webkit-transform:translateX(-1px) rotate(0);transform:translateX(-1px) rotate(0)}}
@keyframes buzz-out{
    10%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}
    20%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}
    30%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}
    40%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)  }
    50%{-webkit-transform:translateX(2px) rotate(1deg); transform:translateX(2px) rotate(1deg)}
    60%{-webkit-transform:translateX(-2px) rotate(-1deg); transform:translateX(-2px) rotate(-1deg)}
    70%{-webkit-transform:translateX(2px) rotate(1deg);transform:translateX(2px) rotate(1deg)}
    80%{-webkit-transform:translateX(-2px) rotate(-1deg); transform:translateX(-2px) rotate(-1deg)}
    90%{-webkit-transform:translateX(1px) rotate(0);transform:translateX(1px) rotate(0)}
    100%{-webkit-transform:translateX(-1px) rotate(0);transform:translateX(-1px) rotate(0)}}
.buzz-out{
    display:inline-block;
    -webkit-transform:translateZ(0);
    transform:translateZ(0);
    box-shadow:0 0 1px transparent
}
.buzz-out:hover,
.buzz-out:focus,
.buzz-out:active{
    -webkit-animation-name:buzz-out;
    animation-name:buzz-out;
    -webkit-animation-duration:.75s;
    animation-duration:.75s;
    -webkit-animation-timing-function:linear;
    animation-timing-function:linear;
    -webkit-animation-iteration-count:1;
    animation-iteration-count:1
}



/*分页*/
.waik_1{ padding: 6.78% 0 6.78% 0;  text-align:center;}
.waik_2{ padding: 3.93% 0 6.78% 0;  text-align:center;}
.waik_3{ padding: 40px 0 0 0;  text-align:center;}
.fy_phone{ display:none;}
@media  screen and (max-width:991px){
    .fy_phone{ display:block; }
    .fy_phone{ width:100%; float:left; text-align:center; font-size:14px; color:#333;}
    .fy_phone a{ display:inline-block; width:110px; height:30px; line-height:29px; border:solid 1px #031d2c; color:#333;text-decoration:inherit;
        -webkit-border-radius:15px;
        -moz-border-radius:15px;
        border-radius:15px;
    }
    .fy_phone span{ display:inline-block; padding:0 15px; height:30px; line-height:30px; color:#333;}
}
@media  screen and (max-width:767px){
    .waik_1{ padding:6% 0 6% 0;}
}

.page{ float: left; width: 100%; text-align: center;}
.page ul{ float: none!important; display:inline-block; zoom: 1; width: auto!important;}
.page a { float: left; width: 38px; height: 38px; margin: 0 5px;}
.page a li{ float: left; width: 100%; text-align: center; line-height: 36px!important; padding: 0!important;border:1px solid #e3e3e3;border-bottom:1px solid #e3e3e3 !important;border-radius:38px;-moz-border-radius:38px; -webkit-border-radius:38px;}
.page a:last-child,
.page a:first-child{ width: 100px; height: 38px;}
.page a:last-child li,
.page a:first-child li{border-radius:20px;-moz-border-radius:20px; -webkit-border-radius:20px;}
.page li:hover
{
    color: #fff;
    border: 1px solid #2087b7; background-color: #2087b7;
    border-bottom:1px solid #2087b7 !important;
}
.page li img.img1{vertical-align: initial;}
.page li img.img2{
    display: none;
    vertical-align: initial;
}
.page li:hover img.img1,
.page li.pageact img.img1{
    display: none;
    vertical-align: initial;
}
.page li:hover img.img2,
.page li.pageact img.img2{
    display: inline-block;
}
.page li.pageact
{
    color: #fff;
    border: 1px solid #2087b7; background-color: #2087b7;
    border-bottom:1px solid #2087b7 !important;
}







.elli{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
@media screen and (max-device-width: 320px){body{-webkit-text-size-adjust:none}}
@media screen and (max-device-width: 480px){body{-webkit-text-size-adjust:none}}
@media only screen and (-webkit-min-device-pixel-ratio: 2){body{-webkit-text-size-adjust:none}}
@media only screen and (min-device-width: 768px) and (max-device-width: 1243px){body{-webkit-text-size-adjust:none}}
