.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%; } .search_div{ width: 100%; height: 80rpx; background: #FFFFFF; border-radius: 40rpx 40rpx 40rpx 40rpx; display: flex; justify-content: space-between; align-items: center; .search_div_1{ width: 45rpx; height: 45rpx; margin-left: 24rpx; } .search_div_2{ width: 400rpx; } .search_div_3{ width: 158rpx; height: 64rpx; color: #fff; font-size: 26rpx; font-weight: bold; background: linear-gradient(to right, #5093FF, #9478FF); border-radius: 32rpx; display: flex; align-items: center; justify-content: center; margin-right: 24rpx; } } .tabs_div{ width:350rpx; margin: 10rpx auto; } .photo_list_div{ width: 100%; margin-top: 20rpx; display: flex; flex-wrap: wrap; justify-content: space-between; height: calc(100vh - 425rpx); // overflow-x: hidden; // overflow-y: scroll; .photo_list_div_one{ width: 340rpx; height: 440rpx; margin-bottom: 20rpx; // margin-top: 24rpx; .photo_list_div_one_img{ width: 100%; height: 100%; image{ width: 100%; height: 100%; border-radius: 24rpx; } } .photo_list_div_one_text{ margin-top: -66rpx; margin-left: 2%; width: 96%; display: flex; justify-content: center; color: #fff; font-size: 28rpx; font-weight: 400; height: 40rpx; overflow: hidden; } } } // ---------------------------- photo_tem_1 .photo_tem_1{ margin-top: 20rpx; width:100%; height: 1120rpx; background: url('/static/img/photo/photo_12.png') no-repeat; background-size: 100% 100%; overflow: hidden; .photo_tem_1_head{ width: 654rpx; display: flex; margin: 36rpx auto; justify-content: space-between; align-items: center; .photo_tem_1_head_1{ width: 80rpx; height: 80rpx; border-radius: 8rpx; image{ border-radius: 8rpx; } } .photo_tem_1_head_2{ width: 400rpx; .photo_tem_1_head_2_1{ color: #fff; font-size: 28rpx; } .photo_tem_1_head_2_2{ color: #fff; font-size: 22rpx; } } .photo_tem_1_head_3{ width: 120rpx; height: 54rpx; margin-top: 12rpx; display: flex; align-items: center; justify-content: center; background-color: #fff; border-radius: 38rpx; .y_btn{ width: 112rpx; height: 44rpx; color: #3B1705; background-color: #FBE579; border-radius: 30rpx; display: flex; align-items: center; justify-content: center; font-size: 24rpx; font-weight: bold; } } } .photo_tem_1_2{ width: 654rpx; height: 880rpx; margin:76rpx auto; border-radius: 24rpx; image{ border-radius: 24rpx; } } } .photo_tem_2{ margin-top: 100rpx; width: 702rpx; height: 88rpx; 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; margin-bottom: 40rpx; } // ----------------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; } }