@charset "UTF-8";
/*
Theme Name: 住まい工房
Author: 住まい工房
Author URI: 
Description: オリジナルテーマ
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* スタッフ一覧のお名前をPC・スマホ共通で2段に最適化 */
.staffArchive__name,
.staffModal__name {
    display: flex;
    flex-direction: column; /* 常に縦並び（2段）にする */
    align-items: flex-start; /* PCでは左に揃える */
}

/* ローマ字部分の余白調整 */
.staffArchive__name--small,
.staffModal__name--small {
    margin-left: 0 !important; /* 元々の左余白を消去 */
    margin-top: 0.3em; /* 漢字とローマ字の間の上下の間隔 */
}

/* ★スマホ表示（画面幅767px以下）の時の設定 */
@media screen and (max-width: 767px) {
    .staffArchive__name,
    .staffModal__name {
        align-items: center; /* スマホでは中央揃えにする */
    }
}

/* SNSボタンを2つにした際の横幅を最適化（PC表示のみ） */
@media screen and (min-width: 768px) {
    .topSns__item {
        width: 45%; /* 元々30%だった幅を少し広げてバランスを整えます */
        max-width: 400px; /* 広がりすぎないように最大幅を設定します */
    }
}

/* トップページのNewsを中央揃えにする設定 */
.topBlogNews__inner {
    display: flex;
    justify-content: center !important;
}

.topBlogNews__section {
    max-width: 1000px; /* 横に広がりすぎるのを防ぐ最大幅 */
    width: 100%;
    margin: 0 auto;
}

/* 1. リスト全体：横並びにしつつ、すべての項目の高さを「一番高いもの」に揃える */
.topStudio__list {
    display: flex !important;
    align-items: stretch !important;
}

/* 2. 各項目：縦並びのフレックスボックスにする */
.topStudio__item {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important; /* 親（リスト全体）の高さに合わせて伸びるようにする */
}

/* 3. テキスト部分：空きスペースをすべて埋めるように伸びる */
.topStudio__textBox {
    flex-grow: 1 !important;
}

/* 4. ボタン：上部の余白を自動計算にして、一番下へ押し下げる */
.topStudio__btn {
    margin-top: auto !important;
}


/* スマホ用画像は、最初は「非表示」にしておく */
.img-sp {
    display: none;
}

/* PC用画像は「表示」にする */
.img-pc {
    display: block;
    width: 100%;
    height: auto;
}

/* 画面幅が768px以下（スマホ表示）の場合の切り替えルール */
@media screen and (max-width: 768px) {
    /* PC用画像を「非表示」に切り替える */
    .img-pc {
        display: none;
    }
    
    /* スマホ用画像を「表示」に切り替える */
    .img-sp {
        display: block;
        width: 100%;
        height: auto;
    }
}