#top .header-wrap {
  height: auto;
}
@media screen and (max-width: 767px) {
  #top .header {
    position: absolute;
  }
}
#top .cv {
  display: none;
}
#top main {
  margin-bottom: 0;
}
#top .keyvisual {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin-top: 66px;
  background-size: cover;
}
#top .keyvisual video {
  width: 100%;
  height: 100%;
}
#top .keyvisual .slick-slider {
  margin-bottom: 0;
}
#top .keyvisual .slick-dots {
  bottom: 50px;
}
#top .keyvisual .slick-dots li button::before {
  color: #fff;
}
#top .keyvisual .copy {
  display: none;
}
#top .keyvisual .scroll {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
}
#top .keyvisual .scroll img {
  width: 80px;
  height: auto;
}
#top .keyvisual .youtube {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}
#top .keyvisual .youtube iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 479px) {
  #top .keyvisual {
    position: relative;
    margin-top: 56px;
  }
  #top .keyvisual .copy {
    width: 90%;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
  }
  #top .keyvisual .img {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    background-position: 100% 100%;
    background-repeat: no-repeat;
    background-size: cover;
  }
  #top .keyvisual .img a {
    display: block;
    width: 100%;
    height: 100%;
  }
  #top .keyvisual .img img {
    display: none;
  }
  #top .keyvisual .img.key01 {
    background-image: url(../../img/keyv_sp.jpg);
  }
  #top .keyvisual .img.key02 {
    background-image: url(../../img/keyv_sp02.jpg);
  }
}
#top .lead {
  text-align: center;
  font-size: 22px;
  font-size: 2.2rem;
}
@media screen and (min-width: 480px) and (max-width: 1200px) {
  #top .lead {
    font-size: 2.75px;
    font-size: 1.76rem;
  }
}
@media screen and (max-width: 767px) {
  #top .lead {
    font-size: 18px;
    font-size: 1.8rem;
  }
}
@media screen and (max-width: 767px) and (min-width: 480px) and (max-width: 1200px) {
  #top .lead {
    font-size: 2.25px;
    font-size: 1.44rem;
  }
}

@media print, screen and (min-width: 768px) {
  #top .lead br.sp {
    display: none;
  }
}
#top section.sec-concept h2 {
  text-align: center;
}
#top section.sec-concept h2 img {
  width: 213px;
}
@media print, screen and (min-width: 768px) {
  #top .concept-box {
    display: flex;
    justify-content: space-between;
    margin: 4em 0;
  }
}
@media print, screen and (min-width: 768px) {
  #top .concept-box .img {
    width: 57%;
  }
}
@media print, screen and (min-width: 768px) {
  #top .concept-box .body {
    width: 40%;
  }
}
@media screen and (max-width: 767px) {
  #top .concept-box .body {
    padding: 0 10px;
  }
}
#top .concept-box .body .title1 img {
  width: 90%;
  height: auto;
}
#top .concept-box .body .title2 {
  font-weight: bold;
  color: #1f88d6;
  font-size: 18px;
  font-size: 1.8rem;
}
@media screen and (min-width: 480px) and (max-width: 1200px) {
  #top .concept-box .body .title2 {
    font-size: 2.25px;
    font-size: 1.44rem;
  }
}
@media print, screen and (min-width: 768px) {
  #top .concept-box:last-child {
    flex-direction: row-reverse;
  }
}
#top .section-box {
  margin: 6em 0;
  display: block;
}
@media screen and (max-width: 767px) {
  #top .section-box {
    margin: 3em 0;
  }
}
#top .section-box .icon {
  text-align: center;
}
#top .section-box h2 {
  color: #1f88d6;
  text-align: center;
  font-weight: normal;
  margin-top: 0;
  font-size: 34px;
  font-size: 3.4rem;
}
@media screen and (min-width: 480px) and (max-width: 1200px) {
  #top .section-box h2 {
    font-size: 4.25px;
    font-size: 2.72rem;
  }
}
@media screen and (max-width: 767px) {
  #top .section-box h2 {
    font-size: 26px;
    font-size: 2.6rem;
  }
}
@media screen and (max-width: 767px) and (min-width: 480px) and (max-width: 1200px) {
  #top .section-box h2 {
    font-size: 3.25px;
    font-size: 2.08rem;
  }
}

#top .section-box .text {
  text-align: center;
}
#top .slider {
  margin-top: 2em;
  overflow: hidden;
  padding-bottom: 1em;
}
#top .slider .item {
  padding: 10px;
}
@media screen and (max-width: 767px) {
  #top .slider .item {
    padding: 5px;
    width: 90%;
  }
}
#top .slider .slick-dots {
  bottom: -12px;
}
#top .plan-box .title {
  color: #1f88d6;
  font-size: 22px;
  font-size: 2.2rem;
  margin: 1em 0;
}
@media screen and (min-width: 480px) and (max-width: 1200px) {
  #top .plan-box .title {
    font-size: 2.75px;
    font-size: 1.76rem;
  }
}
#top .plan-box .more {
  margin-top: 1em;
}
#top .plan-box .more .btn-01 {
  width: 100%;
}
#top section.sec-safety {
  background-image: url(../../img/bg_safety.jpg);
  background-size: 100% 100%;
  padding-top: 6em;
  padding-bottom: 6em;
}
@media screen and (max-width: 767px) {
  #top section.sec-safety {
    background: url(../../img/bg_safety.jpg) no-repeat 50% 50%;
    background-size: cover;
  }
}
#top section.sec-safety h2 {
  text-align: center;
  margin: 0;
}
@media print, screen and (min-width: 768px) {
  #top section.sec-safety h2 img {
    width: 830px;
  }
}
#top section.sec-safety .safety-box {
  padding: 0 10px;
}
#top section.sec-safety .safety-box .text {
  text-align: center;
  color: #1f88d6;
}
@media print, screen and (min-width: 768px) {
  #top section.sec-safety .safety-box .text {
    font-size: 20px;
    font-size: 2rem;
  }
}
@media screen and (min-width: 768px) and (min-width: 480px) and (max-width: 1200px) {
  #top section.sec-safety .safety-box .text {
    font-size: 2.5px;
    font-size: 1.6rem;
  }
}

#top .utility {
  padding: 0;
}
#top .utility li {
  list-style: none;
}
#top section.sec-sns {
  padding-top: 0e;
  padding-bottom: 2em;
  margin: 0;
}
#top section.sec-sns h2 {
  margin-top: 1.5em;
}
#top section.sec-sns .fb-wrap {
  width: 100%;
  max-width: 500px;
}
@media print, screen and (min-width: 768px) {
  #top section.sec-sns .fb-wrap {
    width: 500px;
    margin: auto;
    margin-top: 2em;
  }
}
#top section.movie {
  padding-top: 2em;
  padding-bottom: 2em;
}
#top section.movie .youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
#top section.movie .youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}
#top section.movie video {
  width: 100%;
}
#top .fromTopIn {
  transition: transform 1.0s ease, opacity 1.0s ease;
  transform: translate(0, 0);
  opacity: 1.0;
}
#top .fromTopOut {
  transition: transform 1.0s ease, opacity 1.0s ease;
  transform: translate(0, -10px);
  opacity: 0.0;
}
#top .fromBottomIn {
  transition: transform 1.0s ease, opacity 1.0s ease;
  transform: translate(0, 0);
  opacity: 1.0;
}
#top .fromBottomOut {
  transition: transform 1.0s ease, opacity 1.0s ease;
  transform: translate(0, 10px);
  opacity: 0.0;
}
#top .fromLeftIn {
  transition: transform 1.0s ease, opacity 1.0s ease;
  transform: translate(0, 0);
  opacity: 1.0;
}
#top .fromLeftOut {
  transition: transform 1.0s ease, opacity 1.0s ease;
  transform: translate(-10px, 0);
  opacity: 0.0;
}
#top .fromRightIn {
  transition: transform 1.0s ease, opacity 1.0s ease;
  transform: translate(0, 0);
  opacity: 1.0;
}
#top .fromRightOut {
  transition: transform 1.0s ease, opacity 1.0s ease;
  transform: translate(10px, 0);
  opacity: 0.0;
}