.topBg { top: 0; left: 0; width: 100%; height: auto; } .eventDetailsC { background-color: white; margin-top: 10rpx; padding: 20rpx 0 0; left: 0; right: 0; bottom: calc(20rpx + 70rpx + 20rpx + env(safe-area-inset-bottom)); border-radius: 20rpx 20rpx 0 0; overflow-y: hidden; } .eventDetailsC .categoryTitleC { padding: 0 25rpx; } .eventDetailsC .categoryTitleC .category { background-color: #FD9A14; margin-right: 12rpx; display: inline-block; padding: 0 11rpx; line-height: 40rpx; border-radius: 8rpx; font-size: 22rpx; font-weight: bold; color: white; } .eventDetailsC .categoryTitleC .title { font-size: 30rpx; font-weight: bold; color: #222; } .eventDetailsC .time { margin: 20rpx 25rpx 0; font-size: 22rpx; font-weight: 500; color: #aaa; } .eventDetailsC .eventContent { margin: 22rpx 24rpx 0; font-size: 24rpx; font-weight: 500; color: #666; line-height: 1.2rem; } .eventDetailsC .categoryList { white-space: nowrap; margin-top: 10rpx; } .eventDetailsC .categoryList .item { display: inline-block; line-height: 60rpx; padding: 0 18rpx; font-size: 28rpx; font-weight: 500; color: #42485B; } .eventDetailsC .categoryList .item.select { font-weight: bold; color: #F97316; } .eventDetailsC .categoryList .item.select .line { background-color: #F97316; left: calc((100% - 50rpx)/2); bottom: 0; width: 50rpx; height: 2rpx; } .eventDetailsC .headingList { background-color: #F3F6F9; margin: 28rpx 25rpx 0; } .eventDetailsC .headingList .item { line-height: 55rpx; font-size: 24rpx; font-weight: 500; color: #999; text-align: center; } .eventDetailsC .targetList { padding: 0 25rpx; } .eventDetailsC .targetList .item { padding-bottom: 20rpx; border-bottom: solid 1rpx #E4E4E4; } .eventDetailsC .targetList .item .nameCodePriceC { padding: 20rpx 0; font-size: 28rpx; font-weight: bold; color: #222; } .eventDetailsC .targetList .item .nameCodePriceC .code { font-size: 20rpx; font-weight: 500; color: #888; } .eventDetailsC .targetList .item .nameCodePriceC .price { font-size: 28rpx; font-weight: bold; color: #222; text-align: center; } .eventDetailsC .targetList .item .nameCodePriceC .chg { color: #FF2929; } .eventDetailsC .targetList .item .content { font-size: 20rpx; font-weight: 500; color: #666; } .eventDetailsC .conceptList { padding: 30rpx 25rpx; } .eventDetailsC .conceptList .item .cover { background-color: red; display: block; width: 100%; height: 350rpx; border-radius: 10rpx; } .eventDetailsC .conceptList .item .infoC { background: linear-gradient(to bottom, #00000080, #000); padding: 20rpx 23rpx; left: 0; width: 100%; bottom: 0; color: white; } .eventDetailsC .conceptList .item .infoC .title { font-size: 26rpx; font-weight: bold; } .eventDetailsC .conceptList .item .infoC .content { margin-top: 10rpx; font-size: 20rpx; font-weight: 500; line-height: 1.2rem; } .eventDetailsC .conceptList .item .infoC .content .lookDetails { color: #F97316; } .bottomC { padding: 20rpx 25rpx calc(20rpx + env(safe-area-inset-bottom)); left: 0; right: 0; bottom: 0; box-shadow: 0px -1rpx 0px 0px #EEEEEE; } .bottomC .inputC { background-color: #F0F0F0; margin-right: 20rpx; padding: 0 33rpx; height: 70rpx; border-radius: 35rpx; } .bottomC .inputC input { height: 100%; font-size: 26rpx; font-weight: 500; } .bottomC .commentLikeNumC .item { padding: 0 20rpx; font-size: 26rpx; font-weight: bold; color: #666; } .bottomC .commentLikeNumC .item .icon { width: 35rpx; height: auto; } .popup { background-color: white; } .popup .titleCloseC { padding-left: 25rpx; font-size: 32rpx; font-weight: bold; color: #222; } .popup .titleCloseC .closeC { padding: 28rpx; } .popup .titleCloseC .closeC .icon { width: 28rpx; height: auto; } .popup .list { margin: 0 25rpx; border-top: solid 1rpx #E4E4E4; max-height: 1200rpx; } .popup .list .item { padding-top: 30rpx; border-bottom: solid 1rpx #E4E4E4; } .popup .list .item .originComment { display: flex; } .popup .list .item .originComment .avatar { background-color: red; margin-right: 23rpx; width: 80rpx; height: 80rpx; border-radius: 50%; } .popup .list .item .originComment .nickname { font-size: 28rpx; font-weight: bold; color: #111; } .popup .list .item .originComment .content { margin-top: 10rpx; line-height: 1.2rem; font-size: 24rpx; font-weight: 500; color: #666; } .popup .list .item .originComment .timeReplyLikeC .time { margin-right: 36rpx; font-size: 26rpx; font-weight: 500; color: #aaa; } .popup .list .item .originComment .timeReplyLikeC .reply { font-size: 26rpx; font-weight: 500; color: #F97316; } .popup .list .item .originComment .timeReplyLikeC .likeC { padding: 14rpx 0; font-size: 28rpx; font-weight: bold; color: #999; } .popup .list .item .originComment .timeReplyLikeC .likeC .icon { margin-right: 12rpx; width: 27rpx; height: auto; } .popup .list .item .originComment .timeReplyLikeC .likeC.like { color: #F97316; } .popup .list .item .originComment .totalCommentNumC { padding: 14rpx 0 22rpx; font-size: 26rpx; font-weight: 500; color: #999; } .popup .list .item .originComment .totalCommentNumC .line { background-color: #aaa; margin-right: 18rpx; width: 30rpx; height: 2rpx; } .popup .list .item .originComment .totalCommentNumC .arrow { margin-left: 14rpx; width: 13rpx; height: auto; } .popup .list .item .replyList { margin-left: 60rpx; border-top: solid 1rpx #E4E4E4; } .popup .list .item .replyList .replyItem { display: flex; padding: 22rpx 0; border-bottom: solid 1rpx #E4E4E4; } .popup .list .item .replyList .replyItem .avatar { background-color: red; margin-right: 23rpx; width: 80rpx; height: 80rpx; border-radius: 50%; } .popup .list .item .replyList .replyItem .nickname { font-size: 28rpx; font-weight: bold; color: #111; } .popup .list .item .replyList .replyItem .content { margin-top: 10rpx; line-height: 1.2rem; font-size: 24rpx; font-weight: 500; color: #666; } .popup .list .item .replyList .replyItem .timeReplyLikeC .time { margin-right: 36rpx; font-size: 26rpx; font-weight: 500; color: #aaa; } .popup .list .item .replyList .replyItem .timeReplyLikeC .reply { font-size: 26rpx; font-weight: 500; color: #F97316; } .popup .list .item .replyList .replyItem .timeReplyLikeC .likeC { padding: 14rpx 0; font-size: 28rpx; font-weight: bold; color: #999; } .popup .list .item .replyList .replyItem .timeReplyLikeC .likeC .icon { margin-right: 12rpx; width: 27rpx; height: auto; } .popup .list .item .replyList .replyItem .timeReplyLikeC .likeC.like { color: #F97316; } .popup .list .item .replyList .replyItem:last-child { border: none; } .popup .popBottomC { padding: 22rpx 25rpx calc(22rpx + env(safe-area-inset-bottom)); } .popup .popBottomC .inputC { background-color: #F0F0F0; padding: 0 33rpx; height: 70rpx; border-radius: 35rpx; } .popup .popBottomC .inputC input { height: 100%; font-size: 26rpx; font-weight: 500; color: #333; }