@charset "UTF-8";
img {
  max-width: 100%;
  height: auto;
}

.timerHidden {
  display: none;
}

.timerVisible {
  display: block;
}

#headBar {
  text-align: center;
  font-size: calc(14 / 320 * 100vw);
  color: #fff;
  font-weight: 700;
  padding: calc(10 / 320 * 100vw);
  background-color: #ff851b;
}
@media screen and (min-width: 769px) {
  #headBar {
    font-size: min(calc(28 / 1920 * 100vw), 1.75rem);
    padding: min(calc(20 / 1920 * 100vw), 1.25rem);
  }
}

.halloween {
  overflow: hidden;
}
.halloween * {
  box-sizing: border-box;
}
.halloween *:not(.en) {
  font-family: "Yu Gothic Medium", "Yu Gothic", "Hiragino Kaku Gothic Pro", sans-serif;
}
.halloween_main {
  position: relative;
}
.halloween_main figure img {
  width: 100%;
}
.halloween_main h1 {
  position: absolute;
  top: calc(16 / 320 * 100vw);
  left: calc(12 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_main h1 {
    top: min(calc(56 / 1920 * 100vw), 3.5rem);
    left: min(calc(56 / 1920 * 100vw), 3.5rem);
  }
}
.halloween_main h1 img {
  width: calc(208 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_main h1 img {
    width: min(calc(784 / 1920 * 100vw), 49rem);
  }
}
.halloween_nav ul {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: calc(8 / 320 * 100vw) calc(12 / 320 * 100vw);
  position: absolute;
  top: calc(-110 / 320 * 100vw);
  left: 0;
  width: 100%;
}
@media screen and (min-width: 769px) {
  .halloween_nav ul {
    gap: 0 min(calc(48 / 1920 * 100vw), 3rem);
    top: max(-4.1666666667vw, -5rem);
  }
}
.halloween_nav ul li {
  position: relative;
  z-index: 0;
}
.halloween_nav ul li a {
  display: block;
  width: calc(133 / 320 * 100vw);
  aspect-ratio: 2/1;
  text-align: center;
  font-weight: 700;
  font-size: calc(11 / 320 * 100vw);
  color: #ff851b;
  padding-top: calc(29 / 320 * 100vw);
  transition: 0.3s;
  position: relative;
  z-index: 1;
}
@media screen and (min-width: 769px) {
  .halloween_nav ul li a {
    width: min(calc(320 / 1920 * 100vw), 20rem);
    font-size: min(calc(28 / 1920 * 100vw), 1.75rem);
    padding-top: min(calc(71 / 1920 * 100vw), 4.4375rem);
  }
}
.halloween_nav ul li a::before {
  content: "";
  width: 100%;
  height: 100%;
  background: url(../img/halloween/nav.svg) no-repeat center/100% auto;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  transition: 0.3s;
}
@media (hover) {
  .halloween_nav ul li a:hover {
    color: #451362;
    opacity: 1;
  }
  .halloween_nav ul li a:hover:before {
    background-image: url(../img/halloween/nav_ov.svg);
    animation: nav 0.2s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
  }
}
.halloween_lead {
  background: url(../img/halloween/bg1_sp.svg) no-repeat center top/100% auto;
  position: relative;
  color: #fff;
  margin-top: calc(-50 / 320 * 100vw);
  padding-top: calc(108 / 320 * 100vw);
  padding-bottom: calc(85 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_lead {
    background-image: url(../img/halloween/bg1.svg);
    margin-top: max(-8.59375vw, -10.3125rem);
    padding-top: min(calc(215 / 1920 * 100vw), 13.4375rem);
    padding-bottom: min(calc(200 / 1920 * 100vw), 12.5rem);
  }
}
.halloween_lead:before {
  content: "";
  width: 100%;
  height: calc(100% - 230 / 320 * 100vw);
  background-color: #762fa8;
  position: absolute;
  bottom: 0;
  left: 0;
}
@media screen and (min-width: 769px) {
  .halloween_lead:before {
    height: calc(100% - min(calc(950 / 1920 * 100vw), 59.375rem));
  }
}
.halloween_lead_main {
  text-align: center;
  position: relative;
}
.halloween_lead_main h2 {
  margin-bottom: calc(15 / 320 * 100vw) !important;
}
@media screen and (min-width: 769px) {
  .halloween_lead_main h2 {
    margin-bottom: min(calc(65 / 1920 * 100vw), 4.0625rem);
  }
}
.halloween_lead_main h2 img {
  width: calc(214 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_lead_main h2 img {
    width: min(calc(690 / 1920 * 100vw), 43.125rem);
  }
}
.halloween_lead_main p {
  font-size: calc(12 / 320 * 100vw);
  font-weight: 500;
  line-height: 2.16;
}
@media screen and (min-width: 769px) {
  .halloween_lead_main p {
    font-size: min(calc(33 / 1920 * 100vw), 2.0625rem);
  }
}
.halloween_lead_ghost {
  display: block;
  margin-top: calc(22 / 320 * 100vw);
  position: relative;
}
@media screen and (min-width: 769px) {
  .halloween_lead_ghost {
    display: none;
  }
}
.halloween_lead_ghost img:first-child {
  animation: ghost 3s ease-out infinite alternate-reverse forwards;
  width: calc(225 / 320 * 100vw);
  opacity: 1;
  transform: translateY(2rem);
  margin-left: calc(40 / 320 * 100vw);
}
.halloween_lead_ghost img:nth-child(2) {
  animation: ghost 3s ease-out infinite alternate forwards;
  position: absolute;
  top: 0;
  left: calc(30 / 320 * 100vw);
  top: calc(-15 / 320 * 100vw);
  width: calc(200 / 320 * 100vw);
  opacity: 0;
  transform: translateY(0);
}
.halloween_ranking {
  background: url(../img/halloween/wave.webp) repeat-x left top/auto calc(50 / 320 * 100vw);
  position: relative;
  margin-top: calc(-34 / 320 * 100vw);
  padding-top: calc(52 / 320 * 100vw);
  padding-bottom: calc(40 / 320 * 100vw);
  z-index: 0;
}
@media screen and (min-width: 769px) {
  .halloween_ranking {
    background-size: auto min(calc(84 / 1920 * 100vw), 5.25rem);
    margin-top: max(-5.2083333333vw, -6.25rem);
    padding-top: min(calc(182 / 1920 * 100vw), 11.375rem);
    padding-bottom: min(calc(155 / 1920 * 100vw), 9.6875rem);
  }
}
.halloween_ranking::before {
  content: "";
  width: 100%;
  height: calc(100% - 40 / 320 * 100vw);
  background-color: #ff851b;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
}
@media screen and (min-width: 769px) {
  .halloween_ranking::before {
    height: calc(100% - min(calc(80 / 1920 * 100vw), 5rem));
  }
}
.halloween_ranking_ghost {
  width: 100%;
  position: absolute;
  top: min(calc(162 / 1920 * 100vw), 10.125rem);
  left: 0;
  pointer-events: none;
}
@media screen and (max-width: 768px) {
  .halloween_ranking_ghost {
    display: none;
  }
}
.halloween_ranking_ghost img {
  position: absolute;
  width: min(calc(134 / 1920 * 100vw), 8.375rem);
}
.halloween_ranking_ghost img:first-child {
  top: min(calc(10 / 1920 * 100vw), 0.625rem);
  right: calc(50% + min(calc(330 / 1920 * 100vw), 20.625rem));
  animation: ghost 2s ease-out infinite alternate-reverse forwards;
  opacity: 1;
  transform: translate(1rem, 1rem);
}
.halloween_ranking_ghost img:nth-child(2) {
  top: 0;
  left: calc(50% + min(calc(336 / 1920 * 100vw), 21rem));
  animation: ghost 2.5s ease-out infinite alternate forwards 0.8s;
  opacity: 0;
  transform: translate(0);
}
.halloween_ranking h2 {
  text-align: center;
  position: relative;
}
.halloween_ranking h2 span {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.halloween_ranking h2 span img {
  width: calc(100 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_ranking h2 span img {
    width: min(calc(324 / 1920 * 100vw), 20.25rem);
  }
}
.halloween_ranking h2 span strong {
  color: #451362;
}
.halloween_ranking h2:before {
  content: "";
  width: calc(69 / 320 * 100vw);
  height: calc(69 / 320 * 100vw);
  background: url(../img/halloween/title_star.svg) no-repeat center/100% auto;
  position: absolute;
  right: calc(100% + 16 / 320 * 100vw);
  top: calc(-22 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_ranking h2:before {
    width: min(calc(261 / 1920 * 100vw), 16.3125rem);
    height: min(calc(261 / 1920 * 100vw), 16.3125rem);
    right: calc(100% + min(calc(362 / 1920 * 100vw), 22.625rem));
    top: max(-3.75vw, -4.5rem);
  }
}
.halloween_ranking h2:after {
  content: "";
  width: calc(69 / 320 * 100vw);
  height: calc(69 / 320 * 100vw);
  background: url(../img/halloween/title_star.svg) no-repeat center/100% auto;
  position: absolute;
  left: calc(100% + 16 / 320 * 100vw);
  top: calc(-13 / 320 * 100vw);
  transform: scale(-1, 1);
}
@media screen and (min-width: 769px) {
  .halloween_ranking h2:after {
    width: min(calc(261 / 1920 * 100vw), 16.3125rem);
    height: min(calc(261 / 1920 * 100vw), 16.3125rem);
    left: calc(100% + min(calc(362 / 1920 * 100vw), 22.625rem));
    top: max(-3.90625vw, -4.6875rem);
  }
}
.halloween_ranking_item {
  margin: calc(30 / 320 * 100vw) calc(25 / 320 * 100vw) 0;
  display: grid;
  row-gap: calc(70 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_ranking_item {
    margin: min(calc(80 / 1920 * 100vw), 5rem) auto 0;
    max-width: min(calc(1512 / 1920 * 100vw), 94.5rem);
    grid-template-columns: repeat(3, 1fr);
    gap: 0 min(calc(60 / 1920 * 100vw), 3.75rem);
  }
}
.halloween_ranking_item li {
  color: #451362;
  position: relative;
}
.halloween_ranking_item li a {
  display: block;
}
@media screen and (min-width: 769px) {
  .halloween_ranking_item li a {
    display: flex;
    flex-direction: column;
    height: 100%;
  }
}
.halloween_ranking_item li i {
  width: calc(52 / 320 * 100vw);
  height: calc(52 / 320 * 100vw);
  border-radius: 50%;
  position: absolute;
  top: calc(5 / 320 * 100vw);
  left: calc(5 / 320 * 100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  line-height: 1;
  font-size: calc(26 / 320 * 100vw);
  font-weight: 700;
  pointer-events: none;
  color: #fff;
  font-style: normal;
  padding-top: calc(5 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_ranking_item li i {
    width: min(calc(90 / 1920 * 100vw), 5.625rem);
    height: min(calc(90 / 1920 * 100vw), 5.625rem);
    top: min(calc(8 / 1920 * 100vw), 0.5rem);
    left: min(calc(8 / 1920 * 100vw), 0.5rem);
    font-size: min(calc(45 / 1920 * 100vw), 2.8125rem);
    padding-top: min(calc(5 / 1920 * 100vw), 0.3125rem);
  }
}
.halloween_ranking_item li i:before {
  content: "RANK";
  font-size: calc(9 / 320 * 100vw);
  padding-bottom: calc(2 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_ranking_item li i:before {
    font-size: min(calc(16 / 1920 * 100vw), 1rem);
    padding-bottom: min(calc(5 / 1920 * 100vw), 0.3125rem);
  }
}
.halloween_ranking_item li:nth-child(1) i {
  background-color: #d4c018;
}
.halloween_ranking_item li:nth-child(2) i {
  background-color: #bababa;
}
.halloween_ranking_item li:nth-child(3) i {
  background-color: #a0662d;
}
.halloween_ranking_item li figure {
  margin-bottom: calc(8 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_ranking_item li figure {
    margin-bottom: min(calc(25 / 1920 * 100vw), 1.5625rem);
  }
}
.halloween_ranking_item li figure img {
  width: 100%;
}
.halloween_ranking_item li h3 {
  font-size: calc(16 / 320 * 100vw);
  font-weight: 700;
  padding-bottom: calc(6 / 320 * 100vw);
  border-bottom: 1px solid #451362;
  margin-bottom: calc(14 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_ranking_item li h3 {
    font-size: min(calc(28 / 1920 * 100vw), 1.75rem);
    padding-bottom: min(calc(15 / 1920 * 100vw), 0.9375rem);
    margin-bottom: min(calc(28 / 1920 * 100vw), 1.75rem);
    border-width: 2px;
  }
}
.halloween_ranking_item li span {
  display: block;
  font-size: calc(19 / 320 * 100vw);
  font-weight: 700;
  line-height: 1;
  margin-bottom: calc(10 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_ranking_item li span {
    font-size: min(calc(33 / 1920 * 100vw), 2.0625rem);
    margin-bottom: min(calc(25 / 1920 * 100vw), 1.5625rem);
  }
}
.halloween_ranking_item li span small {
  font-size: calc(11 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_ranking_item li span small {
    font-size: min(calc(19 / 1920 * 100vw), 1.1875rem);
  }
}
.halloween_ranking_item li p {
  font-size: calc(12 / 320 * 100vw);
  font-weight: 700;
  line-height: 2;
  margin-bottom: calc(25 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_ranking_item li p {
    font-size: min(calc(20 / 1920 * 100vw), 1.25rem);
    margin-bottom: min(calc(40 / 1920 * 100vw), 2.5rem);
    line-height: 1.9;
  }
}
@media screen and (min-width: 769px) {
  .halloween_ranking_item li .halloween_btn {
    margin-top: auto;
  }
}
.halloween_recommend {
  position: relative;
  padding-top: calc(174 / 320 * 100vw);
  background: #fff1dd;
  padding-bottom: calc(100 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_recommend {
    padding-top: min(calc(260 / 1920 * 100vw), 16.25rem);
    padding-bottom: min(calc(200 / 1920 * 100vw), 12.5rem);
  }
}
.halloween_recommend::before {
  content: "";
  width: 100%;
  height: calc(50 / 320 * 100vw);
  background: url(../img/halloween/wave.webp) repeat-x left top/auto calc(50 / 320 * 100vw);
  transform: scale(1, -1);
  position: absolute;
  top: -1px;
  left: 0;
}
@media screen and (min-width: 769px) {
  .halloween_recommend::before {
    height: min(calc(84 / 1920 * 100vw), 5.25rem);
    background-size: auto min(calc(84 / 1920 * 100vw), 5.25rem);
  }
}
.halloween_recommend:after {
  content: "";
  width: calc(280 / 320 * 100vw);
  height: calc(83 / 320 * 100vw);
  background: url(../img/halloween/recommend_deco_sp.svg) no-repeat center/cover;
  pointer-events: none;
  position: absolute;
  top: calc(74 / 320 * 100vw);
  left: calc(20 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_recommend:after {
    width: min(calc(1920 / 1920 * 100vw), 120rem);
    height: min(calc(267 / 1920 * 100vw), 16.6875rem);
    top: min(calc(180 / 1920 * 100vw), 11.25rem);
    left: calc(50% - min(calc(960 / 1920 * 100vw), 60rem));
    background-image: url(../img/halloween/recommend_deco.svg);
  }
}
.halloween_recommend .article_ttl span img {
  width: calc(180 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_recommend .article_ttl span img {
    width: min(calc(578 / 1920 * 100vw), 36.125rem);
  }
}
.halloween_recommend .article_ttl span strong {
  color: #451362;
}
.halloween_recommend_item {
  display: grid;
  row-gap: calc(80 / 320 * 100vw);
  margin-inline: calc(25 / 320 * 100vw);
  margin-top: calc(35 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_recommend_item {
    width: min(calc(1320 / 1920 * 100vw), 82.5rem);
    margin-inline: auto;
    row-gap: min(calc(220 / 1920 * 100vw), 13.75rem);
    margin-top: min(calc(185 / 1920 * 100vw), 11.5625rem);
  }
}
.halloween_recommend_item li:nth-child(odd) figure {
  grid-area: 1/2/2/3;
}
.halloween_recommend_item li:nth-child(even) h3 {
  color: #ff851b;
  background-image: url(../img/halloween/dot.svg);
}
@media screen and (min-width: 769px) {
  .halloween_recommend_item li {
    display: grid;
    grid-template-columns: 1fr min(calc(659 / 1920 * 100vw), 41.1875rem);
    gap: 0 min(calc(78 / 1920 * 100vw), 4.875rem);
    align-items: center;
  }
}
.halloween_recommend_item li:has(> a) {
  display: block;
}
.halloween_recommend_item li > a {
  display: block;
}
@media screen and (min-width: 769px) {
  .halloween_recommend_item li > a {
    display: grid;
    grid-template-columns: 1fr min(calc(659 / 1920 * 100vw), 41.1875rem);
    gap: 0 min(calc(78 / 1920 * 100vw), 4.875rem);
    align-items: center;
  }
}
.halloween_recommend_item figure {
  position: relative;
  margin-bottom: calc(18 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_recommend_item figure {
    margin-bottom: 0;
  }
}
.halloween_recommend_item figure img {
  width: 100%;
}
.halloween_recommend_item h3 {
  font-size: calc(21 / 320 * 100vw);
  font-weight: 700;
  color: #762fa8;
  padding-bottom: calc(5 / 320 * 100vw);
  background: url(../img/halloween/dot_pp_light.svg) repeat-x left bottom 1px/calc(16 / 320 * 100vw) auto;
  font-feature-settings: "palt";
  line-height: 1.5;
  margin-bottom: calc(15 / 320 * 100vw);
  transition: 0.3s;
}
@media screen and (min-width: 769px) {
  .halloween_recommend_item h3 {
    font-size: min(calc(46 / 1920 * 100vw), 2.875rem);
    padding-bottom: min(calc(22 / 1920 * 100vw), 1.375rem);
    margin-bottom: min(calc(40 / 1920 * 100vw), 2.5rem);
    background-size: min(calc(36 / 1920 * 100vw), 2.25rem) auto;
  }
}
.halloween_recommend_item p {
  font-size: calc(11 / 320 * 100vw);
  font-weight: 700;
  line-height: 2;
  margin-bottom: calc(10 / 320 * 100vw);
  font-feature-settings: "palt";
}
@media screen and (min-width: 769px) {
  .halloween_recommend_item p {
    font-size: min(calc(24 / 1920 * 100vw), 1.5rem);
    margin-bottom: min(calc(15 / 1920 * 100vw), 0.9375rem);
  }
}
.halloween_recommend_item :where(span) {
  display: block;
  font-size: calc(18 / 320 * 100vw);
  font-weight: 700;
  margin-bottom: calc(25 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_recommend_item :where(span) {
    font-size: min(calc(40 / 1920 * 100vw), 2.5rem);
    margin-bottom: min(calc(45 / 1920 * 100vw), 2.8125rem);
  }
}
.halloween_recommend_item :where(span) small {
  font-size: calc(11 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_recommend_item :where(span) small {
    font-size: min(calc(23 / 1920 * 100vw), 1.4375rem);
  }
}
@media screen and (min-width: 769px) {
  .halloween_recommend_item .halloween_btn.center {
    margin-inline-start: 0;
  }
}
.halloween_recommend_gift {
  background-color: #fff;
  padding: calc(20 / 320 * 100vw);
  border-radius: 2px;
  margin-top: calc(50 / 320 * 100vw);
  margin-inline: calc(25 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_recommend_gift {
    padding: min(calc(50 / 1920 * 100vw), 3.125rem) min(calc(25 / 1920 * 100vw), 1.5625rem);
    border-radius: 5px;
    margin-top: min(calc(150 / 1920 * 100vw), 9.375rem);
    max-width: min(calc(1200 / 1920 * 100vw), 75rem);
    margin-inline: auto;
    box-sizing: border-box;
  }
}
.halloween_recommend_gift h3 {
  text-align: center;
  font-size: calc(17 / 320 * 100vw);
  margin-bottom: calc(25 / 320 * 100vw);
  color: #451362;
  font-weight: 700;
}
@media screen and (min-width: 769px) {
  .halloween_recommend_gift h3 {
    font-size: min(calc(28 / 1920 * 100vw), 1.75rem);
    margin-bottom: min(calc(54 / 1920 * 100vw), 3.375rem);
  }
}
@media screen and (min-width: 769px) {
  .halloween_recommend_gift_item {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (min-width: 769px) {
  .halloween_recommend_gift dl {
    display: grid;
    grid-template-columns: min(calc(132 / 1920 * 100vw), 8.25rem) 1fr;
    column-gap: min(calc(27 / 1920 * 100vw), 1.6875rem);
    position: relative;
    padding-inline: min(calc(45 / 1920 * 100vw), 2.8125rem);
  }
}
@media screen and (min-width: 769px) {
  .halloween_recommend_gift dl:first-child:after {
    content: "";
    width: 1px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-color: #333;
  }
}
.halloween_recommend_gift dl + dl {
  margin-top: calc(40 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_recommend_gift dl + dl {
    margin-top: 0;
  }
}
.halloween_recommend_gift dl dt {
  text-align: center;
  margin-bottom: calc(25 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_recommend_gift dl dt {
    margin-bottom: 0;
  }
}
.halloween_recommend_gift dl dt img {
  width: calc(132 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_recommend_gift dl dt img {
    width: 100%;
  }
}
.halloween_recommend_gift dl dd h4 {
  text-align: center;
  font-size: calc(16 / 320 * 100vw);
  font-weight: 700;
  margin-bottom: calc(12 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_recommend_gift dl dd h4 {
    font-size: min(calc(21 / 1920 * 100vw), 1.3125rem);
    margin-bottom: min(calc(10 / 1920 * 100vw), 0.625rem);
    text-align: left;
  }
}
.halloween_recommend_gift dl dd p {
  font-size: calc(12 / 320 * 100vw);
  line-height: 2;
  margin-bottom: calc(12 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_recommend_gift dl dd p {
    font-size: min(calc(16 / 1920 * 100vw), 1rem);
    margin-bottom: min(calc(20 / 1920 * 100vw), 1.25rem);
  }
}
.halloween_recommend_gift dl dd a.btn--more {
  margin-inline: auto;
  padding-inline: calc(20 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_recommend_gift dl dd a.btn--more {
    padding-inline: min(calc(2200 / 1920 * 100vw), 137.5rem);
    margin-inline: 0;
    font-size: min(calc(16 / 1920 * 100vw), 1rem);
  }
}
.halloween_recommend_gift a {
  background-color: #762fa8;
  width: calc(133 / 320 * 100vw);
  height: calc(30 / 320 * 100vw);
  color: #fff;
  font-size: calc(13 / 320 * 100vw);
  font-family: "inter" !important;
  font-weight: 400;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-inline: auto;
  border-radius: calc(30 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_recommend_gift a {
    width: min(calc(133 / 1920 * 100vw), 8.3125rem);
    height: min(calc(30 / 1920 * 100vw), 1.875rem);
    font-size: min(calc(13 / 1920 * 100vw), 0.8125rem);
    border-radius: min(calc(30 / 1920 * 100vw), 1.875rem);
    margin-inline-start: 0;
  }
}
@media (hover) {
  .halloween_recommend_gift a:hover {
    background-color: #ff851b;
  }
}
.halloween_limited {
  background: url(../img/halloween/wave.webp) repeat-x left top/auto calc(50 / 320 * 100vw);
  position: relative;
  margin-top: calc(-34 / 320 * 100vw);
  padding-top: calc(60 / 320 * 100vw);
  padding-bottom: calc(40 / 320 * 100vw);
  z-index: 0;
}
@media screen and (min-width: 769px) {
  .halloween_limited {
    background-size: auto min(calc(84 / 1920 * 100vw), 5.25rem);
    margin-top: max(-5.2083333333vw, -6.25rem);
    padding-top: min(calc(182 / 1920 * 100vw), 11.375rem);
    padding-bottom: min(calc(155 / 1920 * 100vw), 9.6875rem);
  }
}
.halloween_limited::before {
  content: "";
  width: 100%;
  height: calc(100% - 40 / 320 * 100vw);
  background-color: #ff851b;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
}
@media screen and (min-width: 769px) {
  .halloween_limited::before {
    height: calc(100% - min(calc(80 / 1920 * 100vw), 5rem));
  }
}
@media screen and (min-width: 769px) {
  .halloween_limited::after {
    content: "";
    position: absolute;
    background-image: url(../img/halloween/limited_deco.svg);
    width: min(calc(314 / 1920 * 100vw), 19.625rem);
    height: min(calc(165 / 1920 * 100vw), 10.3125rem);
    top: min(calc(130 / 1920 * 100vw), 8.125rem);
    left: calc(50% + min(calc(470 / 1920 * 100vw), 29.375rem));
    pointer-events: none;
  }
}
.halloween_limited .article_ttl span img {
  width: calc(202 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_limited .article_ttl span img {
    width: min(calc(648 / 1920 * 100vw), 40.5rem);
  }
}
.halloween_limited .article_ttl span strong {
  color: #451362;
}
.halloween_limited_top {
  margin: 0 calc(25 / 320 * 100vw) calc(40 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_limited_top {
    margin: max(-6.7708333333vw, -8.125rem) 0 0;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    column-gap: min(calc(20 / 1920 * 100vw), 1.25rem);
  }
}
.halloween_limited_top dt {
  margin-bottom: calc(25 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_limited_top dt {
    margin-bottom: 0;
  }
}
.halloween_limited_top dt img {
  width: 100%;
}
@media screen and (min-width: 769px) {
  .halloween_limited_top dt img {
    width: min(calc(760 / 1920 * 100vw), 47.5rem);
  }
}
@media screen and (min-width: 769px) {
  .halloween_limited_top dd {
    padding-bottom: min(calc(95 / 1920 * 100vw), 5.9375rem);
  }
}
.halloween_limited_top dd img {
  width: 100%;
}
@media screen and (min-width: 769px) {
  .halloween_limited_top dd img {
    width: min(calc(786 / 1920 * 100vw), 49.125rem);
  }
}
@media screen and (min-width: 769px) {
  .halloween_limited .halloween_recommend_item {
    margin-top: min(calc(58 / 1920 * 100vw), 3.625rem);
  }
}
.halloween_limited .halloween_recommend_item .icon-soldout {
  background-color: #762fa8;
}
.halloween_limited .halloween_recommend_item h3 {
  color: #451362;
  background-image: url(../img/halloween/dot_pp.svg);
}
.halloween_limited .halloween_recommend_item p {
  color: #451362;
}
.halloween_reserch {
  position: relative;
  padding-top: calc(174 / 320 * 100vw);
  background: #451362;
  padding-bottom: calc(60 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_reserch {
    padding-top: min(calc(260 / 1920 * 100vw), 16.25rem);
    padding-bottom: min(calc(200 / 1920 * 100vw), 12.5rem);
  }
}
.halloween_reserch::before {
  content: "";
  width: 100%;
  height: calc(50 / 320 * 100vw);
  background: url(../img/halloween/wave.webp) repeat-x left top/auto calc(50 / 320 * 100vw);
  transform: scale(1, -1);
  position: absolute;
  top: -1px;
  left: 0;
}
@media screen and (min-width: 769px) {
  .halloween_reserch::before {
    height: min(calc(84 / 1920 * 100vw), 5.25rem);
    background-size: auto min(calc(84 / 1920 * 100vw), 5.25rem);
  }
}
.halloween_reserch:after {
  content: "";
  width: calc(320 / 320 * 100vw);
  height: calc(84 / 320 * 100vw);
  background: url(../img/halloween/reserch_deco_sp.svg) no-repeat center/cover;
  pointer-events: none;
  position: absolute;
  top: calc(75 / 320 * 100vw);
  left: 0;
}
@media screen and (min-width: 769px) {
  .halloween_reserch:after {
    width: min(calc(1920 / 1920 * 100vw), 120rem);
    height: min(calc(267 / 1920 * 100vw), 16.6875rem);
    top: min(calc(180 / 1920 * 100vw), 11.25rem);
    left: calc(50% - min(calc(960 / 1920 * 100vw), 60rem));
    background-image: url(../img/halloween/reserch_deco.svg);
  }
}
.halloween_reserch .article_ttl span img {
  width: calc(100 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_reserch .article_ttl span img {
    width: min(calc(316 / 1920 * 100vw), 19.75rem);
  }
}
.halloween_reserch .article_ttl span strong {
  color: #ff851b;
}
.halloween_reserch_search {
  margin-inline: calc(25 / 320 * 100vw);
  margin-top: calc(42 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_reserch_search {
    margin-inline: auto;
    margin-top: min(calc(192 / 1920 * 100vw), 12rem);
    width: min(calc(1512 / 1920 * 100vw), 94.5rem);
  }
}
.halloween_reserch_search dt {
  position: relative;
}
.halloween_reserch_search dt::before {
  content: "";
  width: 100%;
  height: 2px;
  background-color: #ff851b;
  position: absolute;
  top: 50%;
  left: 0;
}
.halloween_reserch_search dt span {
  display: inline-block;
  padding-inline-end: calc(10 / 320 * 100vw);
  background-color: #451362;
  position: relative;
}
@media screen and (min-width: 769px) {
  .halloween_reserch_search dt span {
    display: block;
    width: fit-content;
    margin-inline: auto;
    padding-inline: min(calc(100 / 1920 * 100vw), 6.25rem);
  }
}
.halloween_reserch_search dt i {
  position: absolute;
  top: calc(-22 / 320 * 100vw);
  right: 0;
  z-index: 1;
}
@media screen and (min-width: 769px) {
  .halloween_reserch_search dt i {
    top: max(-2.5520833333vw, -3.0625rem);
  }
}
.halloween_reserch_search dt i img {
  width: calc(43 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_reserch_search dt i img {
    width: min(calc(95 / 1920 * 100vw), 5.9375rem);
  }
}
.halloween_reserch_search dd {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(14 / 320 * 100vw);
  margin-top: calc(10 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_reserch_search dd {
    grid-template-columns: repeat(4, 1fr);
    gap: 0 min(calc(44 / 1920 * 100vw), 2.75rem);
    margin-top: min(calc(110 / 1920 * 100vw), 6.875rem);
  }
}
.halloween_reserch_search dd a {
  font-size: calc(11 / 320 * 100vw);
  font-weight: 700;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-feature-settings: "palt";
  position: relative;
  z-index: 0;
  transition: 0.3s;
}
.halloween_reserch_search dd a::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: -1;
}
@media screen and (min-width: 769px) {
  .halloween_reserch_search dd a {
    font-size: min(calc(28 / 1920 * 100vw), 1.75rem);
  }
}
@media (hover) {
  .halloween_reserch_search dd a:hover {
    color: #ff851b;
  }
  .halloween_reserch_search dd a:hover:before {
    animation: nav 0.2s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
  }
}
.halloween_reserch_search.budget dt span img {
  width: calc(115 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_reserch_search.budget dt span img {
    width: min(calc(330 / 1920 * 100vw), 20.625rem);
  }
}
.halloween_reserch_search.budget dd a {
  aspect-ratio: 34/17;
  padding-top: calc(12 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_reserch_search.budget dd a {
    padding-top: min(calc(30 / 1920 * 100vw), 1.875rem);
  }
}
.halloween_reserch_search.budget dd a::before {
  background: url(../img/halloween/search_1.svg) no-repeat center/cover;
}
@media (hover) {
  .halloween_reserch_search.budget dd a:hover::before {
    background: url(../img/halloween/search_1_ov.svg) no-repeat center/cover;
  }
}
.halloween_reserch_search.category dt span img {
  width: calc(162 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_reserch_search.category dt span img {
    width: min(calc(454 / 1920 * 100vw), 28.375rem);
  }
}
.halloween_reserch_search.category dd a {
  aspect-ratio: 340/194;
  padding-top: calc(6 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_reserch_search.category dd a {
    padding-top: min(calc(20 / 1920 * 100vw), 1.25rem);
  }
}
.halloween_reserch_search.category dd a::before {
  background: url(../img/halloween/search_2.svg) no-repeat center/cover;
}
@media (hover) {
  .halloween_reserch_search.category dd a:hover::before {
    background: url(../img/halloween/search_2_ov.svg) no-repeat center/cover;
  }
}
.halloween_lineup {
  position: relative;
  padding-top: calc(115 / 320 * 100vw);
  background: #fff1dd;
  padding-bottom: calc(80 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_lineup {
    padding-top: min(calc(200 / 1920 * 100vw), 12.5rem);
    padding-bottom: min(calc(260 / 1920 * 100vw), 16.25rem);
  }
}
.halloween_lineup:after {
  content: "";
  width: calc(280 / 320 * 100vw);
  height: calc(83 / 320 * 100vw);
  background: url(../img/halloween/recommend_deco_sp.svg) no-repeat center/cover;
  pointer-events: none;
  position: absolute;
  top: calc(18 / 320 * 100vw);
  left: calc(20 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_lineup:after {
    width: min(calc(1920 / 1920 * 100vw), 120rem);
    height: min(calc(267 / 1920 * 100vw), 16.6875rem);
    top: min(calc(135 / 1920 * 100vw), 8.4375rem);
    left: calc(50% - min(calc(960 / 1920 * 100vw), 60rem));
    background-image: url(../img/halloween/recommend_deco.svg);
  }
}
.halloween_lineup .article_ttl span img {
  width: calc(92 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_lineup .article_ttl span img {
    width: min(calc(300 / 1920 * 100vw), 18.75rem);
  }
}
.halloween_lineup .article_ttl span strong {
  color: #451362;
}
.halloween_lineup_block {
  margin-inline: calc(25 / 320 * 100vw);
  margin-top: calc(38 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_lineup_block {
    margin-top: min(calc(150 / 1920 * 100vw), 9.375rem);
  }
}
.halloween_lineup_block:first-of-type {
  margin-top: min(calc(200 / 1920 * 100vw), 12.5rem);
}
.halloween_lineup_block_ttl {
  display: flex;
  flex-direction: column;
  margin-bottom: calc(12 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_lineup_block_ttl {
    margin-bottom: min(calc(30 / 1920 * 100vw), 1.875rem);
  }
}
.halloween_lineup_block_ttl strong {
  font-size: calc(12 / 320 * 100vw);
  font-weight: 700;
}
@media screen and (min-width: 769px) {
  .halloween_lineup_block_ttl strong {
    font-size: min(calc(28 / 1920 * 100vw), 1.75rem);
  }
}
.halloween_lineup_block_ttl span {
  font-family: "inter" !important;
  font-size: calc(32 / 320 * 100vw);
  font-weight: 400;
  line-height: 1.2;
}
@media screen and (min-width: 769px) {
  .halloween_lineup_block_ttl span {
    font-size: min(calc(85 / 1920 * 100vw), 5.3125rem);
  }
}
.halloween_lineup_block_lead {
  font-size: calc(10 / 320 * 100vw);
  line-height: 1.7;
}
@media screen and (min-width: 769px) {
  .halloween_lineup_block_lead {
    font-size: min(calc(26 / 1920 * 100vw), 1.625rem);
  }
}
.halloween_lineup_slider {
  margin-top: calc(38 / 320 * 100vw);
  padding-top: calc(15 / 320 * 100vw);
  border-top: 1.5px solid #333;
}
@media screen and (min-width: 769px) {
  .halloween_lineup_slider {
    margin-top: min(calc(70 / 1920 * 100vw), 4.375rem);
    padding-top: min(calc(40 / 1920 * 100vw), 2.5rem);
  }
}
.halloween_lineup_slider .splide__track {
  overflow: visible !important;
}
.halloween_lineup_slider .splide__slide {
  width: calc(117 / 320 * 100vw) !important;
}
@media screen and (min-width: 769px) {
  .halloween_lineup_slider .splide__slide {
    width: min(calc(315 / 1920 * 100vw), 19.6875rem) !important;
  }
}
.halloween_lineup_slider .splide__slide a {
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: 0.3s;
}
@media (hover) {
  .halloween_lineup_slider .splide__slide a:hover {
    opacity: 1;
  }
  .halloween_lineup_slider .splide__slide a:hover .btn--more {
    background-color: #762fa8;
    border-color: #762fa8;
    color: #fff;
  }
}
.halloween_lineup_slider .splide__slide figure {
  position: relative;
}
.halloween_lineup_slider .splide__slide figure img {
  width: 100%;
}
.halloween_lineup_slider .splide__slide .tag {
  display: flex;
  flex-wrap: wrap;
  gap: calc(5 / 320 * 100vw);
  margin-bottom: calc(5 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_lineup_slider .splide__slide .tag {
    gap: min(calc(10 / 1920 * 100vw), 0.625rem);
    margin-bottom: min(calc(10 / 1920 * 100vw), 0.625rem);
  }
}
.halloween_lineup_slider .splide__slide .tag span {
  font-size: calc(8 / 320 * 100vw);
  background-color: #808080;
  color: #fff;
  padding: calc(2 / 320 * 100vw) calc(5 / 320 * 100vw);
  border-radius: 2px;
}
@media screen and (min-width: 769px) {
  .halloween_lineup_slider .splide__slide .tag span {
    font-size: min(calc(17 / 1920 * 100vw), 1.0625rem);
    padding: min(calc(5 / 1920 * 100vw), 0.3125rem) min(calc(10 / 1920 * 100vw), 0.625rem) min(calc(3 / 1920 * 100vw), 0.1875rem);
  }
}
.halloween_lineup_slider .splide__slide h4 {
  font-size: calc(12 / 320 * 100vw);
  font-weight: 700;
  margin-top: calc(8 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_lineup_slider .splide__slide h4 {
    font-size: min(calc(21 / 1920 * 100vw), 1.3125rem);
    margin-top: min(calc(15 / 1920 * 100vw), 0.9375rem);
  }
}
.halloween_lineup_slider .splide__slide p {
  font-size: calc(13 / 320 * 100vw);
  margin-block: calc(5 / 320 * 100vw);
  line-height: 1;
}
@media screen and (min-width: 769px) {
  .halloween_lineup_slider .splide__slide p {
    font-size: min(calc(24 / 1920 * 100vw), 1.5rem);
    margin-block: min(calc(10 / 1920 * 100vw), 0.625rem);
  }
}
.halloween_lineup_slider .splide__slide p small {
  font-size: calc(9 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_lineup_slider .splide__slide p small {
    font-size: min(calc(14 / 1920 * 100vw), 0.875rem);
  }
}
@media screen and (max-width: 768px) {
  .halloween_lineup_slider .splide__slide .btn--more {
    margin-top: auto;
  }
}
.halloween_campaign {
  background: url(../img/halloween/wave_pp.webp) repeat-x left top/auto calc(50 / 320 * 100vw);
  position: relative;
  margin-top: calc(-34 / 320 * 100vw);
  padding-top: calc(52 / 320 * 100vw);
  padding-bottom: calc(110 / 320 * 100vw);
  z-index: 0;
}
@media screen and (min-width: 769px) {
  .halloween_campaign {
    background-size: auto min(calc(84 / 1920 * 100vw), 5.25rem);
    margin-top: max(-5.2083333333vw, -6.25rem);
    padding-top: min(calc(182 / 1920 * 100vw), 11.375rem);
    padding-bottom: min(calc(286 / 1920 * 100vw), 17.875rem);
  }
}
.halloween_campaign::before {
  content: "";
  width: 100%;
  height: calc(100% - 40 / 320 * 100vw);
  background-color: #762fa8;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
}
@media screen and (min-width: 769px) {
  .halloween_campaign::before {
    height: calc(100% - min(calc(80 / 1920 * 100vw), 5rem));
  }
}
.halloween_campaign .article_ttl span img {
  width: calc(254 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign .article_ttl span img {
    width: min(calc(824 / 1920 * 100vw), 51.5rem);
  }
}
.halloween_campaign .article_ttl span strong {
  color: #ff851b;
}
.halloween_campaign1 {
  margin-top: calc(30 / 320 * 100vw);
  margin-inline: calc(25 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign1 {
    margin-top: min(calc(70 / 1920 * 100vw), 4.375rem);
  }
}
.halloween_campaign1 h3 {
  text-align: center;
  margin-bottom: calc(10 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign1 h3 {
    margin-bottom: min(calc(65 / 1920 * 100vw), 4.0625rem);
  }
}
.halloween_campaign1 h3 img {
  width: calc(234 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign1 h3 img {
    width: min(calc(1698 / 1920 * 100vw), 106.125rem);
  }
}
.halloween_campaign1_col {
  text-align: center;
  margin-bottom: calc(45 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign1_col {
    width: fit-content;
    margin-inline: auto;
    margin-bottom: min(calc(110 / 1920 * 100vw), 6.875rem);
    display: grid;
    grid-template-columns: min(calc(642 / 1920 * 100vw), 40.125rem) min(calc(831 / 1920 * 100vw), 51.9375rem);
    align-items: center;
    column-gap: min(calc(15 / 1920 * 100vw), 0.9375rem);
  }
}
.halloween_campaign1_col dt {
  margin-bottom: calc(20 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign1_col dt {
    margin-bottom: 0;
  }
}
.halloween_campaign1_col dt img {
  width: calc(225 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign1_col dt img {
    width: 100%;
  }
}
.halloween_campaign1_col dd img {
  width: 100%;
}
.halloween_campaign1 .halloween_campaign_detail {
  position: relative;
}
.halloween_campaign1 .halloween_campaign_detail::before {
  content: "";
  width: calc(255 / 320 * 100vw);
  height: calc(50 / 320 * 100vw);
  background: url(../img/halloween/campaign_ghost_sp.svg) no-repeat center/cover;
  position: absolute;
  top: calc(-25 / 320 * 100vw);
  left: calc(6 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign1 .halloween_campaign_detail::before {
    width: min(calc(1372 / 1920 * 100vw), 85.75rem);
    height: min(calc(306 / 1920 * 100vw), 19.125rem);
    background-image: url(../img/halloween/campaign_ghost.svg);
    top: min(calc(45 / 1920 * 100vw), 2.8125rem);
    left: max(-5vw, -6rem);
  }
}
.halloween_campaign1 .halloween_campaign_detail dt img {
  width: calc(205 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign1 .halloween_campaign_detail dt img {
    width: min(calc(897 / 1920 * 100vw), 56.0625rem);
  }
}
.halloween_campaign2 {
  margin-top: calc(50 / 320 * 100vw);
  margin-inline: calc(25 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign2 {
    margin-top: min(calc(165 / 1920 * 100vw), 10.3125rem);
    margin-inline: auto;
  }
}
.halloween_campaign2 h3 {
  text-align: center;
  margin-bottom: calc(27 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign2 h3 {
    margin-bottom: min(calc(100 / 1920 * 100vw), 6.25rem);
  }
}
.halloween_campaign2 h3 img {
  width: calc(230 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign2 h3 img {
    width: min(calc(1487 / 1920 * 100vw), 92.9375rem);
  }
}
.halloween_campaign2_col {
  text-align: center;
  margin-bottom: calc(45 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign2_col {
    margin-bottom: min(calc(98 / 1920 * 100vw), 6.125rem);
    display: grid;
    grid-template-columns: min(calc(524 / 1920 * 100vw), 32.75rem) min(calc(831 / 1920 * 100vw), 51.9375rem);
    column-gap: min(calc(60 / 1920 * 100vw), 3.75rem);
    align-items: center;
    width: fit-content;
    margin-inline: auto;
  }
}
.halloween_campaign2_col dt {
  margin-bottom: calc(30 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign2_col dt {
    margin-bottom: 0;
  }
}
.halloween_campaign2_col dt img {
  width: calc(218 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign2_col dt img {
    width: 100%;
  }
}
.halloween_campaign2_col dd img {
  width: 100%;
}
.halloween_campaign2 .halloween_campaign_detail {
  position: relative;
}
.halloween_campaign2 .halloween_campaign_detail::before {
  content: "";
  width: calc(255 / 320 * 100vw);
  height: calc(40 / 320 * 100vw);
  background: url(../img/halloween/campaign_bat_sp.svg) no-repeat center/cover;
  position: absolute;
  top: calc(-20 / 320 * 100vw);
  left: calc(6 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign2 .halloween_campaign_detail::before {
    width: min(calc(1500 / 1920 * 100vw), 93.75rem);
    height: min(calc(300 / 1920 * 100vw), 18.75rem);
    background-image: url(../img/halloween/campaign_bat.svg);
    top: min(calc(55 / 1920 * 100vw), 3.4375rem);
    left: max(min(calc(-97 / 1920 * 100vw), -6.0625rem), -6.0625rem);
  }
}
.halloween_campaign2 .halloween_campaign_detail dt img {
  width: calc(204 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign2 .halloween_campaign_detail dt img {
    width: min(calc(810 / 1920 * 100vw), 50.625rem);
  }
}
.halloween_campaign2 .halloween_btn.light {
  background-color: #fff;
  color: #451362;
  width: calc(258 / 320 * 100vw);
  margin: calc(25 / 320 * 100vw) auto 0;
  font-feature-settings: "palt";
}
@media screen and (min-width: 769px) {
  .halloween_campaign2 .halloween_btn.light {
    width: min(calc(618 / 1920 * 100vw), 38.625rem);
    margin: min(calc(70 / 1920 * 100vw), 4.375rem) auto 0;
    height: min(calc(105 / 1920 * 100vw), 6.5625rem);
    font-size: min(calc(34 / 1920 * 100vw), 2.125rem);
  }
}
@media (hover) {
  .halloween_campaign2 .halloween_btn.light:hover {
    background-color: #ff851b;
    color: #fff;
  }
  .halloween_campaign2 .halloween_btn.light:hover:after {
    background-image: url(../img/halloween/arrow.svg);
  }
}
.halloween_campaign2 .halloween_btn.light:after {
  background-image: url(../img/halloween/arrow_ov.svg);
}
.halloween_campaign_detail {
  position: relative;
}
@media screen and (min-width: 769px) {
  .halloween_campaign_detail {
    width: min(calc(1200 / 1920 * 100vw), 75rem);
    margin-inline: auto;
  }
}
.halloween_campaign_detail dt {
  background-color: #ff851b;
  color: #451362;
  text-align: center;
  padding: calc(12 / 320 * 100vw) 0;
  text-align: center;
}
@media screen and (min-width: 769px) {
  .halloween_campaign_detail dt {
    padding: min(calc(36 / 1920 * 100vw), 2.25rem) 0;
  }
}
.halloween_campaign_detail dd {
  background-color: #451362;
  color: #fff;
  padding: calc(18 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign_detail dd {
    padding: min(calc(70 / 1920 * 100vw), 4.375rem) min(calc(70 / 1920 * 100vw), 4.375rem) min(calc(85 / 1920 * 100vw), 5.3125rem);
  }
}
@media screen and (min-width: 769px) {
  .halloween_campaign_detail dd ul {
    width: fit-content;
    margin-inline: auto;
  }
}
.halloween_campaign_detail dd li {
  display: grid;
  grid-template-columns: calc(50 / 320 * 100vw) 1fr;
  column-gap: calc(12 / 320 * 100vw);
  align-items: flex-start;
}
@media screen and (min-width: 769px) {
  .halloween_campaign_detail dd li {
    grid-template-columns: min(calc(120 / 1920 * 100vw), 7.5rem) 1fr;
    column-gap: min(calc(20 / 1920 * 100vw), 1.25rem);
  }
}
.halloween_campaign_detail dd li + li {
  margin-top: calc(15 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign_detail dd li + li {
    margin-top: min(calc(34 / 1920 * 100vw), 2.125rem);
  }
}
.halloween_campaign_detail dd li span {
  font-size: calc(8 / 320 * 100vw);
  font-weight: 700;
  line-height: calc(15 / 320 * 100vw);
  width: 100%;
  background-color: #ff851b;
  height: calc(15 / 320 * 100vw);
  text-align: center;
  border-radius: calc(15 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign_detail dd li span {
    font-size: min(calc(18 / 1920 * 100vw), 1.125rem);
    line-height: min(calc(36 / 1920 * 100vw), 2.25rem);
    height: min(calc(36 / 1920 * 100vw), 2.25rem);
    border-radius: min(calc(36 / 1920 * 100vw), 2.25rem);
  }
}
.halloween_campaign_detail dd li strong {
  font-size: calc(11 / 320 * 100vw);
  font-weight: 700;
  font-feature-settings: "palt";
  line-height: 1.6;
}
@media screen and (min-width: 769px) {
  .halloween_campaign_detail dd li strong {
    font-size: min(calc(28 / 1920 * 100vw), 1.75rem);
  }
}
.halloween_campaign_detail dd li strong small {
  font-size: calc(8 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign_detail dd li strong small {
    font-size: min(calc(28 / 1920 * 100vw), 1.75rem);
  }
}
.halloween_campaign_detail dd p {
  margin-top: calc(18 / 320 * 100vw);
  border: 2px solid #fff;
  font-size: calc(8 / 320 * 100vw);
  padding: calc(10 / 320 * 100vw) calc(12 / 320 * 100vw);
  font-weight: 700;
}
@media screen and (min-width: 769px) {
  .halloween_campaign_detail dd p {
    font-size: min(calc(21 / 1920 * 100vw), 1.3125rem);
    margin-top: min(calc(64 / 1920 * 100vw), 4rem);
    padding: min(calc(40 / 1920 * 100vw), 2.5rem) min(calc(20 / 1920 * 100vw), 1.25rem);
    text-align: center;
  }
}
.halloween_campaign_detail dd p span {
  display: block;
  position: relative;
  padding-left: 1.1em;
}
@media screen and (min-width: 769px) {
  .halloween_campaign_detail dd p span {
    width: fit-content;
    margin-inline: auto;
  }
}
.halloween_campaign_detail dd p span + span {
  margin-top: calc(5 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_campaign_detail dd p span + span {
    margin-top: min(calc(10 / 1920 * 100vw), 0.625rem);
  }
}
.halloween_campaign_detail dd p span::before {
  content: "※";
  position: absolute;
  top: 0;
  left: 0;
}
.halloween_campaign_detail dd p span b {
  color: #ff851b;
}

.halloween_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: calc(222 / 320 * 100vw);
  height: calc(40 / 320 * 100vw);
  color: #fff;
  background-color: #762fa8;
  border-radius: calc(40 / 320 * 100vw);
  position: relative;
  filter: drop-shadow(0 3px 0 #451362);
  font-size: calc(14 / 320 * 100vw);
  letter-spacing: 0.07em;
  font-weight: 700;
  border: 2px solid #762fa8;
  transition: 0.3s;
}
@media screen and (min-width: 769px) {
  .halloween_btn {
    width: min(calc(384 / 1920 * 100vw), 24rem);
    height: min(calc(70 / 1920 * 100vw), 4.375rem);
    font-size: min(calc(24 / 1920 * 100vw), 1.5rem);
    border-radius: min(calc(70 / 1920 * 100vw), 4.375rem);
  }
}
.halloween_btn:after {
  content: "";
  width: calc(17 / 320 * 100vw);
  height: calc(17 / 320 * 100vw);
  background: url(../img/halloween/arrow.svg) no-repeat center/cover;
  position: absolute;
  right: calc(18 / 320 * 100vw);
  top: calc(50% - 8.5 / 320 * 100vw);
  transition: 0.3s;
}
@media screen and (min-width: 769px) {
  .halloween_btn:after {
    width: min(calc(30 / 1920 * 100vw), 1.875rem);
    height: min(calc(30 / 1920 * 100vw), 1.875rem);
    right: min(calc(32 / 1920 * 100vw), 2rem);
    top: calc(50% - min(calc(15 / 1920 * 100vw), 0.9375rem));
  }
}
.halloween_btn.center {
  margin-inline: auto;
}
.halloween_btn.light {
  background-color: #ff851b;
  color: #fff;
  filter: drop-shadow(0 3px 0 #cc631d);
  border-color: #ff851b;
}
.halloween_btn.light:after {
  background-image: url(../img/halloween/arrow_ov_pp.svg);
}
.halloween_btn.ssize {
  max-width: 100%;
  width: calc(130 / 320 * 100vw);
  height: calc(24 / 320 * 100vw);
  border-radius: calc(24 / 320 * 100vw);
  font-size: calc(9 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .halloween_btn.ssize {
    width: min(calc(284 / 1920 * 100vw), 17.75rem);
    height: min(calc(50 / 1920 * 100vw), 3.125rem);
    font-size: min(calc(19 / 1920 * 100vw), 1.1875rem);
    border-radius: calc(50 / 320 * 100vw);
  }
}
.halloween_btn.ssize:after {
  width: calc(10 / 320 * 100vw);
  height: calc(10 / 320 * 100vw);
  right: calc(10 / 320 * 100vw);
  top: calc(50% - 5 / 320 * 100vw);
  transition: 0.3s;
}
@media screen and (min-width: 769px) {
  .halloween_btn.ssize:after {
    width: min(calc(24 / 1920 * 100vw), 1.5rem);
    height: min(calc(24 / 1920 * 100vw), 1.5rem);
    right: min(calc(24 / 1920 * 100vw), 1.5rem);
    top: calc(50% - min(calc(12 / 1920 * 100vw), 0.75rem));
  }
}

@media (hover) {
  a:hover {
    opacity: 1 !important;
  }
  a:hover .halloween_btn {
    background-color: #fff;
    opacity: 1 !important;
    color: #451362;
  }
  a:hover .halloween_btn:after {
    background-image: url(../img/halloween/arrow_ov.svg);
  }
  a:hover .halloween_btn.light {
    background-color: #fff;
    color: #ff851b;
  }
  a:hover .halloween_btn.light:after {
    background-image: url(../img/halloween/arrow_ov.svg);
  }
}

@media (hover) {
  a.halloween_btn:hover {
    background-color: #fff;
    opacity: 1 !important;
    color: #451362;
  }
  a.halloween_btn:hover:after {
    background-image: url(../img/halloween/arrow_ov.svg);
  }
}
@media (hover) {
  a.halloween_btn.light:hover {
    background-color: #fff;
    color: #ff851b;
  }
  a.halloween_btn.light:hover:after {
    background-image: url(../img/halloween/arrow_ov.svg);
  }
}

.article_ttl {
  text-align: center;
  width: fit-content;
  margin-inline: auto;
  margin-bottom: 0 !important;
}
.article_ttl span {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.article_ttl strong {
  font-size: calc(13 / 320 * 100vw);
  font-weight: 700;
  line-height: 1;
  padding-top: calc(12 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .article_ttl strong {
    font-size: min(calc(31 / 1920 * 100vw), 1.9375rem);
    padding-top: min(calc(25 / 1920 * 100vw), 1.5625rem);
  }
}

.icon-ttl {
  width: calc(108 / 320 * 100vw);
  aspect-ratio: 262/136;
  font-size: calc(10 / 320 * 100vw);
  font-weight: 800;
  font-family: "inter", "Zen Kaku Gothic New" !important;
  line-height: 1;
  background: url(../img/halloween/photo_badge.svg) no-repeat center/cover;
  color: orange;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: calc(12 / 320 * 100vw);
  transform: rotate(8deg);
  position: absolute;
  top: calc(-26 / 320 * 100vw);
  right: calc(-15 / 320 * 100vw);
  z-index: 1;
  margin: 0;
}
@media screen and (min-width: 769px) {
  .icon-ttl {
    width: min(calc(262 / 1920 * 100vw), 16.375rem);
    font-size: min(calc(25 / 1920 * 100vw), 1.5625rem);
    padding-top: min(calc(24 / 1920 * 100vw), 1.5rem);
    top: max(-3.3854166667vw, -4.0625rem);
    right: max(-2.34375vw, -2.8125rem);
  }
}
.icon-soldout {
  font-size: calc(13 / 320 * 100vw);
  font-family: "Gill Sans", "Gill Sans MT", sans-serif !important;
  font-weight: 400;
  background-color: #ff851b;
  color: #fff;
  display: inline-block;
  padding: calc(5 / 320 * 100vw) calc(12 / 320 * 100vw);
  position: absolute;
  top: calc(5 / 320 * 100vw);
  left: calc(5 / 320 * 100vw);
  z-index: 1;
  margin: 0;
  line-height: 1;
}
@media screen and (min-width: 769px) {
  .icon-soldout {
    font-size: min(calc(30 / 1920 * 100vw), 1.875rem);
    padding: min(calc(6 / 1920 * 100vw), 0.375rem) min(calc(22 / 1920 * 100vw), 1.375rem);
    top: min(calc(10 / 1920 * 100vw), 0.625rem);
    left: min(calc(10 / 1920 * 100vw), 0.625rem);
  }
}
.icon-point {
  position: absolute;
  bottom: calc(-10 / 320 * 100vw);
  left: calc(-7 / 320 * 100vw);
  z-index: 1;
  margin: 0;
}
@media screen and (min-width: 769px) {
  .icon-point {
    bottom: max(-1.875vw, -2.25rem);
    left: max(-2.5vw, -3rem);
  }
}
.icon-point img {
  width: calc(60 / 320 * 100vw) !important;
}
@media screen and (min-width: 769px) {
  .icon-point img {
    width: min(calc(143 / 1920 * 100vw), 8.9375rem) !important;
  }
}

.btn_box {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(10 / 320 * 100vw) calc(7 / 320 * 100vw);
  margin-top: calc(30 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .btn_box {
    gap: min(calc(22 / 1920 * 100vw), 1.375rem) min(calc(16 / 1920 * 100vw), 1rem);
    margin-top: min(calc(30 / 1920 * 100vw), 1.875rem);
  }
}

.btn--more {
  width: fit-content;
  font-family: "inter" !important;
  font-weight: 400;
  font-size: calc(10 / 320 * 100vw);
  border: 1.5px solid #ff851b;
  background-color: #ff851b;
  padding-inline: calc(10 / 320 * 100vw);
  line-height: calc(17 / 320 * 100vw);
  color: #fff;
  border-radius: calc(15 / 320 * 100vw);
  margin-top: calc(8 / 320 * 100vw);
  display: block;
}
@media screen and (min-width: 769px) {
  .btn--more {
    font-size: min(calc(18 / 1920 * 100vw), 1.125rem);
    padding-inline: min(calc(18 / 1920 * 100vw), 1.125rem);
    line-height: min(calc(33 / 1920 * 100vw), 2.0625rem);
    border-radius: min(calc(33 / 1920 * 100vw), 2.0625rem);
    margin-top: min(calc(14 / 1920 * 100vw), 0.875rem);
  }
}

.soldout {
  display: inline-block;
  background-color: #b93228;
  color: #fff;
  font-size: calc(8 / 320 * 100vw);
  padding: calc(2 / 320 * 100vw) calc(5 / 320 * 100vw);
  position: absolute;
  top: calc(5 / 320 * 100vw);
  left: calc(5 / 320 * 100vw);
  line-height: 1;
}
@media screen and (min-width: 769px) {
  .soldout {
    font-size: min(calc(18 / 1920 * 100vw), 1.125rem);
    padding: min(calc(5 / 1920 * 100vw), 0.3125rem) min(calc(5 / 1920 * 100vw), 0.3125rem) min(calc(3 / 1920 * 100vw), 0.1875rem);
    top: min(calc(10 / 1920 * 100vw), 0.625rem);
    left: min(calc(10 / 1920 * 100vw), 0.625rem);
  }
}

.noshi {
  display: inline-block;
  background-color: #808080;
  color: #fff;
  font-size: calc(8 / 320 * 100vw);
  padding: calc(2 / 320 * 100vw) calc(5 / 320 * 100vw);
  position: absolute;
  bottom: 0;
  left: 0;
  line-height: 1;
}
@media screen and (min-width: 769px) {
  .noshi {
    font-size: min(calc(18 / 1920 * 100vw), 1.125rem);
    padding: min(calc(6 / 1920 * 100vw), 0.375rem) min(calc(5 / 1920 * 100vw), 0.3125rem) min(calc(3 / 1920 * 100vw), 0.1875rem);
  }
}

.splide__arrows {
  display: flex;
  justify-content: flex-end;
  position: absolute;
  width: 100%;
  top: auto;
  bottom: calc(100% + 6 / 320 * 100vw);
  right: 0;
  padding-right: calc(10 / 320 * 100vw);
}
@media screen and (min-width: 769px) {
  .splide__arrows {
    bottom: calc(100% + min(calc(15 / 1920 * 100vw), 0.9375rem));
    padding-right: min(calc(30 / 1920 * 100vw), 1.875rem);
  }
}

.splide__arrow {
  width: calc(20 / 320 * 100vw);
  height: calc(20 / 320 * 100vw);
  background-color: transparent;
  border-radius: 50%;
  border: 1.5px solid #333;
  position: static;
  margin: 0 calc(5 / 320 * 100vw);
  transform: none;
}
@media screen and (min-width: 769px) {
  .splide__arrow {
    width: min(calc(40 / 1920 * 100vw), 2.5rem);
    height: min(calc(40 / 1920 * 100vw), 2.5rem);
    margin: 0 min(calc(12 / 1920 * 100vw), 0.75rem);
  }
}
.splide__arrow svg {
  width: 100%;
  height: auto;
}

.slide-count-1 .splide__arrows, .slide-count-2 .splide__arrows {
  display: none !important;
}

@media screen and (min-width: 769px) {
  .slide-count-3 .splide__arrows, .slide-count-4 .splide__arrows {
    display: none !important;
  }
}

@keyframes nav {
  0% {
    transform: rotate(0);
  }
  40% {
    transform: rotate(10deg);
  }
  80% {
    transform: rotate(-8deg);
  }
  100% {
    transform: rotate(0);
  }
}
@keyframes ghost {
  0% {
    transform: translateY(0);
    opacity: 0;
  }
  30% {
    opacity: 0;
  }
  70% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateY(2rem);
  }
}
@keyframes ghost2 {
  0% {
    transform: translate(0);
    opacity: 0;
  }
  30% {
    opacity: 0;
  }
  70% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translate(1rem, 1rem);
  }
}
@keyframes opacity {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
footer {
  margin-top: 0;
}/*# sourceMappingURL=halloween.css.map */