/*
  This css file is for individual users to restyle items for their personal site,
  or for the implementation of features specifically for their site. Anything that
  is an official part of the theme (ex. Pull Requests) should be included in main.css
  and follow the formatting and style given.
*/
.widget_categories ul li {
  /*親カテゴリ*/
  padding-left: 10px;
  border-bottom: 1px dotted rgba(125, 125, 125, 0.2);
  /*カテゴリ間の下線種類*/
}

.widget_categories ul li a {
  /*リンク*/
  font-size: .95rem;
}

.widget_categories ul li a .post-count {
  /*記事数*/
  border: 1px solid rgba(221, 221, 221, 0.867);
  /*囲い*/
  border-radius: 5px;
  /*ボーダーの丸み*/
  font-size: .8em;
  /*数字サイズ*/
  padding: 1px 10px;
  /*囲いの大きさ*/
}

.widget_categories ul li a:before {
  /*アイコン*/
  font-family: "Font Awesome 5 Free";
  content: "\f138";
  /*種類*/
  color: #ff9f67;
  /*色*/
  margin-right: 6px;
  /*アイコンと文字の距離*/
  font-weight: bold;
}

.widget_categories ul li a:hover {
  /*ホバー*/
  background: transparent;
  margin-left: 5px;
  /*hover時動く幅*/
  background-color: #efefef;
}

.widget_categories ul li a:hover .post-count {
  border-color: #ffb47f;
  /*囲線色*/
  background: #ff9f67;
  /*背景色*/
  color: #fff;
  /*文字色*/
  transition: .4s;
  /*変化スピード*/
}

.widget_categories ul .children li {
  /*子カテゴリ*/
  border-bottom: none;
}

.widget_categories ul .children li a {
  /*リンク*/
  padding: 3px 10px;
  font-size: .85rem;
  /*文字サイズ*/
}

.widget_categories ul .children li a:before {
  /*アイコン*/
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  /*種類*/
  color: #ff9f67;
  /*色*/
  font-weight: normal;
  margin-right: 6px;
  /*アイコンと文字の距離*/
  font-weight: bold;
}

/* 記事一覧の画像表示カスタマイズ */
.list__thumbnail {
  margin-bottom: 1rem;
}

.list__thumbnail .thumbnail__image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  border-radius: 8px;
  transition: transform 0.3s ease;
}

.list__thumbnail .thumbnail__link:hover .thumbnail__image {
  transform: scale(1.02);
}

/* タグスタイルのカスタマイズ */
.tags__item {
  margin-bottom: 0.25rem;
}

.tags__link {
  background-color: #f0f0f0;
  color: #333;
  padding: 0.25rem 0.5rem;
  border-radius: 12px;
  font-size: 0.875rem;
  text-decoration: none;
  transition: all 0.3s ease;
}

.tags__link:hover {
  background-color: #ff9f67;
  color: white;
  transform: translateY(-1px);
}