@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
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/* ========================================
   個別レビュー記事 スタイル
   ======================================== */

/* 記事全体 */
.rv-article { max-width: 800px; margin: 0 auto; font-family: 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif; color: #333; }

/* ヘッダー */
.rv-header { background: linear-gradient(135deg, #fff8f0 0%, #fff 100%); border: 2px solid #e8956d; border-radius: 12px; padding: 24px; margin-bottom: 32px; text-align: center; }
.rv-header__rank { display: inline-block; background: #e8956d; color: #fff; font-size: 14px; font-weight: bold; padding: 4px 16px; border-radius: 20px; margin-bottom: 12px; }
.rv-header__title { font-size: 22px; font-weight: bold; line-height: 1.5; margin-bottom: 8px; color: #222; }
.rv-header__meta { font-size: 12px; color: #888; margin-bottom: 16px; }

/* 総合評価 */
.rv-score { display: flex; align-items: center; justify-content: center; gap: 8px; margin-bottom: 16px; }
.rv-score__stars { color: #f5a623; font-size: 24px; }
.rv-score__num { font-size: 28px; font-weight: bold; color: #e8956d; }
.rv-score__label { font-size: 13px; color: #888; }

/* クイック情報 */
.rv-quick { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-bottom: 20px; }
.rv-quick__item { background: #fff; border: 1px solid #e8956d; border-radius: 8px; padding: 8px 12px; text-align: center; min-width: 70px; }
.rv-quick__label { display: block; font-size: 11px; color: #888; }
.rv-quick__value { display: block; font-size: 13px; font-weight: bold; color: #e8956d; }

/* バナー枠 */
.rv-banner {background: #fff;border: 1px solid #e0e0e0;border-radius: 8px;padding: 10px;text-align: center;margin: 12px 0;position: relative;}
.rv-banner::before {content: 'PR';display: inline-block;background: #999;color: #fff;font-size: 10px;font-weight: bold;padding: 1px 6px;border-radius: 3px;margin-bottom: 6px;}
.rv-banner img {max-width: 100%;height: auto;display: block;margin: 0 auto;}

/* ボタン */
.rv-btn { display: block; text-align: center; padding: 16px 24px; border-radius: 8px; font-size: 16px; font-weight: bold; text-decoration: none; margin: 12px auto; max-width: 400px; transition: opacity .2s; }
.rv-btn:hover { opacity: .85; }
.rv-btn--primary { background: linear-gradient(135deg, #e8956d, #d4714a); color: #fff; }
.rv-btn--secondary { background: #fff; border: 2px solid #e8956d; color: #e8956d; }

/* サマリーボックス */
.rv-summary { background: #f0f8ff; border-left: 4px solid #4a90d4; border-radius: 0 8px 8px 0; padding: 20px 24px; margin-bottom: 32px; }
.rv-summary__title { font-size: 16px; font-weight: bold; margin-bottom: 12px; color: #2c5f8a; }
.rv-summary ul { margin: 0; padding-left: 20px; }
.rv-summary li { margin-bottom: 6px; font-size: 14px; line-height: 1.7; }

/* セクション共通 */
.rv-section { margin-bottom: 40px; }
.rv-section__title { font-size: 20px; font-weight: bold; padding: 10px 16px; border-left: 5px solid #e8956d; background: #fff8f4; border-radius: 0 8px 8px 0; margin-bottom: 20px; }

/* 基本情報テーブル */
.rv-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.rv-table th, .rv-table td { padding: 12px 16px; border: 1px solid #e0e0e0; text-align: left; }
.rv-table th { background: #fff8f4; font-weight: bold; width: 35%; color: #555; }
.rv-table tr:nth-child(even) td { background: #fafafa; }

/* メリット */
.rv-merit { display: flex; gap: 16px; align-items: flex-start; margin-bottom: 20px; background: #fff; border: 1px solid #ffe0cc; border-radius: 10px; padding: 18px; }
.rv-merit__num { font-size: 28px; font-weight: bold; color: #e8956d; min-width: 40px; line-height: 1; }
.rv-merit__title { font-size: 16px; font-weight: bold; margin-bottom: 6px; color: #333; }
.rv-merit__text { font-size: 14px; line-height: 1.7; color: #555; margin: 0; }

/* デメリット */
.rv-demerit { background: #fff8f0; border: 1px solid #ffd0b0; border-radius: 10px; padding: 20px; }
.rv-demerit__item { margin-bottom: 16px; }
.rv-demerit__item:last-child { margin-bottom: 0; }
.rv-demerit__item h3 { font-size: 15px; font-weight: bold; color: #c0582a; margin-bottom: 6px; }
.rv-demerit__item p { font-size: 14px; line-height: 1.7; color: #555; margin: 0; }

/* 収入シミュレーション */
.rv-sim { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; margin-bottom: 12px; }
.rv-sim__case { background: #f9f9f9; border: 2px solid #e0e0e0; border-radius: 10px; padding: 18px; text-align: center; }
.rv-sim__case--mid { border-color: #e8956d; background: #fff8f4; }
.rv-sim__case--high { border-color: #d4714a; background: #fff0e8; }
.rv-sim__label { font-size: 13px; color: #666; margin-bottom: 8px; }
.rv-sim__amount { font-size: 24px; font-weight: bold; color: #e8956d; margin-bottom: 6px; }
.rv-sim__desc { font-size: 12px; color: #888; }
.rv-sim__note { font-size: 12px; color: #999; text-align: center; }

/* おすすめリスト */
.rv-recommend { list-style: none; padding: 0; margin: 0; }
.rv-recommend li { padding: 10px 16px 10px 40px; border-bottom: 1px solid #f0f0f0; position: relative; font-size: 14px; line-height: 1.7; }
.rv-recommend li::before { content: '✅'; position: absolute; left: 8px; }

/* ステップ */
.rv-steps { display: flex; flex-direction: column; gap: 16px; margin-bottom: 24px; }
.rv-step { display: flex; gap: 16px; align-items: flex-start; background: #fff; border: 1px solid #e0e0e0; border-radius: 10px; padding: 18px; }
.rv-step__num { background: #e8956d; color: #fff; font-size: 12px; font-weight: bold; padding: 4px 10px; border-radius: 20px; white-space: nowrap; }
.rv-step__title { font-size: 15px; font-weight: bold; margin-bottom: 4px; }
.rv-step__text { font-size: 14px; color: #555; line-height: 1.7; margin: 0; }

/* FAQ */
.rv-faq { border: 1px solid #e0e0e0; border-radius: 10px; margin-bottom: 12px; overflow: hidden; }
.rv-faq__q { background: #fff8f4; padding: 14px 18px; font-size: 14px; font-weight: bold; color: #c0582a; }
.rv-faq__a { padding: 14px 18px; font-size: 14px; line-height: 1.7; color: #555; }

/* 最終CTA */
.rv-cta { background: linear-gradient(135deg, #fff8f4, #fff); border: 2px solid #e8956d; border-radius: 12px; padding: 28px; text-align: center; }
.rv-cta__title { font-size: 20px; font-weight: bold; margin-bottom: 12px; color: #333; }
.rv-cta__text { font-size: 14px; line-height: 1.8; color: #555; margin-bottom: 20px; }

/* 投稿者リンク・著者情報を非表示 */
.author-info,
.author-box,
.post-author,
.author-widget-wrap {
  display: none !important;
}

/* コメントエリアを非表示 */
.comment-area,
#comments,
.comments-area,
.comment-respond {
  display: none !important;
}


/* 関連記事・内部リンクセクション */
.rv-related { margin-top: 40px; padding: 28px; background: #f9f9f9; border-radius: 12px; border: 1px solid #e0e0e0; }
.rv-related__title { font-size: 18px; font-weight: bold; margin-bottom: 8px; color: #333; text-align: center; }
.rv-related__lead { font-size: 13px; color: #777; text-align: center; margin-bottom: 20px; }

.rv-related__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-bottom: 20px; }

.rv-related__card { display: block; background: #fff; border: 1px solid #e0e0e0; border-radius: 10px; padding: 16px; text-decoration: none; color: #333; transition: all .2s; }
.rv-related__card:hover { border-color: #e8956d; box-shadow: 0 4px 12px rgba(232,149,109,.2); transform: translateY(-2px); }

.rv-related__rank { font-size: 13px; font-weight: bold; color: #e8956d; margin-bottom: 4px; }
.rv-related__name { font-size: 16px; font-weight: bold; color: #222; margin-bottom: 6px; }
.rv-related__tag { display: inline-block; background: #fff0e8; color: #e8956d; font-size: 11px; font-weight: bold; padding: 2px 8px; border-radius: 10px; margin-bottom: 6px; }
.rv-related__stars { color: #f5a623; font-size: 13px; margin-bottom: 6px; }
.rv-related__point { font-size: 12px; color: #666; line-height: 1.5; margin-bottom: 10px; }
.rv-related__btn { font-size: 12px; font-weight: bold; color: #e8956d; text-align: right; }

.rv-related__top-link { display: block; text-align: center; background: linear-gradient(135deg, #e8956d, #d4714a); color: #fff; font-size: 15px; font-weight: bold; padding: 14px 20px; border-radius: 8px; text-decoration: none; transition: opacity .2s; }
.rv-related__top-link:hover { opacity: .85; color: #fff; }


/* サイドバー ウィジェット - Gutenbergブロック対応版 */
.sidebar .widget-sidebar {
  background: #fff !important;
  border-radius: 12px !important;
  padding: 16px !important;
  margin-bottom: 20px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
}

/* ウィジェットタイトル */
.sidebar .wp-block-heading {
  font-size: 14px !important;
  font-weight: bold !important;
  color: #fff !important;
  background: linear-gradient(135deg, #f9a8c9, #f06292) !important;
  padding: 8px 14px !important;
  border-radius: 8px !important;
  margin-bottom: 12px !important;
  margin-top: 0 !important;
  letter-spacing: 0.05em !important;
}

/* 最近の投稿リスト */
.sidebar .wp-block-latest-posts__list {
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}

.sidebar .wp-block-latest-posts__list li {
  padding: 8px 0 !important;
  border-bottom: 1px dashed #f9d0e3 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

.sidebar .wp-block-latest-posts__list li:last-child {
  border-bottom: none !important;
}

.sidebar .wp-block-latest-posts__list li a {
  color: #555 !important;
  text-decoration: none !important;
}

.sidebar .wp-block-latest-posts__list li a:hover {
  color: #f06292 !important;
}

/* カテゴリー */
.sidebar .wp-block-categories-list {
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}

.sidebar .wp-block-categories-list li {
  padding: 8px 0 !important;
  border-bottom: 1px dashed #f9d0e3 !important;
  font-size: 13px !important;
}

.sidebar .wp-block-categories-list li:last-child {
  border-bottom: none !important;
}

.sidebar .wp-block-categories-list li a {
  color: #555 !important;
  text-decoration: none !important;
}


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

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

/*480px以下*/
@media screen and (max-width: 480px){
  /* review-style.css の @media (max-width: 600px) の中身をここに移動 */
  .rv-header__title { font-size: 18px; }
  .rv-merit { flex-direction: column; gap: 8px; }
  .rv-merit__num { font-size: 22px; }
  .rv-sim { grid-template-columns: 1fr; }
  .rv-btn { font-size: 15px; padding: 14px 16px; }
.rv-related__grid { grid-template-columns: 1fr; }
	
}