@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){
	/*ボックスメニュー設定*/
  .box-menus.no-icon { /* ← .box-menus.no-icon セレクタを追加 */
    margin-left: auto !important; /* 左マージンを auto に */
    margin-right: auto !important; /* 右マージンを auto に */
    width: 100% !important; /* 幅を 100% に (親要素に合わせて広げる) */
    max-width: 100% !important; /* 最大幅も 100% に (念のため) */
    display: flex !important; /* Flexbox を有効にする (念のため) */
    flex-wrap: wrap !important; /* 折り返しを有効にする (念のため) */
    justify-content: flex-start !important; /* 左寄せ (既存の設定を維持) */
    align-items: flex-start !important; /* 上揃え (既存の設定を維持) */
  }

  .box-menus.no-icon .box-menu {
    flex-basis: calc(33.33% - 10px) !important;
    width: auto !important; /* width は auto に (念のため !important) */
    display: inline-block !important; /* display も指定 (念のため !important) */
    box-sizing: border-box !important; /* box-sizing も指定 (念のため !important) */
    margin-right: 5px !important; /* 右マージンを少し調整 */
    margin-left: 5px !important; /* 左マージンを少し調整 */
    margin-bottom: 10px !important; /* 下マージンは維持 */
    text-align: center !important; /* テキスト中央揃え (念のため !important) */
    vertical-align: top !important; /* 縦方向の配置を top に (念のため !important) */
  }
  .box-menus.no-icon .box-menu-icon {
    font-size: 18px !important; /* アイコンサイズを 18px に (例) */
  }
  .box-menus.no-icon .box-menu {
    min-height: 0 !important; /* min-height を 0 に設定して削除 */
  }
}

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

/*固定ページの投稿日、更新日、投稿者名を非表示にする*/
.page .date-tags,
.page .author-info {
    display: none;
}

/*マウスオン*/
a:hover img {
opacity: 0.7;     /* 透過レベル */
filter: alpha(opacity=80);
}

/*パンくずリスト*/
.breadcrumb {
  width: 100%; /* 適切な幅に調整してください。例えば、親要素の幅に合わせる場合は100%にします。 */
  overflow: hidden; /* はみ出した部分を非表示にします */
  white-space: nowrap; /* 強制的に改行を禁止します */
}