@charset "utf-8";

.orga_map * ::after {
    content:"";
    position:absolute;
    background-color:#ddd;
    z-index: -1;
}
.orga_map a {font-weight:500;width: 100%;height: 100%;display: block;padding: 1rem .5rem;font-size: 18px;}
.orga_map dl {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 80%;
    margin: 0 auto;
    position: relative;
}
.orga_map dt {
    padding: 1rem 0;
}
.orga_map dt.map2 {padding:0}
.map0 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    position: relative;
}
.map0 .top {
    /* width: 187px; */
    /* height: 187px; */
    /* background-color: #fff; */
    /* border: 20px solid var(--color-main); */
    /* border-radius: 50%; */
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 100%;
}
.map0 .top:after {
    height: 250px;
    width: 1px;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 100%);
}
.map0 .map0-1 {
    position: relative;
    text-align: center;
    width: 55%;
    transform: translateX(-50%);
    right: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.map0 .map0-1 li {position: relative;}
.map0 .map0-1 a, .map0 .map0-2 a {
    width: 200px;
    display: block;
    float: right;
    background-color: #f3f3f3;
    padding: .8rem 0;
}
.map0 .map0-1 li:first-child a {border-bottom: 1px solid #ddd;}
.map0 .map0-1:after {
    width: 100%;
    height: .5px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
.map0 .map0-2 {
    display: flex;
    flex-direction: column;
    position: relative;
    text-align: center;
    width: 55%;
    transform: translateX(50%);
    right: 0;
    align-items: flex-end;
}
.map0 .map0-2:after {background-color:#ddd;width:100%;height:1px;top:50%;left: 0;}
.map0 .top a {
    font-size: 24px;
    width: 160px;
    height: 160px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: 10px solid var(--color-main);
    border-radius: 50%;
    color: var(--color-main);
}
.map1 a {
}
.map1 ul {}

.map1 ul li {
    width: 200px;
    border-radius: 1rem;
    text-align: center;
    margin-bottom: 2rem;
    background-color: #e2f5fd;
    position: relative;
}
.map1 ul li {background-color: var(--color-main);}
.map1 ul li a {color:#fff;}
.map1 ul li:after {
    width: 1px;
    height: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, 50%);
}
.map2 {width:100%}
.map2 ul {
    display: flex;
    justify-content: space-between;
    padding-top: 2rem;
    position: relative;
}
.map2 ul li {
    /* padding: 1rem 0; */
    text-align: center;
    border-radius: 2rem;
    border: 1px solid var(--color-main);
    width: 19%;
    position: relative;
    background-color: #ecf5f6;
}
.map2 ul:after {
    width: 81%;
    height: 1px;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}
.map2 ul li:after {
    height: 100%;
    width: 1px;
    bottom: 50%;
    left: 50%;
    transform: translate(-50%, -12%);
}
.map2 ul li:before {
    content:"";
    position:absolute;
    width:10px;
    height:10px;
    background-color: var(--color-main);
    top:0;
    left:50%;
    transform:translate(-50%, -50%);
    border-radius:50%
}
.person {
    margin-top: 6rem;
}
.person .tit {
    padding-top: 2rem;
}
.person .tit:first-of-type {padding-top:unset}
.person .tit p {font-size:22px;line-height: 1.6;margin-bottom: 1rem;font-weight: 500;color: #333;}
.person .t1 {width:100%;border-collapse: collapse;}
.person .t1 tr {}
.person .t1 td {
    /* background-color: #fff; */
    padding: 1rem;
    text-align: center;
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
    font-weight: 400;
    border-spacing: 0;
}
.person .t1 td:last-of-type, .person .t1 th:last-of-type {border-right:0}
.person .t1 th {
    font-weight: 500;
    text-align: center;
    padding: 1rem;
    border-top: 1px solid #5b5b5b;
    border-right: 1px solid #eee;
    background-color: #f7f7f7;
    font-size: 18px;
    color: #333;
    border-bottom: 1px solid #eee;
}



/* 탭구조 */
.subtab {border-bottom: 1px solid #ddd;margin-bottom: 3rem;}
.subtab ul {
    display: flex;
    justify-content: center;
}
.subtab li {
    width: 25%;
    text-align: center;
    background-color: #f5f5f7;
    border-top: 1px solid #ddd;
    border-left: 1px solid #ddd;
    position:relative;
}
.subtab li:last-child {border-right:1px solid #ddd}
.subtab li a {
    font-size: 20px;
    font-weight: 600;
    padding: 1.2rem;
    display: block;
}
.subtab li.on {
    /* border-bottom: unset; */
    
    background-color: #fff;
}
.subtab li.on:before {content:"";position:absolute;background-color: #ffffff;bottom: -1px;left: 0;height: 2px;z-index: 1;width: 100%;}
.subtab li.on:after {content:"";position:absolute;background-color: var(--color-main);top: -2px;left: 0;width: 100%;height: 4px;border-radius: 4px;}
.subtab li.on a {color: var(--color-main);}

/* PC (해상도 ~ 1440px)*/ 
@media only screen and (max-width: 1440px)  {
}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1024px)*/ 
@media all and (min-width:768px) and (max-width:1024px) {
    .orga_map dl {width:100%}
	.map0 .map0-1 {width: 50%;}
    .map0 .map0-2 {
    /* width: 50%; */
    transform: translateX(40%);
}
    .map0 .map0-2:after {left: 10%;width: 90%;}
    .orga_map a {font-size: 17px;}    
}

/* 모바일 가로, 모바일 세로 (해상도 ~ 767px)*/ 
@media all and (max-width:767px) {
    .orga_map a {font-size:4.5vw}
    .orga_map dt {
}
    .orga_map dl {width:100%}
    .map0 {
    width: 100%;
}
    .map0 .top {
}
    .map0 .top a {font-size: 20px;width: 130px;height: 130px;}
    .map0 .map0-1 {
}
    .map0 .map0-1 a {
    width: 75%;
}
    .map2 ul {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
}
    .map2 ul li {
    width: 45%;
    margin-bottom: 1.5rem;
}
    .map2 ul li:last-child::after, .map2 ul li:nth-last-child(2)::after, .map2 ul li:nth-last-child(3)::after {display:none}
    .map2 ul:after {width: 48%;}
    .map0 .map0-2 {}
    .map0 .map0-1 a, .map0 .map0-2 a {width: 120px;}
    .subtab li {width:40%}
    .subtab li a {font-size:4.6vw}
    .person .t1 th, .person .t1 td {font-size:15px; padding:1rem .3rem}
}