

#board-form { padding:20px; background:#fff; border-radius:10px; }

.controller {  }

.nodata { height:100px; text-align:center; }

.jw-board-list tbody tr { height:40px; }


.jw-board-view-title { font-size:20px; margin:0 0 10px; }

.jw-board-view-meta {
    padding:8px 12px;
    border-top:1px solid #ddd;
    border-bottom:1px solid #ddd;
    font-size:13px;
	background:#F4F4F4;
}
.jw-board-view-cat { font-weight:600; margin-right:20px; }
.jw-board-view-label { margin:0 6px 0 20px; color:#777; }
.jw-board-view-email { margin-left:6px; color:#555; }
.jw-board-view-views { font-weight:600; }
.jw-board-view-content { padding:20px 0; min-height:200px; }
.jw-board-view-attach { margin-top:15px; }
.jw-board-view-attach-label { display:inline-block; margin-right:10px; }
.jw-board-view-controller { margin-top:20px; }
.jw-board-view-comments { margin-top:30px; }

.jw-board-view { padding:20px; background: #fff; color:222; }
.jw-board-view > h2 { font-size: 22px; font-weight: 700; color: #111; }
.jw-board-view .content { margin-top: 10px; }
.jw-board-view section { margin: 20px 0; }
.jw-board-view section h2 { margin: 0 0 8px; font-size: 18px; font-weight: 700; color: #222; }
.jw-board-view p { margin: 8px 0; }
.jw-board-view ul, .jw-board-view ol { margin: 8px 0 8px 20px; padding: 0; }
.jw-board-view li { margin: 4px 0; }
.jw-board-view blockquote { margin: 10px 0; padding: 10px 12px; border-left: 3px solid #ccc; background: #f9f9f9; color: #444; }
.jw-board-view a:not(.jw-button) { color: #2563eb; text-decoration: none; }
.jw-board-view a:not(.jw-button):hover { text-decoration: underline; }
.jw-board-view hr { margin: 20px 0; border: 0; border-top: 1px solid #eee; }
.jw-board-view img, .jw-board-view video { max-width: 100%; height: auto; }
.jw-board-view table { width: 100%; border-collapse: collapse; margin: 10px 0; background: #fff; border: 1px solid #ddd; }
.jw-board-view th, .jw-board-view td { padding: 8px 10px; border: 1px solid #ddd; text-align: left; }
.jw-board-view thead th { background: #f5f5f5; }

.jw-board-view h1 { font-size:24px; font-weight:bold; }
.jw-board-view h2 { font-size:20px; font-weight:bold; }
.jw-board-view h3 { font-size:18px; font-weight:bold; }
.jw-board-view h4 { font-size:16px; font-weight:bold; }


.jw-pagebox { margin-top:20px; display:flex; justify-content:center; align-items:center; }
.jw-pagebox > .info { flex:1; font-size:10px; font-weight:300; color:#666666; }
.jw-pagebox > .info.right { display:flex; justify-content:flex-end; }
.jw-pagebox > .contents { flex:1; display:flex; justify-content:center; align-items:center; }
.jw-pagebox > .contents.off { display:none; }
.jw-pagebox > .contents > div { position:relative; display:flex; justify-content:center; align-items:center; cursor:pointer; }
.jw-pagebox > .contents > div.btn {  width:28px; height:28px; }
.jw-pagebox > .contents > div.btn > button { width:100%; height:100%; }
.jw-pagebox > .contents > div.btn.off { display:none; }
.jw-pagebox > .contents > .page { display:flex; justify-content:center; align-items:center; }
.jw-pagebox > .contents > .page > .p { width:28px; height:28px; display:flex; justify-content:center; align-items:center; cursor:pointer; }
.jw-pagebox > .contents > .page > .p.show { color:#4d7cff; font-size:16px; font-weight:bold; }
.jw-pagebox > .contents > div > span:last-child { position:absolute; }
.jw-pagebox > .contents button { position:relative; background:transparent; border-radius:50%; } 
.jw-pagebox > .contents button:hover { background:#eee; } 
.jw-pagebox .prev { position:relative; height:0; height:0; display:flex; justify-content:center; align-items:center; }
.jw-pagebox .prev:after { content:""; position:absolute; width:6px; height:6px; transform:rotate(135deg); border:1px solid transparent; border-color: transparent #000 #000 transparent;  }
.jw-pagebox .prev2 { position:relative; height:0; height:0; }
.jw-pagebox .prev2:after { content:""; position:absolute; left:15px; width:6px; height:6px;  transform:rotate(135deg); border:1px solid transparent; border-color: transparent #000 #000 transparent; }
.jw-pagebox .next { position:relative; height:0; height:0; display:flex; justify-content:center; align-items:center; }
.jw-pagebox .next:after { content:""; position:absolute; width:6px; height:6px; transform:rotate(-45deg); border:1px solid transparent; border-color: transparent #000 #000 transparent;  }
.jw-pagebox .next2 { position:relative; height:0; height:0; }
.jw-pagebox .next2:after { content:""; position:absolute; left:5px; width:6px; height:6px;  transform:rotate(-45deg); border:1px solid transparent; border-color: transparent #000 #000 transparent; }


