@charset "utf-8";
/* ↓↓↓ common ↓↓↓ */
.about {
  --conts_color: var(--about_color);
}
.story {
  --conts_color: var(--story_color);
}
.recycle {
  --conts_color: var(--recycle_color);
}
.movie {
  --conts_color: var(--movie_color);
}
.keywords {
  --conts_color: var(--keywords_color);
}
.news {
  --conts_color: var(--news_color);
}
main {
  overflow: clip;
}
.conts_ttl {
  position: relative;
  width: fit-content;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 auto;
}
.conts_ttl::after {
  content: '';
  position: absolute;
  width: 2.5193798449612403cqw;
  height: auto;
  aspect-ratio: 1/1;
  background-image: url(../img/top/conts_ttl_deco.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  translate: -50% 100%;
  bottom: -0.29069767441860467cqw;
  left: 50%;
}
@media screen and (max-width: 768px) {
  .conts_ttl::after {
    width: 16px;
    bottom: -4px;
  }
}
.conts_ttl .en {
  position: relative;
  width: fit-content;
  font-size: 9.689922480620156cqw;
  font-family: var(--Livvic);
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0.05em;
  color: var(--conts_color);
  display: block;
  -webkit-text-stroke: 0.1937984496124031cqw #000;
}
@media screen and (max-width: 768px) {
  .conts_ttl .en {
    font-size: 5.6rem;
    -webkit-text-stroke: 1px #000;
  }
}
.conts_ttl .ja {
  position: relative;
  width: fit-content;
  font-size: clamp(1.4rem,1.744186046511628cqw,1.8rem);
  font-weight: 500;
  letter-spacing: 0.05em;
  color: #fff;
  background-color: #000;
  display: block;
  padding: 0.3875968992248062cqw 1.550387596899225cqw;
  margin: 1.937984496124031cqw auto 0;
}
@media screen and (max-width: 768px) {
.conts_ttl .ja {
    font-size: 1.6rem;
    padding: 4px 16px;
    margin: 16px auto 0;
  }
}
.more_btn {
  position: relative;
  width: 31.782945736434108cqw;
  font-size: clamp(2rem,2.3255813953488373cqw,24rem);
  font-family: var(--Livvic);
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.05em;
  text-align: center;
  border-radius: 9999px;
  border: 2px solid #000;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  filter: drop-shadow(0px 0.7751937984496124cqw 0px var(--conts_color));
  transform: translateZ(0px);
  transition: filter ease .3s, translate ease .3s;
  padding: 1.550387596899225cqw;
}
@media screen and (min-width: 769px) {
  .more_btn:hover {
    filter: drop-shadow(0px 0px 0px var(--conts_color));
    translate: 0 10%;
  }
}
@media screen and (max-width: 768px) {
  .more_btn {
    width: 240px;
    font-size: 2rem;
    border: 1px solid #000;
    filter: drop-shadow(0px 8px 0px var(--conts_color));
    padding: 17px;
  }
}
.more_btn::before {
  content: '';
  position: absolute;
  width: 2.5193798449612403cqw;
  height: auto;
  aspect-ratio: 26/10;
  background-image: url(../img/top/btn_arrow.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  translate: 0 -50%;
  top: 46%;
  right: 1.937984496124031cqw;
}
@media screen and (max-width: 768px) {
  .more_btn::before {
    width: 17px;
    right: 15px;
  }
}
.more_btn.outlink::before {
  content: '';
  position: absolute;
  width: 2.3255813953488373cqw;
  height: auto;
  aspect-ratio: 1/1;
  background-image: url(../img/top/btn_outlink.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  translate: 0 -50%;
  top: 48%;
  right: 2.3255813953488373cqw;
}
@media screen and (max-width: 768px) {
  .more_btn.outlink::before {
    width: 20px;
    right: 20px;
  }
}
/* ↑↑↑ common ↑↑↑ */
/* ↓↓↓ fv ↓↓↓ */
.fv {
  width: 100%;
  padding-top: min(9.765625vw,125px);
}
@media screen and (max-width: 768px) {
  .fv {
    padding-top: 136px;
  }
}
.fv .inner {
  position: relative;
  max-width: 1280px;
  container-type: inline-size;
  margin: 0 auto;
  z-index: 1;
}
.fv .ttl {
  position: relative;
  width: 57.96875cqw;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .fv .ttl {
    width: 350px;
  }
}
.fv .ttl_txt {
  width: 100%;
  display: block;
  opacity: 0;
  filter: 'blur(3px)';
}
.fv .ttl_deco {
  position: absolute;
  width: 100%;
  display: block;
  opacity: 0;
  filter: 'blur(3px)';
  top: 0;
  left: 0;
  z-index: -1;
}
.fv .fv_deco {
  position: relative;
  width: 34.765625cqw;
  translate: max(-2.03125vw,-26px) 0;
  margin: 3.28125cqw auto 0;
}
@media screen and (max-width: 768px) {
  .fv .fv_deco {
    width: 199px;
    translate: -9px 0;
    margin: 69px auto 0;
  }
}
.fv .fv_deco .cement {
  position: relative;
  width: 100%;
  opacity: 0;
  translate: 0 -20%;
  z-index: 1;
}
.fv .fv_deco .creatures {
  position: absolute;
  width: 92.421875cqw;
  display: block;
  opacity: 0;
  filter: 'blur(3px)';
  rotate: -10deg;
  bottom: 0;
  left: -25.624999999999996cqw;
  z-index: -1;
}
@media screen and (max-width: 768px) {
  .fv .fv_deco .creatures {
    width: 359px;
    bottom: -84px;
    left: -69px;
  }
}
.fv .fv_deco :is(.creatures01,.creatures02,.creatures03) {
  width: 100%;
  display: block;
}
.fv .fv_deco :is(.creatures02,.creatures03) {
  position: absolute;
  top: 0;
  left: 0;
}
.fv .lead_block {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding: min(20.625vw,264px) 30px 236px;
  margin: max(-7.8125vw,-100px) auto 0;
}
@media screen and (max-width: 768px) {
  .fv .lead_block {
    padding: 210px 19px 160px;
    margin: -45px auto 0;
  }
}
.fv .lead_block .earth {
  position: absolute;
  width: max(100%,1280px);
  height: 100%;
  display: block;
  opacity: 0;
  translate: -50% 20%;
  top: 0;
  left: 50%;
}
@media screen and (max-width: 768px) {
  .fv .lead_block .earth {
    width: 100%;
  }
}
.fv .lead_block .earth img {
  width: 100%;
  height: min(100%,1182px);
  object-fit: fill;
}
.fv .lead_block .lead_inner {
  max-width: 1032px;
  container-type: inline-size;
  margin: 0 auto;
}
.fv .lead_block .head {
  position: relative;
}
@media screen and (max-width: 768px) {
  .fv .lead_block .head {
    padding: 0 68px;
  }
}
.fv .lead_block .head::before {
  content: '';
  position: absolute;
  width: 75.1937984496124cqw;
  height: auto;
  aspect-ratio: 776/171;
  background-image: url(../img/top/fv_lead_deco.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  translate: -50% 0;
  bottom: -5.523255813953488cqw;
  left: 50%;
}
@media screen and (max-width: 768px) {
  .fv .lead_block .head::before {
    width: 317px;
    aspect-ratio: 317/116;
    background-image: url(../img/top/fv_lead_deco_sp.svg);
    bottom: -15px;
  }
}
.fv .lead_block .head .bubble {
  position: relative;
  width: fit-content;
  font-size: clamp(2rem,2.3255813953488373cqw,2.4rem);
  font-family: var(--Zen_Maru);
  font-weight: 700;
  letter-spacing: 0.12em;
  color: #002F02;
  background-color: #fff;
  border-radius: 9999px;
  display: block;
  padding: 0.5813953488372093cqw 3.10077519379845cqw;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .fv .lead_block .head .bubble {
    font-size: 1.8rem;
    padding: 7px 24px;
  }
}
.fv .lead_block .head .bubble::before {
  content: '';
  position: absolute;
  width:0;
  height:0;
  border-style:solid;
  border-width: 1.1627906976744187cqw 0.6782945736434108cqw 0 0.6782945736434108cqw;
  border-color: #FFFFFF transparent transparent transparent;
  translate: -50% 100%;
  bottom: 0;
  left: 50%;
}
@media screen and (max-width: 768px) {
  .fv .lead_block .head .bubble::before {
  border-width: 12px 7px 0 7px;
  }
}
.fv .lead_block .head .main_txt {
  width: fit-content;
  font-size: 3.10077519379845cqw;
  font-family: var(--Zen_Maru);
  font-weight: 700;
  line-height: 1.75;
  letter-spacing: 0.12em;
  color: #002F02;
  text-align: center;
  display: block;
  margin: 1.937984496124031cqw auto 0;
}
@media screen and (max-width: 768px) {
  .fv .lead_block .head .main_txt {
    font-size: 2.4rem;
    line-height: 1.6666666666666667;
    letter-spacing: 0.08em;
    margin: 16px auto 0;
  }
}
.fv .lead_block .lead_txt {
  position: relative;
  font-size: clamp(1.2rem,3.875968992248062cqw,1.6rem);
  font-weight: 500;
  line-height: 2.5;
  letter-spacing: 0.05em;
  text-align: center;
  margin-top: 9.689922480620156cqw;
}
@media screen and (max-width: 768px) {
  .fv .lead_block .lead_txt {
    font-size: 1.6rem;
    line-height: 2;
    margin-top: 60px;
  }
}
/* ↑↑↑ fv ↑↑↑ */
/* ↓↓↓ about ↓↓↓ */
.about {
  background-color: #fff;
  padding: min(26.328125000000004vw,337px) 0 max(min(16.40625vw,210px),180px);
  margin-top: max(-19.0625vw,-244px);
}
@media screen and (max-width: 768px) {
  .about {
    padding: 101px 0 120px;
    margin-top: -41px;
  }
}
.about .inner {
  position: relative;
  max-width: 1280px;
  padding: 0 30px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .about .inner {
    max-width: 600px;
    padding: 0 25px;
  }
}
.about .inner .deco {
  position: absolute;
}
.about .inner .deco01 {
  width: min(24.453125vw,313px);
  top: max(-3.515625vw,-45px);
  left: min(5.46875vw,70px);
}
.about .inner .deco02 {
  width: min(13.203124999999998vw,169px);
  top: max(-4.21875vw,-54px);
  right: min(13.359375000000002vw,171px);
}
.about .inner .deco03 {
  width: min(8.59375vw,110px);
  top: min(18.75vw,240px);
  left: min(7.968749999999999vw,102px);
}
.about .inner .deco04 {
  width: min(9.84375vw,126px);
  top: min(10.703125vw,137px);
  right: min(6.875000000000001vw,88px);
}
.about .inner .deco05 {
  width: min(12.65625vw,162px);
  bottom: max(-9.21875vw,-118px);
  right: min(10.78125vw,138px);
}
@media screen and (max-width: 768px) {
  .about .inner .deco01 {
    width: 113px;
    top: -47px;
    left: 7px;
  }
  .about .inner .deco02 {
    width: 80px;
    top: -24px;
    right: 6px;
  }
  .about .inner .deco03 {
    width: 52px;
    top: unset;
    bottom: 61px;
    left: 25px;
  }
  .about .inner .deco04 {
    display: none;
  }
  .about .inner .deco05 {
    width: 61px;
    top: 130px;
    right: 18px;
  }
}
.about .container {
  max-width: 1032px;
  container-type: inline-size;
  margin: 0 auto;
}
.about .container .lead_txt {
  font-size: clamp(1.2rem,1.550387596899225cqw,1.6rem);
  font-weight: 500;
  line-height: 2;
  letter-spacing: 0.05em;
  text-align: center;
  margin: 5.038759689922481cqw auto 0;
}
@media screen and (max-width: 768px) {
  .about .container .lead_txt {
    font-size: 1.6rem;
    margin: 44px auto 0;
  }
}
.about .container .more_btn {
  margin: 6.2015503875969cqw auto 0;
}
@media screen and (max-width: 768px) {
  .about .container .more_btn {
    margin: 40px auto 0;
  }
}
/* ↑↑↑ about ↑↑↑ */
/* ↓↓↓ story ↓↓↓ */
.story {
  position: relative;
  padding: min(8.828125vw,113px) 30px 0;
  margin: 0 auto 0;
}
@media screen and (max-width: 768px) {
  .story {
    padding: 83px 25px ;
  }
}
.story .trolley_wrap {
  position: absolute;
  width: 100%;
  display: flex;
  justify-content: center;
  translate: -50% -100%;
  top: 0;
  left: 50%;
  z-index: 1;
}
.story .trolley_wrap #motionPath {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
}
.story .trolley_wrap .trolley {
  position: absolute;
  width: max(100%, 1922px);
  height: 100%;
  translate: -50% 0;
  top: 0;
  left: 50%;
}
.story .trolley_wrap .trolley .motion-path {
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 768px) {
  .story .trolley_wrap .trolley {
    width: 100%;
  }
  .story .trolley_wrap .trolley .motion-path.sp {
    display: flex;
    align-items: flex-end;
  }
}
.story .trolley_wrap .trolley .trolley_img {
  position: absolute;
  width: min(23.203125vw,297px);
  transform-origin: bottom;
  display: block;
  opacity: 0;
  top: 0;
  left: min(28.281250000000004vw,362px);
}
@media screen and (max-width: 768px) {
  .story .trolley_wrap .trolley .trolley_img {
    width: min(41.06666666666667vw,200px);
    top: -15px;
    left: 0;
  }
}
.story .bottom_parts {
  position: absolute;
  width: 100%;
  display: flex;
  justify-content: center;
  overflow: clip;
  translate: -50% -100%;
  top: 0;
  left: 50%;
  z-index: 1;
}
.story :is(.top_parts,.bottom_parts img) {
  width: max(100%, 1922px);
  display: block;
  flex-shrink: 0;
}
@media screen and (max-width: 768px) {
  .story :is(.top_parts,.bottom_parts img) {
    width: 100%;
  }
}
.story .inner {
  max-width: 1032px;
  display: flex;
  gap: 46px min(8.527131782945736cqw,88px);
  container-type: inline-size;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .story .inner {
    flex-direction: column-reverse;
  }
}
.story .inner .txt_group {
  flex: 1;
}
.story .inner .txt_group .conts_ttl {
  margin: unset;
}
@media screen and (max-width: 768px) {
  .story .inner .txt_group .conts_ttl {
    margin: 0 auto;
  }
}
.story .inner .txt_group .conts_ttl .en::before,
.story .inner .txt_group .conts_ttl .en::after {
  content: '';
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  z-index: -1;
}
.story .inner .txt_group .conts_ttl .en::before {
  width: 9.689922480620156cqw;
  aspect-ratio: 100/81;
  background-image: url(../img/top/story_ttl_deco01.svg);
  top: -2.422480620155039cqw;
  left: -6.2015503875969cqw;
}
.story .inner .txt_group .conts_ttl .en::after {
  width: 8.624031007751938cqw;
  aspect-ratio: 89/83;
  background-image: url(../img/top/story_ttl_deco02.svg);
  top: -2.9069767441860463cqw;
  right: -7.170542635658915cqw;
}
@media screen and (max-width: 768px) {
  .story .inner .txt_group .conts_ttl .en::before {
    width: 61px;
    top: -14px;
    left: -45px;
  }
  .story .inner .txt_group .conts_ttl .en::after {
    width: 49px;
    top: -18px;
    right: -40px;
  }
}
.story .inner .txt_group .conts_ttl::after {
  left: 68%;
}
@media screen and (max-width: 768px) {
  .story .inner .txt_group .conts_ttl::after {
    left: 50%;
  }
}
.story .inner .txt_group .lead_txt {
  font-size: clamp(1.2rem,1.550387596899225cqw,1.6rem);
  font-weight: 500;
  line-height: 2;
  letter-spacing: 0.05em;
  margin-top: 5.038759689922481cqw;
}
@media screen and (max-width: 768px) {
  .story .inner .txt_group .lead_txt {
    font-size: 1.6rem;
    text-align: center;
    margin-top: 44px;
  }
}
.story .inner .txt_group .more_btn {
  margin-top: 6.2015503875969cqw;
}
@media screen and (max-width: 768px) {
  .story .inner .txt_group .more_btn {
    margin: 40px auto 0;
  }
}
.story .inner .img {
  position: relative;
  width: 48.837209302325576cqw;
  outline: 2px dashed #000;
  outline-offset: -2px;
  flex-shrink: 0;
}
@media screen and (max-width: 768px) {
  .story .inner .img {
    width: 100%;
    border: 1px dashed #000;
  }
}
.story .inner .img .creature {
  position: absolute;
  width: 12.4031007751938cqw;
  top: -3.77906976744186cqw;
  right: max(-5.703125vw,-73px);
}
@media screen and (max-width: 768px) {
  .story .inner .img .creature {
    width: 64px;
    top: -25px;
    right: -32px;
  }
}
/* ↑↑↑ story ↑↑↑ */
/* ↓↓↓ recycle ↓↓↓ */
.recycle {
  position: relative;
  background-color: #DEF5EF;
  padding: min(7.8125vw,100px) 30px 3.4375000000000004cqw;
  margin: min(21.875vw,280px) auto 0;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .recycle {
    padding: 83px 25px ;
  }
}
.recycle .bg_parts {
  position: absolute;
  width: 100%;
  display: flex;
  justify-content: center;
  overflow: clip;
  left: 50%;
  z-index: 1;
}
.recycle .bg_parts.top_parts {
  translate: -50% -100%;
  top: 1px;
}
.recycle .bg_parts.bottom_parts {
  translate: -50% 100%;
  bottom: 1px;
}
@media screen and (max-width: 768px) {
  .recycle .bg_parts.top_parts {
    translate: 0 -100%;
    left: 0;
  }
  .recycle .bg_parts.bottom_parts {
    translate: 0 100%;
    left: 0;
  }
}
.recycle .bg_parts img {
  width: max(100%, 1922px);
  display: block;
  flex-shrink: 0;
}
@media screen and (max-width: 768px) {
  .recycle .bg_parts img {
    width: 100%;
  }
}
.recycle .inner {
  position: relative;
  max-width: 1032px;
  display: flex;
  gap: 46px min(8.527131782945736cqw,88px);
  container-type: inline-size;
  margin: 0 auto;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .recycle .inner {
    flex-direction: column;
  }
}
.recycle .inner .creature {
  position: absolute;
}
.recycle .inner .creature01 {
  width: 16.666666666666664cqw;
  top: -31.686046511627907cqw;
  left: max(-4.0625vw,-52px);
}
@media screen and (max-width: 768px) {
  .recycle .inner .creature01 {
    width: 86px;
    top: -150px;
    left: -14px;
  }
}
.recycle .inner .txt_group {
  flex: 1;
}
.recycle .inner .txt_group .conts_ttl {
  align-items: flex-start;
  margin: unset;
}
@media screen and (max-width: 768px) {
  .recycle .inner .txt_group .conts_ttl {
    align-items: center;
    margin: 0 auto;
  }
}
.recycle .inner .txt_group .conts_ttl::after {
  left: 36%;
}
@media screen and (max-width: 768px) {
  .recycle .inner .txt_group .conts_ttl::after {
    left: 50%;
  }
}
.recycle .inner .txt_group .conts_ttl .ja {
  margin-left: 0;
  margin-right: 0;
}
.recycle .inner .txt_group .conts_ttl .en::before {
  content: '';
  position: absolute;
  width: 9.39922480620155cqw;
  aspect-ratio: 97/102;
  background-image: url(../img/top/recycle_ttl_deco.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  z-index: -1;
  top: -2.422480620155039cqw;
  right: -6.2015503875969cqw;
}
@media screen and (max-width: 768px) {
  .recycle .inner .txt_group .conts_ttl .en::before {
    width: 61px;
    top: -14px;
    right: -45px;
  }
}
.recycle .inner .txt_group .lead_txt {
  font-size: clamp(1.2rem,1.550387596899225cqw,1.6rem);
  font-weight: 500;
  line-height: 2;
  left: 0.05em;
  margin-top: 5.038759689922481cqw;
}
@media screen and (max-width: 768px) {
  .recycle .inner .txt_group .lead_txt {
    font-size: 1.6rem;
    text-align: center;
    margin-top: 44px;
  }
}
.recycle .inner .txt_group .more_btn {
  margin-top: 6.2015503875969cqw;
}
@media screen and (max-width: 768px) {
  .recycle .inner .txt_group .more_btn {
    margin: 40px auto 0;
  }
}
.recycle .inner .img {
  position: relative;
  width: 48.837209302325576cqw;
  outline: 2px dashed #000;
  outline-offset: -2px;
  flex-shrink: 0;
}
@media screen and (max-width: 768px) {
  .recycle .inner .img {
    width: 100%;
    border: 1px dashed #000;
  }
}
.recycle .inner .img .creature02 {
  width: 15.891472868217054cqw;
  top: -6.686046511627906cqw;
  right: -2.3255813953488373cqw;
}
.recycle .inner .img .creature03 {
  width: 19.476744186046513cqw;
  bottom: -2.2286821705426356cqw;
  left: -3.2945736434108532cqw;
}
@media screen and (max-width: 768px) {
  .recycle .inner .img .creature02 {
    width: 88px;
    top: -19px;
    right: -20px;
  }
  .recycle .inner .img .creature03 {
    width: 96px;
    top: unset;
    bottom: -24px;
    left: -14px;
  }
}
/* ↑↑↑ recycle ↑↑↑ */
/* ↓↓↓ movie ↓↓↓ */
.movie {
  position: relative;
  padding: max(min(22.421875vw,287px),230px) 30px min(25.703125vw,329px);
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .movie {
    padding: min(33.6vw,200px) 25px 188px;
  }
}
.movie .bg {
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  translate: 0 -50%;
  top: 50%;
  left: 0;
}
.movie .bg img {
  width: 100%;
  object-fit: contain;
}
.movie .inner {
  position: relative;
  max-width: 1032px;
  display: flex;
  gap: 44px min(29.375vw,376px);
  container-type: inline-size;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .movie .inner {
    flex-direction: column;
    align-items: center;
  }
}
.movie .inner .conts_ttl {
  position: relative;
  height: fit-content;
  z-index: 1;
}
.movie .inner .conts_ttl::after {
  rotate: Y 180deg;
  left: 40%;
}
@media screen and (max-width: 768px) {
  .movie .inner .conts_ttl::after {
    rotate: unset;
    left: 48%;
  }
}
.movie .inner .conts_ttl .en::before,
.movie .inner .conts_ttl .en::after {
  content: '';
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  z-index: -1;
}
.movie .inner .conts_ttl .en::before {
  width: 5.523255813953488cqw;
  aspect-ratio: 57/80;
  background-image: url(../img/top/movie_ttl_deco01.svg);
  top: -2.9069767441860463cqw;
  left: -6.492248062015504cqw;
}
.movie .inner .conts_ttl .en::after {
  width: 8.236434108527131cqw;
  aspect-ratio: 85/120;
  background-image: url(../img/top/movie_ttl_deco02.svg);
  top: -3.10077519379845cqw;
  right: -4.457364341085271cqw;
}
@media screen and (max-width: 768px) {
  .movie .inner .conts_ttl .en::before {
    width: 35px;
    top: -22px;
    left: -42px;
  }
  .movie .inner .conts_ttl .en::after {
    width: 55px;
    top: -29px;
    right: -34px;
  }
}
.movie .inner .conts_ttl .ja {
  margin-left: 0;
}
.movie .txt_group .lead_txt {
  font-size: clamp(1.2rem,1.550387596899225cqw,1.6rem);
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 2;
  color: #fff;
}
@media screen and (max-width: 768px) {
  .movie .txt_group .lead_txt {
    font-size: 1.6rem;
    text-align: center;
  }
}
.movie .txt_group .more_btn {
  margin-top: 4.651162790697675cqw;
}
@media screen and (max-width: 768px) {
  .movie .txt_group .more_btn {
    margin: 40px auto 0;
  }
}
/* ↑↑↑ movie ↑↑↑ */
/* ↓↓↓ keywords ↓↓↓ */
.keywords {
  position: relative;
  padding: min(18.75vw,240px) 0 248px;
  margin-top: max(-19.453125vw,-249px);
}
@media screen and (max-width: 768px) {
  .keywords {
    padding: 152px 0 166px;
    margin-top: -68px;
  }
}
.keywords .bg {
  position: absolute;
  width: max(100%, 1280px);
  height: 100%;
  display: block;
  translate: -50% 0;
  top: 0;
  left: 50%;
}
@media screen and (max-width: 768px) {
.keywords .bg {
    width: 100%;
  }
}
.keywords .bg img {
  width: 100%;
  height: min(100%,940px);
  object-fit: fill;
}
.keywords .inner {
  position: relative;
  max-width: 1280px;
  pad: 0 30px;
  margin: 0 auto;
}
.keywords .inner .bg_creatures {
  position: absolute;
  width: min(94.53125vw,1210px);
  display: block;
  translate: -50% -50%;
  top: 50%;
  left: 50%;
}
@media screen and (max-width: 768px) {
  .keywords .inner .bg_creatures {
    width: min(97.06666666666666vw,420px);
  }
}
.keywords .inner .deco {
  position: absolute;
  width: min(18.359375vw,235px);
  display: block;
  top: max(-25.234374999999996vw,-323px);
  left: min(4.296875vw,55px);
}
@media screen and (max-width: 768px) {
  .keywords .inner .deco {
    width: 91px;
    top: -254px;
    left: calc((200 - 16) * ((100vw - 375px) / (768 - 375)) + 16px);
  }
}
.keywords .inner .container {
  max-width: 1032px;
  container-type: inline-size;
  margin: 0 auto;
}
.keywords .inner .container .lead_txt {
  font-size: clamp(1.2rem,1.550387596899225cqw,1.6rem);
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 2;
  text-align: center;
  margin-top: 7.3643410852713185cqw;
}
@media screen and (max-width: 768px) {
  .keywords .inner .container .lead_txt {
    font-size: 1.6rem;
    margin-top: 44px;
  }
}
.keywords .inner .container .more_btn {
  margin: 6.2015503875969cqw auto 0;
}
@media screen and (max-width: 768px) {
  .keywords .inner .container .more_btn {
    margin: 40px auto 0;
  }
}
/* ↑↑↑ keywords ↑↑↑ */
/* ↓↓↓ news ↓↓↓ */
.news {
  padding: min(25.078125vw,321px) 30px min(9.375vw,120px);
  margin-top: max(-13.125vw,-168px);
}
@media screen and (max-width: 768px) {
  .news {
    padding: 95px 25px 80px;
    margin-top: -35px;
  }
}
.news .inner {
  position: relative;
  max-width: 1032px;
  display: flex;
  gap: 44px min(6.492248062015504vw,67px);
  container-type: inline-size;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .news .inner {
    flex-direction: column;
    align-items: center;
  }
}
.news .inner .creature {
  position: absolute;
}
.news .inner .creature01 {
  width: 30.813953488372093cqw;
  top: -21.41472868217054cqw;
  right: -16.08527131782946cqw;
}
.news .inner .creature02 {
  width: 13.275193798449614cqw;
  bottom: -7.751937984496124cqw;
  left: 11.627906976744185cqw;
}
@media screen and (max-width: 768px) {
  .news .inner .creature01 {
    width: 148px;
    top: -84px;
    right: -64px;
  }
  .news .inner .creature02 {
    width: 78px;
    bottom: unset;
    top: 55px;
    left: -6px;
  }
}
.news .inner .conts_ttl {
  height: fit-content;
  align-items: flex-start;
  margin: unset;
}
@media screen and (max-width: 768px) {
  .news .inner .conts_ttl {
    height: fit-content;
    align-items: center;
    margin: auto 0;
  }
}
.news .inner .conts_ttl::after {
  rotate: Y 180deg;
  left: 22%;
}
@media screen and (max-width: 768px) {
  .news .inner .conts_ttl::after {
    rotate: unset;
    left: 50%;
  }
}
.news .inner .conts_ttl .ja {
  margin-left: 0;
  margin-right: 0;
}
.news .inner .conts_box {
  flex: 1;
  width: 100%;
}
.news .inner .news_list {
  display: flex;
  flex-direction: column;
  gap: 2.3255813953488373cqw;
}
@media screen and (max-width: 768px) {
  .news .inner .news_list {
    gap: 24px;
  }
}
.news .inner .news_list .news_item {
  border-bottom: 2px dashed #000;
}
@media screen and (max-width: 768px) {
  .news .inner .news_list .news_item {
    border-bottom: 1px dashed #000;
  }
}
.news .inner .news_list .news_link {
  position: relative;
  display: block;
  --opacity_value: 0.3;
  padding-bottom: 2.3255813953488373cqw;
}
@media screen and (max-width: 768px) {
  .news .inner .news_list .news_link {
    gap: 44px;
    padding-bottom: 24px;
  }
}
.news .inner .news_list .news_link .conts {
  display: flex;
  gap: 4.263565891472868cqw;
  justify-content: space-between;
}
.news .inner .news_list .news_link .date {
  font-size: clamp(1.2rem,1.550387596899225cqw,1.6rem);
  font-weight: 500;
  letter-spacing: 0.05em;
  transition: opacity ease .3s;
}
@media screen and (min-width: 769px) {
  .news .inner .news_list a.news_link:hover .date {
    opacity: var(--opacity_value);
  }
}
@media screen and (max-width: 768px) {
  .news .inner .news_list .news_link .date {
    font-size: 1.6rem;
  }
}
.news .inner .news_list .news_link .txt {
  flex: 1;
  font-size: clamp(1.2rem,1.550387596899225cqw,1.6rem);
  font-weight: 500;
  line-height: 2;
  letter-spacing: 0.05em;
  transition: opacity ease .3s;
  margin-top: 1.550387596899225cqw;
}
@media screen and (min-width: 769px) {
  .news .inner .news_list a.news_link:hover .txt {
    opacity: var(--opacity_value);
  }
}
@media screen and (max-width: 768px) {
  .news .inner .news_list .news_link .txt {
    font-size: 1.6rem;
    margin-top: 12px;
  }
}
.news .inner .news_list .news_link .txt .icon {
  font-size: clamp(1rem,1.3565891472868217cqw,1.4rem);
  font-family: var(--Livvic);
  font-weight: 700;
  letter-spacing: 0;
  color: #fff;
  background-color: #000;
  border-radius: 9999px;
  padding: 0.1937984496124031cqw 1.065891472868217cqw;
}
@media screen and (max-width: 768px) {
  .news .inner .news_list .news_link .txt .icon {
    font-size: 1.4rem;
    padding: 2px 11px;
  }
}
.news .inner .news_list .news_link .btn {
  position: relative;
  width: 4.651162790697675cqw;
  height: auto;
  aspect-ratio: 1/1;
  border-radius: 50%;
  align-self: center;
  background-color: #fff;
  border: 2px solid #000;
  filter: drop-shadow(0px 0.3875968992248062cqw 0px var(--conts_color));
  transition: filter ease .3s, translate ease .3s;
}
@media screen and (min-width: 769px) {
.news .inner .news_list a.news_link:hover .btn {
    filter: drop-shadow(0px 0px 0px var(--conts_color));
    translate: 0 5%;
  }
}
@media screen and (max-width: 768px) {
  .news .inner .news_list .news_link .btn {
    width: 40px;
    border: 1px solid #000;
    filter: drop-shadow(0px 4px 0px var(--conts_color));
  }
}
.news .inner .news_list .news_link .btn .icon {
  position: absolute;
  width: 2.5193798449612403cqw;
  height: auto;
  aspect-ratio: 26/10;
  translate: -50% -50%;
  top: 48%;
  left: 50%;
}
@media screen and (max-width: 768px) {
  .news .inner .news_list .news_link .btn .icon {
    width: 17px;
  }
}
.news .inner .conts_box .more_btn {
  margin: 4.651162790697675cqw auto 0.7751937984496124cqw;
}
@media screen and (max-width: 768px) {
  .news .inner .conts_box .more_btn {
    margin: 40px auto 8px;
  }
}
/* ↑↑↑ news ↑↑↑ */
footer {
  margin-top: unset;
}