﻿
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {margin: 0;padding: 0;border: 0;outline: 0;font-weight: inherit;font-style: inherit;font-size: 100%;font-family: inherit;vertical-align: baseline;}
/* remember to define focus styles! */
:focus{outline: 0;}
body{line-height: 1;color: black;}
ol, ul{list-style: none;}
/**  产品中心导航颜色   **/
h6 a{color:#000000;}
.pp a{ font-size:14px;color:#5c5b5e;}

/** 电话样式  ***/
.tel{position:relative;top:13px;}

/* tables still need 'cellspacing="0"' in the markup*/
table{border-collapse: separate;border-spacing: 0;}
caption, th, td{text-align: left;font-weight: normal;}
blockquote:before, blockquote:after,
q:before, q:after{content: "";}
blockquote, q{quotes: "" "";}
/* self-clear floats - if you need them, this is my (current) favourite technique. More info: http://nicolasgallagher.com/micro-clearfix-hack/*//* For modern browsers*/
.cf:before,.cf:after{content:"";display:table;}
.cf:after{clear:both;}
/* For IE 6/7 (trigger hasLayout)*/.cf{zoom:1;}
/* wrap url's*/pre{white-space: pre;/* CSS 2.0*/white-space: pre-wrap;/* CSS 2.1*/white-space: pre-line;/* CSS 3.0*/white-space: -pre-wrap;/* Opera 4-6*/white-space: -o-pre-wrap;/* Opera 7*/white-space: -moz-pre-wrap;/* Mozilla*/white-space: -hp-pre-wrap;/* HP Printers*/word-wrap: break-word;/* IE 5+*/}

.pimpingBook{max-width: 25%;transform: rotate(3deg);box-shadow: 3px 3px 6px #000;margin: 30px 40px 0px 0px;float: left;}
/* This rule just sets a different selection color when you highlight text*/::selection{background: #ff9900;}
/* in the book I talked about CSS patterns - this body style adds the feint grid to the body of all pages in supporting browsers*/
body{background-color:#fff;}
/* Now I want to make any inline video and img elements automatically scale to 100% of their parent container. This can be over-ridden by more specific styles as needed*/
a{color: #666;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;text-decoration:none;}
a:hover{color: #000;}
img,video{max-width: 100%;height: auto;}
#wrapper{margin:0 auto;width:96%;/* Holding outermost DIV*/max-width: 1122px;background-color: hsla(0, 0%, 100%, 0.61);/* you'd use this if you had a colored background on the body, HSLA (and RGBA) allow an alpha channel so you can 'see through' them*/}
.header{margin:0 auto;width:100%;background-color:#fff;padding-bottom:10px}
.header a{text-decoration: none;color:#585858}
.logo{display: block;width:96%;margin:0 auto;padding-top:18px;color: #0d0c0c;text-transform: uppercase;font-family: 'SimSun';font-size: 3em;text-align:center;}
.head{width:96%;max-width:1122px;margin:0 auto;color:#585858;font-size:.875em;text-transform:uppercase;letter-spacing:0.1em;}
.head-meta{padding:23px 0;text-align:center;}
.search_icon{padding-left:30px;background:url(img/top_navbg.png) no-repeat 11px -109px;}
.form-search{width:223px;height:31px;padding-top:2px;margin:0 auto;}
.form-search input{display:block;background:none;color:#838383;font-size:.875em;height:29px;line-height:29px;padding:0;float:left;-webkit-border-radius:1px;-moz-border-radius:1px;border-radius:1px;}
.form-search .search{padding-left:10px;width:180px;border:1px solid #c6c2c2;border-right:none;}
.form-search .go{width:29px;height:31px;line-height:31px;border:1px solid #5c5c5c;background:#aeaeae url(img/top_navbg.png) no-repeat;color:#fff;}
.nav_wrap{width:100%;background: #e7e7e7;margin:25px auto 0;}
/*  nav导航  */
.nav{display:table;margin:0 auto;width:100%;max-width:1122px;}
.nav ul{display: table-row;width: 100%;}
.nav ul li{text-align: center;display: table-cell;margin-left: 1.3%;margin-right: 1.3%;}
.nav ul li a{height: 44px;background:url(img/nav_hbg.png) no-repeat 100% 12px;text-decoration: none;text-transform: uppercase;color: black;font: 1em/44px 'SimSun';display: block;}
.nav ul li.last a{background-image:none}
.nav li a:hover,.nav li.current2 a{color:#fff;background:#f9a936 url(img/nav_bbg.png) no-repeat 100% 12px}
/*  end  */
.mobileMenu {width:100%;margin:0 auto;height:42px;line-height:42px;background-color: #FFF;padding-bottom:10px;position:relative;}
.mobileMenu i{display: inline-block;width:24px;height:24px;font-style: normal;font-weight: normal;line-height: 1;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;position: absolute;right:7%;
top: 11px;background:url(img/menu.png) no-repeat;background-size:80%}
.mobileMenu select{display:block;width:90%;background-color:#fff;padding-left:10px;height:40px;line-height:40px;margin:0 auto;border: 1px solid #aaa;font-size:1em;color:#444;-webkit-appearance: none;-moz-appearance: none;}

.content{width:100%;margin: 0 auto;padding:10px 0 100px}
.content .up{padding:30px 0 20px}
.content .fl{float: left;width:100%;padding-bottom:10px}
.content .tit{border-bottom: 1px solid #d7d7d7;height:30px;line-height:30px;margin-bottom:8px;}
.content .tit h3{font-size:1em;color: #000;float: left;padding-left: 9px;}
.content .tit a{display: block;float: right;font-size:.875em;width:20px;height:20px;line-height:20px;text-align:center;color: #000;background-color:#ccc;text-decoration: none;margin-left:10px}

.content h5{font-size:.875em;padding: 8px 0;font-weight: normal;}
.content p{font-size:.875em;line-height: 200%;color: #444;text-indent:25px;}
.content .news a{display:block;color: #444;padding:6px 0;text-decoration: none;text-align:right}
.content .news img{display: block;width:25%;float: left;}
.content .news .con{width:75%;float:left}
.content .news h5{padding: 2px 6px 4px;height:20px;line-height:20px;color:#000;text-align:left;overflow:hidden;}
.content .news p{height:36px;line-height:18px;color:#585858;padding:0 6px;text-align:left;overflow:hidden;font-size:12px;}
.content .news span{display:block;height:20px;line-height:20px;color:#585858;padding-left:6px;font-size:.75em}
.content .news a:hover{text-decoration: underline;background-color:#ececec;text-shadow: #ccc;}
.content .video{width:100%;padding-right:0;}
.fluid-width-video-wrapper {width: 100%;position: relative;top:-20px;height:315px;}
.fluid-width-video-wrapper video,.fluid-width-video-wrapper iframe, .fluid-width-video-wrapper object, .fluid-width-video-wrapper embed {position: absolute;top: 30px;left: 0;width: 100%;height: 100%;}

.piclist{width:100%;margin: 0 auto;padding-bottom:12px;overflow: hidden;position: relative;}
.piclist li{width:49%;margin-right:2%;float: left;text-align:center;}
.piclist li:nth-child(even){margin-right:0}
.piclist a{display:block;border:1px solid #efefef;text-decoration:none;font-size:1em;color:#595757;position:relative;}
.piclist img{width:75%;}
.piclist li div{padding:10px 20px 20px;}
.piclist li h5{width:85%;height:36px;line-height:18px;padding:8px 0;margin:8px auto;border-bottom: 1px solid #d7d7d7;font-size:1em;color:#000;overflow:hidden;}
.piclist li span{display:block;margin:6px 0;font-size:.8125em;height:40px;line-height:20px;overflow:hidden;}

.pic_bxslider:after{display:block;content:"";clear:both;height:0;overflow:hidden;}
.pic_bxslider a{display:block;border:1px solid #efefef;border-bottom:2px solid #000;text-align:center;text-decoration:none;font-size:1em;color:#595757;position:relative;}
.pic_bxslider img{width:190px;}
.pic_bxslider span{display:block;}
.pic_bxslider h5{width:75%;height:16px;line-height:16px;padding:8px 0;margin:8px auto;border-bottom: 1px solid #d7d7d7;font-size:1em;color:#000;overflow:hidden;border-bottom:none;padding:0}
.pic_bxslider li em{display:block;margin:6px 0;font-size:.8125em;height:36px;line-height:18px;overflow:hidden;}

.footer{margin:0 auto;width:100%;background:#e7e7e7;border-top:3px solid #f9aa38}
.b_nav{width:96%;max-width:1122px;color:#dfdfdf;padding-top:20px;padding-bottom:6px;margin:0 auto;}
.b_nav:before,.b_nav:after{content:" ";display:table}
.b_nav:after{clear:both}
.b_nav dl{float:left;width:96%;padding-bottom:10px;text-align:center;}
.b_nav dt{color:#000;line-height:30px}
.b_nav dd{color:#000;font-size:1em;}
.b_nav dl p,.b_nav dl a{color:#666;text-decoration:none;font-size:.75em;line-height:22px;}
.b_nav dl a:hover{color:#000;text-decoration:underline;}
.copyright{font-size:.75em;padding:11px 0;background-color:#fff;text-align:center;color:#585858}
.copyright p{line-height:20px}

/*关于我们*/
.banner{width:100%;max-width:1920px}
.banner img{width:100%}
.c_nav{display:table;margin:0px auto 60px;width:100%;max-width:880px;}
.c_nav ul{display: table-row;width: 100%;}
.c_nav ul li{text-align: center;display: table-cell;margin-left: 1.3%;margin-right: 1.3%;}
.c_nav ul .m_hide{display:none;}
.c_nav ul li a{height: 30px;background:;text-decoration: none;text-transform: uppercase;color: black;font:.875em/30px 'SimSun';display: block;}
.c_nav li a:hover{color:#fff;background:#2e2e2e}
.c_nav h1 {font:1.5em/50px 'SimSun';display: block;border-bottom:2px solid #000;font-weight:700;}
.current a{color:#fff;background:#e7e7e7;font-weight: bold;}

.c_pics{width:100%;margin:30px auto 0;}
.c_pics li{width:100%;float:left;text-align:center;padding-bottom:10px}
.c_pics span{display:block;color:#2e2e2e;font-size:.875em;height:30px;line-height:30px}

/*产品中心*/
.p_center{width:100%;padding-top:20px}
.p_nav{width:100%;float:left;font-size:1em;background-color:#f8f8f8;text-align:center;margin-bottom:15px;}
.p_nav h3{height:40px;line-height:40px;color:#fff;background-color:#f7a32b;border-bottom: 1px solid #fff; }
/*.p_nav a{display:block;height:36px;line-height:36px;border-bottom:1px solid #dcdcdc;text-decoration:none;}*/
.p_r_con{width:100%;float:left;}
.p_r_con dl{background-color:#f8f8f8;padding:3%;margin-bottom:20px;font-family:Microsoft Yahei;}
.p_r_con dt{color:#2e2e2e;font-size:1.875em;height:48px;line-height:48px;}
.p_r_con li{display:block;float:left;width:100%;padding-bottom:10px;color:#666;}
.p_r_con li span{display:block;line-height:22px;}
.p_r_con .li a{display:inline;float:left;width:95%;padding-left:10px;background:#fff url(img/p_bg.png) no-repeat 93% 15px;border:1px solid #e8e8e8;height:43px;line-height:43px;margin-bottom:15px;font-size:.875em;text-decoration:none;}


*{transition: all 0.5s;}

@media screen and (min-width:768px){
	.logo{float: left;width:358px;margin:0}
	.head a:hover{text-decoration:underline;color:#000}
	.content .tit a:hover{color:#fff;background-color:#000}
	.head .cf{width:420px;float:right;}
	.head-meta{float:right;}
	.form-search{float:right;position:relative;top:-55px;}
	.piclist li{width:23.5%;}
	.piclist li:nth-child(even){margin-right:2%}
	.piclist li.last{margin-right:0}
	.piclist a:hover,.pic_bxslider a:hover{border-color:#000;-webkit-box-shadow:4px 4px 5px #aaa;-moz-box-shadow:4px 4px 5px #aaa;box-shadow:4px 4px 5px #aaa;}
	.content .fl{width:29%;padding-right:2%}
	.content .video{width:38%;padding-right:0}
	.b_nav dl{float:left;width:27.3%;padding-right:3%;text-align:left;}
    .b_nav .about{width:36.3%;}
    .c_nav ul li a{font-size:1em}
    .c_nav ul .m_hide{display:table-cell;}
	.c_pics li{width:49.5%;margin:0 .25%;}
	.c_pics span{text-align:left;}
	
	
}

@media screen and (min-width:768px) and (max-width: 1024px){
	.content .fl{width:49%;}
	.content .fl:nth-child(even){padding-right:0}
	.content .video{width:100%;}
	
}
@media screen and (min-width:600px) and (max-width:900px){
	.p_nav{width:30%;margin-right:2%}
	.p_r_con{width:68%;}
	.pc_mo123{display:none;}
	
}
@media screen and (min-width:900px) and (max-width:1024px){
	.p_nav{width:25%;margin-right:2%}
	.p_r_con{width:73%;}
	.p_r_con li{width:50%;}
	
}
@media screen and (min-width:1024px) {
	.header,.nav_wrap{position:absolute;top:0;}
	
	.nav_wrap{top:78px}
	.p_nav{width:20%;margin-right:2%}
	/*.p_nav a:hover{color:#fff;background-color:#f9a936;}*/
	.m-focusPic{padding-top:148px}
	.p_r_con{width:78%;}
	.p_r_con li{width:30%;}
	.p_r_con .li{width:70%;}
	.p_r_con .li a{width:45%;margin-left:2%;-webkit-transition:all 0s;-moz-transition:all 0s;transition:all 0s;}
	.p_r_con .li a:hover{color:#fff;background:#f9a936 url(img/p_bg.png) no-repeat 93% -18px;}

}
@media screen and (max-width:600px){
.pc_mo123{display:none;}
#picc{display:none;}
.p_nav h3:after{height:0;width:0;border-top:5px #fff solid;border-right:5px #fff solid;border-bottom:5px #f9a936 solid;border-left:5px #fff solid;}
/*.p_nav a{display:none;}*/

}
/*分页样式*/
#pages { padding:14px 0 10px; font-family:宋体; float:left }
#pages a { display:inline-block; height:22px; line-height:22px; background:#fff; border:1px solid #e3e3e3; text-align:center; color:#333; padding:0 10px}
#pages a.a1 { background:url(img/pages.png) no-repeat 0 5px; width:56px; padding:0 }
#pages a:hover { background:#e7e7e7; color:#000; text-decoration:none }

/*产品内容页*/
.photo-channel #Article .tool{ position:relative; height:35px; padding-top:6px}
.photo-channel #Article .tool .auto,.photo-channel .tool .up,.photo-channel .tool .next{background: url(img/up-next.png) no-repeat; height:27px; width:31px;margin-right:10px; overflow:hidden; line-height:27px}
.photo-channel #Article .tool .auto span,.photo-channel .tool .up span,.photo-channel .tool .next span{ visibility:hidden}
.photo-channel #Article .tool .auto{background-position: -39px top;}
.photo-channel #Article .tool .next{background-position: -78px top;}
.photo-channel #Article .Article-Tool{ position:absolute; right:0; border:none; background:none; font-size:12px; font-weight:normal}
.photo-channel #Article .tool .stat{ color:#999;}
.photo-channel #Article .big-pic{ text-align:center; padding:10px 0; border:1px solid #ededed; background-color:#fafcfe; position: relative}
/*.photo-channel #Article .big-pic #big-pic{display:table-cell;vertical-align:middle;*display:block; overflow:hidden;*font-size:420px;}*/

.photo-channel #Article .big-pic #big-pic img{
  max-width:600px;
  max-height:400px;
  width:expression(this.width > 600 ? "600px" : this.width);
  height:expression(this.height > 400 ? "400px" : this.height);
isplay:table-cell;
vertical-align:middle;
*display:block; 
overflow:hidden;
*font-size:420px; 
}
.photo-channel #Article .big-pic .max{ position:absolute; bottom:0px; right:0px;background: #FFF url(img/max.png) no-repeat 5px center; z-index:101; padding:5px 5px 5px 20px}
.photo_prev{position:absolute;left:0;top:0;width:50%;height:100%;z-index:100}
.photo_next{ position:absolute; right:0; top:0; width:50%; height:100%; z-index:100}
.photo_prev a{cursor:url(img/prev.cur), auto;}
.photo_next a{cursor:url(img/next.cur), auto;}
.photo_prev a,.photo_next a{background-image: url(img/blank.gif);display:block; width:100%; height:100%; outline:none;}

#Article .list-pic{ padding:22px 0 16px; height:100px}
#Article .cont{overflow:hidden; float: left; width:90%;max-width:830px; height:80px}
#Article .cont li{ float:left; width:123px; text-align:center; display:block; overflow:hidden}
#Article .cont li .img-wrap{width:100px; height:75px; margin:0 auto;}
#Article .cont li .img-wrap a{*font-size:55px;width:100px; height:75px;outline: medium none;}
#Article .cont li.on .img-wrap{ border:2px solid #ffb017}
#Article .list-pic .pre,#Article .list-pic .next{float:left; display:block; position:relative;background: url(img/pic_bg.png) no-repeat;width:110px;height:86px; text-align:center}
#Article .list-pic .pre{ left:-8px;top:-3px; margin-right:14px}
#Article .list-pic .next{ right:-8px; float:right;top:-3px}
#Article .list-pic .pre .img-wrap,#Article .list-pic .next .img-wrap{width:102px; height:72px;border:none; padding:4px 0 8px}
#Article .list-pic .pre .img-wrap a,#Article .list-pic .next .img-wrap a{*font-size:53px;width:98px; height:72px; padding:0px 5px 0 4px;*padding:0px 5px 5px 0px }
#Article .list-pic .pre .img-wrap a:hover,#Article .list-pic .next .img-wrap a:hover{ background:none}
#Article .list-pic .next{ right:-8px; float:right;bottom:-2px}
#Article .pre-bnt,#Article .next-bnt{margin-top:3px;cursor: hand;!important;cursor: pointer}
#Article .pre-bnt,#Article .next-bnt,#Article .pre-bnt span,#Article .next-bnt span{background: url(img/big-btn.png) no-repeat; display:block; width:17px; height:69px; float:left;}
#Article .pre-bnt:hover, #Article .next-bnt:hover,#Article .pre-bnt-on,#Article .next-bnt-on{background-position: 0 -78px;}
#Article .pre-bnt span{background-position: -30px top;}
#Article .pre-bnt:hover span,#Article .pre-bnt-on span{background-position: -30px -78px;}
#Article .next-bnt span{background-position: -55px top;}
#Article .next-bnt:hover span,#Article .next-bnt-on span{background-position: -55px -78px;}
/* endSelect */
#endSelect{top:200px;left:333px;position:absolute;width:230px;height:120px;border:1px solid #8a8a8a;display:none;z-index:200;}
#endSelect .bg{height:100%;width:100%;background:#000;filter:Alpha(Opacity=50);opacity:0.5;}
#endSelect .E_Cont{position:absolute;top:10px;left:26px;color:#fff;font-size:14px;}
#endSelect .E_Cont p{padding:4px 0;zoom:1;overflow:hidden;}
#rePlayBut,#nextPicsBut,#endSelect #endSelClose{background:url(img/big-btn.png) no-repeat}
#rePlayBut{float:left;width:69px;height:23px;background-position: 0px -167px;}
#nextPicsBut{float:left;width:97px;height:23px;background-position: -100px -167px;margin-left:10px;}
#endSelect #endSelClose{background-position: 0px -217px;position:absolute;top:3px;right:3px;cursor:pointer;width:11px;height:11px;overflow:hidden;z-index:2;}

.photo-channel #Article .text{ border:1px solid #ddd; background-color:#f3f3f3; padding:8px 10px; zoom:1; margin-bottom:20px}
.photo-channel .relevance{ padding:5px 10px 10px}
.photo-channel .relevance h5,.comment h4{background: url(img/icon.png) no-repeat left -375px; padding-left:16px;}
.photo-channel .relevance .photo-list{ padding:0; overflow:auto; padding-top:10px}
.photo-channel .relevance .photo-list li{ float:left; width:153px; padding:0}
.photo-channel .relevance .photo-list li .img-wrap{width:110px;height:86px;margin:0 auto;background: url(img/pic_bg.png) no-repeat; border:none; margin-bottom:6px}
.photo-channel .relevance .photo-list li .img-wrap a{*font-size:59px;width:104px; height:86px; padding:1px 5px 5px 1px }
.photo-channel .relevance .photo-list li .img-wrap a:hover{ background:none}

.box .photo-hot{padding:0 2px}
.photo-hot li{width:119px;*width:50%; text-align:center; padding:5px 0; vertical-align:top}
.photo-hot li div.img-wrap{ width:94px; margin:auto; margin-bottom:5px; height:64px;}
.photo-hot li div.img-wrap a{ width:94px; height:64px;*font-size:48px;}

<!--  页面分页  -->
.pglist { width:100%;text-align:center; margin-top:50px;}
.pglist li{ 
			vertical-align: bottom; display:inline-block;*display:inline; *zoom:1; *margin-left:5px;_display:inline; _zoom:1; _margin-left:5px;
		 	height:22px; line-height:22px; border:1px solid #dadada;margin-right:3px;
		 	color:#787878;font-size:12px;text-align:center;font-family:Arial;
		 	background:#f4f4f4;}
.pglist li a{color:#787878; display:block;padding-left:8px;padding-right:8px;}
.pglist li a:hover{background:#666; color:#fff;}
.pglist .current{ background:#666; color:#fff; padding: 0px 8px; height:22px; display:inline-block;}