/*----------------------------------------------------------------------
よく使うモジュール一覧
----------------------------------------------------------------------*/
html {
  overflow-y: scroll;
}
sup, sub {
  font-size: 65%;
}
a {
  text-decoration: none;
}
a:active, a:focus {
  outline: none;
}
.sp {
  display: none;
}
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
  display: block;
}
img {
  height: auto;
  max-width: 100%;
  image-rendering: -webkit-optimize-contrast;
}

/* ---------- 以下エフェクトに関するcss ---------- */
.tr_slideUp,
.tr_fadeUp,
.tr_fadeLeft,
.tr_bounce{
  opacity: 0;
}

.slideUp {
  animation-name: slideUpAnime;
  animation-fill-mode: forwards;
  animation-duration: .2s;
}

@keyframes slideUpAnime {
  0% {
    opacity: 1;
    transform: translateY(30px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.fadeUp {
  animation-name: fadeUpAnime;
  animation-fill-mode: forwards;
  animation-duration: .7s;
}

@keyframes fadeUpAnime {
  0% {
    opacity: 0;
    transform: translateY(50px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.fadeLeft {
  animation-name: fadeLeftAnime;
  animation-fill-mode: forwards;
  animation-duration: .7s;
}

@keyframes fadeLeftAnime {
  0% {
    opacity: 0;
    transform: translateX(100px);
  }

  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

.bounce {
  animation-name: bounceAnime;
  animation-fill-mode: forwards;
  animation-duration: .4s;
}

@keyframes bounceAnime {
  0% {
    opacity: 1;
	transform: scale(0);
  }
	

  50% {
	 transform: scale(1.15);
  }

  100% {
    opacity: 1;
	 transform: scale(1);
  }
}


@media (min-width: 768px) {
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
  }
}

@media screen and (max-width: 768px) {
  .sp {
    display: block!important;
  }
  .pc {
    display: none!important;
  }
  img {
    image-rendering: auto;
  }
}