* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
#base	{max-width:800px;margin:0 auto;}
#gmap	{
	position:absolute;top:0px;left:0;width:100%;height:200%;padding:50px calc(
	100vmax/6);
	background-color:rgba(0,0,0,0.8);text-align:center;visibility:hidden;}
#gmap a{color:white;}
#gmap a:hover{color:orange;}
#title	{width:100%;border:2px solid #adf159;}
#navi	{float:left;width:220px;padding:0 5px;}
#contents	{display:inline-block;max-width:580px;padding:15px 0;margin:0 auto;}
#footer{width:100%;background-color:#adf159;text-align:center;}


.blog		{display:inline-block;vertical-align:top;margin:20px 5px;padding:0 5px;font-size:0.95em;}
.clear	{clear:both;margin:0;}
.hide		{color:white;text-decoration:underline;cursor:hand; cursor:pointer;}
.link		{display:inline-block;width:180px;margin:5px;}
.left		{padding:0em;}
.nowrap{white-space:nowrap;}
.para	{background-color:#adf159;margin:1;padding:0 1em;}
.right	{text-align:right;}


a 		{text-decoration:underline;}
a:hover{color:red;}



hr		{color:#adf159;margin:0;}
li		{list-style-type:none;}
h4              {background-color:#adf159;}


@media screen and (min-width: 800px) {
   /* 表示領域が800px以上の場合に適用するスタイル */
}


@media screen and (max-width: 799px) {
   /* 表示領域が800px未満の場合に適用するスタイル */
#gmap	{
	position:absolute;top:-15%;left:0;width:100%;height:400%;padding:0;
	background-color:rgba(0,0,0,0.8);text-align:center;visibility:hidden;}
#navi	{padding:0 3px;}
#contents	{padding:0 3px;}
.blog		{display:inline-block;}
.link		{display:inline-block;}
 }