@charset "utf-8";

/* index */
.swiper-button-prev,.swiper-button-next{
    color: lightgray;
    display: none;
}
.swiper-pagination-bullet-active{
    background-color: lightgray;
    display: none;
}
.swiper-wrapper{
    position: relative;
    z-index: -10;
}
.top-back-img{
    position: absolute;
    width: 100%;
    height: 844px;
    object-fit: cover;
    opacity: .3;
    z-index: 10;
}
.img-fit{
    position: absolute;
    width: 100%;
    height: 844px;
    object-fit: cover;
    z-index: -10;
    opacity: 1;
}
.top-img-p{
    position: absolute;
    top: 79%;
    left: 25px;
    font-size: 15px;
    font-weight: bold;
    color: #fff;
    z-index: 30;
}
.top-img-p-day{
    position: absolute;
    top: 80.8%;
    left: 25px;
    font-size: 40px;
    font-weight: 100;
    color: #fff;
    z-index: 30;
}
.top-img-p-date{
    position: absolute;
    top: 84%;
    left: 155px;
    font-size: 18px;
    color: #fff;
    z-index: 30;
}
.top-img-p-place{
    position: absolute;
    top: 90%;
    left: 25px;
    font-size: 15px;
    color: #fff;
    z-index: 30;
}
@media(max-width: 415px){
    .img-fit{
        object-fit: none;
        object-position: 51% 0%;
        height: 800px;
        width: 100%;
    }
    .top-back-img{
        object-fit: cover;
        object-position: 72% 40%;
        height: 800px;
        width: 100%;
    }
    .top-img-p{
        position: absolute;
        top: 70%;
        left: 25px;
        font-size: 15px;
        font-weight: bold;
        color: #fff;
    }
    .top-img-p-day{
        position: absolute;
        top: 75%;
        left: 23px;
        font-size: 35px;
        font-weight: 100;
        color: #fff;
    }
    .top-img-p-date{
        position: absolute;
        top: 76%;
        left: 140px;
        font-size: 15px;
        color: #fff;
    }
    .top-img-p-place{
        position: absolute;
        top: 81%;
        left: 25px;
        font-size: 15px;
        color: #fff;
    }
}