@charset "UTF-8";
/* Body */
.isAnimate {
  opacity: 1;
}

html{
	 scroll-behavior: smooth;
}
body {
	font-size: 16px;
	color: #393939;
	 font-family: 'YakuHanJP','Roboto','Noto Sans JP',"Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "Hiragino Sans", "メイリオ","Noto Sans JP", Meiryo, sans-serif;
font-weight: 400;
	margin: 0px;
	font-style: normal;
}
body, div, p, h1, h2, h3, h4, ul, figure {
	margin: 0;
	padding: 0;
}
a{
	text-decoration: none;
}
p{
	flex-grow: 1;
}
/*========= waveを描画するエリア設定 ===============*/
.popup {
    display: none;
    height: 100vh;
    width: 100%;
    background: black;
    opacity: 0.7;
    position: fixed;
    top: 0;
    left: 0;
}
 
.popvideo{
    background: #fff;
    padding: 30px;
    width: 90%;
	z-index:200;
}
.show {
    display: flex;
    justify-content: center;
    align-items: center;
}

.wave{
  position: relative;
}

.wave canvas{
    position: absolute;
    bottom: 0;
    left:0;
    width: 100%;
	z-index:1;
}
.headline{
	width: 100%;
	margin: 50px auto 20px auto;
	padding: 0px auto;
	text-align: center;
}
.headline img{
	width:100%;
	margin: 0 auto;
}

.subheadline{
	width: 100%;
	margin: 10px auto;
	padding: 0px auto;
	text-align: center;
}
.subheadline img{
	width:75%;
	margin: 0 auto;
}

.Paper_v2 {
  background-image:
    repeating-linear-gradient(to bottom,
      transparent 25px,
      rgba(0, 0, 0, 0.04) 26px,  rgba(0, 0, 0, 0.04) 26px,
      transparent 27px,  transparent 51px, 
      rgba(0, 0, 0, 0.04) 52px,  rgba(0, 0, 0, 0.04) 52px,
      transparent 53px,  transparent 77px, 
      rgba(0, 0, 0, 0.04) 78px,  rgba(0, 0, 0, 0.04) 78px,
      transparent 79px,  transparent 103px, 
      rgba(0, 0, 0, 0.04) 104px,  rgba(0, 0, 0, 0.04) 104px,
      transparent 105px,  transparent 129px, 
      rgba(0, 0, 0, 0.04) 130px,  rgba(0, 0, 0, 0.04) 130px),

    repeating-linear-gradient(to right,
      transparent 25px,
      rgba(0, 0, 0, 0.04) 26px,  rgba(0, 0, 0, 0.04) 26px,
      transparent 27px,  transparent 51px, 
      rgba(0, 0, 0, 0.04) 52px,  rgba(0, 0, 0, 0.04) 52px,
      transparent 53px,  transparent 77px, 
      rgba(0, 0, 0, 0.04) 78px,  rgba(0, 0, 0, 0.04) 78px,
      transparent 79px,  transparent 103px, 
      rgba(0, 0, 0, 0.04) 104px,  rgba(0, 0, 0, 0.04) 104px,
      transparent 105px,  transparent 129px, 
      rgba(0, 0, 0, 0.04) 130px,  rgba(0, 0, 0, 0.04) 130px);
}


.bgset{
display: block;
}
.bg{
 position: fixed;
 top:0;
 min-width: 100%;
 min-height: 100%;
 width: 100vh;
 height: 100vh;
 z-index: -100;
    background: linear-gradient(-225deg, #00f 0%, #C5C1FF 56%, #ff00ff 100%);
}

.bg-videoeria{
 position: fixed;
 top: 0;
 right:0;
 width: 40%;
 height: 100vh;
 z-index: -50;
 background-size: cover;
}
#bg-video{
 position: absolute;
 width: 100%;
 height: 100%;
 z-index: -50;
	object-fit: cover;
	opacity: 1;
}
#bg-video-top{
 position: absolute;
 width: 100%;
 height: 100%;
 z-index: -50;
	object-fit: cover;
 opacity: 0.3;
}
#bg-video-music{
 position: absolute;
 right: 0;
 bottom: 0;
 min-width: auto;
 min-height: 100vh;
 width: auto;
 height: auto;
 z-index: -100;
 background: url('poster.jpg') no-repeat;
 object-fit: cover;
}

#bg-video-music2{
 position: absolute;
 width: auto;
 height: auto;
	aspect-rate:16/9;
 z-index: -50;
	object-fit: cover;
 opacity: 1;
}
.bg-texteria{
 position: fixed;
  top: 50%;
  left:0;
   margin-left: calc((25vw - 250px)/2);
  transform: translateY(-50%);
 width: 25vw;
 height: 50vh;
 z-index: -30;
  object-position: 50% center;
	overflow: hidden;
 background-size: cover;
	padding:auto;
}
.inner{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 80%;
  height: 50%;
	text-align: center;
}
.inner img{
	width:100%;
	height:auto;
}


.titlelogo {
	position: absolute;
	color: #fff;
	background-color:rgba(255, 255, 255, 1);
	border: #666 1px solid;
	text-align: center;
	width: 45%;
	top:50%;
	left: 50%;
	z-index:100;
	border-radius: 10%;
	transform: translate(-50%, -50%)
}
.titlelogo img{
	width:100%;
}

.topmenu{
	margin: 40px 0;
	padding: 0;
	position:absolute;
	width: 100%;
	left: 0;
	height: auto;
	z-index: 100;
}
.topmenu ul{
	margin-left:5%;
}
.topmenu ul li{
	height:auto;
	margin-bottom:20px;
	list-style:none;
	width: 60px;
	text-align: center;
	border:solid 1px;
	display: flex;
	aspect-ratio: 1 / 1;
	border-radius:15%;
}
.topmenu img{
	width: 0%;
  opacity : 0;
  transition : all 1.5s;
  transform : translate(0, 40px);
}
.open2 img{
  opacity : 1;
	width: 100%;
  transform : translate(0, 0);
}


.title_lyric{
	font-family: 'YakuHanJP',"Train One",'Noto Serif JP','Roboto','Noto Sans JP',"Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "Hiragino Sans", "メイリオ","Noto Sans JP", Meiryo, sans-serif;
	z-index: 500;
	position: absolute;
 -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
	width:auto;
	color:#00FFE0;
	top:0;
	right:30px;
	padding: 50px 3px 70px 3px;
	font-size: 1.5em;
	letter-spacing:0.15em;
	text-align: center;
	overflow: hidden;
	text-shadow: 0 0 5px #00FFE0,0 0 10px #00FFE0;
  transform : translate(0, -1000px);
  transition : all 3.5s;
	opacity: 1;
}
.open{
  transform : translate(0, 0);
}

.topslide {
	position: relative;
	background-color: #aaaaaa;
	text-align: center;
	width: auto;
	z-index:80;
	margin-top: -30px;
	margin-left: 120px;
	display:block;
	aspect-ratio: 3/5;
}
.push{
	width:100%;
	height:auto;
	margin: 0 auto 20px auto;
	padding: 0 auto;
	position:relative;
	text-align:center; 
}
.head_title{
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
	opacity: 0.75;
}
.head_title img{
	width: 100%;
}
.topfoot{
	position: absolute;
	width: 100%;
	height: auto;
	bottom:0;
}
.newmusic{
	display: flex;
	padding-bottom:30px;
	opacity: 1;
}
.newmusic_title{
	position: absolute;
	width: 100%;
	bottom: 0;
	left: 0;
	opacity: 0.3;
}
.newmusic_title img{
	width: 100%;
}
.nexttime{
	display: block;
	position: relative;
	width: 100%;
	height: auto;
	margin:0 auto;
	padding:0px auto;
	opacity: 1;
}
.nexttime p{
  font-family: "Big Shoulders Inline Display", sans-serif;
	position: relative;
	height: auto;
	text-align: center;
	margin: 0px auto 20px;
	padding: 20px auto;
	color: #00FFE0;
	font-weight: bold;
	background-color:rgba(0, 0, 0, 0);
	font-size: 2em;
	text-shadow: 0 0 10px #00FFE0,0 0 15px #00FFE0;
}

.topmusic {
	position:relative;
	background-color: #aaaaaa;
	text-align: center;
	width: 33%;
	height:auto;
	z-index:8;
	margin: 0px 8%;
	display:block;
	border-radius:50%;
	aspect-ratio: 1/1;
	overflow: hidden;
	object-fit: cover;
	opacity: 1;
	transition: all .2s;
}
.topmusic:hover{
	opacity: 0.5;
}

.scroll_container {
  height: 400vh;
}
 
.sticky_wrap {
  overflow: hidden;
  position: sticky;
  top: 0;
  height: 100vh;
}
 
.horizontal_scroll {
  position: absolute;
  top: 0;
  height: 100%;
  width: 400vw;
  will-change: transform;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.textbox{
	position: absolute;
	top: 50%;
	left: 50%;
	transform:translate(-50%, -50%);;
	width: auto;
	text-align: left;
	display:block;
}
.player_nowrap{
	white-space: nowrap;
	transform:skewX(0deg);
}
.player{
  font-family: "Big Shoulders Inline Display", sans-serif;
	display: inline-block;
	padding: 5px 15px;
	font-size: 1.3em;
	font-weight: bold;
	background-color:#111;
	color:#ccc;
	opacity: 0.9;
}

span.icon{
	position:absolute;
	top: 0;
	right: 0;
	font-size: 0.9em;
	font-weight: 900;
	width: 20%;
	height: auto;
	transform:skewX(0deg);
}
span.icon img{
	width: 100%;
}
.topmusic video{
	    width:100%;
	    height: 100%;
		object-fit: cover;
  object-position: 50% 50%;
		overflow: hidden;
		z-index: -1;
  transition : all 0.2s;
	z-index:-5;
}
.topmusic video:hover{
	
}
.topmusiclyric{
	 font-family: 'YakuHanJP','Noto Serif JP',"ヒラギノ角ゴ Pro W3", "Hiragino Sans",'Roboto','Noto Sans JP',"Hiragino Kaku Gothic ProN", "メイリオ","Noto Sans JP", Meiryo, sans-serif;
	position: relative;
	text-align: center;
	vertical-align:center;
	width: 35%;
  margin: 2% 5%;
	padding: 20px 0px;
}


.center{
	margin:20px auto;
	text-align: center;
	padding: 0 auto;
}
.storywrap{
	position: relative;
	top: 0;
	right:0;
	bottom: 0;
	left: 0;
	margin:auto;
	
}

.topsns {
	position: absolute;
	bottom:10px;
	right: 20px;
	transform: translate(0%, 0%);
	color: #fff;
	text-align: right;
	width:auto;
	height:auto;
	display: flex;
}
.sns{
	width: auto;
	height:auto;
	/*max-width: 70px;*/
	margin: 0 15px;
}
.sns img:hover {
	opacity: 0.7 ;
}
.sns img{
	width:100%;
	height:auto;
}

.video-box {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100vh;
}
video{
	  width: 100%;
	top: 0;
	left: 0;
  height: auto;
}
video .bg {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  height: auto;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -o-object-fit: cover;
     object-fit: cover;
}
.contents_wrap {
   display: flex;
   flex-wrap:nowrap;
	padding-top: 0%;
	height: auto;
	width:100%;
}
.contents{
	width: 100%;
	height: auto;
	margin: 0px auto 0px auto;
	padding: 50px auto;
	text-align: center;
	color:#fff;

}
.container_left {
	width: 100%;
	min-width: 600px;
	height: auto;
	background-color: transparent;
}

.container_left_content{
	position:fixed;
   padding: 20px 50px;               /* 余白指定 */
   top: 25vh;
	left:calc((100% - 1500px) / 2);/* 要素自体の半分、上と左にずらす */
	width:500px;
	height:500px;
  background: rgba(255, 255, 255, 0.3); /* 透明背景色 */
  border-radius: 20px; /* 角丸 */
  -webkit-box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); /* 影 */
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); /* 影 */
  -webkit-backdrop-filter: blur(10px); /* ぼかし */
  backdrop-filter: blur(10px); /* ぼかし */
  border: 1px solid rgba(255, 255, 255, 0.4); /* ボーダー */
    z-index: 4;
}

.container_right {
	min-width: 450px;
	height: auto;
	background-color: transparent;
}
.container_right_content{
	position: fixed;
	top:0;
	width:500px;
	height:100vh;
}
.right_menu{
	position: absolute;
	text-align: center;
	left:0;
	bottom:0;
	width:100%;
	height:auto;
	margin:0 auto;
	display: inline-block;
}
.right_menu ul{
	width: 40%;
	margin: 0 auto 30px 50px;
	padding: 0 auto;
	text-align: center;
}
.right_menu li{
	margin: 15px auto;
list-style:none;
}
.right_menu img
{
	width:100%;
transform: scale(1, 1);
  transition: all .3s;
}
.right_menu img:hover
{
	width:100%;
	transform: scale(1.5, 1.5)rotate(-15deg);
}

.container {
	width:500px;
	height: auto;
}
/*  border-left: 10px solid #4169e1;
    border-right: 10px solid #ff1493;
*/
/* About Section */
.text_column {
	width: 29%;
	text-align: justify;
	font-weight: lighter;
	line-height: 25px;
	float: left;
	padding-left: 20px;
	padding-right: 20px;
	color: #A3A3A3;
}

.topvis {
	position:relative;
	padding-top: 0px;
	height: auto;
	min-height: 100vh;
	width:100%;
	aspect-ratio:3/4;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 20px 0px;
		z-index: 1;
  border-top: 1px solid rgba(0, 0, 0, 0.8); /* ボーダー */
  border-bottom: 1px solid rgba(0, 0, 0, 0.8); /* ボーダー */
  background: rgba(10, 10, 10, 100); /* 透明背景色 */
  transform:skewY(-0deg);
  transform-origin: top left;
}
#topvis_bg{
 position: absolute;
 width: 100%;
 height: 100%;
 z-index: -50;
	object-fit: cover;
	opacity: 0;
}
.topvis-top {
	position:absolute;
	padding-top: 0%;
	z-index: -1;
	height: 50%;
	max-height: 350px;
	width:auto;
	background-color: #111;
  transform: skewY(0deg);
}
.minogashi{
	display:none;
}

.copyright {
	margin: 0;
	text-align: center;
	padding-top: 20px;
	padding-bottom: 20px;
	color: #000;
	font-weight: lighter;
	font-size:.9em;
	letter-spacing: 2px;
	border-top-width: 2px;

  background-color:#eee;
}

.hidden {
	display: none;
}

.navbox{
	width: 100%;
	height: auto;
    display: flex;
	justify-content: center;
	margin: -3px auto 100px auto;
	padding: 0px auto;
	max-width: 1200px;
}
.navmenu{
    transform-origin: 50% 0%;
	transform: rotate(15deg);
	width: 20%;
	height: auto;
	max-width: 180px;
	margin-left: 30px;
    animation: burabura2 linear 5s infinite;
}
.navmenu img{
	width: 100%;
}

.name{
	width:100%;
	z-index: 50;
	margin-top: 0px;
    border: 0px solid #666;
}
.name img{
	width: 100%;
  border: 0px solid #666;
}
.yaku{
	width:55%;
	z-index: 100;
	text-aligin: right;
	margin: -15% 0 0 auto;
    border: 0px solid #666;
}
.yaku img{
	width: 100%;
  border: 0px solid #666;
	transform: rotate(-8deg);
}

/*.btn,
a.btn,
button.btn {
  	font-size: calc(65% + 0.25vw);
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 0.5rem 2rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #333;
  background-color:#fff;
  border-radius: 0.5rem;
  margin-left: 5px;
font-family:"Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
}*/

.btn_b {
  	font-size: calc(65% + 0.25vw);
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 0.5rem 2rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #999;
  background-color:#aaa;
  border-radius: 0.5rem;
  margin-left: 5px;
font-family:"Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
}


a.btn-border {
  border-radius: 0;
}

a.btn-border:before,
a.btn-border:after {
  position: absolute;
  width: 100%;
  height: 2px;
  content: '';
  -webkit-transition: all .3s;
  transition: all .3s;
  background: #000;
}

a.btn-border:before {
  top: 0;
  left: 0;
}

a.btn-border:after {
  right: 0;
  bottom: 0;
}

a.btn-border:hover:before,
a.btn-border:hover:after {
  width: 0;
}
.btn_cover{
	text-align: center;
	margin: 50px auto;
	padding: 0px auto;
}
.bbb{
font-family:"Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-weight: 400;
	font-size: 1.5em;
}

a.btn-border-shadow {
  padding: calc(1.5rem - 12px) 3rem 1.5rem;

  background: #fff;
}

a.btn-border-shadow:before {
  position: absolute;
  top: -6px;
  left: -6px;

  width: 100%;
  height: 100%;

  content: "";
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;

  border: 3px solid #000;
  border-radius: 0.5rem;
}

a.btn-border-shadow:hover {
  padding: calc(1.5rem - 6px) 3rem;
}

a.btn-border-shadow:hover:before {
  top: 0;
  left: 0;
}

a.btn-border-shadow--color {
  border-radius: 0;
  background: yellow;
}

a.btn-border-shadow--color:before {
  border-radius: 0;
}





.intro_head{
		width: 100%;
	　　height:auto;
		margin: 0px auto 0 auto;
}
.intro_head img{
	width: 100%;
	margin: 0px;
	padding: 0px;
}
.intro{
	background: linear-gradient(-25deg, rgba(0,0,0,.8), rgba(0,0,0,.9));
	width: 100%;
	margin: 0px;
	text-align: center;
	padding: 30px auto;
}
.intro_end img{
	width: 100%;
	margin: 0px;
	padding: 0px;
}

.contents_color1{
	background-color:rgba(0, 0, 0, 0.4);
}
.contents_color2{
	background-color:#FFC4C8;
}

.bosyu_head{
	margin: 0 auto 30px auto;
    width:80%;
	max-width:1500px;
}
.bosyu_head2{
	display:none;
}
.header img{
	width: 100%;
}
.bosyu_head img{
	width: 100%;
}
.bosyu_head2 img{
	width: 100%;
}
.contents2{
	margin: 0px auto;
	text-align: center;
}
.contents h3{
	width: 70%;
	font-size: 1em;
	font-weight: 400;
	color: #111;
	white-space: normal;
	text-align: left;
	margin: 0 auto 50px auto;
	padding: 0 auto;
	letter-spacing: 0.01em;
	line-height: 2.5em;
	background-color:#fff;
	display: inline;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
#about_font{
	color:#111;
	background-color:none;
	padding: 3px;
}

.pill100 {
  height:0px;
  border: 2px dashed #fff;
  width: 100%;
text-align: center;
}
.pill {
  height:0px;
  border-radius: 2px;
  border: 2px dashed #fff;
  width: 80%;
	margin: auto;
text-align: center;
}
.item h2{
	font-weight: 500;
	color: #444;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
}
.item h3{
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
	font-weight: 400;
	color: #444;
}
.item2{
	padding: 2%;
	width: 32%;
	margin-bottom: 25px;
}

.item2 h2{
	font-weight: 500;
	color: #444;
}
.item2 h3{
	font-weight: 400;
	line-height: 2em;
	color: #444;
}
.item3{
	padding: 1%;
	width: 19%;
	margin-bottom: 15px;
}

.item3 h2{
	font-weight: 500;
	color: #444;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
}
.item3 h3{
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
	font-weight: 400;
	line-height: 2em;
	color: #444;
}
.item3 img{
	width:100%;
}
.smn_wrap{
		width: 100%;
	height: auto;
	aspect-ratio:16/9;
}
.smn_wrap iframe{
	width: 100%;
	height:100%;
}
.smn_0{
	width: 80%;
	margin:0px;
}
.smn{
	width: 80%;
	margin:30px auto 30px auto;
}
.flame{
	width: 100%;
	margin:0px auto 0px auto;
	padding:0px;
	 border-radius: 240px 15px 100px 15px / 15px 200px 15px 185px;
  border: 6px solid #666;
}
.item_main{
	padding: 2%;
	width: 95%;
	max-width:800px;
}
.item_main img{
	width: 100%;
	margin:0px;
	padding:0px;
 border-radius: 240px 15px 100px 15px / 15px 200px 15px 185px;
  border: 6px solid #666;
}
.list{
	padding: 5%;
 font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-weight:600;
}
h3{
	margin: 10px;
}
.left{
    width: 50%;
	padding: 5%;
	text-align: left;
	color: #fff;
	line-height: 1.5em;
	font-weight: normal;
}
.right h1{
	font-size: 1em;
	color: #444;
	font-weight: bold;
 font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
}
.right h4{
	font-size: 0.8em;
	color: #444;
	font-weight: normal;
}

.right{
	potision: relative;
    flex: 1;
	padding: 5%;
	text-align: left;
	color: #fff;
	line-height: 1.5em;
		font-weight: normal;
}
.news{
	margin-bottom: 2em;
}
.news a{
	color: #fff;
	
}
p.date{
	color: #888;
	font-size: 0.8em;
	margin-bottom: 0px;

}
.banner{
	width:65%;
	margin: 0px auto 0px;
	padding-top: 30px;
}
.banner img{
	transition: all .2s;
	width:100%;
}
.play_banner{
	width:45%;
	margin: 0px auto;
}
.play_banner img{
	transition: all .2s;
	width:100%;
}

.title_iraw {
  position: relative;
  display: inline-block;
  padding-right: 30px;
  color: #fff;
  text-decoration: none;
}
.title_iraw:after{
  content: '';
  width: 12px;
  height: 12px;
  border: 0;
  border-top: solid 2px #f2f2f2;
  border-right: solid 2px #f2f2f2;
  position: absolute;
  top: 50%;
  right: 0;
  margin-top: -10px;
  transform: rotate(45deg);
}

.info img{
	width: 100%;
	max-width: 800px;
	margin: 0px;
	padding: 0px;
}

.gallery{
	clera: both;
	display: inline-block;
	width: 100%;
	margin: 0 auto 75 auto;
	padding: 0 auto;
	max-width:1200px;
}
.smnbox{
  border-radius: 240px 15px 100px 15px / 15px 200px 15px 185px;
  border: 6px solid #666;
}

.photobox{
  border-radius: 240px 15px 100px 15px / 15px 200px 15px 185px;
  border: 6px solid #666;
}
.photobox2{
  border-radius: 240px 15px 100px 15px / 15px 200px 15px 185px;
  border: 6px solid #666;
}

.youtube_wrap{
	max-width: 600px;
	margin: auto;
}
.youtube{
  position:relative;
  width:100%;
  padding-top:56.25%;
	margin-bottom:25px;
}
.youtube iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}


@media screen and (max-height: 700px) {
.topvis {
	padding-top: 0%;
	height: 700px;
}
}

@media (max-width: 1600px){
	.container_left{
	width: 500px;
}
	.container_left_content{
	left:50px;
}
	.container_right {
		display: none;
	}
.contents{
	width: 100%;
	height: auto;
	padding: 50px auto;
	text-align: center;
	color:#fff;

}
}

@media  (max-width: 1100px) {

.container {
	width: 100%;
	min-width:100%;
	max-width:100%;
	margin: 0 auto;
	height: auto;
	border: none;
  box-shadow:none;
}
	.container_left {
		display: none;
	}
	.container_right {
		display: none;
	}
.bgset{
display: none;
}
	.minogashi{
		display:block;
	}
#bg-video-top{
		opacity: 0.5;
	}
#bg-video-music{
		opacity: 1;
	}
.text_column {
	width: 100%;
	display: block;
	text-align: left;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.topleft {
	font-size: 1em;
}

h3{
	margin: 1px;
	font-size: 1em;
}
.sns{
	width: auto;
	height:auto;
	/*max-width: 50px;*/
	margin: 0 10px;
}
.mainlogo {
	font-size: 1em;
	padding: 0px 10px;
}
.maintitle {
	color: #FFFFFF;
	text-align: center;
    position: absolute;
	bottom: 10%;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	width: 100%;
	font-size: 20px;
	animation: SlideIn 8.6s;
}
.maintitle > span {
  position: relative;
  display: inline-block;
  margin: 10px 0;
  font-size: calc(75% + 0.25vw);
}
.maintitle > span::before {
  content: "";
  position: absolute;
  bottom: -5px;
  left: -5px;
  top: -5px;
  right: -5px;
  background-color: rgba(0,0,0,0.8);
  z-index: -1;
	  animation: SlideIn 5.6s;
}
.info2{
	width:100%;
	margin: 20px auto;
	padding: 0 auto;
}
.info2 img{
width:95%;
	}
.smn{
	width: 95%;
	margin:10px auto 20px auto;
}
.smn_0{
	width: 95%;
	margin:0px auto;
}
.navbox{
		flex-wrap:wrap;
	width: 100%;
	margin-bottom: 10px;
	}
.navmenu{
	transform: rotate(0deg);
	width: 33%;
	height: auto;
	margin: 0 auto;
	padding: 0 auto;
    animation: none;
}
.bosyu_head{
	display:none;
}
.bosyu_head2{
	margin: 0 auto 10px auto;
    width:100%;
	display:block;
}
.photobox2{
	display:none;
	}
		.bosyu h1{
font-size: 1.3em;
}
	.bosyu h3{
font-size: 1em;
}
.info{
    display: block;
	width:100%;
	margin: 0 auto;
	padding: 0 auto;
}
.item{
	padding: 2%;
	width: 48%;
}
	
.item2{
	padding: 2%;
	width: 100%;
}
.item3{
	padding: 1%;
	width: 48%;
}
.left{
	width:90%;
	margin: 0 auto;
	padding: 0 auto;
	}

.footer_column {
	width: 100%;
}
	
		footer .footer_column h3 {
	color: #B3B3B3;
	text-align: center;
	margin:15px 0;
}
.yaku{
	width:55%;
	z-index: 100;
	text-aligin: right;
	margin: -15% 0 0 auto;
    border: 0px solid #666;
}
.yaku img{
	width: 100%;
  border: 0px solid #666;
	transform: rotate(-5deg);
}
}
/* CSSアニメーションの設定 */
@keyframes SlideIn {
  0% {
    opacity: 0;/*初期状態では透明に*/
    transform: translateX(64px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
 
@keyframes burabura {
0% { transform: rotate(0deg); }
15% { transform: rotate(-2deg); }
30% { transform: rotate(0deg); }
65% { transform: rotate(4deg); }
100% { transform: rotate(0deg); }
}
@keyframes burabura2 {
0% { transform: rotate(15deg); }
15% { transform: rotate(16deg); }
30% { transform: rotate(15deg); }
65% { transform: rotate(14deg); }
100% { transform: rotate(15deg); }
}
@keyframes burabura3 {
0% { transform: rotate(0deg); }
15% { transform: rotate(-1deg); }
30% { transform: rotate(0deg); }
65% { transform: rotate(2deg); }
100% { transform: rotate(0deg); }
}

@keyframes blur {
  0%   { filter: blur(0px); }
  10%   { filter: blur(3px); }
  30%   { filter: blur(0px); }
  40%   { filter: blur(1px); }
  50%   { filter: blur(0px); }
  60%   { filter: blur(2px); }
  80%   { filter: blur(0px); }
  90%   { filter: blur(1px); }
  100%   { filter: blur(0px); }
}
@keyframes blur2 {
  0%   { filter: blur(2px); }
  30%   { filter: blur(0px); }
  50%   { filter: blur(3px); }
  80%   { filter: blur(0px); }
  100%   { filter: blur(2px); }
}