@charset "UTF-8";
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.align_h { 
	display:-webkit-box; display:-moz-box; display:-ms-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:-ms-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap; width: 100%; 
}
.clear { clear:both; }
.clearfix:after { content: "."; display: block; height: 0px; clear: both; visibility: hidden; font-size:0px; line-height: 0; }  
.clearfix { display: inline-block; }
.flex{ display: flex;}
.wrap { width: 100%; height: 500px; position: relative;}
.wrap img { width: 500; height: 500; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto;
}
html{ word-break : break-all; }
img{ -webkit-backface-visibility: hidden; backface-visibility: hidden; }
body { width:100%; text-align:center; color:#796060; font-size:12px; font-family:"Gelasio", serif; line-height: 1.4; padding-top: 50px; min-height: 100vh; padding-bottom: 20px; }

a { color: #796060; letter-spacing:0.15em;}
a:hover{color: #796060;}

header{ position: absolute; top: 0; left: 0; margin: 10px 0; width: 100%;}
	header section{ font-size:20px; margin:auto; width:100%; max-width: 980px; padding: 0 10px; justify-content:space-between;}

footer{ position: fixed; bottom: 0px; left: 0; width: 100%; text-align: center; background: rgba(255,255,255,0.9); line-height: 30px;}



@media screen and (min-width: 769px) {
	header section{ font-size:16px;}
}


@media only screen and (min-width: 641px) and (max-width: 960px) {
	header section{ font-size:12px;}
}

/* スマートフォン用 */
@media screen and (max-width: 640px) {
	header section{ font-size:10px;}
}
@media screen and (max-width: 640px)　{
img {
width: 100% ;}
}