/* 子ども主体の保育への更新（TOP・当園について・園での生活だけで読み込む） */
.child-led-philosophy-heading {
    margin-bottom: 2rem;
    color: #397248;
    font-size: 2.8rem;
    line-height: 1.6;
    font-weight: 500;
    letter-spacing: .1em;
}

.child-led-intro {
    max-width: 860px;
    margin: 0 auto 5rem;
    padding: 4.5rem 5rem;
    background: #f5f7f1;
    border-radius: 0 4rem 0 4rem;
    text-align: center;
}

.child-led-intro h2 {
    margin-bottom: 2rem;
    color: #397248;
    font-size: 3rem;
    font-weight: 500;
    letter-spacing: .12em;
}

.child-led-intro p {
    font-size: 1.5rem;
    line-height: 2.2;
    letter-spacing: .1em;
}

.child-led-note {
    margin-top: 1.5rem;
    color: #607065;
    font-size: 1.3rem;
}

.child-led-safety {
    max-width: 950px;
    margin: 5rem auto 0;
    padding: 3.5rem 4rem;
    background: #f5f7f1;
    border-left: 5px solid #7dae8d;
}

.child-led-safety h3,
.child-led-story h3 {
    margin-bottom: 1rem;
    color: #397248;
    font-size: 2.4rem;
    font-weight: 500;
    letter-spacing: .1em;
}

.child-led-safety p,
.child-led-story p,
.child-led-cta p {
    font-size: 1.5rem;
    line-height: 2;
    letter-spacing: .08em;
}

.child-led-cta {
    max-width: 760px;
    margin: 4rem auto 0;
    text-align: center;
}

.child-led-cta .btnNormal {
    margin-top: 2rem;
}

.child-led-life-intro {
    padding: 0 5vw;
}

/* 年間行事：見出しの下の文と、季節ごとの文 */
.child-led-event-lead {
    max-width: 680px;
    padding: 1rem 0 4rem 6rem;
    writing-mode: horizontal-tb;
    font-size: 1.5rem;
    line-height: 2;
    letter-spacing: .08em;
}

.child-led-event-note {
    padding: 2.5rem 0 0 6rem;
    color: #607065;
    font-size: 1.3rem;
    line-height: 1.9;
    letter-spacing: .06em;
    writing-mode: horizontal-tb;
}

.child-led-season-text {
    font-size: 1.5rem;
    line-height: 2;
    letter-spacing: .08em;
}

.child-led-story {
    max-width: 950px;
    margin: 6rem auto 0;
    padding: 4rem 5rem;
    background: #f5f7f1;
    border-radius: 4rem 0 4rem 0;
    text-align: center;
}

/* 見出しや短い文を、言葉の途中で折り返さない。折り返すのは「、」「。」と <wbr> の位置だけ。
   それでも入りきらないときだけ、どこででも折り返して はみ出しを防ぐ（iPhone の Safari でも効く書き方） */
.child-led-philosophy-heading,
.aboutWrap02 .t01,
.aboutWrap03 dt,
.aboutWrap05 h3,
.aboutWrap08 dt,
.aboutWrap08 .bbb,
.child-led-intro h2,
.child-led-story h3,
.child-led-safety h3,
.child-led-season-text {
    word-break: keep-all;
    overflow-wrap: anywhere;
}

.aboutWrap08 .ccc {
    white-space: nowrap;
}

/* 園の概要の数字は同じ幅で並べる。1桁の時・人数の前には数字1つ分の空白（U+2007）を入れてあり、
   「15名」と「115名」の「名」、「8:00」と「14:30」の「:」がそろう */
.aboutWrap08 dd {
    font-variant-numeric: tabular-nums;
}

/* 見出しのかたまりは中央に置き、折り返した行どうしは左端をそろえる。
   箱の幅を「いちばん長い行」に合わせるため、スマホでは折り返す位置に <br class="s"> を入れてある。
   保育方針（.t01）は下に区切り線があるので、線の長さは変えず、中の文字（.child-led-fit）だけをこの形にする */
.child-led-fit {
    display: block;
}

.child-led-philosophy-heading,
.child-led-fit,
.child-led-intro h2,
.child-led-intro p,
.child-led-story p,
.child-led-cta p {
    width: fit-content;
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
    text-align: left;
}

@media only screen and (max-width: 768px) {
    .aboutWrap02 .t01 {
        font-size: 2.1rem;
    }

    .aboutWrap08 dt {
        letter-spacing: 0;
    }

    /* 季節の文は「春」「夏」の字の横だと列が狭く、言葉の途中で切れるので、スマホでは字の下に回す */
    .lifeEventWrap ._in .flexWrap .rightBox .inRight .ul .li .inFlexWrap .inLeftBox .ininFlexWrap .ininRightBox {
        flex-basis: 100%;
        padding: 2rem 0 0;
    }

    .child-led-season-text {
        font-size: 2.2rem;
    }

    .child-led-event-note {
        font-size: 1.9rem;
    }

    .child-led-philosophy-heading {
        font-size: 3.2rem;
    }

    .child-led-intro {
        margin: 0 6vw 7rem;
        padding: 5rem 4rem;
        border-radius: 0 5rem 0 5rem;
    }

    .child-led-intro h2 {
        font-size: 3.4rem;
        line-height: 1.5;
    }

    .child-led-intro p,
    .child-led-safety p,
    .child-led-story p,
    .child-led-cta p {
        font-size: 2rem;
        line-height: 2;
    }

    .child-led-note {
        font-size: 1.8rem;
    }

    .child-led-safety,
    .child-led-story,
    .child-led-cta {
        margin-right: 6vw;
        margin-left: 6vw;
    }

    .child-led-safety,
    .child-led-story {
        padding: 4rem;
    }

    .child-led-safety h3,
    .child-led-story h3 {
        font-size: 3rem;
        line-height: 1.5;
    }

    .child-led-life-intro {
        padding: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .child-led-intro,
    .child-led-safety,
    .child-led-story,
    .child-led-cta {
        animation: none !important;
        transition: none !important;
    }
}
