.product-wrap {
    margin: 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.product-left {
    width: 2.4rem;
    flex-shrink: 0;
    position: sticky;
    top: 0;
    overflow-y: auto;
    transition: 0.2s;
    padding: 1rem 0;
    max-height: 100vh;
}

.product-nav-box {
    margin-bottom: .4rem;
}

.product-nav-box:last-of-type {
    margin-bottom: 0;
}

.product-nav {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.product-nav p {
    font-size: 0.18rem;
    font-family: Microsoft YaHei-Bold, Microsoft YaHei;
    font-weight: bold;
    color: #333333;
    flex: 1;
}

.product-nav img {
    width: .2rem;
    flex-shrink: 0;
    margin-left: .1rem;
}

.product-nav-list {
    height: 0;
    transition: all .365s;
    overflow: hidden;
}

.product-nav-item {
    display: flex;
    align-items: center;
    margin-top: .3rem;
}

.product-nav-item input {
    width: 0.16rem;
    height: 0.16rem;
    flex-shrink: 0;
    margin-right: .1rem;
    cursor: pointer;
}

.product-nav-item p {
    font-size: 0.16rem;
    font-family: Microsoft YaHei-Regular, Microsoft YaHei;
    font-weight: 400;
    color: #333333;
}

.product-nav-box.active .product-nav-list {
    height: auto;
}

.product-sort-box {
    margin: .3rem 0;
    padding: .3rem 0;
    border-top: 0.01rem solid #DDDDDD;
    border-bottom: 0.01rem solid #DDDDDD;
}

.product-sort-title {
    font-size: 0.18rem;
    font-family: Microsoft YaHei-Bold, Microsoft YaHei;
    font-weight: bold;
    color: #333333;
}

.product-sort {
    display: flex;
    align-items: center;
    margin-top: .23rem;
}

.product-sort input {
    width: 0.16rem;
    height: 0.16rem;
    flex-shrink: 0;
    margin-right: .1rem;
}

.product-sort p {
    font-size: 0.16rem;
    font-family: Microsoft YaHei-Regular, Microsoft YaHei;
    font-weight: 400;
    color: #333333;
}

.product-close-box {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.product-close-box img {
    width: .18rem;
    margin-right: .12rem;
}

.product-close-box p {
    font-size: 0.14rem;
    font-family: Microsoft YaHei-Regular, Microsoft YaHei;
    font-weight: 400;
    color: #999999;
}

/*  */
.product-box {
    /* flex: 1; */
    width: 13rem;
    /* margin-left: .6rem; */
    padding: 1rem 0;
}

.product-top-box {
    display: flex;
    align-items: center;
    background: #f9f9f9;
}

.product-top-img {
    width: 6.5rem;
    height: 3rem;
    flex-shrink: 0;
}

.product-top-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-top-des {
    flex: 1;
    margin-left: .9rem;
    padding-right: .4rem;
}

.product-top-text {
    font-size: 0.24rem;
    font-family: Microsoft YaHei-Bold, Microsoft YaHei;
    font-weight: bold;
    color: #333333;
}

.product-top-p {
    font-size: 0.18rem;
    font-family: Microsoft YaHei-Regular, Microsoft YaHei;
    font-weight: 400;
    color: #666666;
    line-height: 0.4rem;
    margin-top: .25rem;
}

.product-list {
    margin-top: .6rem;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: .2rem;
}

.product-item {
    width: 4rem;
    margin-right: .5rem;
    margin-bottom: .4rem;
    border: 0.01rem solid #DDDDDD;
}

.product-item:nth-child(3n) {
    margin-right: 0;
}

.product-img {
    width: 100%;
    height: 3.6rem;
}

.product-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-des {
    padding: .25rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.product-text {
    font-size: 0.24rem;
    font-family: Microsoft YaHei-Bold, Microsoft YaHei;
    font-weight: bold;
    color: #333333;
}

.product-price {
    font-size: 0.2rem;
    font-family: Bahnschrift-Bold, Bahnschrift;
    font-weight: bold;
    color: #999999;
    margin: .25rem 0;
}

.product-bt {
    font-size: 0.18rem;
    font-family: Microsoft YaHei-Regular, Microsoft YaHei;
    font-weight: 400;
    color: #273359;
    padding-bottom: .1rem;
    border-bottom: 0.01rem solid #273359;
}

/* 产品详情 */
.goodsDetail-wrap {
    background: #F9F9F9;
    padding-bottom: .8rem;
}

.goodsDetail-box {
    margin: 0 auto;
    background: #FFFFFF;
    box-shadow: 0rem 0rem 0.1rem 0.01rem rgba(0, 0, 0, 0.07);
    padding: .8rem .7rem;
}

.goodsDetail {
    display: flex;
    align-items: flex-start;
}

.goodsDetail-left {
    width: 6rem;
    flex-shrink: 0;
    position: relative;
}

.goodsSwiper2 {
    width: 100%;
    background: #fff;
    height: 6rem;
    overflow: hidden;
    border: 0.01rem solid #DDDDDD;
}

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


.goodsDetail-banner {
    width: 100%;
    position: relative;
    /* padding: 0 0.54rem; */
    margin-top: 0.2rem;
}

.goodsSwiper {
    width: 100%;
    overflow: hidden;
}

.goodsSwiper img {
    width: 100%;
    height: 1rem;
    object-fit: contain;
    cursor: pointer;
}

.goodsDetail-banner .swiper-button-next,
.goodsDetail-banner .swiper-button-prev {
    width: 0.38rem;
    height: 100%;
    margin: 0;
    top: 0;
    border: 1px solid #ccc;
}

.goodsDetail-banner .swiper-button-next:after,
.goodsDetail-banner .swiper-button-prev:after {
    font-size: 0.3rem;
    color: #ccc;
}

.goodsDetail-banner .swiper-button-next {
    right: 0;
}

.goodsDetail-banner .swiper-button-prev {
    left: 0;
}

/*  */
.goodsDetail-right {
    flex: 1;
    margin-left: .8rem;
}

.goodsDetail-text {
    font-size: 0.3rem;
    font-family: Microsoft YaHei-Bold, Microsoft YaHei;
    font-weight: bold;
    color: #333333;
}

.goodsDetail-price {
    font-size: 0.24rem;
    font-family: Bahnschrift-Bold, Bahnschrift;
    font-weight: bold;
    color: #144ED6;
    margin: .3rem 0;
}

.goodsDetail-size-box {}

.goodsDetail-size-text {
    font-size: 0.18rem;
    font-family: Microsoft YaHei-Regular, Microsoft YaHei;
    font-weight: 400;
    color: #333333;
}

.goodsDetail-size-list {
    display: flex;
    flex-wrap: wrap;
}

.goodsDetail-size {
    width: 1.8rem;
    height: 0.42rem;
    background: #FFFFFF;
    opacity: 1;
    border: 0.01rem solid #707070;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.14rem;
    font-family: Microsoft YaHei-Regular, Microsoft YaHei;
    font-weight: 400;
    color: #666666;

    margin-right: .2rem;
    margin-top: .2rem;
    cursor: pointer;
}

.goodsDetail-size:nth-child(4n) {
    margin-right: 0;

}

.goodsDetail-bt {
    width: 1.6rem;
    height: 0.42rem;
    background: #FFFFFF;
    border-radius: 0.03rem 0.03rem 0.03rem 0.03rem;
    opacity: 1;
    border: 0.02rem solid #273359;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.16rem;
    font-family: Microsoft YaHei-Bold, Microsoft YaHei;
    font-weight: bold;
    color: #273359;
    margin-top: .3rem;
    cursor: pointer;
}

.goodsDetail-p-box {
    margin-top: .3rem;
}

.goodsDetail-p {
    margin-top: .15rem;
    font-size: 0.16rem;
    font-family: Microsoft YaHei-Regular, Microsoft YaHei;
    font-weight: 400;
    color: #666666;
    line-height: 0.26rem;
}

/*  */
.goodsDetail-detail {
    border-bottom: 0.01rem solid #DDDDDD;
    display: flex;
    margin-top: 1rem;
}

.goodsDetail-detail p {
    height: 0.42rem;
    background: #EEEEEE;
    padding: 0 .3rem;
    font-size: 0.2rem;
    font-family: Microsoft YaHei-Regular, Microsoft YaHei;
    font-weight: 400;
    color: #333333;
    line-height: 0.42rem;
}

.goodsDetail-content p{
    font-size: 0.16rem;
    font-family: Microsoft YaHei-Regular, Microsoft YaHei;
    font-weight: 400;
    color: #333333;
    line-height: 0.3rem;
    padding: .4rem 0;
}

.goodsDetail-bz-box {
    display: flex;
    justify-content: space-between;
    margin-top: .6rem;
}

.goodsDetail-bz {
    display: flex;
    width: 6.6rem;
    background: #F9F9F9;
}

.goodsDetail-bz-img {
    width: 3rem;
    height: 3.36rem;
    flex-shrink: 0;
}

.goodsDetail-bz-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.goodsDetail-bz-des {
    flex: 1;
    padding: .7rem 0.5rem;
}

.goodsDetail-bz-text {
    font-size: 0.24rem;
    font-family: Microsoft YaHei-Bold, Microsoft YaHei;
    font-weight: bold;
    color: #333333;
}

.goodsDetail-bz-p p{
    font-size: 0.18rem;
    font-family: Microsoft YaHei-Regular, Microsoft YaHei;
    font-weight: 400;
    color: #333333;
    line-height: 0.36rem;
    margin-top: .3rem;
}
