/* ========================================
   LOGZA SCHOOL カスタムスタイル
   ======================================== */

/* ----------------------------------------
   Google Fonts - Noto Serif JP
   ---------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');

/* ----------------------------------------
   フォント統一 - Noto Serif JP
   ---------------------------------------- */
html,
body,
h1, h2, h3, h4, h5, h6,
p, span, a, li, div,
input, textarea, select, button,
.menu-item-txt,
.site-banner__txt,
.site-banner__large-txt,
.txt-styles,
.txt-large,
.btn,
.icon-link__txt {
    font-family: "Noto Serif JP", serif;
}

/* app.min.css の Arial 上書き */
.page-wrap .jcf-checkbox,
.page-wrap .jcf-radio,
input[type=date],
input[type=datetime-local],
input[type=email],
input[type=month],
input[type=number],
input[type=password],
input[type=search],
input[type=tel],
input[type=text],
input[type=time],
input[type=url],
input[type=week],
input[type=file],
textarea,
select,
.jcf-select-text,
.jcf-radio,
.jcf-checkbox {
    font-family: "Noto Serif JP", serif;
}

/* wpa.css の Arial 上書き */
.wpa-test-msg {
    font-family: "Noto Serif JP", serif;
}

/* 全体の強制上書き */
* {
    font-family: "Noto Serif JP", serif;
}

/* ----------------------------------------
   ヘッダーロゴ - 白黒切り替え
   ---------------------------------------- */
.site-logo {
    display: flex;
    align-items: center;
}

.site-logo img {
    height: 2.5rem;
    width: auto;
}

/* デフォルト（明るい背景）: 黒ロゴ表示、白ロゴ非表示 */
.site-logo__black {
    display: block;
}

.site-logo__white {
    display: none;
}

/* 暗い背景時: 白ロゴ表示、黒ロゴ非表示 */
.header-dark .site-logo__black,
.site-header--dark .site-logo__black,
.site-scroll--active .site-logo__black,
.menu-active .site-logo__black {
    display: none;
}

.header-dark .site-logo__white,
.site-header--dark .site-logo__white,
.site-scroll--active .site-logo__white,
.menu-active .site-logo__white {
    display: block;
}

/* ヘッダーが暗い背景の上にある時（トップバナー上など） */
.site-banner .site-logo__black {
    display: none;
}

.site-banner .site-logo__white {
    display: block;
}

/* header-lightクラスがある場合のトップ（動画上）での表示 */
body.header-light .site-header .site-logo__black {
    display: none;
}

body.header-light .site-header .site-logo__white {
    display: block;
}

/* スクロール後（背景が白くなった時）*/
body.site-scroll--active .site-header .site-logo__black {
    display: block;
}

body.site-scroll--active .site-header .site-logo__white {
    display: none;
}

/* メニュー展開時（暗い背景）*/
body.menu-active .site-header .site-logo__black {
    display: none;
}

body.menu-active .site-header .site-logo__white {
    display: block;
}

/* ----------------------------------------
   レスポンシブ対応（ヘッダー）
   ---------------------------------------- */
@media screen and (max-width: 768px) {
    .site-logo img {
        height: 2rem;
    }
}

/* ========================================
   お知らせセクション
   ======================================== */
.news-section-3847 {
    padding: 4rem 0;
}

.news-container-3847 {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 2rem;
}

.news-header-3847 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid #191919;
}

.news-header-3847 h2 {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0;
}

.news-more-3847 {
    font-size: 0.875rem;
    color: #191919;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: opacity 0.3s ease;
}

.news-more-3847:hover {
    opacity: 0.6;
}

.news-list-3847 {
    list-style: none;
    padding: 0;
    margin: 0;
}

.news-item-3847 {
    border-bottom: 1px solid #e0e0e0;
}

.news-item-3847 a {
    display: flex;
    align-items: center;
    padding: 1.25rem 0;
    text-decoration: none;
    color: #191919;
    transition: opacity 0.3s ease;
}

.news-item-3847 a:hover {
    opacity: 0.6;
}

.news-category-3847 {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.25rem 0.75rem;
    background: #191919;
    color: #fff;
    border-radius: 2px;
    min-width: 80px;
    text-align: center;
    flex-shrink: 0;
}

.news-date-3847 {
    font-size: 0.875rem;
    color: #666;
    margin-left: 1.5rem;
    flex-shrink: 0;
    width: 90px;
}

.news-title-3847 {
    font-size: 0.9375rem;
    flex-grow: 1;
    margin-left: 1.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.news-arrow-3847 {
    flex-shrink: 0;
    margin-left: 1rem;
    display: flex;
    align-items: center;
}

.news-arrow-3847 svg {
    transition: transform 0.3s ease;
}

.news-item-3847 a:hover .news-arrow-3847 svg {
    transform: translateX(4px);
}

/* お知らせセクション レスポンシブ */
@media screen and (max-width: 768px) {
    .news-section-3847 {
        padding: 3rem 0;
    }

    .news-container-3847 {
        padding: 0 1.5rem;
    }

    .news-header-3847 h2 {
        font-size: 1.25rem;
    }

    .news-item-3847 a {
        flex-wrap: wrap;
        padding: 1rem 0;
    }

    .news-category-3847 {
        font-size: 0.6875rem;
        min-width: 70px;
        padding: 0.2rem 0.5rem;
    }

    .news-date-3847 {
        font-size: 0.8125rem;
        margin-left: 1rem;
        width: auto;
    }

    .news-title-3847 {
        width: 100%;
        margin-left: 0;
        margin-top: 0.75rem;
        white-space: normal;
        font-size: 0.875rem;
        line-height: 1.5;
    }

    .news-arrow-3847 {
        display: none;
    }
}

/* ========================================
   地図セクション
   ======================================== */
.map-section-3847 {
    width: 100%;
    line-height: 0;
}

.map-section-3847 iframe {
    width: 100%;
    height: 400px;
    filter: grayscale(100%);
}

/* ========================================
   フッター
   ======================================== */
.site-footer {
    padding: 4rem 0 0;
}

.footer-main-3847 {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    gap: 3rem;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem 3rem;
}

/* 左側：ロゴ・文章・SNS */
.footer-left-3847 {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.footer-logo-3847 img {
    height: 3rem;
    width: auto;
}

.footer-desc-3847 {
    color: #fff;
    font-size: 0.875rem;
    line-height: 1.8;
    opacity: 0.8;
}

.footer-social-3847 {
    display: flex;
    gap: 1rem;
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-social-3847 li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    transition: all 0.3s ease;
}

.footer-social-3847 li a:hover {
    background: #fff;
    border-color: #fff;
}

.footer-social-3847 li a:hover svg {
    fill: #191919;
}

.footer-social-3847 svg {
    width: 18px;
    height: 18px;
}

/* 中央：メニューリンク */
.footer-center-3847 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

.footer-menu-col-3847 h4 {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.footer-menu-col-3847 ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-menu-col-3847 ul li {
    margin-bottom: 0.5rem;
}

.footer-menu-col-3847 ul li a {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.875rem;
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-menu-col-3847 ul li a:hover {
    color: #fff;
}

/* 右側：会社情報 */
.footer-right-3847 {
    color: #fff;
}

.footer-right-3847 h4 {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.footer-company-3847 {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.footer-right-3847 p {
    font-size: 0.875rem;
    line-height: 1.8;
    margin-bottom: 0.5rem;
    opacity: 0.8;
}

.footer-right-3847 a {
    color: rgba(255, 255, 255, 0.8);
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-right-3847 a:hover {
    color: #fff;
}

/* コピーライト */
.footer-copyright-3847 {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding: 1.5rem 2rem;
    text-align: center;
}

.footer-copyright-3847 p {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.8rem;
    margin: 0;
}

/* ========================================
   フッター レスポンシブ
   ======================================== */
@media screen and (max-width: 1024px) {
    .footer-main-3847 {
        grid-template-columns: 1fr 1fr;
    }

    .footer-left-3847 {
        grid-column: 1 / -1;
        align-items: center;
        text-align: center;
    }

    .footer-social-3847 {
        justify-content: center;
    }

    .footer-center-3847 {
        grid-column: 1 / 2;
    }

    .footer-right-3847 {
        grid-column: 2 / 3;
    }
}

@media screen and (max-width: 768px) {
    .map-section-3847 iframe {
        height: 300px;
    }

    .footer-main-3847 {
        grid-template-columns: 1fr;
        gap: 2rem;
        padding: 0 1.5rem 2rem;
    }

    .footer-left-3847,
    .footer-center-3847,
    .footer-right-3847 {
        grid-column: 1;
    }

    .footer-center-3847 {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
    }

    .footer-right-3847 {
        text-align: center;
    }

    .footer-right-3847 h4 {
        text-align: center;
    }
}

@media screen and (max-width: 480px) {
    .footer-center-3847 {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .footer-menu-col-3847 h4 {
        text-align: center;
    }
}

/* ========================================
   4つの強みセクション
   ======================================== */
.features-section-3847 {
    padding: 0;
    background-color: #f9f9f9;
}

.features-container-3847 {
    width: 100%;
    margin: 0 auto;
    padding: 0;
}

.features-header-3847 {
    display: none;
}

.features-header-3847 h2 {
    font-size: 2.8rem;
    font-weight: 600;
    line-height: 1.5;
    color: #191919;
    letter-spacing: 0.05em;
}

.features-list-3847 {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* コース案内セクションの上余白 */
.section-specialisms .section-intro {
    margin-top: 6rem;
}

.feature-item-3847 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    align-items: center;
}

.feature-item-reverse-3847 {
    direction: rtl;
}

.feature-item-reverse-3847 > * {
    direction: ltr;
}

.feature-image-3847 {
    overflow: hidden;
    height: 100%;
}

.feature-image-3847 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    min-height: 220px;
    max-height: 280px;
    transition: transform 0.6s ease;
}

.feature-item-3847:hover .feature-image-3847 img {
    transform: scale(1.05);
}

.feature-content-3847 {
    padding: 3rem 6rem;
}

.feature-number-3847 {
    display: inline-block;
    font-size: 4rem;
    font-weight: 200;
    color: #c9a96e;
    line-height: 1;
    margin-bottom: 1.5rem;
    letter-spacing: 0.05em;
}

.feature-title-3847 {
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1.6;
    color: #191919;
    margin-bottom: 1.5rem;
    letter-spacing: 0.02em;
}

.feature-text-3847 {
    font-size: 1rem;
    line-height: 2;
    color: #555;
    letter-spacing: 0.02em;
}

.sp-only-3847 {
    display: none;
}

/* レスポンシブ - 4つの強みセクション */
@media screen and (max-width: 1024px) {
    .features-section-3847 {
        padding: 6rem 0;
    }

    .features-header-3847 {
        padding: 0 3rem;
    }

    .features-header-3847 h2 {
        font-size: 2.2rem;
    }

    .feature-content-3847 {
        padding: 2rem 3rem;
    }

    .feature-image-3847 img {
        min-height: 350px;
    }

    .feature-number-3847 {
        font-size: 3rem;
    }

    .feature-title-3847 {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 768px) {
    .features-section-3847 {
        padding: 5rem 0;
    }

    .features-header-3847 {
        margin-bottom: 3rem;
        padding: 0 2rem;
    }

    .features-header-3847 h2 {
        font-size: 1.8rem;
    }

    .sp-only-3847 {
        display: block;
    }

    .features-list-3847 {
        gap: 0;
    }

    .feature-item-3847 {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .feature-item-reverse-3847 {
        direction: ltr;
    }

    .feature-image-3847 img {
        min-height: 250px;
    }

    .feature-content-3847 {
        padding: 2rem;
        text-align: center;
        background-color: #fff;
    }

    .feature-number-3847 {
        font-size: 2.5rem;
    }

    .feature-title-3847 {
        font-size: 1.3rem;
    }

    .feature-text-3847 {
        text-align: left;
    }
}

@media screen and (max-width: 480px) {
    .features-section-3847 {
        padding: 4rem 0;
    }

    .features-header-3847 {
        padding: 0 1.5rem;
    }

    .features-header-3847 h2 {
        font-size: 1.5rem;
    }

    .feature-content-3847 {
        padding: 1.5rem;
    }

    .feature-number-3847 {
        font-size: 2rem;
        margin-bottom: 1rem;
    }

    .feature-title-3847 {
        font-size: 1.2rem;
        margin-bottom: 1rem;
    }

    .feature-text-3847 {
        font-size: 0.95rem;
        line-height: 1.8;
    }
}