@charset "utf-8";


/* ******************** component ******************** */

/* input */ 
@import "../../component/input-style";

/* button */ 
@import "../../component/button-style";


/* sub-cont */ 
@import "../common/_sub-cont";


/* ******************** sub-common ******************** */ 

/* sub-banner */ 
@import "../common/_sub-banner";

/* sub-tab */ 
@import "../common/_sub-tab";

/* ******************** 가족회사 ******************** */

/* banner */ 
@import "./banner";

.content-area {
  padding: 20px 0;
  .cont-wrap {
    display: flex; align-items: center; gap: 20px; flex-direction: column; font-size: 1.4rem; letter-spacing: -0.025em; border-bottom: 1px solid #eee; padding: 40px 20px; border-top: 2px solid #1686f4;
    .img-area {
      width: 100px; height: auto;
      img {
        width: 100%;
      }
    }
    .text-area {
      width: 100%;
      .notice-txt {
        font-size: 1.4rem; font-weight: 400; line-height: 1.6; text-align: center; word-break: keep-all;
        .bold {
          font-size: 1.6rem; font-weight: 500; 
        }
      }
      .textarea {
        width: 100%; margin-top: 15px;
      }
    }
    .radio-btn-wrap {
      display: flex; align-items: center; justify-content: space-between; width: 100%;
      .radio-wrap {
        display: flex; gap: 15px;
      }
    }
  }
}

@media (max-width: 768px) {
  .content-area {
    .cont-wrap {
      .radio-btn-wrap {
        flex-direction: column; gap: 20px;
        .radio-wrap {
          flex-direction: column; gap: 20px; align-items: center;
        }
      }
    }
  }
}

@media(max-width: 400px)  {
  .content-area {
    .cont-wrap {
      gap: 15px; padding: 20px 20px; border-top: 1px solid #1686f4;
      .img-area {
        width: 80px;
      }
      .text-area {
        .notice-txt {
          font-size: 1.3rem;
          .bold {
            font-size: 1.5rem;
          }
        }
      }
      .btn-wrap {
        &.h-45 {
          button {
            height: 37px; font-size: 1.3rem;
          }
        }
      }
    }
  }
}