@charset "UTF-8";

@media (max-width: 1380px) {
  .serv .cardbox {
    width: 90%;
    height: auto;
    padding: 30px 15px;
  }
}

@media (max-width: 768px) {
  /* ================================
   하위 메뉴 공통 요소
================================ */

  .intro {
    height: 300px;
  }

  .intro .wrap3 {
    flex-direction: column;
    gap: 10px;
  }

  .intro h2 {
    margin-bottom: 4px;
  }

  /* ================================
   service
================================ */

  /* common */
  .serv .downgroup {
    grid-template-columns: repeat(1, 1fr);
  }

  .serv .mainimg {
    height: 200px;
    object-fit: cover;
  }

  .serv .topbox {
    margin-bottom: 10px;
  }

  .serv h4 {
    font-size: 21px;
  }

  /* homepage */
  .homepage .downgroup > div:nth-child(3) {
    border-bottom: none;
  }

  /* create */
  .create .downgroup > div:nth-child(5) {
    border-bottom: none;
  }

  /* ad */
  .ad .downgroup > div:nth-child(3) {
    border-bottom: none;
  }

  /* hospital */
  .hospital .downgroup > div:nth-child(5) {
    border-bottom: none;
  }

  /* ================================
   brand
================================ */
  .brand .cardbox {
    grid-template-columns: repeat(2, 1fr);
    row-gap: 4rem;
    column-gap: 2rem;
    height: auto;
  }

  .brand img {
    max-width: 100%;
  }

  /* ================================
   pride
================================ */
  .pride .wrap3 {
    flex-direction: column;
    gap: 40px;
  }

  .pride .one {
    max-width: 150px;
  }

  .pride .two {
    max-width: 170px;
  }

  .pride .three {
    max-width: 170px;
  }

  /* ================================
   introduce
================================ */
  .introduce .wrap3 {
    flex-direction: column;
  }

  .introduce img {
    max-width: 184px;
  }

  .introduce h4 {
    font-size: 22px;
  }

  .introduce li {
    padding-left: 10px;
  }

  .introduce li + li {
    margin-top: 0.4rem;
  }

  .introduce li::before {
    width: 3px;
    height: 3px;
  }

  .introduce .p18 {
    font-size: 18px;
  }

  .introduce .pcc {
    display: block;
  }

  /* ================================
   career
================================ */
  .career span {
    text-align: left;
  }

  .career h5 {
    font-size: 22px;
  }

  /* ================================
   addo
================================ */
  .prc .pcc {
    display: block;
  }

  .addo .gridbox {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 4rem 0;
    margin-bottom: 7rem;
  }

  .addo .gridbox img {
    width: 100%;
    max-width: 100%;
    height: auto;
  }

  /* ================================
   contact us
================================ */

  .formbox {
    padding: 6rem 0 0 0;
  }

  /* 모바일에서는 위아래로 배치 */
  .formbox .wrap3 {
    flex-direction: column;
    gap: 3rem;
  }

  .formbox .form-title,
  .formbox .rightbox {
    width: 100%;
  }

  .formbox .form-title h2 {
    margin-bottom: 1rem;
  }

  /* 모바일에서 버튼 터치하기 쉽게 확장 */
  .formbox .select-btn {
    flex-grow: 1; /* 빈 공간 채우기 */
    text-align: center;
    padding: 1.2rem 1rem;
    font-size: 1.4rem;
  }

  /* 1. ID 선택자(#fbox01)까지 포함해서 강력하게 덮어쓰기 */
  .formbox .select-btn,
  #fbox01 button {
    /* 중요: 기존의 고정 너비(10rem, 15rem)를 무시하고 계산식 적용 */
    width: calc((100% - 2rem) / 3) !important;

    /* flex-grow를 꺼서 마지막 줄 버튼이 혼자 커지는 현상 방지 */
    flex-grow: 0;
    height: 40px;
    /* 글자가 많아도 줄바꿈 없이 작게 보이게 하거나, 필요시 조정 */
    padding: 1.2rem 0.5rem;
    font-size: 11px;
  }

  .formbox .form-group {
    margin-bottom: 4rem;
  }

  .applicant-section {
    padding-top: 4rem;
    margin-top: 10px;
  }

  .formbox .input-text {
    height: 50px;
  }

  /* 모바일에서는 위아래 배치 */
  .applicant-section .info-group {
    flex-direction: column;
    gap: 2rem;
  }

  .applicant-section .group-title,
  .applicant-section .group-content {
    width: 100%;
  }

  .applicant-section .group-title h3 {
    margin-top: 0;
    margin-bottom: 1rem;
  }

  /* 인풋 라벨도 위아래 배치할지 선택 */
  .applicant-section .input-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
  }

  .applicant-section .input-field {
    height: 50px;
  }

  .applicant-section .field-label {
    width: 100%;
  }

  .applicant-section .submit-area {
    align-items: center; /* 모바일에서는 중앙 정렬 */
    width: 100%;
  }

  .privacy-modal__dialog {
    width: 92%;
    max-height: 80vh;
    border-radius: 8px;
  }

  .applicant-section .final-submit-btn {
    padding: 2rem 3rem;
  }

  .privacy-modal__body {
    font-size: 1.3rem;
  }

  .custom-checkbox-label .check-icon {
    width: 14px;
    height: 14px;
    transform: translateY(3%);
  }
}