* {
				margin: 0;
				padding: 0;
			}

			html,
			body {
				height: 100%;
			}

			.main {
				width: 100%;
				height: 100%;
				overflow: hidden;
				position: relative;
			}

			.main p {
				line-height: 100px;
			}

			.page1,
			.page2 {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				overflow-y: auto;
				-webkit-overflow-scrolling: touch;
				z-index: 1;
				background: #ccc;
			}

			.page2 {
				background: #666;
				z-index: 2;
				transition: 0.3s;
				transform: translateX(100%);
			}

			button {
				position: fixed;
				top: 20px;
				right: 20px;
				z-index: 99;
			}

			.main.on .page2 {
				transform: translateX(0);

			}