/* How It Works */
.how-hero-section { padding: 40px 0; text-align: center; }
.how-hero-section .inner,
.how-hero-section .inner-xl { position: relative; max-width: 1024px; }
.how-hero-section .hero-content h2 { font-size: var(--fs-46); font-weight: 700; font-family: var(--root-font-mont); }
.how-hero-section .hero-content p { margin-top: 8px; font-weight: 300; color:var(--root-color-secondary); font-size: var(--fs-18); }
.how-hero-section .hero-content .img-group { position: relative; aspect-ratio: 176/178; width: 176px; margin:36px auto 0; }
.how-hero-section .hero-content .img-group img { position: absolute; inset: 0; }
.how-hero-section .hero-content p:last-child { max-width: 50%; margin: 16px auto 0; font-size: var(--fs-26); font-family: var(--font-mont); }
.how-hero-section .hero-image { position: absolute; inset: 0; pointer-events: none; }
.how-hero-section .hero-image > div { position: absolute; }
.how-hero-section .hero-image .img-3 { left:0; bottom:0; width: 24%; }
.how-hero-section .hero-image .img-4 { left:10%; top:10%; width: 14%; }
.how-hero-section .hero-image .img-5 { right:10%; top:13%; width: 14%; animation-delay: 1.4s; }
.how-hero-section .hero-image .img-6 { right:0; bottom:1%; width: 24%; }


.pricing-plans-section { padding-top: 86px; }
.pricing-plans-section h3 { font-size: var(--fs-32); font-weight: 700; color:var(--root-color-secondary); }
.pricing-plans-section .h3-wrap p { margin-top: 8px; line-height: 1.6; font-weight: 300; font-size: var(--fs-18); }

.pricing-plans-section .pricing-table { margin-top: 38px; }
.pricing-plans-section table { width: 100%; border-collapse: collapse; }

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

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

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

/* button tr */
.pricing-plans-section table tr:last-child td > div { margin-top:16px; background: white; border:none; }
.pricing-plans-section table tr:last-child td > div::after { display: none; }
.pricing-plans-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; }

/* font */
.pricing-plans-section table th { font-weight: 700; font-size: var(--fs-22); }
.pricing-plans-section table th small { font-size: var(--fs-16); font-weight: 400; }
.pricing-plans-section table td { font-size: var(--fs-17); }
.pricing-plans-section table td b { color:var(--root-color-secondary); font-weight: 700; }

.open-tool-tip { z-index: 1; position: relative; display: inline-block; cursor: pointer; margin-left: 8px; }
.open-tool-tip img { position: relative; z-index: 1; }
.tool-tip-box { visibility: hidden; width: 330px; background-color: white; border-radius: 8px; padding: 16px 20px; position: absolute; top: -13px; left: 50%; opacity: 0; transition: opacity 0.3s; transform: translate(-50%,-100%); border:1px solid black; box-shadow: 3px 3px 10px rgba(0,0,0,0.2); font-size: var(--fs-16); cursor: default; text-align: left; font-weight: 400; }
.tool-tip-box::before { content: ''; z-index: -1; width: 100%; height: 30px; position: absolute; bottom:-30px; left:0; }
.open-tool-tip:hover .tool-tip-box { visibility: visible; opacity: 1; }


.cta-section { padding: 100px 0; }
.cta-section .cta-box { position: relative; height: 320px; padding: 20px; background: url('/images/sub/get_started/1__cta.jpg') no-repeat center/cover; background-attachment: fixed; border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.cta-section .cta-box h3 { margin-bottom: 28px; font-size: var(--fs-26); font-weight: 700; color: #fff; line-height: 1.4; }
.cta-section .cta-box .btn { max-width:90%; width: 648px; }

.how-it-wrap > li {padding:clamp(50px, 10vw, 100px) 0px; position: relative; display: flex; justify-content: space-between; gap:clamp(20px, 4vw, 60px);}
.how-it-wrap > li:nth-child(odd)::before {content: ""; width: 100vw; height: 100%; background: #F8F9FA; position: absolute; left: 50%; top: 0px; transform: translateX(-50%); z-index: -1;}
.how-it-wrap > li:nth-child(even) .video {order:2;}
.how-it-wrap > li > div {width: 50%;}
.how-it-wrap .video {max-width:570px;}
.how-it-wrap .video video {width:100%}
.how-it-wrap .info {max-width:571px;}
.how-it-wrap .info h3 {font-size: var(--fs-30);}
.how-it-wrap .txt_a {line-height: 1.6; font-weight:700; font-size: var(--fs-20); margin-top:1em}
.how-it-wrap .txt_b {line-height: 1.6; font-weight: 300; font-size: var(--fs-16); margin-top:1em }
.how-it-wrap .ico {margin-top:1em; text-align: right;}
.how-it-wrap .ico img {display: inline-block;}






@media screen and (max-width: 1023px) {

	.how-hero-section .hero-image .img-4 { top:auto; bottom:50%; }
	.how-hero-section .hero-image .img-5 { top:auto; bottom:45%; }
}
@media screen and (max-width: 767px) {
	.how-hero-section .hero-image .img-4 { top:auto; bottom:38%; }
	.how-hero-section .hero-image .img-5 { top:auto; bottom:34%; }
	.pricing-plans-section .pricing-table { overflow-x: auto; }
	.pricing-plans-section table { min-width: 650px; }

	.cta-section { padding: 80px 0; }
	.cta-section .cta-box { height: 350px; }
	.cta-section .cta-box h3 { margin-bottom: 20px; }

	.how-it-wrap > li {flex-direction: column;}
	.how-it-wrap > li > div {width:100%; max-width:none !important;}
	.how-it-wrap > li:nth-child(even) .video {order:0}
	.how-it-wrap .ico img {max-width:39vw;}
}