@charset "UTF-8";


.sub-title {margin-top: 100px; position: relative; height: 300px; margin-bottom: 36px;} /* 높이 395→300, 하단 84→36 축소 (노트북서 본문/제목 위로 — 배너↔본문 간격만 줄임, 제목 아래 전체가 같이 올라옴). 원본 시안=395px/84px */
.sub-title-bg-wrap { position: absolute; top: 0; left: 0; width: calc(100vw); height: 100%; border-radius: 0 0 130px 0; overflow: hidden; z-index: -1;}
.sub-title-bg { width: 100%; height: 100%; object-fit: cover; animation: bg 1s ease;}

@keyframes bg {
  from { transform: scale(1.05);}
  to { transform: scale(1); }
}

.sub-title-text {padding-top: 100px; display: flex; align-items: center;} /* 132→100 (배너 축소 비례). 원본 시안=132px */
.sub-title-text h2 { display: flex; align-items: center; color: #fff; font-size: 45px; font-weight: 800; line-height: 55px; /* 122.222% */}
.sub-title-text h2:after {content: ""; display: block; width: 146px; height: 1px; background: #fff; margin-left: 35px; margin-right: 19px;}
.sub-title-text p { color: #fff; font-size: 31px; font-weight: 600; line-height: 65px; /* 209.677% */}
.sub-nav {display: flex; align-items: center; gap: 16px; margin-top: 36px;} /* 76→36 (배너 축소 시 브레드크럼도 같이 위로 — 안 줄이면 본문에 붙음). 원본 시안=76px */
.sub-nav .home { width: 65px; height: 65px; border-radius: 100%; display: flex; align-items: center; justify-content: center; background-color: #1c60c5;}
@keyframes rotate-slow {
  from { transform: rotate(0deg);}
  to { transform: rotate(360deg); }
}
.sub-title-circle {position: absolute; left: 340px; top: 60px; animation: rotate-slow 12s linear infinite; display:none;}

/* sub-nav 드롭다운 */
.sub-nav-dropdown {position: relative;}
.sub-nav-dropdown.is-active { background: #fff; /*border-radius: 30px 10px 0 0;*/ border-radius: 30px 30px 0 0;}
.sub-nav-dropdown-btn { display: flex; align-items: center; justify-content: space-between;  height: 65px; padding: 0 37px 0 32px; border-radius: 50px; background: rgba(255, 255, 255, 0.79); cursor: pointer; transition: border-color 0.2s ease; gap: 42px; z-index: 2; min-width: 275px;}
.sub-nav-dropdown-btn p { color: #313131; font-size: 20px; font-weight: 500; line-height: 65px; /* 325% */ flex: 1; text-align: left;}
.sub-nav-dropdown-btn img { transition: transform 0.25s ease; filter: brightness(0); width: 13px;}
.sub-nav-dropdown.is-active .sub-nav-dropdown-btn { /*border-radius: 30px 10px;*/ border-radius:30px 30px 0px 0px; background: #e9f3ff;}
.sub-nav-dropdown.is-active .sub-nav-dropdown-btn img {transform: rotate(180deg);}
.sub-nav-dropdown-list {display: none; flex-direction: column; position: absolute; top: calc(100%); left: 0; min-width: 100%; background: #fff; border-radius: 0 0 30px 10px; box-shadow: 2px 10px 13px rgba(56, 56, 56, 0.1); z-index: 100; padding: 16px 10px 16px; z-index: 1;}
.sub-nav-dropdown.is-active .sub-nav-dropdown-list {display: flex;}
.sub-nav-dropdown-list a {display: flex; align-items: center; gap: 10px; padding: 0 30px;}
.sub-nav-dropdown-list a p {color: #464646; font-size: 19px; font-weight: 500; line-height: 42px; /* 221.053% */display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; flex: 1; max-width: fit-content;}
.sub-nav-dropdown-list a img {filter: brightness(0);}
.sub-nav-dropdown-list a:hover { background: #f5f7ff;}
.sub-nav-dropdown-list a.is-active p { color: #2462c0; text-decoration: underline;}
.sub-nav-dropdown-list a.is-active img {filter: none;}
.sub-title-btns { position: absolute;  bottom: 0; right: 24px; display: flex; align-items: center; gap: 16px; transform: translateY(50%);}
.sub-title-btns button { width: 65px;  height: 65px; background: #fff; border: 1px solid #efefef; border-radius: 100%; display: flex; align-items: center; justify-content: center; filter: drop-shadow(2px 4px 5px rgba(108, 108, 108, 0.15));}
.sub-title .s__container,
.s__row {height: 100%;}

/* 복사 모달 */
.copy-modal-overlay { display: none; position: fixed; inset: 0; background: rgba(0, 0, 0, 0.45); z-index: 9999; align-items: center; justify-content: center;}
.copy-modal-overlay.is-open { display: flex;}
.copy-modal {background: #fff; border-radius: 10px; min-width: 360px; overflow: hidden; box-shadow: 0 6px 30px rgba(0, 0, 0, 0.25);}
.copy-modal-header {padding: 18px 24px; border-bottom: 1px solid #e0e0e0;}
.copy-modal-header p {font-size: 18px; font-weight: 600; color: #222;}
.copy-modal-body {padding: 28px 24px;}
.copy-modal-body p { font-size: 15px; color: #333;}
.copy-modal-footer { padding: 14px 24px; border-top: 1px solid #e0e0e0; display: flex; justify-content: flex-end;}
.copy-modal-confirm { padding: 10px 32px; background: #333; color: #fff; border-radius: 6px; font-size: 15px; font-weight: 500; cursor: pointer;}
.copy-modal-confirm:hover { background: #111;}
.sub-sec-title { color: #1c1c1c; text-align: center; font-size: 37px; font-weight: 700; line-height: 55px; /* 148.649% */ margin-bottom: 55px;}
.sub-tap-wrap { padding: 6px; border-radius: 100px; background: #f9f7f7; display: flex; align-items: center; margin-bottom: 76px;}
.sub-tap-wrap .sub-tap {height: 72px; flex: 1; display: flex; align-items: center; justify-content: center; color: #fff; text-align: center; font-size: 21px; font-weight: 500; letter-spacing: -0.21px; color: #2d2d2d;}
.sub-tap-wrap .sub-tap.is-active { background: #1c60c5;border-radius: 100px; color: #fff;}


@media print {
  @page { margin: 10mm; }
  header,
  .header-nav-dimmed,
  section.sub-title,
  footer,
  .floating-btn,
  .copy-modal-overlay { display: none !important;}
  section.print { display: block !important;}
  body {/* zoom: 0.5; */ -webkit-print-color-adjust: exact; print-color-adjust: exact;}
}



@media all and (max-width: 1024px) {
  .sub-title-text h2:after {display: none;}
  .sub-title-text {flex-direction: column;}
  .sub-title-circle {left: 60%; width: 100px;}
  .sub-title-bg-wrap {width: calc(100vw); border-radius: 0 0 80px 0;}
  .sub-title-text { padding-top: 80px;}
  .sub-title-text h2 {font-size: 30px; line-height: 45px;}
  .sub-title-text p {font-size: 24px; line-height: 36px;}
  .sub-nav-dropdown {flex: 1;}
  .sub-nav-dropdown-btn { min-width: auto; height: 45px; padding: 0 16px; width: 100%; gap: 12px;}
  .sub-nav-dropdown-btn p {font-size: 14px; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;}
  .sub-nav-dropdown-list {padding: 16px;}
  .sub-nav-dropdown-list a {padding: 0;}
  .sub-nav-dropdown-list a p {font-size: 13px; line-height: 33px;}
  .sub-nav-dropdown-list a img {width: 10px;}
  .sub-nav .home {width: 45px; height: 45px;}
  .sub-nav {margin-top: 36px; margin-right: 0; gap: 8px;}
  .sub-nav .home img {width: 16px;}
  .sub-title {height: 300px;}
  .sub-title {margin-top: 80px;}
  .sub-title-btns {display: none;}
  .sub-sec-title { font-size: 32px; margin-bottom: 32px; line-height: 48px;}
  .sub-tap-wrap .sub-tap {height: 40px; font-size: 15px;}
  .sub-tap-wrap {margin-bottom: 62px;}
}

@media all and (max-width: 767px) {}
