@charset "utf-8"; /* CSS Document */
@media screen and (max-width:1730px){
}
@media screen and (max-width:1600px){
.box0,
.box1 { width: 96%; max-width: 96%; } 
}

@media screen and (max-width:1560px) { } 

@media screen and (max-width:1440px) { } 
@media screen and (max-width:1024px) { 
    .PHONE { display: block; } 
    .PC { display: none !important; } 

    .main_box{ padding: 4rem 0;}
    #header .gnb_wrap{ display: none;}
    .mainTop{ flex-direction: column; align-items: start; gap: 1rem; margin-bottom: var(--space-4);}

    /*sec_about*/
    #sec_about .AboutContainer{ flex-direction: column; gap: 2.5rem;}
    #sec_about .AboutContainer .aboutImgCon,
    #sec_about .AboutContainer .aboutInfo{ width: 100%;}
    #sec_about .AboutContainer .aboutImgCon{ margin-left: 0;}

    /*sec_gallery*/
    .gallery_table .tableItem{ flex-wrap: wrap;}
    .gallery_table .tableItem .tableCon{ width: calc((100% - 3rem) / 2);}

    /*promenu*/
    .dp1_gallery .subProCate > li{ width: calc((100% - .5rem) / 2);}

    /*allmenu*/
    #header .all_wrap .all_layer .all_inner .innerGuide{ display: none;}
    #header .all_wrap .all_layer .all_inner .innerLink .gnb > li > .dp1{ width: 8rem; min-width: 8rem;}
    
}


@media screen and (max-width:768px) {
    html { font-size: 14px } 
    
    /*gallery*/
    .gallery_table .tableItem{ flex-direction: column; }
    .gallery_table .tableItem .tableCon{ width: 100% !important;}
}

@media screen and (max-width:425px) { 

}

@media screen and (max-width:374px) { html { font-size: 13px } 
}

@media screen and (max-width:320px) { html { font-size: 12px } 
}