@import url(https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap);
.logo img,
.pc,
img {
    display: block
}

.header,
.loading {
    top: 0;
    left: 0;
    position: fixed
}

.header,
.header .nav_sp {
    width: 100%;
    transition: .5s
}

#page-top,
.header,
.loading {
    position: fixed
}

.filters li,
.main_intro_txt ul.list_reset li,
.nav_sp ul li,
ol li,
ul li {
    list-style: none
}

@font-face {
    font-family: YuMincho-db;
    src: url(../font/yumindb.ttf)
}

body,
html {
    font-family: 'Noto Serif JP', serif;
    margin: 0;
    overflow-x: hidden
}

#page-top,
.mw_wp_form_confirm .privacy_check,
.pagination_contain .pages,
.sp {
    display: none
}

.clearfix::after {
    content: "";
    clear: both;
    display: table
}

img {
    width: 100%;
    height: auto
}

a {
    color: #000;
    text-decoration: none
}

h1,
h2,
h3,
h4,
h5,
h6,
ol,
p,
ul {
    margin: 0;
    padding: 0
}

.page_max_width {
    margin: auto;
    max-width: 1200px
}

.page_width {
    max-width: 1100px;
    margin: auto!important
}

.page_small_width {
    max-width: 1000px;
    margin: auto
}

.loading {
    width: 100%;
    height: 100vh;
    z-index: 10000;
    background-color: #000037
}

.loading .loding_img {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100vh
}

.loading .loding_img img {
    width: 100px;
    height: auto
}

.header {
    background-color: #ffffffb3;
    z-index: 9999
}

.header_contain {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 40px
}

.header_bg {
    background-color: #fff
}

.header_logo a {
    font-size: 16.5px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: .01em;
    color: #00003c
}

.mv_main_txt h2,
.mv_main_txt p {
    font-style: italic;
    letter-spacing: .03em
}

.header_logo img {
    width: 200px;
    height: auto
}

.header_logo h1 {
    font-size: 36px;
    font-weight: 800
}

.header_nav .nav_list {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px
}

.header_nav .nav_list a {
    font-size: 16px;
    line-height: 32px;
    color: #000037;
    font-weight: 500;
    position: relative
}

.header_nav .nav_list a::after {
    position: absolute;
    content: "";
    width: 0;
    height: 1px;
    bottom: -3px;
    left: 50%;
    transform: translateX(-50%);
    background: #000037;
    transition: .35s
}

.contact_item .item_content,
.footer_nav ul a:hover::after,
.header_nav .nav_list a:hover::after {
    width: 100%
}

.header_nav .contact_link a {
    background: linear-gradient(180deg, #ff7133 0%, #d74100 100%);
    border: 1px solid #d74100;
    color: #fff;
    border-radius: 9999px;
    padding: 15px 45px;
    transition: .35s
}

.c-request_btn a:hover,
.footer_contain .view_more_btn a:hover,
.header_nav .contact_link a:hover {
    background: #fff;
    color: #d74100;
}

.header_nav .contact_link a:hover::after {
    width: 0
}

.menu_btn {
    position: relative;
    background: #00003c;
    cursor: pointer;
    width: 50px;
    height: 50px;
    border-radius: 5px;
    z-index: 12;
    border: 1px solid #fff
}

.menu_btn span {
    display: inline-block;
    transition: .4s;
    position: absolute;
    left: 14px;
    height: 2px;
    border-radius: 5px;
    background: #fff;
    width: 45%
}

.c-request_btn a,
.view_more_btn a {
    font-size: 18px;
    text-align: center;
    height: 56px;
    display: flex
}

.menu_btn span:first-of-type {
    top: 13px
}

.menu_btn span:nth-of-type(2) {
    top: 19px
}

.menu_btn span:nth-of-type(3) {
    top: 25px
}

.menu_btn span:nth-of-type(3)::after {
    content: "Menu";
    position: absolute;
    top: 5px;
    left: -2px;
    color: #fff;
    font-size: .6rem;
    text-transform: uppercase
}

.menu_btn.active span:first-of-type {
    top: 14px;
    left: 18px;
    transform: translateY(6px) rotate(-45deg);
    width: 30%
}

.menu_btn.active span:nth-of-type(2) {
    opacity: 0
}

.menu_btn.active span:nth-of-type(3) {
    top: 26px;
    left: 18px;
    transform: translateY(-6px) rotate(45deg);
    width: 30%
}

.menu_btn.active span:nth-of-type(3)::after {
    content: "Close";
    transform: translateY(0) rotate(-45deg);
    top: 5px;
    left: 4px
}

.c-request_btn a .top_txt::after,
.c-request_btn a .top_txt::before {
    position: absolute;
    width: 15px;
    top: 9px;
    background-color: #fff;
    content: "";
    height: 1px;
    transition: .35s
}

.header .nav_sp {
    height: 100vh;
    position: absolute;
    z-index: 9;
    top: -5px;
    right: -100%;
    overflow-x: hidden;
    padding-bottom: 100%;
    margin-top: 4px;
    background-color: #00003c
}

.nav_sp ul li {
    color: #333;
    margin: auto 40px;
    padding: 0;
    text-align: left;
    position: relative;
    border-bottom: 1px dashed rgba(255, 255, 255, .85)
}

.nav_sp ul li a {
    color: #fff;
    text-decoration: none;
    font-size: 16px;
    padding: 12px 0;
    display: flex;
    align-items: center
}

.nav_sp ul li a img {
    margin-right: 15px;
    width: 5px;
    height: auto
}

.nav_sp ul {
    margin-top: 35%
}

.about_top_intro_txt,
.mv_sec .c-request_btn {
    margin-top: 40px
}

.view_more_btn {
    margin: 80px auto;
    text-align: center
}

.view_more_btn a {
    border: 2px solid #000037;
    background-color: #fff;
    color: #000037;
    width: 280px;
    font-weight: 700;
    line-height: 34px;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    margin: auto;
    transition: .35s
}

.view_more_btn a:hover {
    color: #fff;
    background-color: #000037
}

.c-request_btn a {
    background: linear-gradient(180deg, #ff7133 0%, #d74100 100%);
    border: 1px solid #d74100;
    font-weight: 500;
    color: #fff;
    border-radius: 30px;
    width: 320px;
    justify-content: center;
    align-items: center;
    position: relative;
    transition: .35s
}

.c-data_btn.c-request_btn a {
    align-items: flex-start
}

.c-request_btn a::before {
    position: absolute;
    z-index: 2;
    display: block;
    content: "";
    right: 20px;
    top: 23px;
    width: 6px;
    height: 6px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(45deg) translateY(50%);
    transform: rotate(45deg) translateY(50%);
    transition: .35s
}

.mv_main_txt,
.mv_main_txt h2,
.mv_sec,
.mv_sec_contain {
    position: relative
}

.c-request_btn a .top_txt {
    font-size: 12px;
    position: relative
}

.c-request_btn a .top_txt::before {
    left: -19px;
    transform: rotate(50deg)
}

.c-request_btn a .top_txt::after {
    right: -19px;
    transform: rotate(-50deg)
}

.c-request_btn a:hover .top_txt::after,
.c-request_btn a:hover .top_txt::before {
    background-color: #ba0508
}

.c-request_btn a:hover::before {
    right: 10px;
    border-top: 2px solid #d74100;
    border-right: 2px solid #d74100
}

.main_bg {
    background-image: url(../image/top/main_bg.jpg);
    background-position: top;
    background-repeat: no-repeat;
    background-size: contain;
    margin-top: 95px
}

.contact_add_sec,
.flow_bg {
    background-repeat: no-repeat;
    background-size: cover
}

.mv_sec {
    padding: 250px 20px 0
}

.mv_sec_contain {
    z-index: 1
}

.mv_sec_bg img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    object-position: center
}

.mv_main_txt {
    display: inline-block;
    padding: 30px 20px 10px
}

.top_feature_sec,
.top_intro_sec {
    padding: 0 20px
}

.mv_main_txt h2 {
    font-size: 55px;
    font-weight: 800;
    color: #006;
    text-shadow: 5px 2px 0 #fff;
    padding-bottom: 15px;
    border-bottom: 2px solid #e0b47d
}

.main_txt_mark {
    position: absolute;
    top: -80px;
    right: 120px;
    width: 150px;
    height: auto
}

.banner_contain,
.c-intro_title h3,
.flow_content {
    position: relative
}

.mv_main_txt p {
    font-size: 14px;
    font-weight: 500;
    color: #e0b47d;
    padding-top: 15px
}

.mv_sec .mv_banner {
    margin-top: 30px;
    width: 400px;
    height: auto
}

.top_intro_sec {
    margin-top: 120px
}

.c-intro_title h3 {
    font-size: 32px;
    line-height: 44px;
    letter-spacing: .04em;
    font-weight: 600;
    border-bottom: none;
    margin-bottom: 30px;
    color: #000037;
    padding: 10px 0
}

.c-intro_title h3::after {
    position: absolute;
    content: "";
    display: block;
    left: 0;
    bottom: -10px;
    width: 150px;
    height: 5px;
    background-color: #000037
}

.c-intro_txt {
    font-size: 16px;
    line-height: 30px;
    letter-spacing: .04em;
    font-weight: 500;
    margin-bottom: 120px;
    color: #000037
}

.top_feature_grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 60px 40px;
    align-items: center
}

.top_feature_item {
    background-color: #000037;
    outline: #FFFFFF solid 1px;
    outline-offset: -7px;
    padding: 15px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 5%
}

.top_feature_img {
    width: 28%;
    display: flex;
    align-items: center;
    justify-content: center
}

.top_feature_img img {
    width: 65px;
    height: auto
}

.top_feature_content {
    width: 67%
}

.top_feature_title h4 {
    font-size: 20px;
    line-height: 32px;
    letter-spacing: .04em;
    color: #fff
}

.top_feature_txt p {
    color: #fff;
    font-size: 14px;
    line-height: 22px;
    letter-spacing: .04em;
    margin-top: 0;
    padding-right: 5px
}

.intro_sec_02 .intro_txt,
.intro_sec_02_title h2,
.sec_02_grid_item {
    letter-spacing: .05em;
    text-align: center
}

.intro_sec_02 {
    margin-top: 150px;
    padding: 0 20px
}

.intro_sec_02_title h2 {
    font-size: 32px;
    font-weight: 400;
    line-height: 46px;
    padding: 20px 0;
    margin-bottom: 80px;
    border-left: none;
    color: #fff;
    background-image: linear-gradient(to right, transparent, #000037 17%, #000037 83%, transparent)
}

.intro_sec_02 .intro_txt {
    margin-bottom: 80px;
    font-size: 20px;
    line-height: 40px;
    color: #000037
}

.sec_02_grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 30px;
    align-items: center
}

.sec_02_grid_item {
    background-color: #000037;
    outline: #FFFFFF solid 1px;
    outline-offset: -7px;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    flex-direction: column;
    height: 275px;
    max-width: 280px;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    color: #fff;
    gap: 25px
}

.sec_02_grid_item .item_img {
    width: fit-content;
    max-width: 35%
}

.sec_02_grid_item img {
    height: auto;
    max-width: 100%;
    vertical-align: bottom
}

.flow_bg {
    background-image: url(../image/top/flow_bg.png)
}

.head_intro_contain {
    padding: 80px 0
}

.c-sec_tittle h2 {
    font-size: 50px;
    color: #000037;
    line-height: 60px;
    font-weight: 700;
    text-align: center;
    margin: 15px auto
}

.c-sec_tittle .up_mark {
    width: 50px;
    height: auto;
    margin: auto
}

.c-sec_tittle .down_mark {
    width: 15px;
    height: auto;
    margin: auto
}

.teacher_intro_body {
    max-width: 1000px;
    margin: 60px auto auto;
    display: flex;
    justify-content: space-between;
    gap: 6%;
    padding: 0 20px
}

.teacher_img {
    width: 40%
}

.teacher_content {
    width: 54%
}

.privacy_content .p-top_text,
.teacher_content .c-intro_txt {
    margin-bottom: 40px
}

.teacher_name {
    margin: auto 0 auto auto;
    text-align: right;
    font-size: 32px;
    font-weight: 700;
    color: #000037
}

.flow_sec .sec_04_contain {
    padding: 80px 20px 0
}

.flow_intro_txt p {
    font-size: 18px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: .04em;
    text-align: center;
    color: #333;
    margin: 40px auto
}

.flow_bottom_txt p,
.flow_item .flow_img::after {
    letter-spacing: .04em;
    font-weight: 600;
    text-align: center
}

.flow_body {
    display: flex;
    flex-direction: column
}

.flow_item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 80px;
    margin-bottom: 115px
}

.flow_item .flow_img {
    max-width: 300px;
    width: 100%;
    position: relative
}

.flow_item .flow_img::after {
    content: "お問い合わせ";
    color: #fff;
    font-size: 32px;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%
}

.flow_item.flow_item_02 .flow_img::after {
    content: "来校・個人面談"
}

.flow_item.flow_item_03 .flow_img::after {
    content: "講師の選定"
}

.flow_item.flow_item_04 .flow_img::after {
    content: "初回授業スタート"
}

.flow_item.flow_item_05 .flow_img::after {
    content: "個人別\Aカリキュラム作成";
    white-space: pre
}

.flow_content .flow_txt {
    font-size: 16px;
    line-height: 30px;
    letter-spacing: .04em;
    font-weight: 500;
    color: #333
}

.flow_content {
    width: 87%
}

.flow_content::before {
    content: "";
    display: block;
    width: 5px;
    height: 150px;
    background-color: #000;
    position: absolute;
    top: 50%;
    left: -40px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%)
}

.banner_link,
.contactadd_title h3::after,
.footer_nav ul a::after {
    left: 50%;
    transform: translateX(-50%)
}

.flow_content::after {
    content: "▼";
    display: block;
    position: absolute;
    bottom: -110px;
    left: -55px;
    font-size: 34px;
    color: #333
}

.flow_item_02 .flow_content::after {
    bottom: -80px
}

.flow_item_03 .flow_content::after {
    bottom: -95px
}

.flow_item_04 .flow_content::after {
    bottom: -150px
}

.flow_item_05 .flow_content::after {
    content: ""
}

.flow_btn_group {
    margin-top: 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 40px
}

.flow_btn_group .flow_link a {
    width: 250px;
    height: 56px;
    font-size: 18px;
    font-weight: 700;
    line-height: 34px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center
}

.flow_btn_group .link_01 a {
    border: 2px solid #ba0508;
    background-color: #ba0508;
    color: #fff;
    transition: .35s
}

.flow_btn_group .link_02 a {
    border: 2px solid #000037;
    background-color: #fff;
    color: #000037;
    transition: .35s
}

.flow_btn_group .link_01 a:hover {
    background-color: #fff;
    color: #ba0508
}

.flow_btn_group .link_02 a:hover,
.wp-pagenavi a:hover,
.wp-pagenavi span.current {
    background-color: #000037;
    color: #fff
}

.flow_bottom_title h3 {
    font-size: 32px;
    line-height: 44px;
    letter-spacing: .04em;
    border-bottom: none;
    color: #333;
    text-align: center;
    margin-bottom: 30px
}

.flow_bottom_txt p {
    font-size: 20px;
    line-height: 36px;
    color: #333
}

.banner_sec {
    margin: 80px auto auto
}

.banner_link {
    position: absolute;
    bottom: 40px
}

.c-request_btn.banner_link a {
    background: #fbf9be;
    color: #000037
}

.c-request_btn.banner_link a::before {
    border-top: 2px solid #000037;
    border-right: 2px solid #000037
}

.contact_add_sec {
    background-image: url(../image/top/contact_add_bg.jpg);
    position: relative;
    z-index: 0
}

.contact_add_sec::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #00003761;
    z-index: 1
}

.contactadd_box {
    padding: 80px 40px;
    margin: auto;
    position: relative;
    z-index: 2
}

.contactadd_title h3 {
    font-weight: 700;
    font-size: 32px;
    letter-spacing: .06em;
    line-height: 40px;
    text-align: center;
    color: #fff;
    position: relative;
    margin: auto
}

.contactadd_title h3::after {
    position: absolute;
    content: "";
    width: 100px;
    height: 5px;
    bottom: -30px;
    background-color: #fff
}

.blog_img:hover img,
.schoollist_body .list_grid .item a:hover img {
    transform: scale(1.1)
}

.contactadd_content {
    margin-top: 100px
}

.contactadd_flex {
    display: flex;
    align-items: center;
    position: relative
}

.contactadd_flex .head_txt {
    position: absolute;
    top: -50px;
    left: -35px;
    width: 100px;
    height: 100px;
    background: #c1a154;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: #fff;
    text-align: center;
    line-height: 1.7;
    letter-spacing: .03em
}

.about_top_intro,
.class_detail_page .mv_sub,
.class_page .mv_sub,
.contact_page .mv_sub,
.mv_sub {
    background-size: cover;
    background-repeat: no-repeat
}

.contactadd_flex_img {
    width: 33%
}

.contactadd_flex_main {
    width: 57%;
    background: linear-gradient(180deg, #ff7133 0%, #d74100 100%);
    padding: 0 5%;
    height: 190px;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    flex-direction: column
}

.contactadd_flex_title h4 {
    font-weight: 500;
    font-size: 30px;
    letter-spacing: .06em;
    line-height: 30px;
    text-align: left;
    color: #fff;
    margin: auto;
    padding: 20px 0;
    border-bottom: 1px solid #fff
}

.contactadd_flex_txt p {
    font-size: 16px;
    letter-spacing: .06em;
    text-align: left;
    color: #fff;
    margin: 20px auto
}

.contactadd_btn_group {
    margin: 100px auto;
    max-width: 650px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px
}

.contactadd_bottom_box {
    max-width: 700px;
    margin: auto;
    text-align: center
}

.contactadd_bottom_box .top_txt p {
    font-size: 18px;
    letter-spacing: .06em;
    text-align: center;
    color: #fff
}

.contactadd_bottom_box .down_txt p {
    font-size: 14px;
    letter-spacing: .06em;
    text-align: center;
    color: #fff
}

.contactadd_bottom_box .tel_number {
    margin: 10px auto
}

.contactadd_bottom_box .tel_number a {
    font-size: 36px;
    text-decoration: none;
    text-align: center;
    color: #fff
}

.class_information .txt a,
.privacy_check p a,
.target .blog_title a:hover h3 {
    text-decoration: underline
}

.news_sec_contain {
    max-width: 800px;
    margin: 80px auto;
    padding: 0 20px
}

.news_sec_body {
    margin-top: 60px
}

.news_sec_body .news_item {
    padding: 10px 0;
    border-top: 1px solid #333;
    display: flex;
    align-items: center
}

.footer_nav ul,
.news_info {
    align-items: center;
    display: flex
}

.news_info {
    max-width: 190px;
    width: 100%
}

.news_sec_body .news_item:last-child {
    border-bottom: 1px solid #333
}

.news_item .news_date {
    max-width: 90px;
    width: 100%;
    min-width: 80px;
    font-size: 14px;
    line-height: 17px;
    color: #333
}

.news_category {
    background-color: #9c9c9c;
    padding: 2px 10px;
    font-size: 14px;
    line-height: 12px;
    border-radius: 10px;
    color: #fff
}

.news_title h2 {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.8;
    color: #000037;
    margin-left: 20px
}

.c-copyrigth p,
.footer_info p {
    line-height: 32px;
    text-align: center;
    letter-spacing: .03em;
    font-size: 16px
}

.footer {
    background-color: #000037
}

.footer_contain {
    padding: 60px 20px
}

.footer_nav ul {
    justify-content: center;
    gap: 80px
}

.footer_nav ul a {
    font-size: 18px;
    font-weight: 500;
    letter-spacing: .03em;
    color: #fff;
    position: relative
}

.footer_nav ul a::after {
    position: absolute;
    content: "";
    width: 0;
    height: 1px;
    bottom: -2px;
    background-color: #fff;
    transition: .35s
}

.footer_contain .view_more_btn,
.pagination_contain {
    margin: 60px auto;
    text-align: center
}

.footer_contain .view_more_btn a {
    background: linear-gradient(180deg, #ff7133 0%, #d74100 100%);
    border: 1px solid #d74100;
    color: #fff;
    transition: .35s
}

.answer p::before,
.question p::before {
    display: block;
    background-size: contain;
    min-width: 70px;
    max-width: 70px;
    max-height: 70px;
    min-height: 70px;
    margin-right: 30px;
    content: ""
}

.footer_logo {
    max-width: 320px;
    margin: auto
}

.footer_info p {
    color: #fff;
    margin: 30px auto
}

.main_body_item:last-child,
.privacy_title h2 {
    margin-bottom: 60px
}

.c-copyrigth p {
    font-weight: 500;
    color: #fff;
    border-top: 1px solid #fff;
    padding: 20px
}

.contact_item input,
.contact_item select {
    border: 1px solid #000037;
    font-family: 'Noto Serif JP', serif
}

.about_top_intro .head h2,
.about_top_intro_txt p,
.mv_sub_txt h2 {
    letter-spacing: .04em;
    font-weight: 600;
    color: #fff;
    text-align: center
}

#page-top {
    bottom: 75px;
    right: 0;
    background: #000037;
    z-index: 999;
    border: 1px solid #fff
}

.c-page-top_btn {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center
}

.c-page-top a {
    color: #fff;
    font-size: 20px
}

.c-page-top a svg {
    width: 20px;
    height: auto
}

.show {
    display: block!important
}

.mv_sub {
    position: relative;
    background-image: url(../image/about/aboutf_mv_pc.png)
}

.mv_sub_txt {
    padding: 200px 20px 100px
}

.mv_sub_txt h2 {
    font-size: 50px;
    line-height: 44px
}

.c-breadcrumbs {
    padding: 5px
}

.c-breadcrumbs ul {
    display: flex;
    align-items: center;
    gap: 5px
}

.c-breadcrumbs ul a,
.c-breadcrumbs ul span {
    font-size: 13px;
    color: #fff;
    letter-spacing: .03em;
    white-space: nowrap
}

.c-breadcrumbs ul li {
    position: relative;
    padding-left: 20px
}

.c-breadcrumbs ul li.top_li::before {
    border-width: 0
}

.c-breadcrumbs ul li::before {
    position: absolute;
    content: "";
    top: 5px;
    left: 0;
    border-style: solid;
    border-width: 1px 1px 0 0;
    content: "";
    display: inline-block;
    height: .4em;
    margin: .45em .45em .15em .15em;
    transform: rotate(45deg) translateY(-50%);
    width: .4em;
    color: #fff
}

.profile_item,
.qa_item {
    border-bottom: 1px solid #000037
}

.about_sec_01 {
    margin: 60px auto
}

.about_top_intro {
    background-image: url(../image/about/about_bg_01.png);
    padding: 60px 20px
}

.about_top_intro .head h2 {
    font-size: 32px;
    line-height: 44px
}

.about_top_intro_txt p {
    font-size: 20px;
    line-height: 35px
}

.answer p,
.question p {
    letter-spacing: .04em;
    font-weight: 600;
    color: #000037
}

.about_main_intro {
    padding: 0 20px;
    margin-top: 50px
}

.about_main_contain {
    max-width: 1400px;
    margin: auto
}

.main_body_item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 120px
}

.main_body_item.reverse {
    flex-direction: row-reverse
}

.profile_item,
.question p {
    align-items: center;
    display: flex
}

.main_intro_content {
    background-color: #000037cc;
    padding: 70px 100px;
    max-width: 900px;
    margin-left: -300px
}

.reverse .main_intro_content {
    margin-left: 0;
    margin-right: -300px;
    position: relative;
    z-index: 1
}

.about_main_intro .main_intro_title h2 {
    font-size: 32px;
    line-height: 44px;
    letter-spacing: .04em;
    position: relative;
    color: #fff;
    font-weight: 700
}

.about_main_intro .main_intro_title h2::after {
    content: "";
    display: block;
    left: 0;
    width: 150px;
    height: 5px;
    background-color: #fff;
    margin-top: 10px;
    position: absolute;
    right: 350px
}

.main_intro_txt ul li {
    list-style: disc
}

.main_intro_txt {
    padding-left: 25px;
    margin-top: 35px;
    font-size: 16px;
    line-height: 30px;
    letter-spacing: .04em;
    font-weight: 500;
    color: #fff;
    padding-right: 45px
}

.reverse .main_intro_txt {
    padding-right: 0
}

.main_intro_img {
    width: 55%
}

.qa_sec {
    margin-top: 80px;
    padding: 80px;
    background-color: #000037
}

.qa_contain {
    background-color: #fff;
    padding: 60px 0
}

.qa_body {
    margin-top: 60px;
    padding: 0 100px
}

.qa_item:first-of-type {
    border-top: 1px solid #000037
}

.qa_item {
    padding: 30px 0
}

.question p {
    font-size: 32px;
    line-height: 44px
}

.question p::before {
    background-image: url(../image/about/qa_logo_1.png)
}

.answer p {
    display: flex;
    font-size: 20px;
    line-height: 31px;
    margin-top: 40px;
    align-items: flex-start
}

.answer p::before {
    background-image: url(../image/about/qa_logo_2.png)
}

.courses_sec,
.privacy_sec,
.profile_sec {
    margin: 80px auto;
    padding: 0 20px
}

.profile_sec_body {
    margin: 60px auto 80px
}

.profile_item {
    padding: 20px 0
}

.profile_item .head {
    max-width: 35%;
    width: 100%;
    font-size: 16px;
    text-align: center
}

.class_information .head,
.class_list_link a {
    font-size: 18px;
    line-height: 31px;
    font-weight: 600;
    color: #000037;
    letter-spacing: .04em
}

.map_contain iframe {
    width: 100%;
    height: 500px
}

.class_page .mv_sub {
    position: relative;
    background-image: url(../image/class/class_bg.png)
}

.class_detail_page .mv_sub {
    position: relative;
    background-image: url(../image/class/class_detail_bg.png)
}

.class_list {
    padding: 0 20px;
    margin: 80px auto
}

.class_list_linkbox {
    margin: 60px auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px
}

.information_row,
.target_grade_item {
    margin-bottom: 20px
}

.class_list_link a {
    background-color: #fff;
    width: 200px;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 10px 1px #ddd;
    transition: .35s
}

.class_hours_box,
.courses_body,
.target_grade_head,
.top_page_link a {
    background-color: #000037
}

.class_list_link a:hover {
    background-color: #ddd;
    color: #000037
}

.class_list_body .class_item {
    padding: 50px;
    box-shadow: 0 0 15px rgba(0, 0, 0, .05)
}

.class_item_title h3 {
    font-size: 32px;
    line-height: 44px;
    letter-spacing: .04em;
    color: #333;
    font-weight: 700
}

.more_infor .class_item_title h3,
.teachers .class_item_title h3 {
    color: #000037
}

.class_list_body .class_item_haed {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    border-bottom: 3px solid #000037;
    padding-bottom: 20px
}

.class_item_more.view_more_btn {
    margin: auto 0
}

.class_item_box {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    margin-top: 30px
}

.class_hours_box,
.mv_sub_txt p,
.target_grade_box,
.teachers .teacher_txt {
    margin-top: 20px
}

.class_information,
.class_item_map {
    width: 50%
}

.class_item_map iframe {
    width: 100%;
    height: 400px
}

.class_information .txt {
    font-size: 16px;
    line-height: 30px;
    letter-spacing: .04em
}

.contact_top_intro .bottom_txt,
.contact_top_intro .top_txt {
    color: #000037;
    line-height: 32px;
    font-weight: 500;
    text-align: center
}

.class_information .txt a {
    color: #cd162c
}

.more_infor {
    padding-top: 30px
}

.target_grade_item {
    display: grid;
    align-items: center;
    grid-template-columns: auto 1fr;
    grid-gap: 30px
}

.target_grade_head,
.target_grade_txt {
    border: 2px solid #000037;
    font-size: 16px;
    line-height: 30px;
    letter-spacing: .04em;
    font-weight: 600;
    align-items: center;
    display: flex
}

.courses_grid,
.schoollist_body .list_grid,
.teachers .teachers_grid {
    grid-template-columns: 1fr 1fr 1fr
}

.target_grade_head {
    color: #fff;
    width: 250px;
    height: 70px;
    outline: #FFFFFF solid 1px;
    outline-offset: -3px;
    padding: 15px;
    justify-content: center
}

.target_grade_txt {
    height: calc(100% - 4px);
/*     justify-content: center */
}

.target_grade_txt p{
	max-width: 250px;
    width: 100%;
    margin: auto;
}

.class_hours_box {
    padding: 40px 0
}

.class_hours_txt {
    font-size: 20px;
    line-height: 40px;
    letter-spacing: .05em;
    font-weight: 400;
    color: #fff;
    text-align: center
}

.contact_page .mv_sub {
    position: relative;
    background-image: url(../image//contact/contact_mv.png)
}

.mv_sub_txt p {
    font-size: 14px;
    color: #fff;
    font-weight: 500;
    text-align: center
}

.contact_sec {
    margin: 120px auto
}

.contact_top_intro .top_txt {
    font-size: 18px
}

.contact_top_intro .top_txt a {
    font-weight: 700;
    text-decoration: underline
}

.contact_top_intro .bottom_txt {
    font-size: 14px
}

.contact_form {
    max-width: 800px;
    margin: 60px auto;
    padding: 0 20px
}

.contact_box {
    margin-bottom: 120px
}

.contact_box .contact_item {
    display: flex;
    align-items: center;
    margin: 25px auto
}

.red {
    color: red;
    margin-left: 10px
}

.contact_item .item_head {
    max-width: 200px;
    width: 100%;
    font-size: 18px;
    color: #333;
    font-weight: 700;
    text-align: right;
    margin-right: 50px
}

.contact_item input {
    width: calc(100% - 20px);
    height: 35px;
    padding: 10px;
    font-size: 18px;
    color: #333
}

.contact_item select {
    height: 55px;
    width: 100%;
    padding: 10px;
    font-size: 16px;
    color: #333
}

.contact_item input[type=checkbox] {
    width: 15px;
    height: 15px
}

.privacy_check p {
    font-size: 18px;
    color: #000037;
    line-height: 1.8;
    text-align: center
}

.privacy_check p a {
    font-weight: 500;
    color: #000037
}

.contact_submit {
    margin: 50px auto;
    text-align: center;
    display: flex;
    justify-content: center;
    gap: 25px
}

.contact_submit button {
    background: #000037;
    border-radius: 50px;
    width: 320px;
    height: 60px;
    font-size: 20px;
    letter-spacing: .05em;
    font-weight: 500;
    color: #fff;
    border: 2px solid #000037;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: .35s
}

.recaptcha,
.top_page_link {
    align-items: center;
    display: flex
}

.contact_submit button:hover {
    background: #fff;
    color: #000037
}

.contact_submit button:disabled {
    cursor: not-allowed;
    opacity: .5
}

.privacy_check input[type=checkbox]:disabled {
    color: #ccc;
    cursor: not-allowed
}

.recaptcha {
    justify-content: center
}

.privacy_check {
    display: flex;
    justify-content: center;
    position: relative
}

.mw_wp_form .privacy_check .error {
    position: absolute;
    left: 140px;
    bottom: -25px
}

.complete_txt {
    font-size: 18px;
    color: #000037;
    text-align: center;
    font-weight: 500;
    line-height: 42px
}

.blog_date,
.target .blog_title h3 {
    font-family: 'Noto Sans JP', sans-serif;
    text-align: left
}

.top_page_link {
    justify-content: center;
    margin: 60px auto
}

.top_page_link a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 280px;
    height: 55px;
    text-align: center;
    font-size: 16px;
    line-height: 32px;
    color: #fff;
    border: 1px solid #000037;
    border-radius: 50px
}

.courses_body {
    margin-top: 60px;
    padding: 40px
}

.courses_grid {
    display: grid;
    grid-gap: 30px;
    align-items: center
}

.courses_item {
    background: #fff;
    padding: 20px 40px
}

.courses_item .content p {
    display: flex;
    align-items: center;
    gap: 5px;
    margin: 15px auto;
    font-size: 16px;
    color: #000037
}

.courses_item img {
    width: 25px;
    height: auto
}

.courses_item .head {
    background: #000037;
    text-align: center;
    font-size: 18px;
    font-weight: 500;
    color: #fff;
    padding: 10px;
    letter-spacing: .03em
}

.news_page .mv_sub,
.privacy_page .mv_sub {
    background-size: cover;
    background-repeat: no-repeat;
    position: relative
}

.privacy_page .mv_sub {
    background-image: url(../image/privacy/pp_mv_pc.png)
}

.privacy_title h2 {
    font-size: 30px;
    line-height: 38px;
    color: #000;
    text-align: center
}

.privacy_content .row_head {
    font-weight: 600;
    margin-top: 30px;
    margin-bottom: 5px
}

.privacy_content p {
    font-size: 16px;
    line-height: 24px;
    color: #000;
    font-weight: 400
}

.news_page .mv_sub {
    background-image: url(../image//news/main_bg.jpg)
}

.p-bloglist {
    margin: 100px auto;
    padding: 0 20px
}

.p-bloglist_head h2 {
    font-weight: 500;
    font-size: 26px;
    text-align: center;
    color: #000137;
    margin-bottom: 25px
}

input[type=radio] {
    position: absolute;
    left: -9999px
}

.filters {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px;
    margin: auto;
    padding: 0
}

.filters li {
    width: 220px;
    height: 55px;
    border: 1px solid rgba(0, 0, 0, .16);
    text-align: center;
    font-weight: 500;
    font-size: 15px;
    line-height: 30px;
    color: #333
}

.filters li label {
    width: 100%;
    height: 100%;
    display: flex;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    transition: .35s
}

.filters label:hover,
[value=""]:checked~.filters [for=""],
[value="お知らせ"]:checked~.filters [for="お知らせ"],
[value=All]:checked~.filters [for=All] {
    background: #000137;
    color: #fff
}

.targets {
    margin-top: 80px;
    display: grid;
    grid-gap: 60px 50px;
    grid-template-columns: repeat(3, 1fr)
}

.targets .target {
    background: 0 0
}

.checked_animation {
    animation: .4s ease-in-out both checked_animation
}

@keyframes checked_animation {
    0% {
        transform: translate(0, 300px);
        opacity: 0
    }
    100% {
        transform: translate(0, 0);
        opacity: 1
    }
}

.blog_date {
    font-weight: 500;
    font-size: 18px;
    letter-spacing: .08em;
    color: #000137
}

.target .blog_title h3 {
    font-weight: 500;
    font-size: 20px;
    letter-spacing: .02em;
    line-height: 30px;
    color: #000137;
    margin: 15px auto 10px;
    transition: .35s
}

.blog_img {
    position: relative;
    z-index: 0;
    overflow: hidden
}

.blog_img img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    transition: .7s
}

.blog_img:hover img {
    opacity: .7
}

.blog_categories {
    position: absolute;
    top: 0;
    left: 0;
    padding: 7px 15px;
    font-weight: 600;
    font-size: 11px;
    letter-spacing: .13em;
    line-height: 10px;
    text-align: center;
    color: #fff;
    z-index: 1;
    background: #000037
}

.news_detail_body .news_title h2 {
    font-weight: 700;
    font-size: 26px;
    letter-spacing: .08em;
    line-height: 54px;
    text-align: left;
    color: #000137;
    padding-left: 15px;
    border-bottom: 1px solid #707070;
    position: relative;
    margin: auto
}

.news_detail_body .news_title h2::before {
    position: absolute;
    content: "";
    width: 4px;
    height: 35px;
    left: 0;
    background: #000037;
    top: 12px
}

.news_content {
    font-weight: 500;
    font-size: 15px;
    letter-spacing: .13em;
    line-height: 44px;
    text-align: left;
    color: #434343;
    margin-top: 50px
}

.news_content img {
    width: auto;
    height: auto;
    margin: 60px auto 60px 0
}

.links_box {
    margin: 80px auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px
}

.links_group .links a {
    width: 270px;
    height: 53px;
    background: #000037;
    border: 1px solid #000037;
    font-weight: 600;
    font-size: 16px;
    letter-spacing: .08em;
    line-height: 20px;
    text-align: left;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    transition: .35s
}

.links_group .links a:hover {
    color: #000037;
    background: #fff
}

.links_box .links_next a::after,
.links_box .links_pre a::after {
    content: "";
    width: 15px;
    height: 15px;
    top: 50%;
    background-image: url(../image/news/arrow-right-circle.svg);
    background-repeat: no-repeat;
    background-size: contain;
    transition: .35s;
    position: absolute
}

.links_box .links_pre a::after {
    transform: translateY(-50%);
    left: 40px
}

.links_box .links_next a::after {
    transform: translateY(-50%) rotate(180deg);
    right: 40px
}

.links_box .links_next a:hover::after,
.links_box .links_pre a:hover::after {
    background-image: url(../image/news/arrow-right-dark.svg)
}

.pagination .wp-pagenavi {
    display: flex;
    justify-content: center;
    align-items: center
}

.wp-pagenavi a,
.wp-pagenavi span {
    padding: 8px 15px;
    text-decoration: none;
    transition: background-color .3s;
    margin: auto 10px;
    color: #000037;
    border: 1px solid #000037;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 500
}

/* .movie {
    margin: 120px auto;
    width: 60%;
    position: relative;
    padding-top: 33.75%
} */
.movie {
    margin: 80px auto;
    width: 60%;
    position: relative;
}
.movie iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.schoollist {
    margin: 100px auto
}

.schoollist_body,
.teachers .teachers_box {
    margin-top: 80px
}

.schoollist_body .list_grid {
    display: grid;
    gap: 40px
}

.schoollist_body .list_grid .item {
    background: #f0f0f1;
    border-radius: 10px 10px 0 0
}

.schoollist_body .list_grid .item img {
    border-radius: 10px 10px 0 0;
    transition: .7s
}

.schoollist_body .list_grid .item .school_img {
    position: relative;
    overflow: hidden
}

.schoollist_body .school_info {
    padding: 30px 20px
}

.schoollist_body .school_title {
    font-size: 20px;
    line-height: 36px;
    letter-spacing: .04em;
    font-weight: 600;
    color: #333
}

.schoollist_body .school_address {
    font-size: 14px;
    line-height: 28px;
    letter-spacing: .04em;
    font-weight: 600;
    color: #333;
    margin-top: 10px
}

.teachers {
    margin: 50px
}

.teachers_box .head_teacher {
    display: flex;
    align-items: center;
    color: #000037;
    gap: 80px;
    margin-top: 30px
}

.teachers_box .head_teacher_img {
    max-width: 350px;
    width: 100%;
    height: auto
}

.teachers .head_infor .title,
.teachers .teacher_txt .title {
    font-size: 22px;
    line-height: 32px;
    font-weight: 600
}

.teachers .head_infor .head_name {
    margin: 20px auto;
    font-size: 42px;
    letter-spacing: .04em;
    font-weight: 600
}

.teachers .head_infor .comment,
.teachers .teacher_txt .comment {
    font-size: 16px;
    line-height: 26px;
    letter-spacing: .01em;
    font-weight: 400
}

.teachers .teachers_grid {
    display: grid;
    gap: 60px
}

.teachers .teacher_txt .name {
    margin: 10px auto;
    font-size: 32px;
    letter-spacing: .04em;
    font-weight: 600
}

.bnr_wrap{
    max-width: 800px;
    margin: 260px auto 200px;
}

.bnr_wrap_2 {
    max-width: 1200px;
    margin: 130px auto 100px;
}

.bnr_wrap a:hover{opacity: 0.8;}

.bnr_wrap img{width: 100%;}

/*=======================
2023/07/19追加
=======================*/
.c-introduction_box.-top {
  text-align: center;
}

.c-introduction_box.-top .c-intro_title h3::after {
  left: 50%;
  transform: translateX(-50%);
}

.mv_sec .c-request_btn {
  margin-left: 40px;
}

@media screen and (max-width: 1200px) {
  .mv_sec .c-request_btn {
    margin-left: calc(40/1200*100vw);
  }
}

/*=======================
2023/07/31追加
=======================*/
section#gallery {
  margin: 80px auto;
  padding: 0 20px;
}
.gallery-box {
  grid-template-columns: 1fr 1fr 1fr;
  display: grid;
  gap: 40px 60px;
  margin-top: 20px;
}

.gallery-item {

}

.gallery-img img {
  object-fit: cover;
  width: 100%;
  height: 220px;
}

.gallery_txt {
  margin-top: 20px;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: .01em;
  font-weight: 400;
}

@media screen and (max-width: 1200px) {
  section#gallery {
    margin-top: 0;
    margin-bottom: calc(80/1200*100vw
    );
  }
  .gallery-box {
    gap: calc(60/1200*100vw);
  }

  .gallery-img img {
    height: calc(220/1200*100vw);
  }

  .gallery_txt {
    font-size: calc(16/1200*100vw);
    line-height: calc(26/1200*100vw);
  }
}

@media screen and (max-width: 768px) {
  section#gallery {
    padding: 0 0 0 20px;
    margin-bottom: calc(140/768*100vw );
  }
  .gallery-box {
    display: block;
  }

  .slick-list {
    overflow: visible;
    padding: 0 calc(60/768*100vw) 0 0 !important;
  }

  .slick-slide {
    margin-right: calc(50/768*100vw);
  }

  .slick-dots {
    right: 10px;
    bottom: -35px !important;
  }

  .slick-dots li button {
    width: calc(40/768*100vw) !important;
    height: calc(40/768*100vw) !important;
  }

  .slick-dots li button:before {
    width: calc(40/768*100vw) !important;
    height: calc(40/768*100vw) !important;
    font-size: calc(14/768*100vw) !important;
  }

  .slick-dots li.slick-active button:before {
    color: #000037;
  }

  .gallery-box .slick-prev {
    left: 10px;
  }

  .gallery-box .slick-next {
    right: 30px;
  }

  .gallery-box .slick-prev,
  .gallery-box .slick-next {
    top: calc(220/768*100vw);
    z-index: 100;
    width: calc(60/768*100vw);
  }

  .gallery-box .slick-prev::before,
  .gallery-box .slick-next::before {
    color: #000037;
    font-size: calc(60/768*100vw);
  }


  .gallery-img img {
    height: calc(420/768*100vw);
  }

  .gallery_txt {
    font-size: calc(28/768*100vw);
    line-height: calc(46/768*100vw);
    letter-spacing: .01em;
    font-weight: 400;
  }
}

/*=======================
2023/10/13追加
=======================*/
.section_intro {
    padding-top: 100px;
}

.section_intro .intro_lead {
    text-align: center;
    font-size: 22px;
    line-height: 32px;
    font-weight: 600;
    color: #000037;
    margin-bottom: 15px;
}

.section_intro .intro_title {
    text-align: center;
    font-size: 42px;
    letter-spacing: .04em;
    font-weight: 600;
    color: #000037;
    border-bottom: 2px solid rgba(0, 0, 0, 0.2);
    padding-bottom: 30px;
    margin-bottom: 50px;
}

.section_intro .intro_banner {
    margin: 30px auto 0;
    max-width: 850px;
}

.section_intro .intro_btn {
    text-align: center;
    margin-top: 30px;
}

.section_intro .intro_btn a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 500px;
    height: 110px;
    gap: 8px;
    background: linear-gradient(180deg, #ff7133 0%, #d74100 100%);
    border: 1px solid #d74100;
    font-size: 24px;
    color: #fff;
    font-weight: bold;
    border-radius: 50px;
    transition: .35s;
}

.section_intro .intro_btn a .small {
    font-size: 16px;
    font-weight: normal;
}

.section_intro .intro_btn a:hover {
    background: #fff;
    color: #d74100;
}

@media screen and (max-width: 768px) {
 .section_intro {
    padding: 0 20px;
    margin: calc(200/768*100vw) auto calc(16/768*100vw);
 }

 .section_intro .intro_lead {
    font-size: calc(34/768*100vw);
    line-height: calc(36/768*100vw);
    font-weight: 600;
 }
 .section_intro .intro_title {
    margin: calc(30/768*100vw) auto;
    font-size: calc(55/768*100vw);
    letter-spacing: .04em;
    font-weight: 600;
    padding-bottom: 15px;
 }

 .section_intro .intro_btn a {
    font-size: calc(34/768*100vw);
    border-radius: 50px;
    width: calc(600/768*100vw);
    height: calc(110/768*100vw);
    gap: 0;
 }
 
 .section_intro .intro_btn a .small {
    font-size: calc(26/768*100vw);
 }
}