@charset "UTF-8";

/* ==========================================================================
   1. 共通設定 (Base & Common)
   ========================================================================== */
body { 
    margin: 0; padding: 0; 
    font-family: "Noto Serif JP", serif; 
    color: #333; overflow-x: hidden; line-height: 1.8; 
}
.pagewidth { 
    width: 95%; max-width: 2150px; 
    margin: 0 auto; position: relative; 
}

/* ==========================================================================
   2. ヘッダー (Header & Navigation) - バックアップを完全維持
   ========================================================================== */
#headerwrap { padding: 20px 0 0 0; background: #fff; }
.header-top { display: flex; justify-content: space-between; align-items: center; width: 100%; }
.h_info { display: flex; align-items: center; margin-left: auto; }
.h_tel { font-size: 30px; font-weight: 700; margin-right: 30px; display: flex; align-items: center; white-space: nowrap; }
.h_tel i { margin-right: 15px; }
.h_btns_area { display: flex; gap: 10px; }
.h_btn { 
    display: inline-block; padding: 10px 20px; 
    background: #000; color: #fff !important; 
    text-decoration: none; border-radius: 4px; 
    font-size: 15px; font-weight: 700; transition: 0.3s; 
}
.h_btn:hover { background: #5da6ff !important; transform: translateY(-2px); }
.h_btn_blue { background: #5da6ff !important; }
#menu-button { display: none !important; }
#main-menu-container { display: flex; justify-content: flex-end; width: 100%; margin-top: 10px; margin-bottom: 40px; }
#main-menu { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; justify-content: flex-end; }
#main-menu > li { margin-left: 25px; position: relative; }
#main-menu > li > a { display: block; padding: 10px 0; color: #333; text-decoration: none; font-size: 16px; font-weight: 700; transition: 0.3s; white-space: nowrap; }
#main-menu > li > a:hover { color: #5da6ff; }
.sub-menu { 
    display: none; position: absolute; top: 100%; left: 0; 
    background: #fff; list-style: none; padding: 10px 0; 
    min-width: 200px; box-shadow: 0 5px 15px rgba(0,0,0,0.1); 
    z-index: 100; border-top: 2px solid #5da6ff; 
}
.menu-item-has-children:hover .sub-menu { display: block; }
.sub-menu li a { display: block; padding: 12px 20px; text-decoration: none; color: #333 !important; font-size: 15px; border-bottom: 1px solid #eee; transition: 0.3s; }

/* ==========================================================================
   3. 全体共通パーツ (Shared Modules)
   ========================================================================== */

/* 見出し（PCは左寄せ） */
.fancy-heading { 
    margin-bottom: 40px; display: flex; flex-direction: column; align-items: flex-start; 
}
/* 英字：明るいブルー */
.en-head { 
    font-size: 45px; /* ★大きすぎたので60pxから45pxに調整しました */
    font-weight: 900; color: #5da6ff; 
    line-height: 1.1; letter-spacing: 0.05em; font-family: sans-serif; display: block;
}
/* カタカナ：独立して左揃え */
.ja-head { 
    font-size: 26px; font-weight: 700; color: #333; 
    position: static; margin: 10px 0 0 0; line-height: 1.2; display: block; transform: none;
}

/* 共通：標準ボタン（210px固定） */
.btn-more { 
    display: inline-block; width: 210px; height: 48px; line-height: 48px; 
    background: #000; color: #fff !important; text-decoration: none; 
    font-size: 16px; font-weight: 700; text-align: center; transition: 0.3s; border-radius: 5px; 
}
.btn-more:hover { background: #5da6ff !important; transform: translateY(-3px); }

/* ==========================================================================
   4. 各セクション固有スタイル
   ========================================================================== */

/* メインビジュアル */
.main-visual-wrapper { width: 100%; position: relative; overflow: hidden; }
.main-visual-img { width: 85%; max-width: 1598px; position: relative; margin: 0; }
.main-visual-img img { width: 100%; height: auto; display: block; }
.slide-animation { animation: slideToLeftEnd 1.8s cubic-bezier(0.19, 1, 0.22, 1) forwards; }
@keyframes slideToLeftEnd { 0% { transform: translateX(50vw) scale(1.1); opacity: 0; } 100% { transform: translateX(0) scale(1); opacity: 1; } }

/* 1. コンセプト */
.concept-section { padding: 100px 0; }
.concept-container { display: flex; align-items: center; gap: 80px; justify-content: space-between; }
.concept-image { flex: 0 0 40%; }
.concept-image img { width: 100%; height: auto; display: block; }
.concept-text { flex: 1; }
.concept-btn-area { margin-top: 40px; text-align: left; } /* PCは左寄せ */

/* 2. ミニギャラリー (バックアップ維持) */
.mini-gallery {
    padding-bottom: 100px;
}

.gallery-grid {
    display: grid;
    /* 横3列（同じ幅） */
    grid-template-columns: 1fr 1fr 1fr;
    /* 縦2段（同じ高さに強制） */
    grid-template-rows: 1fr 1fr;
    /* 溝の幅を10pxで統一 */
    gap: 10px;
}

/* 1〜4枚目 */
.gallery-item {
    /* 比率指定を消して、グリッドの枠いっぱいに広がるようにします */
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: #000;
}

/* ★5枚目（右側の縦長） */
.gallery-item.last-full {
    grid-row: 1 / 3;  /* 1段目から2段目までぶち抜き */
    grid-column: 3 / 4; /* 3列目 */
}

.gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.6s;
    opacity: 0.9;
}

/* 5枚目：大事な情報を切らない */
.gallery-item.last-full img {
    object-fit: contain;
    background: #fff;
}

.gallery-item:hover img {
    transform: scale(1.1);
    opacity: 1;
}
/* 3. 注意書き */
.important-notice { padding-bottom: 100px; }
.notice-box { 
    background: #fdf2f2; border: 2px solid #ffcfcf; padding: 40px; 
    border-radius: 10px; display: flex; align-items: flex-start; gap: 20px; 
    max-width: 1200px; margin: 0 auto; 
}

/* 4. NEWS */
.news-section-full { background: #f0f4f8; padding: 100px 0; width: 100%; }
.news-list { border-top: 1px solid #ccc; margin-bottom: 30px; }
.news-item a { 
    display: flex; align-items: center; padding: 25px 15px; 
    border-bottom: 1px solid #ccc; text-decoration: none; 
    color: #333 !important; transition: 0.3s; 
}
.news-item a:hover { background: #fff; transform: translateX(10px); }
.news-title { font-size: 18px; margin: 0; font-weight: 700; flex: 1; color: #333 !important; }
.news-category { background: #5da6ff; color: #fff; padding: 2px 12px; font-size: 12px; border-radius: 3px; margin-right: 20px; font-weight: 700; }
.news-date { color: #666; width: 120px; font-weight: 700; }
.news-btn-area { text-align: left; } /* PCは左寄せ */

/* 5. SCHOOL (訓練内容) */
.school-section { padding-bottom: 100px; background: #fff; margin-top: 50px; }
.school-content { margin-top: 60px; }
.school-row { display: flex; align-items: center; gap: 60px; margin-bottom: 100px; }
.school-row.reverse { flex-direction: row-reverse; }
.school-text { flex: 1; }
.school-image { flex: 1; overflow: hidden; border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,0.1); }
.school-image img { width: 100%; height: auto; display: block; }
.school-title { font-size: 28px; font-weight: 700; margin-bottom: 20px; position: relative; padding-bottom: 15px; }
.school-title::after { content: ""; position: absolute; left: 0; bottom: 0; width: 60px; height: 3px; background: #5da6ff; }
.school-text p { margin-bottom: 25px; font-size: 16px; color: #555; text-align: justify; }

/* 6. DOG HOTEL */
.hotel-visual-section {
    width: 100%; height: 480px; 
    background: url('images/index_24.jpg') no-repeat center center / cover;
    position: relative; display: flex; align-items: center; margin-top: 70px; 
}
.hotel-visual-inner { width: 100%; }
.hotel-white-btn {
    background: #000 !important;
    color: #fff !important;
    margin-top: 35px; 
}

/* 7. DOG FIELD (グランド貸し出し) - ★修正の核心 */
.new-field-section {
    width: 100%; height: 520px;
    background: url('images/index_25.jpg') no-repeat center center / cover;
    position: relative; display: flex; align-items: center; margin-top: 0;
}
/* ★もやを削除 */
.new-field-section::before { display: none; }

/* ★ここが重要：pagewidth共通枠に閉じることで、ホテルと位置を完全に統一 */
.field-inner { position: relative; z-index: 2; width: 95%; max-width: 2150px; margin: 0 auto; }

/* ★タイトル：ホテルの見出し位置と統一 */
.field-titles { 
    display: flex; flex-direction: column; align-items: flex-start;
}
.field-en {
    color: #5da6ff; font-size: 45px; /* ここも共通の45pxに合わせました */
    font-weight: 900;
    line-height: 1.1; display: block; font-family: sans-serif; letter-spacing: 0.05em;
}
.field-ja {
    color: #333; font-size: 26px; font-weight: 700;
    margin: 10px 0 0 0; display: block; position: static; transform: none;
}

/* ★ボタン：カタカナ見出しの真下に縦並び */
.field-actions { 
    margin-top: 35px; display: flex; flex-direction: column; gap: 15px; align-items: flex-start; 
}
.field-btn {
    display: inline-block; width: 210px; height: 48px; line-height: 48px; 
    text-align: center; font-size: 16px; font-weight: 700; 
    text-decoration: none; border-radius: 5px; transition: 0.3s;
}
.btn-black { background: #000 !important; color: #fff !important; }
.btn-blue { background: #5da6ff !important; color: #fff !important; }
.field-btn:hover { transform: translateY(-3px); background: #ff9900 !important; }

.new-field-section .en-head {
    color: #ffffff !important;
}
/* ブルーのボタン（犬具販売、ご予約はこちら）にマウスを乗せた時にオレンジにする */
.h_btn_blue:hover, 
.new-field-section .btn-blue:hover {
    background: #ff9900 !important;
}
/* ==========================================================================
   5. スマホレスポンシブ (Responsive) - 1024px以下
   ========================================================================== */
@media screen and (max-width: 1024px) {
    .pagewidth { width: 90%; }
    
    /* ヘッダー・メニュー調整 */
    .header-top { flex-direction: column; padding-bottom: 20px; position: relative; }
    .h_info { flex-direction: column; width: 100%; align-items: center; margin-bottom: 20px; }
    .h_tel { margin-right: 0; margin-bottom: 15px; font-size: 24px; }
    .h_btns_area { flex-direction: column; width: 100%; align-items: center; gap: 10px; }
    .h_btn { width: 95%; text-align: center; }
    #menu-button { display: flex !important; flex-direction: column; align-items: center; position: absolute; right: 0; top: 10px; z-index: 1100; cursor: pointer; }
    .ham-icon { width: 30px; height: 22px; position: relative; }
    .ham-icon span { display: block; width: 100%; height: 3px; background: #333; position: absolute; left: 0; transition: 0.4s; }
    .ham-icon span:nth-child(1) { top: 0; }
    .ham-icon span:nth-child(2) { top: 9px; }
    .ham-icon span:nth-child(3) { bottom: 0; }
    #menu-button.active .ham-icon span:nth-child(1) { transform: translateY(9px) rotate(45deg); }
    #menu-button.active .ham-icon span:nth-child(2) { opacity: 0; }
    #menu-button.active .ham-icon span:nth-child(3) { transform: translateY(-10px) rotate(-45deg); }
    #main-menu-container { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: #fff; z-index: 1000; padding-top: 100px; overflow-y: auto; }
    #main-menu-container.is-open { display: block; }
    #main-menu { flex-direction: column; align-items: center; }
    #main-menu > li { margin-left: 0; width: 100%; border-bottom: 1px solid #eee; text-align: center; }

    /* 全体共通の中央寄せ */
    .fancy-heading { align-items: center; text-align: center; }
    .concept-btn-area, .news-btn-area, .hotel-btn-area, .field-actions { display: flex; justify-content: center; width: 100%; align-items: center; }
    .btn-more, .field-btn { width: 210px; margin: 0 auto; }

    /* 各セクションの縦並び調整 */
    .main-visual-img { width: 100% !important; margin: 0 !important; animation: none !important; }
    .concept-container, .school-row { flex-direction: column !important; gap: 40px; text-align: center; }
    
@charset "UTF-8";

/* ==========================================================================
   1. 共通設定 (Base & Common)
   ========================================================================== */
body { 
    margin: 0; padding: 0; 
    font-family: "Noto Serif JP", serif; 
    color: #333; overflow-x: hidden; line-height: 1.8; 
}
.pagewidth { 
    width: 95%; max-width: 2150px; 
    margin: 0 auto; position: relative; 
}

/* ==========================================================================
   2. ヘッダー (Header & Navigation) - バックアップを完全維持
   ========================================================================== */
#headerwrap { padding: 20px 0 0 0; background: #fff; }
.header-top { display: flex; justify-content: space-between; align-items: center; width: 100%; }
.h_info { display: flex; align-items: center; margin-left: auto; }
.h_tel { font-size: 30px; font-weight: 700; margin-right: 30px; display: flex; align-items: center; white-space: nowrap; }
.h_tel i { margin-right: 15px; }
.h_btns_area { display: flex; gap: 10px; }
.h_btn { 
    display: inline-block; padding: 10px 20px; 
    background: #000; color: #fff !important; 
    text-decoration: none; border-radius: 4px; 
    font-size: 15px; font-weight: 700; transition: 0.3s; 
}
.h_btn:hover { background: #5da6ff !important; transform: translateY(-2px); }
.h_btn_blue { background: #5da6ff !important; }
#menu-button { display: none !important; }
#main-menu-container { display: flex; justify-content: flex-end; width: 100%; margin-top: 10px; margin-bottom: 40px; }
#main-menu { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; justify-content: flex-end; }
#main-menu > li { margin-left: 25px; position: relative; }
#main-menu > li > a { display: block; padding: 10px 0; color: #333; text-decoration: none; font-size: 16px; font-weight: 700; transition: 0.3s; white-space: nowrap; }
#main-menu > li > a:hover { color: #5da6ff; }
.sub-menu { 
    display: none; position: absolute; top: 100%; left: 0; 
    background: #fff; list-style: none; padding: 10px 0; 
    min-width: 200px; box-shadow: 0 5px 15px rgba(0,0,0,0.1); 
    z-index: 100; border-top: 2px solid #5da6ff; 
}
.menu-item-has-children:hover .sub-menu { display: block; }
.sub-menu li a { display: block; padding: 12px 20px; text-decoration: none; color: #333 !important; font-size: 15px; border-bottom: 1px solid #eee; transition: 0.3s; }

/* ==========================================================================
   3. 全体共通パーツ (Shared Modules)
   ========================================================================== */

/* 見出し（PCは左寄せ） */
.fancy-heading { 
    margin-bottom: 40px; display: flex; flex-direction: column; align-items: flex-start; 
}
/* ヘッダー以外のボディ部分の入れ子だけを 1800px に制限する */
main .pagewidth, 
section .pagewidth {
    max-width: 1800px !important;
}
/* 英字：明るいブルー */
.en-head { 
    font-size: 45px; /* ★大きすぎたので60pxから45pxに調整しました */
    font-weight: 900; color: #5da6ff; 
    line-height: 1.1; letter-spacing: 0.05em; font-family: sans-serif; display: block;
}
/* カタカナ：独立して左揃え */
.ja-head { 
    font-size: 26px; font-weight: 700; color: #333; 
    position: static; margin: 10px 0 0 0; line-height: 1.2; display: block; transform: none;
}

/* 共通：標準ボタン（210px固定） */
.btn-more { 
    display: inline-block; width: 210px; height: 48px; line-height: 48px; 
    background: #000; color: #fff !important; text-decoration: none; 
    font-size: 16px; font-weight: 700; text-align: center; transition: 0.3s; border-radius: 5px; 
}
.btn-more:hover { background: #5da6ff !important; transform: translateY(-3px); }

/* ==========================================================================
   4. 各セクション固有スタイル
   ========================================================================== */

/* メインビジュアル */
.main-visual-wrapper { width: 100%; position: relative; overflow: hidden; }
.main-visual-img { width: 85%; max-width: 1598px; position: relative; margin: 0; }
.main-visual-img img { width: 100%; height: auto; display: block; }
.slide-animation { animation: slideToLeftEnd 1.8s cubic-bezier(0.19, 1, 0.22, 1) forwards; }
@keyframes slideToLeftEnd { 0% { transform: translateX(50vw) scale(1.1); opacity: 0; } 100% { transform: translateX(0) scale(1); opacity: 1; } }

/* 1. コンセプト */
.concept-section { padding: 100px 0; }
.concept-container { display: flex; align-items: center; gap: 80px; justify-content: space-between; }
.concept-image { flex: 0 0 40%; }
.concept-image img { width: 100%; height: auto; display: block; }
.concept-text { flex: 1; }
.concept-btn-area { margin-top: 40px; text-align: left; } /* PCは左寄せ */

/* 2. ミニギャラリー (バックアップ維持) */
.mini-gallery { padding-bottom: 100px; }
.gallery-grid { display: flex; gap: 10px; }
.gallery-item { flex: 1; aspect-ratio: 3 / 2; overflow: hidden; background: #000; }
.gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: 0.6s; opacity: 0.9; }
.gallery-item:hover img { transform: scale(1.15); opacity: 1; }

/* 3. 注意書き */
.important-notice { padding-bottom: 100px; }
.notice-box { 
    background: #fdf2f2; border: 2px solid #ffcfcf; padding: 40px; 
    border-radius: 10px; display: flex; align-items: flex-start; gap: 20px; 
    max-width: 1200px; margin: 0 auto; 
}

/* 4. NEWS */
.news-section-full { background: #f0f4f8; padding: 100px 0; width: 100%; }
.news-list { border-top: 1px solid #ccc; margin-bottom: 30px; }
.news-item a { 
    display: flex; align-items: center; padding: 25px 15px; 
    border-bottom: 1px solid #ccc; text-decoration: none; 
    color: #333 !important; transition: 0.3s; 
}
.news-item a:hover { background: #fff; transform: translateX(10px); }
.news-title { font-size: 18px; margin: 0; font-weight: 700; flex: 1; color: #333 !important; }
.news-category { background: #5da6ff; color: #fff; padding: 2px 12px; font-size: 12px; border-radius: 3px; margin-right: 20px; font-weight: 700; }
.news-date { color: #666; width: 120px; font-weight: 700; }
.news-btn-area { text-align: left; } /* PCは左寄せ */

/* 5. SCHOOL (訓練内容) */
.school-section { padding-bottom: 100px; background: #fff; margin-top: 50px; }
.school-content { margin-top: 60px; }
.school-row { display: flex; align-items: center; gap: 60px; margin-bottom: 100px; }
.school-row.reverse { flex-direction: row-reverse; }
.school-text { flex: 1; }
.school-image { flex: 1; overflow: hidden; border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,0.1); }
.school-image img { width: 100%; height: auto; display: block; }
.school-title { font-size: 28px; font-weight: 700; margin-bottom: 20px; position: relative; padding-bottom: 15px; }
.school-title::after { content: ""; position: absolute; left: 0; bottom: 0; width: 60px; height: 3px; background: #5da6ff; }
.school-text p { margin-bottom: 25px; font-size: 16px; color: #555; text-align: justify; }

/* 6. DOG HOTEL */
.hotel-visual-section {
    width: 100%; height: 480px; 
    background: url('images/index_24.jpg') no-repeat center center / cover;
    position: relative; display: flex; align-items: center; margin-top: 70px; 
}
.hotel-visual-inner { width: 100%; }
.hotel-white-btn {
    background: #000 !important;
    color: #fff !important;
    margin-top: 35px; 
}

/* 7. DOG FIELD (グランド貸し出し) - ★修正の核心 */
.new-field-section {
    width: 100%; height: 520px;
    background: url('images/index_25.jpg') no-repeat center center / cover;
    position: relative; display: flex; align-items: center; margin-top: 0;
}
/* ★もやを削除 */
.new-field-section::before { display: none; }

/* ★ここが重要：pagewidth共通枠に閉じることで、ホテルと位置を完全に統一 */
.field-inner { position: relative; z-index: 2; width: 95%; max-width: 2150px; margin: 0 auto; }

/* ★タイトル：ホテルの見出し位置と統一 */
.field-titles { 
    display: flex; flex-direction: column; align-items: flex-start;
}
.field-en {
    color: #5da6ff; font-size: 45px; /* ここも共通の45pxに合わせました */
    font-weight: 900;
    line-height: 1.1; display: block; font-family: sans-serif; letter-spacing: 0.05em;
}
.field-ja {
    color: #333; font-size: 26px; font-weight: 700;
    margin: 10px 0 0 0; display: block; position: static; transform: none;
}

/* ★ボタン：カタカナ見出しの真下に縦並び */
.field-actions { 
    margin-top: 35px; display: flex; flex-direction: column; gap: 15px; align-items: flex-start; 
}
.field-btn {
    display: inline-block; width: 210px; height: 48px; line-height: 48px; 
    text-align: center; font-size: 16px; font-weight: 700; 
    text-decoration: none; border-radius: 5px; transition: 0.3s;
}
.btn-black { background: #000 !important; color: #fff !important; }
.btn-blue { background: #5da6ff !important; color: #fff !important; }
.field-btn:hover { transform: translateY(-3px); background: #ff9900 !important; }

.new-field-section .en-head {
    color: #ffffff !important;
}
/* ブルーのボタン（犬具販売、ご予約はこちら）にマウスを乗せた時にオレンジにする */
.h_btn_blue:hover, 
.new-field-section .btn-blue:hover {
    background: #ff9900 !important;
}
/* ==========================================================================
   5. スマホレスポンシブ (Responsive) - 1024px以下
   ========================================================================== */
@media screen and (max-width: 1024px) {
    .pagewidth { width: 90%; }
    
    /* ヘッダー・メニュー調整 */
    .header-top { flex-direction: column; padding-bottom: 20px; position: relative; }
    .h_info { flex-direction: column; width: 100%; align-items: center; margin-bottom: 20px; }
    .h_tel { margin-right: 0; margin-bottom: 15px; font-size: 24px; }
    .h_btns_area { flex-direction: column; width: 100%; align-items: center; gap: 10px; }
    .h_btn { width: 95%; text-align: center; }
    #menu-button { display: flex !important; flex-direction: column; align-items: center; position: absolute; right: 0; top: 10px; z-index: 1100; cursor: pointer; }
    .ham-icon { width: 30px; height: 22px; position: relative; }
    .ham-icon span { display: block; width: 100%; height: 3px; background: #333; position: absolute; left: 0; transition: 0.4s; }
    .ham-icon span:nth-child(1) { top: 0; }
    .ham-icon span:nth-child(2) { top: 9px; }
    .ham-icon span:nth-child(3) { bottom: 0; }
    #menu-button.active .ham-icon span:nth-child(1) { transform: translateY(9px) rotate(45deg); }
    #menu-button.active .ham-icon span:nth-child(2) { opacity: 0; }
    #menu-button.active .ham-icon span:nth-child(3) { transform: translateY(-10px) rotate(-45deg); }
    #main-menu-container { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: #fff; z-index: 1000; padding-top: 100px; overflow-y: auto; }
    #main-menu-container.is-open { display: block; }
    #main-menu { flex-direction: column; align-items: center; }
    #main-menu > li { margin-left: 0; width: 100%; border-bottom: 1px solid #eee; text-align: center; }

    /* 全体共通の中央寄せ */
    .fancy-heading { align-items: center; text-align: center; }
    .concept-btn-area, .news-btn-area, .hotel-btn-area, .field-actions { display: flex; justify-content: center; width: 100%; align-items: center; }
    .btn-more, .field-btn { width: 210px; margin: 0 auto; }

    /* 各セクションの縦並び調整 */
    .main-visual-img { width: 100% !important; margin: 0 !important; animation: none !important; }
    .concept-container, .school-row { flex-direction: column !important; gap: 40px; text-align: center; }
    
/* 各セクションの縦並び調整 */
    .main-visual-img { width: 100% !important; margin: 0 !important; animation: none !important; }
    
    /* コンセプトとスクールの基本設定 */
    .concept-container, .school-row { 
        display: flex !important;
        flex-direction: column-reverse !important; /* ★ここを reverse にして写真を上に持っていく */
        gap: 40px; 
        text-align: center; 
    }
    
    /* 教室メニュー（元々 reverse がついているもの） */
    .school-row.reverse { 
        flex-direction: column-reverse !important; /* ★こちらも共通で写真を上に */
        gap: 40px; 
        text-align: center; 
    }

    /* ホテル・フィールドの特別中央寄せ */
    .hotel-inner.pagewidth,
    .field-inner.pagewidth {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        margin: 0 auto !important;
        left: 0 !important;
    }

    /* ギャラリー・その他 */
    .gallery-grid { flex-wrap: wrap; }
    .gallery-item { flex: 0 0 calc(50% - 5px); }
    .last-full { flex: 0 0 100% !important; }
    .hotel-visual-section, .new-field-section { height: 400px; }
    .field-en { font-size: 38px; }
    .field-ja { font-size: 22px; }
}

    /* ホテル・フィールドの特別中央寄せ */
    .hotel-inner.pagewidth,
    .field-inner.pagewidth {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        margin: 0 auto !important;
        left: 0 !important;
    }

    /* ギャラリー・その他 */
    .gallery-grid { flex-wrap: wrap; }
    .gallery-item { flex: 0 0 calc(50% - 5px); }
    .last-full { flex: 0 0 100% !important; }
    .hotel-visual-section, .new-field-section { height: 400px; }
    .field-en { font-size: 38px; }
    .field-ja { font-size: 22px; }
	
/* about.html専用：既存のレイアウトに影響を与えない独立した設定 */
.policy-center-layout {
    padding: 100px 0;
    text-align: center; /* 内部のテキストを中央へ */
}

/* 見出し専用：既存の .fancy-heading とは別に「中央用」として定義 */
.policy-center-heading {
    margin-bottom: 60px;
    display: block; /* Flexを使わず、単純なブロックとして扱う */
}

/* 本文専用：横幅を抑えて中央に置く */
.policy-center-body {
    max-width: 1000px;
    margin: 0 auto;
    font-size: 24px; /* 年配の方向けサイズ */
    line-height: 2.2;
    font-family: "Noto Serif JP", serif;
}
/* 追加CSS：施設案内セクション専用の背景設定 */
.bg-gray-full {
    background-color: #f7f7f7; /* 薄いグレー */
    width: 100%;
    padding: 100px 0;
}