/* モーダルCSS */
.modalArea-sanfuji,
.modalArea-fuji,
.modalArea-orin,
.modalArea-jonagold,
.modalArea-tsugaru,
.modalArea-kio,
.modalArea-toki,
.modalArea-shinanogold,
.modalArea-kinsei,
.modalArea-wasefuji,
.modalArea-kogyoku,
.modalArea-shinanosweet{
    display: none;
    position: fixed;
    z-index: 10; /*サイトによってここの数値は調整 */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.modalBg-sanfuji,
.modalBg-fuji,
.modalBg-orin,
.modalBg-jonagold,
.modalBg-tsugaru,
.modalBg-kio,
.modalBg-toki,
.modalBg-shinanogold,
.modalBg-kinsei,
.modalBg-wasefuji,
.modalBg-kogyoku,
.modalBg-shinanosweet{
    width: 100%;
    height: 100%;
    background-color: rgba(30,30,30,0.9);
}

.modalWrapper-sanfuji,
.modalWrapper-fuji,
.modalWrapper-orin,
.modalWrapper-jonagold,
.modalWrapper-tsugaru,
.modalWrapper-kio,
.modalWrapper-toki,
.modalWrapper-shinanogold,
.modalWrapper-kinsei,
.modalWrapper-wasefuji,
.modalWrapper-kogyoku,
.modalWrapper-shinanosweet {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background: linear-gradient(#ffffff,#ffd0c5);
}

@media (min-width: 992px) {
    .modalWrapper-sanfuji,
    .modalWrapper-fuji,
    .modalWrapper-orin,
    .modalWrapper-jonagold,
    .modalWrapper-tsugaru,
    .modalWrapper-kio,
    .modalWrapper-toki,
    .modalWrapper-shinanogold,
    .modalWrapper-kinsei,
    .modalWrapper-wasefuji,
    .modalWrapper-kogyoku,
    .modalWrapper-shinanosweet {
        width: 60%;
        max-width: 80vh;
    }
}

@media (max-width: 991px) {
    .modalWrapper-sanfuji,
    .modalWrapper-fuji,
    .modalWrapper-orin,
    .modalWrapper-jonagold,
    .modalWrapper-tsugaru,
    .modalWrapper-kio,
    .modalWrapper-toki,
    .modalWrapper-shinanogold,
    .modalWrapper-kinsei,
    .modalWrapper-wasefuji,
    .modalWrapper-kogyoku,
    .modalWrapper-shinanosweet {
        width: 90%;
    }
}

.closeModal-sanfuji,
.closeModal-fuji,
.closeModal-orin,
.closeModal-jonagold,
.closeModal-tsugaru,
.closeModal-kio,
.closeModal-toki,
.closeModal-shinanogold,
.closeModal-kinsei,
.closeModal-wasefuji,
.closeModal-kogyoku,
.closeModal-shinanosweet{
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    cursor: pointer;
}