/* SETTING
================================================================================ */
body {
  background: #fff;
}

dfn {
  font-style: normal;
}

#contents,
#mainContents {
  width: 100%;
  background: transparent;
  float: none;
  clear: both;
  padding: 0;
  margin: 0;
  line-height: 1;
}

.sp_container {
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
}

.sp_container_m {
  max-width: 770px;
  margin-left: auto;
  margin-right: auto;
}

.sp_content {
  overflow: hidden;
  position: relative;
  color: #000;
  font-size: clamp(14px, 1.6vw, 16px);
  font-family: "Noto Sans JP", sans-serif;
  padding: 0;
  margin: 0;
  z-index: 0;
}
.sp_content div {
  box-sizing: border-box;
}
.sp_content img {
  max-width: 100%;
  height: auto;
}
.sp_content a {
  cursor: pointer;
  color: #dc0610;
}
.sp_content a:visited {
  color: #b09181;
}
.sp_content a:hover, .sp_content a:active, .sp_content a:focus {
  color: rgb(248.814159292, 28.185840708, 38.4955752212);
}
.sp_content a:hover img, .sp_content a:active img, .sp_content a:focus img {
  -webkit-filter: brightness(110%);
          filter: brightness(110%);
}
.sp_content a img {
  display: block;
  transition: all 0.6s;
}
.sp_content div {
  box-sizing: border-box;
}
.sp_content .alt {
  display: none;
}
.sp_content figure {
  margin: 0;
}
.sp_content main {
  position: relative;
  z-index: 0;
}
.sp_content main *:not(.sp_news) p:not(.cap, .title) {
  line-height: 1.8;
  text-align: justify;
  text-justify: inter-character;
}

.animated {
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}

@-webkit-keyframes cameraflash {
  0%, 100% {
    opacity: 1;
    -webkit-filter: blur(0);
            filter: blur(0);
  }
  4%, 8% {
    opacity: 1;
  }
  7%, 11% {
    opacity: 0;
  }
  12% {
    opacity: 1;
    -webkit-filter: blur(10px);
            filter: blur(10px);
  }
  14%, 16% {
    opacity: 1;
  }
  13%, 15%, 17% {
    opacity: 0;
  }
  20% {
    opacity: 1;
    -webkit-filter: blur(0px);
            filter: blur(0px);
  }
}

@keyframes cameraflash {
  0%, 100% {
    opacity: 1;
    -webkit-filter: blur(0);
            filter: blur(0);
  }
  4%, 8% {
    opacity: 1;
  }
  7%, 11% {
    opacity: 0;
  }
  12% {
    opacity: 1;
    -webkit-filter: blur(10px);
            filter: blur(10px);
  }
  14%, 16% {
    opacity: 1;
  }
  13%, 15%, 17% {
    opacity: 0;
  }
  20% {
    opacity: 1;
    -webkit-filter: blur(0px);
            filter: blur(0px);
  }
}
@-webkit-keyframes sparkling {
  0%, 100% {
    opacity: 1;
    -webkit-transform: perspective(500px) translate3d(0, 200px, 0);
            transform: perspective(500px) translate3d(0, 200px, 0);
  }
  50% {
    opacity: 0.6;
    -webkit-transform: perspective(500px) translate3d(0, 150px, 50px);
            transform: perspective(500px) translate3d(0, 150px, 50px);
  }
}
@keyframes sparkling {
  0%, 100% {
    opacity: 1;
    -webkit-transform: perspective(500px) translate3d(0, 200px, 0);
            transform: perspective(500px) translate3d(0, 200px, 0);
  }
  50% {
    opacity: 0.6;
    -webkit-transform: perspective(500px) translate3d(0, 150px, 50px);
            transform: perspective(500px) translate3d(0, 150px, 50px);
  }
}
@-webkit-keyframes flash {
  0%, 20%, 50%, 70%, 100% {
    opacity: 1;
  }
  10%, 60%, 100% {
    opacity: 0.4;
  }
  25%, 75% {
    opacity: 0;
  }
}
@keyframes flash {
  0%, 20%, 50%, 70%, 100% {
    opacity: 1;
  }
  10%, 60%, 100% {
    opacity: 0.4;
  }
  25%, 75% {
    opacity: 0;
  }
}
.flash {
  -webkit-animation-name: flash;
          animation-name: flash;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.wow[class*=fadeIn] {
  opacity: 0;
}
.wow[class*=fadeIn][style*=visible] {
  opacity: 1;
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
  }
}
.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

/* BTNs
======================================== */
.sp_btns {
  display: flex;
  justify-content: center;
  gap: clamp(30px, 5vw, 50px) clamp(14px, 4vw, 40px);
}
.sp_btns a {
  display: block;
}

@-webkit-keyframes reel1 {
  0% {
    -webkit-transform: translate3d(0%, 0, 0);
            transform: translate3d(0%, 0, 0);
    opacity: 0;
  }
  10% {
    -webkit-transform: translate3d(-20%, 0, 0);
            transform: translate3d(-20%, 0, 0);
    opacity: 1;
  }
  60% {
    -webkit-transform: translate3d(-70%, 0, 0);
            transform: translate3d(-70%, 0, 0);
    opacity: 1;
  }
  80% {
    -webkit-transform: translate3d(-90%, 0, 0);
            transform: translate3d(-90%, 0, 0);
    opacity: 0;
  }
}

@keyframes reel1 {
  0% {
    -webkit-transform: translate3d(0%, 0, 0);
            transform: translate3d(0%, 0, 0);
    opacity: 0;
  }
  10% {
    -webkit-transform: translate3d(-20%, 0, 0);
            transform: translate3d(-20%, 0, 0);
    opacity: 1;
  }
  60% {
    -webkit-transform: translate3d(-70%, 0, 0);
            transform: translate3d(-70%, 0, 0);
    opacity: 1;
  }
  80% {
    -webkit-transform: translate3d(-90%, 0, 0);
            transform: translate3d(-90%, 0, 0);
    opacity: 0;
  }
}
@-webkit-keyframes reel2 {
  40% {
    -webkit-transform: translate3d(0%, 0, 0);
            transform: translate3d(0%, 0, 0);
    opacity: 0;
  }
  50% {
    -webkit-transform: translate3d(-20%, 0, 0);
            transform: translate3d(-20%, 0, 0);
    opacity: 1;
  }
  80% {
    -webkit-transform: translate3d(-70%, 0, 0);
            transform: translate3d(-70%, 0, 0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate3d(-90%, 0, 0);
            transform: translate3d(-90%, 0, 0);
    opacity: 0;
  }
}
@keyframes reel2 {
  40% {
    -webkit-transform: translate3d(0%, 0, 0);
            transform: translate3d(0%, 0, 0);
    opacity: 0;
  }
  50% {
    -webkit-transform: translate3d(-20%, 0, 0);
            transform: translate3d(-20%, 0, 0);
    opacity: 1;
  }
  80% {
    -webkit-transform: translate3d(-70%, 0, 0);
            transform: translate3d(-70%, 0, 0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate3d(-90%, 0, 0);
            transform: translate3d(-90%, 0, 0);
    opacity: 0;
  }
}
.bg-carousel {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.bg-carousel .item {
  display: block;
  flex: 0 0 auto;
}
.bg-carousel .item img {
  width: 100%;
  height: auto;
}
.bg-carousel .row {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  flex-wrap: nowrap;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  transition: opacity 0.5s;
  will-change: transform;
  opacity: 0;
}
.bg-carousel .layer {
  position: absolute;
  width: 100%;
  height: 100%;
}
.bg-carousel .layer:nth-child(1) .item {
  width: min(18vw, 180px);
}
.bg-carousel .layer:nth-child(1) .item img {
  -webkit-filter: blur(3px);
          filter: blur(3px);
}
.bg-carousel .layer:nth-child(1) .item:nth-child(4n-3) {
  -webkit-transform: translate3d(0, 34%, 0);
          transform: translate3d(0, 34%, 0);
}
.bg-carousel .layer:nth-child(1) .item:nth-child(4n-2) {
  -webkit-transform: translate3d(0, 60%, 0);
          transform: translate3d(0, 60%, 0);
}
.bg-carousel .layer:nth-child(1) .item:nth-child(4n-1) {
  -webkit-transform: translate3d(0, -90%, 0);
          transform: translate3d(0, -90%, 0);
}
.bg-carousel .layer:nth-child(1) .item:nth-child(4n) {
  -webkit-transform: translate3d(0, -200%, 0);
          transform: translate3d(0, -200%, 0);
}
.bg-carousel .layer:nth-child(1) .row {
  gap: 10vw;
}
.bg-carousel .layer:nth-child(1) .row:nth-child(1) {
  -webkit-animation: reel1 18s linear -1s infinite both;
          animation: reel1 18s linear -1s infinite both;
}
.bg-carousel .layer:nth-child(1) .row:nth-child(2) {
  -webkit-animation: reel2 18s linear 0s infinite both;
          animation: reel2 18s linear 0s infinite both;
}
.bg-carousel .layer:nth-child(2) .item {
  width: min(22vw, 220px);
}
.bg-carousel .layer:nth-child(2) .item img {
  -webkit-filter: blur(2px);
          filter: blur(2px);
}
.bg-carousel .layer:nth-child(2) .item:nth-child(4n-3) {
  -webkit-transform: translate3d(0, 30%, 0);
          transform: translate3d(0, 30%, 0);
}
.bg-carousel .layer:nth-child(2) .item:nth-child(4n-2) {
  -webkit-transform: translate3d(0, 100%, 0);
          transform: translate3d(0, 100%, 0);
}
.bg-carousel .layer:nth-child(2) .item:nth-child(4n-1) {
  -webkit-transform: translate3d(0, -80%, 0);
          transform: translate3d(0, -80%, 0);
}
.bg-carousel .layer:nth-child(2) .item:nth-child(4n) {
  -webkit-transform: translate3d(0, -120%, 0);
          transform: translate3d(0, -120%, 0);
}
.bg-carousel .layer:nth-child(2) .row {
  gap: 10vw;
}
.bg-carousel .layer:nth-child(2) .row:nth-child(1) {
  animation: reel2 22s linear -2s infinite both reverse;
}
.bg-carousel .layer:nth-child(2) .row:nth-child(2) {
  animation: reel1 22s linear 0s infinite both reverse;
}
.bg-carousel .layer:nth-child(3) {
  -webkit-filter: blur(1px);
          filter: blur(1px);
}
.bg-carousel .layer:nth-child(3) .item {
  width: min(30vw, 270px);
}
.bg-carousel .layer:nth-child(3) .item:nth-child(4n-3) {
  -webkit-transform: translate3d(0, -40%, 0);
          transform: translate3d(0, -40%, 0);
}
.bg-carousel .layer:nth-child(3) .item:nth-child(4n-2) {
  -webkit-transform: translate3d(0, 20%, 0);
          transform: translate3d(0, 20%, 0);
}
.bg-carousel .layer:nth-child(3) .item:nth-child(4n-1) {
  -webkit-transform: translate3d(0, -20%, 0);
          transform: translate3d(0, -20%, 0);
}
.bg-carousel .layer:nth-child(3) .item:nth-child(4n) {
  -webkit-transform: translate3d(0, -140%, 0);
          transform: translate3d(0, -140%, 0);
}
.bg-carousel .layer:nth-child(3) .row {
  gap: 10vw;
}
.bg-carousel .layer:nth-child(3) .row:nth-child(1) {
  -webkit-animation: reel1 27s linear -4s infinite both;
          animation: reel1 27s linear -4s infinite both;
}
.bg-carousel .layer:nth-child(3) .row:nth-child(2) {
  -webkit-animation: reel2 27s linear 0s infinite both;
          animation: reel2 27s linear 0s infinite both;
}

.loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 5;
}
.loading.hide {
  -webkit-animation: fadeOut 0.4s 1 0s forwards;
          animation: fadeOut 0.4s 1 0s forwards;
}
.loading img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  box-shadow: 0 1px 10px rgba(30, 30, 30, 0.2);
}
.--loaded .loading img.start {
  -webkit-animation: fadeOut 0.8s 1 0.4s both;
          animation: fadeOut 0.8s 1 0.4s both;
}

.count {
  text-align: center;
  position: relative;
  --max: attr(data-end);
  font-variant-numeric: tabular-nums;
  counter-set: countNum var(--count);
  display: inline-block;
  font-weight: 900;
  font-size: 40vw;
  min-width: 2.5em;
  color: #ccc;
  opacity: 0.4;
}
.count::before {
  content: counter(countNum);
}

@supports (x: attr(x type(*))) {
  @property --count {
    syntax: "<integer>";
    inherits: false;
    initial-value: 1986;
  }
  @-webkit-keyframes countAnimation {
    to {
      --progress: var(--max);
    }
  }
  @keyframes countAnimation {
    to {
      --progress: var(--max);
    }
  }
  .count {
    --max: attr(data-end type(<number>));
  }
  .count::before {
    content: counter(countNum);
  }
  .count.--animated {
    -webkit-animation: countAnimation 1s forwards cubic-bezier(0.2, 0.1, 0.2, 1) 1;
            animation: countAnimation 1s forwards cubic-bezier(0.2, 0.1, 0.2, 1) 1;
  }
}
.asset-svg {
  display: none;
}

/* ASSETS
======================================== */
.sp_btns {
  position: relative;
  max-width: 740px;
  margin-left: auto;
  margin-right: auto;
  z-index: 1;
}
.sp_btns:not(:first-child) {
  margin-top: clamp(30px, 4vw, 40px);
}
.sp_btns:not(:last-child) {
  margin-bottom: clamp(30px, 4vw, 40px);
}
.sp_btns {
  padding-right: 10px;
  padding-left: 10px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px clamp(10px, 3vw, 30px);
}
.sp_btns a {
  flex: 1 1 70%;
  height: 50px;
  width: 90%;
  max-width: 220px;
  position: relative;
  display: flex;
  border-radius: 6px;
  background-color: #000;
  color: #fff;
  font-size: clamp(18px, 2vw, 20px);
  font-weight: 700;
  line-height: 1;
  justify-content: center;
  align-items: center;
  letter-spacing: 0.07em;
  line-height: 1;
  padding: 0 15px 0 10px;
  white-space: nowrap;
}
.sp_btns a ruby {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-right: 0.2em;
}
.sp_btns a ruby rp, .sp_btns a ruby rt {
  font-size: 0.5em;
  line-height: 1.2;
}
.sp_btns a .s {
  font-size: 0.8em;
  padding-top: 0.2em;
}
.sp_btns a::after {
  content: "";
  display: block;
  width: 10px;
  height: 100%;
  background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMCAxOCIgPjxwb2x5bGluZSBwb2ludHM9IjEgMSA5IDkgMSAxNyIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZGMwNjEwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==") no-repeat right center;
  position: absolute;
  right: 12px;
  top: 0;
}
@media (hover: hover) {
  .sp_btns a:hover {
    background-color: rgb(248.814159292, 28.185840708, 38.4955752212);
    color: #000;
  }
  .sp_btns a:hover::after {
    -webkit-filter: saturate(0) brightness(0);
            filter: saturate(0) brightness(0);
  }
}
@media screen and (min-width: 480px) {
  .sp_btns a {
    flex: 1 1 30%;
    max-width: 50%;
  }
}
@media screen and (min-width: 721px) {
  .sp_btns a {
    flex: 1 0 30%;
  }
}

.teaser_content p {
  line-height: 2;
}
.teaser_content .deco-flash {
  position: absolute;
  z-index: 0;
  -webkit-animation: cameraflash 5s linear infinite;
          animation: cameraflash 5s linear infinite;
}
.teaser_content .deco-box {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  padding: clamp(12px, 2vw, 20px) 0 clamp(30px, 4vw, 40px);
  border-top: 3px solid #e08f2f;
  border-bottom: 3px solid #e08f2f;
  -o-border-image: linear-gradient(#e8cc89 0%, #e08f2f 50%, #e8cc89 100%) 1;
     border-image: linear-gradient(#e8cc89 0%, #e08f2f 50%, #e8cc89 100%) 1;
  background: linear-gradient(0deg, #f7f2ea, #fff) no-repeat center;
  box-shadow: 0 7px 10px rgba(102, 97, 92, 0.1);
}
.teaser_content .deco-box::before {
  content: "";
  display: block;
  background: url(../images/paper.gif) repeat center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  mix-blend-mode: multiply;
  opacity: 0.6;
}
.teaser_content .deco-box h3 {
  background: url(../images/deco-hr.svg) no-repeat bottom center/auto 0.5em;
  font-size: clamp(16px, 2vw, 20px);
  padding: 0 0 1.2em;
  text-align: center;
  font-weight: 700;
  letter-spacing: 0.1em;
  margin-bottom: clamp(20px, 3vw, 30px);
  line-height: 1.2;
}
.teaser_content .deco-box ul.list-l {
  font-size: clamp(16px, 2vw, 20px);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}
.teaser_content .deco-box ul.grid {
  display: grid;
  gap: 1em clamp(20px, 6vw, 60px);
  grid-template-columns: repeat(2, 1fr);
  max-width: 890px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: clamp(30px, 4vw, 40px);
}
@media screen and (min-width: 721px) {
  .teaser_content .deco-box ul.grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
.teaser_content .deco-box .sp_btn {
  position: relative;
  display: flex;
  max-width: 400px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 6px;
  background-color: #fff;
  border: 2px solid #e08f2f;
  font-size: clamp(16px, 2.4vw, 24px);
  font-weight: 400;
  line-height: 1;
  justify-content: center;
  align-items: center;
  letter-spacing: 0.07em;
  line-height: 1;
  padding: 0.5em 20px 0.5em 0;
}
.teaser_content .deco-box .sp_btn, .teaser_content .deco-box .sp_btn:hover, .teaser_content .deco-box .sp_btn:visited {
  color: inherit;
}
.teaser_content .deco-box .sp_btn ruby {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-right: 0.2em;
}
.teaser_content .deco-box .sp_btn ruby rp, .teaser_content .deco-box .sp_btn ruby rt {
  font-size: 0.5em;
  line-height: 1.2;
}
.teaser_content .deco-box .sp_btn .s {
  font-size: 0.8em;
  align-items: flex-end;
}
.teaser_content .deco-box .sp_btn::after {
  content: "";
  display: block;
  width: 10px;
  height: 100%;
  background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMCAxOCIgPjxwb2x5bGluZSBwb2ludHM9IjEgMSA5IDkgMSAxNyIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIgI2UwOGYyZiAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+PC9zdmc+") no-repeat right center;
  position: absolute;
  right: 12px;
  top: 0;
}

.deco-sparks svg {
  fill: #fff;
  position: absolute;
  width: 60%;
  max-width: 700px;
}
.deco-sparks .spark-br {
  right: -10%;
}
.deco-sparks .spark-bl {
  left: -15%;
  -webkit-transform: scale(-1, 1);
          transform: scale(-1, 1);
}
.deco-sparks .spark-front {
  -webkit-transform-origin: center;
          transform-origin: center;
  -webkit-animation: sparkling 11s infinite;
          animation: sparkling 11s infinite;
}
.deco-sparks .spark-middle {
  -webkit-transform-origin: center;
          transform-origin: center;
  -webkit-animation: sparkling 17s infinite -9s;
          animation: sparkling 17s infinite -9s;
}

/* HEADER
======================================== */
.teaser_header {
  position: relative;
  background: transparent;
  background: linear-gradient(90deg, #f8d7b3 0%, #f1dfb5 50%, #f4e6c5 100%);
}

.sp_header-main {
  position: relative;
  padding: clamp(10px, 2vw, 20px) clamp(10px, 2vw, 20px) 0;
}
.sp_header-main img {
  display: block;
  height: auto;
  width: auto;
}
.sp_header-main .bg-carpet {
  position: absolute;
  top: 40%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(40deg);
          transform: translate(-50%, -50%) rotate(40deg);
  max-width: 600px;
}
.sp_header-main .sp_header-kv {
  position: relative;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  max-width: 930px;
  margin: 0 auto;
  padding-right: min(100px, 5vw);
  padding-left: min(20vw, 200px);
}
.sp_header-main .sp_header-kv .flash01 {
  right: 0;
  top: 30%;
  width: min(25vw, 250px);
  -webkit-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
}
.sp_header-main .sp_header-kv .flash02 {
  left: max(-10vw, -100px);
  bottom: 0;
  width: min(20vw, 200px);
  -webkit-transform: translate(-50%, 50%);
          transform: translate(-50%, 50%);
}
.sp_header-main .sp_header-kv .flash03 {
  left: 0;
  bottom: min(20vw, 180px);
  width: min(25vw, 250px);
  -webkit-transform: translate(-50%, 50%);
          transform: translate(-50%, 50%);
}
.sp_header-main .cover {
  position: relative;
  max-width: 580px;
  padding: clamp(10px, 2vw, 20px) 0 min(50px, 5vw);
}
.sp_header-main .cover .deco-flash {
  right: 0;
  top: 10px;
  width: min(25vw, 200px);
  -webkit-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
}
.sp_header-main .cover-img {
  position: relative;
  z-index: 1;
}
.sp_header-main h1 {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.sp_header-main h2 {
  position: relative;
  margin: clamp(10px, 3vw, 20px) auto 0;
  width: 90%;
  max-width: 867px;
}
.sp_header-main h2 .catch-img {
  display: block;
  position: relative;
  z-index: 1;
}
.sp_header-main h2 .flash01 {
  left: 0;
  top: 5px;
  width: min(30vw, 300px);
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.sp_header-main h2 .flash02 {
  left: 45%;
  top: 5px;
  width: min(25vw, 250px);
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.sp_header-main .catch-fami {
  position: absolute;
  right: 0;
  top: 0;
  width: clamp(30px, 12vw, 100px);
}
.sp_header-main .catch-40th {
  position: absolute;
  left: 0;
  bottom: 0;
  height: min(19vw, 210px);
}
.sp_header-main .catch-66 {
  position: absolute;
  left: 5px;
  bottom: min(20vw, 220px);
  height: min(14vw, 125px);
}
.sp_header-main .logo-40th {
  position: absolute;
  left: min(2vw, 20px);
  top: min(2vw, 20px);
  width: min(13vw, 210.5px);
}
.loading.hide ~ .teaser_content .sp_header-main .catch-fami {
  -webkit-animation: fadeInDown 0.4s ease-in 1s both;
          animation: fadeInDown 0.4s ease-in 1s both;
}
.loading.hide ~ .teaser_content .sp_header-main .catch-66 {
  -webkit-animation: fadeInLeft 0.4s ease-in 1.2s both;
          animation: fadeInLeft 0.4s ease-in 1.2s both;
}
.loading.hide ~ .teaser_content .sp_header-main .catch-40th {
  -webkit-animation: fadeInLeft 0.4s ease-in 1.3s both;
          animation: fadeInLeft 0.4s ease-in 1.3s both;
}
.loading.hide ~ .teaser_content .sp_header-main .logo-40th {
  -webkit-animation: fadeInDown 0.4s ease-in 0.7s both;
          animation: fadeInDown 0.4s ease-in 0.7s both;
}
.loading.hide ~ .teaser_content .sp_header-main .bg-carpet {
  -webkit-animation: fadeIn 0.4s ease-in 0s both;
          animation: fadeIn 0.4s ease-in 0s both;
}
.loading.hide ~ .teaser_content .sp_header-main .cover .deco-flash {
  -webkit-animation: cameraflash 5s linear 0.3s infinite;
          animation: cameraflash 5s linear 0.3s infinite;
}
.loading.hide ~ .teaser_content .sp_header-main .cover-img {
  -webkit-animation: fadeIn 0.4s ease-in 0.1s both;
          animation: fadeIn 0.4s ease-in 0.1s both;
}
.loading.hide ~ .teaser_content .sp_header-main .sp_header-kv .flash01 {
  -webkit-animation: cameraflash 5s linear 0.4s infinite;
          animation: cameraflash 5s linear 0.4s infinite;
}
.loading.hide ~ .teaser_content .sp_header-main .sp_header-kv .flash02 {
  -webkit-animation: cameraflash 5s linear 0.5s infinite;
          animation: cameraflash 5s linear 0.5s infinite;
}
.loading.hide ~ .teaser_content .sp_header-main .sp_header-kv .flash03 {
  -webkit-animation: cameraflash 5s linear 0.6s infinite;
          animation: cameraflash 5s linear 0.6s infinite;
}
.loading.hide ~ .teaser_content .sp_header-main h2 .catch-img {
  -webkit-animation: fadeInUp 0.4s ease-in 1.5s both;
          animation: fadeInUp 0.4s ease-in 1.5s both;
}
.loading.hide ~ .teaser_content .sp_header-main h2 .flash01 {
  -webkit-animation: cameraflash 5s linear 0.5s infinite;
          animation: cameraflash 5s linear 0.5s infinite;
}
.loading.hide ~ .teaser_content .sp_header-main h2 .flash02 {
  -webkit-animation: cameraflash 5s linear 0.7s infinite;
          animation: cameraflash 5s linear 0.7s infinite;
}
.sp_header-main .header-deco-top {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.sp_header-main .header-deco-top .deco-sparks svg {
  top: 0;
  -webkit-transform: translateY(-40%) scaleY(-1);
          transform: translateY(-40%) scaleY(-1);
  width: 50%;
  max-width: 500px;
}
.sp_header-main .header-deco-top .deco-sparks .spark-bl {
  left: -7%;
}
.sp_header-main .header-deco-bottom {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
}
.sp_header-main .header-deco-bottom .separator {
  width: 100%;
  fill: #fff;
}
.sp_header-main .header-deco-bottom .deco-sparks svg {
  bottom: -15%;
}

.sp_header-second {
  position: relative;
  background: #fff;
  padding: clamp(20px, 3vw, 30px);
}
.sp_header-second p {
  max-width: 740px;
  margin-left: auto;
  margin-right: auto;
}

/* MAIN
======================================== */
.teaser_main {
  background-color: #faf5e7;
}
.teaser_main h2 {
  text-align: center;
  font-size: clamp(18px, 4vw, 40px);
  font-weight: 900;
  margin-bottom: 0.2em;
}
.teaser_main h2 strong {
  color: #dc0610;
}
.teaser_main h2 img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.teaser_main h2 .s {
  font-size: 0.8em;
}
.teaser_main .sp_sec {
  position: relative;
  padding: clamp(20px, 3vw, 30px);
}
.teaser_main .sp_sec > p {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}
.teaser_main .sp_sec > *:not(:last-child) {
  margin-bottom: clamp(20px, 3vw, 30px);
}
.teaser_main .feature-frame {
  position: relative;
}
.teaser_main .feature-frame::before, .teaser_main .feature-frame::after {
  position: absolute;
  top: 0;
  content: "";
  width: 100px;
  height: 100%;
  background: url(../images/deco-frame-side.svg) no-repeat right center/contain;
}
.teaser_main .feature-frame::before {
  right: 98%;
  -webkit-transform: scale(-1, 1);
          transform: scale(-1, 1);
}
.teaser_main .feature-frame::after {
  left: 98%;
}
.teaser_main .feature-frame > * {
  position: relative;
  z-index: 1;
}
.teaser_main .feature-frame [class*=grid-img] {
  gap: 10px;
}
.teaser_main .feature-frame [class*=grid-img] img {
  box-shadow: 0 1px 5px rgba(30, 30, 30, 0.4);
}
@media screen and (min-width: 480px) {
  .teaser_main .feature-frame [class*=grid-img] {
    gap: clamp(30px, 5vw, 50px) clamp(14px, 4vw, 40px);
  }
}

.teaser_content-feature .feature-deco-tag {
  position: relative;
}
.teaser_content-feature .feature-deco-tag-bg {
  max-width: 50%;
  opacity: 0;
  -webkit-transform: translate3d(0, 20px, 0) scale(0.8);
          transform: translate3d(0, 20px, 0) scale(0.8);
  transition: opacity 0.6s 0.2s, -webkit-transform 0.6s 0.2s;
  transition: opacity 0.6s 0.2s, transform 0.6s 0.2s;
  transition: opacity 0.6s 0.2s, transform 0.6s 0.2s, -webkit-transform 0.6s 0.2s;
}
.teaser_content-feature .feature-deco-tag-text {
  max-width: 30%;
  position: absolute;
  bottom: 0;
  left: 50%;
  opacity: 0;
  transition: opacity 0.6s 0.2s, -webkit-transform 0.6s 0.2s;
  transition: opacity 0.6s 0.2s, transform 0.6s 0.2s;
  transition: opacity 0.6s 0.2s, transform 0.6s 0.2s, -webkit-transform 0.6s 0.2s;
  -webkit-transform: translate3d(-50%, 20px, 0);
          transform: translate3d(-50%, 20px, 0);
}
.teaser_content-feature hgroup {
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
}
.teaser_content-feature hgroup img {
  display: block;
  margin: 0 auto;
}
.teaser_content-feature hgroup h2 {
  font-size: clamp(24px, 4.8vw, 48px);
  margin-top: 0.2em;
  line-height: 1.2;
}
.teaser_content-feature hgroup h2 img {
  margin-bottom: 0.2em;
}
.teaser_content-feature hgroup p {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}
.teaser_content-feature hgroup.animated .feature-deco-tag-bg {
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0) scale(1);
          transform: translate3d(0, 0, 0) scale(1);
}
.teaser_content-feature hgroup.animated .feature-deco-tag-text {
  opacity: 1;
  -webkit-transform: translate3d(-50%, 0, 0);
          transform: translate3d(-50%, 0, 0);
}

.teaser_main-top {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  -webkit-transform: scale(1, -1);
          transform: scale(1, -1);
}
.teaser_main-top use {
  fill: #fff;
}

.teaser_main-bottom {
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  z-index: 0;
}
.teaser_main-bottom use {
  fill: #e8cc89;
}

.sp_illust-frame-top {
  background: linear-gradient(#c78a12 0%, #75451c 50%, #c78a12 100%);
}
.sp_illust-frame-top::before, .sp_illust-frame-top::after {
  content: "";
  display: block;
  width: 100%;
  height: clamp(3px, 1vw, 6px);
  background: linear-gradient(#c9a352 0%, #e8bb4f 50%, #c9a352 100%);
}
.sp_illust-frame-top::after {
  margin-top: clamp(3px, 1vw, 6px);
}

.sp_illust-frame {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.sp_illust-frame::before, .sp_illust-frame::after {
  content: "";
  display: block;
  width: 30%;
  height: 100%;
  background: url(../images/bg-curtain-top.png) no-repeat left top/100% auto, url(../images/bg-curtain-side.png) no-repeat left top/30% 100%;
  position: absolute;
  top: 0;
}
.sp_illust-frame::before {
  left: 0;
}
.sp_illust-frame::after {
  right: 0;
  -webkit-transform: scale(-1, 1);
          transform: scale(-1, 1);
}

.sp_illust-main {
  position: relative;
  background-color: #fff;
  padding-top: clamp(10px, 3vw, 30px);
}
.sp_illust-main .illust-40th {
  width: 80%;
}

.sp_illust {
  position: relative;
}
.sp_illust::before {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
}
.sp_illust img {
  display: block;
  margin: 0 auto;
}
.sp_illust h2 {
  position: absolute;
  right: 2vw;
  top: max(3vw, 20px);
  z-index: 2;
  width: 54vw;
  height: 15vw;
}
.sp_illust h2 img {
  position: absolute;
  left: 0;
  top: 0;
}
.sp_illust h2 .h01 {
  top: 21%;
  left: 0;
  width: 13%;
}
.sp_illust h2 .h02 {
  top: 34%;
  left: 11%;
  width: 8.5%;
}
.sp_illust h2 .h03 {
  top: 21%;
  left: 18%;
  width: 12%;
}
.sp_illust h2 .h04 {
  top: 34%;
  left: 29%;
  width: 15%;
}
.sp_illust h2 .h05 {
  top: 0;
  left: 42%;
  width: 27%;
}
.sp_illust h2 .h06 {
  top: 34%;
  left: 67%;
  width: 21%;
}
.sp_illust h2 .h07 {
  top: 70%;
  left: 0;
  width: 36%;
}
.sp_illust h2 .h08 {
  top: 67%;
  left: 32%;
  width: 23%;
}
.sp_illust h2 .h09 {
  top: 70%;
  left: 54%;
  width: 7%;
}
.sp_illust h2 .h10 {
  top: 67%;
  left: 60%;
  width: 28%;
}
.sp_illust h2 .h11 {
  top: 70%;
  left: 87%;
  width: 12%;
}
.sp_illust .deco-flash, .sp_illust .bottom-sparks, .sp_illust .deco-sparks {
  z-index: 1;
}
.sp_illust .flash01 {
  left: min(2vw, 25px);
  top: 7%;
  width: min(25vw, 250px);
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
}
.sp_illust .flash02 {
  left: min(8vw, 100px);
  top: 30%;
  width: min(20vw, 200px);
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}
.sp_illust .flash03 {
  left: min(3vw, 50px);
  bottom: 30%;
  width: min(25vw, 250px);
  -webkit-transform: translate(-50%, 50%);
          transform: translate(-50%, 50%);
  -webkit-animation-delay: 3.2s;
          animation-delay: 3.2s;
}
.sp_illust .flash04 {
  left: min(7.5vw, 80px);
  bottom: 10%;
  width: min(25vw, 250px);
  -webkit-transform: translate(-50%, 50%);
          transform: translate(-50%, 50%);
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}
.sp_illust .flash05 {
  right: min(2vw, 25px);
  top: 7%;
  width: min(25vw, 250px);
  -webkit-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}
.sp_illust .flash06 {
  right: min(8vw, 100px);
  top: 30%;
  width: min(20vw, 200px);
  -webkit-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}
.sp_illust .flash07 {
  right: min(3vw, 50px);
  bottom: 30%;
  width: min(25vw, 250px);
  -webkit-transform: translate(50%, 50%);
          transform: translate(50%, 50%);
  -webkit-animation-delay: 1.2s;
          animation-delay: 1.2s;
}
.sp_illust .flash08 {
  right: min(7.5vw, 80px);
  bottom: 10%;
  width: min(25vw, 250px);
  -webkit-transform: translate(50%, 50%);
          transform: translate(50%, 50%);
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}
.sp_illust .deco-sparks {
  position: absolute;
  bottom: -15%;
  left: 0;
  width: 100%;
}
.sp_illust .deco-sparks svg {
  bottom: 0;
}
.sp_illust .deco-sparks .spark-br {
  right: -20%;
}
.sp_illust .deco-sparks .spark-bl {
  left: -22%;
}

@media screen and (max-width: 720px) {
  .over--md {
    display: none;
  }
}
@media screen and (min-width: 480px) {
  .under--sm {
    display: none;
  }
}
@media screen and (max-width: 479px) {
  .over--sm {
    display: none;
  }
}
@media screen and (min-width: 721px) {
  .under--md {
    display: none;
  }
}
.hide {
  display: none;
}

.mg--m {
  margin: clamp(30px, 6vw, 60px);
}

.mt--s {
  margin-top: clamp(30px, 4vw, 40px);
}

.mb--s {
  margin-bottom: clamp(30px, 4vw, 40px);
}

.mt--m {
  margin-top: clamp(30px, 6vw, 60px);
}

.mb--m {
  margin-bottom: clamp(30px, 6vw, 60px);
}

.mt--l {
  margin-top: clamp(60px, 10vw, 100px);
}

.mb--l {
  margin-bottom: clamp(60px, 10vw, 100px);
}

.fs-m {
  font-size: 1.175em;
}

.fs-d {
  font-size: 1em;
}

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

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

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

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

@media screen and (max-width: 720px) {
  .fs-m--sm {
    font-size: 0.875em;
  }
  .fs-d--sm {
    font-size: 1em;
  }
  .align-center--sm {
    text-align: center;
  }
  .align-left--sm {
    text-align: left;
  }
  .align-right--sm {
    text-align: right;
  }
  .align-middle--sm {
    vertical-align: middle;
  }
}
@media screen and (max-width: 479px) {
  .fs-m--xs {
    font-size: 0.875em;
  }
  .fs-d--xs {
    font-size: 1em;
  }
  .align-center--xs {
    text-align: center;
  }
  .align-left--xs {
    text-align: left;
  }
  .align-right--xs {
    text-align: right;
  }
  .align-middle--xs {
    vertical-align: middle;
  }
}
.block-center {
  margin-right: auto;
  margin-left: auto;
}

.img-note {
  display: block;
  margin-top: 0.5em;
  line-height: 1.4;
  font-size: clamp(12px, 1.4vw, 14px);
  color: #626160;
}
@media screen and (min-width: 480px) {
  .img-note {
    text-align: right;
  }
}

.box-shadow {
  box-shadow: 0 1px 5px rgba(30, 30, 30, 0.4);
}

.w-max_S {
  max-width: 740px;
  margin-left: auto;
  margin-right: auto;
}

.w-max_m {
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
}

.w-max_l {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

.grid-img-1 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5em;
}

.grid-img-1-2 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5em;
}
@media screen and (min-width: 721px) {
  .grid-img-1-2 {
    grid-template-columns: repeat(2, 1fr);
  }
}

.gap_s {
  gap: clamp(1.4em, 3vw, 30px) clamp(10px, 3vw, 30px);
}

.gap_m {
  gap: clamp(30px, 5vw, 50px) clamp(14px, 4vw, 40px);
}

.gap_l {
  gap: clamp(30px, 6vw, 60px) clamp(20px, 5vw, 50px);
}