@charset "UTF-8";
@media screen and (min-width: 768px) {
    .flow .l_box_shadow {
        padding: var(--size-70) 0 var(--size-100);
    }
}
.flow .l_stepListBox {
    padding-left: 394px;
    margin-top: 59px;
}
@media screen and (max-width: 767px) {
    .flow .l_stepListBox {
        padding-left: 5.8212560386vw;
        padding-right: 4.5893719807vw;
    }
}
.l_box_shadow .l_stepListBox .l_headline {
    text-align: left;
}
.flow .icon_pickup {
    margin-right: 42px;
    position: relative;
}
@media screen and (max-width: 767px) {
    .flow .icon_pickup {
        margin-right: var(--size-25);
        font-size: 6.2801932367vw;
    }
}
.flow .icon_pickup:after {
    display: block;
    content: "";
    width: 4px;
    height: 130px;
    background: #007270;
    transform: translate(50%, 50%);
    left: 47%;
    position: absolute;
    bottom: -39px;
}
@media screen and (max-width: 767px) {
    .flow .icon_pickup:after {
        width: 0.9661835749vw;
        left: 45.5%;
        bottom: -21.7391304348vw;
        height: 43.4782608696vw;
    }
}
.flow .icon_pickup._num05:after {
    display: none;
}
.flow .c_item {
    display: flex;
    align-items: center;
}
@media screen and (max-width: 767px) {
    .flow .c_item {
        align-items: flex-start;
    }
}
.flow .l_stepListBox .c_item {
    margin-top: 59px;
}
@media screen and (max-width: 767px) {
    .flow .l_stepListBox .c_item {
        margin-top: 12.077294686vw !important;
        height: 33.8164251208vw;
    }
}
.flow .l_textArea {
    text-align: left;
}
@media screen and (max-width: 767px) {
    .flow .l_textArea {
        width: 60.1449275362vw;
        margin-top: var(--size-10);
    }
    .flow .l_textArea._type02 {
        margin-top: -1.690821256vw;
    }
}
.flow .l_textArea .c_headline {
    position: relative;
    top: 6px;
}
@media screen and (max-width: 767px) {
    .flow .l_textArea .c_headline {
        font-size: 5.7971014493vw;
        line-height: 1.5;
        top: 0;
    }
}
.flow .l_textArea .c_text {
    line-height: 1.875;
    margin-top: 0.4830917874vw;
    font-weight: 400;
}
.flow .l_stepListBox + .c_note {
    text-align: left;
    color: #434343;
    padding-left: 133.5px;
    margin-top: 72.5px;
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 1.9444444444;
    position: relative;
    letter-spacing: 0.025em;
    font-weight: 500;
}
@media screen and (max-width: 767px) {
    .flow .l_stepListBox + .c_note {
        padding-left: 4.5893719807vw;
        padding-right: 4.5893719807vw;
        font-size: 4.347826087vw;
        line-height: 1.9444444444;
        margin-top: -0.9661835749vw;
    }
}
.flow .l_stepListBox + .c_note:after {
    display: block;
    content: "";
    background: url("../img/top/illustration_flow_man.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width: 243px;
    height: 249px;
    position: absolute;
    bottom: var(--size-5);
    right: 142px;
}
@media screen and (max-width: 767px) {
    .flow .c_note:after {
        display: none !important;
    }
}
.flow .l_btn {
    display: flex;
    justify-content: center;
    gap: var(--size-40);
    text-align: center;
    margin-top: 84px;
}
@media screen and (max-width: 767px) {
    .flow .l_btn {
        margin-top: var(--size-65);
        flex-direction: column;
    }
}
.flow .l_btn .c_primary_btn {
    padding: 24px 48px;
}
.flow .c_btn_slogan {
    margin-top: 84px;
}
.flow .c_btn_slogan + .l_btn {
    margin-top: 10px;
}
@media screen and (max-width: 767px) {
    .flow .c_btn_slogan {
        margin-top: var(--size-65);
    }
}
.system-requirements {
    text-align: center;
}
.system-requirements .c_note {
    margin-top: 28px;
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 1.6666666667;
}
@media screen and (max-width: 767px) {
    .system-requirements .c_note {
        margin-top: var(--size-45);
    }
}
.l_sys_req_box {
    margin: 70px auto 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--size-55);
    width: 100%;
    max-width: 1055px;
}
@media screen and (max-width: 767px) {
    .l_sys_req_box {
        width: 100%;
        display: block;
    }
}
.l_sys_req_box .c_name {
    font-size: 24px;
    font-size: 2.4rem;
    font-weight: 700;
}
@media screen and (max-width: 767px) {
    .l_sys_req_box .c_name {
        font-size: 5.7971014493vw;
    }
}
.l_sys_req_box .c_tool {
    margin-top: 25.2px;
    background: #E4E4E4;
    font-size: 20px;
    font-size: 2rem;
    line-height: 1.5;
    display: flex;
    align-items: center;
    height: 85.17px;
    justify-content: center;
    font-weight: 500;
}
@media screen and (max-width: 767px) {
    .l_sys_req_box .c_tool {
        font-size: 4.8309178744vw;
        height: 20.5314009662vw;
    }
}
.l_sys_req_box .c_tool span {
    display: block;
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 1.5;
    line-height: 0.6;
    margin-top: 10px;
    font-weight: 400;
}
@media screen and (max-width: 767px) {
    .l_sys_req_box .c_box + .c_box {
        margin-top: var(--size-45);
    }
}
.l_sys_req_box .c_app_list .c_item {
    text-align: left;
    padding-left: var(--size-145);
    border-bottom: 1px solid #434343;
    padding-bottom: 19px;
    padding-top: 23px;
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: 400;
}
@media screen and (max-width: 767px) {
    .l_sys_req_box .c_app_list .c_item {
        padding-left: 15.8937198068vw;
        padding-bottom: 4.5893719807vw;
        padding-top: 5.5555555556vw;
    }
}
.l_sys_req_box .c_app_list .c_item._type02 {
    padding-left: 172.5px;
}
@media screen and (max-width: 767px) {
    .l_sys_req_box .c_app_list .c_item._type02 {
        padding-left: 22.6570048309vw;
    }
}
.l_sys_req_box .c_app_list .c_item._recommend {
    position: relative;
}
.l_sys_req_box .c_app_list .c_item._recommend:after {
    content: "★推奨";
    color: #FFF;
    line-height: 0.6;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 12px;
    font-size: 1.2rem;
    background: #DE7150;
    border-radius: var(--size-5);
    padding: 3px 5px 5px 6px;
    height: 25px;
    position: absolute;
    transform: translate(-50%, -50%);
    top: 50%;
    right: 111px;
}
@media screen and (max-width: 767px) {
    .l_sys_req_box .c_app_list .c_item._recommend:after {
        right: 7.4879227053vw;
        font-size: 2.8985507246vw;
        height: 6.038647343vw;
    }
}
.system-requirements .l_headline {
    margin-top: 84px;
}
@media screen and (max-width: 767px) {
    .system-requirements .l_headline {
        margin-top: var(--size-65);
    }
}