@media screen and (max-width:1400px) {
    .main_body_item {
        margin-bottom: calc(120/1400*100vw)
    }
    .main_body_item:last-child {
        margin-bottom: calc(60/1400*100vw)
    }
    .main_intro_content {
        padding: calc(70/1400*100vw) calc(100/1400*100vw);
        max-width: calc(900/1400*100vw);
        margin-left: calc(-300/1400*100vw)
    }
    .reverse .main_intro_content {
        margin-right: calc(-300/1400*100vw)
    }
    .about_main_intro .main_intro_title h2 {
        font-size: calc(32/1400*100vw);
        line-height: calc(44/1400*100vw)
    }
    .about_main_intro .main_intro_title h2::after {
        width: calc(150/1400*100vw);
        height: calc(5/1400*100vw)
    }
    .main_intro_txt {
        padding-left: calc(25/1400*100vw);
        margin-top: calc(35/1400*100vw);
        font-size: calc(16/1400*100vw);
        line-height: calc(30/1400*100vw);
        padding-right: calc(45/1400*100vw)
    }
}

@media screen and (max-width:1200px) {
    .header_contain {
        padding: 15px calc(40/1200*100vw)
    }
    .header_logo a {
        font-size: calc(16.5/1200*100vw)
    }
    .contactadd_bottom_box .tel_number a,
    .header_logo h1 {
        font-size: calc(36/1200*100vw)
    }
    .c-intro_txt,
    .header_nav .nav_list a,
    .profile_item .head {
        font-size: calc(16/1200*100vw)
    }
    .header_nav .nav_list {
        gap: calc(40/1200*100vw)
    }
    .header_nav .contact_link a {
        padding: calc(15/1200*100vw) calc(45/1200*100vw)
    }
    .header_logo img {
        width: calc(200/1200*100vw);
        height: auto
    }
    .c-request_btn a,
    .view_more_btn a {
        font-size: calc(18/1200*100vw);
        height: calc(56/1200*100vw)
    }
    .view_more_btn a {
        width: calc(280/1200*100vw)
    }
    .about_top_intro_txt,
    .mv_sec .c-request_btn {
        margin-top: calc(40/1200*100vw)
    }
    .c-request_btn a {
        width: calc(320/1200*100vw)
    }
    .c-request_btn a::before {
        right: calc(20/1200*100vw);
        top: calc(20/1200*100vw);
        width: 6px;
        height: 6px;
        border-top: 2px solid #fff;
        border-right: 2px solid #fff
    }
    .c-request_btn a:hover::before {
        right: calc(10/1200*100vw)
    }
    .mv_sec {
        padding: 0 20px;
        padding-top: calc(250/1200*100vw)
    }
    .mv_main_txt {
        padding: calc(30/1200*100vw) calc(20/1200*100vw) calc(10/1200*100vw)
    }
    .mv_main_txt h2 {
        position: relative;
        font-size: calc(55/1200*100vw);
        padding-bottom: calc(15/1200*100vw)
    }
    .main_txt_mark {
        top: calc(-80/1200*100vw);
        right: calc(120/1200*100vw);
        width: calc(150/1200*100vw)
    }
    .mv_main_txt p {
        font-size: calc(14/1200*100vw);
        padding-top: calc(15/1200*100vw)
    }
    .mv_sec .mv_banner {
        margin-top: calc(30/1200*100vw);
        width: calc(400/1200*100vw)
    }
    .top_intro_sec {
        margin-top: calc(70/1200*100vw);
        padding: 0 20px
    }
    .c-intro_title h3,
    .flow_bottom_title h3 {
        font-size: calc(32/1200*100vw);
        line-height: calc(44/1200*100vw);
        margin-bottom: calc(30/1200*100vw)
    }
    .c-intro_title h3::after {
        bottom: -10px;
        width: calc(150/1200*100vw)
    }
    .c-intro_txt {
        line-height: calc(32/1200*100vw);
        margin-bottom: calc(120/1200*100vw)
    }
    .top_feature_grid {
        grid-gap: calc(60/1200*100vw) calc(40/1200*100vw)
    }
    .courses_grid,
    .sec_02_grid,
    .target_grade_item {
        grid-gap: calc(30/1200*100vw)
    }
    .top_feature_item {
        outline-offset: calc(-7/1200*100vw);
        padding: calc(15/1200*100vw)
    }
    .top_feature_img img {
        width: calc(65/1200*100vw)
    }
    .top_feature_content {
        width: 67%
    }
    .top_feature_title h4 {
        font-size: calc(20/1200*100vw);
        line-height: calc(32/1200*100vw)
    }
    .top_feature_txt p {
        font-size: calc(14/1200*100vw);
        line-height: calc(22/1200*100vw)
    }
    .intro_sec_02 {
        margin-top: calc(150/1200*100vw)
    }
    .intro_sec_02_title h2 {
        font-size: calc(32/1200*100vw);
        line-height: calc(46/1200*100vw);
        padding: calc(20/1200*100vw) 0;
        margin-bottom: calc(80/1200*100vw)
    }
    .intro_sec_02 .intro_txt {
        margin-bottom: calc(80/1200*100vw);
        font-size: calc(20/1200*100vw);
        line-height: calc(40/1200*100vw)
    }
    .sec_02_grid_item {
        outline-offset: calc(-7/1200*100vw);
        height: calc(275/1200*100vw);
        max-width: calc(280/1200*100vw);
        font-size: calc(18/1200*100vw);
        line-height: calc(26/1200*100vw);
        gap: calc(25/1200*100vw)
    }
    .head_intro_contain {
        padding: calc(80/1200*100vw) 0
    }
    .c-sec_tittle h2 {
        font-size: calc(50/1200*100vw);
        line-height: calc(60/1200*100vw);
        margin: calc(15/1200*100vw) auto
    }
    .c-sec_tittle .up_mark {
        width: calc(50/1200*100vw)
    }
    .c-sec_tittle .down_mark {
        width: calc(15/1200*100vw)
    }
    .teacher_intro_body {
        margin-top: calc(60/1200*100vw)
    }
    .teacher_content .c-intro_txt {
        margin-bottom: calc(40/1200*100vw)
    }
    .flow_item .flow_img::after,
    .teacher_name {
        font-size: calc(32/1200*100vw)
    }
    .flow_sec .sec_04_contain {
        padding-top: calc(80/1200*100vw)
    }
    .flow_intro_txt p {
        font-size: calc(18/1200*100vw);
        line-height: calc(40/1200*100vw);
        margin: calc(40/1200*100vw) auto
    }
    .flow_item {
        gap: calc(80/1200*100vw);
        margin-bottom: calc(115/1200*100vw)
    }
    .flow_item .flow_img {
        max-width: calc(300/1200*100vw)
    }
    .class_information .txt,
    .flow_content .flow_txt {
        font-size: calc(16/1200*100vw);
        line-height: calc(32/1200*100vw)
    }
    .flow_content::before {
        width: calc(5/1200*100vw);
        height: calc(150/1200*100vw);
        left: calc(-40/1200*100vw)
    }
    .flow_content::after {
        bottom: calc(-110/1200*100vw);
        left: calc(-55/1200*100vw);
        font-size: calc(34/1200*100vw)
    }
    .flow_item_02 .flow_content::after {
        bottom: calc(-80/1200*100vw)
    }
    .flow_item_03 .flow_content::after {
        bottom: calc(-95/1200*100vw)
    }
    .flow_item_04 .flow_content::after {
        bottom: calc(-150/1200*100vw)
    }
    .flow_btn_group {
        margin-top: calc(30/1200*100vw);
        gap: calc(40/1200*100vw)
    }
    .flow_btn_group .flow_link a {
        width: calc(250/1200*100vw);
        height: calc(56/1200*100vw);
        font-size: calc(18/1200*100vw);
        line-height: calc(34/1200*100vw)
    }
    .flow_bottom_txt p,
    .schoollist_body .school_title {
        font-size: calc(20/1200*100vw);
        line-height: calc(36/1200*100vw)
    }
    .banner_sec {
        margin: calc(80/1200*100vw) auto auto
    }
    .banner_link {
        bottom: calc(40/1200*100vw)
    }
    .contactadd_box {
        padding: calc(80/1200*100vw) calc(40/1200*100vw)
    }
    .contactadd_title h3 {
        font-size: calc(32/1200*100vw);
        line-height: calc(40/1200*100vw)
    }
    .contactadd_title h3::after {
        width: calc(100/1200*100vw);
        bottom: calc(-30/1200*100vw)
    }
    .contactadd_content {
        margin-top: calc(100/1200*100vw)
    }
    .contactadd_flex .head_txt {
        top: calc(-50/1200*100vw);
        left: calc(-35/1200*100vw);
        width: calc(100/1200*100vw);
        height: calc(100/1200*100vw);
        font-size: calc(12/1200*100vw)
    }
    .contactadd_flex_main {
        height: calc(190/1200*100vw)
    }
    .contactadd_flex_title h4 {
        font-size: calc(30/1200*100vw);
        line-height: calc(30/1200*100vw);
        padding: calc(20/1200*100vw) 0
    }
    .contactadd_flex_txt p {
        font-size: calc(16/1200*100vw);
        margin: calc(20/1200*100vw) auto
    }
    .contactadd_btn_group {
        margin: calc(100/1200*100vw) auto;
        max-width: calc(650/1200*100vw);
        gap: calc(40/1200*100vw)
    }
    .contactadd_bottom_box {
        max-width: calc(700/1200*100vw)
    }
    .blog_date,
    .contactadd_bottom_box .top_txt p,
    .privacy_check p {
        font-size: calc(18/1200*100vw)
    }
    .contactadd_bottom_box .down_txt p {
        font-size: calc(14/1200*100vw)
    }
    .contactadd_bottom_box .tel_number {
        margin: calc(10/1200*100vw) auto
    }
    .mv_sub_txt {
        padding: calc(200/1200*100vw) 20px calc(100/1200*100vw)
    }
    .mv_sub_txt h2 {
        font-size: calc(50/1200*100vw);
        line-height: calc(44/1200*100vw)
    }
    .about_sec_01,
    .class_list_linkbox,
    .news_content img {
        margin: calc(60/1200*100vw) auto
    }
    .about_top_intro {
        padding: calc(60/1200*100vw) 20px
    }
    .about_top_intro .head h2,
    .class_item_title h3,
    .question p {
        font-size: calc(32/1200*100vw);
        line-height: calc(44/1200*100vw)
    }
    .about_top_intro_txt p {
        font-size: calc(20/1200*100vw);
        line-height: calc(35/1200*100vw)
    }
    .qa_sec {
        margin-top: calc(80/1200*100vw);
        padding: calc(80/1200*100vw)
    }
    .qa_contain {
        padding: calc(60/1200*100vw) 0
    }
    .qa_body {
        margin-top: calc(60/1200*100vw);
        padding: 0 calc(100/1200*100vw)
    }
    .qa_item {
        padding: calc(30/1200*100vw) 0
    }
    .answer p::before,
    .question p::before {
        min-width: calc(70/1200*100vw);
        max-width: calc(70/1200*100vw);
        max-height: calc(70/1200*100vw);
        min-height: calc(70/1200*100vw);
        margin-right: calc(30/1200*100vw)
    }
    .answer p {
        font-size: calc(20/1200*100vw);
        line-height: calc(32/1200*100vw);
        margin-top: calc(40/1200*100vw)
    }
    .class_information .head,
    .class_list_link a,
    .contact_top_intro .top_txt {
        font-size: calc(18/1200*100vw);
        line-height: calc(32/1200*100vw)
    }
    .class_list,
    .courses_sec,
    .profile_sec {
        margin: calc(80/1200*100vw) auto
    }
    .profile_sec_body {
        margin: calc(60/1200*100vw) auto calc(80/1200*100vw)
    }
    .information_row,
    .target_grade_item {
        margin-bottom: calc(20/1200*100vw)
    }
    .class_list_link a {
        width: calc(200/1200*100vw);
        height: calc(55/1200*100vw)
    }
    .class_list_body .class_item {
        padding: calc(50/1200*100vw)
    }
    .class_list_body .class_item_haed {
        gap: calc(30/1200*100vw);
        padding-bottom: calc(20/1200*100vw)
    }
    .class_item_more.view_more_btn {
        margin: auto 0
    }
    .class_item_box {
        gap: calc(30/1200*100vw);
        margin-top: calc(30/1200*100vw)
    }
    .class_hours_box,
    .mv_sub_txt p,
    .target_grade_box,
    .teachers .teacher_txt {
        margin-top: calc(20/1200*100vw)
    }
    .class_information,
    .class_item_map {
        width: 50%
    }
    .class_item_map iframe {
        height: calc(400/1200*100vw)
    }
    .more_infor {
        padding-top: calc(30/1200*100vw)
    }
    .target_grade_head {
        font-size: calc(16/1200*100vw);
        line-height: calc(32/1200*100vw);
        width: calc(250/1200*100vw);
        height: calc(70/1200*100vw)
    }
    .target_grade_txt {
        font-size: calc(16/1200*100vw);
        line-height: calc(32/1200*100vw);
        height: 98%
    }
    .class_hours_box {
        padding: calc(40/1200*100vw) 0
    }
    .class_hours_txt {
        font-size: calc(20/1200*100vw);
        line-height: calc(40/1200*100vw)
    }
    .mv_sub_txt p {
        font-size: calc(14/1200*100vw)
    }
    .contact_sec {
        margin: calc(120/1200*100vw) auto
    }
    .contact_top_intro .bottom_txt {
        font-size: calc(14/1200*100vw);
        line-height: calc(32/1200*100vw)
    }
    .contact_box {
        margin-bottom: calc(120/1200*100vw)
    }
    .contact_item .item_head {
        max-width: calc(200/1200*100vw);
        font-size: calc(18/1200*100vw);
        margin-right: calc(50/1200*100vw)
    }
    .contact_item .item_content,
    .news_content iframe {
        width: 100%
    }
    .contact_item input {
        width: calc(100% - 20px);
        height: calc(35/1200*100vw);
        font-size: calc(18/1200*100vw);
        padding: calc(10/1200*100vw) 10px
    }
    .contact_item select {
        height: calc(57/1200*100vw);
        font-size: calc(16/1200*100vw);
        padding: calc(10/1200*100vw) 10px
    }
    .contact_submit {
        margin: calc(50/1200*100vw) auto
    }
    .contact_submit button {
        width: calc(320/1200*100vw);
        height: calc(60/1200*100vw);
        font-size: calc(20/1200*100vw)
    }
    .courses_body {
        margin-top: calc(60/1200*100vw);
        padding: calc(40/1200*100vw)
    }
    .courses_item {
        padding: calc(20/1200*100vw) calc(40/1200*100vw)
    }
    .courses_item .content p {
        margin: calc(15/1200*100vw) auto;
        font-size: calc(16/1200*100vw)
    }
    .courses_item img {
        width: calc(25/1200*100vw)
    }
    .courses_item .head {
        font-size: calc(18/1200*100vw);
        padding: calc(10/1200*100vw)
    }
    .p-bloglist {
        margin-top: calc(100/1200*100vw);
        margin-bottom: calc(100/1200*100vw)
    }
    .p-bloglist_head h2 {
        font-size: calc(26/1200*100vw);
        margin-bottom: calc(25/1200*100vw)
    }
    .filters {
        gap: calc(15/1200*100vw)
    }
    .filters li {
        width: calc(220/1200*100vw);
        height: calc(55/1200*100vw);
        font-size: calc(15/1200*100vw);
        line-height: calc(30/1200*100vw)
    }
    .targets {
        margin-top: calc(80/1200*100vw);
        grid-gap: calc(60/1200*100vw) calc(50/1200*100vw)
    }
    .target .blog_title h3 {
        font-size: calc(20/1200*100vw);
        line-height: calc(30/1200*100vw);
        margin: calc(15/1200*100vw) auto calc(10/1200*100vw)
    }
    .blog_categories {
        padding: calc(7/1200*100vw) calc(15/1200*100vw);
        font-size: calc(11/1200*100vw);
        line-height: calc(10/1200*100vw)
    }
    .news_detail_body .news_title h2 {
        font-size: calc(26/1200*100vw);
        line-height: calc(54/1200*100vw);
        padding-left: calc(15/1200*100vw)
    }
    .news_detail_body .news_title h2::before {
        height: calc(35/1200*100vw);
        top: calc(12/1200*100vw)
    }
    .news_content {
        font-size: calc(15/1200*100vw);
        line-height: calc(44/1200*100vw);
        margin-top: calc(50/1200*100vw)
    }
    .links_box {
        margin: calc(80/1200*100vw) auto;
        gap: calc(40/1200*100vw)
    }
    .links_box .links a {
        width: calc(270/1200*100vw);
        height: calc(53/1200*100vw);
        font-size: calc(16/1200*100vw);
        line-height: calc(20/1200*100vw)
    }
    .links_box .links_pre a::after {
        width: calc(15/1200*100vw);
        height: calc(15/1200*100vw);
        left: calc(40/1200*100vw)
    }
    .links_box .links_next a::after {
        width: calc(15/1200*100vw);
        height: calc(15/1200*100vw);
        right: calc(40/1200*100vw)
    }
    .main_bg {
        margin-top: calc(95/1200*100vw)
    }
    .movie {
        margin: calc(80/1200*100vw) auto;
        width: 80%;
    }
    .blog_img img {
        height: calc(200/1200*100vw)
    }
    .schoollist {
        margin: calc(100/1200*100vw) auto
    }
    .schoollist_body,
    .teachers .teachers_box {
        margin-top: calc(80/1200*100vw)
    }
    .schoollist_body .list_grid {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: calc(40/1200*100vw)
    }
    .schoollist_body .school_info {
        padding: calc(30/1200*100vw) calc(20/1200*100vw)
    }
    .schoollist_body .school_address {
        font-size: calc(14/1200*100vw);
        line-height: calc(28/1200*100vw);
        margin-top: calc(10/1200*100vw)
    }
    .teachers {
        margin: calc(50/1200*100vw)
    }
    .teachers_box .head_teacher {
        gap: calc(80/1200*100vw);
        margin-top: calc(30/1200*100vw)
    }
    .teachers_box .head_teacher_img {
        max-width: calc(350/1200*100vw)
    }
    .teachers .head_infor .title,
    .teachers .teacher_txt .title {
        font-size: calc(22/1200*100vw);
        line-height: calc(32/1200*100vw)
    }
    .teachers .head_infor .head_name {
        margin: calc(20/1200*100vw) auto;
        font-size: calc(42/1200*100vw)
    }
    .teachers .head_infor .comment,
    .teachers .teacher_txt .comment {
        font-size: calc(16/1200*100vw);
        line-height: calc(26/1200*100vw)
    }
    .teachers .teachers_grid {
        gap: calc(60/1200*100vw)
    }
    .teachers .teacher_txt .name {
        margin: calc(10/1200*100vw) auto;
        font-size: calc(32/1200*100vw)
    }
}

@media screen and (max-width:768px) {
    .flow_content::after,
    .flow_item_02 .flow_content::after,
    .flow_item_03 .flow_content::after,
    .flow_item_04 .flow_content::after {
        bottom: calc(-100/768*100vw)
    }
    .about_main_intro .main_intro_title h2::after,
    .header_logo img {
        width: calc(300/768*100vw)
    }
    .flow_item .flow_img,
    .news_info,
    .page_max_width,
    .page_small_width,
    .page_width,
    .teachers_box .head_teacher_img {
        max-width: 100%
    }
    .pc {
        display: none
    }
    .sp {
        display: block
    }
    .loading .loding_img img {
        width: calc(150/1200*100vw);
        height: auto
    }
    .header_contain {
        padding: 10px
    }
    .header_bg {
        background-color: #fff
    }
    .header_logo a {
        font-size: 12px
    }
    .header_logo h1 {
        font-size: 26px
    }
    .header_logo img {
        height: auto
    }
    .mv_main_txt {
        position: relative;
        display: inline-block;
        padding: 30px 20px 10px
    }
    .mv_sec .c-request_btn {
        margin-top: calc(100/768*100vw);
        display: flex;
        align-items: center;
        justify-content: center;
        margin-left: 0;
    }
    .c-request_btn a {
        font-size: calc(32/768*100vw);
        border-radius: 50px;
        width: calc(600/768*100vw);
        height: calc(110/768*100vw)
    }
    .c-request_btn a::before {
        right: calc(50/768*100vw);
        top: calc(46/768*100vw);
        width: calc(12/768*100vw);
        height: calc(12/768*100vw)
    }
    .c-request_btn a:hover::before {
        right: calc(40/768*100vw)
    }
    .main_bg {
        background-image: url(../image/top/main_bg_sp.jpg);
        margin-top: 72px
    }
    .mv_sec {
        padding: 0 20px;
        padding-top: calc(200/768*100vw)
    }
    .mv_main_txt {
        background-color: transparent;
        padding: calc(10/768*100vw)
    }
    .mv_main_txt h2 {
        font-size: calc(55/768*100vw);
        text-shadow: 3px 2px 0 #fff;
        line-height: calc(100/768*100vw);
        padding-bottom: calc(25/768*100vw)
    }
    .main_txt_mark {
        top: unset;
        right: calc(-60/768*100vw);
        width: calc(200/768*100vw);
        bottom: calc(-155/768*100vw)
    }
    .mv_main_txt p {
        font-size: calc(22/768*100vw);
        padding-top: calc(20/768*100vw)
    }
    .mv_sec .mv_banner {
        margin: auto;
        margin-top: calc(40/768*100vw);
        width: 90%;
        height: auto
    }
    .top_intro_sec {
        margin-top: calc(80/768*100vw);
        padding: 0 20px
    }
    .c-intro_txt,
    .teacher_content .c-intro_title h3 {
        margin-top: calc(50/768*100vw)
    }
    .c-intro_title h3 {
        position: relative;
        font-size: calc(40/768*100vw);
        line-height: calc(60/768*100vw);
        margin-bottom: calc(40/768*100vw);
        padding: calc(0/768*100vw) 0
    }
    .c-intro_txt,
    .intro_sec_02 .intro_txt,
    .intro_sec_02_title h2 {
        margin-bottom: calc(120/768*100vw)
    }
    .c-intro_txt {
        font-size: calc(28/768*100vw);
        line-height: calc(50/768*100vw)
    }
    .top_feature_grid {
        grid-template-columns: 1fr;
        grid-gap: calc(120/768*100vw)
    }
    .top_feature_item {
        outline-offset: calc(-10/768*100vw);
        padding: calc(30/768*100vw);
        flex-direction: column;
        justify-content: center;
        gap: calc(60/768*100vw)
    }
    .top_feature_img {
        width: 50%;
        display: flex;
        align-items: center;
        justify-content: center
    }
    .top_feature_img img {
        width: calc(170/768*100vw);
        height: auto
    }
    .top_feature_content {
        width: 95%
    }
    .top_feature_title h4 {
        font-size: calc(40/768*100vw);
        line-height: calc(32/768*100vw);
        letter-spacing: .04em;
        color: #fff
    }
    .top_feature_txt p {
        color: #fff;
        font-size: calc(28/768*100vw);
        line-height: calc(44/768*100vw);
        letter-spacing: .04em;
        margin-top: calc(30/768*100vw);
        padding-right: 5px
    }
    .intro_sec_02 {
        margin-top: calc(200/768*100vw);
        padding: 0 20px
    }
    .intro_sec_02_title h2 {
        font-size: calc(42/768*100vw);
        line-height: calc(60/768*100vw);
        padding: calc(40/768*100vw) 0
    }
    .intro_sec_02 .intro_txt {
        font-size: calc(34/768*100vw);
        line-height: calc(70/768*100vw)
    }
    .sec_02_grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-gap: calc(20/768*100vw);
        align-items: center
    }
    .sec_02_grid_item {
        outline-offset: calc(-14/768*100vw);
        height: calc(355/768*100vw);
        max-width: 100%;
        font-size: calc(26/768*100vw);
        line-height: calc(36/768*100vw);
        gap: calc(30/768*100vw)
    }
    .sec_02_grid_item .item_img {
        width: calc(90/768*100vw);
        max-width: 35%
    }
    .sec_02_grid_item .item_img.item_img_02 {
        width: calc(60/768*100vw)
    }
    .view_more_btn {
        margin: calc(80/768*100vw) auto calc(150/768*100vw);
        text-align: center
    }
    .class_hours_box,
    .head_intro_contain {
        padding: calc(80/768*100vw) 0
    }
    .c-sec_tittle h2 {
        font-size: calc(60/768*100vw);
        line-height: calc(75/768*100vw);
        margin: calc(20/768*100vw) auto
    }
    .c-sec_tittle .up_mark {
        width: calc(80/768*100vw)
    }
    .c-sec_tittle .down_mark {
        width: calc(20/768*100vw)
    }
    .teacher_intro_body {
        margin-top: calc(100/768*100vw);
        flex-direction: column;
        align-items: center;
        gap: 10%
    }
    .flow_body,
    .flow_item {
        flex-direction: column
    }
    .teacher_img {
        width: 70%
    }
    .class_information,
    .class_item_map,
    .contactadd_flex_img,
    .flow_content,
    .main_intro_img,
    .teacher_content {
        width: 100%
    }
    .c-intro_title h3::after {
        width: calc(250/768*100vw)
    }
    .main_body_item:last-child,
    .teacher_content .c-intro_txt {
        margin-bottom: calc(60/768*100vw)
    }
    .flow_item .flow_img::after,
    .teacher_name {
        font-size: calc(40/768*100vw)
    }
    .flow_sec .sec_04_contain {
        padding-top: calc(80/768*100vw)
    }
    .flow_bg {
        background-image: url(../image/top/flow_bg.png);
        background-repeat: repeat;
        background-size: contain
    }
    .flow_intro_txt p {
        font-size: calc(32/768*100vw);
        line-height: calc(56/768*100vw);
        margin: calc(40/768*100vw) auto
    }
    .flow_body {
        display: flex
    }
    .flow_item {
        gap: calc(40/768*100vw);
        margin-bottom: calc(120/768*100vw);
        margin-left: calc(100/768*100vw)
    }
    .contactadd_flex,
    .flow_btn_group,
    .main_body_item.reverse {
        flex-direction: column
    }
    .flow_content .flow_txt {
        font-size: calc(28/768*100vw);
        line-height: calc(50/768*100vw)
    }
    .flow_content::before {
        width: 5px;
        height: calc(470/768*100vw);
        left: calc(-80/768*100vw)
    }
    .flow_item_02 .flow_content::before {
        height: calc(600/768*100vw);
        left: calc(-80/768*100vw)
    }
    .flow_item_03 .flow_content::before {
        height: calc(450/768*100vw);
        left: calc(-80/768*100vw)
    }
    .flow_item_04 .flow_content::before {
        height: calc(200/768*100vw);
        left: calc(-80/768*100vw)
    }
    .flow_content::after {
        left: calc(-110/768*100vw);
        font-size: calc(68/768*100vw)
    }
    .flow_item_05 .flow_content::after {
        content: ""
    }
    .flow_btn_group {
        margin-top: 30px;
        gap: 40px
    }
    .flow_btn_group .flow_link a {
        width: calc(600/768*100vw);
        height: calc(110/768*100vw);
        font-size: calc(32/768*100vw);
        line-height: calc(48/768*100vw)
    }
    .flow_bottom_title h3 {
        font-size: calc(40/768*100vw);
        line-height: calc(66/768*100vw);
        margin-bottom: calc(50/768*100vw)
    }
    .flow_bottom_txt p {
        font-size: calc(32/768*100vw);
        line-height: calc(60/768*100vw)
    }
    .contactadd_box {
        padding: calc(120/768*100vw) calc(80/768*100vw)
    }
    .contactadd_title h3 {
        font-size: calc(40/768*100vw);
        line-height: 1.8
    }
    .contactadd_title h3::after {
        width: calc(100/768*100vw);
        bottom: calc(-40/768*100vw)
    }
    .contactadd_content {
        margin-top: calc(120/768*100vw)
    }
    .contactadd_flex_main {
        width: 92%;
        padding: 5%;
        height: auto
    }
    .contactadd_flex_title h4 {
        font-size: calc(44/768*100vw);
        line-height: calc(60/768*100vw)
    }
    .contactadd_bottom_box .top_txt p,
    .contactadd_flex_txt p,
    .profile_item .context {
        font-size: calc(28/768*100vw)
    }
    .contactadd_flex_txt p {
        line-height: 1.7
    }
    .footer_nav ul a,
    .news_title h2,
    .privacy_check p {
        font-size: calc(32/768*100vw)
    }
    .contactadd_btn_group {
        margin: calc(80/768*100vw) auto;
        flex-direction: column
    }
    .contactadd_bottom_box .tel_number a {
        font-size: calc(60/768*100vw)
    }
    .contactadd_bottom_box .down_txt p {
        font-size: calc(22/768*100vw);
        line-height: 1.7
    }
    .contactadd_flex .head_txt {
        top: calc(-80/768*100vw);
        left: calc(-60/768*100vw);
        width: calc(180/768*100vw);
        height: calc(180/768*100vw);
        font-size: calc(26/768*100vw)
    }
    .news_sec_contain {
        max-width: 800px;
        margin: calc(120/768*100vw) auto;
        padding: 0 20px
    }
    .news_sec_body,
    .schoollist_body {
        margin-top: calc(80/768*100vw)
    }
    .news_sec_body .news_item {
        padding: calc(20/768*100vw) calc(30/768*100vw);
        flex-direction: column;
        align-items: flex-start
    }
    .news_item .news_date {
        max-width: calc(200/768*100vw);
        min-width: calc(150/768*100vw);
        font-size: calc(28/768*100vw)
    }
    .news_category {
        padding: calc(10/768*100vw) calc(20/768*100vw);
        font-size: calc(26/768*100vw)
    }
    .news_title h2 {
        margin-top: calc(20/768*100vw);
        margin-left: 0
    }
    .footer {
        margin-bottom: 65px
    }
    .footer.footer_contact {
        margin-bottom: 0
    }
    .footer_contain {
        padding: calc(120/768*100vw) 20px calc(60/768*100vw)
    }
    .footer_nav ul {
        flex-direction: column;
        gap: calc(40/768*100vw)
    }
    .footer_nav ul li {
        display: flex;
        align-items: center;
        justify-content: center
    }
    .view_more_btn a {
        width: calc(500/768*100vw);
        height: calc(100/768*100vw);
        font-size: calc(34/768*100vw);
        line-height: calc(48/768*100vw)
    }
    .c-copyrigth p,
    .footer_info p {
        line-height: calc(42/768*100vw);
        text-align: center;
        font-size: calc(28/768*100vw);
        color: #fff;
        letter-spacing: .03em
    }
    .footer_logo {
        max-width: 250px;
        margin: auto
    }
    .footer_info p {
        margin: calc(42/768*100vw) auto
    }
    .c-copyrigth p {
        font-weight: 500;
        border-top: 1px solid #fff;
        padding: calc(30/768*100vw)
    }
    .contact_item input,
    .contact_item select {
        padding: calc(15/768*100vw) 10px;
        font-size: calc(32/768*100vw)
    }
    #page-top {
        bottom: calc(235/768*100vw)
    }
    .c-page-top_btn {
        width: 45px;
        height: 45px
    }
    .fixed_contact {
        position: fixed;
        z-index: 100;
        bottom: 0;
        left: 0;
        width: 96%;
        background: linear-gradient(180deg, #ff7133 0%, #d74100 100%);
        padding: 2%;
        display: none;
        transition: .35s
    }
    .fixed_contact_box {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 2%
    }
    .fixed_contact_btn {
        width: 48%
    }
    .fixed_contact_btn a {
        border-radius: 5px;
        border: 1px solid #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 50px;
        color: #fff;
        font-size: 14px
    }
    .show {
        display: flex
    }
    .courses_grid,
    .schoollist_body .list_grid,
    .teachers .teachers_grid {
        display: grid;
        grid-template-columns: 1fr
    }
    .mv_sub {
        background-image: url(../image/about/aboutf_mv_sp.png)
    }
    .mv_sub_txt {
        padding: calc(300/768*100vw) 38px calc(150/768*100vw)
    }
   .contact_page .mv_sub_txt {
        padding: calc(300/768*70vw) 20px calc(150/768*30vw)
   }
    .mv_sub_txt h2 {
        font-size: calc(50/768*100vw);
        line-height: calc(50/768*100vw)
    }
    .about_sec_01 {
        margin: calc(0/768*100vw) auto calc(60/768*100vw)
    }
    .about_top_intro {
        padding: calc(120/768*100vw) 20px
    }
    .about_main_intro .main_intro_title h2,
    .about_top_intro .head h2 {
        font-size: calc(40/768*100vw);
        line-height: calc(60/768*100vw)
    }
    .about_top_intro_txt {
        margin-top: calc(60/768*100vw)
    }
    .about_top_intro_txt p {
        font-size: calc(32/768*100vw);
        line-height: calc(70/768*100vw)
    }
    .about_main_intro {
        padding: 0
    }
    .main_body_item {
        flex-direction: column;
        margin-bottom: calc(120/768*100vw)
    }
    .main_intro_content {
        max-width: none;
        padding: calc(80/768*100vw) calc(40/768*100vw);
        margin: 0 20px;
        margin-top: calc(-120/768*100vw)
    }
    .main_intro_txt,
    .reverse .main_intro_txt {
        padding-right: 0
    }
    .reverse .main_intro_content {
        margin-left: 20px;
        margin-right: 20px
    }
    .main_intro_txt {
        padding-left: calc(40/768*100vw);
        margin-top: calc(60/768*100vw);
        font-size: calc(28/768*100vw);
        line-height: calc(52/768*100vw)
    }
    .qa_sec {
        margin-top: calc(80/768*100vw);
        padding: calc(40/768*100vw)
    }
    .answer p,
    .qa_body {
        margin-top: calc(60/768*100vw)
    }
    .qa_contain {
        padding: calc(60/768*100vw) 0
    }
    .qa_body {
        padding: 0 calc(30/768*100vw)
    }
    .qa_item {
        padding: calc(50/768*100vw) 0
    }
    .question p {
        font-size: calc(40/768*100vw);
        line-height: calc(56/768*100vw)
    }
    .answer p::before,
    .question p::before {
        min-width: calc(70/768*100vw);
        max-width: calc(70/768*100vw);
        max-height: calc(70/768*100vw);
        min-height: calc(70/768*100vw);
        margin-right: calc(30/768*100vw)
    }
    .answer p {
        font-size: calc(28/768*100vw);
        line-height: calc(48/768*100vw)
    }
    .class_list_link a,
    .profile_item .head,
    .target_grade_head {
        font-size: calc(32/768*100vw)
    }
    .courses_sec,
    .profile_sec {
        margin: calc(80/768*100vw) auto;
        padding: 0 20px
    }
    .profile_sec_body {
        margin: calc(60/768*100vw) auto calc(80/768*100vw)
    }
    .profile_item {
        padding: calc(40/768*100vw) 0;
        flex-direction: column;
        align-items: flex-start;
        gap: calc(20/768*100vw);
        font-weight: 500
    }
    .profile_item .head {
        max-width: 100%;
        width: 100%;
        text-align: left
    }
    .map_contain iframe {
        width: 100%;
        height: calc(700/768*100vw)
    }
    .class_page .mv_sub {
        background-image: url(../image/class/class_bg_sp.png)
    }
    .class_detail_page .mv_sub {
        background-image: url(../image/class/class_detail_bg_sp.png)
    }
    .class_list {
        padding: 0 20px;
        margin: calc(80/768*100vw) auto calc(16/768*100vw)
    }
    .class_list_linkbox {
        margin: calc(160/768*100vw) auto;
        justify-content: center;
        gap: calc(20/768*100vw)
    }
    .information_row,
    .privacy_content .p-top_text,
    .target_grade_item {
        margin-bottom: calc(40/768*100vw)
    }
    .class_list_link a {
        width: calc(330/768*100vw);
        height: calc(100/768*100vw);
        line-height: calc(42/768*100vw)
    }
    .class_list_body .class_item {
        padding: calc(40/768*100vw);
        padding-top: calc(80/768*100vw);
        box-shadow: 0 0 15px rgba(0, 0, 0, .05)
    }
    .class_item_title h3 {
        font-size: calc(40/768*100vw);
        line-height: calc(55/768*100vw)
    }
    .class_list_body .class_item_haed {
        gap: calc(60/768*100vw);
        padding-bottom: calc(40/768*100vw);
        flex-direction: column
    }
    .class_item_box {
        flex-direction: column;
        gap: calc(60/768*100vw);
        margin-top: calc(60/768*100vw)
    }
    .class_hours_box,
    .mv_sub_txt p,
    .target_grade_box,
    .teachers .teacher_txt {
        margin-top: calc(40/768*100vw)
    }
    .class_item_map iframe {
        width: 100%;
        height: calc(600/768*100vw)
    }
    .class_information .head,
    .contact_top_intro .top_txt {
        font-size: calc(32/768*100vw);
        line-height: calc(52/768*100vw)
    }
    .class_information .txt,
    .target_grade_head,
    .target_grade_txt {
        line-height: calc(48/768*100vw)
    }
    .class_information .txt {
        font-size: calc(28/768*100vw)
    }
    .more_infor {
        padding-top: calc(60/768*100vw)
    }
    .target_grade_item {
        grid-template-columns: 1fr;
        grid-gap: 0px
    }
    .target_grade_head {
        width: 100%;
        height: auto;
        outline: 0;
        outline-offset: 0;
        padding: calc(20/768*100vw) 0;
        border: none
    }
    .courses_item .content p,
    .mv_sub_txt p,
    .target_grade_txt {
        font-size: calc(28/768*100vw)
    }
    .target_grade_txt {
        height: auto;
        padding: calc(30/768*100vw) 0
    }
    .class_hours_txt {
        font-size: calc(32/768*100vw);
        line-height: calc(65/768*100vw)
    }
    .blog_date,
    .complete_txt {
        font-size: calc(30/768*100vw)
    }
    .contact_page .mv_sub {
        background-image: url(../image//contact/contact_mv_sp.png)
    }
    .mv_sub_txt p {
        line-height: calc(42/768*100vw)
    }
    .contact_sec {
        margin: calc(120/768*100vw) auto
    }
    .contact_top_intro .bottom_txt {
        font-size: calc(26/768*100vw);
        margin-top: 5px;
        line-height: calc(42/768*100vw)
    }
    .contact_box {
        margin-bottom: calc(160/768*100vw)
    }
    .contact_box .contact_item {
        flex-direction: column;
        align-items: flex-start
    }
    .red {
        margin-left: calc(15/768*100vw)
    }
    .contact_submit,
    .privacy_sec,
    .top_page_link {
        margin: calc(80/768*100vw) auto
    }
    .contact_item .item_head {
        max-width: 100%;
        font-size: calc(32/768*100vw);
        line-height: calc(60/768*100vw);
        margin-right: 0;
        text-align: left
    }
    .contact_item input {
        width: calc(100% - 20px);
        height: calc(70/768*100vw)
    }
    .contact_item select {
        height: calc(104/768*100vw);
        width: 100%
    }
    .mw_wp_form .privacy_check .error {
        left: 0
    }
    .contact_submit {
        flex-direction: column;
        align-items: center
    }
    .contact_submit button {
        width: calc(520/768*100vw);
        height: calc(110/768*100vw);
        font-size: calc(40/768*100vw)
    }
    .complete_txt {
        line-height: calc(55/768*100vw)
    }
    .top_page_link a {
        width: calc(500/768*100vw);
        height: calc(100/768*100vw);
        font-size: calc(32/768*100vw);
        line-height: calc(48/768*100vw)
    }
    .courses_body {
        margin-top: calc(60/768*100vw);
        padding: calc(40/768*100vw);
        background-color: #000037
    }
    .courses_grid {
        grid-gap: calc(40/768*100vw);
        align-items: center
    }
    .courses_item {
        background: #fff;
        padding: calc(40/768*100vw)
    }
    .courses_item .content p {
        display: flex;
        align-items: center;
        gap: 5px;
        margin: calc(30/768*100vw) auto;
        color: #000037
    }
    .courses_item img {
        width: calc(50/768*100vw);
        height: auto
    }
    .courses_item .head {
        background: #000037;
        text-align: center;
        font-size: calc(32/768*100vw);
        font-weight: 500;
        color: #fff;
        padding: calc(20/768*100vw);
        letter-spacing: .03em
    }
    .privacy_page .mv_sub {
        background-image: url(../image/privacy/pp_mv_sp.png);
        background-position: right
    }
    .privacy_title h2 {
        font-size: calc(40/768*100vw);
        line-height: calc(60/768*100vw);
        margin-bottom: calc(60/768*100vw)
    }
    .privacy_content .row_head {
        margin-top: calc(30/768*100vw)
    }
    .privacy_content p {
        font-size: calc(28/768*100vw);
        line-height: calc(37/768*100vw)
    }
    .news_page .mv_sub {
        background-image: url(../image/news/main_bg_sp.jpg)
    }
    .p-bloglist {
        margin: calc(120/768*100vw) auto;
        padding: 0 calc(40/768*100vw)
    }
    .filters {
        gap: calc(20/768*100vw)
    }
    .filters li {
        width: calc(210/768*100vw);
        height: calc(60/768*100vw);
        font-size: calc(26/768*100vw);
        line-height: calc(34/768*100vw)
    }
    .targets {
        margin-top: calc(60/768*100vw);
        grid-gap: calc(60/768*100vw);
        grid-template-columns: repeat(1, 1fr)
    }
    .blog_date {
        letter-spacing: .08em
    }
    .target .blog_title h3 {
        font-size: calc(34/768*100vw);
        line-height: calc(52/768*100vw);
        margin: calc(20/768*100vw) auto calc(10/768*100vw)
    }
    .blog_categories {
        padding: calc(15/768*100vw) calc(30/768*100vw);
        font-size: calc(22/768*100vw);
        line-height: calc(20/768*100vw)
    }
    .news_detail_body .news_title h2 {
        font-weight: 700;
        font-size: calc(34/768*100vw);
        letter-spacing: .08em;
        line-height: calc(56/768*100vw);
        text-align: left;
        color: #000137;
        padding-left: calc(20/768*100vw);
        border-bottom: 1px solid #707070;
        position: relative;
        margin: auto
    }
    .news_detail_body .news_title h2::before {
        position: absolute;
        content: "";
        width: calc(4/768*100vw);
        height: 90%;
        left: 0;
        background: #000037;
        top: 5%
    }
    .news_content {
        font-weight: 500;
        font-size: calc(28/768*100vw);
        letter-spacing: .13em;
        line-height: calc(52/768*100vw);
        text-align: left;
        color: #434343;
        margin-top: calc(50/768*100vw)
    }
    .news_content img {
        width: auto;
        height: auto;
        margin: calc(100/768*100vw) auto;
        margin-left: 0
    }
    .links_box {
        margin: calc(100/768*100vw) auto calc(40/768*100vw);
        gap: calc(30/768*100vw)
    }
    .links_box .links a {
        width: calc(320/768*100vw);
        height: calc(100/768*100vw);
        font-size: calc(28/768*100vw);
        line-height: calc(40/768*100vw)
    }
    .links_box .links a:hover {
        color: #000037;
        background: #fff
    }
    .links_box .links_pre a::after {
        width: calc(22/768*100vw);
        height: calc(22/768*100vw);
        left: calc(40/768*100vw)
    }
    .links_box .links_next a::after {
        width: calc(22/768*100vw);
        height: calc(22/768*100vw);
        right: calc(40/768*100vw)
    }
    .links_group .sp .links_list a {
        width: 98%;
        margin: auto
    }
    .blog_img img {
        height: calc(400/768*100vw)
    }
    .movie {
        margin: calc(80/768*100vw) auto;
        width: 90%;
    }
    .schoollist {
        margin: calc(100/768*100vw) auto
    }
    .schoollist_body .list_grid {
        gap: calc(40/768*100vw)
    }
    .schoollist_body .school_info {
        padding: calc(60/768*100vw) calc(40/768*100vw)
    }
    .schoollist_body .school_title {
        font-size: calc(36/768*100vw);
        line-height: calc(70/768*100vw);
        letter-spacing: .04em;
        font-weight: 600;
        color: #333
    }
    .schoollist_body .school_address {
        font-size: calc(28/768*100vw);
        line-height: calc(35/768*100vw);
        margin-top: calc(20/768*100vw)
    }
    .teachers {
        margin: calc(70/768*100vw) auto
    }
    .teachers_box .head_teacher {
        flex-direction: column;
        gap: calc(60/768*100vw);
        margin-top: calc(50/768*100vw)
    }
    .teachers .head_infor .title,
    .teachers .teacher_txt .title {
        font-size: calc(34/768*100vw);
        line-height: calc(36/768*100vw);
        font-weight: 600
    }
    .teachers .class_item_title h3 {
        color: #000037
    }
    .teachers .head_infor .head_name {
        margin: calc(30/768*100vw) auto;
        font-size: calc(55/768*100vw);
        letter-spacing: .04em;
        font-weight: 600
    }
    .teachers .head_infor .comment,
    .teachers .teacher_txt .comment {
        font-size: calc(28/768*100vw);
        line-height: calc(46/768*100vw);
        letter-spacing: .01em;
        font-weight: 400
    }
    .teachers .teachers_box {
        margin-top: calc(100/768*100vw)
    }
    .teachers .teachers_grid {
        gap: calc(80/768*100vw)
    }
    .teachers .teacher_txt .name {
        margin: calc(20/768*100vw) auto;
        font-size: calc(42/768*100vw);
        letter-spacing: .04em;
        font-weight: 600
    }

    .bnr_wrap{
        max-width: 100%;
        margin: 50px auto 50px;
        padding: 0 20px;
    }

    .bnr_wrap_2 {
        max-width: 100%;
        margin: 50px auto 50px;
        padding: 0 20px;
    }
}