@charset "UTF-8";

.ex_details{
    padding: 0.5em 0.5em 1em;
    summary{
        background: var(--subcolor);
        padding: 0.5em 1em;
        cursor: pointer;
        border-radius: 2em;
        margin-bottom: 0.5em;
    }
}

#shop{border-top: 1px solid #000;margin-top: 4em;}
.awardbox{
    .entry_list{
        justify-content: center;
        li{
            width: calc((100% - var(--gap) * 2) / 3);
        }
    }
}


.ex_info{
    display: flex;
    gap: 3em;
    padding: 2em 2em 1em;

    .ex_img{
        width: 40%;
        img{width: 100%;}
    }
    .ex_text{
        width: calc(100% - 40% - 3em);
    }
}

.ex_sakuhin_list{
    display: flex;
    flex-wrap: wrap;
    gap: 2em;

    li{
        width: calc((100% - 2em * 3) / 4);
        .entry_name{margin-top: 0;}
    }
}

.shop_btn{
    display: block;
    width: 85%;
    border: 2px solid #000;
    padding: 0.3em 0;
    margin: 0.5em auto;
    font-size: 18px;
    border-radius: 0.3em;
    text-align: center;
    transition: 0.3s;
    cursor: pointer;
    background: #fff;
    color: #000;

    &:hover{
        background: #000;
        color: #fff;
    }
    &.sold{
        background: #333;
        color: #fff;
        cursor: auto;
    }
}



.photo_list{
    display: flex;
    gap: 2em;
    flex-wrap: wrap;
    font-size: 90%;
    margin: 2em auto 0;
    li{
        width: calc((100% - 2em * 2) / 3);
        border: 3px solid transparent;
        transition: 0.3s;

        &:hover{
            border-color: var(--maincolor);
        }
    }
}



/*タブ切り替え用*/
.tabbtn_list{
    justify-content: center;
.tabbtn{
    cursor: pointer;
    font-size: 1.2rem;
    &.show{
        &:hover{background: #fff;color:var(--maincolor);}
    }
}}
.tabcontent{
    display: none;
    &.show{
        display: block;
    }
}


/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●
	▼　タブレット用css　▼
●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/

@media (max-width:1024px) {
    

}

/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●
	▼　スマホ用css　▼
●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/

@media (max-width: 600px) {

.ex_info{
    flex-direction: column;
    gap: 2em;
    .ex_img,.ex_text{
        width: 100%;
    }
}
.entry_list{
    --gap:0.5em;
    row-gap: 1.5em;
}
.awardbox{
    .entry_list{
        li{
            width: calc((100% - var(--gap)) / 2);
        }
    }
}


.lum-lightbox-inner{
    max-width: 95%;
    margin: 0 auto;
}
.photo_list{
    li{
        width: calc((100% - 2em) / 2);
        figure{
        aspect-ratio: 1/1;
        img{
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
    }
    }
}


.tabbtn_list{
    .tabbtn{
        width: calc((100% - 10px * 2) / 3);
    }
}




}


@media(max-width:450px){


}

@media (min-width: 2500px) {

}

/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●
    ▲　スマホ用css　▲
●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/