.about-intro {
    font-size: 1.2rem;
}
.about_head {
    color: #017110;
    font-weight: 500;
}

.about-intro img {
    border-radius: 50%;
    /* border-bottom-left-radius: 30px;
    border-top-right-radius: 30px; */
}
.loc_tag {
    border: 1px solid #019321;
    color: #048e20;
    width: 400px;
    text-align: center;
    border-top: 3px solid #019321;
    border-top-left-radius: 30px;
    border-bottom-right-radius: 30px;
    box-shadow: 3px 3px 4px #019321;
    font-size: calc(1rem + 1vw);
}
.adv_bottom .col-3 {
  border: 1px solid white;
  border-bottom: 5px solid #bdfad6;
  border-left: 3px solid #d8f9cf;
  border-bottom-left-radius: 30px;
  border-top-right-radius: 30px;
  box-shadow: 0 5px 6px rgb(221, 251, 221);
  margin: 10px;
}
/* left box style */
.left-card {
    border: 1px solid #bdbdbd;
    border-radius: 5px;
    height: 230px;
    font-size: 1.1rem;
    box-shadow: 2px 3px 5px #c8cac9;
  }
  .box_green {
      background: #019321;
      color: #fbfefb;
      border-left: 20px solid #c1f8cc;
  }
  .box_light {
      background-color: #f6f9f6;
      color: #01801c;
      border-left: 20px solid #02841c;
  }
  .impact_box {
      font-size: calc(1rem + 0.4vw);
  }
  .impact_box .h2, .vision_header, .mission_header, .miyawaki .h1 {
      color: #017110;
  }

  /* Mission and vision */
  .vision {
    border-left: 25px solid #048e20;
    background: #ececec;
    padding: 3rem;
  }
  .mission {
    border-right: 25px solid #048e20;
    background: #ececec;
    padding: 3rem;
  }
  .vision img, .mission img {
    border-radius: 30px;
  }
  .content_md {
    font-size: 1.1rem;
  }
  /* miyawaki first */
  .miyawaki .h1, .impact_box .h2 {
    border-left: 15px solid #52cd06;
    background-color: #eff3f0;
  }
  .miyawaki .row {
    font-size: 1.2rem;
  }

  .img-card {
    border: 1px solid #86fa5c;
    background-color: #daffcd;
    color: #016618;
    width: 155px;
    height: 155px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    font-weight: bold;
    box-shadow: 0 0 8px #d2f9c4;
  }
  /* .img-card {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
  }

  .img-card img {
    width: 120px;
    height: 120px;
    object-fit: contain;
    display: block;
  }
   */
/* miyawaki box */
  .miyawaki_adv {
    background-image: url('../images/about/mi-bg.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    min-height: 300px;
    position: relative;
    margin-bottom: 150px;
    border: 1px solid #03ba1e;
    padding: 3rem;
}
  .miyawaki_adv ul li {
    font-size: 1.2rem;
    font-weight: 500;
    padding: 10px;
    color: #01791d;
  }

  .box-content {
    font-size: 1.1rem;
    color: #026e12;
    height: 160px;
    border: 1px solid #347f43;
    border-bottom: 7px solid #016c16ca;
    border-top-left-radius: 20px;
    border-bottom-right-radius: 20px;
    box-shadow: 0 5px 8px #93b393;
  }

  .adv_bottom {
    position: absolute;
    bottom: -75px; /* Adjust based on box height to make it half-inside and half-outside */
    left: 0;
    right: 0;
    transform: translateY(0%);
  }

  /* mobile devices */

  @media (max-width: 578px) {
    .mission, .vision, .miyawaki_adv {
      padding: 1rem;
    }
  }

  @media (max-width: 767px) {
    .row > div {
      margin-bottom: 15px;
    }
    .loc_tag {
        width: 300px;
    }
    .adv_bottom {
      position: relative;
      bottom: 0;
      flex-direction: column;
      transform: translateY(0);
      margin-top: 20px;
    }
    .adv_bottom .col-12 {
      padding-left: 0;
      padding-right: 0;
    }
    .mission, .vision, .miyawaki_adv {
        padding: 2rem;
      }
    .left-card {
        font-size: 1.1rem;
    }
  }
  @media (max-width: 1200px) {
    .left-card {
        height: 280px;
    }
    .adv_bottom {
      position: relative;
      bottom: 0;
      flex-direction: column;
    }
    .box-content {
      height: 200px;
      margin: 0 auto;
    }
    .miyawaki_adv ul li {
        width: 100%;
    }
  }
