.slogan2 {
  display: none;
}

.head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 32px;

  .start {
    display: flex;
    align-items: center;
    gap: 80px;
    padding-left: 46px;
    padding-top: 32px;

    .slogan {
      padding-right: 20px;
    }
  }

  .end {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 420px;
    padding-right: 46px;
    padding-top: 32px;
  }
}

@media (max-width: 1300px) {
  .head {
    .start {
      padding-left: 32px;
      padding-top: 56px;
      gap: 48px;
      align-items: start;

      .logo > img {
        width: 187px;
      }

      .slogan {
        &:before {
          animation: lineShort 0.5s ease-in forwards;
        }

        & > img {
          width: 165px;
        }

        &:after {
          display: none;
        }
      }
    }

    .end {
      justify-content: end;
      padding-top: 0;

      .inst {
        display: none;
      }

      &:before, &:after {
        display: none;
      }
    }
  }
}

@media (max-width: 767px) {
  .slogan2 {
    display: block;
    padding-left: 116px;
    position: relative;

    &:before {
      content: " ";
      position: absolute;
      top: 50%;
      left: 0;
      height: 1px;
      background-color: rgba(255, 255, 255, 0.18);
      animation: lineLeft 0.5s ease-in forwards;
    }
  }

  .head {
    padding-bottom: 23px;

    & > .start {
      padding-left: 23px;
      padding-top: 30px;

      .slogan {
        display: none;
      }

      .logo > img {
        width: 97px;
      }
    }

    & > .end {
      padding-right: 23px;
    }
  }
}