@charset "UTF-8";
/* コンテンツ最大幅 */
/* color */
/* ============================================ */
/* font */
/* ============================================ */
.block__contents {
  padding: 4vw 0 6vw;
  text-align: center;
  container-type: inline-size;
}

.list_flow {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  row-gap: 20px;
  padding-top: 20px;
}

.item_flow {
  width: 33.333%;
  box-sizing: border-box;
  padding: 1.5625cqw;
}
@media (width < 480px) {
  .item_flow {
    width: 90%;
    padding: 20px 0 0;
  }
}

.item_flow_wrap {
  position: relative;
}

.box_img_flow {
  position: relative;
  border-radius: 16px;
  border: #99CC00 solid 1px;
  padding: 20px;
  aspect-ratio: 4/3;
}
.box_img_flow img {
  -o-object-fit: contain;
     object-fit: contain;
  width: 100%;
  height: 100%;
}

.box_time {
  width: 7.8125cqw;
  position: absolute;
  top: -3cqw;
  left: -3cqw;
}
@media (width < 480px) {
  .box_time {
    width: 70px;
  }
}
.box_time img {
  width: 100%;
  height: auto;
}

.box_time_inner {
  position: relative;
}

.icon_clock {
  position: relative;
}
.icon_clock img {
  width: 100%;
  height: auto;
}

.time_flow {
  font-family: "Oswald", sans-serif;
  font-size: clamp(1.2rem, 1.406cqw, 1.8rem);
  line-height: 0.8em;
  font-weight: 900;
  width: 100%;
  position: absolute;
  top: 53%;
  transform: translateY(-53%);
}

.ttl_flow {
  font-size: clamp(1.8rem, 1.718cqw, 2.2rem);
  color: #99CC00;
  padding: 16px 0 0;
}

.comment_flow {
  font-size: 1.5rem;
  line-height: 1.6em;
  text-align: justify;
  padding: 8px 0 0;
}

.comment_flow_kome {
  font-size: 1.4rem;
  line-height: 1.6em;
  text-align: justify;
  padding: 4px 0 0 1em;
  text-indent: -1em;
}

.icon_clock_option {
  background-color: #99CC00;
  color: #FFF;
  display: grid;
  place-content: center;
  aspect-ratio: 1/1;
  border-radius: 100px;
}