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

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


/* スパム対策のreCAPTCHAのロゴを非表示 */
.grecaptcha-badge { visibility: hidden; }


/* 画像の枠線 */
.sen {
border: solid 1px #2c2c2e; /* 枠線のスタイル 太さ 色 */
}

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

.widget p {
	font-size: 16px;
}



/*ヘッダー サイトロゴのフォント変更-文字白*/
.logo-header a span{
font-weight: bold;
font-size:32px;
}


/* ヘッダーのタイトル位置変更 */
.header-in {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.header-in .tagline {
text-align:center;
	padding-top: 0;
	margin-bottom: 4em;
}

.header-in .logo {
text-align: center;
	padding-top: 10em;
	margin-top: 0;
	margin-bottom: -2em;
}


/************************************
****　インデックス ここから
************************************/

a.entry-card-wrap.a-wrap.border-element.cf{/*カード本体*/
padding:0 0.0em;
border-radius:0px;
width:48.8%;
margin-bottom:2em;
background-color: #fff;
}
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:220px;
overflow:hidden;
display: flex;/*位置をflexで中心に*/
justify-content: center;
align-items: center;
}

@media screen and (max-width: 1100px){/*サムネイル大きさ*/
figure.entry-card-thumb.card-thumb.e-card-thumb{
max-height:450px;
}}
@media screen and (max-width: 1023px){/*サムネイル大きさ*/
figure.entry-card-thumb.card-thumb.e-card-thumb{
max-height:450px;
}}
@media screen and (max-width: 900px){/*サムネイル大きさ*/
figure.entry-card-thumb.card-thumb.e-card-thumb{
max-height:450px;
}}
@media screen and (max-width: 750px){/*サムネイル大きさ*/
figure.entry-card-thumb.card-thumb.e-card-thumb{
max-height:450px;
}}
@media screen and (max-width: 600px){/*サムネイル大きさ*/
figure.entry-card-thumb.card-thumb.e-card-thumb{
max-height:450px;
}
a.entry-card-wrap.a-wrap.border-element.cf{/*画面幅600pxまで、1カラムにする*/
margin:.5em 2em!important;
}
.ect-vertical-card .entry-card-wrap {
width: 90%!important;
}
}


@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:4px dotted #b59e96;
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 #7b7b7b;
line-height:1.8em;
padding:1em 0.5em 0;
margin: 0 1em 1.5em;
}
main.main, div.sidebar {/*モバイル表示などの本文全体の周りの空白にも影響している*/
padding:0 0.5em 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:2em!important;*/
color:#7b7b7b;
font-size:.86em;
}

.eye-catch .cat-label, .cat-label{/*カテゴリラベル全体デザイン*/
font-size:.8em;
border-radius:0px;
margin:0em;
padding:0 0.5em 0;
background-color:#ffffff;
color:#7b7b7b;
}


div.admin-pv{/*閲覧数を非表示*/	
display:none;
}
/************************************
****　インデックス ここまで
************************************/



/*エントリーカードのドロップシャドウ */
.entry-card-wrap {
	border-radius: 2px;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.08);
	transition-duration: 0.3s;
}

.a-wrap {
	border-radius: 2px;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.08);
	transition-duration: 0.3s;
}



/************************/
/*エントリーカード*/
/************************/

/* エントリーカード ホバー時に半透明表示 */
.entry-card-wrap:hover{
	background-color: transparent!important;
	opacity: 0.4;
}




/************************/
/*ブログカード『続きを読む』*/
/************************/

.blogcard {
	padding: 1rem;
	color: #666; /* 内部ブログカードの文字色 */
	position: relative;
	border-color: #dfebed!important; /* 内部ブログカード 枠線の色 */
}

a.blogcard-wrap:hover{
	background-color: transparent!important; /* 内部ブログカード ホバー時に明るく（透明表示） */
	opacity: 0.8;
}

a.blogcard-wrap:hover img.blogcard-thumb-image{
	transform: scale(1.2); /* 内部ブログカード ホバー時にアイキャッチ画像を拡大表示 */
	transition: .3s; /* 内部ブログカード ホバー時に浮かせる */
}

.blogcard-thumbnail {
	line-height: 0;
	margin-right: 1rem;
	overflow: hidden;
}

.blogcard-title{
	margin-bottom: .5rem;
}

.blogcard-snipet{
	font-size: 70%;
	line-height: 1.7;
	padding-right: 10%;
}


.internal-blogcard-footer{
	display: none; /* 内部ブログカードのアイコンとURLを非表示 */
}



.internal-blogcard::after{
	content: '続きを読む \00bb'; /* 内部リンク右下枠の文言 */
	position: absolute;
	bottom: .5rem;
	right: 1rem;
	font-size: 70%;
	background-color: #373737; /* 内部リンク右下の続きを読むの背景色 */
	padding: .4em 3em;
	font-weight: bold;
	color: #fff; /* 内部リンク右下の続きを読むの文字色 */
	border-radius: 2px;
}





/************************
/ ブログカード
/************************/
.a-wrap {background-color: #ffffff;} /* 内部ブログカードの背景色 */
.a-wrap .blogcard {border-color: #b8c2d9;} /* 内部ブログカードの枠線の色 */

.a-wrap:hover {
background-color: #faffe3; /* ナビカード ホバー時の色 */
-webkit-transform: translateY(-2px);
-ms-transform: translateY(-2px);
transform: translateY(-2px);
box-shadow: 0 0 8px #d1d7e8;
}

.ecb-entry-border
.entry-card-wrap,
.recb-entry-border
.related-entry-card-wrap,
.tagcloud a,
.author-box,
.comment-reply-link,
.ranking-item{
  border-color: #506185;
}

/* ブログカード拡張 */
.blogcard-label::after {
color: #ffffff!important; /* 内部ブログカード ラベル文字色 */
}
.blogcard-label.internal-blogcard-label {
background-color: #c1a470!important; /* 内部ブログカード ラベル背景色 */
}



/* ------------------------------------- */
/*  もしも　かんたんリンク カスタマイズ  */
/* ------------------------------------- */

/*　文字サイズ変更　*/
div.easyLink-box div.easyLink-info p.easyLink-info-btn a{
	 font-size: 11px !important;
}

/*　PC　画像サイズ変更　*/
div.easyLink-box div.easyLink-img,
div.easyLink-box div.easyLink-img p.easyLink-img-box,
div.easyLink-box div.easyLink-img p.easyLink-img-box img.easyLink-img-pht{
         max-width: 160px !important;
         max-height: 130px !important;
         margin: auto;
}

/*　モバイル　画像サイズ変更　*/
@media screen and (max-width: 480px) {
.easyLink-img {
    overflow: hidden !important;
    height: 260px !important;
}
}


/*　ボタンの色指定　*/
.easyLink-info-btn-amazon {
    color: #fff !important;
    background: #ff9d00 !important;
  }
  .easyLink-info-btn-rakuten {
    color: #fff !important;
    background: #bf0000 !important;
  }
  .easyLink-info-btn-yahoo {
    color: #ff0027 !important;
    background: #fff !important;
    border: solid 1.4px #ccc !important;
  }

/* ボタン色_マウスオーバー時 */
a:hover.easyLink-info-btn-amazon {
    opacity: 1 !important; /* 透明度 */
    background: #ffcf66 !important; /* 背景色 */
}
a:hover.easyLink-info-btn-rakuten {
    opacity: 1 !important; /* 透明度 */
    background: #ff5471 !important; /* 背景色 */
}
a:hover.easyLink-info-btn-yahoo {
    opacity: 1 !important; /* 透明度 */
    background: #f0f0f0 !important; /* 背景色 */
    color: #51a7e8 !important; /* 文字色 */
}




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

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
	
/* モバイル 見出し2 フォントサイズ変更 */
.article h2 {
font-size: 10pt;
}
		
}

/* --------- モバイル用　ヘッダースクロールメニュー --------- */
@media screen and (max-width: 480px){

	/* モバイルトップメニュー */
	ul.menu-mobile{
		overflow-x: auto;
		overflow-y: hidden;
		display: flex !important;
		flex-wrap: nowrap;
		font-size: 14px;
		justify-content: flex-start;
		padding: 0 0em;
		-webkit-overflow-scrolling: touch;
		position: relative;
	}

	ul.menu-mobile > li{
		padding-right: 0em;
		white-space: nowrap;
	}
	ul.menu-mobile　.item-label{
		white-space: nowrap;
		font-size: 14px;
	}

}

/************************************
** ヘッダー・フッターモバイルボタン
************************************/

/* モバイル用 サイドバーの文字色指定 */
.sidebar{
	color:#94918e !important;
}


/*背景色・文字色変更*/
.mobile-menu-buttons,
.mobile-menu-buttons .menu-button > a {
    background-color:#918e8f;
    color: #ffffff;
}


/*モバイル ボタンの位置を下げる（ヘッダーのみ）*/
.search-menu-button.menu-button,
.navi-menu-button.menu-button{
	height: 60px;
	padding-top: 12px;
}

/* モバイル タイトルロゴの高さ テキストサイズ指定 */
.logo-menu-button.menu-button{
	height: 60px;
	font-size: 16px;
}