@charset "utf-8";
/* CSS Document */

.clear{ clear:both;}

.xql{ width:65%; float:left;}
.xqr{ width:32%; float:right;}
.xqr ul li{ padding:10px 0; font-size:16px;}
.xqr ul li h3{ color:#00A1E9; font-size:22px;}
.xqr ul li a{ display:block; background:#00A1E9; color:#fff; font-size:18px; padding:8px 10px; width:150px; text-align:center; letter-spacing:2px;border-radius:25px;}
.xqr ul li a:hover{ background:#00A1E9;}
.xqr ul li b{ font-size:30px; color:#00A1E9;}

.wordsbox{width: 100%;position:relative;background-color: rgba(241,242,244,0.8);box-shadow: 0px 12px 8px -12px rgb(0 0 0 / 10%); bottom:0; z-index:99;}
.wordsbox::after{content: "";display: block;width:600px;height: 100px;position: absolute;left: 0;bottom: 0;z-index: 1; background: url(../images/img60.png)no-repeat bottom right;background-size: cover;box-shadow: 0px 12px 8px -12px rgb(0 0 0 / 10%);}
.wordsbox .content{width: 100%;display: flex; flex-direction: row; justify-content: space-between; align-items: left;position: relative; z-index: 2;}
.wordsbox .content .left{padding-top: 6px;font-size: 0;}
.wordsbox .content .left .tit{font-size: 28px;color: #00A1E9;line-height: 28px;display: inline-block;vertical-align: middle;margin-right: 18px;}
.wordsbox .content .left .ico{width: 49px;height: 20px;display: inline-block;vertical-align: middle}

.wordsbox .content .center{width: 50%;}
.wordsbox .content .center ul{width: 100%;text-align: center;font-size: 0;}
.wordsbox .content .center ul li{display: inline-block;vertical-align: middle;margin: 0 34px;}
.wordsbox .content .center ul li a{display: block;font-size: 16px;color: #666666;line-height: 70px;}
.wordsbox .content .center ul li:hover a,
.wordsbox .content .center ul li.on a{color: #00A1E9;}
.wordsbox .content .right{font-size:15px;}
.wordsbox .content .right .ico{display: inline-block;vertical-align: middle;margin-right: 10px;}
.wordsbox .content .right a{display: inline-block;vertical-align: middle;font-size: 15px;line-height: 70px;}
.wordsbox .content .right span{display: inline-block;vertical-align: middle;font-size: 15px;line-height: 70px;margin: 0 8px;}
.wordsbox .content .right a:hover,
.wordsbox .content .right a.on{color: #00A1E9;}

.productss { width:100%; float:left; }

.zzsc {
  width: 100%;
  height: auto;
  text-align: center;
}

.zzsc .tab {
  overflow: hidden;
  margin-top: 30px;
  margin-bottom: 10px;
}

.zzsc .tab a {
  display: inline-block;
  font-size: 18px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  text-decoration: none;
  color: #666;
  border: 1px solid #dedede;
  transition: all 0.3s;
  position: relative;
  margin: 0 5px; padding:0 20px;
}


.zzsc .tab a.on {
  text-decoration: none;
}

.zzsc .tab a:hover {
  color: #fff;
  background: #00A1E9;
}

.zzsc .tab .onn {
  color: #fff;
  background: #00A1E9;
}


.pro_con {}
.pro_con a { display: block; float: left; width:31.3%; margin: 1%; background: #fff; box-shadow: 0 0 10px 0 #ccc; }
.pro_con a img{ width:100%;}
.pro_con span { display: block; overflow: hidden; }
.pro_con p {

    color: #333;
    text-align: center;
    line-height: 40px;
    font-size: 18px;
    padding:20px 10px;
    white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

.pro_con a:hover { box-shadow: 0 0 20px #dedede;}
.pro_con a:hover p { color: #00A1E9;}

/*product start*/
.pl_top{text-align: center;width: 180px;color: #fff;}
.pl_top em,.pl_top b{display: block;text-align: center;}
.pl_top em {font-size: 18px;color: #ddd;font-family: Arial;line-height: 180%}
.pl_top b{font-size: 24px;color: #fff;letter-spacing: 4px;line-height: 60px;position: relative;top: -3px}
.pl_top i{font-size: 15px;text-transform: uppercase;}
.pl_top b span{color: #aaa;letter-spacing: -5px}
/* 友情链接 */
.links-title{ width:100%; height:40px; line-height:40px; font-size:24px; color:#fff;}
.links{ width:100%; height: auto; background: #313131; clear: both; display: none;}
.links ul{ width:1200px; height:auto; margin:0 auto; padding:10px 0px;clear:both;}
.links ul li{float:left; margin:0px; color: #fff;line-height:23px;}
.links ul li a{color:#fff; padding:0px 8px; font-size:14px; line-height:23px; display:inline-block; }
.links ul li a:hover{ color:#fff; text-decoration:none;}

.innerrtitle{ width:100%; height:50px; line-height:50px; background: #f1f2f4;}
/*.innerrtitle p{width:400px;float:right;font-size:19px;color:#444;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; text-align:right; padding-right: 10px;}
.innerrtitle p b{ color:#da0707; font-size:26px; font-style: italic;}*/

.ncontainer{ padding: 0px 0;}
.wapup{display:none;}

/*大屏PC*/
@media (min-width: 1200px){
	.ncontainer{width: 1200px; height: auto; margin: 0 auto; padding: 0px;}
	.links{ display: block;}
}
.ncontainer .pro_ll{width: 275px; margin-bottom:40px;}

.titleee{ text-align:center; padding:10px 0;}
.titleee b{color: #00A1E9;font-size: 30px;font-weight: bold;}
.titleee b span{color: #00A1E9}
.titleee i{display: block;color: #b2b2b2;font-family: Arial;font-size: 18px;}

.titlee{}
.titlee b{color: #00A1E9;font-size: 30px;font-weight: bold;}
.titlee b span{color: #00A1E9}
.titlee i{display: block;color: #b2b2b2;font-family: Arial;font-size: 18px;}

.ncontainer .pro_bodyb{background: url(../images/probgb.jpg) no-repeat center top; margin-top:30px; min-height:300px; width:100%; float:left;}
.pro_lll{ float:left; margin-top:20px;}
.pro_lll ul li{width: 265px;height:58px;background: #00A1E9;margin-bottom:7px}
.pro_lll ul li a{display: block;height: 58px;line-height: 58px;color: #fff;font-size: 17px;padding-left:18px;background: url(../images/proicon.png) no-repeat 10px center;}
.pro_lll ul li a span{ padding-right:8px;}
.pro_lll ul li a:hover{background: url(../images/proicon.png) no-repeat 10px center #00A1E9;}

.erji {text-align: center;width: 100%; -webkit-transition: all linear .5s;transition: all linear .5s;color: #333; margin-bottom:10px;}
.erji p{ width:96%; margin-left:2%; text-align: left; font-size: 16px;  border-bottom: 1px solid #f1f1f1; display:block;}
.erji p a{ color:#333; display: block; padding-left:20px; line-height:42px;}
.erji p a:hover{ background:#00A1E9; color:#fff;}


.ncontainer .pro_r {width: 925px; margin-bottom:53px;}
.ncontainer .pro_r ul li{width: 206px;float: left;margin-left: 25px;margin-bottom: 30px}
.ncontainer .pro_r ul li .img{width: 206px;height: 155px;overflow: hidden;}
.ncontainer .pro_r ul li .img img{width: 206px;height: 155px;display: block;transition:.5s ease-in;}
.ncontainer .pro_r ul li p{height: 30px;line-height: 30px;text-align: center;display: block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;background: #d0d0d0;border-radius: 35px;margin-top: 10px;color: #333;padding: 0 13px}
.ncontainer .pro_r ul li:hover img{ transform:scale(1.1,1.1);}
.ncontainer .pro_r ul li:hover p{background: #00A1E9;color: #fff;}

.pro_rr{width: 925px;float: left;}
.pro_rr dd{width:31%; float:left; margin:10px 1%; position: relative;}
.pro_rr dd .img{width: 100%;height: 100%;overflow: hidden;background: #000;}
.pro_rr dd .img img{ width: 100%; height: 100%; display: block;transition:.5s ease-in;opacity: 0.95}
.pro_rr dd:hover .img img { transform:scale(1.1,1.1);}
/*.pro_rr dd:nth-child(3) {margin-top: 16px}*/
.pro_rr dd p{position: absolute;width: 100%;height: 35px;background: rgba(0,0,0,0.8);bottom: 0;text-align:center;line-height: 35px;color: #fff;font-size: 15px}

.pro_rr dt:hover p,.pro_rr dd:hover p {background: rgba(53,92,161,0.9)}


.ncontainer .pro_re {width:100%; float:left;}
.ncontainer .pro_re ul li{ width:23%;float: left; margin:1%;}
.ncontainer .pro_re ul li .img{width: 100%;overflow: hidden;box-shadow: 0 0 10px 0 #ccc; border-radius:0;}
.ncontainer .pro_re ul li .img img{width: 100%;display: block;transition:.5s ease-in;}
.ncontainer .pro_re ul li .zi{ width:100%; height:45px; background:#00A1E9;}
.ncontainer .pro_re ul li p{ font-size:15px; line-height:45px; color:#fff;display: block; text-align:center;}
.ncontainer .pro_re ul li:hover img{ transform:scale(1.1,1.1);}
.ncontainer .pro_re ul li:hover .zi{ background:#00A1E9;}
.ncontainer .pro_re ul li:hover .zi p{ color:#fff;}


/* 内页左边 */
.innerleft{ width:100%; float:left; height:auto; margin:5px 0px 10px 0px; }
.innerltitle{background-color:#00A1E9;width:100%; height:auto;}
.innerltitle p{ font-size:25px;color:#fff;text-align:center;line-height:40px !important; padding: 0px !important;}
.innerltitle span{ font-size:25px;color:#fff;text-align:center; display:block; }
.iltcontf{ width:100%;}
.iltconts{ border:5px solid #00A1E9;  margin-top:20px;}

.slide-nav  ul {
	list-style: none;
	margin-top: 30px;
	padding: 0;
}
.slide-nav  ul li {
	margin:5px 15px; width:30%; float:left;
	overflow: hidden;

}

.slide-nav  ul li a {
	text-decoration: none;line-height:58px;font-size:16px;margin-top:0;display: block;background:#00A1E9; color:#fff;transition:all 0.3s; text-align:center;}
.slide-nav  ul li a:hover{  color: #D10505;}

.product_navv { background: #fff; }
.product_navv ul li a{ background: #00A1E9; color: #fff;  display: block; height: 50px; line-height: 50px; font-size: 18px; padding: 10px 20px;}

.product_navv ul li a span { float: right; border-left: 1px solid rgba(255,255,255,.2); height: 40px; line-height: 40px;  padding: 0 0 0 20px;  margin: 5px 0; color: #fff;}
.product_navv ul li ul li a i{ padding-right:5px;}
.product_navv ul li ul li a{background:none; color: #333; font-size: 16px; height: 35px; line-height: 35px; transition: all .3s; padding:5px 20px;}
.product_navv ul li ul li a:hover { background: #00A1E9; color: #fff; }

/*栏目*/
.inermlist{ width:100%; height:auto;  margin:0 auto; padding:10px 0px; }
.inermlist li{ width:100%;height:auto;margin:7px auto; position: relative;}
.inermlist li a{ width:235px;height:40px;line-height:40px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#666;font-size:15px; float: left;text-indent:20px;text-align:left;}
.inermlist li a:hover{text-indent:21px;color:#CE0A0F;font-weight:bold;text-decoration:none;}
.inermlist li ul{ padding: 0px; display: none;}
.inermlist li ul li{ width: 100%;margin: 0px;height: 35px;}

.inermlist li ul li a{ width:100%;height: 35px; line-height: 35px; background:none; color: #777; font-size: 15px; display: block; text-indent: 15px; text-align: left;}
.inermlist li ul li a:hover{ color:#ca352b;background: none; text-indent: 16px;}
.inermlist .addsubicon { width:30px; height: 40px; line-height:35px; color: #555; font-size:25px; float:right; text-align: center; display: block; cursor: pointer; font-weight: bold;}
/*热门新闻*/
.innernlist{width:95%; margin:0 auto; padding:10px 0px;}
.innernlist li{ width:100%;line-height:35px; border-bottom:1px dashed #dedede; height:35px; overflow:hidden; }
.innernlist li a{display: block;color:#3d3d3d;white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.innernlist li a:hover{color:#00A1E9; text-indent:1px; }
.innernlist li span{float:right;}

/* 内页右边 */
.innerright{width:100%;float:left; height:auto;margin:0px 0px 30px 0px; padding-bottom:20px;background-color:#fff; line-height:200%;}
.inrrctainer{width:900px; height:auto; font-size: 14px; line-height:26px;color:#666; float:right; line-height:200%;}
.inrrctainer table{margin: 0 auto; text-align: center;}
.inrrctainer img{ max-width: 100% !important;}

/* 内页简介 */


/* 内页联系我们 */
.inrrctainer .wz:hover{color:#00A1E9; text-indent:1px;}
.inrrctainer .bk{width: 500px; height:50px;}
.inrrctainer .contact_l{float:left; width: 500px;}
.inrrctainer .kb{float:left;}
.inrrctainer .contact_r{float:left;}

/*内页新闻*/
.innewslist{ width:100%; height:auto;}
.innewslist li{height:auto; width:48%; margin:1%;  padding:18px 0px;  box-shadow: 0 0 20px #f5f5f5; float:left;}
.innewslist li a{ display:block;}
.innewslist li .innewleft{ width:110px; float: left; text-align: center; color:#191919; padding-top:6px;}
.innewslist li .innewleft p{ font-size:30px;text-align: center; color:#00A1E9;}
.innewslist li .innewleft span{ font-size:18px; line-height:45px; color:#00A1E9;}
/*.innewslist li .innewright{ width:100%; float: right;}*/
.innewslist li .innewright{ width:calc(100% - 130px); float: right; margin-right: 10px;}
.innewslist .ntitle{ width:100%;line-height:35px; color: #444;font-size:18px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.innewslist .nconc{width:100%;height:auto;line-height:25px;font-size:14px; color:#656565;overflow: hidden;}
.innewslist .more{height:30px; line-height:30px; border-radius:15px; text-align:center; color:#00A1E9; padding: 0px 15px;text-indent:0px; margin: 10px 0px; border:1px solid #00A1E9; display: inline-block;}
.innewslist .ptime{height:30px; line-height:30px; color:#ccc;}

.innewslist li:hover{ border-radius: 4px; color:#00A1E9; box-shadow: 0 0 20px #dedede; border:none;}
.innewslist li:hover .more{background: #fff; border: 1px solid #fff; color: #666;}
.innewslist li:hover .nconc{width:100%;height:auto;line-height:25px;font-size:14px; overflow: hidden;}
.innewslist li:hover .ntitle{color:#00A1E9;}
.innewslist li:hover .innewleft{color:#00A1E9;}

/*内页产品*/
.inprolist{ width:100%; height:auto; list-style:none; text-align: center;}
.inprolist li{ width:280px; float:left;height:auto;margin:0px 8px 20px 8px;}
.inprolist li img{width:100%; height:207px;-moz-transition:.5s ease-in;-webkit-transition:.5s ease-in;-o-transition:.5s ease-in;-ms-transition:.5s ease-in;transition:.5s ease-in; vertical-align: top;}
.inprolist li .img{ width:276px; height: 207px; overflow: hidden; border: 1px solid #dedede; padding: 1px;}
.inprolist li p{padding: 0px 5px;line-height:35px; height:35px;background: #dedede; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.inprolist li a{color:#333;display: block;}
.inprolist li:hover a{color:#fff !important;text-decoration:none;  }
.inprolist li:hover p{ background: #CE0A0F;}
.inprolist li:hover .img{border: 1px solid #CE0A0F;}
.inprolist li:hover img{transform: scale(1.1, 1.1);opacity:0.4;filter:alpha(opacity=40);}

.incaseslistx{ width:100%; height:auto; list-style:none; text-align: center;}
.incaseslistx li{ width:425px; float:left;height:auto;margin:0px 8px 20px 8px;}
.incaseslistx li img{width:100%; height:318px;-moz-transition:.5s ease-in;-webkit-transition:.5s ease-in;-o-transition:.5s ease-in;-ms-transition:.5s ease-in;transition:.5s ease-in; vertical-align: top;}
.incaseslistx li .img{ width:425px; height: 318px; overflow: hidden; border: 1px solid #dedede; padding: 1px;}
.incaseslistx li p{padding: 0px 5px;line-height:35px; height:35px;background: #dedede; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.incaseslistx li a{color:#333;display: block;}
.incaseslistx li:hover a{color:#fff !important;text-decoration:none;  }
.incaseslistx li:hover p{ background: #ca352b;}
.incaseslistx li:hover .img{border: 1px solid #ca352b;}
.incaseslistx li:hover img{transform: scale(1.1, 1.1);opacity:0.4;filter:alpha(opacity=40);}

/*视频*/
.invideolist{ width: 100%; height: auto;}
.invideolist li{ width:430px; height: auto; float: left; margin: 10px 7px;}
.invideolist li p{ width: 100%; height:30px; line-height: 30px; text-align: center; }
.videoiframe{width:100%; height:300px;}

/*分页*/
.ipage{height:auto; text-align:center;}
.totalfont{ font-size: 14px; color: #666; display: none;}
.ipage a{ height:35px;line-height:35px;color:#888;font-size: 15px;padding:0px 5px;display: inline-block;margin: 0px 5px; vertical-align: top;}
.ipage a:hover{color:#D10505;border-bottom:2px solid #D10505;text-decoration:none;font-weight:bold;}
.ipage .current{color:#D10505;border-bottom:2px solid #D10505;display:inline-block; height:35px;line-height:35px;padding:0px 5px;margin:0px 5px;font-size:15px;font-weight:bold;}

.nytitle{ width:100%; text-align:center;}
.nytitle b{color: #1d1d1d;font-size: 35px;font-weight: bold;}
.nytitle b span{}
.nytitle i{display: block;color: #b2b2b2;font-family: Arial;font-size: 18px;}


/*详情页*/
.article_title{ text-align:center; width:100%; font-size:24px; line-height:30px; color:#444; padding: 15px 0px;}
.newsin-c{width:100%; height:30px; line-height: 30px; margin: 15px 0px; color: #666;}
.newsin-c .date{ width: 190px; float: left; text-indent:0px; font-size: 14px;}
.newsin-c .date i{ width:28px;height:30px; display:inline-block; background:url(../images/time.png) no-repeat left center; background-size: 22px 22px; float: left;}
.newsin-c .click{ width: auto; height: 30px; line-height: 30px; text-align: right; float:right;}
.newsin-c .click i{ width: 30px;height:30px; display:inline-block; background:url(../images/eye.png) no-repeat left center; background-size: 25px 25px; float: left;}

/*上页下页*/
.detpnt{height:auto; background:#f1f1f1;overflow: hidden;margin:20px 0; width:100%; float:left;}
.detpnt .detpntline{width:35%;height:35px;line-height:35px;font-size: 15px;font-weight: bold;white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 20px;}
.detpnt .detpntline a{color:#666; font-weight: normal;}
.detpnt .detpntline a:hover{ color: #00A1E9; }
.detpntl{ float: left; text-align:left;}
.detpntr{text-align:right;float:right;}

/*更多阅读*/
.innerabouttitle{ width:100%; height:auto; border-bottom:3px solid #dedede;}
.innerabouttitle p{color:#e27a1b;font-size:30px; text-align: center; font-weight:bold;height:35px; line-height:35px;}

.fotdetbox{}
.morearticle{ padding: 10px 0;}
.morearticle li{ width:30%; line-height:28px; float:left; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; border-bottom:1px dashed #f1f1f1; margin: 0px 1%; padding:10px 0;}
.morearticle li a{ color:#333; padding-left:10px;}
.morearticle li a:hover{ color:#00A1E9; padding-left:11px;}
.moreproducts{border: 1px solid #fff; padding: 10px 0px;}
.moreproducts li{ width:18%; height:auto;float:left; margin:0px 1%; text-align:center;}
.moreproducts li a{ color:#333;}
.moreproducts li p{ text-align: center; line-height:30px;}
.moreproducts li a:hover{ color:#00A1E9;}
.moreproducts li img{ width:100%;height:auto;}
.moreproducts li a:hover img{}
.moreproductsov{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/*留言*/
.inmessagebox{width: 600px;height: auto; padding: 0px 0px 50px 0px; margin: 0 auto; }
.inmessright{ width: 550px; height:auto; float: right; padding: 30px 0px 50px 0px;}
.inmessright img{ width: 550px;}
.inmessline{ width: 100%; height: auto; margin-bottom: 15px}
.zxlyinp{ width:100%;height:40px;line-height:40px;border-radius:2px;color: #999; background: #f8f8f8; border: 0px;vertical-align:top; text-indent: 10px; font-size: 14px; outline: none;}
.inmesteat{ height:120px;resize: none; outline: none;}
.zxlyyzm{width:140px; outline: none;height:40px;line-height:40px;font-size:14px; color: #999; background: #f8f8f8; border: 0px;vertical-align: top; text-indent: 10px;border-radius:2px;}
.zxlysub{background:#00A1E9;width:48%; outline: none; height:40px; line-height:40px;color:#fff; text-align:center; border-radius:2px;border:0px; font-size:16px; float: left;cursor:pointer;}
.zxlysub:hover{background: #ffa200;}
.resetc{background:#999;float:right;}
.resetc:hover{background: #666;}
.indexcode{ vertical-align:top; height: 40px;}

/*图片集*/
#bodycontent .hov{ display: block;}
#bodycontent p{ display: none;}
.imgnav{  position:relative; margin:0 auto; width:100%;}
#tabsmalimg{ z-index:10; position:relative; text-align:center; margin-top:11px; width:720px; float:left; box-shadow: 0 0 10px 0 #ccc;display: table-cell; vertical-align: middle;}
#tabsmalimg img{ width:100%; display:none; vertical-align: middle;}
#pofront,#ponext{position:absolute;z-index:10;cursor:pointer;width:30px;height:auto;top:50%; margin-top: -30px;}
#pofront{left:10px}
#ponext{right:10px}
#pofront a,#ponext a{display:block;height:60px;}
#pofront a{background:url(../images/index_tab_l.png) no-repeat; }
#ponext a{background:url(../images/index_tab_r.png) no-repeat;}

#cbtn{background:#EAEBF0; position:relative; height:540px; padding:0 20px; width:118px; float:right; margin-top:10px; }
#cbtn ul{position:relative;  height:10000px;}
#cbtn ul li{width:116px; height:86px; cursor:pointer; text-align:center; margin-bottom:14px; position:relative;}
#cbtn ul li img{ width:116px; height:86px; display:block;}
#cbtn ul li tt{ background:#000; color:#FFF; position:absolute; right:4px; bottom:4px; z-index:20;font-size:12px; line-height:16px; padding:0 5px;}
#cbtn li.hov{ border:1px solid #ccc;/*background:url(../images/ico/imgHoverBg.gif) no-repeat;*/}
.ctrl div{ clear:both;}
#cSlideUl{width:100%; height:488px;overflow:hidden; position:relative; top:28px; margin:0 auto;}
.picSildeLeft{cursor:pointer; position:absolute; top:0px; left:67px; z-index:9;}
.picSildeRight{cursor:pointer; position:absolute; bottom:0px; left:67px; z-index:9;}


.swiper-slidee {
	-webkit-flex-shrink:0;
	-ms-flex-negative:0;
	flex-shrink:0;
	width:100%;
	height:100%;
	position:relative;
	-webkit-transition-property:-webkit-transform;
	transition-property:-webkit-transform;
	-o-transition-property:transform;
	transition-property:transform;
	transition-property:transform, -webkit-transform
}

.product-list .swiper-container {
  height: 100%;
  padding-bottom: 70px;
}

.product-list .swiper-wrapper {
  margin-top: 20px;
}

.product-list .swiper-slidee {
  text-align: center;
  font-size: 15px; width:31.33%; float:left; margin:1%; box-shadow:0 0 10px #ccc; 
}

.product-list .swiper-slidee img {
  display: block;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
}

.product-list .swiper-slidee p {
  background-color: #00A1E9;
  color: #fff;
  line-height:35px;
  padding: 10px 3px;
}

.product-list .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 10px;
}

.product-list .swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}

.product-list .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  display: inline-block;
  border-radius: 100%;
  background: #000;
  opacity: .2;
  margin: 0 5px;
}

.product-list .swiper-pagination-bullet-active {
  opacity: 1;
  background: #00A1E9;
}

.show {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  background: rgba(0, 0, 0, .6);
  transition: all 0.5s ease;
}

.showBoxLink {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 60%;
  color: #fff;
  text-align: center;
  font-size: 16px;
  padding: 5px 0;
}

.showBoxLink::before {
  content: '';
  position: absolute;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  width: 60%;
  height: 1px;
  background: #fff;
  transition: all .5s ease;
}

.showBoxLink::after {
  content: '';
  position: absolute;
  bottom: 0px;
  left: 50%;
  transform: translateX(-50%);
  width: 60%;
  height: 1px;
  background: #fff;
  transition: all .5s ease;
}

.product-list .swiper-slidee span {
  overflow: hidden;
  display: block;
}

.product-list .swiper-slidee span img {
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

.product-list .swiper-slidee:hover img {
  transform: scale(1.3);
  transition: all 1s ease 0s;
  -webkit-transform: scale(1.3);
}

.product-list .swiper-slidee:hover .show {
  opacity: 0.7;
}

.product-list .swiper-slidee:hover .showBoxLink::before,
.product-list .swiper-slidee:hover .showBoxLink::after {
  width: 20%;
}