#search-tag { max-width: 1200px; margin: 0 auto; } #search-tag .label-title { margin-bottom: 24px; } #search-tag .label-title .icon { width: 25px; margin-right: 12px; } #search-tag .label-title .text { font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif; font-weight: 650; font-style: normal; font-size: 28px; color: #000000; } #search-tag .set-hint-box { line-height: 24px; margin-bottom: 16px; } #search-tag .set-hint-box .set-hint-icon { height: 24px; margin-right: 10px; } #search-tag .classify { margin-bottom: 16px; } #search-tag .classify .item { width: 50px; height: 32px; line-height: 32px; text-align: center; background-color: #ffffff; border: 1px solid #f2f2f2; border-radius: 12px; color: #333333; cursor: pointer; font-size: 15px; } #search-tag .classify .item.pitch { background-color: #d35110; color: #ffffff; } #search-tag .classify .item:not(:last-child) { margin-right: 10px; } #search-tag .quantity { font-size: 14px; line-height: 26px; color: #555; margin-bottom: 14px; } #search-tag .quantity .line { width: 1px; height: 14px; background-color: #aaaaaa; margin: 0 10px; } #search-tag .quantity .num { font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif; font-weight: 650; color: #000000; margin: 0 10px; } #search-tag .quantity .sort-area { margin-left: auto; position: relative; z-index: 1; } #search-tag .quantity .sort-area .sort-head { cursor: pointer; } #search-tag .quantity .sort-area .sort-head .text { font-size: 14px; color: #555555; line-height: 26px; margin-right: 6px; } #search-tag .quantity .sort-area .sort-head .icon { width: 8px; height: 5px; transform: rotate(0deg); transition: transform 0.3s ease-in-out; } #search-tag .quantity .sort-area .sort-head .icon.rotate { transform: rotate(180deg); } #search-tag .quantity .sort-area .sort-mask { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; } #search-tag .quantity .sort-area .sort-box { position: absolute; top: 28px; right: 0; width: 140px; padding: 0 10px; background-color: #ffffff; border-radius: 8px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.16862745); } #search-tag .quantity .sort-area .sort-box .item { font-size: 16px; color: #555555; text-align: center; height: 60px; line-height: 60px; cursor: pointer; } #search-tag .quantity .sort-area .sort-box .item.pitch { font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif; font-weight: 650; font-style: normal; color: #d35110; } #search-tag .quantity .sort-area .sort-box .item:not(:last-child) { border-bottom: 1px dotted #d7d7d7; } #search-tag .matter { align-items: flex-start; } #search-tag .matter .matter-content { min-width: 0; margin-right: 12px; position: sticky; z-index: 1; } #search-tag .matter .matter-content .list-box .item-box { margin-bottom: 12px; } #search-tag .matter .matter-content .empty { width: 100%; height: 70vh; background-color: #ffffff; border: 1px solid #e9eef2; border-radius: 10px; flex-direction: column; margin-right: 12px; } #search-tag .matter .matter-content .empty .empty-icon { width: 80px; height: 94px; } #search-tag .matter .matter-content .empty .empty-text { font-size: 14px; color: #7f7f7f; margin-top: 10px; } #search-tag .matter .matter-content .pages-box { padding-bottom: 60px; padding-top: 30px; } #search-tag .matter .matter-content .pages-box .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; } #search-tag .matter .matter-content .pages-box .item.pitch { background-color: #6fc16d; color: #ffffff; } #search-tag .matter .matter-content .pages-box .arrows { width: 7px; height: 12px; margin: 0 30px; cursor: pointer; } #search-tag .matter .matter-content .pages-box .arrows.rotate180 { transform: rotate(180deg); } #search-tag .matter .sidebar-box { width: 291px; position: sticky; } #search-tag .matter .sidebar-box.fixed { position: fixed; right: calc((100% - 1200px) / 2); bottom: 10px; } #search-tag .matter .sidebar-box .recommend-and-essence { width: 291px; height: 64px; background-color: #ffffff; border: 1px solid #e9eef2; border-radius: 10px; padding: 0 10px; justify-content: space-between; margin-bottom: 12px; } #search-tag .matter .sidebar-box .recommend-and-essence .item { width: 130px; height: 40px; background-color: #f6f6f6; border: 1px solid #f2f2f2; border-radius: 65px; font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif; font-weight: 650; font-style: normal; font-size: 16px; color: #000000; cursor: pointer; } #search-tag .matter .sidebar-box .recommend-and-essence .item .icon { width: 20px; height: 24px; margin-right: 8px; } @media screen and (max-width: 805px) { .item-box .bottom .bottom-item:not(:last-child) { margin-right: 40px; } } @media screen and (max-width: 768px) { #search-tag .search-box { width: auto !important; margin: 0 10px 20px; height: 40px !important; } #search-tag .classify { margin-left: 10px; margin-right: 10px; } #search-tag .matter .matter-content { margin: 0; } #search-tag .matter .sidebar-box { display: none; } #search-tag .matter .search-box { margin-left: 10px; margin-right: 10px; } #search-tag { padding: 0 10px; } } @media screen and (max-width: 630px) { .sign-in.flexacenter { display: none !important; } } @media screen and (max-width: 500px) { #search-tag .classify .item { min-width: inherit; font-size: 13px; height: 28px; line-height: 28px; border-radius: 8px; } } @media screen and (max-width: 480px) { .item-box .bottom .bottom-item:not(:last-child) { margin-right: 0; } .head-top.flexacenter .input-box { width: inherit; height: inherit; background: none; border: none; padding: 5px; } .head-top.flexacenter .input-box .input { display: none; } .head-top.flexacenter .input-box .placeholder { display: none; } .head-top.flexacenter .input-box .icon { margin-left: 0; } } @media screen and (max-width: 450px) { #search-tag .classify .item { padding: 0 5px; } }