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

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


/* ---- ↓ トップバナー ---------------------------------- */

ul,ol {
	list-style:none;
}

ul.top {
	margin:0;
	clear:both;
}

li.top {
	float:left;
	margin:0;
	padding:0 4px 4px 0;
	width:170px;
	height:112px;
}

@media(max-width:767px){
	li.top {
		float:left;
		margin:0;
		padding:0 1px 1px 0;
		width:170px;
		height:112px;
	}
}

div.module640_topBanner {
	padding:0;
	width:700px;
}

@media(max-width:767px){
	div.module640_topBanner {
		padding:2px 0px 0px 0px;
		width:auto;
	}
}

/* トップバナーで paddingされるのを防ぐ */
div.module640_topBanner.ol, ul {
  padding-left: 0px;
}

/* ---- ↑ トップバナー ---------------------------------- */

/* ---- ↓ ヘッダー -------------------------------------- */

/* ロゴ画像の下に空白領域ができるのを防止 */
#header.header {
	line-height: 0px;
}

/* ヘッダーのロゴ画像の padding */
.logo-image {
  padding: 0;
}	

/* ヘッダー、タグラインの Padding */
.tagline {
 	padding: 4px 0 4px 0;
	font-weight:bold;
}
	@media screen and (max-width: 1023px){
	.tagline {
	 	padding: 4px 0 4px 0;
		font-weight:bold;
	  	font-size: 11px;
	}
}

/* グローバルメニューの下に赤いラインを描画 */
#header-container .navi, #navi .navi-in > .menu-header .sub-menu {
	border-color: #dd3333;
	border-bottom-style: solid;
	border-bottom-width: 2px;
}

/* ---- ↑ ヘッダー -------------------------------------- */

/* ---- ↓ メインカラム ---------------------------------- */

/* 背景を黒、borderを白に */
.main {
  border: 1px solid #cccccc;
  background-color: #000;
}

/* ---- ↑ メインカラム ---------------------------------- */

/* ---- ↓ インデックス ---------------------------------- */

/* 新着記事、などのタイトル色 */
.list-title {
  color: #cccccc;
  background-color: #000;
}

/* 新着記事等の前後の線 */
.list-title-in::before, .list-title-in::after {
  background-color: #cccccc;
}

/* もっとみる */
.list-more-button {
  color: #cccccc;
}

/* エントリーカードの画像サイズを指定 */
.entry-card-thumb, .related-entry-card-thumb {
	width: 120px;
	height:80px;
}

/* エントリーカードの画像縮小に合わせて文章の marginを調整 */
.entry-card-content, .related-entry-card-content {
	margin-left: 0px;
}

/* インデックスページの記事背景色を黒に */
.entry-card-wrap.a-wrap:nth-of-type(3n + 1),
.related-entry-card-wrap.a-wrap:nth-of-type(3n + 1) {
	background-color: #111111;
	border: solid 1px #cccccc;
	border-radius: 8px;
}

.entry-card-wrap.a-wrap:nth-of-type(3n + 2),
.related-entry-card-wrap.a-wrap:nth-of-type(3n + 2) {
	background-color: #111111;
	border: solid 1px #cccccc;
	border-radius: 8px;
}

.entry-card-wrap.a-wrap:nth-of-type(3n + 3),
.related-entry-card-wrap.a-wrap:nth-of-type(3n + 3) {
	background-color: #111111;
	border: solid 1px #cccccc;
	border-radius: 8px;
}

/* エントリーカードの bottomにある marginを小さくしてカード間の隙間を狭める */
.a-wrap {
  margin-bottom: 10px;
}

/* エントリーカードのタイトルのサイズとスタイルを指定 */
.entry-card-title, .card-title, e-card-title, .related-entry-card-title {
	font-size:16px;
	text-decoration:underline;
	color:#cccccc;
}

/* エントリーカードの descriptionを白に */
.entry-card-snippet, .related-entry-card-snippet {
	color:#cccccc;
}

/* エントリーカードの投稿日の文字色を指定 */
.entry-card-info span {
	color:#cccccc;
}

/* SNSシェアボタンを小さく */
.button-caption { display: none; }
.sns-share-buttons a {
	font-size: 14px;
	border-radius: 3px;
	height: 25px;
	box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.18);
}

/* 記事ホバー時のトランジション */

.entry-card-wrap.a-wrap:nth-of-type(3n+1):hover,
.related-entry-card-wrap.a-wrap:nth-of-type(3n+1):hover {
  background-color: #dd3333;
}
.entry-card-wrap.a-wrap:nth-of-type(3n+2):hover,
.related-entry-card-wrap.a-wrap:nth-of-type(3n+2):hover {
  background-color: #dd3333;
}
.entry-card-wrap.a-wrap:nth-of-type(3n+3):hover,
.related-entry-card-wrap.a-wrap:nth-of-type(3n+3):hover {
  background-color: #dd3333;
}

/* ---- ↑ インデックス ---------------------------------- */

/* ---- ↓ サイドバー ------------------------------------ */

/* 「検索」の文字は表示しない */
.wp-block-search__label {
  color: #cccccc;
  display: none;
}

/* 検索ボックスの高さ */
.widget_search .wp-block-search__input {
  width: 120px;
  height: 40px;
}

/* サイドバーの文字サイズを変更 */
.widget-sidebar ul li a {
	font-size: 0.8em;
}

/* サイドバー項目のタイトル背景の指定 */
.sidebar h2, .sidebar h3 {
	background-image: none;
	background-color: #dd3333;
	position: relative;
	padding: 6px;
	border-radius: 4px;
	font-size: 0.95em;
}

/* サイドバーテキストの行間設定 */
.widget_block ul li a {
  padding: 6px 0;
}

.widget_recent_entries ul li a:hover,
.widget_categories ul li a:hover,
.widget_archive ul li a:hover,
.widget_pages ul li a:hover,
.widget_meta ul li a:hover,
.widget_rss ul li a:hover,
.widget_nav_menu ul li a:hover,
.widget_block ul li a:hover {
  background-color: #dd3333;
  transition: none;
  color: #ffffff;
}

/* ---- ↓ エントリー -------------------------------------- */

/* エントリータイトルの文字サイズ */
.entry-title {
	font-size:20px;
}

/* エントリーのタイトル色 */
.article h1, .article h2, .article h3, .article h4, .article h5, .article h6 {
  color: #cccccc;
}

/* 投稿日の文字サイズを指定 */
.post-date {
	color: #cccccc;
	font-size: 0.8em;
}

/* エントリーの本文色 */
.entry-content {
  color: #cccccc;
}

/* ページャーの文字色 */
.pager-post-navi a.prev-post .prev-post-title, .pager-post-navi a.next-post .next-post-title {
  color: #cccccc;
}

/* 関連記事タイトルの色 */
.related-entry-heading, .comment-title {
  color: #ccc;
}

/* ページ送り画像を出さない */
.pager-post-navi a figure {
	display:none;
}

/* YouTube動画の中央配置 */
.video-container{
	margin: 0px auto;
}

/* 「シェアする」の文字を削除 */
.sns-share-message {
	display:none;
}

/* 「関連記事」の文字スタイルを指定 */
.related-entry-main-heading {
	font-size: 0.8em;
	text-decoration: none;
}

/* 「関連記事」の上下の装飾を指定 */
.related-entry-heading {
	text-align: center;
}

/* 次のページ */
.pagination-next-link.blockquote, .pagination-next-link.key-btn {
	background-color: #333333;
	border-color: #cccccc;
	padding:0px;
	font-size:16px;
	color:#cccccc
}

/* ページネーションの数字 */
.pagination {
  margin: 8px 0;
  clear: both;
  text-align: center;
  display: inline-flex;
  justify-content: center;
  width: 100%;
}

/* ページネーションのカレント */
.pagination .current {
	background-color: #000;
	border-color: #cccccc;
	color:#cccccc
}

/* ページナンバー */
.page-numbers {
	background-color: #333333;
	border-color: #cccccc;
	color:#cccccc
}

/* 前の記事 次の記事 */
.prev-post.a-wrap, .next-post.a-wrap {
  background-color: #333333;
}

.prev-post.a-wrap:hover, .next-post.a-wrap:hover {
  background-color: #dd3333;
}


/* ---- ↓ カテゴリー －------------------------------------ */

/* カテゴリートップタイトルの表示色 */
.entry-title, .archive-title {
  color: #cccccc;
}

/* カテゴリー説明のフォント */
.category-page-content {
  font-size: 14px;
}

/* ---- ↓ フッター ---------------------------------------- */

/* フッターの marginをなくす */
.footer {
  padding: 0px;
  margin-top:0px;
}

/* ---- ↑ フッター ---------------------------------------- */


/* ---- ↓ 固定ページに公開日を表示しない ------------------ */
.post-87 .date-tags,
.post-75 .date-tags,
.post-15967 .date-tags {
  display: none;
}
/* ---- ↑ 固定ページに公開日を表示しない ------------------ */


/* ---- ↓ 問い合わせフォームのスタイル ------------------- */
/*
 * .wp-block-contact-form-7-contact-form-selector
{
  width: 500px;
  margin-left: 80px;
}
*/
/* ---- ↑ 問い合わせフォームのスタイル ------------------- */

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

}

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

}

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

}

