/* ABOUT ページ専用：TOPやcommon.cssを変更しない */
.about-kicker { margin: 0 0 8px; color: var(--color-pink); font-size: 12px; font-weight: 800; letter-spacing: .16em; }
.about-hero { overflow: hidden; background: radial-gradient(circle at 52% 16%, #fff0f7 0 11%, transparent 11.5%), radial-gradient(circle at 92% 18%, #e9f7fc 0 11%, transparent 11.5%), radial-gradient(circle at 10% 92%, #fff7db 0 8%, transparent 8.5%), linear-gradient(120deg, #f6fbff, #fff 58%, #f9fff8); }
.about-hero__inner { position: relative; min-height: 345px; padding-top: 28px; padding-bottom: 50px; }
.breadcrumbs { position: relative; z-index: 2; display: flex; align-items: center; gap: 10px; color: #55708e; font-size: 12px; }
.breadcrumbs a { display: inline-flex; align-items: center; gap: 5px; }
.breadcrumbs svg { color: #f54d89; }
.about-hero__copy { position: relative; z-index: 1; margin-top: 30px; }
.about-hero h1 { margin: 0 0 16px; color: #123d6b; font-size: clamp(31px, 3.8vw, 52px); line-height: 1.35; }
.about-hero__copy > p:last-child { margin: 0; font-size: clamp(15px, 1.5vw, 20px); font-weight: 700; line-height: 1.9; }
.about-hero__landscape { position: absolute; right: 2%; bottom: 12px; width: min(40%, 490px); height: auto; }
.about-intro { padding-top: 60px; padding-bottom: 25px; text-align: center; }
.about-heading h2 { margin: 0; color: #123d6b; font-size: clamp(27px, 3vw, 38px); }
.about-heading::after { content: ''; display: block; width: 50px; height: 3px; margin: 12px auto 0; border-radius: 4px; background: #f64886; }
.about-intro__lead { margin: 26px 0 0; color: #194b7b; font-size: clamp(17px, 2vw, 23px); font-weight: 700; line-height: 1.9; }
.about-block { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(26px, 5vw, 85px); align-items: center; padding-top: 62px; padding-bottom: 62px; }
.about-block__text { min-width: 0; }
.about-block__text h2 { margin: 0 0 22px; color: #164779; font-size: clamp(23px, 2vw, 31px); line-height: 1.5; }
.about-block__text p { margin: 0 0 16px; font-size: clamp(14px, 1.1vw, 16px); line-height: 2.05; }
.about-block__text p:last-child { margin-bottom: 0; }
.about-block__photo { min-width: 0; margin: 0; }
.about-block__photo img { display: block; width: 100%; aspect-ratio: 1.6; object-fit: cover; object-position: center; border-radius: 22px; }
.about-block--reverse .about-block__photo { order: -1; }
.about-band { position: relative; }
.about-band--pink { background: #fff4f8; }
.about-band--mint { background: #f0faf5; }
.about-band .about-block { padding-top: 48px; padding-bottom: 48px; }
.about-icon { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-bottom: 12px; border-radius: 50%; font-size: 31px; font-weight: 800; }
.about-icon--pink { color: #f04886; background: #ffe0eb; }
.about-icon--rose { color: #f04886; background: #fff0f6; }
.about-icon--green { color: #2cb16a; background: #e5f9ec; }
.about-icon--blue { color: #248ad7; background: #e9f6ff; }
.about-quote { color: #224e76; font-weight: 700; }
.about-block--facility { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); }
.about-facility-photos { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; align-items: stretch; }
.about-facility-photos img { display: block; width: 100%; height: auto; min-height: 245px; aspect-ratio: 1.6; border-radius: 15px; object-fit: cover; }
.about-facility-photos__pending { position: relative; }
.about-facility-photos__pending span { position: absolute; right: 8px; bottom: 8px; padding: 3px 8px; border-radius: 6px; color: #fff; background: #b03e62; font-size: 11px; font-weight: 700; }
.about-photo-note { padding-bottom: 18px; color: #6b7f91; font-size: 11px; }
.about-closing { padding: 26px 0 55px; text-align: center; }
.about-closing p { margin: 0; color: #154b78; font-size: clamp(17px, 1.75vw, 24px); font-weight: 800; line-height: 2; }
.about-cta { padding: 22px 0 50px; }
.about-cta__inner { display: flex; align-items: center; gap: 30px; padding: 25px 34px; border-radius: 22px; background: #fff1f7; }
.about-cta__inner > img { width: 130px; height: auto; }
.about-cta__inner > div { flex: 1; }
.about-cta__inner h2 { margin: 0; color: #164779; font-size: clamp(20px, 2vw, 26px); }
.about-cta__inner p { margin: 5px 0 0; font-size: 13px; }
@media (max-width: 900px) {
    .about-hero__inner { min-height: 280px; }
    .about-hero__landscape { width: 38%; }
    .about-block { gap: 24px; }
    .about-block__text p { font-size: 14px; }
    .about-cta__inner { flex-wrap: wrap; }
}
@media (max-width: 767px) {
    .about-hero__inner { min-height: 248px; padding-top: 22px; padding-bottom: 38px; }
    .about-hero__copy { margin-top: 23px; }
    .about-hero h1 { font-size: clamp(28px, 7vw, 37px); }
    .about-hero__landscape { width: 130px; right: -24px; bottom: 4px; opacity: .55; }
    .about-hero__copy > p:last-child { font-size: 14px; }
    .about-intro { padding-top: 46px; }
    .about-intro__lead { margin-top: 20px; font-size: 17px; }
    .about-block, .about-block--facility { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; padding-top: 44px; padding-bottom: 44px; }
    .about-band .about-block { padding-top: 38px; padding-bottom: 38px; }
    .about-block--reverse .about-block__photo { order: 0; }
    .about-block__photo { width: 100%; }
    .about-block__photo img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
    .about-block__text h2 { font-size: 23px; margin-bottom: 15px; }
    .about-block__text p { font-size: 14px; line-height: 1.95; }
    .about-facility-photos { grid-template-columns: minmax(0, 1fr); gap: 9px; }
    .about-facility-photos img { min-height: 155px; }
    .about-closing { padding-bottom: 38px; }
    .about-cta__inner { gap: 14px; padding: 22px 18px; }
    .about-cta__inner > img { width: 80px; }
    .about-cta__inner h2 { font-size: 19px; }
    .about-cta__inner .button { width: 100%; }
}

/* ============================================================
   ABOUT V2 読みやすさ調整（2026-10-20）
   - TOP / common.css は変更しない
   - レイアウトや写真の表示順、下層ページCTAのデザインは維持
   ============================================================ */

/* PC：本文と写真の間隔をわずかに狭める */
@media (min-width: 901px) {
    .about-block {
        gap: clamp(26px, 4vw, 68px);
    }
}

/* スマホ：本文と見出しの読みやすさを優先 */
@media (max-width: 767px) {
    .about-hero__copy > p:last-child {
        font-size: 15px;
        line-height: 1.85;
    }

    .about-intro__lead {
        font-size: 18px;
        line-height: 1.85;
    }

    .about-block__text h2 {
        margin-bottom: 18px;
        font-size: 22px;
        line-height: 1.55;
        overflow-wrap: anywhere;
    }

    .about-block__text p {
        margin-bottom: 18px;
        font-size: 15px;
        line-height: 1.9;
    }

    .about-block,
    .about-block--facility {
        gap: 24px;
        padding-top: 48px;
        padding-bottom: 48px;
    }

    .about-band .about-block {
        padding-top: 42px;
        padding-bottom: 42px;
    }

    .about-block__photo img {
        width: 100%;
        aspect-ratio: 4 / 3;
        object-fit: cover;
    }

    .about-closing p {
        font-size: 18px;
        line-height: 1.85;
    }
}