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



/* タグのデザイン変更 */
.entry-content .tag-link, 
.entry-content .tag-link:hover,
.cat-link, 
.cat-link:hover {
    background-color: #fff; /* 背景を白に */
    color: #333; /* 文字を黒に近いグレーに */
    border: 1px solid #ccc; /* 薄いグレーの枠線 */
    border-radius: 20px; /* 角を丸くする */
    padding: 5px 12px; /* 余白を調整 */
    margin-bottom: 8px; /* 下の余白 */
    text-decoration: none; /* 下線を消す */
    transition: 0.3s; /* ホバー時の動きを滑らかに */
}

/* マウスを乗せたときの色変化 */
.entry-content .tag-link:hover,
.cat-link:hover {
    background-color: #f0f0f0; /* 背景を薄いグレーに */
    border-color: #999; /* 枠線を濃く */
}

/* 記事タイトルの下のタグアイコン（フォルダ等の絵）を消す場合 */
.fa-folder-open, .fa-tags {
    color: #bbb; /* アイコンの色を薄くする */
}



/* カテゴリーとタグ、両方のエリアの上にタイトルを出す */
.entry-categories-tags::before {
    content: "この記事のタグ一覧"; /* 表示したい文字 */
    display: block;
    font-weight: bold;
    font-size: 16px;
    color: #333;
    margin-top: 20px;
    margin-bottom: 10px;
}

/* もし、カテゴリーとタグの間が空きすぎる場合は調整 */
.entry-categories {
    margin-bottom: 5px;
}