@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600&family=Poppins:wght@600&display=swap');

body {
  background: #000;
  font-family: "Noto Sans JP", sans-serif;
  padding: 0;
  margin: 0;
}

.content {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}

.content img {
  width: auto;
  height: 100%;
}

.content .date {
  display: flex;
  height: 61vh;
}

.content .date ul {
  display: flex;
  width: 100%;
}

.content .date li {
  flex: 1;
  position: relative;
  line-height: 1;
}

.content .date-box {
  aspect-ratio: 208 / 145;
  background: #fff;
  width: 90%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 1.5vh;
  margin: auto;
  font-feature-settings: "palt";
}

.content .date-box p span {
  font-weight: 600;
  font-size: 4.444vw;
}

.content .date-box dt {
  font-weight: 500;
  font-size: 1.944vw;
  margin: 2vw 0 1vw;
}

.content .date-box dt span {
  font-family: 'Poppins';
  font-weight: 600;
  font-size: 4.444vw;
  position: relative;
  bottom: -0.2vw;
}

.content .date-box dd {
  margin: 0;
  font-weight: 600;
  font-size: 1.666vw;
  display: flex;
  align-items: center;
  justify-content: center;
}

.content .date-box dd::before {
  content: "";
  display: block;
  aspect-ratio: 14 / 21;
  width: 1.5vw;
  background: url(images/ico_updata25.png) 0 0 / contain no-repeat;
  flex-shrink: 0;
  margin-right: 0.7vw;
  flex-shrink: 0;
}

.content .date .nagoya {
  background: url(images/bg_updata25_01.jpg) 0 0 / cover no-repeat;
}

.content .date .nagoya p span {
  background: left bottom 0.5vw linear-gradient(transparent 85%, #fad733 85%);
}

.content .date .osaka {
  background: url(images/bg_updata25_02.jpg) center center / cover no-repeat;
}

.content .date .osaka p span {
  background: left bottom 0.5vw linear-gradient(transparent 85%, #00cdc5 85%);
}

.content .date .tokyo {
  background: url(images/bg_updata25_03.jpg) right 0 / cover no-repeat;
}

.content .date .tokyo p span {
  background: left bottom 0.5vw linear-gradient(transparent 85%, #fa021b 85%);
}

.content .btn-area {
  flex: 1;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 3vw;
}

.content h2 {
  height: 18vh;
}

.btn {
  max-width: none;
  width: auto;
  margin: 0;
}

.btn a {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
  border: none;
  position: relative;
  line-height: 1;
  background: #ff0000;
  aspect-ratio: 320 / 60;
  width: 44.444vw;
  border-radius: 100px;
  margin: 3vh auto 0;
  font-weight: 600;
  font-size: 2.5vw;
  padding-bottom: 0.3vh;
}

.btn a::before {
  content: "";
  position: absolute;
  display: block;
  top: 0;
  bottom: 0;
  right: 3.6vw;
  margin: auto;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  background: #fff;
  width: 1vw;
  height: 1.25vw;
}

.btn a:hover {
  background: #ff6d6d;
}