/* 0101 인사말 */
#greeting{display: flex; flex-wrap: wrap; gap: 6rem 2rem;}
    #greeting .textArea{width: calc((100% - 2rem)/2);}
    #greeting .textArea h4{font-size: 3.5rem; line-height: 4.5rem; color: #111111; font-weight: 500; margin-bottom: 3rem;}
    #greeting .textArea p:not(.ceo){font-size: 1.8rem; line-height: 2.8rem; color: #555555; }
    #greeting .textArea p + p{margin-top: 1.5rem;}
    #greeting .textArea p span.fw500{color: #111111;}
    #greeting .textArea p.ceo{font-size: 2.2rem; line-height: 1.25; color: #111111; font-weight: 500; margin-top: 4.5rem;}

    #greeting .imgArea{width: calc((100% - 2rem)/2); position: relative; display: flex; justify-content: flex-end;}
    #greeting .imgArea .ab{position: absolute; top: 40%; right: -15rem; width: 30rem; transition: all ease 0.3s;}

/* 0102 지속가능경영 */
#management{}
    .onlyImg{text-align: center;}
    .onlyImg img{display: inline-block;}

    .management_tabWrap{}
    .management_tabWrap .tabNav{max-width: 77rem; width: 100%; margin: 0 auto 9rem; display: flex; flex-wrap: wrap; gap: 1rem;}
    .management_tabWrap .tabNav li{width: calc((100% - 2rem)/3); cursor: pointer; font-size: 2.2rem; line-height: 1; color: #999999; font-weight: 500; padding: 0 0 2.5rem; border-bottom: 0.5rem solid #ccc; transition: all ease 0.3s;}
    .management_tabWrap .tabNav li:is(.active, :hover){color: #111; font-weight: bold; border-bottom-color: var(--point);}

    .management_tabWrap .tabContents{text-align: center; max-width: 110rem; width: 100%; margin: 0 auto; display: none;}
    .management_tabWrap .tabContents.active{display: block;}
    .management_tabWrap .tabContents .title{font-size: 3.5rem; line-height: 1; color: #111111; font-weight: bold; margin-bottom: 2rem; }
    .management_tabWrap .tabContents .subTitle{font-size: 2.5rem; line-height: 1.5; color: #111111; font-weight: 500; margin-bottom: 1rem; }
    .management_tabWrap .tabContents .text{font-size: 2rem; line-height: 1.5; color: #555555;}

    .management_tabWrap .cont_01_ul{max-width: 90rem; width: 100%; height: 10rem; margin: 6rem auto; position: relative;}
    .management_tabWrap .cont_01_ul li{position: absolute; max-width: 33rem; width: 100%; height: 10rem; border-radius: 5rem; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 1rem;}
    .management_tabWrap .cont_01_ul li p{ font-size: 2.5rem; line-height: 1; color: #fff; font-weight: bold;}
    .management_tabWrap .cont_01_ul li span{font-size: 1.6rem; line-height: 1; font-weight: 500; color: #fff;}
    .management_tabWrap .cont_01_ul li:nth-of-type(1){background-color: rgba(103,103,103,0.75); left: 0;}
    .management_tabWrap .cont_01_ul li:nth-of-type(2){background-color: rgba(113,184,68,0.75); left: 50%; transform: translateX(-50%);}
    .management_tabWrap .cont_01_ul li:nth-of-type(3){background-color: rgba(7,168,207,0.75); right: 0;}

    .management_tabWrap .cont_01_link{padding: 2rem 7rem; border: 1px solid #ddd; border-radius: 1rem; background-color: #f5f5f5; font-size: 1.8rem; line-height: 1; color: #999999; font-weight: 500; display: inline-block;}

    .management_tabWrap .cont_03_ul{display: flex; flex-wrap: wrap; gap: 2rem; margin: 6rem auto 0;}
    .management_tabWrap .cont_03_ul li{width: calc((100% - 2rem)/2); height: 26rem; border: 1px solid #ddd; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 1rem;}
    .management_tabWrap .cont_03_ul li .logoArea{height: 8.6rem; display: flex; align-items: center;}
    .management_tabWrap .cont_03_ul li .link{width: 14.5rem; height: 4.5rem; border: 1px solid var(--point); border-radius: 1rem; font-size: 1.6rem; line-height: 4.5rem; color: #8cb53c; font-weight: 500; text-align: center;}

/* 0103 CI 소개 */
.sub_ul01{}
.sub_ul01 li{padding: 0 0 0 1rem; font-size: 1.8rem; line-height: 2.7rem; color: #555555; position: relative;}
.sub_ul01 li + li {margin-top: 0.5rem;}
.sub_ul01 li::before{position: absolute; content: ''; width: 0.4rem; aspect-ratio: 1/1; top: 1.35rem; left: 0; margin-top: -0.2rem; background-color: var(--point);}

    .ci_banner{padding: 6rem 10rem; background-color: #f7faf0;}
    .ci_banner ul{display: flex; flex-wrap: wrap; gap: 2rem;}
    .ci_banner ul li{position: relative; width: calc((100% - 8rem)/5);}
    .ci_banner ul li + li::before{position: absolute; content: ''; width: 2rem; height: 2rem; top: 6rem; left: -2rem; margin-top: -1rem; background-image: url('/images/sub/ci_plus.png'); background-size: cover;}
    .ci_banner ul li .s{margin-bottom: 2.5rem; display: flex; justify-content: center; text-align: center;}
    .ci_banner ul li .s p{width: 12rem; aspect-ratio: 1/1; border-radius: 50%; display: flex; align-items: center; justify-content: center; background-color: #8cb53c; font-size: 4rem; line-height: 1; color: #fff; font-weight: bold; font-family: var(--mon);}
    .ci_banner ul li .textArea{text-align: center;}
    .ci_banner ul li .textArea h4{font-size: 2rem; line-height: 1; color: #111; font-weight: bold; margin-bottom: 1rem;}
    .ci_banner ul li .textArea p{font-size: 2rem; line-height: 1.25; color: #555; }

    .ci_etc{margin: 8rem auto; display: flex; flex-wrap: wrap; gap: 3rem 0; justify-content: space-between;}
    .ci_etc li{width: calc((100%)/3); padding: 0 5rem; background-color: #fff;}
    .ci_etc li + li{border-left: 1px solid #ddd;}
    .ci_etc li h4{font-size: 2.2rem; line-height: 1; color: #111; font-weight: bold; margin-bottom: 2rem;}
    .ci_etc li p{font-size: 1.8rem; line-height: 2.8rem; color: #555555;}

    .ci_article{}
    .ci_article .box{margin-bottom: 8rem;}
    .ci_article .box h4{font-size: 2.2rem; line-height: 2.6rem; color: #111; font-weight: bold; margin-bottom: 2rem;}
    .ci_article .box h4 span{color: #555555; font-weight: 300;}
    .ci_article .box .ci{
        display: flex; align-items: center; justify-content: space-around; gap: 6rem 3rem; flex-wrap: wrap; min-height: 32rem;
        position: relative; border: 1px solid #ebebeb;  background-size: 1rem, 3rem, 1rem 1rem, 3rem 3rem;
        background-image: linear-gradient(90deg, #ebebeb 1px, transparent 1px), linear-gradient(90deg, #ebebeb 1px, transparent 1px), linear-gradient(#ebebeb 1px, transparent 1px), linear-gradient(#ebebeb 1px, transparent 1px);
    }
    .ci_article .box .ci.p6{padding: 6rem 2rem;}
    .ci_article .box .ci.p6 .ab{position: absolute; bottom: 6rem; right: 5rem; width: 18.7rem;}

/* 0106 본사 */
.mapWrap{display: flex; flex-wrap: wrap; border: 1px solid #ddd;}
.mapWrap .infoArea{padding: 3rem; width: 36rem;}
.mapWrap .infoArea .imgArea{margin-bottom: 2.5rem;}
.mapWrap .infoArea .imgArea img{max-width: none; width: 100%;}
.mapWrap .infoArea .corporation{padding: 0 0 2rem; border-bottom: 1px solid #ddd;}
.mapWrap .infoArea .corporation .agency{font-size: 2rem; line-height: 1; color: #111111; font-weight: 500; margin-bottom: 1rem;}
.mapWrap .infoArea .corporation .call{position: relative; padding-left: 3rem; font-size: 2.5rem; line-height: 3rem; color: #8cb53c; font-weight: bold; }
.mapWrap .infoArea .corporation .call::before{position: absolute; content: ''; width: 2.2rem; aspect-ratio: 1/1; display: inline-block; background-image: url('/images/sub/icon_call_color.png'); background-size: cover; top: 1.5rem; left: 0; margin-top: -1.1rem;}
.mapWrap .infoArea .infoIn{margin: 3rem 0 0;}
.mapWrap .infoArea .infoIn .info li{}
.mapWrap .infoArea .infoIn .info li + li{margin-top: 2rem;}
.mapWrap .infoArea .infoIn .info li .title{font-size: 1.7rem; line-height: 1; color: #555555; font-weight: bold; margin-bottom: 1rem;}
.mapWrap .infoArea .infoIn .info li .info{font-size: 1.7rem; line-height: 2.7rem; color: #555;}
.mapWrap .infoArea .infoIn .info li .info .jibun{display: inline-block; padding: 0.25rem; border: 1px solid #ddd; background-color: #f5f5f5; box-shadow: 0 1px 2px rgba(0,0,0,0.5);}
.mapWrap .infoArea .infoIn .mapLink{display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 3rem;}
.mapWrap .infoArea .infoIn .mapLink a{display: flex; align-items: center; justify-content: center; padding: 1rem; text-align: center; width: calc((100% - 0.5rem)/2); font-size: 1.6rem; line-height: 1; font-weight: 500; border-radius: 0.3rem; border: 1px solid #ddd;} 
.mapWrap .infoArea .infoIn .mapLink a:nth-of-type(1){background-color: #8cb53c; color: #fff; border-color: #8cb53c;}
.mapWrap .infoArea .infoIn .mapLink a:nth-of-type(2){background-color: #f5f5f5; color: #999999;}

.mapWrap .mapArea{width: calc(100% - 36rem);}

html .root_daum_roughmap{width: 100%; height: 100%;}
html .root_daum_roughmap .wrap_map{width: 100%; height: 100%;}
html .wrap_controllers{display: none;}

/* 0107 국내 사업장 */
.map_tapWrap .tabNav{max-width: 77rem; width: 100%; margin: 0 0 3rem; display: flex; flex-wrap: wrap; gap: 1rem;}
.map_tapWrap .tabNav li{width: calc((100% - 2rem)/3); cursor: pointer; font-size: 2.2rem; line-height: 1; color: #999999; font-weight: 500; padding: 0 0 2.5rem; border-bottom: 0.5rem solid #ccc; transition: all ease 0.3s;}
.map_tapWrap .tabNav li:is(.active, :hover){color: #111; font-weight: bold; border-bottom-color: var(--point);}

.map_tapWrap .tabContents{display: none;}
.map_tapWrap .tabContents.active{display: block;}

/* 0109 주요고객사 */
#partners{}
    #partners .in{padding: 5rem 2rem; background-color: #f8f8f8;}
    #partners .in .mapArea{max-width: 112rem; margin: 0 auto; position: relative;}
    #partners .in .mapArea .ab{position: absolute; width: 2rem; aspect-ratio: 1/1; border-radius: 50%;background-color: rgba(255,102,0, 1);border: 0.5rem solid rgb(255 255 255 / 85%); cursor: pointer;}
    #partners .in .mapArea .ab p{font-size: 1.6rem;line-height: 1;color: #111111; text-shadow: 1px 1px 1px rgba(255,255,255,0.85); font-weight: bold;text-align: center;position: absolute;top: 2rem;left: 50%;transform: translateX(-50%);}
    /* #partners .in .mapArea .ab p::before{position: absolute;content: '';top: 0;left: 50%;transform: translateX(-50%);} */
    #partners .in .mapArea .ab.p1{top: 40%;left: 20%;}
    #partners .in .mapArea .ab.p2{top: 51%;left: 18%;}
    #partners .in .mapArea .ab.p3{top: 69%;left: 32%;}
    #partners .in .mapArea .ab.p4{top: 39%;left: 44%;}
    #partners .in .mapArea .ab.p5{top: 34%;left: 48%;}
        #partners .in .mapArea .ab.czech p{top: 0; left: -2rem;}
    #partners .in .mapArea .ab.p6{top: 38%;left: 50%;}
        #partners .in .mapArea .ab.italy p{top: 0;left: auto;right: -9rem;}
    #partners .in .mapArea .ab.p7{top: 31%;left: 50%;}
        #partners .in .mapArea .ab.poland p{top: -2rem;  }
    #partners .in .mapArea .ab.p8{top: 53%;left: 67.5%;}
    #partners .in .mapArea .ab.p9{top: 64%;left: 74%;}
    #partners .in .mapArea .ab.p10{top: 43%;left: 77%;}
    #partners .in .mapArea .ab.p11{top: 41%;left: 81%;}
    #partners .in .mapArea .ab.p12{top: 42%;left: 84%;}
        #partners .in .mapArea .ab.japan p{top: 0; left: auto; right: -5rem;}

    #partners .popup{position: absolute;top: 50%;left: 50%;transform: translate(-50% , -50%);border: 1px solid #555555;box-shadow: 5px 0 20px rgba(0,0,0,0.5);margin: 0 auto;background-image: linear-gradient(to right , #8cb53c 30%, #a6ce39 100%);background-size: 100% 7px;background-repeat: no-repeat; width: 0; height: 0;  transition: all ease 0.3s; opacity: 0; visibility: 0; max-width: 400px; transform-origin: (50%,50%);}
    #partners .popup *{ transition: all ease 0.3s; transform-origin: (50%,50%);}
    #partners .popup.open{width: 100%; height: auto; opacity: 1; visibility: 1;}
    #partners .popup .popup_inner{background-color: #fff; margin: 7px 0 0; padding: 0;}
    #partners .popup.open .popup_inner{background-color: #fff; margin: 7px 0 0; padding: 4rem 2rem;}
    #partners .popup .popup_inner .title{margin: 0 0 2rem;}
    #partners .popup .popup_inner .title .kr{font-size: 2.5rem; line-height: 1; color: #111; font-weight: bold; display: inline-block;}
    #partners .popup .popup_inner .title .en{font-size: 1.8rem; line-height: 1; color: #555; font-weight: 500; display: inline-block; padding: 0 0 0 1rem; text-transform: uppercase;}
    #partners .popup .popup_inner .imgArea{margin-bottom: 3rem;}
    #partners .popup .popup_inner .imgArea img{max-width: none; width: 100%;}
    #partners .popup .popup_inner .agency{font-size: 1.8rem; line-height: 2.8rem; color: #333;}
    
    #partners .popup .popup_close{position: absolute; top: calc(4rem + 7px); right: 2rem;}

/* 0201 주요제품 */
.product_intro{}
    .product_intro .car{position: relative; padding: 16rem 15rem 20rem; max-width: 98rem; width: 100%; margin: 0 auto;}
    .product_intro .car >img{content: url('/images/sub/car_off.png'); transition: all ease 1s; width: 64rem;}
    .product_intro .car.active >img{content: url('/images/sub/car_on.png');}

    .product_intro .abArea{position: absolute; width: 100%; height: 48rem; top: 16rem; left: 0; }
    .product_intro .ab{position: absolute; transition: all ease 1s; display: flex; flex-direction: column; align-items: center;}
    .product_intro .ab.bounce{animation-duration: 1s; animation-name: bounce; animation-iteration-count: infinite;}

        @keyframes bounce {
            0%{
                transform: scale(0.95);
            }
            50%{
                transform: scale(1.05);
            }
            100%{
                transform: scale(0.95);
            }
            
        }
    .product_intro .ab::before{width: 1rem; aspect-ratio: 1/1; position: absolute; content: ''; background-color: rgba(255,102,0, 1);border: 0.5rem solid rgb(255 255 255 / 60%); border-radius: 50%; top: 0; left: 50%; margin-left: -1rem; opacity: 0;}
    .product_intro .ab.active::before{opacity: 1;}
    .product_intro .ab:nth-of-type(1){top: 30%;left: 5%; width: 13rem;}
        .product_intro .ab.active:nth-of-type(1){top: 30%;left: 0rem;}
    .product_intro .ab:nth-of-type(2){top: 45%;left: 27%;}
        .product_intro .ab.active:nth-of-type(2){top: 68%;left: 3%;}
    .product_intro .ab:nth-of-type(3){top: 50%;left: 50%;}
        .product_intro .ab.active:nth-of-type(3){top: 95%;left: 28%;}
    .product_intro .ab:nth-of-type(4){top: 40%;left: 67%;}
        .product_intro .ab.active:nth-of-type(4){top: -10%;left: 60%;}
    .product_intro .ab:nth-of-type(5){top: 26%;left: 34%;}
        .product_intro .ab.active:nth-of-type(5){top: 35%;left: 65%;}

    .product_intro .ab:nth-of-type(1) .imgArea{width: 13rem;}
    .product_intro .ab:nth-of-type(2) .imgArea{width: 28rem;}
    .product_intro .ab:nth-of-type(3) .imgArea{width: 32rem;}
    /* .product_intro .ab:nth-of-type(4) .imgArea{width: 9rem;} */
    .product_intro .ab:nth-of-type(5) .imgArea{width: 34rem;}
    .product_intro .ab:nth-of-type(5) .imgArea img{ transform: translateX(-5rem);}

    .product_intro .ab p{font-size: 1.8rem; line-height: 1; color: #111; font-weight: bold; text-shadow: 1px 1px 1px rgba(255,255,255,0.85); position: relative; bottom: 0; opacity: 0; transition: all ease 1s;}
    .product_intro .ab.active p{bottom: 3rem; opacity: 1;}

    .product_intro .ab .imgArea{position: relative; top: 0; opacity: 0; transition: all ease 1s;}
    .product_intro .ab .imgArea::before{position: absolute; content: ''; width: 2px; height: 0; background-color: #ff4200; top: 1rem; left: 50%; margin-left: -2px; transition: all ease 1s;}
    /* .product_intro .ab.active .imgArea::before{opacity: 1;} */
    .product_intro .ab .imgArea img{position: relative; top: -2rem;}
    .product_intro .ab.active .imgArea::before{height: 5.5rem; top: -6rem;}
    .product_intro .ab.active .imgArea{top: 5.5rem; opacity: 1;}

    .car_nav{display: flex; flex-wrap: wrap; gap: 2rem; padding: 0 0 6rem;}
    .car_nav li{width: calc((100% - 8rem)/5); display: flex; align-items: center; gap: 2rem; cursor: pointer;}
    .car_nav li .imgArea{width: 8rem; border-radius: 50%; border: 1px solid transparent; transition: all ease 0.3s;}
    .car_nav li:hover .imgArea{border-color: #ff4200;}
    .car_nav li p{font-size: 1.8rem; line-height: 2.7rem; color: #666666; font-weight: bold; text-align: left; transition: all ease 0.3s; width: calc(100% - 8rem - 2rem);}
    .car_nav li:hover p{color: #ff4200;}

    #product .tabWrap{padding: 10rem 0 0;}
    #product .tabWrap .nav{display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 8rem;}
    #product .tabWrap .nav li{width: calc((100% - 4rem)/5); max-width: 20rem; display: block; border: 1px solid #dddddd; border-radius: 1rem; background-color: #f5f5f5; padding: 2rem 2.5rem 2rem 2rem; font-size: 2rem; line-height: 1; white-space: nowrap; color: #999999; font-weight: 500; position: relative; transition: all ease 0.3s; cursor: pointer;}
    #product .tabWrap .nav li::after{position: absolute; content: ''; top: 50%; right: 1rem; transform: translateY(-50%); width: 0; height: 0; display: block; transition: all ease 0.3s; 
        border-left: 0.75rem solid #999999;
        border-top: 0.75rem solid transparent;
        border-right: 0.75rem solid transparent;
        border-bottom: 0.75rem solid transparent;
    }
    #product .tabWrap .nav li:is(.active, :hover){border-color: var(--point); color: var(--point); background-color: #fff;}
    #product .tabWrap .nav li:is(.active, :hover)::after{border-left: 0.75rem solid var(--point);}
    #product .tabWrap .product_tab_title{display: flex; gap: 10rem; align-items: flex-start; margin-bottom: 4rem;}
    #product .tabWrap .product_tab_title h4{font-size: 4rem; line-height: 1; color: #111111; font-weight: 550; }
    #product .tabWrap .product_tab_title h4 span{color: var(--point);}
    #product .tabWrap .product_tab_title p{font-size: 2rem; line-height: 3rem; color: #666666; }
    #product .tabWrap .box + .box{margin-top: 8rem;}
    #product .tabWrap .box .banner{border: 1px solid #dddddd; display: flex; justify-content: center; padding: 4rem 2rem;}
    #product .tabWrap .box .banner.p0{padding: 0;}
    #product .tabWrap .box .box_title{font-size: 4rem; line-height: 1; color: #111111; font-weight: bold; margin-bottom: 4rem;}

    #product .tabWrap .box .banner + .product_list{margin-top: 4rem;}
    #product .tabWrap .box .product_list{display: flex; flex-wrap: wrap; gap: 4rem 2rem;}
    #product .tabWrap .box .product_list li{width: calc((100% - 6rem)/4);}
    #product .tabWrap .box .product_list li .imgArea{ border: 1px solid #dddddd; display: flex; align-items: center; justify-content: center; padding: 2rem; aspect-ratio: 1/1;}
    #product .tabWrap .box .product_list.list3 li{width: calc((100% - 4rem)/3);}
    #product .tabWrap .box .product_list.list3 li .imgArea{aspect-ratio: 4/3;}
    #product .tabWrap .box .product_list li p{font-size: 1.8rem; line-height: 2.5rem; padding-top: 1.5rem; text-align: center; color: #555555; font-weight: 500;}

    #product .tabWrap .tabContents{display: none;}
    #product .tabWrap .tabContents.active{display: block;}

/* 0202 설비현황 */
    .intro_video{position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 9; transition: all ease 1s;}
    .intro_video.off{top: -100%;}
    .intro_video video{max-width: none; max-height: none; width: 100%; height: 100%; object-fit: cover;}
    .intro_video .videoTextArea{position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 10; display: flex; align-items: center; justify-content: center;}
    .intro_video .videoTextArea .videoText{font-size: 4.5rem; line-height: 1.33; color: #fff; font-weight: bold; font-family: var(--mon); text-align: center; text-shadow: 3px 5px 7px rgba(0,0,0,0.5); position: relative; max-width: 124rem; width: 100%; height: 100%; margin: 0 auto; padding: 0 2rem;display: flex; align-items: center; justify-content: center;}
    .intro_video .videoTextArea .videoText p{opacity: 0; transition: all ease 1s; position: absolute;}
    .intro_video .videoTextArea .videoText p.active{opacity: 1;}

    .facility_gallery{display: flex; flex-wrap: wrap; justify-content: center; gap: 8rem; padding: 12rem 0;}
    .facility_gallery li{width: calc((100% - 8rem)/2); max-width: 55rem; text-align: center;}
    .facility_gallery li .imgArea{display: inline-block;}
    .facility_gallery li  p{font-size: 2rem; line-height: 3rem; color: #111111; padding-top: 1rem;}

    /* .sub_table{padding: 10rem 0;} */
    .sub_table table{width: 100%; border-collapse: collapse; border-top: 1px solid #8cb53c;}
    .sub_table table td{border-right: 1px solid #dddddd; border-bottom: 1px solid #ddd;}
    .sub_table table td:last-child{border-right: none;}
    .sub_table table thead tr td{padding: 2rem; font-size: 1.8rem; line-height: 1; color: #111; text-align: center; font-weight: bold; background-color: #f2f2f2; border-right: 1px solid #dddddd; border-bottom: 1px solid #ddd;}
    .sub_table table tbody tr td{padding: 2rem; font-size: 1.8rem; line-height: 1; color: #555555; text-align: center;}
    .sub_table table tbody tr.footer td{background-color: #555555; color: #fff; }
    
/* 0301 기업부설연구소 */
    .lab_banner{padding: 3rem 0 62rem; min-height: 86rem; background-image: url('/images/sub/lab_banner_bg.png'); background-size: contain; background-repeat: no-repeat; background-position: bottom center; max-width: 168rem; width: 100%; margin: 0 auto;}

    .lab_gallery{padding: 10rem 0 0; }
    .lab_gallery ul{display: flex; flex-wrap: wrap; gap: 6rem; margin-bottom: 10rem;}
    .lab_gallery ul li{position: relative; width: calc((100% - 12rem)/3);}
    .lab_gallery ul li .textArea{position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background-color: rgba(0,0,0,0.5); font-size: 2.2rem; line-height: 1.33; color: #fff; font-weight: bold; transition: all ease 0.3s; transform-origin: 50% 50%; opacity: 1;}
    .lab_gallery ul li:hover .textArea{opacity: 0;}

    .lab_gallery ul li.banner{display: flex; flex-direction: column; justify-content: center; background: linear-gradient(51.5deg, #8cb53c 50%, #94bd3b 50%); padding: 0 2rem 0 4rem;}
    .lab_gallery ul li.banner .logoArea{width: 22.1rem;}

    .lab_swiper .swiper-slide{width: calc((100% - 120px)/3);}

    html.sub .swiper-button-next, 
    html.sub .swiper-button-prev{width: 5rem; height: 5rem; background-size: cover;}

    html.sub .swiper-button-next{background-image: url('/images/sub/swiper-slide-next.png');} 
    html.sub .swiper-button-prev{background-image: url('/images/sub/swiper-slide-prev.png');} 
    html.sub .swiper-button-next::after, 
    html.sub .swiper-button-prev::after{display: none;}

/* 0401 사회공헌활동*/
    #scr .tabNav{max-width: 77rem; width: 100%; margin: 0 0 3rem; display: flex; flex-wrap: wrap; gap: 1rem;}
    #scr .tabNav li{width: calc((100% - 1rem)/2); cursor: pointer; font-size: 2.2rem; line-height: 1; color: #999999; font-weight: 500; padding: 0 0 2.5rem; border-bottom: 0.5rem solid #ccc; transition: all ease 0.3s;}
    #scr .tabNav li:is(.active, :hover){color: #111; font-weight: bold; border-bottom-color: var(--point);}

    #scr .tabWrap .banner{width: 100%; height: 41rem; background-size: cover; background-position: right; padding: 0 0 0 10rem; display: flex; justify-content: center; flex-direction: column;}
    #scr .tabWrap .banner.banner01{background-image: url('/images/sub/scr_banner_01.jpg');}
    #scr .tabWrap .banner.banner02{background-image: url('/images/sub/scr_banner_02.jpg');}

    #scr .tabContents{display: none;}
    #scr .tabContents.active{display: block;}

    #scr .tabWrap .info{padding: 6rem 0 0; display: flex; gap: 5rem; flex-wrap: wrap;}
    #scr .tabWrap .info .logoArea{width: 31rem; text-align: center;}
    #scr .tabWrap .info .logoArea .img{width: 26rem; display: inline-block; margin-bottom: 2rem;}
    #scr .tabWrap .info .logoArea a{width: 15rem; height: 4rem; display: inline-block; text-align: center; font-size: 1.6rem; line-height: 4rem; color: var(--point); border: 1px solid var(--point); border-radius: 1rem;}
    #scr .tabWrap .info .textArea{width: calc(100% - 31rem - 5rem);}
    #scr .tabWrap .info .textArea p{font-size: 1.8rem; line-height: 2.8rem; color: #555;}
    #scr .tabWrap .info .textArea p + p{margin-top: 2rem;}

/* 0601 국내영업점 */
#agency{}
#agency .tabNav{width: 100%; display: flex; flex-wrap: wrap; gap: 3rem 1rem; max-width: none;}
/* #agency .tabNav li{max-width: 13rem; width: calc((100% - 2rem)/3); cursor: pointer; font-size: 2.2rem; line-height: 1; color: #999999; font-weight: 500; padding: 0 0 2.5rem; border-bottom: 0.5rem solid #ccc; transition: all ease 0.3s;} */
#agency .tabNav li{/* max-width: 13rem; */ width: calc((100% - 7rem)/8); cursor: pointer; font-size: 2.2rem; line-height: 1; color: #999999; font-weight: 500; padding: 0 0 2.5rem; border-bottom: 0.5rem solid #ccc; transition: all ease 0.3s;}
#agency .tabNav li:is(.active, :hover){color: #111; font-weight: bold; border-bottom-color: var(--point);}
#agency .tabContents.active{display: flex; flex-wrap: wrap;}
#agency .tabContents .map{width: 100%; aspect-ratio: 2/1; order: 2;}
#agency .tabContents .info{width: 100%; order: 1; padding: 6rem 0;}

#agency .tabContents .title{margin: 0 0 4rem;}
#agency .tabContents .title h4{font-size: 3rem; line-height: 1; color: #111; font-weight: bold; margin-bottom: 1rem;}
#agency .tabContents .title p{font-size: 2rem; line-height: 1.5; color: #555555; font-weight: 500;}
#agency .tabContents .etc{display: flex; gap: 2rem; flex-wrap: wrap;}
#agency .tabContents .etc li{width: calc((100% - 4rem)/3); padding: 0 0 0 4rem; display: flex; align-items: center; gap: 2rem;}
#agency .tabContents .etc li + li{border-left: 1px solid #ddd;}
#agency .tabContents .etc li .imgArea{width: 6rem; }
#agency .tabContents .etc li p{width: calc(100% - 6rem - 2rem); font-size: 1.8rem; line-height: 2.6rem; color: #555;}
#agency .tabContents .etc li p b{color: #111; font-weight: bold;}











@media only screen and (max-width : 1720px){
    .lab_banner{background-size: cover; min-height: 150rem;}

}
@media only screen and (max-width : 1500px){
    #greeting .imgArea .ab{right: -2rem; top: auto; bottom: -2rem;}

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


}
@media only screen and (max-width : 1240px){
    #product .tabWrap .product_tab_title{gap: 4rem;}

    .lab_gallery ul{gap: 2rem;}
    .lab_gallery ul li{width: calc((100% - 4rem)/3); font-size: 0; line-height: 0;}
    .lab_gallery ul li img{max-width: none; max-height: none; width: 100%; height: 100%;}
    .lab_gallery ul li.banner{padding: 4rem 2rem;}

}
@media only screen and (max-width : 1024px){
    #greeting{}
        #greeting .textArea{width: 100%; order: 2;}
        #greeting .imgArea{max-width: 50rem; width: 100%; order: 1; justify-content: flex-start;}

    .ci_banner{padding: 6rem 3rem;}
    .ci_banner ul{justify-content: center;}
    .ci_banner ul li{width: calc((100% - 8rem)/3);}
    .ci_banner ul li:nth-of-type(4)::before{display: none;}

    .ci_etc li{padding: 0 2.5rem;}

    .product_intro .car{padding: 16rem 0 20rem;}



    .car_nav{justify-content: center;}
    .car_nav li{width: calc((100% - 4rem)/3);}

    .facility_gallery{gap: 4rem;}
    .facility_gallery li{width: calc((100% - 4rem)/2);}

    .lab_swiper .swiper-slide{width: calc((100% - 40px)/3); min-width: 36rem;}

    #scr .tabWrap .banner{padding: 0 0 0 3rem;}
    #scr .tabWrap .banner.banner01{padding: 3rem; justify-content: flex-start; background-position: center;}

    #scr .tabWrap .info .logoArea{width: 100%; display: flex; flex-direction: column; align-items: center;}
    #scr .tabWrap .info .textArea{width: 100%;}

    #agency .tabContents .etc li{padding: 0 0 0 1rem;}
    #agency .tabContents .etc li + li{border-left: none;}
}
@media only screen and (max-width : 840px){
    .product_intro .car{padding: 16rem 0;}

    #agency .tabContents .etc li{width: 100%;}

    .product_intro .ab:nth-of-type(4) .imgArea{width: 9rem;}

}
@media only screen and (max-width : 768px){
    .mapWrap .infoArea{width: 100%;}
    .mapWrap .mapArea{width: 100%; aspect-ratio: 1/1;}

}
@media only screen and (max-width : 640px){
    .mmVar{display: none !important;}

    .management_tabWrap .cont_01_ul{max-width: 33rem; height: 27rem;}
    .management_tabWrap .cont_01_ul li:nth-of-type(1){background-color: rgba(103,103,103,0.75); left: 0; top: 0;}
    .management_tabWrap .cont_01_ul li:nth-of-type(2){background-color: rgba(113,184,68,0.75); left: 0; top: 50%; transform: translateY(-50%);}
    .management_tabWrap .cont_01_ul li:nth-of-type(3){background-color: rgba(7,168,207,0.75); right: 0; bottom: 0;}

    .management_tabWrap .cont_03_ul li{width: 100%;}

    .ci_etc {gap: 0;}
    .ci_etc li{width: 100%; padding: 3rem 0;}
    .ci_etc li + li{border-left: none; border-top: 1px solid #ddd; }

    .ci_article .box .ci.p6 .ab{bottom: 2rem; right: 2rem;}

    #partners .in .mapArea .ab{width: 1.5rem; aspect-ratio: 1/1;}
    #partners .in .mapArea .ab.usa p{top: -2rem; left: 0;}
    #partners .in .mapArea .ab.china p{top: 0; left: -2rem;}

    .product_intro .car >img{width: auto;}

    .product_intro .ab:nth-of-type(1){top: 30%;left: 5%; width: 13rem;}
        .product_intro .ab.active:nth-of-type(1){top: 30%;left: 0rem;}
    .product_intro .ab:nth-of-type(2){top: 45%;left: 27%;}
        .product_intro .ab.active:nth-of-type(2){top: 68%;left: 3%;}
    .product_intro .ab:nth-of-type(3){top: 50%;left: 50%;}
        .product_intro .ab.active:nth-of-type(3){top: auto;left: 28%;bottom: 10%;}
    .product_intro .ab:nth-of-type(4){top: 40%;left: 67%;}
        .product_intro .ab.active:nth-of-type(4){top: 10%;left: auto;right: 25%;}
    .product_intro .ab:nth-of-type(5){top: 26%;left: 34%;}
        .product_intro .ab.active:nth-of-type(5){top: 35%;left: auto;right: 2%;}

    .product_intro .ab:nth-of-type(1) .imgArea{width: 13rem;}
    .product_intro .ab:nth-of-type(2) .imgArea{width: 21rem;}
    .product_intro .ab:nth-of-type(3) .imgArea{width: 24rem;}
    .product_intro .ab:nth-of-type(4) .imgArea{width: 9rem;}
    .product_intro .ab:nth-of-type(5) .imgArea{width: 25rem;}
    .product_intro .ab:nth-of-type(5) .imgArea img{ transform: translateX(0);}
    .product_intro .abArea{height: 100%; top: 0;}

    #product .tabWrap .product_tab_title{flex-wrap: wrap;}
    #product .tabWrap .product_tab_title p{width: 100%;}

    #product .tabWrap .box .product_list{gap: 2rem;}
    #product .tabWrap .box .product_list li{width: calc((100% - 4rem)/3);}

    .lab_gallery ul li{width: calc((100% - 2rem)/2);}

    #agency .tabNav{gap: 0;}
    #agency .tabNav li{width: calc((100%)/8);}
    #agency .tabContents .map{aspect-ratio: 1/1;}

}
@media only screen and (max-width : 480px){
    .ci_banner ul li{width: calc((100% - 4rem)/2);}
    .ci_banner ul li:nth-of-type(4)::before{display: block;}
    .ci_banner ul li:nth-of-type(odd)::before{display: none;}
    /* .ci_banner ul li:nth-of-type(4)::before{display: block;} */

    .mapWrap .infoArea{padding: 2rem;}

    .car_nav li{width: calc((100% - 2rem)/2);}

    .product_intro .ab:nth-of-type(1) .imgArea{width: 13rem;}
    .product_intro .ab:nth-of-type(2) .imgArea{width: 14rem;}
    .product_intro .ab:nth-of-type(3) .imgArea{width: 16rem;}
    .product_intro .ab:nth-of-type(4) .imgArea{width: 9rem;}
    /* .product_intro .ab:nth-of-type(5) .imgArea{width: 17rem;} */
    .product_intro .ab:nth-of-type(5) .imgArea img{ transform: translateX(0);}

    #product .tabWrap .nav li{width: calc((100% - 2rem)/3);}

    #product .tabWrap .box .product_list li{width: calc((100% - 2rem)/2);}

    .lab_gallery ul li.banner{background: linear-gradient(24.5deg, #8cb53c 50%, #94bd3b 50%);}
    .lab_gallery ul li{width: 100%;}

    .facility_gallery li{width: 100%; max-width: none;}


}
@media only screen and (max-width : 400px){
    .sub_table table tbody tr td{padding: 1rem 0.5rem;}


}