.sheet-note {
  display: grid;
  grid-template-columns: .82fr 1.18fr;
  gap: 80px;
  border-top: 1px solid var(--line);
  padding: 95px 0 105px;
}
.note-heading { position: sticky; top: 30px; align-self: start; }
.note-heading > span { color: var(--lime); font: 9px var(--mono); letter-spacing: 2px; }
.note-heading h2 { font: 500 clamp(35px,4.4vw,55px)/1.08 var(--display); letter-spacing: -1px; margin: 17px 0 0; }
.note-content > p { color: #a8b0bb; font: 15px/1.85 var(--serif); margin: 0 0 24px; }
.note-content > p:first-child::first-letter { float: left; color: var(--lime); font: 600 62px/.75 var(--display); padding: 12px 8px 0 0; }
.correction-note { border: 1px solid #667d2d; background: linear-gradient(145deg,#202817,#151b12); border-radius: 13px; padding: 20px 22px; margin-top: 35px; }
.correction-note b { color: var(--lime); font: 500 20px var(--display); }
.correction-note p { color: #aab2a2; font: 13px/1.75 var(--serif); margin: 10px 0 0; }
@media(max-width:800px){.sheet-note{grid-template-columns:1fr;gap:40px;padding:70px 0 80px}.note-heading{position:static}.note-heading h2{font-size:42px}}
@media(max-width:520px){.sheet-note{padding:55px 0 65px}.note-heading h2{font-size:35px}.note-content>p{font-size:14px}.correction-note{padding:17px}}