/* フレックスボックスの基本設定 等間隔（両端揃え）折返しあり */
[class^="flex-col"] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

/* コンテンツ下のマージン */
.flex-child {
    margin-bottom: 10px;
}

.Instructor {
    width: 159px;
    height: 229px;
}

/* instructor写真装飾 */
.qr2 {
    width: 100px;
    height: 100px;
    display: block;
    margin: auto;
}

.new {
    width: 50px;
    height: 18px;
    display: block;
    margin: auto;
}

.studiot {
    width: 144px;
    height: 29px;
    display: block;
    margin: auto;}

.flex-child span.b {
    font-weight: bold;
}

/* 各カラム毎のコンテンツと疑似要素の横幅 */
.flex-col2 .flex-child {
    width: calc((100% - 10px) / 2);
}

.flex-col3::after,
.flex-col3 .flex-child {
    width: calc((100% - 20px) / 3);
}

.flex-col4::before,
.flex-col4::after,
.flex-col4 .flex-child {
    width: calc((100% - 30px) / 4);
}

/****** インストラクター用追加 ******/
.flex-child h3.instructor {
    margin: 10px;
    padding: 5px;
    font-size: 2em;
}

/****** more_menu用追加 ******/
/* fontサイズUP */
.flex-child h3.up_line {
    margin: 10px;
    padding: 5px;
    font-size: 2em;
    border-bottom: solid 1.5px;
}
.flex-child h3.up_line2 {
    margin: 10px;
    padding: 5px;
    font-size: 1em;
    border-bottom: solid 1.5px;
}
/* 最終行は両端揃えにしない */
.flex-col3::after,
.flex-col4::before,
.flex-col4::after {
    content: "";
}

.flex-col4::before {
    order: 1;
}

/* レスポンシブ対応 */

/* 991px以下で4列 → 3列 */
@media screen and (max-width: 991px) {

    .flex-col4::after,
    .flex-col4 .flex-child {
        width: calc((100% - 20px) / 3);
    }
}

/* 767px以下で4列・3列 → 2列 */
@media screen and (max-width: 767px) {

    .flex-col3 .flex-child,
    .flex-col4 .flex-child {
        width: calc((100% - 10px) / 2);
    }
    footer {
        display: block;
    }
}
    /* 575px以下で全て1列 */
    @media screen and (max-width: 575px) {

        .flex-col2 .flex-child,
        .flex-col3 .flex-child,
        .flex-col4 .flex-child {
            width: 100%;
        }

        .codrops-demos {
            display: none;
        }

        footer {
            display: block;
        }
    }