@charset "euc-kr";

@import url(sub.css);
@import url(top_mn.css);
@import url(board.css);

@font-face {font-family:'NanumGothic';
src: url('/new2013/js/NanumGothic.eot');
src: url('/new2013/js/NanumGothic.eot?#iefix') format('embedded-opentype'),
url('/new2013/js/NanumGothic.woff') format('woff'),
url('/new2013/js/NanumGothic.ttf') format('truetype');
font-weight: normal;
font-style: normal; 
}  


/*񃧯*/
.bna_img img {width:100%;}
.view_tt img {width:80%;}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, big, cite, code, del, dfn, em, font, img, ins, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td 
{margin:0; padding:0; font-family:'µ¸¿ò', dotum, Arial,Trebuchet MS, Helvetica, sans-serif;}

html{line-height:0; height:100%; } /* opera 10 */
body{height:100%; font-size:12px; background:#fff; color:#5F5F5F; font-family:'µ¸¿ò', dotum, Arial,Trebuchet MS, Helvetica, sans-serif; }

p,br,td,table,tr,input,select,textarea { color:#545454 font-family:"µ¸¿ò"; font-size:13px;}


a:hover {color:#fa7220;  text-decoration:none;}

table{border-collapse:collapse; border-spacing:0;}
table caption{width:0; height:0; overflow:hidden; visibility:hidden; font-size:0; line-height:0;}

h1, h2, h3, h4, h5, h6{font-size:100%; margin:0; padding:0;}
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img{display:block;}

img, fieldset, button{border:0 solid transparent;}
button img{display:none;}
img{vertical-align:top;}

ol, ul{list-style:none;}
blockquote, q{quotes:none;}
hr{display:none;}

a:link, a:visited{color:#5b5b5b; text-decoration:none;}
a:hover{text-decoration:none;}
a:active{text-decoration:none;}

textarea{overflow:auto;}
html:first-child select{padding-right:6px; height:20px;} /* Opera 9 & Below Fix */
option{padding-right:6px;} /* Firefox Fix */
legend{position:absolute; top:0; left:0; width:0; height:0; overflow:hidden; visibility:hidden; font-size:0; line-height:0;}

.b{ font-weight:bold;}


/* layout */
#t_bg { margin:0 auto; position:relative; background:#FFF url("../img/tbg.gif")  repeat-x; background-position: center top; }

#wrap{width:100%; margin:0 auto; text-align:left; overflow:hidden;}


/*main*/
#main {width:100%; height:100%; margin:0 auto; margin:0 auto; background: url("../img/m_bg.png") repeat-x; background-position: center top;}
#main .bg { width:100%;  }
#main .topbg {width:100%; margin:0 auto;}
#main .topbg .top {width:100%; height:57px; background: url("../img/mtop_bg.png") repeat-x; background-position: center top; position:absolute; z-index:100;}

#main .main_roll {width:100%; margin:0 auto; max-width:720px;}
#main .main_roll .area02 {position:absolute; width:100%; z-index:2; max-width:720px;} 
#main .main_roll .area02 .m01 {width:100%; position:relative; float:left;} 
#main .main_roll .area02 .m02 {width:100%; position:relative; float:left;} 
#main .main_roll .area02 .m02 li {display:inline; float: left;}

#main .main_roll .roll-02 {position:relative;  max-width:640px;}

#main .contents {width:100%; margin:0 auto; max-width:640px;}
#main .contents li {display:inline; float: left; }

/*main btm*/
#mbtm { width:100%; height:174px; background: url("../img/mbtm_bg.png") repeat-x; float:left;}
#mbtm .foot { width:100%; margin:0 auto;}
#mbtm .foot .bt { height:87px; float:left; width:100%;}
#mbtm .foot .bt li {display:inline; float: left;}
#mbtm .foot .address { height:45px; float:left; width:100%;}

#img02, #img03 {display:none;}




/* header - top & ¸Þ´º ºÎºÐ */
#header {width:100%; margin:0 auto;}
#header .area {width:320px; height:41px; background:#000 url("../img/top_bg.gif") no-repeat; background-position: center top; }
#header .area .left {position:relative; float:left; width:292px; padding-top:4px;}
#header .area .left li {display:inline; float: left; }
#header .area .right {position:relative; float:right; width:28px;}

#title {width:90%; margin:0 auto; padding:0% 5%;}
#title .area {width:100%; position:relative; float:left; border-bottom:1px solid #e4e4e4;}
#title .area .top_back {width:10%; position:relative; float:left;}
#title .area .top_home {width:10%; position:relative; float:left;}
#title .area .tit {width:70%; position:relative; float:left; text-align:center; font:22px "NanumGothic", "³ª´®°íµñ","NanumGothicWeb"; top:3px; letter-spacing:-0.05em; color:#000;}


#cont {width:100%; margin:0 auto; max-width:720px;}
#cont .area {width:90%; position:relative; float:left; text-align: justify; line-height:130%; padding:10px 5%;}
#cont .area .cel01 {width:100%; position:relative; float:left; padding-bottom:30px;}
#cont .area .cel01 li {display:inline; float: left; position:relative;}
#cont .area .cel01 .list {float: left; position:relative; width:100%; padding-bottom:10px;}
#cont .area .cel01 .list_bg {float: left; position:relative; width:90%; padding:5px 5%; background:#DFF1F4; border-bottom:1px dotted #FFF;}

#cont .area .bna {width:100%; position:relative; float:left; padding-bottom:30px;}
#cont .area .line01 {clear:both; width:100%; background:#D1D1D1; height:1px; margin-bottom:30px;}

#cont .btn_cpt {width:100%; position:relative; float:left; padding-bottom:5px;}
#cont .btn_cpt li {display:inline; float:left;  position:relative;}


.bt_list {width:100%; position:relative; float:left; padding-bottom:30px;}


/*btm*/
#btm { width:100%; height:137px; background: url("../img/btm_bg.gif") repeat-x; float:left;}
#btm .foot { width:90%; margin:0 auto; padding:0 5%;}
#btm .foot .bt { height:72px; float:left; padding-top:20px; width:100%;}
#btm .foot .bt li {display:inline; float: left;}
#btm .foot .address { height:45px; float:left; width:100%;}


/*font*/
.mn_t  {width:100%; position:relative; float:left; font:17px "NanumMyeongjo"; letter-spacing:0; color:#000; padding-bottom:10px; line-height:130%;}
.mn_t span  { font:17px "NanumMyeongjo"; letter-spacing:0em; color:#FF7300; font-weight:bold;}
.bk01b {color:#000;  font-weight:bold;}
.wt01b {color:#FFF;  font-weight:bold;}

.gr01 {color:#B6AE24; font-weight:bold; line-height:110%;}
.gr01bx {color:#FFF; background:#B6AE24; font-weight:bold; padding:2px 5px 0px;}

.red01u {color:#FF0000; text-decoration:underline;}

.blu01u {color:#0D4F74; text-decoration:underline; font-weight:bold; }

.oran01 {color:#CD6017;}

.redbx {background:#FF0000; color:#FFF; font-weight:bold; padding:0px 5px; text-align:right;}


/* menuDiv */
#menuDiv {position:absolute; width:90%; margin:0 5%; background: url("../img/menu_bg_cen.png") repeat-y; background-size:100% auto; top:42px; left:0; z-index:100;} 
#menuDiv span{position:absolute; width:100%; z-index:100;} 
#menuDiv .menu_list { width:94%; margin:14% 0 0% 3%;}

#menuDiv .menu_list img { margin-right:0%;}
#menuDiv .menu_list dt a{ font-size:13px; color:#FFF; line-height:110%;} 

.menu_dot { width:100%; height:16px; background: url("../img/menu_dot.gif") repeat-x; float:left;}


/* board list */
.board_list{width:100%; /*border-top:2px solid #e4e4e4;*/ text-align:left; margin-top:10px;}
.board_list ul{width:94%; border-bottom:1px dotted #ddd; padding:2% 3%;}
.board_list .title{font-size:15px; color:#333; font-weight:bold;}
.board_list .title2 {font-size:15px; color:#333; font-weight:bold; text-align:center;}
.board_list .bna_img{width:auto; padding:2% 5%;}

.writer {color:#5dc1c1;}
.writer2 {color:#5dc1c1; text-align:right; width:100%; right:0; float:right; position:relative; }
.board_list img {vertical-align:middle;}

.btn{padding-bottom:20px; text-align:right;}


/* board view */
.board_view{width:100%; border-bottom:2px solid #e4e4e4;}
.board_view .title{font-size:15px;  color:#333; font-weight:bold; background:#f4f4f4; padding:8px 0; border-bottom:1px solid #ccc; text-align:center;}
.board_view .view_tt{text-align:left; padding:2% 3%; }
.board_view img{vertical-align:middle;}
.board_view .date{text-align:right; padding:8px 5px 0 0; height:25px; border-bottom:1px dotted #ddd;}

.wiew_btn{padding:20px 0; text-align:center;}



/* board write */
.board_write{width:100%; border-bottom:2px solid #e4e4e4;}
.board_write img{vertical-align:middle;}
.board_write th{background:#f5f5f5 left 49%;  width:80px; text-align:center; color:#555; height:30px; border-bottom:1px solid #ccc; }

.board_write td{text-align:left;padding:7px 5px; border-bottom:1px solid #dbdbdb; margin-top:1px;}
.board_write em{color:#cc3366; font-style:normal; font-size:11px; letter-spacing:-0.7pt; }
.board_write .input_text{height:20px; width:150px; border:1px solid #ddd;}
.board_write .input_text_ph{height:20px; width:60px; border:1px solid #ddd;}
.board_write .input_text_area{width:100%; height:200px; border:1px solid #ddd; padding:7px 0;}
.board_write .input_text_title{width:100%; height:20px; border:1px solid #ddd;}
.board_write .input_file{width:100%; border:1px solid #ddd;}
.board_write .line {width:100%; border-bottom:1px solid #ddd;}

/* kakao talk */
.katalk_bg {width:100%; background: url("../img/board/katalk_bg.gif") repeat-x;}
.katalk_write{width:100%; /*border-bottom:1px solid #88A5CE;*/}
.katalk_write img{vertical-align:middle;}
.katalk_write th{background:#59383B left 49%;  width:100px; text-align:center; color:#FFEA00; height:30px; border-bottom:1px solid #99ADCB; }

.katalk_write td{text-align:left;padding:7px 5px; border-bottom:0px solid #88A5CE; margin-top:1px;}
.katalk_write em{color:#cc3366; font-style:normal; font-size:11px; letter-spacing:-0.7pt; }
.katalk_write .input_text{height:20px; width:150px; border:1px solid #ddd;}
.katalk_write .input_text_ph{height:20px; width:60px; border:1px solid #ddd;}
.katalk_write .input_text_area{width:100%; height:200px; border:1px solid #ddd; padding:7px 0;}
.katalk_write .input_text_title{width:100%; height:20px; border:1px solid #ddd;}
.katalk_write .input_file{width:100%; border:1px solid #ddd;}





/* paging */
.paging{width:auto; margin:20px 0; padding:5px; text-align:center;}
.paging img{vertical-align:middle;}
.paging a{text-align:center; padding:3px 6px 3px 6px; margin:0 5px 0 5px; border:1px solid #c7c7c7; background:#ffffff; color:#626262; 
		  font-family:arial, helvetica, sans-serif; font-size:16px; color:#626262;font-weight:bold;}
.paging a:hover{border:1px solid #F4632A; background:#F58D40; color:#fff; text-decoration:none;}
.paging .selected{border:1px solid #F4632A;background:#F58D40;color:#fff;text-decoration:none;}


.bg_list {max-width:100%; background: url("../img/bg_list.png") no-repeat;}




/*btn*/
span.button,
span.button a,
span.button button,
span.button input { position:relative; margin:0; display:inline-block; text-decoration:none !important; border:0; font:12px Sans-serif; white-space:nowrap; background:url(img/buttonWhite.gif) no-repeat; vertical-align:middle; overflow:visible;}
span.button { height:23px; padding:0; margin-right:2px; background-position:left top; overflow:visible;}
span.button a,
span.button button,
span.button input{ left:2px;}
span.button.large { height:29px; background-position:left -30px; }
span.button.xLarge { height:35px; background-position:left -65px; }
span.button.small { height:18px; background-position:left -107px; }

span.button a { padding:6px 10px 5px 8px; *padding:4px 10px 7px 8px; color:#000; font:12px/12px Sans-serif; background-position:right top;}
span.button.large a { padding:7px 140px 6px 38px; *padding:5px 10px 9px 8px; _top:-1px; font:16px/16px Sans-serif; background-position:right -30px;}
span.button.xLarge a { padding:8px 10px 7px 8px; *padding:6px 10px 9px 8px; font:20px/20px Sans-serif; background-position:right -65px;}
span.button.small a { padding:4px 6px 3px 4px; *padding:2px 6px 5px 4px; font:11px/11px Sans-serif; background-position:right -107px; _top:-1px;}


span.button button,
span.button input { height:23px; padding:0 10px 0 8px; line-height:24px; background-position:right top; cursor:pointer;}
span.button.large button,
span.button.large input { height:30px; padding:0 10px 0 8px; font:16px/30px Sans-serif; background-position:right -30px;}
span.button.xLarge button,
span.button.xLarge input { height:35px; padding:0 10px 0 8px; font:20px/36px Sans-serif; background-position:right -65px;}
span.button.small button,
span.button.small input { height:18px; padding:0 6px 0 4px; font:11px/18px Sans-serif; background-position:right -107px;}


span.button.strong * { font-weight:bold !important;}


span.button .icon { position:relative; left:10px; margin-right:5px; vertical-align:middle; border:0; z-index:2;}
span.button.small .icon{ left:6px;}

span.button.black,
span.button.black a,
span.button.black button,
span.button.black input { background-image:url("../img/buttonBlack.gif"); color:#fff;}

/*tab*/
.b_tab {position:relative; padding-bottom:15px; float:left; clear:both;}
.b_tab li {display:inline; float: left;  padding:6px 5px 4px 5px; background:#24A2DD;  margin-right:3px;  margin-bottom:3px; font-weight:bold; border-left:2px solid #397692; border-top:2px solid #397692; border-bottom:2px solid #B7E8FF; border-right:2px solid #B7E8FF;}

.b_tab li a:link  {color:#FFF; text-decoration:none;}
.b_tab li a:visited {color:#FFF; text-decoration:none;}
.b_tab li a:hover {color:#FFEA00; text-decoration:none;}
.b_tab li a:active {text-decoration:none;}


/*foot*/
.btn_f {width:100%; float:left; position:fixed; bottom:0;  padding:0.7% 0; /*background-color:#2E2E2E;*/ background-color:rgba(0,0,0,0.5); }
.btn_f .area {margin:0 auto; position:relative; max-width:640px; min-width:320px;}
.btn_f .area li {float:left; }
.btn_f .area img {width:100%; display:block;}

footer {width:100%; margin:0 auto; background-color:#000; float:left;}
footer .area {margin:0 auto; max-width:640px; min-width:320px; text-align:center; font-size:12px; padding:10px 0; margin-bottom:22%;}