.photo_main{ //background-color: #E3E8FE; width: 702rpx; margin-left: 24rpx; top: 0; left: 0; color: #000; overflow: hidden; } .photo_full_blue_btn{ background: linear-gradient(to right, #4F93FF, #9976FF); border-radius: 80rpx; color: #fff; font-size: 30rpx; font-weight: 500; display: flex; align-items: center; justify-content: center; overflow: hidden; } .photo_back { background-color: #E3E8FE; min-height: 100vh; width: 100%; top: 0; left: 0; height: 100%; overflow: hidden; } image{ width: 100%; height: 100%; } // ----------------face .photo_main_face{ margin-top: -40px; background-color: #fff; min-height: 100vh; width: 100%; top: 0; left: 0; height: 100%; overflow: hidden; .photo_main_face_head{ height: 400rpx; width: 100%; background: linear-gradient( 180deg, #D1DAFF 0%, rgba(209,218,255,0.6) 46%, rgba(254,254,255,0) 100%); } .photo_main_face_1{ width: 554rpx; height: 82rpx; margin: 40rpx auto; margin-top: -180rpx; } .photo_main_face_2{ width: 510rpx; margin: 20rpx auto; display: flex; justify-content: space-around; align-items: center; .photo_main_face_2_1{ color: #999999; font-size: 24rpx; } .photo_main_face_2_2{ width: 26rpx; height: 26rpx; margin-top: -13rpx; } } .photo_main_face_3{ width: 702rpx; margin: 30rpx auto; display: flex; flex-wrap: wrap; // justify-content: space-around; .photo_main_face_3_one{ width: 136rpx; height: 136rpx; // border-radius: 18rpx; border: solid 2rpx #EAE7F9; background-color: #F5F6FB; .photo_main_face_3_one_icon{ width: 26rpx; height: 26rpx; margin-top: -140rpx; margin-left: 100rpx; image{ border-radius: 0; } } } } .photo_main_face_4{ width:702rpx; height: 80rpx; margin: 40rpx auto; } .photo_main_face_5{ width: 702rpx; font-size: 28rpx; color: #333333; margin: 0rpx auto; font-weight: 400; } .photo_main_face_6{ width: 702rpx; height: 514rpx; margin: 80rpx auto; } } .show_readme_div{ width: 600rpx; height: 560rpx; border-radius: 24rpx; background: linear-gradient(to bottom, #D2DCFF 0%, #fff 20%); overflow: hidden; .show_readme_div_1{ color: #333333; font-size: 30rpx; font-weight: bold; width: 100%; display: flex; justify-content: center; margin-top: 48rpx; } .show_readme_div_2{ margin-top: 30rpx; color: #555555; font-size: 24rpx; width: 480rpx; overflow: hidden; margin-left:60rpx; line-height: 50rpx; } .show_readme_div_2_1{ display: flex; justify-content: space-between; width: 100%; } .show_readme_div_2_1_one{ width: 170rpx; display: flex; align-items: flex-end; .show_readme_div_2_1_one_1{ width: 150rpx; height: 150rpx; border-radius: 24rpx; flex-shrink: 0; image{ border-radius: 24rpx; } } .show_readme_div_2_1_one_2{ width: 40rpx; height: 34rpx; flex-shrink: 0; position: relative; right: 32rpx ; } } .show_readme_div_line{ width: 480rpx; margin-left:60rpx; display: flex; justify-content: space-between; align-items: center; } .show_readme_div_3{ width: 478rpx; height: 80rpx; margin-top: 44rpx; margin-left: 60rpx; border-radius: 48rpx; display: flex; justify-content: center; align-items: center; background:#F3F2F8; color:#999999 } .save_yes{ color:#fff; background: linear-gradient(to right, #4F93FF 0%, #9877FF 80%); } .show_readme_div_4{ width: 478rpx; height: 80rpx; margin-top: 44rpx; border: 2rpx solid #5093FF; color: #5093FF; border-radius: 48rpx; display: flex; justify-content: center; align-items: center; background-color: #fff; } } // ----------------idcard .idcard_1_over{ overflow: hidden; width: 100%; background-color: #F5F6FB; } .idcard_1{ width: 516rpx; height: 720rpx; margin: 100rpx auto; } .idcard_2{ width: 100%; background-color: #fff; border-top-left-radius: 24rpx; border-top-right-radius: 24rpx; .idcard_2_1{ overflow: hidden; margin: 40rpx auto; margin-left: 20rpx; } .idcard_2_2{ width: 725rpx; height: 120rpx; margin-left: 38rpx; .idcard_2_2_1{ width: 100%; height: 100%; white-space: nowrap; .idcard_2_2_1_one{ width: 104rpx; height: 120rpx; border-radius: 8rpx; margin-right: 20rpx; display: inline-block; .idcard_2_2_1_one_1{ width: 100%; height: 100%; border-radius: 8rpx; image{ border-radius: 8rpx; } } .idcard_2_2_1_one_2{ margin-top: -120rpx; margin-left: 0rpx; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); position: relative; // opacity: 0.5; display: flex; justify-content: center; align-items: center; border-radius: 8rpx; .idcard_2_2_1_one_2_1{ width: 40rpx; height: 40rpx; } } } } } .idcard_2_3{ width: 702rpx; height: 80rpx; margin: 30rpx auto; } .idcard_2_4{ width: 702rpx; height:30rpx; display: flex; justify-content: center; align-items: center; font-size: 24rpx; color: #555555; margin-left: 24rpx; } }