.model_show{ animation: opac .15s linear; } @keyframes opac{ 0%{ opacity: 0; } 100%{ opacity: 1; } } .model_unshow{ transition: all .3s ease; opacity: 0; } .ym_mask{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.47); z-index: 10000000; } .ym_model{ position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 86%; border-radius: 3px; background-color: white; z-index: 10000001; overflow: hidden; } .ym_model .ym_title{ width: 100%; height: 64rpx; display: flex; justify-content: center; align-items: center; font-size: 40rpx; margin-bottom: 11rpx; margin-top: 16rpx; } .ym_model .ym_content{ width: 100%; color: rgba(0,0,0,.6); font-size: 35rpx; box-sizing: border-box; padding: 0 20rpx; margin-bottom: 114rpx; } .ym_model .ym_center{ display: flex; flex-direction: column; align-items: center; } .ym_model .ym_button{ position: absolute; bottom: 0; left: 0; width: 100%; height: 90rpx; overflow: hidden; display: flex; align-items: center; border-top: 1rpx solid rgba(0,0,0,.09); } .ym_button view{ width: calc(50% - 0.5rpx); height: 100%; display: flex; justify-content: center; align-items: center; font-size: 39rpx; font-weight: 346; } .ym_button .ym_fail{ border-right: .45rpx solid rgba(0,0,0,.09); transition: all .6s ease; } .ym_fail_but{ background-color: rgba(0,0,0,.096); } .ym_button .ym_complete{ color: rgb(0,255,0); border-left: .45rpx solid rgba(0,0,0,.09); transition: all .6s ease; } .ym_suc_but{ background-color: rgba(0,0,0,.096); }