@charset "utf-8";
/*电脑端css  默认情况  当宽度大于1440时  宽度1440px*/
/*默认样式*/
*{ margin: 0; padding: 0; }
html,body{ font-family: "微软雅黑"; font-size: 14px; line-height: 24px; color: #333; background: #fff;}
ul,li{ list-style-type: none; }
img{ border: none; }
a{ text-decoration: none; color: #333; }
a:hover{ text-decoration: none; color: #d00000; }
input{ outline: none;}
textarea{ outline: none;}
.clear{ width: 0; height: 0; overflow: hidden; clear: both; line-height: 0;}





/*top*/
.top{ width: 1200px; height: 140px; margin: 0 auto; clear: both; display: table;}

/*logo*/
.logo{ width: auto; height: 140px; float: left; display: inline-table;}
.logo p{ display: table-cell; vertical-align: middle;}
.logo p img{ width: 400px; height: 80px; display: inline-block; vertical-align: middle;}

/*zixun*/
.zixun{ float: right; margin: 16px 0 0 0;}
.zixun ul{}
.zixun ul li{ width: 110px; height: auto; float: left; text-align: center;}
.zixun ul li img{ width: 90px; height: 90px; display: block; margin: 0 auto;}
.zixun ul li p{ font-size: 13px; line-height: 26px;}



/*menu*/
.menu{ width: 100%; height: 60px; background: #ca0f1a; clear: both;}
.menu ul{ width: 1200px; margin: 0 auto;}
.menu ul li{ color: #fff; float: left; width: 12%; text-align: center; position: relative;}
.menu ul li h2{ font-size: 16px;}
.menu ul li h2 a{ color: #fff; line-height: 60px; display: block; cursor: pointer;}
.menu ul li h2 a:hover{ color: #fff36c; background: #9b0009;}
.menu ul li h2 a.active{ color: #fff36c; background: #9b0009;}


/*banner*/
.banner{ width: 1200px; height: 160px; margin: 20px auto 0 auto; clear: both;}
.banner img{ width: 1200px; height: 160px; display: block;}




/*product*/
.product{ width: 1200px; height: auto; margin: 60px auto 0 auto; clear: both;}

/*product  分类标题*/
.product_h{ width: 100%; height: 46px;}
.product_h ul{}
.product_h ul li{ width: 120px; height: 46px; line-height: 30px; float: left; background: #e6e6e6; text-align: center; cursor: pointer; display: inline-table;}
.product_h ul li:hover{ background: #0054c6; color: #fff;}
.product_h ul li.active{ background: #0054c6; color: #fff;}
.product_h ul li p{ display: table-cell; vertical-align: middle;}


/*product  对应内容*/
.product_c{ width: 100%; height: auto; background: #fff; box-sizing: border-box;}
.product_c ul{}
.product_c ul li{ width: 285px; height: 285px; overflow: hidden; float: left; margin: 20px 0 0 20px; background-color: #e6e6e6; border-radius: 6px; text-align: center; cursor: pointer; display: inline-table; position: relative;}
.product_c ul li:nth-child(4n+1){ margin: 20px 0 0 0;}

.product_c ul li p{display: table-cell; vertical-align: middle;}
.product_c ul li p img{ width: auto; height: auto; max-width: 285px; max-height: 285px; display: inline-block; vertical-align: middle;}

.product_c ul li h4{ position: absolute; bottom: 0; width: 100%; padding: 0 10px; box-sizing: border-box; font-size: 14px; line-height: 36px; background: rgba(0,0,0,0.4); color: #fff; font-weight: normal; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}


/*图片放大查看*/
.bigshow{ width: 100%; height: 100%; background: rgba(0,0,0,0.6); position: fixed; top: 0; left: 0; text-align: center; display: none; z-index: 200;}
.bigshow p{display: table-cell; vertical-align: middle;}
.bigshow p img{ width: auto; height: auto; display: inline-block; vertical-align: middle;}

.bigshow span{ width: 60px; height: 60px; display: inline-block; position: absolute; top: 0px; right: 0px; cursor: pointer; background: rgba(255,255,255,0.8); border-radius: 0; border-bottom-left-radius: 60px;}
.bigshow span img{ width: 40px; height: 40px; display: inline-block; margin: 2px 0 0 8px;}



/*foot*/
.foot{ width: 100%; height: 40px; clear: both; margin: 60px auto 0 auto;}
.foot p{ width: 1200px; height: 40px; line-height: 40px; margin: 0 auto; text-align: center; background: #eee; color: #666; font-size: 13px;}
.foot p a{ color: #666;}