@keyframes infinity-scroll-left {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}
@keyframes arrow-link-line {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
  }
  49.99% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
  }
  50% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
  }
  100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
  }
}
@keyframes arrow-link-line-reverse {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
  }
  49.99% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
  }
  50% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
  }
  100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
  }
}
@keyframes opacity {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.message-intro {
  padding-top: 8.3333333333vw;
  padding-bottom: 12.5vw;
  display: flex;
  align-items: flex-start;
  position: relative;
}
@media (max-width: 767px) {
  .message-intro {
    padding-top: 13.3333333333vw;
    padding-bottom: 34.6666666667vw;
    display: block;
  }
}
.message-intro:before {
  content: "";
  display: block;
  width: 50.7638888889vw;
  aspect-ratio: 1462/1462;
  background-image: url(../../img/common/deco_circle.webp);
  background-repeat: no-repeat;
  background-position: 50% 0%;
  background-size: contain;
  position: absolute;
  top: -11.875vw;
  right: -9.6527777778vw;
  opacity: 0.6;
  z-index: -1;
}
@media (max-width: 767px) {
  .message-intro:before {
    width: 91.7333333333vw;
    top: 78.6666666667vw;
    right: -19.4666666667vw;
    z-index: auto;
  }
}
.message-intro img {
  display: block;
  width: 39.3055555556vw;
  margin-left: 11.0416666667vw;
}
@media (max-width: 1024px) {
  .message-intro img {
    margin-left: 6.6666666667vw;
  }
}
@media (max-width: 767px) {
  .message-intro img {
    width: 100%;
    margin-left: 0;
  }
}
.message-intro__wrap {
  width: fit-content;
  transform: translateX(-1.3888888889vw);
}
@media (max-width: 767px) {
  .message-intro__wrap {
    transform: none;
    margin-left: auto;
    margin-right: auto;
  }
}
.message-intro__wrap .desc {
  font-weight: 700;
  font-size: clamp(40px, 2.7777777778vw, 40px * 1.05);
  line-height: 1.8;
  letter-spacing: 0.06em;
  margin-top: 5.2083333333vw;
}
@media (max-width: 1024px) {
  .message-intro__wrap .desc {
    font-size: clamp(35px, 2.4305555556vw, 35px * 1.05);
  }
}
@media (max-width: 820px) {
  .message-intro__wrap .desc {
    font-size: clamp(33px, 2.2916666667vw, 33px * 1.05);
  }
}
@media (max-width: 767px) {
  .message-intro__wrap .desc {
    font-size: 6.4vw;
    line-height: 1.6;
    margin-top: -4.8vw;
  }
}
.message-intro__wrap .desc > span {
  transition: 1.4s;
}
.message-intro__wrap .desc > span:nth-of-type(1) {
  transition-delay: 0.03s;
}
.message-intro__wrap .desc > span:nth-of-type(2) {
  transition-delay: 0.06s;
}
.message-intro__wrap .desc > span:nth-of-type(3) {
  transition-delay: 0.09s;
}
.message-intro__wrap .desc > span:nth-of-type(4) {
  transition-delay: 0.12s;
}
.message-intro__wrap .desc > span:nth-of-type(5) {
  transition-delay: 0.15s;
}
.message-intro__wrap .desc > span:nth-of-type(6) {
  transition-delay: 0.18s;
}
.message-intro__wrap .desc > span:nth-of-type(7) {
  transition-delay: 0.21s;
}
.message-intro__wrap .desc > span:nth-of-type(8) {
  transition-delay: 0.24s;
}
.message-intro__wrap .desc > span:nth-of-type(9) {
  transition-delay: 0.27s;
}
.message-intro__wrap .desc > span:nth-of-type(10) {
  transition-delay: 0.3s;
}
.message-intro__wrap .desc > span:nth-of-type(11) {
  transition-delay: 0.33s;
}
.message-intro__wrap .desc > span:nth-of-type(12) {
  transition-delay: 0.36s;
}
.message-intro__wrap .desc > span:nth-of-type(13) {
  transition-delay: 0.39s;
}
.message-intro__wrap .desc > span:nth-of-type(14) {
  transition-delay: 0.42s;
}
.message-intro__wrap .desc > span:nth-of-type(15) {
  transition-delay: 0.45s;
}
.message-intro__wrap .desc > span:nth-of-type(16) {
  transition-delay: 0.48s;
}
.message-intro__wrap .desc > span:nth-of-type(17) {
  transition-delay: 0.51s;
}
.message-intro__wrap .desc > span:nth-of-type(18) {
  transition-delay: 0.54s;
}
.message-intro__wrap .desc > span:nth-of-type(19) {
  transition-delay: 0.57s;
}
.message-intro__wrap .desc > span:nth-of-type(20) {
  transition-delay: 0.6s;
}
.message-intro__wrap .desc > span:nth-of-type(21) {
  transition-delay: 0.63s;
}
.message-intro__wrap .desc > span:nth-of-type(22) {
  transition-delay: 0.66s;
}
.message-intro__wrap .desc > span:nth-of-type(23) {
  transition-delay: 0.69s;
}
.message-intro__wrap .desc > span:nth-of-type(24) {
  transition-delay: 0.72s;
}
.message-intro__wrap .desc > span:nth-of-type(25) {
  transition-delay: 0.75s;
}
.message-intro__wrap .desc > span:nth-of-type(26) {
  transition-delay: 0.78s;
}
.message-intro__wrap .desc > span:nth-of-type(27) {
  transition-delay: 0.81s;
}
.message-intro__wrap .desc > span:nth-of-type(28) {
  transition-delay: 0.84s;
}
.message-intro__wrap .desc > span:nth-of-type(29) {
  transition-delay: 0.87s;
}
.message-intro__wrap .desc > span:nth-of-type(30) {
  transition-delay: 0.9s;
}
.message-intro__wrap .name {
  font-weight: 500;
  line-height: 2;
  font-size: clamp(18px, 1.25vw, 18px * 1.05);
  display: block;
  text-align: right;
  margin-left: auto;
  margin-top: 4.4444444444vw;
}
@media (max-width: 1024px) {
  .message-intro__wrap .name {
    font-size: clamp(16px, 1.1111111111vw, 16px * 1.05);
  }
}
@media (max-width: 767px) {
  .message-intro__wrap .name {
    font-size: 4.2666666667vw;
    line-height: 1.6;
    margin-top: 5.3333333333vw;
  }
}

.message-view .list > li {
  padding-top: 2.5vw;
  padding-bottom: 6.6666666667vw;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4.0972222222vw;
  box-sizing: border-box;
  padding-left: 6.6666666667vw;
  position: relative;
}
@media (max-width: 767px) {
  .message-view .list > li {
    padding-top: 0;
    padding-bottom: 19.2vw;
    gap: 6.4vw;
    flex-direction: column;
    align-items: flex-start;
    padding-left: 0;
  }
}
.message-view .list > li:nth-of-type(2n) {
  flex-direction: row-reverse;
  padding-left: 0;
  padding-right: 6.6666666667vw;
}
@media (max-width: 767px) {
  .message-view .list > li:nth-of-type(2n) {
    flex-direction: column;
    padding-right: 0;
  }
}
.message-view .list > li.first .ttl {
  width: calc(100% + 2em);
}
@media (max-width: 1200px) {
  .message-view .list > li.first .ttl {
    width: 100%;
  }
}
@media (max-width: 767px) {
  .message-view .list > li.first img {
    margin-left: auto;
  }
}
.message-view .list > li.first .deco {
  width: 46.5277777778vw;
  aspect-ratio: 670/819;
  background-image: url(../../img/common/deco_rect02.svg);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: contain;
  position: absolute;
  top: 18.5416666667vw;
  left: -5.3472222222vw;
  z-index: -1;
}
@media (max-width: 767px) {
  .message-view .list > li.first .deco {
    display: none;
  }
}
.message-view .list > li.second .deco {
  width: 64.7916666667vw;
  aspect-ratio: 933/1140;
  background-image: url(../../img/common/deco_rect03.svg);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: contain;
  position: absolute;
  top: 6.25vw;
  right: -5.5555555556vw;
  z-index: -1;
}
@media (max-width: 767px) {
  .message-view .list > li.second .deco {
    display: none;
  }
}
.message-view .list > li.third {
  margin-left: auto;
}
.message-view .list > li.third .ttl {
  width: calc(100% + 1em);
}
@media (max-width: 1200px) {
  .message-view .list > li.third .ttl {
    width: 100%;
  }
}
@media (max-width: 767px) {
  .message-view .list > li.third img {
    margin-left: auto;
  }
}
.message-view .list > li .txtWrap {
  width: 44.4196428571%;
  max-width: clamp(597px, 41.4583333333vw, 597px * 1.05);
}
@media (max-width: 767px) {
  .message-view .list > li .txtWrap {
    width: 89.3333333333vw;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}
.message-view .list > li .ttl {
  font-weight: 700;
  font-size: clamp(32px, 2.2222222222vw, 32px * 1.05);
  line-height: 1.4375;
}
@media (max-width: 767px) {
  .message-view .list > li .ttl {
    font-size: 6.9333333333vw;
    line-height: 1.4615384615;
  }
}
.message-view .list > li .ttl > span {
  background: linear-gradient(90deg, #B7B758 2.96%, #C58598 50.16%, #7BC1D3 97.35%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  width: fit-content;
  display: block;
}
.message-view .list > li .desc {
  font-size: clamp(16px, 1.1111111111vw, 16px * 1.05);
  line-height: 2.4;
  margin-top: 2.4em;
}
@media (max-width: 767px) {
  .message-view .list > li .desc {
    font-size: 4.2666666667vw;
    line-height: 2;
    margin-top: 2em;
  }
}
.message-view .list > li .desc:nth-child(2) {
  margin-top: 2.5vw;
  text-indent: 6em;
  position: relative;
}
@media (max-width: 767px) {
  .message-view .list > li .desc:nth-child(2) {
    margin-top: 6.4vw;
    text-indent: 3.8em;
  }
}
.message-view .list > li .desc:nth-child(2):before {
  content: "";
  display: inline-block;
  width: clamp(87px, 6.0416666667vw, 87px * 1.05);
  height: clamp(4px, 0.2777777778vw, 4px * 1.05);
  background: linear-gradient(90deg, #F4F4EF 0%, #F6E7EE 50%, #E7F2F5 100%);
  position: absolute;
  top: 1.05em;
  left: 0;
}
@media (max-width: 767px) {
  .message-view .list > li .desc:nth-child(2):before {
    width: 14.6666666667vw;
    height: 1.0666666667vw;
    top: 0.9em;
  }
}
.message-view .list > li img {
  width: 50.5208333333%;
}
@media (max-width: 767px) {
  .message-view .list > li img {
    width: 83.7333333333vw;
  }
}

/*# sourceMappingURL=message.css.map */