@charset "utf-8";

/* 타이틀 */
.titlebar { width:100%; background:#000;}
.titlebar .area { position:relative;}
.titlebar .area:after { display:block; clear:both; content:'';}
.titlebar h2 { float:left; padding:28px 0 5px 0; color:#fff; font-size:25px;}

.titlebar .search { position:absolute; top:18px; right:0; font-size:0;} 
.titlebar .search legend { display:none}
.titlebar .search input[type="text"] { width:220px; height:37px; border-color:rgba(0,0,0,0.1); background:#f3c200; box-shadow:none; font-size:14px; line-height:18px; color:#222;}
.titlebar .search input[type="text"]::-webkit-input-placeholder { /* Chrome/Opera/Safari */color: rgba(0,0,0,0.4);}
.titlebar .search input[type="text"]::-moz-placeholder { /* Firefox 19+ */color: rgba(0,0,0,0.4);}
.titlebar .search input[type="text"]:-ms-input-placeholder { /* IE 10+ */color: rgba(0,0,0,0.4);}
.titlebar .search input[type="text"]:-moz-placeholder { /* Firefox 18- */color: rgba(0,0,0,0.4);}

.titlebar .search input[type="submit"] { position:absolute; top:1px; right:1px; width:35px; height:35px; border-radius:0; border:0; background:transparent url("./img/icon_search.png") no-repeat center center; font-size:0;}
.titlebar .search select { display:none; margin-right:1px; border-radius:3px;}
.titlebar i {margin:8px 5px 0 0}

nav.sub { border-top:1px solid rgba(255,255,255,0.1);}
nav.sub ul { font-size:14px;}
nav.sub ul:after { display:block; clear:both; content:'';}
nav.sub ul li { float:left; border:1px solid rgba(255,255,255,0.2); border-left:0; }
nav.sub ul li:first-child { border-left:1px solid rgba(255,255,255,0.2);}
nav.sub ul li.active { border-bottom:1px solid #aaa; background:#fff;}
nav.sub ul li a.active { background:#fff; color:#000; }
nav.sub ul li a { display:block; height:38px; padding:10px 18px; color:#aaa;}

#bo_list { padding-bottom:50px;}
#bo_list header { margin-bottom:20px}
#bo_list .icon.rss { float:none; display:inline-block;}
#bo_list nav.category { margin-bottom:-2px;}
#bo_list nav h3 { display:none}
#bo_list nav.tab li a { background:#fff;}
#bo_list nav.tab li a.active { background:#f3f3f3; }

#bo_list .control { margin-top:15px;}
#bo_list .paging { float:left; margin:0;}
#bo_list .paging ul { vertical-align:top}
#bo_list .btnset { float:right; }
#bo_list .btnset button { float:left; }
#bo_list .btnset a.button { margin-left:3px;}
#bo_list .search { float:right; margin-top:10px; font-size:0} 
#bo_list .search legend { display:none}
#bo_list search .required { margin-right:-1px; border-top-left-radius:3px; border-bottom-left-radius:3px;}
#bo_list .search input[type="submit"] { border-top-left-radius:0; border-bottom-left-radius:0;}
#bo_list search select { margin-right:1px; border-radius:3px;}

#bo_list .mcategory legend { display:none}
#bo_list .mcategory p { padding-bottom:5px;}
#bo_list .mcategory span { padding-right:10px;}
#bo_list .mcategory .btnset.left { display:inline-block; position:relative; float:none; text-align:left}

/* 게시판 쓰기 */
#bo_write { padding:20px 0 50px;}
#bo_write .wr_content label { display:none}
#bo_write h2 { font-size:24px; margin-bottom:10px;}
#char_count {font-weight:bold}

#autosave {position:relative}
#autosave_pop {display:none;z-index:10;padding:8px;width:;height:auto !important;height:180px;max-height:180px;border:1px solid #ccc;background:#fff;overflow-y:scroll}
html.no-overflowscrolling #autosave_pop {height:auto;max-height:10000px !important} /* overflow 미지원 기기 대응 */
#autosave_pop strong {position:absolute;font-size:0;line-height:0;overflow:hidden}
#autosave_pop div { }
#autosave_pop ul {margin:0;padding:0;border-top:1px solid #e9e9e9;list-style:none}
#autosave_pop li {padding:8px 5px;border-bottom:1px solid #e9e9e9;zoom:1}
#autosave_pop li:after {display:block;visibility:hidden;clear:both;content:""}
#autosave_pop li:hover { background-color:#f7f7f7;}
#autosave_pop a {display:block;float:left}
#autosave_pop span {display:block;float:right}
.autosave_content {display:none}
.button.autosave_close { width:100%;}

#bo_write .btn_confirm { width:100%; margin-top:10px; text-align:center; padding-top:20px; border-top:2px solid #4d4f53}

/* 뷰페이지 */
#bo_view { position:relative; margin-top:10px;}
#bo_list header { position:relative; border:0;}
#bo_list header .area { padding-bottom:20px; border-bottom: 2px solid #333;}
#bo_list header h2 { font-size:26px; line-height:28px; font-weight:normal;}
#bo_list header h2 .category { background:#eee; color:#999; padding:3px 5px; margin:-3px 4px 0 0; border-radius:3px; font-size:14px;}
#bo_list header .page { position:absolute; top:0; right:0;}
#bo_view .btnset { float:right;text-align:right; margin:5px 0}

#bo_view .bo_img {margin:0 0 10px;width:100%; text-align:center;overflow:hidden;zoom:1}
#bo_view .bo_img img:after {display:block;visibility:hidden;clear:both;content:""}
#bo_view .bo_img img {margin-bottom:20px;max-width:100%;height:auto}
#bo_view .area img { display:block; width:auto; max-width:100%; height:auto; margin:0 auto;}

#bo_view .bo_sns { width:100%; clear:both; position:relative; text-align:right; margin-top:60px;}
#bo_view .bo_sns li { display:inline-block;}

#bo_view section h2 { display:none;}
#bo_view section.info { margin:5px 0 0 0; padding-bottom:5px; color:#777; font-size:12px;}
#bo_view section.info a { font-size:12px;}
#bo_view section.info > span { padding-left:10px;}
#bo_view section.info span.start { padding-left:2px;}
#bo_view section.info strong { color:#bbb; font-weight:normal}

#bo_view section.file, #bo_view section.link { background:#F1F1F1; padding:5px; border-bottom:1px solid #fff}
#bo_view section.file li, #bo_view section.link li { padding:5px;}
#bo_view section.file .icon.file, #bo_view section.link .icon.link { margin-top:1px; padding-left:5px;}
#bo_view section.file span, #bo_view section.link span { color:#777;}

#bo_view section.link a:hover { text-decoration:underline;}

#bo_view section.content { clear:both; margin:60px 0; font-size:14px; line-height:180%;}
#bo_view section.content p.img { margin-bottom:10px; text-align:center;}



@media screen and (max-width: 1200px) {
	main { max-width:inherit !important; margin-left:0 !important;}
	.container { width:100%;}
	.titlebar .area { width:100%; max-width:100%; padding:0 15px; text-align:center;}
	.titlebar h2 { padding:16px 0; font-size:28px;}
	#bo_list { width:100%; padding:20px 9px;}
	#bo_list .area { width:100%; max-width:100%;}
}