@charset "UTF-8"; 



h2 {
  position: static;
}
body{
  background-color: black;
}

@media screen and (max-width: 480px){
  #slide_img{
    margin-top: 20vh;
  }
  .small{
    font-size: xx-small;
  }
  .inquiry{
    font-size:xx-small;
    width: 300px;
    height: 400px;
  }
}

h5{
  margin-top: 5px;
  margin-bottom: 5px;
}
#slide_img{
  width: 60vw;
  height: auto;
  position: relative;
  left:30vw;
  z-index: -1;
}
.slideshow-container{
  font-family: 'Yu Mincho','serif','Palatino Linotype'; 
  position: absolute;
  display: block;
  color: silver;
  font-size: clamp(5px,3vw,20px);
  top: 20%;
  text-shadow: 2px 2px rgba(22, 3, 116, 0.655);
}
#midashi{
  margin-left: max(0px, 25vw) ;
}

#tab{
  top:5%;
  position: fixed;
  width: 90vw;
  z-index: 100;
  display: flex;
  justify-content: space-between;
  margin: auto;
  margin-left: 5vw;
  margin-right: 5vw;
}

button{
  height: 10%;
  color: aliceblue;
  width: 12vw;
  font-size: 2vw;
}
#tabid{
  background-color: rgb(51, 46, 129);
}
#gyarally{
  background-color: rgb(82, 67, 29);
}
#difference{
  background-color: rgb(111, 7, 26);
  width:20vw;
}
#contact{
  background-color: rgb(87, 87, 87);
}
.wrapper {
  display: none;
} 
.wht{
  margin-bottom: 15px;
  background: linear-gradient(180deg, rgba(64, 6, 200, 0.903), rgba(0, 0, 0, 0.595));
} 
.wht h3{
  color:rgb(227, 222, 94);
}
.wht p{
  color:white;
}
.wrapper.active {
  display: flex;
  display: block;
  position:absolute;
  transform: none;
  width:100%;
  z-index: 2;
  top:50%;  
}

#gyarally-content{
  background-color: rgba(82, 67, 29, 0.971);
}
figure{
  margin: 0%;
  padding: 0;
  font-size: xx-small;
}

.gallery{
  display: flex;
  list-style: none;
  flex-wrap: wrap; 
  text-align: center;  
  justify-content: space-evenly;
}

.gallery img{
  width: 190px;
} 
.sword-photowindow{
  width:200px;
}
.sword-photo{
  display: none;
}

.gallerynames{
  color: silver;
  font-size: clamp(2px, 15px, 30px);
}
li{
  margin-bottom: 25%;
}
.sales{
  color:white;
  margin-left: 5%;
  margin-top: 5%;
  margin-bottom: 10%;
}
#difference-content.active {
  display: block;
  width:100%;
  height: auto;
  background-color: #4f0303df;
  color:silver;
}
#difference-content article {
  width: 100%;
  color:silver;
}

#difference-content .article-title {
  font-size: 1rem;
  margin: 10px 0 15px 0;
}
.difference-article{
  margin-top: 5%;
}

#contact-content.wrapper {
  width: 100%;
  margin: auto;
}
.contact{
  text-align: center;
}
.form-backgroundImage{
  background-color:rgb(153, 153, 153);
  color: white;
  height:100vh;
  align-items: center;
}

.small{
  color: white;
  display: flex;
  justify-content: center;
  bottom: 2%;
  position: fixed;
}