/*
	Copyright 2020 Raonbnp
	http://raonbnp.com, http://raonwebstore.com
*/
@charset "UTF-8";
@import '/_css/common.css'; /* front, admin 공통*/
@import '/_css/member.css'; /* front member 공통*/
@import '/_css/board.css'; /* front member 공통*/
@import 'loading.css';
@import 'fontSet.css';
@import 'basic.css';
@import 'layout.css';


/*인사말*/
#intro_sec01 .bnr_area{ position:relative; height:58rem; background:url('/html/_img/sub/intro_bak01.jpg') no-repeat center / cover; }
#intro_sec01 .bnr_area > img{ position:absolute; top:50%; left:10%; width:25%; max-width:400px; min-width:200px;
    transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%);
}
#intro_sec01 .bnr_area > div{ position:absolute; top:50%; left:0; width:100%; padding:0 15px;  text-align:center; 
    transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%);
}
#intro_sec01 .bnr_area > div img{ display:inline-block; width:10%; max-width:11rem; min-width:5rem; vertical-align:middle; margin-right:2rem;  }
#intro_sec01 .bnr_area > div h4{ display:inline-block; vertical-align:middle;  font-size:8.4rem; color:#fff; line-height:1.3; font-weight:700;  }

#intro_sec01 .content_area{ z-index:1;  position:relative; padding:5rem 0 0 0;  background:#fff; text-align: center;}
#intro_sec01 .content_area strong{ display:block; font-size:2.4rem; line-height:1.4; font-weight:600; margin-bottom:4rem;   }
#intro_sec01 .content_area p{ font-size:2rem; color:#222; line-height:1.7;  }
#intro_sec01 .content_area p span{ display:block; margin-bottom:3.5rem;  }
#intro_sec01 .content_area p.sign img{ display:inline-block; vertical-align: bottom; margin-left:1rem;}


@media all and (max-width:1199.98px) {
    #intro_sec01 .bnr_area{ height:40rem;}
    #intro_sec01 .bnr_area > div h4{ font-size:4.5rem; }

    #intro_sec01 .content_area{ padding-top:4rem; }
    #intro_sec01 .content_area strong{ font-size:2rem;}
    #intro_sec01 .content_area p{ font-size:1.8rem; }
    #intro_sec01 .content_area p br{ display:none; }
    
}

@media all and (max-width:991.98px) {
    #intro_sec01 .bnr_area{ height:30rem; }
    #intro_sec01 .bnr_area > div img{ margin-right:1rem;}
    #intro_sec01 .bnr_area > div h4{ font-size:4rem; }
    
    #intro_sec01 .content_area p span{ margin-bottom:2rem;}
    #intro_sec01 .content_area p.sign img{ width:15rem; }
}
@media all and (max-width:575.98px) {
    #intro_sec01 .bnr_area > div img{ display:block;  margin:0 auto 1rem;}
}
    

/*경영이념*/
#story_sec01{ text-align:center;}
#story_sec02 .bnr_area{ height:46rem;   background:url('../_img/sub/story_bak01.jpg') no-repeat center / cover;} 
#story_sec02 ul{ display:flex; flex-wrap:wrap; justify-content: space-between; margin-top:2rem;}
#story_sec02 ul li{  text-align:center; padding:0 .75rem; margin-top:3rem;}
#story_sec02 ul li strong{ display:block; margin-top:2rem; font-size:1.8rem;  font-weight:500; }

@media all and (max-width:1199.98px) {
    #story_sec02 .bnr_area{ height:35rem; }
    #story_sec02 ul li{ flex-basis: 25%; max-width: 25%;}
    #story_sec02 ul li strong{ font-size:1.6rem; }
    #story_sec02 ul li strong br{ display:none; }
}

@media all and (max-width:991.98px) {
    #story_sec01 img{ width:40rem;}

    #story_sec02 .bnr_area{ height:30rem; }
    #story_sec02 ul{ max-width:40rem; }
    #story_sec02 ul li{ flex-basis: 50%; max-width: 50%; }
}

@media all and (max-width:767.98px) {
    #story_sec02 .bnr_area{ height:20rem; }
}



/*조직도*/
#company_sec01{ text-align:center; }

@media all and (max-width:991.98px) {
    #company_sec01 img{ width:100%;  max-width:380px; }
}


/*연혁*/
#history_sec01 .history_list > li{ position:relative; clear:both; width:50%; padding-bottom:9rem; }
#history_sec01 .history_list > li:last-child{ padding-bottom:0; }
#history_sec01 .history_list > li:before,
#history_sec01 .history_list > li:after{ content:""; position:absolute; top:0; width:2px;}
#history_sec01 .history_list > li:before{ height:100%; background:#e9e9e9; }
#history_sec01 .history_list > li:after{ height:0%; background:#008c44;
    transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s;
}
#history_sec01 .history_list > li.aos-animate:after{ height:100%;}
#history_sec01 .history_list > li h4{ position:relative; font-size:2.4rem; margin-bottom:1rem; font-weight:600;   }
#history_sec01 .history_list > li h4:after,
#history_sec01 .history_list > li h4:before{ content:""; z-index:11; position:absolute; border-radius:100%; }
#history_sec01 .history_list > li h4:after{ opacity:0; top:0; width:2.8rem; height:2.8rem; border:1px solid #008c44; background:#fff; 
    transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s;
}
#history_sec01 .history_list > li.aos-animate h4:after{ opacity:1;}
#history_sec01 .history_list > li h4:before{ z-index:12; top:.9rem; width:1rem; height:1rem; background:#008c44; }
#history_sec01 .history_list > li p{ font-size:1.8rem; color:#333; margin-bottom:.5rem; }
#history_sec01 .history_list > li p:last-child{ margin-bottom:0; }
#history_sec01 .history_list > li .img_area{ display:block; border:1px solid #ddd; max-width:40rem; margin-top:2rem;  }

#history_sec01 .history_list > li:nth-child(odd){ text-align:right;}
#history_sec01 .history_list > li:nth-child(odd):before,
#history_sec01 .history_list > li:nth-child(odd):after{ right:-1px; }
#history_sec01 .history_list > li:nth-child(odd) h4,
#history_sec01 .history_list > li:nth-child(odd) p{ padding-right:3rem;  }
#history_sec01 .history_list > li:nth-child(odd) p .img_area{ margin-left:auto; }
#history_sec01 .history_list > li:nth-child(odd) h4:after{ right:-1.4rem;}
#history_sec01 .history_list > li:nth-child(odd) h4:before{ right:-.5rem; }

#history_sec01 .history_list > li:nth-child(even){ float:right; text-align:left; }
#history_sec01 .history_list > li:nth-child(even):before,
#history_sec01 .history_list > li:nth-child(even):after{ left:-1px; }
#history_sec01 .history_list > li:nth-child(even) h4,
#history_sec01 .history_list > li:nth-child(even) p{ padding-left:3rem;}
#history_sec01 .history_list > li:nth-child(even) h4:after{ left:-1.4rem;}
#history_sec01 .history_list > li:nth-child(even) h4:before{ left:-.5rem; }

@media all and (max-width:991.98px) {
    #history_sec01 .history_list > li{ padding-bottom:5rem;}
    #history_sec01 .history_list > li h4{ font-size:2rem;}
    #history_sec01 .history_list > li p{ font-size:1.6rem;}
}
@media all and (max-width:575.98px) {
    #history_sec01 .history_list > li{ width:100%; }
    #history_sec01 .history_list > li:nth-child(odd){ text-align:left;}
    #history_sec01 .history_list > li:nth-child(odd):before,
    #history_sec01 .history_list > li:nth-child(odd):after{ right:unset; left:-1px; }
    #history_sec01 .history_list > li:nth-child(odd) h4,
    #history_sec01 .history_list > li:nth-child(odd) p{ padding-right:0rem; padding-left:3rem;  }
    #history_sec01 .history_list > li:nth-child(odd) p .img_area{ margin-left:0; }
    #history_sec01 .history_list > li:nth-child(odd) h4:after{ right:unset; left:-1.4rem;}
    #history_sec01 .history_list > li:nth-child(odd) h4:before{ right:unset; left:-.5rem;  }
}
    
/*인증 및 허가*/
#certification_sec01 .certification_list{ display:flex; flex-wrap:wrap;}
#certification_sec01 .certification_list li{ width:calc(50% - 3rem); margin-right:6rem; text-align:center;}
#certification_sec01 .certification_list li:last-child{ margin:0;}
#certification_sec01 .certification_list .img_area{ border:1px solid #ddd; }
#certification_sec01 .certification_list .img_area img{ width:100%; }
#certification_sec01 .certification_list strong{ display:block; font-size:2rem; margin-top:2rem; font-weight:500;  }

@media all and (max-width:1199.98px) {
    #certification_sec01 .certification_list li{ width:calc(50% - 1rem); margin-right:2rem; }
}
@media all and (max-width:991.98px) {
    #certification_sec01 .certification_list strong{ font-size:1.8rem;}
}
@media all and (max-width:575.98px) {
    #certification_sec01 .certification_list li{ width:100%; margin-right:0; margin-bottom:3rem; }
}

/*국내 국제 복합 운송*/
#businessA_sec01 > .tit_area{ margin-bottom:6rem; text-align:center; font-size:2.8rem; }
#businessA_sec01 > ul > li{ display:flex; flex-wrap:wrap; margin-bottom:13rem;}
#businessA_sec01 > ul > li:last-child{ margin-bottom:0; }
#businessA_sec01 > ul > li:nth-child(even){ flex-direction: row-reverse; }
#businessA_sec01 > ul > li > div{ width:50%;}
#businessA_sec01 > ul .img_area{ height:50rem; background-size:cover; background-position:center; }
#businessA_sec01 > ul .img_area01{ background-image:url('/html/_img/sub/businessA_img01.jpg');}
#businessA_sec01 > ul .img_area02{ background-image:url('/html/_img/sub/businessA_img02.jpg');}
#businessA_sec01 > ul .img_area03{ background-image:url('/html/_img/sub/businessA_img03.jpg');}
#businessA_sec01 > ul .txt_area{ display:flex; align-items:center;  padding:0 5rem; border:1px solid #ddd; }
#businessA_sec01 > ul .txt_area strong{ display:block; font-size:3rem; margin-bottom:2rem; color:#222; }
#businessA_sec01 > ul .txt_area ul li{ padding-left:1.5rem; margin-bottom:1rem; font-size:2rem; line-height:1.7; text-indent:-1rem; color:#222; }
#businessA_sec01 > ul .txt_area ul li:last-child{ margin-bottom:0; }
#businessA_sec01 > ul .txt_area ul li span{ font-weight:500;}

#businessA_sec02{ text-align:center; }
#businessA_sec02 .img_area{ display:flex; flex-wrap:wrap;}
#businessA_sec02 .img_area > div{ width:calc(50% - 1rem); margin-right:2rem;}
#businessA_sec02 .img_area > div:last-child{ margin-right:0;}
#businessA_sec02 .img_area > div img{ width:100%;}
#businessA_sec02 .sub_com_tit02{ padding:4rem; border:1px solid #ddd; border-top:0; }
#businessA_sec02 .sub_com_tit02:last-child{ margin-bottom:0; }

#businessA_sec03{ padding:11rem 0; background:#f7fbf9;  }
#businessA_sec03 .bnr_area{ height:52rem;  background:url('../_img/sub/businessA_bak01.jpg') no-repeat center / cover; }
#businessA_sec03 .sub_com_tit02{  padding:4rem; border:1px solid #ddd; background:#fff; }
#businessA_sec03 .sub_com_tit02 .desc{ padding-left:1.5rem; text-indent:-1rem; }
#businessA_sec03 .sub_com_tit02 .desc:last-child{ margin-top:1rem;}
#businessA_sec03 .scroll_area{ overflow-x:auto; text-align:center; }
#businessA_sec03 .scroll_area img{ min-width:80rem;}

@media all and (max-width:1600px) {
    #businessA_sec01 > ul .txt_area{ padding:0 3rem;}
}
@media all and (max-width:1199.98px) {
    #businessA_sec01 > .tit_area{ font-size:2.3rem; margin-bottom:5rem;}
    #businessA_sec01 > ul li{ margin-bottom:10rem;}
    #businessA_sec01 > ul .txt_area strong{ font-size:2rem; margin-bottom:1rem; }
    #businessA_sec01 > ul .txt_area ul li{ font-size:1.8rem; }
}

@media all and (max-width:991.98px) {
    #businessA_sec01 > .tit_area{ font-size:2rem; margin-bottom:3rem;}
    #businessA_sec01 > ul > li{ margin-bottom:8rem;}
    #businessA_sec01 > ul .img_area{ width:100%; height:auto; padding-top:50%;  }
    #businessA_sec01 > ul .txt_area{ width:100%; padding:2rem; }
    #businessA_sec01 > ul .txt_area ul li{ font-size:1.6rem; }

    #businessA_sec02 .sub_com_tit02,
    #businessA_sec03 .sub_com_tit02{ padding:2rem;}
}

@media all and (max-width:767.98px) {
    #businessA_sec01 > ul > li{ margin-bottom:6rem;}
}

/*유해화학물질 운송 보관*/
#businessB_sec01{ text-align:center; }
#businessB_sec01 h4{ font-size:2.2rem; line-height:1.8; }
#businessB_sec01 .com_link01{ margin:3rem 0 6rem;}
#businessB_sec01 ul{ display:flex; flex-wrap:wrap;}
#businessB_sec01 ul li{ width:calc(25% - 1.875rem); margin-right:2.5rem;}
#businessB_sec01 ul li:last-child{ margin-right:0; }
#businessB_sec01 ul li .img_area{ border:1px solid #ddd;}
#businessB_sec01 ul li strong{ display:block; margin-top:2rem; font-size:1.8rem; font-weight:400; }

#businessB_sec02 .content_area{ margin-bottom:6rem;}
#businessB_sec02 .content_area > p{ margin-bottom:.5rem; font-size:1.8rem; color:#333; padding-left:2rem; text-indent:-1.5rem;  }
#businessB_sec02 .content_area > p:last-child{ margin-bottom:0; }
#businessB_sec02 .inner_area{ display:flex; flex-wrap:wrap; text-align:center;}
#businessB_sec02 .inner_area > div{ width:calc(50% - 2rem); margin-right:4rem; border:1px solid #ddd; margin-bottom:2rem;}
#businessB_sec02 .inner_area > div:last-child{ margin-right:0;}
#businessB_sec02 .inner_area > div strong{ display:block; padding:2rem 0; font-size:2rem; color:#222; background:#e7e7e7; font-weight:500;  }

#businessB_sec03 ul{ display:flex; flex-wrap:wrap; justify-content:center; }
#businessB_sec03 ul li{ width:calc(20% - 3.2rem); margin-right:4rem; margin-top:4rem; padding:2rem 15px; border:1px solid #ddd; text-align:center; }
#businessB_sec03 ul li:last-child{ margin-right:0;}
#businessB_sec03 ul li:nth-child(-n+4){ margin-top:0;}
#businessB_sec03 ul li img{ width:80%; max-width:197px; min-width:70px; }
#businessB_sec03 ul li strong{ display:block; margin-top:2rem; font-size:1.8rem; font-weight:400; }

#businessB_sec04{ text-align: center;}

@media all and (max-width:1199.98px) {
    #businessB_sec01 h4{ font-size:2rem; }
    #businessB_sec01 ul li{ width:calc(25% - 1.5rem); margin-right:2rem;}

    #businessB_sec02 .inner_area > div{ width:calc(50% - 1rem); margin-right:2rem; }
    #businessB_sec02 .inner_area > div strong{padding:1rem 0;   font-size:1.8rem; }

    #businessB_sec03 ul:last-child{ margin-top:2rem;}
    #businessB_sec03 ul li{ width:calc(20% - 1.6rem); margin-right:2rem;}
    #businessB_sec03 ul li strong{ font-size:1.6rem; }
}

@media all and (max-width:991.98px) {
    #businessB_sec01 h4 br{ display:none; }
    #businessB_sec01 ul li strong{margin-top:1rem; font-size:1.6rem; }
    
    #businessB_sec02 .inner_area > div{ width:100%; margin-right:0; }
    #businessB_sec02 .content_area > p{ font-size:1.6rem; text-indent:-1.2rem; }

    #businessB_sec03 ul li strong br{ display:none; }

    #businessB_sec04 img{ width:40rem; }
}

@media all and (max-width:767.98px) {
    #businessB_sec01 ul li{ width:calc(50% - 1rem); margin-top:2rem;}
    #businessB_sec01 ul li:nth-child(2n+2){ margin-right:0;}
    #businessB_sec01 ul li:nth-child(-n+2){ margin-top:0; }

    #businessB_sec03 ul{ max-width:400px; margin:0 auto; }
    #businessB_sec03 ul li{ width:calc(50% - 1rem); margin-top:2rem;}
    #businessB_sec03 ul li:nth-child(-n+4){ margin-top:2rem;}
    #businessB_sec03 ul li:nth-child(2n+2){ margin-right:0;}
    #businessB_sec03 ul li:nth-child(-n+2){ margin-top:0; }
}


/*시설현황*/
#facility_sec02 .desc{ margin:5rem 0; text-align:center; font-size:2.2rem; font-weight:400; line-height:1.8;   }

.facility_circle{ position:relative; padding:41rem 0; background:url('/html/_img/sub/facility_circle_bak.png') no-repeat center / 57.8rem ;}
.facility_circle .circle_tit{ width:29rem; height:29rem; line-height:29rem; margin:0 auto; background:#fff; border-radius:100%; text-align:center; box-shadow:0 0 20px rgba(0,0,0,0.08);  }
.facility_circle .circle_list{ position:absolute; top:0; left:0; width:100%; height:100%; text-align:center;   }
.facility_circle .circle_list li{ position:absolute;  }
.facility_circle .circle_list li:nth-child(1){ top:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); }
.facility_circle .circle_list li:nth-child(2){ top:0; left:50%; transform:translate(100%,50%); -webkit-transform:translate(100%,50%); -moz-transform:translate(100%,50%); }
.facility_circle .circle_list li:nth-child(3){ top:50%; left:50%; transform:translate(150%,-50%); -webkit-transform:translate(150%,-50%); -moz-transform:translate(150%,-50%); }
.facility_circle .circle_list li:nth-child(4){ bottom:0; left:50%; transform:translate(100%,-50%); -webkit-transform:translate(100%,-50%); -moz-transform:translate(100%,-50%); }
.facility_circle .circle_list li:nth-child(5){ bottom:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); }
.facility_circle .circle_list li:nth-child(6){ bottom:0; right:50%; transform:translate(-100%,-50%); -webkit-transform:translate(-100%,-50%); -moz-transform:translate(-100%,-50%); }
.facility_circle .circle_list li:nth-child(7){ top:50%; right:50%; transform:translate(-150%,-50%); -webkit-transform:translate(-150%,-50%); -moz-transform:translate(-150%,-50%); }
.facility_circle .circle_list li:nth-child(8){ top:0; right:50%; transform:translate(-100%,50%); -webkit-transform:translate(-100%,50%); -moz-transform:translate(-100%,50%); }
.facility_circle .circle_list li *{ display:block; font-size:2.2rem;}
.facility_circle .circle_list li img{  margin:0 auto 1rem;  }

.facility_circle_list{ max-width:110rem; margin:8rem auto 0;}
.facility_circle_list li{ font-size:2rem; font-weight:600; margin-bottom:.5rem; padding-left:2rem; text-indent:-1.5rem;}
.facility_circle_list li:last-child{ margin-bottom:0;}

.facility_list02{ display:flex; flex-wrap:wrap; margin-top:5rem; }
.facility_list02 li{ width:calc(33.33% - 1.4rem); padding:2.5rem 15px; margin-right:2.1rem; text-align:center;}
.facility_list02 li:nth-child(1){ background:#0082a9;}
.facility_list02 li:nth-child(2){ background:#008c44;}
.facility_list02 li:nth-child(3){ background:#7abf52; margin-right:0; }
.facility_list02 li > div{ height:100%; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; }
.facility_list02 li p{ color:#fff; font-size:2rem; }
.facility_list02 li p b{ font-size:2.2rem;}
.facility_list02 li b.tit{ display:block; font-size:2rem; color:#fff; font-weight:500; margin-bottom:.5rem;  }
.facility_list02 li strong{ display:block; font-size:3rem; color:#fff; }

.facility_list03{ display:flex; flex-wrap:wrap; }
.facility_list03 li{ width:20%; border-right:1px solid #ddd; padding:3rem 1rem; text-align:center;  }
.facility_list03 li:last-child{ border-right:0;  }
.facility_list03 li b{ display:block; font-size:2rem; font-weight:500;  margin-bottom:1rem; }
.facility_list03 li p{ font-size:2rem;font-weight:500; }

.facility_img_area{ display:flex; flex-wrap:wrap; margin-bottom:5rem;}
.facility_img_area > div{ width:calc(33.33% - 1.4rem); margin-right:2.1rem;}
.facility_img_area > div:last-child{ margin-right:0; }

@media all and (max-width:1440px) {
    .facility_circle{ padding:35rem 0;}
    .facility_circle .circle_list li *{ font-size:1.8rem;}
    .facility_circle .circle_list li img{ width:20rem;}
}
@media all and (max-width:1199.98px) {
    .facility_circle_list{ margin:5rem auto 0;}
    .facility_circle_list li{ font-size:1.8rem;}

    #facility_sec02 .desc{ font-size:2rem; }
    #facility_sec02 .desc br{ display:none; }

    .facility_list02 li p{ font-size:1.8rem; }
    .facility_list02 li p b{ font-size:2rem;}
    .facility_list02 li b.tit{ font-size:1.8rem; }
    .facility_list02 li strong{ font-size:2.5rem;}

    .facility_list03 li b,
    .facility_list03 li p{ font-size:1.6rem; }
    .facility_list03 li p br{ display:none; }
} 
@media all and (max-width:991.98px) {
    .facility_circle{ padding:0;  background:none;}
    .facility_circle .circle_tit{ width:20rem; height:20rem; margin-bottom:3rem; line-height:20rem;  }
    .facility_circle .circle_tit img{width:70%;}
    .facility_circle .circle_list{ position:static; display:flex; flex-wrap:wrap;}
    .facility_circle .circle_list li{ position:static; width:33.33%; padding:1rem;  transform:none !important; -webkit-transform:none !important; -moz-transform:none !important;}
    .facility_circle .circle_list li img{ width:15rem; }
    
    .facility_circle_list{ margin:3rem auto 0;}
    .facility_circle_list li{ font-size:1.6rem;}
    
    #facility_sec02 .desc{ font-size:1.8rem; margin:3rem 0;  }
    .facility_list02 li p{ font-size:1.6rem; }
    .facility_list02 li p b{ font-size:1.8rem;}
    .facility_list02 li b.tit{ font-size:1.6rem; }
    .facility_list02 li strong{ font-size:2rem;}

    .facility_list02{ margin-top:3rem;}

    .facility_img_area{ margin-bottom:3rem; }
}
@media all and (max-width:767.98px) {
    
    .facility_list02 li{ width:100%; margin-right:0; margin-bottom:1.5rem;}
    .facility_list02 li:last-child{ margin-bottom:0;}

    .facility_img_area > div{ width:calc(33.33% - 1rem); margin-right:1.5rem; }
}
@media all and (max-width:575.98px) {
    .facility_circle .circle_list{ max-width:45rem; margin:0 auto; }
    .facility_circle .circle_list li{ width:50%; }

    .facility_list03 li{ width:100%; border-right:0; border-bottom:1px solid #ddd; }
    .facility_list03 li:first-child{ padding-top:0; }
    .facility_list03 li:last-child{ border-bottom:0; padding-bottom:0;  }
}


/*esg*/
#esg_sec01{ text-align:center;}
#esg_sec01 .desc{ text-align:center; font-size:2.4rem; font-weight:400; line-height:1.7;   }
#esg_sec01 .circle_area{ margin:6rem auto 9rem;}
#esg_sec01 .bubble_list{ margin:6rem auto 9rem; font-size:0; }
#esg_sec01 .bubble_list li{ position:relative; display:inline-block; width:34rem; height:34rem; border-radius:100%; }
#esg_sec01 .bubble_list li:nth-child(1){ background:rgba(0,140,68,0.9); display:block; margin:0 auto;}
#esg_sec01 .bubble_list li:nth-child(2){background:rgba(41,128,185,0.9);}
#esg_sec01 .bubble_list li:nth-child(3){background:rgba(0,45,90,0.9);}
#esg_sec01 .bubble_list li:nth-child(2),
#esg_sec01 .bubble_list li:nth-child(3){ margin-left:-3rem; margin-right:-3rem; margin-top:-9rem; }
#esg_sec01 .bubble_list li > div{ position:absolute; top:50%; left:0; width:100%;
    transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%);
}
#esg_sec01 .bubble_list li > div b{ display:block; font-size:3rem; color:#fff; margin-bottom:1rem;}
#esg_sec01 .bubble_list li > div small{ display:block; font-size:2.8rem; font-weight:600; color:#fff;  }

#esg_sec01 .img_area{ display:flex; flex-wrap:wrap; margin:4rem 0;}
#esg_sec01 .img_area > div{ width:calc(33.33% - 1.4rem); margin-right:2.1rem;}
#esg_sec01 .img_area > div:last-child{ margin-right:0; }

#esg_sec01 .step_list{ display:flex; flex-wrap:wrap; margin:4rem auto 10rem; background:url('/html/_img/sub/esg_bak01.png') no-repeat left top / 100% auto;  }
#esg_sec01 .step_list li{ width:25%; }
#esg_sec01 .step_list li b{ display:block; padding:10.5% 0; margin-bottom:2rem; font-size:2rem; color:#fff;}
#esg_sec01 .step_list li p{ font-size:1.8rem; }

@media all and (max-width:1199.98px) {
    #esg_sec01 .desc{ font-size:2rem; }
    #esg_sec01 .bubble_list li{ width:28rem; height:28rem;}
    #esg_sec01 .bubble_list li > div b{ font-size:2rem; margin-bottom:.5rem; }
    #esg_sec01 .bubble_list li > div small{ font-size:2.3rem;}
    #esg_sec01 .bubble_list li:nth-child(2),
    #esg_sec01 .bubble_list li:nth-child(3){ margin-left:-2rem; margin-right:-2rem; margin-top:-7rem; }

    #esg_sec01 .step_list li b{ padding:9% 0;  margin-bottom:1rem; font-size:1.8rem; }
    #esg_sec01 .step_list li p{ font-size:1.6rem; }
}

@media all and (max-width:991.98px) {
    #esg_sec01 .desc{ font-size:1.8rem; }
    #esg_sec01 .desc br{ display:none; }
    #esg_sec01 .circle_area{ margin:4rem 0;}
    #esg_sec01 .bubble_list{ margin:4rem 0;}
    #esg_sec01 .bubble_list li{ width:20rem; height:20rem;}
    #esg_sec01 .bubble_list li > div b{ font-size:1.8rem;}
    #esg_sec01 .bubble_list li > div small{ font-size:2rem;}
    #esg_sec01 .bubble_list li:nth-child(2),
    #esg_sec01 .bubble_list li:nth-child(3){ margin-left:-1rem; margin-right:-1rem; margin-top:-5.5rem; }

    #esg_sec01 .step_list{ margin:4rem 0 6rem; }
    #esg_sec01 .step_list{ background:none; border-top:1px solid #ddd; }
    #esg_sec01 .step_list li{ width:100%; border-bottom:1px solid #ddd; padding:3rem 0;  }
    #esg_sec01 .step_list li b{ color:#000; padding:0; margin-bottom:1rem;}
}

@media all and (max-width:767.98px) {
    #esg_sec01 .img_area > div{ width:calc(33.33% - 1rem); margin-right:1.5rem; }
}


/*contact us*/
#contact_sec02 ul{ display:flex; flex-wrap:wrap; padding-top:11rem; border-top:1px solid #ddd; }
#contact_sec02 ul li{ display:flex; flex-wrap:wrap;  width:calc(33.33% - 3.2rem); margin-right:4.8rem; margin-top:4.8rem; border:1px solid #ddd; border-top:2px solid #000; padding:4rem 5rem;}
#contact_sec02 ul li > div{ width:100%; }
#contact_sec02 ul li > div.txt_area{ height:fit-content; margin-bottom:3rem; }
#contact_sec02 ul li:nth-child(3n+3){ margin-right:0; }
#contact_sec02 ul li:nth-child(-n+3){ margin-top:0;}
#contact_sec02 ul li small{ display:block; font-size:1.4rem; font-weight:500; margin-bottom:.5rem;}
#contact_sec02 ul li h4{ font-size:2.2rem; font-weight:700; margin-bottom:3rem;  }
#contact_sec02 ul li p{ display:flex; flex-wrap:wrap; margin-bottom:1rem; font-size:1.8rem; }
#contact_sec02 ul li p b{ font-weight:400; }
#contact_sec02 ul li p span{ margin-left:auto; }
#contact_sec02 ul li .link_area{ display:flex; flex-wrap:wrap; }
#contact_sec02 ul li .link_area a{ display:block; width:100%; height:6rem; margin-bottom:1rem;  line-height:6rem; border-radius:5px; font-size:1.8rem; font-weight:500; color:#fff; text-align:center; background:#008c44;  }
#contact_sec02 ul li .link_area a:last-child{ margin-bottom:0; }
#contact_sec02 ul li .link_area a.color_blue{background:#002d5a;}
#contact_sec02 ul li .link_area a i{ margin-right:1rem;}

@media all and (max-width:1600px) {
    #contact_sec02 ul li{ padding:3rem;}
    #contact_sec02 ul li .link_area a{ font-size:1.6rem;}
}
@media all and (max-width:1199.98px) {
    #contact_sec02 ul{ padding-top:9rem;}
    #contact_sec02 ul li{  width:calc(33.33% - 1rem); margin-right:1.5rem; margin-top:1.5rem; }
    #contact_sec02 ul li > div.txt_area{ margin-bottom:2rem; }
    #contact_sec02 ul li p{ font-size:1.6rem; }
    #contact_sec02 ul li p b{ width:100%;  }
    #contact_sec02 ul li p span{ margin-left:0;}
    #contact_sec02 ul li .link_area a{ height:5rem; line-height:5rem; font-size:1.4rem;}
    #contact_sec02 ul li .link_area a i{ margin-right:.5rem;}
}

@media all and (max-width:991.98px) {
    #contact_sec02 ul{ padding-top:7rem;}
    #contact_sec02 ul li{  width:calc(50% - .75rem); }
    #contact_sec02 ul li:nth-child(3n+3){ margin-right:1.5rem; }
    #contact_sec02 ul li:nth-child(-n+3){ margin-top:1.5rem;}
    #contact_sec02 ul li:nth-child(2n+2){ margin-right:0; }
    #contact_sec02 ul li:nth-child(-n+2){ margin-top:0;}
}

@media all and (max-width:767.98px) {
    #contact_sec02 ul{ padding-top:5rem;}
}

@media all and (max-width:575.98px) {
    #contact_sec02 ul li{  width:100%; margin-right:0;  }
    #contact_sec02 ul li:nth-child(3n+3){ margin-right:0rem; }
    #contact_sec02 ul li:nth-child(-n+2){ margin-top:1.5rem;}
    #contact_sec02 ul li:nth-child(-n+1){ margin-top:0;}
}
    

    
/* 카카오맵 cont 숨김처리 */
.root_daum_roughmap .cont {
    display: none !important;
}