/* Basic sample */

body {
    overflow: hidden;
    background-color: beige;
}
	@media screen and (max-width: 922px) {
		body {
			overflow: visible;
		}
	}

	@media screen and (max-width: 922px) {
		#contents{
			width: 94vw !important;
			height: 100% !important;
		}
	}
.main_txt{
	text-shadow: 0 0 0 rgb(0,0,0,0);
}

.flipbook-viewport {
    overflow: hidden;
    width: 100%;
    height: 100%;
/*	padding-top: 80px;*/
}

.flipbook-viewport .container {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: auto;
}

.flipbook-viewport .flipbook {
    width: 922px;
    height: 600px;
    left: -461px;
    top: -300px;
}
	@media screen and (max-width: 922px) {
		.flipbook-viewport .flipbook {
			width: auto;
			height: auto;
			left: auto;
			top: auto;
		}
	}

.flipbook-viewport .page {
    width: 461px;
    height: 600px;
    background-color: white;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
	@media screen and (max-width: 922px) {
		.flipbook-viewport .page {
			width: auto;
			height: auto;
		}
	}

.flipbook .page {
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    -ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    -o-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
}

.flipbook-viewport .page img {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin: 0;
	
	visibility: hidden;
}
	@media screen and (max-width: 922px) {
		.flipbook-viewport .page img {
			visibility: visible;
		}
	}

.flipbook-viewport .shadow {
    -webkit-transition: -webkit-box-shadow 0.5s;
    -moz-transition: -moz-box-shadow 0.5s;
    -o-transition: -webkit-box-shadow 0.5s;
    -ms-transition: -ms-box-shadow 0.5s;
    -webkit-box-shadow: 0 0 20px #ccc;
    -moz-box-shadow: 0 0 20px #ccc;
    -o-box-shadow: 0 0 20px #ccc;
    -ms-box-shadow: 0 0 20px #ccc;
    box-shadow: 0 0 20px #ccc;
}

	@media screen and (max-width: 922px) {
		.flipbook-viewport {
			overflow: visible;
			width: 100%;
			height: 100%;
		}

		.flipbook-viewport .container {
			position: relative;
			top: auto;
			left: auto;
			margin: auto;
		}
		.flipbook div {
			background-size: 0%;
			background-repeat: no-repeat;
			background-position: 50% 50%;
			height: 100%;
		}
		.flipbook div img {
			width: 100%;
			max-width: 461px;
			margin: 0 auto;
		}
}



.main_txt ul li {
    text-decoration-color: gray;
    text-align: left;
    list-style: none;
	margin-bottom: 10px;
}


.main_txt ul a:visited{
    color: darkgray;
}

.main_txt ul a:hover {
    text-decoration: underline;
}

footer , footer p , footer a:link , footer a:visited {
    color: gray;
}
footer{
	padding-bottom: 70px;
	text-shadow: 0 0 0 rgb(0,0,0,0);
}
#icon{
	padding-bottom: 175px;
}

	@media screen and (max-width: 922px) {
		#pagetop {
			text-align:center;
			bottom: 0px;
			width:100%;
			right:0;
			position: fixed;
			z-index: 100;
		}
		#pagetop a {
			display:block;
			text-decoration:none;
			padding-top:15px;
			padding-bottom:15px;

			text-align:center;
			font-size:1.8rem;
			color:#ffffff;
			text-indent: 0px;
			overflow: hidden;
			width: auto !important;
			height: auto !important;
			background-color:rgba(0,0,0,0.3);
		}
		#pagetop a:before{
			content:"\f139";
			font-family: FontAwesome;
			display: inline-block;
			color:#ffffff;
			margin-right:6px;
		}
}