a:link, a:visited {
  color: #000;
  text-decoration: none;
}
* {
  margin: 0;
  padding: 0;
}

ul {
  list-style-type: none;
  padding: 0;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, main, section {
  display: block;
  margin: 0;
  padding: 0;
}

* html body {
  overflow-y: auto;
}

* + html body {
  overflow-y: auto;
}

body {
  overflow-y: scroll;
}

.wp-block-group {
  margin-bottom: 0 !important;
}

html {
  -webkit-overflow-scrolling: touch;
}

input, textarea {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

img {
  vertical-align: bottom;
  border: 0;
  max-width: 100%;
  height: auto;
  width: auto;
  image-rendering: auto;
}

body {
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  background: url(../images/common/bg_mainbg01.jpg);
}

.pc, .pc-768, .pc-480, .pc-360 {
  display: initial;
}

.sp, .sp-768, .sp-680, .sp-480, .sp-360 {
  display: none;
}

a {
  pointer-events: none;
}

p.opening-soon {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99999;
}
p.opening-soon img {
  width: clamp(200px, 80vw, 900px);
}

div.overlay {
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.8);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}

@media screen and (min-width: 900px) {
  button.hamburger,
  nav#mobileMenu {
    display: none;
  }
}
h1 {
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
  width: 200px;
}
@media (hover: hover) and (pointer: fine) {
  h1:hover {
    opacity: 0.5;
  }
}
h1 a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

h2 {
  text-align: center;
}

.subTitle {
  background: url(../images/common/tex_wood-mini01.jpg);
  margin-bottom: 30px;
  padding: 20px 0;
}
.subTitle h3 {
  max-width: 700px;
  height: 85px;
  color: #fff;
  text-align: center;
  text-shadow: 1px 1px 5px #000;
  background: url(../images/common/subtitle_border-center01.png);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
  margin: auto;
}
.subTitle h3:before {
  content: "";
  width: calc(100% + 100px);
  height: 100%;
  background: url(../images/common/subtitle_border-left01.png) no-repeat left, url(../images/common/subtitle_border-right01.png) no-repeat right;
  display: inline-block;
  position: absolute;
  left: -50px;
}

div.inner {
  max-width: 800px;
  margin: auto;
}

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

.btn {
  font-size: 90%;
  font-weight: bold;
  border: solid 2px #C78B00;
  border-radius: 99px;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  margin: auto;
  padding: 10px 50px;
}
.btn:hover {
  color: #946700;
  background: #fff;
}

button#pageTopButton {
  opacity: 0;
  position: fixed;
  right: 20px;
  bottom: 150px;
  width: 100px;
  height: 100px;
  border: none;
  background: none;
  cursor: pointer;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  z-index: 1000;
}
button#pageTopButton img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: url(../images/common/bg_mainbg01.jpg);
}
header div.inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 10px 0;
}
header div.head_Wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 10px;
}
header div.head_Wrap.before-login a {
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
  width: 140px;
  display: block;
  clip-path: polygon(11% 0, 89% 0, 100% 50%, 89% 100%, 11% 100%, 0 50%);
  padding: 2px;
}
@media (hover: hover) and (pointer: fine) {
  header div.head_Wrap.before-login a:hover {
    opacity: 0.5;
  }
}
header div.head_Wrap.before-login a p {
  background: #000;
  clip-path: polygon(11% 0, 89% 0, 100% 50%, 89% 100%, 11% 100%, 0 50%);
  padding: 3px;
}
header div.head_Wrap.before-login a span {
  width: 100%;
  height: 35px;
  font-weight: 700;
  position: relative;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  line-height: 1;
  clip-path: polygon(10% 0, 90% 0, 100% 50%, 90% 100%, 10% 100%, 0 50%);
  -webkit-transition: opacity 0.2s ease, -webkit-transform 0.15s ease, -webkit-filter 0.2s ease;
  transition: opacity 0.2s ease, -webkit-transform 0.15s ease, -webkit-filter 0.2s ease;
  transition: transform 0.15s ease, filter 0.2s ease, opacity 0.2s ease;
  transition: transform 0.15s ease, filter 0.2s ease, opacity 0.2s ease, -webkit-transform 0.15s ease, -webkit-filter 0.2s ease;
}
header div.head_Wrap.before-login a#entry {
  background: #C78B00;
}
header div.head_Wrap.before-login a#entry span {
  color: #fff;
  text-shadow: 1px 1px 0 #8d6300;
  background: -webkit-gradient(linear, left top, left bottom, from(#c28800), color-stop(48.53%, #d49400), color-stop(51.88%, #8d6300), to(#d59500));
  background: linear-gradient(#c28800 0%, #d49400 48.53%, #8d6300 51.88%, #d59500 100%);
}
header div.head_Wrap.before-login a#entry img {
  width: 20px;
  margin-left: 5px;
}
header div.head_Wrap.before-login a#login {
  background: #ccc;
}
header div.head_Wrap.before-login a#login span {
  color: #000;
  text-shadow: 1px 1px 0 #fff;
  background: -webkit-gradient(linear, left top, left bottom, from(#dfdfdf), color-stop(48.53%, #f3f3f3), color-stop(51.88%, #c2c2c2), to(#fbfbfb));
  background: linear-gradient(#dfdfdf 0%, #f3f3f3 48.53%, #c2c2c2 51.88%, #fbfbfb 100%);
}
header div.head_Wrap.before-login a#login img {
  width: 15px;
  margin-left: 5px;
}
header div.head_Wrap.login a#gp {
  font-size: 100%;
  font-weight: bold;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: #eee9c9;
  border-radius: 5px;
  padding: 5px;
}
header div.head_Wrap.login a#gp img {
  width: 50px;
}
header div.head_Wrap.login a#gp p {
  padding: 0 10px;
}
header div.head_Wrap.login a#coin {
  font-size: 100%;
  font-weight: bold;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: #eee9c9;
  border-radius: 5px;
  padding: 5px;
}
header div.head_Wrap.login a#coin img {
  width: 34px;
}
header div.head_Wrap.login a#coin img:last-child {
  width: 28px;
}
header div.head_Wrap.login a#coin p {
  padding: 0 10px;
}
header div.head_Wrap.login a#notice {
  background: #eee9c9;
  border-radius: 99px;
  padding: 8px;
}
header div.head_Wrap.login a#notice img {
  width: 30px;
}

footer {
  background: #eee9c9;
}
footer div.inner {
  padding: 50px 0;
}
footer nav#fNavi {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 50px;
  margin-bottom: 50px;
}
footer nav#fNavi dl {
  width: 100%;
}
footer nav#fNavi dl dt, footer nav#fNavi dl dd {
  font-weight: bold;
  text-align: center;
}
footer nav#fNavi dl dt {
  color: #fff;
  background: url(../images/common/tex_wood-mini01.jpg);
  position: relative;
  clip-path: polygon(10% 0%, 90% 0%, 100% 50%, 90% 100%, 10% 100%, 0% 50%);
  margin-bottom: 20px;
  padding: 15px;
}
footer nav#fNavi dl dd:not(:last-child) {
  margin-bottom: 10px;
}
footer nav#fNavi dl dd a {
  background: #FFFCE5;
  display: block;
  border-radius: 99px;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  padding: 10px;
}
@media (hover: hover) and (pointer: fine) {
  footer nav#fNavi dl dd a:hover {
    color: #C78B00;
    background: #fff;
  }
}
footer nav#fNavi dl dd a.unUsed {
  opacity: 0.5;
}
footer div#fLogo {
  font-weight: bold;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 10px;
  margin-bottom: 20px;
}
footer div#fLogo img {
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
@media (hover: hover) and (pointer: fine) {
  footer div#fLogo img:hover {
    opacity: 0.5;
  }
}
footer p#copyright {
  font-weight: bold;
  text-align: center;
}

section#head-slider {
  background: #eee9c9;
  padding: 20px 0 50px 0;
}
section#head-slider div.splide li.splide__slide {
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
  max-width: 454px;
  max-height: 114px;
}
@media (hover: hover) and (pointer: fine) {
  section#head-slider div.splide li.splide__slide:hover {
    opacity: 0.5;
  }
}
section#head-slider div.splide ul.splide__pagination {
  bottom: -2em;
}
section#head-slider div.splide ul.splide__pagination button.splide__pagination__page {
  width: 30px;
  height: 5px;
  background: #ccc;
  border-radius: 99px;
  margin: 5px;
}
section#head-slider div.splide ul.splide__pagination button.splide__pagination__page.is-active {
  background: #C78B00;
  -webkit-transform: initial;
          transform: initial;
}

nav#category-tab div.inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 10px;
  padding-top: 25px;
}
nav#category-tab a {
  width: 200px;
  font-weight: bold;
  background: #C78B00;
  clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%, 0 12px);
}
nav#category-tab a span {
  background: -webkit-gradient(linear, left top, left bottom, from(#eee9c9), to(#eee9c9)) padding-box, -webkit-gradient(linear, left top, left bottom, from(#C78B00), to(#C78B00)) border-box;
  background: linear-gradient(#eee9c9, #eee9c9) padding-box, linear-gradient(#C78B00, #C78B00) border-box;
  border-left: solid 2px #C78B00;
  border-top: solid 2px #C78B00;
  border-right: solid 2px #C78B00;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  clip-path: polygon(15px 0, calc(100% - 15px) 0, 100% 15px, 100% 100%, 0 100%, 0 15px);
  position: relative;
  padding: 10px 0 8px 0;
}
nav#category-tab a span:before, nav#category-tab a span:after {
  content: "";
  width: 25px;
  height: 25px;
  position: absolute;
}
nav#category-tab a span:before {
  background: url(../images/common/deco_category01.svg) no-repeat;
  top: 3px;
  left: 3px;
}
nav#category-tab a span:after {
  background: url(../images/common/deco_category01.svg) no-repeat;
  top: 3px;
  right: 3px;
  -webkit-transform: scale(-1, 1);
          transform: scale(-1, 1);
}
nav#category-tab a:not(.unUsed) {
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
@media (hover: hover) and (pointer: fine) {
  nav#category-tab a:not(.unUsed):hover {
    opacity: 0.5;
  }
}
nav#category-tab a.unUsed {
  font-size: 80%;
  color: #999;
  background: #ccc;
  pointer-events: none;
}
nav#category-tab a.unUsed span {
  background: #efefef;
  border-left: solid 2px #ccc;
  border-top: solid 2px #ccc;
  border-right: solid 2px #ccc;
  padding: 14px 0 9px 0;
}
nav#category-tab a.unUsed span:before, nav#category-tab a.unUsed span:after {
  -webkit-filter: grayscale(1);
          filter: grayscale(1);
  opacity: 0.5;
}

nav#navi_tag {
  height: 10px;
  background: url(../images/common/tex_wood-mini01.jpg);
  overflow: hidden;
  margin-bottom: 30px;
}
nav#navi_tag div.inner-free {
  max-width: 800px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  position: relative;
  margin: auto;
}
nav#navi_tag div.inner-free button {
  color: #000;
  background: #fff;
  border: none;
  border-radius: 99px;
  -webkit-transition: background 0.3s;
  transition: background 0.3s;
  cursor: pointer;
  padding: 5px 15px 5px 15px;
}
@media (hover: hover) and (pointer: fine) {
  nav#navi_tag div.inner-free button:hover {
    background: #ececec;
  }
}
nav#navi_tag div.inner-free div.recommend-order_wrap {
  position: relative;
  padding-left: 110px;
}
nav#navi_tag div.inner-free div.recommend-order_wrap button.recommend-order {
  width: 100px;
  font-weight: bold;
  white-space: nowrap;
  background: #ff0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: background 0.3s;
  transition: background 0.3s;
  border-radius: 5px;
  position: absolute;
  left: 0;
}
nav#navi_tag div.inner-free div.recommend-order_wrap button.recommend-order img {
  width: 15px;
  height: 15px;
  margin-left: 5px;
}
@media (hover: hover) and (pointer: fine) {
  nav#navi_tag div.inner-free div.recommend-order_wrap button.recommend-order:hover {
    background: #ffd200;
  }
}
nav#navi_tag div.inner-free div.recommend-order_wrap.recommend_menu-open div.recommend_menu {
  height: auto;
  opacity: 1;
  pointer-events: auto;
}
nav#navi_tag div.inner-free div.tag_menu {
  scrollbar-width: none;
}
nav#navi_tag div.inner-free div.tag_menu div.tab_menu_inner {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.5em;
}
nav#navi_tag.reco_fixed div.recommend-order_wrap {
  max-width: 690px;
}
nav#navi_tag.reco_fixed div.tag_menu {
  width: 100%;
  overflow-x: auto;
}

div.recommend_menu {
  width: 180px;
  background: #fff;
  border: solid 1px #ccc;
  border-radius: 5px;
  -webkit-box-shadow: 2px 2px 0 #ccc;
          box-shadow: 2px 2px 0 #ccc;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  opacity: 0;
  -webkit-transition: opacity 0.25s ease, height 0.25s ease, -webkit-transform 0.25s ease;
  transition: opacity 0.25s ease, height 0.25s ease, -webkit-transform 0.25s ease;
  transition: opacity 0.25s ease, height 0.25s ease, transform 0.25s ease;
  transition: opacity 0.25s ease, height 0.25s ease, transform 0.25s ease, -webkit-transform 0.25s ease;
  pointer-events: none;
  position: absolute;
  top: 45px;
  left: 0;
  z-index: 100;
  padding: 10px;
}
div.recommend_menu.active {
  opacity: 1;
  pointer-events: auto;
}
div.recommend_menu a {
  border-radius: 5px;
  position: relative;
  padding: 5px 5px 5px 40px;
}
@media (hover: hover) and (pointer: fine) {
  div.recommend_menu a:hover {
    background: #eee9c9;
  }
}
div.recommend_menu a.active {
  background: #eee9c9;
}
div.recommend_menu a.active:before {
  content: "";
  width: 20px;
  height: 15px;
  display: block;
  background: url(../images/common/icon_check01.svg) no-repeat;
  background-size: contain;
  position: absolute;
  left: 10px;
  top: 10px;
}

section#guild-information div.subTitle {
  margin-bottom: 50px;
}
section#guild-information div.guild-info_wrap {
  max-width: 700px;
  background: url(../images/tex_paper01.jpg) no-repeat #fff;
  background-size: cover;
  border: solid 2px #C78B00;
  position: relative;
  margin: auto auto 50px auto;
  padding: 50px;
}
section#guild-information div.guild-info_wrap:before {
  content: "";
  width: 100%;
  height: 100%;
  background: url(../images/common/decoration_corner01.svg) no-repeat 5px 5px, url(../images/common/decoration_corner02.svg) no-repeat calc(100% - 5px) 5px, url(../images/common/decoration_corner03.svg) no-repeat 5px calc(100% - 5px), url(../images/common/decoration_corner04.svg) no-repeat calc(100% - 5px) calc(100% - 5px);
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
}
section#guild-information div.guild-info_wrap article {
  text-shadow: 1px 1px 0 #fff;
  background: url(../images/common/line01.svg) no-repeat bottom;
  padding: 20px 0;
}
section#guild-information div.guild-info_wrap article:first-of-type {
  padding-top: 0;
}
section#guild-information div.guild-info_wrap article a {
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
section#guild-information div.guild-info_wrap article a:hover {
  opacity: 0.5;
}
section#guild-information div.guild-info_wrap article time {
  font-size: 80%;
  font-weight: bold;
  color: #A06300;
}
section#guild-information div.guild-info_wrap div.btn-wrap {
  padding-top: 50px;
}

nav#sticky-bottom {
  background: url(../images/common/tex_wood-mini01.jpg);
  position: sticky;
  bottom: -1px;
  z-index: 1000;
  padding: 15px 0 12px 0;
}
nav#sticky-bottom div.inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 80px;
}
nav#sticky-bottom div.inner a {
  font-size: 60%;
  font-weight: bold;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 5px;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
@media (hover: hover) and (pointer: fine) {
  nav#sticky-bottom div.inner a:hover {
    opacity: 0.5;
  }
}
nav#sticky-bottom div.inner a img {
  width: auto;
  height: 25px;
}
nav#sticky-bottom div.inner a.current {
  color: #ff0;
}
nav#sticky-bottom div.inner a.current img {
  -webkit-filter: brightness(0) saturate(100%) invert(93%) sepia(57%) saturate(7500%) hue-rotate(0deg) brightness(104%) contrast(105%);
          filter: brightness(0) saturate(100%) invert(93%) sepia(57%) saturate(7500%) hue-rotate(0deg) brightness(104%) contrast(105%);
}

section#limited-collection {
  margin-bottom: 30px;
}
section#limited-collection div.inner {
  background: url(../images/common/tex_red_carpet01.jpg) red;
  -webkit-animation: ani_limitedBg 15s linear infinite;
          animation: ani_limitedBg 15s linear infinite;
  border-radius: 10px;
  padding: 20px;
}
@-webkit-keyframes ani_limitedBg {
  0% {
    background-position: 0 100%;
  }
  100% {
    background-position: 0 0;
  }
}
@keyframes ani_limitedBg {
  0% {
    background-position: 0 100%;
  }
  100% {
    background-position: 0 0;
  }
}
section#limited-collection h2 {
  max-width: 800px;
  height: 90px;
  font-weight: bold;
  text-shadow: 1px 1px 0 #fff;
  background: url(../images/limited-text_frame01.png) no-repeat;
  background-size: contain;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 20px;
}
section#limited-collection h2 span {
  color: #c00;
}

section#regular-collection {
  margin-bottom: 60px;
}

section.packList-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 20px;
}
section.packList-wrap div.packBox {
  max-width: 390px;
  background: #fff;
  border-radius: 10px;
  -webkit-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);
          box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);
  overflow: hidden;
}
section.packList-wrap div.packBox div.gacha-info {
  height: 35px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 15px;
  padding: 15px;
}
section.packList-wrap div.packBox div.gacha-info p {
  font-size: 18px;
  font-weight: bold;
  letter-spacing: -0.5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 0;
      -ms-flex: 0 1 110px;
          flex: 0 1 110px;
}
section.packList-wrap div.packBox div.gacha-info p img {
  width: 25px;
  height: 25px;
  margin-right: 5px;
}
section.packList-wrap div.packBox div.gacha-info p small {
  font-size: 70%;
  white-space: nowrap;
  padding-top: 5px;
}
section.packList-wrap div.packBox div.gacha-info div.remaining-meter {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-flex: 1;
      -ms-flex: 1 0;
          flex: 1 0;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 5px;
}
section.packList-wrap div.packBox div.gacha-info div.remaining-meter div.rest {
  font-size: clamp(10px, 3vw, 14px);
  font-weight: bold;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
section.packList-wrap div.packBox div.gacha-info div.remaining-meter div.rest img {
  width: 20px;
}
section.packList-wrap div.packBox div.gacha-info div.remaining-meter div.meter {
  height: 8px;
  background: #ddd;
  border-radius: 99px;
  overflow: hidden;
}
section.packList-wrap div.packBox div.gacha-info div.remaining-meter div.meter p.gauge {
  width: 100%;
  height: 100%;
}
section.packList-wrap div.packBox div.gacha-info div.remaining-meter div.meter p.gauge.bg-green {
  background: #75D522;
}
section.packList-wrap div.packBox div.gacha-info div.remaining-meter div.meter p.gauge.bg-orange {
  background: #FF9900;
}
section.packList-wrap div.packBox div.gacha-info div.remaining-meter div.meter p.gauge.bg-red {
  background: #DF0000;
}
section.packList-wrap div.packBox div.gacha-info div.remaining-meter div.meter p.gauge.bg-rainbow {
  background: -webkit-gradient(linear, right top, left top, from(#ffe600), color-stop(51.88%, #00baff), to(#f0a));
  background: linear-gradient(to left, #ffe600 0%, #00baff 51.88%, #f0a 100%);
}
section.packList-wrap div.packBox div.gachaButton {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 10px;
  padding: 0 15px 15px 15px;
}
section.packList-wrap div.packBox div.gachaButton button {
  width: 100%;
  height: 40px;
  font-weight: bold;
  border-radius: 5px;
  cursor: pointer;
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
  position: relative;
  padding: 0 0 1px 0;
}
section.packList-wrap div.packBox div.gachaButton button:before {
  content: "";
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  display: block;
  border: solid 1px #ddd;
  border-radius: 3px;
  mix-blend-mode: overlay;
  position: absolute;
  left: 0;
  top: 0;
}
section.packList-wrap div.packBox div.gachaButton button:after {
  content: "";
  width: calc(100% + 12px);
  height: 46px;
  display: block;
  position: absolute;
  z-index: 1;
  top: -4px;
  left: -6px;
}
@media (hover: hover) and (pointer: fine) {
  section.packList-wrap div.packBox div.gachaButton button:hover {
    opacity: 0.5;
  }
}
section.packList-wrap div.packBox div.gachaButton button.gacha-1 {
  color: #000;
  text-shadow: 1px 1px 0 #ff0;
  background: -webkit-gradient(linear, left top, left bottom, from(#f3d720), to(#f39f20));
  background: linear-gradient(#f3d720 0%, #f39f20 100%);
  border: 2px solid #C78B00;
  -webkit-box-shadow: 0 0 0 #C78B00;
          box-shadow: 0 0 0 #C78B00;
}
section.packList-wrap div.packBox div.gachaButton button.gacha-1:after {
  background: url(../images/common/button_deco_yellow01.svg) no-repeat left top, url(../images/common/button_deco_yellow02.svg) no-repeat right bottom 1px;
}
section.packList-wrap div.packBox div.gachaButton button.gacha-10, section.packList-wrap div.packBox div.gachaButton button.gacha-100 {
  color: #fff;
  text-shadow: 1px 1px 0px #b10000;
  background: -webkit-gradient(linear, left top, left bottom, from(#ff002b), to(#be0000));
  background: linear-gradient(#ff002b 0%, #be0000 100%);
  border: 2px solid #be0000;
  -webkit-box-shadow: 0 0 0 #C78B00;
          box-shadow: 0 0 0 #C78B00;
}
section.packList-wrap div.packBox div.gachaButton button.gacha-10:after, section.packList-wrap div.packBox div.gachaButton button.gacha-100:after {
  background: url(../images/common/button_deco_red01.svg) no-repeat left top, url(../images/common/button_deco_red02.svg) no-repeat right bottom 1px;
}
section.packList-wrap div.packBox div.gachaButton button.gacha-all {
  color: #fff;
  text-shadow: 1px 1px 0px #6f00c7;
  background: -webkit-gradient(linear, left top, left bottom, from(#b400ff), to(#6500be));
  background: linear-gradient(#b400ff 0%, #6500be 100%);
  border: 2px solid #6F00C7;
  -webkit-box-shadow: 0 0 0 #6F00C7;
          box-shadow: 0 0 0 #6F00C7;
}
section.packList-wrap div.packBox div.gachaButton button.gacha-all:after {
  background: url(../images/common/button_deco_purple01.svg) no-repeat left top, url(../images/common/button_deco_purple02.svg) no-repeat right bottom 1px;
}
section.packList-wrap div.packBox div.gachaButton button.gacha-free {
  color: #fff;
  text-shadow: 1px 1px 0px #087d00;
  background: -webkit-gradient(linear, left top, left bottom, from(#4ae200), to(#2ba200));
  background: linear-gradient(#4ae200 0%, #2ba200 100%);
  border: 2px solid #087d00;
  -webkit-box-shadow: 0 0 0 #087d00;
          box-shadow: 0 0 0 #087d00;
}
section.packList-wrap div.packBox div.gachaButton button.gacha-free:after {
  background: url(../images/common/button_deco_green01.svg) no-repeat left top, url(../images/common/button_deco_green02.svg) no-repeat right bottom 1px;
}
section.packList-wrap div.packBox div.gachaButton p.soldOut {
  width: 100%;
  font-size: 90%;
  font-weight: bold;
  color: #c00;
  text-align: center;
  border: solid 2px #eee;
  border-radius: 5px;
  padding: 10px;
}
@media screen and (max-width: 768px) {
  section.packList-wrap div.packBox div.gacha-info {
    height: initial;
    gap: 10px;
    padding: 5px 10px 5px 10px;
  }
  section.packList-wrap div.packBox div.gacha-info p {
    font-size: clamp(14px, 4vw, 18px);
  }
  section.packList-wrap div.packBox div.gacha-info p img {
    width: clamp(20px, 5vw, 25px);
    height: auto;
    margin-right: 2px;
  }
  section.packList-wrap div.packBox div.gacha-info div.remaining-meter {
    gap: 3px;
  }
  section.packList-wrap div.packBox div.gachaButton {
    gap: 5px;
    padding: 0 10px 10px 10px;
  }
  section.packList-wrap div.packBox div.gachaButton button {
    font-size: clamp(12px, 4vw, 15px);
  }
  section.packList-wrap div.packBox div.gachaButton button:after {
    display: none;
    background-size: 15px;
  }
}
section.packList-wrap div.packBox figure {
  overflow: hidden;
}
section.packList-wrap div.packBox figure img {
  width: 100%;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media (hover: hover) and (pointer: fine) {
  section.packList-wrap div.packBox figure img:not(.monochrome):hover {
    -webkit-transform: scale(1.03);
            transform: scale(1.03);
  }
}
section.packList-wrap div.packBox figure img.monochrome {
  -webkit-filter: grayscale(100%) brightness(0.95);
          filter: grayscale(100%) brightness(0.95);
}

a.backButton {
  width: clamp(140px, 50%, 200px);
  font-size: 80%;
  font-weight: bold;
  color: #000;
  white-space: nowrap;
  background: #eee9c9;
  border-radius: 99px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0 auto 15px 0;
  padding: 5px 10px;
}
a.backButton img {
  width: 15px;
  margin-right: 6px;
}

section#gachaPrize_wrap {
  background: #fff;
  margin-bottom: clamp(10px, 3vw, 50px);
  padding: 20px;
}
section#gachaPrize_wrap div.oripa-description {
  border: solid 5px #000;
  border-radius: 5px;
  margin-bottom: clamp(10px, 8vw, 50px);
}
section#gachaPrize_wrap div.oripa-description div {
  font-family: "DotGothic16", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #fff;
  background: #000;
  border: solid 5px #fff;
  border-radius: 5px;
  padding: 20px;
}
section#gachaPrize_wrap dl.gachaList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 20px;
  margin-bottom: clamp(10px, 8vw, 50px);
}
section#gachaPrize_wrap dl.gachaList dt {
  width: 100%;
  text-align: center;
  margin-bottom: clamp(10px, 5vw, 15px);
}
section#gachaPrize_wrap dl.gachaList dt img {
  width: clamp(120px, 40vw, 300px);
}
section#gachaPrize_wrap dl.gachaList dd {
  max-width: 46%;
  position: relative;
}
section#gachaPrize_wrap dl.gachaList dd p {
  position: absolute;
}
section#gachaPrize_wrap dl.gachaList dd p.psa {
  width: 35%;
  line-height: 1;
  top: 2%;
  right: 2%;
}
section#gachaPrize_wrap dl.gachaList dd p.card-count {
  font-family: "DotGothic16", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 20px;
  color: #fff;
  letter-spacing: 3px;
  line-height: 1;
  background: #000;
  border: solid 3px #fff;
  border-radius: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  bottom: 2%;
  right: 2%;
  padding: 5px 12px 8px 14px;
}
section#gachaPrize_wrap dl.gachaList dd p.card-count span {
  padding-bottom: 3px;
}
section#gachaPrize_wrap dl.gachaList dd p.case {
  width: 20%;
  bottom: 2%;
  left: 2%;
}
section#gachaPrize_wrap dl.prize-1st dd {
  width: 46%;
}
section#gachaPrize_wrap dl.prize-2nd dd {
  width: 30%;
}
section#gachaPrize_wrap dl.standard-prize dd {
  width: 22%;
}
section#gachaPrize_wrap dl.prize-other dd {
  width: 30%;
}
section#gachaPrize_wrap section#pack-caution h5 {
  font-size: 100%;
  text-align: center;
  color: #fff;
  background: url(../images/common/tex_wood-mini01.jpg);
  position: relative;
  clip-path: polygon(5% 0%, 95% 0%, 100% 50%, 95% 100%, 5% 100%, 0% 50%);
  margin-bottom: 20px;
  padding: 15px;
}

section#footer_packs_gachaButton {
  background: url(../images/common/bg_mainbg01.jpg);
  position: sticky;
  bottom: 0;
  z-index: 1000;
  padding: 15px;
}
section#footer_packs_gachaButton div.gacha-info {
  height: 35px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 15px;
  padding: 15px;
}
section#footer_packs_gachaButton div.gacha-info p {
  font-size: 18px;
  font-weight: bold;
  letter-spacing: -0.5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 0;
      -ms-flex: 0 1 110px;
          flex: 0 1 110px;
}
section#footer_packs_gachaButton div.gacha-info p img {
  width: 25px;
  height: 25px;
  margin-right: 5px;
}
section#footer_packs_gachaButton div.gacha-info p small {
  font-size: 70%;
  white-space: nowrap;
  padding-top: 5px;
}
section#footer_packs_gachaButton div.gacha-info div.remaining-meter {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-flex: 1;
      -ms-flex: 1 0;
          flex: 1 0;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 5px;
}
section#footer_packs_gachaButton div.gacha-info div.remaining-meter div.rest {
  font-size: clamp(10px, 3vw, 14px);
  font-weight: bold;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
section#footer_packs_gachaButton div.gacha-info div.remaining-meter div.rest img {
  width: 20px;
}
section#footer_packs_gachaButton div.gacha-info div.remaining-meter div.meter {
  height: 8px;
  background: #ddd;
  border-radius: 99px;
  overflow: hidden;
}
section#footer_packs_gachaButton div.gacha-info div.remaining-meter div.meter p.gauge {
  width: 100%;
  height: 100%;
}
section#footer_packs_gachaButton div.gacha-info div.remaining-meter div.meter p.gauge.bg-green {
  background: #75D522;
}
section#footer_packs_gachaButton div.gacha-info div.remaining-meter div.meter p.gauge.bg-orange {
  background: #FF9900;
}
section#footer_packs_gachaButton div.gacha-info div.remaining-meter div.meter p.gauge.bg-red {
  background: #DF0000;
}
section#footer_packs_gachaButton div.gacha-info div.remaining-meter div.meter p.gauge.bg-rainbow {
  background: -webkit-gradient(linear, right top, left top, from(#ffe600), color-stop(51.88%, #00baff), to(#f0a));
  background: linear-gradient(to left, #ffe600 0%, #00baff 51.88%, #f0a 100%);
}
section#footer_packs_gachaButton div.gachaButton {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 10px;
  padding: 0 15px 15px 15px;
}
section#footer_packs_gachaButton div.gachaButton button {
  width: 100%;
  height: 40px;
  font-weight: bold;
  border-radius: 5px;
  cursor: pointer;
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
  position: relative;
  padding: 0 0 1px 0;
}
section#footer_packs_gachaButton div.gachaButton button:before {
  content: "";
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  display: block;
  border: solid 1px #ddd;
  border-radius: 3px;
  mix-blend-mode: overlay;
  position: absolute;
  left: 0;
  top: 0;
}
section#footer_packs_gachaButton div.gachaButton button:after {
  content: "";
  width: calc(100% + 12px);
  height: 46px;
  display: block;
  position: absolute;
  z-index: 1;
  top: -4px;
  left: -6px;
}
@media (hover: hover) and (pointer: fine) {
  section#footer_packs_gachaButton div.gachaButton button:hover {
    opacity: 0.5;
  }
}
section#footer_packs_gachaButton div.gachaButton button.gacha-1 {
  color: #000;
  text-shadow: 1px 1px 0 #ff0;
  background: -webkit-gradient(linear, left top, left bottom, from(#f3d720), to(#f39f20));
  background: linear-gradient(#f3d720 0%, #f39f20 100%);
  border: 2px solid #C78B00;
  -webkit-box-shadow: 0 0 0 #C78B00;
          box-shadow: 0 0 0 #C78B00;
}
section#footer_packs_gachaButton div.gachaButton button.gacha-1:after {
  background: url(../images/common/button_deco_yellow01.svg) no-repeat left top, url(../images/common/button_deco_yellow02.svg) no-repeat right bottom 1px;
}
section#footer_packs_gachaButton div.gachaButton button.gacha-10, section#footer_packs_gachaButton div.gachaButton button.gacha-100 {
  color: #fff;
  text-shadow: 1px 1px 0px #b10000;
  background: -webkit-gradient(linear, left top, left bottom, from(#ff002b), to(#be0000));
  background: linear-gradient(#ff002b 0%, #be0000 100%);
  border: 2px solid #be0000;
  -webkit-box-shadow: 0 0 0 #C78B00;
          box-shadow: 0 0 0 #C78B00;
}
section#footer_packs_gachaButton div.gachaButton button.gacha-10:after, section#footer_packs_gachaButton div.gachaButton button.gacha-100:after {
  background: url(../images/common/button_deco_red01.svg) no-repeat left top, url(../images/common/button_deco_red02.svg) no-repeat right bottom 1px;
}
section#footer_packs_gachaButton div.gachaButton button.gacha-all {
  color: #fff;
  text-shadow: 1px 1px 0px #6f00c7;
  background: -webkit-gradient(linear, left top, left bottom, from(#b400ff), to(#6500be));
  background: linear-gradient(#b400ff 0%, #6500be 100%);
  border: 2px solid #6F00C7;
  -webkit-box-shadow: 0 0 0 #6F00C7;
          box-shadow: 0 0 0 #6F00C7;
}
section#footer_packs_gachaButton div.gachaButton button.gacha-all:after {
  background: url(../images/common/button_deco_purple01.svg) no-repeat left top, url(../images/common/button_deco_purple02.svg) no-repeat right bottom 1px;
}
section#footer_packs_gachaButton div.gachaButton button.gacha-free {
  color: #fff;
  text-shadow: 1px 1px 0px #087d00;
  background: -webkit-gradient(linear, left top, left bottom, from(#4ae200), to(#2ba200));
  background: linear-gradient(#4ae200 0%, #2ba200 100%);
  border: 2px solid #087d00;
  -webkit-box-shadow: 0 0 0 #087d00;
          box-shadow: 0 0 0 #087d00;
}
section#footer_packs_gachaButton div.gachaButton button.gacha-free:after {
  background: url(../images/common/button_deco_green01.svg) no-repeat left top, url(../images/common/button_deco_green02.svg) no-repeat right bottom 1px;
}
section#footer_packs_gachaButton div.gachaButton p.soldOut {
  width: 100%;
  font-size: 90%;
  font-weight: bold;
  color: #c00;
  text-align: center;
  border: solid 2px #eee;
  border-radius: 5px;
  padding: 10px;
}
@media screen and (max-width: 768px) {
  section#footer_packs_gachaButton div.gacha-info {
    height: initial;
    gap: 10px;
    padding: 5px 10px 5px 10px;
  }
  section#footer_packs_gachaButton div.gacha-info p {
    font-size: clamp(14px, 4vw, 18px);
  }
  section#footer_packs_gachaButton div.gacha-info p img {
    width: clamp(20px, 5vw, 25px);
    height: auto;
    margin-right: 2px;
  }
  section#footer_packs_gachaButton div.gacha-info div.remaining-meter {
    gap: 3px;
  }
  section#footer_packs_gachaButton div.gachaButton {
    gap: 5px;
    padding: 0 10px 10px 10px;
  }
  section#footer_packs_gachaButton div.gachaButton button {
    font-size: clamp(12px, 4vw, 15px);
  }
  section#footer_packs_gachaButton div.gachaButton button:after {
    display: none;
    background-size: 15px;
  }
}
section#footer_packs_gachaButton div.inner {
  background: #fff;
  border: solid 3px #C78B00;
  border-radius: 10px;
}

@media (max-width: 1920px) {
  nav#navi_tag div.inner-free {
    margin: auto;
  }
}
@media (max-width: 900px) {
  .pc {
    display: none;
  }
}
@media screen and (max-width: 900px) and (max-width: 768px) {
  .pc-768 {
    display: none;
  }
}
@media screen and (max-width: 900px) and (max-width: 480px) {
  .pc-480 {
    display: none;
  }
}
@media screen and (max-width: 900px) and (max-width: 360px) {
  .pc-360 {
    display: none;
  }
}
@media (max-width: 900px) {
  .sp {
    display: initial;
  }
}
@media screen and (max-width: 900px) and (max-width: 768px) {
  .sp-768 {
    display: initial;
  }
}
@media screen and (max-width: 900px) and (max-width: 680px) {
  .sp-680 {
    display: initial;
  }
}
@media screen and (max-width: 900px) and (max-width: 480px) {
  .sp-480 {
    display: initial;
  }
}
@media screen and (max-width: 900px) and (max-width: 360px) {
  .sp-360 {
    display: initial;
  }
}
@media (max-width: 900px) {
  body {
    background-size: 70%;
  }
  button {
    -webkit-tap-highlight-color: transparent;
  }
  .subTitle {
    margin-bottom: 5vw !important;
    padding: 20px 0;
  }
  .subTitle h3 {
    max-width: calc(100% - 100px);
    height: 65px;
    font-size: 100%;
    background: url(../images/common/subtitle_border-center01.png);
    background-size: 65px 100%;
  }
  .subTitle h3:before {
    content: "";
    width: calc(100% + 75px);
    height: 100%;
    background: url(../images/common/subtitle_border-left01.png) no-repeat left, url(../images/common/subtitle_border-right01.png) no-repeat right;
    background-size: auto 65px;
    left: -38px;
  }
  .inner {
    padding: 15px;
  }
  button#pageTopButton {
    bottom: 140px;
  }
}
@media screen and (max-width: 900px) and (max-width: 480px) {
  button#pageTopButton {
    width: 20vw;
    bottom: 22vw;
    right: 15px;
  }
}
@media (max-width: 900px) {
  header {
    background-size: 70%;
  }
  header div.inner {
    gap: 10px;
    padding: 15px;
  }
  header h1 {
    width: clamp(100px, 42vw, 250px);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-bottom: 2px;
  }
  header h1 a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  header div.head_Wrap {
    gap: 3px;
  }
  header div.head_Wrap.before-login a {
    width: clamp(50px, 22vw, 120px);
    font-size: clamp(70%, 3vw, 90%);
    white-space: nowrap;
  }
  header div.head_Wrap.before-login a span {
    height: clamp(25px, 5vw, 30px);
  }
  header div.head_Wrap.before-login a img {
    display: none;
  }
}
@media screen and (max-width: 900px) and (max-width: 768px) {
  header div.head_Wrap.before-login a {
    padding: 1px;
  }
  header div.head_Wrap.before-login a p {
    padding: 2px;
  }
}
@media (max-width: 900px) {
  header div.head_Wrap.login a#gp {
    font-size: 100%;
  }
  header div.head_Wrap.login a#gp img {
    width: clamp(20px, 7vw, 60px);
  }
  header div.head_Wrap.login a#gp p {
    font-size: clamp(12px, 2vw, 100%);
    padding: 0 2px;
  }
  header div.head_Wrap.login a#coin {
    font-size: 100%;
  }
  header div.head_Wrap.login a#coin img {
    width: clamp(15px, 4vw, 35px);
  }
  header div.head_Wrap.login a#coin img:last-child {
    width: clamp(10px, 3.5vw, 26px);
  }
  header div.head_Wrap.login a#coin p {
    font-size: clamp(12px, 2vw, 100%);
    padding: 0 2px;
  }
  header div.head_Wrap.login a#notice {
    display: none;
  }
}
@media screen and (max-width: 900px) and (max-width: 768px) {
  header div.inner {
    padding: 5px 15px;
  }
}
@media (max-width: 900px) {
  footer div.inner {
    padding: 20px 15px;
  }
  footer nav#fNavi {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 30px;
  }
  footer nav#fNavi dl dt {
    clip-path: polygon(6% 0%, 94% 0%, 100% 50%, 94% 100%, 6% 100%, 0% 50%);
  }
}
@media screen and (max-width: 900px) and (max-width: 680px) {
  footer div#fLogo a {
    width: 60%;
    text-align: center;
  }
  footer div#fLogo small {
    text-align: center;
    line-height: 1.2;
  }
}
@media screen and (max-width: 900px) and (max-width: 480px) {
  section#head-slider {
    padding: 0 0 30px 0;
  }
  section#head-slider div.splide ul.splide__pagination {
    bottom: -1.4em;
  }
  section#head-slider div.splide ul.splide__pagination button.splide__pagination__page {
    width: 6px;
    height: 6px;
  }
}
@media (max-width: 900px) {
  nav#category-tab div.inner {
    gap: 5px;
    padding-top: 10px;
    padding-bottom: 0;
  }
}
@media screen and (max-width: 900px) and (max-width: 680px) {
  nav#category-tab a {
    font-size: clamp(10px, 2.5vw, 14px) !important;
    line-height: 1.2;
    text-align: center;
    clip-path: polygon(12px -5px, calc(100% - 10px) -5px, 100% 5px, 100% 100%, 0 100%, 0 5px);
  }
  nav#category-tab a span {
    clip-path: polygon(15px -5px, calc(100% - 10px) -2px, 100% 8px, 100% 100%, 0 100%, 0 8px);
    padding: 8px 0 5px 0 !important;
  }
  nav#category-tab a span:before, nav#category-tab a span:after {
    width: 15px;
    height: 15px;
  }
  nav#category-tab a span:before {
    top: 2px;
    left: 2px;
  }
  nav#category-tab a span:after {
    top: 2px;
    right: 2px;
  }
}
@media (max-width: 900px) {
  div.recommend_menu a {
    font-size: 80%;
  }
  div.recommend_menu a:before {
    width: 15px !important;
  }
  nav#navi_tag div.recommend-order_wrap {
    max-width: calc(100% - 100px) !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding-left: 100px !important;
  }
  nav#navi_tag button {
    font-size: 60%;
    padding: 5px 10px 5px 10px !important;
  }
  nav#navi_tag button.recommend-order {
    width: 90px !important;
  }
  nav#navi_tag div.tag_menu {
    overflow-x: scroll;
  }
  nav#navi_tag div.tag_menu::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: #C78B00;
  }
  nav#navi_tag div.tag_menu::-webkit-scrollbar-track {
    background: none;
  }
  nav#navi_tag div.tag_menu div.tab_menu_inner {
    gap: 0.3em !important;
  }
  nav#navi_tag div.tag_menu div.tab_menu_inner button {
    padding: 3px 6px !important;
  }
}
@media screen and (max-width: 900px) and (max-width: 768px) {
  nav#navi_tag {
    margin-bottom: 0;
  }
}
@media (max-width: 900px) {
  section#guild-information div.subTitle {
    overflow: hidden;
  }
}
@media screen and (max-width: 900px) and (max-width: 768px) {
  section#guild-information div.guild-info_wrap {
    margin: 0 15px 20px 15px;
    padding: 20px 20px 0 20px;
  }
  section#guild-information div.guild-info_wrap:before {
    background-size: 30px;
  }
  section#guild-information div.guild-info_wrap article a {
    line-height: 1.2;
  }
  section#guild-information div.guild-info_wrap article a time {
    font-size: 70%;
  }
  section#guild-information div.guild-info_wrap article a h4 {
    font-size: 90%;
  }
  section#guild-information div.guild-info_wrap div.btn-wrap {
    padding: clamp(20px, 7vw, 40px) 0;
  }
}
@media (max-width: 900px) {
  nav#sticky-bottom div.inner {
    -ms-flex-pack: distribute;
        justify-content: space-around;
    gap: initial;
    padding: 0;
  }
  nav#sticky-bottom div.inner a {
    font-size: 50%;
  }
  nav#sticky-bottom div.inner a img {
    height: 15px;
  }
}
@media screen and (max-width: 900px) and (max-width: 480px) {
  nav#sticky-bottom {
    padding: 10px 0 6px 0;
  }
  nav#sticky-bottom a {
    gap: 2px !important;
  }
}
@media (max-width: 900px) {
  section#limited-collection h2 {
    width: 100%;
    height: auto;
    font-size: clamp(12px, 4vw, 30px);
    line-height: 1.2;
    background: url(../images/limited-text_frame_sp01.png) no-repeat;
    background-size: cover;
    aspect-ratio: 841/164;
    display: -webkit-box;
  }
  section#limited-collection div.packBox {
    max-width: calc(50% - 10px);
  }
}
@media screen and (max-width: 900px) and (max-width: 768px) {
  section#limited-collection {
    margin-bottom: 5px;
  }
  section#limited-collection div.inner {
    border-radius: 0;
    padding: 15px 15px 20px 15px;
  }
  section#limited-collection h2 {
    margin-bottom: 15px;
  }
  section#limited-collection div.packBox {
    max-width: 100%;
    /*
    //gacha-info
    div.gacha-info{
      gap: 10px;
      padding:10px;
    }
    // /gacha-info
    //gachaButton
    div.gachaButton{
      gap:5px;
      padding: 0 10px 10px 10px;
      button{
        &:after{
          display: none;
          background-size:15px;
        }
      }
    }
    // /gachaButton
    */
  }
}
@media (max-width: 900px) {
  section#regular-collection div.packBox {
    max-width: calc(50% - 10px);
  }
}
@media screen and (max-width: 900px) and (max-width: 768px) {
  section#regular-collection div.packBox {
    max-width: 100%;
  }
  section#regular-collection div.packBox div.gacha-info {
    gap: 10px;
    padding: 10px;
  }
  section#regular-collection div.packBox div.gachaButton {
    gap: 5px;
    padding: 0 10px 10px 10px;
  }
  section#regular-collection div.packBox div.gachaButton button:after {
    display: none;
    background-size: 15px;
  }
}
@media (max-width: 900px) {
  main.subpage > div.inner {
    padding-top: 0;
  }
  a.backButton {
    width: clamp(100px, 20vw, 200px);
    font-size: clamp(8px, 2vw, 14px);
    font-weight: bold;
    margin-bottom: 10px;
    padding: 5px 10px;
  }
  a.backButton img {
    width: 5%;
    margin-right: 6px;
  }
  section#gachaPrize_wrap div.oripa-description {
    border: solid 3px #000;
    border-radius: 3px;
  }
  section#gachaPrize_wrap div.oripa-description div {
    font-size: clamp(14px, 3vw, 16px);
    border: solid 3px #fff;
    border-radius: 5px;
    padding: 10px;
  }
  section#gachaPrize_wrap dl.gachaList {
    gap: 5px;
  }
  section#gachaPrize_wrap dl.gachaList dd p.card-count {
    font-size: clamp(12px, 4vw, 20px);
  }
}
@media screen and (max-width: 900px) and (max-width: 768px) {
  section#gachaPrize_wrap dl.gachaList dd p.psa {
    width: 30%;
    top: 2%;
    right: 2%;
  }
  section#gachaPrize_wrap dl.gachaList dd p.card-count {
    border: solid 2px #fff;
    padding: 5px 7px 6px 10px;
  }
  section#gachaPrize_wrap dl.prize-2nd dd p.psa {
    width: 40%;
    top: 5px;
    right: 5px;
  }
  section#gachaPrize_wrap dl.standard-prize dd p.psa {
    width: 35%;
    top: 5px;
    right: 5px;
  }
}
@media screen and (max-width: 900px) and (max-width: 480px) {
  section#gachaPrize_wrap dl.prize-2nd dd p.psa {
    top: 2px;
    right: 2px;
  }
  section#gachaPrize_wrap dl.standard-prize dd p.psa {
    top: 2px;
    right: 2px;
  }
}
@media (max-width: 900px) {
  section#footer_packs_gachaButton {
    padding: 0;
  }
  section#footer_packs_gachaButton div.inner {
    padding: 0;
  }
}
@media screen and (max-width: 900px) and (max-width: 768px) {
  section#footer_packs_gachaButton div.gacha-info p {
    font-size: clamp(14px, 4vw, 18px);
  }
  section#footer_packs_gachaButton div.gacha-info p img {
    width: clamp(20px, 5vw, 25px);
    height: auto;
  }
  section#footer_packs_gachaButton div.gacha-info div.remaining-meter div.rest img {
    width: clamp(10px, 5vw, 20px);
  }
}