@keyframes trans {
	0%{transform: translate(10vw, 0); opacity: 0;}
	100%{transform: translate(0, 0); opacity: .8;}
}
@keyframes trans2 {
	0%{transform: translate(10vw, 0); opacity: 0;}
	100%{transform: translate(0, 0); opacity: 1;}
}
@media screen and (min-width: 600px) {
	.main-info-1{
		background-image: url("/OXYGNIS/image/products/magholder/product-main-black.jpg");
	}
	.main-info-2{
		background-image: url("/OXYGNIS/image/products/magholder/product-main-white.jpg");
	}
	#main-feature-2 > div:nth-child(1){
		background-image: url("/OXYGNIS/image/products/magholder/main-feature-3-1.jpg");
	}
	#main-feature-2 > div:nth-child(2){
		background-image: url("/OXYGNIS/image/products/magholder/main-feature-3-2.jpg");
	}
	#main-feature-2 > div:nth-child(3){
		background-image: url("/OXYGNIS/image/products/magholder/main-feature-3-3.jpg");
	}
	#main-feature-img > div > img:nth-child(1){
		width: 100vw;
		left: 0;
		top: 0;
	}
	#main-feature-img > div > img:nth-child(2){
		width: 3.3vw;
		transform: rotate(-15deg);
		left: 50.6vw;
		top: 20vw;
		transform-origin: -1vw center;
	}
	#main-feature-img > div > img:nth-child(3){
		transform: translate(0, 0) rotate(-15deg);
		width: 3vw;
		left: 53.3vw;
		top: 4.6vw;
	}
}



@media screen and (max-width: 600px) {
	.main-info-1::before{
		background-image: url("/OXYGNIS/image/products/magholder/product-main-black-mobile.jpg");
	}
	.main-info-2::before{
		background-image: url("/OXYGNIS/image/products/magholder/product-main-white-mobile.jpg");
	}
	#main-feature-2 > div:nth-child(1){
		background-image: url("/OXYGNIS/image/products/magholder/main-feature-3-1-mobile.jpg");
	}
	#main-feature-2 > div:nth-child(2){
		background-image: url("/OXYGNIS/image/products/magholder/main-feature-3-2-mobile.jpg");
	}
	#main-feature-2 > div:nth-child(3){
		background-image: url("/OXYGNIS/image/products/magholder/main-feature-3-3-mobile.jpg");
	}
	#main-feature-img > div > img:nth-child(1){
		height: 100vh;
		left: calc(50vw - 80vh);
		top: 0;
	}
	@keyframes img-2{
		0%{transform: rotate(-15deg);}
		25%{transform: rotate(-165deg);}
		50%{transform: rotate(-15deg);}
	}
	#main-feature-img > div > img:nth-child(2){
		width: 5.5vh;
		transform: rotate(-15deg);
		left: 50.6vw;
		top: 31.5vh;
		transform-origin: -1vh center;
		animation: img-2 10s infinite backwards;
	}
	@keyframes img-3{
		0%{transform: translate(20vw, -10vw) rotate(-15deg); opacity: 0;}
		50%{transform: translate(20vw, -10vw) rotate(-15deg); opacity: 0;}
		75%{transform: translate(0, 0) rotate(-15deg); opacity: 1;}
		100%{transform: translate(20vw, -10vw) rotate(-15deg); opacity: 0;}
	}
	#main-feature-img > div > img:nth-child(3){
		transform: translate(20vw, -10vw) rotate(-15deg);
		transform-origin: 0 0;
		width: 4.8vh;
		left: calc(50vw - 5vh);
		top: 7vh;
		animation: img-3 10s infinite backwards;
	}
}




