/* 在中大型螢幕 (大於 768px) 時，我們自行定義位移的百分比 */
@media (min-width: 768px) {
  /* 設定為 flex，讓裡面複製出的多張圖片能並排 */
  #carousel_Box .carousel-inner .carousel-item.active,
  #carousel_Box .carousel-inner .carousel-item-next,
  #carousel_Box .carousel-inner .carousel-item-prev {
	display: flex;
  }

  /* 
	 因為我們一次顯示 4 張圖 (col-md-3)，所以一張佔據 25% 
	 覆蓋 Bootstrap 原本預設的 100% 位移，改為 25%
  */
  #carousel_Box .carousel-inner .carousel-item-end.active,
  #carousel_Box .carousel-inner .carousel-item-next {
	transform: translateX(50%);
  }

  #carousel_Box .carousel-inner .carousel-item-start.active, 
  #carousel_Box .carousel-inner .carousel-item-prev {
	transform: translateX(-50%);
  }
}

#carousel_Box .carousel-inner .carousel-item-end,
#carousel_Box .carousel-inner .carousel-item-start { 
  transform: translateX(0);
}

/* 手機版 (小於 768px) 時，隱藏其他圖片，只保留真正的第一張圖片，保持原生 1 張圖輪播的特性 */
@media (max-width: 767px) {
  #carousel_Box .carousel-inner .carousel-item > div {
	display: none;
  }
  #carousel_Box .carousel-inner .carousel-item > div:first-child {
	display: block;
  }
}