.ProjectMain{width:100%;height:100%;position:relative;background:#000000;}
.ProjectMain>div{width:50%;height:50%;position:absolute;}
.ProjectDetail1{top:0;left:0;background:url(../images/Project/Project_bg1.jpg) center center no-repeat;background-size:cover;opacity:0;transform:translateX(-30px) translateY(-30px);-webkit-transform:translateX(-30px) translateY(-30px);-moz-transform:translateX(-30px) translateY(-30px);}
.active .ProjectDetail1{transition:all 0.4s linear 0s;-webkit-transition:all 0.4s linear 0s;-moz-transition:all 0.4s linear 0s;opacity:1;transform:translateX(0px) translateY(0px);-webkit-transform:translateX(0px) translateY(0px);-moz-transform:translateX(0px) translateY(0px);}
.ProjectDetail2{top:0;left:50%;background:url(../images/Project/Project_bg2.jpg) center center no-repeat;background-size:cover;opacity:0;transform:translateX(30px) translateY(-30px);-webkit-transform:translateX(30px) translateY(-30px);-moz-transform:translateX(30px) translateY(-30px);}
.active .ProjectDetail2{transition:all 0.4s linear 0.3s;-webkit-transition:all 0.4s linear 0.3s;-moz-transition:all 0.4s linear 0.3s;opacity:1;transform:translateX(0px) translateY(0px);-webkit-transform:translateX(0px) translateY(0px);-moz-transform:translateX(0px) translateY(0px);}
.ProjectDetail3{top:50%;left:0;background:url(../images/Project/Project_bg3.jpg) center center no-repeat;background-size:cover;opacity:0;transform:translateX(-30px) translateY(30px);-webkit-transform:translateX(-30px) translateY(30px);-moz-transform:translateX(-30px) translateY(30px);}
.active .ProjectDetail3{transition:all 0.4s linear 0.6s;-webkit-transition:all 0.4s linear 0.6s;-moz-transition:all 0.4s linear 0.6s;opacity:1;transform:translateX(0px) translateY(0px);-webkit-transform:translateX(0px) translateY(0px);-moz-transform:translateX(0px) translateY(0px);}
.ProjectDetail4{top:50%;left:50%;background:url(../images/Project/Project_bg4.jpg) center center no-repeat;background-size:cover;opacity:0;transform:translateX(30px) translateY(30px);-webkit-transform:translateX(30px) translateY(30px);-moz-transform:translateX(30px) translateY(30px);}
.active .ProjectDetail4{transition:all 0.4s linear 0.9s;-webkit-transition:all 0.4s linear 0.9s;-moz-transition:all 0.4s linear 0.9s;opacity:1;transform:translateX(0px) translateY(0px);-webkit-transform:translateX(0px) translateY(0px);-moz-transform:translateX(0px) translateY(0px);}
.ProjectMain>div>a{display:block;width:100%;height:100%;}
.ProjectMain>div>a>img{width:8.4rem;display:block;position:absolute;top:50%;left:50%;margin-top:-8rem;margin-left:-4.2rem;opacity:0;transform:scale(1.2);-webkit-transform:scale(1.2);-moz-transform:scale(1.2);}
.ProjectMain.active>div>a>img{opacity:1;transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);transition:all 0.4s linear ;-webkit-transition:all 0.4s linear ;-moz-transition:all 0.4s linear ;}
.ProjectMain.active>.ProjectDetail1>a>img{transition-delay:0.8s;-webkit-transition-delay:0.8s;-moz-transition-delay:0.8s;}
.ProjectMain.active>.ProjectDetail2>a>img{transition-delay:1.1s;-webkit-transition-delay:1.1s;-moz-transition-delay:1.1s;}
.ProjectMain.active>.ProjectDetail3>a>img{transition-delay:1.4s;-webkit-transition-delay:1.4s;-moz-transition-delay:1.4s;}
.ProjectMain.active>.ProjectDetail4>a>img{transition-delay:1.7s;-webkit-transition-delay:1.7s;-moz-transition-delay:1.7s;}