@charset "UTF-8";
/* ===============
Layout .l-XXX
=============== */
.l-header {
  --color-header: var(--color-brown-dark);
}
[data-mode=dark] .l-header {
  --color-header: var(--color-white);
}

.l-in {
  --contents-color: var(--color-brown-dark);
  width: 100%;
  position: relative;
  margin: 0 auto;
  padding-left: var(--side-width);
  z-index: 0;
  background: var(--color-white);
}
[data-mode=dark] .l-in {
  --contents-color: var(--color-white);
}
@media screen and (max-width: 960px) {
  .l-in {
    padding-left: 0;
    background: var(--color-white);
  }
}
.l-in__bg {
  width: 100%;
  height: var(--winH);
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
  pointer-events: none;
  opacity: 0;
  -webkit-mask: url("../img/common/mask_circle.png") no-repeat center/50% auto;
  mask: url("../img/common/mask_circle.png") no-repeat center/50% auto;
  transition: opacity 0.4s cubic-bezier(0.65, 0, 0.35, 1), -webkit-mask-size 0s linear 0.4s;
  transition: opacity 0.4s cubic-bezier(0.65, 0, 0.35, 1), mask-size 0s linear 0.4s;
  transition: opacity 0.4s cubic-bezier(0.65, 0, 0.35, 1), mask-size 0s linear 0.4s, -webkit-mask-size 0s linear 0.4s;
}
@media screen and (orientation: portrait) {
  .l-in__bg {
    -webkit-mask-size: auto 20%;
    mask-size: auto 20%;
  }
}
@supports (content-visibility: auto) {
  .l-in__bg {
    content-visibility: auto;
  }
}
.is-load .l-in__bg {
  opacity: 1;
  -webkit-mask-size: 200% auto;
  mask-size: 200% auto;
  transition: opacity 0.3s cubic-bezier(0.65, 0, 0.35, 1), -webkit-mask-size 0.6s cubic-bezier(0.5, 1, 0.89, 1);
  transition: opacity 0.3s cubic-bezier(0.65, 0, 0.35, 1), mask-size 0.6s cubic-bezier(0.5, 1, 0.89, 1);
  transition: opacity 0.3s cubic-bezier(0.65, 0, 0.35, 1), mask-size 0.6s cubic-bezier(0.5, 1, 0.89, 1), -webkit-mask-size 0.6s cubic-bezier(0.5, 1, 0.89, 1);
}
@media screen and (orientation: portrait) {
  .is-load .l-in__bg {
    -webkit-mask-size: auto 200%;
    mask-size: auto 200%;
  }
}
.l-in__bg-img {
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}
.l-in__bg-img.-onair {
  background: url("../img/onair/bg_onair_pc.jpg") no-repeat center/cover;
}
@media screen and (orientation: portrait) {
  .l-in__bg-img.-onair {
    background: url("../img/onair/bg_onair_sp.jpg") no-repeat center/cover;
  }
}
.l-in__bg-img.-news {
  background: url("../img/news/bg_news_pc.jpg") no-repeat center/cover;
}
@media screen and (orientation: portrait) {
  .l-in__bg-img.-news {
    background: url("../img/news/bg_news_sp.jpg") no-repeat center/cover;
  }
}
.l-in__bg-img.-intro {
  background: url("../img/intro/bg_intro_pc.jpg") no-repeat center/cover;
}
@media screen and (orientation: portrait) {
  .l-in__bg-img.-intro {
    background: url("../img/intro/bg_intro_sp.jpg") no-repeat center/cover;
  }
}
.l-in__bg-img.-story {
  background: url("../img/story/bg_story_pc.jpg") no-repeat center/cover;
}
@media screen and (orientation: portrait) {
  .l-in__bg-img.-story {
    background: url("../img/story/bg_story_sp.jpg") no-repeat center/cover;
  }
}
.l-in__bg-img.-chara {
  background: url("../img/character/bg_character_pc.jpg") no-repeat center/cover;
}
@media screen and (orientation: portrait) {
  .l-in__bg-img.-chara {
    background: url("../img/character/bg_character_sp.jpg") no-repeat center/cover;
  }
}
.l-in__bg-img.-staff_cast {
  background: url("../img/staffcast/bg_staffcast_pc.jpg") no-repeat center/cover;
}
@media screen and (orientation: portrait) {
  .l-in__bg-img.-staff_cast {
    background: url("../img/staffcast/bg_staffcast_sp.jpg") no-repeat center/cover;
  }
}
.l-in__bg-img.-movie {
  background: url("../img/movie/bg_movie_pc.jpg") no-repeat center/cover;
}
@media screen and (orientation: portrait) {
  .l-in__bg-img.-movie {
    background: url("../img/movie/bg_movie_sp.jpg") no-repeat center/cover;
  }
}
.l-in__bg-img.-music {
  background: url("../img/music/bg_music_pc.jpg") no-repeat center/cover;
}
@media screen and (orientation: portrait) {
  .l-in__bg-img.-music {
    background: url("../img/music/bg_music_sp.jpg") no-repeat center/cover;
  }
}
.l-in__bg-img.-goods {
  background: url("../img/goods/bg_goods_pc.jpg") no-repeat center/cover;
}
@media screen and (orientation: portrait) {
  .l-in__bg-img.-goods {
    background: url("../img/goods/bg_goods_sp.jpg") no-repeat center/cover;
  }
}
.l-in__bg-img.-bd {
  background: url("../img/bd/bg_bd_pc.jpg") no-repeat center/cover;
}
@media screen and (orientation: portrait) {
  .l-in__bg-img.-bd {
    background: url("../img/bd/bg_bd_sp.jpg") no-repeat center/cover;
  }
}
.l-in__bg-img.-books {
  background: url("../img/books/bg_novelbooks_pc.jpg") no-repeat center/cover;
}
@media screen and (orientation: portrait) {
  .l-in__bg-img.-books {
    background: url("../img/books/bg_novelbooks_sp.jpg") no-repeat center/cover;
  }
}
.l-in__container {
  min-height: 100vh;
  display: block;
  position: relative;
  padding: 20rem 0 15rem;
  z-index: 0;
}
@media screen and (max-width: 960px) {
  .l-in__container {
    padding: 12rem 0 6.7rem;
  }
}
.l-in__header {
  width: 100%;
  position: relative;
  margin: 0 auto;
  z-index: 1;
}
.l-in__title {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: grid;
  place-items: center;
  position: relative;
  padding: calc(6.4rem * var(--ratio)) calc(10.4rem * var(--ratio));
  margin: 0 auto;
}
@media screen and (max-width: 960px) {
  .l-in__title {
    padding: 3.2rem 5rem;
  }
}
.l-in__title-deco {
  width: 2.4rem;
  height: 2.4rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity 0.4s cubic-bezier(0.5, 1, 0.89, 1), top 0s linear 0.4s, left 0s linear 0.4s;
}
@media screen and (max-width: 960px) {
  .l-in__title-deco {
    width: 1.8rem;
    height: 1.8rem;
  }
}
.is-load .l-in__title-deco {
  opacity: 1;
  transition: opacity 0.4s cubic-bezier(0.5, 1, 0.89, 1) 0.1s, top 0.8s cubic-bezier(0.65, 0, 0.35, 1), left 0.8s cubic-bezier(0.65, 0, 0.35, 1);
}
.is-load .l-in__title-deco.-deco1 {
  top: 1.2rem;
  left: 1.2rem;
}
@media screen and (max-width: 960px) {
  .is-load .l-in__title-deco.-deco1 {
    top: 0.9rem;
    left: 0.9rem;
  }
}
.is-load .l-in__title-deco.-deco2 {
  top: 1.2rem;
  left: calc(100% - 1.2rem);
}
@media screen and (max-width: 960px) {
  .is-load .l-in__title-deco.-deco2 {
    top: 0.9rem;
    left: calc(100% - 0.9rem);
  }
}
.is-load .l-in__title-deco.-deco3 {
  top: calc(100% - 1.2rem);
  left: 1.2rem;
}
@media screen and (max-width: 960px) {
  .is-load .l-in__title-deco.-deco3 {
    top: calc(100% - 0.9rem);
    left: 0.9rem;
  }
}
.is-load .l-in__title-deco.-deco4 {
  top: calc(100% - 1.2rem);
  left: calc(100% - 1.2rem);
}
@media screen and (max-width: 960px) {
  .is-load .l-in__title-deco.-deco4 {
    top: calc(100% - 0.9rem);
    left: calc(100% - 0.9rem);
  }
}
.l-in__title-deco::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--contents-color);
}
.is-load .l-in__title-deco::before {
  opacity: 0;
  transition: opacity 0.3s cubic-bezier(0.5, 1, 0.89, 1) 0.3s;
}
.l-in__title-deco::after {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  border: 0.5rem solid var(--contents-color);
}
@media screen and (max-width: 960px) {
  .l-in__title-deco::after {
    border-width: 0.3rem;
  }
}
.l-in__title-text {
  display: block;
  position: relative;
  font-size: calc(4rem * var(--ratio));
  font-family: eurostile, toppan-bunkyu-midashi-go-std, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  line-height: 1;
  text-align: center;
  z-index: 1;
  color: var(--contents-color);
  opacity: 0;
  transition: opacity 0.4s cubic-bezier(0.5, 1, 0.89, 1);
}
@media screen and (max-width: 960px) {
  .l-in__title-text {
    font-size: 2.4rem;
  }
}
.is-load .l-in__title-text {
  opacity: 1;
  transition: opacity 0.8s cubic-bezier(0.65, 0, 0.35, 1) 0.2s;
}
.l-in__inner {
  display: block;
  position: relative;
  z-index: 1;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  opacity: 0;
  transition: opacity 0.4s cubic-bezier(0.65, 0, 0.35, 1);
  pointer-events: none;
}
.is-load .l-in__inner {
  opacity: 1;
  pointer-events: all;
}

/* ===============
Object
=============== */
/* ----------
Project .p-XXX
---------- */
.p-news {
  display: block;
  position: relative;
  padding: calc(16.7rem * var(--ratio)) 0 0;
}
@media screen and (max-width: 960px) {
  .p-news {
    padding: 8rem 0 0;
  }
}
.p-news__container {
  width: 90%;
  max-width: 1280px;
  display: block;
  position: relative;
  margin: 0 auto;
  opacity: 0;
  transform: translateY(5rem);
  transition: opacity 0.4s cubic-bezier(0.5, 1, 0.89, 1), transform 0s linear 0.4s;
}
.is-load .p-news__container {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0.4s, transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0.4s;
}
.p-news__inner {
  min-width: 0;
  display: block;
  position: relative;
}
.p-news__list {
  display: block;
  position: relative;
}
.p-news__list-item {
  display: block;
  position: relative;
}
.p-news__list-item::before {
  content: "";
  width: 100%;
  height: 0.4rem;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  border-top: 0.4rem solid var(--color-brown-dark);
}
@media screen and (max-width: 960px) {
  .p-news__list-item::before {
    border-top-width: 0.2rem;
  }
}
.p-news__list-item:last-child::after {
  content: "";
  width: 100%;
  height: 0.4rem;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  border-top: 0.4rem solid var(--color-brown-dark);
}
@media screen and (max-width: 960px) {
  .p-news__list-item:last-child::after {
    border-top-width: 0.2rem;
  }
}
.p-news__footer {
  width: 100%;
  position: relative;
  margin: 5rem auto 0;
}
@media screen and (max-width: 960px) {
  .p-news__footer {
    margin-top: 3.2rem;
  }
}
.p-news__link {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  margin: 0 auto;
}

.p-news_data {
  width: 100%;
  height: calc(17.2rem * var(--ratio));
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  z-index: 0;
}
@media screen and (min-width: 961px) {
  .p-news_data {
    padding: 0 calc(5.6rem * var(--ratio));
  }
}
@media screen and (max-width: 960px) {
  .p-news_data {
    height: calc(9.2rem * var(--ratio));
    padding-right: calc(2rem * var(--ratio));
  }
}
.p-news_data::before {
  content: "";
  width: 0;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  opacity: 0.8;
  background: transparent;
  transition: width 0s linear 0.4s, background-color 0.4s cubic-bezier(0.5, 1, 0.89, 1), opacity 0s linear 0.4s;
}
@media (hover: hover) and (pointer: fine) {
  .p-news_data:hover::before {
    width: 100%;
    left: 0;
    opacity: 0.4;
    background: var(--color-white);
    transition: width 0.4s cubic-bezier(0.5, 1, 0.89, 1), opacity 0.5s cubic-bezier(0.5, 1, 0.89, 1);
  }
}
.p-news_data::after {
  content: "";
  width: 1.2rem;
  height: 1.6rem;
  display: block;
  position: absolute;
  top: 50%;
  right: 0;
  border-top: 0.8rem solid transparent;
  border-left: 1.2rem solid var(--color-brown-dark);
  border-bottom: 0.8rem solid transparent;
  transform: translate(0, -50%);
}
@media screen and (max-width: 960px) {
  .p-news_data::after {
    width: 0.6rem;
    height: 0.8rem;
    border-top-width: 0.4rem;
    border-left-width: 0.6rem;
    border-bottom-width: 0.4rem;
  }
}
.p-news_data__date {
  display: block;
  position: relative;
  margin-right: 6rem;
  overflow: hidden;
}
@media screen and (max-width: 960px) {
  .p-news_data__date {
    margin-right: 3rem;
  }
}
.p-news_data__date-year {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: block;
  position: relative;
  font-size: 1.6rem;
  font-family: eurostile, toppan-bunkyu-midashi-go-std, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  line-height: 1;
}
@media screen and (max-width: 960px) {
  .p-news_data__date-year {
    font-size: 1rem;
  }
}
.p-news_data__date-year::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  bottom: 0.2rem;
  right: -0.1rem;
  border-bottom: 0.2rem solid var(--color-brown-dark);
  transform: translate(100%, 0%);
}
.p-news_data__date-day {
  display: block;
  position: relative;
  font-size: 2.2rem;
  font-family: eurostile, toppan-bunkyu-midashi-go-std, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  line-height: 1;
}
@media screen and (max-width: 960px) {
  .p-news_data__date-day {
    font-size: 1.6rem;
    letter-spacing: 0.05rem;
  }
}
.p-news_data__title {
  flex: 1 1 0;
  min-width: 0;
  display: block;
  position: relative;
  font-size: 1.6rem;
  line-height: 1.5;
  font-weight: 700;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
@media screen and (max-width: 960px) {
  .p-news_data__title {
    font-size: 1.2rem;
  }
}

.p-news_in {
  display: block;
  position: relative;
  padding: calc(16.7rem * var(--ratio)) 0 0;
}
@media screen and (max-width: 960px) {
  .p-news_in {
    padding: 8rem 0 0;
  }
}
.p-news_in__container {
  width: 90%;
  max-width: 1280px;
  display: block;
  position: relative;
  margin: 0 auto;
  opacity: 0;
  transform: translateY(5rem);
  transition: opacity 0.4s cubic-bezier(0.5, 1, 0.89, 1), transform 0s linear 0.4s;
}
.is-load .p-news_in__container {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0.4s, transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0.4s;
}
.p-news_in__inner {
  min-width: 0;
  display: block;
  position: relative;
}
.p-news_in__footer {
  width: 100%;
  position: relative;
  margin: 5rem auto 0;
}
@media screen and (max-width: 960px) {
  .p-news_in__footer {
    margin-top: 3.2rem;
  }
}
.p-news_in__link {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  margin: 0 auto;
}

.p-news_single {
  display: block;
  position: relative;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
}
.p-news_single::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: var(--color-white);
  opacity: 0.5;
}
.p-news_single__container {
  width: 100%;
  display: block;
  position: relative;
  margin: 0 auto;
  padding: 16rem 0;
}
@media screen and (max-width: 960px) {
  .p-news_single__container {
    padding: 6.8rem 0;
  }
}
.p-news_single__header {
  position: absolute;
  top: 0;
  left: 0;
  padding: 3.2rem 2.7rem;
  overflow: hidden;
  color: var(--color-white);
  background: var(--color-brown-dark);
}
@media screen and (max-width: 960px) {
  .p-news_single__header {
    padding: 0.5rem 0.8rem 1rem;
    left: 1.6rem;
  }
}
.p-news_single__date {
  display: block;
  position: relative;
  overflow: hidden;
}
.p-news_single__date-year {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: block;
  position: relative;
  font-size: 1.6rem;
  font-family: eurostile, toppan-bunkyu-midashi-go-std, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  line-height: 1;
}
@media screen and (max-width: 960px) {
  .p-news_single__date-year {
    font-size: 1rem;
  }
}
.p-news_single__date-year::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  bottom: 0.2rem;
  right: -0.1rem;
  border-bottom: 0.2rem solid var(--color-white);
  transform: translate(100%, 0%);
}
.p-news_single__date-day {
  display: block;
  position: relative;
  font-size: 2.2rem;
  font-family: eurostile, toppan-bunkyu-midashi-go-std, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  line-height: 1;
}
@media screen and (max-width: 960px) {
  .p-news_single__date-day {
    font-size: 1.6rem;
    letter-spacing: 0.05rem;
  }
}
.p-news_single__inner {
  width: 90%;
  max-width: 960px;
  position: relative;
  margin: 0 auto;
}
.p-news_single__title {
  display: block;
  position: relative;
  margin-bottom: 6.8rem;
  font-size: 2.4rem;
  line-height: 1.8;
}
@media screen and (max-width: 960px) {
  .p-news_single__title {
    margin-bottom: 2.4rem;
    font-size: 1.8rem;
  }
}
.p-news_single__text {
  display: block;
  position: relative;
  font-size: 1.6rem;
  line-height: 1.8;
}
@media screen and (max-width: 960px) {
  .p-news_single__text {
    font-size: 1.2rem;
  }
}
.p-news_single__text a {
  text-decoration: underline;
}
@media (hover: hover) and (pointer: fine) {
  .p-news_single__text a:hover {
    text-decoration: none;
  }
}
.p-news_single__text img {
  max-width: 100%;
  height: auto !important;
  position: relative;
}
.p-news_single__text p {
  display: block;
  margin: 1em 0;
}
.p-news_single__text iframe {
  max-width: 100%;
}
@supports (aspect-ratio: 16/9) {
  .p-news_single__text iframe {
    width: 100%;
    display: block;
    height: auto !important;
    aspect-ratio: 16/9;
  }
}

.p-music {
  display: block;
  position: relative;
  padding: calc(7.4rem * var(--ratio)) 0 0;
}
@media screen and (max-width: 960px) {
  .p-music {
    padding: 8rem 0 0;
  }
}
.p-music__container {
  width: 90%;
  max-width: 1280px;
  display: block;
  position: relative;
  margin: 0 auto;
  opacity: 0;
  transform: translateY(5rem);
  transition: opacity 0.4s cubic-bezier(0.5, 1, 0.89, 1), transform 0s linear 0.4s;
}
.is-load .p-music__container {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0.4s, transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0.4s;
}
.p-music__header {
  display: block;
  position: relative;
  margin-bottom: 5rem;
}
@media screen and (max-width: 960px) {
  .p-music__header {
    margin-bottom: 2.5rem;
  }
}
.p-music__nav {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-music__nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
  }
  @media not all and (-webkit-min-device-pixel-ratio: 0), not all and (min-resolution: 0.001dpcm) {
    @supports not (translate: none) {
      .p-music__nav {
        margin: 0.5rem 1rem;
      }
    }
  }
}
@media screen and (max-width: 960px) {
  .p-music__nav {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
  }
}
.p-music__nav + .p-music__nav {
  margin-top: 1rem;
}
.p-music__nav-item {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-music__nav-item + .p-music__nav-item {
    margin-left: 1rem;
  }
}
.p-music__btn {
  width: calc(28rem * var(--ratio));
  display: block;
  position: relative;
  color: var(--color-brown-dark);
  background: var(--color-white);
  transition: color 0.2s cubic-bezier(0.5, 1, 0.89, 1), background-color 0.2s cubic-bezier(0.5, 1, 0.89, 1);
}
@media screen and (max-width: 960px) {
  .p-music__btn {
    width: 100%;
  }
}
.is-current .p-music__btn {
  color: var(--color-white);
  background: var(--color-orange);
  pointer-events: none;
}
@media (hover: hover) and (pointer: fine) {
  .p-music__btn:hover {
    color: var(--color-white);
    background: var(--color-brown-dark);
  }
}
.p-music__btn-text {
  display: block;
  position: relative;
  padding: 1.2rem 4rem 1rem;
  font-size: calc(1.8rem * var(--ratio));
  font-weight: 700;
  line-height: 1;
  text-align: center;
}
@media screen and (max-width: 960px) {
  .p-music__btn-text {
    padding: 1rem 1rem 0.8rem;
    font-size: 1.4rem;
  }
}
.p-music__inner {
  min-width: 0;
  display: block;
  position: relative;
}
.p-music__footer {
  width: 100%;
  position: relative;
  margin: 5rem auto 0;
}
@media screen and (max-width: 960px) {
  .p-music__footer {
    margin-top: 3.2rem;
  }
}
.p-music__link {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  margin: 0 auto;
}

.p-music_single {
  display: block;
  position: relative;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  overflow: hidden;
}
.p-music_single::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: var(--color-white);
  opacity: 0.5;
}
.p-music_single__container {
  width: 90%;
  max-width: 1040px;
  display: block;
  position: relative;
  margin: 0 auto;
  padding: 12rem 0;
}
@media screen and (max-width: 960px) {
  .p-music_single__container {
    width: 85%;
    padding: 4.6rem 0;
  }
}
.p-music_single__inner {
  width: 100%;
  position: relative;
  margin: 0 auto;
}
.p-music_single__artist {
  display: block;
  position: relative;
  margin-top: calc(6.5rem * var(--ratio));
}
@media screen and (max-width: 960px) {
  .p-music_single__artist {
    margin-top: 7.2rem;
  }
}
.p-music_single__footer {
  position: relative;
  display: block;
  margin: calc(8rem * var(--ratio)) auto 0;
}
@media screen and (max-width: 960px) {
  .p-music_single__footer {
    margin-top: 5rem;
  }
}
.p-music_single__btn {
  width: 100%;
  height: 11.4rem;
  display: block;
  position: relative;
}
@media screen and (max-width: 960px) {
  .p-music_single__btn {
    height: calc(8rem * var(--ratio));
  }
}
.p-music_single__btn::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: var(--color-brown-dark);
  opacity: 0;
  transition: opacity 0.3s cubic-bezier(0.5, 1, 0.89, 1);
}
@media (hover: hover) and (pointer: fine) {
  .p-music_single__btn:hover::before {
    opacity: 0.4;
  }
}
.p-music_single__btn::after {
  content: "";
  width: 2rem;
  height: 3rem;
  display: block;
  position: absolute;
  transform: translate(-50%, 100%);
  border-top: 2rem solid var(--color-brown-dark);
  border-left: 1.5rem solid transparent;
  border-right: 1.5rem solid transparent;
  opacity: 0;
  transition: opacity 0.3s cubic-bezier(0.5, 1, 0.89, 1);
}
@media screen and (min-width: 961px) {
  .p-music_single__btn::after {
    bottom: 0;
    left: 50%;
  }
}
@media screen and (max-width: 960px) {
  .p-music_single__btn::after {
    width: 2rem;
    top: 50%;
    height: 3rem;
    right: 0;
    border-top: 1.5rem solid transparent;
    border-left: 2rem solid var(--color-brown-dark);
    border-bottom: 1.5rem solid transparent;
    transform: translate(100%, -50%);
  }
}
@media (hover: hover) and (pointer: fine) {
  .p-music_single__btn:hover::after {
    opacity: 0.4;
  }
}
.p-music_single__btn-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 1.6rem;
  font-family: eurostile, toppan-bunkyu-midashi-go-std, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  font-weight: 700;
  color: var(--color-brown-dark);
  letter-spacing: 0.3rem;
}
@media (hover: hover) and (pointer: fine) {
  .p-music_single__btn-text {
    transition: letter-spacing 0.2s cubic-bezier(0.5, 1, 0.89, 1);
  }
  .p-music_single__btn:hover .p-music_single__btn-text {
    letter-spacing: 0.6rem;
  }
}
.p-music_single__btn-arrow {
  width: 100%;
  height: 2.9rem;
  display: block;
  position: absolute;
}
@media screen and (min-width: 961px) {
  .p-music_single__btn-arrow {
    left: 0;
  }
}
@media screen and (max-width: 960px) {
  .p-music_single__btn-arrow {
    width: 2.4rem;
    height: 100%;
    top: 0;
  }
}
.p-music_single__btn-arrow.-prev {
  top: 0;
}
@media screen and (max-width: 960px) {
  .p-music_single__btn-arrow.-prev {
    left: 0;
  }
}
@media screen and (min-width: 961px) {
  .p-music_single__btn-arrow.-next {
    bottom: 0.4rem;
    transform: translate(0, 100%);
  }
}
@media screen and (max-width: 960px) {
  .p-music_single__btn-arrow.-next {
    right: 0;
    transform: translate(100%, 0);
  }
}
.p-music_single__btn-arrow::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: url("../img/common/border_arrow_r.svg") no-repeat center/auto 100%;
  transition: opacity 0.3s cubic-bezier(0.5, 1, 0.89, 1);
}
@media screen and (max-width: 960px) {
  .p-music_single__btn-arrow::before {
    background: url("../img/common/border_arrow.svg") no-repeat center/100% auto;
  }
}
.p-music_single__btn-arrow.-next::before {
  opacity: 0;
}
@media (hover: hover) and (pointer: fine) {
  .p-music_single__btn-arrow.-next::before {
    opacity: 1;
  }
}

@media (hover: hover) and (pointer: fine) {
  .p-music_single__btn-arrow.-prev::before {
    opacity: 1;
  }
  .p-music_single__btn:hover .p-music_single__btn-arrow.-prev::before {
    opacity: 0;
  }
  .p-music_single__btn-arrow.-next::before {
    opacity: 0;
  }
  .p-music_single__btn:hover .p-music_single__btn-arrow.-next::before {
    opacity: 1;
  }
}
.p-music_single__btn-arrow::after {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  transition: opacity 0.3s cubic-bezier(0.5, 1, 0.89, 1);
}
@media screen and (min-width: 961px) {
  .p-music_single__btn-arrow::after {
    border-top: 0.4rem solid var(--color-brown-dark);
  }
}
@media screen and (max-width: 960px) {
  .p-music_single__btn-arrow::after {
    border-left: 0.4rem solid var(--color-brown-dark);
  }
}
.p-music_single__btn-arrow.-prev::after {
  opacity: 0;
}
@media (hover: hover) and (pointer: fine) {
  .p-music_single__btn:hover .p-music_single__btn-arrow.-prev::after {
    opacity: 1;
  }
}

.p-music_single__btn-arrow.-next::after {
  opacity: 1;
}
@media (hover: hover) and (pointer: fine) {
  .p-music_single__btn:hover .p-music_single__btn-arrow.-next::after {
    opacity: 0;
  }
}

.p-music_song {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-music_song {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto 1fr;
    gap: calc(4rem * var(--ratio)) calc(8rem * var(--ratio));
  }
}
.p-music_song__header {
  display: block;
  position: relative;
  padding-bottom: calc(2.6rem * var(--ratio));
}
@media screen and (min-width: 961px) {
  .p-music_song__header {
    grid-column: 2/3;
    grid-row: 1/2;
  }
}
@media screen and (max-width: 960px) {
  .p-music_song__header {
    padding-bottom: 1rem;
    margin-bottom: 3rem;
  }
}
.p-music_song__header::before {
  content: "";
  width: 150%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  border-bottom: 0.4rem solid var(--color-brown-dark);
}
@media screen and (max-width: 960px) {
  .p-music_song__header::before {
    border-bottom-width: 0.3rem;
  }
}
.p-music_song__cap {
  display: block;
  position: relative;
  font-size: calc(2.4rem * var(--ratio));
  line-height: 1;
}
@media screen and (max-width: 960px) {
  .p-music_song__cap {
    font-size: 1.6rem;
  }
}
.p-music_song__thumb {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-music_song__thumb {
    grid-column: 1/2;
    grid-row: 1/3;
  }
}
@media screen and (max-width: 960px) {
  .p-music_song__thumb {
    margin-bottom: 3.2rem;
  }
}
.p-music_song__thumb-img {
  display: block;
  position: relative;
}
.p-music_song__thumb-base {
  display: block;
  position: relative;
  padding-top: 100%;
}
.p-music_song__thumb-base::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: var(--color-white);
  opacity: 0.4;
}
.p-music_song__thumb-coming {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: calc(4.2rem * var(--ratio));
  font-family: eurostile, toppan-bunkyu-midashi-go-std, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  text-align: center;
  color: var(--color-brown-dark);
  letter-spacing: 0.1rem;
}
@media screen and (max-width: 960px) {
  .p-music_song__thumb-coming {
    font-size: 2.4rem;
  }
}
.p-music_song__inner {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-music_song__inner {
    grid-column: 2/3;
    grid-row: 2/3;
  }
}
.p-music_song__title {
  display: block;
  position: relative;
  font-size: calc(4.4rem * var(--ratio));
}
@media screen and (max-width: 960px) {
  .p-music_song__title {
    font-size: 2.4rem;
    text-align: center;
  }
}
.p-music_song__artist {
  display: block;
  position: relative;
  margin-top: 3.6rem;
  font-size: calc(3.2rem * var(--ratio));
  font-weight: 700;
}
@media screen and (max-width: 960px) {
  .p-music_song__artist {
    margin-top: 1.2rem;
    font-size: 1.6rem;
    text-align: center;
  }
}
.p-music_song__text {
  display: block;
  position: relative;
  margin-top: 2.6rem;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.8;
}
@media screen and (max-width: 960px) {
  .p-music_song__text {
    margin-top: 1.5rem;
    font-size: 1.2rem;
  }
}
.p-music_song__text a {
  text-decoration: underline;
}
@media (hover: hover) and (pointer: fine) {
  .p-music_song__text a:hover {
    text-decoration: none;
  }
}
.p-music_song__text img {
  max-width: 100%;
  height: auto !important;
  position: relative;
}
.p-music_song__text p {
  display: block;
  margin: 1em 0;
}
.p-music_song__text iframe {
  max-width: 100%;
}
@supports (aspect-ratio: 16/9) {
  .p-music_song__text iframe {
    width: 100%;
    display: block;
    height: auto !important;
    aspect-ratio: 16/9;
  }
}

.p-music_artist {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-music_artist {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto 1fr;
    gap: calc(2rem * var(--ratio)) calc(8rem * var(--ratio));
  }
}
.p-music_artist__header {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-music_artist__header {
    grid-column: 2/3;
    grid-row: 1/2;
  }
}
@media screen and (max-width: 960px) {
  .p-music_artist__header {
    margin-bottom: 2.6rem;
  }
}
.p-music_artist__title {
  display: block;
  position: relative;
  padding-left: 1.6rem;
  font-size: 1.6rem;
  letter-spacing: 0.2rem;
}
@media screen and (max-width: 960px) {
  .p-music_artist__title {
    padding-left: 1.4rem;
    font-size: 1.8rem;
  }
}
.p-music_artist__title::before {
  content: "";
  width: 0.8rem;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--color-green);
}
.p-music_artist__thumb {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-music_artist__thumb {
    grid-column: 1/2;
    grid-row: 1/3;
  }
}
@media screen and (max-width: 960px) {
  .p-music_artist__thumb {
    margin-bottom: 2.6rem;
  }
}
.p-music_artist__thumb-img {
  display: block;
  position: relative;
}
.p-music_artist__inner {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-music_artist__inner {
    grid-column: 2/3;
    grid-row: 2/3;
    padding-left: 1.6rem;
  }
}
.p-music_artist__comment {
  display: block;
  position: relative;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.8;
}
@media screen and (max-width: 960px) {
  .p-music_artist__comment {
    font-size: 1.2rem;
  }
}
.p-music_artist__comment a {
  text-decoration: underline;
}
@media (hover: hover) and (pointer: fine) {
  .p-music_artist__comment a:hover {
    text-decoration: none;
  }
}
.p-music_artist__comment img {
  max-width: 100%;
  height: auto !important;
  position: relative;
}
.p-music_artist__comment p {
  display: block;
  margin: 1em 0;
}
.p-music_artist__comment iframe {
  max-width: 100%;
}
@supports (aspect-ratio: 16/9) {
  .p-music_artist__comment iframe {
    width: 100%;
    display: block;
    height: auto !important;
    aspect-ratio: 16/9;
  }
}

.p-goods {
  display: block;
  position: relative;
  padding: calc(16.7rem * var(--ratio)) 0 0;
}
@media screen and (max-width: 960px) {
  .p-goods {
    padding: 8rem 0 0;
  }
}
.p-goods__container {
  width: 90%;
  max-width: 1100px;
  display: block;
  position: relative;
  margin: 0 auto;
  opacity: 0;
  transform: translateY(5rem);
  transition: opacity 0.4s cubic-bezier(0.5, 1, 0.89, 1), transform 0s linear 0.4s;
}
.is-load .p-goods__container {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0.4s, transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0.4s;
}
.p-goods__inner {
  min-width: 0;
  display: block;
  position: relative;
}
.p-goods__list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: calc(4rem * var(--ratio)) calc(1.6rem * var(--ratio));
  position: relative;
}
@media screen and (min-width: 961px) and (max-width: 1300px) {
  .p-goods__list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 960px) {
  .p-goods__list {
    grid-template-columns: repeat(2, 1fr);
    gap: 2.2rem 1.6rem;
  }
}
.p-goods__list-item {
  display: block;
  position: relative;
}
.p-goods__footer {
  width: 100%;
  position: relative;
  margin: 5rem auto 0;
}
@media screen and (max-width: 960px) {
  .p-goods__footer {
    margin-top: 3.2rem;
  }
}
.p-goods__link {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  margin: 0 auto;
}

.p-goods_data {
  display: block;
  position: relative;
}
.p-goods_data__thumb {
  display: block;
  position: relative;
}
.p-goods_data__thumb::after {
  content: "";
  width: 0;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  background: transparent;
  opacity: 0.8;
  transition: width 0s linear 0.4s, background-color 0.4s cubic-bezier(0.5, 1, 0.89, 1), opacity 0s linear 0.4s;
}
@media (hover: hover) and (pointer: fine) {
  .p-goods_data[href]:hover .p-goods_data__thumb::after {
    width: 100%;
    left: 0;
    opacity: 0.6;
    background: var(--color-white);
    transition: width 0.2s cubic-bezier(0.5, 1, 0.89, 1), opacity 0.5s cubic-bezier(0.5, 1, 0.89, 1);
  }
}
.p-goods_data__thumb-img {
  display: block;
  position: relative;
}
.p-goods_data__thumb-base {
  display: block;
  position: relative;
  padding-top: 100%;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
}
.p-goods_data__thumb-base::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: var(--color-white);
  opacity: 0.4;
}
.p-goods_data__thumb-coming {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: calc(1.6rem * var(--ratio));
  font-family: eurostile, toppan-bunkyu-midashi-go-std, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  text-align: center;
  color: var(--color-brown-dark);
  letter-spacing: 0.1rem;
}
@media screen and (max-width: 960px) {
  .p-goods_data__thumb-coming {
    font-size: 1.4rem;
  }
}
.p-goods_data__title {
  display: -webkit-box;
  position: relative;
  margin-top: 1rem;
  font-size: 1.6rem;
  line-height: 1.5;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
@media screen and (max-width: 960px) {
  .p-goods_data__title {
    font-size: 1.2rem;
    line-height: 1.5;
  }
}

.p-goods_in {
  display: block;
  position: relative;
  padding: calc(16.7rem * var(--ratio)) 0 0;
}
@media screen and (max-width: 960px) {
  .p-goods_in {
    padding: 8rem 0 0;
  }
}
.p-goods_in__container {
  width: 90%;
  max-width: 1280px;
  display: block;
  position: relative;
  margin: 0 auto;
  opacity: 0;
  transform: translateY(5rem);
  transition: opacity 0.4s cubic-bezier(0.5, 1, 0.89, 1), transform 0s linear 0.4s;
}
.is-load .p-goods_in__container {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0.4s, transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0.4s;
}
.p-goods_in__inner {
  min-width: 0;
  display: block;
  position: relative;
}
.p-goods_in__footer {
  width: 100%;
  position: relative;
  margin: 5rem auto 0;
}
@media screen and (max-width: 960px) {
  .p-goods_in__footer {
    margin-top: 3.2rem;
  }
}
.p-goods_in__link {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  margin: 0 auto;
}

.p-goods_single {
  display: block;
  position: relative;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  overflow: hidden;
}
.p-goods_single::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: var(--color-white);
  opacity: 0.5;
}
.p-goods_single__container {
  width: 90%;
  max-width: 1040px;
  display: block;
  position: relative;
  padding: 12rem 0;
  margin: 0 auto;
}
@media screen and (min-width: 961px) {
  .p-goods_single__container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto 1fr auto;
    gap: calc(4.5rem * var(--ratio)) calc(8rem * var(--ratio));
  }
}
@media screen and (max-width: 960px) {
  .p-goods_single__container {
    width: 85%;
    padding: 4.6rem 0;
  }
}
.p-goods_single__header {
  display: block;
  position: relative;
  padding-bottom: calc(1.8rem * var(--ratio));
}
@media screen and (min-width: 961px) {
  .p-goods_single__header {
    grid-column: 2/3;
    grid-row: 1/2;
  }
}
@media screen and (max-width: 960px) {
  .p-goods_single__header {
    padding-bottom: 1rem;
    margin-bottom: 3rem;
  }
}
.p-goods_single__header::before {
  content: "";
  width: 150%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  border-bottom: 0.4rem solid var(--color-brown-dark);
}
@media screen and (max-width: 960px) {
  .p-goods_single__header::before {
    border-bottom-width: 0.3rem;
  }
}
.p-goods_single__title {
  display: block;
  position: relative;
  font-size: calc(2.6rem * var(--ratio));
  line-height: 1.5;
}
@media screen and (max-width: 960px) {
  .p-goods_single__title {
    font-size: 1.6rem;
  }
}
.p-goods_single__thumb {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-goods_single__thumb {
    grid-column: 1/2;
    grid-row: 1/3;
    min-width: 0;
    max-width: 100%;
  }
}
@media screen and (max-width: 960px) {
  .p-goods_single__thumb {
    margin-bottom: 3.2rem;
  }
}
.p-goods_single__thumb-img {
  display: block;
  position: relative;
}
.p-goods_single__thumb-base {
  display: block;
  position: relative;
  padding-top: 100%;
}
.p-goods_single__thumb-base::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: var(--color-white);
  opacity: 0.4;
}
.p-goods_single__thumb-coming {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: calc(4.2rem * var(--ratio));
  font-family: eurostile, toppan-bunkyu-midashi-go-std, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  text-align: center;
  color: var(--color-brown-dark);
  letter-spacing: 0.1rem;
}
@media screen and (max-width: 960px) {
  .p-goods_single__thumb-coming {
    font-size: 2.4rem;
  }
}
.p-goods_single__inner {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-goods_single__inner {
    grid-column: 2/3;
    grid-row: 2/3;
  }
}
.p-goods_single__data {
  display: block;
  position: relative;
}
.p-goods_single__data + .p-goods_single__data {
  margin-top: 2.2rem;
}
.p-goods_single__data-cap {
  display: block;
  position: relative;
  padding-left: 1.6rem;
  font-size: 1.6rem;
  margin-bottom: 0.2rem;
  letter-spacing: 0.2rem;
}
@media screen and (max-width: 960px) {
  .p-goods_single__data-cap {
    margin-bottom: 0.5rem;
    padding-left: 1.4rem;
    font-size: 1.6rem;
  }
}
.p-goods_single__data-cap::before {
  content: "";
  width: 0.8rem;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--color-green);
}
.p-goods_single__data-text {
  display: block;
  position: relative;
  padding-left: 1.6rem;
  font-size: 1.6rem;
  letter-spacing: 0.2rem;
  line-height: 1.8;
}
@media screen and (max-width: 960px) {
  .p-goods_single__data-text {
    padding-left: 1.4rem;
    font-size: 1.3rem;
    line-height: 1.6;
  }
}
.p-goods_single__data-text a {
  text-decoration: underline;
}
@media (hover: hover) and (pointer: fine) {
  .p-goods_single__data-text a:hover {
    text-decoration: none;
  }
}
.p-goods_single__data-text img {
  max-width: 100%;
  height: auto !important;
  position: relative;
}
.p-goods_single__data-text p {
  display: block;
  margin: 1em 0;
}
.p-goods_single__data-text iframe {
  max-width: 100%;
}
@supports (aspect-ratio: 16/9) {
  .p-goods_single__data-text iframe {
    width: 100%;
    display: block;
    height: auto !important;
    aspect-ratio: 16/9;
  }
}
.p-goods_single__footer {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-goods_single__footer {
    grid-column: 1/3;
    grid-row: 3/4;
  }
}
@media screen and (max-width: 960px) {
  .p-goods_single__footer {
    margin-top: 5rem;
  }
}
.p-goods_single__btn {
  width: 100%;
  height: 11.4rem;
  display: block;
  position: relative;
}
@media screen and (max-width: 960px) {
  .p-goods_single__btn {
    height: calc(8rem * var(--ratio));
  }
}
.p-goods_single__btn::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: var(--color-brown-dark);
  opacity: 0;
  transition: opacity 0.3s cubic-bezier(0.5, 1, 0.89, 1);
}
@media (hover: hover) and (pointer: fine) {
  .p-goods_single__btn:hover::before {
    opacity: 0.4;
  }
}
.p-goods_single__btn::after {
  content: "";
  width: 2rem;
  height: 3rem;
  display: block;
  position: absolute;
  transform: translate(-50%, 100%);
  border-top: 2rem solid var(--color-brown-dark);
  border-left: 1.5rem solid transparent;
  border-right: 1.5rem solid transparent;
  opacity: 0;
  transition: opacity 0.3s cubic-bezier(0.5, 1, 0.89, 1);
}
@media screen and (min-width: 961px) {
  .p-goods_single__btn::after {
    bottom: 0;
    left: 50%;
  }
}
@media screen and (max-width: 960px) {
  .p-goods_single__btn::after {
    width: 2rem;
    top: 50%;
    height: 3rem;
    right: 0;
    border-top: 1.5rem solid transparent;
    border-left: 2rem solid var(--color-brown-dark);
    border-bottom: 1.5rem solid transparent;
    transform: translate(100%, -50%);
  }
}
@media (hover: hover) and (pointer: fine) {
  .p-goods_single__btn:hover::after {
    opacity: 0.4;
  }
}
.p-goods_single__btn-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 1.6rem;
  font-family: eurostile, toppan-bunkyu-midashi-go-std, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  font-weight: 700;
  color: var(--color-brown-dark);
  letter-spacing: 0.3rem;
}
@media (hover: hover) and (pointer: fine) {
  .p-goods_single__btn-text {
    transition: letter-spacing 0.2s cubic-bezier(0.5, 1, 0.89, 1);
  }
  .p-goods_single__btn:hover .p-goods_single__btn-text {
    letter-spacing: 0.6rem;
  }
}
.p-goods_single__btn-arrow {
  width: 100%;
  height: 2.9rem;
  display: block;
  position: absolute;
}
@media screen and (min-width: 961px) {
  .p-goods_single__btn-arrow {
    left: 0;
  }
}
@media screen and (max-width: 960px) {
  .p-goods_single__btn-arrow {
    width: 2.4rem;
    height: 100%;
    top: 0;
  }
}
.p-goods_single__btn-arrow.-prev {
  top: 0;
}
@media screen and (max-width: 960px) {
  .p-goods_single__btn-arrow.-prev {
    left: 0;
  }
}
@media screen and (min-width: 961px) {
  .p-goods_single__btn-arrow.-next {
    bottom: 0.4rem;
    transform: translate(0, 100%);
  }
}
@media screen and (max-width: 960px) {
  .p-goods_single__btn-arrow.-next {
    right: 0;
    transform: translate(100%, 0);
  }
}
.p-goods_single__btn-arrow::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: url("../img/common/border_arrow_r.svg") no-repeat center/auto 100%;
  transition: opacity 0.3s cubic-bezier(0.5, 1, 0.89, 1);
}
@media screen and (max-width: 960px) {
  .p-goods_single__btn-arrow::before {
    background: url("../img/common/border_arrow.svg") no-repeat center/100% auto;
  }
}
.p-goods_single__btn-arrow.-next::before {
  opacity: 0;
}
@media (hover: hover) and (pointer: fine) {
  .p-goods_single__btn-arrow.-next::before {
    opacity: 1;
  }
}

@media (hover: hover) and (pointer: fine) {
  .p-goods_single__btn-arrow.-prev::before {
    opacity: 1;
  }
  .p-goods_single__btn:hover .p-goods_single__btn-arrow.-prev::before {
    opacity: 0;
  }
  .p-goods_single__btn-arrow.-next::before {
    opacity: 0;
  }
  .p-goods_single__btn:hover .p-goods_single__btn-arrow.-next::before {
    opacity: 1;
  }
}
.p-goods_single__btn-arrow::after {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  transition: opacity 0.3s cubic-bezier(0.5, 1, 0.89, 1);
}
@media screen and (min-width: 961px) {
  .p-goods_single__btn-arrow::after {
    border-top: 0.4rem solid var(--color-brown-dark);
  }
}
@media screen and (max-width: 960px) {
  .p-goods_single__btn-arrow::after {
    border-left: 0.4rem solid var(--color-brown-dark);
  }
}
.p-goods_single__btn-arrow.-prev::after {
  opacity: 0;
}
@media (hover: hover) and (pointer: fine) {
  .p-goods_single__btn:hover .p-goods_single__btn-arrow.-prev::after {
    opacity: 1;
  }
}

.p-goods_single__btn-arrow.-next::after {
  opacity: 1;
}
@media (hover: hover) and (pointer: fine) {
  .p-goods_single__btn:hover .p-goods_single__btn-arrow.-next::after {
    opacity: 0;
  }
}

.p-goods_thumb {
  display: block;
  position: relative;
}
.p-goods_thumb__inner {
  display: block;
  position: relative;
  overflow: hidden;
}
.p-goods_thumb__list {
  width: 100%;
  display: block;
  position: relative;
  margin: 0 auto;
  font-size: 0;
  letter-spacing: -0.4em;
  white-space: nowrap;
}
.p-goods_thumb__list-item {
  display: inline-block;
  position: relative;
  vertical-align: top;
  font-size: 1rem;
  letter-spacing: normal;
  white-space: normal;
}
.p-goods_thumb__visual {
  display: block;
  position: relative;
  overflow: hidden;
}
.p-goods_thumb__visual-img {
  display: block;
  position: relative;
}
.p-goods_thumb__nav {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 0.6rem;
  position: relative;
  margin-top: 0.6rem;
}
@media screen and (min-width: 961px) and (max-width: 1300px) {
  .p-goods_thumb__nav {
    grid-template-columns: repeat(5, 1fr);
  }
}
@media screen and (max-width: 960px) {
  .p-goods_thumb__nav {
    grid-template-columns: repeat(5, 1fr);
    gap: 0.3rem;
    margin-top: 0.3rem;
  }
}
@media screen and (max-width: 960px) and (min-width: 751px) {
  .p-goods_thumb__nav {
    grid-template-columns: repeat(6, 1fr);
  }
}
.p-goods_thumb__nav-item {
  display: block;
  position: relative;
}
.p-goods_thumb__btn {
  display: block;
  position: relative;
  cursor: pointer;
  background: var(--color-white);
}
.is-current .p-goods_thumb__btn {
  pointer-events: none;
}
.p-goods_thumb__btn::after {
  content: "";
  width: 0;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  background: transparent;
  opacity: 0.8;
  transition: width 0s linear 0.4s, background-color 0.4s cubic-bezier(0.5, 1, 0.89, 1), opacity 0s linear 0.4s;
}
@media (hover: hover) and (pointer: fine) {
  .p-goods_thumb__btn:hover::after {
    width: 100%;
    left: 0;
    opacity: 0.6;
    background: var(--color-white);
    transition: width 0.2s cubic-bezier(0.5, 1, 0.89, 1), opacity 0.5s cubic-bezier(0.5, 1, 0.89, 1);
  }
}
.p-goods_thumb__btn-img {
  display: block;
  position: relative;
}
.p-goods_thumb__btn-img::after {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  border: 0.4rem solid var(--color-orange);
  opacity: 0;
  transition: opacity 0.5s cubic-bezier(0.5, 1, 0.89, 1);
}
@media screen and (max-width: 960px) {
  .p-goods_thumb__btn-img::after {
    border-width: 0.2rem;
  }
}
.is-current .p-goods_thumb__btn-img::after {
  opacity: 1;
}

.p-bd {
  display: block;
  position: relative;
  padding: calc(7.4rem * var(--ratio)) 0 0;
}
@media screen and (max-width: 960px) {
  .p-bd {
    padding: 8rem 0 0;
  }
}
.p-bd__container {
  width: 90%;
  max-width: 1280px;
  display: block;
  position: relative;
  margin: 0 auto;
  opacity: 0;
  transform: translateY(5rem);
  transition: opacity 0.4s cubic-bezier(0.5, 1, 0.89, 1), transform 0s linear 0.4s;
}
.is-load .p-bd__container {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0.4s, transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0.4s;
}
.p-bd__header {
  display: block;
  position: relative;
  margin-bottom: 5rem;
}
@media screen and (max-width: 960px) {
  .p-bd__header {
    margin-bottom: 2.5rem;
  }
}
.p-bd__nav {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-bd__nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
  }
  @media not all and (-webkit-min-device-pixel-ratio: 0), not all and (min-resolution: 0.001dpcm) {
    @supports not (translate: none) {
      .p-bd__nav {
        margin: 0.5rem 1rem;
      }
    }
  }
}
@media screen and (max-width: 960px) {
  .p-bd__nav {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
  }
}
.p-bd__nav + .p-bd__nav {
  margin-top: 1rem;
}
.p-bd__nav-item {
  display: block;
  position: relative;
}
.p-bd__btn {
  width: calc(28rem * var(--ratio));
  display: block;
  position: relative;
  color: var(--color-brown-dark);
  background: var(--color-white);
  transition: color 0.2s cubic-bezier(0.5, 1, 0.89, 1), background-color 0.2s cubic-bezier(0.5, 1, 0.89, 1);
}
@media screen and (max-width: 960px) {
  .p-bd__btn {
    width: 100%;
  }
}
.is-current .p-bd__btn {
  color: var(--color-white);
  background: var(--color-orange);
  pointer-events: none;
}
.-disable .p-bd__btn {
  opacity: 0.5;
  pointer-events: none;
}
@media (hover: hover) and (pointer: fine) {
  .p-bd__btn:hover {
    color: var(--color-white);
    background: var(--color-brown-dark);
  }
}
.p-bd__btn-text {
  display: block;
  position: relative;
  padding: 1.2rem 4rem 1rem;
  font-size: calc(1.8rem * var(--ratio));
  font-weight: 700;
  line-height: 1;
  text-align: center;
}
@media screen and (max-width: 960px) {
  .p-bd__btn-text {
    padding: 1rem 1rem 0.8rem;
    font-size: 1.4rem;
  }
}
.p-bd__inner {
  min-width: 0;
  display: block;
  position: relative;
}
.p-bd__footer {
  width: 100%;
  position: relative;
  margin: 5rem auto 0;
}
@media screen and (max-width: 960px) {
  .p-bd__footer {
    margin-top: 3.2rem;
  }
}
.p-bd__link {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  margin: 0 auto;
}

.p-bd_single {
  display: block;
  position: relative;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  overflow: hidden;
}
.p-bd_single::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: var(--color-white);
  opacity: 0.5;
}
.p-bd_single__container {
  width: 90%;
  max-width: 1040px;
  display: block;
  position: relative;
  padding: 12rem 0;
  margin: 0 auto;
}
@media screen and (min-width: 961px) {
  .p-bd_single__container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto 1fr;
    gap: calc(4.5rem * var(--ratio)) calc(8rem * var(--ratio));
  }
}
@media screen and (max-width: 960px) {
  .p-bd_single__container {
    width: 85%;
    padding: 4.6rem 0;
  }
}
.p-bd_single__header {
  display: block;
  position: relative;
  padding-bottom: calc(2.6rem * var(--ratio));
}
@media screen and (min-width: 961px) {
  .p-bd_single__header {
    grid-column: 2/3;
    grid-row: 1/2;
  }
}
@media screen and (max-width: 960px) {
  .p-bd_single__header {
    padding-bottom: 1rem;
    margin-bottom: 3rem;
  }
}
.p-bd_single__header::before {
  content: "";
  width: 150%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  border-bottom: 0.4rem solid var(--color-brown-dark);
}
@media screen and (max-width: 960px) {
  .p-bd_single__header::before {
    border-bottom-width: 0.3rem;
  }
}
.p-bd_single__title {
  display: block;
  position: relative;
  font-size: calc(2.4rem * var(--ratio));
  line-height: 1.5;
}
@media screen and (max-width: 960px) {
  .p-bd_single__title {
    font-size: 1.6rem;
  }
}
.p-bd_single__thumb {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-bd_single__thumb {
    grid-column: 1/2;
    grid-row: 1/3;
    min-width: 0;
    max-width: 100%;
  }
}
@media screen and (max-width: 960px) {
  .p-bd_single__thumb {
    margin-bottom: 3.2rem;
  }
}
.p-bd_single__thumb-img {
  display: block;
  position: relative;
}
.p-bd_single__thumb-base {
  display: block;
  position: relative;
  padding-top: 126.2886597938%;
}
.p-bd_single__thumb-base::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: var(--color-white);
  opacity: 0.4;
}
.p-bd_single__thumb-coming {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: calc(4.2rem * var(--ratio));
  font-family: eurostile, toppan-bunkyu-midashi-go-std, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  text-align: center;
  color: var(--color-brown-dark);
  letter-spacing: 0.1rem;
}
@media screen and (max-width: 960px) {
  .p-bd_single__thumb-coming {
    font-size: 2.4rem;
  }
}
.p-bd_single__inner {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-bd_single__inner {
    grid-column: 2/3;
    grid-row: 2/3;
  }
}
.p-bd_single__data {
  display: block;
  position: relative;
}
.p-bd_single__data + .p-bd_single__data {
  margin-top: 2.2rem;
}
.p-bd_single__data-cap {
  display: block;
  position: relative;
  padding-left: 1.6rem;
  font-size: 1.6rem;
  margin-bottom: 0.2rem;
  letter-spacing: 0.2rem;
}
@media screen and (max-width: 960px) {
  .p-bd_single__data-cap {
    margin-bottom: 0.5rem;
    padding-left: 1.4rem;
    font-size: 1.6rem;
  }
}
.p-bd_single__data-cap::before {
  content: "";
  width: 0.8rem;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--color-green);
}
.p-bd_single__data-text {
  display: block;
  position: relative;
  padding-left: 1.6rem;
  font-size: 1.6rem;
  letter-spacing: 0.2rem;
  line-height: 1.8;
}
@media screen and (max-width: 960px) {
  .p-bd_single__data-text {
    padding-left: 1.4rem;
    font-size: 1.3rem;
    line-height: 1.6;
  }
}
.p-bd_single__data-text a {
  text-decoration: underline;
}
@media (hover: hover) and (pointer: fine) {
  .p-bd_single__data-text a:hover {
    text-decoration: none;
  }
}
.p-bd_single__data-text img {
  max-width: 100%;
  height: auto !important;
  position: relative;
}
.p-bd_single__data-text p {
  display: block;
  margin: 1em 0;
}
.p-bd_single__data-text iframe {
  max-width: 100%;
}
@supports (aspect-ratio: 16/9) {
  .p-bd_single__data-text iframe {
    width: 100%;
    display: block;
    height: auto !important;
    aspect-ratio: 16/9;
  }
}

.p-bd_thumb {
  display: block;
  position: relative;
}
.p-bd_thumb__inner {
  display: block;
  position: relative;
  overflow: hidden;
}
.p-bd_thumb__list {
  width: 100%;
  display: block;
  position: relative;
  margin: 0 auto;
  font-size: 0;
  letter-spacing: -0.4em;
  white-space: nowrap;
}
.p-bd_thumb__list-item {
  display: inline-block;
  position: relative;
  vertical-align: top;
  font-size: 1rem;
  letter-spacing: normal;
  white-space: normal;
}
.p-bd_thumb__visual {
  display: block;
  position: relative;
  overflow: hidden;
}
.p-bd_thumb__visual-img {
  display: block;
  position: relative;
}
.p-bd_thumb__nav {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 0.6rem;
  position: relative;
  margin-top: 0.6rem;
}
@media screen and (min-width: 961px) and (max-width: 1300px) {
  .p-bd_thumb__nav {
    grid-template-columns: repeat(5, 1fr);
  }
}
@media screen and (max-width: 960px) {
  .p-bd_thumb__nav {
    grid-template-columns: repeat(5, 1fr);
    gap: 0.3rem;
    margin-top: 0.3rem;
  }
}
@media screen and (max-width: 960px) and (min-width: 751px) {
  .p-bd_thumb__nav {
    grid-template-columns: repeat(6, 1fr);
  }
}
.p-bd_thumb__nav-item {
  display: block;
  position: relative;
}
.p-bd_thumb__btn {
  display: block;
  position: relative;
  cursor: pointer;
  background: var(--color-white);
}
.is-current .p-bd_thumb__btn {
  pointer-events: none;
}
.p-bd_thumb__btn::after {
  content: "";
  width: 0;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  background: transparent;
  opacity: 0.8;
  transition: width 0s linear 0.4s, background-color 0.4s cubic-bezier(0.5, 1, 0.89, 1), opacity 0s linear 0.4s;
}
@media (hover: hover) and (pointer: fine) {
  .p-bd_thumb__btn:hover::after {
    width: 100%;
    left: 0;
    opacity: 0.6;
    background: var(--color-white);
    transition: width 0.2s cubic-bezier(0.5, 1, 0.89, 1), opacity 0.5s cubic-bezier(0.5, 1, 0.89, 1);
  }
}
.p-bd_thumb__btn-img {
  display: block;
  position: relative;
}
.p-bd_thumb__btn-img::after {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  border: 0.4rem solid var(--color-orange);
  opacity: 0;
  transition: opacity 0.5s cubic-bezier(0.5, 1, 0.89, 1);
}
@media screen and (max-width: 960px) {
  .p-bd_thumb__btn-img::after {
    border-width: 0.2rem;
  }
}
.is-current .p-bd_thumb__btn-img::after {
  opacity: 1;
}

.p-bd_special {
  display: block;
  position: relative;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  overflow: hidden;
}
.p-bd_special::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: var(--color-white);
  opacity: 0.5;
}
.p-bd_special__container {
  width: 90%;
  max-width: 1040px;
  display: block;
  position: relative;
  padding: 12rem 0;
  margin: 0 auto;
}
@media screen and (max-width: 960px) {
  .p-bd_special__container {
    width: 85%;
    padding: 4.6rem 0;
  }
}
.p-bd_special__inner {
  display: block;
  position: relative;
}

.p-bd_special_data {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-bd_special_data {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
    gap: calc(3.4rem * var(--ratio)) calc(8rem * var(--ratio));
  }
  .p-bd_special_data:first-child {
    grid-template-rows: auto 1fr;
  }
}
.p-bd_special_data + .p-bd_special_data {
  margin-top: calc(8rem * var(--ratio));
}
@media screen and (max-width: 960px) {
  .p-bd_special_data + .p-bd_special_data {
    margin-top: 7.5rem;
  }
}
.p-bd_special_data__header {
  display: none;
  position: relative;
  padding-bottom: calc(2.4rem * var(--ratio));
  top: -1rem;
}
.p-bd_special_data:first-child .p-bd_special_data__header {
  display: block;
}
@media screen and (min-width: 961px) {
  .p-bd_special_data__header {
    grid-column: 2/3;
    grid-row: 1/2;
  }
}
@media screen and (max-width: 960px) {
  .p-bd_special_data__header {
    padding-bottom: 1rem;
    margin-bottom: 2.2rem;
  }
}
.p-bd_special_data__header::before {
  content: "";
  width: 150%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  border-bottom: 0.4rem solid var(--color-brown-dark);
}
@media screen and (max-width: 960px) {
  .p-bd_special_data__header::before {
    border-bottom-width: 0.3rem;
  }
}
.p-bd_special_data__cap {
  display: block;
  position: relative;
  font-size: calc(2.4rem * var(--ratio));
  line-height: 1.5;
}
@media screen and (max-width: 960px) {
  .p-bd_special_data__cap {
    font-size: 1.6rem;
  }
}
.p-bd_special_data__thumb {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-bd_special_data__thumb {
    grid-column: 1/2;
    grid-row: 1/2;
  }
  .p-bd_special_data:first-child .p-bd_special_data__thumb {
    grid-row: 1/3;
  }
}
@media screen and (max-width: 960px) {
  .p-bd_special_data__thumb {
    margin-bottom: 3.2rem;
  }
}
.p-bd_special_data__thumb-img {
  display: block;
  position: relative;
}
.p-bd_special_data__inner {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-bd_special_data__inner {
    grid-column: 2/3;
    grid-row: 1/2;
  }
  .p-bd_special_data:first-child .p-bd_special_data__inner {
    grid-row: 2/3;
  }
}
.p-bd_special_data__title {
  display: block;
  position: relative;
  padding-left: 1.6rem;
  font-size: 1.6rem;
  letter-spacing: 0.2rem;
}
@media screen and (max-width: 960px) {
  .p-bd_special_data__title {
    padding-left: 1.4rem;
    font-size: 1.8rem;
  }
}
.p-bd_special_data__title::before {
  content: "";
  width: 0.8rem;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--color-green);
}
.p-bd_special_data__text {
  display: block;
  position: relative;
  margin-top: 2.6rem;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.8;
}
@media screen and (max-width: 960px) {
  .p-bd_special_data__text {
    margin-top: 2.8rem;
    font-size: 1.2rem;
    line-height: 1.6;
  }
}
.p-bd_special_data__text a {
  text-decoration: underline;
}
@media (hover: hover) and (pointer: fine) {
  .p-bd_special_data__text a:hover {
    text-decoration: none;
  }
}
.p-bd_special_data__text img {
  max-width: 100%;
  height: auto !important;
  position: relative;
}
.p-bd_special_data__text p {
  display: block;
  margin: 1em 0;
}
.p-bd_special_data__text iframe {
  max-width: 100%;
}
@supports (aspect-ratio: 16/9) {
  .p-bd_special_data__text iframe {
    width: 100%;
    display: block;
    height: auto !important;
    aspect-ratio: 16/9;
  }
}
.p-bd_special_data__link {
  display: block;
  position: relative;
  margin-top: 2.6rem;
}
.p-bd_special_data__btn {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: block;
  position: relative;
  padding-left: 2.6rem;
  text-decoration: none !important;
}
.p-bd_special_data__btn + .p-bd_special_data__btn {
  margin-top: 0.4rem;
}
.p-bd_special_data__btn::before {
  content: "";
  width: 2.4rem;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: url("../img/bd/icon-cart.svg") no-repeat center/contain;
}
.p-bd_special_data__btn-text {
  display: block;
  position: relative;
  font-size: 1.8rem;
  font-weight: 700;
}
@media screen and (max-width: 960px) {
  .p-bd_special_data__btn-text {
    font-size: 1.2rem;
  }
}
.p-bd_special_data__btn-text::before {
  content: "";
  width: 100%;
  height: 0.2rem;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  border-bottom: 0.2rem solid var(--color-brown-dark);
  transition: width 0.35s cubic-bezier(0.5, 1, 0.89, 1);
}
@media (hover: hover) and (pointer: fine) {
  .p-bd_special_data__btn:hover .p-bd_special_data__btn-text::before {
    width: 0;
    left: auto;
    right: 0;
  }
}

.p-coop {
  display: block;
  position: relative;
  padding: calc(16.7rem * var(--ratio)) 0 0;
}
@media screen and (max-width: 960px) {
  .p-coop {
    padding: 8rem 0 0;
  }
}
.p-coop__container {
  width: 90%;
  max-width: 1280px;
  display: block;
  position: relative;
  margin: 0 auto;
  opacity: 0;
  transform: translateY(5rem);
  transition: opacity 0.4s cubic-bezier(0.5, 1, 0.89, 1), transform 0s linear 0.4s;
}
.is-load .p-coop__container {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0.4s, transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0.4s;
}
.p-coop__inner {
  min-width: 0;
  display: block;
  position: relative;
}
.p-coop__footer {
  width: 100%;
  position: relative;
  margin: 10rem auto 0;
}
@media screen and (max-width: 960px) {
  .p-coop__footer {
    margin-top: 6rem;
  }
}
.p-coop__link {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  margin: 0 auto;
}

.p-coop_single {
  display: block;
  position: relative;
}
.p-coop_single__container {
  width: 90%;
  max-width: 1200px;
  display: block;
  position: relative;
  margin: 0 auto;
}
@media screen and (max-width: 960px) {
  .p-coop_single__container {
    width: 100%;
  }
}
.p-coop_single__header {
  display: block;
  position: relative;
  margin-bottom: calc(7.6rem * var(--ratio));
}
.p-coop_single__title {
  display: block;
  position: relative;
  text-align: center;
  letter-spacing: 0.3rem;
}
@media screen and (max-width: 960px) {
  .p-coop_single__title {
    font-size: 1.2rem;
    letter-spacing: 0.2rem;
  }
}
.p-coop_single__memo {
  display: block;
  position: relative;
  margin-top: 0.8rem;
  text-align: center;
  font-size: 1.3rem;
  letter-spacing: 0.1rem;
}
@media screen and (max-width: 960px) {
  .p-coop_single__memo {
    margin-top: 0.4rem;
    font-size: 1rem;
  }
}

.p-coop_data {
  display: block;
  position: relative;
  padding-left: calc(24rem * var(--ratio));
}
@media screen and (max-width: 1300px) {
  .p-coop_data {
    padding-left: calc(20rem * var(--ratio));
  }
}
@media screen and (max-width: 960px) {
  .p-coop_data {
    padding-left: 6.5rem;
  }
}
.p-coop_data + .p-coop_data {
  margin-top: calc(8rem * var(--ratio));
}
@media screen and (max-width: 960px) {
  .p-coop_data + .p-coop_data {
    margin-top: 4rem;
  }
}
.p-coop_data__cap {
  width: calc(16rem * var(--ratio));
  display: block;
  position: absolute;
  top: 1rem;
  left: 0;
}
@media screen and (min-width: 961px) {
  .p-coop_data__cap {
    top: 50%;
    transform: translate(0, -50%);
  }
}
@media screen and (max-width: 1300px) {
  .p-coop_data__cap {
    width: calc(13rem * var(--ratio));
  }
}
@media screen and (max-width: 960px) {
  .p-coop_data__cap {
    width: 5.6rem;
  }
}
.p-coop_data__cap-img {
  display: block;
  position: relative;
}
.p-coop_data__container {
  display: block;
  position: relative;
  background: var(--color-white);
  border-radius: 4rem;
  box-shadow: 0 0 4rem rgba(0, 0, 0, 0.16);
}
@media screen and (min-width: 961px) {
  .p-coop_data__container {
    display: grid;
    grid-template-columns: min(45%, 32rem) auto;
    grid-template-rows: auto 1fr;
    gap: calc(1.2rem * var(--ratio)) calc(2.4rem * var(--ratio));
    padding: calc(4.8rem * var(--ratio)) calc(6rem * var(--ratio));
  }
}
@media screen and (min-width: 961px) and (min-width: 1601px) {
  .p-coop_data__container {
    padding: calc(6.4rem * var(--ratio)) calc(8rem * var(--ratio));
  }
}
@media screen and (min-width: 961px) and (max-width: 1300px) {
  .p-coop_data__container {
    display: block;
  }
}
@media screen and (max-width: 960px) {
  .p-coop_data__container {
    padding: 4.8rem 2.4rem;
  }
}
@media screen and (max-width: 960px) and (min-width: 751px) {
  .p-coop_data__container {
    display: grid;
    grid-template-columns: min(45%, 32rem) auto;
    grid-template-rows: auto 1fr;
    gap: 0.6rem 1.2rem;
  }
}
.p-coop_data__container::after {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  border: 0.4rem solid var(--color-brown-dark);
  pointer-events: none;
  border-radius: 4rem;
}
.p-coop_data__header {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-coop_data__header {
    grid-column: 2/3;
    grid-row: 1/2;
    padding-top: 1rem;
  }
}
@media screen and (min-width: 961px) and (max-width: 1300px) {
  .p-coop_data__header {
    margin-bottom: 0.5rem;
  }
}
@media screen and (max-width: 960px) {
  .p-coop_data__header {
    padding-top: 0.5rem;
  }
}
@media screen and (max-width: 960px) and (min-width: 751px) {
  .p-coop_data__header {
    grid-column: 2/3;
    grid-row: 1/2;
    padding-top: 0.5rem;
    margin-bottom: 0;
  }
}
.p-coop_data__title {
  display: block;
  position: relative;
  font-size: calc(2.4rem * var(--ratio));
  letter-spacing: 0.3rem;
}
@media screen and (max-width: 1300px) {
  .p-coop_data__title {
    text-align: center;
  }
}
@media screen and (max-width: 960px) {
  .p-coop_data__title {
    font-size: 1.7rem;
    text-align: center;
  }
}
@media screen and (max-width: 960px) and (min-width: 751px) {
  .p-coop_data__title {
    text-align: left;
  }
}
.p-coop_data__thumb {
  display: grid;
  place-items: center;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-coop_data__thumb {
    grid-column: 1/2;
    grid-row: 1/3;
  }
}
@media screen and (min-width: 961px) and (max-width: 1300px) {
  .p-coop_data__thumb {
    width: 67%;
    margin: 0 auto 0.5rem;
  }
}
@media screen and (max-width: 960px) {
  .p-coop_data__thumb {
    width: 67%;
    margin: 0 auto 0.5rem;
  }
}
@media screen and (max-width: 960px) and (min-width: 751px) {
  .p-coop_data__thumb {
    grid-column: 1/2;
    grid-row: 1/3;
    width: 100%;
  }
}
.p-coop_data__thumb-img {
  display: block;
  position: relative;
}
.p-coop_data__inner {
  display: block;
  position: relative;
  overflow: hidden;
}
@media screen and (min-width: 961px) {
  .p-coop_data__inner {
    grid-column: 2/3;
    grid-row: 2/3;
  }
}
.p-coop_data__text {
  display: block;
  position: relative;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.8;
}
@media screen and (max-width: 960px) {
  .p-coop_data__text {
    font-size: 1.2rem;
  }
}
.p-coop_data__text a {
  text-decoration: underline;
}
@media (hover: hover) and (pointer: fine) {
  .p-coop_data__text a:hover {
    text-decoration: none;
  }
}
.p-coop_data__text img {
  max-width: 100%;
  height: auto !important;
  position: relative;
}
.p-coop_data__text p {
  display: block;
  margin: 0 0 1rem;
}
.p-coop_data__text iframe {
  max-width: 100%;
}
@supports (aspect-ratio: 16/9) {
  .p-coop_data__text iframe {
    width: 100%;
    display: block;
    height: auto !important;
    aspect-ratio: 16/9;
  }
}
.p-coop_data__scene {
  display: block;
  position: relative;
  margin-top: 2rem;
}
@media screen and (max-width: 960px) {
  .p-coop_data__scene {
    margin-top: 1.5rem;
  }
}

.p-coop_data_scene {
  display: flex;
  justify-content: flex-start;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-coop_data_scene {
    height: 100%;
  }
}
.p-coop_data_scene__header {
  width: calc(2rem * var(--ratio));
  display: block;
  position: relative;
  margin-right: calc(1.2rem * var(--ratio));
  padding-left: 0.6rem;
}
@media screen and (max-width: 960px) {
  .p-coop_data_scene__header {
    width: 1.4rem;
    padding-left: 0.8rem;
    margin-right: 1.5rem;
  }
}
.p-coop_data_scene__header::before {
  content: "";
  width: 0.4rem;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  border-left: 0.4rem solid var(--color-brown-dark);
}
@media screen and (max-width: 960px) {
  .p-coop_data_scene__header::before {
    border-left-width: 0.3rem;
  }
}
.p-coop_data_scene__cap {
  display: block;
  position: relative;
  font-size: calc(1.2rem * var(--ratio));
  font-family: eurostile, toppan-bunkyu-midashi-go-std, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  writing-mode: vertical-lr;
  line-height: 1;
}
@media screen and (max-width: 960px) {
  .p-coop_data_scene__cap {
    width: 1.4rem;
    font-size: 1rem;
  }
}
.p-coop_data_scene__inner {
  flex: 1 1 0;
  max-width: 40rem;
  min-width: 0;
  display: block;
  position: relative;
}
.p-coop_data_scene__list {
  width: 100%;
  display: block;
  position: relative;
  margin: 0 auto;
  font-size: 0;
  letter-spacing: -0.4em;
  white-space: nowrap;
  overflow: hidden;
}
.p-coop_data_scene__list-item {
  display: inline-block;
  position: relative;
  vertical-align: top;
  font-size: 1rem;
  letter-spacing: normal;
  white-space: normal;
}
.p-coop_data_scene__thumb {
  display: block;
  position: relative;
}
.p-coop_data_scene__thumb-img {
  display: block;
  position: relative;
}
.p-coop_data_scene__pagination {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  position: relative;
  margin-top: calc(1.2rem * var(--ratio));
}
.p-coop_data_scene__pagination-item {
  width: 0.8rem;
  height: 0.8rem;
  display: block;
  position: relative;
}
@media not all and (-webkit-min-device-pixel-ratio: 0), not all and (min-resolution: 0.001dpcm) {
  @supports not (translate: none) {
    .p-coop_data_scene__pagination-item {
      margin: 0 0.25rem 0.5rem;
    }
  }
}
.p-coop_data_scene__pagination-item::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: var(--color-brown-dark);
  opacity: 0;
}
.p-coop_data_scene__pagination-item.is-current::before {
  opacity: 1;
}

.p-coop_data_scene__pagination-item::after {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  border: 0.2rem solid var(--color-brown-dark);
}