/*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; */ } .top_img_left { width: 112px; height: 112px; float: right; /* position: relative; margin-right: -60px; */ border-radius: 12px; } .top_img { width: 112px; height: 112px; margin-left: 40px; border-radius: 12px; } .top_img_right { width: 91px; height: 110px; margin-top: 16px; float: right; border-radius: 12px; } .title_txt { text-align: center; margin-top: 34px; height: 20px; line-height: 20px; font-size: 17px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: #2D354C; -webkit-text-fill-color: #2D354C; } .progress_bar_style { margin-top: 16px; margin-left: 108px; width: 162px; height: 8px; background: #F0F0F0; border-radius: 4px; } .progress_background { width: 100%; height: 8px; background: #21D197; border-radius: 4px; } .percentage_txt { height: 14px; text-align: center; margin-top: 8px; line-height: 14px; font-size: 11px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: #9393AC; -webkit-text-fill-color: #9393AC; } .z_head { height: 215px; } .z_body { padding: 16px; margin: 16px; width: 343px; height: 108px; background: #FFFFFF; box-shadow: 0px 5px 10px 0px rgba(0, 64, 128, 0.04); border-radius: 8px; } .z_body_top { height: 18px; font-size: 16px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: #2D354C; line-height: 18px; } .z_body_bottom { margin-top: 8px; height: 50px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #2D354C; line-height: 25px; } .z_list_module { margin: 0 16px; width: 343px; height: 120px; background: #FFFFFF; box-shadow: 0px 5px 10px 0px rgba(0, 64, 128, 0.04); border-radius: 8px; } /* .z_list_bottom { border-top: 1px solid #FAFAFA; margin: 0px 16px; width: 343px; height: 120px; background: #FFFFFF; box-shadow: 0px 5px 10px 0px rgba(0, 64, 128, 0.04); border-radius: 8px; } */ .z_img_head1 { float: left; width: 88px; height: 88px; border-radius: 20%; margin: 16px; display: inline-block; box-sizing: border-box; text-align: center; color: #fff; background: #C0C4CC; object-fit: fill; overflow: hidden; } .z_img_head1 img{ width: 88px; height: 88px; } .z_list_top_m{ float: left; margin: 16px 0px; } .z_name{ height: 18px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #2D354C; line-height: 18px; } .z_academictitle{ margin-top: 8px; height: 16px; font-size: 13px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #9393AC; line-height: 16px; } .z_list_top_r{ float: right; margin: 16px; } .z_list_top_r_t{ margin: 0px 7px; width: 21px; height:21px; border-radius: 20%; display: inline-block; box-sizing: border-box; text-align: center; color: #fff; background: #FA4169; object-fit: fill; overflow: hidden; } .z_list_top_r_t img{ width: 12px; height:12px; } .z_list_bottom_r_t{ margin: 0px 7px; width: 21px; height:21px; border-radius: 20%; display: inline-block; box-sizing: border-box; text-align: center; color: #fff; background: #21D197; object-fit: fill; overflow: hidden; } .z_list_top_r_m{ text-align: center; margin-top: 4px; width: 36px; height: 16px; font-size: 12px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #F85173; line-height: 16px; } .z_list_bottom_r_m{ text-align: center; margin-top: 4px; width: 36px; height: 16px; font-size: 12px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #21D197; line-height: 16px; } .z_menu_btn_icon { float: right; height: 100%; } .z_arrow_down { margin-right: 13px; } .z_body_text_l { text-align: left; float: left; font-size: 14px; font-family: PingFang SC; font-weight: 400; line-height: 34px; color: #9393AC; opacity: 1; } .sffy_dropdown { height: 88px; width: 100%; color: #505050; max-height: 0; line-height: 18px; overflow: hidden; transition: all .3s; background: #FFFFFF; box-shadow: 0px 5px 10px 0px rgba(0, 64, 128, 0.04); border-radius: 8px; } .sffy_dropdown_style { padding: 3px 0 0px 8px; transition: all .3s } .sffy_down { max-height: 70px; position: fixed; z-index: 1; } .sffy_dropdown_text { font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #9393AC; } /* 保存 */ .z_foot { position: relative; width: 100%; bottom: 0%; height: 96px; padding-top: 12px; background: #FFFFFF; } .z_foot_back { width: 154px; float: left; height: 50px; margin-left: 24px; text-align: center; border: 1px solid #E0E0E0; opacity: 1; border-radius: 12px; background: #ffffff; line-height: 50px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #9393AA; } .z_foot_next { width: 155px; float: right; height: 50px; margin-right: 25px; text-align: center; border: 1px solid #21D197; opacity: 1; border-radius: 12px; background: #21D197; line-height: 50px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #FFFFFF; } /* 匹配超时 */ .z_ppcs { padding: 16px; margin: 16px; width: 343px; height: 108px; background: #FFFFFF; box-shadow: 0px 5px 10px 0px rgba(0, 64, 128, 0.04); border-radius: 8px; } .z_ppcs_top { height: 18px; font-size: 16px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: #2D354C; line-height: 18px; } .z_ppcs_bottom { margin-top: 8px; height: 50px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #2D354C; line-height: 25px; } /* 匹配不一致 */ .z_ppbyz { padding: 16px; margin: 16px; width: 343px; height: 249px; background: #FFFFFF; box-shadow: 0px 5px 10px 0px rgba(0, 64, 128, 0.04); border-radius: 8px; } .z_ppbyz_top { height: 18px; font-size: 16px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: #2D354C; line-height: 18px; } .z_ppbyz_middle { margin-top: 8px; height: 50px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #2D354C; line-height: 25px; } .z_ppbyz_bottom { margin-top: 16px; height: 125px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #2D354C; line-height: 25px; } /* 匹配失败 */ .z_ppsb { padding: 16px; width: 343px; height: 91px; background: #FFFFFF; box-shadow: 0px 5px 10px 0px rgba(0, 64, 128, 0.04); border-radius: 8px; } .z_ppsb_top { height: 18px; font-size: 16px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: #2D354C; line-height: 18px; } .z_ppsb_middle { margin-top: 16px; height: 25px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #2D354C; line-height: 25px; } .z_ppsb_bottom { text-align: right; margin-top: 16px; height: 25px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #21D197; line-height: 25px; } /* 匹配失效 */ .z_ppsx { padding: 16px; margin: 16px; width: 343px; height: 157px; background: #FFFFFF; box-shadow: 0px 5px 10px 0px rgba(0, 64, 128, 0.04); border-radius: 8px; } .z_ppsx_top { height: 18px; font-size: 16px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: #2D354C; line-height: 18px; } .z_ppsx_middle { margin-top: 16px; height: 25px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #2D354C; line-height: 25px; } .z_ppsx_bottom { margin-top: 16px; height: 50px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #2D354C; line-height: 25px; }