body {
    background-color: #FFFFFF;
    position: relative;
    font-family: '游ゴシック', 'Meiryo', sans-serif;
    font-size: 16px;
    /*width: 100%;
    margin: 2% 5% 5% 2% */
    width: 96%;
    margin: 2%;
}

.c-hissu::before {
    content: "必須";
    font-size: 13px;
    font-weight: bold;
    color: #FFF;
    background-color: #ff0000;
    margin-right: 0.5em;
    padding: 1px 6px;
    opacity: 0.8;
    text-align: center;
}

.li-bold-font {
    font-weight: bolder;
}

.c-ninni::before {
    content: "任意";
    font-size: 13px;
    font-weight: bold;
    color: #FFF;
    background-color: #0076CE;
    margin-right: 0.5em;
    padding: 1px 6px;
    opacity: 0.8;
    text-align: center;
}

textarea:read-only {
}

input:read-only {
    background-color: #F2F2F2;
}

p.kome {
    position: relative;
    padding-left: 1em;
}

p.kome::before {
    content: "※";
    position: absolute;
    left: 0;
}

.caution-section {
    background-color: #FEDEE1;
}

.explain-section {
    background-color: #F2F2F2;
    border: 1px solid #A9A9A9;
}

.logo-button:disabled {
    background-color: #FFFFFF;
    color: #000000;
    border: 1px solid;
    border-radius: 10px;
    text-align: center;
    white-space: nowrap;
}

.logo-button {
    background-color: #FFFFFF;
    color: #000000;
    border: 1px solid;
    border-radius: 10px;
    text-align: center;
    white-space: nowrap;
}

.logo-bank{
    width: 15%;
    height: 15%;
}

.middle-item {
    position: relative;
    display: block;
    width: 100%;
    font-weight: bold;
    font-size: 18px;
    margin-bottom: 18px;
    /*border-bottom: solid 2px #ACACAC;*/
    padding: 5px 2px;
    background-color: #EEE2DE;
}

.middle-item-noneSolid {
    position: relative;
    display: block;
    width: 100%;
    font-weight: bold;
    font-size: 18px;
    margin-bottom: 18px;
    border-bottom: solid 2px #ACACAC;
    padding: 5px 2px;
}

.middle-item::before {
    content: "■";
    color: red;
}

.small-item {
    position: relative;
    display: block;
    width: 100%;
    font-weight: bold;
    font-size: 16px;
    margin-bottom: 8px;
    border-bottom: solid 2px #ACACAC;
    padding: 5px 2px;
}

.small-item::before {
    content: "◆";
    color: gray;
}

.tiny-item {
    position: relative;
    display: block;
    width: 20%;
    font-weight: bold;
    font-size: 16px;
    margin-bottom: 4px;
    border-bottom: solid 1px #ACACAC;
    padding: 2.5px 1px;
}

.tiny-item::before {
    content: "|";
    color: red;
    font-weight: bold;
}

@media screen and (max-width: 814px) {
    .tiny-item {
        width: 100%;
    }
}

.button-submit {
    background-color: darkblue;
    color: #FFFFFF;
    border: 1px solid;
    min-width: 50px;
    min-height: 30px;
    border-radius: 6px;
    text-align: center;
    white-space: nowrap;
    padding: 5px 15px;
}

.button-submit-gray {
    background-color: lightgray;
    color: #000000;
    border: 1px solid;
    min-width: 75px;
    min-height: 30px;
    border-radius: 6px;
    text-align: center;
    white-space: nowrap;
    padding: 5px 10px;
}

    .button-submit-gray a {
        color: #FFFFFF;
    }

.button-submit-gray:disabled {
    background-color: #F2F2F2;
    color: lightgray;
    border: 1px solid;
    min-width: 75px;
    min-height: 30px;
    border-radius: 6px;
    text-align: center;
    white-space: nowrap;
    padding: 5px 10px;
}

.button-submit-red {
    background-color: #E50012;
    color: #FFFFFF;
    border: 1px solid;
    min-width: 75px;
    min-height: 30px;
    border-radius: 6px;
    text-align: center;
    white-space: nowrap;
    padding: 5px 15px;
}

    .button-submit-red a {
        color: #FFFFFF;
    }

.button-submit-red:disabled {
    background-color: #EC4C59;
    color: #FFFFFF;
    border: 1px solid;
    min-width: 75px;
    min-height: 30px;
    border-radius: 6px;
    text-align: center;
    white-space: nowrap;
    padding: 5px 15px;
}

.button-upload {
    background-color: green;
    color: #FFFFFF;
    border: 1px solid;
    min-width: 50px;
    min-height: 30px;
    border-radius: 6px;
    text-align: center;
    white-space: nowrap;
    padding: 5px 15px;
    padding: 5px 10px;
}

.bar-pink {
    background-color: #FFE6EA;
}

.agreement-section-middle {
    display: block;
    border: solid 1px #DFDFDF;
    width: 100%;
    height: 50vh;
    margin: 0 auto;
    overflow: auto;
    resize: vertical;
    padding: 0 10px;
}

.agreement-section-small {
    display: block;
    border: solid 1px #DFDFDF;
    width: 100%;
    height: 25vh;
    margin: 0 auto;
    overflow: auto;
    resize: vertical;
    padding: 0 10px;
}

.agreement-checkbox {
    transform: scale(2);
    margin: 0 6px 0 0;
}

.confirm {
    border-spacing: 10px;
    border-collapse: collapse;
}

    .confirm td {
        padding: 0 10px;
    }

        .confirm td:first-child {
            font-weight: bold;
        }

        .confirm td:not(:last-child) {
            border-right: 1px solid #DFDFDF;
        }

        .confirm td:first-child, .confirm td:last-child {
            text-align: center;
            width: 200px;
        }

.confirmHeadTd {
    text-align: left !important;
}

.confirmHeadHrTd {
    padding: 0 !important;
    border: none !important;
}

    .confirmHeadHrTd:first-child hr {
        border: 2px solid #E50012;
    }

    .confirmHeadHrTd:not(:first-child) hr {
        border: 2px solid #DFDFDF;
    }

    .confirmHr {
        border: 1px solid #DFDFDF;
    }

.button-fix-item {
    background-color: #FFFFFF;
    color: #000000;
    border: 2px solid;
    min-width: 100px;
    min-height: 30px;
    border-radius: 6px;
    text-align: center;
    white-space: nowrap;
}

.button-fix-item::after {
    content: "→";
    color: #FFFFFF;
    font-weight: bold;
    margin-left: 5px;
    text-align: center;
    background: #000000;
    max-width: 100px;
    max-height: 100px;
    border-radius: 100px;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    padding: 1px;
}

.fileTbl {
    border-collapse: collapse;
}

/*.fileTbl tr:not(:last-child) {*/
.fileTbl tr:not(:nth-last-child(-n + 2)) {
    border-bottom: 1px solid #A9A9A9;
}

/*.fileTbl tr:not(:last-child) td:first-child {*/
.fileTbl tr:not(:nth-last-child(-n + 2)) td:first-child {
    border: 1px solid #A9A9A9;
    background-color: #F2F2F2;
    padding-right: 50px;
}

.roundedBtn {
    border-radius: 6px;
    border: 2px solid #A9A9A9;
    padding: 5px 10px;
    background-color: #F2F2F2;
}

.roundedBtn:hover {
    background-color: #EAEAEA;
}

.formal-data-tbl-td1 {
    background-color: #CFF8E6;
}

.formal-data-tbl-td2 {
    background-color: #D5F8CE;
}

.numberDate {
    line-height: 1.2rem;
    width: 40px;
}

.numberValue {
    line-height: 1.2rem;
    width: 60px;
}

.formalTbl td:last-child:not([colspan='3']) {
    border-bottom: 1px solid #DFDFDF;
}

.statusStepTitleDiv {
    padding: 10px 30px;
}

.statusTitleDiv {
    display: flex;
    align-items: center;
    gap: 36px;
    background-color: #EEE2DE;
    padding: 24px;
    border-radius: 5px;
    border: 3px solid #E50012;
}

.statusHouseTitleDiv {
    display: flex;
    align-items: center;
    gap: 36px;
    background-color: #EEE2DE;
    padding: 24px;
    border-radius: 8px;
}

.statusStep {
    display: block;
    text-align: left;
    font-size: 18px;;
    text-indent: 0.5em;
    font-weight: bold;
    color: #E50012;
}

    .statusStep span {
        font-size: 150%;
    }

.statusTitle {
    display: block;
    font-size: 22px;
    font-weight: bold;
    color: #E50012;
    text-align: center;
    margin: 0;
}

.stepDiv {
    position: relative;
    width: 100%;
    max-width: 92%;
    height: 80px;
    margin: 0 auto;
}

    .stepDiv:before {
        content: "";
        display: block;
        width: 100%;
        height: 3px;
        background-color: #F4F4F4;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
    }

    .stepDiv::after {
        content: "";
        display: block;
        width: 0;
        height: 3px;
        background-color: #E50012;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
    }

    .stepDiv.is-step1:after {
        width: calc( ( ( 100% - 20px ) / 5 ) * 0 );
    }

    .stepDiv.is-step2:after {
        width: calc( ( ( 100% - 20px ) / 5 ) * 1 );
    }

    .stepDiv.is-step3:after {
        width: calc( ( ( 100% - 20px ) / 5 ) * 2 );
    }

    .stepDiv.is-step4:after {
        width: calc( ( ( 100% - 20px ) / 5 ) * 3 );
    }

    .stepDiv.is-step5:after {
        width: calc( ( ( 100% - 20px ) / 5 ) * 4 );
    }

    .stepDiv.is-step6:after {
        width: calc( ( ( 100% - 20px ) / 5 ) * 5 );
    }

.stepDiv_point {
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #F4F4F4;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    white-space: nowrap;
}

    .stepDiv_point.this-step1 {
        left: calc( ( ( 100% - 20px ) / 5 ) * 0 );
    }

    .stepDiv_point.this-step2 {
        left: calc( ( ( 100% - 20px ) / 5 ) * 1 );
    }

    .stepDiv_point.this-step3 {
        left: calc( ( ( 100% - 20px ) / 5 ) * 2 );
    }

    .stepDiv_point.this-step4 {
        left: calc( ( ( 100% - 20px ) / 5 ) * 3 );
    }

    .stepDiv_point.this-step5 {
        left: calc( ( ( 100% - 20px ) / 5 ) * 4 );
    }

    .stepDiv_point.this-step6 {
        left: calc( ( ( 100% - 20px ) / 5 ) * 5 );
    }

.is-step1 .stepDiv_point:nth-of-type(1),
.is-step2 .stepDiv_point:nth-of-type(-n+2),
.is-step3 .stepDiv_point:nth-of-type(-n+3),
.is-step4 .stepDiv_point:nth-of-type(-n+4),
.is-step5 .stepDiv_point:nth-of-type(-n+5),
.is-step6 .stepDiv_point:nth-of-type(-n+6) {
    background-color: #E50012;
}

.is-step1 .stepDiv_point.this-step1:before,
.is-step2 .stepDiv_point.this-step2:before,
.is-step3 .stepDiv_point.this-step3:before,
.is-step4 .stepDiv_point.this-step4:before,
.is-step5 .stepDiv_point.this-step5:before,
.is-step6 .stepDiv_point.this-step6:before {
    display: block;
    content: "";
    width: 27px;
    height: 27px;
    position: absolute;
    top: -41px;
    left: -2px;
    background-color: #EEE2DE;
    transform: rotate(45deg);
    border-bottom-right-radius: 2px;
    border-right: 3px solid #E50012;
    border-bottom: 3px solid #E50012;
}

.is-step1 .stepDiv_point.this-step1,
.is-step2 .stepDiv_point.this-step2,
.is-step3 .stepDiv_point.this-step3,
.is-step4 .stepDiv_point.this-step4,
.is-step5 .stepDiv_point.this-step5,
.is-step6 .stepDiv_point.this-step6 {
    width: 30px;
    height: 30px;
}

.is-step1 .stepDiv_point.this-step1:after,
.is-step2 .stepDiv_point.this-step2:after,
.is-step3 .stepDiv_point.this-step3:after,
.is-step4 .stepDiv_point.this-step4:after,
.is-step5 .stepDiv_point.this-step5:after,
.is-step6 .stepDiv_point.this-step6:after {
    display: block;
    text-align: center;
    color: #fff;
    font-weight: bold;
    padding: 2px 0px 0 0;
}

.is-step1 .stepDiv_point.this-step1:after {
    content: "1";
}

.is-step2 .stepDiv_point.this-step2:after {
    content: "2";
}

.is-step3 .stepDiv_point.this-step3:after {
    content: "3";
}

.is-step4 .stepDiv_point.this-step4:after {
    content: "4";
}

.is-step5 .stepDiv_point.this-step5:after {
    content: "5";
}

.is-step6 .stepDiv_point.this-step6:after {
    content: "6";
}

.stepDescription {
    position: relative;
    width: 100%;
    max-width: 92%;
    height: 80px;
    margin: 0 auto;
}

.stepDesc_point {
    display: block;
    /*width: 20px;*/
    /*height: 20px;*/
    /*border-radius: 50%;*/
    /*background-color: #F4F4F4;*/
    position: absolute;
    /*top: 50%;*/
    /*transform: translateY(-50%);*/
    z-index: 2;
    white-space: nowrap;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    color: #636363;
}

    .stepDesc_point.this-step1 {
        left: calc( ( ( 100% - 20px ) / 5 ) * 0 );
    }

    .stepDesc_point.this-step2 {
        left: calc( ( ( 100% - 20px ) / 5 ) * 1 );
    }

    .stepDesc_point.this-step3 {
        left: calc( ( ( 100% - 20px ) / 5 ) * 2 - 0.7em );
    }

    .stepDesc_point.this-step4 {
        left: calc( ( ( 100% - 20px ) / 5 ) * 3 - 0.7em );
    }

    .stepDesc_point.this-step5 {
        left: calc( ( ( 100% - 20px ) / 5 ) * 4 - 0.7em );
    }

    .stepDesc_point.this-step6 {
        left: calc( ( ( 100% - 20px ) / 5 ) * 5 - 0.5em );
    }

.stepHouseDiv {
    position: relative;
    width: 100%;
    max-width: 75%;
    height: 80px;
    margin: 0 auto;
}

    .stepHouseDiv:before {
        content: "";
        display: block;
        width: 100%;
        height: 3px;
        background-color: #F4F4F4;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
    }

    .stepHouseDiv::after {
        content: "";
        display: block;
        width: 0;
        height: 3px;
        background-color: #E50012;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
    }

    .stepHouseDiv.is-stepHouse1:after {
        width: 0;
    }

    .stepHouseDiv.is-stepHouse2:after {
        width: calc( 100% - 20px );
    }

.stepHouseDiv_point {
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #F4F4F4;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
}

    .stepHouseDiv_point.this-stepHouse1 {
        left: 0;
    }

    .stepHouseDiv_point.this-stepHouse2 {
        left: calc( 100% - 20px );
    }

.is-stepHouse1 .stepHouseDiv_point:nth-of-type(1),
.is-stepHouse2 .stepHouseDiv_point:nth-of-type(-n+2) {
    background-color: #E50012;
}

.is-stepHouse1 .stepHouseDiv_point.this-stepHouse1:before,
.is-stepHouse2 .stepHouseDiv_point.this-stepHouse2:before {
    display: block;
    content: "";
    width: 30px;
    height: 30px;
    position: absolute;
    top: -45px;
    left: -5px;
    background-color: #EEE2DE;
    transform: rotate(45deg);
    border-bottom-right-radius: 2px;
}

.passwordTbl {
    width: 100%;
    border-collapse: collapse;
}

.passwordTbl tr:not(:last-child) {
    border-bottom: 1px solid #ACACAC;
}

.passwordTbl tr td {
    padding: 10px;
}

.passwordTbl tr td:first-child {
    width: 300px;
    padding-left: 30px;
}

.distinct-content {
    font-weight: bold;
}

.important-note {
    color: red;
}

.warning-note {
    color: #FF5F15;
    font-size: 18px;
    font-weight: bold;
}

.extra-step {
    background-color: #EE82EE;
    padding: 5px 10px;
}


.tiny-item-unsecuredH {
    position: relative;
    font-weight: bold;
    font-size: 16px;
    margin-bottom: 4px;
    border-bottom: solid 1px #ACACAC;
    padding: 2.5px 1px;
}

    .tiny-item-unsecuredH::before {
        content: "|";
        color: red;
        font-weight: bold;
    }

.display-block-unsecuredH {
    display: block;
    white-space: nowrap;
}

.table-cell-unsecuredH {
    display: table-cell;
    white-space: nowrap;
}

.btn-div {
    text-align: center;
    padding: 5px;
}

.btn-div2, .btn-div3 {
    display: flex;
    text-align: center;
    padding: 5px;
    justify-content: center;
    align-items: center;
}

@media screen and (max-width: 814px) {
    .btn-div2 {
        flex-direction: column;
    }
}