

/* header */
header{
	background:center no-repeat;
 	width:100%;
 	height:100vh;	
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}


.kowaura{
	width:100%;
	max-width:397px;
}

.logo{
	padding-top:15%;
	text-align:center;
	font-size:25px;
	line-height:35px;
	padding-bottom:20px;
}


/* recent */
.title{
	margin:30px auto 10px auto;
	display:block;
}
.recent{
	padding:10px;
	background:#0D1E3D;
}
.recent ul{
	margin:0px auto;
}

.recent li{
	margin:10px;
	width:280px;
}
.recent li a{
	font-size:14px;
	color:#fff;
}
.recent li a:hover > span{
	margin-top:-10px;
}
.recent div{
	display:block;
	height:157px;
	transition-duration:0.2s;
	background-size:100%;
	background-repeat:no-repeat;
	background-position:center;
}

.more{
	margin:5px auto;
	display:block;
	width:5em;
	font-size:14px;
}


/* info */
.info{
	margin:auto;
	padding:20px;
	max-width:800px;
}


/* bimg */
.bimg{
	background:url(../img/bimg.jpg) top center repeat-x;
	height:500px;
}


/* greeting */
.greeting{
	margin:20px auto 0px auto;
	padding:10px;
	background:#0D1E3D;
	color:#fff;
}
.greeting h1{
	font-size:22px;
	padding:5px 0px 10px 0px;
}
.greeting div{
	margin:15px auto;
	max-width:1000px;
	min-height:240px;
}
.greeting img{
	padding-right:15px;
	float:left;
	width:100%;
	max-width:350px;
}


.dg{
	min-height:200px;
}
.recent:after, dg ul:after{
	content:"";
	display:block;
	clear:both;
}





@media only screen and (max-width: 768px) {

.logo{
	padding-top:50%;
}

.dg li{
	width:240px;
}


.greeting img{
	display:block;
	margin:auto;
	padding:0px;
	float:none;
}

.greeting h1{
	padding:10px;
	text-align:center;
}



/* bimg */
.bimg{
	height:250px;
}

}
