/* COLOR CI */
.color_mint {color:#0fb994}
.color_blue {color:#4877bb}
.color_purple {color:#776eaf}
.color_yellow {color:#fba629}
.color_green {color:#659618}

/* 법인소개 */
#corporate{position: relative; padding:270px 100px;;}
#corporate dl{float:left; width:25%; text-align: center; color:#fff;}
#corporate dl dt{font-size:16px; padding-bottom:15px;}
#corporate dl dd{font-size:20px; font-weight: bold; line-height: 30px;}

@media (max-width: 1024px) {
	#corporate{position: relative; padding:270px 50px;}
}


@media (max-width: 800px) {
	#corporate dl{width:50%; margin-bottom:50px;}
	#corporate{padding:100px 50px 500px 50px;}
}

/*인사말*/
#greeting{position: relative;}
#greeting p{padding:93px 0 150px 50px;}
#greeting dl{position: relative;}
#greeting dl dt{float:left; width:35%; color:#000; font-size:28px; font-weight: bold;  letter-spacing: -1px; line-height: 40px;}
#greeting dl dd{float:right; width:60%; }
#greeting dl dd strong{font-size:20px;}
#greeting dd span.intro {font-size:28px; }
#greeting dd div {text-align:right; font-size:25px;}
#greeting dd div span.sign {font-family:'Nanum Pen Script'; font-size:45px;}
@media (max-width: 840px) {
	
	#greeting p{padding:93px 0 150px 50px;}
	#greeting dl dt{float:none; width:100%; padding-bottom:20px;}
	#greeting dl dd{float:none; width:100%; }
}	


@media (max-width: 600px) {
	#greeting{ background:none;}
	#greeting p{display:none;}
	
}	


/*미션 & 비전 */
/*
#mission{position: relative; text-align: center; margin-bottom:100px;}
#mission .title{width:173px; margin:0px auto; background:url(/common/images/sub/mission_bg.jpg) no-repeat 0 0; color:#fff; font-size:20px; height: 66px; line-height: 66px;}
#mission div.box{border:1px solid #d8d8d8; width:550px; color:#e46592; font-size:28px; padding:50px 20px 30px 20px; margin:-10px auto 0; }
*/
#VISION{position: relative;}
#VISION .tit{width:173px; margin:0 auto; margin-bottom:80px; background:url(/common/images/sub/VISION_bg.jpg) no-repeat 0 0; color:#fff; font-size:20px; height: 66px; line-height: 66px; text-align: center;}
#VISION .box{float:left; width:49.5%; padding:210px 0 0 100px; margin-left:1%; background-position:0 0; background-repeat:no-repeat; box-sizing:border-box;}

#VISION .box1{margin-left:0; background-image:url(/common/images/sub/intro_sec3_bg1.jpg);}
#VISION .box2{background-image:url(/common/images/sub/intro_sec3_bg2.jpg);}
#VISION .box3{margin-left:0; background-image:url(/common/images/sub/intro_sec3_bg3.jpg);}
#VISION .box4{background-image:url(/common/images/sub/intro_sec3_bg4.jpg);}
#VISION .box .txt_area{padding:30px 25px 0; background:#fff; text-align:left;}
#VISION .box .txt_area h5{margin-bottom:25px; font-size:24px; font-weight:700; letter-spacing:-0.75px; line-height:30px; color:#556fb5;}
#VISION .box .txt_area p{height:135px; margin-bottom:25px;}

@media (max-width: 1024px) {
	#mission div.box{width:100%; box-sizing:border-box;}
}


@media (max-width: 600px) {
	#VISION .box{float:none; width:100%; margin-left:0px;}
}



.ha{position: relative; background:url(/common/images/sub/ha_bg.png) no-repeat 50% 0;}
.ha li{float:left; width:25%; font-size:18px; text-align: center; color:#666; letter-spacing:-2px;}
.ha li span.icon_bg {background-color: #f5f6fa; width: 150px; height: 150px; display: inline-block; border-radius: 50%;}
.ha li > span.icon_bg > i {line-height:150px;font-size: 60px;color: #97d638;}
.ha li:hover span > i {color: #ff6989;}
.ha li:hover span.icon_bg > i {color:#fff;}
.ha li p {margin-top:10px;}
.ha li span.t{display:block; font-size:30px; color:#333333; font-weight: bold; padding-bottom:10px;}
.ha li.icon_01{background:url(/common/images/sub/icon-a.png) no-repeat 50% 0;}
.ha li.icon_02{background:url(/common/images/sub/icon-b.png) no-repeat 50% 0;}
.ha li.icon_03{background:url(/common/images/sub/icon-c.png) no-repeat 50% 0;}


@media (max-width: 600px) {
	.ha li{float:left; width:100%; margin-bottom:30px;}
}




ol[class^="list_onum"] li{padding-left:22px; margin-top:10px; position:relative;}
ol[class^="list_onum"] >li:before {content: ''; position: absolute; left: 0; top:5px; width:17px; height:17px; line-height:15px; background: #495667; border: 1px solid #495667;border-radius:50%; text-align: center; color: #fff; font-size:10px;box-sizing: border-box;}
ol[class^="list_onum"] >li:nth-child(1):before {content: '1';}
ol[class^="list_onum"] >li:nth-child(2):before {content: '2';}
ol[class^="list_onum"] >li:nth-child(3):before {content: '3';}
ol[class^="list_onum"] >li:nth-child(4):before {content: '4';}


ol[class^="list_onum"] >li.n01:before {content: '1';}
ol[class^="list_onum"] >li.n02:before {content: '2';}
ol[class^="list_onum"] >li.n03:before {content: '3';}
ol[class^="list_onum"] >li.n04:before {content: '4';}

ol[class^="list_onum"] >li >ul li {padding-left:12px;}
ol[class^="list_onum"] >li >ul li:before {content:''; position:absolute; width:7px; height:2px; background:#666; left:0; top:12px; }
ol[class^="list_onum"] >li >ul >li >ul li{padding-left:9px; margin-top:3px;}
ol[class^="list_onum"] >li >ul >li >ul li:before {content:'';  position: absolute; width:3px; height:3px; background:#666; left:0; top:10px; }


#ethics{position: relative; color:#495667; font-weight: bold; padding:105px 0 104px 79px; background:#eef1f4 url(/common/images/sub/ethics_bg.jpg) no-repeat right bottom;}


@media (max-width: 700px) {
	#ethics{padding:80px 50px 500px 50px;}
}



/* 04 오시는길 */
.map{position:relative;}
.map .info_box{position:absolute; bottom:0; left:0; width:calc(100% - 100px); padding:30px 50px; background:#4761a7; z-index:50; text-align: center; color:#fff; font-size:20px; font-weight:500; line-height:1.5em;}




.conts_st02{width:100%; position:relative; margin-top:50px; }
.conts_st02 .part01, .part02{float:left; width:50%; word-break:keep-all; padding-left:115px; box-sizing:border-box; padding-bottom:50px;}
.conts_st02 h4{color:#4761a7; font-size:20px; font-weight: bold; letter-spacing: -0.5px;}
.conts_st02 .part02 .subway > li > span{font-weight:bold;}
.conts_st02 .part02 .subway > li > .line2{color:#1c8f29;}
.conts_st02 .part02 .subway > li > .line3{color:#ad7c29;}

.conts_st02 .part01{ background:url(../img/sub/traffic_subway.png) no-repeat 0 0;}
.conts_st02 .part02{ background:url(../img/sub/traffic_bus.png) no-repeat 0 0;}



@media (max-width: 600px) {
	.conts_st02 .part01, .part02{float:left; width:100%;}
}



#top_box{position:relative; padding:30px 50px 30px 37.62%; border:1px solid #ccc; margin-bottom:30px}
#top_box p.tit{font-size:30px; color:#556fb5; font-weight: bold; padding:0px 0px 30px 50px; border-bottom:1px dotted #ccc; margin-bottom:30px;}
#top_box.bg01{background:url('/common/images/sub/box_01.jpg') no-repeat 0 0;}
#top_box.bg02{background:url('/common/images/sub/box_02.jpg') no-repeat 0 0;}
#top_box .icon01{background:url('/common/images/sub/top_icon_01.jpg') no-repeat 0 13px;}
#top_box .icon02{background:url('/common/images/sub/top_icon_02.jpg') no-repeat 0 13px;}

@media (max-width: 1130px) {
	#top_box{ padding:30px;}
	#top_box.bg01{background:none;}
	#top_box.bg02{background:none;}
}


dl.sub_con{position:relative; margin-bottom:40px;}

dl.sub_con dt{color:#495667; font-weight: bold; font-size:18px; letter-spacing: -1px; padding:0 0 8px 15px;background:url('../img/sub/bul_arr.jpg') no-repeat 0 6px;}
dl.sub_con dd{padding:0 0 20px 17px;}

.s_box{position:relative; padding:15px;text-align: center; background:#f2f2f2;}

.bu1 {background:#f8f8f8; padding:15px 20px;margin:0 0 15px 0;font-size:18px; color:#3f3f3a}
.bu2 {background:#ffffff; padding:15px 20px;margin:0 0 15px 0;font-size:18px; color:#3f3f3a}
.bu2 > span {color:#}
.bu3{background:url(../img/sub/icon_ball2.gif) no-repeat left 10px;padding:0 0 4px 15px;color:#555;font-size:18px;margin-left:8px; line-height:22px;}

/* TAB */
.WB_TabMenu {width:100%; height:29px;/* border-bottom:1px solid #d7d7d7; */margin:20px 0;}
.WB_TabMenu ul {margin:0; padding:0; list-style:none;}
.WB_TabMenu li {float:left; font-size:14px; }
.WB_TabMenu a {padding:10px 50px; border:1px solid #d7d7d7; background:#f8f8f8; text-decoration: none;}
.WB_TabMenu a:hover {}
.Tab_Last a {border-right:1px solid #d7d7d7;}
.WB_TabMenu a.Tab_On {border:1px solid #22b14c; background: #22b14c; font-weight:600; color:#fff}

.image_3_div {padding:30px 0px;}
div.box_30 {width:30%;  margin-right:5%; float:left; border:1px solid #d9d9d9; text-align:center;}
div.box_30:last-child {margin-right:0 !important;}
div.box_30 > img {width:100%; height:auto;}

.supporter {padding:25px; font-size:25px; font-weight:bold; font-family:'Noto Bold'; letter-spacing:-2px; border:10px solid #f1f1f1; margin-bottom:10px; color:#696969;}
.supporter > span {color:#0d8c29}
.tit1{font-size:16px;margin:30px 0 10px 0;font-weight:normal;color:#202020;line-height:129%; background: url(../img/sub/T_Icon.png) 0 4px no-repeat; font-weight: bold; padding-left: 21px; }
.tit {font-family: 'Noto Sans KR', sans-serif;font-size:20px; color:#202020; line-height: 40px; letter-spacing: -1px; padding-left: 20px; background: url(../img/sub/icon_circle.png) no-repeat left center;
}
.tit > span {font-family:'Noto Light';}
.tit > b {color:#5fb5aa}
.corp_txt {font-size: 14px;
    color: #555555;
    margin-top: 20px;}
h2.head_txt {
    color: #333333;
    font-size: 40px;
    font-family: 'Nanum pen Script';
    font-weight: normal;
    display: block;
    }
h2.head_txt .emp_red {color:#e30714;}
/* History */
.row {}
.row:after {display:block;visibility:hidden;clear:both;content:""}
.HistoryYear {float:left; width:100px;}
.HistoryYear h4 {width:60px; margin-bottom:10px; background-color:#888888; color:#fff; font-size:18px; line-height:22px; text-align:center;}
.HistoryDetail {float:left; display:inline-block;}
.HistoryDetail p {margin-bottom:10px; color:#555555; font-size:16px;}
.HistoryDetail p > span {padding-right:10px; font-weight:bold; color:#333; font-size:16px;}
/* HR LINE */
.hr_line {border:0; height:1px; background:#dddddd; margin:15px 0; width:100%; display:block;}

span.step_flow { float:left; display:inline-block; width:300px; text-align:left; margin-bottom:20px;}
span.step_flow span.step_head { display:inline-block; width:280px; background:linear-gradient(45deg, #ff6989, #ff3e69); color:#fff; font-size:18px; padding:5px 0; border-radius:8px 8px 0 0; text-align:center;}
span.step_flow span.step_info { display:inline-block; width:280px; border:1px solid #ddd; border-top:0px; border-radius:0 0 8px 8px; padding:15px 0; font-weight:bold; font-size:16px; text-align:center; min-height:97px; vertical-align: middle; }
span.step_flow span.step_info2 {padding-top:27px;}
span.right_arrow {display:inline-block; width:12px; height:12px; float:left;  margin:-50px 0 0 274px; background:#fff; border-top:1px solid #ddd; border-right:1px solid #ddd; transform: rotate(45deg);}

span.sub_con_view3 {display:inline-block; width:100%; padding:20px 0px 0px 20px; line-height:180%; font-size:15px;}
span.sub_con_view3_in { display:inline-block; width:100%;}
p.section_line {border-top: 1px solid #eee; margin: 20px 0;}

ul.volunteer_kind {margin:0 auto; padding:0;}
ul.volunteer_kind > li {float:left; box-sizing: border-box; display:block; border:5px solid #4774b9; border-radius:50%; text-align:center; width:150px; height:150px; margin-right:15px; margin-bottom:15px;}
ul.volunteer_kind:after {display:block;visibility:hidden;clear:both;content:""}
ul.volunteer_kind > li > i {color:#4774b9; font-size:45px;}
ul.volunteer_kind > li > p {font-size:18px; color:#464646;}

ul.volunteer_info {margin:0 auto; padding:0;}
ul.volunteer_info > li {float:left; box-sizing: border-box; display:block; border:5px solid #4774b9; border-radius:50%; text-align:center; width:150px; height:150px; margin:15px 15px 15px 0;}
ul.volunteer_info:after {display:block;visibility:hidden;clear:both;content:""}
ul.volunteer_info > li > i {color:#4774b9; font-size:45px;}
ul.volunteer_info > li > p {font-size:18px; color:#464646; line-height:17px;}

.history_top {width:120px; height:120px; padding-top:27px; margin:70px auto; line-height:22px; font-size:1.5em; text-align:center; color:#fff;  background:#333; border-radius: 50%; }
.timeline {
	line-height: 1.4em;
	list-style: none;
	margin: 0;
	padding: 0;
	width: 100%;	
}
 .timeline .timeline-item {
	 padding-left: 40px;
	 position: relative;
}
 .timeline .timeline-item:last-child {
	 padding-bottom: 0;
}
 .timeline .timeline-info {
	 font-size: 20pt;
	 font-weight: 700;
	 letter-spacing: 3px;
	 margin-bottom: 20px;
	 text-transform: uppercase;
	 white-space: nowrap;
}
 .timeline .timeline-marker {
	 position: absolute;
	 top: 0;
	 bottom: 0;
	 left: 0;
	 width: 15px;
}
 .timeline .timeline-marker:before {
	 background: #ff6989;
	 border: 2px solid #ff6989 transparent ;
	 border-radius: 100%;
	 content: "";
	 display: block;
	 height: 20px;
	 position: absolute;
	 top: 2px;
	 left: 0px;
	 width: 20px;
	 /*
	 transition: background 0.3s ease-in-out, border 0.3s ease-in-out;
	 */
	 background: transparent;
	 border: 2px solid #ff6989;
}
 .timeline .timeline-marker:after {
	 content: "";
	 width: 2px;
	 background: #efefef;
	 display: block;
	 position: absolute;
	 top: 23px;
	 bottom: 0;
	 left: 9px;
}
 .timeline .timeline-item:last-child .timeline-marker:after {
	 content: none;
}
 .timeline .timeline-item:not(.period):hover .timeline-marker:before {
	 background: transparent;
	 border: 3px solid #ff6989;
}
 .timeline .timeline-content {
	 padding-bottom: 40px;
}
 .timeline .timeline-content p:last-child {
	 margin-bottom: 0;
} 
 .timeline .timeline-title {
	 margin-bottom: 30px;	 
	 font-size: 13pt;
	 letter-spacing:-2px;
	  /*border: 1px solid pink;*/
}
 .timeline .timeline-title span{
	 font-weight: bold;
	 margin-right: 10px;
}
 @media (min-width: 768px) {
	 .timeline .timeline-split .timeline, .timeline .timeline-centered .timeline {
		 display: table;
	}
	 .timeline .timeline-split .timeline-item, .timeline .timeline-centered .timeline-item {
		 display: table-row;
		 padding: 0;
	}
	 .timeline .timeline-split .timeline-info, .timeline .timeline-centered .timeline-info, .timeline .timeline-split .timeline-marker, .timeline .timeline-centered .timeline-marker, .timeline .timeline-split .timeline-content, .timeline .timeline-centered .timeline-content, .timeline .timeline-split .period .timeline-info, .timeline .timeline-centered .period .timeline-info {
		 display: table-cell;
		 vertical-align: top;
	}
	 .timeline .timeline-split .timeline-marker, .timeline .timeline-centered .timeline-marker {
		 position: relative;
	}
	 .timeline .timeline-split .timeline-content, .timeline .timeline-centered .timeline-content {
		 padding-left: 20px;
	}
	 .timeline .timeline-split .timeline-info, .timeline .timeline-centered .timeline-info {
		 padding-right: 15px;
	}

}
 @media (min-width: 992px) {
	 .timeline .timeline-centered, .timeline .timeline-centered .timeline-item, .timeline .timeline-centered .timeline-info, .timeline .timeline-centered .timeline-marker, .timeline .timeline-centered .timeline-content {
		 display: block;
		 margin: 0;
		 padding: 0;
	}
	 .timeline .timeline-centered .timeline-item {
		 padding-bottom: 40px;
		 overflow: hidden;
	}
	 .timeline .timeline-centered .timeline-marker {
		 position: absolute;
		 left: 50%;
		 margin-left: -7.5px;
	}
	 .timeline .timeline-centered .timeline-info, .timeline .timeline-centered .timeline-content {
		 width: 50%;
	}
	 .timeline .timeline-centered > .timeline-item:nth-child(odd) .timeline-info {
		 float: left;
		 text-align: right;
		 padding-right: 30px;
	}
	 .timeline .timeline-centered > .timeline-item:nth-child(odd) .timeline-content {
		 float: right;
		 text-align: left;
		 padding-left: 30px;
	}
	 .timeline .timeline-centered > .timeline-item:nth-child(even) .timeline-info {
		 float: right;
		 text-align: left;
		 padding-left: 30px;
	}
	 .timeline .timeline-centered > .timeline-item:nth-child(even) .timeline-content {
		 float: left;
		 text-align: right;
		 padding-right: 30px;
	}

}

p.love_btn {border:1px solid #4774b9; color:#4774b9 background-color:#fff; padding:10px 15px; margin:20px 10px; text-decoration:none; text-align: center; cursor: pointer; display:inline-block;}
p.love_btn:hover {background-color:#4774b9; color:#fff;}

ul.Yoonli {margin:0; padding:0; font-family:'Nanum Myeongjo'; font-size:19px;} 
ul.Yoonli > li {color:#464646;}
ul.Yoonli > li > span {color:#4774b9; font-weight:bold;}

.vision_title {font-size:25px;}
.vision_title > span {color:#4774b9;}

.service_process {font-size:18px; padding:10px; border:10px solid #e5e5e5;}
.service_process:hover {border:10px solid #91b981;}
.service_process > .thumb-service-process {width:110px; float:left;}
.service_process > .thumb-service-process > img {width:90px; height:auto;}
.service_process > .desc-service-process {float:left;}
.service_process > .desc-service-process > p.title-service-process {font-weight:bold; margin-top:5px;}
.service_process > .desc-service-process > p.desction-service-process {}
p.down-process {color:#bcbcbc;font-size:35px;text-align:center;}

.btn_confirm .btn_submit,
.btn_confirm .btn_close {float:left;height:50px !important;width:49.5%;font-weight:bold;font-size:1.083em}
.btn_confirm {text-align:left}
.btn_confirm .btn_submit {margin-left:1%; text-align: center; line-height: 50px; }

.list_thumb {overflow:hidden;width:100%; font-family: /*'NanumSquareRound', */'Noto Sans KR', sans-serif;}
.list_thumb li {float:left;width:100%;padding:20px 0; border-bottom:1px dashed #e9e9e9;}
.list_thumb .fst {border-top:0 none}
.list_thumb .link_thumb {float:left;width:200px;margin-right:30px;}
.list_thumb .link_thumb > img {width:100%; height:auto; border-radius:50%; border:1px solid #e0e0e0;}
.list_thumb li:hover .link_thumb > img {box-shadow: 0 14px 28px rgba(25,43,57,0.10), 0 10px 10px rgba(25,43,57,0.08);
  transition: all ease .5s;}
.list_thumb .thumb_img {display:block}
.list_thumb .cont_info {overflow:hidden;padding-top:2px}
.list_thumb .tit_subject {display:block;font-size:27px;line-height:30px; margin-bottom:10px;}
.list_thumb .tit_subject .link_tit {color:#333}
.list_thumb .txt_desc {display:block;margin-top:8px;font-size:20px;line-height:22px; margin-bottom:10px;}
.list_thumb .txt_desc .link_txt {color:#666}
.list_thumb .txt_append {display:block;font-size:18px;line-height:21px;color:#999;}
.list_thumb .btn_area {height:45px; margin-top:20px;}
.list_thumb a.popup_btn {border:1px solid #ff6989; color:#ff6989; background-color:#fff; padding:10px 15px; text-decoration:none;}
.list_thumb a.popup_btn:hover {background-color:#ff6989; color:#fff;}
@media (max-width: 1024px) {
.list_thumb .link_thumb {float:left;width:120px;margin-right:10px;}
.list_thumb .link_thumb > img {width:100%; height:auto; border-radius:50%;}
.list_thumb .tit_subject {display:block;font-size:22px;line-height:24px; }
.list_thumb .tit_subject .link_tit {color:#333}
.list_thumb .txt_desc {display:block;margin-top:8px;font-size:18px;line-height:20px}
.list_thumb .txt_desc .link_txt {color:#666}
.list_thumb .txt_append {display:block;margin-top:10px;font-size:16px;line-height:18px;color:#999}
}
.spec{
  width:100%;
  margin: 1em 0;
  display: table;
  border-collapse: collapse;
  border-top: 1px solid #e3e3e3;
  border-bottom: 3px solid #e3e3e3;
}
.spec div{
  display: table-row;
  border-bottom: 1px solid #e3e3e3;
}
.spec dt{
  padding: 1.0em 1.2em;
  font-weight: 700;
  background: #f9f8f7;
  width: 25%;
  display: table-cell;
  font-size: 1em;
}
.spec dt i {
  font-size:20px;
}
.spec dd{
  display: table-cell;
  padding: 0.4em 1.2em;
  vertical-align: middle;
  line-height: 1.8;
  font-size: 1.0em;
}
.spec .exam{
  padding: 0.3em 1.4em;
  font-style: italic;
}
.screw_code .tbl_wrap > table.tbl > thead > tr > td {text-align:center;}
.screw_code .tbl_wrap > table.tbl > tbody > tr > td {text-align:center;}
.screw_code .tbl_wrap > table.tbl > tbody > tr > td > span {color:#e30e1f;}
.vg-select{
  text-align: center;
  background: #f7f8f9;
  margin-top: 1em;
  margin-bottom: 2em;
  border-radius: 1em;
  overflow: hidden;
}
.vg-cate{
  display: inline-block;
  margin: 1em 0;
  margin-right: 1em;
  padding-right: 1em;
  border-right: 1px solid #ccc;
}
.vg-cate:last-child{
  border-right: 0;
  margin-right: 0;
  padding-right: 0;
}
.vg-cate select{
  border: 1px solid #cdcdcd;
  border-radius: 5px;
  padding: 0.3em 0.8em;
}
.vg-para{
  text-align: center;
  margin-bottom: 2em;
}
.spec{
  width:100%;
  margin: 1em 0;
  display: table;
  border-collapse: collapse;
  border-top: 1px solid #e3e3e3;
  border-bottom: 2px solid #e3e3e3;
}
.spec div{
  display: table-row;
  border-bottom: 1px solid #e3e3e3;
}
.spec dt{
  padding: 1.0em 1.2em;
  font-weight: 700;
  background: #f9f8f7;
  width: 15%;
  display: table-cell;
  font-size: 17px;
}
.spec dt i {
  font-size:20px;
}
.spec dd{
  display: table-cell;
  padding: 0.4em 1.2em;
  vertical-align: middle;
  line-height: 1.8;
  font-size: 16px;
}
.spec .exam{
  padding: 0.3em 1.4em;
  font-style: italic;
}