/* ===== 全体の調整 ===== */
#about:not(.approach) .section-default { background-color: var(--main-color); }
#about .section-default { 
    padding-block: 0;
    margin-top: -1px; 
    margin-bottom: var(--section-space);
}
#about .title-cover {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 35vw;
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: top;
}
#about .title-cover h2 :where(.ja, .en) { color: var(--color-white); }

/*導入部分*/
#about .page-concept h3 {
    font-size: 1.9em;
    line-height: 1.6;
    letter-spacing: 0.1em;
}
#about .page-concept h3 + p {
    line-height: 2.15em;
    letter-spacing: 0.05em;
    margin-top: var(--space-4);
}
/* 黄色いタイトル about, educationで使用*/
#about .page-concept h3.section-title--yellow {
    font-family: "Roboto", sans-serif;
    font-weight: 900;
    color: var(--color-yellow);
    letter-spacing: 0.1em;
}

/* 本の部分 */
.book-base {
    --book-h: 180px;
    color: var(--color-white);
    background-color: var(--main-color);
    z-index: 0;
    margin-top: -1px;
    margin-bottom:0;
}
.book-base::before {
    background-size: cover;
    top: calc(-1 * var(--book-h) + 15px);
    z-index: -1;
}
.section-book--blue::after { background-position: center bottom; }
.book-base.section-book--blue::after,
.book-base.section-book--lightblue::after { bottom: -15px; }

/* =============================
  // #about　誠泉塾について
  =============================*/
#about.about .title-cover { background-image: url(../_img/about/about_header.png); }
#about .marquee-img { margin-top: var(--space-2); }
#about .marquee-img div { padding-bottom: 0; }
#about .marquee-img figure.img-horizontal { position: static; }

/* =============================
  // #about　誠泉塾について
  //All for our students!
  =============================*/

#about .page-concept h3.section-title--yellow { font-size: 3.1em; }
#about .page-concept h3.section-title--yellow span { text-transform: uppercase; }
#about .page-concept h3.section-title--yellow + p { margin-top: var(--space-2); }

/* =============================
  // #about　誠泉塾について
  // 誠泉塾の教育システム・誠泉塾の取り組み
  =============================*/
#about section:has(> .item-wrap) {
    overflow-y:visible;
    overflow-x: clip;
}
#about .item-wrap {
    z-index: 0;
    container-type: inline-size;
}
.about-item {
    max-width: 664px;
    text-align: justify;
    border: 1px solid var(--color-white);
    padding: var(--pad-5) var(--pad-6);
    position: absolute;
    top: 70px;
    z-index: 1;
}
.about-item h3 {
    display: inline-flex;
    font-size: 1.43em;
    color: var(--fc-black);
    white-space: nowrap;
    background-color: var(--color-white);
    padding: var(--pad-1) var(--pad-3);
    position: absolute;
    top: -27px;
}
.about-item h3 + p {
    line-height: 2.16em;
    letter-spacing: 0.05em;
    padding-top: 0;
}
.item-wrap figure {
    border-radius: var(--radius);
    margin: 0;
    max-width: 630px;
    margin-left: auto;
    right: -80px;
    z-index: 0;
}
.item-wrap figure img {
    width:100%;
    height:100%;
    object-fit: cover;
}
.item-wrap + .button {
    max-width: 366px;
    justify-content: center;
    margin-top: var(--space-3);
}
#initiatives {
    padding-top: 0;
    margin-bottom: var(--space-6);
}


/* =============================
  // #education　#approach共通
  =============================*/
/* 本の部分 */
#about:where(.education, .approach) .book-base.section-book-mask--white {
    color: var(--fc-black);
    background-color: var(--color-white);
    margin-bottom: 0;
}
:where(.education, .approach) .book-base.section-book-mask--white { --book-h:200px; }


/* 序盤コンセプト */
#about:where(.education, .approach) .page-concept :where(h3, h4) { color: var(--main-color); }
#about:where(.education, .approach) .page-concept h3 { font-size: 2em; }
#about:where(.education, .approach) .page-concept h3 + p {
    letter-spacing: 0.05em;
    line-height: 2.16;
    margin-top: var(--space-3);
}

/* タイトル横のオレンジのアクセント */
#about.education .page-concept > section h4,
#about.approach .title-point {
    font-size: 1.47em;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--gap-6);
}
#about.approach .title-point > br { display: none; }
#about.education .page-concept > section h4::before,
#about.education .page-concept > section h4::after,
#about.approach .title-point::before,
#about.approach .title-point::after {
    content: '';
    display: inline-flex;
    width: 32px;
    height: 34px;
    background-image: url(../_img/about/SVG/accent.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
#about.education .page-concept > section h4::before,
#about.approach .title-point::before { transform: rotate(300deg); }


/* =============================
  // #education　誠泉塾の教育システム
  =============================*/
#about.education .title-cover { background-image: url(../_img/about/education_header.png); }

/* =============================
  // #education　誠泉塾のシステム
  // 誠泉塾でこう変わる
  =============================*/
#about.education .page-concept > section { margin-block: var(--space-3); }

#about .change-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 0;
    margin-top: var(--space-3);
}
#about .change-list li {
    display: inline-flex;
    flex-direction: column;
    flex: 1;
    width: max-content;
    font-size: 0.95em;
    max-width: 237px;
}
#about .change-list li > div {
    width: 100%;
    height: 327px;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    gap: var(--gap-2);
    align-items: center;
    font-size: 1.39em;
    color: var(--color-white);
    letter-spacing: 0.075em;
    background-color: var(--color-light-blue);
    border-radius: 50rem;
}
#about .change-list li > div > span {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: 2.64em;
    color: var(--color-yellow);
    line-height: 1.5;
    position: relative;
}
#about .change-list li > div > span::before,
#about .change-list li > div > span::after {
    content: '';
    display: inline-flex;
    max-width: 126px;
    height: 44px;
    width: 100%;
    background-image: url(../_img/about/SVG/accent--white.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
#about .change-list li > div > span::after { transform: rotate(180deg); }
#about .change-list li > p {
    text-align: left;
    padding-inline: var(--pad-2);
}

/* =============================
  // #education　誠泉塾のシステム
  // 誠泉塾独自の学習システム
  =============================*/
#about #system {
    background-color: var(--main-color);
    padding-top: var(--pad-7);
    margin-bottom: var(--space-6);
}
#about #system > section { padding-bottom: 0; }
#about #system > h3 { font-size: 1.3em; }

#about #system > section h4  {
    font-size: 1.68em;
    letter-spacing: 0.1em;
    margin-bottom: var(--space-2);
}
#about #system > section h4 span {
    display: block;
    margin-bottom: var(--space-2);
}
#about #system > section h4 + p {
    letter-spacing: 0.05em;
    line-height: 2.16em;
}
/* LETSナビ */
#about #system .lets-nav {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-left: 0;
    margin-top: var(--space-3);
}
#about #system .lets-nav li {
    width: 237px;
    height: 186px;
    display: inline-flex;
    justify-content: center;
    border: 1px solid var(--color-white);
    border-radius: var(--radius);
    padding-top: var(--pad-3);
}
.lets-nav li::after {
    content: '\f13a';
    display: block;
    --size:27px;
    width: var(--size);
    height: var(--size);
    font-family: "Font Awesome 7 Free"; 
    font-weight: 900;
    font-size: var(--size);
    color: var(--color-white);
    position: absolute;
    left: 0;
    right: 0;
    bottom: 24px;
    margin: auto;
}
#about #system .lets-nav a { color: var(--color-white); }
.lets-title {
    display: inline-flex;
    flex-direction: column;
}
.lets-title span:first-child {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-size: 1.3em;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    line-height: 1;
}
.lets-title span:first-child::first-letter {
    font-size: 2.6em;
    color: var(--color-yellow);
    margin-right: 5px;
}
.lets-title span:last-child { font-size: 20px; }

/* marquee */
#about .marquee {
    line-height: 1;
    position: static;
    opacity: .06;
    margin-top: 0;
}

/* LETSの個別コンテンツ */
#lesson.lets-content { margin-top: -30px; }
.lets-content {
    text-align: left;
    padding-top: 0;
    position: relative;
    overflow-x:clip;
}
.lets-content .lets-title {
    display: flex;
    align-items: start;
    text-align: left;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--color-white);
    font-size: 1.5em;
}
.lets-content .lets-title span:last-child {
    display: inline-flex;
    align-items: start;
    background-color: var(--main-color);
    padding-block: 5px;
    padding-right: 1em;
    position: absolute;
    bottom: -18px;
}
.lets-content .lets-wrap {
    color: var(--fc-black);
    font-size: 0.95em;
    background-color: var(--color-white);
    border-radius: var(--radius);
    padding: var(--pad-6) var(--pad-6);
    margin-top: var(--space-2);
}
.lets-content .lets-wrap > section:first-child {
    max-width: clamp(370px, 48vw, 530px);
    margin-bottom: var(--space-3);
}
.lets-content .lets-wrap > section:first-child > p {
    text-align: justify;
}
.lets-content .lets-wrap > section { padding-block: 0; }
.lets-content .lets-wrap > section .button { --btn-w: 366px; }
.lets-content .lets-wrap > section .button::after { left: .5em; }
.lets-content .lets-wrap > section h6 {
    color: var(--main-color);
    font-size: 1.4em;
}
.lets-content > .width-limiter:has(figure) { position: static; }
.lets-content figure {
    aspect-ratio: 460 / 368;
    max-width: clamp(380px, 40vw, 460px);
    max-height: 368px;
    border-radius: var(--radius) 0 0 var(--radius);
    overflow: hidden;
    margin: 0;
    position: absolute;
    top: 7%;
    left: 61.5%;
}
.lets-content figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* =============================
    // #education 誠泉塾の教育システム
    // 誠泉塾の教師たち
    =============================*/
.teacher-list + .button {
    --btn-w: 366px;
    justify-content: center;
}
.teacher-list + .button::after { left: 2em; }

/* =============================
  // #approach 誠泉塾の取り組み
  =============================*/
#about.approach .title-cover { background-image: url(../_img/about/approach_header.png); }
#about.approach .book-base.section-book--lightblue {
    background-color: var(--color-bg-light);
    color: var(--fc-black);
    padding-bottom: 100px;
    margin-bottom: 0;
}
#about.approach .title-point {
    font-size: 0.95em;
    gap: var(--gap-1);
}
#about.approach .page-content h3 { 
    font-size: 1.37em;
    color: var(--main-color);
    margin-top: 13px;
}
#about.approach .page-concept h3 + p { margin-bottom: var(--space-5); }

/* #approachの中身 .page-contentにすることで、他のページとh3を差別化 */
#about .page-content h3 + p { margin-top: var(--space-2); }

/* =============================
  // #approach 誠泉塾の取り組み
  // 誠泉塾専用アプリ
  =============================*/
  #about #application { padding-top: 0; }
  #about #application .app-img { padding: 0; }
  #about #application .app-img::after {
    content:'';
    width: 146px;
    height: 281px;
    background-image: url(../_img/about/app.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: top center;
    position: absolute;
    right: 2%;
    top: -70px;
    z-index: 5;
}

#about #application .app-list {
    --gap: 0;
    background-color: var(--color-white);
    padding-inline: var(--pad-4);
    border-radius: var(--radius);
    padding-bottom: var(--pad-1);
    margin: 0;
    margin-top: var(--space-3);
}
#about #application .app-list li {
    text-align: left;
    border-bottom: 1px dashed #d1d1d1;
    padding-block: 10px;
}
#about #application .app-list dl {
    padding-block: var(--pad-3) var(--pad-2);
    padding-right: var(--pad-6);
}
#about #application .app-list dt {
    display: flex;
    align-items: center;
    color: var(--main-color);
    font-size: 1.2em;
}
/* 各アイコン */
#about #application .app-list dt.app-icon::before {
    content: '';
    display: inline-flex;
    width: var(--img-w);
    height: var(--img-h);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    margin-right: 13px;
}
.app-icon.icon--info::before {
    --img-w: 1.89em;
    --img-h: 1.32em;
    background-image: url(../_img/about/SVG/app_aicon1.svg);
}
.app-icon.icon--entry::before {
    --img-w: 2.05em;
    --img-h: 1.53em;
    background-image: url(../_img/about/SVG/app_aicon6.svg);
}
.app-icon.icon--chat::before {
    --img-w: 2.16em;
    --img-h: 2.11em;
    background-image: url(../_img/about/SVG/app_aicon2.svg);
}
.app-icon.icon--booking::before {
    --img-w: 2em;
    --img-h: 2em;
    background-image: url(../_img/about/SVG/app_aicon11.svg);
}
.app-icon.icon--tuition::before {
    --img-w: 2.16em;
    --img-h: 1.47em;
    background-image: url(../_img/about/SVG/app_aicon3.svg);
}
.app-icon.icon--temp::before {
    --img-w: 1.74em;
    --img-h: 1.74em;
    background-image: url(../_img/about/SVG/app_aicon8.svg);
}
.app-icon.icon--report::before {
    --img-w: 1.34em;
    --img-h: 1.79em;
    background-image: url(../_img/about/SVG/app_aicon4.svg);
}
.app-icon.icon--grades::before {
    --img-w: 1.37em;
    --img-h: 1.84em;
    background-image: url(../_img/about/SVG/app_aicon9.svg);
}
.app-icon.icon--video::before {
    --img-w: 1.74em;
    --img-h: 1.74em;
    background-image: url(../_img/about/SVG/app_aicon5.svg);
}
.app-icon.icon--online::before {
    --img-w: 1.89em;
    --img-h: 1.11em;
    background-image: url(../_img/about/SVG/app_aicon10.svg);
}
.app-icon.icon--schedule::before {
    --img-w: 1.58em;
    --img-h: 1.58em;
    background-image: url(../_img/about/SVG/app_aicon7.svg);
}
/* アプリの中身 */
#about #application .app-list dd {
    font-size: 0.95em;
    margin-top: 13px;
}
#about #application .app-list li:nth-child(odd) dl {
    border-right: 1px dashed #ddd;
    padding-left: var(--pad-1);
}
#about #application .app-list li:nth-child(even) dl {
    padding-left: var(--pad-5);
    padding-right: var(--pad-3);
}
#about #application .app-list li:nth-last-child(-n + 2) { border-bottom: 0; }

/* =============================
  // 誠泉塾の取り組み
  // 登下校の安全対策
  =============================*/
#safety-measures figure {
    border-radius: var(--radius);
    margin: 0;
}

/* =============================
  // 誠泉塾の取り組み
  // 三者面談
  =============================*/
#about #three-way-meeting > div {
    text-align: left;
    margin-top: var(--space-4);
}
#about .meeting-content * { margin: 0; }
#about .meeting-content h4 {
    color: var(--main-color);
    font-size: 1.1em;
    text-indent: var(--pad-3);
}
#about .meeting-content ul {
    font-size: 1em;
    font-weight: bold;
    margin-top: 15px;
}
#about .meeting-content ul li {
    display: flex;
    align-items: center;
    gap: var(--gap-1);
    background-color: var(--color-white);
    border-radius: 50rem;
    padding: var(--pad-2);
    margin-bottom: 15px;
}
#about .meeting-content ul li:last-child { margin-bottom: 0; }
#about .meeting-content ul li::before {
    content: '';
    display: inline-flex;
    --size: 1.68em;
    width: var(--size);
    height: var(--size);
    color: var(--color-elem-main);
    background-color: currentColor;
    mask: url("../_img/about/SVG/square-check-solid-full.svg") no-repeat center / contain;
    -webkit-mask: url("../_img/about/SVG/square-check-solid-full.svg") no-repeat center / contain;
}

#about #three-way-meeting figure {
    max-width: 420px;
    max-height: 369px;
    border-radius: var(--radius);
    overflow: hidden;
}
#about #three-way-meeting figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
#about #three-way-meeting figure + p {
    text-align: center;
    margin-top: var(--space-4);
    font-weight: bold;
}

@media (min-width: 1500.1px) {
    #about .title-cover {
        height: 420px;
    }
    .section-book--blue::before {
        background-size: contain;
    }
}
@media (min-width: 1200.1px) {
    :where(.education, .approach).book-base { --book-h: 200px; }
    .approach .book-base { margin-bottom: 0; }
    .book-base::before,
    .book-base::after {
        max-width: 1500px;
        left: 0;
        right: 0;
        margin-inline: auto;
    }
    .item-wrap figure,
}
@media (min-width: 768px) {
    /* =============================
    // #about 誠泉塾について min-768
    // 誠泉塾の教育システム 
    =============================*/
    .item-wrap { padding-right: 0; }
}
@media (max-width: 970px) {
    /* =============================
    // #about 誠泉塾について 970
    // 誠泉塾の教育システム 
    =============================*/
    .about-item { position: static; }
    
}
@media (max-width: 920px) {
    #about .section-book--blue > .width-limiter.page-concept { padding-top: calc(var(--section-space) / 2); }
    #about .page-concept { font-size: 18px;}

    /* =============================
    // 誠泉塾の教育システム 920
    =============================*/
    #about .change-list { row-gap: var(--gap-5); }
    #about .change-list li { width: calc(100% / 2 - 20px); }

    #about.education .page-concept > section { font-size: 18px; }
    #about.education .book-base.section-book-mask--white { padding-bottom: calc(var(--section-space) * 1.5); }

  /* =============================
    // 誠泉塾の教育システム 920
    //　誠泉塾専用アプリ
    =============================*/
    #about #application .title-point > br { display: block; }
    #about #application .app-img::after { top: 0; }
    #about #application .app-list.grid-column-2 { grid-template-columns: repeat(1, 1fr); }
    #about #application .app-list li:nth-child(odd) dl {
    border: 0;
    padding-right: 0;
    }
    #about #application .app-list li:nth-child(even) dl {
    padding-right: 0;
    padding-left: var(--pad-1);
    }
    #about #application .app-list li:nth-last-child(2) { border-bottom: 1px dashed #d1d1d1; }

  /* =============================
    // 誠泉塾の教育システム 920
    //　登下校の安全対策
    =============================*/
    #about #safety-measures { font-size: 18px; }
    #about #safety-measures .safety-measures-list { 
        margin-top: 0;
        row-gap: 0;
    }
    #about #safety-measures .safety-measures-list { grid-template-columns: repeat(2, 1fr);
    }
    #about #safety-measures .safety-measures-list article { margin-top: var(--space-5); }


  /* =============================
    // 誠泉塾の教育システム 920
    //　年3回以上の三者面談
    =============================*/
    #about #three-way-meeting { font-size: 18px; }
    #about #three-way-meeting > div.grid {
        display: flex;
        flex-direction: column;
    }
    #about #three-way-meeting .meeting-content h4 { text-align: center; }
    #about #three-way-meeting figure { margin-inline: auto; }

}
@media (max-width: 768px) {
    /* 共通設定 */
    #about .title-cover {
        height: 280px;
        background-size: cover;
    }
     /* =============================
    // #about 誠泉塾について 768
    // 誠泉塾の教育システム 
    =============================*/
    .about-item + figure { margin-top: var(--space-1); }
    .item-wrap + .button { margin-top: var(--space-4); }

    /* =============================
    // #education 誠泉塾の教育システム 768
    //　誠泉塾でこう変わる 青いリスト部分
    =============================*/
    #about .change-list li { flex: none; }

    /* =============================
    // #education　誠泉塾のシステム 768
    // LETS
    =============================*/
    #about #system .lets-nav { flex-wrap: wrap; }
    #about #system .lets-nav li { width: calc(100% / 2 - 5px); }
    .lets-content { padding-bottom: 0; }
    .lets-content ~ .lets-content { margin-top: -30px;}
    .lets-content .lets-wrap > section:first-child { max-width: none; }
    .lets-content figure {
        position: static;
        border-radius: var(--radius);
        margin-left: auto;
    }
    /* =============================
    // 誠泉塾の教育システム 920
    //　誠泉塾専用アプリ
    =============================*/
}
@media (max-width: 640px) {
    /* =============================
    // 誠泉塾の取り組み 640
    // 登下校の安全対策
    =============================*/
    #about #safety-measures .safety-measures-list {
        grid-template-columns: repeat(1, 1fr);
        justify-content: center;
    } 
}
@media (max-width: 600px) {
    /* =============================
    // 誠泉塾の教育システム 600
    //　誠泉塾専用アプリ
    =============================*/
    #application > div {
        padding:var(--pad-4);
        display: flex;
        flex-direction: column;
        justify-content: start;
    }
    #application .title-point{
        justify-content: start;
    }
    #application .page-content h3 {
        text-align: left;
        text-indent: 32px;
    }
    #application .page-content h3::after {
        margin-left: 32px;
    }
}
@media (max-width: 520px) {
    /* =============================
    // #about 全体
    =============================*/
    #about .page-concept { font-size: 1rem;}
    #about .page-concept h3.section-title--yellow { font-size: 2.5em; }

    /* =============================
    // #about 誠泉塾について520
    =============================*/
    .about-item h3 { font-size: 1.2em; }
    .about-item {
        padding-inline: var(--pad-2);
        font-size: .9em;
    }
    .about-item figure {
        position: static;
        border-radius: var(--radius);
    }
    .about-item h3 {
        left: 50%;
        transform: translateX(-50%);
    }
    .item-wrap + .button {
        max-width: 90%;
    }
    .item-wrap figure {
        right:0;
        border-radius: var(--radius);
    }

    /* =============================
    // #education 誠泉塾の教育システム 520
    =============================*/
    #about.education .page-concept h3 + p { text-align: justify; }
    #about.education .page-concept > section { font-size: 1rem; }
    #about.education .page-concept > section h4 { gap: var(--gap-2); }

    /* =============================
    // #education 誠泉塾の教育システム 520
    // 誠泉塾独自の学習システム
    =============================*/
    #about #system > section { font-size: 1rem; }
    .lets-content .lets-title span:first-child { font-size: 30px; }
    .lets-content .lets-wrap {
        font-size: 1rem;
        padding: var(--pad-3);
    }
    .lets-content ~ .lets-content { margin-top: var(--space-3);}
    .lets-content figure { 
        width: 100%;
        max-width: none;
        margin-left: unset;
    }
    .lets-content .lets-wrap > section .button {
        max-width: 100%;
        --btn-h: auto;
        line-height: 1.2;
        padding: var(--pad-2);
    }

    /* =============================
    // #education 誠泉塾の教育システム 520
    // 誠泉塾の教師たち
    =============================*/
    #teacher > p { text-align: justify; }
    .teacher-list + .button {
        max-width: 90%;
        font-size: 18px;
    }

    /* =============================
    // #education 誠泉塾の教育システム 520
    // 誠泉塾専用アプリ
    =============================*/
    #about #application .app-list { font-size: 1rem; }
    #about #application .app-img::after {
        position: relative;
        top: 1rem;
        left: 0;
        right: 0;
        margin-inline: auto;
    }
    #application > div {
        padding:var(--pad-4);
        display: flex;
        flex-direction: column;
        justify-content: start;
    }
    #about.approach .title-point{
        justify-content: center;
    }
    #about.approach .page-content h3 {
        text-align: center;
        text-indent: 0;
    }
    #about.approach .page-content h3::after {
        margin-left: auto;
    }

    /* =============================
    // #approach 誠泉塾の取り組み 520
    //　三者面談
    =============================*/
    #about #three-way-meeting { font-size: 1rem; }
    #safety-measures > p br { display: none; }
    .safety-measures-list article { padding-block: var(--pad-4) var(--pad-2); }
    #about #three-way-meeting figure {
        max-width: none;
        max-height: none;
        width: 100%;
        margin-inline: 0;
    }
    #about #three-way-meeting figure + p { margin-top: var(--space-2); }
    

}
@media (max-width: 470px) {
    /* =============================
    // #education 誠泉塾の教育システム
    //　誠泉塾でこう変わる 青いリスト部分
    =============================*/
    #about .change-list {
        flex-direction: column;
        align-items: center;
    }
    #about .change-list li { width: 100%; }
}
@media (max-width: 375px) {
    .teacher-list + .button::after { left: 1em; }
}