/*******
 * PC
 *******/
.cost {
    padding: 0 3rem;
    text-align: center;
}

.cost__table {
    width: 100%;
    margin: 2rem auto 0;
    text-align: center;
}

.cost__table_head {
    width: 30%;
    padding: 0.25rem 0;
    background-color: var(--main-color);
    text-align: center;
    color: #fff;
    font-size: var(--font-10);
    vertical-align: middle;
}

.cost__table_content {
    padding: 0.5rem 0;
    vertical-align: middle;
}

.cost__table_content--catch {
    padding: 1.5rem 0;
}

.cost__table_content--catch strong {
    font-size: var(--font-20) !important;
}

.cost__table_content strong {
    color: var(--main-color);
    font-size: var(--font-14);
}

.cost__table_head--monthly {
    width: 70%;
    background-color: #222;
}

.cost__table_content--monthly {
    font-size: var(--font-14);
}

.cost__table_content--monthly.cost__table_content--catch {
    font-size: var(--font-24);
}

.cost__table_content--monthly span {
    background: linear-gradient(180deg, #fff 0%, #fff 70%, #FDE799 70%, #FDE799 100%);
}

.cost__table_content--monthly strong {
    font-size: var(--font-18);
}

.cost__table_content--monthly.cost__table_content--catch strong {
    color: var(--main-color);
    font-size: var(--font-28) !important;
}

.cost__table_info {
    margin-top: 0.5rem;
    text-align: right;
    font-size: var(--font-08);
}

/*******
 * Tablet・SP
 *******/
@media screen and (max-width: 955px) {
}

/*******
 * SP
 *******/
@media (max-width: 639px) {
    .cost {
        padding: 2rem 0.6rem;
    }

    .cost__table_info {
        font-size: var(--font-10);
    }
}


/*--------------------------------------
/*
 * cost_comparison
 *
 *---------------------------------------/
/*******
 * PC
 *******/
.cost_comparison {
    margin-top: 5rem;
    padding: 3.5rem 10rem 4rem;
    background-color: var(--second-very-light-color);
}

.cost_comparison__head {
    padding: 1.5rem 0;
    text-align: center;
}

.cost_comparison__title_sub span {
    position: relative;
    font-size: var(--font-13);
    letter-spacing: 1px;
    color: var(--main-color);
}

.cost_comparison__title {
    margin-bottom: 1rem;
}

.cost_comparison__title_img {
    max-width: 5rem;
    margin: 0 auto;
}

.cost_comparison__title_sub span:before,
.cost_comparison__title_sub span:after {
    position: absolute;
    content: "";
    border: 1px solid;
    top: 0;
    bottom: 0;
}

.cost_comparison__title_sub span:before {
    left: -1rem;
    transform: rotate(-25deg);
}

.cost_comparison__title_sub span:after {
    right: -1rem;
    transform: rotate(25deg);
}

.cost_comparison__title_main {
    display: inline-block;
    border-bottom: 4px dotted var(--main-color);
    font-size: var(--font-23);
    color: #222;
}

.cost_comparison__lead {
    font-size: var(--font-11);
}

.cost_comparison__lead strong {
    background: linear-gradient(180deg, #fff 0%, #fff 50%, #FDE799 50%, #FDE799 100%);
    font-size: var(--font-16);
    color: var(--main-color);
}

.cost_comparison__body {
    margin-top: 2rem;
}

.cost_comparison__body_table {
    position: relative;
    width: 100%;
}

.cost_comparison__body_table:before {
    position: absolute;
    top: -2.5rem;
    left: 30.5%;
    content: "";
    background-image: url("../images/common/tristars.svg");
    background-repeat: no-repeat;
    transform: translateX(-50%);
    width: 5rem;
    height: 2rem;
}

.cost_comparison__body_table th,
.cost_comparison__body_table td {
    width: 20%;
    padding: 0.25rem 0;
    text-align: center;
    vertical-align: middle;
}

.cost_comparison__body_table td {
    border: 1px solid #999;
    font-size: var(--font-09);
}

.cost_comparison__company {
    background-color: #222;
    font-size: var(--font-08);
    color: #fff;
}

.cost_comparison__company--own {
    background-color: var(--main-color);
    border-top: 5px solid var(--main-color);
    border-right: 5px solid var(--main-color);
    border-left: 5px solid var(--main-color);
    border-bottom: 5px solid var(--main-color);
}

.cost_comparison__subject {
    background-color: #fff;
}

.cost_comparison__object {
    background: #EFEFEF;
}

.cost_comparison__object strong {
    font-size: var(--font-18);
}

.cost_comparison__object--own {
    background-color: #FDF5F3;
    border-left: 5px solid var(--main-color) !important;
    border-right: 5px solid var(--main-color) !important;
    font-size: var(--font-10) !important;
}

.cost_comparison__object--own span {
    color: var(--main-color);
}

.cost_comparison__object--own span strong {
    font-size: var(--font-24);
}

.cost_comparison__object--mark {
    font-size: var(--font-24) !important;
}

.bb {
    border-bottom: 5px solid var(--main-color) !important;
}

/*******
 * Tablet
 *******/
@media screen and (min-width: 640px) and (max-width: 1079px) {

}

/*******
 * SP
 *******/
@media (max-width: 639px) {
    .cost_comparison {
        margin-top: 0;
        padding: 2rem 0.6rem 5rem;
    }

    .cost_comparison__lead {
        font-size: var(--font-12);
        text-align: left;
    }

    .cost_comparison__body_table td {
        font-size: var(--font-13);
    }

    .cost_comparison__company {
        font-size: var(--font-10);
    }

    .cost_comparison__body_table:before {
        left: 30%;
        top: -1.5rem;
        width: 3rem;
    }
}


/*--------------------------------------
/*
 * cost_down
 *
 *---------------------------------------/
/*******
 * PC
 *******/
.cost_down {
    padding: 5rem 8rem;
    background-color: #EEEEEE;
    text-align: center;
}

.cost_down__list {
    row-gap: 2rem;
    margin-top: 3rem;
}

.cost_down__list li {
    background-color: #fff;
    padding: 1.5rem 0;
    margin-bottom: 1rem;
}

.cost_down__list li:last-child {
    margin-bottom: 0;
}

.cost_down__content {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 70%;
    margin: 0 auto;
}

.cost_down__content_number span {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3rem;
    height: 3rem;
    margin-right: 0.5rem;
    background-color: var(--main-color);
    border-radius: 50%;
    color: #fff;
    font-size: var(--font-22);
}

.cost_down__content_text {
    font-size: var(--font-09);
    text-align: left;
}

.cost_down__content_text span {
    color: var(--main-color);
    font-family: 'Jun 501', sans-serif;
}

/*******
 * Tablet・SP
 *******/
@media screen and (max-width: 955px) {
}

/*******
 * SP
 *******/
@media (max-width: 639px) {
    .cost_down {
        padding: 2rem 0.6rem;
    }

    .cost_down__list {
        margin-top: 2rem;
    }

    .cost_down__content {
        max-width: 80%;
    }

    .cost_down__content_text {
        font-size: var(--font-11);
    }
}