.historyBox {
  border: 1px solid #e1e6ee;
  margin-top: 50px;
  padding-bottom: 30px;
  font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "\30D2\30E9\30AE\30CE\89D2\30B4\0020\0050\0072\006F\0020\0057\0033", Hiragino Kaku Gothic ProN, Arial, "\30E1\30A4\30EA\30AA", Meiryo, sans-serif;
  font-weight: 400;
}
.historyBox.isBookBox .modTitle4 {
  color: #f99511;
}
.historyBox.isRealBox .modTitle4 {
  color: #7cb0c7;
}
.historyBox.isPcBox .modTitle4 {
  color: #f380b3;
}
.historyBox .modTitle4 {
  display: inline-block;
  background: #fff;
  padding: 0 40px 0 21px;
  position: relative;
  top: -16px;
  margin-bottom: 10px;
}
@media all and (max-width: 767px) {
  .historyBox .modTitle4 {
    top: -13px;
    padding: 0 20px 0 15px;
  }
}
.historyBox .modTitle4 i {
  margin-right: 18px;
  position: relative;
  top: -5px;
}
.historyBox .modTitle4 i img {
  width: 44px;
  height: auto;
}
.historyBox .main,
.historyBox .sub ul,
.historyBox .subInner {
  display: table;
}
.historyBox .pic,
.historyBox dl,
.historyBox .sub li {
  display: table-cell;
}
.historyBox .sub,
.historyBox .main {
  margin: 0 30px;
}
@media all and (max-width: 767px) {
  .historyBox .sub,
  .historyBox .main {
    margin: 0 15px;
  }
}
.historyBox .sub dl,
.historyBox .main dl {
  padding-left: 30px;
}
.historyBox .sub dt,
.historyBox .main dt {
  font-size: 1.142857142857143rem;
  font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "\30D2\30E9\30AE\30CE\89D2\30B4\0020\0050\0072\006F\0020\0057\0033", Hiragino Kaku Gothic ProN, Arial, "\30E1\30A4\30EA\30AA", Meiryo, sans-serif;
  font-weight: 700;
}
.historyBox .sub dt+dd,
.historyBox .main dt+dd {
  margin-top: 0px;
}
.historyBox .sub dt+.caption,
.historyBox .main dt+.caption {
  margin-top: 10px;
}
@media all and (max-width: 767px) {
  .historyBox .sub dt+.caption,
  .historyBox .main dt+.caption {
    margin-top: 9px;
  }
}
.historyBox .sub dd,
.historyBox .main dd {
  line-height: 1.55;
}
.historyBox .sub .caption,
.historyBox .main .caption {
  font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "\30D2\30E9\30AE\30CE\89D2\30B4\0020\0050\0072\006F\0020\0057\0033", Hiragino Kaku Gothic ProN, Arial, "\30E1\30A4\30EA\30AA", Meiryo, sans-serif;
  font-weight: 300;
  font-size: 2rem;
  line-height: 1.3;
}
@media all and (max-width: 767px) {
  .historyBox .sub .caption,
  .historyBox .main .caption {
    font-size: 1.857142857142857rem;
  }
}
.historyBox .sub .caption+dd,
.historyBox .main .caption+dd {
  margin-top: 20px;
}
.historyBox .main .pic {
  width: 94px;
}
.historyBox .main+.sub {
  margin-top: 28px;
  padding-top: 28px;
  border-top: 1px solid #e1e6ee;
}
.historyBox .main dd {
  font-size: 1.142857142857143rem;
}
@media all and (max-width: 767px) {
  .historyBox .main {
    display: block;
  }
  .historyBox .main dl,
  .historyBox .main .pic {
    display: block;
  }
  .historyBox .main .pic {
    margin: 0 auto 22px;
  }
  .historyBox .main dl {
    padding-left: 0;
  }
  .historyBox .main dt,
  .historyBox .main .caption {
    text-align: center;
  }
}
.historyBox .sub .pic,
.historyBox .sub dl,
.historyBox .sub li {
  vertical-align: middle;
}
.historyBox .sub .pic {
  width: 56px;
}
.historyBox .sub dd {
  font-size: 1rem;
}
@media all and (min-width: 768px) {
  .historyBox .sub+.sub {
    margin-top: 60px;
  }
  .historyBox .sub ul {
    display: table;
    width: 100%;
  }
  .historyBox .sub li {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 50%;
    padding-left: 14px;
  }
  .historyBox .sub li:first-child {
    padding-left: 0;
  }
}
@media all and (max-width: 767px) {
  .historyBox .sub {
    padding-left: 14px;
  }
  .historyBox .sub+.sub {
    margin-top: 30px;
  }
  .historyBox .sub dl {
    padding-left: 20px;
  }
  .historyBox .sub ul,
  .historyBox .sub li {
    display: block;
  }
  .historyBox .sub li {
    margin-top: 30px;
  }
  .historyBox .sub li:first-child {
    margin-top: 0;
  }
}