@charset "utf-8";

@media only screen and (max-width: 1520px) {
    :root {
        --main_gap1: 40px;
    } 
    .main_grid{padding-left:40px; padding-right:40px; margin:0; width:auto}
    .grid1{padding-left:40px; padding-right:40px;}
    .main_visual .mvis.swiper-container-horizontal>.swiper-pagination-bullets{bottom: 40px; right: 34px;}
    #next_show{bottom: 40px;}

    #section1 .txt_show{width: calc(47% - 40px);}
    #section1 .images_show{width: calc(53% - 40px);}

    #section4 .wrap_contact .inner_ct{width: 100%; padding-left: 40px; padding-right: 40px;}

}

@media only screen and (max-width: 1340px) {
    #section4 .wrap_contact .info_contact{width: 100%;}
}


@media only screen and (max-width: 1280px) {
    #section1{padding-top: 80px; padding-bottom: 70px}	
    #section1 .txt_show{width: calc(50% - 20px); padding-top: 30px}
    #section1 .txt_show .title{font-size: 34px; line-height: 46px;}
    #section1 .txt_show .info_show{margin-top: 20px;}
    #section1 .txt_show .info_show .item{width: 98px;}
    #section1 .txt_show .program_show{display: block;}
    #section1 .txt_show .program_show .tit_pro{width: 100%; margin-bottom: 20px;}
    #section1 .images_show{width: calc(50% - 20px);}

    #section2{padding-top: 80px; padding-bottom: 10px}
    #section2 .list_member{margin-top: 60px;}
    #section2 .list_member > ul > li{margin-bottom: 80px;}
    #section2 .list_member .thumb{width: 170px;}
    #section2 .list_member .info_member{padding: 13px 20px 0;}
    #section2 .list_member .info_member .member_name strong{font-size: 24px;}
    #section2 .list_member .info_member .member_name span{font-size: 15px; margin-left: 8px;}
    #section2 .list_member .info_member > ul{margin-top: 15px;}
    #section2 .list_member .info_member > ul > li{font-size: 15px; line-height: 26px; margin-bottom: 5px;}
    #section2 .list_member > ul > li.no_thumb .info_member{padding: 13px 20px 0 0;}

    #section3{padding-top: 80px; padding-bottom: 80px;}
    #section3 .images_saya{max-width: 800px;}

    #section4 .contact{height: 480px;}
    #section4 .wrap_contact .info_contact .txt_set .address address{font-size: 15px;}

}

@media only screen and (max-width: 1200px) {
    #gnb > ul > li{margin: 0 5px;}
    
}


@media only screen and (max-width: 1023px) {
	.t_dsp{display:block}
	.t_dspn{display:none;}
    #gnb{display: none;}
    #footer .inner_footer{flex-direction: column; align-items: center; justify-content: center; text-align: center; padding-top:40px; padding-bottom: 80px}
    #footer .logo{padding-top: 0; margin-right: 0;}
    #footer .address{margin-top: 20px;}
    #family_site{margin: 25px auto;}
    #family_site .list_family{bottom: 0;}

    .sec_title .title{font-size: 34px; line-height:43px;}

    .main_visual .mvis_text .main_text{font-size: 45px; line-height: 58px;}
    .main_visual .mvis_text .info_txt{font-size: 18px;}
    .main_visual .mvis_text .btn_scroll a{width: 68px; height: 68px; border-radius: 34px;}
    #next_show{width: 174px; height: 224px; padding: 10px 10px 0; background-color: #fff; box-sizing: border-box; z-index: 100;}

    #section1{padding-top: 70px; padding-bottom: 60px}
    #section1 .sec_ct{flex-direction: column; margin-top: 35px;}
    #section1 .txt_show{width: 100%; order: 2; border-top: 0;}
    #section1 .images_show{width: 100%; order: 1;}
    #section1 .images_show .show_img .swiper-slide{height: 420px;}
    #section1 .images_show .show_img .swiper-slide img{height: 100%; object-fit: cover;}

    #section2{padding-top: 70px;}
    #section2 .list_member{margin-top: 50px;}
    #section2 .list_member > ul > li{width: 100%; margin-bottom: 60px;}
    #section2 .list_member .thumb{width: 190px;}
    #section2 .list_member .info_member{padding: 15px 20px 0 40px;}
    #section2 .list_member > ul > li.no_thumb .info_member{padding: 15px 80px 0 0;}

    #section3{padding-top: 70px; padding-bottom: 70px;}
    #section3 .txt_set{line-height: 28px;}
    #section3 .txt_set .main_text{font-size: 24px;}
    #section3 .txt_set p{font-size: 15px; line-height: 28px; margin-top: 16px;}

    #section4{padding-top: 70px;}
    #section4 .contact{height: auto; margin-top: 35px;}
    #section4 .contact > div{width: 100%;}
    #section4 .saya_map{height: 400px; order: 1;}
    #section4 .wrap_contact{padding-top: 45px; padding-bottom: 60px; order: 2;}

}



@media only screen and (max-width: 767px) {
    :root {
        --main_gap1: 20px;
    } 
    .m_dsp{display:block}
	.m_dspn{display:none;}
    .main_grid{padding-left:20px; padding-right: 20px;}
    .grid1{padding-left: 20px; padding-right: 20px;}
    .sec_title .title{font-size: 30px; line-height:40px;}

    #header .inner_header .row_header .inner_sc{padding-top: 0; height: 80px;}
    #header .inner_header .row_header h1 img{width: 104px;}
    #header .inner_header .row_header .btn_contact a{height: 32px; width:86px; border-radius:16px;}
    #header .inner_header .row_header .btn_contact span{font-size: 15px; line-height: 24px;}
    #btn_m_allmenu{margin-left: 5px;}
    #sidebar .top_sidenav{padding:20px 0 19px;}
    #sidebar .top_sidenav .logo img{width: 104px}
    #sidebar .top_sidenav .btn_x{top: 28px;}

    .main_visual .mvis_text .txt_en{font-size: 11px; margin-bottom: 8px;}
    .main_visual .mvis_text .main_text{font-size: 34px; line-height: 50px;}
    .main_visual .mvis_text .info_txt{font-size: 15px; margin-top: 12px;}
    .main_visual .mvis_text .btn_scroll a{width: 56px; height: 56px; border-radius: 28px; font-size: 13px;}
    .main_visual .mvis .swiper-button-next,
    .main_visual .mvis .swiper-button-prev{display: none;}
    .main_visual .mvis.swiper-container-horizontal>.swiper-pagination-bullets{right: 14px;}
    .main_visual .mvis.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin: 0 5px;}
    #next_show{bottom: 20px; width: 120px; height: 136px; padding: 8px 8px 0;}
    #next_show .info_show{margin-top: 8px;}
    #next_show .info_show .tit_next{font-size: 12px; background-position: right calc(50% - 2px);  background-size: 10px auto;}
    #next_show .info_show .date{display: none;}

    #section1{padding-top: 50px; padding-bottom: 50px}
    #section1 .sec_ct{margin-top: 30px;}
    #section1 .txt_show{padding-top: 20px;}
    #section1 .txt_show .title{font-size: 28px; line-height: 40px;}
    #section1 .txt_show .info_show{margin-top: 10px;}
    #section1 .txt_show .info_show > ul > li{font-size: 15px;}
    #section1 .txt_show .info_show .item{width: 86px;}
    #section1 .txt_show .program_show{display: block; padding-top: 30px;}
    #section1 .txt_show .program_show .tit_pro{width: 100%; margin-bottom: 20px;}
    #section1 .images_show .show_img{padding-bottom: 30px;}
    #section1 .images_show .show_img .swiper-slide{height: 220px;}
    #section1 .images_show .show_img .swiper-slide img{height: 100%; object-fit: cover;}
    #section1 .images_show .show_img.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}
    #section1 .images_show .show_img .swiper-pagination-bullet{width:10px; height:10px;}

    #section3{padding-top: 60px; padding-bottom: 70px; background-position: center bottom;}
    #section3 .images_saya .saya_img.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}
    #section3 .images_saya .saya_img .swiper-pagination-bullet{width:10px; height:10px}
    #section3 .txt_set{margin-top: 34px;}
    #section3 .txt_set .main_text{font-size: 20px; line-height: 30px; margin-left: -20px; margin-right: -20px;}
    #section3 .txt_set p{font-size: 15px; line-height: 28px; margin-top: 16px;}

    #section4{padding-top: 60px;}
    #section4 .saya_map{height: 260px;}
    #section4 .wrap_contact{padding-bottom: 70px;}
    #section4 .wrap_contact .inner_ct{padding-left: 20px; padding-right: 20px;}
    #section4 .wrap_contact .info_contact .txt_set .image{display: none;}

    
}

@media only screen and (max-width: 600px) {
    #section2{padding-top: 60px; padding-bottom: 0}
    #section2 .list_member{margin-top: 30px;}
    #section2 .list_member > ul > li{width: 100%; margin-bottom: 40px;}
    #section2 .list_member .thumb{width: 100%;}
    #section2 .list_member .info_member{padding: 0; margin-top: 30px;}
    #section2 .list_member > ul > li.no_thumb{display: block;}
    #section2 .list_member > ul > li.no_thumb .info_member{padding: 0;}
    #section2 .list_member > ul > li.no_thumb .info_member{margin-top: 0; margin-bottom: 30px;}
}