/**
 * 
 * @authors Your Name (you@example.org)
 * @date    2024-07-12 14:25:11
 * @version $Id$
 */


/*产品展示*/

.product-box{ width: 1200px; height: auto; background: #ffffff; margin: 0 auto; border-radius: 10px; margin-top: -60px; overflow: hidden; }

.product-box{ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); }

ul.product-list{ margin:50px 0 20px 0; }

ul.product-list li{ float: left; width: 318px; height: 238px; border: 1px solid #dcdcdc; border-radius: 8px; margin-left: 60px; margin-bottom: 30px; position: relative; }

a.product-img{ display: inline-block; width: 318px; height: 238px; border-radius: 8px; overflow: hidden; }

ul.product-list li:hover{ border: 1px solid #a3a3a3; }

a.product-word{ display: inline-block; width: 318px; height: 37px; background: rgba(0,0,0,.4); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#66000000,endColorstr=#66000000); border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; font-size: 18px; line-height: 37px; color: #fff; text-align: center; position: absolute; left: 0; bottom: 0; }

a.product-word:hover{ background: rgba(0,0,0,.6); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000); }

/*我的相册*/

.album-box{ width: 1120px; height: auto; margin: 0 auto; padding: 0 40px; margin-top: 78px; }

h3.album-title{ font-size: 30px; line-height: 30px; color: #333; text-align: center; }

h3.album-title:before{ content: ''; width: 0; height: 0; display: inline-block; vertical-align: middle; clear: both; width: 61px; height: 29px; background: url(../image/i-61X29-title_l.png) no-repeat; position: relative; top: -2px; margin-right: 10px; }

h3.album-title:after{ content: ''; width: 0; height: 0; display: inline-block; vertical-align: middle; clear: both; width: 61px; height: 29px; background: url(../image/i-61X29-title_r.png) no-repeat; position: relative; top: -2px; margin-left: 10px; }

ul.album-list{ margin-top: 50px; margin-bottom: 30px; }

ul.album-list li{ float: left; display: inline-block; width: 238px; height: 178px; border: 1px solid #dcdcdc; border-radius: 4px; margin-left: 53px; margin-bottom: 30px; }

ul.album-list li:first-child{ margin-left: 0px; }

ul.album-list li:first-child +li +li +li +li{ margin-left: 0px; }

ul.album-list li a{ display: inline-block; width: 238px; height: 178px; border-radius: 4px; overflow: hidden; }

/*新闻动态*/

.news-box{ width: 100%; height: auto; background: #fff; padding: 50px 0 0 0; }

.title-box{ width: 1200px; height: 36px; margin: 0 auto; border-bottom: 3px solid #333; margin-bottom: 20px; }

h4.title-title{ float: left; display: inline-block; width: 120px; height: 36px; background: #333; border-top-left-radius: 4px; border-top-right-radius: 4px; font-size: 20px; line-height: 36px; color: #fff; text-align: center; }

a.titele-more{ float: right; font-size: 14px; line-height: 36px; color: #333; margin-top: 3px; }

a.titele-more:hover{ color: #000; }

ul.neaws-list{ width: 1200px; height: auto; margin: 0 auto; }

ul.neaws-list li{ float: left; width: 240px; height: 318px; border: 1px solid #dcdcdc; border-radius: 8px; padding: 10px; margin-left: 50px; position: relative; cursor: pointer; }

ul.neaws-list li{ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); }

ul.neaws-list li:hover{ border: 1px solid #a3a3a3; }

ul.neaws-list li:first-child{ margin-left: 1px; }

a.news-img{ display: inline-block; width: 240px; height: 180px; border-radius: 4px; overflow: hidden; }

a.news-title{ display: inline-block; width: 240px; height: 44px; font-size: 16px; line-height: 22px; color: #4e4e4e; margin-top: 14px; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }

a.news-title:before{ content: ''; width: 0; height: 0; display: inline-block; vertical-align: middle; clear: both; width: 3px; height: 15px; background: #8a8a8a; margin-top: -3px; margin-right: 5px; }

a.news-title:hover{ color: #000; }

a.news-title:hover:before{ content: ''; width: 0; height: 0; display: inline-block; vertical-align: middle; clear: both; width: 3px; height: 15px; background: #000; }

p.news-word{ display: inline-block; width: 240px; height: 40px; font-size: 12px; line-height: 20px; color: #888; margin-top: 8px; margin-bottom: 8px; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }

b.news-date{ float: left; display: inline-block; font-size: 12px; line-height: 13px; color: #888; position: absolute; left: 10px; bottom: 10px; }

b.news-date:before{ content: ''; width: 0; height: 0; display: inline-block; vertical-align: middle; clear: both; width: 13px; height: 13px; background: url(../image/i-13X13-date.png) no-repeat; margin-top: -2px; margin-right: 3px; }

ul.neaws-list li:hover > b.news-date{ color: #373737; }

ul.neaws-list li:hover > b.news-date:before{ content: ''; width: 0; height: 0; display: inline-block; vertical-align: middle; clear: both; width: 13px; height: 13px; background: url(../image/i-13X13-dates.png) no-repeat; }

a.news-more{ float: right; display: inline-block; width: 13px; height: 13px; background: url(../image/i-13X13-more.png) no-repeat; position: absolute; right: 10px; bottom: 10px; }

ul.neaws-list li:hover > a.news-more{ background: url(../image/i-13X13-mores.png) no-repeat; }

/*优惠促销*/

.promotion-box{ width: 100%; height: auto; background: #fff; padding: 50px 0 0 0; }

ul.promotion-list{ width: 1200px; height: 320px; margin: 0 auto; position: relative; }

ul.promotion-list li{ width: 268px; height: 150px; background: #fff; border: 1px solid #dcdcdc; border-radius: 8px; position: absolute; left: 0; padding: 20px; cursor: pointer; }

ul.promotion-list li +li{ left: 297px; }

ul.promotion-list li +li +li{ left: 593px; }

ul.promotion-list li +li +li +li{ left: 890px; }

ul.promotion-list li{ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); }

ul.promotion-list li:hover{ border: 1px solid #a3a3a3; z-index: 999; }

a.promotion-title{ display: inline-block; width: 268px; height: 44px; font-size: 16px; line-height: 22px; color: #4e4e4e; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }

a.promotion-title:before{ content: ''; width: 0; height: 0; display: inline-block; vertical-align: middle; clear: both; width: 15px; height: 15px; background: url(../image/i-15X15-title.png) no-repeat; margin-top: -3px; margin-right: 5px; }

a.promotion-title:hover{ color: #000; }

a.promotion-title:hover:before{ content: ''; width: 0; height: 0; display: inline-block; vertical-align: middle; clear: both; width: 15px; height: 15px;background: url(../image/i-15X15-titles.png) no-repeat; }

b.promotion-date{ display: inline-block; font-size: 12px; line-height: 13px; color: #666; margin: 10px 0 8px 0; }

b.promotion-date:before{ content: ''; width: 0; height: 0; display: inline-block; vertical-align: middle; clear: both; width: 13px; height: 13px; background: url(../image/i-13X13-time.png) no-repeat; margin-top: -3px; margin-right: 3px; }

ul.promotion-list li:hover > b.promotion-date{ color: #373737; }

ul.promotion-list li:hover > b.promotion-date:before{ content: ''; width: 0; height: 0; display: inline-block; vertical-align: middle; clear: both; width: 13px; height: 13px; background: url(../image/i-13X13-times.png) no-repeat; }

a.promotion-word{ display: inline-block; width: 268px; height: 40px; font-size: 12px; line-height: 20px; color: #888; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }

a.promotion-word:hover{ color: #000; }

a.promotion-more{ display: inline-block; font-size: 12px; line-height: 13px; color: #666; margin-top: 12px; }

a.promotion-more:after{ content: ''; width: 0; height: 0; display: inline-block; vertical-align: middle; clear: both; width: 13px; height: 13px; background: url(../image/i-13X13-more.png) no-repeat; margin-top: -3px; margin-left: 3px; }

ul.promotion-list li:hover > a.promotion-more{ color: #373737; }

ul.promotion-list li:hover a.promotion-more:after{ content: ''; width: 0; height: 0; display: inline-block; vertical-align: middle; clear: both; width: 13px; height: 13px; background: url(../image/i-13X13-mores.png) no-repeat; }