@media (max-width: 600px) {
  html {
    font-size: 62.5%;
  }
  .home-text-zone h1 span {
    margin-left: -6px !important;
  }
  .home-text-zone h1 {
    line-height: 45px;
  }
  #char1::before {
    left: 4px;
  }
}
@media (max-width: 1050px) {
  #f-char {
    width: 15rem;
    right: 0;
  }
}
@media (max-width: 850px) {
  #f-char {
    display: none;
  }
}
@media (max-width: 400px) {
  .home-text-zone h1 {
    line-height: 4.5rem;
    letter-spacing: -2px;
  }
  html {
    font-size: 50%;
  }
  .home-scroll-down {
    bottom: 12.6rem;
  }
  .home-text-zone h1::before {
    top: -50px;
    left: -5px;
  }
  .home-text-zone h1::after {
    bottom: -10px;
    right: -50px;
  }
  #char1::before {
    left: 3px;
  }
  .home-text-zone .home-gray-text::before {
    top: -30px;
    left: -3px;
  }
  .home-text-zone .home-gray-text::after {
    bottom: -30px;
    left: -3px;
    letter-spacing: 3px;
  }
}

@media (max-width: 500px) {
  html {
    font-size: 58%;
  }

  .skills-text {
    min-width: 350px;
  }
}
@media (max-width: 400px) {
  html {
    font-size: 58%;
  }

  .skills-text {
    min-width: 290px;
  }
}