.pricing { background: #f3f7fd; padding: 7.876rem 0 2.25rem 0; } .scheme { display: flex; justify-content: center; margin-bottom: 2.55rem; } .subject { display: flex; justify-content: space-around; } .common { width: 32%; box-sizing: border-box; border: 1px solid #dddddd; /* display: flex; */ /* flex-direction: column-reverse; */ background: #ffffff; transition:all 1s ease-out; } .subject a { color: #fff; text-decoration:none } .common .upper { text-align: center; padding-top: 2.2rem; border-bottom: 1px solid #dddddd; position: relative; } .common .upper span { display: inline-block; width: 6rem; height: 2rem; background: #03a9f5; line-height: 2rem; color: #ffffff; margin-top: .4rem; margin-bottom: 1.6rem; transition:all 0.5s ease-out; } .sale::after { content: "*热销*"; position: absolute; top: .4rem; left: 43%; font-size: 14px; color: #15c381; } .common .upper p { margin-bottom: 0.75rem; } .middle { padding: 1.6rem 1.2rem 0 1.2rem; height: 16rem; border-bottom: 1px solid #dddddd; } .middle i, .whole i { display: inline-block; margin-right: .4rem; } .whole { height: 32rem; padding: 1.6rem 1.2rem 0 1.2rem; } .total { color: #f26522; } .customization { text-align: center; margin: 6.6rem 0 3.2rem 0; } .simple:hover, .basics:hover, .specialty:hover{ cursor:pointer; background: #eafdf3; border: 1px dashed #5abf87; transform:scale(1.05); } .simple:hover .upper span, .basics:hover .upper span, .specialty:hover .upper span { background: #f0483e; } /* 弹出层样式 */ .popups { position: absolute; /* background: ; */ }