@charset "UTF-8";

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

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


/* ==================================================
 *  固定ページの設定
 * ==================================================*/
/* 登録日、更新日削除 */
#post-29 .date-tags, #post-33 .date-tags, #post-35 .date-tags {
	display: none;
}



/* ==================================================
 *  ヘッダーの設定
 * ==================================================*/
/* メニューとメインカラムの幅設定 */
#header-container-in {
	padding-bottom: 10px;
}

/* ==============================
 * ヘッダー上部の設定
 * ==============================*/
/* ヘッダーロゴ */
.logo-header {
	text-align: left;
	padding-top: 10px;
	padding-bottom: 0px;
	margin-left: 1em;
}
/* ヘッダータイトル */
.site-name-text {
	font-size: 34px;
	font-weight: bold;
}
/* キャッチフレーズ */
.tagline {
	text-align: left;
	margin-top: 0px;
	margin-bottom: 16px;
	margin-left: 2em;
}

/* ==============================
 * TOPメニューの設定
 * ==============================*/
/* TOPメニュー全体の設定 */
#menu-top {
	font-weight: bold;
	background-color: #ba8cff;
	justify-content: flex-start; /* 左寄せ */
}
/* メニューアイテムの設定 */
.menu-item {
	border-right: 1px solid #bbbbbb;
}
/* メニュー文字の設定 */
.item-label {
	color: #fff;
}

/* ==============================
 * ページ選択時やマウスオーバー時の処理
 * ==============================*/
/* 選択しているページの設定 */
#menu-top > .current-menu-item > a .item-label {
	color: #6a1917; /* 色設定 */
}
/* マウスオーバー時のリンク背景設定 */
.navi-in a:hover {
	background-color: transparent;
}
/* マウスオーバー時の文字色設定 */
#menu-top .item-label:hover {
	color: #6a1917;
	opacity: 0.8;
}



/* ==================================================
 *  メインカラム
 * ==================================================*/

/* ==============================
 * アイキャッチ画像のズーム設定
 * ==============================*/
/* アイキャッチ */
.eye-catch, .popular-entry-card-thumb {
	overflow: hidden; /* はみ出た部分を非表示 */
}
/* アイキャッチ画像 img */
.eye-catch img, .popular-entry-card-thumb img {
	transition-duration: 0.5s; /* 時間 */
}
/* アイキャッチ画像を拡大させる */
.eye-catch img:hover, .popular-entry-card-thumb img:hover {
	transform: scale(1.2);
}

/* ==============================
 * エントリーカードの設定
 * ==============================*/
/* エントリーカード */
.entry-card-wrap {
	border-bottom:1px solid #e5e5e5;
	padding-top: 14px;
	padding-bottom: 14px;
	margin-bottom: 6px;
}
/* カテゴリー・サイド新着記事のエントリー */
.new-entry-card-link {
	border-bottom:1px solid #e5e5e5;
}
.new-entry-cards .new-entry-card-link {
	margin-bottom: 6px;
}

/* エントリカードを浮かせる */
/* ホームの新着記事・サイドの新着記事 */
.entry-card-wrap:hover, .new-entry-card-link:hover {
	box-shadow: 0 0 8px -2px rgba(0,0,0,0.4);
	background-color: #fff;
	transform: translateY(-3px); /* 移動 */
	transition-duration: 0.5s; /* 時間 */
}


/******************** ホーム画面の設定 ********************/

/* リストのタイトル */
.list-title {
	margin-top: 1em;
}

/* エントリーカード */
.list .new-entry-cards {
	margin-bottom: 0;
}

/* ==============================
 * カテゴリーラベルの設定
 * ==============================*/
/* カテゴリーラベル */
.cat-label {
	top: 0;
	right: 0;
	left: auto;
	border: none;
	font-size: 14px;
	background-color: #ffff00;
	color: #777777;
}
/* 関連記事のカテゴリーラベル */
.related-entry-card .cat-label {
	font-size: 12px;
}

/* ==============================
 * エントリーカードの画像と文章の比率
 * ==============================*/
/* 画像コンテンツ */
.entry-card-thumb {
	width: 266px;
}
/* 文章コンテンツ */
.entry-card-content {
	margin-left: 276px; /* 画像のwidth + 10px */
}

/* 次のページボタン削除 */
.pagination-next {
	display: none;
}



/******************** 投稿画面の設定 ********************/

/* ==============================
 * 投稿日・更新日・カテゴリー・タグの位置を変更
 * display:flexで順番を変更
 * ==============================*/
/* flexの対応 */
.entry-header {
	display: flex;
	flex-direction: column;
}
/* アイキャッチの設定 */
.eye-catch-wrap {
	order: 1;
}

/* ==============================
 * 投稿タイトルの設定
 * ==============================*/
/* 投稿タイトル */
.entry-title {
	font-size: 30px;
	margin-top: 12px;
	margin-bottom: 12px;
}
.article-header .entry-title {
	line-height: 1.35;
}

/* ==============================
 * 投稿日・更新日ブロックの設定
 * ==============================*/
/* 投稿日・更新日の設定 */
.date-tags {
	text-align: start;
	margin-bottom: 10px;
	font-size: 19px;
	font-weight: bold;
	color: #777777;
}

/* ==============================
 * カテゴリー・タグブロックの設定
 * ==============================*/
/* カテゴリー・タグの設定 */
.entry-categories-tags {
	margin-bottom: 6px;
}
/* カテゴリーの設定 */
.cat-link {
	background-color: #ffff00;
	color: #777777;
}
/* マウスオーバー時のカテゴリー設定 */
.cat-link:hover {
	color: #777777;
	opacity: 1;
}
/* タグの設定 */
.tag-link {
	color: #777777;
}



/* ==================================================
 *  サイドバーの設定
 * ==================================================*/

/* ==============================
 * サイドバー全体の設定
 * ==============================*/
/* サイドバーの設定 */
#sidebar, #slide-in-sidebar {
	font-size: 16px;
}
/* サイドメニューの余白調整 */
#sidebar .widget-sidebar, #sidebar .widget-entry-cards, #slide-in-sidebar .widget-sidebar, #slide-in-sidebar .widget-entry-cards {
	margin-bottom: 0px;
}

/* サイドバータイトル */
.sidebar h3 {
	font-size: 18px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-bottom:10px;
	color: #fff;
	/*background-color: #b384ff;*/
	background-color: #ba8cff;
}
/* 人気記事 */
.popular-entry-card-title {
	font-size: 16px;
}
/* 新着記事のエントリーカード */
.widget-entry-card {
	font-size: 14px;
}

/* ==============================
 *  検索フォームの設定
 * ==============================*/
/* 検索ボックスの余白調整 */
.search-box {
	margin-top: 0;
	margin-bottom: 0px;
}
/* 検索キーワード */
input[type="text"].search-edit {
	font-size: 16px;
	padding-top: 6px;
	padding-bottom: 6px;
	outline: 0;
}
/* 検索ボタン */
.search-submit {
	top:0;
	right:0;
	height: 100%;
	width: 55px;
	background-color: #000080;
	color: #ffffff;
}

/* ==============================
 *  カテゴリーの設定
 * ==============================*/
/* 親カテゴリーのアイコン設定 before */
.cat-item > a:before{
	font-family: FontAwesome;
	content: "\f07c";
	padding-right: 6px;
	color: #f39800;
}
/* カテゴリー */
.widget_categories ul li a {
	padding-top: 4px;
	padding-bottom: 2px;
	border-bottom: 1px dashed #ffa500;
}
/* カテゴリーのページ件数 */
.post-count {
	padding-right: 6px;
	color: #ee7800;
}

/* タグのページ件数 */
.tag-link-count {
	color: #ee7800;
}

/* カテゴリーとタグのマウスオーバー設定 */
.widget_categories ul li a:hover, .tagcloud a:hover{
	background-color: #ffe0ff;
}

/* ==============================
 *  サイドバーのselectタグの設定
 * (アーカイブの設定)
 * ==============================*/
/* サイドバー */
#sidebar select, #slide-in-sidebar select {
	font-size: 16px;
	font-family: "Yu Gothic", Meiryo, "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
}



/* ==================================================
 *  フッターメニュー
 * ==================================================*/
/* ==============================
 *  フッターメニューのマウスオーバー処理
 * ==============================*/
/* マウスオーバー時の設定 */
.navi-footer-in a:hover {
	background-color: transparent; /* 背景を透明 */
	color: #6a1917;
	opacity: 0.8; /* 透明度 */
}



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

	/* ==============================
	 * エントリーカードの画像と文章の比率
	 * ==============================*/
	/* 画像コンテンツ */
	.entry-card-thumb {
		width: 38%;
	}
	/* 文章コンテンツ */
	.entry-card-content {
		margin-left: 40%;
	}
}

/*1030px以下*/
@media screen and (max-width: 1030px){
  /*必要ならばここにコードを書く*/
	
	/* ヘッダーロゴ */
	.logo-header {
		text-align: center;
		margin-left: 0;
	}
	/* キャッチフレーズ */
	.tagline {
		text-align: center;
		margin-left: 1em;
	}
	
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	
	/* メニューとメインカラムの幅設定 */
	#header-container-in {
		padding-bottom: 0px;
	}
	
	/* 背景設定 */
	#container {
		background-color: #fff;
	}
	
	/* キャッチフレーズとメインの幅調整 */
	.tagline {
		margin-bottom: 0;
	}
	#main {
		padding-top: 12px;
	}
}

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
	
	/* ==============================
	 * カテゴリーラベルの設定
	 * ==============================*/
	/* カテゴリーラベル */
	.cat-label {
		font-size: 11px;
	}
	
	/* ==============================
	 * 投稿タイトルの設定
	 * ==============================*/
	/* 投稿タイトル */
	.entry-title {
		font-size: 20px;
		padding: 0.6em 0;
		margin: 0;
		margin-bottom: 6px;
	}
	
	/* パンくずリスト */
	#breadcrumb {
		margin-bottom: 6px;
	}
}
