@charset "utf-8";

/* 共通 */
body {
    color: #7a7c7f;
    font-size: 18px;
}

.black_text {
    color: #171819;
}

.whtle_color {
    color: #fff;
}

.midasi_under_line {
    border-bottom: solid 1px #171819;
    padding-bottom: 15px;
    font-size: 20px;
}

.font_size_25 {
    font-size: 25px !important;
}

.width_65 .e-con-inner {
    width: 65% !important;
    /* width: 100% !important; */
    /* max-width: 900px !important; */
    margin: 80px auto !important;
    min-width: 650px;
}

.width_65.free_trial_wrap .e-con-inner {
    margin: 0 auto !important;
}

.width_65.bg_green .e-con-inner {
    margin: 110px auto !important;
}

.black_btn .elementor-button-icon {
    position: absolute;
    right: 20px;
    top: 50%;
    top: calc(50% - 7.5px);
    /* max-width: 330px; */
}

.column_3 {
    max-width: 330px!important;
    margin: 0 auto;
    width: 100%;
}

/* .black_btn a {
    max-width: 330px;
    margin: 0 auto;
} */

.black_btn.single a {
    position: relative;
    width: 100%;
    display: block;
    margin: 0 auto;
    max-width: 330px;
}

/* キャンペーンエリア */
.free_trial_wrap {
    background: url(../../images/course/common_course/action_area_back.svg) center center / 100% auto no-repeat;
    /* padding: 80px 17.5%; */
    padding: 80px 10px;
}

.free_trial_wrap .sec_inner {
    background-color: #fff;
    padding: 40px;
}

.midasi_line {
    text-align: center;
    margin-bottom: 40px;
}

.midasi_line_text {
    position: relative;
    display: inline-block;
}

/* .free_trial_wrap .midasi_line_text {
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(100% - 30px);
    margin: 0 auto;
} */

.midasi_line .midasi_line_text:before, .midasi_line .midasi_line_text:after {
    content: "";
    position: absolute;
    width: 30px;
    height: 3px;
    top: calc(50% - 1.5px);
    transform: translateY(-50%);
}

.midasi_line .mix_color:before, .midasi_line .mix_color:after {
    content: "";
    background: url(../../images/standard_title01_before.svg) center center / 100% 5px no-repeat;
}

.midasi_line .midasi_line_text:before {
    left: -60px;
}

.midasi_line .midasi_line_text:after {
    right: -60px;
}

.period_inner {
    color: #00beb5;
    border: solid 2px #00beb5;
    display: inline-block;
    margin: 0 auto;
    padding: 5px 16px;
    border-radius: 100px;
    font-size: 19px;
    font-weight: 600;
}

.period_wrap {
    text-align: center;
    margin-bottom: 20px;
    margin-top: -10px;
}

.period_midasi {
    font-size: 77%;
    padding-right: 10px;
    border-right: solid 1px;
}

.font_size_s {
    font-size: 73%;
    padding-left: 2px;
    padding-right: 4px;
}

.period {
    padding-left: 2px;
}

.perk_wrap {
    margin-top: 40px;
}

.perk_box {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.perk_3day_wrap, .perk_one_month_wrap {
    width: 49%;
}

.perk_3day_wrap {
    border: solid 3px #ea4e80;
}

.perk_one_month_wrap {
    border: solid 3px #606363;
}

.perk_midasi {
    text-align: center;
    color: #fff;
    padding: 10px 16px;
    font-size: 17px;
    font-weight: 600;
}

.perk_3day_wrap .perk_midasi {
    background-color: #ea4e80;
}

.perk_one_month_wrap .perk_midasi {
    background-color: #606363;
}

.font_size_m {
    font-size: 160%;
    padding-right: 2px;
}

.perk_box .img_wrap {
    padding: 25px 8%;
}

.perk_box img {
    max-width: 365px;
    margin: 0 auto;
    width: 100%;
}

.notes_text {
    text-align: right;
    margin-top: 16px;
    font-size: 15px;
}

.free_trial_btn.pink {
    background-color: #ea4e80;
    color: #fff;
    font-weight: 600;
    font-size: 150%;
    max-width: 530px;
    display: block;
    border-radius: 100px;
    filter: drop-shadow(3px 3px 3px rgba(90, 0, 30, 0.5));
    transition: all 0.2s ease;
    line-height: 1;
    padding: 30px 65px;
    position: relative;
    text-align: center;
    margin: 0 auto;
}

.free_trial_btn.pink:hover {
    background-color: #FF7DA2;
}

.btn_wrap.size_l {
    text-align: center;
    margin: 20px auto 0;
}

.free_trial_btn.pink .arrow {
    position: absolute;
    width: 25px;
    right: 33px;
}

/* メインビジュアル */
.green_text {
    color: #00af3c;
}

.obi span {
    background-color: #fff;
    padding: 12px 20px;
    display: inline-block;
    line-height: 1.4;
    font-size: 22px;
    font-weight: 600;
}

.obi_main span {
    font-size: 70%;
}

.obi_main h1 {
    background-color: #fff;
    padding: 12px 20px;
    display: inline-block;
    line-height: 1.4;
    font-weight: 600;
}

.mv_midasi_title {
    max-width: 600px !important;
    width: 45%;
    z-index: 1;
    min-width: 460px !important;
}

.mv_sub_title {
    margin-top: -23px;
    z-index: 1;
    filter: drop-shadow(2px 2px 2px rgba(90, 0, 30, 0.2));
}

.breadcrumb_wrap {
    display: flex;
    padding: 10px 10px 0 20px;
    position: absolute;
    top: 90px;
    z-index: 1;
    color: #fff;
    font-size: 13px;
}

.breadcrumb_link {
    color: #fff;
}

.mv_wrap {
    padding: 10px 0 !important;
}

.minecraft .mv_wrap {
    height: 36vw;
    min-height: 500px;
    max-height: 600px;
}

.minecraft .mv_wrap::before {
    content: "";
    display: inline-block;
    background: url(../../images/course/minecraft/mv_deco_green_01.png) no-repeat;
    background-size: contain;
    opacity: 1;
    width: 30vw;
    max-width: 390px;
}

.minecraft .mv_wrap::after {
    content: "";
    display: inline-block;
    background: url(../../images/course/minecraft/mv_deco_green_02.png) no-repeat;
    background-size: contain;
    opacity: 1;
    width: 44vw;
    height: 100%;
    background-position: bottom;
    position: absolute;
    bottom: 0;
    left: 0;
    max-width: 670px;
    min-width: 500px;
}

.mv_wrap .e-con-inner {
    width: 90% !important;
    max-width: none !important;
}

.free_trial_btn_yellow {
    width: 162px;
    position: fixed !important;
    right: 10px;
    top: 532px;
    z-index: 1;
}

.about_midasi {
    width: 80%;
    max-width: 327px !important;
}

/* コースについて */
.about_course_wrap .e-con-inner {
    width: 90% !important;
}

/* 特徴 */
.bg_green::before {
    content: "" !important;
    display: inline-block !important;
    background: url(../../images/course/common_course/bg_line_pattern.png);
    width: 100% !important;
    height: 100% !important;
    background-size: cover;
    background-repeat: repeat-y;
    background-position-y: 10%;
}

.point_midasi {
    width: 50%;
    margin: 0 auto;
    max-width: 369px !important;
    min-width: 369px !important;
}

.point_midasi img {
    width: 100%;
}

/* 授業料金・教室詳細 */
.midasi_line .green:before, .midasi_line .green:after {
    content: "";
    background: none;
    background-color: #00af3c;

}

/* よくある質問 */
.pa_sub_title {
    font-size: 64%;
    padding-bottom: 10px;
    display: block;
}

.fa_wrap .e-n-accordion-item-title-header {
    align-items: baseline;
}

.fa_wrap .e-n-accordion-item-title-header::before {
    content: "Q";
    color: #fff;
    font-size: 18px;
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 100px;
    font-weight: 600;
    display: inline-block;
    margin-right: 16px;
    margin-top: -2px;
    line-height: 1.3;
}

.minecraft .fa_wrap .e-n-accordion-item-title-header::before {
    background-color: #00af3c;
    border: solid 2px #00af3c;
}

.fa_wrap .e-n-accordion-item-title-text, .fa_wrap .fq_detail .elementor-widget-container p {
    width: calc(100% - 30px - 16px);
}

.fa_wrap .fq_detail .elementor-widget-container {
    display: flex;
    align-items: baseline;
}

.fa_wrap .fq_detail .elementor-widget-container::before {
    content: "A";
    font-size: 18px;
    background-color: #fff;
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 100px;
    font-weight: 600;
    display: inline-block;
    margin-right: 16px;
    margin-top: -2px;
    line-height: 1.3;
}

.minecraft .fa_wrap .fq_detail .elementor-widget-container::before {
    color: #00af3c;
    border: solid 2px #00af3c;
}

.fq_detail {
    border: none;
}

.fa_wrap .e-n-accordion-item-title {
    border: none !important;
    border-top: solid 1px #000 !important;
}

.fa_wrap .e-n-accordion-item:last-of-type {
    border-bottom: solid 1px #000 !important;
}

.fa_wrap .e-n-accordion-item-title {
    padding: 20px 10px !important;
}

.fa_wrap .fq_detail {
    padding: 0 10px 20px !important;
}

.fa_wrap .e-n-accordion-item:first-child {
    display: none;
}

@media (max-width:767px) {
    body {
        font-size: 16px;
    }

    .width_65 .e-con-inner {
        width: 100% !important;
        margin: 80px auto !important;
    }

    .mv_wrap .e-con-inner, .about_course_wrap .e-con-inner, .point_wrap .e-con-inner, .price_wrap .e-con-inner, .fa_wrap .e-con-inner {
        width: calc(100% - 30px) !important;
    }

    .mv_midasi_title {
        min-width: auto !important;
        width: 100%;
        max-width: 380px !important;
    }

    .minecraft .mv_wrap::after {
        min-width: auto;
        width: 90%;
    }

    .minecraft .mv_wrap::before {
        width: 69vw;
    }

    .free_trial_btn_yellow {
        top: auto;
        bottom: 6px;
        min-width: 102px !important;
        right: 7px;
        width: 30vw !important;
        max-width: 150px !important;
    }

    .minecraft .mv_wrap {
        min-height: auto;
        height: 55vh;
    }

    .point_midasi {
        min-width: auto !important;
        width: 90%;
    }

    .midasi_line .midasi_line_text:before {
        left: -45px;
    }

    .midasi_line .midasi_line_text:after {
        right: -45px;
    }

    .free_trial_wrap {
        padding: 80px 25px;
    }

    .perk_3day_wrap, .perk_one_month_wrap {
        width: 100%;
    }

    .perk_3day_wrap {
        margin-bottom: 20px;
    }

    .notes_text {
        text-align: left;
    }

    .width_65.bg_green .e-con-inner {
        margin: 80px auto !important;
    }

    .width_65 .e-con-inner {
        min-width: auto;
    }

    .font_size_25 {
        font-size: 20px !important;
    }

    .free_trial_wrap .sec_inner {
        padding: 40px 20px;
    }

    .period_midasi {
        display: block;
        border-right: none;
        padding-right: 0;
    }

    .midasi_line .midasi_line_text:before, .midasi_line .midasi_line_text:after {
        top: calc(50% - 0.5px);
    }

    .perk_midasi {
        font-size: 15px;
    }

    .free_trial_btn.pink .arrow {
        width: 17px;
        right: 20px;
    }

    .free_trial_btn.pink {
        padding: 23px 35px;
        font-size: 116%;
    }

    .period_inner {
        display: block;
    }

    .bg_green::before {
        background-size: 140%;
        background-repeat: repeat;
    }

}