.best-rank-list {
    width: 100%;
    font-size: 15px;
}
.best-rank-list a {
    display: flex;
    height: 55px;
    align-items: center;
    justify-content: flex-start;
    color: var(--color-neu-500);
    border-bottom: 1px solid var(--color-neu-20);
    background: var(--color-neu-00);
}
.best-rank-list a div {
    font-size: 15px;
    line-height: 20px;
}
.best-rank-list a:hover, .best-rank-list a:focus {
    text-decoration: none;
    outline: none;
}
.best-rank-list .title-wrap:hover {
    text-decoration: underline;
}
.best-rank-list .index {
    background-color: var(--color-neu-10);
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    color: var(--color-neu-900);
    border-bottom: 1px solid var(--color-neu-20);
}
.best-rank-list .index > div {
    text-align: center;
    color: var(--color-neu-900);
    font-weight: 500;
    justify-content: center;
}
.best-rank-list .index .num {
    width: 70px;
}
.best-rank-list .index .title {
    width: 265px;
    padding: 0;
}
.best-rank-list .index .rank-range {
    padding-right: 24px;
    font-size: 15px;
}
.best-rank-list .num {
    width: 70px;
    font-weight: bold;
    text-align: center;
    color: var(--color-neu-900);
    flex-shrink: 0;
}
.best-rank-list .title {
    width: 265px;
    color: var(--color-neu-900);
    display: flex;
    align-items: center;
    gap: 4px;
    word-break: break-all;
    flex-shrink: 0;
    padding-right: 16px;
}
.best-rank-list .title .contest {
    flex-shrink: 0;
    font-weight: 500;
    font-size: 15px;
    line-height: 20px;
    display: inline-flex;
    margin-right: 4px;
    color: var(--color-pri-500);
}
.best-rank-list .title .badge-19 {
    width: 16px;
    height: 16px;
}
.best-rank-list .title .contest-list {
    color: var(--color-pri-500);
    font-weight: 700;
    flex-shrink: 0;
}
.best-rank-list .title .contest-list + .badge-19 {
    margin-left: 4px;
}
.best-rank-list .title .contest-list + .title-wrap {
    margin-left: 4px;
}
.best-rank-list .title .title-wrap {
    font-size: 15px;
    font-weight: 500;
    line-height: 20px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: var(--color-neu-900);
}
.best-rank-list.column-6 .title {
    width: 315px;
}
.best-rank-list.column-5 .title {
    width: 385px;
}
.best-rank-list .author {
    width: 100px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: center;
    color: var(--color-neu-500);
    flex-shrink: 0;
    padding: 0 16px;
    box-sizing: border-box;
}
.best-rank-list .genre {
    width: 140px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: center;
    color: var(--color-neu-500);
    padding: 0 16px;
    box-sizing: border-box;
}
.best-rank-list .genre span + span {
    margin-left: -3px;
}
.best-rank-list .time {
    width: 50px;
    text-align: center;
}
.best-rank-list .view-count {
    width: 120px;
    text-align: center;
    color: var(--color-neu-500);
    flex-shrink: 0;
}
.best-rank-list .rank-range {
    justify-content: flex-start;
    flex-shrink: 0;
    margin-left: 20px;
}
.best-rank-list .rank-range.rank-up, .best-rank-list .rank-range.rank-down {
    font-size: 14px;
}
.best-rank-list .rank-range.rank-same {
    width: 17px;
    justify-content: center;
}
.best-rank-list.contest-list .index .title {
    width: 233px;
}
.best-rank-list.contest-list .index .rank-range {
    padding: 0 0 0 20px;
    width: 70px;
    margin: 0;
    justify-content: flex-start;
}
.best-rank-list.contest-list .index .percent {
    width: 82px;
}
.best-rank-list.contest-list .title {
    width: 233px;
}
.best-rank-list.contest-list .percent {
    width: 82px;
    text-align: center;
}
.best-rank-list.contest-list.no-percent .index .title {
    width: 315px;
}
.best-rank-list.contest-list.no-percent .index .rank-range {
    padding: 0 0 0 20px;
    width: 70px;
    margin: 0;
    justify-content: flex-start;
}
.best-rank-list.contest-list.no-percent .title {
    width: 315px;
}
.best-rank-list.contest-list .rank-range {
    width: 50px;
}
.best-rank-list.contest-list .rank-range.rank-same {
    justify-content: flex-start;
}
.best-rank-list.contest-list .rank-range.rank-same svg {
    margin: 2.5px;
}

.rank-range {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 2px;
    font-size: 13px;
    font-weight: 400;
    line-height: 18px;
    color: var(--color-neu-300);
}
.rank-range svg {
    display: block;
    flex-shrink: 0;
}
.rank-range.rank-new {
    font-size: 12px;
    font-weight: 500;
    line-height: 17px;
    color: var(--color-sec-org-500);
    display: inline-flex;
    padding: 0 1px;
}
.rank-range.rank-up {
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    color: var(--color-neu-300);
    gap: 4px;
}
.rank-range.rank-up svg path {
    fill: var(--color-sec-red-500);
    stroke: var(--color-sec-red-500);
}
.rank-range.rank-down {
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    color: var(--color-neu-300);
    gap: 4px;
}
.rank-range.rank-down svg path {
    fill: var(--color-pri-500);
    stroke: var(--color-pri-500);
}
.rank-range.rank-same {
    color: var(--color-neu-200);
    width: 17px;
    height: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.rank-range.rank-same svg rect {
    fill: var(--color-neu-100);
}

.novel-list {
    display: flex;
    flex-direction: column;
}

.novel-list__body {
    display: flex;
    gap: 16px;
    align-items: center;
    padding: 16px 0;
    text-decoration: none;
    color: inherit;
    border-bottom: 1px solid var(--color-neu-20);
}
.novel-list__body:first-child {
    border-top: 1px solid var(--color-neu-30);
}

.novel-list__body:hover {
    text-decoration: none;
}

.novel-list__cover {
    position: relative;
    flex-shrink: 0;
    width: 88px;
    height: 126px;
    border: 1px solid var(--color-neu-20);
    border-radius: 7px;
    overflow: hidden;
}
.novel-list__cover img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.3s cubic-bezier(0.15, 0, 0.2, 1);
}
.novel-list__cover:hover img {
    transform: scale(1.04);
}
.novel-list__cover .badge-19 {
    position: absolute;
    top: 5px;
    right: 5px;
    z-index: 1;
}

.novel-list__info {
    display: flex;
    flex: 1 0 0;
    min-width: 0;
    flex-direction: column;
    gap: 7px;
    align-self: stretch;
}

.novel-list__header {
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: 100%;
}

.novel-list__genre-row {
    display: flex;
    align-items: center;
    width: 100%;
}

.novel-list__genre {
    flex: 1 0 0;
    min-width: 0;
    font-size: 15px;
    font-weight: 400;
    line-height: 20px;
    color: var(--color-neu-300);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 1px;
}
.novel-list__genre svg path {
    stroke: var(--color-neu-300);
}

.novel-list__title-row {
    display: flex;
    gap: 6px;
    align-items: center;
    width: 100%;
}

.novel-list__badges {
    display: flex;
    gap: 4px;
    align-items: center;
    flex-shrink: 0;
}

.novel-list__body:hover .novel-list__title {
    text-decoration: underline;
}

.novel-list__title {
    flex: 1 0 0;
    min-width: 0;
    font-size: 18px;
    font-weight: 500;
    line-height: 23px;
    color: var(--color-neu-900);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0;
}

.novel-list__author {
    font-size: 15px;
    font-weight: 400;
    line-height: 20px;
    color: var(--color-neu-500);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0;
}

.novel-list__stats {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 8px;
    align-items: center;
}

.novel-list__stat {
    display: flex;
    gap: 4px;
    align-items: center;
    font-size: 15px;
    font-weight: 400;
    line-height: 20px;
    white-space: nowrap;
}
.novel-list__stat-label {
    color: var(--color-neu-300);
}
.novel-list__stat-value {
    color: var(--color-neu-500);
}

.novel-list__stat-sep {
    width: 1px;
    height: 10px;
    background: var(--color-neu-40);
    flex-shrink: 0;
}

.novel-list__desc {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 15px;
    font-weight: 400;
    line-height: 20px;
    color: var(--color-neu-500);
    width: 100%;
    margin: 0;
}

.badge-up {
    width: 26px;
    height: 20px;
    background-image: url("data:image/svg+xml,%3Csvg width='26' height='20' viewBox='0 0 26 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.4' y='0.4' width='25.2' height='19.2' rx='3.6' fill='%23FA7000'/%3E%3Crect x='0.4' y='0.4' width='25.2' height='19.2' rx='3.6' stroke='%23FA7000' stroke-width='0.8'/%3E%3Cpath d='M11.1526 11.4855V5.09945H12.6657V11.6064C12.6657 13.6899 11.0994 15.1644 8.72576 15.1644C6.34731 15.1644 4.79068 13.6899 4.79068 11.6064V5.09945H6.29413V11.4855C6.29413 12.8294 7.22715 13.7914 8.72576 13.7914C10.2292 13.7914 11.1526 12.8294 11.1526 11.4855ZM14.6754 5.09945H18.2141C20.5104 5.09945 21.6416 6.48204 21.6416 8.30939C21.6416 10.1367 20.5056 11.529 18.2093 11.529H16.1789V15H14.6754V5.09945ZM16.1789 10.2479H18.0594C19.5194 10.2479 20.1285 9.4261 20.1285 8.30939C20.1285 7.19268 19.5194 6.39019 18.0546 6.39019H16.1789V10.2479Z' fill='white'/%3E%3C/svg%3E%0A");
    overflow: hidden;
    text-indent: -1000px;
}

.badge-novelend {
    width: 32px;
    height: 20px;
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='20' viewBox='0 0 32 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='32' height='20' rx='4' fill='%23757575'/%3E%3Cpath d='M13.9895 3.66989V7.72099H15.7346V8.81354H13.9895V13.0387H12.6939V3.66989H13.9895ZM11.9398 9.81906L12.0413 10.7762C9.46945 11.2403 6.57857 11.2838 4.4805 11.2838L4.33547 10.23C5.24915 10.23 6.32235 10.2251 7.44873 10.1865V9.04075C5.98879 8.83771 5.01227 7.9192 5.02194 6.65262C5.01227 5.19268 6.27401 4.21133 8.06752 4.21133C9.86103 4.21133 11.1228 5.19268 11.1324 6.65262C11.1228 7.89986 10.1704 8.81354 8.74915 9.03108V10.1285C9.83202 10.0656 10.9246 9.96892 11.9398 9.81906ZM6.2305 6.65262C6.22083 7.52279 6.98948 8.0884 8.06752 8.09807C9.16006 8.0884 9.8997 7.52279 9.90937 6.65262C9.8997 5.76796 9.16006 5.20718 8.06752 5.20235C6.98948 5.20718 6.22083 5.76796 6.2305 6.65262ZM6.06614 12.2169H7.37139V14.5808H14.4294V15.6492H6.06614V12.2169ZM25.3688 6.37707H22.4199C21.6561 8.27693 19.8094 9.53867 17.0925 10.1671L16.6381 9.10359C19.5822 8.45097 21.1678 7.09254 21.3757 5.28936H17.2859V4.23066H22.8115C22.8115 4.62707 22.7776 5.00414 22.7099 5.36188H25.3688V3.66022H26.6644V9.89641H25.3688V8.72168H22.2555V7.71133H25.3688V6.37707ZM19.9689 13.5173V14.7452H27.0318V15.7942H18.6782V12.5407H25.364V11.4482H18.654V10.4088H26.6644V13.5173H19.9689Z' fill='white'/%3E%3C/svg%3E%0A");
    overflow: hidden;
    text-indent: -1000px;
}

.contest {
    width: 43px;
    height: 20px;
    background-image: url("data:image/svg+xml,%3Csvg width='43' height='20' viewBox='0 0 43 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='43' height='20' rx='4' fill='%23ECF4FE'/%3E%3Cpath d='M13.8179 8.73619L12.6328 8.61499C12.9381 7.44337 12.9381 6.61291 12.9381 5.72859H6.28993V4.75898H14.1366V5.71512C14.1366 6.62189 14.1366 7.56457 13.8179 8.73619ZM10.4153 7.29972V9.43197H15.4249V10.4106H5.0824V9.43197H9.23019V7.29972H10.4153ZM10.1998 11.3532C12.6597 11.3532 14.2129 12.1298 14.2219 13.4631C14.2129 14.7828 12.6597 15.5594 10.1998 15.5594C7.75782 15.5594 6.19566 14.7828 6.19566 13.4631C6.19566 12.1298 7.75782 11.3532 10.1998 11.3532ZM10.1998 14.6212C11.9325 14.6212 13.0144 14.1948 13.0234 13.4631C13.0144 12.7134 11.9325 12.269 10.1998 12.2645C8.47605 12.269 7.38972 12.7134 7.3987 13.4631C7.38972 14.1948 8.47605 14.6212 10.1998 14.6212ZM22.0771 10.5318V13.1623H26.7142V14.1588H16.3043V13.1623H20.883V10.5318H17.4894V5.1136H25.4662V10.5318H22.0771ZM24.2856 6.08771H18.67V9.57562H24.2856V6.08771ZM33.6356 8.27383V7.29075H35.8173V4.21133H37.0203V12.5428H35.8173V8.27383H33.6356ZM31.0186 8.40849C30.5158 9.66091 29.5238 10.6664 28.1681 11.1512L27.5441 10.1682C29.2948 9.58011 30.3856 8.0808 30.3856 6.51416V6.06526H27.9167V5.08218H34.0576V6.06526H31.6066V6.51416C31.6066 7.93267 32.6346 9.35566 34.3494 9.93025L33.7344 10.8909C32.4505 10.4465 31.5124 9.53073 31.0186 8.40849ZM30.839 11.8021V14.3564H37.3211V15.3439H29.636V11.8021H30.839Z' fill='%232882F5'/%3E%3C/svg%3E%0A");
    overflow: hidden;
    text-indent: -1000px;
}

.contest-content {
    flex: 1;
    min-width: 0;
}
.contest-content .contest-content-wrap {
    width: 100%;
}
.contest-content .contest-content-wrap .contest-info-wrap {
    width: 815px;
    border-radius: 14px;
    overflow: hidden;
}

.page-title--h2 {
    margin: 0 0 28px 0;
}

.best-tab {
    display: flex;
    flex-direction: column;
    position: relative;
    width: 100%;
    border-bottom: 1px solid var(--color-neu-20);
    margin-top: -12px;
}
.best-tab + .empty {
    margin-top: 20px;
}
.best-tab .best-tab__row {
    display: flex;
    gap: 20px;
    align-items: center;
    position: relative;
    z-index: 1;
    margin-bottom: -1px;
}
.best-tab .best-tab__row .best-tab__item {
    height: 48px;
    padding: 12px 1px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    font-size: 18px;
    font-weight: 500;
    line-height: 23px;
    color: var(--color-neu-300);
    cursor: pointer;
    white-space: nowrap;
    box-sizing: border-box;
}
.best-tab .best-tab__row .best-tab__item:hover {
    color: var(--color-neu-500);
    text-decoration: none;
}
.best-tab .best-tab__row .best-tab__item.active {
    font-weight: 700;
    color: var(--color-neu-900);
    border-bottom-color: var(--color-neu-900);
}
.best-tab + .best-rank-list {
    margin-top: 20px;
}

.contest-banner {
    width: 100%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
}
.contest-banner img {
    width: 100%;
}
.contest-banner + .best-tab {
    margin-top: 16px;
}

.tab-line {
    margin-top: -12px;
    position: relative;
}
.tab-line .tab-line__list .list-sort {
    position: absolute;
    top: 14px;
    right: 0;
    display: flex;
    gap: 14px;
    align-items: center;
}
.tab-line .tab-line__list .list-sort .btn-refresh {
    background: transparent;
    border: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
    color: var(--color-pri-500);
    font-size: 15px;
    font-weight: 400;
    line-height: 20px;
}
.tab-line .tab-line__list .list-sort .btn-refresh svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}
.tab-line .tab-line__list .list-sort .btn-refresh svg path {
    stroke: var(--color-pri-500);
}

.novel-list__body:first-child {
    border-top: 0;
}
