@charset "UTF-8";
/* SP用設定 ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
@media screen and (max-width: 800px) {

  /* ↓ top ↓ */
  
  
  
  /* ↓ movie ↓ */
  #movie .bg {display: none;}
  #movie .content {
    position: static;
    padding-bottom: 3em;
  }
  #movie .movie-box {width: 72%;}
  #st-movie {
    transform: translate(-80%, 25%);
  }
  
  
  
  /* ↓ feature ↓ */
  #feature .content {
    display: block;
    width: 100%;
  }
  #feature .box {
    width: 83%;
    margin: 0 auto;
  }
  #modal1 .modal-wrapper,
  #modal2 .modal-wrapper {
    width: 85%;
    max-height: 80vh;
  }
  .modal .close {top: 25px;}


  /* ↓ approach ↓ */
  #approach {
    width: 100%;
    display: block;
  }

  /* ↓ howto ↓ */
  #howto {
    width: 65.5%;
    display: block;
    margin: 2em auto;
  }
  
  
  
  
  
  
  
}