@charset "utf-8";
.header {
  position: fixed;
  z-index: 99;
  top: 3.5rem;
  width: 100%;
}
.header_inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 130rem;
  width: 90%;
  margin: auto;
}
.header_logo {
  display: block;
  transition: .3s;
}
.header_logo svg{
  width: 12rem;
  height: 2.4rem;
  fill: var(--color-white);
  transition: fill .3s ease;
}
.header_logo.hide {
  opacity: 0;
  visibility: hidden;
}
.header_menu {
  display: flex;
  align-items: center;
  gap: 5rem;
  width: 100%;
}
.header_list {
  display: flex;
  align-items: center;
  gap: 3.4rem;
}
.header_list_item_link {
  font-family: "Lato", sans-serif;
  font-size: 1.8rem;
  color: var(--color-white);
  letter-spacing: 0.1em;
  transition: color .3s ease;
}
.header_reserve_btn {
  font-family: "Lato", sans-serif;
  font-size: 1.45rem;
  color: var(--color-white);
  transition: color .3s ease;
  letter-spacing: 0.1em;
  width: 19rem;
  height: 5.2rem;
  border-radius: 100vmax;
  border: 1px solid var(--color-gray);
  position: relative;
  padding-right: 2.6rem;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  background-color: rgb(255 255 255 / .2);
  overflow: hidden;
}
.header_reserve_btn span {
  position: relative;
  z-index: 2;
  transition: all .6s;
}
.header_reserve_btn:hover span {
  color: #fff;
}
.header_reserve_btn:before {
  content: "";
  width: 1.3rem;
  height: 1.3rem;
  border-radius: 50%;
  background-color: var(--color-pink);
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 2.3rem;
  transform: translateY(-50%);
  transform-origin: center;
  /* transition-duration: .6s;
  transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); */
  transition: transform .6s cubic-bezier(0.77, 0, 0.175, 1);
  animation: blinkcircle 2.5s ease-in-out infinite;
  opacity: 1;
}
@keyframes blinkcircle {
  0%   { opacity: 1; }
  50%  { opacity: 0.2; }
  100% { opacity: 1; }
}
.header_reserve_btn:hover:before {
  /* width: 210%;
  height: 300%; */
  /* left: -2rem; */
  transform: translateY(-50%) scale(30);
  animation: none;
}
.header_link_box{
    display: flex;
    align-items: center;
    gap:30px;
    margin-left: auto;
}
.header_link_box .sns_icon{
    fill: var(--color-white);
    width: 2.3rem;
    height: 2.3rem;
    transition: fill .3s ease;
}
@media (max-width:767px) {
  .header {
    top: 1.5rem;
  }
  .header_inner {
    /* width: 35.3rem; */
    padding-right: 6.3rem;
  }
  .header_logo svg{
    width: 7rem;
  }
  .header_list {
    display: none;
  }
  .header_reserve_btn {
    font-size: 1.3rem;
    width: 15rem;
    height: 3.1rem;
    padding-right: 2rem;
  }
  .header_reserve_btn:before {
    width: .7rem;
    height: .7rem;
    left: 1.4rem;
  }
}
.header.passed .header_list_item_link,
.header.passed .header_reserve_btn{
  color: var(--color-green);
} 
.header.passed .header_link_box .sns_icon,
.header.passed .header_logo svg{
  fill: var(--color-green);
}
@media (max-width:480px) {
  .header_reserve_btn{
    display: none;
  }
}