位置情報カード（座標風）

<div class="d10-04-10-card">
          <p class="d10-04-10-name">みどりベーカリー</p>
          <p class="d10-04-10-coord">N 00.00000 / E 000.00000</p>
          <div class="d10-04-10-addr">
            <span class="d10-04-10-txt">みどり市さくら町1-2-3</span>
            <button class="d10-04-10-copy" type="button">コピー</button>
          </div>
          <span class="d10-04-10-toast">コピーしました</span>
        </div>

.d10-04-10-card{position:relative;width:100%;max-width:300px;background:#fff;border:1px solid #e6ecf0;border-radius:12px;padding:18px 20px;box-shadow:0 6px 18px rgba(0,0,0,.08)}
        .d10-04-10-name{margin:0 0 6px;font-weight:700;font-size:16px;color:#222}
        .d10-04-10-coord{margin:0 0 12px;font-size:12px;color:#8a949b;font-family:monospace;letter-spacing:.5px}
        .d10-04-10-addr{display:flex;align-items:center;gap:10px}
        .d10-04-10-txt{flex:1;font-size:13px;color:#445}
        .d10-04-10-copy{border:none;background:#2f7fef;color:#fff;font-size:12px;font-weight:600;padding:7px 14px;border-radius:6px;cursor:pointer;transition:background .2s}
        .d10-04-10-copy:hover{background:#2468c9}
        .d10-04-10-toast{position:absolute;left:50%;bottom:-14px;transform:translate(-50%,8px);background:#233;color:#fff;font-size:11px;padding:5px 12px;border-radius:6px;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}
        .d10-04-10-toast.is-on{opacity:1;transform:translate(-50%,0)}

(function(){
        var root=document.getElementById('item-10-04-10');if(!root)return;
        var btn=root.querySelector('.d10-04-10-copy'),toast=root.querySelector('.d10-04-10-toast'),txt=root.querySelector('.d10-04-10-txt');
        btn.addEventListener('click',function(){
          var val=txt.textContent;
          function show(){toast.classList.add('is-on');setTimeout(function(){toast.classList.remove('is-on');},1600);}
          if(navigator.clipboard&&navigator.clipboard.writeText){navigator.clipboard.writeText(val).then(show,show);}else{show();}
        });
      })();