@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    1.1.0
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
h2 {
  background-color: #74B0FF !important ; /*背景色*/
  padding: 0.5em;/*文字周りの余白*/
  color: white;/*文字を白に*/
  border-radius: 0.5em;/*角の丸み*/
}
h4{
	border: none !important ;
  position: relative;
}

h4:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 7px;
  background: -webkit-repeating-linear-gradient(-45deg, #74B0FF, #74B0FF 2px, #74B0FF 2px,#74B0FF 4px);
  background: repeating-linear-gradient(-45deg, #74B0FF, #74B0FF 2px, #fff 2px, #fff 4px);
}
h3 {
	border-left: none !important;
	border-right: none !important;
  color: #6cb4e4;
  text-align: center;
  padding: 0.25em;
  border-top: solid 2px #6cb4e4 !important;
  border-bottom: solid 2px #6cb4e4 !important;
  background: -webkit-repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px,#e9f4ff 3px, #e9f4ff 7px);
  background: repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px,#e9f4ff 3px, #e9f4ff 7px);
}

h5 {
	border: none !important;
  position: relative;
  padding: 0.25em 0;
}
h5:after {
  content: "";
  display: block;
  height: 4px;
  background: -webkit-linear-gradient(to right, rgb(255, 186, 115), #b2c4ff);
  background: linear-gradient(to right, rgb(255, 186, 115), #b2c4ff);
}
/*アイキャッチ周り*/
.a-wrap {
    width: 50%;
    float: left;
    height: 205px;
    overflow: hidden;
}
.entry-card-thumb {
    width: 180px;
}
.entry-card-content {
    margin-left: 190px;
}
.entry-card-snippet, .related-entry-card-snippet {
    max-height: 15em;
}


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1240px以下*/
@media screen and (max-width: 1240px){
  /*必要ならばここにコードを書く*/
#notice-area{
	color:#ffffff;
   background-color:#ff7eac;
	border-top: none;
	border-bottom: none;
}
}

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

/*--------------------
#notice-area{
	color:#ffffff;
   background-color:#ff7eac;
	border-top: none;
	border-bottom: none;
}----------------------*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	/*アイキャッチ周り*/
.a-wrap {
    width: 100%;
    float: none;
    height: auto;
    overflow: hidden;
}
.entry-card-thumb {
    width: 33%;
}
.entry-card-content {
    margin-left: 35%;
}
.entry-card-snippet, .related-entry-card-snippet {
    max-height: 15em;
}
/*--------------------
#notice-area {
	background-color:#ffffff;
	color: #ff7eac;
border-top: solid 1px #ff7eac;
    border-bottom: solid 1px #ff7eac;
}----------------------*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
/*--------------------
#notice-area {
	background-color:#ffffff;
	color: #ff7eac;
	border-top: solid 1px #ff7eac;
    border-bottom: solid 1px #ff7eac;
}----------------------*/
	}
/*--------------------
日付非表示
----------------------*/
.post-date {
    display:none;
}

/*********************************
* Cocoon 通知エリア2つ
*********************************/
.twice-notice{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
}
.twice-notice a{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position:relative;
    flex-basis:50%;
    text-align:center;
    color:#fff; /* 文字色 */
    font-size: 0.9em; /* 文字サイズ */
    line-height: 1.4;
    font-weight: bold;
    padding: 1em 2em;
    letter-spacing: 1px;
    text-decoration:none;
}

.twice-notice a:first-child{
    background:#ffffff; /* 左背景色 */
    border-right:1px solid #fff; /* 中央線 */
	color: #000;
}
.twice-notice a:last-child{
    background:#fbee22; /* 右背景色 */
	color: #e8438a;
}
.twice-notice a:hover{
    opacity:0.8;
}
.twice-notice a:after{
    position:absolute;
    top:50%;
    right:1em;
    transform: translateY(-50%);
    font-family:"FontAwesome";
    content:"\f054"; /* 矢印アイコン */
    animation:infinite move-arrow 1.5s; /* 矢印アニメーション */
}
@keyframes move-arrow {
    0%{margin:0 5px 0 -5px;opacity:.3;} /* 矢印アニメーション設定 */
}
/* スマホ */
@media screen and (max-width: 480px){
    .twice-notice a{
        font-size:0.7em; /* 文字サイズ */
    }
    .twice-notice a:after{
        transform: translateY(-50%);
    }
}

/*--------------------------
ヘッダーメニュー追尾
----------------------------*/
#header-container .navi.is-fixed {
position: fixed;
top: 0;
left: 0;
z-index: 2;
width: 100%;
background-color: rgba(255,255,255,0.9);
-webkit-transition: all .4s ease 0s,background .6s ease .2s;
transition: all .4s ease 0s,background .6s ease .2s;
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;

}
#header-container .navi.hide{
transform: translateY(-100%);
}

/*サイドバーカテゴリ*/
.sidebar{
	background:transparent;
}


.widget-sidebar h3{/*サイドウィジェットタイトル*/
	background:transparent;
	font-size:1.2em;/*文字サイズ*/
	border-bottom:2px solid #e8438a;/*下線の太さ・色*/
	padding:5px 10px 0;
	margin-bottom:0;
}

.widget_recommended_cards  h3:before{
	font-family:Fontawesome;
	content:"\f103";/*アイコン種類*/
	color:#845134;/*アイコン色*/
	font-weight:normal;
	margin-right:6px;/*アイコンとタイトルの距離*/
}

.widget_sns_follow_buttons h3:before{/*人気記事タイトルアイコン*/
	font-family:Fontawesome;
	content:"\f292";/*アイコン種類*/
	color:#845134;/*アイコン色*/
	font-weight:normal;
	margin-right:6px;/*アイコンとタイトルの距離*/
}
.widget_categories h3:before{/*カテゴリータイトルアイコン*/
	font-family:Fontawesome;
	content:"\f0ca";/*アイコン種類*/
	color:#845134;/*アイコン色*/
	font-weight:normal;
	margin-right:6px;/*アイコンとタイトルの距離*/
}
.widget_archive h3:before{/*アーカイブタイトルアイコン*/
	font-family:Fontawesome;
	content:"\f274";/*アイコン種類*/
	color:#845134;/*アイコン色*/
	font-weight:normal;
	margin-right:6px;/*アイコンとタイトルの距離*/
}
.widget_categories ul li,
.widget_archive ul li{/*カテゴリ・アーカイブ下線*/
	padding-left:10px;
	border-bottom:1px dotted  rgba(125, 125, 125, 0.2);/*下線の種類*/
}
.widget_categories ul li a,
.widget_archive ul li a{/*親カテゴリ・アーカイブの文字サイズ*/
	font-size:.95rem;
}
.widget_categories ul li a:before,
.widget_archive ul li a:before{/*親カテゴリ・アーカイブアイコン*/
	font-family:Fontawesome;
	content:"\f138";/*アイコン種類*/
	color:#845134;/*アイコン色*/
	margin-right:6px;/*アイコンと文字の距離*/
}
.widget_categories ul .children li a:before{/*子カテゴリアイコン*/
	font-family:Fontawesome;
	content:"\f105";/*アイコン種類*/
	color:#845134;/*アイコン色*/
	font-weight:normal;
	margin-right:6px;/*アイコンと文字の距離*/
}
.widget_categories ul .children li{
	border-bottom:none;
}	
.widget_categories ul .children li a{/*子カテゴリ*/
	padding:3px 10px;
	font-size:.85rem;/*文字サイズ*/
}
.widget_categories ul li a:hover,
.widget_archive ul li a:hover{/*カテゴリ・アーカイブhover時*/
	background:transparent;
	color:#38b48b;/*hover時の文字色*/
	margin-left:5px;/*hover時動く幅*/
}
.widget_categories ul li a .post-count,
.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_categories ul li a:hover .post-count,
.widget_archive ul li a:hover  .post-count{/*カテゴリ・アーカイブ記事数hover時*/
	border-color:#e8438a;/*囲線色*/
	background:#e8438a;/*背景色*/
	color:#fff;/*文字色*/
	transition:.4s;/*変化スピード*/
}
/*ここまで*/


.footer-bottom-logo .logo-image {
padding: 0;
max-width: 364px;
}

.mobile-menu-buttons  {
    background-color: #e8438a;
}



.menu-close-button {
	background-color: yellow;
}

.menu-drawer {
    background-color: #FF7EAC;
}

.menu-drawer a {
	color: #fff;
	border-bottom: dotted 1px #ffffff;
}

#navi-menu-input:checked ~ #navi-menu-content, #sidebar-menu-input:checked ~ #sidebar-menu-content, #search-menu-input:checked ~ #search-menu-content, #share-menu-input:checked ~ #share-menu-content, #follow-menu-input:checked ~ #follow-menu-content {
    background-color: #FF7EAC;
}

.fa-star:before {
    color: #ffffff;
}

/* 目次全体デザイン */
.toc{
	background:#F9F9F9; /* 目次全体の背景色を変える場合はここを変更 */
	border:none;
	display:block;
	border-top:5px solid;
	border-top-color:#ff7eac;
	box-shadow: 0 2px 2px rgba(0,0,0,0.2);
	padding: 20px 25px;
}
/* 目次の文字指定 */
.toc-title {
	text-align:left;
	margin: 0 20px 20px -10px;
	padding-left: -20px;
	font-size: 23px;
        font-weight: 700;
	color: #ff7eac; /* 目次の文字色を変える場合はここを変更 */
}
/* 目次のアイコン設定 */
.toc-title:before {
	top: 0;
        left: -45px;
        width: 50px;
        height: 50px;
	font-family: FontAwesome;
	content : "\f0ca"; /* アイコンを変える場合はここを変更 */
	font-size:20px;
	margin-right:5px;
	color:#FFF; /* アイコンの色を変える場合はここを変更 */
	background-color:#ff7eac; /* アイコンの背景色を変える場合はここを変更 */
	border-radius: 50%;
	-webkit-border-radius: 50%;
 	-moz-border-radius: 50%;
	padding:14px;
}
/* 目次のデザインカスタマイズ */
.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;
  	border-bottom: dashed 1px silver;
  	list-style-type: none!important;
}

/* 目次の各節の先頭にあるアイコンを設定 */
.toc-content ol li:before {
  	font-family: FontAwesome;
  	content: "\f138"; /* アイコンを変える場合はここを変更 */
  	position: absolute;
  	left : 0.5em;
  	color: #ff7eac; /* 色を変える場合はここを変更 */
}
.toc-content ol li:last-of-type {
	border-bottom: none;
}

.cat-label {
	display: none;}

.widget-entry-cards.large-thumb-on .card-content {
	display:none;}