@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css");


/*************************************************** setting ***************************************************/
*{vertical-align:top; margin:0; padding:0;}
li{list-style:none;}
a{text-decoration:none;color: #333;}
body {font-family: /*'SUIT Variable', */"Pretendard Variable", Pretendard, system-ui, -apple-system, 'Segoe UI', Roboto, 'Noto Sans KR', 'Apple SD Gothic Neo', sans-serif; font-size: clamp(15px,0.833vw,16px); color: #333; word-break:keep-all; font-weight: 400;  }
.site-inner{max-width:1720px; width: 90%; margin:0 auto;}

[data-aos=fade-up] {
    transform: translate3d(0, 20px, 0);
}

/*************************************************** header ***************************************************/

.site-header{position:fixed; top:0; width: 100%; left:0;   z-index: 1000; transition:all ease .35s;}
.site-header .hd-cont{height: 90px; width: 100%;}
.site-header .hd-cont .logo{width: 120px; filter: brightness(0) invert(1); margin-top: 5px;}
.site-header .hd-cont .site-inner {display:flex; justify-content:space-between; align-items:center; gap:40px; height:100%;}
.site-header .hd-gnb{margin-left: auto; display:flex; gap:20px; height: 100%;}
.site-header .hd-gnb > li {position:relative;}
.site-header .hd-gnb > li > a{display:flex; align-items:center; justify-content:center; height: 100%; padding:0 20px; color: #fff; font-size: 18px; font-weight: 600;  }
.site-header .hd-gnb > li > ul{position:absolute; left:0; width: 200px; background: #072B31; padding:20px; opacity:0; visibility:hidden; transition:all ease .35s;}
.site-header .hd-gnb > li > ul > li > a{display:block; color: rgb(255 255 255 / 80%); padding:5px 0;}
@media (hover: hover) and (pointer: fine) {
	.site-header .hd-gnb > li > ul > li > a:hover{color: #fff;}
	.site-header .hd-gnb > li:hover > ul{opacity:1; visibility:visible;}
}
.site-header .hd-lang {position:relative; font-size: 15px;}
.site-header .hd-lang > a{color: #fff; height: 32px; padding:0 12px 0 14px; border:1px solid #fff; border-radius:50px;  width: 70px;   display:flex; align-items:center; gap:4px; cursor:pointer;}
.site-header .hd-lang > a:after{content:'';width: 16px; height: 16px; background: url('../images/icon-down.svg') no-repeat center center / contain; display:inline-block;  filter: brightness(0) invert(1);}
.site-header .hd-lang > ul{position:absolute; top:calc(100% + 5px); background: #fff; padding:4px 14px; border-radius:50px; width: 100%; text-align: center; opacity:0; visibility:hidden; border:1px solid #D9D9D6;}
.site-header .hd-lang > ul a{display:block; font-size: 14px; font-weight: 550;}
.site-header .menubar{ display:flex; width: 30px; height: 30px; flex-direction:column; justify-content:center; align-items:center; gap:4px; display:none;}
.site-header .menubar span{width: 100%; height: 2px; background: #fff; transition:all ease .35s;}
.site-header .hd-lang.on > ul{opacity:1; visibility:visible;}
.site-header.scr{transform:translateY(-90px);}
.site-header.on { background:#fff; box-shadow:0 2px 20px rgba(0,0,0,0.04); }
.site-header.active .logo,
.site-header.on .logo{filter:none;}
.site-header.active .hd-gnb > li > a,
.site-header.on .hd-gnb > li > a{color: #333;}
.site-header.active .hd-lang > a,
.site-header.on .hd-lang > a{color: #333; border-color:#D9D9D6;}
.site-header.active .hd-lang > a:after,
.site-header.on .hd-lang > a:after{filter:none;}
.site-header.active .menubar span,
.site-header.on .menubar span{background: #000;}
.site-header.active{transform:translateY(0) !important;}

/*************************************************** footer ***************************************************/
.site-footer { background: #fff;  color: #666; border-top:1px solid #ddd; }
.site-footer a{color: #666;}
.site-footer .site-inner{position:relative;}
.site-footer .ft-cont{display:flex; gap:20%; border-bottom:1px solid #D9D9D6;  padding-top: clamp(40px,7.292vw,140px); padding-bottom: clamp(20px,2.083vw,40px);}
.site-footer .ft-logo{width: 30%; max-width:400px;}
.site-footer .ft-info p{margin:0; font-size: clamp(14px, 0.833vw, 16px); display:flex; gap:clamp(10px,1.042vw,20px);} 
.site-footer .ft-info p + p{margin-top: clamp(5px,0.521vw,10px); margin-block-end:0;}
.site-footer .ft-info p span:first-child{ width:clamp(100px,5.208vw,100px); display:inline-block;}
.lang-en .site-footer .ft-info p span:first-child{width:clamp(100px,11.458vw,220px);}
.site-footer .ft-info p span + span{flex:1; position:relative; padding-left: clamp(10px,1.042vw,20px);}
.site-footer .ft-info p span + span:before{content:'';width: 1px; height: 12px; background: #ddd; position:absolute; left:0; top:5px;}
.site-footer .ft-info p a{text-decoration:underline;}
.site-footer .ft-btm{ padding: clamp(20px,2.083vw,40px) 0;  display:flex; justify-content:space-between; align-items:center;}
.site-footer .ft-link {margin-bottom: clamp(10px,1.042vw,20px);}
.site-footer .ft-link a + a{margin-left: clamp(20px,2.083vw,40px);}
.site-footer .ft-link a strong{color: #072B31; font-weight: 600;}
.site-footer .ft-sns{max-width:32px; aspect-ratio:1;}
.site-footer .top-btn{width: clamp(40px,2.865vw,55px); height: clamp(40px,2.865vw,55px); background: #072B31; color: #fff; border-radius:50%; border:0; padding:0; display:flex; align-items:center; justify-content:center; position:absolute; right:0; top:clamp(20px,2.083vw,40px); font-family:"Pretendard Variable"; font-size: 20px;}
.site-footer .copy{font-size: 14px; flex:1; margin:0;}
.site-footer .link-banner{background: #072B31;    }
.site-footer .link-banner .site-inner{height: clamp(50px,3.646vw,70px);  display:flex; justify-content:flex-end; gap:10px; align-items:center;}




/*************************************************** swiper ***************************************************/
.swiper-button-prev,
.swiper-button-next{width: clamp(40px,2.865vw,55px); height: clamp(40px,2.865vw,55px);  border-radius:50%; border:1px solid #fff;}
.swiper-button-next:after,
.swiper-button-prev:after{font-size: clamp(13px,0.833vw,16px);  font-weight: 600;color: #fff;  }
.swiper-navigation {display:flex; justify-content:space-between; align-items:center; width: 100%; overflow:hidden;}
.swiper-navigation .swiper-button-prev,
.swiper-navigation .swiper-button-next{ position:relative; top:auto; left:auto; right:auto; bottom:auto; transform:none; margin-top: 0; }


/*************************************************** main ***************************************************/
.front-main p{margin: 0 ; }
.front-main h1,
.front-main h2,
.front-main h3,
.front-main h4,
.front-main h5,
.front-main h6{ margin: 0 ; font-weight: 600; line-height: 1.5;}
.front-main .title{margin-bottom: clamp(20px,2.083vw,40px);}
.front-main .title h2{font-size: clamp(30px,2.5vw,48px); color: #072B31; font-weight: 600;}
.front-main .title h2 + h3{margin-top: clamp(20px,2.083vw,40px);}
.front-main .title h3{font-size: clamp(18px,2.188vw,34px);font-weight: 600;}
.front-main .title p{font-size: clamp(15px,1.042vw,20px); font-weight: 600;}
.front-main .title h2 + p{margin-top: clamp(20px,2.083vw,40px);}
.front-main .title p + h2{margin-top: clamp(20px,2.083vw,40px);}
.front-main .title + .btn{margin-top: 60px;}
.front-main .title .stit{color: #FFE800; font-weight: 600;}
.front-main .btn-wr{margin-top: clamp(30px,3.125vw,60px); }

/* visual */
.main-visual{width: 100%; height: 100vh; background: url('../images/main-visual.jpg') no-repeat center center / cover; color: #fff; display:flex; align-items:center; padding-bottom: 5vh;}
.main-visual h1{font-size: clamp(30px,2.917vw,56px);}
.main-visual p{font-size: clamp(18px,1.146vw,22px); margin-top: clamp(15px,1.042vw,20px); font-weight: 550;}
.main-visual .arr-btn{background: #7DE0E9; color: #072B31; margin-top: clamp(50px,4.167vw,80px);}

/* news */
.main-news{padding:clamp(70px,7.292vw,140px) 0; background: #072B31;   overflow:hidden;}
.main-news .arr-btn{background: #7DE0E9; color: #072B31; }
.main-news .title h2{color: #fff;}
.main-news .sbj{font-size: clamp(18px,1.25vw,24px); margin-top: clamp(16px,1.458vw,28px); font-weight: 600;   display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient: vertical; overflow: hidden;  text-overflow: ellipsis; color: #fff;}
.main-news .date{margin-top: clamp(20px,2.083vw,40px); color: rgba(255,255,255,0.6);}
.main-news .btn-wr{justify-content: center; margin-top: clamp(40px,4.167vw,80px); }
.main-news .news-swiper{position:relative;}
.main-news .news-swiper .thumb{border-radius:8px; overflow:hidden; aspect-ratio: 1.5;}
.main-news .news-swiper .thumb img{width: 100%; height: 100%; object-fit:cover; }
.main-news .title{display:flex; justify-content:space-between; align-items:flex-end;}
.main-news .swiper-navigation{position:relative;   width: clamp(90px,6.25vw,120px); height: clamp(40px,2.865vw,55px);}

/* projet */
.main-project .project-map {position:relative; width: 100%; height: 792px;  overflow:hidden;}
.main-project .project-map .map{width: 100%; height: 100%; background: url('../images/project-map.jpg') no-repeat center center / cover;  }
.main-project .project-map .title{background: #072B31; padding:clamp(40px,4.167vw,80px) 10%;  width: 90%;  max-width:1380px; margin:0; position:absolute; left:0; top:0; transform:translateY(-50%);}
.main-project .project-map .title h2{margin-top: 20px;}
.main-project .project-map .title *{color: #fff;}
.main-project .project-map .dot {  aspect-ratio: 1;  width: 16px;  background: #7DE0E9;  border-radius: 50%;}
.main-project .project-map .map > .dot{  position: absolute; left:50%; top:50%;     transform: translate(430px, 40px);}
.main-project .project-map .dot::after {  content: "";  position: absolute;  left: 50%;  top: 50%;  width: 20px;height: 20px;  background: #7DE0E9;  border-radius: 50%;  transform: translate(-50%, -50%) scale(1);  opacity: 0.6;  animation: ripple 1.8s ease-out infinite;}
.main-project .project-map .map-hbd {position:absolute; left:50%; top:50%; transform: translate(-380px, 160px); aspect-ratio:160 / 98; width: 160px; background: url('../images/map-hbd.svg') no-repeat center center / contain; display:flex; align-items:flex-start;     justify-content: space-around; padding-top: 23px; padding-left: 16px;}
.main-project .project-map .map-hbd .dot{position:relative;  background: #072B31;  }
.main-project .project-map .map-hbd .dot::after{background: #072B31;}
@keyframes ripple {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.6;
  }
  100% {
    transform: translate(-50%, -50%) scale(3.5);
    opacity: 0;
  }
}
.main-project .project-cont{padding:clamp(70px,7.292vw,140px) 0; }
.main-project .project-cont .site-inner{/*max-width:1400px;*/}
.main-project .project-cont .stit{color: #072B31;}
.main-project .project-cont .title p + h2{margin-top: clamp(10px,1.042vw,20px);}

.main-project .site-inner{position:relative;   /* max-width: 1620px;*/}
.main-project .project-spec{width: 60%; max-width:955px; display:flex;gap:clamp(10px,2.604vw,50px) 20px; flex-wrap:wrap; position:absolute; left:0; z-index:2; top:clamp(40px,4.167vw,80px);}
.main-project .project-spec li{display:flex;  gap:clamp(20px,1.563vw,30px); width: calc(33.33% - 20px); align-items: flex-start;}
.main-project .project-spec li p{display:flex; flex-direction:column; gap:4px; flex:1; font-weight: 400; font-size:clamp(14px,0.938vw,18px);color:#595959;}
.main-project .project-spec img{width:clamp(40px,3.125vw,60px);aspect-ratio:1;}
.main-project .project-spec strong{line-height: 1.3;font-size:clamp(20px,2.188vw,34px);font-weight: 600; color: #072B31;}
.main-project .project-spec strong.text{display: flex;align-items: center; font-size:clamp(20px,1.563vw,32px);}
.main-project .project-spec strong.small{display: flex;align-items: center; font-size:clamp(20px,1.354vw,26px);}


/* about */
.main-about{padding:0 0 clamp(70px,8.333vw,160px); overflow:hidden;}
.main-about .title{text-align: center;}
.main-about .about-banner{padding:clamp(50px,7.292vw,140px) 0; background: #FFE900;}
.main-about .about-banner .title{ display:flex; flex-direction:column; align-items:center; gap:clamp(20px,2.083vw,40px); margin:0; } 
.main-about .about-banner .title h2{    font-size: clamp(18px,2.188vw,34px);}
.about-swiper {position:relative;margin-top: clamp(70px,12.5vw,240px);}
.about-swiper .swiper-slide{display:flex; align-items:flex-start; background: #fff;}
.about-swiper .swiper-slide .left{width: 52%; height: 780px;}
.about-swiper .swiper-slide .right{width: 47%; padding:10% 8%; transition:all ease 1.2s; transform:translateY(20px); opacity:0;}
.about-swiper .swiper-slide .thumb{width: 100%; height: 100%; border-radius:0 1000px 1000px 0; overflow:hidden;}
.about-swiper .swiper-slide .thumb img{width: 100%; height: 100%; object-fit:cover; transform:scale(1.2); transition:all ease 1.1s;}
.about-swiper .swiper-slide-active .thumb img{transform:scale(1);}
.about-swiper .swiper-slide-active .right{transform:translateY(0); opacity:1;}
.about-swiper .swiper-slide .title{text-align:left;}
.about-swiper .swiper-navigation{position:absolute; width: 100px; height: 55px; background: #FFE800; color: #000; border-radius:55px; left: 52%; margin-left: -50px; top: 50%; transform:translateY(-50%);  z-index: 2;}
.about-swiper .swiper-pagination{left:60%; top:14%;     bottom: auto; width:auto;}
.about-swiper .swiper-pagination .swiper-pagination-bullet{transition:width ease .35s;  border-radius:8px; background: #CDD5D6; opacity:1;}
.about-swiper .swiper-pagination .swiper-pagination-bullet-active{background: #FFE800; width: 32px; }
.about-swiper .swiper-button-prev,
.about-swiper .swiper-button-next{border:0; width: 50px; height: 50px;}



/* sustain */
.main-sustain{padding:clamp(70px,8.333vw,160px) 0; background: #072B31;   color: #fff;}
.front-main .main-sustain .title h2{color: #7DE0E9;   } 
.main-sustain .arr-btn{background: #7DE0E9; color: #072B31;}
.main-sustain .sus-list{margin-top: clamp(40px,4.167vw,80px);}
.main-sustain .sus-list > ul{display:flex; gap:60px; flex-wrap:wrap; }
.main-sustain .sus-list > ul:last-child{justify-content:flex-end;}
.main-sustain .sus-list > ul + ul{margin-top: 110px;}
.main-sustain .sus-list > ul > li{width: calc(25% - 45px); max-width:384px; text-align: center;    display: flex;  flex-direction: column;   align-items: center;}
.main-sustain .sus-list .icon{width: 90px;  aspect-ratio: 100 / 80; display:flex; align-items:center; justify-content:center; align-self: center;}
.main-sustain .sus-list .icon img{object-fit:contain; max-height:100%; max-width: 100%;  height: 100%;}
.main-sustain .sus-list h3{margin-top: clamp(20px,2.083vw,40px); font-size: clamp(18px,1.406vw,27px);  }
.main-sustain .sus-list p{color: #ddd; font-size: clamp(14px,0.938vw,18px); margin-top: clamp(10px,1.042vw,20px); margin:0;}



/* winds */
.main-winds{position:relative; overflow:hidden;}
.main-winds .site-inner{padding:clamp(70px,7.292vw,140px) 0 clamp(140px,14.583vw,280px); border-top:1px solid #D9D9D6;} 
.main-winds .title .txt{margin-left: auto; margin-top: clamp(30px,4.167vw,80px); max-width:750px;}
.main-winds .windmill:nth-child(1){ transform: scale(.4); left:-10%;  filter: saturate(0.5) brightness(1.05);  }
.main-winds .windmill:nth-child(1) .blade{animation-duration:8s; }
.main-winds .windmill:nth-child(2){ transform: scale(.5); left:4%;   filter: saturate(0.5) brightness(1.05); }
.main-winds .windmill:nth-child(2) .blade{animation-duration:10s; }
.main-winds .windmill:nth-child(3){ transform: scale(.8);  left:74%; }



/* sub와 공통 컨텐츠 */
.windmill-wrap {width: 100%; position:absolute; height: 100%; left:0; bottom:-10px; z-index:-1; background: url('../images/wave.png') no-repeat center bottom / 100% auto;}
.windmill{position:absolute; left:0; bottom:0; width: 100%; max-width:673px; aspect-ratio: 637 / 1100;  transform-origin: bottom;}
.windmill .pillar{position:absolute;left:50%;bottom:0;transform:translateX(-50%); height: 63%;max-width: 68px; aspect-ratio: 68 / 723;}
.windmill .blade{ position:absolute;  left:37.4%; width: 100%;  top:7%; max-width: 637px;       aspect-ratio: 637 / 676;  transform-origin: 63% 51%;  animation: rotateBlade 6s linear infinite;}

@keyframes rotateBlade{
  from{transform:translateX(-50%) rotate(0deg);}
  to{transform:translateX(-50%) rotate(360deg);}
}




/*************************************************** cookie popup ***************************************************/
.cookie-popup { position: fixed;  bottom: 0;  left: 0;  right: 0;  background: #f7f9fa;   z-index: 99999; display:none; }
.cookie-popup h3{margin-bottom: clamp(5px,0.521vw,10px); margin-top: 0;font-weight: 600; font-size: clamp(16px,1.25vw,24px);}
.cookie-inner {  max-width: 1720px; width: 90%; margin:0 auto; margin: 0 auto; padding:clamp(20px,1.563vw,30px) 0; } 
.cookie-popup .cookie-cont p{margin:0; font-size: clamp(12px, 0.833vw, 16px);}
.cookie-popup .cookie-cont table{margin:0; width: 100%;}
.cookie-popup .cookie-cont a{text-decoration:underline; font-weight: 800;   color: #072B31;}
.cookie-btns {  display: flex;   gap: 8px;   width: 100%; margin-top: 20px;}
.cookie-btn {  border: none;  padding: 8px 20px ; min-width: 100px; font-size: clamp(12px,0.729vw,14px);  cursor: pointer; font-weight: 600;white-space: nowrap;  border:1px solid #072B31;   color: #072B31;}
.cookie-btn.agree {background: #072B31; color: #fff }
.cookie-hidden {   max-height: 0; overflow: hidden;  opacity: 0;  transition: max-height 0.3s ease, opacity 0.3s ease;  font-size: 14px;}
.cookie-hidden strong{display:block;   font-weight: 600;   flex-shrink: 0;width: 120px;font-size: 1em; margin-top: -1px;}
 

.cookie-hidden ul{margin-top: clamp(20px,1.563vw,30px); padding-top: clamp(20px,1.563vw,30px);  border-top:1px solid #ddd; }
.cookie-hidden ul li{display:flex; font-size: clamp(12px, 0.833vw, 16px);}
.cookie-hidden ul li + li{margin-top: 10px;}
.cookie-all{margin-left: auto;}
.cookie-all:after{content:'↓'; display:inline-block; margin-left: 5px; transition:all ease .35s;}
.cookie-all.on:after{transform:rotate(180deg); }


/*************************************************** sub ***************************************************/
.site-main p{ }
.site-main h1,
.site-main h2,
.site-main h3,
.site-main h4,
.site-main h5,
.site-main h6{ font-weight: 600; }
.site-main .title{margin-bottom: clamp(20px,2.083vw,40px);}
.site-main .title:last-child{margin-bottom: 0;}
.site-main .title h2{font-size: clamp(26px,2.5vw,48px); color: #000; margin:0;}
.site-main .title p{font-size: clamp(18px,1.042vw,20px); margin:0; font-weight: 400;}
.site-main .title h2 + p{margin-top: clamp(20px,2.083vw,40px);}
.site-main .title p + h2{margin-top: clamp(20px,2.083vw,40px);}
.site-main .title h3{font-size: clamp(24px,2.188vw,42px); color: #000; margin:0; font-weight: 600;}
.site-main{ padding : clamp(100px,7.292vw,140px) 0;}
.site-main .title p strong{font-weight: 600; color: #000;}
.lang-en .site-main .title p strong{font-weight: 800;}


/* btn */
.btn-wr{margin-top: clamp(30px,2.604vw,50px); display:flex;  gap:10px;}
.arr-btn{display:inline-flex; align-items:center; background: #072B31; padding:12px clamp(18px,1.25vw,24px); color: #fff; font-weight: 600; gap:8px; font-size: 16px;}
.arr-btn:after{content:'→';  display:inline-block; font-size: 1.2em;  line-height: 1; font-weight: 300;  font-family: 'Pretendard Variable'; }



/* page header */
.page-header{  }
.page-header:has(h1){padding-bottom: clamp(30px,3.125vw,60px); margin-bottom: clamp(30px,3.125vw,60px); border-bottom:1px solid #e5e5e5;}
.page-header h1{font-weight: 600; font-size: clamp(30px,3.75vw,72px); margin:0; }
.page-content .site-inner{max-width:1520px;}

 
  

/* breadcrumb */
.breadcrumb {margin-bottom: clamp(20px,2.083vw,40px);  color: #666; font-weight: 400;}
.breadcrumb .ico-home{display:block; width: 20px; height: 20px; background: url('../images/icon-home.svg') no-repeat center center / cover;}
.breadcrumb > ul{display:flex; align-items: center; }
.breadcrumb > ul > li + li:before{content:''; width: 3px; height: 3px; border-radius:50%; background: #999; display:inline-block; margin:0 14px; margin-top: -5px;  vertical-align:middle;}
.breadcrumb > ul > li:last-child{font-weight: 550; color: #000;}

/* sub visual */
.page-visual{  color: #000;}
.page-visual .sec-visual {position:relative; width: 100%;     height: clamp(40vh,50vw,100vh);}
.page-visual .sec-visual .site-inner{ display:flex; flex-direction:column; align-items:center; justify-content:center; color: #fff; height: 100%; gap:clamp(10px,1.042vw,20px);}
.page-visual .sec-visual h1{  margin:0; font-size: clamp(30px,3.75vw,72px);font-weight: 600; position:relative; z-index:2; text-align: center;}
.page-visual .sec-visual p{ position:relative; z-index:2; max-width:1000px; text-align: center; font-size: clamp(14px,0.938vw,18px);}
.page-visual .visual-bg{width: 100%; margin:0 auto; height: 100%; position:absolute; top:0; left:0; overflow:hidden;     pointer-events: none;}
.page-visual .visual-bg img{width: 100%; height: 100%; object-fit:cover;animation:visualScale 3s ease-out forwards;}
.page-visual .visual-bg figcaption {  font-size: 14px;  color: #fff; position:absolute; right:20px; bottom:20px; font-style:normal;}

@keyframes visualScale{
  0%{transform:scale(1.2);}
  100%{transform:scale(1);}
}





/* expected effect */
.expectation{padding-bottom: 0;}
.expectation .sec-overview{font-size: clamp(18px,1.667vw,32px); padding:clamp(40px,6.25vw,120px) 0; text-align: center; font-weight:550;}
.expectation .sec-port{background: #072B31; padding:clamp(70px,7.292vw,140px) 0; }
.expectation .sec-port .cards{display:flex; gap:40px;}
.expectation .sec-port .cards .card{width:calc(50% - 20px);}
.expectation .sec-port .cards .card .box{background: #f7f7f7; border-radius:20px; padding: 48px; font-size: 20px; margin-bottom: 20px;}
.expectation .sec-port .cards .card .box .tit{margin-bottom: 30px; font-size: 28px; font-weight: 600; text-align: center; color: #000;}
.expectation .sec-port .cards .card .box ul{background: #fff; border-radius:16px; padding:40px;}
.expectation .sec-port .cards .card .box ul li + li{margin-top: 20px; font-weight: 600;}
.expectation .sec-port .cards .card .box ul li {position:relative; padding-left: 14px; display:flex;   gap:20px; justify-content:space-between; font-weight: 600;}
.expectation .sec-port .cards .card .box ul li:before{content:''; width: 4px; height: 4px; background: #000; position:absolute; left:0; top:12px; border-radius:50%;}
.expectation .sec-port .cards .card .box ul li .total{ flex: 0 0 200px; display:inline-flex; gap:10%;}
.expectation .sec-port .cards .card .box ul li .total:before{content:'▶'; color: #FFE900;  display:inline-block; }
.expectation .sec-port .cards .card .noti{position:relative; padding-left: 32px;color: rgba(255,255,255,0.8); font-weight: 300; font-size: 18px;}
.expectation .sec-port .cards .card .noti:before{content:''; background: url('../images/decor-arrow.svg') no-repeat center center / contain; width: 10px; height: 10px; position:absolute; left:10px ;top:7px; }


/* 공통 컨텐츠 */
.tab-menu {text-align:center; background: #EBECEE; padding:clamp(6px,0.625vw,12px); border-radius:12px; display:flex; margin-bottom: clamp(40px,4.167vw,80px);}
.tab-menu li{  width: 100%;}
.tab-menu li a{cursor:pointer;  border-radius:10px; padding:clamp(10px,1.042vw,20px) 10px; display:flex; align-items:center; justify-content:center; font-size: clamp(16px,1.146vw,22px); font-weight: 600; color: #999;}
.tab-menu li a.active{color:#101010; background: #fff;  }
.tab{ display: none;}
.tab.active{ display: block;}
.sec-tech:last-child{padding-bottom: 0;}
.sec-tech .tech-box{display:flex; align-items:center;}
.sec-tech .tech-box + .tech-box{ margin-top: clamp(60px,6.25vw,120px);}
.sec-tech .tech-box .img{aspect-ratio:650 / 700; width: 42%; max-width:700px;}
.sec-tech .tech-box .img img{width: 100%; height: 100%; object-fit:cover;}
.sec-tech .tech-box .cont{width: 58%; padding:90px 90px 100px 0; font-size: clamp(16px,0.938vw,18px); display:flex; flex-direction:column; gap:clamp(16px,1.563vw,30px);}
.sec-tech .tech-box .cont .title{margin-bottom: 0;}
.sec-tech .tech-box .cont .btn-wr{margin-top: clamp(10px,1.042vw,20px);}
.sec-tech .tech-box .img + .cont{padding:clamp(20px,4.167vw,80px) 0 clamp(10px,4.167vw,80px) clamp(20px,5.208vw,100px);}
.sec-tech .tech-box .tag {display:flex; gap:clamp(6px,0.521vw,10px); flex-wrap:wrap; margin-top: clamp(-5px,-1.042vw,-20px);}
.sec-tech .tech-box .tag li{background: #f7f7f7; padding:clamp(6px,0.521vw,10px) clamp(14px,1.042vw,20px); border-radius:60px;display:flex; font-size: clamp(13px,0.833vw,16px);}
.sec-tech .tech-box .tag span + span:before{content:''; width: 2px; height: 12px; background: #d9d9d9;  display:inline-block; margin:0 10px;}
.sec-tech .tech-box .list{  }
.sec-tech .tech-box .list li{position:relative; font-size: clamp(16px,1.146vw,22px); font-weight: 600;  padding-left: 16px; } 
.sec-tech .tech-box .list li:before{content:''; width: 5px; height: 5px; background: #072B31; border-radius:50%; position:absolute; left:0; top:clamp(10px,0.677vw,13px);}
 /*
.sec-tech section .title{margin-bottom: clamp(40px,4.167vw,80px); width: 90%; padding-left: clamp(70px,17.708vw,340px); } 
*/
.sec-tech .tech-box .list li + li{margin-top: 4px;}
.sec-tech .tech-box .txt{ font-weight: 400; color: #666;}
.sec-tech .tech-box .txt strong{color: #111;}

/* overview section */
.sec-tech section .site-inner{max-width:1220px;}
.sec-tech section{position:relative;padding:clamp(70px,7.292vw,140px) 0; counter-increment:tech;}  
.sec-tech section .title h2{ font-weight: 600; font-size:clamp(24px,1.875vw,36px);}
/*
.sec-tech section:before{content:counter(tech, decimal-leading-zero); width: clamp(60px,15.625vw,300px); height: clamp(50px,5.208vw,100px); background: #283380;position:absolute; left:0; top:clamp(60px,6.25vw,120px); color: #fff; font-size: clamp(20px,2.5vw,48px); font-weight: 600;  padding-right: clamp(20px,3.125vw,60px);display:flex; justify-content:flex-end; align-items:center;}
*/
.sec-tech section:nth-child(2n + 1){background: #283380; color: #fff;}
.sec-tech section:nth-child(2n + 1) .tech-box .txt{color: rgba(255,255,255,.7);}
.sec-tech section:nth-child(2n + 1) .tech-box .list li:before{background: #fff;}
.sec-tech section:nth-child(2n + 1) .title h2{color: #fff;}
.sec-tech section:nth-child(2n + 1) .txt strong{color: #fff;}
.sec-tech section:nth-child(2n + 1):before{background: #fff; color: #283380;}
.sec-tech section .tech-box .list li{font-size: clamp(20px,1.458vw,28px);}
.sec-tech section .tech-box .list li:before{  top:clamp(12px,0.938vw,18px);}
.sec-tech section .tech-box .img{aspect-ratio:486 / 596; max-width:486px;}


.band-banner{width: 100%; background: #273373; height: clamp(60px,6.25vw,120px);  }
.band-banner .site-inner{height: 100%; display:flex; justify-content:flex-end; align-items:center; padding:clamp(15px,1.563vw,30px) 0;}
.band-banner img{max-height:100%;}


.sec-overview{padding:clamp(60px,6.25vw,120px) 0;  }
.sec-overview .site-inner{display:flex; gap:5%; align-items:center; justify-content:space-between;}
.sec-overview .ovv-img{ max-width:500px;}
.sec-overview .title h4{  color: #072B31; margin : clamp(16px,2.083vw,40px) 0 clamp(14px,1.042vw,20px); font-weight: 600; font-size: clamp(20px,1.25vw,24px)}
.sec-overview .title p{ color: #333; font-weight: 400;} 


.sec-feature section{padding:clamp(60px,6.25vw,120px) 0;}
.sec-feature section:nth-child(2n + 1){background: #f7f7f7;}
.sec-feature .img{height: clamp(200px,23.438vw,450px); margin-bottom: clamp(30px,3.125vw,60px); position:relative;}
.sec-feature .img figcaption {  font-size: 14px;  color: #fff; position:absolute; right:20px; bottom:20px; font-style:normal;}
.sec-feature .img img{width: 100%; height: 100%; object-fit:cover;}
.sec-feature .cont{display:flex; gap:clamp(10px,1.042vw,20px);}
.sec-feature .cont .tit{width: 45%; font-size: clamp(24px,2.292vw,44px); font-weight: 600;}
.sec-feature .cont .txt{flex:1;font-size: clamp(17px,0.938vw,18px); display:flex; flex-direction:column; gap:clamp(16px,1.042vw,20px);}
.sec-feature .cont .txt li{position:relative; font-weight: 600; color: #101010; padding-left: 16px; font-size: clamp(18px,1.042vw,20px);} 
.sec-feature .cont .txt li:before{content:''; width: 4px; height: 4px; background: #101010; border-radius:50%; position:absolute; left:0; top:clamp(12px,0.677vw,13px);} 
.sec-feature .cont .txt li + li {margin-top: 4px;}




/*************************************************** page ***************************************************/
/* shareholder */
.shareholder .sec-value{background: #072B31; color: #fff; padding:clamp(60px,6.25vw,120px) 0;}
.shareholder .sec-value .title h2{color: #fff;}
.shareholder .sec-value .value-list{  display:flex; gap:clamp(20px,2.083vw,40px); flex-wrap:wrap; padding-top: 20px;}
.shareholder .sec-value .value-list > li { position:relative; width:calc(33.33% - clamp(16px,1.406vw,27px));   background: rgba(255,255,255,0.12); border-radius:12px;  padding: 40px 20px; font-size: clamp(18px,1.146vw,22px); font-weight: 550;display:flex; flex-direction:column; gap:clamp(20px,1.563vw,30px); justify-content:flex-end; align-items:center; text-align: center;}
.shareholder .sec-value .value-list .icon{max-width: clamp(60px,3.854vw,74px);  }
.shareholder .sec-value .value-list .icon img{width: 100%; height: 100%; object-fit:contain;}
.shareholder .band-banner{background: #FFE900;}


/* esg */
.esg{padding-bottom: 0;}
.esg .sec-core{padding:clamp(70px,7.292vw,140px) 0 0; text-align: center;}
.esg .sec-core .site-inner{}
.esg .sec-core .core-list {background: #F7F7F7; padding:50px; border-radius:50px; display:flex; margin: clamp(30px,3.125vw,60px) auto 0; justify-content:space-between;;  }
.esg .sec-core .core-list > li{width: 24%; font-size: clamp(20px,1.25vw,24px); font-weight: 600;}
.esg .sec-core .core-list > li .circle{position:relative; width: 200px; aspect-ratio: 1; border:24px solid #fff; background: #283380; display:flex; align-items:center; justify-content:center; border-radius:50%; margin:0 auto 20px;}
.esg .sec-core .core-list > li .circle:before{content:''; width: calc(100% + 24px); height: calc(100% + 24px); position:absolute; left:-12px; top:-12px;border:12px solid #DEE7EA; border-radius:50%;}
.esg .sec-core .core-list > li:not(:last-child) .circle:after{content:''; width: 164px; height: 1px; border-top:1px dashed #283380; position:absolute; left:calc(100% + 12px); top:50%; z-index:2;}
.esg .sec-core .core-list > li .icon{width: 65%; aspect-ratio: 1.8; }
.esg .sec-core .core-list > li:not(:last-child) .icon:after{content:''; width: 6px; height: 6px; background: #283380; border-radius:50%; position:absolute; right:-15px; top:50%; margin-top:-3px;}
.esg .sec-core .core-list > li:not(:first-child) .icon:before{content:''; width: 6px; height: 6px; background: #283380; border-radius:50%; position:absolute; left:-15px; top:50%; margin-top:-3px;}
.esg .sec-core .core-list > li .icon img{  object-fit: contain;max-height: 100%;max-width: 100%;height: 100%;}
.esg .sec-core .core-list > li h3{font-size: 22px;}
.esg .sec-core .core-list > li p{font-size: 16px;}
.esg .sec-news{   padding:clamp(70px,7.292vw,140px) 0;}
.esg .sec-news .site-inner{position:relative;}
.esg .sec-news .esg-swiper{overflow:hidden;}
.esg .sec-news .title h2{  text-align: center;}
.esg .sec-news .thumb{margin-bottom: clamp(20px,1.563vw,30px); aspect-ratio: 480 / 320;}
.esg .sec-news .thumb img{width: 100%; height: 100%; object-fit:cover;}
.esg .sec-news .sbj{ font-size: clamp(18px,1.146vw,22px); margin-top: clamp(15px,1.042vw,20px);}
.esg .sec-news .date{  margin-top: clamp(10px, 0.833vw, 16px);     font-size: clamp(14px, 0.833vw, 16px);}
.esg .sec-news .cate{  padding:clamp(4px,0.417vw,8px) clamp(10px,0.833vw,16px); border-radius:4px; display:inline-block; font-size: clamp(13px, 0.833vw, 16px); }
.esg .sec-news .swiper-button-prev{ left:-80px;  }
.esg .sec-news .swiper-button-next{ right:-80px;  }
.esg .sec-news .swiper-button-prev,
.esg .sec-news .swiper-button-next{position:absolute; border:none; background: #072B31; top:50%;}
.esg .sec-news .swiper-button-prev:after,
.esg .sec-news .swiper-button-next:after{color: #fff;}
.esg .main-sustain .sus-list{margin-top: 0;}

/* overview */
.overview{padding-bottom: 0;}
.overview .main-project .site-inner{max-width:1520px;}
.overview .sec-timeline{position:relative; padding:clamp(70px,7.292vw,140px) 0 clamp(200px,15.625vw,300px); overflow:hidden;}
.overview .sec-timeline .site-inner{display:flex; justify-content:space-between;}
.overview .sec-timeline .title{width: 50%; max-width:700px; padding-right: 5%;}
.overview .sec-timeline .tl-cont{ position: relative; width: 50%; margin-top: clamp(50px,5.208vw,100px); }
.overview .sec-timeline .tl-cont li + li{padding-top: clamp(20px,5.208vw,100px);}
.overview .sec-timeline .tl-cont h3{display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom: 18px; color: #111; font-size: clamp(22px,1.458vw,28px); color: #4ed3df;}
.overview .sec-timeline .tl-cont li:has(.const) h3{color: #072B31;}
.overview .sec-timeline .tl-cont p{ font-size: clamp(16px,0.938vw,18px);     text-indent: -7px;   padding-left: 12px;}
.overview .sec-timeline .tl-cont p:before{content:'·'; display:inline-block; font-weight: bold; margin-right: 5px;}
.overview .sec-timeline .tl-cont h3,
.overview .sec-timeline .tl-cont p{ opacity:.4;transition:.3s; }
.overview .sec-timeline .tl-cont .period{background: #a7ecf3; padding:8px 10px; border-radius:4px; font-size: clamp(13px,0.781vw,15px); line-height: 1;color: #111; }
.overview .sec-timeline .tl-cont .period.const{    background: #072B31; color: #fff;}
.overview .sec-timeline .tl-cont .tl-line{position:absolute;left:0;top:0;width:2px;height:calc(100% - clamp(70px,4.167vw,80px));background:#D9D9D9}
.overview .sec-timeline .tl-cont .tl-progress{position:absolute;left:0;top:0;width:2px;height:0;background:#072B31}
.overview .sec-timeline .tl-cont .tl-progress:before{content:''; width: 6px; height: 6px; position:absolute; left:-2px; top: -2px; border-radius:50%; background:#072B31;}
.overview .sec-timeline .tl-cont .tl-progress:after{content:''; width: 18px; height: 18px; position:absolute; left:-8px; top: -8px; border-radius:50%; background:#072B31; opacity:.2;}
.overview .sec-timeline .tl-cont li:not(:first-child):before{content:''; width: 6px; height: 6px; position:absolute; left:-2px; top:clamp(38px,6.354vw,122px); border-radius:50%; background:#ddd; transition:.3s; }
.overview .sec-timeline .tl-cont li{position:relative;   padding-left: clamp(40px,4.167vw,80px);}
.overview .sec-timeline .tl-cont li.active h3,
.overview .sec-timeline .tl-cont li.active p{opacity:1}
.overview .sec-timeline .tl-cont li.active:before{background:#072B31;}
.sec-project {padding:clamp(70px,7.292vw,140px) 0;}
.sec-project .site-inner{    max-width: 1400px;}
.sec-project ul{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(30px,4.167vw,80px) clamp(20px,2.083vw,40px);}
.sec-project li{list-style:none;}
.sec-project .thumb {aspect-ratio: 740 / 400; border-radius:20px; overflow:hidden; margin-bottom: clamp(20px,2.083vw,40px);}
.sec-project .thumb img{width:100%; height: 100%; object-fit:cover;}
.sec-project .text h3{font-size:clamp(24px,1.875vw,36px);font-weight: 600;margin-bottom:clamp(10px,1.042vw,20px);}
.sec-project .text p{ font-size: clamp(16px,0.938vw,18px); font-weight: 400;color:#666;  }
.sec-project .btn-wr{justify-content:center;}
.overview .sec-timeline .windmill:nth-child(1){ transform: scale(.5); left:-5%;  filter: saturate(0.5) brightness(1.05); }
.overview .sec-timeline .windmill:nth-child(1) .blade{animation-duration:8s; }
.overview .sec-timeline .windmill:nth-child(2){ left:10%;   z-index:1;}
.overview .sec-timeline .windmill:nth-child(2) .blade{animation-duration:10s; }
.overview .sec-timeline .windmill:nth-child(3){ transform: scale(.4);  left:18%; filter: saturate(0.5) brightness(1.05);}




/* kofwind */
.kofwind{padding-bottom: 0;}
.kofwind .sec-company{padding:clamp(70px,7.292vw,140px) 0; background:url('../images/kofwind-bg.jpg') no-repeat #072B31 left bottom / contain; color: #fff;}
.kofwind .sec-company .site-inner{display:flex; gap:5%; }
.kofwind .sec-company .title{width: 50%;}
.kofwind .sec-company .title h2{color: #fff;}
.kofwind .sec-company .company-list{width: 50%; }
.kofwind .sec-company .company-list > li{padding:clamp(24px,1.875vw,36px) 0; border-bottom:1px solid rgba(255,255,255,0.1); font-size: clamp(16px,1.042vw,20px); display:flex; }
.kofwind .sec-company .company-list > li a{color: #fff; text-decoration:underline;}
.kofwind .sec-company .company-list > li strong{font-size: clamp(17px,1.25vw,24px);   font-weight: 600; display:inline-block; width: clamp(80px,10.417vw,200px);   flex-shrink: 0;}
.kofwind .band-banner img{ filter: brightness(0) invert(1);}


/* people */
.people {padding-bottom: 0;}
.people .sec-people{padding:clamp(70px,7.292vw,140px) 0;}
.people .sec-people .img{width: 100%; margin-bottom:  clamp(30px,3.125vw,60px); }
.people .sec-people p{width: 60%; margin-left: auto; font-size: clamp(16px, 1.042vw, 20px);}
.people .sec-who {padding:clamp(70px,7.292vw,140px) 0; background: url('../images/people-bg.jpg') no-repeat center center / cover;}
.people .sec-who .title{backdrop-filter:blur(18px); background: rgba(255,255,255,0.08); padding:clamp(30px,4.167vw,80px) clamp(30px,6.25vw,120px);  display:flex; align-items:center;}
.people .sec-who .title h2{color: #fff; width: 40%; font-weight: 600; font-size: clamp(24px,2.083vw,40px);}
.people .sec-who .title p{color: #fff; width: 60%; margin:0;     font-size: clamp(16px, 1.042vw, 20px);}


/* region */
.region {padding-bottom: 0;}
.region .sec-strength{position:relative; }
.region .sec-strength .sections{ width: 100%; }
.region .sec-strength .sections section{position:relative; padding:clamp(60px,7.292vw,140px) 0;    }
.region .sec-strength .sections section .site-inner{padding-left: clamp(20px,20.833vw,400px);}
.region .sec-strength .page-nav{position:sticky; max-width:300px;    align-self: start;  float: left; left:calc(50% - 760px); top:0; padding:clamp(70px,7.292vw,140px) 0; z-index:2; transition:top ease .35s;}

body:has(.site-header.scr) .region .sec-strength .page-nav{top:-90px;}


.region .sec-strength .page-nav a{display:flex; gap:10px; align-items:center; color: rgb(170 170 170 / 80%); font-size: 18px; font-weight: 500;  border-radius:60px; padding-left: 10px; line-height: 1.2; padding:20px 24px; background: rgb(170 170 170 / 13%); transition:all ease .35s;  word-break:break-all;    backdrop-filter: blur(50px);}
.region .sec-strength .page-nav a:before{content:''; width: 4px; height: 4px; border-radius:50%; background: rgb(170 170 170 / 50%); flex-shrink:1; }
.region .sec-strength .page-nav a.active{color: #fff; font-weight: 600;  background: #072B31;}
.region .sec-strength .page-nav a.active:before{background: #fff;}
.region .sec-strength .page-nav li + li{margin-top: clamp(10px,1.042vw,20px);}
.region .sec-strength .sections .txt{ margin-top: clamp(20px,2.083vw,40px);  }
.region .sec-strength .sections .txt p{font-size: clamp(16px,0.938vw,18px); font-weight: 400; margin:0;}
.region .sec-strength .sections .txt p + p{margin-top: clamp(10px,1.042vw,20px);}
.region .sec-strength .sections .txt strong{font-size: clamp(18px,1.25vw,24px); font-weight: 600;}
.region .sec-strength .sections section:nth-child(2n+1){background: #072B31; color: #fff;}
.region .sec-strength .sections section:nth-child(2n+1) .title h3{color: #fff;}
.region .sec-strength .page-nav li:nth-child(2n+1):has(.active) a{background: #fff; color: #072B31;}
.region .sec-strength .page-nav li:nth-child(2n+1):has(.active) a:before{background: #072B31; }


/* partnership */
.partnership{padding-bottom: 0;}
.partnership .flex-box{display:flex; font-size: clamp(16px,1.042vw,20px);}
.partnership .flex-box .left{width: 40%;max-width: 380px; padding-right: 20px;}
.partnership .flex-box .right{flex:1;}
.partnership .flex-box .txt{ }
.partnership .flex-box .link-box{margin-top: clamp(20px,2.083vw,40px); background: #f7f7f7; text-align: center; padding:clamp(20px,2.083vw,40px);}
.partnership .flex-box .link-box p {margin:0;}
.partnership .flex-box .link-box .arr-btn{font-size: clamp(14px,0.938vw,18px); width: 100%; justify-content: center; margin-top: clamp(20px,1.563vw,30px); padding:clamp(14px,1.042vw,20px);}
.partnership .flex-box .link-box .arr-btn::after{transform:rotate(-45deg); margin-top: 1px;}
.partnership .flex-box .step-list{margin-bottom: clamp(20px,2.083vw,40px); }
.partnership .sec-recruit{padding:clamp(70px,7.292vw,140px) 0;}

.partnership .sec-recruit .txt + .step-list{margin-top: 20px;}


.partnership .sec-recruit .step-list{display:flex; gap:40px; counter-reset: step;}
.partnership .sec-recruit .step-list > li{counter-increment: step;  position: relative; width:100%; text-align: center;    border:1px solid #ddd; border-top:2px solid #283380; padding:clamp(30px,2.604vw,50px) clamp(20px,2.083vw,40px); display:flex; justify-content:flex-start; align-items:center; flex-direction:column;  }
.partnership .sec-recruit .step-list > li h3{ font-weight: 600;font-size: clamp(20px,1.25vw,24px); }
.partnership .sec-recruit .step-list > li p{ font-size: clamp(16px,0.938vw,18px);  font-weight: 400;}
.partnership .sec-recruit .step-list > li:nth-child(2n){border-top:2px solid #7DE0E9;}
.partnership .sec-recruit .step-list > li::before { content: counter(step, decimal-leading-zero);  position: absolute;  top: 20px;  left: 0;color: #072B31; font-weight: 600; font-size: clamp(16px,0.938vw,18px); background: #efefef; padding:9px 28px 9px 24px; border-radius: 0 24px 24px 0; text-align: center;}
.partnership .sec-recruit .step-list .icon{ width: clamp(60px,4.167vw,80px); aspect-ratio:1; margin-bottom: clamp(20px,1.563vw,30px);}
.partnership .sec-recruit .step-list .icon img{width: 100%; height: 100%; object-fit:contain; transition:all ease .5s;}
.partnership .sec-recruit .step-list > li:hover .icon img{ transform:scale(1.1);}
.partnership .sec-partner{padding:clamp(70px,7.292vw,140px) 0; background: #ecf6fa; }
.partnership .sec-partner .link-box{background: #fff;}


/* location */
.location{padding-bottom : 0;}
.location .sec-loc .loc-box{display:flex; }
.location .sec-loc .loc-box .map{width: 60%;  }
.location .sec-loc .loc-box .map iframe{width: 100%; height: 100%; }
.location .sec-loc .loc-box .info{width: 40%; background: #072B31; color: #fff; padding:clamp(60px,15.625vw,300px) 5% clamp(80px,8.333vw,160px); }
.location .sec-loc .loc-box .info .loc-logo{ width: clamp(120px,9.219vw,177px); filter: brightness(0) invert(1);}
.location .sec-loc .loc-box .info > ul { margin-top: clamp(40px,5.208vw,100px);}
.location .sec-loc .loc-box .info > ul > li {display:flex; gap:20px; align-items:center;}
.location .sec-loc .loc-box .info > ul > li strong{font-size: 20px; display:block; margin-bottom: 10px;}
.location .sec-loc .loc-box .info > ul > li + li{margin-top: clamp(20px,2.083vw,40px);}
.location .sec-loc .loc-box .info > ul > li .txt{flex:1;}
.location .sec-loc .loc-box .info > ul > li a{ color: #fff; text-decoration:underline;}
.location .sec-loc .loc-box .info > ul > li .icon{width: clamp(40px,2.969vw,57px); aspect-ratio:1; border-radius:50%; background: #7DE0E9; display:flex; align-items:center; justify-content:center;}



/* error */
.error404{text-align: center;}
.error404 .site-main{height: 90vh; display:flex; padding:0 5%; align-items:center; flex-direction:column; justify-content:center;}
.error404 .page-header{border:0; padding-bottom: 0; margin-bottom: 50px;}
.error404 .page-header h1{font-size: 3vw;}
.error404 .page-content{font-size: 20px;}
.error404 .site-footer .ft-cont{padding-top: 0;}


/*************************************************** board ***************************************************/
/* tab */
.board-tabs{display:flex; gap:clamp(4px,0.625vw,12px); flex-wrap:wrap;}
.board-tabs li.active a{background: #072B31; color: #fff; border-color:#072B31;}
.board-tabs a{padding:0 clamp(12px,1.146vw,22px); height: clamp(36px,2.604vw,50px); line-height: 1.2;display:flex; align-items:center; justify-content:center; font-size: clamp(14px,0.833vw,16px); font-weight: 550; color: #aaa; border:1px solid #ddd; border-radius:60px;}

   

.board-top{display:flex; justify-content:space-between; align-items:flex-start; flex-direction:column; gap:100px;  margin-bottom: 40px;}
.board-top:has(.board-tabs) .total-count{display:none;}


/* total */
.total-count {font-size: 18px; }
.total-count strong{color: #005EB8;}


/* search */
.board-search{ width: 100%; max-width:450px; height: 56px; border:1px solid #ddd; border-radius:60px; position:relative; margin:0 auto;}
.board-search input{border:0; border-radius:60px; width: 100%; height: 100%; padding:0 60px 0 20px;}
.board-search button{border:0;     aspect-ratio: 1; height: 100%; position:absolute; right:0; top:0; background: url('../images/icon-search.svg') no-repeat center center / 24px; font-size: 0;}


/* list */
.video-list,
.gallery-list{display:flex; flex-wrap:wrap; gap:clamp(40px,4.167vw,80px) clamp(20px,2.083vw,40px);}
.video-list > li,
.gallery-list > li{width:calc(33.33% - 26.66px);}
.video-list .thumb,
.gallery-list .thumb{width: 100%;     aspect-ratio: 480 / 320; margin-bottom: clamp(18px,1.667vw,32px); background: url('../images/logo.svg') #f5f5f5 no-repeat center center / 30%;}
.video-list .thumb img,
.gallery-list .thumb img{width: 100%; height: 100%; object-fit:cover;}
.video-list .categories,
.gallery-list .categories{display:flex; gap:10px;}
.video-list .category,
.gallery-list .category{background: #283380; color: #fff; padding:clamp(6px,0.417vw,8px) clamp(10px,0.833vw,16px); border-radius:4px; display:inline-block; font-size: clamp(13px,0.729vw,14px); font-weight: 600;}
.video-list .title,
.gallery-list .title{font-size: clamp(20px,1.146vw,22px); font-weight: 600; margin:clamp(10px,0.833vw,16px) 0;  }
.video-list .date,
.gallery-list .date{color: #656565; font-size: clamp(14px,0.833vw,16px); margin:0;}
.info-list{border-top:2px solid #000;}
.info-list > li{border-bottom:1px solid #ddd; padding: clamp(20px,1.771vw,34px) clamp(10px,2.5vw,48px); }
.info-list > li:only-child{ text-align: center;font-size: clamp(17px,1.042vw,20px); }
.info-list > li > a{ align-items:center;  display:flex; justify-content:space-between;}
.info-list .thumb{display:none;}
.info-list .title{font-size: clamp(17px,1.042vw,20px); margin:0; font-weight: 600; width:calc(100% - 150px); white-space: nowrap;   overflow: hidden;       text-overflow: ellipsis;}
.info-list .date{color: #656565; font-size: clamp(14px,0.833vw,16px); margin:0; width: 150px; text-align: right;}

/* paging */
.board-pagination{margin-top: clamp(40px,4.167vw,80px);}
.board-pagination ul.page-numbers{display:flex; justify-content:center; gap:10px;}
.board-pagination ul > li .page-numbers{width: 36px; height: 36px; display:flex; align-items:center; justify-content:center; border-radius:6px;   }
.board-pagination ul > li .page-numbers.current{ background: #283380; color: #fff;}
.board-pagination .prev,
.board-pagination .next{font-size: 1.8em; color: #888; font-weight: 300;}


/* nav */
.post-nav{position:relative; margin-top: clamp(30px,4.167vw,80px); display:flex; justify-content:space-between; font-size: clamp(14px,0.938vw,18px); height: clamp(40px,3.125vw,60px); align-items:center; }
.post-nav .label{font-weight: 600;}
.post-nav .title{font-weight: 400;   display: block;  white-space: nowrap;  overflow: hidden;   text-overflow: ellipsis; margin:0;}
.post-nav .post-nav-item{ position:relative; width: calc(50% - 100px);display:flex;   gap:40px; height: 100%; align-items:center;}
.post-nav .post-nav-item.prev{padding-left: 28px;}
.post-nav .post-nav-item.prev:before{content:'←'; position:absolute; left:0; font-weight: 600;}
.post-nav .post-nav-item.next{padding-right: 28px; margin-left: auto; justify-content:flex-end;}
.post-nav .post-nav-item.next:before{content:'→'; position:absolute; right:0; font-weight: 600;}

/* btn */
.board-btn{padding:10px 20px; border:1px solid #ddd; display:inline-block; border-radius:60px;}
.board-view .btn-wr,
.board-list .btn-wr{justify-content:center;}
.list-btn{position:absolute; left:50%;  top:50%; transform:translate(-50%,-50%); width: clamp(40px,3.125vw,60px); height: clamp(40px,3.125vw,60px); background: url('../images/icon-menu.svg')  #283380 no-repeat center center / clamp(14px,1.042vw,20px); border-radius:6px; font-size: 0;}

/* view */
.board-article{border-bottom:1px solid #ddd; padding-bottom: clamp(40px,4.167vw,80px); font-size: clamp(16px,0.938vw,18px);}
.board-article .board-title{margin:0 0 30px; font-size: 40px; font-weight: 600; }
.board-article .board-date{margin:0;font-size: clamp(16px,0.938vw,18px); color: #666;}
.board-article .board-head{padding-bottom: clamp(40px,4.167vw,80px); border-bottom:1px solid #ddd; margin-bottom: clamp(40px,4.167vw,80px);}
.board-view:has(.board-overview){padding-top: clamp(70px,4.688vw,90px);}
.board-view:has(.board-overview) .board-article{padding-top: clamp(20px,3.125vw,60px);}
.board-overview .extra-content{background: #283380; color: #fff; padding:clamp(30px,4.688vw,90px) 5%; font-size: clamp(18px,1.667vw,32px); width: 90%; max-width:1720px;  margin-top: clamp(-100px,-5.208vw,-50px);  position:relative; z-index:2;}
.board-overview .extra-content p{margin:0;}
.board-overview .board-visual{position:relative; display:flex; flex-direction:column; justify-content:center;color: #fff; padding:clamp(30px,3.125vw,60px) 5% clamp(80px,5.208vw,100px); min-height: clamp(350px,36.458vw,700px); background: #000;}
.board-overview .board-visual .board-title{font-size: clamp(24px,2.083vw,40px); position:relative; z-index:1; margin-bottom: 30px;    }
.board-overview .board-visual .board-date{margin:0; position:relative; z-index:1; font-size: clamp(16px,0.938vw,18px);}
.board-overview .board-visual .visual-bg{position:absolute; left:0; top:0; width: 100%; height: 100%; background: #000; z-index:0; }
.board-overview .board-visual .visual-bg img{width: 100%; height: 100%; object-fit:cover; opacity:.7;}


/*************************************************** privacy / cookie ***************************************************/

.privacy{font-size: clamp(14px,0.938vw,18px);}
.privacy h1{font-weight: 600; font-size: clamp(24px,2.083vw,40px);}
.privacy h2{margin-top: clamp(30px,2.604vw,50px);     color: #08788b; font-weight: 600; font-size:clamp(20px,1.563vw,30px);}
.privacy h3{margin-top: 30px;  font-weight: 600; font-size: clamp(16px,1.146vw,22px);}
.privacy ul{margin-bottom: 10px;}
.privacy li + li{margin-top: 10px;}
.privacy a{ color: #08788b; text-decoration:underline !important;}
.privacy .box{padding:clamp(10px,1.042vw,20px); border:3px solid #08788b; margin-bottom: .9rem;}
.privacy .cookie-table{margin-top: 2rem; width: 100%;} 
.privacy .select-box{float:right; width: 100%; max-width:200px; }





/*************************************************** lang en ***************************************************/ 

.lang-en h1,
.lang-en h2,
.lang-en h3,
.lang-en h4,
.lang-en h5,
.lang-en h6{ line-height: 1.3;}
.lang-en .site-main:not(.board-list):not(.info-list) .breadcrumb > ul > li:nth-child(2){display:none;}



/*************************************************** responsive ***************************************************/
@media screen and (max-width:1240px){
	/* main */
	.about-swiper .swiper-slide .left{width: 50%;  }
	.about-swiper .swiper-slide .right{width: 50%;}
	.about-swiper .swiper-navigation{left:50%;}
	.about-swiper .swiper-pagination{left:58%; top:4%;}
	
	.esg .sec-news .swiper-button-prev{ left:0;  }
	.esg .sec-news .swiper-button-next{ right:0;  }  

	.main-sustain .sus-list > ul{gap:60px 20px;}
	.main-sustain .sus-list > ul > li{width: calc(50% - 10px); }
	.main-project .project-map{height:600px;}
	.main-project .project-map .map > .dot{  transform: translate(328px, 22px);}
	.main-project .project-map .map-hbd{ transform: translate(-285px, 153px); }

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


	/* header */
	.site-header .hd-cont{height: 70px;}
	.site-header.scr {transform: translateY(-70px);}
	.site-header .hd-gnb{width: 100%; top:0; right:-100%; height:calc(100vh + 70px); position:fixed;  background: #fff; flex-direction:column; gap:0;  transition:all ease .35s; padding: 80px 5% 5%; overflow-y: auto;}
	.site-header .hd-gnb > li{border-bottom:1px solid #E1E7EA;}
	.site-header .hd-gnb > li > a{color: #000;  justify-content:flex-start; font-size: 20px; font-weight: 600; height:auto; padding:20px 0;}
	.site-header .hd-gnb > li:has(ul) > a:after{content:''; width: 30px; height: 30px; display:block; margin-left: auto;background: url(../images/icon-down.svg) no-repeat center center / 20px; transition:all ease .35s;         filter: brightness(0);}
	.site-header .hd-gnb > li > ul{position:relative;   visibility:visible; background: #fff; width: 100%; padding : 0 0 30px;  display:none; transition:opacity ease .6s;}
	.site-header .hd-gnb > li.on > a:after{transform:rotate(180deg);}
	.site-header .hd-gnb > li.on > ul{opacity:1; visibility:visible;}
	.site-header .hd-gnb > li > ul > li > a{color: #666; font-size: 17px; padding:6px 0}
	.site-header.active .hd-gnb{right:0;}
	.site-header .hd-gnb > li > ul > li > a:hover{color: #000;}
	.site-header.active .menubar span:nth-child(1){transform:rotate(45deg) translate(2px, 2px);}
	.site-header.active .menubar span:nth-child(2){display:none;}
	.site-header.active .menubar span:nth-child(3){transform:rotate(-45deg) translate(2px, -2px);}
	.site-header .menubar{display:flex;}
	.site-header .hd-cont .site-inner{gap:20px;}
	.site-header .hd-lang{margin-left: auto; font-size: 14px;}
	.site-header .hd-lang > ul a{font-size: 13px;}
	.site-header .hd-cont .logo{width: 110px; z-index:2;}
	.site-header .top-link .site-inner{height:30px; padding:7px 0 ;}
	.site-header .top-link .site-inner a{display:block; height: 100%;}
	.site-header .top-link .site-inner img{max-height:100%;}
 

}
@media screen and (max-width:969px){
	.main-visual{padding-bottom: 12vh;}


	.main-project .project-spec{ background: rgba(255, 255, 255, 0.5);padding: 20px;border-radius: 10px;width: 75%;backdrop-filter: blur(50px);}
	.main-project .project-map{  height: 700px;}
	.main-project .project-map .map{ background-position: center right 30%;}
	.main-project .project-map .map .dot{width: 14px;}
	.main-project .project-map .map > .dot{ transform: translateX(45px);   top: 54%;  left: 70%;} 
	.main-project .project-map .map-hbd{ transform: translate(0);width: 100px; top: 84%;  left: 20%; padding-top: 12px; padding-left: 10px;} 
	.main-project .project-spec li{width:100%;} 
	.main-sustain .sus-list .icon{width: 70px;}

	.main-about .about-banner .title > img{max-height:30px;}



	.about-swiper .swiper-slide{flex-direction:column;}
	.about-swiper .swiper-slide .left{width: 90%; height: 240px;}
	.about-swiper .swiper-slide .right{width: 100%;padding-top: 100px; padding-bottom: 0;}
	.about-swiper .swiper-pagination{left:8%; top:300px;}
	.about-swiper .swiper-navigation{left:8%; margin-left: 0; top:240px; }

	.windmill-wrap{          background-size: 200% auto; bottom: 0;}


	/* footer */
	.site-footer .ft-cont{ flex-direction:column; gap:20px; }


	/* sub */
	.breadcrumb > ul > li:not(:last-child):not(:first-child){display:none;} 


	
	.sec-overview .site-inner{flex-direction:column; gap:20px;}
	.sec-overview .title h4 br{display:none;}


	.overview .sec-timeline .site-inner{ flex-direction:column; gap:20px; }
	.overview .sec-timeline .title{width: 100%; max-width:100%; padding-right: 0;}
	.overview .sec-timeline .tl-cont{margin-top: 20px; width: 100%; max-width:100%;}
	.sec-project ul{ grid-template-columns:repeat(1,1fr); }
	.sec-tech .tech-box{ flex-direction:column; gap:20px; }
	.sec-tech section .tech-box .img{width: 100%; aspect-ratio:1.5;         max-width: 100%;}
	.sec-tech section .title{width: 90%;}
	.sec-tech .tech-box .cont{width: 100%;}
	.sec-tech .tech-box .cont .icon{max-width:50px;}
	.sec-tech section .tech-box .list li br{display:none;}
	.sec-tech section:before{width: 50px; padding-right: 14px;}

	.region .sec-strength .page-nav{display:none;}
	.region .sec-strength .sections section .site-inner{padding-left: 0;}

	.esg .sec-core .core-list{ flex-direction:column; gap:20px; padding: 30px 30px 50px;  display: inline-flex;align-items: center;}
	.esg .sec-core .core-list > li{width: 100%;}
	.esg .sec-core .core-list > li:not(:last-child) .circle:after{display:none;}
	.esg .sec-core .core-list > li:not(:last-child) .icon:after,
	.esg .sec-core .core-list > li:not(:first-child) .icon:before{display:none;}

	.kofwind .sec-company .site-inner{ flex-direction:column; }
	.kofwind .sec-company .company-list{width: 100%;}
	.kofwind .sec-company .title{width: 100%;}

	.shareholder .sec-value .value-list > li{width: 100%;}

	.sec-feature .cont{ flex-direction:column; }
	.sec-feature .cont .tit{width: 100%;}
	.sec-tech .tech-box .img{width: 100%; aspect-ratio:1.5; max-width: 100%;}
	.sec-tech .tech-box .img + .cont{padding:0;}
	.people .sec-people p{width: 100%;}

	.people .sec-who .title{ flex-direction:column; gap:10px;}
	.people .sec-who .title h2{width: 100%;}
	.people .sec-who .title p{width: 100%;}
 
	.board-top{flex-direction:column; gap:20px; align-items:flex-start;}
	.video-list > li, .gallery-list > li{width: 100%;}

	.partnership .flex-box{flex-direction:column; gap:20px;  }
	.partnership .sec-recruit .step-list{flex-direction:column; gap:20px;  }
	.partnership .sec-recruit .step-list > li{aspect-ratio:1;}

	.location .sec-loc .loc-box{flex-direction:column;  }
	.location .sec-loc .loc-box .map{width: 100%; height: 300px;}
	.location .sec-loc .loc-box .info{width: 100%;}


	.privacy .cookie-table td,
	.privacy .cookie-table th{word-break:break-all;}
	.privacy .select-box{float:none; margin-bottom: 40px;}

 
    .pc { display: none !important; }
    .sec-tech section .title h2 br { display: none; }
  
}