
/* 게시판 */
#boardBox { overflow: hidden; width:100%; margin:0 auto; height:auto; }
.board-box-inner {float:left; width:1300px;  margin:50px 0; height:1000px;}
.board-list-text-no { text-align: center; padding: 20px; color:#666; font-size:16px; }
.board-list-text-btn { padding:30px; margin: 20px auto; text-align:center; padding:5px 20px; color:#fff; font-size:14px; background-color:#000; width:20%; float:right: }
.board-list-text-btn-reg { padding:30px; margin: 20px auto; text-align:center; padding:5px 20px; color:#fff; font-size:14px; background-color:#666; width:20%; float:right: }

 h1 { font-size:22pt; font-weight:600; color:#000; padding: 40px 0 10px 12px; }
 .board-text-Small { font-size:10pt; color:#666; padding-top:10px; }
 .board-text-Big { font-size:10pt; color:#000; line-height:150%; }
 .board-text-middle { font-size:11pt; color:#666; }

.board-bbs-view .row:after { content: ""; display: table; clear: both; }
.board-bbs-view .row { content: ""; display: table; clear: both; }

/* 글쓰기 폼 */
.board-bbs input[type=text], textarea { width: 50%; padding: 12px; border: 1px solid #ccc; border-radius: 4px; resize: vertical; }
.board-bbs input[type=text], select { width: 50%; padding: 5px; border: 1px solid #ccc; border-radius: 4px; resize: vertical; }
.board-bbs label { padding: 12px 12px 12px 0; display: inline-block; }
.board-bbs input[type=submit] { background-color: #666; color: white; padding: 5px 20px; border: none; cursor: pointer; float: right; width:15%; }
.board-bbs .container { border-radius: 5px; background-color: #f2f2f2; padding: 20px; }
.board-bbs .col-15 { float: left; width: 15%; margin-top: 6px; text-align:center; }
.board-bbs .col-85 { float: left; width: 83%; margin-top: 6px; }
.board-bbs .row:after { content: ""; display: table; clear: both; }

@media all and (min-width:800px) {	/* 미디어쿼리 800픽셀 이상 */
#boardBox { width:1300px; margin:0 auto; height:auto; }
.board-box-inner {float:left; width:1300px; }
.board-list table { border-collapse: collapse; border-spacing: 0; width: 1300px; }
.board-list th { text-align: center; padding: 8px; border-bottom: 2px solid #000;  }
.board-list td { text-align: center; padding: 10px; color:#666; font-weight:400; letter-spacing:0.5px; vertical-align:middle; border-bottom: 1px solid #ddd;  }

.board-bbs-view .col-100 { float: left; width: 100%; margin-top: 6px; text-align:center; padding:20px; }

/* 리스트 하단 검색부분 */
div form.example { padding-left:365px; padding-right:400px; width:100%; margin:0 auto; text-align:left; }
form.example input[type=text] { font-size: 13px; border: 1px solid #ccc; float: right; width: 100%; background: #fff; margin-top:-1px; margin-left:5px;  vertical-align:middle; }
form.example input[type=text], select { float: left; width: 100px; padding: 6px; border: 1px solid #ccc; border-radius: 4px; resize: vertical;  vertical-align:middle; }
form.example button { float: left; width: 5%; padding: 7px; background: #000; color: white; font-size: 14px; border: 1px solid grey; border-left: none; cursor: pointer; border-radius:5px; padding-left:5px;  vertical-align:middle;  }
form.example button:hover { background: #0b7dda; }
form.example::after { content: ""; clear: both; display: table; }
}
/* 리스트 하단 검색부분 End */

@media all and (min-width: 768px) and (max-width:992px) { 
#boardBox { width:90%; margin:0 auto; height:auto; }
.board-box-inner { width:100%; }
.board-list table { border-collapse: collapse; border-spacing: 0; width: 1300px; }
.board-list th { text-align: center; padding: 8px; border-bottom: 2px solid #000;  }
.board-list td { text-align: left; padding: 10px; color:#666; font-weight:400; letter-spacing:0.5px; vertical-align:middle; border-bottom: 1px solid #ddd;  }
.board-bbs-view .col-100 { float: left; width: 100%; margin-top: 6px; text-align:center; padding:20px; }

.board-bbs .col-15 { width: 20%; margin-top: 5px; text-align:center; }
.board-bbs .col-85 { width: 70%; margin-top: 6px; }
.board-bbs input[type=text] { padding: 12px; font-size: 13px; border: 1px solid #ccc; float: left; width: 100%; background: #fff; margin-top:-1px; }
.board-bbs-view .col-100 { float: left; width: 90%; margin-top: 6px; text-align:center; }

div form.example { padding-left:150px; width:100%; margin:0 auto; text-align:left; }
form.example input[type=text] { font-size: 13px; border: 1px solid #ccc; float: right; width: 100%; background: #fff; margin-top:-1px; margin-left:5px;  vertical-align:middle; }
form.example input[type=text], select { float: left; width: 100px; padding: 6px; border: 1px solid #ccc; border-radius: 4px; resize: vertical;  vertical-align:middle; }
form.example button { float: left; width: 5%; padding: 7px; background: #000; color: white; font-size: 14px; border: 1px solid grey; border-left: none; cursor: pointer; border-radius:5px; padding-left:5px;  vertical-align:middle;  }
form.example button:hover { background: #0b7dda; }
form.example::after { content: ""; clear: both; display: table; }
}

@media all and (min-width: 401px) and (max-width:767px) { 
#boardBox { width:90%; margin:0 auto; height:auto; }
.board-box-inner { width:100%;}
.board-list table { border-collapse: collapse; border-spacing: 0; width: 1300px; }
.board-list th { text-align: center; padding: 8px; border-bottom: 2px solid #000;  }
.board-list td { text-align: left; width:100%; padding: 10px; color:#666; font-weight:400; letter-spacing:0.5px; vertical-align:middle; border-bottom: 1px solid #ddd;  }

.board-bbs .col-15 { width: 20%; margin-top: 5px; text-align:center; }
.board-bbs .col-85 { width: 70%; margin-top: 6px; }
.board-bbs input[type=text] { padding: 12px; font-size: 13px; border: 1px solid #ccc; float: left; width: 100%; background: #fff; margin-top:-1px; }
.board-bbs-view .col-100 { float: left; width: 90%; margin-top: 6px; text-align:center; }

div form.example { padding-left:45px; width:100%; margin:0 auto; text-align:left; }
form.example input[type=text] { font-size: 13px; border: 1px solid #ccc; float: right; width: 100%; background: #fff; margin-top:-1px; margin-left:5px;  vertical-align:middle; }
form.example input[type=text], select { float: left; width: 100px; padding: 6px; border: 1px solid #ccc; border-radius: 4px; resize: vertical;  vertical-align:middle; }
form.example button { float: left; width: 5%; padding: 7px; background: #000; color: white; font-size: 14px; border: 1px solid grey; border-left: none; cursor: pointer; border-radius:5px; padding-left:5px;  vertical-align:middle;  }
form.example button:hover { background: #0b7dda; }
form.example::after { content: ""; clear: both; display: table; }

}

@media all and (min-width: 320px) and (max-width:400px) { 
#boardBox { width:90%; margin:0 auto; height:auto; }
.board-box-inner { width:100%; }
.board-list table { border-collapse: collapse; border-spacing: 0; width: 1300px; }
.board-list th { text-align: center; padding: 8px; border-bottom: 2px solid #000;  }
.board-list td { text-align: left; width:100%; padding: 10px; color:#666; font-weight:400; letter-spacing:0.5px; vertical-align:middle; border-bottom: 1px solid #ddd;  }

.board-bbs .col-15 { width: 20%; margin-top: 5px; text-align:center; }
.board-bbs .col-85 { width: 70%; margin-top: 6px; }
.board-bbs input[type=text] { padding: 12px; font-size: 13px; border: 1px solid #ccc; float: left; width: 100%; background: #fff; margin-top:-1px; }
.board-bbs-view .col-100 { float: left; width: 90%; margin-top: 6px; text-align:center; }

div form.example { padding-left:25px; width:100%; margin:0 auto; text-align:left; }
form.example input[type=text] { font-size: 13px; border: 1px solid #ccc; float: right; width: 100%; background: #fff; margin-top:-1px; margin-left:5px;  vertical-align:middle; }
form.example input[type=text], select { float: left; width: 100px; padding: 6px; border: 1px solid #ccc; border-radius: 4px; resize: vertical;  vertical-align:middle; }
form.example button { float: left; width: 5%; padding: 7px; background: #000; color: white; font-size: 14px; border: 1px solid grey; border-left: none; cursor: pointer; border-radius:5px; padding-left:5px;  vertical-align:middle;  }
form.example button:hover { background: #0b7dda; }
form.example::after { content: ""; clear: both; display: table; }

}