@charset "UTF-8";
html {
  scroll-behavior: smooth;
}

body {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  font-size: 14px;
  width: 100vw;
  color: #08014E;
  background-color: #F8B62D;
}

a {
  text-decoration: none;
}

ul {
  margin: 0;
  padding: 0;
}

li {
  list-style: none;
}

img {
  width: 100%;
  height: auto;
}

video {
  width: 100%;
  display: block;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
}

.disk .displaysize {
  position: fixed;
  width: 100vw;
  width: -moz-fit-content;
  height: 100vh;
  top: 0;
  z-index: -6;
  opacity: .85;
}

.disk .position {
  position: absolute;
  width: fit-content;
  width: -moz-fit-content;
  height: fit-content;
  left: -100px;
  bottom: -100px;
  max-width: 500px;
  max-height: 500px;
  display: block;
}

.disk .loop {
  position: relative;
  width: 55vw;
  height: 55vw;
  letter-spacing: 0.1em;
  max-width: 500px;
  max-height: 500px;
  display: block;
}

.disk .loop::before {
  content: "";
  width: 5vh;
  height: 5vh;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #F8B62D;
  border-radius: 50%;
  border: 6vw solid #F82D4B;
  box-sizing: content-box;
  max-width: 190px;
  max-height: 190px;
}

.disk .loop::after {
  content: "";
  width: 70vw;
  height: 70vw;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #08014E;
  border-radius: 50%;
  z-index: -2;
  max-width: 650px;
  max-height: 650px;
}

.disk .loop svg {
  overflow: visible;
}

.disk .loop path {
  fill: none;
}

.disk .loop text {
  fill: #fff;
  font-size: 10px;
}

.disk #samantha-toast-container {
  display: none;
}

.hidden {
  transform: translateY(-100%);
  /* 上にスライドして非表示にする */
  opacity: 0;
  /* 透明にする */
}

.header {
  position: fixed;
  z-index: 999;
  padding: 10px 0;
  width: 100%;
}

.header__inner {
  margin: auto;
  width: 93.75%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  align-items: start;
}

@media screen and (min-width: 744px) {
  .header__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .header__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

.header__logo {
  padding: 5px 7px;
  background-color: #fff;
  width: 16%;
  border-radius: 12px;
  border: 1px solid #08014E;
  box-shadow: 4px 4px 0 #08014E;
  position: relative;
  transition: all 0.3s;
  top: 0;
  left: 0;
}

.header__logo:hover {
  top: 2px;
  left: 2px;
  box-shadow: 2px 2px 0 #08014E;
}

.header__hambtn {
  position: relative;
  background: #F8B62D;
  border: 1px solid #08014E;
  cursor: pointer;
  width: 15%;
  height: 40px;
  border-radius: 12px;
  position: relative;
  transition: all 0.3s;
  top: 0;
  left: 0;
  box-shadow: 4px 4px 0 #08014E;
}

.header__hambtn:hover {
  top: 2px;
  left: 2px;
  box-shadow: 2px 2px 0 #08014E;
}

.header__hambtn span {
  display: inline-block;
  transition: all .4s;
  position: absolute;
  height: 3px;
  border-radius: 2px;
  background: #08014E;
  width: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  top: 50%;
}

.header__hambtn span:nth-of-type(1) {
  top: 25%;
}

.header__hambtn span:nth-of-type(3) {
  top: 75%;
}

.header__hambtn:hover span:nth-of-type(1) {
  top: 40%;
}

.header__hambtn:hover span:nth-of-type(3) {
  top: 60%;
}

.header__hambtn.close:hover span:nth-of-type(1) {
  transform: translate(-50%, -50%) rotate(-20deg);
}

.header__hambtn.close:hover span:nth-of-type(3) {
  transform: translate(-50%, -50%) rotate(20deg);
}

.header__hambtn.close span:nth-of-type(1) {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-30deg);
  transform-origin: center;
}

.header__hambtn.close span:nth-of-type(2) {
  opacity: 0;
}

.header__hambtn.close span:nth-of-type(3) {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(30deg);
  transform-origin: center;
}

@media screen and (min-width: 744px) {
  .header {
    padding: 24px 0;
  }
  .header__inner {
    width: 91.93548%;
  }
  .header__logo {
    padding: 10px 15px;
    width: 20%;
    border-radius: 30px;
    border: 3px solid #08014E;
  }
  .header__hambtn {
    border: 3px solid #08014E;
    height: 80px;
    border-radius: 25px;
  }
  .header__hambtn span {
    height: 4px;
  }
  .header__hambtn span:nth-of-type(1) {
    top: 30%;
  }
  .header__hambtn span:nth-of-type(3) {
    top: 70%;
  }
}

@media screen and (min-width: 901px) {
  .header {
    width: 100vw;
    padding: 20px 60px;
  }
  .header__inner {
    width: 100%;
    max-width: inherit;
    justify-content: space-between;
  }
  .header__logo {
    padding: 10px 15px;
    border-radius: 30px;
    border: 3px solid #08014E;
    max-width: 160px;
    box-shadow: 4px 4px 0 #08014E;
  }
  .header__hambtn {
    border: 3px solid #08014E;
    height: 80px;
    border-radius: 25px;
    width: 8%;
  }
  .header__hambtn span {
    height: 4px;
    width: 60%;
  }
  .header__hambtn span:nth-of-type(1) {
    top: 30%;
  }
  .header__hambtn span:nth-of-type(3) {
    top: 70%;
  }
}

.conbtm {
  position: relative;
}

.conbtm__box {
  position: fixed;
  bottom: 0;
  z-index: 999;
  width: 100vw;
  background-color: #08014E;
  padding-top: 5px;
  border-radius: 10px 10px 0 0;
  font-family: "M PLUS 1p", sans-serif;
}

.conbtm__title {
  font-size: 14px;
  text-align: center;
  font-weight: 600;
  color: #fff;
}

.conbtm__list {
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  align-items: flex-end;
}

.conbtm__item {
  width: 50%;
  border: 2px solid #08014E;
  border-bottom: 0;
  overflow: hidden;
  border-radius: 10px 10px 0 0;
  font-weight: 700;
  font-size: 20px;
}

.conbtm__item a {
  display: block;
  padding: 10px 0;
  text-align: center;
  width: 100%;
  height: 100%;
}

.conbtm .linebtn {
  background-color: #00B900;
  color: #fff;
}

.conbtm .linebtn a {
  padding: 11px 0 10px;
}

.conbtm .mailbtn {
  background-color: #F8B62D;
}

.conbtm .mailbtn svg {
  display: none;
  font-size: 24px;
  width: 40px;
}

@media screen and (min-width: 901px) {
  .conbtm__box {
    bottom: 4.80769vh;
    width: fit-content;
    width: -moz-fit-content;
    padding: 2px 2px 2px;
    right: 3.125vw;
    border-radius: 10px;
  }
  .conbtm__title {
    font-size: 20px;
    padding: 10px 5px;
  }
  .conbtm__list {
    display: block;
  }
  .conbtm__item {
    width: 100%;
    border-radius: 10px;
    font-size: 22px;
    border: 1px solid #08014E;
    transition: all 0.5s;
  }
  .conbtm .linebtn a {
    width: 100%;
    height: 100%;
    padding: 22px 16px;
  }
  .conbtm .linebtn:hover {
    background-color: #fff;
    color: #00B900;
  }
  .conbtm .mailbtn a {
    padding: 14px 14px 10px;
  }
  .conbtm .mailbtn svg {
    font-size: 28px;
    display: inline;
    fill: #08014E;
  }
  .conbtm .mailbtn:hover {
    background-color: #fff;
  }
  .conbtm span {
    display: none;
  }
}

.nav {
  position: absolute;
  top: -120%;
  transition: all 0.5s;
}

.nav__item {
  width: fit-content;
  width: -moz-fit-content;
}

.nav.open {
  position: fixed;
  display: block;
  width: 100vw;
  z-index: 9997;
  top: 0;
  transition: all 0.5s;
}

.nav.open .nav__contents {
  position: absolute;
  background-color: #F8B62D;
  border: 2px solid #08014E;
  border-radius: 10px;
  padding: 30px;
  width: 95vw;
  top: 40%;
  left: 50%;
  transform: translate(-50%, 40%);
  box-shadow: 4px 4px 0 #08014E;
  display: flex;
  align-items: center;
  justify-content: space-between;
  justify-content: center;
}

.nav.open .nav__contents::before {
  content: "";
  display: block;
  height: 85%;
  width: 2px;
  border-radius: 50px;
  background-color: #08014E;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.nav.open .nav__list {
  width: fit-content;
  width: -moz-fit-content;
  padding-right: 60px;
}

.nav.open .nav__list:nth-last-child(1) {
  border: none;
  padding: 0;
}

.nav.open .nav__item {
  width: fit-content;
  width: -moz-fit-content;
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: 700;
  position: relative;
  transition: all 1s;
}

.nav.open .nav__item span {
  position: absolute;
  right: -30%;
  top: 50%;
  transform: translate(0, -50%);
  border-radius: 2px;
  color: rgba(8, 1, 78, 0.3);
}

.nav.open .nav__item span svg {
  display: inline;
  width: 12px;
  fill: #08014E;
}

.nav.open .nav__item a::after {
  content: "";
  display: block;
  background-color: #08014E;
  width: 0;
  height: 2px;
  border-radius: 5px;
  transition: all .5s;
  bottom: 0;
}

.nav.open .nav__item a:hover::after {
  width: 100%;
  border-radius: 5px;
}

@media screen and (min-width: 744px) {
  .nav.open .nav__contents {
    border: 4px solid #08014E;
    border-radius: 20px;
    padding: 40px;
    width: 92.06989%;
  }
  .nav.open .nav__contents::before {
    content: "";
    display: block;
    height: 85%;
    width: 2px;
    border-radius: 50px;
    background-color: #08014E;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .nav.open .nav__list {
    width: fit-content;
    width: -moz-fit-content;
    padding-right: 180px;
  }
  .nav.open .nav__list:nth-last-child(1) {
    border: none;
    padding: 0;
  }
  .nav.open .nav__item {
    margin-bottom: 20px;
    font-size: 24px;
  }
}

@media screen and (min-width: 901px) {
  .nav.open .nav__contents {
    border-radius: 20px;
    padding: 40px;
    width: 45%;
    top: 40%;
    left: 94%;
    transform: translate(-93%, 25%);
  }
  .nav.open .nav__contents::before {
    content: "";
    display: block;
    height: 85%;
    width: 2px;
    border-radius: 50px;
    background-color: #08014E;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .nav.open .nav__list {
    width: fit-content;
    width: -moz-fit-content;
    padding-right: 18%;
  }
  .nav.open .nav__list:nth-last-child(1) {
    border: none;
    padding: 0;
  }
  .nav.open .nav__item {
    margin-bottom: 40px;
    font-size: 18px;
    width: fit-content;
    width: -moz-fit-content;
  }
  .nav.open .nav__item:nth-last-child(1) {
    margin-bottom: 0;
  }
}

@media screen and (min-width: 1280px) {
  .nav.open .nav__contents {
    justify-content: space-around;
  }
  .nav.open .nav__list {
    padding-right: 0;
  }
  .nav.open .nav__item {
    font-size: 24px;
    width: 100%;
  }
}

.view {
  position: relative;
  width: 100vw;
  padding-bottom: 50px;
  overflow: hidden;
}

.view video {
  border-radius: 0 0 10px 10px;
  overflow: hidden;
  box-shadow: 4px 4px 0 #08014E;
}

.view__video {
  width: fit-content;
  width: -moz-fit-content;
  height: fit-content;
  position: relative;
}

.view__kvtext {
  position: absolute;
  padding: 20px 10px;
}

.view__kvtext.top {
  top: 8.5vh;
}

.view__kvtext.btm {
  bottom: 0;
}

.view__titledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.view__titledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.view__titledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .view__titledeco {
    font-size: 18px;
  }
}

.view__titledeco.active {
  animation: purun 0.8s linear 0s 1;
  opacity: 1;
}

.view__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
  padding-top: 140px;
  margin-bottom: 0;
}

@media screen and (min-width: 744px) {
  .view__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.view__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.view__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .view__textlist {
    font-size: 32px;
  }
}

.view__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
  top: 155px;
  overflow: visible;
}

@media screen and (min-width: 744px) {
  .view__titleslide {
    top: 20px;
  }
}

.view__con {
  position: relative;
  margin: auto;
  width: 93.75%;
  overflow: hidden;
  width: 100vw;
  top: -90px;
}

@media screen and (min-width: 744px) {
  .view__con {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .view__con {
    width: 87.5%;
    max-width: 600px;
  }
}

.view__con::after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  top: 50%;
  left: -20%;
  transform: translate(0, -50%);
  background-size: 45px;
  z-index: -4;
  height: 40.49296vh;
  background-image: url(../img/bg_cross.webp);
}

.view__text {
  margin: auto;
  width: 93.75%;
  position: relative;
  right: -60%;
  animation: viewtext 0.8s 3s forwards;
  opacity: 0;
  text-align: right;
  -webkit-text-stroke: 0.8px #08014E;
  color: #fff;
  font-weight: 900;
  font-style: normal;
  font-size: clamp(2.3rem, 4.4vw, 4rem);
  padding-top: 40px;
}

@media screen and (min-width: 744px) {
  .view__text {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .view__text {
    width: 87.5%;
    max-width: 600px;
  }
}

.view__text.active {
  right: 0;
  opacity: 1;
}

@keyframes viewtext {
  0% {
    right: -60%;
    opacity: 0;
  }
  80% {
    right: 15%;
    opacity: 1;
  }
  100% {
    right: 0;
    opacity: 1;
  }
}

.view__imgbox {
  position: relative;
  width: 100vw;
  height: 35.21127vh;
  top: -24%;
  z-index: -3;
}

.view__rightimg {
  width: auto;
  position: relative;
  object-fit: cover;
  margin-left: 100px;
  border-radius: 20px 0 0 20px;
  overflow: hidden;
  box-shadow: 4px 4px 0 #08014E;
  z-index: -3;
}

.view__rightimg img {
  height: 100%;
  object-fit: cover;
}

.view__textitem {
  margin: auto;
  width: 93.75%;
  position: relative;
  top: -40px;
}

@media screen and (min-width: 744px) {
  .view__textitem {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .view__textitem {
    width: 87.5%;
    max-width: 600px;
  }
}

.view__textitem::after {
  content: "";
  display: block;
  position: absolute;
  background-image: url(../img/bg_cross.webp);
  background-size: 36px;
  width: 80%;
  height: 100%;
  top: 270px;
  left: -20px;
  transform: translate(0, -60%);
  z-index: -1;
}

@media screen and (min-width: 744px) {
  .view {
    padding-bottom: 40px;
    width: 100%;
    object-fit: cover;
  }
  .view video {
    border-radius: 0 0 20px 20px;
    width: 100%;
    height: 68.10954vh;
    object-fit: cover;
  }
  .view__video {
    width: 100%;
  }
  .view__video::before {
    font-size: 60px;
    top: 140px;
    left: 50px;
  }
  .view__video::after {
    font-size: 140px;
    bottom: 20px;
    left: 50px;
  }
  .view__kvtext {
    padding: 40px 60px;
  }
  .view__kvtext.top {
    top: 12vh;
  }
  .view__kvtext.btm {
    bottom: 0;
  }
  .view__title {
    position: relative;
    top: 21.20141vh;
    padding: 40px;
  }
  .view__titleslide {
    top: 80px;
  }
  .view__con {
    width: auto;
    top: -40px;
  }
  .view__con::after {
    left: -45%;
    background-size: 55px;
    height: 51.23675vh;
  }
  .view__text {
    line-height: 1.4em;
  }
  .view__rightimg {
    height: 47.61484vh;
    object-fit: cover;
    object-position: 0% 100%;
    margin-left: 220px;
    z-index: -3;
    border-radius: 20px 0 0 20px;
    overflow: hidden;
  }
}

@media screen and (min-width: 901px) {
  .view {
    position: fixed;
    width: 50%;
    z-index: 1;
    height: 100vh;
  }
  .view__video {
    position: relative;
    height: 100%;
    padding: 16.05136vh 60px 60px;
  }
  .view__video::before {
    z-index: 10;
    top: 240px;
    left: 100px;
    font-size: 48px;
  }
  .view__video::after {
    font-family: "M PLUS 1p", sans-serif;
    font-weight: 700;
    position: absolute;
    display: block;
    height: fit-content;
    width: fit-content;
    width: -moz-fit-content;
    color: #fff;
    z-index: 10;
    bottom: 100px;
    left: 100px;
    font-size: 160px;
  }
  .view video {
    height: 100%;
    display: block !important;
    border-radius: 30px;
    object-fit: cover;
  }
  .view__kvtext {
    padding: 0;
  }
  .view__kvtext.top {
    top: 22vh;
    left: 50%;
    width: 36vw;
    transform: translate(-50%, 0%);
  }
  .view__kvtext.btm {
    bottom: 13vh;
    left: 50%;
    width: 36vw;
    transform: translate(-50%, 0%);
  }
  .view__con {
    margin: 0;
    width: 100%;
    max-width: none;
  }
  .view__con::after {
    transform: translate(0, 40%);
    top: 50%;
    left: -30%;
    transform: translate(0, -50%);
    background-size: 45px;
    height: 52.28365vh;
  }
  .view__text {
    line-height: 1.2em;
    margin-left: auto;
    margin-right: 4.6875vw;
  }
  .view__rightimg {
    height: 45vh;
    z-index: -3;
    border-radius: 20px 0 0 20px;
    overflow: hidden;
  }
  .view__rightimg img {
    object-fit: cover;
  }
}

.visual {
  margin-bottom: 60px;
  overflow: hidden;
}

.visual__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
  padding-top: 100px;
  margin-bottom: 0;
}

@media screen and (min-width: 744px) {
  .visual__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.visual__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.visual__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .visual__textlist {
    font-size: 32px;
  }
}

.visual__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
  top: 125px;
}

@media screen and (min-width: 744px) {
  .visual__titleslide {
    top: 20px;
  }
}

.visual__textitem {
  margin: auto;
  width: 93.75%;
  position: relative;
}

@media screen and (min-width: 744px) {
  .visual__textitem {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .visual__textitem {
    width: 87.5%;
    max-width: 600px;
  }
}

.visual__textitem::after {
  content: "";
  display: block;
  position: absolute;
  background-image: url(../img/bg_cross.webp);
  background-size: 36px;
  width: 80%;
  height: 65%;
  top: 50%;
  left: -20px;
  transform: translate(0, -50%);
  z-index: -3;
}

.visual__catch {
  position: relative;
  margin: 0 auto;
  top: 0;
  right: -40px;
  transition: all 0.5s;
  opacity: 0;
}

.visual__catch.active {
  opacity: 1;
  right: 0;
  top: 40px;
}

.visual__centerimg {
  position: relative;
  border-radius: 70px;
  overflow: hidden;
  box-shadow: 4px 4px #08014E;
  height: 35.21127vh;
  width: 100%;
  margin: 0 auto;
  bottom: 20px;
  z-index: -1;
}

.visual__centerimg img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

@media screen and (min-width: 744px) {
  .visual {
    padding-bottom: 40px;
    height: 68.10954%;
    width: 100%;
    object-fit: cover;
  }
  .visual__title {
    text-align: center;
    -webkit-text-stroke: 1px #08014E;
    font-size: 32px;
    font-family: "M PLUS 1p", sans-serif;
    font-weight: 900;
    color: #fff;
    position: relative;
    margin-bottom: 40px;
    padding-top: 100px;
    margin-bottom: 0;
  }
}

@media screen and (min-width: 744px) and (min-width: 744px) {
  .visual__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

@media screen and (min-width: 744px) {
  .visual__titleslide {
    top: 120px;
  }
  .visual__textitem {
    margin: auto;
    width: 93.75%;
    position: relative;
    width: 100%;
    top: -40px;
  }
}

@media screen and (min-width: 744px) and (min-width: 744px) {
  .visual__textitem {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 744px) and (min-width: 901px) {
  .visual__textitem {
    width: 87.5%;
    max-width: 600px;
  }
}

@media screen and (min-width: 744px) {
  .visual__textitem::after {
    height: 65%;
    top: 50%;
    left: -20%;
    transform: translate(0, -50%);
  }
  .visual__catch {
    position: relative;
    margin: 0 auto;
    top: 20px;
  }
  .visual__centerimg {
    position: relative;
    border-radius: 70px;
    width: 100%;
    margin: 0 auto;
    bottom: 40px;
    z-index: -1;
  }
  .visual__centerimg img {
    height: 100%;
    width: 100%;
    object-fit: cover;
  }
}

@media screen and (min-width: 901px) {
  .visual {
    position: fixed;
    width: 50%;
    padding: 12.84109vh 0 0;
    z-index: 1;
    height: 100vh;
  }
  .visual__title {
    text-align: center;
    -webkit-text-stroke: 1px #08014E;
    font-size: 32px;
    font-family: "M PLUS 1p", sans-serif;
    font-weight: 900;
    color: #fff;
    position: relative;
    margin-bottom: 40px;
    padding-top: 0;
    margin-bottom: 0;
  }
}

@media screen and (min-width: 901px) and (min-width: 744px) {
  .visual__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

@media screen and (min-width: 901px) {
  .visual__titleslide {
    top: 20px;
  }
  .visual__textitem {
    margin: auto;
    width: 93.75%;
    position: relative;
    width: 100%;
    height: 0.7488 100vh;
    max-width: 500px !important;
  }
}

@media screen and (min-width: 901px) and (min-width: 744px) {
  .visual__textitem {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) and (min-width: 901px) {
  .visual__textitem {
    width: 87.5%;
    max-width: 600px;
  }
}

@media screen and (min-width: 901px) {
  .visual__textitem::after {
    height: 100%;
    width: 100%;
    left: -50%;
    background-size: 50px;
  }
}

.right {
  overflow: hidden;
  width: 100vw;
}

@media screen and (min-width: 901px) {
  .right {
    width: 50%;
    padding-top: 12.84109vh;
    margin-left: auto;
    border-left: 4px solid #08014E;
  }
}

.main {
  width: 100vw;
  height: 100%;
  overflow: hidden;
}

@media screen and (min-width: 901px) {
  .main {
    width: 50vw;
  }
}

.main .free {
  position: relative;
  margin-bottom: 60px;
  position: relative;
  transform: translateX(-80%);
  width: fit-content;
  width: -moz-fit-content;
  height: 100%;
  opacity: 0;
}

.main .free__box {
  width: fit-content;
  width: -moz-fit-content;
  padding: 30px 35px;
  margin-right: 20px;
  background-color: #FFF7E7;
  border-radius: 0 10px 10px 0;
  border-top: 2px solid #08014E;
  border-bottom: 2px solid #08014E;
  border-right: 2px solid #08014E;
  box-shadow: 4px 4px 0 #08014E;
}

.main .free__subtitle {
  margin-bottom: 30px;
  text-align: center;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 700;
  color: #08014E;
  font-size: 20px;
}

.main .free__contents {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.main .free__img {
  margin-bottom: 20px;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.main .free__img img {
  height: 100%;
  border-radius: 10px;
  object-fit: cover;
}

.main .free__text {
  width: 100%;
}

.main .free__btn {
  width: fit-content;
  width: -moz-fit-content;
  margin: 0 auto;
  padding: 10px;
  font-size: 18px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 700;
  background-color: #F8B62D;
  border: 2px solid #08014E;
  border-radius: 5px;
  box-shadow: 4px 4px 0 #08014E;
  position: relative;
  transition: all 0.3s;
  top: 0;
  left: 0;
}

.main .free__btn:hover {
  top: 2px;
  left: 2px;
  box-shadow: 2px 2px 0 #08014E;
}

@media screen and (min-width: 744px) {
  .main .free {
    margin-bottom: 100px;
  }
  .main .free__box {
    padding: 40px 20px 40px 120px;
    margin-right: 100px;
  }
  .main .free__subtitle {
    font-size: 32px;
    letter-spacing: 0.3em;
  }
  .main .free__text {
    font-size: 18px;
    letter-spacing: 0.16em;
    font-weight: 400;
    width: 43.56618%;
  }
  .main .free__contents {
    display: flex;
    align-items: center;
    justify-content: space-between;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
  }
  .main .free__img {
    width: 43.56618%;
    margin: 0;
  }
  .main .free__btn {
    font-size: 20px;
    font-weight: 800;
    letter-spacing: 0.1em;
  }
}

.main .free.active {
  animation: leftslide 1s forwards;
  transform: translateX(0);
  opacity: 1;
}

@keyframes leftslide {
  0% {
    transform: translateX(-80%);
    opacity: 0;
  }
  10% {
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

.main .choose {
  margin-bottom: 60px;
}

.main .choose__titledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.main .choose__titledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.main .choose__titledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .main .choose__titledeco {
    font-size: 18px;
  }
}

.main .choose__titledeco.active {
  animation: purun 0.8s linear 0s 1;
  opacity: 1;
}

.main .choose__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
}

@media screen and (min-width: 744px) {
  .main .choose__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.main .choose__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.main .choose__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .main .choose__textlist {
    font-size: 32px;
  }
}

.main .choose__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
}

@media screen and (min-width: 744px) {
  .main .choose__titleslide {
    top: 20px;
  }
}

.main .choose__subtitle {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  font-size: 40px;
  width: fit-content;
  width: -moz-fit-content;
  margin: 0 auto 40px;
}

.main .choose__subtitledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
  margin: 0 auto 10px;
}

.main .choose__subtitledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.main .choose__subtitledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .main .choose__subtitledeco {
    font-size: 18px;
  }
}

.main .choose__subtitledeco.active {
  animation: purun 0.8s linear 0s 1;
  opacity: 1;
}

.main .choose .choice {
  position: relative;
  width: 100vw;
  height: 29.92958vh;
  margin-bottom: 60px;
}

.main .choose .choice__item {
  width: 40.625%;
}

.main .choose .choice__item img {
  display: block;
}

.main .choose .choice__item:nth-child(1) {
  position: absolute;
  top: 40px;
  left: 15%;
  transform: translateX(-45%);
}

.main .choose .choice__item:nth-child(2) {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.main .choose .choice__item:nth-child(3) {
  position: absolute;
  top: 40px;
  right: 15%;
  transform: translateX(45%);
}

.main .choose .reason {
  margin-top: 40px;
}

.main .choose .reason__inner {
  margin: auto;
  width: 93.75%;
}

@media screen and (min-width: 744px) {
  .main .choose .reason__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .choose .reason__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .choose .reason__mainview {
  width: 93.33333%;
  margin: 0 auto 40px;
  transform: translate(20%, -20%);
  opacity: 0;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background-color: rgba(248, 182, 45, 0.2);
  padding: 10px;
  border-radius: 10px;
}

.main .choose .reason__mainview.active {
  transform: translate(0, 0);
  opacity: 1;
  animation: righttopslide 0.5s linear 0s 1;
}

@keyframes righttopslide {
  0% {
    transform: translate(20%, -20%);
    opacity: 0;
  }
  50% {
    opacity: 0;
  }
  100% {
    transform: translate(0);
    opacity: 1;
  }
}

.main .choose .reason .swiper {
  position: relative;
  width: 100%;
  height: fit-content;
  width: -moz-fit-content;
  overflow: hidden;
  padding-bottom: 60px;
  margin-bottom: 80px;
}

.main .choose .reason .swiper-wrapper {
  align-items: stretch;
}

.main .choose .reason .swiper-slide {
  font-size: 18px;
  width: fit-content;
  width: -moz-fit-content;
}

.main .choose .reason .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.main .choose .reason .swiper-button-prev, .main .choose .reason .swiper-button-next {
  top: auto;
  bottom: 0;
  color: #08014E;
}

.main .choose .reason .swiper-button-prev {
  left: 25%;
}

.main .choose .reason .swiper-button-next {
  right: 25%;
}

li .main .choose .reason__item .swiper-slide {
  height: auto;
}

li .main .choose .reason__item .swiper-slide .swiper-slide-active {
  width: 90% !important;
}

.main .choose .reason__list {
  margin: auto;
  width: 93.75%;
  align-items: stretch;
}

@media screen and (min-width: 744px) {
  .main .choose .reason__list {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .choose .reason__list {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .choose .reason__pic {
  border-radius: 5px;
  margin-bottom: 10px;
  height: 28.16901vh;
  overflow: hidden;
  border: 2px solid #08014E;
  box-shadow: 4px 4px 0 #08014E;
}

.main .choose .reason .swiper-horizontal > .swiper-pagination-bullets,
.main .choose .reason .swiper-pagination-bullets.swiper-pagination-horizontal {
  top: initial;
  bottom: 0;
}

.main .choose .reason__item {
  height: 100%;
}

.main .choose .reason__itemtext {
  height: 100%;
}

.main .choose .reason__subtitle {
  margin-bottom: 10px;
  padding: 10px;
  width: fit-content;
  width: -moz-fit-content;
  font-size: 24px;
  letter-spacing: 0.02em;
  font-weight: 700;
  background-color: #fff;
  border: 2px solid #08014E;
  border-radius: 5px;
  box-shadow: 4px 4px 0 #08014E;
}

.main .choose .reason__text {
  font-size: 14px;
  display: flex;
  align-items: center;
  background-color: #fff;
  border: 2px solid #08014E;
  border-radius: 5px;
  padding: 10px;
  box-shadow: 4px 4px 0 #08014E;
}

@media screen and (min-width: 744px) {
  .main .choose .choice {
    margin-bottom: 100px;
    position: relative;
    width: 100vw;
    height: 26.50177vh;
  }
  .main .choose .choice__inner {
    margin: auto;
    width: 93.75%;
  }
}

@media screen and (min-width: 744px) and (min-width: 744px) {
  .main .choose .choice__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 744px) and (min-width: 901px) {
  .main .choose .choice__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

@media screen and (min-width: 744px) {
  .main .choose .choice__item {
    width: 27.95699%;
  }
  .main .choose .choice__item:nth-child(1) {
    position: absolute;
    top: 40px;
    left: 25%;
    transform: translateX(-45%);
  }
  .main .choose .choice__item:nth-child(3) {
    position: absolute;
    top: 40px;
    right: 25%;
    transform: translateX(45%);
  }
  .main .choose .reason {
    margin-top: 40px;
  }
  .main .choose .reason__inner {
    margin: auto;
    width: 93.75%;
  }
}

@media screen and (min-width: 744px) and (min-width: 744px) {
  .main .choose .reason__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 744px) and (min-width: 901px) {
  .main .choose .reason__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

@media screen and (min-width: 744px) {
  .main .choose .reason__mainview {
    width: 67.2043%;
    margin: 0 auto 60px;
  }
  .main .choose .reason__pic {
    margin-bottom: 20px;
  }
  .main .choose .reason__subtitle {
    padding: 20px;
    font-size: 32px;
    margin-bottom: 20px;
  }
  .main .choose .reason__text {
    padding: 20px;
    font-size: 18px;
    margin-bottom: 20px;
    line-height: 1.6;
    height: 100%;
  }
}

@media screen and (min-width: 901px) {
  .main .choose .choice {
    width: 100%;
    height: 32.93269vh;
  }
  .main .choose .choice__item {
    width: 25%;
  }
  .main .choose .choice__item:nth-child(1) {
    top: 80px;
    left: 28%;
    transform: translateX(-45%);
  }
  .main .choose .choice__item:nth-child(3) {
    top: 80px;
    right: 28%;
    transform: translateX(45%);
  }
  .main .choose .reason__mainview {
    width: 89.28571%;
    margin: 0 auto 80px;
  }
}

.main .course {
  margin-bottom: 60px;
}

.main .course__titledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.main .course__titledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.main .course__titledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .main .course__titledeco {
    font-size: 18px;
  }
}

.main .course__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
}

@media screen and (min-width: 744px) {
  .main .course__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.main .course__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.main .course__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .main .course__textlist {
    font-size: 32px;
  }
}

.main .course__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
}

@media screen and (min-width: 744px) {
  .main .course__titleslide {
    top: 20px;
  }
}

.main .course__subtitle {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  font-size: 40px;
  width: fit-content;
  width: -moz-fit-content;
  margin: 0 auto 40px;
  color: #fff;
  -webkit-text-stroke: 1px #08014E;
  opacity: 1;
}

.main .course__subyen {
  font-size: 16px;
}

.main .course__inner {
  margin: auto;
  width: 93.75%;
}

@media screen and (min-width: 744px) {
  .main .course__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .course__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .course__subtitledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
  margin: 0 auto 10px;
}

.main .course__subtitledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.main .course__subtitledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .main .course__subtitledeco {
    font-size: 18px;
  }
}

.main .course__subtitledeco.active {
  animation: purun 0.8s linear 0s 1;
  opacity: 1;
}

.main .course__subtitle {
  margin-bottom: 40px;
}

.main .course__box {
  margin-bottom: 10px;
  padding: 40px 0;
  background-image: url(../img/bg_cross.webp);
  background-size: 40px;
  position: relative;
  transition: all 0.5s;
}

.main .course__box::before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  background-color: #F8B62D;
  top: 0;
  left: 0;
  transform: translate(0, 0);
  transition: all 0.8s;
}

.main .course__box.active {
  overflow: hidden;
}

.main .course__box.active::before {
  transform: translate(0, 100%);
}

.main .course__item {
  margin-bottom: 30px;
  width: 100%;
  background-color: #F8B62D;
  border: 2px solid #08014E;
  border-radius: 5px;
  box-shadow: 4px 4px 0 #08014E;
  position: relative;
  transition: all 0.3s;
  top: 0;
  left: 0;
  opacity: 0;
  transform: translate(-70%, 0);
}

.main .course__item:hover {
  top: 2px;
  left: 2px;
  box-shadow: 2px 2px 0 #08014E;
}

.main .course__item.active {
  animation: rightslide 0.8s linear 0s 1;
  opacity: 1;
  transform: translate(0, 0);
}

.main .course__item:nth-child(2) {
  background-color: #2D8AF8;
}

.main .course__item:nth-child(2).active {
  animation: rightslide 1s linear 0s 1;
  opacity: 1;
  transform: translate(0, 0);
}

.main .course__item:nth-child(3) {
  background-color: #2DF8D3;
}

.main .course__item:nth-child(3).active {
  animation: rightslide 1.2s linear 0s 1;
  opacity: 1;
  transform: translate(0, 0);
}

.main .course__item:nth-child(4) {
  background-color: #9FF82D;
  margin-bottom: 0;
}

.main .course__item:nth-child(4).active {
  animation: rightslide 1.4s linear 0s 1;
  opacity: 1;
  transform: translate(0, 0);
}

.main .course__btn {
  font-size: 20px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 700;
  text-shadow: 2px 2px 0 #08014E;
  width: 100%;
  padding: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.main .course__view {
  position: relative;
  height: 80px;
  width: 80%;
}

.main .course__img {
  position: relative;
}

.main .course__img img {
  height: 80px;
  object-fit: cover;
  object-position: 0;
  border-radius: 5px;
}

.main .course__text {
  position: absolute;
  color: #fff;
  left: 5px;
  bottom: 5px;
}

.main .course__arrow {
  width: 11.66667%;
  height: 50px;
  position: relative;
}

.main .course__arrow::before {
  content: "";
  display: block;
  position: absolute;
  height: 15px;
  width: 2px;
  background-color: #08014E;
  border-radius: 50px;
  transform: translate(-50%, -50%) rotate(-45deg);
  transform-origin: left;
  left: 50%;
  top: 45%;
}

.main .course__arrow::after {
  content: "";
  display: block;
  position: absolute;
  height: 15px;
  width: 2px;
  background-color: #08014E;
  border-radius: 50px;
  transform: translate(-50%, -50%) rotate(45deg);
  transform-origin: left;
  left: 50%;
  top: 60%;
}

.main .course__atten {
  text-align: center;
  font-size: 12px;
  position: relative;
  z-index: 1;
}

@media screen and (min-width: 744px) {
  .main .course {
    margin-bottom: 100px;
  }
  .main .course__subtitle {
    font-size: 36px;
  }
  .main .course__item {
    margin: 0 auto 30px;
    width: 55.14706%;
  }
  .main .course__text {
    font-size: 20px;
  }
}

.main .voice {
  position: relative;
  width: 100vw;
  overflow: hidden;
  padding-bottom: 100px;
  z-index: 1;
}

.main .voice__inner {
  margin: auto;
  width: 93.75%;
}

@media screen and (min-width: 744px) {
  .main .voice__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .voice__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .voice__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
}

@media screen and (min-width: 744px) {
  .main .voice__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.main .voice__titledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.main .voice__titledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.main .voice__titledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .main .voice__titledeco {
    font-size: 18px;
  }
}

.main .voice__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.main .voice__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .main .voice__textlist {
    font-size: 32px;
  }
}

.main .voice__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
}

@media screen and (min-width: 744px) {
  .main .voice__titleslide {
    top: 20px;
  }
}

.main .voice .card {
  margin: 0 auto;
  padding: 30px;
  border: 2px solid #08014E;
}

.main .voice .card__title {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 20px;
  font-family: "M PLUS 1p", sans-serif;
  letter-spacing: 0.02em;
}

.main .voice .card__text {
  font-size: 16px;
  font-family: "Zen Kaku Gothic Antique", sans-serif;
  line-height: 1.3;
}

.main .voice .swiper-container {
  position: relative;
}

.main .voice .swiper-wrapper {
  align-items: stretch;
}

.main .voice .swiper-slide {
  width: 100%;
  display: flex;
  justify-content: center;
  background-color: #fff;
  width: fit-content;
  width: -moz-fit-content;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  transition: transform 0.5s ease;
  border-radius: 10px;
  box-shadow: 4px 4px 0 #08014E;
}

.main .voice .swiper-slide-active {
  scale: 1;
  opacity: 1;
}

.main .voice .swiper-pagination-bullets {
  position: absolute;
  bottom: auto !important;
  bottom: -40px !important;
  left: 0;
  width: 100%;
}

.main .voice .swiper-slide.swiper-slide-prev,
.main .voice .swiper-slide.swiper-slide-next {
  transform: scale(0.7);
  opacity: 0.4;
}

.main .voice .swiper-button-next,
.main .voice .swiper-button-prev {
  bottom: -50px;
  top: auto;
  color: #08014E;
}

.main .voice .swiper-button-next::after,
.main .voice .swiper-button-prev::after {
  font-size: 20px;
}

.main .voice .swiper-button-next {
  left: auto;
  right: 30%;
}

.main .voice .swiper-button-prev {
  right: auto;
  left: 30%;
}

@media screen and (min-width: 744px) {
  .main .voice {
    margin-bottom: 100px;
  }
}

@media screen and (min-width: 901px) {
  .main .voice {
    width: 100%;
  }
}

.main .event {
  margin-bottom: 60px;
}

.main .event__titledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.main .event__titledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.main .event__titledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .main .event__titledeco {
    font-size: 18px;
  }
}

.main .event__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
}

@media screen and (min-width: 744px) {
  .main .event__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.main .event__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.main .event__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .main .event__textlist {
    font-size: 32px;
  }
}

.main .event__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
}

@media screen and (min-width: 744px) {
  .main .event__titleslide {
    top: 20px;
  }
}

.main .event .swiper {
  width: 100%;
  height: 100%;
  padding-bottom: 20px;
}

.main .event .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}

.main .event .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.main .event__item {
  border-radius: 10px;
  box-shadow: 4px 4px 0 #08014E;
}

.main .event__item img {
  border-radius: 10px;
}

@media screen and (min-width: 744px) {
  .main .event {
    margin-bottom: 100px;
  }
}

.main .artist {
  margin-bottom: 60px;
}

.main .artist__titledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.main .artist__titledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.main .artist__titledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .main .artist__titledeco {
    font-size: 18px;
  }
}

.main .artist__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
}

@media screen and (min-width: 744px) {
  .main .artist__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.main .artist__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.main .artist__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .main .artist__textlist {
    font-size: 32px;
  }
}

.main .artist__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
}

@media screen and (min-width: 744px) {
  .main .artist__titleslide {
    top: 20px;
  }
}

.main .artist__inner {
  margin: auto;
  width: 93.75%;
}

@media screen and (min-width: 744px) {
  .main .artist__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .artist__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .artist__list {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.main .artist__item {
  width: 32%;
  margin-bottom: 10px;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 0 0 #08014E;
  position: relative;
  top: 8px;
  left: 8px;
  transition: all 0.5s 0.2;
}

.main .artist__item:nth-child(2) {
  transition: all 0.5s 0.3s;
}

.main .artist__item:nth-child(3) {
  transition: all 0.5s 0.4s;
}

.main .artist__item:nth-child(4) {
  transition: all 0.5s 0.5s;
}

.main .artist__item:nth-child(5) {
  transition: all 0.5s 0.6s;
}

.main .artist__item:nth-child(6) {
  transition: all 0.5s 0.7s;
}

.main .artist__item.active {
  top: 0;
  left: 0;
  box-shadow: 4px 4px 0 #08014E;
}

@media screen and (min-width: 744px) {
  .main .artist {
    margin-bottom: 100px;
  }
}

.main .club {
  margin-bottom: 60px;
}

.main .club__titledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.main .club__titledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.main .club__titledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .main .club__titledeco {
    font-size: 18px;
  }
}

.main .club__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
}

@media screen and (min-width: 744px) {
  .main .club__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.main .club__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.main .club__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .main .club__textlist {
    font-size: 32px;
  }
}

.main .club__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
}

@media screen and (min-width: 744px) {
  .main .club__titleslide {
    top: 20px;
  }
}

.main .club__name {
  font-size: 10px;
}

.main .club__name span {
  display: inline-block;
  text-align: center;
}

.main .club__place {
  margin-left: 30px;
  padding-top: 10%;
}

.main .club__item img {
  box-shadow: 4px 4px 0 #08014E;
}

.main .club .swiper {
  width: 100%;
  height: 100%;
}

.main .club .swiper-wrapper {
  align-items: flex-start;
}

.main .club .swiper-slide {
  text-align: center;
  font-size: 16px;
  justify-content: center;
  align-items: center;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 700;
  width: fit-content;
  width: -moz-fit-content;
  margin-right: 20px;
}

.main .club .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  margin-bottom: 5px;
  border-radius: 5px;
}

@media screen and (min-width: 744px) {
  .main .club {
    margin-bottom: 100px;
  }
}

@media screen and (min-width: 901px) {
  .main .club__place {
    margin-left: 60px;
    padding-top: 8%;
  }
  .main .club .swiper-slide {
    font-size: 32px;
  }
}

.main .access {
  margin-bottom: 60px;
}

.main .access__inner {
  margin: auto;
  width: 93.75%;
}

@media screen and (min-width: 744px) {
  .main .access__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .access__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .access__titledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.main .access__titledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.main .access__titledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .main .access__titledeco {
    font-size: 18px;
  }
}

.main .access__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
}

@media screen and (min-width: 744px) {
  .main .access__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.main .access__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.main .access__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .main .access__textlist {
    font-size: 32px;
  }
}

.main .access__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
}

@media screen and (min-width: 744px) {
  .main .access__titleslide {
    top: 20px;
  }
}

.main .access .box {
  position: relative;
  padding: 30px 16px;
  background-color: #fff;
  border: 2px solid #08014E;
  border-radius: 10px;
  box-shadow: 0 0 0 #08014E;
  top: 8px;
  left: 8px;
  transition: all 0.5s;
}

.main .access .box__text {
  margin-bottom: 5px;
}

.main .access .box__map {
  overflow: hidden;
  width: 100%;
  border-radius: 10px;
  border: 2px solid #08014E;
  margin: 20px 0;
}

.main .access .box iframe {
  width: 100%;
  height: 250px;
}

.main .access .box__deta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  justify-content: flex-start;
}

.main .access .box__title {
  justify-content: center;
  margin-right: 10px;
  display: block;
  text-align: justify;
  text-align-last: justify;
  width: 30%;
  padding: 8px 8px 8px 8px;
  font-size: 12px;
  font-weight: 700;
}

.main .access .box__con {
  text-align: left;
  letter-spacing: 0.2em;
  font-size: 12px;
}

.main .access .box.active {
  box-shadow: 4px 4px 0 #08014E;
  top: 0px;
  left: 0px;
}

@media screen and (min-width: 744px) {
  .main .access {
    margin-bottom: 100px;
  }
}

.main .insta {
  position: relative;
  margin-bottom: 60px;
  margin-left: 15px;
  background-color: #D300C5;
  padding: 40px 20px;
  color: #fff;
  border-radius: 10px 0 0 10px;
  border-top: 2px solid #08014E;
  border-left: 2px solid #08014E;
  border-bottom: 2px solid #08014E;
  box-shadow: 4px 4px 0 #08014E;
  right: -70%;
  opacity: 0;
  transition: all 0.5s;
}

.main .insta__subtitle {
  margin-bottom: 30px;
  text-align: center;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 700;
  font-size: 30px;
  letter-spacing: 0.3em;
}

.main .insta__text {
  margin-bottom: 30px;
}

.main .insta__list {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.main .insta__item {
  position: relative;
  width: 45%;
  margin-bottom: 30px;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 0 0 #08014E;
  border: 2px solid #08014E;
  top: 4px;
  left: 4px;
  transition: all 0.5s 1.2s;
}

.main .insta__item:nth-child(2) {
  transition: all 0.5s 1.3s;
  margin-bottom: 30px;
  border-radius: 10px;
}

.main .insta__item:nth-child(3) {
  transition: all 0.5s 1.4s;
  margin-bottom: 30px;
  border-radius: 10px;
}

.main .insta__item:nth-child(4) {
  transition: all 0.5s 1.5s;
  margin-bottom: 30px;
  border-radius: 10px;
}

.main .insta__item.active {
  top: 0;
  left: 0;
  box-shadow: 4px 4px 0 #08014E;
  margin-bottom: 30px;
  border-radius: 10px;
}

.main .insta__text {
  letter-spacing: 0.1em;
  font-weight: 400;
}

.main .insta__btn {
  width: fit-content;
  width: -moz-fit-content;
  position: relative;
  margin: 0 auto;
  transition: all 0.3s;
  top: 0;
  left: 0;
}

.main .insta__btn::after {
  transition: all 0.3s;
}

.main .insta__btn:hover {
  top: 6px;
  left: 6px;
}

.main .insta__btn:hover::after {
  bottom: 0px;
  right: 0px;
}

.main .insta__btn a {
  position: relative;
  background-color: #08014E;
  padding: 10px 20px;
  display: block;
  width: fit-content;
  width: -moz-fit-content;
  height: fit-content;
  border-radius: 5px;
  z-index: 3;
  font-size: 16px;
  font-weight: 700;
  font-family: "M PLUS 1p", sans-serif;
}

.main .insta__btn::after {
  content: "";
  position: absolute;
  background-color: #fff;
  display: block;
  width: 100%;
  height: 100%;
  bottom: -6px;
  right: -6px;
  border-radius: 5px;
  border: 2px solid #08014E;
}

@media screen and (min-width: 744px) {
  .main .insta {
    margin-left: 100px;
    margin-bottom: 100px;
    padding: 40px 130px 40px 30px;
  }
  .main .insta__content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .main .insta__text {
    width: 48%;
    font-size: 18px;
    line-height: 1.7;
    margin: 0;
  }
  .main .insta__list {
    margin-bottom: 40px;
    width: 48%;
  }
  .main .insta__item {
    margin-bottom: 10px;
    width: 48%;
  }
}

.main .insta.active {
  right: 0;
  opacity: 1;
}

.main .contact {
  margin-bottom: 40px;
}

.main .contact__title {
  text-align: center;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 700;
  font-size: 30px;
  letter-spacing: 0.3em;
  position: relative;
  width: fit-content;
  width: -moz-fit-content;
  margin: 0 auto 30px;
  -webkit-text-stroke: 0.5px #08014E;
}

.main .contact__title::after {
  content: "CONTACT";
  position: absolute;
  color: #fff;
  width: fit-content;
  width: -moz-fit-content;
  height: auto;
  top: 2px;
  left: 3px;
  z-index: -1;
}

.main .contact__text {
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  text-align: center;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background-color: rgba(248, 182, 45, 0.2);
  padding: 5px 8px;
  border-radius: 5px;
}

@media screen and (min-width: 744px) {
  .main .contact {
    margin-bottom: 60px;
  }
  .main .contact__text {
    margin-bottom: 10px;
    font-size: 24px;
  }
}

.main .line {
  margin-bottom: 60px;
  color: #fff;
}

.main .line__subtitle {
  margin-bottom: 30px;
  text-align: center;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 700;
  font-size: 30px;
  letter-spacing: 0.3em;
}

.main .line__text {
  margin-bottom: 30px;
}

.main .line__list {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.main .line__item {
  width: 45%;
  margin-bottom: 30px;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 4px 4px 0 #08014E;
  border: 2px solid #08014E;
}

.main .line__contentbox {
  position: relative;
  z-index: 20;
  background-color: #00B900;
  padding: 40px 20px;
  border-radius: 10px;
  border: 2px solid #08014E;
}

.main .line__box {
  margin-bottom: 40px;
}

.main .line__qr {
  margin: 0 auto 40px;
  width: 48.75%;
  border-radius: 10px;
  overflow: hidden;
}

.main .line__text {
  letter-spacing: 0.1em;
  font-weight: 400;
}

.main .line__btn {
  margin: 0 auto;
  position: relative;
  margin: 0 auto;
  color: #00B900;
  background-color: #fff;
  border-radius: 5px;
  display: block;
  position: relative;
  padding: 10px 20px;
  display: block;
  width: fit-content;
  width: -moz-fit-content;
  height: fit-content;
  z-index: 3;
  font-size: 18px;
  font-weight: 700;
  font-family: "M PLUS 1p", sans-serif;
  transition: all 0.3s;
  top: 0;
  left: 0;
}

.main .line__btn::after {
  transition: all 0.3s;
}

.main .line__btn:hover {
  top: 6px;
  left: 6px;
}

.main .line__btn:hover::after {
  bottom: 0px;
  right: 0px;
}

.main .line__btn::after {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  bottom: -4px;
  right: -4px;
  border-radius: 5px;
  border: 1px solid #fff;
  z-index: -1;
}

.main .line__btntext {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
  color: #fff;
}

.main .line__btntext::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.main .line__btntext::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .main .line__btntext {
    font-size: 18px;
  }
}

.main .line__btntext::before {
  background: url(../img/deco__line03.webp);
  background-size: cover;
  background-repeat: no-repeat;
}

.main .line__btntext::after {
  background: url(../img/deco__line03.webp);
  background-size: cover;
  background-repeat: no-repeat;
}

.main .line .sns {
  background-color: #08014E;
  padding: 60px 20px 40px;
  position: relative;
  top: -20px;
  z-index: 0;
  border-radius: 10px;
}

.main .line .sns__title {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 32px;
  width: fit-content;
  width: -moz-fit-content;
  text-align: center;
  margin: 0 auto 40px;
  font-weight: 700;
}

.main .line .sns__list {
  display: flex;
  align-items: center;
  justify-content: space-between;
  justify-content: center;
}

.main .line .sns__item {
  position: relative;
  margin: 0 40px;
  width: 12.5%;
}

@media screen and (min-width: 744px) {
  .main .line__inner {
    margin: auto;
    width: 93.75%;
  }
}

@media screen and (min-width: 744px) and (min-width: 744px) {
  .main .line__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 744px) and (min-width: 901px) {
  .main .line__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

@media screen and (min-width: 744px) {
  .main .line__subtitle {
    margin-bottom: 40px;
  }
  .main .line__box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 60px;
    align-items: center;
  }
  .main .line__text {
    width: 45%;
    font-size: 18px;
    line-height: 1.7;
    margin: 0;
  }
  .main .line__qr {
    margin: 0;
    width: 45%;
  }
  .main .line__btndeco {
    width: fit-content;
    width: -moz-fit-content;
    margin: 0 auto;
  }
  .main .line .sns {
    background-color: #08014E;
    padding: 60px 20px 40px;
    position: relative;
    top: -20px;
    z-index: -1;
    border-radius: 10px;
  }
  .main .line .sns__title {
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-size: 32px;
    width: fit-content;
    width: -moz-fit-content;
    text-align: center;
    margin: 0 auto 40px;
    font-weight: 700;
  }
  .main .line .sns__item {
    width: 5.37634%;
  }
}

.main .contents {
  overflow: hidden;
  width: 100vw;
}

.main .contents__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
}

@media screen and (min-width: 744px) {
  .main .contents__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.main .contents__titledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.main .contents__titledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.main .contents__titledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .main .contents__titledeco {
    font-size: 18px;
  }
}

.main .contents__titledeco.active {
  animation: purun 0.8s linear 0s 1;
  opacity: 1;
}

.main .contents__list {
  margin: auto;
  width: 93.75%;
}

@media screen and (min-width: 744px) {
  .main .contents__list {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .contents__list {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .contents__item {
  margin-bottom: 40px;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background-color: rgba(248, 182, 45, 0.2);
}

.main .contents__item.active {
  opacity: 1;
  transform: translate(0, 0);
}

.main .contents__num {
  margin-bottom: 10px;
  font-weight: 900;
  font-size: 24px;
  text-align: center;
}

.main .contents__itemtitle {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  font-size: 24px;
  padding: 20px 0;
  margin-bottom: 30px;
  border-top: 2px solid #08014E;
  border-bottom: 2px solid #08014E;
  text-align: center;
  position: relative;
}

.main .contents__itemtitle::before {
  content: "";
  position: absolute;
  display: block;
  background-color: #F8B62D;
  height: 110%;
  width: 50%;
  top: 50%;
  left: 0;
  transform: translate(0, -50%);
  border: 3px solid #F8B62D;
  transition: all 1.5s;
}

.main .contents__itemtitle::after {
  content: "";
  position: absolute;
  display: block;
  background-color: #F8B62D;
  height: 110%;
  width: 50%;
  top: 50%;
  right: 0;
  transform: translate(0, -50%);
  border: 3px solid #F8B62D;
  transition: all 1.5s;
}

.main .contents__itemtitle.active::before {
  left: -100%;
}

.main .contents__itemtitle.active::after {
  right: -100%;
}

.main .contents__img {
  margin-bottom: 20px;
  display: none;
}

.main .contents__sentence {
  padding: 0 10px 10px;
}

.main .contents__text {
  margin-bottom: 30px;
  font-size: 14px;
  text-align: center;
  padding: 0 0 10px;
}

.main .contents .con {
  -webkit-text-stroke: 0.8px #08014E;
  color: #fff;
  text-align: center;
}

.main .contents .con__box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  justify-content: center;
  align-items: end;
  padding-bottom: 10px;
}

.main .contents .con__box:nth-child(2) {
  margin-bottom: 60px;
}

.main .contents .con__title {
  padding-right: 10px;
  font-weight: 900;
  font-size: 24px;
}

.main .contents .con__text {
  font-size: 24px;
  font-weight: 700;
}

@media screen and (min-width: 744px) {
  .main .contents {
    margin-bottom: 5.30035vh;
  }
  .main .contents__titledeco {
    margin: 0 auto 20px;
    font-size: 24px;
  }
  .main .contents__titledeco::before {
    height: 20px;
    width: 20px;
    left: -23px;
    bottom: -6px;
  }
  .main .contents__titledeco::after {
    height: 20px;
    width: 20px;
    right: -23px;
    bottom: -6px;
  }
  .main .contents__title {
    margin-bottom: 0;
  }
  .main .contents__num {
    font-size: 30px;
    font-weight: 700;
  }
  .main .contents__itemtitle {
    font-size: 32px;
  }
  .main .contents__img {
    margin: 0 auto 40px;
    width: 55.14706%;
  }
  .main .contents__sentence {
    margin-bottom: 10px;
    font-size: 18px;
    line-height: 1.5em;
  }
  .main .contents__text {
    font-size: 20px;
  }
  .main .contents .con__title {
    font-size: 32px;
  }
  .main .contents .con__text {
    font-size: 28px;
    font-weight: 800;
  }
}

@media screen and (min-width: 901px) {
  .main .contents {
    margin-bottom: 0;
    width: 100%;
  }
  .main .contents__titledeco {
    font-size: 32px;
  }
  .main .contents__title {
    font-size: 72px;
    margin-bottom: 9.63082vh;
    background-image: url(../img/bg_cross.webp);
    background-size: 40px;
    padding: 30px 0;
  }
}

.main .djcon {
  width: 100vw;
  overflow: hidden;
}

.main .djcon__item {
  margin-bottom: 60px;
}

.main .djcon__subcatch {
  background-color: #fff;
  border-radius: 5px;
  border: 2px solid #08014E;
  width: fit-content;
  width: -moz-fit-content;
  margin-bottom: 10px;
  box-shadow: 4px 4px 0 #08014E;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  font-size: clamp(1.43rem, 3vw, 2.85rem);
  position: relative;
  left: -40%;
  padding: 10px 10px 10px 6.25vw;
  transition: all 0.5s;
  opacity: 0;
}

.main .djcon__subcatch.active {
  left: -3.125vw;
  opacity: 1;
}

.main .djcon__img {
  position: relative;
  width: 104.6875vw;
  height: 104.6875vw;
  clip-path: circle(50% at 50% 50%);
  border: 2px solid #08014E;
  background-color: #08014E;
  z-index: -1;
  top: -9.15493vh;
  right: -40%;
  opacity: 0;
  margin-left: 13.125%;
  transition: all 0.5s;
}

.main .djcon__img img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 102.5vw;
  height: 102.5vw;
  object-fit: cover;
  object-position: right;
  clip-path: circle(50% at 50% 50%);
}

.main .djcon__img.active {
  opacity: 1;
  right: 0;
}

.main .djcon__inner {
  margin: auto;
  width: 93.75%;
}

@media screen and (min-width: 744px) {
  .main .djcon__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .djcon__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .djcon__title {
  margin: 0 auto 30px;
  width: fit-content;
  width: -moz-fit-content;
  text-align: center;
  font-size: 20px;
  font-weight: 900;
  font-family: "M PLUS 1p", sans-serif;
}

.main .djcon__text {
  padding: 20px 10px;
  margin-bottom: 20px;
  font-size: 16px;
  border-top: 2px solid #08014E;
  border-bottom: 2px solid #08014E;
  line-height: 1.5em;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background-color: rgba(248, 182, 45, 0.2);
  padding: 10px;
}

.main .djcon__text::before {
  content: "";
  position: absolute;
  display: block;
  background-color: #F8B62D;
  height: 110%;
  width: 50%;
  top: 50%;
  left: 0;
  transform: translate(0, -50%);
  border: 3px solid #F8B62D;
  transition: all 1.5s;
}

.main .djcon__text::after {
  content: "";
  position: absolute;
  display: block;
  background-color: #F8B62D;
  height: 110%;
  width: 50%;
  top: 50%;
  right: 0;
  transform: translate(0, -50%);
  border: 3px solid #F8B62D;
  transition: all 1.5s;
}

.main .djcon__text.active::before {
  left: -100%;
}

.main .djcon__text.active::after {
  right: -100%;
}

.main .djcon__btn {
  width: fit-content;
  width: -moz-fit-content;
  padding: 10px;
  font-weight: 900;
  font-family: "M PLUS 1p", sans-serif;
  border-radius: 5px;
  background-color: #fff;
  border: 2px solid #08014E;
  box-shadow: 4px 4px 0 #08014E;
  margin: 0 auto;
  font-size: clamp(1rem, 1.9vw, 1.71em);
  position: relative;
  transition: all 0.3s;
  top: 0;
  left: 0;
}

.main .djcon__btn:hover {
  top: 2px;
  left: 2px;
  box-shadow: 2px 2px 0 #08014E;
}

.main .djcon__item:nth-child(2) .djcon .view {
  width: 100vw;
  position: relative;
}

.main .djcon__item:nth-child(2) .djcon__subcatch {
  background-color: #08014E;
  border: 2px solid #fff;
  box-shadow: 4px 4px 0 #fff;
  color: #fff;
  font-weight: 800;
}

.main .djcon__item:nth-child(2) .djcon__btn {
  background-color: #08014E;
  border: 2px solid #fff;
  box-shadow: 4px 4px 0 #fff;
  color: #fff;
  font-weight: 800;
}

.main .djcon__item:nth-child(2) .djcon__btn:hover {
  box-shadow: 2px 2px 0 #fff;
}

@media screen and (min-width: 744px) {
  .main .djcon__item {
    margin-bottom: 100px;
  }
  .main .djcon__subcatch {
    margin-bottom: 16px;
    left: -1.34409vw;
    padding: 10px 10px 10px 12.76882vw;
  }
  .main .djcon__img {
    width: 88.70968vw;
    height: 88.70968vw;
    top: -9.0106vh;
    margin-left: 17.47312%;
  }
  .main .djcon__img img {
    transform: translate(-50%, -50%);
    width: 87.36559vw;
    height: 87.36559vw;
  }
  .main .djcon__title {
    font-size: 32px;
  }
  .main .djcon__text {
    font-size: 20px;
  }
}

@media screen and (min-width: 901px) {
  .main .djcon {
    width: 100%;
  }
  .main .djcon__subcatch {
    left: -23.4375%;
  }
  .main .djcon__subcatch.active {
    margin-bottom: 16px;
    left: -5.07812%;
    padding: 10px 10px 10px 5.46875vw;
  }
  .main .djcon__img {
    position: relative;
    width: 104.6875vw;
    height: 104.6875vw;
    clip-path: circle(50% at 50% 50%);
    border: 2px solid #08014E;
    background-color: #08014E;
    z-index: -1;
    top: -9.15493vh;
    right: -40%;
    opacity: 0;
    margin-left: 13.125%;
    transition: all 0.5s;
  }
  .main .djcon__img img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 102.5vw;
    height: 102.5vw;
    object-fit: cover;
    object-position: right;
    clip-path: circle(50% at 50% 50%);
  }
  .main .djcon__img.active {
    opacity: 1;
    right: 0;
  }
  .main .djcon__img {
    width: 35.9375vw;
    height: 35.9375vw;
    top: -12.25962vh;
    margin-left: 29.6875%;
  }
  .main .djcon__img img {
    transform: translate(-50%, -50%);
    width: 34.375vw;
    height: 34.375vw;
  }
}

.main .basic {
  margin-bottom: 60px;
}

.main .basic__titledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.main .basic__titledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.main .basic__titledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .main .basic__titledeco {
    font-size: 18px;
  }
}

.main .basic__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
}

@media screen and (min-width: 744px) {
  .main .basic__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.main .basic__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.main .basic__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .main .basic__textlist {
    font-size: 32px;
  }
}

.main .basic__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
}

@media screen and (min-width: 744px) {
  .main .basic__titleslide {
    top: 20px;
  }
}

.main .basic__inner {
  margin: auto;
  width: 93.75%;
}

@media screen and (min-width: 744px) {
  .main .basic__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .basic__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .basic__maintext {
  margin-bottom: 40px;
  font-size: 16px;
  letter-spacing: 0.2em;
  line-height: 1.5;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background-color: rgba(248, 182, 45, 0.2);
  padding: 20px;
  border-radius: 10px;
}

.main .basic .flow {
  margin-bottom: 60px;
}

.main .basic .flow__title {
  font-size: 20px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 40px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.main .basic .flow__title::before {
  content: "";
  display: block;
  position: absolute;
  height: 20px;
  width: 30px;
  background-image: url(../img/deco__line02.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -40px;
  bottom: -6px;
}

.main .basic .flow__title::after {
  content: "";
  display: block;
  position: absolute;
  height: 20px;
  width: 30px;
  background-image: url(../img/deco__line02.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -40px;
  bottom: -6px;
  transform: scale(-1, 1);
}

.main .basic .flow__title.active {
  animation: purun 0.8s linear 0s 1;
  opacity: 1;
}

.main .basic .flow__item {
  position: relative;
  background-color: #fff;
  border: 2px solid #08014E;
  padding: 10px;
  border-radius: 10px;
  width: 90%;
  margin: 0 auto 60px;
  opacity: 0;
  transition: all 1s;
  top: -100px;
}

.main .basic .flow__item::after {
  content: "";
  position: absolute;
  background-color: #08014E;
  left: 50%;
  bottom: -40px;
  transform: translate(-50%, 0);
  width: 30px;
  height: 20px;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}

.main .basic .flow__item.active {
  opacity: 1;
  top: 0;
}

.main .basic .flow__item.active::after {
  content: "";
  position: absolute;
  background-color: #08014E;
  left: 50%;
  bottom: -40px;
  transform: translate(-50%, 0);
  width: 30px;
  height: 20px;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}

.main .basic .flow__item:nth-last-child(1)::after {
  display: none;
}

.main .basic .flow__itemtitle {
  position: relative;
  text-align: center;
  border-bottom: 2px solid #08014E;
  padding-bottom: 10px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 800;
  font-size: 18px;
}

.main .basic .flow__num {
  position: absolute;
  width: 15.625vw;
  height: 15.625vw;
  max-width: 85px;
  max-height: 85px;
  background-color: #fff;
  border-radius: 100px;
  border: 2px solid #08014E;
  top: 70%;
  left: 90%;
  transform: translate(0, -70%) rotate(360deg);
  text-align: center;
  line-height: 0.6;
  transition: all 1s;
}

.main .basic .flow__num .text {
  position: absolute;
  font-size: 10px;
  display: block;
  left: 50%;
  top: 20%;
  transform: translate(-50%, -20%);
}

.main .basic .flow__num .center {
  position: absolute;
  display: block;
  border: 2px solid #08014E;
  border-radius: 30px;
  background-color: #F8B62D;
  width: 10px;
  height: 10px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.main .basic .flow__num .num {
  position: absolute;
  font-size: 16px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 800;
  left: 50%;
  bottom: 10%;
  transform: translate(-50%, -10%);
}

.main .basic .flow__num.active {
  left: -10%;
  transform: translate(0, -70%) rotate(0deg);
}

.main .basic .flow__flowtext {
  padding: 10px 10px 0 10px;
  letter-spacing: 0.2em;
  line-height: 1.5;
}

.main .basic .money {
  position: relative;
  margin-bottom: 60px;
}

.main .basic .money__titlesubtext {
  position: absolute;
  padding: 5px 10px;
  border: 2px solid #08014E;
  border-radius: 50px;
  background-color: #fff;
  top: -16px;
  left: 10px;
  font-size: 12px;
  font-weight: 700;
}

.main .basic .money__titlesubtext.description {
  font-size: 18px;
  left: 50%;
  transform: translate(-50%, 0%);
  width: 90%;
  margin-bottom: 0;
}

.main .basic .money__title {
  font-size: 20px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 40px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.main .basic .money__title::before {
  content: "";
  display: block;
  position: absolute;
  height: 20px;
  width: 30px;
  background-image: url(../img/deco__line02.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -40px;
  bottom: -6px;
}

.main .basic .money__title::after {
  content: "";
  display: block;
  position: absolute;
  height: 20px;
  width: 30px;
  background-image: url(../img/deco__line02.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -40px;
  bottom: -6px;
  transform: scale(-1, 1);
}

.main .basic .money__title.active {
  animation: purun 0.8s linear 0s 1;
  opacity: 1;
}

.main .basic .money__list {
  margin-bottom: 40px;
}

.main .basic .money__item {
  position: relative;
  text-align: center;
  border: 2px solid #08014E;
  border-radius: 10px;
  background-color: #08014E;
  padding-top: 10px;
  margin-bottom: 20px;
  opacity: 0;
  right: -40%;
  transition: all 0.5s;
}

.main .basic .money__item:first-child {
  padding-top: 30px;
}

.main .basic .money__item.active {
  opacity: 1;
  right: 0;
}

.main .basic .money__itemtitle {
  color: #fff;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 700;
  font-size: 24px;
  padding-bottom: 10px;
}

.main .basic .money__itembox {
  padding: 20px;
  background-color: #fff;
  border-radius: 8px;
}

.main .basic .money__itembox span {
  display: inline-block;
}

.main .basic .money__itembox .description {
  font-size: 16px;
}

.main .basic .money__frame {
  margin-bottom: 10px;
  font-size: 24px;
}

.main .basic .money__frame .small {
  font-size: 16px;
}

.main .basic .money__price {
  font-size: 30px;
  margin-bottom: 20px;
}

.main .basic .money__price:nth-last-child(1) {
  margin-bottom: 0;
}

.main .basic .money__attentitle {
  margin-bottom: 10px;
  padding: 5px 10px;
  border-radius: 10px;
  border: 2px solid #08014E;
  width: fit-content;
  width: -moz-fit-content;
  background-color: #fff;
  font-size: 12px;
  font-family: "M PLUS 1p",sans-serif;
  font-weight: 800;
}

.main .basic .money__text {
  margin-bottom: 10px;
  display: block;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background-color: rgba(248, 182, 45, 0.2);
  padding: 10px;
  border-radius: 10px;
}

.main .basic .money__text span {
  display: inline-block;
}

.main .basic .money__text:nth-last-child(2) {
  margin-bottom: 30px;
}

.main .basic .data__item {
  position: relative;
  right: -40%;
  transition: all 0.5s;
  opacity: 0;
  background-color: #08014E;
  border-radius: 10px;
  border: 1px solid #08014E;
  overflow: hidden;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.main .basic .data__item .schedule__list {
  padding: 10px 20px 10px 30px;
  position: relative;
  background-color: #fff;
  z-index: 10;
  border-radius: 10px;
  border: 1px solid #08014E;
}

.main .basic .data__item .schedule__text {
  position: relative;
  margin-bottom: 10px;
}

.main .basic .data__item .schedule__text::before {
  content: "";
  position: absolute;
  top: 8px;
  left: -10px;
  display: block;
  width: 3px;
  height: 3px;
  background-image: url(../img/dot.webp);
  background-size: cover;
  background-repeat: no-repeat;
}

.main .basic .data__item .schedule__text:nth-last-child(1) {
  margin-bottom: 0;
}

.main .basic .data__item.schedule {
  display: block;
}

.main .basic .data__item.schedule .data__title {
  margin: 0 auto;
  padding: 10px;
  width: fit-content;
  width: -moz-fit-content;
}

.main .basic .data__item .rental__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 8px;
  border: 1px solid #08014E;
  background-color: #fff;
  padding: 10px 20px 10px 30px;
}

.main .basic .data__item .rental__title {
  width: 30%;
  font-size: 18px;
  font-weight: 900;
}

.main .basic .data__item .rental__title span {
  font-size: 12px;
}

.main .basic .data__item .rental__text {
  width: 60%;
}

.main .basic .data__item.rental {
  display: block;
}

.main .basic .data__item.rental .data__title {
  margin: 0 auto;
  padding: 10px;
  width: fit-content;
  width: -moz-fit-content;
}

.main .basic .data__item .freelesson__list {
  padding: 10px 20px 10px 30px;
  position: relative;
  background-color: #fff;
  z-index: 10;
  border-radius: 10px;
  border: 1px solid #08014E;
}

.main .basic .data__item .freelesson__item {
  position: relative;
  margin-bottom: 20px;
}

.main .basic .data__item .freelesson__item::before {
  content: "";
  position: absolute;
  top: 8px;
  left: -10px;
  display: block;
  width: 3px;
  height: 3px;
  background-image: url(../img/dot.webp);
  background-size: cover;
  background-repeat: no-repeat;
}

.main .basic .data__item .freelesson__item:nth-last-child(1) {
  margin-bottom: 20px;
}

.main .basic .data__item .freelesson__catch {
  font-family: "M PLUS 1p", sans-serif;
  text-align: center;
  font-weight: 800;
  font-size: 18px;
}

.main .basic .data__item.freelesson {
  display: block;
}

.main .basic .data__item.freelesson .data__title {
  margin: 0 auto;
  padding: 10px;
  width: fit-content;
  width: -moz-fit-content;
}

.main .basic .data__item.active {
  opacity: 1;
  right: 0;
}

.main .basic .data__title {
  width: 40%;
  color: #fff;
  font-size: 18px;
  font-family: "M PLUS 1p", sans-serif;
  text-align: center;
  font-weight: 800;
  letter-spacing: 0.05em;
}

.main .basic .data__text {
  padding: 10px 20px;
  width: 100%;
  height: 100%;
  background-color: #fff;
  font-size: 16px;
  border-radius: 10px;
  border: 1px solid #08014E;
}

@media screen and (min-width: 744px) {
  .main .basic__maintext {
    font-size: 20px;
  }
  .main .basic .flow {
    margin-bottom: 60px;
    font-size: 18px;
  }
  .main .basic .flow__title {
    font-size: 20px;
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-weight: 500;
    color: #08014E;
    -webkit-text-stroke: 0 #08014E;
    position: relative;
    object-fit: cover;
    margin: 0 auto 40px;
    width: fit-content;
    width: -moz-fit-content;
    opacity: 0;
  }
  .main .basic .flow__title::before {
    content: "";
    display: block;
    position: absolute;
    height: 20px;
    width: 30px;
    background-image: url(../img/deco__line02.webp);
    background-repeat: no-repeat;
    background-size: cover;
    left: -40px;
    bottom: -6px;
  }
  .main .basic .flow__title::after {
    content: "";
    display: block;
    position: absolute;
    height: 20px;
    width: 30px;
    background-image: url(../img/deco__line02.webp);
    background-repeat: no-repeat;
    background-size: cover;
    right: -40px;
    bottom: -6px;
    transform: scale(-1, 1);
  }
  .main .basic .flow__title.active {
    animation: purun 0.8s linear 0s 1;
    opacity: 1;
  }
  .main .basic .flow__num {
    width: 9.4086vw;
    height: 9.4086vw;
    border-radius: 200px;
  }
  .main .basic .flow__num .text {
    font-size: 14px;
    display: block;
    top: 21%;
    transform: translate(-50%, -21%);
  }
  .main .basic .flow__num .center {
    display: block;
    border: 2px solid #08014E;
    border-radius: 50px;
    width: 12px;
    height: 12px;
  }
  .main .basic .flow__num .num {
    font-size: 18px;
    bottom: 11%;
    transform: translate(-50%, -11%);
  }
  .main .basic .money__titlesubtext.description {
    font-size: 18px;
    left: 50%;
    transform: translate(-50%, 0%);
    width: auto;
    margin-bottom: 0;
  }
  .main .basic .money__item {
    margin-bottom: 30px;
  }
  .main .basic .money__itembox .description {
    font-size: 22px;
    font-weight: 400;
  }
  .main .basic .money__text :nth-last-child(2) {
    margin-bottom: 60px;
  }
  .main .basic .data__item .schedule__text {
    position: relative;
    margin-bottom: 16px;
    font-size: 18px;
  }
  .main .basic .data__item .schedule__text::before {
    top: 10px;
    left: -12px;
    width: 4px;
    height: 4px;
  }
  .main .basic .data__item .schedule__text:nth-last-child(1) {
    margin-bottom: 0;
  }
  .main .basic .data__item .rental__item {
    padding: 20px 30px 20px 30px;
  }
  .main .basic .data__item .rental__title {
    font-size: 24px;
  }
  .main .basic .data__item .rental__title span {
    font-size: 16px;
  }
  .main .basic .data__item .rental__text {
    font-size: 18px;
  }
  .main .basic .data__item .freelesson__list {
    padding: 20px 30px 20px 30px;
  }
  .main .basic .data__title {
    font-size: 24px;
  }
  .main .basic .data__text {
    padding: 10px 20px;
    font-size: 18px;
  }
}

.main .dtmabout {
  text-align: center;
  margin-bottom: 60px;
}

.main .dtmabout__inner {
  margin: auto;
  width: 93.75%;
  border-top: 2px solid #08014E;
  border-bottom: 2px solid #08014E;
  padding: 30px 10px;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background-color: rgba(248, 182, 45, 0.2);
}

@media screen and (min-width: 744px) {
  .main .dtmabout__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .dtmabout__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .dtmabout__title {
  margin-bottom: 30px;
  font-size: 24px;
  font-weight: 900;
  font-family: "M PLUS 1p", sans-serif;
}

.main .dtmabout__text {
  font-size: 18px;
  margin-bottom: 30px;
}

.main .dtmabout__text:nth-last-child(1) {
  margin-bottom: 0;
}

@media screen and (min-width: 744px) {
  .main .dtmabout {
    margin-bottom: 100px;
  }
  .main .dtmabout__inner {
    padding: 60px 0;
  }
  .main .dtmabout__title {
    margin-bottom: 30px;
    font-size: 32px;
    font-weight: 900;
    font-family: "M PLUS 1p", sans-serif;
  }
  .main .dtmabout__text {
    font-size: 24px;
    margin-bottom: 40px;
    line-height: 1.5;
  }
}

.main .dtmacademy {
  margin-bottom: 60px;
}

.main .dtmacademy__titledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.main .dtmacademy__titledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.main .dtmacademy__titledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .main .dtmacademy__titledeco {
    font-size: 18px;
  }
}

.main .dtmacademy__titledeco.active {
  animation: purun 0.8s linear 0s 1;
  opacity: 1;
}

.main .dtmacademy__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
  margin-bottom: 80px;
}

@media screen and (min-width: 744px) {
  .main .dtmacademy__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.main .dtmacademy__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.main .dtmacademy__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .main .dtmacademy__textlist {
    font-size: 32px;
  }
}

.main .dtmacademy__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
}

@media screen and (min-width: 744px) {
  .main .dtmacademy__titleslide {
    top: 20px;
  }
}

.main .dtmacademy__inner {
  margin: auto;
  width: 93.75%;
}

@media screen and (min-width: 744px) {
  .main .dtmacademy__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .dtmacademy__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .dtmacademy__item {
  margin-bottom: 60px;
  position: relative;
  border: 3px solid #08014E;
  border-radius: 10px;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background-color: rgba(248, 182, 45, 0.2);
}

.main .dtmacademy__num {
  position: absolute;
  padding: 0 5px 0 20px;
  font-size: 48px;
  font-weight: 900;
  font-family: "M PLUS 1p", sans-serif;
  color: #fff;
  text-shadow: 2px 2px #08014E;
  -webkit-text-stroke: 1px #08014E;
  top: -14%;
  left: 100%;
  opacity: 0;
}

.main .dtmacademy__num::after {
  content: "";
  width: 100%;
  height: 15px;
  position: absolute;
  top: 20px;
  left: 0;
  background-color: #F8B62D;
  z-index: -1;
}

.main .dtmacademy__num span {
  position: absolute;
  font-size: 12px;
  font-weight: 900;
  color: #08014E;
  text-shadow: 0 0 #08014E;
  -webkit-text-stroke: 0 #08014E;
  transform: rotate(270deg);
  top: 20px;
  left: -8px;
  font-family: "Zen Kaku Gothic New",sans-serif;
}

.main .dtmacademy__num.active {
  left: 15px;
  opacity: 1;
}

.main .dtmacademy__maintext {
  padding: 30px 10px 20px;
  text-align: center;
  border-bottom: 3px solid #08014E;
  width: 100%;
  font-weight: 900;
  font-size: 16px;
}

.main .dtmacademy__text {
  padding: 20px 10px 30px;
  text-align: center;
  font-size: 14px;
}

@media screen and (min-width: 744px) {
  .main .dtmacademy {
    margin-bottom: 100px;
  }
  .main .dtmacademy__title {
    margin-bottom: 100px;
  }
  .main .dtmacademy__item {
    margin-bottom: 80px;
  }
  .main .dtmacademy__num {
    padding: 0 10px 0 30px;
    font-size: 64px;
    top: -10%;
    left: 100%;
    text-shadow: 4px 4px #08014E;
  }
  .main .dtmacademy__num span {
    font-size: 18px;
    top: 28px;
    left: -10px;
    font-family: "Zen Kaku Gothic New",sans-serif;
  }
  .main .dtmacademy__maintext {
    padding: 50px 10px 40px;
    font-size: 20px;
    line-height: 1.5;
  }
  .main .dtmacademy__text {
    padding: 30px 10px 30px;
    font-size: 20px;
    line-height: 1.5;
  }
}

.main .soft {
  margin-bottom: 60px;
}

.main .soft__inner {
  margin: auto;
  width: 93.75%;
}

@media screen and (min-width: 744px) {
  .main .soft__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .soft__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .soft__title {
  font-size: 20px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 40px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
  text-align: center;
}

.main .soft__title::before {
  content: "";
  display: block;
  position: absolute;
  height: 20px;
  width: 30px;
  background-image: url(../img/deco__line02.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -40px;
  bottom: -6px;
}

.main .soft__title::after {
  content: "";
  display: block;
  position: absolute;
  height: 20px;
  width: 30px;
  background-image: url(../img/deco__line02.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -40px;
  bottom: -6px;
  transform: scale(-1, 1);
}

.main .soft__title.active {
  animation: purun 0.8s linear 0s 1;
  opacity: 1;
}

.main .soft__item {
  position: relative;
  margin-bottom: 20px;
  opacity: 0;
  transform: translate(0, 0);
}

.main .soft__item.active {
  animation: jump 0.8s 1s forwards;
}

.main .soft__itemtitle {
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  text-align: center;
  font-size: 20px;
  font-weight: 900;
  font-family: "M PLUS 1p", sans-serif;
}

.main .soft__textbox {
  padding: 20px;
  border: 2px solid #08014E;
  background-color: #fff;
  text-align: center;
  border-radius: 20px;
  line-height: 1.5em;
}

.main .soft__textbox span {
  display: inline-block;
}

@media screen and (min-width: 744px) {
  .main .soft {
    margin-bottom: 100px;
  }
  .main .soft__title {
    font-size: 24px;
  }
  .main .soft__title::before {
    height: 37px;
    width: 56px;
    left: -60px;
    bottom: -10px;
  }
  .main .soft__title::after {
    height: 37px;
    width: 56px;
    right: -60px;
    bottom: -10px;
  }
  .main .soft__item {
    margin-bottom: 60px;
  }
  .main .soft__itemtitle {
    margin: 0 auto 20px;
    font-size: 30px;
    font-weight: 900;
  }
  .main .soft__textbox {
    line-height: 1.5;
    letter-spacing: 0.06em;
    font-size: 18px;
  }
  .main .soft__textbox span {
    display: inline-block;
  }
}

.main .support {
  position: relative;
  margin-bottom: 60px;
}

.main .support__titlebox {
  position: relative;
  height: 64.26056vh;
  margin-bottom: 40px;
}

.main .support__titlebox::after {
  content: "";
  position: absolute;
  background-image: url(../img/bg_cross.webp);
  background-size: 40px;
  display: block;
  bottom: -5px;
  left: -40%;
  width: 100%;
  height: 60%;
  z-index: -5;
}

.main .support__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
  position: relative;
  top: 30%;
}

@media screen and (min-width: 744px) {
  .main .support__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.main .support__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.main .support__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .main .support__textlist {
    font-size: 32px;
  }
}

.main .support__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
}

@media screen and (min-width: 744px) {
  .main .support__titleslide {
    top: 20px;
  }
}

.main .support__text {
  margin-top: 40px;
  text-align: right;
  -webkit-text-stroke: 0.8px #08014E;
  color: #fff;
  font-weight: 900;
  font-style: normal;
  font-size: clamp(1.7rem, 4vw, 3.42rem);
}

.main .support__rightimg {
  position: absolute;
  width: 100%;
  height: 35.21127vh;
  object-fit: cover;
  margin-left: 100px;
  z-index: -3;
  top: 40px;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 4px 4px 0 #08014E;
}

.main .support__rightimg img {
  object-fit: cover;
  height: 100%;
}

.main .support__con {
  position: absolute;
  bottom: 3%;
  right: 2.77778vw;
}

.main .support__textitem {
  margin: auto;
  width: 93.75%;
  position: relative;
  top: -40px;
}

@media screen and (min-width: 744px) {
  .main .support__textitem {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .support__textitem {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .support__textitem::after {
  content: "";
  display: block;
  position: absolute;
  background-image: url(../img/bg_cross.webp);
  background-size: 40px;
  width: 80%;
  height: 60%;
  top: 60%;
  left: -20px;
  transform: translate(0, -60%);
  z-index: -1;
}

.main .support__catch {
  position: relative;
  margin: 0 auto;
  width: 93.33333%;
  top: 40px;
}

.main .support__maintextbox {
  margin: auto;
  width: 93.75%;
}

@media screen and (min-width: 744px) {
  .main .support__maintextbox {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .support__maintextbox {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .support__maintext {
  margin-bottom: 30px;
  text-align: center;
  font-size: 16px;
  line-height: 1.6em;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background-color: rgba(248, 182, 45, 0.2);
  border-radius: 10px;
  padding: 5px;
}

.main .support__btn {
  width: fit-content;
  width: -moz-fit-content;
  position: relative;
  margin: 0 auto;
  transition: all 0.3s;
  top: 0;
  left: 0;
}

.main .support__btn::after {
  transition: all 0.3s;
}

.main .support__btn:hover {
  top: 6px;
  left: 6px;
}

.main .support__btn:hover::after {
  bottom: 0px;
  right: 0px;
}

.main .support__btn a {
  position: relative;
  background-color: #08014E;
  padding: 10px 20px;
  display: block;
  width: fit-content;
  width: -moz-fit-content;
  height: fit-content;
  border-radius: 5px;
  z-index: 3;
  font-size: 16px;
  font-weight: 900;
  font-family: "M PLUS 1p", sans-serif;
  letter-spacing: 0.1em;
  font-size: 20px;
  color: #fff;
}

.main .support__btn::after {
  content: "";
  position: absolute;
  background-color: #fff;
  display: block;
  width: 100%;
  height: 100%;
  bottom: -6px;
  right: -6px;
  border-radius: 5px;
  border: 2px solid #08014E;
}

@media screen and (min-width: 744px) {
  .main .support__text {
    font-size: 48px !important;
  }
  .main .support__maintext {
    font-size: 20px;
    margin-bottom: 30px;
  }
}

.main .yell {
  margin-bottom: 60px;
}

.main .yell__inner {
  margin: auto;
  width: 93.75%;
}

@media screen and (min-width: 744px) {
  .main .yell__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .yell__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .yell__titledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.main .yell__titledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.main .yell__titledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .main .yell__titledeco {
    font-size: 18px;
  }
}

.main .yell__titledeco.active {
  animation: purun 0.8s linear 0s 1;
  opacity: 1;
}

.main .yell__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
  margin-bottom: 40px;
}

@media screen and (min-width: 744px) {
  .main .yell__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.main .yell__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.main .yell__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .main .yell__textlist {
    font-size: 32px;
  }
}

.main .yell__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
}

@media screen and (min-width: 744px) {
  .main .yell__titleslide {
    top: 20px;
  }
}

.main .yell__img {
  position: relative;
  margin-bottom: 24px;
  opacity: 0;
}

.main .yell__img .top::before {
  content: "";
  position: absolute;
  width: 9.6875vw;
  height: 5.98592vh;
  background-image: url(../img/djzero_text_decoimg_02.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  top: 20px;
  left: 20px;
  opacity: 0;
  transition: all 0.1s 1.5s;
}

.main .yell__img .top::after {
  content: "";
  position: absolute;
  width: 9.6875vw;
  height: 8.80282vh;
  background-image: url(../img/djzero_text_decoimg_01.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  top: 0;
  right: 11.25vw;
  transform: scale(-0.5, -0.5);
  opacity: 0;
  transition: all 0.1s 1.8s;
}

.main .yell__img .bottom::before {
  content: "";
  position: absolute;
  width: 9.6875vw;
  height: 5.98592vh;
  background-image: url(../img/djzero_text_decoimg_02.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  bottom: 20px;
  right: 20px;
  opacity: 0;
  transition: all 0.1s 1.5s;
  display: block;
  transform: scale(-1, -1);
}

.main .yell__img .bottom::after {
  content: "";
  position: absolute;
  width: 9.6875vw;
  height: 8.80282vh;
  background-image: url(../img/djzero_text_decoimg_01.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  bottom: 0;
  left: 0vw;
  display: block;
  transform: scale(-0.5, -0.5);
  opacity: 0;
  transition: all 0.1s 2s;
}

.main .yell__img.active {
  animation: jump 0.6s 0.5s forwards;
}

.main .yell .top.active::before {
  top: 0;
  left: -1.5625vw;
  opacity: 1;
}

.main .yell .top.active::after {
  transform: scale(-1, -1);
  opacity: 1;
}

.main .yell .bottom.active::before {
  bottom: -3.52113vh;
  right: -6.25vw;
  opacity: 1;
}

.main .yell .bottom.active::after {
  transform: scale(-1, -1);
  opacity: 1;
}

.main .yell__contact {
  text-align: center;
}

.main .yell__contitle {
  margin-bottom: 20px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  font-size: 20px;
}

.main .yell__text {
  margin-bottom: 10px;
  font-size: 26px;
}

.main .yell__btn {
  width: fit-content;
  width: -moz-fit-content;
  margin: 0 auto;
  padding: 10px 20px;
  font-size: 18px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  background-color: #fff;
  border: 2px solid #08014E;
  border-radius: 5px;
  box-shadow: 4px 4px 0 #08014E;
  position: relative;
  transition: all 0.3s;
  top: 0;
  left: 0;
}

.main .yell__btn:hover {
  top: 2px;
  left: 2px;
  box-shadow: 2px 2px 0 #08014E;
}

@media screen and (min-width: 744px) {
  .main .yell__img .top::before {
    content: "";
    position: absolute;
    width: 8.33333vw;
    height: 7.06714vh;
    background-image: url(../img/djzero_text_decoimg_02.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    top: 0;
    left: -2.95699vw;
  }
  .main .yell__img .top::after {
    content: "";
    position: absolute;
    width: 8.73656vw;
    height: 10.60071vh;
    background-image: url(../img/djzero_text_decoimg_01.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    top: 0;
    right: 4.947vw;
  }
  .main .yell__img .bottom::before {
    content: "";
    position: absolute;
    width: 8.33333vw;
    height: 7.06714vh;
    background-image: url(../img/djzero_text_decoimg_02.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    bottom: -3.52113vh;
    right: -6.25vw;
    display: block;
    transform: scale(-1, -1);
  }
  .main .yell__img .bottom::after {
    content: "";
    position: absolute;
    width: 8.73656vw;
    height: 10.60071vh;
    background-image: url(../img/djzero_text_decoimg_01.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    bottom: 0.88339vh;
    left: 0.13441vw;
    display: block;
    transform: scale(-1, -1);
  }
  .main .yell__contitle {
    font-size: 32px;
  }
  .main .yell__text {
    margin-bottom: 20px;
    font-size: 30px;
  }
  .main .yell__btn {
    font-size: 20px;
    letter-spacing: 0.1em;
    position: relative;
    transition: all 0.3s;
    top: 0;
    left: 0;
  }
  .main .yell__btn:hover {
    top: 2px;
    left: 2px;
    box-shadow: 2px 2px 0 #08014E;
  }
}

@media screen and (min-width: 901px) {
  .main .yell__img .top::before {
    content: "";
    width: 64px;
    height: 72px;
    top: 0;
    left: -10px;
  }
  .main .yell__img .top::after {
    width: 80px;
    height: 130px;
    top: 0;
    right: 56px;
  }
  .main .yell__img .bottom::before {
    width: 64px;
    height: 72px;
    bottom: -50px;
    right: -50px;
  }
  .main .yell__img .bottom::after {
    width: 80px;
    height: 130px;
    bottom: 10px;
    left: -10px;
  }
}

.main .description {
  margin-bottom: 30px;
}

.main .description__decobox {
  padding: 40px 0;
}

.main .description__decobox .yellow {
  border-top: 1px solid #08014E;
  border-bottom: 1px solid #08014E;
}

.main .description__decobox .yellow .description__textlist {
  animation: flowing 40s linear infinite;
}

.main .description__decobox .yellow .description__titleslide {
  -webkit-text-stroke: 1px #08014E;
  color: #F8B62D;
}

.main .description__decobox .navy {
  border-top: 1px solid #08014E;
  border-bottom: 1px solid #08014E;
  background-color: #08014E;
  border: none;
}

.main .description__decobox .navy .description__textlist {
  animation: flowingreverse 40s linear infinite;
  font-size: 24px;
  transform: translateX(-100%);
  margin: 0;
  padding: 0;
}

.main .description__decobox .navy .description__titleslide {
  -webkit-text-stroke: 0.8px #F8B62D;
  color: #08014E;
}

@keyframes flowingreverse {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}

.main .description__decobox .white {
  border-top: 1px solid #08014E;
  border-bottom: 1px solid #08014E;
  background-color: #F8B62D;
}

.main .description__decobox .white .description__textlist {
  animation: flowing 40s linear infinite;
}

.main .description__decobox .white .description__titleslide {
  -webkit-text-stroke: 1px #08014E;
  color: #fff;
}

.main .description__deco {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
  margin-bottom: 0;
  padding: 10px 0;
  background-color: #fff;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  font-weight: 900;
  font-size: 20px;
}

@media screen and (min-width: 744px) {
  .main .description__deco {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.main .description__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
  top: 0;
  z-index: inherit;
  position: inherit;
  color: #000;
  -webkit-text-stroke: initial;
  opacity: 1;
  justify-content: center;
}

@media screen and (min-width: 744px) {
  .main .description__titleslide {
    top: 20px;
  }
}

.main .description__textslide {
  width: fit-content;
  width: -moz-fit-content;
  padding-right: 0;
}

.main .description__textslide img {
  margin: 0 auto;
}

.main .description__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.main .description__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .main .description__textlist {
    font-size: 32px;
  }
}

.main .description__inner {
  margin: auto;
  width: 93.75%;
  color: #000;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background-color: rgba(248, 182, 45, 0.2);
  padding: 10px;
  border-radius: 10px;
}

@media screen and (min-width: 744px) {
  .main .description__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .description__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .description__subtitle {
  margin-bottom: 40px;
  font-family: "M PLUS 1p", sans-serif;
  text-align: center;
  font-weight: 900;
  font-size: 18px;
}

.main .description__text {
  margin-bottom: 40px;
  line-height: 2;
  font-size: 16px;
}

.main .description__text:last-child {
  margin-bottom: 0;
}

@media screen and (min-width: 744px) {
  .main .description {
    margin-bottom: 100px;
  }
  .main .description__deco {
    margin-bottom: 0;
    top: 0;
  }
  .main .description__titleslide {
    top: 0;
  }
  .main .description__subtitle {
    font-size: 24px;
  }
  .main .description__text {
    text-align: center;
    font-size: 18px;
    line-height: 2;
  }
}

@media screen and (min-width: 901px) {
  .main .description__decobox {
    padding-bottom: 100px;
  }
  .main .description__decobox:last-child {
    padding-bottom: 0;
    padding-top: 100px;
  }
  .main .description__subtitle {
    font-size: 32px;
  }
  .main .description__text {
    font-size: 24px;
  }
}

.main .value {
  margin-bottom: 60px;
}

.main .value__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
  margin-bottom: 40px;
}

@media screen and (min-width: 744px) {
  .main .value__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.main .value__titledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.main .value__titledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.main .value__titledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .main .value__titledeco {
    font-size: 18px;
  }
}

.main .value__titledeco.active {
  animation: purun 0.8s linear 0s 1;
  opacity: 1;
}

.main .value__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.main .value__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .main .value__textlist {
    font-size: 32px;
  }
}

.main .value__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
}

@media screen and (min-width: 744px) {
  .main .value__titleslide {
    top: 20px;
  }
}

.main .value__inner {
  margin: auto;
  width: 93.75%;
}

@media screen and (min-width: 744px) {
  .main .value__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .value__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .value__maintext {
  margin-bottom: 40px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  font-size: 16px;
  letter-spacing: 0.1em;
  text-align: center;
}

.main .value__pointlist {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 100%;
  justify-content: center;
}

.main .value__point {
  width: 43.75vw;
  padding: 0 10px 3.52113vh;
}

.main .value__contact {
  text-align: center;
}

.main .value__contitle {
  margin-bottom: 20px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  font-size: 20px;
}

.main .value__text {
  margin-bottom: 10px;
  font-size: 26px;
}

.main .value__btn {
  width: fit-content;
  width: -moz-fit-content;
  margin: 0 auto;
  padding: 10px 20px;
  font-size: 18px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  background-color: #fff;
  border: 2px solid #08014E;
  border-radius: 5px;
  box-shadow: 4px 4px 0 #08014E;
  position: relative;
  transition: all 0.3s;
  top: 0;
  left: 0;
}

.main .value__btn:hover {
  top: 2px;
  left: 2px;
  box-shadow: 2px 2px 0 #08014E;
}

@media screen and (min-width: 744px) {
  .main .value {
    margin-bottom: 100px;
  }
  .main .value__maintext {
    font-size: 20px;
    letter-spacing: 0.2em;
  }
  .main .value__pointlist {
    margin-bottom: 60px;
  }
  .main .value__point {
    width: 35.21505%;
    height: auto;
  }
  .main .value__contitle {
    font-size: 32px;
  }
  .main .value__text {
    margin-bottom: 20px;
    font-size: 30px;
  }
  .main .value__btn {
    font-size: 20px;
    letter-spacing: 0.1em;
    position: relative;
    transition: all 0.3s;
    top: 0;
    left: 0;
  }
  .main .value__btn:hover {
    top: 2px;
    left: 2px;
    box-shadow: 2px 2px 0 #08014E;
  }
}

@media screen and (min-width: 901px) {
  .main .value__point {
    width: 48.57143%;
  }
}

.main .benefit {
  margin-bottom: 60px;
}

.main .benefit__subtitle {
  margin-bottom: 40px;
  text-align: center;
  font-weight: 900;
  font-size: 18px;
  line-height: 1.5;
}

.main .benefit__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
  margin-bottom: 40px;
}

@media screen and (min-width: 744px) {
  .main .benefit__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.main .benefit__titledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.main .benefit__titledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.main .benefit__titledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .main .benefit__titledeco {
    font-size: 18px;
  }
}

.main .benefit__titledeco.active {
  animation: purun 0.8s linear 0s 1;
  opacity: 1;
}

.main .benefit__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.main .benefit__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .main .benefit__textlist {
    font-size: 32px;
  }
}

.main .benefit__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
}

@media screen and (min-width: 744px) {
  .main .benefit__titleslide {
    top: 20px;
  }
}

.main .benefit__inner {
  margin: auto;
  width: 93.75%;
}

@media screen and (min-width: 744px) {
  .main .benefit__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .benefit__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .benefit__item {
  margin-bottom: 20px;
  border: 3px solid #08014E;
  border-radius: 10px;
  overflow: hidden;
  width: 100%;
  height: 31.69014vh;
  object-fit: cover;
}

.main .benefit__itemimg {
  position: relative;
  height: 100%;
}

.main .benefit__itemimg img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.main .benefit__maintext {
  position: absolute;
  z-index: 10;
  bottom: 5.6338vh;
  height: fit-content;
  width: -moz-fit-content;
}

.main .benefit__maintext span {
  margin-bottom: 20px;
  padding: 5px 10px;
  border: 3px solid #08014E;
  border-left: 0;
  background-color: #fff;
  border-radius: 0 5px 5px 0;
  box-shadow: 4px 4px 0 #08014E;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 800;
  height: fit-content;
  font-size: 20px;
  line-height: 2.1;
}

.main .benefit__text {
  margin-bottom: 40px;
  line-height: 2;
  font-size: 16px;
  font-weight: 700;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background-color: rgba(248, 182, 45, 0.2);
  padding: 10px;
  border-radius: 10px;
}

.main .benefit__text span {
  display: inline-block;
}

@media screen and (min-width: 744px) {
  .main .benefit {
    margin-bottom: 100px;
  }
  .main .benefit__subtitle {
    font-size: 20px;
    font-weight: 900;
    letter-spacing: 0.2em;
  }
  .main .benefit__list {
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    justify-content: space-around;
    object-fit: cover;
  }
  .main .benefit__item {
    width: 48.34559%;
    height: 17vh;
  }
  .main .benefit__itemimg {
    width: 100%;
    height: 100%;
  }
  .main .benefit__itemimg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .main .benefit__maintext {
    bottom: 2vh;
  }
  .main .benefit__text {
    font-size: 28px;
    font-weight: 700;
  }
}

.main .price {
  margin-bottom: 60px;
}

.main .price__inner {
  margin: auto;
  width: 93.75%;
}

@media screen and (min-width: 744px) {
  .main .price__inner {
    width: 73.11828%;
    max-width: 900px;
  }
}

@media screen and (min-width: 901px) {
  .main .price__inner {
    width: 87.5%;
    max-width: 600px;
  }
}

.main .price__title {
  font-size: 20px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 60px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.main .price__title::before {
  content: "";
  display: block;
  position: absolute;
  height: 20px;
  width: 30px;
  background-image: url(../img/deco__line02.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -40px;
  bottom: -6px;
}

.main .price__title::after {
  content: "";
  display: block;
  position: absolute;
  height: 20px;
  width: 30px;
  background-image: url(../img/deco__line02.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -40px;
  bottom: -6px;
  transform: scale(-1, 1);
}

.main .price__title.active {
  animation: purun 0.8s linear 0s 1;
  opacity: 1;
}

.main .price__list {
  margin-bottom: 20px;
}

.main .price__item {
  margin-bottom: 60px;
  width: 100%;
  background-color: #08014E;
  border: 2px solid #08014E;
  border-radius: 10px;
  text-align: center;
  opacity: 0;
  position: relative;
  left: 40%;
  transition: all 0.5s;
}

.main .price__item.active {
  opacity: 1;
  left: 0;
}

.main .price__item:last-child {
  margin-bottom: 0;
}

.main .price__subtitle {
  position: absolute;
  background-color: #fff;
  border: 2px solid #08014E;
  border-radius: 50px;
  padding: 10px;
  width: fit-content;
  width: -moz-fit-content;
  top: -4%;
  left: 50%;
  transform: translate(-50%, 0);
}

.main .price__itemtitle {
  padding: 24px 0 10px;
  color: #fff;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  font-size: 24px;
}

.main .price__eventbox {
  padding: 20px;
  background-color: #fff;
  border-radius: 10px;
  border: 1px solid #08014E;
}

.main .price__eventtitle {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 10px;
}

.main .price__eventtext {
  font-size: 24px;
}

.main .price__lessonbox {
  padding: 20px;
  background-color: #fff;
  border-radius: 10px;
  border: 1px solid #08014E;
}

.main .price__lessontitle {
  margin-bottom: 10px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  font-size: 30px;
}

.main .price .yen {
  font-size: 24px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 700;
}

.main .price .zero {
  font-size: 52px;
}

.main .price__smalltext {
  margin-bottom: 10px;
  font-size: 12px;
}

.main .price__bulleted {
  padding: 20px;
  background-color: #fff;
  border-radius: 10px;
  border: 1px solid #08014E;
}

.main .price__bulletedtitle {
  margin-bottom: 30px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 800;
  font-size: 24px;
}

.main .price__itemization {
  margin-bottom: 20px;
  font-weight: 500;
  font-size: 16px;
}

.main .price__itemization:last-child {
  margin-bottom: 0;
}

.main .price__attentitle {
  margin-bottom: 10px;
  font-family: "M PLUS 1p", sans-serif;
  border: 2px solid #08014E;
  width: fit-content;
  width: -moz-fit-content;
  background-color: #fff;
  padding: 10px;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 700;
}

.main .price__text {
  margin-bottom: 20px;
  font-size: 12px;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background-color: rgba(248, 182, 45, 0.2);
  padding: 5px;
  border-radius: 5px;
}

.main .price__text:last-child {
  margin-bottom: 0;
}

@media screen and (min-width: 744px) {
  .main .price {
    margin-bottom: 100px;
  }
}

@keyframes jump {
  0% {
    transform: translate(0, -100%);
    opacity: 0;
  }
  25% {
    transform: translate(0, 30%);
    opacity: 1;
  }
  50% {
    transform: translate(0, -15%);
  }
  75% {
    transform: translate(0, 8%);
  }
  100% {
    opacity: 1;
    transform: translate(0, 0);
  }
}

@keyframes purun {
  0% {
    transform: scale(1, 1) translate(0%, 0%);
    opacity: 0;
  }
  15% {
    transform: scale(0.9, 0.9) translate(0%, 5%);
  }
  30% {
    transform: scale(1.3, 0.8) translate(0%, 10%);
  }
  50% {
    transform: scale(0.8, 1.3) translate(0%, -10%);
  }
  70% {
    transform: scale(1.1, 0.9) translate(0%, 5%);
  }
  100% {
    transform: scale(1, 1) translate(0%, 0%);
    opacity: 1;
  }
}

@keyframes rightslide {
  0% {
    transform: translate(-100%, 0);
    opacity: 0;
  }
  30% {
    opacity: 0;
  }
  100% {
    transform: translate(0, 0);
  }
}

.footer {
  padding-bottom: 60px;
}

.footer__titledeco {
  font-size: 12px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #08014E;
  -webkit-text-stroke: 0 #08014E;
  position: relative;
  object-fit: cover;
  margin: 0 auto 10px;
  width: fit-content;
  width: -moz-fit-content;
  opacity: 0;
}

.footer__titledeco::before {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: -13px;
  bottom: -2px;
}

.footer__titledeco::after {
  content: "";
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background-image: url(../img/deco__line01.webp);
  background-repeat: no-repeat;
  background-size: cover;
  right: -13px;
  bottom: -2px;
  transform: scale(-1, 1);
}

@media screen and (min-width: 744px) {
  .footer__titledeco {
    font-size: 18px;
  }
}

.footer__title {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
  margin: 0 auto 40px;
  padding: 20px 0;
  background-color: #fff;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  font-weight: 900;
  font-size: 20px;
}

@media screen and (min-width: 744px) {
  .footer__title {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.footer__titleslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
  top: 0;
  z-index: inherit;
  position: inherit;
  color: #000;
  -webkit-text-stroke: initial;
  opacity: 1;
  justify-content: center;
}

@media screen and (min-width: 744px) {
  .footer__titleslide {
    top: 20px;
  }
}

.footer__textslide {
  width: fit-content;
  width: -moz-fit-content;
  padding-right: 0;
}

.footer__textslide img {
  margin: 0 auto;
}

.footer__textslide.img {
  padding-right: 60px;
  width: 50%;
}

.footer__logo {
  text-align: center;
  -webkit-text-stroke: 1px #08014E;
  font-size: 32px;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
  color: #fff;
  position: relative;
  margin-bottom: 40px;
  margin: 0 auto 40px;
  padding: 20px 0;
  background-color: #fff;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  font-weight: 900;
  font-size: 20px;
}

@media screen and (min-width: 744px) {
  .footer__logo {
    font-size: 48px;
    margin-bottom: 60px;
  }
}

.footer__textlist {
  animation: flowing 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

.footer__textslide {
  display: inline-block;
  padding-right: 10px;
}

@keyframes flowing {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (min-width: 744px) {
  .footer__textlist {
    font-size: 32px;
  }
}

.footer__logoslide {
  position: absolute;
  align-items: center;
  display: flex;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  z-index: -1;
  top: 15px;
  opacity: 0.5;
  height: fit-content;
  line-height: 1.5em;
  top: 0;
  z-index: inherit;
  position: inherit;
  color: #000;
  -webkit-text-stroke: initial;
  opacity: 1;
}

@media screen and (min-width: 744px) {
  .footer__logoslide {
    top: 20px;
  }
}

.footer__logolist {
  animation: return 20s linear infinite;
  font-size: 24px;
  transform: translateX(100%);
  margin: 0;
  padding: 0;
}

@keyframes return {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}

.footer .contact {
  margin-bottom: 40px;
}

.footer .contact__text {
  width: fit-content;
  width: -moz-fit-content;
  text-align: center;
  margin: 0 auto 10px;
  text-align: center;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background-color: rgba(248, 182, 45, 0.2);
  padding: 5px 8px;
  border-radius: 5px;
}

.footer .nav {
  width: fit-content;
  width: -moz-fit-content;
  margin: 0 auto 60px;
  padding: 30px;
  border-top: 2px solid #08014E;
  border-bottom: 2px solid #08014E;
  position: inherit;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background-color: rgba(248, 182, 45, 0.2);
}

.footer .nav__box {
  margin-bottom: 40px;
}

.footer .nav__box:last-child {
  margin-bottom: 0;
}

.footer .nav__title {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 700;
  font-size: 18px;
  margin-bottom: 20px;
}

.footer .nav__item {
  width: fit-content;
  width: -moz-fit-content;
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: 700;
  position: relative;
  transition: all 1s;
}

.footer .nav__item span {
  position: absolute;
  right: -30%;
  top: 50%;
  transform: translate(0, -50%);
  border-radius: 2px;
  color: rgba(8, 1, 78, 0.3);
}

.footer .nav__item span svg {
  display: inline;
  width: 12px;
  fill: #08014E;
}

.footer .nav__item:nth-last-child(1) {
  margin-bottom: 0;
}

.footer__copy {
  display: block;
  margin: 0 auto 20px;
  text-align: center;
  width: fit-content;
  width: -moz-fit-content;
  padding: 5px 10px;
  border-radius: 10px;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background-color: rgba(248, 182, 45, 0.4);
}

@media screen and (min-width: 744px) {
  .footer {
    margin-bottom: 40px;
  }
  .footer__titleslide {
    top: 0;
  }
  .footer__logoslide {
    top: 0;
  }
  .footer .contact {
    margin-bottom: 40px;
  }
  .footer .contact__text {
    margin: 0 auto;
    font-size: 24px;
  }
  .footer .nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
  }
  .footer .nav__box {
    margin: 0 40px;
  }
  .footer .nav__title {
    font-size: 24px;
  }
  .footer .nav__item {
    margin-bottom: 24px;
    position: relative;
    font-size: 20px;
    padding-bottom: 4px;
  }
  .footer .nav__item:hover::after {
    width: 100%;
  }
}

@media screen and (min-width: 901px) {
  .footer {
    margin-bottom: 40px;
  }
  .footer__textslide.img {
    padding-right: 80px;
    width: 30%;
  }
  .footer .contact__text {
    margin-bottom: 10px;
    font-size: 24px;
  }
}