@charset "UTF-8";
@import url(fonts.css);
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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }

html { line-height: 1; }
html ol, html ul, html li { list-style: none; }
html table { border-collapse: collapse; border-spacing: 0; }
html caption, html th, html td { text-align: left; font-weight: normal; vertical-align: middle; }
html q, html blockquote { quotes: none; }
html q:before, html q:after, html blockquote:before, html blockquote:after { content: ""; content: none; }
html img { border: none; }
html article, html aside, html details, html figcaption, html figure, html footer, html header, html hgroup, html main, html menu, html nav, html section, html summary { display: block; }
html :link, html :visited, html ins { text-decoration: none; }
html *, html *:after, html *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
html .clearfix { zoom: 1; }
html .clearfix:before, html .clearfix:after { content: " "; display: table; }
html .clearfix:after { clear: both; }

article::after, header::after, .Side .list-rank a::after, .Mobile-Ad .list-rank a::after, .BannerIndex::after, .Banner::after, .Index::after, .Tool::after, .Products .new-prolist li div span::after, .Products .newbox::after, .Product-List ul li div span::after, .Product-List-New ul li div span::after, .member-login .loginbox .title::after, footer::after { clear: both; content: ''; display: block; visibility: hidden; height: 0; }

.gogotop, .mobile-down, .mobile-up, .Products .newbox .list li .img span, .member-down, .member-up { -moz-transition: all 0.8s; -o-transition: all 0.8s; -webkit-transition: all 0.8s; transition: all 0.8s; }

body { font-family: Arial, "微軟正黑體", "Microsoft JhengHei", sans-serif; font-size: 14px; line-height: 24px; }

#Wrapper { width: 100%; max-width: 1200px; margin: 0 auto; }

article { position: relative; width: 100%; display: block; }

img { max-width: 100%; }

.mv { -moz-transition: all 0.8s; -o-transition: all 0.8s; -webkit-transition: all 0.8s; transition: all 0.8s; }

.gogotop { background: #e60012; width: 80px; height: 38px; text-align: center; position: fixed; bottom: 15%; right: -100%; z-index: 100; border: 5px solid #eee; border-right: none; -moz-border-radius: 50px 0px 0px 50px; -webkit-border-radius: 50px; border-radius: 50px 0px 0px 50px; }
.gogotop a { color: #fff; display: block; }
.gogotop:hover { background: #06c; }

hr.style-one { border: 0; height: 1px; background: #333; margin: 0px 0; background-image: -webkit-linear-gradient(left, #ccc, #333, #ccc); background-image: -moz-linear-gradient(left, #ccc, #333, #ccc); background-image: -ms-linear-gradient(left, #ccc, #333, #ccc); background-image: -o-linear-gradient(left, #ccc, #333, #ccc); }

hr.style-two { border: 0; height: 1px; margin: 0px 0; background-image: -webkit-linear-gradient(left, transparent, rgba(0, 0, 0, 0.75), transparent); background-image: -moz-linear-gradient(left, transparent, rgba(0, 0, 0, 0.75), transparent); background-image: -ms-linear-gradient(left, transparent, rgba(0, 0, 0, 0.75), transparent); background-image: -o-linear-gradient(left, transparent, rgba(0, 0, 0, 0.75), transparent); }

header { width: 100%; }
header .logo { display: block; float: left; width: 240px; margin-top: 35px; }
header .search { float: left; width: calc( 100% - 240px); margin: 20px 0 30px 0; }
header .search .keyword { width: 100%; display: block; }
header .search .keyword p { color: #000; display: inline-block; font-weight: bold; width: 50px; }
header .search .keyword input { border: 4px solid #ec3235; padding: 5px; width: calc(100% - 50px); }
header .search .searchbox { width: 100%; display: inline-block; padding: 10px 20px; margin: 10px 0; background-image: url(../images/lineA1.png), url(../images/lineA2.png); background-repeat: no-repeat, no-repeat; background-position: left top, right bottom; }
header .search .searchbox b { font-weight: bold; margin-right: 5px; }
header .search .searchbox b:nth-of-type(2) { margin-left: 20px; }
header .search .searchbox select { margin-right: 5px; background: #f5f5f5; padding: 3px 10px 5px 10px; width: 130px; }
header .search .searchbox input { width: 100px; padding: 5px; background: #f5f5f5; border: 1px solid #ccc; padding: 5px; }
header .search .searchbox button { background: none; border: none; color: #000; font-size: 18px; vertical-align: middle; cursor: pointer; }
header .search .textbox { display: block; text-align: right; margin-right: 7%; }
header .search .textbox .word a { color: #746969; font-size: 13px; margin: 0 5px; }
header .search .textbox .word a:hover { color: #f00; }
header .search .phone-word{margin-top:10px;text-align: center;display: none;}
header .search .phone-word a{color: #fff; font-size: 14px; margin:5px;display: inline-block; }
header .search .textbox ul, header .search .textbox li { display: inline-block; }
header .search .textbox .member { color: #746969; border-left: 1px solid #746969; border-right: 1px solid #746969; padding: 0 15px; margin: 0 10px; line-height: 12px; }
header .search .textbox .member li { margin: 0 5px; font-size: 13px; }
header .search .textbox .member li a { color: #746969; font-weight: bold; }
header .search .textbox .member li a:hover { color: #f00; }
header .search .textbox .other li { margin: 0 5px; font-size: 13px; }
header .search .textbox .other li a { color: #f00; }
header .search .textbox .other li a:hover { color: #000; }
header .menu { width: 100%; display: block; float: left; margin-bottom: 20px; display: flex;}
header .menu li { display: block; float: left;width: calc(100% / 8); }
header .menu li a { font-size: 17px; color: #555; }
header .menu li a p { display: inline-block; }
header .menu li a i { display: inline-block; width: 25px; height: 25px; margin-right: 5px; }
header .menu li a:hover { color: #f00; }
/*header .menu li:nth-child(1) i { background: url(../images/icon.png) no-repeat 0px 0px; }
header .menu li:nth-child(2) i { background: url(../images/icon.png) no-repeat 0px -25px; }
header .menu li:nth-child(3) i { background: url(../images/icon.png) no-repeat 0px -50px; }
header .menu li:nth-child(4) i { background: url(../images/icon.png) no-repeat 0px -75px; }
header .menu li:nth-child(5) i { background: url(../images/icon.png) no-repeat 0px -100px; }
header .menu li:nth-child(6) i { background: url(../images/icon.png) no-repeat 0px -125px; }
header .menu li:nth-child(7) i { background: url(../images/icon.png) no-repeat 0px -150px; }
header .menu li:nth-child(1) a:hover i { background: url(../images/icon.png) no-repeat -25px 0px; }
header .menu li:nth-child(2) a:hover i { background: url(../images/icon.png) no-repeat -25px -25px; }
header .menu li:nth-child(3) a:hover i { background: url(../images/icon.png) no-repeat -25px -50px; }
header .menu li:nth-child(4) a:hover i { background: url(../images/icon.png) no-repeat -25px -75px; }
header .menu li:nth-child(5) a:hover i { background: url(../images/icon.png) no-repeat -25px -100px; }
header .menu li:nth-child(6) a:hover i { background: url(../images/icon.png) no-repeat -25px -125px; }
header .menu li:nth-child(7) a:hover i { background: url(../images/icon.png) no-repeat -25px -150px; }*/

header .menu li a i.icon1 { background: url(../images/icon.png) no-repeat 0px 0px; }
header .menu li a i.icon2 { background: url(../images/icon.png) no-repeat 0px -25px; }
header .menu li a i.icon3 { background: url(../images/icon.png) no-repeat 0px -50px; }
header .menu li a i.icon4 { background: url(../images/icon.png) no-repeat 0px -75px; }
header .menu li a i.icon5 { background: url(../images/icon.png) no-repeat 0px -100px; }
header .menu li a i.icon6 { background: url(../images/icon.png) no-repeat 0px -125px; }
header .menu li a i.icon7 { background: url(../images/icon.png) no-repeat 0px -150px; }
header .menu li a:hover > i.icon1 { background: url(../images/icon.png) no-repeat -25px 0px; }
header .menu li a:hover > i.icon2 { background: url(../images/icon.png) no-repeat -25px -25px; }
header .menu li a:hover > i.icon3 { background: url(../images/icon.png) no-repeat -25px -50px; }
header .menu li a:hover > i.icon4 { background: url(../images/icon.png) no-repeat -25px -75px; }
header .menu li a:hover > i.icon5 { background: url(../images/icon.png) no-repeat -25px -100px; }
header .menu li a:hover > i.icon6 { background: url(../images/icon.png) no-repeat -25px -125px; }
header .menu li a:hover > i.icon7 { background: url(../images/icon.png) no-repeat -25px -150px; }

header .mobile-close { display: none; width: 100%; padding: 1% 3%; text-align: center; background: #333; color: #fff; font-size: 18px; }
header .mobile-close i { margin-right: 10px; font-size: 24px; vertical-align: middle; }
header .mobile-close b { display: inline-block; vertical-align: middle; }

.Mobile { display: none; width: 100%; position: relative; height: 100px; z-index: 200; border-top: 5px solid #ccc; border-bottom: 2px solid #e60012; }
.Mobile .logo { width: 23%; display: block; padding: 10px 0 0 10px; }
.Mobile .searchBtn { position: absolute; top: 28px; right: 12%; z-index: 101; font-size: 32px; color: #999; }
.Mobile .menuBtn { width: 40px; position: absolute; top: 25px; right: 5%; z-index: 101; transition: top 300ms; }
.Mobile .menuBtn span, .Mobile .menuBtn:before, .Mobile .menuBtn:after { display: block; content: ""; transition: all 300ms; background-color: #999; margin: 7px; width: 26px; height: 4px; text-indent: -100%; overflow: hidden; white-space: nowrap; }
.Mobile .active { transform: rotate(180deg); }
.Mobile .active span { background-color: transparent; box-shadow: none; }
.Mobile .active:before, .Mobile .active:after { background-color: #999; }
.Mobile .active:before { transform: translateY(11px) rotate(-45deg); }
.Mobile .active:after { transform: translateY(-11px) rotate(45deg); }
.Mobile ul { display: block; width: 100%; position: absolute; top: 95px; background: rgba(203, 0, 18, 0.9); }
.Mobile ul li { width: 100%; text-align: center; border-bottom: 1px solid #fff; }
.Mobile ul li a { color: #fff; display: block; padding: 15px 5px; }
.Mobile ul li a img { display: inline-block; vertical-align: middle; margin-right: 5px; }
.Mobile ul li a p { display: inline-block; vertical-align: middle; color: #fff; font-size: 16px; font-weight: bold; }
.Mobile ul li a:hover { background: #06c; }

.mobile-down { top: 0; }

.mobile-up { top: -100%; }

.M-Side { display: none; }

.Side { width: 240px; float: left; }
.Side .pro-menu { display: block; width: 100%; min-height: 390px; background: url(../images/side-bg.jpg) repeat; position: relative; z-index: 20; padding: 15px 0; }
.Side .pro-menu li { display: block; line-height: 30px; }
.Side .pro-menu > li:nth-child(-n+3) > a { background:#ec3235; color: #fff;}
.Side .pro-menu li > a { display: block; font-size: 14px; color: #555; padding: 0 20px; }
.Side .pro-menu li > a:hover { color: #fff; background: rgba(0, 0, 0, 0.3); }
.Side .pro-menu li div { position: absolute; top: 0; left: 100%; background: #fff; width: 400%; border: 1px solid #ccc; display: none; min-height: 389px; }
.Side .pro-menu li div img { display: inline-block; vertical-align: top; max-height: 388px; }
.Side .pro-menu li div ul { display: inline-block; width: calc(100% - 204px); vertical-align: top; }
.Side .pro-menu li div ul li { display: inline-block; width: calc(25% - 4px); padding: 2%; vertical-align: top; line-height: 20px; }
.Side .pro-menu li div ul li span { display: block; font-weight: bold; border-left: 5px solid #e60012; color: #000; font-size: 14px; line-height: 14px; padding-left: 5px; margin: 0 0 5px 5px; }
.Side .pro-menu li div ul li a { display: inline-block; color: #999; font-size: 13px; margin: 0 5px; padding: 0; }
.Side .pro-menu li:hover div { display: block; }
.Side .ad { display: block; margin: 20px 0; }
.Side .ad a { display: block; margin: 10px 0; }
.Side .ad a:hover { opacity: .7; }
.Side .new-pro-title { font-size: 16px; font-weight: bold; color: #000; padding-bottom: 1px; border-bottom: 3px solid #ec3235; display: inline-block; }
.Side .list-rank { width: 100%; display: block; margin-top: 10px; background: url(../images/side-shadow.jpg) no-repeat right top; }
.Side .list-rank li { width: 100%; display: block; margin: 10px auto; }
.Side .list-rank a { width: 100%; display: block; }
.Side .list-rank a img { max-width: 30%; display: block; float: left; border: 1px solid #CCC; margin: 5px 0 0 0px; }
.Side .list-rank a span { width: 60%; display: block; float: left; margin: 10px 0 0 10px; position: relative; font-size: 13px; line-height: 20px; }
.Side .list-rank a span i { color: #bc60a1; }
.Side .list-rank a span p { color: #555; }
.Side .list-rank a span b { color: #c00; }
.Side .list-rank a:hover img { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; }
.Side .list-rank a:hover span i { color: #06c; }
.Side .list-rank a:hover span p { color: #06c; }
.Side .list-rank a:hover span b { color: #06c; }
.Side .more { color: #fff; background: #ec3235; font-size: 13px; padding: 0 10px 0 7px; }
.Side .more i { vertical-align: middle; }
.Side .more:hover { background: #06c; }
.Side .list-menu { width: 100%; background: #e13033; padding: 15px 0; }
.Side .list-menu li { display: block; }
.Side .list-menu li a { display: block; color: #fff; position: relative; padding: 2px 0 2px 15px; }
.Side .list-menu li a:hover { background: #06c; }
.Side .list-menu li a:hover:after { content: "◆"; position: absolute; right: -10px; color: #fff; font-size: 30px; }

.Mobile-Ad { display: none; width: 96%; margin: 0 auto; padding: 0 0 5% 0; border-top: 3px solid #ec3235; }
.Mobile-Ad .ad { display: block; margin: 20px 0; text-align: center; }
.Mobile-Ad .ad a { display: block; margin: 10px 0; }
.Mobile-Ad .ad a:hover { opacity: .7; }
.Mobile-Ad .new-pro-title { font-size: 16px; font-weight: bold; color: #fff; padding: 3px; background: #ec3235; display: block; text-align: center; }
.Mobile-Ad .list-rank { width: 100%; display: block; margin-top: 10px; }
.Mobile-Ad .list-rank li { width: 100%; display: block; margin: 10px auto; }
.Mobile-Ad .list-rank a { width: 100%; display: block; }
.Mobile-Ad .list-rank a img { max-width: 40%; display: block; float: left; border: 1px solid #CCC; margin: 5px 0 0 0px; }
.Mobile-Ad .list-rank a span { width: 55%; display: block; float: left; margin: 10px 0 0 5%; position: relative; font-size: 15px; line-height: 30px; }
.Mobile-Ad .list-rank a span i { color: #bc60a1; }
.Mobile-Ad .list-rank a span p { color: #555; }
.Mobile-Ad .list-rank a span b { color: #c00; }
.Mobile-Ad .list-rank a:hover img { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; }
.Mobile-Ad .list-rank a:hover span i { color: #06c; }
.Mobile-Ad .list-rank a:hover span p { color: #06c; }
.Mobile-Ad .list-rank a:hover span b { color: #06c; }
.Mobile-Ad .more { color: #fff; background: #ec3235; font-size: 13px; padding: 0 10px 0 7px; display: block; text-align: center; }
.Mobile-Ad .more i { vertical-align: middle; }
.Mobile-Ad .more:hover { background: #06c; }

.BannerIndex { width: 100%; margin: 0 auto; display: block; position: relative; }
.BannerIndex #abgne_fade_pic { position: relative; width: 100%; }
.BannerIndex #abgne_fade_pic .ad { position: absolute; }
.BannerIndex #abgne_fade_pic .ad img { max-width: 100%; }
.BannerIndex #abgne_fade_pic .control { display: none; }

.BannerPro { width: 100%; margin: 0 auto; display: block; position: relative; }
.BannerPro #abgne_fade_pic { position: relative; width: 100%; height: 0; padding-bottom: 41.666%; }
.BannerPro #abgne_fade_pic .ad { position: absolute; }
.BannerPro #abgne_fade_pic .ad img { max-width: 100%; }
.BannerPro #abgne_fade_pic .control { display: none; }

.Banner { width: 100%; max-height: 350px; margin: 0 auto; display: block; position: relative; }
.Banner .adbanner { float: left; width: 68.085106%; }
.Banner #abgne_fade_pic { position: relative; width: 100%; }
.Banner #abgne_fade_pic .ad { position: absolute; }
.Banner #abgne_fade_pic .ad img { max-width: 100%; }
.Banner #abgne_fade_pic .control { display: none; }
.Banner .adbox { float: right; width: 29.787%; }

.slideBox { width: 100%; position: relative; }
.slideBox .bd { position: relative; height: 100%; z-index: 0; }
.slideBox .bd li { zoom: 1; vertical-align: middle; }
.slideBox .prev, .slideBox .next { position: absolute; left: 1%; top: 50%; margin-top: -25px; display: block; font-size: 50px; filter: alpha(opacity=50); opacity: 0.5; color: #000; }
.slideBox .next { left: auto; right: 1%; }
.slideBox .prev:hover, .slideBox .next:hover { filter: alpha(opacity=100); opacity: 1; }
.slideBox .prevStop { display: none; }
.slideBox .nextStop { display: none; }

.Index .Side { width: 265px; }
.Index .Side .pro-menu li div { width: 353%; }
.Index .Text { display: block; float: left; width: calc( 100% - 265px); margin-left: 0px; position: relative; padding-bottom: 5%; }

.Tool { display: block; width: 100%; }
.Tool .news { display: block; width: 80%; margin: 0 auto 30px auto; background: url(../images/sub.jpg) no-repeat; padding: 2% 0 0 20%; color: #746969; }
.Tool .news b { font-size: 16px; font-weight: bold; margin-right: 5px; }
.Tool .leftbox { width: 100%; overflow: hidden; position: relative; margin: 2% auto; }
.Tool .picScroll { display: block; width: 90%; margin: 1% auto; }
.Tool .picScroll .bd ul { width: 100%; float: left; }
.Tool .picScroll .bd li { width: 25%; float: left; }
.Tool .picScroll .bd li img { background: url(../images/loading.gif) #fff center center no-repeat; }

.Tool .picScroll .bd .prev { position: absolute; left: -5%; top: 50%; transform: translateY(-50%); cursor: pointer; }
.Tool .picScroll .bd .next { position: absolute; right: -5%; top: 50%; transform: translateY(-50%); cursor: pointer; z-index: 1;}
.Tool .picScroll .bd span { font-size: 36px; z-index: 1;}

.Tool .picScroll .hd { display: block; }
.Tool .picScroll .hd ul { display: none; }
/*.Tool .picScroll .hd .prev { position: absolute; left: 1%; top: 39%; cursor: pointer; }*/
/*.Tool .picScroll .hd .next { position: absolute; right: 1%; top: 39%; cursor: pointer; }*/


.Tool .member-login { border: none; width: 23%; margin: 0 auto; float: right; }
.Tool .member-login .loginbox { width: 100%; margin: 0px auto; }
.Tool .member-login .loginbox span:nth-of-type(4) { padding-right: 40px; }

.Products { display: block; margin-top: 20px; }
.Products .btn-nav { display: block; border-top: 2px solid #999; border-bottom: 1px solid #ccc; }
.Products .btn-nav p { color: #fff; padding: 8px 30px 8px 60px; display: inline-block; font-size: 16px; font-weight: bold; background: #ec3235 url(../images/new.png) no-repeat 30px 7px; vertical-align: top; }
.Products .tabs { display: inline-block; overflow: hidden; width: calc(100% - 158px); vertical-align: top; }
.Products .tabs li { display: inline-block; margin: 0; padding: 0; }
.Products .tabs li a { padding: 8px 25px 8px 25px; display: block; color: #555; font-weight: bold; }
.Products .tabs li a:hover { color: #555; background: #f2f2f2; }
.Products .tabs li.active a { color: #555; background: #f2f2f2; }
.Products .tab_container { width: 100%; display: block; padding: 2% 0; }
.Products .tab_content { width: 100%; overflow: hidden; }
.Products .new-prolist { display: block; }
.Products .new-prolist li { display: inline-block; width: calc(25% - 4px); padding: 1.5%; margin-bottom: 0%; vertical-align: top; }
.Products .new-prolist li div { padding: 3%; background: #fff; min-height: 300px; }
.Products .new-prolist li div p { color: #555; text-align: left; }
.Products .new-prolist li div > a { display: block; }
.Products .new-prolist li div a:hover { opacity: .7; }
.Products .new-prolist li div a:hover p { color: #f00; }
.Products .new-prolist li div span { display: block; margin-top: 5px; }
.Products .new-prolist li div span del { float: left; color: #999; font-size: 12px; }
.Products .new-prolist li div span b { float: left; color: #c00; font-size: 12px; margin-left: 5px; }
.Products .new-prolist li div span a { float: right; color: #999; display: inline-block; margin: 0 5px; }
.Products .newbox .leftbox { float: left; display: block; width: 48%; }
.Products .newbox .leftbox .pic { float: left; display: block; width: 60%; }
.Products .newbox .leftbox .wd { float: left; display: block; width: 38%; margin-left: 2%; }
.Products .newbox .leftbox .wd > b { font-weight: bold; font-size: 16px; }
.Products .newbox .leftbox .wd > i { display: inline-block; padding: 2px 10px; margin: 10px 0; color: #fff; background: #ec3235; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }
.Products .newbox .leftbox .wd p { font-size: 13px; color: #777; display: block; }
.Products .newbox .leftbox .wd span { display: block; margin-top: 10px; }
.Products .newbox .leftbox .wd .price { color: #f00; font-size: 12px; }
.Products .newbox .leftbox .wd .price b { font-size: 20px; margin-left: 5px; font-weight: bold; }
.Products .newbox .leftbox .wd .link a { color: #999; padding: 5px 10px; border: 1px solid #999; display: inline-block; }
.Products .newbox .leftbox .wd .link a:hover { color: #f00; border: 1px solid #f00; }
.Products .newbox .leftbox .wd .link i { margin-right: 5px; }
.Products .newbox .list { display: block; float: right; width: 50%; }
.Products .newbox .list li { width: calc(25% - 4px); padding: 0 4px; margin-bottom: 2%; text-align: center; display: inline-block; vertical-align: top; }
.Products .newbox .list li .img { display: block; position: relative; width: 130px; height: 130px; background: #ccc; margin: 0 auto; }
.Products .newbox .list li .img span { display: block; width: 100%; height: 0; padding-bottom: 100%; background: rgba(236, 50, 53, 0.8); position: absolute; z-index: 10; text-align: center; opacity: 0; border: 1px solid #ccc; }
.Products .newbox .list li .img span a { color: #fff; font-size: 24px; margin: 40% 2% 0 2%; display: inline-block; }
.Products .newbox .list li .img span a:hover { color: #000; }
.Products .newbox .list li .img:hover span { opacity: 1; }
.Products .newbox .list li .img img { max-height: 130px; }
.Products .newbox .list li > a { color: #000; display: block; text-align: left; }
.Products .newbox .list li > a:hover { color: #f00; }
.Products .newbox .list li b { font-size: 12px; color: #f00; }

hr.style-two { margin: 30px 0; clear: both; }

.picScroll-list { display: block; margin: 30px auto; position: relative; }
.picScroll-list > a { color: #666; }
.picScroll-list > a:hover { color: #06c; }
.picScroll-list .prev { font-size: 30px; position: absolute; left: 0px; top: 35%; z-index: 20; }
.picScroll-list .next { font-size: 30px; position: absolute; right: 0px; top: 35%; z-index: 20; }
.picScroll-list .picList { width: 90%; margin: 0px auto; }
.picScroll-list .picList ul { overflow: hidden; zoom: 1; }
.picScroll-list .picList li { float: left; width: 33.3%; _display: inline; overflow: hidden; }
.picScroll-list .picList li a { display: block; }
.picScroll-list .picList li a img { display: inline-block; width: calc(30% - 4px); vertical-align: top; }
.picScroll-list .picList li a span { display: inline-block; width: calc(70% - 14px); margin-left: 10px; vertical-align: top; }
.picScroll-list .picList li a span b { color: #000; }
.picScroll-list .picList li a span time { color: #999; margin-right: 10px; }
.picScroll-list .picList li a span p { color: #999; font-size: 12px; line-height: 18px; }

.index-smallpic-list { display: block; width: 90%; margin: 1% auto;  }
.index-smallpic-list a { display: block; margin: 10px 0; }
.index-smallpic-list a:hover { opacity: .7; }
.index-smallpic-list .prev { position: absolute; left: -5%; top: 50%; transform: translateY(-50%); cursor: pointer; }
.index-smallpic-list .next { position: absolute; right: -5%; top: 50%; transform: translateY(-50%); cursor: pointer; z-index: 1;}
.index-smallpic-list span{font-size: 36px;z-index: 1;}

.Product-List { background: #f2f2f2; text-align: center; padding-bottom: 5%; }
.Product-List > p { border-top: 10px solid #ec3235; font-weight: bold; padding-top: 10px; font-size: 18px; color: #000; display: inline-block; }
.Product-List ul { display: block; }
.Product-List ul li { display: inline-block; width: calc(20% - 4px); padding: 1.5%; margin-bottom: 0%; vertical-align: top; }
.Product-List ul li div { padding: 3%; background: #fff; }
.Product-List ul li div.pic{ height: 0;padding:0 0 100% 0; text-align: center;position:relative;margin-bottom: 10px;}
.Product-List ul li div p { color: #555; text-align: left;line-height:20px;height: 40px;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.Product-List ul li div > a { display: block; }
.Product-List ul li div a:hover { opacity: .7; }
.Product-List ul li div a:hover p { color: #f00; }
.Product-List ul li div span { display: block; margin-top: 5px; }
.Product-List ul li div span del { float: left; color: #999; font-size: 12px; }
.Product-List ul li div span b { float: left; color: #c00; font-size: 12px; margin-left: 5px; }
.Product-List ul li div span a { float: right; color: #999; display: inline-block; margin: 0 5px; }
.Product-List ul li div.pic img { /*max-height: 200px; object-fit: fill;*/position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;max-height:100%;max-width: 100%; }

.Product-List-New { background: #f2f2f2; text-align: center; padding-bottom: 2%; }
.Product-List-New > p { border-top: 10px solid #ec3235; font-weight: bold; padding-top: 10px; font-size: 18px; color: #000; display: inline-block; }
.Product-List-New ul { display: block; }
.Product-List-New ul li { display: inline-block; width: calc(25% - 4px); padding: 1.5%; margin-bottom: 0%; vertical-align: top; }
.Product-List-New ul li div {background: #fff;padding: 3%; }
.Product-List-New ul li div.pic { height: 0;padding:0 0 100% 0; text-align: center;position:relative;margin-bottom: 10px;}
.Product-List-New ul li div p { color: #555; text-align: left;line-height:20px;height: 40px;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2; }
.Product-List-New ul li div > a { display: block; }
.Product-List-New ul li div a:hover { opacity: .7; }
.Product-List-New ul li div a:hover p { color: #f00; }
/*.Product-List-New ul li div span { display: block; margin-top: 5px; }
.Product-List-New ul li div span del { float: left; color: #999; font-size: 12px; }
.Product-List-New ul li div span b { float: left; color: #c00; font-size: 12px; margin-left: 5px; }
.Product-List-New ul li div span a { float: right; color: #999; display: inline-block; margin: 0 5px; }*/
.Product-List-New ul li div span { display: block; margin-top: 5px; text-align: left;position:relative;}
.Product-List-New ul li div span del {color: #999; font-size: 12px;margin-right: 5px;display:inline-block;}
.Product-List-New ul li div span b { color: #c00; font-size: 12px; display:block;}
.Product-List-New ul li div span a {color: #999; display: inline-block; margin: 0 5px;position:absolute;right: 0;bottom:0; }
.Product-List-New ul li div.pic img { /*max-height: 200px; object-fit: fill;*/ position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;max-height:100%;max-width: 100%;}

/*-- POPNEWS --*/
.popAD { width: 80%; background: #fff; position: absolute; left: 10%; top: 5%; z-index: 500; display: none; }

.popMask { width: 100%; display: block; position: absolute; z-index: 499; background: rgba(0, 0, 0, 0.6); }

.poptext { display: block; text-align: center; overflow: auto; position: relative; }

.poptext img { max-width: 100%; }

.popclose { width: 23px; height: 22px; display: block; position: absolute; top: 0px; right: 0; z-index: 499; }

.popclose a { width: 23px; height: 22px; display: block; background: url(../images/delete_btn.png) no-repeat; }

.popclose a:hover { background: url(../images/delete_btn.png) no-repeat 0 -22px; }

.member-login { border: 10px solid #ee3233; width: 430px; background: #fff; margin: 5% auto; position: absolute; z-index: 500; left: calc(50% - 215px); top: -100%; }
.member-login .loginbox { width: 240px; margin: 30px auto; }
.member-login .loginbox .title { display: block; }
.member-login .loginbox .title li { float: left; display: block; line-height: 20px; padding: 0 5px; }
.member-login .loginbox .title li p { font-size: 16px; font-weight: bold; }
.member-login .loginbox .title li i { font-size: 12px; color: #999; }
.member-login .loginbox .title li a { color: #555; }
.member-login .loginbox .title li a:hover { color: #f00; }
.member-login .loginbox span { display: block; margin: 10px 0; }
.member-login .loginbox span input { width: 200px; margin-left: 10px; padding: 3px; }
.member-login .loginbox span:nth-of-type(3) img { vertical-align: middle; margin-left: 10px; }
.member-login .loginbox span:nth-of-type(3) input { width: 85px; }
.member-login .loginbox span:nth-of-type(4) { text-align: right; padding-right: 3px; }
.member-login .loginbox span:nth-of-type(4) button { color: #fff; background: #000; padding: 5px 15px; border: none; cursor: pointer; }
.member-login .loginbox span:nth-of-type(4) button:hover { background: #c00; }
.member-login .loginbox .close { position: absolute; top: 10px; right: 10px; }
.member-login .loginbox .close i { font-size: 30px; color: #000; }
.member-login .loginbox .close i:hover { color: #f00; }

.member-mask { display: none; width: 100%; height: 0; padding-bottom: 100%; background: rgba(0, 0, 0, 0.5); position: absolute; z-index: 399; }

.member-down { top: 200px; }

.member-up { top: -100%; }

footer { display: block; width: 100%; border-top: 5px solid #ec3235; padding-bottom: 5%; }
footer .info { float: left; width: 70%; display: block; }
footer .info .menu { width: 100%; border-right: 20px solid #ec3235; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; display: block; }
footer .info .menu li { display: inline-block; width: calc(12.5% - 4px); text-align: center; line-height: 74px; }
footer .info .menu li a { color: #555; }
footer .info .menu li a:hover { color: #c00; }
footer .info .link { width: 100%; display: block; text-align: right; padding: 2% 7% 0 0; }
footer .info .link li { display: inline-block; margin: 0 10px; }
footer .info .link li a:hover { opacity: .7; }
footer .Information { float: left; width: 30%; display: block; padding: 2% 0 0 2.5%; }
footer .Information span { font-size: 13px; display: block; }
footer .Information span a { color: #c00; }
footer .Information span a:hover { color: #06c; }
footer .IwareFoot { font-size: 12px; color: #ddd; text-align: center; display: block; clear: both; }
footer .IwareFoot a { color: #ddd; }

@media (max-width: 1024px) { header .search .searchbox select { width: 95px; }
  header .search .searchbox input { width: 70px; }
  header .menu li { text-align: center; }
  .Side .pro-menu li div { width: 280%; }
  .Tool .news { width: 96%; padding: 2% 0 0 25%; }
  .Products .newbox .list li .img { width: 100px; height: 100px; }
  .Product-List ul li { width: calc(25% - 4px); padding: 1%; } }
@media (max-width: 768px) { header { width: 100%; padding: 2%; background: #ec3235; position: absolute; z-index: 400; top: -100%; }
  header .logo { display: none; }
  header .search { float: none; width: 100%; margin: 0; }
  header .search .keyword { width: 100%; display: block; }
  header .search .keyword p { color: #fff; }
  header .search .keyword input { border: none; }
  header .search .searchbox { width: 100%; display: inline-block; padding: 0px; margin: 10px 0; background-image: none; }
  header .search .searchbox b { color: #fff; display: block; margin-top: 10px; }
  header .search .searchbox b:nth-of-type(2) { margin-left: 0px; }
  header .search .searchbox select { margin: 0 5px 10px 0; width: 140px; }
  header .search .searchbox button { color: #fff; }
  header .search .textbox { display: none; }
  header .search .phone-word{display: block;}
  header .menu { display: none; }
  header .mobile-close { display: block; }
  .Desktop { display: none; }
  .Mobile { display: block; }
  .M-Side { width: 100%; display: block; }

  .index-smallpic-list{width: calc(100% - 60px); margin: 30px auto;}
  .index-smallpic-list .prev{left: -35px;}
  .index-smallpic-list .next{right: -35px;}

  .M-Side .M-menu-btn { width: 100%; background: #e60012; color: #fff; padding: 5px 20px; display: block; cursor: pointer; overflow: hidden; }
  .M-Side .M-menu-btn p { display: block; float: left; }
  .M-Side .M-menu-btn i { float: right; display: block; margin: 5px 0 0 0; }
  .M-Side .pro-menu { display: block; width: 100%; background: url(../images/side-bg.jpg) repeat; }
  .M-Side .pro-menu > li:nth-child(-n+3) > a { background: #fbd9d9;;}
  .M-Side .pro-menu li { display: block; line-height: 30px; }
  .M-Side .pro-menu li > a { display: block; font-size: 14px; color: #555; padding: 5px 20px; }
  .M-Side .pro-menu li > a:hover { color: #fff; background: rgba(0, 0, 0, 0.3); }
  .M-Side .pro-menu li div { background: #fff; width: 100%; }
  .M-Side .pro-menu li div ul { display: block; width: 100%; }
  .M-Side .pro-menu li div ul li { display: block; width: 100%; padding: 2%; vertical-align: top; line-height: 20px; border-bottom: 1px dotted #ccc; }
  .M-Side .pro-menu li div ul li span { display: block; font-weight: bold; border-left: 5px solid #e60012; color: #000; font-size: 14px; line-height: 14px; padding-left: 5px; margin: 0 0 5px 5px; }
  .M-Side .pro-menu li div ul li a { display: inline-block; color: #999; margin: 0 5px; padding: 5px; }
  .Index .Side { display: none; }
  .Index .Text { float: none; width: 100%; padding: 0; }
  .Tool .news { width: 96%; margin: 0 auto; padding: 2% 0 0 35%; background: url(../images/sub.jpg) no-repeat left center; }
  .Tool .news b { font-size: 16px; font-weight: bold; margin-right: 5px; }
  .Tool .leftbox { float: none; width: 100%; }
  .Tool .member-login { width: 100%; margin: 0 auto; float: none; }
  .Tool .member-login .loginbox { width: 240px; margin: 20px auto; }
  /*.Tool .picScroll .bd li { width: 33.3%; }*/
  .Tool .picScroll{width: calc(100% - 60px); margin: 30px auto;}
  .Tool .picScroll .bd .prev{left: -35px;}
  .Tool .picScroll .bd .next{right: -35px;}

  .Tool .picScroll .hd .prev { left: 0%; top: 39%; }
  .Tool .picScroll .hd .next { right: 0%; top: 39%; }
  .Products .btn-nav { border-top: 2px solid #999; border-bottom: 1px solid #ccc; }
  .Products .btn-nav p { display: block; }
  .Products .tabs { display: block; width: 100%; }
  .Products .newbox .leftbox { float: none; width: 96%; margin-left: 2%; }
  .Products .newbox .list { width: 99%; margin: 5% 0.5%; }
  .Products .newbox .list li .img { width: 100%; height: 100%; }
  .Products .newbox .list li .img span { display: none; }
  .Products .newbox .picScroll-list .picList li { width: 50%; }
  .Product-List ul li { width: calc(33.3% - 4px); padding: 1%; }
  .Product-List-New ul li { width: calc(33.3% - 4px); padding: 1%; }
  .picScroll-list .picList li { width: 50%; }
  .Products .new-prolist li { width: calc(33.3% - 4px); padding: 1%; }
  footer .info { float: none; width: 100%; }
  footer .info .menu { border-right: none; border-left: none; }
  footer .info .menu li { line-height: 36px; }
  footer .info .menu li a:hover { color: #c00; }
  footer .info .link { text-align: center; padding: 2% 0 0 0; }
  footer .Information { float: none; width: 100%; padding: 2%; text-align: center; }
  footer .Information span { display: inline-block; } }
@media (max-width: 640px) { .Mobile .searchBtn { right: 15%; }
  .Tool .picScroll .bd li { width: 50%; }
  .picScroll-list .picList li { width: 100%; }
  .Products .newbox .list li { width: calc(33.3% - 4px); }
  .Product-List ul li { width: calc(50% - 4px); padding: 1%; }
  .Product-List-New ul li { width: calc(50% - 4px); padding: 1%; }
  .Products .new-prolist li { width: calc(50% - 4px); padding: 1%; } }
@media (max-width: 480px) { .Mobile .searchBtn { right: 16%; }
  .Mobile .logo { width: 33%; }
  footer .info .menu { display: none; }
  .Side .ad { display: none; }
  .Tool .news { width: 96%; padding: 3% 0 0 5%; background: none; }
  .Tool .picScroll { width: 85%; }
  .Products .newbox .leftbox .pic { width: 100%; }
  .Products .newbox .leftbox .wd { width: 100%; margin-left: 0%; }
  .Products .newbox .picScroll-list .picList li { width: 100%; }
  .Products .newbox .list li { width: calc(50% - 4px); }
  .Product-List ul li { width: calc(50% - 4px); padding: 1%; }
  .picScroll-list .picList li { width: 100%; } }
@media (max-width: 414px) { .Mobile .logo { width: 35%; }
  .Mobile .searchBtn { right: 18%; }
  .picScroll-list .picList { width: 85%; } }
@media (max-width: 375px) { .Mobile .logo { width: 38%; }
  .Mobile .searchBtn { right: 20%; }
  .Product-List ul li { width: 100%; padding: 2%; }
  .Product-List-New ul li { width: 100%; padding: 2%; } }
@media (max-width: 320px) { .Mobile .logo { width: 43%; }
  .Mobile .searchBtn { right: 22%; }
  .Tool .picScroll { width: 80%; }
  .Tool .picScroll .bd li { width: 100%; }
  .picScroll-list .picList { width: 80%; } }

/*# sourceMappingURL=style-index.css.map */


.Products-detail .Word .price .priceSuperText{
	display: block;
}