body,html {
   margin: 0 !important;
   padding: 0 !important;
   overflow-x: hidden;
} 

.dela-gothic-one-regular {
  font-family: "Dela Gothic One", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.kaisei-decol-regular {
  font-family: "Kaisei Decol", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.3em;
}

body {
  background-image: linear-gradient(#744ccd, #e08dd0);
}

body {
  font-family: Arial, sans-serif;
  margin: 0;
  padding: 0;
}

/* メニューのスタイル */
.menu {
  margin-top: 0;
  position: fixed;
  top: 0;
  right: 0;
  opacity: 0; /* 初期状態は透明 */
  pointer-events: none;
  background-color: #5c5ac7;
  color: #333;
  transition: opacity 0.5s ease; /* スライドインのアニメーション */
  padding: 20px;
  box-sizing: border-box;
  z-index: 10;
  color: #bab5d4;
  box-shadow: 0px 0px 20px 20px #5c5ac7;
}

/* メニューが開いているとき */
.menu.open {
  right: 10%;
  opacity: 1; /* 不透明にする */
  pointer-events: auto;
}

/* ボタンのスタイル */
.hamburger {
  position: fixed;
  top: 20px;
  right: 10%;
  width: 30px;
  cursor: pointer;
  z-index: 20;
  background-color: #bab5d4;
  box-shadow: 0px 0px 20px 20px #bab5d4;
}

.hamburger span {
  display: block;
  height: 3px;
  width: 100%;
  background-color: #333;
  margin: 5px 0;
  transition: 0.4s;
}

/* バツ印に変化するスタイル */
.hamburger.active span:nth-child(1) {
  transform: rotate(45deg) translate(5px, 5px);
}

.hamburger.active span:nth-child(2) {
  opacity: 0;
}

.hamburger.active span:nth-child(3) {
  transform: rotate(-45deg) translate(6px, -6px);
}

/* メニューリストのスタイル */
.menu ul {
  list-style-type: none;
  padding: 0;
  margin-top: 80px;
}

.menu li {
  padding: 20px 0;
}

.menu li a {
  color: #333;
  text-decoration: none;
  display: block;
}

.snsList {
    display: flex;
}

.snsList_item {
  flex: auto;
  margin-right: 1rem;
}

.mv_wrap {
  position: relative;
}

.mv_bg {
  display: block;
  margin-left: 0 !important;
}

.mv_madoromi {
  position: absolute;
  right: 0;
}

.aboutus {
  position: relative;
  background-color: #bab5d4;
}

.aboutus_wrap {
    display: flex;
}

.logo {
  margin: 2% 5%;
}

.about_h1 {
  font-size: 400%;
  margin: 0;
  background: linear-gradient(90deg, #000000, #727272);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.aboutusp {
  margin: 2%;
  text-align: center;
  background: linear-gradient(90deg, #000000, #727272);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.aboutus_img {
  margin: 2%;
}

.aboutus_bottom_wrap {
  text-align: right;
}

.schedule {
  margin-left: 0 !important;
  background-color: #bab5d4;
}

.schedule_title {
  display: flex;
}

.schedule_h1 {
  margin-left: 0 !important;
  text-align: center;
  font-size: 170%;
  background: linear-gradient(90deg, #000000, #727272);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.schedule_img {
  margin: 2%;
}

.schedule_list {
  background: linear-gradient(90deg, #000000, #727272);
  text-align: center;
  color: #bab5d4;
}

.schedule_ul {
  padding: 3%;
}

.schedule_li {
  margin: 2%;
  align-items: center;
}

.schedule_span {
  font-size: 1.2em;
}

.ticket_icon {
  margin-left: 1%;
  height: 35px;
}

.member {
    margin: 0 !important;
    background-color: #bab5d4;
    text-align: center;
}

.member_h1 {
  margin-left: 0 !important;
  text-align: center;
  font-size: 170%;
  background: linear-gradient(90deg, #000000, #727272);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.member_box {
  background: linear-gradient(90deg, #000000, #727272);
  border-radius: 20px;
  margin: 20% auto 3%!important;
  width: 80%;
}

.member_img {
  border-radius: 20px;
  margin: 0 0 3%;
  width: 40%;
}

.mishima {
  font-size: 3rem !important;
  padding: 0 auto 5% auto;
  margin-top: 0;
  margin-bottom: 0;
  font-weight: 400;
  font-size: 30px;
  color: #fff;
  text-shadow:
    0 0 1px #fff,
    0 0 20px #084baf,
    0 0 10px aqua,
    0 0 10px blue,
    0 0 60px aquamarine;
}

.mishima_p {
    font-size: 2rem;
    color: aqua;
    margin: 3% auto 5% auto;
}

.mishima_akumu {
    font-size: 1.5rem;
    color: aqua;
    margin-top: 3%;
    margin-bottom: 0;
    padding: 3% auto;
}

.aino_akumu {
    font-size: 1.5rem;
    color: yellow;
    margin-top: 3%;
    margin-bottom: 0;
    padding: 3% auto;
}

.mishima_mbti {
    font-size: 1.5rem;
    color: aqua;
    margin-top: 0;
    margin-bottom: 0;
    padding: 3% auto;
}

.aino_mbti {
    font-size: 1.5rem;
    color: yellow;
    margin-top: 0;
    margin-bottom: 0;
    padding: 3% auto;
}

.member_sns {
  padding-bottom: 3%;;
}

.aino {
  font-size: 3rem !important;
  padding: 0 auto 5% auto;
  margin-top: 0;
  margin-bottom: 0;
  font-weight: 400;
  font-size: 30px;
  color: #fff;
  text-shadow:
    0 0 1px #fff,
    0 0 20px yellow,
    0 0 10px palegoldenrod,
    0 0 10px yellowgreen,
    0 0 60px yellow;
}

.aino_p {
    font-size: 2rem;
    color: yellow;
    margin: 3% auto 5% auto;
}

.footer_span {
  text-align: center;
  margin: 2% 0 !important;
  background: linear-gradient(90deg, #000000, #727272);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.menu_span {
  color: #fff;
  font-size: 2em;
}


.header_logo {
    width: 15%;
}

* {
 box-sizing:border-box;
}

img,
video {
 max-width:100%;
 height:auto;
}

.member_SNSlist {
    display: flex;
    margin: 0 auto;
}

.member_li {
  flex: auto;
}

.showroom {
    margin: 0 auto;
    padding-bottom: 3%;
}

.showroom_img {
  width: 80%;
}

.mishima_haishin {
    font-size: 1.5rem;
    color: aqua;
    margin: 0 auto 2% auto;
}

.aino_haishin {
    font-size: 1.5rem;
    color: yellow;
    margin: 0 auto 2% auto;
}

.b {
  font-size: 1.4rem !important;
}

.mbti_text {
  color: antiquewhite;
  font-size: 1rem;
  margin-top: 0;
}

@media screen and (max-width:768px){
 .container {
   width:100%;
   padding:0;
 }

 .menu {
    padding-right: 0 !important;
 }

 .col2,
 .col4,
 .col6,
 .col8,
 .col12 {
   width:100%;
 }

 .member_box {
   width:100%;
   margin-top: 5% !important;
 }

 .schedule_span {
   font-size:14px;
 }

 .logo {
    margin: 0 auto;
    width: 80% !important;
 }

 .aboutus_wrap {
    flex-direction: column;
}

 .about_h1 {
    font-size: 3.5rem;
 }

 .mv_madoromi {
    top: 10%
 }

 .member_box {
    width: 90%;
 }

 .member_h1_text {
    margin-top: 0;
    margin-bottom: 0;
 }

 .scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.scrollbar::-webkit-scrollbar {
    display: none;
}

.showroom_img {
  width: 70%;
}

.member_img {
  width: 80%;
}

}