@charset "UTF-8";

/* ヘッダー hover（ロゴ除く） */

/* テキストリンク：左から右へ下線 */
.header-wrap .header-search__btn,
.header-wrap .header-nav__link {
    position: relative;
}

    .header-wrap .header-search__btn::after,
    .header-wrap .header-nav__link::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: -4px;
        width: 100%;
        height: 2px;
        background-color: #EB690B;
        transform: scaleX(0);
        transform-origin: left center;
        transition: transform 0.3s ease;
    }

    .header-wrap .header-search__btn:hover::after,
    .header-wrap .header-nav__link:hover::after {
        transform: scaleX(1);
    }

/* 色付きボタン：反転 */
.header-wrap .header-contact__btn,
.header-wrap .header-pulldown__link {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

    .header-wrap .header-contact__btn:hover {
        background-color: #fff;
        border-color: #EB690B;
        color: #EB690B;
    }

    .header-wrap .header-pulldown__link:hover {
        background-color: #EB690B;
        color: #fff;
    }

        .header-wrap .header-pulldown__link:hover svg {
            color: #fff;
        }

/* MV検索 hover（反転） */

.mv-search__tab {
    transition: background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease, opacity 0.3s ease;
}

    .mv-search__tab:hover {
        opacity: 1;
    }

    .mv-search__tab--buy:not(.is-active):hover {
        background-color: #FF902F;
        color: #fff;
    }

    .mv-search__tab--rent:not(.is-active):hover {
        background-color: #FAD43C;
        color: #fff;
    }

    .mv-search__tab--buy.is-active:hover {
        background-color: #fff;
        color: #FF902F;
        box-shadow: inset 0 0 0 2px #FF902F;
    }

    .mv-search__tab--rent.is-active:hover {
        background-color: #fff;
        color: #FAD43C;
        box-shadow: inset 0 0 0 2px #FAD43C;
    }

.mv-search__submit {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, opacity 0.3s ease;
}

    .mv-search__submit:hover {
        background-color: #fff;
        border-color: #5F4A30;
        color: #5F4A30;
        opacity: 1;
    }

.mv-search__filter-btn {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, opacity 0.3s ease;
}

    .mv-search__filter-btn:hover {
        background-color: #fff;
        border-color: #FF902F;
        color: #FF902F;
        opacity: 1;
    }

        .mv-search__filter-btn:hover svg {
            color: #FF902F;
        }

    .mv-search__panel--rent .mv-search__filter-btn:hover {
        border-color: #FAD43C;
        color: #FAD43C;
    }

        .mv-search__panel--rent .mv-search__filter-btn:hover svg {
            color: #FAD43C;
        }

.section__btn--service {
    transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}

    .section__btn--service:hover {
        background-color: #fff;
        color: #EB690B;
        opacity: 1;
        box-shadow: inset 0 0 0 2px #EB690B, 0 2px 6px rgba(0, 0, 0, 0.14);
    }

        .section__btn--service:hover svg {
            color: #EB690B;
        }

.condition__item {
    transition: opacity 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
}

    .condition__item:hover {
        opacity: 1;
        transform: translateY(-4px);
        box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12);
    }

.section__btn--news {
    transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}

    .section__btn--news:hover {
        background-color: #3E2C16;
        color: #fff;
        opacity: 1;
    }

        .section__btn--news:hover svg {
            color: #fff;
        }

.bkn-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .bkn-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12);
    }

.voice-card {
    transition: transform 0.3s ease;
}

    .voice-card::before {
        transition: box-shadow 0.3s ease;
    }

    .voice-card:hover {
        transform: translateY(-4px);
    }
        .voice-card:hover {
            opacity: 1;
        }

        .voice-card:hover::before {
            box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12);
        }
    .bkn-card__link:hover {
        opacity: 1;
    }

.section__btn--listings,
.section__btn--voice,
.section__btn--blog,
.bkn-card__member-btn {
    transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}

    .section__btn--listings:hover,
    .section__btn--voice:hover,
    .section__btn--blog:hover {
        background-color: #3E2C16;
        color: #fff;
        opacity: 1;
    }

        .section__btn--listings:hover svg,
        .section__btn--voice:hover svg,
        .section__btn--blog:hover svg {
            color: #fff;
        }

    .bkn-card__member-btn:hover {
        background-color: #fff;
        color: #EB690B;
        opacity: 1;
        box-shadow: inset 0 0 0 2px #EB690B;
    }

        .bkn-card__member-btn:hover svg {
            color: #EB690B;
        }

.bkn__fav-bt {
    transition: opacity 0.3s ease;
}

    .bkn__fav-bt:hover {
        opacity: 0.85;
    }

.listings__prev,
.listings__next,
.voice__prev,
.voice__next {
    transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}

    .listings__prev:hover,
    .listings__next:hover,
    .voice__prev:hover,
    .voice__next:hover {
        background-color: #3E2C16;
        color: #fff;
        opacity: 1;
    }

        .listings__prev:hover svg,
        .listings__next:hover svg,
        .voice__prev:hover svg,
        .voice__next:hover svg {
            color: #fff;
        }

.member__btn {
    transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}

    .member__btn:hover {
        background-color: #fff;
        opacity: 1;
    }

        .member__btn:hover .member__btn-icn {
            color: inherit;
        }

    .member__btn--regist:hover {
        color: #FFAF1C;
        box-shadow: inset 0 0 0 2px #FFAF1C;
    }

        .member__btn--regist:hover .member__btn-arw {
            background-color: #FFAF1C;
            color: #fff;
        }

    .member__btn--login:hover {
        color: #FAD43C;
        box-shadow: inset 0 0 0 2px #FAD43C;
    }

        .member__btn--login:hover .member__btn-arw {
            background-color: #FAD43C;
            color: #fff;
        }

.cta__btn {
    transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}

    .cta__btn:hover {
        background-color: #fff;
        opacity: 1;
    }

        .cta__btn:hover .cta__btn-icn {
            color: inherit;
        }

    .cta__btn--member:hover {
        color: #FFAF1C;
        box-shadow: inset 0 0 0 2px #FFAF1C;
    }

        .cta__btn--member:hover .cta__btn-arw {
            background-color: #FFAF1C;
            color: #fff;
        }

    .cta__btn--contact:hover {
        color: #EB690B;
        box-shadow: inset 0 0 0 2px #EB690B;
    }

        .cta__btn--contact:hover .cta__btn-arw {
            background-color: #EB690B;
            color: #fff;
        }

.worries__btn {
    transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}

    .worries__btn:hover {
        background-color: #FF8020;
        color: #fff;
        opacity: 1;
    }

        .worries__btn:hover .worries__btn-arw {
            color: #fff;
        }

.results__tab {
    transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}

    .results__tab:hover {
        opacity: 1;
    }

    .results__tab:not(.is-active):hover {
        background-color: #EB690B;
        color: #fff;
    }

.result-card__link {
    transition: opacity 0.3s ease;
}

    .result-card__link:hover {
        opacity: 1;
    }

.results__prev,
.results__next,
.section__btn--results {
    transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}

    .results__prev:hover,
    .results__next:hover,
    .section__btn--results:hover {
        background-color: #3E2C16;
        color: #fff;
        opacity: 1;
    }

        .results__prev:hover svg,
        .results__next:hover svg,
        .section__btn--results:hover svg {
            color: #fff;
        }

.tiktok__link,
.instagram__link {
    transition: opacity 0.3s ease;
}

    .tiktok__link:hover,
    .instagram__link:hover {
        opacity: 1;
    }

.blog-card:hover {
    opacity: 1;
}
.blog-card:hover .blog-card__img {
    transform: scale(1.05);
}

.result-card__link:hover .result-card__img {
    transform: scale(1.05);
}

.contact__btn {
    transition: background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease, opacity 0.3s ease;
}

    .contact__btn:hover {
        background-color: #fff;
        opacity: 1;
    }

        .contact__btn:hover svg {
            color: inherit;
        }

    .contact__btn--mail:hover {
        color: #EB690B;
        box-shadow: inset 0 0 0 2px #EB690B;
    }

    .contact__btn--line:hover {
        color: #06C755;
        box-shadow: inset 0 0 0 2px #06C755;
    }

    .contact__btn--reserve:hover {
        color: #FFAF1C;
        box-shadow: inset 0 0 0 2px #FFAF1C;
    }

    .contact__btn--after:hover {
        color: #3E2C16;
        box-shadow: inset 0 0 0 2px #3E2C16;
    }

.l-footer [class*="site-footer__btn--"] {
    transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}

    .l-footer [class*="site-footer__btn--"]:hover span {
        color: #fff;
    }

    .l-footer [class*="site-footer__btn--"]:hover {
        background-color: #3E2C16;
        opacity: 1;
    }

        .l-footer [class*="site-footer__btn--"]:hover .site-footer__btn-icn,
        .l-footer [class*="site-footer__btn--"]:hover .site-footer__btn-icn use,
        .l-footer [class*="site-footer__btn--"]:hover .site-footer__btn-arw,
        .l-footer [class*="site-footer__btn--"]:hover .site-footer__btn-arw use {
            fill: #fff;
            color: #fff;
        }

        .l-footer [class*="site-footer__btn--"]:hover .site-footer__btn-arw,
        .l-footer [class*="site-footer__btn--"]:hover .site-footer__btn-arw use {
            fill: none;
        }

        .l-footer .site-footer__btn--after:hover .site-footer__btn-arw,
        .l-footer .site-footer__btn--after:hover .site-footer__btn-arw use {
            stroke: #fff;
        }

.l-footer .site-footer__link::after {
    content: "";
    position: absolute;
    left: 22px;
    bottom: -4px;
    width: calc(100% - 22px);
    height: 2px;
    background-color: #fff;
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.3s ease;
}

    .l-footer .site-footer__link:hover {
        opacity: 1;
    }

    .l-footer .site-footer__link:hover::after {
        transform: scaleX(1);
    }

.sidenav__item {
    transition: box-shadow 0.3s ease, opacity 0.3s ease;
}

    .sidenav__item:hover {
        opacity: 1;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.14);
    }
