:root {
  --main-color: #173B6C;
}

.highlight {color: var(--main-color); font-weight: 700;}
header {padding: 30px 0; margin-bottom: 30px;}
header .inner {display: flex; justify-content: space-between; align-items: center;}
header .inner .logo {width: 120px;}
header .inner .logo a {}
header .inner .logo a img {width: 100%; height: auto;}
header .inner .time_wrap {background: var(--main-color); border-radius: 100px; padding: 12px 25px; color: #fff; font-size: 18px;}
header .inner .time_wrap span {}

section {padding: 80px 0;}
section .inner .title_wrap {margin-bottom: 50px;}
section .inner .title_wrap h1,
section .inner .title_wrap h2 {text-align: center; font-size: 35px; font-weight: 600;}
section .inner .title_wrap h1 b,
section .inner .title_wrap h2 b {color: var(--main-color);}

#section1 {background: linear-gradient(160deg, #FFFFFF 0%, #D9EAF8 45%, #9FBFDC 100%); padding: 0; margin-bottom: 0;}
#section1 .inner {}
#section1 .inner .title_wrap {margin-bottom: 0;}
#section1 .inner .insurance_list {display: flex; align-items: center; justify-content: space-between; font-size: 20px; font-weight: 600; gap: 10px; margin-bottom: 50px;}
#section1 .inner .insurance_list li {border: 1px solid var(--main-color); width: 100%; border-radius: 10px; background: #fff;}
#section1 .inner .insurance_list li a {display: flex; justify-content: center; width: 100%; padding: 10px 0; flex-direction: column; align-items: center; gap: 5px;}
#section1 .inner .insurance_list li a img {height: 40px;}
#section1 .inner .insurance_list li.active {background-color: var(--main-color); border-color: var(--main-color);}
#section1 .inner .insurance_list li.active a {color: #fff;}
#section1 .inner .insurance_list li.active a img {filter: brightness(0) invert(1);}
#section1 .inner .content_wrap {display: flex; align-items: center; gap: 30px;}
#section1 .inner .content_wrap .title_wrap {display: flex; flex-direction: column; align-items: center; gap: 20px; width: 45%;}
#section1 .inner .content_wrap .title_wrap h1 {font-size: 40px; font-weight: 800; text-align: center; line-height: 1.2;}
#section1 .inner .content_wrap .title_wrap img {width: 100%; max-width: 393px; height: auto;}
#section1 .inner .form_wrap {width: 55%; background: #fff; padding: 50px 40px; border-radius: 20px; box-shadow: 0 20px 50px rgba(23, 59, 108, 0.28);}
#section1 .inner .form_wrap h2 {font-size: 28px; text-align: center; font-weight: 700; margin-bottom: 30px;}
#section1 .inner .form_wrap ul {display: flex; flex-direction: column; gap: 12px;}
#section1 .inner .form_wrap ul li {display: flex; align-items: center;}
#section1 .inner .form_wrap ul li.basic_info_item {display: flex; justify-content: space-between; gap: 10px;}
#section1 .inner .form_wrap ul li .name_wrap {display: flex; align-items: center; width: 100%;}
#section1 .inner .form_wrap ul li label {font-size: 22px; font-weight: 500; min-width: 100px;}
#section1 .inner .form_wrap ul li input[type='text'] {background: #f2f2f2; height: 50px; padding: 15px; font-size: 20px; border-radius: 5px; width: 100%;}
#section1 .inner .form_wrap ul li input::placeholder {color: #aaa;}
#section1 .inner .form_wrap ul li select {border: 2px solid #E0E0E0; border-radius: 8px; padding: 10px 12px; font-size: 14px; background-color: #fff; cursor: pointer; transition: border-color 0.3s;}
#section1 .inner .form_wrap ul li select:focus {outline: none; border-color: var(--main-color);}
#section1 .inner .form_wrap ul li select option {padding: 10px;}
#section1 .inner .form_wrap ul li .phone_input_wrap {display: flex; gap: 10px; width: 100%;}
#section1 .inner .form_wrap ul li .phone_select {width: 100px; background: #f2f2f2 url("../img/arrow_down.svg") no-repeat right 12px center; background-size: 24px; height: 50px; padding: 0 40px 0 15px; font-size: 20px; border-radius: 5px; border: none; cursor: pointer; appearance: none; -webkit-appearance: none; -moz-appearance: none;}
#section1 .inner .form_wrap ul li .phone_input {flex: 1;}
#section1 .inner .form_wrap ul li  .gender_wrap {display: flex; gap: 8px; align-items: center;}
#section1 .inner .form_wrap ul li  .gender_wrap input[type="radio"] {display: none;}
#section1 .inner .form_wrap ul li  .gender_wrap label {padding: 0; background: #f2f2f2; border-radius: 5px; cursor: pointer; font-size: 20px; font-weight: 500; transition: all 0.3s; user-select: none; min-width: 0; width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; box-sizing: border-box; flex-shrink: 0;}
#section1 .inner .form_wrap ul li  .gender_wrap input[type="radio"]:checked + label {background: var(--main-color); color: #fff;}
#section1 .inner .form_wrap ul li.agree_item {display: grid; justify-content: center; justify-items: start; gap: 6px; margin-top: 8px;}
#section1 .inner .form_wrap ul li.agree_item > div {display: flex; align-items: center; gap: 8px;}
#section1 .inner .form_wrap ul li.agree_item input[type="checkbox"] {appearance: auto; -webkit-appearance: checkbox; width: 20px; height: 20px; flex-shrink: 0; cursor: pointer; accent-color: var(--main-color);}
#section1 .inner .form_wrap ul li.agree_item label {min-width: 0; font-size: 18px; font-weight: 400; color: #666; cursor: pointer;}
#section1 .inner .form_wrap ul li.agree_item button {font-size: 18px; font-weight: 400; color: #666; cursor: pointer;}
#section1 .inner .form_wrap .submit_btn {width: 100%; background-color: var(--main-color); color: #fff; padding: 16px 20px; font-size: 18px; font-weight: 600; border-radius: 8px; cursor: pointer; margin-top: 20px;}

.banner {background: var(--main-color); padding: 40px 0; text-align: center; color: #fff; font-weight: 600; font-size: 30px;}
.banner .inner {display: flex; align-items: center; justify-content: center; gap: 15px;}
.banner img {width: 60px; filter: brightness(0) invert(1);}

#section2 {border-bottom: 1px solid #ddd;}
#section2 .inner {}
#section2 .inner ul {display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;}
#section2 .inner ul li {border: 1px solid #ddd; border-radius: 10px; padding: 20px; display: flex; align-items: center; justify-content: center; gap: 10px; flex-direction: column;}
#section2 .inner ul li .img_wrap {height: 80px; display: flex; align-items: center;}
#section2 .inner ul li span {text-align: center; display: block; font-size: 24px; margin-bottom: 20px;}
#section2 .inner ul li span b {color: #D32F2F; margin: 0 10px;}
#section2 .inner ul li button {background: var(--main-color); color: #fff; padding: 10px 0; width: 100%; border-radius: 5px;}

#section3 {background: #F5F9FD;}
#section3 .inner {}
#section3 .inner .lead_wrap {background: #fff; border: 1px solid #DCE7F3; border-radius: 20px; padding: 45px 40px; text-align: center; margin-bottom: 70px; box-shadow: 0 12px 30px rgba(23, 59, 108, 0.07);}
#section3 .inner .lead_wrap .lead_label {display: inline-block; background: var(--main-color); color: #fff; font-size: 15px; font-weight: 700; letter-spacing: 0; padding: 7px 18px; border-radius: 100px; margin-bottom: 18px;}
#section3 .inner .lead_wrap h2 {font-size: 35px; font-weight: 600; margin-bottom: 16px;}
#section3 .inner .lead_wrap h2 b {color: var(--main-color); font-weight: 800;}
#section3 .inner .lead_wrap p {font-size: 20px; color: #666; line-height: 1.6;}
#section3 .inner .lead_wrap p b {color: #222; font-weight: 700;}
#section3 .inner .title_wrap {margin-bottom: 50px;}
#section3 .inner .title_wrap h2 {margin-bottom: 16px;}
#section3 .inner .title_wrap h2 b {font-weight: 800;}
#section3 .inner .title_wrap p {text-align: center; font-size: 20px; color: #666; line-height: 1.6;}
#section3 .inner .title_wrap p b {color: #222; font-weight: 700;}
#section3 .inner .point_list {display: grid; grid-template-columns: repeat(6, 1fr); gap: 25px;}
#section3 .inner .point_list li {grid-column: span 2; background: #fff; border: 1px solid #E2EAF4; border-radius: 15px; padding: 35px 30px; transition: all 0.3s;}
#section3 .inner .point_list li:nth-child(4) {grid-column: 2 / span 2;}
#section3 .inner .point_list li:nth-child(5) {grid-column: 4 / span 2;}
#section3 .inner .point_list li:hover {border-color: var(--main-color); transform: translateY(-5px); box-shadow: 0 15px 35px rgba(23, 59, 108, 0.15);}
#section3 .inner .point_list li .num {display: flex; align-items: center; justify-content: center; width: 55px; height: 55px; border-radius: 50%; background: var(--main-color); color: #fff; font-size: 22px; font-weight: 800; letter-spacing: 0; margin-bottom: 20px;}
#section3 .inner .point_list li h3 {font-size: 24px; font-weight: 700; line-height: 1.3; margin-bottom: 14px;}
#section3 .inner .point_list li p {font-size: 18px; color: #777; line-height: 1.6;}
#section3 .inner .point_list li p b {color: var(--main-color); font-weight: 700;}

#section4 {}
#section4 .inner {}
#section4 .inner .title_wrap h2 {font-weight: 700;}
#section4 .inner .content_wrap {display: flex; align-items: flex-start; gap: 60px;}
#section4 .inner .content_wrap .img_wrap {width: 38%; flex-shrink: 0; background: #F5F9FD; border-radius: 20px; padding: 50px 30px; display: flex; align-items: center; justify-content: center; position: sticky; top: 40px;}
#section4 .inner .content_wrap .img_wrap img {width: 100%; max-width: 341px; height: auto;}
#section4 .inner .content_wrap .txt_wrap {width: 62%;}
#section4 .inner .content_wrap .txt_wrap .lead {font-size: 20px; line-height: 1.6; color: #444; padding: 22px 26px; background: #F5F9FD; border-left: 4px solid var(--main-color); border-radius: 0 10px 10px 0; margin-bottom: 35px;}
#section4 .inner .content_wrap .txt_wrap .reason_list {display: flex; flex-direction: column; gap: 28px;}
#section4 .inner .content_wrap .txt_wrap .reason_list li {padding-left: 34px; position: relative;}
#section4 .inner .content_wrap .txt_wrap .reason_list li::before {content: ''; position: absolute; left: 0; top: 7px; width: 20px; height: 20px; border-radius: 50%; background: var(--main-color) url("../img/check.svg") no-repeat center / 12px;}
#section4 .inner .content_wrap .txt_wrap .reason_list li h3 {font-size: 23px; font-weight: 700; margin-bottom: 8px;}
#section4 .inner .content_wrap .txt_wrap .reason_list li p {font-size: 18px; line-height: 1.65; color: #777;}
#section4 .inner .content_wrap .txt_wrap .caution {margin-top: 40px; padding-top: 25px; border-top: 1px solid #e5e5e5; font-size: 15px; line-height: 1.6; color: #999;}

#section5 {padding: 100px 0;}
#section5 .inner .title_wrap {text-align: center; margin-bottom: 50px;}
#section5 .inner .title_wrap .section_label {display: inline-block; font-size: 20px; font-weight: 700; letter-spacing: 1px; margin-bottom: 12px;}
#section5 .inner .title_wrap h2 {font-size: 36px; font-weight: 800; line-height: 1.3;}
#section5 .inner .title_wrap p {font-size: 18px; color: #666; margin-top: 15px;}
#section5 .inner .qna_list {width: 100%; max-width: 900px; margin: 0 auto; border-top: 2px solid #222;}
#section5 .inner .qna_list .qna_item {border-bottom: 1px solid #ddd;}
#section5 .inner .qna_list .qna_item .qna_question {display: flex; align-items: center; width: 100%; padding: 25px 10px; text-align: left; cursor: pointer; background: none; border: none;}
#section5 .inner .qna_list .qna_item .qna_num {font-size: 18px; font-weight: 700; color: var(--main-color); width: 50px; flex-shrink: 0;}
#section5 .inner .qna_list .qna_item .qna_text {font-size: 22px; font-weight: 600; flex: 1;}
#section5 .inner .qna_list .qna_item .qna_arrow {font-size: 28px; font-weight: 300; width: 40px; text-align: center; transition: transform 0.3s;}
#section5 .inner .qna_list .qna_item .qna_answer {display: none; padding: 0 60px 28px;}
#section5 .inner .qna_list .qna_item .qna_answer p {font-size: 18px; line-height: 1.8; color: #666;}
#section5 .inner .qna_list .qna_item.active .qna_arrow {transform: rotate(45deg);}
#section5 .inner .qna_list .qna_item.active .qna_answer {display: block;}

.bottom_wrap { padding:40px 20px; background:#f7f7f7; border-top:1px solid #e5e5e5; }
.bottom_wrap .inner { max-width:1200px; margin:0 auto; }
.bottom_wrap .inner h3 { margin:0 0 20px; font-size:20px; font-weight:700; color:#333; }
.bottom_wrap .inner ul { margin:0; padding:0; list-style:none; }
.bottom_wrap .inner ul li {font-size:15px; line-height:1.8; color:#555; word-break:keep-all; }
.bottom_wrap .inner ul li:last-child { margin-bottom:0; }
.bottom_wrap .inner .compliance_info { margin-top:25px; padding-top:20px; border-top:1px solid #ddd; }
.bottom_wrap .inner .compliance_info p { margin:6px 0; font-size:14px; line-height:1.7; color:#666; }
.bottom_wrap .inner .compliance_info p strong { font-weight:700; color:#444; }

/* ── 푸터 — 사업자 정보는 왼쪽, 약관은 오른쪽. 저작권만 선 아래로 ──
   메인컬러를 따르지 않고 중립 다크를 쓴다.
   랜딩마다 메인컬러가 달라서, 밝은 색이 오면 흰 글씨가 묻히기 때문이다. */
.footer {padding: 54px 20px 44px; background: #252525; color: rgba(255, 255, 255, 0.68);}

.footer_main {display: flex; align-items: flex-start; justify-content: space-between; gap: 40px;}

.footer_info {display: flex; flex-wrap: wrap; align-items: center; gap: 7px 18px; max-width: 760px; font-style: normal; font-size: 14px; line-height: 1.7;}
.footer_info strong {width: 100%; margin-bottom: 2px; color: #fff; font-size: 17px; font-weight: 700; letter-spacing: -0.3px;}
.footer_info span {position: relative;}
.footer_info span + span::before {content: ''; position: absolute; left: -10px; top: 50%; width: 3px; height: 3px; transform: translateY(-50%); border-radius: 50%; background: rgba(255, 255, 255, 0.35);}
.footer_info .addr {flex-basis: 100%;}
.footer_info .addr::before {display: none;}

.footer_links {display: flex; align-items: center; gap: 22px; flex-shrink: 0;}
.footer_links a {position: relative; font-size: 14px; font-weight: 600; color: #fff; transition: opacity 0.15s ease;}
.footer_links a:hover {opacity: 0.65;}
.footer_links a + a::before {content: ''; position: absolute; left: -11px; top: 50%; width: 1px; height: 12px; transform: translateY(-50%); background: rgba(255, 255, 255, 0.28);}

.footer .copyright {margin-top: 30px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, 0.14); font-size: 13px; color: rgba(255, 255, 255, 0.45);}
/* ── 보장 구성 / 확인사항 / 용어 ── */
#section_coverage {background: #F5F9FD;}
#section_coverage .inner .title_wrap,
#section_checklist .inner .title_wrap,
#section_glossary .inner .title_wrap {text-align: center; margin-bottom: 50px;}
#section_coverage .inner .title_wrap .section_label,
#section_checklist .inner .title_wrap .section_label,
#section_glossary .inner .title_wrap .section_label {display: inline-block; font-size: 20px; font-weight: 700; letter-spacing: 1px; color: var(--main-color); margin-bottom: 12px;}
#section_coverage .inner .title_wrap h2,
#section_checklist .inner .title_wrap h2,
#section_glossary .inner .title_wrap h2 {font-size: 36px; font-weight: 800; line-height: 1.3;}
#section_coverage .inner .title_wrap p,
#section_checklist .inner .title_wrap p,
#section_glossary .inner .title_wrap p {font-size: 18px; color: #666; margin-top: 15px; line-height: 1.6;}

#section_coverage .inner .coverage_list {display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px;}
#section_coverage .inner .coverage_list li {background: #fff; border: 1px solid #E2EAF4; border-radius: 15px; padding: 32px 28px; transition: all 0.3s;}
#section_coverage .inner .coverage_list li:hover {border-color: var(--main-color); transform: translateY(-5px); box-shadow: 0 15px 35px rgba(23, 59, 108, 0.15);}
#section_coverage .inner .coverage_list li h3 {font-size: 22px; font-weight: 700; color: var(--main-color); margin-bottom: 14px; line-height: 1.3;}
#section_coverage .inner .coverage_list li p {font-size: 17px; color: #777; line-height: 1.65;}

#section_checklist .inner .checklist {display: flex; flex-direction: column; gap: 20px; max-width: 900px; margin: 0 auto;}
#section_checklist .inner .checklist li {display: flex; align-items: flex-start; gap: 22px; background: #fff; border: 1px solid #E2EAF4; border-radius: 15px; padding: 28px 30px;}
#section_checklist .inner .checklist li .num {display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; flex-shrink: 0; border-radius: 50%; background: var(--main-color); color: #fff; font-size: 19px; font-weight: 800;}
#section_checklist .inner .checklist li .txt h3 {font-size: 22px; font-weight: 700; margin-bottom: 10px; line-height: 1.3;}
#section_checklist .inner .checklist li .txt p {font-size: 17px; color: #777; line-height: 1.65;}

#section_glossary {background: #F5F9FD;}
#section_glossary .inner .glossary_list {display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px;}
#section_glossary .inner .glossary_list .glossary_item {background: #fff; border: 1px solid #E2EAF4; border-radius: 15px; padding: 28px 30px;}
#section_glossary .inner .glossary_list .glossary_item dt {font-size: 21px; font-weight: 700; color: var(--main-color); margin-bottom: 10px;}
#section_glossary .inner .glossary_list .glossary_item dd {font-size: 17px; color: #777; line-height: 1.65;}

/* ══════════════════════════════════════════════════
   모바일 헤더 — 768px 이하에서만 보인다 (PC 헤더와 교대)
   ══════════════════════════════════════════════════ */

.m_header {display: none;}
.m_menu_dim {display: none;}

@media (max-width: 1300px) {
  .inner {width: 93%;}
}

@media (max-width: 1150px) {
  #section1 {
    padding: 80px 0;
  }
  
  #section1 .inner .content_wrap {
    flex-direction: column;
    gap: 0;
  }

  #section1 .inner .form_wrap {
    width: 100%;
  }

  #section1 .inner .content_wrap .title_wrap {
    width: 100%;
  }


}


@media (max-width: 1200px) {

  #section1 {
    padding-top: 80px;
  }

  header {display: none;}

  /* 보종 이동은 모바일 헤더 메뉴가 대신하므로 본문 목록은 숨긴다 */
  #section1 .inner .insurance_list {display: none;}

  /* ── 상단 바 ── */
  .m_header {display: block; position: sticky; top: 0; z-index: 60; background: #fff; box-shadow: 0 2px 12px rgba(23, 59, 108, 0.1);}
  .m_header_bar {display: flex; align-items: center; justify-content: space-between; padding: 12px 18px;}
  .m_header_bar .logo {width: 92px;}
  .m_header_bar .logo a {display: block;}
  .m_header_bar .logo a img {width: 100%; height: auto;}

  /* ── 햄버거 버튼 (열리면 X 로 변한다) ── */
  .m_menu_btn {display: flex; flex-direction: column; justify-content: center; gap: 5px; width: 42px; height: 42px; padding: 0; border: 0; background: none; cursor: pointer;}
  .m_menu_btn span {display: block; width: 24px; height: 2px; margin: 0 auto; border-radius: 2px; background: var(--main-color); transition: transform 0.25s ease, opacity 0.2s ease;}
  .m_menu_btn.open span:nth-child(1) {transform: translateY(7px) rotate(45deg);}
  .m_menu_btn.open span:nth-child(2) {opacity: 0;}
  .m_menu_btn.open span:nth-child(3) {transform: translateY(-7px) rotate(-45deg);}

  /* ── 드롭다운 — 높이를 0 에서 펼쳐 슬라이드처럼 보이게 한다 ── */
  .m_menu {display: grid; grid-template-rows: 0fr; overflow: hidden; background: #fff; border-top: 1px solid #eef1f5; transition: grid-template-rows 0.28s ease;}
  .m_menu.open {grid-template-rows: 1fr;}
  .m_menu_inner {min-height: 0; overflow: hidden;}

  .m_menu_list {display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; padding: 16px 18px 6px;}
  .m_menu_list li {border: 1px solid #dfe4ea; border-radius: 10px; background: #fff; transition: background 0.15s ease, border-color 0.15s ease;}
  .m_menu_list li a {display: flex; align-items: center; gap: 8px; padding: 12px 14px; font-size: 15px; font-weight: 600; color: #333;}
  .m_menu_list li a img {width: 24px; height: 24px; object-fit: contain;}
  .m_menu_list li.active {background: var(--main-color); border-color: var(--main-color);}
  .m_menu_list li.active a {color: #fff;}
  .m_menu_list li.active a img {filter: brightness(0) invert(1);}

  .m_menu_date {padding: 10px 18px 18px; color: #8a94a2; font-size: 13px; text-align: center;}

  /* ── 열렸을 때 뒤를 살짝 덮는다 ── */
  .m_menu_dim {display: block; position: fixed; inset: 0; z-index: 50; background: rgba(23, 59, 108, 0.35); opacity: 0; visibility: hidden; transition: opacity 0.25s ease, visibility 0.25s ease;}
  .m_menu_dim.open {opacity: 1; visibility: visible;}
}

@media (max-width: 900px) {
  #section2 .inner ul {
    grid-template-columns: repeat(3, 1fr);
  }

}

/* 애니메이션을 줄이도록 설정한 기기에서는 즉시 전환한다 */
@media (prefers-reduced-motion: reduce) {
  .m_menu, .m_menu_btn span, .m_menu_dim {transition: none;}
}

@media (max-width: 768px) {
  section {
    padding: 60px 0;
  }
  .m_header_bar .logo a img {
    width: 70px;
  }

  #section1 {
    padding: 60px 0;
  }

  #section1 .inner .content_wrap .title_wrap img {
    max-width: 340px;
  }
  .banner {
    padding: 30px 0;
    font-size: 25px;
  }
  .banner .inner {
    flex-direction: column;
  }
  .banner img {
    width: 45px;
  }

  section .inner .title_wrap h1, section .inner .title_wrap h2 {
    font-size: 30px;
  }

  #section2 .inner ul {
    grid-template-columns: repeat(2, 1fr);
  }

}

@media (max-width: 550px) {
  #section1 .inner .content_wrap .title_wrap h1 {
    font-size: 28px;
  }

  #section1 .inner .content_wrap .title_wrap img {
    max-width: 270px;
  }
  #section1 .inner .form_wrap h2 {
    font-size: 22px;
  }
  #section1 .inner .form_wrap {
    padding: 30px;
  }
  #section1 .inner .form_wrap ul li label, #section1 .inner .form_wrap ul li input[type='text'], #section1 .inner .form_wrap ul li .phone_select, #section1 .inner .form_wrap ul li .gender_wrap label {
    font-size: 18px;
  }
  #section1 .inner .form_wrap ul li label {
    min-width: 70px;
  }
}


@media (max-width: 450px) {
  #section1 .inner .content_wrap .title_wrap h1 {
    font-size: 28px;
  }

  #section1 .inner .content_wrap .title_wrap img {
    max-width: 270px;
  }
  #section1 .inner .form_wrap h2 {
    font-size: 22px;
  }
  #section1 .inner .form_wrap {
    padding: 30px 20px;
  }
  #section1 .inner .form_wrap ul li label, #section1 .inner .form_wrap ul li input[type='text'], #section1 .inner .form_wrap ul li .phone_select, #section1 .inner .form_wrap ul li .gender_wrap label, #section1 .inner .form_wrap .submit_btn {
    font-size: 16px;
  }
  #section1 .inner .form_wrap ul li label {
    min-width: 65px;
  }
    #section2 .inner ul {
    grid-template-columns: repeat(1, 1fr);
  }
}


/* ══════ section3 반응형 ══════ */

@media (max-width: 1200px) {
  #section3 .inner .lead_wrap {
    padding: 38px 32px;
    margin-bottom: 55px;
  }

  #section3 .inner .point_list {
    gap: 20px;
  }

  #section3 .inner .point_list li {
    padding: 30px 26px;
  }

  #section3 .inner .point_list li h3 {
    font-size: 22px;
  }
}


@media (max-width: 900px) {
  #section3 .inner .lead_wrap h2,
  #section3 .inner .title_wrap h2 {
    font-size: 28px;
  }

  #section3 .inner .lead_wrap p,
  #section3 .inner .title_wrap p {
    font-size: 18px;
  }

  #section3 .inner .title_wrap {
    margin-bottom: 40px;
  }

  /* 6칸 격자를 2칸으로. 마지막 하나는 가운데로 보낸다 */
  #section3 .inner .point_list {
    grid-template-columns: repeat(2, 1fr);
  }

  #section3 .inner .point_list li,
  #section3 .inner .point_list li:nth-child(4) {
    grid-column: auto;
  }

  #section3 .inner .point_list li:nth-child(5) {
    grid-column: 1 / -1;
    width: calc(50% - 10px);
    margin: 0 auto;
  }
}


@media (max-width: 768px) {
  #section3 .inner .lead_wrap {
    padding: 32px 24px;
    margin-bottom: 45px;
    border-radius: 16px;
  }

  #section3 .inner .lead_wrap .lead_label {
    font-size: 14px;
    padding: 6px 15px;
    margin-bottom: 14px;
  }

  /* 한 칸으로 세운다 */
  #section3 .inner .point_list {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  #section3 .inner .point_list li:nth-child(5) {
    width: 100%;
  }

  #section3 .inner .point_list li {
    padding: 26px 22px;
    border-radius: 12px;
  }

  /* 손가락 조작에는 hover 가 없어 떠오르는 효과를 끈다 */
  #section3 .inner .point_list li:hover {
    transform: none;
    box-shadow: none;
    border-color: #E2EAF4;
  }
}


@media (max-width: 550px) {
  #section3 .inner .lead_wrap h2,
  #section3 .inner .title_wrap h2 {
    font-size: 23px;
  }

  #section3 .inner .lead_wrap p,
  #section3 .inner .title_wrap p {
    font-size: 16px;
  }

  /* PC 기준으로 넣은 줄바꿈이 좁은 화면에서는 어색하게 끊긴다 */
  #section3 .inner .lead_wrap p br,
  #section3 .inner .title_wrap p br,
  #section3 .inner .point_list li p br {
    display: none;
  }

  #section3 .inner .point_list li .num {
    width: 46px;
    height: 46px;
    font-size: 19px;
    margin-bottom: 16px;
  }

  #section3 .inner .point_list li h3 {
    font-size: 19px;
    margin-bottom: 10px;
  }

  #section3 .inner .point_list li p {
    font-size: 16px;
  }
}


/* ══════ section4 반응형 ══════ */

@media (max-width: 1200px) {
  #section4 .inner .content_wrap {
    gap: 40px;
  }

  #section4 .inner .content_wrap .img_wrap {
    padding: 40px 24px;
  }

  #section4 .inner .content_wrap .txt_wrap .reason_list li h3 {
    font-size: 21px;
  }
}


@media (max-width: 900px) {
  /* 좌우 배치를 위아래로 세운다 */
  #section4 .inner .content_wrap {
    flex-direction: column;
    gap: 35px;
  }

  #section4 .inner .content_wrap .img_wrap,
  #section4 .inner .content_wrap .txt_wrap {
    width: 100%;
  }

  /* 세로로 쌓이면 이미지가 따라다닐 이유가 없다 (모바일 헤더와도 겹친다) */
  #section4 .inner .content_wrap .img_wrap {
    position: static;
    padding: 35px 24px;
  }

  #section4 .inner .content_wrap .img_wrap img {
    max-width: 280px;
  }

  #section4 .inner .content_wrap .txt_wrap .lead {
    font-size: 18px;
    padding: 18px 20px;
    margin-bottom: 30px;
  }

  #section4 .inner .content_wrap .txt_wrap .reason_list {
    gap: 24px;
  }
}


@media (max-width: 768px) {
  #section4 .inner .content_wrap {
    gap: 28px;
  }

  #section4 .inner .content_wrap .img_wrap {
    padding: 28px 20px;
    border-radius: 16px;
  }

  #section4 .inner .content_wrap .img_wrap img {
    max-width: 240px;
  }

  #section4 .inner .content_wrap .txt_wrap .reason_list li {
    padding-left: 30px;
  }

  #section4 .inner .content_wrap .txt_wrap .reason_list li h3 {
    font-size: 19px;
  }

  #section4 .inner .content_wrap .txt_wrap .reason_list li p {
    font-size: 17px;
  }
}


@media (max-width: 550px) {
  #section4 .inner .content_wrap .txt_wrap .lead {
    font-size: 16px;
    padding: 16px 18px;
    margin-bottom: 26px;
  }

  /* PC 기준 줄바꿈이 좁은 화면에서는 어색하게 끊긴다 */
  #section4 .inner .content_wrap .txt_wrap .lead br,
  #section4 .inner .content_wrap .txt_wrap .reason_list li p br {
    display: none;
  }

  #section4 .inner .content_wrap .txt_wrap .reason_list {
    gap: 20px;
  }

  #section4 .inner .content_wrap .txt_wrap .reason_list li {
    padding-left: 27px;
  }

  #section4 .inner .content_wrap .txt_wrap .reason_list li::before {
    top: 5px;
    width: 18px;
    height: 18px;
    background-size: 11px;
  }

  #section4 .inner .content_wrap .txt_wrap .reason_list li h3 {
    font-size: 18px;
  }

  #section4 .inner .content_wrap .txt_wrap .reason_list li p {
    font-size: 16px;
  }

  #section4 .inner .content_wrap .txt_wrap .caution {
    margin-top: 32px;
    padding-top: 20px;
    font-size: 14px;
  }
}


/* ══════ section_coverage 반응형 ══════
   제목 부분은 checklist · glossary 와 같은 규칙을 쓰므로 함께 줄인다 */

@media (max-width: 1200px) {
  #section_coverage .inner .title_wrap h2,
  #section_checklist .inner .title_wrap h2,
  #section_glossary .inner .title_wrap h2 {
    font-size: 31px;
  }

  #section_coverage .inner .coverage_list {
    gap: 20px;
  }

  #section_coverage .inner .coverage_list li {
    padding: 28px 24px;
  }
}


@media (max-width: 900px) {
  #section_coverage .inner .title_wrap,
  #section_checklist .inner .title_wrap,
  #section_glossary .inner .title_wrap {
    margin-bottom: 40px;
  }

  #section_coverage .inner .title_wrap h2,
  #section_checklist .inner .title_wrap h2,
  #section_glossary .inner .title_wrap h2 {
    font-size: 27px;
  }

  #section_coverage .inner .title_wrap p,
  #section_checklist .inner .title_wrap p,
  #section_glossary .inner .title_wrap p {
    font-size: 17px;
  }

  /* 3칸 → 2칸 */
  #section_coverage .inner .coverage_list {
    grid-template-columns: repeat(2, 1fr);
  }

  #section_coverage .inner .coverage_list li h3 {
    font-size: 20px;
  }
}


@media (max-width: 768px) {
  #section_coverage .inner .title_wrap .section_label,
  #section_checklist .inner .title_wrap .section_label,
  #section_glossary .inner .title_wrap .section_label {
    font-size: 17px;
  }

  /* 한 칸으로 세운다 */
  #section_coverage .inner .coverage_list {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  #section_coverage .inner .coverage_list li {
    padding: 24px 20px;
    border-radius: 12px;
  }

  /* 손가락 조작에는 hover 가 없어 떠오르는 효과를 끈다 */
  #section_coverage .inner .coverage_list li:hover {
    transform: none;
    box-shadow: none;
    border-color: #E2EAF4;
  }
}


@media (max-width: 550px) {
  #section_coverage .inner .title_wrap h2,
  #section_checklist .inner .title_wrap h2,
  #section_glossary .inner .title_wrap h2 {
    font-size: 23px;
  }

  #section_coverage .inner .title_wrap p,
  #section_checklist .inner .title_wrap p,
  #section_glossary .inner .title_wrap p {
    font-size: 16px;
  }

  /* PC 기준 줄바꿈이 좁은 화면에서는 어색하게 끊긴다 */
  #section_coverage .inner .title_wrap p br,
  #section_coverage .inner .coverage_list li p br {
    display: none;
  }

  #section_coverage .inner .coverage_list li h3 {
    font-size: 18px;
    margin-bottom: 10px;
  }

  #section_coverage .inner .coverage_list li p {
    font-size: 16px;
  }
}


/* ══════ section_checklist · section_glossary 목록 반응형 ══════ */

@media (max-width: 1200px) {
  #section_checklist .inner .checklist li,
  #section_glossary .inner .glossary_list .glossary_item {
    padding: 24px 24px;
  }

  #section_checklist .inner .checklist li .txt h3 {
    font-size: 20px;
  }

  #section_glossary .inner .glossary_list .glossary_item dt {
    font-size: 19px;
  }
}


@media (max-width: 900px) {
  #section_checklist .inner .checklist {
    gap: 16px;
  }

  #section_checklist .inner .checklist li {
    gap: 18px;
  }

  #section_checklist .inner .checklist li .num {
    width: 42px;
    height: 42px;
    font-size: 17px;
  }

  /* 용어는 2칸을 1칸으로 — 좁아지면 한 줄에 두 개가 답답하다 */
  #section_glossary .inner .glossary_list {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}


@media (max-width: 768px) {
  #section_checklist .inner .checklist li,
  #section_glossary .inner .glossary_list .glossary_item {
    padding: 22px 20px;
    border-radius: 12px;
  }

  #section_checklist .inner .checklist li {
    gap: 15px;
  }

  #section_checklist .inner .checklist li .txt h3 {
    font-size: 19px;
  }

  #section_checklist .inner .checklist li .txt p,
  #section_glossary .inner .glossary_list .glossary_item dd {
    font-size: 16px;
  }
}


@media (max-width: 550px) {
  /* 번호를 글 위로 올려 본문 폭을 확보한다 */
  #section_checklist .inner .checklist li {
    flex-direction: column;
    gap: 12px;
  }

  #section_checklist .inner .checklist li .num {
    width: 36px;
    height: 36px;
    font-size: 15px;
  }

  #section_checklist .inner .checklist li .txt h3 {
    font-size: 18px;
    margin-bottom: 8px;
  }

  #section_glossary .inner .glossary_list .glossary_item dt {
    font-size: 18px;
  }

  /* PC 기준 줄바꿈이 좁은 화면에서는 어색하게 끊긴다 */
  #section_checklist .inner .title_wrap p br,
  #section_checklist .inner .checklist li .txt p br,
  #section_glossary .inner .title_wrap p br,
  #section_glossary .inner .glossary_list .glossary_item dd br {
    display: none;
  }
}


/* ══════ section5 (자주 묻는 질문) 반응형 ══════ */

@media (max-width: 1200px) {
  #section5 {
    padding: 80px 0;
  }

  #section5 .inner .title_wrap h2 {
    font-size: 31px;
  }
}


@media (max-width: 900px) {
  #section5 .inner .title_wrap {
    margin-bottom: 40px;
  }

  #section5 .inner .title_wrap h2 {
    font-size: 27px;
  }

  #section5 .inner .title_wrap p {
    font-size: 17px;
  }

  #section5 .inner .qna_list .qna_item .qna_text {
    font-size: 19px;
  }

  #section5 .inner .qna_list .qna_item .qna_answer {
    padding: 0 50px 24px;
  }
}


@media (max-width: 768px) {
  #section5 {
    padding: 60px 0;
  }

  #section5 .inner .title_wrap .section_label {
    font-size: 17px;
  }

  #section5 .inner .qna_list .qna_item .qna_question {
    padding: 20px 4px;
  }

  #section5 .inner .qna_list .qna_item .qna_num {
    width: 36px;
    font-size: 16px;
  }

  #section5 .inner .qna_list .qna_item .qna_text {
    font-size: 17px;
    line-height: 1.4;
  }

  #section5 .inner .qna_list .qna_item .qna_arrow {
    width: 28px;
    font-size: 24px;
  }

  #section5 .inner .qna_list .qna_item .qna_answer {
    padding: 0 4px 22px 40px;
  }

  #section5 .inner .qna_list .qna_item .qna_answer p {
    font-size: 16px;
    line-height: 1.7;
  }
}


@media (max-width: 550px) {
  #section5 .inner .title_wrap h2 {
    font-size: 23px;
  }

  #section5 .inner .title_wrap p {
    font-size: 16px;
  }

  /* 번호를 없애고 질문이 폭을 다 쓰게 한다 */
  #section5 .inner .qna_list .qna_item .qna_num {
    display: none;
  }

  #section5 .inner .qna_list .qna_item .qna_text {
    font-size: 16px;
  }

  #section5 .inner .qna_list .qna_item .qna_answer {
    padding: 0 4px 20px;
  }

  #section5 .inner .title_wrap p br {
    display: none;
  }
}


/* ══════ 신청 유도 버튼 (폼이 화면 밖에 있을 때만 보인다) ══════
   PC 는 우측 하단 알약형, 모바일은 하단 전체 바 */

.to_top {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 40;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 26px;
  border: 0;
  border-radius: 100px;
  background: var(--main-color);
  box-shadow: 0 10px 28px rgba(23, 59, 108, 0.35);
  color: #fff;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -0.3px;
  cursor: pointer;

  /* 평소에는 숨어 있다가 폼이 화면 밖으로 나가면 떠오른다 */
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: opacity 0.25s ease, visibility 0.25s ease, transform 0.25s ease;
}

.to_top.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.to_top:hover {
  filter: brightness(1.1);
}

/* 어두운 푸터 위에 올라오면 색이 묻히므로 반대로 뒤집는다 */
.to_top.on_dark {
  background: #fff;
  color: var(--main-color);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.3);
}

.to_top.on_dark svg {
  stroke: var(--main-color);
}

.to_top svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: #fff;
  stroke-width: 2.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* 모바일 — 하단 전체를 덮는 바로 바꾼다 (엄지로 누르기 쉬운 자리) */
@media (max-width: 768px) {
  .to_top {
    right: 0;
    left: 0;
    bottom: 0;
    justify-content: center;
    width: 100%;
    padding: 18px 20px;
    border-radius: 0;
    box-shadow: 0 -6px 20px rgba(23, 59, 108, 0.22);
    font-size: 18px;

    /* 바는 아래에서 밀려 올라온다 */
    transform: translateY(100%);
  }

  .to_top.show {
    transform: translateY(0);
  }

  /* 바가 페이지 마지막 내용을 가리지 않도록 아래 여백을 준다 */
  .footer {
    padding: 38px 20px 92px;
  }

  /* 좁은 화면에서는 위아래로 쌓는다 */
  .footer_main {
    flex-direction: column;
    gap: 22px;
  }

  .footer_info {
    gap: 5px 16px;
    margin-top: 20px;
    font-size: 13.5px;
  }

  .footer .copyright {
    margin-top: 18px;
    font-size: 12.5px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .to_top {
    transition: none;
  }
}


/* ══════ 약관 문서 페이지 (개인정보처리방침 · 이용약관) ══════ */

.doc_page {padding: 70px 0 90px;}
.doc_page .inner {max-width: 860px;}

.doc_back {display: inline-block; margin-bottom: 20px; color: #888; font-size: 14px; transition: color 0.15s ease;}
.doc_back:hover {color: var(--main-color);}

.doc_page h1 {padding-bottom: 24px; border-bottom: 2px solid #222; font-size: 32px; font-weight: 800; letter-spacing: -0.5px;}

.doc_body {padding-top: 34px; color: #555; font-size: 16px; line-height: 1.8; word-break: keep-all;}
.doc_body h3 {margin: 40px 0 14px; color: #222; font-size: 19px; font-weight: 700;}
.doc_body h3:first-child {margin-top: 0;}
.doc_body p {margin-bottom: 14px;}
.doc_body a {color: var(--main-color); font-weight: 600; text-decoration: underline;}

.doc_body ul {margin: 0 0 14px; padding-left: 4px; list-style: none;}
.doc_body ul li {position: relative; padding-left: 15px; margin-bottom: 7px;}
.doc_body ul li::before {content: ''; position: absolute; left: 0; top: 12px; width: 4px; height: 4px; border-radius: 50%; background: #bbb;}

.doc_body table {width: 100%; margin: 0 0 18px; border-top: 2px solid var(--main-color); border-collapse: collapse;}
.doc_body table th,
.doc_body table td {padding: 14px 16px; border-bottom: 1px solid #e8ecf1; font-size: 15px; line-height: 1.7; text-align: left; vertical-align: top;}
.doc_body table th {width: 150px; background: #f7f9fc; color: #333; font-weight: 700;}

.doc_body .note {padding: 16px 18px; border-radius: 10px; background: #f5f7fa; color: #666; font-size: 14.5px; line-height: 1.75;}

@media (max-width: 768px) {
  .doc_page {padding: 40px 0 70px;}
  .doc_page h1 {padding-bottom: 18px; font-size: 24px;}
  .doc_body {padding-top: 26px; font-size: 15px;}
  .doc_body h3 {margin: 32px 0 12px; font-size: 17px;}

  /* 좁은 화면에서는 표를 위아래로 푼다 — 라벨을 위, 값을 아래로 */
  .doc_body table,
  .doc_body table tbody,
  .doc_body table tr,
  .doc_body table th,
  .doc_body table td {display: block; width: 100%;}

  /* 머리글(구분·내용)은 칸이 사라지면 의미가 없다 */
  .doc_body table tr:first-child {display: none;}

  .doc_body table tr {padding: 13px 0; border-bottom: 1px solid #e8ecf1;}
  .doc_body table tr:last-child {border-bottom: 0;}

  /* 칸마다 있던 선과 여백을 없앤다 — 줄 사이 선은 tr 이 담당한다 */
  .doc_body table th,
  .doc_body table td {padding: 0; border: 0;}

  .doc_body table th {margin-bottom: 4px; background: none; color: #888; font-size: 13.5px; font-weight: 600;}
  .doc_body table td {font-size: 14.5px; color: #555;}

  .doc_body .note {font-size: 13.5px;}
}
