* { padding:0; margin:0;}
body { width:100%; min-width:1200px; padding:0; margin:0; background:#f5f7fa; color:#555; font-size:14px; line-height:180%; font-family:'open sans','PingFang SC','Lantinghei SC','Helvetica Neue',Helvetica,Arial,'Microsoft YaHei',"sans-serif";}
div,form,ul,li,h1,h2 { word-break:break-all;}
ul,li { list-style:none;}
em {font-style: normal;}
div,nav,footer { display:block;}
img { border:0;}
h1 { font-size:26px; font-weight:normal; line-height:150%;}
input { color:#555;}
input[type="text"]{ -webkit-appearance:none; outline:none; border:0;}
input::-ms-clear { display:none;}
button { outline:none; border:0;}
.clear { clear: both;}
.strong_red { color:#FF9900; font-weight:normal;}

.wrap { width:1200px; margin: 0 auto; clear: both;}
.wrap_white { float: left; background: #fff; display: block;}
.wrap .col-left { float: left; width:180px;}
.wrap .col-center { float: left; width:680px; margin:0 50px;}
.wrap .col-right { float: left; width:300px;}
.wrap .t { float: left; width:100%; padding:25px 0 15px 0; font-size:22px; clear: both;}
.wrap .t1 { padding-top:0;}
.wrap .tc {  border-bottom:1px #eee solid; margin: 10px 0 0 0;}

.tb { display: table; border-collapse: collapse;}
.tb .row { display: table-row;}
.tb .col { display: table-cell; vertical-align: top;}


/* link */
a:link,a:visited { color:#555; text-decoration:none;}
a:hover,a:active { color:#FF9900; text-decoration:none;}

.a_gray a:link,.a_gray a:visited { color:#999 !important;}
.a_gray a:hover,.a_gray a:active { color:#FF9900 !important;}

.a_blue a:link,.a_blue a:visited { color:#0a528e !important;}
.a_blue a:hover,.a_blue a:active { color:#FF9900 !important;}

.a_red a:link,.a_red a:visited { color:#F40 !important;}
.a_red a:hover,.a_red a:active { color:#F40 !important;}

.a_white a:link,.a_white a:visited { color:#FFF !important;}
.a_white a:hover,.a_white a:active { color:#F40 !important;}


/* pop_msg_area */
#pop_msg_area { text-align:center; top:0; bottom:0; left:0; right:0; position:fixed; display:block; z-index:1000;}
#pop_msg_area .pop_msg { width:auto; min-width: 300px; max-width:60%; margin:200px 0 0 0; background:#333; color:#fff; border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px; -o-border-radius:6px; overflow:hidden; display:inline-block;}
#pop_msg_area .pop_msg span { text-align: center; float:left; width: 90%; padding:30px 5%; clear:both; display:block;}
#pop_msg_area .pop_msg button { float:left; width:100%; padding:10px 0; background:#66CCCC; color:#FFF; clear:both; display:block;}


/* list-page */
.list-page { text-align: center; float:left; width:100%; padding:30px 0px 60px 0px; clear:both;}
.list-page span,
.list-page a { width:auto; padding:4px 16px; margin:0 0 0 10px; font-size:14px; background:#555; color:#eee; border-radius: 2px; display:inline-block;}
.list-page span { background:#464eb6; color:#fff;}
.list-page a:link,.list-page a:visited { background:#555; color:#eee; text-decoration:none;}
.list-page a:hover,.list-page a:active { background:#464eb6; color:#fff; text-decoration:none;}




/* nav */
.top-nav { float: left; width: 100%; padding: 10px 0; color:#999; font-size: 12px; line-height: 100%; background: #f5f5f5; border-bottom: 1px #eee solid; display: block;}
.top-nav span { float: left; margin: 0 10px 0 0; display: block;}
.top-nav a { float: left; display: block;}

.top-nav a:link,.top-nav a:visited { color: #999;}
.top-nav a:hover,.top-nav a:active { color:#F40;}

.top-nav .top-login { float: left; display: block;}
.top-nav .top-my { float: right; display: block;}
.top-nav .top-my span { padding: 0 0 0 15px; margin: 0 0 0 15px; border-left: 1px #ccc solid; }
.top-nav .top-my span:first-child { border: 0; }


nav { float: left; width: 100%; background: #fff; display: block;}
nav .col-logo { float: left; width: 280px;}
nav .col-logo img { float: left; margin: 20px 0; width: 100%; display: block;}

nav .col-so { float: left; margin: 28px 0 0 60px; display: block;}
nav .col-so .so-type { text-align: center; float: left; width: 100px; height: 39px; color: #999; margin: 0 -100px 0 0; cursor: pointer; position: relative; display: block; z-index: 101;}
nav .col-so .so-type span { float: left; width: 90px; padding: 0 0 0 10px; margin: 12px 0 8px 0; border-right: 1px #e2e2e2 solid; line-height: 100%; display: block;}
nav .col-so .so-type ul { float: left; width: 60px; padding: 3px 8px; margin: 0 0 0 16px; background: #fff; border: 1px #ddd solid; border-radius: 2px; display: none;}
nav .col-so .so-type li { float: left; width: 100%; display: block;}
nav .col-so .so-input { float: left; width: 260px; padding: 10px 20px 10px 120px; background: #fff; border: 2px #464eb6 solid; border-right: 0; border-radius: 30px 0 0 30px; display: block;}
nav .col-so .so-input::-webkit-input-placeholder { color: #ccc;}
nav .col-so .so-btn { float: left; width: 100px; height: 39px; font-size: 14px; color: #fff; background: #464eb6; border-radius: 0 30px 30px 0; overflow: hidden; display: block; cursor: pointer;}
nav .col-so .so-btn i { float: left; width: 20px; height: 20px; margin: 0 40px 0 36px; background: url(/images/icons.png) 0 0 no-repeat; display: block;}
nav .col-so .so-btn:hover { background: #2D348E;}

nav .col-hot { float: right; width: 300px; margin: 24px 0 0 0; font-size: 12px; display: block;}
nav .col-hot li { float: right; margin: 0 0 0 10px; display: block;}


/* menu */
.menu { float: left; width: 100%; background: #464eb6; color: #fff; display: block;}
.menu ul { float: left; display: block;}
.menu li { float: left; display: block;}
.menu .col-menu ul { width: 50%;}
.menu a { float: left; padding: 8px 30px; color: #fff; font-size: 16px; font-weight: normal; display: block;}
.menu .col-menu a:link,.menu .col-menu a:visited { background: #464eb6;}
.menu .col-menu a:hover,.menu .col-menu a:active { background: #2D348E;}
.menu .col-menu .menu-y a { background: #2D348E;}

.menu .col-cat { float: left; margin: 0 50px 0 0; display: block;}
.menu .col-cat a { float: left; width: 220px; background: #4b9651; display: block;}
.menu .col-cat a i { float: right; width: 22px; height: 22px; margin: 5px 0 -5px 0; background: url(/images/icons.png) -50px 0 no-repeat; display: block;}
.menu .col-cat ul { width: 220px; padding: 0 30px 20px 30px; margin: 41px 0 0 0; background: #4b9651; display: block; position: absolute; z-index: 100; display: none;}
.menu .col-cat ul li { width: 100%;}
.menu .col-cat ul a { width: auto; margin: 3px 5px; padding: 0; font-size: 12px;}
.menu .col-cat ul a:link,.menu .col-cat ul a:visited {  text-decoration: none;}
.menu .col-cat ul a:hover,.menu .col-cat ul a:active {  text-decoration: underline;}


/* bread */
.bread { float: left; width: 100%; margin: 15px 0; font-size: 14px; color:#999; display: block;}
.bread a:link,.bread a:visited { color:#999;}
.bread a:hover,.bread a:active { color:#999; text-decoration: underline;}


/* product */
.product .pro { float: left; width: 100%; display: block;}
.product .pro-info { float: left; width: 100%; background: #fff; display: block;}
.product .imgs { float: left; width: 350px; display: block;}
.product .imgs .img-big { text-align: center; float: left; width: 350px; height: 350px; overflow: hidden; display: block;}
.product .imgs .img-small { float: left; display: block;}
.product .imgs .img-small li { float: left; width: 48px; height: 48px; border: 1px #ddd solid; margin: 15px 10px 30px 0; cursor: pointer; overflow: hidden; display: block;}
.product .imgs img { float: left; width: 100%; display: block;}

.product .info { float: left; width: 500px; margin: 0 55px; display: block;}

.product .price { float: left; width: 100%; padding: 20px 0 0 0; margin: 20px 0 0 0; border-top: 1px #ddd solid; display: block;}
.product .price .tb { min-width: 350px; max-width: 100%;}
.product .price .tb .col { text-align: center; padding: 4px; border: 1px #c8d2e0 solid;}
.product .price .tb .b { font-weight: bold; background: #E9EEF5;}
.product .info_detail { float: left; width: 100%; padding: 20px 0; margin: 20px 0; border-top: 1px #ddd solid; display: block;}
.product .info_detail i { width: 80px; color: #999; font-style: normal; display: inline-block;}

.product .company { float: right; width: 240px; display: block;}
.product .company ul { float: left; width: 200px; padding: 20px; margin: 0 0 30px 0; background: #cfe8fc; font-size: 12px; display: block;}
.product .company li { float: left; width: 100%; padding: 3px 0; display: block;}
.product .company .b { font-size: 16px; font-weight: bold; padding: 0 0 10px 0; margin:  0 0 10px 0; border-bottom: 1px #b9d9f3 solid;}
.product .company .login { text-align: center; background: #fff1e7;}
.product .company .login .b { border-bottom: 1px #ffdfc8 solid;}
.product .company button { text-align: center; width: 50%; margin: 10px 0; padding: 10px 0; background: #4b9651; color: #fff; display: inline-block;}
.product .company button.reg { background: #F40;}

.pro-body .body { float: left; width: 830px; padding: 50px; margin: 30px 0; background: #fff; font-size: 16px; display: block;}
.pro-body .body .t { float: left; width: 100%; font-size: 22px; margin: 0 0 20px 0; display: block;}
.pro-body .body .price { border: 0; padding: 0 0 50px 0; margin: 0 0 30px 0; font-size: 14px; border-bottom: 1px #ddd solid;}
.pro-body .body .price .col { min-width: 150px; padding: 4px 15px;}
.pro-body .body .price .b { min-width: 120px;}
.pro-body .body img { max-width: 100%;}
.pro-body .body p { margin: 0 0 20px 0;}

.pro-body .pro-list-r { float: right; width: 200px; padding: 20px; margin: 30px 0 0 0; background: #fff; display: block;}
.pro-body .pro-list-r li { float: left; width: 100%; padding: 10px 0; border-top: 1px #eee solid; display: block;}
.pro-body .pro-list-r .t { padding: 10px 0;}
.pro-body .pro-list-r .img { float: left; width: 80px; height: 80px; overflow: hidden; display: block;}
.pro-body .pro-list-r .img img { float: left; width: 100%; display: block;}
.pro-body .pro-list-r .title { float: right; width: 100px; line-height: 150%; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;}

.product .pro-list { margin: 30px 0;}


/* categories-area */
.categories-area { float: left; width: 100%; margin: 0 0 30px 0; background: #fff; border: 1px #eee solid; display: block;}
.categories-area ul { float: left; margin: 10px; display: block;}
.categories-area li { float: left; padding: 5px 15px; border-radius: 5px; display: block;}
.categories-area .y { background: #b9d9f3;}
.categories-area i { margin: 0 0 0 3px; color: #999;}


/* sale */
.sale { float: left; width: 100%; display: block;}
/* categories */
.categories { float: left; width: 100%; display: block;}


/* pro-list */
.pro-list { float: left; width: 1225px; margin: 0 -10px; display: block;}
.pro-list li { float: left; width: 223px; margin: 0 9px 20px 10px; padding: 0 0 20px 0; background: #fff; border: 1px #efefef solid; font-size: 12px; overflow: hidden; display: block;}
.pro-list .img { text-align: center; float: left; width: 223px; height: 223px; margin: 0 0 15px 0; background: #fff; overflow: hidden; display: block;}
.pro-list .img img { height: 100%;}
.pro-list .title,
.pro-list .price,
.pro-list .area,
.pro-list .company { text-align: center; float: left; width: 90%; height: 18px; margin: 5px 5%; line-height: 150%; overflow: hidden;}
.pro-list .title { font-size: 16px; font-weight: bold; height: 46px; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.pro-list .title strong { color: #FF9900;}
.pro-list .area { color: #999; padding: 10px 0 0 0; border-top: 1px #eee solid;}
.pro-list .company { height: 16px; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.pro-list .price { font-size: 14px; color:#FF9900;}


/* company */
.company nav { background: #00032b;}
.company nav .col-logo img { margin: 12px 0;}
.company nav .col-so { float: right; margin: 13px 0 0 60px;}
.company nav .col-so .so-type span { margin: 9px 0 4px 0;}
.company nav .col-so .so-type ul { background: #efefef;}
.company nav .col-so .so-input { padding: 8px 20px 8px 120px; background: #efefef; border: 0; border-radius: 4px 0 0 4px;}
.company nav .col-so .so-btn { height: 31px;background: #f40; border-radius: 0 4px 4px 0;}


.company .company-name { text-align: center; float: left; width: 100%; height: 160px; background: #152b56; color: #fff; overflow: hidden; display: block;}
.company .bg { float: left; width: 150%; height: 600px; margin: -200px; background-position: center center; background-size: 150% auto; opacity: 0.7; filter: blur(6px);}
.company .h { float: left; width: 100%; height: 160px; margin: -200px 0 0 0; position: relative;}
.company h1 { margin: 40px 0 50px 0; font-size: 40px; text-shadow: #000 1px 1px 3px;}

.company .menu { float: left; width: 100%; background: #00032b; border-bottom: 3px #f90 solid; display: block;}
.company .menu li { float: left; display: block;}
.company .menu .col-menu a:link,.company .menu .col-menu a:visited { background: #00032b;}
.company .menu .col-menu a:hover,.company .menu .col-menu a:active { background: #FF9900;}
.company .menu .col-menu .c-m-y a { background: #FF9900;}

.company .pro-list { margin-top: 30px;}

.company .company-contact { float: left; width: 100%; display: block;}
.company .company-contact ul { width: 500px; margin: 50px auto; padding: 50px; background: #fff; border: 1px #ddd solid; display: block;}
.company .company-contact li { width: 100%; padding: 10px 0; display: block;}
.company .company-contact .c-t { font-size: 22px; padding: 0 0 20px 0; margin: 0 0 10px 0; border-bottom: 1px #ddd solid;}


/* supplier */
.supplier  { float: left; width: 100%; display: block;}
.supplier .supplier-list  { float: left; width: 100%; display: block;}
.supplier .supplier-list ul  { float: left; width: 100%; display: block;}
.supplier .supplier-list li  { float: left; width: 318px; padding: 30px; margin: 10px; background: #fff; border: 1px #eee solid; display: block;}
.supplier .supplier-list div  { float: left; width: 100%; margin: 5px 0; display: block;}
.supplier .supplier-list .company { height: 25px; font-size: 18px; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;}
.supplier .supplier-list .company strong { color: #FF9900; font-weight: normal;}
.supplier .supplier-list .business_model  { color: #999;}


/* fix_area */
.fix_area { right:5px; bottom:100px; width:48px; height:165px; position:fixed; overflow:hidden;}
.fix_area span { width:48px; height:48px; margin:0px 0px 7px 0px; display:block; overflow:hidden; cursor:pointer;}

.fix_area .backtotop { background-image: url(/images/icons.png); background-repeat: no-repeat; background-position: -89px 12px; background-color: #222731;}
.fix_area .backtotop:hover,
.fix_area .backtotop:active { background-color: #F40;}


/* footer */
footer { float:left; margin:30px 0 0 0; padding:30px 0; font-size:12px; width:100%; background: #222731; color:#979CA0; clear: both;}
footer a:link,footer a:visited { color:#979CA0;}
footer a:hover,footer a:active { color:#FF9900;}

footer .links { float: left; width:100%; padding:0 0 20px 0; margin:0 0 20px 0; border-bottom:1px #555 solid; clear: both;}
footer .links span,
footer .links a { float: left; width:auto; margin:0 15px 0 0; display: block;}

footer .us-info { float: left; width:100%; padding:0 0 10px 0; clear: both;}
footer .us-info a { float: left; width:auto; margin:0 15px 0 0; display: block;}