@media (max-width: 1024px) {
  html {
    font-size: 3vw;
  }

  body {
    font-family: "Lucida Grande", "Malgun Gothic", sans-serif;
    letter-spacing: 1px;
    line-height: 1.8;
    margin: 0;
  }

  header {
    background: white 0 0 no-repeat padding-box;
    height: 15.2vw;
    left: 0;
    opacity: 1;
    position: absolute;
    top: 0;
    width: 100vw;
  }

  main {
    left: 0;
    position: absolute;
    top: 15vw;
  }

  footer {
    bottom: 5vw;
    position: fixed;
    width: 100vw;
  }

  p {
    margin: 0;
  }

  img {
    border: none;
  }

  .hamburger-icon {
    height: auto;
    left: 7vw;
    opacity: 1;
    position: absolute;
    top: 3.5vw;
    width: 7.5vw;
  }

  .main-logo {
    height: auto;
    opacity: 1;
    position: absolute;
    right: calc((100vw - 16vw - 68vw) / 2);
    top: 2.4vw;
    width: 68vw;
  }

  .site-logo {
    color: black;
    font-family: 'Bodoni Moda', serif;
    font-size: calc(100 / 1200 * 100vw);
    height: auto;
    line-height: initial;
    opacity: 1;
    position: absolute;
    right: calc((100vw - 16vw - 68vw) / 2);
    text-decoration: none;
    top: calc(5 / 1200 * 100vw);
  }

  .site-logo:hover {
    color: black;
    text-decoration: none;
  }

  .menu-area {
    background-color: #000000f0;
    display: none;
    height: 100vh;
    left: 0;
    line-height: 1;
    overflow: auto;
    position: fixed;
    top: 0;
    width: 100vw;
    z-index: 1;
  }

  .menu-close {
    color: white;
    font-size: 13vw;
    left: 5.5vw;
    position: relative;
  }

  .menu-logo-area {
    margin: 7vw auto;
    text-align: center;
    width: 100vw;
  }

  .menu-logo {
    color: white;
    font-family: 'Bodoni Moda', serif;
    font-size: calc(75 / 1200 * 100vw);
    height: auto;
    width: 100vw;
  }

  .menu-link-area {
    margin: 8vw auto;
    text-align: center;
    width: 50%;
  }

  a.menu-link:link,
  a.menu-link:visited,
  a.menu-link:hover,
  a.menu-link:active {
    color: white;
    text-decoration: none;
  }

  .menu-title {
    font-family: 'Oswald', sans-serif;
    font-size: 6vw;
    font-weight: normal;
    letter-spacing: calc(8 / 1200 * 100vw);
    opacity: 1;
    text-align: center;
  }

  .menu-sub-title {
    font-size: 2vw;
    letter-spacing: 2px;
    position: relative;
    text-align: center;
    top: 1vw;
  }

  body.fixed {
    position: fixed;
  }

  .line-recruit-area {
    background: white 0 0 no-repeat padding-box;
    border: solid 1px black;
    border-radius: 45px;
    height: 17vw;
    line-height: 1.5;
    margin: auto;
    opacity: 1;
    position: relative;
    text-align: center;
    width: 95vw;
  }

  .line-recruit-icon {
    height: auto;
    position: relative;
    top: 2vw;
    width: 6vw;
  }

  .line-recruit-icon-text {
    color: black;
    font-size: 3.5vw;
    font-weight: bold;
    letter-spacing: 1.57px;
    position: relative;
    top: 0;
  }

  .line-recruit-text {
    color: black;
    font-size: 3vw;
    padding-top: 0.5vw;
  }

  .copyright {
    color: black;
    font-size: 1.87vw;
    position: relative;
    right: 3.5vw;
    text-align: right;
    top: -1vw;
  }

  .sp-none {
    display: none;
  }

  .sp-show {
    display: block;
  }

  .mt-0 {
    margin-top: 0;
  }

  .modal {
    display: none;
    height: 100vh;
    position: fixed;
    top: 0;
    width: 100%;
  }

  .modal-content {
    background: white;
    left: 50%;
    padding: 2vw;
    position: absolute;
    top: 40%;
    transform: translate(-50%, -50%);
    width: 60%;
  }

  .modal-bg {
    background: rgba(0, 0, 0, 0.8);
    height: 100vh;
    position: absolute;
    width: 100%;
  }

  .modal-img {
    width: 100%;
  }

  .modal-info-area {
    padding-bottom: 0.44vw;
    position: relative;
    top: -2vw;
    z-index: 10;
  }

  .modal-name {
    background-color: black;
    color: white;
    font-size: 3.73vw;
    font-weight: bold;
    padding: 1.6vw 0 1.6vw 3.2vw;
    position: relative;
  }

  .modal-catchcopy {
    font-size: 2.93vw;
    font-weight: bold;
    margin-top: 1.6vw;
    position: relative;
  }

  .modal-sns-area {
    -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
    align-items: center; /* 縦方向中央揃え */
    display: -webkit-flex;
    display: flex;
    padding: 1vw 0;
  }

  .modal-sns-icon {
    height: 7.73vw;
    width: 7.73vw;
  }

  .modal-sns-follower {
    font-size: 3.2vw;
    left: 1.33vw;
    position: relative;
  }

  .display-none {
    display: none;
  }

  .d-block {
    display: block;
  }
}