@charset "UTF-8";
img {
  max-width: 100%;
  height: auto;
}
.logo {
  width: 140px;
  height: 50px;
  margin-top: 40px;
  margin-bottom: 5px;
}
h3.title01 {
  margin-top: 50px;
  margin-bottom: 10px;
  text-align: center;
}
h3.title02 {
  right: 0;
  left: 0;
  margin: auto;
  margin-top: 50px;
  margin-bottom: 10px;
  text-align: center;
}

*{
  border: 0;
  margin: 2;
  padding: 0;
 }
  
 nav{
  background-color: white;
  height:60px;
 }
  
 .inner{
  max-width:100%;
  margin:2 auto;
 }
 nav>.flex{
   align-items: center;
   height:60px; 
 }
 .flex {
   display: flex;
   justify-content: space-between;
 }
  
 .flex li{
   margin-left:30px;
   list-style:none;
   font-size: 13px;
 }
 li a{
   color: black;
   text-decoration:none;
 }

a:link { color: #250d00; }
a:visited { color: #000b00; }
a:hover { color: #281a14; }
a:active { color: #180614; }
a {
  text-decoration: none;
  }

#form5 {
  position:relative; 
  margin-bottom:20px;	
}
  #sbox5 {	
  outline:0;	
  height:50px;
  padding:0 10px;  
  left:0;
  top:0; 
  max-width:270px;
  border-radius:2px;
  background:#eee;
}
  #sbtn5 {
  width:70px;
  height:50px;
  left:280px; 
  top:0;
  border-radius:2px;
  background:#432f2f;
  color:#fff;
  font-weight:bold;
  font-size:16px;
  border:none;
}
  #sbtn5:hover {
  background:#eee;
  color:#432f2f;
}
.items3 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.items3 .item {
  width: 50%;
}
.item {/*親div*/
  position: relative;
  }

.item p {
  position: absolute;
  top: 0;/*画像の左上に配置*/
  left: 0;
  margin: 0; /*余計な隙間を除く*/
  color: white;/*文字を白に*/
  background: #432f2f;/*背景色*/
  font-size: 15px;
  line-height: 1;/*行高は1に*/
  padding: 5px 10px;/*文字周りの余白*/
  }

.item-img {
  width: 100%;
  }
.popular-posts .cardtype__article-info {
    padding-top: 0.5em;
}
.popular-posts .cardtype__link {
    padding-bottom: 10px;
}
.popular-posts.cardtype {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: -moz-box;
    display: flex;
    flex-direction: row;
    -webkit-flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}
.popular-posts .cardtype__article {
  width: 48%;
  margin: 0 0 25px;
}
.popular-posts .cardtype__article:nth-child(odd){
  margin-right: 3%;
}
.popular-posts .cardtype__article p {
  margin: 0; 
}
.popular-posts.cardtype h7 {
    margin: 0 5px;
    font-size: 15px;
    text-align: center
}
h6 {
  position: relative;
  padding: 0.25em 1em;
	background: #281a14;
  font-size: 20px;
  color: white;
  border: solid 2px black;
  border-radius: 3px 0 3px 0;
}
h6:before, h6:after {
  content: '';
  position: absolute;
  width:10px;
  height: 10px;
  border: solid 0px black;
  border-radius: 50%;
}
h6:after {
  top:-12px;
  left:-12px;
}
h6:before {
  bottom:-12px;
  right:-12px;
}
h7 {
  text-align: center
}
.btn-flat-double-border {
  display: inline-block;
  padding: 0.5em 1em;
  text-decoration: none;
  text-align: center;
  width: 90%;
  color: #432f2f;
  border: double 4px #432f2f;
  border-radius: 3px;
  transition: .4s;
}
.btn-flat-double-border:hover {
  background: #fffbef;
}

.example02 {
  position: relative;
  }

.example02 p {/*pタグを画像の真ん中に*/
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  margin:0;/*余計な隙間を除く*/
  padding:0;/*余計な隙間を除く*/
  color: white;/*文字色*/
  font-size: 18px;/*文字サイズ*/
  text-align:center;/*pタグ内で更に中央寄せ*/
  text-shadow:-1px -1px 3px #3f312b;
}

.example02 p .fa {/*アイコンに対して*/
  display:block;/*前後に改行*/
  padding-bottom:10px;/*文字との隙間*/
  font-size: 18px;
  color: rgba(255, 255, 255, 0.6);/*半透明*/
}

.example02 img {
  width: 100%;
}

.sns {
  position: absolute;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
  font-size: 20px;
  margin-top: 20px; 
}

.copyright {
  position: absolute;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
  font-size: 13px;
  margin-top: 50px; 
}