.page-npp2023 .top-banner {
    background: url("/common/design/user/img/npp2023/bg-banner.jpg") center no-repeat;
    background-size: cover;
    padding: 60px 0 80px;
    min-height: fit-content;
    max-height: fit-content;
}

.page-npp2023 {
    color: #666666;
}

.page-npp2023 .countdown {
    padding: 15px 0;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 5px;
    border: 3px solid #96d2da;
    align-items: center;
    justify-content: center;
    width: 71%;
    margin: 0 auto;
    margin-top: 50px;
}

.page-npp2023 .right-countdown {
    color: #808080;
    font-size: 24px;
    line-height: 60px;
    font-weight: 700;
    padding-right: 20px;
}

.page-npp2023 .center-countdown {
    width: 60px;
    padding-right: 10px;
}

.page-npp2023 .hour {
    color: #808080;
    font-weight: 700;
    font-size: 40px;
    line-height: 60px;
}

.page-npp2023 .banner-nav {
    max-height: fit-content;
    min-height: fit-content;
    background-color: #e5b8ff;
    padding: 10px 0;
}

.page-npp2023 .banner-nav ul li a::after {
    content: none;
}

.page-npp2023 .banner-nav ul li {
    border-left: 2px solid #FFFFFF;
    font-size: 20px;
}

.page-npp2023 img {
    height: 100%;
    object-fit: contain;
}

.page-npp2023 .border-right {
    border-right: 2px solid #FFFFFF;
}

.page-npp2023 .support-tweet-i,
.page-npp2023 .buy,
.page-npp2023 .list-sell,
.page-npp2023 .ranking,
.page-npp2023 .personal-design,
.page-npp2023 .way-to-join,
.page-npp2023 .intro {
    padding: 100px 0 50px;
}

.page-npp2023 .buy,
.page-npp2023 .ranking {
    background: #faf2ff;
}
.page-npp2023 .buy .list-buy-product .item-buy-product .txt-link img{
    width: 12px;
    height: 12px;
}
.page-npp2023 .text-open {
    font-size: 36px;
    line-height: 50px;
    color: #ff8fc7;
    padding-bottom: 15px;
}

.page-npp2023 .border-open {
    height: 4px;
    width: 130px;
    background-color: #ff8fc7;
    margin: 0 auto;
}

.page-npp2023 .open-part {
    padding-bottom: 50px;
}

.page-npp2023 .text1-intro {
    font-size: 26px;
    line-height: 38px;
    color: #668dbe;
    padding-bottom: 20px;
}

.page-npp2023 .text2-intro {
    font-size: 20px;
    line-height: 35px;
    padding-bottom: 100px;
}

.page-npp2023 .text2-intro p {
    font-weight: 700;
    padding-top: 13px;
}

.page-npp2023 .img-timeline,
.page-npp2023 .timeline-event {
    position: relative;
}

.page-npp2023 .timeline-event {
    padding-bottom: 50px;
}

.page-npp2023 .time-event {
    font-size: 24px;
    line-height: 27px;
    position: absolute;
    transform: translate(-50%, 50%);
    width: max-content;
}

.page-npp2023 .item-timeline1,
.page-npp2023 .item-timeline2 {
    color: #0071b3;
}

.page-npp2023 .item-timeline3,
.page-npp2023 .item-timeline4 {
    color: #666666;
}

.page-npp2023 .item-timeline1 {
    top: 10%;
    right: 12%;
}

.page-npp2023 .item-timeline2 {
    top: 10%;
    right: -5%;
}

.page-npp2023 .item-timeline3 {
    top: 72%;
    left: 38%;
}

.page-npp2023 .item-timeline4 {
    top: 72%;
    left: 73%;
}

.page-npp2023 .way-to-join {
    background-color: #faf2ff;
}

.page-npp2023 .box-way {
    background-color: #ffffff;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    box-shadow: 8px 8px 15px #d4cdd8;
    padding: 40px;
}

.page-npp2023 .full-ways {
    gap: 60px 45px;
}

.page-npp2023 .name-way {
    font-size: 22px;
    line-height: 30px;
    padding: 25px 0;
    font-weight: 700;
}

.page-npp2023 .content-way {
    font-size: 18px;
    line-height: 28px;
}

.page-npp2023 .note-ways {
    font-size: 16px;
    line-height: 24px;
    padding: 50px 0;
}

.page-npp2023 .box-group {
    width: 100%;
    border: 2px solid #4d4d4d;
    padding: 5px;
    height: 100px;
}

.page-npp2023 .list-idol a {
    width: calc(100%/5 - 15px);
}

.page-npp2023 .list-idol {
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 60px;
}

.page-npp2023 .design-idol {
    background-color: #f7f7f7;
    padding: 40px 30px;
    margin-bottom: 50px;
}

.page-npp2023 .head-design {
    align-items: flex-start;
    justify-content: flex-start;
    gap: 50px;
}

.page-npp2023 .logo-group {
    height: 120px;
    width: 180px;
    padding-bottom: 30px;
}

.page-npp2023 .text-intro-group {
    font-size: 16px;
    line-height: 25px;
}

.page-npp2023 .img-group {
    width: fit-content;
    height: 270px;
}

.page-npp2023 .info-group {
    flex-direction: column;
    align-items: flex-start;
}

.page-npp2023 .full-idol {
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 12px;
    padding-top: 40px;
}

.page-npp2023 .single-idol {
    width: 24%;
}

.page-npp2023 .but-link {
    width: 200px;
    border-radius: 10px;
    padding: 5px;
    text-align: center;
    font-size: 18px;
    line-height: 28px;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-npp2023 .but-tool {
    background: #cb1577;
}

.page-npp2023 .but-twit {
    background: #009ce5;
}

.page-npp2023 .but-twit img {
    width: 25px;
    margin-right: 5px;
}

.page-npp2023 .list-link {
    flex-direction: column;
    align-items: center;
    gap: 5px;
}

.page-npp2023 .name-idol {
    font-size: 20px;
    line-height: 28px;
    font-weight: 700;
    color: #4d4d4d;
    padding: 30px 0;
}

.page-npp2023 .box-note-marquee {
    background-color: #ff8fc7;
    padding: 10px 20px;
    font-size: 18px;
    line-height: 20px;
}

.page-npp2023 .box-note-marquee .note {
    background: transparent;
    color: #ffffff;
}

.page-npp2023 .scroll-table {
    background-color: #ffffff;
}

.page-npp2023 .ranking-table,
.page-npp2023.ranking-table a:link {
    color: #4d4d4d;
}

.page-npp2023 .scroll-table {
    overflow-y: auto;
    height: auto;
    border: 1px solid #e4e4e4;
    max-height: 725px;
}

.page-npp2023 .ranking-table:not(.ranking-table_sp) table tr {
    border-bottom: 1px solid #e4e4e4;
}

.page-npp2023 .ranking-table table thead tr th {
    background-color: #ebebeb;
    padding: 22px 10px;
    font-weight: 500;
    font-size: 20px;
    white-space: nowrap;
    border-right: 2px solid #ffff;
    text-align: center;
}

.page-npp2023 .ranking-table table tr td {
    vertical-align: middle;
    font-weight: 500;
    padding: 10px 7px;
    text-align: center;
}

.page-npp2023 .ranking-table table .number .img {
    width: 51px;
    position: relative;
    margin: 0 auto;
}

.page-npp2023 .ranking-table table .number .img span {
    font-weight: 700;
    left: 50%;
    position: absolute;
    transform: translate(-50%, -50%);
    top: 50%;
    font-size: 27px;
}

.page-npp2023 .ranking-table table .image img {
    width: 93px;
}

.page-npp2023 .ranking-table table tbody .name a {
    width: 150px;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0 auto;
    text-align: center;
}

.page-npp2023 .ranking-table table tbody .name a:first-child {
    margin-bottom: 5px;
}

.page-npp2023 .ranking-table table tbody td.tweet span {
    display: flex;
    align-items: center;
}

.page-npp2023 .ranking-table table tbody td.tweet img {
    margin-right: 15px;
}

.page-npp2023 .ranking-table table .btn a {
    display: block;
    text-align: center;
}

.page-npp2023 .ranking-table table tbody .btn .btn-tweet {
    margin-bottom: 5px;
}

.page-npp2023 .title-tab-ranking {
    text-align: center;
    font-size: 30px;
    color: #ffffff;
    margin: 20px 0;
    background: #29a2d9;
    padding: 20px 0;
    font-weight: 700;
}

.page-npp2023 .status-atjam-before {
    margin: 30px auto 25px;
}

.page-npp2023 .status-atjam-before .tabs-npp {
    justify-content: center;
    margin: 0 -5px;
}

.page-npp2023 .status-atjam-before .tabs-npp li {
    margin: 0 auto;
    width: calc(33.333% - 15px);
}

.page-npp2023 .status-atjam-item.active {
    background-color: #e5b8ff;
    color: #ffffff;
}

.page-npp2023 .status-atjam-before .status-atjam-item .tabs-a-ct,
.page-npp2023 .status-atjam-before .status-atjam-item.active .tabs-a-ct {
    background: none;
    text-align: center;
}

.page-npp2023 .tabs-ct a.active .tabs-a-ct {
    background: #00baff;
    color: #fff;
}

.page-npp2023 .tabs-ct .tabs-a-ct {
    background: #e2e2e2;
    padding: 0.4rem;
    font-size: 12px;
}

.page-npp2023 .status-atjam-item {
    padding: 25px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    background-color: #e1e1e1;
    border-radius: 5px;
    color: #adadad;
    text-align: center;
}

.page-npp2023 .tab_content .scroll-table {
    width: 80%;
    margin: 0 auto;
}

.page-npp2023 .tabs-a-ct  {
    font-size: 30px;
    line-height: 32px;
    font-weight: 700;
}

.page-npp2023 .sell-item {
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 14px;
}

.page-npp2023 .stamp-item {
    width: 24%;
}

.page-npp2023 .img-sell {
    height: 200px;
    margin: 0 auto;
}

.page-npp2023 .text-sell {
    font-size: 18px;
    padding-top: 10px;
    line-height: 28px;
}

.page-npp2023 .txt-infor span {
    font-weight: 500;
}

.page-npp2023 .txt-detail {
    min-height: fit-content;
}

.page-npp2023 .item-buy-product {
    box-shadow: 8px 8px 15px #d4cdd8;
    border: none;
}

.page-npp2023 .intro-newyear {
    border-radius: 20px;
    background-color: #fff6fa;
    padding: 40px;
    width: 80%;
    margin: 0 auto;
}

.page-npp2023 .open-new-year {
    font-size: 30px;
    line-height: 50px;
    color: #ff8fc7;
    padding-bottom: 40px;
}

.page-npp2023 .intro-newyear {
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.page-npp2023 .text-new-year {
    font-size: 22px;
    line-height: 36px;
}

.page-npp2023 .text-new-year span {
    font-weight: 700;
}

.page-npp2023 .line-under {
    text-decoration: underline;
    font-weight: 500 !important;
}

.page-npp2023 .line-under:hover {
    color: #0a0a0a;
}

.page-npp2023 .logo-new-year {
    width: 40%;
    padding-bottom: 30px;
}

.page-npp2023 .content-social-box {
    justify-content: center;
    align-items: center;
}

.page-npp2023 .img-idol {
    height: 250px;
}

.page-npp2023 .content-iket {
    padding-top: 50px;
}

.page-npp2023-sp .countdown {
    flex-direction: column;
    width: 100%;
    padding: 10px 0;
    border: 3px solid #96d2da;
    margin-top: 20px;
}

.page-npp2023-sp .right-countdown {
    font-size: 18px;
    line-height: 30px;
    padding-right: 0;
}

.page-npp2023-sp .center-countdown {
    width: 50px;
    padding-right: 10px;
}

.page-npp2023-sp .hour {
    font-size: 30px;
    line-height: 40px;
}

.page-npp2023-sp .top-banner {
    padding: 30px 0;
}

.page-npp2023-sp .banner-nav ul li {
    width: 48%;
    border: 1px solid #FFFFFF;
    margin: 3px;
    flex-grow: 0;
    height: 100%;
}

.page-npp2023-sp .banner-nav ul li a {
    font-size: 14px;
    line-height: 40px;
    padding: 10px 0;
}

.page-npp2023-sp .text-open {
    font-size: 20px;
    line-height: 30px;
    padding-bottom: 5px;
}

.page-npp2023-sp .border-open {
    height: 2px;
    width: 65px;
}

.page-npp2023-sp .support-tweet-i,
.page-npp2023-sp .buy,
.page-npp2023-sp .list-sell,
.page-npp2023-sp .ranking,
.page-npp2023-sp .personal-design,
.page-npp2023-sp .way-to-join,
.page-npp2023-sp .intro {
    padding: 40px 0;
}

.page-npp2023-sp .open-part {
    padding-bottom: 20px;
}

.page-npp2023 .img-group img {
    width: 340px;
}

.page-npp2023-sp .text1-intro {
    font-size: 16px;
    line-height: 30px;
    padding-bottom: 20px;
}

.page-npp2023-sp .text2-intro {
    font-size: 14px;
    line-height: 20px;
    padding-bottom: 30px;
}

.page-npp2023-sp .time-event {
    font-size: 11px;
    line-height: 15px;
}

.page-npp2023-sp .item-timeline1 {
    top: -4%;
    right: 9%;
}

.page-npp2023-sp .item-timeline2 {
    top: -4%;
    right: -11%;
}

.page-npp2023-sp .item-timeline3 {
    top: 75%;
    left: 29%;
}

.page-npp2023-sp .item-timeline4 {
    top: 75%;
    left: 64%;
}

.page-npp2023-sp .full-ways {
    gap: 20px;
    flex-direction: column;
}

.page-npp2023-sp .box-way {
    padding: 30px 20px;
    width: 90%;
    margin: 0 auto;
}

.page-npp2023-sp .name-way {
    font-size: 16px;
    line-height: 30px;
    padding: 15px 0;
}

.page-npp2023-sp .content-way {
    font-size: 14px;
    line-height: 23px;
}

.page-npp2023-sp .img-way {
    width: 50%;
}

.page-npp2023-sp .note-ways {
    font-size: 12px;
    line-height: 20px;
    padding: 20px 0;
}

.page-npp2023-sp .list-idol {
    flex-wrap: wrap;
}

.page-npp2023-sp .box-group {
    border: 1px solid #4d4d4d;
    padding: 5px;
    height: 100px;
    width: 100%;
}

.page-npp2023-sp .list-idol a {
    width: calc(100%/2 - 5px);
}

.page-npp2023-sp .head-design {
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    flex-direction: column;
    padding: 0 10px;
}

.page-npp2023-sp .img-group {
    width: 100%;
    height: auto;
}

.page-npp2023-sp .logo-group {
    height: auto;
    padding-bottom: 10px;
    width: 35%;
    margin: 0 auto;
}

.page-npp2023-sp .design-idol {
    padding: 20px 5px;
    margin-bottom: 20px;
}

.page-npp2023-sp .text-intro-group {
    font-size: 13px;
    line-height: 20px;
}

.page-npp2023-sp .full-idol {
    gap: 8px;
    padding-top: 10px;
}

.page-npp2023-sp .single-idol {
    width: 31%;
}

.page-npp2023-sp .img-idol {
    height: auto;
}

.page-npp2023-sp .name-idol {
    font-size: 12px;
    line-height: 20px;
    padding: 10px 0;
}

.page-npp2023-sp .but-link {
    width: 100%;
    border-radius: 5px;
    padding: 3px;
    font-size: 10px;
    line-height: 20px;
}

.page-npp2023-sp .but-twit img {
    width: 10px;
    margin-right: 3px;
}

.page-npp2023-sp .ranking-table table .number .img {
    width: 35px;
}

.page-npp2023-sp .ranking-table table .number .img span {
    font-size: 15px;
}

.page-npp2023-sp .ranking-table table {
    table-layout: fixed;
}

.page-npp2023-sp .ranking-table table thead tr th,
.page-npp2023-sp .ranking-table-in table thead tr th {
    text-align: left;
    font-size: 12px;
    line-height: 1.3;
    padding: 8px 10px;
    vertical-align: middle;
    white-space: normal;
}

.page-npp2023-sp .ranking-table table tbody {
    border-bottom: 1px solid #e4e4e4;
}

.page-npp2023-sp .ranking-table table tbody tr td {
    padding: 10px 5px;
    font-size: 12px;
}

.page-npp2023-sp .ranking-table_sp table .number .img {
    width: 40px;
}

.page-npp2023-sp .ranking-table_sp table .image .img,
.page-npp2023-sp .ranking-table-in_sp table .image .img {
    width: 60px;
}

.page-npp2023-sp .ranking-table table .image img {
    width: 93px;
}

.page-npp2023-sp .ranking-table table tbody .name a {
    width: inherit;
}

.page-npp2023-sp .ranking-table table tbody .name a:first-child {
    margin-bottom: 5px;
}

.page-npp2023-sp .ranking-table_sp table tr td a,
.page-npp2023-sp .ranking-table_sp table tr td span {
    font-size: 12px;
}

.page-npp2023-sp .ranking-table table tbody td.tweet img {
    margin-right: 6px;
}

.page-npp2023-sp .ranking-table table .btn a {
    background: transparent;
    width: 100%;
    padding: 0;
    margin-top: 0;
    text-align: left !important;
    display: block;
    margin-bottom: 0 !important;
}

.page-npp2023-sp .tabs-a-ct {
    font-size: 17px;
    line-height: 25px;
}

.page-npp2023-sp .status-atjam-item {
    padding: 10px;
}

.page-npp2023-sp .tab_content .scroll-table {
    width: 100%;
}

.page-npp2023-sp .tab_content {
    padding: 0;
}

.page-npp2023-sp .ranking-table:not(.ranking-table_sp) table tr {
    border-bottom: 0;
}

.page-npp2023-sp .stamp-item {
    width: 31%;
}

.page-npp2023-sp .sell-item {
    gap: 10px;
}

.page-npp2023-sp .img-sell {
    height: auto;
}

.page-npp2023-sp .text-sell {
    font-size: 11px;
    line-height: 20px;
}

.page-npp2023-sp .content-iket {
    padding-top: 0;
}

.page-npp2023-sp .txt-infor {
    padding: 10px 5px;
    font-size: 12px;
}

.page-npp2023-sp .txt-link {
    font-size: 12px;
}

.page-npp2023-sp .txt-red {
    font-size: 10px;
}

.page-npp2023-sp .intro-newyear {
    border-radius: 10px;
    padding: 10px 5px;
    width: 100%;
    margin-bottom: 50px;
}

.page-npp2023-sp .open-new-year {
    font-size: 17px;
    line-height: 35px;
    padding-bottom: 20px;
    font-weight: 700;
}

.page-npp2023-sp .logo-new-year {
    width: 70%;
    padding-bottom: 15px;
}

.page-npp2023-sp .text-new-year {
    font-size: 14px;
    line-height: 26px;
}

.page-npp2023-sp .text-new-year span {
    font-weight: 700;
}

.page-npp2023-sp .item-sb {
    width: 100%;
}

.page-npp2023-sp .timeline-event {
    padding-bottom: 0;
}

.page-npp2023-sp .box-note-marquee {
    padding: 5px 10px;
    font-size: 14px;
    line-height: 10px;
}

.page-npp2023-sp .txt-detail {
    font-size: 14px;
}
.top-banner{
    min-height: 532px;
}
.top-banner .content-banner{
    min-height: 354px;
}
.top-banner .countdown{
    min-height: 97px;
}
@media screen and (max-width: 991px) {
    .page-npp2023-sp .banner-nav ul li{
        min-height: 39px;
    }
}

.page-npp2023 .countdown-event {
    align-items: center;
    justify-content: center;
    background-color: #ececec;
    border-radius: 5px;
    padding: 20px;
    gap: 50px;
    width: 925px;
    margin: 15px auto;
}

.page-npp2023 .text-final {
    font-size: 20px;
    line-height: 36px;
}

.page-npp2023 .countdown-final {
    padding: 25px 50px;
    background-color: #212121;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.page-npp2023 .countdown-final .title-countdown {
    font-size: 20px;
    color: #ff0000;
    line-height: 36px;
}

.page-npp2023 .countdown-final .hour {
    font-weight: 700;
    line-height: 36px;
    font-size: 40px;
    color: #ffffff;
}

.page-npp2023-sp .countdown-event {
    flex-direction: column;
    gap: 15px;
    padding: 10px;
    width: 100%;
    margin: 5px 0;
}

.page-npp2023-sp .text-final {
    font-size: 14px;
    line-height: 25px;
    font-weight: 700;
}

.page-npp2023-sp .countdown-final {
    padding: 15px 30px;
    width: 100%;
}

.page-npp2023-sp .countdown-final .title-countdown {
    font-size: 16px;
}

.page-npp2023-sp .countdown-final .hour {
    font-size: 32px;
}

.d-none {
    display: none;
}