header {
  position: fixed;
}

.header_wrapper {
  position: relative;
}

.header_back_pc {
  width: 157rem;
  height: auto;
  position:absolute;
  top: -42.8rem;
  left: -17.7rem;
  z-index:997;
  pointer-events: none;
}

.header_back_sp {
  display:none;
}

.logosiro {
  position: absolute;
  top: 1rem;
  left: 1rem;
  width: 38.1rem;
  height: auto;
  z-index: 998;
}

/* ボタンのスタイル */
.hamburger {
  position:absolute;
  top: 5rem;
  left: 115rem;
  width: 8rem;
  height: 8rem;
  border-radius: 4rem;
  background-color: #febe23;
  cursor: pointer;
  transition: transform 0.5s ease;
  z-index: 9998;
  padding-top: 1.8rem;
}

.hamburger span {
  display: block;
  height: 0.3rem;
  width: 4rem;
  background-color: white;
  transition: all 0.3s;
  z-index: 9999;
  margin: 1rem auto;
}

.hamburger.active span:nth-child(1) { 
  transform: rotate(45deg) translate(0.9rem, 0.9rem);
  width: 6rem;
}
.hamburger.active span:nth-child(2) {
  opacity: 0;
}
.hamburger.active span:nth-child(3) {
  transform: rotate(-45deg) translate(0.9rem, -0.9rem);
  width: 6rem;
} 

.hamburger_menu{
  background-image: url(../img/hamburger_menu.png);
  background-repeat: no-repeat; /* 画像を繰り返さない */
  background-position: top -2vh left -1vh;
  background-size: cover;
  position: fixed;
  top: 0;
  right: -105%;
  width: 44.736vh;
  height: 110vh;
  transition: right 0.5s ease; /* スライドインのアニメーション */
  padding: 25vh 2vh; 
  z-index: 999;
  font-weight: bold;
}
  
.hamburger_menu.open {
  right: 0;
}

.logosiro_menu {
  width: 26.325vh;
  height: 6vh;
  margin-left: -8.3vh;
  margin-bottom: -0.2vh;
}

.hamburger_menu_wrapper {
  width: 18vh;
  margin-left: 19.7vh;
}

.hamburger_menu_item {
  width: 18vh;
  height: auto; 
  margin-top: 3.1vh;
}

.hamburger_hover {
  display: none;
}

.item2:hover .hamburger_about_hover{
  display: block;
  margin-top: -0.6vh;
}

.item3:hover .hamburger_company_hover{
  display: block;
  margin-top: -0.6vh;
}

.item4:hover .hamburger_request_hover{
  display: block;
  margin-top: -0.6vh;
}

.item5:hover .hamburger_assessment_hover{
  display: block;
  margin-top: -0.6vh;
}

.item6:hover .hamburger_contact_hover{
  display: block;
  margin-top: -0.6vh;
}

.hamburger_item:hover .hamburger_text{
  margin-top: -0.1vh;
} 


.hamburger_text{
  font-family: 'Noto Sans JP';
  font-size: 1.5vh;
  letter-spacing: -0.05em;
  line-height: 1.4em;
  text-align: center;
  color: white;
}

.about_text, .company_text, .request_text, .assessment_text, .contact_text {
  margin-top: -0.3vh;
}

footer {
  background-image: url('../img/footer.png');
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 6.257rem;
  height: 19.6rem;
  display:flex;
}

.footer_logo {
  width: auto;
  height: 10rem;
  padding-right: 6.5rem;
  padding-left: 5rem;
  margin-bottom: 3.243rem;
  border-right: 1px solid black;
}

.name_address {
  display: flex;
}

.name {
  font-family: 'Noto Sans JP';
  font-weight: bold;
  font-size: 2.8rem;
  margin-left: 2.8rem;
  color: #333333;
  width: 15rem;
  text-align:center;
  margin-top: 2.3rem;
}

.name span {
  display: block;
  font-family: 'Noto Sans JP';
  font-weight: bold;
  color: #333333;
  font-size: 1.4rem;
  margin-bottom: -0.6rem;
  text-align: center;
}

.address {
  margin-left: 1.5rem;
  font-family: 'Noto Sans JP';
  font-size: 1.2rem;
  line-height: 1.67em;
  margin-top: 3.2rem;
}

.copyright{
  font-size: 1.2rem;
  font-family: 'Noto Sans JP';
  margin-left: 5.5rem;
  margin-top: 8.7rem;
}

.gotop_img{
  position:fixed;
  top: 85vh;
  right: 5rem;
  width: 8.6rem;
  height: auto;
  z-index: 1;
}

@media screen and (max-width: 680px) {
  .header_back_pc {
    display: none;
  }

  .header_back_sp {
    display: block;
    width: 41.3rem;
    height: auto;
    position:absolute;
    top: -7.8rem;
    left: -4.2rem;
    z-index:997;
  }

  .logosiro {
    width: 15rem;
  }

  .hamburger {
    top: 1rem;
    right: 1rem;
    left: 30.5rem;
    width: 6rem;
    height: 6rem;
    border-radius: 3rem;
    padding-top: 0.4rem;
  }
  
  .hamburger span {
    height: 0.2rem;
    width: 3.9rem;
    margin: 1.1rem auto;
  }
  
  .hamburger.active span:nth-child(1) { 
    /* transform: rotate(45deg) translate(0.9rem, 0.9rem); */
    width: 4.18rem;
  }
  .hamburger.active span:nth-child(2) {
    opacity: 0;
  }
  .hamburger.active span:nth-child(3) {
    /* transform: rotate(-45deg) translate(0.9rem, -0.9rem); */
    width: 4.18rem;
  } 

.hamburger_menu{
  background-image: url(../img/hamburger_menu_sp.png);
  background-position: top 0 left 0;
  background-size: cover;
  top: 0;
  /* right: -1%; */
  /* right: -105%; */
  right: -200%;
  width: 95vw;
  height: 101%;
  transition: right 0.5s ease; /* スライドインのアニメーション */
  padding: 16.4vh 3rem; 
  z-index: 999;
}
  
.hamburger_menu.open {
  /* right: 0; */
  right: -1%;
}

.logosiro_menu {
  width: 19rem;
  height: auto;
  margin-left: -3.5rem;
  margin-bottom: 0.27rem;
}

.hamburger_menu_wrapper {
  width: 15rem;
  margin-left: calc(95vw - 15rem)/2;
}

.hamburger_menu_item {
  width: 15rem;
  /* margin-top: 5.07vh; */
  margin-top: 5.1vh;
}

.hamburger_hover {
  display: none;
}

.item2:hover .hamburger_about_hover{
  display: block;
  width:15rem;
  margin-top: -0.3rem;
}

.item2:hover .about_text{
  margin-top: -0.03rem;
} 

.item3:hover .hamburger_company_hover{
  display: block;
  width:15rem;
  margin-top: -0.2rem;
}

.item3:hover .company_text{
  margin-top: -0.12rem;
} 

.item4:hover .hamburger_request_hover{
  display: block;
  width:15rem;
  margin-top: -0.2rem;
}

.item4:hover .request_text{
  margin-top: -0.13rem;
} 

.item5:hover .hamburger_assessment_hover{
  display: block;
  width:15rem;
  margin-top: -0.2rem;
}

.item5:hover .assessment_text{
  margin-top: -0.12rem;
}

.item6:hover .hamburger_contact_hover{
  display: block;
  width:15rem;
  margin-top: -0.2rem;
}

.item6:hover .contact_text{
  margin-top: -0.13rem;
} 

.hamburger_text{
  font-size: 1.6rem;
}

.about_text{
  margin-top: 0rem;
}

.company_text{
  margin-top: 0rem;
}

.request_text{
  margin-top: 0;
}

.assessment_text {
  margin-top: 0;
}

.contact_text {
  margin-top: 0;
}

  footer {
    background-image: url('../img/footer_sp.png');
    padding-top: 2.9rem;
    flex-direction: column;
    height: 20.405rem;
  }

  .footer_logo {
    display: block;
    width: 29rem;
    height: auto;
    margin: 0 auto;
    border-right: none;
    padding: 0;
  }
  
  .name_address{
    margin-top: -1.45rem;
  }

  .name {
    font-size: 2.8rem;
    margin-left: 3.15rem;
    width: 14.9rem;
    text-align:center;
    /* margin-top: 2.4rem; */
  }
  
  .name span {
    width: 14.9rem;
    text-align: left;
    margin-left: -0.2rem; 
  }
  
  .address {
    margin-left: 0.6rem;
    margin-top: 3.1rem;
  }
  
  .copyright{
    margin-left: 3.2rem;
    margin-top: 0;
  }

  .gotop_img {
    top: 85vh;
    right: 3rem;
    width: 5rem;
  }
}

/* 
 * 共通パーツ 
 */

/* ぼかし */
.blur{
  transition: all 1s;
  filter: blur(0.5rem);
}
/* ぼかし外し */
.blur.scrollin{
  filter: blur(0);
}
/* フェードイン */
.fade_out{
  opacity: 0;
  transition: 1s;
}
.fade_out.fade_in{
  opacity: 1;
}

.word_fadeup{
  overflow: hidden;
  opacity: 0;
  transform: matrix(1, 0, 0, 1, 0, 100);
  transition: 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}
.in{
  opacity: 1;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

@media screen and (max-width: 680px){
  .blur{
    transition: all 0.2s;
  }
}