h1.single-header-title a{
  margin: 30px 0 0 30px;
  font-family: 'Caveat', cursive;
  font-size:50px;
  text-transform:capitalize;
  color: #000000;
  position: absolute;
  top: 50px;
}

.single-format-standard div.side-bar {
  width: 100%;
  display: flex;
  margin-left: 5px;
  justify-content: flex-end;
  position: fixed;
  top: 30px;
}
.single-format-standard div.side-bar a {
  width: 15%;
  font-size: 8px;
}
.single-format-standard div.side-bar a h2:hover {
  font-size:12px;
}
.post-area {
  width: 90%;
  margin: 0 auto;
}
.single-post-area {
  width: 100%;
}
.single-post-detail-area {
  display: flex;
  width: 99%;
}
.archive-cover-area {
  width: 17%;
  display: flex;
  justify-content: right;
}
.archive-area li {
  list-style: none;
}
.archive-area li:hover {
  text-shadow    : 
  2px  2px 7px #18c2fb,
 -2px  2px 7px #18c2fb,
  2px -2px 7px #18c2fb,
 -2px -2px 7px #18c2fb,
  2px  0px 7px #18c2fb,
  0px  2px 7px #18c2fb,
 -2px  0px 7px #18c2fb,
  0px -2px 7px #18c2fb;
  transition: 0.3s;
}

.content-cover-design {
  background-color:rgba(58, 150, 167, 0.4);
  display: flex;
  justify-content: center;
  padding: 1% 0 1% 0;
}
.content-area {
  background: #FFF;
  width: 99%;
  border-radius: 5px;
}
.post-tag-space {
  width: 100%;
  height: 150px;
}
.tag-title-area {
  padding: 2%;
}
.post-detail-tag {
  background: rgb(85,204,255);
  display: inline-block;
  padding: 3px;
}
.post-detail-title {
  font-size: 20px;
  color: #FFF;
  margin-top: 5px;
}
.detail-border {
  border-left: 1px solid #000000;
  padding: 2%;
  position: relative;
  margin-left: 1px;
}
.detail-small-border:nth-child(1) {
  border-left: 1px solid #000000;
  height: 40px;
  position: absolute;
  top: 0;
  animation: border-animation-50px ease-in infinite 2s;

}
.detail-small-border:nth-child(2) {
  border-left: 1px solid #000000;
  height: 20px;
  position: absolute;
  top: 0;
  left: 4%;
  animation: border-animation-20px ease-in infinite 1.5s;
  animation-delay: 1s;
}
@keyframes border-animation-50px {
  0% {
    height: 1px;
  }
  50% {
    height: 50px;
  }
  100% {
    height: 0px;
  }
}
@keyframes border-animation-20px {
  0% {
    height: 1px;
  }
  50% {
    height: 20px;
  }
  100% {
    height: 0px;
  }
}

/* 目次デザイン */
div#toc_container {
  margin: 2%;
}

.post-date {
  font-size: 12px;
  line-height: 100%;
  padding:1%;
}
.blog-content {
  text-align: left;
  margin: 0 25px;
}
.blog-detail__image {
  width:fit-content;
  transition: 0.3s all;
  overflow: hidden;
   height: 300px;
}
.blog-detail__image img {
  display: block;
  width: 300px;
	height: 300px;
}
.blog-detail__image img:hover {
  transform: scale(1.05,1.05);
  transition: 0.3s all;
  overflow: hidden;]
	  width: 300px;
	height: 300px;
}

.smb-balloon__body {
	flex: inherit;
}
.smb-balloon__body>:first-child {
	display: inline;
}

.has-pale-cyan-blue-background-color {
   display: inline-block;
    padding: 1.1rem;
    border-radius: 5px;
}


@media screen and (max-width:465px) {
  .single-post-detail-area h2 {
    font-size: 18px;
  }
  .single-post-detail-area p {
    font-size: 12px;
  }
  .post-area {
    width:100%;
  }
  .single-post-detail-area  {
    width:100%;
  }
  .post-tag-space {
    height: 0px;
  }
  .single-format-standard div.side-bar {
    width: 50%;
    display: block;
  }
  .content-area {
    width: 100%;
  }
	
}

@media screen and(max-width:370px){
	.content-cover-design {
	width:310px;
	}
	.blog-detail__image {
		width:280px;
	}
	.blog-detail__image img {
		width:280px;
	}
}

@media screen and (max-width:700px) {
	.single-post-detail-area {
		display:block;
	}
}

@media screen and (max-width:550px) {
	.blog-detail__image {
		  width: 300px;
	height: 300px;
	}
	.blog-detail__image img {
		  width: 300px;
	height: 300px;
	}
}