html {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 62.5%;
}

body {
  width: 100%;
}

#snaplist-inner {
  line-height: 1;
}

#snaplist-inner img,
#snaplist-inner video {
  width: 100%;
}

#videosnap_section .snaplist-inner__list-wrap, #page-snaplist.page-snaplist .snaplist-inner__list-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

#page-snaplist.page-snaplist .snaplist-inner__list-wrap {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

/* =========================
      for top page
========================= */
#videosnap_section.videosnap_section {
  padding: 4rem 0 2rem;
}

@media screen and (max-device-width: 767px) {
  #videosnap_section.videosnap_section {
    padding: calc(40* (100vw / 750)) 0;
  }
}

#videosnap_section .videosnap_section {
  width: 100% !important;
  overflow: hidden;
}

#videosnap_section .snaplist-inner {
  width: 100%;
}

#videosnap_section .snaplist-inner__list {
  max-width: 36rem;
  margin: 0 1.5rem 0;
}

@media screen and (max-device-width: 767px) {
  #videosnap_section .snaplist-inner__list {
    max-width: calc(250* (100vw / 750));
    margin: 0 calc(20* (100vw / 750)) 0;
  }
}

#videosnap_section .snaplist-inner__img {
  max-width: 36rem;
  width: 100%;
}

@media screen and (max-device-width: 767px) {
  #videosnap_section .snaplist-inner__img {
    max-width: calc(250* (100vw / 750));
  }
}

#videosnap_section .snaplist-inner__index {
  display: none;
}

/* =========================
    for snaplist page
========================= */
#page-snaplist.page-snaplist {
  text-align: center;
  padding: 8rem 0 10rem;
}

@media screen and (max-device-width: 767px) {
  #page-snaplist.page-snaplist {
    padding: calc(272* (100vw / 750)) 0 calc(43* (100vw / 750));
  }
}

#page-snaplist.page-snaplist .page-snaplist__ttl {
  font-size: 1.8rem;
  padding-bottom: 5.3rem;
}

@media screen and (max-device-width: 767px) {
  #page-snaplist.page-snaplist .page-snaplist__ttl {
    font-size: calc(36* (100vw / 750));
    padding-bottom: calc(84* (100vw / 750));
  }
}

#page-snaplist.page-snaplist .snaplist-inner {
  max-width: 84rem;
  width: 100%;
  margin: 0 auto;
}

@media screen and (max-device-width: 767px) {
  #page-snaplist.page-snaplist .snaplist-inner {
    max-width: calc(676* (100vw / 750));
  }
}

#page-snaplist.page-snaplist .snaplist-inner__list {
  max-width: 40rem;
  width: 100%;
  padding-bottom: 5rem;
}

@media screen and (max-device-width: 767px) {
  #page-snaplist.page-snaplist .snaplist-inner__list {
    max-width: calc(676* (100vw / 750));
    padding-bottom: calc(75* (100vw / 750));
  }
}

#page-snaplist.page-snaplist .snaplist-inner__img {
  width: 100%;
  padding-bottom: 2rem;
}

@media screen and (max-device-width: 767px) {
  #page-snaplist.page-snaplist .snaplist-inner__img {
    padding-bottom: calc(40* (100vw / 750));
  }
}

#page-snaplist.page-snaplist .snaplist-inner__index {
  font-size: 1.4rem;
}

@media screen and (max-device-width: 767px) {
  #page-snaplist.page-snaplist .snaplist-inner__index {
    font-size: calc(28* (100vw / 750));
  }
}
/*# sourceMappingURL=general.css.map */