

.img-center{text-align:center;font-size:0}
.img-center img{display:inline-block;width:auto;height:auto;max-width:100%;max-height:100%;vertical-align:middle;transition:all 0.5s}

.img-cover{overflow:hidden;position:relative}
.img-cover span{display:block;width:100%;background:no-repeat center / cover;transition:all 0.5s;height:100%;position:absolute;left:0;top:0}

.container{padding:0 10px;width:1200px;margin:0 auto}

.section-sub{ padding: 60px 0; }

.list-2{ margin: 0 0 0 -17px; }
.list-2 li{ float: left; width: 25%; }
.list-2 li a{ display: block; padding-bottom: 130px; text-align: center; background-color: #FFF; margin: 0 0 17px 17px; position: relative; }
.list-2 li .text{ position: absolute; bottom: 0 ; width: 100%; box-sizing:  border-box; padding:0 20px 40px; background-color: #FFF;}
.list-2 li .text h2{ margin: 0;}
.list-2 li .text p{ margin:10px 0; display: none; transition: all 0.5s; text-align: left;}
.list-2 li .text .btn{ margin-top: 10px; }
.list-2 li a:hover .text{ padding: 30px 20px; transition: all 0.5s; }
.list-2 li a:hover .text p{ display: block; }




.pages {margin:20px 0px ;text-align: center;font-size: 0;}
.pages a {display: inline-block;font-size: 14px;line-height: 35px;padding: 0 12px;margin: 5px;border:1px solid #f5f5f5; background-color: #FFF;border-radius: 3px;-webkit-transition: all 0.5s;transition: all 0.5s;}
.pages a:hover,.pages a.active {background-color: #ffcd11;}

.infocontent-title{margin-bottom:20px;text-align:center}
.infocontent-title h1{margin:0;font-size:28px}
.infocontent-title p{margin:10px 0 0;color:#999}
.infocontent-title p span{padding:0 10px}
.infocontent-title p span i{ margin-right: 5px; }

.infocontent-body{line-height:2;margin-bottom:20px; font-size: 16px;}
.infocontent-body p {font-size: 18px;  line-height: 2.5; color: #000000;}
.infocontent-body img{max-width:100% !important;height:auto !important;width:auto !important}

.pc-slide{float:left;width:600px; background-color: #FFF; padding: 10px;}
.view .swiper-slide .img-center{width:100%;height:372px;line-height:372px}
.view .swiper-container{width:100%}
.preview{width:100%;margin-top:10px;position:relative}
.preview .swiper-container{margin:0 30px}
.preview .swiper-slide .img-center{height:80px;border:1px solid #ddd;cursor:pointer;position:relative;line-height:80px}
.preview .arrow-left{background:url(../images/feel3.png) no-repeat left top;position:absolute;left:0;top:50%;margin-top:-9px;width:9px;height:18px;z-index:10}
.preview .arrow-right{background:url(../images/feel4.png) no-repeat left bottom;position:absolute;right:0;top:50%;margin-top:-9px;width:9px;height:18px;z-index:10}
.preview .active-nav .img-center{border-color:#ffcd11}

div.zoomDiv{z-index:999;position:absolute;top:0;left:0;background:#ffffff;border:1px solid #ddd;display:none;text-align:center;overflow:hidden;font-size:0}
div.zoomMask{position:absolute;background:url(../images/mask.png) repeat scroll 0 0 transparent;cursor:move;z-index:1}

.showcase{  border-bottom: 3px solid #ff8e09; position: relative;}
.showcase:before{ position: absolute; left:0;top:0; width: 30%; height: 100%; z-index: -1; background-color: #FFF; content:'';}
.showcase-info{margin-left:610px; padding: 30px;}
.showcase-info h1{font-size:24px;margin:0 0 10px; color: #ffcd11;}
.showcase-info h1 span{ color: #006666; }
.showcase-info .desc{margin:5px 0 10px;color:#000;line-height:2; font-size: 18px;font-family: "Microsoft YaHei"; }
.showcase-info .desc p{font-size: 18px;color: rgb(255, 0, 30);line-height: 3;font-weight: bold;font-family: "Microsoft YaHei"; }
.showcase-info .desc p span{ font-weight: bold; }
.showcase-info .sc{ font-size: 20px; font-weight: bold; margin: 10px 0;}
.showcase-info .sc i{ margin-right: 12px; color: #999; }
.showcase-info .sc a:hover{ color: #ff8a00; }
.showcase-info .tel{ color: #666; font-size: 16px;  margin: 10px 0; }
.showcase-info .tel i{ margin-right: 10px; }
.showcase-info .tel a{ color: #666; }
.showcase-info .btn{ margin-top: 20px; }
.showcase-info .btn a{ background-color: #ff8e09; color: #fff; display: inline-block; font-size: 20px; padding:10px 20px; font-weight: bold;}
.showcase-info .btn a:hover{ color: #333; background-color: #ff8e09;  }

.prodmenu{ border-bottom: 1px solid #dfdfdf;}
.prodmenu .tit{display: flex; justify-content: flex-start; align-items: center; height: 100px; }
.prodmenu .tit h1{margin:0 20px 0 0; font-weight: normal; }
.prodmenu .tit span{ color: #ff8e09;  font-size: 30px; }

@media screen and (max-width: 768px) {
.container {width: auto; }
	.section-sub{ padding:20px 0; }


      .list-2{ margin: 0 0 0 -10px; }
    .list-2 li{ width: 50%; }
    .list-2 li a{  padding-bottom: 50px;  margin: 0 0 10px 10px; }
    .list-2 li .text{  padding:10px; }
    .list-2 li .text h2{ font-size: 16px;font-weight: normal;}
    .list-2 li a:hover .text p{ display: none;}
    .list-2 li a:hover .text{ padding: 10px; transition: all 0.5s; }


    .showcase {margin-bottom: 30px;}
    .showcase:before{ width: 100%;}
    .pc-slide {float: none;width: auto; padding: 10px;}
    .view .swiper-slide .img-center {height: 260px;line-height: 260px;}
    .preview .swiper-slide .img-center{height:50px;line-height:50px}
    .showcase-info {margin: 20px 0 0; padding:20px 0; width: auto;}
    .showcase-info h1 {margin-bottom: 20px;font-size: 18px;}
    .showcase-info p {margin-top: 10px;min-height: auto;}
    .showcase-info .tel {font-size: 14px;}
    .showcase-info .tel strong {font-size: 18px;}

    .prodmenu .tit{flex-wrap: wrap;height: auto; padding-bottom: 25px; }
    .prodmenu .tit h1{width: 100%; margin: 0; } 



}
