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

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

/* カテゴリーページの記事一覧を非表示 */
.archive.category .main .entry-card-wrap {
    display: none;
}
/*カテゴリーページの記事一覧を非表示にしたことで表示される404メッセージを非表示*/
.posts-not-found {
	display: none !important;
}
/* カテゴリーページのタイトルを非表示にする */
.archive-title {
    display: none;
}
/* カテゴリーページの記事型の投稿ページだけアイキャッチ非表示 */
.category .article .eye-catch,
.category .entry-card-thumb,
.category .eye-catch-wrap {
  display: none !important;
}
/*ページ内リンクのスクロール化*/
html {
	scroll-behavior: smooth;
}

/* ===========================
   口コミウィジェット
=========================== */

.review-wrapper {
  padding: 1rem 0 1.5rem;
}

/* タブバー */
.review-tab-bar {
  display: flex;
  border-bottom: 1px solid #e0e0e0;
  margin-bottom: 1.25rem;
}

.review-tab-button {
  flex: 1;
  padding: 10px 0;
  font-size: 14px;
  font-weight: 500;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  cursor: pointer;
  color: #888;
  transition: color .15s, border-color .15s;
}

.review-tab-button.is-active-good {
  color: #3B6D11;
  border-bottom-color: #639922;
}

.review-tab-button.is-active-bad {
  color: #A32D2D;
  border-bottom-color: #E24B4A;
}

/* 件数バッジ */
.review-tab-count {
  display: inline-block;
  font-size: 11px;
  padding: 1px 7px;
  border-radius: 10px;
  font-weight: 500;
  margin-left: 6px;
}

.review-tab-count--good {
  background: #EAF3DE;
  color: #3B6D11;
}

.review-tab-count--bad {
  background: #FCEBEB;
  color: #A32D2D;
}

/* パネル */
.review-panel {
  display: none;
}

.review-panel.is-active {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

@media (max-width: 600px) {
  .review-panel.is-active {
    grid-template-columns: 1fr;
  }
}

/* カード */
.review-card {
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 12px;
  padding: 16px;
}

.review-card--good {
  border-left: 3px solid #639922;
  border-radius: 0 12px 12px 0;
}

.review-card--bad {
  border-left: 3px solid #E24B4A;
  border-radius: 0 12px 12px 0;
}

/* 属性・利用歴 */
.review-meta {
  margin-bottom: 8px;
}

.review-meta-name {
  font-size: 13px;
  font-weight: 500;
  color: #111;
  margin: 0 0 2px;
}

.review-meta-detail {
  font-size: 11px;
  color: #888;
  margin: 0;
}

/* 星評価 */
.review-stars {
  display: flex;
  gap: 2px;
  margin-bottom: 10px;
}

.review-star {
  font-size: 14px;
  color: #ddd;
}

.review-star--good {
  color: #639922;
}

.review-star--bad {
  color: #E24B4A;
}

/* 口コミ本文 */
.review-text {
  font-size: 13px;
  color: #222;
  line-height: 1.7;
  margin: 0;
}



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

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

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