.js-blur,
.js-blur-250ms,
.js-blur-500ms {
    filter: blur(10px);
}

.js-blur.animated,
.js-blur-250ms.animated,
.js-blur-500ms.animated {
    animation: blur 0.8s ease-in-out forwards;
}

.js-blur-250ms.animated {
    animation-delay: 250ms;
}

.js-blur-500ms.animated {
    animation-delay: 500ms;
}

.js-fade,
.js-fade-250ms,
.js-fade-500ms {
    filter: blur(10px);
    opacity: 0;
}

.js-fade.animated,
.js-fade-250ms.animated,
.js-fade-500ms.animated {
    animation: fadeIn 0.8s ease-in-out forwards;
}

.js-fade-250ms.animated {
    animation-delay: 250ms;
}

.js-fade-500ms.animated {
    animation-delay: 500ms;
}

@keyframes blur {
    0% {
        filter: blur(10px);
    }

    100% {
        filter: blur(0);
    }
}


@keyframes fadeIn {
    0% {
        filter: blur(10px);
        opacity: 0;
    }

    100% {
        filter: blur(0);
        opacity: 1;
    }
}

/* ヘッダーナビ
********************/
@media screen and (min-width: 767px) {
    .g-nav__item a:not([class]) {
        position: relative;
    }

    .g-nav__item a:not([class])::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        width: 0;
        height: 1px;
        background-color: #333;
        transition: width 0.3s ease;
    }

    .g-nav__item a:not([class]):hover::after {
        width: 100%;
    }
}


/* フッターナビ
********************/
@media screen and (min-width: 767px) {
    .footer-nav__item a:not([class]) {
        position: relative;
    }

    .footer-nav__item a:not([class])::after {
        content: '';
        position: absolute;
        bottom: -5px;
        left: 0;
        width: 0;
        height: 1px;
        background-color: #fff;
        transition: width 0.3s ease;
    }

    .footer-nav__item a:not([class]):hover::after {
        width: 100%;
    }
}

/* ボタン
********************/
@media screen and (min-width: 767px) {
    .g-nav__item>.btn-style,
    .access-data>dd .map-link,
    .price-body .more-btn__wrapper .more-btn,
    .reservation-btn__wrap>.reservation-btn,
    .access-data>dd .map-link::after,
    .price-body .more-btn__wrapper .more-btn::after,
    .reservation-btn__wrap>.reservation-btn::after {
        transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
    }

    .g-nav__item>.btn-style:hover,
    .access-data>dd .map-link:hover,
    .price-body .more-btn__wrapper .more-btn:hover {
        background-color: #333;
        color: #fff;
    }

    .access-data>dd .map-link:hover::after,
    .price-body .more-btn__wrapper .more-btn:hover::after {
        background-image: url(../images/common/tab_wh.svg);
    }

    .reservation-btn__wrap>.reservation-btn:hover {
        background-color: #fff;
        color: #333;
    }

    .reservation-btn__wrap>.reservation-btn:hover::after {
        background-image: url(../images/common/tab.svg);
    }
}