* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: Microsoft YaHei;
  font-size: 0.16rem;
  color: #333;
}
span {
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
  color: inherit;
}
@font-face {
  font-family: 淘宝买菜体;
  src: url('../font/淘宝买菜体.ttf');
}
html {
  scroll-behavior: smooth;
}
body {
  background: #F2F2EF;
}
a {
  display: block;
  outline: 0;
  text-decoration: none;
}
ul,
ol {
  padding-left: 2em;
}
input,
textarea,
button,
select {
  border: 0;
  resize: none;
  outline: 0;
  background: transparent;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
button {
  cursor: pointer;
}
img {
  max-width: 100%;
  object-fit: contain;
}
/*多行溢出*/
.ellipsis1 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ellipsis2 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}
.ellipsis3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}
.ellipsis4 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 4;
  line-clamp: 4;
}
/* hover-图片放大1.1 */
.scale-box,
.imgBox {
  overflow: hidden;
}
.scale-box .scale-img,
.imgBox .scale-img {
  width: 100%;
  height: 100%;
  transition: all 0.3s linear;
  cursor: pointer;
  object-fit: cover;
}
.scale-box:hover .scale-img,
.imgBox:hover .scale-img {
  transform: scale(1.1);
}
/* 常用盒子阴影 */
.shadow_box {
  box-shadow: 0 0.02rem 0.12rem 0 rgba(0, 0, 0, 0.1);
}
/* 水波纹效果 */
.btn-ripple {
  vertical-align: bottom;
}
.btn-ripple:not(:disabled):hover {
  opacity: 1;
  position: relative;
  overflow: hidden;
}
.btn-ripple:not(:disabled):hover::before {
  animation: ani_ripple 0.75s;
  z-index: 1;
  content: "";
  position: absolute;
  display: block;
  transition: all 0.6s;
  width: 100%;
  height: 0;
  border-radius: 50%;
  left: 50%;
  top: 50%;
  padding-top: 100%;
  transform: translateX(-50%) translateY(-50%);
}
@keyframes ani_ripple {
  0% {
    background: rgba(0, 0, 0, 0.25);
    transform: translateX(-50%) translateY(-50%) scale(0);
  }
  to {
    background: transparent;
    transform: translateX(-50%) translateY(-50%) scale(1);
  }
}
#headerApp,
.headerWrap {
  position: sticky;
  top: 0;
  z-index: 999;
  width: 100%;
}
.main {
  width: 17.5rem;
  max-width: 94%;
  margin: 0 auto;
}
.back {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.swiper-slide > img,
.swiper-slide > video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.comTit {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.comTit h3 {
  display: flex;
  align-items: center;
  gap: 0.16rem;
  font-family: 淘宝买菜体, 淘宝买菜体;
  font-weight: 400;
  font-size: 0.42rem;
  color: #333333;
}
.comTit h3 img {
  width: 0.77rem;
  height: 0.3rem;
}
.comTit h4 {
  font-weight: 400;
  font-size: 0.16rem;
  color: #6E6E6E;
}
.comTit .more {
  width: fit-content;
  padding: 0 0.21rem;
  height: 0.4rem;
  display: flex;
  align-items: center;
  gap: 0.12rem;
  background: #FFFFFF;
  border-radius: 0.2rem 0.2rem 0.2rem 0.2rem;
  border: 0.01rem solid #BFBFBF;
}
.comTit .more img {
  width: 0.15rem;
  height: 0.12rem;
}
.comTit .controls {
  display: flex;
  align-items: center;
  gap: 0.05rem;
}
.comTit .controls .next3,
.comTit .controls .prev3 {
  position: static;
  margin: 0;
  width: 0.7rem;
  height: 0.5rem;
  background: #E2E2E2;
  border-radius: 0.04rem 0.04rem 0.04rem 0.04rem;
}
.comTit .controls .next3:hover,
.comTit .controls .prev3:hover {
  background: #B35622;
}
.comTit .controls .next3:hover:after,
.comTit .controls .prev3:hover:after {
  color: #fff;
}
.comTit .controls .next3:after,
.comTit .controls .prev3:after {
  font-size: 0.26rem;
  color: #575C66;
}
.comBanner {
  width: 100%;
  height: 3.8rem;
}
.comBanner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.bread {
  height: 0.7rem;
}
.bread .main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
}
.bread .left {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.bread .left .bread-item {
  display: flex;
  align-items: center;
}
.bread .left .bread-item img {
  width: 0.12rem;
  height: 0.15rem;
  margin-right: 0.08rem;
}
.bread .left .bread-item:last-child {
  margin-right: 0;
}
.bread .left .bread-item:last-child a span {
  display: none;
}
.bread .left .bread-item a {
  font-weight: 400;
  font-size: .13rem;
  color: #87878A;
}
.bread .left .bread-item a span {
  margin: 0 .02rem;
}
.bread .right {
  display: flex;
  align-items: center;
  gap: 0.15rem;
}
.bread .right a {
  width: fit-content;
  height: 0.4rem;
  border-radius: 0.2rem 0.2rem 0.2rem 0.2rem;
  padding: 0 0.23rem;
  font-weight: 400;
  font-size: 0.16rem;
  color: #6E6E6E;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.1rem;
}
.bread .right a:hover,
.bread .right a.active {
  background: #B35622;
  color: #B35622;
  color: #fff;
}
.bread .right a:hover img,
.bread .right a.active img {
  filter: brightness(0) invert(1);
}
.bread .right a img {
  width: 0.18rem;
  height: 0.15rem;
}
.comPage {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.23rem;
}
.comPage p {
  font-weight: 400;
  font-size: 0.14rem;
  color: #333333;
}
.comPage .pageList {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.09rem;
}
.comPage .pageList a {
  width: 0.32rem;
  height: 0.32rem;
  background: #FFFFFF;
  border-radius: 0.01rem 0.01rem 0.01rem 0.01rem;
  border: 0.01rem solid #E5E5E5;
  display: flex;
  justify-content: center;
  align-items: center;
}
.comPage .pageList a:hover,
.comPage .pageList a.active {
  background: #333333;
  color: #fff;
}
/* 单选框颜色 */
header {
  width: 100%;
  height: 0.7rem;
  background: #FFFFFF;
  box-shadow: 0rem 0rem 0.1rem 0.01rem rgba(0, 0, 0, 0.1);
  padding: 0 0.46rem 0 0.53rem;
  display: flex;
  align-items: center;
  position: relative;
}
header .logo {
  width: 1.67rem;
  height: 0.4rem;
}
header .headNav {
  display: flex;
  align-items: center;
  margin-left: 1.35rem;
}
header .headNav .item {
  height: 0.7rem;
  display: flex;
  align-items: center;
  gap: 0.08rem;
  padding: 0 0.35rem;
  position: relative;
}
header .headNav .item .level1 {
  font-weight: 400;
  font-size: 0.16rem;
  color: #6E6E6E;
  position: relative;
}
header .headNav .item .level1.active,
header .headNav .item .level1:hover {
  /*font-weight: 400;*/
  /*font-size: 0.16rem;*/
  color: #B35622;
}
header .headNav .item .level1.active::after,
header .headNav .item .level1:hover::after {
  content: '';
  position: absolute;
  bottom: -0.1rem;
  left: 0;
  width: 100%;
  height: 0.03rem;
  background: #B35622;
  border-radius: 0.03rem 0.03rem 0.03rem 0.03rem;
}
header .headNav .item .level2 {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  background: #FFFFFF;
  padding: 0.18rem 0;
  display: none;
}
header .headNav .item .level2 a {
  font-weight: 400;
  font-size: 0.14rem;
  color: #999999;
  text-align: center;
}
header .headNav .item .level2 a:not(:last-child) {
  margin-bottom: 0.18rem;
}
header .headNav .item .level2 a:hover {
  color: #333333;
}
header .headR {
  display: flex;
  align-items: center;
  margin-left: auto;
  gap: 0.22rem;
}
header .headR .release {
  width: 1.37rem;
  height: 0.4rem;
  background: #333333;
  border-radius: 1rem 1rem 1rem 1rem;
  gap: 0.09rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 400;
  font-size: 0.14rem;
  color: #FFFFFF;
}
header .headR .userBox {
  display: flex;
  align-items: center;
  gap: 0.08rem;
}
header .headR .userBox img {
  width: 0.3rem;
  height: 0.3rem;
  border-radius: 50%;
}
header .headR .userBox a {
  font-weight: 400;
  font-size: 0.14rem;
  color: #000000;
}
header .headR .userBox a.logout {
  color: #B35622;
}
.comAlert {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(10px);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  display: none;
}
.comAlert .alertBox {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 4.8rem;
  background: #FFFFFF;
  box-shadow: 0rem 0.1rem 0.2rem 0.01rem rgba(1, 100, 98, 0.2);
  border-radius: 0.1rem 0.1rem 0.1rem 0.1rem;
  padding: 0.3rem 0.4rem;
}
.comAlert .alertBox.agreement {
  width: 10rem;
  border-radius: 0.15rem 0.15rem 0.15rem 0.15rem;
  padding: 0.62rem 0.36rem 0.53rem 1rem;
}
.comAlert .alertBox.agreement .closeAlert {
  top: 0.32rem;
  right: 0.32rem;
}
.comAlert .alertBox.agreement .alertTitle {
  width: 7.72rem;
  font-weight: bold;
  font-size: 0.35rem;
  color: #222222;
  margin-bottom: 0;
}
.comAlert .alertBox .closeAlert {
  position: absolute;
  top: 0.13rem;
  right: 0.21rem;
  width: 0.15rem;
  height: 0.15rem;
}
.comAlert .alertBox .alertTitle {
  font-weight: 400;
  font-size: 0.24rem;
  color: #000000;
  text-align: center;
  margin-bottom: 0.5rem;
}
.comAlert .alertBox article {
  height: 4.51rem;
  font-weight: 400;
  font-size: 0.14rem;
  color: #444444;
  line-height: 0.24rem;
  overflow-y: auto;
  padding-right: 0.92rem;
  padding-top: 0.57rem;
}
.comAlert .alertBox .alertTab {
  margin-bottom: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.48rem;
}
.comAlert .alertBox .alertTab a {
  font-weight: 400;
  font-size: 0.18rem;
  color: #333333;
}
.comAlert .alertBox .alertTab a.active {
  font-weight: bold;
  position: relative;
}
.comAlert .alertBox .alertTab a.active::after {
  content: '';
  position: absolute;
  bottom: -0.14rem;
  left: 50%;
  transform: translateX(-50%);
  width: 0.5rem;
  height: 0.03rem;
  background: #000000;
  border-radius: 0.1rem 0.1rem 0.1rem 0.1rem;
}
.comAlert .alertBox .formBox {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.comAlert .alertBox .formBox .formItem {
  display: flex;
  align-items: center;
  gap: 0.08rem;
  position: relative;
}
.comAlert .alertBox .formBox .formItem:not(:last-child) {
  padding: 0 0.26rem 0 0.12rem;
  height: 0.5rem;
  border-radius: 0.04rem 0.04rem 0.04rem 0.04rem;
  border: 0.01rem solid #CCCCCC;
}
.comAlert .alertBox .formBox .formItem label {
  width: 0.9rem;
  font-weight: 400;
  font-size: 0.14rem;
  color: #999999;
  flex-shrink: 0;
  padding: 0 0.1rem;
  border-right: 0.01rem solid #EEEEEE;
  margin-right: 0.08rem;
}
.comAlert .alertBox .formBox .formItem img {
  width: 0.24rem;
  height: 0.24rem;
  flex-shrink: 0;
}
.comAlert .alertBox .formBox .formItem input {
  width: 100%;
}
.comAlert .alertBox .formBox .formItem input#city {
  cursor: pointer;
}
.comAlert .alertBox .formBox .formItem .select {
  position: absolute;
  top: 100%;
  right: 0;
  width: 3rem;
  background: #FFFFFF;
  box-shadow: 0 0.02rem 0.12rem 0 rgba(0, 0, 0, 0.1);
  z-index: 1;
  display: flex;
  display: none;
}
.comAlert .alertBox .formBox .formItem .select .province,
.comAlert .alertBox .formBox .formItem .select .city {
  flex: 1;
}
.comAlert .alertBox .formBox .formItem .select .city {
  display: none;
}
.comAlert .alertBox .formBox .formItem .select .selectItem {
  display: flex;
  align-items: center;
  gap: 0.08rem;
  padding: 0.1rem 0.2rem;
  cursor: pointer;
}
.comAlert .alertBox .formBox .formItem .select .selectItem:hover,
.comAlert .alertBox .formBox .formItem .select .selectItem.active {
  background: #F5F5F5;
}
.comAlert .alertBox .formBox .formItem .getCode {
  font-weight: 400;
  font-size: 0.16rem;
  color: #B35622;
  flex-shrink: 0;
}
.comAlert .alertBox .formBox .formItem button {
  width: 100%;
  height: 0.5rem;
  background: #B35622;
  border-radius: 0.25rem 0.25rem 0.25rem 0.25rem;
  font-weight: 400;
  font-size: 0.18rem;
  color: #FFFFFF;
}
.comAlert .alertBox .toLogin {
  width: fit-content;
  margin: 0.23rem auto 0.34rem;
  font-weight: 400;
  font-size: 0.14rem;
  color: #777777;
  border-bottom: 0.01rem solid #777777;
}
.comAlert .alertBox .toLogin img {
  width: 0.18rem;
  height: 0.12rem;
}
.comAlert .alertBox .alertFooter {
  margin-top: 0.27rem;
  display: flex;
  align-items: center;
}
.comAlert .alertBox .alertFooter.agree {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0.4rem;
  background: #F5F6F8;
  border-radius: 0rem 0rem 0.16rem 0.16rem;
  padding: 0 0.4rem;
}
.comAlert .alertBox .alertFooter.agree * {
  font-weight: 400;
  font-size: 0.12rem;
  color: #999999;
}
.comAlert .alertBox .alertFooter * {
  font-weight: 400;
  font-size: 0.14rem;
  color: #000000;
}
.comAlert .alertBox .alertFooter #agree,
.comAlert .alertBox .alertFooter #remember {
  width: 0.18rem;
  height: 0.18rem;
  margin-right: 0.1rem;
}
.comAlert .alertBox .alertFooter .register {
  margin-left: auto;
  margin-right: 0.18rem;
}
footer {
  width: 100%;
  min-height: 2.93rem;
  background: #000000;
  padding: 0.65rem 0 0.84rem;
}
footer .top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 0.33rem;
  border-bottom: 0.01rem solid rgba(112, 112, 112, 0.3);
  margin-bottom: 0.34rem;
}
footer .top .footNav {
  display: flex;
  align-items: center;
  gap: 0.95rem;
}
footer .top .footNav a {
  font-weight: 400;
  font-size: 0.16rem;
  color: #BFBFBF;
}
footer .top .share {
  display: flex;
  align-items: center;
  gap: 0.3rem;
}
footer .top .share a img {
  width: 0.3rem;
  height: 0.3rem;
}
footer .bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
footer .bottom .left {
  font-weight: 400;
  font-size: 0.14rem;
  color: #BFBFBF;
  line-height: 0.28rem;
}
footer .bottom .left a {
  font-weight: 400;
  font-size: 0.14rem;
  color: #BFBFBF;
  line-height: 0.28rem;
  display: inline;
}
footer .bottom .right a {
  font-weight: 400;
  font-size: 0.14rem;
  color: #BFBFBF;
}

.mobile-menu,
.mobile-nav{
    display: none;
}

@media screen and (max-width:1024px){
    .mobile-menu{
        display: block;
        width: 30px;
        height: 30px;
    }
    .mobile-nav{
        display: block;
    }
    header{
        height: 1rem;
    }
    header .headNav{
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        height: calc(100vh - .7rem);
        overflow-y: auto;
        z-index: 99;
        background: #fff;
        margin: 0;
        /*display: block;*/
    }
    header .headR .release{
        display: none;
    }
    header .headR .userBox img{
        width: 30px;
        height: 30px;
        display: none;
    }
    header .headR .userBox a{
        font-size: 14px;
    }
    header .headR .userBox a.logout{
        font-size: 14px;
    }
    header .headNav .item{
        flex-direction: column;
        align-items: normal;
        justify-content: center;
        height: auto;
        min-height: .9rem;
        padding: .3rem 0;
        margin: 0 .35rem;
        border-bottom: 0.01rem solid #BFBFBF;
        position: relative;
    }
    header .headNav .item.hasChild:after{
        content: '';
        width: 10px;
        height: 10px;
        border-top: 2px solid #BFBFBF;
        border-right: 2px solid #BFBFBF;
        position: absolute;
        top: .3rem;
        right: .2rem;
        transform: rotate(135deg);
    }
    header .headNav .item .level1{
        font-size: 16px;
        width: fit-content;
        max-width: 80%;
    }
    header .headNav .item .level2{
        position: static;
        transform: translateX(0%);
        padding: 0.18rem;
    }
    header .headNav .item .level2 a{
        font-size: 14px;
        text-align: left;
    }
    footer .top .footNav{
        gap: .2rem;
    }
    footer .top .footNav a{
        font-size: 14px;
    }
    footer .top .share a img{
        width: 25px;
        height: 25px;
    }
    footer .bottom{
        flex-direction: column;
        gap: 10px;
    }
    footer .bottom .left,
    footer .bottom .left *,
    footer .bottom .left a,
    footer .bottom .right{
        font-size: 12px;
        text-align: center;
    }
    .bread .left .bread-item img{
        width: 12px;
        height: 12px;
    }
    .bread .left .bread-item a,
    .bread .left .bread-item{
        font-size: 14px;
    }
    .bread .left .bread-item:last-child{
        max-width: 200px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        display: block;
    }
    .comAlert .alertBox{
        width: 90%;
    }
    .comAlert .alertBox .alertTitle{
        font-size: 24px;
    }
    .comAlert .alertBox .alertTab a{
        font-size: 18px;
    }
    .comAlert .alertBox .formBox .formItem img{
        width: 20px;
        height: 20px;
    }
    .comAlert .alertBox .formBox .formItem input{
        font-size: 16px;
    }
    .comAlert .alertBox .formBox .formItem button{
        font-size: 18px;
    }
    .comAlert .alertBox .alertFooter #agree, .comAlert .alertBox .alertFooter #remember{
        width: 18px;
        height: 18px;
    }
    .comAlert .alertBox .alertFooter *{
        font-size: 14px;
    }
    .comAlert .alertBox .formBox .formItem .getCode{
        font-size: 16px;
    }
    .comAlert .alertBox .formBox .formItem label{
        width: 90px;
        font-size: 14px;
    }
    .comAlert .alertBox .toLogin{
        font-size: 14px;
    }
    .comAlert .alertBox .alertFooter.agree *{
        font-size: 12px;
    }
    .comAlert .alertBox.agreement{
        width: 90%;
        padding: 20px;
    }
    .comAlert .alertBox.agreement .alertTitle{
        width: 100%;
        font-size: 20px;
    }
    .comAlert .alertBox article,
    .comAlert .alertBox article *{
        padding-right: 0;
        font-size: 14px;
        line-height: 1.5;
    }
    .bread{
        height: auto;
        min-height: .7rem;
    }
    .bread .left{
        flex-wrap: wrap;
    }
    *{
        font-size: 14px;
    }
}
