#search { width: 1200px; margin: 0 auto; .search-box { width: 460px; height: 48px; background-color: rgba(255, 255, 255, 1); border: 1px solid rgba(215, 215, 215, 1); border-radius: 10px; padding: 0 16px; margin-bottom: 20px; .search-input { border: none; outline: none; height: 100%; } .search-icon { width: 20px; height: 20px; cursor: pointer; } } .classify { margin-bottom: 16px; .item { width: 50px; height: 32px; line-height: 32px; text-align: center; background-color: rgba(255, 255, 255, 1); border: 1px solid rgba(242, 242, 242, 1); border-radius: 12px; color: #333333; cursor: pointer; font-size: 15px; &.pitch { background-color: rgba(211, 81, 16, 1); color: #ffffff; } &:not(:last-child) { margin-right: 10px; } } } .quantity { font-size: 14px; line-height: 26px; color: #555; margin-bottom: 14px; .line { width: 1px; height: 14px; background-color: #aaaaaa; margin: 0 10px; } .num { font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif; font-weight: 650; color: #000000; margin: 0 10px; } } .matter { .matter-content { margin-right: 12px; .list-box { .item-box { margin-bottom: 12px; } } .empty { width: 100%; height: 70vh; background-color: rgba(255, 255, 255, 1); border: 1px solid rgba(233, 238, 242, 1); border-radius: 10px; flex-direction: column; margin-right: 12px; .empty-icon { width: 80px; height: 94px; } .empty-text { font-size: 14px; color: #7f7f7f; margin-top: 10px; } } .pages-box { padding-bottom: 60px; padding-top: 30px; .item { min-width: 24px; height: 24px; line-height: 24px; text-align: center; border-radius: 50px; font-size: 14px; color: #555555; cursor: pointer; padding: 0 4px; &.pitch { background-color: #6fc16d; color: #ffffff; } } .arrows { width: 7px; height: 12px; margin: 0 30px; cursor: pointer; &.rotate180 { transform: rotate(180deg); } } } } .sidebar-box { width: 291px; } } }