@charset "UTF-8";
/**
 * 口コミ表示用CSS
 * 
 * div data-star形式とプレーンテキスト形式の両方に対応
 * 1行インライン表示がコンセプト
 */

/* ========================================
   口コミリスト共通スタイル
   ======================================== */

/* 口コミリスト全体 */
.kuchikomi-list {
    list-style: none !important;
    padding: 8px 0 !important;
    margin: 0 !important;
}

/* 口コミ項目（共通） */
.kuchikomi-item {
    position: relative;
    font-size: 14px !important;
    line-height: 1.6;
    padding: 4px 0 4px 20px !important;
    margin-bottom: 4px;
}

.kuchikomi-item::before {
    position: absolute;
    left: 0;
    top: 4px;
    content: "\f27b";
    font-weight: 900;
    font-family: icomoon, fontawesome;
    color: #ff9002;
    font-size: 14px;
}

.kuchikomi-item:last-child {
    margin-bottom: 0;
}

/* ========================================
   プレーン形式（従来どおりのシンプル表示）
   ======================================== */
.kuchikomi-plain {
    /* 特別な追加スタイルなし、共通スタイルを使用 */
}

/* ========================================
   リッチ形式（div data-star）- 1行インライン表示
   ======================================== */

/* リッチ形式：星評価があるので口コミアイコンは非表示 */
/* 詳細度を上げて box2.css の .box-kuchikomi ul li:before (0,1,3) に勝つ */
.box-kuchikomi ul li.kuchikomi-rich::before,
.kuchikomi-rich::before {
    display: none;
}

.kuchikomi-rich {
    padding-left: 0 !important;  /* アイコン用の左余白を削除 */
}

/* 星評価 */
.kuchikomi-star {
    color: #FF6200;
    font-size: 12px;
    letter-spacing: 0;
    margin-right: 6px;
}

/* 口コミタイトル（インライン表示） */
.kuchikomi-title {
    font-weight: 700 !important;
    color: #222;
}

/* タイトルと本文の区切り */
.kuchikomi-title::after {
    content: "：";
    font-weight: normal;
    color: #666;
}

/* 口コミ本文（インライン表示） */
.kuchikomi-body {
    color: #444;
}

/* ========================================
   ボックス内での調整
   ======================================== */
.box-kuchikomi .kuchikomi-list {
    padding: 4px 0 !important;
}

/* 口コミeach用（個別ボックス）*/
.box-kuchikomi .kuchikomi-list:only-child .kuchikomi-item:only-child {
    margin-bottom: 0;
}