@charset "utf-8";
/* CSS Document */

body{
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-color: rgb(246, 251, 255);
}

.bg1{
  background-image: url(canlook.gif);
}
.bg2{
  background-image: url(cantlook.gif);
}
.bg3{
  background-image: url(cantlook.gif);
}
.bg4{
  background-image: url(cantlook.gif);
}
.bg5{
  background-image: url(cantlook.gif);
}
.bg6{
  background-image: url(cantlook.gif);
}
.bg7{
  background-image: url(cantlook.gif);
}
.bg8{
  background-image: url(cantlook.gif);
}
.bg9{
  background-image: url(cantlook.gif);
}
.bg10{
  background-image: url(cantlook.gif);
}
.bg11{
  background-image: url(cantlook.gif);
}
.bg12{
  background-image: url(cantlook.gif);
}
.bg13{
  background-image: url(cantlook.gif);
}
.bg14{
  background-image: url(cantlook.gif);
}
.bg15{
  background-image: url(cantlook.gif);
}
.bg16{
  background-image: url(cantlook.gif);
}
.bg17{
  background-image: url(cantlook.gif);
}
.bg18{
  background-image: url(cantlook.gif);
}
.bg19{
  background-image: url(cantlook.gif);
}
.bg20{
  background-image: url(cantlook.gif);
}



.all{
  z-index: 2
}

h1{
  width: 100%;
  background: rgb(216, 216, 216);
}

header{
  width: 100%;
  position: relative;
  height: 200px;
  top:0px;
}

header{
  background: url("tittle.png") center / cover;
  background-repeat: no-repeat;
}

.list{
  position: relative;
}

.list{
  position: absolute;
  bottom: 140px;
  right: 20px;
}

h3{
  font-size: 85px;
  width: 400px;
  height: 300px;
  text-align: right;
  margin-left: auto;
  line-height:130px;
}

h3 a{
  letter-spacing: 8px;
  color: rgb(5, 53, 56);
  opacity: 0.8;
  text-shadow:10px 13px 10px rgba(0, 0, 0, 0.486);
}


.video{
  display: inline-block;
}
.video:hover{
  transform: translate(4px,4px);
  text-shadow:6px 7px 7px rgba(0, 0, 0, 0.849);
}
.video:active{
  color: rgb(207, 0, 0);
  font-size:100px;
}

.music{
  display: inline-block;
}
.music:hover{
  transform: translate(4px,4px);
  text-shadow:6px 7px 7px rgba(0, 0, 0, 0.849);
}
.music:active{
  color: rgb(207, 0, 0);
  font-size:100px;
}

.sonota{
  display: inline-block;
}
.sonota:hover{
  transform: translate(4px,4px);
  text-shadow:6px 7px 7px rgba(0, 0, 0, 0.849);
}
.sonota:active{
  color: rgb(207, 0, 0);
  font-size:100px;
}


a{
  text-decoration: none;
}

.footer{
  width: 100%;
  height: 110px;
  background-color: rgb(31, 31, 31);
  position: absolute;
  bottom: 0px;
  left:0px;
  right:0px;
}

.form{
  width:70px;
  height:70px;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: absolute;
  margin: auto;
}


.formlogo{
  width: 70px;
  height: 70px;
  text-align: center;
}

.udspn_link a{
  color: rgb(255, 255, 255);
  padding-left: 15px;
}

.udspn_link a:hover{
  color: rgb(206, 0, 0);
}

.sns{
  position: absolute;
  bottom: 105px;
  left: -5px;
}

.sns li{
  display: inline-block;
  margin: 5px 3px;
}

.insta{
  width: 70px;
  height: 70px;
}
.insta:hover{
  transform: translateY(-10px);
}

.twitter{
  width: 70px;
  height: 70px;
}
.twitter:hover{
  transform: translateY(-10px);
}