/* ===============================================### 
共通設定
###=============================================== */
.FU241226onepiece{
  --font-ja: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "Yu Gothic", "Open Sans", "メイリオ", sans-serif;
  --font-en01: "pragmatica", sans-serif;
  --font-en02: "fields-display", sans-serif;
  --color-gray01: #aeb6bf;
  --color-gray02: #edf1f2;
  --color-pink: #f9e7e7;
  --color-black: #333333;
  color: #000;
  overflow: hidden;
}

.FU241226onepiece img,
.FU241226onepiece svg{
  width: 100%;
  height: auto;
}

/* ===========### PC版用設定 ###=========== */
@media screen and (min-width: 768px) {
  .FU241226onepiece .pc-visible{
    display: block;
  }

  .FU241226onepiece .sp-visible{
    display: none;
  }

  .FU241226onepiece .image-bg{
    background-color: #ffffff;
  }

  .FU241226onepiece .image-bg a:hover{
    opacity: 0.7;
  }
}

/* ===========### SP版用設定 ###=========== */
@media screen and (max-width: 767px) {
  .FU241226onepiece .pc-visible{
    display: none;
  }
  
  .FU241226onepiece .sp-visible{
    display: block;
  }
}



/* ===============================================### 
アニメーション設定
###=============================================== */
/************** fade **************/
/*** image ***/
.FU241226onepiece .js-fade-mv,
.FU241226onepiece .js-fade-in {
  visibility: hidden;
  opacity: 0;
  transition: visibility 1s ease, opacity 1s ease;
}

.FU241226onepiece .js-fade-mv.show,
.FU241226onepiece .js-fade-in.show {
  visibility: visible;
  opacity: 1;
}

/*** decoration ***/
.FU241226onepiece .fade-anime {
  opacity: 0;
  -webkit-animation: opa 1.8s cubic-bezier(0.51, 0.21, 0.41, 1) 0.4s 1 forwards;
          animation: opa 1.8s cubic-bezier(0.51, 0.21, 0.41, 1) 0.4s 1 forwards;
  -webkit-mask-image: linear-gradient(-25deg, transparent, transparent 39.6666666667%, rgba(0, 0, 0, 0.02) 43.3333333333%, rgba(0, 0, 0, 0.08) 45%, rgba(0, 0, 0, 0.18) 46.6666666667%, rgba(0, 0, 0, 0.32) 48.3333333333%, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.68) 51.6666666667%, rgba(0, 0, 0, 0.82) 53.3333333333%, rgba(0, 0, 0, 0.92) 55%, rgba(0, 0, 0, 0.98) 56.6666666667%, #000 58.3333333333%, #000);
          mask-image: linear-gradient(-25deg, transparent, transparent 39.6666666667%, rgba(0, 0, 0, 0.02) 43.3333333333%, rgba(0, 0, 0, 0.08) 45%, rgba(0, 0, 0, 0.18) 46.6666666667%, rgba(0, 0, 0, 0.32) 48.3333333333%, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.68) 51.6666666667%, rgba(0, 0, 0, 0.82) 53.3333333333%, rgba(0, 0, 0, 0.92) 55%, rgba(0, 0, 0, 0.98) 56.6666666667%, #000 58.3333333333%, #000);
  -webkit-mask-repeat: none;
          mask-repeat: none;
  -webkit-mask-position: center 100%;
          mask-position: center 100%;
  -webkit-mask-size: 100% max(300%, 100vh);
          mask-size: 100% max(300%, 100vh);
  transform: translateZ(0);
  transition: -webkit-mask-position 1.6s 0.4s linear;
  transition: mask-position 1.6s 0.4s linear;
  transition: mask-position 1.6s 0.4s linear, -webkit-mask-position 1.6s 0.4s linear;
  transition: mask-position 1.6s 0.4s linear, -webkit-mask-position 1.4s linear;
}

.FU241226onepiece .fade-anime.show {
  -webkit-mask-position: center 0;
          mask-position: center 0;
}
@-webkit-keyframes opa {
  0% {
    opacity: 0;
    filter: blur(4px);
  }
  100% {
    opacity: 1;
    filter: blur(0);
  }
}
@keyframes opa {
  0% {
    opacity: 0;
    filter: blur(4px);
  }
  100% {
    opacity: 1;
    filter: blur(0);
  }
}



/* ===============================================### 
コンテンツ共通設定
###=============================================== */
.FU241226onepiece .credit{
  font-family: var(--font-en01);
  font-size: 1.2rem;
  font-feature-settings: "palt";
  letter-spacing: 0.05em;
  text-align: right;
  white-space: nowrap;
}

.FU241226onepiece .credit a{
  display: inline-block;
  margin-bottom: 1.6rem;
  border-bottom: 0.1rem solid #999999;
}

.FU241226onepiece .link_disable{
  pointer-events: none;
}

/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  .FU241226onepiece .credit{
    font-size: calc(22 * (100vw / 750));
    letter-spacing: 0.05em;
  }

  .FU241226onepiece .credit a{
    display: inline-block;
    margin-bottom: calc(27 * (100vw / 750));
    border-bottom: calc(2 * (100vw / 750)) solid #999999;
  }
}


/* ===============================================### 
MV
###=============================================== */
.FU241226onepiece .mv{
  
}

.FU241226onepiece .mv .content-inner{

}

.FU241226onepiece .mv .image-wrapper{
  width: 100%;
  background-color: var(--color-gray01);
}

.FU241226onepiece .mv .item-wrapper{
  position: relative;
  width: 120rem;
  margin-inline: auto;
  padding-top: 3.1rem;
  padding-bottom: 3rem;
}

.FU241226onepiece .mv .item-wrapper::after{
  content: '';
  position: absolute;
  top: -5rem;
  right: -24.2rem;
  width: 77rem;
  height: 78rem;
  background-image: url('../img/pc/mv_decoration.svg');
  background-repeat: no-repeat;
  background-size: contain;
}

/************** grid **************/
.FU241226onepiece .mv .grid-wrapper{
  display: grid;
  grid-template-columns: 77.9rem 3rem 16.5rem 5.9rem 16.6rem;
  grid-template-rows: 1.9rem 28rem 2.1rem 27.9rem 2rem;
}

.FU241226onepiece .mv .grid__item01{
  position: relative;
  grid-column: 1/2;
  grid-row: 1/6;
  z-index: 1;
}

.FU241226onepiece .mv .grid__item02{
  position: relative;
  grid-column: 4/6;
  grid-row: 2/4;
  z-index: 1;
}

.FU241226onepiece .mv .grid__item03{
  position: relative;
  grid-column: 3/5;
  grid-row: 3/5;
  z-index: 1;
}

/************** text **************/
.FU241226onepiece .mv__text{
  margin-top: 9.4rem;
  font-family: var(--font-ja);
  font-size: 1.3rem;
  line-height: 2.2;
  font-feature-settings: "palt";
  letter-spacing: 0.05em;
  text-align: center;
}

/* Firefox */
@-moz-document url-prefix() {
  .FU241226onepiece .mv__text {
      font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "Yu Gothic", "Open Sans", "メイリオ", sans-serif;
  }
}

/************** image **************/
.FU241226onepiece .mv .grid__item01 .grid__image{
  width: 78rem;
}

.FU241226onepiece .mv .grid__item02 .grid__image{
  width: 22.5rem;
}

.FU241226onepiece .mv .grid__item03 .grid__image{
  width: 22.5rem;
}


/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  .FU241226onepiece .mv .image-wrapper{
    position: relative;
    width: calc(750 * (100vw / 750));
  }

  .FU241226onepiece .mv .item-wrapper{
    width: calc(750 * (100vw / 750));
    padding-top: calc(207 * (100vw / 750));
    padding-bottom: calc(88 * (100vw / 750));
  }

  .FU241226onepiece .mv .item-wrapper::after{
    top: calc(2 * (100vw / 750));
    right: initial;
    left: 0;
    width: calc(750 * (100vw / 750));
    height: calc(900 * (100vw / 750));
    background-image: url('../img/sp/mv_decoration.svg');
  }

  /************** grid **************/
  .FU241226onepiece .mv .grid-wrapper{
    display: grid;
    grid-template-columns: calc(225 * (100vw / 750)) calc(21 * (100vw / 750)) calc(486 * (100vw / 750));
    grid-template-rows: calc(300 * (100vw / 750)) calc(7 * (100vw / 750)) calc(300 * (100vw / 750));
  }

  .FU241226onepiece .mv .grid__item01{
    grid-column: 3/4;
    grid-row: 1/4;
  }

  .FU241226onepiece .mv .grid__item02{
    grid-column: 1/2;
    grid-row: 1/2;
  }

  .FU241226onepiece .mv .grid__item03{
    grid-column: 1/2;
    grid-row: 3/4;
  }

  /************** text **************/
  .FU241226onepiece .mv__text{
    margin-top: calc(126 * (100vw / 750));
    font-size: calc(24 * (100vw / 750));
  }

  /************** image **************/
  .FU241226onepiece .mv .grid__item01 .grid__image{
    width: calc(486 * (100vw / 750));
  }

  .FU241226onepiece .mv .grid__item02 .grid__image{
    width: calc(225 * (100vw / 750));
  }

  .FU241226onepiece .mv .grid__item03 .grid__image{
    width: calc(225 * (100vw / 750));
  }

  .FU241226onepiece .mv .title__text.text01{
    position: absolute;
    top: calc(36 * (100vw / 750));
    left: 50%;
    transform: translateX(-50%);
    width: calc(481 * (100vw / 750));
  }

  .FU241226onepiece .mv .title__text.text02{
    position: absolute;
    bottom: calc(7 * (100vw / 750));
    left: calc(174 * (100vw / 750));
    width: calc(464 * (100vw / 750));
  }
}




/* ===============================================### 
コンテンツ01
###=============================================== */
.FU241226onepiece .content01{
  margin-top: 9rem;
}

.FU241226onepiece .content01 .content-inner{
  width: 60rem;
  margin-inline: auto;
  padding-top: 9.6rem;
}

.FU241226onepiece .content01 .text-wrapper{
  position: relative;
  width: fit-content;
  margin-inline: auto;
}

/************** grid **************/
.FU241226onepiece .content01 .grid-wrapper{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3rem;
}

/************** text **************/
.FU241226onepiece .content01 .color__text{
  margin-top: 1.5rem;
  font-family: var(--font-en02);
  font-size: 1.5rem;
  font-feature-settings: "palt";
  letter-spacing: 0.05em;
  text-align: center;
}

.FU241226onepiece .content01 .content__text{
  margin-top: 5.3rem;
  font-family: var(--font-en02);
  font-feature-settings: "palt";
  letter-spacing: 0.15em;
  text-align: center;
}

.FU241226onepiece .content01 .content__text .text01{
  font-size: 2.2rem;
  line-height: 1.7;
}

.FU241226onepiece .content01 .content__text .text02{
  margin-top: 3.3rem;
  font-size: 1.5rem;
  letter-spacing: 0.075em;
}

/************** image **************/
.FU241226onepiece .content01 .grid__image{
  width: 18rem;
}

.FU241226onepiece .content01 .decoration__image{
  position: absolute;
}

.FU241226onepiece .content01 .decoration__image.decoration01{
  top: -1.3rem;
  left: -8.6rem;
  width: 5rem;
}

.FU241226onepiece .content01 .decoration__image.decoration02{
  bottom: 3.6rem;
  right: -8.6rem;
  width: 5rem;
}

/************** banner **************/
.FU241226onepiece .info__banner{
  position: relative;
  width: 100%;
  margin-top: 6.2rem;
  background-color: var(--color-pink);
  z-index: 1;
}

.FU241226onepiece .banner__text{
  position: relative;
  font-family: var(--font-en02);
  font-size: 2.2rem;
  letter-spacing: 0.075em;
  text-align: center;
  padding-top: 3.1rem;
  padding-bottom: 3.4rem;
}

.FU241226onepiece .banner__text span{
  font-size: 1.5rem;
}

.FU241226onepiece .banner__text::after{
  content: '';
  position: absolute;
  bottom: 2.9rem;
  left: 50%;
  transform: translateX(-50%);
  width: 38.2rem;
  height: 0.1rem;
  background-color: var(--color-black);
  z-index: 1;
}

/************** back-ground **************/
.FU241226onepiece .content01 .content-bg{
  position: relative;
  width: 100%;
  background-color: var(--color-gray02);
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  height: 49rem;
  margin-left: -10rem;
  margin-right: -10rem;
  padding-left: 10rem;
  padding-right: 10rem;
  margin-bottom: 11.4rem;
}

.FU241226onepiece .content01 .content-bg::after{
  content: '';
  position: absolute;
  top: 16rem;
  width: 100%;
  height: 44.4rem;
  background-color: var(--color-gray02);
  z-index: -1;
}


/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  .FU241226onepiece .content01{
    margin-top: calc(140 * (100vw / 750));
  }

  .FU241226onepiece .content01 .content-inner{
    width: calc(688 * (100vw / 750));
    margin-inline: auto;
    padding-top: calc(134 * (100vw / 750));
  }

  /************** grid **************/
  .FU241226onepiece .content01 .grid-wrapper{
    gap: calc(20 * (100vw / 750));
  }

  /************** text **************/
  .FU241226onepiece .content01 .color__text{
    margin-top: calc(30 * (100vw / 750));
    font-size: calc(26 * (100vw / 750));
  }

  .FU241226onepiece .content01 .content__text{
    margin-top: calc(60 * (100vw / 750));
  }

  .FU241226onepiece .content01 .content__text .text01{
    font-size: calc(40 * (100vw / 750));
  }

  .FU241226onepiece .content01 .content__text .text02{
    margin-top: calc(38 * (100vw / 750));
    font-size: calc(26 * (100vw / 750));
  }

  /************** image **************/
  .FU241226onepiece .content01 .grid__image{
    width: calc(216 * (100vw / 750));
  }

  .FU241226onepiece .content01 .decoration__image.decoration01{
    top: calc(-8 * (100vw / 750));
    left: calc(-133 * (100vw / 750));
    width: calc(80 * (100vw / 750));
  }

  .FU241226onepiece .content01 .decoration__image.decoration02{
    bottom: calc(61 * (100vw / 750));
    right: calc(-134 * (100vw / 750));
    width: calc(80 * (100vw / 750));
  }

  /************** banner **************/
  .FU241226onepiece .info__banner{
    margin-top: calc(60 * (100vw / 750));
    background-color: var(--color-pink);
    z-index: 1;
  }

  .FU241226onepiece .banner__text{
    font-size: calc(36 * (100vw / 750));
    padding-top: calc(49 * (100vw / 750));
    padding-bottom: calc(57 * (100vw / 750));
  }

  .FU241226onepiece .banner__text span{
    font-size: calc(24 * (100vw / 750));
  }

  .FU241226onepiece .banner__text::after{
    bottom: calc(48 * (100vw / 750));
    width: calc(630 * (100vw / 750));
    height: calc(1 * (100vw / 750));
  }

  /************** back-ground **************/
  .FU241226onepiece .content01 .content-bg{
    width: initial;
    height: calc(250 * (100vw / 750));
    margin-left: calc(-100 * (100vw / 750));
    margin-right: calc(-100 * (100vw / 750));
    margin-bottom: calc(570 * (100vw / 750));
    padding-left: calc(100 * (100vw / 750));
    padding-right: calc(100 * (100vw / 750));
  }

  .FU241226onepiece .content01 .content-bg::after{
    content: '';
    position: absolute;
    top: calc(240 * (100vw / 750));
    width: calc(750 * (100vw / 750));
    height: calc(580 * (100vw / 750));
  }
}



/* ===============================================### 
コンテンツ02
###=============================================== */
.FU241226onepiece .content02{
  position: relative;
  width: 100%;
  /* padding-top: 18.8rem; */
  padding-top: 10rem;
}

.FU241226onepiece .content02 .content-inner{
  width: 61rem;
  margin-inline: auto;
}

.FU241226onepiece .content02 .content__item01{

}

.FU241226onepiece .content02 .content__item02{
  margin-top: 4rem;
}

.FU241226onepiece .content02 .content__item03{
  position: relative;
  width: fit-content;
  margin-top: 8rem;
  margin-inline: auto;
}

/************** flex **************/
.FU241226onepiece .content02 .flex-wrapper{
  display: flex;
  justify-content: space-between;
}

/************** text **************/
.FU241226onepiece .content02 .credit{
  margin-top: 9.2rem;
  text-align: center;
}

.FU241226onepiece .content02 .credit a:nth-of-type(2),
.FU241226onepiece .content02 .credit a:nth-of-type(3),
.FU241226onepiece .content02 .credit a:nth-of-type(4),
.FU241226onepiece .content02 .credit a:nth-of-type(6),
.FU241226onepiece .content02 .credit a:nth-of-type(7),
.FU241226onepiece .content02 .credit a:nth-of-type(8){
  margin-left: 1.2rem;
}

/************** image **************/
.FU241226onepiece .content02 .content__item01 .content__image{
  width: 42rem;
  margin-inline: auto;
}

.FU241226onepiece .content02 .content__item02 .content__image{
  width: 30rem;
}

.FU241226onepiece .content02 .content__item03 .content__image{
  width: 42rem;
}

.FU241226onepiece .content02 .content__item03 .content__text{
  position: absolute;
  bottom: -4.1rem;
  right: -5rem;
  width: 24rem;
  pointer-events: none;
}

.FU241226onepiece .content02 .content__item03 .decoration__image{
  position: absolute;
  top: -3rem;
  left: -7rem;
  width: 18rem;
  z-index: 1;
}

.FU241226onepiece .content02 .decoration__image{
  position: absolute;
  /* top: 26.8rem; */
  top: 18.1rem;
  width: 100%;
  z-index: -1;
}


/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  .FU241226onepiece .content02{
    padding-top: calc(140 * (100vw / 750));
  }

  .FU241226onepiece .content02 .content-inner{
    width: calc(750 * (100vw / 750));
  }

  .FU241226onepiece .content02 .content__item01{

  }

  .FU241226onepiece .content02 .content__item02{
    margin-top: calc(61 * (100vw / 750));
  }

  .FU241226onepiece .content02 .content__item03{
    margin-top: calc(62 * (100vw / 750));
  }

  /************** text **************/
  .FU241226onepiece .content02 .credit{
    margin-top: calc(141 * (100vw / 750));
  }

  .FU241226onepiece .content02 .credit a:nth-of-type(4),
  .FU241226onepiece .content02 .credit a:nth-of-type(7){
    margin-left: 0;
  }

  .FU241226onepiece .content02 .credit a:nth-of-type(2),
  .FU241226onepiece .content02 .credit a:nth-of-type(3),
  .FU241226onepiece .content02 .credit a:nth-of-type(5),
  .FU241226onepiece .content02 .credit a:nth-of-type(6),
  .FU241226onepiece .content02 .credit a:nth-of-type(8){
    margin-left: calc(15 * (100vw / 750));
  }

  /************** image **************/
  .FU241226onepiece .content02 .content__item01 .content__image{
    width: calc(570 * (100vw / 750));
  }

  .FU241226onepiece .content02 .content__item02 .content__image{
    width: calc(372 * (100vw / 750));
  }

  .FU241226onepiece .content02 .content__item03 .content__image{
    width: calc(570 * (100vw / 750));
  }

  .FU241226onepiece .content02 .content__item03 .content__text{
    position: absolute;
    bottom: calc(-67*(100vw / 750));
    right: calc(-70*(100vw / 750));
    width: calc(384 * (100vw / 750));
  }

  .FU241226onepiece .content02 .content__item03 .decoration__image{
    position: absolute;
    top: calc(-30*(100vw / 750));
    left: calc(-59*(100vw / 750));
    width: calc(180*(100vw / 750));
    z-index: 1;
    pointer-events: none;
  }

  .FU241226onepiece .content02 .decoration__image{
    /* top: 26.8rem; */
    top: calc(262*(100vw / 750));
    width: calc(750*(100vw / 750));
  }
}



/* ===============================================### 
コンテンツ03
###=============================================== */
.FU241226onepiece .content03{
  margin-top: 8.6rem;
}

.FU241226onepiece .content03 .content-inner{
  width: 70rem;
  margin-inline: auto;
  padding-top: 9.8rem;
  padding-bottom: 10rem;
}

.FU241226onepiece .content03 .content__item01{

}

.FU241226onepiece .content03 .content__item02{
  position: relative;
  width: fit-content;
}

.FU241226onepiece .content03 .content__item03{
  position: relative;
  width: fit-content;
}

/************** grid **************/
.FU241226onepiece .content03 .grid-wrapper{
  display: grid;
  grid-template-columns: 14.9rem 15.3rem 5.7rem 27rem 15.1rem;
  grid-template-rows: 64rem 6rem 12rem 28rem 28rem;
  margin-left: -4rem;
}

.FU241226onepiece .content03 .grid__item01{
  grid-column: 2/5;
  grid-row: 1/2;
}

.FU241226onepiece .content03 .grid__item02{
  grid-column: 1/3;
  grid-row: 3/5;
}

.FU241226onepiece .content03 .grid__item03{
  grid-column: 4/6;
  grid-row: 4/6;
}

/************** text **************/
.FU241226onepiece .content03 .credit{
  margin-top: 4rem;
  text-align: center;
}

.FU241226onepiece .content03 .credit a:nth-of-type(2),
.FU241226onepiece .content03 .credit a:nth-of-type(3),
.FU241226onepiece .content03 .credit a:nth-of-type(5),
.FU241226onepiece .content03 .credit a:nth-of-type(6),
.FU241226onepiece .content03 .credit a:nth-of-type(7){
  margin-left: 1.2rem;
}

/************** image **************/
.FU241226onepiece .content03 .content__item01 .content__image{
  width: 48rem;
}

.FU241226onepiece .content03 .content__item02 .content__image{
  width: 30rem;
}

.FU241226onepiece .content03 .content__item03 .content__image{
  width: 42rem;
}

.FU241226onepiece .content03 .content__item02 .decoration__image{
  position: absolute;
  bottom: -24rem;
  left: -14rem;
  width: 28rem;
  pointer-events: none;
}

.FU241226onepiece .content03 .content__item03 .content__text{
  position: absolute;
  top: -4rem;
  right: -6.1rem;
  width: 18rem;
  pointer-events: none;
}

/************** back-ground **************/
.FU241226onepiece .content03 .content-bg{
  position: relative;
  width: 100%;
  background-color: var(--color-pink);
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  height: 53rem;
  margin-left: -10rem;
  margin-right: -10rem;
  padding-left: 10rem;
  padding-right: 10rem;
  margin-bottom: 113.3rem;
}

.FU241226onepiece .content03 .content-bg::after{
  content: '';
  position: absolute;
  top: 17rem;
  width: 100%;
  height: 149.3rem;
  background-color: var(--color-pink);
  z-index: -1;
}


/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  .FU241226onepiece .content03{
    margin-top: calc(116 * (100vw / 750));
  }

  .FU241226onepiece .content03 .content-inner{
    width: calc(750 * (100vw / 750));
    padding-top: calc(140 * (100vw / 750));
    padding-bottom: calc(100 * (100vw / 750));
  }

  .FU241226onepiece .content03 .content__item01{
    width: fit-content;
    margin-left: calc(163 * (100vw / 750));
    margin-right: auto;
  }

  .FU241226onepiece .content03 .content__item02{
    position: relative;
    width: fit-content;
    margin-top: calc(58*(100vw / 750));
    margin-left: calc(400*(100vw / 750));
  }

  .FU241226onepiece .content03 .content__item03{
    position: relative;
    width: fit-content;
    margin-top: calc(140 * (100vw / 750));
    margin-left: calc(162 * (100vw / 750));
    margin-right: auto;
  }

  /************** grid **************/
  .FU241226onepiece .content03 .grid-wrapper{
    display: block;
  }

  /************** text **************/
  .FU241226onepiece .content03 .credit{
    margin-top: calc(73 * (100vw / 750));
    text-align: center;
  }

  .FU241226onepiece .content03 .credit a:nth-of-type(7){
    margin-left: 0;
  }

  .FU241226onepiece .content03 .credit a:nth-of-type(2),
  .FU241226onepiece .content03 .credit a:nth-of-type(3),
  .FU241226onepiece .content03 .credit a:nth-of-type(5),
  .FU241226onepiece .content03 .credit a:nth-of-type(6){
    margin-left: calc(15 * (100vw / 750));
  }

  /************** image **************/
  .FU241226onepiece .content03 .content__item01 .content__image{
    width: calc(570 * (100vw / 750));
  }

  .FU241226onepiece .content03 .content__item02 .content__image{
    width: calc(420 * (100vw / 750));
  }

  .FU241226onepiece .content03 .content__item03 .content__image{
    width: calc(570 * (100vw / 750));
  }

  .FU241226onepiece .content03 .content__item02 .decoration__image{
    bottom: calc(-60*(100vw / 750));
    left: calc(-308*(100vw / 750));
    width: calc(364 * (100vw / 750));
  }

  .FU241226onepiece .content03 .content__item03 .content__text{
    top: calc(-49*(100vw / 750));
    right: calc(-81*(100vw / 750));
    width: calc(288 * (100vw / 750));
  }

  /************** back-ground **************/
  .FU241226onepiece .content03 .content-bg{
    width: initial;
    height: calc(383 * (100vw / 750));
    margin-left: calc(-100 * (100vw / 750));
    margin-right: calc(-100 * (100vw / 750));
    margin-bottom: calc(2414 * (100vw / 750));
    padding-left: calc(100 * (100vw / 750));
    padding-right: calc(100 * (100vw / 750));
  }

  .FU241226onepiece .content03 .content-bg::after{
    content: '';
    position: absolute;
    top: calc(300 * (100vw / 750));
    width: calc(750 * (100vw / 750));
    height: calc(2460 * (100vw / 750));
  }
}




/* ===============================================### 
コンテンツ04
###=============================================== */
.FU241226onepiece .content04{
  padding-top: 10rem;
}

.FU241226onepiece .content04 .content-inner{

}

.FU241226onepiece .content04 .content__item01{
  position: relative;
  width: fit-content;
  margin-inline: auto;
}

.FU241226onepiece .content04 .content__item02{
  position: relative;
  width: 61rem;
  margin-top: 13rem;
  margin-inline: auto;
}

.FU241226onepiece .content04 .content__item02::after{
  content: '';
  position: absolute;
  top: -6.6rem;
  left: 50%;
  transform: translateX(-50%);
  background-image: url('../img/pc/content04_decoration04.svg');
  background-repeat: no-repeat;
  background-size: contain;
  width: 94rem;
  height: 94rem;
  pointer-events: none;
}

/************** grid **************/
.FU241226onepiece .content04 .grid-wrapper{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 1rem;
}

.FU241226onepiece .content04 .grid__item01{
}

.FU241226onepiece .content04 .grid__item02{
  position: relative;
  z-index: 1;
}

.FU241226onepiece .content04 .grid__item03{
  position: relative;
  z-index: 1;
}

.FU241226onepiece .content04 .grid__item04{
}

/************** text **************/
.FU241226onepiece .content04 .credit{
  margin-top: 11.2rem;
  text-align: center;
}

.FU241226onepiece .content04 .credit a:nth-of-type(2),
.FU241226onepiece .content04 .credit a:nth-of-type(3),
.FU241226onepiece .content04 .credit a:nth-of-type(4),
.FU241226onepiece .content04 .credit a:nth-of-type(6),
.FU241226onepiece .content04 .credit a:nth-of-type(7){
  margin-left: 1.2rem;
}

/************** image **************/
.FU241226onepiece .content04 .content__item01 .content__image{
  width: 45rem;
}

.FU241226onepiece .content04 .grid__item01 .content__image,
.FU241226onepiece .content04 .grid__item02 .content__image,
.FU241226onepiece .content04 .grid__item03 .content__image,
.FU241226onepiece .content04 .grid__item04 .content__image{
  width: 30rem;
}

.FU241226onepiece .content04 .content__item01 .content__text{
  position: absolute;
  top: -4rem;
  left: -5rem;
  width: 24rem;
  z-index: 1;
  pointer-events: none;
}

.FU241226onepiece .content04 .content__item01 .decoration__image{
  position: absolute;
  bottom: -5rem;
  right: -12.9rem;
  width: 19rem;
  z-index: 1;
  pointer-events: none;
}

.FU241226onepiece .content04 .content__item02 .decoration__image.decoration01{
  position: absolute;
  top: -5rem;
  left: -9rem;
  width: 18rem;
  z-index: 1;
  pointer-events: none;
}

.FU241226onepiece .content04 .content__item02 .decoration__image.decoration02{
  position: absolute;
  bottom: 3rem;
  right: -12.5rem;
  width: 14rem;
  z-index: 1;
  pointer-events: none;
}


/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  .FU241226onepiece .content04{
    padding-top: calc(100 * (100vw / 750));
  }

  .FU241226onepiece .content04 .content__item02{
    width: calc(750 * (100vw / 750));
    margin-top: calc(203 * (100vw / 750));
  }

  .FU241226onepiece .content04 .content__item02::after{
    top: calc(-89 * (100vw / 750));
    background-image: url('../img/sp/content04_decoration04.svg');
    width: calc(980 * (100vw / 750));
    height: calc(1170 * (100vw / 750));
  }

  /************** grid **************/
  .FU241226onepiece .content04 .grid-wrapper{
    gap: calc(6 * (100vw / 750));
  }

  .FU241226onepiece .content04 .grid__item01{
  }

  .FU241226onepiece .content04 .grid__item02{
  }

  .FU241226onepiece .content04 .grid__item03{
  }

  .FU241226onepiece .content04 .grid__item04{
  }

  /************** text **************/
  .FU241226onepiece .content04 .credit{
    margin-top: calc(177 * (100vw / 750));
  }

  .FU241226onepiece .content04 .credit a:nth-of-type(4),
  .FU241226onepiece .content04 .credit a:nth-of-type(7){
    margin-left: 0;
  }

  .FU241226onepiece .content04 .credit a:nth-of-type(2),
  .FU241226onepiece .content04 .credit a:nth-of-type(3),
  .FU241226onepiece .content04 .credit a:nth-of-type(5),
  .FU241226onepiece .content04 .credit a:nth-of-type(6){
    margin-left: calc(15 * (100vw / 750));
  }

  /************** image **************/
  .FU241226onepiece .content04 .content__item01 .content__image{
    width: calc(570 * (100vw / 750));
  }

  .FU241226onepiece .content04 .grid__item01 .content__image,
  .FU241226onepiece .content04 .grid__item02 .content__image,
  .FU241226onepiece .content04 .grid__item03 .content__image,
  .FU241226onepiece .content04 .grid__item04 .content__image{
    width: calc(372 * (100vw / 750));
  }

  .FU241226onepiece .content04 .content__item01 .content__text{
    top: calc(-58*(100vw / 750));
    left: calc(-61*(100vw / 750));
    width: calc(384 * (100vw / 750));
  }

  .FU241226onepiece .content04 .content__item01 .decoration__image{
    bottom: calc(-62*(100vw / 750));
    right: calc(-70*(100vw / 750));
    width: calc(247 * (100vw / 750));
  }

  .FU241226onepiece .content04 .content__item02 .decoration__image.decoration01{
    top: calc(-140*(100vw / 750));
    left: calc(20*(100vw / 750));
    width: calc(180 * (100vw / 750));
  }

  .FU241226onepiece .content04 .content__item02 .decoration__image.decoration02{
    bottom: calc(206*(100vw / 750));
    right: calc(305*(100vw / 750));
    width: calc(140*(100vw / 750));
    z-index: 2;
  }
}



/* ===============================================### 
その他コンテンツ
###=============================================== */
.FU241226onepiece .others{
  width: 90rem;
  margin-top: 10.7rem;
  margin-bottom: 13rem;
  margin-inline: auto;
}

.FU241226onepiece .staff__text{
  font-family: var(--font-en01);
  font-size: 1.2rem;
  line-height: 2;
  letter-spacing: 0.05em;
  text-align: center;
  font-feature-settings: "palt";
}

.FU241226onepiece .link__button{
  width: 100%;
  margin-top: 3.7rem;
  font-family: var(--font-en01);
  font-size: 2rem;
  letter-spacing: 0.075em;
  text-align: center;
  font-feature-settings: "pwid";
  color: #fff;
  background-color: var(--color-black);
}

.FU241226onepiece .others .link__button a{
  display: block;
  padding-top: 2rem;
  padding-bottom: 2rem;
}


/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  .FU241226onepiece .others{
    width: calc(600 * (100vw / 750));
    margin-top: calc(147 * (100vw / 750));
    margin-bottom: calc(180 * (100vw / 750));
  }

  .FU241226onepiece .staff__text{
    font-size: calc(22 * (100vw / 750));
  }

  .FU241226onepiece .link__button{
    margin-top: calc(71 * (100vw / 750));
    font-size: calc(38 * (100vw / 750));
  }

  .FU241226onepiece .others .link__button a{
    padding-top: calc(36 * (100vw / 750));
    padding-bottom: calc(29 * (100vw / 750));
  }
}