.mv__sub {
    margin-bottom: 100px;
}

.work01 {
    margin-bottom: 200px;
}

.work__group {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.work01__button-box {
    margin-bottom: 100px;
    display: flex;
    justify-content: center;
    column-gap: 30px;

    cursor: pointer;
}

/* ボタン切り替え */
.work01__button .is-active {
    background: #333;
    color: #fff;
}

.item {
    opacity: 1;
    transform: translateY(0);
    transition:
        opacity 0.7s ease,
        transform 0.7s ease;
}

.item.is-hidden {
    opacity: 0;
    transform: translateY(8px);
    pointer-events: none;
    height: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.work01__button {
    display: inline-block;
    padding: 15px 35px;
    border: 1px solid #6B5E52;
    border-radius: 60px;
    text-transform: capitalize;
}

.work__box {
    width: 48%;
    position: relative;
    display: flex;
    flex-direction: column;
    background-image: url(../image/work_bg.png);
    background-position: left;
    background-repeat: no-repeat;
    background-size: contain;
    aspect-ratio: 615 / 736;
    margin-bottom: 40px;
}

.work__box::before {
    content: "";
    display: block;
    position: absolute;
    background-image: url(../image/work_grey.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 65%;
    height: 40.8%;
    top: 15%;
    left: 17.5%;
    z-index: 1;
}

.work__pc {
    width: 59.3%;
    z-index: 10;
    position: absolute;
    left: 20.5%;
    top: 20.5%;
}

.work__text-sub span {
    font-size: clamp(0.75rem, -0.464rem + 1.9vw, 1.25rem);
}

.work__text-title {
    font-size: clamp(0.875rem, -0.946rem + 2.86vw, 1.625rem);
}

.stamp__text {
    width: 61.7%;
    margin-left: 19%;
    position: absolute;
    top: 60%;
    left: 0%;
}

.stamp__group {
    position: relative;
}

.stamp__title::before {
    position: absolute;
    content: "";
    display: block;
    background-image: url(../image/stamp.svg);
    background-position: left;
    background-repeat: no-repeat;
    background-size: contain;
    aspect-ratio: 105 / 36;
    width: 100%;
}

.stamp__span {
    position: absolute;
    top: 4px;
    left: 10px;
}

.stamp__title {
    position: relative;
    font-size: 16px;
    font-weight: 900;
    font-family: "Zen Old Mincho", serif;
    color: #A61C2F;
    width: 115px;
    height: 36px;
}

.stamp__group {
    display: flex;
    align-items: center;
    padding-bottom: 11%;
}

.stamp__sub {
    font-size: clamp(0.625rem, -0.589rem + 1.9vw, 1.125rem);
    font-family: "Roboto", sans-serif;
    color: #484543;
    opacity: 0.6;
    text-transform: none;
}

.work__text-box {
    display: flex;
    flex-direction: column;
    row-gap: 10px;
}

.work__text-sub,
.work__text-title {
    border-bottom: 1px dashed #D9D9D9;
    padding-bottom: 5px;
}

.work__text-sub span,
.work__text-title span {
    margin-left: 18px;
}

.work__banner {
    width: 44.5%;
    z-index: 10;
    position: absolute;
    left: 28%;
    top: 20%;
}

.work__banner01 {
    width: 40.3%;
    z-index: 10;
    position: absolute;
    left: 30%;
    top: 19%;
}

.stamp__title02 {
    position: relative;
    width: 72px;
    height: 36px;
    font-size: 16px;
    font-weight: 900;
    font-family: "Zen Old Mincho", serif;
    color: #A61C2F;
    margin-right: 5px;
}

.stamp__title02::before {
    position: absolute;
    content: "";
    display: block;
    background-image: url(../image/stamp_02.svg);
    background-position: left;
    background-repeat: no-repeat;
    background-size: contain;
    aspect-ratio: 72 / 36;
    width: 100%;
}


/* タブレット */
@media (max-width: 1020px) {
    .work01__button {
        font-size: 16px;
    }

    .work__text-title {
        font-size: 18px;
    }

    .work__text-sub span {
        font-size: 16px;
    }

    .work__box {
        width: 48.7%;
    }

    .stamp__text {
        width: 73.7%;
        margin-left: 13%;
    }

    .stamp__span {
        top: 3px;
        left: 6px;
        font-size: 14px;
    }

    .stamp__title::before {
        aspect-ratio: 88 / 28;
        width: 123%;
    }

    .stamp__title {
        font-size: 14px;
        width: 83px;
    }

    .stamp__group {
        column-gap: 10px;
        padding-bottom: 4%;
    }

    .stamp__sub {
        font-size: 13px;
    }

    .work__text-box {
        row-gap: 5px;
    }

    .work__text-sub span,
    .work__text-title span {
        margin-left: 5px;
    }

    .work__text-title {
        font-size: clamp(0.813rem, -0.14rem + 1.98vw, 1.125rem);
    }

    .work__text-sub span {
        font-size: clamp(0.75rem, 0.56rem + 0.4vw, 0.813rem);
    }

    .stamp__title02 {
        width: 58px;
        height: 28px;
        margin-right: 0;
    }

    .mv__sub {
        margin-bottom: 70px;
    }

    .work01__button-box {
        margin-bottom: 60px;
    }

    .work01 {
        margin-bottom: 100px;
    }

    .work__box {
        margin-bottom: 25px;
    }
}

/* スマホ */
@media (max-width: 768px) {
    .work01__button {
        padding: 3% 8%;
    }

    .work01__button {
        font-size: 14px;
    }

    .work01__button-box {
        column-gap: 1%;
        justify-content: space-between;
        max-width: 348px;
        margin: 0 auto 60px;
    }

    .work__group {
        flex-direction: column;
        row-gap: 0;
    }

    .work__box {
        width: 100%;
        margin-bottom: 30px;
    }

    .work__text-title {
        font-size: clamp(0.875rem, 0.696rem + 0.89vw, 1.125rem);
    }

    .work01 {
        margin-bottom: 70px;
    }

    .stamp__title02 {
        width: 60px;
    }

    .stamp__title::before {
        aspect-ratio: 80 / 28;
        width: 110%;
    }
}