.book-container {
    perspective: 1000px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .book {
    width: 200px;
    height: 300px;
    position: relative;
    transform-style: preserve-3d;
    transition: transform 0.5s ease;
  }
  
  .book:hover {
    transform: rotateY(-30deg);
  }
  
  .cover, .back, .spine {
    position: absolute;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
  }
  
  .cover {
    background-color:color(srgb-linear 0.11 0.01 0.49 / 0.64); /* 책 표지 이미지 */
    transform: translateZ(10px);
  }
  
  .back {
    background-color: #ccc;
    transform: rotateY(180deg) translateZ(10px);
  }
  
  .spine {
    width: 20px;
    height: 100%;
    background: linear-gradient(to right, #bbb, #888);
    position: absolute;
    left: -10px;
    transform: rotateY(90deg) translateX(-1px);
  }
  .spine.right{left:initial;right:-10px}