ランキング形式KPI一覧カード

<div class="d05-13-10-card">
          <p class="d05-13-10-title">売上ランキング</p>
          <div class="d05-13-10-row">
            <span class="d05-13-10-rank d05-13-10-r1">1</span>
            <span class="d05-13-10-name">東京店</span>
            <span class="d05-13-10-num">&yen;842,300</span>
          </div>
          <div class="d05-13-10-row">
            <span class="d05-13-10-rank d05-13-10-r2">2</span>
            <span class="d05-13-10-name">大阪店</span>
            <span class="d05-13-10-num">&yen;613,900</span>
          </div>
          <div class="d05-13-10-row">
            <span class="d05-13-10-rank d05-13-10-r3">3</span>
            <span class="d05-13-10-name">福岡店</span>
            <span class="d05-13-10-num">&yen;488,150</span>
          </div>
        </div>

.d05-13-10-card{
          width:100%;max-width:280px;background:#fff;border:1px solid #e5e7eb;
          border-radius:14px;padding:18px 18px;box-sizing:border-box;
        }
        .d05-13-10-title{margin:0 0 12px;font-size:12.5px;font-weight:700;color:#6b7280}
        .d05-13-10-row{display:flex;align-items:center;gap:10px;padding:6px 0;border-top:1px solid #f3f4f6}
        .d05-13-10-row:first-of-type{border-top:none}
        .d05-13-10-rank{
          flex:none;width:20px;height:20px;border-radius:50%;background:#e5e7eb;color:#4b5563;
          font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;
        }
        .d05-13-10-r1{background:#facc15;color:#78350f}
        .d05-13-10-r2{background:#cbd5e1;color:#334155}
        .d05-13-10-r3{background:#fdba74;color:#7c2d12}
        .d05-13-10-name{flex:1;font-size:12.5px;color:#374151}
        .d05-13-10-num{font-size:12.5px;font-weight:700;color:#1f2937}