@charset "utf-8"; html, body, div, ul, li, ol, dl, dt, dd, h1, h2, h3, h4, h5, img, p, form, input, textarea, select {margin: 0; padding: 0 } li {list-style: none } i, em {font-style: normal } h1, h2, h3, h4, h5 {font-size: 100%; font-weight: 400 } img {border: 0 } a {text-decoration: none } input {outline: 0 } input:-webkit-autofill {-webkit-box-shadow: 0 0 0 100px #f5f5f5 inset } html, body {width: 100%; height: 100%; font-size: 20px; font-family: "Helvetica Neue", Helvetica, STHeiTi, sans-serif; background: #f2f2f2 } img {-webkit-touch-callout: none } a {text-decoration: none; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; -webkit-user-select: none } img {max-width: 100% } .clearfix, .clear {zoom: 1 } .clearfix:after, .clear:after, .clearfix:before, .clear:before {content: ''; display: table; clear: both } .lh0 {line-height: 0 } .bb {display: block; border-bottom: 1px solid #ccc; height: 1px } .hide {display: none } .bb666 {border-bottom: 1px solid #666; height: 1px } .mt36 {margin-top: 1.8em } .mb36 {margin-bottom: 1.8em } .mt24 {margin-top: 1.2em } .mb20 {margin-bottom: 1em } .mhr {margin: 0 2em } @media only screen and (max-width:300px) {html, body {font-size: 9.375px } } @media only screen and (max-width:310px) and (min-width:300px) {html, body {font-size: 9.375px } } @media only screen and (max-width:320px) and (min-width:310px) {html, body {font-size: 9.6875px } } @media only screen and (max-width:350px) and (min-width:320px) {html, body {font-size: 10px } } @media only screen and (max-width:360px) and (min-width:350px) {html, body {font-size: 10.9375px } } @media only screen and (max-width:400px) and (min-width:360px) {html, body {font-size: 11.25px } } @media only screen and (max-width:470px) and (min-width:400px) {html, body {font-size: 12.5px } } @media only screen and (max-width:480px) and (min-width:470px) {html, body {font-size: 14.6875px } } @media only screen and (max-width:540px) and (min-width:480px) {html, body {font-size: 15px } } @media only screen and (max-width:560px) and (min-width:540px) {html, body {font-size: 16.875px } } @media only screen and (max-width:570px) and (min-width:560px) {html, body {font-size: 17.5px } } @media only screen and (max-width:630px) and (min-width:570px) {html, body {font-size: 17.8125px } } @media only screen and (max-width:640px) and (min-width:630px) {html, body {font-size: 19.6875px } } @media only screen and (min-width:640px) {html, body {font-size: 20px } } img {width: 100% } .wrap {max-width: 640px; margin: 0 auto; overflow: hidden } .nav {line-height: 0; background: #b81b22; margin: 0 auto; position: relative; height: 4.4em } .nav a {display: inline-block; line-height: 0 } .nav img {width: 2.4em; height: 2.4em } .nav .left {position: absolute; left: 1.2em; top: 1em } .nav .right {position: absolute; right: 1.7em; top: 1em } .nav .middle {margin-left: 7.4em; margin-right: 8.5em; text-align: center; padding-top: 1.4em } .nav .middle span {display: block; font-size: 1.6em; line-height: 1em; height: 1em; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis } .nav .home {margin-right: 1.4em } .nav .car {position: relative; margin-right: 2em } .nav .car span {position: absolute; font-size: .6em; line-height: 1em; color: #b81b22; top: -2px; right: -2px; padding: 1px 2px; background: #fff } .list-tab {margin: 2px 0 } .list-tab li {float: left; background: #fff; padding: 1em 0; margin-right: 2px; width: 25%; overflow: hidden } .list-tab li:last-child {margin-right: -3px } .list-tab li:first-child {margin-left: -3px } .list-tab a {display: block; text-decoration: none; color: #4c4c4c; font-size: 1.3em; line-height: 1em; text-align: center } .list-tab .active {color: #b81b22 } .list-tab .price a {position: relative } .list-tab .price-bg {position: absolute; width: .6em; height: 1em } .unit {padding-bottom: 2px } .unit .left {float: left; width: 50%; margin-left: -1px; background: #fff } .unit .right {float: right; width: 50%; margin-right: -1px; background: #fff } .unit a {display: block } .unit .text, .unit .price {color: #4c4c4c; text-align: center } .unit .text {text-overflow: ellipsis; overflow: hidden; white-space: nowrap } .unit .price {font-size: 1.2em; line-height: 1.5em } .unit .pic {padding: 1.75em } .pager-wrap {text-align: center; padding: 3.5em 0 } .pager {display: inline-block } .pager a {float: left; background: #fff; font-size: 1.3em; line-height: 1em; padding: .46em .73em; color: #4c4c4c; margin-right: .69em } .pager a.active {color: #b81b22 } .pager a:last-child {margin-right: 0 } .pager .prev, .pager .next {position: relative; padding-left: 1.26em; padding-right: 2.5em } .pager .prev img, .pager .next img {position: absolute; width: .76em; height: .46em; top: 50%; margin-top: -0.23em; margin-left: .5em } .login {text-align: center; padding: 3.5em 0 } .login-btn, .user-info {display: inline-block } .login-btn a {background: #fff; padding: .5em 2.5em } .login-btn a:first-child {margin-right: 6px } .login-btn a:last-child {margin-left: 6px } .login-btn a, .user-info span, .user-info a, .user-info i {font-size: 1.2em; color: #4c4c4c; line-height: 1em; display: inline-block } .user-info {padding: .75em 1.5em; background: #fff } .user-info i {padding: 0 .6em } .footer {text-align: center } .footer ul {display: inline-block; border-bottom: 1px solid #4c4d4d; border-top: 1px solid #4d4d4d; padding: 1.2em 0 } .footer ul a {display: block; width: 3.5em } .footer ul li {line-height: 0; float: left } .footer ul li:nth-child(2) {margin-left: 2.8em; margin-right: 1.4em } .footer ul li:nth-child(3) {margin-left: 1.4em; margin-right: 2.8em } .footer .copyright {font-size: .9em; line-height: 2em; color: #4c4c4c } .prd-tit {padding: .5em 2em; line-height: 2.2em } .prd-tit .name {color: #4c4c4c; font-size: 1.2em; margin-right: 1.5em; max-width: 16.5em } .prd-tit .price {color: #c8161e; font-size: 1.5em } .prd-tit .favorit {float: right; height: 2.2em; width: 2.2em } .prd-size {background: #f5f5f5; margin: .9em 2em; padding: .8em .8em; cursor: pointer } .prd-size .chkbox {float: left; height: 1.35em; width: 1.35em; background: url(../image/size_icon.jpg) no-repeat center center; background-size: contain; margin-right: .8em } .prd-size .size-info {float: left; font-size: 1.2em; color: #4c4c4c } .prd-size .sword-r {float: right; width: .7em; height: 1.35em; background: url(../image/swordr_icon.jpg) no-repeat center center; background-size: contain } .buy {background: #c7161e; border-radius: .1em; padding: .85em 0; margin: 1.5em 2em 0 2em } .buy a {display: block; color: #fff; font-size: 1.3em; line-height: 1em; height: 1em; text-align: center } .prd-des {margin: 1.5em 2em 1.2em 2em; text-align: center } .prd-des ul {display: inline-block } .prd-des li {float: left } .prd-des li {font-size: 1.2em; color: #4c4c4c; padding: 0 1em } .prd-des .active {color: #c8161e } .size-box {padding: 0 2em; color: #4d4d4d } .size-box .size-color {float: left; border: .1em solid #b3b3b3; border-radius: .1em; margin-right: .5em; margin-bottom: .5em; padding: .5em .8em } .size-box .color, .size-box .size {padding-top: 1em; padding-bottom: .7em; border-bottom: 1px solid #ccc; margin-bottom: .9em } .size-box .changecount {padding-top: 1em; padding-bottom: .7em } .size-box .changecount span {float: left; width: 2em; height: 2em; line-height: 2em; border-radius: .1em; text-align: center } .size-box .minus {background: #f5f5f5 url(../image/minus.jpg) no-repeat center center; background-size: contain; border: 1px solid #f5f5f5 } .size-box .num {border: 1px solid #666; color: #4d4d4d; margin: 0 .75em } .size-box .plus {background: #4d4d4d url(../image/plus.jpg) no-repeat center center; background-size: contain; border: 1px solid #4d4d4d } .size-box .active {border-color: #b81c20 } .size-box .disable {border-style: dashed } .prd-des-cont {padding-top: 1em } .prd-des-cont .comment {padding: .5em 2em; color: #999; border-bottom: 1px dashed #999 } .prd-des-cont .comment .cont {font-size: 1.3em } .prd-des-cont .comment .name {float: left; font-size: 1.3em } .prd-des-cont .comment .date {float: right; font-size: 1.3em } .prd-des-cont .more {text-align: center; padding: 2em } .prd-des-cont .more a {color: #999; font-size: 1.3em; border: 1px solid #b5b8ba; padding: .4em 4em } .prd-des-cont .subform {background: #e3e3e3; margin-bottom: 1em; padding: .5em 2em } .prd-des-cont .subform .tit {color: #666; font-size: 1.3em; line-height: 2em } .prd-des-cont .subform .cont {font-size: 1.3em } .prd-des-cont .subform .cont textarea {width: 100%; height: 6em; font-size: inherit; color: #999; box-sizing: border-box } .prd-des-cont .sub {text-align: center; padding: 1em 0 } .prd-des-cont .sub a {display: block; width: 100%; background: #d5200e; color: #fff; font-size: 1.3em; padding: .4em 0 } .prd-des-cont .quest-wrap {padding: .5em 2em } .prd-des-cont .question {font-size: 1.3em; color: #e8270c } .prd-des-cont .questioninfo {padding: 0 2em; color: #999 } .prd-des-cont .questioninfo .name {float: left; font-size: 1.3em } .prd-des-cont .questioninfo .date {float: right; font-size: 1.3em } .prd-des-cont .rep-wrap {padding: .5em 2em; border-bottom: 1px dashed #999 } .prd-des-cont .reply {font-size: 1.3em; color: #666 } .login-tip {text-align: center; color: #b3b3b3; font-size: 1.2em; line-height: 1em; padding-top: 2em; padding-bottom: 1.5em; border-bottom: 2px solid #f2f2f2 } .username, .password {background: #f5f5f5; margin: 1em 4.2em 1em 4.2em; padding: 1em 0 1em 1.5em } .username span, .password span {color: #4c4c4c; font-size: 1.2em } .username input, .password input {outline: 0; color: #999; display: inline-block; font-size: 1.2em; width: 14em; border: 0; background: #f5f5f5 } .user-login, .other-service, .other-login {margin: 0 4.2em } .user-login {display: block; text-align: center; margin-top: 1em; padding-bottom: 2.5em; border-bottom: 1px solid gray } .user-login a {display: block; background: #b81b22; color: #fff; border-radius: 2px; padding: 0.5em 0; font-size: 1.6em; } .other-service {margin-top: 2em; margin-bottom: 1.8em } .other-service a {color: #4c4c4c } .other-service a:first-child {float: left } .other-service a:last-child {float: right } .other-service a span {padding-left: 10px } .other-login {margin-bottom: 3em } .other-login p {color: #4c4c4c; margin-bottom: 1em } .vercode {margin: 0 4.2em } .vercode input {outline: 0 } .vercode p {color: #4c4c4c } .reg-title {font-size: 1.2em; color: #b71c22; border-bottom: 1px solid #e5e5e5; padding: 1.2em 3em .8em 3em; background: #fff } .reg-input {padding: 2.5em 2em; background: #fff } .reg-input input {border: 0; font-size: 1.2em; display: inline-block; background: #f5f5f5; color: #b5b5b5; padding: .8em; width: 100%; box-sizing: border-box } .reg-input div {padding-bottom: 1em } .reg-input p {color: #b3b3b3; text-align: center; margin-top: 3em; margin-bottom: 1.5em } .reg-input p a {color: #4c4c4c } .reg-input .submit {display: block; color: #fff; font-size: 1.6em; background: #b81b22; padding: .5em 0; text-align: center; border-radius: 3px } .reg-input .authcode {color: #b71c22; font-size: 1.2em; background: #fff; border: 2px solid #b2b2b2; padding: .75em 1.2em; border-radius: 4px; text-align: center; float: right } .reg-input .phone {width: 14em; float: left } .allAndtop {height: auto; width: 100%; margin-top: 2px; overflow: hidden; margin-bottom: 3.2em } .allAndtop a {display: block; line-height: 0 } .allAndtop img {height: auto; width: 100% } .see-all, .ret-top {width: 50% } .see-all {float: left; margin: 0 1px 0 -1px } .ret-top {float: right; margin: 0 -1px 0 1px } .swiper-pagination-bullet-active {background: #c71620 !important } .pull-left {float: left !important; } .pull-right {float: right !important; } .wrap {margin: 0 auto; max-width: 640px; min-height: 100%; overflow: hidden; background-color: #fff; } .vancl-color{color: #b81c22; } .gray-color{color: #adadad; } .vancl-bkg-color{background-color:  #b81c22; }