﻿.l-main {
  background: var(--bc01);
  overflow: hidden;
}
@media only screen and (max-width: 768px) {
  .l-main {
    padding-bottom: 22.6666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .l-main {
    padding-bottom: 47px;
  }
}

.c-box-inner {
  position: relative;
  z-index: 10;
}
@media only screen and (max-width: 768px) {
  .c-box-inner {
    padding-inline: 9.3333333333vw;
  }
}
@media print, screen and (min-width: 769px) {
  .c-box-inner {
    width: 1000px;
  }
}

.p-mv {
  position: relative;
}
@media only screen and (max-width: 768px) {
  .p-mv {
    margin-bottom: 55.7333333333vw;
    padding-top: 25.3333333333vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-mv {
    margin-bottom: 105px;
    padding-top: 34px;
  }
}
.p-mv::before {
  background: url("/120thspecialsite/_assets/dynamic/img/img01.png") no-repeat left top/cover;
  content: "";
  display: block;
  opacity: 0;
  position: absolute;
  transition: opacity 0.5s ease-in-out 0.3s;
  z-index: 10;
}
@media only screen and (max-width: 768px) {
  .p-mv::before {
    height: 97.3333333333vw;
    left: -96vw;
    top: -37.3333333333vw;
    width: 170.6666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-mv::before {
    height: 730px;
    right: calc(50% + 82px);
    top: -146px;
    width: 1280px;
  }
}
.p-mv .c-box-inner {
  opacity: 0;
  transition: 0.4s ease-in-out;
}
@media print, screen and (min-width: 769px) {
  .p-mv .c-box-inner {
    display: flex;
    justify-content: flex-end;
  }
}
.p-mv.start::before {
  opacity: 1;
}
.p-mv.start .c-box-inner {
  opacity: 1;
}

.p-mv-line01 {
  background: var(--bc02);
  z-index: 2;
}
@media only screen and (max-width: 768px) {
  .p-mv-line01 {
    --move: 31.4666666667vw;
    height: 2.6666666667vw;
    top: 33.6vw;
    width: 100vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-mv-line01 {
    --move: 16.71875vw;
    height: 21px;
    top: 194px;
    width: 53.359375vw;
  }
}

.p-mv-line02 {
  --delay: .4s;
  background: var(--bc04);
}
@media only screen and (max-width: 768px) {
  .p-mv-line02 {
    --move: 25.3333333333vw;
    height: 9.8666666667vw;
    top: 35.2vw;
    width: 79.0666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-mv-line02 {
    --move: 14.84375vw;
    height: 75px;
    top: 204px;
    width: 47.1875vw;
  }
}

@media print, screen and (min-width: 769px) {
  .p-mv-main {
    width: 543px;
  }
}

.p-mv-title {
  color: #fff;
  font-style: italic;
  font-weight: bold;
  letter-spacing: -0.03em;
  line-height: 1;
  position: relative;
  z-index: 10;
}
@media only screen and (max-width: 768px) {
  .p-mv-title {
    font-size: 14.6666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-mv-title {
    font-size: 9.7rem;
  }
}
@media only screen and (max-width: 768px) {
  .p-mv-title span {
    margin-right: -0.01em;
  }
}

.p-mv-catch {
  color: #fff;
  font-weight: bold;
  letter-spacing: 0.05em;
}
@media only screen and (max-width: 768px) {
  .p-mv-catch {
    font-size: 4.6666666667vw;
    line-height: 1.257;
    margin-bottom: 1.7333333333vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-mv-catch {
    font-size: 2.8rem;
    line-height: 1.428;
    margin-bottom: 15px;
  }
}

.p-mv-text {
  color: #fff;
  font-weight: 500;
  letter-spacing: 0.03em;
}
@media only screen and (max-width: 768px) {
  .p-mv-text {
    font-size: 3.7333333333vw;
    line-height: 1.89;
  }
}
@media print, screen and (min-width: 769px) {
  .p-mv-text {
    font-size: 1.6rem;
    line-height: 1.875;
  }
}

.p-ttl {
  color: #fff;
  font-weight: bold;
  letter-spacing: 0.05em;
  opacity: 0;
  transform: translateY(20px);
  transition: 0.4s ease-in-out 0.2s;
}
@media only screen and (max-width: 768px) {
  .p-ttl {
    font-size: 6.6666666667vw;
    border-left: 0.6666666667vw solid #fff;
    line-height: 1;
    padding-left: 0.9333333333vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-ttl {
    font-size: 4.5rem;
    border-left: 5px solid #fff;
    line-height: 1.111;
    padding-left: 7px;
  }
}
@media only screen and (max-width: 768px) {
  .p-ttl small {
    font-size: 4vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-ttl small {
    font-size: 3rem;
  }
}
.p-ttl span {
  display: inline-block;
}
@media only screen and (max-width: 768px) {
  .p-ttl span {
    border-left: 0.4vw solid #fff;
    padding-left: 1.6vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-ttl span {
    border-left: 3px solid #fff;
    padding-left: 10px;
  }
}

.p-gas {
  position: relative;
}
@media only screen and (max-width: 768px) {
  .p-gas {
    margin-bottom: 110.8vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-gas {
    margin-bottom: 280px;
  }
}
.p-gas .p-map {
  background: url("/120thspecialsite/_assets/dynamic/img/img02.png") no-repeat left top/cover;
  display: block;
  opacity: 0;
  position: absolute;
  transition: opacity 0.5s ease-in-out 0.3s;
  z-index: 20;
}
@media only screen and (max-width: 768px) {
  .p-gas .p-map {
    height: 76.2666666667vw;
    right: -45.0666666667vw;
    top: -52.5333333333vw;
    width: 123.0666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-gas .p-map {
    height: 572px;
    left: calc(50% + 61px);
    top: -40px;
    width: 923px;
  }
}
@media only screen and (max-width: 768px) {
  .p-gas .bln1 {
    left: 30.9333333333vw;
    top: 4.8vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-gas .bln1 {
    left: 244px;
    top: 55px;
  }
}
@media only screen and (max-width: 768px) {
  .p-gas .bln2 {
    left: 38.4vw;
    top: 21.0666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-gas .bln2 {
    left: 300px;
    top: 178px;
  }
}
@media only screen and (max-width: 768px) {
  .p-gas .bln3 {
    left: 41.8666666667vw;
    top: 34.1333333333vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-gas .bln3 {
    left: 326px;
    top: 287px;
  }
}
@media print, screen and (min-width: 769px) {
  .p-gas .c-box-inner {
    padding-inline: 25px;
  }
}
@media only screen and (max-width: 768px) {
  .p-gas .p-ttl {
    margin-bottom: 16vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-gas .p-ttl {
    margin-bottom: 125px;
  }
}
@media print, screen and (min-width: 769px) {
  .p-gas .p-timeline {
    padding-left: 47px;
  }
}
.p-gas .p-timeline-year,
.p-gas .p-timeline-text {
  color: var(--bc01);
}
.p-gas .p-timeline-item:not(:first-child) .p-timeline-year::before {
  background: var(--bc01);
}
.p-gas.start .p-map {
  opacity: 1;
}

.p-gas-line01 {
  background: #fff;
}
@media only screen and (max-width: 768px) {
  .p-gas-line01 {
    --move: 31.4666666667vw;
    height: 70.6666666667vw;
    top: 25.3333333333vw;
    width: 100vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-gas-line01 {
    --move: 21.09375vw;
    height: 530px;
    top: 17.31vw;
    width: 67.421875vw;
  }
}

.p-gas-line02 {
  --delay: .4s;
  background: var(--bc03);
  z-index: 2;
}
@media only screen and (max-width: 768px) {
  .p-gas-line02 {
    --move: 11.6vw;
    height: 20vw;
    top: 90.6666666667vw;
    width: 35.2vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-gas-line02 {
    --move: 8.359375vw;
    height: 150px;
    top: 632px;
    width: 26.25vw;
  }
}

.p-timeline-item {
  opacity: 0;
  transform: translateY(20px);
  transition: 0.4s ease-in-out var(--delay);
}
.p-timeline-item:first-child {
  --delay: .3s;
}
.p-timeline-item:nth-child(2) {
  --delay: .6s;
}
.p-timeline-item:nth-child(3) {
  --delay: .9s;
}
@media only screen and (max-width: 768px) {
  .p-timeline-item {
    display: -ms-grid;
    display: grid;
        grid-template-areas: "year text" "year button";
    -ms-grid-columns: 14.4vw 1fr;
    grid-template-columns: 14.4vw 1fr;
  }
}
@media print, screen and (min-width: 769px) {
  .p-timeline-item {
    display: flex;
  }
}
@media only screen and (max-width: 768px) {
  .p-timeline-item:not(:first-child) {
    margin-top: 1.8666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-timeline-item:not(:first-child) {
    margin-top: 64px;
  }
}
.p-timeline-item:not(:first-child) .p-timeline-year::before {
  background: #fff;
  content: "";
  display: block;
  left: 50%;
  position: absolute;
  width: 1px;
}
@media only screen and (max-width: 768px) {
  .p-timeline-item:not(:first-child) .p-timeline-year::before {
    height: 12vw;
    top: -12vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-timeline-item:not(:first-child) .p-timeline-year::before {
    height: 78px;
    top: -90px;
  }
}

.p-timeline-year {
  color: #fff;
  font-family: "Roboto", sans-serif;
  font-style: italic;
  line-height: 1;
  position: relative;
}
@media only screen and (max-width: 768px) {
  .p-timeline-year {
    font-size: 5.3333333333vw;
    grid-area: year;
    line-height: 1.325;
  }
}
@media print, screen and (min-width: 769px) {
  .p-timeline-year {
    font-size: 3rem;
    margin-right: 18px;
  }
}

@media only screen and (max-width: 768px) {
  .p-timeline-button {
    grid-area: button;
  }
}
@media print, screen and (min-width: 769px) {
  .p-timeline-button {
    margin-right: 10px;
  }
}
.p-timeline-button a {
  background: var(--bc02);
  color: var(--bc01);
  display: -ms-grid;
  display: grid;
  font-weight: bold;
  place-content: center left;
  position: relative;
}
@media only screen and (max-width: 768px) {
  .p-timeline-button a {
    border-radius: 2.5333333333vw;
    font-size: 2.2666666667vw;
    height: 5.0666666667vw;
    padding-left: 1.8666666667vw;
    width: 24vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-timeline-button a {
    font-size: 1.3rem;
    border: 2px solid var(--bc02);
    border-radius: 19px;
    height: 30px;
    overflow: hidden;
    padding-left: 10px;
    width: 108px;
  }
}
.p-timeline-button a::before {
  background: url("/120thspecialsite/_assets/dynamic/img/icon-arrow01.svg") no-repeat left top/cover;
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
}
@media only screen and (max-width: 768px) {
  .p-timeline-button a::before {
    height: 2.9333333333vw;
    right: 1.3333333333vw;
    width: 2.9333333333vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-timeline-button a::before {
    height: 16px;
    right: 7px;
    width: 16px;
  }
}
@media print, screen and (min-width: 769px) {
  .p-timeline-button a::after {
    background: #fff;
    content: "";
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    scale: 0 1;
    top: 0;
    transition: scale 0.3s ease-in-out;
    transform-origin: right;
    width: 100%;
  }
}
.p-timeline-button a span {
  position: relative;
  z-index: 2;
}
@media print, screen and (min-width: 769px) {
  .p-timeline-button a:hover::after {
    scale: 1 1;
    transform-origin: left;
  }
}

.p-timeline-text {
  color: #fff;
  font-weight: bold;
}
@media only screen and (max-width: 768px) {
  .p-timeline-text {
    font-size: 3.7333333333vw;
    grid-area: text;
    line-height: 1.428;
    padding-bottom: 1.3333333333vw;
  }
}
@media only screen and (max-width: 768px) {
  .p-timeline-year {
    -ms-grid-row: 1;
    -ms-grid-row-span: 2;
    -ms-grid-column: 1;
  }
  .p-timeline-button {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
  }
  .p-timeline-text {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
}
@media print, screen and (min-width: 769px) {
  .p-timeline-text {
    font-size: 2.5rem;
    line-height: 1.4;
    margin-top: -0.2em;
  }
}

.p-energy {
  position: relative;
}
@media only screen and (max-width: 768px) {
  .p-energy {
    margin-bottom: 80vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-energy {
    margin-bottom: 175px;
  }
}
.p-energy .p-map {
  background: url("/120thspecialsite/_assets/dynamic/img/img03.png") no-repeat left top/cover;
  display: block;
  opacity: 0;
  position: absolute;
  transition: opacity 0.5s ease-in-out 0.3s;
  z-index: 20;
}
@media only screen and (max-width: 768px) {
  .p-energy .p-map {
    height: 74.8vw;
    left: -29.4666666667vw;
    top: -82.6666666667vw;
    width: 107.3333333333vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-energy .p-map {
    height: 493px;
    right: calc(50% + 102px);
    top: 25px;
    width: 706px;
  }
}
@media only screen and (max-width: 768px) {
  .p-energy .bln1 {
    left: 68vw;
    top: 0.2666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-energy .bln1 {
    left: 459px;
    top: 21px;
  }
}
@media only screen and (max-width: 768px) {
  .p-energy .bln2 {
    left: 40.8vw;
    top: 14.6666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-energy .bln2 {
    left: 268px;
    top: 108px;
  }
}
@media only screen and (max-width: 768px) {
  .p-energy .bln3 {
    left: 40vw;
    top: 32.2666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-energy .bln3 {
    left: 263px;
    top: 231px;
  }
}
@media print, screen and (min-width: 769px) {
  .p-energy .c-box-inner {
    align-items: flex-end;
    display: flex;
    flex-direction: column;
  }
}
@media only screen and (max-width: 768px) {
  .p-energy .p-ttl {
    margin-bottom: 4vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-energy .p-ttl {
    margin-bottom: 40px;
  }
}
@media print, screen and (min-width: 769px) {
  .p-energy .p-timeline {
    padding-left: 70px;
  }
}
.p-energy.start .p-map {
  opacity: 1;
}

.p-energy-line01 {
  background: var(--bc04);
  z-index: 2;
}
@media only screen and (max-width: 768px) {
  .p-energy-line01 {
    --move: -10vw;
    height: 14.6666666667vw;
    top: 73.3333333333vw;
    width: 30.6666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-energy-line01 {
    --move: -6.25vw;
    height: 110px;
    top: 262px;
    width: 20.78125vw;
  }
}

.p-energy-line02 {
  --delay: .4s;
  background: var(--bc02);
}
@media only screen and (max-width: 768px) {
  .p-energy-line02 {
    --move: -14.6666666667vw;
    height: 4.5333333333vw;
    top: 86.2666666667vw;
    width: 46.6666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-energy-line02 {
    --move: -9.375vw;
    height: 34px;
    top: 353px;
    width: 30.15625vw;
  }
}

.p-overseas {
  position: relative;
}
@media only screen and (max-width: 768px) {
  .p-overseas {
    margin-bottom: 93.3333333333vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-overseas {
    margin-bottom: 542px;
  }
}
.p-overseas .p-map {
  background: url("/120thspecialsite/_assets/dynamic/img/img04.png") no-repeat left top/cover;
  display: block;
  opacity: 0;
  position: absolute;
  transition: opacity 0.5s ease-in-out 0.3s;
  z-index: 20;
}
@media only screen and (max-width: 768px) {
  .p-overseas .p-map {
    height: 59.7333333333vw;
    right: -15.2vw;
    top: -56.8vw;
    width: 99.0666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-overseas .p-map {
    height: 393px;
    right: calc(50% + 37px);
    top: 140px;
    width: 652px;
  }
}
.p-overseas .p-map.start::before {
  opacity: 1;
}
@media only screen and (max-width: 768px) {
  .p-overseas .bln1 {
    left: 64vw;
    top: -5.3333333333vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-overseas .bln1 {
    left: 462px;
    top: 0;
  }
}
@media print, screen and (min-width: 769px) {
  .p-overseas .c-box-inner {
    padding-left: 237px;
  }
}
@media only screen and (max-width: 768px) {
  .p-overseas .p-ttl {
    margin-bottom: 4vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-overseas .p-ttl {
    margin-bottom: 36px;
  }
}
.p-overseas.start .p-map {
  opacity: 1;
}

.p-new {
  position: relative;
}
@media only screen and (max-width: 768px) {
  .p-new {
    margin-bottom: 22.2666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-new {
    margin-bottom: 165px;
  }
}
.p-new .p-map {
  background: url("/120thspecialsite/_assets/dynamic/img/img05.png") no-repeat left top/cover;
  display: block;
  opacity: 0;
  position: absolute;
  transition: opacity 0.5s ease-in-out 0.3s;
  z-index: 20;
}
@media only screen and (max-width: 768px) {
  .p-new .p-map {
    height: 72.8vw;
    left: -21.3333333333vw;
    top: -76vw;
    width: 109.8666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-new .p-map {
    height: 478px;
    left: calc(50% + 114px);
    top: -400px;
    width: 723px;
  }
}
@media only screen and (max-width: 768px) {
  .p-new .bln1 {
    left: 46.6666666667vw;
    top: 29.3333333333vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-new .bln1 {
    left: 296px;
    top: 200px;
  }
}
@media print, screen and (min-width: 769px) {
  .p-new .c-box-inner {
    align-items: flex-end;
    display: flex;
    flex-direction: column;
    padding-right: 90px;
  }
}
@media only screen and (max-width: 768px) {
  .p-new .p-ttl {
    margin-bottom: 4vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-new .p-ttl {
    margin-bottom: 40px;
  }
}
.p-new.start .p-map {
  opacity: 1;
}

.p-new-line01 {
  background: var(--bc03);
}
@media only screen and (max-width: 768px) {
  .p-new-line01 {
    --move: 14.6666666667vw;
    height: 2.1333333333vw;
    top: 74.6666666667vw;
    width: 45.3333333333vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-new-line01 {
    --move: 13.203125vw;
    height: 15px;
    top: 450px;
    width: 41.875vw;
  }
}

.p-new-line02 {
  --delay: .3s;
  background: var(--bc02);
  z-index: 2;
}
@media only screen and (max-width: 768px) {
  .p-new-line02 {
    --move: 5.8666666667vw;
    height: 22.6666666667vw;
    top: 80.8vw;
    width: 19.2vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-new-line02 {
    --move: 8.203125vw;
    height: 170px;
    top: 496px;
    width: 25.9375vw;
  }
}

.p-new-line03 {
  --delay: .6s;
  background: var(--bc04);
  z-index: 2;
}
@media only screen and (max-width: 768px) {
  .p-new-line03 {
    --move: -11.4666666667vw;
    height: 35.2vw;
    top: 62.6666666667vw;
    width: 36vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-new-line03 {
    --move: -11.71875vw;
    height: 265px;
    top: 242px;
    width: 37.8125vw;
  }
}

.p-more-button .c-btn {
  margin-inline: auto;
}
@media print, screen and (min-width: 769px) {
  .p-more-button .c-btn {
    font-size: 1.9rem;
    border-radius: 31px;
    height: 62px;
    padding-inline: 24px;
    width: 389px;
  }
}
@media print, screen and (min-width: 769px) {
  .p-more-button .c-btn::after {
    background-size: 6px auto;
    height: 32px;
    width: 32px;
  }
}

.p-overlay {
  background: rgba(0, 59, 132, 0.8);
  display: none;
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 9998;
}

@media only screen and (max-width: 768px) {
  .p-modal-wrapper {
    display: none;
    height: 100%;
    left: 0;
    overflow-y: scroll;
    padding-block: 6.6666666667vw;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999;
  }
}

.p-modal {
  --top: 0;
  background: #fff;
  display: none;
  z-index: 9999;
}
@media only screen and (max-width: 768px) {
  .p-modal {
    margin: 0 auto;
    position: relative;
    width: 81.3333333333vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-modal {
    left: 50%;
    position: fixed;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 1080px;
  }
}

@media print, screen and (min-width: 769px) {
  .p-modal-inner {
    display: flex;
  }
}

@media only screen and (max-width: 768px) {
  .p-modal-image {
    aspect-ratio: 480/590;
    width: 100%;
  }
}
@media print, screen and (min-width: 769px) {
  .p-modal-image {
    flex-shrink: 0;
    width: 480px;
  }
}
.p-modal-image img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

@media only screen and (max-width: 768px) {
  .p-modal-detail {
    padding: 4vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-modal-detail {
    padding: 32px;
  }
}

.p-modal-heading {
  color: var(--bc01);
  font-feature-settings: "palt";
  font-weight: bold;
}
@media only screen and (max-width: 768px) {
  .p-modal-heading {
    font-size: 5.3333333333vw;
    line-height: 1.625;
    margin-bottom: 3.7333333333vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-modal-heading {
    font-size: 3rem;
    line-height: 1.83;
    margin-bottom: 20px;
  }
}

.p-modal-catch {
  font-weight: bold;
}
@media only screen and (max-width: 768px) {
  .p-modal-catch {
    font-size: 3.7333333333vw;
    line-height: 1.428;
    margin-bottom: 1.6vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-modal-catch {
    font-size: 2.2rem;
    line-height: 1.4545;
    margin-bottom: 10px;
  }
}

@media only screen and (max-width: 768px) {
  .p-modal-text {
    font-size: 3.7333333333vw;
    line-height: 1.892;
  }
}
@media print, screen and (min-width: 769px) {
  .p-modal-text {
    font-size: 1.8rem;
    line-height: 1.5;
  }
}
.p-modal-text.-right {
  text-align: right;
}

.p-modal-close {
  display: block;
  position: absolute;
  rotate: 45deg;
}
@media only screen and (max-width: 768px) {
  .p-modal-close {
    height: 8vw;
    right: 1.0666666667vw;
    top: 1.0666666667vw;
    width: 8vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-modal-close {
    height: 37px;
    right: 8px;
    top: 8px;
    width: 37px;
  }
}
.p-modal-close::before, .p-modal-close::after {
  background: #000;
  content: "";
  display: block;
  height: 2px;
  margin-left: -1px;
  position: absolute;
  top: 50%;
  width: 100%;
}
@media only screen and (max-width: 768px) {
  .p-modal-close::before, .p-modal-close::after {
    background: #fff;
  }
}
.p-modal-close::before {
  transform: rotate(90deg);
}

@media only screen and (max-width: 768px) {
  .p-modal-offer {
    margin-top: 2vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-modal-offer {
    margin-top: 15px;
  }
}
@media only screen and (max-width: 768px) {
  .p-modal-offer li {
    letter-spacing: 0;
    font-size: 2.6666666667vw;
    line-height: 1.4;
  }
}
@media print, screen and (min-width: 769px) {
  .p-modal-offer li {
    font-size: 1.2rem;
    line-height: 1.5;
  }
}

.start .p-ttl,
.start .p-timeline-item {
  opacity: 1;
  transform: translateY(0);
}

.p-back-link {
  position: relative;
  z-index: 10;
}
@media only screen and (max-width: 768px) {
  .p-back-link {
    margin-top: 4.5333333333vw;
    padding-left: 2.6666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-back-link {
    margin-top: 50px;
    padding-left: 23px;
  }
}
.p-back-link a {
  color: #fff;
  display: inline-block;
  font-weight: bold;
  line-height: 1.45;
  position: relative;
}
@media only screen and (max-width: 768px) {
  .p-back-link a {
    font-size: 5.3333333333vw;
    padding-bottom: 0.6666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-back-link a {
    font-size: 4rem;
    padding-bottom: 5px;
  }
}
.p-back-link a::before {
  background: #fff;
  bottom: 0;
  content: "";
  display: block;
  left: 0;
  position: absolute;
  transition: scale 0.3s ease-in-out;
  transform-origin: 0 0;
  width: 100%;
}
@media only screen and (max-width: 768px) {
  .p-back-link a::before {
    height: 0.6666666667vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-back-link a::before {
    height: 5px;
  }
}
@media print, screen and (min-width: 769px) {
  .p-back-link a:hover::before {
    scale: 0 1;
    transform-origin: 100% 0;
  }
}

.p-map-balloon {
  position: absolute;
  z-index: 10;
}
.p-map-balloon a {
  position: relative;
  z-index: 2;
}
@media only screen and (max-width: 768px) {
  .p-map-balloon img {
    height: auto;
    width: 8.8vw;
  }
}

.p-map-balloon-text {
  align-items: center;
  animation: mask_close 0.3s linear forwards;
  background: #fff;
  display: flex;
  font-weight: bold;
  left: 0;
  line-height: 1.64;
  mask-image: linear-gradient(to right, black 50%, transparent 50%);
  mask-position: 100% 0;
  mask-size: 200% 200%;
  mask-repeat: no-repeat;
  position: absolute;
  top: 0;
  transition: 0.3s linear 0.1s;
  visibility: hidden;
  white-space: nowrap;
  will-change: mask-position;
}
@media only screen and (max-width: 768px) {
  .p-map-balloon-text {
    font-size: 2.6666666667vw;
    height: 10.1333333333vw;
    padding-inline: 8.8vw 1.3333333333vw;
  }
}
@media print, screen and (min-width: 769px) {
  .p-map-balloon-text {
    font-size: 1.2rem;
    height: 49px;
    padding-inline: 43px 7px;
  }
}
.p-map-balloon-text.is-active {
  animation: mask_from_left 0.3s linear forwards;
  visibility: visible;
}