@charset "utf-8";

/**********************************************************************************
	content common
**********************************************************************************/
*[class^='msgBox_'] { position:relative; width:100%; padding:30px; z-index:1}
*[class^='msgBox_']  > *[class^="s_title"] { margin-top:0;}
*[class^='msgBox_'] > p { margin-top:18px; }
*[class^='msgBox_'] > p:only-child { margin-top:0; }
*[class^='msgBox_']::before,
*[class^='msgBox_']::after { content:""; display:block; position:absolute; background-repeat:no-repeat; background-position:0 0; z-index:2}
*[class^='msgBox_'] > p > strong { font-weight:500; color:#0f4fbd; }
*[class^='msgBox_'] .s_title_2 {padding-left:0; line-height:inherit; color:#095f8c; }
*[class^='msgBox_'] .s_title_2::before {display:none;}
*[class^='msgBox_'] .s_title_3 {padding-left:0; line-height:inherit; color:#095f8c; }
*[class^='msgBox_'] .s_title_3::before {display:none;}

@media (max-width:767px) {
	*[class^='msgBox_']::before,
	*[class^='msgBox_']::after {  background-size:cover}
	*[class^='msgBox_'] { padding-bottom:200px; }
}


/**********************************************************************************
	Health-care Service
**********************************************************************************/
/* Health-care Service */
.msgBox_hs1 { margin-top:50px; background-color:#f4f9fc; padding-left:250px; }
.msgBox_hs1::before { width:135px; height:189px; left:50px; bottom:0; background-image:url(../image/content/hs_backimg01.png); }
.msgBox_hs2 { margin-top:70px; background-color:#f4f9fc;  padding-right:300px;}
.msgBox_hs2::after { width:284px; height:221px; right:20px; bottom:-50px; background-image:url(../image/content/hs_backimg02.png); }
@media (max-width:767px) {
	.msgBox_hs1 { margin-top:24px; padding-left:30px;}
	.msgBox_hs1::before { left:50%; margin-left:-70px;}
	.msgBox_hs2 { margin-top:24px; padding-right:30px;}
	.msgBox_hs2::after { width:244px; height:190px; right:0; left:50%; margin-left:-122px; bottom:20px;}
}


/**********************************************************************************
	Welfare Service
**********************************************************************************/
/* Welfare Service */
.msgBox_ws1 { margin-top:24px; padding-right:400px; background-color:#f4f9fc; }
.msgBox_ws1::before { width:330px; height:207px; right:20px; bottom:0; background-image:url(../image/content/ws_backimg01.png); }
@media (max-width:767px) {
	.msgBox_ws1 { padding-right:25px;}
	.msgBox_ws1::before { width:303px; height:190px; right:0; left:50%; margin-left:-150px;}
}


/**********************************************************************************
	Volunteer Service
**********************************************************************************/
/* Volunteerism */
.msgBox_vt1 { margin-top:24px; padding-right:400px; background-color:#f4f9fc; }
.msgBox_vt1::before { width:312px; height:177px; right:20px; bottom:0; background-image:url(../image/content/vt_backimg01.png); }
@media (max-width:767px) {
	.msgBox_vt1 { padding-right:25px;}
	.msgBox_vt1::before { right:0; left:50%; margin-left:-155px;}
}

/**********************************************************************************
	About sorokdo
**********************************************************************************/
/*Foundation&Activities */
.msgBox_about1 { margin-top:24px; margin-bottom:70px; padding-left:300px; min-height:250px; background-color:#ebf1f9; }
.msgBox_about1::before { width:267px; height:260px; left:40px; bottom:-40px; background-image:url(../image/content/ab_backimg01.png); }
@media (max-width:767px) {
	.msgBox_about1 { margin-top:24px; margin-bottom:20px;  padding-left:30px; min-height:0; }
	.msgBox_about1::before { width:195px; height:190px;  left:50%; margin-left:-100px; bottom:-10px; }
}

.majorllist { margin-top:12px; }
.majorllist > .listBox { display:table; margin-top:12px; width:100%; height:auto; border:1px solid #c2d0e3;}
.majorllist > .listBox > * { display:table-cell; margin:0; padding:20px; font-size:14px; line-height:26px; }
.majorllist > .listBox > *:nth-child(1) { color:#333; font-weight:500; background-color:#f7fafd; border-right:1px solid #c2d0e3;}

@media (min-width:1180px) {
	.majorllist > .listBox > *:nth-child(1) { width:30%; }
	.majorllist > .listBox > *:nth-child(2) { width:70%; }
}
@media (min-width:768px) and (max-width:1179px) {
	.majorllist > .listBox > *:nth-child(1) { width:30%; }
	.majorllist > .listBox > *:nth-child(2) { width:70%; }
}
@media (max-width:767px) {
	.majorllist { margin-top:12px; }
	.majorllist > .listBox { display:block; margin-top:12px; width:100%; height:auto; border:1px solid #c2d0e3;}
	.majorllist > .listBox > * { display:block; width:100%;}
	.majorllist > .listBox > *:nth-child(1) { padding:8px 20px; text-align:center; border-right:0 none; border-bottom:1px solid #c2d0e3;}
	.majorllist > .listBox > *:nth-child(2) { padding:20px; }
}

/* Organization Chart */
.organization_chart {font-size:0; line-height:0; text-align:center; background-repeat:no-repeat; background-position:center 50px;}
.organization_chart a,
.organization_chart p {display:block;}
.organization_chart a > span,
.organization_chart p > span {display:block; width:100%; font-family:'Noto Sans KR'; font-weight:500; letter-spacing:-0.048em; text-align:center;}
.organization_chart .dir > * { padding:15px; background-color:#4a699e;  }
.organization_chart .dir > * > span { font-size:15px; line-height:28px; color:#fff;}
.organization_chart *[class^="tit_dep_"] > * { padding:15px; }
.organization_chart *[class^="tit_dep_"] > *  > span {font-size:15px; line-height:24px;}
.organization_chart .tit_dep_1 > * { background-color:#f2f8f4; color:#008f79;}
.organization_chart .tit_dep_2 > * { background-color:#eaf1fc; color:#0f4fbd;}
.organization_chart .depList {background-color: transparent;}
.organization_chart .depList > ul > li > * { margin:2px 0; padding:7px 15px; background-color:#f7faff;}
.organization_chart .depList > ul > li > * > span {font-size:14px; line-height:28px;  color:#333; text-align:left; }
.organization_chart > ul {position:relative;}
.organization_chart > ul > li { position:absolute;}
.organization_chart > ul > li > ul::after {display:block; content:''; clear:both;}
.organization_chart .subDepArea { }
.organization_chart .subDepArea > ul {position:relative;}
.organization_chart .subDepArea > ul > li { position:absolute;}

@media (min-width:1180px) {
	.organization_chart { width:730px; height:500px; margin:40px auto 0 auto; background-image:url(../image/content/ab_chart_line.png); }
	.organization_chart .dir { width:260px; left:50%; margin-left:-130px; }
	.organization_chart .subDepArea {width:100%;height:400px;left:0;top: 110px;}
	.organization_chart *[class^="tit_dep_"] { width:240px; top:0; left:50%; }
	.organization_chart .tit_dep_1 {margin-left: -260px;}
	.organization_chart .tit_dep_2 {margin-left: 10px;}
	.organization_chart .depList {left:50%;top:140px;width:420px;margin-left: -100px;}
}
@media (min-width:768px) and (max-width:1179px) {
	.organization_chart { width:100%; height:700px; margin:40px auto 0 auto; background-image:url(../image/content/ab_chart_line.png); }
	.organization_chart .dir { width:260px; left:50%; margin-left:-130px; }
	.organization_chart .subDepArea {width:100%;height:400px;left:0;top: 110px;}
	.organization_chart *[class^="tit_dep_"] { width:240px; top:0; left:50%; }
	.organization_chart .tit_dep_1 {margin-left: -260px;}
	.organization_chart .tit_dep_2 {margin-left: 10px;}
	.organization_chart .depList {left:50%;top:140px;width:420px;margin-left: -100px;}
}
@media (max-width:767px) {
	.organization_chart { width:100%; height:450px; margin:20px auto}
	.organization_chart .dir { width:100%; left:0; top:0}
	.organization_chart .dir > * { padding:10px; }
	.organization_chart .dir > * > span { font-size:14px;}
	.organization_chart .subDepArea {width:100%;height:400px;left:0;top:70px;}
	.organization_chart .subDepArea::before { content:''; display:block; width:1px; height:25px; position:absolute; left:50%; top:-22px; background-color:#d2d2d2; }
	.organization_chart *[class^="tit_dep_"] { width:100%; }
	.organization_chart .tit_dep_1 {}
	.organization_chart .tit_dep_2 {top:60px;}
	.organization_chart .depList {width:100%; margin-top:10px;}
	.organization_chart .depList::before { content:''; display:block; width:1px; height:25px; position:absolute; left:50%; top:55px; background-color:#d2d2d2; }
	.organization_chart .depList > ul > li > * { margin:4px 0; }
	.organization_chart .depList > ul > li > * > span {font-size:13px; line-height:1.25em}
}