.Top-Nav{ height: 40px; background-color: #7aac4b; /*margin-top: 20px;*/ color: white; text-align: center; font-size: .16rem; } .Top-Nav a{ color: white; } .Top-Nav span{ display: inline-block; width: 100%; height: 40px; background-color: #57933f; } .Top-Nav>div{ width: 1200px; } .Top-Nav>div>div{ width: 12.5%; text-align: center; height: 40px; line-height: 40px; } .banner{ width: 100%; min-width: 1200px; } .banner img{ width: 100%; } .big-title{ width: 100%; text-align: center; font-size: .58rem; color: #666666; } .LIST{ /*overflow: hidden;*/ margin-bottom: 125px; padding: 15px 15px 50px 15px; position: relative; height: 770px; } .LIST>div{ text-align: center; background: #f5f5f5; position: absolute; z-index: 1; top: 30px; } .LIST ul>li{ border-bottom: 1px solid #e5e5e5; height: 45px; font-size: .18rem; line-height: 45px; } .LIST ul>li:first-child{ height: 60px; font-size: .24rem; font-weight: lighter; line-height: 60px; } .LIST ul>li:nth-child(2){ height: 80px; font-size: .18rem; line-height: 80px; } .LIST ul>li:last-child{ display: none; border-bottom: none; } .vip-red ul>li:last-child{ display: block; } .vip-title{ border: 1px solid #e5e5e5; /*width: 258px;*/ width: 220px; left: 15px; box-shadow: -1px 1px 15px 0px rgba(81, 81, 81, 0.42); } .vip-title:hover{ z-index: 2; } .vip-free{ border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; /*width: 228px; left: 273px;*/ width: 190px; left: 235px; } .vip-free:hover{ border: 1px solid #e5e5e5; box-shadow: -1px 1px 15px 0px rgba(81, 81, 81, 0.42); z-index: 3; /*width: 238px; left: 268px;*/ width: 200px; left: 230px; /*top: 15px;*/ } .vip-green{ border-top: 1px solid #7aac4b; border-left: 1px solid #7aac4b; border-bottom: 1px solid #7aac4b; width: 190px; left: 425px; /*display: none;*/ } .vip-green:hover{ border: 1px solid #7aac4b; box-shadow: -1px 1px 15px 0px rgba(81, 81, 81, 0.42); z-index: 3; width: 200px; left: 420px; top: 15px; } .LIST .vip-red{ border: 1px solid #f24445; box-shadow: -1px 1px 15px 0px rgba(81, 81, 81, 0.42); z-index: 2; /*width: 238px; left: 496px;*/ width: 200px; left: 610px; top: 15px; } .vip-red:hover{ border: 1px solid #f24445; box-shadow: -1px 1px 15px 0px rgba(81, 81, 81, 0.42); z-index: 3; /*width: 238px; left: 496px;*/ width: 200px; left: 610px; top: 15px; } .vip-yellow{ border-top: 1px solid #f7d93d; border-left: 1px solid #f7d93d; border-bottom: 1px solid #f7d93d; /*width: 228px; left: 729px;*/ width: 190px; left: 805px; } .vip-yellow:hover{ border: 1px solid #f7d93d;; box-shadow: -1px 1px 15px 0px rgba(81, 81, 81, 0.42); z-index: 3; /*width: 238px; left: 724px;*/ width: 200px; left: 800px; top: 15px; } .vip-gold{ border: 1px solid #f7bc3e; /*width: 228px; left: 957px;*/ width: 190px; left: 995px; } .vip-gold:hover{ border: 1px solid #f7bc3e; box-shadow: -1px 1px 15px 0px rgba(81, 81, 81, 0.42); z-index: 3; /*width: 238px; left: 952px;*/ width: 200px; left: 990px; top: 15px; } /*.vip-free:hover ul>li:first-child{ height: 75px; }*/ .vip-green:hover ul>li:first-child{ height: 75px; } .vip-red:hover ul>li:first-child{ height: 75px; } .vip-yellow:hover ul>li:first-child{ height: 75px; } .vip-gold:hover ul>li:first-child{ height: 75px; } .vip-free ul>li:first-child{ background: #e5e5e5; color: #666666; } .vip-green ul>li:first-child{ background: #7aac4b; color: white; } .vip-red ul>li:first-child{ background: #f24445; color: white; height: 75px; } .vip-yellow ul>li:first-child{ background: #f7d93d; color: white; } .vip-gold ul>li:first-child{ background: #f7bc3e; color: white; } .x{ font-size: .28rem; } .vip-free .v{ color: #666666; font-size: .2rem; font-weight: bolder; } .vip-green .v{ color: #7aac4b; font-size: .2rem; font-weight: bolder; } .vip-red .v{ color: #f24445; font-size: .2rem; font-weight: bolder; } .vip-yellow .v{ color: #f7d93d; font-size: .2rem; font-weight: bolder; } .vip-gold .v{ color: #f7bc3e; font-size: .2rem; font-weight: bolder; } .vip-free .price{ color: #333333; font-size: .4rem; } .vip-green .price{ color: #7aac4b; font-size: .4rem; } .vip-red .price{ color: #f24445; font-size: .4rem; } .vip-yellow .price{ color: #f7d93d; font-size: .4rem; } .vip-gold .price{ color: #f7bc3e; font-size: .4rem; } .LIST a{ display: block; border-radius: 4px; width: 160px; height: 40px; color: white; margin: 5px auto; text-decoration: none; } .LIST a img{ height: 18px; margin-top: -4px; margin-right: 4px; } .vip-free a{ background-color: #e5e5e5; color: #666666; } .vip-green a{ background-color: #7aac4b; } .vip-red a{ background-color: #f24445; } .vip-yellow a{ background-color: #f7d93d; } .vip-gold a{ background-color: #f7bc3e; } .vip-green ul>li:last-child{ height: 90px; } .vip-red ul>li:last-child{ height: 90px; } .vip-yellow ul>li:last-child{ height: 90px; } .vip-gold ul>li:last-child{ height: 90px; } .zmt{ position: relative; } .zmt a{ width: 18px; position: absolute; top: -3px; right: 40px; z-index: 200; } .zmt img{ height: 18px; } .PRI{ position: relative; } .yj{ position: absolute; display: block; width: 100%; height: 14px; line-height: 14px; text-align: center; left: 0; bottom: 5px; text-decoration: line-through; color: #999999; font-size: .14rem; } #WXPayCaptions{ width: 200px; height: 70px; display: block; margin: 20px auto; } #qrcode{ height: 200px; width: 200px; /* margin: 0 auto; */ padding-top: 10px; padding-bottom: 20px; margin: 20px; }