/* main_common */
.main_tit { text-align: center; font-weight: 700; font-size: 45px; color: #474747; }
.main_tit span { color: #349baa; }

/* main_about */
#main_about { padding: 70px 0; overflow: hidden; }
#main_about .contents { padding-top: 120px; position: relative; display: flex; flex-wrap: wrap; justify-content: initial; margin: -9px; } 
#main_about .contents > li { position: relative; width: 20%; padding: 9px; }
#main_about .contents > li:nth-of-type(n + 6) { margin-top: 4%; }
#main_about .contents > li a { position: relative; display: block; border-radius: 0; height: 170px; background-color: #daf4f7; overflow: hidden; }
#main_about .contents > li a .textbox { z-index: 2; position: relative; top: 50%; transform: translateY(-50%); text-align: center; padding: 0 20px; }
#main_about .contents > li a .textbox .text1 { font-weight: 700; font-size: 22px; color: #349baa; line-height: 1.3; transition: color 0.4s; } 
#main_about .contents > li a .textbox .text2 { display: none; font-weight: 500; font-size: 16px; color: #878787; line-height: 1.56; transition: color 0.4s; } 

#main_about .contents > li a::after { display: block; content: ''; z-index: 1; position: absolute; top: 0; left: 0; width: 100%; height: 0; background-color: #349baa; transition: height 0.4s; transform-origin: top; }

#main_about .contents > li .abouticon { z-index: 3; position: absolute; left: 50%; transform: translateX(-50%); top: -35px; width: 74px; }

#main_about .contents > li a:hover .textbox .text1 { color: #fff; }
#main_about .contents > li a:hover .textbox .text2 { color: #fff; }
#main_about .contents > li a:hover::after { height: 100%; }
@media (max-width: 1820px) {
    #main_about .contents { padding-top: 100px; }
    #main_about .contents > li a { height: calc(100px + 3vw); }   
    #main_about .contents > li .abouticon { width: 70px; top: -35px; }
}
@media (max-width: 1660px) {
    #main_about .contents > li { width: 25%; }
    #main_about .contents > li:nth-of-type(n + 6) { margin-top: initial; }
    #main_about .contents > li:nth-of-type(n + 5) { margin-top: 4%; }
}
@media (max-width: 1535px) {
    #main_about .contents { padding-top: 80px; }
}
@media (max-width: 1279px) {
    #main_about .contents { padding-top: 65px; }
    #main_about .contents > li .abouticon { width: 60px; top: -30px; }
    #main_about .contents > li a .textbox .text2 br { display: none; }
}
@media (max-width: 1230px) {
    #main_about .contents > li { width: 33.3333%; }
    #main_about .contents > li:nth-of-type(n + 5) { margin-top: initial; }
    #main_about .contents > li:nth-of-type(n + 4) { margin-top: 6%; }
}
@media (max-width: 1023px) {
    /* #main_about .contents > li { width: 48%; }
    #main_about .contents > li:nth-of-type(n + 4) { margin-top: initial; }
    #main_about .contents > li:nth-of-type(n + 3) { margin-top: 5%; } */
    /* #main_about .contents { display: block; padding-top: 40px; }
    #main_about .contents > li { width: calc(100% - 30px); margin-left: auto; }
    #main_about .contents > li:nth-of-type(n + 2) { margin-top: calc(15px + 1vw); } 
    #main_about .contents > li a { padding: 10px 20px; height: initial; }   
    #main_about .contents > li a .textbox { top: initial; transform: translateY(0);  }
    #main_about .contents > li a .textbox .text2 br { display: none; }
    #main_about .contents > li .abouticon { width: 50px; top: 50%; left: -25px; transform: translateY(-50%); }

    #main_about .contents > li a::after { top: initial; bottom: 0; transform-origin: bottom; } */

    /* #main_about .contents > li a::after { width: 0; height: 100%; transition: width 0.4s; transform-origin: left; }
    #main_about .contents > li a:hover::after { width: 100%; } */
}
@media (max-width: 767px) {
    #main_about .contents > li { width: 48%; }
    #main_about .contents > li:nth-of-type(n + 4) { margin-top: initial; }
    #main_about .contents > li:nth-of-type(n + 3) { margin-top: 6%; }
    #main_about .contents > li .abouticon { width: 54px; top: -27px; }
    #main_about .contents > li a { height: calc(70px + 2vw); }   
}
@media (max-width: 524px) {
    #main_about .contents { display: block; padding-top: 50px; }
    #main_about .contents > li { width: calc(100% - 30px); margin-left: auto; }
    #main_about .contents > li:nth-of-type(n + 2) { margin-top: calc(10px + 1vw); } 
    #main_about .contents > li a { padding: 10px 20px; height: initial; }   
    #main_about .contents > li a .textbox { top: initial; transform: translateY(0);  }
    #main_about .contents > li a .textbox .text2 br { display: none; }
    #main_about .contents > li .abouticon { width: 50px; top: 50%; left: -25px; transform: translateY(-50%); }

    #main_about .contents > li a::after { top: initial; bottom: 0; transform-origin: bottom; }

    #main_about .contents > li { width: calc(100% - 30px); }
    #main_about .contents > li a { padding: 10px 40px; border-radius: 0; }
    #main_about .contents > li .abouticon { width: 50px; left: -25px; }
}
@media (max-width: 460px) {
    #main_about .contents > li a { border-radius: 0; }
    #main_about .contents > li .abouticon { width: 50px; left: -25px; }
}

/* main_gall */
#main_gall { position: relative; padding: 70px 0 110px; overflow: hidden; }
#main_gall .gallCont { margin-top: 50px; }

/* main_info */
#main_info { position: relative; overflow: hidden; }
#main_info .contents { display: flex; flex-wrap: nowrap; }
#main_info .contents > li { position: relative; width: 50%; }
#main_info .contents .left::after { display: block; content: ''; position: absolute; right: 0; top: 0; width: 100vw; height: 100%; background-color: #349baa; }
#main_info .contents .right .mapcont { position: relative; width: 50vw; height: 100%; background: url(/image/main/info_bg.jpg) no-repeat center/cover; }
#main_info .contents .right .mapcont .root_daum_roughmap { display: none !important; width: 50vw; height: 100%; }
#main_info .contents .right .mapcont .root_daum_roughmap .wrap_map { width: 100%; height: calc(100% - 32px); height: 100%; }

#main_info .contents .left .textbox { z-index: 2; position: relative; padding: 70px 0; padding-right: 35px; }

#main_info .contents .left .textbox .text1 { padding-bottom: 30px; display: flex; flex-wrap: nowrap; align-items: center; font-weight: 700; font-size: 34px; color: #fff; border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
#main_info .contents .left .textbox .text1 * { font-weight: inherit; font-size: inherit; color: inherit; }
#main_info .contents .left .textbox .text1 dt { min-width: max-content; margin-right: 15px; }
#main_info .contents .left .textbox .text1 dt img { width: 67px; }

#main_info .contents .left .textbox .text2 { margin-top: 30px; display: flex; flex-wrap: nowrap; align-items: center; font-weight: 600; font-size: 30px; color: #fff; }
#main_info .contents .left .textbox .text2 * { font-weight: inherit; font-size: inherit; color: inherit; }
#main_info .contents .left .textbox .text2 dt { min-width: max-content; margin-right: 16px; }
#main_info .contents .left .textbox .text2 dt img { width: 42px; }

#main_info .contents .left .textbox .text3 { margin-top: 20px; display: flex; flex-wrap: nowrap; align-items: center; font-size: 18px; color: #fff; line-height: 1.65; }
#main_info .contents .left .textbox .text3 * { font-weight: inherit; font-size: inherit; color: inherit; line-height: inherit; }
#main_info .contents .left .textbox .text3 dt { min-width: max-content; margin-right: 16px; }
#main_info .contents .left .textbox .text3 dt img { width: 42px; }
#main_info .contents .left .textbox .text3 p { display: flex; flex-wrap: nowrap; }
#main_info .contents .left .textbox .text3 p:nth-of-type(n + 2) { margin-top: 12px; }
#main_info .contents .left .textbox .text3 p span { display: inline-block; }
#main_info .contents .left .textbox .text3 p span:first-of-type { min-width: 100px; width: 100px; }

@media (max-width: 1535px) {
    #main_info .contents .left .textbox { padding: 60px 0; padding-right: 25px; }

    #main_info .contents .left .textbox .text1 { padding-bottom: 25px; }
    #main_info .contents .left .textbox .text1 dt { margin-right: 15px; }
    #main_info .contents .left .textbox .text1 dt img { width: calc(35px + 2vw); }

    #main_info .contents .left .textbox .text2 { margin-top: 25px; }
    #main_info .contents .left .textbox .text2 dt, #main_info .contents .left .textbox .text3 dt { margin-right: 15px; }
    #main_info .contents .left .textbox .text2 dt img, #main_info .contents .left .textbox .text3 dt img { width: calc(20px + 1.4vw); }

    #main_info .contents .left .textbox .text3 { margin-top: 17px; }
    #main_info .contents .left .textbox .text3 p:nth-of-type(n + 2) { margin-top: 11px; }
}
@media (max-width: 1279px) {
    #main_info .contents .left .textbox { padding: 50px 0; padding-right: 20px; }

    #main_info .contents .left .textbox .text1 { padding-bottom: 20px; }
    #main_info .contents .left .textbox .text1 dt img { width: calc(25px + 1.7vw); }

    #main_info .contents .left .textbox .text2 { margin-top: 20px; }

    #main_info .contents .left .textbox .text3 { margin-top: 15px; }
    #main_info .contents .left .textbox .text3 p:nth-of-type(n + 2) { margin-top: 10px; }
}
@media (max-width: 1023px) {
    #main_info .contents .left .textbox { padding: 40px 0; padding-right: 15px; }

    #main_info .contents .left .textbox .text1 { padding-bottom: 15px; }

    #main_info .contents .left .textbox .text3 p:nth-of-type(n + 2) { margin-top: 9px; }
}
@media (max-width: 824px) {
    #main_info { background-color: #349baa; }
    #main_info .contents { display: block; }
    #main_info .contents > li { width: 100%; }
    #main_info .contents .left .textbox { padding-right: 0; padding: 20px 0;  }
    #main_info .contents .right { text-align: center; padding: 20px 0; padding-top: 0; }
    #main_info .contents .right .mapcont { display: inline-block; width: 100%; height: calc(150px + 15vw); }
    #main_info .contents .right .mapcont .root_daum_roughmap { width: 100%; }
    #main_info .contents .right .mapcont .root_daum_roughmap .wrap_map { width: 100%; height: calc(100% - 32px); }

}
@media (max-width: 360px) {
    #main_info .contents .left .textbox .text1 dt { margin-right: 10px; }
    #main_info .contents .left .textbox .text2 dt, #main_info .contents .left .textbox .text3 dt { margin-right: 10px; }
    #main_info .contents .left .textbox .text2 { justify-content: center; }
    #main_info .contents .left .textbox .text3 { display: block; }
    #main_info .contents .left .textbox .text3 dt { display: none; }
    #main_info .contents .left .textbox .text3 dd { text-align: center; }
    #main_info .contents .left .textbox .text3 p { display: inline-block; width: 255px; text-align: left; }
    #main_info .contents .left .textbox .text1 { display: block; text-align: center; }
    #main_info .contents .left .textbox .text1 dt { margin-right: initial; margin-bottom: 10px; }
}