.become-page { overflow: hidden; }
.become-page .move-wiggle { animation-duration: 10s; }

.become-hero-section { padding: 40px 0; text-align: center; }
.become-hero-section .hero-content h2 { font-size: var(--fs-46); font-weight: 700; font-family: var(--root-font-mont); }
.become-hero-section .hero-content p { margin-top: 20px; font-weight: 300; color:var(--root-color-secondary); font-size: var(--fs-18); }
.become-hero-section .hero-image { position: relative; max-width: 1193px; margin: 52px auto 0; aspect-ratio: 1193/450; pointer-events: none; }
.become-hero-section .hero-image img { position: absolute; inset:0; }
.become-hero-section .hero-image > div { position: absolute; inset:0; }


.table-section { padding-bottom: 120px; }
.table-section table { width: 100%; border-collapse: collapse; }

/* thead */
.table-section table tr:first-child th:first-child > div { border-radius:16px 16px 0 0; }
.table-section table tr:first-child th:nth-child(2) > div { border-radius:16px 16px 0 0; border-top:1px solid #CCCCCC; }
.table-section table tr:first-child th:nth-child(3) > div { border-radius:16px 16px 0 0; border-top:1px solid #E66C5C; }
.table-section table tr:first-child th:nth-child(4) > div { border-radius:16px 16px 0 0; border-top:1px solid #1D2247; }
.table-section table tr:first-child th:nth-child(5) > div { border-radius:16px 16px 0 0; border-top:1px solid #1D2247; }
.table-section table th > div { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; gap:4px; text-align: center; height: 95px; font-size: var(--fs-22); }
.table-section table th > div::after { content: ''; position: absolute; left:10%; bottom:0; width: 80%; height: 1px; background: black; }
.table-section table th > div small { font-weight: 400; }
.table-section table th:nth-child(1) > div:after { background: white; }
.table-section table th:nth-child(3) > div:after { background: var(--root-color-secondary); }
.table-section table th:nth-child(4) > div:after { background: #1D2247; }
.table-section table th:nth-child(5) > div:after { background: #1D2247; }

/* tbody */
.table-section table :where(th:not(:last-child), td:not(:last-child)) > div { margin-right: 10px; }
.table-section table :where(th:nth-child(1), td:nth-child(1)) > div { margin-right:14px; background: #1D2247; color:white; }
.table-section table :where(th:nth-child(2), td:nth-child(2)) > div { border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; }
.table-section table :where(th:nth-child(3), td:nth-child(3)) > div { border-left:1px solid #E66C5C; border-right:1px solid #E66C5C; }
.table-section table :where(th:nth-child(4), td:nth-child(4)) > div { border-left:1px solid #1D2247; border-right:1px solid #1D2247; }
.table-section table :where(th:nth-child(5), td:nth-child(5)) > div { border-left:1px solid #1D2247; border-right:1px solid #1D2247; }
.table-section table td > div { position: relative; display: flex; align-items: center; justify-content: center; text-align: center; height: 70px; }
.table-section table td > div::after { content: ''; position: absolute; left:10%; bottom:0; width: 80%; height: 1px; background: black; opacity: 0.1; }

/* last tr */
.table-section table tr:nth-last-child(2) td > div { height: 82px; padding-bottom: 10px; }
.table-section table tr:nth-last-child(2) td > div::after { display: none; }
.table-section table tr:nth-last-child(2) td:first-child > div { border-radius:0 0 16px 16px; }
.table-section table tr:nth-last-child(2) td:nth-child(2) > div { border-radius:0 0 16px 16px; border-bottom:1px solid #CCCCCC; }
.table-section table tr:nth-last-child(2) td:nth-child(3) > div { border-radius:0 0 16px 16px; border-bottom:1px solid #E66C5C; }
.table-section table tr:nth-last-child(2) td:nth-child(4) > div { border-radius:0 0 16px 16px; border-bottom:1px solid #1D2247; }
.table-section table tr:nth-last-child(2) td:nth-child(5) > div { border-radius:0 0 16px 16px; border-bottom:1px solid #1D2247; }

/* button tr */
.table-section table tr:last-child td > div { margin-top:6px; background: white; border:none; }
.table-section table tr:last-child td > div::after { display: none; }
.table-section table tr:last-child td:nth-child(1) > div { color:var(--color-sub); font-size: var(--fs-16); justify-content: start; align-items: start; text-align: left; }

.table-section table { min-width: 830px; }
.table-section .table-wrap { overflow-x: auto; }

.works-section { padding: 100px 0 160px; background: #F8F9FA; }
.works-section h3 { margin-bottom: 60px; font-weight: 800; font-size: var(--fs-32); text-align: center; }
.works-section .works-list ul { display: flex; flex-direction: column; gap:50px; }
.works-section .works-list li { display: flex; align-items: center; }
.works-section .works-list li:nth-child(even) { flex-direction: row-reverse; }
.works-section .works-list li > div { flex:1; }
.works-section .list-image { border-radius: 16px; overflow: hidden; }
.works-section .list-text { padding: 80px; }
.works-section .list-text .list-step { display: flex; align-items: center; justify-content: center; width: 120px; padding-bottom: 9px; margin-bottom: 5px; background: url('/images/sub/get_started/5__1.svg') no-repeat center/contain; aspect-ratio: 120/53; color:var(--root-color-secondary); font-weight: 800; }
.works-section .list-text h4 { font-weight: 800; font-size: var(--fs-36); color:var(--root-color-secondary); }
.works-section .list-text p { margin-top: 36px; font-size: var(--fs-18); line-height: 1.6; }


.faq-section { padding: 100px 0 120px; }
.faq-section h3 { margin-bottom: 26px; font-weight: 800; font-size: var(--fs-20); color:var(--root-color-secondary); }
.faq-section .faq-list li { margin-top: 20px; padding: 25px 40px 40px; border:1px solid #CCCCCC; border-radius: 8px; }
.faq-section .faq-list li .faq-title { display: flex; gap:14px; margin-bottom: 20px; font-weight: 700; font-size: var(--fs-16); }
.faq-section .faq-list li .faq-title .faq-mark { width: 65px; padding: 6px; display: flex; align-items: center; justify-content: center; background: #1D2247; border-radius: 50px; color:white; }
.faq-section .faq-list li .faq-title p:not(.faq-mark) { margin-top: 6px; }
.faq-section .faq-list li .faq-content { display: flex; gap:16px; padding: 20px 30px; background: #F8F9FA; border-radius: 8px; line-height: 1.6; }
.faq-section .faq-list li .faq-content .faq-mark { display: flex; align-items: center; justify-content: center; height: fit-content; padding: 7px 14px; font-weight: 700; font-size: 14px; border:1px solid #1D2247; color:#1D2247; border-radius: 50px; background: white; }
.faq-section .faq-list li .faq-content p:not(.faq-mark) { margin-top: 6px; }

@media screen and (max-width: 1299px) {
	.works-section .list-text { padding: 0 40px; }
	.works-section .list-text p { margin-top: 24px; }
}

@media screen and (max-width: 1023px) {
	.works-section { padding: 80px 0 120px; }
	.works-section .list-text .list-step { width: 100px; }
}

@media screen and (max-width: 767px) {
	.works-section { padding: 60px 0 80px; }
	.works-section .list-text { padding: 0 16px; }
	.works-section .works-list li:nth-child(even),
	.works-section .works-list li { flex-direction: column; }
	.faq-section .faq-list li .faq-content { flex-direction: column; gap:4px; padding: 16px 20px; }
	.faq-section .faq-list li .faq-content .faq-mark { width: fit-content; padding: 4px 13px; }
	.faq-section .faq-list li .faq-title .faq-mark { width: 55px; }
	.faq-section .faq-list li { padding: 20px 24px 24px; }
}