@charset "utf-8";

@media (min-width: 769px) {
    .btn_back_wrap {
        margin-top: 160rem;
    }
}
@media (max-width: 768px) {
    .btn_back_wrap {
        margin-top: 120rem;
    }
}

/* business_field_index */
.business_field_index {
    color: var(--color-red);
    font-weight: 700;
}
.business_field_list {
    justify-content: space-between;
}
.business_field_list > li {
    position: relative;
}
.business_field_list > li > a {
    position: relative;
    display: block;
}
.link_circle_label_area {
    --link-circle-color: var(--color-red);
}
.link_circle_label {
    font-weight: 700;
}
.business_field_list > li:nth-child(1) .link_circle::before,
.business_field_list > li:nth-child(9) .link_circle::before {
    background: url(../img/common/gradation_1.svg) no-repeat 50% 50% / contain;
}
.business_field_list > li:nth-child(2) .link_circle::before,
.business_field_list > li:nth-child(10) .link_circle::before {
    background: url(../img/common/gradation_3.svg) no-repeat 50% 50% / contain;
}
.business_field_list > li:nth-child(3) .link_circle::before {
    background: url(../img/common/gradation_5.svg) no-repeat 50% 50% / contain;
}
.business_field_list > li:nth-child(4) .link_circle::before {
    background: url(../img/common/gradation_7.svg) no-repeat 50% 50% / contain;
}
.business_field_list > li:nth-child(5) .link_circle::before {
    background: url(../img/common/gradation_2.svg) no-repeat 50% 50% / contain;
}
.business_field_list > li:nth-child(6) .link_circle::before {
    background: url(../img/common/gradation_4.svg) no-repeat 50% 50% / contain;
}
.business_field_list > li:nth-child(7) .link_circle::before {
    background: url(../img/common/gradation_6.svg) no-repeat 50% 50% / contain;
}
.business_field_list > li:nth-child(8) .link_circle::before {
    background: url(../img/common/gradation_8.svg) no-repeat 50% 50% / contain;
}
.business_field_list > li:nth-child(1) .link_circle::after {
    background: url(../img/business_field/business_field_item_1.png) no-repeat center / contain;
}
.business_field_list > li:nth-child(2) .link_circle::after {
    background: url(../img/business_field/business_field_item_2.png) no-repeat center / contain;
}
.business_field_list > li:nth-child(3) .link_circle::after {
    background: url(../img/business_field/business_field_item_3.png) no-repeat center / contain;
}
.business_field_list > li:nth-child(4) .link_circle::after {
    background: url(../img/business_field/business_field_item_4.png) no-repeat center / contain;
}
.business_field_list > li:nth-child(5) .link_circle::after {
    background: url(../img/business_field/business_field_item_5.png) no-repeat center / contain;
}
.business_field_list > li:nth-child(6) .link_circle::after {
    background: url(../img/business_field/business_field_item_6.png) no-repeat center / contain;
}
.business_field_list > li:nth-child(7) .link_circle::after {
    background: url(../img/business_field/business_field_item_7.png) no-repeat center / contain;
}
.business_field_list > li:nth-child(8) .link_circle::after {
    background: url(../img/business_field/business_field_item_8.png) no-repeat center / contain;
}
.business_field_list > li:nth-child(9) .link_circle::after {
    background: url(../img/business_field/business_field_item_9.png) no-repeat center / contain;
}
.business_field_list > li:nth-child(10) .link_circle::after {
    background: url(../img/business_field/business_field_item_10.png) no-repeat center / contain;
}
@media (min-width: 769px) {
    .business_field_index {
        margin-top: 174rem;
    }
    .business_field_index_txt {
        font-size: 21px;
        line-height: 1.8;
    }
    .business_field_index_txt_cap {
        font-size: 13px;
        line-height: 1.8;
        margin-top: 10rem;
    }
    .business_field_list {
        margin-top: 60rem;
        gap: 40rem 20rem;
    }
    .business_field_list > li {
        width: 208rem;
    }
    .business_field_list > li > a {
        padding-bottom: 24rem;
    }
    .link_circle_label_area {
        bottom: 0;
    }
    .link_circle_label {
        font-size: 16rem;
        padding: 0rem 16rem 0rem 11rem;
    }
    .link_circle::after {
        width: 123rem;
        height: 123rem;
    }
}
@media (max-width: 768px) {
    .business_field_index {
        margin-top: 23rem;
    }
    .business_field_index_txt {
        width: 105%;
        font-size: 21px;
        line-height: 1.8;
    }
    .business_field_index_txt_cap {
        font-size: 13px;
        line-height: 1.8;
        margin-top: 49rem;
    }
    .business_field_list {
        margin-top: 60rem;
        gap: 38rem 10rem;
    }
    .business_field_list > li {
        width: 162rem;
    }
    .business_field_list > li > a {
        padding-bottom: 24rem;
    }
    .link_circle_label_area {
        bottom: 0;
    }
    .link_circle_label {
        font-size: 14rem;
        padding: 0rem 12rem 0rem 6rem;
    }
    br + .link_circle_label {
        margin-top: -1rem;
    }
    .link_circle::after {
        width: 96rem;
        height: 96rem;
    }
}

/* business_field_box */
.business_field_box_ttl {
    background: var(--color-red);
    color: var(--color-white);
    font-weight: 700;
}
.business_field_box_txt {
    color: var(--color-red);
    font-weight: 700;
}
.business_field_box_detail_box_ttl {
    color: var(--color-red);
    font-weight: 700;
    border-bottom: 2px solid var(--color-red);
}
.business_field_box_detail_box_txt {
    font-weight: 700;
}
.business_field_box_detail_box_txt_small {
    display: block;
    font-weight: 700;
}
.business_field_box_detail_box_detail_ttl {
    color: var(--color-red);
    font-weight: 700;
}
.business_field_box_detail_box_3col {
    display: flex;
    align-items: center;
}
.business_field_box_detail_box_3col_cell {
    font-weight: 700;
}
.business_field_box_detail_box_detail_list_wrap {
    display: flex;
}
.business_field_box_detail_box_detail_list > li::before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    border-radius: 50%;
    background-color: var(--color-red);
}
.business_field_btn_wrap {
    display: flex;
    justify-content: end;
}
.business_field_btn_area {
    display: flex;
}
.business_field_btn {
    background: var(--color-white);
    color: var(--color-red);
    display: flex;
    align-items: center;
    position: relative;
}
.business_field_btn_arrow {
    position: absolute;
}
.business_field_btn_arrow_path {
    stroke: var(--color-red);
}
.business_field_btn_note {
    color: #000;
    font-weight: 500;
}
/* interview */
.interview_list {
    display: flex;
}
.interview_list > li {
    position: relative;
}
.interview_list > li a {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    overflow: hidden;
    position: relative;
}
.interview_list > li a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.interview_list > li:not(.interview_item_people) .interview_item_bottom_cover {
    display: none;
}
.interview_list > li[data-bg='0'] a::before,
.interview_list > li[data-bg='0'] .interview_item_bottom_cover::after {
    background: url(../img/common/gradation_1.svg) no-repeat center bottom / contain;
}
.interview_list > li[data-bg='1'] a::before,
.interview_list > li[data-bg='1'] .interview_item_bottom_cover::after {
    background: url(../img/common/gradation_2.svg) no-repeat center bottom / contain;
}
.interview_list > li[data-bg='2'] a::before,
.interview_list > li[data-bg='2'] .interview_item_bottom_cover::after {
    background: url(../img/common/gradation_3.svg) no-repeat center bottom / contain;
}
.interview_list > li[data-bg='3'] a::before,
.interview_list > li[data-bg='3'] .interview_item_bottom_cover::after {
    background: url(../img/common/gradation_4.svg) no-repeat center bottom / contain;
}
.interview_list > li[data-bg='4'] a::before,
.interview_list > li[data-bg='4'] .interview_item_bottom_cover::after {
    background: url(../img/common/gradation_5.svg) no-repeat center bottom / contain;
}
.interview_list > li[data-bg='5'] a::before,
.interview_list > li[data-bg='5'] .interview_item_bottom_cover::after {
    background: url(../img/common/gradation_6.svg) no-repeat center bottom / contain;
}
.interview_list > li[data-bg='6'] a::before,
.interview_list > li[data-bg='6'] .interview_item_bottom_cover::after {
    background: url(../img/common/gradation_7.svg) no-repeat center bottom / contain;
}
.interview_list > li[data-bg='7'] a::before,
.interview_list > li[data-bg='7'] .interview_item_bottom_cover::after {
    background: url(../img/common/gradation_8.svg) no-repeat center bottom / contain;
}
.interview_list > li[data-bg='8'] a::before,
.interview_list > li[data-bg='8'] .interview_item_bottom_cover::after {
    background: url(../img/common/gradation_9.svg) no-repeat center bottom / contain;
}

.interview_item_bottom_cover {
    content: '';
    position: absolute;
    z-index: 5;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    clip-path: polygon(0% 100%, 0% 30%, 100% 30%, 100% 100%);
}
.interview .section_btn_wrap {
    display: flex;
    justify-content: end;
}
.animation_loaded .anim_roll {
    animation: var(--roll-animation);
}
.interview_item_bottom_cover::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
}
.interview_list > li a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
}

.interview_list > li .interview_img_wrap {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    display: block;
    margin: auto;
}
.interview_list > li .interview_img_wrap:not(.interview_img_people) {
    overflow: hidden;
    border-radius: 50%;
    width: calc(222 / 365 * 100%);
    height: calc(222 / 365 * 100%);
}
.interview_list > li .interview_img_wrap:not(.interview_img_people) img {
    width: 100%;
    height: auto;
}

.interview_list > li > a {
    color: var(--color-red);
}
.interview_ttl {
    filter: drop-shadow(0px 2px 0px var(--color-red)) drop-shadow(2px 0px 0px var(--color-red))
        drop-shadow(-2px 0px 0px var(--color-red)) drop-shadow(0px -2px 0px var(--color-red));
    will-change: transform, filter;
    transform: translateZ(0);
    position: absolute;
    z-index: 7;
    pointer-events: none;
    color: var(--color-red);
}
.interview_ttl_top_wrap {
    display: inline-block;
    position: relative;
    z-index: 2;
}
.interview_ttl_top {
    background: #fff;
    display: block;
}
.interview_ttl_bottom_wrap {
    display: inline-block;
    position: relative;
    z-index: 3;
}
.interview_ttl_bottom {
    background: #fff;
    display: block;
}
.business_field_entry_btn_wrap {
    display: flex;
    justify-content: center;
}
.business_field_entry_btn {
    position: relative;
    color: #fff;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    font-weight: 700;
    border: 1px solid var(--color-red);
}
.business_field_entry_btn::before {
    content: '';
    background: url(../img/common/line_gradation.svg) no-repeat 50% 50% / cover;
    position: absolute;
    top: -1px;
    left: -1px;
    bottom: -1px;
    right: -1px;
}
.business_field_entry_btn_inner {
    position: relative;
    z-index: 1;
}
.business_field_box_detail_box_detail_cap_list > li {
    font-weight: 500;
}
.business_field_box_detail_box_detail_list sup {
    font-size: 0.8em;
}
.interview_list > li .link_circle_agri::before {
    background: var(--gradation-1);
}
.interview_list > li .link_circle_copper::before {
    background: var(--gradation-3);
}
.interview_list > li .link_circle_energy::before {
    background: var(--gradation-5);
}
.interview_list > li .link_circle_clean_beauty::before {
    background: var(--gradation-7);
}
.interview_list > li .link_circle_africa::before {
    background: var(--gradation-2);
}
.interview_list > li .link_circle_infra_fund::before {
    background: var(--gradation-4);
}
.interview_list > li .link_circle_philippines::before {
    background: var(--gradation-6);
}
.interview_list > li .link_circle_car::before {
    background: var(--gradation-8);
}
.interview_img_people {
    clip-path: polygon(60% 90%, 40% 90%, -50% 0%, 150% 0%);
}
@media (min-width: 769px) {
    .business_field_box {
        margin-top: 206rem;
    }
    .business_field_box_ttl {
        font-size: 32px;
        line-height: 1.77;
        padding: 6rem 14rem;
    }
    .business_field_box_txt {
        font-size: 21px;
        line-height: 1.8;
        margin-top: 30rem;
    }
    .business_field_box_detail_box {
        margin-top: 85rem;
    }
    .business_field_box_detail_box_ttl {
        font-size: 26px;
        line-height: 1.77;
        border-bottom: 2px solid var(--color-red);
        padding: 1rem 15rem;
    }
    .business_field_box_detail_box_txt {
        font-size: 32px;
        line-height: 1.8;
        margin-top: 10rem;
    }
    .business_field_box_detail_box_txt_small {
        font-size: 21px;
        line-height: 1.8;
        margin-top: 10rem;
    }
    .business_field_box_detail_box_detail_ttl {
        font-size: 21px;
        line-height: 1.77;
    }
    .business_field_box_detail_box_3col {
        margin-top: 30rem;
        gap: 70rem;
    }
    .business_field_box_detail_box_thumb_wrap {
        width: 348rem;
    }
    .business_field_box_detail_box_3col_cell {
        font-size: 16px;
        line-height: 1.8;
    }
    .business_field_box_detail_box_detail_list_wrap {
        gap: 40rem;
    }
    .business_field_box_detail_box_detail_list {
        min-width: 350rem;
    }
    .business_field_box_detail_box_detail_list > li {
        text-indent: -1.6em;
        padding-left: 1.6em;
    }
    .business_field_box_detail_box_detail_list > li::before {
        margin-top: -5px;
        width: 5px;
        height: 5px;
        margin-right: 20px;
    }
    .business_field_box_detail_box_detail_list_s {
        font-size: 14px;
        display: inline-block;
        padding-left: 0.4em;
        text-indent: 0;
    }
    .business_field_btn_area {
        margin: 30rem auto 0;
    }
    .business_field_btn {
        border: 2rem solid var(--color-red);
        font-size: 18rem;
        letter-spacing: 0.05em;
        line-height: 1.2;
    }
    .business_field_btn_arrow {
        top: 50%;
        right: 20rem;
        translate: 0 -50%;
    }
    .business_field_btn_note {
        padding-left: 1em;
        text-indent: -1em;
        font-size: 12rem;
        line-height: 1.8;
        margin-top: 10rem;
    }
    .business_field_btn_wrap {
        margin-top: 21rem;
    }
    .business_field_btn {
        width: 345rem;
        padding: 19rem 93rem 19rem 20rem;
    }
    .business_field_btn_arrow {
        width: 64rem;
    }

    /* interview */
    .interview_list {
        gap: 30rem;
        margin-top: 30rem;
    }
    .interview_list > li {
        min-width: 267rem;
        width: 267rem;
        height: 267rem;
    }
    .interview_ttl {
        bottom: 0;
        left: -1rem;
    }
    .interview_ttl_top_wrap {
        font-size: 12rem;
    }
    .interview_ttl_top {
        padding: 10rem 7rem;
    }
    .interview_ttl_bottom_wrap {
        margin-top: 8rem;
        font-size: 22rem;
    }
    .interview_ttl_bottom {
        padding: 5rem 5rem 5rem;
        margin-top: -15rem;
    }
    .business_field_entry_btn_wrap {
        margin-top: 132rem;
    }
    .business_field_entry_btn {
        width: 443rem;
        height: 72rem;
        border-radius: 10px;
        font-size: 36rem;
        line-height: 1.51;
        letter-spacing: calc(1.8 / 36 * 1em);
    }
    .business_field_entry_btn::before {
        border-radius: 9px;
    }
    @media (hover: hover) {
        .business_field_entry_btn {
            transition: color 0.4s;
        }
        .business_field_entry_btn::before {
            transition: opacity 0.4s;
        }
        .business_field_entry_btn:hover {
            color: var(--color-red);
        }
        .business_field_entry_btn:hover::before {
            opacity: 0;
        }
    }
    .business_field_box_detail_box_detail_cap_list_wrap {
        display: flex;
        justify-content: flex-end;
    }
    .business_field_box_detail_box_detail_cap_list {
        margin-top: 10rem;
    }
    .business_field_box_detail_box_detail_cap_list > li {
        font-size: 12px;
        font-weight: 500;
        line-height: 1.5;
    }
    @media (hover: hover) {
        .interview_list > li a::before,
        .interview_item_bottom_cover::after {
            transition: var(--roll-transition);
        }
        .interview_list > li a:hover::before,
        a:hover .interview_item_bottom_cover::after {
            rotate: 180deg;
        }
        a .interview_img,
        a .interview_img_people {
            transition: scale 0.4s;
        }
        a:hover .interview_img,
        a:hover .interview_img_people {
            scale: 1.1;
        }
    }
}
@media (max-width: 768px) {
    .business_field_box {
        margin-top: 190rem;
    }
    .business_field_box_wrap + .business_field_box_wrap .business_field_box {
        margin-top: 270rem;
    }
    .business_field_box_ttl {
        font-size: 32rem;
        line-height: 1.77;
        padding: 6rem 20rem;
    }
    .business_field_box_txt {
        font-size: 21rem;
        line-height: 1.8;
        margin-top: 20rem;
    }
    .business_field_box_detail_box {
        margin-top: 85rem;
    }
    .business_field_box_detail_box_ttl {
        font-size: 26rem;
        line-height: 1.77;
        border-bottom: 2px solid var(--color-red);
        padding: 1rem 15rem;
    }
    .business_field_box_detail_box_txt {
        font-size: 28rem;
        line-height: 1.8;
        margin-top: 30rem;
    }
    .business_field_box_detail_box_txt_small {
        font-size: 21rem;
        line-height: 1.8;
        margin-top: 48rem;
    }
    .business_field_box_detail_box_detail_ttl {
        font-size: 21rem;
        line-height: 1.77;
    }
    .business_field_box_detail_box_3col {
        margin-top: 30rem;
        gap: 24rem;
        flex-direction: column;
        align-items: start;
    }
    .business_field_box_detail_box_3col_cell {
        font-size: 16rem;
        line-height: 1.8;
    }
    .business_field_box_detail_box_detail_list_wrap {
        flex-direction: column;
        margin-left: 20rem;
    }
    .business_field_box_detail_box_detail_list > li {
        text-indent: -1.6em;
        padding-left: 1em;
    }
    .business_field_box_detail_box_detail_list > li::before {
        margin-top: -5rem;
        width: 5rem;
        height: 5rem;
        margin-right: 20rem;
    }
    .business_field_box_detail_box_detail_list_s {
        font-size: 14rem;
        display: inline-block;
        padding-left: 0.3em;
        text-indent: 0;
    }
    .business_field_btn_area {
        margin: 30rem auto 0;
    }
    .business_field_btn {
        border: 2rem solid var(--color-red);
        font-size: 18rem;
        letter-spacing: 0.05em;
        line-height: 1.2;
    }
    .business_field_btn_arrow {
        top: 50%;
        right: 20rem;
        translate: 0 -50%;
    }
    .business_field_btn_note {
        padding-left: 1em;
        text-indent: -1em;
        font-size: 12rem;
        line-height: 1.8;
        margin-top: 10rem;
    }
    .business_field_btn_wrap {
        margin-top: 33rem;
    }
    .business_field_btn {
        width: 100%;
        padding: 22rem 93rem 23rem 17rem;
    }
    .business_field_btn_arrow {
        width: 64rem;
    }

    /* interview */
    .interview_list {
        gap: 30rem;
        margin-top: 40rem;
        flex-direction: column;
    }
    .interview_list > li {
        min-width: 335rem;
        width: 335rem;
        height: 335rem;
    }
    .interview_ttl {
        bottom: 0;
        left: 1rem;
    }
    .interview_ttl_top_wrap {
        font-size: 12rem;
    }
    .interview_ttl_top {
        padding: 10rem 7rem;
    }
    .interview_ttl_bottom_wrap {
        margin-top: 8rem;
        font-size: 22rem;
    }
    .interview_ttl_bottom {
        padding: 5rem 5rem 5rem;
        margin-top: -15rem;
    }
    .business_field_entry_btn_wrap {
        margin-top: 60rem;
    }
    .business_field_entry_btn {
        width: 443rem;
        height: 72rem;
        border-radius: 10px;
        font-size: 36rem;
        line-height: 1.51;
        letter-spacing: calc(1.8 / 36 * 1em);
    }
    .business_field_entry_btn::before {
        border-radius: 10px;
    }

    .business_field_box_detail_box_detail_cap_list {
        margin-top: 10rem;
    }
    .business_field_box_detail_box_detail_cap_list > li {
        font-size: 12rem;
        line-height: 1.5;
        text-align: left;
        letter-spacing: -0.1em;
    }
}
