@charset "UTF-8";
* {
  box-sizing: border-box;
  word-break: break-word;
}

img {
  max-width: 100%;
}

a.link-tel {
  text-decoration: underline;
}
@media (min-width: 769px) {
  a.link-tel {
    text-decoration: none;
    pointer-events: none;
  }
}

a.disable {
  pointer-events: none;
}

.txt-underline {
  text-decoration: underline;
}

@media (max-width: 768px) {
  .pc-visible {
    display: none;
  }
}

@media (min-width: 769px) {
  .sp-visible {
    display: none;
  }
}

@-webkit-keyframes sliderLeft {
  0% {
    opacity: 0;
    transform: translateX(50%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@-moz-keyframes sliderLeft {
  0% {
    opacity: 0;
    transform: translateX(50%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes sliderLeft {
  0% {
    opacity: 0;
    transform: translateX(50%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@-webkit-keyframes sliderRight {
  0% {
    opacity: 0;
    transform: translateX(-50%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@-moz-keyframes sliderRight {
  0% {
    opacity: 0;
    transform: translateX(-50%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes sliderRight {
  0% {
    opacity: 0;
    transform: translateX(-50%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-moz-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(30px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
@-moz-keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(30px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(30px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
@-webkit-keyframes slideUp {
  0% {
    transform: translateY(100%);
    opacity: 0;
  }
  60% {
    opacity: 1;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@-moz-keyframes slideUp {
  0% {
    transform: translateY(100%);
    opacity: 0;
  }
  60% {
    opacity: 1;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slideUp {
  0% {
    transform: translateY(100%);
    opacity: 0;
  }
  60% {
    opacity: 1;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@-webkit-keyframes bgSliderL {
  0% {
    opacity: 0;
    transform: translateX(50%);
  }
  40% {
    opacity: 0;
  }
  51% {
    opacity: 0.3;
  }
  70% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateX(0%);
  }
}
@-moz-keyframes bgSliderL {
  0% {
    opacity: 0;
    transform: translateX(50%);
  }
  40% {
    opacity: 0;
  }
  51% {
    opacity: 0.3;
  }
  70% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateX(0%);
  }
}
@keyframes bgSliderL {
  0% {
    opacity: 0;
    transform: translateX(50%);
  }
  40% {
    opacity: 0;
  }
  51% {
    opacity: 0.3;
  }
  70% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateX(0%);
  }
}
@-webkit-keyframes bgMenuSliderL {
  0% {
    opacity: 1;
    transform: translateX(50%);
  }
  100% {
    opacity: 1;
    transform: translateX(0%);
  }
}
@-moz-keyframes bgMenuSliderL {
  0% {
    opacity: 1;
    transform: translateX(50%);
  }
  100% {
    opacity: 1;
    transform: translateX(0%);
  }
}
@keyframes bgMenuSliderL {
  0% {
    opacity: 1;
    transform: translateX(50%);
  }
  100% {
    opacity: 1;
    transform: translateX(0%);
  }
}
@-webkit-keyframes bgSliderR {
  0% {
    opacity: 1;
    transform: translateX(0%);
  }
  100% {
    opacity: 0;
    transform: translateX(100%);
  }
}
@-moz-keyframes bgSliderR {
  0% {
    opacity: 1;
    transform: translateX(0%);
  }
  100% {
    opacity: 0;
    transform: translateX(100%);
  }
}
@keyframes bgSliderR {
  0% {
    opacity: 1;
    transform: translateX(0%);
  }
  100% {
    opacity: 0;
    transform: translateX(100%);
  }
}
/* ゆらぎアニメーション（横長バージョン） */
@-webkit-keyframes morph {
  0% {
    d: path("M200,80 C370,80 430,220 200,220 C-30,220 30,80 200,80Z");
  }
  25% {
    d: path("M200,85 C380,90 420,215 200,215 C-20,210 40,90 200,85Z");
  }
  50% {
    d: path("M200,75 C360,85 440,225 200,225 C-40,210 20,75 200,75Z");
  }
  75% {
    d: path("M200,80 C375,70 415,230 200,230 C-25,220 35,80 200,80Z");
  }
  100% {
    d: path("M200,80 C370,80 430,220 200,220 C-30,220 30,80 200,80Z");
  }
}
@-moz-keyframes morph {
  0% {
    d: path("M200,80 C370,80 430,220 200,220 C-30,220 30,80 200,80Z");
  }
  25% {
    d: path("M200,85 C380,90 420,215 200,215 C-20,210 40,90 200,85Z");
  }
  50% {
    d: path("M200,75 C360,85 440,225 200,225 C-40,210 20,75 200,75Z");
  }
  75% {
    d: path("M200,80 C375,70 415,230 200,230 C-25,220 35,80 200,80Z");
  }
  100% {
    d: path("M200,80 C370,80 430,220 200,220 C-30,220 30,80 200,80Z");
  }
}
@keyframes morph {
  0% {
    d: path("M200,80 C370,80 430,220 200,220 C-30,220 30,80 200,80Z");
  }
  25% {
    d: path("M200,85 C380,90 420,215 200,215 C-20,210 40,90 200,85Z");
  }
  50% {
    d: path("M200,75 C360,85 440,225 200,225 C-40,210 20,75 200,75Z");
  }
  75% {
    d: path("M200,80 C375,70 415,230 200,230 C-25,220 35,80 200,80Z");
  }
  100% {
    d: path("M200,80 C370,80 430,220 200,220 C-30,220 30,80 200,80Z");
  }
}
@-webkit-keyframes textColor {
  0% {
    color: #fff;
  }
  100% {
    color: #00ff66;
  }
}
@-moz-keyframes textColor {
  0% {
    color: #fff;
  }
  100% {
    color: #00ff66;
  }
}
@keyframes textColor {
  0% {
    color: #fff;
  }
  100% {
    color: #00ff66;
  }
}
/* ボタン用のゆらぎアニメーション */
@keyframes css-wobble {
  0% {
    transform: scale(1) rotate(-5deg);
  }
  100% {
    transform: scale(1.05) rotate(5deg);
  }
}
/* メインビジュアル用の大きなゆらぎアニメーション */
@keyframes css-wobble-large {
  0% {
    transform: scale(1) rotate(-3deg);
  }
  100% {
    transform: scale(1.05) rotate(3deg);
  }
}
html {
  scrollbar-gutter: stable;
}

body {
  color: #fff;
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-size: 1rem;
  background: #000;
  -webkit-overflow-scrolling: touch;
}
body.no-scroll {
  overflow: hidden;
}

@media (hover: hover) {
  .opacity-link {
    transition: opacity 0.2s ease;
  }
  .opacity-link:hover {
    opacity: 0.7;
  }
}
.font-roboto {
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}

.js-scroll-trigger {
  opacity: 0;
}
.js-scroll-trigger.active {
  animation: fadeInUp 0.8s linear forwards;
}

svg {
  overflow: visible !important;
}

.splash-contents {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99999;
  width: 100%;
  height: 100vh;
  padding: 0 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.splash-contents video {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 100%;
  height: auto;
  max-width: 1920px;
  transform: translate(-50%, -50%);
}
@media (max-width: 768px) {
  .splash-contents {
    height: 100svh;
  }
}

.wrapper {
  opacity: 0;
  transition: opacity 1.5s linear;
}

.l-contents {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.anchor-target {
  position: relative;
  margin-top: -50px;
  padding-top: 50px;
}

.mv {
  padding: 70px 0 0 0;
  width: 100%;
  max-width: 1090px;
  margin: 0 auto;
  overflow: hidden;
}
.mv .mv-logo {
  width: 72%;
  margin: 0 auto;
  max-width: 780px;
  position: relative;
  z-index: 1;
}
.mv .mv-box {
  position: relative;
  z-index: 0;
  margin-top: -10px;
}
.mv .mv-box .box-l {
  width: calc(800 / 1090 * 100%);
  margin-left: -30px;
}
.mv .mv-box .box-l .box-in {
  position: relative;
  width: 100%;
  height: 100%;
}
.mv .mv-box .box-l .box-in svg {
  transform: rotate(20deg);
}
.mv .mv-box .box-l .box-in .box-text {
  width: 35%;
  position: absolute;
  top: 22%;
  left: 35%;
}
.mv .mv-box .box-l .box-in .box-text .ttl1 {
  display: inline-block;
  overflow: hidden;
}
.mv .mv-box .box-l .box-in .box-text .ttl1 img {
  transform: translateY(100%);
}
.mv .mv-box .box-l .box-in .box-text .ttl1 img.is-active {
  animation: slideUp 1s ease forwards;
}
.mv .mv-box .box-l .box-in .box-text .ttl2 {
  margin-top: 20px;
  display: inline-block;
  overflow: hidden;
}
.mv .mv-box .box-l .box-in .box-text .ttl2 img {
  transform: translateY(100%);
}
.mv .mv-box .box-l .box-in .box-text .ttl2 img.is-active {
  animation: slideUp 1s 0.3s ease forwards;
}
.mv .mv-box .btn-about {
  position: absolute;
  width: calc(379 / 1090 * 100%);
  top: 22.5%;
  right: calc(15 / 1090 * 100%);
}
.mv .mv-box .btn-about .box-in {
  position: relative;
  width: 100%;
  height: 100%;
}
.mv .mv-box .btn-about .box-in svg {
  width: 100%;
  transform: rotate(-20deg);
}
.mv .mv-box .btn-about .box-in .btn-link {
  position: absolute;
  top: 31%;
  left: 33%;
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: bold;
  text-decoration: underline;
  font-size: 20px;
  letter-spacing: 0.04em;
  line-height: 1;
  text-align: center;
  text-decoration-color: #fff;
  transition: text-decoration-color 0.5s ease-in-out;
}
.mv .mv-box .btn-about .box-in .btn-link span {
  color: #fff;
  /* 戻る時のtransition。delayは0秒なので一斉に戻る */
  transition: color 0.3s ease-in-out;
}
@media (hover: hover) and (pointer: fine) {
  .mv .mv-box .btn-about .box-in .btn-link:hover {
    text-decoration-color: #00ff66;
  }
  .mv .mv-box .btn-about .box-in .btn-link:hover span {
    color: #00ff66;
    /* ホバー時の目標の色 */
    /* ホバーした時に時間差で色が変化するようにdelayを設定 */
  }
  .mv .mv-box .btn-about .box-in .btn-link:hover span:nth-child(1) {
    transition-delay: 0s;
  }
  .mv .mv-box .btn-about .box-in .btn-link:hover span:nth-child(2) {
    transition-delay: 0.1s;
  }
  .mv .mv-box .btn-about .box-in .btn-link:hover span:nth-child(3) {
    transition-delay: 0.2s;
  }
  .mv .mv-box .btn-about .box-in .btn-link:hover span:nth-child(4) {
    transition-delay: 0.3s;
  }
  .mv .mv-box .btn-about .box-in .btn-link:hover span:nth-child(5) {
    transition-delay: 0.4s;
  }
}
@media (max-width: 768px) {
  .mv {
    padding: 150px 0 50px 0;
  }
  .mv .mv-logo {
    width: 65%;
  }
  .mv .mv-box {
    position: relative;
    z-index: 0;
    margin-top: 5px;
  }
  .mv .mv-box .box-l {
    width: 80%;
    margin-left: 8.8%;
  }
  .mv .mv-box .box-l .box-in .box-text {
    width: 45%;
    position: absolute;
    top: 19.8%;
    left: 29%;
  }
  .mv .mv-box .box-l .box-in .box-text .ttl2 {
    margin-top: 5px;
  }
  .mv .mv-box .btn-about {
    position: relative;
    width: 50%;
    top: auto;
    right: auto;
    margin: -88px 10% 0 auto;
  }
  .mv .mv-box .btn-about .box-in .btn-link {
    top: 30%;
    left: 26%;
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-size: 16px;
  }
}

.about-contents {
  width: 100%;
  max-width: 623px;
  margin: -80px auto 0 auto;
  padding-top: 30px;
}
.about-contents .text-box {
  margin-top: 80px;
}
.about-contents .ttl1,
.about-contents .ttl2 {
  font-size: 37px;
  letter-spacing: 0.04em;
  line-height: 1;
  text-align: left;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.about-contents .ttl1 span,
.about-contents .ttl2 span {
  opacity: 0;
  display: inline-block;
}
.about-contents .ttl1.type1,
.about-contents .ttl2.type1 {
  display: inline-block;
}
.about-contents .ttl1.type1:before,
.about-contents .ttl2.type1:before {
  position: absolute;
  content: "";
  width: 78px;
  height: 2px;
  background-color: #fff;
  right: -83px;
  top: 20px;
}
.about-contents .ttl1.active span,
.about-contents .ttl2.active span {
  animation: 0.8s slideUp ease-in-out forwards;
}
.about-contents .ttl2 {
  margin-top: 25px;
  text-align: right;
}
.about-contents .text1 {
  margin-top: 40px;
  font-size: 14px;
  letter-spacing: 0.04em;
  line-height: 28px;
  text-align: left;
  color: #fff;
  overflow: hidden;
}
.about-contents .text1 span {
  opacity: 0;
  display: inline-block;
}
.about-contents .text1.active span {
  animation: 1s slideUp ease-in-out forwards;
}
@media (max-width: 768px) {
  .about-contents {
    width: calc(100% - 90px);
    max-width: auto;
    margin: 0 auto;
    padding-top: 30px;
  }
  .about-contents .text-box {
    margin-top: 30px;
  }
  .about-contents .ttl1,
  .about-contents .ttl2 {
    font-size: 20px;
  }
  .about-contents .ttl1.type1:before,
  .about-contents .ttl2.type1:before {
    width: 30px;
    height: 2px;
    right: -33px;
    top: 11px;
  }
  .about-contents .ttl2 {
    margin-top: 10px;
  }
  .about-contents .text1 {
    margin-top: 30px;
    font-size: 12px;
    line-height: 22px;
  }
}

.news-contents {
  width: 100%;
  max-width: 780px;
  margin: 0 auto;
}
.news-contents .btn-news {
  width: 300px;
  margin: 60px 0 0 auto;
}
.news-contents .btn-news .box-in {
  position: relative;
  width: 100%;
  height: 100%;
}
.news-contents .btn-news svg {
  width: 100%;
  transform: rotate(-20deg);
}
.news-contents .btn-news .btn-link {
  position: absolute;
  top: 65px;
  left: 100px;
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: bold;
  text-decoration: underline;
  font-size: 20px;
  letter-spacing: 0.04em;
  line-height: 1;
  text-align: center;
  text-decoration-color: #fff;
  transition: text-decoration-color 0.4s ease-in-out;
}
.news-contents .btn-news .btn-link span {
  color: #fff;
  /* 戻る時のtransition。delayは0秒なので一斉に戻る */
  transition: color 0.3s ease-in-out;
}
@media (hover: hover) and (pointer: fine) {
  .news-contents .btn-news .btn-link:hover {
    text-decoration-color: #00ff66;
  }
  .news-contents .btn-news .btn-link:hover span {
    color: #00ff66;
    /* ホバー時の目標の色 */
    /* ホバーした時に時間差で色が変化するようにdelayを設定 */
  }
  .news-contents .btn-news .btn-link:hover span:nth-child(1) {
    transition-delay: 0s;
  }
  .news-contents .btn-news .btn-link:hover span:nth-child(2) {
    transition-delay: 0.1s;
  }
  .news-contents .btn-news .btn-link:hover span:nth-child(3) {
    transition-delay: 0.2s;
  }
  .news-contents .btn-news .btn-link:hover span:nth-child(4) {
    transition-delay: 0.3s;
  }
  .news-contents .btn-news .btn-link:hover span:nth-child(5) {
    transition-delay: 0.4s;
  }
}
@media (max-width: 768px) {
  .news-contents {
    margin: 30px 0 0 auto;
  }
  .news-contents .btn-news {
    width: 55%;
    margin: 0 -15px 0 auto;
  }
  .news-contents .btn-news .btn-link {
    top: 30%;
    left: 29%;
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-size: 16px;
  }
}

/* 共通スタイル */
.ellipse {
  fill: none;
  stroke: #03ff64;
  /* transform-originをSVGの中心に設定 */
  transform-origin: center;
  /* 新しいアニメーションを適用 */
  animation: css-wobble 4s ease-in-out infinite alternate;
}
.ellipse:nth-child(1) {
  stroke-width: 1.8;
}
.ellipse:nth-child(2) {
  stroke-width: 1;
  animation-delay: -2s;
}
.ellipse:nth-child(3) {
  stroke-width: 0.5;
  animation-delay: -4s;
}
.ellipse.type1 {
  animation: css-wobble-large 5s ease-in-out infinite alternate;
}
.ellipse.type1:nth-child(1) {
  animation-delay: -2s;
  stroke-width: 1;
}
.ellipse.type1:nth-child(2) {
  stroke-width: 1.8;
  animation-delay: -6s;
}
.ellipse.type1:nth-child(3) {
  stroke-width: 0.5;
  animation-delay: -4s;
}

.cmn-footer {
  margin-top: 50px;
  padding-bottom: 15px;
}
.cmn-footer .bnr-list {
  display: flex;
  align-items: center;
  justify-content: center;
}
.cmn-footer .bnr-list li {
  margin-left: 40px;
}
.cmn-footer .bnr-list li:first-child {
  margin-left: 0;
}
.cmn-footer .privacy-link {
  display: block;
  font-weight: normal;
  text-decoration: underline;
  font-size: 12px;
  letter-spacing: 0.04em;
  line-height: 28px;
  text-align: center;
  color: #fff;
}
.cmn-footer .copyright {
  margin-top: 10px;
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-size: 11px;
  letter-spacing: 0.04em;
  line-height: 28px;
  text-align: center;
  color: #fff;
  opacity: 0.5;
}
@media (max-width: 768px) {
  .cmn-footer {
    margin-top: 40px;
  }
  .cmn-footer .bnr-list {
    width: calc(100% - 50px);
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .cmn-footer .bnr-list li {
    margin: 0;
  }
  .cmn-footer .bnr-list li:nth-child(1) {
    width: calc(92 / 330 * 100%);
  }
  .cmn-footer .bnr-list li:nth-child(2) {
    width: calc(92 / 330 * 100%);
  }
  .cmn-footer .bnr-list li:nth-child(3) {
    width: calc(56 / 330 * 100%);
  }
  .cmn-footer .bnr-list li:nth-child(4) {
    width: calc(36 / 330 * 100%);
  }
  .cmn-footer .bnr-list li svg {
    width: 100%;
  }
  .cmn-footer .privacy-link {
    margin-top: 15px;
    font-size: 10px;
    line-height: 1;
  }
  .cmn-footer .copyright {
    margin-top: 20px;
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-size: 9px;
    letter-spacing: 0.04em;
    line-height: 1;
  }
}