/* 診断結果ページ専用のスタイル */
:root {
  --primary:#007AD2; --primary-dark:#052F87; --primary-light:#F4FCFF;
  --secondary:#0071BD; --text-primary:#052F87; --text-secondary:#0071BD;
  --background-light:#F4FCFF; --border-light:#E5E7EB;
  --gradient-primary:linear-gradient(135deg,#007AD2 0%, #052F87 100%);
  --gradient-cta:linear-gradient(135deg,#FF6B6B,#FF8E53,#FF6B6B);
}

/* header block */
.result-header{ text-align:center; margin-bottom:40px; background:linear-gradient(135deg, rgba(0,122,210,.08) 0%, rgba(5,47,135,.08) 100%); padding:40px 20px; border-radius:16px; box-shadow:0 10px 25px -3px rgba(0,0,0,.08); border:2px solid var(--border-light) }
.result-badge{ display:inline-block; background:linear-gradient(135deg,#007AD2,#052F87); color:#fff; padding:12px 24px; border-radius:25px; font-weight:bold; margin-bottom:20px }
.result-title{ font-size:2.2rem; font-weight:800; color:#052F87; margin-bottom:12px }
.result-description{ font-size:1.05rem; color:#0071BD; max-width:800px; margin:0 auto }

/* 戻るボタンのスタイル */
.result-navigation {
    margin-top: 24px;
    display: flex;
    justify-content: center;
}

.back-to-diagnosis-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    color: var(--primary);
    border: 2px solid var(--primary);
    padding: 12px 24px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 122, 210, 0.1);
}

.back-to-diagnosis-btn:hover {
    background: var(--primary);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 122, 210, 0.2);
}

.back-to-diagnosis-btn:active {
    transform: translateY(0);
}

.back-arrow {
    font-size: 1.1rem;
    font-weight: bold;
}

/* results list */
.c-results{ background:#fff; border-radius:16px; box-shadow:0 8px 32px rgba(0,0,0,.08); padding:24px; margin:0 auto 50px; max-width:1200px }
.c-inner{ max-width:1100px; margin:0 auto }
.c-results-list{ display:flex; flex-direction:column; gap:24px }
.c-case-item{ border:1.5px solid var(--border-light); border-radius:12px; overflow:hidden; background:#fff; transition:all .2s ease }
.c-case-item:hover{ transform:translateY(-2px); box-shadow:0 12px 28px rgba(0,0,0,.08); border-color:var(--primary) }
.c-case-item__title{ display:flex; align-items:center; justify-content:space-between; background:var(--background-light); color:var(--text-primary); margin:0; padding:16px 18px; border-bottom:1px solid var(--border-light) }
.c-case-item__product{ font-weight:700 }
.c-case-item__general{ display:flex; align-items:center; gap:10px; color:var(--text-secondary) }
.c-case-item__score{ font-size:1.1rem; font-weight:800; color:var(--primary) }
.c-case-item__body{ display:flex; gap:22px; padding:18px }
.c-case-item__left{ flex:0 0 300px }
.c-case-item__thumb img{ width:100%; height:auto; border-radius:8px; border:1px solid var(--border-light) }
.c-case-item__right{ flex:1 }
.c-case-item__recommend-title{ font-weight:700; margin:0 0 8px; color:var(--text-secondary) }
.c-case-item__recommend-txt{ line-height:1.9; color:var(--text-primary) }
.c-case-item__benefits{ display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--border-light) }
.c-case-item__benefits dl{ margin:0; padding:14px 16px; border-right:1px solid var(--border-light) }
.c-case-item__benefits dl:last-child{ border-right:none }
.c-case-item__btn-search{ display:flex; gap:14px; justify-content:center; padding:18px; border-top:1px solid var(--border-light) }
.c-btn{ display:inline-block; background:var(--gradient-cta); color:#fff; text-decoration:none; font-weight:800; padding:12px 22px; border-radius:8px; min-width:220px; text-align:center; box-shadow:0 8px 20px rgba(255,107,107,.3); text-shadow:0 1px 2px rgba(0,0,0,.15) }
.c-btn:hover{ filter:brightness(.98) saturate(1.05); transform:translateY(-1px) }
.c-btn02{ display:inline-block; background:#fff; color:var(--primary); border:2px solid var(--primary); text-decoration:none; font-weight:800; padding:12px 22px; border-radius:8px; min-width:200px; text-align:center; box-shadow:0 2px 0 rgba(0,0,0,.05) }
.c-btn02:hover{ background:var(--gradient-primary); color:#fff; border-color:transparent }
.c-case-item__star{ color:#ffd54f }

/* section heading */
.section-title{ font-size:2rem; font-weight:800; color:#052F87; text-align:center; margin:40px 0 24px; position:relative }
.section-title::after{ content:""; position:absolute; bottom:-10px; left:50%; transform:translateX(-50%); width:80px; height:4px; background:var(--gradient-cta); border-radius:2px }

/* ランキング表示用のスタイル */
.c-rank{ display:inline-flex; align-items:center; justify-content:center; background:var(--gradient-primary); color:#fff; border-radius:50%; width:32px; height:32px; font-weight:800; margin-right:8px }

/* 特徴タグのスタイル */
.agent-features {
    margin-top: 15px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.feature-tag {
    background: #E3F2FD;
    color: #1976D2;
    padding: 4px 12px;
    border-radius: 15px;
    font-size: 0.85rem;
    font-weight: 500;
}

/* ランキング別の特別なスタイル（黒色ボーダー） */
.c-case-item:nth-child(1),
.c-case-item:nth-child(2),
.c-case-item:nth-child(3),
.c-case-item:nth-child(4),
.c-case-item:nth-child(5) {
    border: 1px solid #000000;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* 未登録メッセージのスタイル */
.no-data-message {
    text-align: center;
    padding: 60px 20px;
    background: #f8f9fa;
    border: 2px dashed #dee2e6;
    border-radius: 12px;
    margin: 20px 0;
}

.no-data-message p {
    font-size: 1.1rem;
    color: #6c757d;
    margin: 10px 0;
}

.no-data-message p:first-child {
    font-size: 1.3rem;
    font-weight: 700;
    color: #495057;
}

/* 診断結果ページ専用のコンテンツ調整 */
.diagnosis-result-content {
    background: #fff;
    min-height: calc(100vh - 140px); /* ヘッダーとフッターの高さを考慮 */
    padding: 40px 0;
}

/* デバッグ情報のスタイル */
.debug-info {
    background: #f0f0f0;
    padding: 10px;
    margin: 10px 0;
    border: 1px solid #ccc;
}

.debug-info h4 {
    margin: 0 0 10px 0;
    color: #333;
}

.debug-info pre {
    background: #fff;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    overflow-x: auto;
    font-size: 12px;
}

@media (max-width:768px){ 
    .c-case-item__body{flex-direction:column; gap:14px; padding:14px} 
    .c-case-item__left{flex:auto} 
    .c-case-item__benefits{grid-template-columns:1fr} 
    .c-case-item__btn-search{flex-direction:column} 
    .result-title{ font-size:1.8rem }
    .section-title{ font-size:1.6rem }
    .footer-content{ flex-direction:column; gap:20px; text-align:center }
    .footer-links{ flex-wrap:wrap; justify-content:center }
    
    /* モバイル用の戻るボタンスタイル */
    .back-to-diagnosis-btn {
        padding: 10px 20px;
        font-size: 0.9rem;
        min-width: 140px;
    }
    
    .result-navigation {
        margin-top: 20px;
    }
}
