.appshop {
  background: #121723;
  height: 100vh;
}
.appshop header ul.tab1 {
  width: 10rem;
  height: 1.44rem;
  background: url('/images/appshop/header_bg.png') no-repeat;
  background-size: 10rem 7.92rem;
  background-position: 0 -2rem;
}
.appshop header ul.tab1 .shop-type {
  font-size: 0.42666667rem;
  color: rgba(255, 255, 255, 0.4);
}
.appshop .shop-type.vip .selected {
  /* color: #37a7e7; */
  /* color: #474747;
  border-bottom: solid #ff8400 3px; */
  color: #FCE3DA;
  font-size: 0.42666667rem;
}
.appshop .shop-type.vip::before {
  content: ' ';
  width: 0.26666667rem;
  height: 0.08rem;
  border-radius: 0.05333333rem;
  background-color: #FCE3DA;
  display: inline-block;
  position: relative;
  left: 0.69333333rem;
  top: 0.24rem;
}
.vip-box {
  color: #474747;
  background: #f4f4f4;
}
.vip-box .solid_btn {
  background: #ff8400;
  color: #fff;
  height: 0.85333333rem;
  line-height: 0.85333333rem;
  text-align: center;
  font-size: 0.37333333rem;
  border-radius: 0.53333333rem;
  -webkit-border-radius: 0.53333333rem;
}
.vip-box .user_info {
  width: 10rem;
  height: 4.26666667rem;
  background-image: url('/images/appshop/header_bg.png');
  background-size: 10rem 7.92rem;
  background-position: 0 -3.46666667rem;
  position: relative;
  top: -0.02666667rem;
}
.vip-box .user_info h2 {
  font-size: 0.4rem;
  color: #474747;
  height: 0.90666667rem;
  line-height: 0.90666667rem;
  padding-left: 0.26666667rem;
  margin: 0 0.26666667rem;
  border-bottom: 1px solid #dedede;
}
.vip-box .user_info h2 .tip {
  color: #ff2f2f;
  font-size: 0.34666667rem;
  float: right;
  display: none;
}
.vip-box .user_info .main {
  position: relative;
  height: 2.13333333rem;
}
.vip-box .user_info .main .avatar {
  border-radius: 50%;
  -webkit-border-radius: 50%;
  width: 1.2rem;
  margin-top: 0.53333333rem;
  margin-left: 0.53333333rem;
  margin-right: 0.33333333rem;
  position: absolute;
  z-index: 1;
}
.vip-box .user_info .main .vip_bg {
  width: 9.2rem;
  height: 4rem;
  position: absolute;
  left: 0;
  top: 0;
}
.vip-box .user_info .main .old_vip .exchange_vip {
  float: right;
  width: 2.24rem;
  margin-top: 0.29333333rem;
  margin-right: 0.4rem;
}
.vip-box .user_info .main .old_vip .middle .point {
  font-size: 0.37333333rem;
  color: #ff8400;
}
.vip-box .user_info .main .old_vip .middle .point span {
  color: #818181;
}
.vip-box .user_info .main .not_vip {
  width: 9.2rem;
  height: 4rem;
  background: url('/images/appshop/no_login.png') no-repeat;
  background-size: contain;
  margin: 0 auto;
}
.vip-box .user_info .main .not_vip .middle {
  margin-left: 0.29333333rem;
}
.vip-box .user_info .main .not_vip .middle .vip_icon {
  width: 0.34666667rem;
}
.vip-box .user_info .main .not_vip .login_btn_wrap {
  width: 10rem;
  height: 2rem;
  background: #22242e;
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 1;
}
.vip-box .user_info .main .not_vip .open_vip {
  width: 9.2rem;
  height: 1.2rem;
  display: block;
  background: url('/images/appshop/login_btn.png') no-repeat;
  background-size: 9.2rem 1.2rem;
  color: #161617;
  font-size: 0.48rem;
  text-align: center;
  line-height: 1.2rem;
  margin: 0 auto;
  margin-top: 0.26666667rem;
  font-family: PingFang SC, PingFang SC-Medium;
  font-weight: 500;
}
.vip-box .user_info .main .new_vip {
  width: 9.2rem;
  height: 4rem;
  position: relative;
  background-size: 9.2rem 4rem;
  margin: 0 auto;
}
.vip-box .user_info .main .new_vip .vip_icon_wrap {
  line-height: 0.37333333rem;
  display: flex;
  align-items: center;
}
.vip-box .user_info .main .new_vip .vip_icon_wrap .vip_icon {
  margin-right: 0.13333333rem;
  width: 0.56rem;
  height: 0.37333333rem;
}
.vip-box .user_info .main .new_vip .vip_icon_wrap .expired {
  font-size: 0.32rem;
  color: #FFFFFF;
  opacity: 0.8;
}
.vip-box .user_info .main .new_vip .login_btn_wrap {
  width: 10rem;
  height: 2rem;
  background: #22242e;
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 1;
}
.vip-box .user_info .main .new_vip .renew {
  width: 9.2rem;
  height: 1.2rem;
  display: block;
  background: url('/images/appshop/login_btn.png') no-repeat;
  background-size: 9.2rem 1.2rem;
  color: #161617;
  font-size: 0.48rem;
  text-align: center;
  line-height: 1.2rem;
  margin: 0 auto;
  margin-top: 0.26666667rem;
  font-family: PingFang SC, PingFang SC-Medium;
  font-weight: 500;
}
.vip-box .user_info .main .login {
  color: #FFFFFF;
}
.vip-box .user_info .main .login .middle {
  position: absolute;
  margin-top: 0.58666667rem;
  left: 2.02666667rem;
}
.vip-box .user_info .main .login .middle .nickname {
  font-size: 0.42666667rem;
  margin-bottom: 0.10666667rem;
}
.vip-box .user_info .main .not_login {
  width: 9.2rem;
  height: 4rem;
  background: url('/images/appshop/no_login.png') no-repeat;
  background-size: contain;
  margin: 0 auto;
}
.vip-box .user_info .main .not_login span {
  float: left;
  font-size: 0.42666667rem;
  color: #FFFFFF;
  margin-top: 0.8rem;
  display: inline-block;
  margin-left: 2.02666667rem;
}
.vip-box .user_info .main .not_login .login_btn_wrap {
  width: 10rem;
  height: 2rem;
  background: #22242e;
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 1;
}
.vip-box .user_info .main .not_login .login_register {
  width: 9.2rem;
  height: 1.2rem;
  background: url('/images/appshop/login_btn.png') no-repeat;
  background-size: 9.2rem 1.2rem;
  color: #161617;
  font-size: 0.48rem;
  text-align: center;
  line-height: 1.2rem;
  margin: 0 auto;
  margin-top: 0.26666667rem;
  font-family: PingFang SC, PingFang SC-Medium;
  font-weight: 500;
}
.vip-box .vip_list {
  margin-top: 0.26666667rem;
  height: 5.41333333rem;
  border-top: 1px solid #d1d1d1;
  border-bottom: 1px solid #d1d1d1;
  background: #fff;
  position: relative;
  margin-bottom: 1.57333333rem;
}
.vip-box .vip_list li {
  float: left;
  width: 50%;
  height: 100%;
  -webkit-box-sizing: border-box;
  text-align: center;
  font-size: 0.34666667rem;
}
.vip-box .vip_list li .vip_icon {
  width: 1.86666667rem;
  height: 1.86666667rem;
  margin: 0.74666667rem auto 0.32rem auto;
  width: 0.56rem;
  height: 0.37333333rem;
}
.vip-box .vip_list li .solid_btn {
  width: 2.50666667rem;
  margin: 0.57333333rem auto 0 auto;
  display: block;
}
.vip-box .vip_list li:first-child {
  border-right: 1px solid #d1d1d1;
}
.appshop .svip-privilege {
  width: 10rem;
  height: 13.94666667rem;
  background: url('/images/appshop/svip_privileges.png?v=2') no-repeat;
  background-size: 10rem 13.94666667rem;
  overflow: hidden;
  position: relative;
  top: -0.02666667rem;
}
.appshop .svip-privilege .title_wrap {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0.4rem;
  color: #FCE3DA;
  font-size: 0.37333333rem;
}
.appshop .svip-privilege .left {
  width: 1.70666667rem;
  height: 0.10666667rem;
  display: inline-block;
  background: url('/images/appshop/left.png') no-repeat;
  background-size: 1.70666667rem 0.10666667rem;
  position: absolute;
  left: -2.24rem;
  top: 50%;
  transform: translateY(-50%);
}
.appshop .svip-privilege .right {
  width: 1.70666667rem;
  height: 0.10666667rem;
  display: inline-block;
  background: url('/images/appshop/right.png') no-repeat;
  background-size: 1.70666667rem 0.10666667rem;
  position: absolute;
  right: -2.24rem;
  top: 50%;
  transform: translateY(-50%);
}
.appshop .svip-privilege.vip {
  width: 10rem;
  height: 13.94666667rem;
  background: url('/images/appshop/vip_privileges.png?v=2') no-repeat;
  background-size: 10rem 13.94666667rem;
  overflow: hidden;
}