@charset "UTF-8";

/* 회사개요 */
.fc_pointer {color:#1F88E5; }
.daon_content_wrap{width:100%; min-width:320px; max-width:1200px; margin:0 auto;}
.daon_page_title{width:100%; margin-bottom:70px;}
.daon_page_title h1{width:100%; margin:0 auto; text-align:center; font-size:2.5em; font-weight:600;}
.daon_page_title h1:after {content:""; clear:both; display:block; width:30px; margin:10px auto; border:1px solid #000;}
.daon_page_title h2{width:100%; margin:0 auto; text-align:center; font-size:1.2em; color:#666; margin-top:20px; }

.company_type1 {width:100%; margin:0 auto; }
.company_type1:after{content:""; clear:both; display:block;}
.company_type1 .ceo_img {position: relative; float:right; width:500px; text-align:right; padding-left:30px;}
.company_type1 .ceo_img img {width:100%; height:auto; }
.company_type1 .ceo_area{ float:left; width:50%;}
.company_type1 .ceo_area .ceo_tit { position:relative; float:left; width:100%; font-size:2em; line-height:1.4em; letter-spacing:-0.05em;  }
.company_type1 .ceo_area .ceo_txt { float:right; width:100%; padding-top:50px; }
.company_type1 .ceo_area .ceo_txt p {margin-top:20px; line-height:1.7em; color: #000; word-break: keep-all; font-size:1.3em;}
.company_type1 .ceo_area .ceo_txt span.ceo_sign{ display:block; font-size:1.1em; color:#000; margin-top:50px; font-family: 'Satisfy', 'Noto Sans KR', sans-serif;}

.daon_s_tit {width:100%; height:30px; line-height:30px; text-align:left; border-left:5px solid #000; margin:50px auto;  margin-bottom:10px;  font-size:1.5em;  text-indent:10px;}
.tbla{width:100%; border-collapse: collapse; margin:0 auto; border:1px solid #ddd; border-bottom:0px;}
.tbla tr th{width:20%; height:45px; padding:15px 0; text-align:center; border-bottom:1px solid #666; font-size:1.2em;}
.tbla tr td{width:80%; border-bottom:1px solid #ddd; padding-left:15px; height:45px; text-align:left;font-size:1.1em;}


.info_box{padding-top:30px;}
.info_box .img_25 {float:left; width:23%; margin-right:2.6%; margin-bottom:0;}	
.info_box .img_25:last-child {float:right; margin-right:0;} 
.info_box .img_25 img {max-width:100%;}	
.info_box .img_25 p { margin-top:15px; font-size:1.25em; text-align:center;}

@media screen and (max-width:992px){

	.daon_content_wrap{width:96%;}
	.daon_page_title{margin-bottom:50px;}
	.daon_page_title h1{font-size:2em;}
	.daon_page_title h2{font-size:1em;}
	.daon_s_tit{font-size:1.2em;}

	.company_type1 .ceo_img {width:100%; text-align:center; margin-bottom:30px; padding-left:0; }
	.company_type1 .ceo_img img{width:100%;}
	.company_type1 .ceo_area{ float:none; width:95%; margin:0 auto; }
	.company_type1 .ceo_area .ceo_tit { font-size:1.8em; text-align:center;}
	.company_type1 .ceo_area .ceo_txt{padding-top:10px;}

	.tbla tr th{width:30%; font-size:0.9em;}
	.tbla tr td{width:70%; font-size:0.9em;}

}
@media all and (max-width:640px){
		.info_box .img_25 {width:100%; margin-bottom:10px;}
}


.org-chart{
    --node-width:160px;
    position:relative;
    width:95%;
    max-width:var(--max-width);
    margin:0 auto;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:25px;
    font-size:1.8rem;
}
.ceo{
    position:relative;
    z-index:1;
    margin-bottom:30px;
    font-size:1em;
}
.ceo:before{
    content:'';
    position:absolute;
    width:1px;
    height:54px;
    background-color:#ededed;
    left:50%;
    bottom:-52px;
}
.vp{
    position:relative;
    font-size:1em;
    width:100%;
}
.vp:before{
    content:'';
    position:absolute;
    width:1px;
    height:52px;
    background-color:#ededed;
    left:50%;
    bottom:-50px;
}
.main-departments {
    flex:0 0 auto;
    position:relative;
    display:flex;
    align-items: flex-start;
    width:100%;
    justify-content: space-between;    
    font-size:1em;
}
.advisor-group{
    flex:0 0 auto;
    display:flex;
    justify-content:space-between;
    width:90%;
}
.advisor-group .advisor{
    position:relative;
    width:100%;
    display:flex;
}
.advisor-group .advisor:nth-of-type(1):before{
    position:absolute;
    content:'';
    height:1px;
    top:50%;
    left:var(--node-width);
    width:calc(100% - var(--node-width));
    display:flex;
    background-color:#ededed;
}
.advisor-group .advisor:nth-of-type(2):before{
    position:absolute;
    content:'';
    height:1px;
    top:50%;
    left:0;
    width:calc(100% - var(--node-width));
    display:flex;
    background-color:#ededed;
	z-index: 1;
}
.advisor-group .advisor:nth-of-type(2){
    display:flex;
    justify-content: flex-end;
}
.advisor-up{
    top:-75px;
}
.engineer-advisor{
    flex:0 0 auto;
    width:90%;
    display:flex;
    align-items: center;
    justify-content: flex-end;
}
.engineer-advisor:before{
    content:'';
    display:flex;
    position:absolute;
    height:1px;
    top:50%;
    left:50%;
    width:calc(50% - var(--node-width));
    background-color:#ededed;
}

.main-departments{
    margin-top:50px;
}

.main-departments .department-row{
    display:flex;
    position:relative;
    gap:8px
}

.main-departments .department-row .sub-departments:before{
    flex:0 0 auto;
    content:'';
    height:1px;
    background-color:#ededed;
    display:flex;
    position:absolute;
    width:calc(100% + 8px) ;
    top:-20px;
}

.main-departments .department-row .sub-departments:first-child:before{
    width:calc(50% + 8px);
    left:50%;
}
.main-departments .department-row .sub-departments:last-child:before{
    width:calc(50% + 8px);
    left:-8px;
}


.main-departments .department-column{
    flex:1;
    display:flex;
    flex-direction: column;
    align-items: center;
    gap:20px;
    position:relative;
}
.main-departments .department-column:before{
    flex:0 0 auto;
    content:'';
    height:1px;
    background-color:#ededed;
    display:flex;
    position:absolute;
    width:100%;
    top:-25px;
}

.main-departments .department-column:first-child:before{
    width:50%;
    left:50%;
}
.main-departments .department-column:last-child:before{
    width:50%;
    left:0;
}


.sub-departments{
    flex:1;
    display:flex;
    flex-direction: column;
    align-items: center;
    gap:2px;
    position:relative;
}

.node{
    height:70px;
    border-radius:6px;
    width:var(--node-width);
    font-size:0.9em;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    background-color:#f4f4f4;
    border:1px solid #dedede;
    box-shadow:2px 2px 2px #ededed;
    position:relative;
    z-index:1;
    text-align:center;
    word-break:keep-all;
    
}
.advisor,.main-dept,.sub-dept{
    position:relative;
}
.main-dept{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    margin-bottom:20px;
    position:relative;
}
.main-dept:after{
    content:'';
    height:20px;
    background-color:#ededed;
    display:flex;
    position:absolute;
    width:1px;
    left:50%;
    bottom:-20px;
}

.ceo .node{
    background: #2996f8;
    background: linear-gradient(0deg, #2996f8 0%, #6cb7fb 100%);
    border-color:#2996f8;
    color:#ffffff;
}

.vp .node{
    color:#000000;
    background: #c4e3f7;
    background: linear-gradient(0deg, #6ec0e2 0%, #c4e3f7 100%);
    border-color:#528eca;
    position:absolute !important;
    top:-25px;
    right:55%;
}

.vp .node:after{
    position:absolute;
    width:57px;
    height:1px;
    background-color:#ededed;
    display:block;
    content:'';
    right:-58px;
}

.advisor .node{
    background: #cac4ed;
    background: linear-gradient(0deg, #cac4ed 0%, #fdfdfd 100%);
    border-color:#8777df;
    color:#5034b5;
}

.main-dept .node{
    background: #c8d9f3;
    background: linear-gradient(0deg, #c8d9f3 0%, #fdfdfd 100%);
    border-color:#a3bfeb;
    color:#204bb7;
}
.sub-dept .node{
    background: #e8e8e8;
    background: linear-gradient(0deg, #e8e8e8 0%, #ffffff 100%);
    border-color:#dedede;
    border-width:1px;
}
/*
.sub-departments .sub-dept:nth-of-type(1) .node{
    background: #e3ecd0;
    background: linear-gradient(0deg, #e3ecd0 0%, #ffffff 100%);
    border-color:#dedede;
    border-width:1px;
} 
*/
.sub-departments .sub-dept .node{
    background: #f0f5e7;
    border-color:#dedede;
    border-width:1px;
    color:#333;
}

.main-dept:before{
    content:'';
    position:absolute;
    height:25px;
    width:1px;
    background-color:#ededed;
    left:50%;
    top:-25px;
    display:flex;
}

.sub-dept:first-child:before{
    content:'';
    position:absolute;
    height:20px;
    width:1px;
    background-color:#ededed;
    left:50%;
    top:-20px;
    display:flex;
}

.org-chart .line, 
.org-chart .advisor-group::before, 
.org-chart .advisor::before, 
.org-chart .advisor::after {
  z-index: 1 !important; /* 줄은 뒤에 있도록 */
}

.org-chart .node {
  position: relative;
  z-index: 10;
}

.org-location-title h3{
    font-size:1.5rem;
    font-weight:700;
    
}

@media (max-width: 1400px) {
    .org-chart{
        --node-width:150px;
    }
}
@media (max-width: 1300px) {
    .org-chart{
        --node-width:120px;
    }
    .vp .node:after{
        width:45px;
        right:-46px;
    }
}

@media (max-width: 1024px) {
    .main-departments {
        flex: 0 0 auto;
        position: relative;
        display:grid;
        grid-template-columns:repeat(3,1fr);
        align-items: flex-start;
        width: 100%;
        justify-content: space-between;
        row-gap:50px;
    }

    .main-departments .department-column:nth-child(4n):before {
        width: 50%;
        left: 0;
    }
    .main-departments .department-column:nth-child(5n):before {
        width: 50%;
        left: 50%;
    }
    .main-departments .department-column:nth-child(4n){
        grid-column:4;
    }
    
    .info_box{
        display:grid;
        grid-template-columns:repeat(2,1fr);
        gap:40px;
    }
    .info_box .img_25{
        width:100% !important;
        margin:0 !important;
    }
}

@media (max-width:960px) {
    .org-chart{
        --node-width:180px;
    }
    .main-departments {
        flex: 0 0 auto;
        position: relative;
        display:grid;
        grid-template-columns:repeat(1,1fr);
        align-items: flex-start;
        width: 100%;
        justify-content: space-between;
        row-gap:50px;
    }
    .main-departments .department-column:first-child:before {
        display:none;
    }
    .main-departments .department-column:nth-child(4n){
        grid-column: 2;
    }
    .main-departments .department-column:nth-child(5n){
        
    }
    .main-departments .department-column:nth-child(2n):before {
        width: 50%;
        left: 0;
        display:none;
    }
    .main-departments .department-column:nth-child(3n):before {
        width: 50%;
        left: 50%;
    }
    .main-departments .department-column:nth-child(5n):before {
        width: 50%;
        left: 50%;
    }
    .main-departments .department-column:nth-child(6n):before {
        width: 50%;
        left: 0;
    }
    .main-departments .department-column:nth-child(7n):before {
        display:none;
    }
    .main-departments .department-row{
        flex-direction:column;
    }
    .main-departments .department-row .sub-departments:first-child:before {
        display:none !important;
    }
    .main-departments .department-row .sub-departments:before{
        display:none !important;
    }
    .vp .node {
        right: 58%;
    }
    .vp .node:after{
        width:57px;
        right:-58px;
        display:none;
    }
}


@media(max-width:500px){
    .info_box{
        display:grid;
        grid-template-columns:repeat(1,1fr);
        gap:40px;
    }
    .info_box .img_25{
        width:100% !important;
        margin:0 auto !important;
        text-align:center;
    }
}