@charset "UTF-8"; /* 页面左右间距 */ /* 文字尺寸 */ /*文字颜色*/ /* 边框颜色 */ /*颜色*/ /* 图片加载中颜色 */ /* 行为相关颜色 */ /* 功能栏字体大小 */ /*功能栏左侧小图标*/ page { background: #f8f8f8; padding-bottom: 160rpx; line-height: 1; } .pHeight { line-height: 0; } ._div, ._table { max-width: 100% !important; } .rich-img { width: 100% !important; height: auto; } .pHeight { line-height: 0; } .popup-row { width: 580rpx; background: #ffffff; -webkit-border-radius: 20rpx; border-radius: 20rpx; } .popup-row .popup-1 { padding: 35rpx 0; font-size: 32rpx; font-weight: bold; color: #333333; text-align: center; border-bottom: 1px solid #EEEEEE; } .popup-row .popcont-box { height: 600rpx; } .popup-row .popup-2 { padding: 0 25rpx; } .popup-row .popup-2 .popup-2-row { padding: 25rpx 0; border-bottom: 1px solid #EEEEEE; } .popup-row .popup-2 .popup-2-row:nth-last-child(1) { border-bottom: none; } .popup-row .popup-2 .popup-2-row .row-1 { width: 70%; } .popup-row .popup-2 .popup-2-row .row-1 .one { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; } .popup-row .popup-2 .popup-2-row .row-1 .one image { width: 75rpx; height: 75rpx; -webkit-border-radius: 50%; border-radius: 50%; } .popup-row .popup-2 .popup-2-row .row-1 .two { margin-left: 20rpx; font-size: 28rpx; font-weight: 500; color: #333333; } .popup-row .popup-2 .popup-2-row .row-1 .two .two-1 { font-size: 28rpx; font-weight: 500; max-width: 160rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .popup-row .popup-2 .popup-2-row .row-1 .two-1-1 { font-size: 28rpx; font-weight: 500; color: #666666; } .popup-row .popup-2 .popup-2-row .row-2 { padding: 20rpx 30rpx; background: #5dbc7c; -webkit-border-radius: 10rpx; border-radius: 10rpx; font-size: 28rpx; font-weight: 500; color: #FFFFFF; } .popup-rows { width: 580rpx; background: #ffffff; -webkit-border-radius: 20rpx; border-radius: 20rpx; text-align: center; padding-bottom: 35rpx; } .popup-rows .rows-1 { font-size: 32rpx; font-weight: bold; color: #333333; padding-top: 60rpx; } .popup-rows .rows-2 { margin-top: 25rpx; font-size: 28rpx; font-weight: 500; color: #333333; } .popup-rows .rows-3 { margin-top: 35rpx; padding: 0 50rpx; } .popup-rows .rows-3 .rows-3-group { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; } .popup-rows .rows-3 .rows-3-group .group-1 { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; } .popup-rows .rows-3 .rows-3-group .group-2 { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; font-size: 20rpx; font-weight: 500; color: #666666; margin-top: 10rpx; width: 55rpx; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .popup-rows .rows-3 .rows-3-group image { width: 80rpx; height: 80rpx; -webkit-border-radius: 50%; border-radius: 50%; } .popup-rows .rows-3 .rows-3-group .group-1-1 { z-index: 10; margin-top: -25rpx; width: 70rpx; height: 25rpx; background: #e64048; -webkit-border-radius: 12rpx; border-radius: 12rpx; font-size: 20rpx; font-weight: 500; color: #ffffff; line-height: 25rpx; } .popup-rows .rows-4 { margin: 40rpx 45rpx 0rpx 45rpx; padding: 25rpx 0; background: #5dbc7c; -webkit-border-radius: 10rpx; border-radius: 10rpx; font-size: 32rpx; font-weight: 500; color: #ffffff; } .delete { width: 60rpx; height: 60rpx; position: absolute; right: -30rpx; top: -30rpx; } .delete image { width: 60rpx; height: 60rpx; } /* 评价 */ .eva-section { padding: 20rpx 30rpx; background: #fff; margin-top: 20rpx; } .eva-section .e-header { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; font-size: 28rpx; color: #333333; } .eva-section .e-header .tit { margin-right: 15rpx; } .eva-section .e-header .tip { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; font-size: 24rpx; color: #999999; text-align: right; } .eva-section .e-header .iconenter { width: 24rpx; height: 24rpx; margin-left: 10rpx; } .eva-section .eva-box { padding-top: 30rpx; } .eva-section .eva-box .box-1 .left image { width: 80rpx; height: 80rpx; -webkit-border-radius: 50%; border-radius: 50%; } .eva-section .eva-box .box-1 .left .content { margin-left: 15rpx; } .eva-section .eva-box .box-1 .left .content .content-name { font-size: 24rpx; font-weight: 500; color: #333333; } .eva-section .eva-box .box-1 .left .content .content-time { font-size: 20rpx; font-weight: 500; color: #999999; } .eva-section .eva-box .box-1 .right .image { width: 25rpx; height: 25rpx; margin-left: 10rpx; } .eva-section .eva-box .box-1 .right .red { margin-left: 15rpx; font-size: 24rpx; font-weight: 500; color: #fd5b23; } .eva-section .eva-box .box-2 { padding: 30rpx 0 15rpx 0; font-size: 28rpx; font-weight: 500; color: #666666; } .eva-section .eva-box .box-3 .box-3-1 { display: inline; width: 150rpx; height: 150rpx; } .eva-section .eva-box .box-3 .box-3-1 image { margin-right: 20rpx; width: 150rpx; height: 150rpx; } /* .list-row { position: fixed; top: 450rpx; left: 86rpx; .row { position: relative; width: 578rpx; height: 700rpx; background: #ffffff; border-radius: 20rpx; .row-1 { flex: 1; text-align: center; padding: 26rpx 223rpx; border-bottom: 2rpx solid #eeeeee; .row-1-1 { font-size: $font-lg; font-weight: bold; color: #333333; } } .row-2 { padding: 0 23rpx; .pinklist_list { padding: 20rpx 0; display: flex; justify-content: space-around; align-items: center; border-bottom: 1px solid #eeeeee; .left { width: 74rpx; height: 74rpx; background-color: #e3e3e3; border-radius: 50%; } .center { display: flex; flex-wrap: wrap; margin-left: 17rpx; .center-1 { display: flex; align-items: center; letter-spacing: 3rpx; .center-1-1 { font-size: $font-base; font-weight: 500; color: #333333; } .center-1-2 { font-size: $font-base - 2rpx; font-weight: 500; color: #333333; } } } .right { width: 134rpx; height: 59rpx; background: $base-color; border-radius: 10rpx; display: flex; align-items: center; justify-content: center; .right-word { font-size: 26rpx; font-weight: 500; color: #ffffff; } } } } .row-3 { width: 56rpx; height: 56rpx; position: absolute; top: -28rpx; right: -28rpx; } } } */ .iconenter { font-size: 30rpx; color: #888; } .carousel { height: 722rpx; position: relative; } .carousel swiper { height: 100%; } .carousel .image-wrapper { width: 100%; height: 100%; } .carousel .swiper-item { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-align-content: center; align-content: center; height: 750rpx; overflow: hidden; } .carousel .swiper-item image { width: 100%; height: 100%; } /* 标题简介 */ .introduce-section { background: #fff; padding: 15rpx 25rpx 30rpx 25rpx; } .introduce-section .introduce-price { width: 100%; overflow: hidden; /* .share{ image{ width: 30rpx; height: 35rpx; } } */ } .introduce-section .introduce-price .price { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: end; -webkit-align-items: flex-end; align-items: flex-end; -webkit-box-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; } .introduce-section .introduce-price .price .price-left { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: end; -webkit-align-items: flex-end; align-items: flex-end; color: #fc4141; margin-right: 20rpx; } .introduce-section .introduce-price .price .price-left .left-1 { margin-right: 5rpx; font-size: 28rpx; } .introduce-section .introduce-price .price .price-left .left-2 { font-size: 48rpx; line-height: 38rpx; } .introduce-section .introduce-price .price .price-right { font-size: 28rpx; color: #333333; opacity: 0.61; } .introduce-section .introduce-price .people { width: 140rpx; height: 45rpx; background: url(data:image/png;base64,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) no-repeat center; background-size: 100%; } .introduce-section .introduce-price .people .people_number { margin-left: 60rpx; font-size: 20rpx; font-weight: 500; color: #fa2740; line-height: 40rpx; } .introduce-section .title { margin-top: 30rpx; font-size: 32rpx; color: #1D2023; line-height: 40rpx; font-weight: 600; } .introduce-section .bot-row { margin-top: 20rpx; overflow: hidden; font-size: 24rpx; font-weight: 500; color: #999999; } /* 标题简介 */ /* .introduce-section { background: #fff; padding: 20rpx 30rpx; .title { font-size: 32rpx; color: $font-color-dark; height: 50rpx; line-height: 50rpx; } .price-box { display: flex; align-items: baseline; // height: 64rpx; padding: 10rpx 0; font-size: 26rpx; color: $uni-color-primary; } .price { font-size: $font-lg + 2rpx; color: #666666 !important; } .vip_price { font-size: $font-lg + 2rpx; color: $uni-color-primary; padding-left: 15rpx; } .m-price { margin: 0 12rpx; color: $font-color-light; text-decoration: line-through; } .coupon-tip { align-items: center; padding: 4rpx 10rpx; background: $uni-color-primary; font-size: $font-sm; color: #fff; border-radius: 6rpx; line-height: 1; transform: translateY(-4rpx); } .bot-row { display: flex; align-items: center; height: 50rpx; font-size: $font-sm; color: $font-color-light; text { flex: 1; } } .people { border-radius: 10rpx; height: 35rpx !important; border: 2rpx solid #db1935; height: 40rpx; .people_image { background-color: #db1935; width: 40rpx; height: 35rpx; text-align: center; border-top-left-radius: 20%; border-bottom-left-radius: 20%; image { width: 25rpx; height: 20rpx; // margin-bottom: 5rpx; } } .people_number { padding: 5rpx 10rpx; } } } */ /* 分享 */ .share-section { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; color: #606266; background: -webkit-gradient(linear, left top, right top, from(#fdf5f6), to(#fbebf6)); background: -webkit-linear-gradient(left, #fdf5f6, #fbebf6); background: linear-gradient(left, #fdf5f6, #fbebf6); padding: 12rpx 30rpx; } .share-section .share-icon { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; width: 70rpx; height: 30rpx; line-height: 1; border: 1px solid #5dbc7c; -webkit-border-radius: 4rpx; border-radius: 4rpx; position: relative; overflow: hidden; font-size: 22rpx; color: #5dbc7c; } .share-section .share-icon:after { content: ''; width: 50rpx; height: 50rpx; -webkit-border-radius: 50%; border-radius: 50%; left: -20rpx; top: -12rpx; position: absolute; background: #5dbc7c; } .share-section .iconfavorfill { position: relative; z-index: 1; font-size: 24rpx; margin-left: 2rpx; margin-right: 10rpx; color: #fff; line-height: 1; } .share-section .tit { font-size: 28rpx; margin-left: 10rpx; } .share-section .iconprompt { padding: 10rpx; font-size: 30rpx; line-height: 1; } .share-section .share-btn { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; text-align: right; font-size: 24rpx; color: #5dbc7c; } .share-section .iconenter { font-size: 24rpx; margin-left: 4rpx; color: #5dbc7c; } .c-list { font-size: 26rpx; color: #303133; margin-top: 20rpx; background: #fff; } .c-list .c-row { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding: 20rpx 30rpx; position: relative; } .c-list .c-row .c-text text { padding-left: 25rpx; padding-right: 25rpx; } .c-list .tit { width: 140rpx; } .c-list .con { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; color: #303133; } .c-list .con .selected-text { margin-right: 10rpx; } .c-list .bz-list { height: 40rpx; font-size: 26rpx; color: #303133; } .c-list .bz-list text { display: inline-block; margin-right: 30rpx; } .c-list .con-list { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; color: #303133; line-height: 40rpx; } .c-list .red { color: #5dbc7c; } /* 评价 */ /* .eva-section { display: flex; flex-direction: column; padding: 20rpx 30rpx; background: #fff; margin-top: 16rpx; .e-header { display: flex; align-items: center; height: 70rpx; font-size: $font-sm + 2rpx; color: $font-color-light; .tit { font-size: $font-base + 2rpx; color: $font-color-dark; margin-right: 4rpx; } .tip { flex: 1; text-align: right; } .iconenter { margin-left: 10rpx; } } } .eva-box { display: flex; padding: 20rpx 0; .portrait { flex-shrink: 0; width: 80rpx; height: 80rpx; border-radius: 100px; } .right { flex: 1; display: flex; flex-direction: column; font-size: $font-base; color: $font-color-base; padding-left: 26rpx; .con { font-size: $font-base; color: $font-color-dark; padding: 20rpx 0; } .bot { display: flex; justify-content: space-between; font-size: $font-sm; color: $font-color-light; } } } .con_image { width: 130rpx; height: 130rpx; display: inline-block; padding: 15rpx; image { width: 100%; height: 100%; } }*/ /* 详情 */ .detail-desc .desc-title { font-size: 28rpx; font-weight: 500; color: #1D2023; padding: 25rpx 0; } .detail-desc .desc-title .one { width: 77rpx; height: 1px; background: -webkit-gradient(linear, left top, right top, from(rgba(204, 204, 204, 0)), to(#cccccc)); background: -webkit-linear-gradient(left, rgba(204, 204, 204, 0), #cccccc); background: linear-gradient(to right, rgba(204, 204, 204, 0), #cccccc); margin-right: 10rpx; } .detail-desc .desc-title .two { margin-left: 10rpx; width: 77rpx; height: 1px; background: -webkit-gradient(linear, right top, left top, from(rgba(204, 204, 204, 0)), to(#cccccc)); background: -webkit-linear-gradient(right, rgba(204, 204, 204, 0), #cccccc); background: linear-gradient(to left, rgba(204, 204, 204, 0), #cccccc); } /* .detail-desc { background: #fff; margin-top: 16rpx; img { max-width: 100%; } .d-header { display: flex; justify-content: center; align-items: center; height: 80rpx; font-size: $font-base + 2rpx; color: $font-color-dark; position: relative; text { padding: 0 20rpx; background: #fff; position: relative; z-index: 1; } &:after { position: absolute; left: 50%; top: 50%; transform: translateX(-50%); width: 300rpx; height: 0; content: ''; border-bottom: 1px solid #ccc; } } } */ /* 规格选择弹窗 */ .attr-content { padding: 25rpx 30rpx; } .attr-content .a-t { display: -webkit-box; display: -webkit-flex; display: flex; } .attr-content .a-t image { width: 170rpx; height: 170rpx; -webkit-flex-shrink: 0; flex-shrink: 0; -webkit-border-radius: 8rpx; border-radius: 8rpx; } .attr-content .a-t .right { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; padding-left: 24rpx; font-size: 26rpx; color: #606266; line-height: 42rpx; width: 75%; } .attr-content .a-t .right .price { font-size: 32rpx; color: #5dbc7c; margin: 10rpx 0rpx; } .attr-content .a-t .right .name { font-size: 32rpx; color: #303133; height: 50rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; } .attr-content .a-t .right .selected-text { margin-right: 10rpx; } .attr-content .attr-list { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; font-size: 30rpx; color: #606266; padding-top: 30rpx; padding-left: 10rpx; } .attr-content .item-list { padding: 20rpx 0 0; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .attr-content .item-list text { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; background: #eee; margin-right: 20rpx; margin-bottom: 20rpx; -webkit-border-radius: 100rpx; border-radius: 100rpx; min-width: 60rpx; height: 60rpx; padding: 0 20rpx; font-size: 28rpx; color: #303133; } .attr-content .item-list .selected { background: #fbebee; color: #5dbc7c; } /* 弹出层 */ .popup { position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 99; } .popup.show { display: block; } .popup.show .mask { -webkit-animation: showPopup 0.2s linear both; animation: showPopup 0.2s linear both; } .popup.show .layer { -webkit-animation: showLayer 0.2s linear both; animation: showLayer 0.2s linear both; } .popup.hide .mask { -webkit-animation: hidePopup 0.2s linear both; animation: hidePopup 0.2s linear both; } .popup.hide .layer { -webkit-animation: hideLayer 0.2s linear both; animation: hideLayer 0.2s linear both; } .popup.none { display: none; } .popup .mask { position: fixed; top: 0; width: 100%; height: 100%; z-index: 1; background-color: rgba(0, 0, 0, 0.4); } .popup .layer { position: fixed; z-index: 99; bottom: 0; width: 100%; min-height: 35vh; -webkit-border-radius: 10rpx 10rpx 0 0; border-radius: 10rpx 10rpx 0 0; background-color: #fff; } .popup .layer .btn { height: 66rpx; line-height: 66rpx; -webkit-border-radius: 100rpx; border-radius: 100rpx; background: #5dbc7c; font-size: 30rpx; color: #fff; margin: 30rpx auto 20rpx; } @-webkit-keyframes showPopup { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes showPopup { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes hidePopup { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes hidePopup { 0% { opacity: 1; } 100% { opacity: 0; } } @-webkit-keyframes showLayer { 0% { -webkit-transform: translateY(120%); transform: translateY(120%); } 100% { -webkit-transform: translateY(0%); transform: translateY(0%); } } @keyframes showLayer { 0% { -webkit-transform: translateY(120%); transform: translateY(120%); } 100% { -webkit-transform: translateY(0%); transform: translateY(0%); } } @-webkit-keyframes hideLayer { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { -webkit-transform: translateY(120%); transform: translateY(120%); } } @keyframes hideLayer { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { -webkit-transform: translateY(120%); transform: translateY(120%); } } .btn_fenxiang { position: fixed; right: 20rpx; bottom: 50%; z-index: 95; width: 100rpx; color: #ffffff; -webkit-border-radius: 100%; border-radius: 100%; background-color: #5dbc7c; line-height: 100rpx; text-align: center; font-size: 30rpx; } .shareDate { position: fixed; right: 20rpx; bottom: 50%; z-index: 95; color: #ffffff; -webkit-border-radius: 100rpx; border-radius: 100rpx; height: 120rpx; line-height: 120rpx; background-color: #5dbc7c; text-align: center; font-size: 30rpx; } /* 底部操作菜单 */ .page-bottom { position: fixed; bottom: 0rpx; z-index: 95; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; align-items: center; width: 100%; height: 100rpx; background: rgba(255, 255, 255, 0.9); } .page-bottom .botton-1 { width: 100rpx; height: 100rpx; background-color: #FFFFFF; } .page-bottom .botton-1 .botton-frame { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; } .page-bottom .botton-1 .botton-frame .img-box { width: 45rpx; height: 40rpx; } .page-bottom .botton-1 .botton-frame .img-box image { width: 100%; height: 100%; } .page-bottom .botton-1 .word { margin-top: 6rpx; font-size: 20rpx; font-weight: 400; color: #666666; } .page-bottom .botton-1 .word.active { color: #5dbc7c; } .page-bottom .p-b-btn { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; font-size: 24rpx; color: #606266; width: 100rpx; height: 100rpx; } .page-bottom .p-b-btn .iconfont { font-size: 40rpx; line-height: 48rpx; color: #909399; } .page-bottom .p-b-btn.active, .page-bottom .p-b-btn.active .iconfont { color: #5dbc7c; } .page-bottom .p-b-btn .icon-fenxiang2 { font-size: 42rpx; -webkit-transform: translateY(-2rpx); transform: translateY(-2rpx); } .page-bottom .p-b-btn .iconlikefill { font-size: 46rpx; } .page-bottom .gobuy { width: 100%; background: #db1935; height: 100%; color: #ffffff; text-align: center; padding-top: 25rpx; -webkit-border-radius: 15rpx; border-radius: 15rpx; } .page-bottom .action-btn-group { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; height: 100%; overflow: hidden; position: relative; /* .action-btn1 { display: flex; align-items: center; justify-content: center; width: 210rpx; height: 100%; font-size: $font-base; padding: 0; border-radius: 0; background: transparent; &.buy-now-btn { background-color: #ffb238; } &.add-cart-btn { background-color: #db1935; } } */ } .page-bottom .action-btn-group:after { content: ''; position: absolute; top: 50%; right: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); height: 28rpx; width: 0; } .page-bottom .action-btn-group .action-btn { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; height: 100%; font-size: 36rpx; font-weight: bold; background: transparent; -webkit-border-radius: 0; border-radius: 0; letter-spacing: 5rpx; } .page-bottom .action-btn-group .action-btn.buy-now-btn { background-color: #ffb238; } .page-bottom .action-btn-group .action-btn.add-cart-btn { background: #5dbc7c; } .page-bottom .action-btn-group .action-btn.btn-favorites-btn { background-color: #18b3ff; } .goods-pay-box { position: fixed; left: 0; bottom: 0; z-index: 95; width: 750rpx; height: 100rpx; line-height: 1; color: #ffffff; text-align: center; font-size: 32rpx; } .goods-pay-box .bgLine { background: -webkit-gradient(linear, left top, right top, from(#ef4e51), to(#f4713b)); background: -webkit-linear-gradient(left, #ef4e51 0%, #f4713b 100%); background: linear-gradient(90deg, #ef4e51 0%, #f4713b 100%); } .goods-pay-box .goods-pay { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-align-content: center; align-content: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; } .goods-pay-box .goods-pay .goods-buttom, .goods-pay-box .goods-pay .goods-buttom-money { width: 100%; } .goods-pay-box .goods-pay .goods-buttom-money { font-size: 28rpx; } .goods-pay-box .goods-pay-stop, .goods-pay-box .goods-pay { padding: 15rpx 0; height: 100%; width: 100%; } .goods-pay-box .goods-pay-stop { background: #999999; line-height: 70rpx; } .pinklistbox { background: #ffffff; text-align: center; font-size: 26rpx; margin-top: 25rpx; } .pinklistbox .listbox-1 { padding: 25rpx; font-size: 30rpx; font-weight: 500; color: #333333; border-bottom: 1px solid #EEEEEE; } .pinklistbox .listbox-1 .more { font-size: 26rpx; font-weight: 500; color: #999999; } .pinklistbox .listbox-1 .more image { width: 25rpx; height: 25rpx; } .pinklistbox .pinklist { margin: 0 25rpx; } .pinklistbox .pinklist .pinklist_list { padding: 25rpx 0; border-bottom: 1px solid #EEEEEE; } .pinklistbox .pinklist .pinklist_list:nth-last-child(1) { border-bottom: none; } /* .pinklistbox { background: #ffffff; margin-top: 25rpx; overflow: hidden; } */ .pink_num { background: -webkit-linear-gradient(left, #fdf5f6, #fbebf6); padding: 15rpx 25rpx; font-size: 26rpx; color: #dd524d; } .pint { background: -webkit-linear-gradient(0deg, #fa2740, #fe5544); -webkit-border-radius: 10rpx; border-radius: 10rpx; margin-left: 20rpx; padding: 20rpx 25rpx; color: #ffffff; font-size: 26rpx; /* .iconenter { font-size: 15px; color: #ffffff; } */ } .pink_row .pink_img { width: 70rpx; height: 70rpx; } .pink_row .pink_img image { width: 100%; height: 100%; -webkit-border-radius: 100%; border-radius: 100%; } .pink_people { font-size: 26rpx; } .pink_people text { color: #5dbc7c; } .pink_time { font-size: 26rpx; color: #909399; } .pink_name { font-size: 30rpx; color: #333333; margin-left: 20rpx; } .More { width: 100%; line-height: 2; background-color: #fc2a3f; font-size: 32rpx; margin: 0 auto; text-align: center; color: #ffffff; } .mask { z-index: 999; width: 100%; height: 100%; position: fixed; top: 0; left: 0; text-align: center; background-color: rgba(0, 0, 0, 0.5); } .mask image { width: 100%; height: 100%; opacity: 0.8; }