/* TOP専用CSS：症例・FAQのTOP表示 / TOPセクション / CONTACT */

/* =========================================================
   TOP：症例写真フィルター
========================================================= */

.classy-top-cases__filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 24px;
}

.classy-top-cases__filter {
    appearance: none;
    -webkit-appearance: none;

    min-width: 110px;
    margin: 0;
    padding: 10px 20px;

    border: 1px solid #cfc8bf;
    border-radius: 0;

    background: #fff;
    color: #4a433e;

    font-family: inherit;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;

    text-align: center;
    white-space: nowrap;

    cursor: pointer;

    transition:
        background-color .2s ease,
        color .2s ease,
        border-color .2s ease;
}

.classy-top-cases__filter.is-active {
    background: #4a433e;
    border-color: #4a433e;
    color: #fff;
}


/* =========================================================
   TOP：症例内の限定解除
   通常記事の .classy-gentei には影響させない
========================================================= */

.classy-top-cases__gentei .classy-gentei {
    margin: 14px 0 0;
}

.classy-top-cases__gentei .classy-gentei__row {
    grid-template-columns: 92px 1fr;
}

.classy-top-cases__gentei .classy-gentei__label {
    padding: 8px 9px;
    font-size: 11px;
    line-height: 1.5;
}

.classy-top-cases__gentei .classy-gentei__value {
    padding: 8px 10px;
    font-size: 11px;
    line-height: 1.6;
}

/* =========================================================
   SP
========================================================= */

@media screen and (max-width: 767px) {

    /*
     * フィルターボタン
     * 横スクロールせず自然に折り返す
     */
    .classy-top-cases__filters {
        flex-wrap: wrap;
        width: 100%;
        margin-bottom: 18px;
        padding-bottom: 0;
        overflow: visible;
    }

    .classy-top-cases__filter {
        flex: 0 0 auto;
        min-width: auto;
        padding: 9px 17px;
        font-size: 13px;
    }

    /*
     * TOP症例内だけ限定解除をコンパクト化
     */
    .classy-top-cases__gentei .classy-gentei {
        margin-top: 12px;
    }

    .classy-top-cases__gentei .classy-gentei__row {
        display: grid;
        grid-template-columns: 82px 1fr;
    }

    .classy-top-cases__gentei .classy-gentei__label {
        padding: 7px 8px;
        font-size: 10px;
    }

    .classy-top-cases__gentei .classy-gentei__value {
        padding: 7px 8px;
        font-size: 10px;
    }
}


/* =========================================================
   TOP：症例フィルター 最大行数制御
========================================================= */

.classy-top-cases__filter.is-row-hidden {
    display: none;
}


/* ----------------------------------------
 * NEW TOP：FAQ（トップページ専用）
 * ---------------------------------------- */
.classy-top-faq { padding: 70px 0; background: #fff; }
.classy-top-faq__list { max-width: 960px; margin: 30px auto 0; border-top: 1px solid #ddd; }
.classy-top-faq__item { border-bottom: 1px solid #ddd; }
.classy-top-faq__question { display: flex; align-items: center; gap: 16px; padding: 22px 12px; cursor: pointer; list-style: none; font-weight: 600; }
.classy-top-faq__question::-webkit-details-marker { display: none; }
.classy-top-faq__mark { flex: 0 0 30px; font-size: 21px; font-family: Georgia, serif; color: #a58c63; }
.classy-top-faq__mark--answer { color: #777; }
.classy-top-faq__question-text { flex: 1; min-width: 0; }
.classy-top-faq__toggle { width: 11px; height: 11px; flex: 0 0 11px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: rotate(45deg); transition: transform .2s ease; }
.classy-top-faq__item[open] .classy-top-faq__toggle { transform: rotate(225deg); }
.classy-top-faq__answer { display: flex; gap: 16px; padding: 0 12px 24px; line-height: 1.85; }
.classy-top-faq__answer-content { flex: 1; min-width: 0; }
.classy-top-faq__answer-content > :first-child { margin-top: 0; }
.classy-top-faq__answer-content > :last-child { margin-bottom: 0; }
.classy-top-faq__links { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-top: 18px; }
.classy-top-faq__links a { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 767px) {
  .classy-top-faq { padding: 45px 0; }
  .classy-top-faq__question { padding: 18px 8px; gap: 10px; }
  .classy-top-faq__answer { padding: 0 8px 20px; gap: 10px; }
}


/* TOP FAQ：セクション右下の一覧リンク */
.classy-top-faq__more { max-width: 960px; margin: 24px auto 0; text-align: right; }
.classy-top-faq__more a { display: inline-block; text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 4px; }
.classy-top-faq__more a:hover { opacity: .7; }
@media (max-width: 767px) { .classy-top-faq__more { margin-top: 20px; } }

/* TOP FAQ：レイアウトと装飾（TOP専用） */
.classy-top-faq .classy-top-container { width: calc(100% - 80px); max-width: 1200px; margin-inline: auto; }
.classy-top-faq .classy-top-faq__list { max-width: none; margin: 32px 0 0; border-top: 1px solid #dcd8d2; }
.classy-top-faq .classy-top-faq__item { margin: 0; border-bottom: 1px solid #dcd8d2; }
.classy-top-faq .classy-top-faq__question { display: flex; align-items: center; gap: 16px; position: relative; padding: 22px 12px; font-size: clamp(15px, 1.25vw, 18px); line-height: 1.65; font-weight: 500; cursor: pointer; list-style: none; }
.classy-top-faq .classy-top-faq__question::marker { content: ""; }
.classy-top-faq .classy-top-faq__question::-webkit-details-marker { display: none; }
.classy-top-faq .classy-top-faq__mark { flex: 0 0 28px; font-family: Georgia,serif; font-size: 21px; line-height: 1.4; color: #b49a70; }
.classy-top-faq .classy-top-faq__question-text { flex: 1; min-width: 0; }
.classy-top-faq .classy-top-faq__toggle { flex: 0 0 10px; width: 10px; height: 10px; border-right: 1px solid #7b6c59; border-bottom: 1px solid #7b6c59; transform: rotate(45deg); transition: transform .2s; margin-right: 5px; }
.classy-top-faq .classy-top-faq__item[open] .classy-top-faq__toggle { transform: rotate(225deg); }
.classy-top-faq .classy-top-faq__answer { display: flex; gap: 16px; padding: 0 12px 24px; font-size: 15px; line-height: 1.85; }
.classy-top-faq .classy-top-faq__answer-content { min-width: 0; flex: 1; }
.classy-top-faq .classy-top-faq__links a { color: #8a704b; }
.classy-top-faq .classy-top-faq__more { max-width: none; margin: 25px 0 0; text-align: right; }
.classy-top-faq .classy-top-faq__more a { color: #8a704b; font-size: 14px; text-decoration: none; border-bottom: 1px solid #b49a70; padding-bottom: 5px; }
@media (max-width: 767px) {
 .classy-top-faq .classy-top-container { width: calc(100% - 36px); }
 .classy-top-faq .classy-top-faq__list { margin-top: 24px; }
 .classy-top-faq .classy-top-faq__question { gap: 10px; padding: 17px 4px; font-size: 15px; }
 .classy-top-faq .classy-top-faq__mark { flex-basis: 20px; font-size: 19px; }
 .classy-top-faq .classy-top-faq__answer { gap: 10px; padding: 0 4px 20px; font-size: 14px; }
 .classy-top-faq .classy-top-faq__more { margin-top: 20px; }
}


/* TOP FAQ：ホバー操作の視認性（2026-10） */
@media (hover: hover) and (pointer: fine) {
  .classy-top-faq .classy-top-faq__question {
    transition: background-color .2s ease;
  }
  .classy-top-faq .classy-top-faq__question:hover {
    background-color: #f9f6f1;
  }
  .classy-top-faq .classy-top-faq__question:hover .classy-top-faq__toggle {
    border-color: #b18e60;
    translate: 0 2px;
  }
  .classy-top-faq .classy-top-faq__links a {
    transition: color .2s ease, border-color .2s ease;
  }
  .classy-top-faq .classy-top-faq__links a:hover {
    color: #59462f;
    text-decoration-color: #59462f;
  }
  .classy-top-faq .classy-top-faq__more a:hover {
    color: #59462f;
    border-bottom-color: #59462f;
    opacity: 1;
  }
}

/* TOP FAQ: PC hover feedback (2026-10-10) */
@media (hover: hover) and (pointer: fine) {
  .classy-top-faq .classy-top-faq__question {
    transition: background-color .2s ease, color .2s ease;
  }
  .classy-top-faq .classy-top-faq__question:hover {
    background-color: #f5f0e8;
  }
  .classy-top-faq .classy-top-faq__question:hover .classy-top-faq__question-text {
    color: #967448;
  }
  .classy-top-faq .classy-top-faq__question:hover .classy-top-faq__toggle {
    border-color: #967448;
  }
}

/* ========================================
   NEW TOP
   メインビジュアル ＋ 施術カテゴリ
======================================== */


/* ----------------------------------------
   MAIN VISUAL
---------------------------------------- */

.classy-top-hero {
    position: relative;
    width: calc(100% - 80px);
    max-width: 1440px;
    margin: 28px auto 0;
    overflow: hidden;
    background: #f7f3ef;
}

.classy-top-hero__image {
    width: 100%;
}

.classy-top-hero__image img {
    display: block;
    width: 100%;
    height: auto;
}

/* ----------------------------------------
   TREATMENT CATEGORY
---------------------------------------- */

.classy-top-treatment {
    width: 100%;
    margin: 42px 0 40px;
    padding: 0;
}

.classy-top-treatment__inner {
    width: calc(100% - 80px);
    max-width: 1200px;
    margin: 0 auto;
}

.classy-top-treatment__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}


/* カード */

.classy-top-treatment__card {
    position: relative;

    display: block;
    overflow: hidden;

    aspect-ratio: 2 / 1;

    background: #eee;
    color: #fff !important;

    text-decoration: none !important;
}

.classy-top-treatment__card img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform .6s ease;
}

.classy-top-treatment__card::after {
    content: "";

    position: absolute;
    inset: 0;
    z-index: 1;

    background:
        linear-gradient(
            90deg,
            rgba(40, 32, 27, .48) 0%,
            rgba(40, 32, 27, .24) 52%,
            rgba(40, 32, 27, .05) 100%
        );
}

.classy-top-treatment__card:hover img {
    transform: scale(1.035);
}


/* カード内テキスト */

.classy-top-treatment__overlay {
    position: absolute;
    left: 24px;
    right: 20px;
    bottom: 18px;
    z-index: 2;
}

.classy-top-treatment__en {
    display: block;

    margin: 0 0 5px;

    font-family: Georgia, "Times New Roman", serif;

    font-size: 8px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: .16em;
}

.classy-top-treatment__title {
    margin: 0;
    padding: 0;

    border: 0;
    background: none;

    color: #fff !important;

    font-family:
        "Yu Mincho",
        "YuMincho",
        "Hiragino Mincho ProN",
        "Hiragino Mincho Pro",
        serif;

    font-size: 18px;
    font-weight: 400;
    line-height: 1.35;
    letter-spacing: .03em;
}

.classy-top-treatment__description {
    margin: 9px 0 0;
    padding: 0;

    color: rgba(255, 255, 255, .95);

    font-size: 9px;
    font-weight: 400;
    line-height: 1.65;
    letter-spacing: .02em;
}

.classy-top-treatment__arrow {
    position: absolute;
    right: 0;
    bottom: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 28px;
    height: 28px;
    box-sizing: border-box;

    border: 0;
    border-radius: 50%;

    background: #fff;
    color: #75685f;

    font-size: 14px;
    font-weight: 400;
    line-height: 1;
}

/* すべての施術 */

.classy-top-treatment__all {
    margin-top: 28px;
    text-align: right;
}

.classy-top-treatment__all a {
    display: inline-flex;
    align-items: center;
    gap: 14px;

    padding: 0 0 7px;

    border-bottom: 1px solid #b8aa9d;

    color: #5e5650;

    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: .06em;

    text-decoration: none;
}

.classy-top-treatment__all a:hover {
    color: #a88752;
}

/* ========================================
   NEW TOP：SP
======================================== */

@media screen and (max-width: 767px) {

    .classy-top-hero {
        width: 100%;
        margin: 0;
    }

    .classy-top-treatment__inner {
        width: calc(100% - 32px);
    }

    .classy-top-treatment__grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

}

/* ========================================
   TOP PAGE H1
   PCヘッダー上部
======================================== */

.classy-top-headline {
    width: 100%;
    background: #fff;
}

.classy-top-headline h1 {
    width: calc(100% - 80px);
    max-width: 1540px;
    margin: 0 auto;
    padding: 8px 32px 6px;
    box-sizing: border-box;

    color: #777;
    background: none;
    border: 0;

    font-size: 10px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: .04em;
    text-align: left;
}

/* ========================================
   TOP H1 最終位置調整
   MV左端（40px）に合わせる
======================================== */

.classy-top-headline h1 {
    display: block !important;
    width: auto !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 8px 40px 6px !important;

    box-sizing: border-box;

    color: #777;
    background: none;
    border: 0;

    font-size: 10px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: .04em;
    text-align: left;
}

/* ========================================
   MAIN VISUAL：PC / SP 切り替え
======================================== */

.classy-mainvisual__picture {
    display: block;
    width: 100%;
}

.classy-mainvisual__picture img {
    display: block;
    width: 100%;
    height: auto;
}

/* ========================================
   SP TOP：H1 + 固定ヘッダー位置制御
======================================== */

@media screen and (max-width: 767px) {

    body {
        padding-top: calc(60px + var(--classy-sp-h1-height, 0px));
    }

	.classy-sp-headline {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 10001;

		margin: 0;
		padding: 7px 14px 6px;
		box-sizing: border-box;

		background: #fff;
	}

	.classy-sp-headline h1 {
		margin: 0;
		padding: 0;

		color: #4a4542;

		font-size: 2.18vw;
		font-weight: 400;
		line-height: 1.4;
		letter-spacing: 0;
		white-space: nowrap;
	}

    body.classy-sp-scrolled .classy-sp-header {
        top: 0;
    }

}

/* ========================================
   SP TOP：スクロール時にH1を非表示
======================================== */

@media screen and (max-width: 767px) {

    body.classy-sp-scrolled .classy-sp-headline {
        transform: translateY(-100%);
        opacity: 0;
        pointer-events: none;
    }

    .classy-sp-headline {
        transition:
            transform .15s ease,
            opacity .15s ease;
    }

}

/* ========================================
   PC：固定ヘッダー分のアンカー位置調整
   /clinic#route
======================================== */

@media screen and (min-width: 769px) {

    #route {
        scroll-margin-top: 90px;
    }

}

/* ========================================
   TOP：共通コンテンツ幅
   3カテゴリより下の新規コンテンツで使用
======================================== */

.classy-top-container {
    width: calc(100% - 80px);
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

@media screen and (max-width: 767px) {

    .classy-top-container {
        width: calc(100% - 32px);
    }

}

/* SP：3カテゴリ → おすすめ施術の間隔 */
@media screen and (max-width: 767px) {

    .classy-top-treatment {
        margin-bottom: 32px;
    }

}

/* ========================================
   TOP：共通セクションタイトル
======================================== */

.classy-top-section-title {
    margin: 0 0 22px;
}

.classy-top-section-title__en {
    display: block;
    margin-bottom: 7px;
    color: #b89a67;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 10px;
    line-height: 1;
    letter-spacing: .14em;
}

.classy-top-section-title h2 {
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    color: #3f3834;
    font-family:
        "Yu Mincho",
        "YuMincho",
        "Hiragino Mincho ProN",
        "Hiragino Mincho Pro",
        serif;
    font-size: 26px;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: .04em;
}

@media screen and (max-width: 767px) {

    .classy-top-section-title {
        margin-bottom: 16px;
    }

    .classy-top-section-title h2 {
        font-size: 22px;
    }

}

/* ========================================
   TOP：症例写真
======================================== */

.classy-top-cases {
    margin: 70px 0 90px;
}

.classy-top-cases__slider {
    position: relative;
    overflow: hidden;
}

.classy-top-cases__track {
    display: flex;
    gap: 24px;
    transition: transform .45s ease;
    will-change: transform;
}

.classy-top-cases__item {
    flex: 0 0 calc((100% - 48px) / 3);
    min-width: 0;
}

.classy-top-cases__item a {
    display: block;
    color: inherit;
    text-decoration: none;
}

.classy-top-cases__image {
    display: block;
    width: 100%;
    height: auto;
}

.classy-top-cases__title {
    margin: 12px 0 0;
    padding: 0;
    border: 0;
    background: none;

    color: #4a4542;

    font-size: 13px;
    font-weight: 400;
    line-height: 1.65;
}


/* ========================================
   症例写真：左右ボタン
   画像の縦中央に配置
======================================== */

.classy-top-cases__nav {
    position: absolute;
    top: var(--classy-case-nav-top, 50%);
    z-index: 5;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 46px;
    height: 46px;
    padding: 0;

    border: 1px solid #ddd;
    border-radius: 50%;

    background: rgba(255,255,255,.95);
    color: #4a4542;

    font-size: 0;
    line-height: 1;

    cursor: pointer;

    transform: translateY(-50%);
}

/* ＜ ＞ を円の完全中央へ */
.classy-top-cases__nav::before {
    display: block;

    font-family: Arial, sans-serif;
    font-size: 30px;
    font-weight: 300;
    line-height: 1;

    transform: translateY(-1px);
}

.classy-top-cases__nav--prev {
    left: 10px;
}

.classy-top-cases__nav--prev::before {
    content: "‹";
}

.classy-top-cases__nav--next {
    right: 10px;
}

.classy-top-cases__nav--next::before {
    content: "›";
}

.classy-top-cases__nav:hover {
    background: #fff;
}


/* ========================================
   TOP：症例写真 SP
======================================== */

@media screen and (max-width: 767px) {

    .classy-top-cases {
        margin: 55px 0 70px;
    }

    .classy-top-cases__track {
        gap: 0;
		align-items: flex-start;
    }

    .classy-top-cases__item {
        flex: 0 0 100%;
    }

    .classy-top-cases__nav {
        width: 42px;
        height: 42px;

        font-size: 29px;
    }

    .classy-top-cases__nav--prev {
        left: 6px;
    }

    .classy-top-cases__nav--next {
        right: 6px;
    }
}

/* SP：症例スライダー矢印の二重表示を防止 */
@media screen and (max-width: 767px) {

    .classy-top-cases__nav {
        color: transparent !important;
    }

    .classy-top-cases__nav::before {
        color: #4a4542;
    }

}

/* ========================================
   SP：症例スライダー矢印を完全中央配置
======================================== */
@media screen and (max-width: 767px) {

    /* PHPに入っている ‹ › は非表示 */
    .classy-top-cases__nav {
        color: transparent !important;
    }

    /* CSSで左右対称の矢印を作る */
    .classy-top-cases__nav::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;

        width: 9px;
        height: 9px;

        border-top: 2px solid #555;
        border-right: 2px solid #555;

        box-sizing: border-box;
    }

    /* ＜ */
    .classy-top-cases__nav--prev::before {
        transform: translate(-35%, -50%) rotate(-135deg);
    }

    /* ＞ */
    .classy-top-cases__nav--next::before {
        transform: translate(-65%, -50%) rotate(45deg);
    }
}

/* ========================================
   TOP：CLASSYが選ばれる理由
======================================== */

.classy-top-reasons {
    padding: 72px 0 76px;
    background: #faf8f5;
}

.classy-top-reasons__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}

.classy-top-reasons__item {
    min-width: 0;
    padding: 30px 20px 28px;
    box-sizing: border-box;
    background: #fff;
    text-align: center;
}

.classy-top-reasons__icon {
    display: block;
    width: 64px;
    height: 64px;
    object-fit: contain;
    margin: 0 auto 18px;
}

.classy-top-reasons__item h3 {
    margin: 0 0 12px;
    padding: 0;
    border: 0;
    background: none;
    color: #3f3834;
    font-family:
        "Yu Mincho",
        "YuMincho",
        "Hiragino Mincho ProN",
        "Hiragino Mincho Pro",
        serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.55;
    letter-spacing: .04em;
}

.classy-top-reasons__item p {
    margin: 0;
    color: #625b56;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.85;
    letter-spacing: .02em;
}

/* ========================================
   SP
======================================== */

@media screen and (max-width: 767px) {

    .classy-top-reasons {
        padding: 48px 0 52px;
    }

    .classy-top-reasons__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .classy-top-reasons__item {
        padding: 22px 10px 20px;
    }

    .classy-top-reasons__icon {
        width: 52px;
        height: 52px;
        margin-bottom: 13px;
    }

    .classy-top-reasons__item h3 {
        margin-bottom: 9px;
        font-size: 14px;
        line-height: 1.5;
    }

    .classy-top-reasons__item p {
        font-size: 11px;
        line-height: 1.75;
        letter-spacing: 0;
    }

}

/* ========================================
   TOP：共通「詳しく見る」リンク
======================================== */

.classy-top-more-link {
    margin-top: 28px;
    text-align: right;
}

.classy-top-more-link a {
    display: inline-flex;
    align-items: center;
    gap: 18px;

    padding: 0 0 8px;

    border-bottom: 1px solid #c9b89b;

    color: #65584f;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 18px;
    line-height: 1.4;
    text-decoration: none;
}

.classy-top-more-link a span {
    font-size: 16px;
    line-height: 1;
}

@media screen and (max-width: 767px) {

    .classy-top-more-link {
        margin-top: 20px;
    }

    .classy-top-more-link a {
        gap: 14px;
        padding-bottom: 7px;
        font-size: 16px;
    }
}

/* =========================================================
   TOP：症例フィルター行 ＋ 症例一覧
========================================================= */

.classy-top-cases__filter-row {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin: 0 0 24px;
}

.classy-top-cases__filter-row .classy-top-cases__filters {
    flex: 1 1 auto;
    min-width: 0;
    margin-bottom: 0;
}

.classy-top-cases__list-link {
    flex: 0 0 auto;

    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 40px;
    padding: 0 18px;
    box-sizing: border-box;

    border: 1px solid #cfc8bf;

    background: #fff;
    color: #4a433e !important;

    font-size: 13px;
    line-height: 1.4;
    white-space: nowrap;
    text-decoration: none !important;
}


/* =========================================================
   SP
========================================================= */

@media screen and (max-width: 767px) {

    .classy-top-cases__filter-row {
        align-items: flex-start;
        gap: 8px;
        margin-bottom: 18px;
    }

    .classy-top-cases__filter-row .classy-top-cases__filters {
        width: auto;
        margin-bottom: 0;
        padding-bottom: 4px;
    }

    .classy-top-cases__list-link {
        min-height: 38px;
        padding: 0 12px;
        font-size: 12px;
    }

    .classy-top-cases__slider {
        transition: height .25s ease;
    }

}


/* ========================================
   TOP：当院について・医師紹介
======================================== */

.classy-top-about {
    margin: 0 0 85px;
}

.classy-top-about__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.classy-top-about__item {
    min-width: 0;
}

.classy-top-about__panel {
    display: grid;
    grid-template-columns: 45% 55%;
    min-height: 290px;
    overflow: hidden;
    background: #f8f6f3;
}

.classy-top-about__photo {
    position: relative;
    min-width: 0;
    min-height: 290px;
    overflow: hidden;
    background: #e9e1d8;
}

.classy-top-about__photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.classy-top-about__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    min-width: 0;
    padding: 30px 25px;
}

.classy-top-about__content h2 {
    margin: 0 0 18px;
    padding: 0;
    border: 0;
    background: none;
    color: #3f3834;
    font-family: "Yu Mincho", "YuMincho",
                 "Hiragino Mincho ProN", serif;
    font-size: 23px;
    font-weight: 400;
    line-height: 1.55;
    letter-spacing: .04em;
}

.classy-top-about__content p {
    margin: 0 0 22px;
    color: #655d57;
    font-size: 12px;
    line-height: 1.9;
}

/* 当院について・医師紹介：共通の下線付きリンク */
.classy-top-about__button {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    align-self: flex-end;
    gap: 14px;

    min-width: 0;
    margin-top: auto;
    padding: 0 0 7px;

    box-sizing: border-box;
    border: 0;
    border-bottom: 1px solid #b8aa9d;
    border-radius: 0;

    background: transparent;
    color: #5e5650 !important;

    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: .06em;
    text-decoration: none !important;
}

.classy-top-about__button:hover {
    color: #a88752 !important;
}

.classy-top-about__button span {
    font-size: 16px;
    line-height: 1;
}

/* ========================================
   TOP：当院について・医師紹介 SP
======================================== */

@media screen and (max-width: 767px) {

    .classy-top-about {
        margin-bottom: 60px;
    }

    .classy-top-about__grid {
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .classy-top-about__panel {
        display: flex;
        flex-direction: column;
        min-height: 0;
    }

    .classy-top-about__photo {
        width: 100%;
        height: 210px;
        min-height: 0;
    }

    .classy-top-about__content {
        padding: 25px 22px 30px;
    }

    .classy-top-about__content h2 {
        margin-bottom: 14px;
        font-size: 24px;
    }

    .classy-top-about__content p {
        margin-bottom: 18px;
        font-size: 12px;
        line-height: 1.85;
    }
}

/* ========================================
   TOP：当院について・医師紹介
   キャッチコピー
======================================== */

.classy-top-about__catch {
    margin: 0 0 18px;
    padding: 0;
    border: 0;
    background: none;
    color: #3f3834;
    font-family: "Yu Mincho", "YuMincho",
                 "Hiragino Mincho ProN", serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.55;
    letter-spacing: .04em;
}

@media screen and (max-width: 767px) {

    .classy-top-about__item + .classy-top-about__item {
        margin-top: 40px;
    }

    .classy-top-about__catch {
        margin-bottom: 18px;
        font-size: 22px;
    }
}

/* NEW TOP：CONTACT（アクセスを統合） */
.classy-top-contact{box-sizing:border-box;background:#faf8f5;padding:76px 0 80px}
.classy-top-contact__inner{width:calc(100% - 80px);max-width:1200px;margin:0 auto}
.classy-top-contact__clinic-name{font-size:clamp(21px,2vw,28px);font-weight:500;color:#51483e;margin:28px 0 18px;line-height:1.5}
.classy-top-contact__cards{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:stretch}
.classy-top-contact__card{box-sizing:border-box;border:1px solid #d6c9b5;background:#fff;padding:22px 20px;min-width:0}
.classy-top-contact__card--info{font-size:15px;color:#51483e;line-height:1.65}
.classy-top-contact__card--info p{margin:0 0 6px}
.classy-top-contact__card--info p:last-child{margin-bottom:0}
.classy-top-contact__address{white-space:nowrap}
.classy-top-contact__walk{color:#967448;font-weight:500;padding-top:5px}
.classy-top-contact__card-heading{display:flex;align-items:center;gap:7px;font-size:15px;font-weight:500;color:#51483e;line-height:1.5}
.classy-top-contact__phone-icon{display:inline-flex;color:#967448;flex:none}
.classy-top-contact__phone-pc{font-size:clamp(18px,1.8vw,27px);font-weight:500;letter-spacing:0;margin-top:19px;color:#51483e;white-space:nowrap}
.classy-top-contact__phone-sp,.classy-top-contact__line-sp{display:none}
.classy-top-contact__line-link{display:flex;justify-content:center;align-items:center;min-height:52px;margin-top:17px;padding:8px;background:#eef7f0;border:1px solid #79a78b;color:#286b46;text-decoration:none!important;font-size:15px;font-weight:500;transition:background-color .2s}
.classy-top-contact__line-link:hover,.classy-top-contact__line-link:focus-visible{background:#e0f0e5}
.classy-top-contact__map{width:100%;height:420px;background:#f1eee8;overflow:hidden;margin-top:24px}
.classy-top-contact__map iframe{display:block;width:100%;height:100%;border:0}
.classy-top-contact__more{text-align:right;margin-top:24px}
.classy-top-contact__more a{display:inline-block;color:#8a704b;font-size:14px;text-decoration:none!important;border-bottom:1px solid #b49a70;padding-bottom:5px}
.classy-top-contact__more a:hover,.classy-top-contact__more a:focus-visible{color:#5c4325;border-color:#5c4325}
@media(min-width:768px) and (max-width:1180px){
 .classy-top-contact__cards{grid-template-columns:minmax(0,1.8fr) minmax(0,1fr) minmax(0,1fr);gap:10px}
 .classy-top-contact__card{padding:18px 12px}
 .classy-top-contact__card--info,.classy-top-contact__card-heading{font-size:13px}
 .classy-top-contact__address{white-space:normal}
 .classy-top-contact__phone-pc{font-size:18px}
}
@media(max-width:767px){
 .classy-top-contact{padding:52px 0 58px}
 .classy-top-contact__inner{width:calc(100% - 36px)}
 .classy-top-contact__clinic-name{font-size:clamp(13px,4.2vw,18px);white-space:nowrap;letter-spacing:0;margin:22px 0 12px}
 .classy-top-contact__cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .classy-top-contact__card{padding:12px 9px}
 .classy-top-contact__card--info{grid-column:1/-1;border:0;background:transparent;padding:0 0 10px;font-size:14px;line-height:1.7}
 .classy-top-contact__address{white-space:normal}
 .classy-top-contact__card-heading{justify-content:center;font-size:12px;text-align:center;min-height:38px}
 .classy-top-contact__heading-text > span{display:block;white-space:nowrap}
 .classy-top-contact__phone-icon,.classy-top-contact__phone-pc,.classy-top-contact__line-pc{display:none}
 .classy-top-contact__phone-sp{display:flex;justify-content:center;align-items:center;gap:5px;min-height:60px;margin-top:8px;background:#f5f0e8;border:1px solid #bba27d;color:#51483e;text-decoration:none!important;font-size:12px}
 .classy-top-contact__phone-sp-icon{display:inline-flex}
 .classy-top-contact__line-link{min-height:60px;margin-top:8px;padding:7px 3px;font-size:12px}
 .classy-top-contact__line-sp{display:flex;justify-content:center;align-items:center;gap:5px}
 .classy-top-contact__line-round{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:#06c755;color:#fff;font-size:8px;font-weight:700;letter-spacing:-.05em}
 .classy-top-contact__map{height:240px;margin-top:20px}
 .classy-top-contact__more{margin-top:20px}
}
@media(prefers-reduced-motion:reduce){.classy-top-contact__line-link{transition:none}}

/* CONTACT：住所・診療時間・休診日の共通アイコン */
.classy-top-contact__info-row{display:flex;align-items:flex-start;gap:11px;margin-bottom:9px}
.classy-top-contact__info-row:last-child{margin-bottom:0}
.classy-top-contact__info-icon{display:inline-flex;flex:0 0 21px;color:#967448;margin-top:2px}
.classy-top-contact__info-body{min-width:0}
.classy-top-contact__info-row p{margin:0}
.classy-top-contact__info-row--address .classy-top-contact__walk{padding-top:3px}
/* 画面幅ごとに地図の縮尺を切り替え（PC 16 / SP 15） */
.classy-top-contact__map .classy-top-contact__map-sp{display:none}
@media(max-width:767px){
 .classy-top-contact__map .classy-top-contact__map-pc{display:none}
 .classy-top-contact__map .classy-top-contact__map-sp{display:block}
 .classy-top-contact__info-row{gap:9px;margin-bottom:8px}
 /* 見出しは2行になっても、電話・LINEのボタンは同じ高さに */
 .classy-top-contact__card--phone,.classy-top-contact__card--line{display:flex;flex-direction:column}
 .classy-top-contact__card--phone .classy-top-contact__phone-sp,.classy-top-contact__card--line .classy-top-contact__line-link{height:64px;min-height:64px;box-sizing:border-box;margin-top:auto;padding:7px 5px;flex:none}
 .classy-top-contact__phone-sp:link,.classy-top-contact__phone-sp:visited{color:#51483e}
}

/* CONTACT：電話・LINEの表示を統一（PC・SP） */
.classy-top-contact__line-heading-icon { display:inline-flex; align-items:center; flex:none; }
.classy-top-contact__line-round { display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:50%; background:#06c755; color:#fff; font-family:Arial,sans-serif; font-size:8px; font-weight:700; letter-spacing:-.05em; line-height:1; }
.classy-top-contact__line-heading-icon .classy-top-contact__line-round { width:23px; height:23px; font-size:7px; }
@media(max-width:767px) {
  .classy-top-contact__line-heading-icon { display:none; }
  .classy-top-contact__phone-sp, .classy-top-contact__line-sp { font-size:14px; }
  .classy-top-contact__phone-sp-icon svg { width:23px; height:23px; }
  .classy-top-contact__card--phone .classy-top-contact__phone-sp,
  .classy-top-contact__card--line .classy-top-contact__line-link { height:64px; min-height:64px; }
}

/* トップページ・症例写真：SPのフィルターを下層と同じ等幅3列にする。
 * 管理画面の最大行数判定・注目症例・末尾の症例一覧リンクは変更しない。 */
@media screen and (max-width:767px) {
  .classy-top-cases__filter-row {
    display:block;
  }
  .classy-top-cases__filter-row .classy-top-cases__filters {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    width:100%;
    margin:0;
    padding:0;
  }
  .classy-top-cases__filter-row .classy-top-cases__filter {
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    min-width:0;
    min-height:42px;
    margin:0;
    padding:7px 4px;
    box-sizing:border-box;
    text-align:center;
    font-size:11px;
    line-height:1.4;
    white-space:normal;
    overflow-wrap:anywhere;
  }
  .classy-top-cases__filter-row .classy-top-cases__filter.is-row-hidden {
    display:none;
  }
  .classy-top-cases__filter-row .classy-top-cases__list-link {
    display:flex;
    width:100%;
    min-width:0;
    min-height:42px;
    margin:0;
    padding:7px 4px;
    box-sizing:border-box;
    text-align:center;
    font-size:11px;
  }
}

/* CASE BLOG — isolated section */
.classy-case-blog{padding:76px 20px 80px;background:#fcfaf8}
.classy-case-blog .classy-top-container{max-width:1200px;margin:0 auto}
.classy-case-blog__all{display:flex;align-items:center;justify-content:center;gap:14px;width:100%;max-width:700px;min-height:54px;margin:28px auto 32px;border:1px solid #c5ad9c;color:#634638;text-decoration:none!important;background:#fff;font-size:15px;letter-spacing:.08em;transition:background .2s}
.classy-case-blog__all:hover{background:#f5ede8}
.classy-case-blog__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px;margin-top:18px}
.classy-case-blog__card--large{grid-column:span 4}
.classy-case-blog__card--small{grid-column:span 3}
.classy-case-blog__card{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px 12px 25px;border:1px solid #eee5df;border-radius:14px;background:#fff;text-align:center;text-decoration:none!important;color:#654535;transition:box-shadow .2s,transform .2s}
.classy-case-blog__card:hover{box-shadow:0 8px 22px rgba(78,51,37,.1);transform:translateY(-2px)}
.classy-case-blog__visual{display:block;width:min(100%,240px);aspect-ratio:1;margin:0 auto 16px}
.classy-case-blog__card--small .classy-case-blog__visual{width:min(100%,185px)}
.classy-case-blog__visual img{display:block;width:100%;height:100%;object-fit:contain}
.classy-case-blog__name{display:block;font-size:21px;font-weight:600;line-height:1.5;letter-spacing:.035em}
.classy-case-blog__subtitle{display:block;margin-top:4px;font-size:13px;line-height:1.65}
.classy-case-blog__card--small .classy-case-blog__name{font-size:18px}
@media(max-width:767px){.classy-case-blog{padding:48px 14px 54px}.classy-case-blog__all{margin:22px auto 25px;min-height:48px}.classy-case-blog__grid{gap:10px;margin-top:10px}.classy-case-blog__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.classy-case-blog__card--large,.classy-case-blog__card--small{grid-column:auto}.classy-case-blog__card{padding:16px 8px 18px;border-radius:10px}.classy-case-blog__visual,.classy-case-blog__card--small .classy-case-blog__visual{width:min(100%,150px);margin-bottom:10px}.classy-case-blog__name,.classy-case-blog__card--small .classy-case-blog__name{font-size:16px}.classy-case-blog__subtitle{font-size:11px}}


/* =========================================================
   TOP：症例ブログと注目症例写真を一体化（試験表示）
   見出し・フィルターは表示のみ隠し、管理機能とスライダーは維持
========================================================= */
.classy-top-cases {
    margin: 0;
    padding: 0 0 80px;
    background: #fcfaf8;
}
.classy-top-cases > .classy-top-container {
    max-width: 1200px;
}
.classy-top-cases > .classy-top-container > .classy-top-section-title,
.classy-top-cases .classy-top-cases__filter-row {
    display: none;
}
.classy-case-blog {
    padding-bottom: 28px;
}
@media screen and (max-width: 767px) {
    .classy-case-blog {
        padding-bottom: 20px;
    }
    .classy-top-cases {
        padding-bottom: 56px;
    }
}

/* CONTACT予約ボタン：PCはヘッダーLINE予約、SPは下部固定予約ボタンと統一 */
@media (min-width:768px) {
  .classy-top-contact__card--line .classy-top-contact__line-link {
    background:#00ad72; border:1px solid #00ad72; border-radius:3px;
    color:#fff !important; font-size:15px; font-weight:500;
    min-height:52px; text-decoration:none !important;
  }
  .classy-top-contact__card--line .classy-top-contact__line-link:hover,
  .classy-top-contact__card--line .classy-top-contact__line-link:focus-visible {
    background:#009a65; border-color:#009a65; color:#fff !important;
  }
}
@media (max-width:767px) {
  .classy-top-contact__card--phone .classy-top-contact__phone-sp,
  .classy-top-contact__card--line .classy-top-contact__line-link {
    border:0; border-radius:6px; color:#fff !important;
    font-size:15px; font-weight:400; line-height:1.15;
    text-decoration:none !important; gap:8px;
  }
  .classy-top-contact__card--phone .classy-top-contact__phone-sp {background:#625a50;}
  .classy-top-contact__card--line .classy-top-contact__line-link {background:#00ad72;}
  .classy-top-contact__card--phone .classy-top-contact__phone-sp:link,
  .classy-top-contact__card--phone .classy-top-contact__phone-sp:visited {color:#fff !important;}
  .classy-top-contact__line-sp {font-size:15px;gap:8px;}
  .classy-top-contact__line-sp .classy-top-contact__line-round {
    width:28px;height:28px;background:#fff;color:#00ad72;font-size:8px;
  }
}

/* TOP症例：表示中の症例だけで高さを決める。非表示カードによる余白を防止 */
.classy-top-cases__track {
    align-items: flex-start;
}