﻿.box {
  padding: 0 20px;
}

.list, .list2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-pack: start;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
.list li, .list2 li {
  width: 31.5%;
  margin-left: 2.7%;
  border-bottom: solid 1px #dddddd;
  padding-bottom: 20px;
}
.list li:first-child, .list2 li:first-child {
  margin-left: 0;
}

.list2 li {
  width: 22.75%;
}

.box--center {
  width: 65%;
  margin: 0 auto;
}

.list-dl dt {
  font-size: 1rem;
  line-height: 1.3em;
  text-align: center;
  padding: 10px 0;
  border-top: solid 1px #dddddd;
  border-bottom: solid 1px #dddddd;
}
.list-dl dd {
  font-size: 0.86rem;
  line-height: 1.8em;
  margin-top: 15px;
}

@media screen and (max-width: 767px) {
  .list, .list2 {
    display: block;
    flex-wrap: initial;
  }
  .list li, .list2 li {
    width: 100%;
    margin-left: 0;
    border-top: solid 1px #dddddd;
    border-bottom: none;
    padding-bottom: 0;
    margin-top: 30px;
  }

  .list2 li {
    width: 100%;
  }

  .list-dl dt {
    text-align: left;
    padding: 40px 0 0;
    border-top: none;
    border-bottom: none;
  }
  .list-dl dd {
    font-size: 0.86rem;
    line-height: 1.8em;
    margin-top: 15px;
    min-height: 130px;
    border-bottom: none;
  }
}

.heading4--marketing {
  border-left: solid 5px #e75584;
  padding-left: 15px;
}
.heading4--logistics {
  border-left: solid 5px #f3a247;
  padding-left: 15px;
}
.heading4--finance {
  border-left: solid 5px #fcd14e;
  padding-left: 15px;
}
.heading4--risk_management {
  border-left: solid 5px #8fc249;
  padding-left: 15px;
}
.heading4--management {
  border-left: solid 5px #2ab8cc;
  padding-left: 15px;
}
.heading4--digital_transformer {
  border-left: solid 5px #137bc2;
  padding-left: 15px;
}