body {
   	margin: 0;
   	font-family: Arial, sans-serif;
   	background-color: #FFFFFF;
   	overflow-x: hidden;
   	display: flex;
   	flex-direction: column;
   	min-height: 100vh;
   	/* 화면 전체 높이 */
   }

.container {
	display: flex;
	gap: 20px;
	margin-left: 7%;
	margin-right: 7%;
	flex: 1; /* 여유 공간 모두 차지해서 footer를 아래로 밀어줌 */
}

   .main-content {
   	padding-left: 5%;
   	padding-top: 5%;
   	flex: 1;
   }

   .news-grid {
   	display: grid;
   	grid-template-columns: repeat(5, 1fr);
   	gap: 20px;
   	margin-top: 3%;
   }

   /* 각 뉴스 카드의 기본 스타일 (링크 전체가 카드로 작동) */
   .news-card {

   	width: 200px;
   	height: 220px;
   	max-width: 300px;
   	border: 1px solid #ddd;
   	border-radius: 8px;
   	text-align: center;

   }



   /* 썸네일 이미지: 200px × 200px, object-fit: cover 로 이미지 비율 유지 */
   .news-card img {
   	width: 160px;
   	height: 160px;
   	border-radius: 4px;
   	margin-bottom: 0.5rem;
   }

   /* 이미지 아래의 텍스트 영역 */
   
.news-link{
	width: 200px;
}
   /* 제목 스타일 */
   .news-title {
	   width: 100%;      
  font-size: 14px;          /* 폰트 크기 */
  font-weight: bold;
  margin-bottom: 5px;
  box-sizing: border-box;  
  word-break: keep-all;
  white-space: normal; /* 패딩/테두리 포함 너비 계산 */
  
   }

   /* 내용 요약 스타일 */
   .news-summary {
   	font-size: 14px;
   	color: #555;
   }

   /* 왼쪽 사이드바 (세로 배치, 고정 폭) */
   .sidebar {
   	width: 180px;
   	min-width: 180px;
   	background-color: #D6CCC2;
   	border: 1px solid #D5BDAF;
   	display: flex;
   	flex-direction: column;
   	padding: 0 10px 10px;
   	box-sizing: border-box;
   	flex-shrink: 0;
   	/* Flex 레이아웃 환경에서 축소되지 않도록 설정 */
   }

   .sidebar-title {
   	margin: 0 -10px 10px;
   	width: calc(100% + 20px);
   	padding: 12px 10px;
   	text-align: center;
   	background-color: #F5EBE0;
   	border-bottom: 1px solid #D5BDAF;
   	font-size: 18px;
   	font-weight: bold;
   	color: #333;
   	
   	word-break: keep-all;
  white-space: normal;
   }

   /* 사이드바 내부 버튼: 부모 패딩 보정을 위해 좌우 여백 없이 꽉 채움 */
   .sidebar .menu-button {
   	width: 100%;
   	border: none;
   	padding: 12px;
   	background-color: #F5EBE0;
   	border-bottom: 1px solid #D5BDAF;
   	font-size: 16px;
   	color: #333;
   	cursor: pointer;
   	transition: background-color 0.3s;
   	box-sizing: border-box;
   	 word-break: keep-all;

   }

   .sidebar .menu-button:hover {
   	background-color: #E3D5CA;
   }

   .sidebar .menu-button.active {
   	background-color: #D5BDAF;
   	color: white;
   	font-weight: bold;
   }



   /* 페이지네이션 스타일 */
   .pagination {
   	list-style: none;
   	display: flex;
   	justify-content: center;
   	padding: 0;
   	margin-top: 20px;
   	margin-bottom: 20px;
   }

   .pagination li {
   	margin: 0 5px;
   }

   .pagination li a {
   	display: block;
   	padding: 8px 12px;
   	background: #F5EBE0;
   	/* 기본 버튼 색상으로 통일 */
   	color: #333;
   	text-decoration: none;
   	border: 1px solid #D5BDAF;
   }

   .pagination li.active a {
   	background: #D5BDAF;
   	/* 활성화된 페이지 */
   	color: #fff;
   	border-color: #D5BDAF;
   }

   .pagination li.disabled a {
   	color: #ccc;
   	pointer-events: none;
   }