
#main { background-color: antiquewhite;}

#baseInfo { font-size: 14px; line-height: 3;  
  margin-top: 20px;
}

.list {
  display: flex;
  flex-wrap: wrap;
}

.sku {
  display: flex;
  flex-wrap: wrap;
  
  margin: 10px;
  width: 200px;
}

.line {
  flex-basis: 100%;
  border-bottom: 1px solid #00000000;
}

.color {
  font-size: 12px;
}

.sku .imgBox {background-color: #fff;
  width: 50%;
  border: solid 1px #000;
  border-right: 0;
  text-align: center;
  font-weight: bold;
  box-sizing: border-box;
}

.sku .imgBox img {
  width: 100%;    display: block;
}

.sizeInfo {background-color: #fff;
  display: flex;
  width: 50%;
  flex-direction: column;
}
.sizeInfo input {border: none; width: 50%; text-align: center; font-weight: bold; font-size: 16px;}

.sizeInfo div {
  border: solid 1px #000;
  border-bottom: 0;
  flex: 1;
  display: flex;
  align-items: center;

}

.sizeInfo div:last-child {
  border-bottom: solid 1px #000;
}

.sizeInfo div .sizeBox {
  flex: 1;
  text-align: center;
  display: flex;
  height: 100%;
  justify-items: center;
  align-items: center;
}
.sizeInfo div .sizeBox  span{
  display: block;
  width: 100%;
  border: none !important;
 
}


.sizeInfo div span:first-child {
  border-right: solid 1px #000;
}

.itemSum {
  flex-basis: 100%;font-weight: bold;
text-align: center;  
}

.sku:has(.itemSumIs0){
  display: none;
}


.seriesTotal {
  display: flex;
  flex-direction: column-reverse;margin: 10px;
  font-weight: bold;
}

.total {
  background: #ff0000;
  color: #fff; font-size: 16px;
  line-height: 1.5;
  font-weight: bold;
  border-radius: 5px;
  display: inline-block; padding:0 5px; margin:0 3px 0 6px;
}

.checkboxList {
  display: flex;
  flex-wrap: wrap;
}
.checkboxList label {
  user-select: none;
  width: 250px; 
  display: flex;
  align-items: center; margin: 10px ;
  border: #e1dddd00 solid 2px;
  cursor: pointer;
}

.checkboxList label:hover {
  border: #e1dddd solid 2px; border-radius: 5px;
}
.checkboxList label img { display: inline-block;  width: 60px; height: 60px; margin-right: 5px;}

.checkboxList label:has(input[type="checkbox"]:checked) {
  border: #242323 solid 2px; border-radius: 5px;
}

.hiddenPrices .seriesTotal{
  display: none;
}
.hiddenPrices .tPrices{
  display: none;
}

#bigPic { position: absolute; width: 800px; height: 800px; top: 50%; left: 50%;   transform: translate(-50%,-50%); }

#bigPic img { width: 800px; height: 800px; border: solid 2px #000; border-radius: 10px;}
#bigPic .hidden { position: absolute; right: 10px; background-color: #fff;  top: 10px; font-size: 18px; cursor: pointer; border: solid 3px #000000; border-radius: 50%; padding: 10px; width: 30px; height: 30px; line-height: 30px; text-align: center;}