@charset "UTF-8";
/* ===== Responsive Design ===== */

@media (max-width: 960px) {

    /* ===== heroセクション ===== */
    .hero {
        min-height: auto;
        height: 100svh;
        max-height: 100svh;
        overflow: hidden;
    }

    .hero .container {
        padding: 20px;
    }

    .hero__inner {
        margin-top: 200px;
        gap: 6px;
    }

    .hero__brands {
        margin-bottom: 20px;
        padding-right: 0;
    }

    .logo-hirono {
        width: 130px;
        height: 32px;
    }

    .logo-nr {
        width: 130px;
        height: 43px;
    }

    /* ===== Inclusive Message セクション ===== */
    .inclusive-message__inner {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .inclusive-message::after {
        bottom: -3vw;
        line-height: 1.25;
    }

    .pc-only {
        display: none;
    }

    .inclusive-message {
        padding-inline: 20px;
        min-height: 500px;
    }

    .inclusive-message__title {
        min-height: 150px;
    }

    /* ===== About Hirono セクション ===== */
    .about-item {
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .about-item__content {
        order: 1;
        align-items: flex-start;
        padding: 32px;
    }

    .about-item__media {
        order: 2;
        width: 100%;
    }

    .about-item__content-inner {
        justify-content: space-between;
    }

    /* ===== Free Lectures セクション ===== */
    .free-lectures__inner {
        gap: 40px;
        padding: 100px 20px;
    }

    .free-lectures__right {
        padding-right: 20px;
    }

    /* ===== Learning Content セクション ===== */
    .learning-content__intro {
        padding: 0 32px;
    }

    .learning-content__grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .learning-content__card {
        padding-inline: 22px;
    }

    .learning-content__list li {
        font-size: 13px;
    }


    /* ===== Accommodation セクション ===== */
    #accommodation.content {
        padding-block: 40px;
    }

    .accommodation__desc {
        padding: 0 32px;
    }

    .accommodation__grid {
        grid-template-columns: 1fr;
        padding-top: clamp(48px, 8vh, 64px);
        gap: 30px;
    }

    .info dd {
        font-size: 14px;
    }

    /* ===== Map セクション ===== */
    .map__frame {
        aspect-ratio: 4 / 3;
    }

    /* ===== Camp Overview セクション ===== */
    .camp-overview__table .row {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .camp-overview__table dt {
        margin-bottom: 4px;
    }

    .camp-overview__table {
        padding-inline: 32px;
    }

    /* ===== FAQ セクション ===== */
    .faq::before {
        left: 16px;
        bottom: 16px;
    }

    .faq::after {
        right: 16px;
        top: 16px;
    }

    /* ===== Footer セクション ===== */
    .footer__logos {
        gap: 16px;
    }

    .footer-partners__grid {
        grid-template-columns: 1fr;
        gap: 55px;
        padding-inline: 32px;
    }

    .footer__legal {
        text-align: center;
    }

    .footer__period {
        margin: 0;
        line-height: 1.6;
        color: #fff;
        text-align: center;
    }
}

/* ========= SP（600px以下） ========= */
@media (max-width: 600px) {

    /* ===== Inclusive Message セクション ===== */
    .inclusive-message {
        min-height: auto;
        padding-block: 96px 100px;
    }

    .inclusive-message::after {
        bottom: -6vw;
    }


    /* ===== About Hirono セクション ===== */
    .about-item__content-inner {
        display: flex;
        align-items: flex-end;
        gap: 12px;
        flex-wrap: wrap;
    }

    .about-item__index {
        line-height: 1;
        -webkit-text-stroke: 2px var(--brand-red);
        color: transparent;
        flex-shrink: 0;
    }

    .about-item__title {
        line-height: 1.4;
        color: var(--brand-red);
        font-weight: 800;
        margin: 0;
        flex: 1 1 auto;
        min-width: 0;
    }

    /* SPのみ改行 */
    .sp-only {
        display: inline;
    }

    /* ===== Free Lectures セクション ===== */

    /* グリッドレイアウト：3段構成（1段目：無料受講料、2段目：やる気に〜、3段目：土日〜） */
    .free-lectures__inner {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
        padding-block: 60px;
        padding-inline: 20px;
        gap: 24px;
        align-items: start;
        overflow: visible;
    }

    /* 1段目：「無料」「受講料」 */
    .free-lectures__left {
        grid-column: 1;
        grid-row: 1;
        justify-self: start;
        align-self: start;
        padding-left: 16px;
        gap: clamp(8px, 2vw, 14px);
    }

    .free-lectures__free {
        font-size: clamp(88px, 21vw, 104px) !important;
        letter-spacing: .01em;
    }

    .free-lectures__label {
        font-size: clamp(74px, 18vw, 88px) !important;
        letter-spacing: .01em;
    }

    /* 2段目：「やる気に満ちた〜」 */
    .free-lectures__right {
        grid-column: 1;
        grid-row: 2;
        justify-self: end;
        align-self: start;
        text-align: right;
        padding-right: 30px;
        width: 100%;
        margin-top: 58px;
    }

    .free-lectures__headline {
        font-size: clamp(36px, 7vw, 42px) !important;
        line-height: 1.22;
        white-space: normal;
        text-align: right;
        letter-spacing: .01em;
        -webkit-text-size-adjust: 100%;
        /* iOSの自動拡大を抑制 */
    }

    .free-lectures__headline span {
        display: block;
        text-align: right;
    }

    .free-lectures__headline .accent {
        font-size: clamp(44px, 8.5vw, 52px) !important;
        letter-spacing: 0.05em;
    }

    /* 3段目：「土日」「集中講義」「平日サポート」を横並び */
    .free-lectures__bottom {
        grid-column: 1;
        grid-row: 3;
        flex-direction: row;
        align-items: flex-end;
        justify-content: center;
        gap: 10px;
        padding: 0 8px;
        flex-wrap: nowrap;
        margin-top: 110px;
        width: 100%;
    }

    .free-lectures__weekend-left {
        font-size: clamp(75px, 18vw, 85px) !important;
        line-height: 1;
        white-space: nowrap;
        letter-spacing: .01em;
        flex-shrink: 0;
    }

    /* 「集中講義」と「平日サポート」を縦並びグループ */
    .free-lectures__right-group {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 2px;
        justify-content: flex-end;
        min-width: 0;
        flex-shrink: 1;
    }

    .free-lectures__weekend-right {
        font-size: clamp(44px, 10.5vw, 52px) !important;
        line-height: 1;
        white-space: nowrap;
        letter-spacing: .01em;
        margin-top: 0;
        text-align: left;
    }

    .free-lectures__support {
        font-size: clamp(18px, 4.5vw, 22px) !important;
        line-height: 1.15;
        white-space: nowrap;
        letter-spacing: .01em;
        margin-top: 0;
        text-align: left;
    }

    /* 背景ワードクラウド：SP時のサイズ調整 */
    .free-lectures__wordcloud {
        padding-inline: 8px;
    }

    .free-lectures__wordcloud .w {
        max-width: 88vw;
        letter-spacing: .01em;
    }

    .free-lectures__wordcloud .w.s1 {
        font-size: clamp(18px, 4.8vw, 22px) !important;
    }

    .free-lectures__wordcloud .w.s2 {
        font-size: clamp(22px, 5.8vw, 26px) !important;
    }

    .free-lectures__wordcloud .w.s3 {
        font-size: clamp(26px, 6.8vw, 30px) !important;
    }

    .free-lectures__wordcloud .w.s4 {
        font-size: clamp(30px, 7.8vw, 36px) !important;
    }

    .free-lectures__wordcloud .w.s5 {
        font-size: clamp(38px, 9.2vw, 44px) !important;
    }

    /* 人生が */
    .p01 {
        top: 6% !important;
        left: 56% !important;
        font-size: clamp(68px, 14vw, 80px) !important;
        letter-spacing: 0.50em;
    }

    /* 変わる */
    .p02 {
        top: 12% !important;
        left: 56% !important;
        font-size: clamp(68px, 14vw, 80px) !important;
        letter-spacing: 0.50em;
    }

    /* やる気しか無い */
    .p03 {
        top: 20% !important;
        left: 50% !important;
        font-size: clamp(54px, 12vw, 68px) !important;
        letter-spacing: 0.18em;
    }

    /* スキルを */
    .p04 {
        top: 61% !important;
        left: 11% !important;
    }

    /* 身につける */
    .p05 {
        top: 66% !important;
        left: 11% !important;
    }

    /* 一歩踏み出す勇気 */
    .p06 {
        top: 76% !important;
        left: 35% !important;
    }

    /* 夢を語り */
    .p07 {
        top: 26% !important;
        left: 54% !important;
        font-size: clamp(56px, 12.5vw, 72px) !important;
        letter-spacing: 0.20em;
    }

    /* まくれ */
    .p08 {
        top: 32% !important;
        left: 58% !important;
        font-size: clamp(60px, 13vw, 76px) !important;
        letter-spacing: 0.26em;
    }

    /* 地方移住（縦書き） */
    .p09 {
        top: 65% !important;
        left: 86% !important;
    }

    /* スパルタキャンプ */
    .p10 {
        top: 39% !important;
        left: 28% !important;
    }

    /* やべえええええぇ */
    .p11 {
        top: 43% !important;
        left: 50% !important;
    }

    /* プログラミング未経験者大歓迎 */
    .p12 {
        top: 80% !important;
        left: 14% !important;
    }

    /* 楽しんだもん勝ち */
    .p13 {
        top: 71% !important;
        left: 4% !important;
    }

    /* 自然豊かな（縦書き）*/
    .p14 {
        top: 35% !important;
        left: 12% !important;
    }

    /* 環境で学べる（縦書き） */
    .p15 {
        top: 35% !important;
        left: 2% !important;
    }


    /* ===== Accommodation セクション ===== */
    #camp-overview .container {
        padding-inline: 0;
    }

    .camp-overview__table dd {
        font-size: 14px;
        line-height: 1.5;
    }

    .camp-overview__table .row+.row {
        margin-top: 40px;
    }

    .accommodation__brand {
        display: flex;
        justify-content: center;
    }

    .accommodation__facility {
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
    }

    .accommodation__actions {
        align-self: flex-end;
    }


    /* ===== Map セクション ===== */
    .map.map--fullbleed {
        width: 100%;
        margin: 0 auto;
        transform: none;
    }

    .map__frame {
        aspect-ratio: 1 / 1;
    }

    /* ===== FAQ セクション ===== */
    .faq__item {
        padding: 32px;
    }

    .faq__question {
        align-items: flex-start;
        gap: 8px;
        line-height: 1.6;
    }

    .faq__q {
        line-height: 1;
        margin: 0;
        flex-shrink: 0;
    }

    /* ===== Footer セクション ===== */
    .footer-cta {
        background-image: url("../images/footer_sp.webp");
        background-size: cover;
        background-position: center bottom;
        min-height: auto;
        gap: 48px;
        padding-top: 96px;
    }

    .footer__entry {
        width: 100%;
        max-width: 320px;
        padding: 12px 0;
    }

    .footer__period {
        margin-top: 32px;
    }

    .footer__period .bar {
        display: none;
    }

    .footer__tagline {
        margin-bottom: 50px;
    }

    .footer__legal {
        position: absolute;
        bottom: 32px;
        left: 32px;
        padding-top: 16px;
        border-top: 1px solid rgba(255, 255, 255, 0.6);
    }

    .footer__legal p {
        text-align: left;
        margin: 0;
        color: #fff;
        font-size: 12px;
    }

}