@charset "UTF-8";

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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
#main .button-caption {
	display: none; /*キャプション非表示*/
}

/*SNSシェアボタン*/
.sns-share-buttons {
	flex-wrap: nowrap;	/*折り返さない*/
/*	justify-content: start;*/		/*左寄せ*/
	justify-content: center;		/*真ん中*/
/*	justify-content: flex-end;*/		/*右寄せ*/

}
.sns-share-buttons a {
	border-radius: 50%;	/*丸くする*/
	font-size: 20px;	/*丸枠の中の、アイコンのサイズ*/
	margin: 4px;		/*ボタン同士の間隔*/
}
#main .sns-share a {
	width: 35px;			/*ボタンの横幅*/
	height: 35px;			/*ボタンの高さ*/
	margin-bottom: 0.5em;	/*ボタンの下の余白を、0.5文字分にする */
}
/*SNSフォローボタン*/
.sns-follow-message{
	font-weight: bold; /*太字にする*/
	color: #875d5b; /*文字色を指定*/
}
.sns-follow-buttons {
	justify-content: center; /*中央揃え*/
}
.sns-follow-buttons a {
	border-radius: 50%; /*アイコンを丸くする（カスタマイズを！）*/
	font-size: 20px; /*アイコンのサイズ（カスタマイズを！）*/
	margin: 0 5px; /*ボタンの間隔（カスタマイズを！）*/
}
#main .sns-follow a {
	width: 40px; /*ボタンの横幅（カスタマイズを！）*/
	height: 40px; /*ボタンの高さ（（カスタマイズを！）*/
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

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

/*480px以下*/
@media screen and (max-width: 480px){
  /* アピールエリア */
@media screen and (max-width: 769px) {
	div.appeal-in {
		display: none;
	}
　//** サイドカテゴリ開始 **/
.widget_categories ul li a,
.widget_archive ul li a {
    display: block;
    font-size: 85%;
    margin: 0;
    position: relative;
    border-bottom: dotted 1px #CCC;
}
.widget_categories ul li a::after,
.widget_archive ul li a::after{
    font-family: "fontawesome";
    content: '\f105';
    position: absolute;
    right: 0.2em;
    font-size: 1em;
    color: #1a1a1a;
}
.widget_recent_entries ul li a:hover, .widget_categories ul li a:hover, .widget_archive ul li a:hover, .widget_pages ul li a:hover, .widget_meta ul li a:hover, .widget_rss ul li a:hover, .widget_nav_menu ul li a:hover {
    background-color: #ffffcc!important;
}
.widget_archive ul li a .post-count,
.widget_categories ul li a .post-count {
    float: initial;
    display: initial;
}

.widget_archive ul li a .post-count::after, .widget_categories ul li a .post-count::after {
    content: ')';
}
.widget_archive ul li a .post-count::before, .widget_categories ul li a .post-count::before {
    content: '(';
}
/** サイドカテゴリ終了 **/*必要ならばここにコードを書く*/
}

	
	/* 目次全体デザイン */
.toc{
    background:#F9F9F9; /* 目次全体の背景色を変える場合はここを変更 */
    border:none;
    display:block;
    border-top:5px solid;
    border-top-color:#1f9dc4;
    box-shadow: 0 2px 2px rgba(0,0,0,0.2);
    padding: 10px 5px;
}
/* 目次の文字指定 */
.toc-title {
    text-align:center;
    margin: 0 20px 20px -10px;
    padding-left: -20px;
    font-size: 20px;
    font-weight: 700;
    color:#1f9dc4; /* 目次の文字色を変える場合はここを変更 */
}
/* 目次のアイコン設定 */
.toc-title:before {
    top: 0;
    left: -35px;
    width: 30px;
    height: 30px;
    font-family: "Font Awesome 5 Free";
    content : "\f03a"; /* アイコンを変える場合はここを変更 */
    font-size:18px;
    margin-right:5px;
    color:#FFF; /* アイコンの色を変える場合はここを変更 */
    background-color:#1f9dc4; /* アイコンの背景色を変える場合はここを変更 */
    border-radius: 30%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    padding:6px;
}
/* 目次のデザインカスタマイズ */
.toc-content ol {
    padding: 0 0.5em;
    position: relative;
}
.toc-content ol li {
    line-height: 1.5;
    padding: 0.3em 0 0.3em 1.4em;
    border-bottom: dashed 1px silver;
    list-style-type: none!important;
}
/* 目次の各節の先頭にあるアイコンを設定 */
.toc-content ol li:before {
    font-family: "Font Awesome 5 Free";
    content: "\f138"; /* アイコンを変える場合はここを変更 */
    position: absolute;
    left : 0.5em;
    color: #1f9dc4; /* 色を変える場合はここを変更 */
    font-weight: bold;
}
.toc-content ol li:last-of-type {
    border-bottom: none;
}
.toc-content .toc-list li {
    font-weight:700; /* h2のみ太文字に */
}
.toc-content .toc-list li li {
    font-weight:normal; /* h3以降の文字サイズを普通に */
}
	
	
/*---------------------------------
複数の固定ページの日付を非表示にする
--------------------------------*/
.post-730 .date-tags,
.post-1459 .date-tags,	
.post-1759 .date-tags,
.post-4534 .date-tags,
.post-664 .date-tags {
  display: none;
}
/* --- 前半の設定 --- */
header .sitename {
  font-size: 100%;
}

#footer .footerlogo {
  font-size: 100%;
}

/* 人気記事表示 */
.popular-entry-cards.large-thumb {
  display: flex;
  flex-wrap: wrap;
}

.popular-entry-cards.large-thumb a {
  width: 25%;
}

/* 768px以下 */
@media screen and (max-width: 768px) {
  .popular-entry-cards.large-thumb a {
    width: 50%;
  }
}

/* 480px以下 */
@media screen and (max-width: 480px) {
  .popular-entry-cards.large-thumb a {
    width: 100%;
  }
}

/* 固定ページの日付非表示 */
.post-1759 .date-tags,
.post-1491 .date-tags,
.post-664 .date-tags,
.post-730 .date-tags,
.post-1459 .date-tags,
.post-635 .date-tags {
  display: none;
}

.single .site-logo-image {
  display: none;
}

.cat-label, .post-categories {
  display: none !important;
}

#navi-menu-input {
  display: none;
}

#navi-menu-content {
  display: block !important;
}

/* --- 目次全体デザイン --- */
.toc {
  background: #F9F9F9;
  border: none;
  display: block;
  border-top: 5px solid;
  border-top-color: #1f9dc4;
  box-shadow: 0 2px 2px rgba(0,0,0,0.2);
  padding: 10px 5px;
}

/* 目次の文字指定 */
.toc-title {
  text-align: center;
  margin: 0 20px 20px -10px;
  padding-left: -20px;
  font-size: 20px;
  font-weight: 700;
  color: #1f9dc4;
}

/* 目次のアイコン設定 */
.toc-title:before {
  top: 0;
  left: -35px;
  width: 30px;
  height: 30px;
  font-family: "Font Awesome 5 Free";
  content: "\f03a";
  font-size: 18px;
  margin-right: 5px;
  color: #FFF;
  background-color: #1f9dc4;
  border-radius: 30%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  padding: 6px;
}

/* 目次のデザインカスタマイズ */
.toc-content ol {
  padding: 0 0.5em;
  position: relative;
}

.toc-content ol li {
  line-height: 1.5;
  padding: 0.3em 0 0.3em 1.4em;
  border-bottom: dashed 1px silver;
  list-style-type: none !important;
}

/* 目次の各節の先頭にあるアイコンを設定 */
.toc-content ol li:before {
  font-family: "Font Awesome 5 Free";
  content: "\f138";
  position: absolute;
  left: 0.5em;
  color: #1f9dc4;
  font-weight: bold;
}

.toc-content ol li:last-of-type {
  border-bottom: none;
}

.toc-content .toc-list li {
  font-weight: 700;
}

.toc-content .toc-list li li {
  font-weight: normal;
}