@charset "utf-8";

.wrapper {
    width: 90%;
    min-height: 4.5rem;
    margin: 0 auto;
    position: relative;
}

main {
    width: 100%;
    margin: 0 auto;
}

.container {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
}

h1 {
    font-size: 1.375rem;
    font-weight: var(--font-medium);
    margin: 0 0 1rem;
}

h2 {
    font-size: 2rem;
    font-weight: var(--font-medium);
    margin: 3.5rem 0;
}

p {
    font-size: 1rem;
    margin-bottom: 1rem;
}

span {
    color: var(--text-small);
    font-size: 0.875rem;
}

table {
    width: 100%;
}

ol {
    list-style-position: inside;
}

.breadcrumb_inner {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

.breadcrumb_inner>a {
    width: 1rem;
    height: 1rem;
}

/* hero */
.hero {
    position: relative;
    width: 100%;
    height: 250px;
    background-repeat: no-repeat;
    background-position: right;
    background-size: auto 250px;
    overflow: hidden;
    display: flex;
    align-items: center;
    margin: 0 0 3rem;
}

.hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to right,
            var(--background) 0%,
            var(--background) 25%,
            transparent 100%);
    z-index: 1;
    pointer-events: none;
}

.hero>div {
    position: relative;
    z-index: 2;
    padding: 1rem 0;
}

.hero>div>p.heading {
    font-size: 1.25rem;
    color: var(--sub-color);
}

/* top-index */
.top-index .hero {
    height: 301px;
    background-size: auto 301px;
    background-image: url('../img/mainvisual_sp.webp');
}

.top-index .hero .heading {
    font-family: "Zen Kurenaido", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 0.875rem;
    display: inline-block;
    transform: rotate(-6deg) translateY(1rem);
    margin-top: 2rem;
}

.top-index .hero .button {
    display: block;
    width: 12rem;
    font-size: 0.875rem;
    color: var(--secondary-color);
    background-color: var(--main-color);
    border-radius: 999px;
    text-decoration: none;
    text-align: center;
    padding: 0.5rem 1rem;
    border: 2px solid var(--main-color);
    margin-bottom: 1rem;
    position: relative;
}

.top-index .hero .button:hover {
    color: var(--main-color);
    background-color: var(--secondary-color);
}

.top-index .about h3.heading_logo {
    font-size: 1.25rem;
    background-image: url('../img/top-index_logo.webp');
    background-repeat: no-repeat;
    background-size: contain;
    width: fit-content;
    margin: 0 auto;
    padding-left: 2.5rem;
}

.top-index .container {
    width: 90%;
    margin: 0 auto 1.25rem;
}

.top-index .aboutus {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 1fr;
    width: 90%;
    margin: 0 auto 2rem;
    padding: 0;
    overflow: hidden;
    background: var(--secondary-color);
    border-radius: 2rem;
}

.top-index .aboutus>div {
    --icon-text-gap: 20px;

    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    min-width: 0;
    padding: 0.75rem;
    text-align: center;
}

.top-index .aboutus>div img {
    display: block;
    width: 116px;
    height: 100px;
    margin: 12px auto var(--icon-text-gap);
    object-fit: contain;
    flex-shrink: 0;
}

.top-index .aboutus>div p {
    margin: 0;
    line-height: 1.75;
}

/* SP：ママさん学生だけ間隔を広くする */
.top-index .aboutus>div:nth-child(2) {
    --icon-text-gap: 31px;
}

/* SPの縦罫線 */
.top-index .aboutus>div:nth-child(odd) {
    border-right: 1px solid var(--background);
}

/* SPの横罫線 */
.top-index .aboutus>div:nth-child(-n + 2) {
    border-bottom: 1px solid var(--background);
}

.top-index .support h3::before {
    content: "";
    position: absolute;
    width: 80px;
    height: 80px;
    background: url("../img/icon_support.webp") no-repeat center;
    background-size: contain;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.top-index .support h3 {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 60px;
    margin: 0 auto 1rem;
    width: fit-content;
    padding-inline: 4rem;
}

.top-index .support h3::before {
    content: "";
    position: absolute;
    width: 38px;
    height: 60px;
    background: url("../img/icon_support.webp") no-repeat center;
    background-size: contain;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.top-index .support h3::after {
    content: "";
    position: absolute;
    width: 38px;
    height: 60px;
    background: url("../img/icon_support.webp") no-repeat center;
    background-size: contain;
    right: 0;
    top: 50%;
    transform: translateY(-50%) scaleX(-1);
}

/* サポートカード（01〜04の互い違いレイアウト） */
.top-index .support .support-cards {
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 3rem;
    margin-top: 2rem;
}

.top-index .support .support-card {
    --card-color: var(--main-color);
    --card-radius: 24px;
    display: flex;
    flex-direction: column;
}

.top-index .support .support-card.alignment {
    --card-color: var(--orange);
}

.top-index .support .support-card.tuition {
    --card-color: var(--circle-pink);
}

.top-index .support .support-card.age {
    --card-color: var(--blue);
}

.top-index .support .support-card__num {
    display: block;
    font-family: "Helvetica Neue", Arial, sans-serif;
    font-size: 2.25rem;
    line-height: 1;
    letter-spacing: 0.04em;
    color: var(--card-color);
    opacity: 0.7;
    margin-bottom: 1rem;
}

.top-index .support .support-card__img {
    margin-left: 1rem;
    border-radius: var(--card-radius);
    overflow: hidden;
    aspect-ratio: 587 / 415;
}

.top-index .support .support-card__img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.top-index .support .support-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    margin-left: 1rem;
}

/* 見出しを画像の左下に食い込ませて切り欠きを作る */
.top-index .support .support-card__body h4 {
    position: relative;
    width: 88%;
    margin-top: -2.5rem;
    padding: 1.25rem 1rem 0 0.75rem;
    background-color: var(--background);
    border-top-right-radius: var(--card-radius);
    color: var(--card-color);
    font-size: 1.375rem;
    font-weight: var(--font-bold);
    line-height: 1.6;
    letter-spacing: 0.1em;
}

.top-index .support .support-card__body p {
    padding: 1.25rem 0.75rem 0;
    font-size: 0.9375rem;
    line-height: 2.2;
    letter-spacing: 0.05em;
}

.top-index .support .support-card__body .button {
    display: block;
    width: 12rem;
    margin: 1.5rem 0 0 0.75rem;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    text-align: center;
    text-decoration: none;
    color: var(--card-color);
    background-color: var(--secondary-color);
    border: 2px solid var(--card-color);
    border-radius: 999px;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.02);
}

.top-index .support .support-card__body .button:hover {
    color: var(--secondary-color);
    background-color: var(--card-color);
}

.top-index .movie {
    margin-top: 3rem;
}

.top-index .movie h3 {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.25rem;
    font-weight: var(--font-bold);
}

.top-index .movie h3::before {
    content: "";
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 34px;
    height: 29px;
    background-image: url('../img/icon_movie.webp');
    background-repeat: no-repeat;
}

.top-index .movie iframe {
    width: 100%;
    aspect-ratio: 16/9;
    margin: 0 auto;
}

.top-index .movie a {
    display: block;
    text-align: right;
    text-decoration: none;
    color: var(--body-text);
}

/* SPでは上部のリンクを非表示 */
.top-index .movie .container_pc {
    display: none;
}

/* SP：動画の右下 */
.top-index .movie .container_sp {
    width: 90%;
    margin: 0 auto;
    padding: 0 1rem 1.75rem;
}

.top-index .message h3 {
    font-size: 1.25rem;
    background-image: url('../img/top-index_logo.webp');
    background-repeat: no-repeat;
    background-size: 2.5rem;
    width: fit-content;
    margin: 0 auto 1rem;
    padding-left: 2.5rem;
}

.top-index .message .container div {
    text-align: center;
    margin-bottom: 3rem;
}

.top-index .news .container.bg,
.top-index .sunday .container.bg {
    width: 90%;
    background-color: var(--secondary-color);
    border-radius: 1.5rem 1.5rem 0 0;
    padding: 1rem;
    margin-bottom: 0;
}

.top-index .news .title,
.top-index .sunday .title,
.top-index .weekday .title {
    width: 100%;
    border-bottom: 2px solid var(--background);
    display: flex;
    align-items: baseline;
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
}

.top-index .news .title h3,
.top-index .sunday .title h3,
.top-index .weekday .title h3 {
    font-size: 1.25rem;
    font-weight: var(--font-medium);
}

.top-index .news .title h3::before,
.top-index .sunday .title h3::before,
.top-index .weekday .title h3::before {
    content: "●";
    color: var(--secondary-color-gray);
}

.top-index .news .title a {
    margin-left: auto;
    text-decoration: none;
    color: var(--body-text);
}

.top-index .news .title a::after {
    content: ">";
    margin-left: 0.5rem;
    color: var(--main-color);
    font-size: 1.5rem;
}

.top-index .news ul.news,
.top-index .sunday ul.date-list,
.top-index .weekday ul.date-list {
    padding: 0;
    margin: 0;
    list-style: none;
}

.top-index .news ul.news li a {
    display: grid;
    grid-template-columns: 7.5rem 1fr;
    column-gap: 1rem;
    row-gap: 0.5rem;

    margin-bottom: 1.5rem;
}

.top-index .news ul.news li p.date {
    font-weight: var(--font-bold);
    color: var(--text-small);
}

.top-index .sunday ul.date-list li p.date,
.top-index .weekday ul.date-list li p.date {
    font-weight: var(--font-bold);
    color: var(--main-color);
}

.top-index .news ul.news li p.notice {
    width: 7rem;
    text-align: center;
    padding: 0.25rem 1rem;
    border-radius: 999px;
    font-weight: var(--font-bold);
}

.top-index .news ul.news li p.news_title,
.top-index .sunday ul.date-list li p.event_title,
.top-index .weekday ul.date-list li p.event_title {
    grid-column: 1 / -1;
    font-weight: var(--font-bold);
    color: var(--text-card);
}

.top-index .news ul.news .notice {
    color: var(--blue);
    background: var(--blue-light);
}

.top-index .news ul.news li p {
    margin: 0;
}

.top-index .blog .container.bg,
.top-index .weekday .container.bg {
    width: 90%;
    background-color: var(--secondary-color);
    border-radius: 0 0 1.5rem 1.5rem;
    padding: 1rem;
}

.top-index .blog .title {
    width: 100%;
    border-bottom: 2px solid var(--background);
    display: flex;
    align-items: baseline;
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
}

.top-index .blog .title h3 {
    font-size: 1.25rem;
    font-weight: var(--font-medium);
}

.top-index .blog .title h3::before {
    content: "●";
    color: var(--secondary-color-gray);
}

.top-index .blog .title a {
    margin-left: auto;
    text-decoration: none;
    color: var(--body-text);
}

.top-index .blog .title a::after {
    content: ">";
    margin-left: 0.5rem;
    color: var(--main-color);
    font-size: 1.5rem;
}

.top-index .blog img {
    margin-bottom: 1rem;
    width: 100%;
}

.top-index .blog .date {
    color: var(--text-small);
    font-weight: var(--font-bold);
}

.top-index .blog .blog_title {
    color: var(--text-card);
    font-weight: var(--font-bold);
}

.top-index .blog li {
    margin-bottom: 2rem;
}

.top-index .blog li:last-child {
    margin-bottom: 0;
}

/* breadcrumb */
.breadcrumb {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto 1rem;
}

.attachment-thumbnail {
    display: inline;
}

/* inquiry */
.inquiry {
    display: grid;
    gap: 1rem;
}

.inquiry .container {
    padding: 18px 20px;
    border-radius: 46px;
    background-color: var(--background_card);
    box-shadow: 0 0 23px 0 rgba(0, 0, 0, 0.02);
    width: 100%;
}

.inquiry>.container>a {
    margin-bottom: 1rem;
}

.inquiry .contact {
    display: block;
    background-color: var(--secondary-color);
    border: 1px solid var(--main-color);
    border-radius: 1rem;
    padding: 1rem 0.5rem;
    text-align: center;
    color: var(--main-color);
    font-size: 1.375rem;
    font-weight: var(--font-bold);
    text-decoration: none;
}

.inquiry .contact::after {
    content: "→";
    margin-left: 1rem;
}

.inquiry .arrow {
    position: relative;
    width: 36px;
    height: 36px;
    border: 2px solid currentColor;
    border-radius: 50%;
    background-color: var(--secondary-color);
}

.inquiry .arrow::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 45%;
    width: 8px;
    height: 8px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: translate(-50%, -50%) rotate(45deg);
}

.inquiry .material,
.inquiry .line,
.inquiry .trial {
    display: grid;
    grid-template-columns: 64px 1fr 36px;
    align-items: center;
    column-gap: 1rem;
    border-radius: 1rem;
    padding: 1rem 0.5rem;
    margin-bottom: 1rem;
    font-size: 1.375rem;
    font-weight: var(--font-bold);
    text-decoration: none;
    color: var(--body-text);
}

.inquiry .material {
    background-color: var(--card-blue);
}

.inquiry .line {
    background-color: var(--card-green);
}

.inquiry .trial {
    background-color: var(--card-pink);
}

.inquiry .material>div:first-child,
.inquiry .line>div:first-child,
.inquiry .trial>div:first-child {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    background-color: var(--secondary-color);
    border-radius: 50%;
    flex-shrink: 0;
}

.inquiry .material .heading {
    color: var(--main-color)
}

.inquiry .line .heading {
    color: var(--circle-green)
}

.inquiry .trial .heading {
    color: var(--circle-pink)
}

.inquiry .material>.arrow {
    border: 2px solid var(--main-color);
}

.inquiry .material>.arrow::before {
    border-top: 2px solid var(--main-color);
    border-right: 2px solid var(--main-color);
}

.inquiry .line>.arrow {
    border: 2px solid var(--circle-green);
}

.inquiry .line>.arrow::before {
    border-top: 2px solid var(--circle-green);
    border-right: 2px solid var(--circle-green);
}

.inquiry .trial>.arrow {
    border: 2px solid var(--circle-pink);
}

.inquiry .trial>.arrow::before {
    border-top: 2px solid var(--circle-pink);
    border-right: 2px solid var(--circle-pink);
}

/* employment */
.employment .hero {
    background-image: url('../img/subpage_fv_employment.webp');
}

.employment h2 {
    font-size: 2rem;
    margin: 0 0 1rem;
    border-bottom: 1px solid var(--background);
}

.employment .record {
    background-color: var(--secondary-color);
    padding: 2rem 0;
    margin-bottom: 3rem;
}

.employment .record div ul li {
    margin-bottom: 1rem;
}

.employment .graduate {
    background-color: var(--secondary-color-ash);
    padding: 2rem 0;
    margin-bottom: 3rem;
}

.employment .graduate h3 {
    font-size: 1rem;
    font-weight: var(--font-medium);
    color: var(--body-text);
    margin: 1rem 0;
    padding: 0;
    border-radius: 0;
    background: none;
}

.employment .student {
    background-color: var(--sub-color-light);
    padding: 2rem 0 1rem;
}

.employment .student div {
    margin-bottom: 2rem;
}

.employment .student hr {
    margin-bottom: 2rem;
}

.employment .student hr:last-child {
    display: none;
}

.employment .student div:last-of-type {
    margin-bottom: 0;
}

.employment .student h3 {
    font-size: 1rem;
    font-weight: var(--font-medium);
    color: var(--sub-color);
    margin: 1rem 0;
    padding: 0;
    border-radius: 0;
    background: none;
}

.employment .student :is(h4, summary) {
    font-size: 0.875rem;
    font-weight: var(--font-medium);
    border-left: 2px solid var(--sub-color);
    margin-bottom: 1rem;
    padding-left: 1rem;
}

.employment .student .blog {
    border-top: 1px solid var(--main-color);
    border-bottom: 1px solid var(--main-color);
    margin-bottom: 1rem;
}

.employment .student .blog h5 a {
    background-color: var(--secondary-color);
    color: var(--sub-color);
    text-align: center;
    font-size: 1.125rem;
    width: 280px;
    margin: 0 auto;
    padding-block: 0.75rem;
    display: block;
    border-radius: 999px;
}

.employment .student .blog p {
    font-size: 0.75rem;
    color: var(--sub-color);
    font-weight: var(--font-bold);
}

.employment .work {
    background-color: var(--secondary-color);
    padding: 2rem 0;
    margin-bottom: 3rem;
}

.employment .work div .column {
    column-count: 3;
}

/* 就職先の種類と説明 */
.employment .work .work-types {
    margin: 1.5rem 0 2.5rem;
}

.employment .work .work-types__item {
    margin-bottom: 1.5rem;
}

.employment .work .work-types dt {
    font-size: 1.125rem;
    font-weight: var(--font-bold);
    color: var(--sub-color);
    margin-bottom: 0.25rem;
}

.employment .work .work-types dd {
    margin: 0;
    line-height: 1.7;
}

.employment .work div .column li {
    margin-bottom: 1rem;
    break-inside: avoid;
}

/* open-campus */
.open-campus .hero {
    background-image: url('../img/subpage_fv_open-campus.webp');
}

.open-campus .introduction h2 {
    color: var(--sub-color);
    font-size: 1rem;
    font-weight: var(--font-regular);
    margin-bottom: 2rem;
}

.open-campus .meeting {
    background-color: var(--secondary-color);
    padding: 1rem 0 8rem;
}

.open-campus .meeting>div {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
}

.open-campus .meeting h2 {
    font-size: 1.25rem;
    font-weight: var(--font-regular);
    margin: 0 0 1rem;
    border-bottom: 1px solid var(--background);
    text-align: center;
}

.open-campus .meeting h3 {
    font-size: 1.5rem;
    font-weight: var(--font-regular);
    margin: 0 0 1rem;
    background: none;
    color: var(--body-text);
}

.open-campus .meeting strong {
    font-size: 1.25rem;
    font-weight: var(--font-regular);
}

.open-campus .meeting ul {
    margin-bottom: 1rem;
}

.open-campus .meeting table {
    margin-bottom: 4rem;
}

.open-campus .meeting thead {
    background-color: var(--sub-color);
    color: var(--secondary-color);
}

.open-campus .meeting th,
.open-campus .meeting td {
    padding: 1rem 0.5rem;

    &:nth-child(2) {
        width: 5.7rem;

        @media (width > 1023px) {
            text-align: center;
            width: inherit;
        }
    }
}

.open-campus .meeting td:first-child {
    text-align: center;
    white-space: nowrap;
}

.open-campus .meeting td p {
    margin: 0;
}

.open-campus .meeting small {
    font-size: 0.75rem;
}

.open-campus .meeting .form {
    display: block;
    text-align: center;
    color: var(--sub-color);
    font-weight: var(--font-medium);
    font-size: 1.25rem;
    margin: 0 auto 4rem;
    border-radius: 999px;
    background-color: var(--sub-color-light);
    padding: 1rem 3.5rem;
    width: fit-content;
}

.open-campus .meeting .form.no-margin {
    margin: 0 auto 1rem;
}

.open-campus .meeting .form.last {
    margin-bottom: 0;
}

.open-campus {
    .js-date-cell {
        .date-year {
            display: block;
            color: var(--body-text);
            font-size: 1rem;

            @media (width > 1023px) {
                display: inline;
                font-size: 1rem;
            }
        }

        a {
            .date-year {
                color: var(--text-small);
            }
        }

        .date-rest {
            font-size: 1rem;
        }
    }
}

.open-campus .voices h2 {
    font-size: 1.75rem;
    font-weight: var(--font-bold);
    text-align: center;
    border-radius: 0.75rem;
    background-color: var(--main-color-light);
    color: var(--sub-color);
    padding: 0.5rem 1rem;
    margin: 1.5rem 0 2.5rem;
}

.open-campus {
    .voices {
        .container {
            .inner-wrapper {
                padding: 0 0 2rem;
                display: grid;
                grid-template-columns: repeat(auto-fill,
                        minmax(min(100%, 350px), 1fr));
                gap: 1rem;

                .voice {
                    padding: 1rem 0.5rem 0.5rem;
                    background-color: var(--main-color-light4);
                    border-radius: 0.5rem;

                    h3 {
                        margin-bottom: 0.5rem;
                        font-size: 1.15rem;
                    }

                    .text-right {
                        text-align: right;
                    }
                }
            }
        }
    }
}

.open-campus .person {
    margin: 0;
    text-align: right;
}

/* recruiters */
.recruiters .hero {
    background-image: url('../img/subpage_fv_recruiters.webp');
}

.recruiters .to-manager,
.recruiters .posting {
    background-color: var(--secondary-color);
    padding: 1rem 0 4rem;
    margin-bottom: 4rem;
    margin-inline: auto;
    max-width: 1200px;
}

.recruiters .to-manager>div,
.recruiters .posting>div {
    width: 90%;
    margin: 0 auto;
}

.recruiters .to-manager h2 {
    font-size: 1.25rem;
    font-weight: var(--font-regular);
    margin: 0 0 1rem;
    border-bottom: 1px solid var(--background);
    text-align: center;
}

.recruiters .to-manager p {
    margin-bottom: 1rem;
}

.recruiters .posting h3 {
    background: none;
    font-size: 1.375rem;
    color: var(--body-text);
}

.recruiters .posting address {
    font-style: normal;
}

.recruiters .posting .form {
    display: block;
    text-align: center;
    text-decoration: none;
    color: var(--sub-color);
    font-weight: var(--font-medium);
    font-size: 1.25rem;
    margin-bottom: 4rem;
    border-radius: 999px;
    background-color: var(--sub-color-light);
    padding: 1rem 0.5rem;
    width: 100%;
    max-width: 327px;
}

.recruiters .posting>div>div {
    margin-bottom: 1rem;
}

.recruiters .posting a {
    color: var(--sub-color);
}

/* benefit */
.benefit .hero {
    background-image: url('../img/subpage_fv_benefit.webp');
}

.benefit .system>div {
    width: 90%;
    margin: 0 auto;
}

.benefit .system h2 {
    font-size: 1.5rem;
    font-weight: var(--font-medium);
    color: var(--secondary-color);
    background-color: var(--main-color);
    padding: 1rem 1.5rem;
    border-radius: 1rem;
    margin: 0 0 2rem;
}

.benefit .system h3 {
    font-size: 1.5rem;
    font-weight: var(--font-regular);
    color: var(--sub-color);
    border-bottom: 1px solid var(--sub-color);
    margin-bottom: 3rem;
}

.benefit .system dl {
    display: grid;
    border: 1px solid var(--border-color);
    background: var(--secondary-color);
    margin-bottom: 4rem;
}

.benefit .system dt,
.benefit .system dd {
    margin: 0;
    padding: 1rem;
    border: 1px solid var(--border-color);
}

.benefit .system dt {
    background: var(--background);
    color: var(--sub-color);
    font-size: 1rem;
    font-weight: var(--font-medium);
    text-align: center;
    border: 1px solid var(--border-color);
}

.benefit .system dd {
    background: var(--secondary-color);
    overflow-wrap: anywhere;
}

.benefit .system dt:last-of-type,
.benefit .system dd:last-child {
    border-bottom: none;
}

.benefit .system dl a {
    color: var(--sub-color);
    text-decoration: underline;
}

/* contact */
.contact .hero {
    background-image: url('../img/subpage_fv_contact.webp');
}

.contact .system>div {
    width: 90%;
    margin: 0 auto;
}

.contact .contact-body h2 {
    font-size: 1.5rem;
    font-weight: var(--font-regular);
    color: var(--secondary-color);
    background-color: var(--main-color);
    padding: 1rem 1.5rem;
    border-radius: 1rem;
    margin: 0 0 2rem;
}

.contact {
    .contact-body {
        .tel {
            a {
                font-size: 2rem;
            }
        }
    }
}

.contact .label {
    font-size: 1.25rem;
    font-weight: var(--font-regular);
    color: var(--secondary-color);
    background-color: var(--main-color);
    padding: 1rem 0.5rem;
    border-radius: 1rem;
    margin: 0 0 1rem;
    width: fit-content;
}

.contact .input {
    margin-bottom: 1.5rem;
}

.form .wpcf7-form .input input,
.form .wpcf7-form .input select,
.form .wpcf7-form .input textarea {
    width: 100%;
    height: 4.5rem;
    padding: 1rem;
    border-radius: 1rem;
    border: none;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}

.form .wpcf7-form .input input[type="checkbox"],
.form .wpcf7-form .input input[type="radio"] {
    box-shadow: none;
    width: 3rem;
    height: 3rem;
}

.form {
    .label {
        span {
            color: red;
        }
    }

    .wpcf7-form {
        .input {
            .wpcf7-radio {
                display: flex;
                flex-direction: column;

                .wpcf7-list-item {
                    label {
                        display: flex;
                        align-items: center;
                    }
                }
            }
        }

        .consultation-preferred {
            display: grid;
            grid-template-columns: auto auto auto auto;
            align-items: start;

            span:first-child {
                input {
                    width: unset;
                }
            }

            span:not(:first-child) {
                input {
                    width: 4rem;
                }
            }

            .hour {
                margin-top: 1.5rem;
            }
        }

        .wpcf7-response-output:empty {
            display: none;
        }
    }
}

.wpcf7-submit,
.return-btn {
    background-color: var(--secondary-color-pink);
    color: var(--secondary-color);
    font-size: 1.5rem;
    border: none;
    border-radius: 1rem;
    height: 4.5rem;
    padding-inline: 3rem;
    margin: 0 auto 3.5rem;
}

/* confirm */
.confirm {
    .form {
        .wpcf7-form {
            .input {
                color: var(--text-small);
                font-size: 1rem;

            }

            .label-text {
                margin-bottom: 0;
            }
        }

        .btn-area {
            display: flex;
            justify-content: center;
            gap: 1rem;

            div {
                width: 9rem;

                .return-btn {
                    box-sizing: border-box;
                    background-color: inherit;
                    border: 2px solid var(--main-color);
                    color: var(--main-color);
                }
            }
        }
    }
}

/* 募集要項：表の定員表記を8割の大きさに */
.capacity {
    font-size: 0.8em;
}

/* learn */
.learn .hero {
    background-image: url('../img/subpage_fv_learn.webp');
}

.learn h2,
main.page .entry-content .heading {
    font-size: 1.5rem;
    font-weight: var(--font-regular);
    color: var(--secondary-color);
    background-color: var(--main-color);
    padding: 1rem 1.5rem;
    border-radius: 1rem;
    margin: 0 0 2rem;
}

.learn h3 {
    font-size: 1.5rem;
    line-height: 1.7;
    font-weight: var(--font-regular);
    color: var(--sub-color);
    margin: 1rem 0 3rem;
    padding: 0;
    border-radius: 0;
    background: none;
}

.learn>section>.container>section>p,
.learn>section>.container>section>div>p:last-child,
.learn>section>.container>section>ul {
    margin-bottom: 3rem;
}

.learn {
    #timetable {
        .container {
            .timetable {
                p:first-of-type {
                    margin-bottom: 1rem;
                }

            }
        }
    }
}

.learn table {
    margin-bottom: 3rem;
}

.learn table th {
    background-color: var(--main-color);
    color: var(--secondary-color);
    font-weight: var(--font-regular);
    text-align: left;
    padding: 1rem 0.5rem;
}

.learn table td {
    background-color: var(--sub-color-light);
    color: var(--sub-color-dark);
    text-align: center;
    padding: 1rem 0.5rem;
}

.learn table th,
.learn table td {
    border: 1px solid var(--secondary-color);
}

/* 時間割：1週間スケジュール例 */
.learn .schedule {
    margin-bottom: 3rem;
}

.learn .schedule__lead {
    margin-bottom: .5rem;
}

.learn .schedule__title {
    font-weight: var(--font-bold);
    margin-bottom: 1rem;
}

.learn .schedule__table {
    width: 100%;
    table-layout: fixed;
    margin-bottom: 0;
}

.learn .schedule__table thead th {
    text-align: center;
    padding: .75rem .25rem;
}

.learn .schedule__table tbody th {
    background-color: var(--secondary-color);
    color: inherit;
    font-weight: var(--font-regular);
    text-align: center;
    padding: .75rem .25rem;
    border: 1px solid var(--border-color);
}

.learn .schedule__table td {
    vertical-align: middle;
    line-height: 1.6;
    padding: .5rem .25rem;
}

.learn .schedule__table .is-school {
    background-color: #fce4d6;
    color: inherit;
}

.learn .schedule__table .is-online {
    background-color: #ddebf7;
    color: inherit;
}

.learn .schedule__table .is-off {
    background-color: #fff2cc;
    color: inherit;
}

.learn .schedule__note {
    font-size: .875rem;
    margin: .5rem 0 0;
}

/* 時間割の下の補足 */
.learn .schedule:has(+ .schedule-notes) {
    margin-bottom: 1rem;
}

.learn .schedule-notes {
    list-style: none;
    margin: 0 0 3rem;
    padding: 0;
}

.learn .schedule-notes__item {
    padding-left: 1.25em;
    text-indent: -1.25em;
    line-height: 1.8;
}

.learn .schedule-notes__item.is-circle::before {
    content: "〇";
    display: inline-block;
    width: 1.25em;
    text-indent: 0;
}

.learn .schedule-notes__item.is-dot::before {
    content: "・";
    display: inline-block;
    width: 1.25em;
    text-indent: 0;
}

@media (max-width: 1023px) {
    .learn .schedule__table {
        font-size: .75rem;
    }

    /* 時間の列だけ少し広く */
    .learn .schedule__table thead th:first-child {
        width: 22%;
    }
}

.learn h4 {
    font-weight: var(--font-regular);
}

.learn h4::before {
    content: "●";
    color: var(--main-color);
    margin-right: 1rem;
}

.learn #staff-intro h4 {
    margin-bottom: 1rem;
}

/* 授業の紹介：授業タイトル */
.learn .lesson-intro h4 {
    font-size: 1.4em;
}

/* 授業タイトルの前の丸は付けない */
.learn .lesson-intro h4::before {
    content: none;
}

/* 教員紹介：カード一覧（SP 1カラム → TB 2カラム → PC 3カラム） */
.learn #staff-intro .staff-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

@media (min-width: 600px) {
    .learn #staff-intro .staff-list {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .learn #staff-intro .staff-list {
        grid-template-columns: repeat(3, 1fr);
    }
}

.learn #staff-intro .staff-card {
    overflow: hidden;
    border: 1px solid var(--secondary-color-gray);
    border-radius: 1rem;
    background: #fff;
}

/* アイキャッチ画像（ない場合は背景色だけを表示） */
.learn #staff-intro .staff-card__image {
    aspect-ratio: 4 / 3;
    /* --sub-color-light を透過0.5で使う */
    background-color: color-mix(in srgb, var(--sub-color-light) 50%, transparent);
}

.learn #staff-intro .staff-card__image img {
    width: 100%;
    height: 100%;
    /* 画像全体が枠に収まるように表示し、上下左右の中央に配置（余白は背景色） */
    object-fit: contain;
    object-position: center;
}

/* 幅100%になる画像（枠と同じか横長）は枠いっぱいに表示 */
.learn #staff-intro .staff-card__image img.is-cover {
    object-fit: cover;
}

.learn #staff-intro .staff-card__body {
    padding: 1.5rem;
}

/* 先生の名前 */
.learn #staff-intro .staff-card__body h4 {
    font-size: 1.6em;
    color: var(--sub-color);
}

.learn .course>li:first-child {
    margin-bottom: 2rem;
}

.learn .voices {
    margin-bottom: 3rem;
}

.learn .voices hr {
    margin: 3.25rem 0;
}

/*.learn .voices > div > div {
    display: flex;
}*/
.learn .voices .image {
    width: 300px;
    flex-shrink: 0;
    height: auto;
    margin-inline: auto;
    margin-bottom: 1rem;
}

.learn .voices .image img {
    width: 100%;
    height: auto;
}

.learn .voices>div:last-child {
    margin-bottom: 6rem;
}

.learn .chairman {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 2rem;
    margin-bottom: 3rem;
}

.learn .chairman h2 {
    grid-column: 1 / -1;
}

.learn .chairman .image {
    grid-column: 1;
}

.learn .chairman>div:not(.image) {
    grid-column: 2;
}

.learn .chairman figcaption {
    text-align: center;
}

.learn #childcare-training ul>li>ul {
    list-style-type: disc;
    list-style-position: inside;
}

/* 保育実習：番号付きカード */
.learn .training-steps {
    list-style: none;
    margin: 2.5rem 0 3rem;
    padding: 0 0 0 2rem;
    counter-reset: step;
    display: grid;
    gap: 2.5rem;
}

.learn .training-steps__item {
    position: relative;
    counter-increment: step;
    background-color: var(--main-color-light4);
    padding: 1.25rem 1.5rem 1.5rem 3rem;
    margin: 0;
}

.learn .training-steps__item::before {
    content: counter(step);
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(-50%, -50%);
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    background-color: var(--main-color);
    color: var(--secondary-color);
    font-size: 1.125rem;
    display: grid;
    place-items: center;
}

.learn .training-steps__title {
    font-size: 1.25rem;
    font-weight: var(--font-bold);
    color: #2f4a5c;
    margin: 0 0 .5rem;
    padding: 0;
    border: 0;
    background: none;
    text-align: left;
}

.learn .training-steps__period,
.learn .training-steps__text {
    font-size: .9375rem;
}

.learn .training-steps__period {
    margin: 0 0 .75rem;
}

.learn .training-steps__text {
    margin: 0;
}

/* 選択科目：保育ICT */
.learn .elective {
    background-color: var(--main-color-light4);
    padding: 1.5rem;
    margin: 0 0 3rem;
    display: grid;
    gap: 1.5rem;
}

/* 保育ICTブロックの直前の説明文だけ下余白を半分に(3rem → 1.5rem) */
.learn>section>.container>section>p:has(+ .elective) {
    margin-bottom: 1.5rem;
}

.learn .elective__image img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

.learn .elective__title {
    font-size: 1.5rem;
    font-weight: var(--font-bold);
    color: #2f4a5c;
    margin: 0 0 1rem;
    padding: 0;
    border: 0;
    background: none;
    text-align: left;
}

.learn .elective__text {
    margin: 0;
    line-height: 1.6;
}

/* tuition */
.tuition .hero {
    background-image: url('../img/subpage_fv_benefit.webp');
}

.tuition h2 {
    font-size: 1.5rem;
    font-weight: var(--font-regular);
    color: var(--secondary-color);
    background-color: var(--main-color);
    padding: 1rem 1.5rem;
    border-radius: 1rem;
    margin: 0 0 2rem;
}

.tuition th,
.tuition td {
    font-weight: var(--font-regular);
    font-size: 0.625rem;
    border: none;
}

.tuition th {
    background-color: var(--main-color);
    color: var(--secondary-color);
}

.tuition td:first-child {
    text-align: center;
}

.tuition td {
    text-align: right;
}

.tuition th:first-child {
    border-radius: 0.5rem 0 0 0;
}

.tuition th:last-child {
    border-radius: 0 0.5rem 0 0;
}

.tuition tr:nth-child(1) {
    background-color: var(--secondary-color);
}

.tuition tr:nth-child(2) {
    background-color: var(--background);
}

.tuition tr:nth-child(3) {
    background-color: var(--sub-color-light);
}

.tuition .container>section>p:last-child,
.tuition .container>section>ul:last-child {
    margin-bottom: 4rem;
}

.tuition .big-circle li::before {
    content: "●";
    color: var(--main-color);
}

.tuition .small-circle {
    list-style-type: disc;
    list-style-position: inside;
}

.tuition .triangle li::before {
    content: "\25B7";
    color: var(--main-color);
}

.tuition .tel {
    display: block;
    border-radius: 999px;
    background-color: var(--sub-color-light);
    width: fit-content;
    margin: 1.25rem auto;
    padding: 0.5rem 0.75rem;
}

.tuition {
    .container {
        section:last-of-type {
            >a {
                display: block;
                text-align: center;
                color: var(--sub-color);
                font-weight: var(--font-medium);
                font-size: 1.25rem;
                margin: 0 auto 4rem;
                border-radius: 999px;
                background-color: var(--sub-color-light);
                padding: 1rem 3.5rem;
                width: fit-content;
            }
        }
    }
}

/* introduction */
.introduction .hero {
    background-image: url('../img/subpage_fv_introduction.webp');
}

.introduction .container {
    width: 90%;
    margin: 0 auto 1.25rem;
}

.introduction .link {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.introduction .link li {
    width: calc(50% - 0.375rem);
    list-style: none;
}

.introduction .link a {
    display: block;
    width: 100%;
    font-size: 0.875rem;
    color: var(--secondary-color);
    background-color: var(--main-color);
    border-radius: 999px;
    text-decoration: none;
    text-align: center;
    padding: 0.5rem 1rem;
    border: 2px solid var(--main-color);
}

.introduction .link a:hover {
    color: var(--main-color);
    background-color: var(--secondary-color);
}

.introduction .container.bg {
    width: 100%;
    padding: 1rem 5%;
    background-color: var(--secondary-color);
    border-radius: 1rem;
}

.introduction h2.heading {
    font-size: 1.5rem;
    text-align: center;
    margin: 0 0 1rem;
}

.introduction h3.heading {
    text-align: center;
    border-radius: 0.75rem;
    background-color: var(--main-color-light);
    color: var(--sub-color);
    padding: 0.5rem 1rem;
    margin-bottom: 1rem;
}

.introduction #greeting .bg>div>div:last-child p:last-child {
    margin-bottom: 0;
    text-align: right;
    font-size: 0.875rem;
    font-weight: var(--font-regular);
    color: var(--text-card);
}

.introduction #greeting img {
    margin-inline: auto;
    border-radius: 1rem;
    aspect-ratio: 5 / 4;
    object-fit: cover;
    object-position: top;
}

.introduction #philosophy img {
    margin-inline: auto;
    display: block;
}

.class-schedule {
    width: min(100%, 336px);
    margin: 0 auto 3rem;

    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;

    color: #333;
    font-size: 1rem;
    line-height: 1.25;
    text-align: center;
}

/* 上部タイトル */
.class-schedule thead th {
    height: 23px;
    padding: 0 0.5rem;

    color: #fff;
    background-color: #70aaa5;

    border: none;
    border-radius: 0.5rem 0.5rem 0 0;

    font-size: 1rem;
    font-weight: 500;
    line-height: 23px;
}

/* 曜日 */
.class-schedule .week td {
    height: 24px;
    padding: 0;

    background-color: #d7eae8;

    border: none;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #555;

    font-size: 1rem;
    font-weight: 500;
    line-height: 24px;
}

.class-schedule .week td:last-child {
    border-right: none;
}

/* 授業時間 */
.class-schedule tbody tr:not(.week) td:not(.holiday) {
    height: 22px;
    padding: 0;

    background-color: #fff;

    border: none;
    border-left: 1px solid #555;
    border-right: 1px solid #555;
    border-bottom: 1px solid #555;

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

/* 左下の角丸 */
.class-schedule tbody tr:last-child td:not(.holiday) {
    border-radius: 0 0 0 0.5rem;
}

/* 「休み」 */
.class-schedule .holiday {
    padding: 0;

    color: #fff;
    background-color: #70aaa5;

    border: none;
    border-radius: 0 0 0.5rem 0;

    font-size: 1rem;
    font-weight: 700;
    text-align: center;
    vertical-align: middle;
}

.introduction table .week {
    background-color: var(--sub-color-light);
}

.introduction table .holiday {
    background-color: var(--sub-color);
    color: var(--secondary-color);
}

.introduction td {
    text-align: center;
}

.introduction #childcare-cooperation .catch .first {
    font-family: "Zen Kurenaido", sans-serif;
    font-size: 1rem;
    margin-bottom: 10px;
}

.introduction #childcare-cooperation .catch .second {
    font-size: 2rem;
    font-weight: var(--font-medium);
    color: var(--circle-pink);
    margin-bottom: 10px;
}

.introduction #childcare-cooperation .catch .third {
    text-align: right;
    font-size: 0.875rem;
}

.introduction #childcare-cooperation .flex .image img {
    border-radius: 1rem;
}

.introduction .chairman-photo,
.introduction .logo-mark,
.introduction .graph {
    margin: 0 auto;
}

.introduction .caption {
    text-align: center;
    color: var(--sub-color);
}

.introduction .coexistence {
    background-image: url('../img/introduction_coexistance_sp.png');
    background-size: contain;
    background-repeat: no-repeat;
    width: 100%;
    height: auto;
    aspect-ratio: 435/ 156;
    margin-bottom: 1rem;
}

.introduction .coexistence p {
    font-size: 0;
}

.introduction .photo {
    margin-bottom: 1rem;
}

.introduction .benefits {
    width: 100%;
    margin: 0 auto 1rem;
    background-color: var(--main-color-light3);
    border-radius: 1.5rem;
    padding: 1rem 8%;
}

.introduction .benefits h4.heading {
    font-size: 1.25rem;
    font-weight: var(--font-bold);
    color: var(--main-color-light2);
    text-align: center;
}

.introduction .benefits dl dt {
    background-color: var(--secondary-color);
    border-radius: 999px;
    text-align: center;
    width: 12rem;
    margin: 1.25rem auto;
    padding: 0.75rem 1rem;
}

.introduction .benefits dl dd {
    font-size: 0.875rem;
}

.introduction .benefits dl dd.exemption,
.introduction .benefits dl dd.delivery {
    text-align: center;
}

.introduction .benefits dl dd span {
    color: var(--circle-pink);
}

.introduction .voice .photo {
    width: 100%;
}

.introduction .voice .name {
    text-align: right;
}

.introduction .voice .benefits ol {
    list-style: none;
}

.introduction .voice .benefits ol li {
    background-color: var(--secondary-color);
    padding: 0.5rem 1rem;
    border-radius: 999px;
    position: relative;
    margin-bottom: 3rem;
}

.introduction .voice .benefits ol li::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -2.5rem;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 18px solid transparent;
    border-right: 18px solid transparent;
    border-top: 30px solid var(--main-color-light2);
}

.introduction .voice .benefits ol li:last-child {
    margin-bottom: 0;
}

.introduction .voice .benefits ol li:last-child::after {
    display: none;
}

/* introduction > cooperation */
.cooperation>div>p {
    position: relative;
    cursor: pointer;
    padding: 1.5rem 5rem 1.5rem 2rem;
    border: 1px solid var(--secondary-color-gray);
    border-radius: 1rem;
    background: #fff;
}

/* 丸 */
.cooperation>div>p::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 1.125rem;
    width: 40px;
    height: 40px;
    border: 1px solid #ccc;
    border-radius: 50%;
    transform: translateY(-50%);
}

/* ＋の横線・縦線 */
.cooperation>div>p>span::before,
.cooperation>div>p>span::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 1.875rem;
    width: 1rem;
    height: 0.125rem;
    background: currentColor;
    transition: transform .3s ease, opacity .3s ease;
}

/* 横線 */
.cooperation>div>p>span::before {
    transform: translateY(-50%);
}

/* 縦線 */
.cooperation>div>p>span::after {
    transform: translateY(-50%) rotate(90deg);
}

/* 開いたら＋→－ */
.cooperation>div>p:has(+ div.is-open)>span::after,
.cooperation>div>p:has(+ ul.is-open)>span::after {
    opacity: 0;
    transform: translateY(-50%) rotate(90deg) scaleX(0);
}

/* 開閉ボタン（見た目は見出しのまま） */
.cooperation>div>p button {
    padding: 0;
    border: none;
    background: none;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

/* アコーディオン */
.cooperation>div>div,
.cooperation>div>ul {
    max-height: 0;
    overflow: hidden;
    /* 閉じている間は読み上げ・タブ移動の対象外（閉じるアニメーション後に非表示） */
    visibility: hidden;
    transition: max-height 0.3s ease, visibility 0s linear 0.3s;
}

.cooperation>div>div.is-open,
.cooperation>div>ul.is-open {
    visibility: visible;
    transition: max-height 0.3s ease;
}

/* housing */
#housing>div>div>.photo {
    margin-inline: auto;
    width: fit-content;
}

#housing>div>div>.photo>img {
    border-radius: 1rem;
}

#housing>div>div>.photo>img:first-child {
    margin-bottom: 1rem;
}

#housing>div>div>div>h4 {
    font-weight: var(--font-medium);
    font-size: 1.25rem;
    color: var(--sub-color-dark);
    border-bottom: 2px solid var(--sub-color-dark);
    margin-bottom: 10px;
}

/* application-guidelines */
.application-guidelines .hero {
    background-image: url('../img/subpage_fv_application-guidelines.webp');
}

.application-guidelines h2 {
    font-size: 1.25rem;
    font-weight: var(--font-regular);
    color: var(--secondary-color);
    background-color: var(--main-color);
    padding: 1rem 1.5rem;
    border-radius: 1rem;
    margin: 0 0 2rem;
}

.application-guidelines h3 {
    font-size: 1.25rem;
    font-weight: var(--font-regular);
    color: var(--sub-color);
    margin: 0;
}

.application-guidelines h3.heading {
    border-bottom: 1px solid var(--sub-color);
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
}

.application-guidelines .container div.bg {
    background-color: var(--secondary-color);
    padding: 1rem 1.5rem;
    border-radius: 1rem;
    margin: 0 0 2rem;
}

.application-guidelines .container>div>div>div {
    margin-bottom: 1rem;
}

.application-guidelines ol {
    list-style-position: outside;

    li {
        margin-left: 2rem;
    }
}

.application-guidelines {
    .admissions {
        ul {
            list-style: disc;

            li {
                margin-left: 2rem;
            }
        }

        summary {
            margin-bottom: 0.5rem;
        }
    }
}

.application-guidelines .table-scroll {
    overflow-x: auto;
}

.application-guidelines .table-scroll table {
    width: 1200px;
    max-width: 1200px;
    margin: 0 auto;
}

.application-guidelines .table-scroll table th,
.application-guidelines .table-scroll table td {
    text-align: center;
    font-size: 1rem;
    font-weight: var(--font-regular);
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--table-line);
}

.application-guidelines .table-scroll table td:first-child {
    background-color: var(--sub-color-light);
}

.application-guidelines .table-scroll table td {
    background-color: var(--secondary-color);
}

.application-guidelines .table-scroll table thead tr th {
    color: var(--secondary-color);
    background-color: var(--main-color);
    white-space: nowrap;
}

.application-guidelines .table-scroll table tbody tr th {
    background-color: var(--sub-color-light);
    white-space: nowrap;
}

.application-guidelines .red_txt {
    color: var(--circle-pink);
}

.application-guidelines {
    .period {
        table {
            width: max(52.5em, 100%);

            /* table-layout: fixed; */
            tr {
                td {
                    &:first-child {
                        width: 9.5em;
                    }

                    &:nth-child(2) {
                        width: 16em;
                    }

                    &:nth-child(3) {
                        width: 11em;
                    }

                    &:last-child {
                        width: 10em;
                    }
                }
            }
        }
    }
}

.application-guidelines {
    .exam-detail {
        table {
            width: max(44em, 100%);

            /* table-layout: fixed; */
            tr {
                td {
                    &:first-child {
                        width: 5em;
                    }

                    &:nth-child(2) {
                        width: 18em;
                    }

                    &:last-child {
                        width: 16em;
                    }
                }
            }
        }
    }
}

.application-guidelines .bold_txt {
    font-size: 1.125rem;
    font-weight: var(--font-bold);
    color: var(--body-text);
}

.application-guidelines .grid {
    /*display: grid;*/
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

.application-guidelines .link {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.application-guidelines .link li {
    width: calc(50% - 0.375rem);
    list-style: none;
}

.application-guidelines .link a {
    display: block;
    width: 100%;
    font-size: 0.875rem;
    color: var(--secondary-color);
    background-color: var(--main-color);
    border-radius: 999px;
    text-decoration: none;
    text-align: center;
    padding: 0.5rem 1rem;
    border: 2px solid var(--main-color);
}

.application-guidelines .link a:hover {
    color: var(--main-color);
    background-color: var(--secondary-color);
}

/* loan-type */
.loan-type .hero {
    background-image: url('../img/subpage_fv_loan.webp');
}

.loan-type .system>div {
    width: 90%;
    margin: 0 auto;
}

.loan-type .system h2 {
    font-size: 1.5rem;
    font-weight: var(--font-medium);
    color: var(--secondary-color);
    background-color: var(--main-color);
    padding: 1rem 1.5rem;
    border-radius: 1rem;
    margin: 0 0 2rem;
}

.loan-type .system h3 {
    font-size: 1.5rem;
    font-weight: var(--font-regular);
    color: var(--sub-color);
    border-bottom: 1px solid var(--sub-color);
    margin-bottom: 3rem;
}

.loan-type .system dl {
    display: grid;
    border: 1px solid var(--border-color);
    background: var(--secondary-color);
    margin-bottom: 4rem;
}

.loan-type .system dt,
.loan-type .system dd {
    margin: 0;
    padding: 1.5rem;
    border: 1px solid var(--border-color);
}

.loan-type .system dt {
    background: var(--background);
    color: var(--sub-color);
    font-size: 1rem;
    font-weight: var(--font-medium);
    text-align: center;
    border: 1px solid var(--border-color);
}

.loan-type .system dd {
    background: var(--secondary-color);
    overflow-wrap: anywhere;
}

.loan-type .system dt:last-of-type,
.loan-type .system dd:last-child {
    border-bottom: none;
}

.loan-type .system dl a {
    color: var(--sub-color);
    text-decoration: underline;
}

/* graduate */
.graduate .container {
    width: 90%;
    margin: 0 auto;
}

.graduate h1 {
    font-size: 1.5rem;
    font-weight: var(--font-regular);
    color: var(--secondary-color);
    background-color: var(--main-color);
    padding: 1rem 1.5rem;
    border-radius: 1rem;
    margin: 2rem 0;
}

.graduate h2 {
    line-height: 1.7;
    font-weight: var(--font-regular);
    color: var(--sub-color);
    margin: 1rem 0 3rem;
    padding: 0;
    border-radius: 0;
    background: none;
}

.graduate .graduate {
    margin-bottom: 3rem;
}

.graduate>section>.container>p {
    font-size: 1.5rem;
    color: var(--main-color);
}

.graduate section .bg {
    background-color: var(--secondary-color);
    border-radius: 1rem;
    padding: 1rem 2%;
}

.graduate section .bg h2 {
    font-size: 1.5rem;
    color: var(--main-color);
    border-bottom: 1px solid var(--main-color);
    margin: 0 auto 2rem;
}

.graduate section .button {
    display: block;
    width: 100%;
    background-color: var(--secondary-color);
    color: var(--main-color);
    margin: 2rem auto;
    padding: 1rem;
    font-size: 1.75rem;
    text-align: center;
    text-decoration: none;
    border-radius: 1.75rem;
    border: 1px solid var(--main-color);
}

.graduate section .button:hover {
    background-color: var(--main-color);
    color: var(--secondary-color);
}

.graduate section .button::after {
    content: "→";
}

/* privacy-policy */
.privacy-policy h1 {
    font-size: 1.5rem;
    font-weight: var(--font-regular);
    color: var(--secondary-color);
    background-color: var(--main-color);
    padding: 1rem 1.5rem;
    border-radius: 1rem;
    margin: 2rem 0;
}

.privacy-policy h2 {
    font-size: 1.5rem;
    line-height: 1.7;
    font-weight: var(--font-regular);
    color: var(--sub-color);
    margin: 1rem 0;
    padding: 0;
    border-radius: 0;
    background: none;
    border-bottom: 1px solid var(--sub-color);
}

.privacy-policy h2::before {
    content: "●";
}

.privacy-policy .container {
    width: 90%;
    margin: 0 auto;
}

.privacy-policy section>.container>.wp-block-group {
    background-color: var(--secondary-color);
    border-radius: 1rem;
    padding: 1rem 4%;
    margin-bottom: 3rem;
}

.privacy-policy ol {
    margin-bottom: 1rem;
}

.privacy-policy ol ol {
    margin-left: 1rem;
}

.privacy-policy h3 {
    font-size: 1.25rem;
    font-weight: var(--font-regular);
    color: var(--sub-color);
    margin-bottom: 1rem;
}

/* childcare */
.childcare h1 {
    font-size: 1.5rem;
    font-weight: var(--font-regular);
    color: var(--secondary-color);
    background-color: var(--main-color);
    padding: 1rem 1.5rem;
    border-radius: 1rem;
    margin: 2rem 0;
}

.childcare h2 {
    font-size: 1.5rem;
    line-height: 1.7;
    font-weight: var(--font-regular);
    color: var(--sub-color);
    margin: 1rem 0;
    padding: 0;
    border-radius: 0;
    background: none;
    border-bottom: 1px solid var(--sub-color);
}

.childcare section .bg {
    background-color: var(--secondary-color);
    border-radius: 1rem;
    padding: 1rem 2%;
    margin-bottom: 3rem;
}

.childcare>section>.container>p {
    color: var(--main-color);
    font-size: 1.5rem;
}

/* singleparents */
.singleparents .hero {
    background-image: url('../img/subpage_fv_singleparents.webp');
}

.singleparents>section>.container {
    width: 90%;
    margin: 0 auto;
}

.singleparents h2 {
    font-size: 1.5rem;
    font-weight: var(--font-medium);
    color: var(--secondary-color);
    background-color: var(--main-color);
    padding: 1rem 1.5rem;
    border-radius: 1rem;
    margin: 0 0 2rem;
}

.singleparents h3 {
    font-size: 1.5rem;
    line-height: 1.7;
    font-weight: var(--font-regular);
    color: var(--sub-color);
    margin: 1rem 0;
    padding: 0;
    border-radius: 0;
    background: none;
    border-bottom: 1px solid var(--sub-color);
}

.singleparents .container div.bg {
    background-color: var(--secondary-color);
    padding: 1rem 1.5rem;
    border-radius: 1rem;
    margin: 0 0 2rem;
}

.singleparents dl {
    width: 100%;
    margin: 0 auto;
    border: 1px solid var(--table-line);
    background: var(--secondary-color);
}

.singleparents dt,
.singleparents dd {
    margin: 0;
    padding: 0.65rem 1.5rem;
    border-bottom: 1px solid var(--table-line);
}

.singleparents dt {
    background: var(--background);
    color: var(--sub-color);
    text-align: center;
    font-weight: 500;
}

.singleparents dd {
    background: var(--secondary-color);
    line-height: 1.8;
}

.singleparents dd:last-child {
    border-bottom: none;
}

.singleparents .notice {
    font-size: 0.875rem;
    color: var(--text-small);
    margin: 2.5rem 0 3rem;
}

/* faq */
.faq .hero {
    background-image: url('../img/subpage_fv_faq.webp');
}

.faq-tab-btn {
    display: block;
    width: fit-content;
    font-size: 0.875rem;
    color: var(--secondary-color);
    background-color: var(--main-color);
    border-radius: 999px;
    text-decoration: none;
    text-align: center;
    padding: 0.5rem 0.5rem;
    border: 2px solid var(--main-color);
    margin-bottom: 1rem;
    position: relative;
    cursor: pointer;
}

.faq-tab-btn:hover,
.faq-tab-btn.is-active {
    color: var(--main-color);
    background-color: var(--secondary-color);
}

.faq-tabs-wrapper {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
}

.faq-tab-list {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 0;
    margin: 0;
    list-style: none;
}

div.ewd-ufaq-faq-div {
    max-width: 1128px;
    margin: 0 auto 1.5rem !important;
    padding: 1rem !important;
    background-color: var(--secondary-color);
    border: 1px solid var(--secondary-color-gray);
    border-radius: 1rem;
}

div.ewd-ufaq-faq-title-text {
    display: flex;
    align-items: center;
    gap: 1rem;
}

div.ewd-ufaq-faq-body {
    padding: 10px 25px;
    padding-left: 1rem;
}

div.ewd-ufaq-faq-post {
    position: relative;
    padding-left: 3rem;
}

/* 丸囲みの「A」 */
div.ewd-ufaq-faq-post::before {
    content: "A";
    position: absolute;
    top: 0.1em;
    left: 0;

    display: grid;
    place-items: center;

    width: 1.5rem;
    height: 1.5rem;
    background-color: var(--secondary-color);
    color: var(--secondary-color-pink);
    border-radius: 999px;
    border: 1px solid var(--secondary-color-pink);
    font-family: serif;
    font-size: 1rem;
    line-height: 1;
    box-sizing: border-box;
}

/* 本文 */
div.ewd-ufaq-faq-post>p {
    margin: 0;
    line-height: 1.9;
}

/* pが複数ある場合の段落間 */
div.ewd-ufaq-faq-post>p+p {
    margin-top: 1.25rem;
}

div.ewd-ufaq-faq-title div.ewd-ufaq-post-margin-symbol {
    float: right !important;
}

.ewd-ufaq-faq-title-text::before {
    content: "Q";
    background-color: var(--main-color);
    color: var(--secondary-color);
    border-radius: 999px;
    flex: 0 0 1.5rem;
    width: 1.5rem;
    height: 1.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* acceess */
.access .hero {
    background-image: url('../img/subpage_fv_access.webp');
}

.access .bg {
    width: 100%;
    margin: 0 auto 3rem;
    padding: 1rem 0;
    border-radius: 1rem;
    background-color: var(--secondary-color);
}

.access iframe {
    width: 90%;
    height: 186px;
    margin: 0 auto;
    padding: 0;
    border-radius: 1rem;
    display: block;
}

.access h2 {
    align-items: center;
    justify-content: center;
    display: flex;
    background-color: var(--main-color-light);
    margin: 0 auto 3rem;
    padding: 0.5rem 0;
    border-radius: 0.75rem;
    font-size: 1.5rem;
    font-weight: var(--font-bold);
    color: var(--sub-color);
    width: 90%;
}

.access h2::before {
    content: "";
    background-image: url('../img/top-index_logo.webp');
    background-position: center;
    background-repeat: no-repeat;
    width: 56px;
    height: 41px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.access p.link {
    margin: 0.5rem 5%;
}

.access p.address {
    text-align: center;
    font-size: 1rem;
}

.access .photos ol {
    width: 90%;
    margin-inline: auto;
    gap: 1.5rem;
}

.access ol {
    counter-reset: route-number;
    list-style: none;
    margin: 0;
    padding: 0;
}

.access ol {
    counter-reset: route-number;
    list-style: none;
    padding: 2rem 0 1rem;
    margin: 0;

    display: flex;
    gap: 1.5rem;

    overflow-x: auto;
    scroll-snap-type: x mandatory;

}

.access ol li {
    counter-increment: route-number;

    position: relative;

    /* 1画面に1枚 */
    flex: 0 0 80%;

    scroll-snap-align: center;

    text-align: center;
    font-size: 1rem;
    line-height: 1.6;
}

.access ol li::before {
    content: counter(route-number);

    position: absolute;
    top: -1.5rem;
    left: 0;

    display: grid;
    place-items: center;

    width: 54px;
    height: 54px;
    border-radius: 50%;

    background: var(--main-color-light4);
    color: var(--sub-color);

    font-size: 2rem;
    z-index: 1;
}

.access ol li img {
    display: block;
    width: 100%;
    height: auto;

    margin-bottom: 0.75rem;
    border-radius: 1rem;
}

.access .photos img {
    width: 100%;
    border-radius: 1rem;
}

.access .guidance {
    text-align: center;
    font-size: 1.25rem;
    font-weight: var(--font-medium);
    color: var(--sub-color);
}

.access .facilities {
    text-align: center;
}

/* sight-of-school */
.sight .photo .container {
    width: 90%;
    background-color: var(--secondary-color);
    border-radius: 1rem;
    padding: 1.5rem 1rem;
    margin-bottom: 3rem;
}

.sight h1 {
    font-size: 1.5rem;
    font-weight: var(--font-medium);
    color: var(--secondary-color);
    background-color: var(--main-color);
    padding: 1rem 1.5rem;
    border-radius: 1rem;
    margin: 2rem auto;
    width: 90%;
}

.sight .photo .container h2 {
    max-width: 384px;
    background-color: var(--main-color-light);
    font-size: 1.75rem;
    color: var(--sub-color);
    text-align: center;
    border-radius: 0.75rem;
    margin: 0 auto 2rem;
    padding: 0 4rem;
    width: fit-content;
}

.sight>.photo>.container>div {
    display: grid;
    gap: 1rem;
    margin: 0 auto;
    width: 100%;
    text-align: center;
}

.sight .photo .container div article img {
    margin: 0 auto;
    border-radius: 1rem;
}

/* 募集要項：スマホでは一次手続の下に二次手続を縦に並べる */
@media (max-width: 1023px) {
    .application-guidelines .exam-detail.table-scroll {
        overflow-x: visible;
        /* 次の「第〇期入学試験」との間 */
        margin-bottom: 2.5rem;
    }

    .application-guidelines .exam-detail .wp-block-table table {
        display: flex;
        flex-direction: column;
        width: 100%;
        max-width: 100%;

        thead,
        tbody,
        tr {
            display: contents;
        }

        tr th,
        tr td {
            display: block;
            width: auto;
        }

        /* 空の見出しセルと、行見出し(締切日など)の列は隠す */
        thead th:first-child,
        tbody tr td:first-child {
            display: none;
        }

        /* 一次手続 → その内容 → 二次手続 → その内容 の順に並べる */
        thead th:nth-child(2) {
            order: 1;
        }

        tbody tr td:nth-child(2) {
            order: 2;
        }

        thead th:nth-child(3) {
            order: 3;
            /* 一次手続との間(1.5rem → 0.75rem) */
            margin-top: 0.75rem;
        }

        tbody tr td:nth-child(3) {
            order: 4;
        }

        thead th {
            text-align: center;
        }

        /* 行見出し(締切日など)を左列に、内容を右列に(PCの表と同じ見た目) */
        td[data-label] {
            position: relative;
            padding-left: calc(5.5em + 0.75rem);
            border-top: none;
        }

        td[data-label]::before {
            content: attr(data-label);
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            width: 5.5em;
            display: flex;
            align-items: center;
            justify-content: center;
            background-color: var(--sub-color-light);
            border-right: 1px solid var(--table-line);
        }
    }
}

@media (min-width: 1024px) {
    h1 {
        font-size: 2.625rem;
        font-weight: var(--font-bold);
    }

    .hero {
        height: 400px;
        background-size: auto 400px;
    }

    .hero>div>p {
        font-size: 1.25rem;
        font-weight: var(--font-medium);
    }

    .hero>div>p.heading {
        font-size: 1.5rem;
    }

    /* top-index */
    .top-index .hero {
        height: 674px;
        background-size: auto 674px;
        background-image: url('../img/mainvisual.webp');
    }

    .top-index .hero .heading {
        font-size: 1.25rem;
        margin-bottom: 2rem;
    }

    .top-index .hero .text {
        font-size: 1.25rem;
        font-weight: var(--font-bold);
        margin-bottom: 2rem;
    }

    .top-index .aboutus {
        grid-template-columns: repeat(4, 1fr);
        box-shadow: 0 0 23px rgba(0, 0, 0, 0.02);
    }

    .top-index .about .container>p {
        width: fit-content;
        margin: 1rem auto;
    }

    .top-index .support .container>p {
        width: fit-content;
        margin: 1rem auto;
    }

    .top-index .support .support-cards {
        grid-template-columns: repeat(2, 1fr);
        column-gap: 5rem;
        row-gap: 4rem;
        max-width: 1000px;
        margin-inline: auto;
    }

    /* 右列のカードを下にずらして互い違いに */
    .top-index .support .support-card:nth-child(even) {
        margin-top: 5rem;
    }

    .top-index .support .support-card__img,
    .top-index .support .support-card__body {
        margin-left: 1.75rem;
    }

    .top-index .support .support-card__num {
        font-size: 2.75rem;
    }

    .top-index .support .support-card__body h4 {
        margin-top: -3.25rem;
        font-size: 1.5rem;
    }

    /* 最初のcontainer内で見出しとリンクを左右に配置 */
    .top-index .movie>.container:first-child {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    /* PC用リンクを表示 */
    .top-index .movie .container_pc {
        display: block;
    }

    /* SP用リンクを非表示 */
    .top-index .movie .container_sp {
        display: none;
    }

    .top-index .movie .container_pc a {
        font-size: 0.875rem;
        font-weight: var(--font-bold);
    }

    .top-index .news-blog {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
        width: 90%;
        max-width: 1200px;
        margin: 0 auto 2rem;
        border-radius: 1.5rem;
        background-color: var(--secondary-color);
        box-shadow: 0 0 23px 0 rgba(0, 0, 0, 0.02);
    }

    .top-index .news-blog .container.bg {
        width: 100%;
        border-radius: 0;
        background: none;
    }

    .top-index .blog li a {
        display: flex;
        gap: 1rem;
    }

    .top-index .blog li img {
        width: 128px;
    }

    /* inquiry */
    .inquiry .s-container {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 1rem;
    }

    .inquiry .s-container>a {
        width: 100%;
        display: grid;
        grid-template-columns: 64px 1fr 36px;
        align-items: center;
        column-gap: 1rem;
    }

    /* employment */
    .employment .student>.container>div {
        display: flow-root;
    }

    .employment .student>.container>div img {
        float: right;
        width: min(40%, 360px);
        margin: 0 0 1rem 1.5rem;
        height: auto;
    }

    .employment .student>.container>div h3 {
        margin-top: 0;
    }

    .employment .student>.container>div p {
        text-align: justify;
    }

    .employment .container {
        padding: 2.5rem 3rem;
        border-radius: 3.125rem;
    }

    .employment .record {
        background-color: var(--background);
    }

    .employment .record .container {
        background-color: var(--secondary-color);
    }

    .employment .graduate {
        background-color: var(--background);
    }

    .employment .graduate .container {
        background-color: var(--secondary-color-ash);
    }

    .employment .student {
        background-color: var(--background);
    }

    .employment .student .container {
        background-color: var(--sub-color-light);
    }

    .employment .work {
        background-color: var(--background);
    }

    .employment .work .container {
        background-color: var(--secondary-color);
    }

    .employment .work .column {
        margin-bottom: 3rem;
    }

    /* open-campus */
    .open-campus .meeting .center {
        text-align: center;
    }

    .open-campus .meeting {
        background-color: var(--background);
    }

    .open-campus .meeting .container,
    .open-campus .voices .container {
        background-color: var(--secondary-color);
        max-width: 1200px;
        width: 100%;
        margin: 0 auto;
        border-radius: 3.125rem;
        padding: 2.5rem;
    }

    .open-campus {
        .voices {
            .container {
                .inner-wrapper {
                    padding: 0 0 2rem;

                    .voice {
                        margin-bottom: 0rem;
                        padding: 1rem 1rem 0.5rem;
                        background-color: var(--main-color-light4);

                        h3 {
                            margin-bottom: 0.5rem;
                            font-size: 1.15rem;
                        }

                        .text-right {
                            text-align: right;
                        }
                    }
                }
            }
        }
    }

    /* benefit */
    .benefit .system dl {
        grid-template-columns: max-content 1fr;
    }

    .benefit .system dt {
        font-size: 1.5rem;
    }

    .benefit .system dd {
        line-height: 2.5;
    }

    .loan-type .system dt {
        font-size: 1.5rem;
    }

    .loan-type .system dd {
        line-height: 2.5;
    }

    .contact .label {
        text-align: center;
        margin-right: 2rem;
        width: 15rem;
        font-size: 1.5rem;
    }

    /* learn */
    /* 実習を経験した学生の声：左に画像、右に名前とテキスト */
    .learn .voices .student-voice {
        display: grid;
        grid-template-columns: 300px 1fr;
        grid-template-rows: auto 1fr;
        grid-template-areas:
            "image name"
            "image text";
        column-gap: 2.5rem;
        align-items: start;
    }

    .learn .voices .student-voice__body {
        display: contents;
    }

    .learn .voices .student-voice__name {
        grid-area: name;
        /* 文字の上端を画像の上端に揃える */
        margin: -0.35em 0 1.5rem;
    }

    .learn .voices .image {
        grid-area: image;
        margin: 0;
    }

    .learn .voices .text {
        grid-area: text;
    }

    /* 保育実習カード */
    .learn .training-steps {
        padding-left: 2.5rem;
    }

    .learn .training-steps__item {
        padding: 1.5rem 2rem 2rem 3.5rem;
    }

    .learn .training-steps__item::before {
        width: 3.5rem;
        height: 3.5rem;
    }

    /* 保育ICT */
    .learn .elective {
        grid-template-columns: 2fr 3fr;
        align-items: center;
        gap: 2.5rem;
        padding: 3.5rem 4rem 3.5rem 1.5rem;
    }

    .learn .elective__title {
        font-size: 1.875rem;
    }

    .student-voice__body {
        display: flex;
        flex-direction: row-reverse;
        justify-content: space-between;
        align-items: flex-start;
        gap: 4rem;
    }

    .student-voice__body .image {
        flex: 0 0 auto;
        width: max-content;
        max-width: 100%;
    }

    .student-voice__body .image img {
        display: block;
        width: auto;
        height: auto;
        max-width: 100%;
    }

    .student-voice__body .text {
        flex: 1 1 0;
        min-width: 0;
    }

    /* tuition */
    .tuition th,
    .tuition td {
        font-weight: var(--font-regular);
        font-size: 1rem;
        border: 1px solid var(--table-line);
        text-align: center;
        width: 20%;
        padding: 1.5rem 0;
    }

    .tuition .tel {
        margin-left: 0;
    }

    .tuition {
        .container {
            section:last-of-type {
                >a {
                    display: block;
                    text-align: center;
                    color: var(--sub-color);
                    font-weight: var(--font-medium);
                    font-size: 1.25rem;
                    margin: 0 auto 4rem;
                    border-radius: 999px;
                    background-color: var(--sub-color-light);
                    padding: 1rem 3.5rem;
                    width: fit-content;
                }
            }
        }
    }

    /* introduction */
    .container {
        max-width: 1200px;
        width: 90%;
    }

    .introduction .link {
        display: flex;
        flex-wrap: nowrap;
        justify-content: center;
        gap: 0.75rem;
    }

    .introduction .link li {
        width: auto;
        flex: 1;
    }

    .introduction .link a {
        font-size: clamp(0.7rem, calc(0.269rem + 0.673vw), 0.875rem);
    }

    #greeting {
        margin-bottom: 3rem;
    }

    #greeting .bg {
        padding: 2.5rem 4rem;
        background: var(--secondary-color);
        border-radius: 48px;
    }

    #greeting .heading {
        text-align: center;
        margin-bottom: 2rem;
    }

    /* 写真＋本文の2カラム */
    #greeting .bg>div {
        display: grid;
        grid-template-columns: 410px 1fr;
        gap: 2rem;
        align-items: start;
    }

    /* 左カラム */
    #greeting .bg>div>div:first-child {
        text-align: center;
    }

    #greeting .chairman-photo {
        width: 100%;
        max-width: 410px;
        border-radius: 20px;
        display: block;
    }

    #greeting .caption {
        margin-top: 1.5rem;
        color: #68aaa4;
        font-weight: 700;
        line-height: 1.8;
    }

    /* 右カラム */
    #greeting .bg>div>div:last-child {
        line-height: 1.9;
        font-weight: 700;
    }

    #greeting .bg>div>div:last-child p {
        margin-bottom: 1.5rem;
    }

    #greeting .bg>div>div:last-child p:last-child {
        margin-bottom: 0;
        text-align: right;
        font-size: 0.875rem;
        font-weight: var(--font-regular);
        color: var(--text-card);
    }

    .introduction #philosophy {
        max-width: 1200px;
        margin: 0 auto 3rem;
        display: flex;
        gap: 2rem;
    }

    .introduction #philosophy>section {
        flex: 1;
    }

    .introduction #philosophy>section>div {
        padding: 1rem;
        height: 100%;
    }

    .introduction #philosophy section .logo {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 1.5rem;
        width: 100%;
    }

    .introduction #philosophy section .logo img {
        display: block;
        flex-shrink: 0;
        margin: 0;
    }

    .introduction .container.bg {
        width: 100%;
        max-width: 1200px;
        padding: 1rem 5rem;
        margin: 0 auto;
        background-color: var(--secondary-color);
        border-radius: 3rem;
        box-shadow: 0 0 23px 0 rgba(0, 0, 0, 0.02);
    }

    .introduction h3.heading {
        width: min(588px, 100%);
        margin: 2.5rem auto 1.25rem;
        font-size: 1.75rem;
    }

    .introduction table {
        font-size: 1.5rem;
    }

    .introduction .benefits h4.heading {
        font-size: 1.75rem;
        font-weight: var(--font-bold);
        color: var(--main-color-light2);
        text-align: center;
        margin: 1.25rem 0 1.75rem;
    }

    .introduction .benefits dl dt {
        background-color: var(--secondary-color);
        border-radius: 999px;
        text-align: center;
        width: 12rem;
        margin: 1.25rem auto;
        padding: 0.75rem 1rem;
        font-size: 1rem;
    }

    .introduction .benefits dl dd {
        font-size: 1rem;
        font-weight: var(--font-medium);
    }

    .introduction .benefits dl dd.exemption,
    .introduction .benefits dl dd.delivery {
        text-align: left;
    }

    .introduction .benefits dl dd span {
        color: var(--circle-pink);
        font-size: 1rem;
    }

    /* 保育連携事業：コピー＋画像 */
    .introduction #childcare-cooperation .flex {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 2rem;
        width: 100%;
    }

    /* 左側のコピー */
    .introduction #childcare-cooperation .flex .catch {
        flex: 1 1 auto;
        max-width: 420px;
    }

    /* 保育士を目指す皆さんへ */
    .introduction #childcare-cooperation .flex .catch .first {
        margin: 0 0 0.75rem;
        font-size: 1.25rem;
        font-weight: var(--font-regular);
        line-height: 1.5;
        letter-spacing: 0.08em;
        text-align: left;
    }

    /* 「夢」実現の応援事業 */
    .introduction #childcare-cooperation .flex .catch .second {
        margin: 0 0 0.75rem;
        color: var(--circle-pink);
        font-size: clamp(2rem, 3vw, 2.5rem);
        font-weight: var(--font-bold);
        line-height: 1.3;
        letter-spacing: 0.02em;
        text-align: left;
        white-space: nowrap;
    }

    /* （学業と保育アルバイトの両立） */
    .introduction #childcare-cooperation .flex .catch .third {
        margin: 0;
        padding-right: 0.25rem;
        font-size: 0.875rem;
        line-height: 1.5;
        text-align: right;
    }

    /* 右側の画像 */
    .introduction #childcare-cooperation .flex .image {
        flex: 0 1 588px;
        width: min(55%, 588px);
        aspect-ratio: 588 / 274;
    }

    /* WordPressが出力する画像 */
    .introduction #childcare-cooperation .flex .image img {
        display: block;
        width: 100%;
        height: 100%;
        margin: 0;
        object-fit: cover;
    }

    /* feature */
    #feature,
    #childcare-cooperation,
    #housing {
        margin-bottom: 3rem;
    }

    #feature .bg {
        max-width: 1200px;
        margin-inline: auto;
        padding: 2.5rem 4rem 4rem;
        background: var(--secondary-color);
        border-radius: 40px;
    }

    #feature>.container>.heading {
        text-align: center;
        margin-bottom: 1.5rem;
    }

    /* 各ブロック */
    #feature .bg>div {
        margin-top: 2.5rem;
    }

    #feature .bg>div:first-of-type {
        margin-top: 0;
    }

    /* 2カラム部分 */
    #feature .bg>div>div {
        display: grid;
        grid-template-columns: 1fr 360px;
        gap: 2rem;
        align-items: start;
    }

    #feature p {
        line-height: 1.9;
        margin-bottom: 1.25rem;
    }

    #feature p:last-child {
        margin-bottom: 0;
    }

    /* 表 */
    #feature table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
        overflow: hidden;
        border-radius: 8px;
        text-align: center;
        font-size: 1.2rem;
    }

    #feature th {
        padding: 0.35rem;
        color: #fff;
        background: #68aaa4;
    }

    #feature td {
        padding: 0.35rem;
        border-right: 1px solid #777;
        border-bottom: 1px solid #777;
    }

    #feature tr.week td {
        background: #e6f3f1;
        font-weight: 700;
    }

    #feature .holiday {
        color: #fff;
        background: #68aaa4;
        font-weight: 700;
        vertical-align: middle;
    }

    /* グラフ */
    #feature .graph {
        display: block;
        width: 100%;
        max-width: 320px;
        margin-inline: auto;
    }

    /* 支援制度の強調文 */
    #feature .bg>div:nth-of-type(5) p:nth-of-type(2) {
        font-size: 1.35rem;
        font-weight: 700;
        line-height: 1.8;
    }

    /* リンク */
    #feature a {
        color: #63aaa4;
        text-decoration: underline;
    }

    #childcare-cooperation .bg {
        max-width: 1200px;
        margin-inline: auto;
        padding: 2.5rem 4rem 4rem;
        background: var(--secondary-color);
        border-radius: 40px;
    }

    #childcare-cooperation .bg .flex-container {
        display: flex;
    }

    #childcare-cooperation>div>div {
        margin-bottom: 4rem;
    }

    #childcare-cooperation>div>div:last-child {
        margin-bottom: 0;
    }

    .introduction h2.heading {
        font-size: 2rem;
        font-weight: var(--font-bold);
    }

    .introduction .coexistence {
        margin-right: 1rem;
    }

    .introduction .benefits {
        width: 840px;
        margin: 0 auto 1rem;
        background-color: var(--main-color-light3);
        border-radius: 1.5rem;
        padding: 1rem 8% 2.5rem;
    }

    .benefits dl {
        display: grid;
        grid-template-columns: 220px 1fr;
        gap: 0.5rem;
        align-items: center;
        margin: 0;
    }

    .voice {
        padding: 2.5rem 4rem;
        background: #fff;
    }

    .voice>.heading {
        width: min(640px, 100%);
        margin: 0 auto 2rem;
        padding: 0.4rem 1rem;
        text-align: center;
        border-radius: 8px;
        font-size: 1.8rem;
        line-height: 1.3;
    }

    /* 写真＋本文 */
    .voice>div:first-of-type {
        display: grid;
        grid-template-columns: 310px 1fr;
        gap: 2rem;
        align-items: start;
        max-width: 850px;
        margin: 0 auto 2rem;
    }

    .voice .photo {
        display: block;
        width: 100%;
        border-radius: 18px;
    }

    .voice .name {
        margin-top: 2rem;
        text-align: right;
    }

    /* 下の本文 */
    .voice>div:first-of-type+p {
        max-width: 1000px;
        margin: 0 auto 1.5rem;
    }

    .voice>div:first-of-type+p+p {
        max-width: 1000px;
        margin: 0 auto;
    }

    /* benefitsが続く場合 */
    .voice .benefits {
        margin-top: 3rem;
    }

    #housing>div>div>.photo {
        display: flex;
    }

    #housing>div>div>div>img {
        border-radius: 1rem;
    }

    #housing>div>div>div>img:first-child {
        margin-right: 1.5rem;
    }

    #housing>div>div>div>h4 {
        font-size: 2rem;
        padding-bottom: 10px;
    }

    /* application-guidelines */
    .application-guidelines .link {
        flex-wrap: nowrap;
    }

    .application-guidelines {
        .exam-detail {
            table {
                width: min(100%, 75rem);

                /* table-layout: fixed; */
                tr {
                    td {
                        &:first-child {
                            width: 11rem;
                        }

                        &:nth-child(2) {
                            width: 31.25em;
                        }

                        &:last-child {
                            width: 31.25em;
                        }
                    }
                }
            }
        }
    }

    /* loan-type */
    .loan-type .system dl {
        grid-template-columns: max-content 1fr;
    }

    /* singleparents */
    .singleparents dl {
        display: grid;
        grid-template-columns: max-content 1fr;
    }

    /* access */
    .access .bg {
        width: 90%;
    }

    .access .address br {
        display: none;
    }

    .access iframe {
        height: 558px;
    }

    .access ol {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 4rem;

        /* カルーセル解除 */
        overflow: visible;
        scroll-snap-type: none;
        scroll-padding: 0;

        padding: 2rem 0 0;
    }

    .access ol li {
        /* SPのカルーセル指定を解除 */
        flex: initial;
        scroll-snap-align: none;
        width: auto;
    }



    /* sight */
    .sight>.photo>.container>div {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 1.5rem 1rem;
    }

    /* graduate */
    .graduate-card {
        display: grid;
        grid-template-columns: 1fr 45%;
        gap: 1rem;
        align-items: start;
        margin-bottom: 3rem;
    }

    .graduate-card:last-child {
        margin-bottom: 0;
    }

    .graduate-card>img {
        grid-column: 2;
        grid-row: 1;
        width: 100%;
        height: auto;
    }

    .graduate-card>.content {
        grid-column: 1;
        grid-row: 1;
    }

    .graduate-card h3 {
        margin-top: 0;
        font-size: 1.125rem;
        font-weight: normal;
    }

    .graduate-card p {
        line-height: 1.8;
    }

    .recruiters .to-manager,
    .recruiters .posting {
        border-radius: 3.125rem;
        padding-block: 2.5rem;
    }

    .recruiters .to-manager h2 {
        font-size: 2rem;
        font-weight: var(--font-regular);
        text-align: left;
    }

    /* お問い合わせ */
    .form .wpcf7-form>div:not(.h-adr, .wpcf7-response-output),
    .form .wpcf7-form>span>div:not(.h-adr, .wpcf7-response-output),
    .form .wpcf7-form .h-adr>div:not(.wpcf7-response-output) {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 3.5rem;
    }

    .form .wpcf7-form .input {
        width: 100%;

        .caution {
            margin-bottom: -1rem;
        }

        &.btn-confirmation {
            display: flex;
        }
    }

    .form .wpcf7-form .input textarea {
        height: 8.75rem;
    }

    .wpcf7-list-item label,
    .wpcf7-list-item .label-text {
        display: flex;
        align-items: center;
    }

    .contact .input {
        margin: 0;
    }

    a[href="#"] {
        cursor: context-menu;
    }

    /* contact */
    .form>form>div:not(.h-adr),
    .form>form>.h-adr>div {
        display: flex;
        align-items: center;
    }

    .form {
        .wpcf7-form {
            .input {
                .wpcf7-radio {
                    flex-direction: row;
                }
            }

            .label {
                flex-shrink: 0;
            }

            span {
                div.consultation-datetime {
                    justify-content: start;
                    align-items: start;
                    /* 注記を入力欄の下の行へ送る */
                    flex-wrap: wrap;

                    .consultation-preferred {
                        display: flex;
                        width: fit-content;
                        gap: 0.5rem;

                        span {
                            flex-shrink: 0;
                        }
                    }

                    /* 注記を最初のinputの左端に揃える(ラベル幅15rem + 右マージン2rem) */
                    .caution {
                        flex-basis: 100%;
                        margin: -0.5rem 0 0 17rem;
                    }
                }
            }
        }
    }

    /* 確認画面 */
    .confirm {
        .form {
            .wpcf7-form {
                div.btn-area {
                    align-items: start;

                    div {
                        width: 10rem;

                        input {
                            padding-inline: 3.5rem;
                        }
                    }
                }

                span[data-id="group-consultation"] {
                    div {
                        justify-content: start;

                        .caution {
                            width: 100%;
                            margin-bottom: 0;
                        }

                        .consultation-preferred {
                            display: inline-block;
                            width: 20rem;
                        }
                    }
                }
            }

            .label {
                margin-bottom: 0;
            }
        }
    }

    /* 新着情報・ブログを囲む白いカード */
    .top-index .news-blog,
    .top-index .open-campus-date {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0;

        width: 90%;
        max-width: 1200px;
        margin: 0 auto 4rem;
        padding: 3.5rem 4rem 4.5rem;

        background-color: var(--secondary-color);
        border-radius: 3rem;
        overflow: hidden;
    }

    .top-index .news-blog>section {
        min-width: 0;
    }

    /* 左カラム */
    .top-index .news-blog>.news,
    .top-index .open-campus-date>.sunday {
        padding-right: 3.5rem;
    }

    /* 右カラム＋中央の縦線 */
    .top-index .news-blog>.blog,
    .top-index .open-campus-date>.weekday {
        padding-left: 3.5rem;
        border-left: 2px solid var(--background);
    }

    /* 内側のcontainer設定を解除 */
    .top-index .news-blog .container.bg,
    .top-index .open-campus-date .container.bg {
        width: 100%;
        margin: 0;
        padding: 0;
        background: none;
        border-radius: 0;
    }

    /* =========================
       共通見出し
    ========================= */

    .top-index .news-blog .title,
    .top-index .open-campus-date .title {
        display: flex;
        align-items: center;
        width: 100%;

        margin: 0 0 2.25rem;
        padding: 1.5rem 0 1.25rem;

        border-bottom: 2px solid var(--background);
    }

    .top-index .news-blog .title h3,
    .top-index .open-campus-date .title h3 {
        display: flex;
        align-items: center;
        gap: 0.75rem;

        margin: 0;
        font-size: 1.75rem;
        font-weight: var(--font-bold);
        line-height: 1.2;
    }

    /* 「●」を文字ではなく円として描画 */
    .top-index .news-blog .title h3::before,
    .top-index .open-campus-date .title h3::before {
        content: "";
        display: block;
        flex: 0 0 1.375rem;
        width: 1.375rem;
        height: 1.375rem;

        background-color: var(--secondary-color-gray);
        border-radius: 50%;
    }

    .top-index .news-blog .title a {
        display: flex;
        align-items: center;
        gap: 1rem;

        margin-left: auto;

        color: var(--body-text);
        font-size: 1rem;
        font-weight: var(--font-bold);
        text-decoration: none;
        white-space: nowrap;
    }

    /* 既存の「>」を細い矢印へ変更 */
    .top-index .news-blog .title a::after {
        content: "";
        display: block;
        width: 0.55rem;
        height: 0.55rem;
        margin: 0;

        border-top: 2px solid var(--main-color);
        border-right: 2px solid var(--main-color);
        transform: rotate(45deg);
    }

    /* =========================
       新着情報
    ========================= */

    .top-index .news ul.news {
        display: flex;
        flex-direction: column;
        gap: 2.25rem;

        margin: 0;
        padding: 2rem 0 0;
        list-style: none;
    }

    .top-index .news ul.news li {
        margin: 0;
    }

    .top-index .news ul.news li a {
        display: grid;
        grid-template-columns: 6.5rem 6.5rem minmax(0, 1fr);
        align-items: center;
        column-gap: 1.5rem;

        margin: 0;
        color: inherit;
        text-decoration: none;
    }

    .top-index .news ul.news li p {
        margin: 0;
    }

    .top-index .news ul.news li p.date {
        color: var(--text-small);
        font-size: 1rem;
        font-weight: var(--font-bold);
        white-space: nowrap;
    }

    .top-index .news ul.news li p.notice {
        width: 6.5rem;
        padding: 0.35rem 0.75rem;

        border-radius: 999px;

        font-size: 1rem;
        font-weight: var(--font-bold);
        line-height: 1.4;
        text-align: center;
        white-space: nowrap;
    }

    .top-index .news ul.news li p.news_title {
        grid-column: auto;

        min-width: 0;

        color: var(--text-card);
        font-size: 1rem;
        font-weight: var(--font-bold);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* =========================
       ブログ
    ========================= */

    .top-index .blog ul.blog,
    .top-index .open-campus-date ul {
        display: flex;
        flex-direction: column;
        gap: 2rem;

        margin: 0;
        padding: 0;
        list-style: none;
    }

    .top-index .blog ul.blog li {
        margin: 0;
    }

    .top-index .blog ul.blog li a,
    .top-index .open-campus-date ul li {
        /* display: grid;
        grid-template-columns: 8rem minmax(0, 1fr);
        align-items: center;
        column-gap: 1.875rem;

        color: inherit;
        text-decoration: none; */
    }

    .top-index .news-blog .blog li img,
    .top-index .open-campus-date .sunday li img,
    .top-index .open-campus-date .weekday li img {
        display: block;
        width: 8rem;
        height: 5.875rem;
        margin: 0;

        border-radius: 0.75rem;
        object-fit: cover;
        flex-shrink: 0;
    }

    .top-index .blog .detail {
        min-width: 0;
    }

    .top-index .blog .detail p {
        margin: 0;
    }

    .top-index .blog .detail .date {
        margin-bottom: 0.75rem;

        color: var(--text-small);
        font-size: 1rem;
        font-weight: var(--font-bold);
    }

    .top-index .blog .detail .blog_title {
        color: var(--text-card);
        font-size: 1rem;
        font-weight: var(--font-bold);
        line-height: 1.7;
    }

    .application-guidelines .grid {
        display: grid;
    }
}

@media (min-width: 1334px) {
    .for_sp {
        display: none;
    }
}

/* ////////////////////////////////////////
   固定ページ（page.php）の本文
   リセットCSSや共通スタイルを打ち消し、ブラウザのデフォルト表示に戻す
   ※ 詳細度を要素セレクタ（p, ul など）と同じにし、ファイルの最後に書くことで共通スタイルに勝たせる。
     ブロックエディタのクラス指定（文字揃えなど）はこちらより優先される
//////////////////////////////////////// */
:where(main.page .entry-content) :is(ul, ol, li, p, dl, dt, dd, blockquote, figure) {
    margin: revert;
    padding: revert;
    font-size: revert;
    list-style: revert;
}