週間タイムテーブル

<div class="d10-02-08-tt">
          <div class="d10-02-08-corner"></div>
          <div class="d10-02-08-col d10-02-08-time"><span>9</span><span>10</span><span>11</span><span>12</span></div>
          <div class="d10-02-08-body">
            <div class="d10-02-08-head"><span>月</span><span>火</span><span>水</span><span>木</span><span>金</span></div>
            <div class="d10-02-08-grid">
              <div class="d10-02-08-ev d10-02-08-ev1" style="grid-column:1;grid-row:1/3" data-tip="朝礼 9:00">朝礼</div>
              <div class="d10-02-08-ev d10-02-08-ev2" style="grid-column:2;grid-row:2/4" data-tip="会議 10:00">会議</div>
              <div class="d10-02-08-ev d10-02-08-ev3" style="grid-column:4;grid-row:1/2" data-tip="研修 9:00">研修</div>
              <div class="d10-02-08-ev d10-02-08-ev1" style="grid-column:5;grid-row:3/5" data-tip="面談 11:00">面談</div>
            </div>
          </div>
        </div>

.d10-02-08-tt{display:grid;grid-template-columns:22px 1fr;grid-template-rows:auto 1fr;width:230px;font-size:11px}
        .d10-02-08-corner{grid-column:1;grid-row:1}
        .d10-02-08-time{grid-column:1;grid-row:2;display:grid;grid-template-rows:repeat(4,26px);color:#94a3b8;font-size:10px}
        .d10-02-08-time span{display:flex;align-items:flex-start;justify-content:flex-end;padding-right:3px}
        .d10-02-08-head{display:grid;grid-template-columns:repeat(5,1fr);text-align:center;color:#64748b;font-size:10px;margin-bottom:2px}
        .d10-02-08-grid{position:relative;display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(4,26px);gap:2px;background:linear-gradient(#eef2f7 1px,transparent 1px);background-size:100% 26px}
        .d10-02-08-ev{border-radius:4px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:10px;cursor:default;position:relative;overflow:visible}
        .d10-02-08-ev1{background:#6366f1}.d10-02-08-ev2{background:#14b8a6}.d10-02-08-ev3{background:#f59e0b}
        .d10-02-08-ev::after{content:attr(data-tip);position:absolute;bottom:105%;left:50%;transform:translateX(-50%);background:#0f172a;color:#fff;padding:3px 7px;border-radius:5px;font-size:10px;white-space:nowrap;opacity:0;pointer-events:none;transition:.15s;z-index:5}
        .d10-02-08-ev:hover::after{opacity:1}