@charset "UTF-8";
/* ======================================================================
 reset
====================================================================== */
/*
  Josh's Custom CSS Reset
  https://www.joshwcomeau.com/css/custom-css-reset/
*/
*, *::before, *::after {
  box-sizing: border-box;
}

* {
  margin: 0;
}

html {
  overflow-y: scroll;
}

body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}

input, button, textarea, select {
  font: inherit;
}

p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
}

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

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, 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,
input, select, textarea {
  box-sizing: border-box;
}

html {
  /* Sets a specific default `font-size` for user with `rem` type scales.*/
  font-size: 62.5%;
  /* Changes the default tap highlight to be completely transparent in iOS.*/
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body {
  color: #333333;
  line-height: 1.6;
  background: #fff;
  font-family: "Noto Sans JP", 游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Avenir, "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, sans-serif;
  font-weight: 400;
  word-wrap: break-word;
  word-break: break-all;
  min-width: 1240px;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  body {
    min-width: inherit;
  }
}

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

strong {
  font-weight: bold;
}

a:link {
  color: #333333;
  text-decoration: none;
  cursor: pointer;
}
a:visited {
  color: #333333;
  text-decoration: none;
}
a:hover {
  color: #333333;
  text-decoration: none;
}
a:active {
  color: #333333;
  text-decoration: none;
}

a[href^=tel] {
  color: #333333;
}

:focus-ring {
  outline: none;
}

/* input */
input, textarea, select {
  display: block;
  margin: 0;
  padding: 0;
  outline: none;
  border: none;
  border-image: none;
  background: transparent;
  font-family: inherit;
  border-radius: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
input::-ms-expand, textarea::-ms-expand, select::-ms-expand {
  display: none;
}

textarea {
  resize: vertical;
}

input:placeholder-shown, textarea:placeholder-shown {
  color: #333333;
}
input::placeholder, textarea::placeholder {
  color: #333333;
}
input:focus:placeholder-shown, textarea:focus:placeholder-shown {
  color: #333333;
}
input:focus::placeholder, textarea:focus::placeholder {
  color: #333333;
}

/* ======================================================================
 layout
====================================================================== */
/* =================================
 l-footer
================================= */
.l-footer {
  background-image: url(../img/common/footer_img.png), linear-gradient(to bottom, #fff 85px, #000 85px);
  background-position: center top, center top;
  background-size: auto, auto;
  background-repeat: no-repeat, no-repeat;
  position: relative;
}
@media screen and (max-width: 768px) {
  .l-footer {
    background-image: url(../img/common/sp/footer_img.png), linear-gradient(to bottom, #fff calc(120 /750*100vw), #000 calc(120 /750*100vw));
    background-position: center top, center top;
    background-size: 100%, auto;
    background-repeat: no-repeat, no-repeat;
  }
}
.l-footer:after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
  background-image: url(../img/common/footer_img_on.png), url(../img/common/sp/footer_img_on.png);
  z-index: -1;
}
.l-footer__push {
  width: 172px;
  height: 102px;
  margin-bottom: -102px;
  margin-inline: auto;
  display: block;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .l-footer__push {
    width: calc(226 /750*100vw);
    height: calc(135 /750*100vw);
    margin-bottom: calc(-135 /750*100vw);
  }
}
.l-footer__push:hover + .l-footer {
  background-image: url(../img/common/footer_img_on.png), linear-gradient(to bottom, #fff 85px, #000 85px);
  background-position: center top, center top;
  background-size: auto, auto;
  background-repeat: no-repeat, no-repeat;
}
@media screen and (max-width: 768px) {
  .l-footer__push:hover + .l-footer {
    background-image: url(../img/common/sp/footer_img_on.png), linear-gradient(to bottom, #fff calc(120 /750*100vw), #000 calc(120 /750*100vw));
    background-position: center top, center top;
    background-size: 100%, auto;
    background-repeat: no-repeat, no-repeat;
  }
}
.l-footer__top {
  padding-block: 247px 28px;
}
@media screen and (max-width: 768px) {
  .l-footer__top {
    padding-block: calc(350 /750*100vw) calc(70 /750*100vw);
  }
}
.l-footer__nav {
  display: flex;
  justify-content: center;
  margin-bottom: 24px;
}
@media screen and (max-width: 768px) {
  .l-footer__nav {
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: calc(66 /750*100vw);
  }
}
.l-footer__nav a {
  font-size: 1.6rem;
  padding: 0 12px;
  display: block;
  transition: color 0.2s;
}
.l-footer__nav a:link, .l-footer__nav a:active, .l-footer__nav a:visited {
  color: #fff;
  text-decoration: none;
  cursor: pointer;
}
.l-footer__nav a:hover {
  color: #007aff;
}
@media screen and (max-width: 768px) {
  .l-footer__nav a {
    font-size: calc(26 /750*100vw);
    padding: calc(22 /750*100vw) 0;
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .l-footer__nav li {
    border-top: 1px solid rgba(255, 255, 255, 0.25);
    width: calc(330 /750*100vw);
    text-align: center;
  }
  .l-footer__nav li:last-of-type, .l-footer__nav li:nth-last-of-type(2) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.25);
  }
}
.l-footer__nav li + li {
  content: "";
  border-left: 1px solid rgba(255, 255, 255, 0.25);
}
@media screen and (max-width: 768px) {
  .l-footer__nav li + li {
    border-left: none;
  }
}
.l-footer__sankyo {
  display: flex;
  justify-content: center;
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  .l-footer__sankyo {
    margin-bottom: calc(26 /750*100vw);
    margin-inline: auto;
    width: calc(265 /750*100vw);
  }
}
.l-footer__sankyo a {
  transition: opacity 0.2s;
}
.l-footer__sankyo a:hover {
  opacity: 0.8;
}
.l-footer__bottom {
  background: rgba(255, 255, 255, 0.07);
  padding-block: 16px;
}
@media screen and (max-width: 768px) {
  .l-footer__bottom {
    padding-block: calc(24 /750*100vw) calc(158 /750*100vw);
  }
}
.l-footer__copy {
  font-size: 1.1rem;
  text-align: center;
  color: #777777;
}
@media screen and (max-width: 768px) {
  .l-footer__copy {
    font-size: calc(18 /750*100vw);
  }
}

/* ======================================================================
 layout
====================================================================== */
/* =================================
 l-content__size
================================= */
.l-content__size-sp-1 {
  padding: 0 4%;
}
@media screen and (min-width: 1025px) {
  .l-content__size-sp-1 {
    max-width: 1240px;
    margin: 0 auto;
  }
}

.l-content__size-pc-1 {
  width: 1240px;
  margin: 0 auto;
  padding-inline: 20px;
}
@media screen and (max-width: 768px) {
  .l-content__size-pc-1 {
    width: auto;
    padding-inline: calc(30 /750*100vw);
  }
}

/* =================================
 l-header
================================= */
.l-header {
  z-index: 998;
  position: relative;
}
.l-header__top {
  background: #007aff;
  position: relative;
}
.l-header__logo a, .l-header__sankyo a {
  transition: opacity 0.2s;
}
.l-header__logo a:hover, .l-header__sankyo a:hover {
  opacity: 0.8;
}
.l-header__logo {
  display: flex;
  justify-content: center;
  padding-block: 14px 18px;
}
@media screen and (max-width: 768px) {
  .l-header__logo {
    margin-inline: auto;
    width: calc(414 /750*100vw);
    padding-block: calc(18 /750*100vw) calc(28 /750*100vw);
  }
}
.l-header__sankyo {
  position: absolute;
  right: 32px;
  bottom: 17px;
}
@media screen and (max-width: 768px) {
  .l-header__sankyo {
    display: none;
  }
}
.l-header__sankyo a {
  transition: opacity 0.2s;
}
.l-header__sankyo a:hover {
  opacity: 0.8;
}
.l-header__toggle {
  display: none;
  cursor: pointer;
  position: absolute;
  top: calc(50 /750*100vw);
  right: calc(40 /750*100vw);
}
@media screen and (max-width: 768px) {
  .l-header__toggle {
    display: block;
  }
}
.l-header__toggle-inner {
  position: relative;
}
.l-header__toggle-ttl {
  font-size: calc(20 /750*100vw);
  font-weight: 700;
  color: #fff;
  text-align: center;
  padding-top: calc(45 /750*100vw);
  line-height: 1;
}
.l-header__toggle span {
  width: calc(44 /750*100vw);
  height: 2px;
  background: #fff;
  display: block;
  position: absolute;
  left: 5px;
  transition: transform 0.6s ease-in-out, top 0.5s ease;
}
.l-header__toggle span:nth-of-type(1) {
  top: 0px;
}
.l-header__toggle span:nth-of-type(2) {
  top: calc(12 /750*100vw);
}
.l-header__toggle span:nth-of-type(3) {
  top: calc(24 /750*100vw);
}
@media screen and (max-width: 768px) {
  .l-header__bottom {
    display: none;
  }
}
.l-header__nav {
  display: flex;
  justify-content: center;
  gap: 50px;
  position: relative;
  padding-block: 10px;
  background: #fff;
}
.l-header__nav a {
  font-size: 1.6rem;
  font-weight: 700;
  display: block;
  transition: color 0.2s;
}
.l-header__nav a:link, .l-header__nav a:active, .l-header__nav a:visited {
  color: #007aff;
  text-decoration: none;
  cursor: pointer;
}
.l-header__nav a:hover {
  color: #026ee2;
}
.l-header__nav-link {
  position: relative;
}
.l-header__nav-main .l-header__nav-link:after {
  content: "\f107";
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  color: rgba(0, 122, 255, 0.4);
  margin-left: 10px;
}
.l-header__nav-main i {
  background: rgba(0, 122, 255, 0.2);
  padding: 8px;
  border-radius: 50%;
  width: 32px;
  height: 32px;
}
.l-header__nav-main .l-header__nav-link:has(i):after {
  content: none;
}
.l-header__nav-menu {
  display: none;
  position: absolute;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0px 0px 20px 0px rgba(10, 2, 4, 0.2);
  width: 100%;
  max-width: 1200px;
  top: calc(100% + 5px);
  left: calc(50% - 600px);
  padding: 30px;
}
.l-header__nav-menu::after {
  content: "";
  position: absolute;
  top: -24px;
  /* left は JSでクリック位置に動的に設定 */
  left: var(--arrow-left, 50px);
  border-width: 12px;
  border-style: solid;
  border-color: transparent transparent #fff transparent;
}
.l-header__nav-menu.active {
  display: block;
}
.l-header__nav-menu-inner {
  position: relative;
}
.l-header__nav-menu-close {
  padding: 0;
  width: 28px;
  height: 28px;
  position: absolute;
  top: -44px;
  right: -44px;
  cursor: pointer;
}
.l-header__nav-menu-close i {
  background: #777;
  border: 2px solid #fff;
  border-radius: 50%;
  color: #fff;
  font-size: 1.2rem;
  padding: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.l-header__nav-menu-ttl {
  background: #aaaaaa;
  color: #fff;
  padding: 4px 12px;
  font-size: 1.6rem;
  font-weight: 700;
  margin-bottom: 7px;
}
.l-header__nav-menu-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0 20px;
}
.l-header__nav-menu-list li {
  width: calc((100% - 60px) / 4);
  border-bottom: 1px solid #cccccc;
}
.l-header__nav-menu-list a {
  font-size: 1.4rem;
  font-weight: 400;
  color: #333333;
  padding: 9px 7px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color 0.2s;
}
.l-header__nav-menu-list a:link, .l-header__nav-menu-list a:active, .l-header__nav-menu-list a:visited {
  color: #333333;
  text-decoration: none;
  cursor: pointer;
}
.l-header__nav-menu-list a:hover {
  color: #007aff;
}
.l-header__nav-menu-list + .l-header__nav-menu-ttl {
  margin-top: 20px;
}
.l-header__nav-menu-ttl2 {
  font-size: 1.6rem;
  font-weight: 700;
  text-align: center;
  margin-bottom: 15px;
}
.l-header__nav-menu-tags {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 20px;
}
.l-header__nav-menu-tags a {
  font-size: 1.4rem;
  font-weight: 400;
  color: #333333;
  padding: 5px 16px;
  background: #d9ebff;
  border-radius: 16.5px;
  transition: color 0.2s;
}
.l-header__nav-menu-tags a:link, .l-header__nav-menu-tags a:active, .l-header__nav-menu-tags a:visited {
  color: #333333;
  text-decoration: none;
  cursor: pointer;
}
.l-header__nav-menu-tags a:hover {
  color: #007aff;
}
.l-header__nav .c-search__open {
  display: flex;
  align-items: center;
  overflow: hidden;
  border: 2px solid #aaaaaa;
  border-radius: 30px;
  width: 800px;
  margin-inline: auto;
}
.l-header__nav .c-search__open label {
  width: calc(100% - 32px);
}
.l-header__nav .c-search__open input {
  width: 100%;
  height: 45px;
  padding: 5px 15px;
  border: none;
  box-sizing: border-box;
  font-size: 1.8rem;
  outline: none;
}
.l-header__nav .c-search__open input::placeholder {
  color: #aaaaaa;
}
.l-header__nav .c-search__open button {
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  background-color: transparent;
  cursor: pointer;
  padding: 0;
}
.l-header__nav .c-search__open button::after {
  content: "\f002";
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  font-size: 2rem;
  color: #007aff;
}
.l-header__chara {
  position: absolute;
  bottom: 0;
  left: 20px;
}
@media screen and (max-width: 768px) {
  .l-header__chara {
    display: none;
  }
}

/* =================================
 l-header__sp
================================= */
.l-header__sp {
  z-index: 998;
  display: none;
}

/* =================================
 l-menu
================================= */
.l-menu {
  z-index: 999;
  position: fixed;
  top: 0;
  right: 0;
  background: #007aff;
  width: calc(700 /750*100vw);
  height: 100vh;
  height: 100dvh;
  padding-block: calc(160 /750*100vw) calc(30 /750*100vw);
  overflow: auto;
  opacity: 0;
  transition: transform 0.4s;
  transform: translate(calc(700 /750*100vw), 0);
}
.l-menu.active {
  opacity: 1;
  transform: translate(0, 0);
}
.l-menu.active .l-header__toggle span:nth-of-type(1) {
  top: calc(12 /750*100vw);
  transform: rotate(45deg);
}
.l-menu.active .l-header__toggle span:nth-of-type(2) {
  top: calc(12 /750*100vw);
  width: 0;
  left: 50%;
}
.l-menu.active .l-header__toggle span:nth-of-type(3) {
  top: calc(12 /750*100vw);
  transform: rotate(-45deg);
}
.l-menu__nav {
  margin-inline: calc(30 /750*100vw);
  background: #fff;
  border-radius: calc(15 /750*100vw);
}
.l-menu__nav li {
  font-size: calc(30 /750*100vw);
  font-weight: 700;
  margin-inline: calc(30 /750*100vw);
}
.l-menu__nav li:not(:last-of-type) {
  border-bottom: 1px solid #ccc;
}
.l-menu__nav a {
  padding: calc(30 /750*100vw) calc(17 /750*100vw);
  display: block;
  position: relative;
}
.l-menu__nav a:before {
  position: absolute;
  top: calc(50% - (15 /750*100vw));
  right: calc(14 /750*100vw);
  content: "\f105";
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  font-size: calc(30 /750*100vw);
  line-height: 1;
  color: #007aff;
}
.l-menu__nav-main {
  padding: calc(30 /750*100vw) calc(17 /750*100vw);
  display: block;
  position: relative;
}
.l-menu__nav-main:before {
  position: absolute;
  top: calc(50% - (15 /750*100vw));
  right: calc(14 /750*100vw);
  content: "+";
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  font-size: calc(30 /750*100vw);
  line-height: 1;
  color: #007aff;
}
.l-menu__nav-main.active:before {
  content: "\f068";
}
.l-menu__nav-sub {
  border-top: 1px solid #ccc;
}
.l-menu__nav-sub li {
  font-size: calc(26 /750*100vw);
  font-weight: 400;
  margin-inline: 0;
}
.l-menu__nav-sub a {
  padding: calc(24 /750*100vw) calc(15 /750*100vw) calc(24 /750*100vw) calc(50 /750*100vw);
}
.l-menu__nav-sub a:before {
  display: none;
}
.l-menu__overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 998;
}
.l-menu__overlay.active {
  display: block;
}
.l-menu__box {
  margin-inline: calc(30 /750*100vw);
  margin-top: calc(30 /750*100vw);
  padding: calc(50 /750*100vw) calc(30 /750*100vw);
  background: #fff;
  border-radius: calc(15 /750*100vw);
}
.l-menu__box:has(.l-menu__box-bnr) {
  padding: calc(40 /750*100vw);
}
.l-menu__box-ttl {
  font-size: calc(30 /750*100vw);
  margin-bottom: calc(30 /750*100vw);
  text-align: center;
}
.l-menu__box .c-search__open {
  display: flex;
  border: 2px solid #aaaaaa;
  box-shadow: none;
  height: calc(90 /750*100vw);
}
.l-menu__tags {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: calc(20 /750*100vw);
  margin-bottom: calc(40 /750*100vw);
}
.l-menu__tags a {
  font-size: calc(24 /750*100vw);
  font-weight: 400;
  color: #333333;
  padding: calc(6 /750*100vw) calc(26 /750*100vw);
  background: #d9ebff;
  border-radius: calc(25 /750*100vw);
  display: block;
}

/* ======================================================================
 layout
====================================================================== */
/* =================================
 l-loader
================================= */
.l-loader {
  z-index: 1000;
}

/* =================================
 l-breadcrumbs
================================= */
/* =================================
 l-main_visual
================================= */
/* =================================
 l-main
================================= */
/* ======================================================================
 layout
====================================================================== */
/* =================================
 l-side
================================= */
.l-side {
  z-index: 996;
}

.c-bg__border {
  background: #fff;
  position: relative;
  padding-bottom: 80px;
}
@media screen and (max-width: 768px) {
  .c-bg__border {
    padding-bottom: calc(100 /750*100vw);
  }
}
.c-bg__border:before {
  content: "";
  width: 100%;
  height: 5px;
  background: #007aff;
  position: absolute;
  top: 5px;
  left: 0;
}
@media screen and (max-width: 768px) {
  .c-bg__border:before {
    height: calc(8 /750*100vw);
    top: calc(8 /750*100vw);
  }
}

.c-ttl {
  text-align: center;
  padding-block: 70px 60px;
}
@media screen and (max-width: 768px) {
  .c-ttl {
    padding-block: calc(90 /750*100vw) calc(80 /750*100vw);
  }
}
.c-ttl__en {
  font-size: 5.6rem;
  font-weight: 900;
  color: #007aff;
  line-height: 1;
}
@media screen and (max-width: 768px) {
  .c-ttl__en {
    font-size: calc(64 /750*100vw);
  }
}
.c-ttl__ja {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1;
  margin-top: 12px;
}
@media screen and (max-width: 768px) {
  .c-ttl__ja {
    font-size: calc(28 /750*100vw);
    margin-top: calc(16 /750*100vw);
  }
}

.c-goods__item {
  padding: 10px;
  border-right: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  background: #fff;
  position: relative;
}
@media screen and (max-width: 768px) {
  .c-goods__item {
    padding: calc(20 /750*100vw);
  }
}
.c-goods__item-img {
  margin-bottom: 14px;
  transition: opacity 0.2s;
}
@media screen and (max-width: 768px) {
  .c-goods__item-img {
    margin-bottom: calc(30 /750*100vw);
  }
}
.c-goods__item-img img {
  aspect-ratio: 1/1;
  object-fit: contain;
}
.c-goods__item-img-wrap {
  position: relative;
}
.c-goods__item-img.end figcaption {
  font-size: 1.8rem;
  font-weight: 700;
  color: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  .c-goods__item-img.end figcaption {
    font-size: calc(28 /750*100vw);
  }
}
.c-goods__item-img.end:before {
  content: "";
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
  top: 0;
  left: 0;
}
.c-goods__item-tags {
  position: absolute;
  top: -7px;
  left: -7px;
  display: flex;
  gap: 3px;
  margin: 0;
}
@media screen and (max-width: 768px) {
  .c-goods__item-tags {
    top: calc(-14 /750*100vw);
    left: calc(-14 /750*100vw);
    gap: calc(6 /750*100vw);
  }
}
.c-goods__item-tags li {
  font-size: 1.2rem;
  padding: 0 7px;
  background: #ff0000;
  color: #fff;
}
@media screen and (max-width: 768px) {
  .c-goods__item-tags li {
    font-size: calc(22 /750*100vw);
    padding: 0 calc(10 /750*100vw);
  }
}
.c-goods__item-tags li.blue {
  background: #007aff;
}
.c-goods__item-name {
  font-size: 1.4rem;
  margin-bottom: 14px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  height: 45px;
  transition: color 0.2s;
}
@media screen and (max-width: 768px) {
  .c-goods__item-name {
    font-size: calc(26 /750*100vw);
    margin-bottom: calc(24 /750*100vw);
    -webkit-line-clamp: 3;
    height: calc(125 /750*100vw);
  }
}
.c-goods__item-price .num {
  font-size: 2rem;
  font-weight: 700;
  font-family: "Roboto", sans-serif;
  color: #0057b6;
}
@media screen and (max-width: 768px) {
  .c-goods__item-price .num {
    font-size: calc(36 /750*100vw);
  }
}
.c-goods__item-price .num.pricedown {
  color: #ff0000;
}
.c-goods__item-price small {
  font-size: 1.1rem;
  color: #aaaaaa;
  margin-left: 5px;
}
@media screen and (max-width: 768px) {
  .c-goods__item-price small {
    font-size: calc(20 /750*100vw);
    margin-left: calc(11 /750*100vw);
  }
}
.c-goods__item-price .original {
  font-size: 1.4rem;
  font-weight: 700;
  font-family: "Roboto", sans-serif;
  color: #999999;
  margin-left: 7px;
}
@media screen and (max-width: 768px) {
  .c-goods__item-price .original {
    font-size: calc(26 /750*100vw);
    margin-left: calc(15 /750*100vw);
  }
}
.c-goods__item-rank {
  position: absolute;
  top: -7px;
  left: -7px;
  width: 30px;
  height: 30px;
  background: #007aff;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 2rem;
  font-weight: 700;
  font-family: "Roboto", sans-serif;
}
@media screen and (max-width: 768px) {
  .c-goods__item-rank {
    top: calc(-14 /750*100vw);
    left: calc(-14 /750*100vw);
    width: calc(50 /750*100vw);
    height: calc(50 /750*100vw);
    font-size: calc(33 /750*100vw);
  }
}
.c-goods__item-rank.first {
  background: #d3b824;
}
.c-goods__item-rank.second {
  background: #afafaf;
}
.c-goods__item-rank.third {
  background: #dc9125;
}
.c-goods__item a:hover .c-goods__item-img {
  opacity: 0.8;
}
.c-goods__item a:hover .c-goods__item-name {
  color: #007aff;
}

.c-icon__favorite {
  background: #c2c2c2;
  border-radius: 50%;
  padding: 7px;
  font-size: 1.4rem;
  color: #fff;
}
@media screen and (max-width: 768px) {
  .c-icon__favorite {
    padding: calc(14 /750*100vw);
    font-size: calc(26 /750*100vw);
  }
}
.c-icon__favorite.fill {
  font-variation-settings: "FILL" 1;
  color: #ffb9b9;
  background: #ff3030;
}
.c-icon__favorite-wrap {
  position: absolute;
  top: 5px;
  right: 5px;
  border: none;
  background: transparent;
  padding: 0;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  .c-icon__favorite-wrap {
    top: calc(6 /750*100vw);
    right: calc(6 /750*100vw);
  }
}

.c-types {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .c-types {
    gap: calc(18 /750*100vw);
    gap: calc(18 /750*100vw) 2.6086956522%;
  }
}
.c-types__item {
  background: #fff;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-radius: 10px;
  width: 292px;
}
@media screen and (max-width: 768px) {
  .c-types__item {
    border-radius: calc(15 /750*100vw);
    width: calc(218 /750*100vw);
    width: 31.5942028986%;
  }
}
.c-types__item-img {
  width: 60px;
  height: 60px;
  object-fit: contain;
  transition: opacity 0.2s;
}
@media screen and (max-width: 768px) {
  .c-types__item-img {
    width: calc(150 /750*100vw);
    height: calc(150 /750*100vw);
    margin-inline: auto;
    margin-bottom: calc(16 /750*100vw);
  }
}
.c-types__item-name {
  width: calc(100% - 70px);
  font-size: 1.5rem;
  font-weight: 700;
  transition: color 0.2s;
}
@media screen and (max-width: 768px) {
  .c-types__item-name {
    width: 100%;
    font-size: calc(26 /750*100vw);
    text-align: center;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    height: calc(83 /750*100vw);
  }
}
.c-types__item a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
}
@media screen and (max-width: 768px) {
  .c-types__item a {
    display: block;
    padding: calc(20 /750*100vw);
  }
}
.c-types__item a:hover .c-types__item-img {
  opacity: 0.8;
}
.c-types__item a:hover .c-types__item-name {
  color: #007aff;
}

.c-more a {
  background: #007aff;
  color: #fff;
  font-size: 1.6rem;
  font-weight: 700;
  border-radius: 22.5px;
  width: 150px;
  height: 45px;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: background 0.2s;
}
@media screen and (max-width: 768px) {
  .c-more a {
    font-size: calc(30 /750*100vw);
    width: calc(430 /750*100vw);
    height: calc(80 /750*100vw);
    margin-inline: auto;
  }
}
.c-more a:after {
  content: "\f105";
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  margin-left: 9px;
}
@media screen and (max-width: 768px) {
  .c-more a:after {
    margin-left: calc(19 /750*100vw);
  }
}
.c-more a:hover {
  background: #026ee2;
}

/* トップに戻るボタン */
.c-toTop {
  box-shadow: 0px 3px 4px 0px rgba(10, 2, 4, 0.14);
  background: #007aff;
  border-radius: 50%;
  color: #fff;
  border: 2px solid #fff;
  font-size: 1.6rem;
  font-weight: 700;
  width: 64px;
  height: 64px;
  outline: 0;
  position: fixed;
  bottom: 35px;
  right: 30px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  opacity: 0;
  cursor: pointer;
  pointer-events: none;
}
@media screen and (max-width: 768px) {
  .c-toTop {
    font-size: 1.3rem;
    width: 50px;
    height: 50px;
    bottom: 15px;
    right: 15px;
  }
}
.c-toTop i {
  font-size: 1.4rem;
}
.c-toTop.fade-in {
  opacity: 1;
  transition: opacity 1s, background 0.2s;
  pointer-events: inherit;
}
.c-toTop:hover {
  color: #fff;
  background: #026ee2;
}

.c-search {
  position: fixed;
  bottom: 35px;
  right: 104px;
  opacity: 0;
  pointer-events: none;
}
@media screen and (max-width: 768px) {
  .c-search {
    bottom: 15px;
    right: 75px;
  }
}
.c-search.fade-in {
  opacity: 1;
  transition: opacity 1s;
  pointer-events: inherit;
}
.c-search__fixed i {
  box-shadow: 0px 3px 4px 0px rgba(10, 2, 4, 0.14);
  background: #007aff;
  border-radius: 50%;
  color: #fff;
  border: 2px solid #fff;
  font-size: 1.9rem;
  width: 64px;
  height: 64px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transition: background 0.2s;
}
@media screen and (max-width: 768px) {
  .c-search__fixed i {
    font-size: 1.5rem;
    width: 50px;
    height: 50px;
  }
}
.c-search__fixed i:hover {
  background: #026ee2;
}
.c-search__fixed.hidden {
  display: none;
}
.c-search__open {
  display: none;
  align-items: center;
  overflow: hidden;
  background: #fff;
  border: 3px solid #007aff;
  border-radius: 32px;
  box-shadow: 0px 3px 4px 0px rgba(10, 2, 4, 0.14);
  width: 270px;
  margin-inline: auto;
}
@media screen and (max-width: 768px) {
  .c-search__open {
    border: 2px solid #007aff;
    width: calc(540 /750*100vw);
  }
}
.c-search__open.active {
  display: flex;
}
.c-search__open label {
  width: calc(100% - 32px);
}
@media screen and (max-width: 768px) {
  .c-search__open label {
    width: calc(100% - (70 /750*100vw));
  }
}
.c-search__open input {
  height: 60px;
  padding: 5px 15px;
  border: none;
  box-sizing: border-box;
  font-size: 1.6rem;
  outline: none;
}
@media screen and (max-width: 768px) {
  .c-search__open input {
    height: calc(100 /750*100vw);
    padding: calc(25 /750*100vw) calc(30 /750*100vw);
  }
}
.c-search__open input::placeholder {
  color: #aaaaaa;
}
.c-search__open button {
  border: none;
  background-color: transparent;
  cursor: pointer;
  padding: 0;
}
.c-search__open button::after {
  content: "\f002";
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  font-size: 2rem;
  color: #007aff;
}
@media screen and (max-width: 768px) {
  .c-search__open button::after {
    font-size: 1.5rem;
  }
}

.c-bnr__fixed {
  position: fixed;
  bottom: 130px;
  right: 30px;
}
@media screen and (max-width: 768px) {
  .c-bnr__fixed {
    display: none;
  }
}
.c-bnr__fixed-wrap {
  position: relative;
}
.c-bnr__fixed-close {
  position: absolute;
  top: -14px;
  right: -11px;
  color: #fff;
  background: #777777;
  border: 2px solid #fff;
  border-radius: 50%;
  width: 28px;
  height: 28px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

.pagination:has(.page-numbers) {
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  .pagination:has(.page-numbers) {
    margin-bottom: calc(30 /750*100vw);
  }
}
.pagination .page-numbers {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}
@media screen and (max-width: 768px) {
  .pagination .page-numbers {
    gap: calc(10 /750*100vw);
  }
}
.pagination .page-numbers li a,
.pagination .page-numbers li span {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  font-size: 1.6rem;
  color: #333333;
  border-radius: 50%;
  background: #d9ebff;
  transition: background 0.2s, color 0.2s;
}
@media screen and (max-width: 768px) {
  .pagination .page-numbers li a,
  .pagination .page-numbers li span {
    width: calc(90 /750*100vw);
    height: calc(90 /750*100vw);
    font-size: calc(34 /750*100vw);
  }
}
.pagination .page-numbers li a:hover,
.pagination .page-numbers li span:hover {
  background: #026ee2;
  color: #fff;
}
.pagination .page-numbers li a.current,
.pagination .page-numbers li span.current {
  background: #007aff;
  color: #fff;
}
.pagination .page-numbers li .dots,
.pagination .page-numbers li .prev,
.pagination .page-numbers li .next {
  width: auto;
  background: transparent;
}
.pagination .page-numbers li .dots:hover {
  background: transparent;
  color: #333333;
}
.pagination .page-numbers li .prev:hover,
.pagination .page-numbers li .next:hover {
  background: transparent;
  color: #007aff;
}

@keyframes bound {
  0% {
    -webkit-transform: matrix3d(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  3.4% {
    -webkit-transform: matrix3d(0.316, 0, 0, 0, 0, 0.407, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.316, 0, 0, 0, 0, 0.407, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  4.7% {
    -webkit-transform: matrix3d(0.45, 0, 0, 0, 0, 0.599, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.45, 0, 0, 0, 0, 0.599, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  6.81% {
    -webkit-transform: matrix3d(0.659, 0, 0, 0, 0, 0.893, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.659, 0, 0, 0, 0, 0.893, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  9.41% {
    -webkit-transform: matrix3d(0.883, 0, 0, 0, 0, 1.168, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.883, 0, 0, 0, 0, 1.168, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  10.21% {
    -webkit-transform: matrix3d(0.942, 0, 0, 0, 0, 1.226, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.942, 0, 0, 0, 0, 1.226, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  13.61% {
    -webkit-transform: matrix3d(1.123, 0, 0, 0, 0, 1.332, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.123, 0, 0, 0, 0, 1.332, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  14.11% {
    -webkit-transform: matrix3d(1.141, 0, 0, 0, 0, 1.331, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.141, 0, 0, 0, 0, 1.331, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  17.52% {
    -webkit-transform: matrix3d(1.208, 0, 0, 0, 0, 1.239, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.208, 0, 0, 0, 0, 1.239, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  18.72% {
    -webkit-transform: matrix3d(1.212, 0, 0, 0, 0, 1.187, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.212, 0, 0, 0, 0, 1.187, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  21.32% {
    -webkit-transform: matrix3d(1.196, 0, 0, 0, 0, 1.069, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.196, 0, 0, 0, 0, 1.069, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  24.32% {
    -webkit-transform: matrix3d(1.151, 0, 0, 0, 0, 0.96, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.151, 0, 0, 0, 0, 0.96, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  25.23% {
    -webkit-transform: matrix3d(1.134, 0, 0, 0, 0, 0.938, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.134, 0, 0, 0, 0, 0.938, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  29.03% {
    -webkit-transform: matrix3d(1.063, 0, 0, 0, 0, 0.897, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.063, 0, 0, 0, 0, 0.897, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  29.93% {
    -webkit-transform: matrix3d(1.048, 0, 0, 0, 0, 0.899, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.048, 0, 0, 0, 0, 0.899, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  35.54% {
    -webkit-transform: matrix3d(0.979, 0, 0, 0, 0, 0.962, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.979, 0, 0, 0, 0, 0.962, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  36.74% {
    -webkit-transform: matrix3d(0.972, 0, 0, 0, 0, 0.979, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.972, 0, 0, 0, 0, 0.979, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  41.04% {
    -webkit-transform: matrix3d(0.961, 0, 0, 0, 0, 1.022, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.961, 0, 0, 0, 0, 1.022, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  44.44% {
    -webkit-transform: matrix3d(0.966, 0, 0, 0, 0, 1.032, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.966, 0, 0, 0, 0, 1.032, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  52.15% {
    -webkit-transform: matrix3d(0.991, 0, 0, 0, 0, 1.006, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.991, 0, 0, 0, 0, 1.006, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  59.86% {
    -webkit-transform: matrix3d(1.006, 0, 0, 0, 0, 0.99, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.006, 0, 0, 0, 0, 0.99, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  63.26% {
    -webkit-transform: matrix3d(1.007, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.007, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  75.28% {
    -webkit-transform: matrix3d(1.001, 0, 0, 0, 0, 1.003, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.001, 0, 0, 0, 0, 1.003, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  85.49% {
    -webkit-transform: matrix3d(0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  90.69% {
    -webkit-transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  100% {
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
}
@keyframes small-1 {
  0% {
    -webkit-transform: matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  1.2% {
    -webkit-transform: matrix3d(0.691, 0, 0, 0, 0, 0.691, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.691, 0, 0, 0, 0, 0.691, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  2.3% {
    -webkit-transform: matrix3d(0.967, 0, 0, 0, 0, 0.967, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.967, 0, 0, 0, 0, 0.967, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  3.5% {
    -webkit-transform: matrix3d(1.207, 0, 0, 0, 0, 1.207, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.207, 0, 0, 0, 0, 1.207, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  4.6% {
    -webkit-transform: matrix3d(1.281, 0, 0, 0, 0, 1.281, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.281, 0, 0, 0, 0, 1.281, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  5.91% {
    -webkit-transform: matrix3d(1.192, 0, 0, 0, 0, 1.192, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.192, 0, 0, 0, 0, 1.192, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  7.11% {
    -webkit-transform: matrix3d(1.028, 0, 0, 0, 0, 1.028, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.028, 0, 0, 0, 0, 1.028, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  8.31% {
    -webkit-transform: matrix3d(0.892, 0, 0, 0, 0, 0.892, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.892, 0, 0, 0, 0, 0.892, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  9.51% {
    -webkit-transform: matrix3d(0.845, 0, 0, 0, 0, 0.845, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.845, 0, 0, 0, 0, 0.845, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  11.91% {
    -webkit-transform: matrix3d(0.979, 0, 0, 0, 0, 0.979, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.979, 0, 0, 0, 0, 0.979, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  14.31% {
    -webkit-transform: matrix3d(1.086, 0, 0, 0, 0, 1.086, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.086, 0, 0, 0, 0, 1.086, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  19.22% {
    -webkit-transform: matrix3d(0.953, 0, 0, 0, 0, 0.953, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.953, 0, 0, 0, 0, 0.953, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  24.12% {
    -webkit-transform: matrix3d(1.026, 0, 0, 0, 0, 1.026, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.026, 0, 0, 0, 0, 1.026, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  29.03% {
    -webkit-transform: matrix3d(0.986, 0, 0, 0, 0, 0.986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.986, 0, 0, 0, 0, 0.986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  33.93% {
    -webkit-transform: matrix3d(1.008, 0, 0, 0, 0, 1.008, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.008, 0, 0, 0, 0, 1.008, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  38.74% {
    -webkit-transform: matrix3d(0.996, 0, 0, 0, 0, 0.996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.996, 0, 0, 0, 0, 0.996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  43.64% {
    -webkit-transform: matrix3d(1.002, 0, 0, 0, 0, 1.002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.002, 0, 0, 0, 0, 1.002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  48.55% {
    -webkit-transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  53.45% {
    -webkit-transform: matrix3d(1.001, 0, 0, 0, 0, 1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.001, 0, 0, 0, 0, 1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  58.26% {
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  63.16% {
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  68.07% {
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  72.97% {
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  77.88% {
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  82.68% {
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  87.59% {
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  92.49% {
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  97.4% {
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  100% {
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
}
@keyframes big4-1 {
  0% {
    -webkit-transform: matrix3d(3, 0, 0, 0, 0, 3, 0, 0, 0, 0, 1, 0, 0, -150, 0, 1);
    transform: matrix3d(3, 0, 0, 0, 0, 3, 0, 0, 0, 0, 1, 0, 0, -150, 0, 1);
  }
  1.6% {
    -webkit-transform: matrix3d(2.421, 0, 0, 0, 0, 2.421, 0, 0, 0, 0, 1, 0, 0, -81.848, 0, 1);
    transform: matrix3d(2.421, 0, 0, 0, 0, 2.421, 0, 0, 0, 0, 1, 0, 0, -81.848, 0, 1);
  }
  2.2% {
    -webkit-transform: matrix3d(2.143, 0, 0, 0, 0, 2.143, 0, 0, 0, 0, 1, 0, 0, -62.523, 0, 1);
    transform: matrix3d(2.143, 0, 0, 0, 0, 2.143, 0, 0, 0, 0, 1, 0, 0, -62.523, 0, 1);
  }
  3.15% {
    -webkit-transform: matrix3d(1.689, 0, 0, 0, 0, 1.689, 0, 0, 0, 0, 1, 0, 0, -38.993, 0, 1);
    transform: matrix3d(1.689, 0, 0, 0, 0, 1.689, 0, 0, 0, 0, 1, 0, 0, -38.993, 0, 1);
  }
  4.3% {
    -webkit-transform: matrix3d(1.178, 0, 0, 0, 0, 1.178, 0, 0, 0, 0, 1, 0, 0, -20.454, 0, 1);
    transform: matrix3d(1.178, 0, 0, 0, 0, 1.178, 0, 0, 0, 0, 1, 0, 0, -20.454, 0, 1);
  }
  6.26% {
    -webkit-transform: matrix3d(0.558, 0, 0, 0, 0, 0.558, 0, 0, 0, 0, 1, 0, 0, -5.963, 0, 1);
    transform: matrix3d(0.558, 0, 0, 0, 0, 0.558, 0, 0, 0, 0, 1, 0, 0, -5.963, 0, 1);
  }
  6.41% {
    -webkit-transform: matrix3d(0.527, 0, 0, 0, 0, 0.527, 0, 0, 0, 0, 1, 0, 0, -5.42, 0, 1);
    transform: matrix3d(0.527, 0, 0, 0, 0, 0.527, 0, 0, 0, 0, 1, 0, 0, -5.42, 0, 1);
  }
  8.51% {
    -webkit-transform: matrix3d(0.33, 0, 0, 0, 0, 0.33, 0, 0, 0, 0, 1, 0, 0, -2.002, 0, 1);
    transform: matrix3d(0.33, 0, 0, 0, 0, 0.33, 0, 0, 0, 0, 1, 0, 0, -2.002, 0, 1);
  }
  9.41% {
    -webkit-transform: matrix3d(0.365, 0, 0, 0, 0, 0.365, 0, 0, 0, 0, 1, 0, 0, -1.763, 0, 1);
    transform: matrix3d(0.365, 0, 0, 0, 0, 0.365, 0, 0, 0, 0, 1, 0, 0, -1.763, 0, 1);
  }
  10.91% {
    -webkit-transform: matrix3d(0.525, 0, 0, 0, 0, 0.525, 0, 0, 0, 0, 1, 0, 0, -1.733, 0, 1);
    transform: matrix3d(0.525, 0, 0, 0, 0, 0.525, 0, 0, 0, 0, 1, 0, 0, -1.733, 0, 1);
  }
  12.51% {
    -webkit-transform: matrix3d(0.759, 0, 0, 0, 0, 0.759, 0, 0, 0, 0, 1, 0, 0, -1.664, 0, 1);
    transform: matrix3d(0.759, 0, 0, 0, 0, 0.759, 0, 0, 0, 0, 1, 0, 0, -1.664, 0, 1);
  }
  13.31% {
    -webkit-transform: matrix3d(0.875, 0, 0, 0, 0, 0.875, 0, 0, 0, 0, 1, 0, 0, -1.562, 0, 1);
    transform: matrix3d(0.875, 0, 0, 0, 0, 0.875, 0, 0, 0, 0, 1, 0, 0, -1.562, 0, 1);
  }
  15.72% {
    -webkit-transform: matrix3d(1.134, 0, 0, 0, 0, 1.134, 0, 0, 0, 0, 1, 0, 0, -1.086, 0, 1);
    transform: matrix3d(1.134, 0, 0, 0, 0, 1.134, 0, 0, 0, 0, 1, 0, 0, -1.086, 0, 1);
  }
  18.02% {
    -webkit-transform: matrix3d(1.21, 0, 0, 0, 0, 1.21, 0, 0, 0, 0, 1, 0, 0, -0.634, 0, 1);
    transform: matrix3d(1.21, 0, 0, 0, 0, 1.21, 0, 0, 0, 0, 1, 0, 0, -0.634, 0, 1);
  }
  18.77% {
    -webkit-transform: matrix3d(1.202, 0, 0, 0, 0, 1.202, 0, 0, 0, 0, 1, 0, 0, -0.517, 0, 1);
    transform: matrix3d(1.202, 0, 0, 0, 0, 1.202, 0, 0, 0, 0, 1, 0, 0, -0.517, 0, 1);
  }
  22.82% {
    -webkit-transform: matrix3d(1.04, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, -0.151, 0, 1);
    transform: matrix3d(1.04, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, -0.151, 0, 1);
  }
  25.03% {
    -webkit-transform: matrix3d(0.963, 0, 0, 0, 0, 0.963, 0, 0, 0, 0, 1, 0, 0, -0.077, 0, 1);
    transform: matrix3d(0.963, 0, 0, 0, 0, 0.963, 0, 0, 0, 0, 1, 0, 0, -0.077, 0, 1);
  }
  27.53% {
    -webkit-transform: matrix3d(0.934, 0, 0, 0, 0, 0.934, 0, 0, 0, 0, 1, 0, 0, -0.037, 0, 1);
    transform: matrix3d(0.934, 0, 0, 0, 0, 0.934, 0, 0, 0, 0, 1, 0, 0, -0.037, 0, 1);
  }
  37.04% {
    -webkit-transform: matrix3d(1.021, 0, 0, 0, 0, 1.021, 0, 0, 0, 0, 1, 0, 0, -0.002, 0, 1);
    transform: matrix3d(1.021, 0, 0, 0, 0, 1.021, 0, 0, 0, 0, 1, 0, 0, -0.002, 0, 1);
  }
  46.55% {
    -webkit-transform: matrix3d(0.994, 0, 0, 0, 0, 0.994, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.994, 0, 0, 0, 0, 0.994, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  50% {
    -webkit-transform: matrix3d(0.997, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.997, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  56.16% {
    -webkit-transform: matrix3d(1.002, 0, 0, 0, 0, 1.002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1.002, 0, 0, 0, 0, 1.002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  65.67% {
    -webkit-transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  75.18% {
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  84.68% {
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  94.29% {
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  100% {
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
}
@keyframes up {
  0% {
    transform: translateY(20px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes down {
  0% {
    transform: translateY(-20px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
/* アニメーション */
.animation {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 5%;
  box-sizing: border-box;
}
.animation div {
  width: 23%;
  height: 300px;
  margin: 0 0 2.5vw;
  padding: 3%;
  box-sizing: border-box;
  background: #09c;
}

.c-sa {
  opacity: 0;
}
.c-sa.show {
  opacity: 1;
}

.c-sa__lr {
  transform: translate(-100px, 0);
  transition: transform 0.5s ease;
}
.c-sa__lr.show {
  transform: translate(0, 0);
}

.c-sa__rl {
  transform: translate(100px, 0);
  transition: transform 0.5s ease;
}
.c-sa__rl.show {
  transform: translate(0, 0);
}

.c-sa__up.show {
  animation: up 1s ease-in-out;
}

.c-sa__down.show {
  animation: down 1s ease-in-out;
}

.c-sa__scaleUp {
  transform: scale(0.5);
  transition: transform 0.5s ease;
}
.c-sa__scaleUp.show {
  transform: scale(1);
}

.c-sa__scaleDown {
  transform: scale(1.5);
  transition: transform 0.5s ease;
}
.c-sa__scaleDown.show {
  transform: scale(1);
}

.c-sa__rotateL {
  transform: rotate(180deg);
  transition: transform 0.5s ease;
}
.c-sa__rotateL.show {
  transform: rotate(0);
}

.c-sa__rotateR {
  transform: rotate(-180deg);
  transition: transform 0.5s ease;
}
.c-sa__rotateR.show {
  transform: rotate(0);
}

.c-sa__bound.show {
  animation: bound 1000ms linear both;
}

.c-sa__big.show {
  animation: big4-1 1500ms linear both;
}

.c-sa__small {
  transform: scale(0.5);
}
.c-sa__small.show {
  animation: small-1 1500ms linear both;
  transform: scale(1);
}

.c-sa__lr--path {
  clip-path: inset(0 100% 0 0);
  transition: 0.4s cubic-bezier(0.37, 0, 0.63, 1);
  transition-property: clip-path;
}
@media screen and (max-width: 768px) {
  .c-sa__lr--path {
    transition: 0.2s cubic-bezier(0.37, 0, 0.63, 1);
  }
}
.c-sa__lr--path.show {
  clip-path: inset(0);
}

.p-index__video {
  width: 100%;
  height: 100svh;
  height: 100vh;
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  overflow: hidden;
  z-index: -1;
}
.p-index__video:before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  background: url(../img/index/dot.png);
  width: 100%;
  height: 100%;
}
.p-index__video iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  width: 177.77777778vh;
  height: 56.25vw;
  min-height: 100%;
  min-width: 100%;
  z-index: -2;
}
.p-index__modal {
  display: none;
}
.p-index__modal.fancybox-content {
  padding: 0;
}
@media screen and (max-width: 768px) {
  .p-index .fancybox-slide--html {
    padding: calc(30 /750*100vw);
  }
}
.p-index .fancybox-button--close {
  background: #777;
  color: #fff;
  font-size: 1.2rem;
  border: 2px solid #fff;
  border-radius: 50%;
  box-shadow: 0px 6px 6px 0px rgba(10, 2, 4, 0.14);
  padding: 0;
  width: 28px;
  height: 28px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .p-index .fancybox-button--close {
    width: calc(50 /750*100vw);
    height: calc(50 /750*100vw);
    font-size: calc(24 /750*100vw);
  }
}
.p-index .fancybox-toolbar {
  top: calc(50% - 264px);
  right: calc(50% - 264px);
}
@media screen and (max-width: 768px) {
  .p-index .fancybox-toolbar {
    top: calc(50% - (370 /750*100vw));
    right: calc(50% - (370 /750*100vw));
  }
}
.p-index__mv {
  margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
  .p-index__mv {
    margin-bottom: 0;
  }
}
.p-index__mv-txt {
  color: #fff;
  font-size: 1.6rem;
  text-align: center;
  margin-block: 40px;
}
@media screen and (max-width: 768px) {
  .p-index__mv-txt {
    margin-block: calc(24 /750*100vw);
  }
}
.p-index__mv-slider {
  margin-block: 40px;
}
@media screen and (max-width: 768px) {
  .p-index__mv-slider {
    margin-block: calc(24 /750*100vw) calc(-15 /750*100vw);
  }
}
.p-index__mv-slider-img img {
  padding-inline: 10px;
  width: 920px;
}
@media screen and (max-width: 768px) {
  .p-index__mv-slider-img img {
    padding-inline: 0;
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .p-index__mv-thum {
    display: none;
  }
}
.p-index__mv-thum-img img {
  width: 160px;
}
.p-index__mv-thum-wrap {
  width: 1010px;
  margin-inline: auto;
}
.p-index__mv-chara {
  width: calc(455 /750*100vw);
  margin-left: calc(188 /750*100vw);
  position: relative;
}
@media screen and (max-width: 768px) {
  .p-index__mv .c-search__open {
    display: flex;
    background: rgba(255, 255, 255, 0.3);
    border: none;
    border-radius: calc(40 /750*100vw);
    margin-top: calc(24 /750*100vw);
    width: 100%;
  }
  .p-index__mv .c-search__open input {
    width: 100%;
    height: calc(80 /750*100vw);
    padding: calc(20 /750*100vw) calc(32 /750*100vw);
  }
  .p-index__mv .c-search__open button:after {
    color: #fff;
    font-size: calc(32 /750*100vw);
  }
}
.p-index__slot {
  background: #daebff;
  padding-block: 50px;
}
@media (width <= 768px) {
  .p-index__slot {
    padding-block: calc(40 /750*100vw);
  }
}
@media (width <= 768px) {
  .p-index__slot .l-content__size-pc-1 {
    margin-inline: calc(-30 /750*100vw);
  }
}
.p-index__slot-outer {
  border-radius: 15px;
  border: 5px solid #9dccff;
  padding: 5px;
  width: 1050px;
  margin-inline: auto;
  position: relative;
}
@media (width <= 768px) {
  .p-index__slot-outer {
    border: none;
    padding: 0;
    width: 100%;
  }
}
.p-index__slot-outer:before, .p-index__slot-outer:after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  top: calc(50% - 9px);
}
@media (width <= 768px) {
  .p-index__slot-outer:before, .p-index__slot-outer:after {
    display: none;
  }
}
.p-index__slot-outer:before {
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
  border-left: 16px solid #007aff;
  border-right: 0;
  left: -34px;
}
.p-index__slot-outer:after {
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
  border-right: 16px solid #007aff;
  border-left: 0;
  right: -34px;
}
.p-index__slot-inner {
  display: grid;
  grid-template-columns: repeat(3, 330px);
  gap: 10px;
  border: 10px solid #000;
  background: #000;
  box-shadow: 0px 0px 0px 5px #007aff;
  border-radius: 5px;
}
@media (width <= 768px) {
  .p-index__slot-inner {
    gap: calc(15 /750*100vw);
    grid-template-columns: 1fr 1fr 1fr;
    border: none;
    border-top: calc(14 /750*100vw) solid #000;
    border-bottom: calc(14 /750*100vw) solid #000;
    border-radius: 0;
    box-shadow: none;
  }
}
.p-index__slot-column {
  position: relative;
  aspect-ratio: 3/2;
  height: 100%;
  overflow: hidden;
}
.p-index__slot-column img {
  width: 100%;
  height: auto;
  backface-visibility: hidden;
  line-height: 0;
}
.p-index__slot .reel {
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
  flex-direction: column;
  width: 100%;
  will-change: top;
}
.p-index__pickup-slider .slick-prev,
.p-index__pickup-slider .slick-next {
  width: 44px;
  height: 44px;
}
@media screen and (max-width: 768px) {
  .p-index__pickup-slider .slick-prev,
  .p-index__pickup-slider .slick-next {
    width: calc(60 /750*100vw);
    height: calc(60 /750*100vw);
  }
}
.p-index__pickup-slider .slick-prev:before,
.p-index__pickup-slider .slick-next:before {
  border: 2px solid #fff;
  border-radius: 50%;
  background: #4c4c4c;
  box-shadow: 0px 3px 4px 0px rgba(10, 2, 4, 0.14);
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  width: 44px;
  height: 44px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .p-index__pickup-slider .slick-prev:before,
  .p-index__pickup-slider .slick-next:before {
    font-size: calc(26 /750*100vw);
    width: calc(60 /750*100vw);
    height: calc(60 /750*100vw);
  }
}
.p-index__pickup-slider .slick-prev {
  left: 50px;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .p-index__pickup-slider .slick-prev {
    left: calc(130 /750*100vw);
  }
}
.p-index__pickup-slider .slick-prev:before {
  content: "\f104";
}
.p-index__pickup-slider .slick-next {
  right: 50px;
}
@media screen and (max-width: 768px) {
  .p-index__pickup-slider .slick-next {
    right: calc(130 /750*100vw);
  }
}
.p-index__pickup-slider .slick-next:before {
  content: "\f105";
}
.p-index__pickup .c-goods__item {
  width: 300px;
  border-top: 1px solid #cccccc;
}
@media screen and (max-width: 768px) {
  .p-index__pickup .c-goods__item {
    width: calc(430 /750*100vw);
  }
}
.p-index__series, .p-index__type {
  position: relative;
  margin-bottom: 70px;
}
@media screen and (max-width: 768px) {
  .p-index__series, .p-index__type {
    margin-bottom: calc(90 /750*100vw);
  }
}
.p-index__series .c-ttl, .p-index__type .c-ttl {
  padding-block: 45px 35px;
}
@media screen and (max-width: 768px) {
  .p-index__series .c-ttl, .p-index__type .c-ttl {
    padding-block: calc(90 /750*100vw) calc(70 /750*100vw);
  }
}
.p-index__series .c-ttl__en, .p-index__type .c-ttl__en {
  color: #fff;
}
.p-index__series-chara {
  position: absolute;
  top: -30px;
  right: calc(50% - 592px);
}
@media screen and (max-width: 768px) {
  .p-index__series-chara {
    width: calc(315 /750*100vw);
    top: calc(-74 /750*100vw);
    right: calc(5 /750*100vw);
  }
}
.p-index__type-chara {
  position: absolute;
  top: -44px;
  left: calc(50% - 601px);
}
@media screen and (max-width: 768px) {
  .p-index__type-chara {
    width: calc(332 /750*100vw);
    top: calc(-74 /750*100vw);
    left: calc(16 /750*100vw);
  }
}
.p-index__newitem-list, .p-index__ranking-list {
  display: flex;
  flex-wrap: wrap;
}
.p-index__newitem .c-goods__item, .p-index__ranking .c-goods__item {
  width: 240px;
}
@media screen and (max-width: 768px) {
  .p-index__newitem .c-goods__item, .p-index__ranking .c-goods__item {
    width: calc(345 /750*100vw);
    width: 50%;
  }
}
.p-index__newitem .c-goods__item:nth-of-type(5n + 1), .p-index__ranking .c-goods__item:nth-of-type(5n + 1) {
  border-left: 1px solid #cccccc;
}
@media screen and (max-width: 768px) {
  .p-index__newitem .c-goods__item:nth-of-type(5n + 1), .p-index__ranking .c-goods__item:nth-of-type(5n + 1) {
    border-left: none;
  }
}
@media screen and (max-width: 768px) {
  .p-index__newitem .c-goods__item:nth-of-type(2n + 1), .p-index__ranking .c-goods__item:nth-of-type(2n + 1) {
    border-left: 1px solid #cccccc;
  }
}
.p-index__newitem-no, .p-index__ranking-no {
  font-size: 1.6rem;
  text-align: center;
}
.p-index__newitem .l-content__size-pc-1 {
  position: relative;
}
.p-index__newitem .c-more {
  position: absolute;
  top: 92px;
  right: 0;
}
@media screen and (max-width: 768px) {
  .p-index__newitem .c-more {
    position: static;
    margin-top: calc(60 /750*100vw);
  }
}
.p-index__newitem .c-goods__item:nth-of-type(1), .p-index__newitem .c-goods__item:nth-of-type(2), .p-index__newitem .c-goods__item:nth-of-type(3), .p-index__newitem .c-goods__item:nth-of-type(4), .p-index__newitem .c-goods__item:nth-of-type(5) {
  border-top: 1px solid #cccccc;
}
@media screen and (max-width: 768px) {
  .p-index__newitem .c-goods__item:nth-of-type(1), .p-index__newitem .c-goods__item:nth-of-type(2), .p-index__newitem .c-goods__item:nth-of-type(3), .p-index__newitem .c-goods__item:nth-of-type(4), .p-index__newitem .c-goods__item:nth-of-type(5) {
    border-top: none;
  }
}
@media screen and (max-width: 768px) {
  .p-index__newitem .c-goods__item:nth-of-type(1), .p-index__newitem .c-goods__item:nth-of-type(2) {
    border-top: 1px solid #cccccc;
  }
}
.p-index__ranking .c-goods__item {
  border-top: 1px solid #cccccc;
}
@media screen and (max-width: 768px) {
  .p-index__ranking .c-goods__item {
    border-top: none;
  }
}
@media screen and (max-width: 768px) {
  .p-index__ranking .c-goods__item:nth-of-type(1), .p-index__ranking .c-goods__item:nth-of-type(2) {
    border-top: 1px solid #cccccc;
  }
}
.p-index__ranking .c-goods__item:nth-of-type(6) {
  display: none;
}
@media screen and (max-width: 768px) {
  .p-index__ranking .c-goods__item:nth-of-type(6) {
    display: block;
  }
}
.p-index__ranking-tab {
  display: flex;
  justify-content: center;
  gap: 15px;
  border-bottom: 2px solid #007aff;
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .p-index__ranking-tab {
    gap: calc(18 /750*100vw);
    margin-bottom: calc(60 /750*100vw);
    margin-inline: calc(-30 /750*100vw);
  }
}
.p-index__ranking-tab-item {
  width: 200px;
  height: 50px;
  border-radius: 10px 10px 0 0;
  background: rgba(0, 122, 255, 0.2);
  color: #999999;
  font-size: 1.6rem;
  font-weight: 700;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  .p-index__ranking-tab-item {
    width: calc(218 /750*100vw);
    height: calc(80 /750*100vw);
    border-radius: calc(15 /750*100vw) calc(15 /750*100vw) 0 0;
    font-size: calc(30 /750*100vw);
  }
}
.p-index__ranking-tab-item.active {
  background: #007aff;
  color: #fff;
}
.p-index__ranking-tab-cont {
  display: none;
}
.p-index__ranking-tab-cont.show {
  display: block;
}

.p-list .l-header {
  border-bottom: 1px solid #cccccc;
}
.p-list__contents {
  padding: 50px 0 80px;
}
@media screen and (max-width: 768px) {
  .p-list__contents {
    padding-block: calc(70 /750*100vw) calc(100 /750*100vw);
  }
}
.p-list__top {
  position: relative;
}
.p-list__ttl {
  font-size: 3rem;
  font-weight: 700;
  text-align: center;
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  .p-list__ttl {
    font-size: calc(48 /750*100vw);
    margin-bottom: calc(20 /750*100vw);
  }
}
.p-list__displayed {
  font-size: 1.4rem;
  color: #999999;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .p-list__displayed {
    font-size: calc(26 /750*100vw);
  }
}
.p-list__chara {
  position: absolute;
  top: -35px;
  left: 40px;
}
@media screen and (max-width: 768px) {
  .p-list__chara {
    position: static;
    margin-left: calc(180 /750*100vw);
    margin-top: calc(34 /750*100vw);
    margin-bottom: calc(4 /750*100vw);
    width: calc(419 /750*100vw);
  }
}
.p-list__sort {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .p-list__sort {
    position: static;
    justify-content: center;
    margin-bottom: calc(60 /750*100vw);
  }
}
.p-list__sort-wrapper {
  position: relative;
  display: inline-block;
  user-select: none;
  z-index: 10;
}
.p-list__sort-wrapper select {
  display: none;
}
.p-list__sort-select {
  position: relative;
  display: inline-block;
}
.p-list__sort-select-trigger {
  display: inline-flex;
  justify-content: center;
  width: 170px;
  padding-block: 7px;
  font-size: 1.4rem;
  font-weight: 700;
  color: #fff;
  background: #007aff;
  border-radius: 17.5px;
  text-align: center;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  .p-list__sort-select-trigger {
    width: calc(430 /750*100vw);
    padding-block: calc(16 /750*100vw);
    font-size: calc(30 /750*100vw);
    border-radius: calc(40 /750*100vw);
  }
}
.p-list__sort-select-trigger:before {
  display: block;
  content: "\f07d";
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  margin-right: 8px;
}
@media screen and (max-width: 768px) {
  .p-list__sort-select-trigger:before {
    margin-right: calc(18 /750*100vw);
  }
}
.p-list__sort-select.opened .p-list__sort-select-trigger:after {
  margin-top: 3px;
  transform: rotate(-135deg) translateY(-50%);
}
@media screen and (max-width: 768px) {
  .p-list__sort-select.opened .p-list__sort-select-trigger:after {
    margin-top: calc(18 /750*100vw);
  }
}
.p-list__sort-select.opened .p-list__sort-options {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  transform: translateY(0);
}
.p-list__sort-options {
  position: absolute;
  display: block;
  top: 100%;
  left: 0;
  right: 0;
  min-width: 100%;
  margin-top: 15px;
  padding: 10px 20px;
  border-radius: 10px;
  box-sizing: border-box;
  box-shadow: 0px 0px 20px 0px rgba(10, 2, 4, 0.2);
  background: #fff;
  transition: all 0.4s ease-in-out;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-15px);
}
@media screen and (max-width: 768px) {
  .p-list__sort-options {
    margin-top: calc(30 /750*100vw);
    padding: calc(10 /750*100vw) calc(40 /750*100vw);
    border-radius: calc(10 /750*100vw);
  }
}
.p-list__sort-options:before {
  position: absolute;
  display: block;
  content: "";
  bottom: 100%;
  right: calc(50% - 10px);
  width: 20px;
  height: 20px;
  margin-bottom: -14px;
  background: #fff;
  transform: rotate(45deg);
  transition: all 0.4s ease-in-out;
}
.p-list__sort-option {
  position: relative;
  display: block;
  padding-block: 10px;
  border-bottom: 1px solid #eeeeee;
  font-size: 1.4rem;
  font-weight: 400;
  color: #aaaaaa;
  text-align: center;
  cursor: pointer;
  transition: all 0.4s ease-in-out;
}
@media screen and (max-width: 768px) {
  .p-list__sort-option {
    padding-block: calc(20 /750*100vw);
    font-size: calc(30 /750*100vw);
  }
}
.p-list__sort-option:last-of-type {
  border-bottom: 0;
}
.p-list__sort-option:hover {
  background: rgba(0, 122, 255, 0.1);
}
.p-list__sort-option.selection {
  color: #333333;
}
.p-list__items {
  display: flex;
  flex-wrap: wrap;
  position: relative;
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  .p-list__items {
    margin-bottom: calc(80 /750*100vw);
  }
}
.p-list__items .c-goods__item {
  width: 240px;
}
@media screen and (max-width: 768px) {
  .p-list__items .c-goods__item {
    width: calc(345 /750*100vw);
    width: 50%;
  }
}
.p-list__items .c-goods__item:nth-of-type(5n + 1) {
  border-left: 1px solid #cccccc;
}
@media screen and (max-width: 768px) {
  .p-list__items .c-goods__item:nth-of-type(5n + 1) {
    border-left: none;
  }
}
.p-list__items .c-goods__item:nth-of-type(1), .p-list__items .c-goods__item:nth-of-type(2), .p-list__items .c-goods__item:nth-of-type(3), .p-list__items .c-goods__item:nth-of-type(4), .p-list__items .c-goods__item:nth-of-type(5) {
  border-top: 1px solid #cccccc;
}
@media screen and (max-width: 768px) {
  .p-list__items .c-goods__item:nth-of-type(1), .p-list__items .c-goods__item:nth-of-type(2), .p-list__items .c-goods__item:nth-of-type(3), .p-list__items .c-goods__item:nth-of-type(4), .p-list__items .c-goods__item:nth-of-type(5) {
    border-top: none;
  }
}
@media screen and (max-width: 768px) {
  .p-list__items .c-goods__item:nth-of-type(1), .p-list__items .c-goods__item:nth-of-type(2) {
    border-top: 1px solid #cccccc;
  }
}
@media screen and (max-width: 768px) {
  .p-list__items .c-goods__item:nth-of-type(2n + 1) {
    border-left: 1px solid #cccccc;
  }
}
.p-list__noresult {
  font-size: 1.6rem;
  text-align: center;
  max-width: 800px;
  padding-block: 36px;
  margin-inline: auto;
  margin-top: 64px;
  border-top: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
}
@media screen and (max-width: 768px) {
  .p-list__noresult {
    font-size: calc(30 /750*100vw);
    padding-block: calc(44 /750*100vw);
    margin-top: 0;
  }
}
.p-list__noresult-wrap {
  position: relative;
}
@media screen and (max-width: 768px) {
  .p-list__noresult-wrap {
    margin-top: calc(60 /750*100vw);
  }
}
.p-list__noresult-chara {
  position: absolute;
  top: -50px;
  left: 320px;
}
@media screen and (max-width: 768px) {
  .p-list__noresult-chara {
    position: static;
    width: calc(233 /750*100vw);
    margin-inline: auto;
    margin-bottom: calc(4 /750*100vw);
  }
}

.p-detail .l-header__logo {
  padding-block: 11px 14px;
}
@media screen and (max-width: 768px) {
  .p-detail .l-header__logo {
    padding-block: calc(12 /750*100vw) calc(18 /750*100vw);
    margin-inline: auto;
    width: calc(335 /750*100vw);
  }
}
.p-detail__contents {
  padding-block: 24px 40px;
}
@media screen and (max-width: 768px) {
  .p-detail__contents {
    padding-block: calc(60 /750*100vw) calc(59 /750*100vw);
  }
}
.p-detail__contents-inner {
  width: 500px;
  margin-inline: auto;
}
@media screen and (max-width: 768px) {
  .p-detail__contents-inner {
    width: calc(630 /750*100vw);
  }
}
.p-detail__contents-ttl {
  margin-bottom: 24px;
  font-size: 1.6rem;
  font-weight: 700;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .p-detail__contents-ttl {
    margin-bottom: calc(60 /750*100vw);
    font-size: calc(30 /750*100vw);
  }
}
.p-detail__contents-main {
  position: relative;
  margin-bottom: 11px;
}
@media screen and (max-width: 768px) {
  .p-detail__contents-main {
    margin-bottom: calc(15 /750*100vw);
  }
}
.p-detail__contents-main-img {
  border: 1px solid #cccccc;
}
.p-detail__contents-main-img img {
  aspect-ratio: 1/1;
  object-fit: contain;
}
.p-detail__contents-prev, .p-detail__contents-next {
  width: 28px;
  height: 28px;
  color: #fff;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #4c4c4c;
  font-size: 1.2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  .p-detail__contents-prev, .p-detail__contents-next {
    width: calc(50 /750*100vw);
    height: calc(50 /750*100vw);
    font-size: calc(24 /750*100vw);
  }
}
.p-detail__contents-prev {
  left: -35px;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .p-detail__contents-prev {
    left: calc(-25 /750*100vw);
  }
}
.p-detail__contents-next {
  right: -35px;
}
@media screen and (max-width: 768px) {
  .p-detail__contents-next {
    right: calc(-25 /750*100vw);
  }
}
.p-detail__contents-thum {
  display: flex;
  flex-wrap: wrap;
  gap: 11px;
}
@media screen and (max-width: 768px) {
  .p-detail__contents-thum {
    gap: calc(14 /750*100vw);
  }
}
.p-detail__contents-thum-img {
  border: 1px solid #cccccc;
  width: 62px;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  .p-detail__contents-thum-img {
    width: calc(114 /750*100vw);
  }
}
.p-detail__contents-btn {
  margin-top: 40px;
}
@media screen and (max-width: 768px) {
  .p-detail__contents-btn {
    margin-top: calc(70 /750*100vw);
  }
}
.p-detail__contents-btn a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 12px 30px;
  background: #007aff;
  color: #fff;
  font-size: 2rem;
  font-weight: 700;
  border-radius: 30px;
  border: 2px solid #fff;
  box-shadow: 0px 3px 4px 0px rgba(10, 2, 4, 0.14);
  transition: background 0.2s;
}
@media screen and (max-width: 768px) {
  .p-detail__contents-btn a {
    padding: calc(22 /750*100vw);
    font-size: calc(30 /750*100vw);
    border-radius: calc(50 /750*100vw);
  }
}
.p-detail__contents-btn a:hover {
  background: #026ee2;
}
.p-detail__contents-btn a i {
  margin-right: 16px;
}
.p-detail__contents-btn.soldout a {
  background: #b0b0b0;
  color: rgba(255, 255, 255, 0.5);
}
.p-detail__contents-btns {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 40px;
  margin-inline: -140px;
}
@media screen and (max-width: 768px) {
  .p-detail__contents-btns {
    gap: calc(25 /750*100vw);
    margin-top: calc(70 /750*100vw);
    margin-inline: 0;
  }
}
.p-detail__contents-btns .p-detail__contents-btn {
  margin-top: 0;
}
@media screen and (max-width: 768px) {
  .p-detail__contents-btns .p-detail__contents-btn {
    width: 100%;
  }
}
.p-detail__contents-btns a {
  width: inherit;
}
@media screen and (max-width: 768px) {
  .p-detail__contents-btns a {
    width: 100%;
  }
}
.p-detail__contents-btns a i {
  margin-right: 10px;
}
@media screen and (max-width: 768px) {
  .p-detail__contents-btns a i {
    margin-right: 16px;
  }
}
.p-detail__chara {
  position: fixed;
  right: 30px;
  bottom: 0;
  cursor: pointer;
  transition: opacity 0.2s;
}
@media screen and (max-width: 768px) {
  .p-detail__chara {
    position: static;
    width: calc(363 /750*100vw);
    margin-left: calc(273 /750*100vw);
  }
}
.p-detail__chara:hover {
  opacity: 0.8;
}

@media screen and (min-width: 769px) {
  .u-pc {
    display: block;
  }
  .u-pc__inline {
    display: inline;
  }
  .u-sp {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .u-pc,
  .u-pc__inline {
    display: none;
  }
  .u-sp {
    display: block;
  }
}

/*# sourceMappingURL=style.css.map */