#spincontaints{
  width:100%;
  height:800px;
  background-color: #fff;
  
   display: flex;
  flex-direction: row;
  overflow: hidden;
  
}
@media(max-width:768px){
  #spincontaints{
    flex-direction: column;
  }
  #spincontaints .threesixty,
  #spincontaints .threesixty * {
    height: 100%;
    width: auto;
  }
}
#itmselect{
  display: flex;
  height:100%;
  flex-direction:column;
  flex-wrap: wrap;
  
}
#itmselect li{
  width:200px;
  /*height:100px;*/
  border: 1px solid #ccc;
  list-style: none;
  cursor:pointer;
  position: relative;
}
/*20210728追加*/
#itmselect li a{
color: #333333;
}

.listimg{
 display: block;
}
.listimg img{
width:200px;
 vertical-align: bottom; /*20210728追加*/
}
.listtxt{
  display: block;
  text-align: center;
  font-weight: bold;
  width: 100%;
}

.threesixty .spinner{
  display:none;
}
.threesixty{
  cursor:ew-resize;
  height:800px;
}
.threesixty_images{
  position: relative;
}

#zoomctl{
  margin: 50px;
}

.icon {
  position: relative;
  width: 40px;
  height: 40px;
  background: #ccc;
  border-radius: 50%;
  display: inline-block;
  margin-left: 5px;

  
}
.active{
  background: #666;
}

.active:hover{
  background: #ccc;
}

.icon::before, .icon_plus::after {
  position: absolute;
  top: 18px;
  left: 50%;
  content: '';
  display: inline-block;
  width: 26px;
  height: 26px;
  border-top: 4px solid #fff;
  transform: translateX(-50%);
 
}

.icon_plus:after {
  top: 6px;
  left: -6px;
  transform: rotate(90deg);
}
.zoom{
  //transform: scale(2, 2) translate(0px, -250px);
}