@charset "UTF-8"; /* 页面左右间距 */ /* 文字尺寸 */ /*文字颜色*/ /* 边框颜色 */ /*颜色*/ /* 图片加载中颜色 */ /* 行为相关颜色 */ /* 功能栏字体大小 */ /*功能栏左侧小图标*/ /* 弹出层 */ .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: 30vh; border-radius: 10rpx 10rpx 0 0; background-color: #fff; } .popup .layer .btn { height: 66rpx; line-height: 66rpx; border-radius: 100rpx; background: #FF4C4C; 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%); } } /* 规格选择弹窗 */ .attr-content { padding: 10rpx 30rpx; } .attr-content .a-t { display: flex; } .attr-content .a-t image { width: 170rpx; height: 170rpx; flex-shrink: 0; border-radius: 8rpx; } .attr-content .a-t .right { display: flex; flex-direction: column; padding-left: 24rpx; font-size: 26rpx; color: #606266; line-height: 42rpx; } .attr-content .a-t .right .good-name { padding-top: 20rpx; max-width: 320rpx; font-size: 30rpx; font-family: PingFang SC; font-weight: bold; color: #1d2023; line-height: 42rpx; margin-bottom: 15rpx; } .attr-content .a-t .right .price { font-size: 60rpx; font-family: PingFang SC; font-weight: bold; color: #ff6f0f; } .attr-content .a-t .right .selected-text { margin-right: 10rpx; } .attr-content .attr-list { display: flex; flex-direction: column; font-size: 30rpx; color: #606266; padding-top: 30rpx; padding-left: 10rpx; } .attr-content .item-list { padding: 20rpx 0 0; display: flex; flex-wrap: wrap; } .attr-content .item-list .tit { display: flex; align-items: center; justify-content: center; background: #eee; margin-right: 20rpx; margin-bottom: 20rpx; border-radius: 100rpx; min-width: 60rpx; height: 60rpx; padding: 0 20rpx; font-size: 28rpx; color: #303133; } .attr-content .item-list .selected { background: #FCEFF1; border: 1px solid #EF041F; color: #EF041F; } .goodsBottom { height: 160rpx; } page { background: #f0f0f0; } .contentBottomHeight { height: 110rpx; } .goodsBottom { height: 160rpx; } .iconenter { font-size: 30rpx; color: #888; } .con_image { width: 130rpx; height: 130rpx; display: inline-block; padding: 15rpx; } .con_image image { width: 100%; height: 100%; } /* 商品详情中限制图片大小 */ .rich-img { width: 100% !important; height: auto; } .c-list { margin-top: 20rpx; font-size: 26rpx; color: #606266; background: #fff; } .c-list .c-row { display: flex; align-items: center; padding: 20rpx 30rpx; position: relative; } .c-list .tit { width: 140rpx; } .c-list .con { 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 { flex: 1; display: flex; flex-direction: column; color: #303133; line-height: 40rpx; } .c-list .red { color: #5dbc7c; }