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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/*記事タイトル色  */
.article h1,h2,h3,h4,h5,h6 {
    color: #800040;
}
/* 記事内のリンク */
.entry-content a:visited {
  color: #129588; /* 訪問済みの色 */
} 

/*ボックスメニュー色  */
.box-menu-icon{
  color:#DF81A2;
}

.box-menu:hover {
    box-shadow: inset 2px 2px 0 0 
#d13af1,2px 2px 0 0 #d13af1,2px 0 0 0 #d13af1,0 2px 0 0
    #d13af1;
} 

/*----------------------*/
/* 引用  */
/*----------------------*/
blockquote {
    position: relative;
    padding: 7px 16px;
    box-sizing: border-box;
    font-style: normal !important;
    font-weight: normal;
    color: #464646;
    background-color: #fff7f7; 
    border: solid 1px #DF81A2;
}
blockquote cite {
	margin: 5px 0 0;
	display: block;
	}
blockquote:before {
   display: inline-block;
    position: absolute;
    top: -10;
    left: 0;
    width: 27px;
    height: 27px;
    text-align: center;
    content: "\f10d";
    font-family: "Font Awesome 5 Free";
    color: #FFF;
    font-size: 14px;
    line-height: 30px ;
    background: #DF81A2;
    font-weight: 900;　　　　　　　
}	
blockquote:after {
   display: inline-block;
    position: absolute;
    bottom: : -10;
    right: 0;
    width: 27px;
    height: 27px;
    text-align: center;
    content: "\f10e";
    font-family: "Font Awesome 5 Free";
    color: #FFF;
    font-size: 14px;
    line-height: 30px ;
    background: #DF81A2;
    font-weight: 900;　　　　　　　
}	


/*サイドバー見出し色*/
.sidebar h3 {
  background-image: repeating-linear-gradient(90deg,
    #64C99B 0%,#64C99B 50%,#DF81A2 50%,#DF81A2 100%);
  color: white;
}
/*親カテゴリーのカスタマイズ*/
.widget_categories ul li a{ 
  border-bottom: 1px dashed #CCCCCC; /* 下線の種類 */
}
.widget_categories ul li a::before{
  font-family: "Font Awesome 5 Free"; /*バージョン指定*/
  content: "\f1bb"; /* FontAwesomeのユニコード */
  color:#64C99B; /* アイコンの色 */
  padding-right: 6px; /*アイコン右側空間*/
  font-weight: 900; /*アイコンの太さ*/
}

.widget_categories > ul > li > a:first-child{ 
  border-top: none; /*最初の親カテゴリは上部ボーダーを消す*/
}

/*子カテゴリーのカスタマイズ*/
.widget_categories ul li a{ 
  border-bottom: 1px dashed #CCCCCC; /* 下線の種類 */
}
.widget_categories ul li ul li a::before{ /*子カテゴリーのアイコン*/
  font-family: "Font Awesome 5 Free"; /*バージョン指定*/
  content: "\f105"; /* FontAwesomeのユニコード */
  color:#64C99B; /* アイコンの色 */
  padding-right: 6px; /*アイコン右側空間*/
  font-weight: 900; /*アイコンの太さ*/
}

/*ヘッダーメニュー*/
#navi .navi-in > .menu-header .sub-menu {
    background-color: #DDDD00;
}
.navi-in>ul>li:nth-of-type(3n + 1),
.navi-in>ul>li:nth-of-type(3n + 2),
.navi-in>ul>li:nth-of-type(3n + 3){
  border:none;
}
.navi-in>ul>li:nth-of-type(even) {
  border-bottom: ridge 3px #e1a5cb;
}
.navi-in>ul>li:nth-of-type(odd) {
  border-bottom: ridge 3px #a52175;
}

/*スマホメニューをスクロール*/
@media screen and (max-width: 834px) {
  #navi .navi-in > .menu-mobile {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
    text-align: left;
  }

  #navi .navi-in > .menu-mobile li {
    display: inline-block;
    width: auto;
  }

  #navi .navi-in > .menu-mobile li a {
    padding: 0 1.5em;
  }
}
/* 目次全体デザイン */
.toc{
    background:#FFF9F6; /* 目次全体の背景色を変える場合はここを変更 */
  　border:none;
    border-top:5px solid;
    border-top-color:#FFC679;
    box-shadow: 0 2px 2px rgba(0,0,0,0.2);
    padding: 20px 25px;
	display: table;
    margin-left: auto;
    margin-right: auto;
}
/* 目次の文字指定 */
.main .toc {
	padding: 0;
	border-radius: 2px;
	overflow: hidden;
}

.toc-title {
	background-color:#64C99B ;
	color: #fff;
	font-size: 1.3em;
	font-weight: 700;
	text-align: center;
}

.toc-title::after {
	font-weight: 400;
}
/* 目次のデザインカスタマイズ */
.toc-content {
   border: 2px solid #64C99B!important; 
}
.toc-content ol {
    padding: 0 0.5em;
    position: relative;
}
.toc-content ol li {
    line-height: 1.5;
    padding: 0.7em 0 0.5em 1.4em;  
    list-style-type: none!important;
}
/* 目次の各節の先頭にあるアイコンを設定 */
.toc-content ol li:before {
    font-family: "Font Awesome 5 Free";
    content: "\f138"; /* アイコンを変える場合はここを変更 */
    position: absolute;
    left : 0.5em;
    color: #DF81A2; /* 色を変える場合はここを変更 */
    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以降の文字サイズを普通に */
}

/* 見出し */
#content article h2 {
  position: relative;
  text-shadow: 0 0 2px white;
  background: #f9d9e0;
  z-index: -4;
  border-radius: 0 10px 10px;
}


/*固定ページの日付非表示*/
.post-2 .date-tags,
.post-14 .date-tags,
.post-25 .date-tags,
.post-28 .date-tags,
.post-40 .date-tags,
.post-44 .date-tags,
.post-46 .date-tags,
.post-48 .date-tags,
.post-50 .date-tags,
.post-52 .date-tags,
.post-59 .date-tags,
.post-74 .date-tags,
.post-177 .date-tags,
.post-368 .date-tags,
.post-546 .date-tags{
display: none;
}
/* サイド背景 */
.sidebar {
  background-color: #FFF9F6;
}

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

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

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