@charset "UTF-8";
/*======================
ご利用の流れ */
/*==========================
stepリスト
==========================*/
.step_list01 {
    counter-reset: step_number 0;
}
.step_list01 > li {
    text-align: start;
    position: relative;
}
.step_list01 > li + li {
    -webkit-margin-before: 32px;
    margin-block-start: 32px;
}
.step_list01 > li:not(:last-of-type)::after {
    content: "";
    display: inline-block;
    inline-size: 0;
    block-size: 0;
    border-style: solid;
    border-width: 16px 14px 0 14px;
    border-color: rgba(var(--bg_color02), 1) transparent transparent transparent;
    position: absolute;
    inset: auto auto -24px 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}
.step_list01 > li .step_ti {
    display: flex;
    background: rgba(var(--subcolor01), 1);
    color: rgba(var(--light_tx_color), 1);
}
.step_list01 > li .step_ti .ti {
    font-size: 1.2em;
    padding: 0.5em 1em;
}
.step_list01 > li .step_ti::before {
    counter-increment: step_number 1;
    content: "Step.0"counter(step_number);
    font-family: "Cinzel", serif;
    font-weight: 500;
    background: rgba(var(--subcolor02), 1);
    display: flex;
    justify-content: center;
    align-items: center;
    inline-size: max(8%, 6em);
    padding-inline: 0.5em;
    font-size: 1.1em;
}
.step_list01 .step_tx {
    background: rgba(var(--bg_white), 1);
    border: 2px solid rgba(var(--subcolor01), 1);
    -webkit-border-before: none;
    border-block-start: none;
    padding-inline: clamp(16px, 2.3426061493vw, 32px);
    padding-block: clamp(16px, 1.756954612vw, 24px);
}
.step_list01.merit > li + li {
    -webkit-margin-before: 24px;
    margin-block-start: 24px;
}
.step_list01.merit > li .step_ti {
    background: rgba(var(--maincolor), 1);
}
.step_list01.merit > li .step_ti::before {
    content: "Merit.0"counter(step_number);
}
.step_list01.merit > li:not(:last-of-type)::after {
    display: none;
}
.step_list01.merit > li .step_tx {
    border: 2px solid rgba(var(--maincolor), 1);
    -webkit-border-before: none;
    border-block-start: none;
}




.kome {
  font-size: 1.2rem;
  color: rgba(var(--error_color), 1);
  vertical-align: text-top;
}