main { margin-top: 0; }
.content-area { max-width: 1080px; margin: 0 auto; display: flex; flex-direction: column; gap: 0;  min-height:400px;}
h1 { padding: 50px 0;text-align:center;}
.board-wrapper { max-width: 1080px; margin: 0 auto; display: flex; align-items: flex-start; }
.sidebar { width: 150px; margin-right: 20px; background-color: #eee; border: 1px solid #ccc; box-sizing: border-box; flex-shrink: 0; }
.sidebar h3 { font-size: 1.1em; padding: 10px; text-align: center; background-color: #4c75a6; color: #fff; }
.sidebar ul { list-style: none; padding-left: 0; }
.sidebar li { padding: 10px; border-bottom: 1px solid #ccc; }
.sidebar li:last-child { border-bottom: none; }
.sidebar a { color: #333; text-decoration: none; font-size:13px; }
.sidebar li.active { background-color: #053c7e; }
.sidebar li.active a { color: #fff; font-weight: bold; }
.board_list_table,.content-area { width: 100%; border-collapse: collapse; table-layout: fixed; }
.board_list_table thead{background-color:#eee;}
.board_list_table th, .board_list_table td { padding: 10px; border: 1px solid #ddd; text-align: center; vertical-align: middle; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size:14px;}
.board_list_table td a:hover { text-decoration: underline; font-size:14px;}
.board-content{min-height:500px;}
a.add-btn{display:inline-block;padding:10px;border-radius:5px;background-color:#4c75a6;color:#fff;}
p.date{border-bottom:1px solid #ccc;padding:5px;font-size:12px;text-align:right;margin-top:20px}
.content-area h2{padding: 0 10px; box-sizing:border-box;font-size:21px;}
.ql-editor{min-height:500px;margin:20px 0;}
.board-three-button{display:flex; flex-direction: row; gap:20px;align-items: unset;justify-content: flex-end;padding-top:20px;border-top:1px solid #ccc;}
.board-three-button a,.board-three-button form button.delete-button{display:block;width:80px;height:50px;line-height:30px; padding: 10px;font-size: 14px; color: #fff;   background-color: #797c7e; border: none; border-radius: 4px; cursor: pointer; transition: background-color 0.3s ease;box-sizing:border-box;}
.board-three-button form button.delete-button{height:50px !important;}
.board-three-button form {max-width:100px;margin:0 !important;padding:0 !important;}
.no-pc{display:none;}
@media (max-width: 768px) {
	h1{
		font-size:1.4em;
	}
	.content-area { max-width: 100%;}
	.board-wrapper{
	   flex-direction: column;
	   max-width:100%;
	}
  .sidebar {
    width: 100%;
    border: none;
    background-color: #fff;
    padding: 0;
    margin-bottom: 20px;
	margin-right:0;
	overflow: hidden; /* 세로 스크롤 방지 */
  }
  .bold{font-weight:bold;}
  .no-m{display:none;}
  .no-pc{display:block;text-align:right;margin-top:7px;font-size:11px;}
  .on-m{display:inline-block;}
  .sidebar h3 {
    text-align: left;
    font-size: 1em;
    margin-bottom: 10px;
  }
	.scroll-wrapper {
	  width: 100%;
	}
	  .sidebar ul {
	  display: flex;
	  flex-direction: row;
	  flex-wrap: nowrap;
	}
	.sidebar li{
		border-bottom:none;
		padding:0;
		box-sizing:border-box;
	}
	.scroll-list {
	  display: flex;
	  flex-direction: row;
	  flex-wrap: nowrap;
	  white-space: nowrap;
	  list-style: none;
	  padding: 0;
	  margin: 0;
	  min-width: 100%;
	}

	.scroll-list li {
	  flex: 0 0 auto;
	  border:1px solid #ccc;
	  border-right:none;
	  border-radius: 10px 10px 0 0;
	  width:25%;
	  box-sizing:border-box;
	  background:#eee;
	}
	.scroll-list li:last-child{
		border-right:1px solid #ccc;
		border-bottom:1px solid #ccc;
	}
	.scroll-list li a {
		display:inline-block;
		text-align:center;
		width:100%;
		padding:5px;
		box-sizing:border-box;
		color:#333;
	}
	.sidebar ul li.active{
		background:#072a82;
	}
	.scroll-list li.active a {
	  border-bottom: 3px solid #000;
	  color:#fff;
	}
	.m-category{
		width:15%;
		border-right: none !important;
	}
	.m-category span.m-bg{
		padding:5px;
		color:#fff;
		font-size:12px;
		background:#114fed;
		width:100%;
		display:inline-block;
		border-radius:20px;
		box-sizing:border-box;
	}
	.m-title{
		border:none !important;
		border-bottom:1px solid #ccc !important;
	}
	.board_list_table td{
		padding:5px;
	}
}