/*header*/
#header {
  background-color: #fff;
  position: relative;
  top: 0;
  width: 100%;
  z-index: 10;
}
@media only screen and (max-width: 750px) {
  #header {
    position: sticky;
  }
}
/*topbar*/
#topbar {
  background-color: var(--main-color);
  padding: 0.1rem 0;
}
#topbar .inner {
  position: relative;
  padding: 0 0.2rem;
}
#topbar .text {
  background: url(../images/horn.svg) no-repeat left center;
  background-size: 0.9375em auto;
  padding-left: 1.875em;
}
#topbar .close {
  width: 0.12rem;
  height: 0.12rem;
  background: url(../images/close_01.svg) no-repeat center center;
  background-size: contain;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  cursor: pointer;
}
@media only screen and (max-width: 750px) {
  #topbar {
    padding: 0.05rem 0;
  }
}
/*topinfo*/
#topinfo {
  padding: 0.25rem 0;
  border-bottom: 0.01rem solid #f2f2f2;
  position: relative;
  z-index: 9;
}
/*logo*/
#logo {
  width: 1.57rem;
  position: relative;
  z-index: 10;
}
#logo a {
  display: block;
  overflow: hidden;
  padding-bottom: 35%;
  position: relative;
}
#logo i {
  position: absolute;
  width: 100%;
  height: 100%;
  text-indent: -99999em;
  display: block;
  overflow: hidden;
  background: no-repeat center;
  background-size: contain;
}
@media only screen and (max-width: 750px) {
  #logo {
    width: 1.35rem;
  }
}
/*search*/
#search {
  width: 4.04rem;
}
#search .input {
  position: relative;
  max-width: 2.61rem;
  border: solid 0.01rem #e8e8e8;
  background-color: #fff;
}
#search .text {
  display: block;
  width: 100%;
  height: 2.375em;
  line-height: 1.5em;
  padding: 0.4375em 3.625em 0.4375em 1.25em;
}
#search .go {
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 3.625em;
  cursor: pointer;
  background: url(../images/search_01.svg) no-repeat center center;
  background-size: auto 47.36842105%;
}
@media only screen and (min-width: 751px) {
  #search {
    visibility: visible;
    opacity: 1;
    --y: 0;
  }
}
@media only screen and (max-width: 750px) {
  #search {
    position: absolute;
    top: 100%;
    width: 100%;
    left: 0;
    z-index: 5;
    transition: all 0.3s;
  }
  #search .input {
    max-width: none;
    width: 100%;
    border-left: none;
    border-right: none;
  }
}
/*button*/
#button {
  width: 4.04rem;
}
@media only screen and (max-width: 750px) {
  #button {
    width: auto;
  }
}
/*language*/
#language {
  position: relative;
}
#language span {
  display: block;
  background: url(../images/language_01.svg) no-repeat left center;
  background-size: 1.125em auto;
  padding: 0 calc(21em/16) 0 calc(29em/16);
  position: relative;
  white-space: nowrap;
  cursor: pointer;
}
#language span:after {
  width: calc(11em/16);
  height: calc(6em/16);
  background: url(../images/language_arrow_01.svg) no-repeat center center;
  background-size: contain;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: block;
  content: '';
}
#language ul {
  line-height: 2em;
  position: absolute;
  top: 130%;
  left: 50%;
  min-width: 100%;
  --x: -50%;
  z-index: 5;
  background-color: #fff;
  box-shadow: 0 0.05rem 0.15rem rgba(0, 0, 0, 0.1);
  text-align: center;
  padding: 0.5em 1.5em;
  transition: all 0.3s;
}
#language ul li {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
#language ul li:last-child {
  border-bottom: none;
}
#language ul a {
  white-space: nowrap;
  display: block;
  padding: 0.5em;
}
@media only screen and (max-width: 750px) {
  #language span {
    width: 0.18rem;
    height: 0.18rem;
    text-indent: -9999em;
    overflow: hidden;
    background-size: contain;
    padding: 0;
  }
  #language span:after {
    display: none;
  }
  #language ul {
    top: 160%;
  }
}
/*enter*/
#enter {
  position: relative;
  padding-left: 0.23rem;
  margin-left: 0.3rem;
}
#enter:before {
  width: 0.01rem;
  height: 0.2rem;
  background-color: #cbcbcb;
  opacity: 0.3;
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
#enter span {
  margin-right: 0.1rem;
  margin-left: 0.16rem;
  display: block;
  position: relative;
  cursor: pointer;
}
#enter .num {
  font-style: normal;
  color: #fff;
  font-size: 0.12rem;
  background-color: var(--main-color);
  height: 1.33333333em;
  border-radius: 0.66666667em;
  min-width: 1.33333333em;
  line-height: 1.33333333em;
  position: absolute;
  top: -0.5em;
  left: 1.125em;
  display: flex;
  align-items: center;
  justify-content: center;
}
#enter a {
  display: block;
}
#enter img {
  display: block;
  width: 0.2rem;
  height: 0.18rem;
  object-fit: contain;
}
#enter .navbtn,
#enter .schbtn {
  display: none;
  margin-right: 0;
}
@media only screen and (max-width: 750px) {
  #enter {
    padding-left: 0;
    margin-left: 0.1rem;
  }
  #enter:before {
    display: none;
  }
  #enter span {
    margin-left: 0.13rem;
  }
  #enter .navbtn,
  #enter .schbtn {
    display: block;
  }
}
@media only screen and (max-width: 750px) {
  /*1024*/
  .navbtn {
    position: relative;
    cursor: pointer;
    width: 0.18rem;
    height: 0.18rem;
    transition: all 0.3s;
    display: block;
    z-index: 10;
    overflow: hidden;
  }
  .navbtn:before,
  .navbtn:after,
  .navbtn i {
    width: 100%;
    height: 0.02rem;
    background-color: #000;
    display: block;
    position: absolute;
    left: 0;
    transition: all 0.3s;
    content: '';
  }
  .navbtn:before {
    top: 0.01rem;
  }
  .navbtn:after {
    bottom: 0.01rem;
  }
  .navbtn i {
    top: 50%;
    transform: translateY(-50%);
  }
  .navbtn.active {
    overflow: visible;
  }
  .navbtn.active:before {
    transform: rotate(45deg);
    top: 50%;
  }
  .navbtn.active:after {
    transform: rotate(-45deg);
    bottom: auto;
    top: 50%;
  }
  .navbtn.active i {
    opacity: 0;
  }
}
/*navi*/
#navi {
 position:sticky;
  z-index: 10;
background-color:#fff;
}
#navi a {
  display: block;
  position: relative;
}
#navi .parent {
  line-height: 2em;
  padding: 0.66666667em 0;
}
#navi .drop {
  display: none;
}
#navi .drop-characters {
  padding: 0.6rem 0 0.65rem;
}
#navi .drop-characters ul {
  --margin: 1.5%;
  align-items: flex-end;
}
#navi .drop-characters li {
  padding-bottom: 0.14rem;
  font-size: 0.2rem;
  line-height: 1.5em;
}
#navi .drop-characters .text {
  width: calc(100% - 2.25em);
  position: relative;
  height: 4em;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.5em;
  overflow: hidden;
  padding-left: 2.75em;
  margin-bottom: 0.35em;
  background-color: #f2f2f2;
}
#navi .drop-characters .img {
  display: block;
  width: 5.75em;
  max-height: 6.85em;
  object-fit: contain;
  z-index: 5;
  margin-right: -3.5em;
}
#navi .drop-characters .info {
  position: relative;
  display: flex;
  align-items: flex-end;
}
#navi .drop-characters .info:not(:hover) {
  color: #555;
}
#navi .drop-categorise {
  padding: 0.3rem 0;
}
#navi .drop-categorise ul {
  --margin: 5%;
}
#navi .drop-categorise li {
  padding-top: 2%;
  padding-bottom: 2%;
}
#navi .drop-categorise .figure {
  padding-bottom: 100%;
  margin-bottom: 0.6em;
}
#navi .drop-categorise .name {
  font-style: 0.2rem;
  text-align: center;
  line-height: 1.5em;
}
#navi .drop-categorise a {
  display: block;
  overflow: hidden;
}
#navi .drop-categorise a:not(:hover) {
  color: #555;
}
@media only screen and (min-width: 751px) {
  #navi {
    opacity: 1;
    visibility: visible;
    --y: 0;


top:0;
  }
  #navi .on > a {
    color: var(--main-color);
  }
  #navi .menu {
    gap: 0.54rem;
  }
  #navi .drop {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    z-index: 5;
    background-color: #fff;
    box-shadow: inset 0px 0.08rem 0.06rem 0px rgba(205, 205, 205, 0.14);
  }
  #navi .drop-categorise li {
    width: 16.6666%;
  }
}
@media only screen and (max-width: 1024px) {
  #navi .menu {
    gap: 0.3rem;
  }
  #navi .drop-characters li {
    width: 25%;
  }
  #navi .drop-categorise ul {
    --margin: 3%;
  }
}
@media only screen and (max-width: 750px) {
  /*1024px*/
  #navi {
    position: fixed;
    width: 100%;
    max-width: 30em;
    height: calc(100% - 1.113rem);
    
    z-index: 9;
    right: 0;
    top: 1.113rem;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    transition: all 0.3s;
  }
  #navi:not(.active) {
    --x: 100%;
    --y: 0;
  }
  #navi.nobar {
    top: 0.77322rem;
    height: calc(100% - 0.77322rem);
  }
  #navi .inner {
    width: 100%;
    max-width: none;
  }
  #navi .menu {
    display: block;
  }
  #navi .parent {
    padding: 0 3.125%;
    line-height: 2em;
    position: relative;
  }
  #navi .parent > a {
    padding: 1.5em 0;
    border-bottom: 1px solid #e4e4e4;
  }
  #navi em {
    display: block;
    position: absolute;
    right: 0;
    width: 3.61111111em;
    height: 5.05555556em;
    z-index: 2;
    top: 0;
    cursor: pointer;
  }
  #navi em:after {
    width: 0.66666667em;
    height: 0.66666667em;
    border-right: 0.05555556em solid #000;
    border-bottom: 0.05555556em solid #000;
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: rotate(-45deg);
    background-color: transparent;
    margin: -0.38888889em 0 0 -0.38888889em;
    transition: all 0.3s;
  }
  #navi .on {
    background-color: #f9f9f9;
  }
  #navi .on > em:after {
    transform: rotate(45deg);
  }
  #navi .drop-characters {
    padding: 0.3rem 0;
  }
  #navi .drop-characters li {
    width: 50%;
    font-size: 0.16rem;
  }
  #navi .drop-categorise {
    padding: 0.2rem 0;
  }
  #navi .drop-categorise li {
    width: 25%;
  }
  #navi .drop-categorise .name {
    font-size: 0.16rem;
  }
}
/*footer*/
#footer {
  background-color: #000;
  padding: 1.2rem 0 1.5rem;
  position: relative;
  z-index: 5;
}
#footer a:not(:hover) {
  color: #fff;
}
@media only screen and (max-width: 750px) {
  /*750px*/
  #footer {
    padding: 0.3rem 0;
  }
}
/*widget*/
#widget {
  position: fixed;
  top: 70%;
  right: 1.71875%;
  transform: translateY(-50%);
  font-size: 0.16rem;
  box-shadow: 0px 0px 0.38rem 0.02rem rgba(104, 104, 104, 0.15);
  background-color: #eee;
  z-index: 5;
}
#widget li:not(:last-child) {
  margin-bottom: 0.01rem;
}
#widget a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.75em;
  height: 3.75em;
  background-color: #fff;
}
#widget img {
  display: block;
  object-fit: contain;
  width: 1.625em;
  height: 1.625em;
}
#widget .top {
  background-color: #000;
}
@media only screen and (max-width: 750px) {
  #widget {
    font-size: 0.14rem;
  }
}
/*copyright*/
#copyright {
  padding: 0.5rem 0;
  line-height: 1.9375em;
  color: rgba(255, 255, 255, 0.5);
  gap: 0.09rem;
}
#copyright a:not(:hover) {
  color: rgba(255, 255, 255, 0.5);
}
#copyright .pay ul {
  gap: 0.09rem;
}
@media only screen and (max-width: 1024px) {
  /*1024px*/
  #copyright {
    flex-direction: column;
    text-align: center;
    justify-content: center;
    align-items: center;
  }
}
/*bottom*/
#bottom {
  border-bottom: 0.02rem solid rgba(255, 255, 255, 0.2);
  padding: 0.52rem 0;
}
/*infor*/
#infor {
  width: 23.61111111%;
  line-height: 1.33333333em;
}
#infor .item {
  margin-bottom: 0.53rem;
}
#infor .item:last-child {
  margin-bottom: 0;
}
#infor .icon {
  padding: 0.22222222em 0;
}
#infor .icon img {
  display: block;
  width: 1.61111111em;
  height: 1.22222222em;
  object-fit: contain;
}
#infor .text {
  width: calc(100% - 2.66667em);
}
#infor .text a {
  text-decoration: underline;
}
#infor .name {
  font-weight: 500;
  color: rgba(255, 255, 255, 0.5);
  margin-bottom: 0.44444444em;
}
@media only screen and (max-width: 1024px) {
  /*1024px*/
  #infor {
    width: 4rem;
  }
}
@media only screen and (max-width: 750px) {
  /*750px*/
  #infor {
    width: 100%;
    margin-bottom: 0.5rem;
  }
  #infor .item {
    margin-bottom: 0.3rem;
  }
}
/*menu*/
#menu {
  width: 36.80555556%;
}
#menu dt {
  font-size: 0.24rem;
  font-weight: bold;
  line-height: 1.25em;
  margin-bottom: 1em;
}
#menu dd {
  line-height: 2.25em;
}
#menu dd a {
  display: inline-block;
  position: relative;
  padding-left: 0.875em;
}
#menu dd a:before {
  content: '';
  display: block;
  position: absolute;
  width: 0.25em;
  height: 0.5em;
  background: url(../images/menu_arrow_01.svg) no-repeat center center;
  background-size: contain;
  left: 0;
  top: 0.9375em;
}
#menu dd a:not(:hover) {
  color: rgba(255, 255, 255, 0.5);
}
@media only screen and (max-width: 1024px) {
  #menu {
    width: calc(100% - 5rem);
  }
}
@media only screen and (max-width: 750px) {
  #menu {
    width: 100%;
  }
}
/*newsletter*/
#newsletter {
  width: 24.30555556%;
}
#newsletter .name {
  font-size: 0.24rem;
  line-height: 1.25em;
  margin-bottom: 1em;
}
#newsletter .intro {
  color: rgba(255, 255, 255, 0.5);
  line-height: 1.875em;
  margin-bottom: 0.15rem;
}
#newsletter .input {
  background-color: rgba(255, 255, 255, 0.2);
  position: relative;
}
#newsletter .text {
  display: block;
  width: 100%;
  height: 3.125em;
  line-height: 1.875em;
  padding: 0.625em 1.375em;
  color: rgba(255, 255, 255, 0.5);
}
#newsletter .submit {
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 3.125em;
  background: #ff7110 url(../images/newsletter.svg) no-repeat center center;
  background-size: 40% auto;
}
@media only screen and (max-width: 1024px) {
  #newsletter {
    width: 100%;
    margin-top: 0.35rem;
  }
}
/*social*/
#social {
  border-bottom: 0.02rem solid rgba(255, 255, 255, 0.2);
  padding: 0.35rem 0;
}
#social .logo {
  width: 1.39rem;
}
#social ul {
  gap: 0.2rem;
}
#social a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
  background-color: #efeff0;
}
#social a:hover {
  background-color: var(--main-color);
}
#social a:hover .icon {
  filter: invert(1) brightness(100);
}
#social .icon {
  width: 50%;
  display: block;
  height: 50%;
  object-fit: contain;
}
/*container*/
#container {
  position: relative;
}
#container:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  padding-bottom: 20.83333333%;
  background-image: linear-gradient(180deg, #f7f7f7, transparent);
}
/*wrap-shadow*/
.wrap-shadow {
  background-image: linear-gradient(180deg, #f1f1f1, transparent 0.5rem);
}
/*swiper-controls*/
.swiper-controls {
  position: relative;
}
.swiper-controls .arrow {
  font-size: 0.16rem;
  width: 3.125em;
  height: 3.125em;
  border-radius: 50%;
  border: solid 0.02rem #000000;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
  cursor: pointer;
}
.swiper-controls .arrow:after {
  width: 0.4375em;
  height: 0.875em;
  background: no-repeat center center;
  background-size: contain;
  display: block;
  content: '';
}
.swiper-controls .arrow:hover {
  background-color: #000;
  border-color: transparent;
}
.swiper-controls .arrow:hover:after {
  filter: invert(1) brightness(100);
}
.swiper-controls .arrow.abs {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.swiper-controls .arrow.swiper-button-disabled {
  display: none;
}
.swiper-controls .prev:after {
  background-image: url(../images/swiper_prev_01.svg);
}
.swiper-controls .prev.abs {
  left: -0.93rem;
}
.swiper-controls .next:after {
  background-image: url(../images/swiper_next_01.svg);
}
.swiper-controls .next.abs {
  right: -0.93rem;
}
.swiper-controls .pagination {
  z-index: 2;
  gap: 0.1rem;
}
.swiper-controls .swiper-pagination-bullet {
  width: 0.8rem;
  height: 0.01rem;
  background-color: rgba(0, 0, 0, 0.3);
  transition: inherit;
  display: block;
  position: relative;
}
.swiper-controls .swiper-pagination-bullet:after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 100%;
  background-color: #000;
}
.swiper-controls .swiper-pagination-bullet-active:after {
  width: 100%;
  transition: inherit;
}
.swiper-controls .white .swiper-pagination-bullet {
  background-color: rgba(255, 255, 255, 0.3);
}
.swiper-controls .white .swiper-pagination-bullet:after {
  background-color: #fff;
}
.swiper-controls .swiper-page {
  font-size: 0.18rem;
  font-weight: bold;
  line-height: 1.125em;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  margin-bottom: 1em;
}
.swiper-controls .swiper-page span {
  display: block;
}
.swiper-controls .swiper-page .cur {
  font-size: 1.33333333em;
  line-height: 1em;
  color: var(--main-color);
}
.swiper-controls .swiper-page .line {
  margin: 0 0.03rem;
}
@media only screen and (max-width: 1280px) {
  .swiper-controls .prev.abs {
    left: -0.7rem;
  }
  .swiper-controls .next.abs {
    right: -0.7rem;
  }
}
@media only screen and (max-width: 1024px) {
  .swiper-controls .arrow {
    font-size: 0.14rem;
  }
  .swiper-controls .prev.abs {
    left: 0.1rem;
  }
  .swiper-controls .next.abs {
    right: 0.1rem;
  }
}
@media only screen and (max-width: 750px) {
  .swiper-controls .arrow {
    font-size: 0.12rem;
  }
  .swiper-controls .swiper-pagination-bullet {
    width: 0.45rem;
  }
}
/*radius*/
.r08 {
  border-radius: 0.08rem;
}
.r10 {
  border-radius: 0.1rem;
}
.r15 {
  border-radius: 0.15rem;
}
.r20 {
  border-radius: 0.2rem;
}
.r30 {
  border-radius: 0.3rem;
}
.r40 {
  border-radius: 0.4rem;
}
@media only screen and (max-width: 750px) {
  .r08 {
    border-radius: 0.052rem;
  }
  .r10 {
    border-radius: 0.06rem;
  }
  .r15 {
    border-radius: 0.06rem;
  }
  .r20 {
    border-radius: 0.0975rem;
  }
  .r30 {
    border-radius: 0.2rem;
  }
  .r40 {
    border-radius: 0.26rem;
  }
}
/*mb160*/
.mb160 {
  margin-bottom: 1.6rem;
}
@media only screen and (max-width: 1280px) {
  .mb160 {
    margin-bottom: 8.33333333%;
  }
}
/*slides*/
#slides {
  overflow: hidden;
  padding: 0.6rem 0;
  position: relative;
}
#slides .swiper {
  width: 74.0625%;
  max-width: 14.22rem;
  overflow: visible;
}
#slides .figure {
  padding-bottom: 56.25879044%;
}
#slides .prev {
  left: -11.25175809%;
}
#slides .next {
  right: -11.25175809%;
}
#slides a {
  display: block;
  overflow: hidden;
}
@media only screen and (max-width: 750px) {
  #slides {
    padding: 0.35rem 0;
  }
#slides .swiper {width:93.75%;}
  #slides .prev {
    left: -16.25%;
  }
  #slides .next {
    right: -16.25%;
  }
#slides .figure  {padding-bottom:137%;}
}
/*module-box*/
.module-box {
  overflow: hidden;
  position: relative;
  z-index: 2;
}
/*module-name*/
.module-name {
  text-align: center;
  margin: 0;
  font-size: 0.64rem;
  line-height: 1.25em;
  margin-bottom: 1em;
}
@media only screen and (max-width: 1280px) {
  .module-name {
    font-size: 0.56rem;
  }
}
@media only screen and (max-width: 750px) {
  .module-name {
    font-size: 0.4rem;
  }
}
/*circle-more*/
.circle-more {
  font-size: 0.16rem;
  width: 3.125em;
  height: 3.125em;
  border-radius: 50%;
  border: solid 0.02rem #000000;
  align-items: center;
  justify-content: center;
  display: flex;
}
.circle-more:after {
  display: block;
  content: '';
  width: 0.4375em;
  height: 0.875em;
  background: url(../images/swiper_next_01.svg) no-repeat center center;
  background-size: contain;
}
.circle-more:hover {
  background-color: #000;
  border-color: transparent;
}
.circle-more:hover:after {
  filter: invert(1) brightness(100);
}
@media only screen and (max-width: 1024px) {
  .circle-more {
    font-size: 0.14rem;
  }
}
@media only screen and (max-width: 750px) {
  .circle-more {
    font-size: 0.12rem;
  }
}
/*button-more*/
.button-more a {
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  border: solid 0.02rem #000000;
  height: 3.125em;
  width: 16.25em;
  border-radius: 1.5625em;
}
.button-more a:before {
  background: no-repeat center center;
  background-size: contain;
  content: '';
}
.button-more a:hover:before {
  filter: invert(1) brightness(100);
}
.button-more a:hover,
.button-more .black {
  background-color: #000;
  color: #fff;
  border-color: transparent;
}
.button-more .back:before {
  width: 1.1875em;
  height: 1.0625em;
  background-image: url(../images/back_01.svg);
  display: block;
  margin-right: 0.6875em;
}
.button-more .write:before {
  width: 1.125em;
  height: 1.125em;
  background-image: url(../images/write_01.svg);
  display: block;
  margin-right: 0.625em;
}
.button-more .write:hover:before {
  filter: none;
}
.button-more .clear:before {
  width: 0.75em;
  height: 0.75em;
  background-image: url(../images/clear_01.svg);
  display: block;
  margin-top: 0.125em;
  margin-right: 0.6875em;
}
.button-more .ship:before {
  width: 1em;
  height: 0.75em;
  background-image: url(../images/ship_01.png);
  display: block;
  margin-top: 0.125em;
  margin-right: 0.6875em;
}
@media only screen and (max-width: 750px) {
  .button-more a {
    font-size: 0.14rem;
  }
}
/*button-submit*/
.button-submit {
  font-weight: bold;
  width: 16.25em;
  max-width: 100%;
  height: 3.125em;
  border-radius: 1.5625em;
  background-color: #000;
  color: #fff;
  cursor: pointer;
}
.button-submit.border:not(:hover) {
  border: solid 0.02rem #000000;
  background-color: #fff;
  color: #000;
}
/*button-play*/
.button-play {
  width: 0.99rem;
  background: url(../images/play_02.svg) no-repeat center center;
  background-size: contain;
  cursor: pointer;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: all 0.3s;
  z-index: 5;
}
.button-play:after {
  display: block;
  content: '';
  padding-bottom: 100%;
}
.button-play:hover {
  transform: translate(-50%, -50%) scale(0.95);
}
@media only screen and (max-width: 1280px) {
  .button-play {
    width: 0.8rem;
  }
}
@media only screen and (max-width: 1024px) {
  .button-play {
    width: 0.6rem;
  }
}
@media only screen and (max-width: 750px) {
  .button-play {
    width: 0.5rem;
  }
}
/*button-add*/
.button-add {
  display: flex;
  align-items: center;
  font-size: 0.24rem;
  gap: 0.83334em;
}
.button-add span {
  cursor: pointer;
  display: block;
  height: 0.83333333em;
  width: 0.83333333em;
  background: no-repeat center center;
  background-size: contain;
}
.button-add .heart {
  background-image: url(../images/heart_01@2x.png);
}
.button-add .heart.active {
  background-image: url(../images/heart_02@2x.png);
}
.button-add .cart {
  width: 0.75em;
  background-image: url(../images/cart_01@2x.png);
}
.button-add .bell {
  width: 0.625em;
  background-image: url(../images/bell_01@2x.png);
}
.button-add .bell.active{
background-image: url(../images/bell_active.svg);
}
@media only screen and (max-width: 750px) {
  .button-add {
    font-size: 0.2rem;
  }
}
/*button-buy*/
.button-buy a {
  display: flex;
  background-color: #000;
  color: #fff;
  width: 16.25em;
  height: 3.125em;
  font-weight: bold;
  border-radius: 1.5625em;
  align-items: center;
  justify-content: center;
}
@media only screen and (max-width: 750px) {
  .button-buy a {
    font-size: 0.14rem;
  }
}
/*button-redeen*/
.button-default a {
  width: 10em;
  height: 2.5em;
  border: solid 0.02rem #000000;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 1.25em;
}
.button-default a:hover {
  background-color: #000;
  color: #fff;
  border-color: transparent;
}
/*unboxing*/
#unboxing .list {
  --margin: 3.3334%;
}
#unboxing .figure {
  padding-bottom: 73.33333333%;
}
#unboxing .text {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: 5;
  padding: 0.45rem 0.5rem 0.45rem 0.44rem;
}
#unboxing .title {
  font-size: 0.3rem;
  line-height: 1.35em;
  max-width: calc(100% - 0.6rem);
}
#unboxing .info {
  display: block;
  overflow: hidden;
  position: relative;
  color: #fff;
}
@media only screen and (max-width: 750px) {
  #unboxing .item {
    width: 50%;
  }
  #unboxing .text {
    padding: 0.15rem;
  }
  #unboxing .title {
    font-size: 0.2rem;
    max-width: calc(100% - 0.45rem);
  }
}
/*entrance*/
#entrance {
  margin-bottom: 1.2rem;
}
@media only screen and (max-width: 1280px) {
  #entrance {
    margin-bottom: 6.25%;
  }
}
/*igshow*/
#igshow {
  padding: 0.8rem 0;
}
#igshow .swiper {
  overflow: visible;
  margin-bottom: 0.8rem;
}
#igshow .swiper-slide {
  width: 3.45rem;
}
#igshow .figure {
  padding-bottom: 134.49275362%;
}
#igshow .info {
  display: block;
  overflow: hidden;
}
@media only screen and (max-width: 750px) {
  #igshow {
    padding: 0.4rem 0;
  }
  #igshow .swiper {
    margin-bottom: 0.4rem;
  }
}
/*blog*/
#blog {
  padding-bottom: 0.01rem;
}
#blog .list {
  margin-bottom: 0.6rem;
}
#blog .figure {
  padding-bottom: 100%;
}
#blog .text {
  padding: 0.2rem 0.3rem;
}
#blog .title {
  font-size: 0.2rem;
  line-height: 1.5em;
  height: 4.5em;
}
#blog .date {
  line-height: 1.5em;
  border-top: 0.01rem solid #dedede;
  padding-top: 0.2rem;
  margin-top: 0.3rem;
}
#blog .date time {
  display: block;
  background: url(../images/swiper_next_01.svg) no-repeat right center;
  background-size: 0.4375em auto;
}
#blog .info {
  display: block;
  overflow: hidden;
  background-color: #ffffff;
  box-shadow: 0px 0px 0.19rem 0.01rem rgba(104, 104, 104, 0.1);
}
@media only screen and (max-width: 1024px) {
  #blog .item {
    width: 25%;
  }
}
@media only screen and (max-width: 750px) {
  #blog .list {
    margin-bottom: 0.3rem;
  }
  #blog .item {
    width: 50%;
  }
  #blog .text {
    padding: 0.18rem 0.2rem;
  }
  #blog .title {
    font-size: 0.18rem;
  }
  #blog .date {
    padding-top: 0.19rem;
    margin-top: 0.2rem;
  }
}
/*review*/
#review {
  padding-bottom: 0.6rem;
}
#review .swiper {
  width: 59.22222222%;
  overflow: visible;
}
#review .swiper-slide {
  height: auto;
}
#review .top {
  font-size: 0.18rem;
  line-height: 1.35em;
}
#review .avatar {
  width: 4.44444444em;
  height: 4.44444444em;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  margin-right: 1.33333333em;
}
#review .name {
  font-size: 1.66666667em;
  line-height: 1.35em;
  margin-bottom: 0.13333333em;
}
#review .date {
  color: #888888;
}
#review .tag {
  font-size: 0.88888889em;
  line-height: 1.5em;
  font-weight: bold;
  background-color: #f3f3f3;
  padding: 0.4375em 0.875em;
  border-radius: 1.1875em;
  margin-bottom: 0.8125em;
}
#review .rating {
  display: flex;
  justify-content: flex-end;
  gap: 0.4445em;
}
#review .rating i {
  display: block;
  width: 1.33333333em;
  height: 1.27777778em;
  background: url(../images/rating.svg) no-repeat center center;
  background-size: contain;
}
#review .intro {
  font-size: 1.11111111em;
  line-height: 1.75em;
  margin-top: 1.5625%;
  width: 100%;
}
#review .media {
  gap: 1.875%;
  margin-top: 2.60416667%;
}
#review .figure {
  width: 32.29166667%;
  background-color: var(--main-color);
}
#review .figure:after {
  padding-bottom: 100%;
  display: block;
}
#review .video {
  cursor: pointer;
}
#review .video:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.2);
  z-index: 2;
}
#review .play {
  width: 12.58064516%;
  background: url(../images/play_01.svg) no-repeat center center;
  background-size: contain;
  cursor: pointer;
  position: absolute;
  left: 6.12903226%;
  bottom: 6.12903226%;
  z-index: 3;
}
#review .play:after {
  padding-bottom: 100%;
  display: block;
  content: '';
}
#review .info {
  background: #ffffff url(../images/review_info_bg.png) no-repeat center center;
  background-size: cover;
  box-shadow: 0px 0px 0.38rem 0.02rem rgba(104, 104, 104, 0.15);
  padding: 4.69043152%;
  position: relative;
  height: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media only screen and (max-width: 1024px) {
  #review .top {
    font-size: 0.16rem;
  }
}
@media only screen and (max-width: 750px) {
  #review {
    padding-bottom: 0.4rem;
  }
  #review .swiper {
    width: 85%;
  }
  #review .top {
    font-size: 0.14rem;
  }
  #review .meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-top: 0.15rem;
  }
  #review .tag {
    margin-bottom: 0;
  }
}
/*sellers*/
.sellers .list {
  margin-bottom: 0.8rem;
}
.sellers .swiper-slide {
  width: 3.45rem;
}
.sellers .figure a {
  padding-bottom: 100%;
}
.sellers .title {
  font-size: 0.2rem;
  line-height: 1.2em;
  height: 2.4em;
  margin-top: 6.66666667%;
}
.sellers .title a {
  display: block;
}
.sellers .meta {
  font-size: 0.24rem;
  font-weight: bold;
  line-height: 1.125em;
  padding-right: 4.34782609%;
  margin-top: 4.63768116%;
}
.sellers .btn {
  font-size: 1em;
}
.sellers .arrow {
  margin-top: -0.55rem;
}
@media only screen and (max-width: 750px) {
  .sellers .list {
    margin-bottom: 0.4rem;
  }
  .sellers .swiper-slide {
    width: 2.28475rem;
  }
  .sellers .title {
    font-size: 0.18rem;
  }
  .sellers .meta {
    font-size: 0.2rem;
  }
  .sellers .arrow {
    margin-top: -0.45rem;
  }
}
/*categories*/
#categories ul {
  --margin: 5.3334%;
}
#categories .item {
  padding-bottom: 3%;
}
#categories .figure {
  padding-bottom: 100%;
  border-radius: 50%;
  margin-bottom: 7.27272727%;
}
#categories a {
  display: block;
  overflow: hidden;
}
#categories a:not(:hover) {
  color: rgba(0, 0, 0, 0.8);
}
@media only screen and (max-width: 1024px) {
  #categories ul {
    --margin: 4%;
    font-size: 0.18rem;
  }
  #categories li {
    width: 16.666%;
  }
}
@media only screen and (max-width: 750px) {
  #categories ul {
    --margin: 7%;
    font-size: 0.16rem;
  }
  #categories .item {
    width: 33.333%;
    padding-bottom: 5%;
  }
}
/*videos*/
#videos {
  margin-bottom: 1.22rem;
}
#videos .prev {
  left: 7.65625%;
}
#videos .next {
  right: 7.65625%;
}
#videos .pagination {
  position: absolute;
  bottom: 6.125%;
  left: 50%;
  transform: translateX(-50%);
}
@media only screen and (max-width: 750px) {
  #videos {
    margin-bottom: 0.5rem;
  }
}
/*video-cover*/
.video-cover .figure {
  padding-bottom: 8rem;
}
.video-cover video {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 2;
}
@media only screen and (max-width: 1280px) {
  .video-cover .figure {
    padding-bottom: 41.66666667%;
  }
}
@media only screen and (max-width: 1024px) {
  .video-cover .figure {
    padding-bottom: 62.5%;
  }
}
/*video-product*/
.video-product {
  position: absolute;
  z-index: 6;
  right: 3.125%;
  bottom: 10.75%;
  width: 4.5rem;
  max-width: 100%;
}
.video-product .item {
  display: none;
}
.video-product .item:first-child {
  display: block;
}
.video-product .swiper-slide {
  display: flex;
  justify-content: space-between;
}
.video-product .figure {
  width: 1.5rem;
}
.video-product .figure a {
  padding-bottom: 100%;
}
.video-product .text {
  width: calc(100% - 1.5rem);
  background-color: #f6f6f6;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 0.13rem 0.2rem 0.2rem;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.video-product .title {
  font-size: 0.18rem;
  line-height: 1.33333333em;
  height: 2.66666667em;
}
.video-product .title a {
  display: block;
}
.video-product .meta {
  width: 100%;
  font-size: 0.24rem;
  font-weight: bold;
  line-height: 1.125em;
}
@media only screen and (max-width: 750px) {
  .video-product {
    position: relative;
    width: 100%;
    margin-top: 0.25rem;
    padding: 0 3.125%;
    bottom: auto;
    right: auto;
  }
  .video-product .meta {
    font-size: 0.2rem;
  }
}
/*specail*/
#specail {
  padding-bottom: 3.125%;
}
#specail .list {
  width: 53%;
  margin: 0 auto 0.8rem;
}
#specail .swiper {
  overflow: visible;
}
#specail .swiper-slide {
  display: flex;
  justify-content: space-between;
}
#specail .info {
  width: 48.84696017%;
}
#specail .figure {
  margin-bottom: 4.72103004%;
}
#specail .figure a {
  padding-bottom: 100%;
}
#specail .title {
  font-size: 0.2rem;
  line-height: 1.2em;
  height: 2.4em;
  margin-bottom: 3.86266094%;
}
#specail .meta {
  font-size: 0.24rem;
  font-weight: bold;
  line-height: 1.125em;
  padding-right: 4.34782609%;
}
#specail .btn {
  font-size: 1em;
}
#specail .arrow {
  margin-top: -0.45rem;
}
#specail .prev {
  left: -11.53039832%;
}
#specail .next {
  right: -11.53039832%;
}
@media only screen and (max-width: 1024px) {
  #specail .list {
    width: 66%;
  }
}
@media only screen and (max-width: 750px) {
  #specail .list {
    margin-bottom: 0.4rem;
    width: 82%;
  }
  #specail .title {
    font-size: 0.18rem;
  }
  #specail .meta {
    font-size: 0.2rem;
  }
}
/*tabspan*/
.ipcard-tab {
  display: flex;
  justify-content: center;
  padding: 0 3.125%;
  line-height: 2.66666667em;
  margin-bottom: 0.06rem;
}
.ipcard-tab .swiper-slide {
  width: auto;
  cursor: pointer;
}
.ipcard-tab span {
  transition: all 0.3s;
  display: block;
  position: relative;
  padding: 0 0.18rem;
}
.ipcard-tab span:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  background-color: var(--main-color);
  height: 0.04rem;
  width: 100%;
  opacity: 0;
  transition: inherit;
}
.ipcard-tab .current span {
  font-size: 1.33333333em;
  color: #000;
}
.ipcard-tab .current span:before {
  opacity: 1;
}
/*ipcard-cont*/
.ipcard-cont .box {
  display: none;
position:relative;
min-height:6.884rem;
}
.ipcard-cont .box:first-child {
  display: block;
}

.ipcard-cont .cover:after {
  display: block;
  padding-bottom:41.667%;
}
.ipcard-cont .info {
  background-color:rgba(255,255,255,0.5);
  width: 30.46875%;
  padding: 2.60416667% 3.125% 3.125%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
position:absolute;
left:0;
top:0;
z-index:5;
min-height:100%;
}
.ipcard-cont .top {
  margin-bottom: 0.3rem;
}
.ipcard-cont .hgroup {
  margin-bottom: 0.18rem;
}
.ipcard-cont .intro {
  font-weight: bold;
  line-height: 1.875em;
}
.ipcard-cont .name {
  font-size: 0.48rem;
  line-height: 1em;
  margin-right: 8.36909871%;
}
.ipcard-cont .date {
  color: rgba(0, 0, 0, 0.8);
}
.ipcard-cont .bar {
  margin-bottom: 0.2rem;
}
.ipcard-cont .more a {
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 0.14rem;
  border: solid 0.02rem #000000;
  height: 2.14285714em;
  width: 5.71428571em;
  border-radius: 1.07142857em;
}
.ipcard-cont .more a:hover {
  background-color: #000;
  color: #fff;
  border-color: transparent;
}
.ipcard-cont .list .item {
  margin-bottom: 0.2rem;
}
.ipcard-cont .list .item:last-child {
  margin-bottom: 0;
}
.ipcard-cont .list .pic {
  width: 1.2rem;
}
.ipcard-cont .list .pic:after {
  display: block;
  padding-bottom: 100%;
}
.ipcard-cont .list .text {
  padding: 0.12rem 0.3rem 0.19rem 0.25rem;
  width: calc(100% - 1.2rem);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.ipcard-cont .list .title {
  font-size: 0.18rem;
  line-height: 1.33333333em;
  height: 2.66666667em;
}
.ipcard-cont .list .meta {
  font-size: 0.2rem;
  line-height: 1.2em;
  font-weight: bold;
}
.ipcard-cont .list a {
  display: flex;
  justify-content: space-between;
  background-color: #fff;
}
.ipcard-cont .list a:hover .img {
  transform: scale(1.05);
}
@media only screen and (max-width: 1024px) {
  .ipcard-cont .info {
    width: 100%;
position:relative;
min-height:4.3rem;
  }
  .ipcard-cont .cover {
    width: 100%;
height:100%;
position:absolute;
left:0;
top:0;
  }
  .ipcard-cont .cover:after {display:none;}
}
@media only screen and (max-width: 750px) {
  .ipcard-cont .info {
    padding-top: 5%;
    padding-bottom: 5%;
  }
}
/*characters*/
#characters {
  padding: 0.5rem 0;
}
#characters .list {
  display: flex;
}
#characters .list:nth-child(2n) {
  justify-content: flex-end;
}
#characters ul {
  width: max-content;
  display: flex;
}
#characters li {
  padding: 0.15em 1.175em;
}
#characters .text {
  width: 11em;
  position: relative;
  height: 5em;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 2.5em;
  overflow: hidden;
  padding-left: 3em;
  margin-bottom: 0.85em;
}
#characters .text:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  background-color: var(--bgcolor);
  width: 100%;
  height: 100%;
  opacity: 0.2;
}
#characters .img {
  display: block;
  height: 8.65em;
  width: auto;
  max-width: none;
  margin-right: -4.5em;
}
#characters .info {
  position: relative;
  display: flex;
  align-items: flex-end;
}
@media only screen and (max-width: 750px) {
  #characters {
    padding: 0.3rem 0;
  }
  #characters .box {
    font-size: 0.14rem;
  }
  #characters .text span {
    font-size: 1.14285714em;
  }
}
/*subpopup*/

.subpopup .box {
  width: 9.72rem;
  max-width: 90%;
  overflow: hidden;
}
.subpopup .figure {
  width: 42.9%;
}
.subpopup .info {
  width: 57.1%;
  padding: 0.57rem 6.33484163%;
  background-color: #fff;
  min-height: 5.7rem;
}
.subpopup .item {
  display: none;
}
.subpopup .item:first-child {
  display: block;
}
.subpopup .title {
  font-size: 0.36rem;
  line-height: 1.25em;
  margin-bottom: 0.1rem;
}
.subpopup .intro {
  font-size: 0.18rem;
  line-height: 1.66666667em;
}
.subpopup .tips {
  font-size: 0.16rem;
  line-height: 1.5em;
  font-weight: normal;
  background: url(../images/tips_01.svg) no-repeat left 0.1875em;
  background-size: 1.25em auto;
  padding: 0 2.125em;
  margin-top: 15.625%;
}
.subpopup .form {
  margin-top: 8.89423077%;
}
.subpopup .input {
  position: relative;
  margin-bottom: 4.80769231%;
}
.subpopup .text {
  height: 3.75em;
  line-height: 1.875em;
  padding: 0.9375em 4.375em 0.9375em 1.25em;
  background-color: #efefef;
  display: block;
  width: 100%;
  color: rgba(0, 0, 0, 0.5);
}
.subpopup .copy {
  width: 1.375em;
  height: 1.375em;
  display: block;
  cursor: pointer;
  background: url(../images/copy_01.png) no-repeat center center;
  background-size: contain;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 1.5em;
}
.subpopup .button-submit {
  width: 100%;
}
.subpopup .cancel {
  color: #000;
  border: 0.02rem solid #000;
  background-color: #fff;
  margin-top: 0.1rem;
}
@media only screen and (max-width: 750px) {
  .subpopup .figure {
    display: none;
  }
  .subpopup .info {
    width: 100%;
    padding: 0.3rem 0.35rem;
    min-height: 0;
  }
  .subpopup .title {
    font-size: 0.32rem;
  }
}
/*figurine*/
#figurine {
  background: url(../images/figurine_bg.png) no-repeat center bottom;
  background-size: 100% auto;
  padding-bottom: 0.6rem;
}
#figurine .module-name {
  margin-bottom: 0.703125em;
}
#figurine .list:before,
#figurine .list:after {
  background-color: #fff;
  height: 3.17rem;
  width: 25.26041667%;
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#figurine .list:before {
  left: 0;
  border-radius: 0 1.7rem 1.7rem 0;
}
#figurine .list:after {
  right: 0;
  border-radius: 1.7rem 0 0 1.7rem;
}
#figurine .info {
  transition: all 0.8s;
  transform: translateY(1.8rem);
}
#figurine .letter {
  position: absolute;
  padding: 0 0.19881306em;
  top: 50%;
  transform: translateY(-50%);
  color: #573228;
  line-height: 1em;
  width: 100%;
  font-size: 3.37rem;
  font-weight: bold;
  opacity: 0;
  transition: all 0.8s;
}
#figurine .figure {
  width: 71.57894737%;
  margin: 0 auto;
}
#figurine .figure a {
  padding-bottom: 100%;
}
#figurine .img {
  object-fit: contain;
}
#figurine .btm {
  margin-top: 0.1rem;
  visibility: hidden;
  opacity: 0;
  transition: all 0.8s;
}
#figurine .title {
  font-size: 1.25em;
  line-height: 1.35em;
  margin-bottom: 0.4em;
}
#figurine .meta {
  margin-bottom: 1.41666667em;
}
#figurine .swiper {
  width: 9.5rem;
  overflow: visible;
}
#figurine .swiper-slide-active .info {
  transform: translateY(0);
}
#figurine .swiper-slide-active .letter {
  opacity: 0.36;
}
#figurine .swiper-slide-active .btm {
  visibility: visible;
  opacity: 1;
}
#figurine .pagination {
  margin-top: 0.6rem;
}
@media only screen and (max-width: 1280px) {
  #figurine {
    padding-bottom: 3.125%;
  }
  #figurine .letter {
    font-size: 17.55208333vw;
  }
  #figurine .swiper {
    width: 49.47916667%;
  }
}
@media only screen and (max-width: 1024px) {
  #figurine .list:before,
  #figurine .list:after {
    height: 2.2rem;
    transform: translateY(-60%);
  }
  #figurine .info {
    transform: translateY(1rem);
  }
}
@media only screen and (max-width: 750px) {
  #figurine .info {
    transform: translateY(0);
  }
  #figurine .letter {
    font-size: 1.25rem;
  }
  #figurine .text {
    font-size: 0.18rem;
  }
  #figurine .swiper {
    width: 78%;
  }
  #figurine .pagination {
    margin-top: 0.4rem;
  }
}
/*arrivals*/
#arrivals {
  padding-bottom: 0.6rem;
}
#arrivals .inner {
  position: relative;
  z-index: 5;
}
#arrivals .inner:before {
  content: "";
  position: absolute;
  right: 100%;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  z-index: 5;
}
#arrivals .button-more {
  margin-top: 0.66rem;
}
@media only screen and (max-width: 1280px) {
  #arrivals {
    padding-bottom: 3.125%;
  }
}
@media only screen and (max-width: 750px) {
  #arrivals .button-more {
    margin-top: 0.3rem;
  }
}
/*arr-list*/
.arr-list .swiper {
  overflow: visible;
}
.arr-list .swiper-wrapper {
  transition: 0.3s linear;
}
.arr-list .swiper-slide {
  transition: 0.6s;
  flex: 0 0 auto;
  height: auto;
  width: auto;
}
.arr-list .swiper-slide:not(:last-child) {
  margin-right: 0.2rem;
}
.arr-list .info {
  position: relative;
}
.arr-list .tag {
  background-color: var(--main-color);
  position: absolute;
  top: 0.25rem;
  right: 0.26rem;
  z-index: 5;
  font-weight: bold;
  font-size: 0.14rem;
  height: 2.85714286em;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 1.42857143em;
  min-width: 5.71428571em;
  padding: 0 1.14285714em;
}
.arr-list .figure {
  margin-bottom: 0.2rem;
}
.arr-list .figure a {
  padding-bottom: 100%;
}
.arr-list .title {
  font-size: 0.2rem;
  line-height: 1.2em;
  height: 2.4em;
  margin-bottom: 0.14rem;
}
.arr-list .meta {
  padding-right: 0.2rem;
}
@media only screen and (max-width: 750px) {
  .arr-list .title {
    font-size: 0.18rem;
  }
  .arr-list .meta {
    font-size: 0.2rem;
    padding-right: 0;
  }
}
/*arr-date*/
.arr-date {
  margin-top: 0.38rem;
}
.arr-date .line {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.arr-date .line:before,
.arr-date .line:after {
  display: block;
  content: '';
}
.arr-date .line:before {
  width: 0.12rem;
  height: 0.12rem;
  border: solid 0.02rem #888888;
  border-radius: 50%;
}
.arr-date .line:after {
  background-color: #888888;
  height: 0.02rem;
  width: calc(100% - 0.22rem);
}
.arr-date .text {
  padding: 0.12rem 0.22rem 0;
}
.arr-date .title {
  font-size: 0.2rem;
  line-height: 1.75em;
}
.arr-date .intro {
  font-weight: bold;
  font-size: 0.2rem;
  line-height: 1.35em;
  opacity: 0;
  transition: all 0.3s;
}
.arr-date .swiper {
  width: 12.8rem;
  margin: 0;
  max-width: calc(100% - 1.3rem);
}
.arr-date .btn {
  transform: translateY(-50%);
  margin-top: 0.06rem;
}
.arr-date .prev {
  margin-right: 1.25em;
}
.arr-date .swiper-slide-active .line:before {
  border-color: var(--main-color);
}
.arr-date .swiper-slide-active .line:after {
  background-color: var(--main-color);
}
.arr-date .swiper-slide-active .title {
  font-size: 0.3rem;
  color: var(--main-color);
  line-height: 1.16666667em;
}
.arr-date .swiper-slide-active .intro {
  opacity: 1;
}
@media only screen and (max-width: 750px) {
  .arr-date .swiper {
    max-width: calc(100% - 1rem);
  }
  .arr-date .title {
    font-size: 0.18rem;
  }
  .arr-date .intro {
    font-size: 0.16rem;
  }
  .arr-date .swiper-slide-active .title {
    font-size: 0.22rem;
  }
}
/*breadcrumb*/
#breadcrumb {
  padding: 0.12rem 0;
  width: 100%;
  z-index: 2;
}
#breadcrumb.abs {
  position: absolute;
  left: 0;
  top: 0;
}
#breadcrumb a {
  display: inline-block;
  vertical-align: middle;
}
#breadcrumb a:not(:hover) {
  color: #999;
}
#breadcrumb a:first-child {
  padding-left: 1.3125em;
  background: url(../images/breadcrumb_home.png) no-repeat left center;
  background-size: 0.875em auto;
}
#breadcrumb i {
  display: inline-block;
  vertical-align: middle;
  width: 0.25em;
  height: 0.5em;
  background: url(../images/breadcrumb_arrow.svg) no-repeat center center;
  background-size: contain;
  margin: 0 0.875em;
}
#breadcrumb span {
  display: inline-block;
  vertical-align: middle;
  color: var(--main-color);
}
/*wrapper*/
#wrapper {
  padding: 0.55rem 0 1rem;
}
#wrapper .inner {
  position: relative;
}
@media only screen and (max-width: 750px) {
  #wrapper {
    padding: 0.25rem 0 0.55rem;
  }
}
/*datetime*/
.datetime {
  width: 2.8rem;
}
.datetime .date {
  font-size: 0.52rem;
  line-height: 1em;
  font-weight: bold;
  margin: 0;
}
.datetime .time {
  font-size: 0.2rem;
  line-height: 1.2em;
  color: #888;
  margin-top: 1em;
}
@media only screen and (max-width: 750px) {
  .datetime {
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 0.35rem;
  }
  .datetime .date {
    font-size: 0.42rem;
  }
  .datetime .time {
    font-size: 0.18rem;
  }
}
/*pro-item*/
.pro-item {
  margin-bottom: 0.4rem;
}
.pro-item .delete {
  position: absolute;
  width: 0.3rem;
  height: 0.3rem;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  right: 0.1rem;
  top: 0.1rem;
  z-index: 5;
  cursor: pointer;
}
.pro-item .delete:after {
  width: 60%;
  padding-bottom: 56.66666667%;
  background: url(../images/delete_03.png) no-repeat center center;
  background-size: contain;
  display: block;
  content: '';
}
.pro-item .delete:hover {
  background-color: var(--main-color);
}
.pro-item .delete:hover:after {
  filter: invert(1) brightness(100);
}
.pro-item .figure {
  margin-bottom: 6.66666667%;
}
.pro-item .figure a {
  padding-bottom: 100%;
}
.pro-item .title {
  font-size: 0.18rem;
  line-height: 1.33333333em;
  height: 2.66666667em;
  margin-bottom: 6.37681159%;
}
.pro-item .title a {
  display: block;
}
.pro-item .meta {
  font-size: 0.24rem;
  font-weight: bold;
  line-height: 1.125em;
  padding-right: 4.34782609%;
}
.pro-item .price span {
  color: var(--main-color);
}
.pro-item .info {
  display: block;
  position: relative;
}
@media only screen and (max-width: 750px) {
  .pro-item {
    margin-bottom: 0.15rem;
  }
  .pro-item .meta {
    font-size: 0.2rem;
  }
}
/*mall-list*/
@media only screen and (min-width: 751px) {
  #mall-list .item {
    margin-bottom: 0.6rem;
  }
}
@media only screen and (max-width: 1024px) {
  #mall-list .item {
    width: 33.333%;
  }
}
@media only screen and (max-width: 750px) {
  #mall-list .item {
    width: 50%;
  }
}
/*schedule-page*/
#schedule-page {
  margin-top: 0.5rem;
}
@media only screen and (max-width: 750px) {
  #schedule-page {
    margin-top: 0.25rem;
  }
}
/*schedule*/
.schedule {
  border-top: 0.02rem solid #000;
  padding: 0.3rem 0;
}
.schedule .box {
  width: calc(100% - 3.3rem);
  overflow: hidden;
}
@media only screen and (max-width: 750px) {
  .schedule .box {
    width: 100%;
  }
  .schedule .item {
    width: 50%;
  }
}
/*mall-filter-checkbox*/
.mall-filter-checkbox {
  width: 0.18rem;
  height: 0.18rem;
  border-radius: 50%;
  position: relative;
  border: 0.01rem solid rgba(0, 8, 15, 0.3);
  transition: all 0.3s;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mall-filter-checkbox:after {
  width: 0.1rem;
  height:0.1rem;
  background-color: var(--main-color);
  border-radius: 50%;
  display: block;
  content: '';
  opacity: 0;
  transition: inherit;
}
.mall-filter-checkbox.checked {
  border-color: var(--main-color);
}
.mall-filter-checkbox.checked:after {
  opacity: 1;
}
/*mall-side*/
#mall-side {
  width: 2.24rem;
}
#mall-side .close {position:absolute; cursor:pointer; right:0.15rem; top:0.15rem; width:0.16rem; height:0.16rem;background: #fff url(../images/close_02.svg) no-repeat center center;background-size:contain; display:none;}
@media only screen and (max-width: 750px) {
  #mall-side {
    width: 100%;
    /*margin-bottom: 0.5rem;*/

position: fixed;
    background-color: #fff;
    height: calc(100% - 1.11rem);
    left: 0;
    top: 1.11rem;
    z-index: 99;
    padding: 0.3rem 3.125%;
    overflow-y: auto;
transform:translateX(-100%);
    
transition:all 0.3s;
  }
#mall-side.active {transform:translateX(0);}
#mall-side .close {display:block;}
}
/*mall-filter*/

.mall-filter .widget {
  margin-bottom: 0.5rem;
}
.mall-filter .widget:last-child {
  margin-bottom: 0;
}
.mall-filter .title {
  font-size: 0.24rem;
  line-height: 1.25em;
  border-top: 0.02rem solid #000;
  padding: 0.5em 0;
  margin-bottom: 0.41666667em;
}
.mall-filter li {
  cursor: pointer;
}
.mall-filter .figure:before {
  display: block;
  content: '';
  padding-bottom: 100%;
}
.mall-filter .list {
  display: flex;
  justify-content: space-between;
  line-height: 1.125em;
  margin-bottom: 0.23rem;
}
.mall-filter .list:last-child {
  margin-bottom: 0;
}
.mall-filter .list .name {
  width: calc(100% - 2em);
}
.mall-filter [data-cols] {
  --margin: 0.1rem;
}
.mall-filter .item .figure:after {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  border-radius: inherit;
  border: 0.01rem solid var(--main-color);
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: all 0.3s;
}
.mall-filter .item .name {
  font-size: 0.14rem;
  line-height: 1.14285714em;
  margin-top: 0.42857143em;
  letter-spacing: -0.02142857em;
  text-align: center;
}
.mall-filter .item.selected .figure:after {
  opacity: 1;
}
.mall-filter .box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.1rem;
  cursor: default;
}
.mall-filter .box:last-child {
  margin-bottom: 0;
}
.mall-filter .box .figure {
  width: 0.68rem;
}
.mall-filter .box .text {
  width: calc(100% - 2em);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.mall-filter .box .name {
  width: calc(100% - 5.75em);
}
@media only screen and (max-width: 1024px) {
  .mall-filter .item {
    width: 33.333%;
  }
}
@media only screen and (max-width: 750px) {

  .mall-filter .widget {
    margin-bottom: 0.1rem;
  }
  .mall-filter ul {
    display: flex;
    flex-wrap: wrap;
  }
  .mall-filter .item {
    width: 16.66%;
  }
  .mall-filter .list {
    margin-right: 0.2rem;
  }
  .mall-filter .list .name {
    width: auto;
    margin-left: 0.5em;
  }
  .mall-filter .box {
    width: 50%;
  }
  .mall-filter .box .name {
    width: calc(100% - 5em);
  }
}
/*mall-main*/
#mall-main {
  width: calc(100% - 3.3rem);
  overflow: hidden;
}
@media only screen and (max-width: 1024px) {
  #mall-main {
    width: calc(100% - 2.8rem);
  }
}
@media only screen and (max-width: 750px) {
  #mall-main {
    width: 100%;
  }
}
/*Pages*/
.Pages {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.Pages .num {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  font-style: normal;
  margin: 0 1.25em;
}
.Pages a {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0.3125em;
  min-width: 3.125em;
  border-radius: 1.5625em;
  height: 3.125em;
  padding: 0 0.5em;
  position: relative;
  transition: all 0.3s;
  border: solid 0.02rem #000;
}
.Pages a:hover,
.Pages .a_cur {
  color: #fff;
  background-color: #000;
  border-color: transparent;
}
.Pages .a_prev,
.Pages .a_next {
  text-indent: -99999em;
  overflow: hidden;
}
.Pages .a_prev:after,
.Pages .a_next:after {
  width: 15.2173913%;
  padding-bottom: 26.08695652%;
  background: no-repeat center center;
  background-size: contain;
  content: '';
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.Pages .a_prev:hover:after,
.Pages .a_next:hover:after {
  filter: invert(1) brightness(100);
}
.Pages .a_prev:after {
  background-image: url(../images/page_prev.svg);
}
.Pages .a_next:after {
  background-image: url(../images/page_next.svg);
}
@media only screen and (max-width: 750px) {
  .Pages {
    font-size: 0.14rem;
  }
  .Pages .num,
  .Pages a {
    margin: 0.25em;
  }
}
/*result*/
#result {
  background-color: #f2f2f2;
  padding: 0.5rem 0 0.64rem;
  overflow: hidden;
}
#result .title {
  margin-bottom: 0.22rem;
}
#result .input {
  width: 6rem;
  max-width: 100%;
  margin: 0 auto;
  background-color: #fff;
  border-radius: 1.5625em;
  position: relative;
  padding-right: 4.375em;
}
#result .text {
  height: 3.125em;
  line-height: 1.875em;
  padding: 0.625em 0 0.625em 1.6875em;
  display: block;
  width: 100%;
}
#result .go {
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 4.375em;
  cursor: pointer;
  background: url(../images/search_01.svg) no-repeat center center;
  background-size: auto 40%;
}
@media only screen and (max-width: 750px) {
  #result {
    padding: 0.3rem 0 0.4rem;
  }
  #result .title {
    font-size: 0.26rem;
    margin-bottom: 0.15rem;
  }
}
/*total*/
.search-total span {
  color: var(--main-color);
}
/*list-filter*/
.list-filter {line-height:2em;}
/*list-sort*/
.list-sort {
  position: relative;
}
.list-sort span {
  display: block;
  padding-right: 1.11111111em;
  position: relative;
  cursor: pointer;
  font-weight: bold;
  line-height: 2em;
}
.list-sort span:after {
  width: 0.66666667em;
  height: 0.38888889em;
  content: '';
  display: block;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  background: url(../images/language_arrow_01.svg) no-repeat center center;
  background-size: contain;
}
.list-sort .drop {
  position: absolute;
  top: 100%;
  right: 0;
  min-width: 2rem;
  display: none;
}
.list-sort .box {
  box-shadow: 0px 0px 0.98rem 0px rgba(205, 205, 205, 0.57);
  background-color: #fff;
  padding: 0.2rem;
}
.list-sort li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.55555556em;
  line-height: 1.66666667em;
  cursor: pointer;
}
.list-sort li:last-child {
  margin-bottom: 0;
}
.list-sort .label {
  width: calc(100% - 1.7778em);
}
.list-sort .current {
  color: var(--main-color);
  font-weight: bold;
}
.list-sort .title {
  font-size: 0.18rem;
  line-height: 1.25em;
  margin-bottom: 0.18rem;
}
/*mall-main-bar*/
#mall-main-bar {
  width: 100%;
  position: absolute;
  right: 0;
  bottom: 100%;
  margin-bottom: 0.2rem;
  padding-left: 3.3rem;
  gap: 0.1rem;
  z-index: 5;
}
@media only screen and (max-width: 1024px) {
  #mall-main-bar {
    padding-left: 2.8rem;
  }
}
@media only screen and (max-width: 750px) {
  #mall-main-bar {
    padding-left: 0;
    position: static;
    bottom: auto;
justify-content:space-between;
  }
}
/*empty*/
.empty .figure {
  width: 3.99rem;
}
.empty .title {
  margin-top: 0.25rem;
}
.empty .intro {
  margin-top: 0.1rem;
}
.empty .button-more {
  margin-top: 0.4rem;
}
/*checkout-page*/
#checkout-page {
  background-color: #f7f7f7;
}
/*checkout-bill*/
#checkout-bill {
  width: 7.86rem;
  background-color: #fff;
  padding: 0.5rem 0.6rem;
  position: relative;
}
#checkout-bill .hgroup {
  margin-bottom: 0.26rem;
}
#checkout-bill .hgroup .name {
  font-size: 0.24rem;
  line-height: 1.35em;
}
#checkout-bill .hgroup .to {
  text-decoration: underline;
  font-size: 0.14rem;
  line-height: 1.71428571em;
}
#checkout-bill .mb0 {
  margin-bottom: 0;
}
@media only screen and (max-width: 1280px) {
  #checkout-bill {
    width: 7.5rem;
  }
}
@media only screen and (max-width: 1024px) {
  #checkout-bill {
    width: 100%;
    padding-left: 3.125%;
    padding-right: 3.125%;
  }
}
/*checkout-order*/
.checkout-order {
  margin-bottom: 0.44rem;
}
.checkout-order .item {
  padding: 0.33rem 0;
  border-bottom: 0.01rem solid #eee;
}
.checkout-order .pic {
  width: 0.8rem;
  vertical-align: top;
  padding: 0.07rem 0;
}
.checkout-order .figure {
  padding-bottom: 100%;
}
.checkout-order .text {
  padding: 0 4.5045045%;
  vertical-align: top;
}
.checkout-order .box {
  max-width: 2.2rem;
}
.checkout-order .title {
  font-size: 0.16rem;
  line-height: 1.5em;
  font-weight: 500;
}
.checkout-order .title a {
  display: inline-block;
}
.checkout-order .meta {
  font-size: 0.14rem;
  color: #888;
  display: flex;
  flex-wrap: wrap;
  line-height: 1.85714286em;
  gap: 0.12rem;
  margin-top: 0.1rem;
}
.checkout-order .meta span {
  display: block;
}
.checkout-order .meta .type {
  border: solid 0.01rem #ebebeb;
  padding: 0 0.89285714em;
}
.checkout-order .coupon {
  font-size: 0.14rem;
  color: #888;
  line-height: 1.42857143em;
  margin-top: 0.1rem;
}
.checkout-order .coupon span {
  background: url(../images/coupon_01.png) no-repeat left 0.17857143em;
  background-size: 1.28571429em auto;
  padding-left: 2.14285714em;
  display: inline-block;
}
.checkout-order .price {
  line-height: 1.5em;
  width: 0.75rem;
}
.checkout-order .price del {
  color: rgba(0, 0, 0, 0.5);
}
.checkout-order .quantity {
  width: 13.51351351%;
  font-size: 0.14rem;
}
.checkout-order .quantity i {
  display: inline-block;
  vertical-align: middle;
  font-style: normal;
  margin-right: 0.35714286em;
}
.checkout-order .quantity span {
  height: 2.42857143em;
  background-color: #f7f7f7;
  border-radius: 1.07142857em;
  text-align: center;
  display: inline-block;
  vertical-align: middle;
  line-height: 2.42857143em;
  min-width: 2.42857143em;
}
.checkout-order .total {
  text-align: right;
  white-space: nowrap;
  font-size: 0.18rem;
  line-height: 1.33333333em;
  font-weight: bold;
  width: 1rem;
}
@media only screen and (max-width: 750px) {
  .checkout-order .item {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    padding: 0.2rem 0;
  }
  .checkout-order .td {
    display: block;
  }
  .checkout-order .pic {
    width: 20%;
    padding: 0.05rem 0;
  }
  .checkout-order .text {
    width: 60%;
  }
  .checkout-order .price {
    text-align: right;
    width: 20%;
  }
  .checkout-order .quantity {
    width: auto;
    margin-right: 5%;
  }
  .checkout-order .total {
    line-height: 1.88888889em;
    width: auto;
  }
}
/*checkout-code*/
.checkout-code .item {
  margin-bottom: 0.5rem;
}
.checkout-code .input {
  background-color: #f7f7f7;
  border-radius: 0.625em;
  position: relative;
  overflow: hidden;
  width: 100%;
}
.checkout-code .text {
  height: 3.75em;
  line-height: 1.875em;
  display: block;
  width: 100%;
  padding: 0.9375em 1.5em;
  font-weight: 500;
}
.checkout-code input::-moz-placeholder {
  opacity: 1;
  color: #000;
}
.checkout-code input:-moz-placeholder {
  opacity: 1;
  color: #000;
}
.checkout-code input::-webkit-input-placeholder {
  opacity: 1;
  color: #000;
}
.checkout-code input:-ms-input-placeholder {
  opacity: 1;
  color: #000;
}
.checkout-code textarea::-moz-placeholder {
  opacity: 1;
  color: #000;
}
.checkout-code textarea:-moz-placeholder {
  opacity: 1;
  color: #000;
}
.checkout-code textarea::-webkit-input-placeholder {
  opacity: 1;
  color: #000;
}
.checkout-code textarea:-ms-input-placeholder {
  opacity: 1;
  color: #000;
}
.checkout-code .button {
  position: absolute;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  top: 0;
  padding: 0 2.33333333em;
  font-size: 0.12rem;
  font-weight: bold;
  cursor: pointer;
}
.checkout-code .warning {
  background-color: rgba(255, 209, 176, 0.2);
  font-size: 0.14rem;
  line-height: 1.71428571em;
  color: var(--main-color);
  padding: 0.57142857em 1.28571429em;
  border-radius: 1.42857143em;
  margin-top: 0.16rem;
}
.checkout-code .coupon {
  width: 100%;
  background: #fff url(../images/coupon_box_02.svg) no-repeat center center;
  background-size: contain;
  mask: url(../images/coupon_box_01.svg) no-repeat center center;
  -webkit-mask: url(../images/coupon_box_01.svg) no-repeat center center;
  mask-size: contain;
  -webkit-mask-size: contain;
  position: relative;
  margin-bottom: 0.2rem;
}
.checkout-code .coupon:last-child {
  margin-bottom: 0;
}
.checkout-code .coupon:after {
  display: block;
  content: '';
  padding-bottom: 26.875%;
}
.checkout-code .coupon .info {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-between;
  padding: 4.53125% 0;
}
.checkout-code .coupon .left,
.checkout-code .coupon .right {
  display: flex;
  align-items: center;
  padding: 0 5.15625%;
}
.checkout-code .coupon .left {
  width: 32.03125%;
  border-right: 0.01rem dashed rgba(0, 0, 0, 0.2);
  justify-content: center;
}
.checkout-code .coupon .right {
  width: 67.96875%;
}
.checkout-code .coupon .off {
  font-size: 0.2rem;
  line-height: 1.35em;
}
.checkout-code .coupon .min {
  font-size: 0.3rem;
  line-height: 1.35em;
  color: var(--main-color);
}
.checkout-code .coupon .cont {
  max-width: 3.3rem;
}
.checkout-code .coupon .expires {
  font-size: 0.16rem;
  line-height: 1.5em;
  margin-bottom: 0.75em;
}
.checkout-code .coupon .intro {
  font-size: 0.18rem;
  line-height: 1.55555556em;
  color: #555;
  max-height: 3.11111111em;
}
.checkout-code .coupon:nth-child(n+4) {
  display: none;
}
.checkout-code .expand {
  margin-top: 0.2rem;
}
.checkout-code .expand span {
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  cursor: pointer;
  background-color: #f9f9f9;
  line-height: 2.2em;
}
.checkout-code .expand span:after {
  width: 0.875em;
  height: 0.4375em;
  background: url(../images/drop_arrow_01.svg) no-repeat center center;
  background-size: contain;
  display: block;
  content: '';
  margin-left: 0.1rem;
}
.checkout-code .expand.show span:after {
  transform: rotate(180deg);
}
.checkout-code .showall .coupon:nth-child(n+4) {
  display: block;
}
@media only screen and (max-width: 1024px) {
  .checkout-code .coupon {
    width: calc(50% - 0.1rem);
  }
}
@media only screen and (max-width: 750px) {
  .checkout-code .item {
    margin-bottom: 0.35rem;
  }
  .checkout-code .coupon {
    width: 100%;
  }
  .checkout-code .coupon .left,
  .checkout-code .coupon .right {
    padding: 0 3.5%;
  }
  .checkout-code .coupon .off {
    font-size: 0.16rem;
  }
  .checkout-code .coupon .min {
    font-size: 0.18rem;
  }
  .checkout-code .coupon .expires {
    font-size: 0.14rem;
    margin-bottom: 0.25em;
  }
  .checkout-code .coupon .intro {
    font-size: 0.16rem;
    line-height: 1.5em;
  }
}
/*checkout-total*/
.checkout-total {
  line-height: 2.25em;
  text-align: right;
}
.checkout-total table {
  table-layout: auto;
}
.checkout-total td:nth-child(1) {
  padding-right: 0.45rem;
}
.checkout-total td:nth-child(2) {
  width: 0.8rem;
  text-align: left;
}
.checkout-total .line td {
  padding: 0.24rem 0 0.1rem;
}
.checkout-total .line td:after {
  display: block;
  content: '';
  height: 0.02rem;
  background-color: #000000;
  width: 100%;
}
.checkout-total .cost {
  font-size: 0.24rem;
  line-height: 1.83333333em;
  font-weight: bold;
}
/*checkout-checkbox*/
.checkout-checkbox {
  font-size: 0.16rem;
  width: 1.125em;
  height: 1.125em;
  border-radius: 50%;
  position: relative;
  border: 0.01rem solid rgba(0, 8, 15, 0.3);
  transition: all 0.3s;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.checkout-checkbox:after {
  width: 60%;
  height: 60%;
  background-color: var(--main-color);
  border-radius: 50%;
  display: block;
  content: '';
  opacity: 0;
  transition: inherit;
}
.checkout-checkbox.checked {
  border-color: var(--main-color);
}
.checkout-checkbox.checked:after {
  opacity: 1;
}
/*code-popup*/
.code-popup {
  display: block;
}
.code-popup .box {
  width: 7.93rem;
  max-width: 90%;
  padding: 0.38rem 0.4rem 0.5rem;
  background-color: #fff;
}
.code-popup .title {
  margin-bottom: 1.26666667em;
}
.code-popup .item {
  margin-bottom: 0.2rem;
  cursor: pointer;
}
.code-popup .item:last-child {
  margin-bottom: 0;
}
.code-popup .coupon {
  width: calc(100% - 0.5rem);
  background: #fff url(../images/coupon_box_02.svg) no-repeat center center;
  background-size: contain;
  mask: url(../images/coupon_box_01.svg) no-repeat center center;
  -webkit-mask: url(../images/coupon_box_01.svg) no-repeat center center;
  mask-size: contain;
  -webkit-mask-size: contain;
  position: relative;
}
.code-popup .coupon:after {
  display: block;
  content: '';
  padding-bottom: 26.875%;
}
.code-popup .info {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-between;
  padding: 4.53125% 0;
}
.code-popup .left,
.code-popup .right {
  display: flex;
  align-items: center;
  padding: 0 5.15625%;
}
.code-popup .left {
  width: 32.03125%;
  border-right: 0.01rem dashed rgba(0, 0, 0, 0.2);
  justify-content: center;
}
.code-popup .right {
  width: 67.96875%;
}
.code-popup .off {
  font-size: 0.2rem;
  line-height: 1.35em;
}
.code-popup .min {
  font-size: 0.3rem;
  line-height: 1.35em;
  color: var(--main-color);
}
.code-popup .cont {
  max-width: 3.3rem;
}
.code-popup .expires {
  font-size: 0.16rem;
  line-height: 1.5em;
  margin-bottom: 0.75em;
}
.code-popup .intro {
  font-size: 0.18rem;
  line-height: 1.55555556em;
  color: #555;
  max-height: 3.11111111em;
}
.code-popup .selected .coupon {
  background-color: rgba(var(--rgba), 0.1);
}
.code-popup .button {
  font-weight: bold;
  width: 16.25em;
  height: 3.125em;
  border-radius: 1.5625em;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #000;
  margin: 0.5rem auto 0;
  color: #fff;
  cursor: pointer;
}
.code-popup .disabled {
  cursor: default;
}
.code-popup .disabled .checkout-checkbox {
  background-color: #ddd;
  border-color: transparent;
}
.code-popup .disabled .coupon {
  filter: grayscale(100%);
  opacity: 0.3;
}
@media only screen and (max-width: 750px) {
  .code-popup .box {
    padding: 0.3rem 0.28rem 0.42rem;
  }
  .code-popup .title {
    font-size: 0.26rem;
    margin-bottom: 0.2rem;
  }
  .code-popup .coupon {
    width: calc(100% - 0.25rem);
  }
  .code-popup .left,
  .code-popup .right {
    padding: 0 3.5%;
  }
  .code-popup .off {
    font-size: 0.16rem;
  }
  .code-popup .min {
    font-size: 0.18rem;
  }
  .code-popup .expires {
    font-size: 0.14rem;
    margin-bottom: 0.25em;
  }
  .code-popup .intro {
    font-size: 0.16rem;
    line-height: 1.5em;
  }
  .code-popup .button {
    margin-top: 0.3rem;
  }
}
/*checkout-info*/
#checkout-info {
  width: calc(100% - 7.86rem);
  padding: 0 1.7rem 0.95rem 2.4rem;
}
#checkout-info .hgroup {
  margin-bottom: 0.25rem;
}
#checkout-info .hgroup .name {
  font-size: 0.3rem;
  line-height: 1.35em;
}
#checkout-info .hgroup .intro {
  color: rgba(0, 0, 0, 0.5);
  margin-top: 0.12rem;
}
#checkout-info #breadcrumb {
  margin-bottom: 0.48rem;
}
#checkout-info .mb22 {
  margin-bottom: 0.22rem;
}
@media only screen and (max-width: 1280px) {
  #checkout-info {
    padding-left: 0.6rem;
    padding-right: 0.6rem;
    width: calc(100% - 7.5rem);
  }
}
@media only screen and (max-width: 1024px) {
  #checkout-info {
    width: 100%;
    padding-left: 3.125%;
    padding-right: 3.125%;
  }
}
/*checkout-delivery*/
.checkout-delivery {
  border-bottom: 0.02rem solid #000;
  padding-bottom: 0.45rem;
  margin-bottom: 0.37rem;
}
@media only screen and (max-width: 1024px) {
  .checkout-delivery {
    padding-bottom: 0.25rem;
  }
}
/*checkout-recipient*/
.checkout-recipient {
  position: relative;
  z-index: 6;
}
.checkout-recipient .current {
  background-color: #ffffff;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  padding: 0.22rem 0.9rem 0.22rem 0.23rem;
  position: relative;
  z-index: 2;
}
.checkout-recipient .tag {
  color: rgba(0, 0, 0, 0.5);
}
.checkout-recipient .info {
  width: calc(100% - 1.72rem);
}
.checkout-recipient .meta {
  gap: 0.4rem;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 0.07rem;
}
.checkout-recipient .name {
  font-size: 0.2rem;
  line-height: 1.35em;
}
.checkout-recipient .phone {
  font-size: 0.18rem;
  font-weight: bold;
  line-height: 1.35em;
}
.checkout-recipient .address {
  line-height: 1.5em;
  color: #918b8a;
}
.checkout-recipient .arrow {
  width: 0.14rem;
  height: 0.07rem;
  background: url(../images/drop_arrow_01.svg) no-repeat center center;
  background-size: contain;
  cursor: pointer;
  position: absolute;
  top: 0.27rem;
  right: 0.28rem;
}
.checkout-recipient .drop {
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  background-color: #fbfbfb;
  box-shadow: 0.12rem 0.31rem 1.52rem 0px rgba(29, 19, 17, 0.2);
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-top: 0.01rem solid #e9e9e9;
  max-height: 4.6rem;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.checkout-recipient .item {
  padding: 0.26rem 0.4rem 0.32rem 0.4rem;
  position: relative;
  transition: all 0.2s;
  cursor: pointer;
}
.checkout-recipient .item:after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border: 0.01rem solid var(--main-color);
  opacity: 0;
  transition: inherit;
}
.checkout-recipient .item > div {
  position: relative;
  z-index: 2;
}
.checkout-recipient .selected {
  background-color: rgba(var(--rgba), 0.08);
}
.checkout-recipient .selected:after {
  opacity: 1;
}
@media only screen and (max-width: 750px) {
  .checkout-recipient .current {
    padding-right: 0.5rem;
  }
  .checkout-recipient .tag {
    width: 100%;
    margin-bottom: 0.1rem;
  }
  .checkout-recipient .info {
    width: 100%;
  }
  .checkout-recipient .item {
    padding-left: 0.3rem;
    padding-right: 0.3rem;
  }
}
/*checkout-address*/
.checkout-address {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0.01rem dashed #000;
  height: 3.75em;
  gap: 0.14rem;
  cursor: pointer;
}
.checkout-address:before {
  content: '+';
  font-size: 1.5em;
  line-height: 1em;
  display: block;
  margin-top: -0.1em;
}
/*checkout-form*/
.checkout-form {
  font-weight: 500;
  margin-bottom: 0.25rem;
  overflow: hidden;
}
.checkout-form:last-child {
  margin-bottom: 0;
}
.checkout-form .title {
  font-size: 0.16rem;
  line-height: 1.875em;
  margin-bottom: 0.11rem;
}
.checkout-form .item {
  padding-bottom: 0.2rem;
}
.checkout-form .input {
  background-color: #fff;
  position: relative;
  border: 0.01rem solid #fff;
}
.checkout-form .select:after {
  width: 0.875em;
  height: 0.5em;
  background: url(../images/drop_arrow_01.svg) no-repeat center center;
  background-size: contain;
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 1.6875em;
}
.checkout-form .label {
  display: block;
  width: 100%;
  color: rgba(0, 0, 0, 0.5);
  position: absolute;
  left: 0;
  top: 0;
  line-height: 3.75em;
  height: 3.75em;
  padding: 0 1.5em;
}
.checkout-form .label.show {
  display: block;
  position: static;
}
.checkout-form .find {
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 3.9375em;
  cursor: pointer;
  background: url(../images/search_01.svg) no-repeat center center;
  background-size: auto 31.66666667%;
  z-index: 5;
}
.checkout-form .text {
  height: 3.75em;
  line-height: 1.875em;
  padding: 0.9375em 1.5em;
  position: relative;
  z-index: 2;
  display: block;
  width: 100%;
  font-weight: 500;
}
.checkout-form select {
  height: 3.75em;
  line-height: 3.75em;
  position: relative;
  z-index: 2;
  display: block;
  width: 100%;
  padding: 0 1.5em;
  appearance: none;
  -webkit-appearance: none;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.5);
  padding-right: 4.8125em;
}
.checkout-form select::-ms-expand {
  display: none;
}
.checkout-form select.active {
  color: #000;
}
.checkout-form .help {
  width: 1.25em;
  height: 1.25em;
  background: url(../images/help_01.svg) no-repeat center center;
  background-size: contain;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  right: 1.375em;
  cursor: pointer;
}
.ucenter-add-address .help .tit,
.checkout-form .help .tit {
  display: none;
  position: absolute;
  bottom: calc(100% + 0.12rem);
  left: 50%;
  transform: translateX(-50%);
  min-width: max-content;
  max-width: 3rem;
  padding: 0.24em 0.4em;
  background-color: rgba(0, 0, 0, 0.85);
  color: #fff;
  font-size: 0.14rem;
  line-height: 1.5em;
  border-radius: 0.08rem;
  white-space: normal;
  text-align: center;
  box-shadow: 0 0.04rem 0.16rem rgba(0, 0, 0, 0.2);
  z-index: 10;
}

.ucenter-add-address .help .tit:before,
.checkout-form .help .tit:before {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: solid 0.4em transparent;
  border-top-color: rgba(0, 0, 0, 0.85);
}

.ucenter-add-address .help:hover .tit,
.checkout-form .help:hover .tit {
  display: block;
}
.checkout-form .tips {
  color: var(--main-color);
  margin-top: 0.05rem;
  display: none;
}
.checkout-form .error .input {
  border-color: var(--main-color);
}
.checkout-form .error .tips {
  display: block;
}
/*checkout-payment*/
.checkout-payment {
  margin-bottom: 0.5rem;
}
.checkout-payment .link {
  gap: 0.3rem;
  margin-top: 0.25rem;
}
.checkout-payment .link a {
  color: #0078ff;
  text-decoration: underline;
}
.checkout-payment .link a:hover {
  text-decoration: none;
}
.checkout-payment .list {
  background-color: #fff;
  padding: 0.04rem;
  margin-top: 0.1rem;
}
.checkout-payment .list .item {
  border-bottom: 0.01rem solid rgba(234, 234, 234, 0.8);
}
.checkout-payment .list .item:last-child {
  border-bottom: none;
}
.checkout-payment .list .top {
  padding: 0.15rem 0.2rem;
  font-size: 0.16rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}
.checkout-payment .list .method {
  font-size: 1em;
  line-height: 2em;
}
.checkout-payment .list .checkbox {
  width: 1.25em;
  height: 1.25em;
  border-radius: 50%;
  border: solid 0.01rem #eaeaea;
  margin-right: 1.25em;
}
.checkout-payment .list .icon {
  display: flex;
  gap: 0.08rem;
}
.checkout-payment .list .icon img {
  display: block;
  width: auto;
  height: 0.31rem;
  object-fit: contain;
}
.checkout-payment .list .btm {
  background-color: #f9f9f9;
  display: none;
}
.checkout-payment .list .tips {
  min-height: 1.5rem;
  align-items: center;
  justify-content: center;
  text-align: center;
  display: flex;
  width: 3.9rem;
  max-width: 80%;
  margin: 0 auto;
  line-height: 1.875em;
}
.checkout-payment .list .active {
  border-bottom: transparent;
}
.checkout-payment .list .active .checkbox {
  border: solid 0.04rem var(--main-color);
}
.checkout-payment .list .active .btm {
  display: block;
}
@media only screen and (max-width: 750px) {
  .checkout-payment {
    margin-bottom: 0.35rem;
  }
  .checkout-payment .link {
    gap: 0.1rem;
  }
}
/*countTime*/
.countTime i {
  font-style: normal;
}
/*available-points*/
.available-points {
  margin-bottom: 0.32rem;
}
.available-points span {
  display: block;
  margin-right: 0.52083333em;
  line-height: 1em;
}
.available-points span:last-child {
  margin-right: 0;
}
@media only screen and (max-width: 750px) {
  .available-points .total {
    font-size: 0.4rem;
  }
}
/*points-list*/
#points-list {
  margin-bottom: 0.2rem;
}
@media only screen and (max-width: 1024px) {
  #points-list .item {
    width: 33.333%;
  }
}
@media only screen and (max-width: 750px) {
  #points-list {
    margin-bottom: 0.1rem;
  }
  #points-list .item {
    width: 50%;
  }
}
/*mall-menu*/
.mall-menu ul {
  position: sticky;
  top: 0;
}
.mall-menu li {
  line-height: 2em;
}
.mall-menu a {
  color: #555;
  padding-left: 1em;
  display: inline-block;
  position: relative;
}
.mall-menu a:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 0.2em;
  height: 0.9em;
  background-color: var(--main-color);
  opacity: 0;
}
.mall-menu a:hover,
.mall-menu .current a {
  color: #000;
}
.mall-menu a:hover:before,
.mall-menu .current a:before {
  opacity: 1;
}
@media only screen and (max-width: 750px) {
  .mall-menu ul {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
  }
}
/*coupon-item*/
.coupon-item {
  margin-bottom: 0.3rem;
  font-size: 0.16rem;
}
.coupon-item .btn {
  margin-top: 1.4375em;
}
.coupon-item .price {
  margin-top: 0.83333333em;
}
.coupon-item .date {
  font-size: 0.6875em;
  color: #888;
  line-height: 1.5em;
  position: absolute;
  right: 1.875em;
  top: 1.63636364em;
}
.coupon-item .tag {
  color: #fefefe;
  font-size: 0.6875em;
  height: 1.90909091em;
  line-height: 1.90909091em;
  background-color: #ff7110;
  border-radius: 0.95454545em;
  padding: 0 1.27272727em;
  margin-bottom: 0.54545455em;
}
.coupon-item .off {
  font-size: 0.875em;
  font-weight: bold;
  line-height: 1.65em;
}
.coupon-item .min {
  font-size: 1.3125em;
  font-weight: bold;
  line-height: 1.5em;
  color: var(--main-color);
}
.coupon-item .min span {
  font-size: 1.33333333em;
  line-height: 1.125em;
}
.coupon-item .icon {
  width: 6.0625em;
}
.coupon-item .icon i {
  display: block;
  overflow: hidden;
  padding-bottom: 100%;
  background: no-repeat center center;
  background-size: contain;
}
.coupon-item .icon .xray {
  background-image: url(../images/card_01.png);
}
.coupon-item .icon .hint {
  background-image: url(../images/card_02.png);
}
.coupon-item .intro {
  font-size: 0.8125em;
  line-height: 1.5em;
  color: #888;
  max-height: 3em;
}
.coupon-item .coupon {
  position: relative;
  background: url(../images/coupon_box_03.svg) no-repeat center center;
  background-size: contain;
  margin-right: 0.01rem;
}
.coupon-item .coupon:after {
  display: block;
  content: '';
  padding-bottom: 54.10764873%;
}
.coupon-item .coupon .info {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  padding: 1.3125em 1.875em;
}
.coupon-item .coupon .meta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border-bottom: 0.02rem dashed rgba(0, 0, 0, 0.2);
  padding-bottom: 0.6875em;
  margin-bottom: 0.625em;
}
.coupon-item .card {
  background-color: #fff3eb;
  border: solid 0.01rem var(--main-color);
  padding: 1.4375em 1.75em 0.9375em;
}
.coupon-item .card .top {
  display: flex;
  justify-content: space-between;
  margin-bottom: 0.625em;
}
.coupon-item .card .off {
  margin-bottom: 0.85714286em;
}
@media only screen and (max-width: 750px) {
  .coupon-item {
    font-size: 0.21rem;
  }
  .coupon-item .coupon {
    margin-right: 0;
  }
  .coupon-item .btn a {
    width: 100%;
  }
}
/*coupon-list*/
#coupon-list {
  margin-bottom: 0.25rem;
}
@media only screen and (max-width: 1280px) {
  #coupon-list .item {
    width: 33.333%;
  }
}
@media only screen and (max-width: 1024px) {
  #coupon-list .item {
    width: 50%;
  }
}
@media only screen and (max-width: 750px) {
  #coupon-list {
    width: 100%;
    margin-bottom: 0;
  }
  #coupon-list .item {
    width: 100%;
    padding-right: 0.01rem;
  }
}
/*list-category*/
.list-category {
  gap: 1.16em;
}
.list-category a {
  display: block;
  position: relative;
}
.list-category a:before {
  background-color: var(--main-color);
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: -0.625em;
  width: 100%;
  height: 0.16666667em;
  opacity: 0;
}
.list-category a:not(:hover) {
  color: #888;
}
.list-category a.acitve {
  color: #000;
}
.list-category a.acitve:before {
  opacity: 1;
}
@media only screen and (max-width: 750px) {
  .list-category {
    font-size: 0.2rem;
  }
  .list-category a:before {
    top: -0.41666667em;
  }
}
/*list-order*/
.list-order {
  position: relative;
  z-index: 5;
}
.list-order span {
  display: block;
  position: relative;
  padding-right: 1.3125em;
  line-height: 2em;
  cursor: pointer;
}
.list-order span:after {
  width: 0.6875em;
  height: 0.375em;
  content: '';
  display: block;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-40%);
  background: url(../images/list_order_arrow.svg) no-repeat center center;
  background-size: contain;
}
.list-order ul {
  position: absolute;
  top: 100%;
  min-width: 100%;
  right: 0;
  background-color: #fff;
  box-shadow: 0px 0px 0.19rem 0.01rem rgba(104, 104, 104, 0.1);
  z-index: 5;
  text-align: center;
  padding: 0.5em 0;
}
.list-order li {
  white-space: nowrap;
  font-size: 0.14rem;
  line-height: 2.2em;
  padding: 0 1.5em;
  cursor: pointer;
}
.list-order li:not(:hover) {
  color: #888;
}
/*mainbar*/
#mainbar {
  margin-bottom: 0.37rem;
  position: relative;
  z-index: 5;
}
/*blog-item*/
.blog-item .figure {
  padding-bottom: 100%;
}
.blog-item .text {
  padding: 0.2rem 0.3rem 0.18rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.blog-item .tag {
  font-weight: bold;
  height: 2.5em;
  display: flex;
  align-items: center;
  background-color: #f3f3f3;
  padding: 0 0.9375em;
  margin-bottom: 0.625em;
}
.blog-item .title {
  font-size: 0.2rem;
  line-height: 1.5em;
  height: 4.5em;
}
.blog-item .date {
  line-height: 1.5em;
  border-top: 0.01rem solid #dedede;
  padding-top: 0.16rem;
  margin-top: 0.2rem;
  width: 100%;
}
.blog-item .date time {
  display: block;
  background: url(../images/swiper_next_01.svg) no-repeat right center;
  background-size: 0.4375em auto;
}
.blog-item .info {
  display: block;
  overflow: hidden;
  background-color: #ffffff;
  box-shadow: 0px 0px 0.19rem 0.01rem rgba(104, 104, 104, 0.1);
}
@media only screen and (max-width: 1024px) {
  .blog-item {
    width: 25%;
  }
}
@media only screen and (max-width: 750px) {
  .blog-item {
    width: 50%;
  }
  .blog-item .text {
    padding: 0.18rem 0.2rem;
  }
  .blog-item .title {
    font-size: 0.18rem;
  }
  .blog-item .date {
    padding-top: 0.19rem;
    margin-top: 0.2rem;
  }
}
/*blog-list*/
#blog-list {
  margin-bottom: 0.4rem;
}
@media only screen and (max-width: 1024px) {
  #blog-list .item {
    width: 33.333%;
  }
}
@media only screen and (max-width: 750px) {
  #blog-list .item {
    width: 50%;
  }
}
/*post-share*/
.post-share .name {
  margin-bottom: 0.12rem;
}
.post-share ul {
  gap: 0.2rem;
}
.post-share a {
  font-weight: bold;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16.25em;
  height: 3.125em;
  border-radius: 1.5625em;
  gap: 0.625em;
}
.post-share a:before {
  width: 1.375em;
  height: 1.375em;
  display: block;
  content: '';
  background: no-repeat center center;
  background-size: contain;
}
.post-share a:hover {
  opacity: 0.8;
}
.post-share .tik {
  background-color: #000000;
}
.post-share .tik:before {
  background-image: url(../images/post_share_tik.svg);
}
.post-share .ins {
  background-color: #e23e61;
}
.post-share .ins:before {
  background-image: url(../images/post_share_ins.svg);
}
.post-share .you {
  background-color: #e4002a;
}
.post-share .you:before {
  background-image: url(../images/post_share_you.svg);
}
@media only screen and (max-width: 1024px) {
  .post-share a {
    width: 12.25em;
  }
}
@media only screen and (max-width: 750px) {
  .post-share .name {
    margin-bottom: 0.2rem;
  }
  .post-share ul {
    gap: 0.1rem;
  }
  .post-share li {
    width: 100%;
  }
  .post-share a {
    width: 100%;
  }
}
/*blog-post*/
#blog-post {
  width: calc(100% - 3.65rem);
}
#blog-post .content {
  background-color: #ffffff;
  padding: 0.37rem 0.35rem 0.6rem;
}
#blog-post .top {
  padding-bottom: 0.3rem;
  border-bottom: 0.01rem solid #f2f2f2;
  margin-bottom: 0.2rem;
}
#blog-post .title {
  color: #231815;
  line-height: 1.2em;
}
#blog-post .meta {
  gap: 0.22rem;
  margin-top: 0.22rem;
}
#blog-post .meta span {
  display: block;
}
#blog-post .meta .tag {
  height: 2.375em;
  display: flex;
  align-items: center;
  background-color: #f3f3f3;
  border-radius: 1.1875em;
  font-weight: bold;
  color: #000;
  padding: 0 0.9375em;
}
#blog-post .entry {
  line-height: 1.66666667em;
}
#blog-post .entry h3 {
  font-size: 0.2rem;
  line-height: 1.5em;
}
#blog-post .entry .figure {
  cursor: pointer;
}
#blog-post .entry .figure:after {
  width: 4%;
  padding-bottom: 4%;
  background: rgba(0, 0, 0, 0.5) url(../images/zoom_01.svg) no-repeat center center;
  background-size: 50% auto;
  display: block;
  position: absolute;
  right: 0;
  bottom: 0;
  cursor: pointer;
}
#blog-post .entry img {
  position: relative;
}
#blog-post .post-share {
  margin-top: 0.67rem;
}
#blog-post .button-more {
  margin-top: 0.4rem;
}
@media only screen and (max-width: 1024px) {
  #blog-post .title {
    font-size: 0.36rem;
  }
}
@media only screen and (max-width: 750px) {
  #blog-post {
    width: 100%;
    margin-bottom: 0.35rem;
  }
  #blog-post .content {
    padding: 0.3rem 0.26rem 0.5rem;
  }
  #blog-post .top {
    padding-bottom: 0.2rem;
  }
  #blog-post .title {
    font-size: 0.26rem;
  }
  #blog-post .meta {
    gap: 0.15rem;
  }
  #blog-post .meta .tag {
    width: 100%;
  }
  #blog-post .post-share {
    margin-top: 0.35rem;
  }
  #blog-post .back {
    margin: 0 auto;
  }
}
/*blog-aside*/
#blog-aside {
  width: 3.45rem;
}
#blog-aside .box {
  background-color: #fff;
  margin-bottom: 0.1rem;
  padding: 0.32rem 0.3rem;
  overflow: hidden;
}
#blog-aside .box:last-child {
  margin-bottom: 0;
}
#blog-aside .name {
  font-size: 0.24rem;
  line-height: 1.25em;
  margin: 0 0 1em;
}
@media only screen and (max-width: 750px) {
  #blog-aside {
    width: 100%;
  }
}
/*blog-menu*/
#blog-menu.box {
  padding-bottom: 0;
}
#blog-menu .name {
  margin-bottom: 0.1rem;
}
#blog-menu li {
  position: relative;
  font-size: 0.18rem;
  padding: 1.22222222em 0;
  line-height: 2em;
}
#blog-menu li:not(:last-child):after {
  content: '';
  display: block;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  background-color: #f7f5f2;
  height: 0.01rem;
  width: 200%;
}
#blog-menu a {
  color: #888;
  display: block;
  position: relative;
  padding-right: 1em;
}
#blog-menu a:after {
  width: 0.38888889em;
  height: 0.66666667em;
  background: url(../images/arrow_right_01.svg) no-repeat center center;
  background-size: contain;
  content: '';
  display: block;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  filter: invert(1) brightness(0);
  opacity: 0.4;
}
#blog-menu a:hover,
#blog-menu .acitve a {
  color: var(--main-color);
}
#blog-menu a:hover:after,
#blog-menu .acitve a:after {
  opacity: 1;
  filter: none;
}
/*blog-related*/
.blog-related li:not(:last-child) {
  border-bottom: 0.01rem solid #f2f2f2;
  padding-bottom: 0.23rem;
  margin-bottom: 0.23rem;
}
.blog-related .figure {
  width: 0.8rem;
  margin-top: 0.07rem;
}
.blog-related .figure:after {
  display: block;
  padding-bottom: 100%;
}
.blog-related .text {
  width: calc(100% - 1rem);
}
.blog-related .title {
  font-size: 0.16rem;
  line-height: 1.5em;
  height: 4.5em;
  font-weight: 500;
  margin-bottom: 0.9375em;
}
.blog-related .title[data-rows="2"] {
  height: 3em;
}
.blog-related .date {
  color: #888;
}
.blog-related .price {
  font-size: 0.18rem;
  line-height: 1.33333333em;
  font-weight: bold;
}
.blog-related .info {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  .blog-related .title {
    height: 3em;
    line-clamp: 2;
    -webkit-line-clamp: 2;
  }
}
/*blog-details*/
#blog-details {
  background-color: #f7f7f7;
  padding-bottom: 1rem;
}
@media only screen and (max-width: 750px) {
  #blog-details {
    padding-bottom: 0.5rem;
  }
}
/*signup*/
.signup .box {
  background-color: #fff;
  width: 5.55rem;
  max-width: 90%;
  padding: 0.5rem 0.65rem 0.65rem;
}
.signup .info {
  display: none;
}
.signup .info:first-child {
  display: block;
}
.signup .title {
  margin-bottom: 1.58333333em;
}
.signup .item {
  margin-bottom: 0.2rem;
}
.signup .input {
  background-color: #f9f9f9;
  position: relative;
  overflow: hidden;
}
.signup .label {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  height: 3.75em;
  line-height: 3.75em;
  display: none;
  padding: 0 1.25em;
  background-color: #efefef;
  color: rgba(0, 0, 0, 0.5);
}
.signup .text {
  height: 3.75em;
  line-height: 1.875em;
  padding: 0.9375em 1.25em;
  display: block;
  width: 100%;
  position: relative;
  z-index: 2;
  color: rgba(0, 0, 0, 0.5);
}
.signup .code .text {
  padding-right: 6.25em;
}
.signup .view {
  display: block;
  width: 0.2rem;
  height: 0.2rem;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: url(../images/input_hide.png) no-repeat center center;
  background-size: contain;
  right: 0.23rem;
  cursor: pointer;
  z-index: 5;
}
.signup .send {
  font-size: 0.18rem;
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4.55555556em;
  font-style: normal;
  cursor: pointer;
  z-index: 5;
}
.signup .send:before {
  width: 0.01rem;
  height: 0.66666667em;
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background-color: rgba(0, 0, 0, 0.2);
}
.signup .enter {
  line-height: 1.5em;
  margin-bottom: 0.37rem;
}
.signup .enter a {
  text-decoration: underline;
}
.signup .button-submit {
  width: 100%;
}
.signup .other {
  margin-top: 1.1rem;
}
.signup .checkbox {
  margin-top: 0.04rem;
  width: 0.18rem;
  height: 0.18rem;
  border-radius: 50%;
  position: relative;
  border: 0.01rem solid rgba(0, 8, 15, 0.3);
  transition: all 0.3s;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.signup .checkbox:after {
  width: 0.1rem;
  height: 0.1rem;
  background-color: var(--main-color);
  border-radius: 50%;
  display: block;
  content: '';
  opacity: 0;
  transition: inherit;
}
.signup .checkbox.checked {
  border-color: var(--main-color);
}
.signup .checkbox.checked:after {
  opacity: 1;
}
.signup .checkbox + input[type="checkbox"] {
  display: none;
}
.signup .cont {
  width: calc(100% - 0.38rem);
  line-height: 1.5em;
  color: #888;
}
.signup .cont a {
  text-decoration: underline;
}
.signup .cont a:not(:hover) {
  color: #171010;
}
.signup .meta {
  margin-left: 0.38rem;
  margin-top: 0.18rem;
}
.signup .meta a {
  text-decoration: underline;
  color: var(--main-color);
}
@media only screen and (max-width: 750px) {
  .signup .box {
    padding: 0.35rem 0.3rem 0.4rem;
  }
  .signup .title {
    font-size: 0.3rem;
    margin-bottom: 1em;
  }
}
/*terms*/
#terms {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: 10;
  background-color: #fff;
  padding: 0.5rem 0;
  box-shadow: 0px 0px 0.16rem 0px rgba(0, 0, 0, 0.09);
  display: none;
}
#terms .page {
  gap: 0.1rem;
  margin-top: 0.1rem;
}
#terms .page a {
  color: var(--main-color);
  text-decoration: underline;
  display: block;
}
#terms .text {
  width: calc(100% - 3.2rem);
}
@media only screen and (max-width: 750px) {
  #terms {
    padding: 0.25rem 0;
  }
  #terms .text {
    width: 100%;
    margin-bottom: 0.15rem;
  }
  #terms .button-more {
    display: flex;
    justify-content: flex-end;
    width: 100%;
  }
}
/*shipping*/
#shipping {
  background-color: #f7f7f7;
  padding: 0.75rem 0 0.8rem;
}
#shipping .name {
  margin-bottom: 0.45rem;
}
#shipping .form .cols {
  align-items: flex-end;
}
#shipping .form .label {
  display: block;
  font-weight: bold;
  font-size: 0.18rem;
  line-height: 1.33333333em;
  margin-bottom: 0.83333333em;
}
#shipping .form .text {
  height: 3.375em;
  line-height: 1.5em;
  display: block;
  width: 100%;
  padding: 0.9375em 1.4375em;
  background-color: #fff;
  border-radius: 1.6875em;
}
#shipping .form .button-submit {
  width: 100%;
}
#shipping .info {
  margin-top: 0.32rem;
}
#shipping .info .title {
  font-size: 0.16rem;
  line-height: 1.5em;
  margin-bottom: 0.05rem;
}
#shipping .info .intro {
  color: #666;
  line-height: 1.5em;
}
@media only screen and (max-width: 750px) {
  #shipping {
    padding: 0.5rem 0 0.6rem;
  }
  #shipping .name {
    margin-bottom: 0.3rem;
  }
  #shipping .info {
    margin-top: 0.2rem;
  }
}
/*shopping-cart*/
#shopping-cart {
  padding: 0.2rem 0 1.1rem;
}
#shopping-cart .empty {
  margin-top: 0.65rem;
}
@media only screen and (max-width: 750px) {
  #shopping-cart {
    padding: 0 0 0.7rem;
  }
}
/*shopping-cart-checkbox*/
.shopping-cart-checkbox {
  font-size: 0.2rem;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  position: relative;
  border: 0.01rem solid rgba(0, 8, 15, 0.3);
  cursor: pointer;
  display: block;
}
.shopping-cart-checkbox:after {
  font-size:0.875em;
  border-radius: inherit;
  content: '✓';
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: inherit;
color: var(--main-color);
}
.shopping-cart-checkbox.checked {
  border-color: var(--main-color);
}
.shopping-cart-checkbox.checked:after {
  opacity: 1;
}
/*shopping-cart-meta*/
#shopping-cart-meta {
  line-height: 0.4rem;
  border-bottom: 0.01rem solid #000;
  padding: 0.12rem 0;
}
#shopping-cart-meta .col1 {
  width: 9.72222222%;
  gap: 0.13rem;
}
#shopping-cart-meta .col2 {
  width: 46.52777778%;
}
#shopping-cart-meta .col3 {
  width: 12.84722222%;
}
#shopping-cart-meta .col4 {
  width: 19.09722222%;
}
#shopping-cart-meta .col5 {
  width: 10.41666667%;
}
#shopping-cart-meta .col6 {
  width: 1.38888889%;
}
#shopping-cart-meta strong {
  font-size: 0.18rem;
}
@media only screen and (max-width: 750px) {
  #shopping-cart-meta > div:nth-child(n+3) {
    display: none;
  }
  #shopping-cart-meta .col1 {
    width: 1.1rem;
  }
  #shopping-cart-meta .col2 {
    width: calc(100% - 1.2rem);
  }
}
/*shopping-cart-list*/
#shopping-cart-list {
  margin-left: 3.68055556%;
}
@media only screen and (max-width: 750px) {
  #shopping-cart-list {
    margin-left: 0;
  }
}
/*cart-qty*/
.cart-qty {
  width: 10em;
  border: 0.02rem solid #000;
  display: flex;
  justify-content: space-between;
  font-size: 0.18rem;
  line-height: 1.33333333em;
  padding: 0.41666667em 0;
  border-radius: 1.38888889em;
  overflow: hidden;
}
.cart-qty .text {
  width: calc(100% - 4.778em);
  height: 1.94444444em;
  line-height: 1.94444444em;
  display: block;
  border-left: 0.01rem solid #000;
  border-right: 0.01rem solid #000;
  text-align: center;
}
.cart-qty .text[disabled="disabled"] {
  color: #000;
}
.cart-qty label {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.15em;
  text-align: center;
  font-size: 1.11111111em;
  line-height: 1.2em;
  cursor: pointer;
}
@media only screen and (max-width: 750px) {
  .cart-qty {
    font-size: 0.14rem;
  }
}
/*shopping-cart-item*/
.shopping-cart-item {
  border-bottom: 0.01rem solid #b2b4b7;
  padding: 0.33rem 0 0.37rem;
}
.shopping-cart-item .col1 {
  width: 6.27253064%;
}
.shopping-cart-item .col2 {
  width: 48.30569575%;
}
.shopping-cart-item .col3 {
  width: 13.33813987%;
}
.shopping-cart-item .col4 {
  width: 19.82696467%;
}
.shopping-cart-item .col5 {
  width: 10.814708%;
}
.shopping-cart-item .col6 {
  width: 1.44196107%;
}
.shopping-cart-item .col3 i,
.shopping-cart-item .col5 i {
  font-style: normal;
  display: none;
}
.shopping-cart-item .delete {
  padding-bottom: 100%;
  background: url(../images/delete_01.png) no-repeat center center;
  background-size: contain;
  cursor: pointer;
}
.shopping-cart-item strong {
  font-size: 0.18rem;
  line-height: 1.33333333em;
}
.shopping-cart-item .info {
  width: 4.7rem;
  max-width: 80%;
}
.shopping-cart-item .figure {
  width: 1.2rem;
}
.shopping-cart-item .figure a {
  padding-bottom: 100%;
}
.shopping-cart-item .figure span {
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  color: #fff;
  text-align: center;
  font-size: 0.14rem;
  line-height: 1.85714286em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background-color: rgba(var(--rgba), 0.8);
}
.shopping-cart-item .meta {
  width: calc(100% - 1.54rem);
}
.shopping-cart-item .title {
  font-size: 0.18rem;
  line-height: 1.33333333em;
  max-height: 2.66666667em;
}
.shopping-cart-item .number,
.shopping-cart-item .time {
  line-height: 1.5em;
  margin-top: 0.5em;
}
.shopping-cart-item .cart-qty {
  max-width: 80%;
}
@media only screen and (max-width: 750px) {
  .shopping-cart-item {
    padding: 0.25rem 0;
  }
  .shopping-cart-item .col2 {
    width: 93.7%;
    padding-right: 0.5rem;
  }
  .shopping-cart-item .info {
    width: 100%;
    max-width: none;
    align-items: flex-start;
  }
  .shopping-cart-item .figure {
    width: 1.1rem;
  }
  .shopping-cart-item .meta {
    width: calc(100% - 1.3rem);
  }
  .shopping-cart-item .col6 {
    width: 0.2rem;
    position: absolute;
    right: 0;
    top: 0.3rem;
  }
  .shopping-cart-item .col3,
  .shopping-cart-item .col5 {
    width: 100%;
    padding-left: 34%;
    padding-right: 1.3rem;
    margin-top: 0.5em;
  }
  .shopping-cart-item .col3 i,
  .shopping-cart-item .col5 i {
    display: inline-block;
    font-size: 0.875em;
    color: #888;
  }
  .shopping-cart-item .col4 {
    position: absolute;
    right: 0;
    bottom: 0.3rem;
    width: 1.2rem;
  }
  .shopping-cart-item .cart-qty {
    width: 100%;
    max-width: none;
  }
}
/*shopping-cart-balance*/
#shopping-cart-balance {
  margin-top: 0.53rem;
  margin-left: 3.68055556%;
}
#shopping-cart-balance .total {
  margin-bottom: 0.07rem;
  width: 100%;
}
#shopping-cart-balance .total i {
  font-style: normal;
}
#shopping-cart-balance .warning {
  margin-bottom: 0.52rem;
}
#shopping-cart-balance .agree {
  gap: 0.28rem;
  width: 100%;
  margin-bottom: 0.32rem;
}
#shopping-cart-balance .agree label {
  display: block;
  max-width: calc(100% - 0.48rem);
}
#shopping-cart-balance .shopping-cart-checkbox {
  border-radius: 0;
}
@media only screen and (max-width: 750px) {
  #shopping-cart-balance {
    margin-top: 0.3rem;
    margin-left: 0;
  }
  #shopping-cart-balance .warning {
    margin-bottom: 0.25rem;
  }
  #shopping-cart-balance .agree {
    gap: 0.18rem;
  }
}
/*product-post-info*/
.product-post-info {
  width: 38.05555556%;
}
.product-post-info .title {
  font-size: 0.32rem;
  line-height: 1.25em;
  margin-bottom: 0.21rem;
}
.product-post-info .title i {
  font-size: 0.4375em;
  background-color: var(--main-color);
  color: #fff;
  height: 2.14285714em;
  display: inline-block;
  vertical-align: top;
  line-height: 2.14285714em;
  border-radius: 1.07142857em;
  padding: 0 1.07142857em;
  font-style: normal;
  margin-top: 0.21428571em;
}
.product-post-info .meta {
  border-bottom: 0.01rem solid var(--main-color);
  padding-bottom: 0.15rem;
  margin-top: 0.2rem;
}
.product-post-info .meta .share {
  width: 0.22rem;
  height: 0.22rem;
  background: url(../images/share_01.png) no-repeat center center;
  background-size: contain;
  cursor: pointer;
}
.product-post-info .name {
  margin-bottom: 0.1rem;
}
.product-post-info .size {
  margin-top: 0.2rem;
}
.product-post-info .size .box {
  background-color: #ffffff;
  box-shadow: 0px 0px 0.16rem 0px rgba(0, 5, 51, 0.09);
  position: relative;
  height: 100%;
  cursor: pointer;
}
.product-post-info .size .figure {
  width: 0.6rem;
border-radius: 0.1rem;
    overflow: hidden;
}
.product-post-info .size .figure:after {
  padding-bottom: 100%;
  display: block;
}
.product-post-info .size .text {
  width: calc(100% - 0.6rem);
  text-align: center;
  padding: 0 1em;
}
.product-post-info .size .disabled {
  filter: grayscale(100%);
}
.product-post-info .size .checked .box:after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border: 0.01rem solid var(--main-color);
  border-radius: inherit;
}
.product-post-info .date {
  background-color: #fff6ef;
  padding: 0.42857143em 1em;
  margin-top: 0.3rem;
}
.product-post-info .button {
  margin-top: 0.23rem;
}
.product-post-info .button .button-more {
  margin-top: 0;
  width: calc(100% - 0.7rem);
}
.product-post-info .button .heart {
  font-size: 0.16rem;
  width: 3.125em;
  height: 3.125em;
  border-radius: 50%;
  background: #f2f2f2 url(../images/heart_01@2x.png) no-repeat center center;
  background-size: 40% auto;
  cursor: pointer;
}
.product-post-info .button .heart.active {
  background-color: #fff6ef;
  background-image: url(../images/heart_02@2x.png);
}
.product-post-info .faqs {
  margin-top: 0.4rem;
}
.product-post-info .faqs .item {
  margin-bottom: 0.22rem;
}
.product-post-info .faqs .item:last-child {
  margin-bottom: 0;
}
.product-post-info .faqs .question {
  font-size: 0.18rem;
  line-height: 1.33333333em;
  border-bottom: 0.01rem solid #000;
  padding-bottom: 0.5em;
  position: relative;
  padding-right: 2em;
  cursor: pointer;
}
.product-post-info .faqs .question:after {
  width: 0.77777778em;
  height: 0.38888889em;
  background: url(../images/drop_arrow_01.svg) no-repeat center center;
  background-size: contain;
  content: '';
  display: block;
  position: absolute;
  right: 0;
  top: 0.66666667em;
  transform: rotate(180deg);
  transition: all 0.3s;
}
.product-post-info .faqs .asnwer {
  font-size: 0.14rem;
  line-height: 1.71428571em;
  color: #333;
  margin-top: 0.11rem;
  display: none;
}
.product-post-info .faqs .active .question:after {
  transform: rotate(0deg);
}
.product-post-info .button-more {
  margin-top: 0.2rem;
}
.product-post-info .button-more a {
  width: 100%;
}
.product-post-info .button-more a.disabled {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}
@media only screen and (max-width: 1024px) {
  .product-post-info {
    width: 45%;
  }
}
@media only screen and (max-width: 750px) {
  .product-post-info {
    width: 100%;
  }
  .product-post-info .size ul {
    --margin: 0;
    justify-content: space-between;
  }
  .product-post-info .size li {
    width: calc(50% - 0.1rem);
    margin-bottom: 0.2rem;
  }
  .product-post-info .button .heart {
    font-size: 0.14rem;
  }
}
/*product-post-gallery*/
.product-post-gallery {
  width: 57.77777778%;
}
.product-post-gallery .figure {
  padding-bottom: 100%;
}
.product-post-gallery .thumbs {
  width: 13.22115385%;
  position: relative;
}
.product-post-gallery .thumbs:before {
  display: block;
  content: '';
  padding-bottom: 636.36363636%;
}
.product-post-gallery .thumbs:after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  padding-bottom: 101.81818182%;
  background-image: linear-gradient(0deg, #fff, transparent 87%);
  z-index: 5;
  pointer-events: none;
}
.product-post-gallery .thumbs .swiper {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.product-post-gallery .thumbs .swiper-slide {
  cursor: pointer;
}
.product-post-gallery .current {
  width: 84.13461538%;
}
.product-post-gallery .current .preview {
  font-size: 0.16rem;
  color: #fff;
  height: 1.875em;
  line-height: 1.875em;
  border-radius: 0.9375em;
  background-color: rgba(0, 0, 0, 0.4);
  position: absolute;
  left: 4.85714286%;
  bottom: 4.85714286%;
  z-index: 5;
  padding: 0 1.34375em;
  cursor: pointer;
}
@media only screen and (max-width: 1024px) {
  .product-post-gallery {
    width: 50%;
  }
}
@media only screen and (max-width: 750px) {
  .product-post-gallery {
    width: 100%;
    margin-bottom: 0.3rem;
  }
}
/*product-post-reviews*/
.product-post-reviews {
  padding: 0.8rem 0 0.86rem;
}
.product-post-reviews .wrap {
  position: relative;
  padding: 0.56rem 0 0.6rem;
}
.product-post-reviews .wrap:before {
  content: '';
  display: block;
  position: absolute;
  left: 50%;
  top: 0;
  width: 100vw;
  transform: translateX(-50%);
  background-color: #f2f2f2;
  height: 100%;
}
.product-post-reviews .name {
  position: relative;
  z-index: 2;
  margin-bottom: 0.25rem;
}
.product-post-reviews .name span {
  font-size: 0.75em;
  font-weight: normal;
  margin-left: 0.55555556em;
}
.product-post-reviews .list .swiper-slide {
  width: 1.4rem;
  margin-right: 0.2rem;
}
.product-post-reviews .list .figure {
  padding-bottom: 100%;
}
.product-post-reviews .list .more {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(255, 255, 255, 0.42);
  backdrop-filter: blur(0.05rem);
  opacity: 0;
  transition: all 0.3s;
  color: #000;
}
.product-post-reviews .list a {
  display: block;
  overflow: hidden;
  position: relative;
}
.product-post-reviews .list a:hover .more {
  opacity: 1;
}
.product-post-reviews .list .arrow {
  border: none;
}
.product-post-reviews .list .arrow:hover {
  background-color: transparent;
}
.product-post-reviews .list .arrow:hover:after {
  filter: none;
}
@media only screen and (min-width: 1025px) {
  .product-post-reviews .list .prev {
    left: -0.5rem;
  }
  .product-post-reviews .list .next {
    right: -0.5rem;
  }
}
@media only screen and (max-width: 750px) {
  .product-post-reviews {
    padding: 0 0 0.35rem;
  }
  .product-post-reviews .wrap {
    padding: 0.35rem 0 0.4rem;
  }
  .product-post-reviews .name {
    margin-bottom: 0.15rem;
  }
  .product-post-reviews .list {
    --margin: 0.1rem;
  }
  .product-post-reviews .item {
    width: 33.333%;
  }
}
/*product-post*/
#product-post {
  padding: 0.55rem 0;
}
#product-post .cont {
  margin-bottom: 1.05rem;
}
#product-post .entry {
  margin-bottom: 1.15rem;
}
#product-post .sellers {
  padding-bottom: 0.4rem;
}
#product-post .sellers:last-child {
  padding-bottom: 0;
}
#product-post .module-name {
  margin-bottom: 0.703125em;
}
@media only screen and (max-width: 750px) {
  #product-post {
    padding: 0.2rem 0;
  }
  #product-post .cont,
  #product-post .entry {
    margin-bottom: 0.7rem;
  }
  #product-post .sellers {
    padding-bottom: 0.2rem;
  }
  #product-post .module-name {
    font-size: 0.36rem;
  }
}
/*review-order*/
.review-order {
  width: 3.125em;
}
.review-order .button {
  display: block;
  padding-bottom: 100%;
  border-radius: 50%;
  background-color: #fff;
  cursor: pointer;
}
.review-order .button:after {
  width: 36%;
  padding-bottom: 36%;
  background: url(../images/order_01.svg) no-repeat center center;
  background-size: contain;
  content: '';
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.review-order .drop {
  padding-top: 0.17rem;
  width: 3.3rem;
}
.review-order.active .button {
  background-color: var(--main-color);
}
.review-order.active .button:after {
  filter: invert(1) brightness(100);
}
@media only screen and (max-width: 750px) {
  .review-order {
    font-size: 0.14rem;
  }
  .review-order .drop {
    width: 2.4rem;
  }
}
/*review-back*/
.review-back {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-weight: bold;
}
.review-back a {
  background: url(../images/back_02.png) no-repeat left center;
  background-size: 1.1875em auto;
  padding-left: 1.875em;
  display: block;
}
/*review-bar*/
#review-bar {
  gap: 0.2rem;
  position: relative;
  margin-bottom: 0.3rem;
  z-index: 5;
}
@media only screen and (max-width: 750px) {
  #review-bar {
    gap: 0.1rem;
  }
  #review-bar .button-more a {
    width: 13.25em;
  }
}
/*review-rating*/
.review-rating {
  display: flex;
  gap: 0.4445em;
  font-size: 0.16rem;
}
.review-rating i {
  display: block;
  width: 1.5em;
  height: 1.4375em;
  background: url(../images/rating.svg) no-repeat center center;
  background-size: contain;
}
@media only screen and (max-width: 750px) {
  .review-rating {
    font-size: 0.12rem;
    gap: 0.3em;
  }
}
/*review-item*/
.review-item {
  background-color: #fff;
  padding: 0.3rem;
  overflow: hidden;
  margin-bottom: 0.2rem;
}
.review-item .avatar {
  width: 0.6rem;
  border-radius: 50%;
}
.review-item .avatar:after {
  display: block;
  padding-bottom: 100%;
}
.review-item .text {
  width: calc(100% - 0.8rem);
}
.review-item .meta {
  margin-bottom: 0.3rem;
}
.review-item .meta .name {
  font-size: 0.24rem;
  line-height: 1.25em;
}
.review-item .meta .date {
  font-size: 0.18rem;
  color: #888;
  line-height: 1.35em;
}
.review-item .meta .review-rating {
  margin: 0.03rem 0;
}
.review-item .intro {
  font-size: 0.18rem;
  line-height: 1.66666667em;
  background-color: #f3f3f3;
  padding: 1.27777778em 1.66666667em;
}
.review-item .media {
  gap: 0.14rem;
  margin-top: 0.3rem;
}
.review-item .media .figure {
  width: 1.2rem;
  cursor: pointer;
}
.review-item .media .figure:after {
  padding-bottom: 100%;
  display: block;
}
.review-item .media .video:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.2);
  z-index: 2;
}
.review-item .media .play {
  width: 20%;
  background: url(../images/play_01.svg) no-repeat center center;
  background-size: contain;
  cursor: pointer;
  position: absolute;
  left: 10%;
  bottom: 10%;
  filter: invert(1) brightness(100);
  z-index: 3;
  opacity: 0.9;
}
.review-item .media .play:after {
  padding-bottom: 100%;
  display: block;
  content: '';
}
@media only screen and (max-width: 750px) {
  .review-item {
    padding: 0.2rem;
  }
  .review-item .avatar {
    width: 0.5rem;
  }
  .review-item .text {
    width: calc(100% - 0.65rem);
  }
  .review-item .meta {
    margin-bottom: 0.2rem;
  }
  .review-item .meta .name {
    font-size: 0.2rem;
  }
  .review-item .meta .date {
    font-size: 0.16rem;
  }
  .review-item .intro {
    font-size: 0.16rem;
    padding: 1em 1.25em;
  }
  .review-item .media {
    gap: 0.1rem;
    margin-top: 0.2rem;
  }
  .review-item .media .figure {
    width: 0.833rem;
  }
}
/*review-list*/
#review-list {
  margin-bottom: 0.35rem;
}
#review-list .empty {
  background-color: #fff;
  padding: 0.8rem 0.8rem 0.73rem;
}
@media only screen and (max-width: 750px) {
  #review-list {
    margin-bottom: 0.25rem;
  }
  #review-list #empty {
    padding: 0.5rem 0.5rem 0.45rem;
  }
}
/*review-popup*/
.review-popup {
  display: block;
}
.review-popup .box {
  background-color: #fff;
  width: 7.93rem;
  max-width: 90%;
  padding: 0.58rem 0.77rem 0.57rem 0.5rem;
}
.review-popup .title {
  margin-bottom: 0.46rem;
}
.review-popup .item {
  margin-bottom: 0.35rem;
}
.review-popup .label {
  font-weight: bold;
  display: block;
  margin-bottom: 0.15rem;
}
.review-popup .text {
  width: 100%;
  display: block;
  background-color: #f7f7f7;
  line-height: 1.5em;
  padding: 0.625em 1.625em;
  height: 7.5em;
  resize: vertical;
}
.review-popup .review-rating {
  gap: 0.75em;
  --num: -n 2;
}
.review-popup .review-rating i {
  background-image: url(../images/rating_02.svg);
  width: 2.3125em;
  height: 2.1875em;
  cursor: pointer;
}
.review-popup .review-rating[data-rating="1"] i:nth-child(1) {
  background-image: url(../images/rating.svg);
}
.review-popup .review-rating[data-rating="2"] i:nth-child(-n+2) {
  background-image: url(../images/rating.svg);
}
.review-popup .review-rating[data-rating="3"] i:nth-child(-n+3) {
  background-image: url(../images/rating.svg);
}
.review-popup .review-rating[data-rating="4"] i:nth-child(-n+4) {
  background-image: url(../images/rating.svg);
}
.review-popup .review-rating[data-rating="5"] i:nth-child(-n+5) {
  background-image: url(../images/rating.svg);
}
.review-popup .media {
  overflow: hidden;
}
.review-popup .media ul {
  gap: 3.303%;
}
.review-popup .media li {
  width: 22.52252252%;
margin-bottom: .13rem;
}
.review-popup .media .upload {
  position: relative;
  height: 100%;
  border: solid 0.01rem #c7c7c7;
  background-color: #f7f7f7;
  cursor: pointer;
}
.review-popup .media .upload:after {
  display: block;
  padding-bottom: 100%;
  content: '';
}
.review-popup .media .upload:before {
  width: 13.51351351%;
  padding-bottom: 13.51351351%;
  background: url(../images/upload_01.svg) no-repeat center center;
  background-size: contain;
  content: '';
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.review-popup .media .upload.done:before {
  width: auto;
  padding-bottom: 0;
  background: none;
  content: 'Uploaded';
  font-size: 0.14rem;
  color: var(--main-color);
  white-space: nowrap;
}
.review-popup .media .figure {
  padding-bottom: 100%;
  border-bottom-right-radius: 0;
}
.review-popup .media .delete {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 20%;
  padding-bottom: 20%;
  background: rgba(0, 0, 0, 0.8) url(../images/delete_02.png) no-repeat center center;
  background-size: 53.33333333% auto;
  cursor: pointer;
}
.review-popup .media input[type="file"] {
  display: none;
}
@media only screen and (max-width: 750px) {
  .review-popup .box {
    padding: 0.35rem 0.45rem 0.4rem 0.3rem;
  }
  .review-popup .title {
    margin-bottom: 0.25rem;
  }
  .review-popup .item {
    margin-bottom: 0.25rem;
  }
}
/*ucenter*/
#ucenter {
  padding: 0.18rem 0 0.95rem;
}
#ucenter .mb10 {
  margin-bottom: 0.1rem;
}
#ucenter .mb20 {
  margin-bottom: 0.2rem;
}
@media only screen and (max-width: 750px) {
  #ucenter {
    padding-bottom: 0.6rem;
  }
}
/*ucenter-aside*/
#ucenter-aside {
  width: 3.45rem;
  position: relative;
  z-index: 6;
}
@media only screen and (max-width: 1024px) {
  #ucenter-aside {
    width: 100%;
    margin-bottom: 0.1rem;
  }
}
/*ucenter-empty*/
.ucenter-empty {
  background-color: #fff;
  min-height: 8.52rem;
}
@media only screen and (max-width: 750px) {
  .ucenter-empty {
    min-height: 0;
    padding: 1rem 0;
  }
}
/*ucenter-personal*/
#ucenter-personal {
  padding: 0.4rem 0.2rem 0.2rem;
}
#ucenter-personal .top {
  margin-bottom: 0.13rem;
}
#ucenter-personal .avatar {
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
  margin: 0 auto 0.04rem;
  background-color: #f2f1f1;
  padding: 0.05rem;
}
#ucenter-personal .avatar img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
#ucenter-personal .meta ul {
  gap: 1.63934426%;
}
#ucenter-personal .meta li {
  width: 49.18032787%;
  line-height: 1.5em;
}
#ucenter-personal .meta .icon {
  display: block;
  width: 1.4375em;
  height: 1.5em;
  object-fit: contain;
  margin: 0 auto 0.5em;
}
#ucenter-personal .meta .value {
  font-size: 1.25em;
  line-height: 1.35em;
}
#ucenter-personal .meta a {
  display: block;
  overflow: hidden;
  background-color: #f7f7f7;
  position: relative;
  height: 100%;
  padding: 1.25em 1em 1em;
}
@media only screen and (max-width: 1024px) {
  #ucenter-personal {
    display: flex;
    justify-content: space-between;
    padding: 0.3rem;
    align-items: center;
  }
  #ucenter-personal .top {
    margin-bottom: 0;
  }
  #ucenter-personal .meta li {
    width: 1.5rem;
  }
}
@media only screen and (max-width: 750px) {
  #ucenter-personal {
    padding: 0.2rem;
  }
  #ucenter-personal .top {
    max-width: calc(100% - 2.7rem);
  }
  #ucenter-personal .name {
    font-size: 0.2rem;
  }
  #ucenter-personal .meta {
    font-size: 0.14rem;
  }
  #ucenter-personal .meta li {
    width: 1.3rem;
  }
}
/*ucenter-menu*/
#ucenter-menu .menu {
  display: none;
}
#ucenter-menu li {
  border-top: 0.01rem solid #f7f5f2;
  padding: 1.22222222em 0.3rem;
  line-height: 2em;
}
#ucenter-menu li:first-child {
  border-bottom: none;
}
#ucenter-menu .icon {
  width: 1.33333333em;
  height: 1.44444444em;
  display: block;
  object-fit: contain;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  filter: invert(1) brightness(0);
}
#ucenter-menu a {
  position: relative;
  display: block;
  overflow: hidden;
  padding: 0 1em 0 2.22222222em;
}
#ucenter-menu a:after {
  width: 0.33333333em;
  height: 0.55555556em;
  right: 0;
  content: '';
  display: block;
  position: absolute;
  background: url(../images/ucenter_menu_arrow_01.svg) no-repeat center center;
  background-size: contain;
  top: 50%;
  transform: translateY(-50%);
  filter: invert(1) brightness(0);
}
#ucenter-menu .current .icon {
  filter: none;
}
#ucenter-menu .current a {
  color: var(--main-color);
}
#ucenter-menu .current a:after {
  filter: none;
}
@media only screen and (min-width: 751px) and (max-width: 1024px) {
  #ucenter-menu ul {
    display: flex;
    flex-wrap: wrap;
  }
  #ucenter-menu li {
    width: 25%;
  }
  #ucenter-menu li:nth-child(-n+4) {
    border-top: none;
  }
  #ucenter-menu li:not(:nth-child(4n)) {
    padding-right: 0;
  }
  #ucenter-menu a {
    padding-left: 1.9em;
  }
}
@media only screen and (max-width: 750px) {
  #ucenter-menu {
    font-size: 0.16rem;
  }
  #ucenter-menu .menu {
    font-style: normal;
    padding: 0.1rem 0.2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
  }
  #ucenter-menu .menu:after {
    width: 1.25em;
    height: 1.25em;
    background: url(../images/menu.svg) no-repeat center center;
    background-size: contain;
    display: block;
    content: '';
  }
  #ucenter-menu ul {
    position: absolute;
    left: 0;
    top: calc(100% + 0.1rem);
    width: 100%;
    background-color: #fff;
    z-index: 6;
    display: none;
    box-shadow: 0 0.05rem 0.15rem rgba(0, 0, 0, 0.1);
  }
  #ucenter-menu.active ul {
    display: block;
  }
}
/*ucenter-main*/
#ucenter-main {
  width: calc(100% - 3.65rem);
}
@media only screen and (max-width: 1024px) {
  #ucenter-main {
    width: 100%;
  }
}
/*ucenter-main-bar*/
.ucenter-main-bar {
  padding: 0.27rem 0.3rem;
}
@media only screen and (max-width: 750px) {
  .ucenter-main-bar {
    padding: 0.2rem 0.2rem;
  }
}
/*ucenter-name*/
@media only screen and (max-width: 750px) {
  .ucenter-name {
    font-size: 0.26rem;
  }
}
/*ucenter-search*/
.ucenter-search .input {
  position: relative;
  padding-left: 2.25em;
}
.ucenter-search .text {
  color: #666;
  height: 2.25em;
  line-height: 1.5em;
  padding: 0.375em 0;
}
.ucenter-search .submit {
  width: 2.25em;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: url(../images/search_01.svg) no-repeat center center;
  background-size: 44.44444444% auto;
  cursor: pointer;
}
/*ucenter-return*/
.ucenter-return a {
  display: block;
  padding-left: 1.94444444em;
  background: url(../images/back_02.png) no-repeat left center;
  background-size: 1.22222222em auto;
}
/*ucenter-intro*/
@media only screen and (max-width: 750px) {
  .ucenter-intro {
    font-size: 0.16rem;
  }
}
/*ucenter-order-menu*/
.ucenter-order-menu {
  font-size: 0.18rem;
  line-height: 0.3rem;
  font-weight: bold;
  margin-top: 0.4rem;
  overflow-x: auto;
  overflow-y: hidden;
  margin-bottom: -0.27rem;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.ucenter-order-menu::-webkit-scrollbar {
  display: none;
}
.ucenter-order-menu ul {
  gap: 0.36rem;
  width: max-content;
}
.ucenter-order-menu li {
  position: relative;
  padding-bottom: 0.2rem;
}
.ucenter-order-menu li:after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  width: 100%;
  background-color: var(--main-color);
  height: 0.04rem;
  bottom: 0;
  opacity: 0;
}
.ucenter-order-menu a {
  display: block;
  white-space: nowrap;
}
.ucenter-order-menu a:not(:hover) {
  color: #888;
}
.ucenter-order-menu .current {
  font-size: 1.33333333em;
}
.ucenter-order-menu .current:after {
  opacity: 1;
}
.ucenter-order-menu .current a {
  color: #000;
}
@media only screen and (max-width: 750px) {
  .ucenter-order-menu {
    margin-top: 0.2rem;
    font-size: 0.16rem;
    margin-bottom: -0.2rem;
  }
  .ucenter-order-menu ul {
    gap: 0.19rem;
  }
  .ucenter-order-menu li {
    padding-bottom: 0.15rem;
  }
}
/*ucenter-order-item*/
.ucenter-order-item .bar {
  border-bottom: 0.01rem solid #f2f1f1;
  padding: 0.1rem 0.3rem;
  color: #888;
  line-height: 2.5em;
}
.ucenter-order-item .bar .time {
  gap: 0.4rem;
}
.ucenter-order-item .bar .time span {
  display: block;
}
.ucenter-order-item .bar .time .delete {
  padding-left: 1.875em;
  background: url(../images/delete_03.png) no-repeat left center;
  background-size: 1.25em auto;
  cursor: pointer;
}
.ucenter-order-item .bar .number {
  gap: 0.2rem;
  font-weight: 500;
  font-size: 0.16rem;
}
.ucenter-order-item .bar .status {
  background-color: var(--main-color);
  font-weight: bold;
  height: 2.5em;
  display: flex;
  align-items: center;
  border-radius: 1.25em;
  padding: 0 0.9375em;
  color: #000;
}
.ucenter-order-item .bar .cancel {
  background-color: #f3f3f3;
  color: #888888;
}
.ucenter-order-item .btm {
  padding: 0.2rem 0.3rem;
}
.ucenter-order-item .button-more {
  gap: 0.2rem;
}
.ucenter-order-item .list {
  padding: 0 0.3rem;
}
.ucenter-order-item .list .item {
  padding: 0.2rem 0;
  border-bottom: 0.01rem solid #f2f1f1;
}
.ucenter-order-item .list .figure {
  width: 1.18rem;
}
.ucenter-order-item .list .figure a {
  padding-bottom: 100%;
}
.ucenter-order-item .list .text {
  width: calc(100% - 1.45rem);
}
.ucenter-order-item .list .title {
  font-size: 0.18rem;
  line-height: 1.33333333em;
  max-height: 2.66666667em;
}
.ucenter-order-item .list .title a {
  display: block;
}
.ucenter-order-item .list .meta {
  margin-top: 0.05rem;
  line-height: 1.875em;
}
@media only screen and (max-width: 750px) {
  .ucenter-order-item .bar {
    line-height: 1.875em;
    padding: 0.2rem;
  }
  .ucenter-order-item .bar .number {
    width: 100%;
  }
  .ucenter-order-item .bar .time {
    width: 100%;
    justify-content: space-between;
    gap: 0;
  }
  .ucenter-order-item .bar .time span {
    margin-top: 0.1rem;
  }
  .ucenter-order-item .bar .time .delete {
    padding-left: 1.5em;
  }
  .ucenter-order-item .bar .pay {
    height: 1.875em;
  }
  .ucenter-order-item .btm {
    padding: 0.2rem;
  }
  .ucenter-order-item .button-more {
    width: 100%;
    margin-top: 0.2rem;
    gap: 0.13rem;
  }
  .ucenter-order-item .list {
    padding: 0 0.2rem;
  }
  .ucenter-order-item .list .text {
    width: calc(100% - 1.35rem);
  }
}
/*ucenter-order-list*/
#ucenter-order-list {
  margin-bottom: 0.55rem;
}
@media only screen and (max-width: 750px) {
  #ucenter-order-list {
    margin-bottom: 0.35rem;
  }
}
/*ucenter-collection-list*/
#ucenter-collection-list {
  margin-bottom: 0.45rem;
  overflow: hidden;
}
#ucenter-collection-list .item {
  margin-bottom: 0.1rem;
}
@media only screen and (max-width: 1024px) {
  #ucenter-collection-list .item {
    width: 33.333%;
  }
}
@media only screen and (max-width: 750px) {
  #ucenter-collection-list {
    margin-bottom: 0.2rem;
  }
  #ucenter-collection-list .item {
    width: 50%;
  }
}
/*ucenter-points*/
.ucenter-points {
  gap: 0.4rem;
}
.ucenter-points .available {
  gap: 0.1rem;
}
.ucenter-points .available span {
  display: block;
  font-size: 2em;
  color: var(--main-color);
}
@media only screen and (max-width: 750px) {
  .ucenter-points {
    margin-top: 0.2rem;
    display: block;
    width: 100%;
  }
  .ucenter-points .available {
    justify-content: space-between;
  }
  .ucenter-points .button-more {
    margin-top: 0.15rem;
  }
  .ucenter-points .button-more a {
    width: 100%;
  }
}
/*ucenter-points-signin*/
#ucenter-points-signin {
  background-color: var(--main-color);
  padding: 0.25rem 0.3rem 0.36rem;
}
#ucenter-points-signin .bar {
  margin-bottom: 0.27rem;
}
#ucenter-points-signin .name {
  font-size: 0.24rem;
  line-height: 1.35em;
  background: url(../images/ucenter_signin_icon.png) no-repeat left center;
  background-size: 1.125em auto;
  padding-left: 1.79166667em;
}
#ucenter-points-signin .record {
  background-color: #fff;
  padding: 0.3rem 0.3rem 0.28rem;
}
#ucenter-points-signin .record ul {
  gap: 1.9895288%;
}
#ucenter-points-signin .record li {
  width: 12.56544503%;
  cursor: pointer;
}
#ucenter-points-signin .record .point {
  font-size: 1.25em;
  background-color: #f7f7f7;
  height: 3em;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.65em;
}
#ucenter-points-signin .record .signed {
  color: #000;
}
#ucenter-points-signin .record .signed .point {
  background-color: #fff3eb;
  border: 0.01rem solid var(--main-color);
  color: var(--main-color);
}
#ucenter-points-signin .record .signing {
  color: var(--main-color);
}
#ucenter-points-signin .record .signing .point {
  background-color: var(--main-color);
  color: #fff;
}
@media only screen and (max-width: 750px) {
  #ucenter-points-signin {
    padding: 0.2rem 0.2rem 0.25rem;
  }
  #ucenter-points-signin .bar {
    flex-direction: column;
    gap: 0.06rem;
    align-items: flex-start;
    margin-bottom: 0.2rem;
  }
  #ucenter-points-signin .bar .days {
    padding-left: 0.43rem;
  }
  #ucenter-points-signin .record {
    padding: 0.15rem 0.15rem 0.1rem;
  }
  #ucenter-points-signin .record ul {
    font-size: 0.14rem;
  }
  #ucenter-points-signin .record .point {
    margin-bottom: 0.25em;
  }
}
/*ucenter-faqs-item*/
.ucenter-faqs-item {
  border-bottom: 0.01rem solid #f7f7f7;
  padding: 0.32rem 0 0.38rem;
}
.ucenter-faqs-item:last-child {
  border-bottom: none;
}
.ucenter-faqs-item .question {
  font-size: 0.2rem;
  line-height: 1.35em;
}
.ucenter-faqs-item .answer {
  font-size: 0.18rem;
  line-height: 1.33333333em;
  color: #888;
  margin-top: 0.16rem;
}
@media only screen and (max-width: 750px) {
  .ucenter-faqs-item {
    padding: 0.25rem 0 0.27rem;
  }
}
/*ucenter-points-faqs*/
#ucenter-points-faqs {
  padding: 0 0.36rem;
  margin-bottom: 0.48rem;
}
@media only screen and (max-width: 750px) {
  #ucenter-points-faqs {
    padding: 0 0.26rem;
    margin-bottom: 0.35rem;
  }
}
/*ucenter-related*/
.ucenter-related {
  overflow: hidden;
}
.ucenter-related .name {
  margin-bottom: 0.9em;
}
.ucenter-related .figure {
  padding-bottom: 100%;
}
.ucenter-related .title {
  line-height: 1.55555556em;
  max-height: 4.66666667em;
  margin-top: 1.11111111em;
}
.ucenter-related .info {
  display: block;
  overflow: hidden;
}
@media only screen and (max-width: 1024px) {
  .ucenter-related .item {
    width: 25%;
  }
}
@media only screen and (max-width: 750px) {
  .ucenter-related .name {
    font-size: 0.26rem;
  }
  .ucenter-related .item {
    width: 50%;
  }
  .ucenter-related .title {
    font-size: 0.16rem;
  }
}
/*ucenter-stash-info*/
#ucenter-stash-info {
  padding: 0.32rem 0.3rem;
}
#ucenter-stash-info .data {
  line-height: 1.35em;
}
#ucenter-stash-info .data ul {
  gap: 0.2rem;
}
#ucenter-stash-info .data strong {
  font-size: 0.3rem;
  line-height: 1.125em;
  color: #000;
}
#ucenter-stash-info .button-more {
  gap: 0.2rem;
  max-width: 100%;
}
@media only screen and (max-width: 750px) {
  #ucenter-stash-info {
    display: block;
    padding: 0.2rem;
  }
  #ucenter-stash-info .button-more {
    margin-top: 0.15rem;
    gap: 0.1rem;
  }
}
/*ucenter-select*/
.ucenter-select {
  display: flex;
  align-items: center;
  gap: 0.12rem;
  cursor: pointer;
}
.ucenter-select .checkbox {
  width: 0.16rem;
  height: 0.16rem;
  border: solid 0.01rem #cccccc;
  display: block;
  cursor: pointer;
}
.ucenter-select .checked {
  background: #000 url(../images/checked_01.png) no-repeat center center;
  background-size: 78.57142857% auto;
  border-color: transparent;
}
.ucenter-select .checked + span {
  color: #000;
}
/*ucenter-stash-bar*/
.ucenter-stash-bar {
  margin-bottom: 0.23rem;
}
.ucenter-stash-bar .name {
  margin-right: 1em;
}
.ucenter-stash-bar .status {
  background-color: var(--main-color);
  color: #000;
  height: 2.5em;
  display: flex;
  align-items: center;
  border-radius: 1.25em;
  padding: 0 0.75em;
  font-weight: bold;
}
@media only screen and (max-width: 750px) {
  .ucenter-stash-bar {
    margin-bottom: 0.2rem;
  }
  .ucenter-stash-bar .name {
    margin-right: 0.15rem;
  }
  .ucenter-stash-bar .status {
    font-size: 0.14rem;
  }
}
/*ucenter-stash-item*/
.ucenter-stash-item {
  width: calc(50% - 0.075rem);
}
.ucenter-stash-item .bar {
  background-color: #f7f7f7;
  padding: 0.13rem 0.22rem;
}
.ucenter-stash-item .status {
  color: #00b330;
}
.ucenter-stash-item .info {
  border: solid 0.01rem #e5e5e5;
  overflow: hidden;
}
.ucenter-stash-item .btm {
  padding: 0.2rem;
}
.ucenter-stash-item .figure {
  width: 1.2rem;
}
.ucenter-stash-item .figure a {
  padding-bottom: 100%;
}
.ucenter-stash-item .text {
  width: calc(100% - 1.48rem);
}
.ucenter-stash-item .title {
  font-size: 0.16rem;
  line-height: 1.33333333em;
  max-height: 2.66666667em;
}
.ucenter-stash-item .title a {
  display: block;
}
.ucenter-stash-item .meta {
  margin-top: 0.07rem;
  line-height: 1.875em;
}
.ucenter-stash-item .disabled .ucenter-select {
  opacity: 0.2;
  cursor: default;
}
.ucenter-stash-item .disabled .checkbox {
  cursor: default;
}
.ucenter-stash-item .disabled .status {
  color: #888888;
}
@media only screen and (max-width: 750px) {
  .ucenter-stash-item {
    width: 100%;
  }
  .ucenter-stash-item .bar {
    padding: 0.1rem 0.15rem;
  }
  .ucenter-stash-item .btm {
    padding: 0.15rem;
  }
  .ucenter-stash-item .text {
    width: calc(100% - 1.35rem);
  }
}
/*ucenter-stash-list*/
.ucenter-stash-list {
  gap: 0.15rem;
}
/*ucenter-stash-box*/
.ucenter-stash-box {
  padding: 0.2rem 0.3rem 0.37rem;
}
@media only screen and (max-width: 750px) {
  .ucenter-stash-box {
    padding: 0.2rem 0.2rem 0.25rem;
  }
}
/*ucenter-share*/
#ucenter-share {
  background: url(../images/ucenter_share_bg.jpg) no-repeat center center;
  background-size: cover;
  padding: 0.38rem 0.4rem 0.6rem;
}
#ucenter-share .intro {
  line-height: 1.55555556em;
  max-width: 45.83333333em;
  margin-top: 0.66666667em;
}
#ucenter-share .input {
  position: relative;
  margin-top: 0.3rem;
}
#ucenter-share .text {
  background-color: rgba(255, 255, 255, 0.4);
  font-size: 0.18rem;
  height: 3.33333333em;
  border-radius: inherit;
  line-height: 2em;
  padding: 0.66666667em 2.85rem 0.66666667em 1.16666667em;
  display: block;
  width: 100%;
  color: #fff;
  border-radius: 1.66666667em;
}
#ucenter-share .button-submit {
  position: absolute;
  right: 0.05rem;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.625em;
}
#ucenter-share .button-submit:before {
  display: block;
  content: '';
  width: 0.875em;
  height: 0.875em;
  background: url(../images/ucenter_share_04.png) no-repeat center center;
  background-size: contain;
}
#ucenter-share .tips {
  font-size: 0.18rem;
  line-height: 1.55555556em;
  margin-top: 0.12rem;
}
#ucenter-share .tips span {
  display: block;
  padding-left: 1.66666667em;
  background: no-repeat left center;
  background-size: auto 1.11111111em;
  margin-right: 0.6rem;
}
#ucenter-share .tips span:last-child {
  margin-right: 0;
}
#ucenter-share .tips .get {
  background-image: url(../images/ucenter_share_01.png);
}
#ucenter-share .tips .off {
  background-image: url(../images/ucenter_share_02.png);
}
#ucenter-share .tips .far {
  background-image: url(../images/ucenter_share_03.png);
}
@media only screen and (max-width: 750px) {
  #ucenter-share {
    padding: 0.25rem 0.3rem 0.45rem;
  }
  #ucenter-share .title {
    font-size: 0.26rem;
  }
  #ucenter-share .intro {
    font-size: 0.16rem;
  }
  #ucenter-share .input {
    margin-top: 0.2rem;
  }
  #ucenter-share .text {
    padding-left: 1.25em;
    padding-right: 1.25em;
  }
  #ucenter-share .button-submit {
    width: 100%;
    position: relative;
    transform: none;
    right: auto;
    top: auto;
    margin-top: 0.1rem;
  }
  #ucenter-share .tips {
    gap: 0.1rem;
  }
  #ucenter-share .tips span {
    margin-right: 0;
    width: 100%;
  }
}
/*ucenter_wallet_box*/
.ucenter_box_hgroup .name {
  font-size: 0.2rem;
  line-height: 1.25em;
  background: no-repeat left center;
  background-size: auto 1.2em;
  padding-left: 1.85em;
}
.ucenter_box_hgroup .intro {
  margin-top: 0.07rem;
  font-size: 0.18rem;
  color: #888;
}
/*ucenter_wallet_box*/
.ucenter_wallet_box {
  background-color: #fff;
  overflow: hidden;
  padding: 0.42rem 0.3rem 0.28rem;
}
.ucenter_wallet_box .bar {
  margin-bottom: 0.35rem;
  gap: 0.3rem;
}
.ucenter_wallet_box .tab span {
  display: block;
  margin-right: 0.35rem;
  position: relative;
  cursor: pointer;
}
.ucenter_wallet_box .tab span:before {
  background-color: var(--main-color);
  content: '';
  display: block;
  position: absolute;
  left: 0;
  width: 100%;
  height: 0.03rem;
  top: -0.12rem;
  opacity: 0;
}
.ucenter_wallet_box .tab span:last-child {
  margin-right: 0;
}
.ucenter_wallet_box .tab .current {
  color: #000;
}
.ucenter_wallet_box .tab .current:before {
  opacity: 1;
}
.ucenter_wallet_box .list {
  --margin: 0.15rem;
}
.ucenter_wallet_box .list .card {
  background-color: #f7f7f7;
  padding: 0.3rem 0.4rem 0.34rem;
  position: relative;
  height: 100%;
}
.ucenter_wallet_box .list .meta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: calc(100% - 1.45rem);
}
.ucenter_wallet_box .list .tag {
  background-color: var(--main-color);
  font-weight: bold;
  font-size: 0.16rem;
  height: 2.5em;
  border-radius: 1.25em;
  display: flex;
  align-items: center;
  padding: 0 1.125em;
  margin-bottom: 0.12rem;
}
.ucenter_wallet_box .list .off {
  font-size: 0.2rem;
  line-height: 1.35em;
  margin-bottom: 0.5em;
}
.ucenter_wallet_box .list .min {
  font-size: 0.3rem;
  line-height: 1.125em;
  font-weight: bold;
  color: var(--main-color);
}
.ucenter_wallet_box .list .min span {
  font-size: 1.33333333em;
}
.ucenter_wallet_box .list .intro {
  font-size: 0.18rem;
  line-height: 1.33333333em;
  color: #888;
}
.ucenter_wallet_box .empty {
  padding: 1.2rem 0 1.5rem;
}
@media only screen and (max-width: 750px) {
  .ucenter_wallet_box {
    padding: 0.3rem 0.25rem 0.2rem;
  }
  .ucenter_wallet_box .bar {
    margin-bottom: 0.2rem;
  }
  .ucenter_wallet_box .list .card {
    padding: 0.25rem;
  }
  .ucenter_wallet_box .empty {
    padding: 0.8rem 0 1rem;
  }
}
/*ucenter_wallet_items*/
.ucenter_wallet_items .card .top {
  margin-bottom: 0.15rem;
}
.ucenter_wallet_items .card .icon {
  width: 8.5625em;
}
.ucenter_wallet_items .card .icon i {
  display: block;
  overflow: hidden;
  padding-bottom: 100%;
  background: no-repeat center center;
  background-size: contain;
}
.ucenter_wallet_items .card .icon .xray {
  background-image: url(../images/ucenter_wallet_items_xray.png);
}
.ucenter_wallet_items .card .icon .hint {
  background-image: url(../images/ucenter_wallet_items_hint.png);
}
/*ucenter_wallet_coupons*/
.ucenter_wallet_coupons .card .top {
  border-bottom: 0.01rem dashed rgba(0, 0, 0, 0.2);
  padding-bottom: 0.2rem;
  margin-bottom: 0.2rem;
}
/*ucenter_profile_box*/
.ucenter_profile_box {
  overflow: hidden;
  padding: 0.4rem 0.3rem 0.42rem;
}
.ucenter_profile_box .bar {
  gap: 0.2rem;
}
@media only screen and (max-width: 750px) {
  .ucenter_profile_box {
    padding: 0.3rem 0.25rem;
  }
}
/*ucenter_profile_picture*/
.ucenter_profile_picture .info {
  margin-top: 0.05rem;
}
.ucenter_profile_picture .avatar {
  width: 2.24rem;
  max-width: 80%;
  position: relative;
}
.ucenter_profile_picture .figure {
  padding-bottom: 100%;
  border-radius: 50%;
}
.ucenter_profile_picture .warning {
  margin-top: 0.13rem;
}
.ucenter_profile_picture .camera {
  position: absolute;
  right: 0;
  bottom: 4.46428571%;
  width: 26.78571429%;
  background-color: #f7f7f7;
  padding: 2.23214286%;
  border-radius: 50%;
  cursor: pointer;
}
.ucenter_profile_picture .camera:after {
  display: block;
  content: '';
  padding-bottom: 100%;
  background: #000 url(../images/camera_01.png) no-repeat center center;
  background-size: 54% auto;
  border-radius: 50%;
}
.ucenter_profile_picture input[type="file"] {
  display: none;
}
@media only screen and (max-width: 750px) {
  .ucenter_profile_picture .avatar {
    width: 1.5rem;
    margin-top: 0.3rem;
  }
}
/*ucenter_form*/
.ucenter_form .group {
  margin-bottom: 0.22rem;
}
.ucenter_form .label {
  display: block;
  font-weight: bold;
  font-size: 0.18rem;
  line-height: 1.77777778em;
  margin-bottom: 0.55555556em;
}
.ucenter_form .text,
.ucenter_form select {
  font-size: 0.18rem;
  border: solid 0.01rem #e5e5e5;
  display: block;
  width: 100%;
  height: 3.33333333em;
  line-height: 2em;
  padding: 0.66666667em 1.11111111em;
  font-weight: 500;
}
.ucenter_form select {
  line-height: 3.33333333em;
  padding-top: 0;
  padding-bottom: 0;
  appearance: none;
  -webkit-appearance: none;
}
.ucenter_form select::-ms-expand {
  display: none;
}
.ucenter_form .warning {
  margin-top: 0.05rem;
}
.ucenter_form .select {
  position: relative;
}
.ucenter_form .select:after {
  width: 0.55555556em;
  height: 0.33333333em;
  background: url(../images/drop_arrow_01.svg) no-repeat center center;
  background-size: contain;
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 1.11111111em;
}
.ucenter_form .cols {
  gap: 0.12rem;
  display: flex;
  flex-wrap: wrap;
}
.ucenter_form .cols .select {
  flex: 1;
}
.ucenter_form .button {
  gap: 0.2rem;
  margin-top: 0.12rem;
}
@media only screen and (max-width: 750px) {
  .ucenter_form .cols {
    flex-direction: column;
  }
  .ucenter_form .button {
    gap: 0.1rem;
    margin-top: 0;
  }
}
/*ucenter-addr-item*/
.ucenter-addr-item {
  background-color: #f7f7f7;
  border-color: transparent;
  padding: 0.22rem 0.2rem 0.22rem 0.28rem;
  position: relative;
  overflow: hidden;
  border: 0.02rem solid transparent;
  margin-bottom: 0.2rem;
}
.ucenter-addr-item:last-child {
  margin-bottom: 0;
}
.ucenter-addr-item .tag {
  position: absolute;
  right: 0;
  top: 0;
  color: #fefefe;
  font-size: 0.14rem;
  background-color: #000;
  line-height: 2.14285714em;
  height: 2.14285714em;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  padding: 0 1.14285714em;
  display: none;
}
.ucenter-addr-item .info {
  width: calc(100% - 3rem);
}
.ucenter-addr-item .meta {
  font-size: 0.18rem;
  line-height: 1.66666667em;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.ucenter-addr-item .meta .name {
  font-size: 1.11111111em;
  line-height: 1.5em;
  margin-right: 0.37rem;
}
.ucenter-addr-item .address {
  font-size: 0.16rem;
  color: #888;
  line-height: 1.75em;
  width: 100%;
}
.ucenter-addr-item .btn {
  font-weight: bold;
  font-size: 0.14rem;
  gap: 0.1rem;
  display: flex;
}
.ucenter-addr-item .btn span {
  height: 2.14285714em;
  border: solid 0.02rem #000000;
  border-radius: 1.07142857em;
  display: flex;
  align-items: center;
  min-width: 5em;
  padding: 0 0.92857143em;
  justify-content: center;
  cursor: pointer;
}
.ucenter-addr-item .btn span:hover {
  background-color: #000;
  color: #fff;
  border-color: transparent;
}
.ucenter-addr-item.default {
  border-color: #000;
}
.ucenter-addr-item.default .tag {
  display: block;
}
.ucenter-addr-item.default .btn {
  margin-top: 0.2rem;
}
@media only screen and (max-width: 750px) {
  .ucenter-addr-item .info {
    width: 100%;
  }
  .ucenter-addr-item .btn {
    margin-top: 0.2rem;
  }
  .ucenter-addr-item .meta .name {
    margin-right: 0.2rem;
  }
}
/*ucenter_profile_info*/
.ucenter_profile_info .bar {
  margin-bottom: 0.3rem;
}
.ucenter_profile_info .bar.mb0 {
  margin-bottom: 0;
}
.ucenter_profile_info .add {
  width: 8.75em;
  height: 2.5em;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  border-radius: 1.25em;
  border: 0.02rem solid #000;
  cursor: pointer;
}
.ucenter_profile_info .add:before {
  width: 0.75em;
  height: 0.75em;
  background-image: url(../images/add_01.svg);
  background-size: contain;
  margin-right: 0.6875em;
  display: block;
  content: '';
}
.ucenter_profile_info .add:hover {
  background-color: #000;
  color: #fff;
  border-color: transparent;
}
.ucenter_profile_info .add:hover:before {
  filter: invert(1) brightness(100);
}
@media only screen and (max-width: 750px) {
  .ucenter_profile_info .bar {
    margin-bottom: 0.2rem;
  }
  .ucenter_profile_info .button-submit {
    width: 100%;
  }
}
/*ucenter-popup*/
.ucenter-popup {
  display: block;
}
.ucenter-popup .box {
  width: 5.98rem;
  max-width: 90%;
  background-color: #fff;
  padding: 0.5rem 0.64rem 0.64rem;
}
.ucenter-popup .title {
  margin-bottom: 1.5em;
}
.ucenter-popup .item {
  margin-bottom: 0.2rem;
}
.ucenter-popup .input {
  background-color: #f2f1f1;
  position: relative;
  overflow: hidden;
  font-size: 0.18rem;
}
.ucenter-popup .label {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  height: 3.33333333em;
  line-height: 3.33333333em;
  display: none;
  padding: 0 1.11111111em;
  color: #888;
}
.ucenter-popup .text {
  height: 3.33333333em;
  line-height: 1.66666667em;
  padding: 0.83333333em 1.11111111em;
  display: block;
  width: 100%;
  position: relative;
  z-index: 2;
}
.ucenter-popup .view {
  width: 1.11111111em;
  height: 1.11111111em;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: url(../images/input_show.png) no-repeat center center;
  background-size: contain;
  right: 1.11111111em;
  cursor: pointer;
  z-index: 5;
}

.ucenter-popup .view.hide{
background: url(../images/input_hide.png) no-repeat center center;
background-size: contain;
}
.ucenter-popup .send {
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4.55555556em;
  font-style: normal;
  cursor: pointer;
  z-index: 5;
}
.ucenter-popup .send:before {
  width: 0.01rem;
  height: 0.66666667em;
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background-color: rgba(0, 0, 0, 0.2);
}
.ucenter-popup .code .text {
  padding-right: 5.55555556em;
}
.ucenter-popup .enter {
  text-align: right;
  margin-top: 0.08rem;
}
.ucenter-popup .enter a {
  text-decoration: underline;
}
.ucenter-popup .button {
  margin-top: 0.2rem;
}
.ucenter-popup .button-submit {
  height: 3.75em;
  border-radius: 1.875em;
}
.ucenter-popup .button-submit.auto {
  width: 100%;
}
@media only screen and (max-width: 750px) {
  .ucenter-popup .box {
    padding: 0.3rem 0.35rem 0.4rem;
  }
  .ucenter-popup .title {
    margin-bottom: 1em;
  }
}
/*ucenter-add-address*/
.ucenter-add-address {
  display: block;
}
.ucenter-add-address .box {
  width: 8.48rem;
  max-width: 90%;
  background-color: #fff;
  padding: 0.5rem 0.64rem 0.64rem;
}
.ucenter-add-address .title {
  margin-bottom: 0.94444444em;
}
.ucenter-add-address .item {
  padding-bottom: 0.2rem;
}
.ucenter-add-address .input {
  background-color: #f2f1f1;
  position: relative;
  border: 0.01rem solid #f2f1f1;
}
.ucenter-add-address .select:after {
  width: 0.875em;
  height: 0.5em;
  background: url(../images/drop_arrow_01.svg) no-repeat center center;
  background-size: contain;
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 1.6875em;
}
.ucenter-add-address .label {
  display: none;
  color: rgba(0, 0, 0, 0.5);
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  padding: 0 1.5em;
}
.ucenter-add-address .label.show {
  display: block;
  position: static;
  transform: none;
}
.ucenter-add-address .find {
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 3.9375em;
  cursor: pointer;
  background: url(../images/search_01.svg) no-repeat center center;
  background-size: auto 31.66666667%;
  z-index: 5;
}
.ucenter-add-address .text {
  height: 3.75em;
  line-height: 1.875em;
  padding: 0.9375em 1.5em;
  position: relative;
  z-index: 2;
  display: block;
  width: 100%;
  font-weight: 500;
}
.ucenter-add-address select {
  height: 3.75em;
  line-height: 3.75em;
  position: relative;
  z-index: 2;
  display: block;
  width: 100%;
  padding: 0 1.5em;
  appearance: none;
  -webkit-appearance: none;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.5);
  padding-right: 4.8125em;
}
.ucenter-add-address select::-ms-expand {
  display: none;
}
.ucenter-add-address select.active {
  color: #000;
}
.ucenter-add-address .help {
  width: 1.25em;
  height: 1.25em;
  background: url(../images/help_01.svg) no-repeat center center;
  background-size: contain;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  right: 1.375em;
  cursor: pointer;
}
.ucenter-add-address .tips {
  color: var(--main-color);
  margin-top: 0.05rem;
  display: none;
}
.ucenter-add-address .error .input {
  border-color: var(--main-color);
}
.ucenter-add-address .error .tips {
  display: block;
}
.ucenter-add-address .button {
  margin-top: 0.2rem;
}
@media only screen and (max-width: 750px) {
  .ucenter-add-address .box {
    padding: 0.3rem 0.35rem 0.4rem;
  }
  .ucenter-add-address .title {
    margin-bottom: 0.75em;
  }
}
/*ucenter-order-bar*/
.ucenter-order-bar {
  border-bottom: 0.01rem solid #f2f1f1;
  padding: 0.25rem 0.3rem;
}
.ucenter-order-bar .name {
  font-size: 0.2rem;
}
.ucenter-order-bar .status {
  color: #3396d4;
  font-size: 0.16rem;
  height: 1.75em;
  display: flex;
  align-items: center;
  background-color: rgba(51, 150, 212, 0.1);
  padding: 0 1em;
}
@media only screen and (max-width: 750px) {
  .ucenter-order-bar {
    padding: 0.15rem 0.2rem;
  }
}
/*ucenter-order-box*/
.ucenter-order-box .info {
  padding: 0.22rem 0.3rem;
}
@media only screen and (max-width: 750px) {
  .ucenter-order-box .info {
    padding: 0.15rem 0.2rem;
  }
}
/*ucenter-order-info*/
.ucenter-order-info .item:not(:last-child) {
  margin-bottom: 0.06rem;
}
.ucenter-order-info .name {
  color: #918b8a;
}
/*ucenter-order-shipping*/
.ucenter-order-shipping {
  line-height: 1.5em;
}
.ucenter-order-shipping.info {
  padding-top: 0;
  padding-bottom: 0;
}
.ucenter-order-shipping .btm {
  border-top: 0.01rem solid #f2f1f1;
  color: #918b8a;
  padding: 0.26rem 0;
}
.ucenter-order-shipping .top {
  padding: 0.22rem 0;
}
.ucenter-order-shipping .name {
  font-size: 1em;
  font-weight: 500;
}
.ucenter-order-shipping .address {
  color: #918b8a;
  line-height: 1.875em;
}
@media only screen and (max-width: 750px) {
  .ucenter-order-shipping .top,
  .ucenter-order-shipping .btm {
    padding: 0.15rem 0;
  }
}
/*ucenter-order-tracking*/
.ucenter-order-tracking .name {
  font-size: 0.18rem;
  font-weight: 500;
  margin: 0;
}
.ucenter-order-tracking .intro {
  color: #918b8a;
  margin-top: 0.08rem;
}
/*ucenter-order-products*/
.ucenter-order-products .item {
  padding: 0.2rem 0 0.3rem;
  border-bottom: 0.01rem solid #eee;
}
.ucenter-order-products .item:last-child {
  border-bottom: none;
}
.ucenter-order-products .pic {
  width: 0.8rem;
  vertical-align: top;
  padding: 0.07rem 0;
}
.ucenter-order-products .figure {
  padding-bottom: 100%;
}
.ucenter-order-products .text {
  padding: 0 0.3rem;
  vertical-align: top;
}
.ucenter-order-products .box {
  max-width: 2.2rem;
}
.ucenter-order-products .title {
  font-size: 0.16rem;
  line-height: 1.5em;
  font-weight: 500;
}
.ucenter-order-products .title a {
  display: inline-block;
}
.ucenter-order-products .meta {
  font-size: 0.14rem;
  color: #888;
  display: flex;
  flex-wrap: wrap;
  line-height: 1.85714286em;
  gap: 0.12rem;
  margin-top: 0.1rem;
}
.ucenter-order-products .meta span {
  display: block;
}
.ucenter-order-products .meta .type {
  border: solid 0.01rem #ebebeb;
  padding: 0 0.89285714em;
}
.ucenter-order-products .coupon {
  font-size: 0.14rem;
  color: #888;
  line-height: 1.42857143em;
  margin-top: 0.1rem;
}
.ucenter-order-products .coupon span {
  background: url(../images/coupon_01.png) no-repeat left 0.17857143em;
  background-size: 1.28571429em auto;
  padding-left: 2.14285714em;
  display: inline-block;
}
.ucenter-order-products .price {
  line-height: 1.5em;
  width: 0.75rem;
}
.ucenter-order-products .price del {
  color: rgba(0, 0, 0, 0.5);
}
.ucenter-order-products .quantity {
  width: 1rem;
  font-size: 0.14rem;
}
.ucenter-order-products .quantity i {
  display: inline-block;
  vertical-align: middle;
  font-style: normal;
  margin-right: 0.35714286em;
}
.ucenter-order-products .quantity span {
  height: 2.42857143em;
  background-color: #f7f7f7;
  border-radius: 1.07142857em;
  text-align: center;
  display: inline-block;
  vertical-align: middle;
  line-height: 2.42857143em;
  min-width: 2.42857143em;
}
.ucenter-order-products .total {
  text-align: right;
  white-space: nowrap;
  font-size: 0.18rem;
  line-height: 1.33333333em;
  font-weight: bold;
  width: 1rem;
}
@media only screen and (max-width: 750px) {
  .ucenter-order-products .item {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    padding: 0.2rem 0;
  }
  .ucenter-order-products .td {
    display: block;
  }
  .ucenter-order-products .pic {
    width: 20%;
    padding: 0.05rem 0;
  }
  .ucenter-order-products .text {
    width: 60%;
  }
  .ucenter-order-products .price {
    text-align: right;
    width: 20%;
  }
  .ucenter-order-products .quantity {
    width: auto;
    margin-right: 5%;
  }
  .ucenter-order-products .total {
    line-height: 1.88888889em;
    width: auto;
  }
}
/*ucenter-order-pages*/
.ucenter-order-pages li {
  padding: 0.22rem 0.3rem;
  line-height: 2em;
}
.ucenter-order-pages li:not(:last-child) {
  border-bottom: 0.01rem solid #f7f5f2;
}
.ucenter-order-pages a {
  display: block;
  position: relative;
}
.ucenter-order-pages a:after {
  width: 0.44444444em;
  height: 0.72222222em;
  background: url(../images/arrow_right_01.svg) no-repeat center center;
  background-size: contain;
  content: '';
  display: block;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  filter: invert(1) brightness(0);
  opacity: 0.35;
}
.ucenter-order-pages a:not(:hover) {
  color: #333;
}
.ucenter-order-pages a:hover:after {
  filter: none;
  opacity: 1;
}
@media only screen and (max-width: 750px) {
  .ucenter-order-pages li {
    padding: 0.15rem 0.2rem;
  }
}
/*ucenter-order-summary*/
.ucenter-order-summary {
  padding: 0.22rem 0.3rem;
}
.ucenter-order-summary .title {
  font-style: 0.2rem;
  color: #231815;
  line-height: 1.35em;
  margin-bottom: 0.2rem;
}
.ucenter-order-summary .list {
  font-size: 0.16rem;
  line-height: 2.25em;
}
.ucenter-order-summary .list li {
  display: flex;
  justify-content: space-between;
}
.ucenter-order-summary .list .total {
  border-top: 0.02rem solid #000;
  font-size: 0.24rem;
  line-height: 1.5em;
  font-weight: bold;
  padding-top: 0.16rem;
  margin-top: 0.16rem;
}
.ucenter-order-summary .button-more {margin-top:0.2rem;}
.ucenter-order-summary .button-more a {width:100%;}
.ucenter-order-summary .method {
  border-top: 0.01rem solid #f2f1f1;
  color: #918b8a;
  line-height: 1.5em;
  padding-top: 0.25rem;
  margin-top: 0.17rem;
}
.ucenter-order-summary .method .icon {
  width: 0.61rem;
}
.ucenter-order-summary .method .icon img {
  display: block;
  width: 100%;
}
.ucenter-order-summary .method .text {
  width: calc(100% - 0.8rem);
}
@media only screen and (max-width: 750px) {
  .ucenter-order-summary {
    padding: 0.2rem;
  }
  .ucenter-order-summary .method {
    padding-top: 0.2rem;
  }
}
/*single-page*/
#single-page {
  padding: 0.27rem 0 1.1rem;
}
#single-page .title {
  font-size: 0.64rem;
  line-height: 1.25em;
  margin-bottom: 3.71428571%;
}
#single-page .entry {
  line-height: 1.875em;
}
#single-page .entry h3 {
  font-size: 0.36rem;
  line-height: 1.75em;
}
#single-page .entry hr {
  border-bottom: 0.02rem solid #000;
}
#single-page .entry h4 {
  font-size: 0.3rem;
  line-height: 1.75em;
}
#single-page .entry ul li {
  position: relative;
  padding-left: 0.09rem;
}
#single-page .entry ul li:before {
  width: 0.25em;
  height: 0.25em;
  border-radius: 0.125em;
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0.8125em;
  background-color: #000;
}
@media only screen and (max-width: 1024px) {
  #single-page .title {
    font-size: 0.5rem;
  }
  #single-page .entry h3 {
    font-size: 0.3rem;
  }
  #single-page .entry h4 {
    font-size: 0.26rem;
  }
}
@media only screen and (max-width: 750px) {
  #single-page .title {
    font-size: 0.36rem;
  }
  #single-page .entry h3 {
    font-size: 0.26rem;
  }
  #single-page .entry h4 {
    font-size: 0.22rem;
  }
}
/*submenu*/
#submenu {
  margin-bottom: 4.86111111%;
}
#submenu ul {
  gap: 0.7rem;
  line-height: 1.5em;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  overflow-y: hidden;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
#submenu ul::-webkit-scrollbar {
  display: none;
}
#submenu a {
  white-space: nowrap;
  display: block;
  position: relative;
  padding: 0.16666667em 0;
}
#submenu a:after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  width: 100%;
  height: 0.13333333em;
  background-color: var(--main-color);
  bottom: 0;
  opacity: 0;
}
#submenu a:not(:hover) {
  color: #888;
}
#submenu .current a {
  color: #000;
}
#submenu .current a:after {
  opacity: 1;
}
@media only screen and (max-width: 1024px) {
  #submenu ul {
    gap: 0.5rem;
    font-size: 0.26rem;
  }
}
@media only screen and (max-width: 750px) {
  #submenu {
    margin-bottom: 0.4rem;
  }
  #submenu ul {
    gap: 0.2rem;
    font-size: 0.2rem;
  }
  #submenu li {
    padding-top: 0;
  }
}
/*faq-item*/
.faq-item {
  border-bottom: 0.02rem solid #000;
  padding-bottom: 0.28rem;
  margin-bottom: 0.28rem;
  position: relative;
}
.faq-item .text {
  width: calc(100% - 0.7rem);
  max-width: 12.2rem;
}
.faq-item .title {
  font-size: 0.24rem;
  line-height: 1.5em;
  padding: 0.29166667em 0;
  cursor: pointer;
}
.faq-item .intro {
  margin-top: 0.06rem;
  display: none;
font-size:0.18rem;
line-height:1.667em;
}
.faq-item .arrow {
  width: 0.5rem;
  height: 0.5rem;
  background-color: transparent;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s;
  cursor: pointer;
}
.faq-item .arrow:after {
  width: 28%;
  padding-bottom: 14%;
  background: url(../images/drop_arrow_01.svg) no-repeat center center;
  background-size: contain;
  display: block;
  content: '';
}
.faq-item.active {
  align-items: flex-end;
}
.faq-item.active .arrow {
  background-color: var(--main-color);
  transform: rotate(180deg);
}
.faq-item.active .arrow:after {
  filter: invert(1) brightness(100);
}
@media only screen and (max-width: 750px) {
  .faq-item {
    padding-bottom: 0.2rem;
    margin-bottom: 0.2rem;
  }
  .faq-item .title {
    font-size: 0.2rem;
    padding: 0.25em 0;
  }
  .faq-item .arrow {
    width: 0.4rem;
    height: 0.4rem;
  }
}
/*faq-list*/
#faq-list {
  margin-bottom: 0.47rem;
}
@media only screen and (max-width: 750px) {
  #faq-list {
    margin-bottom: 0.25rem;
  }
}
/*contact-form*/
#contact-form {
  width: calc(100% - 7.86rem);
  padding: 0 1.7rem 0.95rem 2.4rem;
}
#contact-form #breadcrumb {
  margin-bottom: 0.3rem;
}
#contact-form .title {
  margin-bottom: 0.2rem;
}
#contact-form .item {
  margin-bottom: 0.2rem;
}
#contact-form .label {
  line-height: 1.875em;
  display: block;
  margin-bottom: 0.1rem;
}
#contact-form .input {
  position: relative;
  background-color: #fff;
}
#contact-form .input .label {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 3.75em;
  line-height: 3.75em;
  color: #d2d2d2;
  font-weight: normal;
  padding: 0 1.375em;
  margin-bottom: 0;
}
#contact-form .text {
  display: block;
  width: 100%;
  position: relative;
  z-index: 2;
  height: 3.75em;
  line-height: 1.875em;
  padding: 0.9375em 1.375em;
}
#contact-form textarea.text {
  height: 10.8125em;
  resize: vertical;
}
#contact-form .button {
  margin-top: 0.14rem;
}
@media only screen and (max-width: 1280px) {
  #contact-form {
    padding-left: 0.6rem;
    padding-right: 0.6rem;
    width: calc(100% - 7.5rem);
  }
}
@media only screen and (max-width: 1024px) {
  #contact-form {
    width: 100%;
    padding-left: 3.125%;
    padding-right: 3.125%;
  }
}
@media only screen and (max-width: 750px) {
  #contact-form {
    padding-bottom: 0.5rem;
  }
  #contact-form #breadcrumb {
    margin-bottom: 0.2rem;
  }
}
/*contact-info*/
#contact-info {
  width: 7.86rem;
  position: relative;
  background-color: #fff;
  padding: 0.8rem 2.4rem 0.7rem 0.6rem;
}
#contact-info .hgroup {
  margin-bottom: 0.35rem;
}
#contact-info .title {
  margin-bottom: 0.14rem;
}
#contact-info .item {
  border-top: 0.02rem solid #000;
  padding: 0.3rem 0 0.35rem;
}
#contact-info .item li:not(:last-child) {
  margin-bottom: 0.05rem;
}
#contact-info .item span {
  display: block;
}
#contact-info .item span:nth-child(1) {
  white-space: nowrap;
  text-align: right;
}
#contact-info .item span:nth-child(2) {
  color: #555;
}
#contact-info .item a {
  color: #555;
  text-decoration: underline;
}
#contact-info .name {
  font-size: 0.2rem;
  line-height: 1.5em;
  margin-bottom: 0.15rem;
}
#contact-info .email span:nth-child(1) {
  width: 0.85rem;
}
#contact-info .email span:nth-child(2) {
  width: calc(100% - 1.02rem);
}
#contact-info .hours span:nth-child(1) {
  width: 1.1rem;
}
#contact-info .hours span:nth-child(2) {
  width: calc(100% - 1.3rem);
}
#contact-info .follow span:nth-child(1) {
  width: 0.7rem;
}
#contact-info .follow span:nth-child(2) {
  width: calc(100% - 0.88rem);
}
@media only screen and (max-width: 1280px) {
  #contact-info {
    width: 7.5rem;
    padding-right: 0.6rem;
  }
}
@media only screen and (max-width: 1024px) {
  #contact-info {
    width: 100%;
    padding-left: 3.125%;
    padding-right: 3.125%;
  }
}
@media only screen and (max-width: 750px) {
  #contact-info {
    padding-top: 0.5rem;
    padding-bottom: 0.7rem;
  }
}
/*banner*/
#banner {
  position: relative;
  overflow: hidden;
}
#banner .figure {
  padding-bottom: 8rem;
}
#banner #breadcrumb {
  position: absolute;
  left: 0;
  bottom: 2.75%;
  width: 100%;
  z-index: 2;
}
#banner #breadcrumb a {
  color: #fff;
  filter: invert(0) brightness(100);
}
#banner #breadcrumb i {
  filter: invert(1) brightness(100);
}
@media only screen and (max-width: 1280px) {
  #banner .figure {
    padding-bottom: 41.66666667%;
  }
}
/*about-name*/
.about-name {
  margin: 0;
  font-size: 0.64rem;
  line-height: 1.25em;
  letter-spacing: -0.0125em;
}
@media only screen and (max-width: 1024px) {
  .about-name {
    font-size: 0.46rem;
  }
}
@media only screen and (max-width: 750px) {
  .about-name {
    font-size: 0.36rem;
  }
}
/*about-intro*/
.about-intro {
  font-size: 0.18rem;
  line-height: 1.33333333em;
}
@media only screen and (max-width: 750px) {
  .about-intro {
    font-size: 0.16rem;
  }
}
/*about-hgroup*/
.about-hgroup {
  margin-bottom: 0.7rem;
}
.about-hgroup .about-name {
  margin-bottom: 0.109375em;
}
.about-hgroup .about-name:last-child {
  margin-bottom: 0;
}
@media only screen and (max-width: 750px) {
  .about-hgroup {
    margin-bottom: 0.35rem;
  }
}
/*about-intro*/
#about-intro {
  padding: 2.16rem 0 1.85rem;
}
#about-intro .item {
  width: 50%;
  position: relative;
}
#about-intro .item:after {
  position: absolute;
  content: '';
  right: 0;
  bottom: 0;
  height: calc(100% - 0.2rem);
  background-color: #000;
  width: 0.02rem;
  display: none;
}
#about-intro .item:nth-child(2n) {
  padding-left: 6.94444444%;
}
#about-intro .item:nth-child(2n+1) {
  padding-right: 6.94444444%;
}
#about-intro .item:nth-child(2n+1):after {
  display: block;
}
#about-intro .about-name {
  margin-bottom: 0.3125em;
}
#about-intro .entry {
  font-size: 0.18rem;
  line-height: 1.33333333em;
}
@media only screen and (max-width: 1280px) {
  #about-intro {
    padding: 11.25% 0 9.63541667%;
  }
}
@media only screen and (max-width: 750px) {
  #about-intro {
    padding: 0.45rem 0;
  }
  #about-intro .item {
    width: 100%;
  }
  #about-intro .item:after {
    height: 0.02rem;
    width: 100%;
  }
  #about-intro .item:nth-child(n+1) {
    padding: 0.25rem 0 0.35rem;
  }
}
/*about-world*/
#about-world {
  background: url(../images/about_world_bg.jpg) no-repeat center center;
  background-size: cover;
  overflow: hidden;
  padding: 1.07rem 0 1.23rem;
  margin-bottom: 1.65rem;
}
#about-world .about-name {
  margin-bottom: 5.06944444%;
}
#about-world ul {
 /* gap: 0.65rem;*/
  line-height: 1.33333333em;
min-height:2.5rem;
}
#about-world .earth {
width:2.7rem;
}
#about-world .earth .figure {
  padding-bottom: 89.21282799%;
}
#about-world .num {
  font-size: 0.68rem;
height:1em;
  line-height: 1em;
  font-weight: bold;
  margin-bottom: 0.47058824em;
}
#about-world .name {
  min-height: 2.66666667em;
}
@media only screen and (max-width: 1280px) {
  #about-world {
    margin-bottom: 8.59375%;
  }
}
@media only screen and (max-width: 1024px) {
  #about-world ul {
    gap: 0.3rem;
    font-size: 0.16rem;
  }
  #about-world .num {
    font-size: 0.58rem;
  }
  #about-world .earth {
    width: 20%;
  }
}
@media only screen and (max-width: 750px) {
  #about-world {
    padding: 0.65rem 0;
    margin-bottom: 0.5rem;
  }
  #about-world .about-name {
    margin-bottom: 0.35rem;
  }
  #about-world ul {
    flex-wrap: wrap;
    gap: 0;
  }
  #about-world li {
    width: 50%;
    text-align: center;
  }
  #about-world li:nth-child(n+4) {
    width: 31%;
  }
  #about-world .num {
    font-size: 0.48rem;
  }
  #about-world .name {
    max-width: 10em;
    margin: 0 auto;
  }
  #about-world .earth {
    width: 70%;
    margin: 0.35rem auto;
  }
}
/*ip-item*/
.ip-item .title {
  font-size: 0.32rem;
  line-height: 1.35em;
  border-bottom: 0.02rem solid #000;
  padding-bottom: 0.375em;
  margin-bottom: 0.8125em;
  transition: all 0.2s;
}
.ip-item .intro {
  font-size: 0.16rem;
  line-height: 1.5em;
  color: #888;
  min-height: 6em;
}
.ip-item .btm {
  width: 100%;
  position: relative;
  padding-bottom: 76.66666667%;
}
.ip-item .btn {
  display: flex;
  position: absolute;
  left: 0;
  top: 0;
  font-weight: bold;
  width: 44.33333333%;
  justify-content: space-between;
  margin-top: 3.33333333%;
}
.ip-item .btn a {
  position: relative;
  padding-right: 1em;
  display: block;
}
.ip-item .btn a:after {
  width: 0.375em;
  height: 0.625em;
  background: url(../images/arrow_right_02.svg) no-repeat center center;
  background-size: contain;
  content: '';
  display: block;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-40%);
  filter: invert(1) brightness(0);
}
.ip-item .btn a:hover {
  color: var(--main-color);
}
.ip-item .btn a:hover:after {
  filter: none;
}
.ip-item .cover {
  width: 56.66666667%;
  position: absolute;
  right: 0;
  bottom: 0;
}
.ip-item .cover:after {
  padding-bottom: 135.29411765%;
  display: block;
}
.ip-item .icon {
  position: absolute;
  left: 0;
  bottom: 0;
}
.ip-item .icon img {
  max-width: 1.62rem;
  max-height: 0.68rem;
  object-fit: contain;
}
.ip-item .info {
  background-color: #f7f7f7;
  overflow: hidden;
  padding: 0.16rem 0.22rem 0.27rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  height: 100%;
  gap: 0.15rem;
  transition: all 0.2s;
}
.ip-item .info:hover .title,
.ip-item.active .title {
  border-bottom-color: var(--main-color);
}
.ip-item .info:hover,
.ip-item.active .info {
  background-color: #fff;
  box-shadow: 0.04rem 0.04rem 0.5rem 0 rgba(7, 24, 76, 0.26);
  color: var(--main-color);
}
@media only screen and (max-width: 750px) {
  .ip-item .title {
    font-size: 0.24rem;
  }
  .ip-item .icon img {
    max-width: 0.8rem;
    max-height: 0.48rem;
  }
  .ip-item .info {
    padding: 0.15rem 0.2rem 0.25rem;
  }
}
/*about-ip*/
#about-ip {
  overflow: hidden;
  margin-bottom: 1.8rem;
}
#about-ip .center_logo {
  display: flex;
  justify-content: center;
  margin-bottom: .5rem;
}

#about-ip .center_logo .figure {
  background-color: #000000;
  padding-bottom: 5.367521%;
  width: 4.68rem;
  position: relative;
}

#about-ip .center_logo img {
  height: 56%;
  position: absolute;
  left: 50%;
  top: 50%;
  width: auto;
  object-fit: contain;
  transform: translate(-50%, -50%);
}
@media only screen and (max-width: 1920px) {
  #about-ip {
    margin-bottom: 9.375%;
  }
}
@media only screen and (max-width: 1024px) {
  #about-ip .item {
    width: 33.333%;
  }
}
@media only screen and (max-width: 750px) {
  #about-ip .list {
    --margin: 0.15rem;
  }
  #about-ip .item {
    width: 50%;
  }
}
/*ip-popup*/
.ip-popup .box {
  width: 10.8rem;
  max-width: 90%;
  overflow: hidden;
}
.ip-popup .bar {
  background-color: var(--main-color);
  color: #fff;
  padding: 0.1rem 0.6rem;
}
.ip-popup .info {
  background-color: #fff;
  padding: 0.5rem 0.6rem 0.55rem;
}
.ip-popup .name {
  margin-bottom: 0.4em;
}
.ip-popup .entry {
  line-height: 1.875em;
}
.ip-popup .figure {
  width: 43.75%;
}
.ip-popup .figure:after {
  padding-bottom: 135.71428571%;
  display: block;
}
.ip-popup .img {
  object-fit: contain;
}
.ip-popup .text {
  width: 44.27083333%;
}
.ip-popup .data {
  border-top: 0.02rem solid #000;
  border-bottom: 0.02rem solid #000;
  padding: 0.27rem 0;
  margin-top: 0.4rem;
}
.ip-popup .data li {
  padding: 0.13rem 0;
}
.ip-popup .data .num {
  font-size: 0.48rem;
  font-weight: bold;
  line-height: 1em;
  color: var(--main-color);
}
.ip-popup .story {
  margin-top: 0.22rem;
}
@media only screen and (max-width: 750px) {
  .ip-popup .wrap {
    padding: 5vh 0;
  }
  .ip-popup .bar {
    padding-left: 0.25rem;
    padding-right: 0.25rem;
  }
  .ip-popup .title {
    font-size: 0.24rem;
  }
  .ip-popup .info {
    padding: 0.25rem 0.25rem 0.3rem;
  }
  .ip-popup .text {
    width: 100%;
  }
  .ip-popup .name {
    font-size: 0.24rem;
  }
  .ip-popup .entry {
    line-height: 1.5em;
  }
  .ip-popup .data {
    padding: 0.1rem 0;
    margin-top: 0.25rem;
  }
  .ip-popup .data ul {
    font-size: 0.16rem;
    line-height: 1.35em;
    display: flex;
    justify-content: space-between;
  }
  .ip-popup .data li {
    width: 31%;
    padding: 0.1rem 0;
  }
  .ip-popup .data .num {
    font-size: 0.3rem;
    margin-bottom: 0.1rem;
  }
  .ip-popup .figure {
    width: 60%;
    margin: 0.25rem auto 0;
  }
}
/*about-ip-logo*/
.about-ip-logo {
  overflow: hidden;
  margin-bottom: 1.4rem;
}
.about-ip-logo .list {
  display: flex;
}
.about-ip-logo .list:nth-child(2n) {
  justify-content: flex-end;
}
.about-ip-logo ul {
  width: max-content;
  display: flex;
  gap: 0.18rem;
}
.about-ip-logo li {
  width: 2.24rem;
  margin-bottom: 0.18rem;
}
.about-ip-logo .figure {
  padding-bottom: 44.64285714%;
  background-color: #f7f7f7;
}
.about-ip-logo img {
  position: absolute;
  left: 50%;
  top: 50%;
  width: auto;
  height: 64%;
  object-fit: contain;
  transform: translate(-50%, -50%);
}
.about-ip-logo .center {
  width: 4.68rem;
}
.about-ip-logo .center .figure {
  background-color: #000000;
  padding-bottom: 21.36752137%;
}
.about-ip-logo .center img {
  height: 56%;
}
@media only screen and (max-width: 1280px) {
  .about-ip-logo {
    margin-bottom: 7.29166667%;
  }
}
@media only screen and (max-width: 1024px) {
  .about-ip-logo li {
    width: 1.8rem;
  }
  .about-ip-logo .center {
    width: 3.6rem;
  }
}
@media only screen and (max-width: 750px) {
  .about-ip-logo ul {
    gap: 0.1rem;
  }
  .about-ip-logo li {
    width: 1.2rem;
    margin-bottom: 0.1rem;
  }
  .about-ip-logo .center {
    width: 2.4rem;
  }
}
/*about-milestones-list*/
.about-milestones-list {
  overflow: hidden;
  margin-bottom: 0.55rem;
}
.about-milestones-list .swiper {
  width: 8rem;
  margin: 0 auto;
  overflow: visible;
  max-width: 93.75%;
}
.about-milestones-list .swiper-slide {
  width: 2.76rem;
  height: auto;
  transition: width 0.3s;
}
.about-milestones-list .cover {
  margin: 0 0.05rem;
  background-color: #e0e0e0;
}
.about-milestones-list .cover:after {
  display: block;
  padding-bottom: 5rem;
}
.about-milestones-list .cover .img {
  transition: width 0.3s;
}
.about-milestones-list .info {
  display: none;
  color: #fff;
  background-color: #ff7110;
  height: 100%;
  position: relative;
  padding: 0.5rem;
}
.about-milestones-list .text {
  width: 4.7rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}
.about-milestones-list .year {
  font-size: 1.5rem;
  color: rgba(255, 255, 255, 0.1);
  line-height: 0.65em;
  font-weight: bold;
}
.about-milestones-list .title {
  font-size: 0.48rem;
  line-height: 1.35em;
  margin-bottom: 0.05rem;
}
.about-milestones-list .intro {
  font-size: 0.24rem;
  line-height: 1.25em;
}
.about-milestones-list .picture {
  width: 33.75%;
  width: 2.7rem;
  position: absolute;
  right: 6.25%;
  top: 50%;
  transform: translateY(-50%);
}
.about-milestones-list .picture:after {
  display: block;
  padding-bottom: 155.55555556%;
}
.about-milestones-list .picture .img {
  object-fit: contain;
}
.about-milestones-list .current {
  width: 8rem;
}
.about-milestones-list .current .cover {
  display: none;
}
.about-milestones-list .current .info {
  display: block;
}
@media only screen and (max-width: 750px) {
  .about-milestones-list {
    margin-bottom: 0.35rem;
  }
  .about-milestones-list .cover {
    display: none;
  }
  .about-milestones-list .info {
    display: block;
    height: 3rem;
    padding: 0.3rem;
  }
  .about-milestones-list .picture {
    width: 1.45rem;
  }
  .about-milestones-list .text {
    width: calc(100% - 1.55rem);
  }
  .about-milestones-list .year {
    font-size: 0.8rem;
  }
  .about-milestones-list .title {
    font-size: 0.36rem;
  }
  .about-milestones-list .intro {
    font-size: 0.18rem;
  }
}
/*about-milestones-year*/
.about-milestones-year {
  width: 6rem;
  max-width: 80%;
  margin: 0 auto;
}
.about-milestones-year .swiper-slide {
  font-size: 0.24rem;
}
.about-milestones-year .swiper-slide:after {
  width: 2.33333333em;
  height: 0.25em;
  background: url(../images/year_dot_line.svg) no-repeat center center;
  background-size: contain;
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: -0.91rem;
}
.about-milestones-year span {
  display: block;
  cursor: pointer;
  font-weight: bold;
  white-space: nowrap;
}
.about-milestones-year .current {
  color: var(--main-color);
}
@media only screen and (max-width: 750px) {
  .about-milestones-year .swiper-slide {
    font-size: 0.18rem;
  }
  .about-milestones-year .swiper-slide:after {
    right: -0.44rem;
  }
}
/*about-milestones*/
#about-milestones {
  margin-bottom: 2.15rem;
}
#about-milestones .about-name {
  margin-bottom: 0.65rem;
}
@media only screen and (max-width: 1280px) {
  #about-milestones {
    margin-bottom: 11.19791667%;
  }
}
@media only screen and (max-width: 750px) {
  #about-milestones .about-name {
    margin-bottom: 0.35rem;
  }
}
/*warning-box*/
.warning-box {
  position: fixed;
  left: 50%;
  top:50%;
  transform: translateX(-50%);
  max-width: 90%;
  background-color: #fff;
  border-radius: 0.1rem;
  padding: 0.1rem 0.2rem 0.1rem 0.3rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1em;
  box-shadow: 0 0.08rem 0.3rem rgba(0, 0, 0, 0.15);
  z-index: 9999;
}

.warning-box .tips {
  flex: 1;
  line-height: 1.5em;
  font-size: 0.16rem;
  color: #333;
}

.warning-box .view {
  flex-shrink: 0;
}

.warning-box .view a {
  color: #fff;
  font-size: 0.16rem;
  padding: 0.5em 1.2em;
  border-radius: 0.08rem;
  background-color: var(--main-color);
  display: inline-block;
  transition: opacity 0.2s;
}

.warning-box .view a:hover {
  opacity: 0.85;
}
/*button-claim*/
#button-claim {
  display: none;
  position: fixed;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 11;
}
#button-claim i {
  display: block;
  width: 1.5em;
  height: 1.5em;
  border-radius: 50%;
  background: #fff url(../images/close_02.svg) no-repeat center center;
  background-size: 50% auto;
  position: absolute;
  right: 0;
  top: 0;
  transform: translate(50%, -50%);
  box-shadow: 0 0 0.05rem rgba(0, 0, 0, 0.2);
  z-index: 2;
}
#button-claim span {
  display: block;
  font-size: 0.16rem;
  background-color: #333;
  color: #fff;
  writing-mode: sideways-rl;
  line-height: 2.5em;
  font-weight: bold;
  padding: 1em 0;
  cursor: pointer;
}
.code-popup .box .empty {
    padding-bottom: 28%;
background:url(../images/empty_coupons.png) no-repeat center center;
background-size:contain;
}
.checkout-form .select {
    flex: 1 1 auto;
    cursor: pointer;
}

.checkout-form .input:has(.select) .label {
    width: auto;
    flex: 0 0 auto;
}

.checkout-form select {
    cursor: pointer;
}

.no-comment {text-align:center;position:relative;z-index:5;}
.no-comment a {display:flex; flex-direction:column; align-items:center; color:var(--font-color);}
.no-comment a:hover {color:var(--main-color);}


/* 2026-07-09新增 */
#ucenter .copy_a {
  color: #918b8a;
  cursor: pointer;
  transition: all .5s;
}

#ucenter .copy_a .copy {
  width: 0.16rem;
  height: 0.17rem;
  background-image: url('../images/copy_01.png');
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: .15rem;
}

#ucenter .copy_a:hover {
  color: var(--main-color);
}

#ucenter .return_no {
  background-color: #f2f2f2;
  border-radius: .5rem;
  margin-left: .6rem;
}

#ucenter .return_no .return_inp {
  padding: .14rem .2rem;
}

#ucenter .return_no .return_submit {
  padding: .14rem .2rem;
  border-radius: .5rem;
  background-color: var(--main-color);
  color: #fff;
  cursor: pointer;
  line-height: 1;
}

#ucenter .sh_box .info {
  border-bottom: 0.01rem solid #f2f1f1;
  padding: .24rem 0;
  margin: 0 .3rem;
}

.ucenter-after-sales .input {
  background-color: #f2f1f1;
  position: relative;
  border: 0.01rem solid #f2f1f1;
}

.ucenter-after-sales .input .label {
  margin-bottom: 0;
}

.ucenter-after-sales select {
  height: 3.75em;
  line-height: 3.75em;
  position: relative;
  z-index: 2;
  display: block;
  width: 100%;
  padding: 0 1.5em;
  appearance: none;
  -webkit-appearance: none;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.5);
  padding-right: 4.8125em;
}

.ucenter-after-sales select.active {
  color: #000;
}

.ucenter-after-sales .select:after {
  width: 0.875em;
  height: 0.5em;
  background: url(../images/drop_arrow_01.svg) no-repeat center center;
  background-size: contain;
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 1.6875em;
}

.ucenter-after-sales .input .label {
  display: block;
  color: rgba(0, 0, 0, 0.5);
  padding: 0 1.5em;
}

.ucenter-after-sales .sales_list .item {
  padding: 0.2rem 0;
  border-bottom: 0.01rem solid #f2f1f1;
  margin-bottom: 0;
}

.ucenter-after-sales .sales_list .item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.ucenter-after-sales .sales_list .item:first-child {
  padding-top: 0;
}

.ucenter-after-sales .sales_list .figure {
  width: 1.18rem;
}

.ucenter-after-sales .sales_list .figure a {
  padding-bottom: 100%;
}

.ucenter-after-sales .sales_list .text {
  width: calc(100% - 1.6rem);
  background-color: #fff;
  padding: 0.625em 0;
}

.ucenter-after-sales .sales_list .title {
  font-size: 0.18rem;
  line-height: 1.33333333em;
  max-height: 2.66666667em;
  margin-bottom: 0;
}

.ucenter-after-sales .sales_list .title a {
  display: block;
}

.ucenter-after-sales .sales_list .meta {
  margin-top: 0.05rem;
  line-height: 1.875em;
}

.ucenter-after-sales .sales_list .checkbox {
  width: 0.16rem;
  height: 0.16rem;
  accent-color: #000000;
}

.ucenter-after-sales .text {
  resize: none;
}

.pay_result {
  padding: 1.44rem 0;
  text-align: center;
}

.pay_result .pay_icon {
  max-width: 4.3rem;
  height: 2.35rem;
  width: 100%;
  margin: 0 auto .4rem;
}

.pay_result .pay_icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.pay_result .pay_text {
  margin-bottom: .8rem;
}

.pay_result .pay_text h3 {
  font-size: 0.3rem;
  margin: 0 0 .12rem;
}

.pay_result .pay_text p {
  margin: 0;
  color: #888888;
  font-size: .18rem;
}

.pay_result .pay_btn .btn {
  margin: 0 .1rem;
}

.pay_result .button-default a {
  display: flex;
  width: 16.25em;
  height: 3.125em;
  font-weight: bold;
  border-radius: 1.5625em;
  align-items: center;
  justify-content: center;
}
.review-rating[data-rating='1'] i:nth-child(n+2) {
    filter: grayscale(1);
    opacity: 0.3;
}
.review-rating[data-rating='2'] i:nth-child(n+3) {
    filter: grayscale(1);
    opacity: 0.3;
}
.review-rating[data-rating='3'] i:nth-child(n+4) {
    filter: grayscale(1);
    opacity: 0.3;
}
.review-rating[data-rating='4'] i:nth-child(n+5) {
    filter: grayscale(1);
    opacity: 0.3;
}

.arr-list .tag {
    font-size: 0.12rem;
    height: auto;
    min-width: 0;
    line-height: 2.4;
}
#characters .img {
    position: relative;
    z-index: 2;
}
.module-name {
    font-size: 0.58rem;
}
#menu dd a {
    text-transform: uppercase;
}
#header {
    z-index: 20;
}

#language {
    display: none;
}
#figurine,#entrance{
  display: none;
}
.arr-list .swiper{
  overflow: hidden;
}
.signup .box.noticeTxt {
    width: 10rem;
    line-height: 1.5;
}

.noticeTxt .t {
    font-size: 1.5em;
    line-height: 1.3;
    margin-bottom: 1em;
}
.noticeTxt .p {
    max-height: 70vh;
    overflow: auto;
    padding-right: 1em;
}
@media only screen and (max-width: 1280px) {
    .module-name {
        font-size: 0.48rem;
    }
}
@media only screen and (max-width: 750px) {
    .module-name {
        font-size: 0.4rem;
    }
  .sellers .swiper-slide{
    height: auto;
  }
  #sellers .swiper {
    height: 9rem;
}
}