/* pages/kabaw/detail.wxss */ page{ background: #e3e3e3; } .main{ width: 80vw; height: auto; margin: 5vw 10vw; } .detail-box{ width: 100%; height: auto; border-radius: 8px; border:1px solid #eee; /* padding: 5px 5vw; */ background: #fff; box-sizing: none; } .title{ width: 100%; height: 36px; line-height: 36px; text-align: center; } .img{ width: 100%; height: 40vw; border-radius: 8px 8px 0 0; overflow: hidden; /* margin: 10px 0; */ /* border: 1px solid #eee; */ /* background: #eee; */ } .img image{ width: 100%; height: 40vw; } .store{ width: 100%; /* height: 70px; */ } .store .title{ width: 100%; height: 30px; line-height: 30px; text-align: left; } .store .address{ width: 100%; height: 40px; display: flex; line-height: 40px; position: relative; } .address image{ width: 20px; height: 20px; margin: 10px 2px; } .address .daohang{ float: right; display: flex; width: auto; height: 40px; line-height: 40px; position: absolute; right: 0; } .daohang image{ width: 8px; height: 12px; margin: 14px 3px; } .info{ width: 100%; height: auto; } .info .title{ width: 100%; height: 30px; line-height: 30px; text-align: left; } .info .txt{ width: 100%; height: auto; line-height: 30px; font-size: 12px; } .txt image{ width: 10px; height: 10px; } .btn-box{ width: 100%; height: 50px; /* margin-bottom: 10px; */ line-height: 50px; display: flex; justify-content: space-between } .btn-box .btns{ width: auto; height: 30px; line-height: 30px; padding: 0 12px; border-radius: 30px; background:linear-gradient(270deg,rgba(15,40,98,1) 0%,rgba(75,113,161,1) 100%); color: #fff; margin:10px 0; font-size: 12px; } .qr_box{ width: 100vw; height: 100vh; background: rgba(0,0,0, 0.5); position: fixed; top: 0; left: 0; z-index: 22; } .qr_box .qr{ width: 70vw; height: 75vw; background: #fff; border-radius: 10px; margin: calc( 50vh - 40vw ) 15vw; padding: 4px 0; position: relative; } .qr .goclose{ width: 24px; height: 24px; border: 1px solid #f54; border-radius: 24px; position: absolute; color: #f54; top: 3px; right: 3px; text-align: center; line-height: 24px; font-size: 18px; } .qr .title{ width: 100%; height: 10vw; line-height: 10vw; margin: 2vw 0; text-align: center; font-size: 18px; } .qr .qrcode{ width: 40vw; height:40vw; margin: 0 15vw; } .qrcode image{ width:100%; height: 100%; background: #eee; } .shuabtn{ width: 100%; height: 12vw; line-height: 12vw; display: flex; justify-content: center; margin-top: 3vw; } .shuabtn image{ width: 20px; height: 20px; margin: calc( 6vw - 10px ) 0; } .shuabtn view{ width: auto; height: 12vw; line-height: 12vw; } .minfo{ width: 100%; height: auto; padding: 15px; } .minfo .names{ width: 100%; display: flex; height: 52px; justify-content: space-between; } .names .name{ width: 70%; height: 52px; line-height: 26px; } .names .price{ width: 30%; height: 52px; line-height: 30px; text-align: right; }