/*------------------------------------------------------------
	Clearfix
------------------------------------------------------------*/
/*------------------------------------------------------------
	Font
------------------------------------------------------------*/
/*------------------------------------------------------------
	Media
------------------------------------------------------------*/
/*------------------------------------------------------------
	Flex Box
------------------------------------------------------------*/
:root {
  --font-pri: "Mulish", sans-serif;
  --footer-bg-color: #fff;
  --footer-clr-text: $color-text;
  --foter-clr-text-cpr: #fafafa;
  --z-i-header: 100; }

.partner {
  overflow: hidden; }
  .partner .tab-list {
    display: flex;
    align-items: center;
    gap: 2.4rem;
    margin-bottom: 4rem;
    flex-wrap: nowrap;
    overflow: auto hidden; }
    .partner .tab-list::-webkit-scrollbar {
      display: none; }
    @media screen and (max-width: 992px) {
      .partner .tab-list {
        gap: 1.6rem; } }
    @media screen and (max-width: 576px) {
      .partner .tab-list {
        gap: 0.8rem;
        margin-bottom: 2.4rem; } }
  .partner .tab-item {
    white-space: nowrap;
    padding: 1.2rem 2.4rem;
    border: 1px solid transparent;
    transition: 0.3s ease;
    border-radius: 0.4rem;
    color: #71717a;
    cursor: pointer; }
    .partner .tab-item.is-active {
      border-color: #0c4da2;
      color: #27272a;
      pointer-events: none; }
    .partner .tab-item:hover {
      border-color: #0c4da2;
      color: #27272a; }
    @media screen and (max-width: 992px) {
      .partner .tab-item {
        padding: 1.2rem; } }
    @media screen and (max-width: 576px) {
      .partner .tab-item {
        padding: 0.4rem 0.8rem; } }
  .partner .pagination {
    margin-top: 3.2rem; }

.flag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 3.2rem; }
  @media screen and (max-width: 576px) {
    .flag-list {
      gap: 2.4rem 1.6rem; } }

.flag-item {
  width: calc(100% / 3 - 3.2rem * 2 / 3); }
  @media screen and (max-width: 992px) {
    .flag-item {
      width: calc(50% - 1.6rem); } }
  @media screen and (max-width: 576px) {
    .flag-item {
      width: calc(50% - 0.8rem); } }

.flag-inner {
  display: block;
  border-radius: 1.2rem;
  overflow: hidden;
  border: 1px solid #e4e4e7;
  height: 100%;
  transition: 0.3s ease; }

.flag-content {
  padding: 2.4rem 2rem 2rem;
  font-size: 2.4rem;
  font-weight: 700;
  color: #18181b;
  line-height: 1.5; }
  @media only screen and (max-width: 1200px) {
    .flag-content {
      font-size: 2.2rem; } }
  @media only screen and (max-width: 800px) {
    .flag-content {
      font-size: 2rem; } }
  @media screen and (max-width: 575px) {
    .flag-content {
      font-size: 1.8rem; } }

.flag-img {
  aspect-ratio: 38.4/25.5;
  max-width: 100%;
  display: flex;
  align-items: center;
  justify-content: center; }
  .flag-img img {
    height: 100%;
    width: auto; }

.relative {
  overflow: hidden;
  padding-bottom: 12rem; }
  @media screen and (max-width: 1024px) {
    .relative {
      padding-bottom: 6rem; } }
  @media screen and (max-width: 576px) {
    .relative {
      padding-top: 0;
      padding-bottom: 4rem; } }

.relative-slide {
  margin-top: 4rem;
  margin-right: -1.6rem;
  margin-left: -1.6rem; }
  @media screen and (max-width: 576px) {
    .relative-slide {
      margin-top: 2.4rem; } }
  .relative-slide .swiper-slide {
    width: calc(100% / 3);
    padding: 0 1.6rem; }
  @media screen and (max-width: 992px) {
    .relative-slide {
      margin-right: -0.8rem;
      margin-left: -0.8rem; }
      .relative-slide .swiper-slide {
        padding: 0 0.8rem; } }
  @media screen and (max-width: 992px) {
    .relative-slide .swiper-slide {
      width: 50%; } }
  @media screen and (max-width: 576px) {
    .relative-slide .swiper-slide {
      width: 100%; } }

.splide__list {
  gap: 3.2rem; }
  .splide__list .splide__slide {
    padding: 0;
    flex-direction: column;
    gap: 0.8rem; }
    .splide__list .splide__slide img {
      border-radius: 0.8rem; }
    .splide__list .splide__slide:hover {
      box-shadow: none; }
    .splide__list .splide__slide p {
      font-weight: 600; }