.topic-and-selectives .head-top { width: 64px; height: 24px; border-radius: 20px 20px 20px 0; margin-bottom: 10px; } .topic-and-selectives .head-top .icon { width: 15px; height: 12px; margin-right: 3px; } .topic-and-selectives .head-top .text { font-family: "PingFangSC-Regular", "PingFang SC", sans-serif; font-weight: 400; font-style: normal; color: #ffffff; font-size: 14px; } .topic-and-selectives .topic-box { width: 308px; height: 320px; background-color: #ffffff; border: 1px solid #e9eef2; border-radius: 10px; padding: 10px; margin-right: 12px; } .topic-and-selectives .topic-box .head-top { background-color: #f4ae38; } .topic-and-selectives .topic-box .topic-head { height: 109px; background-color: #f6f6f6; border-radius: 8px; flex-direction: column; justify-content: space-between; padding: 12px 16px; margin-bottom: 12px; } .topic-and-selectives .topic-box .topic-head .title { font-size: 16px; color: #000000; line-height: 23px; } .topic-and-selectives .topic-box .topic-head .hint { font-family: "PingFangSC-Regular", "PingFang SC", sans-serif; font-weight: 400; font-style: normal; font-size: 16px; color: #7f7f7f; } .topic-and-selectives .topic-box .topic-head .people { position: relative; justify-content: space-between; } .topic-and-selectives .topic-box .topic-head .people::after { content: ""; position: absolute; top: 0; left: 0; transform: translateY(-100%); width: 30px; height: 4px; background-color: #f4ae38; border-radius: 150px; } .topic-and-selectives .topic-box .topic-head .people .left { color: #aaaaaa; font-size: 13px; } .topic-and-selectives .topic-box .topic-head .people .left .number { color: #333333; margin-right: 3px; } .topic-and-selectives .topic-box .topic-head .people .right .item { width: 26px; height: 26px; border-radius: 50%; } .topic-and-selectives .topic-box .topic-head .people .right .item .img { width: 26px; height: 26px; border-radius: 50%; } .topic-and-selectives .topic-box .topic-head .people .right .item:nth-child(6) { margin-right: -9px; } .topic-and-selectives .topic-box .topic-head .people .right .item:nth-child(5) { margin-right: -9px; } .topic-and-selectives .topic-box .topic-head .people .right .item:nth-child(4) { margin-right: -7px; } .topic-and-selectives .topic-box .topic-list .item:hover { color: #000000; } .topic-and-selectives .topic-box .topic-list .item:not(:last-child) { margin-bottom: 1px; } .topic-and-selectives .topic-box .topic-list .item .img { width: 12px; height: 10px; margin-right: 9px; } .topic-and-selectives .topic-box .topic-list .item .text { font-size: 14px; color: #555555; line-height: 28px; } .topic-and-selectives .selectives-box { width: 628px; height: 320px; background-color: #ffffff; border: 1px solid #e9eef2; border-radius: 10px; padding: 10px; } .topic-and-selectives .selectives-box .head-top { background-color: #f68251; margin-bottom: 22px; } .topic-and-selectives .selectives-box .list { flex-wrap: wrap; padding: 0 5px; justify-content: space-between; } .topic-and-selectives .selectives-box .list .item { font-size: 14px; color: #555555; line-height: 20px; margin-bottom: 12px; position: relative; } .topic-and-selectives .selectives-box .list .item .dot { width: 6px; height: 6px; border-radius: 50%; background-color: #f68251; margin-right: 10px; } .topic-and-selectives .selectives-box .list .item .text { width: 265px; } .forum-sections-list { position: relative; width: 897px; height: 240px; background-color: #ffffff; border: 1px solid #e9eef2; border-radius: 10px; padding-left: 70px; padding-top: 20px; } .forum-sections-list .img { position: absolute; top: -1px; left: -1px; width: 60px; height: 240px; } .forum-sections-list .title { font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif; font-weight: 650; font-style: normal; font-size: 16px; color: #000000; margin-bottom: 16px; } .forum-sections-list .list .line:not(:last-child) { margin-bottom: 10px; } .forum-sections-list .list .line .item { font-family: "PingFangSC-Regular", "PingFang SC", sans-serif; font-weight: 400; font-style: normal; font-size: 14px; color: #333; padding: 0 18px; height: 32px; background-color: #f6f6f6; border: 1px solid #f2f2f2; border-radius: 16px; cursor: pointer; } .forum-sections-list .list .line .item:not(:last-child) { margin-right: 10px; }