@charset "utf-8";
/* CSS Document */

#slider1{display:block; }
#slider2{display:none; }


/*jSliderAnimation*/
.jSlider.pc >.pc-slide-item{position: relative!important;}
.jSlider.pc >div a{display: block; position: absolute; right: 3%;  background: transparent; padding: 0 0 0 40px;}
.jSlider.pc >div a img{ width:230px; max-width:100%; }
.jSlider.pc >div a:hover{ background: transparent; transform:scale(1.2); }
.jSlider.mob >div a{display: block; position: absolute; bottom: 0px; left: 0;  background: transparent; padding: 0 0 0 40px; width: 160px;}
.jSlider.mob >div a:hover{ background: transparent; }
.jSlider.pc >div a.fade-left, .jSlider.mob >div a.mob-fade-left{opacity: 0; /* 預設隱藏 */}
.fade-left.active , .mob-fade-left.active { animation: fadeLeft .8s ease forwards; animation-delay: .8s; }
@keyframes fadeLeft{
    0% { opacity: 0; bottom:0px; }
  100% { opacity: 1; bottom:50px; }
}


@media(max-width:1200px){
	.jSlider.pc >div a img{ width:150px;  }
	@keyframes fadeLeft{
		    0% { opacity: 0; bottom:0px; }
		  100% { opacity: 1; bottom:30px; }
		}
}


@media (max-width: 767px) {
	#slider1{display:none;}
	#slider2{display:block;}
	@keyframes fadeLeft{
		    0% { opacity: 0; bottom:0; }
		  100% { opacity: 1; bottom:40px; }
		}
}