@media screen and (max-width: 1715px) {
  .owl-carousel-stacked .owl-dots {
    height: 15rem;
    top: 15rem;
    padding-top: 3rem;
  }
  .abacus-text {
    top: 6rem;
    width: 40%;
    right: 4rem;
  }
  .navbar-nav {
    gap: 1rem;
  }
}

@media screen and (max-width: 1570px) {
  .finder-col-p {
    padding: 1rem;
  }
  .f-dokyo-blue-s {
    font-size: 1.5rem;
  }
  .f-dokyo-blue-b {
    font-size: 2rem;
  }
  .hero-col {
    padding-top: 6rem;
  }
}
@media screen and (max-width: 1500px) {
  .about-col-1,
  .about-col-2 {
    padding: 3rem;
  }
  .about-col-simple {
    padding: 3rem;
  }
  .test-image {
    width: 29% !important;
  }
}
@media screen and (max-width: 1400px) {
  .home-container {
    padding-top: 24rem !important;
  }
  .owl-carousel-stacked .owl-dots {
    height: 14rem;
    top: 13rem;
    padding-top: 3rem;
  }
}
@media screen and (max-width: 1300px) {
  .owl-carousel-stacked .owl-dots {
    height: 10rem;
    top: 13rem;
    padding-top: 3rem;
  }
  .container-margin {
    padding: 4rem 2rem;
  }
  .test-image {
    width: 27% !important;
  }
}
@media screen and (max-width: 1024px) {
  .owl-carousel-stacked .owl-dots {
    height: 11rem;
    top: 18rem;
    padding-top: 3rem;
  }
}
@media screen and (max-width: 1100px) {
  .container-margin {
    padding: 2rem;
  }
  .about-hero {
    margin-bottom: 14rem;
  }
  .finder-container-2 {
    top: -20rem;
  }
  .finder-container-3 {
    top: -4rem;
  }
  .finder-container {
    top: -1rem;
  }
  .nav-item {
    font-size: 0.75rem;
  }
  .about-container {
    padding-top: 7rem !important;
  }
  .about-title {
    font-size: 1.5rem !important;
  }
  .test-image {
    width: 28% !important;
  }
  .test-name {
    font-size: 1rem;
  }
  .hero-col {
    padding-top: 2rem;
  }
}
@media screen and (max-width: 994px) {
  .hero-container {
    background-size: 100% 72%;
  }
  .home-container {
    padding-top: 2rem;
  }
  .program-content {
    padding: 1rem 0rem;
  }
  .hero-col {
    padding-top: 1rem;
  }
  .owl-carousel-stacked .owl-dot {
    width: 1rem;
  }
  .container-margin {
    padding: 2rem;
  }
  .about-col-1,
  .about-col-2 {
    padding: 2rem;
  }
  .about-col-simple {
    padding: 0rem;
  }
  .about-content,
  .about-col-2 .about-content {
    line-height: 157%;
  }
  .col-1-content {
    font-size: 2.5rem;
    margin-top: 0rem;
  }
  .footer-li-social {
    justify-content: start;
  }
  .contact-finder-container {
    height: 20rem;
  }
  .owl-dot span {
    width: 1rem !important;
    margin-top: 3rem !important;
  }
  .test-col {
    min-height: 25rem;
  }
  .dropdown-item {
    font-size: 0.75rem;
  }
  .test-image {
    width: 22% !important;
  }
}
@media screen and (max-width: 890px) {
  .owl-carousel-stacked .owl-dots {
    height: 10rem;
    top: 16rem;
    padding-top: 3rem;
  }
  form.wpcf7-form {
    padding: 1rem 2rem;
    width: 100%;
  }
  #wpcf7-f158-o1 .wpcf7-form {
    padding: 1rem 2rem;
    width: 100%;
  }
  #wpcf7-f159-o1 .wpcf7-form {
    width: 100%;
  }
}
@media screen and (max-width: 800px) {
  .test-image {
    width: 13% !important;
  }
  .about-container {
    padding-top: 4rem !important;
  }
}
@media screen and (max-width: 769px) {
  .about-row-col {
    flex-direction: column;
  }
  .map-img {
    width: auto;
    height: auto;
  }
  .modal-body {
    padding: 1rem;
  }
  #results {
    margin: 0rem;
    padding: 1rem;
  }
  .owl-carousel-stacked .owl-dots {
    height: 11rem;
    top: 13rem;
    padding-top: 3rem;
  }
  .modal-dialog {
    max-width: 100%;
  }
  .finder-col {
    padding: 1rem;
  }
  .home-container {
    padding-top: 16rem !important;
  }
  .about-col-simple {
    min-height: 13rem;
  }
  .modal-dialog {
    margin: 1rem;
  }
}
@media screen and (max-width: 690px) {
  .owl-carousel-stacked .owl-dots {
    height: 9rem;
    top: 12rem;
  }
  .franchise-form {
    padding: 1.5rem;
  }
  .test-image {
    width: 15% !important;
  }
}
@media screen and (max-width: 600px) {
  .f-dokyo-blue-s {
    font-size: 1rem;
  }
  .f-dokyo-blue-b {
    font-size: 2rem;
  }
  .date-col:nth-child(1) {
    padding-right: 0rem;
  }
  .date-col:nth-child(3) {
    padding-left: 0rem;
  }
  .f-dokyo-title {
    font-size: 1.5rem;
  }
  .f-dokyo-title p {
    font-size: 1.5rem;
  }
  .program-norm {
    font-size: 2rem;
  }
  .program-bold {
    font-size: 3rem;
  }
  .program-title h2 {
    margin: 2rem;
  }
  .test-name {
    padding: 1rem 0rem;
    font-size: 1rem;
    padding-right: 1rem;
  }
  .test-image {
    width: 17% !important;
  }
  .research {
    font-size: 1.25rem;
    letter-spacing: 0.2rem;
  }
  .index-form {
    padding: 2rem 2rem;
  }
  .form-enroll-2 {
    width: 100%;
  }

  .about-col-1,
  .about-col-2,
  .about-col-simple {
    width: 100%;
    margin-top: 1rem;
    max-height: none;
    min-height: auto;
  }
  .f-heading {
    font-size: 1.25rem;
  }
  .f-heading p a {
    font-size: 1rem;
  }
  .footer-logo {
    width: 40%;
  }
  .navbar-brand img {
    width: 6rem;
  }
  .f-dokyo {
    font-size: 1.25rem;
  }
  p {
    font-size: 0.75rem;
  }
  .readmore-btn {
    padding: 0.5rem 1rem;
    border-radius: 2rem;
    font-size: 0.75rem;
  }
  .research-row {
    padding: 1.5rem;
  }
  .paper-title {
    font-size: 1rem;
    line-height: 1rem;
  }
  .research-arrow {
    width: 3rem;
  }
  .accordion {
    padding: 0rem;
  }
  .input-div {
    margin: 0.75rem 0rem;
  }
  .footer-list-3 {
    gap: 1rem;
  }
  .accordion-button {
    font-size: 0.75rem;
  }
  .accordion-body {
    font-size: 0.75rem;
    padding: 0rem 1rem 1rem 1rem;
  }
  .detail {
    font-size: 0.85rem;
  }
  .detail-2 {
    font-size: 0.85rem;
  }
  .detail-2 p {
    font-size: 0.85rem;
  }
  .label-title {
    font-size: 0.75rem;
  }
  .form-enroll {
    font-size: 0.75rem;
    padding: 0.8rem;
  }
  .form-enroll-2 {
    font-size: 0.75rem;
    padding: 0.8rem;
  }
  .girl-hero {
    width: 135%;
  }
  .brain-hero {
    width: 90%;
  }
  .abacus-text {
    top: 4rem;
    width: 49%;
    right: -1rem;
  }
  .about-text {
    display: none;
  }
  .about-text:first-child {
    display: block;
  }
  .col-1-text {
    font-size: 0.75rem;
  }
  .about-content {
    font-size: 0.75rem;
  }
  .about-title {
    font-size: 1rem !important;
    margin-bottom: 0.8rem;
  }
  .comic-content {
    text-align: left;
    line-height: 100%;
  }
  .why-ucmas-title {
    font-size: 1rem;
  }
  .why-ucmas-content {
    line-height: 100%;
  }
  .global-title {
    font-size: 2.5rem;
  }
  .global-content {
    line-height: 100%;
  }
  .f-subheading {
    font-size: 1rem;
  }
  .f-content p {
    font-size: 0.75rem;
  }
  .f-content {
    min-height: 8rem;
    padding: 1rem;
  }

  .blue-map {
    height: 10rem;
  }
  .about-hero {
    margin-bottom: 10rem;
  }
  .finder-container-2 {
    top: -14rem;
  }
  .finder-container-3 {
    top: -3rem;
  }
  .find-btn {
    font-size: 0.75rem;
  }
  .contact-finder-container {
    height: 14rem;
  }
  .owl-carousel-stacked .owl-dots {
    height: 7rem;
    top: 12rem;
  }
  .key-content {
    min-height: 14rem;
  }
}
@media screen and (max-width: 570px) {
  .owl-carousel-stacked .owl-dots {
    height: 8rem;
    top: 10rem;
  }
  .modal-div {
    width: 100%;
  }
  .test-image {
    width: 20% !important;
  }
}
@media screen and (max-width: 500px) {
  .test-image {
    width: 22% !important;
  }
}
@media screen and (max-width: 470px) {
  .owl-carousel-stacked .owl-dots {
    height: 7rem;
    top: 8rem;
    padding-top: 1rem;
  }
  .footer-logo {
    width: 40%;
    margin-bottom: 2rem;
  }
  .about-hero {
    margin-bottom: 11rem;
  }
  .footer-list-3 li a {
    font-size: 0.65rem;
  }
  .test-image {
    width: 25% !important;
  }
}
@media screen and (max-width: 400px) {
  .test-image {
    width: 28% !important;
  }
}
@media screen and (max-width: 360px) {
  .contact-finder-container {
    height: 16rem;
  }
}
@media screen and (min-width: 2000px) {
  .owl-carousel-stacked .owl-dots {
    height: 17rem;
    top: 22rem;
  }
}
