@charset "UTF-8";
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: normal;
  line-height: inherit;
  text-decoration: none;
  vertical-align: baseline; }

article, aside, details, figcaption, figure, picture,
footer, header, menu, nav, section, main, canvas, picture {
  display: block; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

input, textarea {
  font-family: inherit;
  font-size: inherit;
  margin: 0;
  padding: 0; }

select, option, button {
  font-family: inherit;
  font-size: inherit; }

input.styleReset, button.styleReset, textarea.styleReset, select.styleReset {
  color: inherit;
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  box-sizing: border-box; }

ul, ol, li {
  list-style: none;
  margin: 0;
  padding: 0; }

a {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: inherit;
  font-weight: inherit;
  font-style: inherit;
  text-decoration: none;
  vertical-align: baseline; }

html {
  font-size: calc(10vw / 7.5);
  -webkit-font-smoothing: antialiased; }

body {
  color: #000000;
  font-family: "Zen Kaku Gothic New", system-ui;
  font-size: 3.2rem;
  line-height: 1.44;
  background-color: #ffffff;
  -webkit-text-size-adjust: 100%;
  word-wrap: break-word;
  overflow-wrap: break-word;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden; }

body.lock,
body.loading {
  overflow: hidden;
  overscroll-behavior-y: none;
  position: fixed;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  min-height: -webkit-fill-available; }

@supports (-webkit-touch-callout: none) {
  body.lock,
  body.loading {
    min-height: -webkit-fill-available; } }
@media screen and (min-width: 751px) {
  html {
    font-size: 6px; }

  body {
    font-size: 1.6rem;
    line-height: 1; } }
* {
  -webkit-tap-highlight-color: transparent; }

a {
  cursor: pointer;
  color: inherit;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  text-decoration: none; }

p, dt, dd, li {
  word-break: break-word;
  word-wrap: normal; }

img {
  max-width: 100%;
  height: auto;
  vertical-align: top; }

button {
  cursor: pointer;
  font-family: inherit; }

.ib {
  display: inline-block;
  line-height: inherit;
  font-weight: inherit; }

.accordionTrigger {
  cursor: pointer;
  display: block; }

.accordionContent {
  display: none; }

.en {
  font-family: "Oswald", sans-serif; }

.slide .image {
  opacity: 0;
  position: absolute;
  top: 0; }
  .slide .image:first-child {
    opacity: 1;
    position: relative; }
.slide.slick-initialized .image {
  opacity: 1;
  position: relative; }
.slide .slick-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: calc(100% + 2.3rem);
  left: 0;
  right: 0; }
  .slide .slick-dots li {
    flex-basis: 1.6rem;
    margin: 0 2.1rem; }
    .slide .slick-dots li:first-child:last-child {
      display: none; }
    .slide .slick-dots li button {
      margin: 0;
      padding: 0;
      background: none;
      border: none;
      border-radius: 0;
      outline: none;
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      box-sizing: border-box;
      display: block;
      cursor: pointer;
      width: 1.6rem;
      height: 1.6rem;
      text-indent: -9999em;
      background-color: #CCCCCC;
      border-radius: 50%;
      transition: background-color 0.2s ease-out; }
    .slide .slick-dots li button:hover, .slide .slick-dots li.slick-active button {
      background-color: #000000; }
.slide .slick-arrow {
  cursor: pointer;
  overflow: hidden;
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 10;
  width: 6.6rem;
  height: 6.6rem;
  text-indent: -9999em;
  margin: auto;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  box-sizing: border-box;
  background: url(../images/icon_arrow.svg) center center no-repeat;
  background-size: contain; }
  .slide .slick-arrow.slick-prev {
    left: -2rem;
    transform: rotate(180deg); }
  .slide .slick-arrow.slick-next {
    right: -2rem; }

.simplebar-track {
  background: #EEEEEE;
  border-radius: 10px; }

.simplebar-scrollbar::before {
  background: #A6A6A6; }

.simplebar-track .simplebar-scrollbar.simplebar-visible::before {
  opacity: 1; }

@media screen and (min-width: 751px) {
  /* mover */
  .mover {
    transition: opacity 0.2s ease-out;
    backface-visibility: hidden;
    zoom: 1; }
    .mover:hover {
      opacity: 0.8; }

  .moverContent > * {
    transition: opacity 0.2s ease-out;
    backface-visibility: hidden;
    zoom: 1; }
  .moverContent:hover > * {
    opacity: 0.8; } }
.modePC,
.modePCib {
  display: none; }
  .modePC.important,
  .modePCib.important {
    display: none !important; }

.modeSP {
  display: block; }
  .modeSP.important {
    display: block !important; }

@media screen and (min-width: 751px) {
  .modePC {
    display: block; }
    .modePC.important {
      display: block !important; }

  .modePCib {
    display: inline-block; }
    .modePCib.important {
      display: inline-block !important; }

  .modeSP {
    display: none; }
    .modeSP.important {
      display: none !important; } }
.wrapper {
  background-color: #ffffff;
  padding: calc(96 / 750 * 100vw) 0 0 0;
  border-left: 2px solid #EEEEEE;
  border-right: 2px solid #EEEEEE;
  box-sizing: border-box;
  transition: opacity 0.3s; }
  .load_complete .wrapper {
    opacity: 1; }

.contentInner {
  width: calc(648 / 750 * 100%);
  margin: auto; }

.scrollPosition {
  margin-top: calc(-96 / 750 * 100vw);
  padding-top: calc(96 / 750 * 100vw); }

.fadeContent {
  opacity: 0;
  transition: all 0.4s ease; }

.fadeContent.current {
  opacity: 1; }

@media screen and (min-width: 751px) {
  body {
    position: relative; }
    body:before, body:after {
      content: "";
      display: block;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: calc(50% + 230px);
      z-index: 1000;
      background-color: #FCF9F6; }
    body:after {
      left: calc(50% + 230px);
      right: 0; }

  .wrapper {
    overflow: hidden;
    max-width: 460px;
    margin: auto;
    padding: calc(96px * (460 / 750)) 0 0 0; }

  .contentInner {
    width: 100%;
    max-width: 1440px;
    padding: 0 20px;
    box-sizing: border-box; }

  .scrollPosition {
    margin-top: calc(-96px * (460 / 750));
    padding-top: calc(96px * (460 / 750)); } }
#header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background-color: #ffffff;
  padding: calc(96 / 750 * 100vw) 0 0 0;
  border-left: 2px solid #EEEEEE;
  border-right: 2px solid #EEEEEE;
  box-sizing: border-box; }
  #header.fixed {
    border-bottom: 2px solid #EEEEEE; }
  #header.categoryFixed {
    border-bottom: 0; }
  #header .headerInner {
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    #header .headerInner .logo {
      flex-basis: calc(203 / 750 * 100%);
      margin: 0 0 0 calc(52 / 750 * 100%); }
    #header .headerInner .logo2 {
      flex-basis: calc(291 / 750 * 100%);
      margin: 0 0 0 calc(49 / 750 * 100%); }

#globalNav .button {
  cursor: pointer;
  display: block;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 1000;
  width: calc(113 / 750 * 100vw);
  height: 0;
  background-color: #7F7F7F;
  padding: calc(96 / 750 * 100vw) 0 0 0;
  box-sizing: border-box; }
  #globalNav .button .wrap {
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: calc(35 / 113 * 100%);
    height: 0;
    padding: calc(30 / 113 * 100%) 0 0 0;
    margin: auto; }
    #globalNav .button .wrap span {
      position: absolute;
      left: 0;
      right: 0;
      height: 2px;
      background-color: #ffffff;
      margin: auto;
      transition: all 0.2s; }
      #globalNav .button .wrap span:nth-of-type(1) {
        top: 0; }
      #globalNav .button .wrap span:nth-of-type(2) {
        top: 0;
        bottom: 0; }
      #globalNav .button .wrap span:nth-of-type(3) {
        bottom: 0; }
#globalNav .menu {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 999;
  height: 100vh; }
  #globalNav .menu .menuBg {
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.5); }
  #globalNav .menu .menuInner {
    overflow: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: calc(530 / 750 * 100vw);
    color: #ffffff;
    background-color: var(--main-color);
    padding: calc(30 / 750 * 100vw) 0 0 0;
    transform: translateX(100%);
    transition: all 0.2s ease-out;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box; }
  #globalNav .menu .title {
    font-size: 4rem;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0.73em;
    margin: 0 0 0 calc(77 / 530 * 100%); }
  #globalNav .menu .list {
    width: calc(448 / 530 * 100%);
    margin: 0 calc(13 / 530 * 100%) 0 auto;
    padding: calc(62 / 530 * 100%) 0 0 0;
    box-sizing: border-box; }
    #globalNav .menu .list .item {
      flex-basis: 100%;
      padding: calc(54 / 448 * 100%) 0 calc(38 / 448 * 100%) 0;
      border-top: 4px solid #ffffff; }
      #globalNav .menu .list .item:first-child {
        border-top: 0; }
      #globalNav .menu .list .item a {
        display: block;
        width: 100%;
        font-size: 2.8rem;
        line-height: 1.75;
        letter-spacing: 0.04em;
        padding: 0 0 0 calc(45 / 448 * 100%);
        box-sizing: border-box; }
        #globalNav .menu .list .item a .en {
          display: block;
          position: relative;
          font-size: 4rem;
          line-height: 1;
          font-weight: 700;
          letter-spacing: 0.2em;
          margin: 0 0 0.35em 0; }
          #globalNav .menu .list .item a .en:before {
            content: ">";
            display: flex;
            align-items: center;
            position: absolute;
            top: -0.2em;
            bottom: -0.2em;
            right: calc(100% + 0.2em);
            font-size: 6.7rem;
            line-height: 1;
            font-weight: 200;
            letter-spacing: 0; }
#globalNav.open .button {
  background-color: var(--main-color); }
  #globalNav.open .button .wrap span:nth-of-type(1) {
    bottom: 0;
    left: 0;
    transform: translateY(50%) translateY(-1px) rotate(-45deg); }
  #globalNav.open .button .wrap span:nth-of-type(2) {
    opacity: 0;
    left: 0; }
  #globalNav.open .button .wrap span:nth-of-type(3) {
    top: 0;
    left: 0;
    transform: translateY(-50%) translateY(1px) rotate(45deg); }
#globalNav.open .menu {
  left: 0; }
  #globalNav.open .menu .menuBg {
    left: 0; }
  #globalNav.open .menu .menuInner {
    transform: translateX(0); }

@media screen and (min-width: 751px) {
  #header {
    max-width: 460px;
    margin: auto;
    padding: calc(96px * (460 / 750)) 0 0 0; }

  #globalNav .button {
    right: calc(50% - 230px);
    width: calc(113px * (460 / 750));
    padding: calc(96px * (460 / 750)) 0 0 0; }
  #globalNav .menu {
    right: calc(50% - 230px); }
    #globalNav .menu .menuInner {
      width: calc(530px * (460 / 750));
      padding: calc(30px * (460 / 750)) 0 0 0; } }
#footer {
  overflow: hidden;
  position: relative;
  background: #fff;
  font-family: "Noto Sans JP", sans-serif;
  padding: 0; }
  #footer .footerInner {
    margin: 0 auto;
    padding: 2em 0 0.2em 0; }
  #footer .sns {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px auto; }
    #footer .sns .item {
      flex-basis: calc(100 / 750 * 100%);
      margin: 0 calc(20 / 750 * 100%); }
  #footer .list {
    text-align: center; }
    #footer .list.first {
      display: flex;
      align-items: center;
      justify-content: center; }
      #footer .list.first .item:nth-child(2):before {
        content: "";
        display: block;
        width: 1px;
        height: 1.3em;
        background-color: #717071; }
    #footer .list .item {
      display: flex;
      align-items: center;
      justify-content: center; }
      #footer .list .item a {
        display: block;
        color: #717071;
        font-size: 2.3rem;
        line-height: 1.78;
        text-decoration: none;
        padding: 5px 10px; }
  #footer .wrap {
    display: flex;
    align-items: center;
    justify-content: space-around;
    margin: auto;
    padding: 0 calc(40 / 750 * 100%) 2em calc(60 / 750 * 100%); }
    #footer .wrap .logo {
      width: calc(203 / 650 * 100%); }
    #footer .wrap .logo2 {
      width: calc(329 / 650 * 100%); }
  #footer .copyright {
    display: block;
    position: relative;
    color: #717071;
    font-size: 1.8rem;
    line-height: 1.39;
    text-align: center;
    margin: 0 0 20px;
    padding: 1em 0 1.1em 0; }

@media screen and (min-width: 751px) {
  #footer .footerInner {
    padding: 50px 0 20px 0;
    text-align: center; }
  #footer .list {
    max-width: 800px;
    margin: auto;
    font-size: 1.2rem; }
  #footer .copyright {
    font-size: 1.85rem;
    letter-spacing: inherit; }
  #footer .wrap {
    max-width: 375px;
    margin: auto; } }
/* loading */
#loading {
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1000000;
  background-color: var(--main-color); }

.ball-pulse-sync > div {
  display: inline-block;
  width: 15px;
  height: 15px;
  background-color: #ffffff;
  margin: 10px;
  border-radius: 100%;
  animation-fill-mode: both; }

.ball-pulse-sync > div:nth-child(1) {
  animation: ball-pulse-sync 0.6s -0.14s infinite ease-in-out; }

.ball-pulse-sync > div:nth-child(2) {
  animation: ball-pulse-sync 0.6s -70ms infinite ease-in-out; }

.ball-pulse-sync > div:nth-child(3) {
  animation: ball-pulse-sync 0.6s 0s infinite ease-in-out; }

@keyframes ball-pulse-sync {
  33% {
    transform: translateY(10px); }
  66% {
    transform: translateY(-10px); }
  100% {
    transform: translateY(0); } }
/* animate */
.animate {
  opacity: 0;
  transform: scale(0.6);
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.2s; }
  .animate.current {
    opacity: 1;
    transform: scale(1); }

/* firstContent */
#firstContent .content {
  overflow: hidden;
  position: relative; }
  #firstContent .content:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
    background-color: var(--main-color); }
  #firstContent .content:nth-child(2):after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: -1px;
    left: 0;
    right: 0;
    z-index: 1;
    background-color: #ffffff;
    margin: calc(40 / 750 * 100%) 0 0 0;
    padding: 0 0 calc(483 / 750 * 100%) 0;
    border-radius: 5rem 5rem 0 0; }
#firstContent .contentInner {
  position: relative;
  z-index: 2; }
  #firstContent .contentInner.wide {
    width: 100%;
    padding: 0; }
#firstContent .head {
  display: flex;
  align-items: center;
  padding: calc(64 / 750 * 100%) 0 calc(25 / 750 * 100%) 0; }
  #firstContent .head .category {
    color: #000000;
    font-size: 2.1rem;
    line-height: 1;
    font-weight: 500;
    background-color: #ffffff;
    padding: 0.7em 1em;
    border-radius: 1.5em; }
  #firstContent .head .period {
    color: #ffffff;
    font-size: 3.1rem;
    line-height: 1;
    letter-spacing: 0.13em;
    margin: 0 0 0 0.6em; }
#firstContent .copy {
  color: #ffffff;
  font-size: 2.8rem;
  line-height: 1;
  letter-spacing: 0.44em;
  margin: 0 0 calc(13 / 750 * 100%) 0; }
#firstContent .title {
  color: #ffffff;
  font-weight: 700;
  letter-spacing: 0.028em;
  margin: 0 0 calc(6 / 750 * 100%) 0;
  padding: 0 0 calc(15 / 750 * 100%) 0; }
  #firstContent .title.en {
    font-weight: 400; }
#firstContent .text {
  color: #ffffff;
  font-size: 4.3rem;
  line-height: 1.12;
  font-weight: 700;
  letter-spacing: -0.04em;
  margin: 0 0 calc(44 / 750 * 100%) 0; }
#firstContent .image {
  width: calc(648 / 750 * 100%);
  margin: 0 auto calc(48 / 750 * 100%) auto;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.15); }
#firstContent .intro {
  font-size: 3.2rem;
  line-height: 1.44;
  text-align: center;
  padding: 0 0 calc(30 / 750 * 100%) 0; }
#firstContent .head,
#firstContent .copy,
#firstContent .title,
#firstContent .image {
  opacity: 0;
  transition: all 0.8s ease-out 0.4s; }
#firstContent .title {
  overflow: hidden; }
  #firstContent .title .char {
    overflow: hidden;
    display: inline-block;
    min-width: 1.5rem;
    height: 1em; }
    #firstContent .title .char .anime {
      display: block;
      height: 1em;
      transform: translateY(var(--y, 110%));
      transition: transform 0.4s cubic-bezier(0.77, 0, 0.175, 1);
      transition-delay: calc(0.04s * var(--char-index) + 0.3s); }
#firstContent .text {
  opacity: 0;
  transition: all 0.8s ease-out 1.4s; }
#firstContent .intro {
  opacity: 0;
  transition: all 0.8s ease-out 1.4s; }
.load_complete #firstContent .head,
.load_complete #firstContent .copy,
.load_complete #firstContent .title,
.load_complete #firstContent .text,
.load_complete #firstContent .image,
.load_complete #firstContent .intro {
  opacity: 1; }
.load_complete #firstContent .title {
  --y: 0; }

@media screen and (min-width: 751px) {
  #firstContent .title {
    font-weight: 700; }
    #firstContent .title.en {
      font-weight: 400; } }
/* innerNav */
.innerNav {
  position: relative;
  z-index: 10;
  padding: calc(20 / 750 * 100%) 0; }
  .innerNav .list {
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3.4rem;
    line-height: 1; }
    .innerNav .list .item {
      flex-basis: calc(248 / 750 * 100%);
      position: relative; }
      .innerNav .list .item:nth-child(1):before {
        display: none; }
      .innerNav .list .item:nth-child(2) {
        flex-basis: calc(264 / 750 * 100%); }
      .innerNav .list .item:nth-child(3) {
        flex-basis: calc(238 / 750 * 100%); }
      .innerNav .list .item:before {
        content: "";
        position: absolute;
        top: 0.8em;
        bottom: 0.8em;
        left: -1px;
        z-index: 10;
        width: 2px;
        background-color: #ffffff; }
      .innerNav .list .item a {
        display: block;
        color: #ffffff;
        letter-spacing: 0.08em;
        text-align: left;
        background-color: var(--main-color);
        padding: 0.75em 0; }
        .innerNav .list .item a .icon {
          display: flex;
          justify-content: center; }
          .innerNav .list .item a .icon:before {
            content: "";
            display: block;
            width: 0.6em;
            height: 0.8em;
            background-color: #ffffff;
            margin: 0.2em 0.25em 0 0;
            clip-path: polygon(0 0, 0 100%, 100% 50%); }

/* eventArea */
#eventArea {
  position: relative; }
  #eventArea .content {
    position: relative;
    z-index: 2; }
  #eventArea .title {
    overflow: hidden;
    font-size: 8.5rem;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-align: center;
    margin: calc(68 / 750 * 100%) 0 calc(29 / 750 * 100%) 0; }
    #eventArea .title span {
      display: inline-block;
      min-width: 2rem;
      transform: translateY(var(--y, 110%));
      transition: transform 0.4s cubic-bezier(0.77, 0, 0.175, 1);
      transition-delay: calc(0.04s * var(--char-index)); }
    #eventArea .title.current {
      --y: 0; }
  #eventArea .intro {
    font-size: 3.2rem;
    line-height: 1.44;
    text-align: center;
    margin: 0 0 calc(40 / 750 * 100%) 0; }
  #eventArea .image {
    width: calc(649 / 750 * 100%);
    margin: auto;
    padding: calc(73 / 750 * 100%) 0 calc(50 / 750 * 100%) 0;
    transform: translateY(50px); }
    #eventArea .image.current {
      transform: translateY(0); }
  #eventArea .copy {
    font-size: 4.2rem;
    line-height: 1;
    font-weight: 700;
    text-align: center;
    margin: 0 0 calc(50 / 750 * 100%) 0; }
    #eventArea .copy .band {
      display: inline-block;
      color: #ffffff;
      background-color: #D93825;
      margin: 2.2rem 0 0 0;
      padding: 0.2rem 0.4rem 0.4rem 0.4rem; }
      #eventArea .copy .band:first-child {
        margin-top: 0; }
  #eventArea .text {
    font-size: 2.6rem;
    line-height: 1.77;
    font-weight: 500;
    text-align: center;
    margin: 0 0 calc(88 / 750 * 100%) 0; }
  #eventArea .buttonArea {
    text-align: center;
    padding: 0 0 calc(115 / 750 * 100%) 0; }
    #eventArea .buttonArea .check {
      display: inline-block;
      position: relative;
      color: #D93825;
      font-size: 3.6rem;
      line-height: 1;
      font-weight: 700;
      margin: 0 0 calc(32 / 750 * 100%) 2.6rem; }
      #eventArea .buttonArea .check:after {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 3.3rem;
        height: 3.5rem;
        background: url(../images/img_check.png) center center no-repeat;
        background-size: contain;
        margin: -3.3rem -3.3rem 0 0; }
      #eventArea .buttonArea .check .em {
        display: inline-block;
        padding: 0 0.3em; }
    #eventArea .buttonArea .button {
      display: flex;
      align-items: center;
      justify-content: center;
      width: calc(484 / 750 * 100%);
      color: #ffffff;
      font-size: 3.85rem;
      line-height: 1;
      font-weight: 700;
      background-color: #000000;
      margin: auto;
      padding: 0.85em 0;
      border-radius: 3em;
      transform: scale(0.6);
      transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
      #eventArea .buttonArea .button.current {
        transform: scale(1); }
      #eventArea .buttonArea .button:before {
        content: "";
        display: block;
        width: 0.6em;
        height: 0.8em;
        background-color: #ffffff;
        margin: 0 0.25em 0 0;
        clip-path: polygon(0 0, 0 100%, 100% 50%); }

/* categoryArea */
#categoryArea {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 90;
  margin: calc(96 / 750 * 100vw) 0 0 0;
  transform: translateY(-150%);
  transition: transform 0.4s ease-out; }
  #categoryArea.fixed {
    transform: translateY(0); }
  #categoryArea.open .accordionHead .accordionTrigger:before {
    transform: rotate(180deg); }
  #categoryArea.open .accordionHead .accordionTrigger:after {
    opacity: 0;
    transform: rotate(90deg); }
  #categoryArea .accordionHead .accordionTrigger {
    display: block;
    width: 100%;
    position: relative;
    color: #ffffff;
    font-size: 3.2rem;
    line-height: 1;
    font-weight: 700;
    text-align: center;
    background-color: #7F7F7F;
    padding: calc(28 / 750 * 100%) 0; }
    #categoryArea .accordionHead .accordionTrigger:before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      right: 15px;
      width: 15px;
      height: 1px;
      background-color: #ffffff;
      margin: auto;
      transition: all 0.3s ease-out; }
    #categoryArea .accordionHead .accordionTrigger:after {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      right: 22px;
      width: 1px;
      height: 15px;
      background-color: #ffffff;
      margin: auto;
      transition: all 0.3s ease-out; }
  #categoryArea .categoryList {
    position: relative;
    z-index: 2;
    margin: 0 0 calc(80 / 750 * 100%) 0;
    box-shadow: 0 6px 6px rgba(0, 0, 0, 0.1); }
    #categoryArea .categoryList .list {
      display: flex;
      flex-wrap: wrap;
      background-color: #FBF9F6;
      padding: calc(32 / 750 * 100%) calc(32 / 750 * 100%); }
      #categoryArea .categoryList .list .item {
        margin: 0 calc(10 / 686 * 100%) calc(18 / 686 * 100%) calc(10 / 686 * 100%); }
        #categoryArea .categoryList .list .item .categoryButton {
          display: block;
          font-size: 2.5rem;
          line-height: 1;
          text-align: center;
          background-color: #ffffff;
          padding: 0.7em 1.2em 0.9em 1.2em;
          border: 1px solid #000000;
          border-radius: 2em;
          transition: all 0.5s ease-out; }
          #categoryArea .categoryList .list .item .categoryButton.current, #categoryArea .categoryList .list .item .categoryButton:hover {
            color: #ffffff;
            background-color: #000000; }

@media screen and (min-width: 751px) {
  #categoryArea {
    max-width: 460px;
    margin: calc(96px * (460 / 750)) auto 0 auto; }
    #categoryArea .accordionContent {
      max-width: 456px;
      margin: auto; } }
/* itemList */
#itemList {
  position: relative; }
  #itemList .bg {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
    font-size: 8.5rem;
    line-height: 1;
    background-color: #FBF9F6;
    margin: calc(246 / 750 * 100% + 0.56em) 0 0 0; }
  #itemList .content {
    position: relative;
    z-index: 2; }
  #itemList .title {
    overflow: hidden;
    font-size: 8.5rem;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-align: center;
    margin: calc(150 / 750 * 100%) 0 calc(65 / 750 * 100%) 0; }
    #itemList .title span {
      display: inline-block;
      min-width: 2rem;
      transform: translateY(var(--y, 110%));
      transition: transform 0.4s cubic-bezier(0.77, 0, 0.175, 1);
      transition-delay: calc(0.04s * var(--char-index)); }
    #itemList .title.current {
      --y: 0; }
  #itemList .intro {
    font-size: 3.2rem;
    line-height: 1.44;
    text-align: center;
    margin: 0 0 calc(100 / 750 * 100%) 0; }
  #itemList .categoryList {
    position: relative;
    z-index: 2;
    margin: 0 0 calc(80 / 750 * 100%) 0; }
    #itemList .categoryList .list {
      display: flex;
      flex-wrap: wrap;
      padding: 0 calc(32 / 750 * 100%); }
      #itemList .categoryList .list .item {
        margin: 0 calc(10 / 686 * 100%) calc(18 / 686 * 100%) calc(10 / 686 * 100%); }
        #itemList .categoryList .list .item .categoryButton {
          display: block;
          font-size: 2.5rem;
          line-height: 1;
          text-align: center;
          background-color: #ffffff;
          padding: 0.7em 1.2em 0.9em 1.2em;
          border: 1px solid #000000;
          border-radius: 2em;
          transition: all 0.5s ease-out; }
          #itemList .categoryList .list .item .categoryButton.current, #itemList .categoryList .list .item .categoryButton:hover {
            color: #ffffff;
            background-color: #000000; }
  #itemList .area {
    margin: calc(-150 / 750 * 100vw) 0 0 0;
    padding: calc(150 / 750 * 100vw) 0 calc(103 / 750 * 100%) 0; }
    #itemList .area .list {
      display: flex;
      flex-wrap: wrap; }
      #itemList .area .list .block {
        opacity: 0;
        display: none;
        flex-basis: calc(356 / 750 * 100%);
        margin: calc(-20 / 750 * 100%) calc(38 / 750 * 100%) 0 0;
        transform: translateY(var(--y, 100px));
        transition: all 0.6s ease-out; }
        #itemList .area .list .block:nth-child(2n) {
          transition-delay: 0.2s; }
        #itemList .area .list .block.current {
          --y: 0;
          opacity: 1; }
        #itemList .area .list .block.set {
          opacity: 1;
          transform: translateY(0);
          transition: all 0s ease-out;
          transition-delay: 0s; }
        #itemList .area .list .block[data-show="2"] {
          margin-top: calc(62 / 750 * 100%);
          margin-right: 0; }
          #itemList .area .list .block[data-show="2"] .box {
            border-radius: 0 0 0 3rem; }
        #itemList .area .list .block.show {
          display: block; }
        #itemList .area .list .block .box {
          overflow: hidden;
          background-color: #ffffff;
          border-radius: 0 0 3rem 0;
          box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.15); }
          #itemList .area .list .block .box .image {
            position: relative;
            padding: calc(278 / 356 * 100%) 0 0 0; }
            #itemList .area .list .block .box .image.top img {
              object-position: 0 0; }
            #itemList .area .list .block .box .image.bottom img {
              object-position: 0 100%; }
            #itemList .area .list .block .box .image:after {
              content: "";
              display: block;
              position: absolute;
              bottom: 0;
              right: 0;
              width: calc(64 / 356 * 100%);
              background: url(../images/icon_search.png) center center no-repeat;
              background-size: contain;
              margin: 0 calc(15 / 356 * 100%) calc(13 / 356 * 100%) 0;
              padding: calc(64 / 356 * 100%) 0 0 0; }
            #itemList .area .list .block .box .image img {
              position: absolute;
              top: 0;
              bottom: 0;
              left: 0;
              right: 0;
              width: 100%;
              height: 100%;
              object-fit: cover; }
          #itemList .area .list .block .box .name {
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
            min-height: calc(33 / 26 * 3em);
            font-size: 2.6rem;
            line-height: 1.27;
            letter-spacing: -0.04em;
            text-align: center;
            padding: calc(15 / 356 * 100%) calc(13 / 356 * 100%); }
            #itemList .area .list .block .box .name:after {
              content: "";
              display: block;
              position: absolute;
              bottom: 0;
              left: 0;
              right: 0;
              width: calc(294 / 356 * 100%);
              height: 1px;
              background-color: #000000;
              margin: auto; }
          #itemList .area .list .block .box .shop {
            width: calc(260 / 356 * 100%);
            margin: auto;
            padding: calc(20 / 356 * 100%); }
            #itemList .area .list .block .box .shop.type2 {
              width: calc(220 / 356 * 100%); }
            #itemList .area .list .block .box .shop img {
              height: auto; }
    #itemList .area .nodata {
      display: none;
      font-size: 2.6rem;
      line-height: 1.27;
      text-align: center;
      padding: calc(50 / 750 * 100%) 0; }
  #itemList .items {
    display: none; }

@media screen and (min-width: 751px) {
  #itemList .area {
    margin-top: calc(-150px * (460 / 750));
    padding-top: calc(150px * (460 / 750)); } }
/* staffOutfit */
#staffOutfit {
  background-color: var(--main-color);
  padding: 0 0 calc(80 / 750 * 100%) 0; }
  #staffOutfit .scrollPosition {
    background-color: #ffffff; }
  #staffOutfit .content {
    overflow: hidden;
    background-color: #ffffff;
    border-radius: 0 0 5rem 5rem; }
  #staffOutfit .contentInner {
    width: 100%; }
  #staffOutfit .title {
    overflow: hidden;
    font-size: 8.5rem;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-align: center;
    margin: calc(82 / 750 * 100%) 0 calc(56 / 750 * 100%) 0; }
    #staffOutfit .title.kana {
      font-size: 5.4rem;
      line-height: 1;
      letter-spacing: -0.06em; }
    #staffOutfit .title span {
      display: inline-block;
      min-width: 2rem;
      transform: translateY(var(--y, 110%));
      transition: transform 0.4s cubic-bezier(0.77, 0, 0.175, 1);
      transition-delay: calc(0.04s * var(--char-index)); }
    #staffOutfit .title.current {
      --y: 0; }
  #staffOutfit .intro {
    font-size: 3.2rem;
    line-height: 1.44;
    text-align: center; }
  #staffOutfit .wrap {
    padding: 0 0 calc(40 / 750 * 100%) 0; }
  #staffOutfit .staffstart__facility_top {
    padding: 40px 20px; }
    #staffOutfit .staffstart__facility_top * {
      font-size: 2.4rem;
      line-height: 1.5; }
  #staffOutfit .staffstart__stylingbody {
    margin-top: 0; }
    #staffOutfit .staffstart__stylingbody .tab-wrap {
      justify-content: flex-end;
      margin: 0; }
      #staffOutfit .staffstart__stylingbody .tab-wrap .tab-label {
        margin: 0 0 10px 0; }
  #staffOutfit .more-button a {
    font-size: 3.2rem;
    line-height: 1;
    padding: 1em 0; }

/* bottomArea */
.bottomArea .content {
  background-color: var(--main-color);
  padding: calc(40 / 750 * 100%) 0; }
.bottomArea .copy {
  color: #ffffff;
  font-size: 2.2rem;
  line-height: 1.41;
  letter-spacing: 0.08em;
  text-align: center; }
.bottomArea .title {
  color: #ffffff;
  font-size: 5.2rem;
  line-height: 1.15;
  letter-spacing: 0.05em;
  text-align: center; }

/* modalContentWrap */
.modalContentWrap {
  overflow: hidden;
  display: none;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 100000;
  transform: translateY(100vh); }
  .modalContentWrap .bg {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.5); }
  .modalContentWrap .modalContent {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    height: 100%; }
    .modalContentWrap .modalContent .box {
      position: relative;
      width: calc(678 / 750 * 100%);
      max-height: 80vh;
      max-height: 80dvh;
      background-color: #ffffff;
      margin: auto;
      padding: 10px;
      border-radius: 2rem;
      box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.15);
      box-sizing: border-box; }
      .modalContentWrap .modalContent .box .scrollContent {
        overflow: auto;
        overscroll-behavior-y: none;
        position: relative;
        width: 100%;
        height: 100%;
        max-height: calc(80vh - 20px);
        max-height: calc(80dvh - 20px);
        padding: calc(40 / 678 * 100%) 0;
        box-sizing: border-box;
        -webkit-overflow-scrolling: touch; }
      .modalContentWrap .modalContent .box .slide {
        width: calc(586 / 678 * 100%);
        margin: 0 auto calc(74 / 678 * 100%) auto;
        border: 1px solid #EEEEEE;
        aspect-ratio: 398 / 301.55; }
        .modalContentWrap .modalContent .box .slide .image {
          position: relative;
          padding: calc(444 / 586 * 100%) 0 0 0; }
          .modalContentWrap .modalContent .box .slide .image img {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            width: 100%;
            height: 100%;
            object-fit: contain; }
      .modalContentWrap .modalContent .box .info {
        width: calc(586 / 678 * 100%);
        margin: 0 auto calc(27 / 678 * 100%) auto; }
        .modalContentWrap .modalContent .box .info .name {
          font-size: 3.7rem;
          line-height: 1.22;
          font-weight: 700;
          margin: 0 0 calc(12 / 586 * 100%) 0; }
          .modalContentWrap .modalContent .box .info .name .small {
            font-size: 3rem;
            line-height: 1.5; }
        .modalContentWrap .modalContent .box .info .price {
          font-size: 5rem;
          line-height: 1;
          font-weight: 700;
          margin: 0 0 calc(13 / 586 * 100%) 0; }
          .modalContentWrap .modalContent .box .info .price .small {
            font-size: 3rem;
            line-height: 1.67; }
          .modalContentWrap .modalContent .box .info .price .unit {
            display: inline-block;
            font-size: 2.6rem;
            line-height: 1.92;
            margin: 0 0 0 0.5em; }
        .modalContentWrap .modalContent .box .info .desc {
          font-size: 2.7rem;
          line-height: 1.81; }
      .modalContentWrap .modalContent .box .tags {
        display: flex;
        flex-wrap: wrap;
        width: calc(586 / 678 * 100%);
        margin: 0 auto calc(20 / 678 * 100%) auto; }
        .modalContentWrap .modalContent .box .tags .item {
          margin: 0 calc(18 / 586 * 100%) calc(18 / 586 * 100%) 0; }
          .modalContentWrap .modalContent .box .tags .item .categoryButton {
            cursor: pointer;
            display: block;
            font-size: 1.8rem;
            line-height: 1;
            text-align: center;
            padding: 0.6em 1.2em;
            border: 1px solid #000000;
            border-radius: 2em;
            transition: all 0.5s ease-out; }
            .modalContentWrap .modalContent .box .tags .item .categoryButton.current, .modalContentWrap .modalContent .box .tags .item .categoryButton:hover {
              color: #ffffff;
              background-color: #000000; }
      .modalContentWrap .modalContent .box .shop .inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: calc(586 / 678 * 100%);
        background-color: #FBF9F6;
        margin: auto;
        padding: calc(20 / 678 * 100%) calc(23 / 678 * 100%); }
        .modalContentWrap .modalContent .box .shop .inner .image {
          flex-basis: calc(200 / 540 * 100%);
          position: relative;
          background-color: #ffffff;
          margin: 0 calc(20 / 540 * 100%) 0 0;
          padding: calc(135 / 540 * 100%) 0 0 0; }
          .modalContentWrap .modalContent .box .shop .inner .image img {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            height: auto;
            margin: auto; }
        .modalContentWrap .modalContent .box .shop .inner .wrap {
          display: flex;
          flex-basis: calc(320 / 540 * 100%);
          flex-wrap: wrap; }
          .modalContentWrap .modalContent .box .shop .inner .wrap .name {
            flex-basis: 100%;
            font-size: 2.6rem;
            line-height: 1.31;
            font-weight: 700;
            margin: 0 0 0.5em 0; }
          .modalContentWrap .modalContent .box .shop .inner .wrap .place {
            flex-basis: 100%;
            font-size: 2.1rem;
            line-height: 1.62; }
    .modalContentWrap .modalContent .closeButton {
      cursor: pointer;
      position: absolute;
      top: -3.5rem;
      right: 0.7rem;
      width: 5rem;
      height: 5rem; }
      .modalContentWrap .modalContent .closeButton:before, .modalContentWrap .modalContent .closeButton:after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: 2px;
        background-color: #ffffff;
        transform: rotate(45deg); }
      .modalContentWrap .modalContent .closeButton:after {
        transform: rotate(-45deg); }
  .modalContentWrap.close .bg {
    display: none; }
  .modalContentWrap.open {
    transform: translateY(0); }

@media screen and (min-width: 751px) {
  .modalContentWrap .modalContent .box {
    max-width: 460px; } }
/* floatBanner */
#floatBanner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 99; }
  #floatBanner .banner {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #ffffff;
    transform: translateY(150%);
    transition: transform 0.4s ease-out; }
    #floatBanner .banner.open {
      transform: translateY(0); }
    #floatBanner .banner .box {
      position: relative;
      color: #ffffff;
      background-color: #0168B7;
      padding: calc(20 / 375 * 100%) calc(23 / 375 * 100%) calc(12 / 375 * 100%) calc(23 / 375 * 100%); }
      #floatBanner .banner .box .copy {
        display: inline-block;
        position: absolute;
        top: 0;
        left: 0;
        color: #FFFF00;
        font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
        font-size: 2.5rem;
        line-height: 1;
        font-weight: 700;
        background-color: #000000;
        margin: -1em 0 0 0.8em;
        padding: 0.5em 0.8em 0.5em 1.2em;
        border-radius: 2em; }
        #floatBanner .banner .box .copy .icon {
          display: flex;
          align-items: center; }
          #floatBanner .banner .box .copy .icon:before {
            content: "";
            display: block;
            width: 0.8em;
            height: 1em;
            background-color: #FFFF00;
            margin: 0 0.5em 0 0;
            clip-path: polygon(0 0, 0 100%, 100% 50%); }
      #floatBanner .banner .box .small {
        font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
        font-size: 2.5rem;
        line-height: 1;
        margin: 0 0 0.7em 0; }
      #floatBanner .banner .box .headline {
        font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
        font-size: 4.4rem;
        line-height: 1;
        font-weight: 700;
        letter-spacing: 0.02em;
        margin: 0 0 0.4em 0; }
      #floatBanner .banner .box .period {
        display: flex;
        align-items: center; }
        #floatBanner .banner .box .period .head {
          color: #000000;
          font-size: 2.4rem;
          line-height: 1;
          font-weight: 700;
          letter-spacing: 0.2em;
          background-color: #ffffff;
          padding: 0.3em 0.5em 0.3em 0.6em; }
        #floatBanner .banner .box .period .cont {
          font-size: 3rem;
          line-height: 1;
          margin: 0 0 0 0.5em;
          letter-spacing: 0.1em; }
    #floatBanner .banner .closeButton {
      cursor: pointer;
      position: absolute;
      top: -3rem;
      right: 1rem;
      width: 4rem;
      height: 4rem; }
      #floatBanner .banner .closeButton:before, #floatBanner .banner .closeButton:after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: 1px;
        background-color: #000000;
        transform: rotate(45deg); }
      #floatBanner .banner .closeButton:after {
        transform: rotate(-45deg); }

@media screen and (min-width: 751px) {
  #floatBanner {
    max-width: 460px;
    margin: auto; } }