@-webkit-keyframes reflection {
    0% {
        -webkit-transform: scale(0) rotate(45deg);
        transform: scale(0) rotate(45deg);
        opacity: 0;
    }
    80% {
        -webkit-transform: scale(0) rotate(45deg);
        transform: scale(0) rotate(45deg);
        opacity: 0.25;
    }
    81% {
        -webkit-transform: scale(4) rotate(45deg);
        transform: scale(4) rotate(45deg);
        opacity: 0.4;
    }
    100% {
        -webkit-transform: scale(50) rotate(45deg);
        transform: scale(50) rotate(45deg);
        opacity: 0;
    }
}
@keyframes reflection {
    0% {
        -webkit-transform: scale(0) rotate(45deg);
        transform: scale(0) rotate(45deg);
        opacity: 0;
    }
    80% {
        -webkit-transform: scale(0) rotate(45deg);
        transform: scale(0) rotate(45deg);
        opacity: 0.25;
    }
    81% {
        -webkit-transform: scale(4) rotate(45deg);
        transform: scale(4) rotate(45deg);
        opacity: 0.4;
    }
    100% {
        -webkit-transform: scale(50) rotate(45deg);
        transform: scale(50) rotate(45deg);
        opacity: 0;
    }
}
/* ========================
Base
======================== */
* {
    box-sizing: border-box;
}
html {
    font-size: 62.5%;
}

body {
    --primary: #d6a200;
    --secondary: #006450;
    --accent: #dc461e;
    --bg: #f8f0d8;
    --white: #fff;
    --black: #000;
    --red: #f00000;
    --stripe-bg: repeating-linear-gradient(-45deg, #d6a200, #d6a200 8px, #dcb026 8px, #dcb026 16px);
    --stripe-bg-light: repeating-linear-gradient(-45deg, #f5e8c0, #f5e8c0 8px, #f3e3b2 8px, #f3e3b2 16px);

    --font-main: 'Noto Sans JP', sans-serif;

    color: var(--blackX);
    font-family: var(--font-main);
    font-weight: 500;
    background: #f2f2f2;
    font-size: 1.6rem;
}

img {
    max-width: 100%;
}

a {
    color: var(--accent);
}

a:hover,
a:focus {
    opacity: 0.8;
}

ul,
ol {
    list-style: none;
}

em,
address,
b {
    font-style: normal;
}

/* ========================
Common
======================== */
/* SP Contents */
.sp-contents {
    overflow-x: hidden;
    max-width: 390px;
    margin-inline: auto;
    box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.35);
    position: relative;
    background: var(--main);
    margin-block: 20vh;
}

@media screen and (max-width: 768px) {
    .sp-contents {
        margin-block: 0;
    }
}

/* Button */

.btn {
    --_fz: 2.4rem;
    --_fz-sm: 1.6rem;
    --_lh: 1.33;
    --_lh-sm: 1.25;
    --_ls: 0.2em;
    --_ls-sm: 0.04em;
    --_pd: 7px 15px;

    --_gtc: 49px minmax(0, 1fr) 45px;
    --_gap: 10px;

    --_chevron-display: block;

    text-decoration: none;
    color: var(--white);
    display: grid;
    grid-template-columns: var(--_gtc);
    align-items: center;
    gap: var(--_gap);
    border-radius: 8px;
    padding: var(--_pd);
    position: relative;
    height: 100%;

    &::after {
        content: '';
        display: var(--_chevron-display);
        position: absolute;
        top: 50%;
        right: 14px;
        translate: 0 -50%;
        width: 10px;
        height: 14px;
        background: url(../images/chevron_right.svg) no-repeat center center / contain;
    }
}

.btn[data-style='tel'] {
    background: var(--primary);
    box-shadow: 0 5px 0 0 #af8504;
}

.btn[data-style='form'] {
    background: var(--accent);
    box-shadow: 0 5px 0 0 #9e3519;
}

.btn[data-style='line'] {
    background: #4cc764;
    box-shadow: 0 5px 0 0 #49b05d;
}
.btn_icon {
    aspect-ratio: 1;
    width: 100%;
}

.btn_text-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.btn_text {
    font-weight: 700;
    font-size: var(--_fz);
    line-height: var(--_lh);
    letter-spacing: var(--_ls);
    text-align: center;
    text-transform: uppercase;
}

.btn_text-small {
    line-height: var(--_lh-sm);
    font-size: var(--_fz-sm);
    letter-spacing: var(--_ls-sm);
}

.btn[data-size='sm'] {
    --_fz: 1.5rem;
    --_lh: 1.33;
    --_ls: 0em;
    --_fz-sm: 1rem;
    --_lh-sm: 1.25;
    --_ls-sm: 0em;
    --_pd: 5px 5px 7px 4px;
    --_gtc: 30px minmax(0, 1fr);
    --_gap: 1px;
    --_chevron-display: none;
}

.btn--gritter {
    overflow: hidden;
    position: relative;
}
.btn--gritter::before {
    content: '';
    display: block;
    height: 100%;
    width: 10%;
    position: absolute;
    top: -50%;
    left: -78px;
    background-color: #fff;
    opacity: 0;
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-animation: reflection 3s ease-in-out infinite;
    animation: reflection 3s ease-in-out infinite;
}

.btn-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-left: 17px;
    padding-right: 17px;
    margin-top: 16px;
}

.sect-title {
    padding-left: 24px;
    border-left: 3px solid #009533;
    color: #000;
    font-size: 4rem;
    font-family: 'Yu Mincho Pr6N', 'Times New Roman', 'YuMincho', 'Hiragino Mincho ProN', 'Yu Mincho', 'MS PMincho',
        serif;
    line-height: 1.5;
    font-weight: 600;
}
@media screen and (max-width: 768px) {
    .sect-title {
        padding-left: 16px;
        font-size: 2.4rem;
        line-height: 1.8;
    }
}

.fadeup {
    opacity: 0;
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.fadeup.show {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

/* === Slick === */
.slick-list {
    margin-left: -20px;
    margin-right: -20px;
}
.slick-track {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.slick-slide {
    float: none;
    height: auto;
}
.slick-slide:not(.slick-current) * {
    -webkit-filter: none;
    filter: none;
}
.slick-prev,
.slick-next {
    display: block;
    position: absolute;
    top: 50%;
    z-index: 1;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 30px;
    height: 150px;
    padding: 0;
    background-color: color-mix(in srgb, var(--secondary) 30%, transparent 70%);
    border: none;
    outline: none;
    color: transparent;
    cursor: pointer;
}
.slick-prev::after,
.slick-next::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-70%, -50%) rotate(-45deg);
    transform: translate(-70%, -50%) rotate(-45deg);
    width: 10px;
    height: 10px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
    outline: none;
    color: transparent;
}
.slick-prev {
    -webkit-transform: translateY(-50%) scale(-1, 1);
    transform: translateY(-50%) scale(-1, 1);
    left: -20px;
}
.slick-next {
    right: -20px;
}
.slick-disabled {
    opacity: 0;
    cursor: auto;
}
.slick-disabled:hover,
.slick-disabled:focus {
    opacity: 0;
}
.slick-dots {
    display: block;
    position: absolute;
    bottom: -13px;
    width: 100%;
    text-align: center;
}
.slick-dots li {
    display: inline-block;
    margin: 0 11px;
    cursor: pointer;
}
.slick-dots li button {
    display: block;
    width: 16px;
    height: 16px;
    padding: 0;
    background-color: var(--white);
    border: 0;
    outline: none;
    color: transparent;
    font-size: 0px;
    line-height: 0px;
    border-radius: 50%;
    cursor: pointer;
}
.slick-dots li.slick-active button {
    background-color: var(--black);
}
.slick-initialized .slick-slide {
    display: flex;
}

.cont {
    padding: 50px 20px;
}

/* ========================
Blocks
======================== */
/* HeaderHeader */
.header {
    position: absolute;
    top: 0;
    left: 0;
    padding: 13px 20px 15px;
    z-index: 50;
    background: var(--white);
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
    border-bottom-right-radius: 20px;
}

.header_logo {
    display: block;
    aspect-ratio: 154/29;
    width: 154px;

    img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }
}

/* Hero */
.hero {
    background: url(../images/hero_bg.jpg) no-repeat center center / cover;
    padding-block-start: 69px;
}

.hero_top {
    padding-inline: 20px;
}

.hero_worries {
    display: grid;
    grid-template: auto / minmax(0, 1fr) minmax(0, 1fr);

    gap: 15px;
}

.hero_worry {
    aspect-ratio: 160/66;
    img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }
}

.hero_title {
    aspect-ratio: 335/245;
    margin-block-start: -10px;

    img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }
}

.hero_bottom {
    width: 100%;
    margin-block-start: -30px;
}

.hero_cta {
    background: var(--black);
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-inline: 18px;
    margin-block-start: -2px;
    padding-block-end: 13px;
}

.hero_cta-appeal {
    display: inline-block;
    background: var(--white);
    font-weight: 900;
    font-size: 1.8rem;
    line-height: 1.42;
    padding: 3px 7px 0;
    border-radius: 8px;
    margin-block-start: -14px;

    span {
        display: inline-block;
        padding-block-start: 2px;
        position: relative;

        &::before {
            content: '';
            display: block;
            width: 3px;
            height: 3px;
            border-radius: 50%;
            background: var(--black);
            position: absolute;
            top: 1px;
            left: 50%;
            translate: -50% 0;
        }
    }
}

.hero_cta-lead {
    color: var(--white);
    line-height: 1.46;
    font-size: 1.3rem;
    text-align: center;
    display: block;
    margin-block-start: 6px;
}

.hero_cta-btns {
    margin-block-start: 6px;
    display: grid;
    grid-template: auto / minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    gap: 10px;
}

.hero_cta-btn {
}

/* Worries */
.worries {
    background: var(--stripe-bg);
    padding-block-end: 100px;
    position: relative;
}

.worries_inner {
}

.worries_title {
    font-size: 3.4rem;
    font-weight: 900;
    line-height: 1.41;
    color: var(--white);

    span {
        display: inline-block;
        width: 78px;
        vertical-align: middle;

        img {
            width: 100%;
            height: 100%;
            object-fit: contain;
        }
    }
}

.worries_content {
    margin-block-start: 16px;
    border-radius: 20px;
    padding: 35px 20px 25px;
    background: var(--white);
}

.worries_list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.worries_item {
    --_bg-color: #c0c0c0;

    font-weight: 900;
    font-size: 1.8rem;
    line-height: 1.56;
    text-align: center;
    display: block;
    border-radius: 20px;
    background: var(--_bg-color);
    width: fit-content;
    padding: 8px;
    position: relative;

    &::after {
        content: '';
        display: block;
        position: absolute;
        width: 31px;
        height: 16px;
        background: var(--_bg-color);
        mask: url('../images/worries_hukidashi-deco.png') no-repeat center center / contain;
        bottom: 0;
        left: 19px;
        translate: 0 calc(100% - 4px);
    }

    &:nth-child(even) {
        --_bg-color: #dde2e6;
        margin-inline-start: auto;
        &::after {
            left: auto;
            right: 19px;
            scale: -1 1;
        }
    }
}
.worries_illust {
    position: absolute;
    top: 62px;
    right: 20px;
    width: 110px;
    aspect-ratio: 110 / 137;
}

/* Message */
.message {
    background: var(--bg);
    padding-block-start: 0;
}

.message_inner {
}

.message_title {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: calc(32 / 18);
    background: var(--white);
    text-align: center;
    border-radius: 20px;
    padding-block: 14px 17px;
    position: relative;
    margin-block-start: -55px;

    span {
        font-size: 1.4rem;
    }

    strong {
        font-weight: 900;
        font-size: 2.2rem;
        line-height: calc(32 / 22);
    }

    img {
        width: 235px;
        margin-inline: auto;
        display: block;
    }

    &::after {
        content: '';
        display: block;
        position: absolute;
        width: 30px;
        height: 12px;
        bottom: 0;
        left: 50%;
        translate: -50% calc(100% - 1px);
        background: url('../images/message_hukidashi-deco.svg') no-repeat center center / contain;
    }
}

.message_content {
    margin-block-start: 23px;
}

.message_lead {
    position: relative;
    padding-block-end: 21px;
}

.message_lead-head {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.78;
}

.message_lead-body {
    display: block;
    font-weight: 700;
    line-height: 2;
    font-size: 2.5rem;
    color: var(--white);
    background: var(--secondary);
    border-radius: 20px;
    margin-block-start: 20px;
    padding: 13px 14px 15px 20px;
}
.message_illust {
    position: absolute;
    width: 85px;
    bottom: 0;
    right: 0;
}

.message_text {
    font-size: 1.6rem;
    line-height: 2;
}

.message_list-wrapper {
    margin-block: 30px 20px;
}

.message_list-text {
    font-size: 2.5rem;
    font-weight: 900;
    line-height: 0.96;
}

.message_list {
    margin-block-start: 17px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.message_item {
    border-radius: 999em;
    background: var(--white);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.6;
    padding: 4px 44px 5px;
    position: relative;

    &::before {
        content: '';
        display: block;
        position: absolute;
        width: 27px;
        height: 27px;
        background: url('../images/icon_check.svg') no-repeat center center / contain;
        top: 50%;
        left: 8px;
        translate: 0 -50%;
    }
}
/* Voice */
.voice {
    background: color-mix(in srgb, var(--primary) 70%, transparent);
}

.voice_inner {
}

.voice_title {
    font-weight: 900;
    font-size: 2.4rem;
    line-height: 1.7;
    text-align: center;
    position: relative;

    span {
        display: inline-block;
        width: 69px;
        vertical-align: text-top;
        padding-inline-start: 2px;
        padding-block-start: 2px;
        box-sizing: unset;

    img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center;
    }
    }
}

.voice_worries {
    margin-block-start: 18px;
}

.voice_solution {
    font-size: 2rem;
    line-height: 1.8;
    font-weight: 900;
    text-align: center;
    margin-block-start: 4px;
    position: relative;
    padding-block-end: 32px;

    span {
        display: inline-block;
        width: 98px;
        vertical-align: text-top;
        box-sizing: unset;
    }

    em {
        color: var(--white);
        display: inline-block;
        padding-inline: 2px;
        background: linear-gradient(
            to top,
            transparent 15%,
            var(--secondary) 15%,
            var(--secondary) 85%,
            transparent 85%
        );
    }

    &::after {
        content: '';
        display: block;
        position: absolute;
        width: 100%;
        height: 25px;
        background: url('../images/voice_solution-deco.svg') no-repeat center center / contain;
        bottom: 0;
        left: 50%;
        translate: -50% 0;
    }
}

.voice_content {
}

.voice_list {
}

.voice_item {
    margin: 10px 20px 20px;
    padding-block-start: 62px;
    flex-grow: 1;
    display: flex;
}

.voice_item-inner {
    flex-grow: 1;
    background: var(--white);
    border-radius: 20px;
    padding: 0 20px 34px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.voice_item-img {
    width: 125px;
    aspect-ratio: 1;
    margin-block-start: -62px;
}
.voice_item-job {
    font-size: 1.4rem;
    font-weight: 500;
    display: block;
    margin-block-start: 16px;
}

.voice_item-name {
    text-align: center;
    margin-block-start: 4px;
}

.voice_item-name-ja {
    font-weight: 700;
    font-size: 2rem;
    line-height: 1.8;
    letter-spacing: 0.3em;
}

.voice_item-name-en {
    font-size: 1.2rem;
    color: var(--secondary);
}

.voice_item-text {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2;
    margin-block-start: 22px;
}

/* CTA */
.cta {
    background: var(--secondary);
    overflow: hidden;
    padding-block-end: 0;
}

.cta_inner {
}

.cta_title {
    display: block;
    text-align: center;
    background: var(--black);
    font-weight: 700;
    color: var(--white);
    font-size: 2.2rem;
    padding-block: 5px 8px;
}

.cta_promise {
    display: grid;
    grid-template-columns: 122fr 213fr;
    grid-template-areas: 'illust text' 'list list';
    margin-block-start: 30px;
    position: relative;
}

.cta_illust {
    width: 97px;
    aspect-ratio: 97 / 79;
    position: absolute;
    top: 3px;
    left: 12px;

    img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }
}

.cta_promise-text {
    color: var(--white);
    display: inline-block;
    grid-area: text;
    padding-block: 26px;
    position: relative;

    &::before,
    &::after {
        content: '';
        display: block;
        position: absolute;
        width: 57px;
        height: 2px;
        background: var(--white);
        rotate: -20deg;
        top: 7px;
        left: 0;
    }
    &::after {
        rotate: 20deg;
        top: auto;
        bottom: 7px;
    }
}

.cta_promise-list-wrapper {
    background: var(--white);
    border-radius: 20px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    grid-area: list;
    margin-block-start: 14px;

    position: relative;

    &::before {
        content: '';
        display: block;
        position: absolute;
        width: 14px;
        height: 31px;
        background: url('../images/cta_illust-hand.png') no-repeat center center / contain;
        top: 14px;
        left: -8px;
        z-index: 5;
    }
}

.cta_promise-list-title {
    --_marker-color: color-mix(in srgb, var(--primary) 30%, transparent);
    font-size: 2rem;
    display: inline-block;
    line-height: 1.5;
    padding-inline: 0.25em;
    background: linear-gradient(
        to top,
        transparent 5%,
        var(--_marker-color) 5%,
        var(--_marker-color) 50%,
        transparent 50%
    );
}

.cta_promise-list-title-sub {
    display: block;
    margin-block-start: 12px;
    line-height: 1.75;
}

.cta_promise-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cta_promise-item {
    padding-inline-start: 36px;
    line-height: 2;
    position: relative;

    &::before {
        content: '';
        position: absolute;
        width: 27px;
        height: 27px;
        background: url('../images/icon_check.svg') no-repeat center center / contain;
        top: 50%;
        left: 0;
        translate: 0 -50%;
    }
}

.cta_actions {
    background: var(--black);
    margin-inline: calc(50% - 50vw);
    padding-inline: calc(50vw - 50%);
    padding-block: 124px 50px;
    text-align: center;
    margin-block-start: -104px;
}

.cta_actions-title {
    font-weight: 900;
    font-size: 2.4rem;
    color: var(--white);

    span {
        display: inline-block;
        padding-block-start: 8px;
        position: relative;

        &::before {
            content: '';
            display: block;
            position: absolute;
            width: 4px;
            height: 4px;
            border-radius: 50%;
            background: var(--white);
            top: 0;
            left: 50%;
            translate: -50% 0;
        }
    }
}

.cta_actions-text {
    font-size: 1.5rem;
    color: var(--white);
    line-height: 1.73;
    margin-block-start: 16px;
}

.cta_actions-list {
    margin-block-start: 18px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.cta_actions-item {
}

/* Assessment */
.assessment {
    background: var(--bg);
    padding-block-start: 49px;
}

.assessment_inner {
}
.assessment_content-wrapper {
    background: var(--bg);
    padding-block: 0 50px;
}

.assessment_title {
    font-size: 2.2rem;
    font-weight: 900;
    line-height: 1.82;
    text-align: center;
    position: relative;
    font-feature-settings: 'palt' 1;

    span {
        display: inline-block;
        width: 320px;
    }
}

.assessment_content {
    margin-block-start: 43px;
    background: var(--primary);
    border-radius: 20px;
    padding: 0 20px 28px;
}

.assessment_content-title {
    font-weight: 700;
    line-height: 1.6;
    font-size: 2rem;
    color: var(--white);
    background: var(--black);
    border-radius: 999em;
    width: fit-content;
    margin-inline: auto;
    padding: 7px 20px;
    translate: 0 -23px;
}

.assessment_list {
    display: flex;
    flex-direction: column;
    gap: 11px;
    margin-block-start: -8px;
}

.assessment_item {
    font-weight: 700;
    font-size: 1.6rem;
    line-height: 1.41;
    border-block-end: 1px dashed var(--black);
    padding-inline-start: 22px;
    position: relative;

    &::before {
        content: '';
        display: block;
        position: absolute;
        width: 18px;
        height: 18px;
        background: url('../images/icon_check.svg') no-repeat center center / contain;
        top: 50%;
        left: 0;
        translate: 0 -50%;
    }
}

.assessment_info {
    margin-block-start: 16px;
    color: var(--white);
}

.assessment_info-title {
    font-weight: 700;
    line-height: 1.6;
    font-size: 2rem;
    text-align: center;
    padding-inline-start: 1.5em;
    position: relative;
    width: fit-content;
    margin-inline: auto;

    &::before {
        content: '';
        display: block;
        position: absolute;
        width: 20px;
        height: 27px;
        background: url('../images/icon_pin.svg') no-repeat center center / contain;
        top: 50%;
        left: 0;
        translate: 0 -50%;
    }
}

.assessment_info-subtitle {
    position: relative;
    display: grid;
    margin-block-start: 4px;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 10px;
}
.assessment_info-subtitle-text {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.78;
}

.assessment_info-subtitle-line {
    width: 100%;
    height: 1px;
    background: var(--white);
}

.assessment_info-text {
    display: block;
    line-height: 2;
}

.assessment_info-person {
    width: 195px;
    margin-inline: auto;
    margin-block-start: 6px;
}

.assessment_info-note {
    margin-block-start: 6px;
    font-size: 1.3rem;
    line-height: 2;
}

.assessment_info-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.assessment_info-item {
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 2;
    padding-inline-start: 1em;
    position: relative;

    strong {
        font-weight: 500;
        font-size: 1.6rem;
        line-height: 1;
    }

    &::before {
        content: '・';
        display: inline-block;
        width: 1em;
        position: absolute;
        left: 0;
        top: 0;
    }
}

.assessment_content-wrapper:nth-of-type(2n) {
    background: #d9e8e5;
    padding-block: 51px 40px;

    .assessment_content {
        background: var(--secondary);
    }

    .assessment_item {
        color: var(--white);
        border-color: var(--white);
    }
    .assessment_note {
        color: var(--white);
        font-size: 1.3rem;
        text-align: center;
        line-height: 2;
        margin-block-start: 8px;
    }
    .assessment_info {
        margin-block-start: 4px;
    }
    .assessment_info-subtitle-text {
        color: var(--primary);
        margin-block: 4px;
    }
    .assessment_info-subtitle-line {
        background: var(--primary);
    }
}

/* Flow */
.flow {
    background: linear-gradient(to bottom, #d9e8e5 55px, var(--black) 55px);
    padding: 0;
}

.flow_inner {
}

.flow_title {
    font-size: 1.6rem;
    line-height: 1.5;
    text-align: center;
    border-radius: 20px;
    padding-block: 14px 16px;
    position: relative;
    background: var(--white);
    max-width: 335px;
    margin-inline: auto;

    em {
        font-weight: 900;
        font-size: 2.4rem;
        line-height: calc(32 / 24);
    }

    &::after {
        content: '';
        display: block;
        position: absolute;
        width: 30px;
        height: 12px;
        bottom: 0;
        left: 50%;
        translate: -50% calc(100% - 1px);
        background: url('../images/message_hukidashi-deco.svg') no-repeat center center / contain;
    }
}

.flow_top {
    margin-block-start: 40px;
    padding-block-end: 38px;
    padding-inline: 20px;
}

.flow_top-cta {
    display: flex;
    flex-direction: column;
    gap: 26px;
}

.flow_cta-item {
}

.flow_reserve {
    --_color: var(--white);
    margin-block-start: 44px;
}

.flow_sect-title {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 10px;
}

.flow_sect-title-line {
    width: 100%;
    height: 1px;
    background: var(--_color);
}

.flow_sect-title-text {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.78;
    color: var(--_color);
}

.flow_steps {
    margin-block-start: 29px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px 19px;
}

.flow_step {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border: 1px solid var(--_color);
    position: relative;

    &:not(:last-child) {
        &::after {
            content: '';
            position: absolute;
            width: 20px;
            height: 10px;
            background: var(--primary);
            clip-path: polygon(50% 100%, 100% 0, 0 0);
            left: 50%;
            bottom: -9px;
            translate: -50% 100%;
        }
    }
}
.flow_step:not([data-size='sm']) {
    height: 80px;
    grid-column: span 2;
}
.flow_step[data-size='sm'] {
    padding: 13px 6px 6px;
    display: flex;
    flex-direction: column;
    gap: 0;
    text-align: center;
}

.flow_step-icon {
}

.flow_step-content {
    width: max-content;
    text-align: center;
}
.flow_step-text {
    color: var(--_color);
    font-weight: 700;
    line-height: 1.5;
}

.flow_step-note {
    color: var(--primary);
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.5;
}

.flow_person {
    width: 195px;
    margin-inline: auto;
    margin-block-start: 25px;
}

.flow_note {
    display: block;
    margin-block-start: 8px;
    color: var(--white);
    text-align: center;
    line-height: 2;
    font-size: 1.3rem;
}
.flow_bottom {
    background: var(--bg);
    padding-inline: 20px;
    padding-block: 54px 50px;
    position: relative;
}

.flow_bottom-lead {
    display: block;
    font-size: 1.6rem;
    line-height: 2;
    max-width: 208px;
}

.flow_bottom-list {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-block-start: 32px;
    max-width: 224px;
    margin-inline-start: auto;
}

.flow_bottom-item {
    font-weight: 700;
    font-size: 1.6rem;
    line-height: 1.41;
    border-block-end: 1px dashed var(--black);
    padding-inline-start: 22px;
    position: relative;

    &::before {
        content: '';
        display: block;
        position: absolute;
        width: 18px;
        height: 18px;
        background: url('../images/icon_check.svg') no-repeat center center / contain;
        top: 50%;
        left: 0;
        translate: 0 -50%;
    }
}

.flow_bottom-illust1 {
    position: absolute;
    top: 50px;
    right: 17px;
}

.flow_bottom-illust2 {
    position: absolute;
    top: 243px;
    left: 20px;
}

.flow_bottom-cta {
    margin-block-start: 29px;
}

.flow_line {
    --_color: var(--black);
    margin-block-start: 25px;
}

/* Items */
.items {
    background: var(--stripe-bg-light);
    position: relative;
}

.items_inner {
}

.items_title {
    max-width: 210px;
    margin-inline: auto;
}

.items_lead {
    font-weight: 900;
    font-size: 2.2rem;
    line-height: 1.82;
    display: block;
    margin-block-start: 14px;
    text-align: center;
}

.items_list-wrapper {
    margin-block-start: 11px;
}

.items_list-text {
    text-align: center;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.7;
}

.items_list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px 7px;
    margin-block-start: 8px;
}

.items_item {
    background: var(--white);
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: end;
    height: 68px;
    gap: 4px;
    padding-block-end: 4px;
}

.items_item[data-type='emphasis'] {
    background: color-mix(in srgb, var(--accent) 70%, transparent);
    border: 2px solid var(--accent);
}
.items_item:not(:has(.items_item-img)) {
    justify-content: center;
    padding: 0;
}

.items_item-img {
}

.items_item-text {
    font-size: 1.3rem;
    text-align: center;
    line-height: 1.5;
}

.items_illust {
    position: absolute;
    bottom: -19px;
    right: 20px;
    width: 97px;
}

.push {
    background: var(--black);
    padding-block: 71px 140px;
}

.push_inner {
}

.push_list-wrapper {
    background: var(--white);
    border-radius: 20px;
    padding: 48px 40px 38px 34px;
    position: relative;
    width: 100%;
}

.push_list-title {
    background: var(--primary);
    display: grid;
    grid-template-columns: 44px 1fr;
    border-radius: 999em;
    position: absolute;
    top: 0;
    left: 50%;
    translate: -50% -50%;
    gap: 3px;
    height: 46px;
    padding-inline: 9px 14px;
    place-items: center;
    width: 100%;
    max-width: 300px;

    &::after {
        content: '';
        position: absolute;
        mask: url('../images/message_hukidashi-deco.svg') no-repeat center center / contain;
        width: 20px;
        height: 8px;
        bottom: 0;
        left: 50%;
        translate: -50% 100%;
        background: var(--primary);
    }
}
.push_list-wrapper:nth-child(even) {
    margin-block-start: 50px;
    padding-block-end: 22px;
}
.push_list-wrapper:nth-child(even) .push_list-title {
    background: var(--secondary);

    &::after {
        background: var(--secondary);
    }
}

.push_list-title-icon {
}

.push_list-title-text {
    color: var(--white);
    font-weight: 700;
    font-size: 2rem;
    white-space: nowrap;
}

.push_list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.push_item {
    font-weight: 700;
    font-size: 1.6rem;
    line-height: 1.41;
    border-block-end: 1px dashed var(--black);
    padding-inline-start: 22px;
    position: relative;

    &::before {
        content: '';
        display: block;
        position: absolute;
        width: 18px;
        height: 18px;
        background: url('../images/icon_check.svg') no-repeat center center / contain;
        top: 50%;
        left: 0;
        translate: 0 -50%;
    }
}

.push_list-note {
    display: block;
    text-align: center;
    font-size: 1.4rem;
    margin-block-start: 16px;
}

.push_message {
    display: grid;
    grid-template-columns: 1fr 92px;
    gap: 20px;
    align-items: center;
    margin-block-start: 22px;
}

.push_message-text {
    font-weight: 700;
    font-size: 1.8rem;
    line-height: 1.78;
    color: var(--white);
}

.push_illust {
}

.push_cta {
    margin-block-start: 18px;
}

/* Request */

.request {
    position: relative;
    padding-top: 108px;
    padding-bottom: 50px;
    background: var(--bg);
}
.request_title {
    width: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    translate: -50% 0;
    margin-block-start: -90px;
}
.request_title-inner {
    font-size: 1.5rem;
    line-height: 1.6;
    text-align: center;
    border-radius: 20px;
    padding-block: 14px 16px;
    position: relative;
    background: var(--white);
    max-width: 335px;
    margin-inline: auto;
    font-feature-settings: 'palt' 1;

    strong {
        font-size: 2rem;
        font-weight: 900;
    }

    &::after {
        content: '';
        display: block;
        position: absolute;
        width: 30px;
        height: 12px;
        bottom: 0;
        left: 50%;
        translate: -50% calc(100% - 1px);
        background: url('../images/message_hukidashi-deco.svg') no-repeat center center / contain;
    }
}

.request_note {
    text-align: center;
    font-size: 1.4rem;
    line-height: 2;
}
.request_note-mail {
    display: block;
    font-size: 1.6rem;
    line-height: calc(28 / 16);
}
.request_lead {
    text-align: center;
    font-size: 2.4rem;
    line-height: 1.5;
    font-weight: 700;
    margin-block-start: 6px;
    display: block;
    position: relative;

    strong {
        font-size: 3.4rem;
    }

    &::before,
    &::after {
        content: '';
        position: absolute;
        top: 0;
        background: url('../images/request_lead-deco.svg') no-repeat center center / contain;
        width: 38px;
        aspect-ratio: 1;
        left: 0;
    }

    &::after {
        left: auto;
        scale: -1 1;
        right: 0;
    }
}
.request_panel {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 auto;
}
.request_require-note {
    text-align: right;
    font-size: 1.2rem;
    font-family: var(--ff-en);
    margin-block-start: 12px;
}
.request_form {
    margin-top: 10px;
}

.form * {
    font-family: var(--font-main);
}
.form .form-text {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: 50px;
    padding: 8px 12px;
    border: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 5px;
    border: 1px solid #d4d4d4;
    color: var(--text);
    font-size: 1.6rem;
    line-height: 1.5;
    background: #fff;
    box-shadow: inset 2px 2px 2px rgba(0, 0, 0, 0.2);
}
.form .form-text::-webkit-input-placeholder {
    color: #c0c0c0;
}
.form .form-text::-moz-placeholder {
    color: #c0c0c0;
}
.form .form-text:-ms-input-placeholder {
    color: #c0c0c0;
}
.form .form-text::-ms-input-placeholder {
    color: #c0c0c0;
}
.form .form-text::placeholder {
    color: #c0c0c0;
}
.form .form-text:not(:-moz-placeholder-shown) {
    background-color: #fff;
    border: 1px solid #232323;
}
.form .form-text:not(:-ms-input-placeholder) {
    background-color: #fff;
    border: 1px solid #232323;
}
.form .form-text:not(:placeholder-shown) {
    background-color: #fff;
    border: 1px solid #232323;
}
.form .form-select {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: 50px;
    padding: 8px 14px 8px;
    background-color: #fafafa;
    border: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 5px;
    -webkit-box-shadow: inset 3px 3px 2px rgba(0, 0, 0, 0.2);
    box-shadow: inset 3px 3px 2px rgba(0, 0, 0, 0.2);
    font-size: 1.6rem;
    line-height: 1.5;
    width: 100%;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 2px solid var(--primary);
    color: var(--text);
}
.form .form-select--initial {
    background-color: #fff;
}
.form .form-zip-btn {
    padding: 10px 10px;
    background: #fff;
    border-radius: 999em;
    color: var(--primary);
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
    height: 50px;
    letter-spacing: 0.02em;
    border: 2px solid;
    margin-block-start: 0;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.25);
    width: 130px;
}
.form .wpcf7-form-control-wrap {
    display: block;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-top: 7px;
}
.form .form-textarea {
    height: 186px;
    font-feature-settings: 'palt' 1;
}
.form .form-textarea--short {
    height: 100px;
}
.form_item {
    display: block;
    gap: 13px;
    color: #000;
}
.form_item:not(:first-child) {
    margin-top: 20px;
}
.form_item--short .wpcf7-form-control-wrap {
    max-width: 200px;
    margin-inline-end: 3px;
    flex-shrink: 0;
}
.form_item--has-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px;
}
.form_item--has-btn .form_title {
    width: 100%;
}

.form_item--has-btn .wpcf7-form-control-wrap {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    width: 100%;
    margin-left: 0;
    margin-block-start: 0;
    max-width: 144px;
}
.form_item--left {
    float: none;
    width: auto;
}
.form_item--right {
    float: right;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 50%;
    float: none;
    width: auto;
}
.form_title {
    display: block;
    width: auto;
    text-align: left;
    font-size: 1.4rem;
    font-family: var(--font-en);
    font-weight: 500;
    letter-spacing: 0.02em;
    color: var(--text);
    line-height: 1.25;
}

.form_title--long {
    letter-spacing: -0.1em;
}
.form_required {
    color: #e42d2d;
}
.form_control {
    display: block;
    width: 100%;
}
.form .form_item--select .wpcf7-form-control-wrap {
    position: relative;
    max-width: 200px;
}
.form .form_item--select .wpcf7-form-control-wrap::after {
    content: '';
    display: block;
    position: absolute;
    top: 21px;
    right: 14px;
    width: 11px;
    height: 9px;
    background: var(--primary);
    clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.form .form_item--radio > p {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.form .form_item--radio .wpcf7-radio {
    width: auto;
    margin-top: 0;
    margin-left: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 19px;
}
.form .form_item--radio .wpcf7-radio input {
    position: absolute;
    overflow: hidden;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
}
.form .form_item--radio .wpcf7-radio input:checked + .wpcf7-list-item-label {
    cursor: auto;
}
.form .form_item--radio .wpcf7-radio input:checked + .wpcf7-list-item-label::before {
    cursor: auto;
    border-color: var(--primary);
}
.form .form_item--radio .wpcf7-radio input:checked + .wpcf7-list-item-label::after {
    opacity: 1;
    cursor: auto;
}
.form .form_item--radio .wpcf7-list-item {
    display: inline-block;
    display: block;
    margin-left: 0;
}
.form .form_item--radio .wpcf7-list-item-label {
    display: inline-block;
    position: relative;
    padding-left: 27px;
    font-size: 1.6rem;
    line-height: 1.25;
    cursor: pointer;
    font-weight: 500;
}
.form .form_item--radio .wpcf7-list-item-label::before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 20px;
    height: 20px;
    background-color: #fff;
    border: 3px solid var(--primary);
    border-radius: 50%;
    cursor: pointer;
}
.form .form_item--radio .wpcf7-list-item-label::after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 5px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 10px;
    height: 10px;
    background-color: var(--primary);
    border-radius: 50%;
    opacity: 0;
    cursor: pointer;
}
.form .form_item--checkbox .wpcf7-checkbox {
    margin-top: 0;
    margin-left: 0;
}
.form .form_item--checkbox .wpcf7-checkbox input {
    position: absolute;
    overflow: hidden;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
}
.form .form_item--checkbox .wpcf7-checkbox input:checked + .wpcf7-list-item-label::before {
    background-color: #999;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.form .form_item--checkbox .wpcf7-checkbox input:checked + .wpcf7-list-item-label::after {
    opacity: 1;
}
.form .form_item--checkbox .wpcf7-list-item {
    display: block;
    margin-top: 12px;
    margin-left: 0;
}
.form .form_item--checkbox .wpcf7-list-item-label {
    display: inline-block;
    position: relative;
    line-height: 1.7857142857;
    cursor: pointer;
    padding-left: 27px;
    font-size: 1.1em;
    color: #bdbdbd;
    font-family: var(--font-en);
    font-weight: 300;
}
.form .form_item--checkbox .wpcf7-list-item-label::before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 18px;
    height: 18px;
    border-radius: 2px;
    background-color: #fff;
    cursor: pointer;
}
.form .form_item--checkbox .wpcf7-list-item-label::after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-65%) rotate(-45deg);
    transform: translateY(-65%) rotate(-45deg);
    width: 9px;
    height: 4px;
    border-bottom: 2px solid #fff;
    border-left: 2px solid #fff;
    opacity: 0;
    cursor: pointer;
    left: 4px;
}
.form .form_item--optional:not(._) {
    text-align: center;
    margin-top: 23px;
}
.form .form_item--optional:not(._) .wpcf7-list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.form .form_item--optional:not(._) .wpcf7-list-item-label {
    color: #777;
    text-align: left;
    font-size: 1.2rem;
    font-weight: 300;
}
.form .wpcf7-not-valid:not(.wpcf7-radio) {
    background: #f6f6f6;
    color: #464646;
}
.form .wpcf7-not-valid-tip {
    margin-top: 4px;
}

.form_upload {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.form_item--file .file_label {
    display: grid;
    place-items: center;
    border-radius: 4px;
    border: 2px solid var(--primary);
    background: var(--white);
    height: 50px;
    width: 200px;
    cursor: pointer;
    text-align: center;

    &:hover {
        opacity: 0.8;
    }
}

.form_item--file .file_label-text {
    font-size: 1.4rem;
    line-height: 1.43;
    padding-inline-start: 1.25em;
    position: relative;
    translate: -9px 0;

    &::before {
        content: '+';
        display: block;
        position: absolute;
        top: 50%;
        left: 0;
        translate: 0 -50%;
        font-size: 1.8rem;
        line-height: 1;
        color: var(--primary);
    }
}
.form_item--file .file_name {
    font-size: 1.3rem;
    line-height: 1.5;
    font-weight: 700;
    padding-inline-start: 0.25em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: none;
}
.form_item--file .file_name.has-file {
    display: block;
}

.form_note {
    margin-top: 8px;
    font-size: 1.3rem;
    line-height: calc(20 / 13);
    margin-left: 0;
}
.form_privacy-policy-wrap {
    margin-top: 32px;
    text-align: center;
}
.form_privacy-policy {
    display: inline-block;
    font-size: 1.2rem;
}
.form_privacy-policy a {
    font-weight: 500;
}
.form_submit-wrap {
    margin-top: 20px;
    text-align: center;
    position: relative;
    width: 222px;
    margin-inline: auto;
}
.form_submit {
    position: relative;
    width: 100%;
    padding-top: 12px;
    padding-bottom: 13px;
    outline: none;
    border: none;
    font-weight: 600;
    border-radius: 40px;
    background: var(--accent);
    font-size: 1.6rem;
    font-weight: bold;
    letter-spacing: 0.04em;
    cursor: pointer;
    color: #fff;
}

.footer {
  background: var(--primary);
  color: var(--white);
  padding: 50px 19px 44px;

}

.footer_inner {

}

.footer_list {
  display: flex;
flex-direction: column;
gap: 20px;
}

.footer_item {

}

.footer_item-title {
  font-weight: 700;
  font-size: 1.6rem;
  line-height: calc(22/16);
  
}

.footer_item-text {
  font-size: 1.4rem;
  font-weight: 400;
  line-height: calc(22/14);

}

.footer_copyright {
font-size: 1.2rem;
display: block;
margin-block-start: 36px;

}


/* ========================
Helper
======================== */
@media screen and (max-width: 768px) {
    .only-pc {
        display: none;
    }
}

@media screen and (min-width: 769px) {
    .only-sp {
        display: none;
    }
}

.clear-fix {
    clear: both;
}

.marker {
    --_marker-color: color-mix(in srgb, var(--primary) 30%, transparent);
    background: linear-gradient(
        to top,
        transparent 10%,
        var(--_marker-color) 10%,
        var(--_marker-color) 45%,
        transparent 45%
    );
}

.white-line {
    background-image: -webkit-linear-gradient(bottom, #fff 7px, transparent 7px);
    background-image: linear-gradient(to top, #fff 7px, transparent 7px);
}

.primary {
    color: var(--primary);
}
.secondary {
    color: var(--secondary);
}
.yellow {
    color: #fff48f;
}
.white {
    color: var(--white);
}

.accent {
    color: var(--accent);
}

.bold {
    font-weight: bold;
}
.black {
    font-weight: 900;
}
.red {
    color: var(--red);
}
