@charset "UTF-8";


* { margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-weight: normal;
    font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
}

body {	background-color: #dadfd8;
  	text-align: center;
    	line-height: 1.7;
    	letter-spacing: 0.1em;
    	font-size: 12px;
    	color: #012a4a;
}

a {	text-decoration: none;
    	font-weight: bold;
    	color: #be6542;
}

#wrap {	margin-top: 5em;}

header {position: relative;
    	margin: 0 auto;
    	padding:0;
    	width: 310px;
    	height: 460px; }
header img {width: 100%;height: auto;}

aside {	margin: 3em auto 1.5em;
    	padding: 1em;
    	width: 320px;
    	background-color: #f6f7f6;
    	text-align: justify;
    	word-break: break-all;
    	border-radius: 10px;   }

main {margin: 1.5em auto;}

section {margin: 1.5em auto;
    	padding: 1em 1.5em;
    	width: 320px;
    	background-color: #f6f7f6;
    	text-align: justify;
    	word-break: break-all;
    	border-radius: 10px;}

section h2 {margin-bottom: 0.5em;font-size: 1.2em;}

section h2 span {padding: 0 0.5em;margin-right:3px;
    		background-color: #7ca1c1;
    		font-family: 'Jost', 'Noto Serif JP', serif;
    		color: #7ca1c1;}

section p span {color: #8d929a;}

section .line {	margin: 0.5em auto;
    		width: 100%;
    		height: 1px;
    		border-top: thin dashed #bcc6c4;}

details summary {list-style: none;}
details summary::-webkit-details-marker {display: none;}
details p {animation: FadeIn .5s;}

summary {cursor: pointer;}

footer {margin: 1em auto 1.5em;}

/* アーティクル */
article {margin: 3em auto;
    	padding: 3em 1.5em;
    	width: 350px;
    	background-color: #f6f7f6;
    	border-radius: 10px;   }

article p {	margin: 1em auto 1.5em;
    		line-height: 2;}
    		

.search-list__item {
  appearance: none;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  color: inherit;
  background-color: #ddd;
  border-radius: initial;
  border: none;
  display: inline-block;
  padding: 10px;
  cursor: pointer;}

.search-list button{border-radius: 10px; }

.search-list__item.is-active {text-decoration: underline;}
.entry-list__item+.entry-list__item {margin-top: 1em;}
.entry-list__item.is-hide {display: none;}
.entry-list {margin-top: 2em;width: 100%;}

.entry-list li{width: 95px;display:inline-block;list-style: none;}
.entry-list__meta  {font-size:70%;}
.entry-list__meta span  {font-size:110%;}
.entry-list__meta img {width: 85px;height: auto;}

.entry-list2 li{width:70px;display:inline-block;list-style: none;}
.entry-list__meta2  {font-size:50%;}
.entry-list__meta2 img {width: 60px;height: auto;}

@keyframes FadeIn {0% {opacity: 0;}
100% {opacity: 1;}}

#Top {height:1px;}
#PageTop {position:fixed;bottom: 5%;right: 6%;}
#PageTop a {display:block;z-index:100;width:30px;height:30px;}
#PageTop a img {width:30px;height: auto;}

.button-20 {display: flex;
    		justify-content: center;
  		  align-items: center;
  		  width: 50px;
  		  height: 50px;
  		  border: none;
  		  border-radius: 50%;
  		  background-color: #405f74;}
.button-20:hover {border: 1px solid #405f74;background-color: #fff;}
.button-20:hover path {fill: #405f74;}

textarea,
input[type] {
    -webkit-appearance: none;
    padding: 0.2em 0.5em;
    background-color: #fff;
    border: none;
    border-top: thin solid #7ca1c1;
    border-bottom: thin solid #7ca1c1;
    border-radius: 10px;
    color: #8d929a;
}

textarea {width: 200px;height: 70px;}
input[type=text] {width: 80px;}
input[type=submit] {width: auto;}

/* 横幅768px以上で読み込む */
@media screen and (min-width:768px) {
 body {font-size: 12px;}
#wrap {margin: 5em auto;max-width: 700px;}

#wrap::after {display: block;content: '';clear: both;}
#headerwrap {float: left;}
main {overflow: hidden;}
section {margin: 0 auto 1.5em;	padding: 1em;width: 350px;}
article p {font-size: 12px;}}

/* 横幅1024px以上で読み込む */
@media screen and (min-width:1024px) {
body {font-size: 13px;}
a {display: inline-block;transition: .3s;transform: scale(1);}
a:hover {transform: scale(1.05);text-shadow: 0 0 3px #7ca1c1;color: transparent;}
#wrap {max-width: 1000px;}
main {display: flex;
      flex-wrap: wrap;
      justify-content: space-around;
      padding-left: 3em;}
section {margin-left: 0;margin-right: auto;	padding: 1em;width: 45%;}
article p {font-size: 12px;}}