サービスカード(リンク付き)

<div class="d01-04-06-cards">
          <a class="d01-04-06-card" href="#item-01-04-06">
            <span class="d01-04-06-ic">
              <svg viewBox="0 0 24 24" width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="14" rx="2"/><path d="M3 9h18"/></svg>
            </span>
            <b>Web制作</b>
            <p>目的に合わせたサイトを構築します。</p>
            <span class="d01-04-06-more">詳しく<i>→</i></span>
          </a>
          <a class="d01-04-06-card" href="#item-01-04-06">
            <span class="d01-04-06-ic">
              <svg viewBox="0 0 24 24" width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 20V10M12 20V4M20 20v-7"/></svg>
            </span>
            <b>運用支援</b>
            <p>公開後の改善まで一気通貫で対応。</p>
            <span class="d01-04-06-more">詳しく<i>→</i></span>
          </a>
        </div>

.prev.d01-04-06{background:#f7f8fb}
        .d01-04-06-cards{display:flex;gap:16px;width:100%;max-width:460px}
        .d01-04-06-card{flex:1;display:block;text-decoration:none;background:#fff;border:1px solid #e6e9f0;border-radius:16px;padding:20px;transition:transform .3s ease,box-shadow .3s ease}
        .d01-04-06-card:hover{transform:translateY(-4px);box-shadow:0 18px 34px rgba(40,60,120,.16)}
        .d01-04-06-ic{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:12px;background:#eef2ff;color:#5b7cfa;margin-bottom:12px}
        .d01-04-06-card b{display:block;font-size:15px;color:#20263c;margin-bottom:6px}
        .d01-04-06-card p{margin:0 0 12px;font-size:12px;line-height:1.5;color:#6a7288}
        .d01-04-06-more{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:#5b7cfa}
        .d01-04-06-more i{font-style:normal;transition:transform .3s ease}
        .d01-04-06-card:hover .d01-04-06-more i{transform:translateX(6px)}