@media (max-width: 768px) {
  .container-custom {
    width: 100%;
  }

  .container-custom .card {
    padding: 25px;

    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
  }

  .card-alasan-light,
  .card-alasan-dark {
    height: 158px;
    position: relative;
  }

  .circle-alasan {
    position: absolute;
    top: 15px;
    right: 15px;
  }

  .akademi h1 {
    font-size: 20px;
  }

  .card-akademi-1 h3,
  .card-akademi-2 h3 {
    font-size: 20px;
    line-height: 26px;
  }

  .jurnal-people {
    margin-top: 0;
  }

  .card-akademi-1 p,
  .card-akademi-2 p {
    font-size: 15px;
  }

  .card-akademi-1,
  .card-akademi-2 {
    height: auto;
  }

  .text-akademi {
    padding: 25px;
  }

  .gambar-akademi {
    text-align: center;
  }

  .gambar-akademi img {
    width: 100%;
  }

  .isi-berita p {
    font-size: 15px;
  }

  .img-detail-berita {
    height: 260px;
  }

  .detail-berita h1 {
    font-size: 20px;
  }

  .top-berita h1 {
    font-size: 20px;
    font-weight: 700;
  }

  .top-berita p {
    font-size: 15px;
  }

  .card-berita {
    height: 350px;
  }

  .card-berita .bungkus-img-berita img {
    height: 200px;
  }

  .card-berita .body-card {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .card-berita .content {
    padding: 0;
    margin: 0;
  }

  .card-berita h5 {
    font-size: 17px;
    margin-bottom: 30px;
  }

  #profil-perusahaan h1 {
    font-size: 20px;
  }

  #profil-perusahaan h5 {
    font-size: 15px;
  }
  #profil-perusahaan p {
    font-size: 14px;
  }

  .card-layanan-3 h1 {
    font-size: 20px;
  }
  .card-layanan-3 h5 {
    font-size: 15px;
  }
  .card-layanan-3 h6 {
    font-size: 20px;
  }

  .card-layanan-3 p {
    font-size: 14px;
  }

  .hero-m-1 {
    background: url("images/m-hero-1.png") center center;
    background-size: cover;
  }

  .px-m-5 {
    padding: 0 10px;
  }

  .mt-m-4 {
    margin-top: 28px;
  }

  .card-layanan-1 .top span {
    font-size: 12px;
  }

  .card-layanan-1 .top h2 {
    font-size: 20px !important;
  }
  .card-layanan-1 .bodi h5 {
    font-size: 20px;
  }
  .card-layanan-1 .bodi p {
    font-size: 14px;
  }

  .card-layanan-2 .top {
    text-align: center;
  }

  .accordion {
    box-shadow: 0 3.84px 3.84px #00000025;
  }

  .hero-m-2 {
    background: url("images/m-hero-2.png") center center;
    background-size: cover;
  }

  .sinopsis-data {
    text-align: center;
  }

  .hero-m-3 {
    background: url("images/m-hero-3.png") center center;
    background-size: cover;
  }

  .tombol-next-prev {
    display: none !important;
  }

  .card-solusi {
    display: flex;
    flex-direction: column;
    height: 100vh !important;
  }

  body {
    background-color: #f5f5f5;
  }

  #rating {
    margin-top: 20px;
  }

  .rating .card {
    box-shadow: none;
  }

  .tombol-secondary-2 {
    font-size: 14px;
  }

  .card-head-layanan .layanan-top p {
    font-size: 14px;
  }

  .card-head-layanan .love {
    width: 13px;
    height: 9.5px;
  }

  .card-head-layanan h3 {
    font-size: 20px !important;
  }

  .layanan-penerbit .card {
    background-color: white;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
  }

  #fatner .card {
    background-color: white;
  }

  .d3-pertanyaan {
    width: 30%;
  }

  .copyright {
    flex-direction: column;
  }

  .copyright p {
    margin-bottom: 10px;
  }

  .navbar .dropdown-menu {
    width: 100%;
  }

  #fatner-mobile {
    display: block;
  }

  #fatner-dekstop {
    display: none;
  }

  #search-mobile {
    display: block;
  }

  #form-search-dekstop {
    display: none;
  }

  .accordion-content li {
    width: 98%;
  }

  .accordion {
    width: 100%;
  }

  #menuSide {
    left: 0;
    width: 100%;
    top: 80px;
  }

  .card-alasan-light h5,
  .card-alasan-dark h5 {
    font-size: 15px;
  }

  .card-alasan-light p,
  .card-alasan-dark p {
    font-size: 13px;
  }

  .swiperHero h1 {
    font-size: 32px;
  }

  .swiperHero .p-1,
  .swiperHero .p-2 {
    font-size: 14px;
  }

  .d-none-mobile {
    display: none;
  }

  .d-none-dekstop {
    display: block;
  }

  .section-terbaik h1,
  .section-langkah h1 {
    font-size: 20px;
  }

  .section-terbaik p,
  .section-langkah p {
    font-size: 14px;
  }

  .rating h1 {
    font-size: 24px;
  }

  .rating p {
    font-size: 12px;
  }

  .title-section {
    font-size: 20px;
  }

  .sub-title-section {
    font-size: 14px;
  }

  .card-layanan .card-head-layanan p {
    font-size: 16px;
  }
  .card-layanan .card-head-layanan h3 {
    font-size: 24px;
  }

  /* Navbar */
  .navbar .tombol-primary {
    margin-top: 10px;
  }

  .navbar input[type="search"] {
    size: 100% !important;
  }

  /* Page Login */
  .sidebarLogin {
    display: none;
  }

  .formLogin h1 {
    font-size: 32px;
  }
}