.custom-pagination .page-item .page-link {
  background-color: #f8f9fa;
  /* グレー系の背景色 */
  border: 1px solid #dee2e6;
  /* 境界線 */
  color: #6c757d;
  /* グレー系の文字色 */
  font-size: 0.875rem;
  /* 小さなフォント */
}

.custom-pagination .page-item.active .page-link {
  background-color: #c6c6c6;
  /* アクティブなページの青背景 */
  border-color: #c6c6c6;
  /* アクティブなページの境界線 */
  color: #fff;
  /* アクティブなページの文字色 */
}

.custom-pagination .page-item.disabled .page-link {
  color: #adb5bd;
  /* 無効化されたボタンの文字色 */
}

.custom-pagination {
  justify-content: center;
  /* 中央揃え */
  margin-top: 1rem;
  /* 上に余白 */
}

.editable-area {
  width: 100%;
  height: 44px;
  border: 1px solid #ccc;
  padding: 10px;
  margin-bottom: 20px;
  background-color: #f9f9f9;
}