html {
  font-family: sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
body,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
blockquote,
dl,
dt,
dd,
ul,
ol,
li,
pre,
form,
fieldset,
legend,
button,
input,
textarea,
th,
td {
  margin: 0;
  padding: 0;
}
html,
body {
  height: 100%;
}
body {
  margin: 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}
audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}
audio:not([controls]) {
  display: none;
  height: 0;
}
[hidden],
template {
  display: none;
}
a {
  background-color: transparent;
}
a:active,
a:hover {
  outline: 0;
}
abbr[title] {
  border-bottom: 1px dotted;
}
b,
strong {
  font-weight: bold;
}
dfn {
  font-style: italic;
}
h1 {
  margin: 0.67em 0;
  font-size: 2em;
}
mark {
  color: #000;
  background: #ff0;
}
small {
  font-size: 80%;
}
sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
img {
  border: 0;
}
svg:not(:root) {
  overflow: hidden;
}
figure {
  margin: 1em 40px;
}
hr {
  height: 0;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
pre {
  overflow: auto;
}
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
button,
input,
optgroup,
select,
textarea {
  margin: 0;
  font: inherit;
  color: inherit;
}
button {
  overflow: visible;
}
button,
select {
  text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}
button[disabled],
html input[disabled] {
  cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
  padding: 0;
  border: 0;
}
input {
  line-height: normal;
}
input[type="checkbox"],
input[type="radio"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
input[type="search"] {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  -webkit-appearance: textfield;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
fieldset {
  padding: 0.35em 0.625em 0.75em;
  margin: 0 2px;
  border: 1px solid #c0c0c0;
}
legend {
  padding: 0;
  border: 0;
}
textarea {
  overflow: auto;
}
optgroup {
  font-weight: bold;
}
table {
  border-spacing: 0;
  border-collapse: collapse;
}
td,
th {
  padding: 0;
}
ul,
ol {
  list-style: none;
}
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
html {
  font-size: 100px;
}
@media screen and (min-width: 320px) {
  html {
    font-size: 42.6667px;
  }
}
@media screen and (min-width: 360px) {
  html {
    font-size: 48px;
  }
}
@media screen and (min-width: 375px) {
  html {
    font-size: 50px;
  }
}
@media screen and (min-width: 412px) {
  html {
    font-size: 54.9333px;
  }
}
@media screen and (min-width: 414px) {
  html {
    font-size: 55.2px;
  }
}
@media screen and (min-width: 768px) {
  html {
    font-size: 100px;
  }
}
body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333;
  background-color: #fff;
}
input,
button,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}
a {
  color: #337ab7;
  text-decoration: none;
}
figure {
  margin: 0;
}
img {
  vertical-align: middle;
}
.img-responsive,
.thumbnail > img,
.thumbnail a > img,
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
  display: block;
  max-width: 100%;
  height: auto;
}
.img-rounded {
  border-radius: 6px;
}
.img-thumbnail {
  display: inline-block;
  max-width: 100%;
  height: auto;
  padding: 4px;
  line-height: 1.42857143;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.img-circle {
  border-radius: 50%;
}
hr {
  margin-top: 20px;
  margin-bottom: 20px;
  border: 0;
  border-top: 1px solid #eee;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
.sr-only-focusable:active,
.sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
}
[role="button"] {
  cursor: pointer;
}
h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
}
.lead {
  margin-bottom: 20px;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.4;
}
.clear {
  zoom: 1;
  clear: both;
}
.clear:after {
  clear: both;
  content: "";
  display: block;
  width: 0;
  height: 0;
  visibility: hidden;
}
.fl {
  float: left;
}
.fr {
  float: right;
}
.none {
  display: none !important;
}

body,
html {
  line-height: 1.1;
  box-sizing: border-box;
  min-width: 7.5rem;
  font-family: "微软雅黑";
  background: #f2f2f2;
  position: relative;
  height: auto;
}

em {
  font-style: normal;
}

.fontSize20 {
  display: block;
  position: relative;
  width: 125%;
  left: -12.5%;
  transform: scale(0.8);
  font-size: 0.25rem;
}

.none {
  display: none;
}

button {
  outline: none;
  border: none;
}

i {
  display: block;
}

.page {
  min-height: 100vh;
  padding-bottom: 1.34rem;
}

.commodityImage {
  width: 7.5rem;
  height: 4.8rem;
  background-color: #ffffff;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  justify-content: center;
  -ms-flex-pack: center;
  margin: 0 auto;
  position: relative;
}

.commodityImage em {
  width: 2rem;
  height: 2rem;
  background: rgba(27, 27, 27, 0.6);
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 0.3rem;
  letter-spacing: 0.008rem;
  color: #f6f6f6;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  justify-content: center;
  -ms-flex-pack: center;
  font-style: normal;
}

.commodityImage img {
  max-width: 4rem;
  max-height: 4rem;
}

.introduce {
  width: 7.1rem;
  background-color: #ffffff;
  border-radius: 0.16rem;
  margin: 0.2rem auto;
}

.introduce .intHead {
  width: 7.1rem;
  height: 1rem;
  background: url("../mimg/vipmall/bgPrice.png");
  background-size: 7.1rem 1rem;
  padding: 0 0 0.3rem 0.2rem;
}

.introduce .isVipPrice i {
  width: 0.56rem;
  height: 0.28rem;
  background: url("../mimg/vipmall/new_tag_vip.png");
  background-size: 0.56rem 0.28rem;
  margin-right: 0.08rem;
}

.introduce .isVipPrice .vipPrice {
  font-size: 0.24rem;
  color: #ffffff;
  margin-right: 0.08rem;
  margin-bottom: -0.04rem;
}

.introduce .isVipPrice .vipPrice em {
  font-size: 0.48rem;
  font-weight: bold;
}

.introduce .isVipPrice .price {
  font-size: 0.24rem;
  color: #ffb7b7;
  text-decoration: line-through;
}

.introduce .noVipPrice .price {
  font-size: 0.24rem;
  color: #ffffff;
  margin-right: 0.12rem;
  margin-bottom: -0.04rem;
}

.introduce .noVipPrice .price em {
  font-size: 0.48rem;
  font-weight: bold;
}

.introduce .noVipPrice .vipPrice {
  height: 0.4rem;
  background-image: linear-gradient(90deg, #181616 0%, #423535 100%);
  border-radius: 0.08rem;
  padding: 0 0.1rem 0 0.12rem;
  font-size: 0.28rem;
  font-weight: bold;
  color: #ffd6ad;
}

.introduce .noVipPrice .vipPrice i {
  width: 0.37rem;
  height: 0.18rem;
  background: url("../mimg/vipmall/new_price_vip.png");
  background-size: 0.37rem 0.18rem;
  margin-right: 0.08rem;
}

.introduce .intBase {
  padding: 0.3rem 0.2rem;
}

.introduce .intBase .noVip {
  width: 6.7rem;
  height: 0.6rem;
  background-image: linear-gradient(90deg, #fff0c4 0%, #ffe5a0 100%);
  border-radius: 0.3rem;
  margin-bottom: 0.3rem;
  padding: 0 0.3rem 0 0.36rem;
  position: relative;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
}

.introduce .intBase .noVip > i {
  width: 0.43rem;
  height: 0.4rem;
  position: absolute;
  top: 0.1rem;
  left: 0.22rem;
  background: url("../mimg/vipmall/AlertviewV.png");
  background-size: 0.43rem 0.4rem;
}

.introduce .intBase .noVip p {
  flex: 1;
  -ms-flex: 1;
  font-size: 0.24rem;
  letter-spacing: 0.006rem;
  color: #c05e00;
}

.introduce .intBase .noVip a {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  letter-spacing: 0.006rem;
  color: #ff3c30;
  font-size: 0.24rem;
  font-weight: bold;
}

.introduce .intBase .noVip a i {
  width: 0.24rem;
  height: 0.24rem;
  background: url("../mimg/vipmall/iconOpen.png");
  background-size: 0.24rem;
  margin-left: 0.07rem;
}

.page h2 {
  font-size: 0.28rem;
  font-weight: bold;
  line-height: 0.29rem;
  color: #333333;
  padding-bottom: 0.28rem;
}

.introduce .intBase .int {
  font-size: 0.24rem;
  color: #999999;
  padding-bottom: 0.27rem;
  /* border-bottom: 1px solid #eeeeee; */
  line-height: 1.5;
}

.introduce .intBase .num {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  justify-content: space-between;
  -ms-flex-pack: justify;
  padding-top: 0.3rem;
  font-size: 0.24rem;
  color: #333333;
}

.introduce .intBase .Number {
  border-radius: 0.32rem;
  border: solid 1px #eeeeee;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
}

.introduce .intBase .Number .quantity,
.introduce .intBase .Number .button {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  justify-content: center;
  -ms-flex-pack: center;
}

.introduce .intBase .Number .quantity {
  width: 0.86rem;
  height: 0.64rem;
  border-left: 1px solid #eeeeee;
  border-right: 1px solid #eeeeee;
  font-size: 0.28rem;
}

.introduce .intBase .Number .button {
  width: 0.56rem;
  height: 0.64rem;
  color: #666666;
  cursor: pointer;
}

.introduce .intBase .Number .button.forbidden {
  color: #dddddd;
}

.particulars {
  width: 7.1rem;
  background-color: #ffffff;
  border-radius: 0.16rem;
  padding: 0.27rem 0.2rem;
  margin: 0 auto;
}

.particulars .content {
  width: 100%;
  word-wrap: break-word;
}

.particulars .content p {
  line-height: 1.8 !important;
  font-size: 0.24rem !important;
}

.particulars .content img {
  max-width: 100%;
}

.footer {
  width: 7.5rem;
  position: fixed;
  z-index: 9;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.footer .hint {
  width: 7.5rem;
  height: 0.6rem;
  background-color: #ffedec;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  justify-content: center;
  -ms-flex-pack: center;
  font-size: 0.24rem;
  color: #ff3c30;
}

.footer .hint i {
  width: 0.24rem;
  height: 0.24rem;
  margin-left: 0.19rem;
  background: url("../mimg/vipmall/close.png");
  background-size: 0.24rem;
  cursor: pointer;
}

.footer .price {
  background-color: #ffffff;
  border-top: 1px solid #eeeeee;
  display: flex;
  display: -ms-flexbox;
  padding: 0.2rem;
}

.footer .price .total {
  flex: 1;
  -ms-flex: 1;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  font-size: 0.28rem;
  color: #999999;
}

.footer .price .total p {
  font-size: 0.24rem;
  color: #ff3c30;
  font-weight: bold;
  margin-bottom: 0.05rem;
}

.footer .price .total p span {
  font-size: 0.4rem;
  margin-bottom: -0.05rem;
}

.footer .price .immediately {
  width: 7.1rem;
  height: 0.78rem;
  background-image: linear-gradient(90deg, #ff3c3d 0%, #ff592e 100%);
  border-radius: 0.39rem;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  justify-content: center;
  -ms-flex-pack: center;
  font-size: 0.28rem;
  cursor: pointer;
  color: #ffffff;
}

.footer .price .immediately.disabled {
  background-image: none;
  background-color: #eeeeee;
  color: #999999;
}

.modal {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
}

.modal .tooltip {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%);
  background-color: rgba(0, 0, 0, 0.7);
  border-radius: 0.1rem;
  font-size: 0.3rem;
  color: #ffffff;
  padding: 0.22rem 0.15rem;
  white-space: nowrap;
  text-align: center;
}

.layerCompany {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 999;
  width: 6.6rem;
  background-color: #ffffff;
  box-shadow: 0rem 0rem 0.325rem 0.025rem rgb(153 153 153 / 30%);
  border-radius: 0.1rem;
  position: fixed;
  z-index: 9999;
  top: 50%;
  left: 50%;
  margin-left: -3.3rem;
  height: 4.2rem;
  margin-top: -2.1rem;
  text-align: center;
  display: flex;
  display: -ms-flexbox;
  flex-direction: column;
  -ms-flex-direction: column;
  justify-content: center;
  -ms-flex-pack: center;
  align-items: center;
  -ms-flex-align: center;
}

.layerCompany .out {
  position: absolute;
  right: 0.34rem;
  top: 0.34rem;
  width: 0.44rem;
  height: 0.44rem;
  padding: 0.08rem;
  background: url(../mimg/vipmall/gb.png) no-repeat center;
  background-size: 0.28rem;
  cursor: pointer;
}

.layerCompany .title {
  width: 5.6rem;
  font-size: 0.36rem;
  letter-spacing: 0.009rem;
  color: #333333;
  line-height: 1.8;
}

.layerCompany .int {
  width: 5.1rem;
  font-size: 0.26rem;
  letter-spacing: 0.007rem;
  color: #666666;
  line-height: 1.8;
}

.layerCompany .buttonBox {
  display: flex;
  display: -ms-flexbox;
  justify-content: center;
  -ms-flex-pack: center;
  align-items: center;
  -ms-flex-align: center;
  margin-top: 0.49rem;
}

.layerCompany .buttonBox button {
  display: flex;
  display: -ms-flexbox;
  justify-content: center;
  -ms-flex-pack: center;
  align-items: center;
  -ms-flex-align: center;
  font-size: 0.24rem;
  letter-spacing: 0.006rem;
  width: 2.2rem;
  height: 0.68rem;
  border-radius: 0.34rem;
  background-color: #ff7870;
  color: #ffffff;
  margin-right: 0.2rem;
}

.mask {
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.5;
  -moz-opacity: 0.5;
  filter: alpha(opacity=50);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
}

.Modal {
  width: 5.91rem;
  height: 3.52rem;
  border-radius: 0.1rem;
  background: #fff;
  position: fixed;
  top: 50%;
  left: 50%;
  margin-left: -2.95rem;
  margin-top: -1.76rem;
  z-index: 99999;
  overflow: hidden;
}

.Modal .content {
  border-bottom: 0.02rem solid #ddd;
  border-top-left-radius: 0.1rem;
  border-top-right-radius: 0.1rem;
  height: 2.5rem;
  display: flex;
  display: -ms-flexbox;
  justify-content: center;
  -ms-flex-pack: center;
  align-items: center;
  -ms-flex-align: center;
}

.Modal .content img {
  width: 0.4rem;
  height: 0.4rem;
  float: left;
  margin: 0 0.22rem 0 0;
}

.Modal .content p {
  float: left;
  font-size: 0.32rem;
  color: #333333;
}

.Modal .AllBtns {
  height: 1rem;
  line-height: 1rem;
}

.Modal .AllBtns div {
  float: left;
  font-size: 0.32rem;
  text-align: center;
  width: 50%;
  color: #999999;
  border-right: 0.02rem solid #ddd;
  margin: 0;
}

.Modal .AllBtns div:last-child {
  border-right: none;
}

.Modal .AllBtns .Refresh {
  color: #ff8e69;
}

.webPay {
  width: 800px;
  height: 539px;
  background-color: #ffffff;
  border-radius: 4px;
  position: fixed;
  top: 50%;
  left: 50%;
  margin: -269.5px 0 0 -400px;
  z-index: 9999;
}

.webPay > i {
  width: 12px;
  height: 12px;
  background: url("../mimg/associate/out-s.png");
  background-size: 12px 12px;
  position: absolute;
  top: 20px;
  right: 20px;
  cursor: pointer;
}

.webPay .popupHead {
  width: 800px;
  height: 150px;
  background-color: #fafafa;
  border-bottom: 1px solid #eeeeee;
  border-radius: 4px 4px 0 0;
  display: flex;
  display: -ms-flexbox;
  flex-direction: column;
  -ms-flex-direction: column;
}

.webPay .popupHead .popupTitle {
  width: 100%;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  font-size: 14px;
  color: #666666;
  padding: 17px;
}

.webPay .popupHead .popupTitle span:nth-child(2) {
  margin-left: 262px;
  display: flex;
  display: -ms-flexbox;
}

.webPay .popupHead .popupTitle span i {
  font-style: inherit;
}

.webPay .popupHead .popupPrice {
  margin-top: 20px;
  display: flex;
  display: -ms-flexbox;
  align-items: flex-end;
  -ms-flex-align: end;
  font-size: 28px;
  letter-spacing: 1.1px;
  color: #fe6d26;
  margin-left: 321px;
}

.webPay .popupHead .popupPrice span {
  font-size: 14px;
  color: #666666;
  margin-bottom: 3px;
}

.webPay .popupHead .popupPrice i {
  font-style: inherit;
}

.webPay .popupHead .popupData {
  margin: 15px auto 0;
  font-size: 12px;
  color: #999999;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  justify-content: center;
  -ms-flex-pack: center;
  width: auto;
}

.webPay .popupHead .popupData span {
  color: #666666;
}

.webPay .popupHead .popupData i {
  height: 12px;
  border-left: 1px solid #7f7f7f;
  border-right: 1px solid #d9d9d9;
  margin: 0 8px;
}

.webPay .popupContent {
  width: 100%;
  display: flex;
  display: -ms-flexbox;
  flex-direction: column;
  -ms-flex-direction: column;
  align-items: center;
  -ms-flex-align: center;
}

.webPay .popupContent img {
  width: 200px;
  height: 200px;
  margin: 64px 0 15px;
}

.webPay .popupContent p {
  color: #999999;
  font-size: 14px;
}

.middle {
  width: 0.72rem;
  position: fixed;
  right: 50%;
  bottom: 1.8rem;
  overflow: hidden;
  z-index: 9;
  margin-right: -3.6rem;
}

.middle a {
  width: 0.72rem;
  height: 0.72rem;
  background: rgba(255, 255, 255, 0.95);
  border: solid 1px #dddddd;
  font-size: 0.24rem;
  color: #666666;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  justify-content: center;
  -ms-flex-pack: center;
  border-radius: 50%;
}

.layerOuter {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  display: flex;
  display: -ms-flexbox;
  justify-content: center;
  -ms-flex-pack: center;
  align-items: center;
  -ms-flex-align: center;
}

.layer {
  width: 6.6rem;
  background-color: #ffffff;
  box-shadow: 0rem 0rem 0.325rem 0.025rem rgba(153, 153, 153, 0.3);
  border-radius: 0.1rem;
  position: relative;
  padding: 0.6rem 0.3rem;
}

.layer .close {
  position: absolute;
  right: 0.23rem;
  top: 0.23rem;
  width: 0.44rem;
  height: 0.44rem;
  padding: 0.08rem;
  background: url("../mimg/vipmall/gb.png") no-repeat center;
  background-size: 0.28rem;
  cursor: pointer;
}

.layer .title {
  text-align: center;
  font-size: 0.36rem;
  font-weight: bold;
  color: #333333;
  margin-bottom: 0.4rem;
}

.layer .harvest {
  width: 6rem;
  background-color: #f6f6f6;
  border-radius: 0.16rem;
  letter-spacing: 0.006rem;
  padding: 0.3rem;
  margin: 0 0 0.4rem;
}

.layer .harvest p {
  letter-spacing: 0.006rem;
  color: #333333;
  font-size: 0.24rem;
  line-height: 1.8;
  display: flex;
  display: -ms-flexbox;
  margin-bottom: 0.2rem;
}

.layer .harvest .harvestSite {
  margin-bottom: 0;
}

.layer .harvest p span {
  display: block;
  word-break: break-all;
}

.layer .harvest p span:nth-of-type(1) {
  width: 1.4rem;
}

.layer .harvest p span:nth-of-type(2) {
  width: 4rem;
}

.layer .fillin {
  display: flex;
  display: -ms-flexbox;
  margin-bottom: 0.3rem;
  position: relative;
}

.layer .fillin label {
  width: 1.4rem;
  font-size: 0.28rem;
  color: #333333;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  height: 0.72rem;
  padding-left: 0.16rem;
  position: relative;
}

.layer .fillin label p {
  font-size: 0.3rem;
  letter-spacing: 0.008rem;
  color: #ff3c30;
  margin-top: 0.04rem;
  position: absolute;
  left: 0;
}

.layer .fillin .siteIocn {
  width: 0.23rem;
  height: 0.28rem;
  background: url(../mimg/vipmall/location.png);
  background-size: 0.23rem 0.28rem;
  position: absolute;
  right: 0.28rem;
  top: 0.22rem;
}

.layer .fillin input,
.layer .fillin #expressArea,
.layer .fillin textarea {
  width: 4.5rem;
  height: 0.72rem;
  background-color: #f6f6f6;
  border-radius: 0.1rem;
  padding: 0.25rem 0.2rem;
  outline: none;
  border: none;
  font-size: 0.24rem;
  color: #333333;
  line-height: 1;
}

.layer .fillin input[type="number"] {
  -moz-appearance: textfield;
}

.layer .fillin input[type="number"]::-webkit-inner-spin-button,
.layer .fillin input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.layer .fillin input::placeholder,
.layer .fillin textarea::placeholder {
  color: #999999;
}

.layer .fillin #expressArea::before {
  content: attr(data-placeholder);
  color: #999999;
}

.layer .fillin textarea {
  height: 1.6rem;
  resize: none;
  line-height: 1.4;
}

.layer .but {
  display: flex;
  display: -ms-flexbox;
  justify-content: center;
  -ms-flex-pack: center;
  margin-top: 0.4rem;
}

.layer .but .button {
  display: flex;
  display: -ms-flexbox;
  justify-content: center;
  -ms-flex-pack: center;
  align-items: center;
  -ms-flex-align: center;
  font-size: 0.24rem;
  letter-spacing: 0.006rem;
  width: 2.2rem;
  height: 0.68rem;
  border-radius: 0.34rem;
  cursor: pointer;
}

.layer .but .button:nth-child(1) {
  background-color: #ff7870;
  color: #ffffff;
  margin-right: 0.2rem;
}

.layer .but .button:nth-child(2) {
  background-color: #ffffff;
  border: solid 1px #d9d9d9;
  color: #999999;
}

.layer.deliveryAddress .but .button {
  width: 6rem;
}

.layer.deliveryAddress .but .button.submit {
  margin: 0;
}

@media screen and (min-width: 768px) {
  .layer {
    width: 394px;
    box-shadow: 0px 0px 32.5px 2.5px rgba(153, 153, 153, 0.3);
    border-radius: 10px;
    padding: 30px 20px;
  }

  .layer .close {
    right: 18px;
    top: 18px;
    width: 17px;
    height: 17px;
    padding: 0;
    background: url("../mimg/vipmall/gb.png") no-repeat center;
    background-size: 17px;
  }

  .layer .harvest {
    width: 354px;
    border-radius: 12px;
    letter-spacing: 0.5px;
    padding: 17px;
    margin: 0 0 22px;
  }

  .layer .harvest p {
    font-size: 16px;
    letter-spacing: 0.4px;
    margin-bottom: 10px;
  }

  .layer .harvest p span:nth-of-type(1) {
    width: 82px;
  }

  .layer .harvest p span:nth-of-type(2) {
    width: 238px;
  }

  .layer .title {
    font-size: 20px;
    margin-bottom: 29px;
  }

  .layer .fillin {
    margin-bottom: 19px;
  }

  .layer .fillin label {
    width: 81px;
    font-size: 16px;
    height: 41px;
    padding-left: 10px;
  }

  .layer .fillin label p {
    font-size: 17.86px;
    letter-spacing: 0.4px;
    margin-top: 4px;
  }

  .layer .fillin .siteIocn {
    width: 15px;
    height: 17px;
    background: url(../mimg/vipmall/location.png);
    background-size: 15px 17px;
    position: absolute;
    right: 12px;
    top: 12px;
  }

  .layer .fillin input,
  .layer .fillin #expressArea,
  .layer .fillin textarea {
    width: 269px;
    height: 41px;
    border-radius: 10px;
    padding: 13px;
    font-size: 14px;
  }

  .layer .fillin textarea {
    height: 95px;
  }

  .layer .but {
    margin-top: 19px;
  }

  .layer .but .button {
    font-size: 16px;
    letter-spacing: 0.4px;
    width: 122px;
    height: 41px;
    border-radius: 20px;
  }

  .layer .but .button:nth-child(1) {
    margin-right: 16px;
  }

  .layer .but .button.submit {
    width: 355px;
  }
}

.showText {
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 0.1rem;
  position: fixed;
  z-index: 999999999999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  line-height: 1.4;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  justify-content: center;
  -ms-flex-pack: center;
  font-size: 0.3rem;
  color: #f9f9f9;
  padding: 0.21rem 0.26rem;
}

.popup-commodity {
  width: 7.5rem;
  height: 10rem;
  background-color: #ffffff;
  border-radius: 0.4rem 0.4rem 0rem 0;
  position: fixed;
  z-index: 999;
  left: 0;
  bottom: 0;
  padding: 0 0.2rem;
}

.popup-commodity .popup-close {
  width: 0.44rem;
  height: 0.44rem;
  position: absolute;
  top: 0.2rem;
  right: 0.2rem;
  background: url(../mimg/vipmall/closePay.png);
  background-size: 0.44rem;
}

.popup-commodity .popup-head {
  height: 2.2rem;
  border-bottom: 1px solid #dddddd;
}

.popup-commodity .popup-head .popup-img {
  width: 1.6rem;
  height: 1.6rem;
  margin-right: 0.2rem;
  transition: all 0.3s;
  position: relative;
}

.popup-commodity .popup-head .popup-img .specificationImg {
  max-width: 1.6rem;
  max-height: 1.6rem;
  border-radius: 0.1rem;
}

.popup-commodity .popup-head .popup-img-amplification {
  width: 100vw;
  height: 100vh;
  margin-right: 0;
  transition: all 0.5s;
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.7);
  display: none;
}
.popup-commodity .popup-head .popup-img-amplification .popup-img-amplification-card {
  width: 100%;
  height: 100%;
}
.popup-commodity .popup-head .popup-img-amplification .specificationImg {
  max-width: 90%;
  max-height: 90%;
}
.popup-commodity .popup-head .popup-img-amplification .popup-img-close {
  width: 0.44rem;
  height: 0.44rem;
  position: absolute;
  top: 0.2rem;
  right: 0.2rem;
  background: url(../mimg/vipmall/closePay.png);
  background-size: 0.44rem;
}

.popup-commodity .popup-head .isVipPrice i {
  width: 0.56rem;
  height: 0.28rem;
  background: url("../mimg/vipmall/new_tag_vip.png");
  background-size: 0.56rem 0.28rem;
  margin-right: 0.08rem;
}

.popup-commodity .popup-head .isVipPrice .vipPrice {
  font-size: 0.24rem;
  color: #ff3c30;
  margin-right: 0.08rem;
  margin-bottom: -0.04rem;
}

.popup-commodity .popup-head .isVipPrice .vipPrice em {
  font-size: 0.48rem;
  font-weight: bold;
}

.popup-commodity .popup-head .isVipPrice .price {
  font-size: 0.24rem;
  color: #999999;
  text-decoration: line-through;
}

.popup-commodity .popup-head .noVipPrice .price {
  font-size: 0.24rem;
  color: #ff3c30;
  margin-right: 0.12rem;
  margin-bottom: -0.04rem;
}

.popup-commodity .popup-head .noVipPrice .price em {
  font-size: 0.48rem;
  font-weight: bold;
}

.popup-commodity .popup-head .noVipPrice .vipPrice {
  height: 0.4rem;
  background-image: linear-gradient(90deg, #181616 0%, #423535 100%);
  border-radius: 0.08rem;
  padding: 0 0.1rem 0 0.12rem;
  font-size: 0.28rem;
  font-weight: bold;
  color: #ffd6ad;
}

.popup-commodity .popup-head .noVipPrice .vipPrice i {
  width: 0.37rem;
  height: 0.18rem;
  background: url("../mimg/vipmall/new_price_vip.png");
  background-size: 0.37rem 0.18rem;
  margin-right: 0.08rem;
}

.popup-commodity .popup-head .num {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  justify-content: space-between;
  -ms-flex-pack: justify;
  padding-top: 0.3rem;
  font-size: 0.24rem;
  color: #333333;
}

.popup-commodity .popup-head .Number {
  border-radius: 0.32rem;
  border: solid 1px #eeeeee;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
}

.popup-commodity .popup-head .Number .quantity,
.popup-commodity .popup-head .Number .button {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  justify-content: center;
  -ms-flex-pack: center;
}

.popup-commodity .popup-head .Number .quantity {
  width: 0.86rem;
  height: 0.64rem;
  border-left: 1px solid #eeeeee;
  border-right: 1px solid #eeeeee;
  font-size: 0.28rem;
}

.popup-commodity .popup-head .Number .button {
  width: 0.56rem;
  height: 0.64rem;
  color: #666666;
  cursor: pointer;
}

.popup-commodity .popup-head .Number .button.forbidden {
  color: #dddddd;
}

.popup-commodity .specification {
  overflow-y: auto;
  max-height: 6.6rem;
}

.popup-commodity .specification-list {
  padding-top: 0.3rem;
}

.popup-commodity .specification-list p {
  font-size: 0.28rem;
  font-weight: bold;
  color: #333333;
  margin-bottom: 0.3rem;
}

.popup-commodity .specification-list label {
  padding: 0 0.37rem;
  height: 0.6rem;
  background-color: #f5f5f5;
  border-radius: 0.12rem;
  margin: 0 0.24rem 0.3rem 0;
  line-height: calc(0.6rem - 1px);
  font-size: 0.24rem;
  color: #333333;
  position: relative;
  border: solid 1px #f5f5f5;
}

.popup-commodity .specification-list label em {
  width: 0.6rem;
  height: 0.3rem;
  background-color: #dddddd;
  border-radius: 0.06rem 0rem 0.06rem 0rem;
  border: solid 0.02rem #ffffff;
  line-height: 0.3rem;
  text-align: center;
  color: #ffffff;
  font-size: 0.25rem;
  position: absolute;
  top: -0.21rem;
  right: -0.16rem;
  font-style: normal;
}

.popup-commodity .specification-list label.choose {
  border: solid 1px #ff3c30;
  background: #fff;
  color: #ff3c30;
  line-height: calc(0.6rem - 2px);
}

.popup-commodity .openVip {
  width: 7.5rem;
  height: 0.72rem;
  background-color: #fff8ee;
  position: absolute;
  left: 0;
  bottom: 1.18rem;
  font-size: 0.24rem;
  letter-spacing: 0.006rem;
  color: #111111;
  padding: 0 0.36rem;
}

.popup-commodity .openVip span {
  color: #ff3c30;
}

.popup-commodity .openVip span i {
  width: 0.24rem;
  height: 0.24rem;
  margin-left: 0.08rem;
  background: url(../mimg/vipmall/new_arrows.png);
  background-size: 0.24rem;
  border-radius: 50%;
}

.popup-commodity .newBuy {
  width: 7.1rem;
  height: 0.78rem;
  background-image: linear-gradient(90deg, #ff3c3d 0%, #ff592e 100%);
  border-radius: 0.39rem;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  justify-content: center;
  -ms-flex-pack: center;
  font-size: 0.28rem;
  cursor: pointer;
  color: #ffffff;
  position: absolute;
  left: 0.2rem;
  bottom: 0.2rem;
}

.popup-commodity .newBuy.disabled {
  background-image: none;
  background-color: #eeeeee;
  color: #999999;
}
.notUpgradeProHint {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 999;
}
.notUpgradeProHint .notUpgradeProHint-content {
  width: 5.6rem;
  min-height: 4rem;
  background: #ffffff;
  border-radius: 0.3rem;
  padding: 0.8rem 0.5rem 0.5rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.notUpgradeProHint .notUpgradeProHint-content .title {
  font-size: 0.3rem;
  font-weight: bold;
  color: #333333;
}
.notUpgradeProHint .notUpgradeProHint-content .int {
  font-size: 0.24rem;
  line-height: 0.4rem;
  color: #999999;
  margin-top: 0.2rem;
}
.notUpgradeProHint .notUpgradeProHint-content .butAll {
  margin-top: auto;
}
.notUpgradeProHint .notUpgradeProHint-content .butAll button {
  width: 4.6rem;
  height: 0.78rem;
  background-image: linear-gradient(90deg, #ff3c3d 0%, #ff592e 100%);
  border-radius: 0.39rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.3rem;
  color: #ffffff;
}
.notUpgradeProHint > .close {
  width: 0.64rem;
  height: 0.64rem;
  margin-top: 0.6rem;
}

.flex {
  display: -ms-flexbox;
  display: flex;
}
/*主轴为水平方向，起点在左边*/
.flexRow {
  -ms-flex-direction: row;
  flex-direction: row;
}
/*主轴为垂直方向，起点在上沿*/
.flexColumn {
  -ms-flex-direction: column;
  flex-direction: column;
}
.flex1 {
  -ms-flex: 1;
  flex: 1;
}
/*交叉轴的起点对齐*/
.alignStart{
  -ms-flex-align: start;
  align-items: flex-start;
}
/*交叉轴的终点对齐*/
.alignEnd{
  -ms-flex-align: end;
  align-items: flex-end;
}
/*交叉轴的中点对齐*/
.alignCenter{
  -ms-flex-align: center;
  align-items: center;
}
/*项目的第一行文字的基线对齐*/
.alignBaseline{
  -ms-align-items: baseline;
  align-items: baseline;
}
/*如果项目未设置高度或设为auto，将占满整个容器的高度*/
.alignStretch{
  -ms-align-items: stretch;
  align-items: stretch;
}
/*换行，第一行在上方*/
.flexWrap {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
/*主轴左对齐*/
.justifyStart {
  -ms-flex-pack: start;
  justify-content: flex-start;
}
/*主轴右对齐*/
.justifyEnd {
  -ms-flex-pack: end;
  justify-content: flex-end;
}
/*主轴居中对齐*/
.justifyCenter {
  -ms-flex-pack: center;
  justify-content: center;
}
/*主轴两端对齐,项目之间的间隔都相等*/
.justifyBetween {
  -ms-flex-pack: justify;
  justify-content: space-between;
}
/*每个项目两侧的间隔相等。所以，项目之间的间隔比项目与边框的间隔大一倍*/
.justifyAround {
  -ms-flex-pack: justify;
  justify-content: space-around;
}

/*覆盖父级交叉轴的起点对齐*/
.alignSelfStart{
  -ms-flex-item-align: start;
  align-self: flex-start;
}
/*覆盖父级交叉轴的终点对齐*/
.alignSelfEnd{
  -ms-flex-item-align: end;
  align-self: flex-end;
}
/*覆盖父级交叉轴的中点对齐*/
.alignSelfCenter{
  -ms-flex-item-align: center;
  align-self: center;
}
/*覆盖父级项目的第一行文字的基线对齐*/
.alignSelfBaseline{
  -ms-flex-item-align: baseline;
  align-self: baseline;
}
/*覆盖父级如果项目未设置高度或设为auto，将占满整个容器的高度*/
.alignSelfStretch{
  -ms-flex-item-align: stretch;
  align-self: stretch;
}

/* 显示一行文字 */
.line1 {
  white-space: nowrap;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* 显示2行文字 */
.line2 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
}
.line3 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
}

@charset "UTF-8";

/**CSS Reset**/
body,
div,
span,
h1,
h2,
h3,
h4,
h5,
h6,
header,
footer,
section,
article,
aside,
details,
figcaption,
figure,
hgroup,
nav,
menu,
address,
time,
canvas,
audio,
video,
p,
pre,
sup,
sub,
ul,
ol,
li,
dl,
dt,
dd,
form,
input,
button,
textarea,
select,
iframe,
img,
a {
  padding: 0;
  margin: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

header,
footer,
section,
article,
aside,
details,
figcaption,
figure,
hgroup,
nav,
menu {
  display: block;
}

html,
body {
  font-size: 20px;
  -webkit-overflow-scrolling: touch;
}

body {
  background-color: #eee;
  color: #333;
  font-family: "Helvetica Neue", "Microsoft Yahei", Tahoma, Arial, Roboto, "Droid Sans", "Droid Sans Fallback", "Heiti SC", sans-self;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: normal;
}

ul,
ol {
  list-style-type: none;
}

a {
  color: #333;
  text-decoration: none;
  outline: none;
}

a:link,
a:visited,
a:hover,
a:active {
  color: #333;
  outline: none;
}

.iphone {
  width: 384px;
  height: 799px;
  padding: 182px 32px 157px;
  margin: 10px auto;
}

.browser {
  position: relative;
  width: 320px;
  height: 460px;
  overflow: hidden;
}

@media (min-width:721px) and (max-width:1300px) {
  .iphone {
    width: 270px;
    height: 562px;
    padding: 128px 23px 111px;
    margin: 20px auto;
    background-size: 270px 562px;
  }

  .browser {
    width: 224px;
    height: 323px;
  }
}

@media (max-width:720px) {
  .iphone {
    width: 100%;
    height: 100%;
    padding: 0;
    background: none;
  }

  .browser {
    width: 100%;
    height: 100%;
  }
}

/*选择地区*/
.express-area {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  margin-top: .05rem;
  margin-bottom: .05rem;
  background-color: #fff;
}

.express-area a {
  display: block;
  padding: .1rem;
  background: url(../mimg/vipmall/link-arrow.png) no-repeat 98% 50%;
  background-size: .11rem .11rem;
}

.express-area dl {
  position: relative;
  line-height: 0.24rem;
  color: #4d525d;
}

.express-area dl dt {
  position: absolute;
  top: 0;
  left: 0;
  font-size: .14rem;
  line-height: 0.24rem;
}

.express-area dl dd {
  padding-top: .02rem;
  padding-right: .14rem;
  margin-left: 0.7rem;
  text-align: justify;
  font-size: .13rem;
  line-height: 0.2rem;
}

/*选择地区弹层*/
.express-area-box {
  bottom: -100%;
  background-color: #fff;
  color: #4d525d;
  border-radius: 0.2rem 0.2rem 0rem 0rem;
  display: none;
  z-index: 9999999;
  position: fixed;
  left: 0;
  width: 100%;
  margin-left: 0;
}

.express-area-box header {
  height: 0.8rem;
  position: relative;
}

.express-area-box header h3 {
  margin: 0 0.335rem;
  text-align: center;
  font-size: 0.3rem;
  font-weight: bold;
  line-height: 0.8rem;
}

.express-area-box header .back,
.express-area-box header .close {
  position: absolute;
}

.express-area-box header .back {
  display: none;
  width: 0.18rem;
  height: 0.32rem;
  top: 0.19rem;
  left: 0.24rem;
  background: url(../mimg/vipmall/back.png) no-repeat center;
  background-size: 0.18rem 0.32rem;
}

.express-area-box header .close {
  width: 0.28rem;
  height: 0.28rem;
  top: 0.22rem;
  right: 0.24rem;
  background: url(../mimg/vipmall/gb.png) no-repeat center;
  background-size: 0.28rem;
}

.express-area-box article {
  height: 7.2rem;
  overflow-y: scroll;
}

.express-area-box article ul {
  padding: 0 0.3rem;
}

.area-list li {
  border-bottom: 1px solid #e2e2e2;
  text-align: justify;
  font-size: 0.28rem;
  letter-spacing: 0.007rem;
  line-height: 0.86rem;
}

/*遮罩层*/
.areaMask {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, .5);
  z-index: 9999999;
}

@media screen and (min-width: 768px) {
  .express-area-box {
    border-radius: 20px 20px 0 0;
    left: 50%;
    width: 396px;
    margin-left: -198px;
  }

  .express-area-box header {
    height: 44px;
  }

  .express-area-box header h3 {
    font-size: 16px;
    font-weight: normal;
    line-height: 44px;
  }

  .express-area-box header .back,
  .express-area-box header .close {
    position: absolute;
  }

  .express-area-box header .back {
    top: 10px;
    width: 9px;
    height: 17px;
    left: 12px;
    background-size: 9px 17px;
  }

  .express-area-box header .close {
    top: 12px;
    width: 14px;
    height: 14px;
    right: 12px;
    background-size: 14px;
  }

  .express-area-box article {
    height: 414px;
  }

  .express-area-box article ul {
    padding: 0 15px;
  }

  .area-list li {
    border-bottom: 1px solid #e2e2e2;
    font-size: 14px;
    letter-spacing: 0.4px;
    line-height: 44px;
  }
}
.detail-swiper-container {
  height: 0.81rem;
  display: flex;
  align-items: center;
  width: 100%;
  padding: 0 0 0.21rem 0.2rem;
  background: #ffffff;
}
.detail-swiper-container .swiper-container {
  width: calc(100% - 1.4rem);
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.detail-swiper-container .swiper-total {
  position: relative;
  flex-shrink: 0;
  z-index: 2;
  background: #ffffff;
  width: 1.4rem;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.24rem;
  color: #333333;
  padding-right: 0.28rem;
}
.detail-swiper-container .swiper-container .swiper-slide-active {
  border: none;
}
.detail-swiper-container .swiper-container .swiper-slide {
  width: auto;
  height: 0.6rem;
  padding: 0.05rem 0.2rem 0.05rem 0.05rem;
  background: #f5f5f5;
  border-radius: 0.08rem;
  margin-right: 0.2rem;
  position: relative;
}
.detail-swiper-container .swiper-container .swiper-slide.selected {
  background: #ffffff;
}
.detail-swiper-container .swiper-container .swiper-slide.selected::after {
  border: 1px solid #ff3c30;
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 0.08rem;
}
.detail-swiper-container .swiper-container .swiper-slide .box {
  display: flex;
  align-items: center;
}

.detail-swiper-container .swiper-container .swiper-slide img {
  width: 0.5rem;
  height: 0.5rem;
  margin-right: 0.23rem;
  border-radius: 0.04rem;
}

.detail-swiper-container .swiper-container .swiper-slide p {
  font-size: 0.24rem;
  color: #333333;
  font-weight: bold;
  flex-shrink: 0;
}
.detail-swiper-container .swiper-container .swiper-slide .specificationImg {
  width: 0.5rem;
  height: 0.5rem;
}

.swiper-disabled {
  opacity: 0.6;
}