@charset "utf-8";
.p-index{
    padding: 1rem 0;
    background-image: url(../img/index/bg.png),url(../img/index/bg02.png);
    background-repeat: no-repeat,no-repeat;
    background-position: top right,bottom left;
    background-size: 2.5rem,2.6rem;
}
.p-index .c-inner{
    display: grid;
    gap: 1rem;
}
.p-index-btn{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: .5rem;
}
.p-index-btn a{
    width: min(100%,530px);
    height: 580px;
    display: flex;
    justify-content: end;
    align-items: end;
    border-radius: .8rem .15rem .15rem .15rem;
    position: relative;
    -webkit-box-shadow: 0 0 8px 2px rgba(0, 0, 0, .15);
    box-shadow: 0 0 8px 2px rgba(0, 0, 0, .15);
    padding: .2rem;
}
.p-index-btn a::before{
    content: '';
    background: rgba(0,0,0,.4);
    width: 100%;
    height: 100%;
    border-radius: .8rem .15rem .15rem .15rem;
    position: absolute;
    top: 0;
    left: 0;
}
.p-index-btn a.osaka{
    background: url(../img/index/pic.jpg) no-repeat center center / cover;
}
.p-index-btn a.tokyo{
    background: url(../img/index/pic02.jpg) no-repeat center center / cover;
}
.p-index-btn img{
    width: min(100%,380px);
    margin: 0;
    position: relative;
}
.p-info{
    background: url(../img/common/bg_grid.png),linear-gradient(90deg, #f9bece, #f3a7b9);
    padding: 1.5rem 0 2.5rem;
}
.p-info-btn{
    display: flex;
    flex-direction: column;
    gap: .5rem;
}
.p-info-btn a{
    width: min(100%,480px);
    height: 80px;
    margin: auto;
    background: #fff;
    border-radius: 9999px;
    color: #e73479;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    -webkit-box-shadow: 0 0 8px 2px rgba(0, 0, 0, .15);
    box-shadow: 0 0 8px 2px rgba(0, 0, 0, .15);
}
.p-info-btn a::after{
    content: '';
    width: 11px;
    height: 18px;
    clip-path: polygon(100% 50%, 0 0, 0 100%);
    background: #e83278;
    position: absolute;
    top: 0;
    bottom: 0;
    right: .3rem;
    margin: auto;
}
@media only screen and (max-width: 1024px) {
    .p-index-btn{
        flex-direction: column;
    }
}
@media only screen and (max-width: 430px) {
    .p-index-btn img{
        width: 3.8rem;
    }
    .p-index-btn a{
        height: 5.8rem;
    }
}