/* ============================================= */
/* == 基本設定・ユーティリティ == */
/* ============================================= */
@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);

/* フォント定義: 'roman' */
@font-face {
  font-family: 'roman';
  src: url("../../../font/RomanMinchoEGP-Ultra-SJIS-02.ttf") format('truetype'),
       url("../../../font/RomanMinchoEGP-Ultra-SJIS-02.woff") format('woff');
}

/* フォント定義: 'Ethnocentric' */
@font-face {
  font-family: 'Ethnocentric';
  src: url('../../../font/ethnocentricrg.woff2') format('woff2'); /* format修正 */
  font-weight: normal;
  font-style: normal;
}

/* 遅延読み込み */
.lazy-load-section {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}
.lazy-load-section.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ワイドレイアウト用ラッパー (ネガティブマージン版) */
.full-width-section {
    position: relative;
    margin-left: -10px !important;
    margin-right: -20px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box;
}

/* コンテンツ幅制御コンテナ */
.content-inner {
    max-width: calc(1000px - 50px);
    margin: 0 auto;
    padding: 60px 30px 60px 20px;
    position: relative;
    z-index: 1;
}

/* 一般的なH3 (緑背景) - 注意: 設備紹介H3は別途指定 */
h3 {
    text-align: center;
    font-size: 2.1rem;
    font-weight: bold;
    color: #333;
    background-color:#015300;
    margin-bottom: 40px;
    position: relative;
    padding:6px 10px;
}

/* 一般的なH4 (緑タブ) - 注意: 設備紹介H4は別途指定 */
h4 {
    background-color: #03c46a;
    color: #fff;
    font-size: 1.6rem;
    font-weight: bold;
    padding: 10px 20px;
    border-radius: 8px 8px 0 0;
    display: inline-block;
    margin-top: 45px;
    margin-bottom: 0;
}
h4:first-of-type { /* ページ内で最初に出現するH4のマージン調整 */
    margin-top: 0;
}

/* #contents の上マージンをリセット (ワイドテンプレート用) */
div#contents{
	margin-top:0 !important;
}


/* ============================================= */
/* == アンカーナビゲーション (Sticky Header) == */
/* ============================================= */

/* なめらかスクロールを有効化 */
html {
    scroll-behavior: smooth;
    /*scroll-padding-top: 60px;*/ /* ★ ヘッダーの高さ分、ジャンプ位置をずらす */
}

/* ナビゲーションバー本体 */
.anchor-nav-sticky-wrapper {
    position: -webkit-sticky;
    position: sticky;
    top: 0; /* 画面の一番上に固定 */
    z-index: 100;
    
    /* 矢印の基準位置 */
    position: relative; 
    
    /* ネガティブマージンもこちらに移動 */
    /*margin-left: -10px !important; 
    margin-right: -20px !important;*/
}

.anchor-nav {
    background-color: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-bottom: 1px solid #ddd;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    
    /* ▼ .full-width-section のスタイルが適用されていることを確認 ▼ */
    position: relative;
    margin-left: -10px !important;
    margin-right: -20px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box;
}

.anchor-nav-inner {
    max-width: 900px; /* コンテンツ幅と合わせる */
    margin: 0 auto;
    padding: 0 10px; /* 左右の余白 */
}

.anchor-nav ul {
    display: flex;
    justify-content: space-between; /* 均等配置 */
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
}

.anchor-nav li {
    flex-grow: 1; /* 均等に幅を分ける */
}

.anchor-nav li a {
    display: block;
    padding: 18px 10px; /* ボタンの大きさ */
    text-align: center;
    text-decoration: none !important;
    color: #333;
    font-weight: bold;
    font-size: 0.95rem;
    border-bottom: 3px solid transparent; /* ホバー用の下線準備 */
    transition: color 0.3s ease, border-color 0.3s ease;
}

/* ホバー時とフォーカス時 */
.anchor-nav li a:hover,
.anchor-nav li a:focus {
    color: #03c46a; /* キーカラー */
    border-bottom-color: #03c46a; /* ホバーで下線 */
}

/* --- アンカーナビ レスポンシブ --- */
@media (max-width: 768px) {
    html {
        scroll-padding-top: 50px;
    }
    
    .anchor-nav {
        overflow-x: auto;
        -ms-overflow-style: none;
        scrollbar-width: none;
        position: sticky;
    }
    .anchor-nav::-webkit-scrollbar {
        display: none;
    }
    
    
    /* ▼ 矢印のセレクタ ▼ */
    .anchor-nav-sticky-wrapper::before,
    .anchor-nav-sticky-wrapper::after {
        content: '›';
        position: absolute;
        top: 0;
        bottom: 0;
        width: 40px;
        display: flex;
        align-items: center;
        color: #666;
        font-size: 1.8rem;
        font-weight: bold;
        pointer-events: none;
        z-index: 2;
        /* ▼ FADE-IN/OUT のための transition を追加 ▼ */
        opacity: 1;
        transition: opacity 0.2s ease;
    }
    
    /* ▼ 左矢印のスタイル ▼ */
    .anchor-nav-sticky-wrapper::before {
        content: '‹';
        left: 0;
        justify-content: flex-start;
        padding-left: 10px;
        background: linear-gradient(to right, 
            rgba(255, 255, 255, 0.95) 60%, 
            rgba(255, 255, 255, 0) 100%
        );
    }
    
    /* ▼ 右矢印のスタイル ▼ */
    .anchor-nav-sticky-wrapper::after {
        content: '›';
        right: 0;
        justify-content: flex-end;
        padding-right: 20px;
        background: linear-gradient(to left, 
            rgba(255, 255, 255, 0.95) 60%, 
            rgba(255, 255, 255, 0) 100%
        );
    }
    
    
    /* ▼ JSで制御するための「非表示」スタイルを追加 ▼ */
    .anchor-nav-sticky-wrapper.at-left::before {
        opacity: 0; /* 左端の時は左矢印を消す */
    }
    .anchor-nav-sticky-wrapper.at-right::after {
        opacity: 0; /* 右端の時は右矢印を消す */
    }
    
    
    
    .anchor-nav-inner {
         max-width: none;
         padding: 0;
         /* ▼ スクロール内容が矢印の下を通るようにパディングを追加 ▼ */
         padding-left: 40px;
         padding-right: 40px;
    }

    .anchor-nav ul {
        justify-content: flex-start;
        width: auto; 
        position: relative; /* z-indexを効かせるため */
        z-index: 1; /* 矢印(z-index: 2) の下 */
    }
    
    .anchor-nav li a {
        padding: 15px 12px;
        font-size: 0.9rem;
        white-space: nowrap;
    }
}




/* ============================================= */
/* == キャッチエリア == */
/* ============================================= */

/* ▼ catchAreaを囲む full-width-section のスタイル */
.full-width-section.catch-bg {
    min-height: 70vh;
    background-image:
        linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
        url("../img/title.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ▼ catchArea内の .content-inner のパディング調整 */
.full-width-section.catch-bg .content-inner {
    padding-top: 40px;
    padding-bottom: 40px;
    width: 100%;
}

/* ▼ catchArea自体のスタイル調整 (H2とcatchTxtを縦積み/中央揃え) */
.catchArea {
    width: 100%;
    display: flex;
    flex-direction: column;  /* H2とcatchTxtを縦積みに */
    justify-content: center; /* 垂直方向の中央揃え */
    align-items: center;    /* 水平方向の中央揃え */
    text-align: center;
    padding: 40px 0; /* 上下の余白 */
    box-sizing: border-box;
    /* 競合する min-height, background* プロパティは削除 */
}

/* キャッチエリア内の H2 スタイル */
.catchArea h2 {
    background: none !important;
    padding: 0 !important;
    font-size: 1.5rem;
    font-weight: bold;
    color: rgba(255, 255, 255, 0.85);
    text-align: center;
    letter-spacing: 2px;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
    /*border-bottom: 1px solid rgba(255, 255, 255, 0.3);*/
    padding-bottom: 15px;
    width: 100%;
    max-width: 1100px;
    margin: 0 auto 25px auto !important;
}

h2.fv-catchphrase {
    font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
    /* ▼ clamp() の値を少し小さく調整 ▼ */
    font-size: clamp(1.8rem, 5vw, 4rem) !important; 
    font-weight: 900;
    color: #fff;
    line-height: 1.3;
    margin: 10px 0 25px;
    text-shadow:
        0 0 5px rgba(10, 218, 115, 0.5),
        0 0 15px rgba(10, 218, 115, 0.4),
        0 0 30px rgba(10, 218, 115, 0.3);
    white-space: nowrap; /* ★ 改行を防ぐ */
	/*border-bottom: 1px solid rgba(255, 255, 255, 0.3);*/
	position: relative; /* ★ 擬似要素配置の基準 */
    padding-bottom: 20px; /* ★ 下線のスペースを確保 */
}

/* キャッチフレーズ下のアクセントライン */
h2.fv-catchphrase::after {
    content: '';
    display: block;
    position: absolute; /* h2を基準に配置 */
    bottom: 0; /* h2の下端(paddingの内側)に配置 */
    left: 50%; /* 中央寄せ */
    transform: translateX(-50%); /* 中央寄せ */
    
    width: 100%; /* 線の長さ (テキストより短く) */
    height: 4px; /* 線の太さ */
    background-color: rgba(10, 218, 115, 0.5);
    border-radius: 2px; /* 線の角を少し丸くする */
}

/* --- スマートフォンでの h2.fv-catchphrase 改行許可 --- */
@media (max-width: 600px) { 
    h2.fv-catchphrase {
        white-space: normal !important; 
        padding-bottom: 15px; /* スマホでは下パディング少し詰める */
    }
    /* スマホでは線を少し細く短くする */
    h2.fv-catchphrase::after {
        width: 70px;
        height: 3px;
    }
}


/* ============================================= */
/* == アカデミーロゴ (キャッチエリア内) == */
/* ============================================= */
.academy-logos {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px; /* ★ 15px から 10px に詰める */
    width: 100%;
    max-width: 800px;
    margin: 0 auto 25px auto; /* ★ 下マージンを 40px から 25px に詰める */
}

.academy-logos .main-title {
    font-family: 'Ethnocentric', sans-serif;
    font-weight: normal;
    font-size: clamp(1.1rem, 2.5vw, 1.6rem);
    color: #fff;
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7);
    text-transform: uppercase;
    letter-spacing: 1.5px;
    line-height: 1.4;
    
    width: 100%;
    text-align: center;
    margin: 0;
    padding: 5px; /* ★ 上下のパディングも少し詰める */
    box-sizing: border-box;
    
    background: none;
    border: none;
}

/* --- レスポンシブ調整 --- */
@media (max-width: 600px) {
    .academy-logos {
        gap: 15px;
        margin-bottom: 20px;
    }
    .academy-logos .main-title {
        width: 90%; /* スマホでは縦並びで幅を広げる */
        font-size: 1.1rem;
    }
}


/* キャッチコピー全体のコンテナ (.catchTxt) */
.catchTxt {
    color: #fff;
    width: 100%;
    padding: 0 20px 60px;
    box-sizing: border-box;
}

/* サブメッセージ */
.catchTxt .sub-message {
    font-size: clamp(1rem, 2.5vw, 1.2rem);
    font-weight: bold;
    color: #f0f0f0;
    margin: 0 0 10px;
    letter-spacing: 1px;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
}

/* メインタイトル */
.main-title-visual {
    font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
    font-size: clamp(2rem, 6vw, 4.5rem);
    font-weight: 900;
    color: #fff;
    line-height: 1.3;
    margin: 10px 0;
    text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.6);
}
.main-title-visual .responsive-break {
	display: none;
}

/* 説明文 */
.catch-description {
    font-size: clamp(0.9rem, 2vw, 1.1rem);
    color: rgba(255, 255, 255, 0.9) !important;
    line-height: 1.7;
    margin: 25px auto;
    max-width: 650px;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.7);
    font-weight: normal;
}

/* アカデミー名 */
.catchTxt .academy-name {
    font-size: clamp(0.9rem, 2vw, 1rem);
    font-weight: bold;
    color: #EBFF00;
    letter-spacing: 2px;
    text-transform: uppercase;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
    margin: 25px 0 0;
    padding-top: 0;
    border-top: none;
}

/* --- キャッチエリア レスポンシブ --- */
@media (max-width: 920px) {
    .catchTxt { /* はみ出し防止 */
        max-width: calc(100% - 40px);
        padding-left: 20px;
        padding-right: 20px;
    }
}
@media (max-width: 768px) {
	.main-title-visual .responsive-break { /* スマホで改行有効化 */
		display: block;
	}
}
@media (max-width: 620px) {
	.catchArea {
		margin-left: 0 !important;
		margin-right: 0 !important;
        min-height: 50vh;
	}
}
@media (max-width: 600px) {
    .catchArea h2 {
        font-size: 1.3rem;
        margin-bottom: 20px;
    }
    .catchTxt {
        padding: 20px;
    }
    .catch-description {
        margin: 15px auto;
    }
    .catchTxt .academy-name {
         margin-top: 15px;
    }
}


/* ============================================= */
/* == スクール特徴グリッド (キャッチエリア内) == */
/* ============================================= */

.features-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* ★ 3列に変更 */
    gap: 20px 15px; /* ★ 隙間を調整 */
    width: 100%;
    max-width: 900px; /* ★ 3列用に最大幅を調整 */
    margin: 40px auto 0;
}

.feature-item {
    text-align: center;
    color: #fff;
}

.feature-icon {
    width: 65px;
    height: 65px;
    line-height: 65px;
    color: #fff; 
    background-color: transparent; 
    border: 2px solid #03c46a; 
    border-radius: 50%; 
    margin: 0 auto 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 5px rgba(0,0,0,0.3);
}

.feature-number {
    font-size: 1.5rem; 
    font-weight: 700;
    font-family: 'Orbitron', sans-serif; 
    line-height: 1; 
}

.feature-title {
    font-size: 1.15rem; 
    font-weight: 700;
    line-height: 1.5;
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.8);
    margin: 0;
    background: none;
    padding: 0;
    border-radius: 0;
    display: block;
    color: #fff; 
}


/* --- 特徴グリッド レスポンシブ --- */
@media (max-width: 768px) {
    .features-grid {
        grid-template-columns: repeat(2, 1fr); /* ★ 768px以下で2列に変更 */
        gap: 25px;
        max-width: 600px; /* 2列用に幅を調整 */
    }
}

@media (max-width: 480px) {
    .features-grid {
        grid-template-columns: repeat(2, 1fr); /* ★ スマホでも2列を維持 */
        gap: 20px 15px;
        max-width: 100%;
    }
    .feature-icon {
        width: 55px;
        height: 55px;
        line-height: 55px;
    }
    .feature-number {
        font-size: 1.3rem; 
    }
    .feature-title {
        font-size: 0.95rem;
    }
}



/* ============================================= */
/* == ７つの特徴セクション (画像あり) == */
/* ============================================= */
.features-section {
    background-color: #ffffff;
}
.features-section .content-inner {
    max-width: 900px; 
}

/* セクションタイトル (H3) */
#contents .features-section .section-title {
    text-align: center;
    font-size: 2.1rem !important;
    line-height: 1.4 !important;
    margin: 60px 0 50px;
    background: none;
    padding: 0 0 10px;
    position: relative;
    color: #333 !important;
}
.section-title .title-highlight { /* 「７つの特徴」 */
    color: #03c46a;
    font-size: 1.1em;
}

/* 特徴リスト全体 */
.features-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* 各特徴アイテム */
.features-item {
    display: grid;
    grid-template-columns: 1fr 1fr; /* 2カラムレイアウト */
    gap: 40px; 
    align-items: center; 
    padding: 40px 0;
    border-bottom: 1px solid #eee;
    
    /* グリッドエリア名を定義 */
    grid-template-areas: "text image"; /* デフォルト (奇数番目) */
}
.features-item:last-child {
    border-bottom: none;
}

/* 偶数番目のアイテムはレイアウトを反転 */
.features-item:nth-child(even) {
    grid-template-areas: "image text"; /* 偶数番目 */
}

/* テキストブロックの配置 */
.features-content-block { 
    grid-area: text; /* グリッドエリア 'text' に配置 */
}
/* 画像ブロックの配置 */
.features-image-block {
    grid-area: image; /* グリッドエリア 'image' に配置 */
    width: 100%;
    aspect-ratio: 4 / 3; /* 画像の比率を 4:3 に */
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}
.features-image-block img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 番号 (01, 02...) */
.features-number {
    font-size: 2.5rem;
    font-weight: 700;
    color: #03c46a;
    font-family: 'Orbitron', sans-serif;
    line-height: 1;
    text-align: left;
    margin-bottom: 10px;
}

/* 特徴の見出し (H4) */
.features-headline {
    font-size: 1.5rem; 
    font-weight: 700;
    line-height: 1.5;
    color: #222;
    margin: 0 0 10px;
    background: none;
    padding: 0;
    border-radius: 0;
    display: block;
}

/* 特徴の説明文 (P) */
.features-content-block p { 
    font-size: 1rem;
    line-height: 1.8;
    color: #555;
    margin: 0;
}

/* --- 特徴セクション レスポンシブ --- */
@media (max-width: 768px) {
    .features-item {
        grid-template-columns: 1fr; /* 1カラムに変更 */
        gap: 20px;
        padding: 30px 0;
    }
    /* 1カラム時は常に画像が上、テキストが下 */
    .features-item,
    .features-item:nth-child(even) {
        grid-template-areas: 
            "image"
            "text";
    }
    
    .features-number {
        font-size: 2rem;
    }
    .features-headline {
        font-size: 1.3rem;
    }
}




/* ============================================= */
/* == 最新鋭の設備紹介 (setubi-container) == */
/* ============================================= */

/* メインの「最新鋭の設備紹介」見出し */
.setubi-container > h3 {
     text-align: center;
     font-size: 2.1rem;
     margin: 60px 0 40px;
     background: none; /* 共通h3スタイルをリセット */
     padding: 0;
     position: relative;
     color: #333;
}
/* 見出し下のアクセントライン */
.setubi-container > h3::after {
     content: '';
     display: block;
     width: 80px;
     height: 4px;
     background-color: #03c46a;
     margin: 15px auto 0;
}


/* --- セクション固有の背景 --- */
.trackman-section {
    background-color: #ffffff; /* 白背景 */
}
.tourputt-section {
    background-color: #f8f9fa; /* 明るいグレー背景 */
}

/* --- 設備紹介の共通コンポーネント --- */

/* 設備ロゴヘッダー共通 */
.equipment-logo-header {
    text-align: center;
    margin-bottom: 30px;
    padding-bottom: 25px;
    border-bottom: 1px solid #eee;
}
.equipment-logo-header img {
    max-width: 280px;
    width: 100%;
    height: auto;
}
.equipment-catchphrase { /* ロゴ下のキャッチフレーズ */
    font-size: 1.2rem;
    font-weight: bold;
    color: #333;
    line-height: 1.6;
    margin: 20px auto 0;
    padding: 0;
    max-width: 650px;
}

/* 共通情報ボックス */
.equipment-info-box {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 10px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.06);
    margin: 30px 0;
    overflow: hidden;
}
.equipment-info-box .info-header {
    background: #fff;
    text-align: center;
    padding: 20px;
    border-bottom: 1px solid #eee;
}
.equipment-info-box .info-header .sub-title {
    margin: 0;
    font-size: 1rem;
    color: #555;
}
.equipment-info-box .info-header .main-title {
    font-family: 'Ethnocentric', sans-serif;
    font-weight: normal;
    margin: 5px 0 0;
    font-size: 1.6rem;
    line-height:130%;
    color: #333;
}
.equipment-info-box .price-section { padding: 20px; }
.equipment-info-box .campaign-banner {
    background-color: #e74c3c;
    color: #fff;
    font-weight: bold;
    text-align: center;
    padding: 8px;
    border-radius: 4px;
    margin-bottom: 15px;
}
.equipment-list {
    font-size: 1.1rem;
    font-weight: bold;
    color: #0056b3;
    line-height: 1.6;
    margin-bottom: 20px;
    text-align: center;
}
.equipment-info-box .price-details {
    list-style: none; padding: 0; margin: 0 0 15px; font-size: 1rem;
}
.equipment-info-box .price-details li {
    padding: 10px 0; border-bottom: 1px dashed #ccc; color: #555;
}
.equipment-info-box .price-details li:last-child { border-bottom: none; }
.equipment-info-box .price-details li span { color: #888; margin-right: 10px; }
.equipment-info-box .price-details li strong {
    font-size: 1.5rem; color: #e74c3c; font-weight: 900;
}
.equipment-info-box .notes {
    font-size: 0.85rem; color: #777; line-height: 1.6;
    background-color: #f9f9f9; padding: 10px; border-radius: 4px;
}
.equipment-info-box .notes p { margin: 0.5em 0; color: #777; }
.equipment-info-box .contact-info {
    background-color: #f0f0f0; border-top: 1px solid #ddd; padding: 15px;
    text-align: center; font-size: 1.1rem; font-weight: bold; color: #333;
}
.equipment-info-box .contact-info strong { font-size: 1.3rem; color: #333; }

/* 動画・ギャラリー共通スタイル */
.video-container,
.youtube-container {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    margin: 30px auto; /* 中央寄せ */
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}
.video-container video,
.youtube-container iframe {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%; border: 0;
}
.video-container video { object-fit: cover; }

.image-gallery { margin: 35px 0; }
.trackman-gallery { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.tourputt-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

.gallery-item {
    background-color: #fff; border: 1px solid #eee; border-radius: 10px;
    overflow: hidden; box-shadow: 0 4px 15px rgba(0,0,0,0.07); text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.gallery-item:hover { transform: translateY(-5px); box-shadow: 0 8px 25px rgba(0,0,0,0.1); }
.gallery-item img {
    width: 100%; display: block; aspect-ratio: 16 / 10; object-fit: cover;
}
.gallery-video-wrapper { width: 100%; aspect-ratio: 16 / 10; background-color: #000; }
.gallery-video-wrapper video {
    width: 100%; height: 100%; object-fit: cover; object-position: center 30%; display: block;
}
.gallery-item h5 {
    font-size: 1rem; font-weight: bold; color: #333;
    padding: 15px 10px; margin: 0; background-color: #f9f9f9;
}

/* CTAボタン */
.cta-button {
    display: block; max-width: 400px; margin: 40px auto 0; padding: 15px;
    background-color: #03c46a; color: #fff !important; text-align: center;
    font-size: 1.1rem; font-weight: bold; text-decoration: none !important;
    border-radius: 8px; transition: background-color 0.3s ease, transform 0.3s ease;
}
.cta-button:hover { background-color: #02a157; transform: translateY(-2px); }




/* --- 設備紹介セクション固有 --- */
/* ============================================= */
/* == 設備紹介 FOCUSセクション (ダークテーマ) == */
/* ============================================= */

/* FOCUSセクションの背景 */
.focus-section {
    /* 1. 一番下のレイヤー: 基本の背景色 */
    background-color: #1a1a1a; 
    
    /* 2. 中間のレイヤー: 重ねたい背景画像 */
    background-image: url('../img/focus-section-bg.jpg'); /* ★ここに画像パスを指定 */
    
    /* 3. 画像の表示設定 */
    background-size:cover; /* エリア全体を覆う */
    background-position: center top; /* 中央を基準に表示 */
    background-attachment: fixed; /* ★ スクロールしても背景が固定される（G-Frontier風） */

    color: #e0e0e0; 
    position: relative; /* z-indexの基準 */
}

/* 4. 一番上のレイヤー: 半透明のオーバーレイ */
.focus-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
    /* ★ この '0.85' の部分で画像の透明度（暗さ）を調整します */
    background-color: rgba(26, 26, 26, 0.85); /* 70%不透明の黒 */
    
    z-index: 0; /* コンテンツの手前、背景画像の上に配置 */
}

/* 5. コンテンツをオーバーレイより手前に配置 */
.focus-section .content-inner {
    /* ... 既存のスタイル ... */
    position: relative; /* z-indexを有効にする */
    z-index: 1; /* ::before (z-index: 0) より手前に */
}

/* .content-inner の上下余白を調整 */
.focus-section .content-inner {
    padding-top: 80px;
    padding-bottom: 80px;
}


/* ロゴヘッダー (既存のスタイルを流用) */
#focus .equipment-logo-header {
     /*background-color: #1a1a1a;*/ /* 念のため */
     border-radius: 12px;
     padding: 30px 20px;
     border-bottom: none;
     margin-bottom: 40px; /* ★ 余白調整 */
}
#focus .equipment-catchphrase {
     color: #fff;
     opacity: 0.9;
     font-size: 1.3rem; /* ★ 文字を大きく */
     line-height: 1.6;
}

/* 情報ボックスをダークテーマに対応 */
.focus-section .equipment-info-box {
    background-color: #2c2c2c;
    border-color: #555;
    box-shadow: 0 5px 20px rgba(0,0,0,0.3);
}
.focus-section .equipment-info-box .info-header {
    background: #333;
}
.focus-section .equipment-info-box .info-header .sub-title {
    color: #bbb;
}
.focus-section .equipment-info-box .info-header .main-title {
    color: #fff;
}
.focus-section .equipment-list {
    color: #7ab5db; /* 明るい青 */
}
.focus-section .equipment-info-box .price-details li {
    border-bottom-color: #444;
    color: #ccc;
}
.focus-section .equipment-info-box .price-details li span {
    color: #aaa;
}
.focus-section .equipment-info-box .notes {
    background-color: #383838;
    color: #bbb;
}
.focus-section .equipment-info-box .notes p {
    color: #bbb; /* 継承確認 */
}
.focus-section .equipment-info-box .contact-info {
    background-color: #333;
    border-top-color: #555;
    color: #fff;
}
.focus-section .equipment-info-box .contact-info strong {
    color: #f0f0f0;
}



/* 説明文のスタイル (文字を大きく、色を明るく) */
.focus-section .content-inner > p {
    font-size: 1.1rem; /* ★ 文字を大きく */
    line-height: 1.9;
    color: #dcdcdc; /* 明るいグレー */
    max-width: 800px; /* 読みやすさのため幅を制限 */
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px; /* 汎用スタイルを上書き */
}


/* == 設備紹介 説明文エリア == */
.equipment-description-wrap {
    margin-top: 50px; /* ビデオコンテナからのマージン */
    margin-bottom: 40px; /* CTAボタンへのマージン */
    color: #e0e0e0; /* このエリアの基本文字色 */
    text-align: center; /* 中の要素を中央揃えに */
}

/* ▼ 新しい見出し「スイングの"なぜ"を～」のスタイル ▼ */
.equipment-headline {
    font-size: clamp(1.8rem, 4vw, 2.5rem) !important; /* 大きな文字 */
    font-weight: 900;
    color: #fff; /* 白文字 */
    line-height: 1.4;
    margin: 0 auto 25px;
    text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.5); /* 読みやすさのための影 */
    
    /* G-Frontier風のアクセントライン */
    padding-bottom: 20px;
    border-bottom: 2px solid #03c46a; /* キーカラーの線 */
    
    /* 既存のh3(緑背景)スタイルをリセット */
    background: none !important;
    padding-left: 0;
    padding-right: 0;
}

.equipment-description-wrap p {
    font-size: 1.1rem;
    line-height: 1.9;
    color: #dcdcdc;
    max-width: 800px;
    margin: 0 auto;
    text-align: left !important;
}

/* 「できること」の小見出し */
.features-list-title {
    font-size: 1.8rem; /* 大きく */
    font-weight: 700;
    color: #fff;
    margin: 60px 0 30px; /* 上下に十分な余白 */
    padding-bottom: 15px;
    border-bottom: 1px solid #555;
    text-align: center; /* 中央揃え */
    
    /* 共通h4スタイルをリセット */
    background: none;
    padding-left: 0;
    border-radius: 0;
    display: block;
}

/* 「できること」リスト本体 */
.features-list-detail {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* 各特徴アイテム (左右交互レイアウト) */
.focus-section .features-item {
    display: grid;
    grid-template-columns: 1fr 1fr; /* 2カラムレイアウト */
    gap: 40px; 
    align-items: center; 
    padding: 40px 0;
    border-bottom: 1px solid #444; /* 暗い背景用の線 */
    
    grid-template-areas: "text image"; /* デフォルト (奇数番目) */
}
.focus-section .features-item:last-child {
    border-bottom: none;
}
.focus-section .features-item:nth-child(even) { /* 偶数番目は反転 */
    grid-template-areas: "image text";
}

/* テキストブロックの配置 */
.focus-section .features-content-block { 
    grid-area: text;
}
/* 画像ブロックの配置 */
.focus-section .features-image-block {
    grid-area: image;
    width: 100%;
    aspect-ratio: 4 / 3; /* 画像の比率を 4:3 に */
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0,0,0,0.2);
}
.focus-section .features-image-block img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 番号 (01, 02...) */
.focus-section .features-number {
    font-size: 2.5rem;
    font-weight: 700;
    color: #03c46a; /* キーカラー */
    font-family: 'Orbitron', sans-serif;
    line-height: 1;
    text-align: left;
    margin-bottom: 10px;
}

/* 特徴の見出し (H5) */
.focus-section .features-list-detail li h5 {
    font-size: 1.5rem; 
    font-weight: 700;
    line-height: 1.5;
    color: #fff; /* 白文字 */
    margin: 0 0 10px;
    background: none;
    padding: 0;
    border-radius: 0;
    display: block;
}
.focus-section .features-list-detail li h5 span { /* 番号 (旧スタイル名残) */
    /* このスタイルは .features-number に移行 */
}

/* 特徴の説明文 (P) */
.focus-section .features-content-block p { 
    font-size: 1rem;
    line-height: 1.8;
    color: #ccc; /* 明るいグレー */
    margin: 0;
}


/* --- レスポンシブ調整 --- */
@media (max-width: 768px) {
    .focus-section .features-item {
        grid-template-columns: 1fr; /* 1カラムに変更 */
        gap: 20px;
        padding: 30px 0;
    }
    .focus-section .features-item,
    .focus-section .features-item:nth-child(even) {
        grid-template-areas: 
            "image"
            "text";
    }
    .focus-section .features-number {
        font-size: 2rem;
    }
    .focus-section .features-headline { /* HTML側 H5タグ */
        font-size: 1.3rem;
    }
}


@media (max-width: 600px) {
    .equipment-headline {
        font-size: clamp(1.5rem, 6vw, 2rem) !important;
    }
    .equipment-description-wrap p {
        font-size: 1rem;
    }
    .features-list-title {
        font-size: 1.3rem;
    }
    .features-list-detail li h5 {
        font-size: 1.1rem;
    }
}


/* CTAボタン (余白を調整) */
.focus-section .cta-button {
    margin: 40px auto 0; /* ★ 上マージンを追加し中央寄せ */
}




/* ============================================= */
/* == TrackManセクション 見出し調整 == */
/* ============================================= */

/* TrackManセクション内の見出しの色を調整 (白背景用) */
.trackman-section .equipment-headline {
    color: #333 !important; /* ★ 文字色を黒に変更 */
    text-shadow: none; /* ★ 白背景なので影は不要 */
    margin-top: 50px; /* ★ YouTube動画からの余白 */
}


#trackman .equipment-logo-header img { max-width: 380px; }
#trackman .equipment-catchphrase { color: #333; }


/* 「できること」の小見出し (白背景用) */
.trackman-section .features-list-title {
    font-size: 1.8rem;
    font-weight: 700;
    color: #333; /* ★ 黒文字 */
    margin: 60px 0 30px;
    padding-bottom: 15px;
    border-bottom: 1px solid #ddd; /* ★ 薄い線 */
    text-align: center;
    
    background: none;
    padding-left: 0;
    border-radius: 0;
    display: block;
}

/* 「できること」リスト本体 */
.trackman-section .features-list-detail {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* 各特徴アイテム (左右交互レイアウト) */
.trackman-section .features-item {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px; 
    align-items: center; 
    padding: 40px 0;
    border-bottom: 1px solid #eee; /* ★ 薄い線 */
    
    grid-template-areas: "text image"; /* デフォルト */
}
.trackman-section .features-item:last-child {
    border-bottom: none;
}
.trackman-section .features-item:nth-child(even) { /* 偶数番目は反転 */
    grid-template-areas: "image text";
}

/* テキストブロックの配置 */
.trackman-section .features-content-block { 
    grid-area: text;
}
/* 画像ブロックの配置 */
.trackman-section .features-image-block {
    grid-area: image;
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1); /* 影を薄めに */
}
.trackman-section .features-image-block img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 番号 (01, 02...) */
.trackman-section .features-number {
    font-size: 2.5rem;
    font-weight: 700;
    color: #03c46a; /* キーカラー */
    font-family: 'Orbitron', sans-serif;
    line-height: 1;
    text-align: left;
    margin-bottom: 10px;
}

/* 特徴の見出し (H5) */
.trackman-section .features-list-detail li h5 {
    font-size: 1.5rem; 
    font-weight: 700;
    line-height: 1.5;
    color: #222; /* ★ 黒文字 */
    margin: 0 0 10px;
    background: none;
    padding: 0;
    border-radius: 0;
    display: block;
}

/* 特徴の説明文 (P) */
.trackman-section .features-content-block p { 
    font-size: 1rem;
    line-height: 1.8;
    color: #555; /* ★ グレー文字 */
    margin: 0;
}

/* --- レスポンシブ --- */
@media (max-width: 768px) {
    .trackman-section .features-item {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 30px 0;
    }
    .trackman-section .features-item,
    .trackman-section .features-item:nth-child(even) {
        grid-template-areas: 
            "image"
            "text";
    }
}


/* ============================================= */
/* == TrackManセクション 動画位置調整 == */
/* ============================================= */

.trackman-section .features-image-block video {
    width: 100%;
    height: 100%;
    object-fit: cover; /* 親要素(4:3の枠)を埋める */
    object-position: center 40%; /* ★ 垂直方向の上端を優先して表示 */
}




/* ============================================= */
/* == 設備紹介 TourPuttセクション == */
/* ============================================= */

/* TourPuttセクションの背景 */
.tourputt-section {
    background-color: #f8f9fa; /* ご提案の「薄いグレー」背景 */
    color: #333;
}
.tourputt-section .content-inner {
    padding-top: 80px;
    padding-bottom: 80px;
}


/* ロゴヘッダー (ライトテーマ用) */
#tourputt .equipment-logo-header {
    text-align: center;
    margin-bottom: 40px; 
    padding-bottom: 25px;
    border-bottom: 1px solid #eee;
}
#tourputt .equipment-logo-header img {
    max-width: 280px; /* ロゴサイズ */
}

#tourputt .equipment-catchphrase { color: #333; }


/* メインキャッチコピー (ライトテーマ用) */
.tourputt-section .equipment-headline {
    color: #333 !important;
    text-shadow: none;
    margin-top: 50px;
    border-bottom-color: #03c46a; /* 下線はキーカラー */
}

/* 導入文 (ライトテーマ用) */
.tourputt-section .equipment-description-wrap p {
    font-size: 1.1rem;
    line-height: 1.9;
    color: #555;
    max-width: 800px;
    margin: 0 auto;
    text-align: left !important;
}

/* 「できること」の小見出し (ライトテーマ用) */
.tourputt-section .features-list-title {
    font-size: 1.8rem;
    font-weight: 700;
    color: #333;
    margin: 60px 0 30px;
    padding-bottom: 15px;
    border-bottom: 1px solid #ddd;
    text-align: center;
    background: none;
    padding-left: 0;
    border-radius: 0;
    display: block;
}

/* 「できること」リスト本体 */
.tourputt-section .features-list-detail {
    list-style: none; padding: 0; margin: 0;
}

/* 各特徴アイテム (左右交互レイアウト) */
.tourputt-section .features-item {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px; 
    align-items: center; 
    padding: 40px 0;
    border-bottom: 1px solid #eee; /* 薄い線 */
    grid-template-areas: "text image"; /* デフォルト */
}
.tourputt-section .features-item:last-child {
    border-bottom: none;
}
.tourputt-section .features-item:nth-child(even) { /* 偶数番目は反転 */
    grid-template-areas: "image text";
}

/* テキスト/画像ブロックの配置 */
.tourputt-section .features-content-block { 
    grid-area: text;
}
.tourputt-section .features-image-block {
    grid-area: image;
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}
.tourputt-section .features-image-block img {
    width: 100%; height: 100%; object-fit: cover;
}

/* 番号 (01, 02...) */
.tourputt-section .features-number {
    font-size: 2.5rem;
    font-weight: 700;
    color: #03c46a; /* キーカラー */
    font-family: 'Orbitron', sans-serif;
    line-height: 1;
    text-align: left;
    margin-bottom: 10px;
}

/* 特徴の見出し (H5) */
.tourputt-section .features-list-detail li h5 {
    font-size: 1.5rem; 
    font-weight: 700;
    line-height: 1.5;
    color: #222; /* 黒文字 */
    margin: 0 0 10px;
    background: none;
    padding: 0;
    border-radius: 0;
    display: block;
}

/* 特徴の説明文 (P) */
.tourputt-section .features-content-block p { 
    font-size: 1rem;
    line-height: 1.8;
    color: #555; /* グレー文字 */
    margin: 0;
}

/* CTAボタン (余白調整) */
.tourputt-section .cta-button {
    margin: 50px auto 0;
}

/* --- レスポンシブ --- */
@media (max-width: 768px) {
    .tourputt-section .features-item {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 30px 0;
    }
    .tourputt-section .features-item,
    .tourputt-section .features-item:nth-child(even) {
        grid-template-areas: "image" "text";
    }
}




/* --- 設備紹介 レスポンシブ --- */
@media (max-width: 820px) { /* 2カラム → 1カラム */

}
@media (max-width: 768px) { /* ギャラリー調整 */
    .tourputt-gallery { grid-template-columns: 1fr; }
    .trackman-gallery { grid-template-columns: 1fr; }
}
@media (max-width: 600px) { /* ギャラリー調整 */
    .trackman-gallery { gap: 15px; }
}




/* ============================================= */
/* == レッスン内容・料金プラン (新構成) == */
/* ============================================= */
.lessonArea {
    padding: 0; /* .content-inner の padding を上書きする場合はここで指定 */
    
    /* 枠なしスタイルは維持 */
    background-color: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
}

.lessonArea .content-inner {
    padding-top: 80px;
    padding-bottom: 80px;
}

/* メインタイトル (H3) */
.lessonArea h3 {
    text-align: center;
    font-size: 2.1rem !important;
    line-height: 140%;
    margin: 60px 0 40px !important;
    background: none; /* 共通h3スタイルをリセット */
    padding: 0 0 20px;
    position: relative;
    color: #333 !important;
}


/* レッスン・料金セクションの全幅背景 */
.lesson-section {
    background-color: #ffffff; /* 例: 白背景 */
    /* または薄いグレー: #f8f9fa */
}

/* 2列プラン (ゴルフ / パッティング) */
.plan-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    margin-bottom: 40px;
}
.plan-card {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 10px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    overflow: hidden;
}
.plan-card ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.plan-card li {
    font-size: 0.95rem;
    line-height: 1.7;
    color: #555;
    padding: 8px 0;
    border-bottom: 1px solid #f0f0f0;
}
.plan-card li:last-child {
    border-bottom: none;
}
.plan-card li strong {
    font-weight: 700;
    color: #333;
}

.plan-card .campaign-banner {
    display: inline-block;
    background-color: #e74c3c;
    color: #fff;
    font-weight: bold;
    text-align: center;
    padding: 4px;
    border-radius: 4px;
    margin-bottom: 4px;
}

.equipment-info-box .price-details li strong {
    font-size: 1.5rem; color: #e74c3c; font-weight: 900;
}


/* 料金プランの備考・注釈テキストのスタイル */
.remarks-text {
    font-size: 0.85rem; /* ★ 現在の文字サイズ(0.95rem)より小さく */
    color: #777;       /* ★ 少し薄い色に変更 */
    line-height: 1.6;   /* 行間を調整 */
}


.plan-header { /* ダーク背景 */
    padding: 10px 15px; background-color: #333;
    background-image: linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
                      linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
    background-size: 20px 20px; border-bottom: 2px solid #03c46a; text-align: center;
    
    display: flex;           /* Flexboxを有効化 */
    flex-direction: column;  /* 中身を縦に並べる */
    justify-content: center; /* 中身を垂直方向（縦）の中央に配置 */
    align-items: center;     /* 中身を水平方向（横）の中央に配置 */
    min-height: 160px;       /* ★ 最小の高さを設定 (2行分を想定) */
}
.academy-subtitle { font-size: 0.8rem; color: #ccc; margin: 0 0 8px 0; letter-spacing: 1px; }
.academy-title { /* Ethnocentric フォント */
    font-family: 'Ethnocentric', sans-serif; font-size: 1.7rem; font-weight: normal;
    color: #fff; background-color: transparent; margin: 0; letter-spacing: 2px;
    text-transform: uppercase; text-shadow: 0px 1px 1px rgba(0,0,0,0.5), 0px 3px 5px rgba(0,0,0,0.4);
}

/* カードのリスト部分の余白 */
.price-card-body {
    padding: 25px;
}

/* プレミアムレッスン */
.premium-lesson-section {
    display: grid;
    grid-template-columns: 1.5fr 1fr; /* 60% / 40% の比率 */
    gap: 0;
    margin-top: 40px;
    background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #ddd;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);

}


.premium-profile {
    padding: 30px;
    display: flex; /* ★ display: flex を追加 */
    flex-direction: row; /* ★ 横並びに設定 */
    align-items: flex-start; /* ★ 上揃え */
    gap: 20px; /* ★ 写真とテキストの間の隙間 */
    
        
    background-color: #1a1a1a; 
    background-image: url("../img/premium-lesson-section_bg.jpg");
    background-position: center top;
    background-size: cover;
    
    position: relative; /* z-indexの基準 */
    
    /* ▼ 背景との境界を明確にするため、少し暗い線を追加（任意） ▼ */
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

/*  一番上のレイヤー: 半透明のオーバーレイ */
.premium-profile::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* ▼ 読みやすくするため、透明度を濃くします (例: 60%) ▼ */
    background-color: rgba(26, 26, 26, 0.6); 
    z-index: 0; /* 背景とコンテンツの間 */
}

.premium-profile img {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    object-fit: cover;
    float: none; /* ★ float を解除 */
    margin: 0; /* ★ マージンをリセット (gapで制御) */
    flex-shrink: 0; /* ★ 画像が縮まないように設定 */
    
    /* ▼ z-index を指定して手前に表示 ▼ */
    position: relative;
    z-index: 1;
    
    object-position: 15% 50%; /* 水平位置を15%（左寄り）に、垂直位置を50%（中央）に */
}

.premium-text {
    flex-grow: 1; /* 残りのスペースをすべて使う */
    
    /* ▼ z-index を指定して手前に表示 ▼ */
    position: relative;
    z-index: 1;
}

/* 2列プランの基本タイトル (セレクタを強化して h4 の背景を確実にリセット) */
.lessonArea .plan-title {
    font-size: 1.3rem;
    font-weight: 900;
    color: #333;
    padding-bottom: 15px;
    border-bottom: 2px solid #03c46a;
    margin: 0 0 20px;
    
    /* 共通H4リセット (強制) */
    background: none !important; 
    padding-left: 0; 
    border-radius: 0; 
    display: block;
}

/* プレミアムレッスンのタイトル (見栄え良く変更) */
.lessonArea .plan-title.premium {
    background: linear-gradient(135deg, #03c46a 0%, #015300 100%) !important; /* ★ 濃い緑のグラデーション背景 */
    color: #fff !important; /* ★ 白文字に変更 */
    border-bottom: none; /* ★ 下線を削除 */
    padding: 15px 20px; /* ★ パディングを追加 */
    margin-bottom: 20px; /* ★ マージン調整 */
    border-radius: 8px; /* ★ 角を丸くする */
    text-align: center; /* ★ 中央揃え */
    line-height: 1.4;
}

.premium-qualification,
.premium-comment {
    font-size: 0.9rem;
    color: #eee;
    line-height: 1.6;
    margin-top: 5px;
}
.premium-comment {
    font-style: italic;
    font-weight: bold;
    color: #fff;
}
.premium-profile ul {
    list-style: none;
    padding: 0;
    margin: 20px 0 0;
    clear: none; /* ★ clear: both を解除 */
}
.premium-profile li {
    font-size: 0.95rem;
    line-height: 1.7;
    color: #eee;
    padding: 8px 0;
    border-top: 1px solid #f0f0f0;
}

.premium-profile li strong {
    color: #fff; /* ★ strongタグも白系に */
}
.premium-profile li:last-child {
    padding-bottom: 0; /* 最後の余白を削除 */
}

/* PGA NOTE */
.pga-note-info {
    padding: 30px;
    background-color: #f9f9f9;
    border-left: 1px solid #eee;
}
.pga-title {
    font-size: 1.3rem;
    font-weight: 900;
    color: #333;
    margin: 0 0 15px;
    /* 共通H4リセット */
    background: none; padding: 0; border-radius: 0; display: block;
}
.pga-note-info p {
    font-size: 0.9rem;
    line-height: 1.7;
    color: #555;
}
.pga-note-info img {
    width: 100%;
    max-width: 310px;
    margin-top: 20px;
    border-radius: 8px;
}

/* ご予約・お問合せ (目立たせる) */
.contact-cta {
    background-color: #e74c3c; /* ★ キャンペーンバナーと同じ赤系に変更 */
    color: #fff;
    padding: 30px;
    margin-top: 40px;
    border-radius: 12px;
    text-align: center;
}
.contact-cta-inner p {
    font-size: 1.2rem;
    font-weight: bold;
    margin: 0 0 10px;
    color: #fff;
}
.contact-cta-inner a {
    font-size: 2.2rem;
    font-weight: 900;
    color: #fff !important;
    text-decoration: none;
    font-family: 'Orbitron', sans-serif; /* 電話番号を目立たせる */
    transition: letter-spacing 0.3s ease;
}
.contact-cta-inner a:hover {
    letter-spacing: 1px;
}

/* --- レッスン内容・料金プラン レスポンシブ --- */
@media (max-width: 768px) {
    .plan-wrapper {
        grid-template-columns: 1fr; /* 1列に */
        gap: 20px;
    }
    .premium-lesson-section {
        grid-template-columns: 1fr; /* 1列に */
    }
    .pga-note-info {
        border-left: none;
        border-top: 1px solid #eee;
    }
}
@media (max-width: 600px) {
    /* ▼ プレミアムプロフィールのスマホ対応 ▼ */
    .premium-profile {
        flex-direction: column; /* ★ 縦積みに変更 */
        align-items: center;    /* ★ アイテムを中央揃え */
    }
    
    .premium-text {
        text-align: center; /* ★ テキストを中央揃え */
        width: 100%; /* 幅を100%に */
    }

    .premium-profile ul {
        text-align: left; /* リストは読みやすさのため左揃えのまま */
    }
    .premium-profile li {
         text-align: left; /* リストは読みやすさのため左揃えのまま */
    }
    
    /* plan-title.premium の中央揃えは .premium-text に含まれるためOK */
    .plan-title.premium {
        text-align: center;
    }

}






/* ============================================= */
/* == インストラクター紹介 == */
/* ============================================= */
/* ▼ セクションラッパーの背景色 (G-Frontier風に白とグレーを交互に) ▼ */
.coach-section {
    background-color: #f8f9fa; /* 薄いグレー背景 */
}


.coachArea {
    /* ▼ 枠なしスタイル ▼ */
    /*padding: 0 !important;*/ /* .content-inner の padding を優先 */
    background-color: transparent;
    border: none;
    box-shadow: none;
}

.coach-section .content-inner {
    padding-top: 80px;
    padding-bottom: 80px;
}

/* ▼ h3 のスタイルを他のセクションタイトルと統一 ▼ */
.coachArea h3 {
    text-align: center;
    font-size: 2.1rem !important;
    margin: 60px 0 40px !important;
    background: none !important; /* 緑背景をリセット */
    padding: 0 0 20px !important;
    position: relative;
    color: #333 !important;
}

.coachArea > p{
    max-width: 860px;
    margin: 30px auto;
    line-height: 1.8;
    color: #555;
    text-align: center; /* ★ 説明文を中央揃えに */
}

h4.coach-catchphrase { /* 青いステッカー風 */
    display: table; margin: 0 auto 40px; font-family: 'M PLUS Rounded 1c', sans-serif;
    font-size: 1.9rem; font-weight: 900; color: #01579b; background-color: #e0f7fa;
    padding: 15px 30px; border: 3px solid #01579b; border-radius: 50px;
    box-shadow: 5px 5px 0px #b3e5fc; transform: rotate(-2deg); transition: transform 0.2s ease;
}
h4.coach-catchphrase:hover { transform: rotate(0deg); }

.coach-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* ★ 2列に変更 */
    gap: 30px; /* ★ 隙間を少し広げてゆったりと */
}

.coach-card {
    background-color: #fff; border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    overflow: hidden; display: flex; flex-direction: column;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.coach-card:hover { transform: translateY(-5px); box-shadow: 0 8px 25px rgba(0,0,0,0.1); }
.coach-text { padding: 20px; flex-grow: 1; }
.coach-title { font-size: 0.85rem; color: #888; margin: 0 !important; }
.coach-name {
    font-family: 'roman', sans-serif; font-size: 1.5rem; font-weight: 900;
    color: #333; margin: 5px 0 15px; line-height: 1.3;
}
.coach-name span { /* 「プロ」 */
    font-size: 0.9rem; font-weight: 600; color: #666; margin-left: 4px;
}
.coach-bio {
    font-size: 0.9rem; color: #666; line-height: 1.4; border-left-style: solid;
    border-left-width: 3px; border-left-color: #ddd; padding-left: 10px;
    margin: 0 0 10px !important;
}
.coach-comment { font-size: 0.9rem; color: #555; line-height: 1.7; margin: 0 !important; }

#coach .coach-photo { /* 写真エリア (強制上書き) */
    width: 100% !important; aspect-ratio: 16 / 9 !important; height: auto !important; overflow: hidden;
}
#coach .coach-photo img { /* 写真本体 (強制上書き) */
    width: 100% !important; height: 100% !important; object-fit: cover !important;
    object-position: center top !important;
}

/* --- カード色分け --- */
.coach-card.morikawa, .coach-card.maekawa, .coach-card.eguchi{ background-color: #f1f8e9; }
.coach-card.morikawa .coach-bio, .coach-card.maekawa .coach-bio, .coach-card.eguchi .coach-bio{ border-left-color: #68BD83; }
.coach-card.umada, .coach-card.tarui{ background-color: #fff8e1; }
.coach-card.umada .coach-bio, .coach-card.tarui .coach-bio{ border-left-color: #F9C170; }
.coach-card.hirasawa, .coach-card.miyata{ background-color: #f3e5f5; }
.coach-card.hirasawa .coach-bio, .coach-card.miyata .coach-bio{ border-left-color: #786BAF; }
.coach-card.horiuchi, .coach-card.yamashita{ background-color: #e1f5fe; }
.coach-card.horiuchi .coach-bio, .coach-card.yamashita .coach-bio{ border-left-color: #02B0EE; }
.coach-card.matsui, .coach-card.sunada{ background-color: #fffbeb; }
.coach-card.matsui .coach-bio, .coach-card.sunada .coach-bio{ border-left-color: #D39000; }
.coach-card.shinzato { background-color: #fce4ec; }
.coach-card.shinzato .coach-bio { border-left-color: #FB9193; }
.coach-card.comingsoon { background-color: #fafafa; }
.coach-card.comingsoon .coach-bio { border-left-color: #aeaeae; }


/* ============================================= */
/* == インストラクター紹介 (プレミアム調整) == */
/* ============================================= */

/* カード全体を囲むリンクのスタイルリセット */
.coach-card-link {
    text-decoration: none !important;
    color: inherit;
    display: block; /* グリッドレイアウトを維持 */
}

/* 宮田プロのカード (プレミアム) */
.coach-card.miyata.premium-card {
    position: relative; /* バッジ配置の基準 */
    /* ★ 金のグラデーション背景 */
    background: linear-gradient(135deg, #D4AF37 0%, #B08D2F 100%);
    background-color: #B08D2F; /* グラデーション非対応ブラウザ用 */
    border: 1px solid #D4AF37;
    
    /* ★ 他のカードの背景色指定を上書き */
    background-color: #B08D2F !important; 
}

/* プレミアムバッジ */
.premium-badge {
    position: absolute;
    top: 15px;
    right: 15px;
    background-color: rgba(0, 0, 0, 0.4);
    border: 1px solid #f0e68c;
    color: #fff;
    font-size: 0.8rem;
    font-weight: bold;
    padding: 4px 8px;
    border-radius: 4px;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.4);
}

/* プレミアムカード内のテキスト色を調整 */
.coach-card.miyata.premium-card .coach-title {
    color: #f0e68c; /* 明るい金色 */
}
.coach-card.miyata.premium-card .coach-name {
    color: #ffffff; /* 白 */
}
.coach-card.miyata.premium-card .coach-name span {
    color: #f0f0f0; /* 少し暗い白 */
}
.coach-card.miyata.premium-card .coach-bio {
    color: #f0e68c; /* 明るい金色 */
    border-left-color: #f0e68c !important; /* ★ 線の色も変更 (強制上書き) */
}
.coach-card.miyata.premium-card .coach-comment {
    color: #ffffff; /* 白 */
    background-color: rgba(0, 0, 0, 0.15); /* 少し背景色を付けて読みやすく */
    padding: 10px;
    border-radius: 4px;
    margin-top: 10px !important;
}

/* 「チラシを見る」リンクテキスト */
.card-link-text {
    display: inline-block;
    margin-top: 15px;
    padding: 6px 12px;
    background-color: rgba(255, 255, 255, 0.2);
    border: 1px solid #f0e68c;
    color: #fff;
    border-radius: 4px;
    font-weight: bold;
    font-size: 0.9rem;
    transition: background-color 0.3s ease;
}
.coach-card-link:hover .card-link-text {
    background-color: rgba(255, 255, 255, 0.4);
}


/* --- インストラクター レスポンシブ --- */
@media (max-width: 1024px) { /*.coach-grid { grid-template-columns: repeat(2, 1fr); }*/ }
@media (max-width: 600px) {
    .coach-grid { grid-template-columns: 1fr; }
    .coachArea { /*padding: 20px 15px;*/ }
    h4.coach-catchphrase { font-size: 1.4rem; padding: 12px 20px; transform: rotate(-3deg); }
}



/* ============================================= */
/* == レッスン スケジュール (新構成) == */
/* ============================================= */

/* セクション全体のラッパー (背景色) */
.schedule-section {
    background-color: #fff; /* 白背景 */
}

/* .scheduleArea は .content-inner を継承 */
.scheduleArea {
    /* ▼ 枠なしスタイル ▼ */
    /*padding: 0 !important;*/
    background-color: transparent;
    border: none;
    box-shadow: none;
}
.schedule-section .content-inner {
    padding-top: 80px;
    padding-bottom: 80px;
}

/* メインタイトル (H3) */
#contents .scheduleArea h3 {
    text-align: center;
    font-size: 2.1rem !important;
    margin: 60px 0 40px !important;
    background: none !important;
    padding: 0 0 20px !important;
    position: relative;
    color: #333 !important;
}


/* スケジュール導入文 */
.schedule-intro-text {
    text-align: center;
    font-size: 1.1rem;
    color: #555;
    line-height: 1.8;
    max-width: 600px;
    margin: 0 auto 30px;
}

/* PDFボタンのグリッド */
.schedule-grid {
    display: grid; /* flexからgridに変更 */
    grid-template-columns: 1fr 1fr; /* 2列 */
    gap: 25px;
    max-width: 700px; /* ボタンが広がりすぎないように */
    margin: 0 auto;
}

/* PDFボタンスタイル */
.schedule-button {
    display: block;
    padding: 20px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    text-decoration: none !important;
    text-align: center;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    transition: all 0.3s ease;
}
.schedule-button:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.08);
    border-color: #03c46a;
}

/* ボタン内の日付テキスト */
.schedule-date-range {
    display: block;
    font-size: 1.4rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 10px;
}

/* ボタン内の「PDFを開く」テキスト */
.schedule-button-text {
    display: inline-block;
    padding: 6px 15px;
    background-color: #03c46a;
    color: #fff;
    font-size: 0.9rem;
    font-weight: bold;
    border-radius: 4px;
}

/* --- スケジュール レスポンシブ --- */
@media (max-width: 768px) {
    .schedule-grid {
        grid-template-columns: 1fr; /* 1列に変更 */
        gap: 15px;
    }
}



/* ============================================= */
/* == 施設概要 == */
/* ============================================= */
.accessArea {
    max-width: 900px; margin: 50px auto; padding: 25px 30px;
    background-color: #fdfdfd; border: 1px solid #eee; border-radius: 12px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}
.accessArea h3 { /* 緑背景 */ }
.accessArea h4 { /* 緑タブ */
    border-bottom: 3px solid #03c46a; /* 下線に変更する場合 */
    border-radius: 0; /* 角丸削除 */
    background: none; /* 背景削除 */
    color: #333; /* 文字色変更 */
    display: block; /* インラインブロック解除 */
    padding: 0 0 5px 0; /* パディング調整 */
    margin-bottom: 15px;
}
.accessArea > p { /* 注釈文 */
    font-size: 0.9rem; color: #777; margin-left: 20px; position: relative; padding-left: 1.2em;
}
.accessArea > p::before { content: '※'; position: absolute; left: 0; }

/* --- 施設概要 レスポンシブ --- */
@media (max-width: 768px) {
    .accessArea { padding: 20px 15px; margin: 30px 10px; }
    .accessArea h3 { font-size: 1.8rem; }
    .accessArea h4 { font-size: 1.4rem; }
}

/* ============================================= */
/* == 各種スクール共通注意事項 == */
/* ============================================= */
#chuiArea {
    max-width: 900px; margin: 50px auto; padding: 25px 30px;
    background-color: #fdfdfd; border: 1px solid #eee; border-radius: 12px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}
#chuiArea h3 { /* 緑背景 */ }
#chuiArea ul {
    list-style: none; /* 点を削除 */
    padding: 0;
    margin: 0;
}
#chuiArea li {
    font-size: 0.95rem;
    color: #555;
    line-height: 1.8;
    padding-left: 1.5em; /* アイコン分のスペース */
    position: relative;
    margin-bottom: 10px;
}
#chuiArea li::before { /* リストマーカーをカスタム */
    content: '●'; /* または Font Awesome など */
    color: #03c46a; /* キーカラー */
    position: absolute;
    left: 0;
    top: 0;
}
#chuiArea li strong { color: #e74c3c; } /* 強調文字を赤に */





/* ============================================= */
/* == トップへ戻るボタン == */
/* ============================================= */
#page-top-btn {
    position: fixed; /* 画面に固定 */
    bottom: 25px; /* 下から25px */
    right: 25px; /* 右から25px */
    z-index: 999; /* 他の要素より手前に */
    
    /* ボタンのデザイン */
    width: 50px;
    height: 50px;
    background-color: #333; /* 背景色 (G-Frontier風) */
    color: #fff;
    border: 2px solid #fff;
    border-radius: 50%; /* 円形 */
    text-align: center;
    text-decoration: none;
    
    /* 矢印の位置調整 */
    display: flex;
    align-items: center;
    justify-content: center;
    
    /* 最初は非表示 */
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
}

/* 矢印(span)のデザイン */
#page-top-btn .arrow {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-top: 3px solid #fff; /* 矢印の線 */
    border-left: 3px solid #fff; /* 矢印の線 */
    transform: rotate(45deg); /* 45度回転させて上向き矢印に */
    margin-top: 5px; /* 位置微調整 */
}

/* ホバー時のスタイル */
#page-top-btn:hover {
    background-color: #03c46a; /* キーカラーの緑 */
    border-color: #03c46a;
}

/* スクロールしたら表示 (JSで 'is-visible' クラスを付与) */
#page-top-btn.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}