/*
Theme Name: Incubation Studio SoWelu
Theme URI: https://sowelu-incu.com/
Author: Incubation Studio SoWelu
Author URI: https://sowelu-incu.com/
Description: Incubation Studio SoWelu公式サイトテーマ
Version: 1.0
*/

.category {
  padding-top: 3.594vw;
}

.category p {
  letter-spacing: 0;
  line-height: 1.428;
}

.category .title_text_info {
  top: 18%;
  left: 19.5vw;
}

.category .post_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  justify-content: flex-start;
  padding-left: 0;
  margin: 0;
}

.categories {
  display: flex;
  position: absolute;
  top: 2vw;
  left: 20vw;
  font-size: 1.2vw;
}

.categories ul {
  display: flex;
  margin: 0;
}

.categories ul li {
  padding-left: 2vw;
  text-decoration: underline;
}

.categories ul li a:hover {
  opacity: 0.7;
}


.category .post_list::after {
  content: "";
  display: block;
  width: 33%;
  /* 子要素と同じ幅 */
}

.category .post_list .post {
  position: relative;
  width: 33.333%;
  height: 30.781vw;
  left: 0;
  border-top: none;
  border-left: 0.5px solid #314F33;
  border-right: 1px solid #314F33;
  border-bottom: 1px solid #314F33;
}

.category .post a {
  display: block;
  width: 100%;
  height: 100%;
}

.category .post a:hover {
  background-color: #314F33;
}

.category .date {
  display: inline-block;
  position: absolute;
  left: 0.6vw;
  top: 3.7vw;
  transform: rotate(90deg);
}

.category .post a:hover p {
  color: #FFFFFF;
}

.category .post a:hover .title {
  text-decoration: underline;
}


.category .post_box {
  position: absolute;
  top: 1.875vw;
  left: 6.375vw;
}

.category .post_box .post_img img {
  width: 23.125vw;
  height: 23.125vw;
  object-fit: cover;
}

.category .text {
  margin: 1vw 0;
  width: 23.125vw;
}

.category .text p {
  margin: 0;
  display: inline-block;
  word-break: break-all;
}

.back_button {
  border-top: 1px solid #314F33;
  border-bottom: 1px solid #314F33;
  text-align: center;
  padding: 3vw 0;
}

.back_button a:hover {
  opacity: 0.7;
  text-decoration: underline;
}


/*レスポンシブ*/
@media all and (max-width: 670px) {
  .category {
    padding-top: 10.667vw;
    margin-bottom: 25vw;
  }

  .category .section_tit2 {
    height: 25vw;
  }

  .category .section_tit2 .title_text {
    top: 0.9vw;
  }

  .category .title_text_info {
    line-height: 1.46;
    top: 13.6vw;
    left: 5.333vw;
    margin: 0;
  }

  .category .post_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    justify-content: flex-start;
    padding-left: 0;
    margin: 0;
  }

  .categories {
    font-size: 3.467vw;
    top: 18vw;
    left: 6vw;
    height: 14vw;
    position: relative;
  }

  .categories ul {
    flex-wrap: wrap;
    justify-content: space-between;
    position: absolute;
    top: 7vw;

  }

  .categories ul li {
    text-decoration: underline;
    width: 50%;
    padding: 0 0 5vw 0;
  }


  .category .post_list::after {
    width: 50%;
    /* 子要素と同じ幅 */
  }

  .category .post_list .post {
    width: 50%;
    height: 75.467vw;
  }

  .category .date {
    font-size: 2.933vw;
    left: 3.3vw;
    top: 46vw;
    transform: none;
  }

  .category .post_box {
    top: 4.5vw;
    left: 2.9vw;
  }

  .category .post_box .post_img img {
    width: 43.733vw;
    height: 43.733vw;
  }

  .category .text p {
    margin-top: 8vw;
    font-size: 3.2vw;
    width: 43.7vw;
  }

}