/* 独自のクラスを定義し、他のスタイルに干渉しないように設定 */
    .custom-rules-list {
      list-style: none; /* デフォルトのリストスタイルを無効化 */
      padding-left: 0; /* 左側の余白を削除 */
    }
    .custom-rules-list li {
      position: relative; /* 擬似要素の位置指定のために必要 */
      padding-left: 2.5em; /* テキストの左側に十分なスペースを確保 */
      margin-bottom: 0.5em; /* 各項目の間に適度な余白を設定 */
      text-transform: uppercase; /* テキストをすべて大文字に変換 */
      font-weight: bold; /* 太文字に設定 */
      font-size: 1.5em; /* テキストを大きく設定 */
    }
    .custom-rules-list li::before {
      content: "✅️"; /* チェックマークを表示 */
      position: absolute; /* 絶対位置指定 */
      left: 0; /* 左端に配置 */
      top: 50%; /* 垂直方向に中央揃え */
      transform: translateY(-50%); /* チェックマークを中央に調整 */
      font-size: 1.3em; /* チェックマークのサイズも大きく設定 */
      line-height: 1; /* 行の高さを調整 */
    }
    .additional-text {
      font-size: 1.3em; /* リストと同じフォントサイズを適用 */
      font-weight: bold; /* 太文字に設定 */
      margin-top: 1em; /* リストとの間に適度な余白を追加 */
      text-align: left; /* 左揃え */
    }


.copy-button-container {
  display: flex; /* Flexbox を使用 */
  align-items: center; /* 縦方向中央揃え */
  width: 100%; /* 横幅をいっぱいにする */
  margin-bottom: 20px;
}

.copy-button-container input {
  flex-grow: 1; /* 入力欄を可能な限り広げる */
  font-size: 1.2em;
  font-weight: bold;
  padding: 8px;
  border: 1px solid #ccc;
  border-radius: 5px;
  margin-right: 10px; /* ボタンとの間隔 */
}

.copy-button-container button {
  /* ボタンのスタイルは必要に応じて調整 */
  padding: 8px 15px;
  background-color: #333;
  color: #fff;
  border: none;
  border-radius: 5px;
  font-size: 1em;
  cursor: pointer;
  white-space: nowrap; /* ボタンのテキストが折り返さないようにする */
}