@charset "UTF-8";
@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);
  font-weight: 400;
  font-style: normal;
}
:root {
  --swiper-theme-color: #007aff;
}
.swiper {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
}
.swiper-vertical > .swiper-wrapper {
  flex-direction: column;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  box-sizing: content-box;
}
.swiper-android .swiper-slide,
.swiper-wrapper {
  transform: translateZ(0);
}
.swiper-pointer-events {
  touch-action: pan-y;
}
.swiper-pointer-events.swiper-vertical {
  touch-action: pan-x;
}
.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
}
.swiper-slide-invisible-blank {
  visibility: hidden;
}
.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);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.swiper-3d,
.swiper-3d.swiper-css-mode .swiper-wrapper {
  perspective: 1200px;
}
.swiper-3d .swiper-cube-shadow,
.swiper-3d .swiper-slide,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-wrapper {
  transform-style: preserve-3d;
}
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top {
  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-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}
.swiper-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}
.swiper-horizontal.swiper-css-mode > .swiper-wrapper {
  scroll-snap-type: x mandatory;
}
.swiper-vertical.swiper-css-mode > .swiper-wrapper {
  scroll-snap-type: y mandatory;
}
.swiper-centered > .swiper-wrapper:before {
  content: "";
  flex-shrink: 0;
  order: 9999;
}
.swiper-centered.swiper-horizontal
  > .swiper-wrapper
  > .swiper-slide:first-child {
  -webkit-margin-start: var(--swiper-centered-offset-before);
  margin-inline-start: var(--swiper-centered-offset-before);
}
.swiper-centered.swiper-horizontal > .swiper-wrapper:before {
  height: 100%;
  min-height: 1px;
  width: var(--swiper-centered-offset-after);
}
.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
  -webkit-margin-before: var(--swiper-centered-offset-before);
  margin-block-start: var(--swiper-centered-offset-before);
}
.swiper-centered.swiper-vertical > .swiper-wrapper:before {
  width: 100%;
  min-width: 1px;
  height: var(--swiper-centered-offset-after);
}
.swiper-centered > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: center center;
}
:root {
  --swiper-navigation-size: 44px;
}
.swiper-button-next,
.swiper-button-prev {
  position: absolute;
  top: 50%;
  width: calc(var(--swiper-navigation-size) / 44 * 27);
  height: var(--swiper-navigation-size);
  margin-top: calc(0px - (var(--swiper-navigation-size) / 2));
  z-index: 10;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--swiper-navigation-color, var(--swiper-theme-color));
}
.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
  opacity: 0.35;
  cursor: auto;
  pointer-events: none;
}
.swiper-button-next.swiper-button-hidden,
.swiper-button-prev.swiper-button-hidden {
  opacity: 0;
  cursor: auto;
  pointer-events: none;
}
.swiper-navigation-disabled .swiper-button-next,
.swiper-navigation-disabled .swiper-button-prev {
  display: none !important;
}
.swiper-button-next:after,
.swiper-button-prev:after {
  font-family: swiper-icons;
  font-size: var(--swiper-navigation-size);
  text-transform: none !important;
  letter-spacing: 0;
  font-variant: initial;
  line-height: 1;
}
.swiper-button-prev,
.swiper-rtl .swiper-button-next {
  left: 10px;
  right: auto;
}
.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after {
  content: "prev";
}
.swiper-button-next,
.swiper-rtl .swiper-button-prev {
  right: 10px;
  left: auto;
}
.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
  content: "next";
}
.swiper-button-lock {
  display: none;
}
.swiper-pagination {
  position: absolute;
  text-align: center;
  transition: 0.3s opacity;
  transform: translateZ(0);
  z-index: 10;
}
.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}
.swiper-pagination-disabled > .swiper-pagination,
.swiper-pagination.swiper-pagination-disabled {
  display: none !important;
}
.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  bottom: 10px;
  left: 0;
  width: 100%;
}
.swiper-pagination-bullets-dynamic {
  overflow: hidden;
  font-size: 0;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transform: scale(0.33);
  position: relative;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
  transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
  transform: scale(0.33);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
  transform: scale(0.33);
}
.swiper-pagination-bullet {
  width: var(
    --swiper-pagination-bullet-width,
    var(--swiper-pagination-bullet-size, 8px)
  );
  height: var(
    --swiper-pagination-bullet-height,
    var(--swiper-pagination-bullet-size, 8px)
  );
  display: inline-block;
  border-radius: 50%;
  background: var(--swiper-pagination-bullet-inactive-color, #000);
  opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2);
}
button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  box-shadow: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}
.swiper-pagination-bullet:only-child {
  display: none !important;
}
.swiper-pagination-bullet-active {
  opacity: var(--swiper-pagination-bullet-opacity, 1);
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
}
.swiper-pagination-vertical.swiper-pagination-bullets,
.swiper-vertical > .swiper-pagination-bullets {
  right: 10px;
  top: 50%;
  transform: translate3d(0, -50%, 0);
}
.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
  display: block;
}
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-vertical
  > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
}
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic
  .swiper-pagination-bullet,
.swiper-vertical
  > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic
  .swiper-pagination-bullet {
  display: inline-block;
  transition:
    0.2s transform,
    0.2s top;
}
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets
  .swiper-pagination-bullet {
  margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);
}
.swiper-horizontal
  > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  left: 50%;
  transform: translate(-50%);
  white-space: nowrap;
}
.swiper-horizontal
  > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic
  .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic
  .swiper-pagination-bullet {
  transition:
    0.2s transform,
    0.2s left;
}
.swiper-horizontal.swiper-rtl
  > .swiper-pagination-bullets-dynamic
  .swiper-pagination-bullet {
  transition:
    0.2s transform,
    0.2s right;
}
.swiper-pagination-progressbar {
  background: rgba(0, 0, 0, 0.25);
  position: absolute;
}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transform: scale(0);
  transform-origin: left top;
}
.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  transform-origin: right top;
}
.swiper-horizontal > .swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-horizontal,
.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,
.swiper-vertical
  > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
  width: 100%;
  height: 4px;
  left: 0;
  top: 0;
}
.swiper-horizontal
  > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-vertical,
.swiper-vertical > .swiper-pagination-progressbar {
  width: 4px;
  height: 100%;
  left: 0;
  top: 0;
}
.swiper-pagination-lock {
  display: none;
}
@-webkit-keyframes basic-fade {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes basic-fade {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
} /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}
body {
  margin: 0;
}
main {
  display: block;
}
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}
pre {
  font-family: monospace, monospace;
  font-size: 1em;
}
a {
  background-color: transparent;
}
abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
}
b,
strong {
  font-weight: bolder;
}
code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
small {
  font-size: 80%;
}
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}
img {
  border-style: none;
}
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}
button,
input {
  overflow: visible;
}
button,
select {
  text-transform: none;
}
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}
fieldset {
  padding: 0.35em 0.75em 0.625em;
}
legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
}
progress {
  vertical-align: baseline;
}
textarea {
  overflow: auto;
}
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}
details {
  display: block;
}
summary {
  display: list-item;
}
template {
  display: none;
}
[hidden] {
  display: none;
}
*,
*:before,
*:after {
  box-sizing: border-box;
}
html {
  top: 0;
  font-size: calc(0.78125em + 1vw);
}
body {
  color: #101010;
  background-color: #fff;
  font-family: "Noto Serif SC", serif;
  text-align: center;
  min-width: 320px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0.3);
}
body.loaded {
  overflow-y: scroll;
}
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
ol,
ul,
dl,
dd,
pre,
table,
form,
fieldset,
address,
details,
figure,
section,
article,
header,
nav {
  text-align: left;
  margin: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  line-height: 1.25;
}
p,
blockquote,
ol,
ul,
dl,
pre,
th,
td {
  line-height: 1.5;
}
th,
td {
  vertical-align: top;
}
ul,
ul ul {
  list-style-type: disc;
}
ul ul {
  margin-bottom: 0;
}
ul,
ol {
  padding-left: 2em;
}
li::marker {
  color: #5ee1ff;
}
a {
  color: #2acef3;
  text-decoration: underline;
  transition: opacity 0.15s ease-out;
  cursor: pointer;
  display: inline-block;
}
a > * {
  pointer-events: none;
}
a:visited {
  color: #2acef3;
}
a:hover {
  text-decoration: none;
}
a.now {
  pointer-events: none;
}
a.hover {
  opacity: 0.7;
}
a.push {
  transition: none;
  opacity: 0.5;
}
figure,
img,
svg {
  display: block;
  max-width: 100%;
  height: auto;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  pointer-events: none;
  -webkit-user-drag: none;
}
figure {
  margin-left: 0;
  margin-right: 0;
}
iframe {
  vertical-align: top;
}
input[type="text"],
input[type="email"],
input[type="search"],
input[type="tel"],
input[type="url"],
input[type="password"],
input[type="color"],
input[type="number"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="datetime"],
input[type="datetime-local"],
textarea,
select {
  color: #101010;
  background-color: #fff;
  line-height: 1.25;
  padding: 0.25em;
  vertical-align: bottom;
  max-width: 100%;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="color"]:focus,
input[type="number"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
textarea:focus,
select:focus {
  outline: #5ee1ff 1px solid;
}
legend {
  padding: 0.5em;
}
legend + * {
  margin-top: 0;
}
fieldset {
  padding: 1.5rem;
}
section > * + * {
  margin-top: 0.5rem;
}
input[type="button"],
button {
  border: none;
  padding: 0;
  background-color: transparent;
  cursor: pointer;
}
input[type="button"] > *,
button > * {
  pointer-events: none;
}
.barba-container > * + * {
  margin-top: 3.3333333333rem;
}
.barba-container.leave {
  position: absolute;
  width: 100%;
}
.site-bg {
  pointer-events: none;
  position: fixed;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  min-width: 320px;
  background-image: url(/rc/site-bg.jpg);
  background-size: 100vw;
  background-repeat: repeat-y;
  background-position: 0 0;
  opacity: 0.4;
}
body.view .site-fg {
  opacity: 0;
}
.site-footer {
  padding: 5rem 0;
  position: relative;
  z-index: 10;
}
.footer-social {
  display: flex;
  justify-content: center;
  align-items: center;
}
.footer-social .label {
  margin-right: 1rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.footer-social .label img {
  width: 3.3333333333rem;
}
.footer-brand-logo {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  margin-top: 5rem;
}
.footer-brand-logo img {
  width: 2.5833333333rem;
}
.footer-brand-logo .footer-brand-logo__popipa {
  width: 5.2rem;
}
.footer-copyright {
  margin-top: 0.6666666667rem;
  font-size: 10px;
}
body.view .header-container {
  opacity: 1;
  pointer-events: auto;
}
.header-logo {
  width: 100%;
  height: 3.3333333333rem;
  left: 0;
  top: 0;
  position: fixed;
  z-index: 90;
  padding-top: 0.8666666667rem;
  text-align: center;
  margin: 0;
  pointer-events: none;
  padding-right: 3.8333333333rem;
  transition: opacity 0.2s;
}
.header-logo img {
  width: 7.7458333333rem;
}
.header-logo .link {
  position: relative;
  padding-right: 0.4166666667rem;
  pointer-events: all;
}
.header-logo .bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 150%;
  pointer-events: none;
  background-image: url(/rc/header-logo-bg.png);
  background-repeat: no-repeat;
  background-size: 43.3333333333rem;
  background-position: center top;
}
.header-button {
  position: fixed;
  top: 0.3333333333rem;
  z-index: 950;
  width: 3rem;
  height: 3.625rem;
  text-decoration: none;
  border: none;
  background-color: transparent;
  background-image: url(/rc/button-circle.svg);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: 0 0;
  filter: drop-shadow(0 0 1px rgba(255, 255, 255, 0.5))
    drop-shadow(0 0 2px rgba(255, 255, 255, 0.5));
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: 0;
}
.header-button.no-shadow {
  filter: none;
}
.header-button * {
  pointer-events: none;
}
.header-button .svg-icon {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  transition: 0.15s transform ease-out;
}
.header-button .svg-icon * {
  fill: #fff;
}
.header-button .svg-icon.close * {
  stroke: #fff;
}
.header-button .text {
  position: absolute;
  width: 77%;
  left: 0;
  right: 0;
  top: 60%;
  margin: 0 auto;
  text-align: center;
  color: #fff;
  font-size: 10px;
  text-decoration: none;
}
.header-button:hover {
  text-decoration: none;
}
.header-button.hover,
.header-button.push {
  opacity: 1;
}
.header-button .svg-icon {
  transform: scale(0.9);
}
.header-button.hover .svg-icon {
  transform: scale(1.1);
}
.header-button.push .svg-icon {
  transition: none;
  opacity: 0.8;
  transform: scale(1.1);
}
.header-bgm {
  right: 3.6666666667rem;
}
.header-bgm .svg-icon {
  width: 38%;
  height: 22.7%;
  top: 29%;
}
.header-bgm .svg-icon * {
  stroke: none;
  fill: #fff;
}
.header-bgm .play {
  display: none;
}
.header-bgm .stop,
.header-bgm.playing .play {
  display: block;
}
.header-bgm.playing .stop {
  display: none;
}
.header-twitter {
  left: 0.3333333333rem;
}
.header-twitter .svg-icon {
  width: 50%;
  top: 20%;
}
.site-main {
  position: relative;
}
.site {
  font-size: 0.875rem;
  position: relative;
  min-height: 100%;
  z-index: 10;
  transition: opacity 0.3s;
  opacity: 0;
  pointer-events: none;
}
body.loaded .site {
  opacity: 1;
  pointer-events: auto;
}
.characters-gallery {
  background-color: #cbf5ff;
  margin-top: 10vw;
}
.characters-gallery-list-container {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}
.characters-gallery-list {
  display: flex;
  flex-wrap: wrap;
  padding: 0.3333333333rem;
  justify-content: center;
}
.characters-gallery-list > * {
  margin: 0.3333333333rem;
  width: calc(50% - 0.6666666667rem);
}
.characters-gallery-list img {
  width: 100%;
}
.characters-gallery-list button {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: 0;
  overflow: hidden;
}
.characters-gallery-list button.hover,
.characters-gallery-list button.push {
  opacity: 1;
}
.characters-gallery-list button img {
  transition: 0.15s transform ease-out;
}
.characters-gallery-list button.hover img {
  transform: scale(1.1);
}
.characters-gallery-list button.push img {
  transition: none;
  opacity: 0.8;
  transform: scale(1.1);
}
.characters-content {
  overflow: hidden;
}
.characters-info-container {
  max-width: 1232px;
  margin-top: 1.6666666667rem;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
.characters-info-arrow {
  position: absolute;
  width: 5rem;
  height: 5rem;
  z-index: 100;
  top: 140vw;
}
.characters-info-arrow.prev {
  left: 0rem;
}
.characters-info-arrow.prev .svg-icon svg {
  transform: scaleX(-1);
}
.characters-info-arrow.next {
  right: 0rem;
}
.characters-info-arrow .svg-icon {
  width: 100%;
  height: 100%;
  filter: drop-shadow(0 0 1px rgba(255, 255, 255, 0.6))
    drop-shadow(0 0 2px rgba(255, 255, 255, 0.6))
    drop-shadow(0 0 3px rgba(255, 255, 255, 0.6))
    drop-shadow(0 0 4px rgba(255, 255, 255, 0.6));
}
.characters-info-arrow.prev .svg-icon {
  -webkit-animation: char-arrow-prev 1s linear 0s infinite alternate;
  animation: char-arrow-prev 1s linear 0s infinite alternate;
}
@-webkit-keyframes char-arrow-prev {
  0% {
    transform: translate3d(5%, 0, 0);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }
  to {
    transform: translate3d(-5%, 0, 0);
  }
}
@keyframes char-arrow-prev {
  0% {
    transform: translate3d(5%, 0, 0);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }
  to {
    transform: translate3d(-5%, 0, 0);
  }
}
.characters-info-arrow.next .svg-icon {
  -webkit-animation: char-arrow-next 1s linear 0s infinite alternate;
  animation: char-arrow-next 1s linear 0s infinite alternate;
}
@-webkit-keyframes char-arrow-next {
  0% {
    transform: translate3d(-5%, 0, 0);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }
  to {
    transform: translate3d(5%, 0, 0);
  }
}
@keyframes char-arrow-next {
  0% {
    transform: translate3d(-5%, 0, 0);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }
  to {
    transform: translate3d(5%, 0, 0);
  }
}
.characters-info-arrow .svg-line {
  stroke: #2acef3;
  stroke-width: 1px;
}
.characters-info {
  line-height: 1;
  text-align: left;
}
.characters-info img {
  width: 100%;
  pointer-events: none;
}
.characters-info .primary {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 223.5897435897%;
}
.characters-info .secondary {
  font-size: 3.0769230769vw;
  padding: 0 4vw;
}
.characters-info .words {
  position: absolute;
  left: 7.6923076923%;
  right: auto;
  margin: 0;
  top: 11.6972477064%;
  bottom: auto;
  width: 37.3809798603%;
  height: 50.155672519%;
  z-index: 20;
}
.characters-info .words,
.characters-info .words img {
  max-width: none;
  vertical-align: top;
}
.characters-info .words img {
  filter: drop-shadow(0 0 1px #fff) drop-shadow(0 0 2px #fff)
    drop-shadow(0 0 3px #fff) drop-shadow(0 0 4px #fff);
}
.characters-info .words-text {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  color: #101010;
  font-size: 0.7rem;
  font-weight: 700;
  line-height: 1.75;
  letter-spacing: 0.08em;
  text-align: left;
  text-shadow: 0 0 1px #fff, 0 0 2px #fff, 0 0 3px #fff, 0 0 4px #fff;
  text-orientation: mixed;
  white-space: nowrap;
  writing-mode: vertical-rl;
}
.characters-info .stand {
  position: absolute;
  left: 0%;
  right: auto;
  margin: 0;
  top: 0%;
  bottom: auto;
  width: 128.2051282051%;
  height: auto;
  z-index: 10;
}
.characters-info .stand,
.characters-info .stand img {
  max-width: none;
  vertical-align: top;
}
.characters-info .stand.char-13 {
  position: absolute;
  left: -12.8205128205%;
  right: auto;
  margin: 0;
  top: 0%;
  bottom: auto;
  width: 128.2051282051%;
  height: auto;
  z-index: 10;
}
.characters-info .stand.char-13,
.characters-info .stand.char-13 img {
  max-width: none;
  vertical-align: top;
}
.characters-info .bustup {
  display: none;
  position: absolute;
  left: 0%;
  right: auto;
  margin: 0;
  top: 0%;
  bottom: auto;
  width: 137.987012987%;
  height: auto;
  z-index: 1;
}
.characters-info .bustup,
.characters-info .bustup img {
  max-width: none;
  vertical-align: top;
}
.characters-info .catch {
  font-size: 4.1025641026vw;
  position: relative;
  z-index: 2;
}
.characters-info .name {
  position: relative;
  z-index: 1;
  color: #444;
  font-size: 14.1025641026vw;
  margin-top: 2.5641025641vw;
  white-space: nowrap;
  letter-spacing: 0.2em;
}
.characters-info .name.narrow {
  letter-spacing: 0.03em;
}
.characters-info .name .male {
  color: #449cf3;
}
.characters-info .name .female {
  color: #ff7af6;
}
.characters-info .name .small {
  font-size: 7.6923076923vw;
}
.characters-info .name-ruby {
  position: relative;
  z-index: 2;
  margin-top: 2.5641025641vw;
  letter-spacing: 2.1em;
}
.characters-info .name-ruby.narrow {
  letter-spacing: 1.4em;
}
.characters-info .voice {
  margin-top: 10.2564102564vw;
  display: flex;
  justify-content: space-between;
}
.characters-info .cv {
  letter-spacing: 0.2em;
}
.characters-info .sample-voice {
  display: flex;
}
.characters-info .sample-voice > * + * {
  margin-left: 4.1025641026vw;
}
.characters-info .sample-voice .buttons > * + * {
  margin-left: 2.5641025641vw;
}
.characters-info .sample-voice .svg-icon {
  filter: drop-shadow(0 0 0.5px #fff) drop-shadow(0 0 1px #fff)
    drop-shadow(0 0 1.5px #fff) drop-shadow(0 0 2px #fff);
}
.characters-info .status {
  min-height: 46.1538461538vw;
  padding: 3.8461538462vw 5.1282051282vw 6.4102564103vw;
}
.characters-info .status table th,
.characters-info .status table td {
  padding: 0.5em 0;
}
.characters-info .status table th {
  font-weight: 400;
  text-align: right;
}
.characters-info .status table th.line-modify {
  vertical-align: bottom;
  padding-bottom: 1em;
}
.characters-info .status table.table-2 {
  position: relative;
  left: 2em;
}
.characters-info .status .number {
  font-size: 200%;
}
.characters-info .desc {
  margin-top: 7.6923076923vw;
  line-height: 2;
  text-align: justify;
  text-justify: inter-ideograph;
}
.characters-info .status-heading {
  margin-top: 10.2564102564vw;
}
.characters-info .name-en {
  position: absolute;
  width: 100%;
  height: 1em;
  z-index: 1;
  line-height: 1;
  letter-spacing: 0em;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  color: #5ee1ff40;
  font-weight: 700;
  white-space: nowrap;
  text-align: left;
  font-size: 15.3846153846vw;
  left: 0vw;
  top: 0;
  bottom: 0;
  margin: 0;
}
.characters-info .name-en span {
  display: block;
  width: 100%;
  height: 100%;
  transform: rotate(90deg);
  transform-origin: left bottom;
}
.characters-category-heading {
  font-size: 0.5rem;
  font-weight: 400;
  border-top: #5ee1ff 1px solid;
  color: #5ee1ff;
  letter-spacing: 0.2em;
}
.voice-player {
  position: relative;
}
.voice-player.male .svg-icon path {
  fill: #449cf3;
}
.voice-player.male .flare {
  background: radial-gradient(
    circle closest-side,
    rgba(94, 225, 255, 0),
    rgba(94, 225, 255, 0),
    #5ee1ff
  );
}
.voice-player.female .svg-icon path {
  fill: #ff7af6;
}
.voice-player.female .flare {
  background: radial-gradient(
    circle closest-side,
    rgba(255, 140, 247, 0),
    rgba(255, 140, 247, 0),
    #ff8cf7
  );
}
.voice-player.playing .flare {
  -webkit-animation: voice-player-playing 0.8s linear 0s infinite normal;
  animation: voice-player-playing 0.8s linear 0s infinite normal;
}
@-webkit-keyframes voice-player-playing {
  0% {
    transform: scale(0);
    opacity: 0.6;
  }
  50% {
    transform: scale(3);
    opacity: 0.6;
  }
  to {
    transform: scale(6);
    opacity: 0;
  }
}
@keyframes voice-player-playing {
  0% {
    transform: scale(0);
    opacity: 0.6;
  }
  50% {
    transform: scale(3);
    opacity: 0.6;
  }
  to {
    transform: scale(6);
    opacity: 0;
  }
}
.voice-player .flare {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 10px;
  height: 10px;
  z-index: 1;
  opacity: 0;
  border-radius: 100%;
  overflow: hidden;
}
.voice-player .svg-icon {
  width: 1.5em;
  height: 1.095em;
}
.characters-menu-in-single {
  margin-top: 3.3333333333rem;
}
.chacacters-menu-container {
  max-width: 880px;
  margin-left: auto;
  margin-right: auto;
}
.chacacters-menu {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 121.7532467532%;
}
.chacacters-menu > * {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.chacacters-menu .name {
  z-index: 3;
  pointer-events: none;
}
.chacacters-menu .links {
  z-index: 2;
}
.chacacters-menu .links a {
  display: block;
  border-radius: 100%;
  background-color: #cbf5ff;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: 0;
  overflow: hidden;
}
.chacacters-menu .links a.hover,
.chacacters-menu .links a.push {
  opacity: 1;
}
.chacacters-menu .links a img {
  transition: 0.15s transform ease-out;
}
.chacacters-menu .links a.hover img {
  transform: scale(1.1);
}
.chacacters-menu .links a.push img {
  transition: none;
  opacity: 0.8;
  transform: scale(1.1);
}
.chacacters-menu .links a.now {
  background-color: #eaeaea;
}
.chacacters-menu .links .disabled {
  border-radius: 100%;
  overflow: hidden;
  background-color: #cbf5ff;
}
.chacacters-menu .links img {
  width: 100%;
}
.chacacters-menu .links .char-01 {
  position: absolute;
  left: 40.5426866883%;
  right: auto;
  margin: 0;
  top: 30.1554866667%;
  bottom: auto;
  width: 18.9123376623%;
  height: 15.5333333333%;
  z-index: 10;
}
.chacacters-menu .links .char-01,
.chacacters-menu .links .char-01 img {
  max-width: none;
  vertical-align: top;
}
.chacacters-menu .links .char-02 {
  position: absolute;
  left: 40.5426866883%;
  right: auto;
  margin: 0;
  top: 4.1416333333%;
  bottom: auto;
  width: 18.9123376623%;
  height: 15.5333333333%;
  z-index: 10;
}
.chacacters-menu .links .char-02,
.chacacters-menu .links .char-02 img {
  max-width: none;
  vertical-align: top;
}
.chacacters-menu .links .char-03 {
  position: absolute;
  left: 10.4201542208%;
  right: auto;
  margin: 0;
  top: 22.11676%;
  bottom: auto;
  width: 18.9123376623%;
  height: 15.5333333333%;
  z-index: 10;
}
.chacacters-menu .links .char-03,
.chacacters-menu .links .char-03 img {
  max-width: none;
  vertical-align: top;
}
.chacacters-menu .links .char-04 {
  position: absolute;
  left: 21.9259334416%;
  right: auto;
  margin: 0;
  top: 51.2011266667%;
  bottom: auto;
  width: 18.9123376623%;
  height: 15.5333333333%;
  z-index: 10;
}
.chacacters-menu .links .char-04,
.chacacters-menu .links .char-04 img {
  max-width: none;
  vertical-align: top;
}
.chacacters-menu .links .char-05 {
  position: absolute;
  left: 59.1594318182%;
  right: auto;
  margin: 0;
  top: 51.2011266667%;
  bottom: auto;
  width: 18.9123376623%;
  height: 15.5333333333%;
  z-index: 10;
}
.chacacters-menu .links .char-05,
.chacacters-menu .links .char-05 img {
  max-width: none;
  vertical-align: top;
}
.chacacters-menu .links .char-06 {
  position: absolute;
  left: 70.6652191558%;
  right: auto;
  margin: 0;
  top: 22.11676%;
  bottom: auto;
  width: 18.9123376623%;
  height: 15.5333333333%;
  z-index: 10;
}
.chacacters-menu .links .char-06,
.chacacters-menu .links .char-06 img {
  max-width: none;
  vertical-align: top;
}
.chacacters-menu .links .char-07 {
  position: absolute;
  left: 19.9751948052%;
  right: auto;
  margin: 0;
  top: 73.96992%;
  bottom: auto;
  width: 11.3636363636%;
  height: 9.3333333333%;
  z-index: 10;
}
.chacacters-menu .links .char-07,
.chacacters-menu .links .char-07 img {
  max-width: none;
  vertical-align: top;
}
.chacacters-menu .links .char-08 {
  position: absolute;
  left: 36.2089691558%;
  right: auto;
  margin: 0;
  top: 73.96992%;
  bottom: auto;
  width: 11.3636363636%;
  height: 9.3333333333%;
  z-index: 10;
}
.chacacters-menu .links .char-08,
.chacacters-menu .links .char-08 img {
  max-width: none;
  vertical-align: top;
}
.chacacters-menu .links .char-09 {
  position: absolute;
  left: 52.4427678571%;
  right: auto;
  margin: 0;
  top: 73.96992%;
  bottom: auto;
  width: 11.3636363636%;
  height: 9.3333333333%;
  z-index: 10;
}
.chacacters-menu .links .char-09,
.chacacters-menu .links .char-09 img {
  max-width: none;
  vertical-align: top;
}
.chacacters-menu .links .char-10 {
  position: absolute;
  left: 68.6764935065%;
  right: auto;
  margin: 0;
  top: 73.96992%;
  bottom: auto;
  width: 11.3636363636%;
  height: 9.3333333333%;
  z-index: 10;
}
.chacacters-menu .links .char-10,
.chacacters-menu .links .char-10 img {
  max-width: none;
  vertical-align: top;
}
.chacacters-menu .links .char-11 {
  position: absolute;
  left: 28.0921022727%;
  right: auto;
  margin: 0;
  top: 85.4174266667%;
  bottom: auto;
  width: 11.3636363636%;
  height: 9.3333333333%;
  z-index: 10;
}
.chacacters-menu .links .char-11,
.chacacters-menu .links .char-11 img {
  max-width: none;
  vertical-align: top;
}
.chacacters-menu .links .char-12 {
  position: absolute;
  left: 44.3258766234%;
  right: auto;
  margin: 0;
  top: 85.4174266667%;
  bottom: auto;
  width: 11.3636363636%;
  height: 9.3333333333%;
  z-index: 10;
}
.chacacters-menu .links .char-12,
.chacacters-menu .links .char-12 img {
  max-width: none;
  vertical-align: top;
}
.chacacters-menu .links .char-13 {
  position: absolute;
  left: 60.5596103896%;
  right: auto;
  margin: 0;
  top: 85.4174266667%;
  bottom: auto;
  width: 11.3636363636%;
  height: 9.3333333333%;
  z-index: 10;
}
.chacacters-menu .links .char-13,
.chacacters-menu .links .char-13 img {
  max-width: none;
  vertical-align: top;
}
.chacacters-menu .bg {
  z-index: 1;
  pointer-events: none;
}
.characters-relation {
  margin-top: 3.3333333333rem;
  max-width: 680px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 1rem;
}
.characters-relation img {
  width: 100%;
}
.characters-relation .icon {
  border-radius: 100%;
  overflow: hidden;
}
.characters-relation .item {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 15.7158516824%;
  margin-top: 1.25rem;
  transition: 0.5s all;
  transition-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
  opacity: 0;
  transform: translate3d(-10%, 0, 0) rotate3d(0, 0, 1, -5deg) scaleZ(1);
}
.characters-relation .item.in-view-enter {
  opacity: 1;
  transform: translateZ(0) rotate3d(0, 0, 0, 0) scaleZ(1);
}
.characters-relation .inner {
  position: absolute;
  left: 0%;
  right: auto;
  margin: 0;
  top: 0%;
  bottom: auto;
  width: 99.3240158231%;
  height: 95.7009097801%;
  z-index: 1;
}
.characters-relation .inner,
.characters-relation .inner img {
  max-width: none;
  vertical-align: top;
}
.characters-relation .text {
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 700;
  font-size: 0.5833333333rem;
  transform: scaleX(0.9);
}
html.ios .characters-relation .text {
  font-size: 0.7083333333rem;
  transform: scaleX(0.9);
}
html.android .characters-relation .text {
  font-size: 0.625rem;
  transform: scaleX(0.9);
}
.characters-relation .from .text {
  position: absolute;
  left: 12.807276238%;
  right: auto;
  margin: 0;
  top: 3.5389508792%;
  bottom: auto;
  width: 35.993117137%;
  height: 85.0000198052%;
  z-index: 1;
  color: #fff;
}
.characters-relation .from .text,
.characters-relation .from .text img {
  max-width: none;
  vertical-align: top;
}
.characters-relation .from .icon {
  position: absolute;
  left: 1.135691584%;
  right: auto;
  margin: 0;
  top: 7.4999900974%;
  bottom: auto;
  width: 12.871191279%;
  height: 85.0000198052%;
  z-index: 1;
}
.characters-relation .from .icon,
.characters-relation .from .icon img {
  max-width: none;
  vertical-align: top;
}
.characters-relation .to .text {
  position: absolute;
  left: 51.199606625%;
  right: auto;
  margin: 0;
  top: 3.5389508792%;
  bottom: auto;
  width: 35.993117137%;
  height: 85.0000198052%;
  z-index: 1;
  color: #11bee9;
}
.characters-relation .to .text,
.characters-relation .to .text img {
  max-width: none;
  vertical-align: top;
}
.characters-relation .to .icon {
  position: absolute;
  left: 85.993105141%;
  right: auto;
  margin: 0;
  top: 7.4999900974%;
  bottom: auto;
  width: 12.871191279%;
  height: 85.0000198052%;
  z-index: 1;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: 0;
  overflow: hidden;
}
.characters-relation .to .icon,
.characters-relation .to .icon img {
  max-width: none;
  vertical-align: top;
}
.characters-relation .to .icon.hover,
.characters-relation .to .icon.push {
  opacity: 1;
}
.characters-relation .to .icon img {
  transition: 0.15s transform ease-out;
}
.characters-relation .to .icon.hover img {
  transform: scale(1.2);
}
.characters-relation .to .icon.push img {
  transition: none;
  opacity: 0.8;
  transform: scale(1.2);
}
.characters-relation .to .name {
  line-height: 1;
  position: absolute;
  right: 13%;
  bottom: 5%;
  text-align: right;
  font-size: 0.5rem;
  transform-origin: right bottom;
  transform: scale(0.9);
}
.characters-relation .svg-icon {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.characters-relation .svg-icon .a {
  fill: #eaeaea;
}
.characters-relation .svg-icon .b {
  fill: #fff;
}
.characters-relation .svg-icon .c {
  fill: #47d7f8;
}
.comic-4koma-menu {
  max-width: 996px;
  margin-left: auto;
  margin-right: auto;
}
.comic-4koma-menu > * + * {
  margin-top: 3.3333333333rem;
}
.comic-4koma-list {
  display: flex;
  flex-wrap: wrap;
  padding: 0.8333333333rem;
  font-size: 0.75rem;
}
.comic-4koma-list > * {
  margin: 0.8333333333rem;
  width: calc(50% - 1.6666666667rem);
}
.comic-4koma-list img {
  width: 100%;
}
.comic-4koma-list a {
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: 0;
}
.comic-4koma-list a,
.comic-4koma-list a:visited {
  color: inherit;
}
.comic-4koma-list a.now {
  opacity: 0.3;
}
.comic-4koma-list a span {
  display: block;
}
.comic-4koma-list a.hover,
.comic-4koma-list a.push {
  opacity: 1;
}
.comic-4koma-list a .img {
  overflow: hidden;
  background-color: #fff;
}
.comic-4koma-list a .img img {
  transition: 0.15s transform ease-out;
}
.comic-4koma-list a.hover .img img {
  transform: scale(1.1);
}
.comic-4koma-list a.push .img img {
  transition: none;
  opacity: 0.8;
  transform: scale(1.1);
}
.comic-4koma-list .img {
  box-shadow: #00000026 0.05rem 0.05rem 0.2rem;
}
.comic-4koma-list .title {
  display: block;
  margin-top: 0.1666666667rem;
}
.comic-4koma-media {
  margin-top: 1.6666666667rem;
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
}
.comic-4koma-media img {
  box-shadow: #0000001f 0.25rem 0.25rem 0.5rem;
}
.comic-4koma-media-section {
  margin-bottom: 5rem;
}
.comic-4koma-heading {
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  justify-content: space-between;
}
.comic-4koma-heading .text {
  color: #11bee9;
  text-align: center;
  font-size: 1.1666666667rem;
}
.comic-4koma-heading .prev,
.comic-4koma-heading .next {
  width: 3.3333333333rem;
  height: 3.3333333333rem;
}
.comic-4koma-heading .prev {
  margin-left: 0;
  margin-right: auto;
}
.comic-4koma-heading .prev .svg-icon {
  transform: scaleX(-1);
}
.comic-4koma-heading .next {
  margin-left: auto;
  margin-right: 0;
}
.comic-4koma-heading a {
  display: block;
  width: 3.3333333333rem;
  height: 3.3333333333rem;
}
.comic-4koma-heading a .svg-icon {
  width: 100%;
}
.comic-4koma-heading a .svg-line {
  stroke: #2acef3;
  stroke-width: 1.5px;
}
.download-content {
  margin-top: 1.5rem;
  font-size: 0.75rem;
}
.download-content img {
  -webkit-user-select: inherit;
  -moz-user-select: inherit;
  user-select: inherit;
  pointer-events: inherit;
  -webkit-user-drag: inherit;
}
.download-heading {
  color: #11bee9;
  border-bottom: #cbf5ff 1px solid;
  text-align: left;
}
.download-twitter-list {
  text-align: center;
}
.download-twitter-list > * + * {
  margin-top: 1.5rem;
}
.download-twitter-list > * > * + * {
  margin-top: 0.5rem;
}
.download-twitter-list img {
  margin-left: auto;
  margin-right: auto;
}
.download-banner-list > * + * {
  margin-top: 1.5rem;
}
.download-banner-list > * > * + * {
  margin-top: 1.5rem;
}
.download-banner-list textarea {
  font-size: 10px;
  width: 230px;
  height: 88px;
  line-height: 1.1;
  padding: 4px;
  max-width: 100%;
  line-break: anywhere;
  margin-top: 4px;
  border: #ccc 1px solid;
  color: gray;
  background-color: #f0f0f0;
  font-family: sans-serif;
}
.download-banner-list .size {
  font-size: 0.5833333333rem;
  margin-bottom: 0.25rem;
}
.download-wallpaper-list {
  text-align: center;
}
.download-wallpaper-list > * + * {
  margin-top: 1.5rem;
}
.download-wallpaper-list > * > * + * {
  margin-top: 0.5rem;
}
.information-list-container {
  max-width: 48.6666666667rem;
  margin-left: auto;
  margin-right: auto;
}
.information-list {
  display: flex;
  flex-wrap: wrap;
  padding: 0.8333333333rem;
}
.information-list > * {
  margin: 0.8333333333rem;
  width: calc(100% - 1.6666666667rem);
}
.information-list img {
  width: 100%;
}
.information-list > a {
  text-decoration: none;
}
.information-list > a,
.information-list button {
  color: inherit;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: 0;
  -webkit-animation: basic-fade 0.3s linear 0s 1 alternate both;
  animation: basic-fade 0.3s linear 0s 1 alternate both;
}
.information-list > a.hover,
.information-list > a.push,
.information-list button.hover,
.information-list button.push {
  opacity: 1;
}
.information-list > a .img,
.information-list button .img {
  overflow: hidden;
  background-color: #fff;
}
.information-list > a .img img,
.information-list button .img img {
  transition: 0.15s transform ease-out;
}
.information-list > a.hover .img img,
.information-list button.hover .img img {
  transform: scale(1.1);
}
.information-list > a.push .img img,
.information-list button.push .img img {
  transition: none;
  opacity: 0.8;
  transform: scale(1.1);
}
.information-list span {
  display: block;
  line-height: 1;
  text-align: left;
}
.information-list .img {
  box-shadow: #00000026 0.05rem 0.05rem 0.2rem;
}
.information-list .date {
  color: #11bee9;
  font-size: 0.5rem;
  margin-top: 0.4166666667rem;
}
.information-list .title {
  color: #101010;
  font-weight: 700;
  font-size: 0.75rem;
  margin-top: 0.2083333333rem;
}
.information-list > *:nth-child(n + 7) {
  display: none;
}
.information-list.all > *:nth-child(n + 7) {
  display: block;
}
.information-more {
  margin-top: 1.6666666667rem;
  text-align: center;
}
.information-more.done {
  display: none;
}
.information-popup > * + * {
  margin-top: 1.5rem;
}
.information-popup div {
  text-align: left;
}
.information-popup .date {
  color: #11bee9;
  font-size: 0.6666666667rem;
}
.information-popup .title {
  margin-top: 0.3333333333rem;
  font-size: 1rem;
  font-weight: 700;
}
.information-popup .content > * + * {
  margin-top: 1rem;
}
.movie-media {
  text-align: center;
  margin-top: 1.6666666667rem;
}
.movie-media > button {
  box-shadow: #00000026 0.05rem 0.05rem 0.2rem;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: 0;
  overflow: hidden;
  background-color: #fff;
}
.movie-media > button.hover,
.movie-media > button.push {
  opacity: 1;
}
.movie-media > button img {
  transition: 0.15s transform ease-out;
}
.movie-media > button.hover img {
  transform: scale(1.08);
}
.movie-media > button.push img {
  transition: none;
  opacity: 0.8;
  transform: scale(1.08);
}
.package-content {
  font-size: 0.75rem;
  margin-top: 1.5rem;
  padding: 0 1rem;
}
.package-content > * + * {
  margin-top: 1.5rem;
}
.package-content .cols > * + * {
  margin-top: 1.5rem;
}
.package-content .item > * + * {
  margin-top: 1rem;
}
.package-content .image-desc {
  font-size: 0.6666666667rem;
  line-height: 1;
  text-align: center;
  margin-top: 0.25rem;
}
.package-content .price small {
  margin-left: 0.25em;
}
.package-heading {
  color: #11bee9;
  border-bottom: #cbf5ff 1px solid;
}
.package-desc > * + * {
  margin-top: 1.5rem;
}
.package-included-list {
  font-size: 0.6666666667rem;
}
.package-dramacd-trial > * {
  text-align: center;
}
.package-dramacd-trial audio {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}
.package-soundtrack-info {
  margin-top: 1.5rem;
  font-size: 0.6666666667rem;
  align-items: center;
}
.package-soundtrack-info > * > * + * {
  margin-top: 1rem;
}
.package-soundtrack-info .track-list {
  line-height: 1;
}
.package-soundtrack-info .track-list > * + * {
  margin-top: 0.5rem;
}
.package-soundtrack-info .track-list li::marker {
  color: #11bee9;
}
.package-soundtrack-info .track-list small {
  display: block;
  margin-top: 0.1rem;
  color: #ff7af6;
}
.package-soundtrack-info .arranger {
  font-size: 0.5833333333rem;
  color: gray;
}
.products-content {
  padding: 0 1rem;
  margin-top: 1.6666666667rem;
}
.products-content > * + * {
  margin-top: 1.6666666667rem;
}
.products-heading {
  text-align: center;
  color: #11bee9;
  margin-top: 3.3333333333rem;
  letter-spacing: 0.1em;
  padding-left: 0.1em;
}
.products-table-info,
.products-table-staff,
.products-table-cast {
  margin-left: auto;
  margin-right: auto;
  font-size: 0.6666666667rem;
}
.products-table-info th,
.products-table-info td,
.products-table-staff th,
.products-table-staff td,
.products-table-cast th,
.products-table-cast td {
  padding: 0.25rem 0;
}
.products-table-info th,
.products-table-staff th,
.products-table-cast th {
  text-align: right;
  font-weight: 400;
}
.products-table-info td,
.products-table-staff td,
.products-table-cast td {
  font-weight: 700;
}
.products-table-info .package-type,
.products-table-staff .package-type,
.products-table-cast .package-type {
  display: inline-block;
  text-align: right;
  width: 4.875rem;
  white-space: nowrap;
  margin-right: 0.1666666667rem;
}
.products-table-info .dash,
.products-table-staff .dash,
.products-table-cast .dash {
  display: inline-block;
  margin-left: 0.1666666667rem;
}
.products-table-info .price,
.products-table-staff .price,
.products-table-cast .price {
  white-space: nowrap;
}
.products-table-info .price small,
.products-table-staff .price small,
.products-table-cast .price small {
  margin-left: 0.25em;
}
.products-info {
  position: relative;
  left: 1rem;
}
.products-cast {
  position: relative;
  left: -1rem;
}
.products-banner {
  max-width: 400px;
  margin-left: auto;
  margin-right: auto;
}
.products-banner a {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: 0;
  overflow: hidden;
  box-shadow: #00000026 0.05rem 0.05rem 0.2rem;
  background-color: #fff;
}
.products-banner a.hover,
.products-banner a.push {
  opacity: 1;
}
.products-banner a img {
  transition: 0.15s transform ease-out;
}
.products-banner a.hover img {
  transform: scale(1.08);
}
.products-banner a.push img {
  transition: none;
  opacity: 0.8;
  transform: scale(1.08);
}
.shop-bonus-list {
  max-width: 880px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1;
  display: flex;
  flex-wrap: wrap;
}
.shop-bonus-list > .shop {
  border-style: solid;
  -o-border-image: url(/rc/frame-text.png) 64 64 stretch;
  border-image: url(/rc/frame-text.png) 64 64 fill stretch;
  border-width: 1rem 1rem;
  padding: 0.25rem;
  box-shadow: #00000026 0.1rem 0.1rem 0.4rem;
  margin: 1rem;
  width: 100%;
}
.shop-bonus-list > .shop.full-width {
  width: 100%;
}
.shop-bonus-list .shop-name {
  font-weight: 700;
  font-size: 1.25rem;
  color: #11bee9;
  margin-bottom: 1.6666666667rem;
}
.shop-bonus-list .shop-name .honorific {
  font-size: 0.8333333333rem;
  margin-left: 0.25em;
}
.shop-bonus-list .shop-name .multiple {
  display: inline-block;
  color: #fff;
  background-color: #11bee9;
  font-size: 0.8333333333rem;
  padding: 0.125rem 0.5rem;
  border-radius: 0.5rem;
  margin-left: 0.75rem;
  position: relative;
  top: -0.125rem;
  white-space: nowrap;
  margin-top: 0.5rem;
}
.shop-bonus-list .items > * + * {
  margin-top: 2.5rem;
}
.shop-bonus-list .char-name {
  text-align: center;
  color: #ff7af6;
  font-weight: 700;
  font-size: 0.8333333333rem;
}
.shop-bonus-list .item-name {
  text-align: center;
  font-size: 0.6666666667rem;
  margin-top: 0.3333333333rem;
}
.shop-bonus-list .img {
  margin-top: 0.8333333333rem;
  max-width: 400px;
  margin-left: auto;
  margin-right: auto;
}
.shop-bonus-list .link {
  margin-top: 0.8333333333rem;
  text-align: center;
}
.special-list-container {
  max-width: 48.6666666667rem;
  margin-left: auto;
  margin-right: auto;
}
.special-list {
  display: flex;
  flex-wrap: wrap;
  padding: 0.8333333333rem;
}
.special-list > * {
  margin: 0.8333333333rem;
  width: calc(100% - 1.6666666667rem);
}
.special-list img {
  width: 100%;
}
.special-list > a {
  text-decoration: none;
}
.special-list > a,
.special-list button {
  color: inherit;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: 0;
}
.special-list > a.hover,
.special-list > a.push,
.special-list button.hover,
.special-list button.push {
  opacity: 1;
}
.special-list > a .img,
.special-list button .img {
  overflow: hidden;
  background-color: #fff;
}
.special-list > a .img img,
.special-list button .img img {
  transition: 0.15s transform ease-out;
}
.special-list > a.hover .img img,
.special-list button.hover .img img {
  transform: scale(1.1);
}
.special-list > a.push .img img,
.special-list button.push .img img {
  transition: none;
  opacity: 0.8;
  transform: scale(1.1);
}
.special-list span {
  display: block;
  line-height: 1;
  text-align: left;
}
.special-list .img {
  box-shadow: #00000026 0.05rem 0.05rem 0.2rem;
}
.special-list .title {
  color: #101010;
  font-weight: 700;
  font-size: 0.75rem;
  margin-top: 0.2083333333rem;
}
.scroll-effect {
  position: relative;
}
.scroll-effect .bg {
  position: -webkit-sticky;
  position: sticky;
  left: 0;
  top: 0;
  width: 100%;
  pointer-events: none;
  z-index: 20;
}
.scroll-effect .bg .img {
  position: relative;
  z-index: 1;
  display: block;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}
.barba-container.leave .scroll-effect .bg {
  visibility: hidden;
}
.scroll-effect .fill {
  position: absolute;
  left: 0;
  top: -5vw;
  width: 100%;
  height: 100%;
  z-index: 10;
  background: rgba(255, 255, 255, 0);
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0) 0%,
    white 5%,
    white 95%,
    rgba(255, 255, 255, 0) 100%
  );
}
.story-text {
  position: relative;
  z-index: 30;
  padding: 0 1rem calc(1000px + 5rem);
  font-size: 0.8333333333rem;
}
.story-text > * + * {
  margin-top: 1.5rem;
}
.story-text p {
  text-align: center;
  line-height: 2;
  text-shadow:
    transparent 0 0 0,
    #fff 0 0 0.1em,
    #fff 0 0 0.1em,
    #fff 0 0 0.2em,
    #fff 0 0 0.3em,
    #fff 0 0 0.4em,
    #fff 0 0 0.5em,
    #fff 0 0 0.6em,
    #fff 0 0 0.7em,
    #fff 0 0 0.8em,
    #fff 0 0 0.9em;
}
.story-text .male {
  color: #449cf3;
}
.story-text .female {
  color: #ff7af6;
}
.story-text [data-ruby] {
  position: relative;
  display: inline-block;
}
.story-text [data-ruby]:before {
  content: attr(data-ruby);
  font-size: 0.4166666667rem;
  position: absolute;
  left: -50%;
  width: 200%;
  text-shadow: none;
  white-space: nowwap;
  text-shadow:
    transparent 0 0 0,
    #fff 0 0 0.1em,
    #fff 0 0 0.1em,
    #fff 0 0 0.2em,
    #fff 0 0 0.3em,
    #fff 0 0 0.4em,
    #fff 0 0 0.5em,
    #fff 0 0 0.6em,
    #fff 0 0 0.7em,
    #fff 0 0 0.8em,
    #fff 0 0 0.9em;
  transform-origin: center top;
  top: -0.7em;
  transform: scale(0.6);
}
html.ios .story-text [data-ruby]:before,
html.android .story-text [data-ruby]:before {
  transform: scale(1);
}
.story-text [data-ruby][data-wide]:before {
  letter-spacing: 0.5em;
  padding-left: 0.5em;
}
.article.top {
  background-color: #fff;
  overflow: hidden;
  position: relative;
  max-width: 1671.8367346939px;
  margin-left: auto;
  margin-right: auto;
  box-shadow: #00000026 0.25rem 0.25rem 0.5rem;
}
.top-mainvisual-container {
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
.top-mainvisual {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 74.7448979592%;
}
.top-mainvisual .logo {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 6.8259385666%;
  bottom: auto;
  width: 33.1632653061%;
  height: auto;
  z-index: 20;
  display: none;
}
.top-mainvisual .logo,
.top-mainvisual .logo img {
  max-width: none;
  vertical-align: top;
}
.top-mainvisual .catch {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 51.1945392491%;
  bottom: auto;
  width: 58.6224489796%;
  height: auto;
  z-index: 20;
}
.top-mainvisual .catch,
.top-mainvisual .catch img {
  max-width: none;
  vertical-align: top;
}
.top-mainvisual .illust {
  position: absolute;
  left: -15.306122449%;
  right: auto;
  margin: 0;
  top: 0%;
  bottom: auto;
  width: 130.612244898%;
  height: auto;
  z-index: 10;
  transform-origin: 50% 0%;
}
.top-mainvisual .illust,
.top-mainvisual .illust img {
  max-width: none;
  vertical-align: top;
}
.top-mainvisual .light {
  position: absolute;
  display: inline-block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.top-mainvisual .dark {
  position: absolute;
  display: inline-block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  transition: opacity 0.2s ease;
}
.top-mainvisual.light .dark {
  opacity: 0;
}
.top-mainvisual-change {
  position: absolute;
  color: #fff;
  z-index: 10;
  display: flex;
  align-items: center;
  padding: 0.25rem 1rem 0.25rem 0.25rem;
  line-height: 1;
  font-size: 0.7083333333rem;
  right: 0;
  text-shadow: rgba(0, 0, 0, 0.5) 0 0 0.5rem;
  top: auto;
  bottom: 0.5rem;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: 0;
}
.top-mainvisual-change:after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background-color: #ffffff80;
  transition: transform 0.2s ease;
}
.top-mainvisual-change .svg-icon {
  width: 1rem;
  height: 1rem;
  position: relative;
  top: 0rem;
  margin-right: 0.2rem;
  -webkit-animation: top-mv-arrow 0.5s linear 0s infinite alternate;
  animation: top-mv-arrow 0.5s linear 0s infinite alternate;
}
@-webkit-keyframes top-mv-arrow {
  0% {
    transform: translate3d(10%, 0, 0);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }
  to {
    transform: translate3d(-10%, 0, 0);
  }
}
@keyframes top-mv-arrow {
  0% {
    transform: translate3d(10%, 0, 0);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }
  to {
    transform: translate3d(-10%, 0, 0);
  }
}
.top-mainvisual-change .svg-line {
  stroke: #fff;
  stroke-width: 4px;
}
.top-mainvisual-change.hover,
.top-mainvisual-change.push {
  opacity: 1;
}
.top-mainvisual-change.hover:after {
  transform: translate3d(100%, 0, 0);
}
.top-mainvisual-change.push {
  opacity: 0.5;
}
.world-popup-content div {
  text-align: left;
}
.world-popup-content .name {
  color: #449cf3;
  font-size: 1rem;
  font-weight: 700;
}
.world-popup-content .name [data-ruby] {
  position: relative;
  display: inline-block;
  text-align: center;
}
.world-popup-content .name [data-ruby]:before {
  content: attr(data-ruby);
  font-size: 0.4166666667rem;
  position: absolute;
  left: -50%;
  width: 200%;
  text-shadow: none;
  white-space: nowwap;
  font-weight: 400;
  top: -1.1em;
  transform: scale(0.6);
}
html.ios .world-popup-content .name [data-ruby]:before,
html.android .world-popup-content .name [data-ruby]:before {
  transform: scale(1);
}
.world-popup-content .name [data-ruby][data-wide]:before {
  letter-spacing: 0.5em;
  padding-left: 0.5em;
}
.world-popup-content .desc {
  line-height: 1.5;
  text-align: justify;
  text-justify: inter-ideograph;
}
.world-popup-img {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 56.25%;
  overflow: hidden;
}
.world-popup-img img {
  position: absolute;
  left: 0;
  bottom: 0;
  transform-origin: center top;
  -webkit-animation: world-popup-img 5s linear 0s 1 normal both;
  animation: world-popup-img 5s linear 0s 1 normal both;
}
@-webkit-keyframes world-popup-img {
  0% {
    transform: scale(1.5);
    -webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
    animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
  }
  to {
    transform: scale(1);
  }
}
@keyframes world-popup-img {
  0% {
    transform: scale(1.5);
    -webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
    animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
  }
  to {
    transform: scale(1);
  }
}
.world-popup-img img.world-01 {
  -webkit-animation: world-popup-img-island 6s linear 0s 1 normal both;
  animation: world-popup-img-island 6s linear 0s 1 normal both;
}
@-webkit-keyframes world-popup-img-island {
  0% {
    transform: translate3d(0, 50%, 0) scale(1.2);
    -webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
    animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
  }
  to {
    transform: translateZ(0) scale(1);
  }
}
@keyframes world-popup-img-island {
  0% {
    transform: translate3d(0, 50%, 0) scale(1.2);
    -webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
    animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
  }
  to {
    transform: translateZ(0) scale(1);
  }
}
.world-container {
  max-width: 1200px;
  margin-top: 1.6666666667rem;
  margin-left: auto;
  margin-right: auto;
}
.world-map {
  box-shadow: #00000026 0.25rem 0.25rem 0.5rem;
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 50.8116883117%;
}
.world-map > * {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.world-map .links {
  z-index: 3;
}
.world-map .links img {
  width: 100%;
}
.world-map .links .menu {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.world-menu-label {
  align-items: center;
  background-color: #fff;
  border-radius: 999px;
  color: #101010;
  font-size: 0.6rem;
  font-weight: 700;
  justify-content: center;
  letter-spacing: 0.06em;
  line-height: 1;
  padding: 0 10% 0 38%;
  text-align: center;
  white-space: nowrap;
}
.world-map .links .world-menu-label {
  display: inline-flex;
}
.world-map .links .world-06 .world-menu-label {
  padding-left: 45%;
}
.world-map .links .img {
  border-radius: 100%;
  overflow: hidden;
}
.world-map .links .img img {
  position: absolute;
  left: -38.8888888889%;
  bottom: 0;
  width: 177.7777777778%;
  transform-origin: top center;
}
.world-map .links button {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: inline-block;
  transform: scale(1.6);
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: 0;
}
.world-map .links button.hover,
.world-map .links button.push {
  opacity: 1;
}
.world-map .links button .img {
  overflow: hidden;
  background-color: #fff;
}
.world-map .links button .img img {
  transition: 0.15s transform ease-out;
}
.world-map .links button.hover .img img {
  transform: scale(1.5);
}
.world-map .links button.push .img img {
  transition: none;
  opacity: 0.8;
  transform: scale(1.5);
}
.world-map .links .link {
  transform: scale(0);
  transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition-delay: 0.4s;
}
.world-map .links .world-01 {
  position: absolute;
  left: 6.25%;
  right: auto;
  margin: 0;
  top: 8.4664536741%;
  bottom: auto;
  width: 12.5%;
  height: 9.5846645367%;
  z-index: 10;
}
.world-map .links .world-01,
.world-map .links .world-01 img {
  max-width: none;
  vertical-align: top;
}
.world-map .links .world-01 .img {
  position: absolute;
  left: 1.9480519481%;
  right: auto;
  margin: 0;
  top: 5%;
  bottom: auto;
  width: 35.0649350649%;
  height: 90%;
  z-index: 10;
}
.world-map .links .world-01 .img,
.world-map .links .world-01 .img img {
  max-width: none;
  vertical-align: top;
}
.world-map .links .world-01 .img img {
  transform-origin: 50% 50%;
}
.world-map .links .world-02 {
  position: absolute;
  left: 78.8149350649%;
  right: auto;
  margin: 0;
  top: 47.7635782748%;
  bottom: auto;
  width: 13.7987012987%;
  height: 9.5846645367%;
  z-index: 10;
}
.world-map .links .world-02,
.world-map .links .world-02 img {
  max-width: none;
  vertical-align: top;
}
.world-map .links .world-02 .img {
  position: absolute;
  left: 1.7647058824%;
  right: auto;
  margin: 0;
  top: 5%;
  bottom: auto;
  width: 31.7647058824%;
  height: 90%;
  z-index: 10;
}
.world-map .links .world-02 .img,
.world-map .links .world-02 .img img {
  max-width: none;
  vertical-align: top;
}
.world-map .links .world-03 {
  position: absolute;
  left: 78.8961038961%;
  right: auto;
  margin: 0;
  top: 11.3418530351%;
  bottom: auto;
  width: 13.7987012987%;
  height: 9.5846645367%;
  z-index: 10;
}
.world-map .links .world-03,
.world-map .links .world-03 img {
  max-width: none;
  vertical-align: top;
}
.world-map .links .world-03 .img {
  position: absolute;
  left: 1.7647058824%;
  right: auto;
  margin: 0;
  top: 5%;
  bottom: auto;
  width: 31.7647058824%;
  height: 90%;
  z-index: 10;
}
.world-map .links .world-03 .img,
.world-map .links .world-03 .img img {
  max-width: none;
  vertical-align: top;
}
.world-map .links .world-04 {
  position: absolute;
  left: 58.1980519481%;
  right: auto;
  margin: 0;
  top: 6.5495207668%;
  bottom: auto;
  width: 11.2012987013%;
  height: 9.5846645367%;
  z-index: 10;
}
.world-map .links .world-04,
.world-map .links .world-04 img {
  max-width: none;
  vertical-align: top;
}
.world-map .links .world-04 .img {
  position: absolute;
  left: 2.1739130435%;
  right: auto;
  margin: 0;
  top: 5%;
  bottom: auto;
  width: 39.1304347826%;
  height: 90%;
  z-index: 10;
}
.world-map .links .world-04 .img,
.world-map .links .world-04 .img img {
  max-width: none;
  vertical-align: top;
}
.world-map .links .world-05 {
  position: absolute;
  left: 28.6525974026%;
  right: auto;
  margin: 0;
  top: 80.0319488818%;
  bottom: auto;
  width: 11.2012987013%;
  height: 9.5846645367%;
  z-index: 10;
}
.world-map .links .world-05,
.world-map .links .world-05 img {
  max-width: none;
  vertical-align: top;
}
.world-map .links .world-05 .img {
  position: absolute;
  left: 2.1739130435%;
  right: auto;
  margin: 0;
  top: 5%;
  bottom: auto;
  width: 39.1304347826%;
  height: 90%;
  z-index: 10;
}
.world-map .links .world-05 .img,
.world-map .links .world-05 .img img {
  max-width: none;
  vertical-align: top;
}
.world-map .links .world-06 {
  position: absolute;
  left: 34.9025974026%;
  right: auto;
  margin: 0;
  top: 16.7731629393%;
  bottom: auto;
  width: 9.9025974026%;
  height: 9.5846645367%;
  z-index: 10;
}
.world-map .links .world-06,
.world-map .links .world-06 img {
  max-width: none;
  vertical-align: top;
}
.world-map .links .world-06 .img {
  position: absolute;
  left: 2.4590163934%;
  right: auto;
  margin: 0;
  top: 5%;
  bottom: auto;
  width: 44.262295082%;
  height: 90%;
  z-index: 10;
}
.world-map .links .world-06 .img,
.world-map .links .world-06 .img img {
  max-width: none;
  vertical-align: top;
}
.world-map .links .world-07 {
  position: absolute;
  left: 56.25%;
  right: auto;
  margin: 0;
  top: 78.2747603834%;
  bottom: auto;
  width: 11.2012987013%;
  height: 9.5846645367%;
  z-index: 10;
}
.world-map .links .world-07,
.world-map .links .world-07 img {
  max-width: none;
  vertical-align: top;
}
.world-map .links .world-07 .img {
  position: absolute;
  left: 2.1739130435%;
  right: auto;
  margin: 0;
  top: 5%;
  bottom: auto;
  width: 39.1304347826%;
  height: 90%;
  z-index: 10;
}
.world-map .links .world-07 .img,
.world-map .links .world-07 .img img {
  max-width: none;
  vertical-align: top;
}
.world-map .lines {
  z-index: 2;
  pointer-events: none;
}
.world-map .lines line,
.world-map .lines circle {
  stroke: #fff;
  stroke-width: 3px;
  fill: none;
}
.world-map .lines line {
  stroke-linecap: round;
}
.world-map .lines .flare {
  stroke-width: 1px;
  -webkit-animation: world-map-flare 1.2s linear 0s infinite normal;
  animation: world-map-flare 1.2s linear 0s infinite normal;
}
@-webkit-keyframes world-map-flare {
  0% {
    transform: scale(1);
    opacity: 0.8;
  }
  50% {
    transform: scale(1.75);
    opacity: 0.8;
  }
  to {
    transform: scale(2.5);
    opacity: 0;
  }
}
@keyframes world-map-flare {
  0% {
    transform: scale(1);
    opacity: 0.8;
  }
  50% {
    transform: scale(1.75);
    opacity: 0.8;
  }
  to {
    transform: scale(2.5);
    opacity: 0;
  }
}
.world-map .lines .flare-01 {
  transform-origin: 36.7694805195% 46.1661341853%;
}
.world-map .lines .flare-02 {
  transform-origin: 61.2824675325% 33.8658146965%;
}
.world-map .lines .flare-03 {
  transform-origin: 61.8506493506% 27.9552715655%;
}
.world-map .lines .flare-04 {
  transform-origin: 82.4675324675% 32.428115016%;
}
.world-map .lines .flare-05 {
  transform-origin: 76.0551948052% 33.8658146965%;
}
.world-map .lines .flare-06 {
  transform-origin: 74.4318181818% 40.4153354633%;
}
.world-map .lines .flare-07 {
  transform-origin: 53.9772727273% 53.5143769968%;
}
.world-map .lines .line {
  transition: stroke-dashoffset 0.4s linear;
}
.world-map .lines .line-01 {
  stroke-dasharray: 353.8983657775px;
  stroke-dashoffset: 353.8983657775px;
  transition-delay: 0.15s;
}
.world-map .lines .line-02 {
  stroke-dasharray: 265.8860000075px;
  stroke-dashoffset: 265.8860000075px;
}
.world-map .lines .line-03 {
  stroke-dasharray: 97.8768460873px;
  stroke-dashoffset: 97.8768460873px;
}
.world-map .lines .line-04 {
  stroke-dasharray: 101.1818264314px;
  stroke-dashoffset: 101.1818264314px;
}
.world-map .lines .line-05 {
  stroke-dasharray: 159.0905566022px;
  stroke-dashoffset: 159.0905566022px;
}
.world-map .lines .line-06 {
  stroke-dasharray: 300.4402344893px;
  stroke-dashoffset: 300.4402344893px;
}
.world-map .lines .line-07 {
  stroke-dasharray: 303.6526504083px;
  stroke-dashoffset: 303.6526504083px;
}
.world-map .bg {
  z-index: 1;
  pointer-events: none;
}
.world-map.in-view-enter .line {
  stroke-dashoffset: 0;
}
.world-map.in-view-enter .link {
  transform: scale(1);
}
.world-keywords {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 3.2467532468%;
}
.world-keywords > * + * {
  margin-left: 3.2467532468%;
}
.world-keywords .label {
  color: #11bee9;
  font-size: 0.8333333333rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}
.world-keywords img {
  width: 100%;
}
.world-keywords .menu {
  z-index: 1;
}
.world-keywords .world-menu-label {
  aspect-ratio: 154 / 60;
  display: inline-flex;
  width: 100%;
}
.world-keywords .world-09 .world-menu-label {
  padding-left: 38%;
}
.world-keywords .img {
  border-radius: 100%;
  overflow: hidden;
}
.world-keywords .img img {
  position: absolute;
  left: -38.8888888889%;
  bottom: 0;
  width: 177.7777777778%;
  transform-origin: top center;
}
.world-keywords button {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: 0;
  border-radius: 100px;
  display: inline-block;
  box-shadow: #00000026 0.25rem 0.25rem 0.5rem;
  position: relative;
}
.world-keywords button.hover,
.world-keywords button.push {
  opacity: 1;
}
.world-keywords button .img {
  overflow: hidden;
  background-color: #fff;
}
.world-keywords button .img img {
  transition: 0.15s transform ease-out;
}
.world-keywords button.hover .img img {
  transform: scale(1.5);
}
.world-keywords button.push .img img {
  transition: none;
  opacity: 0.8;
  transform: scale(1.5);
}
.world-keywords .world-08 {
  width: 20%;
}
.world-keywords .world-08 .img {
  position: absolute;
  left: 1.9480519481%;
  right: auto;
  margin: 0;
  top: 5%;
  bottom: auto;
  width: 35.0649350649%;
  height: 90%;
  z-index: 10;
}
.world-keywords .world-08 .img,
.world-keywords .world-08 .img img {
  max-width: none;
  vertical-align: top;
}
.world-keywords .world-09 {
  width: 20%;
}
.world-keywords .world-09 .img {
  position: absolute;
  left: 1.9480519481%;
  right: auto;
  margin: 0;
  top: 5%;
  bottom: auto;
  width: 35.0649350649%;
  height: 90%;
  z-index: 10;
}
.world-keywords .world-09 .img,
.world-keywords .world-09 .img img {
  max-width: none;
  vertical-align: top;
}
.text-center {
  text-align: center;
}
.video-container {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 56.25%;
  background-color: #000;
}
.video-container iframe {
  position: absolute;
  display: inline-block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
}
.br-only-s {
  display: inline;
}
.article-content > * + * {
  margin-top: 3.3333333333rem;
}
.article-heading {
  background-image: url(/rc/article-heading.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
  z-index: 50;
  text-align: center;
  width: 100%;
  height: 13.3116883117vw;
  padding-top: 1vw;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  margin-bottom: calc(3rem - 3vw);
}
.article-heading span {
  line-height: 1;
}
.article-heading .single,
.article-heading .en {
  color: #449cf3;
  letter-spacing: 0.1em;
  text-shadow:
    transparent 0 0 0,
    #fff 0.1em 0em 0,
    #fff 0.0923879533em 0.0382683432em 0,
    #fff 0.0707106781em 0.0707106781em 0,
    #fff 0.0382683432em 0.0923879533em 0,
    #fff 0em 0.1em 0,
    #fff -0.0382683432em 0.0923879533em 0,
    #fff -0.0707106781em 0.0707106781em 0,
    #fff -0.0923879533em 0.0382683432em 0,
    #fff -0.1em 0em 0,
    #fff -0.0923879532em -0.0382683432em 0,
    #fff -0.0707106771em -0.0707106779em 0,
    #fff -0.038268335em -0.0923879517em 0,
    #fff 0.0000000554em -0.0999999886em 0,
    #fff 0.0382686632em -0.092387882em 0,
    #fff 0.0707123001em -0.0707102888em 0,
    #fff 0.0923952958em -0.0382664536em 0;
}
.article-heading .single {
  font-size: 1.4583333333rem;
}
.article-heading .single small {
  font-size: 50%;
}
.article-heading .en {
  font-size: 1.6666666667rem;
}
.article-heading .jp {
  font-size: 0.6666666667rem;
  margin-top: 0.3333333333rem;
  color: #ff8cf7;
  text-shadow:
    transparent 0 0 0,
    #fff 0.2em 0em 0,
    #fff 0.1847759065em 0.0765366865em 0,
    #fff 0.1414213562em 0.1414213562em 0,
    #fff 0.0765366865em 0.1847759065em 0,
    #fff 0em 0.2em 0,
    #fff -0.0765366865em 0.1847759065em 0,
    #fff -0.1414213562em 0.1414213562em 0,
    #fff -0.1847759065em 0.0765366865em 0,
    #fff -0.2em 0em 0,
    #fff -0.1847759063em -0.0765366864em 0,
    #fff -0.1414213542em -0.1414213559em 0,
    #fff -0.07653667em -0.1847759034em 0,
    #fff 0.0000001107em -0.1999999772em 0,
    #fff 0.0765373264em -0.1847757639em 0,
    #fff 0.1414246001em -0.1414205775em 0,
    #fff 0.1847905916em -0.0765329072em 0;
}
.article.padding-top {
  padding-top: calc(6rem - 3vw);
}
.article.characters,
.article.world,
.article.special,
.article.products {
  position: relative;
  z-index: 50;
}
.article.characters {
  margin-top: calc(3.3333333333rem - 1000px);
}
.back-to-top {
  position: fixed;
  width: 2.5rem;
  height: 2.5rem;
  bottom: 0.25rem;
  right: 0.25rem;
  z-index: 900;
  cursor: pointer;
  transition: none;
  visibility: hidden;
  opacity: 0;
  transform: scale(0.5);
}
body.loaded .back-to-top {
  transition:
    visibility 0.3s,
    opacity 0.3s,
    transform 0.3s;
}
.back-to-top.active {
  visibility: visible;
  opacity: 1;
  transform: scale(1);
}
body.disable-scroll .back-to-top.active {
  transition: none;
  opacity: 0;
}
.back-to-top a {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.back-to-top .svg-icon {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  transform: rotate(-90deg) translate(7%);
  filter: drop-shadow(0 0 1px #fff) drop-shadow(0 0 2px #fff)
    drop-shadow(0 0 3px #fff) drop-shadow(0 0 4px #fff);
}
.back-to-top .svg-line {
  stroke: #2acef3;
  stroke-width: 1px;
}
.button-horizontal {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  width: 9.1666666667rem;
  height: 2.3333333333rem;
  background-color: transparent;
  border: none;
  background-image: url(/rc/buttun-horizontal.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  font-size: 0.6666666667rem;
  letter-spacing: 0.2em;
  padding-left: 0.2em;
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: 0;
}
.button-horizontal,
.button-horizontal:visited {
  color: #fff;
}
.button-horizontal.gray {
  filter: grayscale(1);
}
.button-horizontal.gray,
.button-horizontal.gray.hover,
.button-horizontal.gray.push {
  opacity: 0.7;
}
.button-horizontal.small {
  width: 7.3333333333rem;
  height: 1.8666666667rem;
  font-size: 0.5333333333rem;
}
.button-horizontal > span {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  transition: 0.15s transform ease-out;
}
.button-horizontal small {
  margin-top: 0.3em;
  letter-spacing: 0.1em;
}
.button-horizontal.hover,
.button-horizontal.push {
  opacity: 1;
}
.button-horizontal.hover > span {
  transform: scale(1.1);
}
.button-horizontal.push > span {
  transition: none;
  opacity: 0.8;
  transform: scale(1.1);
}
.clickable,
.clickable-container > * {
  cursor: pointer;
  transition:
    color 0.2s ease,
    background 0.2s ease,
    border 0.2s ease,
    box-shadow 0.2s ease,
    fill 0.2s ease,
    letter-spacing 0.2s ease,
    opacity 0.2s ease,
    text-shadow 0.2s ease,
    transform 0.2s ease;
}
.clickable > *,
.clickable-container > * > * {
  pointer-events: none;
}
.fixed-full-width {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  min-width: 320px;
}
body.admin-bar .fixed-full-width {
  top: 46px;
}
.frame-content {
  position: relative;
}
.frame-content > .content {
  position: relative;
  z-index: 2;
  padding: 1.5rem;
}
.frame-content > .content > * + * {
  margin-top: 1.5rem;
}
.frame-content > .frame {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  border-style: solid;
  -o-border-image: url(/rc/frame-text.png) 64 64 stretch;
  border-image: url(/rc/frame-text.png) 64 64 fill stretch;
  border-width: 1rem 1rem;
}
.frame-content.shadow {
  box-shadow: #00000026 0.1rem 0.1rem 0.4rem;
}
.global-menu-toggle {
  right: 0.3333333333rem;
}
.global-menu-toggle .svg-icon {
  width: 50%;
  top: 21%;
}
.global-menu-toggle .svg-line {
  stroke: #fff;
  stroke-width: 1.5px;
}
.global-menu-toggle .open {
  display: block;
}
.global-menu-toggle .close,
body.menu-open .global-menu-toggle .open {
  display: none;
}
body.menu-open .global-menu-toggle .close {
  display: block;
}
.global-menu-content {
  opacity: 0;
  transform: scale(1.2);
  pointer-events: none;
  transition: none;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 910;
  width: 100vw;
  height: 100vh;
  height: calc(var(--vh, 1vh) * 100);
  overflow-y: scroll;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: 5rem 0;
}
body.loaded .global-menu-content {
  transition:
    transform 0.2s,
    opacity 0.2s;
}
body.menu-open .global-menu-content {
  opacity: 1;
  transform: scale(1);
  pointer-events: auto;
}
body.resizing-x .global-menu-content {
  transition: none;
}
.global-menu-content .inner {
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.global-menu-content .logo {
  width: 12.5rem;
}
.global-menu-content .menu {
  margin-top: 2rem;
}
.global-menu-content .menu > * + * {
  margin-top: 1.6666666667rem;
}
.global-menu-content .menu a {
  display: block;
  line-height: 1;
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: 0;
}
.global-menu-content .menu a:hover {
  text-decoration: none;
}
.global-menu-content .menu a span {
  display: block;
}
.global-menu-content .menu a.hover,
.global-menu-content .menu a.push {
  opacity: 1;
}
.global-menu-content .menu a .en {
  transition: 0.15s text-shadow ease-out;
}
.global-menu-content .menu a .jp {
  transition: 0.15s color ease-out;
}
.global-menu-content .menu a.hover .en,
.global-menu-content .menu a.push .en {
  text-shadow:
    rgba(203, 245, 255, 0.5) 0 0 0.25em,
    rgba(203, 245, 255, 0.5) 0 0 0.5em,
    rgba(203, 245, 255, 0.5) 0 0 0.75em,
    rgba(203, 245, 255, 0.5) 0 0 1em;
}
.global-menu-content .menu a.hover .jp,
.global-menu-content .menu a.push .jp {
  color: #fff;
}
.global-menu-content .menu a.push {
  opacity: 0.8;
}
.global-menu-content .menu a.push .en,
.global-menu-content .menu a.push .jp {
  transition: none;
}
.global-menu-content .menu .en {
  font-size: 1.0416666667rem;
  color: #fff;
  letter-spacing: 0.05em;
}
.global-menu-content .menu .jp {
  margin-top: 0.5rem;
  font-size: 10px;
  color: #5ee1ff;
}
.global-menu-bg {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  z-index: 98;
  background-color: #449cf3f2;
  background-image: url(/rc/menu-bg.png);
  background-position: center;
  background-size: cover;
  transition: opacity 0.2s ease;
  opacity: 0;
  pointer-events: none;
}
body.menu-open .global-menu-bg {
  opacity: 1;
  pointer-events: inherit;
}
.site-loading {
  transition-property: opacity, visibility;
  transition-duration: 0.5s, 1ms;
  transition-delay: 0s, 0.5s;
  opacity: 1;
}
body.loaded .site-loading {
  opacity: 0;
}
body.fade-out .site-loading {
  opacity: 1;
}
.popup-item {
  font-size: 0.6666666667rem;
  display: none;
}
.popup-item.is-open {
  display: block;
}
.popup-overlay {
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  z-index: 3000;
  padding: 4.2916666667rem 0.5rem 3rem;
  overflow-y: auto;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.95);
}
.popup-overlay.black {
  background: rgba(0, 0, 0, 0.95);
}
.popup-overlay.blue {
  background: rgba(203, 245, 255, 0.95);
}
.popup-overlay.blue .popup-content {
  box-shadow: #449cf326 0.5rem 0.5rem 1rem;
}
.popup-content {
  width: 100%;
  max-width: 800px;
  margin: auto;
}
.popup-content.inline {
  background-color: #fff;
}
.popup-content.video {
  max-width: 1200px;
}
.popup-content.image img {
  width: 100%;
}
.popup-content.initial {
  max-width: 560px;
}
.popup-close {
  position: absolute;
  top: -3.9583333333rem;
  right: 0;
}
.popup-close .svg-icon {
  width: 50%;
  top: 21%;
}
.popup-close .svg-line {
  stroke-width: 2px;
}
@-webkit-keyframes mmfadeIn {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes mmfadeIn {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes mmfadeOut {
  0% {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes mmfadeOut {
  0% {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@-webkit-keyframes mmslideIn {
  0% {
    transform: translateY(100px);
  }
  to {
    transform: translateY(0);
  }
}
@keyframes mmslideIn {
  0% {
    transform: translateY(100px);
  }
  to {
    transform: translateY(0);
  }
}
@-webkit-keyframes mmslideOut {
  0% {
    transform: translateY(0);
  }
  to {
    transform: translateY(-100px);
  }
}
@keyframes mmslideOut {
  0% {
    transform: translateY(0);
  }
  to {
    transform: translateY(-100px);
  }
}
.popup-item[aria-hidden="false"] .popup-overlay {
  -webkit-animation: mmfadeIn 0.3s cubic-bezier(0, 0, 0.2, 1);
  animation: mmfadeIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}
.popup-item[aria-hidden="false"] .popup-content {
  -webkit-animation: mmslideIn 0.3s cubic-bezier(0, 0, 0.2, 1);
  animation: mmslideIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}
.popup-item[aria-hidden="true"] .popup-overlay {
  -webkit-animation: mmfadeOut 0.3s cubic-bezier(0, 0, 0.2, 1);
  animation: mmfadeOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}
.popup-item[aria-hidden="true"] .popup-content {
  -webkit-animation: mmslideOut 0.3s cubic-bezier(0, 0, 0.2, 1);
  animation: mmslideOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}
.popup-content,
.popup-overlay {
  will-change: transform;
}
[data-popup-inline-content],
[data-popup-world-content],
[data-popup-swiper-content] {
  display: none;
}
.popup-sound-content .logo img {
  width: 10rem;
  margin-left: auto;
  margin-right: auto;
}
.popup-sound-content .attention {
  margin-top: 0.6666666667rem;
  text-align: center;
}
.popup-sound-content .buttons {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.popup-sound-content .buttons .on {
  order: 1;
}
.popup-sound-content .buttons .off {
  order: 2;
  margin-top: 0.8333333333rem;
}
.sakura-effect {
  pointer-events: none;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 29;
  width: 100vh;
  height: 100vh;
}
body::-webkit-scrollbar,
.global-menu-content::-webkit-scrollbar,
.popup-overlay::-webkit-scrollbar {
  width: 12px;
}
body::-webkit-scrollbar-track,
.global-menu-content::-webkit-scrollbar-track,
.popup-overlay::-webkit-scrollbar-track {
  background-color: transparent;
}
body::-webkit-scrollbar-thumb,
.global-menu-content::-webkit-scrollbar-thumb,
.popup-overlay::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 100px;
  background-clip: content-box;
  background-color: #2acef399;
}
.popup-overlay::-webkit-scrollbar-thumb {
  background-color: #11bee9;
}
.section-container {
  max-width: 880px;
  margin-left: auto;
  margin-right: auto;
}
.section-container > * + * {
  margin-top: 3.3333333333rem;
}
.section-container.wide {
  max-width: 1200px;
}
.section-content {
  padding: 0 1rem;
}
.section-heading {
  color: #11bee9;
  text-align: center;
  font-size: 1.1666666667rem;
  letter-spacing: 0.1em;
  padding: 0 0.5em;
  display: flex;
  justify-content: center;
  align-items: center;
}
.section-heading .icon-left,
.section-heading .icon-right {
  fill: #fcbff5;
  width: 1.1666666667rem;
}
.section-heading .icon-right {
  transform: scaleX(-1);
}
.section-heading .text {
  margin-left: 0.8em;
  margin-right: 0.7em;
  position: relative;
  top: -0.0833333333rem;
}
::-moz-selection {
  color: inherit;
  background-color: #cbf5ffb3;
  text-shadow: none;
}
::selection {
  color: inherit;
  background-color: #cbf5ffb3;
  text-shadow: none;
}
.social-buttons {
  display: flex;
  justify-content: flex-start;
}
.social-buttons > * + * {
  margin-left: 0.75rem;
}
.social-buttons a {
  display: block;
  position: relative;
}
.social-buttons a:hover {
  opacity: 0.7;
}
.social-buttons svg {
  pointer-events: none;
  display: inline-block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.social-buttons .svg-icon {
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
}
.social-buttons .svg-icon path {
  fill: #2acef3;
}
.svg-icon {
  display: inline-block;
  width: 1.5em;
  height: 1.5em;
}
.svg-icon svg {
  width: 100%;
}
.svg-line {
  fill: none;
  stroke: #000;
  stroke-miterlimit: 10;
  stroke-width: 2px;
}
.svg-line.crisp {
  shape-rendering: crispEdges;
}
.swiper-container {
  max-width: 880px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
.swiper {
  width: 100%;
  background-color: #fff;
}
.swiper-slide img {
  width: 100%;
}
.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  bottom: -44px;
}
.swiper-pagination-bullet {
  background-color: #11bee9;
}
.swiper-button-prev,
.swiper-button-next {
  color: #11bee9;
  top: auto;
  bottom: -60px;
}
.swiper-button-prev.hover,
.swiper-button-next.hover {
  opacity: 0.7;
}
.swiper-button-prev.push,
.swiper-button-next.push {
  transition: none;
  opacity: 0.5;
}
.swiper-button-prev {
  left: 0;
}
.swiper-button-next {
  right: 0;
}
.zoom-img-container {
  position: relative;
}
.zoom-img-container button {
  position: absolute;
  right: 0.3333333333rem;
  bottom: 0.3333333333rem;
  width: 2.0833333333rem;
  height: 2.0833333333rem;
  background-color: #11bee9;
  border-radius: 100%;
  -webkit-animation: zoom-img-icon 1s linear 0s infinite alternate;
  animation: zoom-img-icon 1s linear 0s infinite alternate;
  filter: drop-shadow(0 0 1px rgba(255, 255, 255, 0.6))
    drop-shadow(0 0 2px rgba(255, 255, 255, 0.6))
    drop-shadow(0 0 3px rgba(255, 255, 255, 0.6))
    drop-shadow(0 0 4px rgba(255, 255, 255, 0.6));
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: 0;
}
@-webkit-keyframes zoom-img-icon {
  0% {
    transform: scale(0.9);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }
  to {
    transform: scale(1.1);
  }
}
@keyframes zoom-img-icon {
  0% {
    transform: scale(0.9);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }
  to {
    transform: scale(1.1);
  }
}
.zoom-img-container button.hover,
.zoom-img-container button.push {
  opacity: 1;
}
.zoom-img-container button .svg-icon {
  transform: scale(0.95);
}
.zoom-img-container button.hover .svg-icon,
.zoom-img-container button.push .svg-icon {
  transform: scale(1.05);
}
.zoom-img-container button.push .svg-icon {
  transition: none;
  opacity: 0.8;
}
.zoom-img-container .svg-icon {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  transition: 0.15s transform ease-out;
}
.zoom-img-container .svg-icon svg {
  position: absolute;
  width: 60%;
  height: 60%;
  left: 18%;
  top: 18%;
}
.zoom-img-container .svg-line {
  stroke-width: 4px;
  stroke: #fff;
  stroke-linecap: round;
  stroke-linejoin: round;
}
@media (min-width: 442.6666666667px) {
  html {
    top: 0;
  }
  .header-logo {
    padding-right: 0;
  }
  body[data-namespace="/"] .header-logo {
    opacity: 0;
  }
  body[data-namespace="/"] .header-logo .link {
    pointer-events: none;
  }
  body[data-namespace="/"].little-scroll .header-logo {
    opacity: 1;
  }
  body[data-namespace="/"].little-scroll .header-logo .link {
    pointer-events: all;
  }
  .characters-gallery {
    margin-top: 8vw;
  }
  .characters-relation .text {
    font-size: 0.6666666667rem;
  }
  html.ios .characters-relation .text {
    font-size: 0.7083333333rem;
  }
  html.android .characters-relation .text {
    font-size: 0.6666666667rem;
  }
  .information-list > * {
    width: calc(100% - 1.6666666667rem);
  }
  .special-list > * {
    width: calc(100% - 1.6666666667rem);
  }
  .top-mainvisual .logo {
    display: block;
  }
}
@media (min-width: 549.3333333333px) {
  html {
    top: 0;
  }
  .characters-gallery {
    margin-top: 6vw;
  }
  .characters-relation .text,
  html.ios .characters-relation .text,
  html.android .characters-relation .text {
    font-size: 0.75rem;
  }
  .information-list > * {
    width: calc(50% - 1.6666666667rem);
  }
  .special-list > * {
    width: calc(50% - 1.6666666667rem);
  }
}
@media (min-width: 656px) {
  html {
    top: 0;
  }
  html {
    font-size: calc(0.875em + 0.8vw);
  }
  .characters-gallery {
    margin-top: 4vw;
  }
  .characters-gallery-list > * {
    width: calc(50% - 0.6666666667rem);
  }
  .characters-info-arrow {
    top: auto;
    bottom: 1.6666666667rem;
  }
  .characters-info {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 70.7792207792%;
  }
  .characters-info .primary {
    padding-top: 0;
    position: absolute;
    left: 0%;
    right: auto;
    margin: 0;
    top: 0%;
    bottom: auto;
    width: 31.6558441558%;
    height: 100%;
    z-index: 10;
  }
  .characters-info .primary,
  .characters-info .primary img {
    max-width: none;
    vertical-align: top;
  }
  .characters-info .secondary {
    font-size: 0.974025974vw;
  }
  .characters-info .secondary {
    padding: 0;
    position: absolute;
    left: 31.6558441558%;
    right: auto;
    margin: 0;
    top: 12.8440366972%;
    bottom: auto;
    width: 56.0064935065%;
    height: 87.1559633028%;
    z-index: 10;
  }
  .characters-info .secondary,
  .characters-info .secondary img {
    max-width: none;
    vertical-align: top;
  }
  .characters-info .stand.char-13 {
    position: absolute;
    left: 0%;
    right: auto;
    margin: 0;
    top: 0%;
    bottom: auto;
    width: 128.2051282051%;
    height: auto;
    z-index: 10;
  }
  .characters-info .stand.char-13,
  .characters-info .stand.char-13 img {
    max-width: none;
    vertical-align: top;
  }
  .characters-info .bustup {
    display: block;
  }
  .characters-info .catch {
    font-size: 1.2987012987vw;
  }
  .characters-info .name {
    font-size: 4.4642857143vw;
  }
  .characters-info .name {
    font-size: 17.9487179487vw;
  }
  .characters-info .name {
    margin-top: 0.8116883117vw;
  }
  .characters-info .name .small {
    font-size: 2.4350649351vw;
  }
  .characters-info .name .small {
    font-size: 10.2564102564vw;
  }
  .characters-info .name-ruby {
    margin-top: 0.8116883117vw;
  }
  .characters-info .voice {
    margin-top: 3.2467532468vw;
  }
  .characters-info .sample-voice > * + * {
    margin-left: 1.2987012987vw;
  }
  .characters-info .sample-voice .buttons > * + * {
    margin-left: 0.8116883117vw;
  }
  .characters-info .status {
    min-height: 14.6103896104vw;
  }
  .characters-info .status {
    padding-top: 1.2175324675vw;
  }
  .characters-info .status {
    padding-bottom: 2.0292207792vw;
  }
  .characters-info .status {
    padding-left: 1.6233766234vw;
  }
  .characters-info .status {
    padding-right: 1.6233766234vw;
  }
  .characters-info .status {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .characters-info .status table.table-2 {
    position: static;
    left: 0;
  }
  .characters-info .desc {
    margin-top: 2.4350649351vw;
  }
  .characters-info .status-heading {
    margin-top: 3.2467532468vw;
  }
  .characters-info .name-en {
    font-size: 4.8701298701vw;
  }
  .characters-info .name-en {
    left: 0vw;
  }
  .characters-info .name-en {
    text-align: center;
    font-size: 20.5128205128vw;
    left: -146.1538461538vw;
    top: 0;
    bottom: 0;
    margin: auto;
  }
  .characters-info .name-en span {
    transform-origin: center;
  }
  .characters-relation .text,
  html.ios .characters-relation .text,
  html.android .characters-relation .text {
    font-size: 0.8333333333rem;
    transform: scale(1);
  }
  .characters-relation .to .name {
    transform: scale(1);
  }
  .comic-4koma-list > * {
    width: calc(50% - 1.6666666667rem);
  }
  .download-twitter-list {
    display: flex;
    align-items: center;
  }
  .download-twitter-list > * + * {
    margin-top: 0;
    margin-left: 1.5rem;
  }
  .download-banner-list {
    display: flex;
  }
  .download-banner-list > * + * {
    margin-top: 0;
    margin-left: 1.5rem;
  }
  .download-wallpaper-list {
    display: flex;
    align-items: center;
  }
  .download-wallpaper-list > * + * {
    margin-top: 0;
    margin-left: 1.5rem;
  }
  .information-list > * {
    width: calc(50% - 1.6666666667rem);
  }
  .package-content .cols {
    display: flex;
    justify-content: center;
  }
  .package-content .cols > * + * {
    margin-top: 0;
    margin-left: 1.5rem;
  }
  .package-content .cols .package-desc {
    flex-grow: 1;
  }
  .package-content .cols .package-img {
    width: 40%;
    flex-shrink: 0;
    flex-grow: 0;
  }
  .shop-bonus-list > .shop {
    width: calc(50% - 2rem);
  }
  .shop-bonus-list > .shop.full-width {
    width: 100%;
  }
  .special-list > * {
    width: calc(50% - 1.6666666667rem);
  }
  .story-text {
    font-size: 0.9166666667rem;
  }
  .story-text [data-ruby]:before {
    transform: scale(1);
  }
  .top-mainvisual-change {
    top: 16vw;
    bottom: auto;
  }
  .top-mainvisual-change.light {
    color: #11bee9;
    text-shadow: none;
  }
  .top-mainvisual-change.light:after {
    background-color: #5ee1ff;
  }
  .top-mainvisual-change.light .svg-line {
    stroke: #5ee1ff;
  }
  .world-popup-content .name [data-ruby]:before {
    transform: scale(1);
  }
  .world-map .links button,
  .world-keywords button {
    transform: scale(1);
  }
  .world-keywords .world-08 {
    width: 12.5%;
  }
  .world-keywords .world-09 {
    width: 12.5%;
  }
  .br-only-s {
    display: none;
  }
  .global-menu-content .inner {
    flex-direction: row;
  }
  .global-menu-content .logo {
    width: 16.6666666667rem;
  }
  .global-menu-content .menu {
    margin-top: 0;
    margin-left: 4.5rem;
  }
  .popup-sound-content .buttons {
    flex-direction: row;
  }
  .popup-sound-content .buttons .on {
    order: 2;
    margin-left: 0.8333333333rem;
  }
  .popup-sound-content .buttons .off {
    order: 1;
    margin-top: 0;
  }
}
@media (min-width: 853.3333333333px) {
  html {
    top: 0;
  }
  .characters-gallery {
    margin-top: 2vw;
  }
  .characters-info .secondary {
    position: absolute;
    left: 31.6558441558%;
    right: auto;
    margin: 0;
    top: 12.8440366972%;
    bottom: auto;
    width: 49.512987013%;
    height: 87.1559633028%;
    z-index: 10;
  }
  .characters-info .secondary,
  .characters-info .secondary img {
    max-width: none;
    vertical-align: top;
  }
  .information-list > * {
    width: calc(50% - 1.6666666667rem);
  }
  .special-list > * {
    width: calc(50% - 1.6666666667rem);
  }
}
@media (min-width: 1050.6666666667px) {
  html {
    top: 0;
  }
  .characters-gallery {
    margin-top: 0;
  }
  .characters-info .secondary {
    position: absolute;
    left: 31.6558441558%;
    right: auto;
    margin: 0;
    top: 12.8440366972%;
    bottom: auto;
    width: 43.0194805195%;
    height: 87.1559633028%;
    z-index: 10;
  }
  .characters-info .secondary,
  .characters-info .secondary img {
    max-width: none;
    vertical-align: top;
  }
  .information-list > * {
    width: calc(33.3333333333% - 1.6666666667rem);
  }
  .shop-bonus-list .items {
    display: flex;
  }
  .shop-bonus-list .items > * + * {
    margin-top: 0;
    margin-left: 0.8333333333rem;
  }
  .special-list > * {
    width: calc(33.3333333333% - 1.6666666667rem);
  }
}
@media (min-width: 1248px) {
  html {
    top: 0;
  }
  html {
    font-size: 150%;
  }
  .characters-gallery {
    margin-top: -2vw;
  }
  .characters-gallery-list > * {
    width: calc(33.3333333333% - 0.6666666667rem);
  }
  .characters-info .secondary {
    position: absolute;
    left: 31.6558441558%;
    right: auto;
    margin: 0;
    top: 12.8440366972%;
    bottom: auto;
    width: 36.525974026%;
    height: 87.1559633028%;
    z-index: 10;
  }
  .characters-info .secondary,
  .characters-info .secondary img {
    max-width: none;
    vertical-align: top;
  }
  .characters-info .status {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .comic-4koma-list > * {
    width: calc(33.3333333333% - 1.6666666667rem);
  }
  .information-list > * {
    width: calc(33.3333333333% - 1.6666666667rem);
  }
  .special-list > * {
    width: calc(33.3333333333% - 1.6666666667rem);
  }
  .story-text {
    font-size: 1rem;
  }
  .swiper-button-prev,
  .swiper-button-next {
    top: 50%;
    bottom: auto;
  }
  .swiper-button-prev {
    left: -50px;
  }
  .swiper-button-next {
    right: -50px;
  }
}
@media (min-width: 1477.3333333333px) {
  html {
    top: 0;
  }
  .characters-info-arrow {
    top: 0;
    bottom: 0;
    margin: auto 0;
  }
  .characters-info-arrow.prev {
    left: -5rem;
  }
  .characters-info-arrow.next {
    right: -5rem;
  }
  .information-list > * {
    width: calc(33.3333333333% - 1.6666666667rem);
  }
  .special-list > * {
    width: calc(33.3333333333% - 1.6666666667rem);
  }
}
@media (min-width: 1706.6666666667px) {
  html {
    top: 0;
  }
  .information-list > * {
    width: calc(33.3333333333% - 1.6666666667rem);
  }
  .special-list > * {
    width: calc(33.3333333333% - 1.6666666667rem);
  }
}
@media (max-width: 335px) {
  html {
    font-size: 100%;
  }
  .characters-info .secondary {
    font-size: 9.8461538462px;
  }
  .characters-info .catch {
    font-size: 13.1282051282px;
  }
  .characters-info .name {
    font-size: 45.1282051282px;
  }
  .characters-info .name {
    margin-top: 8.2051282051px;
  }
  .characters-info .name .small {
    font-size: 24.6153846154px;
  }
  .characters-info .name-ruby {
    margin-top: 8.2051282051px;
  }
  .characters-info .voice {
    margin-top: 32.8205128205px;
  }
  .characters-info .sample-voice > * + * {
    margin-left: 13.1282051282px;
  }
  .characters-info .sample-voice .buttons > * + * {
    margin-left: 8.2051282051px;
  }
  .characters-info .status {
    min-height: 147.6923076923px;
  }
  .characters-info .status {
    padding-top: 12.3076923077px;
  }
  .characters-info .status {
    padding-bottom: 20.5128205128px;
  }
  .characters-info .status {
    padding-left: 16.4102564103px;
  }
  .characters-info .status {
    padding-right: 16.4102564103px;
  }
  .characters-info .desc {
    margin-top: 24.6153846154px;
  }
  .characters-info .status-heading {
    margin-top: 32.8205128205px;
  }
  .characters-info .name-en {
    font-size: 49.2307692308px;
  }
  .characters-info .name-en {
    left: 0px;
  }
}
@media (min-width: 1232px) {
  .characters-info .secondary {
    font-size: 12px;
  }
  .characters-info .catch {
    font-size: 16px;
  }
  .characters-info .name {
    font-size: 55px;
  }
  .characters-info .name {
    margin-top: 10px;
  }
  .characters-info .name .small {
    font-size: 30px;
  }
  .characters-info .name-ruby {
    margin-top: 10px;
  }
  .characters-info .voice {
    margin-top: 40px;
  }
  .characters-info .sample-voice > * + * {
    margin-left: 16px;
  }
  .characters-info .sample-voice .buttons > * + * {
    margin-left: 10px;
  }
  .characters-info .status {
    min-height: 180px;
  }
  .characters-info .status {
    padding-top: 15px;
  }
  .characters-info .status {
    padding-bottom: 25px;
  }
  .characters-info .status {
    padding-left: 20px;
  }
  .characters-info .status {
    padding-right: 20px;
  }
  .characters-info .desc {
    margin-top: 30px;
  }
  .characters-info .status-heading {
    margin-top: 40px;
  }
  .characters-info .name-en {
    font-size: 60px;
  }
  .characters-info .name-en {
    left: 0px;
  }
}
@media (min-width: 656px) and (max-width: 335px) {
  .characters-info .name {
    font-size: 57.4358974359px;
  }
  .characters-info .name .small {
    font-size: 32.8205128205px;
  }
  .characters-info .name-en {
    font-size: 65.641025641px;
  }
  .characters-info .name-en {
    left: -467.6923076923px;
  }
}
@media (min-width: 656px) and (min-width: 656px) {
  .characters-info .name {
    font-size: 5.6818181818vw;
  }
  .characters-info .name .small {
    font-size: 3.2467532468vw;
  }
  .characters-info .name-en {
    font-size: 6.4935064935vw;
  }
  .characters-info .name-en {
    left: -46.2662337662vw;
  }
}
@media (min-width: 656px) and (min-width: 1232px) {
  .characters-info .name {
    font-size: 70px;
  }
  .characters-info .name .small {
    font-size: 40px;
  }
  .characters-info .name-en {
    font-size: 80px;
  }
  .characters-info .name-en {
    left: -570px;
  }
}
@media (min-width: 783px) {
  body.admin-bar .fixed-full-width {
    top: 32px;
  }
}
@media (orientation: landscape) {
  .sakura-effect {
    width: 100vw;
    height: 100vw;
  }
}

/* 221125 店舗特典 オリジナル特典 */

[data-barba-namespace="/special/store-benefits/"] div.shop {
  display: flex;
  flex-flow: column;
  justify-content: space-between;
}

[data-barba-namespace="/special/store-benefits/"]
  #newly-drawn
  div.shop:nth-child(2)
  div.shop-name,
[data-barba-namespace="/special/store-benefits/"]
  #original
  div.shop:nth-child(4)
  div.shop-name {
  font-size: 0.9rem;
}

[data-barba-namespace="/special/store-benefits/"]
  #original
  div.shop:nth-child(7)
  div.shop-name {
  font-size: 0.8rem;
}

[data-barba-namespace="/special/store-benefits/"] div.item-group {
  margin: 0.4rem 0 0;
  color: #25bbe6;
  text-align: center;
  font-size: 0.6rem;
}

[data-barba-namespace="/special/store-benefits/"]
  div.shop:nth-child(1)
  div.item:nth-last-child(2),
[data-barba-namespace="/special/store-benefits/"]
  div.shop:nth-child(2)
  div.item:nth-last-child(2),
[data-barba-namespace="/special/store-benefits/"]
  div.shop:nth-child(3)
  div.item:nth-last-child(2) {
  padding-bottom: 2.5rem;
}

[data-barba-namespace="/special/store-benefits/"]
  div.shop:nth-child(4)
  div.item:nth-last-child(2) {
  padding-bottom: 1rem;
}

[data-barba-namespace="/special/store-benefits/"]
  div.shop:nth-child(5)
  div.item:nth-last-child(2),
[data-barba-namespace="/special/store-benefits/"]
  div.shop:nth-child(6)
  div.item:nth-last-child(2) {
  padding-bottom: 4rem;
}

[data-barba-namespace="/special/store-benefits/"] div.shop div.link {
  margin-top: auto;
}

/* 221014、221027 紹介マンガ 最新版グループ二列化、中央化 */

@media (min-width: 1248px) {
  #comic-4koma-list-new {
    justify-content: center;
  }

  #comic-4koma-list-new > * {
    width: calc(50% - 1.6666666667rem);
  }
}

/* 221027 紹介マンガトップボタン 中央化 */

#comic-top-button {
  display: flex;
  justify-content: center;
  margin-top: 2rem;
}

/* 221021 店舗特典 ちびキャラ装飾 */

.shop-bonus-list > .shop {
  /*
		border-style: solid;
		-o-border-image: url('/rc/frame-text.png') 64 64 stretch;
		border-image: url('/rc/frame-text.png') 64 64 fill stretch;
		border-width: 1rem 1rem;
		padding: 0.25rem;
		box-shadow: #00000026 0.1rem 0.1rem 0.4rem;
		margin: 1rem;
		width: 100%
		*/
  position: relative;
}

.shop-bonus-list .chibi-chara {
  z-index: 100;
  position: absolute;
  display: block;
  top: -40px;
  right: -30px;
}

.shop-bonus-list .chibi-chara.mizuha {
  width: 114px;
  height: 141px;
}

.shop-bonus-list .chibi-chara.menoa {
  width: 130px;
  height: 140px;
}

.shop-bonus-list .chibi-chara.yukina {
  width: 95px;
  height: 145px;
}

.shop-bonus-list .chibi-chara.akari {
  width: 71px;
  height: 147px;
}

.shop-bonus-list .chibi-chara.kako {
  width: 70px;
  height: 142px;
}

.shop-bonus-list .shop-name,
.shop-bonus-list .item,
.shop-bonus-list .link {
  z-index: 200;
  position: relative;
}

.shop-bonus-list .link {
  padding-top: 10px;
}

.shop-bonus-list .img {
  margin-top: 0.2rem;
}

/* 221223 同梱特典 パッケージ画像 */

#package-deluxe-image {
  display: block;
  width: calc(100% - 2rem);
  max-width: 800px;
  margin: 0 auto;
}

/* 221223 同梱特典 ディスクレーベル画像 */

.disc-lavel {
  display: flex;
  flex-flow: column;
  align-items: center;
}

.disc-lavel img {
  display: block;
  width: calc(100% - 2rem);
  max-width: 800px;
  margin: 0 auto;
}

/* 230114 トップ 製品情報 動作環境 */
.products-table-info .spec-text {
  font-size: 0.5rem;
}

/* 230114 ダウンロード 体験版 */
/* 230127 ダウンロード パッチ　※追加 */
.trial-picture-link {
  text-align: center;
  font-size: 0.6rem;
}

.trial-picture-link img {
  margin-bottom: 0.3rem;
}

.trial-summary,
.patch-summary {
  padding: 0.1rem 0.2rem;
  line-height: 1.4;
}

.trial-summary p,
.patch-summary p {
  margin-top: 0.5rem;
  padding: 0;
}

#patch-download-button {
  display: flex;
  justify-content: center;

  padding: 1rem;
}

.download-trial-detail .attention,
.download-patch-detail .content,
.download-patch-detail .spec,
.download-patch-detail .attention {
  margin-top: 1rem;
}

.download-trial-detail .text,
.download-patch-detail .text {
  padding: 0.1rem 0.2rem;
  line-height: 1.4;
}
.download-patch-detail .text,
.download-patch-detail .list {
  font-size: 0.6rem;
}

.download-trial-detail .attention ul,
.download-patch-detail .attention ul {
  list-style: none;
  display: table;
  margin: 0;
  padding: 0.1rem 0.2rem;
  font-size: 0.6rem;
}

.download-trial-detail .attention li,
.download-patch-detail .attention li {
  list-style: none;
  display: table-row;
  margin: 0;
  margin-bottom: 0.5em;
  padding: 0;
  color: #727072;
}

.download-trial-detail .attention li::before,
.download-patch-detail .attention li::before {
  display: table-cell;
  padding-right: 0.2em;
  content: "＊";
  color: #727072;
  font-weight: bold;
}

/* 230127 トップ アペンドバナー */

#append-banner {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 640px;
  max-width: 100%;
  margin: 0 auto !important;
}

#append-banner div {
  display: flex;
  justify-content: center;
  width: 100%;
  margin: -10px 0 0 -10px;
}

#append-banner a {
  width: 200px;
  display: block;
  margin: 10px 0 0 10px;
}

#append-banner img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: scale-down;
}

@media (max-width: 680px) {
  #append-banner {
    align-items: center;
    margin: 2rem auto 0 !important;
  }
  #append-banner div {
    flex-flow: wrap;
    align-items: center;
  }

  #append-banner a:nth-child(1) {
    margin: 0 calc((100% - 200px) / 2);
  }
}
@media (max-width: 420px) {
  #append-banner div {
    flex-flow: column;
    align-items: center;
  }

  #append-banner a {
    margin: 0.5rem 0 0 !important;
  }
}

/* 230825 トップ アペンドバナー */

#append-banner-cs {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1.66rem;
}
#append-banner-cs a {
  display: block;
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
}
#append-banner-cs img {
  width: 100%;
  height: auto;
}

/* Team testimonials and special download modules */
.article.special .special-list-container {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 12px;
}

.special__visual-frame {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  font-size: 10px;
  line-height: 1;
  letter-spacing: 0;
}

.special__visual-frame__ratio {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #cbf5ff;
  border: 2px solid #2acef3;
  border-radius: 8px;
  aspect-ratio: 16 / 9;
}

.special__visual-frame__ratio img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.special__visual-frame__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: 28px;
  line-height: 34px;
  color: #2acef3;
  letter-spacing: 0;
  text-align: center;
}

.team_testimonials,
.team_testimonials * {
  box-sizing: border-box;
}

.team_testimonials {
  --tt-color-main: #2acef3;
  --tt-color-sub: #ff7af6;
  --tt-item-bg: rgba(203, 245, 255, 0.45);
  --tt-item-bg-hover: rgba(203, 245, 255, 0.68);
  --tt-text-color: #333;
  font-size: 10px;
  line-height: 1;
  letter-spacing: 0;
  word-spacing: 0;
  text-align: left;
  text-justify: auto;
  word-break: normal;
  overflow-wrap: normal;
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  background: rgba(255, 255, 255, 0.74);
  border: 3px solid var(--tt-color-main);
  outline: 0;
  border-radius: 16px;
  box-shadow: #0000001f 0 4px 18px;
  overflow: hidden;
}

.team_testimonials.no-title {
  border: 0;
  border-radius: 0;
  overflow: visible;
}

.team_testimonials.no-title .testimonials_title {
  display: none;
}

.testimonials_title {
  background: linear-gradient(135deg, var(--tt-color-main), var(--tt-color-sub));
  padding: 15px 0;
  text-align: center;
  border-bottom: 2px solid var(--tt-color-main);
}

.testimonials_title h3 {
  margin: 0;
  color: #fff;
  font-size: 16px;
  line-height: 22px;
  letter-spacing: 0;
  font-weight: 700;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  font-family: "Noto Serif SC", "Hiragino Mincho ProN", "Yu Mincho", serif;
}

.testimonials_content {
  padding: 20px;
}

.team_testimonials.no-title .testimonials_content {
  padding: 0;
}

.testimonial_item {
  display: flex;
  align-items: flex-start;
  margin-bottom: 20px;
  padding: 15px;
  background: var(--tt-item-bg);
  border-left: 4px solid var(--tt-color-main);
  border-radius: 8px;
  transition: background-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
}

.testimonial_item:hover {
  background: var(--tt-item-bg-hover);
  transform: translateX(5px);
  box-shadow: 0 2px 5px rgba(42, 206, 243, 0.25);
}

.testimonial_item:last-child {
  margin-bottom: 0;
}

.member_info {
  min-width: 150px;
  margin-right: 20px;
  padding-top: 2px;
  text-align: right;
}

.member_name {
  margin-bottom: 4px;
  color: var(--tt-color-main);
  font-size: 18px;
  line-height: 20px;
  letter-spacing: 0;
  font-weight: 700;
  font-family: "Poppins", "Noto Sans SC", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}

.member_position {
  color: rgba(51, 51, 51, 0.75);
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0;
  font-weight: 400;
  font-family: "Noto Serif SC", "Hiragino Mincho ProN", "Yu Mincho", serif;
}

.member_position a,
.member_position a:visited {
  color: var(--tt-color-main);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.member_comment {
  flex: 1;
  color: var(--tt-text-color);
  text-align: left;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: 0;
  font-weight: 400;
  font-family: "Noto Serif SC", "Hiragino Mincho ProN", "Yu Mincho", serif;
}

.member_comment__image {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 360px;
  margin: 0 0 10px;
  border-radius: 6px;
  object-fit: contain;
}

.member_comment__image--icon {
  width: 180px;
  height: auto;
}

.member_comment del {
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

.member_comment code {
  font-family: "Noto Serif SC", serif;
  font-size: 15px;
  line-height: 22px;
  letter-spacing: 0;
}

.heimu,
.heimu rt {
  --heimu-color: var(--tt-heimu-bg, #2b5f70);
  --heimu-text-color: var(--tt-heimu-text, #fff);
  --heimu-link-color: var(--tt-heimu-link, #ffb7f8);
  --heimu-visited-link-color: var(--tt-heimu-link-visited, #ffc9fb);
  --heimu-new-link-color: var(--tt-heimu-link-new, #ffd9fc);
  --heimu-new-visited-link-color: var(--tt-heimu-link-new-visited, #ffe7fd);
  --heimu-extiw-visited-link-color: var(--tt-heimu-link-ext-visited, #f5b8f0);
  background-color: var(--heimu-color);
  transition: background-color 0.13s linear, color 0.13s linear;
  border-radius: 3px;
  padding: 1px 2px;
  line-height: 1.2;
  letter-spacing: 0;
}

.heimu,
.heimu a,
a .heimu,
a.new .heimu,
span.heimu a:visited,
span.heimu a.new,
span.heimu a.external,
span.heimu a.external:visited,
span.heimu a.extiw,
span.heimu a.extiw:visited,
span.heimu a.mw-disambig,
span.heimu a.mw-redirect {
  transition: color 0.13s linear;
  color: var(--heimu-color);
  text-shadow: none;
}

span.heimu:hover,
span.heimu:active {
  color: var(--heimu-text-color);
  background-color: var(--heimu-color);
}

span.heimu:hover a,
a:hover span.heimu {
  color: var(--heimu-link-color);
}

span.heimu:hover a:visited,
a:visited:hover span.heimu {
  color: var(--heimu-visited-link-color);
}

span.heimu:hover a.new,
a.new:hover span.heimu {
  color: var(--heimu-new-link-color);
}

span.heimu a.new:hover:visited,
a.new:hover:visited span.heimu {
  color: var(--heimu-new-visited-link-color);
}

span.heimu:hover a.extiw:visited,
a.extiw:visited:hover span.heimu {
  color: var(--heimu-extiw-visited-link-color);
}

.special__mod-download {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  overflow: hidden;
  font-size: 10px;
  line-height: 1;
  letter-spacing: 0;
  background-color: rgba(255, 255, 255, 0.82);
  border: 1px solid #2acef3;
  border-radius: 16px;
  font-family: "Noto Serif SC", "Hiragino Mincho ProN", "Yu Mincho", serif;
}

.special__mod-download__title {
  margin: 0;
  padding: 14px 16px;
  font-size: 16px;
  line-height: 20px;
  letter-spacing: 0;
  font-weight: 700;
  color: #129fc2;
  text-align: center;
  border-radius: 16px 16px 0 0;
}

.special__mod-download__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 1px solid #2acef3;
  border-radius: 0 0 16px 16px;
  overflow: hidden;
}

.special__mod-download__head {
  padding: 10px 8px;
  font-size: 16px;
  line-height: 20px;
  letter-spacing: 0;
  font-weight: 700;
  text-align: center;
  color: #fff;
  background: linear-gradient(135deg, #2acef3, #ff7af6);
  border-right: 1px solid #2acef3;
}

.special__mod-download__head:nth-child(2) {
  border-right: 0;
}

.special__mod-download__cell {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px 12px;
  border-top: 1px solid #2acef3;
  border-right: 1px solid #2acef3;
}

.special__mod-download__cell:nth-child(4) {
  border-right: 0;
}

.special__mod-download__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 160px;
  padding: 10px 20px;
  font-size: 16px;
  line-height: 20px;
  letter-spacing: 0;
  text-align: center;
  white-space: nowrap;
  writing-mode: horizontal-tb;
  text-orientation: mixed;
  font-family: "Noto Serif SC", "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-weight: 700;
  color: #fff;
  text-decoration: none;
  cursor: pointer;
  background: #129fc2;
  border: 0;
  border-radius: 8px;
}

.special__mod-download__btn.is-disabled {
  color: #f5f5f5;
  cursor: default;
  background: #9a9a9a;
}

@media screen and (max-width: 768px) {
  .article.special .special-list-container {
    gap: 16px;
    padding: 0 12px;
  }

  .special__visual-frame__ratio {
    border-width: 1px;
  }

  .special__visual-frame__placeholder {
    font-size: 14px;
    line-height: 20px;
  }

  .team_testimonials {
    border-width: 2px;
    border-radius: 12px;
  }

  .testimonials_title {
    padding: 12px 0;
  }

  .testimonials_title h3 {
    font-size: 14px;
    line-height: 20px;
  }

  .testimonials_content {
    padding: 14px;
  }

  .team_testimonials.no-title .testimonials_content {
    padding: 0;
  }

  .testimonial_item {
    flex-direction: column;
    gap: 8px;
    margin-bottom: 14px;
    padding: 12px;
  }

  .testimonial_item:hover {
    transform: none;
  }

  .member_info {
    min-width: 0;
    margin-right: 0;
    text-align: left;
  }

  .member_name {
    font-size: 15px;
    line-height: 18px;
  }

  .member_position {
    font-size: 11px;
    line-height: 15px;
  }

  .member_comment {
    font-size: 14px;
    line-height: 22px;
  }

  .member_comment__image {
    max-height: 260px;
  }

  .member_comment__image--icon {
    width: 96px;
  }

  .special__mod-download {
    border-radius: 12px;
  }

  .special__mod-download__title {
    padding: 14px 10px;
    font-size: 14px;
    line-height: 18px;
    border-radius: 12px 12px 0 0;
  }

  .special__mod-download__grid {
    border-radius: 0 0 12px 12px;
  }

  .special__mod-download__head {
    padding: 8px 6px;
    font-size: 13px;
    line-height: 17px;
  }

  .special__mod-download__cell {
    padding: 10px 8px;
  }

  .special__mod-download__btn {
    min-width: 120px;
    padding: 8px 12px;
    font-size: 13px;
    line-height: 17px;
  }
}