@charset "UTF-8";

/*해상도가 1024이하*/
@media(max-width:1200px){
}

@media(max-width:1024px){

}

@media all and (min-width: 1024px) and (max-width: 1200px) {
	
}

@media(max-width:970px){

}

@media all and (min-width:320px) and (max-width:1023px){
    .site-wrap .header-down-btn {
        display: none;
    }
    .site-wrap #header {
        padding: 10px 70px;
    }
    .site-wrap #header .header_wrap > .gnb {
        display: none;
    }
    .site-wrap #header h1.logo a {
        width: 140px;
        font-size: 0;
        font-family: Pretendard;
        background: url(../img/main/logo.png) center no-repeat;
        background-size: contain;
    }
    .site-wrap #header.type2 h1.logo a {
        width: 140px;
        font-size: 0;
        font-family: Pretendard;
        background: url(../img/main/logo2.png) center no-repeat;
        background-size: contain;
    }
 
    #m_gnb {display: block;
        position: absolute; right:0; top:12px;
    }
    #m_close { position: fixed;right: 20px; top: 20px; z-index: 99999999; cursor: pointer;}
    .header_wrap{padding-left:10px; padding-right:10px; box-sizing: border-box;
        > .gnb {display: none;}
    }

    .site-wrap #header.type2 .gnb li a {color:#fff;}
    .header_wrap {        justify-content: center !important;
        .gnb {position: fixed;top: 0; right: 0;
            width: 80%;height: 100%;
            background: /*#322f8e*/#121052;border-top: none;
            z-index: 9999999;
            padding-top: 40px; flex-direction: column;
            >li { width: 100%; text-align: center; background: none;  flex-direction: column;
                >a {display: inline-flex;justify-content: center; align-items: center;
                    width: auto;height: 50px; font-size: 18px;}

                    > ul.ulDepth2 {position: static !important;
                        padding: 10px 0; background: #272477 !important;
                        &::before {display: none;}
                    }
                &.on {
                    >a {border-bottom: 2px solid #8986e8;}
                }     
                &:hover ul.ulDepth2 {display: block !important;}
            }
        }
    }
    .custom-controls-wrap {right: 0; left: 0; margin:0 auto}
    #custom-controls {
        /* justify-content: center; */
        scale: 0.9;
    }
    .witwork-info-wrap .left-area {
        text-align: center;
    }
    .witwork-info-wrap .right-area {
        margin-top:50px;
        flex-direction: column;
        gap: 0;
    }
    .witwork-info-wrap .right-area .second-img {
        margin-top:50px;
    }
    .witwork-info {
        background-size:contain ;
        padding-top:70px;
    }
    .solution-info {padding:100px 0;}
    .solution-info .solution-info-wrap {
        flex-direction: column;
        align-items: center;
        gap: 30px;
    }
    .our-work .our-work-wrap {
        padding-top:50px;
    }
    .our-work .our-work-wrap .work-gallery-container .work-gallery-wrap {
        flex-direction: column;
    }
    .our-work .our-work-wrap .work-gallery-container .work-gallery-wrap .work-gallery {
        height: 100%;
        width: 100%;
    }
    .our-work .our-work-wrap .work-gallery-container .work-gallery-wrap .work-gallery .grallery {
        max-width: 100% !important;
        max-width: 100% !important;
        width: 100% !important;
        display: block  !important;
    }
    .our-work .our-work-wrap .work-gallery-container .work-gallery-wrap .work-gallery .grallery .link-wrap {
        justify-content: center;
     
    }
    .our-work .our-work-wrap .work-gallery-container .work-gallery-wrap .work-gallery .grallery .grallery-img-wrap img {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        /* max-height: 384px; */
    }
    .our-work .our-work-wrap .more-btn-wrap {margin-top:100px;}
    .solution-info .solution-info-wrap .right-area .sol-list {
        width: 100%;
    }
    .solution-info .solution-info-wrap .right-area .sol-list li {
        width: 100%;
    }
    .solution-info  {padding:0 20px; box-sizing: border-box;}
    .solution-info .right-area {
        width: 100%;
        padding-bottom: 70px;
    }
    .solution-info .left-area {
        text-align: center;
        width: 100%;
        padding-top: 70px;
    }
    .our-work .our-work-wrap .work-gallery-container .work-gallery-wrap .work-gallery .grallery .grallery-img-wrap {
        /* margin:0 20px; */
        padding: 0 20px;
        width: 100%;
        box-sizing: border-box;
    }
    .our-work .our-work-wrap .work-gallery-container .work-gallery-wrap .work-gallery .grallery .grallery-img-wrap img {
        border-radius: 20px;
    }

    #sub_wrap {
        padding-top:65px;
    }
    #sub_wrap .top h2 {
        padding:30px 0;
        font-size: 36px;
    }
    .sub0101 .img-wrap,
    .sub0102 .img-wrap,
    .sub0105 .img-wrap {
        height: 100px;
    }
    .google-map-wrap,
    .sub0103 .sel-wrap {
        padding:0 15px; box-sizing: border-box;
    }
    /* .sub0101 {
        overflow: hidden;
    } */
    .sub0101 .title-wrap .main-title,
    .sub0102 .title-wrap .main-title {
        font-size: 30px;
        line-height: 33px;
    }
    .sub0105 .google-map-wrap .address-wrap {
        word-break: keep-all;
    }
    .sub0102 .list-wrap > ul > li > div .tit {
        font-size: 22px;
    }
    .sub0102 .title-wrap .sub-title {
        font-size: 18px;
    
    }
    .sub0101 .info-wrap {
        flex-direction: column;
    }
    .sub0101 .info-wrap .text,
    .sub0101 .info-wrap .img {
        width: 100%;
        background-size: cover;
    }
    .sub0101 .title-wrap,
    .sub0102 .title-wrap {
        padding:80px 20px;
        
    }
    .sub0101 .info-wrap .text {
        padding:40px 10px;
        text-align: center;
    }
    .sub0101 .info-wrap .text span {
        text-align: center;
        font-size: 20px;;
        padding-bottom: 0;;
    }
    .sub0101 .title-wrap .main-title2 {
        font-size: 30px;
        word-break: keep-all;
    }
    .sub0101 .vision-wrap h3 {
        font-size: 30px;
    }
    .sub0101 .vision-wrap ul {
        flex-direction: column;
        padding:0 10px; 
        box-sizing: border-box;
    }
    .sub0101 .vision-wrap ul li {
        width: 100%;
    }
    .sub0101 .info-wrap,.sub0101 .vision-wrap,.sub0101 .history-wrap {
        height: auto;
    }
    .sub0101 .history-wrap {
        min-height: 200px;
    }
    .sub0101 .info-wrap .img {
        min-height: 200px;
    }
    .sub0102 .list-wrap > ul {
        flex-direction: column;
    }
    .sub0102 .list-wrap > ul > li {
        width: 100%;
    }
    .board-wrap .data_view, .board-wrap .default_bd_post {
        padding:70px 10px;
        box-sizing: border-box;
    }
    .our-work .our-work-wrap {
        overflow: hidden;
    }
    .our-work .our-work-wrap .more-btn-wrap button,
    .witwork-info-wrap .left-area .info-btn-wrap button {
        height: 40px;
    }
    .our-work .our-work-wrap .more-btn-wrap button span,
    .witwork-info-wrap .left-area .info-btn-wrap button span {
        font-size: 16px;
    }
    .footer_info address a{
        color:#000; display: inline-block;
        
    }

}

@media(max-width:640px){
    .witwork-info-wrap .left-area .sub-tit,
    .solution-info .solution-info-wrap .left-area .sub-tit {word-break: keep-all;}
    .witwork-info-wrap .left-area .main-tit,
    .solution-info .solution-info-wrap .left-area .main-tit {
        font-size: 30px;
    }
    .sub0101 .history-wrap .history-guide {display: flex; justify-content: center;}
    .sub0101 .history-wrap {
        background: none;
    }
    .sub0101 .history-wrap .history-img-wrap{display: block;}
    .sub0101 .vision-wrap ul li .img-wrap {
        scale: 0.7;
    }
    .sub0101 .vision-wrap ul li div {
        font-size: 16px;
    }
    .sub0101 .title-wrap .main-title2 {
        font-size: 25px;
    }
    .sub0102 .list-wrap > ul {
        padding:30px;
    }
    .default_bd_post form > div .tit {
        width: 100px;
    }
    
}

@media(max-width:480px){
    #footer {
        padding:20px 20px;
        box-sizing: border-box;
    }
    .witwork-info {
        padding-left:10px;
        padding-right:10px;
    }
    .bx-wrapper { min-height: 150px; /* 데스크톱에서 최소 높이 */}
    .bx-viewport,
    .bx-wrapper .bxslider,
    .bx-wrapper .bxslider .sliderLi,
    .bx-wrapper li img {
    height: 150px !important;
    }
}

@media(max-width:320px){


}


@media(max-height:360px){

}