@charset "utf-8";
/* CSS Document */

.res{ display:none}

@media screen and (max-width:1400px){
.res.w1400{ display: block}

html:not(.allOn) #header .top_wrap .gnb_wrap{ margin-right: 0;}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp1 .va:after, html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp1 .tt{ font-size: 1.063em;}

}
@media screen and (max-width:1280px){
.res.w1280{ display: block}
body{ font-size:15px}


/*all*/
.mainBox .wrapF{ gap: 2em 8vmin;}
.mainTit .tit1{ font-size: 6.5vmin;}
.mainTit .tit1 .ts{ font-size: 4vmin;}
.mainBox{ padding: 8vmin 0;}

/*header*/
#header .top_wrap .wrapF{ justify-content: space-between;}
html:not(.allOn) #header .top_wrap .gnb_wrap{ display: none;}

/*visual*/
.visualSlide_wrap .slogan .t1{ font-size: 4vmin;}
.visualSlide_wrap .slogan .t2{ font-size: 7vmin;}
.mainScroll{ display: none;}

/*brand*/
.mainBasicSlideW.brand .swiper-slide{ width: 60%;}

/*product*/
.productSubList.w2 .subProList{ width: calc((100% - 2rem) / 3);}

/*proview*/
.mall_view_top{ flex-direction: column;}
.mall_view_top .prod_info,
.overviewSlider_wrap{ width: 100%;}

/*about*/
.mainBox .wrapF.dRow .grow{ }
.mainAbout .imgW > li:nth-child(odd){ margin-top: 0;}

/**/
.prosearchCon .find_WrapCon{ width: 100%;}
.prosearchCon{ padding: 2.5rem;}

/*footer*/
#footer{ position:relative;}
#footer .wrapF{ flex-direction: column; align-items: start; gap: 2em;}
#footer .logo img{ height: 2.815em;}
#footer .menu_wrap{ position: absolute; right: 4em; top: 5em;}


}
@media screen and (max-width:1024px){
.res.w1024{ display: block}
body{ font-size:13px}





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

/*all*/
.mainBox .wrapF.dRow{ flex-direction: column;}
.mainBox .wrapF.dRow .grow{ height: 27.5rem; gap: 2rem; flex: unset;}
#contents .sub_top_wrap{ height: 30vh;}
#contents .sub_top_wrap .subTab{ display: none;}
.input_st.s3{ font-size: 12px; min-width: 100px; height: 35px; padding: 0 10px;}

.allOn #header .top_wrap .gnb_wrap{ padding: 0;}
.allOn #header .top_wrap .gnb_wrap .gnb{ flex-wrap: wrap;}
.allOn #header .top_wrap .gnb_wrap .gnb > li{ flex: 1 1 33.33%; max-width: 33.33%; text-align: left;}
.allOn #header .top_wrap .gnb_wrap .gnb > li:last-of-type{ padding-bottom: 0;}
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp1{ align-items: start; justify-content: start; height: fit-content; margin-bottom: 1.5em;}
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp1 .tt{ font-size: 1.515em;}
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a .tt{ font-size: .846rem;}
.productTop .result .num,
.productTop .result .tt{ font-size: 16px;}

 .proViewTable {
        table-layout: auto;
    }

    .proViewTable tbody,
    .proViewTable tbody tr,
    .proViewTable tbody tr th,
    .proViewTable tbody tr td {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }
     .proViewTable colgroup {
        display: none;
    }

    .proViewTable tbody tr th,
    .proViewTable tbody tr td,
    .proViewTable tbody tr dt {
        font-size: 0.875rem;
        line-height: 1.4;
        letter-spacing: -0.02rem;
    }

    .proViewTable tbody tr th {
        padding: .5em 1em;
        background: #f7f7f7;
    }

    .proViewTable tbody tr td {
        padding: .5em 1em;
    }

    .proViewTable tbody tr:has(dl) th {
        padding: 1rem 0.75rem 0.5rem;
        vertical-align: initial;
    }

    .proViewTable tbody tr:has(dl) td {
        display: block;
        padding: 0;
        font-size: 0;
    }

    .proViewTable tbody tr td dl {
        display: flex;
        width: 100%;
        gap: 0.5rem;
        padding: 1rem 0.75rem;
        box-sizing: border-box;
    }

    .proViewTable tbody tr td dl:first-child {
        border-top: 0;
    }

    .proViewTable tbody tr td dl dd {
        font-size: 0.8125rem;
        line-height: 1.4;
        letter-spacing: -0.015rem;
        word-break: keep-all;
    }

    .gallSt .conW .tit .t2{ font-size: 2.35em;}
    .gallSt .conW .tit .t1.s1{ font-size: 1.15em;}


/*footer*/
#footer{ position:relative;}
#footer .wrapF{ flex-direction: column; align-items: start; gap: 2em;}
#footer .logo img{ height: 2.815em;}
#footer .menu_wrap{ position: absolute; right: 4em; top: 5em;}

/*about*/
.greeting_wrapper{ flex-direction: column; gap: 2em;}
.greeting_wrapper .left{ width: 100%;}
.greeting_wrapper .left > .imgCon{ width: 40%; height: 17rem;}
.greeting_wrapper .right{ width: 100%;}
.greeting_wrapper .right > .txtArea > .tt{ font-size: 1.315em;}

/*product*/
.productSubList.w2 .subProList{ width: calc((100% - 1rem) / 2);}
.productContainer .proBtm > .con > .kn{ font-size: 18px;}

/*proview*/
.mall_view_top .prod_info .tit_wrap .tit{ font-size: 2.315em;}
.mall_view_top .prod_info .tit_wrap .simTit{ font-size: 1.215em;}
.mall_view_top .prod_info .downloadCon > .tit{ font-size: 1.315em;}
.board_faq > li .wrap_in .ico .arrow{ font-size: 1.5em;}

/*sns*/
.sns_st > li > a{ width: 2.5em; height: 2.5em; min-width: 2.5em;}

/*history*/
.history-list > li > dl{ padding-left: calc(10%);}
.history-list > li::before{ margin: unset; left: 5%; display: none;}
.history-list > li > dl > dt{ top: -55px; left: 10%; right: unset; padding-right: unset;}
.history-list > li > dl > dt::before{ right: unset; left: -15%;}
.history-list > li > dl > dd{ padding-left: unset;}
.history-list > li:nth-child(even) > dl > dt{ left: 0;}
.history-list > li:nth-child(even) > dl > dt::before{ left: -15%;}
.history-list > li:nth-child(even) > dl > dd.history-year > .month-item{ flex-direction: unset;}
.history-list > li:nth-child(even) > dl > dd.history-year > .month-item > .event-list{ text-align: left;}
.history-list > li:nth-child(even) > dl{ padding-right: unset; padding-left: 10%;}

/*inquiry*/
.form_wrap .form > li:not(.w100){ width: 100%;}

/*location*/
.locationContainer .loadmap .wrap_map{ height: calc(var(--vh, 1vh) * 40) !important;}
.locationContainer .mapInfoWrap{ flex-direction: column; padding: 2rem;}
.locationContainer .mapInfoWrap .leftInfo{ width: 100%;}
.locationContainer .mapInfoWrap .rightInfo{ width: 100%;}
.locationContainer .mapInfoWrap .rightInfo .mapOpen > li > .in{ min-height: calc(var(--vh, 1vh) * 15);}
.locationContainer .mapInfoWrap .leftInfo > .contactInfo > li > .con > .titCon > .tit{ min-width: fit-content;} 
.locationContainer .mapInfoWrap .leftInfo > .contactInfo > li > .con > .titCon{ align-items: center;}

.contractWrap .diagramBox, .contractWrap .contractList{ width: 100%;}
.contractWrap .diagramBox .arrow-container{ top: -4.5rem;}
.contractWrap .diagramBox .imgCon{ background: var(--color-point4); border-radius: var(--radius-lg);}

}

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

/*all*/
.mainTit .tit1 .ts{ font-size: 6.5vmin;}
.mainTit .tit1{ font-size: 8.5vmin;}
.mainTit .tt1.s1{ font-size: 1.35em;}
.productTop .result .num,
.productTop .result .tt{ font-size: 14px;}
#contents .sub_top_wrap .subTit .t1{ font-size: 2.415em;}

/*about*/
.mainBox .wrapF.dRow .grow{ height: 12.5rem; gap: 1rem;}
.greeting_wrapper .right > .txtTop > .tit{ font-size: 1.815em;}

/*visual*/
.visualSlide_wrap .slogan .t1{ font-size: 5vmin;}
.visualSlide_wrap .slogan .t2{ font-size: 8vmin;}

/*brand*/
.mainBasicSlideW.brand .swiper-slide{ width: 90%;}

/*about*/
.greeting_wrapper .left > .imgCon{ height: 15rem;}

/*product*/
.productSubList .subProList,
.productSubList.w2 .subProList{ width: 100%;}

/*history*/
.history-list > li > dl > dt.year{ font-size: 1.815rem; left: 10%; padding-left: 0;}
.history-list > li > dl > dd.history-year{ font-size: 1em;}
.history-bg{ height: 18svh;}
.history-bg .txt-wrap > .tt{ font-size: 2rem;}

/*footer*/
#footer .menu_wrap{ right: 2em;}
#footer .logo img{ height: 2.25em;}

/*search*/
#findPro{ flex-direction: column;}
#findPro .input_st.label{ width: 100%;}
.prosearchCon{ padding: 1.5rem 2rem;}
#findPro .input_st{ height: 3rem; padding: 0 3rem 0 1.25rem;}
#findPro .sech{ top: 77.5%;}

}
@media all and (orientation:landscape){

}