.p-aboutusHero { position: relative; z-index: 1;} .p-aboutusWork { z-index: 0; &::before { content: ''; position: absolute; inset: calc(var(--spc-36) * -1) 0 0 0; background-color: var(--c-black-100); z-index: -1; }} .p-aboutusWork-content + .p-aboutusWork-bottom { margin-top: var(--spc-12);} .p-aboutusWork-bottom { display: flex; flex-direction: column; gap: var(--spc-12);} .p-aboutusWorkSection + .p-aboutusWorkSection { margin-top: var(--spc-24);} .p-aboutusWorkSection-head { display: flex; align-items: center; gap: var(--spc-6); &::after { content: ''; flex: 1; height: .1rem; background-color: var(--c-black); } & + .p-aboutusWorkSection-content { margin-top: var(--spc-12); }} .p-aboutusWorkSection-content { display: flex; flex-direction: column; gap: var(--spc-6);} .p-aboutusWorkSection__repeat { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--spc-6);} .p-aboutusMessage-head { display: flex; flex-direction: column; gap: var(--spc-2); & + .p-aboutusMessage-content { margin-top: var(--spc-12); }} .p-aboutusMessage-content { display: flex; flex-direction: column; gap: var(--spc-6); & + .p-aboutusMessage-bottom { margin-top: var(--spc-12); }} .p-aboutusMessage-bottom { text-align: right;} .p-aboutusCompany { background-color: var(--c-black-900); * { color: var(--c-black-100); }} .p-aboutusCompany-head { display: flex; flex-direction: column; gap: var(--spc-2); & + .p-aboutusCompany-content { margin-top: var(--spc-12); }} .p-aboutusCompany-content { display: flex; flex-direction: column; gap: var(--spc-6); & > ul { display: flex; flex-direction: column; gap: var(--spc-6); }} .p-aboutusCompany__item { display: flex; flex-wrap: wrap; gap: var(--spc-6);} .p-aboutusCompany__item-head { width: 9.6rem;} .p-aboutusCompany__item-content { flex: 1;}