/*@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);*/

@charset 'utf-8";
@font-face {
 font-family: "NanumBarunGothic";
 src: url("../font/NanumBarunGothic.eot");
 src: local("☺"),  url("../font/NanumBarunGothic.woff") format("woff");
}
/*@font-face { 
 font-family: "NanumMyeongjo";
 src: url("../font/NanumMyeongjo.eot");
 src: local("☺"),  url("../font/NanumMyeongjo.woff") format("woff");
}*/

/*** Base Style ***/
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select{margin:0;padding:0; border: 0; font-size: 100%;}
html,body{font-family:'NanumBarunGothic', 'Malgun Gothic', Dotum, Gulim, Arial, Sans-serif; color:#434343;letter-spacing:0;}
em{font-style:normal;}
p {line-height:160%;background-image:url('');}
a {text-decoration:none;}
ul,ol,li,dl,dt,dd {list-style:none;}
caption,legend,.blind{visibility:hidden;overflow:hidden;position:absolute;top:0;left:-9999px;width:0;height:0;font-size:0;line-height:0;text-align:left}

.clear {clear:both;}
.mg_b60{margin-bottom:60px;}
.point {color:#2c2c2c;font-weight:bold;}



/* layout */
.remember0416 #header_wrap,.promise1 #header_wrap,.promise2 #header_wrap,.promise3 #header_wrap {padding-top: 100px;}
#header_wrap {position:relative; width:100%;}
#header_wrap .remember0416 {width:960px;margin:0 auto;padding:40px 0 25px 0;}
#header_wrap .gnb_wrap {position:relative; height:50px;background:#494949;}
#header_wrap .gnb_wrap .gnb {width:960px;margin:0 auto;}
#header_wrap .gnb_wrap .gnb li {text-align:center;float:left;}
#header_wrap .gnb_wrap .gnb li a {display:block;width:238px;color: #fff;font-weight: bold;font-size: 16px;line-height:50px;letter-spacing:1px;border-right:#5e5e5e 1px solid;}
#header_wrap .gnb_wrap .gnb li.first {border-left:#5e5e5e 1px solid;}
#header_wrap .gnb_wrap .gnb li a.selected {background-color: #ffde35;color:#000;}
#header_wrap .gnb_wrap .gnb li a:hover,
#header_wrap .gnb_wrap .gnb li a:active {background-color: #ffde35;color:#000;}

#footer_wrap {position:relative; width:100%;clear:both;background:#e8e8e8;padding:40px 0;color:#888;}
#footer_wrap .footer {width:960px;margin:0 auto;}
#footer_wrap .footer .b_logo {float:left;margin-right:25px;}
#footer_wrap .footer .address_copy {float:left;font-size:12px;line-height:160%;}
#footer_wrap .footer .address_copy .ad_dress {background:url('');}
#footer_wrap .footer .address_copy .ad_dress .ft_01 {font-weight:bold;}
#footer_wrap .footer .social {clear:both;text-align:right;}
#footer_wrap .footer .social img {margin-right:5px;}

/* main */
#container .main_img {position:relative; width:100%;height:451px;background:url('../img/remember0416/main_img.jpg') #fdfbf7 no-repeat center top;text-align:center;}
#container .main_img img {margin-top:70px;}

#container .contents {padding:65px 0;}
#container .contents .detail_list {width:960px;margin:0 auto;}
#container .contents .detail_list p.detail{text-align:center;}
#container .contents .detail_list ul.promise {margin-top:60px;}
#container .contents .detail_list ul.promise li{float:left;width:32%;text-align:center;letter-space:-0.5px;border-right:#d5d5d5 1px dashed;}
#container .contents .detail_list ul.promise li.end {border:none;}
#container .contents .detail_list ul.promise li p.title {font-size:24px;color:#101010;font-family:batang,serif;font-weight:bold;letter-spacing:-1px;}
#container .contents .detail_list ul.promise li p.txt {color:#5a5a5a;font-size:15px;line-height:140%;margin-bottom:25px;}

#container .contents .reply {clear:both;width:960px;margin:60px auto 0;}
#container .contents .reply .title {margin-bottom:20px;}

/* sub */
#sub_container {position:relative;background:#f8f7f4;padding:75px 0 0 0;}
#sub_container .contents{position:relative;width:880px;margin:0 auto;}

#sub_container .contents .h_area {height:113px;}
#sub_container .contents .h_area h2 {float:left;margin-right:20px;}
#sub_container .contents .h_area .h_sum {float:left;padding-top:40px;color:#9c9c90;font-size:14px;font-weight:bold;line-height:18px;}

#sub_container .contents .txt_wrap {}
#sub_container .contents .txt_wrap .plan{border:#ddd 1px solid;background:#fff;padding:40px 30px;}
#sub_container .contents .txt_wrap .plan h3{font-size:21px;font-weight:bold;color:#2c2c2c;}
#sub_container .contents .txt_wrap .plan ul{margin-top:25px;}
#sub_container .contents .txt_wrap .plan ul > li{margin-bottom:15px;background:url('../img/remember0416/tick.png') no-repeat 0px 3px;padding-left:20px;color:#777;}
#sub_container .contents .txt_wrap .plan .plan_sub{margin-top:10px;}
#sub_container .contents .txt_wrap .plan .comment {margin-top:25px;color:#000;}

#sub_container .contents .txt_wrap .txt {margin-top:20px;}
#sub_container .contents .txt_wrap .txt .txt_img01{}
#sub_container .contents .txt_wrap .txt .img_comment {margin-top:4px;text-align:right;color:#9c9c90;font-size:12px;}
#sub_container .contents .txt_wrap .txt .txt_area {margin-top:20px;}
#sub_container .contents .txt_wrap .txt .txt_area > p {margin-top:30px;text-indent:1em;font-size:15px;}


/* quote */
.quote {position:relative;color:#000;line-height:160%;}
.quote .quote01{background:url('../img/remember0416/quote1.png') no-repeat 5% 0;}
.quote .quote02{background:url('../img/remember0416/quote2.png') no-repeat 93.5% 100%;}
.quote .talk {width:85%;margin:0 auto;}

/* sa0416 banner */
.sa0416 {position:relative;
box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;
width:958px;padding:15px 0;margin-top:5px;border:#d8d8d8 1px solid;background:#fafafa;}
.sa0416 .logo {float:right;}
.sa0416 .txt {float:left;}
.sa0416 .logo {margin:0 30px 0 0;text-align:center;}
.sa0416 .logo h3{margin-bottom:8px;}
.sa0416 .txt {width:auto;margin:20px 0 0 25px;display:table-cell;}
.sa0416 .txt h4 {font-weight:bold;font-size:22px;margin-bottom:7px;}
.sa0416 .txt p {font-size:13px;margin-bottom:15px;}
.sa0416 a {}

#sub_container .sa0416 {width:100%;}
#sub_container .sa0416 .txt p {width:580px;word-break:keep-all;}
#sub_container .sa0416 .logo {margin-top:10px;}

/* donation */
/*.donation_wrap {margin-top:40px;}
.donation_wrap .donation {margin:0 auto;}*/

.donation {width:100%;clear:both;padding:25px 0;margin-top:50px;background:#8a8a8a;color:#fff;}
.donation .d_wrap {margin:0 25px;}
.donation .use_info,
.donation .use_list{float:left;margin-top:15px;font-size:14px;}
.donation .btn_donation {display:block;float:right;margin-bottom:30px;}

.donation .use_info {margin-right:30px;}
.donation .use_info dt {font-weight:bold;font-size:16px;margin-bottom:15px;}
.donation .use_info dd {line-height:24px;}

#container .donation .use_info {margin-right:60px;}

.donation .use_list dt {float:left;font-weight:bold;line-height:24px;margin-right:5px;}
.donation .use_list dd {line-height:24px;}
.donation .use_list dd.bar_wrap {clear:both;margin-left:0;}

.donation .cp_graph {width:260px;float:left}
.donation .cp_graph .grape .godong {margin-left:0;}
.donation .cp_graph .pna {clear:both;padding-top:2px;}
.donation .cp_graph .pna span {color: #ffc13b;font-size: 16px;font-weight: bold;}
.donation .cp_graph .pna .psn{float:left;}
.donation .cp_graph .pna .psn{float:right;}

.donation .account {padding-top:10px;border-top:#aeaeae 1px solid;color:#e3e3e3;font-size:13px;line-height:160%;}
.donation .account a {color:#e3e3e3;text-decoration:underline;}

/* donation reply 
div.note_reple {position: relative;width:880px;margin:0 auto;}
div.note_reple .reple_list {height:auto;float:left;margin-bottom: 30px;}
div.note_reple .reple_list li {float:left;border:#ccc 1px solid; width:114.66px;height:90px;margin:12px 12px 0 0;padding:10px;overflow:hidden;font-size:13px;}
div.note_reple .reple_list li.last {margin-right:0;}
div.note_reple .reple_list div.arrow_bottom {margin: 0;text-align: center;cursor: pointer;clear: both;position:absolute;bottom:20px;width: 100%;}
div.note_reple .clear {height:40px;}
*/

/*div.note_reple_wrap {background:#f8f7f4;padding:50px 0 0 0;}*/
div.note_reple {position: relative;width:880px;margin:50px auto 0;}
div.note_reple div.heart_bar {margin-bottom:15px;font-size:14px;}
div.note_reple div.heart_bar h3.tit {display:inline;margin:0 20px 0 0;}
div.note_reple div.heart_bar img {vertical-align:middle;margin-right:7px;}
div.note_reple div.heart_bar .point {color:#ff9900;}
div.note_reple .reple_list {width:100%;height:auto;float:left;margin-bottom: 30px;font-size:13px;}
div.note_reple .reple_list li {margin:4px 0 0 0;background-color:#fff;}
div.note_reple .reple_list li {border-bottom:#efefee 1px solid;}
div.note_reple .reple_list li div.reple_txt{padding:13px 40px;background:url('../img/remember0416/reple_icon.png') no-repeat 20px 15px;}
div.note_reple .reple_list li div.reple_txt {border-top:#eaeaea 1px solid;border-left:#eaeaea 1px solid;border-bottom:#d6d6d6 1px solid;border-right:#d6d6d6 1px solid;}
div.note_reple .reple_list li.last {margin-right:0;}
div.note_reple .reple_list div.arrow_bottom {margin:0;width:100%;position:absolute;bottom:65px;text-align: center;cursor: pointer;clear: both;}
div.note_reple .reple_list div.arrow_bottom a{padding:8px 0;display:block;border-top:#e1e1e1 1px solid;border-left:#e1e1e1 1px solid;border-bottom:#bbb 1px solid;border-right:#d2d2d2 1px solid;color:#1a1a1a;}
div.note_reple .reple_list div.arrow_bottom a {
	font-family: "맑은 고딕",Malgun Gothic, Arial;font-size: 12px;
	border: 1px solid #e7e7e7; border-bottom: 1px solid #cacaca; background-color: #fff;
	background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0.01, rgb(255,255,255)), color-stop(1, rgb(243,243,243)) );
	background-image: -moz-linear-gradient( center top, rgb(255,255,255), rgb(243,243,243) );
	background-image: -ms-linear-gradient( top, rgb(255,255,255) 0%, rgb(243,243,243) 100%);
	Filter: progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#ffffff, endColorstr=#f3f3f3);
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
} 
div.note_reple .reple_list div.arrow_bottom a:hover {
	text-decoration:underline;
	font-weight:bold;color:#000;
	background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0.01, rgb(243,243,243)), color-stop(1, rgb(255,255,255)) );
	background-image: -moz-linear-gradient( center top, rgb(243,243,243), rgb(255,255,255) );
	background-image: -ms-linear-gradient( top, rgb(243,243,243) 0%, rgb(255,255,255) 100%);
	Filter: progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#f3f3f3, endColorstr=#ffffff);
}
div.note_reple .clear {height:80px;}

 

#progressBar {
        width: 100%;
        height: 17px;
       	/*border: 1px solid #9f9f9f;*/
        background-color: #292929;
}
 
#progressBar div {
	font-size:12px;
        height: 100%;
        color: #fff;
		text-align: right;
        line-height: 19px; /* same as #progressBar height if we want text middle aligned */
        width: 0;
        background-color: #ff5d24;
}

.bar {
	background: #292929;
	/*border: 1px solid #292929;*/
	border-radius: 5px;
	overflow: hidden;
	/*box-shadow: 0 0 5px #333;	*/
}
.bar div {
	background-color: #ff5d24;v
}