@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Sawarabi+Mincho&display=swap');

html,body{
width:100%;
height:100%;
}

body:before{
  content:"";
  display:block;
  position:fixed;
  top:0;
  left:0;
  z-index:-1;
  width:100%;
  height:100vh;
  background:url(../pic/bg.jpg) left bottom no-repeat;
  background-size:cover;
}
body {
margin:0 auto;
padding:0;
font-size:13px;
line-height:200%;
font-family: '游ゴシック体', 'Yu Gothic', YuGothic, sans-serif;
font-weight: 500;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
color:#333333;
}


#scroll{
position:absolute;
bottom:30px;
left:50%;
transform: translateX(-50%);
-webkit- transform: translateX(-50%);
z-index:100;
}

* {
  padding: 0;
  margin: 0;
}

#top {
  width: 100%;
  height: 100vh;
  position: relative;
}

#info, #bio, #schedule, #works {
margin:0 auto;
padding:30px 0 200px 0;
width:100%;
z-index:100;
background-color:#ffffff;
}

.info, .bio, .schedule, .works {
margin:0 auto;
width:750px;
}

.title{
margin:0 auto 80px auto;
}
.titleimg{
width:120px;
margin:0 auto 30px auto;
}
.titleimg img{
width:100%;
}
.titletxt{
font-size:36px;
text-align:center;
font-family: 'Sawarabi Mincho', sans-serif;
}
.infotxt{
text-align:center;
margin-bottom:20px;
border-bottom:1px solid #cccccc;
}
.date{
background-color:#666666;
color:#ffffff;
padding:0 5px;
margin-right:10px;
font-family: 'Sawarabi Mincho', sans-serif;
}
.titletxt02{
font-size:20px;
border-bottom:7px solid #ffff00;
padding:0;
margin-bottom:30px;
font-family: 'Sawarabi Mincho', sans-serif;
}
.titletxt03{
background-color:#666666;
color:#ffffff;
padding:0;
margin-bottom:30px;
font-family: 'Sawarabi Mincho', sans-serif;
}


#slide01, #slide02, #slide03, #slide04{
margin:0 auto;
width:100%;
height:60%;
z-index:100;
filter:Alpha(Opacity=40);  -moz-opacity:0.4; opacity:0.4; -khtml-opacity:0.4;
}







/* メニュー */

#topmenu{
position:fixed;
width:300px;
top:30px;
left:30px;
text-align:left;
z-index:1000;
font-size:16px;
}
#topmenu img{
width:100%;
}
.txt{
font-weight:700;
padding:0 7px;
margin-right:3px;
background-color:#ffffff;
border-radius:5px;
}
ul{
margin:0;
padding:0;
}
li{
list-style-type:none;
margin-bottom:5px;
}

#logo2{
display:none;
}
.bio img{
border-radius:10px;
}

#schedulebox{
margin:0 auto;
padding:0;
display:flex;
flex-wrap: wrap;
align-content:flex-start;
list-style-type: none;
}
.schedulebox{
margin:0 0 30px 0;
padding:0;
width:246px;
}
.scheduletxt{
padding:0 10px;
line-height:150%;
}
.schedulebox img{
width:100%;
border-radius:10px;
}


#worksbox{
margin:0 auto 50px auto;
padding:0;
display:flex;
flex-wrap: wrap;
align-content:flex-start;
list-style-type: none;
}
.worksbox{
margin-bottom:30px;
padding:0;
width:150px;
}
.workstxt{
font-size:12px;
padding:0 10px;
line-height:150%;
}
.worksbox img{
width:100%;
border-radius:10px;
}
.artist{
border-bottom:1px solid #cccccc;
}



a:hover img{
box-shadow: 10px 10px 10px rgba(0,0,0,0.2);
transform:scale(1.2,1.2);
transition-duration: 0.6s;
z-index: 10;  
}

.left img{
border-radius:10px;
}



a img{border:none;}
a{text-decoration:none;}

a:link{color:#0098D0;}
a:visited{color:#0098D0;}
a:hover{color:#333333;}
a:active{color:#0098D0;}





/* modaal */

#schedulecontent{
margin:0 auto;
z-index:300;
position:fixed;
}

.content{
margin:0 auto;
width:80%;
padding:20px 0;
display:flex;
justify-content:space-between;
text-align:left;
}
.left{
width:49%;
}
.right{
width:49%;
}
.left img{
width:100%;
}
.contenttxt{
padding:20px;
}




#accordion p{
	cursor: pointer
}
.price {
	display:none;
	margin-bottom:30px;
}
.accordiontitle{
background-color:#666666;
color:#ffffff;
padding:0 5px;
margin-bottom:20px;
}
.workstitle{
font-size:18px;
margin-bottom:30px;
border-bottom:1px solid #999999;
font-family: 'Sawarabi Mincho', sans-serif;
}


.movieflex{
display:flex;
flex-wrap: wrap;
align-content:flex-start;
margin-bottom:50px;
}
.movie{
margin-bottom:30px;
width:250px;
}
.youtube iframe{
border-radius:10px;
}



#footer{
margin:0 auto;
padding:100px 0;
width:100%;
text-align:center;
background-color:#ffffff;
}

.footerimg{
width:200px;
margin:0 auto 30px auto;
}
.footerimg img{
width:100%;
}

#topcontrol{
z-index:1000;
}