@import url("https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,400;0,500;0,600;0,700;1,600&family=Noto+Sans+JP:wght@400;500;700&display=swap");
/*============================
#content
============================*/
#content article #archive {
  padding-bottom: 16rem;
}
@media (max-width: 960px) {
  #content article #archive {
    padding-bottom: 12rem;
  }
}
#content article #archive .archive-lead {
  margin-bottom: 8rem;
}
#content article #archive .archive-head .category {
  margin-top: 6rem;
  background: #F0F6FA;
  padding: 2.5em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#content article #archive .archive-head .category h3 {
  font-family: "Josefin Sans";
  font-size: 1.125em;
  font-weight: bold;
  line-height: 1.2222222222;
  color: #005FAF;
  width: 8.8888888889em;
  margin-right: 1em;
}
#content article #archive .archive-head .category ul {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  margin: -0.2857142857em -0.8928571429em;
  font-size: 0.875em;
  font-weight: 500;
}
#content article #archive .archive-head .category ul li {
  line-height: 1.5714285714;
  margin: 0.2857142857em 0.8928571429em;
}
#content article #archive .archive-head .category ul li a:before {
  content: "";
  display: inline-block;
  width: 0.7142857143em;
  height: 1.4285714286em;
  margin-right: 0.3571428571em;
  vertical-align: bottom;
  background: 50%/contain no-repeat;
  background-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2010%2010%22%3E%3Cpath%20data-name%3D%22Icon%20awesome-hashtag%22%20d%3D%22M9.836%203.35%2010%202.458a.268.268%200%200%200-.264-.315H8.062L8.388.315A.268.268%200%200%200%208.124%200h-.906a.268.268%200%200%200-.264.221l-.343%201.922h-2.2L4.737.315A.268.268%200%200%200%204.473%200h-.908a.268.268%200%200%200-.264.221l-.343%201.922H1.193a.268.268%200%200%200-.264.221l-.159.892a.268.268%200%200%200%20.264.315H2.7l-.51%202.857H.427a.268.268%200%200%200-.263.222L0%207.542a.268.268%200%200%200%20.264.315h1.67l-.326%201.828a.268.268%200%200%200%20.264.315h.907a.268.268%200%200%200%20.264-.221l.343-1.922h2.2L5.26%209.685a.268.268%200%200%200%20.264.315h.907a.268.268%200%200%200%20.264-.221l.343-1.922h1.769a.268.268%200%200%200%20.264-.221l.159-.893a.268.268%200%200%200-.264-.315H7.3l.51-2.857h1.763a.268.268%200%200%200%20.263-.221Zm-3.99%203.079h-2.2l.51-2.857h2.2Z%22%20fill%3D%22%23231815%22%2F%3E%3C%2Fsvg%3E");
}
@media (hover: hover) {
  #content article #archive .archive-head .category ul li a:hover:before {
    background-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2010%2010%22%3E%3Cpath%20data-name%3D%22Icon%20awesome-hashtag%22%20d%3D%22M9.836%203.35%2010%202.458a.268.268%200%200%200-.264-.315H8.062L8.388.315A.268.268%200%200%200%208.124%200h-.906a.268.268%200%200%200-.264.221l-.343%201.922h-2.2L4.737.315A.268.268%200%200%200%204.473%200h-.908a.268.268%200%200%200-.264.221l-.343%201.922H1.193a.268.268%200%200%200-.264.221l-.159.892a.268.268%200%200%200%20.264.315H2.7l-.51%202.857H.427a.268.268%200%200%200-.263.222L0%207.542a.268.268%200%200%200%20.264.315h1.67l-.326%201.828a.268.268%200%200%200%20.264.315h.907a.268.268%200%200%200%20.264-.221l.343-1.922h2.2L5.26%209.685a.268.268%200%200%200%20.264.315h.907a.268.268%200%200%200%20.264-.221l.343-1.922h1.769a.268.268%200%200%200%20.264-.221l.159-.893a.268.268%200%200%200-.264-.315H7.3l.51-2.857h1.763a.268.268%200%200%200%20.263-.221Zm-3.99%203.079h-2.2l.51-2.857h2.2Z%22%20fill%3D%22%23005FAF%22%2F%3E%3C%2Fsvg%3E");
  }
}
#content article #archive .archive-head .category ul li.current-cat a {
  color: #005FAF;
}
#content article #archive .archive-head .category ul li.current-cat a:before {
  background-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2010%2010%22%3E%3Cpath%20data-name%3D%22Icon%20awesome-hashtag%22%20d%3D%22M9.836%203.35%2010%202.458a.268.268%200%200%200-.264-.315H8.062L8.388.315A.268.268%200%200%200%208.124%200h-.906a.268.268%200%200%200-.264.221l-.343%201.922h-2.2L4.737.315A.268.268%200%200%200%204.473%200h-.908a.268.268%200%200%200-.264.221l-.343%201.922H1.193a.268.268%200%200%200-.264.221l-.159.892a.268.268%200%200%200%20.264.315H2.7l-.51%202.857H.427a.268.268%200%200%200-.263.222L0%207.542a.268.268%200%200%200%20.264.315h1.67l-.326%201.828a.268.268%200%200%200%20.264.315h.907a.268.268%200%200%200%20.264-.221l.343-1.922h2.2L5.26%209.685a.268.268%200%200%200%20.264.315h.907a.268.268%200%200%200%20.264-.221l.343-1.922h1.769a.268.268%200%200%200%20.264-.221l.159-.893a.268.268%200%200%200-.264-.315H7.3l.51-2.857h1.763a.268.268%200%200%200%20.263-.221Zm-3.99%203.079h-2.2l.51-2.857h2.2Z%22%20fill%3D%22%23005FAF%22%2F%3E%3C%2Fsvg%3E");
}
@media (max-width: 960px) {
  #content article #archive .archive-head .category {
    padding: 4rem 3rem;
    display: block;
  }
  #content article #archive .archive-head .category h3 {
    width: auto;
    margin-right: 0;
  }
  #content article #archive .archive-head .category ul {
    margin-top: 1.6rem;
  }
}
#content article #archive .archive-body {
  margin-top: 6rem;
}
#content article #archive .archive-body .posts {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
#content article #archive .archive-body .posts:before, #content article #archive .archive-body .posts:after {
  content: "";
  display: block;
  width: 23.8970588235%;
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
#content article #archive .archive-body .posts li {
  width: 23.8970588235%;
  margin-bottom: 3.125em;
}
#content article #archive .archive-body .posts li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  line-height: 1.5;
  position: relative;
}
#content article #archive .archive-body .posts li a .img {
  width: 100%;
  position: relative;
  height: 0;
  padding-top: 66.1538461538%;
  background: 50%/cover no-repeat;
}
#content article #archive .archive-body .posts li a .date {
  font-size: 0.875em;
  font-weight: 600;
  color: #005FAF;
  line-height: 1;
  font-family: "Josefin Sans";
  margin-top: 1.4285714286em;
}
#content article #archive .archive-body .posts li a .date + .term {
  margin-top: 0.4545454545em;
}
#content article #archive .archive-body .posts li a .term {
  color: #fff;
  font-weight: bold;
  background: #005FAF;
  line-height: 2;
  font-size: 0.6875em;
  padding: 0 0.9090909091em;
  margin-top: 1.8181818182em;
}
#content article #archive .archive-body .posts li a .title {
  margin-top: 0.3125em;
}
#content article #archive .archive-body .posts li.item-works a .img {
  padding-top: 100%;
}
@media (max-width: 960px) {
  #content article #archive .archive-body {
    margin-top: 8rem;
  }
  #content article #archive .archive-body .posts:before, #content article #archive .archive-body .posts:after {
    display: none;
  }
  #content article #archive .archive-body .posts li {
    width: 48.502994012%;
    margin-bottom: 2rem;
  }
  #content article #archive .archive-body .posts li a .date {
    margin-top: 1rem;
  }
  #content article #archive .archive-body .posts li a .term {
    font-size: 1rem;
    margin-top: 1rem;
  }
}