page{ background-color:#eee; } .top{ background-color:rgb(216, 230, 220); color: rgb(98, 155, 13); text-align: center; height:120rpx; width: 100%; padding-top:24rpx; } .center{ height: 240rpx; width: 100%; position: relative; background:#fff; } .cenleft{ width: 240rpx; height: 100%; float: left; display:flex; justify-content: center; align-items: center; } .cenleft image{ width: 200rpx; height: 200rpx; } .cenrt{ width: 460rpx; margin-top: 10rpx; } .cenright{ height: 100%; width: 460rpx; float: left; } .cenrtop{ margin-top: 10rpx; background-color: red; color: white; border-radius:10rpx; padding-left: 16rpx; width: 140rpx; font-size: 32rpx; float: left; height: 40rpx; } .cenrtoptitle{ float: left; width: 295rpx; height: 40rpx; margin-left: 12rpx; font-size: 28rpx; margin-top:12rpx; } .cenrtoptitle>span{ width: 100%; display: inline-block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap } .cenrcen{ height: 70rpx; margin-top: 35rpx; width:474rpx; } .jg{ font-size: 40rpx; margin-right: 30rpx;} .jgx{ font-size: 28rpx; color: #777; text-decoration:line-through; margin-left: 20rpx; } .cenrfoot{ align-content: center; text-align: center; border: 2rpx solid red; border-radius:10rpx; color: red; float: left; font-size: 24rpx; padding: 4rpx 16rpx; } .body{ background-color: white; /* min-height:418rpx; */ width: 100%; margin-top: 4rpx; border-top:5rpx solid #eee; height: auto; } .bodytop{ background-color: white; text-align: center; font-size: 28rpx; height:100rpx; line-height:117rpx; } .bodytop span{ color: red; } .bodyimg{ height:140rpx; width:590rpx; } .bodyimg image{ border-radius:50rpx; height: 96rpx; width: 96rpx; background-color:burlywood; margin-top: 30rpx; position: absolute; } .d { width:100rpx; height:100rpx; border-radius: 50%; overflow: hidden; background-color: #f2f2f2; } .d ~ .d { margin-left: -20rpx; } .bodyimg span{ background-color:#e22b44; color: white; font-size: 24rpx; border-radius:6rpx; padding:2rpx 10rpx; position: relative; top: 0rpx; left: 40rpx; } .bodyspan{ color: red; text-align: center; font-size: 26rpx; } .bodyselect{ line-height: 47rpx; } .bodytime{ box-sizing: border-box; height: 60rpx; width: 100%; padding-left: 40rpx; padding-right: 40rpx; display: flex; align-items: center; /* display: flex; flex-wrap: nowrap; margin-left:40rpx; align-items:center; */ } .bodytimeleft{ text-decoration:line-through; flex-grow: 1.7; } .bodytimecen-success{ text-align: center; flex-grow: 1; line-height:75rpx; font-size: 30rpx; color: #000; } .bodytimecen-success span{ color: #18ba5f; border-radius:7rpx; font-size: 30rpx; margin: 0 auto; } .bodytimecen{ text-align: center; flex-grow: 1; font-size: 30rpx; color: #000; } .bodytimecen span{ background-color: #333333; color: white; border-radius:7rpx; padding-left: 10rpx; font-size: 30rpx; margin: 0 auto; padding-right:10rpx; margin-right:5px } .bodytimecen span:last-child{ margin-right: 10rpx; } .bodytimeright{ flex-grow: 1.7; /* margin-right:72rpx; */ } .bodybutton{ width: 90%; margin: 0 auto; text-align: center; line-height: 60rpx; border-radius:15rpx; height: auto; } .bodybutton button{ height:60rpx; width: 100%; background-color: #e4374d; color: white; font-size:26rpx; border-radius:12rpx; } .bodyfoot{ width: 100%; text-align: center; font-size: 28rpx; color: #000; background-color: white; } .pintuan{ width: 100%; height: 84rpx; background-color: white; color: black; text-align: center; font-size:36rpx; margin-top: 60rpx; } .pintuanzhou{ float: left; line-height: 84rpx; width: 220rpx; } .pintuanyou{ float: right; color: rgb(168, 167, 167); line-height: 84rpx; font-size: 28rpx; margin-right: 20rpx; } .onegoods{ background-color: white; width: 345rpx; min-height: 490rpx; height:auto; border:2rpx solid #eee; float: left; margin-right:17rpx; border-radius:20rpx; } .goodsl{ background-color: white; } .onegoodsimg{ width: 100%; height: 360rpx; } .onegoodsimg image{ height: 100%; width: 100%; border-radius:20rpx 20rpx 0 0; } .xc-buttmo-frame{ min-height: 103rpx; height: auto; padding-bottom:15rpx; } .xc-buttmo-frame .onegoodsdesc { height: 80rpx; } .xc-buttmo-frame .onegoodsdesc .price{ padding-left:10rpx; height:85rpx; } .xc-ping{ border-radius: 50%; background: #fff; line-height:34rpx; width:34rpx; height:34rpx; font-size:24rpx; } .jgleft{ border-radius:36rpx; height:45rpx; line-height:50rpx; color:#fff; padding-left:7rpx; padding-right:24rpx; background:#e4374d; } .jgright{ font-size: 26rpx; height:16rpx; padding-right:10rpx; color:rgb(168, 167, 167); } .jgright span{ color: rgb(168, 167, 167); } .goodslisttop{ width: 100%; } .goodslisttop{ width: 100%; margin-top: 5rpx; border-bottom: 4rpx solid #eee; text-align: center; } .goodslistspan{ margin: 0 auto; padding-top: 20rpx; } .xian{ width: 100%; border-bottom: 2rpx solid #eee; float: left; } .bodyselect{ height: 90rpx; background-color: white; width: 100%; line-height:90rpx; } .changxin { overflow: hidden; width: 100%; padding:20rpx; } .zhangxi{ width: 100%; background-color:white; color: black; } .img{ height: 100rpx; margin-bottom: 0rpx; float: left; color: black; line-height:100rpx; display:flex; align-items:center; } .zhangxi image{ border-radius:50rpx; height: 60rpx; width: 60rpx; float: left; /* background-color: red; */ margin-left: 40rpx; margin-right:10rpx; } .zhangxi .zssj{ width: 413rpx; margin-left: 28rpx; float: right; margin-top:32rpx; } .zspan{ /* float: left; text-align: center; display: flex; align-items: center; justify-content: center; height: 48rpx; font-size: 28rpx; color:#000; margin-bottom: 10rpx; padding-bottom: 10rpx; width: 100%; background: #fff; border-bottom:3rpx solid #eee; margin-top:20rpx; */ } .mtop{ text-align: center; color: white; background-color:rgba(0, 0, 0, .4); width: 100%; height: 100%; position: fixed; z-index: 5;top:0;left: 0; } .mt1{ margin-top: 200rpx; margin-bottom: 20rpx; } .mts{ color:#E1E10B; } .mcou{ font-size: 48rpx; } .mfoot{ width: 100%; margin-top: 700rpx; } .mbtn{ margin-top: 60rrpx; width: 400rpx; background: #666666; color: #fff; border-radius: 20rpx; font-size: 32rpx; } .etop{ padding-top: 200rpx; width: 100%; height: 100%; position: fixed; left: 0rpx; top: 0rpx; z-index: 12rpx; background-color:rgba(0, 0, 0, .4); } .emyimage{ display:flex; justify-content: center; align-items: center; } .emyimage image{ background-color: red; width: 300rpx; height: 300rpx; margin: 0 auto; } .espan{ font-size: 32rpx; margin-top: 10rpx; } .erweima{ margin-top: 10rpx; display: flex; width: 100%; } .erzhou{ width: 200rpx; margin-right: 20rpx; } .erzhou image{ background-color: blanchedalmond; width: 200rpx; height: 200rpx; } .eright{ width: 500rpx; font-size: 32rpx; } .ecc{ float: right; margin-right: 48rpx; } .eee{ padding-top:40rpx; width:90%; height:70%; padding-left:32rpx; margin-left:20rpx; background-color:white; } .clear{ clear: both; } .down-arrow { display: inline-block; position: relative; width: 40rpx; height: 30rpx; margin-right: 20rpx; } .down-arrow::after { display: inline-block; content: " "; height: 18rpx; width: 18rpx; border-width: 0 2rpx 2rpx 0; border-color: #000; border-style: solid; transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0); transform-origin: center; transition: transform 0.3s; position: absolute; top: 50%; right: 10rpx; margin-top: -10rpx; } .down-arrow1 { display: inline-block; position: relative; width: 40rpx; height: 30rpx; margin-right: 20rpx; margin-top: 12rpx; } .down-arrow1::after { display: inline-block; content: " "; height: 18rpx; width: 18rpx; border-width: 0 2rpx 2rpx 0; border-color: #000; border-style: solid; transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0); transform-origin: center; transition: transform 0.3s; position: absolute; top: 50%; right: 10rpx; margin-top: -10rpx; } .down-arrow1::after { transform-origin: center; transform: rotate(-135deg); transition: transform 0.3s; } .bview { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); } .juzhong { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: row; justify-content: center; align-items: center; } .juzhong .xq { padding: 0 20rpx; background: #fff; font-size: 30rpx; padding-bottom: 20rpx; } .juzhong .xq .title { text-align: center; margin: 20rpx 0; position: relative; height: 50rpx; } .juzhong .xq .hs1 { font-size: 28rpx; color: #ab8f9e; } .juzhong .xq .title .close { position: absolute; top: 0; right: 0; width: 45rpx; height: 45rpx; } .pt_qd { margin-top: 40rpx; height: auto; } .spec-cart-btn.w100 { width: 100%; margin-left: 0; height: 80rpx; line-height: 80rpx; } .pt_status_set{ position: absolute; right: 10rpx; top:50rpx; width: 120rpx; height: 120rpx; } .xc-goods-details{ width:479rpx; margin-top:20rpx; height:77rpx; } .xc-valframe{ border-radius:7rpx; border:1rpx solid; margin-top:3rpx; } .xc-valframe .xc-frame-img{ width:30rpx; height:100%; background:#e22b44; } .xc-valframe .xc-frame-img .picture{ width:25rpx; height:25rpx; margin-top:4rpx; } .xc-ellipsis-img{ width:56rpx; height:96rpx; } .xc-ellipsis-img .pictures{ width:56rpx;height:56rpx; } .flex_tou{ display: flex; justify-content: center; width: 100%;} .xc-ptcomplete{ width:74%; height:105rpx; line-height:105rpx; float:right; } .xc-ptcomplete .xc-img-frame .img{ width: 105rpx; height: 105rpx; float: right; } .xc-ptcomplete-ladder .xc-img-frame{ width:201rpx; height: 105rpx; margin-top:20rpx; } .xc-ptcomplete-ladder .xc-img-frame .img{ width: 105rpx; height: 105rpx; float: right; padding-right:6rpx; } .xc-ptcomplete .xc-img-frame{ width:190rpx; height: 105rpx; margin-top:20rpx; } .xc-ptcomplete .xc-end{ width:283rpx; text-align:right; } .iw{ padding-right:33rpx; } .xc-ptcomplete .xc-img-frames{ width:360rpx; height:105rpx; margin-top:20rpx; } .xc-ptcomplete .xc-img-frames .img{ width: 105rpx; height: 105rpx; float: right; padding-right:6rpx; } .xc-home-page-frame{ padding-top:16rpx; } .xc-home-page-frame .xc-home-page{ background-color: #e22b44;border-radius:15rpx; width:90%; color:#fff; height:60rpx; font-size:26rpx; line-height:60rpx; } /* */ .xc-people-val{ padding-left:8rpx; padding-right:8rpx; } .xc-onclik{ width:100%; height:70rpx; } .xc-green{ color: #18ba5f; text-align:center; flex-grow:1; height:90rpx; } .xc-ptcomplete-ladder{ width:74%; height:105rpx; line-height:105rpx; float:right; } .xc-fail-ladder{ width:61%; height:105rpx; line-height:105rpx; float:right; } .xc-fail-ladder .xc-img-frame{ width:61%; height:105rpx; margin-top:20rpx; } .xc-fail-ladder .xc-img-frame .img{ width: 105rpx; height: 105rpx; float: right; padding-right:6rpx; } .xc-list{ background-color:#e22b44; color:white; font-size:17rpx; border-radius:6rpx; padding:0 5rpx; position:absolute; top:13rpx; left:80rpx; width:34rpx; line-height:25rpx; } .xc-linellae-frame{ width: 100%; height: 60rpx; background: #eee; } .xc-linellae-frame .xc-linellae{ width: 425rpx; height: 1rpx; border-bottom: 1rpx solid #a5a5a5; } .xc-recommend-frame{ background:#eee; width:200rpx; height:100%; } .xc-recommend-frame .xc-recommend{ width: 35rpx; height: 27rpx; margin-top:7rpx; } .xc-recommend-frame .xc-recommend-word{ font-size:26rpx; color: #a9a9a9; margin-left:5rpx; } .xc-rmbs{ height:40rpx; } .xc-shuoming{ padding-left:10rpx; } .poster-container { box-sizing: border-box; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 210rpx); z-index: 1000; } .mask { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 999; background-color: rgba(0,0,0,.4); } .poster-wrapper { width: 100%; } .poster { box-sizing: border-box; width: 100%; height: 905rpx; border-radius: 20rpx; /* box-shadow: 0 8px 12px #666; */ position: relative; z-index: 999; overflow: hidden; } .poster-img { display: block; width: 100%; height: 100%; } .btn-container { display: flex; justify-content: space-around; } .btn-share { display: block; background-color: #FE6867; color: white; border-radius: 8rpx; line-height: 80rpx; margin-top: 28rpx; padding: 0 60rpx; } .btn-close { /* background-color: rgba(0,0,0,.5); */ color: #ccc; width: 50rpx; height: 50rpx; line-height: 50rpx; text-align: center; border-radius: 50%; position: absolute; right: 20rpx; top: 20rpx; } .icon-close { font-size: 48rpx; } .avatar-container { width: 60rpx; height: 60rpx; border-radius: 50%; overflow: hidden; background-color: #f2f2f2; } .img-container { width: 200rpx; height: 200rpx; border-radius: 12rpx; overflow: hidden; position: relative; } .img-container::after { content: attr(data-content); position: absolute; bottom: 0; left: 0; width: 100%; background-color: rgba(255,103,103,.7); color: white; text-align: center; font-size: 24rpx; } .rmb::before { content: '¥'; font-size: 24rpx; } .btn-red { background-color: #FE6867; color:#fff; border-radius: 8rpx; } .btn-yellow { background-color:#fab55a; color:#fff; border-radius: 8rpx; } .rules { font-size: 26rpx; position: absolute; color: white; background-color: #FE6867; right: 0; top: 0; z-index: 1; padding: 4rpx 10rpx 4rpx 20rpx; border-radius: 0 0 0 12rpx; } .rule-pop-container { position: fixed; left: 0; bottom: 0; width: 100%; background-color: white; z-index: 99999; border-radius: 16rpx 16rpx 0 0; padding: 0 40rpx; box-sizing: border-box; font-size: 28rpx; color: #444; } .pop-title { padding: 20rpx 0; text-align: center; font-size: 32rpx; position: relative; } .icon-guan { position: absolute; right: 0; font-size: 26rpx; top: 50%; transform: translateY(-50%); color: #ccc; } .btn { color: white; padding: 20rpx 0; text-align: center; border-radius: 40rpx; background: -webkit-linear-gradient(left,#ff5000,#ff2000) no-repeat; } .mask { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0,0,0,.6); } .popup-content { max-height: 600rpx; overflow-y: auto; } .mycanvas { position: absolute; top: -9999px; left: -9999px; }