/***************************************
共通
****************************************/

@media screen and (max-width:768px) {
    .sp-br {
        display: none;
    }

}

.wrapper_min02 {
    width: 90%;
    max-width: 1140px;
    margin: 0 auto;
}

/***************************************
MV
****************************************/
.course__title {
    color: #476C8B;
}


/***************************************
コース紹介
****************************************/
/* 共通 */
.types__list {
    display: flex;
    justify-content: space-between;
}

.types__item {
    padding: 37px;
    text-align: center;
    border-radius: 30px;
    width: calc((100% - 30px * 2) / 3);
}

.types__title {
    font-size: clamp(28px, 2.5vw, 43px);
    font-weight: 700;
    line-height: 1.8;
}

.types__titleJP,
.types__price span,
.types__text,
.types__feature {
    font-size: clamp(15px, 1.1vw, 16px);
    font-weight: 400;
    line-height: 1.8;
}

.types__text {
    font-size: 16px;
}

.types__titleJP {
    margin-bottom: 8.8px;
}

.types__price {
    font-size: clamp(20px, 1.79vw, 26px);
    padding: 14px 0;
    width: 64%;
    margin: 0 auto 34px;
    background-color: #fff;
    border-radius: 25px;
}

.types__price,
.types__price span,
.types__feature {
    line-height: 1;
}

.types__price span {
    margin-left: 6px;
    color: #393836;
}

.types__text {
    margin-bottom: 49px;
    text-align: center;
}

.typs__lesson {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 54px;
    padding: 18px 12px;
    margin-bottom: 60px;
    font-size: clamp(14px, 1.04vw, 16px);
    line-height: 1;
    font-weight: 500;
}

.types__date {
    position: relative;
}

.types__date::before {
    content: "";
    width: 21px;
    height: 1px;
    background-color: #476C8B;

    position: absolute;
    top: 50%;
    left: -38px;
}

.types__feature {
    background-color: #fff;
    width: 64%;
    margin: 0 auto;
    padding: 20px 0;
    border-radius: 25px;
}

.types__feature:first-child {
    margin-bottom: 13px;
}

.types__list {
    margin: 120px auto 30px;
}

/* コースごとに違うところ */
/* lite */
.types__item-lite {
    background-color: #E5EEF8;
    border: 1px solid #476C8B;
}

.types__title-lite,
.types__titleJP-lite,
.types__price-lite,
.typs__lesson-lite {
    color: #476C8B;
}

.typs__lesson-lite {
    border-top: solid 1px #476C8B;
    border-bottom: solid 1px #476C8B;
}


/* standard */
.types__item-standard {
    background-color: #FAF3E5;
    border: 1px solid #E8A101;
}

.types__title-standard,
.types__titleJP-standard,
.types__price-standard,
.typs__lesson-standard {
    color: #E8A101;
}

.typs__lesson-standard {
    border-top: solid 1px #E8A101;
    border-bottom: solid 1px #E8A101;
}

.types__date-standard::before {
    background-color: #E8A101;
}

/* premium */
.types__item-premium {
    background-color: #F1F8E1;
    border: 1px solid #809947;
}

.types__title-premium,
.types__titleJP-premium,
.types__price-premium,
.typs__lesson-premium {
    color: #809947;
}

.typs__lesson-premium {
    border-top: solid 1px #809947;
    border-bottom: solid 1px #809947;
}

.types__date-premium::before {
    background-color: #809947;
}

.typs__lesson-premium {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-bottom: 35px;
}

.typs__lesson-inner {
    display: flex;
    gap: 54px;
}

/* private */
.private {
    text-align: center;
    width: 73%;
    max-width: 1100px;
    background-color: #FFF8F8;
    border: 1px solid #88191B;
    margin: 0 auto;
    border-radius: 30px;
    padding: 23px 190px 46px;
    margin-bottom: 90px;
}

.types__price-private {
    width: 60%;
    color: #88191B;
}

.types__title-private,
.typs__lesson-private,
.types__titleJP-private {
    color: #88191B;
}


.typs__lesson-private {
    border-top: solid 1px #88191B;
    border-bottom: solid 1px #88191B;
    margin-bottom: 34px;
}

.types__date-private::before {
    background-color: #88191B;
}

.types__feature-wrap-private {
    display: flex;
    align-items: center;
    gap: 28px;
    width: 72%;
    margin: 0 auto;
}

.types__feature-wrap-private>.types__feature:first-child {
    margin-bottom: 0;
}

@media screen and (max-width:768px) {
    .private {
        margin-bottom: 57px;
    }

    .types__list {
        flex-direction: column;
    }

    .types__item {
        width: 100%;
        margin-bottom: 25.39px;
    }

    .types__list {
        margin-bottom: 0px;
    }

    .private {
        width: 90%;
        padding: 37px;
    }

    .types__feature-wrap-private {
        flex-direction: column;
        gap: 13px;
        width: 100%;
    }

    .types__text {
        margin-bottom: 30px;
    }

    .typs__lesson {
        margin-bottom: 30px;
    }


}

/***************************************
Speaking Club
****************************************/
.club {
    text-align: center;
    margin-bottom: 81px;
}

.club__label {
    font-size: clamp(32px, 3.33vw, 48px);
    line-height: 1.5;
    font-weight: 700;
    display: inline-block;

    position: relative;
}

.club__label::before {
    content: "";
    position: absolute;
    left: -158px;
    width: 100px;
    height: 100px;
    background: url(../course/image/sp_shapepink.png) no-repeat center / contain;
    bottom: -85px;
    z-index: -1;
}

.club__label::after {
    content: "";
    position: absolute;
    right: -82px;
    width: 100px;
    height: 100px;
    background: url(../course/image/sp_shapeyellow.png) no-repeat center / contain;
    bottom: -34px;
    z-index: -1;
}

.club__title {
    color: #476C8B;
    margin-bottom: 36px;
}

.club__label span {
    color: #476C8B;
}

.club__text {
    font-size: clamp(16px, 1.38vw, 20px);
    font-weight: 500;
    line-height: 1.8;
    margin-bottom: 77px;
}

.club__list {
    padding: 0 40px;
    display: flex;
    justify-content: space-between;
    margin-bottom: 42px;
}

.club__item {
    width: calc((100% - 20px * 3) / 4);
    background-color: #F6F3E5;
    padding: 38px 25px 33px;
    border: 1px solid #476C8B;
    border-radius: 30px;

    position: relative;
}

.club__item::before {
    content: "";
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background-color: #F6F3E5;
    border: 1px solid #476C8B;
    color: #476C8B;
    font-size: 24px;
    display: flex;
    line-height: 1;
    align-items: center;
    justify-content: center;

    position: absolute;
    top: -29px;
    left: -16px;
}

.club__item01::before {
    content: "01";
}

.club__item02::before {
    content: "02";
}

.club__item03::before {
    content: "03";
}

.club__item04::before {
    content: "04";
}

.club__item-title {
    font-size: clamp(16px, 1.38vw, 20px);
    font-weight: 700;
    line-height: 1;
    color: #476C8B;
    margin-bottom: 32px;

}

.club__item-text {
    font-size: clamp(14px, 1.04vw, 16px);
    font-weight: 400;
    line-height: 1.8;
    margin-top: 19px;
}

.club__bottom {
    display: flex;
    align-items: center;
    border: 1px solid #476C8B;
    padding: 21px 0 24px;
    border-radius: 30px;
}

.conditions {
    text-align: left;
    width: 50%;
}

.conditions__inner:first-child {
    padding: 0 90px 0;
}

.club__bottom .conditions:last-child .conditions__inner {
    padding: 0 50px 0;
    border-left: 1px solid #476C8B;
}

.conditions__list {
    text-align: left;
}

.conditions__title {
    font-size: clamp(16px, 1.38vw, 20px);
    font-weight: 500;
    line-height: 1;
    color: #476C8B;
    margin-bottom: 17px;
}

.conditions__item {
    font-size: clamp(14px, 1.04vw, 16px);
    font-weight: 400;
    line-height: 1;
}

.conditions__item:nth-child(n+2) {
    margin-top: 15px;
}

.conditions__item span {
    color: #476C8B;
}

@media screen and (max-width:768px) {
    .club__text {
        width: 90%;
        margin: 0 auto;
        margin-bottom: 56px;
    }


    .club__list {
        flex-direction: column;
        padding: 0;
        gap: 52px;
    }


    .club__item {
        width: 90%;
        margin: 0 auto;
    }

    .club__bottom {
        flex-direction: column;
    }

    .conditions {
        width: 100%;
    }

    .conditions__inner:first-child {
        padding: 0 50px 0;
    }

    .conditions__inner:last-child {
        padding: none;
    }

    .conditions:first-child {
        margin-bottom: 30px;
    }

    .club__item::before {
        top: -29px;
        left: 50%;
        transform: translateX(-50%);
    }

    .club__label::before {
        left: -98px;
    }


    .club__bottom .conditions:last-child .conditions__inner {
        border-left: 0px solid #476C8B;
    }
}

@media screen and (max-width: 576px) {
    .conditions__inner:first-child {
        padding: 0 20px 0;
    }

    .club__bottom .conditions:last-child .conditions__inner {
        padding: 0px 20px 0;
    }
}


/***************************************
curriculum
****************************************/
.curriculum__section,
.flow__section {
    text-align: center;
    width: 82%;

    margin-bottom: 81px;
}

.curriculum,
.flow {
    color: #476C8B;
}

.curriculum__item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 71px 5px 50px 22px;
    margin: 0 auto;
    max-width: 1000px;
}

.curriculum__shape {
    position: relative;
}



.curriculum__number {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: clamp(19px, 1.66vw, 28px);
    font-weight: 400;
    line-height: 1;
    background-color: #fff;
}

.curriculum__title {
    text-align: left;
    width: 29%;
    margin-left: 34px;
}

.curriculum__title h3 {
    font-size: clamp(20px, 1.65vw, 24px);
    font-weight: 700;
    line-height: 1.5;
}

.curriculum__title p {
    font-size: clamp(13px, 1.11vw, 16px);
}

.curriculum__text {
    font-size: clamp(14px, 1.04vw, 16px);
    line-height: 1.8;
    font-weight: 400;
    text-align: left;
    width: 63%;
    padding: 15px 0 15px 38px;
}

/* 01 */
.curriculum__item01 {
    border-bottom: 1px solid #B68C21;
}

.curriculum__title01 p,
.curriculum__number01 {
    color: #B68C21;
}

.curriculum__number01 {
    border: 1px solid #B68C21;
    color: #B68C21;
    position: relative;
}


.curriculum__text01 {
    border-left: 1px solid #B68C21;
}

.curriculum__number01::before {
    content: "";
    position: absolute;
    left: -43px;
    width: 100px;
    height: 100px;
    background: url(../course/image/curriculum01.png) no-repeat center / contain;
    bottom: -19px;

    z-index: -1;
}



/* 02 */
.curriculum__item02 {
    border-bottom: 1px solid #476C8B;
}

.curriculum__title02 p,
.curriculum__number02 {
    color: #476C8B;
}

.curriculum__number02 {
    border: 1px solid #476C8B;
    color: #476C8B;
    position: relative;
}

.curriculum__text02 {
    border-left: 1px solid #476C8B;
}

.curriculum__number02::before {
    content: "";
    position: absolute;
    left: -43px;
    width: 100px;
    height: 100px;
    background: url(../course/image/curriculum02.png) no-repeat center / contain;
    bottom: 11px;

    z-index: -1;
}

/* 03 */
.curriculum__item03 {
    border-bottom: 1px solid #809947;
}

.curriculum__title03 p,
.curriculum__number03 {
    color: #809947;
}

.curriculum__number03 {
    border: 1px solid #809947;
    color: #809947;
    position: relative;
}

.curriculum__text03 {
    border-left: 1px solid #809947;
}

.curriculum__number03::before {
    content: "";
    position: absolute;
    left: -26px;
    width: 100px;
    height: 100px;
    background: url(../course/image/curriculum03.png) no-repeat center / contain;
    bottom: -21px;

    z-index: -1;
}

/* 04 */
.curriculum__item04 {
    border-bottom: 1px solid #E8A101;
}

.curriculum__title04 p,
.curriculum__number04 {
    color: #E8A101;
}

.curriculum__number04 {
    border: 1px solid #E8A101;
    color: #E8A101;
    position: relative;
}

.curriculum__text04 {
    border-left: 1px solid #E8A101;
}

.curriculum__number04::before {
    content: "";
    position: absolute;
    left: -28px;
    width: 100px;
    height: 100px;
    background: url(../course/image/curriculum04.png) no-repeat center / contain;
    bottom: -12px;

    z-index: -1;
}

/* 05 */
.curriculum__item05 {
    border-bottom: 1px solid #88191B;
}

.curriculum__title05 p,
.curriculum__number05 {
    color: #88191B;
}

.curriculum__number05 {
    border: 1px solid #88191B;
    color: #88191B;

    position: relative;
}

.curriculum__text05 {
    border-left: 1px solid #88191B;
}

.curriculum__number05::before {
    content: "";
    position: absolute;
    left: -44px;
    width: 100px;
    height: 100px;
    background: url(../course/image/curriculum05.png) no-repeat center / contain;
    bottom: 0px;

    z-index: -1;
}

/* 06 */
.curriculum__item06 {
    border-bottom: 1px solid #393836;
}

.curriculum__text06 {
    border-left: 1px solid #393836;
}

.curriculum__title06 p {
    display: inline-block;
    padding: 4px 42px;
    border: 1px solid #393836;
    border-radius: 60px;
    font-size: clamp(16px, 1.38vw, 20px);
    font-weight: 500;
    line-height: 1.8;
}

@media screen and (max-width:768px) {
    .curriculum__title {
        text-align: center;
        width: 100%;
        margin-left: 0px;
    }

    .curriculum__item {
        flex-direction: column;
        margin-top: 30px;
        padding: 71px 0 50px;
    }

    .curriculum__text {
        width: 80%;
        padding: 0;
        text-align: center;
        margin-bottom: 30px;
        border-left: none;
    }

    .curriculum__number {
        margin-left: 0px;
        margin-bottom: 20px;
    }

    .curriculum__title p,
    .curriculum__number {
        margin-bottom: 20px;
    }

    .curriculum__number06 {
        height: 0;
    }

    .curriculum__item06 {
        margin: 0;
    }

    .curriculum__title06 {
        margin-bottom: 30px;
    }
}

/***************************************
flow
****************************************/
.flow__section {
    max-width: 840px;
    margin: 0 auto;
}

.flow__list {
    margin-top: 74px;
}

.flow__top {
    padding: 30px 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 55px;
    border-bottom: 1px solid #393836;

    position: relative;
}

.flow__number {
    width: 124px;
    padding: 4px 0px;
    font-size: clamp(16px, 1.38vw, 20px);
    line-height: 1.8;
    font-weight: 500;
    border-radius: 60px;
    border: 1px solid #393836;
    background-color: #fff;
}

.flow__title {
    font-size: clamp(20px, 1.65vw, 24px);
    line-height: 1.5;
    font-weight: 500;

    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    width: max-content;
}



.flow__date {
    font-size: clamp(14px, 1.04vw, 16px);
    line-height: 1.5;
    font-weight: 400;
}

.flow__text {
    font-size: clamp(14px, 1.04vw, 16px);
    line-height: 1.6;
    font-weight: 400;
    padding: 51px 0 21px;
    margin: 0 auto;
    width: 60%;
}

.flow__text01 {
    margin-top: 24px;
}

.flow__item {
    position: relative;
    background-repeat: no-repeat;
    background-position: left top;
    background-size: cover;
    margin-bottom: 76px;
    border-radius: 30px;
}

/* 三角形（親要素の下にくっつく・常に100%幅） */
.flow__item::after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -75px;
    /* 三角形の高さ（vwで可変） */
    width: 95.047619%;
    height: 76px;
    /* 三角形の高さ。デザインに合わせて変更 */

    /* 三角形を描く */
    clip-path: polygon(50% 100%, 0 0, 100% 0);
}



.flow__item01,
.flow__item01::after {
    background-color: #F6F3E5;
}

.flow__item02,
.flow__item02::after {
    background-color: #E5EEF8;
}

.flow__item03,
.flow__item03::after {
    background-color: #7D9DBE;
}

.flow__item04 {
    background-color: #476C8B;
}

.flow__text04 {
    padding: 51px 0 65px;
}

/* 文字白 */
.flow__title-wh,
.flow__date-wh,
.flow__text-wh {
    color: #fff;
}

.flow__top-wh {
    border-bottom: 1px solid #fff;
}

@media (max-width: 768px) {
    .flow__top {
        flex-direction: column;
    }

    .flow__title {
        position: static;
        transform: none;
        left: auto;
        width: 100%;
        text-align: center;
        margin-top: 10px;
    }
}

@media screen and (max-width:768px) {
    .flow__item::after {
        width: 93.5%;
    }
}

@media screen and (max-width:680px) {
    .flow__item::after {
        width: 92.5%;
    }
}

@media screen and (max-width:594px) {
    .flow__item::after {
        width: 91.5%;
    }
}

@media screen and (max-width: 534px) {
    .flow__item::after {
        width: 90.5%;
    }
}

@media screen and (max-width: 490px) {
    .flow__item::after {
        width: 89.5%;
    }
}

@media screen and (max-width: 450px) {
    .flow__item::after {
        width: 88.5%;
    }
}

@media screen and (max-width: 400px) {
    .flow__item::after {
        width: 87.5%;
    }
}

@media screen and (max-width: 370px) {
    .flow__item::after {
        width: 85.5%;
    }
}

.border {
    width: 100%;
    height: 1px;
    background-color: #393836;
    /* 色 */
    margin: 120px 0 166px;
}

.section_trial {
    margin-top: 166px;
}