@charset "utf-8";
/**
 * パーツ関連
 */


/**
 * 枠ありボタン
 */
.border-btn {
    display: inline-block;
    background-color: rgb(255, 255, 255);
    border: solid 2px rgb(29, 131, 189);
    font-weight: bold;
    padding: 8px 48px;
    color: rgba(0, 0, 0);
    transition: .1s;
    text-decoration: none;
}



/**
 * のぞき窓のやつ
 */
.peephole {
    height: 12em;
    background-color: #DDDDDD;
    background-attachment: scroll;
    background-size: auto 80vh;
    background-position: center 50%;
    background-repeat: no-repeat no-repeat;
}

.back_image1 {
    background-image: url(parallax.sp.jpg);
    background-size: cover;
}

@media screen and (min-width: 768px) {
    .peephole {
        height: 14em;
        background-size: 100% auto;
    }

    .back_image1 {
        background-image: url(parallax.pc.jpg);
    }
}

@media screen and (min-width: 1025px) {
    .peephole {
        height: 20em;
    }
}


/**
 * スクロール提示
 */
 .let_scroll {
    width: 120px;
    position: absolute;
    bottom: 5%;
    left: calc(50% - 50px);
    z-index: 1;
}

@media screen and (min-width: 950px) {
    .let_scroll {
        width: 200px;
        bottom: 15%;
        left: calc(50% - 100px);
    }
}

@media screen and (min-width: 1500px) {
    .let_scroll {
        width: 200px;
        bottom: 22%;
        left: calc(50% - 100px);
    }
}

.let_scroll .icon {
    width: 100%;
}

.fuwafuwa {
    animation: fuwafuwa 1s infinite linear alternate;
}

@keyframes fuwafuwa {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(5px);
    }

    100% {
        transform: translateY(0);
    }
}

nav {
    scroll-behavior: smooth;
}