@charset "UTF-8";
#container {
  /**scss共通***/
}

#container img {
  width: 100%;
}

#container img.climg {
  image-rendering: -webkit-optimize-contrast;
}

@media (max-width: 640px) {
  #container img.climg {
    image-rendering: auto;
  }
}

body #container {
  font-size: 14px;
  *font-size: small;
  *font: x-small;
  font-family: 'Noto Sans JP', BlinkMacSystemFont, 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', '游ゴシック  Medium', meiryo, sans-serif;
  text-align: left;
  line-height: 160%;
  color: #333;
}

body.is-hidden {
  overflow: hidden;
}

#container {
  /**scss共通ここまで***/
}

#container .clearfix {
  zoom: 1;
  clear: both;
}

#container .clearfix:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  clear: both;
}

#container .pc_only {
  display: block;
}

#container .sp_only {
  display: none;
}

#container .pc_only_inline {
  display: inline-block;
}

#container .sp_only_inline {
  display: none;
}

@media (max-width: 640px) {
  #container .pc_only {
    display: none;
  }
  #container .sp_only {
    display: block;
  }
  #container .pc_only_inline {
    display: none;
  }
  #container .sp_only_inline {
    display: inline-block;
  }
}

#container .onmouse {
  -webkit-transition: all .4s ease-out;
  transition: all .4s ease-out;
}

#container .onmouse:hover {
  opacity: 0.6;
}

#container .onmouse2 {
  display: inline-block;
  -webkit-transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1);
  transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1);
  -webkit-transform: scale(1);
          transform: scale(1);
}

#container .onmouse2:hover > img {
  opacity: 1 !important;
}

#container .onmouse2:hover {
  opacity: 1 !important;
  -webkit-transform: scale(1.075);
          transform: scale(1.075);
}

#container .onmouse3 {
  display: inline-block;
  -webkit-transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1);
  transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1);
  -webkit-transform: translate(-50%, -50%) scale(1);
          transform: translate(-50%, -50%) scale(1);
}

@media (max-width: 640px) {
  #container .onmouse3 {
    -webkit-transform: translate(0%, 0%) scale(1);
            transform: translate(0%, 0%) scale(1);
  }
}

#container .onmouse3:hover > img {
  opacity: 1 !important;
}

#container .onmouse3:hover {
  opacity: 1 !important;
  -webkit-transform: translate(-50%, -50%) scale(1.075);
          transform: translate(-50%, -50%) scale(1.075);
}

@media (max-width: 640px) {
  #container .onmouse3:hover {
    -webkit-transform: translate(0%, 0%) scale(1.075);
            transform: translate(0%, 0%) scale(1.075);
  }
}

#container *, #container *:before, #container *:after {
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

#container .fade__up {
  -webkit-transition: all 0.8s cubic-bezier(0.37, 0, 0.63, 1);
  transition: all 0.8s cubic-bezier(0.37, 0, 0.63, 1);
  opacity: 0;
  -webkit-transform: translate(0%, 30px);
          transform: translate(0%, 30px);
}

#container .fade__up.active {
  opacity: 1;
  -webkit-transform: translate(0%, 0px);
          transform: translate(0%, 0px);
}

#container .fade__in {
  -webkit-transition: all 0.8s cubic-bezier(0.37, 0, 0.63, 1);
  transition: all 0.8s cubic-bezier(0.37, 0, 0.63, 1);
  opacity: 0;
  -webkit-transform: translate(0%, 0px);
          transform: translate(0%, 0px);
}

#container .fade__in.active {
  opacity: 1;
  -webkit-transform: translate(0%, 0px);
          transform: translate(0%, 0px);
}

#container .delay1 {
  -webkit-transition-delay: 0s;
          transition-delay: 0s;
}

#container .delay2 {
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}

#container .delay3 {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}

#container .delay4 {
  -webkit-transition-delay: 0.9s;
          transition-delay: 0.9s;
}

#container .delay5 {
  -webkit-transition-delay: 1.2s;
          transition-delay: 1.2s;
}
#container .delay6 {
  -webkit-transition-delay: 1.5s;
          transition-delay: 1.5s;
}
/*****************************************/
.f60 {
  font-size: 60px;
  line-height: 125%;
}

@media (max-width: 640px) {
  .f60 {
    font-size: 7.2vw;
  }
}

.f50 {
  font-size: 50px;
  line-height: 125%;
}

@media (max-width: 640px) {
  .f50 {
    font-size: 8vw;
  }
}

.f40 {
  font-size: 40px;
  line-height: 135%;
}

@media (max-width: 640px) {
  .f40 {
    font-size: 7.5vw;
  }
}

.f38 {
  font-size: 38px;
  line-height: 115%;
}

@media (max-width: 640px) {
  .f38 {
    font-size: 7vw;
  }
}

.f36 {
  font-size: 36px;
  line-height: 115%;
}

@media (max-width: 1240px) {
  .f36 {
    font-size: 3vw;
  }
}

@media (max-width: 640px) {
  .f36 {
    font-size: 6.5vw;
  }
}

.f36b {
  font-size: 36px;
  line-height: 115%;
}

@media (max-width: 1240px) {
  .f36b {
    font-size: 3vw;
  }
}

@media (max-width: 640px) {
  .f36b {
    font-size: 5vw;
  }
}

.f36c {
  font-size: 36px;
  line-height: 115%;
}

@media (max-width: 1240px) {
  .f36c {
    font-size: 3vw;
  }
}

@media (max-width: 640px) {
  .f36c {
    font-size: 5.5vw;
  }
}

.f36d {
  font-size: 26px;
  line-height: 115%;
}

@media (max-width: 1240px) {
  .f36d {
    font-size: 2.25vw;
  }
}

@media (max-width: 640px) {
  .f36d {
    font-size: 4.8vw;
  }
}

.f34 {
  font-size: 34px;
  line-height: 140%;
}

@media (max-width: 640px) {
  .f34 {
    font-size: 6vw;
  }
}

.f32 {
  font-size: 32px;
  line-height: 140%;
}

@media (max-width: 640px) {
  .f32 {
    font-size: 5.7vw;
  }
}

.f30 {
  font-size: 30px;
  line-height: 140%;
}

@media (max-width: 640px) {
  .f30 {
    font-size: 5vw;
  }
}

.f30b {
  font-size: 30px;
  line-height: 140%;
}

@media (max-width: 1240px) {
  .f30b {
    font-size: 2.6vw;
  }
}

@media (max-width: 640px) {
  .f30b {
    font-size: 4vw;
  }
}

.f28 {
  font-size: 28px;
  line-height: 140%;
}

@media (max-width: 1240px) {
  .f28 {
    font-size: 2.4vw;
  }
}

@media (max-width: 640px) {
  .f28 {
    font-size: 4.9vw;
  }
}

.f26 {
  font-size: 26px;
  line-height: 140%;
}

@media (max-width: 1240px) {
  .f26 {
    font-size: 2.25vw;
  }
}

@media (max-width: 640px) {
  .f26 {
    font-size: 4.8vw;
  }
}

.f26b {
  font-size: 26px;
  /* line-height: 180%; */
  line-height: 150%;
}

@media (max-width: 1240px) {
  .f26b {
    font-size: 2vw;
  }
}

@media (max-width: 640px) {
  .f26b {
    font-size: 4vw;
  }
}

.f24 {
  font-size: 24px;
  line-height: 140%;
}

@media (max-width: 1240px) {
  .f24 {
    font-size: 2.0vw;
  }
}

@media (max-width: 640px) {
  .f24 {
    font-size: 4.6vw;
  }
}

.f22 {
  font-size: 22px;
  line-height: 140%;
}

@media (max-width: 1240px) {
  .f22 {
    font-size: 2.0vw;
  }
}

@media (max-width: 640px) {
  .f22 {
    font-size: 4vw;
  }
}

.f21 {
  font-size: 21px;
}
@media (max-width: 1240px) {
  .f21 {
    font-size: 2.1vw;
  }
}
@media (max-width: 640px) {
  .f21 {
    font-size: 4vw;
  }
}

.f20 {
  font-size: 20px;
  line-height: 140%;
}

@media (max-width: 1240px) {
  .f20 {
    font-size: 2vw;
  }
}

@media (max-width: 640px) {
  .f20 {
    font-size: 3.4vw;
  }
}

@media (max-width: 640px) {
  .f20-2 {
    font-size: 4.4vw;
  }
}

.f18 {
  font-size: 18px;
  line-height: 140%;
}

@media (max-width: 1240px) {
  .f18 {
    font-size: 1.5vw;
  }
}

@media (max-width: 640px) {
  .f18 {
    font-size: 3.1vw;
  }
}

@media (max-width: 640px) {
  .f18--2 {
    font-size: 3.0vw;
  }
}

.f18--3 {
  font-size: 18px;
  line-height: 140%;
}

@media (max-width: 1240px) {
  .f18--3 {
    font-size: 1.5vw;
  }
}

@media (max-width: 640px) {
  .f18--3 {
    font-size: 2.9vw;
  }
}

.f16 {
  font-size: 16px;
  line-height: 140%;
}

@media (max-width: 1240px) {
  .f16 {
    font-size: 1.4vw;
  }
}

@media (max-width: 640px) {
  .f16 {
    font-size: 3.6vw;
  }
}

.f15 {
  font-size: 15px;
  line-height: 140%;
}

@media (max-width: 1240px) {
  .f15 {
    font-size: 1.3vw;
  }
}

@media (max-width: 640px) {
  .f15 {
    font-size: 3.4vw;
  }
}

.f14 {
  font-size: 14px;
  line-height: 40px;
  vertical-align: top;
}

@media (max-width: 1240px) {
  .f14 {
    font-size: 1.2vw;
  }
}

@media (max-width: 640px) {
  .f14 {
    font-size: 3.4vw;
  }
}

.f12 {
  font-size: 12px;
  line-height: 125%;
}

@media (max-width: 640px) {
  .f12 {
    font-size: 2.8vw;
  }
}

.f10 {
  font-size: 12px;
  line-height: 125%;
}

@media (max-width: 640px) {
  .f10 {
    font-size: 2.4vw;
  }
}

/*****************************************/
/*# sourceMappingURL=base.css.map */