/*720代表设计师给的设计稿的宽度,你的设计稿是多少,就写多少;100代表换算比例,这里写100是 为了以后好算,比如,你测量的一个宽度是100px,就可以写为1rem,以及1px=0.01rem等等*/ /* *{touch-action: none;} */ .margin16_lr { margin: 0 16px; box-sizing: border-box; } .margin16_tb { margin: 16px 0; box-sizing: border-box; } .dialog_txt_tel { font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #363F4D; line-height: 24px; } .exit_button { position: absolute; margin-left: 24px; margin-right: 24px; background: #21D197; bottom: 31px; height: 44px; border-radius: 12px; position: absolute; width: -webkit-fill-available; height: 50px; border-radius: 12px; margin: auto 24px -20px 24px; border: 1px solid #E0E0E0; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #9393AA; } .mui-card { margin: 0px; border-radius: 8px; } .z_my_head { position: relative; /* padding: 0.16rem; */ height: 219px; width: 100%; box-sizing: border-box; background-color: #fff; } .z_img_head1 { width: 64px; height: 64px; background: rgba(0, 0, 0, 0); opacity: 1; border-radius: 20%; margin: 16px; display: inline-block; box-sizing: border-box; text-align: center; color: #fff; object-fit: fill; overflow: hidden; } .z_img_head1 img { width: 64px; height: 64px; } .z_img_tip { width: 18px; height: 18px; border-radius: 50%; margin: 16px; display: inline-block; box-sizing: border-box; text-align: center; color: #fff; background: #C0C4CC; object-fit: fill; margin-top: 23.5px; margin-right: 0; overflow: hidden; } .z_img_tip img { width: 18px; height: 18px; } .z_img_qrcode { width: 28px; height: 28px; line-height: 28px; border-radius: 20%; margin: 16px; display: inline-block; } .z_img_qrcode img { width: 28px; height: 28px; } .z_leveltitle { position: absolute; left: 35px; top: 90px; height: 24px; line-height: 24px; width: 66px; text-align: center; font-weight: bold; font-size: 13px; color: #FDFF4D; -webkit-text-fill-color: #FDFF4D; background-color: #4ACECF; border-radius: 9px; } .z_authentication { position: absolute; margin-top: -0.5rem; margin-left: 1.6rem; height: 0.4rem; line-height: 0.4rem; width: 2rem; } .z_authentication_icon { width: 14px; height: 14px; font-size: 16px !important; color: #04A604; -webkit-text-fill-color: #04A604; } .z_authentication_txt { color: #9393AA; -webkit-text-fill-color: #9393AA; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; } .z_card { position: absolute; top: 16px; left: 136px; } .z_card_name { font-size: 15px; font-weight: bold; } .z_card_span { font-size: 13px; } .z_edit { position: absolute; top: 16px; right: 16px; height: 24px; } .z_badge_position { position: absolute; width: 12px; height: 12px; font-size: 12px; -webkit-transform: translateY(-50%) translateX(100%); transform: translateY(-50%) translateX(100%); } .z_my_fws { position: relative; margin: 0 27px; margin-top: -36px; height: 40px; line-height: 40px; background: #FFEBC1; box-shadow: 0px 5px 10px 0px rgba(0, 64, 128, 0.04); border-radius: 28px; } .z_my_fws_val { margin: 0 auto; background: #FFEBC1; width: 90%; text-align: center; font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #363F4D; -webkit-text-fill-color: #363F4D; } .z_my_gzd { /* margin-top: 0.4rem; */ /* text-align: center; */ display: flex; justify-content: space-between; } .z_font_currency { height: 66px; line-height: 32px; } .z_my_gzd_color { font-size: 11px; color: #9393AA; -webkit-text-fill-color: #9393AA; } .z_my_gzd_val { font-size: 17px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #363F4D; -webkit-text-fill-color: #363F4D; } .z_menu_btn_row { height: 54px; line-height: 54px; background-color: #fff; padding: 0 24px; box-sizing: border-box; border-bottom: 1px solid #F6F6F6; font-size: 15px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; 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; */ } .z_menu_btn_row2 { height: 130px; background-color: #fff; box-sizing: border-box; } .z_menu_btn_img { float: left; margin: 14px; margin-left: 0px; } .z_menu_btn_img1 { width: 34px; height: 34px; line-height: 34px; border-radius: 50%; margin: 0 auto; text-align: center; object-fit: fill; font-size: 16px; font-weight: bold; overflow: hidden; } .z_menu_btn_img2 { line-height: 25px; margin: 0 auto; text-align: left; color: #1B79FE; object-fit: fill; font-size: 16px; font-weight: bold; overflow: hidden; } .z_menu_btn_img3 { line-height: 0px; margin-top: 4px; } .z_menu_btn_img4 { line-height: 0; margin-top: 7px; } .z_menu_btn_txt { float: left; } .z_menu_btn_txt_1 { margin-left: 24px; font-size: 15px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: #1B79FE; -webkit-text-fill-color: #1B79FE; } .z_menu_btn_txt_r { font-size: 14px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #9393AA; line-height: 19px; } .z_menu_btn_txt_list { margin-left: 10px; font-size: 15px; font-family: PingFang SC; font-weight: 400; line-height: 16px; color: #9393AA; } .sc_txt_style { width: 236px; line-height: 22px; } .ellipsis_txt { width: 236px; line-height: 22px; float: right; display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 4; /* white-space: nowrap; */ text-overflow: ellipsis; -o-text-overflow: ellipsis; } .z_menu_btn_txt_bottom { font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #363F4D; line-height: 23px; } .z_menu_btn_icon { float: right; height: 100%; } .z_menu_btn_icon .iconfont { font-family: "iconfont" !important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .z_menu_card { width: 100%; display: flex; justify-content: space-between; border-bottom: 1px solid #FAFAFA; } .z_menu_btn_card { height: 100%; padding-top: 12px; background-color: #fff; text-align: center; } .z_menu_btn_card:active { /* background-color: #D8D8D8; */ } .z_menu_card1 { height: 0.6rem; line-height: 0.6rem; padding: 0 0.2rem; display: flex; justify-content: space-between; } .z_menu_card1_img { width: 47px; height: 47px; line-height: 47px; border-radius: 50%; margin: 0 auto; text-align: center; color: #1B79FE; background: #c2e3ff; object-fit: fill; font-size: 24px; font-weight: bold; overflow: hidden; } .z_menu_card1_name { font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #9393AA; margin-top: 8px; } .z_menu_card1_num { margin-top: 8px; font-size: 17px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #1B79FE; } .z_menu_card2 { text-align: center; border: 1px solid #0075F0; } .icon_tip { color: #FE9870; -webkit-text-fill-color: #FE9870; } .icon_tip1 { color: #31C4C4; -webkit-text-fill-color: #31C4C4; } .z_tx { padding: 0px 17px 0px 24px; height: 93px; line-height: 93px; background-color: #fff; box-sizing: border-box; opacity: 1; } .z_tx_text { float: left; padding-top: 36px; font-size: 15px; font-family: PingFang SC; font-weight: 400; line-height: 18px; color: #1E1F20; } .z_xzqs { padding: 0px 13px 0px 15px; border-top: 1px solid #F6F6F6; line-height: 56px; height: 56px; } .z_xzqs_text { float: left; font-size: 14px; font-family: PingFang SC; font-weight: 500; line-height: 56px; color: #1E1F20; } .z_xzqs_text_r { font-size: 14px; font-family: PingFang SC; font-weight: 400; line-height: 56px; color: #9393AC; opacity: 1; } .z_syff_title { margin: 20px 0px 0px 17px; height: 21px; opacity: 1; height: 21px; font-size: 15px; font-family: PingFang SC; font-weight: 500; line-height: 16px; color: #1E1F20; opacity: 1; } .z_syff_content { margin: 11px 0px 0px 17px; height: 44px; font-size: 14px; font-family: PingFang SC; font-weight: 500; line-height: 22px; color: #9393AA; opacity: 1; } .z_syff_tpsm { margin: 23px 26px 0px 26px; height: 38px; text-align: center; line-height: 38px; font-size: 15px; font-family: PingFang SC; font-weight: 400; color: #9393AC; } .z_xx_l { float: left; margin-top: 19px; margin-left: 14px; width: 77px; height: 0px; border: 1px solid #21D197; opacity: 1; } .z_xx_r { float: right; margin-top: 19px; margin-right: 8px; width: 77px; height: 0px; border: 1px solid #21D197; opacity: 1; } .z_tbsm_title { margin: 32px 0px 0px 17px; height: 21px; opacity: 1; height: 21px; font-size: 15px; font-family: PingFang SC; font-weight: 500; line-height: 16px; color: #1E1F20; opacity: 1; } .z_tbsm_content { margin: 11px 0px 0px 17px; height: 20px; font-size: 14px; font-family: PingFang SC; font-weight: 500; line-height: 20px; color: #9393AA; opacity: 1; } .z_tbsm_content1 { margin: 24px 15px 0px 17px; height: 40px; font-size: 14px; font-family: PingFang SC; font-weight: 500; line-height: 20px; color: #9393AA; opacity: 1; } .z_tbsm_tpsm { margin: 11px 26px 0px 26px; height: 38px; text-align: center; line-height: 38px; font-size: 15px; font-family: PingFang SC; font-weight: 400; color: #9393AC; } .z_tbsm_tpsm1 { margin: 18px 26px 0px 26px; height: 38px; text-align: center; line-height: 38px; font-size: 15px; font-family: PingFang SC; font-weight: 400; color: #9393AC; } .z_body { padding: 0px 13px 0px 15px; line-height: 46px; height: 46px; opacity: 1; } .z_foot { padding: 0px 13px 0px 15px; border-top: 1px solid #DAE1EE; line-height: 50px; height: 50px; opacity: 1; } .z_head_text_l { float: left; font-size: 14px; font-family: PingFang SC; font-weight: 500; line-height: 50px; color: #1E1F20; opacity: 1; } .z_head_text_r { float: right; text-align: right; font-size: 14px; font-family: PingFang SC; font-weight: 400; line-height: 50px; color: #9393AC; opacity: 1; } .z_body_text_l { float: left; font-size: 14px; font-family: PingFang SC; font-weight: 500; line-height: 46px; color: #1E1F20; opacity: 1; } .z_body_text_r { text-align: right; float: right; font-size: 14px; font-family: PingFang SC; font-weight: 400; line-height: 46px; color: #9393AC; opacity: 1; } .z_foot_text_l { float: left; font-size: 14px; font-family: PingFang SC; font-weight: 500; line-height: 50px; color: #1E1F20; opacity: 1; } .z_foot_text_r { text-align: right; float: right; font-size: 14px; font-family: PingFang SC; font-weight: 400; line-height: 50px; color: #9393AC; opacity: 1; } .margin12_lr { margin: 0 12px; box-sizing: border-box; } .margin16_lr { margin: 0 16px; box-sizing: border-box; } .margin11_lr { margin: 0 11px; box-sizing: border-box; } .z_jb { font-size: 15px; font-family: PingFang SC; font-weight: 400; line-height: 16px; color: #9393AA; } .sffy_dropdown1 { height: 352px; width: 100%; color: #505050; max-height: 0; overflow: hidden; transition: all .3s; background: #FFFFFF; box-shadow: 0px 5px 10px 0px rgba(0, 64, 128, 0.04); border-radius: 8px; } .sffy_dropdown1_top { height: 34px; text-align: center; font-size: 14px; font-family: PingFang SC; font-weight: 400; line-height: 34px; color: #9393AC; opacity: 1; } .sffy_dropdown1_bottom { border-top: 1px solid #DAE1EE; height: 34px; text-align: center; font-size: 14px; font-family: PingFang SC; font-weight: 400; line-height: 34px; color: #9393AC; opacity: 1; } .sffy_dropdown_style { padding: 3px 0 0px 8px; transition: all .3s } .sffy_down { max-height: 70px; position: fixed; z-index: 1; } .sffy_down1 { max-height: 352px; position: fixed; z-index: 1; } .sffy_dropdown_text { font-size: 15px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #9393AA; } /* 保存 */ .z_bc { position: absolute; width: 100%; bottom: 0%; height: 74px; opacity: 1; } .bc { width: 232px; height: 50px; background: #21D197; opacity: 1; border-radius: 8px; margin: 0px 72px 0px 71px; line-height: 50px; text-align: center; border: 1px solid #21D197; opacity: 1; border-radius: 12px; font-size: 15px; font-family: PingFang SC; font-weight: 500; line-height: 50px; color: #FFFFFF; } .z_tc_sjh { height: 180px; margin: 30px; padding: 20px 27px 13px 27px; background: #FFFFFF; } .z_tc_sjh_head { height: 28px; font-size: 20px; font-family: PingFang SC; font-weight: 400; line-height: 27px; color: #333333; } .z_tc_sjh_body { margin: 5px 83px; height: 33px; font-size: 24px; font-family: PingFang SC; font-weight: 400; line-height: 27px; color: #9393AC; } /* 弹窗 */ .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-sex-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-sex-content_t { text-align: center; height: 50px; font-size: 15px; font-family: PingFang SC; font-weight: 400; line-height: 50px; color: #363F4D; opacity: 1; } .modal-sex-content_b { text-align: center; border-top: 1px solid #DAE1EE; height: 50px; font-size: 15px; font-family: PingFang SC; font-weight: 400; line-height: 50px; color: #363F4D; opacity: 1; } .modal-sex-btn { height: 50px; position: fixed; bottom: 34px; 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; 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 } }