@charset "UTF-8";
/* CSS Document */
.top{
color: #8EB8FF;
font-family: vdl-logojrblack, sans-serif;
font-style: normal;
font-weight: 900;
letter-spacing: 5px;
text-align: center;
}

.title{
font-family: vdl-logojrblack, sans-serif;
font-weight: 900;
font-style: normal;
line-height: 1.5;
letter-spacing: 6px;
background-color: #8EB8FF;
color: #FFFFFF;
height:100px;
font-size: 20px;
 display: flex;
 align-items: center;
padding-left:20px;
}

.menu li{
font-family: "Cousine";
font-weight: 90;
float: left;
letter-spacing: 0;
font-size: 15px;
color: #FFFFFF;
margin: 30px;
text-align: center;
display: block;
}
.menu{
 margin-left: 40%;
}

.ichi{
background:#FFFFFF;
font-family:"YuGothic";
color:#000000;
width: 300px;
float: left;
margin-right: 15px;
margin:0 auto;
font-family: fot-tsukubrdgothic-std, sans-serif;
font-weight: 700;
font-style: normal;
letter-spacing: 5px;
line-height:25px;
}

.ni{
background: #FFFFFF;
font-family: "YuGothic";
color: #000000;
width: 300px;
float: right;
margin-left: 15px;
margin:0 auto;
font-family: fot-tsukubrdgothic-std, sans-serif;
font-weight: 700;
font-style: normal;
letter-spacing: 5px;
line-height:25px;
}

.work{
width: 630px;
position: absolute;
top: 285px;
left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
text-align: center;
}

img{
width: 250px;
height: 250px;
}

img:hover {
opacity: 0.5 ;
}


.kuuhaku{
height: 20px
}

li {
  list-style: none;
}

a {text-decoration: none;
color:black}
a:hover{
color:gray
}
.button{
text-align: right;
}