@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
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/


/*↓メニュー角丸*/
a.navi-entry-card-link.widget-entry-card-link.a-wrap{
border-radius:20px!important;
margin:1em .5em;
transform: scale(0.8);
margin: -10px; /下マージン/
}



/*ここまでメニュー角丸*/

#navi .navi-in a:after{
	position: absolute;
	content: "";
	left: 0px;
	bottom: 1px;
	height: 2px;
	width: 100%;
	background: #600;
	transform: scale(0,1);
	transition: 0.5s;
}
@media screen and (min-width: 980px) {
	#navi .navi-in a:hover:after{
		transform: scale(1);
	}
}

.entry-card-wrap {
  border-radius: 10px;
}

/* 目次アイコン */
.toc-list > li a::before {
font-family: "Font Awesome 5 Free";
content : "\f1b0";
font-weight: 900;
margin-right: 6px;
color: #ffa500; 
}

.toc-list > li li a::before {
content: "";
width: 7px;
height: 7px;
left: -2px;
display: inline-block;
border-radius: 50%;
background: #ffa500;/こちらで緑点の色を変更できます/
position: relative;
margin-bottom: 4px;
}

.toc-title:before {
font-family: "Font Awesome 5 Free";
content : "\f328";
margin-right: 7px;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
a.navi-entry-card-link.widget-entry-card-link.a-wrap{
margin: -5px; /下マージン/
}

}


/*カテゴリーウィジェットのデザインのカスタマイズ（アイコン）*/
/*ここから*/
/************************/
/*カテゴリーウィジェット*/
/************************/
#sidebar aside li.cat-item a {
font-size: 15px;
padding: 6px;
}
#sidebar aside li.cat-item a:hover {
color: #ff9f67; /*ホバー色*/
}
.cat-item a::before {
color: #ff9f67;
font-family: "Font Awesome 5 Free";
content : "\f1b0";
font-weight: 900;
margin-right: 6px;
}
.cat-item .children a::before {
font-family: "Font Awesome 5 Free";
content : "\f1b0";
font-weight: 900;
margin-right: 6px;
	
}
#sidebar aside li.cat-item span { /*投稿数*/
float: right;
line-height: 1;
padding: 6px;
border-radius: 5px;
color: #fff;
background: #ff9f67;
}
/************************/
/*タグクラウド*/
/************************/
.widget_tag_cloud .tagcloud a{
border: solid 1px #ff9f67; /*枠線色*/
color:#ff9f67; /*文字色*/
margin-bottom:5px;
border-radius:5px; /*角丸め*/
flex: 0 1 auto; /*横幅いっぱいにならないように*/
}
.widget_tag_cloud .tagcloud a:hover{
background: radial-gradient(#ba9441, #ff9f67); /*ホバー背景色*/
color:#fff; /*ホバー文字色*/
}
/*ここまで*/


/* ウィジェット アーカイブ
-------------------------------------------------- */
.widget_archive ul li {
  /*親カテゴリ*/
  padding-left: 10px;
  border-bottom: 1px dotted rgba(125, 125, 125, 0.2);
  /*カテゴリ間の下線種類*/
}

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

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

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

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

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