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

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

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

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

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

nav#navi, .menu-header .sub-menu{
	font-weight: bold;
}

nav#navi, .menu-header .sub-menu{
	font-weight: bold;
	box-shadow:0 5px 15px -5px rgba(0,0,0,.8);
}

.menu-header .menu-item:hover{
	 border-bottom:3px solid #FDD835 !important;/*線の太さ色*/
	    transition: all .3s;/*線が出てくる時間*/
}
.sub-menu .menu-item:hover{
	border-bottom:none !important;
}




/*h2タグ*/
.article h2{
	background-color:#fff;
	color:#20664f;  /*文字の色*/
	border-left:10px solid #38b48b;  /*見出し左線色・太さ*/
	border-bottom:1px solid #38b48b; /*見出し下線色・太さ*/
	padding:13px;
	margin-top:80px /*見出しとその直前の文字の距離*/
}
/*ここまで*/

/* H2見出しの疑似要素をリセット*/
.article h2:before {
  content: none;
}


/*h3タグ*/
.article h3{
	border:none;
	display:inline-block;
	color:#20664f; /*文字の色*/
	border-top:2px solid #38b48b; /*見出し上線色・太さ*/
	border-bottom:2px solid #38b48b; /*見出し下線色・太さ*/
	margin-top:30px; /*見出しとその直前の文字の距離*/
	margin-bottom:0px; /*見出しとその直後の文字の距離*/
}
/*ここまで*/

/*h4タグ*/
.article h4{
/*	border:none;
	display:inline-block;
	color:#20664f; /*文字の色*/
	border-top:2px solid #38b48b; /*見出し上線色・太さ*/
	border-bottom:2px solid #38b48b; /*見出し下線色・太さ*/
	margin-top:30px; /*見出しとその直前の文字の距離*/
	margin-bottom:0px; /*見出しとその直後の文字の距離*/
}
/*ここまで*/

/*h5タグ*/
.article h5{
	border-bottom:2px solid #38b48b; /*見出し下線色・太さ*/
/*	margin-top:30px; /*見出しとその直前の文字の距離*/
/*	margin-bottom:0px; /*見出しとその直後の文字の距離*/
}
/*ここまで*/


/*.main{
		animation-name:fadein;
    animation-duration: 2s;

}
*/
@keyframes fadein{
from {
    opacity: 0;
    transform: translateY(20px);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}

/*目次のカスタマイズ*/
.toc{
	display:block;
	padding:0;
}
.toc-title{
	position:relative;
	background:#ffbc00;/*最上部背景色*/
	padding:10px 0;
	color:#fff;
	font-weight:bold;
}
.toc-title:before{
	content:"";
	position:absolute;
	top:100%;
	left:50%;
	right:50%;
	transform: translate(-50%,0%);
	border:15px solid transparent;
	border-top:15px solid #ffbc00;/*toc-titleの背景色と同色*/
}
.toc .toc-content{
	padding:10px
}
.toc .toc-content ol li a,
.toc .toc-content ul li a{
	display:block;
	border-bottom:1px dashed #ababab;
	margin-left:-20px;
	padding-left:20px;
}


/*
.widget_recent_entries ul li a,
.widget_categories ul li a,
.widget_archive ul li a,
.widget_pages ul li a,
.widget_meta ul li a,
.widget_rss ul li a,
.widget_nav_menu ul li a{
	padding:0 10px 0;
	margin:10px;
	line-height:1.3;
}
*/
/*
.widget_categories ul li a{/*親カテゴリ
	background-color:#20664f; /*背景色
	border-radius:5px;
	color:#fff;/*文字色
 	margin:4px;
	padding-top:5px;
	padding-bottom:5px;	
	line-height:1;
}
.widget_categories ul li ul a{/*子カテゴリ
	padding:0 20px 0;
	background-color:transparent;
	color:#333435;/*文字色
}
*?

/*
input::placeholder{
	font-size:0.75em;/*「サイト内を検索」の文字サイズ
}
.search-edit{
	border-radius:10px;/*検索ボックスの角のまるさ
	height:40px;
}
.search-submit{
	top:0px;
	line-height:0.25;
	bottom:0;
}
.search-submit:hover::before{
	color:#ffbc00;/*検索ボタンホバー時の色
}
*/


/* モバイルスライドインメニュー 
.fa-times {
color: #000057;/* 閉じるボタンの色 
font-size: 0.8em;
}
ul.menu-drawer:before {
background-color: #000057;/* Menu背景色 
font-size: 1.2em;
}
ul.menu-drawer:after {
background-color: #fff;
}
.menu-drawer a {
color: #333 !important;/* 文字色 
font-size: 1.2em;
font-weight: 900;
}
.menu-drawer a:hover {
background-color: #eff8f9;
}
.menu-drawer a .fas, .menu-drawer a .far,.menu-drawer a .fa,.menu-drawer a .fab {
margin-right: 3px;
}
.sub-menu li {
font-size: 0.8em;
}
*/

/*トップページのタブ（選択前）*/
.index-tab-button{
    color: #454545;/*文字色*/
    font-size: 16px!important;/*文字の大きさ*/
    background: #DBF8E7!important;/*背景色*/
    border: solid 1px #66a6ff!important;/*枠線の種類・太さ・色*/
}
/*トップページのタブ（選択後）*/
#index-tab-1:checked~.index-tab-buttons .index-tab-button[for=index-tab-1],
#index-tab-2:checked~.index-tab-buttons .index-tab-button[for=index-tab-2],
#index-tab-3:checked~.index-tab-buttons .index-tab-button[for=index-tab-3],
#index-tab-4:checked~.index-tab-buttons .index-tab-button[for=index-tab-4]{
    color: #FFF;/*選択後の文字色*/
    background: #38b48b!important;/*選択後の背景色*/
    font-weight: 400;/*文字の太さ*/


jQuery.event.special.touchstart={setup:function(e,t,s){t.includes("noPreventDefault")?this.addEventListener("touchstart",s,{passive:!1}):this.addEventListener("touchstart",s,{passive:!0})}},jQuery.event.special.touchmove={setup:function(e,t,s){t.includes("noPreventDefault")?this.addEventListener("touchmove",s,{passive:!1}):this.addEventListener("touchmove",s,{passive:!0})}},jQuery.event.special.wheel={setup:function(e,t,s){this.addEventListener("wheel",s,{passive:!0})}},jQuery.event.special.mousewheel={setup:function(e,t,s){this.addEventListener("mousewheel",s,{passive:!0})}};
