/* ==============================
   CBA GALLERY 03 — ROSE
   薔薇の記憶 / 初めての挿し木栽培
================================== */

.rose-page {
    background: #fff;
}

.rose-intro {
    padding-top: 112px;
    padding-bottom: 100px;
}

.rose-subtitle {
    margin: -8px 0 0;
    font-family: "Noto Serif JP", "Yu Mincho", serif;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: .14em;
    color: #4c5a61;
}

.rose-subtitle-small {
    margin: 10px 0 0;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 11px;
    font-weight: 300;
    letter-spacing: .10em;
    color: #8b969b;
}

.rose-intro-line {
    width: 36px;
    height: 1px;
    margin: 30px auto 28px;
    background: #a9b8bf;
}

.rose-lead {
    line-height: 2.35;
}

.rose-chapter {
    padding-top: 100px;
    padding-bottom: 110px;
    background: #f8f9f9;
}

.rose-story {
    width: min(1080px, 90%);
    margin: 0 auto;
}

.rose-entry {
    margin: 0;
}

.rose-entry-main {
    width: min(820px, 100%);
    margin: 0 auto;
}

.rose-entry-main .photo-button img {
    max-height: 720px;
    object-fit: contain;
}

.rose-caption {
    padding: 22px 4px 12px;
}

.rose-caption h2 {
    margin: 0 0 10px;
    font-family: "Noto Serif JP", "Yu Mincho", serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.7;
    letter-spacing: .08em;
    color: #344149;
}

.rose-caption p:last-child {
    margin: 0;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 12px;
    font-weight: 300;
    line-height: 2.05;
    letter-spacing: .05em;
    color: #6d787e;
}

.rose-caption strong {
    font-weight: 400;
    color: #4b5d65;
}

.rose-caption-center {
    text-align: center;
}

.rose-divider {
    width: 1px;
    height: 70px;
    margin: 58px auto 74px;
    background: #d3dadd;
}

.rose-grid {
    display: grid;
    align-items: start;
}

.rose-grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 62px;
    width: min(960px, 100%);
    margin: 0 auto;
}

.rose-growth-grid {
    margin-top: 88px;
}

.rose-grid .rose-entry .photo-button img {
    width: 100%;
    height: auto;
}

.rose-entry-bloom {
    width: min(760px, 100%);
    margin: 105px auto 0;
}

.rose-entry-bloom .photo-button img {
    max-height: 760px;
    object-fit: contain;
}

.rose-entry-hero {
    width: min(700px, 100%);
    margin: 105px auto 0;
}

.rose-entry-hero .photo-button img {
    width: 100%;
    height: auto;
}

.rose-hero-caption {
    padding-top: 28px;
}

.rose-entry-final {
    width: min(720px, 100%);
    margin: 112px auto 0;
}

.rose-entry-final .photo-button img {
    max-height: 760px;
    object-fit: contain;
}

.rose-final-caption {
    padding-top: 28px;
}

.rose-afterglow {
    margin-top: 28px !important;
    font-family: "Noto Serif JP", "Yu Mincho", serif !important;
    font-size: 15px !important;
    line-height: 2 !important;
    letter-spacing: .12em !important;
    color: #4e5e65 !important;
}

.gallery-next-03 {
    padding-top: 78px;
}

@media (max-width: 760px) {
    .rose-intro {
        padding-top: 88px;
        padding-bottom: 76px;
    }

    .rose-subtitle {
        font-size: 17px;
    }

    .rose-chapter {
        padding-top: 72px;
        padding-bottom: 82px;
    }

    .rose-story {
        width: min(92%, 620px);
    }

    .rose-grid-2 {
        grid-template-columns: 1fr;
        gap: 56px;
    }

    .rose-growth-grid {
        margin-top: 58px;
    }

    .rose-divider {
        height: 48px;
        margin: 42px auto 54px;
    }

    .rose-entry-bloom,
    .rose-entry-hero,
    .rose-entry-final {
        margin-top: 76px;
    }

    .rose-caption {
        padding-top: 18px;
    }

    .rose-caption h2 {
        font-size: 17px;
    }

    .rose-caption p:last-child {
        font-size: 11.5px;
        line-height: 2.1;
    }
}