/* Variables */
:root {
    --primary-color: #00547D;
    --text-color: #333;
    --white: #fff;
}

/* Typography */
.main-title {
    color: #00547D;
    text-align: center;
    font-family: "Open Sans", sans-serif;
    font-size: 3.75rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.subtitle {
    color: #011018;
    text-align: center;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

/* Layout */
.second-wrapper {
    max-width: 1440px;
    margin: 0 auto;
    padding: 17rem 10vw 6.37rem;
}

#clientPage-works.works-section.second-wrapper {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0rem 10vw 6.37rem;
}

#clientPage-works #case-studies-sp {
    display: none;
}
@media screen and (max-width:768px) {
/* Typography */
.main-title {
    color: #00547D;
    text-align: center;
    font-family: "Open Sans", sans-serif;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
font-size: 2rem;
}

.subtitle {
    color: #011018;
    text-align: center;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
}

/* セミナー＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.seminar-container {
    /* padding: 0 21vw; */
    margin: 0 auto;
}

@media screen and (max-width:1200px) {
    /* .seminar-container {
        padding: 0 10vw;
    } */
.second-wrapper {
    max-width: 1440px;
    margin: 0 auto;
    padding: 15rem 10vw 2rem;
}
}

@media screen and (max-width:768px) {
    .second-wrapper {
        padding: 10rem 1.25rem 3.1rem;
    }

    #clientPage-works .case-studies.client-worksPc {
        display: none;
    }

    #clientPage-works #case-studies-sp {
        display: block;
    }
    .subtitle {
        font-size: 0.87rem;
    }
}
.search-container {
    margin-top: 3.56rem;
}





/* ページネーション＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.pagination-ellipsis {
    padding: 0.5rem;
    color: #666;
}
.page-numbers {
    color: #00547D;
    text-align: center;
    font-family: "Noto Sans JP";
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 500;
}

.pagination {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    align-items: center;
    margin-bottom: 8.77rem;
}

.next,
.prev,
.page-numbers {
    /* padding: .6rem 1.2rem; */
    border: 1px solid transparent;
    background-color: white;
    /* border-radius: 100px; */
    cursor: pointer;
    transition: all 0.2s ease;
    width: 3.5rem;      /* 幅固定（2桁でも収まる） */
    height: 3.5rem;     /* 高さ固定で正円 */
    line-height: 3.5rem; /* テキスト中央揃え（上下） */
    text-align: center;  /* 左右中央揃え */
    border-radius: 50%;  /* 丸くする */
    padding: 0;          /* padding無効化して崩れ防止 */
}
.next,
.prev {
    width: 3.5rem;
    height: 3.5rem;
    color: #00547D;
    border-color: #00547D;
    border-radius: 50%;
    position: relative;
}

.next::after {
    position: absolute;
    content: "→";
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.prev::after {
    position: absolute;
    content: "←";
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.page-nav[disabled] {
    opacity: .5;
    cursor: not-allowed;
}
@media (hover: hover) and (pointer: fine) {

.page-nav:hover:not([disabled]),
.page-number:hover:not([disabled]) 
    {
    background-color: #fff;
    color: white;
}
}
.page-numbers.current,
.page-numbers:hover {
    background-color: #00547D;
    color: white;
    border-color: #00547D;
}

.page-numbers.dots {
    pointer-events: none;
}

@media screen and (max-width:768px) {
    .page-numbers{
        font-family: Noto Sans JP;
        font-size: 1rem;
        padding: .45rem 0.85rem;
        line-height: 2.5rem;
    }

.page-numbers.dots {
    pointer-events: none;
    width: 0.5rem;
    font-size: 0.7rem;
}



.next,
.prev {
    width: 2.5rem;
    height: 2.5rem;
    color: #00547D;
    border-radius: 50%;
    position: relative;
    border: 1px solid #00547D !important;
}


.page-numbers {
    /* padding: .6rem 1.2rem; */
    border: 1px solid transparent;
    background-color: white;
    /* border-radius: 100px; */
    cursor: pointer;
    transition: all 0.2s ease;
    width: 2.5rem;      /* 幅固定（2桁でも収まる） */
    height: 2.5rem;     /* 高さ固定で正円 */
    line-height: 2.5rem; /* テキスト中央揃え（上下） */
    text-align: center;  /* 左右中央揃え */
    border-radius: 50%;  /* 丸くする */
    padding: 0;          /* padding無効化して崩れ防止 */
}
.next::after,
.prev::after {
    top: 48%;
}
}