@charset 'utf-8';

img {
    width: 100%;
}

body {
    color: #4a4a4a;
}

.w-80 {
    width: 80%;
}

.fs-lg {
    font-size: 3.5em;
}

.color-functions {
    color: #0074E4;
}

.color-price {
    /* color: #1b72e1; */
    color: #0074e4;
}

.color-goal {
    color: #fb4141;
}

.btn-download {
    background-color: #0074e4 !important;
    border-color: #0074e4 !important;
    color: #fff;
    font-weight: bold;
}

.btn-download:hover {
    background-color: #0056b3 !important;
    border-color: #0056b3 !important;
    color: #fff;
}

header {
    border-bottom: 1px solid #ddd;
}

.main-visual {
    background-image: url("https://bcart.jp/uploads/lp/bcart-creditcard-kessai/main_visual_bg.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 500px;
}

.border-steps-zeus {
    border: 4px solid #fb4141;
    border-radius: 20px;
}
.border-steps-bcart {
    border: 4px solid #0074E4;
    border-radius: 20px;
}

.card-step {
    background-color: #e8f4fe;
    border-radius: 20px;
}

.card-step-goal {
    background-color: #fff7f7;
}

.card-title {
    height: 32px;
}

.notice {
    padding-bottom: 80px;
}

.notice:after {
    box-sizing: border-box;
    margin-left: -101px;
    border-top: 40px solid #0074E4;
    border-right: 101px solid transparent;
    border-bottom: 46px solid transparent;
    border-left: 101px solid transparent;
    display: block;
    position: absolute;
    bottom: -40px;
    left: 50%;
    width: 202px;
    height: 92px;
    content: '';
}

.card-price {
    background-color: #fff;
    border-radius: 20px;
}


@media screen and (max-width: 767px) {
    body {
        font-size: .8em;
    }

    .card-use-scene-right {
        border-left: 0;
        border-top: 6px solid #ddd;
    }

    .card-use-scene-right.ok {
        border-left: 0;
        border-top: 6px solid rgb(29, 32, 136);
    }
}

@media screen and (max-width: 991px) {
    .main-visual {
        background-position: left -100px;
    }

    /* .fs-lg {
        font-size: 1em;
    } */
}

@media screen and (min-width: 992px) {
    .text-responsive {
        font-size: .75em;
    }

    .fs-sm {
        font-size: 80%;
    }

    .fs-lg {
        font-size: 180%;
    }
}
.gtm-noscript {
    display: none;
    visibility: hidden;
    width: 0;
    height: 0;
}

.main-visual__lead {
    color: #1d2088;
}

.main-visual__brand {
    width: 60%;
}

.section-band-primary {
    background-color: #0074e4;
}

.section-band-light {
    background-color: #ebf2ff;
}

.framed-image {
    display: block;
    padding: .5em;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: .3em;
    margin-right: auto;
    margin-left: auto;
    vertical-align: middle;
}

.framed-image--wide {
    width: 80%;
}

.site-footer {
    background-color: #e5e6e9;
}
.faq-section {
    background-color: #fbf9fb;
    padding: 72px 0 64px;
}

.section-heading {
    margin-bottom: 48px;
    color: #222;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
}

.section-heading--accent::after {
    display: block;
    width: 56px;
    height: 4px;
    margin: 18px auto 0;
    background-color: #0074e4;
    border-radius: 999px;
    content: '';
}

.faq-accordion {
    max-width: 1280px;
    margin: 0 auto;
}

.faq-item {
    overflow: hidden;
    background-color: #fff;
    border: 1px solid #e4e6ee;
    border-radius: 10px !important;
    box-shadow: none;
}

.faq-item + .faq-item {
    margin-top: 10px;
}

.faq-button {
    min-height: 74px;
    padding: 20px 72px 20px 28px;
    color: #111827;
    background-color: #fff;
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.45;
    box-shadow: none;
}

.faq-button:not(.collapsed) {
    color: #001d9a;
    background-color: #f6f5f9;
    box-shadow: none;
}

.faq-button:focus {
    border-color: transparent;
    box-shadow: none;
}

.faq-button::after {
    width: 18px;
    height: 18px;
    margin-right: 4px;
    background-image: none;
    border-right: 2px solid #111827;
    border-bottom: 2px solid #111827;
    transform: rotate(45deg);
}

.faq-button:not(.collapsed)::after {
    border-color: #0068ff;
    transform: rotate(225deg);
}

.faq-answer {
    padding: 22px 28px 28px;
    color: #4a4a4a;
    background-color: #fff;
    border-top: 1px solid #f1f1f4;
    font-size: 1.08rem;
    line-height: 1.9;
}

@media screen and (max-width: 767px) {
    .faq-section {
        padding: 48px 0;
    }

    .section-heading {
        margin-bottom: 32px;
        font-size: 1.7rem;
    }

    .faq-button {
        min-height: 64px;
        padding: 16px 54px 16px 18px;
        font-size: 1rem;
    }

    .faq-answer {
        padding: 18px;
        font-size: .95rem;
    }
}

