@charset "UTF-8";

body{
  font-family:Verdana,'Arial Black',メイリオ,sans-serif;
  background:#e7e7eb;
}

#container{
    Width:1000px;
    margin:0 auto;
    text-align:left;
    line-height:220%;
    border-style:groove;
    background:white;
  }

#header {
    width:100%;
    height:120px;
}

#blog_menu{
  display:flex;
  justify-content:center;
  list-style:none;
  padding:0px;
  /* height:50px; */
}

#blog_menu li{
  width:49%;
  margin-right:4px;
  text-align:center;
  background-color:#83ccd2;
  border-style:groove;
  /* float:left; */
}
#blog_menu li a{
  text-decoration:none;
  display:block;
  font-weight:bold;
}

#blog_menu li:hover{
  background-color:#84b9cb;
}

p{
  margin-left:5px;
}

#diary-mokuzi{
    border:2px solid #696969;
    background: #dcdcdc;
  }

#diary-mokuzi li {
    margin-left:15px;
    list-style-type:none!important;
}
#diary-mokuzi li a{
    text-decoration:none;
    line-height: 1.5;
    padding: 0.5em 0;
}

#diary-mokuzi li a:hover{
  text-decoration:underline;
}

h1 {
    position: relative;
    padding: 0.5em;
    background: #008000;
    color: white;
  }
  
  h1::before {
    position: absolute;
    content: '';
    top: 100%;
    left: 0;
    border: none;
    border-bottom: solid 15px transparent;
    border-right: solid 20px rgb(149, 158, 155);
  }

  h2 {
    position: relative;
    padding: 0.25em 0;
  }
  h2:after {
    content: "";
    display: block;
    height: 4px;
    background: -webkit-linear-gradient(to right, rgb(230, 90, 90), transparent);
    background: linear-gradient(to right, rgb(230, 90, 90), transparent);
  }

.link-img{
    display: block;
    position:relative;
    float:left;
    border:2px groove #6495ed;
    margin-left:3px;
    width:180px;
}

.link-img img{
  width:180;
}

.link-img span{
    left:0px;
    position:absolute;
    bottom:5px;
    width:180px;
    text-align:center;
    color:white;
    background-color:black;
    filter:alpha(opacity=80);
    -moz-opacity:0.8;
    opacity:0.8;
}

.link-img a{
  display:block;
}

#back{
  display:inline-block;
}

#next{
  display:inline-block;
  margin-left:25px;
}

/* 回り込み解除 */
h4 {
    clear:both;
}

/* 強調 */
.emphasis{
  padding: 0.3em 0;
  background-repeat: repeat-x;
  background-size: 1em 0.2em;
  background-position: top left;
  background-image: -webkit-gradient(radial,center center,0,center center,1.5,from(#000000),color-stop(0.5,#000000),color-stop(0.9,transparent),to(transparent));
  background-image: -webkit-radial-gradient(center center, 0.1em 0.1em, #000000, #000000 95%, transparent 95%, transparent);
  background-image: radial-gradient(0.1em 0.1em at center center, #000000, #000000 95%, transparent);
}

@media screen and (max-width: 979px){
    #container{
      width:100%;
    }
    #blog_menu li{
      width:40%;
    }
    .link-img{
      width:170px;
    }
    .link-img span{
      width:170px;
    }
    .link-img img{
      width:170px;
    }

  }
  
  @media screen and (max-width: 767px) {
    #container{
      width:100%;
    }
    #blog_menu li{
      width:40%;
    }
    .link-img{
      width:170px;
    }
    .link-img span{
      width:170px;
    }
    .link-img img{
      width:170px;
    }

  }
  
  @media screen and (max-width: 479px) {
    #container{
      width:100%;
    }
    #blog_menu li{
      width:40%;
    }
    .link-img{
      width:150px;
    }
    .link-img span{
      width:150px;
    }
    .link-img img{
      width:150px;
    }
  }