a {
    color: #000;
    text-decoration: none;
}

a.inv {
    opacity: 0.25;
}

.pc {
    display: block;
}

.sp {
    display: none;
}

@media screen and (max-width: 768px) {
    .pc {
        display: none;
    }

    .sp {
        display: block;
    }
}


.ahov {
    transition: background-color .25s ease;
}

.ahov:hover {
    background-color: #eee;
}

/*----------------------------*/
/* ショップ情報 */
/*----------------------------*/

.detail {
    display: flex;
    flex-direction: column;
    margin: 0 auto;
    max-width: 1020px;
    /* padding: calc(2rem + 44px) 0 6rem; */
    padding: 2rem 0;
    gap: 3rem;
}

@media screen and (max-width: 1080px) {
    .detail {
        padding: calc(2rem + 44px) 2rem 6rem;
    }
}

.shop-detail {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.shop-name div {
    font-size: 20px;
    font-weight: bold;
}

.shop-name p {
    font-size: 14px;
}

.shop-detail-inner {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 1.5rem
}


.shop-info {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.shop-info .shop-image {
    width: 210px;
}

.shop-image img {
    /* width: 100%; */
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    /* object-fit: contain; */
    object-position: center;
    display: block;
}

/* 販売店情報のメイン画像は縦横比 4:3 に固定し、中央起点で object-fit（x:cover　⇒ o:contain）。
   販売店管理画面でアップロードされた画像の比率がまちまちでもレイアウトを揃える。
   店舗詳細ページ・在庫一覧ページ（同じヘッダを共有）の両方に適用される。 →2026-09-03変更*/
.shop-info .shop-image img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    /* object-fit: contain; */
    object-position: center;
    display: block;
}

.shop-data .quantity {
    font-size: 12px;
}

.shop-data .data-detail {
    font-size: 16px;
}

.shop-data .data-detail p {
    display:flex;
    align-items: baseline;
}

.shop-data .quantity span:nth-child(2) {
    font-size: 20px;
    font-weight: bold;
    margin-left: 1rem;
    margin-right: .25rem;
}

.shop-data .data-detail span:nth-child(1) {
    display: inline-block;
    font-size: 12px;
    margin-right: 1rem;
    min-width:4em;
}
.shop-data .data-detail span:nth-child(2) {
    font-size: 14px;
}

/* 会社情報 */

.shop-company {
    display: flex;
    gap: .75rem;
    align-items: center;
    padding: 1rem;
    border: 1px solid #ccc;
    border-radius: 4px;
    width: 437px;
}

.company-logo {
    width: 80px;
}

/* 法人ロゴは切り取らず全体表示（object-fit: contain）。店舗画像は全カテゴリ contain、
   法人ロゴのみ別枠（対象外）というクライアント指定（2026-07-18 更新）。縦長ロゴでカードが伸びないよう高さを抑える。 */
.company-logo img {
    width: 100%;
    max-height: 80px;
    object-fit: contain;
    object-position: center;
    display: block;
}

.company-data {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.company-data p {
    font-size: 12px;
}

.company-data span {
    display: inline-block;
    width: 3em;
    margin-right: 1rem;
}

.company-web {
    display: flex;
    justify-content: center;
    font-size: 14px;
    line-height: 1;
    padding: 8px 0;
    border: 1px solid #ccc;
    border-radius: 2px;
    width: 13em;
    opacity: 100%;
    background-color: #fff;
}


/* グーグルマップ */

.googlemap {
    border: 1px solid #ccc;
    border-radius: 4px;
    overflow: hidden;
}

.googlemap iframe {
    width: 100%;
    height: 200px;
    vertical-align: bottom;
}

/* クーポン */

.coupon {
    padding: 1rem;
    border: 1px solid #ccc;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.coupon-image {
    width: 180px;
}

/* クーポン画像もメイン画像と同じ扱い（4:3・object-fit: contain✖）。クライアント指定（2026-07-18）。 */
.coupon-image img {
    width: 100%;
    aspect-ratio: 4 / 3;
    /* object-fit: contain; */
    object-fit: cover;
    object-position: center;
    display: block;
}

.coupon-data {
    display: flex;
    gap: 1rem;
    /* align-items: center; */
}

.coupon-data:not(:last-child) {
    padding-bottom: 1rem;
    border-bottom: 1px dashed #ccc;
}

.coupon-text {
    flex: 1;
}

.coupon-text span {
    display: inline-block;
    width: 4em;
}

.coupon-text div {
    font-weight: bold;
}

.coupon-text p {
    font-size: 12px;
    display: flex;
    gap: 0.75rem;
}

.coupon-note {
    font-size: 12px;
    /* width: 320px; */
    display: flex;
    gap: .5rem;
    flex-direction: column;
    flex: 1;
}

.coupon-note ul {
    list-style: none;
    padding-left: 0;
    font-weight: 600;
}

.coupon-note p {
    display: flex;
    gap: 0.75rem;
    margin: 0;
    overflow-wrap: anywhere;
    font-weight: 600;
}

.coupon-note p > span:first-child {
    flex: 0 0 4em;
    font-weight: 400;
}

.coupon-note .coupon-conditions {
    flex: 1;
    min-width: 0;
}

.coupon-note .coupon-conditions > span {
    display: block;
}


@media screen and (max-width: 768px) {
    .detail {
        padding: calc(2rem + 44px) 1.25rem 2rem;
        gap: 1.5rem;
    }

    .shop-detail-inner {
        align-items: flex-start;
        flex-direction: column;
    }

    .shop-info {
        flex-direction: column;
        width: 100%;
        gap: 1.5rem;
    }

    .shop-info .shop-image {
        width: 100%;
    }

    .shop-data {
        width: 100%;
    }

    .shop-company {
        width: 100%;
        padding: unset;
        border: 0;
        align-items: flex-start;
    }

    .company-logo {
        width: 40px;
    }

    .company-web {
        margin-top: .25rem;
    }

    .coupon-data {
        flex-direction: column;
    }

    .coupon-text {
        display: flex;
        flex-direction: column;
        gap: 0.25rem;
    }

    .coupon-note {
        gap: .25rem;
    }

    .coupon-image {
        width: 100%;
    }

    .coupon-image {
        order: 2;
    }

    .coupon-text {
        order: 1;
    }

    .coupon-note {
        order: 3;
        width: 100%;
    }
}

/*----------------------------*/
/* ショップコンテンツ */
/*----------------------------*/

.shop-contents-tab {
    background-color: #eee;
    position: relative;
}

.shop-contents-tab ul {
    display: flex;
    margin: 0 auto;
    max-width: 1020px;
    padding: 1rem 0 0;
    gap: 0.5rem;
    list-style: none;
    justify-content: space-between;
}

.shop-contents-tab li {
    background-color: #ddd;
    height: 40px;
    align-content: center;
    text-align: center;
    min-width: 145px;
    border-radius: 4px 4px 0 0;
    font-size: 14px;
    padding: 0 .5rem;
    cursor: pointer;
    transition: background-color .25s ease, color .25s ease;
    width: 100%;
}

.shop-contents-tab li:not(.active):hover {
    background-color: #fff;
}

.shop-contents-tab li.active {
    font-weight: bold;
    background-color: #f6f6f6;
    color: #131B3C;
}

.shop-contents-inner {
    background-color: #f6f6f6;
}

.shop-contents-inner>div {
    display: none;
    flex-direction: column;
    margin: 0 auto;
    max-width: 1020px;
    /* padding: 6rem 0; */
    padding: 2rem 0 6rem;
    gap: 3rem;
}

.shop-contents-inner>div.active {
    display: flex;
}

.stock-car,
.shop-notice,
.shop-about,
.review,
.series-list,
.googlemap-section,
.coupon-section {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.stock-car h3,
.shop-notice h3,
.shop-about h3,
.review h3,
.series-list h3 {
    font-size: 20px;
    font-weight: bold;
}

.shop-content-label {
    display: flex;
    flex-wrap: wrap;
    column-gap: 1rem;
    row-gap: .5rem;
    justify-content: space-between;
    align-items: center;
}

@media screen and (max-width: 768px) {
    .shop-contents-tab {
        padding-left: 1.25rem;
        padding-right: 1.25rem;
    }

    .shop-contents-tab ul {
        padding: 1rem 0;
        justify-content: unset;
        overflow: hidden;
        overflow-x: scroll;
    }

    .shop-contents-tab li {
        border-radius: 4px;
    }
}

/* このお店の在庫 */
.stock-car-link {
    display: flex;
    justify-content: end;
}

.stock-car-link a {
    display: flex;
    gap: .125rem;
    align-items: center;
}

.stock-car-link a:hover {
    text-decoration: underline;
}

.stock-car-link img {
    width: 16px;
    height: 16px;
}

/* お店からのお知らせ */
.shop-notice-text {
    font-size: 14px;
    line-height: 160%;
}

/* このお店について */
.shop-about-column {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    font-size: 14px;
}

/* Dealer image sections follow the API's 1/2/3-slot layout independently. */
.shop-image-section { min-width: 0; }
.shop-image-section-title { font-size: 16px; margin: 0 0 12px; }
.shop-image-section-period { color: #EA5413; margin: 0 0 12px; }
.shop-image-slots { display: grid; gap: 16px; }
.shop-image-section--2 .shop-image-slots { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.shop-image-section--3 .shop-image-slots { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.shop-image-slot { min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.shop-image-section--1 .shop-image-slot { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.shop-image-slot .shop-about-image { width: 100%; min-width: 0; }
.shop-image-slot .shop-about-text { min-width: 0; overflow-wrap: anywhere; }
@media screen and (min-width: 769px) {
    /* One-slot headings sit above the text beside the image, as before. */
    .shop-image-section--side-title {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: auto auto 1fr;
        column-gap: 16px;
    }
    .shop-image-section--side-title .shop-image-slots,
    .shop-image-section--side-title .shop-image-slot { display: contents; }
    .shop-image-section--side-title .shop-about-image { grid-column: 1; grid-row: 1 / 4; align-self: start; }
    .shop-image-section--side-title .shop-image-section-title { grid-column: 2; grid-row: 1; margin-bottom: 8px; }
    .shop-image-section--side-title .shop-image-section-period { grid-column: 2; grid-row: 2; }
    .shop-image-section--side-title .shop-about-text { grid-column: 2; grid-row: 3; }
}
@media screen and (max-width: 768px) {
    .shop-image-section .shop-image-slots,
    .shop-image-section--1 .shop-image-slot { grid-template-columns: minmax(0, 1fr); }
}

.column-a {
    display: flex;
    gap: 1rem;
}

.column-a .shop-about-image {
    /* width: 360px; */
    width: calc(50% - 12px);
}

.column-a .shop-about-text {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.column-a .shop-about-text h4 {
    font-size: 16px;
}

.shop-about-text p.limit-time {
    color: #EA5413;
}

/* フェア・イベントは「お店トップ」と同じく、先頭を大きく、以降を3列で表示する。 */
.event-card-list {
    flex-wrap: wrap;
}

.event-card-list > .event-card {
    flex: 0 0 calc((100% - 3rem) / 3);
    min-width: 0;
}

.event-card .shop-about-text {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.event-card .shop-about-text h4 {
    font-size: 16px;
}

.column-b {
    display: flex;
    gap: 1.5rem;
}

.column-b>div {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.column-b .shop-about-text {
    width: 100%;
}

.column-b .shop-about-image {
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
}

/* 店舗画像は全カテゴリ（このお店について・スタッフ紹介・保証・整備・買取・
   フェア/イベント・アフターサービス）でメイン画像と同じ扱い：4:3 に固定し
   切り取らず全体表示（object-fit: contain）。※法人ロゴ（.company-logo）は対象外。
   クライアント指定（2026-07-18）。 →　2026-09-03変更あり */
.shop-about-image img {
    width: 100%;
    aspect-ratio: 4 / 3;
    /* object-fit: contain; */
    object-fit: cover;
    object-position: center;
    display: block;
}

.stock-car-list {
    display: flex;
    gap: 1.5rem;
}

.stock-car-card {
    display: block;
    flex: 0 0 calc((100% - 4.5rem) / 4);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 4px #0003;
    transform: translateY(0);
    transition: box-shadow .25s ease, transform .25s ease;
}

.stock-car-card:hover {
    transform: translateY(-0.25rem);
    box-shadow: 0 8px 8px #0003;
}

.stock-car-card img {
    width: 100%;
}

.stock-car-card>div {
    display: flex;
    flex-direction: column;
    padding: 1rem;
    gap: .25rem;
    background-color: #fff;
}

.stock-car-card .maker {
    font-size: 12px;
    display: flex;
    align-items: center;
}

.stock-car-card .maker.new::before {
    content: "NEW";
    display: inline-block;
    background-color: #FFF600;
    color: #131B3C;
    font-size: 10px;
    line-height: 1;
    padding: .125rem .25rem;
    border-radius: 2px;
    margin-right: .25rem;

}

.stock-car-card .model {
    font-size: 14px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    margin-bottom: 8px;
}

.stock-car-card .price {
    font-size: 12px;
    display: flex;
    gap: .25rem;
    justify-content: space-between;
}

.stock-car-card .price span {
    font-size: 1rem;
    font-weight: bold;
    display: inline-block;
    margin-right: .25rem;
}

.stock-car-card .price-total {
    font-size: 12px;
    display: flex;
    gap: .125rem;
    justify-content: space-between;
}

.stock-car-card .price-total span {
    font-size: 1rem;
    font-weight: bold;
    color: #ea1313;
    display: inline-block;
    margin-right: .25rem;
}

/* お店のクチコミ情報 */
.please-review {
    display: flex;
    gap: .75rem;
    font-size: 14px;
    align-items: center;
}

.please-review a {
    display: block;
    padding: 0 12px;
    height: 32px;
    background-color: #fff;
    border-radius: .25rem;
    align-content: center;
    border: 1px solid #ccc;
}

.please-review>a span {
    display: none;
}

.review-list {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    padding-top: 2rem;
    border-top: 1px solid #ccc;
}

.review-card {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid #ccc;
}

.review-header {
    display: flex;
    justify-content: space-between;
}

.review-header h4 {
    font-size: 20px
}

.review-header .review-date {
    font-size: 14px
}

.score {
    display: flex;
    gap: .5rem;
}

.total-score {
    display: flex;
    gap: .5rem;
}

.total-score div:nth-child(1) {
    font-size: 12px;
}

.total-score span {
    font-size: 16px;
    font-weight: bold;
    margin-left: 0.25rem;
    color: #ea5413;
}

.total-score div:nth-child(2) {
    color: #ea5413;
}

.scores {
    display: flex;
    gap: .5rem;
    font-size: 12px;
}

.scores div:not(:last-child) {
    padding-right: .5rem;
    border-right: 1px solid #ccc;
}

.scores span {
    font-size: 16px;
    font-weight: bold;
    margin-left: 0.25rem;
}

.review-comment {
    font-size: 14px
}

.review-author {
    text-align: right;
    font-size: 14px
}

/* 掲載件数 */
.shop-list-header {
    display: flex;
    flex-wrap: wrap;
    column-gap: 2rem;
    row-gap: 1rem;
    justify-content: space-between;
    align-items: baseline;
}

.shop-count {
    display: flex;
    gap: 0.75rem;
    align-items: baseline;
    font-weight: bold;
    line-height: 1;
}

.shop-count .count-all {
    display: flex;
    gap: 0.25rem;
    align-items: baseline;
}

.shop-count .count-all span {
    font-size: 36px;
}


/* ページネーション */
.pagination {
    display: flex;
    gap: 0.75rem;
    font-size: 14px;
    align-items: center;
    line-height: 1;
}

.pagination div {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.pagination div a.active {
    padding: 6px;
    border-radius: 4px;
    background-color: #131B3C;
    color: #fff;
}

/* お店の口コミフッター */
.shop-list-footer {
    margin: 0 auto;
}

/* グループ店舗一覧 */
.series-card {
    display: grid;
    grid-template-columns: 1fr 1.75fr;
    grid-template-rows: auto auto 1fr;
    grid-column-gap: 24px;
    grid-row-gap: 8px;
}

.div1.shop-image {
    grid-area: 1 / 1 / 4 / 2;
}

.div1.shop-image img {
    width: 100%;
}

.div2.shop-name {
    grid-area: 1 / 2 / 2 / 3;
    font-size:18px;
    font-weight: bold;
}

.div3.data-detail {
    grid-area: 2 / 2 / 3 / 3;
}

.div3.data-detail p {
    display:flex;
}

.div3.data-detail span:nth-child(1) {
    display: inline-block;
    min-width: 4em;
    font-size: 12px;
    margin-right: 1rem;
}

.div3.data-detail span:nth-child(2) {

}

.div4 {
    grid-area: 3 / 2 / 4 / 3;
}

.shop-link-btn {
    padding: 0 16px;
    height: 40px;
    display: block;
    width: fit-content;
    align-content: center;
    border-radius: 4px;
    background-color: #131B3C;
    color: #fff;
    transition: background-color .25s ease;
}

.shop-link-btn:hover {
    background-color: #131B3C;
}

@media screen and (max-width: 768px) {
    .series-card {
        grid-template-rows: auto auto auto;
        grid-template-columns: 112px minmax(0, 1fr);
        grid-column-gap: 1rem;
        grid-row-gap: 1rem;
    }

    .div1.shop-image {
        grid-area: 2 / 1 / 3 / 2;
    }

    .div2.shop-name {
        grid-area: 1 / 1 / 2 / 3;
    }

    .div3.data-detail {
        grid-area: 2 / 2 / 3 / 3;
        font-size: 12px;
        min-width: 0;
    }
    .series-card .data-detail span:nth-child(2) {
        min-width: 0;
        overflow-wrap: anywhere;
    }
    .div3.data-detail span:nth-child(1) {
        margin-right: .5rem;
    }
    .div4 {
        grid-area: 3 / 1 / 4 / 3;
    }

    .div5 {
        grid-area: 2 / 2 / 3 / 3;
    }
    .shop-link-btn {
        width: 100%;
        text-align: center;
        font-size:14px;
    }
    
}

@media screen and (max-width: 768px) {
    .shop-contents-inner>div {
        padding: 2.5rem 1.25rem 5rem;
        gap: 2.5rem;
    }

    .stock-car h3,
    .shop-notice h3,
    .shop-about h3,
    .review h3,
    .series-list h3 {
        font-size: 20px;
        font-weight: bold;
    }

    .stock-car-list {
        overflow-y: scroll;
        padding: .25rem .5rem 1.5rem;
    }

    .stock-car-card {
        min-width: 200px;
    }

    .review-header {
        flex-direction: column;
        gap: .5rem;
    }

    .score {
        flex-direction: column;
    }

    .total-score {
        align-items: baseline;
    }

    .total-score div:nth-child(2) {
        font-size: 20px;
        line-height: 1;
    }

    .scores div {
        text-align: center;
    }

    .please-review>span {
        display: none;
    }

    .please-review>a span {
        display: inline;
    }

    .shop-list-header {
        align-items: end;
    }

    .shop-count {
        flex-direction: column;
        gap: 0.5rem;
    }

    .review-header h4 {
        font-size: 16px;
    }
}

/*----------------------------*/
/* CTN車販売について */
/*----------------------------*/
.about-section {
    background-color: #131B3C;
    position: relative;
}

.about__content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 32px;
    width: 100%;
}

.about__image {
    border-radius: 50%;
    background-color: #fff;
    height: 260px;
    width: 260px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.about__image img {
    width: 180px;
    height: 168px;
}

.about__text {
    width: 60%;
    color: #fff;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.about__text h3 {
    font-size: 20px;
    font-weight: 700;
    line-height: 160%;
}

.about__text p {
    font-size: 14px;
    font-weight: 400;
    line-height: 160%;
}

.pagetop {
    position: absolute;
    top: 0;
    transform: translateY(-100%);
    width: 100%;
    left: unset !important;
}

@media screen and (max-width: 768px) {
    .pagetop {
        padding: 0 1.25rem;
    }
}

.pagetop a {
    scroll-behavior: smooth;
    background-color: #131B3C;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 1.5rem;
    height: 2.5rem;
    border-radius: 6px 6px 0 0;
    color: #fff;
    gap: .5rem;
    font-size: 12px;
    width: fit-content;
    margin: 0 0 0 auto;
}

.inner_pt2 {
    margin: 0 auto;
    max-width: 1020px;
    position: relative;
}

.inner_pt2-inner {
    max-width: 800px;
    margin: 0 auto;
    padding: 6rem 2rem;
}


@media screen and (max-width: 768px) {
    .about__content {
        flex-direction: column;
    }

    .about__text {
        width: unset;
    }

    .about__text h3 {
        font-size: 18px;
        font-weight: 700;
        line-height: 160%;
        text-align: center;
    }

    .about__text p {
        font-size: 12px;
    }

    .column-a {
        flex-direction: column;
    }

    .column-a .shop-about-image {
        width: 100%;
    }

    .column-b {
        flex-direction: column;
    }

    .column-b>div {
        flex-direction: unset;
    }

    .column-b .shop-about-image {
        width: 120px;
    }

    .column-b .shop-about-text {
        flex: 1;
    }

    .event-card-list > .event-card {
        flex: 0 0 100%;
    }
}

.arrow {
    position: absolute;
    display: none;
    width: 7.6px;
    height: 13.5px;
    top: 50%;
    transform: translateY(-50%);
}

.arrow::before,
.arrow::after {
    content: "";
    position: absolute;
    top: calc(50% - 1px);
    width: 10px;
    height: 2px;
    border-radius: 9999px;
    background-color: #000000;
}

.arrow.right::before,
.arrow.right::after {
    right: 0;
    transform-origin: calc(100% - 1px) 50%;
}

.arrow.left::before,
.arrow.left::after {
    left: 0;
    transform-origin: 1px 50%;
}

.arrow::before {
    transform: rotate(45.8deg);
}

.arrow::after {
    transform: rotate(-45.8deg);
}

.arrow.right {
    right: 6px;
}

.arrow.left {
    left: 6px;
}

@media screen and (max-width: 768px) {
    .arrow {
        display: inline-block;
    }
}

/* グループ店舗一覧: 並べ替えセレクト＋ページネーション（クライアント側・20件/ページ） */
.series-list .shop-list-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
}
.series-list .series-sort {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
}
.series-list .series-sort select {
    padding: 4px 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 13px;
    background: #fff;
}
/* グループ店舗ページャ: 在庫一覧（.pagination-all）と同一の見た目に統一。上下2箇所に設置。 */
.series-pager {
    padding: 0 0 10px;
}
.series-pager:empty {
    display: none;
}
.series-pager .pagination {
    display: block;
    text-align: right;
    font-size: 12px;
    line-height: 1;
}
.series-pager .pagination a,
.series-pager .pagination span {
    display: inline-block;
    margin: 0 2px;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    color: #fff;
}
.series-pager .pagination a {
    background-color: #cacaca;
    cursor: pointer;
}
.series-pager .pagination a:hover {
    opacity: .85;
}
.series-pager .pagination span {
    background-color: #cacaca;
}
.series-pager .pagination span.current {
    background-color: #131B3C;
}
@media screen and (max-width: 768px) {
    .series-pager {
        padding: 0 20px 10px;
    }
}