/* template/admission-box/admission-box.wxss */ .flexflex { display: flex; } .flexcenter { display: flex; justify-content: center; align-items: center; } .flexjcenter { display: flex; justify-content: center; } .flexacenter { display: flex; align-items: center; } .flex1 { flex: 1; } .flexcolumn { display: flex; flex-direction: column; } .admission-box { box-sizing: border-box; background: linear-gradient(-73.07733799deg, #c1f1fe 0%, #daf7fb 48%, #aee4fb 100%); border: none; border-radius: 24rpx; margin: 0 22.5rpx 30rpx; height: 234.5rpx; position: relative; } .admission-box .head { margin-bottom: 9rpx; position: absolute; top: 12rpx; left: 0; width: 100%; padding: 0 15rpx; } .admission-box .head .icon { width: 230rpx; height: 28rpx; margin-right: 15rpx; } .admission-box .head .text { width: 180rpx; height: 30rpx; border-radius: 9rpx; position: relative; font-size: 21rpx; color: #FFFFFF; z-index: 1; } .admission-box .head .text .bj { width: 180rpx; height: 30rpx; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: -1; } .admission-box .head .operate { display: flex; justify-content: flex-end; align-items: center; } .admission-box .head .operate .more { font-size: 22.5rpx; color: #026277; text-align: center; line-height: 39rpx; height: 39rpx; } .admission-box .head .operate .more .icon { width: 21rpx; height: 21rpx; margin-left: 9rpx; margin-right: 0; vertical-align: middle; } .admission-box .head .operate .count-down { font-size: 18rpx; color: #000000; line-height: 39rpx; display: flex; justify-content: center; align-items: center; } .admission-box .head .operate .count-down .item { width: 38rpx; height: 38rpx; margin: 0 5rpx; background-color: #f59a23; border-radius: 19.5rpx; font-size: 21rpx; color: #FFFFFF; } .admission-box .content { height: 100%; position: relative; z-index: 1; } .admission-box .content .more { width: 100rpx; height: 100rpx; position: absolute; top: 12rpx; right: 15rpx; height: 39rpx; } .admission-box .content .item { position: relative; padding-left: 16.5rpx; background-color: #ffffff; width: 100%; height: 120rpx; margin: 0 15rpx; border-radius: 18rpx; } .admission-box .content .item .schoolimg-box { width: 60rpx; margin-right: 18rpx; } .admission-box .content .item .schoolimg { width: 60rpx; height: 60rpx; } .admission-box .content .item .title { font-size: 26rpx; color: #000000; line-height: 39rpx; font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif; padding: 0 30rpx 0 0; position: relative; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; } .admission-box .indicator-box { height: 55rpx; padding: 20rpx 0; position: absolute; display: flex; justify-content: center; bottom: -8rpx; left: 50%; transform: translateX(-50%); z-index: 1; } .admission-box .indicator { position: absolute; top: 50%; transform: translateY(-50%); } .admission-box .indicator .item { background-color: #d7d7d7; border-radius: 30rpx; width: 0; height: 0; transition: all 0.3s; } .admission-box .indicator .item.pitch { background-color: #fa6b11; } .admission-box .indicator .item.tiny { width: 10rpx; height: 10rpx; } .admission-box .indicator .item.pitch, .admission-box .indicator .item.tiny1 { width: 15rpx; height: 15rpx; } .admission-box .indicator .item.pitch, .admission-box .indicator .item.tiny, .admission-box .indicator .item.tiny1 { margin-right: 7.5rpx; display: block; } .admissionState { width: 120rpx; height: 36rpx; vertical-align: middle; margin-right: 16.5rpx; margin-bottom: 5rpx; } .quick-answer { height: 214.5rpx; height: 234.5rpx; border-radius: 24rpx; } .quick-answer-pop { display: flex; flex-direction: column; background-color: rgba(0, 0, 0, 0.70588235); position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 101; animation: slideUp 0.3s forwards; } @keyframes slideUp { 0% { top: 100%; } 100% { top: 0; } } .quick-answer-pop .quick-answer-box .quick-answer-img { width: 100vw; height: 1096.5rpx; position: absolute; bottom: 0; left: 0; border-radius: 35rpx; } .quick-answer-pop .quick-answer-box .quick-answer-icon { width: 270rpx; height: 270rpx; position: absolute; left: 50%; transform: translateX(-50%); bottom: 260rpx; }