@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/************************************
** ■カテゴリーのカスタマイズ
************************************/
/************************************
** ■カテゴリーのカスタマイズ（青基調）
************************************/
.widget_categories ul li a{ /*親カテゴリー設定*/
  text-decoration: none; /*テキスト装飾無し*/
  color: #333; /*文字色*/
  font-size: 15px; /*フォントサイズ*/
  display: block; /*ブロックボックス生成*/
  padding: 4px 4px 2px 10px; /*上下左右空間*/
  border-bottom: 1px dashed #bbdefb; /*親カテゴリー下側に青系のボーダーライン*/
}
.widget_categories ul li a::before{ /*親カテゴリーのアイコン設定*/
  font-family: FontAwesome;
  content: "\f07c";
  color: #2196f3; /*明るい青色*/
  padding-right: 6px; /*アイコン右側空間*/
}
.widget_categories > ul > li > a:first-child{ 
  border-top: none; /*最初の親カテゴリー上側のボーダー削除*/
}

.widget_categories ul li ul li a{ /*子カテゴリー設定*/
  text-decoration: none; /*テキスト装飾無し*/
  color: #333; /*文字色*/
  display: block; /*ブロックボックス生成*/
  padding: 4px 4px 2px 10px; /*上下左右空間*/
  border-bottom: 1px dashed #bbdefb; /*子カテゴリー下側に青系のボーダーライン*/
}
.widget_categories ul li ul li a::before{ /*子カテゴリーのアイコン*/
  font-family: FontAwesome;
  content: "\f115";
  color: #1976d2; /*少し濃いめの青色*/
  padding: 0px 6px 0px 2px; /*アイコン右側空間*/
}

.widget_categories ul li a .post-count{ /*記事数設定*/
  display: inline-block; /*インラインボックス生成*/
  float: right; /*右寄せ配置*/
  margin-left: 8px; /*右側空間*/
  color: #2196f3; /*文字色*/
  background: #e3f2fd; /*薄い水色の背景*/
  font-weight: bold; /*強調フォント*/
  font-style: oblique; /*斜体フォント*/
  font-size: 12px; /*フォントサイズ*/
  white-space: nowrap; /*折り返し無し*/
  line-height: 1.1; /*行の高さ*/
  padding: 3px 10px; /*上下左右空白*/
  text-decoration: none; /*テキスト装飾無し*/
  border-radius: 2px; /*角丸コーナー*/
}

.widget_categories ul li a:hover{ /*マウスホバー時設定*/
  background: #e3f2fd; /*薄い水色の背景*/
  color: #333; /*文字色*/
  transition: all 0.8s ease; /*アニメーション*/
}
.widget_categories ul li a:hover .post-count{ /*記事数のマウスホバー時設定*/
  background: #2196f3; /*青色の背景*/
  color: #fff; /*文字色を白に*/
  transition: all 0.8s ease; /*アニメーション*/
}

/************************************
** ■アーカイブのカスタマイズ（青基調）
************************************/
.widget_archive ul li a{ /*アーカイブリンク設定*/
  text-decoration: none; /*テキスト装飾無し*/
  color: #333; /*文字色*/
  font-size: 15px; /*フォントサイズ*/
  display: block; /*ブロックボックス生成*/
  padding: 4px 4px 2px 10px; /*上下左右空間*/
  border-bottom: 1px dashed #bbdefb; /*下側のボーダーライン*/
}

.widget_archive ul li a::before{ /*カレンダーアイコンの設定*/
  font-family: FontAwesome;
  content: "\f073"; /*カレンダーのアイコンコード*/
  color: #2196f3; /*青色*/
  padding-right: 6px; /*アイコン右側空間*/
}

.widget_archive > ul > li > a:first-child{ 
  border-top: none; /*最初の項目の上側ボーダー削除*/
}

.widget_archive ul li a .post-count{ /*記事数（投稿数）の設定*/
  display: inline-block; /*インラインボックス生成*/
  float: right; /*右寄せ配置*/
  margin-left: 8px; /*右側空間*/
  color: #2196f3; /*文字色*/
  background: #e3f2fd; /*薄い水色の背景*/
  font-weight: bold; /*強調*/
  font-style: oblique; /*斜体*/
  font-size: 12px; /*サイズ*/
  white-space: nowrap; /*折り返し無し*/
  line-height: 1.1; /*行の高さ*/
  padding: 3px 10px; /*余白*/
  text-decoration: none;
  border-radius: 2px; /*角丸*/
}

.widget_archive ul li a:hover{ /*マウスホバー時*/
  background: #e3f2fd; /*背景を薄い水色に*/
  color: #333; /*文字色*/
  transition: all 0.8s ease;
}

.widget_archive ul li a:hover .post-count{ /*記事数のマウスホバー時*/
  background: #2196f3; /*背景を青に*/
  color: #fff; /*文字色を白に*/
  transition: all 0.8s ease;
}

/************************************
** ■プロフィールウィジェットのカスタマイズ（青基調）
************************************/
.author-content {
  font-size: 14px;
  color: #555;
  line-height: 1.6;
}


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
