@charset "utf-8";

* { font-family: 'Noto Sans KR', sans-serif !important; }

#_contentBuilder * { word-break: keep-all; }

/**[board input button]********************************************************/
._button._active input, ._button._active a {
  	background-color: #d84a38;
  	font-size: 1.4em;
}
._button._large input, ._button._large a {
  	font-size: 1.4em;
}

/**[common]********************************************************/
.marT5 { margin-top: 5px; }
.marT10 { margin-top: 10px; }
.marT20 { margin-top: 20px !important; }
.marT30 { margin-top: 30px; }
.padL10 { padding-left: 10px; }
.alignL { text-align: left !important; }
.alignR { text-align: right; }
.alignC { text-align: center; }
.fItalic { font-style:  italic; }

.red { color: #d91c33; }
.green { color: #006640; }
.blue { color: #0000ff; }

.bigP { color: #d91c33; font-size: 22px; }
.box01 { padding: 20px 25px; border: 1px solid #e1e1e1; background: #f8f8f8; }
.box02 { background-color: #f5f5f5; border-top: 2px solid #d2d2d2; padding: 30px; }
.box03 {padding: 10px; margin: 10px 0;background: url(/sites/english/images/bg_down.png) repeat left top;}
.box03 .text {background: #fff;padding: 20px;color: #2861af; font-size: 17px; }

body.sub ._contentBuilder ._obj._objHeading .objHeading_h2 { line-height: 40px; font-size: 30px; color: #d91c33; font-weight: 400; background: none !important; padding-left: 0 !important; }
body.sub ._contentBuilder ._obj._objHtml ul li { margin-top: 0 !important; }
body.sub ._contentBuilder ._obj._objHtml ul.list li { padding-left: 16px; position: relative; }
body.sub ._contentBuilder ._obj._objHtml ul.list li:before { content: ""; position: absolute; left: 0; top: 50%; width: 5px; height: 5px; background: #dcdcdc; border-radius: 50%; margin-top: -3px; }

/**[table]*********************************************************/
.p_tbl { width:100%; position:relative; }
.tbl_list.w{ border-collapse: collapse; border-spacing: 0; width:100%; border-top:2px solid #e12735;  overflow:auto; }
.tbl_list.w tr th,
.tbl_list.w tr td{ line-height:24px; padding:15px 5px; box-sizing:content-box;text-align: center; border-bottom:1px solid #c8caca; word-break:keep-all;  font-size:18px; color:#5d625e;}
.tbl_list.w tr th { font-weight:500; background:#fafafa; position:relative;}
.tbl_list.w tr th + th:before{content:""; position:absolute; left:0; top:50%; width:1px; height:18px; margin-top:-9px; background:#b5b5b5;}
.tbl_list.w tr > td:first-child,
.tbl_list.w tr > td:first-child{background:#fcf5f5;}

.tbl_list.w tr .bg{background:#fcf5f5 !important;}
.tbl_list.w tr .bgw{background:#fff !important;}

._contentBuilder ._obj._objHtml table, ._contentBuilder ._obj._objTag table {
  border-collapse: collapse; border-spacing: 0; width:100%; 
  border-top:2px solid #e12735 !important; border-left-width: 0 !important;
  overflow:auto; 
}
._contentBuilder ._obj._objHtml table th, ._contentBuilder ._obj._objHtml table td,
._contentBuilder ._obj._objTag table th, ._contentBuilder ._obj._objTag table td {
  line-height:24px; padding:15px 5px !important;
  box-sizing:content-box; border-bottom:1px solid #c8caca !important;
  word-break:keep-all; color:#5d625e;
  border-width: 0 0 1px 0 !important;
}
._contentBuilder ._obj._objHtml table tr th { font-weight:500; background:#fafafa; position:relative;}
._contentBuilder ._obj._objHtml table tr th + th:before{content:""; position:absolute; left:0; top:50%; width:1px; height:18px; margin-top:-9px; background:#b5b5b5;}
._contentBuilder ._obj._objHtml table td:first-child{background:#fcf5f5;}

._contentBuilder ._obj._objHtml table tr .bg{background:#fcf5f5 !important;}

@media all and (max-width:860px) {
  .p_tbl { padding-top:60px; }
  .p_tbl:before{content:"좌우로 스크롤하시면"'\a'"표의 전체 내용이 보입니다.";white-space: pre;  position:absolute; left:50%; top:0; width:250px; margin-left:-125px; padding:0; line-height:20px; font-size: 13px; color: #8f8f8f; text-align:center; z-index:3; z-index:10; background:url(/sites/hkplus/images/tbl_arr.jpg) center no-repeat; background-size:90% auto;}
  .p_tbl:after{ content:""; position:absolute; left:50%; top:5px; margin-left:-20%;width:41px; height:30px;background:url(../images/page/tit_cur.png) center no-repeat; background-size:auto 30px; vertical-align:middle;}
  .p_tbl .scr{ overflow:auto; }
  ._contentBuilder ._obj._objHtml table, ._contentBuilder ._obj._objTag table { width:940px; }
  ._contentBuilder ._obj._objHtml table th, ._contentBuilder ._obj._objHtml table td,
  ._contentBuilder ._obj._objTag table th, ._contentBuilder ._obj._objTag table td {
	line-height:20px; padding:10px 5px;
  }
}

/**[MAIN]********************************************************/
/* 다단요소 default */
.multipleDiv .multipleContentsDiv{
  position: relative;
  margin: 0 auto;
}

/* 비주얼 문구 */
#multipleDiv_hkplus_90 { position: absolute; left: 0; }

.visualTxt h2 { font-size: 46px; font-weight: 700; color: #fff; text-shadow: 0px 2px 5px rgba(0,0,0,.8); animation: fadeInText 2s 0s ease-out forwards; opacity: 0; }
.visualTxt h3 { font-size: 27px; font-weight: 300; color: #fff; text-shadow: 0px 2px 5px rgba(0,0,0,.8); animation: fadeInText 2s 0s ease-out forwards; opacity: 0; }
.visualTxt h3 span { font-weight: 600; }
.visualTxt p { font-size: 18px; font-weight: 400; color: #fff; text-shadow: 0px 2px 5px rgba(0,0,0,.8); padding-top: 20px; animation: text1 3s 2s ease backwards;   }

@keyframes fadeInText {
    100% {
        opacity: 1;
    }
}
@keyframes text1 {
    from { /* 시작 */
	  	opacity: 0;
	  	transform: translate(0, -50px);
    }
	to {
	  	opacity: 1;
		transform: translate(0, 0);
	}
}

/* 일반 게시판 */
#multipleContentsDiv_hkplus_139 { border-bottom: 1px solid #000; padding-bottom: 15px; } /* 게시판 하단 라인 */
.boardTxt h3 { font-size: 40px; font-weight: bold; text-align: center; padding: 50px 0 40px; border-bottom: #333 solid 3px; }

/* 오른쪽 일반게시판 */
#recentBbsArtclTab_127_213, #recentBbsArtclTab_127_215 { font-size: 20px; }
/* #recentBbsArtcl_127 li ul { top: 60px;} */


/* 활동 아카이브 */
#multipleDiv_hkplus_468 { background-image: url(/sites/hkplus/images/bg_archive.jpg); background-position: center top; background-repeat: no-repeat; }
.posterTxt h3 {
  font-size: 40px; font-weight: bold; text-align: center; color: #fff; padding: 50px 0 40px; margin-bottom: 10px;
  background-image: url(/sites/hkplus/images/sep_archive.png); background-position: center bottom; background-repeat: no-repeat;
}

/* 배너 */
#multipleDiv_hkplus_175 { background: #f1f1f1; padding: 30px 0; }

/**[SUB]********************************************************/
/* 목록형 게시판 글자 크기 조절 */
#_contentBuilder ._fnctWrap .artclSerch,
#_contentBuilder ._fnctWrap .artclHorNum1,
#_contentBuilder ._fnctWrap ._pageing,
#_contentBuilder ._fnctWrap .artclView
{ font-size: 1.2em; }

/* 모든 게시판 사진 */
@media all and (max-width:860px) {
  ._articleAlbum .artclView img { width: 100% !important; height: auto !important; }
}

/* 인사말 */
.greeting h3 { font-size: 30px; color: #d91c33; padding-bottom: 20px; font-weight: 400; }
.greeting p.subTxt { display: block; line-height: 35px; font-size: 18px; color: #d91c33; }
.greeting p { padding-bottom: 20px; }
.greeting .sign:before { content: ""; position: absolute; left: 3px; width: 1px; height: 82px; top: 0; background: #cecece; }
.greeting .sign { 
    padding-top: 96px; position: relative;
  	display: block; line-height: 31px; font-size: 18px; color: #d91c33; padding-bottom: 20px; 
}
.greeting .sign span { line-height: 52px; font-size: 20px; color: #333; letter-spacing: 5px; display: block; }

/* 아젠다 */
.vision{ display:block;}
.vision li{display:inline-block; padding:0; vertical-align:top}
.vision li+li{padding-left:98px; position:relative;}
.vision li+li:before{content:""; position:absolute; left:0; top:50%; margin-top:-54px; background:url(/sites/hkplus/images/vision_arr.jpg) no-repeat; width:90px; height:108px;}
.vision li .box{margin:0 auto; height:220px;}
.vision li.t1 .box{ width:163px;}
.vision li.t1 .box > strong{display:table; border-radius:50%; width:157px; line-height:157px; height:157px; box-sizing:content-box; border:3px solid #d91c33; font-weight:400;}
.vision li.t1 .box > strong span{display:table-cell; line-height:31px; font-size:20px; color:#d91c33; vertical-align:middle; word-break:keep-all; text-align:center; font-weight:500;}
.vision li.t1 .box > span{display:block; line-height:57px; font-size:20px; color:#575757; text-align:center;}
.vision li.t2 .box{width:400px;}
.vision li.t2 .box .top{text-align:center; padding:8px 0; width:290px; display:block;position:relative; margin:0 auto 14px auto;}
.vision li.t2 .box .top:before{ content:""; position:absolute; left:0; top:0; width:25px; height:100%; box-sizing:border-box; border:3px solid #d91c33; border-right:none;}
.vision li.t2 .box .top:after{content:""; position:absolute; right:0; top:0; width:25px; height:100%; box-sizing:border-box; border:3px solid #d91c33; border-left:none;}
.vision li.t2 .box .top strong{display:block; line-height:36px; font-size:25px; font-weight:700; color:#d91c33;}
.vision li.t2 .box .top span{display:block; text-align:center; line-height:27px; font-size:18px; color:#6e6e6e; letter-spacing:-1px;}
.vision li.t2 .box > dl{position:relative; padding:8px 0 8px 140px;}
.vision li.t2 .box > dl dt{position:absolute; left:0; top:50%; margin-top:-20px;}
.vision li.t2 .box > dl dt strong{display:inline-block; line-height:39px; padding:0 25px; font-size:17px; text-align:center;color:#fff; background:#666; border-radius:20px; font-weight:500; letter-spacing:-1px;}
.vision li.t2 .box > dl dt.bg2 strong{background:#666;}
.vision li.t2 .box > dl dd{display:list-item; list-style:none; padding-left:12px; line-height:24px; font-size:16px; color:#949494; position:relative;}
.vision li.t2 .box > dl dd:before{content:""; position:absolute; left:0; top:50%;  width:4px; height:4px; background:#999; margin-top:-2px; border-radius:50%;}
.vision li.t3 .box{width:170px;}
.vision li.t3 .box .info{ display:table;width:170px; height:170px; background:#d91c33; border-radius:50%; background-size:100% auto;}
.vision li.t3 .box .info > span{display:table-cell; line-height:35px; font-size:22px; color:#fff; vertical-align:middle; word-break:keep-all; text-align:center; font-weight:500;}

.vision_box{display:block; box-sizing:content-box; border:6px solid #e6e6e6; padding:55px 540px 45px 60px; min-height:245px; position:relative;text-align: left;}
.vision_box:before{content:""; position:absolute; left:0; top:84px; width:40px; height:6px; background:#e6e6e6;}
.vision_box .tit{display:block; line-height:35px; font-size:24px; color:#5d5d5d;/*font-family: 'Noto Serif KR';*/ padding-bottom:26px; font-weight:400; letter-spacing:-1px;}
.vision_box .txt{display:block; width:82%; line-height:31px; font-size:18px; color:#8b8b8b; word-break:keep-all;}
.vision_box .img{position:absolute; right:70px; top:50px; width:450px; height:auto;}

@media all and (max-width:860px) {
  .vision li{padding:0; display:list-item; list-style:none;}
  .vision li .box{height:auto;}
  .vision li+li{padding-left:0; padding-top:80px;}
  .vision li+li:before{ -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); transform: rotate(90deg); left:50%; top:10px; margin-top:0; margin-left:-25px; width:50px; height:60px;background-size:100% auto;}
  .vision li.t1 .box{width:136px;}
  .vision li.t1 .box > strong{width:130px; height:130px; line-height:130px;}
  .vision li.t1 .box > strong span{line-height:25px; font-size:17px;}
  .vision li.t1 .box > span{line-height:40px; font-size:17px;}
  .vision li.t2 .box{width:auto;}
  .vision li.t2 .box .top{width:250px;}
  .vision li.t2 .box .top strong{line-height:30px; font-size:20px;}
  .vision li.t2 .box .top span{font-size:16px;}
  .vision li.t2 .box > dl{position:relative; padding:0; width:270px; margin:20px auto 0 auto;}
  .vision li.t2 .box > dl dt{position:relative; left:0; top:0; margin:0 0 10px 0; text-align:center;}
  .vision li.t2 .box > dl dd{line-height:23px; font-size:14px;}
  .vision li.t3 .box{width:130px;}
  .vision li.t3 .box .info{width:130px; height:130px;}
  .vision li.t3 .box .info > span{line-height:25px; font-size:17px;}

  .vision_box{padding:30px 0 30px 10%;}
  .vision_box:before{top:60px; width:8%;}
  .vision_box .tit{font-size:18px; line-height:30px;}
  .vision_box .txt{font-size:15px; line-height:25px; width:100%; margin-bottom: 30px;}
  .vision_box .img{position:relative; right:auto; top:auto; width:90%;}
}

/* 조직도 */
.team{ display:block; }
.team .tlist { border-top:2px solid #e12735; width:100%; margin-bottom:50px; overflow:auto; padding-left: 0 !important; background-image: none !important; }
.team .tlist li { display:inline-block; float:left; border-bottom:1px solid #c8caca;}
.team .tlist li .box{display:block; position:relative; padding:0 0 0 190px; height:58px;}
.team .tlist li .box strong{ position:absolute; left:0; top:0;padding-left:25px; width:220px; box-sizing:content-box; line-height:58px; background:#fcf5f5; color:#5d625e; font-weight:500;}
.team .tlist li .box span{display:block; line-height:58px; padding-right:30px; color:#5d625e; text-align:right;}

@media all and (max-width:860px) {
  .team .tlist li { float:none; display:list-item; list-style:none; width: 100%; }
  .team .tlist li .box{ height:auto; padding:0 0 0 120px; }
  .team .tlist li .box strong{ line-height:40px; padding-left:15px; width:225px; position:absolute; left:0; top:0; bottom:0; }
  .team .tlist li .box span{ line-height:20px; padding:10px 15px 10px 0; }
  .team .tlist li .box span em{ display:block; line-height:20px; padding-left:10%; }
}

.org .tbox{ margin-left:11px; margin-bottom:50px; width:917px; height:312px; position:relative; background:url(/sites/hkplus/images/org_toPC.jpg) 0 0 no-repeat;}
.org .tbox .point{position:absolute; left:2px; top:0; width:116px; line-height:35px; padding:35px; box-sizing:content-box; text-align:center; font-size:24px; color:#d91c33; font-weight:700; border:4px solid #d91c33; border-radius:50%; background: #fff;}
.org .tbox dl{width:280px;}
.org .tbox dl dt{display:list-item; list-style:none; line-height:58px; text-align:center; font-size:18px; color:#fff; background:#d91c33; font-weight:500;}
.org .tbox dl dd{display:list-item; list-style:none; line-height:58px; text-align:center; font-size:18px; color:#d91c33; background:#e7e6e6;font-weight:500;}
.org .tbox dl dd + dd{margin-top:9px;}
.org .tbox dl.t1{position:absolute; left:280px; bottom:0;}
.org .tbox dl.t2{position:absolute; left:280px; top:50px; padding-left:358px;}
.org .tbox dl.t2 dt{position:absolute; left:0; top:0; width:280px;}

@media all and (max-width:860px) {
  .org .tbox{margin:0 auto;width:300px;height:450px;background-position:center top;background: url(/sites/hkplus/images/org_toM.jpg) 0 30px no-repeat;background-size:100% auto;}
  .org .tbox .point{width:100px; height:60px; line-height:19px; font-size:17px; left:50%; margin-left:-83px;}
  .org .tbox dl{width:140px;}
  .org .tbox dl dt,
  .org .tbox dl dd{line-height:24px; font-size:15px; padding: 5px 0;}
  .org .tbox dl.t1{left:0; bottom:auto; top:180px;}
  .org .tbox dl.t2{left:auto; padding-left:0; right:0; top:180px;}
  .org .tbox dl.t2 dt{ position:relative;width:140px; margin-bottom:30px;}
}

/* 찾아오시는 길 */
.location .location_itr{ padding: 0 410px 0 0;position:relative; }
.location .location_itr strong{ display:block;line-height:48px;color:#d91c33;font-weight:400;padding-bottom: 102px;position: relative; text-align: left; }
.location .location_itr strong:after { content: "";position: absolute;left: 3px;width: 1px;height: 65px;bottom: 14px;background: #cecece; }
.location .location_itr span{ display:block;line-height: 34px;color:#38383a;letter-spacing:-1px; }
.location .location_img img{ width:auto;height: 300px;position:absolute;right:0;top:0; }
/*.location .location_itr .map{width:1072px !important; height:300px; margin-top:50px;} */
.root_daum_roughmap .wrap_controllers { display: none; }

@media all and (max-width:860px) {
  .location{padding-top:0;}
  .location .location_itr{padding:0 0 0 0;}
  .location .location_itr > strong{ line-height: 35px; font-size: 1.6em; }
  .location .location_img img{position:relative; width:100%;}
  .location .location_itr > span{line-height: 37px; margin-bottom:20px; font-size: 1.0em; }
}

/* 협력기관 */
.agency{display:block;}
.agency .tlist{border-top:2px solid #e12735; width:100%; margin-bottom:50px; overflow:auto;}
.agency .tlist li{ display:list-item; list-style:none; border-bottom:1px solid #c8caca;}
.agency .tlist li .box{display:block; position:relative; padding:13px 0 13px 170px; min-height:32px;}
.agency .tlist li .box strong{ position:absolute; left:0; top:0; bottom:0;padding:13px 0; width:170px; box-sizing:content-box; line-height:32px; background:#fcf5f5; color:#5d625e; font-weight:500; text-align:center;}
.agency .tlist li .box span{display:block; line-height:32px; padding:0 25px; color:#5d625e; word-break:keep-all; text-align: left; }

@media all and (max-width:860px) {
  .agency .tlist li{float:none; display:list-item; list-style:none; width:100%;}
  .agency .tlist li .box{height:auto; padding:0 0 0 100px;}
  .agency .tlist li .box strong{line-height:24px; padding:10px 0; box-sizing:content-box;width:100px; position:absolute; left:0; top:0; bottom:0;}
  .agency .tlist li .box span{line-height:24px; padding:10px 15px; box-sizing:content-box; min-height:24px; }
}