.top-con { position: fixed; top: 0; left: 0; right: 0; z-index: 50; } .top-adv { margin: 30rpx 30rpx 0; position: relative; } .top-adv-img { width: 100%; height: 135rpx; } .top-adv-close { position: absolute; top: -10rpx; right: 10rpx; background-color: rgba(0, 0, 0, .5); border-radius: 50%; width: 40rpx; height: 40rpx; } .top-adv-close image { width: 40rpx; height: 40rpx; } .order-ing { background: #FFEDE5; padding: 22rpx 30rpx; font-size: 28rpx; color: #EB5C20; } .order-ing image { width: 50rpx; height: 50rpx; margin-right: 20rpx; } .gh-btn { width: 137rpx; height: 56rpx; background: #EB5C20; border-radius: 73rpx; font-size: 28rpx; color: #fff; font-weight: bold; text-align: center; line-height: 56rpx; } .map-box { width: 100%; height: 100%; position: absolute } .map { width: 100%; height: 100%; } .side { position: fixed; left: 30rpx; bottom: 30%; z-index: 91; } .side .li { width: 80rpx !important; height: 80rpx !important; background: #fff; border-radius: 50% !important; justify-content: center; margin-bottom: 40rpx !important; box-shadow: 0 0 10rpx rgba(0, 0, 0, 0.1); } .side .li image { width: 48rpx; height: 48rpx; } .store { position: absolute; top: 30%; left: 20%; } .store image { width: 94rpx; height: 94rpx; } .ibn { position: absolute; top: 20%; left: 30%; } .ibn image { width: 80rpx; height: 80rpx; } .count { position: absolute; top: -5rpx; right: -5rpx; width: 34rpx; height: 34rpx; background-color: #f00; box-sizing: border-box; font-size: 24rpx; color: #fff; border-radius: 50%; justify-content: center; } .nearby-box { width: 150rpx; height: 150rpx; position: absolute; top: 50%; left: 50%; justify-content: center; transform: translate(-50%, -50%); } .loca { width: 70rpx; height: 70rpx; position: relative; z-index: 2; } .nearby-yuan { background: rgba(46, 171, 255, .2); position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 50%; z-index: 1; -webkit-animation: scale 2s ease-in-out infinite; } .nearby { position: absolute; bottom: 90rpx; left: 50%; transform: translateX(-50%); z-index: 3; } @-webkit-keyframes scale { 0% { -webkit-transform: scale(1); } 50% { -webkit-transform: scale(.6); } 100% { -webkit-transform: scale(1); } } .gan { width: 6rpx; height: 69rpx; background: #242323; border-radius: 0 0 50rpx 50rpx; margin: 0 auto; } .nearby-text { width: 124rpx; height: 53rpx; background: #666464; border-radius: 27rpx; font-size: 24rpx; color: #fff; justify-content: center; } .nearby-text image { width: 23rpx; height: 32rpx; } .bot { padding: 45rpx 74rpx 0; position: fixed; left: 0; right: 0; bottom: 0; background: #fff; border-radius: 40rpx 40rpx 0 0; z-index: 90; } .scan { height: 112rpx; background-color: var(--main); box-shadow: 0 10rpx 30rpx 1rpx rgba(235, 92, 32, 0.33); border-radius: 56rpx; border: 1px solid rgba(0, 0, 0, 0); font-size: 36rpx; color: #fff; font-weight: bold; justify-content: center; } .scan image { width: 50rpx; height: 50rpx; margin-right: 23rpx; } .hand { font-size: 24rpx; color: #666464; justify-content: center; margin: 25rpx 0 0; } .hand image { width: 32rpx; height: 32rpx; } .nav { justify-content: space-between; font-size: 24rpx; color: #666464; } .nav .li { padding: 35rpx 0; } .nav .li image { width: 54rpx; height: 54rpx; margin: 0 auto 9rpx; } .cabinet { position: fixed; left: 0; right: 0; bottom: 0; background: linear-gradient(360deg, #FFFFFF 0%, #C8FEEB 100%); box-shadow: 0rpx -5rpx 20rpx 1rpx rgba(32,32,32,0.1); border-radius: 40rpx 40rpx 0rpx 0rpx; z-index: 92; padding: 35rpx; transition: all .3s ease; } .close { width: 37rpx; height: 37rpx; position: absolute; top: 20rpx; right: 20rpx; } .jg-ico { width: 35rpx; height: 48rpx; margin-right: 15rpx; } .jg-tit { font-size: 36rpx; color: #242323; margin-right: 10rpx; font-weight: bold; } .juli { font-size: 24rpx; color: #A8A5A5; } .jg-num { font-size: 24rpx; color: #A8A5A5; } .cab-addr { font-size: 28rpx; color: #A8A5A5; margin-top: 15rpx; margin-bottom: 35rpx; } .addr-ico { width: 20rpx; height: 26rpx; margin-right: 15rpx; } .daoh { width: 50rpx; height: 50rpx; } .cab-tits { font-size: 32rpx; color: #242323; font-weight: bold; margin: 20rpx 0; } .datas { height: 124rpx; background-color: #F2F2F2; font-size: 28rpx; color: #A8A5A5; font-weight: bold; border-radius: 8rpx; } .datas .li { width: 50%; text-align: center; } .datas .li view { font-size: 36rpx; margin-bottom: 10rpx; color: var(--main); } .charge-datas { border: 1rpx solid rgba(165, 165, 165, .5); border-radius: 8rpx; display: table; width: 100%; box-sizing: border-box; text-align: center; font-size: 24rpx; color: #666464; } .charge-datas .hd, .charge-datas .bd { display: table-row; } .hd { height: 57rpx; background-color: #E6E6E6; line-height: 57rpx; } .charge-datas .li { display: table-cell; } .bd .li { padding: 16rpx 0; } .imgbox { margin: 20rpx 0 0; } .imgbox image { width: 220rpx; height: 220rpx; border-radius: 10rpx; margin: 0 15rpx 0 0; } .imgbox image:nth-child(3n) { margin-right: 0; } .cab-btn { padding: 50rpx 44rpx 0; } .sta { width: 97rpx; height: 36rpx; border-radius: 5rpx; font-size: 24rpx; color: #fff; background-color: #A8A5A5; margin-left: 5rpx; text-align: center; font-weight: normal; margin-right: 13rpx; } .ing { background-color: #EB5C20; } .sj-ico { width: 49rpx; height: 48rpx; margin-right: 14rpx; } .sj-info .li { background-color: #F2F2F2; border-radius: 8rpx; padding: 25rpx 35rpx; font-size: 28rpx; color: #666464; margin-top: 20rpx; font-weight: bold; align-items: flex-start; } .label { margin-right: 33rpx; } .phone { color: #2A82E4; } .ceng { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, .5); z-index: 99; } .pop-adv { position: fixed; left: 60rpx; right: 60rpx; top: 50%; transform: translateY(-50%); z-index: 100; } .pop-adv-img { width: 100%; height: 668rpx; border-radius: 15rpx; } .pop-adv-close { width: 84rpx; height: 84rpx; margin: 100rpx auto 0; } .register-box{ background: #FFFFFF; box-shadow: 0rpx 5rpx 20rpx 1rpx rgba(0,155,98,0.2); border-radius: 16rpx 16rpx 16rpx 16rpx; position: relative; } .register-title{ font-size: 28rpx; font-weight: bold; color: #999999; padding: 30rpx 30rpx; padding-bottom: 21rpx; flex-wrap: nowrap; } .card-name{ line-height: 50rpx; font-size: 36rpx; font-weight: bold; color: #333333; } .card-tag{ padding: 0 10rpx; line-height: 32rpx; border-radius: 5rpx 5rpx 5rpx 5rpx; opacity: 1; border: 2rpx solid #FF5700; font-size: 20rpx; color: #FF5700; text-align: center; margin-right: 10rpx; } .card-area{ line-height: 46rpx; background: #F8F8F8; border-radius: 10rpx 10rpx 10rpx 10rpx; padding:0 16rpx ; font-size: 24rpx; font-weight: 400; color: #666666; margin-top: 35rpx; } .card-area image{ width: 20rpx; height: 24rpx; margin-right: 10rpx; } .card-data{ font-size: 39rpx; font-family: Arial-Regular, Arial; font-weight: 400; color: #333333; line-height: 47rpx; text-align: center; } .card-label{ line-height: 33rpx; font-size: 24rpx; font-family: PingFang SC-Medium, PingFang SC; font-weight: 500; color: #A1A1A1; text-align: center; } .card-line{ width: 1rpx; height: 66rpx; background: #DEDEDE; } .register-state{ font-size: 24rpx; font-weight: 500; line-height: 36rpx; color: #999999; } .register-title-icon{ width: 160rpx; height: 160rpx; opacity: 1; margin-right: 20rpx; border-radius: 10rpx; } .register-info-item{ margin-top: 30rpx; align-items: flex-start; } .register-info-label{ line-height: 41rpx; color: #999999; font-size: 28rpx; margin-right: 60rpx; } .register-info-data{ font-size: 28rpx; color: #333333; line-height: 41rpx; text-align: right; } .found-more{ margin: 50rpx auto; line-height: 40rpx; font-size: 28rpx; font-family: PingFang SC-Heavy, PingFang SC; font-weight: 800; color: #27D699; justify-content: center; } .found-more image{ width: 46rpx; height: 46rpx; margin-right: 14rpx; } canvas { position: fixed; left: 9000px; /* left:0px; top: 0; z-index: 9999; */ }