@charset "utf-8";

@import url(content01.css);
@import url(content02.css);
@import url(content03.css);
@import url(content04.css);
@import url(content05.css);

/*******************************************************

	Contents CSS Document
	IEETU Web Standardization Team
	2020-01-10

*******************************************************/

body.open_scroll {overflow:hidden;}


/**************************************************
	테이블
**************************************************/
/* fixed */
table.fixed{table-layout:fixed;}
/* 모바일 테이블 wrap(스크립트에서 class 추가) */
.table_scroll{overflow:auto;}
/* Table */
table.new_tbl {width:100%; margin:10px 0 5px; word-break:keep-all; word-wrap:break-word; border-top:0}
table.new_tbl th,
table.new_tbl td,
table.new_tbl th,
table.new_tbl td{border-bottom:1px solid #ddd; border-right:1px solid #ddd;}
table.new_tbl td:first-child {border-left:0;}
table.new_tbl td:last-child {border-right:0;}
table.new_tbl th{padding:12px 5px; text-align:center; background:#467de1; color:#fff;}
table.new_tbl thead + table.new_tbl tbody th{background:#fcfcfc;}
table.new_tbl td{padding:12px 8px;}
/* Table01 */
.new_tbl01{}
/* Table02 */
.new_tbl02{}


/*인사말*/
.greetings { position:relative;}
.greetings:before{ content:''; display:block; width:359px; height:409px; background:url(../images/content/greetings_img4.png) no-repeat; position:absolute; right:0; top:-40px;}
.greetings > div { position:relative; z-index:2; padding-bottom:20px;}
.greetings > div p { margin:0; font-size:16px; letter-spacing:-1.8px;}
.greetings > div p.txt2 {text-align:right; margin:-20px 70px 0 0;}
.greetings > div p.txt2 strong {font-size:18px;}

/*설립취지*/
.esta_lst {overflow:hidden; margin:0 -15px;}
.esta_lst div {float:left; width:calc(50% - 30px); margin:0 15px 30px; border:1px solid #ddd; padding:38px; height:250px;}
.esta_lst div h3 {text-align:center; font-size:27px; letter-spacing:-2px; margin-bottom:15px; }
.esta_lst div h3:before {content:''; display:inline-block; width:50px; height:50px; background:url(../images/content/esta01.png) no-repeat center center/100%; vertical-align: middle; position:relative; top:-2px; margin-right:6px;}
.esta_lst div.n2 h3:before {background-image:url(../images/content/esta02.png);}
.esta_lst div.n3 h3:before {background-image:url(../images/content/esta03.png);}
.esta_lst div.n4 h3:before {background-image:url(../images/content/esta04.png);}
.esta_lst div ul li {text-align:center; margin-bottom:6px; font-size:16px;}
.esta_lst div ul li:before {content:''; display:inline-block; width:5px; height:5px; border-radius:5px; background:#444; vertical-align:middle; margin-right:4px; position:relative; top:-2px;}
.esta_lst div ul.none li:before {display:none;}


/*연혁*/
.his_lst {position:relative; }
.his_lst > ul {position:relative; z-index:2; margin-top:30px;}
.his_lst > ul:before {content:''; display:block; width:1px;position:absolute; left:110px; top:10px; bottom:50px; background:#ddd;}
.his_lst > ul > li {overflow:hidden; position:relative; padding-left:128px; padding-bottom:40px; padding-bottom:40px;}
.his_lst > ul > li:before {content:''; display:block; width:7px; height:7px; background:#fff; border:4px solid #0db14b; border-radius:50px; position:absolute; left:103px; top:9px;}
.his_lst > ul > li h3 { position:absolute; left:0; top:0; font-size:32px; line-height:1;}
.his_lst > ul > li ul {overflow:hidden; padding:4px 0;}
.his_lst > ul > li strong {float:left; width:108px; font-size:16px; font-weight:normal;}
.his_lst > ul > li span {float:left; width:calc(100% - 108px); font-size:16px; font-weight:bold;}

/*조직도*/
.org_wrap {background:#fafafa url(../images/content/org_bg.png); padding:10px;}
.org2 {position:relative; background:#fff; border:1px solid #e8e8e8; padding:44px 0; margin:0 !important;}
.org2 li {list-style-type:inherit !important; font-weight:bold;}
.org2:before {content:''; display:block; width:1px; height:238px; position:absolute; left:50%; top:44px; background:#d2d2d2;}
.org2 .n1 {width:180px; height:54px; line-height:52px; border:1px solid #044098;  border-radius:1px;  margin:0 auto 40px; text-align:center; background:#044098 url(../images/content/org_gra.png) repeat-x left 33px; color:#fff; font-size:17px; position:relative; z-index:2;}
.org2 .n1:after {content:''; display:block; width:314px; height:1px; background:#d2d2d2; position:absolute; left:50%; margin-left:-157px; top:168px;}
.org2 .n2 { width:180px; height:54px; border:1px solid #1e60c1; line-height:52px; margin:0 auto 40px; text-align:center; color:#fff; background:#1e60c1 url(../images/content/org_gra.png) repeat-x left 33px; font-size:17px; border-radius:1px; position:relative; z-index:2; }
.org2 .n3 { position:absolute; left:0; top:187px; right:0; text-align:center; z-index:2;}
.org2 .n3 span {display:inline-block; background:#fff url(../images/content/org_gra.png) repeat-x left 35px; width:160px; height:50px; border:2px solid #999; line-height:46px; font-size:17px; border-radius:1px; margin:0 140px; position:relative; letter-spacing:-1.2px; color:#666;}
.org2 .n3 span:first-child {margin-left:0;}
.org2 .n3 span:last-child {margin-right:0;}
.org2 .n4 {display:block; width:180px; height:54px;  background:#4478c5 url(../images/content/org_gra.png) repeat-x left 33px; border:1px solid #4478c5; color:#fff; line-height:52px; font-size:17px; border-radius:1px; text-align:center; margin:0 auto 0; position:relative; letter-spacing:-1.2px; }


/*찾아오시는길*/
.loc_lst { background:#f1f1f1; padding:30px 0px; overflow:hidden; position:relative;}
.loc_lst li {float:left; width:33.333333%; position:relative; border-right:1px dashed #e2e2e2;}
.loc_lst li:last-child {border-right:0;}
.loc_lst li > strong { font-size:20px;  display:block; height:44px; line-height:44px;  text-align:center; margin-bottom:10px;}
.loc_lst li > strong:before { content:''; display:inline-block; width:44px; height:44px; background:url(../images/content/location01.png) no-repeat; margin-right:6px; vertical-align: top;}
.loc_lst li.n2 > strong:before { background-image:url(../images/content/location02.png);}
.loc_lst li.n3 > strong:before { background-image:url(../images/content/location03.png);}
.loc_lst li span {font-size:16px;  display:block; text-align:center; padding:0 30px;}
.loc_lst li.n2 span:before {content:''; display:inline-block; width:6px; height:6px; background:#888; border-radius:6px; vertical-align:middle; margin-right:5px; position:relative; top:-1px;}

/*장학사업 신청방법*/
.chart01 {overflow:hidden; margin:0 -20px;}
.chart01 li {float:left; width:calc(25% - 40px); margin:0 20px; border:1px solid #d8d8d8;  height:110px; position:relative;}
.chart01 li:before {content:''; display:block; width:7px; height:11px; background:url(../images/content/chart_cursor.png) no-repeat; position:absolute; right:-25px; top:50%; margin-top:-6px;}
.chart01 li:last-child:before {display:none;}
.chart01 li strong {display:block; margin:-1px -1px 0 -1px; line-height:39px; font-size:16px;  background:#3589d4; color:#fff; text-align:center;}
.chart01 li span {text-align:center; display:block; padding-top:23px;}
.chart01 li:nth-child(3) span {padding-top:11px;}

/*사이트맵*/
.cont_sitemap { overflow:hidden; margin:0 -1.2%;}
.cont_sitemap .gnb_left , .cont_sitemap .daegu12 {display:none;}
.cont_sitemap > li {float:left; width:30.9%; margin:0 1.2%; background:#fafafa; padding:20px 20px 15px 20px; margin-bottom:26px; box-sizing:border-box;}
.cont_sitemap > li:nth-child(3n + 1) {clear:left;}
.cont_sitemap > li > a {display:block; height:54px; line-height:54px; color:#005aaa; background:#3270cf url(../images/content/sitemap_bg.png) no-repeat center center/cover; background:#fff; text-align:center; font-size:19px; font-weight:bold; margin:-20px -20px 10px -20px; border:1px solid #005aaa;}
.cont_sitemap > li .area_head {display:none;}

.cont_sitemap > li ul li a {display:block; padding:7px 0 7px 13px; position:relative; border-bottom:1px dashed #d1d4dd; position:relative; color:#222; font-size:16px;}
.cont_sitemap > li ul li:last-child a {border-bottom:none;}
.cont_sitemap > li ul li a:before {content:''; display:block; width:4px; height:4px; background:#61646c; border-radius:4px; position:absolute; left:0; top:18px;}
.cont_sitemap > li > div > a {display:none;}
.cont_sitemap > li ul li ul { background:#fff; padding:15px 15px 12px 15px; border:1px solid #ddd; position:relative; margin-top:-2px; margin-bottom:10px;}
.cont_sitemap > li ul li ul li a {border:0; padding:0 0 3px 10px; font-size:14px; color:#666;}
.cont_sitemap > li ul li ul li a:before {content:'-'; width:auto; height:auto; background:none; border-radius:0; top:-1px;  }


/*후원참여*/
.huwon {border-top:1px solid #d5d5d5;}
.huwon > div {overflow:hidden; border-bottom:1px solid #d5d5d5;}
.huwon > div h2 {float:left; width:270px; height:170px; text-align:center; padding:25px 0; font-size:20px; background:#e6fbf1;}
.huwon > div h2:after {content:''; display:block; width:76px; height:76px; background:url(../images/content/huwon01.png) no-repeat; margin:10px auto 0;}
.huwon > div.n2 h2:after {background-image:url(../images/content/huwon02.png);}
.huwon > div.n3 h2:after {background-image:url(../images/content/huwon03.png);}
.huwon > div.n4 h2:after {background-image:url(../images/content/huwon04.png);}
.huwon > div ul {float:left; width:calc(100% - 270px); height:170px; padding:33px 25px; margin:0;}
.huwon > div ul li { position:relative;}
.huwon > div ul li:before {content:''; display:inline-block; width:7px; height:2px; background:#888; vertical-align:middle; position:relative; top:-2px; margin-right:7px;}
.huwon > div.n3 li:before {display:none;}
.huwon > div.n3 li img {vertical-align: middle; margin-right:6px;}
.huwon > div.n2 h2 , .huwon > div.n4 h2 {background:#f1f1f1;}

/*후원금액현황*/
.donation_td {background:#f4f8ff; padding:20px 10px !important;}
.donation_td span {display:inline-block; padding:0 10px;}
.donation_td span:before {content:''; display:inline-block; width:42px; height:42px; background:url(../images/content/dona_icon01.png) no-repeat; margin-right:5px; vertical-align:middle;}
.donation_td span:last-child:before {background-image:url(../images/content/dona_icon02.png);}
.donation_td span strong {font-size:24px; color:#ee1d49; display:inline-block; position:relative; top:2px;}



/*******************************************************
	진로.진학지원사업
*******************************************************/

.jinro01 {padding:40px 30px 30px; margin: 0 auto; background:#ddeefa url("/cmsh/dsjanghak.or.kr/images/content/jinro01_top.gif") no-repeat center 0; }
.jinro01 .tit {padding-bottom: 0px; text-align: center;}
.jinro01 .box {width: 100%; padding: 20px 0;  border-radius:10px; background: #fff;}
.jinro01 .box ul {overflow: hidden;}
.jinro01 .box ul li {float: left; width: 50%; padding: 0 10px; text-align: center; line-height: 2.1em; letter-spacing: -0.04em; word-break:keep-all;}
.jinro01 .box ul li + li {border-left: 1px solid #d9d9d9;}
.jinro01 .box ul li img {}
.jinro01 .box ul li p {font-size: 20px; margin: 0;}
.jinro01 .subSlogan {margin-top: 20px; padding: 0; font-size: 1.5em; font-weight: bold; letter-spacing: -0.02em; text-align: center; }
.jinro01 .subSlogan strong {font-size: 1.2em; color: #0066b0;}
.jinro01 li em {color: #d81273;}

.jinro02 {padding: 40px; margin-bottom: 30px; background: #ddeefa; text-align: center;}
.jinro02 .tit {width: 100%; padding-bottom: 20px; border-bottom: 1px solid #aed6f2;}
.jinro02 ul {overflow: hidden; width: 100%;}
.jinro02 ul li {float: left; width: 31.3%; padding: 40px 0; background: #fff;}
.jinro02 ul li + li {margin-left: 3%;}
.jinro02 ul li img {}
.jinro02 ul li p {margin-bottom: 10px; padding-top: 15px; font-weight: bold; color: #0066b0; font-size: 24px; }
.jinro02 ul li strong {display: block; line-height: 1; font-size: 22px; color: #023961;}
.jinro02 ul li span {color: #023961; font-size: 18px; letter-spacing: -0.02em;}

.jinro03 {background: #e4f1fd; padding: 0 40px 40px;}
.jinro03 .top {text-align: center;}
.jinro03 .box {background: #fff; width: 100%; }
.jinro03 .box p {margin: 0; background: #0059a9; color: #fff; text-align: center; font-size: 24px; font-weight: bold; line-height: 54px;}
.jinro03 .box ul {overflow: hidden; padding: 40px 0;}
.jinro03 .box ul li {float: left; overflow: hidden; width: 50%; padding: 0 90px;  text-align: center;word-break:keep-all;} 
.jinro03 .box ul li + li {border-left: 1px solid #d9d9d9;}
.jinro03 .box ul li img {}
.jinro03 .box ul li span {display: block; margin-top: 20px; line-height: 1.4; font-size: 22px; color: #353432; letter-spacing: -0.02em;}
.jinro03 .box ul li span em {font-weight: bold;}


.jinro04 {background: #e4f1fd; padding: 0 40px 40px;}
.jinro04 .top {text-align: center;}
.jinro04 .box {background: #fff; width: 100%; }
.jinro04 .box p {margin: 0; background: #0059a9; color: #fff; text-align: center; font-size: 24px; font-weight: bold; line-height: 54px;}
.jinro04 .box ul  {overflow: hidden; padding: 40px 0;}
.jinro04 .box ul li {float: left; overflow: hidden; width: 33%; padding: 0 44px;  text-align: center; word-break:keep-all;} 
.jinro04 .box ul li + li {border-left: 1px solid #d9d9d9;}
.jinro04 .box ul li img {}
.jinro04 .box ul li span {display: block; margin-top:20px; line-height: 1.4; font-size: 22px; color: #353432; letter-spacing: -0.02em;}
.jinro04 .box ul li span em {font-weight: bold;}

/*******************************************************
	반응형설정
*******************************************************/
/* 00. Tablet 1023px ~ 1216px */
@media screen and (max-width:1259px){
	.root_daum_roughmap {width:100% !important;}
	
}


/* 01. Tablet 768px ~ 1023px */
@media screen and (max-width:1023px){

	.loc_lst li span br {display:none;}


}

/* 02. Mobile 830px */
@media screen and (max-width:830px){
/*인사말*/
	.greetings:before {top:inherit; right:-50px; bottom:-50px; transform: scale(0.75);}
	.greetings > div {width:66%; margin-top:0;}
	.greetings > div p.txt2 {text-align:left; margin:30px 0 0;}
	
/*설립취지*/
	.esta_lst {margin:0;}
	.esta_lst div {width:auto; float:none; margin:0; margin-bottom:15px; height:auto; min-height:150px; padding-bottom:30px;}
	
/*연혁*/
	.his_lst > ul:before { left:7px; top:25px;}
	.his_lst > ul > li {padding-left:10px;}
	.his_lst > ul > li h3 {position:inherit; left:inherit; top:inherit; margin-left:10px; margin-bottom:20px; }
	.his_lst > ul > li:before {left:0px; top:12px; transform:scale(0.75);}
	.his_lst > ul > li ul {padding:0 0 0 12px;}
	.his_lst > ul > li strong {width:90px;}
	.his_lst > ul > li span {width:calc(100% - 90px);}
	.his_lst > ul > li ul li { margin-bottom:4px; overflow:hidden;}
	.cont_sitemap > li {width:47.6%;}
	.cont_sitemap > li:nth-child(3n + 1) {clear:inherit;}
}

/* 02. Mobile 640px ~ 767px */
@media screen and (max-width:767px){
	
	.org2:before {height:200px;}
	.org2 .n1:after {top:139px;}
	.org2 .n1 , .org2 .n2 , .org2 .n4 { width:120px; height:40px; line-height:40px; font-size:15px;}
	.org2 .n3 { top:164px;}
	.org2 .n3 span {width:120px; height:40px; line-height:36px; font-size:15px; margin:0 70px;}
	
	/*오시는길*/
	.root_daum_roughmap .wrap_map { height:300px !important;}
	.loc_lst {padding-bottom:40px;}
	.loc_lst li span br {display:block;}
	.loc_lst li {float:none; width:auto; margin-bottom:30px; padding-bottom:30px; border-right:0; border-bottom:1px dashed #e2e2e2;}
	.loc_lst li:last-child {border-bottom:0; padding-bottom:0; margin-bottom:0;}
	
	.chart01 {margin:0;}
	.chart01 li {float:none; width:auto; margin:0 0 30px;}
	.chart01 li:before {right:50%; margin-right:-4px; top:inherit; margin-top:inherit; bottom:-20px; transform:rotate(90deg);}
	

	
}
@media screen and (max-width:840px){
	.huwon > div {padding:15px 0;}
	.huwon > div h2 {float:none; width:auto; height:auto; background:none !important; text-align:left; font-size:19px; color:#005aaa; padding:0; padding-bottom:12px;}
	.huwon > div h2:after {display:none;}
	.huwon > div ul {width:auto; float:none; padding:0; padding-left:10px; height:auto;}
}
 
/* 03. Mobile 320px ~ 639px */
@media screen and (max-width:639px){
	
	.cont_sitemap > li {width:97.6%;}
	
	.greetings > div {width:auto;}
	.greetings .txt1 strong br {display:none;} 
	.greetings:before {transform: scale(0.5); right:-100px; bottom:-100px;}
}


@media screen and (max-width:440px){
.greetings img {float:none; width:100%;}	
.greetings > div {width:auto; float:none; margin-top:20px;}	
	
	.root_daum_roughmap .wrap_map { height:220px !important;}
	
	.org2 .n1:after { width:240px; margin-left:-120px;}
	.org2 .n1 , .org2 .n2 , .org2 .n4 {width:90px;}
	.org2 .n3 span {width:80px; margin:0 52px;}

	
}

@media screen and (max-width:400px){
}