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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/************************************
 目次のカスタマイズ（始まります）
************************************/

/*******************
 サイドバー追尾目次（始め）
********************/
.sidebar-scroll{
  top:40px !important;
}
.sidebar h3{
  font-size:0.9em;
  padding: 7px 12px;

}

.sidebar .toc-widget-box{
  margin-top: -0.9em;
	box-shadow: 0 2px 10px rgba(0, 0, 0, .08);
}
.sidebar .toc{
  padding: 0;
  width:100%;
}
.sidebar .toc-content {
  overflow-y: scroll;
  max-height: 390px;/*どれくらいの高さまでいったらスクロールにするか*/
  background: #fff;
  padding: 0.5em 1.5em;
}
.sidebar .toc li{
  line-height:1.6;
  margin-bottom: 1em;
  font-size:0.85rem;
  color:#3cb8f1;/*数字の色を変える*/
}
.sidebar .toc-content > ol  > li,.sidebar .toc-content > ul  > li{
  font-weight:600;
  padding-left: 0.5em;
}
.sidebar .toc-content a{
  letter-spacing:0.5px;
}
.sidebar .toc .toc-list ul, .sidebar .toc .toc-list ol {
  margin: 1em 0;
  list-style-type:none;
  font-weight:500;
}
@media screen and (max-width: 768px){
  .sidebar-menu-button .widget_toc{
    display:none;
  }
}

/**********************
 サイドバー追尾目次（終わり）
**********************/

/* 目次全体の定義です。paddingの値を変えたりmarginを追加してお好みのポジションを探してみてください。*/
.toc {
  display: block;
  padding: 0px;
	max-width: 500px;
 }

/* 目次タイトル(目次[閉じる])と表示されている部分です。フォントや背景の色など */
.toc-title {
  position: relative;
  padding: 10px 0;
  color: #7d6c61;
	background: #efefef;
	font-weight:bold;
 }

/* タイトルより下の目次が表示される部分です。こちらもpaddingで全体の位置を調整してみて下さい。*/
.toc .toc-content {
  padding: 15px 30px;
 }

/* 目次のタイトル部分にアイコンを追加する */
.toc-title:before {
  font-family: 'Font Awesome 5 Free';  /* Font Awesome 5を使用するために指定 */
  content : "\f02d";  /* Font Awesome 5のアイコン番号 */
  font-size:20px;  /* アイコンの大きさ */
  margin-right:10px;  /* アイコン右の余白 */
  color:#a8bcc8;  /* アイコンの色 */
  background-color:#ffffff;  /* アイコンの背景の色 */
  border-radius: 50%;  /* アイコンの背景を丸くする */
  padding:8px;  /* アイコン背景の余白 */	
	font-weight: bold;/*アイコンを太字にする※消したらアイコンごと消える！！*/
}

/*目次の左揃え*/
.toc-title{
	text-align: left;
	padding-left: 25px ;
}
/************************************
 目次のカスタマイズ（終わります）
************************************/






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

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

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