* { margin: 0; padding: 0; font-family: HYQiHei; list-style: none; font-size: 0.14rem; } html { font-size: 26.66666667vw; height: 100%; } body { -webkit-text-size-adjust: 100% !important; text-size-adjust: 100% !important; -moz-text-size-adjust: 100% !important; font-size: 0.14rem; height: 100%; } @media screen and (min-width: 900px) { html { transform: scale(0.3); background: #fff; transform-origin: 50% 0px 0px; height: calc(100vh); } #app { height: 6rem !important; background: #f4f6f9; overflow-y: scroll; } .mask { height: 6rem !important; } } #app { width: 100%; height: 100%; box-sizing: border-box; overflow: scroll; } .content { min-height: 100%; background: #ff4830; position: relative; } .content .banner { width: 100%; max-height: 100%; } .content .box { padding: 0.16rem; padding-top: 0; } .content .box .goods-box { background-size: 100% 100%; min-height: 1.8rem; width: 100%; padding-top: 0.2rem; box-sizing: border-box; } .content .box .goods-box .title { text-align: center; color: #ff3024; font-weight: bold; font-size: 0.16rem; padding-left: 0.12rem; box-sizing: border-box; } .content .box .goods-box .notis { margin: 0 0 0.1rem; color: #ffd3d8; text-align: center; font-size: 0.13rem; } .content .box .g-b-u { overflow-x: scroll; margin-top: 0.28rem; margin-bottom: 0.12rem; width: 94%; margin-left: 0.14rem; box-sizing: border-box; list-style: none; display: -webkit-box; -webkit-overflow-scrolling: touch; -ms-overflow-style: none; overflow: -moz-scrollbars-none; } .content .box .g-b-u::-webkit-scrollbar { display: none; } .content .box .g-b-u li { background-size: 100% 100%; height: 1.16rem; width: 1rem; margin-left: 0.1rem; } .content .box .g-b-u li:first-child { margin-left: 0; } .content .box .g-b-u li .g-b-u-t { color: #fd4b34; font-size: 0.12rem; text-align: center; } .content .box .g-b-u li .reduce { text-align: center; color: #ff877d; font-size: 0.12rem; } .content .box .g-b-u li .money { text-align: center; color: #fc4a2f; font-size: 0.2rem; font-weight: bold; margin: 0.02rem 0; } .content .box .g-b-u li .money span { font-size: 0.12rem; font-weight: 400; display: inline-block; margin-right: -0.04rem; } .content .box .g-b-u li .g-b-but { font-size: 0.12rem; text-align: center; width: 70%; color: #fc4934; background: #ffe9e9; padding: 0.04rem 0.04rem; border-radius: 0.2rem; margin: 0 auto; margin-top: 0.22rem; } .content .box .g_b_title { color: #fff; font-size: 0.18rem; display: flex; align-items: center; margin: 0.2rem; } .content .box .g_b_title img { width: 0.26rem; } .content .box .g_b_title img:first-child { margin-right: 0.1rem; transform: rotateY(360deg); } .content .box .g_b_title img:last-child { margin-left: 0.1rem; transform: rotateY(180deg); } .content .box .box-cotent, .content .box .box-footer { margin-bottom: 0.12rem; } .content .box .time { font-size: 0.12rem; margin-top: 0.08rem; text-align: center; color: #fff; width: 100%; margin: 0 auto; line-height: 0.18rem; padding: 0.05rem 0; } .content .box .box-footer { display: flex; flex-direction: column; } .content .box .box-footer .group_image { max-width: 100%; max-height: 100%; display: block; margin: 0 auto; } .content .box .box-footer .b-f-i { color: #ff4901; line-height: 0.24rem; min-height: 2rem; } .content .box .box-footer .b-f-i p { font-size: 0.12rem; } .content .box .box-footer .b-f-b { background-size: 100% 100%; padding: 0 0.24rem; } .content .box .box-footer .b-f-img { width: 100%; max-height: 100%; } .content .box .box-cotent { display: flex; flex-direction: column; } .content .box .box-cotent input { width: 100%; border: 0; outline: 0; background: #f8f9fd; height: 0.42rem; border-radius: 0.2rem; padding: 0 0.2rem; box-sizing: border-box; display: block; margin: 0 auto; margin-bottom: 0.14rem; } .content .box .box-cotent .but { margin-top: 0.05rem; width: 100%; max-height: 100%; } .ff-btn { margin-top: 0.05rem; width: 100%; height: 0.48rem; margin-bottom: 0.08rem; background: url("https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/combining/zh-btn-hs.png") no-repeat; background-size: 100%; } .ff-text { font-weight: 500; font-size: 0.18rem; color: #666666; text-align: center; line-height: 0.48rem; } .prompt { display: inline-block; min-width: 50%; padding: 0.08rem; background: transparent; border-radius: 0.2rem; color: #fff; position: fixed; top: 20%; left: -150%; margin-left: -25%; text-align: center; font-size: 0.14rem; transition: left 0.2s; z-index: 99999; } .backIcon { width: 0.4rem; position: fixed; left: 0.1rem; top: 0.1rem; z-index: 99999; } .proactive { left: 47%; background: rgba(0, 0, 0, 0.7); } .countdown { position: absolute; top: 1.5%; left: 7%; display: flex; align-items: center; color: #fff; } .countdown p { margin: 0.05rem; background: url("https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/reduce/check_1.png"); background-size: 100% 100%; min-width: 0.18rem; padding: 0.028rem; } .mask { position: fixed; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.2); text-align: center; display: flex; align-items: center; justify-content: center; top: 0; left: 0; z-index: 9999; } .mask .model { width: 80%; background-color: #fff; border-radius: 0.12rem; padding: 0.16rem; box-sizing: border-box; margin-top: -2rem; display: flex; flex-direction: column; justify-content: space-between; } .mask .model .m-title { font-size: 0.18rem; color: #000; } .mask .model .m-icon { width: 50%; max-height: 100%; } .mask .model .m-msg { color: #666666; padding: 0.2rem 0; display: flex; align-items: center; justify-content: center; min-height: 0.4rem; } .mask .model .m-but { font-size: 0.16rem; color: #fff; background-color: #e52600; border-radius: 0.2rem; height: 0.42rem; border: 0; outline: 0; width: 50%; margin: 0 auto; } .ani_dot { font-family: simsun; font-size: 0.3rem; } :root .ani_dot { /* 这里使用Hack是因为IE6~IE8浏览器下, vertical-align解析不规范,值为bottom或其他会改变按钮的实际高度*/ display: inline-block; width: 1.5em; vertical-align: bottom; overflow: hidden; } @-webkit-keyframes dot { 0% { width: 0; margin-right: 1.5em; } 33% { width: 0.5em; margin-right: 1em; } 66% { width: 1em; margin-right: 0.5em; } 100% { width: 1.5em; margin-right: 0; } } .ani_dot { -webkit-animation: dot 3s infinite step-start; } @keyframes dot { 0% { width: 0; margin-right: 1.5em; } 33% { width: 0.5em; margin-right: 1em; } 66% { width: 1em; margin-right: 0.5em; } 100% { width: 1.5em; margin-right: 0; } } .ani_dot { animation: dot 3s infinite step-start; } /* 弹窗 */ .tip-pop { width: 100%; height: 100vh; position: absolute; top: 0; left: 0; overflow: hidden; background: rgba(0, 0, 0, 0.5); } .tip-main { width: 2.835rem; min-height: 1.5rem; margin: 0 auto; position: relative; top: 30%; background-color: #fff; border-radius: 0.15rem; text-align: center; } .tip-pop-head { width: 2.835rem; height: 0.76rem; background: url("https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/combining/zh-pop.png") no-repeat; background-size: 100%; display: flex; justify-content: center; } .tip-pop-dd { width: 0.61rem; height: 0.7rem; margin-top: -0.25rem; } .tip-title { font-weight: 500; font-size: 0.16rem; color: #fd5b23; text-align: center; } .tip-card-status { font-weight: 400; font-size: 0.16rem; color: #333333; text-align: center; padding: 0.15rem 0; } .tip-card-text { font-weight: 400; font-size: 0.13rem; color: #666666; text-align: center; } .tip-btn { background: #fd5b23; border-radius: 0.29rem; border: none; color: #fff; text-align: center; margin: 0.2rem auto; padding: 0.05rem 0.2rem; }