@charset "UTF-8";
/*
 animate.cssは自動生成しているため、
 直接上書きしないでください。
*/
/* Vendor */
/* Site settings */
/* Base */
/* 追加 */
/* 共通要素 */
html {
  font-size: 62.5%;
}

body {
  margin: 0;
  width: 100%;
  max-width: 100%;
  font-size: 1.6rem;
  line-height: 1.5;
  font-family: YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif, "A1ゴシック R", "A1 Gothic R", -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue;
  font-weight: 400;
  color: #464545;
}

_:lang(x)::-ms-backdrop, body {
  font-family: YuGothic, "A1ゴシック R", "A1 Gothic R", "Segoe UI", Meiryo, sans-serif;
}

#site-container {
  overflow-x: hidden;
  overflow-y: hidden;
}

.container {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
  -webkit-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

.content {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
  -webkit-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

.flex-wrapper {
  -webkit-display: flex;
  -ms-display: flex;
  display: flex;
  -webkit-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  -webkit-align-items: center;
  -ms-align-items: center;
  align-items: center;
}

.img-wrapper img {
  display: block;
  width: 100%;
}

ul {
  list-style-type: none;
  padding-left: 0;
}

h1, h2, h3, h4, h5 {
  margin: 0;
  padding: 0;
}

section, div, p, ul, li {
  margin: 0;
  padding: 0;
}

em {
  font-style: normal;
}

strong, em, b {
  font-family: 500;
}

.is-pc {
  display: block !important;
}

.is-tb {
  display: none !important;
}

.below-tb {
  display: none !important;
}

.above-tb {
  display: block !important;
}

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

.clear-both {
  clear: both;
}

.overflow-auto {
  overflow: auto;
}

.text-align-center {
  text-align: center;
}

.text-align-left {
  text-align: left;
}

.text-align-right {
  text-align: right;
}

.font-weight-bold {
  font-weight: bold;
}

.margin-0-auto {
  margin: 0 auto;
}

.margin-right-auto {
  margin-right: auto;
}

.margin-left-auto {
  margin-left: auto;
}

.float-left {
  float: left;
}

.position-relative {
  position: relative;
}

.vertical-align-middle {
  vertical-align: middle;
}

.flex-center {
  -webkit-display: flex;
  -ms-display: flex;
  display: flex;
  -webkit-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
}

.flex-space-arr {
  -webkit-display: flex;
  -ms-display: flex;
  display: flex;
  -webkit-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
}

.flex {
  -webkit-display: flex;
  -ms-display: flex;
  display: flex;
}

@media screen and (max-width: 1319px) {
  .container {
    padding-left: 60px;
    padding-right: 60px;
  }
}
@media screen and (max-width: 1199px) {
  .container {
    padding-left: 50px;
    padding-right: 50px;
  }
}
@media screen and (max-width: 959px) {
  .is-pc {
    display: none !important;
  }
  .is-tb {
    display: block !important;
  }
  .below-tb {
    display: block !important;
  }
  .content {
    padding-left: 50px;
    padding-right: 50px;
  }
}
@media screen and (max-width: 599px) {
  .container, .content {
    padding-left: 30px;
    padding-right: 30px;
  }
  .above-tb {
    display: none !important;
  }
  .is-tb {
    display: none !important;
  }
  .is-sp {
    display: block !important;
  }
}
@media screen and (max-width: 479px) {
  .container, .content {
    padding-left: 20px;
    padding-right: 20px;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
  }
}
@media screen and (max-width: 359px) {
  .container, .content {
    padding-left: 15px;
    padding-right: 15px;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
  }
}
/* Layouts */
.animate.fadeup {
  opacity: 0;
  transform: translateY(40px);
}
.animate.fadeup.is-on {
  opacity: 1;
  transform: translateY(0);
  -moz-transition: all 2s cubic-bezier(0.19, 1, 0.22, 1);
  -ms-transition: all 2s cubic-bezier(0.19, 1, 0.22, 1);
  -o-transition: all 2s cubic-bezier(0.19, 1, 0.22, 1);
  -webkit-transition: all 2s cubic-bezier(0.19, 1, 0.22, 1);
  transition: all 2s cubic-bezier(0.19, 1, 0.22, 1);
}
.animate.blurin {
  opacity: 0;
}
.animate.blurin.is-on {
  opacity: 1;
  -webkit-animation: blurin 2s cubic-bezier(0.19, 1, 0.22, 1) forwards;
  -moz-animation: blurin 2s cubic-bezier(0.19, 1, 0.22, 1) forwards;
  animation: blurin 2s cubic-bezier(0.19, 1, 0.22, 1) forwards;
}

@keyframes blurin {
  0% {
    -webkit-filter: blur(12px) opacity(0%);
    -moz-filter: blur(12px) opacity(0%);
    filter: blur(12px) opacity(0%);
  }
  100% {
    -webkit-filter: blur(0) opacity(100%);
    -moz-filter: blur(0) opacity(100%);
    filter: blur(0) opacity(100%);
  }
}
#the-box {
  transform-origin: center center;
  -webkit-transform: translate(-50%, -50%) rotate(180deg);
  -moz-transform: translate(-50%, -50%) rotate(180deg);
  transform: translate(-50%, -50%) rotate(180deg);
  -webkit-animation: partyin 1.5s cubic-bezier(0.19, 1, 0.22, 1) 2s 1 forwards;
  -moz-animation: partyin 1.5s cubic-bezier(0.19, 1, 0.22, 1) 2s 1 forwards;
  animation: partyin 1.5s cubic-bezier(0.19, 1, 0.22, 1) 2s 1 forwards;
}
#the-box span.top-left {
  -webkit-animation: scaledown 0.75s cubic-bezier(0.19, 1, 0.22, 1) 3s forwards;
  -moz-animation: scaledown 0.75s cubic-bezier(0.19, 1, 0.22, 1) 3s forwards;
  animation: scaledown 0.75s cubic-bezier(0.19, 1, 0.22, 1) 3s forwards;
}
#the-box span.top-left::after {
  -webkit-animation: scaledown2 0.75s cubic-bezier(0.19, 1, 0.22, 1) 3s forwards;
  -moz-animation: scaledown2 0.75s cubic-bezier(0.19, 1, 0.22, 1) 3s forwards;
  animation: scaledown2 0.75s cubic-bezier(0.19, 1, 0.22, 1) 3s forwards;
}
#the-box span.bottom-right {
  -webkit-animation: scaledown 0.75s cubic-bezier(0.19, 1, 0.22, 1) 3s forwards;
  -moz-animation: scaledown 0.75s cubic-bezier(0.19, 1, 0.22, 1) 3s forwards;
  animation: scaledown 0.75s cubic-bezier(0.19, 1, 0.22, 1) 3s forwards;
}
#the-box span.bottom-right::after {
  -webkit-animation: scaledown2 0.75s cubic-bezier(0.19, 1, 0.22, 1) 3s forwards;
  -moz-animation: scaledown2 0.75s cubic-bezier(0.19, 1, 0.22, 1) 3s forwards;
  animation: scaledown2 0.75s cubic-bezier(0.19, 1, 0.22, 1) 3s forwards;
}

@keyframes partyin {
  0% {
    -webkit-transform: translate(-50%, -50%) rotate(180deg);
    -moz-transform: translate(-50%, -50%) rotate(180deg);
    transform: translate(-50%, -50%) rotate(180deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: translate(-50%, -50%) rotate(0deg);
    -moz-transform: translate(-50%, -50%) rotate(0deg);
    transform: translate(-50%, -50%) rotate(0deg);
    opacity: 1;
  }
}
@keyframes cardFadein {
  0% {
    -webkit-transform: translate(0, 100px);
    -moz-transform: translate(0, 100px);
    transform: translate(0, 100px);
    opacity: 0.3;
  }
  100% {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@keyframes scaledown {
  0% {
    width: 2560px;
    height: 400px;
  }
  100% {
    width: 64px;
    height: 10px;
  }
}
@keyframes scaledown2 {
  0% {
    width: 400px;
    height: 2560px;
  }
  100% {
    width: 10px;
    height: 64px;
  }
}
@media screen and (max-width: 959px) {
  @keyframes scaledown {
    0% {
      width: 2560px;
      height: 400px;
    }
    100% {
      width: 56px;
      height: 8px;
    }
  }
  @keyframes scaledown2 {
    0% {
      width: 400px;
      height: 2560px;
    }
    100% {
      width: 8px;
      height: 56px;
    }
  }
}
@media screen and (max-width: 599px) {
  @keyframes scaledown {
    0% {
      width: 2560px;
      height: 400px;
    }
    100% {
      width: 48px;
      height: 7px;
    }
  }
  @keyframes scaledown2 {
    0% {
      width: 400px;
      height: 2560px;
    }
    100% {
      width: 7px;
      height: 48px;
    }
  }
}/*# sourceMappingURL=animate.css.map */