page { background-color: #161616; width: 100%; height: 100%; } .page { width: 750rpx;height: 100vh; background: url('../../static/w3/bg.png'); background-size: 750rpx 1624rpx; } .bodyMain { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 750rpx; .bg { display: flex;flex-direction: column; width: 690rpx;height: 800rpx; background: url('../../static/w3/tran/bg_tran.png'); background-size: 690rpx 800rpx; justify-content: center; .item { display: flex;flex-direction: column;justify-content: flex-start;align-items: flex-start; .iconId { width:314rpx;height:110rpx;margin-left:20rpx; } .btn { width:610rpx;height:96rpx;margin:0 auto;margin-bottom: 20rpx; } } .num1 { width:100%;display: flex;flex-direction: row;justify-content: space-between;align-items: center;margin-top:40rpx; .num { width:500rpx;height:60rpx;padding-left:40rpx; input { background: none;border:none;color:#fff; } } .all { width:190rpx;height:60rpx;font-weight: bold;text-align: right;padding-right: 40rpx; font-size: 28rpx; color: #FF4655; } } .num2 { width:100%;display: flex;flex-direction: row;justify-content: space-between;align-items: center; margin-top:20rpx;margin-bottom: 40rpx; .num { width:200rpx;height:60rpx;padding-left:40rpx;font-weight: 400;font-size: 28rpx;color: #FFFFFF; } .all { width:490rpx;height:60rpx;text-align: right;padding-right: 40rpx; font-weight: 400; font-size: 28rpx; color: #FFFFFF; } } .line { width: 610rpx;height: 2rpx;margin-left:40rpx; background: #393939; border-radius: 0rpx 0rpx 0rpx 0rpx; } } .bg2 { display: flex;flex-direction: column; width: 690rpx;margin-top:20rpx; justify-content: center; .item { display: flex;flex-direction: column;justify-content: flex-start;align-items: flex-start; .iconId { width:314rpx;height:110rpx;margin-left:20rpx; } } .itemRule { display: flex;flex-direction: column;justify-content: flex-start;align-items: flex-start; width: 690rpx;height: 234rpx; background: url('../../static/w3/tran/bg_desc.png'); background-size: 690rpx 234rpx; font-weight: 400;padding:24rpx 32rpx; font-size: 24rpx; color: #999999; } } } .thread { height: 20rpx; } .thread2 { height: 60rpx; } .sigin { display: flex;flex-direction: row;justify-content:flex-end;align-items: center; width: 650rpx;height: 180rpx;margin:10rpx auto; background: url('../../static/w3/signin.png'); background-size: 650rpx 180rpx; .btn { width:152rpx;height:72rpx;border-radius: 20rpx;margin-right:30rpx; background-color: #fff; display: flex;flex-direction: row;justify-content: center;align-items: center; } } .list_r { width:750rpx;display: flex;flex-direction: row;justify-content: flex-start;align-items: center;margin-top:20rpx; font-weight: bold;padding-left:40rpx; font-size: 32rpx; color: #FFFFFF; .item1 { width: 314rpx;height: 110rpx;margin-right:20rpx; background: url('../../static/w3/bg_c1_box.png'); background-size: 314rpx 110rpx; } .item2 { width: 314rpx;height: 110rpx; background: url('../../static/w3/bg_c1_share.png'); background-size: 314rpx 110rpx; } .item3 { width: 314rpx;height: 110rpx;margin-right:20rpx;margin-top:20rpx; background: url('../../static/w3/bg_c1_tran.png'); background-size: 314rpx 110rpx; } .item4 { width: 314rpx;height: 110rpx;margin-top:20rpx; background: url('../../static/w3/bg_c1_x.png'); background-size: 314rpx 110rpx; } } .list_item { width:690rpx;height:308rpx;display: flex;flex-direction: column;justify-content: flex-start;align-items: center; background: url('../../static/w3/bg_box.png'); background-size: 690rpx 308rpx;margin:0 auto; .item1 { width:690rpx;height:70rpx; display: flex;flex-direction: row;justify-content: space-between;align-items: center; .left { font-weight: bold;padding-left:30rpx; font-size: 32rpx; color: #FFFFFF; } .right { font-weight: 400;padding-right:30rpx; font-size: 28rpx; color: #FFFFFF; } } .item2 { width:690rpx;height:228rpx; display: flex;flex-direction: row;justify-content: space-between;align-items: center; .left { width:230rpx; display: flex;flex-direction: row;justify-content: center;align-items: center; image { width:168rpx; } } .right { width:460rpx; display: flex;flex-direction: column;justify-content: space-between;align-items: center; .content { font-weight: 400;font-size: 24rpx;color: #FFFFFF; padding-right:80rpx; } .act { width:100%;display: flex;flex-direction: row;justify-content: flex-end;align-items: center;padding-right: 30rpx;padding-top:20rpx; image { width:100rpx;height:32rpx; } } } } }