@charset "UTF-8"; /* 页面左右间距 */ /* 文字尺寸 */ /*文字颜色*/ /* 边框颜色 */ /*颜色*/ /* 图片加载中颜色 */ /* 行为相关颜色 */ /* 功能栏字体大小 */ .f-header .tit { font-size: 34rpx; color: #303133; line-height: 1; font-weight: bold; } .f-header .tit-box { -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; } /*功能栏左侧小图标*/ .f-header .f-left-icon { height: 34rpx; width: 8rpx; background-image: -webkit-linear-gradient(left, #FBEB77, #F8DD4F); background-image: linear-gradient(to right, #FBEB77, #F8DD4F); margin-right: 10rpx; border-radius: 10rpx; } page { background: #f7f8f7; } .m-t { margin-top: 16rpx; } .list-box { margin-top: 30rpx; } /* 头部 轮播图 */ .carousel-section { position: relative; padding-top: 10px; overflow: hidden; background: url(/static/img/indexBg.png) no-repeat; background-size: 100% 100%; } .carousel-section .titleNview-placing { height: 25px; padding-top: 44px; box-sizing: content-box; } .carousel-section .titleNview-background { position: absolute; top: 0; left: 0; width: 100%; height: 426rpx; -webkit-transition: 0.4s; transition: 0.4s; } .carousel-section .carousel { width: 680rpx; height: 340rpx; margin: 0 auto; } .carousel-section .carousel .carousel-item { width: 100%; height: 100%; overflow: hidden; } .carousel-section .carousel image { width: 100%; height: 100%; border-radius: 15rpx; } /*公用边框样式*/ .guess-section .icon { margin-right: 10rpx; display: inline-block; padding: 2rpx 10rpx; border: 1rpx solid #fd5b23; color: #fd5b23; line-height: 1; font-size: 28rpx; border-radius: 10rpx; } .f-header { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: 92rpx; padding: 6rpx 30rpx 8rpx; } .f-header image { -webkit-flex-shrink: 0; flex-shrink: 0; width: 80rpx; height: 80rpx; margin-right: 20rpx; } .f-header .iconenter { font-size: 34rpx; color: #909399; } .f-header .iconfont { font-size: 22rpx; } /* 商品列表 */ .guess-section { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; padding: 0 30rpx; } .guess-section .guess-item { overflow: hidden; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; width: 48%; margin-bottom: 4%; border-radius: 15rpx; background-color: white; box-shadow: 0rpx 0rpx 10rpx 10rpx #f3f3f3; } .guess-section .guess-item:nth-child(2n + 1) { margin-right: 4%; } .guess-section .image-wrapper { width: 100%; height: 330rpx; border-radius: 3px; overflow: hidden; } .guess-section .image-wrapper image { width: 100%; height: 100%; opacity: 1; } .guess-section .title { padding-top: 10rpx; font-size: 28rpx; color: #303133; font-weight: bold; line-height: 1.5; } .guess-section .price { font-size: 32rpx; color: #F8DD4F; font-weight: bold; line-height: 1; line-height: 80rpx; } .guess-section .price .iconJf { width: 23rpx; margin-right: 5rpx; } .guess-section .detail { line-height: 1; } .guess-section .tip { color: white; background-color: #fd5b23; line-height: 1.5; font-size: 24rpx; padding-left: 20rpx; } .list-box-h { height: 1550rpx; } .row { border-radius: 15rpx; margin: 25rpx; height: 155rpx; overflow: hidden; background-color: #ffffff; padding-right: 25rpx; } .row .list-interval { border: 1px dashed #ebeef5; height: 100%; } .row .list-interval .top, .row .list-interval .bottom { border-radius: 100rpx; width: 30rpx; height: 30rpx; position: absolute; background-color: #f8f8f8; right: -15rpx; } .row .list-interval .top { top: -18rpx; } .row .list-interval .bottom { bottom: -18rpx; } .row .list-money { height: 100%; min-width: 155rpx; text-align: center; } .row .list-money image { height: 100%; width: 20rpx; } .row .list-money .list-money-text { -webkit-box-flex: 1; -webkit-flex-grow: 1; flex-grow: 1; padding: 0 25rpx; } .row .list-money .list-money-text .tit { text-align: center; padding: 15rpx 0rpx; font-size: 55rpx; color: #dd524d; font-weight: bold; } .row .list-money .list-money-text .tit.noAction { color: #909399; } .row .list-money .list-money-text .price { padding-bottom: 25rpx; color: #909399; } .row .row_list_right { min-width: 200rpx; padding-left: 25rpx; line-height: 1; } .row .row_list_right .right_time { padding: 10rpx 0rpx; color: #909399; font-size: 24rpx; } .row .row_list_right .right_top { margin: 15rpx 0; } .row .row_list_right .right_top .right_name { font-size: 28rpx; color: #bc253a; font-weight: bold; } .row .row_list_right .right_top .right_title { font-size: 28rpx; color: 28rpx; font-weight: bold; } .row .row_list_right .right_top .right_title.noAction { color: #909399; } .row .right_use { margin: 15rpx 0; padding: 10rpx; width: 160rpx; text-align: center; color: #fff; background-color: #bc253a; border-radius: 50rpx; font-size: 24rpx; } .row .right_use.noAction { background-color: #909399; } .row .iconlocation { font-size: 36rpx; color: #909399; } .xtxx { width: 100%; height: 70rpx; position: relative; margin: 22rpx 0 20rpx; } .xtxx .bg { display: inline-block; width: 690rpx; position: absolute; right: 0; left: 0; margin: 0 auto; } .xtxx .ld { width: 28rpx; height: 34rpx; position: absolute; top: 18rpx; left: 55rpx; } .tongz { width: 690rpx; height: 70rpx; margin: 48rpx auto 0; padding: 18rpx 30rpx 18rpx 24rpx; -webkit-box-align: center; -webkit-align-items: center; align-items: center; position: relative; } .tongz .tongz-bg { position: absolute; top: 0; right: 0; left: 0; width: 690rpx; height: 70rpx; } .tongz .tongz-bg image { width: 100%; height: 100%; } .tongz .tongz-left { width: 640rpx; } .tongz .tongz-left .image-left { width: 28rpx; height: 34rpx; } .tongz .tongz-left .tongz-font { margin-left: 22rpx; font-size: 28rpx; font-family: Source Han Sans CN; font-weight: 400; color: #0f253a; } .tongz .tongz-right { position: relative; z-index: 11; width: 12rpx; height: 26rpx; } .tongz .tongz-right image { width: 100%; height: 100%; } .good-wrapper { padding: 0 30rpx; } .good-wrapper .good { width: 681rpx; height: 257rpx; background: #FFFFFF; box-shadow: 0px 0px 15rpx 0px rgba(10, 13, 47, 0.14); border-radius: 14rpx; margin: 0 auto 20rpx; padding: 18rpx 19rpx 17rpx; display: -webkit-box; display: -webkit-flex; display: flex; } .good-wrapper .good .image-wrapper { width: 222rpx; height: 222rpx; border-radius: 14rpx; -webkit-flex-shrink: 0; flex-shrink: 0; } .good-wrapper .good .image-wrapper image { width: 100%; height: 100%; opacity: 1; border-radius: 14rpx; } .good-wrapper .good .good-info { padding-left: 22rpx; position: relative; } .good-wrapper .good .good-info .info-title { padding-top: 20rpx; font-size: 32rpx; font-family: PingFang SC; font-weight: bold; color: #333333; } .good-wrapper .good .good-info .info-price { font-size: 36rpx; font-family: PingFang SC; font-weight: bold; color: #FFC000; line-height: 35px; position: absolute; bottom: 0; left: 22rpx; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; }