.diff-container {
  display: flex;
  justify-content: space-between;
  gap: 20px; /* 左右の間隔 */
  overflow-x: auto; /* diff-container 全体に横スクロールを適用 */
}

.code-block {
  width: 48%;
  background-color: #f4f4f4;
  padding: 10px;
  border-radius: 5px;
  max-height: 400px; /* 必要に応じて高さを制限 */
  overflow: auto; /* ここでコードブロック自体にスクロールを適用 */
  display: flex;
  flex-direction: column;
}

pre{
  margin-bottom: 0; /* コードブロックの下部の余白を削除 */
}

.code-content {
  white-space: pre; /* 折り返さずにそのまま表示 */
  font-family: monospace;
  font-size: 14px;
  line-height: 1.2; /* 行間を詰める */
  width: fit-content; /* コードの幅に合わせて調整 */
  min-width: 100%; /* ブロック内に横スクロールバーを付ける */
}

.highlight-change {
  background-color: yellow; /* 変更箇所をハイライト */
}

.highlight-import {
  background-color: lightblue;  /* 水色の背景 */
  font-weight: bold;
}

.conttainer {
  margin-top: 50px;
}