プロフィールカード

<div class="card05-01-09">
          <div class="cover05-01-09"></div>
          <div class="ava05-01-09">YK</div>
          <h4>山田 桂子</h4>
          <p>フォトグラファー / 東京</p>
          <div class="sns05-01-09">
            <a class="ic05-01-09" href="#" onclick="return false" aria-label="X"><svg viewBox="0 0 24 24" width="14" height="14" fill="currentColor"><path d="M18.9 2H22l-6.8 7.8L23.2 22h-6.3l-4.9-6.4L6.4 22H3.2l7.3-8.3L2.5 2h6.4l4.4 5.9L18.9 2zm-1.1 18h1.7L7.1 3.9H5.3L17.8 20z"/></svg></a>
            <a class="ic05-01-09" href="#" onclick="return false" aria-label="Instagram"><svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="5"/><circle cx="12" cy="12" r="4"/><circle cx="17.2" cy="6.8" r="1.2" fill="currentColor" stroke="none"/></svg></a>
            <a class="ic05-01-09" href="#" onclick="return false" aria-label="YouTube"><svg viewBox="0 0 24 24" width="14" height="14" fill="currentColor"><path d="M23 7.5s-.2-1.6-.9-2.3c-.9-.9-1.9-.9-2.4-1C16.5 4 12 4 12 4s-4.5 0-7.7.2c-.5.1-1.5.1-2.4 1C1.2 5.9 1 7.5 1 7.5S.8 9.4.8 11.3v1.4c0 1.9.2 3.8.2 3.8s.2 1.6.9 2.3c.9.9 2 .9 2.5 1 1.9.2 7.6.2 7.6.2s4.5 0 7.7-.2c.5-.1 1.5-.1 2.4-1 .7-.7.9-2.3.9-2.3s.2-1.9.2-3.8v-1.4c0-1.9-.2-3.8-.2-3.8zM9.8 15.3V8.7l6.2 3.3-6.2 3.3z"/></svg></a>
          </div>
        </div>

.prev.d05-01-09{background:#f1f2f5}
        .d05-01-09 .card05-01-09{
          position:relative;width:210px;background:#fff;border-radius:14px;
          overflow:hidden;text-align:center;padding-bottom:44px;
          box-shadow:0 6px 16px rgba(20,25,40,.14);cursor:pointer;
        }
        .d05-01-09 .cover05-01-09{
          height:62px;
          background:linear-gradient(120deg,#c98ad4 0%,#8a7fd4 60%,#6ab0d4 100%);
        }
        .d05-01-09 .ava05-01-09{
          width:58px;height:58px;border-radius:50%;margin:-29px auto 8px;
          background:linear-gradient(135deg,#f0c27b,#d98956);
          border:3px solid #fff;color:#fff;font-weight:700;font-size:14px;
          display:flex;align-items:center;justify-content:center;position:relative;
        }
        .d05-01-09 .card05-01-09 h4{margin:0 0 4px;font-size:14px;color:#222}
        .d05-01-09 .card05-01-09 > p{margin:0;font-size:10.5px;color:#999}
        .d05-01-09 .sns05-01-09{
          position:absolute;left:0;right:0;bottom:0;height:38px;
          display:flex;align-items:center;justify-content:center;gap:14px;
          background:#2b3560;transform:translateY(100%);
          transition:transform .35s cubic-bezier(.22,.61,.36,1);
        }
        .d05-01-09 .card05-01-09:hover .sns05-01-09{transform:translateY(0)}
        .d05-01-09 .ic05-01-09{
          color:#fff;opacity:.85;display:flex;cursor:pointer;
          transition:opacity .2s,transform .2s;
        }
        .d05-01-09 .ic05-01-09:hover{opacity:1;transform:scale(1.2)}