@charset "UTF-8";
@import url(./common.css);
/*==================================================================*/
/* style css　*/
/*==================================================================*/
/* -------------------------------------------- */
/* blog */
/* -------------------------------------------- */
.blog {
  margin-bottom: 3em;
  /* -------------------------------------------- */
  /* 詳細ページ */
  /* -------------------------------------------- */
}
.blog .archive-title {
  margin-bottom: .5em;
  padding: 0.4em 0.5em;
  background-color: #f9f5ea;
  border-radius: 10px;
  font-size: 1.5em;
  font-weight: bold;
  font-feature-settings: "palt";
}
.blog .archive-title h2 {
  position: relative;
  padding-left: 1em;
}
.blog .archive-title h2:after {
  position: absolute;
  left: 5px;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  display: inline-block;
  content: "";
  width: 4px;
  height: 35px;
  background-color: #f5a535;
  border-radius: 5px;
}
.blog .entrys {
  margin: 0 auto 5em;
}
.blog .entrys article {
  display: flex;
  justify-content: space-between;
  padding: 2em 0;
  border-bottom: 1px dashed #acacac;
}
.blog .entrys article .detail {
  width: 75%;
}
.blog .entrys article .detail .info-top .date {
  color: #765f2f;
  font-size: .9em;
  margin-bottom: .5em;
}
.blog .entrys article .detail .info-top .cate-wrapper {
  padding: 1em;
  background-color: #f2f2f2;
  border-radius: 5px;
}
.blog .entrys article .detail .info-top .cate .title {
  margin-bottom: .2em;
  font-weight: bold;
  font-size: 0.9em;
}
.blog .entrys article .detail .info-top .cate .title i {
  font-size: .9em;
  color: #765f2f;
}
.blog .entrys article .detail .info-top .cate ul {
  position: relative;
  display: inline-block;
  padding-left: 15px;
  line-height: 1.2;
  letter-spacing: -0.4em;
}
.blog .entrys article .detail .info-top .cate ul:before {
  position: absolute;
  content: "/";
  left: 0;
  top: -1px;
}
.blog .entrys article .detail .info-top .cate ul:first-of-type {
  padding-left: 0;
}
.blog .entrys article .detail .info-top .cate ul:first-of-type:before {
  display: none;
}
.blog .entrys article .detail .info-top .cate ul li {
  position: relative;
  display: inline-block;
  margin-right: 3px;
  padding-left: 15px;
  font-size: 0.9em;
  letter-spacing: normal;
  word-wrap: break-word;
}
.blog .entrys article .detail .info-top .cate ul li:before {
  position: absolute;
  content: ",";
  left: 3px;
  top: -1px;
}
.blog .entrys article .detail .info-top .cate ul li a {
  display: block;
  font-size: 0.9em;
  font-feature-settings: "palt";
  text-decoration: none;
}
.blog .entrys article .detail .info-top .cate ul li a:hover {
  text-decoration: underline;
}
.blog .entrys article .detail .info-top .cate ul li:first-child {
  padding-left: 0;
}
.blog .entrys article .detail .info-top .cate ul li:first-child a {
  color: #333;
}
.blog .entrys article .detail .info-top .cate ul li:first-child:before {
  display: none;
}
.blog .entrys article .detail .info-top .cate ul li:nth-child(2):before {
  content: "\f105";
  font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands';
  font-weight: 900;
}
.blog .entrys article .detail .info-top .cate:nth-of-type(2) ul li:nth-child(2):before {
  content: ",";
}
.blog .entrys article .detail h3 {
  margin-bottom: 1em;
  font-size: 1.2em;
  font-weight: bold;
  word-wrap: break-word;
}
.blog .entrys article .detail h3 a {
  text-decoration: underline;
}
.blog .entrys article .detail h3 a:hover {
  text-decoration: none;
}
.blog .entrys article .detail .read {
  margin-bottom: 1em;
  word-wrap: break-word;
}
.blog .entrys article .photo {
  width: 20%;
}
.blog .entrys article .photo img {
  width: 100%;
  height: 18vw;
}
.blog .entry {
  margin-bottom: 3em;
}
.blog .entry article .title {
  margin-bottom: 1em;
  padding: 1em 1.5em;
  background-color: #f9f5ea;
  border-radius: 10px;
}
.blog .entry article .title .date {
  margin-bottom: 5px;
  font-size: .9em;
  color: #765f2f;
}
.blog .entry article .title h1 {
  font-size: 1.4em;
  font-weight: bold;
  font-feature-settings: "palt";
  word-wrap: break-word;
}
.blog .entry article .cate-wrapper {
  margin-bottom: 1em;
}
.blog .entry article .cate {
  display: block;
  line-height: 1.4;
}
.blog .entry article .cate:first-of-type {
  margin-bottom: 10px;
}
.blog .entry article .cate .subt {
  display: inline-block;
  background: #f2f2f2;
  border-radius: 5px;
  margin-bottom: 5px;
  margin-right: 5px;
  padding: 2px 5px;
  font-weight: bold;
  font-size: 0.8em;
  vertical-align: middle;
  line-height: 1.5;
  letter-spacing: normal;
}
.blog .entry article .cate .subt i {
  font-size: .8em;
}
.blog .entry article .cate ul {
  position: relative;
  display: inline-block;
  padding-left: 1em;
  line-height: 1.2;
  letter-spacing: -0.4em;
}
.blog .entry article .cate ul:before {
  position: absolute;
  content: "/";
  left: 0;
  top: -1px;
}
.blog .entry article .cate ul:first-of-type {
  padding-left: 0;
}
.blog .entry article .cate ul:first-of-type:before {
  display: none;
}
.blog .entry article .cate ul li {
  position: relative;
  display: inline-block;
  margin-right: 5px;
  padding-left: 1em;
  color: #777;
  font-size: 0.9em;
  letter-spacing: normal;
  word-wrap: break-word;
}
.blog .entry article .cate ul li:before {
  position: absolute;
  content: ",";
  left: 2px;
  top: -1px;
}
.blog .entry article .cate ul li a {
  display: block;
  font-size: 0.9em;
  font-feature-settings: "palt";
  text-decoration: underline;
  color: #777;
}
.blog .entry article .cate ul li a:hover {
  text-decoration: none;
}
.blog .entry article .cate ul li:first-child {
  padding-left: 0;
}
.blog .entry article .cate ul li:first-child:before {
  display: none;
}
.blog .entry article .cate ul li:nth-child(2):before {
  content: "\f105";
  font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands';
  font-weight: 900;
}
.blog .entry article .cate.region ul li:nth-child(2):before {
  content: ",";
}
.blog .entry article .wysiwyg {
  padding: 1.5em;
  border-top: 1px dashed #acacac;
  border-bottom: 1px dashed #acacac;
}
.blog .entry article .wysiwyg h2 {
  position: relative;
  background: #f9f5ea;
  margin-bottom: 1rem;
  padding: .2em 1em;
  font-size: 1.4em;
  border-radius: 5px;
}
.blog .entry article .wysiwyg h2::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background: #765f2f;
  height: 100%;
  width: 5px;
  border-radius: 5px 0 0 5px;
}
.blog .entry article .wysiwyg #ez-toc-container {
  margin-bottom: 2em;
  padding: 1em;
  min-width: 200px;
}
.blog .entry article .wysiwyg #ez-toc-container .ez-toc-title {
  display: inline-block;
  margin-bottom: 5px;
  font-size: 1.2em;
  font-weight: bold;
  color: #765f2f;
}
.blog .entry article .wysiwyg #ez-toc-container .ez-toc-title::before {
  content: "\f0ca";
  font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands';
  font-weight: 900;
  color: #fff;
  margin-right: 5px;
  background: #765f2f;
  height: 30px;
  width: 30px;
  display: inline-block;
  border-radius: 50%;
  text-align: center;
  font-size: .7em;
  line-height: 2.3;
  vertical-align: bottom;
}
.blog aside {
  margin-bottom: 4em;
}
.blog aside h2 {
  margin-bottom: 1em;
  padding-bottom: .4em;
  border-bottom: 1px solid #b6b6b6;
  font-size: 1.3em;
  font-weight: bold;
}
.blog aside .inner {
  display: flex;
  flex-wrap: wrap;
  width: 95%;
  margin: 0 auto;
}
.blog aside .inner article {
  width: 22%;
  margin-right: 2%;
}
.blog aside .inner article:nth-child(4n) {
  margin-right: 0;
}
.blog aside .inner article .photo {
  margin-bottom: .4em;
}
.blog aside .inner article .photo a img {
  height: 10vw;
  width: 100%;
}
.blog aside .inner article .title {
  font-size: .9em;
  text-indent: -0.6em;
  padding-left: 1.2em;
}
.blog aside .inner article .title a {
  text-decoration: underline;
}
.blog aside .inner article .title a:hover {
  text-decoration: none;
}
.blog aside .inner article .title a i {
  margin-right: 3px;
  color: #401702;
}
.blog aside .inner article .cate {
  text-align: left;
}
.blog aside .inner article .cate ul {
  letter-spacing: -0.4em;
}
.blog aside .inner article .cate ul li {
  display: inline-block;
  margin-right: 5px;
  color: #401702;
  background-color: #d1c7b8;
  font-size: 0.9em;
  letter-spacing: normal;
  word-wrap: break-word;
}
.blog aside .inner article .cate ul li a {
  display: block;
  padding: 0 0.5em;
  font-feature-settings: "palt";
  text-decoration: none;
}
.blog aside .inner article .cate ul li a:hover {
  background-color: #c4af90;
}

/*===========================================================================*/
/*  media quary:1200px  */
/*===========================================================================*/
@media screen and (max-width: 1200px) {
  /* blog
  ------------------------------------------------------------------------ */
  .blog .entrys article .detail h3 {
    margin-bottom: 0.5em;
    font-size: 1.1em;
  }
  .blog .entrys article .imgnone {
    padding-right: 0;
  }
  .blog .entrys article .photo img {
    height: 24vw;
  }
  .blog .entry article .title {
    padding: 1em 1em 0.5em;
  }
  .blog .entry article .title h1 {
    font-size: 1.2em;
  }
  .blog aside .inner article .photo a img {
    height: 15vw;
  }
}
/*===========================================================================*/
/*  media quary:767px  */
/*===========================================================================*/
@media screen and (max-width: 767px) {
  /* blog
  ------------------------------------------------------------------------ */
  .blog .read {
    text-align: left;
  }
  .blog .entrys {
    margin-bottom: 3em;
  }
  .blog .entry article .title h1 {
    font-size: 1.2em;
  }
  .blog .entry article .wysiwyg {
    padding: 1.5em 0;
  }
}
/*===========================================================================*/
/*  media quary:479px  */
/*===========================================================================*/
@media screen and (max-width: 479px) {
  /* blog
  ------------------------------------------------------------------------ */
  .blog .archive-title {
    margin-bottom: 0;
    font-size: 1.2em;
  }
  .blog .archive-title h2:after {
    height: 30px;
  }
  .blog .entrys {
    margin-bottom: 2em;
  }
  .blog .entrys article {
    display: block;
    padding: 1.5em 0;
  }
  .blog .entrys article .detail {
    margin-bottom: 1em;
    width: 100%;
  }
  .blog .entrys article .detail h3 {
    font-size: 1em;
  }
  .blog .entrys article .detail .info-top .cate-wrapper {
    padding: .5em 1em;
  }
  .blog .entrys article .photo {
    margin: 0 auto;
    width: 50%;
    max-width: 150px;
  }
  .blog .entrys article .photo img {
    height: 50vw;
  }
  .blog .entry article .title h1 {
    font-size: 1em;
  }
  .blog .entry article .wysiwyg h2 {
    font-size: 1.25em;
  }
  .blog aside h2 {
    font-size: 1.1em;
  }
  .blog aside .inner {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .blog aside .inner article {
    width: 48%;
    margin: 0 0 1em;
  }
  .blog aside .inner article .photo a img {
    height: 30vw;
  }
}