* {
  box-sizing: border-box;
}

body,
html {
  height: 100%;
  margin: 0;
  overflow-x: hidden;
  padding: 0;
  width: 100%;
}

h1,
p {
  margin: 0;
}

a {
  -moz-appearance: none; /* 파이어폭스 브라우저용 기본 스타일 제거 */
  -webkit-appearance: none; /* 웹킷 브라우저용 기본 스타일 제거 */
  appearance: none; /* 브라우저 기본 스타일 제거 */
  color: inherit; /* 기본 링크 색상 제거 */
  text-decoration: none; /* 기본 밑줄 제거 */
}

main {
  margin-top: 75px;
  padding: 0;
  word-break: keep-all;
}

/**
  * Background
  */
.bg-gray-light {
  background: rgba(244, 244, 250, 0.8);
}
.bg-gray-secondary-main {
  background: var(--gray-secondary-main, #3c3d4f);
}

/**
  * Container
  */
.container {
  padding: 0 calc(var(--spacing) * 3.333333);
  width: 100%;
}

/**
  * Overview
  */
.overview-img {
  margin-top: calc(var(--spacing) * -27.5);
  width: 150%;
}

/**
  * Key Feature
  */
.features {
  padding: calc(var(--spacing) * 12.5) 0px 20px 0px;
}
.features1-img {
  width: 100%;
}
.key-feature2-arr1-en {
  margin: -140px 0 -160px 0;
}
.key-feature2-arr1-ko {
  margin: -117px 0 -174px 0;
}
.key-feature2-arr2-en {
  flex-shrink: 0;
  margin: -160px 0 -197px 0;
}
.key-feature2-arr2-ko {
  margin: -174px 0 -197px 0;
}

/**
  * Request
  */
.reqeust-form {
  background: url('../image/request.png');
  border-radius: 12px;
  padding: 24px var(--space-3-500, 28px);
}

/**
  * Pricing
  */
#pricing .box {
  max-width: 383px;
  padding: 32px 28px;
  width: 100%;
}
.include-item span {
  border-bottom: 1px solid var(--gray-secondary-100, #dfdfee);
  color: var(--gray-secondary-700, #5b5b6f);
  padding: 12px 0;
  width: 100%;
}
.recommand {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 10px;
  left: 0;
  position: absolute;
  top: -20px;
  width: 100%;
}
.recommand .recommand-box {
  align-items: center;
  background: var(--primary-light, #6280ff);
  border-radius: 22.5px;
  display: flex;
  gap: 10px;
  height: 40px;
  justify-content: center;
  padding: 8px 32px;
}
/**
  * Client
  */
.client-item {
  align-items: center;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  height: 60px;
  justify-content: center;
  width: 30%;
}

/**
  * Link
  */
.link {
  background: linear-gradient(0deg, rgba(98, 128, 255, 0.72) 0%, rgba(98, 128, 255, 0.72) 100%),
    url('../image/link.png') lightgray 50% / cover no-repeat;
}

/* 760px 이하 화면용 스타일 (mobile) */
@media (max-width: 760px) {
  main {
    margin-top: 54px;
  }
  #key-feature3-container {
    align-items: flex-start;
  }
  .tablet-display,
  .desktop-display {
    display: none;
  }
  .mobile-display {
    display: block;
  }
}

/* 761px ~ 1200px 화면용 스타일 (tablet) */
@media (min-width: 761px) and (max-width: 1200px) {
  .mobile-display,
  .desktop-display {
    display: none;
  }
  .tablet-display {
    display: block;
  }
}
/* 761px ~ 1200px 화면용 스타일 (desktop) */
@media (min-width: 1201px) {
  .mobile-display,
  .tablet-display {
    display: none;
  }
  .desktop-display {
    display: block;
  }
}
/* 1200px 이하 화면용 스타일 (mobile, tablet) */
@media (max-width: 1200px) {
  #key-feature2 img {
    width: auto;
    max-width: 100%;
    height: auto;
  }
  #key-feature2-1,
  #key-feature2-2,
  #key-feature2-3 {
    padding-top: 80px !important;
    gap: 40px !important;
  }
  #key-feature2-1,
  #key-feature2-3 {
    flex-direction: column-reverse;
  }
  #key-feature2-2 {
    flex-direction: column;
  }
  #key-feature2-arr1,
  #key-feature2-arr2 {
    display: none;
  }
}

/* 1200px ~ 화면용 스타일 (desktop) */
@media (min-width: 1201px) {
  .container {
    width: 1200px;
  }
  .overview-img,
  .features1-img {
    width: auto;
  }
}

/* 1480px ~ 화면용 스타일 (desktop) */
@media (min-width: 1480px) {
  .client-item {
    width: 240px;
  }
}