/* 


modify


 */
#hd_pop {
  width: auto;
}

#hd_pop p {
  opacity: 1;
}

#hd_pop .hd_pops_con {
  background: var(--white-color);
}

#hd_pop .hd_pops_con > * {
  opacity: 1;
}

/* 닫기 버튼은 오른쪽 위(박스 바깥쪽 아님) */
#hd_pop .hd_pops_footer {
  background: var(--primary-color);
}
#hd_pop .hd_pops_footer .hd_pops_close {
  background: var(--primary-color);
}

/* '오늘 하루 보지 않기' 버튼은 왼쪽에 고정 */
#hd_pop .hd_pops_footer .hd_pops_reject {
  background: var(--primary-color);
}

#hd_pop .hd_pops_footer button {
  padding: 1.2rem 2.4rem;
  font-size: 1.4rem;
  border: 0;
  color: var(--white-color);
}

#hd_pop .hd_pops {
  position: fixed;
  border-radius: 0.8rem;
  box-shadow: 0 0 16px rgba(0, 0, 0, 0.25);
  overflow: hidden;
}

/* 768px 이하에서 팝업이 뷰포트 안에 깔끔히 맞게 동작하도록 */
@media (max-width: 768px) {
  /* 전체 컨테이너 높이 자동 처리 */
  #hd_pop {
    height: auto;
  }

  /* 팝업 박스: 화면에 고정(스크롤과 함께 떠있지 않음), 좌우 여백 16px, 상단 40px */
  #hd_pop .hd_pops {
    position: fixed;
    /* top: 40px !important; */
    left: 16px !important;
    right: 16px !important;
    box-sizing: border-box;
    width: auto;
    max-width: calc(100vw - 32px); /* 좌우 16px씩 보장 */
    margin: 0 auto;
    overflow: auto; /* 내용이 길면 내부에서 스크롤 */
    max-height: calc(100vh - 40px - 16px); /* 상단 40px + 약간의 여유 */
    background: #fff;
    z-index: 10000;
  }

  #hd_pop .hd_pops_con {
    width: 100% !important;
    height: auto !important;
    background: #fff;
  }

  /* 이미지가 뷰포트를 넘지 않도록: 폭은 부모에 맞추고, 높이는 자동 */
  #hd_pop .hd_pops img {
    width: 100% !important; /* 부모(.hd_pops)의 너비를 따름 */
    height: auto !important; /* 높이는 자동 유지 */
  }
}

.sub_content #bo_cate ul {
  zoom: 1;
}
.sub_content #bo_cate ul:after {
  display: block;
  visibility: hidden;
  clear: both;
  content: "";
}
.sub_content #bo_cate li {
  display: inline-block;
  padding: 2px;
}
.sub_content #bo_cate a {
  display: block;
  line-height: 28px;
  padding: 4px 24px;
  border-radius: 30px;
  border: 2px solid var(--primary-color);
  color: var(--primary-color);

  font-size: 1.6rem;
  font-weight: 600;
}
.sub_content #bo_cate a:focus,
.sub_content #bo_cate a:hover,
.sub_content #bo_cate a:active {
  text-decoration: none;
  background: var(--primary-color);
  color: var(--white-color);
}
.sub_content #bo_cate #bo_cate_on {
  z-index: 2;
  background: var(--primary-color);
  color: var(--white-color);
  font-weight: bold;
  border: 1px solid var(--primary-color);
  -webkit-box-shadow: inset 0 2px 5px var(--primary-color);
  -moz-box-shadow: inset 0 2px 5px var(--primary-color);
  box-shadow: inset 0 2px 5px var(--primary-color);
}

.sub_content .bo_cate_link {
  float: left;
  display: inline-block;
  margin-right: 10px;
  background: var(--primary-color);
  color: var(--white-color);
  font-weight: normal !important;
  height: auto;
  line-height: 10px;
  padding: 8px 16px;
  border-radius: 5px;
  font-size: 0.95em;
}

.sub_content #bo_v_title .bo_v_cate {
  display: inline-block;
  line-height: 1;
  background: var(--background-color);
  color: var(--point-color);
  padding: 4px 24px;
  border-radius: 4px;

  margin-bottom: 16px;
}

.sub_content .bo_tit {
  display: block;
  color: #000;
  font-weight: 400;
}

.sub_content .bo_tit svg {
  width: 16px;
  height: 16px;

  margin-left: 16px;
}

.sub_content .bo_tit svg.feather-lock {
  margin-left: 0;
  stroke: var(--point-color);
}
.sub_content #bo_list .td_datetime {
  width: auto;
  text-align: center;
  width: 90px;
  white-space: nowrap;
}

.sub_content #bo_list .td_name {
  width: 90px;
  text-align: center;
  padding: 10px 0;

  white-space: nowrap;
}

.sub_content #bo_list td {
  height: 6.4rem;
  word-break: break-all;
}
.sub_content #bo_list .bo_notice td {
  border-bottom: 1px solid var(--point-color);
  background: var(--background-color);
}

.sub_content .bo_current {
  color: #e8180c;
  white-space: nowrap;
  font-size: 1.4rem;
}

.sub_content #bo_w .bo_w_flie .file_wr {
  position: relative;
  border: 1px solid #ccc;
  background: #fff;
  color: #000;
  vertical-align: middle;
  border-radius: 3px;
  padding: 16px 5px;
  height: auto;
  margin: 0;
}

.sub_content #bo_v_title .bo_v_tit {
  display: block;
  font-size: 2.4rem;
  font-weight: 400;
  margin: 5px 0 0;
  word-break: break-all;
}

.sub_content #bo_v_info .profile_info {
  margin: 4rem 0 1.6rem 0;
  display: inline-block;
}

.sub_content #bo_v_img {
  width: 100%;
  overflow: hidden;
  margin: 4rem 0 4rem 0;
  zoom: 1;
}
.sub_content #bo_v_con {
  margin: 4rem 0 4rem 0;
  width: 100%;
  line-height: 1.7em;
  min-height: 200px;
  word-break: break-all;
  overflow: hidden;
}

.sub_content #bo_v_file ul {
  margin: 0;
  list-style: none;
}
.sub_content #bo_v_link li {
  padding: 15px;
  position: relative;
  margin: 10px 0;
  border: 1px solid #dfdfdf;
  border-radius: 5px;
  -webkit-box-shadow: 1px 1px 5px 0px hsl(232, 36%, 96%);
  -moz-box-shadow: 1px 1px 5px 0px hsl(232, 36%, 96%);
  box-shadow: 1px 1px 5px 0px hsl(232, 36%, 96%);
}
.sub_content #bo_v_link li i {
  float: left;
  color: #b2b2b2;
  font-size: 2.35em;
  margin-right: 40px;
}
.sub_content #bo_v_link a {
  float: none;
  display: block;
  text-decoration: none;
  word-wrap: break-word;
  color: #000;
}
.sub_content #bo_v_link a:focus,
.sub_content #bo_v_link li:hover a,
.sub_content #bo_v_link a:active {
  text-decoration: underline;
  color: #000;
}
.sub_content #bo_v_link .bo_v_link_cnt {
  color: #b2b2b2;
  font-size: 0.92em;
}
.sub_content #bo_v_link li:hover {
  border-color: #bed4f4;
  color: #bed4f4;
}
.sub_content #bo_v_link li:hover i {
  color: #3a8afd;
}
.sub_content #bo_v_link li:hover .bo_v_link_cnt {
  color: #99c2fc;
}

.sub_content #bo_v_file a {
  float: none;
  display: block;
  text-decoration: none;
  word-wrap: break-word;
  color: #000;
}

.sub_content .cmt_btn {
  width: 100%;
  text-align: left;
  border: 0;
  border-bottom: 1px solid #f0f0f0;
  background: #fff;
  font-weight: bold;
  margin: 30px 0 0px;
  padding: 0 0 15px;
}
.sub_content .cmt_btn span.total {
  position: relative;
  display: inline-block;
  margin-right: 5px;
  font-size: 1.4rem;
  color: var(--primary-color);
}
.sub_content .cmt_btn span.cmt_more {
  float: right;
  display: inline-block;
  width: 15px;
  height: 10px;
  background: url(./img/btn_cmt.png) no-repeat right 2px;
  margin-top: 5px;
}
.sub_content .cmt_btn_op span.cmt_more {
  background-position: right -8px;
}
.sub_content .cmt_btn b {
  font-size: 1.2em;
  color: #000;
}
.sub_content .cmt_btn span.total:after {
  position: absolute;
  bottom: -17px;
  left: 0;
  display: inline-block;
  background: var(--primary-color);
  content: "";
  width: 100%;
  height: 2px;
}

.sub_content #bo_w .bo_w_flie .lb_icon {
  position: absolute;
  top: 17px;
  left: 0px;
  border-radius: 3px 0 0 3px;
  height: 38px;
  line-height: 38px;
  width: 40px;
  font-size: 1.2em;
  text-align: center;
  color: #b2b2b2;
}

.sub_content #bo_w .bo_w_link label {
  position: absolute;
  top: 5px;
  left: 1px;
  border-radius: 3px 0 0 3px;
  height: 38px;
  line-height: 38px;
  width: 40px;
  font-size: 1.2em;
  text-align: center;
  color: #b2b2b2;
}

.sub_content .bo_sch {
  position: absolute;
  top: 50%;
  left: 50%;
  background: #fff;
  text-align: left;
  max-width: 600px;
  width: 100%;
  max-height: 400px;
  margin-left: auto;
  margin-top: auto;
  transform: translate(-50%, -50%);
  overflow-y: auto;
  border-radius: 5px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  border: 1px solid #dde7e9;
  background: #fff;
  border-radius: 0;
}

.sub_content .bo_sch form {
  padding: 6rem 4rem 1.6rem 4rem;
  display: block;
}
.sub_content .bo_sch select {
  border: 0;
  width: 100%;
  height: 40px;
  border: 1px solid #d0d3db;
  border-radius: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
.sub_content .bo_sch .sch_bar {
  display: inline-block;
  width: 100%;
  clear: both;
  margin-top: 15px;
  border: none;
  border-radius: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
.sub_content .bo_sch .sch_input {
  width: 100%;
  height: 38px;
  border: 0;
  padding: 0;
  background-color: transparent;
  float: left;

  border: 1px solid #d0d3db;
}
.sub_content .bo_sch .sch_btn {
  height: 38px;
  float: right;
  color: var(--primary-color);
  background: none;
  border: 0;
  width: 40px;
}
.sub_content .bo_sch .bo_sch_cls {
  position: absolute;
  right: 0;
  top: 0;
  color: #b5b8bb;
  border: 0;
  padding: 12px 15px;
  font-size: 16px;
  background: #fff;
}
.sub_content .bo_sch_bg {
  background: #000;
  background: rgba(0, 0, 0, 0.75);
  width: 100%;
  height: 100%;
}

.sub_content .more_opt svg {
  width: 14px;
  height: 14px;
}

/*FAQ */
.sub_content .faq-container {
  /* max-width: 600px; */
  margin: 0 auto;
}

.sub_content .faq {
  background-color: transparent;
  border: 1px solid rgba(0, 0, 0, 0.05);
  border-radius: 10px;
  margin: 20px 0;
  padding: 30px;
  position: relative;
  overflow: hidden;
  transition: 0.3s ease;
  background: #f9f9f9;
}

.sub_content .faq h3 {
  font-size: 2rem;
}

.sub_content .faq.active {
  background-color: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.1);
}

.sub_content .faq-title {
  margin: 0 35px 0 0;
  cursor: pointer;
}

.sub_content .faq-text {
  display: none;
  margin: 30px 0 0;
  line-height: 1.5;
}

.sub_content .faq.active .faq-text {
  display: block;
}

.sub_content .faq-toggle {
  background-color: transparent;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  padding: 0;
  position: absolute;
  top: 50%;
  right: 30px;
  height: 30px;
  width: 30px;

  transform: translate(0, -50%);
}

.sub_content .faq-toggle:focus {
  outline: 0;
}

.sub_content .faq-toggle .close {
  display: none;
}

.sub_content .faq.active .faq-toggle .close {
  color: #fff;
  display: block;
}

.sub_content .faq.active .faq-toggle .down {
  display: none;
}

.sub_content .faq.active .faq-toggle {
  background-color: #9fa4a8;
}

.sub_content #bo_w .btn_submit {
  padding: 0 20px;
  font-size: 1.167em;
}
.sub_content #bo_w .btn_submit {
  position: relative;
  z-index: 1;
  margin-top: 4rem;
  display: inline-flex;
  align-items: center;
  height: 4.8rem;
  border-radius: 4.8rem;
  padding: 0 2.4rem 0 8rem;
  overflow: hidden;
  color: var(--white-color);
  white-space: nowrap;
}

.sub_content #bo_w .btn_submit::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 4.8rem;
  border-radius: 4.8rem;
  background: var(--primary-color);
}
.sub_content #bo_w .btn_submit::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 4.8rem;
  height: 4.8rem;
  border-radius: 4.8rem;
  background: rgba(0, 0, 0, 0.1) url(../lib/icon/edit-3.svg) no-repeat center
    center;
  filter: invert();
}

.sub_content #bo_w .btn_cancel {
  position: relative;
  z-index: 1;

  margin-top: 4rem;

  display: inline-flex;
  align-items: center;
  height: 4.8rem;
  border-radius: 4.8rem;
  padding: 0 2.4rem 0 8rem;
  overflow: hidden;

  color: var(--white-color);
  white-space: nowrap;
}

.sub_content #bo_w .btn_cancel::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 4.8rem;
  border-radius: 4.8rem;
  background: var(--point-color);
}

.sub_content #bo_w .btn_cancel::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 4.8rem;
  height: 4.8rem;
  border-radius: 4.8rem;
  background: rgba(0, 0, 0, 0.1) url(../lib/icon/x.svg) no-repeat center center;

  filter: invert();
}

.sub_content #bo_w .frm_info {
  position: relative;
  line-height: 18px;
  color: var(--point-color);
  margin: 10px 0;
  display: inline-block;
  font-size: 1em;
}
.sub_content .chk_box input[type="checkbox"] + label {
  position: relative;
  /* padding-left: 24px; */
  color: #676e70;
}

.sub_content .btn_cke_sc {
  display: inline-block;
  padding: 0 10px;
  height: auto;
  border: 1px solid #ccc;
  background: #fafafa;
  color: #000;
  text-decoration: none;
  line-height: 1.9em;
  vertical-align: middle;
  cursor: pointer;
}

.sub_content #faq_sch {
  background: #f7f7f7;
  padding: 2.4rem;
  text-align: center;
  margin: 0 0 8rem 0;
}

.sub_content #faq_sch .btn_submit {
  position: relative;
  z-index: 1;
  margin-top: 0;
  display: inline-flex;
  align-items: center;
  height: 4.8rem;
  border-radius: 4.8rem;
  padding: 0 2.4rem 0 8rem;
  overflow: hidden;
  color: var(--white-color);
  background: transparent;
  white-space: nowrap;

  width: auto;

  font-weight: 400;
}

.sub_content #faq_sch .btn_submit .fa {
  display: none;
}
.sub_content #faq_sch .btn_submit::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 4.8rem;
  border-radius: 4.8rem;
  background: var(--point-color);
}
.sub_content #faq_sch .btn_submit::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 4.8rem;
  height: 4.8rem;
  border-radius: 4.8rem;
  background: rgba(0, 0, 0, 0.1) url(../lib/icon/search.svg) no-repeat center
    center;
  filter: invert();
}

.sub_content #fregister p {
  position: relative;
  text-align: center;
  color: #fff;
  height: 50px;
  line-height: 50px;
  font-size: 1.1em;
  background: var(--point-color);
  margin: 0 0 10px;
  border-radius: 5px;
  font-weight: 400;
}

.btn_submit:hover {
  background: var(--secondary-color);
}

.btn_submit {
  border: 0;
  background: var(--primary-color);
  color: var(--white-color);
  cursor: pointer;
  border-radius: 3px;
}

/* ======================================================================
   글로벌 공통: 모든 p 태그 및 본문/설명 텍스트 컬러 #2d2d2d 통일
   ====================================================================== */
.sub_page p,
.sub_container p,
.hero_lead_desc, 
.sec_desc, 
.con_desc, 
.section_header_desc, 
.ap-text-lead,
.page_tit p, 
.sub-content-wrap p, 
.sub-page-content p,
.sub-content-wrap span.desc, 
.card_desc, 
.showcase_desc,
.feat-card-body,
.feat-card p.feat-card-body,
.box_desc,
.bento_p,
.field-item ul li,
.item ul li {
  color: #2d2d2d !important;
}

/* 폰트가 얇아서 흐려 보이는 것을 개선하기 위해 본문 및 리드문 가독성 보강 */
.hero_lead_desc, .ap-text-lead, .con_desc, .sec_desc {
  font-weight: 500 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 예외: 흰색 텍스트가 유지되어야 하는 다크 컨테이너, 푸터, 버튼, 뱃지 등 */
#footer p, .footer p, .ft_info p, .ft_copy, .bg-dark p, [class*="theme-dark"] p,
.mimo_btn_primary p, .btn p, .button p, .hero_floating_badge p,
.dark-box p, [class*="bg-navy"] p, [class*="bg-blue"] p, .text-white,
.mimo_color_card p, .motto_banner_lux p, .motto-banner p, .mimo_wide_vision_banner p,
.mimo_mission_card p, .card_title, .motto-banner *, .motto_banner_lux *,
.partner_color_card p, .partner_color_card *, .partner_color_card,
.mimo_rich_img_card p, .mimo_rich_img_card *, .mimo_rich_img_card,
.mimo_accent_header_card .card_accent_header *,
.mimo_split_media_card .card_floating_chip {
  color: inherit !important;
}

/* ======================================================================
   섹션별 카드 순차적 등장 애니메이션 (Staggered Scroll Trigger System)
   ====================================================================== */
.mimo_stagger_item {
  opacity: 0 !important;
  transform: translateY(35px) !important;
  transition: opacity 0.75s cubic-bezier(0.16, 1, 0.3, 1), transform 0.75s cubic-bezier(0.16, 1, 0.3, 1) !important;
  will-change: opacity, transform;
}
.mimo_stagger_item.stagger_in {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

/* ======================================================================
   서브페이지 브레드크럼과 콘텐츠 영역 사이 불필요한 여백(흰색 공간) 완전 제거
   ====================================================================== */
.sub_nav.yun-breadcrumbs,
.sub_nav,
.sub_nav_wrap {
  margin-bottom: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

@media (max-width: 768px) {
  .sub_nav.yun-breadcrumbs,
  .sub_nav {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    left: 0 !important;
    right: 0 !important;
    border-left: none !important;
    border-right: none !important;
    border-radius: 0 !important;
  }
  .sub_nav.yun-breadcrumbs .breadcrumb-inner {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }
}
.sub-content-wrap {
  margin-top: 0 !important;
  padding-top: 0 !important;
  background: transparent !important;
  display: flow-root !important;
}
.sub-content-wrap > div:first-child,
.sub-content-wrap > section:first-child,
.sub-content-wrap > div:first-child > section:first-child {
  margin-top: 0 !important;
}

/* ======================================================================
   서브페이지 최상단 콘텐츠 영역 내부 상단 패딩 (PC 80px, 모바일 40px)
   - 브레드크럼과의 간격을 시원하고 쾌적하게 확보
   ====================================================================== */
.sub-content-wrap > div:first-child > section:first-of-type,
.sub-content-wrap > section:first-of-type,
.sub-content-wrap section:first-of-type.ap-tile-section,
.company_hero_sec,
.contact_hero_sec,
.tech_hero_sec,
#mm_about_contact section:first-of-type,
#mm_support_apply section:first-of-type,
#mm_smartearth_intro section:first-of-type,
#mm_about_technology section:first-of-type,
#mm_smartearth_ai section:first-of-type,
#mm_about_company section:first-of-type,
#mm_about_vision section:first-of-type,
#mm_business_energy section:first-of-type,
#mm_business_premium section:first-of-type,
#mm_business_consulting section:first-of-type {
  padding-top: 80px !important;
}

@media (max-width: 768px) {
  .sub-content-wrap > div:first-child > section:first-of-type,
  .sub-content-wrap > section:first-of-type,
  .sub-content-wrap section:first-of-type.ap-tile-section,
  .company_hero_sec,
  .contact_hero_sec,
  .tech_hero_sec,
  #mm_about_contact section:first-of-type,
  #mm_support_apply section:first-of-type,
  #mm_smartearth_intro section:first-of-type,
  #mm_about_technology section:first-of-type,
  #mm_smartearth_ai section:first-of-type,
  #mm_about_company section:first-of-type,
  #mm_about_vision section:first-of-type,
  #mm_business_energy section:first-of-type,
  #mm_business_premium section:first-of-type,
  #mm_business_consulting section:first-of-type {
    padding-top: 40px !important;
  }
}

/* ======================================================================
   PC GNB 메가메뉴 2차메뉴 가로폭 최적화 및 줄바꿈 방지
   - 회사소개 컬럼(텍스트 짧음)을 160px로 축소
   - 사업분야 컬럼(텍스트 김)을 360px로 확장하여 한 줄씩 똑 떨어지게 출력
   ====================================================================== */
@media (min-width: 1025px) {
  .megamenu-inner {
    max-width: 1260px !important;
  }
  .megamenu-col.col-about,
  .megamenu-col:nth-child(1) {
    flex: 0 0 160px !important;
    max-width: 170px !important;
    padding-left: 0 !important;
    padding-right: 18px !important;
  }
  .megamenu-col.col-business,
  .megamenu-col:nth-child(2) {
    flex: 0 0 360px !important;
    min-width: 350px !important;
    padding: 0 26px !important;
  }
  .megamenu-col.col-media,
  .megamenu-col:nth-child(3) {
    flex: 1 1 200px !important;
    padding: 0 20px !important;
  }
  .megamenu-col.col-support,
  .megamenu-col:nth-child(4) {
    flex: 1 1 220px !important;
    padding: 0 20px !important;
  }
  .megamenu-col.col-smartearth,
  .megamenu-col:nth-child(5),
  .megamenu-col:last-child {
    flex: 1 1 210px !important;
    padding-right: 0 !important;
    padding-left: 20px !important;
  }
  .gnb-depth2 a {
    font-size: 15px !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    display: inline-block !important;
  }
}

/* ======================================================================
   다크 비전/CTA 배너 (.mimo_wide_vision_banner) 텍스트 컬러 고대비 보장
   - 글로벌 p 태그(#2d2d2d) 덮어쓰기 방지
   ====================================================================== */
.mimo_wide_vision_banner h3,
.mimo_wide_vision_banner .banner_title {
  color: #ffffff !important;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.4) !important;
}

.mimo_wide_vision_banner p {
  color: #f1f5f9 !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.25) !important;
}

.mimo_wide_vision_banner p * {
  color: inherit !important;
}

.mimo_wide_vision_banner .sub_badge {
  color: #93c5fd !important;
}

/* ======================================================================
   메인 Hero 슬라이더 (.main-slider) 텍스트 순백색 보장
   - 글로벌 p 태그(#2d2d2d) 덮어쓰기 방지
   ====================================================================== */
.main-slider .m-txt,
.main-slider .m-txt *,
.main-slider .m-tit,
.main-slider .m-tit p,
.main-slider .m-tit .tit-line,
.main-slider .m-desc,
.main-slider .m-desc p,
.m-slide .m-txt,
.m-slide .m-txt p,
.m-slide .m-txt .tit-line {
  color: #ffffff !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.5) !important;
}

/* ======================================================================
   메인 핵심 가치 (Section 2: Core Values) Dynamic Infographic Cards & Container
   - Container overflow fix, Staggered offset, Watermark typography, Floating boundary icons
   ====================================================================== */
#main02 {
  width: 100% !important;
  min-height: 100vh !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  padding: 50px 0 !important;
  box-sizing: border-box !important;
  background: #f8fafc !important;
  position: relative !important;
  overflow: hidden !important;
}

#main02 .s2-container {
  width: 90% !important;
  max-width: 1360px !important;
  margin: 0 auto !important;
  position: relative !important;
  box-sizing: border-box !important;
}

/* Section Header 완벽 중앙 정렬 (기존 left: 10% 오버플로우 제거) */
#main02 .s2-header {
  left: 0 !important;
  width: 100% !important;
  margin-bottom: 28px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-end !important;
}

#main02 .s2-tit {
  font-size: 46px !important;
  font-weight: 900 !important;
  color: #0f172a !important;
  line-height: 1.25 !important;
}

#main02 .s2-desc {
  font-size: 16.5px !important;
  color: #64748b !important;
  line-height: 1.6 !important;
}

/* 4개 카드 그리드 레이아웃 (카드 높이 100% 동일화) */
#main02 .s2-list {
  left: 0 !important;
  width: 100% !important;
  height: auto !important;
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 22px !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: stretch !important; /* 모든 카드의 높이를 가장 긴 카드에 맞춰 100% 동일하게 확장 */
  position: relative !important;
}

/* 기존 theme_main.css의 이전 s2Card 키프레임 애니메이션 및 translateX 하드코딩 완전 차단 */
.section.active #main02 .s2-card,
#main02 .s2-card {
  animation: none !important;
  transform: none;
  height: 100% !important; /* 전체 카드 높이 통일 */
  box-sizing: border-box !important;
  position: relative !important;
  left: 0 !important;
  top: 0 !important;
}

/* 카드 상단 정렬 통일 */
#main02 .s2-list .s2-card {
  margin-top: 0 !important;
}

/* ======================================================================
   메인 핵심 가치 (Section 2: Reference Wave Cards - CodePen Style)
   ====================================================================== */
#main02 {
  background: #edf2f7 !important; /* 이미지처럼 흰색 카드가 부각되는 고급 슬레이트 배경 */
}

/* 개별 카드 외곽 (순백색 둥근 카드 + 깊은 그림자 + 동일한 높이) */
#main02 .s2-card.mimo_wave_card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important; /* 가변 텍스트에도 동일한 카드 높이 유지 */
  box-sizing: border-box !important;
  background: #ffffff !important;
  border-radius: 30px !important;
  padding: 8px 8px 24px 8px !important; /* 이미지와 동일하게 컬러 블록이 8px 흰색 카드 테두리 안에 감싸짐 */
  border: 1px solid rgba(226, 232, 240, 0.9) !important;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.08), 0 4px 12px rgba(15, 23, 42, 0.03) !important;
  position: relative !important;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
  
  /* 애니메이션 초기 상태 */
  opacity: 0 !important;
  transform: translateY(45px) scale(0.97) !important;
  will-change: opacity, transform;
}

/* 순차 등장 애니메이션 (.visible 활성화 시) */
#main02 .s2-list.visible .s2-card.mimo_wave_card {
  opacity: 1 !important;
  transform: translateY(0) scale(1) !important;
  transition: opacity 0.75s cubic-bezier(0.16, 1, 0.3, 1), transform 0.75s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s ease !important;
}

#main02 .s2-list.visible .s2-card:nth-child(1) { transition-delay: 0.10s !important; }
#main02 .s2-list.visible .s2-card:nth-child(2) { transition-delay: 0.24s !important; }
#main02 .s2-list.visible .s2-card:nth-child(3) { transition-delay: 0.38s !important; }
#main02 .s2-list.visible .s2-card:nth-child(4) { transition-delay: 0.52s !important; }

#main02 .s2-card.mimo_wave_card:hover {
  transform: translateY(-12px) !important;
  box-shadow: 0 26px 50px rgba(15, 23, 42, 0.14), 0 8px 18px rgba(15, 23, 42, 0.05) !important;
}

/* 상단 컬러 웨이브 블록 (하단 사선 곡선 Wave Curve) */
.mimo_wave_card .wave_header_box {
  width: 100% !important;
  height: 200px !important;
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  overflow: hidden !important;
  /* 이미지의 사선 곡면 하단 쉐이프: 상단 좌우 20px, 하단 우측 135px 유선형 곡면 */
  border-radius: 20px 20px 135px 0 !important;
}

/* 컬러 블록 중앙 대형 화이트 아이콘 */
.mimo_wave_card .header_icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #ffffff !important;
  font-size: 60px !important;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.mimo_wave_card:hover .header_icon {
  transform: scale(1.14) rotate(4deg) !important;
}

/* 하단 흰색 본문 영역 (flex: 1로 카드 전체 높이에 맞춤) */
.mimo_wave_card .wave_body_box {
  padding: 22px 14px 6px !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  box-sizing: border-box !important;
}

/* 타이틀: 테마 컬러 */
.mimo_wave_card .card_tit {
  font-size: 21px !important;
  font-weight: 800 !important;
  letter-spacing: -0.3px !important;
  margin: 0 0 4px 0 !important;
  line-height: 1.25 !important;
  text-align: center !important;
}

/* 서브타이틀: 테마 컬러 */
.mimo_wave_card .card_subtit {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  display: block !important;
  letter-spacing: -0.2px !important;
  margin-bottom: 14px !important;
  text-align: center !important;
  opacity: 0.88 !important;
}

/* 상세설명: 왼편 정렬(요청 반영) + 블랙/다크그레이 */
.mimo_wave_card .body_desc {
  font-size: 14px !important;
  line-height: 1.65 !important;
  color: #334155 !important;
  word-break: keep-all !important;
  margin: 0 0 16px 0 !important;
  text-align: left !important; /* 상세텍스트 왼편 정렬 */
  font-weight: 450 !important;
  flex: 1 0 auto !important; /* 텍스트 길이에 따라 유연하게 공간 확보 */
}

/* 2개 항목: 블릿(체크 아이콘)과 함께 적용 + 카드 최하단에 항상 일치하게 고정 */
.mimo_wave_card .body_features {
  list-style: none !important;
  padding: 12px 14px !important;
  margin: auto 0 0 0 !important; /* 상단 텍스트 길이에 상관없이 항상 카드 하단 베이스라인 통일 */
  background: #f8fafc !important;
  border: 1px solid #edf2f7 !important;
  border-radius: 14px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  text-align: left !important;
}

.mimo_wave_card .body_features li {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #1e293b !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  letter-spacing: -0.2px !important;
}

.mimo_wave_card .body_features li i {
  font-size: 12px !important;
}

/* ======================================================================
   4색 테마별 그라데이션 (이미지와 100% 동일한 비주얼 컬러)
   ====================================================================== */
/* 01. Theme Orange (이미지 1번 Code 스타일) */
.mimo_wave_card.theme_orange .wave_header_box {
  background: linear-gradient(180deg, #ff4e00 0%, #ff8a00 100%) !important;
}
.mimo_wave_card.theme_orange .card_tit,
.mimo_wave_card.theme_orange .card_subtit {
  color: #ff5722 !important;
}
.mimo_wave_card.theme_orange .body_features li i {
  color: #ff5722 !important;
}

/* 02. Theme Purple (이미지 2번 CSS3 스타일) */
.mimo_wave_card.theme_purple .wave_header_box {
  background: linear-gradient(180deg, #6a00f4 0%, #d800ff 100%) !important;
}
.mimo_wave_card.theme_purple .card_tit,
.mimo_wave_card.theme_purple .card_subtit {
  color: #9c27b0 !important;
}
.mimo_wave_card.theme_purple .body_features li i {
  color: #9c27b0 !important;
}

/* 03. Theme Indigo (이미지 3번 HTML5 스타일) */
.mimo_wave_card.theme_indigo .wave_header_box {
  background: linear-gradient(180deg, #4b58c7 0%, #7d8be6 100%) !important;
}
.mimo_wave_card.theme_indigo .card_tit,
.mimo_wave_card.theme_indigo .card_subtit {
  color: #4b58c7 !important;
}
.mimo_wave_card.theme_indigo .body_features li i {
  color: #4b58c7 !important;
}

/* 04. Theme Green (이미지 4번 JS 스타일) */
.mimo_wave_card.theme_green .wave_header_box {
  background: linear-gradient(180deg, #00b074 0%, #34d399 100%) !important;
}
.mimo_wave_card.theme_green .card_tit,
.mimo_wave_card.theme_green .card_subtit {
  color: #00b074 !important;
}
.mimo_wave_card.theme_green .body_features li i {
  color: #00b074 !important;
}

/* ======================================================================
   반응형 미디어 쿼리
   ====================================================================== */
@media (max-width: 1200px) {
  #main02 {
    padding: 60px 0 !important;
  }
  #main02 .s2-list {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 24px !important;
  }
  #main02 .s2-list .s2-card:nth-child(2),
  #main02 .s2-list .s2-card:nth-child(4) {
    margin-top: 0 !important;
  }
}

@media (max-width: 768px) {
  #main02 {
    padding: 40px 0 !important;
    min-height: auto !important;
    height: auto !important;
  }
  #main02 .s2-container {
    width: 92% !important;
  }
  #main02 .s2-header {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
    margin-bottom: 24px !important;
  }
  #main02 .s2-tit {
    font-size: 32px !important;
  }
  #main02 .s2-desc {
    font-size: 14.5px !important;
  }
  #main02 .s2-list {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  .mimo_wave_card .wave_header_box {
    height: 160px !important;
  }
  .mimo_wave_card .header_icon {
    font-size: 48px !important;
  }
  .mimo_wave_card .card_tit {
    font-size: 20px !important;
  }
  .mimo_wave_card .body_desc {
    font-size: 14px !important;
    min-height: auto !important;
  }
}

/* ======================================================================
   메인 주요 사업분야 / 카운터 / CTA 다크 섹션 텍스트 색상 보장
   ====================================================================== */
.main_sec_biz a p:first-of-type {
  color: #3ca1ff !important;
}
.main_sec_biz a p:last-of-type {
  color: rgba(255, 255, 255, 0.85) !important;
}
#main_counters .counter_item .tit {
  color: #3ca1ff !important;
}
#main_counters .counter_item .desc {
  color: rgba(255, 255, 255, 0.6) !important;
}
#main_cta_banner .cta_txt {
  color: rgba(255, 255, 255, 0.85) !important;
}

/* ======================================================================
   고객지원 (mm_support_apply.php) 6개 상담 가이드 카드 화이트 텍스트 적용
   ====================================================================== */
#mm_support_apply .guide_item h4,
.guide_item h4 {
  color: #ffffff !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.25) !important;
}
#mm_support_apply .guide_item p,
.guide_item p {
  color: rgba(255, 255, 255, 0.95) !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important;
}
#mm_support_apply .guide_item .icon_box,
.guide_item .icon_box {
  background: #ffffff !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

/* ======================================================================
   개인정보처리방침 (privacy.php) 컨테이너 및 카드 레이아웃 적용
   ====================================================================== */
#company_privacy_wrap {
  width: 100% !important;
  background-color: #f8fafc !important;
  padding: 60px 0 100px !important;
}
#company_privacy_wrap .sub_container {
  max-width: 1200px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  box-sizing: border-box !important;
}
#company_privacy {
  max-width: 1200px !important;
  margin: 0 auto !important;
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 24px !important;
  padding: 50px 48px !important;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04) !important;
  box-sizing: border-box !important;
  color: #334155 !important;
  line-height: 1.75 !important;
  font-size: 15px !important;
}
#company_privacy .privacy-of-use h4 {
  font-size: 19px !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  margin: 32px 0 12px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid #f1f5f9 !important;
}
#company_privacy .privacy-of-use h4:first-child {
  margin-top: 0 !important;
}
#company_privacy .privacy-of-use p {
  font-size: 15px !important;
  line-height: 1.75 !important;
  color: #334155 !important;
  margin: 0 0 16px 0 !important;
}
#company_privacy .privacy-of-use dt {
  font-size: 15.5px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  margin-top: 14px !important;
}
#company_privacy .privacy-of-use dd {
  font-size: 14.5px !important;
  color: #475569 !important;
  margin: 4px 0 14px 0 !important;
  line-height: 1.65 !important;
}
#company_privacy .privacy-of-use ul,
#company_privacy .privacy-of-use ol {
  padding-left: 20px !important;
  margin: 10px 0 !important;
}
#company_privacy .privacy-of-use li {
  font-size: 14.5px !important;
  color: #475569 !important;
  line-height: 1.65 !important;
  margin-bottom: 6px !important;
}
@media (max-width: 768px) {
  #company_privacy_wrap {
    padding: 30px 0 60px !important;
  }
  #company_privacy {
    padding: 28px 20px !important;
    border-radius: 16px !important;
  }
}

