@charset "UTF-8";
/*! destyle.css v2.0.2 | MIT License | https://github.com/nicolas-cusan/destyle.css */
/* Reset box-model and set borders */
/* ============================================ */
*,
::before,
::after {
  box-sizing: border-box;
  border-style: solid;
  border-width: 0;
}

/* Document */
/* ============================================ */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 * 3. Remove gray overlay on links for iOS.
 */
html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  -webkit-tap-highlight-color: transparent;
  /* 3*/
}

/* Sections */
/* ============================================ */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
}

/* Vertical rhythm */
/* ============================================ */
p,
table,
blockquote,
address,
pre,
iframe,
form,
figure,
dl {
  margin: 0;
}

/* Headings */
/* ============================================ */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
  margin: 0;
}

/* Lists (enumeration) */
/* ============================================ */
ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Lists (definition) */
/* ============================================ */
dt {
  font-weight: bold;
}

dd {
  margin-left: 0;
}

/* Grouping content */
/* ============================================ */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
  border-top-width: 1px;
  margin: 0;
  clear: both;
  color: inherit;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: inherit;
  /* 2 */
}

address {
  font-style: inherit;
}

/* Text-level semantics */
/* ============================================ */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
  text-decoration: none;
  color: inherit;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  text-decoration: underline;
  /* 2 */
  text-decoration: underline dotted;
  /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: inherit;
  /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content */
/* ============================================ */
/**
 * Prevent vertical alignment issues.
 */
img,
embed,
object,
iframe {
  vertical-align: bottom;
}

/* Forms */
/* ============================================ */
/**
 * Reset form fields to make them styleable
 */
button,
input,
optgroup,
select,
textarea {
  -webkit-appearance: none;
  appearance: none;
  vertical-align: middle;
  color: inherit;
  font: inherit;
  background: transparent;
  padding: 0;
  margin: 0;
  outline: 0;
  border-radius: 0;
  text-align: inherit;
}

/**
 * Reset radio and checkbox appearance to preserve their look in iOS.
 */
[type=checkbox] {
  -webkit-appearance: checkbox;
  appearance: checkbox;
}

[type=radio] {
  -webkit-appearance: radio;
  appearance: radio;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type=button],
[type=reset],
[type=submit] {
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

button[disabled],
[type=button][disabled],
[type=reset][disabled],
[type=submit][disabled] {
  cursor: default;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Remove arrow in IE10 & IE11
 */
select::-ms-expand {
  display: none;
}

/**
 * Remove padding
 */
option {
  padding: 0;
}

/**
 * Reset to invisible
 */
fieldset {
  margin: 0;
  padding: 0;
  min-width: 0;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the outline style in Safari.
 */
[type=search] {
  outline-offset: -2px;
  /* 1 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/**
 * Clickable labels
 */
label[for] {
  cursor: pointer;
}

/* Interactive */
/* ============================================ */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/*
 * Remove outline for editable content.
 */
[contenteditable] {
  outline: none;
}

/* Table */
/* ============================================ */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption {
  text-align: left;
}

td,
th {
  vertical-align: top;
  padding: 0;
}

th {
  text-align: left;
  font-weight: bold;
}

/* Misc */
/* ============================================ */
/**
 * Add the correct display in IE 10+.
 */
template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none;
}

/**
 * Swiper 11.2.10
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2025 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: June 28, 2025
 */
@font-face {
  font-family: "swiper-icons";
  src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");
  font-weight: 400;
  font-style: normal;
}
:root {
  --swiper-theme-color: #007aff;
  /*
  --swiper-preloader-color: var(--swiper-theme-color);
  --swiper-wrapper-transition-timing-function: initial;
  */
}

:host {
  position: relative;
  display: block;
  margin-left: auto;
  margin-right: auto;
  z-index: 1;
}

.swiper {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  /* Fix of Webkit flickering */
  z-index: 1;
  display: block;
}

.swiper-vertical > .swiper-wrapper {
  flex-direction: column;
}

.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
  box-sizing: content-box;
}

.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
  transform: translate3d(0px, 0, 0);
}

.swiper-horizontal {
  touch-action: pan-y;
}

.swiper-vertical {
  touch-action: pan-x;
}

.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
  display: block;
}

.swiper-slide-invisible-blank {
  visibility: hidden;
}

/* Auto Height */
.swiper-autoheight,
.swiper-autoheight .swiper-slide {
  height: auto;
}

.swiper-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}

.swiper-backface-hidden .swiper-slide {
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* 3D Effects */
.swiper-3d.swiper-css-mode .swiper-wrapper {
  perspective: 1200px;
}

.swiper-3d .swiper-wrapper {
  transform-style: preserve-3d;
}

.swiper-3d {
  perspective: 1200px;
}
.swiper-3d .swiper-slide,
.swiper-3d .swiper-cube-shadow {
  transform-style: preserve-3d;
}

/* CSS Mode */
.swiper-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none; /* For Firefox */
  -ms-overflow-style: none; /* For Internet Explorer and Edge */
}
.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}
.swiper-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}
.swiper-css-mode.swiper-horizontal > .swiper-wrapper {
  scroll-snap-type: x mandatory;
}
.swiper-css-mode.swiper-vertical > .swiper-wrapper {
  scroll-snap-type: y mandatory;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper {
  scroll-snap-type: none;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: none;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper::before {
  content: "";
  flex-shrink: 0;
  order: 9999;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: center center;
  scroll-snap-stop: always;
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child {
  margin-inline-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper::before {
  height: 100%;
  min-height: 1px;
  width: var(--swiper-centered-offset-after);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
  margin-block-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper::before {
  width: 100%;
  min-width: 1px;
  height: var(--swiper-centered-offset-after);
}

/* Slide styles start */
/* 3D Shadows */
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}
.swiper-3d .swiper-slide-shadow {
  background: rgba(0, 0, 0, 0.15);
}
.swiper-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  transform-origin: 50%;
  box-sizing: border-box;
  border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
  border-radius: 50%;
  border-top-color: transparent;
}

.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,
.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader {
  animation: swiper-preloader-spin 1s infinite linear;
}

.swiper-lazy-preloader-white {
  --swiper-preloader-color: #fff;
}

.swiper-lazy-preloader-black {
  --swiper-preloader-color: #000;
}

@keyframes swiper-preloader-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* Slide styles end */
/*========================================
*	common
========================================*/
::selection {
  color: #fff;
  background: #000;
}

*,
*:after,
*:before {
  box-sizing: border-box;
}

*:focus {
  outline: 0;
}

html,
body {
  font-size: 62.5%;
  color: #000;
  background-color: #fff;
  font-family: "M PLUS 1p", sans-serif;
}

@media only screen and (min-width: 767px) {
  html {
    overscroll-behavior: none;
  }
}

body {
  width: 100%;
}

a {
  color: #000;
  text-decoration: none;
}

h1,
h2,
h3 {
  line-height: 1;
}

ul,
li {
  list-style: none;
}

tr,
th,
td {
  font-weight: normal;
  text-align: left;
}

img,
picture {
  -webkit-backface-visibility: hidden;
  width: 100%;
  max-width: 100%;
  height: auto;
  pointer-events: none;
  vertical-align: bottom;
}

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

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

.common {
  padding: 1.3333333333vw;
  overflow: hidden;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
@media only screen and (min-width: 767px) {
  .common {
    padding: min(0.6944444444vw, 10px);
  }
}
.common__inner {
  position: relative;
  overflow: hidden;
  background-color: #f6f6f6;
  border-radius: 2.1333333333vw;
  width: 97.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common__inner {
    width: 100%;
    border-radius: 1.1111111111vw;
  }
}
.common__bg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.common__bg-layer1 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(../data/webp/pattern_1.webp);
  background-repeat: repeat;
  background-size: 6.2666666667vw 23.6vw;
}
@media only screen and (min-width: 767px) {
  .common__bg-layer1 {
    background-size: min(3.2638888889vw, 47px) min(12.2916666667vw, 177px);
  }
}
.common__bg-layer2 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(../data/webp/pattern_2.webp);
  background-repeat: repeat;
  background-size: 6.2666666667vw 23.6vw;
}
@media only screen and (min-width: 767px) {
  .common__bg-layer2 {
    background-size: min(3.2638888889vw, 47px) min(12.2916666667vw, 177px);
  }
}
.common__ttl {
  height: 16.6666666667vw;
  width: fit-content;
  margin-inline: auto;
  position: relative;
  z-index: 10;
}
@media only screen and (min-width: 767px) {
  .common__ttl {
    height: min(7.2222222222vw, 104px);
  }
}
@media only screen and (min-width: 1440px) {
  .common__ttl {
    height: min(104px + (100vw - 1440px) * 0.0185714286, 124.8px);
  }
}
.common__ttl img {
  height: 100%;
  width: auto;
}
.common__ttl-thunder {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 10;
  width: 160vw;
  height: 80vw;
  pointer-events: none;
  transform: translate(-50%, -50%);
  display: none;
}
@media only screen and (min-width: 767px) {
  .common__ttl-thunder {
    width: min(69.4444444444vw, 1000px);
    height: min(34.7222222222vw, 500px);
  }
}
.common__wrapper {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 5.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common__wrapper {
    gap: min(2.0833333333vw, 30px);
  }
}
@media only screen and (min-width: 767px) {
  .common__wrapper.is-row {
    flex-direction: row;
    justify-content: center;
    gap: min(2.0833333333vw, 30px);
  }
}
.common__wrapper-inner {
  width: fit-content;
  margin-inline: auto;
}
.common__wrapper-inner > span {
  display: block;
  margin-top: 3.2vw;
  font-size: 2.5333333333vw;
  color: #808080;
}
@media only screen and (min-width: 767px) {
  .common__wrapper-inner > span {
    font-size: min(1.3888888889vw, 20px);
    margin-top: min(1.1111111111vw, 16px);
  }
}
.common__btn {
  display: block;
  width: 56vw;
  height: 11.0666666667vw;
  background: white;
  border-radius: 5.6vw;
  margin-inline: auto;
  box-shadow: 0 1.6vw 0 rgba(0, 0, 0, 0.16);
  position: relative;
  z-index: 1;
  transition: all 300ms;
}
@media only screen and (min-width: 767px) {
  .common__btn {
    width: min(20.8333333333vw, 300px);
    height: min(4.0972222222vw, 59px);
    border-radius: min(2.9166666667vw, 42px);
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(0, 0, 0, 0.16);
  }
}
@media only screen and (min-width: 1440px) {
  .common__btn {
    width: min(300px + (100vw - 1440px) * 0.0535714286, 360px);
    height: min(59px + (100vw - 1440px) * 0.0105357143, 70.8px);
    border-radius: min(42px + (100vw - 1440px) * 0.0075, 50.4px);
    box-shadow: 0 min(8px + (100vw - 1440px) * 0.0014285714, 9.6px) 0 rgba(0, 0, 0, 0.16);
  }
}
.common__btn:before {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  transform: translate(-50%, -50%);
  background-color: white;
  transition: all 400ms;
  border-radius: 5.6vw;
}
@media only screen and (min-width: 767px) {
  .common__btn:before {
    width: 101%;
    height: 101%;
    border-radius: min(2.9166666667vw, 42px);
  }
}
@media only screen and (min-width: 1440px) {
  .common__btn:before {
    border-radius: min(42px + (100vw - 1440px) * 0.0075, 50.4px);
  }
}
.common__btn.is-multiline {
  height: max-content;
  border-radius: 7.8666666667vw;
}
.common__btn.is-multiline:before {
  display: block;
  content: "";
  border-radius: 7.8666666667vw;
}
.common__btn-gradient {
  width: 100%;
  height: 100%;
  mask-size: contain;
  mask-image: url(../data/webp/btn_view.webp);
  mask-repeat: no-repeat;
  pointer-events: none;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
.common__circle {
  position: absolute;
  width: 48vw;
  height: 48vw;
  background-color: white;
  top: 18.5333333333vw;
  left: 28.2666666667vw;
  display: block;
  border-radius: 50%;
  transform-origin: center center;
  transition: transform 0.2s ease;
}
@media only screen and (min-width: 767px) {
  .common__circle {
    width: min(25vw, 360px);
    height: min(25vw, 360px);
    top: min(3.9583333333vw, 57px);
    left: min(36.8055555556vw, 530px);
    transform: translateX(-50%);
  }
}
@media only screen and (min-width: 1440px) {
  .common__circle {
    width: min(360px + (100vw - 1440px) * 0.0642857143, 432px);
    height: min(360px + (100vw - 1440px) * 0.0642857143, 432px);
    top: min(57px + (100vw - 1440px) * 0.0101785714, 68.4px);
    left: min(530px + (100vw - 1440px) * 0.0946428571, 636px);
  }
}
.common__circle.is-recruit {
  position: relative;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media only screen and (min-width: 767px) {
  .common__circle.is-recruit {
    left: min(63.5416666667vw, 915px);
    transform: translateX(0);
  }
}
@media only screen and (min-width: 1440px) {
  .common__circle.is-recruit {
    left: min(915px + (100vw - 1440px) * 0.1633928571, 1098px);
  }
}
.common__circle.is-recruit .common__circle-gradient {
  mask-image: url(../data/webp/top/recruit/circle_base.webp);
}
.common__circle.is-recruit:hover {
  transform: scale(0.98);
}
.common__circle.is-creative {
  position: relative;
  top: 0;
  left: 41.7333333333vw;
}
@media only screen and (min-width: 767px) {
  .common__circle.is-creative {
    left: min(63.5416666667vw, 915px);
    transform: translateX(0);
  }
}
@media only screen and (min-width: 1440px) {
  .common__circle.is-creative {
    left: min(915px + (100vw - 1440px) * 0.1633928571, 1098px);
  }
}
.common__circle.is-creative .common__circle-gradient {
  mask-image: url(../data/webp/about/circle_base.webp);
}
.common__circle.is-creative:hover {
  transform: scale(0.98);
}
.common__circle-gradient {
  position: absolute;
  width: 100%;
  height: 100%;
  mask-image: url(../data/webp/top/goods/circle_base.webp);
  mask-repeat: no-repeat;
  mask-size: contain;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
.common__circle-arrow {
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: url(../data/webp/top/goods/circle_arrow.webp);
  top: 0;
  background-size: contain;
  transform-origin: center center;
}
.common__error {
  position: relative;
  z-index: 2;
  height: 98vh;
  min-height: min(48.6111111111vw, 700px);
  flex-direction: column;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media only screen and (min-width: 767px) {
  .common__error {
    height: calc(100vh - 19vw);
    min-height: min(48.6111111111vw, 700px);
  }
}
@media only screen and (min-width: 1440px) {
  .common__error {
    height: 78vh;
  }
}
.common__error-big {
  font-family: "futura-pt-condensed", sans-serif;
  font-weight: 900;
  font-size: 16vw;
}
@media only screen and (min-width: 767px) {
  .common__error-big {
    font-size: min(8.3333333333vw, 120px);
  }
}
.common__error-small {
  line-height: 2;
  font-size: 2.6666666667vw;
  text-align: center;
}
@media only screen and (min-width: 767px) {
  .common__error-small {
    font-size: min(1.1111111111vw, 16px);
  }
}
.common__pagination {
  width: 89.3333333333vw;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  margin: 0 auto 26.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .common__pagination {
    width: min(30.4166666667vw, 438px);
    margin: 0 auto min(6.5972222222vw, 95px);
  }
}
@media only screen and (min-width: 1440px) {
  .common__pagination {
    width: min(438px + (100vw - 1440px) * 0.0782142857, 525.6px);
    margin: 0 auto min(95px + (100vw - 1440px) * 0.0169642857, 114px);
  }
}
.common__pagination-back {
  display: flex;
  width: fit-content;
  margin: 8vw auto 0;
  font-family: "futura-pt-condensed", sans-serif;
  font-size: 6.4vw;
  font-weight: 800;
  transition: all 300ms;
  position: relative;
  z-index: 2;
}
@media only screen and (min-width: 767px) {
  .common__pagination-back {
    font-size: min(2.2222222222vw, 32px);
    margin: min(4.1666666667vw, 60px) auto 0;
  }
}
@media only screen and (min-width: 1440px) {
  .common__pagination-back {
    font-size: min(32px + (100vw - 1440px) * 0.0057142857, 38.4px);
    margin: min(60px + (100vw - 1440px) * 0.0107142857, 72px) auto 0;
  }
}
.common__pagination.wp-pagination {
  justify-content: center;
}
.common__pagination.wp-pagination .navigation {
  width: 100%;
}
.common__pagination.wp-pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2.4vw;
  width: 100%;
}
@media only screen and (min-width: 767px) {
  .common__pagination.wp-pagination .nav-links {
    gap: min(0.9722222222vw, 14px);
  }
}
@media only screen and (min-width: 1440px) {
  .common__pagination.wp-pagination .nav-links {
    gap: min(14px + (100vw - 1440px) * 0.0025, 16.8px);
  }
}
.common__pagination.wp-pagination .page-numbers {
  position: relative;
  font-size: 5.3333333333vw;
  font-weight: 900;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  width: 10.6666666667vw;
  height: 10.6666666667vw;
  border-radius: 50%;
  box-shadow: 0 1.6vw 0 rgba(0, 0, 0, 0.16);
  text-decoration: none;
  color: inherit;
  transition: all 300ms;
}
@media only screen and (min-width: 767px) {
  .common__pagination.wp-pagination .page-numbers {
    width: min(3.4722222222vw, 50px);
    height: min(3.4722222222vw, 50px);
    box-shadow: 0 0.5555555556vw 0 rgba(0, 0, 0, 0.16);
    font-size: min(1.8055555556vw, 26px);
  }
  .common__pagination.wp-pagination .page-numbers:hover {
    transform: scale(0.95);
    filter: invert(1);
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(255, 255, 255, 0.16);
  }
}
@media only screen and (min-width: 1440px) {
  .common__pagination.wp-pagination .page-numbers {
    width: min(50px + (100vw - 1440px) * 0.0089285714, 60px);
    height: min(50px + (100vw - 1440px) * 0.0089285714, 60px);
    box-shadow: 0 min(8px + (100vw - 1440px) * 0.0014285714, 9.6px) 0 rgba(0, 0, 0, 0.16);
    font-size: min(26px + (100vw - 1440px) * 0.0046428571, 31.2px);
  }
  .common__pagination.wp-pagination .page-numbers:hover {
    transform: scale(0.95);
    filter: invert(1);
    box-shadow: 0 min(8px + (100vw - 1440px) * 0.0014285714, 9.6px) 0 rgba(255, 255, 255, 0.16);
  }
}
@media only screen and (min-width: 767px) {
  .common__pagination.wp-pagination .page-numbers.dots:hover {
    transform: none;
    filter: none;
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(0, 0, 0, 0.16);
  }
}
@media only screen and (min-width: 1440px) {
  .common__pagination.wp-pagination .page-numbers.dots:hover {
    box-shadow: 0 min(8px + (100vw - 1440px) * 0.0014285714, 9.6px) 0 rgba(0, 0, 0, 0.16);
  }
}
.common__pagination.wp-pagination .page-numbers.current {
  filter: invert(1);
  box-shadow: 0 1.6vw 0 rgba(255, 255, 255, 0.16);
}
@media only screen and (min-width: 767px) {
  .common__pagination.wp-pagination .page-numbers.current {
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(255, 255, 255, 0.16);
  }
}
@media only screen and (min-width: 1440px) {
  .common__pagination.wp-pagination .page-numbers.current {
    box-shadow: 0 min(8px + (100vw - 1440px) * 0.0014285714, 9.6px) 0 rgba(255, 255, 255, 0.16);
  }
}
.common__pagination.wp-pagination .page-numbers.current:hover {
  transform: none;
}
.common__pagination.wp-pagination .page-numbers.inactive {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.common__pagination.wp-pagination .page-numbers.prev {
  width: auto;
  height: auto;
  padding: 5.3333333333vw;
  background-image: url(../data/webp/common/pagination_left.webp);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 2.9333333333vw;
}
@media only screen and (min-width: 767px) {
  .common__pagination.wp-pagination .page-numbers.prev {
    padding: min(1.7361111111vw, 25px);
    background-size: min(0.9722222222vw, 14px);
  }
}
@media only screen and (min-width: 1440px) {
  .common__pagination.wp-pagination .page-numbers.prev {
    padding: min(25px + (100vw - 1440px) * 0.0044642857, 30px);
    background-size: min(14px + (100vw - 1440px) * 0.0025, 16.8px);
  }
}
.common__pagination.wp-pagination .page-numbers.next {
  width: auto;
  height: auto;
  padding: 5.3333333333vw;
  background-image: url(../data/webp/common/pagination_right.webp);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 2.9333333333vw;
}
@media only screen and (min-width: 767px) {
  .common__pagination.wp-pagination .page-numbers.next {
    padding: min(1.7361111111vw, 25px);
    background-size: min(0.9722222222vw, 14px);
  }
}
@media only screen and (min-width: 1440px) {
  .common__pagination.wp-pagination .page-numbers.next {
    padding: min(25px + (100vw - 1440px) * 0.0044642857, 30px);
    background-size: min(14px + (100vw - 1440px) * 0.0025, 16.8px);
  }
}
.common__pagination:first-child {
  background-image: url(../data/webp/common/pagination_left.webp);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 2.9333333333vw;
}
@media only screen and (min-width: 767px) {
  .common__pagination:first-child {
    background-size: min(0.9722222222vw, 14px);
  }
}
@media only screen and (min-width: 1440px) {
  .common__pagination:first-child {
    background-size: min(14px + (100vw - 1440px) * 0.0025, 16.8px);
  }
}
.common__pagination:last-child {
  background-image: url(../data/webp/common/pagination_right.webp);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 2.9333333333vw;
}
@media only screen and (min-width: 767px) {
  .common__pagination:last-child {
    background-size: min(0.9722222222vw, 14px);
  }
}
@media only screen and (min-width: 1440px) {
  .common__pagination:last-child {
    background-size: min(14px + (100vw - 1440px) * 0.0025, 16.8px);
  }
}

/* テーマの共通CSSに必ず定義してください */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  word-wrap: normal !important;
}

.common-contact {
  position: relative;
  z-index: 1;
  padding: 8vw 0;
  background-color: black;
}
@media only screen and (min-width: 767px) {
  .common-contact {
    padding: min(1.875vw, 27px) 0 min(2.2222222222vw, 32px);
  }
}
.common-contact__slide {
  position: relative;
  height: 24.1333333333vw;
  overflow: hidden;
  z-index: 1;
  display: block;
}
@media only screen and (min-width: 767px) {
  .common-contact__slide {
    height: min(12.5694444444vw, 181px);
  }
}
.common-contact__slide-gradient {
  position: absolute;
  top: 50%;
  width: 100%;
  height: 13.8666666667vw;
  mask-image: url(../data/webp/top/recruit/text_slide.webp);
  mask-repeat: repeat-x;
  mask-size: 82.1333333333vw 13.8666666667vw;
  transform: translateY(-50%);
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
@media only screen and (min-width: 767px) {
  .common-contact__slide-gradient {
    transition: all 300ms;
    height: min(7.2222222222vw, 104px);
    mask-size: min(42.7777777778vw, 616px) min(7.2222222222vw, 104px);
  }
}
.common-contact__slide-white {
  position: absolute;
  top: 0;
  width: 100%;
  height: 3.0666666667vw;
  background: url(../data/webp/top/recruit/text_slide_white.webp);
  background-repeat: repeat-x;
  background-size: 22.8vw 3.0666666667vw;
}
@media only screen and (min-width: 767px) {
  .common-contact__slide-white {
    height: min(1.5972222222vw, 23px);
    background-size: min(11.875vw, 171px) min(1.5972222222vw, 23px);
  }
}
.common-contact__slide-white.is-second {
  top: auto;
  bottom: 0;
}

.common-details {
  position: relative;
  z-index: 1;
  padding-bottom: 26.6666666667vw;
  margin-top: 13.3333333333vw;
  margin-inline: auto;
  width: 89.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details {
    width: 100%;
    max-width: min(55.5555555556vw, 800px);
    margin-top: min(4.1666666667vw, 60px);
    padding-bottom: min(6.5972222222vw, 95px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details {
    max-width: min(800px + (100vw - 1440px) * 0.1428571429, 960px);
    margin-top: min(60px + (100vw - 1440px) * 0.0107142857, 72px);
    padding-bottom: min(95px + (100vw - 1440px) * 0.0169642857, 114px);
  }
}
.common-details__thumb {
  margin-top: 5.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details__thumb {
    margin-top: min(2.7777777778vw, 40px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details__thumb {
    margin-top: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
  }
}
.common-details__thumb img {
  border-radius: 2.1333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details__thumb img {
    border-radius: min(1.1111111111vw, 16px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details__thumb img {
    border-radius: min(16px + (100vw - 1440px) * 0.0028571429, 19.2px);
  }
}
.common-details__inner > img {
  max-width: 100%;
  border-radius: 2.1333333333vw;
  margin-top: 5.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details__inner > img {
    width: auto;
    border-radius: min(1.1111111111vw, 16px);
    margin-top: min(2.7777777778vw, 40px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details__inner > img {
    border-radius: min(16px + (100vw - 1440px) * 0.0028571429, 19.2px);
    margin-top: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
  }
}
.common-details__inner > a {
  display: block;
  font-size: 4vw;
  line-height: 1.8666666667;
  margin-top: 1.3333333333vw;
  text-decoration: underline;
  font-weight: 400;
  width: fit-content;
}
@media only screen and (min-width: 767px) {
  .common-details__inner > a {
    font-size: min(1.3888888889vw, 20px);
    line-height: 1.8;
    margin-top: min(1.0416666667vw, 15px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details__inner > a {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    line-height: 1.8;
    margin-top: min(15px + (100vw - 1440px) * 0.0026785714, 18px);
  }
}
.common-details__inner > a[target=blank] {
  text-decoration: none;
  position: relative;
}
.common-details__inner > a[target=blank]::after {
  content: "";
  display: block;
  background-image: url(../data/webp/blank.webp);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: -4vw;
  width: 3.6vw;
  height: 3.6vw;
}
@media only screen and (min-width: 767px) {
  .common-details__inner > a[target=blank]::after {
    width: min(1.1111111111vw, 16px);
    height: min(1.1111111111vw, 16px);
    right: min(-1.1111111111vw, -16px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details__inner > a[target=blank]::after {
    width: min(16px + (100vw - 1440px) * 0.0028571429, 19.2px);
    height: min(16px + (100vw - 1440px) * 0.0028571429, 19.2px);
    right: min(-16px + (100vw - 1440px) * -0.0028571429, -19.2px);
  }
}
.common-details__tag {
  display: flex;
  flex-direction: row;
  gap: 1.0666666667vw;
  flex-wrap: wrap;
  margin-top: 1.0666666667vw;
}
@media only screen and (min-width: 767px) {
  .common-details__tag {
    gap: min(0.5555555556vw, 8px);
    margin-top: min(0.5555555556vw, 8px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details__tag {
    gap: min(8px + (100vw - 1440px) * 0.0014285714, 9.6px);
    margin-top: min(8px + (100vw - 1440px) * 0.0014285714, 9.6px);
  }
}
.common-details__type {
  position: relative;
  width: fit-content;
  font-size: 2.6666666667vw;
  border-radius: 2.6666666667vw;
  font-weight: 800;
  font-family: "M PLUS 1p", sans-serif;
  transition: all 300ms;
  color: white;
  background-color: black;
  padding: 1.3333333333vw 2.4vw 1.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details__type {
    font-size: min(0.9722222222vw, 14px);
    border-radius: min(0.8333333333vw, 12px);
    padding: min(0.3472222222vw, 5px) min(0.6944444444vw, 10px) min(0.3472222222vw, 5px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details__type {
    font-size: min(14px + (100vw - 1440px) * 0.0025, 16.8px);
    border-radius: min(12px + (100vw - 1440px) * 0.0021428571, 14.4px);
    padding: min(5px + (100vw - 1440px) * 0.0008928571, 6px) min(10px + (100vw - 1440px) * 0.0017857143, 12px) min(5px + (100vw - 1440px) * 0.0008928571, 6px);
  }
}
.common-details time {
  display: block;
  font-size: 3.4666666667vw;
  color: #888888;
  font-family: "M PLUS 1p", sans-serif;
  margin-top: 5.3333333333vw;
  font-weight: 700;
}
@media only screen and (min-width: 767px) {
  .common-details time {
    font-size: min(1.3888888889vw, 20px);
    margin-top: min(2.7777777778vw, 40px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details time {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    margin-top: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
  }
}
.common-details time:first-child {
  margin-top: 0;
}
.common-details time + .common-details__tag {
  margin-top: 2.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .common-details time + .common-details__tag {
    margin-top: min(1.1111111111vw, 16px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details time + .common-details__tag {
    margin-top: min(16px + (100vw - 1440px) * 0.0028571429, 19.2px);
  }
}
.common-details hr {
  width: 100%;
  height: 1.3333333333vw;
  border-radius: 0.6666666667vw;
  border: 0;
  background: linear-gradient(90deg, #f742fd 0%, #fc3231 27%, #ffbd18 51%, #fc3231 78%, #3019ff 100%);
}
@media only screen and (min-width: 767px) {
  .common-details hr {
    height: min(0.4166666667vw, 6px);
    border-radius: min(0.2083333333vw, 3px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details hr {
    height: min(6px + (100vw - 1440px) * 0.0010714286, 7.2px);
    border-radius: min(3px + (100vw - 1440px) * 0.0005357143, 3.6px);
  }
}
.common-details h1 {
  font-size: 6.6666666667vw;
  font-weight: 700;
  line-height: 1.44;
  margin: 4vw 0 5.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details h1 {
    font-size: min(2.7777777778vw, 40px);
    line-height: 1.25;
    margin: min(2.0833333333vw, 30px) 0 min(1.3888888889vw, 20px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details h1 {
    font-size: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
    line-height: 1.25;
    margin: min(30px + (100vw - 1440px) * 0.0053571429, 36px) 0 min(20px + (100vw - 1440px) * 0.0035714286, 24px);
  }
}
.common-details h2 {
  font-size: 6.6666666667vw;
  font-weight: 700;
  line-height: 1.44;
  margin-top: 10.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .common-details h2 {
    font-size: min(2.7777777778vw, 40px);
    line-height: 1.25;
    margin-top: min(5.5555555556vw, 80px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details h2 {
    font-size: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
    line-height: 1.25;
    margin-top: min(80px + (100vw - 1440px) * 0.0142857143, 96px);
  }
}
.common-details h3 {
  position: relative;
  padding-left: 3.8666666667vw;
  font-size: 6.6666666667vw;
  font-weight: 700;
  line-height: 1.44;
  margin-top: 10.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .common-details h3 {
    font-size: min(2.0833333333vw, 30px);
    line-height: 1.4666666667;
    padding-left: min(1.25vw, 18px);
    margin-top: min(4.1666666667vw, 60px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details h3 {
    font-size: min(30px + (100vw - 1440px) * 0.0053571429, 36px);
    line-height: 1.4666666667;
    padding-left: min(18px + (100vw - 1440px) * 0.0032142857, 21.6px);
    margin-top: min(60px + (100vw - 1440px) * 0.0107142857, 72px);
  }
}
.common-details h3:before {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  width: 1.3333333333vw;
  height: 5.8666666667vw;
  background-color: #000;
  border-radius: 0.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .common-details h3:before {
    width: min(0.4166666667vw, 6px);
    height: min(2.2916666667vw, 33px);
    border-radius: min(0.2083333333vw, 3px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details h3:before {
    width: min(6px + (100vw - 1440px) * 0.0010714286, 7.2px);
    height: min(33px + (100vw - 1440px) * 0.0058928571, 39.6px);
    border-radius: min(3px + (100vw - 1440px) * 0.0005357143, 3.6px);
  }
}
.common-details h3 + p {
  margin-top: 1.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details h3 + p {
    margin-top: min(1.0416666667vw, 15px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details h3 + p {
    margin-top: min(15px + (100vw - 1440px) * 0.0026785714, 18px);
  }
}
.common-details h4 {
  font-size: 4.8vw;
  font-weight: 700;
  line-height: 1.0277777778;
  margin-top: 5.6vw;
}
@media only screen and (min-width: 767px) {
  .common-details h4 {
    font-size: min(1.6666666667vw, 24px);
    line-height: 1.8333333333;
    margin-top: min(2.0833333333vw, 30px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details h4 {
    font-size: min(24px + (100vw - 1440px) * 0.0042857143, 28.8px);
    line-height: 1.8333333333;
    margin-top: min(30px + (100vw - 1440px) * 0.0053571429, 36px);
  }
}
.common-details h4 + p {
  margin-top: 2.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .common-details h4 + p {
    margin-top: min(0.3472222222vw, 5px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details h4 + p {
    margin-top: min(5px + (100vw - 1440px) * 0.0008928571, 6px);
  }
}
.common-details p {
  font-size: 4vw;
  font-weight: 400;
  line-height: 1.8666666667;
  margin-top: 1.6vw;
}
@media only screen and (min-width: 767px) {
  .common-details p {
    font-size: min(1.3888888889vw, 20px);
    line-height: 1.8;
    margin-top: min(2.0833333333vw, 30px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details p {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    line-height: 1.8;
    margin-top: min(30px + (100vw - 1440px) * 0.0053571429, 36px);
  }
}
.common-details p + p {
  margin-top: 5.8666666667vw;
}
@media only screen and (min-width: 767px) {
  .common-details p + p {
    margin-top: min(2.7777777778vw, 40px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details p + p {
    margin-top: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
  }
}
.common-details strong {
  display: block;
  font-size: 4vw;
  font-weight: 700;
  line-height: 1.8666666667;
  margin-top: 1.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details strong {
    font-size: min(1.3888888889vw, 20px);
    line-height: 1.8;
    margin-top: min(1.0416666667vw, 15px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details strong {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    line-height: 1.8;
    margin-top: min(15px + (100vw - 1440px) * 0.0026785714, 18px);
  }
}
.common-details ul {
  margin-top: 1.4666666667vw;
}
@media only screen and (min-width: 767px) {
  .common-details ul {
    margin-top: min(2.0833333333vw, 30px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details ul {
    margin-top: min(30px + (100vw - 1440px) * 0.0053571429, 36px);
  }
}
.common-details ul > li {
  position: relative;
  font-size: 4vw;
  font-weight: 400;
  line-height: 1.8666666667;
  padding-left: 4vw;
}
@media only screen and (min-width: 767px) {
  .common-details ul > li {
    font-size: min(1.3888888889vw, 20px);
    line-height: 1.8;
    padding-left: min(2.7777777778vw, 40px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details ul > li {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    line-height: 1.8;
    padding-left: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
  }
}
.common-details ul > li:before {
  display: block;
  content: "";
  content: "・";
  position: absolute;
  top: 0;
  left: 0;
}
.common-details ul > li:not(:first-child) {
  margin-top: 7.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details ul > li:not(:first-child) {
    margin-top: min(1.0416666667vw, 15px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details ul > li:not(:first-child) {
    margin-top: min(15px + (100vw - 1440px) * 0.0026785714, 18px);
  }
}
.common-details small {
  display: block;
  font-size: 3.2vw;
  line-height: 1.8333333333;
  color: #808080;
  margin-top: 6.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .common-details small {
    font-size: min(1.3888888889vw, 20px);
    line-height: 1.8;
    margin-top: min(1.7361111111vw, 25px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details small {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    line-height: 1.8;
    margin-top: min(25px + (100vw - 1440px) * 0.0044642857, 30px);
  }
}
.common-details figure {
  position: relative;
  display: flex;
  justify-content: start;
  flex-direction: column;
}
.common-details figure > .is-row {
  margin-top: 5.3333333333vw;
  position: relative;
  width: 100%;
  display: flex;
  column-gap: 4.2666666667vw;
}
@media only screen and (min-width: 767px) {
  .common-details figure > .is-row {
    column-gap: min(2.7777777778vw, 40px);
    margin-top: min(2.7777777778vw, 40px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details figure > .is-row {
    column-gap: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
    margin-top: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
  }
}
.common-details figure img {
  border-radius: 2.1333333333vw;
  width: 42.2666666667vw;
}
@media only screen and (min-width: 767px) {
  .common-details figure img {
    border-radius: min(1.1111111111vw, 16px);
    width: auto;
    max-width: min(26.3888888889vw, 380px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details figure img {
    border-radius: min(16px + (100vw - 1440px) * 0.0028571429, 19.2px);
    max-width: min(380px + (100vw - 1440px) * 0.0678571429, 456px);
  }
}
.common-details figure figcaption {
  position: relative;
  font-size: 3.2vw;
  line-height: 1.8333333333;
  color: #808080;
  margin-top: 2.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .common-details figure figcaption {
    font-size: min(1.3888888889vw, 20px);
    line-height: 1.1666666667;
    margin-top: min(1.3888888889vw, 20px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details figure figcaption {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    line-height: 1.1666666667;
    margin-top: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
  }
}
.common-details button {
  margin-top: 4vw;
  position: relative;
}
@media only screen and (min-width: 767px) {
  .common-details button {
    margin-top: min(2.7777777778vw, 40px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details button {
    margin-top: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
  }
}
.common-details button img {
  margin: 0;
  border-radius: 2.1333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details button img {
    border-radius: min(1.1111111111vw, 16px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details button img {
    border-radius: min(16px + (100vw - 1440px) * 0.0028571429, 19.2px);
  }
}
.common-details button .is-icon {
  position: absolute;
  width: 13.3333333333vw;
  height: 13.3333333333vw;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
.common-details button .is-icon {
  background-size: 800% 100%;
}
@media only screen and (min-width: 767px) {
  .common-details button .is-icon {
    width: min(6.9444444444vw, 100px);
    height: min(6.9444444444vw, 100px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details button .is-icon {
    width: min(100px + (100vw - 1440px) * 0.0178571429, 120px);
    height: min(100px + (100vw - 1440px) * 0.0178571429, 120px);
  }
}
.common-details button .is-icon:before {
  display: block;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: white;
  border-radius: 50%;
}
.common-details button .is-icon:after {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  mask-image: url(../data/webp/common/icon_play.webp);
  mask-repeat: no-repeat;
  mask-size: contain;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
.common-details button .is-icon:after {
  background-size: 800% 100%;
}
.common-details .red {
  color: #fc3231;
  font-size: 4vw;
  font-weight: 700;
  line-height: 1.8666666667;
  margin-top: 1.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details .red {
    font-size: min(1.3888888889vw, 20px);
    line-height: 1.8;
    margin-top: min(1.0416666667vw, 15px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details .red {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    line-height: 1.8;
    margin-top: min(15px + (100vw - 1440px) * 0.0026785714, 18px);
  }
}
.common-details .yellow {
  color: #ffbd18;
  font-size: 4vw;
  font-weight: 700;
  line-height: 1.8666666667;
  margin-top: 1.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details .yellow {
    font-size: min(1.3888888889vw, 20px);
    line-height: 1.8;
    margin-top: min(1.0416666667vw, 15px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details .yellow {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    line-height: 1.8;
    margin-top: min(15px + (100vw - 1440px) * 0.0026785714, 18px);
  }
}
.common-details .blue {
  color: #3019ff;
  font-size: 4vw;
  font-weight: 700;
  line-height: 1.8666666667;
  margin-top: 1.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details .blue {
    font-size: min(1.3888888889vw, 20px);
    line-height: 1.8;
    margin-top: min(1.0416666667vw, 15px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details .blue {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    line-height: 1.8;
    margin-top: min(15px + (100vw - 1440px) * 0.0026785714, 18px);
  }
}
.common-details .common-details__content {
  margin-top: 8vw;
  padding: 6.4vw;
  background-color: #fff;
}
@media only screen and (min-width: 767px) {
  .common-details .common-details__content {
    margin-top: min(2.7777777778vw, 40px);
    padding: min(2.3611111111vw, 34px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details .common-details__content {
    margin-top: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
    padding: min(34px + (100vw - 1440px) * 0.0060714286, 40.8px);
  }
}
.common-details .common-details__content > p {
  margin-top: 0;
  font-size: 4vw;
  font-weight: 400;
  line-height: 1.8666666667;
}
@media only screen and (min-width: 767px) {
  .common-details .common-details__content > p {
    font-size: min(1.3888888889vw, 20px);
    line-height: 1.8;
  }
}
@media only screen and (min-width: 1440px) {
  .common-details .common-details__content > p {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    line-height: 1.8;
  }
}
.common-details .common-details__info:first-child {
  margin-top: 0;
}
.common-details .common-details__info-row {
  display: flex;
  flex-direction: column;
  margin-top: 0;
  padding: 0;
}
@media only screen and (min-width: 767px) {
  .common-details .common-details__info-row {
    flex-direction: row;
    font-size: min(1.3888888889vw, 20px);
    column-gap: min(1.1111111111vw, 16px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details .common-details__info-row {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    column-gap: min(16px + (100vw - 1440px) * 0.0028571429, 19.2px);
  }
}
.common-details .common-details__info-row:before {
  display: block;
  content: "";
  display: none;
}
.common-details .common-details__info-row:not(:first-child) {
  margin-top: 5.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details .common-details__info-row:not(:first-child) {
    margin-top: min(1.0416666667vw, 15px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details .common-details__info-row:not(:first-child) {
    margin-top: min(15px + (100vw - 1440px) * 0.0026785714, 18px);
  }
}
.common-details .common-details__info-head {
  font-weight: 700;
  font-size: 4vw;
}
@media only screen and (min-width: 767px) {
  .common-details .common-details__info-head {
    font-weight: 500;
    font-size: min(1.25vw, 18px);
    width: min(10.4166666667vw, 150px);
    flex-shrink: 0;
  }
}
@media only screen and (min-width: 1440px) {
  .common-details .common-details__info-head {
    font-size: min(18px + (100vw - 1440px) * 0.0032142857, 21.6px);
    width: min(150px + (100vw - 1440px) * 0.0267857143, 180px);
  }
}
.common-details .common-details__info-label {
  font-weight: 400;
  font-size: 4vw;
}
@media only screen and (min-width: 767px) {
  .common-details .common-details__info-label {
    font-size: min(1.25vw, 18px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details .common-details__info-label {
    font-size: min(18px + (100vw - 1440px) * 0.0032142857, 21.6px);
  }
}
.common-details .common__wrapper {
  margin-top: 9.0666666667vw;
}
@media only screen and (min-width: 767px) {
  .common-details .common__wrapper {
    margin-top: min(2.0833333333vw, 30px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details .common__wrapper {
    margin-top: min(30px + (100vw - 1440px) * 0.0053571429, 36px);
  }
}
.common-details .common__wrapper > img {
  max-width: 100%;
  border-radius: 2.1333333333vw;
  margin-top: 5.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details .common__wrapper > img {
    width: auto;
    border-radius: min(1.1111111111vw, 16px);
    margin-top: min(2.7777777778vw, 40px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details .common__wrapper > img {
    border-radius: min(16px + (100vw - 1440px) * 0.0028571429, 19.2px);
    margin-top: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
  }
}
.common-details .common__btn[target=_blank] .common-details__text {
  padding: 3.3333333333vw 13.3333333333vw 3.6vw 5.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details .common__btn[target=_blank] .common-details__text {
    padding: min(1.1805555556vw, 17px) min(5.5555555556vw, 80px) min(1.3888888889vw, 20px) min(2.0833333333vw, 30px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details .common__btn[target=_blank] .common-details__text {
    padding: min(17px + (100vw - 1440px) * 0.0030357143, 20.4px) min(80px + (100vw - 1440px) * 0.0142857143, 96px) min(20px + (100vw - 1440px) * 0.0035714286, 24px) min(30px + (100vw - 1440px) * 0.0053571429, 36px);
  }
}
.common-details .common__btn[target=_blank] .common-details__icon {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  pointer-events: none;
  mask-image: url(../data/webp/common/icon_ext.webp);
  mask-repeat: no-repeat;
  mask-size: 5.2vw 4.5333333333vw;
  mask-position: 90% 50%;
  pointer-events: none;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
  background-size: 400% 100%;
}
@media only screen and (min-width: 767px) {
  .common-details .common__btn[target=_blank] .common-details__icon {
    mask-size: min(1.9444444444vw, 28px) min(1.6666666667vw, 24px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details .common__btn[target=_blank] .common-details__icon {
    mask-size: min(28px + (100vw - 1440px) * 0.005, 33.6px) min(24px + (100vw - 1440px) * 0.0042857143, 28.8px);
  }
}
.common-details .common__btn.is-black {
  background: none;
}
@media only screen and (min-width: 767px) {
  .common-details .common__btn.is-black {
    background: black;
  }
}
.common-details .common__btn.is-black .common-details__text {
  color: black;
}
.common-details .common__btn.is-black .common-details__icon {
  background: black;
}
.common-details__text {
  position: relative;
  display: block;
  width: 100%;
  height: max-content;
  pointer-events: none;
  color: transparent;
  font-size: 3.7333333333vw;
  padding: 3.3333333333vw 13.3333333333vw 3.8666666667vw 5.3333333333vw;
  font-weight: 800;
  text-wrap: wrap;
  transition: all 300ms;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
.common-details__text {
  background-clip: text;
  -webkit-background-clip: text;
}
@media only screen and (min-width: 767px) {
  .common-details__text {
    font-size: min(1.3888888889vw, 20px);
    padding: min(1.1805555556vw, 17px) min(5.5555555556vw, 80px) min(1.3888888889vw, 20px) min(2.0833333333vw, 30px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details__text {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    padding: min(17px + (100vw - 1440px) * 0.0030357143, 20.4px) min(80px + (100vw - 1440px) * 0.0142857143, 96px) min(20px + (100vw - 1440px) * 0.0035714286, 24px) min(30px + (100vw - 1440px) * 0.0053571429, 36px);
  }
}
.common-details__icon {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  pointer-events: none;
  transition: all 300ms;
  mask-image: url(../data/webp/arrow.webp);
  mask-repeat: no-repeat;
  mask-size: 6.5333333333vw 3.8666666667vw;
  mask-position: 90% 52%;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
  background-size: 400% 100%;
}
@media only screen and (min-width: 767px) {
  .common-details__icon {
    mask-size: min(2.5vw, 36px) min(1.4583333333vw, 21px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details__icon {
    mask-size: min(36px + (100vw - 1440px) * 0.0064285714, 43.2px) min(21px + (100vw - 1440px) * 0.00375, 25.2px);
  }
}
.common-details__control {
  display: flex;
  flex-direction: column;
  margin-top: 13.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .common-details__control {
    margin-top: min(6.9444444444vw, 100px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details__control {
    margin-top: min(100px + (100vw - 1440px) * 0.0178571429, 120px);
  }
}
.common-details__control-inner {
  display: flex;
  flex-direction: row;
  gap: 4.2666666667vw;
  justify-content: center;
}
@media only screen and (min-width: 767px) {
  .common-details__control-inner {
    gap: min(1.3888888889vw, 20px);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details__control-inner {
    gap: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
  }
}
.common-details__prev {
  display: block;
  width: 25.2vw;
  height: 10.9333333333vw;
  background: white;
  border-radius: 5.4666666667vw;
  box-shadow: 0 1.0666666667vw 0 rgba(0, 0, 0, 0.16);
  position: relative;
  z-index: 1;
  transition: all 300ms;
  background-image: url(../data/webp/common/prev.webp);
  background-size: contain;
}
@media only screen and (min-width: 767px) {
  .common-details__prev {
    width: min(7.9861111111vw, 115px);
    height: min(3.4722222222vw, 50px);
    border-radius: min(1.7361111111vw, 25px);
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(0, 0, 0, 0.16);
  }
  .common-details__prev:hover {
    transform: scale(0.95);
    filter: invert(1);
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(255, 255, 255, 0.16);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details__prev {
    width: min(115px + (100vw - 1440px) * 0.0205357143, 138px);
    height: min(50px + (100vw - 1440px) * 0.0089285714, 60px);
    border-radius: min(25px + (100vw - 1440px) * 0.0044642857, 30px);
    box-shadow: 0 min(8px + (100vw - 1440px) * 0.0014285714, 9.6px) 0 rgba(0, 0, 0, 0.16);
  }
}
.common-details__next {
  display: block;
  width: 25.2vw;
  height: 10.9333333333vw;
  background: white;
  border-radius: 5.4666666667vw;
  box-shadow: 0 1.0666666667vw 0 rgba(0, 0, 0, 0.16);
  position: relative;
  z-index: 1;
  transition: all 300ms;
  background-image: url(../data/webp/common/next.webp);
  background-size: contain;
}
@media only screen and (min-width: 767px) {
  .common-details__next {
    width: min(7.9861111111vw, 115px);
    height: min(3.4722222222vw, 50px);
    border-radius: min(1.7361111111vw, 25px);
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(0, 0, 0, 0.16);
  }
  .common-details__next:hover {
    transform: scale(0.95);
    filter: invert(1);
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(255, 255, 255, 0.16);
  }
}
@media only screen and (min-width: 1440px) {
  .common-details__next {
    width: min(115px + (100vw - 1440px) * 0.0205357143, 138px);
    height: min(50px + (100vw - 1440px) * 0.0089285714, 60px);
    border-radius: min(25px + (100vw - 1440px) * 0.0044642857, 30px);
    box-shadow: 0 min(8px + (100vw - 1440px) * 0.0014285714, 9.6px) 0 rgba(0, 0, 0, 0.16);
  }
}
.common-details__back {
  display: flex;
  width: fit-content;
  margin: 8vw auto 0;
  font-family: "futura-pt-condensed", sans-serif;
  font-size: 6.4vw;
  font-weight: 800;
  transition: all 300ms;
}
@media only screen and (min-width: 767px) {
  .common-details__back {
    font-size: min(2.2222222222vw, 32px);
    margin: min(4.1666666667vw, 60px) auto 0;
  }
}
@media only screen and (min-width: 1440px) {
  .common-details__back {
    font-size: min(32px + (100vw - 1440px) * 0.0057142857, 38.4px);
    margin: min(60px + (100vw - 1440px) * 0.0107142857, 72px) auto 0;
  }
}

.header {
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 99;
  width: 89.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .header {
    width: min(55.5555555556vw, 800px);
    height: min(3.4722222222vw, 50px);
  }
}
@media only screen and (min-width: 1440px) {
  .header {
    width: min(800px + (100vw - 1440px) * 0.1428571429, 960px);
    height: min(50px + (100vw - 1440px) * 0.0089285714, 60px);
  }
}
.header__inner {
  overflow: hidden;
  background-color: #fff;
  border-radius: 0 0 4.2666666667vw 4.2666666667vw;
  box-shadow: 0 1.0666666667vw 0 rgba(0, 0, 0, 0.16);
}
@media only screen and (min-width: 767px) {
  .header__inner {
    width: min(55.5555555556vw, 800px);
    height: min(3.4722222222vw, 50px);
    border-radius: 0 0 min(1.7361111111vw, 25px) min(1.7361111111vw, 25px);
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(0, 0, 0, 0.16);
  }
}
@media only screen and (min-width: 1440px) {
  .header__inner {
    width: min(800px + (100vw - 1440px) * 0.1428571429, 960px);
    height: min(50px + (100vw - 1440px) * 0.0089285714, 60px);
    border-radius: 0 0 min(25px + (100vw - 1440px) * 0.0044642857, 30px) min(25px + (100vw - 1440px) * 0.0044642857, 30px);
    box-shadow: 0 min(8px + (100vw - 1440px) * 0.0014285714, 9.6px) 0 rgba(0, 0, 0, 0.16);
  }
}
.header__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 3.2vw 5.0666666667vw 3.2vw 5.6vw;
}
@media only screen and (min-width: 767px) {
  .header__bar {
    padding: min(0.9722222222vw, 14px) min(2.0833333333vw, 30px) min(0.9722222222vw, 14px) min(1.6666666667vw, 24px);
    justify-content: unset;
  }
}
@media only screen and (min-width: 1440px) {
  .header__bar {
    padding: min(14px + (100vw - 1440px) * 0.0025, 16.8px) min(30px + (100vw - 1440px) * 0.0053571429, 36px) min(14px + (100vw - 1440px) * 0.0025, 16.8px) min(24px + (100vw - 1440px) * 0.0042857143, 28.8px);
  }
}
.header__logo {
  margin: 0;
  width: 28.6666666667vw;
  height: 4vw;
}
@media only screen and (min-width: 767px) {
  .header__logo {
    flex-shrink: 0;
    width: min(7.0138888889vw, 101px);
    height: min(1.0416666667vw, 15px);
    margin-right: min(1.7361111111vw, 25px);
  }
}
@media only screen and (min-width: 1440px) {
  .header__logo {
    width: min(101px + (100vw - 1440px) * 0.0180357143, 121.2px);
    height: min(15px + (100vw - 1440px) * 0.0026785714, 18px);
    margin-right: min(25px + (100vw - 1440px) * 0.0044642857, 30px);
  }
}
.header__logo-gradient {
  display: block;
  width: 100%;
  height: 100%;
  mask-size: contain;
  mask-image: url(../data/webp/logo.webp);
  mask-repeat: no-repeat;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
.header__links {
  display: none;
}
@media only screen and (min-width: 767px) {
  .header__links {
    display: flex;
    flex-direction: row;
    gap: min(1.3888888889vw, 20px);
    align-items: center;
    margin: 0;
    padding: 0;
    list-style: none;
  }
}
@media only screen and (min-width: 1440px) {
  .header__links {
    gap: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
  }
}
@media only screen and (min-width: 767px) {
  .header__links a {
    display: block;
    font-size: min(1.3888888889vw, 20px);
    font-weight: 800;
    font-family: "futura-pt-condensed", sans-serif;
    transition: all 300ms;
    color: #b3b3b3;
  }
  .header__links a:hover {
    pointer-events: auto;
    color: #000;
  }
}
@media only screen and (min-width: 1440px) {
  .header__links a {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
  }
}
.header__links a.js-active {
  color: #000;
  pointer-events: none;
  cursor: default;
}
.header__actions {
  display: flex;
  align-items: center;
  gap: 5.0666666667vw;
}
@media only screen and (min-width: 767px) {
  .header__actions {
    gap: min(1.6666666667vw, 24px);
    margin-left: auto;
  }
}
@media only screen and (min-width: 1440px) {
  .header__actions {
    gap: min(24px + (100vw - 1440px) * 0.0042857143, 28.8px);
  }
}
.header__actions > .header__lang {
  display: none;
}
@media only screen and (min-width: 767px) {
  .header__actions > .header__lang {
    display: flex;
  }
}
.header__cart {
  display: flex;
  color: #000;
  width: 5.3333333333vw;
  height: 4.9333333333vw;
  mask-size: contain;
  mask-image: url(../data/webp/cart.webp);
  mask-repeat: no-repeat;
  background-color: black;
}
@media only screen and (min-width: 767px) {
  .header__cart {
    width: min(1.9444444444vw, 28px);
    height: min(1.8055555556vw, 26px);
    transition: all 400ms;
    background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
  }
  .header__cart:hover:before {
    display: block;
    content: "";
  }
}
@media only screen and (min-width: 767px) and (min-width: 767px) {
  .header__cart:hover:before {
    opacity: 0;
  }
}
@media only screen and (min-width: 1440px) {
  .header__cart {
    width: min(28px + (100vw - 1440px) * 0.005, 33.6px);
    height: min(26px + (100vw - 1440px) * 0.0046428571, 31.2px);
  }
}
.header__cart:before {
  display: block;
  content: "";
  opacity: 0;
}
@media only screen and (min-width: 767px) {
  .header__cart:before {
    mask-size: contain;
    mask-image: url(../data/webp/cart.webp);
    mask-repeat: no-repeat;
    background-color: black;
    width: min(1.9444444444vw, 28px);
    height: min(1.8055555556vw, 26px);
    transition: all 400ms;
    opacity: 1;
  }
}
@media only screen and (min-width: 1440px) {
  .header__cart:before {
    width: min(28px + (100vw - 1440px) * 0.005, 33.6px);
    height: min(26px + (100vw - 1440px) * 0.0046428571, 31.2px);
  }
}
.header__menu-btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 5.8666666667vw;
  height: 5.8666666667vw;
  padding: 0;
  color: #000;
  cursor: pointer;
  background: none;
  border: 0;
  transition: all 300ms;
}
@media only screen and (min-width: 767px) {
  .header__menu-btn {
    display: none;
  }
}
.header__menu-icon {
  display: flex;
  flex-direction: column;
  gap: 1.3333333333vw;
  width: 5.3333333333vw;
}
.header__menu-bar {
  display: block;
  width: 100%;
  height: 1.0666666667vw;
  background-color: #000;
  border-radius: 0.4vw;
}
.header__close-icon {
  position: absolute;
  display: none;
  width: 5.3333333333vw;
  height: 5.3333333333vw;
}
.header__close-line {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 100%;
  height: 1.0666666667vw;
  background-color: #000;
  border-radius: 0.4vw;
  transition: all 300ms;
}
.header__close-line:first-child {
  transform: translate(-50%, -50%) rotate(45deg);
}
.header__close-line:last-child {
  transform: translate(-50%, -50%) rotate(-45deg);
}
.header__drawer {
  max-height: 0;
  transition: max-height 0.35s ease;
}
@media only screen and (min-width: 767px) {
  .header__drawer {
    display: none;
  }
}
.header__nav {
  padding: 12vw 4.2666666667vw 20.6666666667vw;
}
.header__nav-list {
  display: flex;
  flex-direction: column;
  gap: 6.6666666667vw;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}
.header__nav-list a {
  font-size: 8.5333333333vw;
  font-weight: 800;
  font-family: "futura-pt-condensed", sans-serif;
  color: #b3b3b3;
}
.header__nav-list a.js-active {
  color: #000;
}
.header__lang {
  display: flex;
  gap: 6.6666666667vw;
  align-items: center;
  justify-content: center;
  padding-bottom: 11.4666666667vw;
  font-size: 7.4666666667vw;
  font-weight: 700;
  font-family: "futura-pt-condensed", sans-serif;
}
@media only screen and (min-width: 767px) {
  .header__lang {
    flex-direction: row;
    gap: min(0.9027777778vw, 13px);
    padding: 0;
    font-size: min(1.25vw, 18px);
  }
}
@media only screen and (min-width: 1440px) {
  .header__lang {
    ap: min(13px + (100vw - 1440px) * 0.0023214286, 15.6px);
    font-size: min(18px + (100vw - 1440px) * 0.0032142857, 21.6px);
  }
}
.header__lang a {
  color: #b3b3b3;
  transition: all 300ms;
}
.header__lang a.is-current {
  color: #000;
  pointer-events: none;
}
.header__lang a:hover {
  color: #000;
}
.header.is-open .header__drawer {
  max-height: calc(100dvh - 12.2666666667vw);
}
.header.is-open .header__menu-icon {
  display: none;
}
.header.is-open .header__close-icon {
  display: block;
}

body.is-menu-open {
  overflow: hidden;
}
@media only screen and (min-width: 767px) {
  body.is-menu-open {
    overflow: visible;
  }
}

.footer {
  background-color: #2b2b2b;
  color: #fff;
}
.footer__inner {
  position: relative;
  padding: 21.3333333333vw 5.3333333333vw 3.2vw;
  text-align: center;
}
@media only screen and (min-width: 767px) {
  .footer__inner {
    text-align: left;
    padding: min(4.4444444444vw, 64px) min(2.0833333333vw, 30px) min(1.5277777778vw, 22px);
  }
}
.footer__pagetop {
  position: absolute;
  top: 5.3333333333vw;
  right: 2.6666666667vw;
  display: block;
  width: 6.6666666667vw;
  height: 4vw;
  pointer-events: auto;
  transform: rotate(-90deg);
  mask-image: url(../data/webp/arrow.webp);
  mask-repeat: no-repeat;
  mask-size: contain;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
@media only screen and (min-width: 767px) {
  .footer__pagetop {
    top: min(2.7777777778vw, 40px);
    right: min(1.3888888889vw, 20px);
    width: min(2.5vw, 36px);
    height: min(1.4583333333vw, 21px);
  }
}
.footer__pagetop img {
  width: 100%;
  pointer-events: none;
}
.footer__brand {
  display: inline-flex;
  gap: 3.0666666667vw;
  align-items: end;
  justify-content: center;
  margin-bottom: 7.8666666667vw;
  color: #fff;
  pointer-events: auto;
}
@media only screen and (min-width: 767px) {
  .footer__brand {
    gap: min(1.0416666667vw, 15px);
    margin-bottom: min(2.0138888889vw, 29px);
  }
}
.footer__brand-icon {
  width: 18.5333333333vw;
  flex-shrink: 0;
  pointer-events: none;
}
@media only screen and (min-width: 767px) {
  .footer__brand-icon {
    width: min(6.4583333333vw, 93px);
  }
}
.footer__brand-logo {
  width: 42.5333333333vw;
  pointer-events: none;
  filter: brightness(0) invert(1);
}
@media only screen and (min-width: 767px) {
  .footer__brand-logo {
    width: min(14.7916666667vw, 213px);
  }
}
.footer__nav {
  margin-bottom: 13.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .footer__nav {
    margin-bottom: min(2.0833333333vw, 30px);
  }
}
.footer__nav-list {
  display: flex;
  flex-wrap: wrap;
  column-gap: 3.7333333333vw;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
}
@media only screen and (min-width: 767px) {
  .footer__nav-list {
    justify-content: start;
    column-gap: min(1.6666666667vw, 24px);
  }
}
.footer__nav-list a {
  display: block;
  font-size: 4.2666666667vw;
  font-weight: 800;
  font-family: "futura-pt-condensed", sans-serif;
  transition: all 300ms;
  color: #aaaaaa;
}
@media only screen and (min-width: 767px) {
  .footer__nav-list a {
    font-size: min(1.6666666667vw, 24px);
  }
  .footer__nav-list a:hover {
    color: #fff;
  }
}
.footer__nav-list a.js-active {
  color: #fff;
  pointer-events: none;
  cursor: default;
}
.footer__subnav {
  display: flex;
  flex-direction: column;
  gap: 5.3333333333vw;
  margin-bottom: 13.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .footer__subnav {
    position: absolute;
    bottom: 0;
    right: 0;
    flex-direction: row;
    gap: min(1.3888888889vw, 20px);
    margin-right: min(2.0833333333vw, 30px);
    margin-bottom: min(1.5277777778vw, 22px);
  }
}
.footer__subnav-row {
  display: flex;
  flex-wrap: wrap;
  gap: 3.2vw 6.4vw;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  font-family: "Noto Sans JP", sans-serif;
}
@media only screen and (min-width: 767px) {
  .footer__subnav-row {
    column-gap: min(2.0833333333vw, 30px);
  }
}
.footer__subnav-row a {
  font-size: 2.6666666667vw;
  font-weight: 400;
  color: #aaaaaa;
  pointer-events: auto;
}
@media only screen and (min-width: 767px) {
  .footer__subnav-row a {
    font-size: min(0.8333333333vw, 12px);
  }
}
.footer__copyright {
  margin: 0;
  font-size: 2.6666666667vw;
  color: #aaaaaa;
  font-family: "Noto Sans JP", sans-serif;
}
@media only screen and (min-width: 767px) {
  .footer__copyright {
    font-size: min(0.8333333333vw, 12px);
  }
}

.loading {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 1000;
  background-color: white;
}
.loading__logo {
  position: relative;
  width: 25.6vw;
  height: 25.6vw;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(1.1);
}
@media only screen and (min-width: 767px) {
  .loading__logo {
    position: absolute;
    width: 13.3333333333vw;
    height: 13.3333333333vw;
    transform: translate(-50%, -50%) scale(0.9);
  }
}
.loading__logo-layer {
  position: absolute;
  top: 0;
  left: 0;
}
.loading__logo-layer:nth-child(1) {
  width: 25.6vw;
  height: 2vw;
  mask-image: url(../data/webp/loading/top_mask.webp);
  mask-repeat: no-repeat;
  mask-position: top right;
  mask-size: 22.2666666667vw 2vw;
}
@media only screen and (min-width: 767px) {
  .loading__logo-layer:nth-child(1) {
    width: 13.3333333333vw;
    height: 1.0416666667vw;
    mask-size: 11.5972222222vw 1.0416666667vw;
  }
}
.loading__logo-layer:nth-child(1) .loading__logo-text {
  width: 25.6vw;
  height: 2vw;
  mask-image: url(../data/webp/loading/top.webp);
  mask-repeat: repeat-x;
  mask-size: 14.8vw 2vw;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
  background-size: 400% 100%;
}
@media only screen and (min-width: 767px) {
  .loading__logo-layer:nth-child(1) .loading__logo-text {
    width: 13.3333333333vw;
    height: 1.0416666667vw;
    mask-size: 7.7083333333vw 1.0416666667vw;
  }
}
.loading__logo-layer:nth-child(2) {
  width: 25.6vw;
  height: 25.6vw;
  mask-image: url(../data/webp/loading/right_mask.webp);
  mask-repeat: no-repeat;
  mask-position: bottom right;
  mask-size: 2vw 22.8vw;
  left: auto;
  right: 0;
}
@media only screen and (min-width: 767px) {
  .loading__logo-layer:nth-child(2) {
    width: 13.3333333333vw;
    height: 13.3333333333vw;
    mask-size: 1.0416666667vw 11.875vw;
  }
}
.loading__logo-layer:nth-child(2) .loading__logo-text {
  width: 25.6vw;
  height: 25.6vw;
  mask-image: url(../data/webp/loading/right.webp);
  mask-repeat: repeat-y;
  mask-size: contain;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
  background-size: 400% 100%;
}
@media only screen and (min-width: 767px) {
  .loading__logo-layer:nth-child(2) .loading__logo-text {
    width: 13.3333333333vw;
    height: 13.3333333333vw;
  }
}
.loading__logo-layer:nth-child(3) {
  width: 25.6vw;
  height: 2vw;
  mask-image: url(../data/webp/loading/top_mask.webp);
  mask-repeat: no-repeat;
  mask-position: left bottom;
  mask-size: 22.2666666667vw 2vw;
  top: auto;
  bottom: 0;
}
@media only screen and (min-width: 767px) {
  .loading__logo-layer:nth-child(3) {
    width: 13.3333333333vw;
    height: 1.0416666667vw;
    mask-size: 11.5972222222vw 1.0416666667vw;
  }
}
.loading__logo-layer:nth-child(3) .loading__logo-text {
  width: 25.6vw;
  height: 2vw;
  mask-image: url(../data/webp/loading/top.webp);
  mask-repeat: repeat-x;
  mask-size: 14.8vw 2vw;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
  background-size: 400% 100%;
}
@media only screen and (min-width: 767px) {
  .loading__logo-layer:nth-child(3) .loading__logo-text {
    width: 13.3333333333vw;
    height: 1.0416666667vw;
    mask-size: 7.7083333333vw 1.0416666667vw;
  }
}
.loading__logo-layer:nth-child(4) {
  width: 25.6vw;
  height: 25.6vw;
  mask-image: url(../data/webp/loading/left_mask.webp);
  mask-repeat: no-repeat;
  mask-position: top left;
  mask-size: 2vw 22.2666666667vw;
}
@media only screen and (min-width: 767px) {
  .loading__logo-layer:nth-child(4) {
    width: 13.3333333333vw;
    height: 13.3333333333vw;
    mask-size: 1.0416666667vw 11.5972222222vw;
  }
}
.loading__logo-layer:nth-child(4) .loading__logo-text {
  width: 25.6vw;
  height: 25.6vw;
  mask-image: url(../data/webp/loading/left.webp);
  mask-repeat: repeat-y;
  mask-size: contain;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
  background-size: 400% 100%;
}
@media only screen and (min-width: 767px) {
  .loading__logo-layer:nth-child(4) .loading__logo-text {
    width: 13.3333333333vw;
    height: 13.3333333333vw;
  }
}
.loading__logo-layer:nth-child(5) {
  width: 100%;
  height: 100%;
  mask-image: url(../data/webp/loading/base.webp);
  mask-repeat: no-repeat;
  mask-size: contain;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
  background-size: 400% 100%;
}

.top-kv {
  position: relative;
  z-index: 1;
  padding-top: 20.9333333333vw;
  padding-bottom: 20.9333333333vw;
}
@media only screen and (min-width: 767px) {
  .top-kv {
    padding-top: 6.25vw;
    padding-bottom: 6.5972222222vw;
  }
}
.top-kv__logo {
  position: absolute;
  width: 43.7333333333vw;
  height: 43.7333333333vw;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media only screen and (min-width: 767px) {
  .top-kv__logo {
    top: calc(50% - 2.7777777778vw);
    width: 46.5277777778vw;
    height: 22.7777777778vw;
  }
}
.top-kv__logo-glitch {
  position: relative;
  width: 43.7333333333vw;
  height: 43.7333333333vw;
  mask-image: url(../data/webp/top/kv/kv_logo.webp);
  mask-repeat: no-repeat;
  mask-size: contain;
  opacity: 0;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
@media only screen and (min-width: 767px) {
  .top-kv__logo-glitch {
    mask-image: url(../data/webp/top/kv/kv_logo_wide.webp);
    width: 46.5277777778vw;
    height: 22.7777777778vw;
  }
}
.top-kv__logo-glitch.js-show {
  opacity: 1;
}
.top-kv__slide {
  position: absolute;
  width: 100%;
  height: 21.4666666667vw;
  background: url(../data/webp/top/kv/slide_pattern.webp);
  background-repeat: repeat-x;
  background-size: 90.4vw 21.4666666667vw;
  bottom: 0;
}
@media only screen and (min-width: 767px) {
  .top-kv__slide {
    height: 11.1805555556vw;
    background-size: 47.0833333333vw 11.1805555556vw;
  }
}
.top-kv__slide.is-reverse {
  top: 0;
  bottom: auto;
  background: url(../data/webp/top/kv/slide_pattern_reverse.webp);
  background-size: 90.4vw 21.4666666667vw;
}
@media only screen and (min-width: 767px) {
  .top-kv__slide.is-reverse {
    top: max(-2.4305555556vw, -35px);
    background-size: 47.0833333333vw 11.1805555556vw;
  }
}
.top-kv__thunder {
  display: none;
  position: absolute;
  top: 15.3333333333vw;
  left: 50%;
  z-index: 10;
  width: 93.3333333333vw;
  height: 146.6666666667vw;
  pointer-events: none;
  background-repeat: no-repeat;
  background-position: center top;
  background-size: contain;
  transform: translateX(-50%);
}
@media only screen and (min-width: 767px) {
  .top-kv__thunder {
    top: 0;
    width: 100vw;
    height: 56.25vw;
    transform: translateX(-50%);
  }
}
.top-kv__thunder.js-play {
  display: block;
}
.top-kv__thunder.is-second.js-play {
  display: block;
}
.top-kv__tilt {
  position: relative;
  z-index: 1;
  transform-style: preserve-3d;
  transition: 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.top-kv__tilt.is-logo {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
}
.top-kv__list {
  position: relative;
  width: 89.3333333333vw;
  height: 133.3333333333vw;
  margin: 0 auto;
  z-index: 3;
}
@media only screen and (min-width: 767px) {
  .top-kv__list {
    width: 76.3888888889vw;
    height: 43.0555555556vw;
  }
}
.top-kv__item {
  position: absolute;
  top: 0;
  z-index: 1;
  width: 89.3333333333vw;
  margin: 0 auto;
  opacity: 0;
  transition: opacity 0.2s;
  filter: drop-shadow(0 1.6vw 0 rgba(0, 0, 0, 0.16));
  will-change: opacity;
}
@media only screen and (min-width: 767px) {
  .top-kv__item {
    width: 76.3888888889vw;
    border-radius: 0.5555555556vw;
    filter: drop-shadow(0 0.5555555556vw 0 rgba(0, 0, 0, 0.16));
  }
}
.top-kv__item.is-active {
  opacity: 1;
}
.top-kv__item.is-appeared .top-kv__img-container {
  opacity: 1;
  transition: opacity 0s;
}
.top-kv__item.is-disappeared .top-kv__img-container {
  opacity: 0 !important;
  transition: opacity 0s;
}
.top-kv__item.is-glitch .top-kv__glitch-item:nth-child(1) {
  -webkit-animation-name: glitch-anim-1;
  animation-name: glitch-anim-1;
}
.top-kv__item.is-glitch .top-kv__glitch-item:nth-child(2) {
  -webkit-animation-name: glitch-anim-2;
  animation-name: glitch-anim-2;
}
.top-kv__item.is-glitch .top-kv__glitch-item:nth-child(3) {
  -webkit-animation-name: glitch-anim-3;
  animation-name: glitch-anim-3;
}
.top-kv__item.is-glitch .top-kv__glitch-item:nth-child(4) {
  -webkit-animation-name: glitch-anim-flash;
  animation-name: glitch-anim-flash;
}
.top-kv__item.is-glitch .top-kv__glitch-item:nth-child(5) {
  -webkit-animation-name: glitch-anim-5;
  animation-name: glitch-anim-5;
}
.top-kv__item.is-glitch .top-kv__glitch-item:nth-child(6) {
  -webkit-animation-name: glitch-anim-6;
  animation-name: glitch-anim-6;
}
.top-kv__item:nth-child(1) .top-kv__glitch-item {
  background-image: url(../data/webp/top/kv/thumb_1.webp);
}
@media only screen and (min-width: 767px) {
  .top-kv__item:nth-child(1) .top-kv__glitch-item {
    background-image: url(../data/webp/top/kv/thumb_1_pc.webp);
  }
}
.top-kv__item:nth-child(2) .top-kv__glitch-item {
  background-image: url(../data/webp/top/kv/thumb_2.webp);
}
@media only screen and (min-width: 767px) {
  .top-kv__item:nth-child(2) .top-kv__glitch-item {
    background-image: url(../data/webp/top/kv/thumb_2_pc.webp);
  }
}
.top-kv__item:nth-child(3) .top-kv__glitch-item {
  background-image: url(../data/webp/top/kv/thumb_3.webp);
}
@media only screen and (min-width: 767px) {
  .top-kv__item:nth-child(3) .top-kv__glitch-item {
    background-image: url(../data/webp/top/kv/thumb_3_pc.webp);
  }
}
.top-kv__item:nth-child(4) .top-kv__glitch-item {
  background-image: url(../data/webp/top/kv/thumb_4.webp);
}
@media only screen and (min-width: 767px) {
  .top-kv__item:nth-child(4) .top-kv__glitch-item {
    background-image: url(../data/webp/top/kv/thumb_4_pc.webp);
  }
}
.top-kv__item:nth-child(5) .top-kv__glitch-item {
  background-image: url(../data/webp/top/kv/thumb_5.webp);
}
@media only screen and (min-width: 767px) {
  .top-kv__item:nth-child(5) .top-kv__glitch-item {
    background-image: url(../data/webp/top/kv/thumb_5_pc.webp);
  }
}
.top-kv__img-container {
  position: relative;
  width: 100%;
  height: auto;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  will-change: opacity;
  opacity: 0;
  transition: opacity 0.2s;
}
.top-kv__img-container img,
.top-kv__img-container source {
  display: block;
  width: 100%;
  height: auto;
}
.top-kv__glitch {
  --gap-horizontal: 1.3333333333vw;
  --gap-vertical: 2.6666666667vw;
  --time-anim: 1s;
  --delay-anim: 0s;
  --blend-mode-1: none;
  --blend-mode-2: none;
  --blend-mode-3: none;
  --blend-mode-4: none;
  --blend-mode-5: none;
  --blend-color-1: unset;
  --blend-color-2: unset;
  --blend-color-3: unset;
  --blend-color-4: unset;
  --blend-color-5: unset;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  filter: hue-rotate(90deg);
}
@media only screen and (min-width: 767px) {
  .top-kv__glitch {
    --gap-horizontal: 0.6944444444vw;
    --gap-vertical: 1.3888888889vw;
  }
}
.top-kv__glitch-item {
  position: absolute;
  top: calc(-1 * var(--gap-vertical));
  left: calc(-1 * var(--gap-horizontal));
  width: calc(100% + var(--gap-horizontal) * 2);
  height: calc(100% + var(--gap-vertical) * 2);
  background-color: var(--blend-color-1);
  background-repeat: no-repeat;
  background-position: 50% 0;
  background-size: cover;
  background-blend-mode: var(--blend-mode-1);
  opacity: 0;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-animation-duration: var(--time-anim);
  animation-duration: var(--time-anim);
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-delay: var(--delay-anim);
  animation-delay: var(--delay-anim);
  will-change: clip-path, transform, opacity;
}
.top-kv__glitch-item:nth-child(1) {
  background-color: var(--blend-color-2);
  background-blend-mode: var(--blend-mode-2);
}
.top-kv__glitch-item:nth-child(2) {
  background-color: var(--blend-color-3);
  background-blend-mode: var(--blend-mode-3);
}
.top-kv__glitch-item:nth-child(3) {
  background-color: var(--blend-color-4);
  background-blend-mode: var(--blend-mode-4);
}
.top-kv__glitch-item:nth-child(4) {
  background-color: var(--blend-color-5);
  background-blend-mode: var(--blend-mode-5);
}

@-webkit-keyframes glitch-anim-1 {
  0% {
    -webkit-clip-path: polygon(0 2%, 100% 2%, 100% 5%, 0 5%);
    clip-path: polygon(0 2%, 100% 2%, 100% 5%, 0 5%);
    opacity: 1;
    -webkit-transform: translate3d(var(--gap-horizontal), 0, 0);
    transform: translate3d(var(--gap-horizontal), 0, 0);
  }
  2% {
    -webkit-clip-path: polygon(0 15%, 100% 15%, 100% 15%, 0 15%);
    clip-path: polygon(0 15%, 100% 15%, 100% 15%, 0 15%);
  }
  4% {
    -webkit-clip-path: polygon(0 10%, 100% 10%, 100% 20%, 0 20%);
    clip-path: polygon(0 10%, 100% 10%, 100% 20%, 0 20%);
  }
  6% {
    -webkit-clip-path: polygon(0 1%, 100% 1%, 100% 2%, 0 2%);
    clip-path: polygon(0 1%, 100% 1%, 100% 2%, 0 2%);
  }
  8% {
    -webkit-clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%);
    clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%);
  }
  10% {
    -webkit-clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%);
    clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%);
  }
  12% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%);
    clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%);
  }
  14% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
    clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
  }
  16% {
    -webkit-clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
    clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
  }
  18% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
    clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
  }
  20% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%);
    clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%);
  }
  21.9% {
    opacity: 1;
    -webkit-transform: translate3d(var(--gap-horizontal), 0, 0);
    transform: translate3d(var(--gap-horizontal), 0, 0);
  }
  22%, 100% {
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes glitch-anim-1 {
  0% {
    -webkit-clip-path: polygon(0 2%, 100% 2%, 100% 5%, 0 5%);
    clip-path: polygon(0 2%, 100% 2%, 100% 5%, 0 5%);
    opacity: 1;
    -webkit-transform: translate3d(var(--gap-horizontal), 0, 0);
    transform: translate3d(var(--gap-horizontal), 0, 0);
  }
  2% {
    -webkit-clip-path: polygon(0 15%, 100% 15%, 100% 15%, 0 15%);
    clip-path: polygon(0 15%, 100% 15%, 100% 15%, 0 15%);
  }
  4% {
    -webkit-clip-path: polygon(0 10%, 100% 10%, 100% 20%, 0 20%);
    clip-path: polygon(0 10%, 100% 10%, 100% 20%, 0 20%);
  }
  6% {
    -webkit-clip-path: polygon(0 1%, 100% 1%, 100% 2%, 0 2%);
    clip-path: polygon(0 1%, 100% 1%, 100% 2%, 0 2%);
  }
  8% {
    -webkit-clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%);
    clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%);
  }
  10% {
    -webkit-clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%);
    clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%);
  }
  12% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%);
    clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%);
  }
  14% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
    clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
  }
  16% {
    -webkit-clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
    clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
  }
  18% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
    clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
  }
  20% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%);
    clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%);
  }
  21.9% {
    opacity: 1;
    -webkit-transform: translate3d(var(--gap-horizontal), 0, 0);
    transform: translate3d(var(--gap-horizontal), 0, 0);
  }
  22%, 100% {
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@-webkit-keyframes glitch-anim-2 {
  0% {
    -webkit-clip-path: polygon(0 25%, 100% 25%, 100% 30%, 0 30%);
    clip-path: polygon(0 25%, 100% 25%, 100% 30%, 0 30%);
    opacity: 1;
    -webkit-transform: translate3d(calc(-1 * var(--gap-horizontal)), 0, 0);
    transform: translate3d(calc(-1 * var(--gap-horizontal)), 0, 0);
  }
  3% {
    -webkit-clip-path: polygon(0 3%, 100% 3%, 100% 3%, 0 3%);
    clip-path: polygon(0 3%, 100% 3%, 100% 3%, 0 3%);
  }
  5% {
    -webkit-clip-path: polygon(0 5%, 100% 5%, 100% 20%, 0 20%);
    clip-path: polygon(0 5%, 100% 5%, 100% 20%, 0 20%);
  }
  7% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
    clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
  }
  9% {
    -webkit-clip-path: polygon(0 40%, 100% 40%, 100% 40%, 0 40%);
    clip-path: polygon(0 40%, 100% 40%, 100% 40%, 0 40%);
  }
  11% {
    -webkit-clip-path: polygon(0 52%, 100% 52%, 100% 59%, 0 59%);
    clip-path: polygon(0 52%, 100% 52%, 100% 59%, 0 59%);
  }
  13% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
    clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
  }
  15% {
    -webkit-clip-path: polygon(0 75%, 100% 75%, 100% 75%, 0 75%);
    clip-path: polygon(0 75%, 100% 75%, 100% 75%, 0 75%);
  }
  17% {
    -webkit-clip-path: polygon(0 65%, 100% 65%, 100% 40%, 0 40%);
    clip-path: polygon(0 65%, 100% 65%, 100% 40%, 0 40%);
  }
  19% {
    -webkit-clip-path: polygon(0 45%, 100% 45%, 100% 50%, 0 50%);
    clip-path: polygon(0 45%, 100% 45%, 100% 50%, 0 50%);
  }
  20% {
    -webkit-clip-path: polygon(0 14%, 100% 14%, 100% 33%, 0 33%);
    clip-path: polygon(0 14%, 100% 14%, 100% 33%, 0 33%);
  }
  21.9% {
    opacity: 1;
    -webkit-transform: translate3d(calc(-1 * var(--gap-horizontal)), 0, 0);
    transform: translate3d(calc(-1 * var(--gap-horizontal)), 0, 0);
  }
  22%, 100% {
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes glitch-anim-2 {
  0% {
    -webkit-clip-path: polygon(0 25%, 100% 25%, 100% 30%, 0 30%);
    clip-path: polygon(0 25%, 100% 25%, 100% 30%, 0 30%);
    opacity: 1;
    -webkit-transform: translate3d(calc(-1 * var(--gap-horizontal)), 0, 0);
    transform: translate3d(calc(-1 * var(--gap-horizontal)), 0, 0);
  }
  3% {
    -webkit-clip-path: polygon(0 3%, 100% 3%, 100% 3%, 0 3%);
    clip-path: polygon(0 3%, 100% 3%, 100% 3%, 0 3%);
  }
  5% {
    -webkit-clip-path: polygon(0 5%, 100% 5%, 100% 20%, 0 20%);
    clip-path: polygon(0 5%, 100% 5%, 100% 20%, 0 20%);
  }
  7% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
    clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
  }
  9% {
    -webkit-clip-path: polygon(0 40%, 100% 40%, 100% 40%, 0 40%);
    clip-path: polygon(0 40%, 100% 40%, 100% 40%, 0 40%);
  }
  11% {
    -webkit-clip-path: polygon(0 52%, 100% 52%, 100% 59%, 0 59%);
    clip-path: polygon(0 52%, 100% 52%, 100% 59%, 0 59%);
  }
  13% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
    clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
  }
  15% {
    -webkit-clip-path: polygon(0 75%, 100% 75%, 100% 75%, 0 75%);
    clip-path: polygon(0 75%, 100% 75%, 100% 75%, 0 75%);
  }
  17% {
    -webkit-clip-path: polygon(0 65%, 100% 65%, 100% 40%, 0 40%);
    clip-path: polygon(0 65%, 100% 65%, 100% 40%, 0 40%);
  }
  19% {
    -webkit-clip-path: polygon(0 45%, 100% 45%, 100% 50%, 0 50%);
    clip-path: polygon(0 45%, 100% 45%, 100% 50%, 0 50%);
  }
  20% {
    -webkit-clip-path: polygon(0 14%, 100% 14%, 100% 33%, 0 33%);
    clip-path: polygon(0 14%, 100% 14%, 100% 33%, 0 33%);
  }
  21.9% {
    opacity: 1;
    -webkit-transform: translate3d(calc(-1 * var(--gap-horizontal)), 0, 0);
    transform: translate3d(calc(-1 * var(--gap-horizontal)), 0, 0);
  }
  22%, 100% {
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@-webkit-keyframes glitch-anim-3 {
  0% {
    -webkit-clip-path: polygon(0 1%, 100% 1%, 100% 3%, 0 3%);
    clip-path: polygon(0 1%, 100% 1%, 100% 3%, 0 3%);
    opacity: 1;
    -webkit-transform: translate3d(0, calc(-1 * var(--gap-vertical)), 0) scale3d(-1, -1, 1);
    transform: translate3d(0, calc(-1 * var(--gap-vertical)), 0) scale3d(-1, -1, 1);
  }
  1.5% {
    -webkit-clip-path: polygon(0 10%, 100% 10%, 100% 9%, 0 9%);
    clip-path: polygon(0 10%, 100% 10%, 100% 9%, 0 9%);
  }
  2% {
    -webkit-clip-path: polygon(0 5%, 100% 5%, 100% 6%, 0 6%);
    clip-path: polygon(0 5%, 100% 5%, 100% 6%, 0 6%);
  }
  2.5% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
    clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
  }
  3% {
    -webkit-clip-path: polygon(0 10%, 100% 10%, 100% 10%, 0 10%);
    clip-path: polygon(0 10%, 100% 10%, 100% 10%, 0 10%);
  }
  5% {
    -webkit-clip-path: polygon(0 30%, 100% 30%, 100% 25%, 0 25%);
    clip-path: polygon(0 30%, 100% 30%, 100% 25%, 0 25%);
  }
  5.5% {
    -webkit-clip-path: polygon(0 15%, 100% 15%, 100% 16%, 0 16%);
    clip-path: polygon(0 15%, 100% 15%, 100% 16%, 0 16%);
  }
  7% {
    -webkit-clip-path: polygon(0 40%, 100% 40%, 100% 39%, 0 39%);
    clip-path: polygon(0 40%, 100% 40%, 100% 39%, 0 39%);
  }
  8% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%);
    clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%);
  }
  9% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 55%, 0 55%);
    clip-path: polygon(0 60%, 100% 60%, 100% 55%, 0 55%);
  }
  10.5% {
    -webkit-clip-path: polygon(0 30%, 100% 30%, 100% 31%, 0 31%);
    clip-path: polygon(0 30%, 100% 30%, 100% 31%, 0 31%);
  }
  11% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 69%, 0 69%);
    clip-path: polygon(0 70%, 100% 70%, 100% 69%, 0 69%);
  }
  13% {
    -webkit-clip-path: polygon(0 40%, 100% 40%, 100% 41%, 0 41%);
    clip-path: polygon(0 40%, 100% 40%, 100% 41%, 0 41%);
  }
  14% {
    -webkit-clip-path: polygon(0 80%, 100% 80%, 100% 75%, 0 75%);
    clip-path: polygon(0 80%, 100% 80%, 100% 75%, 0 75%);
  }
  14.5% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 51%, 0 51%);
    clip-path: polygon(0 50%, 100% 50%, 100% 51%, 0 51%);
  }
  15% {
    -webkit-clip-path: polygon(0 90%, 100% 90%, 100% 90%, 0 90%);
    clip-path: polygon(0 90%, 100% 90%, 100% 90%, 0 90%);
  }
  16% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
    clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
  }
  18% {
    -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 99%, 0 99%);
    clip-path: polygon(0 100%, 100% 100%, 100% 99%, 0 99%);
  }
  20% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 71%, 0 71%);
    clip-path: polygon(0 70%, 100% 70%, 100% 71%, 0 71%);
  }
  21.9% {
    opacity: 1;
    -webkit-transform: translate3d(0, calc(-1 * var(--gap-vertical)), 0) scale3d(-1, -1, 1);
    transform: translate3d(0, calc(-1 * var(--gap-vertical)), 0) scale3d(-1, -1, 1);
  }
  22%, 100% {
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes glitch-anim-3 {
  0% {
    -webkit-clip-path: polygon(0 1%, 100% 1%, 100% 3%, 0 3%);
    clip-path: polygon(0 1%, 100% 1%, 100% 3%, 0 3%);
    opacity: 1;
    -webkit-transform: translate3d(0, calc(-1 * var(--gap-vertical)), 0) scale3d(-1, -1, 1);
    transform: translate3d(0, calc(-1 * var(--gap-vertical)), 0) scale3d(-1, -1, 1);
  }
  1.5% {
    -webkit-clip-path: polygon(0 10%, 100% 10%, 100% 9%, 0 9%);
    clip-path: polygon(0 10%, 100% 10%, 100% 9%, 0 9%);
  }
  2% {
    -webkit-clip-path: polygon(0 5%, 100% 5%, 100% 6%, 0 6%);
    clip-path: polygon(0 5%, 100% 5%, 100% 6%, 0 6%);
  }
  2.5% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
    clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
  }
  3% {
    -webkit-clip-path: polygon(0 10%, 100% 10%, 100% 10%, 0 10%);
    clip-path: polygon(0 10%, 100% 10%, 100% 10%, 0 10%);
  }
  5% {
    -webkit-clip-path: polygon(0 30%, 100% 30%, 100% 25%, 0 25%);
    clip-path: polygon(0 30%, 100% 30%, 100% 25%, 0 25%);
  }
  5.5% {
    -webkit-clip-path: polygon(0 15%, 100% 15%, 100% 16%, 0 16%);
    clip-path: polygon(0 15%, 100% 15%, 100% 16%, 0 16%);
  }
  7% {
    -webkit-clip-path: polygon(0 40%, 100% 40%, 100% 39%, 0 39%);
    clip-path: polygon(0 40%, 100% 40%, 100% 39%, 0 39%);
  }
  8% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%);
    clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%);
  }
  9% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 55%, 0 55%);
    clip-path: polygon(0 60%, 100% 60%, 100% 55%, 0 55%);
  }
  10.5% {
    -webkit-clip-path: polygon(0 30%, 100% 30%, 100% 31%, 0 31%);
    clip-path: polygon(0 30%, 100% 30%, 100% 31%, 0 31%);
  }
  11% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 69%, 0 69%);
    clip-path: polygon(0 70%, 100% 70%, 100% 69%, 0 69%);
  }
  13% {
    -webkit-clip-path: polygon(0 40%, 100% 40%, 100% 41%, 0 41%);
    clip-path: polygon(0 40%, 100% 40%, 100% 41%, 0 41%);
  }
  14% {
    -webkit-clip-path: polygon(0 80%, 100% 80%, 100% 75%, 0 75%);
    clip-path: polygon(0 80%, 100% 80%, 100% 75%, 0 75%);
  }
  14.5% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 51%, 0 51%);
    clip-path: polygon(0 50%, 100% 50%, 100% 51%, 0 51%);
  }
  15% {
    -webkit-clip-path: polygon(0 90%, 100% 90%, 100% 90%, 0 90%);
    clip-path: polygon(0 90%, 100% 90%, 100% 90%, 0 90%);
  }
  16% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
    clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
  }
  18% {
    -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 99%, 0 99%);
    clip-path: polygon(0 100%, 100% 100%, 100% 99%, 0 99%);
  }
  20% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 71%, 0 71%);
    clip-path: polygon(0 70%, 100% 70%, 100% 71%, 0 71%);
  }
  21.9% {
    opacity: 1;
    -webkit-transform: translate3d(0, calc(-1 * var(--gap-vertical)), 0) scale3d(-1, -1, 1);
    transform: translate3d(0, calc(-1 * var(--gap-vertical)), 0) scale3d(-1, -1, 1);
  }
  22%, 100% {
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@-webkit-keyframes glitch-anim-flash {
  0%, 5% {
    opacity: 0.2;
    -webkit-transform: translate3d(var(--gap-horizontal), var(--gap-vertical), 0);
    transform: translate3d(var(--gap-horizontal), var(--gap-vertical), 0);
  }
  5.5%, 100% {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes glitch-anim-flash {
  0%, 5% {
    opacity: 0.2;
    -webkit-transform: translate3d(var(--gap-horizontal), var(--gap-vertical), 0);
    transform: translate3d(var(--gap-horizontal), var(--gap-vertical), 0);
  }
  5.5%, 100% {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@-webkit-keyframes glitch-anim-5 {
  0% {
    -webkit-clip-path: polygon(0 5%, 100% 5%, 100% 6.5%, 0 6.5%);
    clip-path: polygon(0 5%, 100% 5%, 100% 6.5%, 0 6.5%);
    opacity: 1;
    -webkit-transform: translate3d(calc(var(--gap-horizontal) * -1), 0, 0);
    transform: translate3d(calc(var(--gap-horizontal) * -1), 0, 0);
  }
  63% {
    -webkit-clip-path: polygon(0 25%, 100% 25%, 100% 26.5%, 0 26.5%);
    clip-path: polygon(0 25%, 100% 25%, 100% 26.5%, 0 26.5%);
  }
  66% {
    -webkit-clip-path: polygon(0 35%, 100% 35%, 100% 36.5%, 0 36.5%);
    clip-path: polygon(0 35%, 100% 35%, 100% 36.5%, 0 36.5%);
  }
  69% {
    -webkit-clip-path: polygon(0 55%, 100% 55%, 100% 56.5%, 0 56.5%);
    clip-path: polygon(0 55%, 100% 55%, 100% 56.5%, 0 56.5%);
  }
  72% {
    -webkit-clip-path: polygon(0 75%, 100% 75%, 100% 76.5%, 0 76.5%);
    clip-path: polygon(0 75%, 100% 75%, 100% 76.5%, 0 76.5%);
  }
  75% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 21.5%, 0 21.5%);
    clip-path: polygon(0 20%, 100% 20%, 100% 21.5%, 0 21.5%);
  }
  78% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 61.5%, 0 61.5%);
    clip-path: polygon(0 60%, 100% 60%, 100% 61.5%, 0 61.5%);
  }
  81.9% {
    opacity: 1;
    -webkit-transform: translate3d(calc(var(--gap-horizontal) * -1), 0, 0);
    transform: translate3d(calc(var(--gap-horizontal) * -1), 0, 0);
  }
  82%, 100% {
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes glitch-anim-5 {
  0% {
    -webkit-clip-path: polygon(0 5%, 100% 5%, 100% 6.5%, 0 6.5%);
    clip-path: polygon(0 5%, 100% 5%, 100% 6.5%, 0 6.5%);
    opacity: 1;
    -webkit-transform: translate3d(calc(var(--gap-horizontal) * -1), 0, 0);
    transform: translate3d(calc(var(--gap-horizontal) * -1), 0, 0);
  }
  43% {
    -webkit-clip-path: polygon(0 25%, 100% 25%, 100% 26.5%, 0 26.5%);
    clip-path: polygon(0 25%, 100% 25%, 100% 26.5%, 0 26.5%);
  }
  46% {
    -webkit-clip-path: polygon(0 35%, 100% 35%, 100% 36.5%, 0 36.5%);
    clip-path: polygon(0 35%, 100% 35%, 100% 36.5%, 0 36.5%);
  }
  49% {
    -webkit-clip-path: polygon(0 55%, 100% 55%, 100% 56.5%, 0 56.5%);
    clip-path: polygon(0 55%, 100% 55%, 100% 56.5%, 0 56.5%);
  }
  52% {
    -webkit-clip-path: polygon(0 75%, 100% 75%, 100% 76.5%, 0 76.5%);
    clip-path: polygon(0 75%, 100% 75%, 100% 76.5%, 0 76.5%);
  }
  55% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 21.5%, 0 21.5%);
    clip-path: polygon(0 20%, 100% 20%, 100% 21.5%, 0 21.5%);
  }
  58% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 61.5%, 0 61.5%);
    clip-path: polygon(0 60%, 100% 60%, 100% 61.5%, 0 61.5%);
  }
  61.9% {
    opacity: 1;
    -webkit-transform: translate3d(calc(var(--gap-horizontal) * -1), 0, 0);
    transform: translate3d(calc(var(--gap-horizontal) * -1), 0, 0);
  }
  62%, 100% {
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@-webkit-keyframes glitch-anim-6 {
  0% {
    -webkit-clip-path: polygon(0 8%, 100% 8%, 100% 9.5%, 0 9.5%);
    clip-path: polygon(0 8%, 100% 8%, 100% 9.5%, 0 9.5%);
    opacity: 1;
    -webkit-transform: translate3d(var(--gap-horizontal), calc(var(--gap-vertical) * -1), 0);
    transform: translate3d(var(--gap-horizontal), calc(var(--gap-vertical) * -1), 0);
  }
  2.5% {
    -webkit-clip-path: polygon(0 30%, 100% 30%, 100% 31.5%, 0 31.5%);
    clip-path: polygon(0 30%, 100% 30%, 100% 31.5%, 0 31.5%);
  }
  5% {
    -webkit-clip-path: polygon(0 45%, 100% 45%, 100% 46.5%, 0 46.5%);
    clip-path: polygon(0 45%, 100% 45%, 100% 46.5%, 0 46.5%);
  }
  7.5% {
    -webkit-clip-path: polygon(0 65%, 100% 65%, 100% 66.5%, 0 66.5%);
    clip-path: polygon(0 65%, 100% 65%, 100% 66.5%, 0 66.5%);
  }
  10% {
    -webkit-clip-path: polygon(0 18%, 100% 18%, 100% 19.5%, 0 19.5%);
    clip-path: polygon(0 18%, 100% 18%, 100% 19.5%, 0 19.5%);
  }
  12.5% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 51.5%, 0 51.5%);
    clip-path: polygon(0 50%, 100% 50%, 100% 51.5%, 0 51.5%);
  }
  15% {
    -webkit-clip-path: polygon(0 72%, 100% 72%, 100% 73.5%, 0 73.5%);
    clip-path: polygon(0 72%, 100% 72%, 100% 73.5%, 0 73.5%);
  }
  17.5% {
    -webkit-clip-path: polygon(0 42%, 100% 42%, 100% 43.5%, 0 43.5%);
    clip-path: polygon(0 42%, 100% 42%, 100% 43.5%, 0 43.5%);
  }
  21.9% {
    opacity: 1;
    -webkit-transform: translate3d(var(--gap-horizontal), calc(var(--gap-vertical) * -1), 0);
    transform: translate3d(var(--gap-horizontal), calc(var(--gap-vertical) * -1), 0);
  }
  22%, 100% {
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes glitch-anim-6 {
  0% {
    -webkit-clip-path: polygon(0 8%, 100% 8%, 100% 9.5%, 0 9.5%);
    clip-path: polygon(0 8%, 100% 8%, 100% 9.5%, 0 9.5%);
    opacity: 1;
    -webkit-transform: translate3d(var(--gap-horizontal), calc(var(--gap-vertical) * -1), 0);
    transform: translate3d(var(--gap-horizontal), calc(var(--gap-vertical) * -1), 0);
  }
  2.5% {
    -webkit-clip-path: polygon(0 30%, 100% 30%, 100% 31.5%, 0 31.5%);
    clip-path: polygon(0 30%, 100% 30%, 100% 31.5%, 0 31.5%);
  }
  5% {
    -webkit-clip-path: polygon(0 45%, 100% 45%, 100% 46.5%, 0 46.5%);
    clip-path: polygon(0 45%, 100% 45%, 100% 46.5%, 0 46.5%);
  }
  7.5% {
    -webkit-clip-path: polygon(0 65%, 100% 65%, 100% 66.5%, 0 66.5%);
    clip-path: polygon(0 65%, 100% 65%, 100% 66.5%, 0 66.5%);
  }
  10% {
    -webkit-clip-path: polygon(0 18%, 100% 18%, 100% 19.5%, 0 19.5%);
    clip-path: polygon(0 18%, 100% 18%, 100% 19.5%, 0 19.5%);
  }
  12.5% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 51.5%, 0 51.5%);
    clip-path: polygon(0 50%, 100% 50%, 100% 51.5%, 0 51.5%);
  }
  15% {
    -webkit-clip-path: polygon(0 72%, 100% 72%, 100% 73.5%, 0 73.5%);
    clip-path: polygon(0 72%, 100% 72%, 100% 73.5%, 0 73.5%);
  }
  17.5% {
    -webkit-clip-path: polygon(0 42%, 100% 42%, 100% 43.5%, 0 43.5%);
    clip-path: polygon(0 42%, 100% 42%, 100% 43.5%, 0 43.5%);
  }
  21.9% {
    opacity: 1;
    -webkit-transform: translate3d(var(--gap-horizontal), calc(var(--gap-vertical) * -1), 0);
    transform: translate3d(var(--gap-horizontal), calc(var(--gap-vertical) * -1), 0);
  }
  22%, 100% {
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.top-about {
  position: relative;
  z-index: 1;
  margin-top: 40vw;
}
@media only screen and (min-width: 767px) {
  .top-about {
    margin-top: min(13.8888888889vw, 200px);
    padding-bottom: min(6.9444444444vw, 100px);
  }
}
@media only screen and (min-width: 1440px) {
  .top-about {
    margin-top: min(200px + (100vw - 1440px) * 0.0357142857, 240px);
    padding-bottom: min(100px + (100vw - 1440px) * 0.0178571429, 120px);
  }
}
.top-about__stone {
  z-index: 2;
  position: absolute;
  top: -45.3333333333vw;
  left: 50%;
  width: 97.3333333333vw;
  height: 272.6666666667vw;
  transform: translateX(-50%);
  pointer-events: none;
}
@media only screen and (min-width: 767px) {
  .top-about__stone {
    width: min(98.6111111111vw, 1420px);
    height: min(75.3472222222vw, 1085px);
    top: min(-8.8888888889vw, -128px);
  }
}
@media only screen and (min-width: 1440px) {
  .top-about__stone {
    width: min(1420px + (100vw - 1440px) * 0.2535714286, 1704px);
    height: min(1085px + (100vw - 1440px) * 0.19375, 1302px);
    top: min(-128px + (100vw - 1440px) * -0.0228571429, -153.6px);
  }
}
.top-about__wrapper {
  width: 100%;
  position: relative;
}
@media only screen and (min-width: 767px) {
  .top-about__wrapper {
    max-width: 1440px;
    margin-inline: auto;
  }
}
@media only screen and (min-width: 1440px) {
  .top-about__wrapper {
    max-width: min(1440px + (100vw - 1440px) * 0.2571428571, 1728px);
  }
}
.top-about__inner {
  margin-top: 14.6666666667vw;
}
.top-about__inner-text {
  font-size: 8.4vw;
  font-weight: 900;
  transform-origin: right;
  padding: 0 3.3333333333vw;
  text-wrap: nowrap;
}
.top-about__inner-text[data-line="2"] {
  margin-top: 0.2666666667vw;
}
.top-about__inner-text[data-line="3"] {
  margin-top: -0.9333333333vw;
  padding-left: 2.9333333333vw;
}
.top-about__inner-text[data-line="4"] {
  letter-spacing: -0.02em;
  margin-top: -2.1333333333vw;
  padding-left: 2.4vw;
}
@media only screen and (min-width: 767px) {
  .top-about__content {
    position: relative;
    width: min(60.3472222222vw, 869px);
    height: min(31.5277777778vw, 454px);
    margin-top: min(2.8472222222vw, 41px);
    margin-left: min(32.7777777778vw, 472px);
    margin-bottom: min(4.1666666667vw, 60px);
  }
}
@media only screen and (min-width: 1440px) {
  .top-about__content {
    width: min(869px + (100vw - 1440px) * 0.1551785714, 1042.8px);
    height: min(454px + (100vw - 1440px) * 0.0810714286, 544.8px);
    margin-top: min(41px + (100vw - 1440px) * 0.0073214286, 49.2px);
    margin-left: min(472px + (100vw - 1440px) * 0.0842857143, 566.4px);
    margin-bottom: min(60px + (100vw - 1440px) * 0.0107142857, 72px);
  }
}
.top-about__content-layer {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.top-about__main {
  position: relative;
  width: 97.3333333333vw;
  height: 32.6666666667vw;
  margin-top: -2.2666666667vw;
}
@media only screen and (min-width: 767px) {
  .top-about__main {
    position: absolute;
    width: min(41.3194444444vw, 595px);
    height: min(14.9305555556vw, 215px);
    top: min(4.375vw, 63px);
    right: 0;
    margin: 0;
  }
}
@media only screen and (min-width: 1440px) {
  .top-about__main {
    width: min(595px + (100vw - 1440px) * 0.10625, 714px);
    height: min(215px + (100vw - 1440px) * 0.0383928571, 258px);
    top: min(63px + (100vw - 1440px) * 0.01125, 75.6px);
  }
}
.top-about__main-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.top-about__main-wrapper:nth-child(1) .top-about__main-layer {
  mask-image: url(../data/webp/lang/ja/top/about/main_text_1.webp);
  mask-repeat: no-repeat;
  mask-size: contain;
}
@media only screen and (min-width: 767px) {
  .top-about__main-wrapper:nth-child(1) .top-about__main-layer {
    mask-image: url(../data/webp/lang/ja/top/about/main_text_1_pc.webp);
  }
}
.top-about__main-wrapper:nth-child(2) .top-about__main-layer {
  mask-image: url(../data/webp/lang/ja/top/about/main_text_2.webp);
  mask-repeat: no-repeat;
  mask-size: contain;
}
@media only screen and (min-width: 767px) {
  .top-about__main-wrapper:nth-child(2) .top-about__main-layer {
    mask-image: url(../data/webp/lang/ja/top/about/main_text_2_pc.webp);
  }
}
.top-about__main-wrapper:nth-child(3) .top-about__main-layer {
  mask-image: url(../data/webp/lang/ja/top/about/main_text_3.webp);
  mask-repeat: no-repeat;
  mask-size: contain;
}
@media only screen and (min-width: 767px) {
  .top-about__main-wrapper:nth-child(3) .top-about__main-layer {
    mask-image: url(../data/webp/lang/ja/top/about/main_text_3_pc.webp);
  }
}
.top-about__main-wrapper:nth-child(4) .top-about__main-layer {
  mask-image: url(../data/webp/lang/ja/top/about/main_text_4.webp);
  mask-repeat: no-repeat;
  mask-size: contain;
}
@media only screen and (min-width: 767px) {
  .top-about__main-wrapper:nth-child(4) .top-about__main-layer {
    mask-image: url(../data/webp/lang/ja/top/about/main_text_4_pc.webp);
  }
}
.top-about__main-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
.top-about__chara {
  margin-top: -8vw;
  position: relative;
  z-index: 1;
  margin-bottom: 8vw;
}
@media only screen and (min-width: 767px) {
  .top-about__chara {
    position: absolute;
    width: min(43.0555555556vw, 620px);
    top: min(7.2222222222vw, 104px);
    left: min(-0.6944444444vw, -10px);
    margin: 0;
  }
}
@media only screen and (min-width: 1440px) {
  .top-about__chara {
    width: min(620px + (100vw - 1440px) * 0.1107142857, 744px);
    top: min(104px + (100vw - 1440px) * 0.0185714286, 124.8px);
    left: min(-10px + (100vw - 1440px) * -0.0017857143, -12px);
  }
}

.top-goods {
  position: relative;
  z-index: 1;
  margin-top: 40vw;
}
@media only screen and (min-width: 767px) {
  .top-goods {
    margin-top: min(13.8888888889vw, 200px);
  }
}
@media only screen and (min-width: 1440px) {
  .top-goods {
    margin-top: min(200px + (100vw - 1440px) * 0.0357142857, 240px);
  }
}
.top-goods__stone {
  position: absolute;
  z-index: 2;
  top: -18vw;
  left: 50%;
  width: 97.3333333333vw;
  height: 272.6666666667vw;
  transform: translateX(-50%);
  pointer-events: none;
}
@media only screen and (min-width: 767px) {
  .top-goods__stone {
    width: min(98.6111111111vw, 1420px);
    height: min(11.1111111111vw, 160px);
    top: min(-20.6944444444vw, -298px);
  }
}
@media only screen and (min-width: 1440px) {
  .top-goods__stone {
    width: min(1420px + (100vw - 1440px) * 0.2535714286, 1704px);
    height: min(160px + (100vw - 1440px) * 0.0285714286, 192px);
    top: min(-298px + (100vw - 1440px) * -0.0532142857, -357.6px);
  }
}
.top-goods__inner {
  width: 97.3333333333vw;
  overflow: hidden;
}
@media only screen and (min-width: 767px) {
  .top-goods__inner {
    width: min(98.6111111111vw, 1420px);
    margin-inline: auto;
    margin-top: min(1.0416666667vw, 15px);
  }
}
@media only screen and (min-width: 1440px) {
  .top-goods__inner {
    width: min(1420px + (100vw - 1440px) * 0.2535714286, 1704px);
    margin-top: min(15px + (100vw - 1440px) * 0.0026785714, 18px);
  }
}
.top-goods__base {
  width: 116vw;
  position: relative;
  left: -3.7333333333vw;
}
@media only screen and (min-width: 767px) {
  .top-goods__base {
    width: min(98.6111111111vw, 1420px);
    left: 0;
  }
}
@media only screen and (min-width: 1440px) {
  .top-goods__base {
    width: min(1420px + (100vw - 1440px) * 0.2535714286, 1704px);
  }
}
.top-goods__back {
  z-index: 1;
  pointer-events: none;
}
.top-goods__front {
  z-index: 2;
  pointer-events: none;
}
.top-goods__layer {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.top-recruit {
  position: relative;
  z-index: 1;
  margin-top: 40vw;
}
@media only screen and (min-width: 767px) {
  .top-recruit {
    margin-top: min(12.5vw, 180px);
  }
}
@media only screen and (min-width: 1440px) {
  .top-recruit {
    margin-top: min(180px + (100vw - 1440px) * 0.0321428571, 216px);
  }
}
.top-recruit:before {
  display: block;
  content: "";
  display: none;
}
@media only screen and (min-width: 767px) {
  .top-recruit:before {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: min(39.1666666667vw, 564px);
    left: 0;
    background-color: black;
    z-index: 0;
  }
}
@media only screen and (min-width: 1440px) {
  .top-recruit:before {
    top: min(564px + (100vw - 1440px) * 0.1007142857, 676.8px);
  }
}
@media only screen and (min-width: 767px) {
  .top-recruit .common__ttl {
    margin-right: min(6.25vw, 90px);
  }
}
@media only screen and (min-width: 1440px) {
  .top-recruit .common__ttl {
    margin-right: min(90px + (100vw - 1440px) * 0.0160714286, 108px);
  }
}
.top-recruit__stone {
  position: absolute;
  top: -19.3333333333vw;
  left: 50%;
  width: 97.3333333333vw;
  height: 272.6666666667vw;
  transform: translateX(-50%);
  z-index: 5;
  pointer-events: none;
}
@media only screen and (min-width: 767px) {
  .top-recruit__stone {
    width: min(98.6111111111vw, 1420px);
    height: min(40.2083333333vw, 579px);
    top: max(-25vw, -360px);
  }
}
@media only screen and (min-width: 1440px) {
  .top-recruit__stone {
    width: min(1420px + (100vw - 1440px) * 0.2535714286, 1704px);
    height: min(830px + (100vw - 1440px) * 0.1482142857, 996px);
    top: max(-360px + (100vw - 1440px) * -0.0642857143, -432px);
  }
}
.top-recruit__inner {
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 767px) {
  .top-recruit__inner {
    width: 100%;
    max-width: min(100vw, 1440px);
    margin-inline: auto;
  }
}
@media only screen and (min-width: 1440px) {
  .top-recruit__inner {
    max-width: min(1440px + (100vw - 1440px) * 0.2571428571, 1728px);
  }
}
.top-recruit__bg {
  position: relative;
  padding-bottom: 17.8666666667vw;
  margin-top: 2.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .top-recruit__bg {
    width: min(77.4305555556vw, 1115px);
    margin-top: max(-18.9583333333vw, -273px);
    left: max(-1.9444444444vw, -28px);
    padding-bottom: min(2.9861111111vw, 43px);
  }
}
@media only screen and (min-width: 1440px) {
  .top-recruit__bg {
    width: min(1115px + (100vw - 1440px) * 0.1991071429, 1338px);
    margin-top: max(-273px + (100vw - 1440px) * -0.04875, -327.6px);
    left: max(-28px + (100vw - 1440px) * -0.005, -33.6px);
    padding-bottom: min(43px + (100vw - 1440px) * 0.0076785714, 51.6px);
  }
}
.top-recruit__bg:before {
  display: block;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 95.0666666667vw;
  left: 0;
  background-color: black;
  z-index: 0;
}
@media only screen and (min-width: 767px) {
  .top-recruit__bg:before {
    display: none;
  }
}
.top-recruit__bg img {
  position: relative;
  z-index: 1;
}
.top-recruit__content {
  position: absolute;
  top: 0;
  z-index: 3;
  width: 100%;
}
.top-recruit__wrap {
  position: relative;
  width: fit-content;
  margin-left: auto;
  margin-top: 76.4vw;
  margin-bottom: 2.6666666667vw;
  margin-right: 2.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .top-recruit__wrap {
    margin-top: min(8.3333333333vw, 120px);
    margin-bottom: 0;
    margin-right: min(6.25vw, 90px);
  }
}
@media only screen and (min-width: 1440px) {
  .top-recruit__wrap {
    margin-top: min(120px + (100vw - 1440px) * 0.0214285714, 144px);
    margin-right: min(90px + (100vw - 1440px) * 0.0160714286, 108px);
  }
}
.top-recruit__base {
  position: relative;
  width: 74.9333333333vw;
}
@media only screen and (min-width: 767px) {
  .top-recruit__base {
    width: min(39.0277777778vw, 562px);
  }
}
@media only screen and (min-width: 1440px) {
  .top-recruit__base {
    width: min(562px + (100vw - 1440px) * 0.1003571429, 674.4px);
  }
}
.top-recruit__layer {
  position: absolute;
  width: 100%;
  top: 0;
}

.about {
  position: relative;
  z-index: 1;
  padding-top: 25.6vw;
  width: 100%;
}
@media only screen and (min-width: 767px) {
  .about {
    padding-top: min(6.9444444444vw, 100px);
  }
}
@media only screen and (min-width: 1440px) {
  .about {
    padding-top: min(100px + (100vw - 1440px) * 0.0178571429, 120px);
  }
}
.about__ip {
  position: absolute;
  top: 0;
  left: 0;
  width: 97.3333333333vw;
  height: 133.3333333333vw;
  overflow: hidden;
  isolation: isolate;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  mask-image: linear-gradient(black 0%, black 60%, transparent 90%);
}
@media only screen and (min-width: 767px) {
  .about__ip {
    width: 100%;
    height: min(76.3888888889vw, 1100px);
  }
}
.about__ip.is-bottom {
  top: unset;
  bottom: 0;
  mask-image: linear-gradient(transparent 5%, black 20%, black 90%);
  height: 230.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .about__ip.is-bottom {
    mask-image: linear-gradient(transparent 20%, black 35%, black 90%);
    height: min(52.0833333333vw, 750px);
  }
}
.about__ip:before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 97.3333333333vw;
  height: 100%;
  mix-blend-mode: screen;
  z-index: 1;
  pointer-events: none;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  background: linear-gradient(90deg, #f742fd 0%, #fc3231 27%, #ffbd18 51%, #fc3231 78%, #3019ff 100%);
}
@media only screen and (min-width: 767px) {
  .about__ip:before {
    width: 100%;
    height: 100%;
  }
}
.about__ip-list {
  position: relative;
  overflow: hidden;
}
.about__ip-track {
  display: flex;
  width: max-content;
  height: 100%;
  background-color: white;
}
.about__ip-item {
  flex: none;
  width: 244vw;
  height: 100%;
}
@media only screen and (min-width: 767px) {
  .about__ip-item {
    width: min(127.0833333333vw, 1830px);
  }
}
.about__ip-item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.about__main {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.about__main .top-kv__thunder {
  display: none;
  position: absolute;
  top: 6vw;
  left: 50%;
  z-index: 10;
  width: 97.3333333333vw;
  height: auto;
  pointer-events: none;
  background-repeat: no-repeat;
  background-position: center top;
  background-size: contain;
  transform: translateX(-50%);
}
@media only screen and (min-width: 767px) {
  .about__main .top-kv__thunder {
    top: -2.0833333333vw;
    width: 79.8611111111vw;
    transform: translateX(-50%);
  }
}
.about__main .top-kv__thunder.js-play {
  display: block;
}
.about__main .top-kv__thunder.is-second.js-play {
  display: block;
}
.about__main-track {
  display: flex;
  width: 100%;
  height: 100%;
}
.about__main-gradient {
  flex: none;
  width: 200%;
  height: 100%;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
.about__main-base {
  position: relative;
  width: 97.3333333333vw;
  z-index: 2;
  margin-inline: auto;
}
@media only screen and (min-width: 767px) {
  .about__main-base {
    width: min(98.6111111111vw, 1420px);
    margin-top: max(-3.1944444444vw, -46px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__main-base {
    width: min(1420px + (100vw - 1440px) * 0.2535714286, 1704px);
    margin-top: max(-46px + (100vw - 1440px) * -0.0082142857, -55.2px);
  }
}
.about__main-base--bg {
  position: relative;
  width: 97.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .about__main-base--bg {
    width: min(98.6111111111vw, 1420px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__main-base--bg {
    width: min(1420px + (100vw - 1440px) * 0.2535714286, 1704px);
  }
}
.about__main-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.about__main-layer--t1 {
  overflow: hidden;
  isolation: isolate;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  mask-image: url(../data/webp/lang/ja/about/main_full.webp);
  mask-repeat: no-repeat;
  mask-size: contain;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
.about__main-layer--t1 {
  background-size: 200% auto;
}
@media only screen and (min-width: 767px) {
  .about__main-layer--t1 {
    mask-image: url(../data/webp/lang/ja/about/main_full_pc.webp);
  }
}
.about__main-text {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.about__main-text--s1 {
  mask-image: url(../data/webp/lang/ja/about/main_text_1.webp);
  mask-repeat: no-repeat;
  mask-size: contain;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
.about__main-text--s1 {
  background-size: 200% auto;
}
@media only screen and (min-width: 767px) {
  .about__main-text--s1 {
    mask-image: url(../data/webp/lang/ja/about/main_text_1_pc.webp);
  }
}
.about__main-text--s2 {
  mask-image: url(../data/webp/lang/ja/about/main_text_2.webp);
  mask-repeat: no-repeat;
  mask-size: contain;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
.about__main-text--s2 {
  background-size: 200% auto;
}
@media only screen and (min-width: 767px) {
  .about__main-text--s2 {
    mask-image: url(../data/webp/lang/ja/about/main_text_2_pc.webp);
  }
}
.about__kv {
  position: relative;
  width: 97.3333333333vw;
  margin-inline: auto;
  z-index: 2;
  margin-top: max(-17.3611111111vw, -250px);
}
@media only screen and (min-width: 767px) {
  .about__kv {
    width: min(98.6111111111vw, 1420px);
    margin-top: max(-13.6111111111vw, -196px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__kv {
    width: min(1420px + (100vw - 1440px) * 0.2535714286, 1704px);
    margin-top: max(-196px + (100vw - 1440px) * -0.035, -235.2px);
  }
}
.about__kv-base {
  position: relative;
  width: 97.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .about__kv-base {
    width: min(98.6111111111vw, 1420px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__kv-base {
    width: min(1420px + (100vw - 1440px) * 0.2535714286, 1704px);
  }
}
.about__kv-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.about__kv-layer--k1 {
  z-index: 1;
}
.about__kv-layer--k2 {
  z-index: 3;
}
.about__kv-layer--g1 {
  z-index: 1;
  overflow: hidden;
  isolation: isolate;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  background-image: url(../data/webp/lang/ja/about/layer_g1.webp);
  background-repeat: no-repeat;
  background-size: contain;
}
@media only screen and (min-width: 767px) {
  .about__kv-layer--g1 {
    background-image: url(../data/webp/lang/ja/about/layer_g1_pc.webp);
  }
}
.about__kv-layer--g2 {
  z-index: 3;
  overflow: hidden;
  isolation: isolate;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  background-image: url(../data/webp/lang/ja/about/layer_g2.webp);
  background-repeat: no-repeat;
  background-size: contain;
}
@media only screen and (min-width: 767px) {
  .about__kv-layer--g2 {
    background-image: url(../data/webp/lang/ja/about/layer_g2_pc.webp);
  }
}
.about__kv-chara {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}
.about__kv-shadow {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.about__kv-stone {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
  pointer-events: none;
}
.about__summary {
  margin-top: 17.3333333333vw;
  padding-bottom: 13.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .about__summary {
    margin-top: 0;
    padding-bottom: min(6.9444444444vw, 100px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__summary {
    padding-bottom: min(100px + (100vw - 1440px) * 0.0178571429, 120px);
  }
}
.about__summary-list {
  display: flex;
  flex-direction: column;
  row-gap: 10.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .about__summary-list {
    flex-direction: row;
    column-gap: min(2.7777777778vw, 40px);
    justify-content: center;
  }
}
@media only screen and (min-width: 1440px) {
  .about__summary-list {
    column-gap: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
  }
}
.about__summary-item {
  display: flex;
  flex-direction: column;
  padding-inline: 4vw;
  row-gap: 5.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .about__summary-item {
    padding: 0;
    row-gap: min(2.0833333333vw, 30px);
    width: min(33.3333333333vw, 480px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__summary-item {
    row-gap: min(30px + (100vw - 1440px) * 0.0053571429, 36px);
    width: min(480px + (100vw - 1440px) * 0.0857142857, 576px);
  }
}
.about__summary-thumb {
  position: relative;
  width: 100%;
  border-radius: 1.0666666667vw;
  overflow: hidden;
  width: 89.2vw;
  height: 50.1333333333vw;
  margin-inline: auto;
}
@media only screen and (min-width: 767px) {
  .about__summary-thumb {
    width: min(33.3333333333vw, 480px);
    height: min(18.75vw, 270px);
    border-radius: min(0.5555555556vw, 8px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__summary-thumb {
    width: min(480px + (100vw - 1440px) * 0.0857142857, 576px);
    height: min(270px + (100vw - 1440px) * 0.0482142857, 324px);
    border-radius: min(8px + (100vw - 1440px) * 0.0014285714, 9.6px);
  }
}
.about__summary-thumb .about__summary-video, .about__summary-thumb .about__summary-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: translateZ(0);
  backface-visibility: hidden;
  contain: paint;
}
.about__summary-thumb .about__summary-img {
  position: absolute;
  inset: 0;
  opacity: 1;
  transition: opacity 0.4s ease;
}
.about {
  /* thumb hidden once the video is ready */
}
.about__summary-thumb .about__summary-img.js-hide {
  opacity: 0;
  pointer-events: none;
}
.about__summary-title {
  font-size: 5.8666666667vw;
  font-weight: 900;
  align-self: center;
}
@media only screen and (min-width: 767px) {
  .about__summary-title {
    font-size: min(2.2222222222vw, 32px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__summary-title {
    font-size: min(32px + (100vw - 1440px) * 0.0057142857, 38.4px);
  }
}
.about__summary-text {
  font-size: 4vw;
  line-height: 1.8666666667;
  font-weight: 700;
}
@media only screen and (min-width: 767px) {
  .about__summary-text {
    line-height: 1.7;
    font-size: min(1.3888888889vw, 20px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__summary-text {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
  }
}
.about__slider {
  width: 100%;
  height: 15.7333333333vw;
  background-image: url(../data/webp/about/text_slide.webp);
  background-repeat: repeat-x;
  background-size: 76.8vw 15.7333333333vw;
}
@media only screen and (min-width: 767px) {
  .about__slider {
    height: min(12.5vw, 180px);
    background-size: min(60.7638888889vw, 875px) min(12.5vw, 180px);
  }
}
.about__curve {
  width: 100%;
  height: 13.3333333333vw;
  margin-top: -6.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .about__curve {
    margin-top: max(-5.4166666667vw, -78px);
    height: 8.1944444444vw;
  }
}
.about__concept {
  position: relative;
  background-color: white;
  padding-bottom: 13.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .about__concept {
    padding-bottom: min(4.1666666667vw, 60px);
  }
}
.about__concept-stone {
  position: absolute;
  top: -18.1333333333vw;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  pointer-events: none;
}
@media only screen and (min-width: 767px) {
  .about__concept-stone {
    width: min(101.1111111111vw, 1456px);
    top: min(8.6805555556vw, 125px);
    right: max(-2.5vw, -36px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__concept-stone {
    width: min(1456px + (100vw - 1440px) * 0.26, 1747.2px);
    top: min(125px + (100vw - 1440px) * 0.0223214286, 150px);
    right: max(-36px + (100vw - 1440px) * -0.0064285714, -43.2px);
  }
}
.about__concept-list {
  position: relative;
  z-index: 2;
  padding-top: 6.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .about__concept-list {
    padding-top: 0;
    margin-inline: auto;
    max-width: 1420px;
  }
}
@media only screen and (min-width: 1440px) {
  .about__concept-list {
    max-width: min(1420px + (100vw - 1440px) * 0.2535714286, 1704px);
  }
}
.about__concept-item {
  display: flex;
  flex-direction: column;
  row-gap: 6.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .about__concept-item {
    row-gap: 0;
  }
}
@media only screen and (min-width: 767px) {
  .about__concept-item.is-first {
    flex-direction: row-reverse;
    justify-content: start;
    column-gap: min(1.3888888889vw, 20px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__concept-item.is-first {
    column-gap: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
  }
}
@media only screen and (min-width: 767px) {
  .about__concept-item.is-first .about__concept-visual {
    margin-left: max(-0.6944444444vw, -10px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__concept-item.is-first .about__concept-visual {
    margin-left: max(-10px + (100vw - 1440px) * -0.0017857143, -12px);
  }
}
.about__concept-item.is-second {
  margin-top: 8vw;
}
@media only screen and (min-width: 767px) {
  .about__concept-item.is-second {
    flex-direction: row;
    justify-content: end;
    margin-top: max(-12.7083333333vw, -183px);
    column-gap: min(2.5694444444vw, 37px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__concept-item.is-second {
    margin-top: max(-183px + (100vw - 1440px) * -0.0326785714, -219.6px);
    column-gap: min(37px + (100vw - 1440px) * 0.0066071429, 44.4px);
  }
}
@media only screen and (min-width: 767px) {
  .about__concept-item.is-second .about__concept-visual {
    margin-right: max(-0.6944444444vw, -10px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__concept-item.is-second .about__concept-visual {
    margin-right: max(-10px + (100vw - 1440px) * -0.0017857143, -12px);
  }
}
@media only screen and (min-width: 767px) {
  .about__concept-item.is-second .about__concept-box {
    width: min(35.5555555556vw, 512px);
    margin-top: min(15.2777777778vw, 220px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__concept-item.is-second .about__concept-box {
    width: min(512px + (100vw - 1440px) * 0.0914285714, 614.4px);
    margin-top: min(220px + (100vw - 1440px) * 0.0392857143, 264px);
  }
}
.about__concept-box {
  padding-inline: 4vw;
}
@media only screen and (min-width: 767px) {
  .about__concept-box {
    padding: 0;
  }
}
.about__concept-subhead {
  font-size: 6.4vw;
  font-family: "futura-pt-condensed", sans-serif;
  font-weight: 800;
}
@media only screen and (min-width: 767px) {
  .about__concept-subhead {
    font-size: min(2.7777777778vw, 40px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__concept-subhead {
    font-size: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
  }
}
.about__concept-title {
  font-size: 10.6666666667vw;
  font-weight: 900;
  margin-top: 3.3333333333vw;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
.about__concept-title {
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
@media only screen and (min-width: 767px) {
  .about__concept-title {
    font-size: min(4.4444444444vw, 64px);
    margin-top: min(0.3472222222vw, 5px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__concept-title {
    font-size: min(64px + (100vw - 1440px) * 0.0114285714, 76.8px);
    margin-top: min(5px + (100vw - 1440px) * 0.0008928571, 6px);
  }
}
.about__concept-title span {
  letter-spacing: -0.14em;
}
.about__concept-subtitle {
  font-size: 8.2666666667vw;
  margin-top: 1.3333333333vw;
  font-weight: 900;
}
@media only screen and (min-width: 767px) {
  .about__concept-subtitle {
    font-size: min(3.3333333333vw, 48px);
    margin-top: min(0.2083333333vw, 3px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__concept-subtitle {
    font-size: min(48px + (100vw - 1440px) * 0.0085714286, 57.6px);
    margin-top: min(3px + (100vw - 1440px) * 0.0005357143, 3.6px);
  }
}
.about__concept-text {
  font-size: 4vw;
  line-height: 1.8666666667;
  font-weight: 700;
  margin-top: 6.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .about__concept-text {
    width: min(35.4166666667vw, 510px);
    line-height: 1.7;
    font-size: min(1.3888888889vw, 20px);
    margin-top: min(1.8055555556vw, 26px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__concept-text {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    line-height: 1.7;
    margin-top: min(26px + (100vw - 1440px) * 0.0046428571, 31.2px);
  }
}
.about__concept-visual {
  position: relative;
}
.about__concept-visual:has(.about__concept-visual--c1) {
  width: 100%;
  height: 98.4vw;
}
@media only screen and (min-width: 767px) {
  .about__concept-visual:has(.about__concept-visual--c1) {
    flex-shrink: 0;
    width: min(52.7083333333vw, 759px);
    height: min(45.5555555556vw, 656px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__concept-visual:has(.about__concept-visual--c1) {
    width: min(759px + (100vw - 1440px) * 0.1355357143, 910.8px);
    height: min(656px + (100vw - 1440px) * 0.1171428571, 787.2px);
  }
}
.about__concept-visual:has(.about__concept-visual--c2) {
  width: 100%;
  height: 144.4vw;
}
@media only screen and (min-width: 767px) {
  .about__concept-visual:has(.about__concept-visual--c2) {
    flex-shrink: 0;
    width: min(54.5138888889vw, 785px);
    height: min(60.4166666667vw, 870px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__concept-visual:has(.about__concept-visual--c2) {
    width: min(785px + (100vw - 1440px) * 0.1401785714, 942px);
    height: min(870px + (100vw - 1440px) * 0.1553571429, 1044px);
  }
}
.about__concept-visual--c1 {
  position: absolute;
  width: 100%;
  height: 98.4vw;
  top: 0;
  left: 0;
}
@media only screen and (min-width: 767px) {
  .about__concept-visual--c1 {
    width: min(52.7083333333vw, 759px);
    height: min(45.5555555556vw, 656px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__concept-visual--c1 {
    width: min(759px + (100vw - 1440px) * 0.1355357143, 910.8px);
    height: min(656px + (100vw - 1440px) * 0.1171428571, 787.2px);
  }
}
.about__concept-visual--c2 {
  position: absolute;
  width: 100%;
  height: 144.4vw;
  top: 0;
  left: 0;
}
@media only screen and (min-width: 767px) {
  .about__concept-visual--c2 {
    width: min(54.5138888889vw, 785px);
    height: min(60.4166666667vw, 870px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__concept-visual--c2 {
    width: min(785px + (100vw - 1440px) * 0.1401785714, 942px);
    height: min(870px + (100vw - 1440px) * 0.1553571429, 1044px);
  }
}
.about__concept-visual--c2.about__concept-visual--layer1 {
  z-index: 2;
}
@media only screen and (min-width: 767px) {
  .about__concept-visual--c2.about__concept-visual--layer1 {
    z-index: 1;
  }
}
.about__concept-visual--c2.about__concept-visual--layer2 {
  z-index: 1;
}
@media only screen and (min-width: 767px) {
  .about__concept-visual--c2.about__concept-visual--layer2 {
    z-index: 2;
  }
}
.about__concept-visual--c2.about__concept-visual--layer3 {
  z-index: 3;
}
@media only screen and (min-width: 767px) {
  .about__concept-visual--c2.about__concept-visual--layer3 {
    z-index: 3;
  }
}
.about__concept-visual--c2.about__concept-visual--layer4 {
  z-index: 5;
}
@media only screen and (min-width: 767px) {
  .about__concept-visual--c2.about__concept-visual--layer4 {
    z-index: 4;
  }
}
@media only screen and (min-width: 767px) {
  .about__concept-visual--c2.about__concept-visual--layer5 {
    z-index: 5;
  }
}
.about__recruit {
  position: relative;
  z-index: 2;
}
@media only screen and (min-width: 767px) {
  .about__recruit {
    margin-inline: auto;
    max-width: 1420px;
  }
}
@media only screen and (min-width: 1440px) {
  .about__recruit {
    max-width: min(1420px + (100vw - 1440px) * 0.2535714286, 1704px);
  }
}
.about__recruit-bg {
  position: relative;
  padding-bottom: 30.6666666667vw;
  margin-top: 2.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .about__recruit-bg {
    width: min(77.4305555556vw, 1115px);
    margin-top: max(-12.5vw, -180px);
    left: max(-1.9444444444vw, -28px);
    padding-bottom: min(2.9861111111vw, 43px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__recruit-bg {
    width: min(1115px + (100vw - 1440px) * 0.1991071429, 1338px);
    margin-top: max(-180px + (100vw - 1440px) * -0.0321428571, -216px);
    left: max(-28px + (100vw - 1440px) * -0.005, -33.6px);
    padding-bottom: min(43px + (100vw - 1440px) * 0.0076785714, 51.6px);
  }
}
.about__recruit-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  margin-top: 20.8vw;
  z-index: 1;
}
@media only screen and (min-width: 767px) {
  .about__recruit-wrapper {
    margin-top: min(20.4861111111vw, 295px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__recruit-wrapper {
    margin-top: min(295px + (100vw - 1440px) * 0.0526785714, 354px);
  }
}
.about__recruit-text {
  position: relative;
  width: 38.4vw;
  height: 33.4666666667vw;
  margin-right: 1.8666666667vw;
  margin-left: auto;
  margin-bottom: -11.7333333333vw;
}
@media only screen and (min-width: 767px) {
  .about__recruit-text {
    width: min(33.8194444444vw, 487px);
    height: min(12.9861111111vw, 187px);
    margin-right: min(7.8472222222vw, 113px);
    margin-left: auto;
    margin-bottom: 0;
  }
}
@media only screen and (min-width: 1440px) {
  .about__recruit-text {
    width: min(487px + (100vw - 1440px) * 0.0869642857, 584.4px);
    height: min(187px + (100vw - 1440px) * 0.0333928571, 224.4px);
    margin-right: min(113px + (100vw - 1440px) * 0.0201785714, 135.6px);
  }
}
.about__recruit-text--t1, .about__recruit-text--t2 {
  position: absolute;
  top: 0;
  left: 0;
}
.about__address {
  position: relative;
  z-index: 2;
  max-width: 82.6666666667vw;
  background-color: white;
  margin-inline: auto;
  width: 100%;
  padding: 8vw;
  border-radius: 1.0666666667vw;
}
@media only screen and (min-width: 767px) {
  .about__address {
    max-width: min(69.4444444444vw, 1000px);
    padding: min(2.7777777778vw, 40px);
    border-radius: min(0.5555555556vw, 8px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__address {
    max-width: min(1000px + (100vw - 1440px) * 0.1785714286, 1200px);
    padding: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
    border-radius: min(8px + (100vw - 1440px) * 0.0014285714, 9.6px);
  }
}
.about__address-title {
  text-align: center;
  font-weight: 900;
  font-size: 5.3333333333vw;
  margin-bottom: 5.3333333333vw;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
.about__address-title {
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
@media only screen and (min-width: 767px) {
  .about__address-title {
    font-size: min(2.2222222222vw, 32px);
    margin-bottom: min(2.0833333333vw, 30px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__address-title {
    font-size: min(32px + (100vw - 1440px) * 0.0057142857, 38.4px);
    margin-bottom: min(30px + (100vw - 1440px) * 0.0053571429, 36px);
  }
}
@media only screen and (min-width: 767px) {
  .about__address-inner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 2.7777777778vw;
  }
}
@media only screen and (min-width: 1440px) {
  .about__address-inner {
    gap: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
  }
}
.about__address-table {
  margin: 0;
}
@media only screen and (min-width: 767px) {
  .about__address-table {
    flex: 1;
  }
}
.about__address-row {
  display: flex;
  align-items: flex-start;
  margin-bottom: 3.2vw;
  flex-direction: column;
}
@media only screen and (min-width: 767px) {
  .about__address-row {
    flex-direction: row;
    margin-bottom: min(0.9722222222vw, 14px);
  }
}
.about__address-row:last-child {
  margin-bottom: 0;
}
.about__address-label {
  font-size: 3.2vw;
  font-weight: 700;
  line-height: 1.6;
}
@media only screen and (min-width: 767px) {
  .about__address-label {
    font-size: min(1.1111111111vw, 16px);
    flex-basis: min(9.0277777778vw, 130px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__address-label {
    font-size: min(16px + (100vw - 1440px) * 0.0028571429, 19.2px);
    flex-basis: min(130px + (100vw - 1440px) * 0.0232142857, 156px);
  }
}
.about__address-value {
  font-size: 3.2vw;
  flex: 1;
  margin: 0;
  line-height: 1.6;
}
@media only screen and (min-width: 767px) {
  .about__address-value {
    font-size: min(1.1111111111vw, 16px);
  }
}
@media only screen and (min-width: 1440px) {
  .about__address-value {
    font-size: min(16px + (100vw - 1440px) * 0.0028571429, 19.2px);
  }
}
.about__address-map {
  position: relative;
  margin-top: 5.3333333333vw;
  aspect-ratio: 420/300;
  overflow: hidden;
}
@media only screen and (min-width: 767px) {
  .about__address-map {
    aspect-ratio: 420/300;
    flex: 0 0 min(29.1666666667vw, 420px);
    margin-top: 0;
  }
}
@media only screen and (min-width: 1440px) {
  .about__address-map {
    flex: 0 0 min(420px + (100vw - 1440px) * 0.075, 504px);
  }
}
.about__address-iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.news {
  position: relative;
  z-index: 1;
  margin-top: 25.6vw;
}
@media only screen and (min-width: 767px) {
  .news {
    margin-top: min(6.9444444444vw, 100px);
  }
}
@media only screen and (min-width: 1440px) {
  .news {
    margin-top: min(100px + (100vw - 1440px) * 0.0178571429, 120px);
  }
}
.news__list {
  display: flex;
  flex-wrap: wrap;
  gap: 4vw 2.6666666667vw;
  padding-bottom: 8vw;
  margin-top: 13.3333333333vw;
  margin-inline: auto;
  width: 89.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .news__list {
    width: 100%;
    max-width: min(87.5vw, 1260px);
    justify-content: center;
    gap: min(1.3888888889vw, 20px);
    margin-top: min(4.1666666667vw, 60px);
    padding-bottom: min(4.1666666667vw, 60px);
  }
}
@media only screen and (min-width: 1440px) {
  .news__list {
    max-width: min(1260px + (100vw - 1440px) * 0.225, 1512px);
    gap: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    margin-top: min(60px + (100vw - 1440px) * 0.0107142857, 72px);
    padding-bottom: min(60px + (100vw - 1440px) * 0.0107142857, 72px);
  }
}
.news__list-item {
  width: 43.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .news__list-item {
    width: min(16.3888888889vw, 236px);
    flex-shrink: 0;
  }
}
@media only screen and (min-width: 1440px) {
  .news__list-item {
    width: min(236px + (100vw - 1440px) * 0.0421428571, 283.2px);
  }
}
.news__list-inner {
  height: 100%;
}
.news__item {
  background-color: #fff;
  width: 43.3333333333vw;
  height: 100%;
  box-shadow: 0 1.6vw 0 rgba(0, 0, 0, 0.16);
  border-radius: 1.0666666667vw;
  padding: 4vw;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}
@media only screen and (min-width: 767px) {
  .news__item {
    width: 100%;
    max-width: min(16.3888888889vw, 236px);
    border-radius: min(0.5555555556vw, 8px);
    padding: min(1.3888888889vw, 20px);
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(0, 0, 0, 0.16);
    min-height: min(22.2222222222vw, 320px);
  }
}
@media only screen and (min-width: 1440px) {
  .news__item {
    max-width: min(236px + (100vw - 1440px) * 0.0421428571, 283.2px);
    border-radius: min(8px + (100vw - 1440px) * 0.0014285714, 9.6px);
    padding: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    box-shadow: 0 min(8px + (100vw - 1440px) * 0.0014285714, 9.6px) 0 rgba(0, 0, 0, 0.16);
    min-height: min(320px + (100vw - 1440px) * 0.0571428571, 384px);
  }
}
.news__content {
  position: relative;
}
.news__item-thumb {
  width: 35.4666666667vw;
  height: 19.6vw;
  margin-inline: auto;
  background-size: cover;
}
@media only screen and (min-width: 767px) {
  .news__item-thumb {
    width: 100%;
    max-width: min(13.6111111111vw, 196px);
    height: min(7.5vw, 108px);
    border-radius: min(0.2777777778vw, 4px);
  }
}
@media only screen and (min-width: 1440px) {
  .news__item-thumb {
    max-width: min(196px + (100vw - 1440px) * 0.035, 235.2px);
    height: min(108px + (100vw - 1440px) * 0.0192857143, 129.6px);
    border-radius: min(4px + (100vw - 1440px) * 0.0007142857, 4.8px);
  }
}
.news__item-date {
  font-size: 3.4666666667vw;
  color: #888888;
  font-family: "futura-pt-condensed", sans-serif;
  margin-top: 3.7333333333vw;
  font-weight: 700;
}
@media only screen and (min-width: 767px) {
  .news__item-date {
    font-size: min(1.3888888889vw, 20px);
    margin-top: min(0.9722222222vw, 14px);
  }
}
@media only screen and (min-width: 1440px) {
  .news__item-date {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    margin-top: min(14px + (100vw - 1440px) * 0.0025, 16.8px);
  }
}
.news__item-head {
  font-size: 3.2vw;
  overflow: hidden;
  line-clamp: 3;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  font-weight: 700;
  margin-top: 2vw;
  line-height: 1.5;
}
@media only screen and (min-width: 767px) {
  .news__item-head {
    line-clamp: 2;
    -webkit-line-clamp: 2;
    font-size: min(1.1111111111vw, 16px);
    margin-top: min(0.5555555556vw, 8px);
    line-height: 1.5;
  }
}
@media only screen and (min-width: 1440px) {
  .news__item-head {
    font-size: min(16px + (100vw - 1440px) * 0.0028571429, 19.2px);
    margin-top: min(8px + (100vw - 1440px) * 0.0014285714, 9.6px);
  }
}
.news__item-arrow {
  width: 6.6666666667vw;
  height: 4vw;
  mask-image: url(../data/webp/arrow.webp);
  mask-repeat: no-repeat;
  mask-size: contain;
  margin-left: auto;
  margin-top: 4vw;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
@media only screen and (min-width: 767px) {
  .news__item-arrow {
    width: min(2.5vw, 36px);
    height: min(1.4583333333vw, 21px);
    margin-top: min(1.3888888889vw, 20px);
  }
}
@media only screen and (min-width: 1440px) {
  .news__item-arrow {
    width: min(36px + (100vw - 1440px) * 0.0064285714, 43.2px);
    height: min(21px + (100vw - 1440px) * 0.00375, 25.2px);
    margin-top: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
  }
}

.works {
  position: relative;
  z-index: 1;
  margin-top: 24vw;
}
@media only screen and (min-width: 767px) {
  .works {
    margin-top: min(6.9444444444vw, 100px);
  }
}
@media only screen and (min-width: 1440px) {
  .works {
    margin-top: min(100px + (100vw - 1440px) * 0.0178571429, 120px);
  }
}
.works__list {
  display: flex;
  flex-wrap: wrap;
  gap: 4vw 2.6666666667vw;
  padding-bottom: 8vw;
  margin-inline: auto;
  width: 89.3333333333vw;
  margin-top: 13.0666666667vw;
}
@media only screen and (min-width: 767px) {
  .works__list {
    width: 100%;
    max-width: min(87.5vw, 1260px);
    gap: min(1.9444444444vw, 28px);
    padding-bottom: min(4.1666666667vw, 60px);
    margin-top: min(3.9583333333vw, 57px);
  }
}
@media only screen and (min-width: 1440px) {
  .works__list {
    max-width: min(1260px + (100vw - 1440px) * 0.225, 1512px);
    gap: min(28px + (100vw - 1440px) * 0.005, 33.6px);
    padding-bottom: min(60px + (100vw - 1440px) * 0.0107142857, 72px);
    margin-top: min(57px + (100vw - 1440px) * 0.0101785714, 68.4px);
  }
}
.works__list-inner {
  opacity: 0;
}
.works__list-inner:has(.is-comingsoon) {
  height: 100%;
}
.works__item {
  display: block;
  position: relative;
  background-color: #fff;
  width: 89.3333333333vw;
  box-shadow: 0 1.6vw 0 rgba(0, 0, 0, 0.16);
  border-radius: 1.0666666667vw;
  overflow: hidden;
}
@media only screen and (min-width: 767px) {
  .works__item {
    width: min(27.7777777778vw, 400px);
    border-radius: min(0.5555555556vw, 8px);
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(0, 0, 0, 0.16);
  }
}
@media only screen and (min-width: 1440px) {
  .works__item {
    width: min(400px + (100vw - 1440px) * 0.0714285714, 480px);
    border-radius: min(8px + (100vw - 1440px) * 0.0014285714, 9.6px);
    box-shadow: 0 min(8px + (100vw - 1440px) * 0.0014285714, 9.6px) 0 rgba(0, 0, 0, 0.16);
  }
}
.works__item.is-comingsoon {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.works__item.is-comingsoon .works__item-thumb {
  background: url(../img/noise.gif);
}
.works__item.is-comingsoon .works__item-info {
  margin: auto 0;
}
.works__item.is-comingsoon .works__item-arrow {
  display: none;
}
.works__item.is-comingsoon:hover {
  transform: none;
}
.works__item-thumb {
  width: 100%;
  margin-inline: auto;
  height: 49.3333333333vw;
  background-size: cover;
}
@media only screen and (min-width: 767px) {
  .works__item-thumb {
    height: min(15.4166666667vw, 222px);
  }
}
@media only screen and (min-width: 1440px) {
  .works__item-thumb {
    height: min(222px + (100vw - 1440px) * 0.0396428571, 266.4px);
  }
}
.works__item-info {
  display: flex;
  padding: 3.3333333333vw 4vw;
  justify-content: space-between;
  align-items: center;
}
@media only screen and (min-width: 767px) {
  .works__item-info {
    padding: min(0.9722222222vw, 14px) min(1.3888888889vw, 20px);
  }
}
@media only screen and (min-width: 1440px) {
  .works__item-info {
    padding: min(14px + (100vw - 1440px) * 0.0025, 16.8px) min(20px + (100vw - 1440px) * 0.0035714286, 24px);
  }
}
.works__item-summary {
  position: relative;
  display: flex;
  flex-direction: column;
  row-gap: 2.1333333333vw;
}
@media only screen and (min-width: 767px) {
  .works__item-summary {
    row-gap: min(1.1111111111vw, 16px);
  }
}
.works__item-head {
  font-size: 3.2vw;
  overflow: hidden;
  line-clamp: 1;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  width: 70.9333333333vw;
  font-weight: 800;
  font-family: ellipsis-font, "M PLUS 1p", sans-serif;
}
@media only screen and (min-width: 767px) {
  .works__item-head {
    font-size: min(1.1111111111vw, 16px);
    width: 100%;
  }
}
@media only screen and (min-width: 1440px) {
  .works__item-head {
    font-size: min(16px + (100vw - 1440px) * 0.0028571429, 19.2px);
  }
}
.works__item-arrow {
  width: 6.6666666667vw;
  height: 4vw;
  mask-image: url(../data/webp/arrow.webp);
  mask-repeat: no-repeat;
  mask-size: contain;
  mask-position: center;
  flex-shrink: 0;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
@media only screen and (min-width: 767px) {
  .works__item-arrow {
    width: min(2.5vw, 36px);
    height: min(1.5277777778vw, 22px);
  }
}
@media only screen and (min-width: 1440px) {
  .works__item-arrow {
    width: min(36px + (100vw - 1440px) * 0.0064285714, 43.2px);
    height: min(22px + (100vw - 1440px) * 0.0039285714, 26.4px);
  }
}
.works__item-tag {
  display: flex;
  flex-direction: row;
  gap: 0.5333333333vw;
}
@media only screen and (min-width: 767px) {
  .works__item-tag {
    gap: min(0.2777777778vw, 4px);
  }
}
.works__item-type {
  position: relative;
  width: fit-content;
  font-size: 2.6666666667vw;
  border-radius: 2.6666666667vw;
  font-weight: 800;
  font-family: "M PLUS 1p", sans-serif;
  transition: all 300ms;
  color: white;
  background-color: black;
  padding: 1.3333333333vw 2.4vw 1.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .works__item-type {
    font-size: min(0.8333333333vw, 12px);
    border-radius: min(0.8333333333vw, 12px);
    padding: min(0.3472222222vw, 5px) min(0.6944444444vw, 10px) min(0.3472222222vw, 5px);
  }
}

.contact {
  position: relative;
  z-index: 2;
  margin-top: 24vw;
  padding-bottom: 26.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .contact {
    margin-top: min(6.9444444444vw, 100px);
    padding-bottom: min(6.9444444444vw, 100px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact {
    margin-top: min(100px + (100vw - 1440px) * 0.0178571429, 120px);
    padding-bottom: min(100px + (100vw - 1440px) * 0.0178571429, 120px);
  }
}
.contact__form {
  width: 100%;
  max-width: 89.3333333333vw;
  margin: 13.3333333333vw auto 13.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .contact__form {
    max-width: min(83.3333333333vw, 1200px);
    margin: min(6.9444444444vw, 100px) auto min(5.5555555556vw, 80px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__form {
    max-width: min(1200px + (100vw - 1440px) * 0.2142857143, 1440px);
    margin: min(100px + (100vw - 1440px) * 0.0178571429, 120px) auto min(80px + (100vw - 1440px) * 0.0142857143, 96px);
  }
}
.contact__form input,
.contact__form textarea {
  background: #fff;
}
@media only screen and (min-width: 767px) {
  .contact__form-item {
    display: flex;
    column-gap: min(3.4027777778vw, 49px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__form-item {
    column-gap: min(49px + (100vw - 1440px) * 0.00875, 58.8px);
  }
}
.contact__form-item:not(:first-child) {
  margin-top: 5.8666666667vw;
}
@media only screen and (min-width: 767px) {
  .contact__form-item:not(:first-child) {
    margin-top: min(4.1666666667vw, 60px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__form-item:not(:first-child) {
    margin-top: min(60px + (100vw - 1440px) * 0.0107142857, 72px);
  }
}
.contact__form-item:last-child {
  align-items: start;
}
.contact__form-item.is-error input, .contact__form-item.is-error textarea {
  border: solid red 0.5333333333vw;
}
@media only screen and (min-width: 767px) {
  .contact__form-item.is-error input, .contact__form-item.is-error textarea {
    border: solid red min(0.2777777778vw, 4px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__form-item.is-error input, .contact__form-item.is-error textarea {
    border: solid red min(4px + (100vw - 1440px) * 0.0007142857, 4.8px);
  }
}
.contact__form-item.is-error .contact__dropdown-header {
  padding: 3.2vw;
  border: solid red 0.5333333333vw;
  color: red;
}
@media only screen and (min-width: 767px) {
  .contact__form-item.is-error .contact__dropdown-header {
    padding: min(0.2777777778vw, 4px) min(0.8333333333vw, 12px);
    border: solid red min(0.2777777778vw, 4px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__form-item.is-error .contact__dropdown-header {
    padding: min(4px + (100vw - 1440px) * 0.0007142857, 4.8px) min(12px + (100vw - 1440px) * 0.0021428571, 14.4px);
    border: solid red min(4px + (100vw - 1440px) * 0.0007142857, 4.8px);
  }
}
.contact__form-item.is-error .contact__dropdown-arrow:before {
  display: block;
  content: "";
  background-color: red;
}
.contact__form-item.is-error .contact__dropdown-arrow:after {
  display: block;
  content: "";
  background-color: red;
}
.contact__form-label {
  display: block;
  font-size: 4vw;
  font-weight: 700;
  line-height: 1.1333333333;
}
@media only screen and (min-width: 767px) {
  .contact__form-label {
    width: min(18.0555555556vw, 260px);
    text-align: right;
    font-size: min(1.3888888889vw, 20px);
    line-height: 1.7;
    flex-shrink: 0;
    padding-top: min(1.25vw, 18px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__form-label {
    width: min(260px + (100vw - 1440px) * 0.0464285714, 312px);
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    line-height: 1.7;
    padding-top: min(18px + (100vw - 1440px) * 0.0032142857, 21.6px);
  }
}
.contact__form-label span {
  font-weight: 700;
  color: red;
}
@media only screen and (min-width: 767px) {
  .contact__form-label span {
    margin-right: max(-0.6944444444vw, -10px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__form-label span {
    margin-right: min(-10px + (100vw - 1440px) * -0.0017857143, -12px);
  }
}
.contact__form-input, .contact__form .wpcf7-text, .contact__form .wpcf7-email {
  background: #fff;
  font-size: 4vw;
  font-weight: 700;
  line-height: 1.8666666667;
  border-radius: 2.1333333333vw;
  height: 12vw;
  width: 100%;
  padding: 4vw;
  margin-top: 4vw;
  border: none;
  box-shadow: 0 1.0666666667vw 0 rgba(0, 0, 0, 0.16);
}
@media only screen and (min-width: 767px) {
  .contact__form-input, .contact__form .wpcf7-text, .contact__form .wpcf7-email {
    font-size: min(1.3888888889vw, 20px);
    line-height: 1.7;
    border-radius: min(0.5555555556vw, 8px);
    height: min(4.1666666667vw, 60px);
    padding: min(1.3888888889vw, 20px) min(1.3888888889vw, 20px);
    margin-top: 0;
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(0, 0, 0, 0.16);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__form-input, .contact__form .wpcf7-text, .contact__form .wpcf7-email {
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    line-height: 1.7;
    border-radius: min(8px + (100vw - 1440px) * 0.0014285714, 9.6px);
    height: min(60px + (100vw - 1440px) * 0.0107142857, 72px);
    padding: min(20px + (100vw - 1440px) * 0.0035714286, 24px) min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    box-shadow: 0 min(8px + (100vw - 1440px) * 0.0014285714, 9.6px) 0 rgba(0, 0, 0, 0.16);
  }
}
.contact__form-input::placeholder, .contact__form .wpcf7-text::placeholder, .contact__form .wpcf7-email::placeholder {
  color: #cccccc;
}
.contact__form-textarea, .contact__form .wpcf7-textarea {
  width: 100%;
  min-height: 53.3333333333vw;
  border-radius: 2.1333333333vw;
  border: none;
  background: #fff;
  font-size: 4vw;
  font-weight: 700;
  padding: 6.6666666667vw 5.3333333333vw;
  margin-top: 2.6666666667vw;
  box-shadow: 0 1.0666666667vw 0 rgba(0, 0, 0, 0.16);
}
@media only screen and (min-width: 767px) {
  .contact__form-textarea, .contact__form .wpcf7-textarea {
    min-height: min(20.8333333333vw, 300px);
    font-size: min(1.3888888889vw, 20px);
    line-height: 1.7;
    border-radius: min(0.5555555556vw, 8px);
    padding: min(1.5972222222vw, 23px) min(2.0833333333vw, 30px);
    margin-top: 0;
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(0, 0, 0, 0.16);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__form-textarea, .contact__form .wpcf7-textarea {
    min-height: min(300px + (100vw - 1440px) * 0.0535714286, 360px);
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    line-height: 1.7;
    border-radius: min(8px + (100vw - 1440px) * 0.0014285714, 9.6px);
    padding: min(23px + (100vw - 1440px) * 0.0041071429, 27.6px) min(30px + (100vw - 1440px) * 0.0053571429, 36px);
    box-shadow: 0 min(8px + (100vw - 1440px) * 0.0014285714, 9.6px) 0 rgba(0, 0, 0, 0.16);
  }
}
.contact__error {
  margin: 13.3333333333vw auto 0;
  background-color: #ffe1e1;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 26.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .contact__error {
    margin: min(5.5555555556vw, 80px) auto 0;
    height: min(9.7222222222vw, 140px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__error {
    margin: min(80px + (100vw - 1440px) * 0.0142857143, 96px) auto 0;
    height: min(140px + (100vw - 1440px) * 0.025, 168px);
  }
}
.contact__error-text {
  color: red;
  font-size: 4vw;
  line-height: 1.7;
  width: fit-content;
  padding-inline: 14.6666666667vw;
  font-weight: 700;
  text-align: center;
}
@media only screen and (min-width: 767px) {
  .contact__error-text {
    padding-inline: min(2.0833333333vw, 30px);
    font-size: min(1.3888888889vw, 20px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__error-text {
    padding-inline: min(30px + (100vw - 1440px) * 0.0053571429, 36px);
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
  }
}
.contact__dropdown {
  position: relative;
  width: 100%;
  margin-top: 4vw;
  height: 12vw;
}
@media only screen and (min-width: 767px) {
  .contact__dropdown {
    margin-top: 0;
    height: min(4.1666666667vw, 60px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__dropdown {
    height: min(60px + (100vw - 1440px) * 0.0107142857, 72px);
  }
}
.contact__dropdown.js-open .contact__dropdown-list {
  display: block;
}
.contact__dropdown.js-open .contact__dropdown-arrow:before {
  display: block;
  content: "";
  opacity: 0;
  transform: scaleY(0);
}
.contact__dropdown.js-open .contact__dropdown-arrow:after {
  display: block;
  content: "";
  transform: scaleY(1);
  opacity: 1;
}
.contact__dropdown-header {
  width: 100%;
  padding: 4vw;
  border-radius: 2.1333333333vw;
  background: white;
  text-align: left;
  position: relative;
  cursor: pointer;
  font-size: 4vw;
  font-weight: 700;
  color: #808080;
  box-shadow: 0 1.0666666667vw 0 rgba(0, 0, 0, 0.16);
}
@media only screen and (min-width: 767px) {
  .contact__dropdown-header {
    border-radius: min(0.5555555556vw, 8px);
    padding: min(0.8333333333vw, 12px) min(1.3888888889vw, 20px);
    font-size: min(1.3888888889vw, 20px);
    height: 100%;
    line-height: 1.7;
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(0, 0, 0, 0.16);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__dropdown-header {
    border-radius: min(8px + (100vw - 1440px) * 0.0014285714, 9.6px);
    padding: min(12px + (100vw - 1440px) * 0.0021428571, 14.4px) min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    line-height: 1.7;
    box-shadow: 0 min(8px + (100vw - 1440px) * 0.0014285714, 9.6px) 0 rgba(0, 0, 0, 0.16);
  }
}
.contact__dropdown-header:has(.contact__dropdown-text.js-select) {
  color: #000;
}
.contact__dropdown-arrow {
  width: 4.2666666667vw;
  height: 2.6666666667vw;
  position: absolute;
  right: 4.2666666667vw;
  top: 50%;
  transform: translateY(-50%);
}
@media only screen and (min-width: 767px) {
  .contact__dropdown-arrow {
    width: min(1.4583333333vw, 21px);
    height: min(0.9722222222vw, 14px);
    right: min(2.0833333333vw, 30px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__dropdown-arrow {
    width: min(21px + (100vw - 1440px) * 0.00375, 25.2px);
    height: min(14px + (100vw - 1440px) * 0.0025, 16.8px);
    right: min(30px + (100vw - 1440px) * 0.0053571429, 36px);
  }
}
.contact__dropdown-arrow:before {
  display: block;
  content: "";
  width: 4.2666666667vw;
  height: 2.6666666667vw;
  position: absolute;
  mask-image: url(../data/webp/contact/arrow.webp);
  mask-repeat: no-repeat;
  mask-size: contain;
  transition: transform 0.5s ease;
  transform: scaleY(1);
  transform-origin: top;
  background-color: #808080;
}
@media only screen and (min-width: 767px) {
  .contact__dropdown-arrow:before {
    width: min(1.4583333333vw, 21px);
    height: min(0.9722222222vw, 14px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__dropdown-arrow:before {
    width: min(21px + (100vw - 1440px) * 0.00375, 25.2px);
    height: min(14px + (100vw - 1440px) * 0.0025, 16.8px);
  }
}
.contact__dropdown-arrow:after {
  display: block;
  content: "";
  width: 4.2666666667vw;
  height: 2.6666666667vw;
  position: absolute;
  mask-image: url(../data/webp/contact/arrow_reverse.webp);
  mask-repeat: no-repeat;
  mask-size: contain;
  transition: transform 0.5s ease;
  opacity: 0;
  transform: scaleY(0);
  transform-origin: bottom;
  background-color: #808080;
}
@media only screen and (min-width: 767px) {
  .contact__dropdown-arrow:after {
    width: min(1.4583333333vw, 21px);
    height: min(0.9722222222vw, 14px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__dropdown-arrow:after {
    width: min(21px + (100vw - 1440px) * 0.00375, 25.2px);
    height: min(14px + (100vw - 1440px) * 0.0025, 16.8px);
  }
}
.contact__dropdown-list {
  position: absolute;
  top: 120%;
  left: 0;
  width: 100%;
  background: #000;
  border-radius: 2.6666666667vw;
  box-shadow: 0 1.0666666667vw 0 rgba(0, 0, 0, 0.16);
  list-style: none;
  padding: 0;
  margin: 0;
  display: none;
  z-index: 10;
  transition: all 300ms;
  height: max-content;
  overflow: hidden;
}
@media only screen and (min-width: 767px) {
  .contact__dropdown-list {
    border-radius: min(0.5555555556vw, 8px);
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(0, 0, 0, 0.16);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__dropdown-list {
    border-radius: min(8px + (100vw - 1440px) * 0.0014285714, 9.6px);
    box-shadow: 0 min(8px + (100vw - 1440px) * 0.0014285714, 9.6px) 0 rgba(0, 0, 0, 0.16);
  }
}
.contact__dropdown-list li {
  display: flex;
  align-items: center;
  height: 12vw;
  padding: 2vw 4vw;
  cursor: pointer;
  font-size: 4vw;
  font-weight: 700;
  color: #fff;
}
@media only screen and (min-width: 767px) {
  .contact__dropdown-list li {
    padding: min(1.0416666667vw, 15px) min(2.0833333333vw, 30px);
    font-size: min(1.3888888889vw, 20px);
    line-height: 1.7;
    height: min(4.1666666667vw, 60px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__dropdown-list li {
    padding: min(15px + (100vw - 1440px) * 0.0026785714, 18px) min(30px + (100vw - 1440px) * 0.0053571429, 36px);
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    line-height: 1.7;
    height: min(60px + (100vw - 1440px) * 0.0107142857, 72px);
  }
}
.contact__dropdown-list li:first-child {
  padding: 5.3333333333vw 4vw 2vw;
}
@media only screen and (min-width: 767px) {
  .contact__dropdown-list li:first-child {
    padding: min(2.7777777778vw, 40px) min(2.0833333333vw, 30px) min(1.0416666667vw, 15px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__dropdown-list li:first-child {
    padding: min(40px + (100vw - 1440px) * 0.0071428571, 48px) min(30px + (100vw - 1440px) * 0.0053571429, 36px) min(15px + (100vw - 1440px) * 0.0026785714, 18px);
  }
}
.contact__dropdown-list li:last-child {
  padding: 2vw 4vw 5.3333333333vw;
}
@media only screen and (min-width: 767px) {
  .contact__dropdown-list li:last-child {
    padding: min(1.0416666667vw, 15px) min(2.0833333333vw, 30px) min(2.7777777778vw, 40px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__dropdown-list li:last-child {
    padding: min(15px + (100vw - 1440px) * 0.0026785714, 18px) min(30px + (100vw - 1440px) * 0.0053571429, 36px) min(40px + (100vw - 1440px) * 0.0071428571, 48px);
  }
}
.contact__dropdown-list li:hover {
  background: rgba(0, 0, 0, 0.15);
}
.contact button:has(input) .common__button-text {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.contact button:has(input) .common__button-text input {
  width: 100%;
  height: 100%;
  text-align: center;
}
.contact__file-wrapper {
  display: flex;
  flex-direction: column;
  gap: 4vw;
  margin-top: 4vw;
}
@media only screen and (min-width: 767px) {
  .contact__file-wrapper {
    margin-top: 0;
    gap: min(0.6944444444vw, 10px);
    flex-direction: row;
    width: 100%;
  }
}
@media only screen and (min-width: 1440px) {
  .contact__file-wrapper {
    gap: min(10px + (100vw - 1440px) * 0.0017857143, 12px);
  }
}
.contact__file-input {
  display: none;
}
.contact__file-btn {
  display: block;
  background: black;
  color: white;
  border: none;
  padding: 4vw;
  border-radius: 6vw;
  font-size: 4vw;
  font-weight: 700;
  cursor: pointer;
  width: 100%;
  text-align: center;
  box-shadow: 0 1.0666666667vw 0 rgba(0, 0, 0, 0.16);
  transition: all 300ms;
}
@media only screen and (min-width: 767px) {
  .contact__file-btn {
    padding: min(1.3888888889vw, 20px) min(1.3888888889vw, 20px);
    border-radius: min(2.0833333333vw, 30px);
    font-size: min(1.3888888889vw, 20px);
    width: min(8.75vw, 126px);
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(0, 0, 0, 0.16);
  }
  .contact__file-btn:hover {
    transform: scale(0.95);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__file-btn {
    border-radius: min(30px + (100vw - 1440px) * 0.0053571429, 36px);
    padding: min(20px + (100vw - 1440px) * 0.0035714286, 24px) min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    width: min(126px + (100vw - 1440px) * 0.0225, 151.2px);
    box-shadow: 0 min(8px + (100vw - 1440px) * 0.0014285714, 9.6px) 0 rgba(0, 0, 0, 0.16);
  }
}
.contact__file-btn:hover {
  opacity: 0.9;
}
.contact__file-name {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 2.6666666667vw 4vw;
  background: #e2e2e2;
  border-radius: 2.1333333333vw;
  font-size: 4vw;
  min-height: 10.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .contact__file-name {
    padding: min(1.0416666667vw, 15px) min(2.0833333333vw, 30px);
    border-radius: min(0.5555555556vw, 8px);
    font-size: min(1.3888888889vw, 20px);
    min-height: min(4.1666666667vw, 60px);
    width: 100%;
  }
}
@media only screen and (min-width: 1440px) {
  .contact__file-name {
    border-radius: min(8px + (100vw - 1440px) * 0.0014285714, 9.6px);
    padding: min(15px + (100vw - 1440px) * 0.0026785714, 18px) min(30px + (100vw - 1440px) * 0.0053571429, 36px);
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    min-height: min(60px + (100vw - 1440px) * 0.0107142857, 72px);
    width: 100%;
  }
}
.contact__file-remove {
  background: url(../data/webp/contact/close.webp) no-repeat;
  background-size: contain;
  width: 3.7333333333vw;
  height: 3.7333333333vw;
  border: none;
  cursor: pointer;
  color: #999;
  padding: 0;
}
@media only screen and (min-width: 767px) {
  .contact__file-remove {
    width: min(1.3888888889vw, 20px);
    height: min(1.3888888889vw, 20px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__file-remove {
    width: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    height: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
  }
}

.contact__form .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}
.contact__form .wpcf7-response-output {
  margin: 5.3333333333vw auto 0;
  border: none;
  color: red;
  font-size: 3.7333333333vw;
  font-weight: 700;
  text-align: center;
  white-space: pre-line;
}
@media only screen and (min-width: 767px) {
  .contact__form .wpcf7-response-output {
    margin: min(2.0833333333vw, 30px) auto 0;
    border-radius: min(0.5555555556vw, 8px);
    font-size: min(1.25vw, 18px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__form .wpcf7-response-output {
    margin: min(30px + (100vw - 1440px) * 0.0053571429, 36px) auto 0;
    border-radius: min(8px + (100vw - 1440px) * 0.0014285714, 9.6px);
    font-size: min(18px + (100vw - 1440px) * 0.0032142857, 21.6px);
  }
}
.contact__form.sent .contact__form-item,
.contact__form.sent .contact__form-submit,
.contact__form.sent fieldset.hidden-fields-container,
.contact__form.sent .screen-reader-response,
.contact__form.sent .akismet-fields-container {
  display: none;
}
.contact__form.sent .wpcf7-response-output {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 70vh;
  min-height: min(66.6666666667vw, 500px);
  padding: 0;
  gap: 5.3333333333vw;
  background-color: transparent;
  color: #000;
  text-align: center;
  font-size: 3.7333333333vw;
  line-height: 2;
  white-space: pre-line;
}
@media only screen and (max-width: 767px) {
  .contact__form.sent .wpcf7-response-output {
    word-break: keep-all;
  }
}
@media only screen and (min-width: 767px) {
  .contact__form.sent .wpcf7-response-output {
    height: 60vh;
    min-height: min(min(34.7222222222vw, 500px), 500px);
    gap: min(2.7777777778vw, 40px);
    font-size: min(1.1111111111vw, 16px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__form.sent .wpcf7-response-output {
    height: 55vh;
    gap: min(40px + (100vw - 1440px) * 0.0071428571, 48px);
    font-size: min(16px + (100vw - 1440px) * 0.0028571429, 19.2px);
  }
}
.contact__form.sent .wpcf7-response-output::before {
  content: "THANK YOU";
  display: block;
  font-family: "futura-pt-condensed", sans-serif;
  font-weight: 900;
  font-size: 16vw;
  line-height: 1;
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
.contact__form.sent .wpcf7-response-output::before {
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  background-size: 200% 100%;
  animation: gradient-slide 20s linear infinite;
}
@media only screen and (min-width: 767px) {
  .contact__form.sent .wpcf7-response-output::before {
    font-size: min(8.3333vw, 120px);
  }
}
.contact__form [class*=valid-tip] {
  display: block;
  margin-top: 2vw;
  color: red;
  font-size: 3.2vw;
  font-weight: 700;
}
@media only screen and (min-width: 767px) {
  .contact__form [class*=valid-tip] {
    margin-top: min(1.3888888889vw, 20px);
    font-size: min(0.9722222222vw, 14px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__form [class*=valid-tip] {
    margin-top: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    font-size: min(14px + (100vw - 1440px) * 0.0025, 16.8px);
  }
}
.contact__form .wpcf7-select {
  width: 100%;
  padding: 4vw;
  border-radius: 2.1333333333vw;
  background: #fff;
  border: none;
  text-align: left;
  font-size: 4vw;
  font-weight: 700;
  color: #000;
  height: 12vw;
  margin-top: 4vw;
  box-shadow: 0 1.0666666667vw 0 rgba(0, 0, 0, 0.16);
  appearance: none;
  -webkit-appearance: none;
  background-image: url(../data/webp/contact/arrow.webp);
  background-repeat: no-repeat;
  background-position: right 4.2666666667vw center;
  background-size: 4.2666666667vw 2.6666666667vw;
  cursor: pointer;
}
@media only screen and (min-width: 767px) {
  .contact__form .wpcf7-select {
    border-radius: min(0.5555555556vw, 8px);
    padding: min(0.8333333333vw, 12px) min(1.3888888889vw, 20px);
    font-size: min(1.3888888889vw, 20px);
    height: min(4.1666666667vw, 60px);
    line-height: 1.7;
    margin-top: 0;
    background-position: right min(2.0833333333vw, 30px) center;
    background-size: min(1.4583333333vw, 21px) min(0.9722222222vw, 14px);
    box-shadow: 0 min(0.5555555556vw, 8px) 0 rgba(0, 0, 0, 0.16);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__form .wpcf7-select {
    border-radius: min(8px + (100vw - 1440px) * 0.0014285714, 9.6px);
    padding: min(12px + (100vw - 1440px) * 0.0021428571, 14.4px) min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    font-size: min(20px + (100vw - 1440px) * 0.0035714286, 24px);
    height: min(60px + (100vw - 1440px) * 0.0107142857, 72px);
    background-position: right min(30px + (100vw - 1440px) * 0.0053571429, 36px) center;
    background-size: min(21px + (100vw - 1440px) * 0.00375, 25.2px) min(14px + (100vw - 1440px) * 0.0025, 16.8px);
    box-shadow: 0 min(8px + (100vw - 1440px) * 0.0014285714, 9.6px) 0 rgba(0, 0, 0, 0.16);
  }
}
.contact__form .contact__file-wrapper .wpcf7-form-control-wrap {
  display: contents;
}
.contact__form .contact__file-wrapper .wpcf7-file {
  display: none;
}
.contact__form .contact__form-submit {
  margin-top: 10.6666666667vw;
  text-align: center;
}
@media only screen and (min-width: 767px) {
  .contact__form .contact__form-submit {
    margin-top: min(4.1666666667vw, 60px);
  }
}
@media only screen and (min-width: 1440px) {
  .contact__form .contact__form-submit {
    margin-top: min(60px + (100vw - 1440px) * 0.0107142857, 72px);
  }
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
  border-color: transparent;
}

.wpcf7 form.sent .wpcf7-response-output {
  border-color: transparent;
}

body.is-cf7-sent .common__ttl {
  display: none;
}
body.is-cf7-sent .contact {
  margin-top: 0;
  padding-bottom: 0;
}
@media only screen and (max-width: 767px) {
  body.is-cf7-sent .contact__form {
    margin: 0 auto;
    flex-direction: column;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 98vh;
  }
}

.policy {
  position: relative;
  z-index: 2;
  padding-top: 22.6666666667vw;
  padding-bottom: 26.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .policy {
    padding-top: min(8.3333333333vw, 120px);
    padding-bottom: min(6.9444444444vw, 100px);
  }
}
.policy__heading {
  font-size: 8.5333333333vw;
  font-weight: 800;
  width: fit-content;
  margin-inline: auto;
  padding: 0 5.3333333333vw;
  line-height: 1.2;
  text-align: center;
}
@media only screen and (min-width: 767px) {
  .policy__heading {
    font-size: min(4.1666666667vw, 60px);
    max-width: 1160px;
    padding: 0 min(8.3333333333vw, 120px);
  }
}
.policy__inner {
  width: 100%;
  padding: 0 5.3333333333vw;
  margin-top: 13.3333333333vw;
  font-size: 4vw;
  letter-spacing: 0.01em;
  line-height: 1.8666666667;
  margin-inline: auto;
}
@media only screen and (min-width: 767px) {
  .policy__inner {
    max-width: 1160px;
    padding: 0 min(8.3333333333vw, 120px);
    margin-top: min(3.6111111111vw, 52px);
    font-size: min(1.3888888889vw, 20px);
    line-height: 1.8;
  }
}
.policy__title {
  margin-top: 9.8666666667vw;
  font-weight: 700;
  line-height: 1.8666666667;
}
@media only screen and (min-width: 767px) {
  .policy__title {
    margin-top: min(3.3333333333vw, 48px);
  }
}
.policy__text {
  margin-top: 1.3333333333vw;
  font-weight: 400;
}
@media only screen and (min-width: 767px) {
  .policy__text {
    margin-top: min(0.6944444444vw, 10px);
  }
}
.policy__text span {
  display: block;
  padding-left: 1em;
  text-indent: -1em;
}
.policy__text span:nth-child(n+10) {
  padding-left: 1.5em;
  text-indent: -1.5em;
}
.policy__text + p {
  margin-top: 10.6666666667vw;
}
@media only screen and (min-width: 767px) {
  .policy__text + p {
    margin-top: min(3.125vw, 45px);
  }
}

.common {
  animation: gradient-slide-toleft 20s linear infinite;
  background-size: 200% 100%;
}
.common__ttl.scroll {
  transition: all 400ms ease;
  opacity: 0;
  transform: scale(0);
  will-change: opacity, transform;
}
.common__ttl.scroll.js-scroll.js-loadend {
  opacity: 1;
  transform: scale(1);
}
.common__ttl.scroll.js-scroll.js-loadend .common__ttl-thunder {
  display: block;
}
.common__bg-layer1 {
  animation: bg-slide-top-pc 30s linear infinite;
}
.common__bg-layer2 {
  animation: bg-slide-bottom-pc 30s linear infinite;
}
.common__wrapper.scroll {
  transition: all 400ms;
  transition-delay: 200ms;
  transform: translate(0, 4vw);
  will-change: opacity, transform;
}
.common__wrapper.scroll .common__wrapper-inner {
  transition: all 10ms;
  transition-delay: 200ms;
  opacity: 0;
  will-change: opacity;
}
.common__wrapper.scroll.js-scroll.js-loadend {
  transform: translate(0, 0);
}
.common__wrapper.scroll.js-scroll.js-loadend .common__wrapper-inner {
  opacity: 1;
}
@media only screen and (min-width: 767px) {
  .common__btn {
    background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
  }
  .common__btn {
    animation: gradient-slide-small 40s linear infinite;
    background-size: 400% 100%;
  }
}
@media only screen and (min-width: 767px) {
  .common__btn:hover {
    transform: scale(0.98);
  }
}
.common__btn:hover:before {
  display: block;
  content: "";
}
@media only screen and (min-width: 767px) {
  .common__btn:hover:before {
    opacity: 0;
  }
}
@media only screen and (min-width: 767px) {
  .common__btn:hover .common__btn-gradient {
    background: white;
    animation: gradient-slide-small 40s linear infinite, arrow-shiver 0.12s ease-in-out infinite;
    animation-composition: replace, add;
  }
}
@media only screen and (min-width: 767px) {
  .common__btn:hover .common-details__text {
    color: white;
    animation: gradient-slide-small 40s linear infinite, arrow-shiver 0.12s ease-in-out infinite;
    animation-composition: replace, add;
  }
}
@media only screen and (min-width: 767px) {
  .common__btn:hover .common-details__icon {
    background: white;
    animation: gradient-slide-small 40s linear infinite, arrow-shiver 0.12s ease-in-out infinite;
    animation-composition: replace, add;
  }
}
@media only screen and (min-width: 767px) {
  .common__btn.is-black:hover {
    transform: scale(0.98);
  }
}
.common__btn.is-black:hover:before {
  display: block;
  content: "";
}
@media only screen and (min-width: 767px) {
  .common__btn.is-black:hover:before {
    opacity: 0;
  }
}
@media only screen and (min-width: 767px) {
  .common__btn.is-black:hover .common-details__text {
    color: white;
  }
}
@media only screen and (min-width: 767px) {
  .common__btn.is-black:hover .common-details__icon {
    background: white;
  }
}
@media only screen and (min-width: 767px) {
  .common__btn.is-black[target=_blank]:hover .common-details__icon {
    background: white;
  }
}
@media only screen and (min-width: 767px) {
  .common__btn[target=_blank]:hover .common-details__icon {
    background: white;
    animation: gradient-slide-small 40s linear infinite, arrow-shiver 0.12s ease-in-out infinite;
    animation-composition: replace, add;
  }
}
.common__btn .common-details__text {
  transition: all 300ms ease-in;
  animation: gradient-slide-small 40s linear infinite;
  background-size: 400% 100%;
}
.common__btn .common-details__icon {
  transition: all 300ms ease-in;
  animation: gradient-slide-small 40s linear infinite;
  background-size: 400% 100%;
}
.common__btn-gradient {
  transition: all 300ms ease-in;
  animation: gradient-slide-small 40s linear infinite;
  background-size: 400% 100%;
}
.common-details__yt .is-icon {
  transition: all 300ms;
  background: white;
  animation: gradient-extrasmall 80s linear infinite;
}
.common-details__yt .is-icon:before {
  display: block;
  content: "";
  transition: all 300ms;
  will-change: opacity;
}
.common-details__yt .is-icon:after {
  display: block;
  content: "";
  transition: all 300ms;
  animation: gradient-extrasmall 80s linear infinite;
}
.common-details__yt:hover .is-icon {
  background: linear-gradient(90deg, #3019ff 0%, #3019ff 2%, #fc3231 12.25%, #fc3231 14.25%, #ffbd18 24.5%, #ffbd18 26.5%, #fc3231 36.75%, #fc3231 38.75%, #f742fd 49%, #f742fd 51%, #fc3231 61.25%, #fc3231 63.25%, #ffbd18 73.5%, #ffbd18 75.5%, #fc3231 85.75%, #fc3231 87.75%, #3019ff 98%, #3019ff 100%);
}
.common-details__yt:hover .is-icon {
  background-size: 800% 100%;
}
.common-details__yt:hover .is-icon:before {
  display: block;
  content: "";
}
@media only screen and (min-width: 767px) {
  .common-details__yt:hover .is-icon:before {
    opacity: 0;
  }
}
.common-details__yt:hover .is-icon:after {
  display: block;
  content: "";
}
@media only screen and (min-width: 767px) {
  .common-details__yt:hover .is-icon:after {
    background: white;
    animation: gradient-extrasmall 80s linear infinite, arrow-shiver 0.12s ease-in-out infinite;
    animation-composition: replace, add;
  }
}
.common__circle.scroll {
  transition: all 400ms ease;
  opacity: 0;
  transform: scale(0);
  will-change: opacity, transform;
}
.common__circle.scroll.js-scroll.js-loadend {
  opacity: 1;
  transform: scale(1);
}
@media only screen and (min-width: 767px) {
  .common__circle.scroll.js-scroll.js-loadend {
    transform: scale(1);
  }
  .common__circle.scroll.js-scroll.js-loadend:hover {
    transform: scale(0.98);
  }
}
.common__circle.is-recruit.scroll {
  transition: all 400ms ease;
  opacity: 0;
  transform: translateX(-50%) scale(0);
  will-change: opacity, transform;
}
@media only screen and (min-width: 767px) {
  .common__circle.is-recruit.scroll {
    transform: translateX(0) scale(0);
  }
}
.common__circle.is-recruit.scroll.js-scroll.js-loadend {
  opacity: 1;
  transform: translateX(-50%) scale(1);
}
@media only screen and (min-width: 767px) {
  .common__circle.is-recruit.scroll.js-scroll.js-loadend {
    transform: translateX(0) scale(1);
  }
  .common__circle.is-recruit.scroll.js-scroll.js-loadend:hover {
    transform: scale(0.98);
  }
}
.common__circle-gradient {
  animation: gradient-slide-small 40s linear infinite;
  background-size: 400% 100%;
}
.common__circle-arrow {
  animation: rotate-clockwise 40s linear infinite;
}
.common__circle:hover .common__circle-arrow {
  animation: rotate-clockwise 40s linear infinite, arrow-shiver 0.12s ease-in-out infinite;
  animation-composition: replace, add;
}
@media only screen and (min-width: 767px) {
  .common-contact__slide:hover .common-contact__slide-white {
    animation: contact-slide-right-pc 3s linear infinite, arrow-shiver 0.12s ease-in-out infinite;
    animation-composition: replace, add;
  }
}
@media only screen and (min-width: 767px) {
  .common-contact__slide:hover .common-contact__slide-white.is-second {
    animation-delay: -1.5s;
  }
}
@media only screen and (min-width: 767px) {
  .common-contact__slide:hover .common-contact__slide-gradient {
    transform: translateY(-50%) scale(0.98);
  }
}
.common-contact__slide-gradient {
  animation: contact-slide-gradient 20s linear infinite, gradient-slide-small 80s linear infinite;
  animation-composition: replace, add;
  background-size: 400% 100%;
}
@media only screen and (min-width: 767px) {
  .common-contact__slide-gradient {
    animation: contact-slide-gradient-pc 20s linear infinite, gradient-slide-small 80s linear infinite;
    animation-composition: replace, add;
  }
}
.common-contact__slide-white {
  animation: contact-slide-right 3s linear infinite;
}
@media only screen and (min-width: 767px) {
  .common-contact__slide-white {
    animation: contact-slide-right-pc 3s linear infinite;
  }
}
.common-contact__slide-white.is-second {
  animation-delay: -1.5s;
}

@keyframes gradient-extrasmall {
  0% {
    background-position: 800% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@keyframes gradient-slide-toleft {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 200% 50%;
  }
}
@keyframes gradient-slide-toright {
  0% {
    background-position: 200% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@keyframes bg-slide-top-pc {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 0 12.2916666667vw;
  }
}
@keyframes bg-slide-bottom-pc {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 0 -12.2916666667vw;
  }
}
@keyframes contact-slide-right {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 22.8vw 0;
  }
}
@keyframes contact-slide-right-pc {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: min(11.875vw, 171px) 0;
  }
}
@keyframes contact-slide-gradient {
  0% {
    mask-position: 0 0;
  }
  100% {
    mask-position: -82.1333333333vw 0;
  }
}
@keyframes contact-slide-gradient-pc {
  0% {
    mask-position: 0 0;
  }
  100% {
    mask-position: max(-42.7777777778vw, -616px) 0;
  }
}
.loading {
  transition: all 800ms ease;
  will-change: opacity;
}
.loading.js-hide {
  opacity: 0;
  pointer-events: none;
}
.loading__logo-layer {
  animation: gradient-slide-small 30s linear infinite;
}
.loading__logo-layer:nth-child(1) .loading__logo-text {
  animation: loading-text-top 10s linear infinite, gradient-slide-small 30s linear infinite;
  animation-composition: replace, add;
}
@media only screen and (min-width: 767px) {
  .loading__logo-layer:nth-child(1) .loading__logo-text {
    animation: loading-text-top-pc 10s linear infinite, gradient-slide-small 30s linear infinite;
  }
}
.loading__logo-layer:nth-child(2) .loading__logo-text {
  animation: loading-text-right 10s linear infinite, gradient-slide-small 30s linear infinite;
  animation-composition: replace, add;
}
@media only screen and (min-width: 767px) {
  .loading__logo-layer:nth-child(2) .loading__logo-text {
    animation: loading-text-right-pc 10s linear infinite, gradient-slide-small 30s linear infinite;
  }
}
.loading__logo-layer:nth-child(3) .loading__logo-text {
  animation: loading-text-bottom 10s linear infinite, gradient-slide-small 30s linear infinite;
  animation-composition: replace, add;
}
@media only screen and (min-width: 767px) {
  .loading__logo-layer:nth-child(3) .loading__logo-text {
    animation: loading-text-bottom-pc 10s linear infinite, gradient-slide-small 30s linear infinite;
  }
}
.loading__logo-layer:nth-child(4) .loading__logo-text {
  animation: loading-text-left 10s linear infinite, gradient-slide-small 30s linear infinite;
  animation-composition: replace, add;
}
@media only screen and (min-width: 767px) {
  .loading__logo-layer:nth-child(4) .loading__logo-text {
    animation: loading-text-left-pc 10s linear infinite, gradient-slide-small 30s linear infinite;
  }
}

@keyframes loading-text-top {
  0% {
    mask-position: 0 0;
  }
  100% {
    mask-position: 14.8vw 0;
  }
}
@keyframes loading-text-top-pc {
  0% {
    mask-position: 0 0;
  }
  100% {
    mask-position: 7.7083333333vw 0;
  }
}
@keyframes loading-text-right {
  0% {
    mask-position: 0 0;
  }
  100% {
    mask-position: 0 14.8vw;
  }
}
@keyframes loading-text-right-pc {
  0% {
    mask-position: 0 0;
  }
  100% {
    mask-position: 0 7.7083333333vw;
  }
}
@keyframes loading-text-bottom {
  0% {
    mask-position: 0 0;
  }
  100% {
    mask-position: -14.8vw 0;
  }
}
@keyframes loading-text-bottom-pc {
  0% {
    mask-position: 0 0;
  }
  100% {
    mask-position: -7.7083333333vw 0;
  }
}
@keyframes loading-text-left {
  0% {
    mask-position: 0 0;
  }
  100% {
    mask-position: 0 -14.8vw;
  }
}
@keyframes loading-text-left-pc {
  0% {
    mask-position: 0 0;
  }
  100% {
    mask-position: 0 -7.7083333333vw;
  }
}
.top-kv__logo-glitch {
  animation: gradient-slide-small 40s linear infinite;
  background-size: 400% 100%;
}
.top-kv__slide.scroll {
  transition: all 400ms ease;
  transform: translate(0, 100%);
  will-change: opacity, transform;
}
.top-kv__slide.scroll.is-reverse {
  transform: translate(0, -100%);
}
.top-kv__slide.scroll.js-loadend {
  transform: translate(0, 0);
}
.top-kv__slide {
  animation: kv-slide-right 14s linear infinite;
}
@media only screen and (min-width: 767px) {
  .top-kv__slide {
    animation: kv-slide-right-pc 14s linear infinite;
  }
}
.top-kv__slide.is-reverse {
  animation: kv-slide-left 14s linear infinite;
}
@media only screen and (min-width: 767px) {
  .top-kv__slide.is-reverse {
    animation: kv-slide-left-pc 14s linear infinite;
  }
}
.top-about__inner.scroll .top-about__inner-text {
  transition: all 250ms linear;
  opacity: 0;
  transform: translate(-200%, 0);
  will-change: opacity, transform;
}
.top-about__inner.scroll .top-about__inner-text:nth-child(1) {
  transition-delay: 250ms;
}
.top-about__inner.scroll .top-about__inner-text:nth-child(2) {
  transition-delay: 300ms;
}
.top-about__inner.scroll .top-about__inner-text:nth-child(3) {
  transition-delay: 350ms;
}
.top-about__inner.scroll .top-about__inner-text:nth-child(4) {
  transition-delay: 350ms;
}
.top-about__inner.scroll .top-about__inner-text:nth-child(5) {
  transition-delay: 400ms;
}
.top-about__inner.scroll .top-about__main-wrapper {
  transition: all 100ms;
  opacity: 0;
  transform: scale(1.5);
  will-change: opacity, transform;
}
.top-about__inner.scroll .top-about__main-wrapper:nth-child(1) {
  transition-delay: 350ms;
}
.top-about__inner.scroll .top-about__main-wrapper:nth-child(2) {
  transition-delay: 400ms;
}
.top-about__inner.scroll .top-about__main-wrapper:nth-child(3) {
  transition-delay: 450ms;
}
.top-about__inner.scroll .top-about__main-wrapper:nth-child(4) {
  transition-delay: 500ms;
}
.top-about__inner.scroll .top-about__main-wrapper:nth-child(5) {
  transition-delay: 550ms;
}
.top-about__inner.scroll.js-scroll .top-about__inner-text {
  opacity: 1;
  transform: translate(0, 0);
}
.top-about__inner.scroll.js-scroll .top-about__main-wrapper {
  opacity: 1;
  transform: scale(1);
}
.top-about__inner.scroll.js-scroll .top-about__main-wrapper:nth-child(1) .top-about__main-layer {
  animation: gradient-slide-toright 40s linear infinite, arrow-shiver 0.12s 400ms ease-in-out infinite;
  animation-composition: replace, add;
}
.top-about__inner.scroll.js-scroll .top-about__main-wrapper:nth-child(2) .top-about__main-layer {
  animation: gradient-slide-toright 40s linear infinite, arrow-shiver 0.12s 500ms ease-in-out infinite;
  animation-composition: replace, add;
}
.top-about__inner.scroll.js-scroll .top-about__main-wrapper:nth-child(3) .top-about__main-layer {
  animation: gradient-slide-toright 40s linear infinite, arrow-shiver 0.12s 600ms ease-in-out infinite;
  animation-composition: replace, add;
}
.top-about__inner.scroll.js-scroll .top-about__main-wrapper:nth-child(4) .top-about__main-layer {
  animation: gradient-slide-toright 40s linear infinite, arrow-shiver 0.12s 700ms ease-in-out infinite;
  animation-composition: replace, add;
}
.top-about__inner.scroll.js-scroll .top-about__main-wrapper:nth-child(5) .top-about__main-layer {
  animation: gradient-slide-toright 40s linear infinite, arrow-shiver 0.12s 800ms ease-in-out infinite;
  animation-composition: replace, add;
}
.top-about__content.scroll .top-about__content-layer {
  transition: all 250ms linear;
  transform: translate(-200%, 32%);
  will-change: opacity, transform;
}
.top-about__content.scroll .top-about__content-layer:nth-child(1) {
  transition-delay: 300ms;
}
.top-about__content.scroll .top-about__content-layer:nth-child(2) {
  transition-delay: 350ms;
}
.top-about__content.scroll .top-about__content-layer:nth-child(4) {
  transition-delay: 400ms;
}
.top-about__content.scroll .top-about__content-layer:nth-child(5) {
  transition-delay: 450ms;
}
.top-about__content.scroll .top-about__main-wrapper {
  transition: all 100ms;
  opacity: 0;
  transform: scale(2);
  will-change: opacity, transform;
}
.top-about__content.scroll .top-about__main-wrapper:nth-child(1) {
  transition-delay: 350ms;
}
.top-about__content.scroll .top-about__main-wrapper:nth-child(2) {
  transition-delay: 400ms;
}
.top-about__content.scroll .top-about__main-wrapper:nth-child(3) {
  transition-delay: 450ms;
}
.top-about__content.scroll .top-about__main-wrapper:nth-child(4) {
  transition-delay: 500ms;
}
.top-about__content.scroll .top-about__main-wrapper:nth-child(5) {
  transition-delay: 550ms;
}
.top-about__content.scroll.js-scroll .top-about__content-layer {
  opacity: 1;
  transform: translate(0, 0);
}
.top-about__content.scroll.js-scroll .top-about__main-wrapper {
  opacity: 1;
  transform: scale(1);
}
.top-about__content.scroll.js-scroll .top-about__main-wrapper:nth-child(1) .top-about__main-layer {
  animation: gradient-slide-toright 40s linear infinite, arrow-shiver 0.12s 400ms ease-in-out infinite;
  animation-composition: replace, add;
}
.top-about__content.scroll.js-scroll .top-about__main-wrapper:nth-child(2) .top-about__main-layer {
  animation: gradient-slide-toright 40s linear infinite, arrow-shiver 0.12s 500ms ease-in-out infinite;
  animation-composition: replace, add;
}
.top-about__content.scroll.js-scroll .top-about__main-wrapper:nth-child(3) .top-about__main-layer {
  animation: gradient-slide-toright 40s linear infinite, arrow-shiver 0.12s 600ms ease-in-out infinite;
  animation-composition: replace, add;
}
.top-about__content.scroll.js-scroll .top-about__main-wrapper:nth-child(4) .top-about__main-layer {
  animation: gradient-slide-toright 40s linear infinite, arrow-shiver 0.12s 700ms ease-in-out infinite;
  animation-composition: replace, add;
}
.top-about__content.scroll.js-scroll .top-about__main-wrapper:nth-child(5) .top-about__main-layer {
  animation: gradient-slide-toright 40s linear infinite, arrow-shiver 0.12s 800ms ease-in-out infinite;
  animation-composition: replace, add;
}
.top-about__chara.scroll {
  transition: all 300ms 400ms ease;
  opacity: 0;
  transform: translate3d(0, 0, 0);
  will-change: transform, opacity;
}
.top-about__chara.scroll.js-scroll.js-loadend {
  animation: bounceIn 0.4s 0.2s forwards;
}
.top-goods__base.scroll {
  transition: all 400ms ease;
  opacity: 0;
  transform: scale(0);
  will-change: opacity, transform;
}
.top-goods__base.scroll .top-goods__layer {
  transition: all 400ms ease;
  opacity: 0;
  transform: scale(0);
  will-change: opacity, transform;
}
.top-goods__base.scroll.js-scroll {
  opacity: 1;
  transform: scale(1);
}
.top-goods__base.scroll.js-scroll .top-goods__layer {
  opacity: 1;
  transform: scale(1);
  animation: floating 3s ease-in-out infinite;
}
.top-goods__base.scroll.js-scroll .top-goods__layer:nth-child(1) {
  animation-delay: 0s;
}
.top-goods__base.scroll.js-scroll .top-goods__layer:nth-child(2) {
  animation-delay: 0.1s;
}
.top-goods__base.scroll.js-scroll .top-goods__layer:nth-child(3) {
  animation-delay: 0.3s;
}
.top-goods__base.scroll.js-scroll .top-goods__layer:nth-child(4) {
  animation-delay: 0.5s;
}
.top-goods__base.scroll.js-scroll .top-goods__layer:nth-child(5) {
  animation-delay: 0.9s;
}
.top-recruit__content.scroll .top-recruit__base {
  transition: all 400ms ease;
  opacity: 0;
  transform: translate(-50%, 8%);
  will-change: opacity, transform;
  transition-delay: 50ms;
}
.top-recruit__content.scroll .top-recruit__layer {
  transition: all 400ms ease;
  opacity: 0;
  transform: translate(-50%, 8%);
  will-change: opacity, transform;
}
.top-recruit__content.scroll .top-recruit__layer:nth-child(2) {
  transition-delay: 100ms;
}
.top-recruit__content.scroll .top-recruit__layer:nth-child(4) {
  transition-delay: 150ms;
}
.top-recruit__content.scroll .top-recruit__layer:nth-child(5) {
  transition-delay: 200ms;
}
.top-recruit__content.scroll.js-scroll .top-recruit__base {
  opacity: 1;
  transform: translate(0, 0);
}
.top-recruit__content.scroll.js-scroll .top-recruit__layer {
  opacity: 1;
  transform: scale(1);
}
.top-recruit__content.scroll.js-scroll .top-recruit__layer:nth-child(2) {
  opacity: 1;
  transform: translate(0, 0);
}
.top-recruit__content.scroll.js-scroll .top-recruit__layer:nth-child(3) {
  opacity: 1;
  transform: translate(0, 0);
}
.top-recruit__content.scroll.js-scroll .top-recruit__layer:nth-child(3) {
  opacity: 1;
  transform: translate(0, 0);
}
.top-about__main-layer {
  animation: gradient-slide-toright 40s linear infinite;
  background-size: 200% 100%;
}
.top-news__item-arrow {
  animation: gradient-slide-small 40s linear infinite;
  background-size: 400% 100%;
}
.top-about__stone {
  --top-about-stone-parallax-y: 0px;
}
.top-about__stone.scroll {
  transform: translate3d(-50%, var(--top-about-stone-parallax-y), 0);
  will-change: transform;
}
.top-goods__stone {
  --top-goods-stone-parallax-y: 0px;
}
.top-goods__stone.scroll {
  transform: translate3d(-50%, var(--top-goods-stone-parallax-y), 0);
  will-change: transform;
}
.top-recruit__stone {
  --top-recruit-stone-parallax-y: 0px;
}
.top-recruit__stone.scroll {
  transform: translate3d(-50%, var(--top-recruit-stone-parallax-y), 0);
  will-change: transform;
}

@keyframes kv-slide-right {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 90.4vw 0;
  }
}
@keyframes kv-slide-right-pc {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 47.0833333333vw 0;
  }
}
@keyframes kv-slide-left {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -90.4vw 0;
  }
}
@keyframes kv-slide-left-pc {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -47.0833333333vw 0;
  }
}
@keyframes gradient-slide-small {
  0% {
    background-position: 400% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@keyframes rotate-clockwise {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes arrow-shiver {
  0%, 100% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(1px, 0);
  }
  50% {
    transform: translate(-1px, -1px);
  }
  75% {
    transform: translate(0, 1px);
  }
}
@keyframes floating {
  0%, 100% {
    transform: scale(1) translateY(0);
  }
  50% {
    transform: scale(1) translateY(-10px);
  }
}
@keyframes bounceIn {
  0% {
    transform: translate3d(0, 0, 0) scale3d(0, 0, 1);
    opacity: 0; /* Optional: fades in while scaling */
  }
  60% {
    transform: translate3d(0, 0, 0) scale3d(1.15, 1.15, 1); /* Overshoot past 1 */
  }
  80% {
    transform: translate3d(0, 0, 0) scale3d(0.95, 0.95, 1); /* Drop slightly below 1 */
  }
  100% {
    transform: translate3d(0, 0, 0) scale3d(1, 1, 1); /* Settle at final size */
    opacity: 1;
  }
}
@media only screen and (min-width: 767px) {
  .top-news__list.scroll .top-news__list-item {
    transition-property: opacity, transform;
    transition-duration: 200ms, 400ms;
    transition-timing-function: ease;
    transform: translate(0, 10vw);
    opacity: 0;
    will-change: transform, opacity;
  }
}
@media only screen and (min-width: 767px) {
  .top-news__list.scroll .top-news__list-item:nth-child(5n+1) {
    transition-delay: 100ms, 150ms;
  }
}
@media only screen and (min-width: 767px) {
  .top-news__list.scroll .top-news__list-item:nth-child(5n+2) {
    transition-delay: 200ms, 250ms;
  }
}
@media only screen and (min-width: 767px) {
  .top-news__list.scroll .top-news__list-item:nth-child(5n+3) {
    transition-delay: 300ms, 350ms;
  }
}
@media only screen and (min-width: 767px) {
  .top-news__list.scroll .top-news__list-item:nth-child(5n+4) {
    transition-delay: 400ms, 450ms;
  }
}
@media only screen and (min-width: 767px) {
  .top-news__list.scroll .top-news__list-item:nth-child(5n) {
    transition-delay: 500ms, 550ms;
  }
}
.top-news__list-item.scroll {
  transition-property: opacity, transform;
  transition-duration: 200ms, 400ms;
  transition-timing-function: ease;
  transition-delay: 0ms, 50ms;
  transform: translate(0, 20vw);
  opacity: 0;
  will-change: transform, opacity;
}
.top-news__list-item.scroll.js-scroll {
  transform: translate(0, 0);
  opacity: 1;
}
.top-news__item {
  transition: all 300ms;
}
.top-news__item:hover {
  transform: scale(0.98);
}
.top-news__item:hover .top-news__item-arrow {
  animation: gradient-slide-small 40s linear infinite, arrow-shiver 0.12s ease-in-out infinite;
  animation-composition: replace, add;
}
.top-news__item-arrow {
  animation: gradient-slide-small 40s linear infinite;
  background-size: 400% 100%;
}

.header {
  animation: gradient-slide 20s linear infinite;
  background-size: 200% 100%;
}
.header.scroll {
  transition: all 400ms ease;
  transform: translate(-50%, -100%);
  will-change: opacity, transform;
}
.header.scroll.js-scroll.js-loadend {
  transform: translate(-50%, 0);
}
.header__logo-gradient {
  animation: gradient-slide 20s linear infinite;
  background-size: 200% 100%;
}
.header__cart {
  animation: gradient-slide-small 20s linear infinite;
  background-size: 400% 100%;
}

@keyframes gradient-slide {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 200% 50%;
  }
}
.footer__pagetop {
  animation: gradient-slide 10s linear infinite;
  background-size: 400% 100%;
}
.footer__pagetop:hover {
  animation: gradient-slide 10s linear infinite, arrow-shiver 0.12s ease-in-out infinite;
  animation-composition: replace, add;
}

@keyframes gradient-slide {
  0% {
    background-position: 200% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
.about__ip-track {
  will-change: transform;
  animation: ip-marquee-right 240s linear infinite;
}
.about__ip-list:nth-child(2n) .about__ip-track {
  animation-name: ip-marquee-left;
}
.about__ip.js-ip-paused .about__ip-track {
  animation-play-state: paused;
  will-change: auto;
}
.about__main-track {
  will-change: transform;
  animation: kv-marquee-right 20s linear infinite;
}
.about__slider {
  position: relative;
  overflow: hidden;
  background-size: 0 0;
}
.about__slider:before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: calc(100% + 76.8vw);
  background-image: inherit;
  background-repeat: repeat-x;
  background-size: 76.8vw 15.7333333333vw;
  will-change: transform;
  animation: concept-marquee 40s linear infinite;
}
@media only screen and (min-width: 767px) {
  .about__slider:before {
    width: calc(100% + min(60.7638888889vw, 875px));
    background-size: min(60.7638888889vw, 875px) min(12.5vw, 180px);
    animation: concept-marquee-pc 40s linear infinite;
  }
}
.about__concept-title {
  animation: gradient-slide 40s linear infinite;
  background-size: 200% 100%;
}
.about__address-title {
  animation: gradient-slide 40s linear infinite;
  background-size: 200% 100%;
}
.about__kv-layer[data-scroll-one] .about__kv-layer--k1 {
  transition: all 200ms linear;
  opacity: 0;
  transform: translate(-200%, 0);
  will-change: opacity, transform;
}
.about__kv-layer[data-scroll-one] .about__kv-layer--k2 {
  transition: all 200ms linear;
  opacity: 0;
  transform: translate(-200%, 0);
  will-change: opacity, transform;
  transition-delay: 100ms;
}
.about__kv-layer[data-scroll-one] .about__kv-layer--g1 {
  transition: all 200ms;
  opacity: 0;
  transform: scale(1.5);
  will-change: opacity, transform;
  transition-delay: 200ms;
}
.about__kv-layer[data-scroll-one] .about__kv-layer--g2 {
  transition: all 200ms;
  opacity: 0;
  transform: scale(1.5);
  will-change: opacity, transform;
  transition-delay: 300ms;
}
.about__kv-layer[data-scroll-one] .about__kv-chara, .about__kv-layer[data-scroll-one] .about__kv-shadow {
  opacity: 0;
  transform: translate3d(0, 0, 0);
  will-change: transform, opacity;
}
.about__kv-layer[data-scroll-one].js-scroll .about__kv-layer--k1, .about__kv-layer[data-scroll-one].js-scroll .about__kv-layer--k2 {
  opacity: 1;
  transform: translate(0, 0);
}
.about__kv-layer[data-scroll-one].js-scroll .about__kv-layer--g1, .about__kv-layer[data-scroll-one].js-scroll .about__kv-layer--g2 {
  opacity: 1;
  transform: scale(1);
}
.about__kv-layer[data-scroll-one].js-scroll .about__kv-layer--g1 {
  animation: arrow-shiver 0.12s 600ms ease-in-out infinite;
}
.about__kv-layer[data-scroll-one].js-scroll .about__kv-layer--g2 {
  animation: arrow-shiver 0.12s 700ms ease-in-out infinite;
}
.about__kv-layer[data-scroll-one].js-scroll .about__kv-chara, .about__kv-layer[data-scroll-one].js-scroll .about__kv-shadow {
  animation: bounceIn 0.4s 0.2s forwards;
}
.about__kv-layer[data-scroll-one].js-scroll.js-loadend .about__kv-layer--g1 {
  animation: arrow-shiver 0.12s 600ms ease-in-out infinite;
}
.about__kv-layer[data-scroll-one].js-scroll.js-loadend .about__kv-layer--g2 {
  animation: arrow-shiver 0.12s 700ms ease-in-out infinite;
}
.about__kv-layer[data-scroll-one].js-scroll.js-loadend .about__kv-chara, .about__kv-layer[data-scroll-one].js-scroll.js-loadend .about__kv-shadow {
  animation: bounceIn 0.4s 0.4s forwards;
}
.about__concept-visual.scroll .about__concept-visual--c1.about__concept-visual--layer4 {
  opacity: 0;
  transform: translate3d(0, 0, 0);
  will-change: transform, opacity;
}
.about__concept-visual.scroll .about__concept-visual--c2.about__concept-visual--layer1 {
  opacity: 0;
  transform: translate3d(0, 0, 0);
  will-change: transform, opacity;
}
.about__concept-visual.scroll .about__concept-visual--c2.about__concept-visual--layer4 {
  opacity: 0;
  transform: translate3d(0, 0, 0);
  will-change: transform, opacity;
}
.about__concept-visual.scroll.js-scroll.js-loadend .about__concept-visual--c1.about__concept-visual--layer4 {
  animation: bounceIn 0.4s 0.1s forwards;
}
.about__concept-visual.scroll.js-scroll.js-loadend .about__concept-visual--c2.about__concept-visual--layer1 {
  animation: bounceIn 0.4s 0.1s forwards;
}
.about__concept-visual.scroll.js-scroll.js-loadend .about__concept-visual--c2.about__concept-visual--layer4 {
  animation: bounceIn 0.4s 0.2s forwards;
}
.about__concept-box.scroll .about__concept-subhead {
  transition-property: opacity, transform;
  transition-duration: 200ms, 400ms;
  transition-timing-function: ease;
  transition-delay: 100ms, 50ms;
  transform: translate(0, 8vw);
  opacity: 0;
  will-change: transform, opacity;
}
.about__concept-box.scroll .about__concept-title, .about__concept-box.scroll .about__concept-subtitle {
  transition-property: opacity, transform;
  transition-duration: 200ms, 400ms;
  transition-timing-function: ease;
  transition-delay: 200ms, 250ms;
  transform: translate(0, 8vw);
  opacity: 0;
  will-change: transform, opacity;
}
.about__concept-box.scroll .about__concept-text {
  transition-property: opacity, transform;
  transition-duration: 200ms, 400ms;
  transition-timing-function: ease;
  transition-delay: 300ms, 350ms;
  transform: translate(0, 8vw);
  opacity: 0;
  will-change: transform, opacity;
}
.about__concept-box.scroll.js-scroll.js-loadend .about__concept-text, .about__concept-box.scroll.js-scroll.js-loadend .about__concept-title, .about__concept-box.scroll.js-scroll.js-loadend .about__concept-subtitle, .about__concept-box.scroll.js-scroll.js-loadend .about__concept-subhead {
  transform: translate(0, 0);
  opacity: 1;
}
.about__kv-stone {
  --about-kv-stone-parallax-y: 0px;
}
.about__kv-stone.scroll {
  transform: translate3d(0, var(--about-kv-stone-parallax-y), 0);
  will-change: transform;
}
.about__concept-stone {
  --about-concept-stone-parallax-y: 0px;
}
.about__concept-stone.scroll {
  transform: translate3d(0, var(--about-concept-stone-parallax-y), 0);
  will-change: transform;
}

@keyframes ip-marquee-right {
  from {
    transform: translate3d(-50%, 0, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes ip-marquee-left {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-50%, 0, 0);
  }
}
@keyframes kv-marquee-right {
  from {
    transform: translate3d(-200%, 0, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes concept-marquee {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(calc(-1 * 76.8vw), 0, 0);
  }
}
@keyframes concept-marquee-pc {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(calc(-1 * min(60.7638888889vw, 875px)), 0, 0);
  }
}
@keyframes gradient-translate {
  from {
    transform: translate3d(-50%, 0, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@media only screen and (min-width: 767px) {
  .news__list.scroll .news__list-item {
    transition-property: opacity, transform;
    transition-duration: 200ms, 400ms;
    transition-timing-function: ease;
    transform: translate(0, 10vw);
    opacity: 0;
    will-change: transform, opacity;
  }
}
.news__list.scroll .news__list-item:nth-child(2n+1) {
  transition-delay: 100ms, 150ms;
}
@media only screen and (min-width: 767px) {
  .news__list.scroll .news__list-item:nth-child(2n+1) {
    transition-delay: auto;
  }
}
.news__list.scroll .news__list-item:nth-child(2n+2) {
  transition-delay: 200ms, 250ms;
}
@media only screen and (min-width: 767px) {
  .news__list.scroll .news__list-item:nth-child(2n+2) {
    transition-delay: auto;
  }
}
@media only screen and (min-width: 767px) {
  .news__list.scroll .news__list-item:nth-child(5n+1) {
    transition-delay: 100ms, 150ms;
  }
}
@media only screen and (min-width: 767px) {
  .news__list.scroll .news__list-item:nth-child(5n+2) {
    transition-delay: 200ms, 250ms;
  }
}
@media only screen and (min-width: 767px) {
  .news__list.scroll .news__list-item:nth-child(5n+3) {
    transition-delay: 300ms, 350ms;
  }
}
@media only screen and (min-width: 767px) {
  .news__list.scroll .news__list-item:nth-child(5n+4) {
    transition-delay: 400ms, 450ms;
  }
}
@media only screen and (min-width: 767px) {
  .news__list.scroll .news__list-item:nth-child(5n) {
    transition-delay: 500ms, 550ms;
  }
}
.news__list-item.scroll {
  transition-property: opacity, transform;
  transition-duration: 200ms, 400ms;
  transition-timing-function: ease;
  transition-delay: 0ms, 50ms;
  transform: translate(0, 20vw);
  opacity: 0;
  will-change: transform, opacity;
}
.news__list-item.scroll.js-scroll.js-loadend {
  transform: translate(0, 0);
  opacity: 1;
}
.news__item {
  transition: all 300ms;
}
.news__item:hover {
  transform: scale(0.98);
}
.news__item:hover .news__item-arrow {
  animation: gradient-slide-small 40s linear infinite, arrow-shiver 0.12s ease-in-out infinite;
  animation-composition: replace, add;
}
.news__item-arrow {
  animation: gradient-slide-small 40s linear infinite;
  background-size: 400% 100%;
}

@media only screen and (min-width: 767px) {
  .works__list.scroll .works__list-item {
    transition-property: opacity, transform;
    transition-duration: 200ms, 400ms;
    transition-timing-function: ease;
    transform: translate(0, 10vw);
    opacity: 0;
    will-change: transform, opacity;
  }
}
@media only screen and (min-width: 767px) {
  .works__list.scroll .works__list-item:nth-child(3n+1) {
    transition-delay: 100ms, 150ms;
  }
}
@media only screen and (min-width: 767px) {
  .works__list.scroll .works__list-item:nth-child(3n+2) {
    transition-delay: 200ms, 250ms;
  }
}
@media only screen and (min-width: 767px) {
  .works__list.scroll .works__list-item:nth-child(3n+3) {
    transition-delay: 300ms, 350ms;
  }
}
.works__list-item.scroll {
  transition-property: opacity, transform;
  transition-duration: 200ms, 400ms;
  transition-timing-function: ease;
  transition-delay: 0ms, 50ms;
  transform: translate(0, 20vw);
  opacity: 0;
  will-change: transform, opacity;
}
.works__list-item.scroll.js-scroll.js-loadend {
  transform: translate(0, 0);
  opacity: 1;
}
.works__list-item:hover {
  transform: scale(0.98);
}
.works__list-item:hover .news__item-arrow {
  animation: gradient-slide-small 40s linear infinite, arrow-shiver 0.12s ease-in-out infinite;
  animation-composition: replace, add;
}
.works__list-item-arrow {
  animation: gradient-slide-small 40s linear infinite;
  background-size: 400% 100%;
}
.works__item {
  transition: all 300ms;
}
.works__item:hover {
  transform: scale(0.98);
}
.works__item:hover .works__item-arrow {
  animation: gradient-slide-small 40s linear infinite, arrow-shiver 0.12s ease-in-out infinite;
  animation-composition: replace, add;
}
.works__item.is-comingsoon:hover .works__item-arrow {
  animation: gradient-slide-small 40s linear infinite;
}
.works__item-arrow {
  animation: gradient-slide-small 40s linear infinite;
  background-size: 400% 100%;
}

@keyframes gradient-slide-small {
  0% {
    background-position: 400% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@keyframes arrow-shiver {
  0%, 100% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(1px, 0);
  }
  50% {
    transform: translate(-1px, -1px);
  }
  75% {
    transform: translate(0, 1px);
  }
}
.modal.js-show {
  pointer-events: auto;
}
.modal.js-show .modal__item {
  pointer-events: auto;
}
.modal.js-show.js-scroll.js-loadend {
  opacity: 1;
  transition: opacity 400ms ease;
}
.modal {
  opacity: 0;
  pointer-events: none;
  transition: opacity 600ms ease;
}
.modal .modal__item {
  pointer-events: none;
}

.modal {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  overscroll-behavior-y: contain;
}
.modal.js-show .modal__close {
  pointer-events: all;
}
.modal__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  mix-blend-mode: screen;
}
.modal__bg:before {
  display: block;
  content: "";
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.3;
  background: linear-gradient(90deg, #f742fd 0%, #fc3231 27%, #ffbd18 51%, #fc3231 78%, #3019ff 100%);
}
.modal__main {
  position: relative;
  z-index: 10;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  overscroll-behavior-y: contain;
}
.modal__item {
  display: flex;
  position: relative;
  z-index: 1;
  margin: 0 auto;
  width: 92vw;
  height: 52.6666666667vw;
  pointer-events: auto;
}
@media only screen and (min-width: 767px) {
  .modal__item {
    margin: 0;
    width: 69.4444444444vw;
    height: 39.0972222222vw;
  }
}
.modal__item:not(:first-child) {
  margin-top: 4vw;
}
@media only screen and (min-width: 767px) {
  .modal__item:not(:first-child) {
    margin-top: 0;
    margin-left: 2.0833333333vw;
  }
}
.modal__content {
  position: relative;
  z-index: 10;
  width: 100%;
  height: 100%;
  background-color: #201401;
}
@media only screen and (min-width: 767px) {
  .modal__content {
    background-color: #201401;
  }
}
.modal__content > iframe {
  width: 100%;
  height: 100%;
}
.modal__link {
  display: block;
}
.modal__close {
  position: absolute;
  top: 5.3333333333vw;
  right: 5.3333333333vw;
  width: 9.0666666667vw;
  transition: all 300ms;
}
@media only screen and (min-width: 767px) {
  .modal__close {
    top: 2.2222222222vw;
    right: 2.2222222222vw;
    width: 2.8472222222vw;
  }
  .modal__close:hover > .off {
    opacity: 0;
  }
  .modal__close:hover > .hover {
    opacity: 1;
  }
}
.modal__close > .off {
  transition: all 300ms;
}
.modal__close > .hover {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: all 300ms;
  transition-delay: 100ms;
  filter: invert(1);
}
/*# sourceMappingURL=sourcemaps/share.css.map */