@charset "utf-8";

#wrap{overflow: hidden; width: 100%;position: relative;}

.cf::after {
  content: '';
  clear: both;
  display: block;
}
.blue{color: #005c9c!important;}
.dark{color: #222!important;}
.blind{font-size: 0; line-height: 0; visibility: hidden; position: absolute; left: 0; top: 0; width: 0; height: 0; opacity: 0;}
sup {
  vertical-align: super;
  font-size: small;
}
.greybox {
  width: 100%;
  height: auto;
  margin-top: 60px;
  padding: 35px;
  background: #eeeeee;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  line-height: 1.66;
}
.bluebox {
  width: 100%;
  height: auto;
  margin-top: 60px;
  padding: 35px;
  background: #05507d;
  color: #fff;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  line-height: 1.66;
}

sub {font-size: small;}

.greybox p {margin-top: 10px;}

.d-flex{display: flex;}
.d-iflex{display: inline-flex;}
.ai-c{align-items: center !important;}
.ai-e{align-items: flex-end !important;}
.fl-d{flex-direction: column;}
.jc-sb{justify-content: space-between;}
.flw-w{flex-wrap: wrap;} 
.ff-en{ font-family: 'Metropolis', sans-serif; }
.ff-en2{ font-family: 'Roboto', sans-serif; }

.inr-c3{max-width: 1460px; width: 90%; margin-left: auto; margin-right: auto; box-sizing: border-box; }
.inr-c4{max-width: 1332px; margin-left: auto; margin-right: auto; box-sizing: border-box; padding-left: 40px; padding-right: 40px;}
.inr-c5{max-width: 1080px; margin-left: auto; margin-right: auto; box-sizing: border-box; /*padding-left: 40px; padding-right: 40px;*/}

.spot_sub{height: 510px; position: relative; display: flex; align-items: center; }
.spot_sub > .bg{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: cover; z-index: 0;}
.spot_sub > .inner{ width: 92%; max-width: 1460px; margin-left: auto; margin-right: auto; position: relative; z-index: 1;  }
.spot_sub .h1{color: #ffffff;font-size: 60px;font-weight: 600;text-align: left;line-height: 1;margin-top: 110px;}

.wrap_banner_type1{ width: 100%; height: 320px; display: flex; align-items: center; justify-content: center; position: relative; }
.wrap_banner_type1:after{position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; background-color: rgba(0, 0, 0, 0.45); content: "";}
.wrap_banner_type1 > .inner{padding: 0 50px; position: relative; z-index: 1; color: #fff; z-index: 2;}
.wrap_banner_type1 .h1{font-size: 35px; font-size: 2.1875em; line-height: 1.2; font-weight: 500;}
.wrap_banner_type1 .t1{margin-top: 10px; font-size: 20px; font-size: 1.25em;}


.head-type-sub1{padding-top: 100px;  display:flex;flex-wrap: wrap;align-items: flex-end; border-bottom:1px #8b8b8b solid;padding-bottom: 29px; margin-bottom:65px;justify-content: space-between;}
.head-type-sub1  .h1{font-size:55px; font-size:3.4375em; line-height: 1.3; font-weight:300; letter-spacing:-0.02em; color:#222;}
.head-type-sub1 .rgh .tab.ty3{margin-bottom: 12px;}


.box-head1{ display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap;}
.box-head1 .lft{}
.box-head1 .rgh{}
.box-head1 .h1{}
.box-head1 .t1{font-size: 18px; font-size: 1.125em; margin-top: 47px;}


.box-col-type1{ display: flex; justify-content: space-between; align-items: flex-end; }


.tab.ty2{}
.tab.ty2 > ul{display: flex;}
.tab.ty2 > ul > li{} 
.tab.ty2 > ul > li > a{
    display: block;
    position: relative;
    padding: 10px 30px 25px;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.01em;
    line-height: 1;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    color: #bbb;
} 
.tab.ty2 > ul > li a:after{
  position: absolute;
  left: 1px;
  top: 50%;
  width: 1px;
  height: 20px;
  background-color: #ddd;
  content: "";
  /*position: absolute;left: 50%;top: -8px;width: 6px;height: 6px;border-radius: 50%;background-color: #099de8;content: "";margin-left: -3px;
    opacity: 0;*/
  margin-top: -17px;
}
.tab.ty2 > ul > li.on > a,
.tab.ty2 > ul > li > a:hover{ color:#099de8;} 

.tab.ty2 > ul > li.on > a:before{ position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; background-color: #099de8; content: "";} 
/*

.tab.ty2 > ul > li.on a:after{
    opacity: 1;
    -webkit-animation: bounce-in-top 1.1s both;
            animation: bounce-in-top 1.1s both;
}*/

.tab.ty3{}
.tab.ty3 > ul{display: flex;}
.tab.ty3 > ul > li{
    margin-left: 30px;
} 
.tab.ty3 > ul > li > a{
    display: block;
    position: relative;
    padding: 10px 10px 0;
    font-size: 25px;
    font-weight: 300;
    letter-spacing: -0.01em;
    line-height: 1;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
} 
.tab.ty3 > ul > li a:after{
  position: absolute;left: 50%;top: -8px;width: 6px;height: 6px;border-radius: 50%;background-color: #099de8;content: "";margin-left: -3px;
    opacity: 0;
}
.tab.ty3 > ul > li.on > a,
.tab.ty3 > ul > li > a:hover{ color:#099de8;} 


.tab.ty3 > ul > li.on a:after{
    opacity: 1;
    -webkit-animation: bounce-in-top 1.1s both;
            animation: bounce-in-top 1.1s both;
}


.tab.ty6{}
.tab.ty6 > ul{display: flex; position:relative;}
.tab.ty6 > ul > li{
    flex: none;
    width: 28%;
    position:
    relative;
    z-index:0;
    background: #fff;
} 
.tab.ty6 > ul > li > a{
    display: block;
    position: relative;
    padding:  0 10px;
    font-size: 20px;
    font-weight: 300;
    letter-spacing: -0.01em;
    line-height: 1;
    /*-webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;*/
    color: #a9a9a9;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-style: solid;
    border-width: 1px 1px 0;
    border-color: #a9a9a9;
    margin-left: -1px;
    border-radius: 10px 10px 0 0;
    font-weight: 600;
} 
.tab.ty6 > ul:after{
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background-color: #008ed0;
  content: "";
  z-index: 1;
}
.tab.ty6 > ul > li.on{z-index:3;}
.tab.ty6 > ul > li.on > a{color: #008ed0;border-color: #008ed0;z-index: 2;border-width: 2px 2px 0;} 
.tab.ty6 > ul > li > a:hover{color: #008ed0;}

.tab.ty6.full.n2 > ul > li{ width: 50%;} 
.tab.ty6.full.n3 > ul > li{ width: 33.3332%;} 



@-webkit-keyframes bounce-in-top {

}
@keyframes bounce-in-top {
  0% {
    -webkit-transform: translateY(-30px);
            transform: translateY(-30px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }
  38% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
  55% {
    -webkit-transform: translateY(-20px);
            transform: translateY(-20px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  72% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  81% {
    -webkit-transform: translateY(-15px);
            transform: translateY(-15px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  90% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  95% {
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}



.tab.ty4 {  }
.tab.ty4 > ul{display: flex; margin-left: -5px;}
.tab.ty4 > ul > li{ padding-left: 5px; box-sizing: border-box; } 
.tab.ty4 > ul > li > a{
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 0 20px;
  min-width: 200px;
  height: 60px;
  color: #928786;
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1;
  background-color: #eee;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  box-sizing: border-box;
  border-radius: 500px;
/*  white-space: nowrap;*/
	text-align: center;
} 

.tab.ty4 > ul > li.on > a,
.tab.ty4 > ul > li > a:hover{ color:#fff; background-color: #099de8;} 
.tab.ty4 > ul > li.on > a { text-decoration: underline; text-underline-position: under; }

.tab.ty5{}
.tab.ty5 > ul{display: flex;}
.tab.ty5 > ul > li{ flex: none; margin-left: 40px; } 
.tab.ty5 > ul > li:first-child{margin-left: 0;}
.tab.ty5 > ul > li > a{position: relative;  display: block; position: relative; padding-bottom: 25px; color: #666; font-weight: 400; letter-spacing: -0.03em; line-height: 1;  box-sizing: border-box; border-bottom: 3px solid transparent; font-size: 18px; font-size: 1.125em; line-height: 1;}  
.tab.ty5 > ul > li > a:after{position: absolute;}
.tab.ty5 > ul > li.on > a,
.tab.ty5 > ul > li > a:hover{border-bottom: 3px solid #222; color: #222; font-weight: 500;} 


.title_esg{font-size:1.5625em; font-size:25px; font-weight:500; color:#fff;line-height: 1;padding: 0 11.6%;margin-bottom: 10px;}
.title_esg b{font-size:3.2em; font-weight:600; color:#fff; display:inline-block; margin-right:15px;}

.ico-circle{display:inline-flex; width: 30px; height: 30px; background:#222; border-radius:50%; color:#fff; justify-content: center;align-items: center;font-size: 12px;}

.btn_more2{ display:inline-flex;  align-items: center;color: #222;font-weight: 600;}
.btn_more2 .ico-circle{margin-left:10px;}
.btn_more2:hover{opacity:0.8;}

.btn_lang1{ display: inline-flex; color: #fff; background-color: transparent; border: 0; display: flex;align-items: center;justify-content: space-between; line-height: 1;padding: 7px 2px; position: relative; }
.btn_lang1 > a { font-size: 16px; display:flex; width:100%; align-items:center; justify-content: space-between; }
.btn_lang1 > a:before { content:''; width: 22px; height: 22px; flex: none; margin-right:14px; background-size:contain; background-repeat:no-repeat; background-position:center; background-image:url(../images/ico/ico_lang.png); }
.btn_lang1 > a:after { content:''; width:7px; height:7px; border-bottom:1px solid #fff; border-right:1px solid #fff; box-sizing:border-box; transform:rotate(45deg); margin-right: 5px; margin-bottom:9px; margin-left: 20px; }
.btn_lang1 .depth { display: none; position:absolute; top:100%; left:0;  width:100%; padding: 30px 10px; background-color:#426378; color:#fff; box-sizing:border-box; border-radius:20px; text-align:center; }
.btn_lang1 .depth li + li { margin-top:15px; }
.btn_lang1 .depth li a { font-size: 18px; color:#fff; }
.btn_lang1 .depth li a:hover { color: #00a5e5; }
.btn_lang1 option { color: #222; }
.btn_lang1:hover .depth { display:block; }

.container_sub{width: 100%; overflow: hidden; z-index: 2;}

.inr-c{max-width: 1446px; width: 90%; margin-left: auto; margin-right: auto;}
.inr-c2{max-width: 1260px; width: 90%; margin-left: auto; margin-right: auto;}

[class^="page-step"]{width: 100%; height: 100vh; position: relative; z-index: 2; box-sizing: border-box;}
[class^="page-step"] .head1{font-size: 38px; line-height: 1.2931; font-weight: 400;}
[class^="page-step"] .head2{font-size: 58px; line-height: 1.2931; font-weight: 700;margin-top: 30px;}

[class^="wrap_bgSlide"]{ 
  position: fixed; left: 0; top: 0; width: 100%; height: 100vh; z-index:0; 
}
[class^="wrap_bgSlide"] .bg{ position: absolute; left: 0; top: 0; width: 100%; height: 100vh;background-position: 50% 50%;background-size: cover; opacity: 0; z-index: 0;
  -webkit-transition: opacity 0.5s ease , top 0.7s  ease-in-out , transform 4s  ease-in-out ;
  -moz-transition: opacity 0.5s ease , top 0.7s  ease-in-out , transform 4s  ease-in-out ;
  -o-transition: opacity 0.5s ease , top 0.7s  ease-in-out , transform 4s  ease-in-out ;
  transition: opacity 0.5s ease , top 0.7s  ease-in-out , transform 4s  ease-in-out ;

}
[class^="wrap_bgSlide"] .bg.n1{ height: 120vh; }


.fp-viewing-1 [class^="wrap_bgSlide"] .bg{opacity: 0;}
.fp-viewing-1 [class^="wrap_bgSlide"] .bg.n1{
  opacity: 1;
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}
.fp-viewing-2 [class^="wrap_bgSlide"] .bg.n1{
  top:-20vh; opacity: 1;
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}
.fp-viewing-3 [class^="wrap_bgSlide"] .bg.n1{
  top:-20vh;
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}
.fp-viewing-3 [class^="wrap_bgSlide"] .bg.n2{
  opacity: 1;
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}
.fp-viewing-4 [class^="wrap_bgSlide"] .bg.n3{
  opacity: 1;
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}

.page-step1.spot-sub{}
.page-step1.spot-sub .txt{ color:#fff; }
.page-step2 .spot-cont{}



.view_more{ 
  position:fixed; left:50%; bottom:43px; z-index:2; opacity: 0; bottom:-80px;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
.view_more a{ color:#fff; display:inline-flex; text-align:center;flex-direction: column;}
.view_more a .txt{font-size:20px;font-weight: 300;}
.view_more a .ico{
  margin-top: 10px;font-size: 20px;
  -webkit-animation: slide-in-blurred-top-more1 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000) 0.2s infinite alternate backwards;
    animation: slide-in-blurred-top-more1 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000) 0.2s infinite alternate backwards;
}
.fp-viewing-1 .view_more{ opacity: 1; bottom:43px;  }

@-webkit-keyframes slide-in-blurred-top-more1 {
  0% {
   -webkit-transform: translateY(0) scaleY(1) scaleX(1);
            transform: translateY(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
    -webkit-filter: blur(0);
            filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-15px) scaleY(1.3) scaleX(1);
            transform: translateY(-15px) scaleY(1.3) scaleX(1);
    -webkit-transform-origin: 50% 0%;
            transform-origin: 50% 0%;
    /*-webkit-filter: blur(3px);
            filter: blur(3px);*/
    opacity: 0.6;

  }
}
@keyframes slide-in-blurred-top-more1 {
  0% {
   -webkit-transform: translateY(0) scaleY(1) scaleX(1);
            transform: translateY(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
    -webkit-filter: blur(0);
            filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-15px) scaleY(1.3) scaleX(1);
            transform: translateY(-15px) scaleY(1.3) scaleX(1);
    -webkit-transform-origin: 50% 0%;
            transform-origin: 50% 0%;
    /*-webkit-filter: blur(3px);
            filter: blur(3px);*/
    opacity: 0.6;

  }
}




.wrap_rollring4{}
.wrap_rollring4 .inner_rolling4{}
.wrap_rollring4 .inner_rolling4 .swiper-container{ padding-left: 11.9%; padding-right: 11.9%;   }
.wrap_rollring4 .inner_rolling4 .swiper-container .swiper-wrapper{ 
  /*max-width: 1447px; margin: 0 auto; */;
}


.wrap_rollring4 .swiper-slide{width: 30.3%;}
.wrap_rollring4 .item{position:relative;box-sizing:border-box;background:rgba(255,255,255,0.9); border-radius: 0 30px;
  -webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;

 }
.wrap_rollring4 .item:hover{background-color: #fff;}
.wrap_rollring4 .item .cont{-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;box-sizing:border-box;padding: 110px 13% 60px;border-radius:20px;margin: 0 auto;word-break: keep-all;height: 500px;display: flex;flex-direction: column;justify-content: space-between;}
.wrap_rollring4 .item .cont .p_cate{margin-bottom: 34px;font-size: 16px;}
.wrap_rollring4 .item .cont .h1{font-size: 30px; font-weight: 600; letter-spacing: -0.04em;line-height: 1.2; color: #222;}
.wrap_rollring4 .item .cont .t1{margin-top: 34px;overflow:hidden;height: 113px;line-height: 1.75;letter-spacing: -0.03em;color: #222;}
.wrap_rollring4 .item .cont .date{margin-top: 0;color:#999999;text-align: left;}
.wrap_rollring4 .item .cont .more{margin-top:70px;}
.wrap_rollring4 .pageing .swiper-button-prev2,
.wrap_rollring4 .pageing .swiper-button-next2{
  position:absolute;
  width:52px;
  height:52px;
  background:#1c1c1c;
  color:#fff;
  display:flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  z-index:4;
  top:50%;
  margin-top:-26px;
  cursor: pointer;
left: 50%;opacity: 0;
-webkit-transition: opacity 0.3s ease-in-out;
-moz-transition: opacity 0.3s ease-in-out;
-o-transition: opacity 0.3s ease-in-out;
transition: opacity 0.3s ease-in-out;

}
.wrap_rollring4 .pageing .swiper-button-prev2{margin-left: -39.4%;}
.wrap_rollring4 .pageing .swiper-button-next2{margin-left: 35.8%;}
.wrap_rollring4:hover .pageing .swiper-button-prev2:hover,
.wrap_rollring4:hover .pageing .swiper-button-next2:hover{opacity:0.7;}
.wrap_rollring4:hover .pageing .swiper-button-prev2,
.wrap_rollring4:hover .pageing .swiper-button-next2{opacity:0.3;}
.wrap_rollring4 .pageing .swiper-button-prev2.swiper-button-disabled,
.wrap_rollring4 .pageing .swiper-button-next2.swiper-button-disabled{display: none !important; }

@media screen and (max-width: 840px) {
  .wrap_rollring4{}
  .wrap_rollring4 .inner_rolling4{}
  .wrap_rollring4 .inner_rolling4 .swiper-container{}
  .wrap_rollring4 .inner_rolling4 .swiper-container .swiper-wrapper{}
  .wrap_rollring4 .item{position:relative;box-sizing:border-box;background:rgba(255,255,255,0.9);}
  .wrap_rollring4 .item:nth-child(3n+1):after{display:none;}
  
  .wrap_rollring4 .item .cont{-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;box-sizing:border-box;padding: 7vw 10vw;}
  .wrap_rollring4 .item .cont .p_cate{margin-bottom: 4vw;font-size: 4.4vw;}
  .wrap_rollring4 .item .cont .h1{overflow:hidden;height: 19vw;font-size: 6vw;font-weight: 600;letter-spacing: -0.04em;line-height: 9vw;color: #1c1c1c;}
  .wrap_rollring4 .item .cont .t1{margin-top: 5vw;overflow:hidden;height: 15vw;line-height: 7vw;letter-spacing: -0.03em;color: #888888;}
  .wrap_rollring4 .item .cont .date{margin-top: 5vw;}
  .wrap_rollring4 .item .cont .more{margin-top:70px;}
  .wrap_rollring4 .pageing .swiper-button-prev2,
  .wrap_rollring4 .pageing .swiper-button-next2{
    width: 10vw;
    height: 10vw;
    font-size: 4vw;
    margin-top: -5vw;
    cursor: pointer;
  }
  .wrap_rollring4 .pageing .swiper-button-prev2{left: -5vw;}
  .wrap_rollring4 .pageing .swiper-button-next2{right: 8vw;}
  .wrap_rollring4 .pageing .swiper-button-prev2:hover,
  .wrap_rollring4 .pageing .swiper-button-next2:hover{background:#e60012;}

}

.logo_widh{position: relative; display: inline-block;}
.logo_widh .img{ width: 144px; height: 40px; display: inline-block; font-size: 0; background: url(../images/common/posco_group_w.png); background-position: center; background-repeat: no-repeat; background-size: contain; }
.logo_widh .img.scroll{position: absolute; left: 0; top: 0; opacity: 0; background-image: url(../images/common/posco_group.png);}

#header.main.scroll{background: none;}
#header.share .logo_widh .img,
#header.menu .logo_widh .img{opacity: 0;}
#header.share .logo_widh .img.scroll,
#header.menu .logo_widh .img.scroll{opacity: 1;}

.btn_allmenu{ 
  width: 55px; height: 55px; border: 1px solid transparent; display: inline-flex; align-items: center; justify-content: center;  position: relative;flex-direction: column;
  -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    font-size: 0;
}
.btn_allmenu:after,
.btn_allmenu:before{ 
  width: 25px; height: 3px; background-color: #00578a; content:""; margin: 4px 0;display: block;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.btn_allmenu:hover{background:#009ee5; border-color:#009ee5;}

.btn_allmenu:hover:after,
.btn_allmenu:hover:before{ /*230503 주석 margin: -2px 0;*/ background-color: #fff; }

.btn_allmenu.active{background-color: #1c3c52; border: 1px solid rgba(255, 255, 255, 0.3); }
.btn_allmenu.active:after,
.btn_allmenu.active:before{
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  margin: -2px 0;
  background-color: #fff !important;
}
.btn_allmenu.active:after{
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.btn_allmenu.active:before{
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

/*230503 전체메뉴 가운데로 이동 및 기존헤더 스타일 삭제*/
.btn_allmenu {   
  border: 1px #fff solid;
  background-color: transparent;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  background-color: transparent;
  border-radius: 50%;
  position: relative;
  border: 1px #fff solid;
  cursor: pointer;
  padding: 0;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  font-size: 11px;
  color: #fff;
  font-family: 'Roboto', sans-serif;
  -webkit-transition: background 0.5s ease;
  transition: background 0.5s ease;
  font-size: 0;
/*  margin-left: 112px ;*/
}



.btn_allmenu:after,
.btn_allmenu:before{ 
  width: 22px; height: 2px; background-color: #fff; content:""; margin: 4px 0;display: block;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.btn_allmenu:hover{
  border: 1px #005689 solid;
  background-color: #005689;
}

.menuOpen #header .btn_allmenu {display: none;}

/* 230412 서브페이지 헤더스타일 추가 */

#header.sub .btn_allmenu{
  border: 1px #b6b6b6 solid;
}
#header.sub .btn_allmenu::after,
#header.sub .btn_allmenu::before{
  background-color: #222;
}
#header.sub {
  background-color: #fff;
}
#header.sub .logo_widh .img{
  background-image: url(../images/common/posco_group.png);

}
#header.sub .logo .img {
  background-image: url(../images/common/logo_posoco_blue.png);
}
#header.sub .area_rgh .opt .lang li{
  color:#222;
}
#header.sub .area_rgh .opt .lang li.active{
  border-color: #222;
}

#header .ico_blank{margin-left: 5px;margin-top: -5px;}
#header{position: absolute; top: 0; width: 100%; z-index: 5; background-color: transparent; /*border-bottom: 1px rgba(255,255,255,0.3) solid; 230323 */box-sizing: border-box; }
#header > .inner{display:flex; margin: 0 70px; position: relative; height: 100px;align-items: stretch;justify-content: space-between;box-sizing: border-box;align-items: center;}
#header .logo{ font-size: 0; display: flex; align-items: center; position: relative; }
#header .logo > a{display: inline-block; position: relative;font-size: 0;}
#header .logo .img{ background-image: url(../images/common/logo_posoco.png); width: 126px; height: 34px; display: inline-block;  position: relative; z-index: 1; background-size: contain; background-repeat: no-repeat; background-position: center; }

#header .logo .img.scroll{ background-image: url(../images/common/logo_posoco_blue.png); opacity: 0;}


#header.menu .logo .img{opacity: 0;}
#header.menu .logo .img.scroll{opacity: 1;}

#header .area_cen {position: absolute; left: 50%; transform: translateX(-50%);}

#header .logo .img.scroll{
  position: absolute; left: 0; top: 0; z-index: 0;
  -webkit-transition: opacity 0.3s ease;
  -moz-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
#header.share .logo .img,
#header.share .logo .img.scroll,




#header .area_rgh{ display: flex;align-items: center;justify-content: flex-end; gap: 40px;}
#header .area_rgh .opt .lang li{
  display: inline-block;
  color: #fff;
  font-size: 14px;
  margin-right: 7px;
  border-bottom: 2px transparent solid;
  padding: 3px 0;
  opacity: 0.6;
  line-height: 14px;
}
#header .area_rgh .opt .lang li.active{
  border-color: #fff;
  opacity: 1;
}
#header.share .menu >  ul > li > a,
#header.menu .menu >  ul > li > a{color: #222222;}




#header .area_rgh .col.widh{padding-top: 15px;}
#header .area_rgh .col.member{margin-right:55px;}
#header .area_rgh .col.member a{color:#fff;}
#header .area_rgh .col.member a:hover{opacity:0.8;}
#header .area_rgh .col{}
#header .area_rgh .col.member,
#header .area_rgh .col.lang{display: none;}




/* 230503 #header .menu 기존 헤더스타일 주석처리 */
/*.header_banner + #header { top: 50px; }

#header.share .btn_allmenu,
#header.menu .btn_allmenu{  }

#header,
#header .menu > ul,
#header .menu > ul .mm{height: 90px; position:relative;}
#header .menu > ul > li:after{ 
  position:absolute; left:0; bottom:0; width:100%; height:4px; background-color:#00a5e5; content:""; 
   -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
opacity: 0;}

#header .menu > ul > li.hover:after{ opacity:1;}
#header .ico_blank{margin-left: 5px;margin-top: -5px;}
#header{position: fixed; top: 0; width: 100%; z-index: 5; background-color: transparent;*//*border-bottom: 1px rgba(255,255,255,0.3) solid; 230327*/ /*box-sizing: border-box; }
#header > .inner{display:flex; margin: 0 70px; position: relative; height: 90px;align-items: stretch;box-sizing: border-box;}
#header .logo{ font-size: 0; display: flex; align-items: center; position: relative; }
#header .logo > a{display: inline-block; position: relative;font-size: 0;}
#header .logo .img{ *//*background-image: url(../images/common/logo_posoco.png);*/ /*width: 126px; height: 34px; display: inline-block;  position: relative; z-index: 1; background-size: contain; background-repeat: no-repeat; background-position: center; }
#header .logo .img.scroll{ background-image: url(../images/common/logo_posoco_blue.png);}
#header .logo .img.scroll{
  position: absolute; left: 0; top: 0; z-index: 0;
  -webkit-transition: opacity 0.3s ease;
  -moz-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
#header.share .logo .img,
#header.menu .logo .img{opacity: 0;}
#header.share .logo .img.scroll,
#header.menu .logo .img.scroll{opacity: 1;}


#header .menu{margin: 0 auto;}
#header .menu > ul{display: flex;}
#header .menu > ul > li{position:relative;}
#header .menu > ul > li > a{color: #fff; *//*#222 230321*/ /*font-size: 19px; font-weight: 500; display: flex; align-items: center; justify-content: center; padding: 0 45px;*/ /*padding: 0 45px;*//*line-height: 1;}
#header .area_rgh{ display: flex;align-items: center;justify-content: flex-end;}
#header.share .menu >  ul > li > a,
#header.menu .menu >  ul > li > a{color: #222222;}*/

/*#header .menu >  ul > li.active > a,
#header .menu >  ul > li.hover > a {color: #fff;}*/

/*.share #header .menu >  ul > li.active > a,
.share #header .menu >  ul > li.hover > a,
.menu #header .menu >  ul > li.active > a,
.menu #header .menu >  ul > li.hover > a{color: #00a5e5;}


#header .area_rgh .col.widh{padding-top: 32px;margin-right: 44px;}
#header .area_rgh .col.member{margin-right:55px;}
#header .area_rgh .col.member a{color:#fff;}
#header .area_rgh .col.member a:hover{opacity:0.8;}
#header .area_rgh .col{}
#header .area_rgh .col.member,
#header .area_rgh .col.lang{display: none;}






#header .menu .depth2{position: absolute; left: 50%; top: 89px;padding-top: 0; display: none;margin-left: -140px;}
#header .menu .depth2 > ul{background: #fff;width: 220px;padding: 20px 30px; height: auto;box-shadow: 0 0.25rem 0.75rem rgb(0 0 0 / 10%);}
#header .menu .depth2 > ul > li{position:relative;}
#header .menu .depth2 > ul > li a:after{ 
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content:"\f054"; position: absolute;right: 0;top: 17px;font-size: 12px; opacity: 0;
  -webkit-transform: translate(-30px, 0px);
-moz-transform: translate(-30px, 0px);
-o-transform: translate(-30px, 0px);
-ms-transform: translate(-30px, 0px);
transform: translate(-30px, 0px);
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;

}


#header .menu .depth2 > ul a{line-height:1.4; display:inline-block; padding:10px 0;color: #222;}
#header .menu .depth2 > ul a:hover,
#header .menu .depth2 > ul a:focus{color: #00a5e5;}
#header .menu .depth2 > ul a:hover:after,
#header .menu .depth2 > ul a:focus:after{
  opacity: 1;
    -webkit-transform: translate(0, 0px);
-moz-transform: translate(0, 0px);
-o-transform: translate(0, 0px);
-ms-transform: translate(0, 0px);
transform: translate(0, 0px);
}

#header .menu .hover .depth2{
  display: block;
  -webkit-animation: depth2_ani 0.3s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;
    animation: depth2_ani 0.3s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;
}

@keyframes depth2_ani {
    0% {
        opacity: 0;
        -webkit-transform: translate(0px, 20px);
        -moz-transform: translate(0px, 20px);
        -o-transform: translate(0px, 20px);
        -ms-transform: translate(0px, 20px);
        transform: translate(0px, 20px);

     
    }
    100% {
        opacity: 1;
        -webkit-transform: translate(0, 0px);
        -moz-transform: translate(0, 0px);
        -o-transform: translate(0, 0px);
        -ms-transform: translate(0, 0px);
        transform: translate(0, 0px);

    }
}
*/



.menuOpen #header .area_rgh{ position:absolute; right:0; top:0; background-color:transparent; display: none;}
.menuOpen #header .area_rgh .col.widh{display:none;}
.menuOpen #header .area_rgh .col.member,
.menuOpen #header .area_rgh .col.lang{display: block;margin-right: 45px;}

@media screen and (max-width: 1680px) {
   body.main #header{ height: 130px; }
   #header > .inner{ margin: 0 40px; height: 80px;}
   #header, #header .menu > ul, #header .menu > ul .mm{ height: 80px; }
   #header .menu > ul > li > a{ padding: 0 30px;  }
   #header .menu .depth2{ top: 79px; }
   #header .area_rgh .col.widh{padding-top: 15px;margin-right: 20px;}
   .menuOpen #header .area_rgh .col.member,
   .menuOpen #header .area_rgh .col.lang{display: block;margin-right: 25px;}
}




.btn-close-popup{ width: 56px; height: 56px; position: fixed; left: 50%; top: 20vh;  border: 1px solid #acacac; border-radius: 50%; overflow: hidden; display: flex; align-items: center; justify-content: center; background: #fff;color: #333;font-size: 20px;z-index: 10;margin-left: 540px; opacity: 0;
  -webkit-transition: all 0.5s ease-in;
  -moz-transition: all 0.5s ease-in;
  -o-transition: all 0.5s ease-in;
  transition: all 0.5s ease-in;
  transition-delay: 0.3s;
  cursor: pointer;

}
.pop-Open .btn-close-popup{opacity: 1;}

.popup-type2{position: fixed; left: 0; top: 0; width: 100%; height: 100vh; z-index: 10;}
.popup-type2 .cover{ position: fixed; left: 0; top: 0; width: 100%; height: 100vh; background-color: rgba(245,245,247,.6); -webkit-backdrop-filter:blur(24px); backdrop-filter:blur(24px); z-index: 1; }

.popup-type2 .content-wrapper{ margin: 0 auto; max-width: 1260px; z-index: 5; position: relative; padding-bottom: 15vh;}
.popup-type2 .modal-content{background-color: #fff; overflow: hidden; width: 100%; margin-top: 17vh; min-height: 85vh; border-radius: 18px; box-shadow:0px 0px 16px 0px rgb(0, 0, 0, 0.1); opacity: 0; }
.popup-type2 .modal-inner{ max-width: 920px; margin: 120px auto; padding: 0 30px; }

.popup-type2 .cover{
  opacity: 0;
  -webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
-ms-transform: scale(1.2);
transform: scale(1.2);
-webkit-transition: all 0.6s ease-in;
-moz-transition: all 0.6s ease-in;
-o-transition: all 0.6s ease-in;
transition: all 0.6s ease-in;
}


.pop-Open.popup-type2{display: block;}

.pop-Open.popup-type2 .cover{
  opacity: 1;
-webkit-transform: scale(1);
-moz-transform: scale(1);
-o-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
  opacity: 1;
}

.popup-type2 .modal-content{
  opacity: 0;
-webkit-transform: scale(0.9) translate(0px, 100vh);
-moz-transform: scale(0.9) translate(0px, 100vh);
-o-transform: scale(0.9) translate(0px, 100vh);
-ms-transform: scale(0.9) translate(0px, 100vh);
transform: scale(0.9) translate(0px, 100vh);
transition: all 500ms cubic-bezier(0.760, -0.005, 0.395, 0.990); /* custom */

transition-timing-function: cubic-bezier(0.760, -0.005, 0.395, 0.990); /* custom */
}

.pop-Open.popup-type2 .modal-content{
  
    opacity: 1;
        -webkit-transform: scale(1) translate(0px, 0);
        -moz-transform: scale(1) translate(0px, 0);
        -o-transform: scale(1) translate(0px, 0);
        -ms-transform: scale(1) translate(0px, 0);
        transform: scale(1) translate(0px, 0);

  /*-webkit-animation: popContMotion 0.6s cubic-bezier(0.455, 0.030, 0.515, 0.955) 0 both;
  animation: popContMotion 0.6s cubic-bezier(0.455, 0.030, 0.515, 0.955) 0 both;*/
}

/*@-webkit-keyframes popContMotion {

}

@-moz-keyframes popContMotion {

}*/

@keyframes popContMotion {
    0% {
        
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1) translate(0px, 0);
        -moz-transform: scale(1) translate(0px, 0);
        -o-transform: scale(1) translate(0px, 0);
        -ms-transform: scale(1) translate(0px, 0);
        transform: scale(1) translate(0px, 0);

    }
}


.pr-mb-n{margin-bottom: 50px !important;}
.title0{font-size: 45px; font-weight: 600; color: #162941; line-height: 1.2;}
.title1{font-size: 30px; line-height: 1.2; font-weight: 600; color: #222222; margin-bottom: 55px; }
.title1.flex{display:flex; flex-wrap: wrap;}
.title1.flex > *{flex: none;}
.title1.flex .i-txt{margin-top: 2px;}
.title1.flex .txt{width: 90%;}
.title2{font-size: 18px; font-weight: 500; color: #222222; margin-bottom: 9px; }
.title3{font-size: 20px; font-weight: 500; color: #222222; margin-bottom: 25px; }

.group_txt1{line-height: 1.75; word-break: keep-all;}

@media screen and (max-width: 1520px) {
.pr-mb-n{margin-bottom: 30px !important;}
.title0{font-size: 30px;}
.title1{font-size: 20px; margin-bottom: 30px; }
.title1.flex .i-txt{margin-top: 2px;}
.title1.flex .txt{width: 90%;}
.title2{font-size: 16px; margin-bottom: 5px; }
.title3{font-size: 20px; margin-bottom: 20px; }
.group_txt1{line-height: 1.75; word-break: keep-all;}
}

.iScrollIndicator{border: 0 !important; width: 3px !important; background-color: #ddd;}

.wrap_search{width: 800px;margin: 5px 0 0; display: none;}
.wrap_search .flid{position:relative;}
.wrap_search .flid input{ border:0; border-bottom: 1px rgba(255,255,255,0.5) solid; padding-right:100px; background:transparent; width:100%; height: 50px; font-size:18px; color:#fff; box-sizing: border-box; letter-spacing:0.06em;}
.wrap_search .flid input:focus{border-color:#fff;}
.wrap_search .flid input::placeholder {color: #8d979f;}
.wrap_search .flid .btns{position:absolute; right:0; top:5px; display:flex;align-items: center;}
.wrap_search .flid .btns button{background:transparent; border:0; color:#fff; cursor:pointer;}
.wrap_search .flid .btns button:hover{opacity:0.8;}
.wrap_search .flid .btns .del{width:22px; height:22px; border-radius:50%; color: #000; display: inline-flex;background: #fff;justify-content: center;align-items: center;font-size: 11px;}
.wrap_search .flid .btns .search{font-size: 29px;margin-left: 10px;}
.wrap_search .suggestion{display:flex;flex-wrap: wrap;align-items: center; margin-top:17px;}
.wrap_search .suggestion a{color:#fff; display:block; line-height:1; margin-right:10px; /* border:1px #fff solid; */ padding: 4px 9px 9px 0; font-size:15px; border-radius:500px;}
.wrap_search .suggestion a:hover{opacity: 0.8;}

.menuOpen .wrap_search{ 
  display: block;
  -webkit-animation: fadeInType1 0.6s cubic-bezier(0.455, 0.030, 0.515, 0.955) 0.5s both;
    animation: fadeInType1 0.6s cubic-bezier(0.455, 0.030, 0.515, 0.955) 0.5s both;
}

.spot_main{}
.main-page{ padding-top: 110px; padding-bottom: 100px; }
.main-page.pb0{padding-bottom: 0;}
.main-page.bg2{background-color: #f0eff3;}

.head-type1{text-align: center; margin-bottom: 111px;}
.head-type1 .h1{color: #0c254b; font-size: 40px; line-height: 1.25; font-weight: 600;}

.head-type2{text-align: center; margin-bottom: 60px;}
.head-type2 .h1{color: #222; font-size: 45px; font-size: 2.8125em; line-height: 1.25; font-weight: 500;}
.head-type2 .t1{margin-top: 25px;  position: relative; font-size: 20px; font-size: 1.25em; line-height: 1.75; color: #222;}
.head-type2 .t1.line_top{padding-top: 25px;}
.head-type2 .t1.line_top:after{position: absolute; left: 50%; top: 0; width: 42px; height: 2px; background-color: #00b8f5; content: ""; margin-left: -21px; }


.tab-type1{margin-bottom: 50px;}
.tab-type1 > ul{display: flex;align-items: center;justify-content: center;flex-wrap: wrap;}
.tab-type1 > ul >li{margin: 0 3px;}
.tab-type1 > ul >li > a{width: 360px; height: 95px; border: 2px solid #d8d7da; display: inline-flex; align-items: center; flex-direction: column; justify-content: center; color: #00578a; font-weight: 500;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.tab-type1 > ul >li> a:hover,
.tab-type1 > ul >li.on > a{border-color: #00578a;}

.btn_play{width: 100px; height: 100px; display: flex; align-items: center; justify-content: center; color: #fff; border: 2px #fff solid; border-radius: 50%;font-size: 40px;}
.area_video{position: relative; width: 100%; height: calc(100vh - 100px); overflow: hidden;}
.area_video .cover{position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.area_video .cover:after{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #000; opacity: 0.3; z-index: 2; content: "";}
.area_video .cover .bg{
  position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; background-size: cover;
-webkit-transition: all 1.5s ease;
-moz-transition: all 1.5s ease;
-o-transition: all 1.5s ease;
transition: all 1.5s ease;
background-position: 50% 50%;
}
.area_video .btn_play{ position: absolute; left: 50%; top: 50%; margin-top: -50px; margin-left: -50px; z-index: 2;
  -webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.area_video .btn_play i{margin-left:6px}
.area_video .btn_play:hover{opacity: 0.3;}
.area_video.hover .cover .bg {
    -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -o-transform: scale(1.05);
  -ms-transform: scale(1.05);
  transform: scale(1.05);
}

.wrap_areaInfoMain{width: 100%; overflow: hidden;}
.wrap_areaInfoMain > .center{margin: 0 auto; text-align: center; }
.wrap_areaInfoMain .item{position: relative; padding: 30px 0 40px;}
.wrap_areaInfoMain .item .txt{}
.wrap_areaInfoMain .item .h1{font-size: 32px; line-height: 1.2; color: #222; font-weight: 600;}
.wrap_areaInfoMain .item .t1{line-height: 1.4; color: #666; font-size: 20px; font-size: 1.25em; margin-top: 15px;}
.wrap_areaInfoMain .thumb{position: absolute; top: 0; left: 50%; }
.wrap_areaInfoMain .item .thumb.n1{top: -130px;margin-left: -925px;}
.wrap_areaInfoMain .item .thumb.n2{top: -100px; margin-left: 185px;}
.wrap_areaInfoMain .item .thumb.n3{top: -120px;margin-left: -925px;}
.wrap_areaInfoMain .item .thumb img{max-width: none;}
.wrap_areaInfoMain .box_line{ position: relative; height: 163px; }
.wrap_areaInfoMain .box_line .line{position: absolute; left: 50%; top: 0; width: 1px; height: 100%; background-color: #d9d9d9;}
.wrap_areaInfoMain .btns{font-size: 0;margin-top: 39px;}
.wrap_areaInfoMain .btns .btn_type1 .inr{width: 0; }
.wrap_areaInfoMain .btns .btn_type1 .inr .t{ display: block; width: 105px; }
.wrap_areaInfoMain .btns .btn_type1:hover .inr{ width: 105px; }

.c_blue{color: #4e86ff !important;}
.c_green{color: #62c0c1 !important;}

.wrap_new_vision{height: calc(100vh - 90px); position: relative;}
.wrap_new_vision .cont{ position: relative; z-index: 2; margin-top: 60px;}
.wrap_new_vision .cont .inr-c{}
.wrap_new_vision .cont .h1{ /*font-family: 's-core-dream-bold';*/ font-size: 35px; line-height: 1.4; color: #222; font-weight: 700; }
.wrap_new_vision .cont .area_dd{margin-top: 40px;position: relative;font-size: 26px;line-height: 1.625;font-weight: 500;word-break: keep-all;padding: 33px 7px;}
.wrap_new_vision .cont .h1 > .d-ib{margin-bottom: 10px;}
.wrap_new_vision .cont .area_dd:after{position: absolute; left: 0; top: 0; width: 71px; height: 56px; background: url(../images/main/ico_dd_start.png) no-repeat; content: ""}
.wrap_new_vision .cont .t1{ position: relative; z-index: 1; }
.wrap_new_vision .bub1{
  position: absolute; left: 50%; top: 0; top: 210px;margin-left: -700px;
  -webkit-animation: scale-in-center1 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate forwards;
          animation: scale-in-center1 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate forwards;

}
.wrap_new_vision .bub2{
  position: absolute; left: 50%; top: 0; display: block;top: 300px;
  -webkit-animation: scale-in-center1 3s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate forwards;
          animation: scale-in-center1 3s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate forwards;
}
.wrap_new_vision .images{position: absolute; left: 0; top: 0; width: 100%; height: 2119px; z-index: 0;}
.wrap_new_vision .images > *{position: absolute; left: 50%; top: 0;}
.wrap_new_vision .images img{max-width: none;}
.wrap_new_vision .images .img1{display: block;margin-left: 150px;}
.wrap_new_vision .images .img2{top: 820px;margin-left: 291px;}
.wrap_new_vision .images .img3{top: 1610px;margin-left: -310px;}
@-webkit-keyframes scale-in-center1 {
 0% {
    -webkit-transform: scale(0.7);
            transform: scale(0.7);
    opacity: 1;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);

  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 0.6;
-webkit-transform: rotate(720deg) translate(0px, 30px);
-moz-transform: rotate(720deg) translate(0px, 30px);
-o-transform: rotate(720deg) translate(0px, 30px);
-ms-transform: rotate(720deg) translate(0px, 30px);
transform: rotate(720deg) translate(0px, 30px);


  }
}
@keyframes scale-in-center1 {
  0% {
    -webkit-transform: scale(0.7);
            transform: scale(0.7);
    opacity: 1;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);

  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 0.6;
-webkit-transform: rotate(720deg) translate(0px, 30px);
-moz-transform: rotate(720deg) translate(0px, 30px);
-o-transform: rotate(720deg) translate(0px, 30px);
-ms-transform: rotate(720deg) translate(0px, 30px);
transform: rotate(720deg) translate(0px, 30px);


  }
}





.btn_type1{
  width: auto; height: 46px; border: 1px #c4c4c4 solid;  border-radius: 100px; display: inline-flex;justify-content: center;align-items: center;  font-size: 13px;
  transition: all 300ms cubic-bezier(0.615, 0.000, 0.320, 1.000);
  transition-timing-function: cubic-bezier(0.615, 0.000, 0.320, 1.000); 
}
.btn_type1 .inr{
  display: inline-block; width: 0; overflow: hidden; color: #fff;
  transition: all 300ms cubic-bezier(0.615, 0.000, 0.320, 1.000);
  transition-timing-function: cubic-bezier(0.615, 0.000, 0.320, 1.000); 
  font-family: 'Metropolis'; line-height: 1; margin-top: 1px;
}
.btn_type1 .circle{ width: 46px; height: 46px; border-radius: 50%; display:inline-flex; align-items: center; justify-content: center; }
.btn_type1 .circle i{-webkit-transform: rotate(315deg);
  -moz-transform: rotate(315deg);
  -o-transform: rotate(315deg);
  -ms-transform: rotate(315deg);
  transform: rotate(315deg);
  transition: all 300ms cubic-bezier(0.615, 0.000, 0.320, 1.000);
  transition-timing-function: cubic-bezier(0.615, 0.000, 0.320, 1.000); 
  font-size: 1.6em;margin-top: -2px;
}

.btn_type1:where(:hover, :focus){background-color: #00a5e5; padding: 0 15px; border-color: #00a5e5;}
.btn_type1:hover .inr{ padding: 0 0 0 15px;}
.btn_type1:hover .circle{}
.btn_type1:hover .circle i{color: #fff;}


.header_banner { position: relative; width: 100%; height: 50px; background-color: #191919; font-size: 1em; color: #fff;  display: flex; align-items: center; justify-content: center; z-index: 2;}
.header_banner > .swiper-container { width: 100%; max-width: 750px; margin: 0 auto; overflow: hidden; position: relative; }
.header_banner .btn_close{position:absolute; right: 22px; top: 13px; color:#dfe9ec; font-size:24px; line-height: 1;}
.header_banner .swiper-slide { display: flex; align-items: center; justify-content: center; text-align: center; width: 100%; height: 30px; color: #fff; font-size: 14px; }
.header_banner .swiper-slide p{display: flex; align-items: center; justify-content: center;}
.header_banner .swiper-slide strong{margin-right: 30px;}
.header_banner .swiper-slide a { color: #bebebe; display: block; width: 500px; overflow: hidden; text-align: left; height: 30px; line-height: 31px; 
  white-space: nowrap; text-overflow: ellipsis; }
.header_banner .swiper-prev,
.header_banner .swiper-next { width: 30px; height: 30px; position: absolute; border: 0; background-color: transparent; display: flex; justify-content: center; align-items: center; cursor: pointer; z-index: 1; background-color: #191919; }
.header_banner .swiper-prev:before,
.header_banner .swiper-next:before { content: ''; width: 7px; height: 7px; border-bottom: 1px solid #fff; box-sizing: border-box; }
.header_banner .swiper-prev { top: 0; left: 0; }
.header_banner .swiper-next { top: 0; right: 0; }
.header_banner .swiper-prev:before { border-left: 1px solid #fff; transform: rotate(45deg); }
.header_banner .swiper-next:before { border-right: 1px solid #fff; transform: rotate(-45deg); }
.header_banner .swiper-button-disabled { display: none; }

body.sub .header_banner{display: none !important;}

  @-webkit-keyframes fadeInType1 {
   0% {
        opacity: 0;
    }
    100% {
        opacity: 1;

    }
}

@-moz-keyframes fadeInType1 {
   0% {
        opacity: 0;
     
    }
    100% {
        opacity: 1;
    }
}

@keyframes fadeInType1 {
    0% {
        opacity: 0;
        -webkit-transform: translate(0px, -10px);
        -moz-transform: translate(0px, -10px);
        -o-transform: translate(0px, -10px);
        -ms-transform: translate(0px, -10px);
        transform: translate(0px, -10px);

     
    }
    100% {
        opacity: 1;
        -webkit-transform: translate(0, 0px);
        -moz-transform: translate(0, 0px);
        -o-transform: translate(0, 0px);
        -ms-transform: translate(0, 0px);
        transform: translate(0, 0px);

    }
}


#wrap{ 
  /*-webkit-transition: margin 0.5s cubic-bezier(0.815, 0.000, 0.295, 1.000)
  -moz-transition: margin 0.5s cubic-bezier(0.815, 0.000, 0.295, 1.000);;
  -o-transition: margin 0.5s cubic-bezier(0.815, 0.000, 0.295, 1.000)
  transition: margin 0.5s cubic-bezier(0.815, 0.000, 0.295, 1.000)*/
}

.modal_section{position: fixed; left: 0; bottom: 0; width: 100%;  background-color: #000; z-index: 10; height: 100vh; overflow: hidden;
  /*-webkit-transition: all 0.5s cubic-bezier(0.815, 0.000, 0.295, 1.000);
  -moz-transition: all 0.5s cubic-bezier(0.815, 0.000, 0.295, 1.000);
  -o-transition: all 0.5s cubic-bezier(0.815, 0.000, 0.295, 1.000);
  transition: all 0.5s cubic-bezier(0.815, 0.000, 0.295, 1.000);*/
}

body.modalVideoOpen #wrap{ margin-top:-50vh;}
body.modalVideoOpen .modal_section{height: 100vh;}
.modal_section .inner{position:relative;}
.modal_section .inner .title{position:absolute; left:0; bottom: 30px; width:100%; font-size: 22px; color:#fff; z-index:10;text-align: center;}
.modal_section .inner .close{position:absolute; right:20px; top:20px; border:0; background:transparent; color:#fff; font-size:40px; cursor:pointer;}
.modal_section .inner .close:hover{opacity:0.8;}
.modal_section .inner .video{position:relative; left:0; top:0; width:100%; height:100vh;}
.modal_section .inner .video iframe,
.modal_section .inner .video video,
.modal_section .inner .video #popupVidoTy1{position:absolute; left:5%; top: 1%; width:90%; height:90%;}


.inner_step3{ position: relative; }
.inner_step3 > .tab-type1{ position: absolute; left: 0; top: 40px; width: 100%;  z-index: 5;}
.inner_step3 > .tab-type1 a{background:rgba(255,255,255,0.8);}
.inner_step3 > .tab-type1 li.active,
.inner_step3 > .tab-type1 a:hover{background:rgba(255,255,255,1);}



/*리스트 스타일*/

.bg_type2{background-color: #f8f8f8; background-image: url(../images/common/bg_line_top1.png); background-position: 0 0; background-repeat: repeat-x;}

/* 견학안내 */
/*250402 견학안내 > park1538 게이트웨이 페이지 추가*/
.lst-thumb-type2 {display: flex; height: 810px; height: 41.861vw; padding-bottom: 60px;}
.lst-thumb-type2 .item {width: 100%; background-position: center; background-repeat: no-repeat; background-size: 100%; color: #fff; display: flex; justify-content: center; align-items: center; transition: background-size .3s ease; position: relative; }

.lst-thumb-type2 .item:after{position: absolute; display: block; content: ''; width: 100%; height: 100%; background-color: #000; opacity: .4;z-index: 0;}

.lst-thumb-type2 .item:first-child {background-image: url(../images/prcenter/img_park1538_PH.png)}
.lst-thumb-type2 .item:nth-child(2) {background-image: url(../images/prcenter/img_park1538_GY.png)}

.lst-thumb-type2 .item > div {display: flex; flex-direction: column; align-items: center; text-align: center;z-index: 1; position: relative; width: 100%; height: 100%;}
.lst-thumb-type2 .item > div .top{position: absolute; top: 50%; transform: translateY(-50%); transition: all .3s;}
.lst-thumb-type2 .item .t1{font-size: 36px; letter-spacing: -0.025em; font-weight: 600; line-height: normal; }
.lst-thumb-type2 .item .t2{font-size: 18px; letter-spacing: -0.025em; line-height: 1.7; text-align: center;}
.lst-thumb-type2 .item .ico_.blank3{filter: invert(100%) sepia(100%) saturate(1%) hue-rotate(287deg) brightness(300%) contrast(101%); width: 18px; height: 18px; background-size: 840px;}

.lst-thumb-type2 .item .row > div{display: flex; align-items: center; line-height: normal;}
.lst-thumb-type2 .item .row > div > span {display: flex; margin-top: 1px;}

.lst-thumb-type2 .item .row{ transition: all .3s; opacity: 0; position: absolute; top: calc(61% + 20px);}
.lst-thumb-type2 .item:hover{background-size: 107%;}
.lst-thumb-type2 .item:first-child:hover > div .top {top: calc(50% - 20px);}
.lst-thumb-type2 .item:nth-child(2):hover > div .top {top: calc(50% - 40px);}
.lst-thumb-type2 .item:hover .row{opacity: 1; top: 61%; text-decoration: underline; text-underline-offset: 2px;}

/*250402 견학안내 > park1538 게이트웨이 페이지 끝*/



/* 뉴스레터 */
.wrap_newsletter{display: flex;flex-wrap: wrap;align-items: stretch; word-break: keep-all;}
.wrap_newsletter > *{ flex: none; }
.wrap_newsletter .thumb{ width: 400px; height: 380px; position:relative;}
.wrap_newsletter .thumb .txt{ position:absolute; bottom:35px; left:35px; color:#cbd6e9; z-index:1; }
.wrap_newsletter .thumb .txt p{font-size: 18px; font-size:1.125em; }
.wrap_newsletter .thumb .txt p b{font-size:1.7777777777777777em; font-weight:500; color:#fff;}

.wrap_newsletter .cont{width: calc(100% - 420px); margin-left:20px; border:1px #ddd solid;box-sizing: border-box;display: flex;align-items: center;justify-content: center;padding: 0 30px;}
.wrap_newsletter .cont > .inner{
    width: 770px;
    margin: 0 auto;
}
.wrap_newsletter .cont .cate{ color:#333;}
.wrap_newsletter .cont .h1{ font-size:32px; font-size:2em; font-weight:600; letter-spacing:-0.02em;line-height: 1;margin-top: 13px;}
.wrap_newsletter .cont .wrap_inptxt_type1{margin-top: 40px;}
.wrap_newsletter .cont .box_chk{margin-top: 36px;}

.wrap-slide-type1{position: relative;}
.slide-type1 .carousel-cell {
  width: 100%; /* full width */
  margin-right: 0;
}

.slide-type1.h-a .carousel-cell{height: auto;}
.wrap-slide-type1 .pageing{display: flex;position: absolute;right: 100px;bottom: 40px;align-items: center;}
.wrap-slide-type1 .pageing .num .current{color:#333333; font-weight:600;}
.wrap-slide-type1 .pageing .prnex{margin-left:17px;}
.wrap-slide-type1 .pageing .prnex button{margin-left:7px; border: 0;background-color: #fff;width: 42px;height: 42px;border-radius: 50%;border: 1px solid #222222;color: #222;display: inline-flex;align-items: center;justify-content: center;font-size: 21px;line-height: 1;opacity: 0.5; cursor: pointer;}
.wrap-slide-type1 .pageing .prnex button:hover{opacity: 1;}

.wrap-slide-type1.bg_f1{padding: 40px; background-color: #fff;}
.wrap-slide-type1.bg_f1 .pageing{right: 60px; bottom: 40px;}


/*
1318
51.8209
*/

.thumb-head-type1{ display: flex; justify-content: space-between; align-items: center; }
.thumb-head-type1 .thumb{ width: 42.5645%; height: 360px; position: relative; border-radius: 18px; overflow: hidden; }
.thumb-head-type1 .cont{width: 43.8209%;margin-right: 7%;}
.thumb-head-type1 .cont p{  overflow: hidden; text-overflow: ellipsis; white-space: normal; text-align: left; word-wrap: break-word; display: -webkit-box; -webkit-box-orient: vertical;}
.thumb-head-type1 .cont .h1{ -webkit-line-clamp: 2; line-clamp: 2;  font-size: 30px; font-size: 1.875em; line-height: 1.4; color: #162941; font-weight: 500; }
.thumb-head-type1 .cont .t1{ -webkit-line-clamp: 3; line-clamp: 3;   margin-top: 50px; line-height: 1.75; color: #50667d; }
.thumb-head-type1 .cont .data{margin-top: 20px; color: #50667d; font-size: 14px; font-size: 0.875em;}



.thumb-head-type2{ display: flex; justify-content: space-between; align-items: center; }
.thumb-head-type2 .thumb{ flex: none; width: 38.7275%; height: 360px; position: relative; border-radius: 18px; overflow: hidden; }
.thumb-head-type2 .cont{ flex: none; width: 56.7082%;}
.thumb-head-type2 .cont > .inner{word-break: keep-all;}
.thumb-head-type2 .cont p{  overflow: hidden; text-overflow: ellipsis; white-space: normal; text-align: left; word-wrap: break-word; display: -webkit-box; -webkit-box-orient: vertical;}
.thumb-head-type2 .cont .year{margin-bottom: 11px; color: #162941;}
.thumb-head-type2 .cont .h1{ font-size: 40px; font-size: 2.5em; line-height: 1.4; color: #162941; font-weight: 500; letter-spacing: -0.05em; }
.thumb-head-type2 .cont .t1{ margin-top: 25px; font-size: 18px; font-size: 1.125em; line-height: 34px; line-height: 1.6;  }

.thumb-head-type3{ display: flex; align-items: center; }
.thumb-head-type3 .thumb{ width: 370px; height: 510px; margin-bottom: 60px; margin-left: 80px; position: relative; overflow: hidden; flex: none; -webkit-box-shadow: 8px 12px 22px 4px rgba(0,0,0,0.07); 
box-shadow: 8px 12px 22px 4px rgba(0,0,0,0.07); }
.thumb-head-type3 .cont{flex: none;width: calc(100% - 560px);margin-left: 192px; word-break: keep-all;}
.thumb-head-type3 .cont p{  overflow: hidden; text-overflow: ellipsis; white-space: normal; text-align: left; word-wrap: break-word; display: -webkit-box; -webkit-box-orient: vertical;}
.thumb-head-type3 .cont .year{font-size: 18px; font-size: 1.125em; margin-bottom:15px;}
.thumb-head-type3 .cont .h1{ font-size: 40px; font-size: 2.5em; line-height: 1.4; color: #162941; font-weight: 500; }
.thumb-head-type3 .cont .t1{ margin-top: 50px; font-size: 18px; font-size: 1.125em;  line-height: 1.75; color: #50667d; max-width: 480px; }
.thumb-head-type3 .cont .data{margin-top: 20px; color: #50667d; font-size: 14px; font-size: 0.875em;}


.bg_bar_type1{ position: relative; }
.bg_bar_type1 .bg_bar{ position: absolute; left: 0; top: 320px; width: 100%; height: 185px;
background: rgb(227,223,236);
background: -moz-linear-gradient(60deg, rgba(227,223,236,1) 0%, rgba(227,223,236,1) 28%, rgba(227,223,236,0) 47%);
background: -webkit-linear-gradient(60deg, rgba(227,223,236,1) 0%, rgba(227,223,236,1) 28%, rgba(227,223,236,0) 47%);
background: linear-gradient(60deg, rgba(227,223,236,1) 0%, rgba(227,223,236,1) 28%, rgba(227,223,236,0) 47%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#e3dfec",endColorstr="#e3dfec",GradientType=1);
}
.bg_bar_type2{padding-bottom: 65px; position: relative;}
.bg_bar_type2:after{background-color: #f1f4f6; position: absolute; left: 0; bottom: 0; width: 100%; height: 80%; content: ""; z-index: 0;}

.lst_table_small1{margin-top: 11px;} /* 241023 margin-top: 15px -> 11px;*/
.lst_table_small1 > li{display: flex; margin-top: 11px; color: #50667d; font-size: 14px; font-size: 0.875em;} /* 241023 margin-top: 15px -> 11px;*/
.lst_table_small1 > li> *{flex: none;}
.lst_table_small1 .col:nth-child(1){width: 22%;}
.lst_table_small1 .col:nth-child(2){margin-left: 7px; width: calc(78%); box-sizing: border-box;}


.wrap_location{}
.wrap_location .thumb_panorama{margin-bottom: 70px;}

.wrap_location .cont_location{display: flex; flex-wrap: wrap;}
.wrap_location .cont_location > *{flex: none; width: 50%; box-sizing: border-box;}
.wrap_location .cont_location .head .t1{margin-top: 28px; font-size: 20px; font-size: 1.25em; line-height: 1.75; color: #50667d; word-break: keep-all; margin-right: 5vw;}
.wrap_location .cont_location .head .btns{margin-top: 60px;}
.wrap_location .cont_location .info{padding-left: 50px; border-left: 1px solid #d9d9d9;}
.wrap_location .cont_location .info .addr .t1{font-size: 20px; font-size: 1.25em; margin-bottom: 13px; color: #666;}
.wrap_location .cont_location .info .addr .t1 span.cate{font-size: 16px; font-size: 0.8em; color: #05507d; display: block; font-weight: 500;}

.wrap_location .cont_location .info .addr .wrap_tel{display: flex; flex-wrap: wrap;}
.wrap_location .cont_location .info .addr .wrap_tel > *{margin-right: 50px; margin-bottom: 5px; flex: none;}
.wrap_location .cont_location .info .addr .wrap_tel .ff-en{font-weight: 600; color: #222;}
.wrap_location .cont_location .lst_table1 .t1{ color: #666; }
.wrap_location .cont_location .lst_table1 .area_td .t1{ color: #222; font-weight: 500; }
.wrap_location .cont_location .lst_table1 .area_td .t2{color: #666;}

.thumb-group{position: relative; width: 100%; min-height: 100px; overflow: hidden;}

.lst_bot_banner1{position: relative;}
.lst_bot_banner1 > *{ margin-left: 25px; position: relative; z-index: 1; } 
.lst_bot_banner1 .thumb-group{height: 499px;}
.lst_bot_banner1 .cont{margin-top: 40px; display: flex; justify-content: space-between;align-items: center;}
.lst_bot_banner1 .cont > *{ flex:none; }
.lst_bot_banner1 .cont  .more{top: 1px; position: relative;}
.lst_bot_banner1 .item .cont .t1{margin-top: 0; font-size: 25px; font-size: 1.5625em; line-height: 1.3; padding: 0; font-weight: 600; color: #222;}
.lst_bot_banner1 .cont .t1{}


.wrap_relatedsites{display: flex; flex-wrap: wrap;}
.wrap_relatedsites .item{flex: none; background-color: #f6f6f6; margin-left: 10px; width: calc(50% - 5px); padding: 20px 50px 0; box-sizing: border-box;}
.wrap_relatedsites .item:nth-child(2n+1){margin-left:0;}
.wrap_relatedsites .item:nth-child(-n+2){border-top: 1px solid #222; padding-top: 50px;}
.wrap_relatedsites .item:nth-last-child(-n+2) {padding-bottom: 45px;}
.wrap_relatedsites .item .txt{border-bottom: 1px solid #dfdfdf; padding-bottom: 15px; position: relative;}
.wrap_relatedsites .item .txt > *{display: inline-block;}
.wrap_relatedsites .item .txt .key{display: block;}
.wrap_relatedsites .item .txt a{color: #959faa; font-size: 14px; font-size: 0.875em;}
.wrap_relatedsites .item .txt a .ico_{position: absolute; right: 0; top: calc(50% - 9px);}
.wrap_relatedsites .item .txt a:hover{color: #222;}

.wrap_relatedsites .item .txt.flex{display: flex; align-items: center; justify-content: space-between;}
.wrap_relatedsites .item .txt.flex a{color: #06c; text-decoration: underline;  text-underline-position: under; }

/*게시판 타입 1*/
.bbs-list-type1 {  }
.bbs-list-type1 .item { display: flex; flex: none; box-sizing: border-box; align-items: center; }
.bbs-list-type1 .item .td { font-size: 16px; color: #222; padding: 15px 10px; box-sizing: border-box; flex: none; }
.bbs-list-type1 .bbs_head{ border-top: 2px solid #414141; }
.bbs-list-type1 .bbs_head .td { text-align: center; font-weight: 500; line-height: 1; }
.bbs-list-type1 .bbs_body { border-bottom: 1px solid #d8d8d8; }
.bbs-list-type1 .bbs_body > .item{ border-top: 1px solid #d8d8d8; height: 90px; }
.bbs-list-type1 .bbs_body .td { text-align: center; }
.bbs-list-type1 .bbs_body .td.taLeft { text-align: left; }

/* 230329 추가 */
.bbs-list-type1 .bbs_body .td.taLeft p { line-height: 27px; }

.bbs-list-type1 .bbs_body .td.taRight { text-align: right; }

.bbs-list-type1 .item .num { width: 100px; }
.bbs-list-type1 .item .title { width: 100%; flex: auto; }
.bbs-list-type1 .item .date { width: 150px; }

.bbs-list-type1 .bbs_body .title { font-size: 22px; color: #222; }
.bbs-list-type1 .bbs_body .date { color: #838383; }

.bbs-list-type1 .label { width: 80px; text-align: center; font-size: 14px; background-color: #666; color: #fff; border-radius: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; line-height: 1; margin-right: 30px; vertical-align: middle; }

/* 230329 광양/포항 라벨색상 추가 */
.bbs-list-type1 .label.gwangyang {background-color: #a89c94;}
.bbs-list-type1 .label.pohang {background-color: #24487e;}

.bbs-list-type1 .btn { border-radius: 0; height: 45px; line-height: 44px; }
.bbs-list-type1 .dlBtn { background-color: transparent; border-color: #5f6575; color: #5f6575; font-weight: 500; }
.bbs-list-type1 .dlBtn:after { content: ''; width: 14px; height: 16px; background-size: contain; background-position: center; background-repeat: no-repeat; background-image: url(../images/ico/ico_dl.png); margin-left: 15px;  }


/* 게시판 사이즈 타입1*/
.bbs-list-type1.bSize1 .td.n1{ width: calc(100% - 180px); padding-left: 30px; }
.bbs-list-type1.bSize1 .td.n2{margin-left: auto; width: 150px; text-align: center; }
.bbs-list-type1.bSize1 .bbs_body .td.n1{font-size: 22px; font-size: 1.375em; line-height: 1.2;  }
.bbs-list-type1.bSize1 .bbs_body .td.n2{color: #838383;}

/* 230327 외부링크 버튼 스타일 */
.bbs-list-type1 .dlBtn2{ background-color: transparent; border-color: #5f6575; color: #5f6575; font-weight: 500; }
.bbs-list-type1 .dlBtn2::after { 
  width: 11px;
  height: 11px;
  margin-left: 10px;
  background-image: url(../images/common/ico_common.png);
  background-position: -33px -58px;
  content: "";
}
/* 링크/외부 아이콘X */
.bbs-list-type1 .dlBtn3{ background-color: transparent; border-color: #5f6575; color: #5f6575; font-weight: 500; padding: 0px 29px; }

/* 230322 게시판 사이즈 타입2*/
.bbs-list-type1.bSize2 .item .date,
.bbs-list-type1.bSize2 .item .dnbtn
{ width: 20%; max-width: 220px;}

/* 이전/다음글 */
.bot_prnt{border-top: 1px solid #000; padding-top: 50px; display: flex; align-items: center; justify-content: space-between;}
.bot_prnt a{display: inline-flex; align-items: center; color: #333; }
.bot_prnt a i{color: #999;margin-top: 1px;font-size: 20px;}
.bot_prnt .prev i{margin-right:8px;}
.bot_prnt .next i{margin-left: 8px;}
.bot_prnt a:hover i,
.bot_prnt a:hover{color: #222;}

/* 페이징 */
.bbs-pagination { padding: 70px 0; display: flex; justify-content: center; align-items: center; }
.bbs-pagination .prev { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin-right: 10px; font-size: 0; background-position: center; background-repeat: no-repeat; background-size: 25%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='12px' height='19px'%3E%3Cpath fill-rule='evenodd' fill='rgb(167, 167, 167)' d='M11.597,16.095 L9.562,18.130 L0.402,8.970 L2.437,6.935 L2.528,7.025 L9.465,0.088 L11.444,2.068 L4.507,9.005 L11.597,16.095 Z'/%3E%3C/svg%3E"); }
.bbs-pagination .next { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin-left: 10px;font-size: 0; background-position: center; background-repeat: no-repeat; background-size: 25%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='11px' height='18px'%3E%3Cpath fill-rule='evenodd' fill='rgb(167, 167, 167)' d='M11.004,8.861 L1.997,18.005 L-0.005,15.973 L6.967,8.896 L0.146,1.971 L2.093,-0.006 L8.914,6.919 L9.002,6.829 L11.004,8.861 Z'/%3E%3C/svg%3E"); }
.bbs-pagination > ul { display: flex; justify-content: center; align-items: center; }
.bbs-pagination > ul > li + li { margin-left: 6px; }
.bbs-pagination > ul > li > a { width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; font-size: 20px; color: #333; background-color: transparent; box-sizing: border-box; border-radius: 50%; }
.bbs-pagination > ul > li.active > a { color: #fff; background-color: #333; }

.pagenation {position: relative;}
.pagenation ul {text-align: center;}
.pagenation li {display: inline-block; text-align: center; vertical-align: middle;}
.pagenation li a,
.pagenation li strong {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: transparent;
  color: #222222;
  text-align: center;
  font-weight: normal;
  vertical-align: top;
}
.pagenation li a:after,
.pagenation li strong:after {
  display: inline-block;
  vertical-align: middle;
  content: "";
  width: 0;
  height: 100%;
}
.pagenation li .vm {
  display: inline-block;
  font-size: 16px;
  line-height: 1;
  vertical-align: middle;
  font-family: 'Montserrat', sans-serif;
}
.pagenation li.first a,
.pagenation li.prev a,
.pagenation li.next a,
.pagenation li.last a {
  background-color: transparent;
  color: #a7a7a7;
  font-weight: 500;
  width: 40px;
}
.pagenation li.first a .vm,
.pagenation li.prev a .vm,
.pagenation li.next a .vm,
.pagenation li.last a .vm {
  font-size: 23px;
}
.pagenation li.prev {
  margin-right: 15px;
}
.pagenation li.first {
  margin-left: 15px;
}
.pagenation li.on strong {
  color: #fff;
  background-color: #191919;
  font-weight: 500;
}
@media screen and (max-width: 768px) {
  .pagenation {
    margin-top: 30px;
  }
  .pagenation li a,
  .pagenation li strong {
    width: 20px;
    height: 20px;
  }
  .pagenation li.first a,
  .pagenation li.prev a,
  .pagenation li.next a,
  .pagenation li.last a {
    width: 15px;
  }
  .pagenation li.first a .vm,
  .pagenation li.prev a .vm,
  .pagenation li.next a .vm,
  .pagenation li.last a .vm {
    font-size: 16px;
  }
  .pagenation li .vm {
    font-size: 12px;
  }
  .pagenation li.prev {
    margin-right: 5px;
  }
  .pagenation li.first {
    margin-left: 5px;
  }
}



/* 검색바 */
.wrap_search2{width: 480px; height: 54px; border: 1px solid #f5f5f5; box-sizing: border-box; border-radius: 500px; background-color: #f5f5f5; display: inline-flex; align-items: center;justify-content: space-between;}
.wrap_search2 input{height: 40px; border:0; margin:0 20px; padding-left: 14px; box-sizing: border-box;  flex:none; width:calc(100% - 110px); line-height:1; background-color: #f5f5f5;}
.wrap_search2 button{width:70px; height:100%; font-size: 17px; background-color: transparent; border: 0;cursor: pointer;}
.wrap_search2.hg2{height: 48px; box-sizing: border-box; color: #111;}
.wrap_search2 input::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: #757586;
}
.wrap_search2 input::-moz-placeholder {
  /* Firefox 19+ */
  color: #757586;
}
.wrap_search2 input:-ms-input-placeholder {
  /* IE 10+ */
  color: #757586;
}
.wrap_search2 input:-moz-placeholder {
  /* Firefox 18- */
  color: #757586;
}

.wrap_faq{ text-align: left; }
/*240730 추가*/
.wrap_faq .item_box {display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.wrap_faq .item_box .item:last-child {margin-top: 0;}

.wrap_faq .item{background-color: #f4f7f8; border: 1px solid transparent; margin-top: 10px;}
.wrap_faq .item:first-child{margin-top: 0;}
.wrap_faq .item .answer{display: none;}
.wrap_faq .item .questions,
.wrap_faq .item .answer{box-sizing: border-box; padding: 40px 60px;}
.wrap_faq .item .answer{padding-top: 0;}
.wrap_faq .item .answer > .inner{border-top: 1px solid #e1e3e6; padding-top: 40px; padding-bottom: 60px; display: flex; }


.wrap_faq .item .ico{font-size: 30px; font-size: 1.875em; line-height: 1; font-weight: 500; margin-right: 32px; width: 40px; flex: none;}
.wrap_faq .item .txt{margin-top: -2px; width: 100%; }
.wrap_faq .item .answer .txt{margin-top: 2px;}

.wrap_faq .item .questions{padding-bottom: 20px;}
.wrap_faq .item .questions > *{}
.wrap_faq .item .questions .txt .tit{font-size: 22px; font-size: 1.375em; line-height: 1.4;}
.wrap_faq .item .questions .arr{ margin-left: 30px; font-size: 20px; }
.wrap_faq .item .questions .q-sub-title { margin-bottom: 10px; font-size: 16px; font-weight: bold; line-height: 1.15; color: #05507D; letter-spacing: -0.5px; } 

.wrap_faq .item.on{background-color: #fff; border-color: #cfcfcf; -webkit-box-shadow: 4px 5px 8px -4px rgba(0,0,0,0.22); 
box-shadow: 4px 5px 8px -4px rgba(0,0,0,0.22); margin-bottom: 20px;}
.wrap_faq .item.on .arr > *{display: block; -webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-o-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg);}

.wrap_faq.type2 .item .txt{ width: calc(100% - 160px); }
.wrap_faq.type2 .item .ico{width: 130px; margin-right: 10px; font-size: 0;}
.wrap_faq.type2 .item .answer .txt{width: 100%;}
/*.wrap_faq .item.on  .answer{display: block;}*/

/* 230512 추가 */
.wrap_faq .item .link { color: #0000ff; border-bottom: 1px solid #0000ff; margin-right: 30px; position: relative; }
.wrap_faq .item .link:after { content: ''; width: 17px; height: 17px; margin-left: 5px; background: url(../images/ico/ico_link_blu.png) center no-repeat; background-size: contain; position: absolute; left: 100%; top: 0; }

.p-summary{font-size: 14px; font-size: 0.875em; color: #a8a8a8; }
.wrap_from{}


.tlb_type1{ border-top: 2px solid #222; padding-top: 20px; }
.tlb_type1 .item{ display: flex; flex-wrap: wrap; margin-top: 30px; }
.tlb_type1 .item > *{flex: none;}
.tlb_type1 .item .area_th{width: 110px; margin-right: 20px;  padding-top: 2px;}
.tlb_type1 .item .area_td{width: calc(100% - 130px);}  

.tlb_type1.sz2 .item .area_th{width: 150px; margin-right: 20px;  padding-top: 2px;}
.tlb_type1.sz2 .item .area_td{width: calc(100% - 170px);}  


.wrap_gallerypopup_top .thumb{font-size: 0;}
.wrap_gallerypopup_top .info{margin-top: 30px; border: 1px solid #dcdcdc; padding: 30px 40px; display: flex; align-items: center; flex-wrap: wrap;}
.wrap_gallerypopup_top .info > *{margin-right:40px; color: #666; font-weight: 500;}
.wrap_gallerypopup_top .info .t1{color: #222; margin-right: 5px;}
.wrap_gallerypopup_top .info a{color: #666;}


.lst-thumb.rc1_1{align-items: center;}
.lst-thumb.rc1_1 .thumb{ width: 430px; text-align: center; }
.lst-thumb.rc1_1 .cont{ width: calc( 100% - 480px); margin-left: 50px; }

.lst-thumb.rc3_1{align-items: center;}
.lst-thumb.rc3_1 .thumb{ min-width: 130px; width: 130px; height: 130px; border-radius: 50%; background-color: #fff; display: flex; align-items: center; justify-content: center; text-align: center; }
.lst-thumb.rc3_1 .cont{ width: calc( 100% - 180px); margin-left: 50px; }


.wrap_join_top{}
.wrap_join_top .step{display: flex; align-items: center; justify-content: center;}
.wrap_join_top .step > li{font-size: 36px; line-height: 1; font-weight: 600; color: #989494; display: flex; align-items: center;  }
.wrap_join_top .step > li i{margin-top: 5px; margin-left: 20px; margin-right: 20px; color: #989494;}
.wrap_join_top .step > li.on{color: #222;}
.wrap_join_top .step > li .txt{position: relative; display: block; }
.wrap_join_top .step > li .txt:after{position: absolute; left: 50%; top: -20px; width: 10px; height: 10px; border-radius: 50%; background-color: #099de8; content: ""; display: none;}
.wrap_join_top .step > li.on .txt:after{display: block;}

.wrap_pin{max-width: 980px; margin-left: auto; margin-right: auto;}
.wrap_pin .top{ display: flex; justify-content: center;  text-align: center;}
.wrap_pin .top > .box{min-width: 370px; width: 370px; height: 410px; background-color: #fff; border-radius: 10px; border:1px #dedede solid; display: flex; align-items: center; justify-content: center; margin-left: 45px; -webkit-box-shadow: 2px 2px 3px 1px rgba(0,0,0,0.12); box-shadow: 2px 2px 3px 1px rgba(0,0,0,0.10); }
.wrap_pin .top > .box > .cen{max-width: 210px; width: 100%;}
.wrap_pin .top > .box:first-child{margin-left: 0;}
.wrap_pin .top > .box .t1{}
.wrap_pin .bot{margin-top: 60px; padding-top: 30px; border-top: 1px solid #c8c8c8;}

.wrap_from.join1 .w_2{ width: 500px; min-width: 500px; }
.wrap_from.join1 .inp_name{width: 343px;}

/*230510 footer 스타일 수정*/

#footer{ position: relative; height: auto !important; display: table; table-layout: fixed; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
#footer .footer_wrap {display: table-cell; vertical-align: middle; width: 100%; height: auto !important;}

#footer .inr-c-s{max-width: 1300px; margin: 0 auto; }
#footer .menu_foot{background-color: #f4f4f4; padding-top: 60px; padding-bottom: 60px; }
#footer .menu_foot .inr-c-s{display:flex;flex-wrap: wrap; }

#footer .menu_foot .logo{}
#footer .menu_foot .menu_dp1{margin-left:6%;}
#footer .menu_foot .menu_cust{margin-left:10%;}
#footer .menu_foot .mn{border-left:1px #ddd solid; padding-left:30px; font-size:14px;}
#footer .menu_foot .mn dt{ font-weight:600; font-size:16px; margin-bottom:18px;}
#footer .menu_foot .mn dd{ margin-top:10px }

/*230724 추가*/
#footer .menu_foot .menu_dp1.mn dd{ font-weight:600; font-size:16px; }

#footer .menu_foot .mn dd:first-child{margin-top:0;}
#footer .menu_foot .mn2 {padding-left:60px; border-left: none; }
#footer .menu_foot .mn2 dt{ font-weight:600; font-size:16px; margin-bottom:18px;}
#footer .menu_foot .mn2 dd{ margin-top:10px }
#footer .menu_foot .mn2 dd:first-child{padding-top:36px;}

#footer .menu_foot .area_rgh {margin-left:auto;display:flex;justify-content: flex-end;align-items: flex-start;flex-wrap: wrap; position:relative;}
#footer .menu_foot .area_rgh .footer-sns{display: flex;margin-top: 5px;}
#footer .menu_foot .area_rgh .footer-sns li a{margin-left: 8px;width: 35px;height: 35px;border-radius: 50%;background-color: transparent;border: 1px #d4d4d4 solid;display: flex;align-items: center;justify-content: center;font-size: 0;line-height: 0;}
#footer .menu_foot .area_rgh .footer-sns li a:hover{background-color: #ebebeb;}
#footer .menu_foot .area_rgh .footer-sns li.footer-newroom a{width:auto;border-radius:50px;font-size:13px;padding: 0 26px;color: #6b6b6b;}
#footer .menu_foot .area_rgh .footer-sns li.footer-newroom a img{width: 50px;}
#footer .menu_foot .area_rgh .footer-sns li.footer-youtube a .ico_.youtube {background-image: url("data:image/svg+xml,%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 35.95 25.17'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%236b6b6b;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M36,7.89A7.89,7.89,0,0,0,28.06,0H7.89A7.89,7.89,0,0,0,0,7.89v9.39a7.89,7.89,0,0,0,7.89,7.89H28.06A7.89,7.89,0,0,0,36,17.28Zm-11.86,5.4-9,4.47c-.35.19-1.56-.06-1.56-.47V8.11c0-.41,1.22-.67,1.57-.47l8.66,4.72C24.07,12.56,24.46,13.09,24.09,13.29Z'/%3E%3C/svg%3E");width: 14px;height: 11px;}
#footer .menu_foot .area_rgh .footer-sns li.footer-linkedin a .ico_.linkedin{background-image: url("data:image/svg+xml,%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36.89 33.54'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%236b6b6b;%7D%3C/style%3E%3C/defs%3E%3Cg id='LinkedIn'%3E%3Crect class='cls-1' x='0.93' y='10.75' width='7.19' height='22.78'/%3E%3Cpath class='cls-1' d='M27.77,10.54c-4.12,0-6.7,2.23-7.18,3.79V10.75H12.51c.1,1.9,0,22.79,0,22.79h8.08V21.21a5.36,5.36,0,0,1,.17-1.86,4.13,4.13,0,0,1,3.9-2.8c2.8,0,4.08,2.11,4.08,5.2V33.54h8.15V20.87C36.89,13.81,32.88,10.54,27.77,10.54Z'/%3E%3Cpath class='cls-1' d='M4.39,0C1.74,0,0,1.71,0,4A4,4,0,0,0,4.29,7.9h0C7,7.9,8.73,6.16,8.73,4A4,4,0,0,0,4.39,0Z'/%3E%3C/g%3E%3C/svg%3E");width: 12px;height: 11px;}
#footer .menu_foot .area_rgh .footer-sns li.footer-facebook a .ico_.facebook{background-image: url("data:image/svg+xml,%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18.95 35.38'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%236b6b6b;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M17.71,19.9l1-6.4H12.55V9.34c0-1.75.86-3.46,3.61-3.46H19V.43A34.18,34.18,0,0,0,14,0C8.93,0,5.62,3.07,5.62,8.62V13.5H0v6.4H5.62V35.38h6.93V19.9Z'/%3E%3C/svg%3E");width: 7px;height: 15px;}
#footer .menu_foot .area_rgh .footer-sns li.footer-insta a .ico_.insta{background-image: url("data:image/svg+xml,%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 35.38 35.38'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%236b6b6b;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M27.06,6.32a2.08,2.08,0,1,0,2.07,2.07A2.08,2.08,0,0,0,27.06,6.32Z'/%3E%3Cpath class='cls-1' d='M17.84,9a8.71,8.71,0,1,0,8.71,8.71A8.73,8.73,0,0,0,17.84,9Zm0,14.29a5.58,5.58,0,1,1,5.58-5.58A5.59,5.59,0,0,1,17.84,23.27Z'/%3E%3Cpath class='cls-1' d='M24.75,35.38H10.63A10.64,10.64,0,0,1,0,24.75V10.63A10.64,10.64,0,0,1,10.63,0H24.75A10.64,10.64,0,0,1,35.38,10.63V24.75A10.64,10.64,0,0,1,24.75,35.38ZM10.63,3.33a7.3,7.3,0,0,0-7.3,7.3V24.75a7.3,7.3,0,0,0,7.3,7.3H24.75a7.3,7.3,0,0,0,7.3-7.3V10.63a7.3,7.3,0,0,0-7.3-7.3Z'/%3E%3C/svg%3E");width: 14px;height: 14px;}

#footer .menu_foot .area_rgh .select{ margin-left:28px; }
#footer .group_select { width: 220px; position: relative; text-align: left; }
#footer .group_select > a {display: flex;align-items: center;justify-content: space-between;width: 100%;height: 47px;padding: 0 18px;font-size: 16px;color: #222;background-color: transparent;box-sizing: border-box;border: 1px #ddd solid;}
#footer .group_select > a:after { content: ''; width: 7px; height: 7px; border-top: 1px solid #878787; border-right: 1px solid #878787; transform: rotate(-45deg); margin-top: 5px; }
#footer .group_select > ul { position: absolute; top: 100%; left: 0; width: 100%; background-color: #fff; z-index: 2; overflow-y: auto; height: 0; border: 1px solid #ccc; padding: 18px; visibility: hidden; box-sizing: border-box; }
#footer .group_select > ul > li + li { margin-top: 30px; }
#footer .group_select > ul > li .sector { font-size: 1em; color: #005c9c; margin-bottom: 10px; font-weight: 600; line-height: 1.4;}
#footer .group_select ul.sub-menu > li { padding: 5px 0;}
#footer .group_select > ul > li a { font-size: 0.88em; color: #333; display: block; height: auto; line-height: 1.2; }
#footer .group_select > ul > li a:hover { text-decoration: underline; }
#footer .group_select > ul > li > ul > li + li { margin-top: 5px; }
#footer .group_select.active > a:after { transform: rotate(135deg); margin-top: -5px; }
#footer .group_select.active > ul { visibility: visible; height: 42.7vh; -webkit-transition: height 0.35s ease; transition: height 0.35s ease; }

#footer .info_foot {padding:45px 0; background-color: #333; color:#848484}
#footer .info_foot .f_menu{ display: flex; margin-left: -10px; margin-left: -45px; }
#footer .info_foot .f_menu li{ margin-top: 10px; margin-left: 45px; }
#footer .info_foot .f_menu li a{color:#848484; font-size: 16px; line-height: 1; }
#footer .info_foot .f_menu li a strong {color:#fff}

#footer .address{ font-size: 13px; margin-top: 25px;}
#footer .address span{ display: block; margin-top: 5px; }
@media (hover: hover) {
	#footer .menu_foot .mn dd a:hover{ color: #556fb2; }
	#footer .f_menu li a:hover{ color: #ebebeb; }
}


/*	공통 : 하단 퀵 링크 230412(국문)/230512(영문) 추가	*/
.fot_menu {display: inline-block;}
.fot_menu ul {border-top: 1px solid #d0d0d0;}
.fot_menu ul li {width: 300px; text-align: left; font-size: 18px; margin-top: 4px; position: relative;}
.fot_menu ul li a {display: block; border-bottom: 1px solid #d0d0d0; padding: 16px 28px; color: #000;}
.fot_menu ul li i {position: absolute; right: 28px; top: calc(50% - 13px); font-size: 26px; color: #606060;}
.fot_menu ul li img {position: absolute; right: 34px; top: calc(50% - 8px); width: 13px;}

/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/


/*#site-footer .group_select { width: 220px; position: relative; text-align: left; }
#site-footer .group_select > a { display: flex; align-items: center; justify-content: space-between; width: 100%; height: 50px; padding: 0 18px; font-size: 16px; color: #222; background-color: #fff; box-sizing: border-box; }
#site-footer .group_select > a:after { content: ''; width: 7px; height: 7px; border-top: 1px solid #878787; border-right: 1px solid #878787; transform: rotate(-45deg); margin-top: 5px; }
#site-footer .group_select > ul { position: absolute; bottom: 100%; left: 0; width: 100%; background-color: #fff; z-index: 2; overflow-y: auto; height: 0; border: 1px solid #ccc; padding: 18px; visibility: hidden; box-sizing: border-box; }
#site-footer .group_select > ul > li + li { margin-top: 20px; }
#site-footer .group_select > ul > li .sector { font-size: 1em; color: #005c9c; font-weight: 500; margin-bottom: 10px; }
#site-footer .group_select > ul > li a { font-size: 0.88em; color: #333; }
#site-footer .group_select > ul > li > ul > li + li { margin-top: 5px; }
#site-footer .group_select.active > a:after { transform: rotate(135deg); margin-top: -5px; }
#site-footer .group_select.active > ul { visibility: visible; height: 50vh; -webkit-transition: height 0.35s ease; transition: height 0.35s ease; }*/


#page-contents { min-height: 100vh; }

.sub-page-head { 
  /*230512 서브페이지 상단이 header에 먹히는 현상 수정 (padding-top: 110px; margin-bottom: 50px;)*/
  padding-top: 20px; margin-bottom: 50px; margin-top: 160px;  padding-bottom: 0; 
}

/* 230509 추가 */
.path_sub {text-align: right; margin-top: 20px; margin-bottom: 90px;}
.path_sub .inr-c {max-width: 1670px; margin: 0 auto;}
.path_sub p {display: flex; flex-direction: row; justify-content: flex-end; align-items: center; font-size: 15px; color: #9d9d9d; line-height: 1;}
.path_sub p i {margin: 0 11px;}
.path_sub p strong {color: #222;}

.sub-page-head > .inner { display: flex; flex-direction: column; align-items: center; justify-content: center; margin: 0 auto; border-bottom: 1px solid #dbdbdb; }
.sub-page-head > .inner > * { margin-bottom: 40px; }
.sub-page-head .title { font-size: 55px; font-weight: 600; white-space: nowrap; line-height: 1;  }
.sub-page-head .menu { margin-bottom: 0; }
.sub-page-head .menu ul { display: flex; align-items: center; }
.sub-page-head .menu ul li { position: relative; }
.sub-page-head .menu ul li:after { content: ''; width: 100%; height: 6px; background-color: #099de8; position: absolute; bottom: -1px; left: 0; opacity: 0; }
.sub-page-head .menu ul li + li { margin-left: 80px; }
.sub-page-head .menu ul li a { display: flex; align-items: center; justify-content: center; height: 90px; font-size: 25px; line-height: 1.4; font-weight: 500; white-space: nowrap; }

/*230223 역사페이지 탭메뉴 스타일 추가*/
.sub-page-head#posco_histoy_head .menu {margin-top: 30px; }
.sub-page-head#posco_histoy_head .menu ul li a { flex-direction: column; align-items: flex-start; }
.sub-page-head#posco_histoy_head .menu ul li:first-child a{ padding: 0 20px; }
.sub-page-head#posco_histoy_head .menu ul li a .year{ color: #999; font-size: 20px; }
.sub-page-head#posco_histoy_head .menu ul li.n3 a .tit,
.sub-page-head#posco_histoy_head .menu ul li.n4 a .tit{ font-size: 20px; line-height: 1.2; }
.sub-page-head#posco_histoy_head .menu ul li.on a .year{ color: #099de8; }
.sub-page-head#posco_histoy_head .menu ul li a br {display: block;}

/* 230329 화면 줄였을 때 메뉴 두줄 만들기 */
.sub-page-head .menu ul li a br{ display: none; }
@media screen and (max-width: 1200px){.sub-page-head .menu ul li a br{ display: block; }}

.sub-page-head .menu ul li.on:after { opacity: 1; }
.sub-page-head .menu ul li.on a { color: #099de8; }

.sub-page-section { display: flex; flex-direction: column; justify-content: center; position: relative; box-sizing: border-box; overflow: hidden; }
.sub-page-section > .inner { max-width: 1460px; width: 90%; padding: 50px 0; margin: 0 auto; position: relative; z-index: 1; box-sizing: border-box; }
.sub-page-section:first-child > .inner { padding-top: 100px; }
.sub-page-section:last-child > .inner { padding-bottom: 200px; }
.sub-page-section > .bg { position: absolute; top: 0; left: 0; z-index: 0; width: 100%; height: 100%; background-color: #000; overflow: hidden; }
.sub-page-section > .bg > .img { position: relative; width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; }
.sub-page-section > .bg > .video { position: relative; width: 100%; height: 100%; }
.sub-page-section > .bg > .video:after { content: ''; position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; background-color: rgba(0,0,0,0.35); z-index: 1; }
.sub-page-section > .bg video { min-width: 100%; min-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }

.sub-page-banner { position: relative; overflow: hidden; }
.sub-page-banner > .inner  { width: 90%; max-width: 1460px; min-height: 400px; display: flex; flex-direction: column; justify-content: center; margin: 0 auto; box-sizing: border-box; position: relative; z-index: 1; }
.sub-page-banner > .bg { position: absolute; top: 0; left: 0; z-index: 0; width: 100%; height: 100%; }
.sub-page-banner > .bg .img { display: block; width: 100%; height: 100%; background-color: #C6C5C2; background-position: center; background-repeat: no-repeat; background-size: cover; }
.sub-page-banner .text { font-size: 28px; max-width: 850px; line-height: 1.5; }
.sub-page-banner.right > .inner { text-align: right; align-items: flex-end; }
.sub-page-banner.center > .inner { text-align: center; align-items: center; }

.modal_header h2 + #sub-menu { margin-top: 40px; }
#sub-menu ul { position: relative; width: 100%; height: 100%; max-width: 1460px; margin: 0 auto; display: flex; text-align: center; border-bottom: 1px solid #d4d4d4; }
#sub-menu ul > li { position: relative; box-sizing: border-box; z-index: 2; }
#sub-menu ul > li + li { margin-left: 60px; }
#sub-menu ul > li a { font-size: 18px; height: 100%; height: 50px; color: #9c9c9c; font-weight: 500; white-space: nowrap; display: flex; align-items: center; justify-content: center; position: relative; }
#sub-menu ul > li.active a { color: #005c9c; }
#sub-menu ul > li.active a:after { content: ''; position: absolute; bottom: -1px; left: 0; width: 100%; height: 2px; background-color: #005c9c; }


.secHead { padding-right: 50px; }
.secHead > .secTitle { border-top: 2px solid #ddd; padding-top: 40px; position: relative; }
.secHead > .secTitle:before { content: ''; width: 40px; height: 2px; background-color: #005c9c; position: absolute; top: -2px; left: 0; }
.secBody .secTitle { color: #222; }
.secBody > .secTitle:first-child,
.secBody > .secText:first-child { margin-top: 40px; }

.secTitle { font-size: 30px; line-height: 1.33; font-weight: 600; color: #005c9c; margin-bottom: 40px; }
.secTitle.h2 { font-size: 20px; font-weight: 600; margin-bottom: 20px; }
.secTitle + .secText { margin-top: 0; }

.secText { font-size: 20px; line-height: 1.66; color: #666; }
.secText.h2 { font-size: 16px; }
.secText ul > li { font-size: 0.9em; padding-left: 10px; text-indent: -10px; }
.secText ul > li + li { margin-top: 5px; }
.secText ul.num > li { padding-left: 20px; text-indent: -20px; }
.secText ul.num > li .tit { color: #333; margin-bottom: 10px; }
.secText ul.list-style-01 > li { display: flex; padding-left: 0; text-indent: 0; }
.secText ul.list-style-01 > li:before { content: "·"; color: #005c9c; font-weight: bold; margin-right: 10px; }

.secText.small {font-size: 16px;}

.secText > li { padding-left: 20px; text-indent: -20px; }
.secText > li + li { margin-top: 5px; }

.secObj img { display: block; }
.secObj .row { margin: -10px; }
.secObj .row > * { padding: 10px; }
.secObj .row img { width: 100%; }

.secBtns { margin-top: 50px; display: flex; align-items: center; justify-content: center; }
.secBtns .btn { min-width: 185px; height: 40px; box-sizing: border-box; border: 1px solid #d6d6d6; background-color: #eaeaea; display: inline-flex; align-items: center; justify-content: space-between; padding: 0 15px; font-size: 14px; color: #222; line-height: 1; }
.secBtns .btn.dl:after { content: ''; width: 14px; height: 16px; background-size: contain; background-position: center; background-repeat: no-repeat; background-image: url(../images/ico/ico_dl.png); }
.secBtns .btn + .btn { margin-left: 10px; }

* + .secTitle,
* + .secText,
*:not(.secTitle) + .secObj { margin-top: 35px; }

/* 230322 테이블 타이틀(h4) 스타일 추가 */
h4.tb_title {margin-top: 50px; font-size: 30px; font-weight: 600;}

/* 230329 신용등급 모바일 스타일 */
.msg_touch_help {display: none}
@media screen and (max-width: 960px){
  .msg_touch_help {
      position: absolute;
      top: 50%;
      left: 50%;
      display: block;
      width: 80px;
      height: 80px;
      margin-top: -40px;
      margin-left: -40px;
      filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
      opacity: 0.5;
  }
  .msg_touch_help img { width: 80px; height: 80px; } 
}

/* 230328 스크롤 */
.table_inner.scroll iframe {display: block; text-align: center;}
.tb_table.scroll {position: relative;}
@media screen and (max-width: 960px) { 
.table_inner.scroll { position: relative; overflow: hidden; overflow-x: auto; -webkit-overflow-scrolling: touch;}
.table_inner.scroll iframe {display:block; text-align: none;}
}


/* 신용등급 테이블*/
.tb_table.credit {
  position: relative;
}

.tb_table { width: 100%; border-top: 2px solid #000; overflow-x: auto; box-sizing: border-box; }
.tb_table table { width: 100%; min-width: 750px; margin-top: 2px; }
.tb_table table th,
.tb_table table td { font-size: 15px; color: #7e7e7e; text-align: center; height: 70px; vertical-align: middle; border-bottom: 1px solid #d6d6d6; padding: 20px 30px; box-sizing: border-box; }
.tb_table table th.left,
.tb_table table td.left { text-align: left; }
.tb_table table th { font-size: 16px; color: #222; font-weight: 600; height: 60px; }
.tb_table table * + th,
.tb_table table * + td,
.tb_table table td.line { border-left: 1px solid #d6d6d6; }

.newsletter_wrap { display: flex; justify-content: flex-end; margin: 100px 0; background-color: #051737; padding: 70px 150px; background-image: url(../images/common/newsletter_bg.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; }
.newsletter_wrap .text { font-size: 22px; color: #cbd6e9; line-height: 34px; }
.newsletter_wrap .text span { font-size: 48px; color: #fff; }
.newsletter_wrap .btns { margin-top: 30px; }
.newsletter_wrap .btn { width: 200px; }
/*.newsletter_wrap .thumb { width: 400px; flex: none; background-color: #051737; background-image: url(../images/common/bg_newsletter.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; margin-right: 20px; display: flex; align-items: flex-end; padding: 35px; box-sizing: border-box; color: #cbd6e9; }
.newsletter_wrap .thumb span { font-size: 32px; color: #fff; }
.newsletter_wrap .cont { border: 1px solid #d5d5d5; width: 100%; }
.newsletter_wrap .cont > .inner { width: 90%; max-width: 775px; padding: 45px 0; margin: 0 auto; }
.newsletter_wrap .cont .tit1 { font-size: 16px; color: #333; margin-bottom: 10px; }
.newsletter_wrap .cont .tit2 { font-size: 32px; font-weight: bold; margin-bottom: 20px; }
.newsletter_wrap .cont .chk { margin-top: 40px; }
.newsletter_wrap .cont .chk label { color: #333; }*/


#login_wrap { max-width: 840px; margin: 0 auto; }
#login_wrap .login_head { text-align: center; margin-bottom: 60px; }
#login_wrap .login_head .title { font-size: 36px; font-weight: bold; margin-bottom: 40px; }
#login_wrap .login_head .text { font-size: 20px; font-weight: 300; }
#login_wrap .login_box { border: 1px solid #dadada; border-radius: 10px; overflow: hidden; box-shadow: 1px 3px 6px 0px rgba(0, 0, 0, 0.1); }
#login_wrap .login_box .form { padding: 75px 100px; }
#login_wrap .login_box .form .chk { margin-top: 20px; display: flex; justify-content: space-between; }
#login_wrap .login_box .form .chk ul { display: flex; }
#login_wrap .login_box .form .chk ul li { position: relative; }
#login_wrap .login_box .form .chk ul li + li { padding-left: 16px; margin-left: 16px; }
#login_wrap .login_box .form .chk ul li + li:before { content: ''; width: 4px; height: 4px; border-radius: 50%; background-color: #c8c8c8; position: absolute; left: -2px; margin-top: -2px; top: 50%; }
#login_wrap .login_box .form .chk ul li a { font-size: 16px; color: #666; }
#login_wrap .login_box .form .chk ul li a b { color: #222; }
#login_wrap .login_box .form .button { margin-top: 30px; }
#login_wrap .login_box .form .button button { width: 100%; height: 66px; background-color: #222; border-color: #222; font-size: 20px; color: #fff; cursor: pointer; }
#login_wrap .login_box .info { padding: 30px 100px; background-color: #f0f0f0; }
#login_wrap .login_box .info ul li { font-size: 16px; color: #8b8b8b; }





#vision_sec_top { text-align: center; /*240226 추가*/ background-image: url(/docs/kor7/jsp/resources/images/company/posco_vision_top_bg.png); background-position: center; background-size: cover;}
#vision_sec_top .inner{ padding: 120px 0 160px;}
#vision_sec_top .secText { display: inline-block; font-size: 30px; color: #fff; position: relative; letter-spacing: -0.025em; line-height: 1.533em;}
#vision_sec_top .secText:before,
#vision_sec_top .secText:after { content: ''; width: 27px; height: 22px; position: absolute; background-size: contain; background-position: center; background-repeat: no-repeat; }
#vision_sec_top .secText:before { background-image: url(../images/company/vision_q_left.png); top: 7px; left: -35px; }
#vision_sec_top .secText:after { background-image: url(../images/company/vision_q_right.png); top: 5px; right: -35px; }
/* 240226 주석 #vision_sec_top .secText span { background: linear-gradient(to top, #eeeeee 50%, transparent 50%); }*/

/*240226 포스코ci 버튼으로 인한 추가*/
#vision_posco_ci {padding-top: 50px; }
#vision_posco_ci.tab.ty4 > ul { justify-content: flex-end; }
#vision_posco_ci.tab.ty4 > ul > li.on > a {text-decoration: none; }
#vision_sec_04 .secTitle { font-weight: normal; }
#vision_sec_04 .secTitle b { font-weight: bold; }
#vision_sec_04 b,#vision_sec_06 b { font-weight: bold; color: #005c9c; }


#message_sec_01 .box { position: relative; background-image: url(../images/company/message_border_style.jpg); position: relative; z-index: 1; padding: 15px; display: flex; align-items: center; flex-direction: row-reverse; box-sizing: border-box; }
#message_sec_01 .box:before { content: ''; background-image: url(../images/company/message_sec_01_photo.jpg); background-position: center; position: absolute; top: 15px; right: 15px; bottom: 15px; left: 15px; z-index: -1; }
#message_sec_01 .box .cont { width: 100%; padding: 0 85px; height: 602px; display: flex; align-items: flex-start; justify-content: center; flex-direction: column; }
#message_sec_01 .box .tit { font-size: 35px; font-weight: bold; margin-bottom: 10px; }
#message_sec_01 .box .txt { font-size: 32px; letter-spacing: -0.025em; line-height: 1.57; max-width: 700px; margin-top: 15px; } 
#message_sec_01 .signature { position: relative; z-index: 2; display: flex; align-items: center; color: #222; font-size: 32px; margin-top: 50px; letter-spacing: -0.025em;  }
#message_sec_01 .signature b { font-size: 42px; font-weight: 600; margin-left: 35px; }
#message_sec_02 .secText,
#message_sec_04 .secText { font-size: 20px; margin-top: 0; line-height: 1.88; }
#message_sec_03 { max-width: 1460px; margin: 0 auto; overflow: visible; }
#message_sec_03 > .inner { min-height: 100px; width: 95%; }
#message_sec_03 > .bg { left: auto; right: 0; width: 120%; }
#message_sec_03 > .bg .img { background-image: url(../images/company/message_sec_03_bg.jpg); }
#message_sec_03 .text { max-width: 100%; }
#message_sec_03 .text span { position: relative; color: #222; font-weight: 500; }
#message_sec_03 .text span:before { content: ''; width: 45px; height: 36px; z-index: -1; position: absolute; background-size: contain; background-position: center; background-repeat: no-repeat; background-image: url(../images/company/vision_q_left.png); top: -25px; left: -35px; }
#message_sec_03 .text span:after { content: ''; width: 45px; height: 36px; z-index: -1; position: absolute; background-size: contain; background-position: center; background-repeat: no-repeat; background-image: url(../images/company/vision_q_right.png); bottom: -20px; right: -35px; }


/*250220 추가*/
#message_sec_01 {height: 525px; margin-top: 50px; position: relative; }
#message_sec_01 .inner { width: 100%; max-width: none; padding: 0; background-color: #F4F4F4; height: 380px; display: flex; align-items: center; }
#message_sec_01 .txt { position: absolute; z-index: 2; left: 50%; transform: translateX(-50%); width: 90%; max-width: 1460px;}
#message_sec_01 .txt p { font-size: 30px; color: #222; font-weight: 600; line-height: 1.5em; letter-spacing: -0.025em; width: fit-content; display: flex; flex-direction: column;}
#message_sec_01 .txt p::before,#message_sec_01 .txt p::after { content: ''; display: block; width: 45px; height: 35px; background-size: contain; background-repeat: no-repeat; flex: none;}
#message_sec_01 .txt p::before { background-image: url(../images/company/message_q_left.png); margin-bottom: 20px; }
#message_sec_01 .txt p::after { background-image: url(../images/company/message_q_right.png); margin-left: auto; margin-top: 15px;}
#message_sec_01 .background { width: 100%; height: 380px;  position: absolute; z-index: 0;}
#message_sec_01 .photo { position: absolute; z-index: 1; left: 55%; bottom: 0; width: 100%;}
#message_sec_01 .photo img{ display: flex; width: fit-content;}

#message_sec_02 .inner{font-size: 22px; line-height: 1.7em; letter-spacing: -0.025em; color:#222;  }
#message_sec_02 .inner div:first-child, #message_sec_02 .inner div:last-child{font-weight: 600;}
#message_sec_02 .inner div:last-child{margin-top: 70px;}
#message_sec_02 .inner div:last-child span{font-size: 28px;}
/*250220 추가 끝*/

/*  240226 포스코 CI 기존 스타일  */
[id*='posco_ci_sec_'] .secBody .row { margin: -10px; }
[id*='posco_ci_sec_'] .secBody .row > * { padding: 10px; }
[id*='posco_ci_sec_'] .secBody * + .row { margin-top: 30px; }
[id*='posco_vision_sec_'] .secBody .row { margin: -10px; }
[id*='posco_vision_sec_'] .secBody .row > * { padding: 10px; }
[id*='posco_vision_sec_'] .secBody * + .row { margin-top: 30px; }

/*  240226 포스코 CI 팝업창 스타일  */
[id*='posco_ci_sec_'] > .row > *,
[id*='posco_vision_sec_'] > .row > *{ padding: 10px; }
[id*='posco_ci_sec_'] .secTitle + .secTitle,
[id*='posco_vision_sec_'] .secTitle + .secTitle{ margin-top: 0;} 


#group_company .list { display: flex; flex-direction: column; }
#group_company .list > li { display: flex; align-items: stretch; }
#group_company .list > li + li { border-top: 1px solid #eee; padding-top: 60px; margin-top: 60px; }
#group_company .list > li .head { width: 255px; flex: none; }
#group_company .list > li .title { font-size: 30px; font-weight: 600; color: #005c9c; line-height: 1.25; /*text-transform: uppercase;*/ }
#group_company .list > li .cont { width: 100%; padding-right: 80px; display: flex; flex-direction: column; justify-content: space-between; }
#group_company .list > li .cont .tit { font-size: 22px; margin-bottom: 30px; line-height: 1.875; }
#group_company .list > li .cont .txt { font-size: 18px; color: #666; line-height: 1.875; /*text-align: justify;*/ }
#group_company .list > li .homepage { margin-top: 20px; }
#group_company .list > li .homepage a { font-size: 16px; color: #222; line-height: 1.2; }
#group_company .list > li .homepage a:hover { border-bottom: 1px solid #222; }
#group_company .list > li .homepage .link { display: inline-flex; align-items: center; }
#group_company .list > li .homepage .link:after { content: ''; width: 17px; height: 17px; margin-left: 10px; background-size: contain; background-repeat: no-repeat; background-position: center; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 392.75 392.75'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%2300b8ff;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3EVector Smart Object%3C/title%3E%3Cpath class='cls-1' d='M961.21,1028.31h306.25a43.3,43.3,0,0,0,43.25-43.25V853.81a21.38,21.38,0,1,0-42.75,0V963.18a22.41,22.41,0,0,1-22.38,22.38H983.08a22.4,22.4,0,0,1-22.37-22.38V700.68a22.4,22.4,0,0,1,22.37-22.37h109.38a21.38,21.38,0,0,0,0-42.75H961.21A43.3,43.3,0,0,0,918,678.81V985.06A43.3,43.3,0,0,0,961.21,1028.31Z' transform='translate(-917.96 -635.56)'/%3E%3Cpath class='cls-1' d='M1180,678.31h57.86L1037.25,878.88A21.31,21.31,0,1,0,1067.38,909L1268,708.44v57.87a21.38,21.38,0,0,0,42.75,0V656.93a21.4,21.4,0,0,0-21.38-21.37H1180a21.38,21.38,0,1,0,0,42.75Z' transform='translate(-917.96 -635.56)'/%3E%3C/svg%3E"); }
#group_company .list > li .img { width: 500px; flex: none; }
#group_company .list > li .img img { display: block; width: 100%; }

#company_brochure .kv img { display: block; }
#company_brochure .list { display: flex; flex-wrap: wrap; margin: -10px; margin-top: 10px; }
#company_brochure .list li { width: 50%; padding: 10px; box-sizing: border-box; }
#company_brochure .list li a { display: block; width: 100%; height: 0; padding-top: 52%; background-color: #eee; position: relative; }
#company_brochure .list li a > * { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: flex-end;  padding: 20px 40px; box-sizing: border-box; font-size: 25px; color: #fff; font-weight: 600; }
#company_brochure .list li a > * > * { display: inline-flex; align-items: center; }
#company_brochure .list li i.pdf {width: 30px; height: 35px; margin-left: 15px; background-size: contain; background-position: center; background-repeat: no-repeat; background-image: url("data:image/svg+xml,%3Csvg id='Isolation_Mode' data-name='Isolation Mode' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 362.83 423.3'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3EVector Smart O22bject%3C/title%3E%3Cpath class='cls-1' d='M413.35,388.43Q420,395,424.69,406.38t4.73,20.79V699.29A22.59,22.59,0,0,1,406.74,722H89.27a22.57,22.57,0,0,1-22.68-22.68V321.35a22.59,22.59,0,0,1,22.68-22.68H300.91q9.45,0,20.79,4.73t17.95,11.33Zm-14.17,303.3V449.85H300.91a22.59,22.59,0,0,1-22.67-22.68V328.91H96.82V691.73ZM277.77,551.66a180.58,180.58,0,0,0,19.84,13.23,234.88,234.88,0,0,1,27.64-1.66q34.71,0,41.8,11.58,3.78,5.19.48,12.28a.65.65,0,0,1-.24.47l-.47.48v.23q-1.43,9-16.77,9-11.34,0-27.17-4.73A171.58,171.58,0,0,1,292.17,580q-52.2,5.67-92.59,19.61-36.15,61.89-57.17,61.89a13.63,13.63,0,0,1-6.61-1.66L130.13,657c-.16-.16-.63-.55-1.42-1.18-1.57-1.57-2.05-4.41-1.41-8.5q2.12-9.45,13.22-21.62t31.19-22.79q3.3-2.13,5.43,1.41a1.39,1.39,0,0,1,.47.95q12.28-20.07,25.27-46.54a360.23,360.23,0,0,0,24.57-61.88,190.68,190.68,0,0,1-7.2-37.68q-1.55-18.3,1.53-30.12,2.59-9.44,9.92-9.45h5.2q5.43,0,8.27,3.55,4.25,4.95,2.12,16.06a5.23,5.23,0,0,1-.94,1.89,6.35,6.35,0,0,1,.24,1.89v7.09q-.48,29.06-3.31,45.35Q256.27,534.18,277.77,551.66ZM141.71,648.74q12.27-5.67,32.36-37.32a134.36,134.36,0,0,0-20.67,19.84Q144.78,641.66,141.71,648.74Zm64.72-61.18a346.63,346.63,0,0,1,67.08-19.13,36,36,0,0,1-3.07-2.24,42.74,42.74,0,0,1-3.78-3.19q-18-15.82-30-41.58-6.37,20.33-19.6,46.54Q210,581.19,206.43,587.56Zm29.29-156.14q-3.54,9.93-.47,31.18c.15-1.1.71-4.56,1.65-10.39q0-.7,1.65-10.16a5.51,5.51,0,0,1,.95-1.89.65.65,0,0,1-.24-.47.48.48,0,0,0-.12-.35A.49.49,0,0,1,239,439a13.68,13.68,0,0,0-3.07-8.5.69.69,0,0,1-.24.47ZM308.47,330.8v88.81h88.82q-2.37-6.84-5.2-9.68L318.16,336Q315.32,333.16,308.47,330.8Zm50.55,253q-5.67-5.67-33.07-5.67,18,6.61,29.29,6.62a22.61,22.61,0,0,0,4.26-.24C359.5,584.34,359.34,584.1,359,583.78Z' transform='translate(-66.59 -298.67)'/%3E%3C/svg%3E"); }



#company_local_global .globalMap { background-color: #030b3f; }
#company_local_global .globalMap .text { text-align: center; padding: 100px; padding-bottom: 50px; color: #fff; }
#company_local_global .globalMap .text .tit { font-size: 30px; font-weight: 300; line-height: 1.333; }
#company_local_global .globalMap .text ul { margin-top: 50px; display: inline-flex; align-items: center; justify-content: center; }
#company_local_global .globalMap .text ul li + li { margin-left: 100px; }
#company_local_global .globalMap .text ul li { padding-left: 40px; border-left: 1px solid rgba(255, 255, 255, .4); text-align: left; line-height: 1; }
#company_local_global .globalMap .text ul li p { font-size: 18px; font-size: 18px; margin-bottom: 10px; }
#company_local_global .globalMap .text ul li div { font-size: 52px; font-weight: 300; }
#company_local_global .globalMap .text ul li div b { font-size: 78px; font-weight: 600; }

#company_local_global .globalMap > .inner { position: relative; max-width: 1250px; margin: 0 auto; padding: 50px; }
#company_local_global .globalMap .list li { position: absolute; text-align: center; line-height: 1; }
#company_local_global .globalMap .list li a { display: block; position: relative; }
#company_local_global .globalMap .list li a:before,
#company_local_global .globalMap .list li a:after { content: ''; width: 50px; height: 50px; position: absolute; left: 50%; top: 50%; border-radius: 50%; transform: matrix(1,0,0,1,-25,-25); opacity: 0; transition: all 0.35s; }
#company_local_global .globalMap .list li a:before { background-color: rgba(9, 124, 242, 0.2); z-index: 1; }
#company_local_global .globalMap .list li a:after { background-color: rgba(9, 124, 242, 0.8); z-index: 2; }
#company_local_global .globalMap .list li .en { font-size: 30px; font-weight: 600; color: #fff; z-index: 3; position: relative; transition: all 0.35s; }
#company_local_global .globalMap .list li .kr { font-size: 16px; font-weight: 500; color: #fff; margin-top: 5px; z-index: 3; position: relative; transition: all 0.35s; }
#company_local_global .globalMap .list li .point { width: 12px; height: 12px; background-color: #fff; border-radius: 50%; position: absolute; top: 100%; left: 50%; margin-left: -6px; margin-top: 7px;  }

#company_local_global .globalMap .list li a:hover .point { opacity: 0; }
#company_local_global .globalMap .list li a:hover:before { transform: matrix(5,0,0,5,-25,-25); opacity: 1; }
#company_local_global .globalMap .list li a:hover:after { transform: matrix(4,0,0,4,-25,-25); opacity: 1;  }
#company_local_global .globalMap .list li.as { top: 35%; left: 33%; }
#company_local_global .globalMap .list li.oc { top: 63%; left: 35%; }
#company_local_global .globalMap .list li.na { top: 32%; left: 64%; }
#company_local_global .globalMap .list li.sa { top: 57%; left: 73%; }
#company_local_global .globalMap .list li.eu { top: 22%; left: 10%; }
#company_local_global .globalMap .list li.af { top: 48%; left: 11%; }

/* 230509 추가 */
#company_map_area { width: 100%; height: 100%; margin-top: 45px;  position: relative; }
/*230509 기존 지도 스타일 주석처리*/
/*#company_map_area { width: 100%; height: 620px; margin-top: 45px; background-color: #C6C5C2; position: relative; }
#company_map_area > * { width: 100%; height: 100%; position: absolute; top: 0; right: 0; bottom: 0; left: 0; }*/

#company_corporation_list .tb_table { margin-top: 50px; }
#company_corporation_list .tb_table .title { text-align: left; padding-left: 60px; padding-right: 60px; color: #222; }
#company_corporation_list .tb_table .link { display: flex; align-items: center; justify-content: space-between; color: #222; }
#company_corporation_list .tb_table .link:after { content: ''; width: 15px; height: 15px; background-size: contain; background-repeat: no-repeat; background-position: center; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 392.75 392.75'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%2300b8ff;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3EVector Smart Object%3C/title%3E%3Cpath class='cls-1' d='M961.21,1028.31h306.25a43.3,43.3,0,0,0,43.25-43.25V853.81a21.38,21.38,0,1,0-42.75,0V963.18a22.41,22.41,0,0,1-22.38,22.38H983.08a22.4,22.4,0,0,1-22.37-22.38V700.68a22.4,22.4,0,0,1,22.37-22.37h109.38a21.38,21.38,0,0,0,0-42.75H961.21A43.3,43.3,0,0,0,918,678.81V985.06A43.3,43.3,0,0,0,961.21,1028.31Z' transform='translate(-917.96 -635.56)'/%3E%3Cpath class='cls-1' d='M1180,678.31h57.86L1037.25,878.88A21.31,21.31,0,1,0,1067.38,909L1268,708.44v57.87a21.38,21.38,0,0,0,42.75,0V656.93a21.4,21.4,0,0,0-21.38-21.37H1180a21.38,21.38,0,1,0,0,42.75Z' transform='translate(-917.96 -635.56)'/%3E%3C/svg%3E"); }



#posco_histoy_head .btn { min-width: 215px; height: 55px; border-radius: 55px; padding: 0 20px; display: inline-flex; align-items: center; color: #222; font-weight: 500; background-color: #fff; }
#posco_histoy_head .btn img { margin-right: 10px; margin-bottom: 3px; }

#posco_histoy_menu { margin-bottom: 30px; }
#posco_histoy_menu ul { display: flex; max-width: 1460px; margin: 0 auto; }
#posco_histoy_menu ul li { width: 100%; padding: 30px; box-sizing: border-box; }
#posco_histoy_menu ul li + li { border-left: 1px solid #e9e9e9; }
#posco_histoy_menu ul li a { display: block; }
#posco_histoy_menu ul li .year { font-size: 22px; color: #8f9298; font-weight: 600; position: relative; }
#posco_histoy_menu ul li .tit { font-size: 18px; color: #8f9298; font-weight: 600; line-height: 1.2 }
#posco_histoy_menu ul li.active .year { color: #222; }
#posco_histoy_menu ul li.active .year:after { content: ''; width: 14px; height: 14px; background-color: #005c9c; border-radius: 50%; display: inline-block; vertical-align: top; margin-left: 5px; position: absolute; }
#posco_histoy_menu ul li.active .tit { color: #666; }

#posco_histoy_kv { color: #fff; }
#posco_histoy_kv > .inner { min-height: 640px; }
#posco_histoy_kv .title { font-size: 50px; line-height: 1; font-weight: 600; }
#posco_histoy_kv .title + .text { margin-top: 30px; }
#posco_histoy_kv .text { font-size: 22px; line-height: 1.54; max-width: 100%; } 

#posco_histoy_list ul {  }
#posco_histoy_list ul li { position: relative; display: flex; align-items: center; justify-content: center; padding: 40px 0; }
/*#posco_histoy_list ul li:first-child { padding-top: 0; }
#posco_histoy_list ul li:last-child { padding-bottom: 0; }*/
#posco_histoy_list ul li:before { content: ''; width: 1px; height: 100%; position: absolute; top: 0; left: 50%; z-index: 1; background-color: #d9d9d9; }
#posco_histoy_list ul li:after { content: ''; width: 24px; height: 24px; position: absolute; top: 50%; left: 50%; background-color: #fff; border: 8px solid #005c9c; border-radius: 50%; margin-left: -12px; margin-top: -12px; z-index: 2; box-sizing: border-box; /*transform: scale(0);*/ transition: transform 0.5s; transition-delay: 0.3s; }
#posco_histoy_list ul li > * { width: 50%; box-sizing: border-box; overflow: hidden; }
#posco_histoy_list ul li > * > * { /*opacity: 0; */transition-property: opacity, transform; transition-duration: 1500ms; transition-timing-function: cubic-bezier(.215, .61, .355, 1); }
#posco_histoy_list ul li .cont > div { padding-right: 100px; box-sizing: border-box; max-width: 640px; margin-left: auto; /*-webkit-transform: translateX(100px); transform: translateX(100px); transition-delay: 600ms;*/ }
#posco_histoy_list ul li .cont .year { font-size: 55px; font-weight: 600; line-height: 1; }
#posco_histoy_list ul li .cont dl { margin-top: 30px; }
#posco_histoy_list ul li .cont dl dd { display: flex; }
#posco_histoy_list ul li .cont dl dd:before { flex: none; content: ''; width: 5px; height: 5px; background-color: #005c9c; margin-top: 13px; margin-right: 15px; border-radius: 50%; }
#posco_histoy_list ul li .cont dl dd .date { font-size: 18px; line-height: 1.8; color: #222; width: 80px; flex: none; font-weight: 600; }
#posco_histoy_list ul li .cont dl dd .text { font-size: 18px; line-height: 1.8; color: #666; /*240223 추가*/  }
#posco_histoy_list ul li .cont dl dd .text .history_btn_wrap {display: flex; gap: 5px; margin-bottom: 10px; }
#posco_histoy_list ul li .img { padding-left: 50px; }
#posco_histoy_list ul li .img > div { width: 100%; height: 0; padding-top: 63%; background-size: cover; background-repeat: no-repeat; background-position: center; /*-webkit-transform: translateX(-100px); transform: translateX(-100px); transition-delay: 900ms; */ }
#posco_histoy_list ul li .img img { display: block; width: 100%; }

#posco_histoy_list ul li:nth-child(even) { flex-direction: row-reverse; }
#posco_histoy_list ul li:nth-child(even) .cont > div { margin-left: 0; padding-left: 100px; padding-right: 0; }
#posco_histoy_list ul li:nth-child(even) .img { padding-left: 0; padding-right: 50px; }
/*#posco_histoy_list ul li:nth-child(even) { flex-direction: row-reverse; }
#posco_histoy_list ul li:nth-child(even) .cont > div { margin-left: 0; padding-left: 100px; padding-right: 0; -webkit-transform: translateX(-100px); transform: translateX(-100px); }
#posco_histoy_list ul li:nth-child(even) .img { padding-left: 0; padding-right: 50px; }
#posco_histoy_list ul li:nth-child(even) .img > div { -webkit-transform: translateX(100px); transform: translateX(100px); }

#posco_histoy_list ul li.is-show:after { transform: scale(1); }
#posco_histoy_list ul li.is-show .cont > div { opacity: 1; -webkit-transform: translate(0); transform: translate(0); }
#posco_histoy_list ul li.is-show .img > div { opacity: 1; -webkit-transform: translate(0); transform: translate(0); }*/



[id*='esg_environment_'] > .inner {  padding: 90px 0;}
#esg_environment_01 { text-align: center; }
#esg_environment_01 .secTitle { font-size: 40px; font-weight: 500; color: #222; display: flex; flex-direction: column;  align-items: center; }
#esg_environment_01 .secTitle:after { content: ''; width: 90px; height: 1px; background-color: #cdcdcd; margin-top: 50px; }
#esg_environment_01 .secText { font-size: 20px; font-weight: 300; color: #1e2f46; }
#esg_environment_02 { background-color: #fafafa; }
#esg_environment_02 .secObj { max-width: 1250px; margin: 0 auto; }
#esg_environment_03 { color: #fff; font-weight: 300; min-height: 100vh; }
#esg_environment_03 > .inner { max-width: 1250px; }
#esg_environment_03 .title { font-size: 40px; }
#esg_environment_03 .text { font-size: 16px; }
#esg_environment_03 ul { margin-top: 80px; }
#esg_environment_03 ul li { font-size: 20px; display: flex; }
#esg_environment_03 ul li:before { content: ''; width: 7px; height: 7px; background-color: #fff; border-radius: 50%; margin-top: 13px; margin-right: 20px; flex: none; }
#esg_environment_03 ul li + li { margin-top: 20px; }
#esg_environment_04 { text-align: center; }
#esg_environment_04 > .inner { max-width: 100%; width: 100%; padding-top: 140px; }
#esg_environment_04 .secHead { padding: 0; }
#esg_environment_04 .secTitle { border-top: 0; padding: 0; font-size: 40px; font-weight: 500;  color: #222; margin-bottom: 70px; }
#esg_environment_04 .secTitle:before { display: none; }
#esg_environment_04 .secBody { padding: 90px 0; background: url(../images/esg/approach/esg_environment_04_bg.jpg) center no-repeat; background-size: cover; }
#esg_environment_04 .secText { font-size: 20px; font-weight: 300; color: #fff; margin-left: auto; margin-right: auto; max-width: 1200px; }
#esg_environment_04 .secBtn { margin-top: 90px; }
#esg_environment_04 .secBtn .btn { border-radius: 60px; padding: 0 40px; }

#esg_environment_05 .secTitle { font-size: 50px; font-weight: 300; color: #005c9c; margin-bottom: 60px; }
#esg_environment_05 .secTitle span { font-size: 16px; color: #222; font-weight: normal; }
#esg_environment_05 .secTitle sub { font-size: 0.5em; }
#esg_environment_05 .secObj img { margin: 0 auto; }



#esg_subPage_section { min-height: 100vh; }
#esg_subPage_section .swiper-container { overflow: hidden;width: 100%; padding: 0 36px;}
#esg_subPage_section .swiper-nav { display: flex; align-items: center; justify-content: space-between; width: 100%; position: absolute; z-index: 10; top: 50%; left: 0; transform: translateY(-50%); }

#esg_subPage_section .swiper-nav > button { font-size: 0; background-color: transparent; border: 0; width: 72px; height: 72px; border-radius: 4rem; background-color: #fff; cursor: pointer; padding: 0; display: flex; justify-content: center; align-items: center; box-shadow: 4px 4px 5px rgba(0, 0, 0, .1); } 
#esg_subPage_section .swiper-nav > button:after{width: 34px; height: 22px; content: ''; display: block; background-image: url(../images/common/subslide_arr.png); background-position: center; background-repeat: no-repeat; background-size: contain; } 
#esg_subPage_section .swiper-nav > button:where(:hover, :focus) { opacity: 1; } 
#esg_subPage_section .swiper-nav .swiper-next:after { transform: rotate(180deg); }

/* 240517 서브페이지 슬라이드 스타일 변경
#esg_subPage_section .swiper-container { overflow: hidden; } 
#esg_subPage_section .swiper-nav { display: flex; align-items: center; justify-content: flex-start; margin-bottom: 20px; }
#esg_subPage_section .swiper-nav > button { font-size: 0; background-color: transparent; border: 0; width: 31px; height: 31px; opacity: 0.6; cursor: pointer; padding: 0; background-position: center; background-repeat: no-repeat; background-size: contain; }
#esg_subPage_section .swiper-nav > button + button { margin-left: 25px; }
#esg_subPage_section .swiper-nav > button:hover { opacity: 1; }
#esg_subPage_section .swiper-nav .swiper-prev { background-image: url(../images/esg/approach/esg_subPage_arrow_prev.png); }
#esg_subPage_section .swiper-nav .swiper-next { background-image: url(../images/esg/approach/esg_subPage_arrow_next.png); }
*/
/*#esg_subPage_section .swiper-nav .swiper-button-disabled { display: none; }*/

#esg_subPage_list .item { display: flex; flex-direction: column; justify-content: space-between; box-sizing: border-box; background-color: rgba(255, 255, 255, 0.9); padding: 80px 60px 60px; height: 500px; color: #222; border-top-right-radius: 30px; border-bottom-left-radius: 30px; }
#esg_subPage_list .item .tit { font-size: 25px; font-weight: 600; margin-bottom: 30px; line-height: 1.25; }
#esg_subPage_list .item .date { text-align: right;font-size: 15px; }
#esg_subPage_list .item .txt { height: 100%; font-size: 16px; font-weight: 300; overflow: hidden; }
#esg_subPage_list .item .more a { display: inline-flex; align-items: center; font-size: 18px; font-weight: 500; }
#esg_subPage_list .item .more a:after { content: ''; width: 30px; height: 30px; margin-left: 10px; margin-top: -3px; box-sizing: border-box; border-radius: 50%; border: 1px solid #aaa; background-repeat: no-repeat; background-position: center; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='10px' height='10px'%3E%3Cpath fill-rule='evenodd' fill='rgb(51, 51, 51)' d='M10.000,6.000 L6.000,6.000 L6.000,9.999 L4.000,9.999 L4.000,6.000 L-0.000,6.000 L-0.000,4.000 L4.000,4.000 L4.000,-0.001 L6.000,-0.001 L6.000,4.000 L10.000,4.000 L10.000,6.000 Z'/%3E%3C/svg%3E"); }
#esg_subPage_list .item .more a:hover:after { background-color: #222; border-color: #222; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='10px' height='10px'%3E%3Cpath fill-rule='evenodd' fill='rgb(255, 255, 255)' d='M10.000,6.000 L6.000,6.000 L6.000,9.999 L4.000,9.999 L4.000,6.000 L-0.000,6.000 L-0.000,4.000 L4.000,4.000 L4.000,-0.001 L6.000,-0.001 L6.000,4.000 L10.000,4.000 L10.000,6.000 Z'/%3E%3C/svg%3E"); } 
#esg_subPage_list .item .more a.dl { height: 50px; border: 1px solid #939393; padding: 0 20px; }
#esg_subPage_list .item .more a.dl:after { background-image: url(../images/ico/ico_dl.png); border: 0;  }
#esg_subPage_list .item .more a.dl:hover:after { background-color: transparent; }


#esg_latest_news > .inner { padding: 120px 0; }
#esg_latest_news .esg_article_title { font-size: 60px; font-weight: 600; margin-bottom: 50px; line-height: 1; }
#esg_latest_news .esg_article_more { display: flex; align-items: center; position: absolute; top: 145px; right: 0; font-size: 20px; font-weight: 500; color: #005c9c; }
#esg_latest_news .esg_article_more:after { content: ''; width: 30px; height: 12px; margin-left: 10px; background-size: contain; background-repeat: no-repeat; background-position: center; background-image: url(../images/esg/approach/esg_article_arrow.png); }
#esg_latest_news .esg_article_list { display: flex; margin: -25px; }
#esg_latest_news .esg_article_list > li { width: 100%; padding: 25px; box-sizing: border-box; }
#esg_latest_news .esg_article_list .article { display: flex; flex-direction: column; border-top: 2px solid #828282; padding-top: 20px; }
#esg_latest_news .esg_article_list .article .tit { font-size: 25px; font-weight: 600; line-height: 1.44; height: 105px; overflow: hidden; max-width: 350px; }
#esg_latest_news .esg_article_list .article .date { font-size: 16px; color: #999; margin-top: 10px; line-height: 1; }
#esg_latest_news .esg_article_list .article .img { margin-top: 30px }
#esg_latest_news .esg_article_list .article .img > div { width: 100%; height: 0; padding-top: 70%; background-color: #C6C5C2; background-position: center; background-repeat: no-repeat; background-size: cover; }


#esg_subPage_modal .mainTitle { font-size: 30px; font-weight: 600; margin-bottom: 40px; }
#esg_subPage_modal * + .mainTitle { margin-top: 60px; }
#esg_subPage_modal .sub-page-section + .sub-page-section { margin-top: 70px; }
#esg_subPage_modal .secInner { padding-left: 25px; margin-top: 35px; }
#esg_subPage_modal .secTitle { font-size: 24px; margin-bottom: 30px; font-weight: 500; }
#esg_subPage_modal .secTitle.h2 { font-size: 18px; margin-bottom: 15px; color: #222; font-weight: 500; }
#esg_subPage_modal .secText { font-size: 16px; color: #222; }
#esg_subPage_modal .secText.h2 { font-size: 14px; }
#esg_subPage_modal .downBtn { font-size: 14px; background-color: #eaeaea; border-radius: 0; border-color: #d6d6d6; height: 40px; min-width: 190px; justify-content: space-between; }
#esg_subPage_modal .downBtn:after { content: ''; width: 25px; height: 25px; margin-left: 5px; background: url(../images/ico/ico_dl.png) center no-repeat; }
#esg_subPage_modal .grayBox { padding: 30px; background-color: #f7f7f7; }
#esg_subPage_modal .tb_table { border: 0; }
#esg_subPage_modal .tb_table table { border: 1px solid #d4d4d4; }
#esg_subPage_modal .tb_table table thead th { background-color: #f5f5f5; }
#esg_subPage_modal .btn_group { display: flex; flex-wrap: wrap; }
#esg_subPage_modal .btn_group > li { margin-right: 10px; }


#esg_subPage_modal .bd_list { border-top: 1px solid #d5d5d5; border-bottom: 1px solid #d5d5d5; font-size: 14px; }
#esg_subPage_modal .bd_list ul { display: flex; flex-wrap: wrap; margin-bottom: -1px; }
#esg_subPage_modal .bd_list ul > li { width: 50%; padding: 30px 0; padding-right: 30px; box-sizing: border-box; display: flex; align-items: stretch; border-bottom: 1px solid #d5d5d5; }
#esg_subPage_modal .bd_list ul > li .lft { width: 180px; flex: none; padding-right: 60px; box-sizing: border-box; }
#esg_subPage_modal .bd_list ul > li .photo { margin-bottom: 20px; }
#esg_subPage_modal .bd_list ul > li .photo img { display: block; }
#esg_subPage_modal .bd_list ul > li .name { color: #222; }
#esg_subPage_modal .bd_list ul > li .name p { font-size: 20px; font-weight: 500; }
#esg_subPage_modal .bd_list ul > li .name div { font-size: 16px; font-weight: 500; color: #7e7e7e; }
#esg_subPage_modal .bd_list ul > li .name dl { margin-top: 10px; font-weight: 300; }

#esg_subPage_modal .bd_list ul > li .rgh dl + dl { margin-top: 5px; }
#esg_subPage_modal .bd_list ul > li .rgh dl dt { font-weight: 500; color: #222; }
#esg_subPage_modal .bd_list ul > li .rgh dl dd { color: #666; }

#esg_subPage_modal .file-wrap .key { font-weight: 500; }
#esg_subPage_modal .file-wrap .value a { text-decoration: underline; }

/* 230517 ESG Controversies 페이지 추가 */
#esg_subPage_modal .date { text-align: right;font-size: 15px; }
#esg_subPage_modal .contro_item .secText p {margin-top: 30px;}
#esg_subPage_modal .contro_item .secText > p:first-child {margin-top:0;}
#esg_subPage_modal .contro_item p > a:hover {text-decoration: underline;}
#esg_subPage_modal .contro_item p.cell_tit{font-weight: 600;}
#esg_subPage_modal .contro_item span {margin-top: 15px;}
#esg_subPage_modal .contro_item .small{font-size: 14px; display: block;}


#esg_subPage_modal #vision_sec_top .secText span {font-size: 18px; font-weight: 400;}
#esg_subPage_modal .sub_img_wrap {display: flex; flex-direction: row; justify-content: center; gap: 15px; margin-top: 30px;}
#esg_subPage_modal .sub_img_wrap .sub_img_cell {width: 100%; display: flex; flex-direction: column;}

/*230626 추가*/
#esg_subPage_modal .table_inner table {font-size: 15px;}
#esg_subPage_modal .table_inner table th {padding: 25px 5px;}
#esg_subPage_modal .table_inner table td {padding: 25px 5px;}

/*230905 추가*/
#esg_subPage_modal #media_vod_section { margin-top: 40px; }
#esg_subPage_modal #esg_video { text-align: center;margin-top:0; }
#esg_subPage_modal #esg_video .text { font-size: 40px; font-weight: 300; line-height: 1.5; }
#esg_subPage_modal #esg_video .video a.play { position: relative; display: inline-flex; }
#esg_subPage_modal #esg_video .video a.play:before { content: ''; width: 136px; height: 136px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background: url(../images/hyrex/hyrex_video_play.png) center no-repeat; background-size: contain; }


#esg_social_section > .inner { padding: 80px 0; }
#esg_social_section .secObj { margin-left: 90px; }

#esg_social_section .secTitle { font-size: 34px; color: #222; }
#esg_social_section .secText { font-size: 20px; }
#esg_social_section .secText + .secText { margin-top: 60px; }
#esg_social_section .secText ul { max-width: 660px; }


.report_links { width: 90%; max-width: 1460px; margin: 0 auto; margin-top: 50px; margin-bottom: 60px; border: 3px solid #dadada; padding: 20px; box-sizing: border-box; }
.report_links ul { display: flex; }
.report_links ul li { width: 100%; padding: 20px; box-sizing: border-box; }
.report_links ul li + li { border-left: 1px solid #dadada; }
.report_links ul li a { display: flex; align-items: center; }
.report_links ul li .icon { width: 70px; padding-right: 10px; flex: none; box-sizing: border-box; }
.report_links ul li .tit { font-size: 18px; font-weight: bold; color: #222; }
.report_links ul li .txt { font-size: 15px; color: #888; }


#governance_1_sect_01 { overflow: visible; }
#governance_1_sect_01 > .inner { display: flex; align-items: center; justify-content: center; align-items: stretch; padding-top: 100px; padding-bottom: 70px; }
#governance_1_sect_01 .photo { width: 440px; padding-right: 100px; position: relative; box-sizing: border-box; }
#governance_1_sect_01 .photo img { position: absolute; left: 0; top: -35px; }
#governance_1_sect_01 .cont { padding-left: 20px; }
#governance_1_sect_01 .cont .title { font-size: 28px; font-weight: 500; color: #183761; position: relative; }
#governance_1_sect_01 .cont .title:before { content: ''; width: 13px; height: 13px; background-color: #005c9c; position: absolute; top: 0; left: -20px; border-radius: 50%; }
#governance_1_sect_01 .cont .title span { font-weight: 600;  color: #005c9c; }
#governance_1_sect_01 .cont .sign { margin-top: 60px; font-size: 16px; color: #183761; }
#governance_1_sect_01 .cont .sign b { margin-left: 10px; font-size: 20px; }


#governance_1_sect_02 > .inner { padding: 120px 0; align-items: flex-start; }
#governance_1_sect_02 .secText { padding-right: 60px; }

#governance_1_sect_03 .swiper-slide { background-color: #fff; }
#governance_1_sect_03 .img img { width: 100%; display: block; }
#governance_1_sect_03 .cont { padding: 30px 10px; border-bottom: 1px solid #b7b7b7; }
#governance_1_sect_03 .cont .tit { font-size: 20px; margin-bottom: 12px; line-height: 1; }
#governance_1_sect_03 .cont .txt { font-size: 16px; color: #666; }

#governance_1_sect_03 .swiper-arrow > * { position: absolute; top: 50%; z-index: 5; margin-top: -80px; width: 60px; height: 60px; background-color: rgba(0, 0, 0, .5); font-size: 0; border: 0; cursor: pointer; background-position: center; background-repeat: no-repeat; }
#governance_1_sect_03 .swiper-prev { left: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='13px' height='25px'%3E%3Cpath fill-rule='evenodd' fill='rgb(255, 255, 255)' d='M12.998,24.025 L12.047,24.998 L0.002,12.672 L0.170,12.500 L0.002,12.328 L12.047,0.002 L12.998,0.975 L1.735,12.500 L12.998,24.025 Z'/%3E%3C/svg%3E"); }
#governance_1_sect_03 .swiper-next { right: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='13px' height='25px'%3E%3Cpath fill-rule='evenodd' fill='rgb(255, 255, 255)' d='M12.998,12.672 L0.953,24.998 L0.002,24.025 L11.265,12.500 L0.002,0.975 L0.953,0.002 L12.998,12.328 L12.829,12.500 L12.998,12.672 Z'/%3E%3C/svg%3E"); }

#governance_1_sect_04 .list { display: flex; }
#governance_1_sect_04 .list > li { width: 100%; }
#governance_1_sect_04 .list > li + li { margin-left: 50px; }
#governance_1_sect_04 .list > li .img img { width: 100%; display: block; }
#governance_1_sect_04 .list > li .txt { font-size: 20px; margin-top: 20px; }

#governance_1_sect_05 .row { flex-wrap: nowrap; }
#governance_1_sect_05 .row > .col_6 { background-color: #333; color: #fff; width: 100%; padding: 80px 60px; border-top-left-radius: 25px; border-bottom-right-radius: 25px; background-size: cover; background-repeat: no-repeat; background-position: center; display: flex; flex-direction: column; justify-content: space-between; }
#governance_1_sect_05 .row > .col_6 + .col_6 { margin-left: 20px; }
#governance_1_sect_05 .title { font-size: 35px; font-weight: 600; line-height: 1; }
#governance_1_sect_05 .text { font-size: 16px; margin-top: 30px; }
#governance_1_sect_05 ul { margin-top: 40px; }
#governance_1_sect_05 ul li + li { margin-top: 10px; }
#governance_1_sect_05 ul li a { font-size: 20px; color: #fff; }
#governance_1_sect_05 .more a { display: inline-flex; align-items: center; font-size: 18px; font-weight: 500; color: #fff; }
#governance_1_sect_05 .more a:after { content: ''; width: 30px; height: 30px; margin-left: 10px; margin-top: -3px; box-sizing: border-box; border-radius: 50%; border: 1px solid #aaa; background-repeat: no-repeat; background-position: center; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='10px' height='10px'%3E%3Cpath fill-rule='evenodd' fill='rgb(255, 255, 255)' d='M10.000,6.000 L6.000,6.000 L6.000,9.999 L4.000,9.999 L4.000,6.000 L-0.000,6.000 L-0.000,4.000 L4.000,4.000 L4.000,-0.001 L6.000,-0.001 L6.000,4.000 L10.000,4.000 L10.000,6.000 Z'/%3E%3C/svg%3E"); }
#governance_1_sect_05 .more a:hover:after { background-color: #fff; border-color: #222; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='10px' height='10px'%3E%3Cpath fill-rule='evenodd' fill='rgb(0, 0, 0)' d='M10.000,6.000 L6.000,6.000 L6.000,9.999 L4.000,9.999 L4.000,6.000 L-0.000,6.000 L-0.000,4.000 L4.000,4.000 L4.000,-0.001 L6.000,-0.001 L6.000,4.000 L10.000,4.000 L10.000,6.000 Z'/%3E%3C/svg%3E"); } 



.esg_social_2_4_grid_list { display: flex; flex-wrap: wrap; margin-left: -10px; }
.esg_social_2_4_grid_list > li { width: calc( (100% - 30px) /3); height: 60px; display: flex; align-items: center; justify-content: center; background-color: #f2f7fb; font-size: 16px; font-weight: 500; color: #222; margin-left: 10px; margin-bottom: 10px; }


.esg_social_2_4_reception { margin-top: 30px; margin-bottom: 10px; border: 1px solid #b7b7b7; padding: 10px 0; display: flex; align-items: center; box-shadow: 2px 3px 5px 0px rgba(0, 0, 0, 0.12); }
.esg_social_2_4_reception .tit { width: 195px; flex: none; text-align: center; padding: 40px; font-size: 20px; font-weight: 600; color: #222; box-sizing: border-box; }
.esg_social_2_4_reception .cont { width: 100%; padding: 40px; box-sizing: border-box; border-left: 1px solid #ebebeb; }
.esg_social_2_4_reception .cont li { display: flex; }
.esg_social_2_4_reception .cont li + li { margin-top: 5px; }
.esg_social_2_4_reception .cont li .h { width: 90px; flex: none; font-size: 16px; }
.esg_social_2_4_reception .cont li .t { font-size: 16px; width: 100%; }
.esg_social_2_4_reception .cont li .t a { color: #005c9c; border-bottom: 1px solid #005c9c; }


.ethics_item_list { display: flex; flex-wrap: wrap; margin-top: -20px; margin-left: -10px; }
.ethics_item_list .item { width: calc( (100% - 30px) /3); margin-top: 20px; margin-left: 10px; }
.ethics_item_list .item img { display: block; }
.ethics_item_list .item .info_wrap { margin-top: 10px; }
.ethics_item_list .item .info_date { font-size: 16px; }



#approach_kv { height: 100vh; color: #fff; }
#approach_kv .tit .t1 { font-size: 22px; font-weight: 500; line-height: 1; margin-bottom: 30px; }
#approach_kv .tit .t2 { font-size: 58px; font-weight: 600; line-height: 1.25; margin-top: 5px; max-width: 830px; }
#approach_kv .viewMore { position: absolute; bottom: 40px; left: 50%; z-index: 1; display: inline-flex; flex-direction: column; align-items: center; transform: translateX(-50%); font-size: 20px; font-weight: 300; }
#approach_kv .viewMore:after { content: ''; width: 14px; height: 14px; box-sizing: border-box; border-left: 3px solid #fff; border-bottom: 3px solid #fff; transform: rotate(-45deg); margin-top: 5px; }
#approach_kv .bg .img { height: 120%; transition: height 7s; }
#approach_kv.is-show .bg .img { height: 100%; }



#citizen_report_top { background-color: #f1f3f7; }
#citizen_report_top .row { flex-direction: row-reverse; align-items: center; }
#citizen_report_top .cont { padding-left: 70px; }
#citizen_report_top .download { padding-right: 40px; }
#citizen_report_top .secTitle { color: #1e3045; font-size: 30px; font-weight: 600; }
#citizen_report_top .secText { color: #464f61; font-size: 18px; max-width: 565px; line-height: 1.77; }
#citizen_report_top .img img { width: 100%; display: block; }
#citizen_report_top .btn_list { margin: -2px; margin-top: 50px; display: flex; align-items: center; justify-content: center; }
#citizen_report_top .btn_list li { padding: 2px; }
#citizen_report_top .btn_list li .btn { width: 145px; height: 40px; line-height: 40px; border-radius: 0; justify-content: space-between; border-color: #222;  color: #222; }
#citizen_report_top .btn_list li .btn:after { content: ''; width: 25px; height: 25px; margin-left: 5px; background: url(../images/ico/ico_dl.png) center no-repeat;  }
#citizen_report_top .btn_list li .btn:hover { background-color: #222; color: #fff; }
#citizen_report_top .btn_list li .btn:hover:after { background: url(../images/ico/ico_dl_wh.png) center no-repeat; }

/* 230517 책임광물보고서 상단영역 스타일 추가 */
/* #citizen_report_top.responsible_report .cont {margin-top: 30px;} */

#citizen_report_top.responsible_report .secTitle {margin-top: 3vw;}
#citizen_report_top.responsible_report .secTitle.h2 {margin-bottom: 10px;}
#citizen_report_top.responsible_report .btn_list {justify-content: flex-start; margin-top: 0px;}
/* #citizen_report_top.responsible_report .row {align-items: flex-start;} */

#citizen_report_list {  }
#citizen_report_list > .inner { max-width: 1270px; }
#citizen_report_list ul.list { display: flex; flex-wrap: wrap; margin-right: -90px; margin-bottom: -70px; }
#citizen_report_list ul.list li { width: calc( (100% - 360px) / 4); margin-right: 90px; margin-bottom: 70px; border-top: 1px solid #7f7f7f; padding-top: 20px; }
#citizen_report_list ul.list li .title { font-size: 18px; color: #222; font-weight: 500; margin-bottom: 20px; }
#citizen_report_list ul.list li .img { position: relative; }
#citizen_report_list ul.list li .img:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border: 1px solid #d9d9d9; }
#citizen_report_list ul.list li .img img { display: block; width: 100%; }
#citizen_report_list dl { display: flex; flex-wrap: wrap; margin-top: 30px; height: 85px; }
#citizen_report_list dl dd { width: calc( (100% - 6px) / 2); margin-right: 3px; margin-bottom: 3px; }
#citizen_report_list dl dd .btn { width: 100%; height: 40px; line-height: 40px; border-radius: 0; justify-content: space-between; border-color: #d6d6d6;  color: #222; background-color: #eaeaea; font-size: 14px; }
#citizen_report_list dl dd .btn:after { content: ''; width: 25px; height: 25px; margin-left: 5px; background: url(../images/ico/ico_dl.png) center no-repeat; }
#citizen_report_list dl dd .btn:hover { background-color: #099de8; color: #fff; border-color: #099de8; }
#citizen_report_list dl dd .btn:hover:after { background: url(../images/ico/ico_dl_wh.png) center no-repeat; }




#initiative_global_list > .inner { padding-bottom: 180px; } 
#initiative_global_list ul li { display: flex; align-items: center; }
#initiative_global_list ul li + li { margin-top: 50px; }
#initiative_global_list ul li .img { width: 580px; flex: none; padding-right: 77px; box-sizing: border-box; }
#initiative_global_list ul li .img img { display: block; }
#initiative_global_list ul li .cont { width: 100%; }
#initiative_global_list ul li .cont .tit { font-size: 20px; font-weight: 500; }
#initiative_global_list ul li .cont .tit small { font-size: 14px; color: #6f8d99; }
#initiative_global_list ul li .cont .txt { font-size: 16px; font-weight: 300; margin-top: 20px; }
#initiative_global_list ul li .cont .txt .link { color: #0000ff; border-bottom: 1px solid #0000ff; margin-right: 30px; position: relative; }
#initiative_global_list ul li .cont .txt .link:after { content: ''; width: 17px; height: 17px; margin-left: 5px; background: url(../images/ico/ico_link_blu.png) center no-repeat; background-size: contain; position: absolute; left: 100%; top: 0; }
#initiative_global_list ul li .cont .em { margin-top: 30px; font-size: 14px; color: #7f889b;  display: flex; }
#initiative_global_list ul li .cont .em > * + * { margin-left: 15px; }
#initiative_global_list ul li .cont .em .btn { font-size: 14px; background-color: #e9f4fa; border-color: #e9f4fa; color: #7f889b; border-radius: 30px; }
#initiative_global_list ul li .cont .em .btn:after { content: ''; width: 15px; height: 15px; background: url(../images/ico/ico_outlink.png) center no-repeat; background-size: contain; margin-left: 10px; }


#initiative_references { margin-bottom: 180px; }
#initiative_references > .inner { padding: 40px 12px; border-top: 2px solid #666; border-bottom: 1px solid #cfcfcf; }
#initiative_references .secTitle { font-size: 30px; font-weight: 600; color: #222; }
#initiative_references .btns { display: flex; flex-wrap: wrap; }
#initiative_references .btns > li { margin-right: 30px; margin-bottom: 20px; }
#initiative_references .btns > li .btn { background-color: #fff; color: #333; border-color: #ced8e0; border-radius: 60px; padding: 0 30px; }
#initiative_references .btns > li .btn:after { content: ''; width: 17px; height: 17px; background: url(../images/ico/ico_outlink.png) center no-repeat; margin-left: 10px; }
#initiative_references .btns > li .btn:hover { background-color: #e8ecef; }


.initiative_awards_list > .inner { width: 100%; }
.initiative_awards_list .kv_title { display: flex; align-items: center; justify-content: center; width: 100%; height: 430px; background-color: #666; color: #fff; font-size: 45px; font-weight: 600; text-align: center; padding-bottom: 150px; box-sizing: border-box; background-size: cover; background-repeat: no-repeat; background-position: center; }
.initiative_awards_list .awards_list { width: 90%; max-width: 1250px; background-color: #fff; padding: 30px 60px; margin: 0 auto; margin-top: -150px; box-sizing: border-box; }
.initiative_awards_list .awards_list ul { padding: 40px 20px; border-bottom: 1px solid #d3d3d3; }
.initiative_awards_list .awards_list ul li { display: flex; }
.initiative_awards_list .awards_list ul li + li { margin-top: 30px; }
.initiative_awards_list .awards_list ul li .date { width: 150px; flex: none; font-size: 20px; font-weight: 600; color: #05507d; }
.initiative_awards_list .awards_list ul li .text { width: 100%; font-size: 20px; font-weight: 300; color: #222; }



.reservation_step { margin-bottom: 90px; }
.reservation_step ul { display: flex; align-items: center; justify-content: center; }
.reservation_step ul > li { padding: 0 37px; font-size: 36px; font-weight: 600; color: #989494; line-height: 1; position: relative; }
.reservation_step ul > li + li:before { content: ''; position: absolute; left: -7.5px; top: 50%; transform: translateY(-50%); width: 15px; height: 24px; background-size: contain; background-repeat: no-repeat; background-position: center; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='15px' height='26px'%3E%3Cpath fill-rule='evenodd' fill='rgb(219, 219, 219)' d='M1.772,25.996 L1.331,25.568 L0.890,25.996 L0.096,25.226 L12.488,13.213 L0.004,0.784 L0.787,0.004 L1.228,0.443 L1.669,0.004 L14.163,12.444 L14.202,12.407 L14.995,13.176 L1.772,25.996 Z'/%3E%3C/svg%3E"); }
.reservation_step ul > li.active { color: #222; }
.reservation_step ul > li.active:after { content: ''; position: absolute; left: 50%; top: -30px; margin-left: -5px; width: 10px; height: 10px; border-radius: 50%; background-color: #099de8; }

.reservation_type .select { border-top: 2px solid #222; border-bottom: 1px solid #b4b4b4; padding: 40px 0; display: flex; align-items: center; justify-content: space-between; margin-bottom: 50px; }
.reservation_type .select > dl { display: flex; }
.reservation_type .select > dl > dt { width: 160px; font-size: 20px; color: #8e8e8e; }
.reservation_type .select > div .btn { width: 220px; padding: 0 34px; border-radius: 60px; justify-content: space-between; }
.reservation_type .select > div .btn:after { content: ''; width: 10px; height: 10px; border-right: 1px solid #fff; border-bottom: 1px solid #fff; transform: rotate(-45deg); }

.reservation_type .guide ul { display: flex; }
.reservation_type .guide ul > li { background-color: #f7f7f7; width: calc((100% - 30px)/2); padding: 60px; padding-top: 40px; box-sizing: border-box; }
.reservation_type .guide ul > li + li { margin-left: 30px; }
.reservation_type .guide ul > li .head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; font-size: 22px; font-weight: 600; }
.reservation_type .guide ul > li .cont { font-size: 16px; font-weight: 300; }
.reservation_type .guide ul > li .cont .em { color: #005c9c; }
.reservation_type .guide ul > li .cont dl > dd { padding-left: 20px; text-indent: -19px; }
.reservation_type .guide ul > li .cont dl > dd:before { content: '·'; font-weight: 600; margin-right: 15px; }

.reservation_calendar .calendar { margin-top: 50px; }
.reservation_calendar .calendar .cal-top { width: 290px; margin: 0 auto; text-align: center; position: relative; }
.reservation_calendar .calendar .cal-top .number { color: #333; font-size: 30px; font-weight: 600; line-height: 40px; }
.reservation_calendar .calendar .cal-top > a { width: 40px; height: 40px; display: block; position: absolute; bottom: 0; }
.reservation_calendar .calendar .cal-top a.prev { background: url(../images/ico/cal_prev.png) no-repeat left top; left: 0; }
.reservation_calendar .calendar .cal-top a.next { background: url(../images/ico/cal_next.png) no-repeat left top; right: 0; }
.reservation_calendar .calendar table { border-top: 2px solid #333; width: 100%; margin-top: 30px; }
.reservation_calendar .calendar table th { line-height: 60px; color: #333; background: none; border: none; padding: 0; border-bottom: 1px solid #e5e5e5;  }
.reservation_calendar .calendar table th:first-child { color: #bc1d1d; }
.reservation_calendar .calendar table th:last-child { color: #005891; }
.reservation_calendar .calendar table td { background: #f5f5f5; vertical-align: top; border-right: 1px solid #e5e5e5; border-left: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; padding: 0; height: 120px; }
.reservation_calendar .calendar table td:first-child p { color: #bc1d1d; }
.reservation_calendar .calendar table td:last-child p { color: #005891; }
.reservation_calendar .calendar table td p { text-align: right; line-height: 40px; padding-right: 15px; }
.reservation_calendar .calendar table td .done { display: block; line-height: 40px; width: 100%; max-width: 120px; border: 1px solid #6b5d50; margin: 10px auto; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: center; border-radius: 20px; }
.reservation_calendar .calendar table td.avail { background: #fff; }
.reservation_calendar .calendar table td.avail a { display: block; line-height: 40px; width: 100%; max-width: 120px; color: #fff; margin: 10px auto; background: #005891; text-align: center; border-radius: 20px; }

.reservation_info_complete .gray_box { background-color: #f7f7f7; padding: 60px; font-size: 2em; }







/*#carbon_wrap .sub-page-section > .inner { padding: 120px 0; max-width: 1250px; }

#carbon_kv { height: 100vh; color: #fff; justify-content: flex-end; }
#carbon_kv > .inner { padding-bottom: 200px !important; }
#carbon_kv .tit  { font-size: 20px; letter-spacing: 0.5em; border-bottom: 1px solid #fff; display: inline-block; }
#carbon_kv .txt { margin-top: 30px; font-size: 60px; font-weight: 600; line-height: 1.25; }
#carbon_kv .viewMore { position: absolute; bottom: 40px; left: 50%; z-index: 1; display: inline-flex; flex-direction: column; align-items: center; transform: translateX(-50%); font-size: 20px; font-weight: 300; }
#carbon_kv .viewMore:after { content: ''; width: 14px; height: 14px; box-sizing: border-box; border-left: 3px solid #fff; border-bottom: 3px solid #fff; transform: rotate(-45deg); margin-top: 5px; }
#carbon_kv .bg .img { height: 120%; transition: height 7s; }
#carbon_kv.is-show .bg .img { height: 100%; }

#carbon_about .box { background-color: #6f4d3d; background-image: url(../images/climate/carbon_about_boxbg.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; box-sizing: border-box; padding: 90px; min-height: 1000px; max-width: 975px; margin: 0 auto; color: #fff; text-align: center; }
#carbon_about .box .tit { font-size: 40px; font-weight: 600; margin-top: 10px; }
#carbon_about .box .txt { font-size: 20px; margin: 0 auto; margin-top: 60px; max-width: 560px; }


#carbon_accelerate > .inner { padding-bottom: 190px !important; }
#carbon_accelerate .title { font-size: 45px; font-weight: 600; color: #fff; text-align: center; margin-bottom: 100px; }
#carbon_accelerate .cont { margin-right: 360px; }
#carbon_accelerate .cont .tit { border-bottom: 1px solid rgba(255, 255, 255, .3); padding-bottom: 30px; margin-bottom: 40px; }
#carbon_accelerate .cont .tit .t1 { font-size: 25px; color: #fff; }
#carbon_accelerate .cont .tit .t2 { font-size: 16px; color: #fff; font-weight: 300; }
#carbon_accelerate .cont .txt { padding-left: 105px; position: relative; }
#carbon_accelerate .cont .txt:before { content: ''; position: absolute; top: 0; left: 0; height: 131px; width: 99px; background-image: url(../images/climate/carbon_accelerate_arr.png); background-repeat: no-repeat; background-size: contain; background-position: center; }
#carbon_accelerate .cont .txt li { display: flex; align-items: center; margin-bottom: 20px; }
#carbon_accelerate .cont .txt li .h { width: 300px; flex: none; }
#carbon_accelerate .cont .txt li .t { font-size: 16px; font-weight: 300; color: #fff; }



#carbon_risk {  }
#carbon_risk .secTitle { font-size: 35px; font-weight: 600; color: #222; border-bottom: 1px solid #c9c9c9; padding-bottom: 20px; }
#carbon_risk ul li { display: flex; align-items: center; }
#carbon_risk ul li:nth-child(odd) { flex-direction: row-reverse;  }
#carbon_risk ul li + li { margin-top: 50px; }
#carbon_risk ul li > * { width: 50%; }
#carbon_risk ul li .dec { padding: 30px; }
#carbon_risk ul li .dec .tit { font-size: 20px; font-weight: 600; color: #222; margin-bottom: 20px; }
#carbon_risk ul li .dec .txt { font-size: 16px; color: #666; }
#carbon_risk ul li .img img { display: block; margin-left: auto; }
#carbon_risk ul li:nth-child(odd) .img img { margin-left: 0; margin-right: auto; }
#carbon_risk ul li:nth-child(4) .dec { padding: 0; width: 100%; }
#carbon_risk .table { display: flex; }
#carbon_risk .table table { border-top: 1px solid #626262; border-bottom: 1px solid #a3a3a3; position: relative; }
#carbon_risk .table table thead th { text-align: center; height: 75px; background-color: #f7f7f7; vertical-align: middle; border-left: 1px solid #e1e1e1; border-bottom: 1px solid #e1e1e1; font-size: 20px; color: #666; }
#carbon_risk .table table thead th:first-child { border-left: 0; }

#carbon_risk .table table tbody td { padding: 30px; border-bottom: 1px solid #e1e1e1; border-left: 1px solid #e1e1e1; vertical-align: top; font-size: 14px; color: #666; height: 180px; box-sizing: border-box; }
#carbon_risk .table table tbody td:first-child { border-left: 0; }


#carbon_risk .table table.style2 { margin-left: 90px; }
#carbon_risk .table table.style2:before { content: ''; width: 46px; height: 106px; position: absolute; top: 50%; right: 100%; background: url(../images/climate/carbon_risk_arr.png) center no-repeat; margin-top: -53px; margin-right: 15px; }
#carbon_risk .table table.style2 thead th { background-color: #e8eff9; border-color: #cfdae6; }
#carbon_risk .table table.style2 tbody td { background-color: #f3f8fe; border-color: #cfdae6; }


#carbon_effort {  }
#carbon_effort > .bg { height: 765px; }
#carbon_effort .secTitle { text-align: center; font-size: 45px; font-weight: 600; color: #222; margin-bottom: 40px; }
#carbon_effort .carbon_effort_mainPoint .subTitle {  text-align: center; font-size: 35px; font-weight: 300; color: #222; margin-bottom: 50px; }
#carbon_effort .carbon_effort_mainPoint ul { display: flex; margin-left: -55px; }
#carbon_effort .carbon_effort_mainPoint ul li { width: 100%; height: 550px; margin-left: 55px; background-color: #dedede; position: relative; overflow: hidden; }
#carbon_effort .carbon_effort_mainPoint ul li .bg { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; }
#carbon_effort .carbon_effort_mainPoint ul li .bg:before { content: ''; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: rgba(0, 0, 0, .8); opacity: 0; z-index: 1; 
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}
#carbon_effort .carbon_effort_mainPoint ul li .bg .img { width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; 
    -webkit-transition: transform 0.3s ease;
    -moz-transition: transform 0.3s ease;
    -o-transition: transform 0.3s ease;
    transition: transform 0.3s ease;
}

#carbon_effort .carbon_effort_mainPoint ul li .cont { padding: 60px 30px; display: flex; flex-direction: column; justify-content: flex-end; height: 100%; box-sizing: border-box; position: relative; z-index: 2; }
#carbon_effort .carbon_effort_mainPoint ul li .cont:after { content: ''; width: 100%; height: 100%; position: absolute; bottom: 0; left: 0; z-index: 0; background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 50%); 
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}
#carbon_effort .carbon_effort_mainPoint ul li .cont > * { position: relative; z-index: 1; }
#carbon_effort .carbon_effort_mainPoint ul li .cont .tit { font-size: 45px; font-weight: 600; color: #fff; line-height: 1; }
#carbon_effort .carbon_effort_mainPoint ul li .cont .tit span { color: #27de03; }
#carbon_effort .carbon_effort_mainPoint ul li .cont .txt { font-size: 16px; color: #fff; margin-top: 20px; height: 110px; overflow: hidden; }
#carbon_effort .carbon_effort_mainPoint ul li .cont .more { margin-top: 20px; font-size: 16px; color: #fff; border-bottom: 1px solid #fff; display: inline-block; }
#carbon_effort .carbon_effort_mainPoint ul li .cont .dec { overflow: hidden; height: 0; 
    -webkit-transition: height 0.3s ease;
    -moz-transition: height 0.3s ease;
    -o-transition: height 0.3s ease;
    transition: height 0.3s ease;
}
#carbon_effort .carbon_effort_mainPoint ul li .inner:hover .bg:before,
#carbon_effort .carbon_effort_mainPoint ul li .inner:focus .bg:before { opacity: 1; }
#carbon_effort .carbon_effort_mainPoint ul li .inner:hover .bg .img,
#carbon_effort .carbon_effort_mainPoint ul li .inner:focus .bg .img { transform: scale(1.1); }
#carbon_effort .carbon_effort_mainPoint ul li .inner:hover .cont:after,
#carbon_effort .carbon_effort_mainPoint ul li .inner:focus .cont:after { opacity: 0; }
#carbon_effort .carbon_effort_mainPoint ul li .inner:hover .cont .dec,
#carbon_effort .carbon_effort_mainPoint ul li .inner:focus .cont .dec { height: 180px; }
#carbon_effort .carbon_effort_cont { margin-top: 100px; }
#carbon_effort .carbon_effort_cont .subTitle { font-size: 35px; font-weight: 600; }
#carbon_effort .carbon_effort_cont .secText { font-size: 16px; color: #666; }
#carbon_effort .carbon_effort_vod { margin-top: 120px; }
#carbon_effort .carbon_effort_vod .subTitle { font-size: 40px; font-weight: 300; text-align: center; line-height: 1.35; margin-bottom: 30px; }
#carbon_effort .carbon_effort_vod .video a { position: relative; display: inline-flex; }
#carbon_effort .carbon_effort_vod .video a:before { content: ''; width: 100px; height: 100px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background: url(../images/hyrex/hyrex_video_play.png) center no-repeat; background-size: contain; }


#carbon_guideline > .inner { display: flex; align-items: center; justify-content: space-between; }
#carbon_guideline > .inner > * { width: 100%; }
#carbon_guideline .secTitle { font-size: 35px; color: #222; }
#carbon_guideline .secText { font-size: 16px; color: #666; }
#carbon_guideline .guideBook { flex: none; width: 620px; padding-left: 150px; box-sizing: border-box; }
#carbon_guideline .download { margin-top: 30px; }
#carbon_guideline .download .btn { width: 200px; border-radius: 0; height: 50px; justify-content: space-between; padding: 0 20px; }
#carbon_guideline .download .btn:after { content: ''; width: 15px; height: 17px; background: url(../images/ico/ico_dl_wh.png) center no-repeat; }


#carbon_news .secTitle { font-size: 60px; color: #222; }
#carbon_news .more { position: absolute; top: 150px; right: 0; }
#carbon_news .more a { font-size: 20px; color: #005c9c; font-weight: 500; display: inline-flex; align-items: center; line-height: 1; }
#carbon_news .more a:after { content: ''; width: 30px; height: 12px; margin-left: 12px; background: url(../images/ico/ico_arrow.png) center no-repeat; }
#carbon_news ul { display: flex; margin-left: -50px; }
#carbon_news ul .item { margin-left: 50px; width: 100%; }
#carbon_news ul .item > .inner { border-top: 2px solid #828282; padding: 30px 0; display: flex; flex-direction: column; }
#carbon_news ul .item .tit { font-size: 25px; font-weight: 600; color: #222; line-height: 1.45; margin-bottom: 40px; height: 73px; overflow: hidden; }
#carbon_news ul .item .date { font-size: 16px; color: #999; }
#carbon_news ul .item .img { margin-top: 20px; overflow: hidden; }
#carbon_news ul .item .img > div { width: 100%; height: 0; padding-top: 70%; background-size: cover; background-repeat: no-repeat; background-position: center; 
    -webkit-transition: transform 0.3s ease;
    -moz-transition: transform 0.3s ease;
    -o-transition: transform 0.3s ease;
    transition: transform 0.3s ease;
}


#carbon_news ul .item > .inner:hover .img > div,
#carbon_news ul .item > .inner:focus .img > div { transform: scale(1.1); }*/




[id*='carbon_'] > .inner { padding: 120px 0; max-width: 1300px; }

#carbon_kv { height: 100vh; color: #fff; justify-content: center; position: relative; }
#carbon_kv > .inner { position: static; }
#carbon_kv .cont { width: 100%; }
#carbon_kv .tit  { font-size: 23px; border-bottom: 1px solid #fff; display: inline-block; }
#carbon_kv .txt { margin-top: 30px; font-size: 65px; font-weight: 600; line-height: 1.25; }
#carbon_kv .visual { position: absolute; top: 0; left: 50%; width: 50%; height: 100%; background-color: #eaeaea; overflow: hidden; }
#carbon_kv .visual .img { width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; }
#carbon_kv .visual video { min-width: 100%; min-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
#carbon_kv .bg .img { height: 100%; }
#carbon_kv .bg:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .25); z-index: 1; }




#carbon_about > .inner { display: flex; flex-direction: row-reverse; }
#carbon_about > .inner > * { width: 100%; }
#carbon_about .tit { font-size: 60px; font-weight: 600; color: #000; margin-bottom: 50px; line-height: 1.25; }
#carbon_about .txt { font-size: 24px; line-height: 1.875; color: #000; font-weight: 300; }

#carbon_accelerate { background-color: #1fa953; color: #fff; }
#carbon_accelerate .title { font-size: 60px; line-height: 1; font-weight: 600; margin-bottom: 60px; }
#carbon_accelerate .txt1 { font-size: 30px; line-height: 1.875; font-weight: 300; margin-bottom: 110px;}
#carbon_accelerate .tit { margin: 150px 0 80px;}
#carbon_accelerate .tit .t1 { font-size: 30px; line-height: 1; font-weight: 600; margin-bottom: 20px; position: relative; }
#carbon_accelerate .tit .t1:after { content: ''; position: absolute; top: 50%; left: 0; width: 100%; height: 1px; background-color: #fff; z-index: -1; }
#carbon_accelerate .tit .t1 span { display: inline-block; background-color: #1fa953; padding-right: 35px; }
#carbon_accelerate .tit .t2 { margin-bottom: 60px; font-size: 20px; line-height: 1.875; font-weight: 300; }
#carbon_accelerate .cont { display: flex; flex-direction: column;}
#carbon_accelerate .cont > * { width: 100%; }
/*#carbon_accelerate .cont .num .txt3 {text-align: left; font-size: 24px; font-weight: 600;} */
#carbon_accelerate .cont .num { display: flex; gap: 50px; margin-bottom: 70px;}
/* #carbon_accelerate .cont .num > div { display: inline-block; text-align: center; }
#carbon_accelerate .cont .num dl { display: flex; margin-bottom: 20px; }
#carbon_accelerate .cont .num dl dd { font-size: 30px; font-weight: 600; line-height: 1; }
#carbon_accelerate .cont .num dl dd + dd { margin-left: 45px; }
#carbon_accelerate .cont .num dl dd span { font-size: 95px; }
#carbon_accelerate .cont .num dl dd small { font-size: 50px; } */
#carbon_accelerate .cont .txt2 { font-size: 26px; line-height: 1.875; font-weight: 300; max-width: 635px; }
#carbon_accelerate .cont .txt2 span {margin-top: 20px; font-size: 19px; display:inline-block;}

#carbon_accelerate .secText { display: inline-block; font-size: 30px; color: #222; position: relative; }
#carbon_accelerate .secText:before,
#carbon_accelerate .secText:after { content: ''; width: 45px; height: 36px; position: absolute; background-size: contain; background-position: center; background-repeat: no-repeat; }
#carbon_accelerate .secText:before { background-image: url(../images/company/vision_q_left.png); top: -10px; left: -65px; }
#carbon_accelerate .secText:after { background-image: url(../images/company/vision_q_right.png); top: 0; right: -65px; }
#carbon_accelerate .secText span { color: #fff; font-weight: 600;}
/* 기존스타일 주석
#carbon_accelerate { background-color: #1fa953; color: #fff; }
#carbon_accelerate .title { font-size: 60px; line-height: 1; font-weight: 600; margin-bottom: 70px; }
#carbon_accelerate .tit { margin-bottom: 100px; }
#carbon_accelerate .tit .t1 { font-size: 30px; line-height: 1; font-weight: 600; margin-bottom: 20px; position: relative; }
#carbon_accelerate .tit .t1:after { content: ''; position: absolute; top: 50%; left: 0; width: 100%; height: 1px; background-color: #fff; z-index: -1; }
#carbon_accelerate .tit .t1 span { display: inline-block; background-color: #1fa953; padding-right: 35px; }
#carbon_accelerate .tit .t2 { font-size: 20px; line-height: 1; font-weight: 300; }
#carbon_accelerate .cont { display: flex; }
#carbon_accelerate .cont > * { width: 100%; }
#carbon_accelerate .cont .num > div { display: inline-block; text-align: center; }
#carbon_accelerate .cont .num dl { display: flex; margin-bottom: 20px; }
#carbon_accelerate .cont .num dl dd { font-size: 30px; font-weight: 600; line-height: 1; }
#carbon_accelerate .cont .num dl dd + dd { margin-left: 45px; }
#carbon_accelerate .cont .num dl dd span { font-size: 95px; }
#carbon_accelerate .cont .num dl dd small { font-size: 50px; }
#carbon_accelerate .cont .txt { font-size: 24px; line-height: 1.875; font-weight: 300; max-width: 580px; }*/


#carbon_risk .secTitle { font-size: 60px; font-weight: 600; color: #000; margin-bottom: 100px; }
#carbon_risk .secTitle span { color: #1fa953; }
#carbon_risk .risk_list > li { display: flex; align-items: center; }
#carbon_risk .risk_list > li:nth-child(odd) { flex-direction: row-reverse;  }
#carbon_risk .risk_list > li + li { margin-top: 100px; }
#carbon_risk .risk_list > li > * { width: 50%; box-sizing: border-box; }
#carbon_risk .risk_list > li .dec { padding: 30px 70px; }
#carbon_risk .risk_list > li .dec .tit { font-size: 30px; font-weight: 600; color: #000; margin-bottom: 40px; }
#carbon_risk .risk_list > li .dec .txt { font-size: 20px; font-weight: 300; color: #000; }
#carbon_risk .risk_list > li .img img { display: block; margin-left: auto; }
#carbon_risk .risk_list > li:nth-child(odd) .img img { margin-left: 0; margin-right: auto; }
#carbon_risk .risk_list > li:nth-child(4) .dec { padding: 0; width: 100%; }

#carbon_risk2 { background-color: #f3f7f4; }
#carbon_risk2 .risk_list > li .dec .tit { font-size: 30px; font-weight: 600; color: #000; margin-bottom: 40px; }
#carbon_risk2 .table .head { margin-bottom: 30px; }
#carbon_risk2 .table .head ul { display: flex; }
#carbon_risk2 .table .head ul li { font-size: 17px; font-weight: 600; color: #a5a5a5; text-align: center; padding: 0 30px; width: 100%; box-sizing: border-box; }
#carbon_risk2 .table .head ul li.type { width: 230px; flex: none; }
#carbon_risk2 .table .head ul li.biz { width: 370px; flex: none; margin-left: 55px; color: #1fa953; }
#carbon_risk2 .table .body ul { display: flex; flex-direction: column; }
#carbon_risk2 .table .body ul li + li { margin-top: 25px; }
#carbon_risk2 .table .body ul li { display: flex; }
#carbon_risk2 .table .body dl { display: flex; border: 1px solid #e7e7ee; border-radius: 14px; width: 100%; background-color: #fff; }
#carbon_risk2 .table .body dl dd { font-size: 19px; font-weight: 300; color: #000; padding: 40px 0; box-sizing: border-box; width: 100%; }
#carbon_risk2 .table .body dl dd p { display: none; }
#carbon_risk2 .table .body dl dd.type { width: 230px; flex: none; text-align: center; font-size: 21px; font-weight: 600; padding: 30px 0; }
#carbon_risk2 .table .body dl dd.type p { display: block; }
#carbon_risk2 .table .body ul li > div { position: relative; width: 370px; flex: none; background-color: #1fa953; border-radius: 14px; color: #fff; padding: 40px 30px; margin-left: 55px; font-size: 19px; font-weight: 300;  box-sizing: border-box;}
#carbon_risk2 .table .body ul li > div p { display: none; }
#carbon_risk2 .table .body ul li > div:before { content: ''; position: absolute; right: 100%; top: 50%; width: 10px; height: 10px; margin-right: 25px; margin-top: -5px; transform: rotate(-45deg); border-bottom: 2px solid #1fa953; border-right: 2px solid #1fa953; box-sizing: border-box; }


#carbon_effort .secTitle { font-size: 60px; font-weight: 600; color: #000; margin-bottom: 40px; }
#carbon_effort .secTitle span { color: #1fa953; }
#carbon_effort .carbon_effort_mainPoint .subTitle { font-size: 30px; font-weight: 500; color: #000; margin-bottom: 50px; }

/*230817 HR 추가*/
#carbon_effort .carbon_effort_mainPoint .subTitle span {
	display: inline-block;
    font-size: 22px;
    font-weight: 300;
    line-height: 1.875;
}

#carbon_effort .carbon_effort_mainPoint ul { display: flex; margin-left: -55px; }
#carbon_effort .carbon_effort_mainPoint ul li { width: 100%; margin-left: 55px; }
#carbon_effort .carbon_effort_mainPoint ul li .inner { display: block; width: 100%; height: 600px; background-color: #dedede; position: relative; overflow: hidden; }
#carbon_effort .carbon_effort_mainPoint ul li .tit { font-size: 30px; font-weight: 600; color: #000; line-height: 1; text-align: center; margin-top: 30px; }
#carbon_effort .carbon_effort_mainPoint ul li .tit span { color: #1fa953; }
#carbon_effort .carbon_effort_mainPoint ul li .bg { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; }
#carbon_effort .carbon_effort_mainPoint ul li .bg:before { content: ''; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: rgba(0, 0, 0, .8); opacity: 0; z-index: 1; 
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}
#carbon_effort .carbon_effort_mainPoint ul li .bg .img { width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; 
    -webkit-transition: transform 0.3s ease;
    -moz-transition: transform 0.3s ease;
    -o-transition: transform 0.3s ease;
    transition: transform 0.3s ease;
}

#carbon_effort .carbon_effort_mainPoint ul li .cont { padding: 50px; display: flex; flex-direction: column; justify-content: flex-end; height: 100%; box-sizing: border-box; position: relative; z-index: 2; }
#carbon_effort .carbon_effort_mainPoint ul li .cont:after { content: ''; width: 100%; height: 100%; position: absolute; bottom: 0; left: 0; z-index: 0; 
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}
#carbon_effort .carbon_effort_mainPoint ul li .cont > * { position: relative; z-index: 1; }
#carbon_effort .carbon_effort_mainPoint ul li .cont .txt { font-size: 21px; font-weight: 300; color: #fff; margin-top: 20px; overflow: hidden; }
#carbon_effort .carbon_effort_mainPoint ul li .cont .more { margin-top: 20px; font-size: 16px; color: #fff; border-bottom: 1px solid #fff; display: inline-block; }
#carbon_effort .carbon_effort_mainPoint ul li .cont .dec { overflow: hidden; height: auto; display: none;
    -webkit-transition: height 0.3s ease;
    -moz-transition: height 0.3s ease;
    -o-transition: height 0.3s ease;
    transition: height 0.3s ease;
}
#carbon_effort .carbon_effort_mainPoint ul li .inner:hover .bg:before,
#carbon_effort .carbon_effort_mainPoint ul li .inner:focus .bg:before { opacity: 1; }
#carbon_effort .carbon_effort_mainPoint ul li .inner:hover .bg .img,
#carbon_effort .carbon_effort_mainPoint ul li .inner:focus .bg .img { transform: scale(1.1); }
#carbon_effort .carbon_effort_mainPoint ul li .inner:hover .cont:after,
#carbon_effort .carbon_effort_mainPoint ul li .inner:focus .cont:after { opacity: 0; }
#carbon_effort .carbon_effort_mainPoint ul li .inner:hover .cont .dec,
#carbon_effort .carbon_effort_mainPoint ul li .inner:focus .cont .dec { height: auto; display: block; }
#carbon_effort .carbon_effort_cont { margin-top: 100px; }
#carbon_effort .carbon_effort_cont .subTitle { font-size: 35px; font-weight: 600; line-height: 1.5; }
#carbon_effort .carbon_effort_cont .secText { font-size: 21px; color: #000; max-width: 940px; font-weight: 300; line-height: 1.8; }
#carbon_effort .carbon_effort_cont .tit { font-size: 22px; color: #1fa953; margin-top: 60px; font-weight: 500; }
#carbon_effort .carbon_effort_cont .secObj img { margin: 0 auto; }
#carbon_effort .carbon_effort_vod { margin-top: 120px; }
#carbon_effort .carbon_effort_vod .subTitle { font-size: 40px; font-weight: 300; text-align: center; line-height: 1.35; margin-bottom: 30px; }


#carbon_video { height: 100vh; }
#carbon_video a { display: flex; align-items: center; justify-content: center; }

#carbon_guideline > .inner { padding-bottom: 0; }
#carbon_guideline .secTitle { font-size: 60px; color: #000; font-weight: 600; line-height: 1.5; }
#carbon_guideline .cont { display: flex; flex-direction: row-reverse; justify-content: space-between; }
#carbon_guideline .cont > * { width: 100%; }
#carbon_guideline .secText { font-size: 21px; color: #000; line-height: 1.8; }
#carbon_guideline .guideBook { padding-left: 150px; box-sizing: border-box; text-align: right; }
#carbon_guideline .download { margin-top: 70px; }
#carbon_guideline .download .btn { width: 200px; border-radius: 0; height: 50px; justify-content: space-between; padding: 0 20px; background-color: #1fa953; border-color: #1fa953; color: #fff; }
#carbon_guideline .download .btn:after { content: ''; width: 15px; height: 17px; background: url(../images/ico/ico_dl_wh.png) center no-repeat; }
#carbon_guideline > .bg { background-color: #fff; }
#carbon_guideline > .bg > div { background-size: contain; }


#carbon_news .secTitle { font-size: 60px; color: #000; font-weight: 600; }
#carbon_news .more { position: absolute; top: 150px; right: 0; }
#carbon_news .more a { display: flex; align-items: center; font-size: 19px; font-weight: 500; }
#carbon_news .more a:after {  content: ''; width: 10px; height: 10px; margin-left: 10px; border-bottom: 2px solid #000; border-right: 2px solid #000; transform: rotate(-45deg); }
#carbon_news ul { display: flex; margin-left: -50px; }
#carbon_news ul .item { margin-left: 50px; width: 100%; }
#carbon_news ul .item > .inner { display: flex; flex-direction: column; }
#carbon_news ul .item .dec { padding: 30px 0; }
#carbon_news ul .item .cate { font-size: 17px; color: #1fa953; font-weight: 500; margin-bottom: 10px; }
#carbon_news ul .item .tit { font-size: 23px; font-weight: 600; color: #000; line-height: 1.45; height: 67px; overflow: hidden; }
#carbon_news ul .item .date { font-size: 16px; color: #000; margin-top: 10px; }
#carbon_news ul .item .img { overflow: hidden; }
#carbon_news ul .item .img > div { width: 100%; height: 0; padding-top: 70%; background-size: cover; background-repeat: no-repeat; background-position: center; }



/*#hyrex_wrap .sub-page-section > .inner { padding: 120px 0; }

#hyrex_kv { height: 100vh; color: #fff; }
#hyrex_kv .tit .t1 { font-size: 40px; font-weight: 300; line-height: 1; }
#hyrex_kv .tit .t2 { font-size: 60px; font-weight: 600; line-height: 1; margin-top: 5px; }
#hyrex_kv .tit .t2 span { font-size: 20px; }
#hyrex_kv .txt { margin-top: 120px; max-width: 640px; font-size: 22px; font-weight: 300; line-height: 1.8; padding-left: 17px; text-indent: -15px; }
#hyrex_kv .txt .sign { text-indent: 0; margin-top: 20px; font-size: 16px; font-weight: 600; }
#hyrex_kv .viewMore { position: absolute; bottom: 40px; left: 50%; z-index: 1; display: inline-flex; flex-direction: column; align-items: center; transform: translateX(-50%); font-size: 20px; font-weight: 300; }
#hyrex_kv .viewMore:after { content: ''; width: 14px; height: 14px; box-sizing: border-box; border-left: 3px solid #fff; border-bottom: 3px solid #fff; transform: rotate(-45deg); margin-top: 5px; }
#hyrex_kv .bg .img { height: 120%; transition: height 7s; }
#hyrex_kv.is-show .bg .img { height: 100%; }

#hyrex_about .cont { display: flex; margin-bottom: 80px; color: #28324d; }
#hyrex_about .cont .tit { padding-right: 100px; font-size: 45px; font-weight: 600; }
#hyrex_about .cont .txt { font-size: 20px; line-height: 1.7; max-width: 940px; }

#hyrex_banner { height: 740px; text-align: right; justify-content: flex-start; }
#hyrex_banner > .inner { max-width: 1250px; padding-top: 150px !important; }
#hyrex_banner .tit { font-size: 70px; color: #fff; font-weight: 900; line-height: 1; }
#hyrex_banner .tit .t1 { padding-right: 115px; color: transparent; -webkit-text-stroke: 1px #fff; }
#hyrex_banner .tit .t2 { color: #4397ff; }
#hyrex_banner .txt { font-size: 25px; color: #fff; font-weight: 300; margin-top: 30px; }

#hyrex_compare .cont { display: flex; margin-bottom: 80px; color: #28324d; }
#hyrex_compare .cont .tit { padding-right: 100px; font-size: 45px; font-weight: 600; white-space: nowrap; }
#hyrex_compare .cont .txt { font-size: 20px; line-height: 1.7; }
#hyrex_compare .obj { display: flex; }
#hyrex_compare .obj li { border: 1px solid #d2d2d2; border-radius: 9px; box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.12); overflow: hidden; }
#hyrex_compare .obj li + li { margin-left: 25px;  }
#hyrex_compare .obj li img { display: block; }

#hyrex_tech { color: #fff; }
#hyrex_tech > .inner { padding: 170px 0 !important; }
#hyrex_tech .title { font-size: 25px; font-weight: 600; }
#hyrex_tech .text { font-size: 62px; font-weight: 300; line-height: 1.28; margin-top: 45px; }
#hyrex_tech ul { margin-top: 200px; display: flex; }
#hyrex_tech ul li { border: 1px solid rgba(255, 255, 255, .4); width: 100%; padding: 80px 30px; }
#hyrex_tech ul li + li { margin-left: 12px; }
#hyrex_tech ul li .tit { display: flex; align-items: center; font-size: 30px; font-weight: 600; }
#hyrex_tech ul li .tit small { font-size: 0.833em; }
#hyrex_tech ul li .tit span { width: 45px; height: 45px; border-radius: 50%; background-color: #d67200; font-size: 22px; font-weight: 500; line-height: 48px; text-align: center; margin-right: 20px; }
#hyrex_tech ul li .txt { font-size: 16px; line-height: 1.56; margin-top: 40px; }
#hyrex_tech .bg .img { height: 120%; transition: height 7s; }
#hyrex_tech.is-show .bg .img { height: 100%; }

#hyrex_video { text-align: center; }
#hyrex_video .text { font-size: 40px; font-weight: 300; margin-bottom: 40px; line-height: 1.25; }
#hyrex_video .video a { position: relative; display: inline-flex; }
#hyrex_video .video a:before { content: ''; width: 100px; height: 100px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background: url(../images/hyrex/hyrex_video_play.png) center no-repeat; background-size: contain; }

#hyrex_plan { background-color: #f3fafb; }
#hyrex_plan .secTitle { font-size: 45px; font-weight: 600; color: #28324d; }
#hyrex_plan .planList { display: flex; color: #28324d; }
#hyrex_plan .planList li { width: 100%; }
#hyrex_plan .planList li + li { margin-left: 25px; }
#hyrex_plan .planList li .img { height: 0; padding-top: 50%; background-color: #eee; background-size: cover; background-position: center; background-repeat: no-repeat; }
#hyrex_plan .planList li .year { font-size: 25px; font-weight: 600; line-height: 1.1; margin-top: 25px; }
#hyrex_plan .planList li .text { font-size: 20px; font-weight: 300; line-height: 1.1; margin-top: 20px; }
#hyrex_plan .section { margin-top: 80px; padding-top: 60px; border-top: 1px solid #dedede; display: flex; }
#hyrex_plan .section .title { width: 400px; flex: none; color: #005c99; font-size: 30px; font-weight: 600; }
#hyrex_plan .section .title sub { font-size: 0.666em; }
#hyrex_plan .section .cont { width: 100%; }
#hyrex_plan .newList { display: flex; color: #28324d; }
#hyrex_plan .newList li { width: 100%; }
#hyrex_plan .newList li + li { margin-left: 30px; }
#hyrex_plan .newList li .img img{ width: 100%; display: block; }
#hyrex_plan .newList li .tit { font-size: 20px; font-weight: 600; line-height: 1.5; margin-top: 15px; }
#hyrex_plan .newList li .date { font-size: 16px; line-height: 1; color: #666; margin-top: 10px; }

#hyrex_brochure > .inner { display: flex; }
#hyrex_brochure .img { padding-left: 80px; padding-right: 160px; }
#hyrex_brochure .cont { width: 100%; max-width: 560px; }
#hyrex_brochure .cont .title { font-size: 35px; font-weight: 600; line-height: 1.2; margin-bottom: 20px; }
#hyrex_brochure .cont ul li { padding: 20px 0; }
#hyrex_brochure .cont ul li + li { border-top: 1px solid #d3d3d3; }
#hyrex_brochure .cont ul li .tit { font-size: 16px; color: #2a3057; }
#hyrex_brochure .cont ul li .txt { font-size: 16px; color: #666; line-height: 1.56; }
#hyrex_brochure .cont dl { display: flex; margin-top: 10px; }
#hyrex_brochure .cont dl dd { display: flex; align-items: center; white-space: nowrap; }
#hyrex_brochure .cont dl dd + dd { margin-left: 50px; }
#hyrex_brochure .cont .more { margin-top: 40px; }
#hyrex_brochure .cont .more .btn { width: 210px; height: 50px; border-radius: 0; justify-content: space-between }
#hyrex_brochure .cont .more .btn:after { content: ''; width: 15px; height: 15px; background-size: contain; background-repeat: no-repeat; background-position: center; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 392.75 392.75'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23ffffff;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3EVector Smart Object%3C/title%3E%3Cpath class='cls-1' d='M961.21,1028.31h306.25a43.3,43.3,0,0,0,43.25-43.25V853.81a21.38,21.38,0,1,0-42.75,0V963.18a22.41,22.41,0,0,1-22.38,22.38H983.08a22.4,22.4,0,0,1-22.37-22.38V700.68a22.4,22.4,0,0,1,22.37-22.37h109.38a21.38,21.38,0,0,0,0-42.75H961.21A43.3,43.3,0,0,0,918,678.81V985.06A43.3,43.3,0,0,0,961.21,1028.31Z' transform='translate(-917.96 -635.56)'/%3E%3Cpath class='cls-1' d='M1180,678.31h57.86L1037.25,878.88A21.31,21.31,0,1,0,1067.38,909L1268,708.44v57.87a21.38,21.38,0,0,0,42.75,0V656.93a21.4,21.4,0,0,0-21.38-21.37H1180a21.38,21.38,0,1,0,0,42.75Z' transform='translate(-917.96 -635.56)'/%3E%3C/svg%3E"); }
*/

[id*='hyrex_'] > .inner { padding: 120px 0; max-width: 1300px; }

#hyrex_kv { height: 100vh; color: #fff; justify-content: center; position: relative; }
#hyrex_kv > .inner { position: static; }
#hyrex_kv .cont { width: 100%; }
#hyrex_kv .tit  { font-size: 23px; border-bottom: 1px solid #fff; display: inline-block; }
#hyrex_kv .txt { margin-top: 30px; font-size: 65px; font-weight: 600; line-height: 1.25; }
#hyrex_kv .visual { position: absolute; top: 0; left: 50%; width: 50%; height: 100%; background-color: #eaeaea; overflow: hidden; }
#hyrex_kv .visual .img { width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; }
#hyrex_kv .visual video { min-width: 100%; min-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
/*#carbon_kv .viewMore { position: absolute; bottom: 40px; left: 50%; z-index: 1; display: inline-flex; flex-direction: column; align-items: center; transform: translateX(-50%); font-size: 12px; font-weight: 300; text-transform: uppercase; }
#carbon_kv .viewMore:after { content: ''; width: 14px; height: 14px; box-sizing: border-box; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg); margin-top: 5px; }*/
#hyrex_kv .bg .img { height: 100%; }
#hyrex_kv .bg:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .25); z-index: 1; }


#hyrex_about > .inner > div { display: flex; flex-direction: row-reverse; }
#hyrex_about > .inner > div > * { width: 100%; }
#hyrex_about .tit { font-size: 50px; font-weight: 600; color: #000; margin-bottom: 50px; line-height: 1.25; }
#hyrex_about .txt { font-size: 24px; line-height: 1.875; color: #000; font-weight: 300; }
#hyrex_about .obj { margin-top: 110px; }


#hyrex_banner { height: 100vh; }
#hyrex_banner .tit { font-size: 80px; color: #fff; font-weight: 600; line-height: 1; }
#hyrex_banner .tit sup {font-size: initial; vertical-align: text-top;}
#hyrex_banner .tit span { color: #47c9ff; }
#hyrex_banner .txt { font-size: 30px; color: #fff; margin-top: 30px; }


#hyrex_compare .cont { display: flex; }
#hyrex_compare .cont > * { width: 100%; }
#hyrex_compare .cont .tit { padding-right: 100px; font-size: 60px; font-weight: 600; line-height: 1.25; color: #000; }
#hyrex_compare .cont .tit span { color: #47c9ff; }
#hyrex_compare .cont .txt { font-size: 24px; line-height: 1.875; font-weight: 300; }
#hyrex_compare .obj { margin-top: 90px; }


#hyrex_tech { color: #fff; }
#hyrex_tech .title { font-size: 30px; line-height: 1.666; }
#hyrex_tech .text { font-size: 60px; font-weight: 600; line-height: 1.5; margin-top: 20px; }
#hyrex_tech ul { margin-top: 120px; display: flex; }
#hyrex_tech ul li { width: 100%; }
#hyrex_tech ul li + li { margin-left: 60px; }
#hyrex_tech ul li .num { font-size: 20px; font-weight: 500; margin-bottom: 10px; }
#hyrex_tech ul li .tit { font-size: 26px; font-weight: 600; border-top: 1px solid rgba(255, 255, 255, .5); padding-top: 30px; }
#hyrex_tech ul li .txt { font-size: 19px; font-weight: 300; line-height: 1.875; margin-top: 15px; }


#hyrex_video { text-align: center; }
#hyrex_video .text { font-size: 60px; font-weight: 300; margin-bottom: 70px; line-height: 1.5; }
#hyrex_video .video a { position: relative; display: inline-flex; }
#hyrex_video .video a:before { content: ''; width: 136px; height: 136px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background: url(../images/hyrex/hyrex_video_play.png) center no-repeat; background-size: contain; }


#hyrex_plan .secTitle { text-align: center; font-size: 60px; font-weight: 600; color: #000; }
#hyrex_plan .secTitle sub { font-size: 0.5em; }
#hyrex_plan .secObj { text-align: center; margin-top: 80px; }
#hyrex_plan .secObj img { margin: 0 auto; }
#hyrex_plan * + .secTitle { margin-top: 170px; }


#hyrex_news { background-color: #f6f8f9; }
#hyrex_news .secTitle { font-size: 60px; color: #000; font-weight: 600; }
#hyrex_news .more { position: absolute; top: 150px; right: 0; }
#hyrex_news .more a { display: flex; align-items: center; font-size: 19px; font-weight: 500; }
#hyrex_news .more a:after {  content: ''; width: 10px; height: 10px; margin-left: 10px; border-bottom: 2px solid #000; border-right: 2px solid #000; transform: rotate(-45deg); }
#hyrex_news ul { display: flex; margin-left: -50px; }
#hyrex_news ul .item { margin-left: 50px; width: 100%; }
#hyrex_news ul .item > .inner { display: flex; flex-direction: column; background-color: #fff; }
#hyrex_news ul .item .dec { padding: 30px 35px; }
#hyrex_news ul .item .cate { font-size: 17px; color: #0596e9; font-weight: 500; margin-bottom: 10px; }
#hyrex_news ul .item .tit { font-size: 23px; font-weight: 600; color: #000; line-height: 1.45; height: 67px; overflow: hidden; }
#hyrex_news ul .item .date { font-size: 16px; color: #000; margin-top: 10px; }
#hyrex_news ul .item .img { overflow: hidden; }
#hyrex_news ul .item .img > div { width: 100%; height: 0; padding-top: 70%; background-size: cover; background-repeat: no-repeat; background-position: center; }


#hyrex_brochure > .inner { display: flex; }
#hyrex_brochure > .inner > * { width: 100%; box-sizing: border-box; }
#hyrex_brochure .img { padding-right: 100px; }
#hyrex_brochure .cont .title { font-size: 60px; font-weight: 600; line-height: 1.25; margin-bottom: 20px; }
#hyrex_brochure .cont ul li { padding: 20px 0; }
#hyrex_brochure .cont ul li + li { border-top: 1px solid #dde6ef; }
#hyrex_brochure .cont ul li .tit { font-size: 16px; color: #2a3057; font-weight: 600; }
#hyrex_brochure .cont ul li .txt { font-size: 24px; color: #666; line-height: 1.56; }
#hyrex_brochure .cont dl { display: flex; margin-top: 10px; }
#hyrex_brochure .cont dl dd { display: flex; align-items: center; white-space: nowrap; }
#hyrex_brochure .cont dl dd + dd { margin-left: 50px; }
#hyrex_brochure .cont .more { margin-top: 40px; }
#hyrex_brochure .cont .more .btn { width: 210px; height: 50px; border-radius: 0; justify-content: space-between }
#hyrex_brochure .cont .more .btn:after { content: ''; width: 15px; height: 15px; background-size: contain; background-repeat: no-repeat; background-position: center; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 392.75 392.75'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23ffffff;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3EVector Smart Object%3C/title%3E%3Cpath class='cls-1' d='M961.21,1028.31h306.25a43.3,43.3,0,0,0,43.25-43.25V853.81a21.38,21.38,0,1,0-42.75,0V963.18a22.41,22.41,0,0,1-22.38,22.38H983.08a22.4,22.4,0,0,1-22.37-22.38V700.68a22.4,22.4,0,0,1,22.37-22.37h109.38a21.38,21.38,0,0,0,0-42.75H961.21A43.3,43.3,0,0,0,918,678.81V985.06A43.3,43.3,0,0,0,961.21,1028.31Z' transform='translate(-917.96 -635.56)'/%3E%3Cpath class='cls-1' d='M1180,678.31h57.86L1037.25,878.88A21.31,21.31,0,1,0,1067.38,909L1268,708.44v57.87a21.38,21.38,0,0,0,42.75,0V656.93a21.4,21.4,0,0,0-21.38-21.37H1180a21.38,21.38,0,1,0,0,42.75Z' transform='translate(-917.96 -635.56)'/%3E%3C/svg%3E"); }

/* 230517 그리닛 페이지 추가 */

[id*='greenate_'] > .inner { padding: 120px 0; max-width: 1300px; }

#greenate_kv { height: 100vh; color: #fff; justify-content: center; position: relative; }
#greenate_kv > .inner { position: static; max-width: 1600px; }
#greenate_kv .cont { padding:30px; }
#greenate_kv .tit  { font-size: 23px; border-bottom: 1px solid #fff; display: inline-block;/*text-transform: uppercase;*/}
#greenate_kv .txt { margin-top: 30px; font-size: 65px; font-weight: 600; line-height: 1.25; }
#greenate_kv .visual { position: absolute; top: 0; left: 50%; width: 50%; height: 100%; background-color: #eaeaea; overflow: hidden; }
#greenate_kv .visual .img { width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; }
#greenate_kv .visual video { min-width: 100%; min-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
#greenate_kv .bg .img { height: 100%; }
#greenate_kv .bg:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .25); z-index: 1; }

/* 230413 그리닛 페이지 수정 */

#greenate_about > .inner { display: flex; flex-direction: row-reverse; }
#greenate_about > .inner > * { width: 100%; }
#greenate_about .tit { font-size: 60px; font-weight: 600; color: #000; margin-bottom: 50px; }
#greenate_about .txt { font-size: 24px; line-height: 1.875; color: #000; font-weight: 300; }

#greenate_brands {width: 100%; background-color: #f3f7f4;}
#greenate_brands .sub_brand_sec {border: 1px solid #e7e7ee; border-radius: 10px;background-color: #fff; padding: 80px 0; margin-top: 50px; }
#greenate_brands .inner > h4.title {font-size: 30px; font-weight: 600; }
#greenate_brands .inner > p {font-size: 21px; font-family: 'Noto Sans KR','Apple SD Gothic Neo','malgun gothic','맑은 고딕','돋움','dotum',sans-serif;}
#greenate_brands .sub_brand_sec .greenate_main_logo {width: 442px; height: 98px; background:  url("../images/greenate/greenate_logo_img.png") no-repeat center; margin: 0 auto;}
#greenate_brands .sub_brand_sec .sub_brand_wrap { width: 740px; margin: 0 auto;}
#greenate_brands .sub_brand_sec .greenate_brand { float: left;}
#greenate_brands .sub_brand_sec .greenate_tech { margin-left: 20px;}
#greenate_brands .sub_brand_sec .greenate_infra { margin-top: 15px; display: block;}
#greenate_brands .sub_brand_sec .greenate_infra_m { margin-top: 15px; display: none;}

#greenate_future .secTitle { font-size: 60px; font-weight: 600; color: #000; margin: 65px 0; }
#greenate_future .secTitle span { color: #1fa953; }
#greenate_future .inner > h5 { font-size: 30px; margin-bottom: 50px; }
#greenate_future .inner > p { font-size: 21px; margin-bottom: 120px; }
#greenate_future .risk_list > li { display: flex; align-items: center; }
#greenate_future .risk_list > li:nth-child(odd) { flex-direction: row-reverse;  }
#greenate_future .risk_list > li + li { margin-top: 100px; }
#greenate_future .risk_list > li > * { width: 50%; box-sizing: border-box; }
#greenate_future .risk_list > li .dec { padding: 30px 70px; }
#greenate_future .risk_list > li .dec .tit { font-size: 30px; font-weight: 600; color: #000; margin-bottom: 40px; }
#greenate_future .risk_list > li .dec .txt { font-size: 20px; font-weight: 400; color: #000; }
#greenate_future .risk_list > li .dec .txt span{ color: #1fa953; font-weight: 500;}
#greenate_future .risk_list > li .img img { display: block; margin-left: auto; }
#greenate_future .risk_list > li:nth-child(odd) .img img { margin-left: 0; margin-right: auto; }
#greenate_future .risk_list > li:nth-child(4) .dec { padding: 0; width: 100%; }

#greenate_planet .inner {vertical-align: center;}
#greenate_planet { height: 100vh; }
#greenate_planet .tit { font-size: 80px; color: #fff; font-weight: 600; line-height: 1; margin-top: 70px;}
#greenate_planet .tit span { color: #47c9ff; }
#greenate_planet .txt { font-size: 30px; color: #fff;}

#greenate_video { text-align: center; }
#greenate_video .text { font-size: 60px; font-weight: 300; margin-bottom: 70px; line-height: 1.5; }
#greenate_video .video a { position: relative; display: inline-flex; }
#greenate_video .video a:before { content: ''; width: 136px; height: 136px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background: url(../images/hyrex/hyrex_video_play.png) center no-repeat; background-size: contain; }

#greenate_news { background-color: #f6f8f9; }
#greenate_news .secTitle { font-size: 60px; color: #000; font-weight: 600; }
#greenate_news .more { position: absolute; top: 150px; right: 0; }
#greenate_news .more a { display: flex; align-items: center; font-size: 19px; font-weight: 500; }
#greenate_news .more a:after {  content: ''; width: 10px; height: 10px; margin-left: 10px; border-bottom: 2px solid #000; border-right: 2px solid #000; transform: rotate(-45deg); }
#greenate_news ul { display: flex; margin-left: -50px; }
#greenate_news ul .item { margin-left: 50px; width: 100%; }
#greenate_news ul .item > .inner { display: flex; flex-direction: column; background-color: #fff; }
#greenate_news ul .item .dec { padding: 30px 35px; }
#greenate_news ul .item .cate { font-size: 17px; color: #0596e9; font-weight: 500; margin-bottom: 10px; }
#greenate_news ul .item .tit { font-size: 23px; font-weight: 600; color: #000; line-height: 1.45; height: 67px; overflow: hidden; }
#greenate_news ul .item .date { font-size: 16px; color: #000; margin-top: 10px; }
#greenate_news ul .item .img { overflow: hidden; }
#greenate_news ul .item .img > div { width: 100%; height: 0; padding-top: 70%; background-size: cover; background-repeat: no-repeat; background-position: center; }

@media screen and (max-width:850px){ 
  #greenate_brands .sub_brand_sec .sub_brand_wrap {width: 100%;}
  #greenate_brands .sub_brand_sec .greenate_tech {margin-left: 0;}
  #greenate_brands .sub_brand_sec .sub_brand_wrap >div:first-child,
  #greenate_brands .sub_brand_sec .sub_brand_wrap >div:nth-child(2) {width: 50%;}
}

/* 230522 기업시민 페이지 추가 */

[id*='cc_sec_'] > .inner {padding: 120px 0; max-width: 1300px}
[id*='cc_sec_'] > .inner .cont{ width: 100%;}
[id*='cc_sec_'] .tit{ font-size: 60px; font-weight: 600; color: #000; line-height: 88px;}
[id*='cc_sec_'] .tit.small{ font-size: 45px;}
[id*='cc_sec_'] .tit br.mobile {display: block;}
[id*='cc_sec_'] .tit span{ color: #0082cf; }

#cc_sec_01 > .inner { display: flex; flex-direction: row-reverse; }
#cc_sec_01 > .inner > * { width: 100%; }
#cc_sec_01 .txt { font-size: 24px; line-height: 1.875; color: #000; font-weight: 300; /*text-transform: uppercase;*/ margin-top: 50px; }
.cont.list .listTit{ font-size: 28px; font-weight: bold;}

#citizen_brand_top .inner .secTxt{font-size: 24px;}
#cc_sec_02 .txt { font-size: 24px; line-height: 1.875; color: #000; font-weight: 300; /*text-transform: uppercase;*/ margin-top: 50px; }
#cc_sec_02 .secTxt {display: flex; margin-top: 120px; justify-content: center;}
#cc_sec_02 .secTxt p{display: inline-block; padding: 45px 130px; font-size: 30px;line-height:45px; background-color: #f2f2f2; border-radius: 5rem; width: 100%; text-align: center; }
/*#cc_sec_02 .secTxt p br{display: none;}*/
#cc_sec_02 .secTxt p span{color: #0082cf;}

#cc_sec_03 .inner {padding: 60px 0;}
#cc_sec_03 .inner:last-child { display: flex; justify-content: flex-end;}
#cc_sec_03 .inner .btn_type3{padding: 0 40px ; height: 57px; }

.cont.list .listTit{ font-size: 28px; font-weight: bold;}
.cont.list .listCon.circle{ display: flex; justify-content: space-between;}
[id*='cc_sec_'] .citizen_m_img {display: none;}

.cont.list .listCon.circle li{ width: 25%; margin-left: -50px; position: relative;}
.cont.list .listCon.circle li:first-child{ margin-left: 0px;}
.cont.list .listCon.circle li:nth-child(4){ position: relative;}

.cont.list .listCon.circle li:after{ display: block; content:""; padding-bottom: 100%;}

.cont.list .listCon.circle .circleWrap{ position: absolute; top:0; left: 0;width: 100%; height: 100%; border-radius: 50%; display: flex; justify-content: center; flex-direction: column; align-items: center;text-align: center;  color: #fff;}
.cont.list .listCon.circle .sigBrand > img{ position: absolute; top: -15px; left: 50%; transform: translateX(-50%); width: 47%;}

.cont.list .listCon.circle li .icon{ height: 47px; width: 71px;}

.cont.list .listCon.circle li:nth-child(1) .icon{ background: url(/docs/eng7/jsp/resources/images/esg/citizens/together_icon.png) center no-repeat;}
.cont.list .listCon.circle li:nth-child(2) .icon{ background: url(/docs/eng7/jsp/resources/images/esg/citizens/challenge_icon.png) center no-repeat;}
.cont.list .listCon.circle li:nth-child(3) .icon{ background: url(/docs/eng7/jsp/resources/images/esg/citizens/green_icon.png) center no-repeat;}
.cont.list .listCon.circle li:nth-child(4) .icon{ background: url(/docs/eng7/jsp/resources/images/esg/citizens/life_icon.png) center no-repeat;}
.cont.list .listCon.circle li:nth-child(5) .icon{ background: url(/docs/eng7/jsp/resources/images/esg/citizens/community_icon.png) center no-repeat;}

#cc_sec_03 .inner:first-child .cont.list .listCon.circle li p:last-child{ line-height: 1.2; }

.cont.list .listCon.circle li p.top{ font-size: 19px;line-height: 30px; margin: 10px 0 10px;}
.cont.list .listCon.circle li p.top span{ font-size: 21px; font-weight: 600;}
.cont.list .listCon.circle .blue{ background-color: #229dc9; color: #fff!important;}
.cont.list .listCon.circle .green{ background-color: #47a85b;}
.cont.list .listCon.circle .orange{ background-color: #f06e00;}

.cont.list .listCon.circle li.line{ border-radius: 50%; background: none;}
.cont.list .listCon.circle li.line .circleWrap{color: #333;}
.cont.list .listCon.circle li.blue.line{border: 1px solid #229dc9;}
.cont.list .listCon.circle li.green.line{border: 1px solid #47a85b;}
.cont.list .listCon.circle li.orange.line{border: 1px solid #f06e00;}

.cont.list .listCon .item {float: left; width: 18.84%; margin-left: 1.1%;}

/* .cont.list .listCon .item:first-child {margin-left: 0;}
.cont.list .listCon .item:nth-child(2) {margin-top: 70px;}
.cont.list .listCon .item:nth-child(3) {margin-top: 30px;}
.cont.list .listCon .item:nth-child(4) {margin-top: 90px;} */

.cont.list .listCon{margin-top: 50px;}
.cont.list .listCon .item img{width: 100%;}
.cont.list .listCon .item .top_img{width: 100%; height: 248px; padding: 15px; box-sizing: border-box; color: #fff; font-weight: bold;}
.cont.list .listCon li:first-child .top_img{background: url(/docs/eng7/jsp/resources/images/esg/citizens/img_citizens_001.jpg) top no-repeat; background-size: cover;}
.cont.list .listCon li:nth-child(2) .top_img{background: url(/docs/eng7/jsp/resources/images/esg/citizens/img_citizens_002.jpg) top no-repeat; background-size: cover;}
.cont.list .listCon li:nth-child(3) .top_img{background:linear-gradient( to top, rgba(20, 20, 20, 0) 30%, rgba(20, 20, 20, 0.25) 45%, rgba(20, 20, 20, 0.5) 55%, rgba(20, 20, 20, 0.6) 85%, rgba(20, 20, 20, 0.7) 100% ), url(/docs/eng7/jsp/resources/images/esg/citizens/green_brand_001.png) top no-repeat; background-size: cover;}
.cont.list .listCon li:nth-child(4) .top_img{background: url(/docs/eng7/jsp/resources/images/esg/citizens/img_citizens_004.jpg) top no-repeat; background-size: cover;}
.cont.list .listCon li:nth-child(5) .top_img{background: url(/docs/eng7/jsp/resources/images/esg/citizens/img_citizens_005.jpg) top no-repeat; background-size: cover;}
.cont.list .listCon .item a.more{display: block; font-size: 16px; line-height: 16px; width: 100%; text-align: center; padding: 10px 0; border: 1px solid #cfcfcf;}
.cont.list .listCon .item a.more:where(:hover, :focus){background: #099de8; border-color: #099de8; color: #fff;}
.cont.list .listCon .item p{/*display: flex; gap: 25px; */font-size: 16px; line-height: 16px; font-weight: bold;}
/* .cont.list .listCon .item p::before{display: block; content:""; width: 10px; height: 8px;}
.cont.list .listCon .item p.blue_deco::before{background-color: #0090e6;}
.cont.list .listCon .item p.green_deco::before{background-color: #0dcb67;}
.cont.list .listCon .item p.orange_deco::before{background-color: #f98c00;} */

.citizen_arrow { width: 22px;height: 63px; margin: 0 auto;}
.citizen_arrow.green {background: url('/docs/eng7/jsp/resources/images/esg/citizens/arrow_green.png') center no-repeat;}
.citizen_arrow.gray { background: url('/docs/eng7/jsp/resources/images/common/arrow_gray.png') center no-repeat;}



/* 230525 기업시민 페이지 추가 */
#citizen_kv { height: 100vh; color: #fff; }
#citizen_kv .tit .t1 { font-size: 22px; font-weight: 500; line-height: 1; margin-bottom: 30px; }
#citizen_kv .tit .t2 { font-size: 58px; font-weight: 600; line-height: 1.25; margin-top: 5px;}
#citizen_kv .tit .t2.small { font-size: 45px; font-weight: 600; line-height: 1.25; margin-top: 5px;}
#citizen_kv .viewMore { position: absolute; bottom: 40px; left: 50%; z-index: 1; display: inline-flex; flex-direction: column; align-items: center; transform: translateX(-50%); font-size: 20px; font-weight: 300; }
#citizen_kv .viewMore:after { content: ''; width: 14px; height: 14px; box-sizing: border-box; border-left: 3px solid #fff; border-bottom: 3px solid #fff; transform: rotate(-45deg); margin-top: 5px; }
#citizen_kv .bg .img { height: 120%; transition: height 7s; }
#approach_kv.is-show .bg .img { height: 100%; }

#cc_sec_02 .inner .cont.line { width: 100%; box-sizing: border-box; padding: 45px 150px; border: 2px solid #d3d3d3; border-radius: 46px;}
#cc_sec_02 .inner .cont.blue { width: 100%; box-sizing: border-box; padding: 45px 100px;  border-radius: 46px; background-color: #00578a; color: #fff!important; font-size: 24px; border: none;}
#cc_sec_02 .inner .cont_wrap {/* 240701 삭제 display: flex; gap: 40px;*/}
#cc_sec_02 .inner .icon_wrap { width: 126px; height: 126px; box-sizing: border-box; border-radius: 100%; border: 2px solid #d3d3d3; flex: none;}

#cc_sec_02 .inner .cont div:first-child .icon_wrap {background: url('/docs/eng7/jsp/resources/images/esg/citizens/citizen_icon1.png') center no-repeat; }
#cc_sec_02 .inner .cont div:nth-child(2) .icon_wrap {background: url('/docs/eng7/jsp/resources/images/esg/citizens/citizen_icon2.png') center no-repeat; }

#cc_sec_02 .inner .cont .cont_tit { font-size: 24px; color: #00578a; font-weight: bold;}
#cc_sec_02 .inner .cont .cont_txt { font-size: 20px; line-height: 1.5;}
#cc_sec_02 .box_tit {font-size: 26px; color:#666; display: flex; align-items: center; gap: 15px;padding-left: 150px;}
#cc_sec_02 .box_tit .icon{width: 66px; height: 66px; background: url('/docs/eng7/jsp/resources/images/esg/citizens/citizen_icon3.png') center no-repeat;}

#cc_sec_03 .listTxt{font-size: 24px; text-align: center;}
#cc_sec_03 dl{display: flex; width: 100%;margin-top: 40px;}
#cc_sec_03 dt{width: 185px; font-size: 26px; flex: none; display: flex; align-items: center;}
#cc_sec_03 dl.top dt{align-items: flex-end; margin-bottom: 20px; }
#cc_sec_03 dl.top dd{
  font-size: 35px; 
  color: #00578a; 
  font-weight: bold;
  background-image: url(/docs/eng7/jsp/resources/images/esg/citizens/img_concept_bg.png); 
  background-size: 100% 100%; 
  background-repeat: no-repeat;
  height: 217px;
  align-items: flex-end;
}
#cc_sec_03 dl.top dd p{font-size: 29px;}
#cc_sec_03 dl.top dd span{color: #f38b00;font-size: 35px;}
#cc_sec_03 dl dd{width:100%; display: flex; justify-content: center;}
#cc_sec_03 dl dd > p{font-size: 25px;}

#cc_sec_03 dl dd > span,
#cc_sec_03 dl dd > strong,
#cc_sec_03 dl dd p > span{font-size: 30px;font-weight: bold;}
#cc_sec_03 dl dd > span {text-align: center;}

#cc_sec_03 dl dd.gap{gap: 120px;}
#cc_sec_03 dl dd.gap_mid{gap: 120px;}
#cc_sec_03 dl:first-child{margin-top: 0px;}
#cc_sec_03 dl.case01 dd{border-radius: 25px; padding: 15px 0; }
#cc_sec_03 dl.case01 dd img{width: 20%;}
/*
#cc_sec_03 dl.case01 dd .img{position: relative;font-size: 35px; color: #0f5a8b;font-weight: bold;letter-spacing: -2px; font-family: 'Noto Sans KR'; margin-left: 70px;}
#cc_sec_03 dl.case01 dd .img::before{
  content: '';
  width: 56px;
  display: block;
  background-image: url('/docs/eng7/jsp/resources/images/esg/citizens/with_posco_w.png');
  background-repeat: no-repeat;
  position: absolute;
  left: -1.8em;
  top: 5px;
  bottom: 0;
  margin: auto;}
*/
#cc_sec_03 dl.case02 dd>ul{width: 100%; display: flex; gap: 35px;}
#cc_sec_03 dl.case02 dd>ul>li{width:100%; padding: 45px 30px; border: 2px solid #d3d3d3; border-radius: 46px; display: flex; gap: 20px;flex-direction: column; align-items: center;    justify-content: flex-start;}
#cc_sec_03 dl.case02 dd>ul>li.case span{text-align: center; font-size: 35px; font-weight: 500;}
#cc_sec_03 dl.case02 dd>ul>li:first-child.case span{color: #229dc9;}
#cc_sec_03 dl.case02 dd>ul>li:nth-child(2).case span{color: #47a85b;}
#cc_sec_03 dl.case02 dd>ul>li:nth-child(3).case span{color: #f06e00;}
#cc_sec_03 dl.case02 dd>ul>li.case span::before{
  content: '';
  display: block;
  width: 118px;
  height: 118px;
  margin: 0 auto 25px;
  background-position: 50%;
  background-repeat: no-repeat;
  border-radius: 50%;
}
#cc_sec_03 dl.case02 dd>ul>li:nth-child(1).case span::before{background-color: #229dc9;background-image: url('/docs/eng7/jsp/resources/images/esg/citizens/business.png');}
#cc_sec_03 dl.case02 dd>ul>li:nth-child(2).case span::before{background-color: #47a85b;background-image: url('/docs/eng7/jsp/resources/images/esg/citizens/society.png');}
#cc_sec_03 dl.case02 dd>ul>li:nth-child(3).case span::before{background-color: #f06e00;background-image: url('/docs/eng7/jsp/resources/images/esg/citizens/peple.png');}
#cc_sec_03 dl.case02 dd>ul>li p{text-align: center; font-size: 24px; min-height: 100px;}

#cc_sec_03 dl.case02 dd>ul>li p strong{font-size: 28px;}
#cc_sec_03 dl.case02 dd>ul>li li{font-size: 21px;}
#cc_sec_03 dl.case02 dd>ul>li li{position: relative;}
#cc_sec_03 dl.case02 dd>ul>li li:before{
  content: '';
  display: block;
  position: absolute;
  left: -12px;
  top: 14px;
  width: 2px;
  height: 2px;
  margin: auto;
  background-color: #333;
}

/* 230904 기업시민헌장 */
#citizen_Charter { text-align: center; }
#citizen_Charter .inner { padding-top: 20px; text-align: center; }

#citizen_Charter .text { font-size: 24px; font-weight: 300; margin-bottom: 80px; line-height: 1.5; font-weight: 400; line-height: 1.75;}

#citizen_Charter .tab_cont_wrap {position: relative; width: 100%;}

#citizen_Charter .tab_box li{float: left; width: 12vw; margin-right: 10px;}
#citizen_Charter .tab_box li a{display: block; background-color: #eee; color: #928786; border-radius: 3rem;}

#citizen_Charter .tab_cont  {display: none;}
#citizen_Charter .tab_on {display: block; }
#citizen_Charter li.tab_on {overflow: hidden; border-radius: 15px 0 0 0; margin-right: -10px;  /*230607 margin-bottom: -1px; 추가*/ margin-bottom: -1px;}
#citizen_Charter li.tab_on a {transform: skew(30deg) translate(-30px, 0); border-radius: 0 10px 0 0;}
#citizen_Charter li a p {padding: 15px 0; font-size: 20px;}
#citizen_Charter li.tab_on a p {transform: skew(-30deg);padding: 20px 0; margin-left: 20px;}
#citizen_Charter li.tab_on.tab1 a{background-color: #eee; color: #333;}
#citizen_Charter li.tab_on.tab2 a{background-color: #229dca; color: #fff;}
#citizen_Charter li.tab_on.tab3 a{background-color: #47a75a; color: #fff;}
#citizen_Charter li.tab_on.tab4 a{background-color: #ef6e00; color: #fff;}

#citizen_Charter .tab_cont_wrap .tab_cont1 .tab_topbox {background-color: #eee;}
#citizen_Charter .tab_cont_wrap .tab_cont2 .tab_topbox {background-color: #229dca; color:  #fff;}
#citizen_Charter .tab_cont_wrap .tab_cont3 .tab_topbox {background-color: #47a75a; color:  #fff;}
#citizen_Charter .tab_cont_wrap .tab_cont4 .tab_topbox {background-color: #ef6e00; color:  #fff;}
#citizen_Charter .tab_cont_wrap .tab_cont1 .tab_botbox.fir {font-size: 24px; text-align: left;}
#citizen_Charter .tab_cont_wrap .tab_cont1 .tab_botbox.fir span {font-weight: bold;}
#citizen_Charter .tab_cont_wrap .tab_botbox {display: flex;}
#citizen_Charter .tab_cont_wrap .tab_botbox .boxHead {width: 370px; text-align: left;}
#citizen_Charter .tab_cont_wrap .tab_botbox .boxHead h4 {font-size: 24px; font-weight: bold; color: #005c9c;}
#citizen_Charter .tab_cont_wrap .tab_botbox .boxBody {width: 100%;}
#citizen_Charter .tab_cont_wrap .tab_botbox .boxBody > p {font-size: 25px;}
#citizen_Charter .tab_cont_wrap .tab_botbox .boxBody > p span {font-weight: bold;}
#citizen_Charter .tab_cont_wrap .tab_botbox .boxBody .bluebox,
#citizen_Charter .tab_cont_wrap .tab_botbox .boxBody .greybox {border-radius: 10px;}
#citizen_Charter .tab_cont_wrap .tab_botbox.sec .boxBody .bluebox,
#citizen_Charter .tab_cont_wrap .tab_botbox.sec .boxBody .greybox {height: 100px; display: flex; align-items: center; gap: 30px; text-align: left; border-radius: 10px;font-size: 17px;}
#citizen_Charter .tab_cont_wrap .tab_botbox.sec .boxBody .greybox span {color: #005c9c;}
#citizen_Charter .tab_cont_wrap .tab_botbox.sec .boxBody .bluebox span,
#citizen_Charter .tab_cont_wrap .tab_botbox.sec .boxBody .greybox span {font-weight: bold;}

#citizen_Charter .tab_cont_wrap .tab_botbox.thir .boxBody .bluebox span {font-size: 30px; font-weight: bold;}
#citizen_Charter .tab_cont_wrap .tab_botbox.thir .boxBody .greybox p span{font-weight: bold;}
#citizen_Charter .tab_cont_wrap .tab_botbox.thir .boxBody ul {display: flex; align-items: center; justify-content: center; gap: 35px;}
#citizen_Charter .tab_cont_wrap .tab_botbox.thir .boxBody ul .circle {border-radius: 100%; background-color: #fff;display: flex; align-items: center; justify-content: center; font-size: 16px; }
#citizen_Charter .tab_cont_wrap .tab_botbox.thir .boxBody ul .circle.circle_01 {width: 170px; height: 170px; margin-top: 20px; border: 1px solid #00a5e5;}
#citizen_Charter .tab_cont_wrap .tab_botbox.thir .boxBody ul .circle.circle_02 {width: 180px; height: 180px; margin-top: 10px; border: 1px solid #05507d;}
#citizen_Charter .tab_cont_wrap .tab_botbox.thir .boxBody ul .circle.circle_03 {width: 190px; height: 190px; background-color: #05507d; color:#fff;}

#citizen_Charter .tab_cont_wrap .tab_topbox {box-sizing: border-box; padding: 80px 60px;text-align: left; font-size: 22px;}
#citizen_Charter .tab_cont_wrap .tab_topbox .list_tit{/*230615 24px > 26px*/font-size: 26px; font-weight: bold;}
#citizen_Charter .tab_cont_wrap .tab_topbox ul.list_txt{border-bottom: 1px solid #fff; padding-bottom: 30px;}
#citizen_Charter .tab_cont_wrap .tab_topbox .inner_box{padding: 30px 40px; border-radius: 30px; background-color: rgba(255, 255, 255, .4); border: 2px solid #fff; color: #333; display: flex; align-items: center; gap: 30px;}
#citizen_Charter .tab_cont_wrap .tab_topbox .inner_box .icon{display:block; width: 125px; height: 125px; border-radius: 100%; flex: none;}
#citizen_Charter .tab_cont_wrap .tab_topbox .inner_box .box_tit{font-weight: bold; font-size: 22px;}
#citizen_Charter .tab_cont_wrap .tab_topbox .inner_box .box_txt{font-size: 20px;}
#citizen_Charter .tab_cont_wrap .tab_topbox .inner_box .box_txt span{font-weight: bold;}
#citizen_Charter .tab_cont_wrap .tab_topbox .inner_box .box_txt span.popup{position: relative; display: inline; cursor: pointer; font-weight: normal;}
#citizen_Charter .tab_cont_wrap .tab_topbox .inner_box .box_txt span.popup{position: relative; display: inline; cursor: pointer; font-weight: normal;}
#citizen_Charter .tab_cont_wrap .tab_topbox .inner_box div.popup{display: none; position: absolute; width: 32%; max-width: 400px; padding: 20px; background: #fff; border: 1px solid #000; right: 0;}
#citizen_Charter .tab_cont_wrap .tab_topbox .inner_box div.popup .close_btn{ cursor: pointer; width: 50px; height: 50px; display: block; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='13px' height='13px'%3E%3Cpath fill-rule='evenodd' fill='rgb(51, 51, 51)' d='M12.755,11.354 L11.341,12.769 L6.391,7.819 L1.441,12.768 L0.027,11.354 L4.977,6.405 L0.027,1.455 L1.441,0.040 L6.391,4.990 L11.341,0.040 L12.755,1.455 L7.805,6.404 L12.755,11.354 Z'/%3E%3C/svg%3E") center no-repeat; position: absolute; top: 0; right: 0;}
/* #citizen_Charter .tab_cont_wrap .tab_topbox .inner_box span.small{font-weight: normal;font-size: 16px; color: #666; line-height: 1; display: block;} */


#citizen_Charter .tab_cont_wrap .tab_cont2 .tab_topbox .inner_box .icon{ background:  url('/docs/eng7/jsp/resources/images/esg/citizens/business_blue.png') center no-repeat #fff;}
#citizen_Charter .tab_cont_wrap .tab_cont3 .tab_topbox .inner_box .icon{background:  url('/docs/eng7/jsp/resources/images/esg/citizens/social_green.png') center no-repeat #fff;}
#citizen_Charter .tab_cont_wrap .tab_cont4 .tab_topbox .inner_box .icon{background:  url('/docs/eng7/jsp/resources/images/esg/citizens/people_orange.png') center no-repeat #fff;}


#citizen_Charter .tab_cont_wrap .tab_blockbox .block_set span.plus{ background: url('/docs/eng7/jsp/resources/images/common/plus.png')center no-repeat #229dca;}

#citizen_Charter .tab_cont_wrap .tab_blockbox div {border-radius: 10px;} 
#citizen_Charter .tab_cont_wrap .tab_blockbox .tit_block {font-size: 30px; font-weight: bold; padding: 30px 0; color: #fff;} 
#citizen_Charter .tab_cont_wrap .tab_blockbox .big_block { background-color: #eee; padding: 50px 0; font-size: 22px;} 
#citizen_Charter .tab_cont_wrap .tab_blockbox .big_block span { font-weight: bold;} 
#citizen_Charter .tab_cont_wrap .tab_blockbox .block_set { display: flex; gap: 10px;align-items: center;} 
#citizen_Charter .tab_cont_wrap .tab_blockbox .block_set div{ padding: 40px; height: 250px; text-align: left; display: flex; flex-direction: column; justify-content: flex-start; background-color: #eee; width: 33%;} 
#citizen_Charter .tab_cont_wrap .tab_blockbox .block_set.full div{ min-height: 282px;} 
#citizen_Charter .tab_cont_wrap .tab_blockbox .block_set.single div{ height: 115px; justify-content: center; }
#citizen_Charter .tab_cont_wrap .tab_blockbox .block_set.single div p{ font-size: 25px; text-align: center; font-weight: bold;}
#citizen_Charter .tab_cont_wrap .tab_blockbox .block_set span.plus{ display: block; flex:none; width: 53px; height: 53px; border-radius: 100%;} 
#citizen_Charter .tab_cont_wrap .tab_blockbox .block_set .cellTit{ font-size: 24px;font-weight: bold;} 
#citizen_Charter .tab_cont_wrap .tab_blockbox .block_set .cellTxt{ font-size: 20px; color: #666; margin-top: 30px;} 
#citizen_Charter .tab_cont_wrap .tab_blockbox .block_set .cellTxt span{font-weight: bold; color: #333;} 
#citizen_Charter .tab_cont_wrap .tab_cont2 .tab_blockbox {margin-top: 70px;}

#citizen_Charter .tab_cont_wrap .tab_cont2 .tab_blockbox .block_set .cellTit{ color: #229dca;}
#citizen_Charter .tab_cont_wrap .tab_cont3 .tab_blockbox .block_set .cellTit{ color: #47a75a;}
#citizen_Charter .tab_cont_wrap .tab_cont4 .tab_blockbox .block_set .cellTit{ color: #ef6e00;}

#citizen_Charter .tab_cont_wrap .tab_cont2 .tab_blockbox .tit_block {background-color: #229dca; }
#citizen_Charter .tab_cont_wrap .tab_cont3 .tab_blockbox .tit_block {background-color: #47a75a; }
#citizen_Charter .tab_cont_wrap .tab_cont4 .tab_blockbox .tit_block {background-color: #ef6e00; }
#citizen_Charter .tab_cont_wrap .tab_cont3 .tab_blockbox .block_set{ gap: 0;}
#citizen_Charter .tab_cont_wrap .tab_cont3 .tab_blockbox .block_set span.line{ width: 30px; height: 6px; display: block; background-color: #47a75a;}
#citizen_Charter .tab_cont_wrap .tab_cont3 .tab_blockbox.type02 .block_set div{ height: 240px;}

#citizen_Charter .tab_cont_wrap .tab_blockbox.type02 .big_block{ font-weight: bold; }

#citizen_Charter .tab_cont_wrap .tab_cont4 .tab_blockbox.type02 .big_block{ font-weight: normal; }
#citizen_Charter .tab_cont_wrap .tab_cont4 .tab_blockbox.type02 .big_block span{ font-weight: bold; }
#citizen_Charter .tab_cont_wrap .tab_cont4 .tab_blockbox.type02 .big_block span.small{ font-size: 23px; font-weight: normal; color: #666; display: block;}

#citizen_Charter .tab_cont_wrap .tab_blockbox.type02 .block_set{ gap: 15px; }

#citizen_Charter .tab_cont_wrap .tab_cont2 .tab_blockbox.type02 .big_block{ color: #229dca;}
#citizen_Charter .tab_cont_wrap .tab_cont3 .tab_blockbox.type02 .big_block{ color: #47a75a;}

#citizen_Charter .tab_cont_wrap span.cir_arrow_blue {display: block; margin: 0 auto; width: 52px; height: 52px; border-radius: 100%; background: url('/docs/eng7/jsp/resources/images/common/holdingslink_arrow.png') center no-repeat #229dca; transform: rotate(90deg); margin-top: 90px;}
#citizen_Charter .tab_cont_wrap span.cir_arrow {display: block; margin: 0 auto;width: 36px; height: 36px; border-radius: 100%; background: url('/docs/eng7/jsp/resources/images/common/arrow_grey.png') center no-repeat #eee; transform: rotate(-1);}
#citizen_Charter .tab_cont_wrap span.cir_arrow.reverse {transform: scaleY(-1);}
#citizen_Charter .tab_cont_wrap .tab_botbox.thir .boxBody ul span{ display: block; width: 10px; height: 16px; background: url('/docs/eng7/jsp/resources/images/common/arrow_blue.png') center no-repeat;}

/* 230601 기업시민 CCMS 추가 */
#ccms_overview .inner_box{padding: 60px 40px; border-radius: 50px; border: 2px solid #d3d3d3; color: #333; display: flex; align-items: center; gap: 30px;flex-direction: column;}
#ccms_overview .inner_box .icon{display:block; width: 125px; height: 125px; border-radius: 100%; flex: none; border: 2px solid #d3d3d3 ;}
#ccms_overview .inner_box .inner_box_cell{display: flex;flex-direction: row; gap: 40px;}
#ccms_overview .inner_box div:first-child .icon {background: url('/docs/eng7/jsp/resources/images/esg/citizens/img_ccms_00.png') center 39% no-repeat; background-size: 50%;}
#ccms_overview .inner_box div:last-child .icon {background: url('/docs/eng7/jsp/resources/images/esg/citizens/img_ccms_01.png') center no-repeat; background-size: 50%;}
#ccms_overview .inner_box .box_tit{font-weight: bold; font-size: 22px; color: #00578a;}
#ccms_overview .inner_box .box_txt{font-size: 20px; margin-top: 10px;}
#ccms_overview .inner_box .box_txt span{font-weight: bold;}
#ccms_overview .inner_box .box_txt span.popup{position: relative; display: inline; cursor: pointer; font-weight: normal;}
#ccms_overview .inner_box .box_txt span.popup{position: relative; display: inline; cursor: pointer; font-weight: normal;}
#ccms_overview .inner_box div.popup{display: none; position: absolute; width: 32%; max-width: 400px; padding: 20px; background: #fff; border: 1px solid #000; right: 0;}

#ccms_module .secObj img{ margin: 0 auto;}

#ccms_direction .secText dt::before {content: ''; display: inline-block; vertical-align: middle;background-size: 100% 100%;}
#ccms_direction .secText dt {color: #fff;}
#ccms_direction .secText dt.business {background-color: #229dc9;}
#ccms_direction .secText dt.society {background-color: #47a85b;}
#ccms_direction .secText dt.people {background-color: #f06e00;}
#ccms_direction .secText dt.business::before {background-image: url('/docs/eng7/jsp/resources/images/esg/citizens/business_50x34.png');}
#ccms_direction .secText dt.society::before {background-image: url('/docs/eng7/jsp/resources/images/esg/citizens/society_50x42.png');}
#ccms_direction .secText dt.people::before {background-image: url('/docs/eng7/jsp/resources/images/esg/citizens/peple_50x36.png');}
#ccms_direction .secText dd {border: 1px solid #229dc9; box-sizing: border-box;}
#ccms_direction .secText dd.society {border-color: #47a85b;}
#ccms_direction .secText dd.people {border-color: #f06e00;}
#ccms_direction .secText dd li {font-size: 16px; display: flex; align-items: center; gap: 20px;}
#ccms_direction .secText dd li strong {font-size: 18px; text-indent: 0; color: #333;display: block; font-weight: 600;}
#ccms_direction .secText dd li::before {content: ''; display: inline-block; background-image: url('/docs/eng7/jsp/resources/images/esg/citizens/ccms_icon_003.png'); background-repeat: no-repeat; border: 1px solid #ccc; border-radius: 50%; box-sizing: border-box; flex: none;}
#ccms_direction .secText dd.people li:nth-of-type(2)::before {background-position: 0 -728px;}

#ccms_summary .secText {background: url('/docs/eng7/jsp/resources/images/esg/citizens/ccms_deco.png') 95% 86% no-repeat #eee; border-radius: 20px;padding: 40px 50px; font-size: 18px;}
#ccms_summary .secText .down_btn {margin-top: 40px; width: 350px; max-width: 50%;}

.down_btn {display: block; width: 203px; padding: 14px 20px; font-size: 15px; position: relative;}
.down_btn.darkgrey { background: #25292c; color: #fff;}
.down_btn::after {content:''; display: block; width: 14px; height: 12px; background: url('/docs/eng7/jsp/resources/images/common/download.png') center no-repeat; position: absolute; right: 20px; top: 49%; transform: translateY(-50%);}

/* CCMS : pc */
#ccms_direction .secText .block_wrap {display: flex; gap: 15px;}
#ccms_direction .secText dl {position: relative;}
#ccms_direction .secText dl.block{width: 100%;}
#ccms_direction .secText dt {font-weight: 500; line-height: 80px; border-radius: 13px;}
#ccms_direction .secText dt::before {width: 50px; height: 34px; margin: 0 15px 6px 30px;}
#ccms_direction .secText dt.society::before {height: 42px;}
#ccms_direction .secText dt.people::before {height: 36px;}
#ccms_direction .secText dd {margin-top: 20px; padding: 40px 30px; border-radius: 13px;}
#ccms_direction .secText dd.business {margin-bottom: 50px; display: flex; gap: 30px;}
#ccms_direction .secText dl.block dd {display: flex; align-items: center; height: 250px;}
#ccms_direction .secText dd.business ul {width: 100%; box-sizing: border-box;}
#ccms_direction .secText dd.business ul:first-of-type {padding-right: 17px; }
#ccms_direction .secText dd li {min-height: 60px; margin-bottom: 30px; }
#ccms_direction .secText dd.people li:first-of-type {margin-bottom: 36px;}
#ccms_direction .secText dd li:last-child {margin-bottom: 0;}
#ccms_direction .secText dd li::before {width: 60px; height: 60px; top: 50%;}
#ccms_direction .secText dd li:nth-of-type(2)::before {background-position: 0 -60px;}
#ccms_direction .secText dd li:nth-of-type(3)::before {background-position: 0 -120px;}
#ccms_direction .secText dd li:nth-of-type(4)::before {background-position: 0 -180px;}
#ccms_direction .secText dd li:nth-of-type(5)::before {background-position: 0 -240px;}
#ccms_direction .secText dd li:nth-of-type(6)::before {background-position: 0 -300px;}
#ccms_direction .secText dd ul:nth-of-type(2) li:nth-of-type(1)::before {background-position: 0 -775px;}
#ccms_direction .secText dd ul:nth-of-type(2) li:nth-of-type(2)::before {background-position: 0 -360px;}
#ccms_direction .secText dd ul:nth-of-type(2) li:nth-of-type(3)::before {background-position: 0 -420px;}
#ccms_direction .secText dd ul:nth-of-type(2) li:nth-of-type(4)::before {background-position: 0 -480px;}
#ccms_direction .secText dd ul:nth-of-type(2) li:nth-of-type(5)::before {background-position: -1px -834px;}
#ccms_direction .secText dd.society li:nth-of-type(1)::before {background-position: 0 -540px;}
#ccms_direction .secText dd.society li:nth-of-type(2)::before {background-position: 0 -600px;}
#ccms_direction .secText dd.people li:nth-of-type(1)::before {background-position: 0 -660px;}

/* 5대브랜드 추가 230605 */
/* #citizen_brand_top > .inner{ padding-top: 70px;} */
#citizen_brand_top .cont .tit { font-size: 40px; color: #222; font-weight: bold;}
#citizen_brand_top .cont .tit span.green { color: #47a85b;}
#citizen_brand_top .cont .tit span.together { color: #229dc9;}
#citizen_brand_top .cont .tit span.life { color: #f06e00;}
#citizen_popup_top {display: flex;flex-direction: row; gap: 40px;}
#citizen_popup_top .top_img {flex: none;}
#citizen_popup_top .secText {margin-top: 0;}
#citizen_popup_top span.small {display: block; font-size: smaller; margin-top: 20px;}

  /* green with posco */
  #citizen_zeronet .content1 .obj { float: left; width: 39%; transform: translateY(1%); }
  #citizen_zeronet .content1 .content > li { display: flex; align-items: center; }
  #citizen_zeronet .content1 .content > li + li { margin-top: 10px; }
  #citizen_zeronet .content1 .content > li .tit { text-align: center; line-height: 1.5em; }
  #citizen_zeronet .content1 .content > li .tit .t1 { font-weight: 600;}
  #citizen_zeronet .content1 .content > li .tit .t2 { color: #7c7c7c; }
  #citizen_zeronet .content1 .content > li .arr > img { display: inline-block; }
  #citizen_zeronet .content1 .content > li .arr { text-align: center; }
  #citizen_zeronet .content1 .obj { float: left; width: 39%; transform: translateY(1%); }
  #citizen_zeronet .content1 .content { display: inline-block; width: 61%; }
  #citizen_zeronet .content1 .content > li:nth-child(even) { padding-left: 80px; }
  #citizen_zeronet .content1 .content > li .icon { width: 110px; flex: none; }
  #citizen_zeronet .content1 .content > li .tit { width: 200px; }
  #citizen_zeronet .content1 .content > li .tit .t1 { font-size: 22px; }
  #citizen_zeronet .content1 .content > li .tit .t2 { font-size: 18px; }
  #citizen_zeronet .content1 .content > li .arr { width: 50px; flex: none; margin-right: 10px;}
  #citizen_zeronet .content1 .content > li .text { width: 100%; font-size: 16px;}

  #citizen_zeronet .content1 .together-motion .box { position: relative; width: 1110px; height: 700px; margin: 0 auto; }

  .modal_header .greenate_tit {display: flex; gap: 20px;}
  .modal_header .greenate_tit::after {content: ''; width: 200px; height: 32px; background: url('/docs/kor7/jsp/resources/images/esg/citizens/greenate_logo.png') center bottom / contain no-repeat;}
  #citizen_greenate .content li{display: flex; align-items: center; gap: 30px; margin-bottom: 30px;}
  #citizen_greenate .content li .icon{flex: none; width: 146px;}
  #citizen_greenate .content li .icon img{width: 100%;}
  #citizen_greenate .content li .tit{font-size: 22px; font-weight: 600;}
  #citizen_greenate .content li .text{font-size: 16px; margin-top: 10px;}

  #citizen_video { text-align: center;margin-top:0; }
  #citizen_video .inner{ width: 100%; padding: 0;}
  #citizen_video .text { font-size: 40px; font-weight: 300; line-height: 1.5; }
  #citizen_video .video a { position: relative; display: inline-flex; }
  #citizen_video .video a:before { content: ''; width: 136px; height: 136px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background: url(../images/hyrex/hyrex_video_play.png) center no-repeat; background-size: contain; }

  .citizen_boxlist {width: 100%; display: flex; flex-direction: column; align-items: center; background-color: #eee; border-radius: 10px; box-sizing: border-box; padding: 60px 40px;}
  .citizen_boxlist .line { width: 3px; height: 16px; display: block; }
  .citizen_boxlist .line.green { background-color: #47a75a;}
  .citizen_box {width: 100%; padding: 30px; box-sizing: border-box; background-color: #fff; border-radius: 15px; font-size: 18px; display: flex; justify-content: center; align-items: center; }   
  .citizen_box span{font-size: 22px; font-weight: bold; text-align: center;}   
  .citizen_box.green{background-color: #47a75a; color: #fff;}   

  .citizen_boxlist li:last-child::before,
  .citizen_boxlist_in li div::before{content: ''; display: block; flex: none;}

  #citizen_Marine .citizen_boxlist li:last-child::before{width: 68px; height: 36px; background: url(../images/esg/citizens/marine_icon.png) center no-repeat; margin-right: 10px;}

  .citizen_boxlist_in {display: flex; gap: 20px; width: 100%;}
  .citizen_boxlist_in.type2 {flex-direction: column;}
  .citizen_box_in {display: flex; flex-direction: column; align-items: center; width: 100%;}
  .citizen_box_in div {height: 100px; width: 100%; box-sizing: border-box; border-radius: 15px; background-color: #fff;    display: flex; flex-direction: row; align-items: center; justify-content: center;}
  .citizen_boxlist .column{flex-direction: column;}
  .citizen_box_in div.column{height: auto; min-height: 140px; padding: 0 10px; gap: 5px; }
  .citizen_box_in p{font-size: 18px; text-align: center;}
  .citizen_box_in p span{display: block; width: 100%; text-align: center; }
 
  #citizen_oceon .citizen_boxlist_in li:first-child div::before{ width: 45px; height: 47px; background: url(../images/esg/citizens/oceon_icon_01.png) center no-repeat; margin-right: 10px;}
  #citizen_oceon .citizen_boxlist_in li:last-child div::before{ width: 45px; height: 40px; background: url(../images/esg/citizens/oceon_icon_02.png) center no-repeat; margin-right: 10px;}

  /* together with posco */
  .citizen_box.together{background-color: #229dc9; color: #fff;}   
  #citizen_benefit .citizen_boxlist_in li:first-child div::before{ width: 35px; height: 47px; background: url(../images/esg/citizens/Benefit_icon_01.png) center no-repeat; background-size: contain; margin-right: 10px; display: block;}
  #citizen_benefit .citizen_boxlist_in li:last-child div::before{ width: 36px; height: 32px; background: url(../images/esg/citizens/Benefit_icon_02.png) center no-repeat; background-size: contain; margin-right: 10px;}
  .citizen_boxlist .line.together { background-color: #229dc9;}

  #citizen_smart .citizen_boxlist li:last-child::before{width: 35px; height: 45px; background: url(../images/esg/citizens/brands_smart_icon.png) center no-repeat; background-size: contain; margin-right: 10px;}

  #citizen_esg .citizen_boxlist_in li:first-child div::before{width: 37px; height: 50px; background: url(../images/esg/citizens/brands_esg_icon_01.png) center no-repeat; background-size: contain; margin-right: 10px;}
  #citizen_esg .citizen_boxlist_in li:last-child div::before{width: 45px; height: 38px; background: url(../images/esg/citizens/brands_esg_icon_02.png) center no-repeat; background-size: contain; margin-right: 10px;}

  #citizen_venture .citizen_boxlist li:last-child::before{width: 47px; height: 50px; background: url(../images/esg/citizens/brands_venture_icon_01.png) center no-repeat; background-size: contain; margin-right: 10px;}
  #citizen_venture .citizen_boxlist_in li:first-child div::before{width: 47px; height: 50px; background: url(../images/esg/citizens/brands_venture_icon_01.png) center no-repeat; background-size: contain; margin-right: 10px;}
  #citizen_market .citizen_boxlist li:last-child::before,
  #citizen_venture .citizen_boxlist_in li:last-child div::before{width: 45px; height: 48px; background: url(../images/esg/citizens/brands_venture_icon_02.png) center no-repeat; background-size: contain; margin-right: 10px;}

  #citizen_fund .citizen_boxlist li:last-child::before{width: 35px; height: 45px; background: url(../images/esg/citizens/brands_fund_icon.png) center no-repeat; background-size: contain; margin-right: 10px;}

  /* life with posco */
  .citizen_box.life{background-color: #ef6e00; color: #fff;}   
  .citizen_boxlist .line.life {background-color: #ef6e00;}

  #citizen_lowbirth .citizen_boxlist_in li:first-child div::before{width: 35px; height: 41px; background: url(../images/esg/citizens/brands_life_icon_01.png) center no-repeat; background-size: contain; margin-right: 10px;}
  #citizen_lowbirth .citizen_boxlist_in li:nth-child(2) div::before{width: 52px; height: 42px; background: url(../images/esg/citizens/brands_life_icon_02.png) center no-repeat; background-size: contain; margin-right: 10px;}
  #citizen_lowbirth .citizen_boxlist_in li:nth-child(3) div::before{width: 47px; height: 42px; background: url(../images/esg/citizens/brands_life_icon_03.png) center no-repeat; background-size: contain; margin-right: 10px;}
  #citizen_lowbirth .citizen_boxlist_in li:nth-child(4) div::before{width: 45px; height: 42px; background: url(../images/esg/citizens/brands_life_icon_04.png) center no-repeat; background-size: contain; margin-right: 10px;}
  #citizen_lowbirth .citizen_boxlist_in li:nth-child(5) div::before{width: 43px; height: 43px; background: url(../images/esg/citizens/brands_life_icon_05.png) center no-repeat; background-size: contain; margin-right: 10px;}

  #citizen_Academy .citizen_boxlist_in li:first-child div::before{width: 43px; height: 50px; background: url(../images/esg/citizens/brands_life_icon_06.png) center no-repeat; background-size: contain; margin-right: 10px;}
  #citizen_Academy .citizen_boxlist_in li:last-child div::before{width: 45px; height: 38px; background: url(../images/esg/citizens/brands_life_icon_07.png) center no-repeat; background-size: contain; margin-right: 10px;}

/*  #citizen_futuregen .citizen_boxlist_in li:first-child div::before{width: 43px; height: 50px; background: url(../images/esg/citizens/brands_life_icon_08.png) center no-repeat; background-size: contain; margin-right: 10px;}*/
  #citizen_futuregen .citizen_boxlist_in li:first-child div::before{width: 43px; height: 50px; background: url(../images/esg/citizens/brands_life_icon_09.png) center no-repeat; background-size: contain; margin-right: 10px;}
  #citizen_futuregen .citizen_boxlist_in li:nth-child(2) div::before{width: 45px; height: 38px; background: url(../images/esg/citizens/brands_life_icon_10.png) center no-repeat; background-size: contain; margin-right: 10px;}

  #citizen_beyond .citizen_boxlist ul:last-child {margin-top: 20px;}
  #citizen_beyond .citizen_boxlist ul li:first-child div::before{width: 50px; height: 56px; background: url(../images/esg/citizens/brands_life_icon_11.png) center no-repeat; background-size: contain; margin-right: 10px;}
  #citizen_beyond .citizen_boxlist ul li:nth-child(2) div::before{width: 52px; height: 42px; background: url(../images/esg/citizens/brands_life_icon_12.png) center no-repeat; background-size: contain; margin-right: 10px;}
  #citizen_beyond .citizen_boxlist ul:last-child li:first-child div::before{width: 47px; height: 42px; background: url(../images/esg/citizens/brands_life_icon_13.png) center no-repeat; background-size: contain; margin-right: 10px;}
  #citizen_beyond .citizen_boxlist ul:last-child li:nth-child(2) div::before{width: 52px; height: 42px; background: url(../images/esg/citizens/brands_life_icon_02.png) center no-repeat; background-size: contain; margin-right: 10px;}
  #citizen_beyond .citizen_boxlist ul:last-child li:nth-child(3) div::before{width: 43px; height: 43px; background: url(../images/esg/citizens/brands_life_icon_14.png) center no-repeat; background-size: contain; margin-right: 10px;}

  #citizen_volunteer .citizen_boxlist_in li:first-child div::before{width: 43px; height: 50px; background: url(../images/esg/citizens/brands_community_icon_01.png) center no-repeat; background-size: contain; margin-right: 10px;}
  #citizen_volunteer .citizen_boxlist_in li:nth-child(2) div::before{width: 45px; height: 38px; background: url(../images/esg/citizens/brands_community_icon_02.png) center no-repeat; background-size: contain; margin-right: 10px;}
  #citizen_volunteer .citizen_boxlist_in li:last-child div::before{width: 45px; height: 38px; background: url(../images/esg/citizens/brands_community_icon_03.png) center no-repeat; background-size: contain; margin-right: 10px;}

/* 기업시민 뉴스 & 사이트 */
#cc_sec_news01 > .inner {padding: 120px 0 60px; }
#cc_sec_news01 .tit {font-size: 48px;}

#cc_sec_news02 { background-color: #f6f8f9; }
#cc_sec_news02 > .inner {padding: 200px 0 120px;}
#cc_sec_news02 ul { display: flex; margin-left: -50px; }
#cc_sec_news02 ul .item { margin-left: 50px; width: 100%; }
#cc_sec_news02 ul .item > .inner { display: flex; flex-direction: column; background-color: #fff; }
#cc_sec_news02 ul .item .img { overflow: hidden; }
#cc_sec_news02 ul .item .img > div { width: 100%; height: 0; padding-top: 70%; background-size: cover; background-repeat: no-repeat; background-position: center; }
#cc_sec_news02 ul .item .dec { padding: 30px 35px; }
#cc_sec_news02 ul .item .tit { font-size: 23px; font-weight: 600; color: #000; line-height: 1.45; height: 67px; overflow: hidden; }
#cc_sec_news02 ul .item .date { font-size: 16px; color: #000; margin-top: 10px; }
#cc_sec_news02 .more { position: absolute; top: 120px; right: 0; }
#cc_sec_news02 .more a { display: flex; align-items: center; font-size: 19px; font-weight: 500; }
#cc_sec_news02 .more a:after {  content: ''; width: 10px; height: 10px; margin-left: 10px; border-bottom: 2px solid #000; border-right: 2px solid #000; transform: rotate(-45deg); }

#cc_sec_news03 .lst-thumb-type1 > .item .lft {width: 42%;}
#cc_sec_news03 .lst-thumb-type1 .item .t2 {font-size: 2.75em;}
#cc_sec_news03 > .inner {padding: 120px 0 60px;}
#cc_sec_news03 .tit {font-size: 48px;}

.terms p { margin-top: 40px; }
.terms p.sizeup { font-size: 18px; font-weight: 600; line-height: 35px; }
.terms dl dt { font-size: 20px; color: #333; font-weight: 600; padding-top: 20px; }
.terms dl dd { margin-top: 20px; line-height: 24px; padding-left: 20px; }
.terms .list-style01, .terms .list-style04 { margin: 15px 0 25px; }
.terms .btn-select a, 
.terms .btn-select button { display: inline-block; line-height: 45px; background: #005891; color: #fff; padding: 0 20px; vertical-align: middle; margin-left: 5px; }
.terms .media-more-foot { margin-top: 100px; border-top: 1px solid #e5e5e5; padding-top: 30px; }
.terms .media-more-foot a { line-height: 43px; font-weight: 600; padding: 0 30px; border: 1px solid #666; display: inline-block; }
.terms .media-more-foot a img { margin-left: 10px; }

.terms h4 { font-size: 26px; color: #333; font-weight: 500; padding-top: 60px; }
.terms h5 { font-size: 20px; color: #005891; font-weight: 700; padding-top: 60px; }

.terms .list-style01 { margin-top: 20px; }
.terms .list-style01 > li { line-height: 24px; padding-left: 10px; text-align: left; background: url("../images/common/bu_line.png") no-repeat 0 12px; font-size: 15px; font-weight: normal; margin-bottom: 10px; }

.terms .list-style02 { margin-top: 20px; }
.terms .list-style02 > li { line-height: 24px; padding-left: 10px; text-align: left; background: url("../mages/common/bu_box.png") no-repeat 0 12px; font-size: 15px; color: #444; }
.terms .list-style02 > li p { font-weight: normal; line-height: 26px; margin-bottom: 10px; }

.terms .list-style03 { margin-top: 40px; }
.terms .list-style03 > li { list-style: decimal; margin-left: 20px; line-height: 24px; margin-bottom: 10px; }

.terms .list-style04 { margin-top: 20px; }
.terms .list-style04 > li { position: relative; padding-left: 20px; line-height: 24px; font-size: 15px; }
.terms .list-style04 > li span { position: absolute; top: 0; left: 0; font-size: 15px; }


.terms table { border-top: 2px solid #333; width: 100%; margin-top: 30px; }
.terms table th { border-bottom: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; padding: 20px 30px; color: #333; font-weight: 700; background: #f5f5f5; vertical-align: middle; text-align: center; line-height: 22px; }
.terms table tbody th { background: none; }
.terms table tbody th.bg { background: rgba(0, 88, 145, 0.08); }
.terms table tbody th.left { text-align: left; }
.terms table td { border-bottom: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; padding: 20px 15px; vertical-align: middle; text-align: center; line-height: 24px; }
.terms table td .stroke { display: inline-block; line-height: 43px; border: 1px solid #005891; color: #005891; font-weight: 700; padding: 0 30px; float: right; }
.terms table td.bg { background: rgba(0, 88, 145, 0.08); }
.terms table td.title { text-align: left; font-weight: 700; color: #333; }
.terms table td.left { text-align: left; padding: 20px 30px; }
.terms table th:last-child, table td:last-child { border-right: none; }
.terms table th.boR, table td.boR { border-right: 1px solid #e5e5e5; }
.terms table td.bdright { border-right: 1px solid #e5e5e5; }
.terms table tfoot td { background: rgba(0, 88, 145, 0.08); }
.terms table caption { font-size: 0; height: 0; line-height: 0; width: 0; overflow: hidden; }

.terms table.investor td { text-align: right; padding: 20px 20px; }
.terms table.investor-meet {border : 1px solid #666666;}
.terms table.investor-meet td {text-align: center; border : 1px solid #666666;}
.terms table.investor-meet th {font-weight: 400; border : 1px solid #666666;}

.terms table.row th { background: #f5f5f5; }
.terms table.row td { text-align: left; padding: 20px 30px; }

.terms .btn-select { display: flex; max-width: 320px; }
.terms .btn-solid { width: 120px; flex: none; }

.terms .msg_touch_help { display: none; }

.viewZoom { position: relative; }
.viewZoom .zoomInBtn { font-size: 18px; color: #222; position: absolute; top: 0; right: 0; display: flex; align-items: center; cursor: pointer; border: 0; background-color: transparent; line-height: 1; }
.viewZoom .zoomInBtn:after { content: ''; width: 35px; height: 35px; margin-left: 10px; border: 1px solid #d5d5d5; border-radius: 5px; cursor: pointer; background-repeat: no-repeat; background-size: 60%; background-position: center; background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Svg Vector Icons : http://www.onlinewebfonts.com/icon --%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1000 1000' enable-background='new 0 0 1000 1000' xml:space='preserve'%3E%3Cmetadata%3E Svg Vector Icons : http://www.onlinewebfonts.com/icon %3C/metadata%3E%3Cg%3E%3Cpath d='M965.1,845l-176-176c44.5-67.1,70.4-147.7,70.4-234.2C859.5,200.2,669.4,10,434.8,10C200.2,10,10,200.2,10,434.8c0,234.6,190.2,424.8,424.8,424.8c86.6,0,167.1-25.9,234.2-70.4l176,176c33.2,33.2,87,33.2,120.1,0C998.3,931.9,998.3,878.1,965.1,845z M751.1,568.3c-17.3,40.9-42,77.6-73.6,109.1c-31.5,31.5-68.3,56.3-109.1,73.6c-42.3,17.9-87.2,26.9-133.6,26.9c-46.4,0-91.3-9.1-133.6-26.9c-40.9-17.3-77.6-42-109.1-73.6c-31.5-31.5-56.3-68.3-73.6-109.1c-17.9-42.3-26.9-87.2-26.9-133.6c0-46.4,9.1-91.3,26.9-133.6c17.3-40.9,42-77.6,73.6-109.1c31.5-31.5,68.3-56.3,109.1-73.6c42.3-17.9,87.2-26.9,133.6-26.9c46.4,0,91.3,9.1,133.6,26.9c40.9,17.3,77.6,42,109.1,73.6c31.5,31.5,56.3,68.3,73.6,109.1c17.9,42.3,26.9,87.2,26.9,133.6C778,481.1,768.9,526.1,751.1,568.3z M615.2,392.3h-138v-138c0-22.5-18.3-40.8-40.8-40.8h-3.4c-22.5,0-40.8,18.3-40.8,40.8v138h-138c-22.5,0-40.8,18.3-40.8,40.8v3.4c0,22.5,18.3,40.8,40.8,40.8h138v138c0,22.5,18.3,40.8,40.8,40.8h3.4c22.5,0,40.8-18.3,40.8-40.8v-138h138c22.5,0,40.8-18.3,40.8-40.8v-3.4C656,410.6,637.7,392.3,615.2,392.3z'/%3E%3C/g%3E%3C/svg%3E"); }
.viewZoom_m .zoomInBtn { visibility: hidden; }
.viewZoom_btnTopOver .zoomInBtn { top: auto; bottom: 100%; margin-bottom: 10px; }
#viewZoomLayer { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1000; background-color: #000; visibility: hidden; opacity: 0; 
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
#viewZoomLayer.showIn { visibility: visible; opacity: 1; }
#viewZoomLayer .close { font-size: 0; position: absolute; top: 20px; right: 70px; z-index: 2; width: 50px; height: 50px; background-color: rgba(0, 0, 0, 0.6); background-size: 50%; background-repeat: no-repeat; background-position: center; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.82 31.82'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23ffffff;%7D%3C/style%3E%3C/defs%3E%3Cpolygon class='cls-1' points='30.41 0 0 30.41 1.41 31.82 31.82 1.42 31.82 1.41 30.41 0'/%3E%3Cpolygon class='cls-1' points='1.41 0 0 1.41 30.41 31.82 31.82 30.41 31.82 30.41 1.41 0'/%3E%3C/svg%3E"); }
#viewZoomLayer .zoomController { position: absolute; bottom: 20px; left: 50%; z-index: 2; transform: translateX(-50%); border-radius: 2px; background-color: rgba(0, 0, 0, 0.6); padding: 10px; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; display: flex; }
#viewZoomLayer .zoomController .range { -webkit-appearance: none; appearance: none; width: 100%; height: 1px; background: #fff; margin: 0px 10px; outline: none; }
#viewZoomLayer .zoomController .range::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 20px;  height: 20px; background: #fff; border-radius: 100%; cursor: pointer; }
#viewZoomLayer .zoomController .minus,
#viewZoomLayer .zoomController .plus { height: 32px; width: 32px; padding: 10px; flex-shrink: 0; cursor: pointer; }
#viewZoomLayer #openseadragon { width: 100%; height: 100%; position: relative; overflow: hidden; }


#media_vod_section { height: 0; padding-top: 56.25%; position: relative; margin-bottom: 60px; }
#media_vod_section iframe { position: absolute; top: 0; left: 0; right: 0; bottom: 0; }


.find_account_wrap > .inner { max-width: 1250px; }
.find_account_wrap .head { margin-bottom: 30px; }
.find_account_wrap .head .tit { font-size: 26px; font-weight: 500; }
.find_account_wrap .head .txt { font-size: 20px; font-weight: 300; }
.find_account_wrap .body { background-color: #f7f7f7; }
.find_account_wrap .body ul { display: flex; padding: 35px 60px; margin-left: -40px; }
.find_account_wrap .body ul li { width: 100%; box-sizing: border-box; text-align: center; background-color: #fff; border-radius: 8px; border: 1px solid #dedede; padding: 70px 50px; margin-left: 40px; box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.12); }
.find_account_wrap .body ul li .ico { margin-bottom: 10px; }
.find_account_wrap .body ul li .tit { font-size: 22px; }
.find_account_wrap .body ul li .btn { margin-top: 30px; width: 200px; height: 50px; border-radius: 0; }


.certi_form .tit { font-size: 18px; margin-bottom: 5px; }
.certi_form *+.tit { margin-top: 30px; }
.certi_form .ipt { width: 100%; }
.certi_form .btn { margin-top: 30px; width: 100%; }




#cultural_schedule { max-width: 1460px; width: 90%; margin: 0 auto; margin-bottom: 60px; background-color: #fff; padding: 60px 40px; padding-top: 30px; box-sizing: border-box; border: 1px solid #d1d1d1; box-shadow: 2px 5px 12px 0px rgba(0, 0, 0, 0.15); }
#cultural_schedule .head { border-bottom: 1px solid #e2e2e2; margin-bottom: 40px; padding-bottom: 20px; display: flex; align-items: center; justify-content: space-between; }
#cultural_schedule .head > ul { display: flex; align-items: center; padding: 0 15px; }
#cultural_schedule .head > ul li { width: 100%; color: #bfbfbf; font-size: 20px; }
#cultural_schedule .head > ul li + li { margin-left: 40px; }
#cultural_schedule .head > ul li a { color: #333; position: relative; }
#cultural_schedule .head > ul li.active a { color: #005c9c; flex-wrap: 600; } 
#cultural_schedule .head > ul li.active a:before { content: ''; width: 8px; height: 8px; border-radius: 50%; background-color: #005c9c; position: absolute; top: -20px; left: 50%; margin-left: -4px; }


#cultural_schedule .head > div { margin-left: 40px; }
#cultural_schedule .head > div .btn { border-color: #aab4bd; color: #50667d; font-size: 16px; border-radius: 0; height: 40px; background-color: #fff; }
#cultural_schedule .head > div .btn img { margin-right: 15px; }
#cultural_schedule .body { display: flex; align-items: stretch; }
#cultural_schedule .body .img { display: flex; align-items: center; justify-content: center; box-sizing: border-box; padding: 40px; background-color: #f8f8f8; margin-right: 75px; width: 450px; flex: none; }
#cultural_schedule .body .cont { padding: 30px 0; }
#cultural_schedule .body .cont .cate { font-size: 20px; color: #333; margin-bottom: 10px; }
#cultural_schedule .body .cont .title { font-size: 30px; color: #333; font-weight: 500; }
#cultural_schedule .body .cont .text { font-size: 16px; color: #818181; height: 90px; margin-top: 30px; overflow: hidden; }

#cultural_schedule .body .cont .list { margin-top: 20px; border-top: 1px solid #d2d2d2; border-bottom: 1px solid #d2d2d2; padding: 20px 0; } 
#cultural_schedule .body .cont .list ul li { display: flex; align-items: center; }
#cultural_schedule .body .cont .list ul li + li { margin-top: 20px; }
#cultural_schedule .body .cont .list ul li > * { flex: none; box-sizing: border-box; padding: 0 20px; text-align: center; font-size: 14px; color: #50667d; }
#cultural_schedule .body .cont .list ul li > .local { font-weight: 600; }
#cultural_schedule .body .cont .list ul li > .tit { width: 100%; flex: auto; text-align: left; }
#cultural_schedule .body .cont .list ul li > .date { width: 140px; }
#cultural_schedule .body .cont .list ul li > .label { width: 160px; }
#cultural_schedule .body .cont .list ul li > .label span { width: 100%; height: 30px; display: flex; align-items: center; justify-content: center; background-color: #b2b2b2; border-radius: 30px; color: #fff; }
#cultural_schedule .body .cont .list ul li > .label span.end { background-color: #b2b2b2; }
#cultural_schedule .body .cont .list ul li > .label span.now { background-color: #00b8ff; }
#cultural_schedule .body .cont .list ul li > .label span.soon { background-color: #a0b8d1; }





.main-page-section { width: 100%; height: 100vh; display: flex; align-items: center; position: relative; overflow: hidden; }

.main-page-section.over {height: 100%;}

.main-page-section * { box-sizing: border-box; }
.main-page-section > .inner { margin: 0 auto; max-width: 1460px; width: 90%; position: relative; padding: 100px 0; }

#main-visual { position: relative; }
#main-visual .viewMore { position: absolute; left: 50%; bottom: 70px; z-index: 5; transform: translateX(-50%); text-align: center; font-size: 12px; font-weight: 600; color: #fff; text-transform: uppercase; display: flex; flex-direction: column; align-items: center; }
#main-visual .viewMore:after { content: ''; width: 12px; height: 12px; border-bottom: 3px solid #fff; border-left: 3px solid #fff; transform: rotate(-45deg); }
#main-visual-slider { width: 100%; }
#main-visual-slider .swiper-slide { position: relative; width: 100%; height: 100vh; }
#main-visual-slider .swiper-slide .cont { position: relative; z-index: 2; height: 100%; display: flex; align-items: center; width: 90%; max-width: 1460px; margin: 0 auto; }
#main-visual-slider .swiper-slide .cont > div { max-width: 730px; }
#main-visual-slider .swiper-slide .cont .tit { font-size: 23px; font-weight: 600; color: #fff; margin-bottom: 40px; line-height: 1; }
#main-visual-slider .swiper-slide .cont .txt { font-size: 65px; font-weight: 600; color: #fff; line-height: 1.35; }
#main-visual-slider .swiper-slide .bg { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; background-color: #dedede; }
#main-visual-slider .swiper-slide .bg > div { width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; }
/* #main-visual-slider .swiper-slide .bg > video { min-width: 100%; min-height: 100%; } 230530 생략 */
#main-visual-slider .swiper-slide .bg > video {display: block; min-width: 100%; min-height: 100vh; width: 100%; height: auto; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
#main-visual-slider .swiper-slide .bg > video.mo {display: none;} /* 230530 추가 */
#main-visual-slider .swiper-nav { position: absolute; bottom: 30%; left: 0; z-index: 3; width: 100%;  }
#main-visual-slider .swiper-nav > div { width: 92%; max-width: 1460px; margin: 0 auto; display: flex; align-items: center; }
#main-visual-slider .swiper-page { display: inline-flex; width: 365px; }
#main-visual-slider .swiper-page .swiper-pagination-bullet { width: 100%; height: 2px; border-radius: 0; background-color: #fff; opacity: 0.4; }
#main-visual-slider .swiper-page .swiper-pagination-bullet-active { opacity: 1; }
#main-visual-slider .swiper-page .swiper-pagination-bullet b { font-size: 14px; color: #fff; margin-top: 5px; display: inline-block; }
#main-visual-slider .swiper-prev { margin-left: 40px; width: 20px; height: 20px; border: 0; border-bottom: 3px solid #fff; border-left: 3px solid #fff; font-size: 0; background-color: transparent; transform: rotate(45deg); cursor: pointer; }
#main-visual-slider .swiper-next { width: 20px; height: 20px; border: 0; border-bottom: 3px solid #fff; border-right: 3px solid #fff; font-size: 0; background-color: transparent; transform: rotate(-45deg); cursor: pointer; }
#main-visual-slider .playPause { width: 40px; height: 40px; border: 0; margin: 0 20px; background-size: contain; background-repeat:no-repeat; background-position:center; cursor:pointer; background-color: transparent; font-size:0; }
#main-visual-slider .playPause.play { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='39px' height='39px'%3E%3Cpath fill-rule='evenodd' fill='rgb(255, 255, 255)' d='M25.104,19.499 L17.104,24.297 L17.104,14.702 L25.104,19.499 Z'/%3E%3Cpath fill-rule='evenodd' stroke-width='1px' stroke='rgb(255, 255, 255)' fill-opacity='0' fill='rgb(0, 0, 0)' d='M19.499,3.499 C28.336,3.499 35.499,10.663 35.499,19.499 C35.499,28.336 28.336,35.499 19.499,35.499 C10.663,35.499 3.499,28.336 3.499,19.499 C3.499,10.663 10.663,3.499 19.499,3.499 Z'/%3E%3C/svg%3E"); }
#main-visual-slider .playPause.pause { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='39px' height='39px'%3E%3Cpath fill-rule='evenodd' fill='rgb(255, 255, 255)' d='M21.899,24.299 L21.899,14.699 L24.299,14.699 L24.299,24.299 L21.899,24.299 ZM15.499,14.699 L17.899,14.699 L17.899,24.299 L15.499,24.299 L15.499,14.699 Z'/%3E%3Cpath fill-rule='evenodd' stroke-width='1px' stroke='rgb(255, 255, 255)' fill-opacity='0' fill='rgb(0, 0, 0)' d='M19.499,3.499 C28.336,3.499 35.499,10.663 35.499,19.499 C35.499,28.336 28.336,35.499 19.499,35.499 C10.663,35.499 3.499,28.336 3.499,19.499 C3.499,10.663 10.663,3.499 19.499,3.499 Z'/%3E%3C/svg%3E"); }



#main-brand > .inner { height: 100%; display: flex; align-items: center; position: static; }
#main-brand .cont { width: 50%; padding-right: 120px; box-sizing: border-box; }
#main-brand .cont .tit { font-size: 54px; color: #000; font-weight: 500; line-height: 1.4; }
#main-brand .cont .txt { font-size: 20px; color: #000; line-height: 1.9; margin-top: 20px; }
#main-brand .cont ul { margin-top: 50px; width: 325px; }
#main-brand .cont ul li { border-bottom: 1px solid #dde6ef; }
#main-brand .cont ul li a { display: flex; align-items: center; justify-content: space-between; width: 100%; height: 80px; }
#main-brand .cont ul li a:after { content: ''; width: 10px; height: 10px; border-bottom: 2px solid #000; border-right: 2px solid #000; transform: rotate(-45deg); box-sizing: border-box; margin-right: 10px; }
#main-brand .cont ul li a.playBtn:after {display: none;} /* 230519 추가 */
#main-brand .cont ul li a:hover .t { display: none; }
#main-brand .cont ul li a:hover .logo { display: block; }
#main-brand .cont ul li .t { display: flex; align-items: center; justify-content: space-between; width: 100%; height: 80px; font-size: 16px; color: #000; font-weight: 600; }
#main-brand .cont ul li .logo { display: none; padding: 20px 0; }
#main-brand .cont ul li .logo img { display: block; }
#main-brand .cont ul li .video { display: none; align-items: center; justify-content: center; position: absolute; top: 0; left: 50%; width: 50%; height: 100%; background-color: #000; }
#main-brand .cont ul li .video .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; opacity: 1; }
#main-brand .cont ul li .video .playBtn { position: relative; z-index: 1; width: 70px; height: 70px; font-size: 0; background-size: contain; background-repeat: no-repeat; background-position: center; background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='a' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 777.49 777.49'%3E%3Cdefs%3E%3Cstyle%3E.b%7Bfill:%23ffffff;%7D%3C/style%3E%3C/defs%3E%3Cpath class='b' d='M746.94,237.42c-19.58-46.29-47.61-87.87-83.31-123.56-35.7-35.7-77.27-63.72-123.56-83.31C492.13,10.28,441.22,0,388.75,0s-103.39,10.28-151.32,30.56c-46.29,19.58-87.87,47.61-123.56,83.31-35.7,35.7-63.72,77.27-83.3,123.56C10.28,285.36,0,336.27,0,388.75s10.28,103.39,30.56,151.32c19.58,46.29,47.61,87.87,83.3,123.56,35.7,35.7,77.27,63.72,123.56,83.31,47.94,20.28,98.85,30.56,151.32,30.56s103.39-10.28,151.32-30.56c46.29-19.58,87.87-47.61,123.56-83.31,35.7-35.7,63.72-77.27,83.31-123.56,20.28-47.94,30.56-98.85,30.56-151.32s-10.28-103.39-30.56-151.32Zm-105.2,404.31c-67.58,67.58-157.42,104.79-252.99,104.79s-185.41-37.22-252.99-104.79c-67.58-67.58-104.79-157.42-104.79-252.99s37.22-185.41,104.79-252.99C203.33,68.18,293.18,30.96,388.75,30.96s185.41,37.22,252.99,104.79c67.58,67.58,104.79,157.42,104.79,252.99s-37.22,185.41-104.79,252.99Z'/%3E%3Cpath class='b' d='M566.33,375.04L297.36,233.79c-4.8-2.52-10.57-2.34-15.21,.46-4.64,2.8-7.47,7.83-7.47,13.25v282.5c0,5.42,2.84,10.45,7.47,13.25,2.46,1.48,5.23,2.23,8.01,2.23,2.47,0,4.94-.59,7.2-1.77l268.98-141.25c5.09-2.67,8.28-7.95,8.28-13.71s-3.19-11.03-8.28-13.71Zm-260.69,129.34v-231.27l220.2,115.63-220.2,115.63Z'/%3E%3C/svg%3E"); top: 33%; }
/*#main-brand .cont ul li.active .t { display: none; }
#main-brand .cont ul li.active .logo { display: block; }*/
#main-brand .cont ul li.active .t { color: #099de8; }
#main-brand .cont ul li.active .video { display: flex; }

#main-carbon { border-bottom: solid 1px #dcdae7; }
#main-carbon > .inner { position: static; display: flex; align-items: center; flex-direction: row-reverse; }
#main-carbon > .inner > * { width: 50%; }
#main-carbon .cont { padding-left: 130px; box-sizing: border-box; }
#main-carbon .cont .tit { font-size: 54px; font-weight: 500; margin-bottom: 30px; line-height: 1.25; }
#main-carbon .cont .txt1 { font-size: 30px; font-weight: 600; margin-bottom: 30px; line-height: 1.5; }
#main-carbon .cont .txt1 span { color: #58ae29; }
#main-carbon .cont .txt2 { font-size: 20px; line-height: 1.9; }

/* 230510 추가 */
#main-carbon .cont ul { margin-top: 10px; width: 325px; }
#main-carbon .cont ul li { border-bottom: 1px solid #dde6ef; }
#main-carbon .cont ul li a { display: flex; align-items: center; justify-content: space-between; width: 100%; height: 70px; }
#main-carbon .cont ul li a:after { content: ''; width: 10px; height: 10px; border-bottom: 2px solid #000; border-right: 2px solid #000; transform: rotate(-45deg); box-sizing: border-box; margin-right: 10px; }
#main-carbon .cont ul li .t { display: flex; align-items: center; justify-content: space-between; width: 100%; height: 70px; font-size: 20px; color: #000; font-weight: bold; }
#main-carbon .cont ul li:hover .t { color: #099de8; }

#main-carbon .video { position: absolute; right: 50%; top: 0; height: 100%; display: flex; align-items: center; justify-content: center;}

/*#main-carbon .video { position: absolute; right: 50%; top: 0; height: 100%; display: flex; align-items: center; background-color: #dedede; background-position: center; background-repeat: no-repeat; background-size: cover; background-image: url(../images/main/main_carbon_img.jpg); }*/

/* 230510 추가 */
/*#main-carbon .video a { width: 100%; height: 100%; padding-top: 56.25%; background-color: #dedede; background-position: center; background-repeat: no-repeat; background-size: cover; background-image: url(../images/main/main_carbon_img.jpg); }*/
#main-carbon .video .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center;}/*230406 opacity: 0.6; 삭제*/
#main-carbon .video .playBtn{ position: relative; z-index: 1; width: 70px; height: 70px; font-size: 0; background-size: contain; background-repeat: no-repeat; background-position: center; background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='a' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 777.49 777.49'%3E%3Cdefs%3E%3Cstyle%3E.b%7Bfill:%23ffffff;%7D%3C/style%3E%3C/defs%3E%3Cpath class='b' d='M746.94,237.42c-19.58-46.29-47.61-87.87-83.31-123.56-35.7-35.7-77.27-63.72-123.56-83.31C492.13,10.28,441.22,0,388.75,0s-103.39,10.28-151.32,30.56c-46.29,19.58-87.87,47.61-123.56,83.31-35.7,35.7-63.72,77.27-83.3,123.56C10.28,285.36,0,336.27,0,388.75s10.28,103.39,30.56,151.32c19.58,46.29,47.61,87.87,83.3,123.56,35.7,35.7,77.27,63.72,123.56,83.31,47.94,20.28,98.85,30.56,151.32,30.56s103.39-10.28,151.32-30.56c46.29-19.58,87.87-47.61,123.56-83.31,35.7-35.7,63.72-77.27,83.31-123.56,20.28-47.94,30.56-98.85,30.56-151.32s-10.28-103.39-30.56-151.32Zm-105.2,404.31c-67.58,67.58-157.42,104.79-252.99,104.79s-185.41-37.22-252.99-104.79c-67.58-67.58-104.79-157.42-104.79-252.99s37.22-185.41,104.79-252.99C203.33,68.18,293.18,30.96,388.75,30.96s185.41,37.22,252.99,104.79c67.58,67.58,104.79,157.42,104.79,252.99s-37.22,185.41-104.79,252.99Z'/%3E%3Cpath class='b' d='M566.33,375.04L297.36,233.79c-4.8-2.52-10.57-2.34-15.21,.46-4.64,2.8-7.47,7.83-7.47,13.25v282.5c0,5.42,2.84,10.45,7.47,13.25,2.46,1.48,5.23,2.23,8.01,2.23,2.47,0,4.94-.59,7.2-1.77l268.98-141.25c5.09-2.67,8.28-7.95,8.28-13.71s-3.19-11.03-8.28-13.71Zm-260.69,129.34v-231.27l220.2,115.63-220.2,115.63Z'/%3E%3C/svg%3E"); top: 33%; }

/* 250701 esg 섹션 삭제로 인한 주석 처리
#main-esg { background-color: #f7f7f7; height: auto; }
#main-esg .inner{padding: 140px 0;}
#main-esg .title { font-size: 54px; line-height: 1.25; font-weight: 600; margin-bottom: 30px; }
#main-esg .row { display: flex; flex-wrap: nowrap; }
#main-esg .row > * { width: 100%; }
#main-esg .row > div a { display: flex; flex-direction: column; background-color: #fff; }
#main-esg .row > div .img > div { width: 100%; height: 0; padding-top: 47.25%; background-color: #dedede; background-position: center; background-repeat: no-repeat; background-size: cover; }
#main-esg .row > div .dec { padding: 45px; border: 1px solid #ddd;}
#main-esg .row > div .dec .tit { font-size: 30px; line-height: 1; font-weight: 600; display: flex; align-items: center; }
#main-esg .row > div .dec .tit:after { content: ''; width: 10px; height: 10px; margin-left: 10px; border-bottom: 2px solid #000; border-right: 2px solid #000; transform: rotate(-45deg); }
#main-esg .row > div .dec .txt { font-size: 16px; margin-top: 15px; line-height: 1.9; font-weight: 300; }
#main-esg .row > ul { display: flex; flex-direction: row; column-gap: 5.3%;}
#main-esg .row > ul li { width: 50%;}
#main-esg .row > ul a { display: flex; align-items: center; border: 1px solid #ddd; width: 100%; padding-right: 80px; }
#main-esg .row > ul .img > div { width: 14.323vw; height: 165px;background-color: #dedede; background-position: center; background-repeat: no-repeat; background-size: cover; }
#main-esg .row > ul .dec { padding-left:  10%; width: 100%;}
#main-esg .row > ul .dec .tit { font-size: 25px; line-height: 1; font-weight: 600; display: flex; align-items: center; justify-content: space-between; }
#main-esg .row > ul .dec .tit:after { content: ''; width: 10px; height: 10px; margin-left: 10px; border-bottom: 2px solid #000; border-right: 2px solid #000; transform: rotate(-45deg); }
#main-esg .row > ul .dec .txt { font-size: 16px; margin-top: 15px; line-height: 1.9; font-weight: 300; }
*/


#main-news .title { font-size: 54px; line-height: 1.5; font-weight: 600; margin-bottom: 50px; }
#main-news .newsArea { position: relative; }
#main-news .tab { display: flex; margin-bottom: 60px; padding-right: 120px; }
#main-news .tab li { margin-right: 10px; }
#main-news .tab li a { display: flex; align-items: center; justify-content: center; font-size: 19px; min-width: 134px; height: 50px; border: 1px solid #dcdae7; border-radius: 50px; padding: 0 15px; background-color: #fff; }
#main-news .tab li.active a { background-color: #000; border-color: #000; color: #fff; }
#main-news .viewMore { position: absolute; top: 9px; right: 0; display: flex; align-items: center; font-size: 19px; font-weight: 500; }
#main-news .viewMore:after { content: ''; width: 10px; height: 10px; margin-left: 10px; border-bottom: 2px solid #000; border-right: 2px solid #000; transform: rotate(-45deg); }
#main-news .list { display: flex; overflow-x: auto; }
#main-news .list::-webkit-scrollbar { height: 4px; }
#main-news .list::-webkit-scrollbar-thumb { background-color: #000; }
#main-news .list::-webkit-scrollbar-track { background-color: #f1f5f9; }
#main-news .list { margin-left: -30px; }
#main-news .list > li { width: 25%; padding-left: 30px; }
#main-news .list > li a { width: 100%; display: flex; flex-direction: column; }
#main-news .list > li a .img div { width: 100%; height: 0; padding-top: 56.25%; background-color: #dedede; background-position: center; background-repeat: no-repeat; background-size: cover; }
#main-news .list > li a .dec { padding: 35px 0; }
#main-news .list > li a .dec .cate { font-size: 17px; color: #099de8; font-weight: 500; line-height: 1; margin-bottom: 15px; }
#main-news .list > li a .dec .tit { font-size: 23px; font-weight: 600; line-height: 1.7; color: #000; height: 78px; overflow: hidden; max-width: 375px; }
#main-news .list > li a .dec .date { font-size: 16px; font-weight: 300; line-height: 1; color: #000; margin-top: 10px; }

/*231101 서브페이지 풀헤드 스타일 추가*/
.sub-page-section.full,
.sub-page-head.full{position: relative; overflow: visible;}
.spot_menu.full {position: absolute; top: 50px; border-top: none;}
.spot_menu.full.scroll{  position: fixed;}

/*240626 ESG, 기업시민 풀페이지 spot sub 스타일 추가*/
.spot_menu.full02 {top: -102px;}

/*230511 신규 spot 스타일 추가*/
.spot_menu.scroll{
  background-color: #f4f4f4;  
  top: 0;
  border-top: none;
  z-index: 3;
}


.spot_menu { position: fixed; top: 80px; width: 100%; background-color: #fff; border-bottom: 1px solid #dcdcdc; border-top: 1px solid #dcdcdc; z-index: 2; 
  -webkit-transition: all 100ms ease-out;
  -moz-transition: all 100ms ease-out;
  -ms-transition: all 100ms ease-out;
  -o-transition: all 100ms ease-out;
  transition: all 100ms ease-out;
}
.spot_menu > .inner { max-width: 1460px; margin: 0 auto; position: relative; }
/*.spot_menu > .inner:after { content: ''; width: 100%; height: 100%; background-color: #fff; position: absolute; right: 100%; top: 0; border-bottom: 1px solid #dcdcdc; box-sizing: border-box; }*/
.spot_menu > .inner > ul { display: inline-flex; width: 100%; }
.spot_menu > .inner > ul > li { margin-right: 40px; position: relative; }
.spot_menu > .inner > ul > li > a { font-size: 18px; display: flex; align-items: center; justify-content: space-between; width: 320px; height: 60px; padding: 20px; padding-right: 0; box-sizing: border-box; border-bottom: 2px solid transparent; }
.spot_menu > .inner > ul > li > a:after { content: ''; width: 50px; height: 100%; background-position: center; background-repeat: no-repeat; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='12px' height='6px'%3E%3Cpath fill-rule='evenodd' fill='rgb(0, 0, 0)' d='M5.916,5.975 L0.720,0.975 L11.112,0.975 L5.916,5.975 Z'/%3E%3C/svg%3E"); }
.spot_menu > .inner > ul > li > a:hover { border-color: #222; }

.spot_menu > .inner > ul > li.home 
.spot_menu > .inner > ul > li.depth1 ,
{ display: none; } 

.spot_menu > .inner > ul > li > div { position: absolute; top: 100%; left: 0; z-index: 2; width: 100%; margin-top: -2px; display: none; }
.spot_menu > .inner > ul > li > div > ul { background-color: #0096ff; padding: 15px 25px; }
.spot_menu > .inner > ul > li > div > ul > li + li { border-top: 1px solid #33b2ff; }
.spot_menu > .inner > ul > li > div > ul > li > a { display: flex; align-items: center; justify-content: space-between; height: 45px; font-size: 18px; color: #b9ecff; padding: 5px; box-sizing: border-box; }
.spot_menu > .inner > ul > li > div > ul > li > a[target]:after { content: ''; width: 12px; height: 12px; background-size: contain; background-repeat: no-repeat; background-position: center; background-image: url(../images/ico/ico_blank.png); margin-right: 5px; }
.spot_menu > .inner > ul > li > div > ul > li.active > a { color: #fff; }
.spot_menu > .inner > ul > li.active > div { display: block; }

.spot_menu > .inner > ul > li.depth2{
  display: block;
  position:static;
  width: 100%;
  margin-right: 0;
}
.spot_menu > .inner > ul > li.depth2 ul {
  display: flex;
  align-items: center;
  justify-content: center;
} 
.spot_menu > .inner > ul > li.depth2 li {
  margin: 0 30px;
} 
.spot_menu > .inner > ul > li.depth2 li a {
  position: relative;
  display: inline-flex;
  height: 100px;
  align-items: center;
  padding: 0 5px;
  box-sizing: border-box;
  font-size: 22px;
  font-weight: 600;
  color: #222;
  white-space: nowrap;
  word-wrap: break-word;
} 
.spot_menu > .inner > ul > li.depth2 li a:after {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 0%;
  height: 3px;
  background-color: #222;
  content: "";
  -webkit-transition: all 200ms ease-out;
  -moz-transition: all 200ms ease-out;
  -ms-transition: all 200ms ease-out;
  -o-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
} 
.spot_menu > .inner > ul > li.depth2 li.active a:after,
.spot_menu > .inner > ul > li.depth2 li:hover a:after {
  left: 0%;
  width: 100%;
} 

@media screen and (max-width: 1470px) {
  .spot_menu > .inner > ul > li.depth2 li a {font-size: 1.7vw;}
  .spot_menu > .inner > ul > li.depth2 ul {justify-content: flex-start;}
  .spot_menu > .inner {    
    width: 98vw;
    overflow: hidden;
    margin-left: 0;
    overflow-x: scroll;
    padding-right: 0;
  }
}



/*230511 기존 spot 스타일 주석*/
/*.spot_menu { position: relative; border-bottom: 1px solid #dcdcdc; }
.spot_menu > .inner { max-width: 1460px; margin: 0 auto; position: relative; }*/
/*.spot_menu > .inner:after { content: ''; width: 100%; height: 100%; background-color: #fff; position: absolute; right: 100%; top: 0; border-bottom: 1px solid #dcdcdc; box-sizing: border-box; }*/
/*.spot_menu > .inner > ul { display: inline-flex; padding-top: 10px; background-color: #fff; }
.spot_menu > .inner > ul > li { margin-right: 40px; position: relative; }
.spot_menu > .inner > ul > li > a { font-size: 18px; display: flex; align-items: center; justify-content: space-between; width: 320px; height: 60px; padding: 20px; padding-right: 0; box-sizing: border-box; border-bottom: 2px solid transparent; }
.spot_menu > .inner > ul > li > a:after { content: ''; width: 50px; height: 100%; background-position: center; background-repeat: no-repeat; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='12px' height='6px'%3E%3Cpath fill-rule='evenodd' fill='rgb(0, 0, 0)' d='M5.916,5.975 L0.720,0.975 L11.112,0.975 L5.916,5.975 Z'/%3E%3C/svg%3E"); }
.spot_menu > .inner > ul > li > a:hover { border-color: #222; }

.spot_menu > .inner > ul > li.home { width: 100px; flex: none; display: flex; align-items: center; justify-content: space-between; margin-right: 0; } 
.spot_menu > .inner > ul > li.home:after { content: ''; width: 10px; height: 10px; border-bottom: 1px solid #aeaeae; border-right: 1px solid #aeaeae; transform: rotate(-45deg); margin-right: 20px; }
.spot_menu > .inner > ul > li.home > a { width: 60px; height: 60px; padding: 0; font-size: 0; background-position: center; background-repeat: no-repeat; background-size: 30%; background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='a' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 135.15 138.12'%3E%3Cdefs%3E%3Cstyle%3E.b%7Bfill:%233f3f3f;%7D%3C/style%3E%3C/defs%3E%3Cpolygon class='b' points='135.15 138.12 90.72 138.12 90.72 123.27 120.3 123.27 120.3 58.85 67.57 18.1 14.85 58.85 14.85 123.27 45.2 123.27 45.2 138.12 0 138.12 0 52.79 67.57 0 135.15 52.79 135.15 138.12'/%3E%3C/svg%3E"); }
.spot_menu > .inner > ul > li.home > a:after { display: none; }

.spot_menu > .inner > ul > li > div { position: absolute; top: 100%; left: 0; z-index: 2; width: 100%; margin-top: -2px; display: none; }
.spot_menu > .inner > ul > li > div > ul { background-color: #0096ff; padding: 15px 25px; }
.spot_menu > .inner > ul > li > div > ul > li + li { border-top: 1px solid #33b2ff; }
.spot_menu > .inner > ul > li > div > ul > li > a { display: flex; align-items: center; justify-content: space-between; height: 45px; font-size: 18px; color: #b9ecff; padding: 5px; box-sizing: border-box; }
.spot_menu > .inner > ul > li > div > ul > li > a[target]:after { content: ''; width: 12px; height: 12px; background-size: contain; background-repeat: no-repeat; background-position: center; background-image: url(../images/ico/ico_blank.png); margin-right: 5px; }
.spot_menu > .inner > ul > li > div > ul > li.active > a { color: #fff; }
.spot_menu > .inner > ul > li.active > div { display: block; }*/



.reservation_info { border: 1px solid #cfcfcf; padding: 35px 60px; display: flex; align-items: center; margin-top: 70px; }
.reservation_info .ico { width: 130px; flex: none; }
.reservation_info .info { width: 100%; }
.reservation_info .info dl { display: flex; font-size: 16px; color: #222; font-weight: 300; }
.reservation_info .info dl + dl { margin-top: 20px; }
.reservation_info .info dl dt { font-weight: 500; margin-right: 20px; width: 130px; flex: none; }

/* 230330 IR 홀딩스 바로가기*/
.inner.dir {max-width: 1460px; width: 90%; margin: 0 auto; margin-top: 30px;}
.holdings_direct { background: url('/docs/eng7/jsp/resources/images/common/holdingslink_back.jpg') center right / cover no-repeat; width: 100%; padding: 0;}
.holdings_direct .direct_msg {width: calc(100% - 120px); padding: 0 60px; line-height: 70px; display: inline-block; }
.direct_msg p {font-weight: 300;}
.direct_msg p, .direct_msg strong {font-size: 16px; color: #fff;}
.holdings_direct .direct_msg .dir_btn {position: relative; padding-right: 14px; float: right; text-align: center; width: 200px; border: 1px solid #fff; line-height: 39px; margin: 14.5px 0 0;}
.holdings_direct .direct_msg .dir_btn ::after{position: absolute; content:""; width: 9px; height: 14px; background: url('/docs/kor7/jsp/resources/images/common/holdingslink_arrow.png'); top: 11px; right: 20px;}

/* 230519 스틸앤닷컴 바로가기*/
.inner.dir {max-width: 1460px; width: 90%; margin: 0 auto; margin-top: 30px;}
.steeln_direct { background: url('/docs/eng7/jsp/resources/images/common/holdingslink_back.jpg') center right / cover no-repeat; width: 100%; padding: 0; font-size: 16px; color: #fff;}
.steeln_direct .direct_msg {width: calc(100% - 120px); padding: 20px 60px; display: flex;    justify-content: space-between; align-items: center; }
.direct_msg p {font-weight: 300;}
.direct_msg p, .direct_msg strong {font-size: 16px; color: #fff;}
.steeln_direct .direct_msg .dir_btn {position: relative; padding-right: 14px; float: right; text-align: center; width: 200px; border: 1px solid #fff; line-height: 39px; }
.steeln_direct .direct_msg .dir_btn ::after{position: absolute; content:""; width: 9px; height: 14px; background: url('/docs/kor7/jsp/resources/images/common/holdingslink_arrow.png'); top: 11px; right: 20px;}



#siteMap { line-height:1.25; }
#siteMap ul.depth_n1 { display:flex; flex-direction:column; }
#siteMap ul.depth_n1 > li { border-bottom: 1px solid #d5d5d5; display:flex; padding-bottom:60px; }
#siteMap ul.depth_n1 > li + li { margin-top: 60px; }
#siteMap ul.depth_n1 > li > .tit { width:260px; flex:none;  }
#siteMap ul.depth_n1 > li > .tit > a { font-size:28px; font-weight:600; color:#222; }
#siteMap ul.depth_n1 > li > .tit > a[target]:after { content: '↗'; }

#siteMap ul.depth_n2 { display:flex; flex-wrap:wrap; width:100%; margin-bottom:-60px; }
#siteMap ul.depth_n2 > li { width: 16.666%; padding-left:15px; position:relative; margin-bottom:60px; box-sizing:border-box; }
#siteMap ul.depth_n2 > li:before { content:''; width: 3px; height:15px; background-color:#a1c1d1; position:absolute; top:2px; left:0; }
#siteMap ul.depth_n2 > li > a { font-size:16px; font-weight:500; color:#222; }
#siteMap ul.depth_n2 > li > a[target]:after { content: '↗'; }

#siteMap ul.depth_n3 { display: flex; flex-direction:column; margin-top:30px; }
#siteMap ul.depth_n3 > li {  }
#siteMap ul.depth_n3 > li + li { margin-top:10px; }
#siteMap ul.depth_n3 > li > a { font-size:15px; color:#666; }
#siteMap ul.depth_n3 > li > a[target]:after { content: '↗'; }

/* 230522 재무상태표, 손익계산서 추가 */
/* 230419 그래프 이미지로 대체 */
.table_img_wrap .table_img {
  width: 100%;
}
.table_img_wrap .table_img img {
  display: block;
  margin: 0 auto;
}
.table_img_wrap .pc-view.table_img.sales {
  height: 500px;
}
.table_img_wrap .pc-view.table_img.bizprofits,
.table_img_wrap .pc-view.table_img.netprofit {
  height: 570px;
}
/* .table_img_wrap .pc-view.table_img.sales {
  height: 500px;
  background: url('/docs/kor7/jsp/resources/images/ir/ir_sales.jpg') center no-repeat;
}
.table_img_wrap .mo-view.table_img.sales {
  background: url('/docs/kor7/jsp/resources/images/ir/ir_sales.jpg') center no-repeat;
} */

.table_inner table .bg_blue{background-color: #f0f8fc;}
.table_inner table tbody.number td{ text-align: right;  }
.table_inner table { border-top: 2px solid #333; width: 100%; }
.table_inner table th { border: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; padding: 28px 20px; color: #222; font-weight: 700; background: #f5f5f5; vertical-align: middle; text-align: center; line-height: 22px; }
.table_inner table tbody th { background: none; }
.table_inner table tbody th.bg { background: rgba(0, 88, 145, 0.08); }
.table_inner table tbody th.left { text-align: left; width:100%; }
.table_inner table td { border: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; padding: 27px 15px; vertical-align: middle; text-align: center; line-height: 24px; }
.table_inner table td .stroke { display: inline-block; line-height: 43px; border: 1px solid #005c9c; color: #005c9c; font-weight: 700; padding: 0 30px; float: right; }
.table_inner table td.bg { background: rgba(0, 88, 145, 0.08); }
.table_inner table td.title { text-align: left; font-weight: 700; color: #333; }
.table_inner table td.left { text-align: left; padding: 20px 30px; }

.table_inner table th.boR, .table_inner table td.boR { border-right: 1px solid #e5e5e5; }
.table_inner table td.bdright { border-right: 1px solid #e5e5e5; }
.table_inner table tfoot td { background: rgba(0, 88, 145, 0.08); }
.table_inner table caption { font-size: 0; height: 0; line-height: 0; width: 0; overflow: hidden; }
.table_inner table.color tbody .blue_back{ 
  background-color: rgba(173,197,216,.2); 
}
.table_inner table.color tbody .darkblue_back{ 
  background-color: rgba(0,92,167,.3); 
}


.inr-c2 > div:nth-child(4) .fz_s,
.inr-c2 > div:nth-child(6) .fz_s{
  width: 950px;
  margin: 0 auto;
}
.fz_s {
  font-size: 16px !important;
  line-height: 1.55;
}
.p_summary1 {
  font-size: 14px;
  color: #666666;
}
.p_summary1 span.pc-view{
  float: left;
}
h3 .btn-top a {font-size: 16px;}









