.elementor-46 .elementor-element.elementor-element-8f1794a{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-46 .elementor-element.elementor-element-1b6503a{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:10px;--padding-bottom:10px;--padding-left:10px;--padding-right:10px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-46 .elementor-element.elementor-element-49d884c > .elementor-widget-container{margin:20px 20px 10px 20px;padding:0px 0px 0px 0px;}.elementor-46 .elementor-element.elementor-element-1c7a43f{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-46 .elementor-element.elementor-element-1c7a43f:not(.elementor-motion-effects-element-type-background), .elementor-46 .elementor-element.elementor-element-1c7a43f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}@media(min-width:768px){.elementor-46 .elementor-element.elementor-element-8f1794a{--content-width:80%;}.elementor-46 .elementor-element.elementor-element-1b6503a{--width:80%;}.elementor-46 .elementor-element.elementor-element-1c7a43f{--width:80%;}}/* Start custom CSS for heading, class: .elementor-element-49d884c */.page-ranking-title .elementor-heading-title { /* Elementorの見出しウィジェットの実際のタイトル要素にスタイルを当てる場合 */
    font-size: 2.8em; /* 例: さらに大きく */
    color: #1A2B48; /* 例: 濃いネイビー */
    padding-bottom: 15px;
    margin-bottom: 30px;
    border-bottom: 3px solid #0051e0; /* アクセントカラーの太い下線 */
    display: inline-block; /* 下線を文字の幅に合わせる */
    text-shadow: 1px 1px 2px rgba(0,0,0,0.1); /* 薄いテキストシャドウ */
}

/* 中央揃えにしたい場合、ウィジェットの設定で中央揃えにするか、
   このウィジェットを囲むコンテナ（カラムやセクション）でテキスト中央揃えを設定します。
   または、以下のようにウィジェット自体にマージンで中央寄せを試みることもできますが、
   Elementorの配置設定が優先されることが多いです。 */
.elementor-widget-heading.page-ranking-title {
    text-align: center; /* ウィジェット全体を中央寄せしようと試みる */
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-70505bc *//* 全ユーザー口コミ一覧 ([all_user_reviews_list] ショートコード用) の追加装飾 */

.all-reviews-list.review-list {
    /* リスト全体の外観調整 */
    margin-top: 20px;
}

.review-item {
    background-color: #f9f9f9; /* 各口コミの背景色 (薄いグレー) */
    border: 1px solid #e0e0e0;   /* 枠線 */
    border-radius: 8px;          /* 角を丸くする */
    padding: 20px;               /* 内側の余白 */
    margin-bottom: 25px;         /* 各口コミ間の余白 */
    box-shadow: 0 2px 5px rgba(0,0,0,0.05); /* 僅かな影で立体感を出す (任意) */
}

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

.review-author {
    display: flex;
    align-items: center;
    margin-bottom: 12px; /* 投稿者情報とメタ情報の間 */
}

.review-author .avatar {
    border-radius: 50%;    /* アバターを丸く */
    margin-right: 12px;
    border: 2px solid #0051e0; /* アバターにアクセントカラーの枠線 (任意) */
}

.review-author .author-name {
    font-weight: bold;
    font-size: 1.1em;
    color: #333;
    text-decoration: none;
}
.review-author .author-name:hover {
    color: #0051e0; /* ホバー時の色をアクセントカラーに */
    text-decoration: underline;
}

.review-meta-container {
    font-size: 0.9em;
    color: #666;      /* メタ情報の色を少し薄く */
    margin-bottom: 15px; /* メタ情報と本文の間 */
    padding-bottom: 10px;
    border-bottom: 1px dashed #d0d0d0; /* メタ情報の下に区切り線 */
}

.review-meta-container .review-date {
    margin-right: 15px;
}

.review-meta-container .review-room {
    display: inline; /* 日付と同じ行に表示したい場合 */
}

.review-meta-container .review-room a.review-room-link {
    font-weight: 500; /* 少し太く */
    color: #444;
    text-decoration: none;
}
.review-meta-container .review-room a.review-room-link:hover {
    color: #0051e0;
    text-decoration: underline;
}

.review-content.wpautop-text {
    line-height: 1.7;    /* 本文の行間を調整 */
    color: #333;        /* 本文の文字色 */
    margin-bottom: 15px; /* 本文と画像の間 */
}
.review-content.wpautop-text p:last-child {
    margin-bottom: 0;
}

.review-image {
    text-align: left; /* 画像を左寄せ (または center, right) */
    margin-top: 10px;
}

.review-image img {
    /* style属性でmax-widthを設定済みですが、CSSでも指定可能 */
    /* max-width: 300px; */ /* PHP側で設定した値と合わせるか、こちらで一括指定 */
    height: auto;
    border-radius: 6px; /* 画像の角も少し丸く */
    border: 1px solid #ddd; /* 画像に薄い枠線 */
    padding: 3px;          /* 枠線と画像の間に少し余白 */
    background-color: #fff; /* 画像の背景を白に（透過画像の場合など） */
}

/* ページネーションリンクのスタイルも以前のものを参考に調整してください */
.pagination-links {
    margin-top: 40px;
    margin-bottom: 30px;
    text-align: center;
}
/* (以前提案した .pagination-links ul li などのスタイルが適用されます) */

/* ページネーションリンクのスタイル (レイアウト崩れ対策) */
.pagination-links {
    margin-top: 40px;
    margin-bottom: 30px;
    text-align: center; /* 親コンテナを中央寄せ */
    clear: both; /* 上の要素の回り込みを解除 */
}

/* WordPressのpaginate_linksが生成するulには通常 'page-numbers' クラスが付与されます */
.pagination-links ul.page-numbers {
    list-style: none !important; /* リストマーカーを強制的に消す */
    padding: 0 !important;       /* 内側のパディングを強制的に消す */
    margin: 0 auto !important;     /* ul要素自体を中央に配置 */
    display: inline-flex !important; /* ★ Flexboxで横並びを強制 (inline-flexで親の中央寄せと連携) */
    flex-wrap: wrap;             /* 画面幅が狭い場合に折り返す */
    justify-content: center;     /* Flexアイテムを中央寄せ */
    gap: 5px;                    /* 各ページ番号間の余白 */
}

/* WordPressのpaginate_linksで type='list' を指定した場合、各要素はliで囲まれます */
.pagination-links ul.page-numbers li {
    margin: 0 2px !important; /* 各li要素の左右の余白を少し調整 */
    display: inline !important; /* li要素自体はインラインでOK (親がflexなので) あるいは display: block; でも可 */
}

/* ページ番号や「前へ」「次へ」のリンク（aタグやspanタグ）のスタイル */
.pagination-links .page-numbers { /* .page-numbers は a や span に付くクラス */
    display: block; /* 各リンクをブロック要素にしてパディング等を適用しやすくする */
    padding: 8px 14px;
    border: 1px solid #ddd;
    text-decoration: none;
    color: #0051e0; /* ユーザー様のサイトのアクセントカラー（オレンジ系） */
    background-color: #fff;
    border-radius: 4px;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    white-space: nowrap; /* 「次へ »」などが途中で改行されるのを防ぐ */
}

.pagination-links .page-numbers:hover {
    background-color: #f5f5f5;
    border-color: #0051e0;
    color: #D85E00; /* オレンジ系の少し濃い色 */
}

.pagination-links .page-numbers.current { /* 現在のページ */
    background-color: #0051e0;
    color: #fff;
    border-color: #0051e0;
    font-weight: bold;
}

.pagination-links .dots { /* 「...」のスタイル */
    padding: 8px 5px;
    border: 1px solid transparent; /* 他の要素と高さを合わせるため枠線は透明に */
    align-self: center; /* Flexアイテムとして垂直方向中央揃え */
    color: #0051e0; /* 色を合わせる */
}/* End custom CSS */