金銀銅メダル風ランキングバッジ

<div class="d09-15-01-wrap">
          <div class="d09-15-01-medal">
            <div class="d09-15-01-circle d09-15-01-gold">1</div>
            <div class="d09-15-01-ribbon d09-15-01-ribbon1"></div>
            <p class="d09-15-01-label">金賞</p>
          </div>
          <div class="d09-15-01-medal">
            <div class="d09-15-01-circle d09-15-01-silver">2</div>
            <div class="d09-15-01-ribbon d09-15-01-ribbon2"></div>
            <p class="d09-15-01-label">銀賞</p>
          </div>
          <div class="d09-15-01-medal">
            <div class="d09-15-01-circle d09-15-01-bronze">3</div>
            <div class="d09-15-01-ribbon d09-15-01-ribbon3"></div>
            <p class="d09-15-01-label">銅賞</p>
          </div>
        </div>

.d09-15-01-wrap{display:flex;gap:22px;justify-content:center;align-items:flex-start}
        .d09-15-01-medal{display:flex;flex-direction:column;align-items:center;width:66px}
        .d09-15-01-circle{width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800;color:#fff;box-shadow:inset 0 -5px 7px rgba(0,0,0,.25),0 2px 4px rgba(0,0,0,.18);border:3px solid rgba(255,255,255,.65);box-sizing:border-box}
        .d09-15-01-gold{background:radial-gradient(circle at 35% 30%,#fff6d0,#f5c542 45%,#c9922a)}
        .d09-15-01-silver{background:radial-gradient(circle at 35% 30%,#f8fafc,#c7ccd1 45%,#8a9199)}
        .d09-15-01-bronze{background:radial-gradient(circle at 35% 30%,#f3cba3,#c97a3d 45%,#8a4a1f)}
        .d09-15-01-ribbon{width:0;height:0;margin-top:-2px;border-left:13px solid transparent;border-right:13px solid transparent;border-top:20px solid #b91c1c}
        .d09-15-01-ribbon2{border-top-color:#334155}
        .d09-15-01-ribbon3{border-top-color:#7c4a2d}
        .d09-15-01-label{margin:6px 0 0;font-size:11px;font-weight:700;color:#475569}