/*
@Description: 商城手机频道
@author: 李月
@update: 2015-09-17
*/

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;}
body {font:12px/1.5 Arial; color:#333;}
select,input,button {vertical-align:middle;font-size:100%;}
ul,ol {list-style:none;}
fieldset,img {border:0;}
em {font-style:normal;}
.clearfix:after {content:"."; display: block; visibility: hidden; clear: both; height:0; font-size:0}
.clearfix {*zoom:1}

/*global*/
a{ color:#134ba0; text-decoration:none;}
a:hover{ color:#c00; text-decoration:underline;}

.wrapper{ width:1200px; margin:0 auto;}
.nav-box{ padding:0 0 4px 200px; border-bottom:0 none;}

/* 焦点图 */
.focus-box{ position:relative; zoom:1; margin:0 auto; width:1200px; height:360px;}
.focus-inner{ position:relative; zoom:1; width:1200px; height:360px; overflow:hidden;}
.focus-inner ul{ position:absolute; top:0; left:0; width:1000%; height:360px;}
.focus-inner li{ float:left; width:1200px; height:360px;}
.focus-inner img{ display:block;}
.focus-switch{ position:absolute; bottom:10px; left:0; width:1200px; height:18px; text-align:center;}
.focus-switch span{ display:inline-block; margin:0 1px; width:18px; height:18px; font:12px/18px arial; text-align:center; color:#fff; background:rgba(0,0,0,0.6); filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#99000000,endcolorstr=#99000000,gradientType=1); -moz-border-radius:9px; -webkit-border-radius:9px; border-radius:9px; cursor:pointer;}
:root .focus-switch span{ filter:none;}
.focus-switch .current{ background:#c40000;}

.screen-layer{ position:relative; zoom:1; width:1200px; margin:0 auto;}
.nav-classify{ position:absolute; top:-360px; left:0; overflow:hidden; zoom:1; width:200px; height:360px; background:rgba(0,0,0,0.8); filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#cc000000,endcolorstr=#cc000000,gradientType=1);}
.nav-classify dl{ margin:-1px 15px 0; padding:15px 0; border-top:1px dotted #435563;}
.nav-classify dt{ font:14px/28px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; color:#fff;}
.nav-classify dd{ position:relative; margin:0 -7px; font:12px/24px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1";; color:#6b767f;}
.nav-classify dd a{ display:inline-block; margin:0 7px; color:#e0e2e3;}
.nav-classify dd a:hover{ color:#e0e2e3;}
.screen-layer .right-banner{ position:absolute; top:-360px; right:0;}
.screen-layer .right-banner img{ display:block;}

.section{ margin:30px 0 0;}
.main-title{ float:left; font:24px/44px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1";}
.section-hd .subtitle{ float:left; padding:4px 0 0 15px; font:18px/40px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; color:#666;}
.section-hd .more{ float:right; padding:8px 0 0 50px; font:bold 14px/36px "SimSun"; color:#ccc;}
.section-hd .more a{ margin:0 5px 0 0; font-family:"Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; font-weight:normal; color:#333;}
.section-hd .more a:hover{ color:#c00;}
.section-hd .links{ float:right; padding:6px 0 0 15px; font:16px/38px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1";}
.section-hd .links a{ margin:0 0 0 50px; color:#333;}
.section-hd .links a:hover{ color:#c00;}

/* 明星单品 */
.star-item-list{ border:1px solid #f0f0f0;}
.star-item-list li{ float:left; position:relative; zoom:1; margin:0 -1px; padding:19px 20px 17px; width:200px; border-left:1px solid #f0f0f0;}
.star-item-list .pic{ color:#333;}
.star-item-list .pic img{ display:block;}
.star-item-list .title{ display:block; padding:15px 0 0; width:200px; height:22px; font:bold 14px/22px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow:hidden; cursor:pointer;}
.star-item-list .pic:hover{ color:#c00; text-decoration:none;}
.star-item-list .price-bar{ height:40px; overflow:hidden; font:12px/40px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1";}
.star-item-list .price-bar .label{ float:left; margin:15px 10px 0 0; padding:0 2px; font:12px/15px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; background:#f33; color:#fff;}
.star-item-list .sale-price{ float:left; height:40px; font:14px/40px Verdana; color:#f33;}
.star-item-list .sale-price em{ font-weight:bold; font-size:20px;}
.star-item-list .original-price{ float:left; padding:9px 0 0 10px; font:12px/30px Verdana; text-decoration:line-through; color:#999;}
.star-item-list .subtitle{ padding:0 0 3px; height:20px; font:12px/20px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; color:#f33;}
.star-item-list .corner-mark{ position:absolute; top:0; left:0; padding:6px 0 0; width:40px; height:37px; font:14px/22px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; color:#fff; text-align:center; background:url(http://icon.zol-img.com.cn/newshop/shop/mobile/corner_mark.png) no-repeat; _background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=scale , src='http://icon.zol-img.com.cn/newshop/shop/mobile/corner_mark.png');}

/* 品牌精选 */
.brand-choice{ border:1px solid #f0f0f0;}
.brand-choice li{ float:left; width:398px; margin:0 0 0 -1px; border-left:1px solid #f0f0f0;}
.brand-choice .pic{ display:block; margin:20px auto; width:358px; height:180px;}
.brand-choice .pic img{ display:block;}
.brand-choice .list{ padding:0 0 10px; overflow:hidden; zoom:1;}
.brand-choice .list a{ float:left; margin:0 9px 0 20px; width:100px; color:#333;}
.brand-choice .list img{ display:block;}
.brand-choice .list span{ display:block; height:32px; overflow:hidden; font:12px/32px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; text-align:center;}
.brand-choice .list a:hover{ color:#c00;}
.brands-list{ margin:30px 0 0;}
.brands-list li{ float:left; margin:0 -1px; padding:1px; width:148px; height:76px; border:1px solid #f5f5f5;}
.brands-list .hover,.brands-list li:hover{ position:relative; z-index:2; border:2px solid #c40000; padding:0;}
.brands-list img{ display:block;}

.section-content{ border-top:2px solid #000;}
.main-figure{ float:left; width:240px; background:#f5f5f5;}
.main-figure img{ display:block;}
.filtrate{ padding:20px 0 0; height:289px; background:#f5f5f5;}
.filtrate .hd{ position:relative; zoom:1; margin:0 15px 9px; padding:9px 0 0; border-bottom:1px solid #e6e6e6;}
.filtrate .hd span{ position:absolute; top:0; left:50%; margin:-4px 0 0 -45px; padding:0 15px; font:20px/26px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; background:#f5f5f5;}
.filtrate .filter{ padding:15px 0 0;}
.filtrate .filter .title{ padding:0 15px; font:bold 14px/22px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; color:#666;}
.filtrate .filter .label{ padding:0 0 0 11px;}
.filtrate .filter .label a{ display:inline-block; margin:8px 4px 0; padding:0 10px; background:#fff; font:12px/26px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; color:#666; -moz-border-radius:20px; -webkit-border-radius:20px; border-radius:20px; white-space:nowrap;}
.filtrate .filter .label a:hover{ color:#c00; text-decoration:none;}

.figure-list{ float:left; width:720px;}
.figure-list li{ float:left; width:239px; height:307px; border-right:1px solid #f0f0f0; border-bottom:1px solid #f0f0f0;}
.figure-list li a{ display:block; position:relative; zoom:1; padding:20px 29px 0 30px; width:180px; height:287px;}
.figure-list img{ margin:0 auto; display:block;}
.figure-list .title{ display:block; padding:16px 0 0; height:40px; overflow:hidden; font:14px/20px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; color:#333; cursor:pointer;}
.figure-list .price{ display:block; height:36px; overflow:hidden; font:14px/36px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; color:#333;}
.figure-list .price em{ padding:0 0 0 3px; font-size:20px;}
.figure-list .mask{ display:none; position:absolute; top:0; left:0; padding:37px 20px 30px; width:199px; height:240px; background:rgba(255,255,255,0.9); filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#e6ffffff,endcolorstr=#e6ffffff,gradientType=1); cursor:pointer;}
.figure-list .mask h3{ padding:0 0 8px; font:bold 16px/22px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1";}
.figure-list .mask p{ font:14px/24px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1";}
.figure-list .mask .btn{ position:absolute; bottom:0; left:0; padding:11px 0; width:239px; height:22px; background:#000; text-align:center;}
.figure-list .mask .btn span{ display:inline-block; padding:0 30px 0 0; font:18px/22px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; color:#fff; background:url(http://icon.zol-img.com.cn/newshop/shop/mobile/btn.png) no-repeat 100% 0;}
.figure-list li a:hover{ color:#333; text-decoration:none;}
.figure-list li a:hover .mask{ display:block;}

.hot-sale-rank{ float:right; width:240px; background:#f5f5f5;}
.hot-sale-rank .hd{ padding:16px 0; font:18px/24px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; text-align:center;}
.rank-list{ padding:0 35px 4px;}
.rank-list li{ position:relative; zoom:1; padding:0 0 15px;}
.rank-list .n1{ position:absolute; top:22px; left:0; font:italic 16px/24px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1";}
.rank-list .pic{ position:relative; zoom:1; display:block; text-align:center; color:#333;}
.rank-list .pic img{ vertical-align:middle;}
.rank-list .title{ display:block; padding:10px 0 0; height:22px; overflow:hidden; font:14px/22px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; cursor:pointer;}
.rank-list .pic:hover{ color:#c00; text-decoration:none;}
.rank-list .price{ display:block; height:22px; overflow:hidden; font:14px/22px "Verdana"; text-align:center;}

/* 手机配件 */
.product-list li{ float:left; margin:0 -1px -1px; padding:20px 30px 0; width:180px; height:288px; border:1px solid #f0f0f0; background:#fff;}
.product-list li a{ color:#333;}
.product-list li a:hover{ color:#c00; text-decoration:none;}
.product-list .pic{ width:180px; height:180px; text-align:center; display:table-cell; vertical-align:middle; *display:block; *font-size:158px; *font-family:Arial; overflow:hidden;}
.product-list .pic img{ vertical-align:middle;}
.product-list .title{ display:block; padding:17px 0 0; height:40px; overflow:hidden; font:14px/20px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; cursor:pointer;}
.product-list .price-bar{ padding:5px 0 0; height:36px; overflow:hidden; font:14px/36px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1";}
.product-list .price-bar span{ font-size:20px;}

.banner{ margin:17px 0 0;}
.banner img{ display:block;}

.quick-nav{ position:fixed; top:50%; left:50%; _position:absolute; margin:-125px 0 0 -672px; z-index:1000;}
.quick-nav a{ display:block; margin:0 0 0 2px; padding:8px 8px 0; width:32px; height:40px; border:1px solid #f5f5f5; background:#f5f5f5; font:12px/16px "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1"; text-align:center; color:#333;}
.quick-nav a:hover,.quick-nav .current{ margin:0; border-left:3px solid #c40000; background:#fff; color:#333; text-decoration:none;}

.top-banner{ position:relative; zoom:1;}
.top-banner img{ display:block; width:100%; height:100%; max-width:1920px; background-position:50% 0; background-repeat:no-repeat;}
.top-banner .close{ position:absolute; top:0; left:50%; margin:0 0 0 -600px; width:1200px; height:50px;}
.top-banner .close i{ position:absolute; top:10px; right:10px; display:block; width:30px; height:30px; background:url(http://icon.zol-img.com.cn/newshop/shop/mobile/close.png) no-repeat; _background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=scale , src='http://icon.zol-img.com.cn/newshop/shop/mobile/close.png'); cursor:pointer;}