@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-card-thumb .cat-label,
.entry-card-thumb .cat-label a,
.entry-card .cat-label,
.cat-label {
  display: none !important;
}



/* 記事本文下のカテゴリー・タグ表示を非表示にする */
.entry-categories-tags {
  display: none !important;
}



/*固定ページウィジェットのタイトルを非表示にする*/
.widget_pages .widget-title {
  display: none;
}



/* 記事一覧・関連記事・前後記事のサムネイル画像サイズを指定する */
.entry-card-thumb img,
.related-entry-thumb img,
.related-entry-card-thumb img,
.prev-post-thumb img,
.next-post-thumb img {
  aspect-ratio: 3 / 4;
  width: 100%;
  height: auto;
  object-fit: cover;
}



/* 記事タイトルの表示方法を変更する */
/* 改行タグの余白微調整 */
.yx-break { line-height: 0; }

/* 体験談系：prefix/suffixは表示から隠す（SEOには残る） */
.yx-prefix, .yx-suffix { display: none; }
.yx-core { display: inline; }

/* 一覧/関連記事/前後記事の行間（カード/ナビ） */
.entry-card-title a,
.related-entries .entry-card-title a,
.prev-post-title,
.next-post-title {
  line-height: 1.28;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

/* nn回覧板（nnkairanban）は3パートとも表示 */
.yx-nn-prefix, .yx-nn-number, .yx-nn-suffix { display: inline; }



/* モバイル幅でサイドバーを非表示 */
@media screen and (max-width: 834px) {
  #sidebar {
    display: none !important;
  }
}



/* Cocoon プロフィール名をリンクなし・黒文字太字に */
.widget_profile .author-name a,
.widget-profile .author-name a,
.author-box .author-name a {
  pointer-events: none;   /* リンク無効 */
  cursor: default;
  text-decoration: none;  /* 下線消し */
  color: #333333;            /* 黒文字 */
  font-weight: bold;      /* 太字 */
}


/* モバイルヘッダーボタン：NN回覧板ボタンのアイコンを純粋な#d12420に */
.mobile-menu-buttons .fa.fa-file-text {
    color: #d12420 !important;
    opacity: 1 !important;  /* 半透明を解除 */
}

/* テキストも完全に同じ#d12420・太字・不透明に */
.mobile-menu-buttons .custom-menu-caption {
    color: #d12420 !important;
    opacity: 1 !important;  /* 半透明を強制解除 */
    font-weight: bold !important;
}

/* よりピンポイントに（このボタンだけに適用） */
.mobile-menu-buttons li:has(.fa.fa-file-text) .custom-menu-caption {
    color: #d12420 !important;
    opacity: 1 !important;
    font-weight: bold !important;
}

/* --------------------------------------------
codoc paywall 背景色やボタン色を変更するサンプル
----------------------------------------------*/

/* ペイウォール用スタイル */
.codoc-entry .codoc-btn {
  background: #d12420 !important;  /* ボタンの背景色を指定 */
  height: 80px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.codoc-btn span {
	font-size: 24px !important;               /* 文字サイズはお好みで調整 */
}

.codoc-entry .codoc-btn:hover {
  background: #7d0401 !important;  /* ボタンのホバー時の背景色を指定 */
}

.codoc-continue::after, .codoc-continue::before {
  background: #333333 !important;  /* 「この続きを見るには」の左右のボダー色を指定 */
}
.codoc-continue {
  color: #333333 !important;  /* 「この続きを見るには」のテキスト色を指定 */
}
.codoc-entry .codoc-buy-price {
  color: #d12420 !important;  /* 金額のテキスト色を指定 */
}

.codoc-more-title,
.codoc-more-text {
    color: #333333;  /* 例: 赤色に変更。好きなカラーコードや名前（red, blue など）を指定 */
}

.codoc-like span {
    font-weight: bold !important;
}

/* モーダルウィンドウ内 ボタン用スタイル */
.modal-container .codoc-btn-buy {
    color: #a69079 !important;  /* ボタンのテキスト色を指定 */
}
.modal-container .codoc-btn-buy:hover {
    background: #7d0401 !important;  /* ボタンのホバー時の背景色を指定 */
}

/* モーダル内のデフォルトボタン用スタイル（ログイン・会員登録・ゲスト決済） */
.codoc-modal-default-button {
    background: #d12420 !important;  /* ボタンの背景色を指定 */
}
.codoc-modal-default-button:hover {
    background: #7d0401 !important;  /* ボタンのホバー時の背景色を指定 */
}

/* モーダル内のメインボタン（ログインして決済・会員登録して決済） */
.codoc-modal-default-button.codoc-btn-buy-bg {
    background: #d12420 !important;  /* ボタンの背景色を指定 */
}
.codoc-modal-default-button.codoc-btn-buy-bg:hover {
    background: #7d0401 !important;  /* ボタンのホバー時の背景色を指定 */
}

/* モーダル内のサブボタン（ゲストとして決済・購入を復元） */
.codoc-modal-default-button.codoc-btn-buy {
    background: transparent !important;  /* 透明背景 */
    border: 1px solid #d12420 !important;  /* ボタンのボーダー色を指定 */
}
.codoc-modal-default-button.codoc-btn-buy:hover {
    background: #dedede !important;  /* ボタンのホバー時の背景色を指定 */
    border: 1px solid #7d0401 !important;  /* ボタンのホバー時のボーダー色を指定 */
}

/* ランダム投稿一覧 - スマホでも横並び強制版 */
.my-random-posts {
    margin: 40px 0;
}

.my-random-posts-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.my-random-posts-item {
    display: flex;
    align-items: center;
    padding: 20px 0;
    gap: 20px;
    border-bottom: none !important;  /* ライン消去 */
}

.my-random-posts-item:last-child {
    padding-bottom: 20px;
}

/* サムネイル */
.my-random-posts-thumb-link {
    flex-shrink: 0;
    display: block;
    overflow: hidden;
}

.my-random-posts-thumb-img {
    width: 200px;
    height: 300px;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

.my-random-posts-thumb-link:hover .my-random-posts-thumb-img {
    transform: scale(1.08);
}

/* タイトル */
.my-random-posts-title {
    margin: 0;
    font-size: 1.2em;
    line-height: 1.4;
    flex: 1;
}

.my-random-posts-title a {
    color: #0066cc;
    text-decoration: underline;
    transition: color 0.2s;
}

.my-random-posts-title a:hover {
    color: #003399;
}

/* スマホ対応 - 横並び維持 + サイズ調整 */
@media (max-width: 768px) {
    .my-random-posts-thumb-img {
        width: 200px;   /* スマホで少し小さくして横並びしやすく */
        height: 300px;
    }
    .my-random-posts-title {
        font-size: 1.1em;
    }
    .my-random-posts-item {
        gap: 15px;
        padding: 15px 0;
    }
}

/* 極小画面でも横並び強制（縦並び削除） */
@media (max-width: 480px) {
    .my-random-posts-thumb-img {
        width: 125px;    /* さらに小さく調整（好みで変えて） */
        height: 167px;
    }
    .my-random-posts-title {
        font-size: 1em;
    }
    .my-random-posts-item {
        gap: 12px;
    }
}

/* ランダム投稿一覧 - 左右のパディング・マージン完全削除 */
.my-random-posts {
    margin: 40px 0 !important;   /* 上下は残す */
    padding: 0 !important;
    width: 100% !important;
    max-width: none !important;
}

.my-random-posts-list {
    margin: 0 !important;
    padding: 0 !important;
}

.my-random-posts-item {
    margin: 0 !important;
    padding: 20px 0 !important;   /* 上下は残す */
    gap: 20px !important;
}

/* スマホでも左右余白ゼロ */
@media (max-width: 768px) {
    .my-random-posts-item {
        padding: 15px 0 !important;
        gap: 15px !important;
    }
}

/* 記事一覧のタイトルを省略せず全文表示 */
.entry-card-title,
.a-wrap .entry-card-title,
.entry-card .entry-card-title a {
    white-space: normal !important;     /* 折り返しを許可 */
    overflow: visible !important;       /* はみ出しを許可 */
    text-overflow: clip !important;     /* …（省略記号）を無効化 */
    display: block !important;
    word-break: break-all;              /* 長い単語も強制折り返し */
}

/* 関連記事のタイトルを省略せず全文表示（最強版） */
.related-entry-card-title.card-title.e-card-title,
.related-entry-card .entry-card-title,
.related-entry-card .card-title,
.related-entry-card .e-card-title {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    -webkit-line-clamp: unset !important;   /* 行数制限を完全に解除 */
    -webkit-box-orient: unset !important;
    display: block !important;
    word-break: break-all !important;      /* 長いタイトルも強制折り返し */
    word-wrap: break-word !important;
    line-height: 1.55 !important;
    max-height: none !important;
    height: auto !important;
}

/* 関連記事カードの全体制限も解除（レイアウト崩れ防止） */
.related-entry-card,
.related-entry-card-wrap,
.related-list .a-wrap {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
}