section,.wrap{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden;}
div.bg{ position: absolute; left: 0;top:0; width:100%;height: 100%; -webkit-transform: scale3d(1.2,1.2,1);}
section{ display: none; }
section.on{ display: block; }
section .wrap{opacity:0;}
section.pageOpen .wrap{opacity:1;}
.pageOpen div.bg{-webkit-animation: bigtosmall 2s ease both;}

#page1{ z-index: 100; }
#page1 div.bg{ background: url(../images/index.jpg) no-repeat; background-size: cover;}
div.slogan{ position: absolute; left: 50%; top: 50%; margin: -3.38rem 0 0 -2.55rem; width: 5.1rem; height: 6.76rem;}
#page2{ z-index: 90; background: url(../images/index.jpg) no-repeat; background-size: cover; }
ul.nav{ position: absolute; top: 3.2rem; left: 50%; width: 4.3rem; height: auto; -webkit-transform: translate(-50%, 0); font-size: .3rem;}
ul.nav li{ position: relative; margin-bottom: .5rem; width: 100%; background-color: rgba(255, 255, 255, 0.5); overflow: hidden;}
ul.nav li a{ position: relative; display: block; line-height: .8rem; text-align: center; color: #ffffff; background-color: #f6ab00; }
.code{ position: absolute; left: 50%; bottom: 1rem; margin-left: -1.8rem; width: 3.6rem; height: 3.6rem;}
.pageOpen .slogan{ -webkit-animation: scaleIn 1s 1s ease both; }
.pageOpen ul.nav li:first-child{ -webkit-animation: fadeInUp 1s ease both; }
.pageOpen ul.nav li:last-child{ -webkit-animation: fadeInUp 1s .5s ease both; }
.pageOpen .code{ -webkit-animation: fadeInUp 1s 1s ease both; }
@-webkit-keyframes scaleIn {
	0% {
		opacity: 0;
		-webkit-transform: scale3d(3, 3, 3);
		transform: scale3d(3, 3, 3);
	}

	100% {
		opacity: 1;
	}
}
@-webkit-keyframes bigtosmall {
	0% {
		-webkit-transform: scale3d(1.2, 1.2, 1);
	}
	100% {
		-webkit-transform: scale3d(1, 1, 1);
	}
}
@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}
