@charset "UTF-8";

.p-ofa__body {
    margin-top: calc(6 * var(--base-unit));
}
@media screen and (max-width: 767px) {
    .p-ofa__body {
        margin-top: calc(3 * var(--base-unit));
    }
}
.p-ofa__body--s {
    margin-top: calc(4 * var(--base-unit));
}
.p-ofa__body--l {
    margin-top: calc(10 * var(--base-unit));
}
@media screen and (max-width: 767px) {
    .p-ofa__body--l {
        margin-top: calc(4 * var(--base-unit));
    }
}
@media screen and (max-width: 767px) {
    .p-ofa--last {
        padding-bottom: calc(4 * var(--base-unit));
    }
}
@media screen and (max-width: 767px) {
    .p-ofa__ttl-en {
        margin-top: calc(0.5 * var(--base-unit)) !important;
        line-height: 1.5 !important;
    }
}
@media screen and (max-width: 1199px) {
    .p-ofa__txt {
        padding-inline: calc(1.5 * var(--base-unit));
    }
}
@media screen and (max-width: 767px) {
    .p-ofa__txt {
        padding-inline: 0;
    }
}
.p-ofa {
    width: var(--width-contents);
    margin-inline: auto;
}
.p-ofa__item {
    display: flex;
    flex-direction: row;
}
.p-ofa__item + .p-ofa__item {
    margin-top: calc(12 * var(--base-unit));
}
@media screen and (max-width: 767px) {
    .p-ofa__item + .p-ofa__item {
        margin-top: calc(4 * var(--base-unit));
    }
}
@media screen and (max-width: 767px) {
    .p-ofa__item {
        display: block;
    }
}
.p-ofa__main {
    flex: 1;
}
.p-ofa__ttl {
    font-size: calc(3.4 * var(--base-unit));
    line-height: 1.5;
    letter-spacing: 0.1em;
    font-weight: 300;
    border-bottom: calc(0.1 * var(--base-unit)) solid #333;
    padding-bottom: calc(1.3 * var(--base-unit));
}
@media screen and (max-width: 1199px) {
    .p-ofa__ttl {
        padding-right: 10%;
    }
}
@media screen and (max-width: 767px) {
    .p-ofa__ttl {
        font-size: calc(2.2 * var(--base-unit));
        line-height: 1.3636363636;
        font-weight: 400;
        padding-right: 0;
    }
}
.p-ofa__txt-wrap {
    margin-top: calc(3 * var(--base-unit));
    width: calc(486 / 612 * 100%);
}
@media screen and (max-width: 1199px) {
    .p-ofa__txt-wrap {
        width: calc(555 / 612 * 100%);
    }
}
@media screen and (max-width: 767px) {
    .p-ofa__txt-wrap {
        margin-top: calc(2 * var(--base-unit));
        width: 100%;
    }
}
.p-ofa__txt {
    font-size: calc(1.8 * var(--base-unit));
    line-height: 2.1111111111;
}
@media screen and (max-width: 767px) {
    .p-ofa__txt {
        font-size: calc(1.5 * var(--base-unit));
        letter-spacing: 0.05em;
        line-height: 1.5555555556;
    }
}
.p-ofa__btn-wrap {
    margin-top: calc(4.6 * var(--base-unit));
    width: calc(486 / 612 * 100%);
}
@media screen and (max-width: 1199px) {
    .p-ofa__btn-wrap {
        width: calc(555 / 612 * 100%);
    }
}
@media screen and (max-width: 767px) {
    .p-ofa__btn-wrap {
        margin-top: calc(2 * var(--base-unit));
        width: 100%;
    }
}
.p-ofa__btn {
    margin-top: 0 !important;
}
.p-ofa__btn a {
    margin: 0 !important;
    width: 100% !important;
    min-width: initial !important;
    min-height: calc(8 * var(--base-unit));
    color: #333;
    background: #fff;
    border: 1px solid #0f2350;
}
@media screen and (min-width: 768px){
    .p-ofa__btn a:hover {
        color: #fff;
    }
}
@media screen and (max-width: 767px) {
    .p-ofa__btn a {
        min-width: 100% !important;
        min-height: calc(5.4 * var(--base-unit));
    }
}
.p-ofa__img {
    width: calc(588 / 1200 * 100%);
}
.p-ofa__img-txt {
    font-size: calc(1.3 * var(--base-unit));
    font-weight: 400;
    line-height: 1.5;
    text-align: right;
    margin-top: calc(0.2 * var(--base-unit));
}
@media screen and (max-width: 767px) {
    .p-ofa__img {
        margin-top: calc(2 * var(--base-unit));
        width: 100%;
    }
}
.p-ofa__img img {
    display: block;
    width: 100%;
    height: auto;
    -o-object-fit: cover;
        object-fit: cover;
}
@media screen and (max-width: 1199px) {
    .p-ofa__img img {
        height: auto;
    }
}