/* 조직도 */
[class^="box_st"] + .organizationBox {margin-top: 3rem;}
.chartBox {text-align: center;}
.chartBox li {position: relative; padding-top: 0.5rem;}
.chartBox li:before {position: absolute; top: 0; left: 50%; width: 1px; height: 0.5rem; background: #d9d9d9; content: "";}
.chartBox a {position: relative; display: flex; margin: 0 auto; width: 100%; max-width: 100%; height: 2.5rem; flex-direction: column; align-items: center; justify-content: center; background: #fff; border: 1px solid; border-radius: 1.5rem; z-index: 1;}
.chartBox a > span {font-size: 0.85rem; font-weight: 500;}

.chartBox .step01 > li {position: relative; padding-top: 0;}
.chartBox .step01 > li:before {position: absolute; top: 0; left: 50%; width: 1px; height: 6rem; background: #d9d9d9; content: "";}
.chartBox .step01 > li > a {margin-bottom: 2.5rem; width: 12.5rem; height: 3.5rem; font-size: 1rem; font-weight: 600; color: #fff; background: #006ac0 url(/images/web/goeay/sub/step_bg.png) no-repeat right center; border: 4px solid #b8dfff; border-radius: 2rem;}

.chartBox .step02 {position: relative;}
.chartBox .step02:before {position: absolute; top: 0; left: 16.7%; width: 66.66%; height: 1px; background: #d9d9d9; content: "";}
.chartBox .step02:after {clear: both; display: block; width: 100%; content: "";}
.chartBox .step02 > li {position: relative; float: left; padding-top: 2rem; width: 33.33%;}
.chartBox .step02 > li:before {position: absolute; top: 0; left: 50%; width: 1px; height: 2rem; background: #d9d9d9; content: "";}
.chartBox .step02 > li:after {position: absolute; top: -0.8rem; left: calc(50% - 0.8rem); width: 1.6rem; height: 1.6rem; text-align: center; line-height: 2; font-size: 10px; color: #006ac0; background: #e4f3ff; border: 0.3rem solid #fff; border-radius: 50%; content: "●";}
.chartBox .step02 > li.half {padding-top: 2rem !important; width: 33.35%;}
.chartBox .step02 > li.half:before {height: 7rem !important;}

.chartBox .step02 > li > a {margin-bottom: 1rem; width: 12.5rem; height: 3.5rem; font-size: 1rem; font-weight: 600; color: #fff; background: url(/images/web/goeay/sub/step_bg.png) no-repeat right center; border: 4px solid #b8dfff; border-radius: 2rem;}
.chartBox .step02 > li:nth-of-type(1) > a {background-color: #0272b9; border-color: #bbe3fc;}
.chartBox .step02 > li:nth-of-type(2) > a {background-color: #3f7eff; border-color: #c7d6ff;}
.chartBox .step02 > li:nth-of-type(3) > a {background-color: #008000; border-color: #01a301;}
.chartBox .step02 > li:nth-of-type(4) > a {background-color: #FF5E30; border-color: #f6c99c;}

.chartBox .step03 {position: relative;}
.chartBox .step03 > li {padding: 0 0.25rem;}
.chartBox .step02 > li.half .step03 {padding-top: 1.5rem;}
.chartBox .step02 > li.half .step03:before {position: absolute; top: 0; left: 25%; width: 50%; height: 1px; background: #d9d9d9; content: "";}
.chartBox .step02 > li.half .step03:after {clear: both; display: block; content: "";}
.chartBox .step02 > li.half .step03 > li {float: left; width: 50%;}
.chartBox .step02 > li.half .step03 > li:before {top: -1.5rem; height: 1.5rem;}
.chartBox .step02 > li.half .step03 > li > a ~ a {margin-top: 1rem;}

.chartBox .step04{ padding:0 1rem;}
.chartBox .step04 > li:before{ height:100%; top:-2rem;}
.chartBox .step04 > li > a{ margin-bottom:0.5rem;}

/* 분류별 색상 */
.chartBox .step02 > li:nth-of-type(1) .step03 > li > a {color: #fff; background: #0272b9; border-color: #0272b9;}
.chartBox .step02 > li:nth-of-type(2) .step03 > li > a {color: #fff; background: #3f7eff; border-color: #3f7eff;}
.chartBox .step02 > li:nth-of-type(3) .step03 > li > a {color: #fff; background: #008000; border-color: #008000;}
.chartBox .step02 > li:nth-of-type(4) .step03 > li > a {color: #fff; background: #FF5E30; border-color: #FF5E30;}
.chartBox .step02 > li:nth-of-type(1) .step04 > li > a {border-color: #0272b9;}
.chartBox .step02 > li:nth-of-type(2) .step04 > li > a {border-color: #3f7eff;}
.chartBox .step02 > li:nth-of-type(3) .step04 > li > a {border-color: #008000;}
.chartBox .step02 > li:nth-of-type(4) .step04 > li > a {border-color: #FF5E30;}
/* hover */
.chartBox .step02 > li:nth-of-type(1) .step04 > li > a:focus,
.chartBox .step02 > li:nth-of-type(1) .step04 > li > a:hover {background: #e2f4ff;}
.chartBox .step02 > li:nth-of-type(2) .step04 > li > a:focus,
.chartBox .step02 > li:nth-of-type(2) .step04 > li > a:hover {background: #e6eeff;}
.chartBox .step02 > li:nth-of-type(3) .step04 > li > a:focus,
.chartBox .step02 > li:nth-of-type(3) .step04 > li > a:hover {background: #e7fffb;}
.chartBox .step02 > li:nth-of-type(4) .step04 > li > a:focus,
.chartBox .step02 > li:nth-of-type(4) .step04 > li > a:hover {background: #fff2e6;}


/*웹접근성*/
.btn_mint {color:#fff; background:#007EA3 !important;  }
.btn_mint:hover, .btn_mint:focus { background:#1674A1 !important; }

@media (max-width:768px){
	/* 조직도 */
	.chartBox .step02:before {display: none;}
	.chartBox .step02 > li {padding-top: 2rem; width: 50%;}
	.chartBox .step02 > li ~ li {margin-top: 2rem;}
	.chartBox .step02 > li.half {width: 100%;}
	.chartBox .step02 > li:before {height: 2rem;}
	.chartBox .step02 > li.half:before {height: 7rem;}
}