@charset "utf-8";
/*------------------------------------
	sub_Layout
------------------------------------*/
#max_contanier {position:relative;}
#contents {padding:8rem 0; min-height:50rem;}
#cont_wp {position: relative; /*overflow-x: hidden;*/ height: auto;}
#cont_wp .image_box {display: inline-block;  background-position: center; background-repeat: no-repeat; background-size: cover;}
#cont_wp hr {border:0;}
#cont_wp section {position: relative; width: 100%;}
 
section.sect {margin: 10rem 0;}

/* title */
h3.tit {font-size: 4rem; font-weight: 600; color:#222; line-height:1.4; letter-spacing:-0.025em; word-break:keep-all;}
h3.tit.mt {margin-top:8rem;}

@media screen and (max-width: 1600px) { 
	section.sect {margin: 8rem 0;}
	
	/* title */
	h3.tit {font-size: 3.5rem; }
}
@media screen and (max-width: 1024px) {
	#contents {padding:6rem 0;} 
	section.sect {margin: 6rem 0;}

	/* title */
	h3.tit {font-size: 3rem; }
}
@media screen and (max-width: 768px) { 
	#contents {padding:4rem 0;} 
	section.sect {margin: 4rem 0;}

	/* title */
	h3.tit {font-size: 2.2rem; }
}


/*------------------------------------
  회사소개 
-------------------------------------*/   
.story_wp{position:relative; width:100%; height:100vh; }
.story_wp .story_pin{position:relative; height:100vh; overflow:hidden;}
.story_wp .story_item{position:absolute; inset:0;   display:flex; align-items:center; justify-content:space-between;  background:#fff;}
.story_wp .story_item.reverse{flex-direction:row-reverse;}
.story_wp .img_box{width:48%; height:80vh; border-radius:2rem; overflow:hidden;}
.story_wp .img_box img{width:100%;height:100%;object-fit:cover;}
.story_wp .txt_box{width:45%;}
.story_wp .txt_box h2{font-size:6.5rem; line-height:1.15; font-weight: 500; margin-bottom:3rem;}
.story_wp .txt_box h2 span {font-weight: 700; color:#000;}
.story_wp .txt_box p{ word-break:keep-all; line-height:1.6; margin-bottom:4rem; color:#4D4D4D;}
.story_wp .txt_box > * {opacity: 0; filter: blur(10px); transform: translateY(20px); transition: opacity 0.3s ease, filter 0.3s ease, transform 0.3s ease;}
.story_wp .txt_box.on > * {opacity: 1; filter: blur(0); transform: translateY(0);}
.story_wp .txt_box > *:nth-child(1) { transition-delay: 0.1s; }
.story_wp .txt_box > *:nth-child(2) { transition-delay: 0.25s; }
.story_wp .txt_box > *:nth-child(3) { transition-delay: 0.4s; }



.value_wp {width:100%; max-width:182rem; margin:0 auto; background:#F9F3E6; padding:10rem 0; border-radius:2rem; overflow:hidden;}
.value_wp .value_li {display:flex; gap: 5rem; }
.value_wp .value_li li .tit {font-size: 3.2rem; color:var(--main-color1); width: 400; display:block; margin:3rem 0 1rem 0;}
.value_wp .value_li li strong {color:#222; margin: 2rem 0; display:block; font-weight: 600;}
.value_wp .value_li li p {font-size: 1.8rem; line-height:1.5; word-break:keep-all;}

.overview_wp {}
.overview_wp .tit {font-size: 4.5rem; margin:8rem 0 3rem 0; font-weight: 500; letter-spacing:-0.02em;}
.overview_wp .tit span {color:#222; font-weight: 600;}

.overview_wp .img {width:100%;}
.overview_wp .img img {max-width:100%;}
.overview_wp .overview_table {border-top: .1rem solid var(--black);}
.overview_wp .overview_table li {display: flex; align-items: center; min-height: 10.8rem; font-size: 1.8rem; border-bottom: .1rem solid #E8E8E8;}
.overview_wp .overview_table li > div {display: flex; flex: 1; align-items: center;}
.overview_wp .overview_table li > div label {position: relative;  width: 9rem; font-weight: 500; flex-shrink: 0; color:#222; margin-right:3rem;}
.overview_wp .overview_table li > div label:after {content: ''; display: block; position: absolute; top: 50%; right: 0; width: .1rem; height: 1.7rem; transform: translateY(-50%); background: #ddd;}


@media screen and (max-width: 1820px) {
	.value_wp { max-width:100%; padding:8rem 3%;}
}
@media screen and (max-width: 1600px) {      
	.story_wp .txt_box h2{font-size:2.4em; margin-bottom:2.5rem;}
	.story_wp .txt_box p{margin-bottom:3rem; line-height:1.5;}

	.value_wp { padding:6rem 0;}
	.value_wp .value_li li i {width:10rem; display:block;}
	.value_wp .value_li li i img {max-width:100%;}
	.value_wp .value_li li .tit {font-size: 1.4em;  margin:2rem 0 1rem 0;}
	.value_wp .value_li li strong {font-size: 1.2em; margin: 1.5rem 0;}
	.value_wp .value_li li p {font-size: .95em; line-height:1.4}

	.overview_wp {}
	.overview_wp .tit {font-size: 4rem; margin:4rem 0 2rem 0;  }  
	.overview_wp .overview_table li { min-height: 9rem; font-size: 1em;  }   
}
@media screen and (max-width: 1024px) {
	.story_wp .txt_box h2{font-size:2.6em;}
	.story_wp .txt_box p{margin-bottom:2.5rem;}

	.value_wp {padding:5rem 0;}
	.value_wp .value_li {flex-wrap:wrap; gap:3rem;}
	.value_wp .value_li li {width:46%;}
	.value_wp .value_li li i {width:6rem;} 
	.value_wp .value_li li .tit {margin:1rem 0 1rem 0;}
	.value_wp .value_li li strong {font-size: 1em; margin: 1rem 0;}
	.value_wp .value_li li p {font-size: 1em; line-height:1.3}
 
	.overview_wp .tit {font-size: 3rem; margin:3rem 0 2rem 0;  }  
	.overview_wp .overview_table li { min-height: 8rem;}   

}
@media screen and (max-width: 768px) { 
	.story_wp,
	.story_wp .story_pin {height:auto;}
	.story_wp .story_item {position:relative; flex-direction: column; justify-content: center; margin: 0 0 2rem 0;}
	.story_wp .story_item.reverse {flex-direction: column;}
	.story_wp .img_box {width:100%; height:30rem; line-height: 1; font-size: 0; margin-top: 0; border-radius:1rem;}
	.story_wp .txt_box {width:100%; margin: 3rem 0 1rem 0;}
	.story_wp .txt_box h2{font-size:1.7em; margin-bottom:1.8rem;}
	.story_wp .txt_box p{margin-bottom:2rem; font-size: 1em;}
	.story_wp .txt_box p br {display:none; }

	.value_wp {padding:4rem 0;}
	.value_wp .value_li { gap:2rem;} 
	.value_wp .value_li li i {width:5rem;} 
	.value_wp .value_li li .tit {font-size: 1.2em; margin:.5rem 0;}
	.value_wp .value_li li strong {font-size: 1em; margin: .8rem 0; line-height:1;}
	.value_wp .value_li li p {font-size: .9em; line-height:1.3}	

	.overview_wp .tit {font-size: 2.2rem; margin:2rem 0 2rem 0; word-break:keep-all; }  
	.overview_wp .overview_table li { min-height: 8rem; align-items: flex-start; flex-direction: column;  }   
	.overview_wp .overview_table li.two > div {width:100%; border-top:1px solid #E8E8E8; padding:1rem 0;} 
	.overview_wp .overview_table li.two > div:nth-of-type(1) {border-top:0;}
	.overview_wp .overview_table li > div label {width:6rem; margin-right:2rem;}
	.overview_wp .overview_table li > div p {word-break:keep-all; line-height:1.4;}

}


/*------------------------------------
	연혁
-------------------------------------*/   
.history_wp{ display:flex; max-width:160rem; margin:0 auto; gap:12rem; align-items:flex-start; }
 
/* ---------- 왼쪽 고정 패널 ---------- */
.history_wp .left_col{ flex:0 0 68rem; position:sticky; top:12rem; text-align: center; } 
.history_wp .text_block{ opacity:1; }
.history_wp .text_block div {font-size: 4.2rem;}
.history_wp .year{ font-size:8rem; font-weight:600; color:#1B1B1B; line-height:1; }
.history_wp .sub{ margin:1rem 0; font-size:2.2rem; font-weight:600; color:#5D9438; letter-spacing:1px; }
.history_wp .desc{ margin-top:18px; font-size:1.6em; color:#1B1B1B; font-weight: 600; letter-spacing:-0.025em;}
.history_wp .img_box{ margin-top:28px; width:100%; height:40rem; border-radius:2rem; overflow:hidden; background:#eee; }
.history_wp .img_box img{width:100%; height:100%; object-fit:cover; display:block; clip-path: ellipse(300% 300% at 50% 100%); transform: scale(1);}

/* ---------- 오른쪽 타임라인 ---------- */
.history_wp .right_col{ flex:1; position:relative; padding-left:12rem; min-width:0; }
.history_wp .line_bg{ position:absolute; left:0; top:6px; bottom:0; width:3px; background:#DEDEDE; }
.history_wp .line_fill{ position:absolute; left:0; top:6px; width:3px; height:0; background:#003C26; }
.history_wp .line_fill::after{content:'';position:absolute; left:50%;  bottom:-6px;  width:12px;  height:12px;  background:#fff;  border:2px solid #003C26;  border-radius:50%;
  transform:translateX(-50%); box-shadow:0 0 0 6px rgba(180,222,173,.7);}

.history_wp .year_block{ margin-bottom:2rem; }
.history_wp .item{ padding:2.5rem 0; }
.history_wp .item h3{ font-size:3rem; font-weight:600; color:#222; margin-bottom:1.2rem; letter-spacing:-0.025em;}
.history_wp .item p{ font-size:1em; color:#666666; line-height:1.7; }
.history_wp .item  ul li {position:relative; font-size: 1em; color:#666; line-height:1.7; padding-left:1.5rem;}
.history_wp .item  ul li:before {width:.4rem; height:.4rem; content:''; background:var(--main-color2); position:absolute; top:1.4rem; left:0; border-radius:1rem;}


/* ---------- 반응형 ---------- */
@media (max-width:1600px){
	.history_wp{padding:0; gap: 0 10rem;}
	.history_wp .left_col{ flex-basis:auto; width:45%; }
	.history_wp .right_col {padding-left:10rem;}
	.history_wp .img_box{ height:28rem; }
	.history_wp .year{ font-size:4rem; }
}  
@media (max-width:1024px){
	.history_wp  {gap: 0 5rem;} 
	.history_wp .img_box{height:20rem; margin-top:1rem; border-radius:1rem; }
	.history_wp .year{ font-size:30px; }
	.history_wp .sub{ font-size:13px; }
	.history_wp .desc{ font-size:14px; }
	.history_wp .right_col{ padding-left:5rem; }
	.history_wp .item{ padding:18px 0; }
	.history_wp .item h3{ font-size:1.3em;}
	.history_wp .item p{ font-size:1.1em}
} 
@media (max-width:768px){
	.history_wp  {gap: 0; flex-direction: column;}  
	.history_wp .left_col {width:100%; position:static;}
	.history_wp .left_col .text_block {display:none;}
	.history_wp .img_box{width:100%; height:16rem; margin-bottom:3rem; }
	.history_wp .year{ font-size:30px; }
	.history_wp .sub{ font-size:13px; }
	.history_wp .desc{ font-size:14px; }
	.history_wp .right_col{ padding-left:3rem; }
	.history_wp .item{ padding:1.5rem 0; }
	.history_wp .item h3{ font-size:1.3em;}
	.history_wp .item p{ font-size:1.1em}

	.history_wp .line_fill::after {width:.6rem; height:.6rem; box-shadow:0 0 0 4px rgba(180,222,173,.7);}
	
	.history_wp .item ul li {line-height:1.6; word-break:keep-all;}
	.history_wp .item ul li:before {top:1rem;}
	.history_wp .year_block{ margin-bottom:0; }
	
}


/*------------------------------------
	CI BI
-------------------------------------*/    
.feature_box {display: grid; grid-template-columns: repeat(4, 1fr); column-gap: 2rem; align-items: flex-start; margin: 6rem 0 15rem 0; position: relative;}
.feature_box .item {position: relative; width: 100%; border-radius: 2rem; width:100%; height:50rem; background-size: cover; background-repeat: no-repeat; background-position: center center;
 overflow:hidden;}
.feature_box .item:nth-child(1) {background-image: url("/pages/layout/kor/images/sub/about/bg_ci1.png");}
.feature_box .item:nth-child(2) {background-image: url("/pages/layout/kor/images/sub/about/bg_ci2.png");}
.feature_box .item:nth-child(3) {background-image: url("/pages/layout/kor/images/sub/about/bg_ci3.png");}
.feature_box .item:nth-child(4) {background-image: url("/pages/layout/kor/images/sub/about/bg_ci4.png");}

.feature_box.bi .item:nth-child(1) {background-image: url("/pages/layout/kor/images/sub/about/bg_bi1.png");}
.feature_box.bi .item:nth-child(2) {background-image: url("/pages/layout/kor/images/sub/about/bg_bi2.png");}
.feature_box.bi .item:nth-child(3) {background-image: url("/pages/layout/kor/images/sub/about/bg_bi3.png");}
.feature_box.bi .item:nth-child(4) {background-image: url("/pages/layout/kor/images/sub/about/bg_bi4.png");}

.feature_box .item * {color: var(--white);}
.feature_box .item:nth-child(even) {margin-top: 4rem;}
.feature_box .item h5 {font-size: 3rem; font-weight: 600; position: absolute; bottom:0; left:0; padding: 0 0 3.5rem 3.5rem; font-family:'Pretendard'; line-height:1;}
.feature_box .item .text { transition: all 0.8s; width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); visibility: hidden; opacity:0;  padding:3rem; box-sizing:border-box; word-break:keep-all; font-size: .95em; line-height:1.3;}
.feature_box .item .text h5 {position:relative; padding:2rem 0;}
.feature_box .item .text::before {content: ""; display: block; background: rgba(0, 0, 0, 0.6); border-radius: 20px; z-index: -1; width: 100%; height: 100%; position: absolute;
top: 50%; left: 50%; transform: translate(-50%, -50%);}
.feature_box .item .text  p {line-height:1.4;}
.feature_box .item:hover .text {visibility:visible; opacity:1; }
.feature_box .item:hover > h5 {visibility:hidden;}

/* 가로 */
.row_section{ display:flex; align-items:flex-start; gap:14rem; }
.row_section + .row_section{ margin-top:14rem; }
.row_section .section_tit{position:sticky; top:4rem;  flex:0 0 40rem; font-size:4rem; font-weight:600; color:#222; }
.row_section .section_cont{ flex:1; min-width:0; }
.row_section .section_desc{ color:#666; line-height:1.5; word-break:keep-all; }
.logo_box{ margin-top:3rem; width:100%; height:34rem; border:1px solid #eeeeee; border-radius:4px; background-color:#ffffff; 
background:url(/pages/layout/kor/images/sub/about/bg_pat.png)repeat; display:flex; align-items:center; justify-content:center; }
.logo_box img{ max-width:60%; max-height:70%; object-fit:contain; }
.download_wp {margin:3rem auto 0 auto; text-align: center;}
.row_section .section_cont  p {line-height:1.5; word-break:keep-all; letter-spacing:-0.025em; font-size: .95em;}
.row_section .section_cont  p ~ p {margin-top:2rem;}
.row_section .section_cont .img {width:100%; margin-top:3rem;}
.row_section .section_cont .img img {max-width:100%;}

.row_section .desc_list{ list-style:none; }
.row_section .desc_list li{ position:relative; padding-left:14px;  color:#666; line-height:1.6; }
.row_section .desc_list li::before{ content:''; position:absolute; left:0; top:14px; width:4px; height:4px; background-color:#666666; }


/* 그리드 */
.grid_type_wp{ margin-top:3.2rem; display:grid; grid-template-columns:1fr 1fr; gap:4rem 3.2rem; }
.grid_type_tit{ margin-bottom:1.4rem; font-size:2.5rem; font-weight:600; color:#222; }
.grid_type_img{ width:100%; height:22rem; border:1px solid #eeeeee; border-radius:4px; display:flex; align-items:center; justify-content:center; }
.grid_type_img img{ max-width:70%; max-height:80%; object-fit:contain; }


/* 컬러 */
.color_type_wp{width:100%; display:flex; gap:2.8rem;}
.color_type_wp li {width:33%;}
.color_type_wp li .color_type_box {background:#222; border-radius:1rem; padding:3rem; min-height:16rem; box-sizing:border-box; color:#fff; display:flex;flex-direction: column; justify-content: space-between;}
.color_type_wp li .color_type_box.green1 {background:#5D9438;}
.color_type_wp li .color_type_box.green2 {background:#1E5F11;}
.color_type_wp li .color_type_box.green3 {background:#2F2C2C;}
.color_type_wp li .color_type_box.brown {background:#2C1E15;}
.color_type_wp li .color_type_box.beige {background:#FFE1C1;}
.color_type_wp li .color_type_box.beige p {color:#2C1E15;}
.color_type_wp li .color_type_box.blue {background:#87BFFF;}

.color_type_wp li .color_type_box p:nth-of-type(1) {font-size:1.2em; line-height:1; font-weight: 500;} 
.color_type_wp li .color_type_box p:nth-of-type(2) {opacity:.7; font-size: .9em;}


@media screen and (max-width: 1600px) {      
	.feature_box {margin: 4rem 0 12rem 0;}
	.feature_box .item {height:45rem;}
   
	.feature_box .item h5 {font-size: 2.5rem; padding: 3rem; }
	.feature_box .item .text {padding:2.5rem;}
	.feature_box .item .text h5 {padding: 0 0 2rem 0;}


	/* 가로 */
	.row_section{gap:8rem;}
	.row_section + .row_section{ margin-top:10rem; }
	.row_section .section_tit{flex:0 0 30rem; font-size:3.5rem; }
	.logo_box{margin-top:2.5rem; height:30rem; }  
	.row_section .section_cont > p {font-size: 1em;}
	.row_section .section_cont .img {margin-top:2.5rem;}

	.row_section .desc_list li{padding-left:1rem;}

	/* 그리드 */
	.grid_type_wp{margin-top:2.5rem;  gap:3rem 2.5rem; }
	.grid_type_tit{ margin-bottom:1rem; font-size:2.2rem;}
	.grid_type_img{ height:20rem;}
	.grid_type_img img{ max-width:60%; max-height:60%;}

}
@media screen and (max-width: 1024px) {
	.feature_box {grid-template-columns: repeat(2, 1fr); margin: 3rem 0 8rem 0;}
	.feature_box .item {height:30rem; margin:0 0 2rem 0; border-radius:1rem;}
	.feature_box .item:nth-child(even) {margin-top:0;} 
	.feature_box .item h5 {padding:2rem;}
	.feature_box .item .text {padding:2rem; font-size: 1em;}
	.feature_box .item .text::before { border-radius: 1rem; }
	.feature_box .item .text h5 {padding: 0 0 1.5rem 0; font-size: 1.4em;}
	.feature_box .item .text  p {font-size: .9em;}

	/* 가로 */
	.row_section{gap:6rem;}
	.row_section + .row_section{ margin-top:6rem; }
	.row_section .section_tit{flex:0 0 20rem; font-size:3rem; }
	.logo_box{margin-top:2rem; height:25rem; }  
	.row_section .section_cont .img {margin-top:2rem;}

	/* 그리드 */
	.grid_type_wp{margin-top:2rem;  gap:2.5rem 2rem; }
	.grid_type_tit{font-size:2rem;}
	.grid_type_img{ height:18rem;} 
	


}
@media screen and (max-width: 768px) {       
	.cibi_wp .tit.mgt30 {margin-top:0;}
	.cibi_wp .tit {font-size: 1.25em;}

	.feature_box  {grid-template-columns: repeat(1, 1fr); margin: 2rem 0 4rem 0;}
	.feature_box .item {height:17rem; }
	.feature_box .item > h5 {display:none;}
	.feature_box .item .text {padding:1.8rem; visibility:visible; opacity:1; font-size: 1.1em;}
	.feature_box .item .text h5 {font-size: 1.2em;}
	
	/* 가로 */
	.row_section{gap:0; flex-direction: column;} 
	.row_section + .row_section{ margin-top:5rem; }
	.row_section .section_tit{position:relative; top:auto; flex: 1; font-size:2.5rem; margin-bottom:2rem;}
	.logo_box{margin-top:2rem; height:25rem; }  
	.row_section .section_cont {width:100%;}
	.row_section .section_cont p {font-size: 1em;}
	.row_section .section_cont p ~ p {margin-top:1rem;}
	.row_section .section_cont .img {margin-top:2rem;}

	.row_section .desc_list li {font-size: 1em;}
	.row_section .desc_list li::before {top:1rem; width:.3rem; height:.3rem;}

	/* 그리드 */
	.grid_type_wp{margin-top:2rem;  gap:2.5rem 2rem; }
	.grid_type_tit{font-size:1.25em;}
	.grid_type_img{ height:18rem;} 

	/* 컬러 */
	.color_type_wp{gap:1.5rem; flex-direction: column; gap: 1rem 0;} 
	.color_type_wp li {width:100%;}
	.color_type_wp li .color_type_box {width:100%; padding:2rem; min-height:10rem; border-radius:1rem;} 
	.color_type_wp li .color_type_box p:nth-of-type(2) {opacity:.7; font-size: 1em;}
}


/*------------------------------------
  CEO 인사말
-------------------------------------*/  
.greeting_wp {background:url(/pages/layout/kor/images/sub/about/bg_ceo.png)no-repeat 50% bottom;}
.greeting_wp .inner {display:flex; gap:10rem; flex-direction: row-reverse;} 
.greeting_wp .inner .img {width:45rem; height:55rem; border-radius:3rem 8rem 3rem 3rem; overflow:hidden; flex-shrink:0;}
.greeting_wp .inner .img img {width:100%; height:100%; object-fit:cover;}
.greeting_wp .inner .txt_box .tit  {display:block; font-size: 5rem; color:#222; margin:0 0 4rem 0; padding: 0 0 4rem 0; border-bottom:1px solid #dfdfdf; font-weight: 600;}
.greeting_wp .inner .txt_box .tit span {color:var(--main-color2);} 
.greeting_wp .inner .txt_box p {line-height:1.6; color:#4D4D4D; margin-bottom:3.5rem; word-break:keep-all; font-size: 1em;}
.greeting_wp .inner .txt_box p span.bold {font-weight: 600; color: #222;}

.greeting_wp .inner .txt_box .sign {color:#949494; display:flex; gap:2rem; justify-content: flex-end; align-items: center; margin:5rem 0 0 0;}
.greeting_wp .inner .txt_box .sign img {max-width:12rem;}


@media screen and (max-width: 1600px) { 
	.greeting_wp .inner {gap:8rem;} 
	.greeting_wp .inner .img {width:40rem; height:50rem; border-radius:2rem 6rem 2rem 2rem;}
	.greeting_wp .inner .txt_box .tit  {font-size: 4rem; margin:0 0 3rem 0; padding: 0 0 3rem 0; }
	.greeting_wp .inner .txt_box p {margin-bottom:3rem;}

	.greeting_wp .inner .txt_box .sign {margin:6rem 0 0 0;}
	.greeting_wp .inner .txt_box .sign img {max-width:10rem;}
}
@media screen and (max-width: 1024px) {
	.greeting_wp .inner {gap:6rem;} 
	.greeting_wp .inner .img {width:30rem; height:40rem; border-radius:2rem 4rem 2rem 2rem;}
	.greeting_wp .inner .txt_box .tit  {font-size: 3rem; margin:0 0 2rem 0; padding: 0 0 2rem 0; }
	.greeting_wp .inner .txt_box p {margin-bottom:2rem;}

	.greeting_wp .inner .txt_box .sign {margin:4rem 0 0 0;}
	.greeting_wp .inner .txt_box .sign img {max-width:8rem;}
}
@media screen and (max-width: 768px) { 
	.greeting_wp .inner {flex-direction: column; align-items: center; gap:4rem;} 
	.greeting_wp .inner .img {width:25rem; height:35rem; border-radius:2rem;}
	.greeting_wp .inner .txt_box .tit  {font-size: 2.5rem; margin:0 0 1.5rem 0; padding: 0 0 1.5rem 0; } 

	.greeting_wp .inner .txt_box .sign {margin:2.5rem 0 0 0;}
	.greeting_wp .inner .txt_box .sign img {max-width:6rem;}
}

/*------------------------------------
	Vision
-------------------------------------*/   
.vision_wp .inner { }
.vision_wp .item_box {display:flex; gap:10rem; align-items: center; justify-content: space-between; margin: 15rem 0;}
.vision_wp .item_box:nth-child(even) {flex-direction: row-reverse;}
.vision_wp .item_box .img {width:50%; flex-shrink:0;}
.vision_wp .item_box .img img {max-width:100%;}
.vision_wp .item_box .txtbox {}
.vision_wp .item_box .txtbox h3 {font-size: 2.4em; color:var(--main-color1); font-weight: 600;}
.vision_wp .item_box .txtbox .stit {font-size: 1.4em; font-weight: 600; margin:2rem 0 3rem 0; color:var(--main-color1);}
.vision_wp .item_box .txtbox p {line-height:1.6; word-break:keep-all; font-size: 1.1em;}

@media screen and (max-width: 1600px) {  
	.vision_wp .item_box {gap:8rem; margin: 12rem 0;} 
	.vision_wp .item_box .txtbox h3 {font-size: 2em;}
	.vision_wp .item_box .txtbox .stit {font-size: 1.2em; margin:1.5rem 0 2.5rem 0;}
}
@media screen and (max-width: 1024px) {
	.vision_wp .item_box {gap:5rem; margin: 8rem 0;} 
	.vision_wp .item_box .txtbox h3 {font-size: 2em;}
	.vision_wp .item_box .txtbox .stit {font-size: 1.1em;}
}
@media screen and (max-width: 768px) { 
	.vision_wp .item_box {flex-direction: column; gap:2rem; margin: 0 0 6rem 0;} 
	.vision_wp .item_box:nth-child(even) {flex-direction: column;}
	.vision_wp .item_box .img {width:100%;}
	.vision_wp .item_box .txtbox {width:100%;}
	.vision_wp .item_box .txtbox h3 {font-size: 1.8em;}
	.vision_wp .item_box .txtbox .stit {margin:1rem 0;}
	.vision_wp .item_box .txtbox p {font-size: 1em;}
}



/*------------------------------------
  조직도
-------------------------------------*/  
:root{ --line: #d9d9d9; --dark_green: #0b3d2e; --navy: #14395e; --gray_bg: #eeeeee; --gray_bd: #cccccc; --gray_bd2: #E6E6E6; --green: #6fbf3e; --orange: #f39c2c; --text: #222222; }
.chart { position: relative; width: 100%; max-width: 160rem; background: #f3f5f3; padding: 10rem 0; font-family: Arial, sans-serif; }

.chart .ceo_wrap { display: flex; justify-content: center; }
.chart .ceo {width: 20rem; height: 20rem; border-radius: 50%; background: var(--dark_green); color: #fff; display: flex; align-items: center; justify-content: center;    font-weight: 700; font-size: 3rem; position: relative;}
.chart .ceo::before {content: ""; position: absolute; top: -10px; left: -10px; right: -10px; bottom: -10px; border-radius: 50%; border: 2px dotted #cccccc; transform: scale(1.1);}
.chart .l_ceo { width: 2px; height: 8rem; background: var(--line); margin: 0 auto; }
.chart .dir_row { position: relative; display: flex; justify-content: center; }
.chart .dir_box { width: 28rem; padding: 2.2rem 1rem; text-align: center; border: 2px solid var(--main-color1); border-radius: .5rem 2rem .5rem .5rem; font-weight: 700;    font-size: 1em; color: var(--main-color1); background: #fff; position: relative; z-index: 1;}
.chart .l_div { width: 2px; height: 8rem; background: var(--line); margin: 0 auto; }
.chart .div_conn.multi { position: relative; width: 90%; max-width: 140rem; height: 5rem; margin: 0 auto; }
.chart .div_conn.multi .h_line { position: absolute; top: 0; left: calc(100% / 12); width: 83.8%; right: calc(100% / 12); height: 2px; background: var(--line); }
.chart .div_conn.multi .drop { position: absolute; top: 0; width: 2px; height: 5rem; background: var(--line); }
.chart .div_conn.multi .drop.d1 { left: calc(100% / 12); }
.chart .div_conn.multi .drop.d2 { left: calc(302% / 12); }
.chart .div_conn.multi .drop.d3 { left: calc(503% / 12); }
.chart .div_conn.multi .drop.d4 { left: calc(704% / 12); }
.chart .div_conn.multi .drop.d5 { left: calc(905% / 12); }
.chart .div_conn.multi .drop.d6 { left: calc(1106% / 12); }
.chart .div_row.multi { display: grid; grid-template-columns: repeat(6, 1fr); width: 90%; max-width: 140rem; margin: 0 auto; gap: 1rem; justify-items: center; }
.chart .div_col {position: relative; width: 100%; max-width: 22rem; display: flex; flex-direction: column; align-items: center; }
.chart .div_box { width: 92%; height: 6.5rem; padding: 0 1rem; text-align: center; color: #fff; font-weight: 500; font-size: 1em; border-radius: 4px; display: flex; align-items: center; justify-content: center; }
.chart .div_box:before {content: ""; position: absolute; left: 50%; top: -3px; width: 6px; height: 6px; border-radius: 50%; background: #fff; border: 1px solid var(--line);}
.chart .div_box.green { background: var(--green); }
.chart .div_box.orange { background: var(--orange); }
.chart .l_team { width: 2px; height: 3rem; background: var(--line); margin-left: 10px;}
.chart .team_row_new { display: flex; flex-direction: column; width: 100%; gap: 1.2rem; position: relative; }
.chart .team_row_new::before { content: ""; position: absolute; top: 0; left: 52%; width: 2px; height: 100%; background: var(--line); z-index: 0; }
.chart .team_box_sub { width: 100%; height: 5.5rem; display: flex; align-items: center; justify-content: center; background: #fff; border: 1px solid var(--gray_bd); border-radius: 4px; font-size: 0.9em; color: #333; font-weight: 500; position: relative; z-index: 1; }
.chart .team_box_sub.gray { background:var(--gray_bd2); color: #000;}

/* ==========================================================
   반응형 스타일 - 1600px 이하
   ========================================================== */
@media (max-width: 1600px){
    .chart { padding: 8rem 0; }
    .chart .div_conn.multi, .chart .div_row.multi { width: 95%; max-width: 140rem; }
    .chart .div_box { font-size: 0.95em; }
    .chart .team_box_sub { font-size: 0.9em; height: 5rem; }
}

/* ==========================================================
   반응형 스타일 - 1024px 이하 (3컬럼 2줄로 배치)
   ========================================================== */
@media (max-width: 1024px){
    .chart { padding: 6rem 0; }
    .chart .ceo { width: 16rem; height: 16rem; font-size: 2.2rem; }
    .chart .l_ceo { height: 6rem; }
    .chart .dir_box { width: 100%; max-width: 32rem; padding: 1.6rem; }
	.chart .div_box:before {display: none;}
    .chart .div_conn.multi { display: none; }
    .chart .div_row.multi { grid-template-columns: repeat(3, 1fr); grid-row-gap: 4rem; width: 95%; padding: 0 2rem; }
    .chart .div_col { max-width: none; }
    .chart .l_div, .chart .div_row.multi::before { height: 6rem; }
}

/* ==========================================================
   반응형 스타일 - 768px 이하 (모바일 세로 전체 스택)
   ========================================================== */
@media (max-width: 768px){
    .chart { padding: 5rem 0; }
    .chart .ceo { width: 14rem; height: 14rem; font-size: 2rem; }
    .chart .l_ceo { height: 4rem; }
    .chart .dir_box { width: 90%; max-width: 30rem; padding: 1.5rem 1rem; }
    .chart .div_row.multi { display: flex; flex-direction: column; align-items: center; gap: 2.5rem; width: 100%; padding: 0;}
    .chart .div_col { width: 90%; max-width: 30rem; position: relative; z-index: 1; }
    .chart .div_box { width: 90%; max-width: 30rem; font-size: 1.05em; height: 6rem; }
    .chart .l_team { height: 3rem; }
	.chart .team_row_new { align-items: center; }
    .chart .team_box_sub { font-size: 1.05em; height: 5rem; max-width: 26rem; }
}


/*------------------------------------
  오시는 길
-------------------------------------*/  
.location_wp { }
.location_wp .add {display:flex; align-items: center;  justify-content: space-between; padding:0 0 3rem 0}
.location_wp .add p {font-size: 1.3em; color:#222; display: flex; align-items: center; gap:2rem;}

.location_wp .map {width:100%; height:60rem; background:#D5D5D5; border-radius:2rem; overflow:hidden;}
.location_wp .map .root_daum_roughmap {width:100% !important;}
.location_wp .map .root_daum_roughmap .wrap_map { height:60rem !important;}
.location_wp .map .section_address,
.location_wp .map .wrap_controllers  {display:none;}
.root_daum_roughmap_landing .border1,
.root_daum_roughmap_landing .border2, 
.root_daum_roughmap_landing .border3, 
.root_daum_roughmap_landing .border4 {display:none;}

.location_wp .info {width:100%; gap:0 7rem; display:flex; padding:2rem 0;}
.location_wp .info dl {margin:0; padding:0; width:100%;}
.location_wp .info dl dt {border-bottom:2px solid #222; padding:1.5rem 0; color:#5E5E5E; font-weight: 500;}
.location_wp .info dl dd {margin:0; font-weight: 600; color:#222; margin:1rem 0; font-size: 1.25em; font-family:'Prentendard'; letter-spacing:0;}


@media screen and (max-width: 1600px) {     
	.location_wp { }
	.location_wp .add {padding: 1rem 0 2rem 0}
	.location_wp .add p {font-size: 1.2em; gap:2rem;}

	.location_wp .map {height:45rem;} 
	.location_wp .map .root_daum_roughmap .wrap_map { height:45rem !important;}

	.location_wp .info {gap:0 5rem; padding:1.5rem 0;}
	.location_wp .info dl dt {padding:1.2rem 0;}
	.location_wp .info dl dd {margin:.5rem 0; font-size: 1.1em;}

}
@media screen and (max-width: 1024px) {     
	.location_wp { }
	.location_wp .add {flex-direction: column; gap:1.5rem;}
	.location_wp .add p {font-size: 1em; gap:1rem;}
	.location_wp .add p i {display:inline-block; width:1.5rem;}
	.location_wp .add p i img {max-width:100%;}

	.location_wp .map {height:35rem;} 
	.location_wp .map .root_daum_roughmap .wrap_map { height:35rem !important;}

	.location_wp .info {gap:0 4rem; padding:1rem 0;}
	.location_wp .info dl dt {padding:1rem 0;}
	.location_wp .info dl dd {margin:.4rem 0; font-size: 1em;}
}
@media screen and (max-width: 768px) {     
	.location_wp .map {height:20rem; border-radius:1rem; } 
	.location_wp .map .root_daum_roughmap .wrap_map { height:20rem !important;}
	.location_wp .info {flex-direction: column;}
}


 
/*------------------------------------
	Brand
-------------------------------------*/   
#scroll_driver {position: relative; }
#scroll_driver .stage {position: relative; height: 100vh; width: 100%; overflow: hidden; background: #ffffff; }
#stage{position:relative; overflow:hidden;}
#stage .cursor_glow{position:absolute; top:0; left:0; width:50rem; height:50rem; margin:-30rem 0 0 -30rem; border-radius:50%; pointer-events:none; z-index:-1; background:radial-gradient(circle, rgba(126,200,227,.35) 0%, rgba(126,200,227,.15) 45%, rgba(126,200,227,0) 75%); filter:blur(40px); opacity:0;}

#scroll_driver .stage_row { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); height: 100vh; width: 100%; display: flex; align-items: center; justify-content: center; }
#scroll_driver .logo_block { position: absolute; left: 50%; top: 50%; width: 21rem; text-align: center; } 

#scroll_driver .media_box { position: absolute; left: 50%; top: 50%; width: 0px; height: 550px; border-radius: 24px; overflow: hidden; z-index:1; transform:translate3d(-50%,-50%,0);
	backface-visibility:hidden;
	will-change:transform;}
#scroll_driver .media_box img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; }
#scroll_driver .media_box video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; }

#scroll_driver .text_block { position: absolute; left: 50%; top: 50%; width: auto; text-align: center; }
#scroll_driver .text_block .line1 { font-size: 1.5em; color: #8a8a8a; margin-bottom: 4px; }
#scroll_driver .text_block .line2 { font-size: 2.5em; font-weight: 800; letter-spacing: .01em; color: #1a1a1a; }

#scroll_driver .overlay { position: absolute; inset: 0; background: #000000; opacity: 0; pointer-events: none; }

#scroll_driver .reveal { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(90vw, 760px); text-align: center; color: #ffffff; z-index: 2; }
#scroll_driver .reveal .icon { width: 8rem; height: 8rem; margin: 0 auto 22px; opacity: 0; }
#scroll_driver .reveal .headline { font-size: clamp(30px, 5vw, 60px); font-weight: 600; line-height: 1.2; opacity: 0; margin-bottom: 4rem; letter-spacing:-0.025em; }
#scroll_driver .reveal .copy { position: relative; height: 110px; }
#scroll_driver .reveal .copy p {position: absolute; inset: 0; font-size: clamp(18px, 1.6vw, 25px); line-height: 1.5; color: rgba(255, 255, 255, .85); opacity: 0; word-break: keep-all; letter-spacing:-0.025em;}

@media screen and (max-width: 1600px) {
	#scroll_driver .text_block .line1 { font-size: 1.2em; }
	#scroll_driver .text_block .line2 { font-size: 2.2em;}

	#scroll_driver .reveal {width: min(90vw, 76rem); text-align: center; color: #ffffff; z-index: 2; }
	#scroll_driver .reveal .icon {width: 6rem; height: 6rem; margin: 0 auto 1.5rem; opacity: 0; }
	#scroll_driver .reveal .headline {font-size: clamp(2.5rem, 5vw, 5rem); }
	#scroll_driver .reveal .copy {height: 11rem; }
	#scroll_driver .reveal .copy p {font-size: clamp(1.8rem, 1.6vw, 2.2rem);}

}
@media (max-width: 1024px) { 
	#scroll_driver  .logo_block {width: 13rem; } 
	#scroll_driver  .logo_block img {max-width:100%;} 
	#scroll_driver  .text_block { width: 15rem; } 
	#scroll_driver  .text_block .line1 { font-size: 1.1em; } 
	#scroll_driver  .text_block .line2 { font-size: 1.6em } 
	#scroll_driver .reveal .headline {font-size: clamp(2.2rem, 4vw, 4rem); } 
}
@media screen and (max-width: 768px) {  
	#scroll_driver  .text_block { width: 80%; } 
	#scroll_driver  .text_block .line1 { font-size: 1.3em; } 
	#scroll_driver  .text_block .line2 { font-size: 1.8em } 
	
	#scroll_driver .reveal {top:45%;}
	#scroll_driver .reveal .headline {margin-bottom: 2rem;}
	#scroll_driver .reveal .copy {height: auto; max-width: 80%; word-break: keep-all; margin: 0 auto; }
	#scroll_driver .reveal .copy p {font-size: clamp(1.6rem, 1.6vw, 2rem);}
	#scroll_driver .reveal .copy p br {display:none; word-break:keep-all;}
}


/* brand value */
.brand_value_wp {padding:15rem 0;}
.brand_value_wp .top_tit {text-align:center;}
.brand_value_wp .stit {font-size: .9em; color:var(--main-color2); margin:0 0 1rem 0;} 

.feature_wp { display: flex; align-items: flex-start; justify-content: center; gap: 6rem; max-width: 140rem; margin: 0 auto; padding: 5rem 0; flex-wrap: wrap; }
.feature_item { flex: 1 1 22rem; max-width: 30rem; display: flex; flex-direction: column; align-items: center; text-align: center; }
.feature_item.feature_offset { margin-top: 9rem; }
.feature_circle { position: relative; width: var(--circle_size, 26rem); height: var(--circle_size, 26rem); padding: 14px; --ring_radius: calc(var(--circle_size, 28.6rem) / 2); }
.feature_circle::before { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 1.5px dashed #d9d9d9; z-index: 0; }
.feature_circle img { position: relative; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; z-index: 1; }
.dot_anchor { position: absolute; top: 50%; left: 50%; width: 0; height: 0; z-index: 2; }
.dot_anchor.dot_top { transform: rotate(-40deg); }
.dot_anchor.dot_bottom { transform: rotate(140deg); }
.dot_spin { position: absolute; top: 0; left: 0; width: 0; height: 0; animation: dot_orbit 8s linear infinite; }
.feature_dot { position: absolute; top: 0; left: 0; width: .8rem; height: .8rem; margin: -4px 0 0 -4px; border-radius: 50%; background: #1a3a2a; transform: translate(var(--ring_radius), 0); }
.feature_title { font-size: 1.3em; font-weight: 600; color: #222; margin-top: 3.2rem; margin-bottom: 1.4rem; }
.feature_desc { font-size: .9em; line-height: 1.4; color: #6b6b6b; word-break: keep-all; }

@keyframes dot_orbit { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

@media (max-width: 1600px) {
	.brand_value_wp {padding:10rem 0;} 
	.brand_value_wp .stit {font-size:1em;} 

	.feature_wp {gap: 0; max-width: 100%; margin: 0 auto; padding: 2rem 0; justify-content: space-around;}
	.feature_item {flex: 1 1 22rem; max-width: 25rem;}
	.feature_item.feature_offset {margin-top: 8rem; }
	.feature_circle {width: var(--circle_size, 20rem); height: var(--circle_size, 20rem); padding: 1rem; --ring_radius: calc(var(--circle_size, 22rem) / 2); }    
	.feature_dot {  width: .6rem; height: .6rem; margin: -4px 0 0 -4px; }
	.feature_title { font-size: 1.2em; margin-top: 2.5rem; margin-bottom: 1rem; }
	.feature_desc { font-size: 1em;} 
	
}
@media (max-width: 1024px) { 
	.brand_value_wp {padding:8rem 0;}  
	.feature_wp {padding: 3rem 0 0 0;}
	.feature_item {flex: 50%; max-width: 50%; margin:1rem 0;}
	.feature_item.feature_offset {margin:1rem 0rem; }  
}

@media (max-width: 768px) { 
	.brand_value_wp {padding:4rem 5%; word-break:keep-all; box-sizing:border-box;}  
	.feature_wp {padding: 2rem 0 0 0;} 
	.feature_circle {width: var(--circle_size, 13rem); height: var(--circle_size, 13rem); padding: 1rem; --ring_radius: calc(var(--circle_size, 15rem) / 2); }    
	.feature_title {margin-top: 1.2rem;}
}


/* 공정 */
.process_wp { max-width: 1200px; margin: 0 auto; padding: 8rem 4rem; }
.process_row { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.4rem; margin-bottom: 5.6rem; }
.process_row::before { content: ""; position: absolute; top: 1.7rem; left: calc(100% / 8); right: calc(100% - (2 * var(--item_count) - 1) * 100% / 8); height: 1px; background: #e5e5e5; z-index: 0; }

.process_item { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; z-index: 1; }
.process_badge { width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #ffffff; font-size: 1.3rem; font-weight: 700; margin: 0 auto 2rem; }
.process_badge.badge_1 { background: #bfbfbf; }
.process_badge.badge_2 { background: #8fd39e; }
.process_badge.badge_3 { background: #5fbf7a; }
.process_badge.badge_4 { background: #3da868; }
.process_badge.badge_5 { background: #2e9457; }
.process_badge.badge_6 { background: #227a45; }
.process_badge.badge_7 { background: #1a5c33; }
.process_badge.badge_8 { background: #08431E; }
.process_badge.badge_9 { background: #033416; }
.process_badge.badge_10 { background: #002A10; }
.process_image { width: 100%; aspect-ratio: 1 / 1; border-radius: 1.2rem; overflow: hidden; margin-bottom: 1.6rem; }
.process_image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.process_caption { font-size: .95em; font-weight: 500; color: #333333; word-break: keep-all; }
 
.row_section .promise_li {border-top:1px solid #193D35}
.row_section .promise_li li {display:flex; align-items: center; border-bottom:1px solid #e5e5e5; height:auto; padding:2rem 0; gap:4rem; min-height:16rem;}
.row_section .promise_li li i {width:15rem; height:10rem; flex-shrink:0; display:block; background-position: 50% 50%; background-size:10rem; background-repeat:no-repeat; }
.row_section .promise_li li i.ico1 {background-image:url(/pages/layout/kor/images/sub/brand/ico_promise1.svg);}
.row_section .promise_li li i.ico2 {background-image:url(/pages/layout/kor/images/sub/brand/ico_promise2.svg);}
.row_section .promise_li li i.ico3 {background-image:url(/pages/layout/kor/images/sub/brand/ico_promise3.svg);}
.row_section .promise_li li i.ico4 {background-image:url(/pages/layout/kor/images/sub/brand/ico_promise4.svg);}
.row_section .promise_li li i.ico5 {background-image:url(/pages/layout/kor/images/sub/brand/ico_promise5.svg);}
.row_section .promise_li li strong  {display:block; color:#222; font-size: 1.2em; margin:0 0 2rem 0; font-weight: 600; word-break:keep-all;}
.row_section .promise_li li p { line-height:1.4; word-break:keep-all; font-size: .95em;}


@media (max-width: 1600px) {
	.process_wp {padding: 6rem 0; }
	.process_row {gap: 2rem; margin-bottom: 4.5rem } 
 
	.process_badge {width: 3.5rem; height: 3.5rem; font-size: .9em; font-weight: 500; margin: 0 auto 1.5rem; }
	.process_image {border-radius: 1.2rem; margin-bottom: 1.5rem;} 
	.process_caption { font-size: 1em;}
	  
	.row_section .promise_li li {padding:1.5rem 0; gap:2rem; min-height:14rem;}
	.row_section .promise_li li i {width:12rem; height:10rem;} 
	.row_section .promise_li li strong  {margin:0 0 1.2rem 0;}
	.row_section .promise_li li p {font-size: .9em ; line-height:1.3 ;}
	.row_section .promise_li li p br {display:none;}
}
@media (max-width: 1024px) { 
	.process_wp {padding: 4rem 0; }
	.process_row {gap: 1rem; margin-bottom: 3rem } 
 
	.process_badge {width: 3rem; height: 3rem;  }

	.row_section .promise_li li {padding:1rem 0; gap:1rem; min-height:14rem;}
	.row_section .promise_li li i {width:12rem; height:10rem;}
	.row_section .promise_li li strong  {font-size: 1.1em;}
	.row_section .promise_li li p {font-size: 1em;}
} 
@media (max-width: 768px) { 
	.process_wp {padding:0; }
	.process_row {grid-template-columns: repeat(2, 1fr); margin: 0;}
	.process_row::before {display:none;}
	.process_item {margin: 2rem 0 0 0;}
	.row_section .section_tit br{display:none;}
	.row_section .promise_li li {flex-direction: column;}
	.row_section .promise_li li i {width:6rem; height:6rem; background-size:contain;}
	.row_section .promise_li li strong  {font-size: 1.2em;}
	.row_section .promise_li li p { line-height:1.4;}
}