/*
 * common
 */
.for-pc {
  display: block !important;
}

.for-sp {
  display: none !important;
}

@media(max-width:992px) {
  .for-pc {
    display: none !important;
  }

  .for-sp {
    display: block !important;
  }
}

h2 {
  margin: 0;
}

p {
  margin: 0;
}

.main-wrapper {
  width: 100%;
  /* max-width: 750px; */
  background-color: #FFFFFF;
  margin: 0 auto;
  overflow: hidden;
  font-family: var(--font-family-1);
}

.top-title {
  color: #FFF;
  font-weight: bold;
  text-align: center;
  letter-spacing: 10px;
}

@media(max-width:992px) {
  .top-title {
    letter-spacing: 5px;
  }
}

.top-subtitle {
  font-weight: bold;
  letter-spacing: 5px;
  font-size: 40px;
}

@media(max-width:992px) {
  .top-subtitle {
      font-size: 26px;
  }
}

.top-mini-subtitle {
  color: var(--txt-color-3);
}

.underlayer-top-title {
    color: #FFF;
    font-weight: bold;
}

.txt-underline-yellow {
  position: relative;
  display: inline-block;
  z-index: 0;
}

.txt-underline-yellow::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0.1em;
  width: 100%;
  height: 16px;
  background-color: var(--sub-color-3);
  z-index: -1;
  opacity: 0.7;
}

.fuwafuwa {
  transition: transform 1s ease-out;
  will-change: transform;
}

#back-to-top {
    position: fixed;
    right: 20px;
    bottom: 125px;
    width: 50px;
    height: 50px;
    background: #FFF;
    color: var(--main-color);
    text-align: center;
    line-height: 50px;
    font-size: 20px;
    border-radius: 50%;
    box-shadow: 0 4px 6px rgba(0,0,0,0.3);
    cursor: pointer;
    display: none;
    z-index: 1000;
    border: 2px solid var(--main-color);
}

#back-to-top::before{
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -60%);
    width: 0;
    height: 0;
    border-left: 9px solid transparent;
    border-right: 9px solid transparent;
    border-bottom: 17px solid var(--main-color);
}

#back-to-top:hover {
  opacity: 0.7;
}

:target {
  scroll-margin-top: 100px; /* 固定ヘッダーの高さ分 */
}