@charset "utf-8";

* {
	margin: 0;
	padding: 0;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 13.5pt;
}

body {
	background-image: url(../images/alotus.png);
	background-size: auto;
}

#wrap {
	position: relative;
	margin: 0 auto;
	border: thin solid;
	overflow: auto;
	z-index:4;
}
#logo{
	position:absolute;
	left:50%;
	margin-left:-140px;
	top:10%;
	font-size:32pt;
	font-style:italic;
	color:yellow;
	text-shadow:#F63 2pt 2pt 4pt;
	text-outline:#039;
	}
#header {
	position: sticky;
	top: 34px ;
	background-image: url(../images/top-page.jpg);
	background-size:cover;
	background-position: 55% 45%;
	background-repeat:repeat-x;
	z-index:-1;
}

#navi {
	position: sticky;
	top: 0px;
	background-color: #FFE7CE;
	height: 30px;
	border-bottom: 5px solid blue;
	opacity: .98;
	z-index:4;
}
#navi ul {
	position:absolute;
	width:480px;
	left:50%;
	margin-left:-240px;
	list-style: none;
	display: block;
}
#navi li{
	height:30px;
	border-bottom:5px solid blue;
	width: 120px;
	text-align: center;
	background-color: #FFE7CE;
	float: left;
	line-height: 30px;
	}

#burger {
	float: right;
	width: 30px;
	height: 30px;
	margin-right: 18px;
	background-color: #F60;
	background-image: url(../images/humberg.png);
	background-size: cover;
	display: none;
}



#contents {
	max-width:960px;
	margin: 0 auto;
	background-color: #FFFFE8;
	height: auto;
	padding: 1em;
	line-height: 1.5;
	z-index:4;
}

#toppic {
	background-image: url(../images/sanzeninsanzon.jpg);
	background-size: cover;
	background-repeat:no-repeat;
	background-position: center;
	height: 700px;
	margin: 0 auto
}

#tpr {
	margin: 0 auto;
}

#event {
	background-color: #ffcce6;
	
	height: auto;
}
#doc {
	background-color: #ffffcc;
	height: auto;
}

#contact {
	position:relative;
	background-color: #ffaf7f;
	height: auto;
}

#footer {
	background-color: #e36;
	height: 200px;
	text-align:center;
}
.shrink{white-space:nowrap; letter-spacing:-.5pt}
@media(max-width:820px) {

#navi,  #header {
	max-width: 820px;
}

#navi ul {
	display: block;
}
.shrink{letter-spacing:normal}


#contents {
	max-width: 720px;
}

#toppic {
	height: 332px;
}
}
@media(max-width:520px) {


#navi,#header {
	width: 414px;
	margin:0 auto;
}

#navi ul {
	width: 122px;
	margin-left:-188px;
	top:34.5px;
	display: none;
}

#contents {
	width: 376px;
}

#navi li {
	clear: both;
	border-bottom: 5px solid blue;
	border-left: thin solid;
	border-right: thin solid;
	font-size:12pt;
}

#burger {
	display: block
}
}

.link {
	cursor: pointer
}