@charset "UTF-8";
body { background-color: #f1f1f1; min-width: var(--min-width); font-size: 12rem; }

.banner { aspect-ratio: var(--banner-aspect-ratio); }
.banner img { width: 100%; height: 100%; object-fit: cover; display: block; }

main { margin: 0 auto 60rem auto; width: 60vw; box-sizing: border-box; padding: 40rem 10%; background: #fff; min-width: 800rem; }

main > h1 { background: #000; color: #fff; font-size: 20rem; text-align: center; padding: 10rem 0; }
main > section { display: flex; flex-direction: column; gap: 80rem; margin-top: 40rem; }
main > section > div { position: relative; display: flex; gap: 60rem; }
main > section > div::after { content: ''; position: absolute; left: 0; bottom: -40rem; width: 100%; background: linear-gradient(to right, #333 60%, transparent 50%); background-size: 12rem 100%; background-repeat: repeat-x; height: 1rem; }
main > section > div:last-child::after { display: none; }
main > section > div > img { width: 380rem; }
main > section > div > p { padding: 0; margin: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; font-size: 14rem; gap: 10rem; }
main > section > div > p > span { padding: 4rem 15rem; border-radius: 14rem; background: #be0202; color: #fff; font-size: 14rem; width: 50rem; text-align: center; font-weight: 700; }
main > section > div > p > label { line-height: 28rem; width: 200rem; text-align: center; font-size: 16rem; color: #333; }
main > div { margin-top: 60rem; }
main > div > p { margin: 0; font-size: 14rem; line-height: 28rem; color: #666; }