@media (min-width: 768px) and (max-width: 1024px) {
  .navRight .nav-item .nav-link span {
    font-size: 3rem;
  }
  .mainNav {
    flex-direction: column;
    align-items: center;
    padding: 1.5rem 2rem 0 2rem;
  }
  .mainNav .navbar-nav {
    flex-direction: row;
    flex-wrap: wrap;
  }
  .navRight .collapse:not(.show) {
    display: block;
  }
  main {
    overflow: hidden;
  }
  .introduction {
    padding: 1rem 1rem 10rem;
  }
  .interior .interiorDesc {
    width: 55%;
    padding: 0 6rem 4rem;
  }
  .introduction .introParag p {
    font-size: 1.2rem;
  }
  .introduction .introParag::before {
    height: 23rem;
    transform: rotate(11deg);
  }
  .services .videoBox {
    padding: 0;
  }

  .passenger {
    padding: 0 2rem 28rem;
  }
  .passenger .passengerTitle {
    padding: 0 2rem;
    font-size: 2.5rem;
  }
  .passenger .passengerDesc {
    width: 55%;
    padding: 3rem 3rem;
  }
  .firstSlider {
    padding: 2rem;
  }
  .firstSlider .firstSliderItems {
    padding: 4rem 1rem;
  }
  .interiorFurnishing .interiorFurnishingDesc {
    width: 40%;
    padding: 0rem 6rem;
  }
  .interiorFurnishing::after {
    bottom: -18rem;
    left: -57%;
  }
  .interiorFurnishing .interiorFurnishingMore {
    padding-right: 5rem;
  }
  .passenger .passengerDesc .desc{
    float: right
  }
  .GRP {
    padding: 0;
  }
  .GRP .GRPDesc {
    padding: 4rem 6rem 1rem 6rem;
  }
  .services .servicesDesc {
    padding: 0 2rem;
  }
  .network {
    padding: 4rem 0 2rem 0;
  }
  .secondSlider .secondSliderItems {
    padding: 1rem 0 3rem;
  }
  .secondSlider .swiper-button-next {
    right: 1rem;
  }
  .secondSlider .swiper-button-prev {
    left: 1rem;
  }
  .secondSlider {
    padding: 0 12rem 0;
  }
  .compartment .compartmentDesc {
    width: 60%;
    padding: 3rem 6rem;
  }
  .equipments {
    padding: 0rem 6rem;
  }
  .equipments .sectionTitle::before,
  .equipments .sectionTitle::after {
    width: 10rem;
  }
  .railcar {
    padding-bottom: 10rem;
  }
  .railcar::before {
    right: 4rem;
  }
  .railcar .railcarDesc {
    position: relative;
    width: 65%;
  }
  .railcar .railcarImage {
    padding: 0 3.5rem;
  }
  .railcar .railcarImage > div {
    flex-shrink: 0;
    height: 300px;
  }
  .services {
    position: relative;
    width: 100%;
    height: auto;
    background: linear-gradient(
      180deg,
      rgba(190, 197, 179, 1) 0%,
      rgba(219, 192, 156, 1) 100%
    );
    padding: 4rem 0 2rem;
  }
  .electrical .electricalDesc {
    padding: 2rem 6rem 2rem;
    text-align: center;
  }
  .electricalImg {
    padding: 0rem 5rem 0;
    justify-content: center;
  }
  .electricalImg > div {
    margin: 0 0.7rem;
  }
  .thirdSlider {
    padding: 2rem 7rem 0;
  }
  .network .networkDesc {
    width: 95%;
    margin-top: -6rem;
  }
  .airConditioning .airConditioningDesc {
    width: 100%;
    padding: 2rem 6rem 0 6rem;
    text-align: center;
  }
  .airConditioning::before {
    top: 3rem;
    right: -4rem;
  }
  .airConditioning {
    padding: 1rem 0 3rem 0;
  }
  .airConditioning .airConditioningImages {
    width: 90%;
    float: unset;
    margin: 0 auto;
    padding: 0 3rem;
  }
  .airConditioningImg {
    margin-top: -1rem;
  }
  .toiletSystem .toiletSystemDesc {
    order: 2;
    padding: 2rem 0 0 2rem;
    text-align: center;
    margin: 0 auto;
  }
  .toiletSystem .toiletSystemDesc .desc {
    padding-right: 0;
  }
  .toiletSystem .toiletSystemImg {
    order: 1;
  }
  .toiletSystem .toiletSystemImg {
    margin-top: 0.5rem;
  }
  .toiletSystem .toiletSystemImg > div {
    width: 55%;
    margin: 0 auto;
  }
  .toiletSystem .toiletSystemImges div {
    padding: 2rem;
  }
  .toiletSystem .toiletSystemImges {
    padding: 4rem 0 0;
  }
  .project {
    padding: 2rem 3rem;
  }
  .project .projectImage .leftProject::before {
    top: 3rem;
    left: 17rem;
  }
  .project .projectImage .rightProject::before {
    content: "";
    background-image: url(../image/logo/2.png);
    position: absolute;
    background-size: 22%;
    top: 4rem;
    left: 2rem;
  }
  .mainFooter {
    padding: 1rem;
  }
}