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

/* ここから修正*/
/*プルダウンメニュー色*/
#navi .navi-in > .menu-header .sub-menu {
background-color: #eeeeee;
	color: #ffffff;

}
/*メニューのマウスホバー色*/
#navi .navi-in a:hover {
background-color: #000080;
 transition: all 0.5s ;
color: #ffffff;
}





.article h2 {
  font-size: 20px !important;/*文字のサイズ*/
  background: #5E8B6D;/*背景色*/
  padding: .5em .7em;/*余白*/
  color: #FFF;
  margin-bottom: 15px;
  border-top: none;
}

.article h3 {
  font-size: 20px !important;/*文字のサイズ*/
  border-left: 3px solid #323232;/*左線*/
  padding: .5em .7em;/*余白*/
  color: #323232;
  margin-bottom: 15px;
  border-top: none;
  border-bottom: none;
}
/* 英語ページだけ関連記事を非表示 */
/* URL が /en/ を含むページの関連記事を非表示 */
body[class*="en"] .related-entries,
body[class*="en"] .related-entries-title {
    display: none !important;
}
/* 英語ページだけ前後記事ナビを非表示 */
body[class*="en"] .post-navi,
body[class*="en"] .pager-post-navi,
body[class*="en"] .pager-prev,
body[class*="en"] .pager-next {
    display: none !important;
}

/**********************************************
** 固定ページの新着記事一覧(new_list)を
** 2カラム表示にする
/**********************************************
** 固定ページの新着記事一覧(new_list)を
** 3カラム（3列）表示にする
**********************************************/
.new-entry-cards.fp-new-entry-cards {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start; /* 左詰めで並べる */
    gap: 1.5%; /* カード同士のすき間（お好みで調整） */
    box-sizing: border-box;
}

.fp-new-entry-cards .new-entry-card-link.a-wrap {
    display: inline-block;
    width: 32.3%; /* 3列に収まるサイズに変更（32.3% × 3 + すき間 ≒ 100%） */
    margin-bottom: 20px; /* 下方向のカードとのすき間 */
}

/* スマホ表示（横幅480px以下）の時は1列にする設定 */
@media screen and (max-width: 480px) {
    .fp-new-entry-cards .new-entry-card-link.a-wrap {
        width: 100%;
    }
}