#sizeModalBtn{
position: fixed;
cursor: pointer;
    bottom: 200px;
    right: 2px;
    z-index: 1200;
}

#sizeModalBtn a{
display: block;
}

#sizeModalBtn img{
display: block;
}

#sizeModalOverlay{
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,.35);
z-index: 1200;


}

#sizeModal{
position: absolute;
top: 0;
right: -500px;
width: min(500px,90vw);
height: 100vh;
background: #fff;
overflow-y: hidden;
transition: right .3s ease;
box-sizing: border-box;
padding: 30px;
overscroll-behavior: contain;
}


.modalContent {
    height: 100%;
    overflow-y: auto;
    padding-bottom: 100px;
}


#sizeModalClose{
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    position: fixed;
    bottom: 200px;
    right: 2px;
    z-index: 10000;
    cursor: pointer;
}

#sizeModal h3{
margin: 0 0 20px;
font-size: 20px;
}

#sizeModal table{
width: 100% !important;
margin-bottom:20px;
}

#sizeModalOverlay.open #sizeModal{
right: 0;
}

#sizeModal td,
#sizeModal th{
    border:1px solid #ddd;
    padding:2px;
    font-size:13px;
}


@media screen and (max-width:768px){
#sizeModal{
    width: 95vw;
    padding: 20px 15px;
}

}


.modalTabs{
    display:flex;
    position:sticky;
    top:0;
    z-index:10;
    background:#fff;
    margin-bottom: 10px;
}

.modalTab{
    flex:1;
    border:none;
    background:#eee;
    padding:12px;
    cursor:pointer;
    margin-bottom: 5px;
}

.modalTab.active{
    background:#222;
    color:#fff;
}

.tabContent{
    display:none;
}

.tabContent.active{
    display:block;
    animation:modalSlideIn .25s ease;
}

@keyframes modalSlideIn{

    from{
        opacity:0;
        transform:translateX(20px);
    }

    to{
        opacity:1;
        transform:translateX(0);
    }

}

#descriptionContent {
    font-size: 13px;
    border: 1px solid #ddd;
    padding: 8px;
}



.detailInfo{
margin-top:20px;
}

.detailItem{
margin-bottom:15px;
border:1px solid #ddd;
padding:12px;
background:#fff;
}

.detailItem h4{
margin:0 0 8px;
padding-bottom:8px;
border-bottom:1px solid #ddd;
font-size:14px;
}

.modelInfo{
margin-top:20px;
border:1px solid #ddd;
padding:12px;
background:#fff;
font-size: 13px;
}

.modelInfo h4{
margin:0 0 8px;
padding-bottom:8px;
border-bottom:1px solid #ddd;
font-size:14px;
}


#sizeContent td[colspan="4"], #sizeContent td[colspan="3"] {
    text-align: left;
    padding: 10px;
}


.simpleSize {
    padding: 10px;
    border: 1px solid #ddd;
    text-align: center;
    font-size: 13px;
}

#modalCartArea input[type="image"],
#modalCartArea img {
    max-width: 140px; /* お好みの幅に調整してください */
    height: auto;
    display: inline-block;
    vertical-align: middle;
}

/* カートテーブルのスタイル調整（幅の固定など） */
#modalCartArea table.variation {
    width: 100%;
    table-layout: fixed;
}


.ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front {
    z-index: 1150 !important;
    }
