@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){
  /*必要ならばここにコードを書く*/
}

/* ============================
   今週のことば アイコン見出し
============================ */

/* 共通：横並び＋位置揃え */
.icon-title,
.icon-word,
.icon-explain,
.icon-hint,
.icon-daily,
.icon-summary {
  display: inline-flex;
  align-items: center;
  margin: 0.4em 0;
}

/* 共通：画像のサイズ・余白 */
.icon-title img,
.icon-word img,
.icon-explain img,
.icon-hint img,
.icon-daily img,
.icon-summary img {
  border-radius: 50%;
  display: block;
  margin-right: 10px;
}

/* --- 今週のことば（icon-word） --- */
.icon-word {
  font-weight: 600;
  font-size: 1.05em;
}
.icon-word img {
  width: 48px;
  height: 48px;
}

/* --- やさしい解説（icon-explain） --- */
.icon-explain {
  font-weight: 600;
  font-size: 1.05em;
}
.icon-explain img {
  width: 48px;
  height: 48px;
}

/* --- 実践ヒント（icon-hint） --- */
.icon-hint {
  font-weight: 600;
  font-size: 1.05em;
}
.icon-hint img {
  width: 48px;
  height: 48px;
}

/* --- 日々の暮らし（icon-daily） --- */
.icon-daily {
  font-weight: 600;
  font-size: 1.05em;
}
.icon-daily img {
  width: 48px;
  height: 48px;
}

/* --- ごあいさつ・まとめ（icon-summary） --- */
.icon-summary {
  font-weight: 600;
  font-size: 1.05em;
}
.icon-summary img {
  width: 48px;
  height: 48px;
}

/* --- タイトル（icon-title） --- */
.icon-title {
  font-weight: 700;
  font-size: 1.1em;
}
.icon-title img {
  width: 56px;
  height: 56px;
}

/* ========== Cocoon [icon-xxx] 見出しを「緑の帯」に強制 ========== */
.entry-content .icon-box,
.entry-content .iconlist-box,
.entry-content .icon-box-title,
.entry-content .iconlist-title{
  box-sizing: border-box;
}

/* 帯（箱）本体：Cocoonでよく使われるクラスにまとめて当てる */
.entry-content .icon-box,
.entry-content .iconlist-box{
  background: #9ad36a !important;
  padding: 18px 22px !important;
  border-radius: 4px !important;
  margin: 26px 0 !important;
}

/* 見出し文字 */
.entry-content .icon-box-title,
.entry-content .iconlist-title{
  font-weight: 700 !important;
  color: #000 !important;
}

/* アイコン色（丸アイコン/FontAwesome/SVGなど色々に保険で当てる） */
.entry-content .icon-box .icon,
.entry-content .iconlist-box .icon,
.entry-content .icon-box i,
.entry-content .iconlist-box i,
.entry-content .icon-box svg,
.entry-content .iconlist-box svg{
  color: #fff !important;
  fill: #fff !important;
}