@media all and (max-width:1280px){
    .inner{padding-left: 2rem; padding-right: 2rem;}
    .hamburger-menu-wrapper{right: 2rem !important}
    .snb{right: 8rem;}

    .msec1 .swiper-slide-active .main01_01{left:2rem}
    .msec1 .swiper-slide-active .main01_02{right:2rem}


    .msec1 .swiper-slide .slogan .text1 em{display: block;}
    .msec1 .swiper-pagination{bottom: 5rem;}

    .main_top{flex-wrap: wrap;gap:0; padding:2rem}
    .main_top > div{width: auto;}
    .popupzone{width:50% !important; height: 37rem; overflow: hidden; position: relative; order:2}
    .popupzone img{width: 100%; height: 100%; object-fit: cover;}
    .banner{width: 50% !important; order:3}
    .main_board{width: 33% !important; order:1; padding-right: 3rem; padding-bottom: 3rem;}
    .main_board:last-child{padding-right: 0;}
    
    .main_business{background-position: top left;}    
    .main_business .inner{flex-direction: column;}
    .main_business h2 {text-align: center; margin-bottom: 3rem;}
    .main_business h2 span{display: inline-block; margin-left: 1rem;}

    .family_slide .swiper-button-prev{left:2rem}

    .vision_list li p{width: 17rem; height: 17rem;}

    .sub_top p{left:2rem}
}

@media all and (max-width:1024px){
    .menu{display: none;}

    .msec1{margin-top: 7rem;}
    /*.msec1 .swiper-slide .main_img img{width: 70%;}*/

    .main_business{background-size: 30%;}

    .sub_top{margin-top: 7.7rem;}

    .vision_list{flex-wrap: wrap;}
    .vision_list li{flex:none; width: calc(33% - 2rem);}
    .vision_list li p{margin: auto;}

    .business_top::before{width: 20rem;}
    

    

}
@media all and (max-width:1023px){
    html{font-size:9px}
    .hsec1 h1{width: 70%;}
    .snb{display: none;}

    .msec1 .swiper-slide .bg{height: 70vh;}
    .msec1 .swiper-slide .slogan{top: 20%;}

    /*.msec1 .swiper-slide .main_img p{width: 40%;}*/
    .msec1 .swiper-slide .main01_01{left: 2rem; top:40rem; display: none;}
    .msec1 .swiper-slide .main01_02{right: 2rem; top:30rem}
    .msec1 .swiper-slide .main03_02{right: 2rem; top:30rem}

    


    .msec1 .swiper-pagination{width: auto;}
    .msec1 .swiper-slide .slogan .text1{font-size: 3.8rem; letter-spacing: 0;}
    .msec1 .swiper-slide .slogan .text2{font-size: 2rem;}


    .main_board{width: 100% !important; padding-right: 0;}
    .popupzone{width: 100% !important; height: auto !important;}

    .banner{width: 100% !important;}
   
    .main_business h2{font-size: 2.5rem;}
    .main_business ul{flex-wrap: wrap; gap:2rem; margin-right: -2rem;}
    .main_business ul li{flex:none; width: calc(50% - 2rem);}

    .main_family h2{display: none;}
    .family_slide .swiper-button-next,
    .family_slide .swiper-button-prev{display: none;}

    /* 공통 */
    footer p{display: none;}
    .mid_menu{height: auto ;}
    .sub_top{margin-top: 7rem;}
    .sub_top p{left: auto; width: 30%;  right:2rem; top:30%}
    .sub_top h2{font-size: 3rem; text-align: left;}
    .h3{font-size: 3rem;}
    .h4{font-size: 2.5rem;}
    .s_tit{font-size: 2.3rem;}
    .s_tit br{display: none;}

    .re_menu{background: var(--main_color); align-items: center;}
    .re_menu > div > a{line-height: 1.2; padding:2rem 1rem; color:#fff; height: auto;}

    /* 인사말 */
    .greetings{flex-direction: column; gap:3rem}
    .greetings p{width: 100%;}

    /* 법인소개 */
    .info{flex-direction: column;}

    /* 비전 */
    .vision{padding: 5rem; text-align: center; font-size: 3rem;}
    .vision_list li{width: 100%;}

    /* 연혁 */
    .history_con{padding: 0;}
    .history_con::before{display: none;}
    .history_con dl{width: 100%; padding:0 0 0 3rem; text-align: left !important; margin-top:5rem;}
    .history_con dl:first-child{margin-top: 0;}
    .history_con dl::after{width: 3rem;}
    .history_con dl:nth-child(odd)::before{right: auto; left:-.5rem}
    .history_con dl:nth-child(odd)::after{right: auto; top:.5rem; left:0; }

    /* 오시는길 */
    .map{flex-direction: column;}
    .map_info{flex-basis: 100%;}
    .map_area{flex-basis: 100%;}

    /* 사업안내 */
    .business_top{flex-direction: column;}
    .business_top dl{padding: 3rem 0;}
    .business_top dl dt{font-size: 2.5rem;}
    .photo_list{flex-direction: column;}
    .tel_box{background-size: 40%; gap:2rem; padding: 2rem;}
    .tel_box p{flex:1}
    .tel_box dl{flex:3}
    .tel_box dl dd{font-size: 2.5rem;}

    /* 온라인 폼 */
    .online_form{flex-direction: column; gap:0}
    .online_form h3 p{display: none;}
    .form_area{width: 100%;}

    /* 후원안내 */
    .info_list{flex-direction: column;}

    /* 포토게시판 */
    .gall_row .col-gn-3{width: 100%;}
    .gall_row .col-gn-4{width: 100%;}

}


