@charset "UTF-8";

/*
 * 【正ソース】ビルドで assets/css/2025/style.css に出力する想定。
 * 同日作業のうちこのファイルに含めるもの:
 *   - .card_work li を PC 3列（951px以上）、950px以下で 2列へ。
 *   - トップ一覧の名前: body.home … .card_work h3 の flex + ::before/::after（SVG data URI）+ h3 a の 28px 太字。
 * 別ファイル・PHP のみの作業（このファイルをビルドしても増えない）:
 *   - フローモーダル: assets/css/flow-modal.css + template-parts/flow-modal.php + flow-modal.js + theme-setup enqueue
 *   - トップログイン案内ボックス: assets/css/works-login-notice.css + index.php + theme-setup enqueue
 *   - inc/asset-loader.php（親テーマ URI で CSS 読込）
 *   - 一覧「この学生にオファーする」非表示: index.php / ajax-handlers.php（トップのみ）
 *   - 見出し文言・その他 PHP: index.php / header.php など
 */

/* ↓PC（横幅640px超）の場合 */
html {
    /* 1rem = 1pxと定義 */
    font-size: 1px;
}

/* ↓スマホ（横幅640px以上）の場合 */


@media screen and (max-width: 640px) {
    html {
        /* 1rem = 1.5pxと再定義 */
        font-size: .80px;
    }

}

body {
    font-size: 16rem;
    color: #000;
    font-family: 'Noto Sans JP', sans-serif;
    min-width: 375px;
    position: relative;
    margin: 0 auto;
}

.en {
    font-family: 'Poppins', sans-serif;
}



/*fv
================================================*/

#fv {
    margin-bottom: calc(100px + 8em);
    position: relative;
}

#fv::before {
    content: "";
    display: block;
    width: 100%;
    padding-top: 102%;
    background: url(../../images/2025/bg_fv.png) center center no-repeat;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
}

#fv_inner {
    position: relative;
    z-index: 10;
    max-width: calc(752px + 10%);
    padding: 0 5%;
    margin: 0 auto;
}


#fv h1 {
    padding-top: 10em;
    font-size: 16rem;
    margin: 0 0 -15%;
}

#fv h1 img {
    width: 100%;
    height: auto;
}

#date_fv {
    font-size: 55rem;
    font-weight: 900;
    font-style: italic;
    text-align: center;
    vertical-align: middle;
    color: #0C4AAE;
    margin: 0 0 1.3em;
}

#date_fv span {
    font-size: 18rem;
}

#date_fv i img {
    vertical-align: middle;
    padding: 0 .25em;
}


@media screen and (max-width:500px) {
    #date_fv {
        font-size: 41.25px;
    }

    #date_fv span {
        font-size: 13.5px;
    }
}

#txt_fv h2 {
    color: #0C4AAE;
    font-size: 34rem;
    font-weight: 900;
    text-align: center;
    margin: 0 0 .7em;
}

#txt_fv h2 span {
    display: inline-block;
    margin: 0 0 .25em;
    line-height: 1.5;
}

#txt_fv p {
    font-weight: 500;
    text-align: center;
    color: #353535;
    line-height: 1.5;
    font-size: 18rem;
}



@media screen and (max-width:500px) {
    #txt_fv h2 {
        font-size: 24px;
    }

    #txt_fv p {
        font-size: 16px;
    }

    #fv::before {
        padding-top: 255%;
        background: url(../../images/2025/bg_fv_s.png) center center no-repeat;
        background-size: cover;

    }
}

@media screen and (max-width:470px) {
    #txt_fv h2 {
        font-size: 24px;
    }

    #fv {
        margin-bottom: 118px;
    }

}

/*studentsworks
================================================*/

.bg_works_01 {
    width: 100%;
    padding-top: 48%;
    background: url(../../images/2025/bg_works.png) center center no-repeat;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(-67%);
}



.bg_works_03 {
    width: 15.34%;
    padding-top: 30%;
    background: url(../../images/2025/bg_works_03.png) center center no-repeat;
    background-size: cover;
    position: absolute;
    bottom: 0;
    left: 0;
    transform: translateY(73%);
    z-index: 1;
}

.bg_works_04 {
    width: 10.44%;
    padding-top: 49%;
    background: url(../../images/2025/bg_works_04.png) center center no-repeat;
    background-size: cover;
    position: absolute;
    bottom: 0;
    right: 0;
    transform: translateY(35%);
    z-index: 1;
}


#studentsworks {
    background: #0AAB93;
    position: relative;
    z-index: 21;
    /* #flow の margin-bottom が #contact まで相殺され白隙間になるのを防ぐ */
    display: flow-root;
}


#studentsworks::before {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    padding: 5%;
    background: url(../../images/2025/bg_t.png) center center no-repeat;
    background-size: cover;
    top: 0;
    transform: translateY(-99.5%);
}

/*
#studentsworks::after {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    padding: 5%;
    background: url(../../images/2025/bg_b.png) center center no-repeat;
    background-size: cover;
    bottom: 0;
    transform: translateY(99.5%);
}
*/
.studentsworks_inner {
    max-width: calc(1160px + 10%);
    margin: 0 auto 0;
    padding: 0 5%;
    position: relative;
    z-index: 5;
}

#archive2023 .inner {
    max-width: calc(752px + 10%);
    padding: 0 5%;
    margin: 0 auto 110px;
}

#studentsworks h2,
#contact h2,
#archive2023 h2,
#contactform h2 {
    margin: 0 0 5em;
}

#studentsworks h2 span,
#contact h2 span,
#archive2023 h2 span,
#contactform h2 span {
    display: block;
    text-align: center;
    font-weight: 900;
    color: #fff;
    line-height: 1;
    position: relative;
}

#archive2023 h2 span {
    color: #0C4AAE;
}

#archive2023 h2+p,
#contactform h2+p {
    font-size: 18rem;
    line-height: 1.8;
    margin: 0 0 1.5em;
    text-align: center;

}

#studentsworks h2 span:nth-of-type(1),
#contact h2 span:nth-of-type(1),
#archive2023 h2 span:nth-of-type(1),
#contactform h2 span:nth-of-type(1) {
    font-size: 80rem;
    color: #0AAB93;
    text-shadow: 1px 1px 0px rgba(255, 255, 255, .5), -1px 1px 0px rgba(255, 255, 255, .5), 1px -1px 0px rgba(255, 255, 255, .5), -1px -1px 0px rgba(255, 255, 255, .5);
    transform: translateY(50%);
    z-index: 1;
}

#archive2023 h2 span:nth-of-type(1) {
    color: #fff;
    text-shadow: 1px 1px 0px rgba(12, 74, 174, .5), -1px 1px 0px rgba(12, 74, 174, .5), 1px -1px 0px rgba(12, 74, 174, .5), -1px -1px 0px rgba(12, 74, 174, .5);
}

#studentsworks h2 span:nth-of-type(2),
#contact h2 span:nth-of-type(2),
#archive2023 h2 span:nth-of-type(2),
#contactform h2 span:nth-of-type(2) {
    font-size: 56rem;
    z-index: 2;
    margin: 0 0 .5em;
}

#studentsworks h2 span:nth-of-type(3),
#contact h2 span:nth-of-type(3),
#archive2023 h2 span:nth-of-type(3),
#contactform h2 span:nth-of-type(3) {
    font-size: 30rem;
}

#flow {
    margin: 0 auto 80px;
}

#flow ol, #flow-modal ol {
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto 60px;
}

#flow ol>li, #flow-modal ol>li {
    display: flex;
    flex-direction: column;
    width: calc((100% - 32px*3)/4);
    background: #fff;
    border-radius: 24px;
    padding: 24px;
    margin: 0 32px 0 0;
}

#flow ol>li:nth-of-type(2n-1), #flow-modal ol>li:nth-of-type(2n-1) {
    transform: translateY(-32px);
}

#flow ol>li:nth-of-type(4n), #flow-modal ol>li:nth-of-type(4n) {
    margin: 0;
}

#flow ol>li img, #flow-modal ol>li img {
    width: 100%;
    height: auto;
}

#flow ol>li figure, #flow-modal ol>li figure {
    width: 78.9%;
    margin: 0 auto 16px;
}

#flow ol>li h3, #flow-modal ol>li h3 {
    color: #0C4AAE;
    text-align: center;
    font-weight: 900;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: .5em;
    margin: 0 0 .5em;
}

#flow ol>li h3 span, #flow-modal ol>li h3 span {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

#flow ol>li h3 span:nth-of-type(1), #flow-modal ol>li h3 span:nth-of-type(1) {
    font-size: 36rem;
}

#flow ol>li h3 span:nth-of-type(2), #flow-modal ol>li h3 span:nth-of-type(2) {
    font-size: 18rem;
    padding-left: 0;
}

#flow ol>li p, #flow-modal ol>li p {
    font-size: 16rem;
    line-height: 1.7;
    color: #353535;
}

#flow ol>li p a,
#flow-modal ol>li p a {
    text-decoration: underline !important;
}

#flow ol>li p .flow-step-note,
#flow-modal ol>li p .flow-step-note {
    display: block;
    margin-top: 0.75em;
    color: #353535;
    font-feature-settings: "palt" 1;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 170%;
}

#flow .btn_cta + .btn_cta,
#contact .btn_cta + .btn_cta {
    margin-top: 0.75em;
}

#flow ol+p, #flow-modal ol+p {
    font-size: 18rem;
    text-align: center;
    margin: 0 auto 1.5em;
    line-height: 1.7;
    color: #fff;
}

@media screen and (max-width:950px) {

    #studentsworks h2 span:nth-of-type(1),
    #contact h2 span:nth-of-type(1),
    #archive2023 h2 span:nth-of-type(1),
    #contactform h2 span:nth-of-type(1) {
        font-size: 60rem;
    }

    #studentsworks h2 span:nth-of-type(2),
    #contact h2 span:nth-of-type(2),
    #archive2023 h2 span:nth-of-type(2),
    #contactform h2 span:nth-of-type(2) {
        font-size: 42rem;
    }

    #studentsworks h2 span:nth-of-type(3),
    #contact h2 span:nth-of-type(3),
    #archive2023 h2 span:nth-of-type(3),
    #contactform h2 span:nth-of-type(3) {
        font-size: 22.5rem;
    }

    #flow ol>li, #flow-modal ol>li {
        width: calc((100% - 32px*1)/2);
        margin: 0 32px 32px 0;
    }

    #flow ol>li:nth-of-type(2n-1), #flow-modal ol>li:nth-of-type(2n-1) {
        transform: translateY(0);
    }

    #flow ol>li:nth-of-type(2n),
    #flow ol>li:nth-of-type(4n),
    #flow-modal ol>li:nth-of-type(2n),
    #flow-modal ol>li:nth-of-type(4n) {
        margin: 0 0 32px;
    }
}

@media screen and (max-width:750px) {

    #studentsworks h2 span:nth-of-type(1),
    #contact h2 span:nth-of-type(1),
    #archive2023 h2 span:nth-of-type(1),
    #contactform h2 span:nth-of-type(1) {
        font-size: 56px;

    }

    #studentsworks h2 span:nth-of-type(2),
    #contact h2 span:nth-of-type(2),
    #archive2023 h2 span:nth-of-type(2),
    #contactform h2 span:nth-of-type(2) {
        font-size: 36px;
    }

    #studentsworks h2 span:nth-of-type(3),
    #contact h2 span:nth-of-type(3),
    #archive2023 h2 span:nth-of-type(3),
    #contactform h2 span:nth-of-type(3) {
        font-size: 21px;
    }
}

#archive2023 h2 {
    margin-bottom: 2.5em;
}

@media screen and (max-width:450px) {
    #hidden_box {
        overflow: hidden;
    }

    #studentsworks h2,
    #works h2 {
        width: calc(100% + 10%) !important;
        margin: 0 auto 2.5em !important;
        overflow: hidden;
        padding-top: 55px;
    }

    #studentsworks #flow h2 span:nth-of-type(1),
    #studentsworks #works h2 span:nth-of-type(1) {
        font-size: 56px;
        white-space: nowrap;
        position: absolute;
        left: 50%;
        transform: translateX(-50%) translateY(-55%);
        ;
    }

    #studentsworks #flow h2 span:nth-of-type(2),
    #studentsworks #works h2 span:nth-of-type(2),
    #studentsworks #flow h2 span:nth-of-type(3),
    #studentsworks #works h2 span:nth-of-type(3) {
        width: 100%;
        left: -5%;
    }

    #studentsworks h2 span:nth-of-type(2),
    #contact h2 span:nth-of-type(2),
    #archive2023 h2 span:nth-of-type(2),
    #contactform h2 span:nth-of-type(2) {
        font-size: 36px;
    }

    #studentsworks h2 span:nth-of-type(3),
    #contact h2 span:nth-of-type(3),
    #archive2023 h2 span:nth-of-type(3),
    #contactform h2 span:nth-of-type(3) {
        font-size: 24px;
        line-height: 1.4;
        font-weight: 900;
    }

    .bg_works_01 {
        padding-top: 52%;
        background: url(../../images/2025/bg_works_s.png) center center no-repeat;
        background-size: cover;
        transform: translateY(-67%);
    }

    #flow ol, #flow-modal ol {
        margin: 0;
    }

    #flow ol>li, #flow-modal ol>li {
        width: calc((100%)/1);
        margin: 0 0 16px;
        padding: 24px 16px;
        border-radius: 16px;
    }

    #flow ol>li:nth-of-type(2n-1), #flow-modal ol>li:nth-of-type(2n-1) {
        transform: translateY(0);
    }

    #flow ol>li:nth-of-type(2n),
    #flow ol>li:nth-of-type(4n),
    #flow-modal ol>li:nth-of-type(2n),
    #flow-modal ol>li:nth-of-type(4n) {
        margin: 0 0 16px;
    }

    #flow ol ul, #flow-modal ol ul {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
    }

    #flow ol ul>li, #flow-modal ol ul>li {
        display: flex;
        flex-direction: column;
    }

    #flow ol ul>li:nth-of-type(1), #flow-modal ol ul>li:nth-of-type(1) {
        width: 23.8%;
    }

    #flow ol ul>li:nth-of-type(2), #flow-modal ol ul>li:nth-of-type(2) {
        width: 70.6%;
    }

    #flow ol>li h3, #flow-modal ol>li h3 {
        margin: 0 0 16px;
        justify-content: left;
    }

    #flow ol>li h3 span:nth-of-type(1), #flow-modal ol>li h3 span:nth-of-type(1) {
        font-size: 36px;
    }

    #flow ol>li h3 span:nth-of-type(2), #flow-modal ol>li h3 span:nth-of-type(2) {
        font-size: 16px;
    }

    #flow ol>li p, #flow-modal ol>li p {
        font-size: 14px;
        line-height: 1.7;
    }

    #flow ol+p, #flow-modal ol+p {
        font-size: 18px;
    }

    #contact {
        margin-bottom: 80px !important;
    }

    #archive2023 h2+p {
        font-size: 18px;
    }

    #studentsworks h2,
    #contact h2,
    #archive2023 h2,
    #contactform h2 {
        margin: 0 0 2.5em;
    }

    #archive2023 .inner {
        margin-bottom: 80px !important;
    }

    #flow ol>li figure, #flow-modal ol>li figure {
        width: 100%;
        margin: 0;
    }

}


.youtube_wrap {
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
}

.youtube_modal {
    display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding-top: 56.25%;
    overflow: hidden;
    border-radius: 19.2px;
    border: 2px solid #fff;
    background-color: lightgray;
}

/* archive2025 のみ差分（トップへ影響させない） */
body.page-slug-archive2025 .youtube_modal,
body.page-id-930 .youtube_modal {
    border: 1px solid #2C66B1;
    border-radius: 16px;
}

body.page-slug-archive2025 .youtube_modal::before,
body.page-id-930 .youtube_modal::before {
    border-radius: 16px;
}

/* サムネは子の img。上から 40% 黒のグラデ（Figma 指定に相当） */
.youtube_modal::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 19.2px;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.40) 0%, rgba(0, 0, 0, 0.40) 100%);
    z-index: 2;
    pointer-events: none;
}

.youtube_modal::after {
    content: "";
    display: block;
    width: 50px;
    height: 50px;
    background: url(../../images/2025/ico_play.png) center center no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 6;
}


.dammy .youtube_modal::after {
    display: none;
}

.youtube_modal iframe,
.youtube_modal a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
}

.youtube_modal img {
    display: block;
    width: 100%;
    height: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    z-index: 1;
    object-fit: cover;
    object-position: 50% 50%;
}

.card_work {
    display: flex;
    flex-wrap: wrap;
}

.card_work li {
    display: flex;
    flex-direction: column;
    width: calc((100% - 1.25% * 6) / 3);
    margin: 0 1.25% 3em;
}

/* archive2025: 一覧を4列に */
body.page-slug-archive2025 .card_work li,
body.page-id-930 .card_work li {
    width: calc((100% - 1.25% * 8) / 4);
}

@media screen and (max-width:950px) {
    body.page-slug-archive2025 .card_work li,
    body.page-id-930 .card_work li {
        width: calc((100% - 1.25% * 4) / 2);
    }
}

@media screen and (max-width:450px) {
    body.page-slug-archive2025 .card_work li,
    body.page-id-930 .card_work li {
        width: calc((100% - 1.25% * 2) / 1);
        margin-bottom: 44px;
    }
}

@media screen and (max-width:950px) {
    .card_work li {
        width: calc((100% - 1.25% * 4) / 2);
    }
}

@media screen and (max-width:750px) {
    .card_work li {
        width: calc((100% - 1.25% * 4) / 2);
    }
}

@media screen and (max-width:450px) {
    .card_work li {
        width: calc((100% - 1.25% * 2) / 1);
        margin-bottom: 44px;
    }
}

.card_cat {
    position: relative;
}

.card_cat.is-hide {
    display: none;
}



.card_work h3 {
    font-size: 16rem;
    font-weight: 500;
    color: #fff;
    text-align: center;
    margin: .75em 0;
}

/* archive2025: h3 前後の SVG（疑似要素）を無効化 */
body.page-slug-archive2025 #studentsworks #works .card_work h3::before,
body.page-slug-archive2025 #studentsworks #works .card_work h3::after,
body.page-id-930 #studentsworks #works .card_work h3::before,
body.page-id-930 #studentsworks #works .card_work h3::after {
    content: none !important;
    display: none !important;
}

/* トップ一覧のみ: 名前を 28px 太字 + 左右 SVG 括弧（h3 の疑似要素） */
body.home #studentsworks #works .card_work h3 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 12px;
    color: #fff;
    text-align: center;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 28px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    position: relative;
    top: -2px;
}

body.home #studentsworks #works .card_work h3::before,
body.home #studentsworks #works .card_work h3::after {
    content: "";
    display: block;
    width: 9px;
    height: 38px;
    flex-shrink: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 9px 38px;
    /* フォントの見え方で少し下がるので微調整（下げ） */
    transform: translateY(2px);
}

body.home #studentsworks #works .card_work h3::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='38' viewBox='0 0 9 38' fill='none'%3E%3Cpath d='M9 1H1V37H9' stroke='%23fff' stroke-width='2' stroke-miterlimit='10'/%3E%3C/svg%3E");
}

body.home #studentsworks #works .card_work h3::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='38' viewBox='0 0 9 38' fill='none'%3E%3Cpath d='M0 1H8V37H0' stroke='%23fff' stroke-width='2' stroke-miterlimit='10'/%3E%3C/svg%3E");
}

/* 以前は h3 内に a があったが、リンク削除に伴い h3 に集約 */

.card_work .txt_cat {
    color: #fff;
    font-size: 14.4px;
    text-align: center;
}

/* archive2025: カテゴリ文字サイズ */
body.page-slug-archive2025 .card_work .txt_cat,
body.page-id-930 .card_work .txt_cat {
    font-size: 12px;
}

.card_work .txt_cat span {
    display: inline-block;
    padding: 2px 24px;
    line-height: 1.7;
    border-radius: 16px;
    border: 1px solid #fff
}

.card_work .txt_area {
    font-weight: 500;
    font-size: 16.8px;
    text-align: center;
    margin: 0 0 16px;
    color: #fff;
}

.card_work .txt_area a {
    font-size: 16.8px;
}

.btn_c a,
.btn_a a {
    display: block;
    width: 93%;
    margin: 0 auto 1.3em;
    color: #fff;
    font-size: 16rem;
    font-weight: 500;
    text-align: center;
    border: 2px solid #fff;
    border-radius: 32px;
    padding: .75em;
    line-height: 1;
    box-shadow: 0.3em 0.3em 0 #fff;
    transition: .3s;
}

/* archive2025: トップ用の 19.2px を打ち消して 16rem に固定 */
body.page-slug-archive2025 .card_work .btn_a a,
body.page-id-930 .card_work .btn_a a {
    font-size: 16rem;
}

.btn_c a:hover,
.btn_a a:hover {
    opacity: .5;
}

.btn_c a:hover,
.btn_a a:hover,
.btn_c a:active,
.btn_a a:active {
    box-shadow: 0.1em 0.1em 0 #fff;
    transform: translateY(0.1em) translateX(0.1em);

}

.btn_c a {
    background: #0C4AAE;
}

.btn_a a {
    background: #EF9D5B;
}

.card_work .btn_a a {
    font-size: 19.2px;
}

.search-box {
    text-align: center;
    margin: 0 0 0px;
}

.search-box li {
    display: inline-block;
    margin: 0 .5em 2em;
}

.search-box input {
    display: none;
}

.search-box label {
    font-weight: 400;
    font-size: 14rem;
    cursor: pointer;
    color: #fff;
    border: 1px solid #0C4AAE;
    border-radius: 32px;
    line-height: 1;
    padding: .25em 2em .35em;
    text-align: center;
    transition: .3s;
    background: #0C4AAE;
}

.search-box label:hover {
    opacity: .5;
}

.search-box .checked-label {
    /* ここにラジオボタンがチェックされたときのスタイルを指定します */
    /* 例: バックグラウンドカラーやフォントの色を変更 */
    background-color: #fff;
    color: #0C4AAE;
    border: 1px solid #0C4AAE;
}

.lity {
    background: rgba(12, 74, 174, .9);
    z-index: 9999;
}

.lity-close,
.lity-close:hover {
    position: fixed;
    top: 40px;
    right: 40px;
    width: 60px;
    height: 60px;
    padding-top: 60px;
    overflow: hidden;
    background: url(../../images/2025/nav_c.png) center center no-repeat;
    background-size: cover;
    cursor: pointer;
    transform: translateX(0%) translateY(0%) !important;
}


@media screen and (min-width:1200px) {

    .lity-close,
    .lity-close:hover {
        transform: translateX(881%) translateY(-535%);
    }

    .lity-close:hover {
        transform: translateX(881%) translateY(-535%) scale(120%);
    }
}

@media screen and (max-width:1199px) {



    .lity-close:hover {
        transform: translateX(0) translateY(0) scale(120%);
    }
}

@media screen and (max-width:500px) {
    .card_work h3 {
        font-size: 16px;
    }

    body.home #studentsworks #works .card_work h3 {
        font-size: 22px;
    }

    .lity-close,
    .lity-close:hover {
        position: fixed;
        top: 16px;
        right: 12px;
    }
}

@media screen and (max-width:470px) {
    .card_work h3 {
        font-size: 20px;
        margin: 16px 0;
    }

    body.home #studentsworks #works .card_work h3 {
        font-size: 18px;
    }

    .btn_c a,
    .btn_a a {
        font-size: 16px;
    }

    .search-box label {
        font-size: 13px;
    }

    .search-box {
        text-align: left;
        margin: 0 0 20px;
    }
}

/*company
================================================*/

.bg_company_01 {
    content: "";
    display: block;
    width: 100%;
    padding-top: 90%;
    background: url(../../images/2025/bg_company_01.png) center center no-repeat;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    transform: translateY(-75%);
    z-index: 1;
}

#participatingcompany {
    position: relative;
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 64.9%, rgba(0, 48, 71, 1) 64.9%, rgba(0, 48, 71, 1) 100%);
    z-index: 2;
}

#participatingcompany::before {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    padding: 5%;
    background: url(../../images/2025/bg_t.png) center center no-repeat;
    background-size: cover;
    top: 65%;
    transform: translateY(-100%);
}

.participatingcompany_inner {
    max-width: calc(1160px + 10%);
    padding: 4em 5%;
    margin: 0 auto;
    position: relative;
    z-index: 10;
}

#participatingcompany h2 {
    margin: 0 0 5em;
}

#participatingcompany h2 span {
    display: block;
    text-align: center;
    font-weight: 900;
    color: #0C4AAE;
    line-height: 1;
    position: relative;
}

#participatingcompany h2 span:nth-of-type(1) {
    font-size: 80rem;
    color: #fff;
    text-shadow: 1px 1px 0px rgba(0, 48, 71, 1), -1px 1px 0px rgba(0, 48, 71, 1), 1px -1px 0px rgba(0, 48, 71, 1), -1px -1px 0px rgba(0, 48, 71, 1);
    transform: translateY(35%);
    z-index: 1;
}

#participatingcompany h2 span:nth-of-type(2) {
    font-size: 56rem;
    z-index: 2;
    margin: 0 0 .1em;
}

#participatingcompany h2 span:nth-of-type(3) {
    font-size: 30rem;
}



@media screen and (max-width:1119px) {
    #participatingcompany h2 span:nth-of-type(1) {
        font-size: 60rem;
    }

    #participatingcompany h2 span:nth-of-type(2) {
        font-size: 42rem;
    }

    #participatingcompany h2 span:nth-of-type(3) {
        font-size: 22.5rem;
    }

}

@media screen and (max-width:850px) {
    #participatingcompany h2 span:nth-of-type(1) {
        font-size: 45rem;
    }

    #participatingcompany h2 span:nth-of-type(2) {
        font-size: 31.5rem;
    }

    #participatingcompany h2 span:nth-of-type(3) {
        font-size: 16.875rem;
    }

}

@media screen and (max-width:515px) {
    #participatingcompany h2 span:nth-of-type(1) {
        font-size: 33.75rem;
    }

    #participatingcompany h2 span:nth-of-type(2) {
        font-size: 23.625rem;
    }

    #participatingcompany h2 span:nth-of-type(3) {
        font-size: 16.875rem;
    }

}

.box {
    border: 4px solid #0C4AAE;
    border-radius: 32px;
    padding: 2.5em 0;
    background: #fff;
}

.box ul {
    text-align: center;
}

.box li {
    display: inline-block;
    margin: 0 2.5em 2.5em;
    font-size: 16rem;
    font-weight: 500;
    color: #0C4AAE;
}

.box p {
    margin: 0 4em 0 0;
    font-size: 12rem;
    font-weight: 500;
    color: #0C4AAE;
    text-align: right;
}


/*contact
================================================*/
#contact {
    background: #0AAB93;
    position: relative;
    z-index: 21;
    margin: 0 auto 10%;
}

.contact_col_inner {
    max-width: calc(1160px + 10%);
    margin: 0 auto;
    padding: 0 5% 4em;
    text-align: center;
    color: #fff;
    position: relative;
    z-index: 10;
}

#contact h2 {
    margin-bottom: 2.5em;
}


#contact p {
    font-size: 18rem;
    font-weight: 500;
    margin: 0 auto 2.5em;
}


.btn_cta {
    margin: 0 auto;
    max-width: 375px;
}

.btn_cta a {
    display: block;
    font-weight: 600;
    font-size: 20rem;
    border: 2.5px solid #fff;
    color: #fff;
    text-align: center;
    border-radius: 18px;
    padding: 24rem 0;
    max-width: 300px;
    box-shadow: 0.3em 0.3em 0 #fff;
    transition: .3s;
    background: #0C4AAE;
    transform: translateX(-.15em);
    margin: 0 auto;
}

#archive2023 .btn_cta a {
    border: 2.5px solid #152F58;
    box-shadow: 0.3em 0.3em 0 #152F58;
}

.btn_cta a:hover {
    opacity: .5;
}

.btn_cta a:hover,
.btn_cta a:active {
    box-shadow: 0.1em 0.1em 0 #fff;
    transform: translateY(0.1em) translateX(0.1em);
}

.bg_contact_01 {
    content: "";
    display: block;
    width: 42%;
    padding-top: 32%;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(-40%);
    background: url(../../images/2025/bg_contact_01.png) center center no-repeat;
    background-size: cover;
    z-index: 4;
}

.bg_contact_02 {
    content: "";
    display: block;
    width: 100%;
    padding-top: 57%;
    position: absolute;
    bottom: 0;
    transform: translateY(45%);
    background: url(../../images/2025/bg_contact_02.png) center center no-repeat;
    background-size: cover;
    z-index: 6;
}

.bg_contact_03 {
    content: "";
    display: block;
    width: 100%;
    padding-top: 15%;
    position: absolute;
    bottom: 0;
    transform: translateY(29%);
    background: url(../../images/2025/bg_b.png) center center no-repeat;
    background-size: cover;
    z-index: 1;
}

#archive2023 {
    position: relative;
    z-index: 20;
}

@media screen and (max-width:640px) {
    .bg_contact_01 {
        transform: translateY(-100%);
    }

    #contact p {
        font-size: 18px;
        line-height: 1.7;
        margin: 0 auto 24px;
    }

    .contact_col_inner {
        padding: 0 5% 90px;
    }

    .bg_contact_02 {
        padding-top: 82%;
        transform: translateY(39%);
        background: url(../../images/2025/bg_contact_02_s.png) center center no-repeat;
        background-size: cover;
    }
}

/*info
================================================*/

#info {
    position: relative;
}

.bg_info_04 {
    content: "";
    display: block;
    width: 32%;
    padding-top: 86%;
    position: absolute;
    right: 0;
    top: 0;
    transform: translateY(-85%);
    background: url(../../images/2025/bg_info_04.png) center center no-repeat;
    background-size: cover;
    z-index: 1;
    pointer-events: none;
}

.info_col_inner {
    max-width: calc(882px + 10%);
    margin: 0 auto;
    padding: 0 5% 80px;
    position: relative;
    z-index: 10;
}

.col_03 {
    display: flex;
    flex-wrap: wrap;
    max-width: 544px;
    padding: 32px;
    margin: 0 auto;
    background: #fff;
    border-radius: 48px;
    justify-content: center;
}

.col_03 li {
    display: flex;
    flex-direction: column;
    width: calc(100% / 2);
    text-align: center;
}

.col_03 li img {
    width: 100%;
    height: auto;
}

.col_03 li:nth-of-type(1) img {
    width: 53%;
    padding: 10% 0 0;
}

.col_03 li:nth-of-type(2) img {
    width: 69%;
    padding: 20% 0 0;
}

.col_03 li:nth-of-type(3) img {
    width: 46.42%;
    padding: 10% 0 0;
}

.col_03 li h3 {
    font-weight: bold;
    font-size: 18rem;
    color: #0C4AAE;
    margin: 0 0 1em;
}

@media screen and (max-width:420px) {
    .col_03 li:nth-of-type(2) img {
        padding: 0;
    }

    .col_03 li {
        width: 100%;
        margin: 0 0 5em;
    }

    .btn_cta,
    .btn_cta a {
        max-width: 100% !important;
        font-size: 20px;
    }

    .bg_info_04 {
        width: 22.2%;
        padding-top: 50%;
        transform: translateY(-65%);
        background: url(../../images/2025/bg_info_04_s.png) center center no-repeat;
        background-size: cover;
    }

    .info_col_inner {
        margin-bottom: 40px !important;
        padding-bottom: 0 !important;
    }

    .col_03 li h3 {
        font-size: 18px;
    }

    .col_03 li:nth-of-type(1) img {
        padding: 0;
    }

    .col_03 li:nth-of-type(2) img {
        padding: 8% 0 0;
    }
}

/*note_col
================================================*/
#note_col {
    max-width: calc(882px + 10%);
    padding: 0 5%;
    margin: 0 auto 0;
    position: relative;
    z-index: 50;
}

#note_col h3 {
    font-weight: bold;
    font-size: 24rem;
    color: #fff;
    margin: 0 0 1em;
    text-align: center;
}

#note_col ul {
    padding: 0 0 0 1.5em;
}

#note_col li {
    list-style-type: disc;
    margin: 0 0 .5em;
    line-height: 1.5;
    color: #fff;
    font-size: 16rem;
}

#note_col li a {
    color: #fff;
}

#note_col li:nth-last-of-type(1) {
    margin: 0;
}

#note_col a {
    color: #148BFA;
    text-decoration: underline;
}

@media screen and (max-width:420px) {
    #note_col h3 {
        font-size: 18px;
        margin: 0 0 24px;
    }

    #note_col li {
        font-size: 14px;
    }
}

/*footer
================================================*/

#colophon {
    width: 100%;
    font-size: 14rem;
    background: #0AAB93;
    padding: 1.5em 5%;
}

#colophon p {
    text-align: center;
    color: #fff;
    font-size: 14rem;
}

.bk_b {
    background: #0C4AAE;
    padding: 80px 0 80px;
}

@media screen and (max-width:420px) {
    #colophon {
        font-size: 14px;
    }

    html {
        margin-top: 0 !important;
    }
}


/*nav
================================================*/
#site-navigation {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    background: rgba(12, 74, 174, .9);
    z-index: 7000;
    transform: translate(100%);
    transition: .3s;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
    padding-top: max(16px, env(safe-area-inset-top, 0px));
    padding-bottom: max(16px, env(safe-area-inset-bottom, 0px));
}

#site-navigation.active {
    transform: translate(0%);
}

#site-navigation ul {
    max-width: calc(1160px + 10%);
    padding: 0 5%;
    margin: auto;
    font-size: 37.5rem;
    line-height: 1;
    width: 100%;
    position: relative;
    flex: 0 0 auto;
}

#site-navigation li {
    position: relative;
}

#site-navigation li::after {
    content: "";
    display: block;
    width: 62.5px;
    height: 2px;
    background: #fff;
    position: absolute;
    left: 0;
    bottom: 0;
    transform: translate(1px);
}

#site-navigation a {
    display: block;
    font-weight: 900;
    font-size: 37.5rem;
    line-height: 1;
    padding: 1em 0;
    color: #fff;
}

#btn_nav {
    position: fixed;
    top: 40px;
    right: 40px;
    width: 60px;
    height: 60px;
    background: url(../../images/2025/nav_o.png) center center no-repeat;
    background-size: 100% auto;
    z-index: 8000;
    cursor: pointer;
}

#btn_nav.active {
    background: url(../../images/2025/nav_c.png) center center no-repeat;
    background-size: 100% auto;
}



@media screen and (max-width:640px) {
    #site-navigation {
        overflow-y: auto;
    }

    .bk_b {
        padding: 48px 0;
    }

    #site-navigation a {
        font-size: 22px;
        line-height: 1.45;
    }

    #site-navigation ul {
        font-size: 22px;
    }

    #btn_nav {
        position: fixed;
        top: 16px;
        right: 12px;
    }
}

/*お問い合わせページ
================================================*/
#contactform {
    background: #0AAB93;
    color: #fff;
    padding: 11.9em 0 80px;
    position: relative;
    z-index: 2;
}

.contactform_inner {
    max-width: calc(480px + 10%);
    padding: 0 5%;
    margin: 0 auto;
    position: relative;
    z-index: 10;
}

.bg_contact_top01 {
    content: "";
    display: block;
    width: 100%;
    padding-top: 28%;
    position: absolute;
    top: 0;
    left: 0;
    background: url(../../images/2025/contact_t.png) center center no-repeat;
    background-size: cover;
    z-index: 3;
}

.bg_contact_top02 {
    content: "";
    display: block;
    width: 45%;
    padding-top: 84%;
    position: absolute;
    top: 0;
    right: 0;
    background: url(../../images/2025/bg_contact_top02.png) center center no-repeat;
    background-size: cover;
    z-index: 3;
}

form.sent ul,
form.sent #privacy,
form.sent input[type="submit"] {
    display: none;
}



.contactform_inner>p {
    text-align: center;
    font-size: 18rem;
    font-weight: 500;
    line-height: 1.5;
    margin: 0 0 5em;
}

.entry-title {
    display: none;
}

#form {
    font-size: 16px;
    margin: 0 0 4.6em;
}

#form li {
    font-size: 16px;
    margin: 0 0 2.3em;
}

#form li span {
    display: block;
    line-height: 1.5;
    margin: 0 0 1.25em;
}

#form li span input,
#form li span select,
#form li span textarea {
    display: block;
    width: 100%;
    background: #fff;
    padding: 0.75em 1em;
    color: #0C4AAE;
    border: 1px solid #0C4AAE;
    border-radius: 16px;
}

#form li span select {
    max-width: 340px;
}

#form li span select::-ms-expand {
    display: none;
    /* デフォルトの矢印を非表示(IE用) */
}

#form li span select {
    -webkit-appearance: none;
    appearance: none;
    /* デフォルトの矢印を非表示 */
    background-image: url("../img/arrow_select.png");
    background-position: right 16px center;
    background-repeat: no-repeat;
    background-size: 22px 14px;
}

#form li span textarea {
    height: 280px;
}

#privacy .content {

    height: 260px;
    border: 1px solid #0C4AAE;
    padding: 32rem 16rem 32rem 20rem;
    color: #0C4AAE;
    border-radius: 16px;
    background: #fff;
    margin: 0 0 4.6em;

}

.mCS-my-theme.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #0C4AAE;
    width: 12px;
    opacity: 1 !important;
}

.mCS-my-theme.mCSB_scrollTools .mCSB_draggerRail {
    background-color: white;
}

#privacy h3 {
    text-align: center;
    font-size: 20rem;
    font-weight: 600;
    margin: 0 0 1.5em;
    line-height: 1.5;
}

#privacy>p {
    text-align: right;
    font-size: 14rem;
    font-weight: 400;
    line-height: 1.5;
    margin: 0 0 1.25em;
}

#privacy dt {
    font-size: 16rem;
    font-weight: 600;
    margin: 0 0 0.75em;
    line-height: 1.5;
}

#privacy dd {
    font-size: 14rem;
    font-weight: 400;
    margin: 0 0 1.5em;
    line-height: 2.5;
}

input[type="submit"] {

    display: block;
    margin: 0 auto;
    max-width: 300px;
    width: 93%;
    margin: 0 auto 1.3em;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    border: 2px solid #fff;
    border-radius: 18px;
    padding: .75em;
    line-height: 1;
    box-shadow: 0.3em 0.3em 0 #fff;
    transition: .3s;
    background: #0C4AAE;
}

.wpcf7-not-valid-tip {
    color: yellow;
}

/*bits
================================================*/

.pc_none {
    display: none !important;
}


.sp_none {
    display: block !important;
}


@media screen and (max-width:640px) {
    .pc_none {
        display: block !important;
    }

    .sp_none {
        display: none !important;
    }

    .inline {
        display: inline !important;
    }
}

/*
@media screen and (max-width:640px) {
  dl {
    display: flex;
    flex-wrap: wrap;
  }
  dt,
  dd {
    display: flex;
    flex-direction: column;
  }
}
*/

.card-content {
    position: relative;
    margin-top: 6px;
    padding-top: 12px;
}


/* ===========================================
   いいね機能のスタイル
   =========================================== */
.like-wrapper {
    display: flex;
    flex-direction: column;
    width: 35px;
    justify-content: right;
    gap: 3px;
    position: absolute;
    right: 0;
    top: 0;
}

.like-button {
    width: 35px;
    height: 35px;
    padding: 0;
    background: transparent;
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    justify-content: right;
}

.like-button:hover {
    transform: scale(1.1);
}

.like-button:active {
    transform: scale(0.95);
}

.like-button.loading {
    opacity: 0.7;
    cursor: not-allowed;
}

.like-button.liked {
    cursor: not-allowed;
}

.like-icon {
    width: 35px;
    height: 35px;
    object-fit: contain;
}

.like-counter {
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #fff;
    text-align: center;
    justify-content: center;
    width: 100%;
}

.like-count {
    font-weight: 500;
    color: #fff;
}

.new-icon-wrapper {
    width: 56px;
    height: 56px;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(-8px) translateX(-8px);
    z-index: 100;
}

.new-icon-wrapper img {
    width: 100%;
    height: 100%;
}

/* ソートコントロールのスタイル */
.sort-controls {
    margin-bottom: 20px;
    text-align: right;
    padding: 10px 0;
}

.sort-controls a {
    padding: 8px 16px;
    text-decoration: none;
    border-radius: 4px;
    font-size: 14px;
    transition: all 0.3s ease;
}

.sort-controls a:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* レスポンシブ対応 */
@media screen and (max-width: 640px) {
    .sort-controls * {
        font-size: 12px !important;
    }
}