@charset "UTF-8";

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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.appeal .appeal-in {
	width: 100%;
	background-color: rgba(0, 128, 128, .25);
}

.appeal-content {
	background-color: transparent;
}

.appeal-title,
.appeal-message {
	color: #fff;
	text-shadow: 2px 2px 0 #3f3f3f;
}

/*ページの更新日と著者情報をまとめて消す*/
.page .date-tags,
.page .author-info {
    display: none;
} 

/*フロント固定ページのタイトルを非表示*/
.home.page .entry-title{
  display: none;
}

/*フロント固定ページのシェアボタンを非表示*/
.home.page .sns-share{
  display: none;
}

/*フロント固定ページのフォローボタンを非表示
.home.page .sns-follow{
  display: none;
}
*/
/*フロント固定ページの投稿日を非表示*/
.home.page .post-date{
  display: none;
}

/*フロント固定ページの更新日を非表示*/
.home.page .post-update{
  display: none;
}

/*フロント固定ページの投稿者名を非表示*/
.home.page .author-info{
  display: none;
}
.new-entry-cards.large-thumb {
    display: flex;
    flex-wrap: wrap;
}

.new-entry-cards.large-thumb a {
    width: 33.333%;
}

.new-entry-cards .cat-label {
  display: inline;
}

.date-tags {
    line-height: .8;
    position: relative;
    color: #aaa; /* 文字色を薄くする */
    flex-direction: row;  /* 左揃えにする */
}
.post-date {
    order: 1; /* 投稿日の表示順を1番目に */
}
.post-update {
    order: 2; /* 更新日の表示順を2番目に */
}
.post-date, .post-update {
    padding: 2px;
    display: inline;
    font-size: .8em; /* 少しだけ文字サイズを大きく */
}
.post-date::before { /* 投稿日のアイコンの変更 */
    font-family: FontAwesome;
    content: "\f040";
    padding-right: 3px;
}
.post-update::before { /* 更新日のアイコンの変更 */
    font-family: FontAwesome;
    content: "\f021";
    padding-right: 3px;
}

/* 画像キャプションを中央寄せにする処理 */
.wp-block-image figcaption {
	text-align: center;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*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){
  /*必要ならばここにコードを書く*/
}