/*----------
 common
 ----------*/
body {
  font-family: 'Noto Sans JP', sans-serif;
}

main {
  position: relative;
	min-height: 100vw;
}

.main-wrap {
  max-width: 390px;
	min-height: 100vw;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
  z-index: 1;
  padding-top: 50px;
  background: #fce2da;
}

.main-wrap--top {
  background: #e45d40;
}

@media screen and (max-width: 1000px) {
  .main-wrap {
    padding-top: 64px;
  }
}

a {
  transition: all 0.4s;
}

a:hover {
  opacity: 0.8;
}

/*----------
 utility 
 ----------*/

.u-sp-only {
  display: none;
}
.u-pc-only {
  display: block;
}

@media screen and (max-width: 767px) {
  .u-sp-only {
    display: block;
  }
  .u-pc-only {
    display: none;
  }
}

/* 初期状態（非表示） */
.u-fadein {
  opacity: 0;
  transform: translateY(20px); /* 下からスッと上がる感じ */
  transition: opacity 0.6s ease, transform 0.6s ease;
  will-change: opacity, transform;
}

/* 表示時に付与されるクラス */
.u-fadein.is-inview {
  opacity: 1;
  transform: none;
}