@import 'base.css';
@import 'fonts/custom.css';
.isbg {
  background-position: center center;
  background-repeat: no-repeat;
}
.isbg-contain-none {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}
.isbg-cover-none {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.pop {
  position: absolute;
  left: 0;
  top: 0;
}
.pop-full {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
/* 比例要求 */
/*超过1920px时，比例不变  默认*/
html {
  font-size: 100px;
}
main {
  max-width: 1920px;
  margin: 0 auto;
}
.container {
  max-width: calc(var(--max-width) * 1px);
}
@media (max-width: 1500px) {
  html {
    font-size: calc(100 / 1500 * 100vw);
  }
}
@media (max-width: 1024px) {
  html {
    font-size: calc(100 / 769 * 100vw);
  }
}
@media (max-width: 480px) {
  html {
    font-size: calc(100 / 400 * 100vw);
  }
}
body {
  font-size: 0.2rem;
  font-family: 'Noto Sans TC', '微軟正黑體', Arial, sans-serif;
  line-height: var(--main_line_height);
  color: var(--default-color);
}
/* 更严格的解决方案 */
.era-table-container,.ranking-table {
  width: 100%;
  overflow-x: auto;
  position: relative;
  left: 0;
  right: 0;
  margin-left: 0;
  margin-right: 0;
}
.btn-down{
	margin-left:0.2rem;
	font-size:0.18rem;
			padding: .12rem;
			border-radius:50px;
			margin-right: 0.16rem;
			cursor: pointer;
			background: #0BA29B;
			color: #fff;
}

.container {
  width: 87.6%;
  margin: 0 auto;
}
@media (max-width: 1024px) {
  .container {
    width: 94%;
  }
.ranking-table8rem{
	min-width: 8rem;
}
/* 更严格的解决方案 */
.era-table-container,.ranking-table {
  max-width: 85vw;
}
}
.page-all{
	padding-left: 2.5rem;
	
}
.input-date{
	    border-radius: 0.08rem;
	    font-size: 0.14rem;
	    color: #999;
		width: 100% !important;
}
.input-date .el-input__inner{
	background: rgba(145, 162, 164, 0.1019607843);
	height: 0.4rem;
	font-size: 0.14rem;
	line-height:0.4rem;
}
.input-date .el-input__icon{height: 0.4rem;
	line-height:0.4rem;
	
}
.el-button--primary{
	background:  #0BA29B !important;
	border: 1px solid  #0BA29B !important;
}
.input-icon{
	width: 0.18rem;
	height: 0.18rem;
}
header {
 position: fixed;
  z-index: 100;
  left: 0;
  top: 0;
  bottom: 0;
  background: #fff;
	text-align: center;
  width:2.5rem;
}
header .header-container {
	/* padding: 20px; */
	padding: 0.38rem 0.2rem;
  /* height: var(--header-height); */
}

  .header-account{
	padding: 0.38rem 0.2rem;
	  position: absolute;
	  left: 0;
	  right: 0;
	  bottom:0
  }
  .header-account .account{
	  background: #0BA29B1A;
	  border-radius: 10px;
	  padding: 0.12rem 0.14rem;
	  width: 100%;
	  font-size: 0.14rem;
	  color: #222;
  }
  .avatar{
	  width: 0.38rem;
	  height: 0.38rem;
	  border-radius: 50%;
	  margin-right: 0.04rem;
  }
header .logo img {
	width: 1.14rem;
	height: 0.32rem;
}
.logo-title{
	font-size: 0.2rem;
	color: #0BA29B;
	margin-top: 0.22rem;
	margin-bottom: 0.36rem;
}
header .top-right {
/*  display: flex;
  align-items: center; */
}
/* header .top-nav {
  font-size: var(--font-size__18);
}
header .top-nav li span {
  display: block;
}
header .top-nav li span a {
  display: block;
  padding: 0.12rem 0;
  position: relative;
  cursor: pointer;
} */
.top-nav li a{
	display: flex;
	padding:0.14rem 0.2rem;
	margin: 0 0 10px;
	align-items: center;
}
.top-nav li a img{
	display: block;
	width: 0.2rem;
	height: 0.2rem;
	margin-right: 0.05rem;
}
.top-nav li a img.nav-icon1{
	display: block;
}

.top-nav li a img.nav-icon2{
	display: none
}

.top-nav li a:hover{
	background: var(--primary-color);
	border-radius: 10px;
	color: #fff;
}
.top-nav li a:hover .nav-icon1{
	display: none;
}
.top-nav li a:hover .nav-icon2{
	display: block;
}
.top-nav li a.on{
	background: var(--primary-color);
	border-radius: 10px;
	color: #fff;
}
.top-nav li a.on .nav-icon1{
	display: none;
}
.top-nav li a.on .nav-icon2{
	display: block;
}
/* header .top-nav li span a:after {
  position: absolute;
  content: '';
  left: 50%;
  height: 2px;
  transform: translateX(-50%);
  background-color: var(--primary-color);
  bottom: 0;
  transition: 0.3s;
} */
header:not(.header-member) li#m1963150981311930370 {
  display: none;
}
header.header-member {
  --max-width: 1800;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url('../images/titbg.jpg');
}
header.header-member .container {
  width: 94%;
}
header.header-member .logo img {
  filter: brightness(0) invert(1);
}
header.header-member .top-right {
  flex: 1;
  justify-content: space-between;
  margin-left: var(--pm__60);
}
header.header-member .open-search {
  display: block;
  width: 0.2rem;
  height: 0.2rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/search-white.svg');
  margin-right: 0.3rem;
}
header.header-member .open-search.active {
  background-image: url(../images/close-white.svg);
}
header.header-member .top-search {
  opacity: 0;
  transition: 0.3s;
}
header.header-member .top-search:not(.show) {
  visibility: hidden;
}
header.header-member .top-search.show {
  opacity: 1;
}
header.header-member .login-after .tips-ico-notice {
  background-image: url(../images/notice-white.svg);
}
header.header-member .login-after .tips-ico-cart {
  background-image: url(../images/cart-white.svg);
}
header.header-member .login-after .user > a:after {
  background-image: url(../images/select-white.svg);
}
header.header-member .login-after .user .nk-name {
  color: var(--white-color);
}
header.ishide-true {
  display: none;
}
.login-before a {
  cursor: pointer;
  display: flex;
  align-items: center;
  height: 0.4rem;
  font-size: var(--font-size__14);
  color: var(--white-color);
  background-color: var(--primary-color);
  border-radius: 0.2rem;
  padding: 0 0.2rem;
}
.login-before a:before {
  content: '';
  display: block;
  width: 0.16rem;
  height: 0.16rem;
  margin-right: 0.08rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/user.svg');
}
.login-after {
  display: flex;
  align-items: center;
}
.login-after [class*=tips-ico-] {
  display: block;
  width: 0.2rem;
  height: 0.2rem;
  position: relative;
  margin-right: 0.3rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}
.login-after [class*=tips-ico-] em {
  position: absolute;
  right: -0.05rem;
  top: -0.05rem;
  min-width: 0.16rem;
  height: 0.16rem;
  background-color: #ff392f;
  border-radius: 50%;
  border-radius: 0.08rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white-color);
  font-size: var(--font-size__12);
}
.login-after .tips-ico-notice {
  background-image: url(../images/notice.svg);
}
.login-after .tips-ico-cart {
  background-image: url(../images/cart.svg);
}
.login-after .user {
  position: relative;
  z-index: 39;
  padding: 0.1rem 0;
}
.login-after .user.active .user-drop {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.login-after .user > a {
  cursor: pointer;
}
.login-after .user > a:after {
  display: block;
  content: '';
  width: 0.1rem;
  height: 0.06rem;
  margin-left: 0.07rem;
  opacity: 0.6;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/select.svg');
}
.login-after .user .avatar {
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  margin-right: 0.06rem;
  background-color: var(--default-color);
}
.login-after .user .nk-name {
  font-size: var(--font-size__14);
}
.login-after .user .user-drop {
  position: absolute;
  top: 100%;
  width: 100%;
  left: 0;
  background-color: var(--white-color);
  border-radius: 0.05rem;
  padding: 0.2rem 0;
  box-shadow: 0 -0.05rem 0.1rem rgba(var(--black-color__rgb), 0.1);
  transform: translateY(0.2rem);
  opacity: 0;
  transition: 0.3s;
  visibility: hidden;
}
.login-after .user .user-drop:after {
  position: absolute;
  content: '';
  width: 0.1rem;
  height: 0.1rem;
  transform: rotate(45deg);
  background-color: var(--white-color);
  top: -0.04rem;
  left: 0.15rem;
}
.login-after .user .user-drop a {
  display: flex;
  align-items: center;
  padding: 0 0.2rem;
  cursor: pointer;
}
.login-after .user .user-drop a:not(:last-child) {
  margin-bottom: 0.2rem;
}
.login-after .user .user-drop a:before {
  display: block;
  content: '';
  width: 1em;
  height: 1em;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  margin-right: 0.1rem;
}
.login-after .user .user-drop a.logout:before {
  background-image: url(../images/loginout.svg);
}
.login-after .user .user-drop a.user:before {
  background-image: url(../images/setting.svg);
}
.login-after .user .user-drop a:hover.logout:before {
  background-image: url(../images/loginout-on.svg);
}
.login-after .user .user-drop a:hover.user:before {
  background-image: url(../images/setting-on.svg);
}
.top-search {
  margin-right: 0.2rem;
  width: 2.5rem;
}
@media (min-width: 1025px) {
/*  header .top-nav li {
    margin-right: var(--pm__60);
  } */
  header .top-nav li span a:after {
    width: 0;
  }
  header .top-nav li:hover a:after,
  header .top-nav li.aon a:after {
    width: 100%;
  }
  header.header-white:not(.dark-style) .logo img {
    filter: brightness(0) invert(1);
  }
  header.header-white:not(.dark-style) .top-nav li span a {
    color: var(--white-color);
  }
  header.header-white:not(.dark-style) .login-after .tips-ico-notice {
    background-image: url(../images/notice-white.svg);
  }
  header.header-white:not(.dark-style) .login-after .tips-ico-cart {
    background-image: url(../images/cart-white.svg);
  }
  header.header-white:not(.dark-style) .login-after .user .nk-name {
    color: var(--white-color);
  }
  header.header-white:not(.dark-style) .login-after .user > a:after {
    background-image: url(../images/select-white.svg);
  }
  header.header-member .top-nav li span a {
    color: var(--white-color);
  }
  header.header-dark,
  header.dark-style {
    background-color: var(--white-color);
    box-shadow: 0 0 0.24rem rgba(var(--black-color__rgb), 0.06);
  }
  header.header-dark .input-with-select {
    background-color: #f7f7f7;
  }
  header.header-dark .input-with-select .el-input-group__prepend {
    background-color: #ededed;
  }
  header.header-dark .input-with-select .el-input__inner {
    color: #333 !important;
  }
  header.header-dark .input-with-select .el-input__inner::placeholder {
    color: rgba(153, 153, 153, 0.7);
  }
  header.header-dark .input-with-select .el-select .el-input .el-select__caret,
  header.header-dark .input-with-select .el-input-group__append .el-button {
    color: #999;
  }
}
@media (max-width: 1024px) {
  header {
    background-color: var(--white-color);
    box-shadow: 0 0.05rem 0.05rem rgba(var(--black-color__rgb), 0.1);
  }
  header .top-nav {
    position: fixed;
    top: 0.6rem;
    left: -100%;
    opacity: 0;
    transition: 0.5s ease-in-out;
    width: 3rem;
    background-color: var(--white-color);
    padding: 0.2rem 0;
    box-shadow: 0.05rem 0.05rem 0.05rem rgba(var(--black-color__rgb), 0.1);
    bottom: 0;
  }
  header .top-nav.menu-show {
    left: 0;
    opacity: 1;
  }
  header .top-nav ul {
    padding: 0 0.2rem;
    overflow: auto;
    height: 100%;
  }
  header .top-nav li span a {
    /* padding: 0.2rem 0; */
  }
  header .top-nav li span a:after {
    opacity: 0.3;
    width: 100%;
    height: 1px;
  }
  header .top-nav li.aon span a:after {
    opacity: 1;
    height: 0.03rem;
  }
  header .open-search {
    display: block;
    width: 0.2rem;
    height: 0.2rem;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url('../images/search.svg');
    margin-right: 0.2rem;
  }
  header .open-search.active {
    background-image: url(../images/close.svg);
  }
  header.header-member .top-right {
    justify-content: flex-end;
  }
  header.header-member .openMenu i {
    background-color: var(--white-color);
  }
  .top-search {
    position: absolute;
    top: 100%;
    width: 100%;
    margin: 0;
    left: 0;
    border-radius: 0;
    opacity: 0;
    visibility: hidden;
  }
  .top-search .input-with-select {
    border-radius: 0;
  }
  .top-search.show {
    opacity: 1;
    visibility: visible;
  }
  .openMenu {
    display: flex;
    width: 0.4rem;
    height: 0.28rem;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    margin-left: 0.2rem;
    position: relative;
  }
  .openMenu i {
    display: block;
    width: 100%;
    height: 3px;
    background-color: var(--black-color);
    transition: 0.3s;
  }
  .openMenu.active i {
    position: absolute;
    left: 20%;
    width: 60%;
    top: 50%;
    margin-top: -1.5px;
  }
  .openMenu.active i:nth-child(2) {
    opacity: 0;
  }
  .openMenu.active i:nth-child(1) {
    transform: rotate(45deg);
  }
  .openMenu.active i:nth-child(3) {
    transform: rotate(-45deg);
  }
}
@media (max-width: 480px) {
  .login-after [class*=tips-ico-] {
    margin-right: 0.2rem;
  }
  .login-after .user .nk-name {
    display: none;
  }
  .login-after .user .user-drop {
    width: max-content;
  }
}
.popup-box__login .inner {
  max-width: 8rem;
  border-radius: 0.2rem;
  overflow: hidden;
}
footer {
  background-color: #f5f6f7;
  padding: var(--pm__60) 0 var(--pm__30) 0;
}
footer .tit {
  font-size: var(--font-size__18);
  margin-bottom: 1em;
}
footer .f-bottom {
  margin-top: var(--pm__80);
  color: #999999;
}
footer .f-bottom a {
  display: inline-block;
  cursor: pointer;
}
footer .f-bottom a:not(:hover) {
  color: #999999;
}
footer .f-bottom .right a:not(:last-child) {
  margin-right: 0.2rem;
}
footer .f-nav .nav-item dd {
  line-height: 2.25em;
}
footer .f-nav .nav-item dd a {
  cursor: pointer;
}
footer .f-nav .nav-item dd a:not(:hover) {
  color: #999;
}
footer .f-contact dl {
  line-height: 2.25em;
  margin-bottom: var(--pm__10);
}
footer .f-contact dl dt {
  color: #999999;
}
footer .f-contact dl dd {
  margin-top: -0.1rem;
  font-family: var(--font-family-en);
}
footer .f-contact .code {
  text-align: center;
  width: 1.3rem;
}
footer .f-contact .code img {
  display: block;
  width: 100%;
}
footer .f-contact .code p {
  margin-bottom: 0;
}
@media (min-width: 1025px) {
  footer .f-top .f-nav {
    width: 5.4rem;
  }
  footer .f-top .f-contact {
    width: 6.3rem;
  }
}
@media (max-width: 1024px) {
  footer .f-nav .nav-item:not(:last-child) {
    margin-bottom: var(--pm__50);
  }
  footer .f-nav .nav-item dl {
    display: flex;
    flex-wrap: wrap;
  }
  footer .f-nav .nav-item dl dd {
    margin-right: 0.2rem;
  }
  footer .f-contact {
    margin-top: var(--pm__50);
  }
  footer .f-bottom {
    text-align: center;
    line-height: 1.5;
  }
  footer .f-bottom .right {
    margin-top: var(--pm__30);
  }
}
[class*=all-btn] a {
  display: flex;
  height: 0.6rem;
  min-width: 1.8rem;
  align-items: center;
  justify-content: center;
  padding: 0 0.1rem;
  border-radius: 0.3rem;
  border: 0.02rem solid var(--primary-color);
  font-size: var(--font-size__18);
  font-weight: var(--font-weight__b);
  transition: transform 0.3s;
  cursor: pointer;
}
[class*=all-btn] a:after {
  display: block;
  content: '';
  margin-left: 0.16rem;
  width: 0.09rem;
  height: 0.15rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/more.svg');
  transition: 0.3s;
}
[class*=all-btn] a:hover {
  transform: translateY(-0.1rem);
}
[class*=all-btn] a:hover:after {
  margin-left: 0.24rem;
}
[class*=all-btn].all-btn-full a {
  background-color: var(--primary-color);
  color: var(--white-color);
}
[class*=all-btn].all-btn-full a:after {
  filter: brightness(0) invert(1);
}
[class*=all-btn].all-btn-border a {
  color: var(--primary-color);
}
.home-ban {
  position: relative;
  z-index: 1;
}
.home-ban figure {
  height: 6.4rem;
}
.home-ban .txt {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  height: auto;
  bottom: 0;
}
.home-ban .txt .info {
  width: 50%;
  max-width: 6.6rem;
  text-align: center;
}
.home-ban .txt .info h3 {
  font-size: var(--font-size__54);
  color: var(--black-color);
  margin: 0;
}
.home-ban .txt .info h3 span {
  color: var(--primary-color);
}
.home-ban .txt .info p {
  margin: var(--pm__30) 0;
  font-size: var(--font-size__24);
}
.home-ban .txt .btn-group {
  margin-bottom: var(--pm__30);
}
.home-ban .txt .btn-group [class*=all-btn] {
  margin: 0 0.12rem;
}
.home-ban .desc {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: var(--font-size__18);
}
.home-ban .desc span {
  display: block;
  padding-left: 0.24rem;
  background-repeat: no-repeat;
  background-size: auto 1em;
  background-position: left center;
}
.home-ban .desc span + span {
  margin-left: 0.2rem;
}
.home-ban .desc span:nth-child(1) {
  background-image: url(../images/ban-ico1.svg);
}
.home-ban .desc span:nth-child(2) {
  background-image: url(../images/ban-ico2.svg);
}
.home-ban .desc span:nth-child(3) {
  background-image: url(../images/ban-ico3.svg);
}
.home-ban .desc span:nth-child(4) {
  background-image: url(../images/ban-ico4.svg);
}
@media (max-width: 1024px) {
  .home-ban {
    padding-top: var(--header-height);
  }
  .home-ban .txt {
    top: var(--header-height);
    bottom: 40%;
  }
  .home-ban .txt .info {
    width: 100%;
    max-width: none;
  }
  .home-ban .txt .info h3 {
    font-size: var(--font-size__50);
    line-height: 1.4;
  }
}
.login-box {
  background: var(--white-color);
}
.login-box .left {
  width: 45%;
  flex-shrink: 0;
  position: relative;
}
.login-box .left .txt {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(var(--primary-color__rgb), 0.9);
  color: var(--white-color);
}
.login-box .left .txt h3,
.login-box .left .txt p {
  margin: 0;
}
.login-box .left .txt h3 {
  font-size: var(--font-size__22);
}
.login-box .left .txt p {
  font-size: var(--font-size__18);
  margin-bottom: 1em;
}
.login-box .left .img {
  height: 100%;
  min-height: 4.3rem;
}
.login-box .right {
  flex: 1;
}
.formBox {
  padding: var(--pm__40) 0;
}
.formBox .el-input__inner {
  border-radius: 0.06rem;
  border-color: #d6d6d6;
  height: 0.46rem;
  line-height: 0.46rem;
  padding: 0 0.15rem;
  font-size: var(--font-size__16);
}
.formBox .el-form-item {
  margin-bottom: 0;
}
.formBox .el-radio__label,
.formBox .el-form-item__label {
  font-size: inherit;
}
.formBox .el-form-item__label {
  line-height: 0.46rem;
}
.formBox .el-checkbox {
  display: inline-flex;
}
.formBox .el-checkbox__label {
  font-size: var(--font-size__16);
  color: #999999;
}
.formBox .el-checkbox__input.is-checked .el-checkbox__inner {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}
.formBox .el-checkbox__inner {
  width: 0.18rem;
  height: 0.18rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.formBox .el-checkbox__inner::after {
  display: block;
  position: relative;
  left: auto;
  top: auto;
  width: 0.1rem;
  height: 0.1rem;
  transform: none !important;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/checked-white.svg');
  border: 0;
}
.formBox .el-form-item__content {
  line-height: inherit;
  font-size: inherit;
}
.formBox .el-button {
  font-size: var(--font-size__18);
}
.formBox .el-button + .el-button {
  margin-left: 0.2rem;
}
.formBox .el-button.is-round {
  padding: calc(16 / 18 * 1em) var(--pm__60);
  border-radius: 0.6rem;
}
.formBox .el-button--primary {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}
.formBox .form-item {
  margin-bottom: 0.2rem;
}
.formBox .el-form-item__label {
  min-width: 4em;
}
.formBox .tip {
  margin-bottom: 0.2rem;
  color: #666;
  font-size: var(--font-size__14);
}
.formBox .text-show {
  display: flex;
  align-items: center;
  height: 100%;
}
.formBox .text-show a {
  color: var(--primary-color);
  margin-left: 1em;
  cursor: pointer;
}
.formBox .form-label {
  font-size: var(--font-size__18);
  margin-bottom: 0.14rem;
}
.formBox .form-label .err {
  color: #ff554c;
}
.formBox .form-input {
  position: relative;
  z-index: 1;
}
.formBox .form-input.maxw350 {
  max-width: 3.5rem;
}
.formBox .getCode {
  position: absolute;
  --rtb: 0.03rem;
  right: var(--rtb);
  top: var(--rtb);
  bottom: var(--rtb);
  border-radius: 0.04rem;
  min-width: 1.2rem;
  padding: 0 0.2rem;
  cursor: pointer;
  color: var(--primary-color);
  background-color: rgba(var(--primary-color__rgb), 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
}
.formBox .getCode.disabled {
  cursor: default;
  background-color: rgba(var(--black-color__rgb), 0.2);
  color: var(--default-color);
}
.formBox .tg {
  max-width: 3.2rem;
  width: 90%;
  margin: 0 auto;
}
.formBox .tab-name {
  font-size: var(--font-size__26);
  font-weight: var(--font-weight__b);
  margin-bottom: var(--pm__30);
}
.formBox .tab-name,
.formBox .tab-name a {
  color: var(--default-color);
}
.formBox .tab-name a {
  display: block;
  color: #bfbfbf;
  position: relative;
  cursor: pointer;
  padding-bottom: 0.12rem;
}
.formBox .tab-name a + a {
  margin-left: var(--pm__40);
}
.formBox .tab-name a:after {
  position: absolute;
  content: '';
  width: 0.3rem;
  height: 0.03rem;
  background-color: var(--primary-color);
  opacity: 0;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
}
.formBox .tab-name a.active {
  color: var(--default-color);
}
.formBox .tab-name a.active:after {
  opacity: 1;
}
.formBox .btns .btn {
  flex: 1;
}
.formBox .btns .btn + .btn {
  margin-left: 0.2rem;
}
.formBox .btn {
  line-height: 0.46rem;
  border: 1px solid transparent;
  background-color: var(--primary-color);
  border-radius: 0.06rem;
  color: var(--white-color);
  text-align: center;
  cursor: pointer;
}
.formBox .btn.back {
  background-color: rgba(var(--black-color__rgb), 0.1);
  color: var(--default-color);
}
.formBox .btn.reset {
  background-color: var(--white-color);
  border-color: rgba(var(--black-color__rgb), 0.1);
  color: var(--default-color);
}
.formBox .forget {
  margin: 0.2rem 0 0.38rem 0;
  font-size: var(--font-size__14);
  color: #666666;
}
.formBox .forget a {
  cursor: pointer;
}
.formBox .forget .no-accont a {
  color: var(--primary-color);
  text-decoration: underline;
}
.formBox .has-account {
  font-size: var(--font-size__14);
  color: #666666;
  margin: 0.2rem 0 0.38rem 0;
}
.formBox .has-account a {
  cursor: pointer;
  color: var(--primary-color);
  text-decoration: underline;
}
.formBox .agree {
  font-size: var(--font-size__14);
}
.formBox .agree .checkbox-ico {
  margin-right: 0.5em;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.formBox .agree .checkbox-ico i {
  width: 1em;
  height: 1em;
  border: 1px solid rgba(var(--black-color__rgb), 0.1);
  border-radius: 2px;
}
.formBox .agree p {
  margin: 0;
  color: #999999;
  line-height: 1.2;
}
.formBox .agree p a {
  cursor: pointer;
}
.formBox .agree p a:not(:hover) {
  color: #555555;
}
.formBox .agree.checked .checkbox-ico i {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/checked.svg');
}
.protocol-dialog {
  max-width: 9rem;
  height: 70vh;
}
.protocol-dialog .overscroll {
  overflow: auto;
  max-height: calc(70vh - 114px);
  padding-right: 0.15rem;
  margin-right: -0.15rem;
  line-height: 1.875;
}
.small-dialog {
  max-width: 3.5rem;
}
.small-dialog .formBox {
  padding: 0;
}
.small-dialog.h340 {
  height: 3rem;
}
.small-dialog .el-dialog__footer {
  padding-bottom: 0;
  padding-top: 0;
}
.edit-info {
  line-height: 1.875em;
  color: #666;
}
.page-main {
  overflow: hidden;
}
.page-main main {
  padding: var(--pm__80) 0 var(--pm__100) 0;
}
@media (max-width: 1024px) {
  .page-main {
    padding-top: var(--header-height);
  }
}
.guide-main {
  --max-width: 1000;
}
.guide-main .list .item {
  margin-bottom: 0.1rem;
}
.guide-main .list .item .q {
  background-color: #fafafa;
  border-radius: 0.3rem;
  display: flex;
  justify-content: space-between;
  padding: 0.2rem var(--pm__40);
  cursor: pointer;
}
.guide-main .list .item .q p {
  margin: 0;
  flex: 1;
  margin-right: var(--pm__30);
  font-size: var(--font-size__18);
}
.guide-main .list .item .q:after {
  display: block;
  content: '';
  width: 0.12rem;
  height: 0.12rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/drop.svg');
  transition: 0.3s;
}
.guide-main .list .item .a {
  padding: var(--pm__30) var(--pm__40);
  display: none;
}
.guide-main .list .item.active .q {
  color: var(--primary-color);
  font-weight: var(--font-weight__b);
}
.guide-main .list .item.active .q:after {
  transform: rotate(180deg);
}
.guide-main .list .item.active .a {
  display: block;
}
.coop-form {
  --max-width: 1200;
}
.coop-form .formBox {
  margin-bottom: var(--pm__80);
  border-radius: var(--pm__20);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url('../images/coop-bg.jpg');
  padding: var(--pm__50) var(--pm__80);
}
.coop-form .formBox .el-input__inner {
  font-size: var(--font-size__18);
}
.coop-form .formBox .el-select {
  display: block;
}
.coop-form .formBox .el-select .el-input__inner {
  color: var(--default-color);
}
.coop-form .formBox .form-item {
  margin-bottom: var(--pm__30);
}
.coop-form .info dl {
  padding: 0 var(--pm__60);
  position: relative;
}
.coop-form .info dl dt {
  margin-bottom: 0.1rem;
}
.coop-form .info dl dd {
  display: flex;
  align-items: center;
}
.coop-form .info dl dd i {
  width: 0.4rem;
  height: 0.4rem;
  background-color: rgba(var(--primary-color__rgb), 0.05);
  display: block;
  border-radius: 50%;
  margin-right: 0.08rem;
  background-position: center;
  background-repeat: no-repeat;
}
.coop-form .info dl dd i.ico-tel {
  background-image: url(../images/tel.svg);
  background-size: auto 50%;
}
.coop-form .info dl dd i.ico-email {
  background-image: url(../images/email.svg);
  background-size: 50% auto;
}
.coop-form .info dl dd p {
  font-size: var(--font-size__20);
  font-family: var(--font-family-en);
  margin: 0;
}
.coop-form .info dl dt {
  color: #666666;
}
@media (min-width: 481px) {
  .coop-form .formBox .el-form {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .coop-form .formBox .form-item {
    width: calc((100% - 0.4rem) / 2);
  }
  .coop-form .formBox .btns {
    width: 100%;
  }
  .coop-form .formBox .btns .btn {
    flex: none;
    width: 1.5rem;
  }
  .coop-form .info dl:not(:last-child):after {
    position: absolute;
    content: '';
    width: 0.01rem;
    height: 0.5rem;
    background-color: rgba(var(--black-color__rgb), 0.1);
    right: 0;
    top: 0.09rem;
  }
}
@media (max-width: 480px) {
  .coop-form .info dl:not(:last-child) {
    margin-bottom: var(--pm__40);
  }
  .coop-form .info dl dt {
    text-align: center;
  }
  .coop-form .info dl dd {
    justify-content: center;
  }
}
.column-name {
  text-align: center;
  font-size: var(--font-size__36);
  font-weight: var(--font-weight__b);
  margin-bottom: var(--pm__40);
  color: var(--black-color);
}
@media (max-width: 480px) {
  .column-name {
    font-size: var(--font-size__28);
    line-height: 1.2;
  }
}
.home-process {
  --title-height: 0.8rem;
  position: relative;
  z-index: 3;
  padding-bottom: var(--pm__100);
}
.home-process dl {
  border-radius: var(--pm__20);
  box-shadow: 0 0 0.42rem rgba(18, 89, 183, 0.2);
  overflow: hidden;
}
.home-process dl dt {
  background-image: url(../images/home-titbg.jpg);
  text-align: center;
  height: var(--title-height);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white-color);
  font-size: var(--font-size__30);
  font-weight: var(--font-weight__b);
}
.home-process dl dd {
  display: flex;
  justify-content: center;
  padding: 0.18rem 0 var(--pm__40) 0;
}
.home-process dl dd img {
  max-width: 90%;
}
@media (min-width: 1025px) {
  .home-process dl {
    width: calc((100% - 0.3rem) / 2);
    margin-top: calc(var(--title-height) * -1);
  }
}
@media (max-width: 1024px) {
  .home-process {
    --title-height: 0.6rem;
  }
  .home-process dl:nth-child(1) {
    margin-top: calc(var(--title-height) * -1);
  }
  .home-process dl:not(:last-child) {
    margin-bottom: var(--pm__40);
  }
}
.home-pics {
  padding-bottom: var(--pm__100);
}
.home-pics .home-swiper {
  padding-bottom: 0.42rem;
  --swiper-pagination-bullet-width: 0.12rem;
  --swiper-pagination-bullet-height: 0.12rem;
  --swiper-pagination-bullet-horizontal-gap: 0.1rem;
}
.home-pics .home-swiper .pic-rows figure {
  border-radius: var(--pm__20);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.home-pics .home-swiper .pic-rows .right dl {
  display: flex;
  flex-wrap: wrap;
}
.home-pics .home-swiper .pic-rows .right dl dd {
  width: calc((100% - var(--pm__20) * 2) / 3);
}
.home-pics .home-swiper .pic-rows .right dl dd:not(:nth-child(3n)) {
  margin-right: var(--pm__20);
}
.home-pics .home-swiper .pic-rows .right dl dd:nth-child(3) ~ dd {
  margin-top: var(--pm__20);
}
.home-pics .home-swiper .pic-rows .right dl dd figure {
  padding-bottom: 100%;
}
@media (min-width: 481px) {
  .home-pics .pic-rows {
    display: flex;
    justify-content: space-between;
  }
  .home-pics .pic-rows .left {
    width: 39.2%;
  }
  .home-pics .pic-rows .left figure {
    height: 100%;
  }
  .home-pics .pic-rows .right {
    flex: 1;
    margin-left: var(--pm__20);
  }
}
@media (max-width: 480px) {
  .home-pics .pic-rows .left {
    margin-bottom: var(--pm__20);
  }
  .home-pics .pic-rows .left figure {
    padding-bottom: 100%;
  }
}
.home-model {
  margin-bottom: var(--pm__100);
}
.home-model .swiper-nav {
  display: flex;
  justify-content: center;
  margin-bottom: var(--pm__40);
}
.home-model .swiper-nav .swiper {
  width: 10rem;
  max-width: 100%;
  box-shadow: 0 0 0.3rem rgba(18, 89, 183, 0.2);
  border-radius: 0.25rem;
  background: linear-gradient(to bottom, #FFF 0, #eef6fd 4px, #fff 90%);
}
.home-model .swiper-nav .tit {
  font-size: var(--font-size__18);
  font-weight: var(--font-weight__b);
  height: calc(50 / 18 * 1em);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  cursor: pointer;
  padding: 0 0.1rem;
  line-height: 1.2;
}
.home-model .swiper-nav .swiper-slide-thumb-active .tit {
  color: var(--white-color);
  background-color: var(--primary-color);
}
.home-model .swiper-con {
  border-radius: 0.2rem;
}
.home-model .swiper-con .swiper-slide {
  background-color: #fafafa;
  border-radius: 0.2rem;
  overflow: hidden;
}
.home-model .swiper-con .left,
.home-model .swiper-con .right {
  flex: 1;
}
.home-model .swiper-con .left figure {
  padding-bottom: calc(450 / 750 * 100%);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.home-model .swiper-con .txt {
  padding: 0 var(--pm__80);
  font-size: var(--font-size__18);
}
.home-model .swiper-con .txt h3 {
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: var(--font-size__30);
}
.home-model .swiper-con .txt .en-name {
  font-size: var(--font-size__20);
  font-family: var(--font-family-en);
  color: #999;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: var(--pm__30);
  margin-top: 0.07rem;
}
.home-model .swiper-con .txt .desc {
  margin: 0 0 var(--pm__40) 0;
  line-height: 1.77777778em;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  min-height: calc(32 / 18 * 3em);
}
.home-model .swiper-con .txt .edit-info dl {
  display: flex;
  justify-content: space-between;
}
.home-model .swiper-con .txt .edit-info dl dd {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.home-model .swiper-con .txt .edit-info dl dd .icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 50%;
  background: rgba(var(--primary-color__rgb), 0.05);
  transition: 0.3s;
}
.home-model .swiper-con .txt .edit-info dl dd .icon img {
  max-height: 0.4rem;
  transition: 0.3s;
}
.home-model .swiper-con .txt .edit-info dl dd p {
  margin-bottom: 0;
}
.home-model .swiper-con .txt .edit-info dl dd:hover .icon {
  background: var(--primary-color);
}
.home-model .swiper-con .txt .edit-info dl dd:hover .icon img {
  filter: brightness(0) invert(1);
  transform: rotateY(360deg);
}
@media (max-width: 1024px) {
  .home-model .swiper-nav .tit {
    font-size: var(--font-size__16);
  }
  .home-model .swiper-con .txt {
    padding: var(--pm__40);
  }
}
.home-ad {
  position: relative;
  z-index: 1;
}
.home-ad figure {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.home-ad .txt {
  position: relative;
  z-index: 40;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 2.6rem;
  padding: var(--pm__30) 3%;
}
.home-ad .txt h3 {
  margin: 0 0 0.4rem 0;
  color: var(--white-color);
  font-size: var(--font-size__36);
}
.home-ad .all-btn-border a {
  background-color: var(--white-color);
  border-color: var(--white-color);
}
@media (max-width: 480px) {
  .home-ad .txt h3 {
    font-size: var(--font-size__30);
  }
}
/*会员专区*/
.member-box {
  background-color: var(--white-color);
  border-radius: var(--pm__10);
  padding: var(--pm__30);
}
.member-box .box-name {
  margin: calc(var(--pm__30) * -1) calc(var(--pm__30) * -1) var(--pm__30);
  padding: 0 var(--pm__30);
  font-size: var(--font-size__20);
  height: 0.6rem;
  display: flex;
  align-items: center;
  border-bottom: 1px solid #f2f2f2;
  font-weight: var(--font-weight__b);
}
.operate {
  display: flex;
  align-items: center;
  font-size: var(--font-size__16);
  font-weight: var(--font-weight__r);
}
.operate,
.operate a:not(:hover) {
  color: #666;
}
.operate a {
  cursor: pointer;
}
.operate a.cancel {
  color: #999;
}
.operate .el-checkbox {
  margin: 0 1em !important;
  font-size: inherit;
  display: flex;
  align-items: center;
}
.operate .el-checkbox__label {
  font-size: inherit;
}
.operate .el-checkbox__inner {
  width: 0.24rem;
  border-color: #cccccc;
  height: 0.24rem;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.operate .el-checkbox__inner:after {
  position: relative;
  left: auto;
  top: auto;
  width: 0.14rem;
  border: 0;
  height: 0.1rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/checked-white.svg');
}
.operate .el-checkbox__input.is-checked .el-checkbox__inner {
  border-color: var(--primary-color);
  background-color: var(--primary-color);
}
.operate .el-checkbox__input.is-checked .el-checkbox__inner:after {
  transform: none;
}
.operate .el-checkbox__input.is-checked + .el-checkbox__label {
  color: var(--primary-color);
}
.prod-search {
  position: relative;
  width: 3rem;
}
.prod-search .btn {
  position: absolute;
  width: 0.6rem;
  height: 100%;
  background-size: 30% auto;
  background-position: center center;
  background-repeat: no-repeat;
  background-image: url(../images/search.svg);
  right: 0;
  top: 0;
  z-index: 10;
}
.prod-search .el-input__inner {
  border-radius: 0.2rem;
  border-color: #d9d9d9;
  font-weight: var(--font-weight__l);
  padding: 0 0.6rem 0 0.2rem;
  height: 0.4rem;
  line-height: 0.4rem;
}
.page-member {
  position: fixed;
  left: 0;
  top: 0;
  padding-top: var(--header-height);
  width: 100%;
  bottom: 0;
  background-color: #f7f9fa;
  z-index: 1;
  display: flex;
  justify-content: space-between;
}
.page-member .left-side {
  background-color: var(--white-color);
}
.page-member .right-side .auto-content {
  padding: 0 var(--pm__40);
}
.page-member .formBox .btn {
  border-radius: 2em;
  display: inline-block;
  padding: 0 var(--pm__20);
  min-width: 1.5rem;
}
.page-member .formBox .btns .btn {
  flex: none;
}
@media (min-width: 1025px) {
  .page-member .left-side {
    width: 2.6rem;
    flex-shrink: 0;
  }
  .page-member .right-side {
    width: calc(100% - 2.6rem);
    flex-shrink: 0;
  }
  .page-member .right-side .auto-content {
    height: 100%;
    overflow: auto;
  }
  .page-member .minHeight {
    min-height: calc(100% - var(--pm__70) - var(--header-height));
  }
}
@media (max-width: 1024px) {
  .page-member {
    flex-direction: column;
  }
  .page-member .left-side {
    flex-shrink: 0;
  }
  .page-member .right-side {
    flex: 1;
    overflow: auto;
  }
  .page-member .minHeight {
    min-height: calc(100vh - var(--pm__70) - 1.2rem - var(--header-height) - 4em);
  }
}
.member-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.4;
  height: var(--header-height);
  padding: 0 var(--pm__20);
}
.member-footer p {
  color: #999999;
  margin: 0;
}
.member-footer p a {
  display: inline-block;
}
.location dl {
  height: var(--pm__70);
}
.location,
.location dl,
.location dd {
  display: flex;
  align-items: center;
}
.location:before {
  display: block;
  content: '';
  width: 0.14rem;
  height: 0.14rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/home-m.svg');
  margin-right: 0.1rem;
}
.location dd {
  font-size: var(--font-size__14);
}
.location dd a {
  cursor: pointer;
}
.location dd a:not(:hover),
.location dd span {
  color: #999999;
}
.location dd i {
  display: block;
  width: 0.12rem;
  height: 0.1rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/arrow.svg');
  opacity: 0.5;
  margin: 0 0.1rem;
}
.location dd a:hover {
  color: var(--primary-color);
}
.side-menu li {
  font-size: var(--font-size__18);
  transition: 0.3s;
}
.side-menu li a {
  padding: 0.25rem;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.side-menu li a i {
  display: block;
  width: 0.18rem;
  height: 0.2rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  margin-right: 0.18rem;
  flex-shrink: 0;
}
.side-menu li a i.ico-user {
  background-image: url(../images/member/user.svg);
}
.side-menu li a i.ico-order {
  background-image: url(../images/member/order.svg);
}
.side-menu li a i.ico-prod {
  background-image: url(../images/member/prod.svg);
}
.side-menu li a i.ico-address {
  background-image: url(../images/member/address.svg);
}
.side-menu li a i.ico-collect {
  background-image: url(../images/member/collect.svg);
}
.side-menu li a i.ico-password {
  background-image: url(../images/member/password.svg);
}
.side-menu li a span {
  flex: 1;
}
.side-menu li a:after {
  display: block;
  content: '';
  width: 0.06rem;
  height: 0.1rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/menu-a.svg');
  margin-left: 0.18rem;
  flex-shrink: 0;
}
.side-menu li:hover a,
.side-menu li.active a {
  background-color: rgba(var(--primary-color__rgb), 0.1);
  color: var(--primary-color);
}
.side-menu li:hover a:after,
.side-menu li.active a:after {
  background-image: url(../images/menu-aon.svg);
}
.side-menu li:hover a i.ico-user,
.side-menu li.active a i.ico-user {
  background-image: url(../images/member/user-on.svg);
}
.side-menu li:hover a i.ico-order,
.side-menu li.active a i.ico-order {
  background-image: url(../images/member/order-on.svg);
}
.side-menu li:hover a i.ico-prod,
.side-menu li.active a i.ico-prod {
  background-image: url(../images/member/prod-on.svg);
}
.side-menu li:hover a i.ico-address,
.side-menu li.active a i.ico-address {
  background-image: url(../images/member/address-on.svg);
}
.side-menu li:hover a i.ico-collect,
.side-menu li.active a i.ico-collect {
  background-image: url(../images/member/collect-on.svg);
}
.side-menu li:hover a i.ico-password,
.side-menu li.active a i.ico-password {
  background-image: url(../images/member/password-on.svg);
}
@media (min-width: 1025px) {
  .side-menu {
    padding: 0 0.25rem;
  }
  .side-menu li:not(:first-child) {
    margin-top: -1px;
  }
  .side-menu li:not(:last-child) {
    border-bottom: var(--border);
  }
  .side-menu li a {
    margin: 0 -0.25rem;
  }
  .side-menu li:hover,
  .side-menu li.active {
    border-bottom-color: var(--white-color);
  }
}
@media (max-width: 1024px) {
  .side-menu ul {
    display: flex;
    flex-wrap: wrap;
  }
  .side-menu li {
    width: calc(100% / 3);
    border-bottom: var(--border);
  }
  .side-menu li:not(:nth-child(3n)) {
    border-right: var(--border);
  }
}
@media (max-width: 480px) {
  .side-menu li a {
    padding: var(--pm__30);
  }
  .side-menu li a i {
    margin-right: 0.1rem;
  }
}
.personal-info {
  padding: 0.1rem;
}
.personal-info .info-top {
  padding-bottom: var(--pm__30);
  margin-bottom: var(--pm__10);
  border-bottom: 1px solid #f2f2f2;
}
.personal-info .info-top .avatar {
  position: relative;
  z-index: 1;
}
.personal-info .info-top .avatar .img img {
  border-radius: 50%;
  width: 1rem;
  height: 1rem;
}
.personal-info .personal-title {
  margin-left: 0.25rem;
}
.personal-info .formBox .el-form-item__content {
  flex: 1;
  max-width: 3.6rem;
}
.personal-title .name {
  font-size: var(--font-size__18);
  font-weight: var(--font-weight__b);
  margin-bottom: 0.15rem;
}
.personal-title .group {
  display: flex;
}
.personal-title .group span {
  display: block;
  padding: 0.06rem 0.09rem;
  border-radius: 1em;
  font-size: var(--font-size__14);
  background: rgba(var(--primary-color__rgb), 0.1);
  color: var(--primary-color);
}
.member-index .info-area .avatar {
  flex-shrink: 0;
  margin-right: 0.25rem;
}
.member-index .info-area .avatar img {
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
}
.member-index .info-area .personal-title {
  flex: 1;
}
.member-index .info-area .personal-title .name {
  margin-bottom: 0.1rem;
}
.member-index .info-area dl {
  margin-top: var(--pm__20);
}
.member-index .info-area dd {
  color: #666666;
  line-height: 1.71428571em;
  font-size: var(--font-size__14);
  white-space: nowrap;
}
.member-index .info-area .edit {
  text-decoration: underline;
  color: #808080;
  cursor: pointer;
  line-height: 1.375em;
}
.member-index .order-icons .item {
  width: 20%;
  display: flex;
  justify-content: center;
}
.member-index .order-icons .item a {
  cursor: pointer;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.member-index .order-icons .item a:hover [class*=ico-] {
  background-image: url(../images/member/cicrle-on.svg);
}
.member-index .order-icons .item a:hover [class*=ico-].ico-1:after {
  background-image: url(../images/member/order-ico1-on.svg);
}
.member-index .order-icons .item a:hover [class*=ico-].ico-2:after {
  background-image: url(../images/member/order-ico2-on.svg);
}
.member-index .order-icons .item a:hover [class*=ico-].ico-3:after {
  background-image: url(../images/member/order-ico3-on.svg);
}
.member-index .order-icons .item a:hover [class*=ico-].ico-4:after {
  background-image: url(../images/member/order-ico4-on.svg);
}
.member-index .order-icons .item a:hover [class*=ico-].ico-5:after {
  background-image: url(../images/member/order-ico5-on.svg);
}
.member-index .order-icons .item p {
  margin: 0.19rem 0 0 0;
  text-align: center;
}
.member-index .order-icons .item p span {
  color: var(--primary-color);
  margin-left: 0.05rem;
}
.member-index .order-icons .item [class*=ico-] {
  width: 0.7rem;
  height: 0.7rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/member/cicrle.svg');
  display: flex;
  align-items: center;
  justify-content: center;
}
.member-index .order-icons .item [class*=ico-]:after {
  display: block;
  content: '';
  width: calc(38 / 70 * 100%);
  height: calc(38 / 70 * 100%);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}
.member-index .order-icons .item [class*=ico-].ico-1:after {
  background-image: url(../images/member/order-ico1.svg);
}
.member-index .order-icons .item [class*=ico-].ico-2:after {
  background-image: url(../images/member/order-ico2.svg);
}
.member-index .order-icons .item [class*=ico-].ico-3:after {
  background-image: url(../images/member/order-ico3.svg);
}
.member-index .order-icons .item [class*=ico-].ico-4:after {
  background-image: url(../images/member/order-ico4.svg);
}
.member-index .order-icons .item [class*=ico-].ico-5:after {
  background-image: url(../images/member/order-ico5.svg);
}
@media (min-width: 1025px) {
  .member-index .row-layout .member-box {
    flex: 1;
    margin-bottom: var(--pm__20);
  }
  .member-index .row-layout .member-box:last-child {
    margin-left: var(--pm__20);
  }
}
@media (max-width: 1024px) {
  .member-index .order-icons .item [class*=ico-] {
    width: 0.5rem;
    height: 0.5rem;
  }
  .member-index .order-icons .item p span {
    display: block;
    margin-top: 0.05rem;
  }
}
[class*=arrows-] {
  position: absolute;
  top: 50%;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(var(--black-color__rgb), 0.1);
  margin-top: -0.25rem;
  cursor: pointer;
  transition: 0.3s;
}
[class*=arrows-]:after {
  display: block;
  content: '';
  width: 0.08rem;
  height: 0.12rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/more-white.svg');
}
[class*=arrows-].arrows-prev {
  left: 0;
}
[class*=arrows-].arrows-prev:after {
  transform: rotateY(180deg);
}
[class*=arrows-].arrows-next {
  right: 0;
}
[class*=arrows-]:hover {
  background-color: var(--primary-color);
}
.same-list-inner {
  border-radius: var(--pm__10);
  border: solid 0.01rem #e5e5e5;
  overflow: hidden;
  cursor: pointer;
}
.same-list-inner .pic {
  position: relative;
  z-index: 1;
  background-color: #fafafa;
}
.same-list-inner .pic figure {
  padding-bottom: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.same-list-inner .pic figure:not(.scene) {
  background-size: 67% auto;
}
.same-list-inner .pic .scene {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
  padding: 0;
  opacity: 0;
  transition: 0.3s;
}
.same-list-inner .txt {
  padding: 0.2rem;
}
.same-list-inner .txt h4 {
  font-size: var(--font-size__18);
  font-weight: var(--font-weight__r);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.same-list-inner .txt h4 span {
  margin-left: 0.5em;
}
.same-list-inner .txt p {
  margin: 0.14rem 0 0 0;
  color: var(--primary-color);
}
.same-list-inner .txt p span {
  font-size: var(--font-size__18);
}
.same-list-inner .txt p i {
  font-size: var(--font-size__14);
}
.same-list-inner .send-time {
  color: #666666;
  font-size: var(--font-size__14);
  line-height: 1.85714286em;
  margin-top: 0.05rem;
}
@media (min-width: 1025px) {
  .same-list-inner:hover .pic .scene {
    opacity: 1;
  }
}
.my-collect {
  position: relative;
  z-index: 1;
  margin: 0 calc(var(--pm__30) * -1);
  padding: 0 var(--pm__50);
  overflow: hidden;
}
.my-collect [class*=arrows-] {
  top: calc(50% - 0.32rem);
}
.my-collect [class*=arrows-].arrows-prev {
  left: -0.25rem;
  padding-left: 0.2rem;
}
.my-collect [class*=arrows-].arrows-next {
  right: -0.25rem;
  padding-right: 0.2rem;
}
.my-collect .collect-swiper {
  padding-bottom: 0.32rem;
}
.collect-swiper {
  --swiper-pagination-bullet-width: 0.1rem;
  --swiper-pagination-bullet-height: 0.1rem;
  --swiper-pagination-bullet-horizontal-gap: 0.075rem;
  --swiper-pagination-bottom: 0px;
}
.my-notice li {
  border-bottom: 1px solid rgba(var(--black-color__rgb), 0.1);
}
.my-notice li a {
  min-height: var(--pm__60);
  padding: var(--pm__20) 0;
  line-height: 1.2;
}
.my-notice li .title {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-left: 0.2rem;
  position: relative;
  flex: 1;
}
.my-notice li .title span {
  width: 0.06rem;
  height: 0.06rem;
  background-color: #ccc;
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -0.03rem;
}
.my-notice li .title span.unread {
  background-color: var(--primary-color);
}
.my-notice li time {
  font-family: var(--font-family-en);
  color: #999;
  margin-left: 0.2rem;
  flex-shrink: 0;
}
.Pages {
  display: flex;
  justify-content: center;
  padding-top: var(--pm__40);
}
.Pages .el-pagination.is-background {
  padding: 0;
}
.Pages .el-pagination.is-background [class*=btn-] {
  width: 0.4rem;
  height: 0.4rem;
  background-color: #f5f7f7;
  border-radius: 0.05rem;
  margin: 0;
}
.Pages .el-pagination.is-background .el-pager {
  margin: 0 0.05rem;
}
.Pages .el-pagination.is-background .el-pager li {
  margin: 0 0.05rem;
  min-width: 0.4rem;
  line-height: 0.4rem;
  height: 0.4rem;
  font-size: var(--font-size__16);
  font-family: var(--font-family-en);
  border-radius: 0.05rem;
}
.Pages .el-pagination.is-background .el-pager li:not(.disabled).active {
  background-color: var(--primary-color);
}
.change-password .formBox {
  padding: 0;
}
.change-password .formBox .el-form-item__label {
  min-width: 6em;
}
.change-password .formBox .getCode {
  --rtb: 0px;
  border-radius: 0 0.04rem 0.04rem 0;
}
.change-password .formBox .getCode:not(.disabled) {
  background-color: var(--primary-color);
  color: var(--white-color);
}
.collect-list li {
  --limr: var(--pm__30);
  --lin: 6;
  position: relative;
  z-index: 1;
}
.collect-list .batch-mode .checkbox {
  position: absolute;
  width: 0.24rem;
  height: 0.24rem;
  border: solid 0.01rem #cccccc;
  z-index: 10;
  right: 0.1rem;
  top: 0.1rem;
  border-radius: 50%;
  cursor: pointer;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-size: auto 0.1rem;
}
.collect-list .batch-mode .checkbox.checked {
  border-color: var(--primary-color);
  background-image: url(../images/checked.svg);
}
@media (min-width: 1025px) {
  .collect-list li:not(:nth-child(6n)) {
    margin-right: var(--limr);
  }
  .collect-list li:nth-child(6) ~ li {
    margin-top: var(--limr);
  }
}
@media (max-width: 1024px) {
  .collect-list li {
    --lin: 2;
  }
  .collect-list li:not(:nth-child(2n)) {
    margin-right: var(--limr);
  }
  .collect-list li:nth-child(2) ~ li {
    margin-top: var(--limr);
  }
}
.list-address .item {
  background-color: #f7f9fa;
  border-radius: 0.05rem;
  position: relative;
  padding: var(--pm__30);
}
.list-address .item.item-add {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.list-address .item.item-add .icon-add {
  width: 0.54rem;
  height: 0.54rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/add.svg');
}
.list-address .item.item-add .text {
  color: #666666;
  margin: 0.2rem 0 0 0;
}
.list-address .item i {
  position: absolute;
  border-radius: 0 0 0.08rem 0.08rem;
  right: var(--pm__20);
  top: 0;
  font-size: 0.14rem;
  color: var(--white-color);
  background-color: var(--primary-color);
  padding: 0 0.09rem;
  line-height: 1.53846154em;
}
.list-address .item .btns {
  border-top: 2px dotted rgba(var(--black-color__rgb), 0.12);
  padding-top: var(--pm__20);
  margin-top: var(--pm__20);
}
.list-address .item .btns .el-button {
  background-color: transparent;
}
.list-address .item .info p {
  margin: 0;
  background-repeat: no-repeat;
  padding-left: calc(24 / 16 * 1em);
}
.list-address .item .info p span {
  margin-left: 0.5em;
}
.list-address .item .info p.name {
  font-size: var(--font-size__18);
  background-size: auto calc(16 / 18 * 1em);
  padding-left: calc(24 / 18 * 1em);
  background-position: left center;
  background-image: url(../images/address-user.svg);
  margin-bottom: 1em;
}
.list-address .item .info p.address {
  line-height: 1.625em;
  min-height: calc(26 / 16 * 2em);
  background-size: auto calc(14 / 18 * 1em);
  background-position: left top 0.5em;
  background-image: url(../images/address-home.svg);
}
@media (min-width: 1025px) {
  .list-address .item {
    --limr: 0.2rem;
    --lin: 3;
  }
  .list-address .item.item-add {
    min-height: 2.1rem;
  }
  .list-address .item:not(:nth-child(3n)) {
    margin-right: var(--limr);
  }
  .list-address .item:nth-child(3) ~ .item {
    margin-top: var(--limr);
  }
}
@media (max-width: 1024px) {
  .list-address .item:not(:last-child) {
    margin-bottom: var(--pm__20);
  }
}
.region-selectors .el-form-item {
  --limr: 0.1rem;
}
.region-selectors .el-select {
  display: block;
  width: 100%;
}
@media (min-width: 1025px) {
  .region-selectors .el-form-item {
    --lin: 4;
  }
  .region-selectors .el-form-item:not(:nth-child(4n)) {
    margin-right: var(--limr);
  }
}
@media (max-width: 1024px) {
  .region-selectors .el-form-item {
    --lin: 2;
  }
  .region-selectors .el-form-item:not(:nth-child(2n)) {
    margin-right: var(--limr);
  }
  .region-selectors .el-form-item:nth-child(2) ~ .el-form-item {
    margin-top: var(--limr);
  }
}
.address-form .formBox {
  max-width: 11rem;
  padding: 0;
}
.cart-tips {
  background-color: #f7f9fa;
  border-radius: 0.05rem;
  padding: var(--pm__20) var(--pm__30);
  color: #999999;
  font-size: var(--font-size__14);
  line-height: 1.2;
}
.cart-table [class*=type-] {
  display: flex;
  align-items: center;
  border-bottom: var(--border);
  padding: var(--pm__20) 0;
}
.cart-table [class*=type-].type-top {
  color: #999999;
}
.cart-table [class*=type-].type-top .pic {
  flex: 1;
  width: auto;
  padding-left: 20%;
}
.cart-table [class*=type-].type-list {
  padding: var(--pm__30) 0;
}
.cart-table [class*=type-].type-list .pic {
  border-radius: 0.05rem;
  background-color: #fafafa;
  overflow: hidden;
}
.cart-table [class*=type-] .item:not(.num) {
  flex-shrink: 0;
}
.cart-table [class*=type-] .item:not(.info) {
  text-align: center;
}
.cart-table [class*=type-] .info {
  display: flex;
  align-items: center;
}
.cart-table [class*=type-] .info .child:not(.txt) {
  flex-shrink: 0;
}
.cart-table [class*=type-] .info .pic {
  margin-left: var(--pm__20);
  width: calc(130 / 520 * 100%);
}
.cart-table [class*=type-] .info .pic figure {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  background-size: 67% auto;
  padding-bottom: 100%;
}
.cart-table [class*=type-] .info .txt {
  flex: 1;
  margin-left: var(--pm__30);
}
.cart-table [class*=type-] .num .num-box {
  margin: 0 auto;
  display: flex;
  align-items: center;
  max-width: 1.5rem;
  border-radius: 0.04rem;
  border: solid 0.01rem #e5e5e5;
}
.cart-table [class*=type-] .num .num-box i {
  display: block;
  width: 0.37rem;
  flex-shrink: 0;
  cursor: pointer;
}
.cart-table [class*=type-] .num .num-box .el-input {
  width: auto;
  flex: 1;
}
.cart-table [class*=type-] .num .num-box .el-input .el-input__inner {
  border-radius: 0;
  border-top: 0;
  border-bottom: 0;
  text-align: center;
  height: 0.36rem;
  line-height: 0.36rem;
  padding: 0;
}
.cart-table .name {
  font-size: var(--font-size__18);
  line-height: 1.2;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cart-table dl {
  margin-top: var(--pm__10);
}
.cart-table dl dd {
  color: #808080;
  line-height: 1.625em;
}
.cart-table .el-checkbox {
  display: flex;
  align-items: center;
}
.cart-table .el-checkbox__inner {
  width: 0.24rem;
  height: 0.24rem;
  border-radius: 50%;
}
.cart-table .el-checkbox__inner:after {
  display: none;
}
.cart-table .el-checkbox__input.is-checked .el-checkbox__inner {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/checked-white.svg');
  background-size: auto 0.1rem;
}
.cart-table .el-checkbox__label {
  font-size: var(--font-size__16);
  padding-left: 0.1rem;
  color: #999;
  line-height: 1.5em;
  font-weight: var(--font-weight__r);
}
.cart-table .estimated-price {
  color: var(--primary-color);
  font-size: var(--font-size__18);
}
.cart-table .estimated-price span {
  font-size: var(--font-size__16);
  font-weight: var(--font-weight__l);
}
.cart-table .bottom-total {
  padding-top: var(--pm__30);
  margin-top: var(--pm__30);
  border-top: var(--border);
}
.cart-table .bottom-total span {
  margin-right: var(--pm__30);
}
.cart-table .bottom-total .btn {
  display: flex;
  align-items: center;
  cursor: pointer;
  background-color: var(--primary-color);
  color: var(--white-color);
  font-size: var(--font-size__18);
  height: 0.5rem;
  padding: 0 var(--pm__30);
  border-radius: 2em;
}
.cart-table .bottom-total .btn:before {
  display: block;
  content: '';
  width: 0.2rem;
  height: 0.2rem;
  margin-right: 0.1rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/cart-white.svg');
}
@media (min-width: 1025px) {
  .cart-table [class*=type-] .info {
    width: calc(520 / 1512 * 100%);
  }
  .cart-table [class*=type-] .price {
    width: calc(220 / 1512 * 100%);
  }
  .cart-table [class*=type-] .action {
    width: calc(200 / 1512 * 100%);
  }
  .cart-table [class*=type-] .num {
    flex: 1;
  }
}
@media (max-width: 1024px) {
  .cart-table [class*=type-] {
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .cart-table [class*=type-] .info {
    width: 100%;
    padding-right: calc(2em + var(--pm__30) * 2);
  }
  .cart-table [class*=type-] .price,
  .cart-table [class*=type-] .num {
    width: calc(100% / 3);
  }
  .cart-table [class*=type-].type-list {
    position: relative;
  }
  .cart-table [class*=type-].type-list .info {
    margin-bottom: var(--pm__30);
  }
  .cart-table [class*=type-].type-list .price,
  .cart-table [class*=type-].type-list .num {
    line-height: 0.36rem;
  }
  .cart-table [class*=type-].type-list .price:before,
  .cart-table [class*=type-].type-list .num:before {
    display: block;
    border-top: var(--border);
    border-bottom: var(--border);
    margin-bottom: 0.1rem;
    color: #999;
  }
  .cart-table [class*=type-].type-list .price:before {
    content: '单价';
  }
  .cart-table [class*=type-].type-list .num:before {
    content: '数量';
  }
  .cart-table [class*=type-].type-list .num + .price:before {
    content: '合计';
  }
  .cart-table [class*=type-].type-list .action {
    position: absolute;
    right: 0;
    top: 0;
    padding: var(--pm__30);
    z-index: 10;
  }
  .cart-table [class*=type-].type-top .item:not(.info) {
    display: none;
  }
  .cart-table [class*=type-].type-top .info .pic {
    display: none;
  }
  .cart-table .estimated-price {
    font-size: var(--font-size__14);
    line-height: calc(18 / 14);
  }
  .cart-table .estimated-price span {
    display: block;
  }
}
.totalcontent {
  margin-top: var(--pm__30);
  border: var(--border);
}
.totalcontent .price {
  padding: var(--pm__30);
  display: flex;
  justify-content: flex-end;
}
.totalcontent .price table {
  table-layout: fixed;
  width: auto;
}
.totalcontent .price table td {
  text-align: right;
  padding: 0.1rem 0;
}
.totalcontent .price table td:nth-child(2) {
  min-width: 1.05rem;
}
.totalcontent .price table td span {
  color: var(--primary-color);
  font-size: var(--font-size__18);
  font-weight: var(--font-weight__b);
}
.totalcontent .all-price {
  background-color: #f7f9fa;
  border-top: var(--border);
}
.totalcontent .all-price span {
  color: #999999;
  font-size: var(--font-size__14);
}
.totalcontent .btn {
  cursor: pointer;
  font-size: var(--font-size__18);
  line-height: 2.77777778em;
  padding: 0 var(--pm__50);
  display: block;
  background-color: var(--primary-color);
  color: var(--white-color);
  margin-left: 0.2rem;
}
.totalcontent .btn span {
  color: var(--white-color);
  margin-left: 0.1rem;
}
.countdown-tips {
  color: #666666;
  display: flex;
  margin-bottom: var(--pm__50);
}
.countdown-tips span {
  margin-left: 0.5em;
}
.countdown-tips i {
  color: var(--primary-color);
  font-style: normal;
}
.section-box {
  margin-bottom: var(--pm__60);
}
.section-box .message-box {
  max-width: 5rem;
}
.section-box .message-box .el-textarea__inner {
  background-color: #fafcfc;
  border-color: #f0f0f0;
}
.section-box .message-box .el-input__count {
  color: rgba(153, 153, 153, 0.4);
  background: none;
}
.section-title {
  /* background-color: #f7f9fa; */
  /* margin-bottom: var(--pm__30);
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 0.2rem;
  border-left: 0.03rem solid var(--primary-color); */
}
.section-title h3 {
  font-size: var(--font-size__18);
  line-height: 2.44444444em;
  margin: 0;
}
.section-title .title-actions {
  display: flex;
  align-items: center;
}
.section-title .title-actions a {
  cursor: pointer;
  color: var(--primary-color);
  font-size: var(--font-size__14);
}
.section-title .title-actions a + a {
  margin-left: 0.2rem;
}
.section-title .title-actions a.open-btn {
  display: flex;
  align-items: center;
  color: #808080;
}
.section-title .title-actions a.open-btn:after {
  display: block;
  content: '';
  width: 0.1rem;
  height: 0.06rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/select.svg');
  opacity: 0.6;
  margin-left: 0.08rem;
  transition: 0.3s;
}
.section-title .title-actions a.open-btn.close:after {
  transform: rotate(180deg);
}
.address-list .card {
  --limr: 0.2rem;
  border-radius: 0.05rem;
  border: solid 0.01rem #e5e5e5;
  padding: var(--pm__30);
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.address-list .card.selected {
  border-color: var(--primary-color);
}
.address-list .card .content > div {
  padding-left: 0.24rem;
  background-position: left 0;
  background-repeat: no-repeat;
}
.address-list .card .content .user-info {
  background-image: url(../images/address-user.svg);
  background-size: auto 1em;
  margin-bottom: 0.1rem;
  display: flex;
  align-items: center;
}
.address-list .card .content .user-info span {
  display: block;
  font-size: var(--font-size__18);
}
.address-list .card .content .user-info span + span {
  margin-left: 1em;
}
.address-list .card .content .text {
  background-image: url(../images/address-home.svg);
  background-size: auto calc(14 / 16 * 1em);
  line-height: 1.625em;
  background-position: left 0.4em;
  width: calc(100% + 2em);
}
.address-list .card .actions {
  flex-shrink: 0;
  margin-left: 0.2rem;
  display: flex;
  font-size: var(--font-size__14);
}
.address-list .card .actions a:not(.active) {
  cursor: pointer;
}
.address-list .card .actions a.edit {
  color: var(--primary-color);
}
.address-list .card .actions a.default {
  color: #808080;
}
.address-list .card .actions a + a {
  margin-left: var(--pm__20);
}
.address-list .card .selected-icon {
  position: absolute;
  right: -1px;
  bottom: 0;
  width: 0.38rem;
  height: 0.36rem;
  background: var(--primary-color);
  clip-path: polygon(100% 0%, 100% 100%, 0% 100%, 0% 100%);
  -webkit-clip-path: polygon(100% 0%, 100% 100%, 0% 100%, 0% 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.1rem 0 0 0.14rem;
}
.address-list .card .selected-icon:after {
  display: block;
  content: '';
  width: 0.14rem;
  height: 0.1rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/address-checked-white.svg');
}
@media (min-width: 1025px) {
  .address-list .card {
    --lin: 3;
  }
  .address-list .card:not(:nth-child(3n)) {
    margin-right: var(--limr);
  }
  .address-list .card:nth-child(3) ~ .card {
    margin-top: var(--limr);
  }
  .address-list .card:not(.selected) .content .text {
    width: calc(100% + 3em + var(--pm__20));
  }
  .address-list .card:not(.selected) .actions {
    opacity: 0;
    visibility: hidden;
  }
  .address-list .card:not(.selected):hover .actions {
    opacity: 1;
    visibility: visible;
  }
}
@media (max-width: 1024px) {
	.page-all{
		padding-left: 0;
		padding-top: 56px;
	}
	header{
		bottom: inherit;
		right: 0;
		width: 100%;
	}
	header .header-container{
		display: flex;
		justify-content: space-between;
		padding:12px 10px;
	}
	header .header-container .logo{
		display: flex;
		align-items: center;
	}
	header .header-container .logo-title{
		margin:0;
		margin-left: 0.15rem;
	}
  .address-list .card:not(:last-child) {
    margin-bottom: var(--pm__20);
  }
  .address-list .card .content .text {
    width: calc(100% + (14 / 16 * 8em) + var(--pm__20) * 2 - 0.38rem);
  }
}
.product-table [class*=table-]:not(.table-body) {
  display: flex;
  align-items: center;
}
.product-table [class*=col-]:not(.col-product) {
  flex: 1;
  text-align: center;
}
.product-table .table-header {
  border-bottom: var(--border);
  color: #999999;
  padding-bottom: var(--pm__30);
}
.product-table .table-row {
  padding: var(--pm__30) 0;
  border-bottom: var(--border);
}
.product-table .prod-info {
  display: flex;
  align-items: center;
}
.product-table .prod-info .pic {
  width: 1.3rem;
  flex-shrink: 0;
  background-color: #fafafa;
}
.product-table .prod-info .pic figure {
  padding-bottom: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  background-size: 67% auto;
}
.product-table .prod-info .details {
  flex: 1;
  margin-left: var(--pm__30);
}
.product-table .prod-info .name {
  font-size: var(--font-size__18);
  margin-bottom: 0.5em;
  line-height: 1.2;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.product-table .prod-info dd {
  color: #808080;
  line-height: 1.625em;
}
@media (min-width: 1025px) {
  .product-table .col-product {
    width: calc(480 / 1512 * 100%);
    flex-shrink: 0;
  }
  .product-table .table-body .col-price,
  .product-table .table-body .col-total {
    font-size: var(--font-size__18);
  }
  .product-table .table-body .col-price span,
  .product-table .table-body .col-total span {
    font-size: var(--font-size__14);
  }
}
@media (max-width: 1024px) {
  .product-table [class*=table-]:not(.table-body) {
    flex-wrap: wrap;
    align-items: self-start;
  }
  .product-table .col-product {
    width: 100%;
  }
  .product-table [class*=col-]:not(.col-product) {
    flex: 1;
    text-align: center;
  }
  .product-table .table-row [class*=col-]:not(.col-product) {
    margin-top: 0.2rem;
  }
  .product-table .table-row [class*=col-]:not(.col-product):before {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    border-top: var(--border);
    border-bottom: var(--border);
    height: 2em;
    margin-bottom: 1em;
    color: #999;
  }
  .product-table .table-row .col-price:before {
    content: '价格';
  }
  .product-table .table-row .col-quantity:before {
    content: '数量';
  }
  .product-table .table-row .col-total:before {
    content: '合计';
  }
  .product-table .table-header {
    display: none !important;
  }
}
.payment-methods .option,
.payment-methods .txt {
  display: flex;
  align-items: center;
}
.payment-methods .selected-icon {
  width: 0.2rem;
  height: 0.2rem;
  border: solid 0.01rem #cccccc;
  border-radius: 50%;
  display: flex;
  align-items: center;
  margin-right: 0.16rem;
  justify-content: center;
}
.payment-methods .selected-icon:after {
  display: block;
  content: '';
  width: 50%;
  height: 50%;
  border-radius: 50%;
  background-color: var(--primary-color);
  opacity: 0;
}
.payment-methods .icon {
  width: 0.24rem;
  height: 0.24rem;
  flex-shrink: 0;
  margin-right: 0.07rem;
}
.payment-methods .icon img {
  width: 100%;
  height: 100%;
}
.payment-methods .option {
  cursor: pointer;
}
.payment-methods .option + .option {
  margin-left: var(--pm__50);
}
.payment-methods .option.selected .selected-icon:after {
  opacity: 1;
}
.pay-alibaba {
  margin-top: var(--pm__40);
}
.pay-alibaba a {
  cursor: pointer;
  border: solid 0.01rem var(--primary-color);
  border-radius: 0.06rem;
  line-height: 2.5em;
  display: flex;
  align-items: center;
  padding: 0 var(--pm__20);
  margin-right: var(--pm__20);
}
.pay-alibaba a:after {
  display: block;
  content: '';
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}
.pay-alibaba a.link-buy {
  background-color: var(--primary-color);
  color: var(--white-color);
}
.pay-alibaba a.link-buy:after {
  width: 0.08rem;
  height: 0.14rem;
  background-image: url(../images/more-white.svg);
  margin-left: 0.14rem;
}
.pay-alibaba a.download {
  background-color: #f7f9fa;
  color: var(--primary-color);
}
.pay-alibaba a.download:after {
  width: 0.14rem;
  height: 0.14rem;
  background-image: url(../images/download.svg);
  margin-left: 0.12rem;
}
.pay-alibaba .tips {
  color: #999999;
  font-size: var(--font-size__14);
  line-height: 2;
}
.address-dialog .el-dialog {
  max-width: 10rem;
  height: calc(3.03rem + 60px + 54px + 70px);
}
.address-dialog .el-dialog .formBox {
  padding: 0;
}
@media (max-width: 1024px) {
  .address-dialog .el-dialog {
    height: calc(3.03rem + 60px + 54px + 70px + 0.46rem + 0.1rem);
  }
}
.el-message-box__wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 3%;
}
.myOrder-main .box-name {
  margin-bottom: 0;
  border: 0;
}
.order-tab {
  background-color: #f7f9fa;
  padding: 0 var(--pm__30);
}
.order-tab .el-tabs__header {
  margin: 0;
}
.order-tab .el-tabs__nav-wrap {
  margin: 0;
}
.order-tab .el-tabs__nav-wrap::after {
  display: none;
}
.order-tab .el-tabs__item {
  padding: 0;
  line-height: calc(60 / 18);
  color: #666666;
  height: auto;
  font-size: var(--font-size__18);
  font-weight: var(--font-weight__r);
}
.order-tab .el-tabs__item:not(:last-child) {
  padding-right: var(--pm__50);
}
.order-tab .el-tabs__item:hover,
.order-tab .el-tabs__item.is-active {
  color: var(--primary-color);
}
.order-tab .el-tabs__active-bar {
  background-color: var(--primary-color);
}
.my-order {
  --w: 1452;
}
.my-order .order-item {
  border-radius: 0.05rem;
  overflow: hidden;
  border: solid 0.01rem #e5e5e5;
}
.my-order .order-item:not(:last-child) {
  margin-bottom: 0.2rem;
}
.my-order .order-item .order-header {
  display: flex;
  background-color: #f7f9fa;
  border-bottom: solid 0.01rem #e5e5e5;
  padding: 0 var(--pm__30);
  color: #666666;
}
.my-order .show-all {
  display: flex;
  justify-content: flex-end;
  border-top: var(--border);
  margin-top: var(--pm__10);
}
.my-order .show-all span {
  display: block;
  padding: 0 1em;
  line-height: 2;
  border-radius: 0 0 0.05rem 0.05rem;
  background: rgba(var(--black-color__rgb), 0.1);
  font-size: var(--font-size__14);
  cursor: pointer;
}
.my-order [class*=list-] {
  display: flex;
}
.my-order .tr-list {
  display: flex;
}
.my-order .list-top {
  color: #999999;
  padding: 0 var(--pm__30);
  align-items: center;
  line-height: 0.6rem;
}
.my-order .list-top .td-goods {
  padding-left: 1.3rem;
}
.my-order .list-body {
  padding: var(--pm__30);
  margin: 0 -1px;
}
.my-order .list-body .tr-list {
  flex-direction: column;
}
.my-order .list-body .list + .list {
  margin-top: var(--pm__10);
}
.my-order .td-goods {
  display: flex;
  align-items: center;
}
.my-order .td-goods .pic {
  width: calc(130 / 402 * 100%);
  flex-shrink: 0;
  background-color: #fafafa;
}
.my-order .td-goods .pic figure {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-bottom: 100%;
  background-size: 67% auto;
}
.my-order .td-goods .info {
  text-align: left;
  flex: 1;
  margin-left: var(--pm__30);
}
.my-order .td-goods .info .title {
  font-size: var(--font-size__18);
  margin-bottom: 0.1rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.my-order .td-goods .info .sub {
  color: #808080;
  line-height: 1.625em;
}
.my-order .tr-price span {
  font-size: var(--font-size__14);
}
.my-order .tr-price b {
  color: var(--primary-color);
}
.my-order .tr-ops {
  display: flex;
  align-items: center;
}
.my-order .tr-ops a {
  cursor: pointer;
  min-width: 1.2rem;
  padding: 0 0.15rem;
  display: inline-flex;
  align-items: center;
  border-radius: 0.18rem;
  line-height: 2.125em;
  justify-content: center;
  border: 1px solid transparent;
  transition: 0.3s;
}
.my-order .tr-ops a span {
  font-size: var(--font-size__14);
  margin-right: 0.08rem;
}
.my-order .tr-ops .btn-full {
  background-color: var(--primary-color);
  color: var(--white-color);
}
.my-order .tr-ops .btn-border {
  border-color: #e0e0e0;
  color: #666666;
}
.my-order .tr-ops .btn-border:hover {
  background-color: rgba(var(--primary-color__rgb), 0.1);
  color: var(--primary-color);
  border-color: rgba(var(--primary-color__rgb), 0.2);
}
.my-order .tr-list {
  flex: 1;
}
.my-order .tr-list [class*=td-]:not(.td-goods) {
  flex-shrink: 0;
  width: calc(200 / 802 * 100%);
  text-align: center;
}
.my-order .tr-list .td-goods {
  flex: 1;
}
.my-order .tr-list .list {
  display: flex;
  align-items: center;
}
.my-order .list-body .td-status,
.my-order .list-body .td-list + .td-price {
  padding: 0.1rem 0;
}
@media (min-width: 1025px) {
  .my-order .order-item .order-header {
    line-height: 0.5rem;
    justify-content: space-between;
    align-items: center;
  }
  .my-order [class*=tr-]:not(.tr-list) {
    flex-shrink: 0;
    text-align: center;
  }
  .my-order .tr-ops {
    width: calc(250 / var(--w) * 100%);
    flex-direction: column;
  }
  .my-order .tr-ops a + a {
    margin-top: 0.1rem;
  }
  .my-order .tr-price,
  .my-order .tr-status {
    width: calc(200 / var(--w) * 100%);
  }
  .my-order .list-body .tr-status,
  .my-order .list-body .tr-price {
    padding-top: var(--pm__10);
  }
}
@media (max-width: 1024px) {
  .my-order {
    margin-top: var(--pm__30);
  }
  .my-order .order-item .order-header {
    flex-direction: column;
    padding: var(--pm__20) var(--pm__30);
    line-height: 1.5;
  }
  .my-order .list-top {
    display: none;
  }
  .my-order .list-body {
    display: block;
    position: relative;
  }
  .my-order .list-body .tr-list {
    width: 100%;
    display: block;
  }
  .my-order .list-body .tr-price {
    line-height: 0.36rem;
    text-align: right;
    border-top: var(--border);
  }
  .my-order .list-body .tr-price::before {
    content: '合计:';
  }
  .my-order .list-body .tr-status {
    position: absolute;
    right: 0;
    top: 0;
    padding: 0.05rem 0.1rem;
    background-color: rgba(var(--black-color__rgb), 0.1);
    border-radius: 0 0 0 0.05rem;
  }
  .my-order .tr-ops {
    width: 100%;
    justify-content: flex-end;
    border-top: var(--border);
    padding-top: var(--pm__20);
  }
  .my-order .tr-ops a:not(:last-child) {
    margin-right: var(--pm__20);
  }
  .my-order .show-all {
    margin-top: 0;
    border-top: 0;
  }
}
@media (max-width: 480px) {
  .my-order .tr-list .list {
    flex-wrap: wrap;
    padding-bottom: var(--pm__30);
  }
  .my-order .tr-list .list:not(:last-child) {
    border-bottom: var(--border);
  }
  .my-order .tr-list .list + .list {
    margin-top: var(--pm__30);
  }
  .my-order .tr-list .list .td-goods {
    width: 100%;
    flex: none;
    margin-bottom: var(--pm__20);
  }
  .my-order .tr-list .list .td-qty,
  .my-order .tr-list .list .td-price {
    width: 50%;
    background-color: rgba(var(--black-color__rgb), 0.01);
    line-height: 2;
  }
  .my-order .tr-list .list .td-qty:before,
  .my-order .tr-list .list .td-price:before {
    display: block;
    color: #999;
    border-bottom: var(--border);
    margin-bottom: var(--pm__10);
  }
  .my-order .tr-list .list .td-price:before {
    content: '单价';
  }
  .my-order .tr-list .list .td-qty:before {
    content: '数量';
  }
}
.order-details [class*=step-] {
  margin-bottom: var(--pm__40);
}
.order-details [class*=step-] .item {
  display: flex;
  flex-direction: column;
  align-items: center;
  counter-increment: itemcounter;
  padding: 0 var(--pm__70);
  position: relative;
}
.order-details [class*=step-] .item i {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 0.38rem;
  height: 0.38rem;
  border: solid 0.06rem #e1e6e8;
  border-radius: 50%;
  position: relative;
  z-index: 3;
}
.order-details [class*=step-] .item i:after {
  color: var(--white-color);
  font-weight: var(--font-weight__m);
  background: url(../images/finish.svg) no-repeat center center var(--primary-color);
  background-size: 60% auto;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  content: '';
}
.order-details [class*=step-] .item p {
  text-align: center;
  font-weight: var(--font-weight__l);
  margin: 0.14rem 0 0 0;
}
.order-details [class*=step-] .item:not(:last-child):after {
  position: absolute;
  top: 0.17rem;
  height: 0.04rem;
  width: 100%;
  left: 50%;
  content: '';
  z-index: 1;
  background-color: var(--primary-color);
}
.order-details [class*=step-].step-1 .item:after {
  background-color: #e1e6e8;
}
.order-details [class*=step-].step-1 .item:nth-child(1) ~ .item i:after {
  content: counters(itemcounter, ".", decimal-leading-zero);
  background-image: none;
}
.order-details [class*=step-].step-2 .item:nth-child(1) ~ .item:after {
  background-color: #e1e6e8;
}
.order-details [class*=step-].step-2 .item:nth-child(2) ~ .item i:after {
  content: counters(itemcounter, ".", decimal-leading-zero);
  background-image: none;
}
.order-details [class*=step-].step-3 .item:nth-child(3):after {
  background-color: #e1e6e8;
}
.order-details [class*=step-].step-3 .item:nth-child(3) ~ .item i:after {
  content: counters(itemcounter, ".", decimal-leading-zero);
  background-image: none;
}
.order-details .info-box {
  margin-bottom: var(--pm__20);
}
.order-details .info-box:not(.info-box-cancel) {
  border-top: var(--border);
  padding-top: var(--pm__60);
}
.order-details .info-box .title {
  font-size: var(--font-size__18);
  margin-bottom: var(--pm__20);
}
.order-details .info-box dl dd {
  color: #666666;
  font-weight: var(--font-weight__l);
  line-height: 1.875em;
}
.order-details .product-table {
  margin-top: var(--pm__60);
  border-radius: 0.05rem;
  border: solid 0.01rem #e5e5e5;
  overflow: hidden;
}
.order-details .product-table .col-product {
  padding-left: var(--pm__30);
}
.order-details .product-table .table-header {
  background-color: #f7f9fa;
  padding: 0;
  line-height: 3.125em;
  border-bottom-color: #e5e5e5;
}
.order-details .product-table .table-header .col-product {
  text-align: center;
}
.order-details .product-table .table-row:last-child {
  border-bottom: 0;
}
.order-details .totalcontent {
  border: 0;
}
.order-details .totalcontent .price {
  padding: 0;
}
.order-details .ops {
  border-top: var(--border);
  margin-top: var(--pm__30);
  padding-top: var(--pm__10);
}
.order-details .ops a {
  display: block;
  cursor: pointer;
  padding: 0 2em;
  line-height: 2.4;
  border: 1px solid var(--primary-color);
}
.order-details .ops a span {
  margin-right: 0.08rem;
  font-size: var(--font-size__14);
}
.order-details .ops a.btn-full {
  background-color: var(--primary-color);
  color: var(--white-color);
}
.order-details .ops a.btn-border {
  color: var(--primary-color);
}
.order-details .ops a + a {
  margin-left: 0.1rem;
}
@media (max-width: 480px) {
  .order-details [class*=step-] .item {
    padding: 0 var(--pm__40);
  }
}
.same-list-inner {
  height: 100%;
}
.same-list-inner .txt .name {
  display: flex;
  line-height: 1.2;
}
.same-list-inner .txt .name h4 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.same-list-inner .txt .name span {
  flex-shrink: 0;
  margin-left: 0.5em;
  display: block;
}
.list-product + .column-name {
  margin-top: var(--pm__100);
}
.list-product .item {
  --limr: 0.2rem;
  position: relative;
  z-index: 1;
}
.list-product .item .collect {
  position: absolute;
  padding: var(--pm__20);
  top: 0;
  right: 0;
  width: max-content;
  z-index: 10;
}
.list-product .item .collect a {
  width: 0.32rem;
  height: 0.32rem;
  display: block;
  border-radius: 50%;
  background: no-repeat center center url(../images/collect.svg) var(--white-color);
  background-size: auto 50%;
  cursor: pointer;
}
.list-product .item .collect a.collected {
  background-color: var(--primary-color);
  background-image: url(../images/collect-white.svg);
}
.list-product .item .label {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 10;
  font-family: var(--font-family__en);
  font-size: var(--font-size__14);
  background-color: #c8c8c8;
  border-radius: 0 0 var(--pm__20) 0;
  padding: 0 0.12rem;
  line-height: 2.14285714em;
  color: var(--white-color);
}
.list-product .item:nth-child(1) .label {
  background-color: #ff554c;
}
.list-product .item:nth-child(2) .label {
  background-color: #ffc911;
}
.list-product .item:nth-child(3) .label {
  background-color: #0fe49e;
}
@media (min-width: 1025px) {
  .list-product .item {
    --lin: 5;
  }
  .list-product .item:not(:nth-child(5n)) {
    margin-right: var(--limr);
  }
  .list-product .item:nth-child(5) ~ .item {
    margin-top: var(--limr);
  }
  .list-product .item .collect {
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
  }
  .list-product .item:hover .collect {
    opacity: 1;
    visibility: visible;
  }
}
@media (max-width: 1024px) {
  .list-product .item {
    --lin: 2;
  }
  .list-product .item:not(:nth-child(2n)) {
    margin-right: var(--limr);
  }
  .list-product .item:nth-child(2) ~ .item {
    margin-top: var(--limr);
  }
}
.page-ban {
  position: relative;
  z-index: 1;
}
.page-ban > img {
  max-height: 4rem;
}
.page-ban .product-search {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
}
.page-ban .product-search .prod-input-select {
  --height: 0.7rem;
  background: var(--white-color);
  max-width: 7.6rem;
  width: 95%;
  border-radius: var(--pm__20);
  overflow: hidden;
  display: flex;
  align-items: center;
}
.page-ban .product-search .prod-input-select .el-input-group__prepend {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: max-content;
  max-width: 1.28rem;
  border: 0;
  padding: 0;
  background: transparent;
  flex-shrink: 0;
}
.page-ban .product-search .prod-input-select .el-input-group__prepend .el-select {
  margin: 0;
  display: block;
}
.page-ban .product-search .prod-input-select .el-input-group__prepend .el-select .el-input__inner {
  padding: 0;
  font-size: var(--font-size__20);
  color: var(--default-color);
  height: var(--height);
  line-height: var(--height);
  padding-left: 0.25rem;
}
.page-ban .product-search .prod-input-select .el-input-group__prepend:after {
  display: block;
  content: '';
  width: 0.02rem;
  height: 0.24rem;
  background-color: rgba(53, 53, 53, 0.1);
}
.page-ban .product-search .prod-input-select .el-input-group__append {
  width: 1.4rem;
  height: var(--height);
  padding: 0;
  border-radius: 0;
  border: 0;
  background-color: transparent;
  display: block;
  flex-shrink: 0;
}
.page-ban .product-search .prod-input-select .el-input-group__append .el-button {
  color: var(--white-color);
  background-color: var(--primary-color);
  width: 100%;
  height: 100%;
  display: block;
  padding: 0;
  margin: 0;
  border-radius: 0;
  font-size: var(--font-size__20);
  font-weight: var(--font-weight__b);
}
.page-ban .product-search .prod-input-select > .el-input__suffix {
  background: url(../images/search-close.svg) no-repeat center center;
  width: 0.76rem;
  background-size: auto 0.26rem;
}
.page-ban .product-search .prod-input-select > .el-input__suffix * {
  opacity: 0;
}
.page-ban .product-search .prod-input-select > .el-input__inner {
  height: var(--height);
  line-height: var(--height);
  border: 0;
  padding: 0 0.24rem;
  font-size: var(--font-size__18);
}
@media (max-width: 480px) {
  .page-ban .product-search .prod-input-select {
    --height: 0.5rem;
  }
  .page-ban .product-search .prod-input-select .el-input-group__append {
    width: 1rem;
  }
}
.filter .item {
  margin-bottom: 0.2rem;
}
.filter .item b {
  flex-shrink: 0;
  width: 1.07rem;
  line-height: 2;
}
.filter .item .tags {
  display: flex;
  flex-wrap: wrap;
}
.filter .item .tags .tag {
  display: block;
  border: solid 0.02rem transparent;
  line-height: calc(28 / 16);
  padding: 0 1em;
  color: #666;
  border-radius: 0.2rem;
  cursor: pointer;
}
.filter .item .tags .tag.aon,
.filter .item .tags .tag:hover {
  color: var(--primary-color);
}
.filter .item .tags .tag.aon {
  border-color: var(--primary-color);
}
.filter-result {
  margin-top: var(--pm__40);
  padding-top: var(--pm__50);
  border-top: var(--border);
  margin-bottom: var(--pm__30);
}
.filter-result span {
  color: var(--primary-color);
}
.recom-list {
  margin-top: var(--pm__100);
}
.recom-list .collect-swiper {
  padding-bottom: 0.52rem;
}
.product-details .intro {
  margin-bottom: var(--pm__100);
}
.product-details .intro .title-ops {
  border-bottom: var(--border);
  padding: 0.15rem 0;
  margin-bottom: var(--pm__30);
}
.product-details .intro .title-ops .tit {
  font-size: var(--font-size__26);
  font-weight: var(--font-weight__b);
  color: var(--black-color);
  flex: 1;
  margin-right: var(--pm__30);
}
.product-details .intro .title-ops .collect {
  flex-shrink: 0;
  color: #666666;
  padding-top: 0.05rem;
}
.product-details .intro .title-ops .collect a {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.product-details .intro .title-ops .collect a:before {
  display: block;
  content: '';
  width: 0.18rem;
  height: 0.16rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/collect.svg');
  margin-right: 0.1rem;
}
.product-details .intro .title-ops .collect.active a {
  color: var(--primary-color);
}
.product-details .intro .title-ops .collect.active a:before {
  background-image: url(../images/collected.svg);
}
.product-details .intro .prices {
  border-radius: var(--pm__10);
  padding: var(--pm__10) 0;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url('../images/prod_price-bg.jpg');
  justify-content: space-around;
}
.product-details .intro .prices .box {
  padding: var(--pm__10);
  text-align: center;
}
.product-details .intro .prices .price {
  font-weight: var(--font-weight__b);
  color: var(--primary-color);
  margin-top: 0.1rem;
}
.product-details .intro .prices .price span {
  font-size: var(--font-size__20);
}
.product-details .intro .other-type {
  padding: var(--pm__30) 0;
  border-bottom: var(--border);
  margin-bottom: var(--pm__30);
}
.product-details .intro .other-type .item {
  display: flex;
}
.product-details .intro .other-type .item span {
  color: #666;
  font-weight: var(--font-weight__l);
}
.product-details .intro .other-type .item p {
  margin: 0 0 0.1rem 0;
}
.product-details .intro .data-input .box {
  margin-bottom: var(--pm__20);
}
.product-details .intro .data-input .label-name {
  flex-shrink: 0;
  line-height: 0.5rem;
}
.product-details .intro .data-input .color-type dd {
  cursor: pointer;
  border-radius: 50%;
  border: solid 0.02rem transparent;
}
.product-details .intro .data-input .color-type dd:not(:last-child) {
  margin-right: var(--pm__10);
}
.product-details .intro .data-input .color-type dd.selected {
  border-color: var(--primary-color);
}
.product-details .intro .data-input .color-type dd img {
  display: block;
  border-radius: 50%;
  width: 0.5rem;
  height: 0.5rem;
  object-fit: cover;
}
.product-details .intro .data-input .length-input-select {
  flex: 1;
  max-width: 2.2rem;
  border-radius: var(--pm__10);
  border: 2px solid #e5e5e5;
}
.product-details .intro .data-input .length-input-select .el-input__inner {
  background: transparent;
  border-radius: 0;
  color: #333;
  font-size: var(--font-size__16);
  border: 0;
}
.product-details .intro .data-input .length-input-select .el-input-group__append {
  width: 80px;
  border: 0;
  background: transparent;
  border-radius: 0;
  position: relative;
}
.product-details .intro .data-input .length-input-select .el-input-group__append:before {
  position: absolute;
  content: '';
  width: 0.01rem;
  height: 1em;
  background-color: #dbdbdb;
  left: 0;
  top: 50%;
  margin-top: -0.5em;
}
.product-details .intro .data-input .add-box {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  padding: 0 0.2rem;
  color: var(--white-color);
  background-color: var(--primary-color);
  font-size: var(--font-size__18);
  border-radius: var(--pm__10);
  font-weight: var(--font-weight__b);
  margin-left: 0.05rem;
  cursor: pointer;
}
.product-details .intro .data-input .add-box::before {
  display: block;
  content: '';
  width: 0.2rem;
  height: 0.2rem;
  margin-right: 0.1rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/add-ku.svg');
}
.product-details .intro .btn-group {
  margin-top: var(--pm__40);
}
.product-details .intro .btn-group [class*=btn-] {
  margin-right: var(--pm__20);
}
.product-details .intro .left {
  display: flex;
  justify-content: space-between;
}
.product-details .intro .left .pic {
  border-radius: var(--pm__20);
}
.product-details .intro .left .pic figure {
  padding-bottom: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.product-details .intro .left .pic.default {
  background-color: #fafafa;
}
.product-details .intro .left .pic.default figure {
  background-size: 67% auto;
}
.product-details .intro .swiper-thumb {
  width: calc(85 / 645 * 100%);
  flex-shrink: 0;
  position: relative;
}
.product-details .intro .swiper-thumb .swiper {
  margin: var(--pm__40) 0 0 0;
  height: calc(100% - var(--pm__40) * 2);
}
.product-details .intro .swiper-thumb .swiper .swiper-slide {
  height: calc(100% / 5) !important;
  display: flex;
  align-items: center;
  justify-content: center;
}
.product-details .intro .swiper-thumb .swiper .swiper-slide.swiper-slide-thumb-active .pic:before {
  position: absolute;
  content: '';
  left: 0;
  top: 0;
  width: 100%;
  border-radius: var(--pm__10);
  border: 1px solid var(--primary-color);
  height: 100%;
}
.product-details .intro .swiper-thumb .pic {
  width: 100%;
  position: relative;
}
.product-details .intro .swiper-thumb .pic figure {
  border-radius: var(--pm__10);
}
.product-details .intro .swiper-thumb [class*=btn-] {
  position: absolute;
  left: 0;
  width: 100%;
  background-color: #fafafa;
  border-radius: 0.15rem;
  height: var(--pm__30);
  display: flex;
  align-items: center;
  justify-content: center;
}
.product-details .intro .swiper-thumb [class*=btn-]:not(.swiper-button-disabled) {
  cursor: pointer;
}
.product-details .intro .swiper-thumb [class*=btn-]:after {
  display: block;
  content: '';
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/select.svg');
  width: 0.12rem;
  height: 0.07rem;
  opacity: 0.5;
}
.product-details .intro .swiper-thumb [class*=btn-].btn-prev {
  top: 0;
}
.product-details .intro .swiper-thumb [class*=btn-].btn-prev:after {
  transform: rotate(-180deg);
}
.product-details .intro .swiper-thumb [class*=btn-].btn-next {
  bottom: 0;
}
.product-details .intro .swiper-thumb [class*=btn-]:hover {
  background-color: var(--primary-color);
}
.product-details .intro .swiper-thumb [class*=btn-]:hover:after {
  background-image: url(../images/select-white.svg);
}
.product-details .intro .swiper-Big {
  width: calc(540 / 645 * 100%);
  margin: 0;
}
.product-details .intro .swiper-Big .pic {
  border-radius: var(--pm__10);
  overflow: hidden;
}
.product-details .table-details {
  position: relative;
  z-index: 1;
  font-size: var(--font-size__18);
  padding-bottom: var(--pm__20);
}
.product-details .table-details:after {
  position: absolute;
  content: '';
  left: 50%;
  top: 0;
  width: 100vw;
  margin-left: -50vw;
  background-color: #fafafa;
  height: 100%;
  z-index: 1;
}
.product-details .table-details .container {
  position: relative;
  z-index: 3;
  width: 100%;
}
.product-details .table-details .item {
  --limr: 0.4rem;
}
.product-details .table-details .type dl:not(:last-child) {
  margin-bottom: var(--pm__20);
}
.product-details .table-details .type dt {
  margin-bottom: 0.08rem;
}
.product-details .table-details .type dd {
  font-size: var(--font-size__16);
  color: #666666;
  line-height: 1.375em;
}
.product-details .table-details .name {
  border-bottom: 1px solid #ebebeb;
  padding: var(--pm__40) 0 var(--pm__20) 0;
  display: flex;
  align-items: center;
  color: #999999;
  margin-bottom: var(--pm__20);
}
.product-details .table-details .name i {
  display: block;
  width: 0.22rem;
  height: 0.22rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  color: #999999;
  margin-right: 0.09rem;
}
.product-details .table-details .name i.icon-ys {
  background-image: url(../images/p-type1.svg);
}
.product-details .table-details .name i.icon-design {
  background-image: url(../images/p-type2.svg);
}
.product-details .table-details .name i.icon-cz {
  background-image: url(../images/p-type3.svg);
}
.product-details .table-details .name i.icon-sp {
  background-image: url(../images/p-type4.svg);
}
@media (min-width: 1025px) {
  .product-details .intro .left {
    width: calc(645 / var(--max-width) * 100%);
    flex-shrink: 0;
    justify-content: flex-end;
    position: relative;
  }
  .product-details .intro .left .swiper-thumb {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    overflow: hidden;
  }
  .product-details .intro .right {
    flex: 1;
    margin-left: var(--pm__50);
  }
  .product-details .table-details .item {
    --lin: 4;
  }
  .product-details .table-details .item:not(:nth-child(4n)) {
    margin-right: var(--limr);
  }
  .product-details .table-details .item:nth-child(4) ~ .item {
    margin-top: var(--pm__20);
  }
  .product-details .other-type .item {
    width: 25%;
  }
  .product-details .other-type .item:not(:nth-child(1)) .inner {
    text-align: center;
  }
}
@media (max-width: 1024px) {
  .product-details {
    padding-top: 0 !important;
  }
  .product-details .right {
    margin-top: var(--pm__40);
  }
  .product-details .table-details .item {
    --lin: 2;
    --limr: 0.2rem;
  }
  .product-details .table-details .item:not(:nth-child(2n)) {
    margin-right: var(--limr);
  }
  .product-details .table-details .item:nth-child(2) ~ .item {
    margin-top: var(--limr);
  }
}
@media (max-width: 480px) {
  .product-details .intro .other-type .item {
    display: block;
    width: 50%;
    text-align: center;
  }
  .product-details .intro .other-type .item:nth-child(2) ~ .item {
    margin-top: var(--pm__40);
  }
  .product-details .table-details .item:not(:last-child) {
    margin-bottom: var(--pm__20);
  }
}
.diy-page {
  background-color: #f5f5f5;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.diy-page .left-side {
  flex-shrink: 0;
  background-color: var(--white-color);
}
.diy-page .left-side .logo img {
  height: 0.2rem;
}
.diy-page .left-side .bottom li a {
  display: flex;
  align-items: center;
  color: var(--black-color);
  cursor: pointer;
}
.diy-page .left-side .bottom li a:before {
  display: block;
  content: '';
  width: 0.2rem;
  height: 0.2rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}
.diy-page .left-side .bottom li a.guide:before {
  background-image: url(../images/guide.svg);
}
.diy-page .left-side .bottom li a.kf:before {
  background-image: url(../images/kefu.svg);
}
.diy-page .right-side {
  flex: 1;
}
@media (min-width: 1025px) {
  .diy-page .left-side {
    width: 1.6rem;
    padding: var(--pm__30) 0 var(--pm__30) var(--pm__20);
  }
  .diy-page .left-side.show {
    background-color: #f7f7f7;
  }
  .diy-page .left-side .bottom li:not(:last-child) {
    margin-bottom: var(--pm__30);
  }
  .diy-page .left-side .bottom li a:before {
    margin-right: 0.08rem;
  }
}
.opts {
  position: absolute;
  right: 0.25rem;
  top: 0.25rem;
  display: flex;
  align-items: center;
  z-index: 90;
}
.opts a {
  display: block;
  width: 0.3rem;
  height: 0.3rem;
  cursor: pointer;
}
.opts a.home {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/home.svg');
  background-size: auto 0.16rem;
}
.opts a.avatar {
  margin-left: 0.2rem;
}
.opts a.avatar figure {
  padding-bottom: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #eee;
  border-radius: 50%;
}
.diy-main {
  height: 100%;
}
.diy-main .content {
  flex: 1;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.diy-main .content .open-icon {
  right: 0;
  border-radius: 0.09rem 0 0 0.09rem;
  box-shadow: -0.05rem 0 0.05rem rgba(var(--black-color__rgb), 0.1);
}
.diy-main .open-icon {
  position: absolute;
  width: 0.24rem;
  height: 0.6rem;
  top: 50%;
  margin-top: -0.25rem;
  background-color: var(--white-color);
  cursor: pointer;
  z-index: 99;
  box-shadow: 0.05rem 0 0.05rem rgba(var(--black-color__rgb), 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
}
.diy-main .open-icon:after {
  display: block;
  content: '';
  width: 0.05rem;
  height: 0.09rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/arrow.svg');
}
.diy-main .open-icon.active {
  background-color: var(--primary-color);
}
.diy-main .open-icon.active:after {
  transform: rotate(180deg);
  filter: brightness(0) invert(1);
}
.diy-main .info-side {
  flex-shrink: 0;
  width: calc(450 / 1760 * 100%);
  background-color: var(--white-color);
  position: relative;
  overflow: auto;
  height: 100%;
}
.diy-main .info-side.w390 {
  width: calc(390 / 1760 * 100%);
}
.diy-main .info-side.w390 .form {
  border-bottom: 0;
}
.diy-main .result {
  padding: var(--pm__30) 0.22rem 0.1rem;
}
.diy-main .result .table .item {
  margin-bottom: var(--pm__30);
}
.diy-main .result .table .item .name {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.14rem;
}
.diy-main .result .table .item .name span {
  color: #666666;
}
.diy-main .result .table .item .name b {
  font-size: var(--font-size__20);
}
.diy-main .result .table .item .name b i {
  font-style: normal;
  font-size: var(--font-size__18);
}
.diy-main .result .table .item table {
  width: 100%;
  border-radius: 0.06rem;
  border: solid 0.01rem #e5e5e5;
}
.diy-main .result .table .item table tr:nth-child(2n) td {
  background-color: #fafafa;
}
.diy-main .result .table .item table td {
  border: solid 0.01rem #e5e5e5;
  padding-top: var(--pm__10);
  padding-bottom: var(--pm__10);
}
.diy-main .result .table .item table td:nth-child(1) {
  width: 1rem;
  text-align: center;
}
.diy-main .result .table .item table td:nth-child(2) {
  padding: 0 var(--pm__30);
  border-right: 0;
}
.diy-main .result .table .item table td:nth-child(3) {
  border-left: 0;
  width: 0.65rem;
}
.diy-main .result .btn-add {
  height: 0.4rem;
  background-color: var(--primary-color);
  border-radius: var(--pm__20);
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--white-color);
  margin-bottom: var(--pm__20);
  cursor: pointer;
}
.diy-main .result .btn-add::before {
  display: block;
  content: '';
  width: 0.16rem;
  height: 0.15rem;
  margin-right: 0.1rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/add-ku.svg');
}
.diy-main .result .tips-intro {
  font-size: var(--font-size__14);
  color: #999;
  line-height: 2;
}
.diy-main .result .tips-intro .title a {
  text-decoration: underline;
}
.diy-main .result .tips-intro .title a:not(:hover) {
  color: #999;
}
.diy-main .form {
  padding: var(--pm__30) 0.22rem;
  border-bottom: var(--border);
}
.diy-main .form .el-button {
  display: block;
  width: 100%;
  height: 0.4rem;
  background: var(--primary-color);
  color: var(--white-color);
  line-height: 0.4rem;
  padding: 0;
  border-radius: 0.2rem;
  font-size: initial;
}
.diy-main .form .el-form-item__label {
  line-height: 1.1;
  margin-bottom: 1em;
}
.diy-main .form .el-form-item {
  margin-bottom: var(--pm__20);
}
.diy-main .form .el-form-item:last-child {
  margin-bottom: 0;
}
.diy-main .form .length-input-select {
  border-radius: 0.06rem;
  border: 1px solid #e5e5e5;
}
.diy-main .form .length-input-select .el-input__inner {
  background: transparent;
  border-radius: 0;
  color: #333;
  font-size: var(--font-size__16);
  border: 0;
}
.diy-main .form .length-input-select .el-input-group__append {
  width: 80px;
  border: 0;
  background: transparent;
  border-radius: 0;
  position: relative;
}
.diy-main .form .length-input-select .el-input-group__append:before {
  position: absolute;
  content: '';
  width: 0.01rem;
  height: 1em;
  background-color: #dbdbdb;
  left: 0;
  top: 50%;
  margin-top: -0.5em;
}
.diy-main .recom-size {
  position: absolute;
  left: 0;
  width: 100%;
  bottom: 3%;
  color: #3b3d40;
  text-align: center;
  z-index: 90;
}
.diy-main .recom-size b {
  font-family: var(--font-family-en);
}
.diy-main .upload-area {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.diy-main .upload-area #area {
  width: calc(680 / 1310 * 100%);
  flex-shrink: 0;
  position: relative;
  background-color: var(--white-color);
  box-shadow: 0 0.05rem 0.3rem rgba(var(--black-color__rgb), 0.1);
}
.diy-main .upload-area #area :where(.before, .after) {
  padding-bottom: 100%;
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.diy-main .upload-area #area :where(.before, .after):before {
  position: absolute;
  content: '';
}
.diy-main .upload-area .box {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.diy-main .upload-area .tips {
  position: absolute;
  left: 0;
  top: 0;
  bottom: var(--pm__40);
  top: auto;
  right: 0;
  max-width: 4.36rem;
  width: 90%;
  margin: auto;
  text-align: center;
  display: flex;
  font-size: var(--font-size__14);
  color: #666;
  line-height: 1.57142857em;
  align-items: flex-start;
}
.diy-main .upload-area .tips::before {
  display: block;
  content: '';
  width: 0.14rem;
  height: calc(22 / 14 * 1em);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/warn.svg');
  margin-right: 0.05rem;
}
.diy-main .upload-area .tips a {
  color: var(--primary-color);
  text-decoration: underline;
  cursor: pointer;
}
.diy-main .upload-area .uploadImage-btn {
  margin: 0 auto;
  width: 2rem;
}
.diy-main .upload-area .uploadImage-btn .el-upload {
  display: block;
}
.diy-main .upload-area .btn-upload {
  height: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  background-color: var(--primary-color);
  color: var(--white-color);
  font-size: var(--font-size__18);
  font-weight: var(--font-weight__b);
}
.diy-main .upload-area .btn-upload:before {
  display: block;
  content: '';
  width: 0.26rem;
  margin-right: 0.08rem;
  height: 0.18rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/upload.svg');
}
.diy-main .upload-area .before:before {
  --lrtb: var(--pm__20);
  border-radius: var(--pm__20);
  border: dashed 1px rgba(var(--black-color__rgb), 0.2);
  left: var(--lrtb);
  top: var(--lrtb);
  bottom: var(--lrtb);
  right: var(--lrtb);
}
.diy-main .upload-area .before p {
  margin: 0.2rem 0 0 0;
  color: #666666;
  line-height: 1.875em;
}
.diy-main .upload-area .before .cutting {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.diy-main .upload-area .before .cutting .inside {
  width: 50%;
  text-align: center;
}
.diy-main .upload-area .before .cutting .img {
  position: relative;
  padding-bottom: 100%;
  margin-bottom: var(--pm__50);
}
.diy-main .upload-area .before .cutting .img img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.diy-main .upload-area .before .cutting .loading {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.diy-main .upload-area .before .cutting .loading .ico {
  width: 0.28rem;
  height: 0.28rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/loading.svg');
  animation: loading 2s linear 0s infinite normal none running;
}
.diy-main .upload-area .before .cutting .loading p {
  margin: 0.17rem 0 0 0;
  font-size: var(--font-size__14);
  color: #999999;
  line-height: 1;
}
.diy-main .upload-area .after.after-cut {
  background-position: center center;
  background-repeat: repeat;
  background-image: url(../images/opacity.jpg);
}
.diy-main .upload-area .after:before {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
  background: url(../images/mask.svg) no-repeat center center;
  background-size: 100% 100%;
}
.diy-main .upload-area .after.is-no-border:before {
  background-image: url(../images/mask-no-border.svg);
}
.diy-main .upload-area .after .img {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.diy-main .scale-ops {
  position: absolute;
  right: 0.25rem;
  bottom: 3%;
  width: max-content;
  height: 0.4rem;
  box-shadow: 0 0.05rem 0.3rem rgba(var(--black-color__rgb), 0.1);
  border-radius: 0.2rem;
  display: flex;
  align-items: center;
  background-color: var(--white-color);
  padding: 0 0.2rem;
  z-index: 99;
}
.diy-main .scale-ops .recover {
  width: 0.18rem;
  height: 0.18rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/one.svg');
  flex-shrink: 0;
  display: block;
  cursor: pointer;
}
.diy-main .scale-ops .controls {
  display: flex;
  align-items: center;
  margin-left: 0.16rem;
  padding-left: 0.16rem;
  border-left: 1px solid #d9d9d9;
}
.diy-main .scale-ops .controls .el-slider {
  width: 0.6rem;
  margin: 0 0.12rem;
}
.diy-main .scale-ops .controls .el-slider__runway {
  margin: 0;
}
.diy-main .scale-ops .controls .el-slider__bar {
  background-color: var(--primary-color);
}
.diy-main .scale-ops .controls .el-slider__button {
  border-color: var(--primary-color);
}
.diy-main .scale-ops .controls a {
  cursor: pointer;
  width: 0.16rem;
  height: 0.16rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  flex-shrink: 0;
}
.diy-main .scale-ops .controls a.scale-out {
  background-image: url(../images/scale-mins.svg);
}
.diy-main .scale-ops .controls a.scale-in {
  background-image: url(../images/scale-plus.svg);
}
@media (min-width: 1025px) {
  .left-side .opts {
    display: none;
  }
}
@media (max-width: 1024px) {
  .diy-page {
    flex-direction: column;
  }
  .diy-page .left-side {
    flex-direction: row;
    align-items: center;
    height: 0.6rem;
    padding: 0 var(--pm__20);
    box-shadow: 0 0 0.05rem rgba(var(--black-color__rgb), 0.1);
    position: relative;
    z-index: 10;
  }
  .diy-page .left-side .bottom {
    display: flex;
    align-items: center;
  }
  .diy-page .left-side .bottom .opts {
    position: initial;
  }
  .diy-page .left-side .bottom .opts a.home {
    background-size: contain;
    width: 0.2rem;
    height: 0.2rem;
  }
  .diy-page .left-side .bottom ul {
    display: flex;
    align-items: center;
  }
  .diy-page .left-side .bottom li {
    margin-right: 0.2rem;
  }
  .diy-page .left-side .bottom li a {
    font-size: 0;
  }
  .diy-main {
    flex-direction: column;
    justify-content: space-between;
  }
  .diy-main .opts {
    display: none;
  }
  .diy-main .scale-ops {
    right: 0;
    left: 0;
    margin: auto;
  }
  .diy-main .content .open-icon {
    width: 0.6rem;
    right: 0;
    height: 0.24rem;
    border-radius: 0.09rem 0.09rem 0 0;
    box-shadow: 0 -0.05rem 0.05rem rgba(var(--black-color__rgb), 0.1);
    bottom: 0;
    top: auto;
    margin-top: 0;
  }
  .diy-main .content .open-icon:after {
    background-image: url(../images/drop.svg);
    width: 0.1rem;
    height: 0.1rem;
  }
  .diy-main .recom-size {
    left: 0.25rem;
    line-height: 0.4rem;
    text-align: left;
  }
  .diy-main .info-side {
    height: 45vh;
    width: 100vw !important;
    padding-bottom: var(--pm__30);
  }
}
.konva-wrapper {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
}
.cropper.vue-advanced-cropper {
  z-index: 3;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  left: 0.2rem;
  top: 0.2rem;
  width: calc(100% - 0.4rem);
  height: calc(100% - 0.4rem);
}
.cropper .vue-advanced-cropper__background,
.cropper .vue-advanced-cropper__foreground {
  background: transparent !important;
}
.cropper .vue-simple-handler {
  border: 1px solid #54a2f0;
}
.cropper .vue-simple-line {
  border-color: #54a2f0;
}
#app .el-dialog {
  border-radius: var(--pm__20);
}
#app .el-dialog__header {
  height: 54px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 0 0 0;
}
#app .el-dialog__title {
  font-size: var(--font-size__24);
}
.edit-price {
  color: var(--default-color);
}
.edit-price .name {
  text-align: center;
  font-size: var(--font-size__18);
  font-weight: var(--font-weight__b);
}
.edit-price .line {
  height: 4px;
  border-top: 2px solid var(--default-color);
  border-bottom: 1px solid var(--default-color);
  margin-bottom: 0.1rem;
}
.edit-price table {
  width: 100%;
  margin-bottom: var(--pm__30);
}
.edit-price table th,
.edit-price table td {
  text-align: center;
  color: #666;
  font-size: var(--font-size__16);
  padding: 0.15rem 0;
  border-bottom: var(--border);
}
.edit-price table th {
  background-color: #f7f7f7;
}
.edit-price table td {
  border-right: var(--border);
}
.sidebar {
  position: fixed;
  left: 0;
  top: 1rem;
  bottom: 1.2rem;
  width: 1.6rem;
  z-index: 11;
}
.sidebar li a {
  padding-left: 0.25rem;
  display: flex;
  align-items: center;
  cursor: pointer;
  font-size: var(--font-size__14);
}
.sidebar li a img {
  width: 0.2rem;
  height: 0.2rem;
  margin-right: 0.1rem;
}
.sidebar li.active a {
  color: var(--primary-color);
}
.siderbar-child {
  background-color: var(--white-color);
  position: relative;
  z-index: 2;
  flex-shrink: 0;
}
.siderbar-child .inner {
  width: 2.8rem;
  height: 100%;
}
.siderbar-child .open-icon {
  left: 100%;
  border-radius: 0 0.09rem 0.09rem 0;
}
.siderbar-child .open-icon:after {
  transform: rotate(180deg);
}
.siderbar-child .open-icon.active:after {
  transform: rotate(0deg);
}
.siderbar-child .cate-one {
  border-bottom: 1px solid #ededed;
  padding-top: 0.14rem;
}
.siderbar-child .cate-one .cate-item {
  padding: 0.16rem 0;
  font-size: var(--font-size__18);
  border-bottom: 2px solid transparent;
  margin: 0 0.24rem;
  cursor: pointer;
}
.siderbar-child .cate-one .cate-item.active {
  color: var(--primary-color);
  border-bottom-color: var(--primary-color);
}
.siderbar-child .search {
  flex-shrink: 0;
  margin: 0.15rem 0.2rem;
  position: relative;
}
.siderbar-child .search .ico {
  width: 0.14rem;
  height: 0.14rem;
  position: absolute;
  left: 0.1rem;
  top: 50%;
  margin-top: -0.07rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/search.svg');
  z-index: 10;
  cursor: pointer;
}
.siderbar-child .search .search-input .el-input__inner {
  border-radius: 0.2rem;
  line-height: 0.32rem;
  height: 0.32rem;
  border-color: #dbdbdb;
  padding-left: 0.33rem;
  font-size: var(--font-size__14);
}
.siderbar-child .search .search-input .el-input__inner::placeholder {
  color: rgba(153, 153, 153, 0.7);
}
.siderbar-child .cate-two {
  margin: 0 0.2rem 0.22rem;
  border-radius: 0.16rem;
  overflow: hidden;
  background-color: #f7f7f7;
  font-size: var(--font-size__14);
}
.siderbar-child .cate-two .item {
  flex: 1;
  text-align: center;
  line-height: 0.32rem;
  color: var(--primary-color);
  cursor: pointer;
}
.siderbar-child .cate-two .item.active {
  color: var(--white-color);
  background-color: var(--primary-color);
}
.siderbar-child .list {
  flex: 1;
  overflow: auto;
  padding: 0 0.2rem 0 0.12rem;
  margin-right: 0.04rem;
}
.siderbar-child .list::-webkit-scrollbar {
  --wh: 0.05rem;
}
.siderbar-child .list::-webkit-scrollbar-track {
  background: transparent;
}
.siderbar-child .list::-webkit-scrollbar-thumb {
  background: #e0e0e0;
}
.siderbar-child .list::-webkit-scrollbar-thumb:hover {
  background: #e0e0e0;
}
.siderbar-child .list .list-item {
  display: flex;
  align-items: center;
  padding: 0.08rem 0.2rem 0.08rem 0.08rem;
  transition: 0.3s;
}
.siderbar-child .list .list-item .img {
  border-radius: 0.06rem;
  width: 0.5rem;
  height: 0.5rem;
  flex-shrink: 0;
  object-fit: cover;
}
.siderbar-child .list .list-item .name {
  flex: 1;
  margin: 0 0.15rem;
}
.siderbar-child .list .list-item .checkbox {
  width: 0.18rem;
  height: 0.18rem;
  border-radius: 0.01rem;
  display: block;
  border: 1px solid #d1d1d1;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-size: 80% auto;
}
.siderbar-child .list .list-item:hover,
.siderbar-child .list .list-item.selected {
  background-color: #f7f7f7;
  border-radius: 0.06rem;
}
.siderbar-child .list .list-item.selected .checkbox {
  border-color: var(--primary-color);
  background-image: url(../images/checked.svg);
}
.siderbar-child .list .list-item:not(:last-child) {
  margin-bottom: 0.08rem;
}
.siderbar-child .select-type {
  border-top: 1px solid #ededed;
  margin: 0.2rem 0.2rem 0;
  padding: 0.2rem 0;
  flex-shrink: 0;
}
.siderbar-child .select-type .item-list {
  overflow: auto;
  max-height: 1.38rem;
}
.siderbar-child .select-type .item-list::-webkit-scrollbar {
  --wh: 0.05rem;
}
.siderbar-child .select-type .item-list::-webkit-scrollbar-track {
  background: transparent;
}
.siderbar-child .select-type .item-list::-webkit-scrollbar-thumb {
  background: #e0e0e0;
}
.siderbar-child .select-type .item-list::-webkit-scrollbar-thumb:hover {
  background: #e0e0e0;
}
.siderbar-child .select-type .item {
  display: flex;
  align-items: center;
  background-color: #f7f7f7;
  padding: 0 0.1rem;
  border-radius: 0.14rem;
  font-size: var(--font-size__14);
  color: #999;
  line-height: 1.85714286em;
  margin-right: 0.08rem;
  margin-bottom: 0.08rem;
}
.siderbar-child .select-type .close {
  margin-left: 0.09rem;
  width: 0.08rem;
  height: 0.07rem;
  display: block;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/close.svg');
  cursor: pointer;
}
@media (max-width: 1024px) {
  .sidebar {
    bottom: auto;
    top: 0.65rem;
    width: 100%;
    display: flex;
    justify-content: center;
  }
  .sidebar ul {
    background-color: var(--white-color);
    padding: 0 var(--pm__30);
    border-radius: 0.2rem;
    box-shadow: 0 0 0.1rem rgba(var(--black-color__rgb), 0.1);
  }
  .sidebar ul li a {
    padding-left: 0;
    height: 0.36rem;
  }
  .siderbar-child {
    position: fixed;
    z-index: 20;
    bottom: 0;
    left: 0;
    top: 0.6rem;
    height: auto;
  }
  .siderbar-child .open-icon {
    top: 1.05rem;
    margin-top: 0;
  }
  .siderbar-child .inner {
    width: 45vw;
    box-shadow: 0.05rem 0.05rem 0.05rem rgba(var(--black-color__rgb), 0.1);
  }
}
.rendering-img {
  padding: 0.3rem 0.24rem 0;
}
.rendering-img .img-list .item {
  --limr: var(--pm__20);
  --lin: 3;
  border-radius: var(--pm__20);
  overflow: hidden;
  position: relative;
  cursor: pointer;
  background-color: #f7f7f7;
  line-height: 1.71428571em;
}
.rendering-img .img-list .item .tit,
.rendering-img .img-list .item:after {
  opacity: 0;
  transition: 0.3s;
}
.rendering-img .img-list .item .tit {
  position: absolute;
  bottom: 0;
  width: 100%;
  text-align: center;
  left: 0;
  z-index: 10;
  background-color: var(--primary-color);
  color: var(--white-color);
  font-size: var(--font-size__14);
}
.rendering-img .img-list .item:after {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border: 2px solid var(--primary-color);
  content: '';
}
.rendering-img .img-list .item.active::after,
.rendering-img .img-list .item.active .tit {
  opacity: 1;
}
.rendering-img .img-list .item figure {
  padding-bottom: 100%;
  position: relative;
  z-index: 1;
}
.rendering-img .img-list .item figure .r-img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.rendering-img .img-list .item figure .c-img {
  position: absolute;
  width: 50%;
  height: 50%;
  left: 25%;
  top: 25%;
  z-index: 2;
}
.rendering-img .img-list .item.change {
  background-color: #f5f5f5;
  color: #999999;
}
.rendering-img .img-list .item.change .btn {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.rendering-img .img-list .item.change .icon {
  display: block;
  width: 0.14rem;
  height: 0.14rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/change.svg');
  color: #999;
  margin-right: 0.08rem;
}
@media (min-width: 1025px) {
  .rendering-img .img-list .item:not(:nth-child(3n)) {
    margin-right: var(--limr);
  }
  .rendering-img .img-list .item:nth-child(3) ~ .item {
    margin-top: var(--limr);
  }
}
@media (max-width: 1024px) {
  .rendering-img .img-list .item {
    --lin: 6;
  }
  .rendering-img .img-list .item:not(:nth-child(6n)) {
    margin-right: var(--limr);
  }
  .rendering-img .img-list .item.change .btn {
    flex-direction: column;
  }
  .rendering-img .img-list .item.change .btn .icon {
    margin: 0 0 0.05rem 0;
  }
}
.downloads-group {
  border-top: 1px solid #ededed;
  padding-top: var(--pm__20);
  margin: 0 0.25rem;
}
.downloads-group .btn {
  display: block;
  background-color: #e8f2fc;
  border-radius: 0.2rem;
  color: var(--primary-color);
  line-height: 2.5em;
  padding: 0 1em;
  margin-top: var(--pm__20);
  text-align: center;
  cursor: pointer;
}
.downloads-group .row {
  display: flex;
  justify-content: space-between;
}
.downloads-group .row .btn {
  flex: 1;
}
.downloads-group .row .btn + .btn {
  margin-left: var(--pm__20);
}
.loading-area {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  background-color: var(--white-color);
  display: flex;
  align-items: center;
  justify-content: center;
}
.loading-area .loading-text {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.loading-area .loading-text:before {
  display: block;
  content: '';
  width: 0.28rem;
  height: 0.28rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/loading.svg');
  animation: loading 2s linear 0s infinite normal none running;
  margin-bottom: 0.1rem;
}