@charset "utf-8";




/* 반응형 단위 */
@media screen and (max-width: 1600px){

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

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

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

}


/* 기본 css */
/* 기본 css */
/* 기본 css */
.sub_contents{
    font-family: 'Nanum Barun Gothic', sans-serif;
}

.content_tit{font-size: 3.2rem;}
@media screen and (max-width: 768px){
    .content_tit{font-size: 2.8rem;}
}

/* color */
.sj_blue{color: #0251a9;}

/* margin */
.mb20 { margin-bottom: 2.0rem; }
.mb28 { margin-bottom: 2.8rem; }
.mb36 { margin-bottom: 3.6rem; }
.mb44 { margin-bottom: 4.4rem; }
.mb52 { margin-bottom: 5.2rem; }
.mb72 { margin-bottom: 7.2rem; }
.mb120 { margin-bottom: 12.0rem; }

.mr24 { margin-right: 2.4rem; }
.mr28 { margin-right: 2.8rem; }
.mr32 { margin-right: 3.2rem; }

.ml24 { margin-left: 2.4rem; }
.ml28 { margin-left: 2.8rem; }
.ml32 { margin-left: 3.2rem; }

/* 폰트사이즈 */
.fs16 { font-size: 1.6rem; letter-spacing: -0.03em; }
.fs18 { font-size: 1.8rem; letter-spacing: -0.03em; }
.fs20 { font-size: 2.0rem; letter-spacing: -0.03em; }
.fs22 { font-size: 2.2rem; letter-spacing: -0.03em; }
.fs24 { font-size: 2.4rem; letter-spacing: -0.03em; }
.fs26 { font-size: 2.6rem; letter-spacing: -0.03em; }
.fs28 { font-size: 2.8rem; letter-spacing: -0.03em; }
.fs30 { font-size: 3.0rem; letter-spacing: -0.03em; }
.fs32 { font-size: 3.2rem; letter-spacing: -0.03em; }
.fs36 { font-size: 3.6rem; letter-spacing: -0.04em; }
.fs44 { font-size: 4.4rem; letter-spacing: -0.04em; }
.fs64 { font-size: 6.4rem; letter-spacing: -0.04em; }
@media screen and (max-width: 768px){
    .fs24 { font-size: 2.2rem; letter-spacing: -0.03em; }
    .fs36{font-size: 3.0rem; letter-spacing: -0.03em;}
    .fs44 { font-size: 3.8rem; letter-spacing: -0.04em; }
    .fs64 { font-size: 5.8rem; letter-spacing: -0.04em; }
}

/* 폰트 행간 */
.ft_lh18 { line-height: 1.8 }

/* flex */
.d_flex { display: flex; }
.jc_spbt { justify-content: space-between; }
.jc_spar { justify-content: space-around; }
.jc_str { justify-content: start; }
.jc_end { justify-content: end; }
.jc_cnt { justify-content: center; }
.ai_cnt { align-items: center; }
.ai_str { align-items: flex-start; }
.flw_wrap { flex-wrap: wrap; }
.flw_nowrap { flex-wrap: nowrap; }
.flw_wrap_rev { flex-wrap: wrap-reverse; }
.fld_row_rev { flex-direction: row-reverse; }
.fld_col_rev { flex-direction: column-reverse; }

/* position */
.ps_rel{position: relative;}
.ps_abs{position: absolute;}

/* border-radius */
.br16 { border-radius: 1.6rem; }
.br2 { border-radius: 2rem; }
.br4 { border-radius: 4rem; }

.side_pd{
    padding-left: 6rem !important;
    padding-right: 6rem !important;
}
@media screen and (max-width: 1600px){
}
@media screen and (max-width: 1400px){
    .side_pd{
        padding-left: 3rem !important;
        padding-right: 3rem !important;
    }
}
@media screen and (max-width: 1024px){
}
@media screen and (max-width: 768px){
}


/*��ǰ*/
.product_box{}

.product_box .content {display:flex;flex-wrap:wrap;}
.product_box .content .sub{width:33.333%;padding-bottom:39px;padding-left:13px;padding-right:13px;}
/* .product_box .content .right_zero{padding-right:0px;padding-left:26px;}
.product_box .content .left_zero{padding-right:26px;padding-left:0px;} */

.product_box .content .sub .subWrap{/* width:440px;height:557px; */background:#dedede;border-top-right-radius:50px;border-top-left-radius:50px;position:relative}

.product_box .content .sub .subWrap .icon_plus a{font-size:22px;line-height:28px;color:#1964d7;display:block;}
.product_box .content .sub .subWrap .thmb{border-top-right-radius:50px;border-top-left-radius:50px;overflow:hidden}
.product_box .content .sub .subWrap .thmb .icon_plus{z-index:999;font-size:4.2rem;width:50px;height:50px;line-height:40px;color:#9f0706;background:#fff;display:block;text-align:center;position:absolute;bottom:23%;right:0}
.product_box .content .sub .subWrap img {width:100%;height:349px;}
@media screen and (max-width: 1024px){
    .product_box .content .sub{
        width: 50%;
    }
}
@media screen and (max-width: 768px){
    .product_box .content .sub{
        width: 100%;
    }
}


/* 회사개요 company */
.company_intro {
    gap: 4rem;
}
.company_intro .intro_box .intro_desc{
    padding: 4rem 0 4rem 6rem;
    margin: 0 auto;
}
.company_intro .intro_box .intro_desc .intro_icon.start{
    top: 0;
    left: 0;
}
.company_intro .intro_box .intro_desc .intro_icon.end{
    bottom: 0;
    right: 0;
    transform: rotate(180deg);
}
.company_intro .video_box{
    width: 53%;
    height: 50rem;
    border-radius:6.0rem; /* 원하면 더 크게 조절 가능 */
    overflow: hidden;
}
.company_intro .video_box video {
    width: 100%;
    height: 100%;
    object-fit: cover; /* 꽉 차게 */
    border-radius: inherit; /* 박스와 동일한 radius */
}
.company_info {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4rem;
}
.company_info .info_item{
    width: 100%;
    background-color: #eef6ff;
    padding: 6rem 0;
}
@media screen and (max-width: 1024px){
    .company_intro {
        display: block;
        text-align: center;
    }
    .company_intro .intro_box .intro_desc{
        padding: 6rem;
    }
    .company_intro .video_box{
        width: 100%;
        margin-top: 10.0rem;
    }
    .company_intro .intro_box .intro_desc .intro_icon.start{
        top: 10%;
        left: 10%;
    }
    .company_intro .intro_box .intro_desc .intro_icon.end{
        bottom: 10%;
        right: 10%;
        transform: rotate(180deg);
    }
    .company_info {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 4rem;
    }
}
@media screen and (max-width: 768px){
    .company_intro .intro_box .intro_desc{
        padding: 4rem 0;
        margin: 0 auto;
    }
    .company_intro .intro_box .intro_desc .intro_icon.start{
        top: 0;
        left: 0;
    }
    .company_intro .intro_box .intro_desc .intro_icon.end{
        bottom: 0;
        right: 0;
        transform: rotate(180deg);
    }
    .company_intro .intro_box .intro_tit{
        font-size: 3.5rem;
    }
    .company_intro .video_box{
        height: 35rem;
    }
    .company_info {
        grid-template-columns: 1fr;
    }
}

/* CEO인사말 message */
/* CEO인사말 message */
/* CEO인사말 message */
.message_top, .message_mid, .message_btm{font-weight: 100;}
.message_top .message_name{font-weight: bold;}
.message_mid{gap: 4.0rem;}
.message_mid .ceo_img{
    border-radius: 6.0rem 6.0rem 0 0;
    overflow: hidden;
    max-width: 490px;
}
@media screen and (max-width: 1024px){
    .message_mid {
        flex-wrap: wrap;
    }
    .message_mid .ceo_img{
        height: 600px;
    }
}


/* 연혁 */
/* 연혁 */
/* 연혁 */
.history_title{
    width: 100%;
    height: 36rem;
    color: #666;
}
.history_h1{
    top: 50%;
    left: 10%;
    transform: translateY(-50%);
    z-index: 2;
}
.history_title .history_bg{
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}
/* 중앙선 */
.history_contents::after {
    content: '';
    display: block;
    width: 1px;
    height: calc(100% - 1.6rem - 20rem);
    background-color: #ccc;
    position: absolute;
    top: 1.6rem;
    left: 50%;
    transform: translateX(-50%);
}
.history_contents .history_sec ul{
    width: 50%;
}
.history_contents .history_sec .history_list li{
    margin-bottom: 2.4rem;
}
.history_contents .history_sec .history_list .year{
    font-weight: bold;
}
.history_contents .history_sec .history_list li:first-child .year::after{
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    background: url(../../pages/images/history_icon.png) no-repeat center / contain;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
}
/* 연혁 우측 정렬 컨텐츠 */
.history_contents .history_sec.right .history_img{
    padding-right: 8.0rem;
}
.history_contents .history_sec.right .history_list{
    padding-left:  6.0rem;
}
.history_contents .history_sec.right .history_list li:first-child .year::after{
    left: calc(-6.0rem - 12px + 0.5px);
}
/* 연혁 좌측 정렬 컨텐츠 */
.history_contents .history_sec.left .history_img{
    padding-left:  8.0rem;
}
.history_contents .history_sec.left .history_list{
    padding-right:  6.0rem;
}
.history_contents .history_sec.left .history_list li:first-child .year::after{
    right: calc(-6.0rem - 12px + 0.5px);
}
@media screen and (max-width: 1024px){
    .history_contents .history_sec .history_list li{
        flex-wrap: wrap;
    }
    .history_contents .history_sec .history_list .year{
        width: 100%;
    }
}
@media screen and (max-width: 768px){
    .history_contents{
        margin: 0 4rem;
    }
    .history_contents::after {
        left: 0;
        height: calc(100% - 1.6rem - 5rem);
    }
    .history_contents .history_sec{
        justify-content: end;
        flex-wrap: wrap;
    }
    .history_contents .history_sec ul{
        width: 100%;
    }
    .history_contents .history_sec.right .history_list,
    .history_contents .history_sec.left .history_list{
        padding-left:  8.0rem;
        padding-right: 0rem;
    }
    .history_contents .history_sec.right .history_img,
    .history_contents .history_sec.left .history_img{
        padding-right: 0rem;
        padding-left:  8.0rem;
        margin-bottom: 2.4rem;
    }
    .history_contents .history_sec.right .history_list li:first-child .year::after,
    .history_contents .history_sec.left .history_list li:first-child .year::after{
        left: calc(-8rem - 12px)
    }
    .history_contents .history_sec.left .history_list{
        text-align: left !important;
    }
    .history_contents .history_sec.left .history_list>li{
        justify-content: start;
    }
    .history_contents .history_sec.left .history_list li p:first-child{
        margin-left: 0;
    }
}


/* 주요거래처 */
/* 주요거래처 */
/* 주요거래처 */
.partners_logo{
    gap: 2.4rem;
    flex-wrap: nowrap;
}
.partners_logo li{
    width: 33.3%;
    height: 16.0rem;
    border: 1px solid #ccc;
    padding: 3.0rem;
}
.partners_logo li:nth-child(1){
    background: url(../../pages/images/partners_logo_01.png) no-repeat center;
}
.partners_logo li:nth-child(2){
    background: url(../../pages/images/partners_logo_02.png) no-repeat center;
}
.partners_logo li:nth-child(3){
    background: url(../../pages/images/partners_logo_03.png) no-repeat center;
}
@media screen and (max-width: 1024px){
    .partners_logo{
        flex-wrap: wrap;
    }
    .partners_logo li{
        width: 100%;
    }
}



/* 비젼 */
/* 비젼 */
/* 비젼 */

.vison_image_text{
    color: #000;
    background: linear-gradient(rgba(0,0,0,0.5)), url(../../pages/images/vision_bg01.png) no-repeat center;
    padding: 6.0rem 0;
    border-radius: 9999px;
    color: #fff;
}
.vision_list .list_item {
    padding: 12.0rem 0;
}
.vision_list .list_item .list_top{
    gap: 2.4rem;
}
.vision_list .list_item .list_top .list_label{
    padding: 0.8rem 6.0rem;
    background-color: #0251a9;
    color: #fff;
}
.vision_list .list_item::after {
    content: '';
    display: block;
    width: 50%;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background-color: #999;
}
.vision_list .list_item:last-child::after {
    display: none;
}
@media screen and (max-width: 1024px){
    .vison_image_text{
        border-radius: 8.0rem;
    }
    .list_item .list_top{
        flex-wrap: wrap;
    }
    .list_item .list_top .list_title{
        width: 100%;
    }
}
@media screen and (max-width: 768px){
    .vison_image_text{
        border-radius: 4.0rem;
        padding: 2.8rem 2.4rem;
    }
    .vison_image_text p:first-child{
        font-size: 2.6rem;
    }
    .vison_image_text p:nth-child(2){
        font-size: 2.0rem;
    }
    .vision_list {
        font-size: 2.0rem;
    }
    .vision_list .list_item{
        padding: 6.0rem 0;
    }
    .vision_list .list_label,
    .vision_list .list_title{
        font-size: 2.4rem;
    }
}




/* 인증서 */
/* 인증서 */
/* 인증서 */
.certification_list{
    gap: 2.4rem;
    max-width: 90%;
    margin: 0 auto;
}
.certification_list li{
    width: 27%;
}
.certification_list li img{
    border: 1px solid #ccc;
}
@media screen and (max-width: 768px){
    .certification_list{
        flex-wrap: wrap;
    }
    .certification_list li{
        width: 65%;
        margin-bottom: 3.2rem;
    }
}




/* 설비현황 */
.facility_image{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2.4rem;
}
.facility_list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2.4rem;
    row-gap: 8.0rem;  
}
.facility_item {
    position: relative;
}
.fac_item_table {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 6.5fr 3.5fr;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
}
.fac_item_table li {
    padding: 14px 16px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    font-size: 1.6rem;
}
.fac_item_table li:nth-child(4n+1),
.fac_item_table li:nth-child(4n+3) {
    background: #f3f3f3;
}
.fac_item_table .th {
    background: #f3f3f3;
}


@media (max-width: 768px) {
    .facility_image{
        grid-template-columns: 1fr;
    }
    .facility_title h1{
        font-size: 2.8rem;
    }
    .facility_list {
        grid-template-columns: 1fr;
        row-gap: 4.0rem;  
    }
    .hide768{
        display: none;
    }
}


/* 오시는 길 */
/* 오시는 길 */
/* 오시는 길 */
.location_info{
    gap: 2.4rem;
}
.location_info img{
    background-color: #0251a9;
    padding: 1.6rem;
    width: 7.2rem;
    height: 7.2rem;
}
.location_map .root_daum_roughmap{
    width: 100% !important;
}
.location_map .root_daum_roughmap_landing .map_border,
.location_map .root_daum_roughmap_landing .section_address,
.location_map .root_daum_roughmap_landing .wrap_controllers{
    display: none !important;
}
@media (max-width: 1024px) {
    /* .location_info {
        justify-content: center;
    } */
    .location_info > div {
        width: 100%;
    }
}


/* 환경자료공시 */
/* 환경자료공시 */
/* 환경자료공시 */
.table_desc {
    color: #666;
}
.disclosure_grid {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
}
.disclosure_grid.col4 {
    grid-template-columns: repeat(4, 1fr);
}
.disclosure_grid.col5 {
    grid-template-columns: repeat(5, 1fr);
}
.disclosure_grid.col6 {
    grid-template-columns: repeat(6, 1fr);
}
.disclosure_grid li {
    padding: 1.4rem 1.6rem;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    text-align: center;
}
.disclosure_grid li.th {
    background: #f3f3f3;
    
}
.disclosure_grid.col5 {
    grid-template-columns: 1fr 1.2fr 1.5fr 1.5fr 1.5fr;
}
.disclosure_grid_target {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
}
.disclosure_grid_target li {
    padding: 1.4rem 1.6rem;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    text-align: center;
}
.disclosure_grid_target li.th {
    background: #f3f3f3;
}
.disclosure_grid_small {
    list-style: none;
    display: grid;
    grid-template-columns: 2fr 1fr; /* 2:1 비율 */
    width: 60%;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    
    box-sizing: border-box;
}
.disclosure_grid_small li {
    box-sizing: border-box;
    padding: 1.4rem 1.6rem;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    text-align: center;
}
.disclosure_grid_small li.th {
    background: #f3f3f3;
    
}
.disclosure_grid.esg_performance {
    grid-template-columns: 1fr 1fr 0.8fr 1.2fr 0.8fr 0.8fr 0.8fr 0.8fr;
    overflow-x: auto;
}
.disclosure_stratgey{
    border: 1px solid #ccc;
}
.disclosure_stratgey{
    padding: 3.6rem ;
}
.disclosure_stratgey > li ul li{
    margin-left: 1.6rem;
    margin-bottom: 1.2rem;
}
@media (max-width: 768px) {
    .disclosure_grid.esg_performance {
        min-width: 800px; /* 표가 찌그러지지 않도록 최소 너비 설정 */
    }
    .table_item {
        overflow-x: auto; /* 부모 요소에 스크롤 */
    }
    .disclosure_grid_small {
        width: 100%;
    }
}