:root{ --main_color:#528384; --swal2-confirm-button-background-color:#333 !important }
:root{ --swiper-theme-color:#444 }
.prodtype{ margin:calc(2vw + 3rem) auto 3rem auto; background:#f7f7f7; padding:1.4vw 2vw; box-sizing:border-box; border-radius:6px; position:relative; z-index:20 }
@media(max-width:768px){ .prodtype{padding:3.5vw; margin:4vw auto 4.6vw auto; border:1px solid #ddd }
}
.prodtype .hhh{ font-size:1.8rem; font-weight:bold; color:#444 }
.albumlist{ display:grid; grid-template-columns:1fr 1fr 1fr 1fr; grid-column-gap:7rem; grid-row-gap:3rem; margin:0 auto 3rem auto }
@media(max-width:1240px){ .albumlist{grid-template-columns:1fr 1fr 1fr; grid-column-gap:3vw; grid-row-gap:3vw; margin:0 auto 2.5rem auto }
}
@media(max-width:768px){ .albumlist{grid-template-columns:1fr 1fr; grid-column-gap:1rem; grid-row-gap:1.6rem; margin:0 auto 2.5rem auto }
}
.albumlist>.li{ min-width:0; position:relative; background:#fff }
.albumlist>.li .fm{ position:relative; overflow:hidden; background:#eee; transition-property:all; transition-duration:1s; transition-timing-function:"ease"; box-shadow:1px 1px 0px #e6e6e6,2px 2px 0px #e6e6e6,3px 3px 0px #e6e6e6,4px 4px 0px rgba(0,0,0,.3) }
.albumlist>.li .fm img{ width:100%; object-fit:contain }
.albumlist>.li .info{ padding:.9rem 0 .4rem 0; border-bottom:2px solid rgba(0,0,0,0) }
.albumlist>.li .info .title{ font-size:1.2rem; text-decoration:none; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical }
.albumlist>.li .info .title a{ color:#0e1a3b; word-break:break-word }
@media(max-width:990px){ .albumlist>.li .info .title{font-size:1.1rem }
}
.albumlist>.li .info .size{ font-size:1.1rem; color:#999; margin:.3rem 0 0 0 }
.albumlist>.li .colors{ display:flex; gap:.6rem; margin:.8rem 0 0 0; flex-wrap:wrap }
.albumlist>.li .colors .li a{ display:flex; border-radius:5px; border:1px solid #ddd }
.albumlist>.li .colors .li a:hover{ border-color:#555 }
.albumlist>.li .colors .li a img{ margin:2px; border-radius:5px; box-sizing:border-box; width:1.5rem; height:1.5rem; object-fit:cover }
.prodpage{ margin:0 0 3rem 0 }
.prodpage .link{ display:flex; justify-content:center; margin:0 0 1rem 0; gap:.7rem }
.prodpage .link a{ height:2.4rem; line-height:2.5rem; aspect-ratio:1/1; text-align:center; border:1px solid #ddd; border-radius:5px; font-size:1.1rem; color:#444 }
.prodpage .link a:hover{ background:#20b2aa; border:1px solid #20b2aa; color:#fff }
.prodpage .link a.selected{ background:#20b2aa; border:1px solid #20b2aa; color:#fff }
.prodpage .total{ text-align:center; color:#999 }