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

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

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

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

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

.ect-vertical-card .entry-card-wrap {
  max-width: 43%;
  padding: 0;
  border-radius: 3px;
  box-shadow: 0 2px 4px rgb(0 0 0 / 25%);
}
@media screen and (max-width: 480px) {
  .ect-vertical-card .entry-card-wrap {
    max-width: 46%;
  }

  .e-card-title {
    font-size: 13px;
  }
}

.entry-card-title {
  line-height: 1.6;
  color: #5a5a5a; /* 見出しの色 */
}

.ect-vertical-card .entry-card-wrap .entry-card-content {
  margin: 8px 12px 9px;
}

.entry-card-meta,
.related-entry-card-meta {
  margin: 4px 8px;
  color: #b7b7b7;
}

.entry-card-wrap .cat-label {
  display: none; /* カテゴリを非表示に */
}

.ect-vertical-card {
  justify-content: space-around;
}

/* 見出し前にアイコンをつける */
h2.related-entry-heading span::before {
  z-index: 0;
  display: inline-block;
  width: 42px;
  height: 42px;
  font-family: "Font Awesome 5 Free" !important;
  color: #fff;
  text-align: center;
  content: "";
  content: "f15c";
  background-color: #f8c678; /* アイコンの背景色 */
  border-radius: 50%;
}

h2.related-entry-heading span {
  color: #999;
}

.related-entry-card-thumb img {
  border-radius: 5px;
  box-shadow: 0 2px 4px rgb(0 0 0 / 22%);
}

.entry-card-title,
.related-entry-card-title {
  color: #555;
}

.rect-mini-card .related-entry-card-wrap {
  border-bottom: 1px dashed #ccc; /* 区切り線 */
}

.related-entry-card .cat-label {
  display: none; /* カテゴリー非表示 */
}

input.search-edit {
  border: none;
  border-bottom: solid 1px #efefef;
  box-shadow: 0 4px 4px rgb(0 0 0 / 2%), 0 2px 3px -2px rgb(0 0 0 / 5%);
}

input.search-edit::placeholder {
  color: #ddd;
}

.search-submit {
  top: 0;
  right: 0;
  width: 50px;
  height: 50px;
  color: #fff;
  background-color: #000000; /* ボタンの背景色 */
  border-bottom: solid 1px rgb(0 0 0 / 10%);
  border-radius: 0 3px 3px 0;
}