/*720代表设计师给的设计稿的宽度,你的设计稿是多少,就写多少;100代表换算比例,这里写100是 为了以后好算,比如,你测量的一个宽度是100px,就可以写为1rem,以及1px=0.01rem等等*/ /* *{touch-action: none;} */ .mui-card { margin: 0px; border-radius: 8px; box-shadow: 0px 5px 10px 0px rgba(0, 64, 128, 0.04); } .right_area { float: right; } .left_area { float: left; } .z_menu_btn_row { height: 54px; line-height: 54px; background-color: #fff; padding: 0 16px; border-bottom: 1px solid #F0F0F0; box-sizing: border-box; font-size: 15px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 400; color: #363F4D; -webkit-text-fill-color: #363F4D; } .z_menu_btn_row:first-child { border-top-left-radius: 0.2rem; border-top-right-radius: 0.2rem; } .z_menu_btn_row:last-child { border-bottom-left-radius: 0.2rem; border-bottom-right-radius: 0.2rem; border-bottom: 0px; } .z_menu_btn_row:active { /* background-color: #D8D8D8; */ } .disease_label_txt { float: left; width: 81px; height: 30px; text-align: center; padding: 3px 0; margin: 0 4.5%; margin-bottom: 16px; border-radius: 8px; border: 1px solid #9393AA; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #9393AA; -webkit-text-fill-color: #9393AA; } .disease_label_sel { float: left; width: 81px; height: 30px; text-align: center; padding: 3px 0; margin: 0 4.5%; margin-bottom: 16px; border-radius: 8px; border: 1px solid #21D197; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #21D197; -webkit-text-fill-color: #21D197; } .next_btn_txt { width: -webkit-fill-available; text-align: center; line-height: 50px; height: 50px; margin: 0 110px; background: #E0E0E0; border-radius: 12px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #FFFFFF; -webkit-text-fill-color: #FFFFFF; } .next_btn { width: -webkit-fill-available; text-align: center; line-height: 50px; height: 50px; margin: 0 110px; background: #21D197; border-radius: 12px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #FFFFFF; -webkit-text-fill-color: #FFFFFF; } .z_head { background-color: #F9FAFC; margin: 14px 16px 24px 16px; text-align: left; height: 22px; font-size: 16px; font-family: PingFang SC; font-weight: 400; line-height: 22px; color: #333333; } .z_body { background-color: #F9FAFC; width: 343px; margin: 0px 16px; display: flex; flex-wrap: wrap; justify-content: space-between; } .z_body img { width: 72px; margin-bottom: 40px; } .z_foot { margin: 0px 16px; height: 22px; font-size: 16px; font-family: PingFang SC; font-weight: 400; line-height: 22px; color: #333333; opacity: 1; } .z_cz { margin: 24px 16px; } .z_cz_y{ width: 72px; height: 72px; border: 1px solid #9393AC; border-radius: 50%; opacity: 1; line-height: 72px; text-align: center; font-size: 64px; color: #9393AC; font-weight: lighter; } /* 弹窗 */ .modal { display: none; /* 默认隐藏 */ position: fixed; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgb(0, 0, 0); background-color: rgba(0, 0, 0, 0.4); /* opacity: 0.31; */ -webkit-animation-name: fadeIn; -webkit-animation-duration: 0.4s; animation-name: fadeIn; animation-duration: 0.4s } /* 弹窗内容 */ .modal-content { height: 103px; position: fixed; bottom: 108px; background: #FFFFFF; opacity: 1; border-radius: 16px; margin: auto 16px; width: -webkit-fill-available; -webkit-animation-name: slideIn; -webkit-animation-duration: 0.4s; animation-name: slideIn; animation-duration: 0.4s } .modal-content { height: 103px; position: fixed; bottom: 108px; background: #FFFFFF; opacity: 1; border-radius: 8px; margin: auto 16px; width: -webkit-fill-available; -webkit-animation-name: slideIn; -webkit-animation-duration: 0.4s; animation-name: slideIn; animation-duration: 0.4s } .modal-content_t { text-align: center; height: 50px; font-size: 15px; font-family: PingFang SC; font-weight: 500; line-height: 50px; color: #363F4D; opacity: 1; } .modal-content_b { text-align: center; border-top: 1px solid #F6F6F6; height: 50px; font-size: 15px; font-family: PingFang SC; font-weight: 500; line-height: 50px; color: #363F4D; opacity: 1; } .modal-btn { height: 50px; position: fixed; bottom: 34px; background: #FFFFFF; opacity: 1; border-radius: 8px; margin: auto 16px; width: -webkit-fill-available; -webkit-animation-name: slideIn; -webkit-animation-duration: 0.4s; animation-name: slideIn; animation-duration: 0.4s; text-align: center; font-size: 14px; font-family: PingFang SC; font-weight: 400; line-height: 50px; color: #9393AC; } .cancel_button { border-radius: 0px 0px 0px 16px; float: left; width: 50%; height: 54px; background: #FFFFFF; font-size: 18px; font-family: PingFang SC; font-weight: bold; line-height: 27px; color: #333333; opacity: 1; } /* 添加动画 */ @-webkit-keyframes slideIn { from { bottom: -300px; opacity: 0 } to { bottom: 0; opacity: 1 } } @keyframes slideIn { from { bottom: -300px; opacity: 0 } to { bottom: 0; opacity: 1 } } @-webkit-keyframes fadeIn { from { opacity: 0 } to { opacity: 1 } } @keyframes fadeIn { from { opacity: 0 } to { opacity: 1 } }