/* bl_card */
.bl_card {
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}
.bl_card_imgWrapper {
  position: relative;
  padding-top: 56.25%;
  overflow: hidden;
}
.bl_card_imgWrapper > img {
  position: absolute;
  top: 50%;
  width: 100%;
  transform: translateY(-50%);
}
.bl_card_body {
  padding: 15px;
}
.bl_card_body > *:last-child {
  margin-bottom: 0;
}
.bl_card_ttl {
  margin-bottom: 5px;
  font-size: 1.125rem;
  font-weight: bold;
}
.bl_card_txt {
  color: #777;
}


/* bl_card 3col */
.bl_cardUnit {
  display: flex;
  flex-wrap: wrap;
}

.bl_cardUnit.bl_cardUnit__col3 {
  margin-bottom: -30px;
}

.bl_cardUnit__col3 > .bl_card {
  width: 31.707%;
  margin-right: 2.43902%;
  margin-bottom: 30px;
}

.bl_cardUnit__col3 > .bl_card:nth-of-type(3n) {
  margin-right: 0;
}


/* Order-list */
.bl_orderList {
  counter-reset: bl_orderList;
}
.bl_orderList > *:last-child {
  margin-bottom: 0;
}
.bl_orderList > li {
  position: relative;
  padding-left: 3em;
  margin-bottom: 10px;
}
.bl_orderList > li::before {
  content: counter(bl_orderList)'. ';
  position: absolute;
  top: 0;
  left: 1.5em;
  color: #16902d;
  font-weight: bold;
  counter-increment: bl_orderList;
}

/* bl_card col4*/
.bl_cardUnit {
  display: flex;
  flex-wrap: wrap;
}
.bl_cardUnit.bl_cardUnit__col4 {
  margin-bottom: -20px;
}

.bl_cardUnit__col4 > .bl_card {
  width:  23.78%;
  margin-right: 1.62602%;
  margin-bottom: 20px;
}

.bl_cardUnit__col4 > .bl_card:nth-of-type(4n) {
  margin-right: 0;
}


@media screen and (max-width: 768px) {
/* bl_card 3col */
.bl_cardUnit.bl_cardUnit__col3 {
  margin-bottom: -20px;
}
.bl_cardUnit > .bl_card {
  width: 100%;
  margin-right: 0;
  margin-bottom: 20px;
}
/* bl_card 4col */
.bl_cardUnit > .bl_card {
  width: 100%;
  margin-right: 0;
  margin-bottom: 20px;
}
}