.head { height: 468rpx; position: relative; top: 90rpx; } .head-search { padding: 0rpx 20rpx; height: 90rpx; display: flex; justify-content: space-evenly; align-items: center; top: 0; z-index: 99; position: fixed; background-color: #FFFFFF; } .search-input { width: 100%; } .search-input input { width: 100%; } .search { height: 68rpx; width: 670rpx; background-color: #f6f6f6; opacity: 0.8; border-radius: 34rpx; display: flex; align-items: center; padding: 0rpx 20rpx; } .search image { width: 28rpx; height: 28rpx; margin-right: 12rpx; } .search-message { height: 68rpx; width: 68rpx; border-radius: 50%; opacity: 0.8; background-color: #f6f6f6; display: flex; align-items: center; justify-content: center; margin-left: 22rpx; position: relative; } .search-message image { width: 46rpx; height: 46rpx; } .search-message .ke { text-align: center; opacity: 0; position: absolute; top: 0; right: 0; width: 60px; height: 30px; } .bgimg { width: 100%; height: 37rpx; position: relative; top: -5rpx; } .card { height: 360rpx; } .card-grid { height: 134rpx; display: flex; flex-wrap: wrap; padding: 0rpx 48rpx; margin-bottom: 40rpx; padding-top: 11rpx; } .card-grid view image { height: 90rpx; width: 90rpx; border-radius: 50%; } .card-grid-item { width: 134rpx; height: 134rpx; display: flex; flex-wrap: wrap; justify-content: center; margin-left: 15rpx; margin-right: 14rpx; margin-bottom: 40rpx; } .card-grid-item .title { color: #333; font-size: 24rpx; font-weight: 500; } .card-grid-item .navigator { display: flex; flex-wrap: wrap; justify-content: center; } .news { height: 80rpx; padding: 0rpx 30rpx; display: flex; align-items: center; } .news image { height: 27rpx; width: 114rpx; border-right: 1rpx solid #ddd; padding-right: 19rpx; } .news-title { width: 476rpx; color: #333; margin-left: 20rpx; font-size: 24rpx; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .news-swiper { width: 100%; height: 30rpx; } .news-swiper-item { display: flex; align-items: center; } .group { height: 416rpx; } .group-head { height: 90rpx; display: flex; justify-content: space-between; align-items: center; padding: 0rpx 27rpx; } .group-title { display: flex; align-items: center; } .group-title image { width: 44rpx; height: 44rpx; } .group-title .title { color: #333; font-weight: bold; font-size: 32rpx; margin-left: 7rpx; } .group-gengduo { display: flex; align-items: center; } .group-gengduo image { width: 16rpx; height: 28rpx; } .group-gengduo .title { color: #999; font-size: 26rpx; font-weight: 500; padding-right: 14rpx; } .scroll-view_H { height: 280rpx; width: 100%; white-space: nowrap; } .scroll-hd { height: 240rpx; width: 100%; white-space: nowrap; } .scroll-hd-item { display: inline-block; width: 165rpx; height: 210rpx; border: 1rpx solid rgba(255,53,81,1); background: rgba(255,255,255,1); border-radius: 8rpx; margin-right: 10rpx; text-align: center; } .scroll-view-item_H { height: 274rpx; width: 200rpx; display: inline-block; margin-left: 30rpx; } .scroll-view-item_H image { height: 200rpx; width: 200rpx; position: absolute; } .scroll-view-item_H .title { font-size: 26rpx; font-weight: 500; text-align: conter; width: 210rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .scroll-view-item_H .num { font-size: 28rpx; font-weight: bold; color: #ff022f; text-align: conter; } .scroll-view-item_H .new-s { color: #999; font-size: 24rpx; text-decoration: line-through; } .list-card { background-color: #eee; padding: 10rpx 0 0; height: 260rpx; } .list-card-lj { display: flex; justify-content: space-between; margin: 8rpx 15rpx; box-shadow: 5px 5px 3px #ccc; background-color: #fff; } .list-card-lj item { width: 335rpx; height: 160rpx; } .list-card-lj image { width: 325rpx; height: 180rpx; background-color: #666; border-radius: 10rpx; } .list-card-lj .item { position: relative; margin: 20rpx 8px; } .list-card-lj .item .item-body { position: absolute; top: 0; margin: 24rpx 24rpx; } .list-card-lj .item .item-body .hd-title { color: #fff; font-weight: bold; font-size: 30rpx; } .list-card-lj .item .item-body .hef-title { font-size: 24rpx; color: #fff; font-weight: 500; } .list-card-lj .item .item-body .hef-yuan { margin-top: 20rpx; height: 30rpx; width: 60rpx; color: #fff; font-size: 22rpx; font-weight: bold; text-align: center; border-radius: 15rpx; } .list-card-lj .item .item-body .hef-red { background-color: #ff3e2e; } .list-card-lj .item .item-body .hef-zs { background-color: #a438ff; } .list-card-hd { display: flex; margin: 0rpx 30rpx; } .list-card-hd .item { width: 165rpx; height: 210rpx; border: 1rpx solid rgba(255,53,81,1); background: rgba(255,255,255,1); border-radius: 8rpx; display: flex; flex-wrap: wrap; justify-content: center; margin-right: 10rpx; } .list-card-hd .item view { text-align: center; } .maintitle { text-align: center; color: #333; font-size: 28rpx; margin-top: 20rpx; } .vicetitle { color: #ff3551; font-size: 22rpx; font-weight: 500; text-align: center; } .scroll-hd-item image { width: 120rpx; height: 119rpx; display: inline-block; } .sellwell { height: 70rpx; margin: 0rpx 30rpx; display: flex; align-items: flex-end; } .sellwell image { width: 48rpx; height: 48rpx; } .cellwell-list { margin: 0rpx 30rpx; } .cellwell-list-item { height: 250rpx; margin: 30rpx 0rpx; border-bottom: 1rpx solid #e6e6e6; display: flex; } .cellwell-list-item .item-image { position: relative; } .cellwell-list-item .item-image .bg { border-radius: 8rpx; width: 220rpx; height: 220rpx; position: relative; background-color: #f6f6f6; } .cellwell-list-item .item-image .hdlx { width: 48rpx; height: 50rpx; position: absolute; left: 0; } .cellwell-list-item .item-body { margin-left: 42rpx; width: 100%; } .cellwell-list-item .item-body .sp-title { color: #000; font-size: 28rpx; font-weight: 500; word-break: break-all; word-wrap: break-word; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .cellwell-list-item .item-body .sp-num { color: #999; font-size: 24rpx; } .line { height: 21rpx; background-color: #f6f6f6; } .tishi { display: flex; flex-direction: column; align-items: center; } .text-red { color: #ff0230; font-size: 24rpx; } .body-top { margin-top: 69rpx; display: flex; justify-content: space-between; } .body-top image { width: 60rpx; height: 60rpx; } .body-top-left { color: #ff0230; font-size: 28rpx; font-weight: bold; } .body-top-right { color: #9b9b9b; font-size: 24rpx; font-weight: 500; text-decoration: line-through; margin-left: 8rpx; } .navhover { background-color: #fff; border-bottom: 1rpx solid #e6e6e6; } .prompt { font-size: 13px; color: #666; display: flex; justify-content: center; margin-bottom: 20rpx; } .mask { position: fixed; top: 0; height: 100%; width: 100%; background-color: #66666699; z-index: 2; } .maskcard { position: fixed; bottom: 0; width: 100%; height: 744rpx; background-color: #FFFFFF; z-index: 10; } .padding { padding-left: 30rpx; padding-right: 30rpx; } .maskcard .card-title { display: flex; justify-content: space-between; padding-top: 20rpx; } .maskcard .card-title .card-title-head { width: 140rpx; height: 140rpx; border: 1px solid rgba(221,221,221,1); } .maskcard .card-title .close-img { width: 27rpx; height: 28rpx; } .title-box { display: flex; } .title-box .num { color: #FF0230; font-weight: bold; font-size: 30rpx; } .title-box .save { padding-top: 10rpx; color: #999999; font-size: 24rpx; font-weight: 500; } .title-box .item { margin-left: 20rpx; display: flex; flex-direction: column; justify-content: flex-end; } .maskcard .line { width: 92%; background-color: #E6E6E6; height: 2rpx; margin: 30rpx 30rpx; } .col { display: flex; flex-wrap: wrap; width: 100%; } .col .item { width: 120rpx; height: 56rpx; background-color: #F6F6F6; border-radius: 8rpx; margin-right: 18rpx; margin-bottom: 10rpx; color: #333333; font-size: 26rpx; display: flex; justify-content: center; align-items: center; } .titles { margin-bottom: 24rpx; color: #999999; font-size: 28rpx; } .active { color: #FF0230!important; border: 2rpx solid rgba(255,2,48,1); width: 116rpx!important; height: 52rpx!important; } .feat { display: flex; justify-content: space-between; } .feat .feat-title { color: #999999; font-size: 28rpx; } .feat .fbox { width: 170rpx; height: 46rpx; border: 2rpx solid #DDDDDD; border-radius: 4rpx; } .feat .fbox .fbox-50 { width: 50rpx; height: 46rpx; text-align: center; } .feat .fbox .fbox-input { width: 68rpx; height: 46rpx; text-align: center; border-left: 2rpx solid #DDDDDD; border-right: 2rpx solid #DDDDDD; } .card-btn { height: 98rpx; width: 100%; margin-top: 40rpx; background: linear-gradient(-90deg,rgba(255,0,46,1) 0%,rgba(255,47,85,1) 100%); display: flex; justify-content: center; align-items: center; } .overf { overflow: scroll; height: 402rpx; } .card-text { color: #FFFEFE; font-size: 34rpx; } .hideBG { display: none; } @-webkit-keyframes slideBGtUp { from { background: transparent; } to { background: rgba(0,0,0,0.1); } } @keyframes slideBGtUp { from { background: transparent; } to { background: rgba(0,0,0,0.1); } } @-webkit-keyframes slideBGDown { from { background: rgba(0,0,0,0.1); } to { background: transparent; } } @keyframes slideBGDown { from { background: rgba(0,0,0,0.1); } to { background: transparent; } } .openBG { animation: slideBGtUp 0.5s ease-in both; } .closeBG { animation: slideBGDown 0.5s ease-in both; } .showContent { display: block!important; } .hideContent { display: none!important; } @-webkit-keyframes slideContentUps { from { height: 0; } to { height: 744rpx; } } @keyframes slideContentUps { from { height: 0; } to { height: 744rpx; } } @-webkit-keyframes slideContentDowns { from { height: 744rpx; } to { height: 0; } } @keyframes slideContentDowns { from { height: 744rpx; } to { height: 0; } } .opens { display: block!important; animation: slideContentUps 0.5s ease-in both; } .closesa { animation: slideContentDowns 0.5s ease-in both; } .item-image { height: 200rpx; width: 200rpx; position: relative; } .item-image-bon { width: 108rpx!important; height: 28rpx!important; position: absolute; z-index: 1; bottom: 0; left: 25%; display: flex; justify-content: center; align-items: center; } .item-image-bon image { width: 108rpx!important; height: 28rpx!important; } .item-image-bon text { font-size: 18rpx; color: #FFFFFF; position: absolute; z-index: 2; } .newbg { width: 48rpx; height: 50rpx; position: absolute; top: 0; left: 8rpx; z-index: 1; } .scroll-hd-item0 { border: 1rpx solid #FF3551!important; } .scroll-hd-item1 { border: 1rpx solid #BB5233!important; } .scroll-hd-item2 { border: 1rpx solid #E03CA3!important; } .scroll-hd-item3 { border: 1rpx solid #FA8801!important; } .vicetitle0 { color: #FF3551; } .vicetitle1 { color: #BB5233; } .vicetitle2 { color: #E03CA3; } .vicetitle3 { color: #FA8801; } .wx-swiper-dots { position: relative; } .wx-swiper-dots.wx-swiper-dots-horizontal { bottom: 42rpx; } /*products css*/ .goods-block {padding: 20rpx 0 0;} .goods-block-tit {height: 90rpx; line-height: 90rpx; background-color: #fff; border-bottom: 0px solid #eee; font-size: 32rpx; font-weight: 700; color: #000;} .goods-block-tit image {width: 30rpx; height: 30rpx; float: left; margin: 30rpx 20rpx 0 30rpx;} .goods-area {padding: 0 30rpx;background-color: #fff; } .goods-box { border-bottom: 1rpx solid #eee; position: relative; display: flex; flex-direction: row; padding: 30rpx 0; } .goods-box:last-child {border-bottom: 0;} .goods-photo {width: 220rpx; height: 220rpx; border-radius: 15rpx;} .goods-info {width: 470rpx; box-sizing: border-box; padding-left: 30rpx; position: relative; font-size: 24rpx; line-height: 48rpx;} .goods-title {font-size: 30rpx; font-weight: 700; color: #000; height: 84rpx; overflow: hidden; line-height: 42rpx; margin-bottom: 5rpx;} .p-sale {color: #999;} .goods-text {font-family: Arial; padding-top: 42rpx; line-height: 60rpx; height: 60rpx;} .p-price {color: #f00; font-weight: 600; padding-right: 20rpx; float: left; font-size: 32rpx; line-height: 56rpx;} .p-price-y {color: #999; text-decoration: line-through;} .icon-cart, .goods-button {width: 65rpx; height: 65rpx; position: absolute; right: 5rpx; bottom: 5rpx;} .goods-button {width: 150rpx; background-color: #d62418; color: #fff; font-size: 26rpx; box-sizing: border-box; padding: 15rpx 15rpx 0 25rpx; line-height: 30rpx; border-radius: 5rpx;} .goods-button image {float: right; width: 30rpx; height: 30rpx;} .bottom-pt {text-align: center; padding: 30rpx; font-size: 28rpx;} .icon-right-arrt {position: absolute; top: 50%; right: 30rpx; width: 30rpx; height: 30rpx; margin-top: -15rpx;} .datails-size-area .n-dt {width: 100rpx; display: inline-block;} .button-100 {width: 100%; height: 100%; position: absolute; top: 0; left: 0; opacity: 0; z-index: 110;} .content-box {padding: 20rpx 0; line-height: 2em; font-size: 28rpx; text-align: left;} .content-box .wxParse-p {padding: 0 30rpx;} .content-box .wxParse-img {display: block; margin: 0; width: 100%;} .block-area {background-color: #fff; margin-bottom: 20rpx;} .block-title {height: 80rpx; line-height: 80rpx; padding: 0 30rpx;} .block-title text {font-size: 32rpx; font-weight: 700; color: #000;} .block-title .n-link {float: right; font-size: 24rpx; color: #a6a6a6; padding-right: 30rpx; position: relative;} .block-title .n-link image {width: 24rpx; height: 24rpx; position: absolute; top: 50%; right: 0; margin-top: -12rpx;} .nav-area { background-color: #fff;padding: 20rpx 0 0; height: 360rpx; } .nav-menu {padding: 20rpx 15rpx; height: 134rpx; display: flex; flex-wrap: wrap; padding: 0rpx 48rpx; margin-bottom: 40rpx; padding-top: 11rpx; } .nav-view { width: 134rpx; height: 134rpx; display: flex; flex-wrap: wrap; justify-content: center; margin-left: 15rpx; margin-right: 14rpx; margin-bottom: 40rpx; } .nav-view image {width: 100rpx; height: 100rpx; border-radius: 10rpx; margin: 0 auto 5rpx;} .nav-view .n-text {font-size: 28rpx; color: #000; line-height: 50rpx;} .nav-views { width: 141rpx; height: 134rpx; display: flex; flex-wrap: wrap; justify-content: center; margin-left: 15rpx; margin-right: 14rpx; margin-bottom: 40rpx; } .nav-views image {width: 100rpx; height: 100rpx; border-radius: 10rpx; margin: 0 auto 5rpx;} .nav-views .n-text {font-size: 28rpx; color: #000; line-height: 30rpx;} .user-title {height: 80rpx; line-height: 80rpx; padding: 0 30rpx;} .sellwellx .n-link {float: right; font-size: 24rpx; color: #a6a6a6; padding-right: 30rpx; position: relative;} .sellwellx .n-link image {width: 24rpx; height: 24rpx; position: absolute; top: 50%; right: 0; margin-top: -12rpx;} .sellwellx { height: 70rpx; margin: -40rpx 30rpx; } .bgimgx { width: 100%; height: 233rpx; position: relative; top: 15rpx; } .list-cardx { background-color: #fff; padding: 20rpx 0 0; height: 200rpx; } .list-cardx-lj { justify-content: space-between; margin: 7rpx 345rpx; } .list-cardx-lj item { width: 335rpx; height: 160rpx; } .list-cardx-lj image { width: 375rpx; height: 190rpx; background-color: #666; border-radius: 10rpx; } .list-cardx-lj .item { position: relative; } .list-cardx-lj .item .item-body { position: absolute; top: 0; margin: 24rpx 120rpx; } .list-cardx-lj .item .item-body .hd-title { color: #000; font-weight: bold; font-size: 35rpx; margin: -10rpx -90rpx; } .list-cardx-lj .item .item-body .hef-title { font-size: 24rpx; color: #000; font-weight: 500; margin: -10rpx -90rpx; } .list-cardx-lj .item .item-body .hef-yuan { margin-top: 20rpx; height: 30rpx; width: 60rpx; color: #fff; font-size: 22rpx; font-weight: bold; text-align: center; border-radius: 15rpx; } .list-cardx-lj .item .item-body .hef-red { background-color: #ff3e2e; } .list-cardx-lj .item .item-body .hef-zs { background-color: #a438ff; } .list-cardx-hd { display: flex; margin: 0rpx 30rpx; } .list-cardx-hd .item { width: 165rpx; height: 210rpx; border: 1rpx solid rgba(255,53,81,1); background: rgba(255,255,255,1); border-radius: 8rpx; display: flex; flex-wrap: wrap; justify-content: center; margin-right: 10rpx; } .list-cardx-hd .item view { text-align: center; } .list-cardx-ljx { justify-content: space-between; margin: -215rpx 30rpx; } .list-cardx-ljx item { width: 335rpx; height: 160rpx; } .list-cardx-ljx image { width: 305rpx; height: 392rpx; background-color: #666; border-radius: 10rpx; } .list-cardx-ljx navigator { position: relative; } .list-cardx-ljx .item .item-body { position: absolute; top: 0px; margin: 24rpx 24rpx; } .list-cardx-ljx .item .item-body .hd-title { color: #000; font-weight: bold; font-size: 30rpx; } .list-cardx-ljx .item .item-body .hef-title { font-size: 24rpx; color: #000; font-weight: 500; margin: 0rpx 5rpx; } .list-cardx-ljx .item .item-body .hef-yuan { margin-top: 20rpx; height: 30rpx; width: 60rpx; color: #fff; font-size: 22rpx; font-weight: bold; text-align: center; border-radius: 15rpx; } .list-cardx-ljx .item .item-body .hef-red { background-color: #ff3e2e; } .list-cardx-ljx .item .item-body .hef-zs { background-color: #a438ff; } .goTop{ height: 80rpx; width: 80rpx; position: fixed; bottom: 50rpx; top: 1080rpx; background: rgba(0,0,0,.7); border-radius: 50rpx; right: 30rpx; /* */ z-index: 9999; }