@charset "utf-8";

/* index */
.business_kv_inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.business_case_more {
    display: none;
    background-color: var(--color-black);
    color: var(--color-white);
    justify-content: center;
    align-items: center;
    width: 100%;
}
.business_case_more.is_show {
    display: flex;
}
.business_case_more_arrow {
    border-top: 1px solid var(--color-white);
    border-right: 1px solid var(--color-white);
    rotate: 135deg;
}
.business_case_listitem {
    border-bottom: solid #bfbfbf;
}
.business_case_link {
    display: flex;
}
.business_case_link_img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}
.business_case_link_info_wrap {
    line-height: 1.5;
}
.business_case_link_ttl {
    display: inline-block;
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}
.business_case_link_taglist {
    display: flex;
    flex-wrap: wrap;
}
.business_case_link_tag {
    border: solid #808080;
}
.business_case_link_tag_town {
    background-color: #ccc;
    border: none;
}
.business_case_link_tag_main {
    background-color: var(--color-black);
    color: var(--color-white);
    border-color: var(--color-black);
}
@media (min-width: 769px) {
    .subpage_ttl + .inner {
        padding-top: 0;
    }
    .business_kv {
        min-height: 480rem;
    }
    .business_kv_ttl {
        font-size: 48rem;
        line-height: calc(76 / 48);
    }
    .business_case_more {
        padding-block: 10rem;
        border: 1rem solid var(--color-black);
        column-gap: 14rem;
        margin-top: -1rem;
    }
    .business_case_more_arrow {
        width: 16rem;
        height: 16rem;
        translate: 0 -4rem;
    }
    .business_case_list {
        margin-top: -32rem;
    }
    .business_case_listitem {
        padding-top: 32rem;
        padding-bottom: 32rem;
        border-bottom-width: 1rem;
    }
    .business_case_link {
        column-gap: 32rem;
    }
    .business_case_link_img_wrap {
        width: 240rem;
    }
    .business_case_link_info_wrap {
        flex: 1;
    }
    .business_case_link_ttl {
        font-size: 24rem;
        line-height: calc(36 / 24);
        margin-top: -6rem;
    }
    .business_case_link_taglist {
        font-size: 12rem;
        line-height: 1;
        gap: 4rem;
        margin-top: 17rem;
    }
    .business_case_link_tag {
        padding: 4rem;
        border-width: 1rem;
    }
    .business_btn_wrap {
        margin-top: 100rem;
    }
    @media (hover: hover) {
        .business_case_link:hover .business_case_link_ttl {
            text-decoration: underline;
        }
        .business_case_more {
            transition:
                color 0.4s,
                background-color 0.4s;
        }
        .business_case_more_arrow {
            transition: border-color 0.4s;
        }
        .business_case_more:hover {
            cursor: pointer;
            background-color: var(--color-white);
            color: var(--color-black);
        }
        .business_case_more:hover .business_case_more_arrow {
            border-color: var(--color-black);
        }
    }
}
@media (max-width: 768px) {
    .business_kv {
        padding-bottom: 240rem;
        margin-top: -28rem;
    }
    .business_kv_inner {
        row-gap: 92rem;
        flex-direction: column;
    }
    .business_kv_ttl {
        font-size: 72rem;
        line-height: calc(104 / 72);
    }
    .business_case_more {
        padding-block: 19rem;
        border: 1rem solid var(--color-black);
        column-gap: 32rem;
        margin-top: -4rem;
        margin-inline: auto;
        width: 640rem;
    }
    .business_case_more_arrow {
        width: 32rem;
        height: 32rem;
        translate: 0 -8rem;
    }
    .business_case_list {
        margin-inline: 38rem;
        margin-top: -56rem;
    }
    .business_case_listitem {
        padding-top: 56rem;
        padding-bottom: 56rem;
        border-bottom-width: 4rem;
    }
    .business_case_link {
        flex-direction: column;
    }
    .business_case_link_info_wrap {
        margin-top: 11rem;
    }
    .business_case_link_ttl {
        font-size: 40rem;
        line-height: calc(56 / 40);
    }
    .business_case_link_taglist {
        font-size: 24rem;
        line-height: 1;
        gap: 8rem;
        margin-top: 17rem;
    }
    .business_case_link_tag {
        padding: 8rem;
        border-width: 2rem;
    }
    .business_btn_wrap {
        margin-top: 134rem;
    }
}

.animation_ready .business_kv_img {
    opacity: 0;
    translate: 0 20rem;
}
.animation_loaded .business_kv_img {
    opacity: 1;
    translate: 0 0rem;
    transition:
        opacity 0.8s,
        translate 0.8s;
}

.anim_slide_line {
    line-height: 1.8;
}
.anim_slide_line_inner {
    display: inline;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    color: var(--color-white);
    background: linear-gradient(to right, var(--color-black) 50%, transparent 50%);
    background-size: 200% 100%;
    background-repeat: no-repeat;
    padding: 2rem 8rem;
}
.animation_ready .anim_slide_line_inner {
    background-position: 100% 0;
    transition: background-position 0.5s;
}
.animation_loaded .anim_slide_line.is_animated .anim_slide_line_inner {
    background-position: 0% 0;
}

/* point_list */
.point_list {
    display: flex;
    flex-direction: column;
}
.point_ttl {
    display: flex;
    align-items: flex-start;
    line-height: 1;
}
.point_ttl_name {
    color: var(--theme-color);
}
.point_lead {
    display: inline-block;
}
.point_sub_wrap {
    border: 1px solid var(--theme-color);
}
.point_sub_ttl {
    background-color: var(--theme-color);
    color: var(--color-white);
}
.point_sub_list {
    display: grid;
}
.point_sub_mark {
    color: var(--theme-color);
}
@media (min-width: 769px) {
    .flex_item_lead {
        font-size: 24rem;
        line-height: calc(36 / 24);
    }
    .flex_item_txt + .point_list {
        border-top: 1px solid var(--color-gray);
        margin-top: 42rem;
        padding-top: 40rem;
    }
    .flex_item_lead + .flex_item_txt {
        margin-top: 12rem;
    }
    .flex_item_txt .txt_large {
        font-size: 18rem;
    }
    .point_list {
        row-gap: 40rem;
    }
    .point_ttl {
        column-gap: 12rem;
    }
    .point_ttl_num {
        font-size: 72rem;
    }
    .point_ttl_name {
        font-size: 48rem;
        line-height: calc(64 / 48);
    }
    .point_lead {
        font-size: 24rem;
        margin-top: 12rem;
    }
    .point_body {
        margin-top: 16rem;
        line-height: 1.66;
        margin-right: -2rem;
    }
    .point_body .fw700 {
        font-size: 18rem;
    }
    .point_sub_wrap {
        margin-top: 19rem;
    }
    .point_sub_ttl {
        padding: 0 8rem 3rem;
    }
    .point_sub_list_wrap {
        padding: 8rem 15rem 10rem;
    }
    .point_sub_list {
        grid-auto-flow: column;
        grid-auto-columns: 1fr;
        grid-template-rows: repeat(5, auto);
    }
    .point_sub_list_col4 {
        grid-template-rows: repeat(4, auto);
    }
}
@media (max-width: 768px) {
    .flex_item_lead {
        font-size: 40rem;
        line-height: calc(64 / 40);
    }
    .flex_item_txt + .point_list {
        border-top: 2px solid var(--color-gray);
        padding-top: 89rem;
        margin-top: 92rem;
    }
    .flex_item_lead + .flex_item_txt {
        margin-top: 31rem;
    }
    .flex_item_txt .txt_large {
        font-size: 36rem;
    }
    .point_list {
        row-gap: 90rem;
    }
    .point_ttl {
        flex-direction: column;
    }
    .point_ttl_num {
        font-size: 144rem;
    }
    .point_ttl_name {
        font-size: 96rem;
        line-height: calc(112 / 96);
        margin-top: -11rem;
    }
    .point_lead {
        font-size: 40rem;
        margin-top: 30rem;
    }
    .point_body {
        margin-top: 39rem;
        line-height: 1.66;
    }
    .point_body .fw700 {
        font-size: 36rem;
    }
    .point_sub_wrap {
        margin-top: 48rem;
    }
    .point_sub_ttl {
        padding: 0 14rem 6rem;
    }
    .point_sub_list_wrap {
        padding: 10rem 24rem 13rem;
    }
    .point_sub_listitem {
        padding-left: 1em;
        text-indent: -1em;
    }
}