/* ============================================================
   Private 追加スタイル（2026-09）
   my-style.css は編集禁止（SCSSソース消失）のため、
   Private院関連の追加分のみ本ファイルで管理する
============================================================ */

/* --- ① トップ 施術者紹介: PCタブ（カード画像・クリック前後で切替） --- */
.top-staff__tab-item--private .top-staff__tab-link {
    overflow: hidden;
}

.top-staff__tab-card {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.top-staff__tab-card--active {
    display: none;
}

.top-staff__tab-link.is-active .top-staff__tab-card--default {
    display: none;
}

.top-staff__tab-link.is-active .top-staff__tab-card--active {
    display: block;
}

/* --- ① トップ 施術者紹介: SPアコーディオンヘッダー（横長バナー） --- */
.top-staff__accordion-logo--private {
    width: 100%;
}

/* --- ② トップ 各院紹介: 1枚画像カード --- */
/* Figma: カードは列上端〜下の横罫線まで(341x448)。列いっぱいに敷く */
.top-location__private-link {
    display: block;
}

.top-location__private-image {
    display: block;
    width: 100%;
}

.top-location__item--private {
    padding-bottom: 0;
}

@media screen and (min-width: 1025px) {
    .top-location__private-link {
        height: 100%;
    }

    .top-location__private-image {
        height: 100%;
        object-fit: cover;
    }
}

/* --- ⑤⑥ About・Method 各院紹介: 1枚画像カード --- */
/* Figma: PCはカード323px(列305pxより9pxずつ張り出し)+drop shadow(既存カードと同値) */
/* SP幅は縦罫線(.about-clinic__items::before/::after = 左右4.6%)に合わせる。
   これより広いとカードが罫線に被さり、::beforeがli背面のため左罫線だけ消える。
   Figmaもカード左右端＝罫線位置 */
.about-clinic__private-link {
    display: block;
    width: 90.8%;
    margin: 0 auto;
}

.about-clinic__private-image {
    width: 100%;
    display: block;
}

@media screen and (min-width: 1025px) {
    .about-clinic__private-link {
        width: 105.9%;
        margin: 0 0 0 -2.95%;
        box-shadow: 0px 4px 19px rgba(0, 0, 0, .25);
    }
}

/* --- SP調整（Figma: SP各カードは区切り線・罫線にピッタリ接する） --- */
@media screen and (max-width: 1024px) {
    /* ① アコーディオンヘッダー: バナーを枠線内いっぱいに（Figma: 縦線x16〜412にバナーが接する） */
    .top-staff__accordion-tap-area--private {
        padding: 0;
    }

    .top-staff__accordion-tap-area--private .top-staff__accordion-button {
        margin-top: 0;
    }

    /* OPEN/CLOSEマークはバナーが縦長なぶん下寄せ（既存タブと同じ下端基準・Figmaは下端21px） */
    .top-staff__accordion-tap-area--private .top-staff__accordion-icon-wrapper {
        top: auto;
        bottom: 23px;
    }

    .top-staff__accordion-tap-area--private .top-staff__accordion-button-line-bottom {
        bottom: 0;
    }

    /* ② 上罫線: liがframe-line--just-lengthのため既定で幅100%に抑えられる。
       既存院の罫線と同じく両脇にはみ出させる（.frame-line__top の基本値に戻す） */
    .top-location__item--private>.frame-line__top {
        left: -9px;
        width: calc(100% + 16px);
    }

    /* 縦罫線のうち ::before は li より背面に描画されるため、
       不透明なPrivateカードに隠れる。前面に出して左右とも見えるようにする
       （既存院はli背景が透明なので見た目は変わらない） */
    .about-clinic__items::before {
        z-index: 1;
    }

    /* ⑤⑥ Figmaではカードが上下の区切り線に接する。
       区切り線は既存の .about-clinic__item::after が担うので追加せず、
       川崎の線がカード上端に来るよう間隔を詰め、自身の線はカード下端へ */
    .about-clinic__item+.about-clinic__item--private {
        margin-top: 10px;
    }

    .about-clinic__item--private::after {
        bottom: 0;
    }
}