.alert-active { background: rgba(0,0,0,.5); height: 100vh; left: 0; position: fixed; top: 0; width: 100vw; } .alert-active .inner { height: 74.667vw; left: 50%; margin: 0 auto; position: fixed; top: 50%; transform: translate(-50%,-50%); width: 82.4vw; } .content-inner { position: relative; } .bg { height: 100%; left: 0; position: absolute; top: 0; width: 100%; } .hotsale-popup { height: 74.667vw; margin: 0 auto; position: relative; width: 82.4vw; } .hotsale-popup .bg { height: 100%; left: 0; position: absolute; top: 0; width: 100%; } .hotsale-popup .countdowns { color: #2a2a2a; font-family: DIN; font-size: 3.2vw; left: 0; line-height: 4.267vw; position: absolute; text-align: center; top: 18.667vw; width: 100%; } .countdown { display: inline-block; } .hotsale-popup .countdowns .time-item { background-color: #cc5335; border-radius: .533vw; box-sizing: border-box; color: #fff; display: inline; font-family: DIN; font-size: 3.2vw; height: 8.533vw; line-height: 4.267vw; margin-left: .533vw; margin-right: .533vw; min-width: 8.533vw; padding: 0 .533vw; } .separator { display: inline-block; } .hotsale-popup .content { top: 27.2vw; width: 74.667vw; } .hotsale-popup .btn,.hotsale-popup .content { left: 0; margin: 0 auto; position: absolute; right: 0; } .hotsale-popup .btn { bottom: 0; color: #c8484c; font-size: 4vw; height: 12vw; line-height: 12vw; text-align: center; width: 54.133vw; } .hotsale-goods { background-color: #fff; border: .533vw solid #c8484c; border-radius: 2.133vw; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; padding: 2.667vw; } .hotsale-goods .hd { -webkit-box-flex: 21.333vw; border-radius: 1.067vw; flex: 21.333vw 0 0; margin: 0 2.667vw 0 0; overflow: hidden; width: 21.333vw; } .image-box,.image-box.__100 { background-color: #ebebeb; height: 0; overflow: hidden; position: relative; } .image-box.__100 { padding-top: 100%; } .image-box image { height: 100%; left: 0; position: absolute; top: 0; width: 100%; } .hotsale-goods .bd { -ms-flex-pack: justify; -webkit-box-flex: 1; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex: 1; flex-direction: column; margin: -.533vw 0 -.8vw; } .hotsale-goods .bd,.hotsale-goods .bd ._btm { -webkit-box-pack: justify; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: space-between; } .hotsale-goods .bd,.hotsale-goods .bd ._btm { -ms-flex-pack: justify; } .title { -webkit-box-orient: vertical; -webkit-line-clamp: 2; color: #222; display: -webkit-box; font-size: 3.733vw; height: 2.6em; line-height: 1.4em; margin: 0 0 .2em; overflow: hidden; text-overflow: ellipsis; word-break: break-all; } .hotsale-goods .bd ._btm { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .buck,.symbol { display: inline-block; } .likes { color: #969696; font-size: 3.2vw; } .hotsale-goods .tag { border-radius: .533vw; display: inline-block; font-size: 3.2vw; line-height: 4.8vw; padding: 0 1.333vw; vertical-align: top; } .hotsale-goods .tip { color: #969696; display: inline-block; font-size: 3.2vw; } .hotsale-goods .price { color: #eb5252; display: inline-block; font-size: 3.2vw; } .now-price.__normal .buck { display: inline-block; font-size: 4.8vw; } .now-price .symbol { display: inline-block; margin: 0 .267vw 0 0; } .hotsale-popup .closebtn { border: .4vw solid #f8f8f8; border-radius: 50%; color: #fff; font-size: 4vw; height: 8vw; left: 50%; line-height: 8vw; margin: 5.333vw 0 0; position: absolute; text-align: center; top: 100%; transform: translateX(-50%); width: 8vw; } .icon-close2 { align-content: center; align-items: center; display: flex; font-size: 7vw; justify-content: center; line-height: 7vw; }