* { margin: 0; padding: 0; } a { -webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-user-select: none; -moz-user-focus: none; -moz-user-select: none; } .wrap { box-sizing: border-box; padding: 0.20rem 0.3rem 0; width: 100vw; height: 100vh; } .card { width: 100%; height: 3.50rem; background-image: url(/Public/vip/images/templateB/card-bg.png); background-size: 100% 100%; position: relative; color: white; margin-bottom: 0.2rem; } .card-head { display: block; position: absolute; left: 0.36rem; top: 0.36rem; width: 1.2rem; height: 1.2rem; border-radius: 50%; } .card-name { position: absolute; left: 1.82rem; top: 0.5rem; font-size: 0.3rem; } .card-grade-con{ position: absolute; left: 1.82rem; top: 1.07rem; display: flex; align-items: center; } .card-v { height: 0.3rem; } .card-grade { padding-left: 10px; font-size: 0.24rem; } .card-code { width: 0.48rem; height: 0.48rem; position: absolute; right: 0.30rem; top: 0.30rem; } .card-num { position: absolute; bottom: 0.32rem; right: 0.30rem; font-size: 0.24rem; } .cube { display: flex; overflow: hidden; justify-content: space-between; margin-bottom: 0.2rem; } .cube>a { width: 2.10rem; height: 1.40rem; color: white; font-size: 0.24rem; text-decoration: none; } .cube-inner1 { display: flex; align-items: center; justify-content: center; background: linear-gradient(132deg, rgba(84, 143, 250, 1), rgba(101, 216, 254, 1)); border-radius: 0.05rem; } .cube-inner1-img { display: block; width: 0.52rem; height: 0.52rem; margin-right: 0.05rem; } .cube-inner1-txt1 { margin-bottom: 0.05rem; } .cube-inner2 { background: linear-gradient(132deg, rgba(254, 115, 72, 1), rgba(255, 186, 111, 1)); border-radius: 0.05rem; display: flex; flex-direction: column; align-items: center; justify-content: center; } .cube-inner2-img { display: block; width: 0.66rem; height: 0.66rem; } .cube-inner3 { background: linear-gradient(132deg, rgba(150, 109, 245, 1), rgba(231, 149, 255, 1)); border-radius: 0.05rem; display: flex; align-items: center; justify-content: center; } .cube-inner3-img { display: block; width: 0.52rem; } .cube-inner3-txt1 { min-width: 0.5rem; text-align: center; margin-bottom: 0.05rem; } .cube-inner3-txt2 { min-width: 0.5rem; text-align: center; } .notice_con { width: 100%; box-sizing: border-box; overflow: hidden; padding: 2vw; font-size: 14px; position: relative; background: rgba(246, 246, 246, 1); } .notice-box { box-sizing: border-box; padding: 1vw; border-radius: 10px; color: #000; display: flex; align-items: center; font-size: 12px; } .notice_img { width: 6vw; box-sizing: border-box; padding-left: 1vw; } .notice { width: 83vw; box-sizing: border-box; overflow: hidden; position: absolute; top: 0; left: 11vw; margin-left: 1vw; } .notice_content { height: 7.1vw; line-height: 11.1vw; flex-wrap: nowrap; color: #000; } .menu { box-sizing: border-box; padding-top: 0.6rem; display: flex; flex-wrap: wrap; } .menu-inner { width: 33.333%; display: flex; flex-direction: column; align-items: center; justify-content: center; margin-bottom: 0.5rem; text-decoration: none; } .menu-inner-img { display: block; width: 1.1rem; height: 1.1rem; margin-bottom: 0.2rem; } .menu-inner-txt { color: #333; font-size: 0.24rem; } .mask { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); position: fixed; left: 0; top: 0; display: none; } .sharea { box-sizing: border-box; padding: 0.3rem 0.6rem; } .sharea>img { display: block; width: 100%; } .shareb { width: 2.73rem; height: 1.02rem; background: url(/Public/vip/images/templateB/share-sure.png); background-size: 100% 100%; margin: auto; margin-top: 1rem; }