@charset "UTF-8";
/* CSS Document */

/* PC MENU */
.gmenu_bg{padding: 0;
    margin-top:8px;
    margin-bottom:8px;
    background: #FFF;
    border-radius:  5px;    /* 角丸指定 */}

 ul.menu{ list-style-type:none; display:flex; margin:0; padding:0;justify-content:center;gap:1px;}
      ul.menu li{ margin:0; padding:0;width:calc(100% / 6);text-align: center;}
      ul.menu li a{ color:#FFF;text-decoration:none; padding: 10px 20px; display:block;font-weight:bold;background: repeating-linear-gradient(45deg, #000000, #000000 2px, #2d2d2d 2px, #2d2d2d 4px);}
      ul.menu li:nth-child(1) a{ border-radius:  5px 0 0 5px; }
      ul.menu li:nth-child(6) a{ border-radius:  0 5px 5px 0; }
      ul.menu li a:hover{ opacity: 0.7;}

@media screen and (max-width: 1031px) {
	.gmenu_bg{display:none;}
	ul.menu{display:none;}}


/* SP MENU */

.header__inner{display:none;}


@media screen and (max-width: 1031px) {


    :root {
  --drawer-bar-gap: 8px;
  --duration: 300ms;
  --easing: ease;
}

.header {
  position: relative;
  z-index: 1000;
}

.header__inner {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  /*padding: 8px;*/
}

.drawer-button {
  position: relative;
  z-index: 1002;
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: center;
  justify-content: center;
  padding: 8px;
  touch-action: manipulation;
  cursor: pointer;
  background-color: transparent;
  border: none;
  border-radius: 8px;
}

.drawer-button__icon {
  position: relative;
  width: 32px;
  height: auto;
  aspect-ratio: 1;
}

.drawer-button__bar {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 100%;
  height: 2px;
  background-color: #000;
  border-radius: 9999px;
}

.drawer-button__bar:nth-child(1) {
  transform: translate(-50%, calc(-50% - var(--drawer-bar-gap)));
  transition: transform var(--duration) var(--easing);
}

.drawer-button__bar:nth-child(2) {
  transform: translate(-50%, -50%);
  transition: opacity var(--duration) var(--easing);
}

.drawer-button__bar:nth-child(3) {
  transform: translate(-50%, calc(-50% + var(--drawer-bar-gap)));
  transition: transform var(--duration) var(--easing);
}

.drawer-button__bar:nth-child(1):where(.is-open *) {
  transform: translate(-50%, -50%) rotate(45deg);
}

.drawer-button__bar:nth-child(2):where(.is-open *) {
  opacity: 0;
}

.drawer-button__bar:nth-child(3):where(.is-open *) {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.drawer-button__text {
  font-size: 10px;
  line-height: 1;
}

.drawer-nav[hidden] {
  display: none;
}

.drawer-nav {
  position: fixed;
  inset: 0;
  z-index: 1001;
  background: transparent;
}

.drawer-nav__inner {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: clamp(0px, 90vw, 280px);
  height: 100%;
  padding: 48px 24px;
  background-color: #fff;
  opacity: 1;
  transform: translate3d(100%, 0, 0);
  transition: transform var(--duration) var(--easing), opacity var(--duration) var(--easing);
}

.drawer-nav__inner:where(.is-open *) {
  transform: unset;
}

.is-vertical :where(.drawer-nav__inner) {
  transform: translate3d(0, 100%, 0);
}

.is-open.is-vertical :where(.drawer-nav__inner) {
  transform: unset;
}

.is-fade :where(.drawer-nav__inner) {
  opacity: 0;
}

.is-open.is-fade :where(.drawer-nav__inner) {
  opacity: 1;
}

.drawer-nav__menu {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 8px;
  padding: 0;
  margin: 0;
  overflow: auto;
  list-style: none;
}

.drawer-nav__link {
  display: block;
  padding: 12px 16px;
  line-height: 1.4;
  color: #111;
  text-decoration: none;
}

.drawer__overlay {
  position: absolute;
  inset: 0;
  z-index: 0;
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0.32);
  opacity: 0;
  transition: opacity var(--duration) var(--easing);
}

.is-open :where(.drawer__overlay) {
  opacity: 1;
}

    }

@media (prefers-reduced-motion: reduce) {
  .drawer-button__bar,
.drawer-nav__inner,
.drawer__overlay {
    transition: none !important;
  }
}
.is-open :where(.drawer__overlay) {
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  .drawer-button__bar,
.drawer-nav__inner,
.drawer__overlay {
    transition: none !important;
  }
}