@charset "utf-8";
@media only screen and (min-width: 0px) and (max-width: 1920px) {
  .intro.lp02 {
    padding-top: 6.25vw;
  }
  .intro.lp02 figure {
    width: 93.22916666666666vw;
    padding-bottom: 2.604166666666667vw;
    min-width: 1200px;
  }
  .intro.lp02 figure figcaption {
    top: 3.6458333333333335vw;
    font-size: 1.3020833333333335vw;
  }
  #lp01 .sec01,
  #lp01 .sec02,
  #lp02 .sec01,
  #lp02 .sec02,
  #lp02 .sec03 {
    width: 100%;
    min-width: 1000px;
    padding-top: 52.083333333333336vw;
    background-size: 100%;
  }
  #lp01 .sec03,
  #lp01 .sec04,
  #lp02 .sec04 {
    width: 100%;
    min-width: 1000px;
    padding-top: 54.6875vw;
    background-size: 100%;
  }
  .charactor div {
    width: 100%;
  }
  #lp01 .sec01 div dl,
  #lp02 .sec01 div dl {
    left: 19.791666666666664vw;
    bottom: -6.25vw;
    width: 22.291666666666668vw;
    padding: 3.125vw 3.6458333333333335vw;
  }
  #lp01 .sec02 div dl,
  #lp02 .sec02 div dl {
    left: 57.291666666666664vw;
    bottom: 0;
    width: 21.875vw;
    padding: 3.125vw 3.6458333333333335vw;
    z-index: 80;
  }
  #lp01 .sec03 div dl,
  #lp02 .sec03 div dl {
    left: 19.791666666666664vw;
    bottom: -5.729166666666666vw;
    width: 21.875vw;
    padding: 3.125vw 3.6458333333333335vw;
  }
  #lp01 .sec04 div dl,
  #lp02 .sec04 div dl {
    left: 57.291666666666664vw;
    bottom: 0px;
    width: 22.291666666666668vw;
    padding: 3.125vw 3.6458333333333335vw;
  }
  .charactor div dl dt {
    font-size: 1.4583333333333333vw;
    margin-bottom: 1.0416666666666665vw;
  }
  .charactor div dl dd {
    font-size: 0.8333333333333334vw;
  }
  #lp01 .sec03 div dl dd span {
    font-size: 0.625vw;
  }
  .sec01 div dl:before,
  .sec02 div dl:before,
  .sec03 div dl:before,
  .sec04 div dl:before {
    left: -1.5625vw;
    top: -2.083333333333333vw;
    width: 10vw;
    height: 5.625vw;
    background-size: 100%;
  }
}

@media only screen and (min-width: 0px) and (max-width: 1200px) {
  #lp01 .sec01,
  #lp01 .sec02,
  #lp01 .sec03,
  #lp02 .sec01,
  #lp02 .sec02,
  #lp02 .sec03 {
    padding-top: 650px;
  }
  #lp01 .sec04,
  #lp02 .sec04 {
    padding-top: 670px;
  }
  #lp01 .sec01 div dl,
  #lp02 .sec01 div dl {
    left: 200px;
    bottom: -50px;
    width: 304px;
    padding: 38px 44px;
  }
  #lp01 .sec02 div dl,
  #lp02 .sec02 div dl {
    left: 688px;
    bottom: 20px;
    width: 300px;
    padding: 38px 44px;
  }
  #lp01 .sec03 div dl,
  #lp02 .sec03 div dl {
    left: 200px;
    bottom: -50px;
    width: 310px;
    padding: 38px 44px;
  }
  #lp01 .sec04 div dl,
  #lp02 .sec04 div dl {
    left: 688px;
    bottom: 10px;
    width: 310px;
    padding: 38px 44px;
  }
  .charactor div dl dt {
    font-size: 18px;
  }
  .charactor div dl dd {
    font-size: 12px;
  }
  #lp01 .sec03 div dl dd span {
    font-size: 10px;
  }
  .sec01 div dl:before,
  .sec02 div dl:before,
  .sec03 div dl:before,
  .sec04 div dl:before {
    left: -20px;
    top: -24px;
    width: 120px;
    height: 68px;
    background-size: 100%;
  }
}

@media only screen and (min-width: 0px) and (max-width: 800px) {
  .buttons {
    bottom: 11.25vw;
  }
  .buttons li {
    width: 14.000000000000002vw;
  }
}

@media only screen and (min-width: 0px) and (max-width: 640px) {
  #content_wrap .sp_none {
    display: none;
  }
  #content_wrap .hstype01 {
    font-size: 1em;
  }
  #content_wrap .hstype02 {
    font-size: 1.4rem;
    margin: 30px auto 10px auto;
  }
}
@media only screen and (min-width: 0px) and (max-width: 450px) {
  #content_wrap .hstype02 {
    /* font-size: 2.4rem; */
    margin: 30px auto 20px;
  }
}

.t_wrap {
  width: 1000px;
  margin: 0 auto;
  display: block;
}
@media only screen and (min-width: 0px) and (max-width: 1025px) {
  .t_wrap {
    width: 88%;
  }
}