

/* 인사말 */
.greeting .top_box{position: relative; padding: 2.5rem 3.5rem 3rem; background: #004391 url('/images/template/TD_C001/sub/bg_greeting.png') no-repeat center / cover; border-radius: 2.25rem 2.25rem 2.25rem 0; color: #fff; font-weight: 600; padding-right: 15rem; width: calc(100% - 1.5rem); margin-bottom: 4.5rem; word-break: keep-all;}
.greeting .top_box::before{width: 15rem; height: 14rem; background: #fff; border-radius: 2.25rem; position: absolute; top: 1.25rem; right: -1.25rem; content: '';}
.greeting .top_box p.txt1{font-size: 1.25rem;}
.greeting .top_box p.txt2{font-size: 1.6rem;}
.greeting .top_box p.txt3{font-size: 1rem;}
.greeting .top_box .img{position: absolute; display: block; width: 14rem; height: 12.5rem; border-radius: 1.5rem; overflow: hidden; top: 2.5rem; right: -1.5rem;}
.greeting .top_box .img img{position: absolute; width: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); box-shadow: 0.25rem 0.25rem 0.25rem rgba(0, 0, 0, 0.3);}
.greeting .txt span{display: block; font-weight: 600; margin-bottom: 1.75rem; word-break: keep-all;}
.greeting .txt .name{text-align: right; font-weight: 700; font-size: 0.85rem;}

/* 인사말 - 사진x */
.greeting.grt2 .top_box{padding: 3.5rem 3rem; background: #004391 url('/images/template/TD_C001/sub/bg_greeting2.png') no-repeat center / cover; border-radius: 2.25rem 2.25rem 2.25rem 0; color: #fff; font-weight: 600; width: calc(100% - 1.5rem); margin-bottom: 2.25rem; word-break: keep-all;}
.greeting.grt2 .top_box::before{display: none;}
.greeting.grt2 .top_box .txt1{font-size: 1.6rem;}

/* 연혁 */
.box_history{position: relative; border: 1px solid #8ab3ff; border-radius: 1.75rem; padding: 2.25rem 1.75rem 2.25rem 8rem;}
.box_history .img{position: absolute; top: 1.25rem; left: 1.75rem; width: 5.3rem; height: 5.3rem; border-radius: 50%; background: #8ab3ff;}
.box_history .img img{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%);}
.box_history h3{font-size: 1.1rem; font-weight: 700; color: #396fd3; margin-bottom: 0.5rem;}
.his_list{margin-left: 2.5rem; border-left: 2px solid #ccc;}
.his_list dl{position: relative; padding-top: 2rem;}
.his_list dl::before{width: 0.6rem; height: 0.6rem; background: url('/images/template/TD_C001/sub/his_list_dot.png') no-repeat center / contain; position: absolute; top: 2.5rem; left: -0.35rem; content: '';}
.his_list dl::after{display: block; content: ''; clear: both;}
.his_list dl dt{font-size: 1rem; width: 4rem; float: left; font-weight: 700; text-align: center;}
.his_list dl dd{position: relative; width: calc(100% - 4rem); float: right; padding-left: 7.5rem; margin-bottom: 0.6rem;}
.his_list dl dd > p:not([class^="bu_st"]){padding: 0.25rem 0; font-size: 0.8rem;}
.his_list dl dd .year{position: absolute; top: 0; left:0; display: inline-block; width: 6rem; background: #608de0; text-align: center; font-size: 0.8rem; line-height: 1.75rem; color: #fff; border-radius: 1rem;}

/* 조직도 */
.org_chart{margin-top: 1rem;}
.org_chart .org{position: relative; display: flex; justify-content: space-around; margin-bottom: 4rem;}
.org_chart .org dl{position: relative; width: 10.2rem; border-radius: 1rem; border: 1px solid #ccc;}
.org_chart .org dl::before{width: 1px; height: 1.6rem; background: #ccc; position: absolute; left: 50%; top: -1.6rem; content: '';}
.org_chart .org dl dt{position: relative; color: #fff; background: url('/images/template/TD_C001/sub/bg_org.png') no-repeat right bottom / contain; padding: 0.9rem; border-radius: 1rem 1rem 0 0; text-align: center; font-size: 0.9rem; font-weight: 600; overflow: hidden;}
.org_chart .org.org1 dt{background-color: #004391;}
.org_chart .org.org2 dt{background-color: #58a5a2;}
.org_chart .org.org3 dt{background-color: #dcdcdc;}
.org_chart .org .org_wrap{position: relative; display: flex;}
.org_chart .org .org_wrap dl + dl{margin-left: 0.5rem;}
.org_chart .org dl dd{display: flex; align-items: center; justify-content: center; padding: 0.9rem; border-top: 1px solid #ccc; border-radius: 0 0 1rem 1rem; text-align: center; font-size: 0.9rem; font-weight: 600;}
.org_chart .org dl dd::before{width: 1px; height: 2.5rem; background: #ccc; position: absolute; left: 50%; bottom: -2.5rem; content: '';}
/* org1 */
.org_chart .org.org1::before{width: 50%; height: 1px; background: #ccc; position: absolute; bottom: -2.5rem; left: 25%; content: '';}
.org_chart .org.org1 dl::before{display: none;}
/* org3 */
.org_chart .org.org3{display: flex; justify-content: space-between;}
.org_chart .org.org3 dl{width: 9.2rem;}
.org_chart .org.org3 dl dt, .org_chart .org.org3 dl dd{padding: 0.6rem 0; color: #000033; font-size: 0.8rem;}
.org_chart .org.org3 dl dd::before{display: none;}
.org_chart .org .org_wrap::before{width: calc(100% - 9rem); height: 1px; background: #ccc; position: absolute; left: 4.5rem; top: -1.6rem; content: '';}

/* 조직도-마음건강 2024 */
.org_chart_mhc{margin-top: 1rem;}
.org_chart_mhc .org{position: relative;display: flex;justify-content: space-around;margin-bottom: 4rem;}
.org_chart_mhc .org dl{position: relative; width: 15.2rem;margin:0 .2rem; border-radius: 1rem; border: 1px solid #ccc;}
.org_chart_mhc .org dl::before{width: 1px; height: 1.6rem; background: #ccc; position: absolute; left: 50%; top: -1.6rem; content: '';}
.org_chart_mhc .org dl dt{position: relative; color: #fff; background: url('/images/template/TD_C001/sub/bg_org.png') no-repeat right bottom / contain; padding: 0.9rem; border-radius: 1rem 1rem 0 0; text-align: center; font-size: 0.9rem; font-weight: 600; overflow: hidden;}
.org_chart_mhc .org.org1 dt{background-color: #004391;}
.org_chart_mhc .org.org2 dt{background-color: #58a5a2; border-radius: 1rem; }
.org_chart_mhc .org.org2 dl::before{display:none}
.org_chart_mhc .org.org2 dd{display:none}
.org_chart_mhc .org.org3 dt{background-color: #dcdcdc;}
.org_chart_mhc .org .org_wrap{position: relative;width:15.2rem;margin:0 0.2rem;}
.org_chart_mhc .org .org_wrap dl + dl{}
.org_chart_mhc .org dl dd{display: flex; align-items: center; justify-content: center; padding: 0.9rem; border-top: 1px solid #ccc; border-radius: 0 0 1rem 1rem; text-align: center; font-size: 0.9rem; font-weight: 600;}
.org_chart_mhc .org dl dd::before{width: 1px; height: 2.5rem; background: #ccc; position: absolute; left: 50%; bottom: -2.5rem; content: '';}
/* org1 */
.org_chart_mhc .org.org1::before{width: 50%; height: 1px; background: #ccc; position: absolute; bottom: -2.5rem; left: 25%; content: '';}
.org_chart_mhc .org.org1 dl::before{display: none;}
/* org3 */
.org_chart_mhc .org.org2{margin-bottom:0;}
.org_chart_mhc .org.org2 dl{width:100%;margin:0;}
.org_chart_mhc .org.org3 dl{width:100%;margin:1.5rem 0 0;}
.org_chart_mhc .org.org3 dl:nth-child(1):before{height: 6.47rem;  top: -6.47rem; z-index:-1}
.org_chart_mhc .org.org3 dl dt, .org_chart_mhc .org.org3 dl dd{padding: 0.6rem 0; color: #000033; font-size: 0.8rem;}
.org_chart_mhc .org.org3 dl dd::before{display: none;}
.org_chart_mhc .org .org_wrap::before{width:0; height: 1px; background: #ccc; position: absolute; left: 4.5rem; top: -1.6rem; content: '';}


/* 오시는 길 */
.map{position: relative; padding-left: 1rem; padding-bottom: 1rem;}
.map a{display: none;}
.map::before{position: absolute; width: calc(100% - 3rem); height: calc(100% - 3rem); top: 3.25rem; left: 0; background: url('/images/template/TD_C001/sub/ptrn_map.png') repeat; border-radius: 2.5rem; content: ''; z-index: -1;}
.map .map_box{height: 465px; border-radius: 0 4rem 0 0; background: #eee; overflow: hidden;}
.map .map_box map area:focus{border: 2px solid #000;}
.map .info{position: relative; margin-top: -3.2rem;}
.map .info .tit{position: relative;z-index:1;padding: 0 3.5rem; background: #004391; border-radius: 1.5rem 1.5rem 0 0; display: inline-block; vertical-align: middle; font-size: 1rem; font-weight: 600; overflow: hidden;}
.map .info .tit::before{width: 12rem; height: 12rem; border-radius: 50%; background: #003a7d; position: absolute; top: -1rem; right: -7.5rem; content: '';}
.map .info .tit span{position: relative; display: block; line-height: 3.2rem; color: #fff; overflow: hidden; white-space: nowrap; z-index: 1;}
.map .info .box{background: #fff; padding: 1.5rem; border-radius: 0 0 1.5rem 1.5rem; border: 1px solid #ccc;}
.map .info .box dl{padding-left: 2.5rem;}
.map .info .box dl dt{position: relative; font-size: 0.9rem; font-weight: 600;}
.map .info .box dl dt i{position: absolute; top: -0.15rem; left: -2.5rem; width: 1.75rem; height: 1.75rem; line-height: 1.75rem; text-align: center; color: #fff; border-radius: 50%; background: #246fc2;}

/* Q&A */
.qna dl{margin-bottom: 0.8rem;}
.qna dl dt{position: relative; padding: 1rem 0.75rem 1rem 3.25rem; background: #fff; border-radius: 0.75rem; border: 1px solid #ccc; box-shadow: 0.2rem 0.2rem 0.2rem rgba(0, 0, 0, 0.1); font-weight: 700; z-index: 2;}
.qna dl dt span{position: absolute; top: 0.6rem; left: 0.75rem; width: 2rem; height: 2rem; line-height: 2rem; text-align: center; background: #058fe1; color: #fff; border-radius: 50%;} 
.qna dl dd{position: relative; background: #f8f8f8; padding: 1rem 0.75rem 1rem 3.25rem; border-radius: 0 0 0.75rem 0.75rem; font-weight: 600;}
.qna dl dd > span{position: absolute; top: 0.6rem; left: 0.75rem; width: 2rem; height: 2rem; line-height: 1.6rem; text-align: center; border:2px solid #009de0; background: #fff; border-radius: 50%; font-weight: 700;} 

/* 사이트맵 */
.siteMap{display: flex; flex-wrap: wrap; justify-content: flex-start;}
.siteMap .dep1{width: 24%; margin-bottom: 1rem;margin-right:1%;}
.siteMap .dep1 > li > a{position: relative; display: flex; text-align: center; height: 3.1rem; margin-bottom:.2rem;align-items: center; justify-content: center; border-radius: 0.9rem 0.9rem 0.9rem 0; background: #2a76c4; overflow: hidden;}
.siteMap .dep1 > li > a::before{width: 12rem; height: 12rem; border-radius: 50%; background: #1a5ea4; position: absolute; right: -6rem; top: -0.75rem; content: '';}
.siteMap .dep1 > li > a span{ position: relative; color: #fff; font-size: 1rem; font-weight: 600;}
.siteMap .dep1 > li > a:focus{outline:2px dotted;}
.siteMap .dep2 > li{padding:.1rem 0;}
.siteMap .dep2 > li + li{border-top: 1px dotted #ccc;}
.siteMap .dep2 > li.child + li{border-top: 0;}
.siteMap .dep2 > li > a{position: relative; display: block; padding: 0.4rem 0 0.4rem 1rem;}
.siteMap .dep2 > li > a::before{width: 0.4rem; height: 0.1rem; background: #2a76c4; position: absolute; top: 1rem; left: 0; content: '';}
.siteMap .dep3{background: #f0f0f0; padding: 1rem; border-radius: 0.75rem;}
.siteMap .dep3 > li{padding:.1rem 0;}
.siteMap .dep3 > li > a{position: relative; padding-left: 0.75rem;} 
.siteMap .dep3 > li > a::before{width: 0.25rem; height: 0.25rem; border-radius: 50%; background: #8f8f8f; position: absolute; top: 0.5rem; left: 0; content: '';}

@media screen and (max-width:1440px){ 
	/* 조직도 */
	.org_chart .org.org3{justify-content: space-evenly;}
	.org_chart .org.org3 dl{width: 8rem;}
	.org_chart .org .org_wrap::before{width: calc(100% - 8rem); left: 4rem;}
}

@media screen and (max-width:1024px){ 
	/* 인사말 */
	.greeting .top_box{margin-bottom: 3rem; padding-right: 13rem;}
	.greeting .top_box::before{width: 12.5rem; height: 12rem;}
	.greeting .top_box .img{width: 12rem; height: 10rem; top: 2rem;}

	/* 사이트맵 */
	.siteMap .dep1{width: 32%;}
}

@media screen and (max-width:840px){ 
	/* 조직도 */
	.org_chart .org .org_wrap{flex-wrap: wrap; width: 46%; flex-direction: column;}
	.org_chart .org .org_wrap::before{display: none;}
	
	.org_chart .org dl{width: 46%;}
	.org_chart .org dl dt{padding: 0.5rem;}
	.org_chart .org dl dd{padding: 0.5rem;}
	.org_chart .org.org1 dl{width: 70%;}
	.org_chart .org.org2{margin-bottom: 0;}
	.org_chart .org.org2 dl dd::before{display: none;}
	.org_chart .org.org3 dl{width: 100%; margin-top: 1.6rem;}
	.org_chart .org.org3 dl + dl{margin-left: 0;}
	.org_chart .org.org3 dl dt, .org_chart .org.org3 dl dd{padding: 0.5rem;}
}

@media screen and (max-width:768px){
	/* 인사말 */
	.greeting .top_box{padding: 2rem 10rem 2.25rem 2rem;}
	.greeting .top_box p.txt1{font-size: 1.15rem;}
	.greeting .top_box p.txt2{font-size: 1.3rem;}
	.greeting .top_box p.txt3{font-size: 0.9rem;}
	.greeting .top_box::before{width:9.5rem; height: 10rem;}
	.greeting .top_box .img{width: 9rem; height: 8rem;}

	/* 인사말 - 사진x */
	.greeting.grt2 .top_box{width: 100%; padding: 2.5rem 3rem;}
	.greeting.grt2 .top_box .txt1{font-size: 1.3rem;}

	/* 연혁 */
	.his_list dl{padding-left: 1.5rem;}
	.his_list dl dt{width: 100%; text-align: left; margin-bottom: 0.5rem;}
	.his_list dl dd{width: 100%; float: left;}

	/* 사이트맵 */
	.siteMap .dep1{width: 49%;}
}

@media screen and (max-width:580px){ 
	/* 인사말 */
	.greeting .top_box{padding: 6.5rem 1.5rem 1.5rem; margin-top: 3rem; width: 100%; margin-bottom: 2rem;}
	.greeting .top_box::before{top: -3rem; width: 10rem; height: 8.5rem; right: calc(50% - 5rem); border-radius: 2rem;}
	.greeting .top_box .img{top: -3rem; right: calc(50% - 4.5rem);}
	.greeting .top_box p.txt1{font-size: 1.05rem;}
	.greeting .top_box p.txt2{font-size: 1.1rem;}
	.greeting .top_box p.txt3{font-size: 0.85rem;}

	/* 인사말 - 사진x */
	.greeting.grt2 .top_box{margin-top: 0; padding: 2rem;}
	.greeting.grt2 .top_box .txt1{font-size: 1.15rem;}

	/* 연혁 */
	.box_history{padding: 6rem 1rem 1.5rem 1rem; text-align: center;}
	.box_history .img{left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); top: 1.1rem; width: 4rem; height: 4rem;}
	.box_history .img img{width: 2.4rem;}
	.his_list{margin-left: 1.5rem;}
	.his_list dl{padding-left: 1rem;}
	.his_list dl dd{padding-left: 0;}
	.his_list dl dd .year{position: relative; margin-left: -0.5rem; margin-bottom: 0.25rem;}

	/* qna */
	.qna dl dt span{width: 1.75rem; height: 1.75rem; line-height: 1.75rem; top: 0.75rem;}
	.qna dl dd span{width: 1.75rem; height: 1.75rem; line-height: 1.55rem; top: 0.75rem;}
}

@media screen and (max-width:480px){
	/* 인사말 */
	.greeting .top_box{padding-top: 5.5rem;}
	.greeting .top_box::before{width:9rem; height: 7.5rem; right: calc(50% - 4.5rem);}
	.greeting .top_box .img{width: 8rem; height: 7rem; right: calc(50% - 4rem);}

	/* 오시는 길 */
	.map .info .tit{padding: 0 1.5rem;}
	.map .info .tit span{line-height: 2.75rem; font-size: 0.95rem;}
	.map .info .box{padding: 1rem;}

	/* 사이트맵 */
	.siteMap .dep1{width: 100%;}
}