@layer sections {
#care { padding: var(--space-1) 0; }
#care .ca-list { margin-top: clamp(48px, 6vw, 80px); border-bottom: 1.5px solid var(--color-2); }
#care .ca-row { position: relative; display: grid; grid-template-columns: clamp(170px, 19vw, 250px) minmax(0, 1fr) minmax(150px, 210px); gap: clamp(20px, 3vw, 48px); align-items: center; padding: clamp(22px, 2.6vw, 34px) 0; }
#care .ca-rule { position: absolute; inset: 0 0 auto 0; height: 1.5px; background: var(--color-2); transform-origin: 0 50%; }
#care .ca-frame { aspect-ratio: 5 / 4; overflow: hidden; background: var(--color-3); }
#care .ca-frame img { width: 100%; height: 100%; object-fit: cover; }
#care .ca-row:nth-child(6n + 1) .ca-frame { border-radius: 50%; aspect-ratio: 1; width: 82%; }
#care .ca-row:nth-child(6n + 2) .ca-frame { border-radius: 999px 999px 0 0; }
#care .ca-row:nth-child(6n + 3) .ca-frame { border-radius: 0 var(--radius-4) 0 0; }
#care .ca-row:nth-child(6n + 4) .ca-frame { border-radius: var(--radius-3); }
#care .ca-row:nth-child(6n + 5) .ca-frame { border-radius: var(--radius-4) var(--radius-3) var(--radius-4) var(--radius-3); }
#care .ca-row:nth-child(6n + 6) .ca-frame { border-radius: 0 0 999px 999px; }
#care .ca-text { display: grid; gap: 10px; }
#care .ca-text .m-text-3 { font-size: clamp(24px, 2.5vw, 34px); }
#care .ca-text .m-text { max-width: 52ch; }
#care .ca-note { display: grid; gap: 8px; justify-items: start; }
#care .ca-note .m-shape-2, #care .ca-note .m-shape-3, #care .ca-note .m-shape-4, #care .ca-note .m-shape-5, #care .ca-note .m-shape-6, #care .ca-note .m-shape { --m-shape-size: 22px; }
#care .ca-row:nth-child(6n + 1) .ca-note > span:first-child { background: var(--color-6); }
#care .ca-row:nth-child(6n + 2) .ca-note > span:first-child { background: var(--color-7); }
#care .ca-row:nth-child(6n + 3) .ca-note > span:first-child { background: var(--color-8); }
#care .ca-row:nth-child(6n + 4) .ca-note > span:first-child { background: var(--color-9); }
#care .ca-row:nth-child(6n + 5) .ca-note > span:first-child { background: var(--color-5); }
#care .ca-row:nth-child(6n + 6) .ca-note > span:first-child { background: var(--color-10); }
@media (max-width: 800px) {
  #care .ca-row { grid-template-columns: 112px minmax(0, 1fr); gap: 14px 18px; align-items: start; }
  #care .ca-row:nth-child(6n + 1) .ca-frame { width: 100%; }
  #care .ca-note { grid-column: 2; }
  #care .ca-note .m-shape-2, #care .ca-note .m-shape-3, #care .ca-note .m-shape-4, #care .ca-note .m-shape-5, #care .ca-note .m-shape-6, #care .ca-note .m-shape { display: none; }
}
}
