/*以下为基本样式类型、清除默认样式、基本样式布局*/
* {
  margin: 0;
  padding: 0;
  border: 0;
  border: none;
}
html,
body {
  font-family: "微软雅黑", Microsoft Yahei;
}
/*@font-face {
  font-family: Athelas;
  src:url("../font/Athelas.ttc");
}*/
h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
}
input[type=button],
input[type=submit],
button {
  cursor: pointer;
  font-family: "微软雅黑", Microsoft Yahei;
}
li {
  list-style: none;
}
html,
body {
  width: 100%;
  height: 100%;
}
input,
button,
label {
  /*清除按下的阴影*/
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
a {
  color: #000;
  text-decoration: none;
}
a:hover {
  text-decoration: none;
}
textarea {
  outline: none;
}
input,
button {
  outline: none;
}
p {
  margin-bottom: 0;
}
.font-song {
  font-family: "宋体";
}
/*圆形图片*/
.img-circle {
  border-radius: 50%;
}
/*图片长度*/
.img-w100 {
  width: 100%;
}
/*文本*/
.text-left {
  text-align: left;
}
.text-right {
  text-align: right;
}
.text-center {
  text-align: center;
}
.margin-auto {
  display: block;
  margin: auto;
}
/*宽度*/
.w100 {
  width: 100%;
  margin: 0 auto;
}
.w99 {
  width: 99%;
  margin: 0 auto;
}
.w98 {
  width: 98%;
  margin: 0 auto;
}
.w97 {
  width: 97%;
  margin: 0 auto;
}
.w96 {
  width: 96%;
  margin: 0 auto;
}
.w95 {
  width: 95%;
  margin: 0 auto;
}
.w94 {
  width: 94%;
  margin: 0 auto;
}
.w93 {
  width: 93%;
  margin: 0 auto;
}
.w92 {
  width: 92%;
  margin: 0 auto;
}
.w91 {
  width: 91%;
  margin: 0 auto;
}
.w90 {
  width: 90%;
  margin: 0 auto;
}
.w89 {
  width: 89%;
  margin: 0 auto;
}
.w88 {
  width: 88%;
  margin: 0 auto;
}
.w87 {
  width: 87%;
  margin: 0 auto;
}
.w86 {
  width: 86%;
  margin: 0 auto;
}
.w85 {
  width: 85%;
  margin: 0 auto;
}
.w84 {
  width: 84%;
  margin: 0 auto;
}
.w83 {
  width: 83%;
  margin: 0 auto;
}
.w82 {
  width: 82%;
  margin: 0 auto;
}
.w81 {
  width: 81%;
  margin: 0 auto;
}
.w80 {
  width: 80%;
  margin: 0 auto;
}
.w79 {
  width: 79%;
  margin: 0 auto;
}
.w78 {
  width: 78%;
  margin: 0 auto;
}
.w77 {
  width: 77%;
  margin: 0 auto;
}
.w76 {
  width: 76%;
  margin: 0 auto;
}
.w75 {
  width: 75%;
  margin: 0 auto;
}
.w74 {
  width: 74%;
  margin: 0 auto;
}
.w73 {
  width: 73%;
  margin: 0 auto;
}
.w72 {
  width: 72%;
  margin: 0 auto;
}
.w71 {
  width: 71%;
  margin: 0 auto;
}
.w70 {
  width: 70%;
  margin: 0 auto;
}
.w69 {
  width: 69%;
  margin: 0 auto;
}
.w68 {
  width: 68%;
  margin: 0 auto;
}
.w67 {
  width: 67%;
  margin: 0 auto;
}
.w66 {
  width: 66%;
  margin: 0 auto;
}
.w65 {
  width: 65%;
  margin: 0 auto;
}
.w64 {
  width: 64%;
  margin: 0 auto;
}
.w63 {
  width: 63%;
  margin: 0 auto;
}
.w62 {
  width: 62%;
  margin: 0 auto;
}
.w61 {
  width: 61%;
  margin: 0 auto;
}
.w60 {
  width: 60%;
  margin: 0 auto;
}
.w59 {
  width: 59%;
  margin: 0 auto;
}
.w58 {
  width: 58%;
  margin: 0 auto;
}
.w57 {
  width: 57%;
  margin: 0 auto;
}
.w56 {
  width: 56%;
  margin: 0 auto;
}
.w55 {
  width: 55%;
  margin: 0 auto;
}
.w54 {
  width: 54%;
  margin: 0 auto;
}
.w53 {
  width: 53%;
  margin: 0 auto;
}
.w52 {
  width: 52%;
  margin: 0 auto;
}
.w51 {
  width: 51%;
  margin: 0 auto;
}
.w50 {
  width: 50%;
  margin: 0 auto;
}
.w49 {
  width: 49%;
  margin: 0 auto;
}
.w48 {
  width: 48%;
  margin: 0 auto;
}
.w47 {
  width: 47%;
  margin: 0 auto;
}
.w46 {
  width: 46%;
  margin: 0 auto;
}
.w45 {
  width: 45%;
  margin: 0 auto;
}
.w44 {
  width: 44%;
  margin: 0 auto;
}
.w43 {
  width: 43%;
  margin: 0 auto;
}
.w42 {
  width: 42%;
  margin: 0 auto;
}
.w41 {
  width: 41%;
  margin: 0 auto;
}
.w40 {
  width: 40%;
  margin: 0 auto;
}
.w39 {
  width: 39%;
  margin: 0 auto;
}
.w38 {
  width: 38%;
  margin: 0 auto;
}
.w37 {
  width: 37%;
  margin: 0 auto;
}
.w36 {
  width: 36%;
  margin: 0 auto;
}
.w35 {
  width: 35%;
  margin: 0 auto;
}
.w34 {
  width: 34%;
  margin: 0 auto;
}
.w33 {
  width: 33%;
  margin: 0 auto;
}
.w32 {
  width: 32%;
  margin: 0 auto;
}
.w31 {
  width: 31%;
  margin: 0 auto;
}
.w30 {
  width: 30%;
  margin: 0 auto;
}
.w29 {
  width: 29%;
  margin: 0 auto;
}
.w28 {
  width: 28%;
  margin: 0 auto;
}
.w27 {
  width: 27%;
  margin: 0 auto;
}
.w26 {
  width: 26%;
  margin: 0 auto;
}
.w25 {
  width: 25%;
  margin: 0 auto;
}
.w24 {
  width: 24%;
  margin: 0 auto;
}
.w23 {
  width: 23%;
  margin: 0 auto;
}
.w22 {
  width: 22%;
  margin: 0 auto;
}
.w21 {
  width: 21%;
  margin: 0 auto;
}
.w20 {
  width: 20%;
  margin: 0 auto;
}
.w19 {
  width: 19%;
  margin: 0 auto;
}
.w18 {
  width: 18%;
  margin: 0 auto;
}
.w17 {
  width: 17%;
  margin: 0 auto;
}
.w16 {
  width: 16%;
  margin: 0 auto;
}
.w15 {
  width: 15%;
  margin: 0 auto;
}
.w14 {
  width: 14%;
  margin: 0 auto;
}
.w13 {
  width: 13%;
  margin: 0 auto;
}
.w12 {
  width: 12%;
  margin: 0 auto;
}
.w11 {
  width: 11%;
  margin: 0 auto;
}
.w10 {
  width: 10%;
  margin: 0 auto;
}
.w9 {
  width: 9%;
  margin: 0 auto;
}
.w8 {
  width: 8%;
  margin: 0 auto;
}
.w7 {
  width: 7%;
  margin: 0 auto;
}
.w6 {
  width: 6%;
  margin: 0 auto;
}
.w5 {
  width: 5%;
  margin: 0 auto;
}
.w4 {
  width: 4%;
  margin: 0 auto;
}
.w3 {
  width: 3%;
  margin: 0 auto;
}
.w2 {
  width: 2%;
  margin: 0 auto;
}
.w1 {
  width: 1%;
  margin: 0 auto;
}
/*高度*/
.g1 {
  width: 100%;
  height: 1px;
  line-height: 1px;
  clear: both;
}
.g2 {
  width: 100%;
  height: 2px;
  line-height: 2px;
  clear: both;
}
.g3 {
  width: 100%;
  height: 3px;
  line-height: 3px;
  clear: both;
}
.g4 {
  width: 100%;
  height: 4px;
  line-height: 4px;
  clear: both;
}
.g5 {
  width: 100%;
  height: 5px;
  line-height: 5px;
  clear: both;
}
.g6 {
  width: 100%;
  height: 6px;
  line-height: 6px;
  clear: both;
}
.g7 {
  width: 100%;
  height: 7px;
  line-height: 7px;
  clear: both;
}
.g8 {
  width: 100%;
  height: 8px;
  line-height: 8px;
  clear: both;
}
.g9 {
  width: 100%;
  height: 9px;
  line-height: 9px;
  clear: both;
}
.h10 {
  width: 100%;
  height: 10px;
  line-height: 10px;
  clear: both;
}
.h12 {
  width: 100%;
  height: 12px;
  line-height: 12px;
  clear: both;
}
.h15 {
  width: 100%;
  height: 15px;
  line-height: 15px;
  clear: both;
}
.h16 {
  width: 100%;
  height: 16px;
  line-height: 16px;
  clear: both;
}
.h20 {
  width: 100%;
  height: 20px;
  line-height: 20px;
  clear: both;
}
.h23 {
  width: 100%;
  height: 23px;
  line-height: 23px;
  clear: both;
}
.h25 {
  width: 100%;
  height: 25px;
  line-height: 25px;
  clear: both;
}
.h28 {
  width: 100%;
  height: 28px;
  line-height: 25px;
  clear: both;
}
.h30 {
  width: 100%;
  height: 30px;
  line-height: 30px;
  clear: both;
}
.h35 {
  width: 100%;
  height: 35px;
  line-height: 35px;
  clear: both;
}
.h40 {
  width: 100%;
  height: 40px;
  line-height: 40px;
  clear: both;
}
.h44 {
  width: 100%;
  height: 44px;
  line-height: 44px;
  clear: both;
}
.h45 {
  width: 100%;
  height: 45px;
  line-height: 45px;
  clear: both;
}
.h50 {
  width: 100%;
  height: 50px;
  line-height: 50px;
  clear: both;
}
.h55 {
  width: 100%;
  height: 55px;
  line-height: 55px;
  clear: both;
}
.h60 {
  width: 100%;
  height: 60px;
  line-height: 60px;
  clear: both;
}
.h65 {
  width: 100%;
  height: 65px;
  line-height: 65px;
  clear: both;
}
.h70 {
  width: 100%;
  height: 70px;
  line-height: 70px;
  clear: both;
}
.h75 {
  width: 100%;
  height: 75px;
  line-height: 75px;
  clear: both;
}
.h80 {
  width: 100%;
  height: 80px;
  line-height: 80px;
  clear: both;
}
.h85 {
  width: 100%;
  height: 85px;
  line-height: 88px;
  clear: both;
}
.h90 {
  width: 100%;
  height: 90px;
  line-height: 90px;
  clear: both;
}
.h95 {
  width: 100%;
  height: 95px;
  line-height: 95px;
  clear: both;
}
.h100 {
  width: 100%;
  height: 100px;
  line-height: 100px;
  clear: both;
}
.h110 {
  width: 100%;
  height: 110px;
  line-height: 110px;
  clear: both;
}
.h120 {
  width: 100%;
  height: 120px;
  line-height: 120px;
  clear: both;
}
.h130 {
  width: 100%;
  height: 130px;
  line-height: 130px;
  clear: both;
}
.h140 {
  width: 100%;
  height: 140px;
  line-height: 140px;
  clear: both;
}
.h150 {
  width: 100%;
  height: 150px;
  line-height: 150px;
  clear: both;
}
.h160 {
  width: 100%;
  height: 160px;
  line-height: 160px;
  clear: both;
}
.h170 {
  width: 100%;
  height: 170px;
  line-height: 170px;
  clear: both;
}
.h180 {
  width: 100%;
  height: 180px;
  line-height: 180px;
  clear: both;
}
.h190 {
  width: 100%;
  height: 190px;
  line-height: 190px;
  clear: both;
}
.h200 {
  width: 100%;
  height: 200px;
  line-height: 200px;
  clear: both;
}
/*字体*/
.color333 {
  color: #333;
}
.color999 {
  color: #999;
}
.fb {
  font-weight: bold;
}
/**************************<定义公共字体类，类名命名规则：小写字母f加属性名称>**********************************/
/***<字体大小>***/
.f80 {
  font-size: 80px;
  /*<80像素字>*/
}
.f70 {
  font-size: 70px;
  /*<60像素字>*/
}
.f60 {
  font-size: 60px;
  /*<60像素字>*/
}
.f50 {
  font-size: 50px;
  /*<50像素字>*/
}
.f40 {
  font-size: 40px;
  /*<40像素字>*/
}
.f38 {
  font-size: 38px;
  /*<40像素字>*/
}
.f36 {
  font-size: 36px;
  /*<36像素字>*/
}
.f35 {
  font-size: 35px;
  /*<35像素字>*/
}
.f30 {
  font-size: 30px;
  /*<30像素字>*/
}
.f28 {
  font-size: 28px;
  /*<28像素字>*/
}
.f26 {
  font-size: 26px;
  /*<26像素字>*/
}
.f25 {
  font-size: 25px;
  /*<25像素字>*/
}
.f24 {
  font-size: 24px;
  /*<24像素字>*/
}
.f22 {
  font-size: 22px;
  /*<22像素字>*/
}
.f20 {
  font-size: 20px;
  /*<20像素字>*/
}
.f18 {
  font-size: 18px;
  /*<18像素字>*/
}
.f17 {
  font-size: 17px;
  /*<17像素字>*/
}
.f16 {
  font-size: 16px;
  /*<16像素字>*/
}
.f15 {
  font-size: 15px;
  /*<15像素字>*/
}
.f14 {
  font-size: 14px;
  /*<14像素字>*/
}
.f13 {
  font-size: 13px;
  /*<13像素字>*/
}
.f12 {
  font-size: 12px;
  /*<12像素字>*/
}
.f11 {
  font-size: 11px;
  /*<10像素字>*/
}
.f10 {
  font-size: 10px;
  /*<10像素字>*/
}
.f8 {
  font-size: 8px;
  /*<8像素字>*/
}
.f12 {
  font-size: 12px;
  /*<12像素字>*/
}
.f14b {
  font-size: 14px;
  /*<14像素字>*/
  font-weight: bold;
}
.f16b {
  font-size: 16px;
  /*<16像素字>*/
  font-weight: bold;
}
.f18b {
  font-size: 18px;
  /*<18像素字>*/
  font-weight: bold;
}
.f-w500 {
  font-weight: 500;
}
/***<字体>***/
.fb {
  font-weight: bold;
  /*<粗体>*/
}
/***<常用布局>***/
.m-top1 {
  margin-top: 1px;
}
.m-top2 {
  margin-top: 1px;
}
.m-top3 {
  margin-top: 1px;
}
.m-top4 {
  margin-top: 4px;
}
.m-top5 {
  margin-top: 5px;
}
.m-top6 {
  margin-top: 6px;
}
.m-top7 {
  margin-top: 7px;
}
.m-top8 {
  margin-top: 8px;
}
.m-top10 {
  margin-top: 10px;
}
.m-top12 {
  margin-top: 12px;
}
.m-top13 {
  margin-top: 13px;
}
.m-top15 {
  margin-top: 15px;
}
.m-top17 {
  margin-top: 17px;
}
.m-top20 {
  margin-top: 20px;
}
.m-top25 {
  margin-top: 25px;
}
.m-top30 {
  margin-top: 30px;
}
.m-top32 {
  margin-top: 32px;
}
.m-top33 {
  margin-top: 33px;
}
.m-top35 {
  margin-top: 35px;
}
.m-top40 {
  margin-top: 40px;
}
.m-top41 {
  margin-top: 41px;
}
.m-top45 {
  margin-top: 45px;
}
.m-top50 {
  margin-top: 50px;
}
.m-top55 {
  margin-top: 55px;
}
.m-top57 {
  margin-top: 57px;
}
.m-top60 {
  margin-top: 60px;
}
.m-top65 {
  margin-top: 65px;
}
.m-top70 {
  margin-top: 70px;
}
.m-top75 {
  margin-top: 75px;
}
.m-top80 {
  margin-top: 80px;
}
.m-top100 {
  margin-top: 100px;
}
.m-top140 {
  margin-top: 140px;
}
.m-top153 {
  margin-top: 153px;
}
.m-top200 {
  margin-top: 200px;
}
.m-top300 {
  margin-top: 300px;
}
.m-left5 {
  margin-left: 5px;
}
.m-left6 {
  margin-left: 6px;
}
.m-left7 {
  margin-left: 7px;
}
.m-left10 {
  margin-left: 10px;
}
.m-left11 {
  margin-left: 11px;
}
.m-left12 {
  margin-left: 12px;
}
.m-left13 {
  margin-left: 13px;
}
.m-left14 {
  margin-left: 14px;
}
.m-left15 {
  margin-left: 15px;
}
.m-left18 {
  margin-left: 18px;
}
.m-left20 {
  margin-left: 20px;
}
.m-left21 {
  margin-left: 21px;
}
.m-left23 {
  margin-left: 23px;
}
.m-left25 {
  margin-left: 25px;
}
.m-left30 {
  margin-left: 30px;
}
.m-left35 {
  margin-left: 35px;
}
.m-left40 {
  margin-left: 40px;
}
.m-left41 {
  margin-left: 41px;
}
.m-left-40 {
  margin-left: -40px;
}
.m-left50 {
  margin-left: 50px;
}
.m-left55 {
  margin-left: 55px;
}
.m-left58 {
  margin-left: 58px;
}
.m-left60 {
  margin-left: 60px;
}
.m-left65 {
  margin-left: 65px;
}
.m-left66 {
  margin-left: 66px;
}
.m-left67 {
  margin-left: 67px;
}
.m-left68 {
  margin-left: 68px;
}
.m-left70 {
  margin-left: 70px;
}
.m-left75 {
  margin-left: 75px;
}
.m-left79 {
  margin-left: 79px;
}
.m-left80 {
  margin-left: 80px;
}
.m-left85 {
  margin-left: 85px;
}
.m-left88 {
  margin-left: 88px;
}
.m-left89 {
  margin-left: 89px;
}
.m-left90 {
  margin-left: 90px;
}
.m-left92 {
  margin-left: 92px;
}
.m-left100 {
  margin-left: 100px;
}
.m-left110 {
  margin-left: 110px;
}
.m-left115 {
  margin-left: 115px;
}
.m-left120 {
  margin-left: 120px;
}
.m-left125 {
  margin-left: 125px;
}
.m-left130 {
  margin-left: 130px;
}
.m-left140 {
  margin-left: 140px;
}
.m-left160 {
  margin-left: 160px;
}
.m-left195 {
  margin-left: 195px;
}
.m-right5 {
  margin-right: 5px;
}
.m-right10 {
  margin-right: 10px;
}
.m-right15 {
  margin-right: 15px;
}
.m-right20 {
  margin-right: 20px;
}
.m-right25 {
  margin-right: 25px;
}
.m-right30 {
  margin-right: 30px;
}
.m-right40 {
  margin-right: 40px;
}
.m-right50 {
  margin-right: 50px;
}
.m-right55 {
  margin-right: 55px;
}
.m-right60 {
  margin-right: 60px;
}
.m-right70 {
  margin-right: 70px;
}
.m-right96 {
  margin-right: 96px;
}
.m-bottom {
  margin-bottom: 0;
}
.m-bottom5 {
  margin-bottom: 5px;
}
.m-bottom15 {
  margin-bottom: 15px;
}
.m-bottom20 {
  margin-bottom: 20px;
}
.m-bottom30 {
  margin-bottom: 30px;
}
.m-bottom40 {
  margin-bottom: 40px;
}
/***<浮动>***/
.f-left {
  float: left;
}
.f-right {
  float: right;
}
.clear {
  clear: both;
}
.display-block {
  display: block;
}
.display-inline {
  display: inline;
}
.display-none {
  display: none;
}
.auto {
  margin: auto;
}
.po-absolute {
  position: absolute;
}
.po-relative {
  position: relative;
}
/*内间距*/
.p-left10 {
  padding-left: 10px;
}
.p-left17 {
  padding-left: 17px;
}
.p-left20 {
  padding-left: 20px;
}
.p-top4 {
  padding-top: 4px;
}
.p-top20 {
  padding-top: 20px;
}
.p-top80 {
  padding-top: 80px;
}
.p-bottom5 {
  padding-bottom: 5px;
}
.p-bottom60 {
  padding-bottom: 60px;
}
.p-right5 {
  padding-right: 5px;
}
.padding_right10 {
  padding-right: 10px;
}
/*边框线*/
.b-bottom1Sc {
  border-bottom: 1px solid #ccc;
}
/*显示*/
.opacity1 {
  opacity: 1;
}
.visi_hidden {
  visibility: hidden;
}
.width500 {
  width: 500px;
}
.width400 {
  width: 400px;
}
[data-width="1200"] {
  width: 1200px;
  margin: auto;
}
[data-subject="bgColor"] {
  background-color: #f3f3f3;
}
[data-margin="auto"] {
  border-top: 1px solid transparent;
}
.height300 {
  height: 300px;
}
/*通用三角形图标下拉*/
.icon-down {
  width: 6px;
  height: 12px;
  background: transparent url(../images/SpriteIcon.html) no-repeat 0 -368px;
}
/*清除浮动*/
.after-clear:after {
  content: " ";
  clear: both;
  display: block;
  visibility: hidden;
  height: 0;
}
/* 通用阴影 */
[data-boxShaw="all"] {
  box-shadow: 2px 2px 5px 5px rgba(253, 56, 96, 0.25);
}
/*颜色渐变效果*/
/*通用的全体动画*/
/*图片默认加载动画*/
.load-default {
  position: absolute;
}
.load-default .goods-img {
  position: relative;
  z-index: 3;
}
.load-default .loading-animation {
  position: relative;
  z-index: 2;
  width: 50px;
  height: 50px;
  left: 50%;
  top: 50%;
  margin: -25px 0 0 -25px;
  background-color: transparent;
}
.load-default .loading-animation span {
  display: block;
  float: left;
  width: 25px;
  height: 25px;
}
.load-default .loading-animation span:nth-of-type(1) {
  background-color: #4169E1;
  animation: loadingX1 4s ease-out infinite, loadingShow 1s ease-out infinite;
}
.load-default .loading-animation span:nth-of-type(2) {
  background-color: #FF6347;
  animation: loadingX2 4s ease-out infinite, loadingShow 1s ease-out infinite;
}
.load-default .loading-animation span:nth-of-type(3) {
  background-color: #EE82EE;
  animation: loadingX3 4s ease-out infinite, loadingShow 1s ease-out infinite;
}
.load-default .loading-animation span:nth-of-type(4) {
  background-color: #20B2AA;
  animation: loadingX4 4s ease-out infinite, loadingShow 1s ease-out infinite;
}
/* 模板下边框 */
[data-border2px="bottom"] {
  border-bottom: 2px solid #fe4848;
}
@keyframes loadingShow {
  0% {
    border-radius: 0;
  }
  50% {
    border-radius: 50%;
  }
  100% {
    border-radius: 0;
  }
}
@keyframes loadingX1 {
  5% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(25px, 0);
  }
  30% {
    transform: translate(25px, 0);
  }
  50% {
    transform: translate(25px, 25px);
  }
  55% {
    transform: translate(25px, 25px);
  }
  75% {
    transform: translate(0, 25px);
  }
  80% {
    transform: translate(0, 25px);
  }
  100% {
    transform: translate(0, 0);
  }
}
@keyframes loadingX2 {
  5% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(0, 25px);
  }
  30% {
    transform: translate(0, 25px);
  }
  50% {
    transform: translate(-25px, 25px);
  }
  55% {
    transform: translate(-25px, 25px);
  }
  75% {
    transform: translate(-25px, 0);
  }
  80% {
    transform: translate(-25px, 0);
  }
  100% {
    transform: translate(0, 0);
  }
}
@keyframes loadingX3 {
  5% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(0, -25px);
  }
  30% {
    transform: translate(0, -25px);
  }
  50% {
    transform: translate(25px, -25px);
  }
  55% {
    transform: translate(25px, -25px);
  }
  75% {
    transform: translate(25px, 0);
  }
  80% {
    transform: translate(25px, 0);
  }
  100% {
    transform: translate(0, 0);
  }
}
@keyframes loadingX4 {
  5% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(-25px, 0);
  }
  30% {
    transform: translate(-25px, 0);
  }
  50% {
    transform: translate(-25px, -25px);
  }
  55% {
    transform: translate(-25px, -25px);
  }
  75% {
    transform: translate(0, -25px);
  }
  80% {
    transform: translate(0, -25px);
  }
  100% {
    transform: translate(0, 0);
  }
}
@keyframes bigshow {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@-webkit-keyframes bigshow {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes hideshow {
  0% {
    opacity: 1;
    display: block;
    height: 0;
  }
  100% {
    opacity: 0;
    display: none;
    height: 0;
  }
}
@-webkit-keyframes hideshow {
  0% {
    opacity: 1;
    display: block;
    height: 0;
  }
  100% {
    opacity: 0;
    display: none;
    height: 0;
  }
}
@keyframes show {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes show {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/* 通用商品鼠标移入动画 */
[data-translate="top"],
[data-translate="right"],
[data-translate="bottom"],
[data-translate="left"] {
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
/* 鼠标移入商品动画 */
[data-translate="true"]:hover [data-translate="top"] {
  -webkit-transform: translateY(-5px);
  -moz-transform: translateY(-5px);
  -ms-transform: translateY(-5px);
  -o-transform: translateY(-5px);
  transform: translateY(-5px);
}
[data-translate="true"]:hover [data-translate="bottom"] {
  -webkit-transform: translateY(5px);
  -moz-transform: translateY(5px);
  -ms-transform: translateY(5px);
  -o-transform: translateY(5px);
  transform: translateY(5px);
}
[data-translate="true"]:hover [data-translate="left"] {
  -webkit-transform: translateX(-5px);
  -moz-transform: translateX(-5px);
  -ms-transform: translateX(-5px);
  -o-transform: translateX(-5px);
  transform: translateX(-5px);
}
[data-translate="true"]:hover [data-translate="right"] {
  -webkit-transform: translateX(5px);
  -moz-transform: translateX(5px);
  -ms-transform: translateX(5px);
  -o-transform: translateX(5px);
  transform: translateX(5px);
}
/* 通用阴影移入动画 */
[data-shadow="show"] {
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
[data-shadow="show"]:hover {
  box-shadow: 4px 4px 10px -5px rgba(0, 0, 0, 0.8) !important;
}
/*通用透明放大动画*/
[data-showBig="true"] [data-showBig="obj"] {
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
  opacity: 0;
  -webkit-transform: scale(0.5);
  -moz-transform: scale(0.5);
  -ms-transform: scale(0.5);
  -o-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-transform-origin: bottom ;
  -moz-transform-origin: bottom ;
  -ms-transform-origin: bottom ;
  -o-transform-origin: bottom ;
  transform-origin: bottom ;
}
[data-showBig="true"]:hover [data-showBig="obj"] {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}
/* 通用查看购买 */
[data-add="shopping"] {
  width: 40px;
  height: 40px;
  position: fixed;
  z-index: 11;
  object-fit: cover;
}
/* 通用上推动画 */
[data-foldShow="true"] {
  transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  perspective: 100px;
}
[data-foldShow="true"] [data-foldShow="bottom"] {
  transform-origin: bottom;
  transform: rotateX(110deg);
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
[data-foldShow="true"]:hover [data-foldShow="bottom"] {
  transform: rotateX(0deg);
}
/* 特殊数字字体 */
/*[data-font="Athelas"]{
  font-family: "Athelas";
  src:url("../font/Athelas.ttc");
}*/
[data-delete="line"] {
  text-decoration: line-through;
  color: #d1d1d1;
}
/* 查看购买属性 */
[data-img="parent"] {
  position: relative;
}
/*

  通用关闭按钮

 */
/*以下为公共样式类*/
.Advertisement-box {
  position: relative;
}
.Advertisement-box img {
  width: 100%;
  vertical-align: bottom;
}
.Advertisement-box .close-btn {
  cursor: pointer;
  width: 24px;
  height: 24px;
  position: absolute;
  top: 50%;
  right: 118px;
  z-index: 1;
  margin-top: -3px;
  -webkit-transition: all 0.5s ;
  -moz-transition: all 0.5s ;
  -ms-transition: all 0.5s ;
  -o-transition: all 0.5s ;
  transition: all 0.5s ;
  opacity: 0.7;
}
.Advertisement-box .close-btn:before,
.Advertisement-box .close-btn:after {
  content: "";
  position: absolute;
  display: block;
}
.Advertisement-box .close-btn:before {
  -webkit-transform: rotateZ(45deg);
  -moz-transform: rotateZ(45deg);
  -ms-transform: rotateZ(45deg);
  -o-transform: rotateZ(45deg);
  transform: rotateZ(45deg);
  top: 0;
}
.Advertisement-box .close-btn:after {
  -webkit-transform: rotateZ(-45deg);
  -moz-transform: rotateZ(-45deg);
  -ms-transform: rotateZ(-45deg);
  -o-transform: rotateZ(-45deg);
  transform: rotateZ(-45deg);
  top: 0;
}
.Advertisement-box .close-btn:hover {
  opacity: 1;
}
.Advertisement-box .close-btn:before,
.Advertisement-box .close-btn:after {
  content: "";
  width: 30px;
  height: 3px;
  left: 0;
  background-color: #fff;
}
/*通用头部信息栏*/
.header-box {
  width: 100%;
  height: 37px;
  box-sizing: border-box;
  background-color: #f3f3f3;
  border-bottom: 1px solid #dcdcdc;
}
.header-box .body {
  height: 100%;
  margin: auto;
  line-height: 36px;
  /*<12像素字>*/
  font-size: 12px;
  /*<12像素字>*/
  color: #999;
}
.header-box .body .f-left {
  /*头部信息栏左侧列表*/
}
.header-box .body .f-left li {
  float: left;
  margin-right: 18px;
}
.header-box .body .f-left li a {
  color: #999;
  -webkit-transition: color 0.3s ;
  -moz-transition: color 0.3s ;
  -ms-transition: color 0.3s ;
  -o-transition: color 0.3s ;
  transition: color 0.3s ;
}
.header-box .body .f-left li:nth-of-type(3) a {
  color: #fa723f;
}
.header-box .body .f-left li:hover {
  color: #fa723f;
}
.header-box .body .f-left li:hover a {
  color: #fa723f;
}
.header-box .body .f-left li:first-child:hover {
  color: #999;
}
.header-box .body .f-left li:last-child {
  cursor: default;
  position: relative;
  box-sizing: border-box;
  padding-left: 17px;
}
.header-box .body .f-left li:last-child i {
  width: 11px;
  height: 19px;
  position: absolute;
  left: 0;
  top: 10px;
  display: inline-block;
  background: transparent no-repeat url(../images/SpriteIcon.html);
  -webkit-transition: background 0.3s;
  -moz-transition: background 0.3s;
  -ms-transition: background 0.3s;
  -o-transition: background 0.3s;
  transition: background 0.3s;
}
.header-box .body .f-left li:last-child:hover i {
  background: transparent no-repeat url(../images/SpriteIcon.html);
  background-position: 0 -27px;
}
.header-box .body .f-left li:last-child .code {
  position: absolute;
  background-color: rgba(255, 255, 255, 0.7);
  padding: 10px;
  left: 0;
  /* -webkit-transform: translateY(20px);
          -moz-transform: translateY(20px);
          -ms-transform: translateY(20px);
          -o-transform: translateY(20px);
          transform: translateY(20px);*/
  /* opacity: 0;*/
  top: 36px;
  display: none;
  z-index: 10;
  box-shadow: 2px 2px 10px -3px rgba(51, 51, 51, 0.4);
}
.header-box .body .f-left li:last-child .code span {
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 8px solid #fa723f;
  position: absolute;
  left: 50%;
  margin-left: -3px;
  top: -8px;
}
.header-box .body .f-right {
  /*头部信息栏右侧列表*/
}
.header-box .body .f-right > li {
  float: left;
  box-sizing: border-box;
  margin-left: 20px;
  cursor: pointer;
}
.header-box .body .f-right > li i {
  display: inline-block;
  width: 20px;
  height: 20px;
  float: left;
  margin-right: 8px;
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
.header-box .body .f-right > li > a {
  color: #999;
}
.header-box .body .f-right > li > a:hover {
  color: #fa723f;
}
.header-box .body .f-right > li:nth-of-type(1) {
  /*我的订单*/
}
.header-box .body .f-right > li:nth-of-type(1) i {
  background: transparent url(../images/SpriteIcon.html) no-repeat 0 -388px;
  margin: 8px 5px 0 0;
}
.header-box .body .f-right > li:nth-of-type(1):hover i {
  background: transparent url(../images/SpriteIcon.html) no-repeat 0 -414px;
}
.header-box .body .f-right > li:nth-of-type(2) {
  /*购物车*/
}
.header-box .body .f-right > li:nth-of-type(2) i {
  background: transparent url(../images/SpriteIcon.html) no-repeat 0 -54px;
  margin-top: 8px;
}
.header-box .body .f-right > li:nth-of-type(2):hover i {
  background: transparent url(../images/SpriteIcon.html) no-repeat 0 -81px;
}
.header-box .body .f-right > li:nth-of-type(3) {
  /*收藏夹*/
}
.header-box .body .f-right > li:nth-of-type(3) i {
  background: transparent url(../images/SpriteIcon.html) no-repeat 0 -105px;
  margin: 8px 5px 0 0;
}
.header-box .body .f-right > li:nth-of-type(3):hover i {
  background: transparent url(../images/SpriteIcon.html) no-repeat 0 -133px;
}
.header-box .body .f-right > li:nth-of-type(3):hover i {
  background: transparent url(../images/SpriteIcon.html) no-repeat 0 -133px;
}
.header-box .body .f-right > li:last-child {
  /*网站导航*/
  width: 82px;
  position: relative;
  box-sizing: border-box;
  padding-left: 6px;
  border: 1px solid transparent;
}
.header-box .body .f-right > li:last-child i {
  width: 6px;
  height: 12px;
  background: transparent url(../images/SpriteIcon.html) no-repeat 0 -368px;
  position: absolute;
  right: -2px;
  top: 13px;
  z-index: 6;
  -webkit-transform: rotateZ(90deg);
  -moz-transform: rotateZ(90deg);
  -ms-transform: rotateZ(90deg);
  -o-transform: rotateZ(90deg);
  transform: rotateZ(90deg);
}
.header-box .body .f-right > li:last-child .web-link-list {
  position: absolute;
  left: -1px;
  top: -1px;
  z-index: 5;
  width: 100%;
  height: auto;
  text-align: center;
  box-sizing: border-box;
  border: 1px solid #dcdcdc;
  background-color: #fff;
  display: none;
}
.header-box .body .f-right > li:last-child .web-link-list .title {
  line-height: 36px;
  font-size: 14px;
  /*<14像素字>*/
  color: #fa723f;
  text-align: left;
  box-sizing: border-box;
  padding-left: 6px;
}
.header-box .body .f-right > li:last-child .web-link-list .link-list {
  /*更多导航*/
  padding: 5px 0;
}
.header-box .body .f-right > li:last-child .web-link-list .link-list li {
  width: 100%;
  line-height: normal;
  margin-bottom: 10px;
  text-align: center;
  /*<12像素字>*/
  font-size: 12px;
  /*<12像素字>*/
}
.header-box .body .f-right > li:last-child .web-link-list .link-list li a {
  color: #999;
}
.header-box .body .f-right > li:last-child .web-link-list .link-list li a:hover {
  color: #fa723f;
}
/*通用搜索栏*/
.search-box {
  width: 100%;
  min-height: 147px;
  position: relative;
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
.search-box.float {
  position: fixed;
  z-index: 11;
  width: 100%;
  padding: 12px 0;
  box-sizing: border-box;
  height: 70px;
  min-height: 70px;
  left: 0;
  top: 0;
  background-color: #fff;
  box-shadow: 0 1px 7px 0 rgba(0, 0, 0, 0.2);
}
.search-box.float .hot-search,
.search-box.float a > .logo {
  display: none;
}
.search-box.float .search-body {
  padding-top: 0;
  width: 973px;
  box-sizing: border-box;
  padding-left: 183px;
  border-radius: 0;
}
.search-box.float .search-body .float-link {
  display: block;
  position: absolute;
  width: 150px;
  height: 50px;
  z-index: 2;
  left: 0;
  background: rgba(0, 0, 0, 0);
}
.search-box.float .search-body input[type=text] {
  border-radius: 0;
  height: 46px;
  width: 650px;
  border-width: 2px;
}
.search-box.float .search-body input[type=button],
.search-box.float .search-body input[type=submit] {
  top: 0;
  border-radius: 0;
  height: 46px;
}
.search-box.float .search-body:before {
  content: " ";
  position: absolute;
  width: 150px;
  height: 50px;
  background: url(../images/logo_x.html) no-repeat;
  background-size: 150px auto;
  left: 0;
}
.search-box .logo {
  /*logo*/
  position: absolute;
  top: 0;
}
.search-box a:first-child .logo {
  top: 40px;
}
.search-box a:nth-of-type(2) .logo {
  right: 0;
  top: 5px;
}
.search-box .search-body {
  /*搜索框*/
  position: relative;
  width: 530px;
  background-color: #fff;
  padding-top: 40px;
  margin: auto;
  /*热门搜索*/
}
.search-box .search-body .float-link {
  display: none;
}
.search-box .search-body :-moz-placeholder {
  color: #d1d1d1;
  opacity: 1;
}
.search-box .search-body ::-moz-placeholder {
  color: #d1d1d1;
  opacity: 1;
}
.search-box .search-body input:-ms-input-placeholder {
  color: #d1d1d1;
  opacity: 1;
}
.search-box .search-body input::-webkit-input-placeholder {
  color: #d1d1d1;
  opacity: 1;
}
.search-box .search-body input[type=text] {
  box-sizing: border-box;
  border: 1px solid #f31a1a;
  width: 100%;
  height: 40px;
  border-radius: 4px;
  padding: 0 110px 0 41px;
  font-size: 16px;
  /*<16像素字>*/
  background: transparent url(../images/searchIcon.html) no-repeat;
  background-position: 15px center;
  color: #999;
}
.search-box .search-body input[type=button],
.search-box .search-body input[type=submit] {
  width: 105px;
  height: 40px;
  border-radius: 4px;
  background-color: #f31a1a;
  position: absolute;
  color: #fff;
  right: 0;
  top: 40px;
  font-size: 18px;
  /*<18像素字>*/
  cursor: pointer;
}
.search-box .search-body .hot-search {
  margin-top: 10px;
}
.search-box .search-body .hot-search li {
  float: left;
  margin-right: 20px;
}
.search-box .search-body .hot-search li:last-child {
  margin-right: 0;
}
.search-box .search-body .hot-search li a {
  color: #bebebe;
  font-size: 14px;
}
.search-box .search-body .hot-search li a:hover {
  color: #f31a1a;
}
/*主页主题部分，可能以后会重用，所以写在公共样式库内*/
.main-box {
  width: 100%;
  height: auto;
  position: relative;
  z-index: 2;
  /*更多分类*/
  /*更多分类闭合*/
}
.main-box .type-class-more-box {
  /*更多分类*/
  width: 714px;
  height: 660px;
  background-color: #fff;
  cursor: default;
  box-sizing: border-box;
  padding: 22px 18px 0 24px;
  display: none;
  border-top: 8px solid #f3f3f3;
  border-left: 6px solid #f3f3f3;
  z-index: 5;
  position: absolute;
  left: 242px;
  top: 0px;
}
.main-box .type-class-more-box:hover .type-class p a {
  color: #fe4848;
}
.main-box .type-class-more-box .list-box {
  width: 100%;
  height: auto;
  margin-bottom: 10px;
}
.main-box .type-class-more-box .list-box .title {
  width: 96px;
  position: relative;
  float: left;
  color: #515151;
}
.main-box .type-class-more-box .list-box .title i {
  position: absolute;
  width: 6px;
  height: 10px;
  background: transparent url(../images/SpriteIcon.html) no-repeat;
  background-position: 0 -239px;
  right: 15px;
  top: 50%;
  margin-top: -5px;
}
.main-box .type-class-more-box .list-box .type-class-list {
  /*分类列表*/
  width: 564px;
  margin-bottom: 10px;
  height: auto;
}
.main-box .type-class-more-box .list-box .type-class-list li {
  font-size: 14px;
  /*<14像素字>*/
  float: left;
  width: 80px;
  text-align: center;
  box-sizing: border-box;
  border-left: 1px solid #ddd;
  margin-bottom: 13px;
  cursor: pointer;
}
.main-box .type-class-more-box .list-box .type-class-list li a {
  color: #a5a5a5;
}
.main-box .type-class-more-box .list-box .type-class-list li:hover a {
  color: #fe4848;
}
.main-box .type-class-more-box .list-box .type-class-list li:first-child {
  border-left: none;
}
.main-box .type-class-more-box .list-box .type-class-list li:nth-of-type(8n) {
  border-left: none;
}
.main-box .type-class-more-box .load-default {
  /*加载动画*/
  left: 0;
  bottom: 0;
  width: 100%;
  height: 254px;
}
.main-box .commodity-class-box {
  /*商品级别分类菜单*/
  float: left;
  width: 242px;
  height: auto;
  background-color: #fff;
}
.main-box .commodity-class-box > .title {
  width: 100%;
  height: 47px;
  line-height: 47px;
  color: #fff;
  padding-left: 20px;
  box-sizing: border-box;
  font-size: 16px;
  /*<16像素字>*/
  background-color: #f31a1a;
}
.main-box .commodity-class-box .class-body {
  width: 100%;
  /*菜单分类*/
  background-color: #fe4848;
  /*菜单组*/
}
.main-box .commodity-class-box .class-body > li {
  width: 100%;
  height: 98px;
  box-sizing: border-box;
  padding: 17px 20px 0 17px;
  cursor: pointer;
  position: relative;
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
.main-box .commodity-class-box .class-body > li .type-class a {
  color: #fff;
}
.main-box .commodity-class-box .class-body > li .type-class {
  /*主要分类*/
}
.main-box .commodity-class-box .class-body > li .type-class p {
  line-height: 40px;
  position: relative;
  box-sizing: border-box;
  padding-left: 37px;
  font-size: 18px;
  /*<18像素字>*/
}
.main-box .commodity-class-box .class-body > li .type-class p .unfold-icon {
  position: absolute;
  width: 6px;
  height: 10px;
  right: 0;
  top: 50%;
  margin-top: -5px;
  background: transparent url(../images/SpriteIcon.html) no-repeat;
  background-position: 0 -219px;
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
.main-box .commodity-class-box .class-body > li .type-class > span {
  /*<12像素字>*/
  font-size: 12px;
  /*<12像素字>*/
  margin-right: 4px;
}
.main-box .commodity-class-box .class-body > li .type-class > span:nth-of-type(1) {
  margin-left: 39px;
}
.main-box .commodity-class-box .class-body > li:hover {
  background-color: #ffeded;
}
.main-box .commodity-class-box .class-body > li:hover .type-class a {
  color: #fe4848;
}
.main-box .commodity-class-box .class-body > li:hover .type-class .unfold-icon {
  background: transparent url(../images/SpriteIcon.html) no-repeat;
  background-position: 0 -239px;
}
.main-box .commodity-class-box .class-body > li:hover .type-icon img {
  -webkit-transform: translateY(-28px);
  -moz-transform: translateY(-28px);
  -ms-transform: translateY(-28px);
  -o-transform: translateY(-28px);
  transform: translateY(-28px);
}
.main-box .commodity-class-box .class-body .type-icon {
  position: absolute;
  left: 0;
  width: 28px;
  height: 28px;
  top: 8px;
  overflow: hidden;
}
.main-box .commodity-class-box .class-body .type-icon img {
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
.main-box .commodity-class-box .class-body > li:nth-of-type(1) {
  /*健康食品*/
  /*  .type-icon{
          top:6px;
          background: transparent url(../images/SpriteIcon.png) no-repeat;
          background-position: -43px 0;
        }
        &:hover{
          .type-icon{
            background: transparent url(../images/SpriteIcon.png) no-repeat;
            background-position: -43px -42px;
          }
        }*/
}
.main-box .commodity-class-box .class-body > li:nth-of-type(1) .type-class-more-box {
  /*更多分类*/
  top: 0;
}
.main-box .commodity-class-box .class-body > li:nth-of-type(2) {
  /*康复护理*/
  /*  .type-icon{
          top:9px;
          background: transparent url(../images/SpriteIcon.png) no-repeat;
          background-position: -43px -82px;
        }
        &:hover{
          .type-icon{
            background: transparent url(../images/SpriteIcon.png) no-repeat;
            background-position: -43px -114px;
          }
        }*/
}
.main-box .commodity-class-box .class-body > li:nth-of-type(2) .type-class-more-box {
  /*更多分类*/
  top: -90px;
}
.main-box .commodity-class-box .class-body > li:nth-of-type(3) {
  /*生活用品*/
  /* .type-icon{
          top:8px;
          background: transparent url(../images/SpriteIcon.png) no-repeat;
          background-position: -43px -145px;
        }
        &:hover{
          .type-icon{
            background: transparent url(../images/SpriteIcon.png) no-repeat;
            background-position: -43px -180px;
          }
        }*/
}
.main-box .commodity-class-box .class-body > li:nth-of-type(3) .type-class-more-box {
  /*更多分类*/
  top: -180px;
}
.main-box .commodity-class-box .class-body > li:nth-of-type(4) {
  /*最美夕阳*/
  /*.type-icon{
          top:8px;
          background: transparent url(../images/SpriteIcon.png) no-repeat;
          background-position: -43px -217px;
        }
        &:hover{
          .type-icon{
            background: transparent url(../images/SpriteIcon.png) no-repeat;
            background-position: -43px -250px;
          }
        }*/
}
.main-box .commodity-class-box .class-body > li:nth-of-type(4) .type-class-more-box {
  /*更多分类*/
  top: -270px;
}
.main-box .commodity-class-box .class-body > li:nth-of-type(5) {
  /*滋补保健*/
  /* .type-icon{
          top:8px;
          background: transparent url(../images/SpriteIcon.png) no-repeat;
          background-position: -43px -286px;
        }
        &:hover{
          .type-icon{
            background: transparent url(../images/SpriteIcon.png) no-repeat;
            background-position: -43px -325px;
          }
        }*/
}
.main-box .commodity-class-box .class-body > li:nth-of-type(5) .type-class-more-box {
  /*更多分类*/
  top: -360px;
}
.main-box .commodity-class-box .class-body > li:nth-of-type(6) {
  /*老年礼品*/
  /*  .type-icon{
          top:10px;
          background: transparent url(../images/SpriteIcon.png) no-repeat;
          background-position: -43px -366px;
        }
        &:hover{
          .type-icon{
            background: transparent url(../images/SpriteIcon.png) no-repeat;
            background-position: -43px -402px;
          }
        }*/
}
.main-box .commodity-class-box .class-body > li:nth-of-type(6) .type-class-more-box {
  /*更多分类*/
  top: -450px;
}
.main-box .commodity-class-box .banner {
  width: 100%;
  /*height: 300px;*/
  background-color: #f4f4f4;
}
.main-box .commodity-class-box .banner img {
  width: 100%;
  /*height: 120px;*/
}
.main-box .banner-box {
  /*轮播图与抢购主体*/
  width: 719px;
  height: auto;
  background-color: transparent;
  float: left;
}
.main-box .banner-box .banner-body {
  /*轮播图*/
  width: 708px;
  height: 382px;
  margin: 8px 0 0 6px;
  overflow: hidden;
  position: relative;
}
.main-box .banner-box .banner-body .banner-list {
  /*轮播图*/
  width: auto;
  height: 100%;
  -webkit-transition: all 8s ease;
  -moz-transition: all .8s ease;
  -ms-transition: all .8s ease;
  -o-transition: all .8s ease;
  transition: all .8s ease;
}
.main-box .banner-box .banner-body .banner-list li {
  width: 708px;
  height: 100%;
  float: left;
}
.main-box .banner-box .banner-body .banner-list li img {
  width: 100%;
  height: 100%;
}
.main-box .banner-box .banner-body ol {
  /*轮播指针*/
  height: 20px;
  background-color: rgba(255, 255, 255, 0.4);
  position: absolute;
  left: 50%;
  margin-left: -38px;
  bottom: 15px;
  border-radius: 10px;
  box-sizing: border-box;
  padding: 4px 10px 0 0;
}
.main-box .banner-box .banner-body ol li {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background-color: #fff;
  float: left;
  margin-left: 10px;
  cursor: pointer;
}
.main-box .banner-box .banner-body ol li.active {
  background-color: #fa723f;
}
.main-box .banner-box .limit-activity-box {
  /*限时抢购*/
  width: 708px;
  height: 264px;
  margin: 6px 0 0 6px;
  background-color: #fff;
}
.main-box .banner-box .limit-activity-box .title {
  width: 100%;
  height: 45px;
  line-height: 45px;
  box-sizing: border-box;
  padding: 0 22px 0 24px;
  background: url(../images/xsqg.html) no-repeat;
  color: #fff;
}
.main-box .banner-box .limit-activity-box .title > .f-left {
  font-size: 20px;
  /*<20像素字>*/
}
.main-box .banner-box .limit-activity-box .title > .f-left i {
  width: 27px;
  height: 29px;
  display: inline-block;
  background: url(../images/SpriteIcon.html) no-repeat -1px -259px;
  float: left;
  margin-top: 9px;
}
.main-box .banner-box .limit-activity-box .title > .f-left .ssqg {
  vertical-align: middle;
}
.main-box .banner-box .limit-activity-box .title .f-right {
  font-size: 14px;
  /*<14像素字>*/
}
.main-box .banner-box .limit-activity-box .title .f-right .time-body {
  margin: 7px 0 0 8px;
}
.main-box .banner-box .limit-activity-box .title .f-right .time-body li {
  width: 29px;
  height: 32px;
  background-color: rgba(0, 0, 0, 0.5);
  text-align: center;
  line-height: 32px;
  position: relative;
  border-radius: 4px;
  font-size: 14px;
  /*<14像素字>*/
  margin-right: 13px;
  float: left;
}
.main-box .banner-box .limit-activity-box .title .f-right .time-body li:after {
  content: ":";
  position: absolute;
  right: -7px;
}
.main-box .banner-box .limit-activity-box .title .f-right .time-body li:last-child {
  margin-right: 0;
}
.main-box .banner-box .limit-activity-box .title .f-right .time-body li:last-child:after {
  content: "  ";
}
.main-box .banner-box .limit-activity-box .limit-activity-body {
  width: 100%;
  height: 213px;
}
.main-box .banner-box .limit-activity-box .limit-activity-body li {
  width: 177px;
  height: 100%;
  text-align: center;
  float: left;
}
.main-box .banner-box .limit-activity-box .limit-activity-body li .img {
  width: 100%;
  height: 106px;
  line-height: 106px;
  color: transparent;
  margin: 20px 0;
}
.main-box .banner-box .limit-activity-box .limit-activity-body li .img img {
  vertical-align: middle;
  max-width: 100%;
  max-height: 100%;
}
.main-box .banner-box .limit-activity-box .limit-activity-body li h2 {
  font-size: 14px;
  font-weight: 500;
  width: 55%;
  margin: auto;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  height: 17px;
}
.main-box .banner-box .limit-activity-box .limit-activity-body li p {
  font-size: 14px;
  color: #fe4848;
}
.main-box .banner-box .limit-activity-box .limit-activity-body li p span {
  font-size: 30px;
}
.main-box .user-module {
  /*用户登陆与温馨提示*/
  width: 238px;
  height: auto;
  float: left;
  padding-top: 8px;
}
/*通用 导航 nav样式*/
.nav {
  width: 100%;
  position: relative;
}
.nav .nav-public-box {
  width: 960px;
  height: 660px;
  position: absolute;
  z-index: 6;
  left: 0;
  top: 48px;
  background-color: transparent;
  display: none;
}
.nav .nav-public-box .commodity-class-box {
  float: left;
  width: 242px;
  height: auto;
  background-color: #fff;
}
.nav .nav-public-box .commodity-class-box > .title {
  width: 100%;
  height: 47px;
  line-height: 47px;
  color: #fff;
  padding-left: 20px;
  box-sizing: border-box;
  font-size: 16px;
  /*<16像素字>*/
  background-color: #f31a1a;
}
.nav .nav-public-box .commodity-class-box .class-body {
  width: 100%;
  /*菜单分类*/
  background-color: #fe4848;
  /*菜单组*/
}
.nav .nav-public-box .commodity-class-box .class-body > li {
  width: 100%;
  height: 90px;
  box-sizing: border-box;
  padding: 17px 20px 0 17px;
  cursor: pointer;
  position: relative;
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class a {
  color: #fff;
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class {
  /*主要分类*/
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class p {
  line-height: 40px;
  position: relative;
  box-sizing: border-box;
  padding-left: 37px;
  font-size: 18px;
  /*<18像素字>*/
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class p .unfold-icon {
  position: absolute;
  width: 6px;
  height: 10px;
  right: 0;
  top: 50%;
  margin-top: -5px;
  background: transparent url(../images/SpriteIcon.html) no-repeat;
  background-position: 0 -219px;
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class > span {
  /*<12像素字>*/
  font-size: 12px;
  /*<12像素字>*/
  margin-right: 4px;
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class > span:nth-of-type(1) {
  margin-left: 39px;
}
.nav .nav-public-box .commodity-class-box .class-body > li:hover {
  background-color: #ffeded;
}
.nav .nav-public-box .commodity-class-box .class-body > li:hover .type-class a {
  color: #fe4848;
}
.nav .nav-public-box .commodity-class-box .class-body > li:hover .type-class .unfold-icon {
  background: transparent url(../images/SpriteIcon.html) no-repeat;
  background-position: 0 -239px;
}
.nav .nav-public-box .commodity-class-box .class-body > li:hover .type-icon img {
  -webkit-transform: translateY(-28px);
  -moz-transform: translateY(-28px);
  -ms-transform: translateY(-28px);
  -o-transform: translateY(-28px);
  transform: translateY(-28px);
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class-more-box {
  /*更多分类*/
  width: 714px;
  height: 660px;
  background-color: #fff;
  position: absolute;
  left: 242px;
  cursor: default;
  box-sizing: border-box;
  padding: 22px 18px 0 24px;
  display: none;
  border-top: 8px solid #fff;
  border-left: 6px solid #fff;
  z-index: 5;
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class-more-box .list-box {
  width: 100%;
  height: auto;
  margin-bottom: 10px;
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class-more-box .list-box .title {
  width: 96px;
  position: relative;
  float: left;
  color: #515151;
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class-more-box .list-box .title i {
  position: absolute;
  width: 6px;
  height: 10px;
  background: transparent url(../images/SpriteIcon.html) no-repeat;
  background-position: 0 -239px;
  right: 15px;
  top: 50%;
  margin-top: -5px;
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class-more-box .list-box .type-class-list {
  /*分类列表*/
  width: 564px;
  margin-bottom: 10px;
  height: auto;
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class-more-box .list-box .type-class-list li {
  font-size: 14px;
  /*<14像素字>*/
  float: left;
  width: 80px;
  text-align: center;
  box-sizing: border-box;
  border-left: 1px solid #ddd;
  margin-bottom: 13px;
  cursor: pointer;
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class-more-box .list-box .type-class-list li a {
  color: #a5a5a5;
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class-more-box .list-box .type-class-list li:hover a {
  color: #fe4848;
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class-more-box .list-box .type-class-list li:first-child {
  border-left: none;
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class-more-box .list-box .type-class-list li:nth-of-type(8n) {
  border-left: none;
}
.nav .nav-public-box .commodity-class-box .class-body > li .type-class-more-box .load-default {
  /*加载动画*/
  left: 0;
  bottom: 0;
  width: 100%;
  height: 254px;
}
.nav .nav-public-box .commodity-class-box .class-body .type-icon {
  position: absolute;
  left: 0;
  width: 28px;
  height: 28px;
  top: 8px;
  overflow: hidden;
}
.nav .nav-public-box .commodity-class-box .class-body .type-icon img {
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
.nav .nav-public-box .commodity-class-box .class-body > li:nth-of-type(1) {
  /*健康食品*/
  /*  .type-icon{
              top:6px;
              background: transparent url(../images/SpriteIcon.png) no-repeat;
              background-position: -43px 0;
            }
            &:hover{
              .type-icon{
                background: transparent url(../images/SpriteIcon.png) no-repeat;
                background-position: -43px -42px;
              }
            }*/
}
.nav .nav-public-box .commodity-class-box .class-body > li:nth-of-type(1) .type-class-more-box {
  /*更多分类*/
  top: 0;
}
.nav .nav-public-box .commodity-class-box .class-body > li:nth-of-type(2) {
  /*康复护理*/
  /*  .type-icon{
              top:9px;
              background: transparent url(../images/SpriteIcon.png) no-repeat;
              background-position: -43px -82px;
            }
            &:hover{
              .type-icon{
                background: transparent url(../images/SpriteIcon.png) no-repeat;
                background-position: -43px -114px;
              }
            }*/
}
.nav .nav-public-box .commodity-class-box .class-body > li:nth-of-type(2) .type-class-more-box {
  /*更多分类*/
  top: -90px;
}
.nav .nav-public-box .commodity-class-box .class-body > li:nth-of-type(3) {
  /*生活用品*/
  /* .type-icon{
             top:8px;
             background: transparent url(../images/SpriteIcon.png) no-repeat;
             background-position: -43px -145px;
           }
           &:hover{
             .type-icon{
               background: transparent url(../images/SpriteIcon.png) no-repeat;
               background-position: -43px -180px;
             }
           }*/
}
.nav .nav-public-box .commodity-class-box .class-body > li:nth-of-type(3) .type-class-more-box {
  /*更多分类*/
  top: -180px;
}
.nav .nav-public-box .commodity-class-box .class-body > li:nth-of-type(4) {
  /*最美夕阳*/
  /*.type-icon{
            top:8px;
            background: transparent url(../images/SpriteIcon.png) no-repeat;
            background-position: -43px -217px;
          }
          &:hover{
            .type-icon{
              background: transparent url(../images/SpriteIcon.png) no-repeat;
              background-position: -43px -250px;
            }
          }*/
}
.nav .nav-public-box .commodity-class-box .class-body > li:nth-of-type(4) .type-class-more-box {
  /*更多分类*/
  top: -270px;
}
.nav .nav-public-box .commodity-class-box .class-body > li:nth-of-type(5) {
  /*滋补保健*/
  /* .type-icon{
             top:8px;
             background: transparent url(../images/SpriteIcon.png) no-repeat;
             background-position: -43px -286px;
           }
           &:hover{
             .type-icon{
               background: transparent url(../images/SpriteIcon.png) no-repeat;
               background-position: -43px -325px;
             }
           }*/
}
.nav .nav-public-box .commodity-class-box .class-body > li:nth-of-type(5) .type-class-more-box {
  /*更多分类*/
  top: -360px;
}
.nav .nav-public-box .commodity-class-box .class-body > li:nth-of-type(6) {
  /*老年礼品*/
  /*  .type-icon{
              top:10px;
              background: transparent url(../images/SpriteIcon.png) no-repeat;
              background-position: -43px -366px;
            }
            &:hover{
              .type-icon{
                background: transparent url(../images/SpriteIcon.png) no-repeat;
                background-position: -43px -402px;
              }
            }*/
}
.nav .nav-public-box .commodity-class-box .class-body > li:nth-of-type(6) .type-class-more-box {
  /*更多分类*/
  top: -450px;
}
.nav .nav-public-box .commodity-class-box .banner {
  width: 100%;
  height: 120px;
  background-color: #fe4848;
}
.nav .nav-public-box .commodity-class-box .banner img {
  width: 100%;
  /*height: 120px;*/
}
/*登陆通用模板*/
.user-module {
  /*用户登陆与温馨提示*/
  background-color: transparent;
  box-sizing: border-box;
}
.user-module .user-body {
  width: 100%;
  height: 336px;
  background: #fff url(../images/SpriteIcon.html) no-repeat -325px 0;
  box-sizing: border-box;
  /*登陆前*/
  /*登陆后*/
  /*错误提示*/
  /*首页登陆背景动画*/
}
.user-module .user-body .front {
  position: relative;
}
.user-module .user-body .front .input-icon {
  width: 20px;
  height: 20px;
  position: absolute;
  z-index: 1;
  left: 0;
  top: 10px;
}
.user-module .user-body .front .input-icon.name {
  background: transparent url(../images/SpriteIcon.html) no-repeat 0 -438px;
  left: 7px;
  top: 85px;
}
.user-module .user-body .front .input-icon.password {
  background: transparent url(../images/SpriteIcon.html) no-repeat 0 -459px;
  left: 9px;
  top: 126px;
}
.user-module .user-body .queen {
  position: relative;
  /* 用户操作列表 */
}
.user-module .user-body .queen .user-img {
  width: 65px;
  height: 65px;
}
.user-module .user-body .queen .out-btn {
  position: absolute;
  z-index: 1;
  right: 0;
  top: 0;
  background-color: transparent;
}
.user-module .user-body .queen .user-icon-list {
  box-sizing: border-box;
}
.user-module .user-body .queen .user-icon-list li {
  width: 50px;
  height: 50px;
  text-align: center;
  box-sizing: border-box;
  font-size: 12px;
  color: #333;
  cursor: pointer;
  position: relative;
  border-radius: 2px;
  float: left;
  margin-right: 18px;
  margin-top: 20px;
}
.user-module .user-body .queen .user-icon-list li .make {
  width: 16px;
  height: 16px;
  background-color: #fe4848;
  position: absolute;
  right: 3px;
  top: -3px;
  border-radius: 50%;
  font-size: 12px;
  color: #fff;
  line-height: 16px;
  text-align: center;
}
.user-module .user-body .queen .user-icon-list li i {
  width: 100%;
  height: 25px;
  display: block;
  margin-bottom: 5px;
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
.user-module .user-body .queen .user-icon-list li:nth-of-type(1) {
  display: block;
  margin: auto;
  float: none;
  width: 82px;
  height: 30px;
  line-height: 28px;
  border: 1px solid #fe4848;
}
.user-module .user-body .queen .user-icon-list li:nth-of-type(1) a {
  color: #fe4848;
}
.user-module .user-body .queen .user-icon-list li:nth-of-type(1):hover {
  background-color: #fe4848;
}
.user-module .user-body .queen .user-icon-list li:nth-of-type(1):hover a {
  color: #fff;
}
.user-module .user-body .queen .user-icon-list li:hover a {
  color: #fe4848;
}
.user-module .user-body .queen .user-icon-list li:nth-of-type(2) i {
  background: transparent url(../images/SpriteIcon.html) no-repeat 12px -3408px;
}
.user-module .user-body .queen .user-icon-list li:nth-of-type(3) i {
  background: transparent url(../images/SpriteIcon.html) no-repeat 14px -3481px;
}
.user-module .user-body .queen .user-icon-list li:nth-of-type(4) {
  margin-right: 0;
}
.user-module .user-body .queen .user-icon-list li:nth-of-type(4) i {
  background: transparent url(../images/SpriteIcon.html) no-repeat 14px -3560px;
}
.user-module .user-body .queen .user-icon-list li:nth-of-type(5) i {
  background: transparent url(../images/SpriteIcon.html) no-repeat 14px -3648px;
}
.user-module .user-body .queen .user-icon-list li:nth-of-type(6) i {
  background: transparent url(../images/SpriteIcon.html) no-repeat 14px -3729px;
}
.user-module .user-body .queen .user-icon-list li:nth-of-type(7) {
  margin-right: 0;
}
.user-module .user-body .queen .user-icon-list li:nth-of-type(7) i {
  background: transparent url(../images/SpriteIcon.html) no-repeat 14px -3816px;
}
.user-module .user-body .user-img {
  margin: auto auto 14px auto;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  box-shadow: 0 0 20px -1px rgba(240, 158, 0, 0.8);
  display: block;
}
.user-module .user-body input[type=text],
.user-module .user-body input[type=password] {
  font-size: 10px;
}
.user-module .user-body input[type=text]:focus,
.user-module .user-body input[type=password]:focus {
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
  border: 1px solid #f09e00;
}
.user-module .user-body .input-icon {
  background: #fff url(../images/SpriteIcon.html) no-repeat 0 -450px;
}
.user-module .user-body .user-name,
.user-module .user-body .user-password {
  width: 100%;
  height: 33px;
  box-sizing: border-box;
  border: 1px solid #ccc;
  padding-left: 31px;
  margin-bottom: 9px;
}
.user-module .user-body .user-password {
  margin-bottom: 4px;
}
.user-module .user-body .automatic {
  /*自动登录*/
  width: 75px;
  height: 16px;
  line-height: 16px;
  box-sizing: border-box;
  padding-left: 10px;
  position: relative;
  color: #333;
  /*<12像素字>*/
  font-size: 12px;
  /*<12像素字>*/
}
.user-module .user-body .automatic input[type=checkbox] {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
  opacity: 0;
  cursor: pointer;
  background-color: transparent;
}
.user-module .user-body .automatic input[type=checkbox]:checked + i {
  background-color: #35a068;
  border: 1px solid #35a068;
  width: 8px;
  height: 8px;
  box-shadow: 0 0 0 0.5px #FFF inset;
}
.user-module .user-body .automatic i {
  width: 8px;
  height: 8px;
  position: absolute;
  border-radius: 50%;
  border: 1px solid #b0afaf;
  background-color: transparent;
  box-sizing: border-box;
  top: 4px;
  left: 0;
}
.user-module .user-body .btn {
  width: 150px;
  height: 31px;
  border-radius: 15px;
  display: block;
  margin: auto;
  box-sizing: border-box;
}
.user-module .user-body .sub-btn {
  background-color: #fe4848;
  color: #fff;
  margin-top: 17px;
}
.user-module .user-body .register-btn {
  border: 1px solid #fe4848;
  color: #fe4848;
  background-color: transparent;
  margin-top: 13px;
}
.user-module .user-body .error {
  position: absolute;
}
.user-module .user-body[data-subShow="true"] {
  animation: bgShow 2s steps(22) forwards;
}
@keyframes bgShow {
  0% {
    background: #fff url(../images/SpriteIcon.html) no-repeat -325px 0;
  }
  100% {
    background: #fff url(../images/SpriteIcon.html) no-repeat -325px -7612px;
  }
}
.user-module .tips-box {
  /*小贴士*/
  width: 100%;
  height: 310px;
  margin: 6px 0 0 0;
  background: #fff url(../images/SpriteIcon.html) no-repeat -610px 0;
  position: relative;
  box-sizing: border-box;
  padding: 59px 5px 7px 5px;
  text-align: justify;
}
.user-module .tips-box .title {
  position: absolute;
  width: 58px;
  height: 34px;
  left: 12px;
  top: 0;
  text-align: center;
  line-height: 34px;
  background: transparent url(../images/SpriteIcon.html) no-repeat -599px -347px;
  color: #fa723f;
}
.user-module .tips-box .text {
  box-sizing: border-box;
  padding: 0 25px 0 16px;
  font-size: 14px;
  /*<14像素字>*/
  color: #666;
}
.user-module .tips-box .tips-img {
  position: absolute;
  left: 5px;
  bottom: 7px;
  z-index: 1;
}
.user-module .tips-box button {
  width: 90px;
  height: 22px;
  border-radius: 8px;
  background-color: #fa723f;
  color: #fff;
  font-size: 14px;
  position: absolute;
  right: 15px;
  bottom: 125px;
  z-index: 2;
  box-shadow: 1px 1px 5px 1px rgba(250, 114, 64, 0.5);
}
/*切换功能组件*/
.tab-list-box {
  width: 100%;
  height: auto;
  overflow: hidden;
}
.tab-list-box .tab-list-parent {
  width: 1200px;
  height: auto;
  float: left;
  /*品牌推荐*/
}
.tab-list-box .tab-list-parent > li {
  float: left;
  width: 595px;
  height: 336px;
  margin-right: 9px;
  margin-top: 10px;
  background-color: #fff;
  box-sizing: border-box;
  padding: 30px 30px 20px 0;
}
.tab-list-box .tab-list-parent > li:nth-of-type(2n) {
  margin-right: 0;
}
.tab-list-box .tab-list-parent > li:nth-of-type(1),
.tab-list-box .tab-list-parent > li:nth-of-type(2) {
  margin-top: 0;
}
.tab-list-box .tab-list-parent.tab-list-brand > li {
  padding: 0;
  background-color: transparent;
  box-shadow: none;
}
.tab-list-box .tab-list-parent.tab-list-brand > li > .po-relative {
  height: 100%;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .btn {
  position: absolute;
  top: 160px;
  z-index: 3;
  width: 22px;
  height: 22px;
  cursor: pointer;
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .btn.btn-left {
  background: url(../images/SpriteIcon.html) no-repeat 0 -1082px;
  left: 13px;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .btn.btn-left:hover {
  background: url(../images/SpriteIcon.html) no-repeat 0 -1114px;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .btn.btn-right {
  background: url(../images/SpriteIcon.html) no-repeat 0 -1148px;
  right: 13px;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .btn.btn-right:hover {
  background: url(../images/SpriteIcon.html) no-repeat 0 -1181px;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .brand-img-body {
  width: 299px;
  height: 100%;
  position: relative;
  z-index: 2;
  overflow: hidden;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .brand-img-body li {
  width: 100%;
  height: 301px;
  background-color: #fff;
  position: absolute;
  bottom: 0;
  z-index: 3;
  box-shadow: -2px -1px 22px -6px rgba(255, 108, 97, 0.5);
  text-align: center;
  line-height: 301px;
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .brand-img-body li img {
  vertical-align: bottom;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .brand-img-body li:nth-of-type(2) {
  z-index: 2;
  background-color: #fff;
  -webkit-transform: translate(11px);
  -moz-transform: translate(11px);
  -ms-transform: translate(11px);
  -o-transform: translate(11px);
  transform: translate(11px);
  opacity: 0.6;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .brand-img-body li:nth-of-type(3) {
  z-index: 1;
  background-color: #fff;
  -webkit-transform: translate(22px);
  -moz-transform: translate(22px);
  -ms-transform: translate(22px);
  -o-transform: translate(22px);
  transform: translate(22px);
  opacity: 0.4;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .brand-text-body {
  width: 293px;
  height: 100%;
  text-align: center;
  box-sizing: border-box;
  padding-top: 43px;
  background-color: #fff;
  box-shadow: -4px 0 11px -4px rgba(255, 108, 97, 0.5);
  z-index: 3;
  position: relative;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .brand-text-body .color666 {
  color: #666;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .brand-text-body .color999 {
  color: #999;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .brand-text-body .line {
  width: 130px;
  height: 2px;
  display: block;
  margin: 10px auto;
  background-color: #f31a1a;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .brand-text-body h2 {
  font-size: 24px;
  font-weight: 500;
  margin: 10px auto;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .brand-text-body button {
  width: 110px;
  height: 35px;
  background-color: #fe4848;
  color: #fff;
  font-size: 16px;
  margin-top: 25px;
}
.tab-list-box .tab-list-parent.tab-list-brand > li .brand-text-body .logo {
  width: 123px;
  height: 64px;
  object-fit: cover;
}
/*轮播组件*/
.module-banner-box {
  /*组件轮播图*/
  width: 100%;
  position: relative;
}
.module-banner-box .module-banner-body {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.commodity-list-body,
.like-list-body {
  /* 商品列表 */
  width: 100%;
  box-sizing: border-box;
  height: auto;
}
.commodity-list-body li {
  width: 276px;
  height: 412px;
  box-sizing: border-box;
  border: 1px solid #fff;
  background-color: transparent;
  padding: 0 15px;
  margin: 0 15px 15px 0;
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
  float: left;
}
.commodity-list-body li .img-content {
  width: 100%;
  height: 258px;
  /*      border-bottom: 2px solid #efefef;*/
  text-align: center;
  position: relative;
  line-height: 258px;
}
.commodity-list-body li .img-content img {
  vertical-align: middle;
  max-height: 100%;
}
.commodity-list-body li .text-content {
  width: 100%;
  height: auto;
}
.commodity-list-body li .text-content h2 {
  color: #333;
  line-height: 16px;
  margin: 10px 0;
  font-size: 16px;
  /*<16像素字>*/
}
.commodity-list-body li .text-content p.text {
  line-height: 20px;
  color: #b6b6b6;
  font-size: 14px;
  /*<14像素字>*/
}
.commodity-list-body li .text-content p.price {
  color: #fe4848;
  line-height: 22px;
  /*<12像素字>*/
  font-size: 12px;
  /*<12像素字>*/
}
.commodity-list-body li .text-content p.price span {
  font-size: 22px;
}
.commodity-list-body li .btn-body {
  width: 100%;
  height: 50px;
  background-color: transparent;
  box-sizing: border-box;
  padding-top: 11px;
}
.commodity-list-body li .btn-body .add-btn {
  width: 87px;
  height: 28px;
  text-align: center;
  line-height: 28px;
  font-size: 14px;
  /*<14像素字>*/
}
.commodity-list-body li .btn-body .add-btn:first-child {
  background-color: #fd726d;
  color: #fff;
}
.commodity-list-body li .btn-body .add-btn:last-child {
  color: #a1a1a1;
  text-align: center;
  line-height: 28px;
  position: relative;
  float: right;
}
.commodity-list-body li .btn-body .add-btn:last-child input {
  position: absolute;
  z-index: 2;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}
.commodity-list-body li .btn-body .add-btn:last-child input + span {
  display: block;
  background: transparent url(../images/SpriteIcon.html) no-repeat 5px -1631px;
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
.commodity-list-body li .btn-body .add-btn:last-child input:checked + span {
  background: transparent url(../images/SpriteIcon.html) no-repeat 5px -1676px;
  color: #fe4848;
}
/* 喜欢列表 */
.like-list-body {
  padding: 18px 18px 0 18px !important;
}
.like-list-body li {
  width: 221px;
  height: 365px;
  margin-right: 14px;
  box-sizing: border-box;
  float: left;
}
.like-list-body li .img-content {
  width: 221px;
  height: 221px;
  border: 1px solid #eaeaea;
  text-align: center;
  line-height: 221px;
}
.like-list-body li .img-content img {
  max-width: 100%;
  max-height: 100%;
  vertical-align: middle;
}
.like-list-body li .text-content .text {
  line-height: 20px;
  font-size: 14px;
  margin-top: 10px;
}
.like-list-body li .text-content .price {
  color: #fe4848;
  line-height: 22px;
  font-size: 12px;
}
.like-list-body li .text-content .price span {
  font-size: 22px;
}
.like-list-body li .btn-body {
  width: 100%;
  height: 50px;
  background-color: transparent;
  box-sizing: border-box;
  padding-top: 11px;
}
.like-list-body li .btn-body .add-btn {
  width: 87px;
  height: 28px;
  font-size: 14px;
  /*<14像素字>*/
}
.like-list-body li .btn-body .add-btn:first-child {
  background-color: #fd726d;
  color: #fff;
}
.like-list-body li .btn-body .add-btn:last-child {
  color: #a1a1a1;
  text-align: center;
  line-height: 28px;
  position: relative;
  float: right;
}
.like-list-body li .btn-body .add-btn:last-child input {
  position: absolute;
  z-index: 2;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}
.like-list-body li .btn-body .add-btn:last-child input + span {
  display: block;
  background: transparent url(../images/SpriteIcon.html) no-repeat 5px -1631px;
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
.like-list-body li .btn-body .add-btn:last-child input:checked + span {
  background: transparent url(../images/SpriteIcon.html) no-repeat 5px -1676px;
  color: #fe4848;
}
/*搜索结果样式*/
.search-result {
  line-height: 52px;
  /*<12像素字>*/
  font-size: 12px;
  /*<12像素字>*/
  color: #9e9e9e;
}
.search-result a {
  color: #9e9e9e;
}
.search-result span {
  color: #676767;
  font-weight: bold;
}
.search-result span.active:before {
  content: "“";
}
.search-result span.active:after {
  content: "”";
}
.search-result span.active:before,
.search-result span.active:after {
  font-size: 14px;
  color: #676767;
}
/* 底部信息栏 */
.footer-box {
  box-sizing: border-box;
  width: 100%;
  height: auto;
  background-size: 100% auto;
  /*安全保障*/
  /*关于我们*/
  /*外链*/
}
.footer-box .line {
  width: 100%;
  height: 1px;
  background-color: #eaeaea;
}
.footer-box .logo2 {
  width: 100%;
  height: 49px;
  background: #fe4848 url(../images/footer_logo2_bg.html) no-repeat;
  background-size: 100% auto;
  overflow: hidden;
  background-image: -webkit-linear-gradient(to right, #fe4848, #fc2a74);
  background-image: linear-gradient(to right, #fe4848, #fc2a74);
}
.footer-box .logo2 img {
  max-width: 100%;
  max-height: 100%;
  vertical-align: bottom;
}
.footer-box .safeguard-body {
  width: 100%;
  height: auto;
  box-sizing: border-box;
  padding: 40px 0 40px 328px;
  position: relative;
}
.footer-box .safeguard-body:before {
  content: " ";
  position: absolute;
  width: 116px;
  height: 81px;
  left: 60px;
  top: 18px;
  background: transparent url(../images/bq_logo.png) no-repeat;
}
.footer-box .safeguard-body li {
  width: 236px;
  height: 40px;
  float: left;
  box-sizing: border-box;
  padding-left: 14px;
  position: relative;
  border-left: 2px solid #f31a1a;
  /*&:nth-of-type(1){
        i{
          background: transparent url(../images/SpriteIcon.png) no-repeat -207px 0;
        }
      }
      &:nth-of-type(2){
        i{
          background: transparent url(../images/SpriteIcon.png) no-repeat -207px -65px;
        }
      }
      &:nth-of-type(3){
        i{
          background: transparent url(../images/SpriteIcon.png) no-repeat -207px -130px;
        }
      }
      &:nth-of-type(4){
        i{
          background: transparent url(../images/SpriteIcon.png) no-repeat -207px -195px;
        }
      }*/
}
.footer-box .safeguard-body li:last-child {
  width: 146px;
}
.footer-box .safeguard-body li h2 {
  font-size: 16px;
  line-height: 14px;
  font-weight: bold;
}
.footer-box .safeguard-body li h2 span {
  color: #f31a1a;
}
.footer-box .safeguard-body li p {
  font-size: 12px;
  color: #999;
  margin-top: 12px;
}
.footer-box .safeguard-body li i {
  width: 55px;
  height: 55px;
  display: inline-block;
  position: absolute;
  left: 0;
  top: 2.5px;
}
.footer-box .about-body {
  width: 100%;
  height: auto;
  box-sizing: border-box;
  padding: 35px 0 40px 20px;
  /*关于我们列表*/
}
.footer-box .about-body p {
  font-size: 18px;
}
.footer-box .about-body ul {
  min-height: 87px;
}
.footer-box .about-body ul li {
  margin-top: 12px;
  text-align: left;
  box-sizing: border-box;
  padding-left: 63px;
}
.footer-box .about-body ul li a {
  font-size: 12px;
  color: #727272;
}
.footer-box .about-body ul li:last-child {
  margin-bottom: 0;
}
.footer-box .about-body div.f-left {
  width: 195px;
  border-right: 1px solid #eaeaea;
  text-align: center;
}
.footer-box .about-body div.f-left:first-child {
  border-left: none;
}
.footer-box .about-body div.f-left:last-child {
  border-right: none;
}
.footer-box .about-body div.f-left:last-child ul li {
  padding-left: 0;
  margin-top: 0;
}
.footer-box .about-body div.f-left:last-child ul li:first-child {
  font-size: 18px;
}
.footer-box .about-body div.f-left:last-child ul li img {
  width: 110px;
  margin-top: 10px;
}
.footer-box .about-body div.f-left p {
  font-size: 18px;
  color: #333;
}
.footer-box .about-body div.f-left:last-child {
  margin-right: 0;
}
.footer-box .about-body div.f-left:last-child ul li {
  text-align: center;
}
.footer-box .link-list-box {
  width: 100%;
  min-height: 140px;
  background-color: #3c3c3c;
  font-size: 12px;
}
.footer-box .link-list-box .link-list-body {
  width: 1200px;
  height: auto;
  box-sizing: border-box;
  margin: auto;
  padding: 22px 0 17px 60px;
  text-align: center;
}
.footer-box .link-list-box .link-list-body li {
  box-sizing: border-box;
  padding: 0 10px;
  border-right: 1px solid #7a7a7a;
  height: 13px;
  display: inline-block;
  line-height: 13px;
  float: left;
}
.footer-box .link-list-box .link-list-body li:first-child {
  padding-left: 0;
}
.footer-box .link-list-box .link-list-body li a {
  color: #7a7a7a;
}
.footer-box .link-list-box .link-list-body li:last-child {
  border-right: none;
}
.footer-box .link-list-box .records-list-box {
  width: 1200px;
  box-sizing: border-box;
  padding-left: 60px;
  margin: auto;
  color: #7a7a7a;
}
.footer-box a {
  -webkit-transition: color 0.3s ;
  -moz-transition: color 0.3s ;
  -ms-transition: color 0.3s ;
  -o-transition: color 0.3s ;
  transition: color 0.3s ;
}
.footer-box a:hover {
  color: #f31a1a !important;
}
.footer-box > p {
  font-size: 16px;
  color: #7d7d7d;
  text-align: center;
  margin-bottom: 5px;
}
.footer-box .show {
  margin-top: 12px;
}
.footer-box .show img {
  margin-right: 13px;
}
/*浮动导航*/
.float-nav-box {
  position: fixed;
  z-index: 12;
  width: 50px;
  height: 100%;
  top: 0;
  right: 0;
  background-color: #fff;
  box-shadow: 1px 0 7px 0px rgba(0, 0, 0, 0.2);
}
.float-nav-box a {
  display: block;
  width: 100%;
  height: 100%;
}
.float-nav-box li {
  position: relative;
  z-index: 10;
}
.float-nav-box li .right-hide {
  position: absolute;
  z-index: 9;
  width: 87px;
  height: 100%;
  text-align: center;
  background-color: rgba(254, 72, 72, 0.8);
  color: #fff;
  font-size: 14px;
  left: -87px;
  top: 0;
  visibility: hidden;
  -webkit-transform: translateX(-30px);
  -moz-transform: translateX(-30px);
  -ms-transform: translateX(-30px);
  -o-transform: translateX(-30px);
  transform: translateX(-30px);
  opacity: 0;
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
.float-nav-box li:hover .right-hide {
  visibility: visible;
  -webkit-transform: translateX(0px);
  -moz-transform: translateX(0px);
  -ms-transform: translateX(0px);
  -o-transform: translateX(0px);
  transform: translateX(0px);
  opacity: 1;
}
.float-nav-box ul.nav-top {
  position: absolute;
  top: 210px;
  width: 100%;
}
.float-nav-box ul.nav-top li {
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
  cursor: pointer;
  margin-bottom: 5px;
}
.float-nav-box ul.nav-top li:last-child {
  margin-bottom: 0;
}
.float-nav-box ul.nav-top li:nth-of-type(1),
.float-nav-box ul.nav-top li:nth-of-type(3) {
  width: 100%;
  height: 50px;
  background-color: red;
}
.float-nav-box ul.nav-top li:nth-of-type(1) .right-hide,
.float-nav-box ul.nav-top li:nth-of-type(3) .right-hide {
  line-height: 50px;
}
.float-nav-box ul.nav-top li:nth-of-type(1) {
  background: transparent url(../images/SpriteIcon.html) no-repeat 14px -3892px;
}
.float-nav-box ul.nav-top li:nth-of-type(1):hover {
  background: rgba(254, 72, 72, 0.8) url(../images/SpriteIcon.html) no-repeat 14px -3965px;
}
.float-nav-box ul.nav-top li:nth-of-type(3) {
  background: transparent url(../images/SpriteIcon.html) no-repeat 14px -4181px;
}
.float-nav-box ul.nav-top li:nth-of-type(3):hover {
  background: rgba(254, 72, 72, 0.8) url(../images/SpriteIcon.html) no-repeat 14px -4255px;
}
.float-nav-box ul.nav-top li:nth-of-type(2) {
  width: 100%;
  height: 130px;
  text-align: center;
  box-sizing: border-box;
  padding: 40px 16px 35px 18px;
  font-size: 14px;
  background-color: rgba(254, 72, 72, 0.8);
  color: #fff;
}
.float-nav-box ul.nav-top li:nth-of-type(2):hover {
  background-color: #fe4848;
}
.float-nav-box ul.nav-top li:nth-of-type(2) i {
  position: absolute;
  width: 26px;
  height: 26px;
  left: 12px;
  top: 10px;
  background: transparent url(../images/SpriteIcon.html) 1px -4122px no-repeat;
}
.float-nav-box ul.nav-top li:nth-of-type(4) {
  width: 100%;
  height: 50px;
  background: transparent url(../images/SpriteIcon.html) no-repeat 14px -4330px;
}
.float-nav-box ul.nav-top li:nth-of-type(4):hover {
  background: rgba(254, 72, 72, 0.8) url(../images/SpriteIcon.html) no-repeat 14px -4403px;
}
.float-nav-box ul.nav-top li:nth-of-type(4) .right-hide {
  line-height: 50px;
}
.float-nav-box ul.nav-bottom {
  position: absolute;
  bottom: 0;
}
.float-nav-box ul.nav-bottom li {
  width: 50px;
  height: 50px;
  margin-bottom: 5px;
  cursor: pointer;
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
.float-nav-box ul.nav-bottom li .right-hide {
  line-height: 50px;
}
.float-nav-box ul.nav-bottom li:last-child {
  margin-bottom: 0;
}
.float-nav-box ul.nav-bottom li:nth-of-type(1) {
  background: transparent url(../images/SpriteIcon.html) 14px -4474px;
}
.float-nav-box ul.nav-bottom li:nth-of-type(1):hover {
  background: rgba(254, 72, 72, 0.8) url(../images/SpriteIcon.html) no-repeat 14px -4546px;
}
.float-nav-box ul.nav-bottom li:nth-of-type(2) {
  background: transparent url(../images/SpriteIcon.html) no-repeat 14px -4546px;
  position: relative;
  display: none;
}
.float-nav-box ul.nav-bottom li:nth-of-type(2) span {
  width: 16px;
  height: 16px;
  background-color: #f31a1a;
  position: absolute;
  border-radius: 50%;
  font-size: 12px;
  line-height: 16px;
  text-align: center;
  color: #fff;
  right: 15px;
  top: 15px;
}
.float-nav-box ul.nav-bottom li:nth-of-type(2):hover {
  background: transparent url(../images/SpriteIcon.html) no-repeat -100px -210px;
}
.float-nav-box ul.nav-bottom li:nth-of-type(2):hover span {
  opacity: 0;
}
.float-nav-box ul.nav-bottom li:nth-of-type(3) {
  background: transparent url(../images/SpriteIcon.html) no-repeat 14px -4622px;
}
.float-nav-box ul.nav-bottom li:nth-of-type(3):hover {
  background: rgba(254, 72, 72, 0.8) url(../images/SpriteIcon.html) no-repeat 14px -4695px;
}
.float-nav-box ul.nav-bottom li:nth-of-type(4) {
  background: transparent url(../images/SpriteIcon.html) no-repeat 14px -4767px;
}
.float-nav-box ul.nav-bottom li:nth-of-type(4):hover {
  background: rgba(254, 72, 72, 0.8) url(../images/SpriteIcon.html) no-repeat 14px -4840px;
}
.float-nav-box ul.nav-bottom li:nth-of-type(4) .right-hide {
  width: 127px;
  height: 125px;
  line-height: normal;
  text-align: center;
  left: -127px;
  top: -28px;
}
.float-nav-box ul.nav-bottom li:nth-of-type(4) .right-hide img {
  margin-top: 4px;
}
.float-nav-box ul.nav-bottom li:nth-of-type(5) {
  background: transparent url(../images/SpriteIcon.html) no-repeat 14px -4911px;
  display: none;
}
.float-nav-box ul.nav-bottom li:nth-of-type(5):hover {
  background: rgba(254, 72, 72, 0.8) url(../images/SpriteIcon.html) no-repeat 14px -4985px;
}
.nav[data-nav="index"] {
  /*主页分页导航独享样式*/
  height: 46px;
  background-color: transparent;
  /*overflow: hidden;*/
}
.nav[data-nav="index"] .active {
  position: absolute;
  z-index: 1;
  background: transparent url(../images/SpriteIcon.html) no-repeat -207px -260px;
  width: 88px;
  height: 32px;
  top: 8px;
  left: 7px;
  display: none;
  /*    -webkit-transition: transform 0.3s;
        -moz-transition: transform 0.3s;
        -ms-transition: transform 0.3s;
        -o-transition: transform 0.3s;*/
  -webkit-transform: translateX(-113px);
  -moz-transform: translateX(-113px);
  -ms-transform: translateX(-113px);
  -o-transform: translateX(-113px);
  transform: translateX(-113px);
}
.nav[data-nav="index"] > .title {
  width: 242px;
  line-height: 47px;
  margin-right: 5px;
  background-color: #f31a1a;
  color: #fff;
  padding-left: 20px;
  box-sizing: border-box;
  font-size: 16px;
  float: left;
}
.nav[data-nav="index"] > ul {
  float: left;
  height: 100%;
  line-height: 47px;
  text-align: center;
  position: relative;
  z-index: 2;
  font-size: 18px;
  /*<18像素字>*/
  font-weight: bold;
  /*<粗体>*/
}
.nav[data-nav="index"] > ul li {
  float: left;
  width: 88px;
  padding-right: 15px;
}
.nav[data-nav="index"] > ul li a {
  color: #fe4848;
  display: block;
}
.nav[data-nav="index"] > ul li:hover a {
  color: #fff;
  background: transparent url(../images/SpriteIcon.html) no-repeat -207px -252px;
}
.nav[data-nav="index"] > ul li[data-new="true"] {
  position: relative;
}
.nav[data-nav="index"] > ul li[data-new="true"] a {
  color: #faa819;
}
.nav[data-nav="index"] > ul li[data-new="true"]:hover a {
  color: #fff;
}
.nav[data-nav="index"] > ul li[data-new="true"]:hover i {
  display: none;
}
.nav[data-nav="index"] > ul li[data-new="true"] i {
  position: absolute;
  width: 30px;
  height: 13px;
  border-radius: 20px;
  background: url(../images/SpriteIcon.html) no-repeat 0 -3140px;
  line-height: 10px;
  text-align: center;
  font-size: 6px;
  top: 8px;
  right: 0;
  display: block;
  color: #fff;
  -webkit-animation: newShow 0.8s infinite;
  -moz-animation: newShow 0.8s infinite;
  -ms-animation: newShow 0.8s infinite;
  -o-animation: newShow 0.8s infinite;
  animation: newShow 0.8s infinite;
}
@keyframes newShow {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}
.nav[data-nav="index"] > ul li[data-new="true"]:hover:after {
  content: " ";
  display: none;
}
.nav[data-nav="index"] > ul li[data-new="315"] a {
  color: #35a068;
}
.nav[data-nav="index"] > ul li[data-new="315"]:hover a {
  color: #fff;
}
.nav[data-nav="index"] > ul li:last-child {
  padding-right: 0;
}
.nav[data-nav="index"] > ul li:first-child {
  margin-left: 7px;
}
/*弹窗组件*/
.dialog-box {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 20;
  background-color: rgba(0, 0, 0, 0.5);
}
.dialog-box .dialog-body {
  position: absolute;
  left: 50%;
  top: 50%;
  /*温馨提示*/
  /*文案模板*/
  /*登陆模板*/
  /*右上角关闭按钮*/
}
.dialog-box .dialog-body.text-body {
  width: 437px;
  height: 321px;
  margin: -180.5px 0 0 -218.5px;
  background: #fff url(../images/SpriteIcon.html) no-repeat -963px 0;
  box-sizing: border-box;
  padding-top: 222px;
  text-align: center;
}
.dialog-box .dialog-body.text-body button {
  width: 89px;
  height: 28px;
  background-color: #fe4848;
  color: #fff;
  margin-top: 30px;
  /*<12像素字>*/
  font-size: 12px;
  /*<12像素字>*/
}
.dialog-box .dialog-body.text-body h2 {
  color: #786083;
  font-weight: 500;
  font-size: 16px;
  /*<16像素字>*/
}
.dialog-box .dialog-body.official-body {
  width: 694px;
  height: 624px;
  margin: -312px 0 0 -347px;
  text-align: center;
  background: #fff url(../images/bg_official.html) no-repeat;
}
.dialog-box .dialog-body.official-body h2 {
  margin-top: 185px;
  font-size: 22px;
  font-weight: 500;
}
.dialog-box .dialog-body.official-body .content {
  width: 588px;
  height: 306px;
  box-sizing: border-box;
  border: 1px solid #e4e4e4;
  overflow: auto;
  margin: 15px 0 0 52px;
  padding: 15px;
  text-align: justify;
  color: #7a7a7a;
  line-height: 25px;
  letter-spacing: 1px;
  font-size: 16px;
  /*<16像素字>*/
}
.dialog-box .dialog-body.official-body button {
  width: 78px;
  height: 31px;
  box-sizing: border-box;
  margin-top: 11px;
  font-size: 18px;
  /*<18像素字>*/
}
.dialog-box .dialog-body.official-body button:nth-of-type(1) {
  background-color: #fff;
  border: 1px solid #fe4848;
  color: #fe4848;
  margin-right: 20px;
}
.dialog-box .dialog-body.official-body button:nth-of-type(2) {
  background-color: #fe4848;
  color: #fff;
}
.dialog-box .dialog-body.user-module {
  width: 600px;
  height: 500px;
  margin: -250px 0 0 -300px;
  background: #fff url(../images/bg_login.html) no-repeat;
  box-sizing: border-box;
}
.dialog-box .dialog-body.user-module .user-body {
  width: 308px;
  height: auto;
  box-sizing: border-box;
  background: transparent none;
  margin: 229px 0 0 149px;
  padding: 0;
  float: left;
  /*图标*/
  /* 输入框 */
  /* 错误 */
  /*自动登陆*/
}
.dialog-box .dialog-body.user-module .user-body .po-relative:nth-of-type(1) .import-icon {
  background: transparent url(../images/SpriteIcon.html) no-repeat 16px -2935px;
}
.dialog-box .dialog-body.user-module .user-body .po-relative:nth-of-type(2) .import-icon {
  background: transparent url(../images/SpriteIcon.html) no-repeat 18px -3026px;
}
.dialog-box .dialog-body.user-module .user-body .import-icon {
  position: absolute;
  left: 0;
  top: 0;
  width: 45px;
  height: 45px;
}
.dialog-box .dialog-body.user-module .user-body .import-icon:after {
  content: " ";
  width: 1px;
  height: 14px;
  position: absolute;
  right: 0;
  top: 15px;
  background-color: #fd8d8d;
}
.dialog-box .dialog-body.user-module .user-body input[type="text"],
.dialog-box .dialog-body.user-module .user-body input[type="password"] {
  width: 100%;
  height: 45px;
  box-sizing: border-box;
  border: 1px solid #f2babb;
  background-color: rgba(255, 255, 255, 0.6);
  margin-bottom: 10px;
  padding-left: 60px;
}
.dialog-box .dialog-body.user-module .user-body .error {
  width: 120px;
  height: 45px;
  text-align: center;
  line-height: 45px;
  top: 0;
  right: -140px;
  background-color: #fe4848;
  color: #fff;
  opacity: 0;
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
  font-size: 14px;
  /*<14像素字>*/
}
.dialog-box .dialog-body.user-module .user-body .error.block {
  opacity: 1;
  right: -120px;
}
.dialog-box .dialog-body.user-module .user-body .error:before {
  content: " ";
  width: 0;
  height: 0;
  left: -10px;
  border-top: 5px solid transparent;
  border-right: 10px solid #fe4848;
  border-bottom: 5px solid transparent;
  position: absolute;
  top: 16px;
}
.dialog-box .dialog-body.user-module .user-body .automatic,
.dialog-box .dialog-body.user-module .user-body .automatic + a.f12 {
  color: #a4a4a4;
}
.dialog-box .dialog-body.user-module .user-body .btn {
  width: 192px;
  height: 42px;
  border-radius: 20px;
}
.dialog-box .dialog-body .close-btn {
  position: absolute;
  width: 41px;
  height: 41px;
  right: -20.5px;
  top: -20.5px;
  background: transparent url(../images/SpriteIcon.html) no-repeat -42px -481px;
  cursor: pointer;
}
/*页面状态信息*/
.state-code {
  margin: 100px  auto 100px auto;
}
.state-code.shop {
  width: 323px;
  height: 125px;
  background: transparent url(../images/SpriteIcon.html) no-repeat -1076px -688px;
}
.state-code.search {
  width: 421px;
  height: 164px;
  background: transparent url(../images/SpriteIcon.html) no-repeat -982px -870px;
}
.state-code.error404 {
  width: 430px;
  height: 89px;
  background: transparent url(../images/SpriteIcon.html) no-repeat -969px -536px;
}
.state-code.commodity-null {
  width: 337px;
  height: 97px;
  background: transparent url(../images/SpriteIcon.html) no-repeat -1059px -383px;
}
/* 购物须知 */
.shopping-notice {
  box-sizing: border-box;
  padding: 50px 60px;
}
.shopping-notice p.title {
  color: #f44b5b;
  position: relative;
  font-size: 30px;
  /*<30像素字>*/
  border-bottom: 1px dashed #f44b5b;
  padding-bottom: 15px;
}
.shopping-notice p.title img {
  vertical-align: middle;
}
.shopping-notice p.title span {
  position: absolute;
  bottom: 25px;
  left: 85px;
  font-weight: bold;
  /*<粗体>*/
}
.shopping-notice .list {
  box-sizing: border-box;
  padding-left: 50px;
  margin-top: 30px;
  margin-bottom: 30px;
  width: 765px;
}
.shopping-notice .list li {
  position: relative;
  box-sizing: border-box;
  padding-left: 20px;
  line-height: 40px;
  color: #333;
  font-size: 18px;
  /*<18像素字>*/
}
.shopping-notice .list li i {
  width: 6px;
  height: 6px;
  background-color: #f44b5b;
  position: absolute;
  left: 0;
  top: 17px;
}
.shopping-notice img.center {
  display: block;
  margin: 50px auto auto auto;
}
.shopping-notice p.type-class {
  background-color: #f44b5b;
  line-height: 43px;
  box-sizing: border-box;
  padding: 0 25px 0 12px;
  position: relative;
  color: #fff;
  margin-left: 85px;
  float: left;
  font-size: 18px;
  /*<18像素字>*/
}
.shopping-notice p.type-class:after {
  content: " ";
  position: absolute;
  width: 16px;
  height: 16px;
  right: 0;
  bottom: 0;
  background: transparent url(../images/icon01.html) no-repeat;
}
/*回到顶部*/
.float-nav-box li .right-hide {
  position: absolute;
  z-index: 9;
  width: 87px;
  height: 100%;
  text-align: center;
  background-color: rgba(254, 72, 72, 0.8);
  color: #fff;
  font-size: 14px;
  left: -87px;
  top: 0;
  visibility: hidden;
  -webkit-transform: translateX(-30px);
  -moz-transform: translateX(-30px);
  -ms-transform: translateX(-30px);
  -o-transform: translateX(-30px);
  transform: translateX(-30px);
  opacity: 0;
  -webkit-transition: all 0.3s ;
  -moz-transition: all 0.3s ;
  -ms-transition: all 0.3s ;
  -o-transition: all 0.3s ;
  transition: all 0.3s ;
}
.float-nav-box li:hover .right-hide {
  visibility: visible;
  -webkit-transform: translateX(0px);
  -moz-transform: translateX(0px);
  -ms-transform: translateX(0px);
  -o-transform: translateX(0px);
  transform: translateX(0px);
  opacity: 1;
}
.float-nav-box ul.nav-top li:nth-of-type(1) .right-hide,
.float-nav-box ul.nav-top li:nth-of-type(3) .right-hide {
  line-height: 50px;
}
.float-nav-box ul.nav-bottom li:nth-of-type(4) .right-hide {
  width: 127px;
  height: 125px;
  line-height: normal;
  text-align: center;
  left: -127px;
  top: -28px;
}
.float-nav-box ul.nav-bottom li:nth-of-type(4) .right-hide img {
  margin-top: 4px;
}
.float-nav-box ul.nav-top li:nth-of-type(4) .right-hide {
  line-height: 50px;
}
.float-nav-box ul.nav-bottom li .right-hide {
  line-height: 50px;
}
/*回到顶部闭合*/
.live {
  color: #fe4848;
}
.length {
  padding-bottom: 50px;
  padding-top: 50px;
}
.move {
  color: red;
}
/*页码*/
