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



/*-------------------------------------------------*/
/* 固定ページタイトル中央 */
.page .entry-title {
  text-align: center;
}

/* 見出しの装飾 */
.article h2 {
  background-color: #f4c542;
  color: #fff;
}

.article h3 {
  border-color: #f4c542;
  border-left: 8px solid #f4c542;
}

.article h4 {
  border-top: 2px solid #f4c542;
  border-bottom: 2px solid #f4c542;
}

.article h5 {
  border-bottom: 2px dashed #f4c542;
}

.article h6 {
  border-left: 4px solid #f4c542;
}

/*-------------------------------------------------*/

/* サイドバーのタイトル装飾 */
.sidebar .widget-title {
  background-color: #f4c542;
  color: #ffffff;
  padding: 8px;
  border-radius: 6px;
}

/* サイドバーの自己紹介文の文字サイズ */
.author-content p {
  font-size: 0.83em;
}
@media (min-width: 768px) {
  .author-content {
    font-size: 0.85em;
  }
}

/*-------------------------------------------------*/

/* 検索バーにフォーカスした時に周りが黄色になる */
.search-edit:focus {
  border-color: #f4c542;
  box-shadow: 0 0 7px #f4c542;
  outline: none;
}


/* 検索バーのプレイスホルダーを透明に */
/*
.search-edit::placeholder {
  color: transparent;
}
*/

/*-------------------------------------------------*/

/* フッターホバー無し */
.footer a:hover {
  background-color: transparent !important;
}

/*-------------------------------------------------*/

/* フッターの上のライン */
#footer {
  border-top: 3px solid #9A1F2F;
}

/*-------------------------------------------------*/

/* 特定のページだけアイキャッチ画像を非表示 */
.page-id-23 .eye-catch-wrap,
.page-id-81 .eye-catch-wrap,
.page-id-220 .eye-catch-wrap,
.page-id-237 .eye-catch-wrap {
  display: none;
}

/*-------------------------------------------------*/

/* グロナビ説明文消す */
.item-description.sub-caption {
  display: none !important;
}

/*-------------------------------------------------*/

/* アイキャッチ上の「カテゴリー」という表記を消す */
.cat-label {
  display: none !important;
}

/*-------------------------------------------------*/
/* 記事カードの基本スタイル（常時適用） */
.entry-card-wrap {
  border: 1px solid #f0f0f0;
  border-radius: 12px;
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1); /* 右側と下に薄いシャドウ */
}

/*-------------------------------------------------*
/* 全デバイス：静止状態のドロップシャドウ */
.site-name-text a,
.logo img {
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.08));
}

/* PCのみ：ホバーエフェクト適用 */
@media (hover: hover) and (pointer: fine) {
  .site-name-text a,
  .logo img {
    transition: transform 0.3s ease, filter 0.3s ease;
  }
  .site-name-text a:hover,
  .logo img:hover {
    transform: translateY(-2px);
    filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.15));
  }

  /* ロゴリンク全体にホバーエフェクトを適用 */
  .logo a {
    display: inline-block;
    transition: transform 0.3s ease;
  }

  .logo a:hover {
    transform: translateY(-2px);
  }

  /* 記事カードのホバーエフェクト */
  .entry-card-wrap {
    transition: transform 0.3s ease;
  }

  .entry-card-wrap:hover {
    transform: translateY(-5px);
  }
}

/*-------------------------------------------------*/

/* トップページの記事一覧のmain背景 */
body.home .main {
    background-color: #fff8d6 !important; 
}

/* カテゴリーページの記事一覧のmain背景 */
body.category .main {
    background-color:#fff8d6 !important; 
}

/* アーカイブページの記事一覧のmain背景 */
body.archive .main {
    background-color: #fff8d6 !important; 
}

/* タグページの記事一覧のmain背景 */
body.tag .main {
    background-color: #fff8d6 !important; 
}

/* 検索結果ページの記事一覧のmain背景 */
body.search .main {
    background-color: #fff8d6 !important; 
}

/* カテゴリータイトルの背景に白が残らないように */
header.article-header.category-header{
    background-color: #fff8d6 !important; 
}

/* 記事カードや記事内容は白色を維持 */
.entry-card,
.entry-card-wrap,
.entry-card-content,
.post,
.article {
    background-color: #ffffff !important;
}


/* 個別記事ページは記事内容が白いまま */
body.single .main .entry-content,
body.page .main .entry-content {
    background-color: #ffffff !important;
}

/*-------------------------------------------------*/

/* サイドバーの背景色変更 */
.sidebar.nwa.cf {
    background-color: #fff8d6 !important;
}

/* author-boxを白色で維持 */
.author-box.border-element.no-icon.cf {
    background-color: #ffffff !important;
}

/* サイドバーのタイトルだけ中央揃え */
.widget-sidebar-title.widget-title {
    text-align: center;
}

/*-------------------------------------------------*/
/* 横スクロール */
@media screen and (max-width: 1030px) { 
  #header-container .menu-mobile{ 
    display:none; 
  } 
  .navi-in > .menu-mobile{ 
    display: flex; 
    overflow-x: scroll; 
    white-space: nowrap; 
    justify-content: flex-start; 
    flex-wrap: nowrap; 
    -webkit-overflow-scrolling: touch; 
    scrollbar-width: none; 
    -ms-overflow-style: none; 
  } 
  .navi-in > .menu-mobile::-webkit-scrollbar { 
    display: none; 
  } 
  #navi .navi-in > .menu-mobile li { 
    height: auto; 
    line-height: 1.4; 
  } 
  .navi-in > ul li { 
    min-width: auto; 
  } 
  #header-container #navi a { 
    font-size: 0.8em; 
    padding: 0.7em 1.2em; 
  } 
}

/*-------------------------------------------------*/
/* グロナビ */
#header-container #navi {
  background-color: #f4c542;
  border-bottom: 3px solid #9A1F2F;
  font-weight: bold;
}

/*-------------------------------------------------*/
/* カテゴリー内ごとのタイトルの下の余白調整 */
.archive-title {
  margin-bottom: 20px !important;
}

/*-------------------------------------------------*/
/* フォルダーアイコン削除 */
.fa-folder-open {
  display: none;
}
/* カテゴリー名の左余白を削除 */
.category-label {
  padding-left: 0;
}
/*-------------------------------------------------*/

