.table {
  border-color: #d6d6d6;
}
.table-about th {
  background-color: #d1d7f7;
}
.table-about th {
  border-right: 1px solid #FFFFFF;
  border-top: 1px solid #FFFFFF;
}
.table-about tr:first-child th{
  border-top: 1px solid #d6d6d6;
}
.table-enkaku th {
  text-align: center;
}
.list-unstyled {
  text-indent: -1rem; 
  padding-left: 1rem;
}
.list-unstyled li {
  padding-bottom: 10px;
}

.sdgs_icon img{
   width: 200px;
    height: auto;  /* ←縦横比を維持する高さを自動計算 */
}
.sdgs_GroupIcon img{
   width:  450px;
   height: auto;  /* ←縦横比を維持する高さを自動計算 */
}
.office-nav {
  width: 25%;
}
.office-content {
  width: 75%;
}
.active {
  background-color: #FFFFFF !important;
  color: inherit !important;
  border-color: #DEE2E6 !important;
}

/* 高高解像度以外の時に適用 */
@media screen  and (max-width: 1400px) {
  .sdgs_summary {
    width: 100%;
  }
  .sdgs_description {
    width: 100%;
  }
    .topimg img {
        height: 550px;
    }
    .toptext p  {
        position: static;
        position: static;
    }
}

/* 低解像度の時に適用 */
@media all and (max-width: 767px) {
  .table-yakuin td,.table-yakuin th {
    font-size: 14px;
    padding: 4px;
  }
  .table-yakuin tr {
    border-bottom: 1px solid #ccc;
  }
  .table-about td,.table-about th {
    padding: 8px;
  }
  .table-about tr {
    border-bottom: 1px solid #ccc;
  }
  .office_area {
      width: 100%;
      display: block;
  }
  .office_area table {
    height: auto;
  }
  .office-content {
    width: 100%;
  }
}