@charset "UTF-8";
/* =======================================================
common
======================================================= */
.c-top__section {
  --_color: #333;
  --_font-size: calc(17 * var(--scale) * var(--to-rem));
  font-size: var(--_font-size);
  font-weight: 400;
  line-height: 1.5;
  color: var(--_color);
  letter-spacing: 0.04em;
  line-break: strict; /* 禁則処理を厳格に適用 */
  word-break: normal; /* 単語の分割はデフォルトに依存 */
  overflow-wrap: anywhere; /* 収まらない場合に折り返す */
}
.c-top__ttl {
  --_font-size: calc(32 * var(--scale) * var(--to-rem));
  --_padding-bottom: calc(10 * var(--scale) * var(--to-rem));
  padding-bottom: var(--_padding-bottom);
  font-size: var(--_font-size);
  font-weight: 700;
  line-height: calc(47/32);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  border-bottom: 2px solid #333;
}

#p3 {
  font-weight: 600;
}
#p3 a {
  --_color: #aaa;
  color: var(--_color);
}

/* =======================================================
lead
======================================================= */
.p-lead {
  --_background-color: var(--color-brightest);
  background-color: var(--_background-color);
}
.p-lead__hgroup {
  --_color: var(--color-accent);
  --_margin-bottom: calc(32 * var(--scale) * var(--to-rem));
  margin-bottom: var(--_margin-bottom);
  font-weight: 700;
  color: var(--_color);
  text-align: center;
  letter-spacing: 0.06em;
}
.p-lead__hgroup-ttl {
  --_font-size: calc(32 * var(--scale) * var(--to-rem));
  --_margin-bottom: calc(8 * var(--scale) * var(--to-rem));
  margin-bottom: var(--_margin-bottom);
  font-size: var(--_font-size);
  line-height: calc(47/32);
}
.p-lead__hgroup-txt {
  --_font-size: calc(26 * var(--scale) * var(--to-rem));
  font-size: var(--_font-size);
  line-height: calc(38/26);
}
.p-lead__txt {
  --_font-size: calc(20 * var(--scale) * var(--to-rem));
  --_margin-bottom: calc(16 * var(--scale) * var(--to-rem));
  margin-bottom: var(--_margin-bottom);
  font-size: var(--_font-size);
  font-weight: 700;
  text-align: center;
}
.p-lead__release {
  --_margin-bottom: calc(40 * var(--scale) * var(--to-rem));
  margin-bottom: var(--_margin-bottom);
  text-align: center;
}
.p-lead__product-wrapper {
  --_gap: calc(24 * var(--scale) * var(--to-rem));
  display: block flex;
  flex-wrap: wrap;
  gap: var(--_gap);
  justify-content: center;
}
.p-lead__product {
  width: 100%;
}
@media (width >= 768px) {
  .p-lead__product {
    --_max-width: calc(488 * var(--scale) * var(--to-rem));
    max-width: var(--_max-width);
  }
}
.p-lead__product-box {
  --_background-color: var(--color-main);
  --_padding: calc(32 * var(--scale) * var(--to-rem)) calc(24 * var(--scale) * var(--to-rem)) calc(40 * var(--scale) * var(--to-rem));
  padding: var(--_padding);
  background-color: var(--_background-color);
}
.p-lead__product-box-head {
  --_gap: calc(16 * var(--scale) * var(--to-rem));
  --_margin-bottom: calc(8 * var(--scale) * var(--to-rem));
  display: block grid;
  grid-template-columns: calc(200 * var(--scale) * var(--to-rem)) 1fr;
  gap: var(--_gap);
  margin-bottom: var(--_margin-bottom);
}
.p-lead__product-box-dttl {
  --_color: var(--color-brightest);
  --_font-size: calc(20 * var(--scale) * var(--to-rem));
  --_margin-bottom: calc(8 * var(--scale) * var(--to-rem));
  --_padding-inline: calc(24 * var(--scale) * var(--to-rem));
  display: inline flex;
  padding-inline: var(--_padding-inline);
  margin-bottom: var(--_margin-bottom);
  font-size: var(--_font-size);
  font-weight: 700;
  line-height: calc(29/20);
  color: var(--_color);
}
.p-lead__product-box-ditem {
  --_color: var(--color-brightest);
  color: var(--_color);
}
.p-lead__product-box-ditem-ttl {
  --_margin-bottom: calc(8 * var(--scale) * var(--to-rem));
  margin-bottom: var(--_margin-bottom);
  font-weight: 700;
  line-height: calc(52/34);
}
.p-lead__product-box-ditem-price {
  --_margin-bottom: calc(5 * var(--scale) * var(--to-rem));
  margin-bottom: var(--_margin-bottom);
  font-weight: 700;
}
.p-lead__product-box-ditem-price-num {
  --_font-size: calc(20 * var(--scale) * var(--to-rem));
  font-size: var(--_font-size);
}
.p-lead__product-box-ditem-price-unit {
  --_font-size: calc(16 * var(--scale) * var(--to-rem));
  font-size: var(--_font-size);
}
.p-lead__product-box-ditem .u-att {
  letter-spacing: 0.03em;
}
.p-lead__product-box-btn {
  --_background-color: var(--color-secondary);
  --_color: var(--color-brightest);
  --_font-size: calc(20 * var(--scale) * var(--to-rem));
  --_max-width: calc(212 * var(--scale) * var(--to-rem));
  --_padding-block: calc(10 * var(--scale) * var(--to-rem));
  display: block grid;
  place-content: center;
  width: 100%;
  max-width: var(--_max-width);
  padding-block: calc(var(--_padding-block) - var(--font-base-offset-top)) calc(var(--_padding-block) + var(--font-base-offset-top));
  font-size: var(--_font-size);
  font-weight: 700;
  line-height: calc(29/20);
  color: var(--_color);
  background-color: var(--_background-color);
  border: 1px solid var(--color-primary);
}
.p-lead__product-box-btn:focus-visible {
  background-color: oklch(from var(--_background-color) calc(l + (1 - l) * 0.3) c h);
}
@media (any-hover: hover) {
  .p-lead__product-box-btn:hover {
    background-color: oklch(from var(--_background-color) calc(l + (1 - l) * 0.3) c h);
  }
}
.p-lead__product-box-btn.--amazon {
  --_background-color: var(--color-base);
}
.p-lead__product-box-btn-wrapper {
  --_gap: calc(16 * var(--scale) * var(--to-rem));
  display: block flex;
  flex-wrap: wrap;
  gap: var(--_gap);
  justify-content: center;
}
.p-lead__product-details {
  display: block flex;
  flex-direction: column;
}
.p-lead__product-details-summary {
  --_background-color: var(--color-brightest);
  --_border-radius: 0 0 calc(16 * var(--scale) * var(--to-rem)) calc(16 * var(--scale) * var(--to-rem));
  --_gap: 0.5em;
  --_padding-block: calc(13 * var(--scale) * var(--to-rem));
  display: block flex;
  gap: var(--_gap);
  justify-content: center;
  order: 1;
  padding-block: calc(var(--_padding-block) - var(--font-base-offset-top)) calc(var(--_padding-block) + var(--font-base-offset-top));
  font-weight: 700;
  line-height: calc(25/17);
  color: var(--_color);
  list-style: none;
  background-color: var(--_background-color);
  border: 2px solid var(--color-main);
  border-radius: var(--_border-radius);
}
.p-lead__product-details-summary::-webkit-details-marker {
  display: none;
}
.p-lead__product-details-summary::before {
  content: "詳細を見る";
}
.p-lead__product-details-summary::after {
  content: "▼";
}
.p-lead__product-details-content-inner {
  --_background-color: var(--color-brightest);
  --_padding: calc(24 * var(--scale) * var(--to-rem));
  padding: var(--_padding);
  background-color: var(--_background-color);
  border: 2px solid var(--color-main);
}
.p-lead__product-details-content-ttl {
  --_color: var(--color-accent);
  --_font-size: calc(20 * var(--scale) * var(--to-rem));
  --_margin-block: calc(32 * var(--scale) * var(--to-rem)) calc(16 * var(--scale) * var(--to-rem));
  margin-block: var(--_margin-block);
  font-size: var(--_font-size);
  font-weight: 700;
  line-height: calc(29/20);
  color: var(--_color);
  text-align: center;
}
.p-lead__product-details[open] .p-lead__product-details-summary {
  --_background-color: var(--color-main);
  --_color: var(--color-brightest);
}
.p-lead__product-details[open] .p-lead__product-details-summary::before {
  content: "閉じる";
}
.p-lead__product-details[open] .p-lead__product-details-summary::after {
  content: "▲";
}

/* =======================================================
news
======================================================= */
.p-news {
  --_background-color: var(--color-brightest);
  background-color: var(--_background-color);
}
.p-news .in_area {
  --_padding-top: 0;
  padding-top: var(--_padding-top);
}
.p-news__article-wrapper {
  --_margin-bottom: calc(48 * var(--scale) * var(--to-rem));
  --_margin-top: calc(40 * var(--scale) * var(--to-rem));
  margin-top: var(--_margin-top);
  margin-bottom: var(--_margin-bottom);
}
.p-news__article {
  background-image: repeating-linear-gradient(90deg, #183b67, #183b67 5px, transparent 5px, transparent 10px);
  background-repeat: repeat-x;
  background-position: left bottom;
  background-size: 100% 1px;
}
.p-news__article:not(:first-of-type) .p-news__article-link {
  --_padding-top: calc(16 * var(--scale) * var(--to-rem));
  padding-top: var(--_padding-top);
}
.p-news__article-link {
  --_color: var(--color-base);
  --_gap: calc(24 * var(--scale) * var(--to-rem));
  --_padding-bottom: calc(16 * var(--scale) * var(--to-rem));
  display: block grid;
  grid-template-columns: auto 1fr;
  gap: var(--_gap);
  padding-bottom: var(--_padding-bottom);
  color: var(--_color);
}
.p-news__article-date {
  --_font-size: calc(16 * var(--scale) * var(--to-rem));
  font-size: var(--_font-size);
  line-height: calc(24/16);
}
.p-news__article-ttl {
  line-height: calc(25/17);
}
.p-news .c-btn {
  margin-inline: auto;
}

/* =======================================================
trailer
======================================================= */
.p-trailer {
  --_background-color: var(--color-brightest);
  background-color: var(--_background-color);
}
.p-trailer__ttl {
  --_margin-bottom: calc(32 * var(--scale) * var(--to-rem));
  margin-bottom: var(--_margin-bottom);
}
.p-trailer__movie {
  --_margin-bottom: calc(48 * var(--scale) * var(--to-rem));
  --_max-width: calc(560 * var(--scale) * var(--to-rem));
  max-width: var(--_max-width);
  margin-inline: auto;
  margin-bottom: var(--_margin-bottom);
}
.p-trailer__movie iframe {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  margin-inline: auto;
}
.p-trailer .c-btn {
  margin-inline: auto;
}

/* =======================================================
x
======================================================= */
.p-x {
  --_background-color: var(--color-brightest);
  background-color: var(--_background-color);
}
.p-x .in_area {
  --_padding-bottom: revert;
  padding-bottom: var(--_padding-bottom);
}
.p-x__link {
  display: block flex;
  margin-bottom: 1em;
}
.p-x__imgwrapper {
  display: block flex;
}
.p-x__area {
  --_margin-top: calc(16 * var(--scale) * var(--to-rem));
  max-width: 560px;
  margin-top: var(--_margin-top);
  text-align: center;
}
.p-x__lead {
  --_margin-bottom: calc(24 * var(--scale) * var(--to-rem));
  margin-bottom: var(--_margin-bottom);
}
.p-x .c-btn {
  margin-inline: auto;
}

/* =======================================================
lineup
======================================================= */
.p-lineup {
  --_background-color: var(--color-brightest);
  background-color: var(--_background-color);
}
.p-lineup .in_area {
  --_padding-bottom: revert;
  padding-bottom: var(--_padding-bottom);
}
.p-lineup__ttl {
  --_margin-bottom: calc(40 * var(--scale) * var(--to-rem));
  margin-bottom: var(--_margin-bottom);
}
.p-lineup__article-wrapper {
  --_gap: calc(32 * var(--scale) * var(--to-rem));
  --_margin-bottom: calc(40 * var(--scale) * var(--to-rem));
  display: block grid;
  gap: var(--_gap);
  margin-bottom: var(--_margin-bottom);
}
@media (width >= 768px) {
  .p-lineup__article-wrapper {
    --_columns: 3;
    grid-template-columns: repeat(var(--_columns), 1fr);
  }
}
.p-lineup__article-link {
  display: block flex;
}
@media (width <= 767px) {
  .p-lineup__article-link {
    justify-content: center;
  }
}
.p-lineup__article-link:focus-visible {
  opacity: 0.7;
}
@media (any-hover: hover) {
  .p-lineup__article-link:hover {
    opacity: 0.7;
  }
}
.p-lineup__article-imgouter {
  --_margin-bottom: calc(16 * var(--scale) * var(--to-rem));
  position: relative;
  margin-bottom: var(--_margin-bottom);
}
@media (width <= 767px) {
  .p-lineup__article-imgouter {
    --_max-width: calc(400 * var(--scale) * var(--to-rem));
    max-width: var(--_max-width);
  }
}
.p-lineup__article-imgouter::after {
  position: absolute;
  inset: 0;
  place-content: center;
  content: "";
  border: 1px solid #bababa;
}
.p-lineup__article-imgwrapper {
  display: block flex;
}
.p-lineup__article-head {
  position: absolute;
  top: 0;
  left: 0;
  display: block flex;
  flex-wrap: wrap;
  align-items: center;
}
.p-lineup__article-cat {
  --_font-size: calc(20 * var(--scale) * var(--to-rem));
  --_padding-inline: calc(16 * var(--scale) * var(--to-rem));
  padding-inline: var(--_padding-inline);
  font-size: var(--_font-size);
  font-weight: 700;
  line-height: calc(29/20);
}
.p-lineup__article-kind {
  --_color: var(--color-base);
  --_margin-left: calc(16 * var(--scale) * var(--to-rem));
  margin-left: var(--_margin-left);
  font-weight: 700;
  color: var(--_color);
}
.p-lineup__article-detail {
  --_background-color: #333;
  --_bottom: calc(16 * var(--scale) * var(--to-rem));
  --_color: var(--color-brightest);
  --_font-size: calc(15 * var(--scale) * var(--to-rem));
  --_gap: calc(16 * var(--scale) * var(--to-rem));
  --_padding-block: calc(4 * var(--scale) * var(--to-rem));
  --_padding-inline: calc(16 * var(--scale) * var(--to-rem));
  --_right: calc(16 * var(--scale) * var(--to-rem));
  position: absolute;
  right: var(--_right);
  bottom: var(--_bottom);
  display: block flex;
  gap: var(--_gap);
  align-items: center;
  justify-content: center;
  width: fit-content;
  padding-block: calc(var(--_padding-block) - var(--font-base-offset-top)) calc(var(--_padding-block) + var(--font-base-offset-top));
  padding-inline: var(--_padding-inline);
  font-size: var(--_font-size);
  font-weight: 400;
  color: var(--_color);
  background-color: var(--_background-color);
}
.p-lineup__article-detail::after {
  --_triangle-color: var(--color-brightest);
  --_triangle-height: calc(10 * var(--scale) * var(--to-rem));
  --_triangle-width: calc(8 * var(--scale) * var(--to-rem));
  width: var(--_triangle-width);
  height: var(--_triangle-height);
  content: "";
  background-color: var(--_triangle-color);
  clip-path: polygon(100% 50%, 0% 0%, 0% 100%);
}
.p-lineup__article-def {
  --_color: var(--color-base);
  --_gap: calc(8 * var(--scale) * var(--to-rem));
  --_margin-bottom: calc(8 * var(--scale) * var(--to-rem));
  display: block grid;
  gap: var(--_gap);
  margin-bottom: var(--_margin-bottom);
  color: var(--_color);
}
.p-lineup__article-dttl {
  font-weight: 700;
  line-height: calc(25/17);
}
.p-lineup__article-ditem-price {
  font-weight: 700;
}
.p-lineup__article-ditem-price-num {
  --_font-size: calc(20 * var(--scale) * var(--to-rem));
  font-size: var(--_font-size);
}
.p-lineup__article-ditem-price-unit {
  --_font-size: calc(16 * var(--scale) * var(--to-rem));
  font-size: var(--_font-size);
}
.p-lineup__article-ditem .u-att {
  --_font-size: calc(14 * var(--scale) * var(--to-rem));
  --_margin-top: calc(8 * var(--scale) * var(--to-rem));
  margin-top: var(--_margin-top);
  font-size: var(--_font-size);
}