/* css clear */
header, footer, section, aside, article, nav, dialog, figure {display: block;}/* reset */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, figure, section, legend, textarea, p, blockquote, th, td, input, select, textarea, button {margin: 0;padding: 0}
fieldset, img {border: 0 none}
dl, ul, ol, menu, li {list-style: none}
h1, h2, h3, h4, h5, h6 {font-size: 100%;font-weight: normal;}
button {border: 0 none;background-color: transparent;cursor: pointer}
body {font-family: "Microsoft YaHei", Arial, Helvetica, sans-serif; overflow:auto; overflow-x:hidden; font-size: 15px; background:#fff; line-height:1.5em; color:#333;}
a {color: #333;text-decoration: none;}
a:active, a:hover {text-decoration: none}
address, caption, cite, code, dfn, em, var, i {font-style: normal;font-weight: normal}
img {border: 0;max-width: 100%;}
:focus {outline:none}
input, textarea {-webkit-appearance: none;-webkit-border-radius:0;border:0;font-size: 14px;}
textarea::-webkit-input-placeholder {color:#aaa;}
textarea:focus::-webkit-input-placeholder {color:#eee;}
a, button, input {-webkit-tap-highlight-color: rgba(255, 0, 0, 0);}
.clear,.clear20,.clear30,.clear40,.clear50{clear: both;width:100%;overflow:hidden;font-size:1px;height:10px;padding:0;margin:0;float:none; visibility: hidden;}
.clear20{height: 20px;}
.clear30{height: 30px;}
.clear40{height: 40px;}
.clear50{height: 50px;}
.text-color-red{color: #ad3c3a;}
.text-color-blue{color: #1E9FFF;}
.text-color-green{color: #5FB878;}
.text-color-gary {color: #c2c2c2;}
.text-color-orange {color: #F7B824!important;}

/* public */
.empyt-notice{width: 90%; box-sizing: border-box; border: 1px solid #DE342F; color: #DE342F; padding:20px; text-align: center; border-radius: 6px; font-size: 22px;}

.fixed-menu{width: 60px; overflow: hidden; position: fixed; right: 10px; bottom: 50px; z-index: 999;}
.fixed-menu a{display: block; width: 60px; height: 45px; padding-top: 15px; text-align: center; background: rgba(0,0,0,.4); margin-bottom: 8px; border-radius: 60px;}
.fixed-menu a img{width: 30px; height: 30px;}

.header-wrap{width: 100%; background: #fff; height: 90px; line-height: 90px;}
.header{width: 1200px; height: 90px; margin: 0 auto;}
.header .logo{width: 260px; height: 90px; overflow: hidden; float: left;}
.header .logo img{ float: left; margin-top: 16px;}
.header .nav{width: 600px; height: 90px; float: right; text-align: right;}
.header .nav ul{ float: right;}
.header .nav li{width:100px; height: 90px; float: left;}
.header .nav a{display: inline-block; width: 100%; text-align: center;}
.header .nav a:hover,
.header .nav a.active{color: #DE342F; position: relative;}
.header .nav a:hover::after,
.header .nav a.active::after{background: #DE342F; display: block; content: ''; width: 40%; height: 2px; position: absolute; bottom: 20px; left: 20px;}

.footer{width: 100%; padding: 30px 0; text-align: center; overflow: hidden; background: #EDEDED; color: #999; line-height: 1.8em; font-size: 14px;}
.footer a{margin-right: 10px; color: #999;}
.footer a:hover{color: #DE342F;}

.container-wrap{width: 100%; overflow: hidden;}
.container{width: 1200px; overflow: hidden; margin: 0 auto;}
.container-seat{width: 100%; height: 50px; overflow: hidden; clear: both;}
.container-title{width: 100%; padding: 50px 0; text-align: center; font-size: 26px; color: #DE342F;}
.container .left{width: 230px; overflow: hidden; float: left;}
.container .left .menu{width: 100%; overflow: hidden;}
.container .left .menu li{width: 100%; height: 46px; background: #f5f5f5; margin-bottom: 5px;}
.container .left .menu li a{display: block; width: 100%; height: 46px; line-height: 46px; text-align: center;}
.container .left .menu li a.active,
.container .left .menu li a:hover{background: #DE342F; color: #fff;}
.container .right{width: 920px; overflow: hidden; float: right;}

.footer-search{width: 100%; height: 320px; background: url("../images/footer-bg.jpg") no-repeat center; background-size: 1920px 320px; text-align: center;}
.footer-search .title{font-size:38px; color: #fff; padding: 95px 0 50px 0; overflow: hidden; width: 100%;}
.footer-search .form{width: 550px; height: 56px; margin: 0 auto;}
.footer-search .form form{width: 550px; height: 56px; background: #fff; border-radius: 8px;}
.footer-search .form input{width: 470px; height: 56px; background: none; padding: 0 10px; float: left;}
.footer-search .form button{width: 60px; height: 56px; background: url("../images/search.jpg") no-repeat center; border-radius: 8px; float: right;}

.header-title{width:100%; height:100px; padding-top:44px; line-height:1.8em; background:url('../images/about-bg.jpg') no-repeat center; overflow:hidden;}
.header-title span, .header-title strong{display:block; font-size:22px; width:100%; text-align:center; color:#fff;}
.header-title span{font-size:18px;}

.breadcrumb-wrap{width: 100%; background:#F9F9F9;}
.breadcrumb{width: 1200px; height: 50px; line-height: 50px; margin: 0 auto; color: #999;}
.breadcrumb a{color: #999;}
.breadcrumb a:hover{color: #DE342F;}

.prev-next{width: 100%; overflow: hidden; line-height: 2.2em; padding-top: 30px;}
.prev-next a{color: #DE342F;}
.prev-next a:hover{border-bottom: 1px solid #DE342F;}

.pagination-box{background: #fff; overflow: hidden;}
.pagination{width: 100%; padding: 10px 0; clear: both;  white-space: nowrap;  text-align: center; overflow: hidden;  box-sizing: border-box;}
.pagination li{display: inline-block;}.pagination a{display: inline-block; height: 26px; line-height: 20px; border:1px solid #DE342F; padding: 3px 12px; box-sizing: border-box; background: #fff; margin: 0 2px;}.pagination li.active a{border:1px solid #DE342F; background: #DE342F; color: #fff; box-sizing: border-box;}
.pagination span{ display: inline-block; height: 26px; line-height: 20px;padding: 3px 10px; border:1px solid #DE342F; background: #DE342F; color: #fff; margin: 0 2px;  box-sizing: border-box;}

.title-wrap{width: 100%; padding: 10px 0; text-align: center; overflow: hidden;}
.title-wrap strong{display: inline-block; font-size: 22px; color: #000; padding: 0; clear: both;}
.title-wrap strong:after,.title-wrap strong:before{display:inline-block;height:1px;background-color:#999; padding:0;content:"";width:40px;margin:10px 20px}
.title-wrap span{display: block; font-size: 14px; line-height: 150%; color: #777; margin: 10px 0 0 0; padding-bottom: 40px; }

/* index */
.banner{width: 100%; overflow: hidden;}
.banner img{width: 100%; max-width: 100%; float: left;}
#MW-PREVIEW .swiper-pagination-bullet-active{background: #DE342F!important;}
#MW-PREVIEW .swiper-container-horizontal>.swiper-pagination-bullets, #MW-PREVIEW  .swiper-pagination-custom, #MW-PREVIEW  .swiper-pagination-fraction{bottom:0!important;}

.index-product-wrap{width: 100%; padding:20px 0 50px 0; overflow: hidden;}
.index-product-wrap ul{width: 100%;}
.index-product-wrap li{width: 33.3333333%; position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px; box-sizing: border-box; overflow: hidden; float: left;}
.index-product-wrap .item{position:relative; width: 100%; overflow: hidden;}
.index-product-wrap .item a{position: relative; display: block; overflow: hidden;}
.index-product-wrap .item img{transform:scale(1,1);-ms-transform:scale(1,1);-webkit-transform:scale(1,1);-moz-transform:scale(1,1);-o-transform:scale(1,1);-webkit-transition:all .2s linear;-moz-transition:all .2s linear;-o-transition:all .2s linear;transition:all .2s linear; width:100%; height: 258px;}
.index-product-wrap .item:hover img{transform:scale(1.1,1.1);-ms-transform:scale(1.1,1.1);-webkit-transform:scale(1.1,1.1);-moz-transform:scale(1.1,1.1);-o-transform:scale(1.1,1.1);}
.index-product-wrap .item .pic-hover{background-color:transparent; text-align: center; box-sizing: border-box; position:absolute;z-index:1;top:0;left:0;width:100%; height:100%;  -webkit-transition:.25s;transition:.25s; padding:52px 30px; overflow: hidden; display: block;}
.index-product-wrap .item:hover .pic-hover{background-color:rgba(0,0,0,.75)}
.index-product-wrap .item .pic-hover h3{font-size:18px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;position:relative;padding:0 0 5px 0;margin:0;color:#fff}
.index-product-wrap .item .pic-hover h3 a{color:#fff;}
.index-product-wrap .item .pic-hover h3{-webkit-transition:.3s;transition:transform .3s}
.index-product-wrap .item .pic-hover .price {display: inline-block; margin: 0; padding: 0; color: #ccc; }
.index-product-wrap .item:hover .pic-hover .price{-webkit-transition-delay:.1s;transition-delay:.1s;-webkit-transition-duration:.25s;transition-duration:.25s}
.index-product-wrap .item .pic-hover span{background-color:#df3741;display:block;height:3px;width:60px;margin:15px auto 0 auto}
.index-product-wrap .item:hover .pic-hover span{-webkit-transition-delay:.15s;transition-delay:.15s;-webkit-transition-duration:.25s;transition-duration:.25s}
.index-product-wrap .item .pic-hover h3,.index-product-wrap .item .pic-hover span,.index-product-wrap .item .pic-hover .price{filter:alpha(opacity=0);opacity:0}
.index-product-wrap .item .pic-hover h3,.index-product-wrap .item .pic-hover span,.index-product-wrap .item .pic-hover .price{-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}
.index-product-wrap .item:hover .pic-hover h3,.index-product-wrap .item:hover .pic-hover span,.index-product-wrap .item:hover .pic-hover .price{filter:alpha(opacity=100);opacity:1}
.index-product-wrap .item:hover .pic-hover h3,.index-product-wrap .item:hover .pic-hover span,.index-product-wrap .item:hover .pic-hover .price{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}

.about-wrap{width: 100%; padding: 40px 0; overflow: hidden; background: #F9F9F9;}
.about-wrap .pic{width: 520px; float: left; overflow: hidden;}
.about-wrap .pic img{width: 400px; height: auto; display: block; overflow: hidden;}
.about-wrap .detail{width: 660px; float: right; overflow: hidden; color: #999; line-height: 1.8em;}
.about-wrap .detail p{margin-bottom: 20px;}
.about-wrap .more{width: 100%; overflow: hidden; clear: both;}
.about-wrap .more a{display: inline-block; padding: 5px 20px; color: #fff; background: #DE342F; border: 1px solid #DE342F; float: right;}
.about-wrap .more a:hover{background: #fff; border: 1px solid #DE342F; color: #DE342F;}

.index-news-wrap{width: 100%; overflow: hidden; background: #F9F9F9; padding: 50px 0;}
.index-news-wrap .index-news-left{width: 590px; height: 400px; position: relative; float: left;}
.index-news-wrap .index-news-left a{}
.index-news-wrap .index-news-left img{width: 590px; height: 400px; float: left;}
.index-news-wrap .index-news-left p.bg{width: 96%; padding: 0 2%; height: 40px; line-height: 40px; position: absolute; bottom: 0; left: 0; background: #0C0C0C; opacity: 0.5; z-index: 1;}
.index-news-wrap .index-news-left p{width: 96%; padding: 0 2%; height: 40px; line-height: 40px; position: absolute; bottom: 0; left: 0; z-index: 2; color: #fff;}
.index-news-wrap .index-news-right{width: 570px; overflow: hidden; float: right;}
.index-news-wrap .index-news-right li{width: 100%; height: 89px; padding:10px 0; border-bottom: 1px solid #d2d2d2;}
.index-news-wrap .index-news-right li.first-child{padding-top: 0;}
.index-news-wrap .index-news-right li.last-child{border-bottom:none!important;}
.index-news-wrap .index-news-right li a:hover strong{color: #DE342F;}
.index-news-wrap .index-news-right li p{color: #999; padding-top: 10px;}
.index-news-wrap .more{width: 100%; text-align: center; overflow: hidden; padding-top: 30px;}
.index-news-wrap .more a{display: inline-block; padding: 5px 20px; color: #fff; background: #DE342F; border: 1px solid #DE342F;}
.index-news-wrap .more a:hover{background: #fff; border: 1px solid #DE342F; color: #DE342F;}

/* about */
.detail-title{ font-size: 28px; padding: 30px 0 20px 0; overflow: hidden;}
.detail-content{color: #999; padding: 50px 0; line-height: 1.8em;}
.detail-content p{margin-bottom: 30px;}

/* contact */
.contact-wrap{width: 100%;  padding:0 0 50px 0; overflow: hidden;}
.contact-left{width: 570px; overflow: hidden; float: left;}
.contact-left form{}
.contact-left form .text{width: 100%; padding-bottom: 10px; overflow: hidden;}
.contact-left form .text span{color: red;}
.contact-left form .input{width: 100%; padding-bottom: 10px; overflow: hidden;}
.contact-left form .input input{border: 1px solid #d2d2d2; height: 40px; width: 98%;}
.contact-left form .input textarea{border: 1px solid #d2d2d2; height: 120px; width: 98%;}
.contact-left form .button{}
.contact-left form .button button{width: 98%; height: 40px; line-height: 40px; color: #fff; background: #DE342F; border: 1px solid #DE342F; font-size: 16px;}
.contact-right{width: 570px; height: 360px; padding: 9px 0; overflow: hidden; float: right; background: #dedede;}
.contact-right .item{width: 80%; padding: 10px 10%; overflow: hidden;}
.contact-right .qrcode{width: 90%; float: right; height: 130px; padding-top: 10px;}
.contact-right .qrcode li{width: 100px; height: 130px; margin-right: 20px; float: left;}
.contact-right .qrcode li img{width: 100px; height: 100px; overflow: hidden; float: left;}
.contact-right .qrcode li span{display: block; width: 100%; height: 30px; line-height: 30px; text-align: center;}

/* product */
.product-list{width: 100%; overflow: hidden;}
.product-list li{width: 290px; height: 370px; overflow: hidden; float: left; margin-left: 16px;}
.product-list li.mod3{float: right; margin-left: 0;}
.product-list li .image{width: 290px; height: 290px;}
.product-list li .image img{width: 290px; height: 290px; display: block;}
.product-list li .name{width: 290px; padding:10px 0 2px 0; text-align: center; overflow: hidden; white-space:nowrap; text-overflow:ellipsis;}
.product-list li .name i{color: #DE342F;}
.product-list li .price{width: 290px; text-align: center;}
.product-list li .price span{font-size: 16px; font-weight: bold;}
.product-list li a:hover .name{color: #DE342F;}

/* goods */
.goods-base{width: 100%; overflow: hidden;}
.goods-base .image{width: 100%; height: 440px; overflow: hidden; float: left;}
.goods-base .image img{height: 440px;}
.goods-base .base{width: 100%; overflow: hidden; float: right;}
.goods-base .base h1{font-size: 24px; font-weight: bold; line-height: 1.4em; width: 100%; padding:10px 0; margin-bottom: 20px; border-bottom: 1px dotted #d2d2d2;}
.goods-base .base .item{width: 100%; padding: 5px 0; overflow: hidden;}
.goods-base .base .item span{display: inline-block; background: #DE342F; color: #fff; border-radius: 8px; padding: 1px 8px; font-size: 13px;}

.goods-detail{width: 100%; padding:10px 0 20px 0; overflow: hidden;}
.goods-detail p{margin-bottom: 30px; line-height: 1.8em;}
.goods-detail p:last-child{margin-bottom:0;}
.goods-detail a{border-bottom: 1px dotted #d2d2d2; color: #999;}
.goods-detail a:hover{color: #DE342F; border-bottom: 1px solid #DE342F;}

/* news */
.news-list{width: 100%; overflow: hidden; float: right;}
.news-list li{width: 100%; padding: 10px 0; overflow: hidden; border-bottom: 1px dotted #d2d2d2; font-size: 14px;}
.news-list li.last-child{border-bottom: none;}
.news-list li .name{font-weight: bold; font-size: 16px; padding-bottom: 10px;}
.news-list li .time{ color: #999;}
.news-list li .description{ color: #999;}

.news-detail{width: 100%; overflow: hidden;}
.news-detail h1{font-size: 28px; text-align: center; line-height: 1.8em;}
.news-detail .base{ padding: 20px 0 10px 0; overflow: hidden; text-align: center; color: #999;}
.news-detail .description{margin-top: 10px; background: #f5f5f5; border: 1px solid #d2d2d2; padding: 10px; color: #999;}
.news-detail .content{ padding-top: 30px; overflow: hidden;}
.news-detail .content p{line-height: 1.8em; margin-bottom: 30px;}
.news-detail .content p:last-child{margin-bottom:0;}
.news-detail .content a{border-bottom: 1px dotted #d2d2d2; color: #999;}
.news-detail .content a:hover{color: #DE342F; border-bottom: 1px solid #DE342F;}