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


/*************************************************************************/ 
/* レーティング用 2024.02.12                                             */
/*************************************************************************/
.star5_rating{
	position: relative;
	z-index: 0;
	display: inline-block;
	white-space: nowrap;
	color: #cccccc; /* グレーカラー 自由に設定化 */
	/*font-size: 20px;*/  /* フォントサイズ 自由に設定化 */
}

.star5_rating:before, .star5_rating:after{
	content: '★★★★★';
}

.star5_rating:after{
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	overflow: hidden;
	white-space: nowrap;
	color: #ffcf32; /* イエローカラー 自由に設定化 */
}


.star5_rating[data-rate="5.0"]:after{ width: 100%;} /* 星5 */
.star5_rating[data-rate="4.5"]:after{ width: 90%; } /* 星4.5 */
.star5_rating[data-rate="4.0"]:after{ width: 80%; } /* 星4 */
.star5_rating[data-rate="3.5"]:after{ width: 70%; } /* 星3.5 */
.star5_rating[data-rate="3.0"]:after{ width: 60%; } /* 星3 */
.star5_rating[data-rate="2.5"]:after{ width: 50%; } /* 星2.5 */
.star5_rating[data-rate="2.0"]:after{ width: 40%; } /* 星2 */
.star5_rating[data-rate="1.5"]:after{ width: 30%; } /* 星1.5 */
.star5_rating[data-rate="1.0"]:after{ width: 20%; } /* 星1 */
.star5_rating[data-rate="0.5"]:after{ width: 10%; } /* 星0.5 */
.star5_rating[data-rate="0.0"]:after{ width:  0%; } /* 星0 */




/*************************************************************************/ 
/* 女優画像リンク横並び 2026.01.17                                       */
/*************************************************************************/
.actress-list {
  display: flex;
  flex-wrap: wrap;          /* 複数人・スマホ対応 */
  gap: 16px;                /* 画像間の余白 */
  justify-content: flex-start;
}

.actress-item {
  width: 140px;             /* 画像＋名前の横幅 */
  text-align: center;
  margin: 0;
}

.actress-item img {
  width: 100%;
  height: auto;
  border-radius: 6px;       /* 好みで */
}

.actress-item figcaption {
  font-size: 14px;
  margin-top: 6px;
}

/*************************************************************************/ 
/* Cocoon ItemBox 開始位置揃え 2026.02.02                                */
/*************************************************************************/
/* 各行を2列構造にする */
.item-meta {
  font-size: clamp(14px, 1.4vw, 18px);
  line-height: 1.6;
}

.item-meta .label,
.item-meta .value {
  vertical-align: top;
}

/* 1行ラッパー代わり */
.item-meta .label {
  display: inline-block;
  width: 10em;        /* ← ラベル幅（お好みで調整） */
}

.item-meta .value {
  display: inline-block;
  width: calc(100% - 10em);
}

/* 太字バージョン */
.item-meta-bold .label {
  display: inline-block;
  width: 10em;
  font-weight: bold;
}

.item-meta-bold .value {
  display: inline-block;
  width: calc(100% - 10em);
}


/*************************************************************************/
/* 総合評価ボックス内の区切り線調整  2026.02.02                          */
/*************************************************************************/
.rating-separator {
  margin: 0.5em 0;
  border: none;
  border-top: 1px solid #e0e0e0;
}

/*************************************************************************/
/* サイドバーのプロフィールを縦並び（スマホでも自然）  2026.03.01修正案  */
/*************************************************************************/
.sidebar-profile {
  display: flex;
  flex-direction: column;     /* ← これで縦に並ぶ */
  gap: 20px;                  /* ゆなと管理人の間を少し広めに */
  align-items: center;        /* 中央寄せで可愛く */
}

.sidebar-profile .profile-item {
  text-align: center;         /* 各ブロックを中央揃え */
  width: 100%;                /* フル幅で文字が読みやすい */
}

.sidebar-profile .profile-icon img {
  width: 90px;                /* 少し大きくしてもOK */
  height: 90px;
  border-radius: 50%;
  object-fit: cover;
}

.sidebar-profile .profile-name {
  margin-top: 8px;
  font-size: 1em;
  font-weight: bold;
}

.sidebar-profile .profile-desc {  /* 説明文用のクラスを追加推奨 */
  font-size: 0.85em;
  text-align: left;
  line-height: 1.5;
  margin-top: 4px;
  color: #555;
}