﻿@charset "utf-8";
/* CSS Document */
/*
 *******************************
 * 作者 ： 蛋疼猫设计（DTMO）
 * 网址 ： http://www.dtmo.cn
 * 邮箱 ： dtmo@vip.qq.com
 * QQ  ： 3300203131
 * 蛋疼猫设计，专业/专心/专注DTcms高端模板/插件/二次开发
 * ******************************
*/

/* Inner Page */
.banner {
	width: 100%;
	height: 500px;
	background-position: center top;
	background-repeat: no-repeat;
	background-attachment: fixed;
	overflow: hidden;
}
.banner hgroup {
	width: 1180px;
	height: 150px;
	margin: 250px auto 0;
}
.banner hgroup h2 {
	font-size: 38px;
	line-height: 1.5em;
}
.banner hgroup h3 {
	font-size: 20px;
	line-height: 1.5em;
	text-transform: uppercase;
}
.banner-about {
	background-image: url(../img/banner/about.jpg);
}
.banner-product {
	background-image: url(../img/banner/product.jpg);
}
.banner-news {
	background-image: url(../img/banner/news.jpg);
}
.banner-service {
	background-image: url(../img/banner/service.jpg);
}
/* main */
#main {
	width: 100%;
	position: relative;
	z-index: 2;
	overflow: hidden;
    /*background-color: #f9f9f9;*/
}
/* Options */
.options {
	background: #fff url(../img/bg/location.jpg) no-repeat left center;
	height: 50px;
	margin: 10px auto;
}
.options .pull-left {
	line-height: 50px;
	font-size: 14px;
	color: #999;
}
.options .pull-left i {
	margin: 0 7px;
	font-size: 16px;
}
.options .pull-left a {
	color: #999;
}
.options .pull-left a:hover {
	color: #6BC30D;
}
.options .pull-right {
	height: 40px;
	margin-top: 5px;
}
.options .pull-right .button {
	font-size: 14px;    
	font-weight: bold;
	background-color: #fff;
	border-color: #f0f0f0;
}
.options .pull-right .button-dropdown-list {
    font-family: 'Microsoft YaHei';
}
.options .pull-right .button:hover {	
	background-color: #FF8A00;
	border-color: #FF8A00;
	color: #fff;
}
.options .pull-right .button i {
	font-size: 14px;
	font-weight: normal;
	margin-left: 5px;
}
.options .pull-right form{ margin-top:5px;}
/* Product */
.product {
	overflow: hidden;
	margin: 30px auto;
	width: 1180px;
    min-height: 400px;
}
.product li {
	width: 280px;
	height: 390px;
	float: left;
	margin-right: 20px;
	margin-bottom: 20px;
}
.product li:nth-child(4n) {
	margin-right: 0;
}
.product a figure {
	width: 280px;
	height: 280px;
	background: #000;
	overflow: hidden;
}
.product a:hover figure img {
	transform: scale(1.14);
}
.product a article {
	padding: 20px 0;
	width: 280px;	
	height: 110px;
	height: 70px !important;	
	background: none;
	transition: all .3s ease-in-out;
}
.product a:hover article {
	padding: 20px;
	width: 280px;
	width: 240px !important;
}
.product a article h2 {
	font-size: 18px;
	line-height: 2em;
	color: #666;
}
.product a article h3 {
	font-size: 14px;
	line-height: 2em;
	color: #999;
}
.product a article i {
	width: 5px;
	height: 1px;
	background: #e5e5e5;
	display: block;
	transition: all .5s ease-in-out;
}
.product a:hover article h2, .product a:hover article h3 {	
	color: #fff;
}
.product a:hover article i {
	width: 50px;
}
.product a:hover article {
	background: #FF8A00;
}
.product-show {
	overflow: hidden;
	margin: 30px auto 0;
	width: 1180px;
}
.product-show .pull-right {
    width: 890px;
    overflow: hidden;
}
.product-show .pull-right .main {
    width: 890px;
    overflow: hidden;
    clear: both;
    margin-bottom: 30px;
}
.product-show .pull-right .content {    
    overflow: hidden;
    font-size: 14px;
    color: #666;
    padding: 30px 5px;
}
.product-show .pull-right .headline {
    height: 50px;
    line-height: 50px;
    background: #f9f9f9;
    font-size: 20px;
    color: #666;
    border-left: 5px solid #FF8A00;
    padding-left: 10px;    
}
.product-show hr {
    height: 1px;
    border: none;
    border-top: 1px dashed #ccc;
}
.product-show .pull-right .article {
    width: 490px;
    float: right;
}
.product-show .pull-right .share{
    margin-top: 20px;
    margin-left: 10px;
}
.product-show .pull-right dl {
    width: 490px;
    font-size: 14px;
    line-height: 30px;
    overflow: hidden;
}
.product-show .pull-right dl dt {
    width: 80px;
    text-align: right;
    float: left;
    color: #666;
}
.product-show .pull-right dl dd {
    width: 390px;
    float: right;
    color: #999;
}
.product-show .pull-right h2 {
    font-size: 32px;
    line-height: 1.5em;
    color: #6BC30D;
}
.product-show .pull-right h3 {
    font-size: 14px;
    line-height: 1.5em;
    color: #999;
}
.product-show .pull-right i {
    display: block;    
    height: 1px;
    margin: 10px 0 30px;
    background: #f0f0f0;
}
.product-show .buybtn{margin-top:20px;}
.product-show .buybtn a{color:#fff;margin-left:5px;display:inline-block;background:url(../img/ico.png) no-repeat;padding:0 20px 0 50px;height:40px;line-height:40px;font-size:15px;font-weight:bold;}
.product-show .buybtn .taobao{ background-position:10px 0; background-color:#ff4400;}
.product-show .buybtn .alibaba{ background-position:10px -40px; background-color:#ff6000;}
.product-show .buybtn .buy{ background-position:10px -80px; background-color:#00a0e9;}
.product-show .pull-left {
    width: 250px;
    overflow: hidden;
}
.product-show hgroup {    
    text-transform: uppercase;
    position: relative;
}
.product-show hgroup h2 {
    margin-top: 10px;
    font-size: 24px;
    line-height: 1.2em;
}
.product-show hgroup h3 {
    font-size: 20px;
    margin-top: 5px;
    color: #ddd;
    font-family: "DINCondensedW01-Normal",arial;
}
.product-show hgroup h4 {
    width: 80px;
    height: 5px;
    background: #f0f0f0;
    position: absolute;
    bottom: 5px;
    right: 0;
    z-index: 1;
    border-radius: 2px;
}
/* 相关产品 */
.product-show .related {
    width: 890px;
    overflow: hidden;
    clear: both;
}
.product-show .related li {
    width: 190px;
    float: left;
    margin-right: 30px;
    margin-top: 30px;
}
.product-show .related li:nth-child(4) {
    margin-right: 0;
}
.product-show .related figure {    
    width: 198px;
    height: 198px;    
    border: 1px solid #e5e5e5;
    background: #000;
    position: relative;
}
.product-show .related figcaption {
    width: 198px;
    height: 40px; 
    font-size: 14px;
    line-height: 40px;
    color: transparent;
    text-align: center;
    transition: all .5s ease-in-out;
    position: absolute;
    z-index: 1;
    left: 0;
    bottom: -40px;
}
.product-show .related a:hover figcaption {    
    color: #fff;
    text-align: center;
    bottom: 0;
}
/* 上下页按钮 */
#main .control {
	padding: 40px 0;
	height: 50px;
	text-align: center;
}
#main a.btn-list {
	width: 80px;
	height: 50px;
	border-radius: 3px;
	display: inline-block;
	margin: 0 5px;
	background: #343434 url(../img/btn-list.png) no-repeat center 0;
	transition: all 0.3s linear 0s;
}
#main a:hover.btn-list {
	background-position: center -50px;
}
#main a.btn-prev, #main a.btn-next {
	width: 52px;
	height: 50px;
	border-radius: 3px;
	display: inline-block;
	margin: 0 5px;
	background: #343434 url(../img/btn-arrow.png) no-repeat;
	transition: all 0.3s linear 0s;
}
#main .control a:hover {
	background-color: #ff8a00;
}
#main a.btn-next {
	background-position: -52px -50px;
}
#main a:hover.btn-next {	
	background-position: 0 -50px;
}
#main a:hover.btn-prev {
	background-position: -52px 0;
}
/* 图片放大镜样式*/
.jqzoom {
	position: relative;
	display: block;
	margin: 0;
	padding: 0;
	width: 368px;
	height: 368px;
	border: none;
	cursor: crosshair;
}
.jqzoom img {
	width: 368px;
	height: 368px;
}
.zoomdiv {
	position: absolute;
	z-index: 100;
	display: none;
	width: 368px;
	height: 368px;
	background: #fff;
	border: 1px solid #e8e8e8;
	overflow: hidden;
}
.jqZoomPup {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	visibility: hidden;
	max-width: 368px;
	max-height: 368px;
	border: 1px solid #aaa;
	background: #fff;
	opacity: 0.5;
	-moz-opacity: 0.5;
	-khtml-opacity: 0.5;
	filter: alpha(Opacity=50);
	overflow: hidden;
}
/*商品缩略图样式*/
.product-show .picture {
	position: relative;
	float: left;
	width: 370px;
	*z-index: 1;
}
.pic-box {
	float: left;
}
.pic-preview {
	position: relative;
	width: 368px;
	height: 368px;
	border: 1px solid #e8e8e8;
}
.pic-scroll {
	margin-top: 10px;
	width: 370px;
}
.pic-scroll .prev {
	float: left;
	margin-right: 5px;
}
.pic-scroll .next {
	float: right;
}
.pic-scroll .prev,.pic-scroll .next {
	display: block;
	font-family: "宋体";
	text-align: center;
	width: 10px;
	height: 60px;
	line-height: 60px;
	border: 1px solid #e8e8e8;
	background: #f7f7f7;
	cursor: pointer;
	text-decoration: none;
}
.pic-scroll .items {
	position: relative;
	float: left;
	width: 335px;
	height: 62px;
	overflow: hidden;
}
.pic-scroll .items ul {
	position: absolute;
	margin: 0;
	padding: 0;
	width: 999999px;
	height: 100%;
}
.pic-scroll .items ul li {
	float: left;
	margin: 0;
	padding: 0;
	width: 67px;
	text-align: center;
}
.pic-scroll .items ul li img {
	padding: 2px;
	border: 1px solid #e8e8e8;
	width: 56px;
	height: 56px;
}
.pic-scroll .items ul li img:hover {
	padding: 1px;
	border: 2px solid #d70000;
}
/* 光标背景颜色跟随导航 */
.nav-side {
    width: 250px;
    background: #fff;
    padding: 20px 0;
}
.nav-side ul {
	position: relative;
	list-style: none;
	padding: 0px;
}
.nav-side ul li {
	font-size: 14px;
	line-height: 49px;
	border-bottom: 1px solid #f0f0f0;
}
.nav-side ul li a {
	display: block;
	position: relative;
	color: #333;
	padding-left: 50px;
	text-decoration: none;
	z-index: 10;
}
.nav-side ul li.bg {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 250px;
	height: 49px;
	/*border-left:3px solid #a66488;*/
	background: #FF8A00;
	-webkit-transition: all .3s ease-in-out 0s;
	-moz-transition: all .3s ease-in-out 0s;
	-ms-transition: all .3s ease-in-out 0s;
	-o-transition: all .3s ease-in-out 0s;
	transition: all .3s ease-in-out 0s;
}
/* 关于我们 */
#about {
	width: 960px;
	margin: 40px auto;
	overflow: hidden;
	text-align: center;
}
#about hgroup {
    margin: 20px 0 40px;
}
#about hgroup h2 {
	font-size: 30px;
	/*font-weight: bold;*/
	color: #6bc30d;
	line-height: 1.5em;
}
#about hgroup h3 {
	font-size: 20px;
	color: #ccc;
	line-height: 1.5em;
	font-family: "DINCondensedW01-Normal",arial;
	text-transform: uppercase;
}
#about article {
	margin-top: 20px;
	font-size: 14px;
	line-height: 1.8em;
	color: #999;
}
#about article h2 {	
	font-size: 20px;
	line-height: 1.8em;
	color: #666;
	display: inline-block;
}
#map {
	width: 1180px;
	height: 300px;
	margin: 0 auto;
	overflow: hidden;
	clear: both;
    background: #f0f0f0;
}
#contact {
	width: 960px;	
	margin: 50px auto;
	overflow: hidden;
	clear: both;
}
#contact .pull-left {
	width: 550px;
}
#contact .pull-left h2 {
	font-size: 30px;
	font-weight: bold;
	color: #6bc30d;
	line-height: 1.5em;
}
#contact .pull-left h3 {
	font-size: 20px;
	color: #ccc;
	line-height: 1.5em;
	font-family: "DINCondensedW01-Normal",arial;
	text-transform: uppercase;
}
#contact .pull-left h4 {
	width: 60px;
	height: 5px;
	background: #f0f0f0;
	border-radius: 2px;
	margin: 10px 0 20px;
}
#contact .pull-left li {
	padding: 5px;
	font-size: 14px;
	line-height: 1.5em;
	color: #666;	
	cursor: pointer;
}
#contact .pull-left li span {
    transition: all .3s ease-in-out;
}
#contact .pull-left li:hover span {
	margin-left: 10px;
    color: #ff8a00;
}
#contact .pull-left li i {		
	font-size: 14px;
	line-height: 35px;
	width: 35px;
	height: 35px;
	text-align: center;
	color: #bbb;
	background: #fff;
	border: 2px solid #e5e5e5;
	display: inline-block;
	margin-right: 10px;
	border-radius: 50%;
	transition: all .3s ease-in-out;
}
#contact .pull-left li:hover i {
	background: #ff8a00;
	border-color: #ff8a00;
	color: #fff;
}
#contact .pull-right {
	width: 280px;
	height: 350px;
	background: url(../img/bg/contact.jpg) no-repeat;
}
/* News */
.news-list {
	width: 1180px;
	min-height: 400px;
    margin: 30px auto;
	overflow: hidden;
	clear: both;
}
.news-list a {
	width: 1180px;
	height: 160px;
	padding-bottom: 30px;
	display: block;
	margin-bottom: 30px;
	border-bottom: 1px dashed #f0f0f0;
}
.news-list .pull-left {
	width: 220px;
	height: 160px;
	background: #000;
	overflow: hidden;
}
.news-list .pull-center {
	width: 700px;
	overflow: hidden;
	float: left;
	margin-left: 40px;
}
.news-list .pull-center h2 {
	font-size: 18px;
	/*font-weight: bold;*/
	line-height: 50px;
	color: #333;
}
.news-list a:hover .pull-center h2 {	
	color: #6bc30d;
}
.news-list .pull-center p {
	font-size: 14px;
	line-height: 1.6em;
	margin-top: 20px;
	color: #888;
}
.news-list .pull-right {	
	width: 120px;
	position: relative;
}
.news-list .pull-right .date {
	width: 120px;
	margin-top: 5px;
	text-align: right;
	color: #ccc;
	font-family: "segoe UI", "arial, helvetica, sans-serif";
}
.news-list .pull-right .date-mmdd {
	font-size: 36px;
	line-height: 35px;	
}
.news-list .pull-right .date-yyyy {
	font-size: 14px;
	line-height: 1.5em;
	padding-right: 2px;
	transition: all .5s ease-in-out;
}
.news-list a:hover .pull-right .date-yyyy {	
	padding-right: 55px;
}
.news-list .pull-right i {
	display: block;
	position: absolute;
	font-size: 25px;
	width: 40px;
	height: 40px;
	line-height: 40px;
	border: 1px solid #e5e5e5;
	color: #e5e5e5;
	border-radius: 3px;
	text-align: center;
	z-index: 1;
	right: 45px;
	top: 90px;
	text-indent: 2px;
	transition: all .5s ease-in-out;
}
.news-list a:hover .pull-right i {	
	border-color: #ff8a00;
	background: #ff8a00;
	color: #fff;
	right: 0;
}
.news-show {
	width: 960px;
    margin: 40px auto;
    overflow: hidden;
}
.news-show hgroup {
    margin: 20px 0 40px;
    text-align: center;
}
.news-show hgroup h2 {
	font-size: 30px;
	color: #6bc30d;
	line-height: 1.5em;
}
.news-show hgroup h3 {
	font-size: 14px;
	color: #ccc;
	line-height: 1.5em;
	margin-top: 10px;
	text-transform: uppercase;
}
.news-show hgroup h3 i {
	padding: 0 5px;
	display: inline-block;
}
.news-show article {
	margin-top: 20px;
	font-size: 14px;
	line-height: 1.8em;
	color: #999;
}
.news-show article h2 {	
	font-size: 20px;
	line-height: 1.8em;
	color: #666;
	display: inline-block;
}
.down {
	margin-top: 20px;
	min-height: 400px;
	overflow: hidden;
}
.down li {
	font-size: 14px;
	overflow: hidden;
	line-height: 39px;
	border-bottom: 1px dashed #f0f0f0;
	clear: both;
}
.down li a {
	color: #666;
}
.down li a:hover {
	color: #6bc30d;
}
.down li span {
	float: right;
	color: #999;
}
.down li em {
	font-style: normal;
	margin-left: 10px;	
	color: #6bc30d;
}
.introduce {	
	width: 960px;
    margin: 40px auto;
    overflow: hidden;
}
.introduce hgroup {
    margin: 20px 0 40px;
    text-align: center;
}
.introduce hgroup h2 {
	font-size: 30px;
	color: #6bc30d;
	line-height: 1.5em;
}
.introduce hgroup h3 {
	font-size: 20px;
	color: #ccc;
	line-height: 1.5em;
	font-family: "DINCondensedW01-Normal",arial;
	text-transform: uppercase;
}
.introduce article {
	margin-top: 20px;
	font-size: 14px;
	line-height: 1.8em;
	color: #999;
}
.introduce article h2 {	
	font-size: 24px;
	line-height: 1.8em;
	color: #6bc30d;
	margin: 10px 0;
}
.introduce article hr {	
	border: none;
	border-bottom: 1px dashed #e5e5e5;
	margin: 10px 0;
}
ul#menu,ul#menu ul{list-style-type:none;margin:0;padding:20px 0;width:100%;}
ul#menu a{display:block;text-decoration:none;height:49px;line-height:49px;}
ul#menu li{border-bottom: 1px solid #f0f0f0;}
ul#menu li a{background:#fff;color:#333;padding-left:50px;font-size:14px;}
ul#menu li a:hover{background:#f0f0f0;}
ul#menu li.cur>a,ul#menu li.cur>a:hover{background:#ff8a00;color:#fff;}
ul#menu li ul{padding:0;}
ul#menu li ul li a{background:#fff url(../img/sub.png) no-repeat 45px center;color:#000;padding-left:70px;}
ul#menu li ul li{border-top:1px solid #f0f0f0;border-bottom:none;}

ul#menu li ul li a:hover,ul#menu li ul .current a{background:#f0f0f0 url(../img/sub.png) no-repeat 45px center;}

.code{border:1px solid #ccc;list-style-type:decimal-leading-zero;padding:5px;margin:0;}
.code code{display:block;padding:3px;margin-bottom:0;}
.code li{background:#ddd;border:1px solid #ccc;margin:0 0 2px 2.2em;}
.indent1{padding-left:1em;}
.indent2{padding-left:2em;}

#photo{width:890px;overflow:hidden;}
#photo ul{width:920px;overflow:hidden;margin:0 -25px;}
#photo ul li{ width:280px; float:left; overflow:hidden;margin:0 0 0 25px;}
#photo ul li h2{font-size:15px; line-height:50px; text-align:center;color:#333;}
#photo ul li figure{ display:block; width:280px; height:280px; overflow:hidden;}

.gallery:after {
    content: '';
    display: block;
    /*height: 2px;
    margin: .5em 0 1.4em;*/
    background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(77,77,77,1) 50%, rgba(0, 0, 0, 0) 100%);
    background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(77,77,77,1) 50%, rgba(0, 0, 0, 0) 100%);
}

.gallery img {
    height: 100%;
}



.baguetteBoxOne {
	
	margin:0 auto;
}

/* Highlight.js Tomorrow Night style */
.hljs-comment{color:#969896}.hljs-tag{color:#f8f8f2}.css .hljs-class,.css .hljs-id,.css .hljs-pseudo,.hljs-attribute,.hljs-regexp,.hljs-title,.hljs-variable,.html .hljs-doctype,.ruby .hljs-constant,.xml .hljs-doctype,.xml .hljs-pi,.xml .hljs-tag .hljs-title{color:#c66}.hljs-built_in,.hljs-constant,.hljs-literal,.hljs-number,.hljs-params,.hljs-pragma,.hljs-preprocessor{color:#de935f}.css .hljs-rules .hljs-attribute,.ruby .hljs-class .hljs-title{color:#f0c674}.hljs-header,.hljs-inheritance,.hljs-string,.hljs-value,.ruby .hljs-symbol,.xml .hljs-cdata{color:#b5bd68}.css .hljs-hexcolor{color:#8abeb7}.coffeescript .hljs-title,.hljs-function,.javascript .hljs-title,.perl .hljs-sub,.python .hljs-decorator,.python .hljs-title,.ruby .hljs-function .hljs-title,.ruby .hljs-title .hljs-keyword{color:#81a2be}.hljs-keyword,.javascript .hljs-function{color:#b294bb}.hljs{display:block;overflow-x:auto;background:#35383C;color:#c5c8c6;padding:.8em}.coffeescript .javascript,.javascript .xml,.tex .hljs-formula,.xml .css,.xml .hljs-cdata,.xml .javascript,.xml .vbscript{opacity:.5}
#baguetteBox-overlay .full-image figcaption{display:none;}

.baguetteBox-button#close-button {
    top: 2 px;
    right: 2%;
    right: calc(2% + 6px);
    width: 40px;
    height: 40px;
}
.baguetteBox-button{border-radius: 0;}
.baguetteBox-button#close-button svg {
    position: absolute;
    left: 5px;
    top: 5px;
}

#category_id{ padding:7px;float:left;border:1px solid #ddd; outline:none;}
#q{margin:0;float:left; border:1px solid #ddd;padding:0 5px;height:30px;line-height:30px;margin-left:-1px;outline:none;}
#submit{margin:0;float:left; padding:0 20px; border:1px solid #ddd;height:32px;line-height:32px;margin-left:-1px;outline:none;cursor:pointer;}

