.slide01 {
  width: 100%;
  margin-bottom: 35px;
}

.slide01 img {
  width: 100%;
}

.slide01 .slide-arrow {
  width: 50px;
  height: 132px;
  margin: auto;
  z-index: 100;
  position: absolute;
  top: 0;
  bottom: 0;
  cursor: pointer;
}

.slide01 .prev-arrow {
  left: 0;
}

.slide01 .next-arrow {
  right: 0;
}

.mainBg {
  background: url("../images/bg_index01.png") no-repeat bottom/cover;
}

.boxWrap {
  font-size: 0;
  padding: 60px 0;
}

.box01 {
  width: calc(calc(100% - 50px)/3);
  height: 430px;
  margin: 0 25px 70px 0;
  border-bottom: 2px solid #1D2F74;
  display: inline-block;
  position: relative;
}

.box01:nth-child(3n) {
  margin: 0 0 70px 0;
}

.box01 img {
  width: 100%;
}

.box01 .tit01 {
  font-size: 18px;
  font-weight: bold;
  margin-top: 22px;
}

.box01 .txt01 {
  font-size: 16px;
  position: absolute;
  margin-top: 18px;
  line-height: 1.7;
}

.box01 .btn01 {
  margin: auto;
  position: absolute;
  right: 0;
  bottom: 22px;
  left: 0;
}

@supports (-ms-ime-align: auto) {
  .box01 {
    width: 31.6%;
  }
  @media screen and (max-width: 1050px) {
    .box01 {
      width: calc(94%/3);
    }
  }
  @media screen and (max-width: 900px) {
    .box01 {
      width: calc(92%/3);
    }
  }
}

_:-ms-input-placeholder, :root .box01 {
  width: 31.6%;
}

@media screen and (max-width: 1050px) {
  _:-ms-input-placeholder, :root .box01 {
    width: calc(94%/3);
  }
}

@media screen and (max-width: 900px) {
  _:-ms-input-placeholder, :root .box01 {
    width: calc(92%/3);
  }
}

@media screen and (max-width: 767px) {
  _:-ms-input-placeholder, :root .box01 {
    width: calc(97%/2);
  }
}

@media screen and (max-width: 767px) {
  .slide01 {
    margin-bottom: 25px;
  }
  .slide01 .slide-arrow {
    width: 30px;
    height: 50px;
  }
  .mainBg {
    background: none;
  }
  .boxWrap {
    padding: 20px 0 40px;
  }
  .box01 {
    width: calc(calc(100% - 13px)/2);
    height: 370px;
    margin: 0 0 45px 0;
  }
}

@media screen and (max-width: 767px) and (max-width: 640px) {
  .box01 {
    height: 350px;
  }
}

@media screen and (max-width: 767px) and (max-width: 500px) {
  .box01 {
    height: 310px;
  }
}

@media screen and (max-width: 767px) and (max-width: 420px) {
  .box01 {
    height: 290px;
  }
}

@media screen and (max-width: 767px) {
  .box01:nth-child(odd) {
    margin: 0 13px 45px 0;
  }
  .box01 .tit01 {
    font-size: 14px;
    margin-top: 12px;
  }
  .box01 .txt01 {
    font-size: 12px;
    margin-top: 4px;
  }
}
