@charset "UTF-8";

.board_box * {font-size:13px;}
.board_box input[type=text] {margin:0; padding:3px 8px; border:1px solid #999; text-align:left; vertical-align:middle;
					-webkit-appearance:none; -webkit-rtl-ordering:logical; -webkit-user-select:text; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px;}
.board_box select {overflow:auto; overflow-x:hidden; border:1px solid #999; margin:0; padding:4px 8px; vertical-align:middle;
		-webkit-rtl-ordering:logical; -webkit-user-select:text; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px;}
.board_box select:focus {outline:0; border-color:#1582dc;}
.board_box option   {line-height:30px;}
.board_box optgroup{font-weight:bold;}

.search_view {clear:both; float:none; width:100%; overflow:hidden; text-align:right; margin-bottom:3px;}
.input_full {width:100%;}
.button.board {padding:4px 10px 5px 10px !important; font-weight:700;}

.board_cate_title {font-weight:700; font-size:18px; letter-spacing:1.5px; padding-bottom:24px;}
.board_nodata {height:100px; text-align:center; vertical-align:middle;}

.board_section {clear:both; float:none; width:100%; overflow:hidden; text-align:center; margin-top:5px;}
.board_section .button_left  {float:left; margin-right:5px;}
.board_section .button_right {float:right; margin-left:5px;}
.board_section:before, .board_section:after {clear:both; float:none;}

table.board_list {clear:both; float:none; width:100%; margin:0 auto; border-collapse:collapse; border-spacing:0; border:1px solid #ccc; border-bottom:1px solid #ccc;}
table.board_list th {background-color:#ebeced; border:1px solid #ccc; text-align:center; vertical-align:middle; overflow:hidden; font-weight:700; padding:8px 8px;}
table.board_list th.left {text-align:left;}
table.board_list th.right {text-align:right;}
table.board_list th.center {text-align:center;}
table.board_list td {background-color:#fff; font-weight:400; border:1px solid #dedede; padding:8px 8px; vertical-align:top; text-align:center;}
table.board_list td.left {text-align:left;}
table.board_list td.right {text-align:right;}
table.board_list td.center {text-align:center;}
table.board_list td.list_subject {text-align:left;}
table.board_list > tbody > tr:hover td, table.board_list > tbody > tr.table_line td {background-color:#ededed;}

table.board_form {clear:both; float:none; width:100%; margin:0 auto; border-collapse:collapse; border-spacing:0;}
table.board_form th {background-color:#ebeced; border:1px solid #cccccc; vertical-align:middle; text-align:right; font-weight:700; height:30px; padding:2px 5px;}
table.board_form td {position:relative; background-color:#ffffff; border:1px solid #dedede; vertical-align:middle; text-align:left; font-weight:400; height:30px; padding:2px 5px;}
table.board_form .center {text-align:center;}
table.board_form .right {text-align:right;}

table.board_view {clear:both; float:none; width:100%; margin:0 auto;}
table.board_view th {background-color:#ebeced; border:1px solid #ccc; text-align:right; vertical-align:middle; overflow:hidden; font-weight:700; padding:8px 8px;}
table.board_view td {background-color:#fff; font-weight:400; border:1px solid #dedede; padding:8px 8px; vertical-align:top; text-align:left;}
div.remark {padding:10px; min-height:200px; overflow:hidden; word-wrap:normal; word-break:break-all;}

div.view_images {padding-top:10px;}
div.view_image {padding:2px; text-align:center;}
div.view_image_title {text-align:center; color:#888;}
ul.view_files {padding-top:20px; padding-bottom:5px; line-height:15px; text-align:left;}
ul.view_files a {padding-left:18px; background:url("../images/board/icon_file.gif") no-repeat 2px 50%;}

div.board_page {margin:15px 0 5px 0; padding:0; position:relative; text-align:center;}
ul.pagination {display:table; margin:auto;}
ul.pagination > li {display:table-cell; border:1px solid #ddd; border-left:0; background:#fff; width:30px; height:28px; vertical-align:middle; font-size:14px;}
ul.pagination > li:hover {background:#f5f5f5;}
ul.pagination > li.active {background:#428bca; border-color:#428bca;}
ul.pagination > li.active a {color:#fff;}
ul.pagination > li:first-child {border-bottom-left-radius:4px; border-top-left-radius:4px; border-left:1px solid #ddd;}
ul.pagination > li:last-child {border-bottom-right-radius:4px; border-top-right-radius:4px;}
ul.pagination > li.prev a > i, ul.pagination > li.next a > i {font-size:14px;}
div.board_str {text-align:right; position:absolute; top:6px; right:2px;}

/* error page */
.board_box .error_view {margin:20px; height:400px;}
.board_box .error_title {margin:20px; font-size:14px; font-weight:700;}
.board_box .error_contents {margin:20px; padding-top:10px; font-size:13px; line-height:22px; border-top:1px solid #333;}
.board_box .error_button {margin-top:10px; padding-top:10px; border-top:1px solid #333;}

/* skin - data */
.board_box .row {padding-top:20px; padding-bottom:30px; border-bottom:1px solid #ccc; overflow:hidden;}
.board_box .row_title {font-size:16px; font-weight:700;}
.board_box .row_contents {padding-top:30px; overflow:hidden;}
.board_box .row_remark {float:left; width:calc(100% - 180px); text-align:left; padding-right:20px; font-size:14px !important; text-align:justify; letter-spacing:1.5px;}
.board_box .row_remark * {font-size:14px !important;}
.board_box .row_images {float:left; width:180px; text-align:right;}
.board_box .row_images img{width:100%;}
.board_box .row:before, row:after {display:block; float:none; clear:both;}

/* skin - cooperation */
.coop_cols {width:33%; display:inline-block; margin-top:10px;}
.coop_images {text-align:center;}
.coop_images img {max-width:100%;}
.coop_subject {text-align:center; margin-top:10px;}

/* skin - gallery */
.gallery_cols {width:33%; display:inline-block; vertical-align:top; padding:8px; overflow:hidden;}
.gallery_images {text-align:center; min-height:210px;}
.gallery_images img {max-width:auto; max-height:200px; cursor:pointer;}
.gallery_subject {text-align:center; margin-top:10px;}

/********************************************************************
* mobile
********************************************************************/
@media screen and (max-width: 930px) {

	/* skin - data */
	.board_box .row_contents {
		display:flex; display: -webkit-flex; display: -moz-flex; display:-ms-flexbox; display:-o-flexbox;
		flex-direction:column; -webkit-flex-direction:column; -moz-flex-direction:column; -ms-flex-direction:column; -o-flex-direction:column;
		justify-content:center; -webkit-flex-pack:center; -moz-flex-pack:center; -ms-flex-pack:center; -o-flex-pack:center; flex-pack:center;
		-webkit-box-align:flex-start; -ms-flex-align:flex-start; align-items:flex-start;
	}
	.board_box .row_remark {float:none; width:100%; order:2; margin-top:20px;}
	.board_box .row_remark * {font-size:14px !important;}
	.board_box .row_images {float:none; width:100%; text-align:center; order:1;}

	/* skin - cooperation */
	.coop_cols {width:100%; display:block;}

	/* skin - gallery */
	.gallery_cols {width:100%; display:block; border-bottom:1px solid #ccc; margin-top:10px;}
	.gallery_images {min-height:auto;}
	.gallery_images img {max-width:100%; max-height:100%;}
	.gallery_subject {margin-top:20px;}

	/* skin - basic */
	.search_view {text-align:center;}
	.search_view input[type="text"] {width:calc(100% - 150px);}

	table.board_list {border: none;}
	table.board_list thead {display:none;}
	table.board_list tr {
		border-bottom: 1px solid #e5e5e5;
		display: block;
		width: 100%;
		margin-top:10px;
	}
	table.board_list td {
		padding:4px 4px 4px 4px;
	}
	table.board_list td.list_no {display:none;}
	table.board_list td.list_subject {
		display: block;
		border: none;
		white-space: normal;
		text-align:left;
		width:100%;
	}
	table.board_list td.list_writer,
	table.board_list td.list_date,
	table.board_list td.list_views {
		display: inline-block;
		border: none;
		white-space: normal;
		text-align:center;
		font-size: 12px;
		color: #aaa;
	}

	table.board_view th {display:none;}
	table.board_view td.view_subject {
		display: block;
		border: none;
		white-space: normal;
		text-align:left;
		border-bottom: 1px solid #e5e5e5;
		width:100%;
	}
	table.board_view td.view_writer,
	table.board_view td.view_date,
	table.board_view td.view_views {
		display: inline-block;
		border: none;
		white-space: normal;
		text-align:center;
		font-size: 12px;
		color: #aaa;
	}
	div.remark {min-height:100px; overflow:auto; max-width:100%;}
}