@import url('sub.css'); 



/**** S:: 회사소개 > 인사말 ****/
.greeting_cont {display:flex; flex-wrap:wrap; gap:0 90px; align-items:center; position:relative; z-index:10;}
.greeting_cont .img_area {max-width:645px; width:44%; border-radius:20px 20px 80px 20px; overflow:hidden;}
.greeting_cont .img_area img {display: block; width: 100%; height: 100%; object-fit: cover;}
.greeting_cont .txt_area {flex:1; }
.greeting_cont .txt_area::after {content:''; width:257px; background:url("/about/img/greeting_ci.png")no-repeat center / 100%; aspect-ratio: 257 / 257; position:absolute; top:0; right:0; z-index:-1; filter:grayscale(1);}
.greeting_cont .txt_area .fs45 {color: var(--black);}
.greeting_cont .txt_area .stxt {letter-spacing: -1.44px; margin:24px 0 0;}
.greeting_cont .txt_area .fs20 {font-size:1.11rem; font-weight: 500; color: var(--black);}
.greeting_cont .txt_area .ceo {color: var(--black); font-size: 1.333rem; font-weight: 700; line-height:141.667%; letter-spacing: -1.92px; margin:50px 0 0;}
/**** E:: 회사소개 > 인사말 ****/


/**** S:: 회사소개 > 추진위 역할 ****/
.role_cont {}
.role_cont .tBox .fs45 {margin:0 0 15px;}
.role_bg {height:500px; border-radius:var(--borderR20); background:url("/about/img/role_bg.jpg")no-repeat center / cover; margin:50px 0;}
.role_list {display: grid; grid-template-columns: repeat(2, 1fr); grid-gap:30px;}
.role_list dl {padding:40px; box-sizing:border-box; border-radius: var(--borderR20); border: 1px solid var(--border); display:flex; align-items:flex-start; gap:0 40px;}
.role_list dl dt {width:100px; aspect-ratio: 3 / 3; flex-shrink: 0; border-radius: var(--borderR10); background: var(--grayBg); display:flex; flex-wrap:wrap; align-items:center; justify-content:center; }
.role_list dl dd {flex:1;}
.role_list dl dd .fs24 {font-weight: 700;}
.role_list dl dd .stxt {letter-spacing: -1.44px; margin:10px 0 0;}
/**** E:: 회사소개 > 추진위 역할 ****/




.table_style {width:100%; border-collapse:separate; border-spacing:0; border-top:2px solid var(--main_dark); text-align:center;}
.table_style th {font-size:1rem; font-weight: 500; line-height:162.5%; letter-spacing: -1.44px; color:var(--black); box-sizing:border-box; padding:16px 10px ; border-bottom:1px solid var(--border); border-right:1px solid var(--border);  background: rgba(241, 243, 247, 0.50);}
.table_style th:last-of-type {border-right:0;}
.table_style td {font-size:1rem; line-height:177.778%; letter-spacing: -0.9px;  font-weight:400; color:var(--basic); box-sizing:border-box; padding:15px 20px; border-bottom:1px solid var(--border); border-right:1px solid var(--border); }
.table_style td:last-of-type {border-right:0;}
.table_style td .dots {text-align:left;}
.table_style td.tit {font-weight: 500; color:var(--black);}
.contact_tel {padding:20px; border-radius: 10px; background: var(--grayBg); box-sizing:border-box; display:flex; flex-wrap:wrap; justify-content:center; gap:5px 20px; margin:30px 0 0; color: var(--black); font-size: 1.111rem; font-weight: 500; line-height:170%; letter-spacing: -1.4px;}
.contact_tel b {display:inline-flex; align-items:center; gap:1px; color:var(--main_dark); font-family:var(--eng);}
.contact_tel b::before {content:'\e0b0'; font-size:21px; display:block; font-family:var(--icon); font-weight:400;}



.organ_wrap {border-radius: 20px; background: var(--grayBg); box-sizing:border-box; padding:100px 40px; margin:0 0 50px;}
.organ_wrap .organ_wrap_in {max-width:850px; margin:0 auto; position:relative; z-index:10;}
.organ_wrap .organ_wrap_in::after {content:''; width:1px; height:100%; background:rgba(21,31,56,0.35); position:absolute; top:0; left:50%; z-index:-1;}
.organ_wrap .organ_wrap_in .ceo {width: 175px; aspect-ratio: 3 / 3; border-radius:100%; display:flex; flex-wrap:wrap; justify-content:center; align-items:center; background: var(--main_dark); color: var(--white); font-size: 1.333rem; font-weight: 500; line-height:141.667%; letter-spacing: -1.2px; text-align:center; margin:0 auto;}
.organ_wrap .organ_wrap_in dl {position:relative; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center;}
.organ_wrap .organ_wrap_in dl dd {display:flex; flex-wrap:wrap; justify-content:center; align-items:center; max-width: 250px; height: 75px; width:100%; border-radius: 40px; background: var(--sub);  color: var(--white); text-align: center; font-size: 1.111rem; font-weight: 500; line-height: 170%; letter-spacing: -1.4px;}
.organ_wrap .organ_wrap_in dl dd.none {opacity:0;}

.organ_wrap .organ_wrap_in dl.one-dep {justify-content:center; margin:20px 0 10px;}
.organ_wrap .organ_wrap_in dl.two-dep::after {content:''; width:50%; height:1px; border-bottom:1px dashed rgba(21,31,56,0.35); position:absolute; top:50%; left:0; z-index:-1;}
.organ_wrap .organ_wrap_in dl.two-dep dd {background: var(--main);}
.organ_wrap .organ_wrap_in dl.two-dep dd.basic {height:65px; color:rgba(21,31,56,0.6); font-weight:500; border:1px solid rgba(21,31,56,0.6); box-sizing:border-box; background:var(--white); transform:translateX(-30%);}
.organ_wrap .organ_wrap_in dl.three-dep {margin:45px 0 0; padding:35px 0 0;}
.organ_wrap .organ_wrap_in dl.three-dep::before {content:''; max-width:600px; width:71%; height:1px; background:rgba(21,31,56,0.35); position:absolute; top:0; left:50%; transform:translateX(-50%);}
.organ_wrap .organ_wrap_in dl.three-dep dd {position:relative; height: 65px; background:#6e7a90;}
.organ_wrap .organ_wrap_in dl.three-dep dd::after {content:''; width:1px; height:35px; background:rgba(21,31,56,0.35); position:absolute; top:0; left:50%; transform:translateY(-100%);}
.organ_wrap .organ_wrap_in dl.three-dep dd:nth-of-type(2)::after {display:none;}







/*******************************************************************************
	@media ~1500px
*******************************************************************************/
@media all and (max-width:1700px) { 


/**** S:: 회사소개 > 인사말 ****/
.greeting_cont .txt_area br {display:none;}
/**** S:: 회사소개 > 인사말 ****/



}
/*******************************************************************************
	@media ~1300px
*******************************************************************************/
@media all and (max-width:1300px) { 

.organ_wrap .organ_wrap_in {max-width:100%;}
.organ_wrap .organ_wrap_in dl.three-dep::before {max-width:100%; width:68%;}
.organ_wrap .organ_wrap_in dl.two-dep dd.basic {transform:translateX(0);}
.organ_wrap .organ_wrap_in dl dd {width:calc((100% - 40px) / 3); max-width:100%;}

}
/*******************************************************************************
	@media 769~980px
*******************************************************************************/
@media all and (max-width:980px) { 


/**** S:: 회사소개 > 인사말 ****/
.greeting_cont .img_area {width:100%; height:400px; max-width:100%; margin:0 0 30px;}
.greeting_cont .txt_area  {flex:none; width:100%; position:relative;}
.greeting_cont .txt_area::after {top:auto; bottom:0; width:180px; }
.greeting_cont .txt_area .subTit {font-size:2.222rem;}
/**** S:: 회사소개 > 인사말 ****/

/**** S:: 회사소개 > 추진위 역할 ****/
.role_bg {height:300px; margin:30px 0;}
.role_list {grid-template-columns: repeat(1, 1fr);}
/**** E:: 회사소개 > 추진위 역할 ****/

}
/*******************************************************************************
	@media 481~680px
*******************************************************************************/
@media all and (max-width:680px) { 


/**** S:: 회사소개 > 인사말 ****/
.greeting_cont .img_area {width:100%; height:300px; max-width:100%; margin:0 0 20px; border-radius:var(--borderR10);}
.greeting_cont .txt_area  {flex:none; width:100%;}
.greeting_cont .txt_area .subTit {font-size:1.666rem;}
.greeting_cont .txt_area .stxt {margin:15px 0 0;}
.greeting_cont .txt_area .ceo {margin:30px 0 0;}
.greeting_cont .txt_area::after {display:none;}
/**** S:: 회사소개 > 인사말 ****/



/**** S:: 회사소개 > 추진위 역할 ****/
.role_cont .tBox .fs45 br {display:none;}
.role_bg {height:200px; margin:20px 0; border-radius:var(--borderR10);}
.role_list {grid-template-columns: repeat(1, 1fr); grid-gap:5px;}
.role_list dl {gap:0 20px; padding:15px; border-radius:var(--borderR10);}
.role_list dl dt {width:60px;}
.role_list dl dt img {max-width:60%; height:auto;}
.role_list dl dd .stxt {margin:5px 0 0;}
/**** E:: 회사소개 > 추진위 역할 ****/




.organ_wrap {padding:30px 20px; border-radius:var(--borderR10); margin:0 0 30px;}
.organ_wrap .organ_wrap_in .ceo {width:110px; font-size:1.111rem;}
.organ_wrap .organ_wrap_in dl dd {height:50px; width:calc((100% - 20px) / 3); font-size:1rem;}
.organ_wrap .organ_wrap_in dl.one-dep dd {width:33.33%}
.organ_wrap .organ_wrap_in dl.two-dep dd.basic {height:40px; font-size:0.922rem;}
.organ_wrap .organ_wrap_in dl.three-dep {margin:20px 0 0; padding:20px 0 0;}
.organ_wrap .organ_wrap_in dl.three-dep dd::after {height:20px;}
.organ_wrap .organ_wrap_in dl.three-dep dd {height:40px; font-size:0.922rem;}



.table_style thead {display:none;}
.table_style .tit {display:none;}
.table_style td {padding:10px 0;}
.table_style td::before {content:attr(data-th); display:block; font-weight: 500; color:var(--black); text-align:left; margin:0 0 5px;}

.contact_tel {padding:15px 30px; margin:15px 0 0;}
.contact_tel b::before {font-size:18px;}





}