html {
    overflow-y: auto;
}

header {
    display: none;
}

footer {
    display: none;
}

/* Font */
@font-face {
    font-family: 'Inter-SemiBold';
    src: url('../fonts/Inter-SemiBold.ttf');
    font-weight: 600;
}

@font-face {
    font-family: 'Inter-Regular';
    src: url('../fonts/Inter-Regular.ttf');
    font-weight: 400;
}

@font-face {
    font-family: 'Inter-Bold';
    src: url('../fonts/Inter-Bold.ttf');
    font-weight: 700;
}

@media (min-width: 1400px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1140px !important;
    }
}

@media (min-width: 992px) {
    .navbar-expand-lg .offcanvas {
        position: static;
        z-index: auto;
        flex-grow: 1;
        width: auto !important;
        height: auto !important;
        visibility: visible !important;
        background-color: transparent !important;
        border: 0 !important;
        transform: none !important;
        transition: none;
    }

    .navbar-expand-lg .offcanvas .offcanvas-header {
        display: none;
    }

    .navbar-expand-lg .offcanvas .offcanvas-body {
        display: flex;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
    }
}

.text-bg-dark {
    color: #fff !important;
    background-color: RGBA(33, 37, 41, var(--bs-bg-opacity, 1)) !important;
}

.logo-header a,
.navbar-nav .nav-link {
    padding-top: 24px;
    padding-bottom: 24px;
    color: var(--color-text-default, #161616);
    font-variant-numeric: lining-nums tabular-nums;

    /* Body/Emphasized */
    font-family: 'Inter-SemiBold', sans-serif;
    font-size: var(--Font-Size-size-md, 16px);
    font-style: normal;
    font-weight: 600;
    line-height: var(--Font-Line---Height-lineheight-md, 24px);
    /* 150% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    text-decoration: none;
}

.navbar-expand-lg .navbar-nav .nav-link,
.logo-header a {
    padding-right: 24px !important;
    padding-left: 24px !important;
}

.navbar-toggler {
    padding: 16px;
}

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 8h22M5 16h22M5 24h22'/%3E%3C/svg%3E");
}

.return-homepage {
    display: none;
}

.navbar-nav {
    justify-content: flex-end;
}

.banner-pc {
    display: block;
}

.banner-mobile {
    display: none;
}

.introduce {
    background: linear-gradient(180deg, #FFF 0%, #ede0f5 100%);
}

.section-title {
    padding-top: 50px;
    color: #000;
    text-align: center;
    font-variant-numeric: lining-nums tabular-nums;
    font-family: 'Inter-Bold', sans-serif;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
}

.quick-installation .section-title span {
    color: #C151E1;
}

.abbank-application {
    color: var(--color-text-default, #161616);
    text-align: center;
    font-variant-numeric: lining-nums tabular-nums;

    /* Title 3/Regular */
    font-family: 'Inter-Regular', sans-serif;
    font-size: var(--Font-Size-size-xl, 18px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line---Height-lineheight-xl, 28px);
    /* 140% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    margin-bottom: 40px;
}

#pills-tab {
    justify-content: center;
}

#myTab {
    display: none;
}

.nav-pills .nav-item {
    padding: 8px;
    background: var(--color-background-default, #FFF);
}

.nav-pills .nav-item:first-child {
    border-top-left-radius: 16px;
    border-bottom-left-radius: 16px;
    border-top: 1px solid var(--color-border-default, #DCDCDC);
    border-bottom: 1px solid var(--color-border-default, #DCDCDC);
    border-left: 1px solid var(--color-border-default, #DCDCDC);
}

.nav-pills .nav-item:last-child {
    border-top-right-radius: 16px;
    border-bottom-right-radius: 16px;
    border-top: 1px solid var(--color-border-default, #DCDCDC);
    border-bottom: 1px solid var(--color-border-default, #DCDCDC);
    border-right: 1px solid var(--color-border-default, #DCDCDC);
}

.nav-pills .nav-item:not(:first-child):not(:last-child) {
    border-top: 1px solid var(--color-border-default, #DCDCDC);
    border-bottom: 1px solid var(--color-border-default, #DCDCDC);
}

.nav-pills .nav-link {
    width: 250px;
    padding: 14px 0;
    color: var(--color-text-default, #161616);
    text-align: center;
    font-variant-numeric: lining-nums tabular-nums;

    /* Headline/Emphasized */
    font-family: 'Inter-SemiBold', sans-serif;
    font-size: var(--Font-Size-size-lg, 18px);
    font-style: normal;
    font-weight: 600;
    line-height: var(--Font-Line---Height-lineheight-lg, 26px);
    /* 144.444% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
}

.nav-pills .nav-link.active {
    background-color: var(--color-background-brand-bold-default, #C151E1) !important;
    border-radius: var(--Radius-border-radius-sm, 12px);
    text-align: center;
    font-variant-numeric: lining-nums tabular-nums;

    /* Headline/Emphasized */
    font-family: 'Inter-SemiBold', sans-serif;
    font-size: var(--Font-Size-size-lg, 18px);
    font-style: normal;
    font-weight: 600;
    line-height: var(--Font-Line---Height-lineheight-lg, 26px);
    /* 144.444% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
}

.fido {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 40px;
}

.fido-title {
    color: #000;
    font-variant-numeric: lining-nums tabular-nums;

    /* Title 2/Emphasized */
    font-family: 'Inter-Bold', sans-serif;
    font-size: var(--Font-Size-size-xl-2, 20px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--Font-Line---Height-lineheight-xl-2, 36px);
    /* 150% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xs, -0.8px);
    margin-bottom: 0;
}

.fido-desc {
    color: var(--color-text-subtle, #585858);
    font-variant-numeric: lining-nums tabular-nums;

    /* Body/Regular */
    font-family: 'Inter-Regular', sans-serif;
    font-size: var(--Font-Size-size-md, 14px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line---Height-lineheight-md, 24px);
    /* 150% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    margin: 0;
}

.fido ul {
    list-style: none;
    padding: 0;
    display: flex;
    gap: 24px;
    flex-direction: column;
    margin-bottom: 0;
}

.fido ul li {
    display: flex;
    gap: 16px;
    align-items: center;
    color: var(--color-text-default, #161616);
    font-variant-numeric: lining-nums tabular-nums;

    /* Body/Emphasized */
    font-family: 'Inter-SemiBold', sans-serif;
    font-size: var(--Font-Size-size-md, 16px);
    font-style: normal;
    font-weight: 600;
    line-height: var(--Font-Line---Height-lineheight-md, 24px);
    /* 150% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
}

.financial-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--Spacing-spacer-lg, 24px);
    flex: 1 0 0;
}

.spending,
.reminder,
.personalized-recommendations {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--Spacing-spacer-md, 16px);
    align-self: stretch;
}

.spending-title,
.reminder-title,
.personalized-recommendations-title {
    color: #000;
    text-align: center;
    font-variant-numeric: lining-nums tabular-nums;

    /* Title 2/Emphasized */
    font-family: 'Inter-Bold', sans-serif;
    font-size: var(--Font-Size-size-xl-2, 24px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--Font-Line---Height-lineheight-xl-2, 36px);
    /* 150% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xs, -0.8px);
    margin-bottom: 0;
}

.spending-small,
.reminder-small,
.personalized-recommendations-small {
    color: var(--color-text-subtle, #585858);
    text-align: center;
    font-variant-numeric: lining-nums tabular-nums;

    /* Body/Regular */
    font-family: 'Inter-Regular', sans-serif;
    font-size: var(--Font-Size-size-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line---Height-lineheight-md, 24px);
    /* 150% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    margin-bottom: 0;
}

#pills-financial {
    padding-top: 80px;
    padding-bottom: 159px;
}

#pills-security {
    padding-top: 38px;
}

#pills-utilities {
    padding-top: 102px;
    padding-bottom: 162px;
}

.guide-btn {
    border-radius: var(--Radius-border-radius-sm, 12px);
    background: var(--color-background-brand-bold-default, #C151E1);
    display: flex;
    width: 282px;
    padding: var(--Spacing-spacer-sm, 12px) 0px;
    justify-content: center;
    align-items: center;
    gap: var(--Spacing-spacer-xs, 8px);
    text-decoration: none;
}

.guide-btn span {
    color: var(--color-text-inverse, #FFF);
    font-variant-numeric: lining-nums tabular-nums;

    /* Body/Emphasized */
    font-family: 'Inter-SemiBold', sans-serif;
    font-size: var(--Font-Size-size-md, 16px);
    font-style: normal;
    font-weight: 590;
    line-height: var(--Font-Line---Height-lineheight-md, 24px);
    /* 150% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
}
/* zzz */
.personal-promotion {
    background: linear-gradient(180deg, #ede0f5 0%, #FFF 100%);
}

.faq {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--Spacing-spacer-xl-2, 24px);
}

.faq-title {
    color: var(--color-text-default, #161616);
    font-variant-numeric: lining-nums tabular-nums;
    font-family: 'Inter-Bold', sans-serif;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    margin-bottom: 0;
}

.accordion-button:focus {
    box-shadow: none !important;
}

.accordion-button:not(.collapsed) {
    color: #161616 !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

.accordion-item {
    border: none !important;
    border-bottom: 1px solid var(--color-border-default, #DCDCDC) !important;
    padding: var(--Spacing-spacer-lg, 18px) var(--padding-xl, 24px) var(--Spacing-spacer-lg, 18px) var(--Spacing-spacer-none, 0px);
}

.accordion-button::after {
    width: 24px !important;
    height: 24px !important;
}

.accordion-button {
    padding: 0 !important;
    gap: var(--padding-md, 16px);
    color: var(--color-text-default, #161616);
    font-variant-numeric: lining-nums tabular-nums;

    /* Headline/Emphasized */
    font-family: 'Inter-SemiBold', sans-serif;
    font-size: var(--Font-Size-size-lg, 18px);
    font-style: normal;
    font-weight: 600;
    line-height: var(--Font-Line---Height-lineheight-lg, 26px);
    /* 144.444% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
}

.accordion-body {
    padding: 0 !important;
    width: 700px;
    margin-top: 16px;
    color: var(--color-text-subtle, #585858);
    font-variant-numeric: lining-nums tabular-nums;

    /* Body/Regular */
    font-family: 'Inter-Regular', sans-serif;
    font-size: var(--Font-Size-size-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line---Height-lineheight-md, 24px);
    /* 150% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}

#faq {
    padding-bottom: 60px;
}
/* zzz */
.contact-now {
    background: linear-gradient(97deg, #ede0f5 0%, #FFFCF2 100%);
}

.experience-now {
    display: flex;
    align-items: center;
    gap: var(--Spacing-spacer-xl, 32px);
    align-self: stretch;
    margin-bottom: 56px;
}

.download-block {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: var(--Spacing-spacer-lg, 24px);
}

.download-block h4 {
    color: var(--color-text-default, #161616);
    font-variant-numeric: lining-nums tabular-nums;

    /* Title 2/Emphasized */
    font-family: 'Inter-Bold', sans-serif;
    font-size: var(--Font-Size-size-xl-2, 24px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--Font-Line---Height-lineheight-xl-2, 36px);
    /* 150% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xs, -0.8px);
    margin-bottom: 0;
}

.operating-system {
    display: flex;
    align-items: center;
    gap: 12px;
}

.operating-system-mobile {
    display: none;
}

.contact-block {
    display: flex;
    align-items: center;
    gap: 57px;
}

.hotline,
.branch,
.connect {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: var(--Spacing-spacer-xs, 8px);
}

.social-media {
    display: flex;
    align-items: center;
    gap: var(--Spacing-spacer-md, 16px);
}

.hotline h5,
.branch h5,
.connect h5 {
    color: var(--color-text-default, #161616);
    font-variant-numeric: lining-nums tabular-nums;

    /* Title 3/Emphasized */
    font-family: 'Inter-SemiBold', sans-serif;
    font-size: var(--Font-Size-size-xl, 20px);
    font-style: normal;
    font-weight: 600;
    line-height: var(--Font-Line---Height-lineheight-xl, 28px);
    /* 140% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    margin-bottom: 0;
}

.hotline p {
    margin-bottom: 0;
    color: var(--color-text-default, #161616);
    font-variant-numeric: lining-nums tabular-nums;

    /* Body/Regular */
    font-family: 'Inter-Regular', sans-serif;
    font-size: var(--Font-Size-size-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line---Height-lineheight-md, 24px);
    /* 150% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
}

.branch a {
    color: var(--color-text-information, #2F6BFF);
    font-variant-numeric: lining-nums tabular-nums;

    /* Body/Regular */
    font-family: 'Inter-Regular', sans-serif;
    font-size: var(--Font-Size-size-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line---Height-lineheight-md, 24px);
    /* 150% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    text-decoration: none;
}

.footer {
    display: flex;
    padding: 32px 86px;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
    background: var(--color-background-brand-bold-default, #C151E1);
}

.copyright {
    display: flex;
    align-items: center;
    gap: 20px;
}

.copyright p {
    color: #FFF;
    text-align: center;
    font-variant-numeric: lining-nums tabular-nums;

    /* Subheadline/Regular */
    font-family: 'Inter-Regular', sans-serif;
    font-size: var(--Font-Size-size-sm, 14px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line---Height-lineheight-sm, 20px);
    /* 142.857% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    margin-bottom: 0;
}

.footer ul {
    display: flex;
    align-items: center;
    gap: 8px;
    list-style: none;
    padding: 0;
    margin-bottom: 0;
}

.footer ul li,
.footer ul li a {
    color: #FFF;
    text-align: right;
    font-variant-numeric: lining-nums tabular-nums;

    /* Subheadline/Regular */
    font-family: 'Inter-Regular', sans-serif;
    font-size: var(--Font-Size-size-sm, 14px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line---Height-lineheight-sm, 20px);
    /* 142.857% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    text-decoration: none;
}

.personal-promotion h5 {
    color: var(--color-text-default, #161616);
    text-align: center;
    font-variant-numeric: lining-nums tabular-nums;

    /* Title 3/Regular */
    font-family: 'Inter-Regular', sans-serif;
    font-size: var(--Font-Size-size-xl, 20px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line---Height-lineheight-xl, 28px);
    /* 140% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    margin-bottom: 60px;
}

.download-btn {
    display: none;
}

.financial-swiper, .utilities-swiper, .installation-steps-swiper, .promotion-swiper {
    overflow: hidden;
}

.utilities-item {
    display: flex;
    /*height: 384px;*/
    padding: 24px 8px 0 8px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: var(--Spacing-spacer-xl, 32px);
    flex-shrink: 0;
    border-radius: var(--Radius-border-radius-sm, 12px);
    background: var(--color-background-default, #FFF);
}

.financial-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--Spacing-spacer-lg, 24px);
    flex: 1 0 0;
}

.financial-item h4, .utilities-content h4 {
    color: #000;
    text-align: center;
    font-variant-numeric: lining-nums tabular-nums;

    /* Title 2/Emphasized */
    font-family: 'Inter-Bold', sans-serif;
    font-size: var(--Font-Size-size-xl-2, 20px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--Font-Line---Height-lineheight-xl-2, 36px); /* 150% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xs, -0.8px);
    margin-bottom: 0;
}

.financial-item p, .utilities-content p {
    color: var(--color-text-subtle, #585858);
    text-align: center;
    font-variant-numeric: lining-nums tabular-nums;

    /* Body/Regular */
    font-family: 'Inter-Regular', sans-serif;
    font-size: var(--Font-Size-size-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line---Height-lineheight-md, 24px); /* 150% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    margin-bottom: 0;
}

.financial-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--Spacing-spacer-md, 16px);
    align-self: stretch;
}

.financial-swiper-pagination, .utilities-swiper-pagination, .installation-steps-swiper-pagination, .promotion-swiper-pagination {
    display: none;
}

.promotion-swiper {
    margin-bottom: 60px;
}

.promotion-swiper .swiper-slide {
    height: auto;
}

.utilities-content {
    display: flex;
    height: 92px;
    padding: 0px var(--Spacing-spacer-md, 16px);
    flex-direction: column;
    align-items: center;
    gap: var(--Spacing-spacer-xs, 8px);
    flex-shrink: 0;
    align-self: stretch;
}

.installation-instructions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--Spacing-spacer-xl-4, 50px);
    padding-bottom: 100px;
}

.quick-installation {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--Spacing-spacer-xl-2, 16px);
}

.steps-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--Spacing-spacer-xl, 32px);
    flex: 1 0 0;
}

.steps-item img {
    width: 65%;
    /*width: 230px;*/
    /*height: 470px;*/
}

.steps-content {
    display: flex;
    padding: 0px var(--Spacing-spacer-md, 16px);
    flex-direction: column;
    align-items: center;
    gap: var(--Spacing-spacer-md, 16px);
    align-self: stretch;
    flex: 1 0 0;
}

.steps-content h4 {
    color: #000;
    text-align: center;
    font-variant-numeric: lining-nums tabular-nums;

    /* Title 3/Emphasized */
    font-family: 'Inter-SemiBold', sans-serif;
    font-size: var(--Font-Size-size-xl, 20px);
    font-style: normal;
    font-weight: 600;
    line-height: var(--Font-Line---Height-lineheight-xl, 28px); /* 140% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    margin-bottom: 0;
}

.steps-content h4 span {
    font-size: var(--Font-Size-size-xl, 32px);
}

.steps-content p {
    color: var(--color-text-subtle, #585858);
    text-align: center;
    font-variant-numeric: lining-nums tabular-nums;

    /* Body/Regular */
    font-family: 'Inter-Regular', sans-serif;
    font-size: var(--Font-Size-size-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line---Height-lineheight-md, 24px); /* 150% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    margin-bottom: 0;
}

.note-1 {
    display: flex;
    padding: var(--Spacing-spacer-md, 16px);
    justify-content: center;
    align-items: center;
    gap: 10px;
    align-self: stretch;
    border-radius: var(--Radius-border-radius-sm, 12px);
    background: var(--color-background-view, #F2F2F2);
}

.note-1 h5 {
    color: #000;
    text-align: center;
    font-variant-numeric: lining-nums tabular-nums;

    /* Title 3/Emphasized */
    font-family: 'Inter-SemiBold', sans-serif;
    font-size: var(--Font-Size-size-xl, 18px);
    font-style: normal;
    font-weight: 600;
    line-height: var(--Font-Line---Height-lineheight-xl, 28px); /* 140% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    margin-bottom: 0;
}

.note-2 {
    display: flex;
    padding: 0px var(--Spacing-spacer-md, 16px);
    flex-direction: column;
    align-items: center;
    gap: var(--Spacing-spacer-md, 16px);
    align-self: stretch;
}

.note-2 h5 {
    color: #000;
    text-align: center;
    font-variant-numeric: lining-nums tabular-nums;

    /* Title 3/Emphasized */
    font-family: 'Inter-SemiBold', sans-serif;
    font-size: var(--Font-Size-size-xl, 20px);
    font-style: normal;
    font-weight: 600;
    line-height: var(--Font-Line---Height-lineheight-xl, 28px); /* 140% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    margin-bottom: 0;
}

.note-2 p {
    color: var(--color-text-subtle, #585858);
    text-align: center;
    font-variant-numeric: lining-nums tabular-nums;

    /* Body/Regular */
    font-family: 'Inter-Regular', sans-serif;
    font-size: var(--Font-Size-size-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line---Height-lineheight-md, 24px); /* 150% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    margin-bottom: 0;
}

.note-2 p a {
    color: var(--color-text-information, #2F6BFF);
    font-variant-numeric: lining-nums tabular-nums;

    /* Body/Emphasized */
    font-family: 'Inter-SemiBold', sans-serif;
    font-size: var(--Font-Size-size-md, 16px);
    font-style: normal;
    font-weight: 600;
    line-height: var(--Font-Line---Height-lineheight-md, 24px);
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    text-decoration: none;
}

.promotion-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
}

.promotion-item img {
    width: 100%;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    border: 1px solid var(--color-border-default, #DCDCDC);
    border-bottom: none;
}

.promotion-content {
    display: flex;
    padding: var(--Spacing-spacer-lg, 24px);
    flex-direction: column;
    gap: var(--Spacing-spacer-xs, 8px);
    flex-shrink: 0;
    align-self: stretch;
    border: 1px solid var(--color-border-default, #DCDCDC);
    border-top: none;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
    flex-grow: 1;
}

.promotion-content p {
    color: var(--color-text-subtle, #585858);
    font-variant-numeric: lining-nums tabular-nums;
    font-family: 'Inter-SemiBold', sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 590;
    line-height: 20px; /* 142.857% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    text-transform: uppercase;
    margin-bottom: 0;
}

.promotion-content h5 {
    color: var(--color-text-default, #161616);
    font-variant-numeric: lining-nums tabular-nums;

    /* Title 3/Emphasized */
    font-family: 'Inter-SemiBold', sans-serif;
    font-size: var(--Font-Size-size-xl, 20px);
    font-style: normal;
    font-weight: 600;
    line-height: var(--Font-Line---Height-lineheight-xl, 28px); /* 140% */
    letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    margin-bottom: 0;
    text-align: start;
}

.quick-link {
    display: none;
}

.slider-width {
    width: 1140px;
}

@media (max-width: 768px) {
    .logo-header a {
        display: none;
    }

    header .container {
        padding: 0;
        box-shadow: var(--Shadow-Blur-blur-none, 0px) var(--Shadow-Offset-offset-xxs, 2px) var(--Shadow-Blur-blur-md, 12px) var(--Shadow-Spread-spread-none, 0px) var(--color-neutral-black-10, rgba(0, 0, 0, 0.10));
    }

    .navbar {
        padding: 0;
    }

    .offcanvas-end {
        border-left: none;
    }

    .offcanvas-body {
        padding: 0 16px;
        display: flex;
        flex-direction: column;
    }

    .nav-link {
        padding: 16px 0;
    }

    .return-homepage {
        display: block;
        text-align: center;
        padding: 8px 0;
        color: var(--color-text-default, #161616);
        font-variant-numeric: lining-nums tabular-nums;
        font-family: 'Inter-SemiBold', sans-serif;
        font-size: var(--Font-Size-size-md, 16px);
        font-style: normal;
        font-weight: 600;
        line-height: var(--Font-Line---Height-lineheight-md, 24px);
        letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
        text-decoration: none;
    }

    .navbar-toggler:focus {
        box-shadow: none !important;
    }

    .navbar-nav .nav-link {
        border-bottom: 1px solid var(--color-border-default, #DCDCDC);
    }

    .navbar-expand-lg .navbar-nav .nav-link {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .navbar-nav .nav-link {
        padding-top: 16px;
        padding-bottom: 16px;
    }

    .navbar-nav {
        justify-content: flex-start;
    }

    .banner-pc {
        display: none;
    }

    .banner-mobile {
        display: block;
    }

    #myTab {
        display: flex;
        flex-wrap: nowrap;
        border-bottom: 1px solid var(--color-border-default, #DCDCDC);
    }

    #pills-tab {
        display: none;
    }

    #pills-security .col-md-7 img {
        display: none;
    }

    #myTab .nav-link {
        padding: 16px;
    }

    .section-title {
        padding-top: 60px;
        font-size: var(--Font-Size-size-xl-2, 24px);
        line-height: var(--Font-Line---Height-lineheight-xl-2, 36px);
        /* 150% */
        letter-spacing: var(--Font-Letter-Spacing-letterspacing-xs, -0.8px);
    }

    .nav-tabs .nav-link.active {
        background-color: transparent !important;
        border-color: transparent !important;
        border-bottom: var(--Boder-boder-lg, 4px) solid var(--color-border-brand, #C151E1) !important;
        color: #C151E1 !important;
    }

    .introduce .container {
        padding: 0;
    }

    .introduce .section-title,
    .abbank-application,
    .fido {
        padding-left: 16px;
        padding-right: 16px;
    }

    .introduce .section-title {
        font-size: var(--Font-Size-size-xl-2, 20px);
    }

    .abbank-application {
        font-size: var(--Font-Size-size-md, 16px);
        line-height: var(--Font-Line---Height-lineheight-md, 24px);
        /* 150% */
        margin-bottom: 32px;
    }

    .abbank-application br {
        display: none;
    }

    .nav-tabs .nav-link {
        color: var(--color-text-default, #161616);
        text-align: center;
        font-variant-numeric: lining-nums tabular-nums;

        /* Body/Emphasized */
        font-family: 'Inter-SemiBold', sans-serif;
        font-size: var(--Font-Size-size-md, 16px);
        font-style: normal;
        font-weight: 600;
        line-height: var(--Font-Line---Height-lineheight-md, 24px);
        /* 150% */
        letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    }

    #pills-security {
        padding-bottom: 32px;
    }

    .fido-title {
        font-weight: 600;
        line-height: var(--Font-Line---Height-lineheight-xl, 28px);
        /* 140% */
        letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
        text-align: center;
    }

    .fido-desc {
        text-align: center;
        line-height: var(--Font-Line---Height-lineheight-sm, 20px);
        /* 142.857% */
    }

    .fido ul li {
        font-size: var(--Font-Size-size-sm, 14px);
        line-height: var(--Font-Line---Height-lineheight-sm, 20px);
        /* 142.857% */
        padding: 0px var(--Spacing-spacer-md, 16px);
    }

    .personal-promotion h5 {
        font-size: var(--Font-Size-size-md, 14px);
        line-height: var(--Font-Line---Height-lineheight-md, 24px);
        /* 150% */
    }

    .faq-title {
        font-size: var(--Font-Size-size-xl-2, 24px);
        line-height: var(--Font-Line---Height-lineheight-xl-2, 36px);
        /* 150% */
        letter-spacing: var(--Font-Letter-Spacing-letterspacing-xs, -0.8px);
    }

    .accordion-item {
        padding: var(--Spacing-spacer-md, 16px) var(--Spacing-spacer-none, 0px);

    }

    #faq img {
        display: none;
    }

    .accordion-button {
        font-size: var(--Font-Size-size-md, 16px);
        line-height: var(--Font-Line---Height-lineheight-md, 24px);
        /* 150% */
    }

    .accordion-body {
        width: 300px;
        margin-top: 8px;
        font-size: var(--Font-Size-size-sm, 14px);
        line-height: var(--Font-Line---Height-lineheight-sm, 20px);
        /* 142.857% */
    }

    #faq {
        padding-bottom: 60px;
    }

    .contact-now .col-md-4 img {
        display: none;
    }

    .experience-now > img {
        display: none;
    }

    .contact-now .container {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .download-block {
        gap: var(--Spacing-spacer-xl, 32px);
        align-items: center;
    }

    .download-btn {
        border-radius: var(--Radius-border-radius-sm, 12px);
        background: var(--color-background-brand-bold-default, #C151E1);
        display: flex;
        padding: var(--Spacing-spacer-sm, 12px) 0px;
        justify-content: center;
        align-items: center;
        gap: var(--Spacing-spacer-xs, 8px);
        align-self: stretch;
        text-decoration: none;
    }

    .download-btn span {
        color: var(--color-text-inverse, #FFF);
        font-variant-numeric: lining-nums tabular-nums;

        /* Body/Emphasized */
        font-family: 'Inter-SemiBold', sans-serif;
        font-size: var(--Font-Size-size-md, 16px);
        font-style: normal;
        font-weight: 590;
        line-height: var(--Font-Line---Height-lineheight-md, 24px); /* 150% */
        letter-spacing: var(--Font-Letter-Spacing-letterspacing-xxs, -0.4px);
    }

    .download-block h4 {
        text-align: center;
    }

    .operating-system-mobile {
        display: flex;
        align-items: center;
        gap: 12px;
    }

    .operating-system {
        display: none;
    }

    .contact-block {
        flex-direction: column;
        gap: 40px;
    }

    .hotline, .branch, .connect {
        align-items: center;
    }

    .hotline h5, .branch h5, .connect h5 {
        font-size: var(--Font-Size-size-lg, 18px);
        line-height: var(--Font-Line---Height-lineheight-lg, 26px); /* 144.444% */
    }

    .footer {
        display: flex;
        width: 375px;
        padding: 32px var(--Spacing-spacer-md, 16px);
        flex-direction: column;
        gap: 24px;
    }

    .copyright {
        flex-direction: column;
    }

    #pills-financial {
        padding-top: 32px;
        padding-bottom: 42px;
    }

    .financial-item {
        gap: var(--Spacing-spacer-xl, 32px);
    }

    .financial-content {
        gap: var(--Spacing-spacer-xs, 8px);
    }

    .financial-swiper-pagination, .utilities-swiper-pagination {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: var(--Spacing-spacer-xs, 8px);
        margin-top: 24px;
    }

    .utilities-swiper-pagination {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: var(--Spacing-spacer-xs, 8px);
        margin-top: 40px;
    }

    .swiper-pagination-bullet-active {
        border-radius: var(--Radius-border-radius-round, 48px);
        background: var(--color-icon-brand, #C151E1);
        width: 16px;
        height: 8px;
    }

    .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
        margin: 0 !important;
    }

    .utilities-swiper .swiper-slide {
        padding: 0 16px;
    }

    #pills-utilities {
        padding-top: 28px;
        padding-bottom: 13px;
    }

    .steps-item img {
        width: 80%;
        /*width: 184px;*/
        /*height: 376px;*/
    }

    .steps-content {
        padding: 0;
    }

    .quick-installation {
        gap: 8px;
    }

    .installation-instructions {
        gap: 40px;
        padding-right: 16px !important;
        padding-left: 16px !important;
        padding-bottom: 60px;
    }

    .note-1 h5 {
        font-size: var(--Font-Size-size-sm, 14px);
        line-height: var(--Font-Line---Height-lineheight-sm, 20px); /* 142.857% */
    }

    .note-2 p {
        font-size: var(--Font-Size-size-sm, 14px);
        font-weight: 400;
        line-height: var(--Font-Line---Height-lineheight-sm, 20px); /* 142.857% */
    }

    .note-2 p a {
        font-size: var(--Font-Size-size-sm, 14px);
        line-height: var(--Font-Line---Height-lineheight-sm, 20px);
    }

    .steps-content p {
        font-size: 14px;
        line-height: var(--Font-Line---Height-lineheight-sm, 20px); /* 142.857% */
    }

    .promotion-swiper {
        margin-bottom: 40px;
    }

    .slider-width {
        width: 100%;
    }

    .promotion-content {
        padding: 18px;
    }

    .promotion-content p {
        font-size: 12px;
    }
}