/*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: 112px; height: 112px; float: left; /* position: relative; margin-right: -60px; */ 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; } .title_txt1 { margin-top: 16px; margin-left: 16px; font-size: 16px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: #2D354C; -webkit-text-fill-color: #2D354C; } .title_txt_child { margin-top: 16px; margin-left: 16px; font-size: 11px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #9393AC; -webkit-text-fill-color: #9393AC; } .progress_bar_style { margin-top: 16px; margin-left: 108px; width: 162px; height: 8px; background: #F0F0F0; border-radius: 4px; } .progress_background { width: 75%; 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: 170px; } .z_body { margin: 16px; width: 343px; height: 378px; background: #FFFFFF; border-radius: 8px; box-shadow: 0px 5px 10px 0px rgba(0, 64, 128, 0.04); } .z_body_top { height: 210px; } .z_body_top_h { height: 65px; } .z_body_title { padding: 16px; height: 18px; font-size: 16px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: #2D354C; line-height: 18px; } .z_body_title1 { margin: 6px 16px 0px 16px; width: 309px; height: 25px; font-size: 11px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #9393AC; line-height: 25px; } .z_body_top_f { margin: 6px 16px 16px 16px; width: 311px; height: 123px; background: #EBECEF; border-radius: 12px; } .z_body_top_input { margin: 12px 8px 0px 9px; padding: 0px; width: 294px; height: 77px; font-size: 12px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; /* color: #B0B5C0; */ color: #363F4D; -webkit-text-fill-color: #363F4D; line-height: 20px; background: #EBECEF; border: none; } .z_body_top_info { float: right; margin-right: 14px; width: 45px; height: 18px; font-size: 13px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #B0B5C0; line-height: 18px; } .z_body_bottom { border-top: 1px solid #DFE9F5; } .z_body_bottom_h { padding: 14px 16px 0px 16px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #2D354C; line-height: 25px; } .z_body_bottom_b { margin: 19px 17px 0px 17px; background: #FFFFFF; border-radius: 8px; display: flex; flex-wrap: wrap; } .z_tips_active { height: 23px; margin-left: 0px; margin-right: 12px; margin-bottom: 16px; padding: 3px 5px; font-size: 12px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: #FFFFFF; line-height: 16px; height: 23px; background: #21D197; border-radius: 15px; text-align: center; } .z_tips { height: 23px; margin: 0px 6px 16px; padding: 3px 5px; font-size: 12px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #21D197; line-height: 16px; height: 23px; background: rgba(33, 209, 151, 0.1); border-radius: 15px; text-align: center; } .z_body_foot { margin: 16px; height: 55px; background: #FFFFFF; border-radius: 8px; box-shadow: 0px 5px 10px 0px rgba(0, 64, 128, 0.04); } .z_body_foot_text { float: left; margin: 16px; height: 23px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #2D354C; line-height: 25px; } .z_body_foot_section { width: 131px; height: 34px; line-height: 34px; border-radius: 8px; border: 1px solid rgba(147, 147, 172, 0.3); float: right; margin: 11px 17px; } .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; } .arrow_down { float: right; margin-right: 13px; line-height: 24px; border-radius: 20%; padding-top: 5px; display: inline-block; box-sizing: border-box; text-align: center; color: #fff; object-fit: fill; overflow: hidden; } .sffy_dropdown { height: 174px; 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 { text-align: center; padding: 4.7px 0; transition: all .3s; border-radius: 6px; border-bottom: 1px solid rgba(221, 222, 230, 0.4); } .sffy_down { max-height: 174px; position: fixed; z-index: 1; line-height: 24px; } .sffy_dropdown_text { font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #9393AC; } /* 保存 */ .z_foot { position: relative; padding-top: 12px; margin-top: 76px; width: 100%; bottom: 0%; height: 96px; background: #FFFFFF; } .z_foot_back { width: 154px; float: left; height: 50px; margin-left: 24px; text-align: center; border: 1px solid #E0E0E0; 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; border-radius: 12px; background: #21D197; line-height: 50px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #FFFFFF; } .btn_left { width: 133px; height: 50px; border-radius: 12px; border: 1px solid #E0E0E0; float: left; text-align: center; line-height: 50px; margin-left: 16px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #9393AA; -webkit-text-fill-color: #9393AA; } .btn_left_sel { width: 133px; height: 50px; border-radius: 12px; border: 1px solid #21D197; float: left; text-align: center; line-height: 50px; margin-left: 16px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #21D197; -webkit-text-fill-color: #21D197; } .btn_right { width: 133px; height: 50px; border-radius: 12px; border: 1px solid #E0E0E0; float: right; text-align: center; line-height: 50px; margin-right: 16px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #9393AA; -webkit-text-fill-color: #9393AA; } .btn_right_sel { width: 133px; height: 50px; border-radius: 12px; border: 1px solid #21D197; float: right; text-align: center; line-height: 50px; margin-right: 16px; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #21D197; -webkit-text-fill-color: #21D197; } .select_photo { width: 89px; height: 89px; text-align: center; margin: 16px 0; margin-left: 16px; background: url(../../img/boder_dash.png) no-repeat; } .img_bottom_txt { font-size: 13px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #9393AA; -webkit-text-fill-color: #9393AA; } .photos_side { margin-left: 16px; margin-bottom: 16px; }