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{border:0;vertical-align:baseline;margin:0;padding:0;box-sizing: border-box;-webkit-box-sizing: border-box;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}/* body{line-height:1} */ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}
/* input[type="reset"]::-moz-focus-inner,input[type="button"]::-moz-focus-inner,input[type="submit"]::-moz-focus-inner,input[type="file"] > input[type="button"]::-moz-focus-inner{border:none;padding:0;} */
html,body, input, textarea, select, button {text-rendering: optimizeLegibility;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;-moz-font-feature-settings: "liga", "kern";}
textarea {resize:vertical;}
html,body {font: 14px/1.5 "Microsoft YaHei",Arial,Verdana,sans-serif; color:#3a4153; background:#fff;font-weight: 400;}
a {text-decoration:none;color:#000;outline: none}
a:hover {text-decoration:none; color:#f00;}
/* .clearfix:before,.clearfix:after,.container:before,.container:after,.row:before,.row:after ,.product-body:before,.product-body:after {clear: both;font-size:0; height: 0; line-height: 0;visibility: hidden;display: block;content: " ";} */
/* .clearfix:before, */.clearfix:after,/* .container:before, */.container:after,/* .panel-body:before,.panel-body:after, */ /* .row:before, */.row:after ,/* .product-body:before, */.product-body:after {clear: both;font-size:0; height: 0; line-height: 0;visibility: hidden;display: block;content: " ";}
.clearfix{zoom:1;}
.container {margin: 0 auto;}
@media (min-width: 768px) {
  .container {width: 98%;}
}
@media (min-width: 992px) {
  .container {width: 96%;}
}
@media (min-width: 1200px) {
  .container {width: 1200px; max-width: 1500px;}
}
.cell {display: table-cell; width: 9999px;table-layout:fixed;*display: inline-block; *width: auto;}
.disabled {text-decoration: line-through; color: #999 !important}
.border-box,textarea {box-sizing: border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
.line {margin-top: 10px; border-top: #ccc 1px solid; height: 10px; overflow: visible;}
/*
.clearfix:before,.clearfix:after,.container:before,.container:after, {display: table; content: " ";}
 .toggle:after {content: ''; display: inline-block; width: 6px; height: 6px; border: solid #333; border-width: 0 1px 1px 0; vertical-align: middle; margin-left: 7px;transition:transform .2s ease-in; transform: rotate(45deg); -webkit-transform: rotate(45deg);} */
.toggle:after {content: '\e603';font-family: "iconfont";font-size: 0.857rem;line-height: 24px;color: #888;vertical-align: 0;padding-left: 7px;}
/* .toggle:after {content: '◇';font-size: 0.714rem;line-height: 24px;color: #888;vertical-align: 0;padding-left: 7px;} */
/* .toggle:hover:after {border-width: 1px 0 0 1px; transform: rotate(45deg); -webkit-transform: rotate(45deg);} */
.ml5 {margin-left: 5px !important}.ml10 {margin-left: 10px !important}.ml15 {margin-left: 15px !important}.ml20 {margin-left: 20px !important}.ml30 {margin-left: 30px !important}
.mr5 {margin-right: 5px !important}.mr10 {margin-right: 10px !important}.mr15 {margin-right: 15px !important}.mr20 {margin-right: 20px !important}.mr30 {margin-right: 30px !important}
.mt5{margin-top:5px !important}.mt6{margin-top:6px !important}.mt8{margin-top:8px !important}.mt10{margin-top:10px !important}.mt20{margin-top:20px !important}.mt30{margin-top:30px !important}
.mb5{margin-bottom:5px !important}.mb6{margin-bottom:6px !important}.mb8{margin-bottom:8px !important}.mb10{margin-bottom:10px !important}.mb20{margin-bottom:20px !important}.mb30{margin-bottom:30px !important}
.pl5 {padding-left: 5px !important}.pl10 {padding-left: 10px !important}.pl15 {padding-left: 15px !important}.pl20 {padding-left: 20px !important}.pl30 {padding-left: 30px !important}
.pr5 {padding-right: 5px !important}.pr10 {padding-right: 10px !important}.pr15 {padding-right: 15px !important}.pr20 {padding-right: 20px !important}.pr30 {padding-right: 30px !important}
.m0 {margin:0!important;}
.p0 {padding:0!important;}
.fl-left {float: left !important}
.fl-right {float: right !important}
.t-left {text-align: left !important}
.t-center {text-align: center !important}
.t-right {text-align: right !important}
.po-right {right:0 !important; left:auto !important}
.show {display: block !important}
.hide {display: none !important}
.row {margin-right: -10px; margin-left: -10px;}
.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12 {padding-right: 10px; padding-left: 10px;position: relative;min-height: 1px; float: left;}
.col-1 {width: 8.33%}
.col-2 {width: 16.67%}
.col-3 {width: 25%}
.col-4 {width: 33.33%}
.col-5 {width: 41.67%}
.col-6 {width: 50%}
.col-7 {width: 58.33%}
.col-8 {width: 66.67%}
.col-9 {width: 75%}
.col-10 {width: 83.33%}
.col-11 {width: 91.67%}
.col-12 {width: 100%}
.line-dashed,.line-solid {clear: both; float: none; width: 100%; margin: 0 0 15px; border: none; border-bottom: #bac3b0 1px dashed; height: 15px;}
.line-solid {border-bottom: #bac3b0 1px solid;}

.table {width: 100%;max-width: 100%; margin-bottom: 20px;border-collapse: collapse !important;}
.table td,.table th {background-color: #fff !important;border: 1px solid #ddd !important; padding: 2px 5px; vertical-align: middle;}
.table thead th,.table thead td,.table tfoot th,.table tfoot td {background-color: #f5f5f5 !important; padding: 8px 10px;}
.table td {padding: 5px 10px;}
.table tbody tr:nth-of-type(even) td {background:#fff;}
.table tbody tr:nth-of-type(odd) td {background:#f1f1f1;}

.btn {font-size: 1rem; display: inline-block; background: #666; color: #fff; text-align: center; border: none; cursor: pointer; border-radius: 5px}
.btn:hover {background: #f00; color: #fff !important;}
.btn-circle {border-radius: 38px;}
.btn-big {font-size: 1.143rem; padding: 15px 30px}
.btn-white {background: #fff; color: #000; border: #ccc 1px solid}
.btn-yellow {background: #fabf37; color: #000;}
.btn-red {background: #f00; color: #fff;}
.btn-red:hover {background: #ff9933; color: #fff;}
.btn-green {background: #1abc9c; color: #fff;}
.btn-green:hover {background: #3a4153; color: #fff;}
.btn-orange {background: #ff9933; color: #fff;}
.btn-orange:hover {background: #f00; color: #fff;}
.btn-black {background: #333; color: #fff;}
.btn-black:hover {background: #f00; color: #fff;}

.bg-white {background: #fff}
.bg-gray {background: #f1f1f1}
.text-gray {color: #999 !important}


.nav {}
.nav li {padding:0 15px; position: relative;}
.nav li ul {display: none; position: absolute; left:0; top:0px; background-color: #fff;border: #e7e7e7 1px solid;}
.nav li:hover ul {display: block;}
/* .nav-top li:hover ul:after {position: absolute; left: 50%; top:-20px; margin-left: -10px; border-width: 10px; border-color: transparent transparent #fff transparent; border-style: solid; display: block; width: 0; height: 0; z-index: 9} */
header {position: absolute; width: 100%; height: 80px; z-index: 99999; background: rgba(255,255,255,0.6);}
.nav-top {min-height: 40px; background-color: transparent; border-bottom: #ccc 1px solid; position: relative; z-index: 99999}
.nav-top li {height: 80px; line-height: 80px; /* border-left: #e7e7e7 1px solid; */}
.nav-top li.first-item {border-left: none; padding-left: 0}
/* .nav-top li.last-item {border-right: #e7e7e7 1px solid;} */
.nav-top li a {color: #666}
.nav-top li a:hover {color: #666}
.nav-top li a i {margin-right: 5px;}
.nav-top li a img {vertical-align: middle; margin-right: 5px;}
.nav-top li ul {width: 150px; top:40px; margin-left: -1px; margin-top: -1px;}
.nav-top li ul.po-right {margin-left:auto;margin-right: -1px; text-align: right}
.nav-top li ul.fluid {width:103%; width: calc(100% + 2px)}
.nav-top li:hover ul {display: block;}
.nav-top li ul li {display: block; margin: 0; padding: 0 15px; border:none;}
.nav-top li ul li:hover {background-color: #f8f8f8;}
.header {padding: 0}
.logo {float: left; width: 240px; padding: 0}
.logo img{max-width: 230px; max-height: 30px; margin-top: 10px}
.header-title {float: left; border-left: #888 1px solid; margin-left: 20px; padding-left: 20px; font-size: 2rem; font-weight: 100; text-transform: uppercase;}

.search {float: right; margin: 0 auto; position: relative; z-index: 9999}
.search-link {display: inline-block; cursor: pointer;}
.search form/* ,.subscribe form */ {width: 100%; display: block; /* overflow: hidden; */ background-color: #fff; border: #f00 2px solid; height: 40px; line-height: 40px; position: relative; box-shadow: 0 2px 3px #ccc;}
.search form input,.subscribe form input {width: 100%; height: 36px; padding: 0 10px; overflow: hidden; background: #fff; font-size: 1.143rem; border: none; outline: none}
.search form button/* ,.subscribe form button */ {width: 100px; height: 36px; overflow: hidden; text-align: center; font-size: 1.143rem; background-color: #f00; color: #fff; border: none; cursor: pointer; position: absolute; right:0; top:0; text-transform: uppercase;}
.search form button i/* ,.subscribe form button i */ {margin-right: 5px; vertical-align: middle;}
.search form {position: absolute; right: -20px; top:70px; width: 400px; z-index: 999999; display: none; border: none; padding:5px; height: auto; padding: 0 56px 0 40px;}
.search form button {top:0px; right:0px; background-color: #fff; color:#333; width: 46px; height: 40px; border-left: #ccc 1px solid; text-align: center;}
.search:hover .icon-search {color: #de3e3e; -webkit-animation: pulse 2s infinite linear; -moz-animation: pulse 2s infinite linear; -ms-animation: pulse 2s infinite linear; -o-animation: pulse 2s infinite linear; animation: pulse 2s infinite linear }
/* .search:hover form {display: block;} */
/* .subscribe form {border: #ccc 1px solid;height: 38px; line-height: 38px;} */
.image-search { background:url(../images/camera.png) no-repeat center top; background-size: 30px auto; height:30px; line-height: 30px; border:none; width: 30px; cursor: pointer; position:absolute; left: 5px; top: 5px;}
.image-search:hover {background-position: center bottom;}

.top-user {float: right; position: relative; z-index: 9999; width:40px; height: 80px; line-height: 80px; margin: 0 0 0 10px; text-align: center;}
.sub-menu {position: absolute; width: 150px; padding:5px 10px; right:0; top:70px; background: #fff; /* border:#eee 1px solid; */ text-align: left; box-shadow: 0 2px 3px #999; display: none}
.sub-menu li {padding: 8px 10px; height: auto; line-height: 1}
.sub-menu .sub-menu-group {margin: 5px 0; border-top:#ccc 1px solid;}
.sub-menu .sub-menu-group-item {margin:0 15px; font-size: 1rem}
.top-user:hover {color: #f00}
.top-user:hover .sub-menu {display: block;}
.top-shoping-cart {float: right; position: relative; z-index: 9999;/* width: 100px; */ height: 80px; line-height: 80px; margin: 0 0 0 10px; /* margin-right: 50px; padding: 0 20px; */}
/* .top-shoping-cart .icon-shoping-cart {color: #ff9933; font-size: 1.286rem} */
.top-shoping-cart .icon-shoping-cart,.top-shoping-cart .icon-shoping-basket {display: inline-block;  font-size: 1.571rem; text-align: center;height: 80px; line-height: 80px;}
.top-shoping-cart .icon-shoping-basket {font-size: 1.275rem;}
.top-shoping-cart:hover .icon-shoping-basket {color: #de3e3e; -webkit-animation: wrench 2.5s ease infinite; -moz-animation: wrench 2.5s ease infinite; -ms-animation: wrench 2.5s ease infinite; -o-animation: wrench 2.5s ease infinite; animation: wrench 2.5s ease infinite}
.top-shoping-cart .between {padding: 0 10px; color:#999;}
.top-shoping-cart .shoping-cart-info {display: inline-block; font-size: 1rem; height: 38px; line-height: 38px; padding: 0 10px; position: relative; vertical-align: top;}
.top-shoping-cart .shoping-cart-info a {color: #000}
.top-shoping-cart .shoping-cart-info a:hover {color: #f00}
.top-shoping-cart .shoping-cart-info i { vertical-align: middle;}
.top-shoping-cart .shoping-cart-info .cart-num {background-color: #fff; border-radius: 30px; line-height: 1; font-size: 0.857rem; font-style: normal; color: #000; display: inline-block; height: 20px; width: 20px; line-height: 20px; text-align: center; vertical-align: middle; margin: 0 0 0 5px}

.mini-cart {position: absolute; top:68px; right: -1px; z-index: 9999; width: 380px; background: #fff; box-shadow: 0 2px 3px #999}
.mini-cart .mini-cart-title {padding: 10px 10px; line-height: 1; border-bottom: #eee 1px solid;}
.mini-cart .mini-cart-body {max-height: 300px; overflow: auto; background: url(../images/loading.gif) center center no-repeat; min-height: 60px}
.mini-cart .mini-cart-list {clear: both; padding: 5px 10px; font-size: 0.857rem; line-height: 1.5; background: #fff; border-bottom: #ccc 1px dashed; display: table; width: 100%}
.mini-cart .mini-cart-list:hover {background: #f5f5f5}
.mini-cart .mini-cart-list .list-img {width:50px; display: table-cell; vertical-align: top;}
.mini-cart .mini-cart-list .list-img img {width:100%;}
.mini-cart .mini-cart-list .list-info {display: table-cell; vertical-align: top;color: #333; padding: 0 10px}
.mini-cart .mini-cart-list .list-action {display: table-cell; vertical-align: top; width: 90px; text-align: right;}
.mini-cart .mini-cart-list .list-action p {color: #777}
.mini-cart .mini-cart-list .list-action .price {color: #333; margin-right: 3px; font-weight: bold; text-decoration: none}
.mini-cart .empty-list {text-align: center; padding: 30px}
.mini-cart .mini-cart-ctrl {padding: 5px 10px; background: #f2f2f2}
.mini-cart .mini-cart-total {font-size: 0.857rem; line-height: 30px; vertical-align: middle; float: left;}
.mini-cart .mini-cart-ctrl .btn {padding: 6px 10px; float: right; line-height: 1}


nav {z-index: 99990;position: relative; z-index: 500; padding: 0px 0}
nav.pin {position: fixed; top:0; left: 0; width: 100%; background-color: rgba(250,250,250,0.9); border-bottom:1px solid #ccc; padding:0;}
nav .container { height: 80px; line-height: 80px; font-size: 1rem;position: relative;z-index: 1}
.nav-bar {position:relative;margin:0px auto;height:80px; width:auto; z-index:9 }
.nav-bar div {position:absolute;top:0px;height:80px;}

.nav-bar .nav-list {text-align: right; right: 180px;}
.nav-bar .nav-list ul li{display: inline-block; line-height:80px; position: relative; z-index: 1;}
.nav-bar .nav-list ul li a{display:block; padding:0 20px;width:100%;color:#000;text-align:center; font-size: 1.071rem; font-weight: normal; text-transform: uppercase;}
.nav-bar .nav-list ul li a i.icon-arrow-down {margin-left: 8px; font-size: 12px}
.nav-bar .nav-list ul li a:hover, .nav-bar .nav-list ul li a.current{text-decoration:none;}
.nav-bar .nav-list ul li a:hover {color: #f00 !important}
/* .nav-bar .nav-list .pop-nav {position: absolute; left:0; top:70px; width: 680px; background: #fff; border:#ccc 1px solid; height: auto;box-shadow: 0 2px 3px #ccc;}

.nav-bar .nav-list .pop-nav-body {padding:20px; background: #fff; height: auto}
.nav-bar .nav-list ul li .pop-nav{display: none}
.nav-bar .nav-list ul li:hover .pop-nav {display: block;-webkit-animation:downIn .3s ease-in-out alternate;animation:downIn .5s ease-in-out alternate forwards;}
.nav-bar .nav-list .pop-nav dl {float: left; font-size: 14px; text-align: left; width: 200px; line-height: 1}
.nav-bar .nav-list .pop-nav dl a {display: inline; padding:0; margin:0;}
.nav-bar .nav-list .pop-nav dl dt,.nav-bar .nav-list .pop-nav dl dd {width: 100%; overflow: hidden; text-overflow: ellipsis;}
.nav-bar .nav-list .pop-nav dl dt a {font-size: 14px; font-weight: bolder; height: 30px; line-height: 30px;}
.nav-bar .nav-list .pop-nav dl dd a {font-size: 12px; height: 24px; line-height: 24px;}
 */
 .nav-bar .nav-list .pop-nav {position: absolute; left:-400px; top:70px; width: 865px; background: #fff; border:#111 1px solid; height: auto;box-shadow: 0 2px 3px #000; z-index: 999999}

.nav-bar .nav-list .pop-nav-body {padding:20px; background: #fff; height: auto;display: flex;flex-wrap: wrap;}
.nav-bar .nav-list ul li .pop-nav{display: none}
.nav-bar .nav-list ul li:hover .pop-nav {display:block; -webkit-animation:downIn .3s ease-in-out alternate;animation:downIn .5s ease-in-out alternate forwards;}
.nav-bar .nav-list .pop-nav dl {font-size: 14px; text-align: left; width: 200px; line-height: 1; margin-bottom: 25px;}
.nav-bar .nav-list .pop-nav dl a {display: inline; padding:0; margin:0;}
.nav-bar .nav-list .pop-nav dl dt,.nav-bar .nav-list .pop-nav dl dd {width: 100%; overflow: hidden; text-overflow: ellipsis;}
.nav-bar .nav-list .pop-nav dl dt a {font-size: 14px; font-weight: bolder; height: 30px; line-height: 30px;}
.nav-bar .nav-list .pop-nav dl dd a {font-size: 12px; height: 24px; line-height: 24px;text-transform: capitalize}

.subs-btn { border: 0; display: block; float: right; padding: 2px 45px; background: none; border: 0; line-height: 40px; position: relative; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease; text-transform: uppercase; font-size: 12px; font-weight: 700; color: #333 }
.subs-btn:before,.subs-btn:after { content: ""; position: absolute; width: 65%; height: 55%; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease }
.subs-btn:before { left: 0; top: 0; border-top: 2px solid #de3e3e; border-left: 2px solid #de3e3e }
.subs-btn:after { right: 0; bottom: 0; border-bottom: 2px solid #de3e3e; border-right: 2px solid #de3e3e }
.subs-btn:hover { color: #de3e3e }
.subs-btn:hover:before,.subs-btn:hover:after { width: 100%; height: 100% }

footer {background-color: #f5f5f5; border-top: #ccc 1px solid;}
footer .container {padding:30px 0}
footer .subscribe-container {width: 100%;}
footer .subscribe-title {float: left; height: 38px; line-height: 38px; color: #999; font-size: 1.429rem; font-weight: normal; padding: 0 20px 0 0; text-transform: uppercase;}
/* footer .subscribe {width: 300px; float: left;} */
footer .subscribe form {float: right;}
footer .subscribe form input,footer .subscribe form button {}
footer .subscribe form input {margin-right: 30px; width: 500px; height: 40px; border: #ccc 2px solid}
.follow {height: 38px; line-height: 38px; float: right; width: 500px; text-align: right;}
.follow-title {display: inline-block;height: 38px; color: #999; font-size: 1.429rem; font-weight: normal;vertical-align: middle; padding: 0 20px 0 0; text-transform: uppercase;}
.follow-list {display: inline-block;}
.follow-list a {width: 38px; height: 38px; text-align: center; vertical-align: middle; background-color: #f00; color: #fff; font-size: 1.571rem; margin: 0 5px; display: inline-block; vertical-align: middle;}
.follow-list a span {display: none}
.follow-list a.sina-weibo {background-color: #f00;}
.follow-list a.weixin {background-color: #54cb00;}
.follow-list a.facebook {background-color: #4968a9;}
.follow-list a.twitter {background-color: #11c2ea;}
.follow-list a.youtube {background-color: #faa701;}
.follow-list a.google-plus {background-color: #cc374b;}
.follow-list a:hover {background-color: #ff9933; color: #fff!important}
.share {height: 30px; line-height: 30px; float: none; width: auto}
.share .follow-title {height: 20px; line-height: 20px; font-size: 1rem;}
.share .follow-list a {width: 20px; height: 20px; line-height: 20px; font-size: 1rem;}

.footer-logo {padding: 30px; text-align: center; border-top:#eee 1px solid; margin:20px auto;}
.footer-logo img {height: 30px}
.footer-nav {padding: 20px 0; margin-top: 30px; border: #eee 1px solid; border-width: 1px 0}
.footer-nav dl.f-nav-list {width: 20%; float: left; color: #666}
.footer-nav dl a {color: #666}
.footer-nav dl dt {padding: 0 0 5px 0; font-size: 1.143rem; text-transform:uppercase;}
.footer-nav dl dd {padding: 2px 0; font-size: 0.857rem; }
.footer-nav-bar {padding: 20px 0; text-align: left;}
.footer-nav-bar li {display: inline-block; border: none; border-left: #ccc 1px solid; padding:0 15px 0 16px; color: #888;}
.footer-nav-bar li:nth-child(1) {border: none; padding-left:0 }
.footer-nav-bar li a {color: #888;}
.footer-copyright {padding: 5px 0}
.footer-copyright .copyright {float: left; color: #999; width: 500px; text-align: left}
.footer-copyright .payment-logo {float: right; text-align: right; width: 500px}
.bottom-copyright,.bottom-copyright a {color: #888}

.column-box {background-color: #f2e4cc; margin-bottom: 30px; padding: 15px 0}
.column-box.bg-white {background-color: #fff; border:#ccc 1px solid; border-width: 1px 0}
.column-box.bg-gray {background-color: #f1f1f1;}
.columns {color: #888; padding:10px 0; font-size: 1rem; font-family: "\5b8b\4f53"}
.columns a {color: #888; margin:0 6px; font-family: "microsoft yahei"}
.columns a:nth-child(1) {color: #888; margin:0 6px 0 0}
.columns a:hover {color: #f00}
.columns span {color: #f00; margin:0 6px; font-family: "microsoft yahei"}

.sitebar-container {margin: 20px 0;}
.sitebar-container:nth-child(1) {margin-top: 0;}
.sitebar-container h3 {padding:6px 0px; font-size: 1.143rem; text-transform: uppercase; border-bottom: #cecece 1px dashed;}
.sitebar-banner img {width: 100%; margin: 20px 0;}

.btn-group {display: inline-block;}
.btn-group-body {padding-left: 1px;font-size: 0;-webkit-text-size-adjust:none;}
.btn-group-child {border: #ddd 1px solid; display: inline-block; background-color: #f1f1f1; color: #777; font-size: 1rem; padding:3px 7px; margin-left:-1px;}
.btn-group-child.on,.btn-group-child:hover {background-color: #f00; border: #f00 1px solid; color: #fff}
.main-slide {background-color: #e5e2d6;border-bottom: #e5e2d6 1px solid;}
.main-slide .container {background-color: #fff; overflow: hidden;}
.main-slide .swiper-container {/* margin:0 280px 0 210px; */ z-index: 1}
.main-slide .swiper-slide img  {width: 100%; display: block;}
.main-slide .swiper-slide {background-repeat: no-repeat; background-size: cover; background-position: center;}
.main-slide .swiper-slide .title-box {position: absolute; top:50%; left:0; width: 100%; text-align: center; }
.main-slide .swiper-slide .title-box h3 {font-size: 40px; font-weight: normal;}
.main-slide .swiper-slide .title-box a.btn {margin: 30px auto 0 auto; display: inline-block;}
.main-slide .swiper-button-prev,.main-slide .swiper-button-next {left:50%;right:auto;top:auto;bottom:50px;width:90px;background-color:#fff; background-size: 10px; border:#000 2px solid; width: 80px; height: 45px}
.main-slide .swiper-button-prev {background-color:#000;color: #fff; margin-left: -80px}
.main-slide .article-box {width:280px; border-left: #eee 1px solid; float: right; margin-bottom: -1000px; padding-bottom: 1000px}
.main-slide .article-box h3 {height: 50px; line-height: 50px; border-bottom: #eee 1px solid; padding: 0 15px; font-size: 1.143rem; font-weight: normal; position: relative;}
.main-slide .article-box h3 a.more {float: right; font-size: 0.857rem; font-family: consolas; color: #888}
.main-slide .article-box h3 a.more:hover {color: #f00}
.main-slide .article-list {padding:10px 15px;}

.fixed-banner {background-repeat: no-repeat; background-position: 50% 80%; background-size: 140%; background-attachment: fixed; width: 100%; min-height: 500px;}
.fixed-banner div {width: 500px; padding: 200px 0 50px 0; margin: 0 auto; color:#fff; text-align: center;}
.home-article-box .home-article-banner {width: 46%; float: left}
.home-article-box .home-article-list {width: 50%; float: right}
.article {height: 90px; border-bottom: #eee 1px solid; margin-bottom:20px; position: relative;}
.article .article-date {position: absolute; width: 80px; height: 80px; border-radius: 20px; border:#eee 1px solid; overflow: hidden; text-align: center; font-weight: 100}
.article .article-date small {background-color: #f00; color:#fff; font-size: 20px; display: block; height: 30px; line-height: 30px;}
.article .article-date span {color:#666; font-size: 40px; height: 50px; line-height: 50px;}
.article .article-title {height: 30px;overflow: hidden; text-overflow:ellipsis;}
.article .article-title a {color:#f00; font-size: 16px;}
.article .article-info {margin-left:100px; padding:0;}
.article .article-dese {height: 45px; line-height: 1.5; color:#888;overflow: hidden; text-overflow:ellipsis;}

.article-list li  {padding: 5px 0; border-bottom: #e1e1e1 1px dashed;}
.article-list li a {color: #666; position: relative; display: block;}
.article-list li a:after {position: absolute; left:0; bottom:-4px; width: 100%; height: 1px; background: #e1e1e1; display: block; content: " ";}
.article-list li span {color: #888; margin-right: 6px; display: block;}
.article-list li strong {margin-right: 5px;}
.home-article-list li {width: 50%; padding: 5px 10px; float: left; border-bottom:none;}

.list-tab {padding:10px 0;}
.list-tab a {display: inline-block; padding: 0 30px; background-color: #f3f3f3; font-size: 1.143rem; font-weight: bold; height: 40px; line-height: 40px; margin:0 12px 0 0; position: relative; text-align: center; color: #555}
.list-tab a.on,.list-tab a:hover  {background-color: #f00; color: #fff!important}
.list-tab a.on i {position: absolute; left: 50%; bottom:-12px; margin-left: -6px; border-width: 6px; border-color: #f00 transparent transparent transparent; border-style: solid; display: block; width: 0; height: 0; z-index: 9}
.vlist-tab {}
.vlist-tab li {}
.vlist-tab li a {display: block; border:#fff 1px solid; border-width: 1px 0 1px 2px; font-size:1rem;font-weight:normal;overflow:hidden; padding: 5px 18px}
.vlist-tab li a:hover,.vlist-tab li.on a {position:relative; border:#ddd 1px solid; border-right: none; border-left: #f00 2px solid}

.panel {}
.panel-body {display: none}

.item-tab {white-space:nowrap; overflow: hidden; padding:0 10px;}
.item-tab a {display: inline-block; padding: 10px 15px; border-bottom: #fff 2px solid; font-size: 1.143rem}
.item-tab a.on {border-bottom: #f00 2px solid;}


.tabs { margin: 0; overflow: hidden; text-align: center; padding: 20px 0 30px 0 }
.tabs li { display: inline-block; margin: 15px 11px 0; position: relative; padding: 0 25px; line-height: 37px; font-size: 16px; font-weight: 800; color: #1c1c1c; text-transform: uppercase; cursor: pointer }
.tabs li:before,
.tabs li:after { content: ""; position: absolute; width: 0; height: 0; -webkit-transition: all 200ms ease; transition: all 200ms ease }
.tabs li:before { left: 0; top: 0; border-top: 2px solid #fff; border-left: 2px solid #fff }
.tabs li:after { right: 0; bottom: 0; border-bottom: 2px solid #fff; border-right: 2px solid #fff }
.tabs li:hover,
.tabs li.active { color: #de3e3e }
.tabs li:hover:before,
.tabs li:hover:after,
.tabs li.active:before,
.tabs li.active:after { width: 65%; height: 55%; border-color: #de3e3e }
.img-responsive { display: block; max-width: 100%; height: auto;width: 100% }
.static-video { overflow: hidden; margin-top: 50px; position: relative }
.static-video #cms-play { cursor: pointer; position: absolute; bottom: 40%; left: 0; right: 0; width: 90px; margin: 0 auto }
.static-video #cms-play .stroke-dotted { opacity: 0; stroke-dasharray: 4, 5; stroke-width: 1px; transform-origin: 50% 50%; -webkit-animation: spin 4s infinite linear; -moz-animation: spin 4s infinite linear; -ms-animation: spin 4s infinite linear; -o-animation: spin 4s infinite linear; animation: spin 4s infinite linear; -webkit-transition: opacity 1s ease, stroke-width 1s ease; transition: opacity 1s ease, stroke-width 1s ease }
.static-video #cms-play .stroke-solid { stroke-dashoffset: 0; stroke-dashArray: 300; stroke-width: 4px; -webkit-transition: stroke-dashoffset 1s ease, opacity 1s ease; transition: stroke-dashoffset 1s ease, opacity 1s ease }
.static-video #cms-play .cms-icon { transform-origin: 50% 50%; -webkit-transition: transform 200ms ease-out; transition: transform 200ms ease-out }
.static-video #cms-play:hover .stroke-dotted { stroke-width: 4px; opacity: 1 }
.static-video #cms-play:hover .stroke-solid { opacity: 0; stroke-dashoffset: 300 }
.static-video #cms-play:hover .cms-icon { -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05) }
.static-video .added-video { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; z-index: 9; display: block; max-width: 100% }

.products {}
.product {padding: 10px 15px; width: 25%; overflow: hidden;}

@media (min-width: 768px) {
  .product {width: 33.33%;}
}
@media (min-width: 992px) {
  .product {width: 25%;}
}
@media (min-width: 1300px) {
  .product {width: 25%;}
}
.product .product-body {background: #fff; padding:0; position: relative; z-index: 1}
.product .product-body .product-img {position: relative; overflow: hidden; text-align: center; /* height: 100px; */}
.product .product-body .product-img img {width: 100%; display: block; /* max-width: 100%; max-height: 100%; width: auto; display: inline-block; vertical-align: middle; *//* -webkit-animation:zoomIn .5s ease-in-out alternate;animation:zoomIn .5s ease-in-out alternate forwards;*/}
/* .product:hover .product-body .product-img img {-webkit-animation:zoomOut .5s ease-in-out alternate;animation:zoomOut .5s ease-in-out alternate forwards;} */
.product .product-body .product-img label {position: absolute; padding: 3px 10px; left:0; top:0; z-index: 5; color: #fff; text-transform: capitalize;}
.product .product-body .product-img .mult-image {position: relative;}
.product .product-body .product-img .mult-image .def-image {display: block;}
.product .product-body .product-img .mult-image .other-image {display: none;}
.product .product-body .product-img .mult-image:hover .def-image {display: none;}
.product .product-body .product-img .mult-image:hover .other-image {display: block;}
.product .product-body .product-img .discount-0 {background: #D00032}
.product .product-body .product-img .discount-1 {background: #9A03B9}
.product .product-body .product-img .discount-2 {background: #DE3A10}
.product .product-body .product-img .discount-3 {background: #093290}
.product .product-body .product-img .discount-4 {background: #21B77C}
.product .product-body .product-explain {padding: 5px 10px;}
.product .product-body .title {padding: 8px 0; line-height: 1.5; font-size: 1rem; color: #777; overflow: hidden; text-overflow:ellipsis; white-space:nowrap;  }
.product .product-body .title a {color: #777}
.product .product-body .title a:hover {color: #f00}
.product .product-body .price {color: #f00; font-size: 1.143rem; font-weight: bold; text-align: left; padding: 8px 0; line-height: 1.5;}
.product .product-body del {color: #888; display: inline-block; font-size: 0.857rem; font-weight: normal;}
.product .product-body ins { text-decoration: none; display: inline-block;}
.product .product-img .ctrl-bar {position: absolute; left:50%; bottom:30px; width: 90%; margin-left: -45%; overflow: hidden; opacity: 0;-webkit-box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.1); box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.1); -webkit-transition: all 300ms ease; transition: all 300ms ease}
.product .ctrl-bar .quick-view,.product .ctrl-bar .add-to-cart {background-color: #fff; color: #000; text-align: center; padding: 0px 10px; height: 45px; line-height: 45px;}
.product .ctrl-bar .quick-view a {margin: 0; color: #000; border-right:#ccc 1px solid; height: 45px; line-height: 45px; padding:0 20px; text-align: center; display: inline-block; }
.product .ctrl-bar .quick-view a:last-child {border-right:none}
.product .ctrl-bar .quick-view a.has,.product .ctrl-bar .quick-view a:hover {color: #f00}
.product .ctrl-bar .add-to-cart {background-color: #ff9933; padding: 0}
.product .ctrl-bar .add-to-cart a {display: block; padding: 8px 10px; background-color: #ff9933; color: #fff}
.product .ctrl-bar .add-to-cart a:hover {background-color: #f00; color:#fff !important;}
.product .product-img .ctrl-bar {-webkit-animation:downOut .3s ease-in-out alternate;animation:downOut .5s ease-in-out alternate forwards;}
.product:hover .product-img .ctrl-bar {-webkit-animation:downIn .3s ease-in-out alternate;animation:downIn .5s ease-in-out alternate forwards;}
.product .to-wishlist,.product .to-cart {position: absolute; right: 10px; display: block; width: 20px; height: 20px; line-height:20px; font-size: 20px; text-align: center; cursor: pointer;}
.product .stop-sales {position: absolute; right: 10px;bottom:10px; display: block; width: 50%; height: 20px; line-height:20px; font-size: 12px; text-align: right; color: #24BFFF}
.product .to-wishlist:hover,.product .to-cart:hover {color: #f00;}
.product .to-wishlist {top:10px; color: #333; opacity: 0.7; }
.product .to-wishlist.has {color: #f00;}
.product .to-cart {bottom:10px; color: #000;}
.product:hover .to-cart {}
.product .comments {}
.product .attr {color: #333; padding: 5px 0; display: none}
.product .attr span {color: #375d81}
.product .desc {color: #888; display: none}
.product .close{position:absolute;width:30px;height:30px;background-color: #fff; background-color: rgba(250,250,250,0.9); border-radius: 30px; font-size: 18px; line-height: 30px; overflow: hidden; color:#aaa;cursor:pointer;top:12px;right:12px;text-align:center; z-index: 99; /* line-height:16px;font-family:"Microsoft Yahei";font-size:1.429rem;background:none; */}
.product .close:hover {background-color:#e4393c;color: #fff}
.base-products .ctrl-bar {display: none}
.swiper-container .product {padding: 0}

/* .bg-white .product-body { box-shadow: #999 0px 0px 5px} */

.product-container {overflow: hidden;}
.product-container h1 {font-size: 1.429rem; font-weight: normal; padding: 5px 0px; text-transform: uppercase; margin:0}
.product-filter {padding:0 0 10px 0;}
.product-filter .btn-group-child {height: 30px;}

.product-grid .product {float: left; position: relative;}
.product-list .product {width: 100%; position: relative;}
.product-list .product-body {border:transparent 1px solid; border-bottom: #ddd 1px solid;}
.product-list .product:hover .product-body {border: #ddd 1px solid;}
.product-list .product-body .product-img {float: left; width: 30%; padding-right: 10px}
.product-list .product-body .product-explain {float: right; width: 70%; padding-left: 10px}
.product-list .product-body .title {display: block; width: 100%}
.product-list .product-body .title a {font-size: 1.143rem; color: #555}
.product-list .ctrl-bar {float: right; width: 150px}
.product-list .ctrl-bar .quick-view {background-color: transparent; font-size: 0;-webkit-text-size-adjust:none; padding: 10px 0 10px 1px;}
.product-list .ctrl-bar .quick-view a {width: 33.33%; height: 35px; line-height: 35px; border: #ccc 1px solid; color: #666; font-size: 1rem; display: inline-block; text-align: center; margin: 0 0 0 -1px}
.product-list .price {margin-right: 190px}
.product-list .comments {margin-right: 190px}
.product-list .product .attr {display: block;}
.product-list .product .desc {clear: both; display: block; width: 100%}

.sitebar-nav {border: #eee 1px solid; padding:10px;}
.sitebar-nav li {padding: 5px 10px; margin:5px 0; border-bottom: #ccc 1px dashed;}
.sitebar-nav li:last-child {border: none}

.main {padding-top: 80px;background: #f1f1f1}
.main.bg-white {background: #fff}
.main-wrap {}
/* .sitebar {width:210px; float: left;}
.main-body {margin-left: 240px; }
.main-banner {width: 100%}
.customer-main {background-color: #f1f1f1}
.customer-main .sitebar {width:100px;}
.customer-main .main-body {margin-left: 110px;} */
/* .sitebar {width:210px; float: left;}
.main-body {float: right; width: calc(100% - 240px)}
.main-banner {width: 100%}
.customer-main {background-color: #f1f1f1}
.customer-main .sitebar {width:100px;}
.customer-main .main-body {float: right; width: calc(100% - 110px)} */

.main-wrap-d {margin-left: 240px;}
.sitebar {width:210px; float: left; position: relative; margin-left: -240px;}
.main-body {float: right; width: 100%}
.main-banner {width: 100%}
.customer-main {padding-top: 130px; background-color: #f1f1f1}
.customer-main .main-wrap {margin-left: 140px; padding-bottom: 10px}
.customer-main .sitebar {width:130px; margin-left: -140px;}

.sitebar-container .product {width: 100%;padding: 0;}
.sitebar-container .product-body {border: none; border-bottom: #ddd 1px solid;}
.price-slider {padding: 50px 0 20px 0}
.customer-nav {margin-bottom: 20px;}
.customer-nav dt {font-weight: bolder; padding:0 0 3px 0;}
.customer-nav dd {padding:3px 0;/* font-size: 0.857rem */}
.customer-nav dd a {color: #666}
.mod-body {padding: 20px; background-color: #fff}

.enabled-filters {background: #f1f1f1}
.enabled-filters h3 {padding:6px 5px;}
.filter-form {}
.filter-list {padding: 10px;}
.filter-list dt,.filter-list dd {padding: 6px 0 6px 25px; border-bottom:#ddd 1px dashed; position: relative;}
.filter-list dd {margin: 0 10px;}
.filter-list dt:before,.filter-list dd:before {position: absolute; left:0; top:50%; margin-top: -8px; width: 16px; height: 16px; border-radius: 16px; background: rgba(250,250,250,0.5); border:#ddd 1px solid; display: block;content: " ";}
.filter-list dt.select a,.filter-list dd.select a {color: #f00; font-weight: bold;}
.filter-list dt.select:after,.filter-list dd.select:after {position: absolute; left:5px; top:50%; margin-top: -3px; width: 8px; height: 8px; border-radius: 8px; background: #F00; display: block;content: " ";}

/* .swiper-container .product {width: auto; padding: 0} */
/* .swiper-container .product-body {border:none;} */

.selector {padding:10px; margin: 0 0 20px 0; background-color: #f9f9f9}
.selector dl {clear:both; padding:7px 20px 0 20px;}
.selector dt {float:left; width:100px; _padding:3px 0 0 0; font-weight:bolder; color:#666;}
.selector dt a {color:#333; text-decoration:none}
.selector dd {margin-left: 110px; line-height:1.8;}
.selector dd.line {margin-left: 0px; clear: both; border-style: dashed;}
.selector dd a {margin:0 10px 0 0; padding:0 2px; /*display:inline-block*/}
.selector dd.xinput a {margin:0; padding:0;}
.selector dd a.select {font-weight:bolder; background:#F60; color:#fff;}
.selector dd.color a {display:block; border:#ccc 1px solid; margin:2px; width:22px; height:22px; float:left;}
.selector dd.color a img {width:22px; height:22px;}
.selector dd.color a:hover {border:#f00 1px solid;}

.product-name {text-align: center; height: 80px;}
.product-name h1 {font-weight: normal; font-size: 26px}

#product-basic {}
#product-img {float: left; width: 500px;}
#product-intro {padding-left: 30px; background: #fff; min-height: 300px;}
#product-intro .intro-body {padding:0 20px;}

@media (max-width: 1200px) {
  	#product-img {float: none; margin: 0 auto}
	#product-intro {padding-left: 0px; background: #fff; min-height: 300px;}
	#product-intro .intro-body {padding:0;}
}

#product-big-img {background: #fff; border: #ddd 1px solid;text-align: center; padding:0px; vertical-align:middle; }
#product-big-img a {display:table-cell; height: 400px; width: 500px; height: 400px; vertical-align:middle;text-align: center;}
#product-big-img img {/* width:100%; */ max-width: 500px; max-height: 400px; vertical-align: middle;}
#product-small-img {margin: 0 auto; padding:10px 0; position: relative;}
#product-small-img .swiper-container{width: 100%}
#product-small-img .swiper-slide img {border:transparent 2px solid; width: 100%; display: block;}
#product-small-img .swiper-slide {}
#product-small-img .select img {border:#e62e04 2px solid;}

.product-making-tip {color: #777; padding: 5px 0px; margin-top: 20px}
#product-intro h1 {font-size: 1.571rem; font-weight: normal; line-height: 1.2}
#product-intro h2 {font-size: 1rem; font-weight: normal; line-height: 1.5; color: #777}
#product-intro dl {padding: 3px 10px}
#product-intro dt {float: left; width: 100px;padding:3px 0; text-transform: capitalize;}
#product-intro dd {padding:3px 0; margin-left: 100px;}
#product-intro .price {padding:10px; margin: 20px 0; background-color: #f5f5f5; }
#product-intro .price a {color: #888;}
#product-intro .price label,#product-intro .attr label {}
#product-intro .price del {color: #888; margin-right: 8px; font-size: 0.857rem; font-weight: normal;}
#product-intro .price ins {font-size: 1.429rem; font-weight: bold; color: #e62e04; text-decoration: none}
#product-intro .promotion {padding:3px 0;}
#product-intro .promotion span {display: block; padding: 0 0 10px 0}
#product-intro .promotion strong {background: #c30e24; color: #fff; display: inline-block; padding:1px 5px;}
#product-intro .gift {color: #333; padding: 10px 0}
#product-intro .gift a {color: #333;}
#product-intro .gift i {color: #c30e24; margin-right: 10px}
#product-intro .gift img {width: 30px; margin-right: 10px}
#product-intro .attr {padding:3px 10px;}
#product-intro .attr span {}
#product-intro .option {padding:10px; /* margin: 20px 0; */}
#product-intro .option dt,#product-intro .option dd {padding:6px 0;}
#product-intro .ctrl-bar {overflow: hidden; padding: 20px; background: #f5f5f5;}
#product-intro .ctrl-bar .quick-view {background-color: transparent; font-size: 0;-webkit-text-size-adjust:none; padding: 10px 0 10px 1px; overflow: hidden; display: inline-block; vertical-align: middle;}
#product-intro .ctrl-bar .quick-view a {width: 50px; height: 50px; line-height: 50px; background-color: #fff; color: #666; font-size: 1.214rem; display: inline-block; text-align: center; margin: 0 0 0 -1px}
#product-intro .ctrl-bar .quick-view a:hover {color: #e62e04}
#product-intro .ctrl-bar .quick-view a span {color: #999;font-size: 1rem;}

#product-intro .ctrl-bar .add-to-cart {display: inline-block; vertical-align: middle; margin-right: 20px}
#product-intro .ctrl-bar .add-to-cart button {display: inline-block; border: none; height: 50px; line-height: 50px; padding: 0px 20px; cursor: pointer; background-color: #fff;  color: #000; font-size: 1.286rem}
#product-intro .ctrl-bar .add-to-cart button:hover {background-color: #e62e04; color: #fff}
#product-intro .ctrl-bar .add-to-cart button i {margin-right: 10px; font-size: 1.357rem}

.price-table {display: table; width: 100%; color: #333; margin:10px 0;}
.price-table .cell {background: #f2f2f2; text-align: center; vertical-align: middle; padding: 10px}
.price-table .cell:nth-of-type(2n+1) {background: #f5e7ca}
.price-table .price-title {padding-bottom: 5px;}
.price-table .price-text {padding-top: 5px; font-size: 0.857rem; border-top: #aaa 1px solid; color: #666}
.price-table span {font-size: 1.143rem; margin:0 5px}
#product-quantity {color: #FF8000; font-size: 1.286rem}
#product-amount {margin-left: 30px;color: #FF8000; font-size: 1.286rem}

.countdown {padding: 3px 10px; background-color: #fff; border: #ddd 1px solid; display: inline-block; margin: 10px 0;}
.countdown i {font-size: 1.357rem; color: #666; vertical-align: middle;}
.countdown span {margin-left: 5px; display: inline-block; vertical-align: middle;}
.option label {display: inline-block; min-width: 32px; background-color: #fff; border: #ccc 1px solid; padding: 2px; position: relative;}
.option label a {display: inline-block; min-width: 26px; height: 26px; line-height: 26px; background-color: #fff; vertical-align: middle; font-size: 0.857rem; color: #888; cursor: pointer;}
.option label a img {height: 100%; vertical-align: middle;}
.option label a span {margin: 0 5px;}
.option label i {width: 13px; height: 13px; position: absolute; right:0; bottom: 0; background: url(../images/selected.png) no-repeat 0 0; display: none}
.option label.selected,.option label:hover {border: #e4393c 2px solid; padding: 1px;}
.option label.selected i {display: block; }
.option input {display: none}

.step-container .option label {padding: 2px 31px; font-size: 1.143rem; margin: 0 15px}
.step-container .option label a {font-size: 1.143rem}
.step-container .option label.selected,.step-container .option label:hover {padding: 1px  30px;}

.digit {margin: 10px 0; width: 200px; height: 50px; line-height: 48px; font-size: 0; text-align: center; border: #ddd 1px solid; overflow: hidden;}
.digit label {width: 200%; display: block;}
.digit a {width:50px; height: 48px; float: left; border-right: #ddd 1px solid; font-size: 2.143rem; background-color: #f1f1f1; color: #666; font-family: Arial}
.digit a:hover {background-color: #f00; color: #fff !important}
.digit input {width: 100px; height: 48px;border: none; font-size: 1.214rem; border-right: #ddd 1px solid; text-align: center; float: left;}

/* -------------------------- */
/* 新增批量加购物车 */
.option label b {height: 20px; position: absolute; right: -10px; top: -10px; display: none; background: #F00; color: #fff; font-size: 10px; line-height: 20px; text-align: center; padding: 0 10px; border-radius: 50px;}
.img-option label {margin-right: 20px;}
.img-option label a {height: 50px; line-height: 50px;}
.img-option label a img {height: 46px; margin-right: 20px;}
.img-option label a span {color: #000; padding-right: 10px; font-size: 14px;}
ul.qty-list {border-bottom: #ccc 1px dotted; height: 50px; width:460px; font-size: 14px;}
ul.qty-list li {height: 50px; line-height: 50px; float: left;}
ul.qty-list li.qty-1 {width: 100px;}
ul.qty-list li.qty-2 {width: 100px; font-weight: bolder;  font-size: 16px;}
ul.qty-list li.qty-3 {width: 120px;}
ul.qty-list li.qty-4 {width: 130px; text-align: right; font-weight: bold; color: #f00;}
ul.qty-list .digit {width: 117px;}
ul.qty-list .digit label {border: none;height: 28px; padding: 0;}
ul.qty-list .digit label:hover {border: none;}
ul.qty-list .digit {height: 30px; line-height: 28px;}
ul.qty-list .digit a {width:30px; height: 28px; line-height: 28px; font-weight: bolder; font-size: 16px;}
ul.qty-list .digit input {height: 28px;width: 50px; display: block;}

/* -------------------------- */

.list-empty {padding: 50px!important; text-align: center;}
/* #product-intro .attr {padding:50px 0 0 0;}
#product-intro .attr span {height: 44px; line-height: 44px; background: #c30e24; color: #fff; display: inline-block; padding:0 30px; margin: 1px; margin-left: 0; font-size: 16px;}
#product-intro h3 {color: #ccc; padding:30px 0 10px 0; line-height: 1; font-weight: normal;}
#product-intro p {color: #000; line-height: 1.5} */
#product-detail {}
.product-detail {border-bottom: #ddd 1px solid; margin-top: 20px}
.product-detail,.product-detail p {line-height: 1.6}
.product-detail .list-tab,.most-product .list-tab {background-color: transparent; padding: 0; height: 62px; text-align: center; padding: 20px; border:#ccc 2px solid; border-width: 2px 0}
.product-detail .list-tab a,.most-product .list-tab a {background-color: transparent;}
.product-detail .list-tab a.on,.most-product .list-tab a.on {background-color: transparent;  color: #000!important;}
.product-detail .list-tab a:hover,.most-product .list-tab a:hover {color: #f00!important}
.product-detail .list-tab a.on i,.most-product .list-tab a.on i {left: 0; bottom:0px; margin-left: 0px; border: none; height: 2px; background: #333; display: block; width: 100%; z-index: 9}
.product-detail .panel,.most-product .panel {/* background-color: #fff; */ padding: 30px 0; margin-top: -10px}
.product-detail .panel-body,.most-product .panel-body {padding: 10px 20px}
.product-detail img {max-width: 100%}
.most-product {padding: 30px 0 10px 0}
.most-product h3 {padding: 30px 0 30px 0; font-size: 1.857rem; text-align: center; display: block; text-transform: uppercase;}
.most-product h3 span {display: inline-block; padding: 10px 30px; border:#000 3px solid;}
.most-product .swiper-container {padding: 1px 0}

.best-products {padding: 30px 0}
.home-products { padding: 10px 0;}

.container-title {text-align: center; font-size: 35px; text-transform: uppercase; font-weight: normal; padding: 30px 0 20px 0; margin-bottom: 30px}

.group-products {margin: 30px 0; background: #fff; overflow: hidden;}
.group-tab {float: left; width: 15%}
.group-tab h3 {text-align: center; padding: 9px 10px;background-color: #ffd549; color: #000; font-weight: normal;}
.group-tab h4 {text-align: center; padding: 9px 10px;background-color: #eed472; color: #fff; font-weight: normal;}
.group-products .panel {float: right; width: 85%}
.group-products .nav-item-banner {float: left; width: 21%;background-color: #ffd549; padding-bottom: 1000px; margin-bottom: -1000px}
.group-products .nav-item-banner:after {content: " "}
.group-products .nav-item-banner img {width: 100%; vertical-align: bottom;}
.group-products .nav-item-product {float: right; width: 79%; padding-bottom: 1000px; margin-bottom: -1000px}
.group-products .product {width: auto; padding: 0}
.group-products .product-body {border:none; /* border-left: #eee 1px solid */}

.group-style-1 .group-tab h3 {background-color: #ffd549; color: #fff;}
.group-style-1 .group-tab h4 {background-color: #eed472; color: #fff;}
.group-style-1 .nav-item-banner {background-color: #ffd549;}
.group-style-1 .vlist-tab li a:hover,
.group-style-1 .vlist-tab li.on a {border-left-color: #ffd549; color: #ffd549}

.group-style-2 .group-tab h3 {background-color: #a6cada; color: #fff;}
.group-style-2 .group-tab h4 {background-color: #b2d7e8; color: #fff;}
.group-style-2 .nav-item-banner {background-color: #a6cada;}
.group-style-2 .vlist-tab li a:hover,
.group-style-2 .vlist-tab li.on a {border-left-color: #a6cada; color: #a6cada}

.group-style-3 .group-tab h3 {background-color: #c75347; color: #fff;}
.group-style-3 .group-tab h4 {background-color: #d85c50; color: #fff;}
.group-style-3 .nav-item-banner {background-color: #c75347;}
.group-style-3 .vlist-tab li a:hover,
.group-style-3 .vlist-tab li.on a {border-left-color: #c75347; color: #c75347}

.group-style-4 .group-tab h3 {background-color: #82a3cc; color: #fff;}
.group-style-4 .group-tab h4 {background-color: #99b9d8; color: #fff;}
.group-style-4 .nav-item-banner {background-color: #82a3cc;}
.group-style-4 .vlist-tab li a:hover,
.group-style-4 .vlist-tab li.on a {border-left-color: #82a3cc; color: #82a3cc}

.group-style-5 .group-tab h3 {background-color: #59c6bb; color: #fff;}
.group-style-5 .group-tab h4 {background-color: #65d9cd; color: #fff;}
.group-style-5 .nav-item-banner {background-color: #59c6bb;}
.group-style-5 .vlist-tab li a:hover,
.group-style-5 .vlist-tab li.on a {border-left-color: #59c6bb; color: #59c6bb}

.group-style-6 .group-tab h3 {background-color: #f59fba; color: #fff;}
.group-style-6 .group-tab h4 {background-color: #fab8cd; color: #fff;}
.group-style-6 .nav-item-banner {background-color: #f59fba;}
.group-style-6 .vlist-tab li a:hover,
.group-style-6 .vlist-tab li.on a {border-left-color: #f59fba; color: #f59fba}

.group-style-7 .group-tab h3 {background-color: #ff1493; color: #fff;}
.group-style-7 .group-tab h4 {background-color: #EE76B7; color: #fff;}
.group-style-7 .nav-item-banner {background-color: #ff1493;}
.group-style-7 .vlist-tab li a:hover,
.group-style-7 .vlist-tab li.on a {border-left-color: #ff1493; color: #ff1493}

.group-style-8 .group-tab h3 {background-color: #9acd32; color: #fff;}
.group-style-8 .group-tab h4 {background-color: #BBD389; color: #fff;}
.group-style-8 .nav-item-banner {background-color: #9acd32;}
.group-style-8 .vlist-tab li a:hover,
.group-style-8 .vlist-tab li.on a {border-left-color: #9acd32; color: #9acd32}

.group-style-9 .group-tab h3 {background-color: #daa520; color: #fff;}
.group-style-9 .group-tab h4 {background-color: #DEC68B; color: #fff;}
.group-style-9 .nav-item-banner {background-color: #daa520;}
.group-style-9 .vlist-tab li a:hover,
.group-style-9 .vlist-tab li.on a {border-left-color: #daa520; color: #daa520}

.group-style-10 .group-tab h3 {background-color: #d2691e; color: #fff;}
.group-style-10 .group-tab h4 {background-color: #CF9F7C; color: #fff;}
.group-style-10 .nav-item-banner {background-color: #d2691e;}
.group-style-10 .vlist-tab li a:hover,
.group-style-10 .vlist-tab li.on a {border-left-color: #d2691e; color: #d2691e}

.banner-bar {}
.banner-bar img {width: 100%}

.brand-list {padding: 30px 0}
.brand-list ul {margin: 0 -1px -1px 0;background-color: #fff;}
.brand-list li {border: #eee 1px solid; border-width: 0 1px 1px 0; float: left; width: 12.5%; height: 80px; line-height: 80px; background-color: #fff; text-align: center;}
.brand-list li img {max-width: 90%; max-height: 90%; vertical-align: middle;}

.cart-title {font-size: 2rem; color: #666; font-weight: normal; border-top: #ddd 1px solid; padding:20px 0}
.cart-detail th,.cart-detail td,.order-list th,.order-list td {text-align: left; padding: 10px !important;}
.cart-detail th,.order-list th {font-size: 1.143rem; font-weight: normal;}
.cart-detail a {color: #777;}
.cart-detail a:hover {color: #f00;}
.cart_no {width: 15px}
.cart_img {width: 80px}
.cart_product {width: auto}
.cart_price {width: 100px}
.cart_quantity {width: 140px}
.cart_subtotal {width: 100px;}
.cart_delete {width: 100px}
.cart-detail .digit {margin:0; width: 120px; height: 30px; line-height: 28px;}
.cart-detail .digit a {width:30px; height: 28px; margin: 0; font-size: 1.571rem;}
td.cart_price,td.cart_subtotal {text-align: right;}
td.cart_price span {color: #999; font-size: 0.857rem}
.checkout-cart .cart_subtotal {width: 200px;}
.checkout-cart td.cart_subtotal {text-align: center;}
.cart-detail td.cart-empty {padding: 50px!important; text-align: center;}
.cart-detail td {background: #fafafa!important}
.cart-detail .selected td,.checkout-cart td {background: #FFF!important}
/* .cart-detail .set-list td {background: #fbfbfb!important} */

.cart-detail .digit input {width: 60px; height: 28px;font-size: 1rem;}
.cart-detail .title {font-size: 1.143rem;}
.cart-detail .title a {color: #333;}
.cart-detail .title a span {display: inline-block; vertical-align: middle; background: #F9A100; color: #fff; padding: 1px 6px; font-size: 0.857rem}
.cart-detail .gift {color: #666; padding: 5px 0}
.cart-detail .gift img {width: 30px; margin-right: 10px}
.cart-detail .gift i {color: #f26d7e; margin-right: 10px}
.cart-detail .attr {color: #888}
.cart-detail .attr span {color: #777; margin: 0 20px 0 5px}
.cart-detail .delete {color: #f00}
.cart-detail .mutli a {margin:0 20px}
.cart-detail strong {color: #f00}
.cart-detail ins {text-decoration: none; display: block;}
.cart-detail del {color: #888; font-size: 0.857rem; display: block;}
.cart-detail .amount {color: #f00; font-weight: bolder; font-size: 1.286rem}
.cart-ctrl {text-align: right;}
.cart-ctrl .total {display: inline-block; font-size: 1.286rem; color: #777; margin-right: 30px; vertical-align: middle;}
.cart-ctrl .total strong {display: inline-block; font-size: 1.571rem; color: #f00 }
.cart-ctrl .total .address {font-size: 1rem; color: #666}
.cart-ctrl .btn {}
.option-btns {position: absolute; top:13px; right: 10px; z-index: 9; text-align: right;}
.option-btns a {margin: 0 5px; color: #666}
.step-title {font-size: 1.286rem; font-weight: normal; position: relative; padding: 20px 0 10px 0}
.step-title span {font-size: 1rem;}
.step-title .option-btns {top:23px;}
.step-content {padding: 5px 10px 10px 10px; border-bottom: #ddd 1px solid;}
.step-ctrl {padding:9px 0 30px 0;}
.step-ctrl.pin-bottom {position: fixed; left:0; bottom: 0; z-index: 9999; background-color: rgba(250,250,250,.7); width: 100%; padding:9px 0;}
.addr-list li {position: relative; padding: 9px 0}
.addr-list li:hover {background-color: #f5f5f5}
.addr-list li .option-btns {display: none;}
.addr-list li:hover .option-btns {display: block;}

.addr-more,.addr-close {margin-left: 15px; color: #888;}
.addr-more i,.addr-close i {margin-left: 10px; font-size: 0.857rem}
.order-list {}
.order-remarks textarea {border:#ccc 1px solid; vertical-align:text-top; width:100%; padding:5px; color:#333; word-break:break-all; overflow:auto;}

.payment-detail {width: 900px; margin:0 auto; border: #eee 1px solid; padding: 30px;}
.payment-detail h3 {font-size: 1.286rem;}
.payment-detail p {font-size: 1.143rem; padding: 10px 0}
.payment-detail .amount {color: #f00; font-weight: bolder; font-size: 1.571rem}
.payment-detail .option {padding: 10px 0 20px 0}
.payment-detail .option label {margin-right: 20px; padding: 5px 20px}
.payment-detail .option label.selected,.payment-detail .option label:hover {padding: 4px 19px}
.payment-detail .option label a {font-size: 1.143rem; color: #333;}
.payment-ctrl {padding: 50px 0;}
.payment-ctrl span.error {color: #f00; margin-left: 30px; font-size: 1.143rem;}
.bank-list label {display: inline-block; vertical-align: middle; width: 19%;}
.bank-list label input {width:15px; height:15px; padding:9px 0px 0 0; vertical-align: middle;}
.bank-list label img {width:130px; vertical-align: middle;}

.order-header {border: none !important; display: table; width: 100%}
.order-detail {font-size: 1rem}
.order-consignee,.order-total {display: table-cell; vertical-align: middle; width: 120px; text-align: center; font-size: 1rem}
.order-status,.order-action {display: table-cell; vertical-align: middle; width: 120px; text-align: center; font-size: 1rem}
.order-total .btn,.order-action .btn {padding: 5px 10px; font-size: 0.857rem}
.order-header .order-no {display: table-cell;}
.order-header .order-no h3 a {margin-left: 30px; color: #888; font-size: 1rem; font-weight: normal;}
.order-header .order-no h3 a i {margin-right: 6px}
.order-header .order-no p {color: #888}
.order-header .order-status {width: 150px; text-align: center; font-size: 1.143rem; color: #58A76A}
.order-header .order-total {width: 350px; text-align: right;}
.order-header .order-total .amount {color: #f00; font-weight: bolder; font-size: 1.571rem; margin-right: 20px;}
.order-header .order-total .btn {padding: 10px 20px; font-size: 1.143rem}
.order-consignee span,.order-total span,.order-status span,.order-action span {color: #888;}
.order-basic th {text-align: left; font-weight: normal; color: #888; font-size: 1rem}
.order-basic span {margin-right: 30px}
/* .order-basic span a {color: #555} */
.order-products {padding: 0px; display: table; width: 100%}
td.order-consignee,td.order-total,td.order-status,td.order-action {vertical-align: top; text-align: center; padding: 15px 5px}
.order-products .product-img,.order-products .product-title,.order-products .product-qty,.order-products .product-service {display: table-cell; padding: 5px; vertical-align: top;}
.order-products .set-product {display: table-cell; width: 5px; background: #B9AA63;}
.order-products .product-img { width: 80px; text-align: center;}
.order-products .product-img  img {max-height: 80px; max-width: 80px}
.order-products .product-title {width: auto;}

.order-products .product-title a span,.discount-type {display: inline-block; vertical-align: middle; background: #6DD7EA; color: #fff; padding: 1px 6px; font-size: 0.857rem}
.order-products .product-title .attr {color: #999}
.order-products .product-title .attr span {margin-right: 20px; font-size: 0.857rem}
.order-products .product-qty {width: 60px; color: #888; text-align: center;}
.order-products .product-service {width: 100px; color: #888; text-align: center;}
.order-info {display: table; width: 100%; color: #666}
.order-info-cell {display: table-cell; width: 25%}
.order-info-cell .order-info-body {padding: 0 20px;}
.order-info-cell .order-info-body h3 {font-weight: normal; font-size: 1.143rem;}
.order-info-cell .order-info-body p {padding: 3px 0; font-size: 0.857rem; color: #888}
.order-info-cell .order-info-body p label {display: table-cell; width: 100px}
.order-info-cell .order-info-body p span {display: table-cell;}
.order-remark {}
.order-remark h3 {font-weight: normal; font-size: 1.143rem;}
.order-info-cell .order-info-body p {padding: 5px 0; font-size: 1rem; color: #333}

/*分页*/
.pages {padding:14px 0 10px;font-family:'宋体'; text-align:center;vertical-align: middle;}
.pages a {display:inline-block; height:30px; line-height:30px; background:#fff; border:1px solid #e3e3e3; text-align:center; color:#333; padding:0 10px; margin:0 2px; vertical-align: middle;}
.pages a:hover { background:#f1f1f1; color:#000; text-decoration:none;}
.pages span {display:inline-block; height:30px;padding:0 10px; line-height:30px; background:#f00; border:1px solid #f00; color:#fff; text-align:center; margin:0 2px; vertical-align: middle;}
.pages span.page-info {background:#fff; border:1px solid #e3e3e3; color:#666;}
.pages input {height: 28px; line-height: 28px; border:1px solid #e3e3e3; text-align: center; font-size: 0.857rem; width: 30px; margin:0 2px; vertical-align: middle;}
.pages .no-page { display:inline-block; height:30px; line-height:30px; border:1px solid #e3e3e3; text-align:center; color:#a4a4a4; }
#loading {width:200px; height:80px; border-radius:10px; background:url(../images/loading.gif) center 5px no-repeat #fff; position:absolute; left:50%; margin-left:-100px; top:100px; z-index:999999; padding-top:50px; color:#fff; text-align:center; filter:Alpha(opacity=80); -moz-opacity:0.8; opacity:0.8;}
.msgbox,.msgbox_body,.msgbox_icon,.msgbox_info {display:inline-block;height:56px;line-height:30px;padding:13px;font-weight:bold;font-size:14px;color:#606060;vertical-align: middle;}
.msgbox {width:100%;position:fixed;_position:absolute;top:46%;left:0;text-align:center;z-index:999998;padding:0; display: block;}
.msgbox_body {background:#fff;margin:0 auto;position:relative;z-index:999999;border:#ccc 1px solid;padding:0; height:auto; box-shadow:0 0px 3px #999;}
.msgbox_info {background:#fff;padding:13px 20px; vertical-align: middle;}
.msgbox_icon {background:#f5f5f5;font-size:30px;text-align:center;padding:13px 18px; vertical-align: middle;}
.msgbox_icon i.icon-succeed {color:#27AE60}
.msgbox_icon i.icon-failure {color:#E74C3C}
.msgbox_icon i.icon-tip {color:#3498DB}
.msgbox_icon i.icon-warn {color:#F39C12}

/* 加入购物车 */
#buy-container-overlay{position:fixed;z-index:999930;top:0px;left:0px;height:100%;width:100%;background:#000;display:none;opacity: 0.7}
#buy-container {width: 800px;background:#fff; position: fixed; left:50%; top: 0; z-index: 999933; margin-left: -400px; padding:20px; min-height: 200px;display:none;}
#buy-container .close {width: 30px; height: 30px; position: absolute; right:8px; top:8px; cursor: pointer;}
#buy-container .close:hover {color: #f00}
#buy-container .close:hover:before,#buy-container .close:hover:after {background: #f00}
#buy-container .close:before,#buy-container .close:after {display: block; width: 100%; height: 2px; margin-bottom: 5px; background: #333;position: absolute; top:15px; content: ' '}
#buy-container .close:before {transform:rotateZ(45deg); -webkit-transform:rotateZ(45deg);}
#buy-container .close:after {transform:rotateZ(-45deg); -webkit-transform:rotateZ(-45deg);}
#buy-container form {display: table; width: 100%}
#buy-container .product-img {width: 300px; height: 300px; border:1px solid #eee; background: #fff; overflow: hidden;vertical-align: middle;text-align: center; display: table-cell;}
#buy-container .product-img img {max-width: 100%;max-height: 100%;display: inline-block; vertical-align: middle;}
#buy-container .product-img:after {display: inline-block; vertical-align: middle; height: 100%; content: ' '}
#buy-container .price {color: #f00; font-size: 1.571rem; padding:0 0 20px 0px; }
#buy-container .price ins {text-decoration: none}
#buy-container .price del {color: #999; font-size: 1rem; margin-left: 20px;}
#buy-container .buy-body {display: table-cell; vertical-align: top; padding-left: 30px}
#buy-container .option {padding:5px 10px;}
#buy-container .option dt {padding:0;}
#buy-container .option dd label {margin:5px 10px 5px 0;}
#buy-container .quantity {padding: 10px; margin:10px 0; border:#eee 1px solid; border-width: 1px 0; display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
/* #buy-container .quantity .title {height: 40px; line-height: 40px; font-size: 1.143rem; color: #666}
#buy-container .quantity .digit {vertical-align: middle; margin:0;width: 150px; height: 40px}
#buy-container .quantity .digit label {width: 150px; height: 40px}
#buy-container .quantity .digit a{width: 30px; height: 40px; line-height: 40px;}
#buy-container .quantity .digit input {width: 90px; height: 40px} */
#buy-container .buy-ctrl {padding-top: 20px;}
#buy-container .buy-ctrl button {background: #ff9933; color: #fff; font-size: 1.143rem; text-align: center; padding: 11px 20px; width: 100%;cursor: pointer; border: none}
#buy-container .buy-ctrl button.submit-to-cart {width: 50%;float: left;}
#buy-container .buy-ctrl button.submit-close {background: #1abc9c; color: #fff;}

/* 会员中心 */
/* ================================================ */
.login-wrap {/* background-color: #56b7a4; */ background:#e9d9bc; height: 560px; padding:0;}
.login-wrap .container {position: relative; background: url(../images/login_bg.jpg) no-repeat left center; background-size: 60% auto; height: 560px;}
.login-form {background: #fff; box-shadow:0 0 5px #999; width: 370px; min-height: 300px; padding: 30px; position: absolute; right: 10px; top: 50px;z-index: 990;}
.login-form h1 {font-weight: normal; font-size: 2em; text-align: center; color: #666; height: 50px}
.login-form .msg-warn {background: #fff6d2; border: 1px solid #ffe57d; padding: 2px 10px; /* height: 28px; line-height: 28px; */ color: #666; font-size: 0.857em;}
.login-form .msg-warn i {color: #f8ce33; font-size: 1.5em; vertical-align: middle; margin-right: 5px}
.login-form .msg-error {background-color: #F1DDDD; border-color:#f00; color: #f00}
.login-form .msg-error i {color: #f00}
.login-form form p {display: block; position: relative; margin:15px 0px; border: #ccc 1px solid;}
.login-form form p span {display: block; text-align: right; height: 30px; line-height: 20px;}
.login-form form p span.error {color: #c40e24}
.login-form form p label {display: inline-block; vertical-align: middle; background-color: #f5f5f5; border-right: #ccc 1px solid; text-align: center; width: 48px; height: 45px; line-height: 45px; font-size: 1.571em; color: #999}
.login-form form p b {position: absolute; left: -20px; top: 45px; font-size: 1.286em;color: #c40e24}
.login-form form p input {display: inline-block; vertical-align: middle; width: 240px; height: 45px; line-height: 45px; font-size: 100%; background: #fff; padding:0 5px; border: none}
.login-form form button {display: block; padding:10px 0; width: 100%; font-size: 1.286em}
.login-form form .safe {height: 40px}
.login-form form .auto-login {float: left;}
.login-form form .auto-login input{vertical-align: middle;;}
.login-form form .forget {float: right;}
.login-form .other-login {color: #666; margin:30px auto; text-align: center;}
.login-form .other {border-top: #999 1px dashed; margin-top: 20px; padding: 20px 0 0px 0; text-align: center;}
.login-form .other a {color: #f00; margin:0 30px;}
.login-footer  {border: none}
.login-footer .container {padding-top: 0}

.register-wrap {background:#e5e2d6; /* min-height: 560px; */}
.register-wrap .container {position: relative; overflow: hidden;}
.register-form {padding: 30px;background:#fff; margin: 30px 0 30px auto; /* width: 600px */}
.register-form h1 {font-weight: normal; font-size: 2em; text-align: left; color: #666; height: 50px}
.register-form form p {display: block; position: relative; margin:15px 20px; padding-top:30px;}
.register-form form p span {display: inline-block; text-align: left; height: 45px; line-height: 45px; margin-left: 10px; vertical-align: middle; color: #888}
.register-form form p span.error {color: #c40e24}
.register-form form p label {position: absolute; left:0px; top: 5px;}
.register-form form p b {position: absolute; left: -20px; top: 45px; font-size: 1.286em;color: #c40e24}
.register-form form p input {width: 200px; height: 45px; line-height: 45px; background: #fff; border: #ccc 1px solid; padding:0 20px; vertical-align: middle;}
.register-form form p select {height: 45px; line-height: 45px; padding:0 20px; border: #ccc 1px solid; vertical-align: middle; margin-right: 10px}
.register-form form p button,.register-form .btn {font-size: 1.286em; height: 45px; line-height: 45px; background: #1abc9c; color: #fff; padding:0 50px; margin:30px 20px; display: block; border: none;}
.register-form form p button:hover,.register-form .btn:hover {background: #3a4153; color: #fff;}
.register-form form p.tip {text-align: center; line-height: 2; font-size: 14px;}
.register-form form p.gtip {color: #999; font-size: 12px;}
.register-form form .agree {margin-left: 20px}
.register-form .other {border-top: #999 1px dashed; margin-top: 20px; padding: 20px 0 0px 0; text-align: center;}
.register-form .other a {color: #f00; margin:0 30px;}

.tip-page {padding: 50px; font-size: 1.286rem; text-align: center;}
.tip-page i {font-size: 2.143rem; vertical-align: middle; margin-right: 20px}
.tip-page i.icon-succeed {color:#27AE60}
.tip-page i.icon-failure {color:#E74C3C}
.tip-page i.icon-tip {color:#3498DB}
.tip-page i.icon-warn {color:#F39C12}

.customer-portrait {float: left; width: 200px; height: 200px; background: #f6f6f6; position: relative; overflow: hidden; border-radius: 10px}
.customer-portrait img {width: 200px; height: 200px;}
.customer-portrait a.edit-portrait {position: absolute; z-index: 99; bottom: 0px; right:0; background-color: rgba(0,0,0,0.3); padding: 5px 10px; font-size: 0.857rem; color: #fff; display: none}
.customer-portrait:hover a.edit-portrait {display: block}
.customer-base {float: left; margin-left: 50px}
.customer-base h3 {font-size: 1.286rem; font-weight: normal; padding-bottom: 20px}
.customer-base .edit-link {margin-left: 30px; color: #005ea7; font-size: 1rem; font-weight: normal;}
.customer-base .edit-link i {margin-right: 6px;}
.customer-base .edit-link:hover {color: #f00}
.customer-base h4 {font-size: 1rem; font-weight: normal; color: #666; padding: 3px 0}
.customer-base h4 span {margin-right: 30px}

#profile-form {margin-left: 200px}
.customer-form form p {display: block; position: relative; margin:15px 20px 15px 200px; font-size: 1em;}
.customer-form form p span {display: inline-block; text-align: left; /* height: 45px; line-height: 45px; */ margin:0 10px 0 0; vertical-align: middle; color: #555}
.customer-form form p span.error {color: #c40e24}
.customer-form form p label.input_title {position: absolute; left:-200px; top: 0px; width:190px; font-size: 1rem; color: #666; text-align: right; font-weight: bolder;}
.customer-form form p label.input_radio {margin-right: 20px}
.customer-form form p b {position: absolute; left: -20px; top: 45px; font-size: 1.286rem;color: #c40e24}
.customer-form form p input.input_text {width: 200px; height: 45px; line-height: 45px; background: #fff; border: #ccc 1px solid; padding:0 10px; vertical-align: middle;font-size: 1rem;}
.customer-form form p select {height: 45px; line-height: 45px;font-size: 1rem; padding:0 20px; border: #ccc 1px solid; vertical-align: middle; margin-right: 10px}
.customer-form form p textarea {background: #fff; border: #ccc 1px solid; padding: 10px; width: 90%; height: 200px}
.customer-form form p button,.customer-form .btn {font-size: 1.286rem; height: 45px; line-height: 45px; background: #f00; color: #fff; padding:0 50px; margin:30px 0px; display: inline-block; border: none; text-align: center;}
.customer-form form p button:hover,.customer-form .btn:hover {background: #3a4153; color: #fff;}
.customer-form form p .cancel-link {margin-left: 20px}
.customer-form form p.tip {text-align: center; line-height: 2; font-size: 14px;}
.customer-form form p.gtip {color: #999; font-size: 12px;}

.customer-portrait-box {float: left; width: 200px;}
.customer-portrait-box .customer-portrait {float: none;}
#portrait-editor {float:left; width:500px; margin:0 10px 0 50px;}
#cut-img {position:relative; display: none}
#portrait-editor h3 {margin:0; padding:0 0 10px 0; display:block; font-size:10pt; border:none; border-bottom:#CCC 1px dashed;}
#portrait-editor h4 {color:#999; font-size:9pt; font-weight:normal; margin:10px 0 5px 0;}
#cut-photo {text-align:center; background:url(../images/loading.gif) center center no-repeat; position:relative; min-height:200px; _height:200px;}
#cut-photo img{width: 100%}
#cut-ctrl {padding:0px 0 20px 0;margin-bottom: 20px}
#cut-ctrl .btn {padding:10px; width: 100%}
#recut-ctrl {padding:10px 0 0 0; text-align: center;}
#recut-ctrl input {margin-right: 10px; vertical-align: middle;}

#portrait-editor #select-file {width:500px; margin:0 auto 20px auto;}
.imgareaselect-border1 {background: url(../images/border-anim-v.gif) repeat-y left top;}
.imgareaselect-border2 {background: url(../images/border-anim-h.gif) repeat-x left top;}
.imgareaselect-border3 {background: url(../images/border-anim-v.gif) repeat-y right top;}
.imgareaselect-border4 {background: url(../images/border-anim-h.gif) repeat-x left bottom;}
.imgareaselect-border1, .imgareaselect-border2,.imgareaselect-border3, .imgareaselect-border4 { zoom:1; opacity: 0.5; filter: alpha(opacity=50);}
.imgareaselect-handle {background-color: #fff; border: solid 1px #000; zoom:1; opacity: 0.5; filter: alpha(opacity=50);}
.imgareaselect-outer {background-color: #000; zoom:1; opacity: 0.5; filter: alpha(opacity=50);}
.imgareaselect-selection {}
.webuploader-element-invisible {position: absolute !important;clip: rect(1px 1px 1px 1px); /* IE6, IE7 */clip: rect(1px,1px,1px,1px);}
.webuploader-pick {position: relative;display: inline-block;cursor: pointer;background: #00b7ee;padding: 10px 15px;color: #fff;text-align: center;border-radius: 3px;overflow: hidden;}
.webuploader-pick-hover {background: #00a2d4;}
.webuploader-pick-disable {opacity: 0.6;pointer-events:none;}

.upload-control {padding:5px 0px; margin:0; display:block; height:70px;}
.upload-control label {float:left;}
.select-file {padding:10px; background:#f5f5f5; overflow:hidden; position:relative; z-index:0;border:#ccc 1px dashed; cursor:pointer; text-align: center;}
.select-file:hover {border:#09F 1px dashed;}
.select-file .webuploader-container {width:150px; height:50px; margin: 0 auto 10px auto; cursor:pointer;}
.select-file .webuploader-pick {width:100%; height:50px; line-height: 30px; cursor:pointer;}
.select-file .webuploader-pick-hover {background: #f00;}
.select-file .webuploader-pick-disable {opacity: 0.6;pointer-events:none;}
.select-file .select-info {padding:10px 0 6px 0; text-align:center; width:100%; line-height:1.8; font-size:12px; color:#888}
.select-file .select-info span {color:#22a6e8; display:inline; font-size:14px;}
.select-file .upprogress {width:0px; height:67px; cursor:pointer; position:absolute; left:0; top:0; z-index:3;opacity:.3;filter:alpha(opacity=30); background:#6C6;}
.select-file object {cursor:pointer}
#upload-upprogress {position: absolute; bottom: 0; left:0; height: 3px; background: #f00; width: 0%;}
#upload-error {color: #f00; text-align: center;}
#upload-error span {padding: 10px;}

.address-wrap {}
.address-list {margin: 10px 0; padding: 0px; border: #eee 2px solid; position: relative;}
.address-list h3 {padding:0 10px; margin-bottom: 20px}
.address-list h3 em {display: inline-block; padding:3px 6px; background: #f00; color: #fff; font-size: 0.857rem; font-weight: normal; vertical-align: middle; font-style: normal;}
.address-list .customer-form {padding: 10px;}
.address-list .customer-form p {margin:6px 20px 6px 200px;}
.address-list .edit-link {margin-left: 30px; color: #005ea7; font-size: 1rem; font-weight: normal;}
.address-list .edit-link i {margin-right: 6px;}
.address-list .edit-link:hover {color: #f00}
.address-list .default-link {position:absolute; bottom: 10px; right:10px; color: #005ea7; font-size: 1rem; font-weight: normal;}
.address-list .close{position:absolute;width:30px;height:30px;background-color: #fff; background-color: rgba(250,250,250,0.9); border-radius: 30px; font-size: 18px; line-height: 30px; overflow: hidden; color:#aaa;cursor:pointer;top:10px;right:10px;text-align:center; z-index: 99; /* line-height:16px;font-family:"Microsoft Yahei";font-size:1.429rem;background:none; */}
.address-list .close:hover {background-color:#e4393c;color: #fff}
.add-address-btn {font-size: 1rem; height: 30px; line-height: 30px; background: #1abc9c; color: #fff; padding:0 20px; margin:10px 0px; display: block; border: none; width: 160px; text-align: center;}
.add-address-btn:hover {background: #3a4153; color: #fff;}
.add-address-btn i {margin-right: 10px}


.overlay{position:absolute;z-index:99990;top:0px;left:0px;height:100%;width:100%;background:#000;display:none;}
.popwindow{width:600px;padding-bottom:2px;background:#FFF;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;box-shadow:0px 0px 4px rgba(0,0,0,0.7);-webkit-box-shadow:0 0 4px rgba(0,0,0,0.7);-moz-box-shadow:0 0px 4px rgba(0,0,0,0.7); position:absolute; left:50%; z-index:99991; opacity:0;filter:alpha(opacity=0);}
.popwindow-header{background:url(../images/hd-bg.png?v=1);padding:10px 15px 8px 15px;border-bottom:1px solid #CCC;border-radius:5px 5px 0 0}
.popwindow-header  h2{color:#444;font-size:18px;font-weight:700;margin-bottom:3px;text-shadow:1px 1px 0 rgba(255,255,255,0.5);}
.popwindow-header  p{color:#444;font-size:12px;margin:0;text-shadow:1px 1px 0 rgba(255,255,255,0.5);text-shadow:none;}
.popwindow .txtBox{position:relative;padding:14px 20px;border-bottom:1px solid #EEE;}
.popwindow .btnBox{overflow:hidden;padding:12px 20px 12px 140px;}
.popwindow .txtBox label{display:block;float:left;width:120px;font-size:14px;padding-top:8px;color:#222;text-align:left;}
.popwindow .txtBox input,.txtBox textarea{width:244px;padding:8px;border-radius:4px;-moz-border-radius:4px;-webkit-border-radius:4px;font-size:1.2em;color:#222;background:#F7F7F7;outline:none;border-top:1px solid #CCC;border-left:1px solid #CCC;border-right:1px solid #E7E6E6;border-bottom:1px solid #E7E6E6;}
.txtBox textarea {width:380px;}
.popwindow .loader {padding: 30px; background:url(../images/loading.gif) center center no-repeat; }
.popwindow .txtBox input.good_input{background:#DEF5E1 url(../images/good.png?v=1) 236px center no-repeat;}
.popwindow .txtBox input.error_input{background:#FDE0E0;}
p.error{position:absolute;bottom:48px;right:20px;width:262px;color:#FFF;font-size:1.1em;padding-bottom:5px;background:url(../images/error-arw.png?v=1) 20px bottom no-repeat;text-align:left;margin:0;text-shadow:none;}
p.error span{display:inline-block;background:#D43636;padding:6px;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;}
.txtBox input:focus,.txtBox textarea:focus{background:#FAF9DC;}
.popwindow .form textarea {width:100%}
.popwindow .btnBox button{background:#3F9D4A;border:none;width:auto;overflow:visible;font-size:1.4em;color:#FFF;padding:7px 10px;border-radius:4px;-webkit-border-radius:4px;-moz-border-radius:4px;font-weight:bold;text-shadow:0 1px 0 rgba(0,0,0,0.4);margin-right:20px;font-family:'微软雅黑','宋体',Arial, Helvetica, sans-serif; cursor:pointer;}
.popwindow .btnBox button.btn1 {background:#59b5e4}
.popwindow .btnBox button.btn2 {background:#DFDFDF}
.pop-close{position:absolute;top:12px;right:12px;display:block;width:14px;height:14px;overflow:hidden;background:url(../images/close.png?v=1);z-index:2;}
.popwindow .table_form {position: relative;}
.popwindow .table_form td.title {text-align:right;width:100px}
.popwindow td .select-file,.popwindow td .select-file .selectInfo,.popwindow td .select-file .flashBtn {width:100%; background-image:none;}
/*.popwindow td .select-file {border:#ccc 1px dashed;}*/
/*.popwindow td textarea {width:100%} */
.popwindow .popBody {padding:17px;}
.popwindow .main_body {min-height: 300px}


.article-info {padding: 20px}
.article-info h1 {font-size: 25px; font-weight: normal; line-height: 1.8}
.article-copyform {padding: 20px 0; color: #999}
.article-copyform span {margin-right: 20px}
.article-copyform a {color: #999}
.article-content {padding: 20px 0; color: #000; font-size: 14px; line-height: 1.8}
.article-content p {color: #000; font-size: 16px; line-height: 1.8 !important; padding: 10px 0;}
.article-content img {max-width: 98%}
/* ================================================ */
/* 评论 */
.rating {position: relative; letter-spacing: 5px; font-size: 22px; width: 130px; overflow: hidden; color: #e5e5e5;line-height: 1; white-space:nowrap;}
.rating i {cursor: pointer; vertical-align: middle;}
.rating p {position: absolute; left:0; top: 0; width: 90%; color: #1ABC9C; overflow: hidden; margin: 0; padding: 0;line-height: 1;}
.rating span {display: inline-block; vertical-align: middle;}
.rating-wrap .rating,.rating-wrap .rating-num {display: inline-block; vertical-align: middle;}
.rating-wrap .rating p {color: #f00;}
.rating-wrap .rating-num {background: #eee; color: #666; font-size: 12px; border-radius: 20px 20px 20px 0px; padding:0px 10px;}

#score-bar {height:24px; line-height:24px; float:left}
#score-bar img {margin:0 5px 0 0; float:left; cursor:pointer;}
#score-bar span {color:#F90; font-size:18px; margin:0 0 0 10px; font-style:normal; height:24px; float:left}
#score-bar span em {font-size:24px; font-style:normal;}

.score-star {width:105px; height:20px; background:url(../images/star.png) 0 -20px no-repeat; float:left; overflow:hidden; cursor:pointer;}
.score-star span {width:0%; height:20px; background:url(../images/star.png) no-repeat; display:block; text-indent:-99999px;}
.score-star1 {width:70px; height:15px; background:url(../images/star.png) 0 -54px; float:left; overflow:hidden; cursor:pointer;}
.score-star1 span {width:0%; height:15px; background:url(../images/star.png) 0 -40px; display:block; text-indent:-99999px;}
.num-bar {height:10px; width:100px; background:#e5e5e5; /* float:left; */ overflow:hidden; margin:5px 5px 0 0;}
.num-bar span {height:20px; display:block; text-indent:-99999px; background:#1ABC9C}

.score-box {clear:both; margin: 20px 0; padding:0 0 20px 440px; min-height:100px; _height:100px; position:relative}
.score-list {width:420px; height:170px; position:absolute; left:0; top:0;}
.score-list p.tip {color: #888;clear: both; padding: 5px 0}
.score-list li {height:30px; line-height:30px; padding:5px 0; clear: both; color:#666}
.score-list li .score-title {color: #2C3E50}
.score-list li .rating {}
.score-list li span.score {color:#F90; font-size:15px; padding:0 5px; }
.score-list li span.score em {font-size:20px; font-style:normal}
.score-list li .score-title,.score-list li .rating,.score-list li span.score,.score-list li .num-bar {display: inline-block; vertical-align: middle;/* float:left; */}

.comment .score-list {height: 60px; position: static;}
.comment .score-list .score-title {color: #666; display: block; }

.comment .rating-warp {color: #666;height: 70px;}
.comment .rating,.comment-list .rating {color: #bbb;}
.comment .rating p,.comment-list .rating p {color: #f00;}

.comment {margin:20px 0 0 0; clear:both; /* background:#f5f5f5; border:#e1f6ff 1px solid; */ padding:10px 0; overflow:hidden;}
.comment h3 {font-size:18px; height:35px; border-bottom: #ccc 1px solid}
.comment form,.comment-list li,.comment-list li .bubble {margin:20px 0 0 80px; padding: 10px; position: relative; min-height:150px; background: #f5f5f5; border-radius: 5px }
.comment .user,.comment-list li .user {position: absolute; left:-80px; top: 0px; width: 80px; height: 80px;}
.comment .user img,.comment-list li .user img {width: 60px; height: 60px; border-radius: 5px;}
.comment i.arrow,.comment-list li i.arrow {position:absolute; left:-20px; top:15px; width:0; height:0; border-color:transparent #f5f5f5 transparent transparent; _border-color:red #f5f5f5 red red; _filter:chroma(color=red); border-width:10px; border-style:solid; font-size:0; line-height:0;}
.comment-list li ul li i.arrow {position:absolute; left:-12px; top:10px; width:0; height:0; border-color:transparent #f5f5f5 transparent transparent; _border-color:red #f5f5f5 red red; _filter:chroma(color=red); border-width:6px; border-style:solid; font-size:0; line-height:0;}
.comment textarea {border:#eee 1px solid; vertical-align:text-top; height:100px; width:100%; padding:5px; color:#666; word-break:break-all; overflow:auto; resize:vertical;}
.comment p.btn_box {margin:8px 0 0 0; text-align: right;}
.comment p.btn_box span {float: left; color: #f00}
.comment button {padding: 6px 20px}
.comment-list {margin:20px 0 0 0; padding: 10px; clear:both;}
.comment-loading {height: 100px; background: url(../images/loading.gif) no-repeat center center;}
.comment-list li {min-height: 60px;margin:10px 0 0 70px; padding: 0; background:transparent;}
.comment-list li .bubble {margin: 0;padding:10px;min-height: 60px; position: static;}
.comment-list li .user {left:-70px; top: 0px; width: 60px; height: 60px;}
.comment-list li .user img {width: 50px; height: 50px;}
.comment-list li .content {color: #666; line-height: 1.7; padding-bottom:10px; font-size: 14px;}
.comment-list li .content a {color: #555}
.comment-list li .bar {border-top: #cfcfcf 1px dashed; font-size: 12px; border-radius: 0 0 5px 5px; padding-top:10px;}
.comment-list li .bar span {color: #999}
.comment-list li .bar a {float: right; margin: 0 0 0 20px; color: #999}
.comment-list li .bar a:hover {color: #0086CE}
.comment-list li .bar a i {margin: 0 3px 0 0}
.comment-list li .bar a.inform {color:#bbb;}
.comment-list li .bar a.inform:hover {color:#000;}
.comment-list li .reply {clear: both; padding: 10px}
.comment-list li .reply textarea {border:#ccc 1px solid; vertical-align:text-top; height:30px; width:100%; padding:5px; color:#666; word-break:break-all; overflow:auto;resize:vertical;}
.comment-list li .reply .btn_bar {height: 30px; text-align: right; padding: 6px 0 0 0} 
.comment-list li .reply .btn_bar a {color:#999; margin: 0 10px 0 0}
.comment-list li .reply .btn_bar span {float: left; color: #f00}
.comment-list li ul {border-left:#f9f9f9 3px solid;padding:0 0 0 5px; margin:10px 0px;}
.comment-list li ul li {min-height:30px;margin:5px 0 5px 45px;}
.comment-list li ul li .bubble {min-height: 30px;}
.comment-list li ul li .user {left:-45px; width: 30px; height: 30px;}
.comment-list li ul li .user img {width: 30px; height: 30px;}
.comment-list li ul li .content {/* padding:0 10px; */}
.comment-list li ul li .content span {margin:0 0 0 10px; color:#999}
.comment-list li.more {margin:10px 0 0 0;height:38px;line-height:38px; padding: 0; background:#f1f1f1;border:#f1f1f1 1px solid; min-height: 38px; color: #333; text-align:center;cursor: pointer;}
.comment-list li.more:hover {background:#ecf2f3;}
.comment-list .loader {}
.comment-empty {padding: 20px; text-align: center;color: #666}
.comment-empty a {color:#666}


/* ================================================ */
.irs-line-mid,.irs-line-left,.irs-line-right,.irs-diapason,.irs-slider{background:url(../images/sprite-skin-flat.png) repeat-x;}
.irs{height:40px;}
.irs-with-grid{height:60px;}
.irs-line{height:12px;top:25px;}
.irs-line-left{height:12px;background-position:0 -30px;}
.irs-line-mid{height:12px;background-position:0 0;}
.irs-line-right{height:12px;background-position:100% -30px;}
.irs-diapason{height:12px;top:25px;background-position:0 -60px;}
.irs-slider{width:16px;height:18px;top:22px;background-position:0 -90px;}
#irs-active-slider,.irs-slider:hover{background-position:0 -120px;}
.irs-min,.irs-max{color:#999;font-size:10px;line-height:1.333;text-shadow:none;top:0;padding:1px 3px;background:#e1e4e9;border-radius:4px;}
.irs-from,.irs-to,.irs-single{color:#fff;font-size:10px;line-height:1.333;text-shadow:none;padding:1px 5px;background:#ed5565;border-radius:4px;}
.irs-from:after,.irs-to:after,.irs-single:after{position:absolute;display:block;content:"";bottom:-6px;left:50%;width:0;height:0;margin-left:-3px;overflow:hidden;border:3px solid transparent;border-top-color:#ed5565;}
.irs-grid-pol{background:#e1e4e9;}
.irs-grid-text{color:#999;}
/* ================================================ */

.slider-container{width:300px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;}
.slider-container .back-bar{height:10px;position:relative;}
.slider-container .back-bar .selected-bar{position:absolute;height:100%;}
.slider-container .back-bar .pointer{position:absolute;width:10px;height:10px;background-color:red;cursor:col-resize;opacity:1;z-index:2;}
.slider-container .back-bar .pointer.last-active{z-index:3;}
.slider-container .back-bar .pointer-label{position:absolute;top:-17px;font-size:8px;background:white;white-space:nowrap;line-height:1;}
.slider-container .back-bar .focused{z-index:10;}
.slider-container .clickable-dummy{cursor:pointer;position:absolute;width:100%;height:100%;z-index:1;}
.slider-container .scale{top:2px;position:relative;}
.slider-container .scale span{position:absolute;height:5px;border-left:1px solid #999;font-size:0;}
.slider-container .scale ins{font-size:9px;text-decoration:none;position:absolute;left:0;top:5px;color:#999;line-height:1;}
.slider-container.slider-readonly .clickable-dummy,.slider-container.slider-readonly .pointer{cursor:auto;}
.theme-green .back-bar{height:5px;border-radius:2px;background-color:#eeeeee;background-color:#e7e7e7;background-image:-moz-linear-gradient(top,#eeeeee,#dddddd);background-image:-webkit-gradient(linear,0 0,0 100%,from(#eeeeee),to(#dddddd));background-image:-webkit-linear-gradient(top,#eeeeee,#dddddd);background-image:-o-linear-gradient(top,#eeeeee,#dddddd);background-image:linear-gradient(to bottom,#eeeeee,#dddddd);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee',endColorstr='#ffdddddd',GradientType=0);}
.theme-green .back-bar .selected-bar{border-radius:2px;background-color:#FE1A43;background-image:-moz-linear-gradient(top,#FD5050,#FE0808);background-image:-webkit-gradient(linear,0 0,0 100%,from(#FD5050),to(#FE0808));background-image:-webkit-linear-gradient(top,#FD5050,#FE0808);background-image:-o-linear-gradient(top,#FD5050,#FE0808);background-image:linear-gradient(to bottom,#FD5050,#FE0808);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffbdfade',endColorstr='#ff76fabc',GradientType=0);}
.theme-green .back-bar .pointer{width:14px;height:14px;top:-5px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border-radius:10px;border:1px solid #AAA;background-color:#e7e7e7;background-image:-moz-linear-gradient(top,#eeeeee,#dddddd);background-image:-webkit-gradient(linear,0 0,0 100%,from(#eeeeee),to(#dddddd));background-image:-webkit-linear-gradient(top,#eeeeee,#dddddd);background-image:-o-linear-gradient(top,#eeeeee,#dddddd);background-image:linear-gradient(to bottom,#eeeeee,#dddddd);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee',endColorstr='#ffdddddd',GradientType=0);}
.theme-green .back-bar .pointer-label{color:#999;}
.theme-green .back-bar .focused{color:#333;}
.theme-green .scale span{border-left:1px solid #e5e5e5;}
.theme-green .scale ins{color:#999;}
.theme-blue .back-bar{height:5px;border-radius:2px;background-color:#eeeeee;background-color:#e7e7e7;background-image:-moz-linear-gradient(top,#eeeeee,#dddddd);background-image:-webkit-gradient(linear,0 0,0 100%,from(#eeeeee),to(#dddddd));background-image:-webkit-linear-gradient(top,#eeeeee,#dddddd);background-image:-o-linear-gradient(top,#eeeeee,#dddddd);background-image:linear-gradient(to bottom,#eeeeee,#dddddd);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee',endColorstr='#ffdddddd',GradientType=0);}
.theme-blue .back-bar .selected-bar{border-radius:2px;background-color:#92c1f9;background-image:-moz-linear-gradient(top,#b1d1f9,#64a8f9);background-image:-webkit-gradient(linear,0 0,0 100%,from(#b1d1f9),to(#64a8f9));background-image:-webkit-linear-gradient(top,#b1d1f9,#64a8f9);background-image:-o-linear-gradient(top,#b1d1f9,#64a8f9);background-image:linear-gradient(to bottom,#b1d1f9,#64a8f9);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffb1d1f9',endColorstr='#ff64a8f9',GradientType=0);}
.theme-blue .back-bar .pointer{width:14px;height:14px;top:-5px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border-radius:10px;border:1px solid #AAA;background-color:#e7e7e7;background-image:-moz-linear-gradient(top,#eeeeee,#dddddd);background-image:-webkit-gradient(linear,0 0,0 100%,from(#eeeeee),to(#dddddd));background-image:-webkit-linear-gradient(top,#eeeeee,#dddddd);background-image:-o-linear-gradient(top,#eeeeee,#dddddd);background-image:linear-gradient(to bottom,#eeeeee,#dddddd);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee',endColorstr='#ffdddddd',GradientType=0);}
.theme-blue .back-bar .pointer-label{color:#999;}
.theme-blue .back-bar .focused{color:#333;}
.theme-blue .scale span{border-left:1px solid #e5e5e5;}
.theme-blue .scale ins{color:#999;}

/* ================================================ */

.swiper-button-next,.swiper-button-prev {width: 50px; height: 37px; margin-top: -18px; background-color: rgba(250,250,250,0.9); border: #000 2px solid; background-size: 10px 17px; display: block;}
.swiper-m-button {width: 36px; height: 60px; margin-top: -30px; background-size: 20px 33px;}
/* .swiper-button-next:hover,.swiper-button-prev:hover {background-color: #f00;} */
.swiper-container .swiper-button-next {-webkit-animation:rightFadeOut .3s ease-in-out alternate;animation:rightFadeOut .3s ease-in-out alternate forwards;}
.swiper-container .swiper-button-prev {-webkit-animation:leftFadeOut .3s ease-in-out alternate;animation:leftFadeOut .3s ease-in-out alternate forwards;}
.swiper-container:hover .swiper-button-next {display: block;-webkit-animation:rightFadeIn .3s ease-in-out alternate;animation:rightFadeIn .5s ease-in-out alternate;}
.swiper-container:hover .swiper-button-prev {display: block;-webkit-animation:leftFadeIn .3s ease-in-out alternate;animation:leftFadeIn .5s ease-in-out alternate;}

.animate {-webkit-animation-duration: 2s;animation-duration: 2s;-webkit-animation-fill-mode: forwards;animation-fill-mode: forwards; display: block;-webkit-transform-style: preserve-3d;transform-style: preserve-3d;}
.animate.fast {-webkit-animation-duration: 1s;animation-duration: 1s;}
.animate.slow {-webkit-animation-duration: 3.0s;animation-duration: 3.0s;}
.animate.lslow {-webkit-animation-duration: 4.0s;animation-duration: 4.0s;}
@-webkit-keyframes leftFadeIn {0%{opacity:0;-webkit-transform: translateX(-100%);}100%{opacity:1;-webkit-transform: translateX(0)}}
@keyframes leftFadeIn {0%{opacity:0;transform: translateX(-100%);}100%{opacity:1;transform: translateX(0)}}
.leftFadeIn {-webkit-animation-name: leftFadeIn;animation-name: leftFadeIn;}
@-webkit-keyframes rightFadeIn {0%{opacity:0;-webkit-transform: translateX(100%);}100%{opacity:1;-webkit-transform: translateX(0)}}
@keyframes rightFadeIn {0%{opacity:0;transform: translateX(100%);}100%{opacity:1;transform: translateX(0)}}
.rightFadeIn {-webkit-animation-name: rightFadeIn;animation-name: rightFadeIn;}
@-webkit-keyframes leftFadeOut {0%{opacity:1;-webkit-transform: translateX(0);}100%{opacity:0;-webkit-transform: translateX(-100%)}}
@keyframes leftFadeOut {0%{opacity:1;transform: translateX(0);}100%{opacity:0;transform: translateX(-100%)}}
.leftFadeOut {-webkit-animation-name: leftFadeOut;animation-name: leftFadeOut;}
@-webkit-keyframes rightFadeOut {0%{opacity:1;-webkit-transform: translateX(0);}100%{opacity:0;-webkit-transform: translateX(100%)}}
@keyframes rightFadeOut {0%{opacity:1;transform: translateX(0);}100%{opacity:0;transform: translateX(100%)}}
.rightFadeOut {-webkit-animation-name: rightFadeOut;animation-name: rightFadeOut;}
@-webkit-keyframes upFadeIn {0%{opacity:0;-webkit-transform: translateY(20%);}100%{opacity:1;-webkit-transform: translateY(0)}}
@keyframes upFadeIn {0%{opacity:0;transform: translateY(20%);}100%{opacity:1;transform: translateY(0)}}
.upFadeIn {-webkit-animation-name: upFadeIn;animation-name: upFadeIn;}
@-webkit-keyframes downIn {0%{opacity:0;-webkit-transform: translateY(100%);}100%{opacity:1;-webkit-transform: translateY(0)}}
@keyframes downIn {0%{opacity:0;transform: translateY(100%);}100%{opacity:1;transform: translateY(0)}}
.downIn {-webkit-animation-name: downIn;animation-name: downIn;}
@-webkit-keyframes downOut {0%{opacity:1;-webkit-transform: translateY(0);}100%{opacity:0;-webkit-transform: translateY(100%)}}
@keyframes downOut {0%{opacity:1;transform: translateY(0);}100%{opacity:0;transform: translateY(100%)}}
.downOut {-webkit-animation-name: downOut;animation-name: downOut;}
@-webkit-keyframes zoomIn {0%{opacity:0.5;-webkit-transform:scale(1.2);}100%{opacity:1;-webkit-transform: scale(1)}}
@keyframes zoomIn {0%{opacity:0.5;transform: scale(1.2);}100%{opacity:1;transform: scale(1)}}
.zoomIn {-webkit-animation-name: zoomIn;animation-name: zoomIn;}
@-webkit-keyframes zoomOut {0%{opacity:1;-webkit-transform:scale(1);}100%{opacity:0.5;-webkit-transform: scale(1.2)}}
@keyframes zoomOut {0%{opacity:1;transform: scale(1);}100%{opacity:0.5;transform: scale(1.2)}}
.zoomOut {-webkit-animation-name: zoomOut;animation-name: zoomOut;}

@-webkit-keyframes spin {
	0% { -webkit-transform: rotate(0deg); transform: rotate(0deg) }
	100% { -webkit-transform: rotate(359deg); transform: rotate(359deg) }
}
@keyframes spin {
	0% { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg) }
	100% { -webkit-transform: rotate(359deg); -ms-transform: rotate(359deg); transform: rotate(359deg) }
}
@-webkit-keyframes wrench {
	0% { -webkit-transform: rotate(-12deg); transform: rotate(-12deg) }
	8% { -webkit-transform: rotate(12deg); transform: rotate(12deg) }
	10% { -webkit-transform: rotate(24deg); transform: rotate(24deg) }
	18%,
	20% { -webkit-transform: rotate(-24deg); transform: rotate(-24deg) }
	28%,
	30% { -webkit-transform: rotate(24deg); transform: rotate(24deg) }
	38%,
	40% { -webkit-transform: rotate(-24deg); transform: rotate(-24deg) }
	48%,
	50% { -webkit-transform: rotate(24deg); transform: rotate(24deg) }
	58%,
	60% { -webkit-transform: rotate(-24deg); transform: rotate(-24deg) }
	68% { -webkit-transform: rotate(24deg); transform: rotate(24deg) }
	100%,
	75% { -webkit-transform: rotate(0deg); transform: rotate(0deg) }
}
@keyframes wrench {
	0% { -webkit-transform: rotate(-12deg); -ms-transform: rotate(-12deg); transform: rotate(-12deg) }
	8% { -webkit-transform: rotate(12deg); -ms-transform: rotate(12deg); transform: rotate(12deg) }
	10% { -webkit-transform: rotate(24deg); -ms-transform: rotate(24deg); transform: rotate(24deg) }
	18%,
	20% { -webkit-transform: rotate(-24deg); -ms-transform: rotate(-24deg); transform: rotate(-24deg) }
	28%,
	30% { -webkit-transform: rotate(24deg); -ms-transform: rotate(24deg); transform: rotate(24deg) }
	38%,
	40% { -webkit-transform: rotate(-24deg); -ms-transform: rotate(-24deg); transform: rotate(-24deg) }
	48%,
	50% { -webkit-transform: rotate(24deg); -ms-transform: rotate(24deg); transform: rotate(24deg) }
	58%,
	60% { -webkit-transform: rotate(-24deg); -ms-transform: rotate(-24deg); transform: rotate(-24deg) }
	68% { -webkit-transform: rotate(24deg); -ms-transform: rotate(24deg); transform: rotate(24deg) }
	100%,
	75% { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg) }
}
.pulse {-webkit-animation: pulse 2s linear infinite; animation: pulse 2s linear infinite}
@-webkit-keyframes pulse {
	0% { -webkit-transform: scale(1.1); transform: scale(1.1) }
	50% { -webkit-transform: scale(0.8); transform: scale(0.8) }
	100% { -webkit-transform: scale(1.1); transform: scale(1.1) }
}
@keyframes pulse {
	0% { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1) }
	50% { -webkit-transform: scale(0.8); -ms-transform: scale(0.8); transform: scale(0.8) }
	100% { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1) }
}
/* cloud-zoom 插件 */
/* .cloud-zoom-lens {border:1px solid #ededed;margin:-1px;background-color:#fff;cursor:move;}
.cloud-zoom-title {font-family:Arial, Helvetica, sans-serif;position:absolute !important;background-color:#000;color:#fff;padding:3px;width:100%;text-align:center;font-weight:bold;font-size:10px;top:0px;}
.cloud-zoom-big {margin-left:10px; background-repeat:no-repeat; background-color:#ffffff;border:2px solid #white;overflow:hidden; -moz-box-shadow:0 0 10px #ddd; -webkit-box-shadow:0 0 10px #ddd; box-shadow:0 0 10px #ddd;}
.cloud-zoom-loading {color:white;background:#222;padding:3px;border:1px solid #000;} */
div.zoomDiv{z-index:999;position:absolute;top:0px;left:0px;width:500px;height:400px;background:#fff;border:1px solid #ccc;display:none;text-align:center;overflow:hidden;}
div.zoomMask{position:absolute;background:#fff;opacity: 0.3;filter: alpha(opacity=30); cursor:move;z-index:1;}

/** Preloader
 **************************************************************** **/
#preloader {
    position: fixed;
    z-index: 9999999;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: #fff;
}

.inner {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    width: 54px;
    height: 54px;
    margin: auto;
}

.page-loader {
    display: block;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: #fefefe;
    z-index: 100000;
}

#preloader span.loader {
    width: 50px;
    height: 50px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -25px 0 0 -25px;
    font-size: 10px;
    text-indent: -12345px;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    border-right: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    border-left: 1px solid rgba(0, 0, 0, 0.5);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    -webkit-animation: spinner 700ms infinite linear;
    -moz-animation: spinner 700ms infinite linear;
    -ms-animation: spinner 700ms infinite linear;
    -o-animation: spinner 700ms infinite linear;
    animation: spinner 700ms infinite linear;
    z-index: 100001;
}

@-webkit-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-moz-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-o-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}



