@charset "utf-8";

.member_inner {/* display:none; */}

.orga_sec1 {
    margin-bottom: 6em;
}
.orga_sec1 > p {
    text-align: center;
    margin-top: -2rem;
    margin-bottom: 5rem;
    position:relative;
}
.orga_sec1 > p:after {
    content:"";
    border-left: 5px dotted;
    color: #ccc;
    position: absolute;
    margin-top: 1rem;
    top: 100%;
    left: 50%;
    height: 24px;
}
.orga_map {position:relative}
.orga_map:before {content:"";position:absolute;width:1px;height: 67%;top:0;left:50%;transform:translateX(-50%);background-color:#ddd}
.orga_map a {color: #111;}
.map_top {
    text-align: center;
}
.map_top p {text-align:center;margin:auto;font-size: 28px;font-weight: 600;color: #fff;display: inline-flex;justify-content: center;align-items: center;width: 200px;height: 200px;background-color: var(--color-main);border-radius: 50%;position: relative;}
.map_top p:before {content:"";background-color:#fff;border:1px solid #ddd;width:220px;height:220px;position: absolute;z-index: -1;border-radius: 50%;}
.map0 {
    width: 100%;
    padding: 5rem 0;
    text-align: center;
    margin: auto;
    position: relative;
}
.map0 > ul {
    /* display: flex; */
    /* align-items: center; */
    /* justify-content: center; */
    /* position: relative; */
    /* flex-direction: column; */
    /* margin: auto; */
    /* text-align: center; */
}
.map0 > ul li {
    width: 50%;
    position: relative;
}
.map0 > ul .top {
    width: 240px;
    text-align: center;
    background-color: #fff;
    height: 80px;
    border: 4px solid var(--color-main);
    border-radius: 1rem;
    margin-top: 2rem;
}
.map0 > ul .ceo {
    border-radius: 1rem;
    /* width: 170px; */
    /* height: 170px; */
    background-color: #fff;
    margin: 0;
    border: 2px solid var(--color-main);
    display: inline-flex;
    z-index: 1;
}
.map0 ul li a{font-size: 18px;font-weight: 500;width: 100%;height: 100%;display: inline-flex;align-items: center;justify-content: center;color: #333;}
.map0 > ul .ceo a {
    font-size: 24px;
    font-weight: 600;
    color: var(--color-main);
}
.map0-1 {
    width: 100%;
    /* padding-left: 300px; */
    position: relative;
    /* padding-top: 2rem; */
    margin: 0 auto;
    /* margin-top: -13rem; */
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}
.map0-1 .list_inner {position: relative;display: flex;justify-content: space-between;align-items: center;width: 65%;margin: 0 auto;}
.map0-1 ul {
    width: 331px;
}
.map0-1 ul li {
    /* background-color: #e1e1e1; */
    width: 200px;
    text-align: center;
    border-radius: .5rem;
    height: 50px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-weight: 500;
    border: 2px solid #ded3b0;
    color: #333;
}
.map0-1 .wrap {display: flex;width: 200px;background-color: #ffffff;flex-direction: column;gap: .4rem;position: relative;}
.map0-1 .wrap li {
    position: relative;
}
.map0-1 .wrap li:after {width:30px;height:1px;background-color:#ddd;top: 50%;right: 0;transform: translateY(-50%);margin-right: -30px;}
.map0-1 .wrap.right li:after {right:unset; left:0; margin:0; margin-left:-30px}
.map0-1 .wrap:after {
    right: 0;
    top: 50%;
    width: 1px;
    height: 82%;
    margin-right: -29px;
    transform: translateY(-50%);
}
.map0-1 .wrap.right:after {right:unset; left:0; margin:0; margin-left:-29px; height:70%}
.map1 { width: 100%;}
.map1 > ul {
    display: flex;
    align-items: center;
    /* padding: 0rem 0 2.5rem; */
    justify-content: center;
    position: relative;
}
.map1 > ul > li {
    width: 80%;
    height: 68px;
    border-radius: .5rem;
    position: relative;
}

.map1 .top {
    /* background-color: var(--color-main2); */
    width: 240px;
    border-radius: 1rem;
    height: 80px;
    border: 2px solid var(--color-main);
    background-color: #fff;
}
.map1 li a{
    font-size: 24px;
    font-weight: 600;
    display: inline-flex;
    height: 100%;
    width: 100%;
    align-items: center;
    justify-content: center;
}
.map1 .top a {
    color: var(--color-main);
}
.map1-1 {
    width: 32%;
    position: relative;
    margin-left: 68%;
    padding-bottom: 3rem;
}
.map1-1 .center_inner {}
.center_inner dl {
    background-color: #fff3e4;
    /* width: 51%; */
    /* margin: auto; */
    padding: 1.5rem 1rem;
    border-radius: 1rem;
}
.center_inner dt {font-size: 20px;text-align: center;margin-bottom: 1rem;font-weight: 500;}
.center_inner dd {} 
.center_inner ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    /* padding: 2rem; */
    justify-content: center;
}
.center_inner li {font-size: 18px;background-color: #fff;border: 1px solid #F5AD4F;padding: 10px;border-radius: 10px;color: #333;letter-spacing: -1px;}
.map2 {display: flex;gap: 0 10px;padding-top: 3rem;position: relative;}
.map2:before {content:"";position: absolute;top: 0;left: 50%;transform: translateX(-50%);width: 90.5%;height: 1px;background-color: #d5d5d5;}
.map2 > dl {width: 100%;/* border: 1px solid #00968845; */border-radius: 1rem;}
.map2 dt {position: relative;}
.map2 dl dt:before {content:"";position: absolute;top: 0;margin-top: -3rem;left: 50%;transform: translateX(-50%);background-color: #d5d5d5;width:1px;height:100%;z-index: -1;}
.map2 li a:hover {background-color:#f8f8f8}
.map2 li a, .orga_sec1 .orga_map .map2 li p {font-size: 19px;font-weight: 500;height: 100%;width: 100%;display: inline-flex;align-items: center;justify-content: center;border: 1px solid var(--color-main2);border-radius: 1rem;position: relative;border-top: 6px solid var(--color-main2);height: 80px;transition: all .3s}
.group_name {font-size:20px;text-align:center;position: relative;border-radius: 1rem 1rem 0 0;}
.group_name span {background-color: #dbf0ee;display: block;width: 100%;padding: 1rem;border: 1px solid #00968845;border-radius: 1rem 1rem 0 0;}
.group_name span a {/* color: #fff; *//* padding: 1rem; */display: block;width: 100%;font-size: 18px;font-weight: 500;}
.map3 {/* padding-top:1.5rem; */position: relative;width: 100%;padding: 1rem 0;border: 1px solid #00968845;border-radius: 0 0 1rem 1rem;border-top: 0;}
.map3 ul {text-align: center;}
.work li {
    font-size: 15px;
    padding: 3px;
    letter-spacing: -1px;
    color: #333;
    line-height: 120%;
}

/* 라인 */
.orga_sec1 li:after, .map0 > ul:after, .map0-1:after, .map0-2:after, .map0-1 .list_inner:after, .map0-2 .list_inner:after, .map0-1 ul:after, .map0-2 ul:after, .map1 > ul:after, .map2 > ul:after {
    content:"";
    position:absolute;
    background-color: #d5d5d5;
    z-index: -1;
}
.map0-1 .list_inner:after {
    width: 50%;
    height: 1px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.map0-2 .list_inner:after {width: 100%;height: 1px;top: 50%;}
.map1 > ul:after {width:1px;height:100%;left: 50%;top: 50%;transform: translate(-50%, -50%);}
.map2 > ul > li:after {height: 50%;width: .1px;top: 0;left: 50%;transform: translate(-50%, -100%);}
.map2 > ul:after {
    width: 86.5%;
    height: 1px;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
}
.table_view {}
.orga_sec2 {
    margin-bottom: 8%;
    margin-top: 5em;
}
.map2 > ul > li:first-child a {border-top-color:#FFEB3B}
.map2 > ul > li:nth-child(2) a {border-top-color:#FFC107}
.map2 > ul > li:nth-child(3) a {border-top-color:#CDDC39}
.map2 > ul > li:nth-child(4) a {border-top-color:#43c4d4}
.map2 > ul > li:nth-child(5) a {border-top-color:#98a7fa}
.map2 > ul > li:nth-child(6) a {border-top-color:#d58efe}
.map2 > ul > li:nth-child(7) a {border-top-color:#ff97bb}

.member_info {margin-top:2rem}

/* PC */ 
@media only screen and (min-width:1025px) and (max-width: 1500px)  {
    .map0-1 .list_inner {width: 80%;}
	.group_name span {padding:1rem 0;}
	.group_name span a {font-size: clamp(.9rem, 4vw, 1rem);}
    .work li {font-size: clamp(.8rem, 4vw, .9rem);}
}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1024px)*/ 
@media all and (max-width:1024px) {
    .orga_map:before {height: 60%;}
    .map0-1 .wrap {width: 23%;}
	.map0-1 .wrap li {width: 100%;}
	.map0-1 .list_inner:after {width: 47%;}
	.map1-1 {margin-left: 60%;width: 40%;padding: 2rem 0;}
	.center_inner dl {padding:1rem;}
	.center_inner ul {}
	.center_inner li {width: 48%;padding: 10px 5px;text-align: center;}
	.orga_map a {font-size:16px}
    .map2 {flex-wrap:wrap;width: 100%;gap: 1.5rem 2%;}
    .map2 dl {width: 18.4%;}
	.map2 dl.group6 dt:before, .map2 dl.group7 dt:before, .map2 dl.group8 dt:before, .map2 dl.group9 dt:before, .map2 dl.group10 dt:before {display:none}
    .map0-1 .list_inner {width:100%}
    li, .map2 li a, .orga_sec1 .orga_map .map2 li p {font-size: 17px;}
	.map2:before {left: 50%;transform: translateX(-50%);width: 82%;}
    .map2:after {content:"";position:absolute;width:1px;height: 100%;background-color:#ddd;left:50%;top:0;transform:translateX(-50%);z-index:-1;display: none;}
    .map2 dl.group3 dt:before {display:none;}
    .map3:before {width: 70%;}
	
}
    

/* 모바일 가로, 모바일 세로 (해상도 480px ~ 767px)*/ 
@media all and (max-width:767px) {
	.orga_sec1 {margin-top:2rem}
	.orga_sec1 > p {/* text-align:left; */}
    li, .map2 li a, .orga_sec1 .orga_map .map2 li p {font-size: clamp(.9rem, 4.5vw, 1rem);}
	.orga_map:before {height: 26%;}
	.map0 {padding:2rem 0}
	.map0 > ul .ceo {}
	.map0-1 {position: relative;transform: unset;margin-top: 1rem;}
	.map0-1 .list_inner {}
	.map0-1 .wrap {width: 40%;margin: 1rem 0;}
	.map0 ul li a {font-size:16px}
	.map0-1 .wrap li:after {width: 15px;margin-right: -15px;}
	.map0-1 .wrap:after {margin-right: -14px;}
	.map0-1 .list_inner:after {width:10%}
	.map0-1 .wrap.right li:after {margin-left: -15px;}
	.map0-1 .wrap.right:after {margin-left:-14px}
	.map1 .top {height: 70px;}
	.map1 .top a, .group_name span a {font-size: clamp(1.1rem, 5vw, 1.2rem);}
	.map1-1 {margin-left:0; width:100%}
	.group_name span {width:100%}
    .map1 .top a {color:var(--color-main); font-size: clamp(1.2rem, 5.5vw, 1.4rem);}
	.group1, .group2 {width:100%}
	.map2 {padding-top: 0;gap: 1rem 4%;}
	.map2:before, .map2:after {display:none}
	.map2 dl {width: 48%;}
    .map2 dl dt:before {top: unset;bottom:0;height: 50%;}
    .map2 .group1 dt {padding-top:0}
}