@charset "UTF-8";

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

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

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

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

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

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

/* ==================================================================================================== */

/************************************
** 目次
************************************/
.toc-title{/*目次タイトルを太く*/
	font-weight:bold;
/*
 * 	color:#7b7b7b;
*/
}
.toc-list > li a {/*小見出し（H2）*/
	font-weight: bold;
/*	
	color: #7b7b7b;
*/
	display:block;
	margin-top:5px;
	margin-left: 0px;
}
.toc-list > li a::before {/*小見出し（H2）の先頭につけるアイコン*/
	font-family: FontAwesome;
	content : "\f144";
	margin-right: 7px;
}
.toc-list > li li a {/*小見出し（H3）*/
	font-weight: normal;
	font-size: 95%;
/*
	color: #7b7b7b;
*/
	margin-top:0;
	margin-left: 0.5em;
}
.toc-list > li li a::before {/*小見出し（H3）の先頭につける「・」*/
	content: "";
	width: 8px;
	height: 8px;
	left: -2px;
	display: inline-block;
	border-radius: 50%;
	background: #333;/*ここで点の色を変更できます*/
	position: relative;
	margin-bottom: 2px;
}
@media (max-width:880px){/*モバイル表示*/
.toc-list > li a {
	margin-left: -10px;
}
.toc-list > li li a {
	margin-left: -2em;
}
.toc-list > li li a::before {
	left: 3px;
	margin-bottom:1px;
}
}
.toc a:hover {
	color: #333;
	text-decoration: underline;
}

/* ==================================================================================================== */

/************************************
****　インデックス
************************************/
a.entry-card-wrap.a-wrap.border-element.cf{/*カード本体*/
	padding:0 0 .5em;
	border-radius:10px;
	width:48%;
	margin-bottom:2em;
}
a.entry-card-wrap.a-wrap:hover {
	transform: translateY(-1px);
	transition: all .3s;
	background-color: #fff;
}
figure.entry-card-thumb.card-thumb.e-card-thumb{/*サムネイル大きさ*/
	max-height:250px;
//	border-radius:10px 10px 0 0/ 10px 10px 0 0;
	overflow:hidden;
	display: flex;/*位置をflexで中心に*/
	justify-content: center;
	align-items: center;
}
.e-card-thumb .cat-label{/*カテゴリラベルを右に寄せる*/
	margin-left:.8em;
}
@media screen and (max-width: 1100px){/*サムネイル大きさ*/
figure.entry-card-thumb.card-thumb.e-card-thumb{
	max-height:220px;
}}
@media screen and (max-width: 1023px){/*サムネイル大きさ*/
figure.entry-card-thumb.card-thumb.e-card-thumb{
	max-height:280px;
}}
@media screen and (max-width: 900px){/*サムネイル大きさ*/
figure.entry-card-thumb.card-thumb.e-card-thumb{
	max-height:260px;
}}
@media screen and (max-width: 750px){/*サムネイル大きさ*/
figure.entry-card-thumb.card-thumb.e-card-thumb{
	max-height:230px;
}}
@media screen and (max-width: 600px){/*サムネイル大きさ*/
figure.entry-card-thumb.card-thumb.e-card-thumb{
	max-height:250px;
}
a.entry-card-wrap.a-wrap.border-element.cf{/*画面幅600pxまで、1カラムにする*/
	margin:.5em 1em!important;
}
.ect-vertical-card .entry-card-wrap {
	width: 95%!important;
}
}
@media screen and (max-width: 480px){/*カード本体*/
.e-card-thumb .cat-label{/*カテゴリラベルを右に寄せる*/
	margin-left:1em;
}}
@media screen and (max-width: 1023px){/*画面幅1023未満はカード本体に影を表示*/
div#list a {
	box-shadow: 0px 1px 5px 0 rgba(0,0,0,.2);
}
}
@media screen and (min-width: 601px) and (max-width: 834px){/*通常記事本文の周囲の空白にも影響している*/
div#content.content.cf{
	margin:1em;
}}
h2.entry-card-title.card-title.e-card-title{/*カードタイトル*/
	font-size:18px;
/*
	color:#7b7b7b;
*/
	font-weight:bold;
	text-align:center;
	line-height:1.8em;
	margin-top:1em;
	margin-bottom:1em;
	padding: 0 1.5em 0;
}
.entry-card-snippet.card-snippet.e-card-snippet{/*スニペット*/
	font-size:14px;
	color:#7b7b7b;
	text-align:center;
	border-top:3px dotted #778899;
	line-height:1.8em;
	padding-top:0.6em;
	margin-left:2em;
	margin-right:2em;
	margin-bottom:4em;
	max-height:20em;
}
@media (max-width:834px){
h2.entry-card-title.card-title.e-card-title{/*カードタイトル*/
	font-size: 1.15em;
	font-weight:bold;
	line-height:1.7em;
	padding: 1.5em .8em 1em;
	margin:0;
}
.entry-card-snippet.card-snippet.e-card-snippet{/*スニペット*/
	font-size:13px;
	text-align:center;
	border-top:3px dotted #778899;
	line-height:1.8em;
	padding:1em 0.5em 0;
	margin: 0 1em 1.5em;
}
main.main, div.sidebar {/*モバイル表示などの本文全体の周りの空白にも影響している*/
	padding:0;
}
}
a.entry-card-wrap.a-wrap.border-element.cf .post-date,
a.entry-card-wrap.a-wrap.border-element.cf .post-update{/*日付・更新日*/
	margin-right:1.5em!important;
	color:#7b7b7b;
	font-size:.86em;
}
.eye-catch .cat-label, .cat-label{/*カテゴリラベル全体デザイン*/
	font-size:.7em;
	border-radius:10px;
	margin:0.5em;
	padding:0 0.5em 0;
	background-color:#303030;
	color:#fff;
}
div.admin-pv{/*閲覧数を非表示*/
	display:none;
}

/* ==================================================================================================== */

/**************************************************
ページネーション
**************************************************/
/* 次のページ */
.pagination-next-link {
	background-color: #444d53; /*背景色*/
	color: #fff; /*文字色*/
	border: none; /*ボーダーを消す*/
}
.pagination-next-link:hover { /*マウスホバー時*/
	background-color: #aaa;
	color: #fff;
}

.pagination-next-link {
	background-color: #444d53;
	color: #fff;
	border: none;
	border-radius: 30px;
}
.pagination-next-link:hover {
	background-color: #aaa;
	transition: all 0.5s ease;
	color: #fff;
}

/* 数字の部分 */
.page-numbers { /*通常時*/
	color: #444d53;
	border: 1px solid #444d53;
}
.pagination .current { /*現在のページ*/
	background-color: #444d53;
	color: #fff;
}
.page-numbers.dots { /*ドット「…」の部分*/
	opacity: 1;
	background: none;
}
.pagination a:hover { /*マウスホバー時*/
	background-color: #444d53;
	color: #fff;
}

.page-numbers {
	color: #444d53;
	border: 1px solid #444d53;
	border-radius: 50%;
}
.pagination .current {
	background-color: #444d53;
	color: #fff;
}
.page-numbers.dots {
	opacity: 1;
	background: none;
}
.pagination a:hover {
	background-color: #444d53;
	color: #fff;
}
.page-numbers {
  height: 48px;
  line-height: 48px;
  min-width: 48px;
}

@media screen and (max-width: 768px) {
	.page-numbers {
		width: 48px;
		height: 48px;
		line-height: 48px;
	}
}


/* ==================================================================================================== */

/**************************************************
サイド　カテゴリー枠タイトル
**************************************************/

.sidebar h3 {
    background: none;
    font-size: 16px;
    letter-spacing: 2px;
    display: inline-block;
    position: relative;
    width: 100%;
    padding: 0;
    text-align: center;
}
.sidebar h3::before, .sidebar h3::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 28%; /*ラインの長さ*/
    border-top: 3px solid #444d53; /*ラインの色*/
}
.sidebar h3::before {
    left: 0;
}
.sidebar h3::after {
    right: 0;
}

/**************************************************
サイド　ウィジェット　カテゴリー
**************************************************/
.widget_categories ul li span  {
  visibility:hidden;
}
.widget_categories ul.children li span  {
  visibility:visible;
}

.widget_categories ul li a {
	font-size: 95%;
	font-weight: bold;
	display:block;
	margin-top:5px;
	margin-left: 0px;

/*
    font-size: 14px;
    color: #333;
    text-decoration: none;
    padding: 3px 0;
    display: block;
    padding-right: 4px;
    padding-left: 14px;
    border-top: 1px dotted #ccc;
    position: relative;
*/
}
.widget_categories ul li a::before {
	font-family: FontAwesome;
	content : "\f144";
	margin-right: 7px;
/*
	font-family: FontAwesome;
    content: "\f0da";
    position: absolute;
	left: 0px;
*/
}

.widget_categories ul.children li a {
	font-weight: normal;
	font-size: 95%;
	color: #7b7b7b;
	margin-top:0;
	margin-left: 0.5em;
/*
    font-size: 14px;
    color: #333;
    text-decoration: none;
    padding: 3px 0;
    display: block;
    padding-right: 4px;
    padding-left: 0px;
    border-top: 1px dotted #ccc;
    position: relative;
*/
}
.widget_categories ul.children li a::before {
	content: "";
	width: 8px;
	height: 8px;
	left: -2px;
	display: inline-block;
	border-radius: 50%;
	background: #7b7b7b;/*ここで点の色を変更できます*/
	position: relative;
	margin-bottom: 2px;
/*
    font-family: FontAwesome;
    content: "";
    position: absolute;
	left: 0px;
*/
}

/*
.widget_categories > ul > li > a:first-child {
    border-top: none;
}
.widget_categories > ul > li > a:last-child {
    border-bottom: 1px dotted #ccc;
}
.widget_categories ul li a:hover {
    background: #444d53;
    transition: 0.5s;
    color: #fff;
}
.widget_categories .cf::after {
    display:inline
}
*/

/**************************************************
サイド　ウィジェット　アーカイブ
**************************************************/
#sidebar select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  outline: none;
  border: 1px solid #333; /* ボーダーの指定 */
  border-radius: 10px; /* 角丸の指定 */
  padding: 6px 14px; /* 余白の指定 */
  font-size: 14px; /* 文字サイズ */
  color: #333; /* 文字色 */
}
#sidebar select::-ms-expand {
  display: none;
}
#sidebar .widget_archive {
  position: relative;
}
#sidebar .widget_archive::after {
  font-family: FontAwesome;
  content: '\f0d7'; /* アイコンの指定 */
  position: absolute;
  bottom: 0px; /* アイコンの位置 */
  right: 12px; /* アイコンの位置 */
  color: #333; /* アイコンの色 */
}

/**************************************************
サイド　検索ボックス
**************************************************/
.sidebar .search-box, .search-menu-content .search-box {
  width: 100%;
  margin: 1em 0 2em;
  position: relative;
  display: flex;
//  border-radius: 50px; /*全体を囲むボックスの角丸*/
  border-radius: 0;
//  box-shadow:0px 4px 6px 0px #c4c4c4; /*全体を囲むボックスのシャドウ*/
}
//.search-menu-content .search-box {
//  box-shadow:0px 4px 6px 0px #333; /*スライドイン表示でのシャドウ*/
//}
.sidebar .search-edit, .search-menu-content .search-edit {
  width: 80%; /*入力部分の長さ*/
  background: #fff; /*入力部分の背景色*/
  padding: 0 10px;
//  border: none; /*ボーダーを消す*/
  border: 1px solid #444d53;
//  border-radius: 50px 0 0 50px; /*左上、左下のみ角丸*/
  border-radius: 0;
  font-size: 16px;
}
.search-submit {
  width: 20%; /*ボタン部分の長さ*/
  background: #444d53; /*ボタン部分の背景色*/
  color: #fff; /*アイコンの色*/
  position: static;
  right: auto;
  top: auto;
  font-size: 20px; /*アイコンの大きさ*/
  cursor: pointer;
  line-height: 40px; /*検索窓の高さ*/
//  border: none;
//  border-radius: 0 50px 50px 0; /*右上、右下のみ角丸*/
  border-radius: 0;
  padding: 0;
}
.search-box input::placeholder {
  color: #bbb; /*プレースホルダーの色*/
}
.search-box input:focus, .search-box button:focus {
  outline: 0; /*フォーカス時の枠線を消す*/
}

/* ==================================================================================================== */

/**************************************************
タグクラウド
**************************************************/
.tagcloud a {
    background: none; /*背景を消す*/
    border: 1px solid #ccc; 
    border-radius: 20px; /*角の丸み*/
    color: #555; /*文字色*/
    display: inline-block;
    padding: 3px 10px;
    text-decoration: none;
    font-size: 13px;
    margin: 2px;
    flex: 1 1 auto;
    display: flex;
    justify-content: space-between;
}
.tagcloud a .tag-caption::before {
    content: ""; /*アイコンの変更*/
    padding-right: 3px;
}
.tagcloud a:hover { /*マウスホバー時*/
    background: #72c7e6;
    border: 1px solid #72c7e6;
    color: #fff;
    transition: 0.5s; /*アニメーションの時間*/
}
/*
.tag-caption .fa-tag {
    display: none;
}
*/

/**************************************************
サイド　広告枠タイトル
**************************************************/
.sidebar .ad-label {
    background: none;
    font-size: 16px;
    letter-spacing: 2px;
	position: relative;
    width: 100%;
    padding: 0;
    text-align: center;
    margin:10px 0;
}
.sidebar .ad-label::before, .sidebar .ad-label::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 20%; /*ラインの長さ*/
    border-top: 3px solid #444d53; /*ラインの色*/
}
.sidebar .ad-label::before {
    left: 0;
}
.sidebar .ad-label::after {
    right: 0;
}

.ad-area {
	margin-bottom: 0px;
}

/* ==================================================================================================== */