.home-page { min-height: 100vh; padding-bottom: 130rpx; background: #F3F3F3; } .page-top-box { width: 100%; height: 575rpx; position: relative; } .page-title { width: 100%; color: #fff; text-align: center; position: relative; } .top-bg { width: 100%; height: 598rpx; position: absolute; } .top-box-content { position: relative; padding: 0 40rpx; color: #fff; } .top-set-box .setIcon { width: 32rpx; height: 29rpx; } .top-set-box .message { width: 38rpx; height: 29rpx; margin-left: 34rpx; } .set-box-l { width: 160rpx; height: 44rpx; line-height: 44rpx; text-align: center; background: #FFA583; border-radius: 22rpx; font-size: 24rpx; } .userInfo-box { margin-top: 34rpx; } .userInfo-box .header-img { width: 120rpx; height: 120rpx; border-radius: 50%; margin-right: 12rpx; } .userInfo-r { width: calc(100% - 134rpx); } .userInfo-r .name { width: auto; font-size: 36rpx; } .level { padding: 2rpx 20rpx; font-size: 24rpx; background: #FEC313; text-align: center; border-radius: 25px; } .img-tags { margin-top: 14rpx; } .userInfo-r image { width: 132rpx; height: 48rpx; } .userInfo-r .tyg-tag { width: 188rpx; height: 44rpx; margin-left: 22rpx; } .auth-tips { font-size: 26rpx; color: #fff; margin-top: 12rpx; } .auth-tips image { width: 28rpx; height: 28rpx; -webkit-transform: rotate(180deg); transform: rotate(180deg); } .my-reminds-box { margin-top: 20rpx; } .remind-item { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; align-items: center; font-size: 28rpx; } .count { font-size: 36rpx; } .to-tyg-box { text-align: center; margin-top: 24rpx; } .to-tyg-box image { width: 670rpx; height: 114rpx; } .menu-list-box { width: 100%; padding: 40rpx; } .needs-menu-list, .resources-menu-list, .searver-menu-list { width: 100%; background: #fff; box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.07); border-radius: 12rpx; margin-bottom: 32rpx; position: relative; } .needs-menu-list .mask-box { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; margin: auto; border-radius: 5px; background: rgba(255, 255, 255, 0.9); overflow: hidden; } .needs-menu-list .mask-box text { width: 100%; position: absolute; left: 50%; top: 50%; text-align: center; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); color: #FF6D31; font-size: 36rpx; font-weight: bold; } .needs-menu-list .mask-box::before { content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; -webkit-filter: blur(20px); filter: blur(20px); z-index: -1; margin: -30px; } .menu-list { width: 100%; padding: 40rpx 22rpx 22rpx; } .menu-item { /* width: 100%; */ } .title-box { width: 100%; padding: 16rpx 20rpx; border-bottom: 1px solid #F0F0F0; font-size: 28rpx; color: #303030; } .seemore { font-size: 24rpx; color: #BFBFBF; } .seemore image { width: 12rpx; height: 22rpx; margin-left: 10rpx; } .menu-item { width: 25%; margin-bottom: 32rpx; color: #4A4A4A; font-size: 24rpx; line-height: 34rpx; } .myorder-menu-list .menu-item { width: 20%; } .menu-item image { width: 48rpx; height: 48rpx; margin-bottom: 14rpx; } .torelease-img { position: relative; width: 100%; height: 90rpx; } .torelease-img image { width: 630rpx; height: 62rpx; position: absolute; left: 20rpx; } .to-btn { width: 118rpx; height: 34rpx; line-height: 34rpx; text-align: center; font-size: 20rpx; color: #ED7632; background: #FFFFFF; border-radius: 20rpx; position: absolute; right: 44rpx; top: 14rpx; }