@charset "UTF-8";
.main-nav {
  position: fixed;
  top: 20px;
  left: 50vw;
  transform: translateX(-50%);
  z-index: 99999;
}
.main-nav .current-arrow {
  position: absolute;
  bottom: -32px;
  left: 32px;
  width: 18px;
  height: 40px;
  z-index: 10;
}
.main-nav ul {
  display: flex;
  list-style: none;
  align-items: center;
}
.main-nav ul li {
  width: 40px;
  height: 40px;
}
.main-nav ul li.navi-year {
  border: #000000 2px solid;
  background-color: var(--_bg-color);
}
.main-nav ul li.navi-year.navi-year-2019 {
  --_bg-color: #3358b3;
}
.main-nav ul li.navi-year.navi-year-2020 {
  --_bg-color: #b93a0e;
}
.main-nav ul li.navi-year.navi-year-2021 {
  --_bg-color: #610080;
}
.main-nav ul li.navi-year.navi-year-2022 {
  --_bg-color: #5a8920;
}
.main-nav ul li.navi-year.navi-year-2023 {
  --_bg-color: #b93a99;
}
.main-nav ul li.navi-year.navi-year-2024 {
  --_bg-color: #b0721b;
}
.main-nav ul li.navi-year.navi-year-2025 {
  --_bg-color: #4d4d4d;
}
.main-nav ul li.navi-year picture {
  display: flex;
  justify-content: center;
  align-items: center;
}
.main-nav ul li.navi-year a {
  display: flex;
  width: 100%;
  height: 100%;
  text-decoration: none;
  text-align: center;
  justify-content: center;
  align-items: center;
}
.main-nav ul li.navi-year a img {
  vertical-align: bottom;
  width: 100%;
  height: 18px;
  object-fit: contain;
}
.main-nav ul li.navi-year + .navi-year {
  margin-inline-start: -2px;
}

.title-section {
  padding-block-start: clamp(131.2820512821px, 41.0256410256vw, 315.0769230769px);
  max-width: 768px;
  width: 100%;
  padding-inline: clamp(19.6923076923px, 6.1538461538vw, 47.2615384615px);
  margin-inline: auto;
}
.title-section img {
  width: clamp(191.1794871795px, 59.7435897436vw, 458.8307692308px);
}

.text h3 {
  height: clamp(84.5128205128px, 26.4102564103vw, 202.8307692308px);
  margin-block-end: clamp(6.5641025641px, 2.0512820513vw, 15.7538461538px);
}
.text h3 img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: left;
}
.text h4 {
  font-size: clamp(8.2051282051px, 2.5641025641vw, 19.6923076923px);
  font-weight: bold;
}
.text h5 {
  --_bg-color: #ffff3c;
  font-size: clamp(8.2051282051px, 2.5641025641vw, 19.6923076923px);
  font-weight: bold;
}
.text p {
  --_bg-color: #fff;
  font-size: clamp(8.2051282051px, 2.5641025641vw, 19.6923076923px);
  font-weight: bold;
}
.text p + h5 {
  margin-block-start: clamp(14.7692307692px, 4.6153846154vw, 35.4461538462px);
}
.text .label {
  display: inline;
  background-color: var(--_bg-color, #ffffff);
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  padding-inline: 0.2em;
  padding-block: 0.2em;
  line-height: 2.166;
}

:root {
  --content-base-width: clamp(230.4px, 72vw, 1440px);
  --content-width: clamp(320px, 100vw, 2000px);
}

.year-2019 {
  padding-block-start: clamp(16.4102564103px, 5.1282051282vw, 39.3846153846px);
}
.year-2019::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: clamp(-39.3846153846px, -5.1282051282vw, -16.4102564103px);
  background-image: url("../img/png/bg-noise-1.png");
  background-repeat: repeat-x;
  background-size: clamp(362.2564102564px, 113.2051282051vw, 869.4153846154px) auto;
  background-position: bottom left;
  z-index: -1;
}
.year-2019 .text h4 {
  --_bg-color: #c8ff3c;
}
.year-2019 .gif-hanging-scroll {
  width: 100%;
}
.year-2019 .gif-hanging-scroll img {
  width: 100%;
}
.year-2019 .komeda-animation {
  position: relative;
}
.year-2019 .komeda-animation .komeda-chair img {
  width: 100%;
  padding-block: clamp(13.1282051282px, 4.1025641026vw, 31.5076923077px);
}
.year-2019 .komeda-animation .gif-komeda {
  position: absolute;
  bottom: clamp(13.1282051282px, 4.1025641026vw, 31.5076923077px);
  right: clamp(-23.6307692308px, -3.0769230769vw, -9.8461538462px);
}
.year-2019 .komeda-animation .gif-komeda img {
  width: clamp(82.0512820513px, 25.641025641vw, 196.9230769231px);
  max-width: 100%;
  height: auto;
}
.year-2019 .gif-signboard {
  margin-block-start: clamp(-216.6153846154px, -28.2051282051vw, -90.2564102564px);
}
.year-2019 .gif-signboard img {
  width: clamp(41.0256410256px, 12.8205128205vw, 98.4615384615px);
  height: clamp(98.4615384615px, 30.7692307692vw, 236.3076923077px);
  transform: translateX(clamp(6.5641025641px, 2.0512820513vw, 15.7538461538px));
}
.year-2019 .international-animation {
  margin-block-start: clamp(-137.8461538462px, -17.9487179487vw, -57.4358974359px);
}
.year-2019 .chukukobo-animation {
  margin-block-start: clamp(-157.5384615385px, -20.5128205128vw, -65.641025641px);
}
.year-2019 .chukukobo-animation .logo img {
  width: clamp(41.0256410256px, 12.8205128205vw, 98.4615384615px);
  max-width: 100%;
  height: auto;
}
.year-2019 .chukukobo-animation .gif-chukukobo {
  width: 120%;
  transform: translateX(clamp(-78.7692307692px, -10.2564102564vw, -32.8205128205px));
}

.year-2020 {
  position: relative;
}
.year-2020::before {
  content: "";
  position: absolute;
  top: clamp(12.3076923077px, 3.8461538462vw, 29.5384615385px);
  left: 0;
  right: 0;
  bottom: clamp(-88.6153846154px, -11.5384615385vw, -36.9230769231px);
  background-color: #701f07;
  z-index: -1;
}
.year-2020 .text h4 {
  --_bg-color: #e27c1d;
}
.year-2020 .tube-animation {
  position: relative;
  height: clamp(410.2564102564px, 128.2051282051vw, 984.6153846154px);
}
.year-2020 .tube-animation .gif-tube {
  width: clamp(98.4615384615px, 30.7692307692vw, 236.3076923077px);
}
.year-2020 .tube-animation .rain {
  position: absolute;
  left: 0;
}
.year-2020 .tube-animation .rain img {
  width: clamp(98.4615384615px, 30.7692307692vw, 236.3076923077px);
}
.year-2020 .tube-animation .elephant-suit {
  position: absolute;
  left: clamp(24.6153846154px, 7.6923076923vw, 59.0769230769px);
  top: clamp(164.1025641026px, 51.2820512821vw, 393.8461538462px);
}
.year-2020 .tube-animation .elephant-suit img {
  width: clamp(49.2307692308px, 15.3846153846vw, 118.1538461538px);
}
.year-2020 .gif-kenele-stand {
  position: absolute;
  top: clamp(65.641025641px, 20.5128205128vw, 157.5384615385px);
  right: clamp(9.8461538462px, 3.0769230769vw, 23.6307692308px);
}
.year-2020 .gif-kenele-stand img {
  width: clamp(180.5128205128px, 56.4102564103vw, 433.2307692308px);
}
.year-2020 .gif-elephant-fall {
  position: absolute;
  top: clamp(217.4358974359px, 67.9487179487vw, 521.8461538462px);
  left: clamp(41.0256410256px, 12.8205128205vw, 98.4615384615px);
}
.year-2020 .gif-elephant-fall img {
  width: clamp(328.2051282051px, 102.5641025641vw, 787.6923076923px);
}
.year-2020 .gif-dj-elephant {
  width: 50%;
  margin-inline: auto;
  padding-block-start: clamp(13.1282051282px, 4.1025641026vw, 31.5076923077px);
}
.year-2020 .train-animation {
  position: relative;
}
.year-2020 .train-animation .train img {
  width: clamp(311.7948717949px, 97.4358974359vw, 748.3076923077px);
  max-width: clamp(311.7948717949px, 97.4358974359vw, 748.3076923077px);
  transform: translateX(clamp(-47.2615384615px, -6.1538461538vw, -19.6923076923px));
}
.year-2020 .train-animation .gif-tokyo-station {
  position: absolute;
  bottom: clamp(-78.7692307692px, -10.2564102564vw, -32.8205128205px);
  left: clamp(-39.3846153846px, -5.1282051282vw, -16.4102564103px);
}
.year-2020 .train-animation .gif-tokyo-station img {
  width: clamp(246.1538461538px, 76.9230769231vw, 590.7692307692px);
}

.year-2021 {
  background-color: #701F07;
  margin-block-start: clamp(32.8205128205px, 10.2564102564vw, 78.7692307692px);
}
.year-2021 .text h4 {
  --_bg-color: #c8ff3c;
}
.year-2021 .kenele-books-animation {
  position: relative;
  padding-block-end: clamp(13.1282051282px, 4.1025641026vw, 31.5076923077px);
}
.year-2021 .kenele-books-animation .gif-elephant-books {
  width: clamp(114.8717948718px, 35.8974358974vw, 275.6923076923px);
  position: absolute;
  right: clamp(-31.5076923077px, -4.1025641026vw, -13.1282051282px);
  top: clamp(16.4102564103px, 5.1282051282vw, 39.3846153846px);
}
.year-2021 .neworld-animation {
  position: relative;
}
.year-2021 .neworld-animation .neworld {
  position: absolute;
  top: clamp(16.4102564103px, 5.1282051282vw, 39.3846153846px);
  left: clamp(-19.6923076923px, -2.5641025641vw, -8.2051282051px);
}
.year-2021 .neworld-animation .neworld img {
  width: clamp(164.1025641026px, 51.2820512821vw, 393.8461538462px);
}
.year-2021 .neworld-animation .gif-elephant-pc {
  width: clamp(196.9230769231px, 61.5384615385vw, 472.6153846154px);
  margin-inline-start: auto;
}

.year-2022 {
  margin-block-start: clamp(32.8205128205px, 10.2564102564vw, 78.7692307692px);
}
.year-2022::before {
  content: "";
  position: absolute;
  top: clamp(-88.6153846154px, -11.5384615385vw, -36.9230769231px);
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #701f07;
  z-index: -1;
  background-image: url("../img/png/bg-noise-2.png");
  background-repeat: repeat-x;
  background-size: clamp(362.2564102564px, 113.2051282051vw, 869.4153846154px) auto;
  background-position: bottom left;
}
.year-2022 .text h4 {
  --_bg-color: #b7f9ff;
}
.year-2022 .gif-garagara {
  width: clamp(131.2820512821px, 41.0256410256vw, 315.0769230769px);
  position: absolute;
  left: clamp(6.5641025641px, 2.0512820513vw, 15.7538461538px);
  top: clamp(-59.0769230769px, -7.6923076923vw, -24.6153846154px);
}
.year-2022 .bomb-animation img {
  padding-inline-start: clamp(13.1282051282px, 4.1025641026vw, 31.5076923077px);
  margin-block-start: clamp(19.6923076923px, 6.1538461538vw, 47.2615384615px);
}

.year-2023 {
  margin-block-start: clamp(32.8205128205px, 10.2564102564vw, 78.7692307692px);
}
.year-2023::before {
  content: "";
  position: absolute;
  top: clamp(-78.7692307692px, -10.2564102564vw, -32.8205128205px);
  left: 0;
  right: 0;
  bottom: clamp(-78.7692307692px, -10.2564102564vw, -32.8205128205px);
  background-color: #6cbcad;
  z-index: -1;
}
.year-2023 .gif-renewal-ueno {
  padding-block-end: clamp(13.1282051282px, 4.1025641026vw, 31.5076923077px);
}
.year-2023 .text {
  position: relative;
}
.year-2023 .text h4 {
  --_bg-color: #b7f9ff;
}
.year-2023 .text .gif-panda-elephant img {
  position: absolute;
  top: clamp(-59.0769230769px, -7.6923076923vw, -24.6153846154px);
  right: clamp(-31.5076923077px, -4.1025641026vw, -13.1282051282px);
  padding-inline-start: clamp(13.1282051282px, 4.1025641026vw, 31.5076923077px);
  margin-block-start: clamp(19.6923076923px, 6.1538461538vw, 47.2615384615px);
  width: clamp(164.1025641026px, 51.2820512821vw, 393.8461538462px);
}

.year-2024 {
  margin-block-start: clamp(32.8205128205px, 10.2564102564vw, 78.7692307692px);
  background-color: #6CBCAD;
}
.year-2024 .gif-gigatcha {
  padding-block: clamp(13.1282051282px, 4.1025641026vw, 31.5076923077px);
}
.year-2024 .gif-gigatcha img {
  width: clamp(246.1538461538px, 76.9230769231vw, 590.7692307692px);
}
.year-2024 .curtain-kyoto {
  display: flex;
  justify-content: flex-end;
}
.year-2024 .curtain-kyoto img {
  margin-block-start: clamp(-196.9230769231px, -25.641025641vw, -82.0512820513px);
  width: clamp(65.641025641px, 20.5128205128vw, 157.5384615385px);
}
.year-2024 .gif-elephant-tea img {
  margin-block-start: clamp(-78.7692307692px, -10.2564102564vw, -32.8205128205px);
  width: clamp(196.9230769231px, 61.5384615385vw, 472.6153846154px);
  max-width: 100%;
  height: auto;
}
.year-2024 .app img {
  width: clamp(164.1025641026px, 51.2820512821vw, 393.8461538462px);
  max-width: 100%;
  height: auto;
  margin-block-start: clamp(-472.6153846154px, -61.5384615385vw, -196.9230769231px);
  margin-inline-start: clamp(114.8717948718px, 35.8974358974vw, 275.6923076923px);
  transform: translateY(clamp(49.2307692308px, 15.3846153846vw, 118.1538461538px));
  padding-block-end: clamp(24.6153846154px, 7.6923076923vw, 59.0769230769px);
}
.year-2024 .text {
  position: relative;
}
.year-2024 .text h4 {
  --_bg-color: #b7f9ff;
}
.year-2024 .text .capsule img {
  position: absolute;
  top: clamp(45.9487179487px, 14.358974359vw, 110.2769230769px);
  right: 0;
  width: clamp(57.4358974359px, 17.9487179487vw, 137.8461538462px);
}

.year-2025 {
  padding-block-end: clamp(82.0512820513px, 25.641025641vw, 196.9230769231px);
  background-color: #6CBCAD;
}
.year-2025 .content {
  position: relative;
  width: 100%;
}
.year-2025 .gif-kenele-stand-5th-anniversary img {
  width: 50%;
}
.year-2025 .kenele-bunshitsu img {
  position: absolute;
  top: clamp(164.1025641026px, 51.2820512821vw, 393.8461538462px);
  right: clamp(-19.6923076923px, -2.5641025641vw, -8.2051282051px);
  width: 50%;
}
.year-2025 .kenele-bunshitsu-logo img {
  position: absolute;
  top: clamp(221.5384615385px, 69.2307692308vw, 531.6923076923px);
  right: clamp(-19.6923076923px, -2.5641025641vw, -8.2051282051px);
  width: 50%;
}
.year-2025 .text {
  margin-block-start: clamp(32.8205128205px, 10.2564102564vw, 78.7692307692px);
}
.year-2025 .text h4 {
  --_bg-color: #b7f9ff;
}
.year-2025 .plane-animation {
  position: relative;
}
.year-2025 .plane-animation .runway {
  padding-block: clamp(16.4102564103px, 5.1282051282vw, 39.3846153846px);
  display: flex;
  justify-content: center;
}
.year-2025 .plane-animation .runway img {
  width: clamp(98.4615384615px, 30.7692307692vw, 236.3076923077px);
  margin-inline: auto;
}
.year-2025 .plane-animation .plane img {
  position: absolute;
  top: clamp(49.2307692308px, 15.3846153846vw, 118.1538461538px);
  left: 50%;
  transform: translateX(-50%);
  width: clamp(147.6923076923px, 46.1538461538vw, 354.4615384615px);
  max-width: 100%;
  height: auto;
}
.year-2025 .plane-animation .gif-elephant-plane {
  margin-block-start: clamp(-315.0769230769px, -41.0256410256vw, -131.2820512821px);
}
.year-2025 .plane-animation .four-pointed-star {
  position: absolute;
  top: clamp(262.5641025641px, 82.0512820513vw, 630.1538461538px);
  right: clamp(16.4102564103px, 5.1282051282vw, 39.3846153846px);
  transform: translateX(-50%);
}
.year-2025 .plane-animation .four-pointed-star img {
  width: clamp(21.3333333333px, 6.6666666667vw, 51.2px);
  max-width: 100%;
  height: auto;
}
.year-2025 .earth {
  display: flex;
  justify-content: center;
  padding-block: clamp(32.8205128205px, 10.2564102564vw, 78.7692307692px);
}
.year-2025 .earth img {
  width: 50%;
}
.year-2025 .goto-20th {
  margin-top: 10vw;
}
@media (865px < width) {
  .year-2025 .goto-20th {
    margin-top: 87px;
  }
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.screen-reader-text {
  position: absolute;
  width: clamp(0.8205128205px, 0.2564102564vw, 1.9692307692px);
  height: clamp(0.8205128205px, 0.2564102564vw, 1.9692307692px);
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

body {
  background-color: #71B35E;
  background-image: linear-gradient(to bottom, #71B35E 0, #71B35E 50%, #6CBCAD 50% #6CBCAD 100%);
}
body img {
  user-drag: none; /* Safari・古いChrome用 */
  -webkit-user-drag: none;
  pointer-events: auto;
  width: 100%;
  max-width: 100%;
}
body #smooth-wrapper {
  height: 100%;
  overflow-x: hidden !important;
}
body .timeline .year {
  position: relative;
  padding-inline: clamp(19.6923076923px, 6.1538461538vw, 47.2615384615px);
}
body .timeline .year .content {
  position: relative;
  max-width: 768px;
  margin-inline: auto;
}
