@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;}
.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;} 
.jc-e{justify-content: flex-end;}
.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: #999;
} 
.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:where(:hover, :focus){ 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:where(:hover, :focus){ 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:where(:hover, :focus){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;
  text-align: center;
} 

.tab.ty4 > ul > li.on > a,
.tab.ty4 > ul > li > a:where(:hover, :focus){ color:#fff; background-color: #099de8;} 
.tab.ty4 > ul > li.on > a { text-decoration: underline; text-underline-position: under;text-align: center; }

.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:where(:hover, :focus){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:where(:hover, :focus){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: 14px; display:flex; width:100%; align-items:center; justify-content: space-between; }
.btn_lang1 > a { font-size: 14px; 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: 14px; color:#fff; }
.btn_lang1 .depth li a:where(:hover, :focus) { color: #00a5e5; }
.btn_lang1 option { color: #222; }

/* 230728 키보드 동작으로 변경하기 위하여 주석처리
.btn_lang1:where(:hover, :focus) .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:where(:hover, :focus){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:where(:hover, :focus) .pageing .swiper-button-prev2:where(:hover, :focus),
.wrap_rollring4:where(:hover, :focus) .pageing .swiper-button-next2:where(:hover, :focus){opacity:0.7;}
.wrap_rollring4:where(:hover, :focus) .pageing .swiper-button-prev2,
.wrap_rollring4:where(:hover, :focus) .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:where(:hover, :focus),
  .wrap_rollring4 .pageing .swiper-button-next2:where(:hover, :focus){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.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;}





.header_banner + #header { top: 50px; }

#header.share .btn_allmenu,
#header.menu .btn_allmenu{  }

/* 230410 전체메뉴 가운데로 이동 및 기존헤더 스타일 삭제 */
.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:where(:hover, :focus){
  border: 1px #005689 solid;
  background-color: #005689;
}

/*230727 혜련 추가*/
.btn_allmenu:focus{outline-offset : 3px;}

.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;
}

/*230809 focus 받았을 때 before after 색 변경 추가*/
#header.sub .btn_allmenu:focus::after,
#header.sub .btn_allmenu:focus::before {
	background-color: #fff;
}

#header .ico_blank{margin-left: 5px;margin-top: -5px;}
#header{position: absolute; top: 0; width: 100%; z-index: 12; 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: 17px;}
#header .area_rgh .col.member{margin-right:55px;}
#header .area_rgh .col.member a{color:#fff;}
#header .area_rgh .col.member a:where(:hover, :focus){opacity:0.8;}
#header .area_rgh .col{}
#header .area_rgh .col.member,
#header .area_rgh .col.lang{display: none;}

/*미디어센터 헤더 스타일 추가 240529*/
#header.mediacenter{height: 100px; position: fixed; background-color: #fff; display: flex; justify-content: center; z-index: 12;}
#header .logo > a.mc_logo{font-size: 24px; font-family: "ONE-Mobile-Title"; letter-spacing: -0.025em; line-height: 1.64em; color: #005793;}
#header .logo > a.mc_logo,#header .area_rgh_mc, #header .mc_search{display: none;}
#header.mediacenter .area_cen, #header.mediacenter .area_rgh, #header.mediacenter .flt_banner{display: none; }

#header.mediacenter > .inner {justify-content: space-between; height: 100%; margin: 0; padding: 0; background-color: #fff; z-index: 3; width: 90%; max-width: 1460px;}
#header.mediacenter > .cover {z-index: 2; background-color: #fff; border-bottom: 1px solid #ddd;}
#header.mediacenter .logo {display: flex; align-items: flex-start; gap: 10px; }
#header.mediacenter .logo > a:first-child span.img {background-image: url(../images/common/logo_posoco_blue.png); }
#header.mediacenter .logo > a.mc_logo {display: flex; align-items: center; gap: 10px; }
#header.mediacenter .logo > a.mc_logo:first-child {color:#005793; }
/*#header.mediacenter .logo > a.mc_logo:last-child:before {display: block; content: ''; width: 1px; height: 15px; background-color: #666; }*/
#header.mediacenter .logo > a.mc_logo .img {height: 22px; width: 93px; background-image: url(../images/prcenter/mediacenter_logo_b.png);}
#header.mediacenter .logo > a.mc_logo .img.scroll {background-image: url(../images/prcenter/mediacenter_logo_b.png); margin-left: 11px;}

#header.mediacenter .area_rgh_mc{display: block; height: 100%;}
#header.mediacenter .area_rgh_mc ul.dapth_one{display: flex; gap: 70px; height: 100%; }

#header.mediacenter .area_rgh_mc ul.dapth_one > li{height: 100%; position: relative; }
#header.mediacenter .area_rgh_mc ul.dapth_one > li:after{display: block; content: ''; width: 0%; height: 2px; background-color: #222; position: absolute; bottom: -1px;left: 0; transition: all .3s;}
#header.mediacenter .area_rgh_mc ul.dapth_one > li:last-child:after{content: none;}
#header.mediacenter .area_rgh_mc ul.dapth_one > li:hover:after{width: 100%; }

#header.mediacenter .area_rgh_mc ul.dapth_one > li:first-child{position: relative; }
#header.mediacenter .area_rgh_mc ul a{text-align: center; display: flex;align-items: center; font-family: 'Noto Sans KR'; font-weight: 700; height: 100%;}
#header.mediacenter .area_rgh_mc ul.dapth_one > li:first-child > a{width: 57px; }
#header.mediacenter .area_rgh_mc ul.dapth_one > li:nth-child(2) > a{width: 77px; }
#header.mediacenter .area_rgh_mc ul.dapth_one > li:nth-child(3) > a{width: 167px; }
#header.mediacenter .area_rgh_mc ul a:hover{ }

#header.mediacenter .area_rgh_mc .dapth_two_back{display: block; position: absolute; top: 100px; left: -70vw; width: 1000vw; height: 0; transition: all .3s; background-color: #fff; box-sizing: border-box; overflow: hidden; z-index: 0;}

#header.mediacenter .area_rgh_mc ul.dapth_two{position: absolute; top: 100px; left: 0%; width: 148px; transition: all .3s; background-color: #fff; box-sizing: border-box; height: 0; overflow: hidden;}
#header.mediacenter .area_rgh_mc ul.dapth_two li{border-bottom: 1px solid #d5d5d5; display: flex; justify-content: flex-start; }
#header.mediacenter .area_rgh_mc ul.dapth_two li:first-child{margin: 20px 0 10px;}
#header.mediacenter .area_rgh_mc ul.dapth_two li a{font-size: 16px; font-weight: 500;z-index: 1;}
#header.mediacenter .area_rgh_mc ul.dapth_two li a:hover{text-decoration: underline; }

#header.mediacenter .mc_search{justify-content: center; position: absolute; left: 0; top: 99px; width: 100%; z-index: 1;}
#header.mediacenter .mc_search input{font-size: 16px;}
#header.mediacenter .mc_search.open{display: none;}
#header.mediacenter .mc_search.close{display: flex; flex-direction: column; align-items: center;}
#header.mediacenter .mc_search.close .back{position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background-color: rgba(0,0,0,.2);}
#header.mediacenter .mc_search > .inner{position: absolute; top: 0px; z-index: 2; width: 100%; background-color: #fff;}
#header.mediacenter .mc_search > .inner > div{width: 50vw; max-width: 670px; margin: 0 auto; padding: 30px 0 40px;position: relative; z-index: 1;}
#header.mediacenter .mc_search > .inner > div:last-child{width: 90%; max-width: 1460px; position: absolute; top: 0; left: 50%; transform: translateX(-50%);z-index: 0;}
#header.mediacenter .mc_search .wrap_search2{width: 100%;}
#header.mediacenter .mc_search .keyword{margin-top: 30px;}
#header.mediacenter .mc_search .keyword:after{clear: both; display: block; content: '';}
#header.mediacenter .mc_search .keyword * {float: left; font-size: 16px;}
#header.mediacenter .mc_search .keyword p {margin-left: 30px; font-weight: 550;}
#header.mediacenter .mc_search .keyword ul {margin-left: 40px;}
#header.mediacenter .mc_search .keyword ul li{margin-right: 20px;}
#header.mediacenter .mc_search .keyword ul li a:hover{text-decoration: underline;}
#header.mediacenter .mc_search .search_close { float:right; cursor: pointer; overflow: hidden; border: 1px solid #adadad; border-radius: 50%; background-color: transparent; width: 45px; height: 45px; padding: 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='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"); background-size: auto; background-repeat: no-repeat; background-position: center; font-size: 0;  }
/* 230410 #header .menu 기존 헤더스타일 주석처리 */

/*#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 .menu{margin: 0 auto;}
#header .menu > ul{display: flex;}
#header .menu > ul > li{position:relative;}
#header .menu > ul > li > a{color: #fff;font-size: 19px; font-weight: 500; display: flex; align-items: center; justify-content: center; padding: 0 45px;line-height: 1;}

.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 .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 .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;
}

#header .menu .depth2 > ul a{line-height:1.4; display:inline-block; padding:10px 0;color: #222;}
#header .menu .depth2 > ul a:where(:hover, :focus),
#header .menu .depth2 > ul a:focus{color: #00a5e5;}
#header .menu .depth2 > ul a:where(:hover, :focus):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);
}*/

/*.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:where(:hover, :focus){background:#009ee5; border-color:#009ee5;}
.btn_allmenu:where(:hover, :focus):after,
.btn_allmenu:where(:hover, :focus):before{ 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);
}*/

/*#header .menu >  ul > li.active > a,
#header .menu >  ul > li.hover > a {color: #fff;}*/







@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: 17px;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:where(:hover, :focus){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:where(:hover, :focus){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:where(:hover, :focus),
.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:where(:hover, :focus){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:where(:hover, :focus) .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; /*230607 주석*//*padding: 0 15px;*/ border-color: #00a5e5;}
.btn_type1:where(:hover, :focus) .inr{ padding: 0 0 0 15px;}
.btn_type1:where(:hover, :focus) .circle{}
.btn_type1:where(:hover, :focus) .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: 120; 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:50%; top: 1%;transform: translateX(-50%); 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:where(:hover, :focus){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:50%; top: 6%; width:87%; height:81%;transform: translateX(-50%);}

/*230728 추가*/
.modal_section .inner .text {
	position: absolute;
    bottom: 20px;
    /* color: white; */
    background: white;
    height: 10%;
    font-size: 16px;
    line-height: 18px;
    width: 90%;
    border-radius: 2px;
    left: 5%;
    overflow: auto;
	z-index: 5;
}

.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:where(:hover, :focus){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;}

/* 견학안내 */
/*250326 견학안내 > 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;}

/*250326 견학안내 > 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:where(:hover, :focus){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: 30px;}
.lst_table_small1 > li{display: flex; margin-top: 15px; color: #50667d; font-size: 14px; font-size: 0.875em;}
.lst_table_small1 > li> *{flex: none;}
.lst_table_small1 .col:nth-child(1){width: 70px;}
.lst_table_small1 .col:nth-child(2){margin-left: 7px; width: calc(100% - 77px); 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: initial; margin-right: 5vw;text-align: justify;}
.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:where(:hover, :focus){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; }

/*240117 관련사이트 스타일 추가*/
.box_relatedsites{ display: grid; grid-template-columns: 1fr 1fr; column-gap: 30px; row-gap:  40px; }
.box_relatedsites > div{ display: flex; background-color: #f6f6f6; border-top: 1px solid #222; padding: 50px 40px; letter-spacing: -0.05em;}
.box_relatedsites > div .title {width: 40%; font-weight: bold; font-size: 1.37rem; color: #333; }
.box_relatedsites > div .items {width: 60%;}
.box_relatedsites > div .items .txt a {width: 100%; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #dfdfdf; padding: 30px 0; color: #666; font-size: 1.12rem;}
.box_relatedsites > div .items>div:first-child .txt a {padding-top: 0;}

/*게시판 타입 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: #222; 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; outline-offset: 5px;}
.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;  }

/* 230322 외부링크 버튼 스타일 */
  .bbs-list-type1 .dlBtn2{ background-color: transparent; border-color: #5f6575; color: #5f6575; font-weight: 500; }
  .outbtn::after { 
    display: inline-block;
    width: 13px;
    height: 13px;
    margin-left: 10px;
    background-image: url(../images/common/ico_common.png);
    background-size: 940px 940px;
    background-position: -33px -58px;
    content: "";
  }
  .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: "";
  }
  .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; }



/* 게시판 사이즈 타입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;}

/* 230321 게시판 사이즈 타입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:where(:hover, :focus) i,
.bot_prnt a:where(:hover, :focus){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; }

/*230809 추가*/
.bbs-pagination > ul > li.active > a:focus { outline-offset: 3px; border: 3px dashed; }




.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; }
.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;}
.qna .wrap_faq .item:nth-child(3), .qna .wrap_faq .item:nth-child(4) {width: 50%;}
.wrap_faq .item .answer{display: none;}
.wrap_faq .item .questions,
.wrap_faq .item .answer{box-sizing: border-box; padding: 40px;}
.wrap_faq .item .questions {padding-bottom: 20px;} /* 240719 추가 */
.wrap_faq .item .answer{padding-top: 0;}
.wrap_faq .item .answer > .inner{border-top: 1px solid #e1e3e6; padding-top: 20px; /*padding-bottom: 60px;*/ display: flex; } /* 240719 padding-top: 40px>20px; 수정 padding-bottom 삭제 */


.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 .answer .txt span{font-size: 16px;}

/* 240719 삭제 .wrap_faq .item .questions{display: flex;}*/
.faq .wrap_faq .item .questions{display: flex;} /* 240722 추가 */
.wrap_faq .item .questions > *{}
.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; } /* 240719 추가 */
.wrap_faq .item .questions .txt .tit{font-size: 24px; font-size: 1.375em; font-weight: bold; line-height: 1.5; letter-spacing: -0.5px;} /* 240719 수정 font-size: 22px>24px; line-height: 1.4>1.5; font-weight, letter-spacing 추가 */
.wrap_faq .item .questions .arr{ margin-left: 30px; font-size: 20px; }

.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%; letter-spacing: -0.5px;} /* 240719 letter-spacing 추가*/
/*.wrap_faq .item.on  .answer{display: block;}*/

.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; }
.wrap_faq .item .link2 { color: #0000ff; border-bottom: 1px solid #0000ff; margin-right: 0; position: relative; } /* 240719 추가 */
.wrap_faq .item .link2:after { display: none; }/* 240719 추가 */

.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);}  
.tlb_type1.sz2 .item .area_td .c_gray,.tlb_type1.sz2 .item .area_td .c_blue3{font-size: smaller;}  


.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;}




/*230406 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 }
#footer .menu_foot .mn dd:first-child{margin-top:0;}

/*230724 추가*/
#footer .menu_foot .menu_dp1.mn dd{ font-weight:600; font-size:16px; }

#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:46px;} /* 230531 padding-top:36px에서 46px로 수정 */

#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:where(:hover, :focus){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; }
#footer .group_select > ul > li a { font-size: 0.88em; color: #333; }
#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: 50vh; -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; padding-top: 25px;}
#footer .address span{ display: block; margin-top: 5px; }

/*230810 웹접근성 인증마크 스타일 추가*/
#footer .menu_foot .waWrap { position: absolute; right: 0%; bottom: 0%; height: 77px; } /* 190423 웹접근성 마크 추가 */
#footer .menu_foot .waWrap img { width:113px; }

@media (hover: hover) {
	#footer .menu_foot .mn dd a:where(:hover, :focus){ color: #556fb2; }
	#footer .f_menu li a:where(:hover, :focus){ color: #ebebeb; }
}

/*240605 미디어센터 footer 스타일 추가*/
#footer.mediacenter .info_foot{ background-color: #F5F5F5; color: #222; }
#footer.mediacenter .inr-c-s{ max-width: 1460px; width: 90%;}
#footer.mediacenter .address{border-top: 1px solid #666; display:flex; justify-content: space-between;}
#footer.mediacenter .address .right span{text-align: right;}
#footer.mediacenter .address span{margin-top: 0;}

/* 기존 footer css

#site-footer { background-color: #f5f8f9; position: relative; }
#site-footer .footer-logo{  width: 126px; display: block; }
#site-footer > .inner{max-width: 1680px; margin-left: auto; margin-right: auto; padding: 65px 40px;}

.footer_menu { margin-bottom: 10px; }
.footer_menu ul { display: flex; align-items: center;  }
.footer_menu ul > li { display: flex; align-items: center; }
.footer_menu ul > li + li:before { content: ''; width: 4px; height: 4px; border-radius: 50%; background-color: #142856; margin: 0 20px; }
.footer_menu ul > li > a { font-size: 20px; font-weight: 500; color: #142856; }


.footer_top{display: flex;justify-content: space-between;align-items: center;}
.footer_top .lft{display: flex; flex-wrap: wrap; align-items: flex-start;}
.footer_top .lft li{font-size: 15px;  padding-left: 17px; margin-left: 17px; position: relative; text-align: left;border-left: 1px solid #cfcdde;line-height: 1;}
/*.footer_top .lft li:before{content:""; position: absolute; left: 0; top: 50%; width: 3px; height: 3px; background-color: #fff; border-radius: 50%; }*
.footer_top .lft li:first-child{padding-left: 0; margin-left: 0;border: 0;}
/*.footer_top .lft li:first-child:before{display: none;}*
.footer_top .lft a{color: #222; font-weight: 500; }
.footer-sns{display: flex;}
.footer-sns li a{ margin-left: 11px; width: 40px; height: 40px; border-radius: 50%; background-color: #484848; display: flex; align-items: center; justify-content: center; font-size: 0; line-height: 0; }
.footer-sns li a:where(:hover, :focus){background-color: #7c7c7c;}

.footer_bottom{ padding-top: 50px; display: flex; align-items: center;}
.footer_bottom .logo{  }
.footer_bottom .address{color: #333; text-align: left; margin-left: 60px;}
.footer_bottom .address > span{display: block;}
.footer_bottom .rgh{margin-left: auto; display: flex; align-items: center;}
.footer_bottom .rgh > *{margin-left: 40px;}
.footer_bottom .webacc{font-size: 0;}
.footer_bottom .webacc img{width: 94px;}
.footer_bottom .area_select2{}

.area_select2{position: relative;}
.area_select2 > select {
    min-width: 222px;
    min-width:222px\9;
    height: 64px;
    padding: 0 50px 0 25px;
    padding:6px 9px 6px 15px\9;
    border: 1px solid #e2e0e0;
    font-size: 16px;
    font-size:16px\9;
    line-height: 1;
    color: #606060;
     appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;
    -o-appearance:none;
    background:none\9;
    background-color: #f6f6f6;
    font-weight: 500;
    border-radius:7px;
    box-sizing: border-box;
}
.area_select2:after{
    /* use !important to prevent issues with browser extensions that change fonts *
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== *
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    right: 14px;
    top: 50%;
    content:"\ea09";
    margin-top: -10px;
    font-size: 20px;
    color:#929292;
    -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;
    -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg);
}
.area_select2 > select:focus{content:"\ea09";}
.area_select2 > select:focus:after{-webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg);}
.area_select2 > select.h2{height: 36px;}
.area_select2 > select.ml{margin-left: 5px;}
.area_select2 > select.mr{margin-right: 5px;}
.area_select2 > select.bc1{border-color: #eaeaea;} 


@media screen and (max-width: 840px) {
  
  .area_select2 > select {
    height: 11vw;
    padding: 1vw 12vw 1vw 3vw;
    font-size: 3.2vw;
    min-width: 36vw;
  }
  .area_select2:after{
    right: 2.3vw;
    margin-top: -2vw;
    font-size: 4vw;
  }
}

#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; }*/


/*	공통 : 하단 퀵 링크 230412 추가	*/

.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;}

/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/


#page-contents { min-height: 100vh;}

.sub-page-head { padding-top: 20px; margin-bottom: 50px; margin-top: 160px; padding-bottom: 0; } /* 230411 padding-top: 110px; 에서 20px로 수정 */
.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: #949494; line-height: 1;}
.path_sub p i {margin: 0 11px;}
.path_sub p strong {color: #222; /*font-weight: 500;*/}
.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; margin-bottom: 40px; }
.sub-page-head .title > h3 { padding-top: 0; }
.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.on a .year{ color: #099de8; }

.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; }

/* 230410 수정 */
.sub-page-section:first-child > .inner:first-child { padding-top: 100px; }
/*.sub-page-section:first-child > .inner:first-child { padding-top: 260px; } 230727 100px로 수정*/
.sub-page-section:last-child > .inner:last-child { padding-bottom: 200px; }
/* .sub-page-section:first-child > .inner { padding-top: 260px; }
.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.small {font-size: 16px;} /* 230626 추가 */
.secText.h2 { font-size: 16px; }
.secText ul > li { font-size: 0.9em; padding-left: 10px; text-indent: -10px; }

/* 230329 추가 */
.secText.non-indent ul{ margin:10px 0 0 -10px; }
.secText.non-indent ul > li { text-indent: 0px; }
.secText.non-indent ul > li + li { margin-top: 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 > 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;}

/* 230322 모바일 터치 아이콘 스타일 */
.msg_touch_help {display: none}


/* 230328 스크롤 */
.table_inner.scroll iframe {display: block; text-align: center;}
.tb_table.scroll {position: relative;}


/* 신용등급 테이블*/
.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: 14px; color: #222; font-weight: 600; height: 60px; }
.tb_table table th.line,
.tb_table table td.line { border-left: 1px solid #d6d6d6; }
.tb_table table * + th,
.tb_table table * + td { 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 .form .button button:focus {outline-offset: 3px; border: 3px dashed;}
#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(../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%); }*/

/* 240325 추가 */
#vision_sec_top .secText span.vision_slogan {font-size: 35px;}

/*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_06 b { font-weight: bold; color: #005c9c; }

/*250204 추가*/
#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;}
/*250204 추가 끝*/

/*
#message_sec_01 .box { 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-color: #fff; position: absolute; top: 15px; right: 15px; bottom: 15px; left: 15px; z-index: -1; }
#message_sec_01 .box .cont { width: 100%; padding: 50px 40px; }
#message_sec_01 .box .tit { font-size: 35px; font-weight: bold; margin-bottom: 10px; }
#message_sec_01 .box .txt { font-size: 32px; line-height: 1.57; }
#message_sec_01 .box .photo { width: 450px; flex: none; }
#message_sec_01 .box .photo img { display: block; }
#message_sec_01 .signature { position: relative; z-index: 2; display: flex; align-items: center; color: #222; font-size: 26px; margin-top: 40px; justify-content: flex-end; margin-right: 2.5vw; }
#message_sec_01 .signature b { font-size: 36px; font-weight: bold; margin-left: 35px; }
*/


/*250204 추가*/
#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; font-family: 'Noto Sans KR';}
#message_sec_02 .inner div:last-child{margin-top: 70px;}
#message_sec_02 .inner div:last-child span{font-size: 28px;}
/*250204 추가 끝*/

#message_sec_02 .secBody {margin-left: 7vw; }
#message_sec_02 .secTitle {font-size: 36px; }
#message_sec_02 .secText {margin-left: 2vw; font-size: 26px; }
#message_sec_02 .secText5
#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; }

/*  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; }
#group_company .list > li .cont { width: 100%; padding-right: 100px; 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; }
#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:where(:hover, :focus) { 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:%23222222;%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: 580px; 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:where(:hover, :focus) .point { opacity: 0; }
#company_local_global .globalMap .list li a:where(:hover, :focus):before { transform: matrix(5,0,0,5,-25,-25); opacity: 1; }
#company_local_global .globalMap .list li a:where(:hover, :focus):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%; }


#company_map_area { width: 100%; /*230504 height: 620px > 100%로 수정*/ height: 100%; margin-top: 45px; /*230504 background-color: #C6C5C2 주석*/ position: relative; }
/*230504 주석 
#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:%23222222;%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 { width: 215px; height: 55px; border-radius: 55px; 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: 26px; color: #8f9298; font-weight: 600; position: relative; }
#posco_histoy_menu ul li .tit { font-size: 20px; 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: 70px; flex: none; font-weight: 600; }
#posco_histoy_list ul li .cont dl dd .text { font-size: 18px; line-height: 1.8; color: #666; /*240222 추가*/ display: flex; align-items: center; gap: 10px;}
#posco_histoy_list ul li .cont dl dd .text .history_btn_wrap {display: flex; gap: 5px; }
#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 {  }
#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; }
#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); }

/*240514 서브페이지 슬라이드 스타일 변경*/
/* #esg_subPage_section .swiper-container { overflow: hidden; }230405 overflow: visible; 에서 overflow: hidden; 으로 변경*/
/* #esg_subPage_section .swiper-nav { display: flex; align-items: center; justify-content: flex-start; margin-bottom: 20px; }230405 justify-content: flex-end에서 flex-start로 변경*/

/*
#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:where(:hover, :focus) { 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: 100px 70px 60px; height: 500px; color: #222; border-top-right-radius: 30px; border-bottom-left-radius: 30px; }
#esg_subPage_list .item .tit { font-size: 30px; 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; word-break: break-all; text-align: justify; }
#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:where(:hover, :focus):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:where(:hover, :focus):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 h5.secTitle { font-size: 20px; margin-bottom: 15px; color: #333; font-weight: 500; }
#esg_subPage_modal .secText { font-size: 16px; color: #222; }
#esg_subPage_modal .secText .bold { font-weight: bold; }
#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; }

/* 230626 추가 */
#esg_subPage_modal .table_inner table {font-size: 16px;}
#esg_subPage_modal .table_inner table th {padding: 25px 5px;}
#esg_subPage_modal .table_inner table td {padding: 25px 5px;}

#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; color: #1e2f46; }
#esg_social_section .secText + .secText { margin-top: 60px; }
#esg_social_section .secText ul { font-size: 16px; 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:where(:hover, :focus):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; overflow: visible; }
#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; }
@media screen and (min-width:789px){ 
	#citizen_report_top ul.btn_list.mt10 li .btn {width:200px;}
}
#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:where(:hover, :focus) { background-color: #222; color: #fff; }
#citizen_report_top .btn_list li .btn:where(:hover, :focus):after { background: url(../images/ico/ico_dl_wh.png) center no-repeat; }


/* 231017 기업시민보고서 하이라이트 영역 추가*/
#citizen_report_top:nth-child(3) { margin-top: 210px; }
#citizen_report_top .inner[class*='ver']{ padding: 90px 0; }
#citizen_report_top [class*='ver'] .cont { padding-left: 40px; }
#citizen_report_top [class*='ver'] .download { padding-right: 40px; margin-top: -300px; }
#citizen_report_top [class*='ver'] .secText { max-width: 100%; }
#citizen_report_top [class*='ver'] .img { box-shadow: 8px 8px 12px #ccc; border: 1px solid #c8c8c8; }
#citizen_report_top [class*='ver'] .btn_list { justify-content: flex-start; margin: 35px 0 0 0; border-top: 1px solid #707070; padding-top: 40px; }
#citizen_report_top [class*='ver'] .btn_list li { text-indent: 0; }
#citizen_report_top [class*='ver'] .btn_list li:first-child { padding-left: 0; }
#citizen_report_top [class*='ver'] .btn_list .btn { width: 155px; }
#citizen_report_top .btn_list > li + li { margin-top: 0; }

#citizen_report_top .ver2.row { flex-direction: row; align-items: center; }
#citizen_report_top .ver2 .cont { padding: 0 40px 0 0; }
#citizen_report_top .ver2 .download { margin-top: -270px; padding: 0 0 0 40px; }
#citizen_report_top .ver2 .img { width: 60%; float: right; }
#citizen_report_top .ver2 .btn_list { margin-top: 110px; }


/* 230418 책임광물보고서 상단영역 스타일 추가 */
/* #citizen_report_top.responsible_report .cont {margin-top: 30px;} */

#citizen_report_top.responsible_report .secTitle {margin-top: 6vw;}
#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; padding-top: 120px; }
#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; }

/*230825 포항지역사회보고서 스타일 추가*/
#citizen_report_list dl dd.full { width: 100%;}
#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:where(:hover, :focus) { background-color: #099de8; color: #fff; border-color: #099de8; }
#citizen_report_list dl dd .btn:where(:hover, :focus):after { background: url(../images/ico/ico_dl_wh.png) center no-repeat; }

/* 230414 ESG Controversies 페이지 추가 */
#esg_subPage_modal .date { text-align: right; font-size: 15px; }
/*#esg_subPage_modal .contro_item .secText{font-weight: 300;}*/
#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 {margin-bottom: 0px; 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;}

#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; } */

#initiative_global_list > .inner { padding-bottom: 120px; } 
#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: 50vw; max-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: 30px; 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: 18px; 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:where(:hover, :focus) { background-color: #e8ecef; }
#initiative_references .btns > li img { height: 60px; }

.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_calendar .calendar table td a:focus {
	outline-offset: 3px;
	border: 3px dashed;
}

.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:where(:hover, :focus) .bg:before,
#carbon_effort .carbon_effort_mainPoint ul li .inner:focus .bg:before { opacity: 1; }
#carbon_effort .carbon_effort_mainPoint ul li .inner:where(:hover, :focus) .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:where(:hover, :focus) .cont:after,
#carbon_effort .carbon_effort_mainPoint ul li .inner:focus .cont:after { opacity: 0; }
#carbon_effort .carbon_effort_mainPoint ul li .inner:where(:hover, :focus) .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:where(:hover, :focus) .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; text-transform: uppercase; }
#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; }
#carbon_about .txt { font-size: 24px; line-height: 1.875; color: #000; font-weight: 300; text-transform: uppercase; }


#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; margin-bottom: 70px;}
#carbon_accelerate .cont > * { width: 100%; }
/*#carbon_accelerate .cont .num .txt3 {text-align: left; font-size: 24px; font-weight: 600;} */
#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; text-transform: uppercase; 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_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 { border: 1px solid #e7e7ee; border-radius: 14px; padding: 30px; background-color: #fff; }
#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; }
#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; outline-offset: 3px;}
#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:where(:hover, :focus) .bg:before,
#carbon_effort .carbon_effort_mainPoint ul li .inner:focus .bg:before { opacity: 1; }
#carbon_effort .carbon_effort_mainPoint ul li .inner:where(:hover, :focus) .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:where(:hover, :focus) .cont:after,
#carbon_effort .carbon_effort_mainPoint ul li .inner:focus .cont:after { opacity: 0; }
#carbon_effort .carbon_effort_mainPoint ul li .inner:where(:hover, :focus) .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; display: flex; justify-content: space-between; }
#carbon_guideline > .inner > * { width: 100%; box-sizing: border-box; }
#carbon_guideline .secTitle { font-size: 50px; color: #000; font-weight: 600; line-height: 1.5; }
#carbon_guideline .secText { font-size: 20px; color: #000; line-height: 1.8; }
#carbon_guideline .guideBook { 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; max-width: 1600px; }
#hyrex_kv .cont { max-width:600px; padding:30px; background-color:rgba(0, 0, 0, .45); }

sup {vertical-align: super;font-size: small;}
#hyrex_banner .tit sup {font-size: initial; vertical-align: text-top;}

 #hyrex_kv .tit  { font-size: 23px; border-bottom: 1px solid #fff; display: inline-block; /*text-transform: uppercase;*/ } 
#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: 60px; font-weight: 600; color: #000; margin-bottom: 50px; }
#hyrex_about .txt { font-size: 24px; line-height: 1.875; color: #000; font-weight: 300; /*text-transform: uppercase; */}
#hyrex_about .txt sub {font-size: small; }
#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 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: #359bdc; }
#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"); }





[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 { max-width:660px; padding:30px; background-color:rgba(0, 0, 0, .45); }
#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 그리닛 페이지 수정 */

[id*='greenate_'] > .inner { padding: 120px 0; max-width: 1300px; }
#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 > h3.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%;}
}

.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 h3 { font-size: 26px; color: #333; font-weight: 500; padding-top: 60px; }
.terms>div:first-child h3 { padding-top: 0px; }
.terms h4 { 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 .table_inner.scroll { overflow-x: auto; }
.terms .table_inner.scroll table { min-width: 750px; }

.terms .btn-select { display: flex; max-width: 320px; }
.terms .btn-solid { width: 120px; flex: 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: 40px; }
#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 * { 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; 230817 이미지로 대체 */ background-image: url(../images/main/pc_back.jpg); background-size: cover; background-position: center;}
#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%; }230323 생략*/
/*#main-visual-slider .swiper-slide .bg > video {display: block; position: absolute; left: 50%; top: 0; transform: translate(-50%, 0); z-index: 1;} 230428 생략*/
#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;} 
#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"); }

/* 230324 progressbar-pagination 추가 */
#main-visual .progressbar-pagination { position: absolute; right: 52px; bottom: 54px; width: 100%; display: flex; justify-content: flex-end; align-items: center; z-index: 10; }
#main-visual .progressbar-pagination .btn_full{height: 50px; margin-right: 30px; border: 1px solid #fff;padding: 10px 40px; display: inline-block; position:relative;}
#main-visual .progressbar-pagination .btn_full .t{ font-size: 16px; color: #fff; font-weight: 600; display: inline-block; position: relative; z-index: 1;}
#main-visual .progressbar-pagination .btn_full:after{position:absolute; left:0; bottom:0; width:100%; height:0%; background:#fff; content:""; z-index:0;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;}
#main-visual .progressbar-pagination .btn_full:where(:hover, :focus) .t{ color:#222;}
#main-visual .progressbar-pagination .btn_full:where(:hover, :focus):after{ height:100%;}
#main-visual .mute { margin-right: 40px; }
#main-visual .mute button { cursor: pointer; width: 50px; height: 50px; border: none; border-radius: 50%; background-color: rgba(255, 255, 255, .3); font-size: 0; background-repeat: no-repeat; background-size: 35%; background-position: center; background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96.08 92.95'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23ffffff; %7D %3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M47.79,.26c-1.29-.53-2.77-.24-3.75,.75L17.23,27.81H3.44c-1.9,0-3.44,1.54-3.44,3.44v30.43c0,1.9,1.54,3.44,3.44,3.44h13.79l26.8,26.81c.66,.66,1.54,1.01,2.44,1.01,.44,0,.89-.09,1.32-.26,1.29-.53,2.12-1.79,2.12-3.18V3.44c0-1.39-.84-2.65-2.12-3.18Z'/%3E%3Cpath class='cls-1' d='M82.49,46.39l12.45-12.39c1.52-1.51,1.52-3.96,.01-5.48-1.51-1.51-3.96-1.52-5.48-.01l-12.48,12.42-12.48-12.42c-1.52-1.51-3.97-1.5-5.48,.01-1.51,1.52-1.5,3.97,.01,5.48l12.45,12.39-12.46,12.39c-1.52,1.51-1.52,3.96-.01,5.48,.76,.76,1.75,1.14,2.75,1.14s1.98-.38,2.73-1.13l12.48-12.42,12.48,12.42c.76,.75,1.74,1.13,2.73,1.13s1.99-.38,2.74-1.14c1.51-1.52,1.5-3.97-.01-5.48l-12.45-12.39Z'/%3E%3C/svg%3E"); }
#main-visual .mute button.on { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 111.2 93.81'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23ffffff; %7D %3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M47.79,.7c-1.29-.53-2.77-.24-3.75,.75L17.23,28.25H3.44c-1.9,0-3.44,1.54-3.44,3.44v30.43c0,1.9,1.54,3.44,3.44,3.44h13.79l26.81,26.81c.66,.66,1.54,1.01,2.43,1.01,.44,0,.89-.09,1.32-.26,1.29-.53,2.13-1.79,2.13-3.18V3.88c0-1.39-.84-2.65-2.13-3.18Z'/%3E%3Cpath class='cls-1' d='M61.68,65.99c-.99,0-1.98-.38-2.74-1.13-1.51-1.51-1.52-3.96,0-5.48,3.33-3.34,5.17-7.77,5.17-12.48s-1.83-9.15-5.17-12.47c-1.51-1.51-1.51-3.97,0-5.48,1.51-1.51,3.96-1.51,5.48,0,4.79,4.79,7.43,11.17,7.43,17.95s-2.64,13.15-7.43,17.95c-.76,.76-1.75,1.14-2.74,1.14Z'/%3E%3Cpath class='cls-1' d='M75.32,81.2c-2.14,0-3.87-1.73-3.87-3.87h0c0-1.04,.41-2.02,1.13-2.75,7.4-7.4,11.47-17.23,11.47-27.68s-4.07-20.29-11.47-27.68c-1.51-1.51-1.51-3.96,0-5.48,1.51-1.51,3.96-1.51,5.48,0,8.86,8.85,13.74,20.63,13.74,33.16s-4.85,24.23-13.66,33.08c-.71,.75-1.71,1.21-2.81,1.21Z'/%3E%3Cpath class='cls-1' d='M89.5,93.81c-.99,0-1.98-.38-2.74-1.14-1.51-1.51-1.51-3.96,0-5.48,10.77-10.76,16.7-25.07,16.7-40.29s-5.93-29.54-16.69-40.3c-1.51-1.51-1.51-3.96,0-5.48,1.51-1.51,3.96-1.51,5.48,0,12.22,12.22,18.96,28.48,18.96,45.77s-6.74,33.55-18.97,45.77c-.76,.75-1.75,1.13-2.74,1.13Z'/%3E%3C/svg%3E"); }
/*#main-visual .swiper-pagination {position: relative;text-align: left;width: auto;display: flex;align-items: center;justify-content: flex-end;padding-right: 40px;}
#main-visual .swiper-pagination .swiper-pagination-bullet { width: 150px; height: 2px; border-radius: 0; background-color: rgba(255,255,255,0.5); opacity: 1; position: relative;  }
#main-visual .swiper-pagination .swiper-pagination-bullet + .swiper-pagination-bullet { margin-left: 6px; }
#main-visual .swiper-pagination .swiper-pagination-bullet-active { opacity: 1; }
#main-visual .swiper-pagination .swiper-pagination-bullet .num{position: absolute;left: 0;bottom: 5px;font-weight: 600;color: #fff;width: 100%;}
#main-visual .swiper-pagination .swiper-pagination-bullet .bar { width: 0%; height: 4px; background-color: #fff; display: block; margin-top: -3px;}*/

#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: 600;*/ line-height: 1.4; }
#main-brand .cont .tit span {font-weight: 600;}/*230406 추가*/
#main-brand .cont .txt { font-size: 20px; color: #000; line-height: 1.9; margin-top: 20px; }
#main-brand .cont ul { margin-top: 10px; 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: 70px; }
#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;} /* 230406 추가 */
#main-brand .cont ul li a:where(:where(:hover, :focus), :focus) .t { display: none; }
#main-brand .cont ul li a:where(:where(:hover, :focus), :focus) .logo { display: block; }
#main-brand .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-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;}/*230406 opacity: 0.6; 삭제*/
#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 { border-color: #099de8; }
#main-brand .cont ul li.active .t { color: #099de8; }
#main-brand .cont ul li.active .video { display: flex; }


#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: 600;*/ margin-bottom: 30px; line-height: 1.4; }
#main-carbon .cont .tit span {font-weight: 600;}/*230406 추가*/
#main-carbon .cont .txt1 { font-size: 30px; font-weight: 600; margin-bottom: 30px; line-height: 1.5; }
#main-carbon .cont .txt1 span { color: #4c9db2; }
#main-carbon .cont .txt2 { font-size: 20px; line-height: 1.9; margin-bottom: 40px; }

#main-carbon .cont ul { margin-top: 10px; width: 325px; }
#main-carbon .cont ul li { border-bottom: 1px solid #ddd; }
#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:where(:hover, :focus) .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 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: #fff; height: auto;}
#main-esg .inner{ padding: 140px 0;}
#main-esg .title { font-size: 54px; line-height: 1.4; 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: 20px; 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 + li { margin-top: 30px; padding-top: 30px; border-top: 1px solid #ddd; }*/
/*
#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; max-width: 275px; 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: 20px; 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; }

/*240717 웹접근성 수정으로 인한 추가*/
#main-news .tab li.active a:focus { outline-color: #fff; outline-offset: -5px; }

#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; }

/*240717 웹접근성 수정으로 인한 추가*/
#main-news .list > li a:focus {outline-offset: -2px; }

#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; }

/*230705 서브페이지 풀헤드 스타일 추가*/
.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;}


.spot_menu.full02 {top: -122px;}

.spot_menu.scroll{
  background-color: #f4f4f4;  
  top: 0;
  border-top: none;
  z-index: 11;
}


.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:where(:hover, :focus) { 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:where(:hover, :focus) 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;
  }
}

/* 230412 lnb 기존 스타일 주석처리 */
/* .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:where(:hover, :focus) { 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; }


#siteMap { line-height:1.25; }
#siteMap ul.depth_n1 { display:flex; flex-direction:column; border-bottom: 1px solid #d5d5d5; }
#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 {width: 100%; display:flex; padding: 40px 0; border-top: 1px solid #222;}
#siteMap ul.depth_n1 > li > .tit .left {width: 230px;}
#siteMap ul.depth_n1 > li > .tit .left > a {font-size:28px; font-weight:600; color:#222;}
#siteMap ul.depth_n1 > li > .tit .right {width: 100%;}
#siteMap ul.depth_n1 > li > .tit .right > p {padding-top: 5px;}
/*#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_n1 > li > .tit .left > a[target]:after { content: '↗'; }

#siteMap ul.depth_n1 > li > .cont {background: #f6f6f6; border-top: 1px solid #d5d5d5; padding: 35px 0 0 200px;}

#siteMap ul.depth_n2 { display:flex; flex-wrap:wrap; width:100%; margin-bottom:-60px; }
#siteMap ul.depth_n2 > li { width: 16.666%; padding: 0 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: '↗'; }

/* 230329 IR 홀딩스 바로가기*/
.inner.dir {max-width: 1460px; width: 90%; margin: 0 auto; margin-top: 30px;}
.holdings_direct { background: url('/docs/kor7/jsp/resources/images/common/holdingslink_back.jpg') center right / cover no-repeat; width: 100%; padding: 0;}
.holdings_direct .direct_msg {width: calc(100% - 80px); padding: 0 40px; 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; border: 1px solid #fff; line-height: 39px; margin: 14.5px 0 0; padding: 0 45px 0 30px;}
.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; outline-offset: 5px;}
.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;}

/* 230404 기업시민 페이지 추가 */

[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 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;}

#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:30px; background-color: #f2f2f2; border-radius: 5rem; }
#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; }

/*240404 추가*/
#cc_tab_02 .tab.ty2 > ul{align-items: center;}
#cc_tab_02 .tab.ty2 li:first-child a{width: max-content; }

.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/kor7/jsp/resources/images/esg/citizens/together_icon.png) center no-repeat;}
.cont.list .listCon.circle li:nth-child(2) .icon{ background: url(/docs/kor7/jsp/resources/images/esg/citizens/challenge_icon.png) center no-repeat;}
.cont.list .listCon.circle li:nth-child(3) .icon{ background: url(/docs/kor7/jsp/resources/images/esg/citizens/green_icon.png) center no-repeat;}
.cont.list .listCon.circle li:nth-child(4) .icon{ background: url(/docs/kor7/jsp/resources/images/esg/citizens/life_icon.png) center no-repeat;}
.cont.list .listCon.circle li:nth-child(5) .icon{ background: url(/docs/kor7/jsp/resources/images/esg/citizens/community_icon.png) center no-repeat;}

.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/kor7/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/kor7/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/kor7/jsp/resources/images/esg/citizens/green_brand_01.png) top no-repeat; background-size: cover;}
.cont.list .listCon li:nth-child(4) .top_img{background: url(/docs/kor7/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/kor7/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/kor7/jsp/resources/images/esg/citizens/arrow_green.png') center no-repeat;}
.citizen_arrow.gray { background: url('/docs/kor7/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 .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/kor7/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/kor7/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/kor7/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: 44px; 
  color: #00578a; 
  font-weight: bold;
  background-image: url(/docs/kor7/jsp/resources/images/esg/citizens/img_concept_bg.png); 
  background-size: 100% 100%; 
  background-repeat: no-repeat;
  height: 217px;
  line-height: 350px;
}
#cc_sec_03 dl.top dd p{font-size: 29px;}
#cc_sec_03 dl.top dd span{color: #f38b00;font-size: 44px;}
#cc_sec_03 dl dd{width:100%; display: flex; justify-content: center;}
#cc_sec_03 dl dd > p{font-size: 29px;}

#cc_sec_03 dl dd > span,
#cc_sec_03 dl dd > strong,
#cc_sec_03 dl dd p > span{font-size: 38px;font-weight: bold;}

#cc_sec_03 dl dd.gap{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{position: relative;font-size: 35px; color: #0f5a8b;font-weight: bold;letter-spacing: -2px; font-family: 'Noto Sans KR';}
#cc_sec_03 dl.case01 dd .img::before{
  content: '';
  width: 56px;
  display: block;
  background-image: url('/docs/kor7/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: space-between;}
#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/kor7/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/kor7/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/kor7/jsp/resources/images/esg/citizens/peple.png');}
#cc_sec_03 dl.case02 dd>ul>li p{text-align: center; font-size: 24px;}

#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;
}

/* 230526 기업시민헌장 */
#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;}
#citizen_Charter .tab_cont_wrap .tab_botbox.thir .boxBody ul .circle.circle_01 {width: 130px; height: 130px; margin-top: 20px; border: 1px solid #00a5e5;}
#citizen_Charter .tab_cont_wrap .tab_botbox.thir .boxBody ul .circle.circle_02 {width: 140px; height: 140px; margin-top: 10px; border: 1px solid #05507d;}
#citizen_Charter .tab_cont_wrap .tab_botbox.thir .boxBody ul .circle.circle_03 {width: 150px; height: 150px; background-color: #05507d; color:#fff;}

#citizen_Charter .tab_cont_wrap .tab_topbox {box-sizing: border-box; padding: 80px 60px;text-align: left;}
#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_topbox {font-size: 25px;}

#citizen_Charter .tab_cont_wrap .tab_cont2 .tab_topbox .inner_box .icon{ background:  url('/docs/kor7/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/kor7/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/kor7/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/kor7/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: 25px;} 
#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: center; background-color: #eee; width: 33%;} 
#citizen_Charter .tab_cont_wrap .tab_blockbox .block_set.single div{ height: 115px;}
#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/kor7/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/kor7/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/kor7/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/kor7/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/kor7/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/kor7/jsp/resources/images/esg/citizens/business_50x34.png');}
#ccms_direction .secText dt.society::before {background-image: url('/docs/kor7/jsp/resources/images/esg/citizens/society_50x42.png');}
#ccms_direction .secText dt.people::before {background-image: url('/docs/kor7/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/kor7/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/kor7/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; 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/kor7/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: 140px; }
  #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: 80px; }
  #citizen_zeronet .content1 .content > li .text { width: 390px; 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;}   
  .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;width: 100%; background-color: #fff;    display: flex; flex-direction: row; align-items: center; justify-content: center;}
  .citizen_box_in p{font-size: 17px; }
  .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_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_futuregen .citizen_boxlist_in li:first-child div::before,
#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:nth-child(2) div::before{width: 45px; height: 38px; 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:last-child 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;}

/* 230607 기업시민Archive 추가 */
#cc_sec_archive01{margin-top: -50px;}
#cc_sec_archive01 .secTxt {margin-top: 30px; font-size: 24px;}
#cc_sec_archive02 {width: 100%; height: auto; overflow: hidden; position: relative;}
#cc_sec_archive02 .inr-c2 {display: flex; align-items: center; position: relative;padding: 70px 0 80px; max-width: 1300px;}
#cc_sec_archive02 .inr-c2 .news_bg {background-image: url(../../resources/images/esg/citizens/archive_back.jpg); max-width: 1032px;}

#cc_sec_archive02 .content {color: #fff; display: flex; flex-direction: column; align-items: flex-start; z-index: 1; padding: 0 80px 0 100px; width: 635px;height: 410px;flex: none; width: 50%;}
#cc_sec_archive02 .content .item {display: none;}
#cc_sec_archive02 .content .item.on {display: block;}
.bg-pos {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: cover; background-position: 50%; background-repeat: no-repeat; z-index: 0;}
#cc_sec_archive02 .content .item .cate {font-size: 18px;}
#cc_sec_archive02 .content .item .tit {height: 104px; color: #fff; font-size: 40px; letter-spacing: -0.02em; line-height: 1.3; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
#cc_sec_archive02 .content .item .txt {height: 50px; margin-top: 40px; font-size: 16px; line-height: 1.55; opacity: 0.7; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
#cc_sec_archive02 .content .item .btn {margin-top: 30px; color: #fff; line-height: 25px; display: inline-flex; font-size: 18px; align-items: center; background: none; border: none; padding: 0;}
#cc_sec_archive02 .content .item .btn::before {content: none;}
#cc_sec_archive02 .content .item .btn::after{ font-family: 'icomoon'; content: "\ea0b"; margin: 0 0 4px 10px; font-size: 20px;}
.wrap_bbs_banner .swiper-container, .wrap_bbs_banner .banner {width:880px; position:relative}
#cc_sec_archive02 .swiper-container .item{overflow:hidden; height: 410px; border-radius: 0 40px 0 40px;}

#cc_sec_archive02 .controller{width: 100%; display: flex; justify-content: flex-end;}
#cc_sec_archive02 .controller .pageing{width: 200px; display: flex; justify-content: space-between; align-items: center;}
#cc_sec_archive02 .controller .pageing button{
  height: 64px;
  width: 64px;
  border: 0;
  -webkit-transition:background-color .3s;
  transition:background-color .3s;
  cursor:pointer;
  border-radius: 50%;
  border: 1px rgba(255,255,255,0.4) solid;
  display: flex;
  color:#fff;
  align-items: center;
  justify-content: center;
  font-family: 'icomoon';
  src:  url('icomoon/icomoon.eot?1ki0q8');
  src:  url('icomoon/icomoon.eot?1ki0q8#iefix') format('embedded-opentype'),
    url('icomoon/icomoon.ttf?1ki0q8') format('truetype'),
    url('icomoon/icomoon.woff?1ki0q8') format('woff'),
    url('icomoon/icomoon.svg?1ki0q8#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-size:24px;
  } 
#cc_sec_archive02 .controller .pageing button.prev:after{content: "\ea0a";}
#cc_sec_archive02 .controller .pageing button.prev,
#cc_sec_archive02 .controller .pageing button.next{background: transparent;}
#cc_sec_archive02 .controller .pageing button.next:after{content: "\ea0b";}
#cc_sec_archive02 .controller .pageing button:where(:hover, :focus){background-color: rgba(255,255,255,0.2);}
#cc_sec_archive02 .controller .pageing .num{color: #fff;}

#cc_sec_news01 > .inner {padding: 120px 0 60px; }

#cc_sec_news02 > .inner {padding: 200px 0 120px;}
#cc_sec_news02 { background-color: #f6f8f9; }
#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 > .inner {padding: 120px 0 60px;}
#cc_sec_archive03 .item {border-radius: 20px; box-shadow: 5px 5px 20px #adadad; overflow: hidden;}
#cc_sec_archive03 .item .cont {padding: 35px 40px; box-sizing: border-box}
#cc_sec_archive03 .item .cont .cate {margin-bottom: 30px; color: #222; font-size: 16px; font-weight: 600;}
#cc_sec_archive03 .item .cont .h1 {margin-bottom: 30px; height: 70px; color: #222; font-size: 25px; -webkit-line-clamp: 2; }
#cc_sec_archive03 .item .cont .t1 {margin-top: 0; height: 63px; -webkit-line-clamp: 2; }

#cc_sec_archive03 .item:where(:hover, :focus) .cont p.h1 {text-decoration: underline;}

#cc_sec_archive03 .item .thumb {border-radius: 0; background-position: center; background-size: cover;}
#cc_sec_archive03 .lst-thumb.col3 > * {margin: 0 0 100px 0;}
#cc_sec_archive03 .lst-thumb{gap: 1.7%;}
/* #cc_sec_archive03 .lst-thumb.col3 > * {width: 31.18%; margin-left: 3.23%;}
#cc_sec_archive03 .lst-thumb.col3 > *:nth-child(3n+1){margin-left:0;} */


/* 230417 재무상태표, 손익계산서 추가 */
/* 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;
}
/*230614 문화행사 아트홀 안내버튼 추가*/

/*h3 .btn-top a {font-size: 16px;}*/
.btn-top a { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 16px; font-weight: 700;}
.btn-top a.solid { background: #005891; color: #fff; font-weight: 500; border: 1px solid #005891; }
.btn-top a.solid img { margin-right: 10px; }
.btn-top a.stroke img { margin-left: 10px; }

/*     pohang     */
.btn-top {
    display: flex;
    justify-content: flex-end;
}

.btn-top a {
    float: left;
    border-radius: 100px;
    margin-left: 5px;
    text-align: center;
    line-height: 43px;
    padding: 0 25px;
    border: 1px solid #999;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.btn-top a.intro img {
    margin-left: 10px;
}

/*230802 탄소중립,HyREX ESG  상단 영상 재생/ 일시정지 버튼 추가*/
.sub-page-section .progressbar-pagination {
	z-index: 10;
	position: absolute;
    right: 52px;
    bottom: 54px;
}
.sub-page-section .progressbar-pagination .play button {
	cursor: pointer;
    width: 65px;
    height: 65px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, .3);
    font-size: 0;
    background-repeat: no-repeat;
    background-size: 50%;
    background-position: center;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' class='bi bi-play-fill' viewBox='0 0 16 16'%3E%3Cpath d='m11.596 8.697-6.363 3.692c-.54.313-1.233-.066-1.233-.697V4.308c0-.63.692-1.01 1.233-.696l6.363 3.692a.802.802 0 0 1 0 1.393z'/%3E%3C/svg%3E");
	border: none;
}
.sub-page-section .progressbar-pagination .play button.on {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'  fill='%23ffffff' class='bi bi-pause' viewBox='0 0 16 16'%3E%3Cpath d='M6 3.5a.5.5 0 0 1 .5.5v8a.5.5 0 0 1-1 0V4a.5.5 0 0 1 .5-.5zm4 0a.5.5 0 0 1 .5.5v8a.5.5 0 0 1-1 0V4a.5.5 0 0 1 .5-.5z'/%3E%3C/svg%3E");
}


/*  230503 광양제철소 견학 팝업 게시   */
#showimage .back_popup {position:fixed; width:100%; height:100%; z-index:100; background:rgba(0, 0, 0, 0.4); left:0; top:0; }
#showimage .product_popup {z-index: 100; position: fixed; width: 500px; left: 50%; top: 50%; margin-left: -250px; margin-top: -250px;}
#showimage .product_popup .popup_txt {width:500px; height:50px; line-height:50px; background-color:#222;}
#showimage .product_popup .popup_txt .input {float:left; margin-left:20px; line-height:50px; vertical-align: middle;}
#showimage .product_popup .popup_txt .input label {color:#fff; margin-left:10px; font-size:15px;}
#showimage .product_popup .popup_txt a {cursor:pointer; font-size:15px; float:right; color:#fff; padding:0 20px; line-height:50px; vertical-align: middle;}

/* 230613 개인정보처리방침 */
#privacy .terms h5 {padding-top: 50px; }
#privacy .terms p {margin-top: 20px;}
#privacy .terms ul {margin-top: 20px; font-size: 16px;}
#privacy .terms .btn-select {padding-top: 60px; }
#privacy .terms .point {color: #005891;}
#privacy .terms table {margin-top: 30px; margin-bottom: 30px; }
#privacy .terms table.labeling {margin-top: 50px;}
#privacy .terms table.labeling td::before {content: ''; display: block; width: 50px; height: 63px; margin: 0 auto 20px; background-position: 50%; background-repeat: no-repeat; background-size: contain;}
#privacy .terms table td.c1::before {background-image: url(/docs/kor7/jsp/resources/images/common/personal_info_01.jpg);}
#privacy .terms table td.c2::before {background-image: url(/docs/kor7/jsp/resources/images/common/personal_info_02.jpg);}
#privacy .terms table td.c3::before {background-image: url(/docs/kor7/jsp/resources/images/common/personal_info_03.jpg);}
#privacy .terms table td.c4::before {background-image: url(/docs/kor7/jsp/resources/images/common/personal_info_04.jpg);}
#privacy .terms table td.c5::before {background-image: url(/docs/kor7/jsp/resources/images/common/personal_info_05.jpg);}
#privacy .terms table td.c6::before {background-image: url(/docs/kor7/jsp/resources/images/common/personal_info_06.jpg);}
#privacy .terms table.privacy_list td {text-align: left;}
#privacy .terms table.privacy_list td a:where(:hover, :focus) {text-decoration: underline;}

/*240710 개인정보 처리방침 스타일 추가*/
#privacy .terms h3{display: flex; align-items: center; gap: 10px;} 
#privacy .terms h3:after{display: inline-block; content:''; width: 60px; height: 60px; background-image: url(/docs/kor7/jsp/resources/images/common/ico_privacy.png); background-size: 240px;} 
#privacy .terms #privacy_1 h3:after{width: 120px;} 
#privacy .terms #privacy_2 h3:after{background-position-x: -120px;} 
#privacy .terms #privacy_3 h3:after{background-position-x: -180px;} 
#privacy .terms #privacy_4 h3:after{background-position: 0px -60px;} 
#privacy .terms #privacy_5 h3:after{background-position: -60px -60px;} 
#privacy .terms #privacy_6 h3:after{background-position: -120px -60px;} 
#privacy .terms #privacy_7 h3:after{background-position: -180px -60px;} 
#privacy .terms #privacy_8 h3:after{background-position: 0px -120px;} 
#privacy .terms #privacy_9 h3:after{background-position: -60px -120px;} 
#privacy .terms #privacy_10 h3:after{background-position: -120px -120px;} 
#privacy .terms #privacy_11 h3:after{background-position: -180px -120px;} 


/*240531 미디어센터 스타일 추가*/
#mc_main_slide{margin-top: 100px;}
#mc_main_slide .mc_bg{width: 100%; height: 570px; position: absolute; top: 0; background-size: cover; background-position: center; }
#mc_main_slide .mc_bg.summer{background-image: url(/docs/kor7/jsp/resources/images/prcenter/mc_bg_summer.png);}
#mc_main_slide .mc_bg.default{background-image: url(/docs/kor7/jsp/resources/images/prcenter/mc_bg_default_2.png);}
#mc_main_slide .wrap_bbs_banner .swiper-container, #mc_main_slide .wrap_bbs_banner .banner {width: 100%; }
#mc_main_slide .wrap-mc-top .item{display: flex;}
#mc_main_slide .wrap-mc-top .item.youtube .bg-pos{width: 100%;}
#mc_main_slide .wrap-mc-top .item.youtube a div{width: 100%; height: 100%;background-position: center; background-size: cover; }
#mc_main_slide .wrap-mc-top .item video.pc{display: block;}
#mc_main_slide .wrap-mc-top .item video.mo{display: none;}

#mc_main_slide .bg-pos{position: static; flex: none; /*width: 773px*/ width: 40.25vw; height: 435px;}
#mc_main_slide .article_info{display:flex; flex-direction: column; justify-content: space-between; width: 100%; border: 1px solid #D5D5D5; box-sizing: border-box; padding: 65px 70px 95px 70px; background-color: #fff;}
#mc_main_slide .article_info > *{line-height: 1.5em; letter-spacing: -0.025em;}
#mc_main_slide .article_info .cate{font-size: 18px; font-weight: 600; color: #005793; margin-bottom: 30px;}
#mc_main_slide .article_info .tit{font-size: 28px; font-weight: 600; color: #111; line-height: 1.5em; word-break: break-all; }
#mc_main_slide .article_info .tit:hover{text-decoration: underline;}
#mc_main_slide .article_info .date{font-size: 18px; color: #111; }
#mc_main_slide .controller{float: right; margin-top: 20px;}
#mc_main_slide .controller .pageing{display: flex; gap: 10px;}
#mc_main_slide .controller .pageing > *{border: 1px solid #d5d5d5; border-radius: 4rem; height: 40px}
#mc_main_slide .controller .pageing > span{display: flex;justify-content: center; align-items: center; padding: 0 20px; line-height: 1.5; letter-spacing: 0; font-size: 16px; font-weight: 600; color: #666;}
#mc_main_slide .controller .pageing .num{min-width: 40px; background-color: #fff;}
#mc_main_slide .controller .pageing > span .c{color: #222;}
#mc_main_slide .controller .pageing > button{width: 40px; cursor: pointer; color: #000; background-color: #fff; font-family: 'icomoon'; src: url('icomoon/icomoon.eot?1ki0q8'); src: url('icomoon/icomoon.eot?1ki0q8#iefix') format('embedded-opentype'), url('icomoon/icomoon.ttf?1ki0q8') format('truetype'), url('icomoon/icomoon.woff?1ki0q8') format('woff'), url('icomoon/icomoon.svg?1ki0q8#icomoon') format('svg'); font-weight: bold; font-style: normal; font-size: 20px;display: flex;justify-content: center; align-items: center;} 
#mc_main_slide .controller .pageing > button.btn-autoplay:after{content: "";width: 10px; height: 14px; display: block; background-image: url(/docs/kor7/jsp/resources/images/common/mc_pause.png); }
#mc_main_slide .controller .pageing > button.btn-autoplay.on:after{background-image: url(/docs/kor7/jsp/resources/images/common/mc_play.png); background-size: cover; }
#mc_main_slide .controller .pageing > button.prev:after{content: "\ea0a";}
#mc_main_slide .controller .pageing > button.next:after{content: "\ea0b";}

#mc_banner_wrap .inner{background-image: url(/docs/kor7/jsp/resources/images/prcenter/mc_mid_banner.png);background-position: center; padding: 0; height: 60px; display: flex; justify-content: center;align-items: center; color: #fff; font-family: 's-core-dream-medium'; letter-spacing: -0.025em; font-size: 20px;}

#mc_articles_wrap>.inner {display: flex; }
#mc_articles_wrap a.move{float: left;}
#mc_articles_wrap a.move h2{display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
#mc_articles_wrap h2 ,#mc_social_slide .socialink_wrap h2{font-size: 24px; letter-spacing: -0.025em; font-weight: 600;}
#mc_social_slide .socialink_wrap h2{ margin-bottom: 30px; }
#mc_articles_wrap h2:after{display: block; width: 15px; height: 15px; content: ''; background-image: url(/docs/kor7/jsp/resources/images/common/plus_blue.png); }

#mc_articles_wrap .press_wrap{ width: 32.3%; flex: none; }
#mc_articles_wrap .press_wrap li{padding: 20px 0; border-top: 1px solid #d5d5d5; width: 100%; display: block; clear: both;}
#mc_articles_wrap .press_wrap li:last-child{border-bottom: 1px solid #d5d5d5; }
#mc_articles_wrap .press_wrap .press_cell{display: flex; gap: 20px; }
#mc_articles_wrap .press_wrap .press_cell .article_thumb{flex: none; width: 178px; height: 100px; display: block; background-position: center; background-size: 100%; }

#mc_articles_wrap .press_wrap .press_cell .article_info{display: flex; flex-direction: column; justify-content: space-between;}
#mc_articles_wrap .tit{font-size: 20px; font-weight: 500; letter-spacing: -0.025em; line-height: 1.5em; -webkit-line-clamp: 2; word-break: break-all;}

#mc_articles_wrap .right_box{margin-left: 3.431%; display: flex; flex-direction: column; justify-content: space-between;}
#mc_articles_wrap .right_box ul{width: 100%; display: grid;  grid-template-columns: 1fr 1fr 1fr; grid-gap: 2.1%;}
#mc_articles_wrap .right_box ul .article_thumb{width: 100%; height: 187px; display: block; content: ''; background-position: center; background-size: cover; }
#mc_articles_wrap .right_box ul .article_info{box-sizing: border-box; padding: 20px 20px 15px 20px; min-height: 116px; display: flex; flex-direction: column; justify-content: space-between;}
#mc_articles_wrap .right_box ul .article_info .tit{font-size: 18px; }
#mc_articles_wrap .right_box ul li a {transition: .3s all; border: 1px solid #d5d5d5;display: block; box-sizing: border-box; overflow: hidden;}
#mc_articles_wrap .right_box ul li a:hover {border-color: #222;}

#mc_articles_wrap ul li {overflow: hidden;}
#mc_articles_wrap ul li a .article_thumb{transition: .3s all;}
#mc_articles_wrap ul li a .article_info{position: relative; z-index: 10; background-color: #fff;}
#mc_articles_wrap ul li a:hover .article_thumb{transform: scale(1.05);}
#mc_articles_wrap .press_wrap .press_cell:hover .article_thumb{background-size: 105%; transform: scale(1);}
#mc_articles_wrap ul li a:hover .tit{text-decoration: underline;}

#mc_social_slide.sub-page-section { background-image: url(/docs/kor7/jsp/resources/images/prcenter/social_bg.png); background-position-x: 0%; background-position-y: bottom; background-repeat: no-repeat; background-size: contain; }
#mc_social_slide.sub-page-section .inner { display: flex; align-items: center; padding-bottom: 120px; }
/*.sub-page-section.social_slide .inner { display: flex; gap: 66px; align-items: center;}*/
#mc_social_slide .socialink_wrap{width: 20%; float: left; padding-right: 4.1%; box-sizing: border-box; }
#mc_social_slide .socialink_wrap li{border-top: 1px solid #D5D5D5;}
#mc_social_slide .socialink_wrap li:first-child{border: none;}
#mc_social_slide .socialink_wrap li a{display: flex; justify-content: space-between; align-items: center; font-size: 16px; letter-spacing: -0.025em; font-weight: bold; margin: 14px 0; transition: .2s all;}
#mc_social_slide .socialink_wrap li a:hover{color: #099DE8; text-decoration: underline;text-underline-offset: 2px;}
#mc_social_slide .socialink_wrap li a:after{ content: ''; display: block; width: 23px; height: 23px; transition: .2s all; }
#mc_social_slide .socialink_wrap li a.youtube:after{ background-image: url(/docs/kor7/jsp/resources/images/prcenter/icon_youtube.png); }
#mc_social_slide .socialink_wrap li a.insta:after{ background-image: url(/docs/kor7/jsp/resources/images/prcenter/icon_insta.png); }
#mc_social_slide .socialink_wrap li a.facebook:after{ background-image: url(/docs/kor7/jsp/resources/images/prcenter/icon_face.png); }
#mc_social_slide .socialink_wrap li a.youtube:hover:after{ background-image: url(/docs/kor7/jsp/resources/images/prcenter/icon_youtube_hover.png); }
#mc_social_slide .socialink_wrap li a.insta:hover:after{ background-image: url(/docs/kor7/jsp/resources/images/prcenter/icon_insta_hover.png); }
#mc_social_slide .socialink_wrap li a.facebook:hover:after{ background-image: url(/docs/kor7/jsp/resources/images/prcenter/icon_face_hover.png); }

#mc_social_slide .socialslide_wrap { float: left; width: 80%; }
#mc_social_slide .socialslide_wrap .swiper-slide { margin-right: 1.7% !important; }
#mc_social_slide .esg_subpage_list .item{ display: block; height: fit-content; padding: 0; overflow: hidden;    border-top-right-radius: 30px;}
#mc_social_slide .esg_subpage_list .item .img_wrap{ width: 100%; height: 155px; background-position: center; background-size: cover; transition: .3s all;}
#mc_social_slide .esg_subpage_list .item:hover .img_wrap{transform: scale(1.05); }
#mc_social_slide .esg_subpage_list .item .txt_wrap{ padding: 20px; border: 1px solid #D5D5D5; border-top: none; border-bottom-left-radius: 30px; background-color: #fff; position: relative; z-index: 10;}
#mc_social_slide .esg_subpage_list .item .txt_wrap *{ letter-spacing: -0.025em; }
#mc_social_slide .esg_subpage_list .item .txt_wrap .cate{ font-size: 14px; color: #005793; font-weight: bold; }
#mc_social_slide .esg_subpage_list .item .txt_wrap .tit{ font-size: 18px; font-weight: 500; color: #222; line-height: 1.5em; margin-bottom: 6px; -webkit-line-clamp: 2; min-height: 54px;}
#mc_social_slide .esg_subpage_list .item:hover .txt_wrap .tit{text-decoration: underline; }
#mc_articles_wrap .date, #mc_social_slide .esg_subpage_list .item .txt_wrap .date{text-align: left; font-size: 14px; letter-spacing: 0.025em; color: #666666; }
#mc_social_slide .swiper-nav{position: absolute; top: 50%; transform: translateY(-50%); right: -3.5vw; z-index: 10; display: flex; flex-direction: column-reverse; gap: 10px;}
#mc_social_slide .swiper-nav button{
  height: 50px;
  width: 50px;
  border: 0;
  -webkit-transition:background-color .3s;
  transition:background-color .3s;
  cursor:pointer;
  border-radius: 50%;
  border: 1px solid #D5D5D5;
  display: flex;
  color:#000;
  align-items: center;
  justify-content: center;
  font-family: 'icomoon';
  src:  url('icomoon/icomoon.eot?1ki0q8');
  src:  url('icomoon/icomoon.eot?1ki0q8#iefix') format('embedded-opentype'),
    url('icomoon/icomoon.ttf?1ki0q8') format('truetype'),
    url('icomoon/icomoon.woff?1ki0q8') format('woff'),
    url('icomoon/icomoon.svg?1ki0q8#icomoon') format('svg');
  font-weight: bold;
  font-style: normal;
  font-size:24px;
  } 
#mc_social_slide .swiper-nav button.swiper-prev:after{content: "\ea0a";}
#mc_social_slide .swiper-nav button.swiper-prev,
#mc_social_slide .swiper-nav button.swiper-next{background: #fff;}
#mc_social_slide .swiper-nav button.swiper-next:after{content: "\ea0b";}
#mc_social_slide .swiper-nav button:where(:hover, :focus){background-color: rgba(255,255,255,0.2);}

/*240328 보도자료 페이지 추가*/ 
#media_sec_press01 {width: 100%; height: auto; overflow: hidden; position: relative;}
#media_sec_press01 .inr-c2 {display: flex; align-items: center; position: relative;padding: 62px 0; max-width: 1460px;}
#media_sec_press01 .inr-c2 .news_bg {background-color: #014464; max-width: 1072px;}

#media_sec_press01 .content {color: #fff; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; z-index: 1; padding: 0 50px; width: 635px;height: 410px;flex: none; width: 50%;}
#media_sec_press01 .content .item {display: none;}
#media_sec_press01 .content .item.on {display: block;}
.bg-pos {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: cover; background-position: 50%; background-repeat: no-repeat; z-index: 0;}
#media_sec_press01 .content .item .cate {font-size: 18px;}
#media_sec_press01 .content .item .tit {height: 92px; color: #fff; font-size: 36px; letter-spacing: -0.025em; line-height: 1.277em; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;}
#media_sec_press01 .content .item .txt {height: 85px; margin-top: 20px; font-size: 20px; line-height: 1.5; letter-spacing: -0.025em; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; color: #DEDEDE;}
#media_sec_press01 .content .item .btn {position: relative; margin-top: 40px; color: #fff; height: auto; display: inline-flex; font-size: 18px; align-items: center; background: none; border: none; padding: 0;}
#media_sec_press01 .content .item .btn::before {content: ''; width: 0; height: 1px; background-color: #fff; position: absolute; top: 30px; left: -10px;}
#media_sec_press01 .content .item .btn::after{ font-family: 'icomoon'; content: "\ea0b"; margin: 0 0 4px 10px; font-size: 20px;}
#media_sec_press01 .content .item .btn:where(:hover, :focus)::before {width: 105%; }
#media_sec_press01 .wrap_bbs_banner .swiper-container,#media_sec_press01 .wrap_bbs_banner .banner {width:647px; position:relative}
#media_sec_press01 .swiper-container .item{overflow:hidden; height: 461px;}

#media_sec_press01 .controller{width: 100%; display: flex; justify-content: flex-end;}
#media_sec_press01 .controller .pageing{display: flex; justify-content: flex-start; align-items: center; align-items: flex-end; gap: 10px;  }
#media_sec_press01 .controller .pageing button{
  height: 64px;
  width: 64px;
  border: 0;
  -webkit-transition:background-color .3s;
  transition:background-color .3s;
  cursor:pointer;
  border-radius: 50%;
  border: 1px rgba(255,255,255,0.4) solid;
  display: flex;
  color:#fff;
  align-items: center;
  justify-content: center;
  font-family: 'icomoon';
  src:  url('icomoon/icomoon.eot?1ki0q8');
  src:  url('icomoon/icomoon.eot?1ki0q8#iefix') format('embedded-opentype'),
    url('icomoon/icomoon.ttf?1ki0q8') format('truetype'),
    url('icomoon/icomoon.woff?1ki0q8') format('woff'),
    url('icomoon/icomoon.svg?1ki0q8#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-size:24px;
  } 
#media_sec_press01 .controller .pageing button.prev:after{content: "\ea0a";}
#media_sec_press01 .controller .pageing button.prev,
#media_sec_press01 .controller .pageing button.next{background: transparent;}
#media_sec_press01 .controller .pageing button.next:after{content: "\ea0b";}
#media_sec_press01 .controller .pageing button:where(:hover, :focus){background-color: rgba(255,255,255,0.2);}
#media_sec_press01 .controller .pageing .num{color: #fff; margin-left: 15px; width: 45px;}

#media_sec_press02{overflow: visible;}
form[name="searchForm"]{position: relative; z-index: 10;}
#media_sec_press02 .inner{display: flex; align-items: center; justify-content: space-between; padding: 115px 0 0 0;} 
#media_sec_press02 .date_search{display: flex; gap: 10px; align-items: center; font-size: 14px; color: #707070;}

/* 미디어센터 이관할 때 삭제하기 ~*/
#media_sec_press02 input[name='startDate'], #media_sec_press02 input[name='endDate']{position: relative; z-index: 100; width: 161px;height: 45px; padding-right: 20px; box-sizing: content-box; background: url(/docs/kor7/jsp/resources/images/common/date_icon.png) no-repeat right 10px center; border: 1px solid #9E9E9E; border-radius: 0; display: flex; align-items: center;}
#media_sec_press02 input[name='startDate']::-webkit-clear-button,
#media_sec_press02 input[name='startDate']::-webkit-inner-spin-button,
#media_sec_press02 input[name='endDate']::-webkit-clear-button,
#media_sec_press02 input[name='endtDate']::-webkit-inner-spin-button{display: none;}
#media_sec_press02 input[name='startDate']::-webkit-calendar-picker-indicator, #media_sec_press02 input[name='endDate']::-webkit-calendar-picker-indicator {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: transparent;
	color: transparent;
	cursor: pointer;
}
#media_sec_press02 .date_search .btns a{display: block; height: 45px; line-height: 45px; width: 83px; text-align: center; border: 1px solid #9E9E9E; color: #222; background-color: #F5F5F5;}
.glyphicon-chevron-left:before{content:'<'!important;}
.glyphicon-chevron-right:before{content:'>'!important;}
.bootstrap-datetimepicker-widget table td.old, .bootstrap-datetimepicker-widget table td.new {color: #ddd!important;}
/*~ 여기까지 삭제하기 */

#mc_sub_head {margin: 110px 0 0 0; padding: 0;}
#mc_sub_head a.gohome_btn {display: inline-block; margin: 20px 0 30px; font-size: 18px; font-weight: 600; letter-spacing: -0.025em; margin-top: 20px; }
#mc_sub_head a.gohome_btn:before {content:'\ea0a';font-family: 'icomoon';
  src:  url('icomoon/icomoon.eot?1ki0q8');
  src:  url('icomoon/icomoon.eot?1ki0q8#iefix') format('embedded-opentype'),
    url('icomoon/icomoon.ttf?1ki0q8') format('truetype'),
    url('icomoon/icomoon.woff?1ki0q8') format('woff'),
    url('icomoon/icomoon.svg?1ki0q8#icomoon') format('svg');
  font-weight: bold; font-style: normal; margin-right: 5px;

}
#mc_sub_head .path_sub {margin-bottom: 0;}
#mc_sub_head .path_sub a:first-child span { display: block; width: 18px; height: 18px; background: url(/docs/kor7/jsp/resources/images/common/path_home.png) center; text-indent: 100%; white-space: nowrap; overflow: hidden; }
#mc_sub_head > .inner { display: block; max-width: 1460px; width: 90%; margin: 0 auto; box-sizing:border-box; border: none;}
#mc_sub_head:not(.biz) .title{padding-bottom: 40px;}
#mc_sub_head .title{background-position: center; background-size: cover; padding: 60px 0 40px; margin: 0;  } 
#mc_sub_head .title h2{font-size: 54px; font-weight: 600; color: #222;}
#mc_sub_head .toplink{background-color: #F5F5F5; margin-bottom: 75px;}
#mc_sub_head .toplink .inner:after{clear: both; content:''; display: block;}
#mc_sub_head .toplink .fl{float: left;}
#mc_sub_head .toplink .fr{float: right;}
#mc_sub_head .toplink a{display: flex; align-items: center; gap: 5px; color: #222; font-size: 20px; line-height: initial; letter-spacing: -0.025em; font-weight: 600; padding: 30px 35px; }
#mc_sub_head .toplink a:before,#mc_sub_head .toplink a:after{width: 16px; height: 10px; content: ''; display: none; background: url(/docs/kor7/jsp/resources/images/common/arrow_grey.png);}
#mc_sub_head .toplink a.fr:after{display: block; transform: rotate(90deg);}
#mc_sub_head .toplink a.fl:before{display: block; transform: rotate(-90deg);}

.tab.ty_mc{}
.tab.ty_mc ul{display: flex; gap: 5px;}
.tab.ty_mc ul li a{width: 152px; height: 50px; display: flex; align-items: center; justify-content: center; border: 1px solid #d5d5d5; font-size: 16px; line-height: 1.75em; font-weight: 500;}
.tab.ty_mc ul li.on a{border: 1px solid #099DE8; color: #099DE8;}
#mc_sub_tab > div{ margin-top: 80px; }
#mc_sub_tab .wrap_search2 input{font-size: 15px;}

/*썸네일스타일*/
section#mc_sub_list01{}
#mc_sub_list01 .inner{ padding: 0;}
#mc_sub_list01 .lst-thumb.col3 > *{margin-top: 50px; }
#mc_sub_list01 .lst-thumb.col3 > *:nth-child(-n+3){margin-top: 0px; }
#mc_sub_list01 .item .thumb{ height: 264px; border-radius: 0; }
#mc_sub_list01 .item .thumb>div{height: 100%; background-size: cover; background-position: center; transition: all .4s;}
#mc_sub_list01 .item .cont {border: 1px solid #d5d5d5; box-sizing: border-box; padding: 30px;min-height: 211px; display: flex; flex-direction: column; justify-content: flex-end;}
#mc_sub_list01 .item .cont .cate {font-size: 16px; font-weight: 500; color: #005793;  letter-spacing: -0.025em; margin-bottom: 10px;}
#mc_sub_list01 .item .cont .h1 {font-size: 24px; font-weight: 600; -webkit-line-clamp: 2;letter-spacing: -0.025em; word-break: break-all; line-height: 1.5; min-height: 72px;}
#mc_sub_list01 .item .cont .t1{font-size: 16px;letter-spacing: -0.025em;}
#mc_sub_list01 .item:hover .thumb>div{transform: scale(1.1);}
#mc_sub_list01 .item:hover .cont .h1 {text-decoration: underline; }
#mc_sub_list01 .bbs-pagination{padding-bottom: 260px;}
#media_sec_medias01 .bbs-pagination {padding-bottom: 185px;}
/*
#media_sec_press03 .inner{padding: 85px 0 0 0;}
#media_sec_press03 a.item {border-radius: 20px; border: 1px solid #ccc; overflow: hidden; box-sizing: border-box;}
#media_sec_press03 a.item .cont {padding: 40px 35px; box-sizing: border-box}
#media_sec_press03 a.item .cont .h1 {margin-top: 0; font-size: 28px; color: #222; -webkit-line-clamp: 2; line-height: 1.25em; letter-spacing: -0.025em; font-weight: 600;}
#media_sec_press03 a.item .cont .t1 {font-size: 16px; color: #666; letter-spacing: -0.025em; margin-top: 20px;}

#media_sec_press03 a.item .thumb {border-radius: 0; background-position: center; background-size: cover; height: 245px;}
#media_sec_press03 a.item .thumb div {width: 100%; height: 100%; background-size: cover; background-position: center; }
#media_sec_press03 .lst-thumb.col3 > * {margin: 0 0 50px 0;}
#media_sec_press03 .lst-thumb{gap: 1.7%;}
#media_sec_press03 .bbs-pagination {padding-top: 20px;}
#media_sec_press03 a.item:where(:hover, :focus) .cont .t1 {text-decoration: underline;}
#media_sec_press03 a.item:where(:hover, :focus) .thumb div { transition: .3s ease; transform: scale(1.1); }
*/
#mc_artile > .inner{padding-top: 110px;}
.wrap_bbs_view .top .back{ display: inline-flex; line-height: 1; align-items: center; }
.wrap_bbs_view .top .back .ff-en{font-size: 28px;color:#222;font-weight: 500;}
.wrap_bbs_view .top .back i{ color: #000; font-size: 34px; margin-right: 8px; }
.wrap_bbs_view .head{ text-align: center; padding-top: 55px; border-top: 2px solid #222; }
.wrap_bbs_view .head .h_1{ font-size: 32px; line-height: 1.5; font-weight: 600; }
.wrap_bbs_view .head .info{ font-size: 16px; color: #646464; display: flex; justify-content: center; line-height: 1; align-items: center; }
.wrap_bbs_view .group_info{ position: relative; display: flex; align-items: center; justify-content: center; margin-top: 40px; }
.wrap_bbs_view .sns_view{ margin-top: -5px; position: absolute; right: 0;top: 0; }

.wrap_bbs_view .head .info span.date{font-size: 18px;}
.wrap_bbs_view .cont{/*background-color: #f8f8f8;*/border-top: 1px solid #d5d5d5; padding: 80px 40px 0;margin-top: 52px;}
.wrap_bbs_view .cont > .inner{ max-width: 1140px; margin:0 auto; padding-bottom: 100px; }
.wrap_bbs_view .cont .sp_cont_wrap > p {margin-top: 25px; word-break: break-all; text-align: justify; color: #666;}
.wrap_bbs_view .cont .sp_cont_wrap > p strong{color: #222; font-weight: 600;}
.wrap_bbs_view .cont .sp_cont_wrap > p:nth-child(2) {margin-top: 30px;}
.wrap_bbs_view .cont .sp_cont_wrap > div {margin: 50px auto 0; width: 100%!important;}

.wrap_bbs_view .cont .sp_cont_wrap > div:has(img),.wrap_bbs_view .cont .sp_cont_wrap > p:has(img){/*width: fit-content!important;*/ margin: 50px auto 0 !important; display: flex; flex-direction: column; align-items: center;}
.wrap_bbs_view .cont .sp_cont_wrap > div.color_div {width: 960px!important;}

.wrap_bbs_view .cont .sp_cont_wrap > div:has(img) p{margin-top: 10px!important; font-size: 17px!important; font-weight: 400!important;}
.wrap_bbs_view .cont .sp_cont_wrap img{max-width: 100%;height: auto; }

.wrap_bbs_view .article_tags ul{display: flex; flex-direction: row; gap: 10px; max-width: 1140px; margin: auto;}
.wrap_bbs_view .article_tags ul li a{padding: 13px 15px; background-color: #eee; font-size: 16px; color: #666; letter-spacing: -0.025em; line-height: 1.5em; border-radius: 4rem; font-weight: 500;}
.wrap_bbs_view .article_tags ul li a:hover{text-decoration: underline;}

.wrap_bbs_view .page_direction{ border-top: 1px #ddd solid; border-width: 1px 0; margin-top: 60px; }
.wrap_bbs_view .page_direction > .inner{ display: flex; flex-direction: column; }
.wrap_bbs_view .page_direction .dir{width: 100%; padding: 40px 0; border-bottom: 1px solid #d5d5d5;} 
.wrap_bbs_view .page_direction .dir *{ color: #666;} 
.wrap_bbs_view .page_direction .dir,.wrap_bbs_view .page_direction .dir>a:not(.tit){ display: flex; gap: 40px; align-items: center;}  
.wrap_bbs_view .page_direction .dir .h{ display: flex; align-items: center; line-height: 1; font-size: 18px; margin-bottom: 10px; } 
.wrap_bbs_view .page_direction .dir .h i{ margin-right: 8px; font-size: 20px; font-weight: bold; transform: rotate(90deg);} 
.wrap_bbs_view .page_direction .dir .h span.t{ display: flex; align-items: center; gap: 5px; font-weight: bold; color: #222;}
#media_sec_view01 .wrap_bbs_view .page_direction .dir .h span.t:before{ content: '';display: block; width: 24px; height: 24px; background: url(/docs/kor7/jsp/resources/images/common/linked_icon.png) center; }
.wrap_bbs_view .page_direction .dir .h .t1{}
.wrap_bbs_view .page_direction .dir .tit{ display: inline-block; overflow: hidden; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; font-size: 18px; font-weight: 400; color: #666; }

.wrap_bbs_view .btn-bot.btn_list{display: flex; justify-content: center; margin-top: 60px;}
.wrap_bbs_view .btn-bot.btn_list li .btn{border-radius: 0; }
.wrap_bbs_view .btn-bot.btn_list li .btn{margin: 0 auto; border: 1px solid #222; padding: 10px 25px; color: #222; }
.wrap_bbs_view .btn-bot.btn_list li .btn:where(:hover, :focus) { background-color: #222; color: #fff; }


/*240409 미디어라이브러리 > 보도사진 스타일 추가*/
#media_sec_medias01 .item{position: relative; height: 235px; }
#media_sec_medias01 .item .cont{position: absolute; z-index: 10; width: 100%; height: 235px; padding: 15px; box-sizing: border-box; margin-top: 0; }
#media_sec_medias01 .item .cont > *{position: absolute; z-index: 5; bottom: 0; width: calc(100% - 30px); }
#media_sec_medias01 .item .cont .back{  z-index: 1; top: 0; left: 0; z-index: 1; width: 100%; background-blend-mode: multiply; background-size: cover; background-position: center;transition: .3s ease;  }
#media_sec_medias01 .item .cont:hover .back{transform: scale(1.1);}

#media_sec_medias01 .inner{padding-top: 30px; padding-bottom: 0;}
#media_sec_medias01 .item {border-radius: 0; overflow: hidden; box-sizing: border-box;}
#media_sec_medias01 .item .cont_top {position: absolute; z-index: 11; width: 100%; box-sizing: border-box; padding: 15px; display: flex; justify-content: space-between; }
#media_sec_medias01 .item .cont::before {display: block; content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0.8));}
#media_sec_medias01 .item .cont_top .img_size {display: flex; flex-direction: row; gap: 10px; align-items: center; padding: 0 10px; height: 30px; color: #fff; background-color: rgba(0,0,0,.5); font-size: 16px; letter-spacing: -0.025em; }
#media_sec_medias01 .item .cont_top .img_size:before {content: ''; display: block; width: 21px; height: 14px; background-image: url(/docs/kor7/jsp/resources/images/ico/pic_size_ico.png);}
#media_sec_medias01 .item .cont_top a { height: 30px; width: 30px; display: flex; align-items: center; justify-content: center; background-color: rgba(0,0,0,.5); }
#media_sec_medias01 .item .cont_top a:before { content: ''; display: block; height: 19px; width: 17px; background: url(/docs/kor7/jsp/resources/images/ico/ico_dl_wh.png) no-repeat center; }

#media_sec_medias01 .item .cont .h1 {margin-bottom: 15px; font-size: 18px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; letter-spacing: -0.025em; color: #fff;}
#media_sec_medias01 .item .cont .t1 {font-size: 16px; color: #DEDEDE; letter-spacing: -0.025em; margin: 0 0 20px 0;}

#media_sec_medias01 .lst-thumb.col4 > * { width: 24.6%; margin-left: 0.4%; margin-top: 8px;}
#media_sec_medias01 .item:where(:hover, :focus) .cont .t1 {text-decoration: underline;}
#media_sec_medias01 .item:where(:hover, :focus) .thumb div { transition: .3s ease; transform: scale(1.1); }

/*사진 슬라이드 스타일*/
/*#media_sec_view01 >.inner .image{display: block;}*/
#media_sec_view01 .wrap_bbs_view .head{border-bottom: 1px solid #e1e1e1; padding-bottom: 52px;}
#media_sec_view01 >.inner, #media_sec_view02 >.inner {overflow: hidden; position: relative; width: 90%; max-width: 1460px; margin: 0 auto; padding:110px 0 0px; overflow: visible;}
#media_sec_view02 >.inner {padding-bottom: 150px;}
#media_sec_view01 .wrap_bbs_view .cont{ border: 0; padding: 80px 0 0;}
#media_sec_view01 >.inner .image .list .inner {position: relative;}
#media_sec_view01 >.inner .image .list .slide_list > li {display: flex; justify-content: center; align-items: center; height:auto; background: #ddd; font-size: 48px; opacity: 0 !important;}
#media_sec_view01 >.inner .image .list .slide_list > li .img_down{position: absolute; top: 30px; right: 30px; display: flex; justify-content: center; align-items: center; width: auto; height: auto; background-color: rgba(0,0,0,.8); border-radius: 4rem; font-size: 16px; color: #fff; padding: 10px 24px; gap: 10px; }
#media_sec_view01 >.inner .image .list .slide_list > li .img_down::after{display: block; content: ''; width: 14px; height: 16px; background: url(/docs/kor7/jsp/resources/images/ico/ico_dl_wh.png) no-repeat center; background-size: cover; }
#media_sec_view01 >.inner .image .list .slide_list > li span{position: absolute; top: 100%; }
#media_sec_view01 >.inner .image .list .slide_list > li img{max-width: 100%; max-height: 650px; display: none;}
#media_sec_view01 > .inner .image .list .slide_list > li.swiper-slide-active {opacity: 1 !important;} 
#media_sec_view01 > .inner .image .list .slide_list > li.swiper-slide-active img {display: block;} 

#media_sec_view01 > .inner .image .list .btn {position: absolute; top: 300px; width: 60px; height:60px; border-radius: 4rem; z-index: 1;
	font-family: 'icomoon';
    src: url(icomoon/icomoon.eot?1ki0q8);
    src: url(icomoon/icomoon.eot?1ki0q8#iefix) format('embedded-opentype'), url(icomoon/icomoon.ttf?1ki0q8) format('truetype'), url(icomoon/icomoon.woff?1ki0q8) format('woff'), url(icomoon/icomoon.svg?1ki0q8#icomoon) format('svg');
    font-weight: bold;
    font-style: normal;
    font-size: 24px;    
    background-color: #fff;}
#media_sec_view01 .image .inner .list .btn.btn_prev {left: -85px; }
#media_sec_view01 .image .inner .list .btn.btn_next {right: -85px; }
#media_sec_view01 .image .inner .list .btn.btn_prev:after { content: "\ea0a";}
#media_sec_view01 .image .inner .list .btn.btn_next:after { content: "\ea0b";}

#media_sec_view01 .image .inner .list .swiper-pagination-progressbar {height: 3px; top:  auto; bottom: max(-11vw, -185px);; }
#media_sec_view01 .image .inner .list .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background: #2B3138; }

#media_sec_view01 .image .inner .thumbs {margin-top: 20px;}
#media_sec_view01 .image .inner .thumbs .slide_list > li {display: flex; justify-content: center; align-items: center; position: relative; height: 8vw; max-height: 135px; background: #ddd; background-size: cover; background-position: center; font-size: 24px; cursor: pointer;}
#media_sec_view01 .image .inner .thumbs .slide_list > li:before {content:''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0,0,0,.7) ; z-index: 1;}
#media_sec_view01 .image .inner .thumbs .slide_list > li.swiper-slide-thumb-active:before {display: none;}

#media_sec_view01 .wrap_bbs_view .img_ex_wrap {font-size: 18px; letter-spacing: -0.025em; line-height: 1.72em; margin: 70px auto; color: #666; margin-bottom: 50px; max-width: 1140px;}

#media_sec_view01 .wrap_bbs_view .img_ex_wrap li{display: none;}
#media_sec_view01 .wrap_bbs_view .img_ex_wrap li.on{display: block;}

/*동영상 스타일*/
/*#media_sec_view01 >.inner .video{display: none;}*/
#media_sec_view01 >.inner .video > .inner:first-child{position: relative; padding-top: 50.6%; overflow: hidden; height: auto; max-width: 1460px!important; }
#media_sec_view01 >.inner .video .inner iframe{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#media_sec_view01 .wrap_bbs_view .video .img_ex_wrap {width: 90%; }


#media_sec_view02 .wrap_bbs_view .page_direction > .inner {padding: 0 50px;}
#media_sec_view02 .wrap_bbs_view .page_direction .dir{width: 100%;}

#media_sec_view02 .wrap_bbs_view .page_direction .dir .tit{margin-top: 0; display: flex; gap: 50px; letter-spacing: -0.025em;}

#media_sec_view02 .wrap_bbs_view .page_direction .dir .right_wrap{display: flex; align-items: center; gap: 50px; }
#media_sec_view02 .wrap_bbs_view .page_direction .dir .tit .t{font-size: 18px; color: #222; }
#media_sec_view02 .wrap_bbs_view .page_direction .dir .tit .d{font-size: 16px; color: #666; }
#media_sec_view02 .wrap_bbs_view .page_direction > .inner .img{position: relative; background-size: 110%; background-position: center; height: 162px; width: 266px; transition: background-size .3s ease;}
#media_sec_view02 .wrap_bbs_view .page_direction > .inner .img::after{position: absolute; top: 0; left: 0; display: block;content: ''; width: 100%; height: 100%; background-color: rgba(0,0,0,.3);}
#media_sec_view02 .wrap_bbs_view .page_direction .dir .tit:hover .img{background-size: 120%;}
#media_sec_view02 .wrap_bbs_view .page_direction > .inner .tit_info{display: flex; flex-direction: column; justify-content: center;}
#media_sec_view01 > .inner >.wrap_bbs_view .cont > .inner, #media_sec_view02 >.inner {width: 90%; padding-bottom: 0;}
#media_sec_view01 > .inner .dir, #media_sec_view02 >.inner .dir {border-bottom: none;}
#media_sec_view02 .wrap_bbs_view .btn-bot.btn_list{padding-bottom: 150px;}
#media_sec_view01 .wrap_bbs_view .article_tags,#media_sec_view02 .wrap_bbs_view .article_tags {border-top: 1px #e1e1e1 solid;}
#media_sec_view01 .wrap_bbs_view .article_tags ul,#media_sec_view02 .wrap_bbs_view .article_tags ul {width: 100%; max-width: unset; margin-top: 50px;padding-bottom: 10px;}
#media_sec_view01 .wrap_bbs_view .page_direction, #media_sec_view02 .wrap_bbs_view .page_direction{ border-top:  1px #e1e1e1 solid; margin-top: 10px; }


/*검색 스타일*/ 
/* srch_wrap 검색 레이아웃 */  
#mc_search_detail  { overflow: visible; z-index: 11;} 
#mc_search_detail .inner { padding: 50px 0 0; } 
#mc_search_detail p { font-size: 24px;letter-spacing: -0.025em; font-weight: 500; color: #222;} 
#mc_search_detail .inner > div { display: flex; gap: 2vw; height: 40px; background-color: #F5F5F5; padding: 30px 40px; margin-top: 10px; } 
#mc_search_detail .inner > div > div { width: 50%; height: 100%; } 
#mc_search_detail .list_title, #mc_search_detail .result_box span.list_title { flex: none; color:#222; font-weight: 500; font-size:16px; } 
#mc_search_detail .custom_select { position:relative; display: flex; flex: none; }  
#mc_search_detail .custom_select .option_select { width: 100%; height: 100%; position:relative; font-size:0; display: flex; align-items: center; gap: 2vw;} 
#mc_search_detail .custom_select .option_select > div { height: 100%; box-sizing: border-box; display: flex; align-items: center; gap: 14px; } 
#mc_search_detail .custom_select .option_list .select_wrap { width:100%; height: 100%; position: relative;} 
#mc_search_detail .custom_select .option_list .select_btn { width:100%; height:36px; color:#333333; font-weight:400; text-align:left; padding:0 25px 0 10px; box-sizing:border-box; border:1px solid #cdcdcd; border-radius:1px; font-size:16px; background:#fff url(images/blet_arrow.png) no-repeat 100% 50%; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; } 
#mc_search_detail .custom_select .option_list.on .select_btn { background-image:url(images/blet_arrow_on.png) } 
#mc_search_detail .custom_select .option_list { position:relative; display:inline-block; font-size:14px; vertical-align:top; width: 55%; } 
#mc_search_detail .custom_select .option_list.search_option1 { width: 45%; } 
#mc_search_detail .custom_select .option_list.search_option2 { width: 55%; } 
#mc_search_detail .custom_select .option_list.on { z-index:102; } 
#mc_search_detail .custom_select .option_list ul { display: none; width: 100%; position: absolute; top: 1px; left: 0; min-height: 160px; height: 200px; z-index: 102; } 
#mc_search_detail .custom_select .option_list.on ul { display: block; } 
#mc_search_detail .custom_select .option_list ul li button { display:block; width:100%; height: 40px; font-size:16px; color:#4c4c4c; font-weight:400; text-align:left; box-sizing:border-box; padding-left:10px; border:1px solid #cdcdcd; border-top:none; background:#ffffff; cursor: pointer;} 
#mc_search_detail .custom_select .option_list ul li.on button { font-weight:600; background-color: #f1f1f1; } 
#mc_search_detail .custom_select .option_list ul li.on button,
#mc_search_detail .custom_select .option_list ul li:first-child button,
#mc_search_detail .custom_select .option_list .change_text { color:#4c4c4c; } /* addClass */
#mc_search_detail .custom_select .option_list .change_text { height: 100%; } /* addClass */
#mc_search_detail .custom_select .option_list ul li:first-child button, .custom_select .option_list ul li:first-child button:hover { height: 40px; background:#fff url(images/blet_arrow_on.png) no-repeat 100% 50%; color:#bdbdbd; } 
/* archive_new_letter > custom_select */

#mc_search_detail .result_box { position:relative; font-size:0; box-sizing: border-box; }  
#mc_search_detail .result_box .buttom_search { display: flex; gap:14px; align-items: center; width:100%; height: 100%; box-sizing:border-box; background:none; position:relative; } 
#mc_search_detail .result_box .buttom_search form { height: 100%; width: 100%; box-sizing: border-box;} 
#mc_search_detail .result_box .result_btm_area { display: flex; height: 100%; } 
#mc_search_detail .result_box .result_btm_area input[type="text"] { width:100%; height:100%; font-size:16px; color:#666; border:1px solid #d5d5d5; padding: 0 10px; box-sizing:border-box; } 
#mc_search_detail .result_box .result_btm_area button { width:83px; height:100%; background:#fff; border:1px solid #d5d5d5; font-size: 16px; font-weight:600; flex: none; margin-left: 10px; cursor: pointer;} 
#mc_search_detail .result_box .other_date { display:inline-block; margin-top:15px; margin-left:53px; color:#005386; font-size:14px; font-weight:600; text-decoration:underline; } 
#mc_search_detail .result_box .other_date:before { content:''; display:inline-block; width:12px; height:12px; background:url(images/posco_sprite.png) no-repeat -60px -40px; vertical-align:middle; margin-right:5px; } 
#mc_search_detail .result_box + .notice { padding:0 70px 30px 108px; font-size:14px; font-weight:bold; color:#666; line-height:1.6em; } 
#mc_search_detail .result_box + .notice .nowrap { white-space:nowrap; } 


/* 달력 datepicker css */
#mc_search_detail .srch_date { display:none; position:absolute; top:45px; left:0; z-index:200; width:616px; padding:20px 19px 20px; background-color:#ffffff; border:1px solid #bbbbbb } 

#mc_search_detail .srch_date .btns { display:flex; justify-content: center; margin-top: 20px;} 
#mc_search_detail .srch_date .btns button { margin:0 8px; cursor: pointer;} 
#mc_search_detail .srch_date .btns .btn_ok { display:inline-block; width:100px; height:36px; font-size:14px; font-weight:600; line-height:36px; border:1px solid #454545; background:#fff; } 
#mc_search_detail .srch_date .btns .btn_cancel { display:inline-block; width:100px; height:36px; font-size:14px; font-weight:600; line-height:36px; border:1px solid #454545; background:#fff; } 

#mc_search_detail .date_search{display: flex; gap: 10px; align-items: center; font-size: 14px; color: #707070;}
#mc_search_detail .date_search > div{width: 50%;}
#mc_search_detail .date_search > div .dropdown_menu{width: 50%;}

#mc_search_detail input[name='startDate'], #mc_search_detail input[name='endDate']{position: relative; z-index: 100; width: 100%;height: 45px; padding-right: 20px; box-sizing: border-box; background: url(/docs/kor7/jsp/resources/images/common/date_icon.png) no-repeat right 10px center; border: 1px solid #9E9E9E; border-radius: 0; display: flex; align-items: center;}
#mc_search_detail input[name='startDate']::-webkit-clear-button,
#mc_search_detail input[name='startDate']::-webkit-inner-spin-button,
#mc_search_detail input[name='endDate']::-webkit-clear-button,
#mc_search_detail input[name='endtDate']::-webkit-inner-spin-button{display: none;}
#mc_search_detail input[name='startDate']::-webkit-calendar-picker-indicator, #mc_search_detail input[name='endDate']::-webkit-calendar-picker-indicator {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: transparent;
	color: transparent;
	cursor: pointer;
}
#mc_search_detail .date_search .btns a{display: block; height: 45px; line-height: 45px; width: 83px; text-align: center; border: 1px solid #9E9E9E; color: #222; background-color: #F5F5F5;}
.glyphicon-chevron-left:before{content:'<'!important;}
.glyphicon-chevron-right:before{content:'>'!important;}
.bootstrap-datetimepicker-widget table td.old, .bootstrap-datetimepicker-widget table td.new {color: #ddd!important;}


/* .have_result 검색결과가 있을 때*/
#mc_search_list{padding-bottom: 110px;}
#mc_search_list .have_result{display: block;}
#mc_search_list .inner { padding: 70px 0 0; } 
#mc_search_list p.result_total { font-size: 24px; letter-spacing: -0.025em; font-weight: 500; } 
#mc_search_list p.result_total .result_cate { color: #005793; font-weight: 600;} 
#mc_search_list p.result_total .result_cate:before, #mc_search_list p.result_total .result_cate:after { content: '"'; } 

#mc_search_list .bbs-pagination{padding-bottom: 0px;}

#mc_search_list .list_item:last-child{border-bottom: 1px solid #d5d5d5; }
#mc_search_list .list_item{border-top: 1px solid #d5d5d5; padding: 30px 0; }
#mc_search_list .list_item > a{display: flex; flex-direction: row; gap: 30px; }
#mc_search_list .list_item .thumb{width: 400px; height: 224px; flex:none; background-size: 100%; background-position: center; transition: .3s all; }
#mc_search_list .list_item .item_right{display: flex; flex-direction: column; justify-content: space-between; }
#mc_search_list .list_item .item_cate{background-color: #DBEEFF; color: #005793; padding: 5px 10px 5px; font-size: 14px; letter-spacing: -0.025em;font-weight: 500; }
#mc_search_list .list_item .tit{font-weight: 500; color: #222; font-size: 24px; letter-spacing: -0.025em; }
#mc_search_list .list_item .date{ color: #666; font-size: 16px; letter-spacing: -0.025em; }

#mc_search_list .list_item > a:hover .tit{text-decoration: underline;}
#mc_search_list .list_item > a:hover .thumb{background-size: 105%;}

/* .no_result 검색결과가 없을 때*/
#mc_search_list .no_result{display: none; border-top: 1px solid #d5d5d5;}
#mc_search_list .no_result p.top{font-size: 20px; font-weight: 600; color: #222; text-align: center; letter-spacing: -0.025em; margin-top: 50px;}
#mc_search_list .no_result p.bot{font-size: 16px; text-align: center; letter-spacing: -0.025em; margin-top: 20px;}

/*미디어센터 > 미디어라이브러리 띠배너 스타일*/
#mc_ad_banner { position: relative; width: 100%; height: 130px; background-image: url(/docs/kor7/jsp/resources/images/prcenter/mc_ad_banner.png); background-size: cover; background-position: center; display: flex; flex-direction: column; justify-content: flex-end;} 
#mc_ad_banner a{box-sizing: border-box; width: 100%; height: 130px; padding: 35px 0; color: #fff;} 
#mc_ad_banner a .inner{display: block; width: 670px; margin: 0 auto; font-size: 28px; font-weight: 600; } 
#mc_ad_banner a .inner .txt_wrap{float: right;} 
#mc_ad_banner a .inner span{display: block; letter-spacing: -0.025em; line-height: 1.5em;} 
#mc_ad_banner a .inner .sub{font-size: 15px; font-weight: 500; } 

/*미디어센터 > 미디어라이브러리 띠배너 스타일 (메인)*/
#mc_ad_banner.main { background-image: url(/docs/kor7/jsp/resources/images/prcenter/mc_ml_banner.png);}
#mc_ad_banner.main a { color: #222;}
#mc_ad_banner.main a .inner { width: 690px;}

/*기사 카테고리 탭메뉴 스타일*/
#mc_sub_cate {}
#mc_sub_cate .tab.ty4 > ul  { margin-bottom: 35px; }
#mc_sub_cate .tab.ty4 > ul > li > a { width: auto; min-width: auto; height: auto; padding: 10px 15px; font-size: 16px; letter-spacing: -0.025em; line-height: 1.5em; font-weight: 500; }
#mc_sub_cate .tab.ty4 > ul > li.on > a{text-decoration: none; font-weight: 600;}