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

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

/*【インデックス】で【大きなカード】選択時、*/
/* PC のみエントリーカード風に表示 */
/* .ect-big-card > a article {
    display: flex;
    justify-content: space-between;
	margin-bottom: 0.48em;
}
.ect-big-card > a article::after {
    content: none;
}
.entry-card-thumb.card-thumb.e-card-thumb {
    width: 38%;
}
.entry-card-content.card-content.e-card-content {
    width: 59%;
} */

/* サムネ画像に枠線 */
.entry-card-thumb img {
	border: solid 1px #ddd;
}
.related-entry-card-thumb img {
	border: solid 1px #ddd;
}

/* 『人気の記事』のサムネ画像に枠線・ランキングの数字位置を調整 */
.popular-entry-card-thumb img {
	border: solid 1px #ddd;
}
.widget-entry-cards.ranking-visible .card-thumb::before {
	top: 1px;
	left: 1px;
}

/* 広告表示レイアウト調整 */
.gad-left {
	margin-right:0.4em;	
}
.gad-right {
    margin-right: 0;
}

/* pre 要素のコードを折り返さずに横スクロールバーを表示する */
pre,
pre * {
	word-wrap: normal;
}

/* 各 h 要素のレイアウト調整（フォントに依るけどとりあえず） */
.article h2 {
    padding-bottom: 20px;
}
.article h3 {
    padding-bottom: 8px;
}
.article h4 {
    padding-bottom: 4px;
}

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

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

/*480px以下*/
@media screen and (max-width: 480px){
	/*必要ならばここにコードを書く*/
	/*【インデックス】で【大きなカード】選択時、*/
	/* PC のみエントリーカード風に表示 */
/*     .ect-big-card > a article {
        display: block;
        margin-bottom: 0;
    }
    .ect-big-card > a article::after {
        content: "";
    }
    .entry-card-thumb.card-thumb.e-card-thumb {
        width: 100%;
    }
    .entry-card-content.card-content.e-card-content {
        width: auto;
    }
	.related-entry-card-thumb {
		width: 100%;
	} */
	/* スマホ表示時にエントリーカードの画像サイズを拡大 */
	.entry-card-thumb {
      	width: 100%;
     	margin-bottom: 0.4em !important;
		float: none;
	}
	/* ついでに関連記事の画像サイズも拡大・レイアウト調整 */
	.related-entry-card-thumb {
		width: 100%;
     	margin-bottom: 0.4em !important;
		float: none;
	}
	.related-entry-card-content {
		padding-bottom: 0.4em !important;
	}
}
