@charset "utf-8";
@media screen and (max-width:399px){
  html{
   font-size:16px;
  }
}
@media screen and (min-width:400px) and (max-width:1279px){
  html{
   font-size:18px;
  }
}
@media screen and (min-width:1300px){
  html{
   font-size:20px;
  }
}
body,html{margin:0; padding:0;width:100%;font-family: "Microsoft Yahei","Helvetica Neue", Helmet, Freesans, sans-serif; background:#f3ecdc; line-height:1.5em; overflow-x:hidden}
img{border:0; max-width:100%; height:auto; display:block}
ul,li,h1,h2,h3{
	margin: 0;
	padding: 0;
	list-style: none;
}
a{text-decoration:none; color:#5e070c;-webkit-transition:all .6s cubic-bezier(0, 0, .25, 1); transition:all .6s cubic-bezier(0, 0, .25, 1);}
a:hover{color:#e4312a}


@font-face {
  font-family: 'iconfont';
  src: url('http://at.alicdn.com/t/font_1464271531_8433442.eot'); /* IE9*/
  src: url('http://at.alicdn.com/t/font_1464271531_8433442.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('http://at.alicdn.com/t/font_1464271531_8433442.woff') format('woff'), /* chrome、firefox */
  url('http://at.alicdn.com/t/font_1464271531_8433442.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url('http://at.alicdn.com/t/font_1464271531_8433442.svg#iconfont') format('svg'); /* iOS 4.1- */
}
                                      
[data-icon]:before{content:attr(data-icon); display:inline-block; font-family:"iconfont" !important; font-size:100%; font-style:normal; -webkit-font-smoothing:antialiased; -webkit-text-stroke-width:.2px; -moz-osx-font-smoothing:grayscale; margin-right:.25rem}

.header{width:100%; min-width:960px; position:relative; height:45vw; min-height:450px; background:#fff}
.header.detail{min-height:0; height:2vw}
.header_img{position:absolute; left:0; top:0; z-index:1; max-width:100%; height:auto}
.top_nav{width:70%; position:relative; z-index:10; margin:0 auto; padding-top:1.5rem; line-height:2rem; height:2rem; min-width:960px}
.top_nav a{display:inline-block; vertical-align:middle; margin-right:2em; font-size:100%}
.top_nav .logo{float:left; width:6.125em; height:auto}
.top_nav .nav_icon{display:none}
.top_nav a.top_contact{
	position: absolute;
	z-index: 10;
	right: 0;
	top: 1.5rem;
	font-size: 150%;
	color: #000000;
	font-weight: bold;
	margin-right: 0
}
.top_nav a.close{display:none;}
.top_contact:before{font-size:100%; line-height:1.5em; width:1.5em; height:1.5em; border-radius:.25rem; background: none; color:#5E070C; text-align:center; vertical-align:middle; margin-right:.5rem}
.top_nav .select_list{
	position: absolute;
	top: -1px;
	right: -26px;
	width: 80%;
	text-align: right;
	font-size: 14px;
	line-height: 1.5em
}
.top_nav .select_list a{margin-right:0; margin-left:.5em; border-radius:.25em;padding:0 .25em}
.top_nav .select_list a.on{background:#5E070C; color:#fff; }
.slogen{position:relative; z-index:10; margin:14vw auto; display:block; width:100%; text-align:center}
.slogen h2{color:#5E070C; font-size:300%; line-height:1.2em; margin:0; padding:0}
.slogen span{display:block; background:#5E070C; color:#fff; font-size:100%; line-height:1.5em; height:1.5em; width:26em; padding:0 .5em; margin:0 auto;text-align:justify;text-justify:distribute-all-lines; text-align-last:justify;-moz-text-align-last:justify;-webkit-text-align-last:justify}

.container{width:70%; position:relative; margin:0 auto; min-width:960px; height:100%; overflow:hidden}
.container h2{text-align:center; color:#5E070C; font-size:180%; font-weight:normal; line-height:1.2em; padding-top:1em}
.container h2:after{content:""; display:block; margin:.4em auto 0.5em auto; width:2em; height:0; border-bottom:2px solid #cd3029; clear:both}
.container h2.single:after{display:none}
.container p{font-size:75%; padding:0 .5em;}
.container.about{padding-bottom:1em}
.container.about p{color:#a05947; text-indent:2em; text-align:justify;display:block; margin:0 auto; max-width:960px; width:80%}
.container.about .more{display:block; clear:both; margin:1em auto; border-radius:2em; height:1.8em; line-height:1.8em; padding:0 .5em; color:#fff; background:#d29680; font-size:.75em; width:6.8em; text-align:center}
.container.about .more:hover{background:#CD3029}

.container.brand{background:#693029; padding:1em 0; max-width:100%; width:100%}
.container.brand img{display:block; width:100%}
.container.brand .row{display:table; width:70%; min-width:960px; margin:0 auto; vertical-align:middle}
.container.brand .row .box{display:table-cell; width:25%; background:#fff; vertical-align:middle; text-align:center}
.container.brand .row .box.w{width:50%;}
.container.brand h2{color:#a05947;margin:0 auto 1em auto; padding:0;font-size:150%}
.container.brand p{color:#a05947; line-height:1.5em; display:inline-block; width:auto; padding:0 1em; text-align:left}

.container.product{padding-bottom:2em}
.product_list{text-align:center; width:100%}
.product_list .item{display:inline-block; width:32%;  margin:.5em 0; line-height:2em}
.product_list .item a{display:block;background:#fff; margin:0 12.5%; position:relative; text-align:left}
.product_list .item a:hover{box-shadow:0 0 .5em rgba(0,0,0,.25)}
.product_list .item .pr_s,.article .product_list .item .pr_s{display:block; position:absolute; z-index:2; width:4em; height:4em; max-width:4em; border-radius:4em; right:.5em; bottom:3.5em; box-shadow:none}
.product_list .item h3{font-size:90%; line-height:1.2em; padding:1em .5em; font-weight:normal; display:block; position:absolute; bottom:0; left:0; width:100%; background:#fff; box-sizing:border-box}

.footer{background:#52221e; padding:0 0 2em; color:#fff; height:100%; overflow:hidden}
.footer .bottom_logo{background:url(../images/logo_white.png) left center no-repeat;display:inline-block; float:left; width:12em; height:9em; padding:3em 0}
.footer .footer_nav{display:inline-block; float:left; width:12%; padding:3em 0 0 1em}
.footer h3{font-weight:normal; font-size:120%; margin-bottom:2em;color:#fff}
.footer a{color:#F3ECDC; font-size:70%; line-height:1.5em}
.footer .footer_r{float:right; display:inline-block; width:14em; padding:0 0 0 1em; margin-top:3em; color:#F3ECDC}
.footer .qrcode{font-size:70%; text-align:center; display:inline-block; width:11em; text-align:center; padding-right:1em; margin-top:5em}
.footer .footer_r.bottom_contact{border-left:1px solid #6c4946; min-height:10em}
.footer img{vertical-align:middle; display:inline-block; max-width:100%}
.footer p{font-size:70%; margin:0; padding:0; line-height:1.5em}
.footer .copyright{width:100%; text-align:left; display:block; clear:both; padding:1em 0; font-size:70%; color:#F3ECDC; line-height:3.5em; border-top:1px solid #6c4946}
.footer .copyright a{float:right}

/*article page*/
.header.inner{height:100%; overflow:hidden; min-height:5em;}
.container.article{display: block;  position: relative;
  margin:0 auto 25px auto; width:80%; max-width:960px}
.container.article .content{padding: 40px 50px;background-color: #FFF;}
.sub_nav{width:100%; height:5em; line-height:5em; font-size:80%}
.sub_nav li{position: relative;  float: left;padding-right: 18px;  color: #666;}
.sub_nav li a:after {content: ">";  position: absolute;
  top: 0;  right: 5px;  color: #999;}
.banner{margin:1em 0 0 0; height:0; width:100%; padding-bottom:20%;}
.banner.about{ background:url(../images/banner02.jpg) center bottom no-repeat; background-size:cover}
.banner.contact{ background:url(../images/banner03.jpg) center bottom no-repeat; background-size:cover}
.banner.product{ background:url(../images/banner04.jpg) center bottom no-repeat; background-size:cover}

.container.article .content h1{color:#52221E; line-height:2em; font-size:125%; font-weight:normal;   margin-bottom:1em; padding-bottom:.5em}
.container.article .content p{font-size:90%; line-height:1.5em; padding:.5em 0; text-indent:2em; text-align:justify; color:#838383}
.container.article .content img{width:70%; display:block; margin:.5em auto; height:auto}
.container.article.product .content img{width:100%; box-shadow:none; margin:0}
.container.article .content p{text-indent:0}
.container.article + .footer .footer_r,.container.article + .footer .bottom_logo,.container.article + .footer .footer_nav{display:none}
.container.product.article h2{margin-bottom:0; padding-bottom:1em}
.container.product.article .product_list{padding-bottom:2em}
.container.product.article .product_list .item a{border:1px solid #e5e5e5; margin:0 8%}

/*产品页样式*/
.content{height:100%; overflow:hidden}
.content .pr_pic{display:inline-block; width:30%; float:left; margin-right:2%}
.container.article .content .pr_pic img{margin-top:0; width:100%}
.content .detail{float:left; display:inline-block; width:65%; padding-left:2%; border-left:1px solid #ddd}
.content .detail .row{display:table; width:100%;border-collapse: collapse;}
.content .detail .row .box{display:table-cell; text-align:center; width:33%; border:1px solid #ddd;border-collapse: collapse; font-size:80%; line-height:1.5em; padding:.5em 0}
.content .detail .row .box.label + .box{width:66%}
.container.article .content .detail p{
	font-size: 80%;
	color: #000000;
}
	
@media screen and (-webkit-min-device-pixel-ratio:0){
      .slogen span:after{
          content:".";
          display: inline-block;
          width:100%;
          overflow:hidden;
          height:0;
      }
}
@media screen and (max-width:959px){
  .header,.container,.top_nav,.container.brand .row {min-width:0; min-height:0}
  .container.brand .row,.container{width:100%}
  .top_nav{width:95%}
  .top_nav a{margin-right:1em; font-size:75%}
  .top_nav .logo{width:8em}
  .top_nav a.top_contact{font-size:110%; line-height:2em}
  .container.brand h2{font-size:120%; margin-bottom:0}
  .container.brand p{margin:0}
  .product_list .item h3{font-size:75%}
  .footer{padding-top:0}
  .footer .footer_nav{width:18%; padding-top:0; padding-bottom:2em}
  .footer .bottom_logo{display:inline-block; width:100%; height:80px; background-size:15% auto; background-position:center; padding-bottom:0}
  .product_list .item .pr_s{width:3em; height:3em; bottom:3em}
  .article .product_list .item{width:48%}
  .container.product.article .product_list .item a{margin:0}
  .footer .footer_r{margin-top:0}
  .footer .footer_r.qrcode{margin-top:1em}
  .footer .copyright{padding-left:1em}
}
@media screen and (max-width:770px){
	.top_nav{padding-top:.2em; line-height:2em; position:fixed; top:0; left:0; z-index:20; width:100%; height:2.5em; background:#fff; box-shadow:0 0 .5em rgba(0,0,0,.25)}
	.top_nav .nav a{display:none; width:100%; line-height:2.5em; height:0em; clear:both; max-height:0em; font-size:100%}
	.top_nav .nav{height:2.5em;-webkit-transition:all .6s cubic-bezier(0, 0, .25, 1); transition:all .6s cubic-bezier(0, 0, .25, 1); background:rgba(255,255,255,0); display:inline-block; width:100%; overflow:hidden;box-shadow:0 0em 0em rgba(0,0,0,0.0)}
	.top_nav .nav .select_list{display:none}
	.top_nav .nav.on{height:12.2em; background:rgba(240,240,240,1.00); box-shadow:0 .25em .25em rgba(0,0,0,0.25)}
	.top_nav .nav.on a{display:block; text-align:center;max-height:2.5em; height:2.5em; border-bottom:1px solid #ccc}
	.top_nav .nav.on .select_list{display:table}
	.top_nav .logo{margin:0 auto .4em auto; display:block; float:none}
	.top_nav .nav_icon {display:inline-block; color:#5E070C; width:2em; height:1.8em; line-height:1.8em; text-align:center; font-size:150%; position:absolute; left:0; top:0; z-index:10; cursor:pointer}
	.top_nav .nav_icon.close:before{content:attr(data-close-icon)}
	.top_nav a.top_contact{width:2.5em; height:2.5em; overflow:hidden; position:absolute; top:0; right:0; line-height:2.5em;}
	.top_contact:before{background:none; color:#5E070C; width:2em; height:2em; text-align:center; margin:0; line-height:2em; font-size:120%; border-radius:0; padding:0}
	.top_nav .select_list{position: relative; top:0; right:0; width:100%; text-align:center; font-size:14px; line-height:2em; display:table}
	.top_nav .nav.on .select_list a{margin-right:0; margin-left:.5em; border-radius:0;padding:0 .25em; display:table-cell; width:25%}
	.top_nav .select_list a.on{background:#5E070C; color:#fff; }

	.slogen{position:absolute; padding-top:2.5em}
	.slogen h2{font-size:180%}
	.slogen span{font-size:75%; width:21em}
	.header_img{padding-top:2em; background:#fff}
	.header{padding-bottom:2em}
	.header.inner{padding-bottom:0; padding-top:1.7em; min-height:1em}
	.banner{padding-bottom:35%}
	.container h2{font-size:125%}
	.container.about p{width:90%; max-height:10em; overflow:hidden; position:relative; text-overflow:ellipsis;display: -webkit-box;-webkit-line-clamp:5;-webkit-box-orient: vertical;}
	.container.brand{padding:2vw 0}
	.container.brand .row{display:block; width:96vw; margin:0 2vw}
	.container.brand .row .box{display:inline-block; float:left; width:48vw; height:48vw}
	.container.brand .row .box.w{width:96vw}
	.container.brand .row:nth-child(2) .box:nth-child(3){float:right}
	.container.brand h2{margin-top:6vw}
	.product_list .item{width:48%}
	.product_list .item a{margin:0; max-height:15em; overflow:hidden}
	.footer .qrcode{width:100%; display:block; padding:0;  padding-bottom:1em}
	.footer .footer_nav{width:20%}
	.footer .bottom_logo{background-size:25% auto}
	.container.article{width:96%}
	.container.article .content{padding:5%}
	.container.article .content img{width:100%}
	.product_list .item h3{position:absolute; bottom:0; left:0; width:100%; z-index:2; background:#fff}
	.content .pr_pic{width:100%; text-align:center; background:#e5e5e5; margin:0}
	.container.article .content .pr_pic img{width:40%; display:inline-block; vertical-align:middle; margin:2%}
	.content .detail{width:100%; border:0; margin:0; padding:0}
	.content .detail .row .box{font-size:70%}

}
@media screen and (max-width:600px){
	.article .product_list .item{width:100%}
	.footer .footer_nav{display:block; width:90%;}
	.footer .footer_r.bottom_contact{width:90%; border:none; padding-left:1em; float:left}
	.footer_nav li{float:left; display:inline-block; width:25%}
	.footer_nav li a{display:block; background:#67332E; margin:0 .5em 0 0; text-align:center; line-height:2.5em}
	.footer h3{margin-bottom:1em}
}
@media screen and (max-width:400px){
	.container.article .sub_nav{display:none}
	.container.article .content{margin-top:.5em}
	.product_list .item{width:96%;}	
	.product_list .item h3{font-size:100%}
	.container.product.article h2{margin-top:0; padding:0}
	.product_list .item .pr_s{width:4em; height:4em; bottom:1em}
	.footer{padding-bottom:0}
	.footer .rz{display:none}
	.footer .copyright{text-align:center; padding:0}
}