.pinned-list {
    background:#202020;
    border-radius: 9px;
    box-sizing:border-box;
    margin-top:30px;
    width:100%;
}
.pinned-list.mobile {
    display:block;
    padding:20px 16px;
}
.pinned-list.mobile > .item {
    width:100%;
    box-sizing: border-box;
    padding:15px 0;
    border-bottom:1px solid #6B6795;
    &:first-child {
        padding-top:0px;
    }
    &:last-child {
        padding-bottom:0px;
        border-bottom:0px;
    }
}
.pinned-list.mobile > .item > .line {
    display:inline-block;
    width:100%;
    font-family: var(--font-regular);
    font-weight: 400;
    color:#D7D7D7;
    font-size:14px;
    margin-top:6px;
    &:first-child {
        margin-top:0px;
    }
}
.pinned-list > .item a {
    color:#ECA900;
}
.pinned-list.mobile > .item > .line > .value {
    color:#FFFFFF;
    display:inline-block;
    margin-left:5px;
}
.pinned-list.mobile > .item > .line:first-child > .value {
    margin-left:0px;
    margin-top:5px;
    display:block;
}

@media (min-width:100px){
    .pinned-list.pc {
        display: none;
    }
}
@media (min-width:1024px){
    .pinned-list.mobile {
        display:none;
    }
    .pinned-list.pc {
        display: block;
        padding:20px 16px;
    }
    .pinned-list.pc > .item {
        display:flex;
        align-items:center;
        width:100%;
        padding:10px 0;
        border-bottom:1px solid #2F2F2F;
        &:last-child {
            border-bottom:0px;
        }
    }
    .pinned-list.pc > .item > .value {
        flex:none;
        font-family: var(--font-regular);
        font-weight: 400;
        color:#FFFFFF;
        font-size:14px;
        display:inline-block;
    }
    .pinned-list.pc > .item.head > .value {
        color:#D7D7D7;
    }

    .pinned-list.pc > .item > .value.one {
        width:480px;
    }
    .pinned-list.pc > .item > .value.two {
        width:200px;
    }
    .pinned-list.pc > .item > .value.three {
        width:330px;
    }
}
@media (min-width:1200px){
    .pinned-list.pc > .item > .value {
        font-size:16px;
    }
    .pinned-list.pc > .item > .value.one {
        width:590px;
    }
    .pinned-list.pc > .item > .value.two {
        width:250px;
    }
    .pinned-list.pc > .item > .value.three {
        width:400px;
    }
}
@media (min-width:1400px){
    .pinned-list.pc > .item > .value.one {
        width:640px;
    }
    .pinned-list.pc > .item > .value.two {
        width:300px;
    }
    .pinned-list.pc > .item > .value.three {
        width:400px;
    }
}
@media (min-width:1600px){
    .pinned-list.pc {
        padding:30px 25px;
    }
    .pinned-list.pc > .item {
        padding:15px 0;
        &:first-child {
            padding-top:0px;
        }
        &:last-child {
            padding-bottom:0px;
        }
    }
    .pinned-list.pc > .item > .value {
        font-size:18px;
    }
    .pinned-list.pc > .item > .value.one {
        width:750px;
    }
    .pinned-list.pc > .item > .value.two {
        width:350px;
    }
    .pinned-list.pc > .item > .value.three {
        width:480px;
    }
}

.pages {
    display:flex;
    align-items:center;
    justify-content: center;
    width:100%;
    margin-top:30px;
}
.pages > .btn-page {
    background:rgb(32, 32, 32);
    padding:15px;
    box-sizing: border-box;
    color:#FFF;
    cursor: pointer;
    font:400 16px/1.2em var(--font-regular);
    border:0px;
    border-right:1px solid #2F2F2F;
    &:first-child {
        border-top-left-radius: 9px;
        border-bottom-left-radius: 9px;
    }
    &:last-child {
        border-top-right-radius: 9px;
        border-bottom-right-radius: 9px;
        border-right: 0px;
    }
}
.pages > .btn-page.active {
    background:rgb(60,57,57);
}