/**
 * @Description: the stylesheet of productExtension
 * @authors: hanjw (han.jingwei@fengniao.com)
 * @date   : 2015-12-09 10:11:10
 * @version: 1.0
 */
 
/*reset*/
body,h1,h2,h3,h4,h5,h6,dl,dt,dd,ul,ol,li,th,td,p,blockquote,pre,form,fieldset,legend,input,button,textarea,hr{margin:0; padding:0;} 
ul,ol{list-style:none outside none;}
body{font:normal 12px/1.5 'Microsoft YaHei','\5FAE\8F6F\96C5\9ED1'; color:#333;}
select,input,button{vertical-align:middle; font-size:100%;}
fieldset,img{border:0 none;}
em{font-style:normal;}
.clear{clear:both; display:block; height:0; visibility:hidden; font:0/0 arial;}
.clearfix:after{content:"."; display: block; height: 0; clear: both; visibility: hidden; font-size:0;}
.clearfix {*zoom:1;} 

/* global */
.wrapper{width: 1200px; margin: 0 auto;} 
.wrapper .main{float: left; width: 880px;}
.wrapper .aside{float: right; width: 300px;}
.pic img{vertical-align: middle;}
a{color: #333; text-decoration: none; outline: 0 none;}
a:hover{color: #ff6619; text-decoration: none;}

/* bg */
.header .search-bar .search-button,
.equipment-category .icon,
.section .section-header .search-button{background: url(../images/productExtension-bg.png) no-repeat;}

/* header */
.header{position: relative; z-index: 100; height: 180px; background: #000;}
.header .logo{float: left; width: 224px; height: 70px; overflow: hidden; margin: 24px 0 0; background: url(../images/logo.png) no-repeat; text-indent: -999em;}
.header .search-box{position: relative; float: right; width: 640px; margin: 44px 0 0; border: 1px solid #333; -webkit-border-radius: 2px; border-radius: 2px;}
.header .search-box .search-bar{height: 34px; background: #222;}
.header .search-bar .search-button{float: right; width: 24px; height: 24px; overflow: hidden; margin: 5px 10px 0 0; border: 0 none; outline: 0 none; background-position: -176px 0; font: 0/0 arial; text-indent: -999em; cursor: pointer;}
.header .search-bar .search-button:hover{background-position: -176px -31px;}
.header .search-bar .search-txt{float: left; width: 570px; height: 34px; overflow: hidden; padding: 0 16px; background: #222;}
.header .search-bar .search-txt input{display: block; width: 100%; height: 14px; padding: 10px 0; border: 0 none; outline: 0 none; background: #222; color: #666; font-size: 14px; line-height: 16px;}
 
/* nav-box */
.nav-box{border-top: 4px solid #ddd;}
.nav-box .main-nav li{position: relative; float: left; margin: -4px 0 0; padding: 20px 0 0; border-top: 4px solid #ddd;}
.nav-box .main-nav .nav-text{float: left; height: 26px; padding: 0 30px; border-left: 1px solid #ddd; font-size: 24px; line-height: 26px;}
.nav-box .main-nav .nav-text:hover{color: #fe5740; text-decoration: none;}
.nav-box .main-nav li:first-child .nav-text{border-left: 0 none;}
.nav-box .main-nav .arrow-icon{display: none; position: absolute; top: 0; left: 50%; width: 0; height: 0; overflow: hidden; margin: 0 0 0 -5px; border: 5px solid #fff; border-top-color: #fe5740;}
.nav-box .main-nav .current{border-top-color: #fe5740;}
.nav-box .main-nav .current .nav-text{color: #fe5740;}
.nav-box .main-nav .current .arrow-icon{display: block;}

/* foot */
.foot{border-top: 1px solid #ccc; background-color: #f8f8f8; color: #333; line-height: 23px;padding:15px 0 20px; text-align: center; margin: 40px 0 0 0; font-family: 'Microsoft YaHei','\5FAE\8F6F\96C5\9ED1';}
.foot a{color: #333; margin: 0 10px;}
.foot .copyright{padding: 20px 0 0;}
.foot .link{font-size: 14px; color: #ccc;} 
.foot.fixed-footer{position: fixed; bottom: 0; left: 0; width: 100%;}

/* breadcrumb */
.breadcrumb{width: 1200px; height: 22px; overflow: hidden; margin: 15px auto 0; font: normal 12px/22px arial;}
.breadcrumb a{float: left; color: #666;}
.breadcrumb a:hover{color: #fe5740;}
.breadcrumb i{float: left; padding: 0 5px; color: #999; font: normal 12px/22px SimSun;}
.breadcrumb span{float: left; color: #999;}

/* page-box */ 
.page-box{margin: 20px 0 0; font: normal 14px/34px 'Microsoft YaHei','\5FAE\8F6F\96C5\9ED1';}
.page-box .button{float: right; height: 34px; margin: 0 0 0 13px; padding: 0 10px; -webkit-border-radius: 2px; border-radius: 2px; border: 1px solid #e9e9e9; cursor: pointer;}
.page-box .button:hover{border-color: #ff661a; color: #ff661a; text-decoration: none;}
.page-box .jump-page{float: right; margin: 0 0 0 13px;}
.page-box .jump-page input{display: inline-block; width: 44px; height: 14px; margin: 0 8px; padding: 10px 0; border: 1px solid #e9e9e9; line-height: 14px; text-align: center;}
.page-box .page-num{float: right; margin: 0 0 0 10px;}
.page-box .pager{float: right;}
.page-box .pager a{float: left; margin: 0 5px; padding: 0 14px; -webkit-border-radius: 2px; border-radius: 2px; border: 1px solid #e9e9e9;}
.page-box .pager a:hover{border-color: #fe5740; color: #fe5740; text-decoration: none;}
.page-box .pager .selected,
.page-box .pager .selected:hover{border-color: #fe5740; background: #fe5740; color: #fff;}
.page-box .pager .disabled,
.page-box .pager .disabled:hover{border: 1px solid #e9e9e9; color: #999; cursor: text;}
.page-box .pager .more{float: left; line-height: 36px;}

/* equipment-category */
.equipment-category{position: relative; overflow: hidden; border: 1px solid #e9e9e9; border-top: 0 none;}
.equipment-category li{float: left; width: 146px; height: 147px; margin: 0 0 0 -1px; border-left: 1px solid #e9e9e9;}
.equipment-category li a{position: relative; display: block; width: 146px; height: 48px; padding: 99px 0 0;}
.equipment-category .icon{position: absolute; top: 25px; left: 50%; width: 61px; height: 50px; overflow: hidden; margin: 0 0 0 -30px; text-indent: -999em;}
.equipment-category .icon1{width: 61px; height: 50px; background-position: 0 0;}
.equipment-category .icon2{top: 28px; width: 76px; height: 42px; margin-left: -38px; background-position: -65px 0;}
.equipment-category .icon3{width: 80px; height: 50px; margin-left: -40px; background-position: 0 -55px;}
.equipment-category .icon4{width: 31px; height: 55px; margin-left: -15px; background-position: -85px -55px;}
.equipment-category .icon5{top: 28px; width: 69px; height: 50px; margin-left: -40px; background-position: 0 -115px;}
.equipment-category .icon6{width: 37px; height: 58px; margin-left: -19px; background-position: -84px -115px;}
.equipment-category li:hover a{text-decoration: none;}
.equipment-category li:hover .icon1{background-position: 0 -180px;}
.equipment-category li:hover .icon2{background-position: -70px -180px;}
.equipment-category li:hover .icon3{background-position: 0 -240px;}
.equipment-category li:hover .icon4{background-position: -85px -240px;}
.equipment-category li:hover .icon5{background-position: 0 -305px;}
.equipment-category li:hover .icon6{background-position: -84px -305px;}
.equipment-category .equipment-text{display: block; height: 24px; font-size: 14px; line-height: 24px; text-align: center;}

/* newslist-box */
.newslist-box{position: relative; overflow: hidden; padding: 0 20px 20px; border: 1px solid #e9e9e9; border-top: 0 none;}
.newslist-box .news-list li{height: 34px; overflow: hidden; margin: 10px 0 0; border-bottom: 1px solid #e9e9e9; font-size: 14px; line-height: 34px; vertical-align: middle;}
.newslist-box .news-list .date{float: right; padding: 0 0 0 20px; color: #999; font-size: 12px;}
.newslist-box .news-list .good-num{float: right; padding: 0 0 0 20px; color: #999; font-size: 12px;}
.newslist-box .news-list .news-title{float: left; max-width: 570px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.newslist-box .news-list .tag{float: left; height: 16px; margin: 7px 0 0 10px; padding: 1px 7px; border: 1px solid #e9e9e9; background: #fff; color: #ff5740; font: normal 12px/16px arial;}

/* ranklist-box */
.ranklist-box{position: relative; overflow: hidden; padding: 10px 15px 0; border: 1px solid #e9e9e9; border-top: 0 none;}
.ranklist-box .rank-list li{position: relative; height: 40px; overflow: hidden; padding: 0 0 0 20px; font-size: 14px; line-height: 40px; word-wrap: break-word; word-break: break-all;}
.ranklist-box .rank-list em{position: absolute; top: 0; left: 0; width: 20px;}
.ranklist-box .rank-list em.n1{color: #ff5740;}

/* piclist-box */
.piclist-box{position: relative; overflow: hidden;}
.piclist-box .pic-list{margin: 0 -18px 0 0;}
.piclist-box .pic-list li{float: left; width: 140px; height: 140px; margin: 10px 16px 10px 0; border: 1px solid #e9e9e9;}
.piclist-box .pic-list a{position: relative; display: block; width: 140px; height: 140px; overflow: hidden; text-align: center; line-height: 138px; *line-height: 120px; *font-family: arial;}
.piclist-box .pic-list img{position: relative; max-height: 140px; max-width: 140px;}
.piclist-box .pic-list .pic-text{position: absolute; bottom: 0; left: 0; width: 140px; height: 28px; overflow: hidden; background: #ccc; background: rgba(0,0,0,.5); color: #fff; font-size: 14px; line-height: 28px; text-align: center;}

/* category-list */
.category-list{position: relative; max-height: 100px; overflow-x: hidden; overflow-y: auto; padding: 17px 15px 14px 5px; border: 1px solid #e9e9e9; border-top: 0 none;}
.category-list li{float: left; width: 85px; height: 38px; overflow: hidden; padding: 0 0 0 20px; font: normal 14px/38px arial; white-space: nowrap; text-overflow: ellipsis;}

/* tag-box */
.tag-box{margin: 18px 0 33px;}
.tag-box .tag-header{height: 26px;}
.tag-box .tag-header .tag-nav{height: 26px; border-top: 2px solid #999; background: #f7f7f7;}
.tag-box .tag-header li{position: relative; float: left; margin: -2px -1px 0 0; border-top: 2px solid #999; font: bold 12px/26px 'Microsoft YaHei','\5FAE\8F6F\96C5\9ED1'; cursor: pointer;}
.tag-box .tag-header li span{float: left; padding: 0 10px 0 10px; border: 1px solid #e9e9e9; border-top: 0 none; color: #666;}
.tag-box .tag-header li:first-child span{float: left; padding: 0 21px 0 22px;}
.tag-box .tag-header li:hover span{color: #fe5740;}
.tag-box .tag-header .current{border-top-color: #fe5740; background: #fff;}
.tag-box .tag-header .current span{border-bottom: 0 none; color: #fe5740;}
.tag-box .tag-list{border: 1px solid #e9e9e9; border-top: 0 none;} 
.tag-box .tag-list{clear:both;position: relative; max-height: 180px; overflow-x: hidden; overflow-y: auto; padding: 17px 15px 14px 5px; border: 1px solid #e9e9e9; border-top: 0 none;}
.tag-box .tag-list li{float: left; width: 85px; height: 38px; overflow: hidden; padding: 0 0 0 20px; font: normal 14px/38px arial; white-space: nowrap; text-overflow: ellipsis;}

/* section */
.section{margin: 5px 0 33px;}
.section .section-header{height: 40px; border-bottom: 2px solid #999; line-height: 38px;}
.section .section-header .section-title{position: relative; float: left; height: 40px; margin: 0 0 -2px; padding: 0 1px 0 0; border-bottom:2px solid #fff; font: bold 18px/40px 'Microsoft YaHei','\5FAE\8F6F\96C5\9ED1';}
.section .section-header .section-title span{float: left; height: 40px; margin: 0 0 -2px; padding: 0 3px; border-bottom:2px solid #fe5740;}
.section .section-header .search-bar{float: right; width: 258px; height: 36px; margin: -3px 0 0; border: 1px solid #eaeaea; background: #fff;}
.section .section-header .search-button{float: right; width: 24px; height: 24px; overflow: hidden; margin: 5px 10px 0 0; border: 0 none; outline: 0 none; background-position: -176px 0; font: 0/0 arial; text-indent: -999em; cursor: pointer;}
.section .section-header .search-button:hover{background-position: -176px -31px;}
.section .section-header .search-txt{float: left; width: 200px; padding: 0 10px;}
.section .section-header .search-txt input{display: block; width: 100%; height: 14px; padding: 10px 0; border: 0 none; outline: 0 none; background: #fff; color: #666; font-size: 14px; line-height: 16px;}
.section .section-header .more{float: right; font-family: arial;}

/* aside > section */
.aside .section{margin: 5px 0 3px;}

/* masonry-section */
.masonry-section .section-header{border-bottom: 1px solid #e9e9e9;}
.masonry-section .section-header .search-bar{margin-top: -10px;}
.masonry-section .section-header .tab-links{float: left;}
.masonry-section .section-header .tab-links a{float: left; position: relative; float: left; height: 39px; margin: 0 0 -2px; padding: 0 20px 2px 20px; font: normal 16px/39px 'Microsoft YaHei','\5FAE\8F6F\96C5\9ED1';}
.masonry-section .section-header .tab-links a.current{padding-bottom: 0; border-bottom:2px solid #fe5740;}
.masonry-section .masonry-wrap{width: 1200px; overflow: hidden;}
.masonry-section .picture-masonry .masonry-item{float: left; width: 200px; margin: 20px 50px 0 0;}
.masonry-section .picture-masonry a{position: relative; display: block; width: 200px; overflow: hidden; text-align: center;}
.masonry-section .picture-masonry img{position: relative; max-width: 200px;}
.masonry-section .picture-masonry .pic-title{position: absolute; bottom: 0; left: 0; width: 200px; height: 28px; overflow: hidden; background: #ccc; background: rgba(0,0,0,.5); color: #fff; font-size: 14px; line-height: 28px; text-align: center;}
/**
* @description : the style of PE改版
* @authors 	: hanjw (han.jingwei@fengniao.com)
* @date    	: 2016-03-14 12:05:37
* @link 	: http://www.fengniao.com/pe/pro_use.html
* @version 	: 1.0
*/

/* question-button */
.question-button{ display: block; height: 54px; margin: 17px 0 0; border: 1px solid #ffa193; border-bottom-width: 3px; -webkit-border-radius: 0 0 2px 2px; border-radius: 0 0 2px 2px; background: #fff8f7; color: #fe5740; font: bold 20px/54px 'Microsoft YaHei','\5FAE\8F6F\96C5\9ED1'; text-align: center; cursor: pointer;}
.question-button:hover{border: 1px solid #ff8371; border-top: 2px solid #fa5a43; border-bottom-width: 2px; border-radius: 0; background: #ff8371; color: #fff; line-height: 53px;}

/* layerbox-overlay */
.layerbox-overlay{display: none; position: fixed; top: 0; left: 0; display: none; width: 100%; height: 100%; z-index: 1000; background: #000; filter: alpha(opacity=85); opacity: .85; -moz-opacity: .85; _position: absolute; _height: expression(documentElement.offsetHeight+"px"); _top: expression(documentElement.scrollTop+"px");}

/* layerbox */
.layerbox .question-title dt,
.layerbox .layer-buttons .upload-button{background: url(../images/productExtension-bg.png) no-repeat;}
.layerbox{ display: none; position: fixed; top: 50%; left: 50%; z-index: 1001; width: 840px; height: 450px; overflow: hidden; margin: -240px 0 0 -420px; padding: 30px; border: 1px solid #fe5740; background: #fff;}
.layerbox .closed-button{ position: absolute; top: 0; right: 0; width: 26px; height: 26px; background: #FE5740; color: #fff; font: bold 16px/26px SimSun; text-align: center; cursor: pointer;}
.layerbox select{ float: left; min-width: 200px; max-width: 400px; height: 40px; outline: 0 none; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; margin: 0 20px 0 0; padding: 0 25px 0 12px; border: 1px solid #e9e9e9; background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAFAQMAAABGqu8rAAAABlBMVEX/////Zhm8loNyAAAAAXRSTlMAQObYZgAAABdJREFUeF5jOHCAIbGBwZiBQY6BgYcBAB/AAr8TSoWpAAAAAElFTkSuQmCC) no-repeat 95% 50%; font-size: 14px; line-height: 40px;}
.layerbox select::-ms-expand{display: none;}
.lowIE .layerbox select{height: 40px; padding: 10px 5px 10px 10px; *height: 20px; *margin-top: 10px; *padding: 0; background: #fff;}
.layerbox .question-title{margin: 15px 0 0;}
.layerbox .question-title dt{ height: 28px; padding: 0 0 0 40px; background-position: -176px -73px; color: #fe5740; font-size: 18px; line-height: 28px;}
.layerbox .question-title dd{ position: relative;}
.layerbox .question-title input{ display: block; width: 812px; margin: 16px 0 0; padding: 7px 13px 7px; border: 1px solid #e9e9e9; font-size: 14px; line-height: 24px;}
.layerbox .question-title .num-count{ position: absolute; bottom: 5px; right: 10px; height: 24px; color: #999; font: normal 14px/24px SimSun;}
.layerbox .explain-box{margin: 15px 0 0;}
.layerbox .explain-box dt{ height: 28px; font-size: 18px; line-height: 28px;}
.layerbox .explain-box .explain-content{ display: block; width: 828px; height: 188px; resize: none; overflow-x: hidden; overflow-y: auto; margin: 10px 0 0; padding: 5px; border: 1px solid #e9e9e9; font-size: 14px; line-height: 24px; text-align: left;}
.layerbox .layer-buttons{ height: 42px; margin: 20px 0 0;}
.layerbox .layer-buttons .submit-button{ float: right; width: 128px; height: 40px; border: 1px solid #FE5740; background: #fff; color: #fe5740; font: normal 18px/40px 'Microsoft YaHei','\5FAE\8F6F\96C5\9ED1'; text-align: center; cursor: pointer;}
.layerbox .layer-buttons .submit-button:hover{background: #FE5740; color: #fff;}
.layerbox .layer-buttons .upload-box{ float: left; height: 40px; width: 300px;}
.layerbox .layer-buttons .button-wrap{float: left; position: relative; width: 80px; height: 40px; overflow: hidden;}
.layerbox .layer-buttons .button-wrap input{position: absolute; top: 0; left: 0; z-index: 10; width: 100px; height: 40px; opacity: 0; filter:alpha(opacity=0); cursor: pointer;}
.layerbox .layer-buttons .button-wrap .upload-button{position: absolute; top: 0; left: 0; z-index: 1; height: 40px; margin: 8px 10px 0 0; padding: 0 0 0 35px; outline: 0 none; background-position: -176px -123px; color: #666; font-size: 14px; line-height: 28px; cursor: pointer;}
.layerbox .layer-buttons .button-wrap:hover .upload-button{background-position: -176px -163px; color: #FE5740;}
.layerbox .layer-buttons .pic{float: left; display: block; width: 40px; height: 40px; overflow: hidden; background: #f9f9f9; line-height: 38px;}
.layerbox .layer-buttons .pic img{max-width: 40px; max-height: 40px; vertical-align: middle; text-align: center;}

body.has-layer{ height: 100%; overflow: hidden;}
body.has-layer .layerbox-overlay{ display: block;}
body.has-layer .layerbox{ display: block;}


