/* ===== Sub Visual ===== */
.sub_visual{ position: relative; min-height: 300px; overflow: hidden; }
.sub_visual_bg{ position:absolute; inset:0; background-position:center; background-size:cover; background-repeat:no-repeat; }
  /* 페이지별 */
.sub_visual_bg--v01{ background-image:url("/ibuilder/template/theme_skin/theme130/renewal/images/sub/sub_v01.jpg"); }
.sub_visual_bg--v02{ background-image:url("/ibuilder/template/theme_skin/theme130/renewal/images/sub/sub_v02.jpg"); }
.sub_visual_bg--v03{ background-image:url("/ibuilder/template/theme_skin/theme130/renewal/images/sub/sub_v03.jpg"); }
.sub_visual_bg--v04{ background-image:url("/ibuilder/template/theme_skin/theme130/renewal/images/sub/sub_v04.jpg"); }
.sub_visual_bg--v05{ background-image:url("/ibuilder/template/theme_skin/theme130/renewal/images/sub/sub_v05.jpg"); }
.sub_visual_bg--my01{ background-image:url("/ibuilder/template/theme_skin/theme130/renewal/images/sub/sub_my01.jpg"); }


/* ==============================
    Sub Layout (LNB + Content)
   ============================== */
.sub_layout{ max-width: 1300px; margin: 0 auto; padding: 0 20px; display: flex; gap: 40px; align-items: flex-start; }
.lnb{ width: 220px; flex: 0 0 220px; margin-top: -80px;}
.sub_content{  flex: 1 1 auto; min-width: 0; width: auto;}
.sub_zone{padding:60px 0 100px;}

/* ==============================
    LNB
    ============================== */
.lnb{ position: relative; }
.lnb_head{background-color: #1f5fbf; border-radius: 50px 50px 50px 10px; height: 150px; display: inline-flex; width: 100%; justify-content: center; align-items: center; background-image: url(/ibuilder/template/theme_skin/theme130/renewal/images/common/mjc_lnb.png); background-repeat: no-repeat; background-position: left -30px bottom -20px; background-size: 150px auto;}
.lnb_title{font-family: 'NexonLv1Gothic'; color: #fff; font-size: 3.2rem; font-weight: 700; line-height: 1.2; text-align: center; }
.lnb_title span{font-size: 2.6rem;}
.lnb_nav{ margin-top: 10px; background: #fff; border-radius: 10px; overflow: hidden; }

.lnb_list{ list-style: none; margin: 0; padding: 0; }
.lnb_list > li + li{ border-top: 1px solid #efefef; }
.lnb_list > li:last-child{border-bottom: 1px solid #efefef;}
.lnb_list .is_active > a{ box-shadow: inset 0 -1px 0 #002967;}
.lnb_list a{ position: relative; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 8px 14px 16px; color: #222; text-decoration: none; font-size: 15px; line-height: 1.3; }
.lnb_list a i{ font-size: 18px; color: #002967; flex: 0 0 auto; opacity: 0; transform: translateX(-2px); transition: opacity .15s ease, transform .15s ease; }
    /* hover / focus */
.lnb_list a:hover,
.lnb_list a:focus-visible{ background: #f5f9ff; outline: none; }
    /* 활성 */
.lnb_list .is_active > a{ font-weight: 700; color: #002967;}
.lnb_list .is_active > a i{ opacity: 1; transform: translateX(0); }
  /* 키보드 포커스 테두리(접근성) */
.lnb_list a:focus-visible{ box-shadow: 0 0 0 3px rgba(31,95,191,.25); }

/* ==============================
    페이지 헤더
    ============================== */
    
.page_headbar{padding:15px 0 15px; display: flex; justify-content: space-between;}
.page_title_wrap{ padding-bottom: 20px; border-bottom: 1px solid #c6c6c6; }
.page_title{ font-size: 3.2rem; font-weight: 700; color: #111;}
.page_path{ display:flex; align-items:center; gap:8px; font-size:1.4rem; color:#6b7280; }
.page_path a{ color:#6b7280; }
.page_path a:hover, .page_path a:focus{ text-decoration:underline; }
.path_home::before{ content:""; display:inline-block; width:14px; height:13px; margin-right:4px; background:url(/ibuilder/template/theme_skin/theme130/renewal/images/common/icon_home.png) no-repeat center/contain; vertical-align:-2px; } 
.font_size_wrap{ display:flex; align-items:center; gap:10px; }
.fs_label{ font-size:1.3rem; color:#777; }
.fs_pill{ display:inline-flex; align-items:center; gap:12px; padding:4px 10px; border-radius:999px; background:#efefef; border:1px solid #e2e2e2; box-shadow: inset 0 1px 0 rgba(255,255,255,.9); }
.fs_btn{ width:28px; height:28px; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:#fff; border:1px solid #d9d9d9; font-size:18px; line-height:1; color:#333; box-shadow:0 1px 2px rgba(0,0,0,.06); transition:background .15s ease, transform .1s ease; }
.fs_btn:hover, .fs_btn:focus{ background:#f8f8f8; outline:0; }
.fs_btn:active{ transform:translateY(1px); }

/* ==============================
    만족도 조사 영역
   ============================== */
.satis_box{ margin-top: 60px; background: #f5f7fb; border: 1px solid #e5e8ee; border-radius: 18px; padding: 26px 28px; display: flex; justify-content: space-between; gap: 24px; }
.satis_left{ display: flex; gap: 18px; align-items: flex-start; min-width: 0; }
.satis_icon{ width: 46px; flex: 0 0 auto; margin-top: 2px; }
.satis_icon img{ display: block; width: 100%; height: auto; }
.satis_q{ min-width: 0; }
.satis_title{ margin: 0 0 12px; font-size: 1.6rem; font-weight: 700; color: #222; }
.satis_rate{ margin: 0; padding: 0; border: 0; display: flex; gap: 18px; flex-wrap: wrap; }
.satis_opt{ display: inline-flex; align-items: center; gap: 8px; font-size: 1.4rem; color: #444; cursor: pointer; }
.satis_opt input[type="radio"]{ width: 16px; height: 16px; accent-color: #002967; cursor: pointer; }
.satis_right{ flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.satis_form{ display: flex; align-items: center; gap: 10px; }
.satis_input{ width: 360px; max-width: 45vw; height: 44px; padding: 0 14px; border: 1px solid #d8dbe3; border-radius: 8px; font-size: 1.4rem; outline: none; background: #fff; }
.satis_input:focus-visible{ border-color: #002967; box-shadow: 0 0 0 3px rgba(0,41,103,.15); }
.satis_btn{display: inline-flex; align-items: center; justify-content: center; height: 44px; padding: 0 16px; border: 0; border-radius: 8px; background: #002967; color: #fff; font-size: 1.4rem; font-weight: 700; cursor: pointer;}
.satis_btn:hover,
.satis_btn:focus-visible{ filter: brightness(0.95);}
.satis_info{ display: flex; align-items: center; gap: 18px; color: #666; font-size: 1.3rem; }
.satis_meta{ display: inline-flex; align-items: center; gap: 6px; }
.satis_meta img{ width: 14px; height: 14px; display: block; }
  

  

/* ==============================
    센터소개
   ============================== */
    /* 소개 */
.con01_body01{}
.cen_intro{ padding-top: 10px; }
.cen_intro_head{ display: flex; gap: 40px; align-items: flex-start; margin-bottom: 18px; padding:10px 50px;}
.cen_intro_icon{ width: 138px; flex: 0 0 auto; }
.cen_intro_icon img{ width: 100%; height: auto; display: block;}
.cen_intro_txt{ flex: 1; min-width: 0; }
.cen_intro_desc{ margin: 0; font-size: 1.7rem; color: #444; line-height: 1.7; }
.cen_intro_desc + .cen_intro_desc{ margin-top: 6px; }
.cen_intro_desc:last-child{color:#333; font-weight: 500;} 
.cen_intro_str{ color: #002967; font-size: 2rem; font-weight: 600; }
.cen_intro_media{ max-height: 450px; border-radius: 20px; }
.cen_intro_media img{ width: 100%; height: auto; max-height: 450px; object-fit: cover; display: block; border-radius: 20px; }
    /* 센터사람들 */
.con01_body02{}
    /* 이용안내 */
.con01_body03{}
.useinfo_box{ display: flex; align-items: center; gap: 30px; padding: 26px 30px; border-radius: 20px; background: #f1f5fc; }
.useinfo_icon{ width: 120px; flex: 0 0 auto; }
.useinfo_icon img{ width: 100%; height: auto; display: block; }
.useinfo_body{ flex: 1; min-width: 0; display: flex; align-items: flex-start; gap: 30px; }
.useinfo_title{ margin: 2px 0 0; font-size: 2rem; font-weight: 700; color: #111; white-space: nowrap; }
.useinfo_list{ list-style: none; margin: 0; padding: 0; display: grid; gap:10px; }
.useinfo_item{ display: flex; align-items: center; gap: 15px; min-width: 0; }
.useinfo_badge{ display: inline-flex; align-items: center; justify-content: center; min-width: 80px; height: 28px; padding: 0 12px; border-radius: 999px; background: #fff; border: 1px solid #cfe0ff; color: #0e3b8b; font-size: 1.4rem; font-weight: 600; flex: 0 0 auto; }
.useinfo_text{ font-size: 1.5rem; color: #333; line-height: 1.5; min-width: 0; }
.use_service_wrap{ margin-top: 22px; }
.use_service_title{ margin: 0 0 18px; font-size: 2rem; font-weight: 800; color: #111; }
.use_service_list{ list-style: none; margin: 0; padding: 0; border-top: 1px solid #e6e8ee; }
.use_service_item{ display: grid; grid-template-columns: 260px 1fr; gap: 40px; padding: 28px 0; border-bottom: 1px solid #e6e8ee; align-items: start; }
.use_service_left{ min-width: 0; }
.use_service_head{ display: flex; align-items: flex-start; gap: 18px; }
.use_service_name{ margin: 0; font-size: 1.8rem; font-weight: 600; color: #111; line-height: 1.25; min-width: 100px; }
.use_service_icon{ width: 137px; height: 136px; border-radius: 50px 50px 10px 50px; background: #f2f2f2; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.use_service_icon img{ width: 90px; height: auto; display: block; }
.use_service_right{ min-width: 0; }
.use_service_lead{ margin: 0 0 14px; font-size: 1.6rem; font-weight: 700; color: #222; line-height: 1.55; }
.use_service_desc{ margin: 0 0 10px; font-size: 1.5rem; color: #444; line-height: 1.5; }
.use_step_list{ margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; counter-reset: useStep; }
.use_step_item{ position: relative; padding-left: 34px; font-size: 1.5rem; color: #333; line-height: 1.5; counter-increment: useStep; }
.use_step_item::before{ content: counter(useStep); position: absolute; left: 0; top: 2px; width: 20px; height: 20px; border-radius: 50%; background: #e7ebf2; color: #333333; font-weight: 600; font-size: 1.2rem; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; border:1px solid #b9bfca;}
/* contact pill */
.use_service_contact{ display: inline-flex; align-items: center; gap: 8px; padding: 10px 12px;}
.use_contact_label{ vertical-align: middle; }
.use_contact_link{}
.use_contact_link:focus-visible{ outline: none; box-shadow: 0 0 0 3px rgba(0,41,103,.18); border-radius: 6px; }
.map_box{margin-top: 20px;}
.map_info_bar{ display: flex; justify-content: center; align-items: center; gap: 120px; padding: 18px 0; }
.map_info_item{ display: inline-flex; align-items: center; gap: 10px; }
.map_info_ico{ width: 18px; height: 18px; background-repeat: no-repeat; background-position: center; background-size: contain; flex: 0 0 auto; }
.map_info_ico--tel{ background-image: url("/ibuilder/template/theme_skin/theme130/renewal/images/sub/icon_tel.png"); }
.map_info_ico--map{ background-image: url("/ibuilder/template/theme_skin/theme130/renewal/images/sub/icon_map.png"); }
.map_info_txt{ display: inline-flex; align-items: center; gap: 6px; font-size: 1.5rem; color: #222;}
.map_info_key{ font-weight: 700; color: #222; }
.map_info_val{ font-weight: 500; color: #333; }
/**/
.con01_body04{}
.con01_body04 .consult_tit{font-size: 1.8rem; font-weight: 600; line-height: 1.5;}
.con01_body04 .sc_intro{margin-bottom:30px ;}
/* ==============================
    상담 및 심리검사
   ============================== */
   /*개인상담*/
.counsel_intro{ }
.counsel_title{ margin: 50px 0 20px; font-size: 2.2rem; font-weight: 800; color: #1f5fbf; position: relative; padding-left: 10px;}
.counsel_title:nth-of-type(1){margin:0 0 20px;}
.counsel_title::before{content: ""; position: absolute; left: 0; top: 0; width: 6px; height: 1.1em; background: #4472C4; border-radius: 2px;}
.counsel_desc{ margin: 0 0 30px; font-size: 1.6rem; color: #444; line-height: 1.7; }
.counsel_area_list{ list-style: none; margin:20px 0 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.counsel_area_item{ position: relative; background: #f6f6f6; border-radius: 14px; padding: 24px 26px; display: flex; justify-content: space-between; gap: 20px; min-height: 150px; }
.counsel_area_item--full{ grid-column: 1 / -1; }
.counsel_area_text{ min-width: 0; padding-right: 90px; }
.counsel_area_name{ display: block; margin-bottom: 8px; font-size: 1.7rem; font-weight: 600; color: #111; }
.counsel_area_desc{ margin: 0; font-size: 1.5rem; color: #444; line-height: 1.6; list-style: none; margin-top: 5px;}
.counsel_area_desc li{position: relative; padding-left: 8px; font-size: 1.5rem; color: #444; line-height: 1.6;}
.counsel_area_desc li::before{ content: '·'; position: absolute; left: 0; top: 0; color: #444; }
.counsel_area_desc li + li{margin-top: 7px;}
.counsel_area_icon{ position: absolute; right: 20px; bottom: 20px; width: 85px; height:80px; flex: 0 0 auto; }
.counsel_cta{ margin-top: 40px; text-align: center; }
.btn_counsel_apply{ display: inline-flex; align-items: center; justify-content: center; min-width: 220px; height: 56px; padding: 0 32px; border-radius: 12px; background: #002967; color: #fff; font-size: 1.7rem; font-weight: 700; text-decoration: none; }
.btn_counsel_apply:hover{ filter: brightness(0.95); }
.btn_counsel_apply:active{ transform: translateY(1px); }
.btn_counsel_apply:focus,
.btn_counsel_apply:focus-visible{ outline: 3px dotted red; outline-offset: 3px; }
.counsel_area_icon img{ width: 100%; height: 100%; object-fit: contain; display: block; }
.counsel_area_desc li .counsel_badge{ display: block; margin-top: 8px; }
.counsel_badge{ height: 24px; padding: 0 10px; border-radius: 999px; background: #d6e1f9; color: #002967; font-size: 1.3rem; font-weight: 600;  width: fit-content; text-align: center; vertical-align: middle; line-height: 24px;}
/* 상담신청 이용방법 */
.counsel_ind{ list-style: none; margin: 20px 0 0; padding: 0; }
.counsel_ind_item{ padding: 18px 0; }
.counsel_ind_dl{ margin: 0; display: flex; align-items: flex-start; gap: 18px; }
.counsel_ind_key{ flex: 0 0 auto; min-width: 96px; height: 34px; padding: 0 18px; border: 1px solid #555555; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; font-size: 1.4rem; font-weight: 700; color: #333; background: #fff; line-height: 1; white-space: nowrap; }
.counsel_ind_val{ margin: 4px 0 0; min-width: 0; font-size: 1.6rem; color: #444; line-height: 1.6; }
.counsel_ind_link{ display: inline-flex; align-items: center; gap: 10px; margin-left: 14px; padding: 10px 16px; border-radius: 999px; background: #333; color: #fff; text-decoration: none; font-size: 1.35rem; font-weight: 600; line-height: 1; vertical-align: middle; }
.counsel_ind_link:hover{ filter: brightness(0.95); }
.counsel_ind_link:focus-visible{ outline: none; box-shadow: 0 0 0 3px rgba(0,41,103,.18); }
.counsel_ind_link_ico{ width: 11px; height: 11px; display: inline-block; background: url("/ibuilder/template/theme_skin/theme130/renewal/images/common/icon_outlink.png") no-repeat; }
.olt_banner{ margin-top: 28px; padding: 24px 28px;}
.olt_banner_inner{ display: flex; align-items: center; gap: 22px; justify-content: center;}
.olt_banner_ico{ flex: 0 0 auto; width: 92px; }
.olt_banner_ico img{ display: block; width: 100%; height: auto; }
.olt_banner_txt{line-height: 1.7; font-weight: 700; }
.olt_banner_line{ display: block; font-size: 2.1rem; word-break: keep-all; font-family: 'SangSangTitle'; }
.olt_banner_line--base{ color: #3f1e06; }
.olt_banner_line--accent{ color: #ba4200; }
/* ==============================
    마음건강 Self-Care
   ============================== */
    /* 우울(Self-Care)*/
.con03_body01{}
.sc_intro{ display: flex; gap:40px; padding: 35px 45px; background: #f3f7ff; border-radius: 18px; }
.sc_intro_img{ flex: 0 0 auto; width: 100px; }
.sc_intro_img img{ display: block; width: 100%; height: auto; }
.sc_intro_body{ min-width: 0; padding:10px 0;}
.sc_intro_title{ margin: 0 0 6px; font-size: 2rem; font-weight: 700; color: #111; }
.sc_intro_desc{ margin: 0; font-size: 1.6rem; color: #555; line-height: 1.6; }
.sc_test_info{ margin-top: 28px; }
.sc_info_title{ position: relative; padding-left: 14px; margin-bottom: 10px; font-size:2rem; font-weight: 700; color: #111; }
.sc_info_title::before{ content: ""; position: absolute; left: 0; top: 0; width: 6px; height: 1.1em; background: #4472C4; border-radius: 2px; }
.sc_info_desc{ font-size: 1.45rem; color: #444; line-height: 1.65; margin-left: 14px; }
.sc_info_list{ margin-left: 14px; }
.sc_info_list li{ position: relative; padding-left: 10px; font-size: 1.45rem; color: #444; line-height: 1.6; }
.sc_info_list li::before{ content: "·"; position: absolute; left: 0; top: 0; }
.sc_guide_box{ margin-top: 18px; padding: 20px; background: #f6f6f6; border-radius: 15px; display: flex; align-items: center; justify-content: center; gap: 26px; }
.sc_guide_mate{ flex: 0 0 auto; width: 55px; }
.sc_guide_mate img{ display: block; width: 100%; height: auto; }
.sc_guide_list{}
.sc_guide_item{ display: flex; align-items: flex-start; gap: 12px; }
.sc_guide_item + .sc_guide_item{ margin-top:5px; }
.sc_guide_chk{ flex: 0 0 auto; width: 18px; height: 18px; margin-top: 3px; }
.sc_guide_chk img{ display: block; width: 100%; height: auto; }
.sc_guide_text{ font-size: 1.5rem; color: #333; line-height: 1.6; font-weight: 700; word-break: keep-all; }
.sc_test{ margin-top: 26px; }
.sc_test_head{ margin-top: 14px; }
.sc_test_q{ margin: 0 0 8px; font-size: 1.4rem; color: #555; position: relative;}
.sc_test_q::before{content: '*'; display: inline-block;}
.sc_test_guide{ margin: 0 0 8px; padding-left:10px; font-size:1.4rem; color: #555; line-height: 1.6; }
.sc_test_table_wrap{margin-top: 20px; overflow: hidden; border-bottom: 1px solid #d7dbe3; border-left: 0; border-right: 0; position: relative;}
.sc_test_table_wrap .board_scroll_hint{ background: rgba(255,255,255,.40); backdrop-filter: blur(1.5px); }
.sc_test_table_wrap .board_scroll_hint_box{ background: rgba(0,0,0,.55); }
.sc_test_table{ width: 100%; border-collapse: collapse; background: #fff; table-layout: fixed; }
.sc_test_table thead th{ background: #1f5fbf; color: #fff; font-size: 1.4rem; font-weight: 700; padding: 14px 10px; border-right: 1px solid rgba(255,255,255,.25); }
.sc_test_table thead th:last-child{ border-right: 0; }
.sc_test_table tbody th,
.sc_test_table tbody td{ border-top: 1px solid #e6e9ef; border-right: 1px solid #e6e9ef; padding: 12px 10px; font-size: 1.4rem; color: #333; vertical-align: middle; background: #fff; }
.sc_test_table tbody td:last-child,
.sc_test_table tbody th:last-child{ border-right: 0; }
.sc_num{ text-align: center; font-weight: 700; }
.sc_item{ line-height: 1.55; }
.sc_pick{ text-align: center; }
.sc_pick input[type="radio"]{ width: 16px; height: 16px; accent-color: #1f5fbf; cursor: pointer; }
.sc_test_note{ margin: 20px 0 0; font-size: 1.3rem; color: #666; text-align: right; }
.sc_test_btns{ margin-top: 22px; display: flex; justify-content: center; }
.sc_btn_primary{ min-width: 220px; height: 52px; padding: 0 26px; border: 0; border-radius: 10px; background: #002967; color: #fff; font-size: 1.6rem; cursor: pointer; text-align: center; display: inline-flex; justify-content: center; align-items: center;}
.sc_btn_primary:hover,
.sc_btn_primary:focus-visible{ filter: brightness(0.95); outline: none; }
.sc_btn_primary:focus-visible{ box-shadow: 0 0 0 3px rgba(31,95,191,.25); }
.sc_result{ margin-top: 50px; }
.sc_result_summary{ padding:50px 20px; background: #f6f6f6; border-radius:20px; text-align: center; }
.sc_result_text{ margin: 0 0 6px; font-size: 3rem; color: #222; }
.sc_result_point{ color: #008070; font-weight: 600;}
.sc_result_guide{ margin: 20px 0; font-size: 1.4rem; color: #666; position: relative;}
.sc_result_guide li{ position: relative; padding-left: 14px; line-height: 1.6; } 
.sc_result_guide li::before{ content: '·'; position: absolute; left: 0; top: 0; }
.sc_result_guide li + li{margin-top: 5px;}
.sc_result_table_wrap{ margin-top: 20px; }
.sc_result_table{ width: 100%; border-collapse: collapse; table-layout: auto; background: #fff; }
.sc_result_table thead th{ background: #0a8a78; color: #fff; font-size: 1.4rem; font-weight: 700; padding: 14px 12px; border-right: 1px solid rgba(255,255,255,.3); }
.sc_result_table thead th:last-child{ border-right: 0; }
.sc_result_table tbody th,
.sc_result_table tbody td{ border-top: 1px solid #e5e8ee; border-right: 1px solid #e5e8ee;  padding: 14px 12px; font-size: 1.4rem; color: #333; vertical-align: middle; }
.sc_result_table tbody td:nth-of-type(1){text-align: center;}
.sc_result_table tbody td:last-child,
.sc_result_table tbody th:last-child{ border-right: 0; }
.sc_result_table tbody tr:last-child td,
.sc_result_table tbody tr:last-child th{border-bottom: 1px solid #e5e8ee;}
.sc_result_mark{ text-align: center; height: 100%; }
.sc_result_mark .result_gs_text{margin-top: 5px;}
.sc_result_table tbody tr.is_active{position: relative; background: #e9f6f3;}
.sc_result_table tbody tr.is_active th{ color: #0a8a78; font-weight: 600;}
.sc_result_table tbody tr.is_active td:nth-of-type(1){color:#0a8a78; text-align: center; font-weight: 600;}
.gr_rs{color:#0a8a78 !important; text-align: center; font-weight: 600;}
.sc_result_table tbody tr.is_active::after{ content: ""; position: absolute; left: 0; right: 0; top: -1px; bottom: -1px; border: 2px solid #c1e5e1; pointer-events: none; z-index: 2; }
.sc_result_table tbody tr.is_active > *{ position: relative; z-index: 3; }
.sc_cta{ margin-top: 34px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.sc_cta a{ position: relative; display: flex; flex-direction: column; justify-content: center; min-height: 130px; border-radius: 20px; padding: 24px 28px 24px 250px; overflow: hidden; }
.sc_cta_apply{ background-color: #f8e7ce; background-image: url("/ibuilder/template/theme_skin/theme130/renewal/images/sub/icon_mate_bg.png"); background-repeat: no-repeat; background-position: left center; background-size: auto 100%; }
.sc_cta_apply_desc{ font-size: 1.5rem; color: #c07b2c; line-height: 1.3; margin-bottom: 10px; }
.sc_cta_apply_txt{ font-size: 2.2rem; font-weight: 800; color: #3f1e06; line-height: 1.2; }
.sc_cta_apply_arr{ position: absolute; right: 30px; top:70%; transform: translateY(-50%); width: 34px; height: 18px; background: url("/ibuilder/template/theme_skin/theme130/renewal/images/sub/icon_link_up01.png") no-repeat center / contain; }
.sc_cta_video{ background-color: #1078cc; background-image: url("/ibuilder/template/theme_skin/theme130/renewal/images/sub/icon_mate_bg02.png"); background-repeat: no-repeat; background-position: left 20px center; background-size: auto 75%; }
.sc_cta_video_desc{ font-size: 1.5rem; color: rgba(255,255,255,.75); line-height: 1.3; margin-bottom: 10px; }
.sc_cta_video_txt{ font-size: 2rem; font-weight: 800; color: #ffffff; line-height: 1.2; }
.sc_cta_video_arr{ position: absolute; right: 30px; top: 70%; transform: translateY(-50%); width: 34px; height: 18px; background: url("/ibuilder/template/theme_skin/theme130/renewal/images/sub/icon_link_up02.png") no-repeat center / contain; }
.sc_cta a:hover{ filter: brightness(0.97); }
.sc_cta a:focus-visible{ outline: none; box-shadow: 0 0 0 3px rgba(0,41,103,.25); }

/*
.sc_video_main{border-left: 1px solid #d7dbe3; padding-left: 34px;}
.sc_video_panel{ display: flex; align-items: center; justify-content: center; gap: 34px; padding: 26px 0;}
.sc_video_side{ flex: 0 0 260px; display: flex; justify-content: center;}
.sc_side_btn{ display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-width: 220px; height: 56px; padding: 0 28px; border-radius: 12px; background: #002967; color: #fff; font-size: 1.7rem; font-weight: 700; text-decoration: none; line-height: 1; transition: background .2s ease, transform .15s ease, box-shadow .15s ease; }
.sc_side_btn_txt{ text-align: center; line-height: 1.2; }
.sc_side_btn_arr{ font-size: 2rem; font-weight: 700; line-height: 1; }
.sc_side_btn:hover{ background: #0140a1; box-shadow: 0 6px 14px rgba(0,0,0,.18); }
.sc_side_btn:active{ transform: translateY(1px); box-shadow: 0 3px 8px rgba(0,0,0,.18); }
.sc_side_btn:focus-visible{ outline: none; box-shadow: 0 0 0 3px rgba(0,41,105,.35), 0 6px 14px rgba(0,0,0,.18); }
.sc_video{ margin-top: 60px; text-align: center;   flex: 1 1 auto; min-width: 0; }
.sc_video_head{ display: flex; align-items: center; justify-content: center; gap: 16px; margin-bottom: 30px; }
.sc_video_img{ width: 84px; height: 88px; flex: 0 0 auto; }
.sc_video_img img{ width: 100%; height: auto; display: block; }
.sc_video_title{ font-size: 2.4rem; font-weight: 700; font-family: 'SangSangTitle'; color: #222; }
.sc_video_list{ display: flex; gap: 20px; justify-content: center; flex-wrap: wrap; }
.sc_video_item{ display: inline-flex; align-items: center; gap: 14px; padding: 16px 26px; min-width: 260px; border-radius: 14px; background: #d93737; color: #fff; text-decoration: none; font-size: 1.6rem; font-weight: 600; }
.sc_video_item:hover,
.sc_video_item:focus-visible{ filter: brightness(0.95);     }
.sc_video_play{ width: 15px; height: 17px; flex: 0 0 auto; }
.sc_video_play img{ width: 100%; height: auto; display: block; }
.sc_video_text{ flex: 1; text-align: left; }
.sc_video_link{ font-size: 1.4rem; font-weight: 100; }
*/
    /* 불안*/
.con03_body02{}
.sc_intro2_img{ flex: 0 0 auto; width: 100px; }
.sc_intro2_img img{ display: block; width: 100%; height: auto; }
    /* 스트레스*/
.con03_body03{}
.sc_intro3_img{ flex: 0 0 auto; width: 100px; }
.sc_intro3_img img{ display: block; width: 100%; height: auto; }
    /*자살생각*/
.con03_body04{}
.sc_intro4_img{ flex: 0 0 auto; width: 100px; }
.sc_intro4_img img{ display: block; width: 100%; height: auto; }
.con03_body04 .sc_pick_label{ display: flex; flex-direction: column; align-items: center; gap: 6px; cursor: pointer; }
.con03_body04 .sc_pick_text{ font-size: 1.3rem; color: #333; line-height: 1.3; text-align: center;}
.con03_body04 .sc_pick input[type="radio"]{ margin: 0; }
/* ==============================
  sc_test_list (테이블 → 리스트형)
============================== */
.sc_test_list{ margin-top: 20px; border-top: 1px solid #e6e9ef; }
.sc_test_qitem{ padding: 16px 8px; border-bottom: 1px solid #e6e9ef; }
.sc_test_qhead{ display: flex; gap: 8px; align-items: flex-start; }
.sc_test_qnum{ flex: 0 0 auto; font-weight: 800; color: #111; font-size: 1.5rem; line-height: 1.5; }
.sc_test_qtxt{ margin: 0; font-size: 1.55rem; font-weight: 700; color: #111; line-height: 1.5; min-width: 0; }
.sc_test_opts{ margin-top: 10px; display: flex; flex-wrap: wrap; gap: 14px 18px; padding-left: 22px;}
.sc_opt{ display: inline-flex; align-items: center; gap: 8px; font-size: 1.45rem; color: #333; cursor: pointer; }
 .sc_opt input[type="radio"]{ width: 16px; height: 16px; accent-color: #d93737; }
.sc_opt input[type="radio"]:focus-visible{ outline: none; box-shadow: 0 0 0 3px rgba(217,55,55,.18); border-radius: 999px; }
  /* 반응형: 줄 간격만 약간 정리 */
  @media (max-width: 480px){
    
  }
  
    /*스마트폰과 의존*/
.con03_body05{}
/* ==============================
    MJ mate
   ============================== */
    /*MJ-mate 소개*/
.con04_body01{}
.con04_body01 .list_bar{padding:30px 0;}
.mate_list{ margin-top: 18px; padding-bottom: 30px; border-bottom: 1px solid #dbdbdb;}
.mate_grid{ list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap:30px; }
.mate_card{ position: relative; display: flex; gap: 22px; padding: 18px 20px; border-radius: 14px; background: #fff; border: 1px solid #e6e8ee; box-shadow: 0 1px 3px rgba(0,0,0,.04); }
.mate_photo{ width: 160px; height: 200px; border-radius: 10px; background: #eee; flex: 0 0 auto; }
.mate_photo img{width: 100%; height: 100%; object-fit: cover;}
.mate_body{ min-width: 0; flex: 1; padding:15px 0;}
.mate_head{ display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 10px; border-bottom: 1px solid #eef0f4; margin-bottom: 12px; }
.mate_name{ margin: 0; font-size: 2.4rem; font-weight: 700; color: #111;}
.mate_name span{font-size: 2rem; vertical-align: middle; margin-left: 5px;}
.mate_more{ display: inline-flex; align-items: center; justify-content: center; height: 25px; padding: 0 10px; border-radius: 999px; border: 1px solid #006cd1; color: #006cd1; font-size: 1.2rem; font-weight: 700; text-decoration: none; white-space: nowrap; line-height: 25px;}
.mate_more:hover{ background: #f3f7ff; } 
.mate_more:focus-visible{ outline: 3px solid rgba(31,95,191,.25); outline-offset: 2px; }
.mate_meta{ margin: 0; }
.mate_row{ display: flex; align-items: flex-start; gap: 10px; margin-top: 8px; }
.mate_key{ flex: 0 0 auto; min-width: 66px; height: 22px; padding: 0 10px; border-radius: 999px; background: #6a859e; color: #fff; font-size: 1.2rem; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.mate_val{ margin: 0; font-size: 1.35rem; color: #444; line-height: 1.55; min-width: 0; }
    /*MJ-mate 소개_view*/
.con04_body01_view{}
.con04_body01_view .mate_view{ background: #f8f8f8; border-radius: 18px; }
.mate_view_card{ position: relative; display: grid;  grid-template-columns: 220px 1fr auto; gap: 30px; padding: 22px 24px; border-radius: 14px; background: #fff; border: 1px solid #e6e8ee; box-shadow: 0 2px 6px rgba(0,0,0,.08); overflow: hidden;}
.mate_view_photo{ width: 100%; height: 100%; min-height: 290px; background: #eee; border-radius:10px; }
.mate_view_photo img{width: 100%; height: 100%; border-radius:10px; object-fit: cover;}
.mate_view_body{ min-width: 0; padding-top: 4px; }
.mate_view_name{ margin: 0 0 12px; font-size: 2.2rem; font-weight: 600; color: #111; }
.mate_view_name span{ font-size: 1.9rem; font-weight: 700; margin-left: 4px; }
.mate_view_meta{ margin-top:30px; }
.mate_view_row{ display: flex; align-items: center; gap: 12px; margin-top: 10px; }
.mate_view_key{ flex: 0 0 auto; min-width: 70px; height: 26px; padding: 0 12px; border-radius: 999px; background: #6a859e; color: #fff; font-size: 1.25rem; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.mate_view_val{ margin: 0; font-size: 1.45rem; color: #444; line-height: 1.6; min-width: 150px; }
.mate_view_apply{   grid-column: 3; grid-row: 1; align-self: stretch; justify-self: stretch;position: absolute; right: -22px; bottom: -16px; width: 230px; height: 240px; display: flex; align-items: flex-end; justify-content: flex-end; background: url("/ibuilder/template/theme_skin/theme130/renewal/images/common/mjc_box.png") no-repeat right bottom; background-size: 230px auto;   pointer-events: none;}
.mate_apply_btn{ grid-column: 3;  align-self: end;   justify-self: end;     display: inline-flex; align-items: center; justify-content: center; min-width: 168px; height: 44px; padding: 0 18px; border-radius: 12px; background: #0b4aa1; color: #fff; font-size: 1.4rem; font-weight: 700; text-decoration: none; box-shadow: 0 6px 14px rgba(11,74,161,.18);}
.mate_apply_btn:hover{ filter: brightness(0.95); }
.mate_apply_btn:focus-visible{ outline: 3px solid rgba(31,95,191,.25); outline-offset: 3px; }
.mate_view_content{ position: relative; margin-top: 14px; padding: 50px; border-radius: 20px; background: #f8f8f8; }
.mate_view_p{ margin: 0; font-size: 1.5rem; line-height: 1.85; color: #333; position: relative; }
.mate_view_p + .mate_view_p{ margin-top: 14px; }
.mate_view_bottom{ margin-top: 18px; display: flex; justify-content: center; }
.mate_back_btn{ display: inline-flex; align-items: center; justify-content: center; min-width: 120px; height: 44px; padding: 0 18px; border-radius: 10px; background: #222; color: #fff; font-size: 1.5rem; font-weight: 700; text-decoration: none; }
.mate_back_btn:hover{ filter: brightness(0.95); }
.mate_back_btn:focus-visible{ outline: 3px solid rgba(31,95,191,.25); outline-offset: 3px; }

    /*MJ-mate 상담신청*/
.client_info{ margin-top: 30px; }
        /*내담자 인적사항*/
.client_info_table{}
.client_box + .client_box{margin-top: 50px;}
.client_info_table table{ width: 100%; border-collapse: collapse; border-top: 2px solid #13418a; table-layout: fixed; }
.client_info_table th,
.client_info_table td{ border: 1px solid #dddddd; padding: 12px 14px; font-size: 1.4rem; line-height: 1.4; vertical-align: middle;}
.client_info_table th{ background: #f3f5f9; color: #273346; font-weight: 700; text-align: center; white-space: nowrap; }
.client_info_table td{ color: #333; background: #fff; }
.client_info_mail{ display: flex; align-items: center; gap: 8px; min-width: 0; }
.client_info_ipt{width: 100%; height: 34px; padding: 0 10px; border: 1px solid #dddddd; border-radius: 4px; font-size: 1.35rem; outline: none;}
.client_info_input{ width: 100px; max-width: 45%; height: 34px; padding: 0 10px; border: 1px solid #dddddd; border-radius: 4px; font-size: 1.35rem; outline: none; }
.client_info_select{ height: 34px; padding: 0 10px; border: 1px solid #dddddd; border-radius: 4px; font-size: 1.35rem; background: #fff; min-width: 140px; }
.client_info_at{ color: #6b7280; font-weight: 600; }
.client_info_input:focus-visible,
.client_info_select:focus-visible{ border-color: #13418a; box-shadow: 0 0 0 3px rgba(19,65,138,.15); }
.client_info_table th:first-child,
.client_info_table td:first-child{ border-left: 0; }
.client_info_table th:last-child,
.client_info_table td:last-child{ border-right: 0; }
        /*상담받고싶은 내용*/
.client_info_table--want table{ }
.want_checks{ display: flex; flex-wrap: wrap; gap: 10px 18px; padding: 2px 0; }
.want_chk{ display: inline-flex; align-items: center; gap: 8px; font-size: 1.4rem; color: #333; cursor: pointer; user-select: none; }
.want_chk input[type="checkbox"]{ appearance: none; -webkit-appearance: none; -moz-appearance: none; width: 25px; height: 25px; border: 1px solid #a9a9a9; border-radius: 4px; background: #fff; cursor: pointer; position: relative; flex: 0 0 auto; }
.want_chk input[type="checkbox"]:checked{ border-color: #13418a; background: #13418a; }
.want_chk input[type="checkbox"]:checked::after{ content: ""; position: absolute; left: 50%; top: 50%; width: 7px; height: 12px; border: solid #fff; border-width: 0 2px 2px 0; transform: translate(-50%, -55%) rotate(45deg); }
.want_chk input[type="checkbox"]:focus-visible{ outline: none; box-shadow: 0 0 0 3px rgba(19,65,138,.25); }
.want_textarea{ width: 100%; min-height: 96px; padding: 12px 12px; border: 1px solid #dddddd; border-radius: 6px; font-size: 1.4rem; line-height: 1.6; resize: vertical; outline: none; background: #fff; }
.want_textarea:focus-visible{ border-color: #13418a; box-shadow: 0 0 0 3px rgba(19,65,138,.15); }
.client_info_guide{ margin: 0 0 8px; font-size: 1.35rem; color: #555;}
.client_info_note{ margin-top: 8px; font-size: 1.3rem; color: #666; }
.mate_agree_box{ margin-top: 30px; border-top: 2px solid #13418a; border-bottom: 1px solid #dddddd; padding:30px 0; background: #fff; }
.mate_agree_inner{ max-width: 760px; margin: 0 auto; text-align: center; }
.mate_agree_p{ margin: 0; font-size: 1.35rem; line-height: 1.7; color: #444; }
.mate_agree_p:nth-of-type(1){font-size: 1.5rem;}
.mate_agree_p:nth-of-type(2){border-bottom: 1px solid #dddddd; padding-bottom: 30px;}
.mate_agree_p + .mate_agree_p{ margin-top: 10px; }
.mate_agree_p--strong{font-size: 1.5rem; margin-top: 30px !important; color: #222; font-weight: 600; }
.mate_agree_meta{ margin-top: 20px; }
.mate_agree_date{font-size: 1.5rem; color: #333; font-weight: 600; }
.mate_agree_name{ margin: 30px 0; color: #333; font-weight: 600;}
.mate_agree_label{ display: inline-block; font-size: 1.8rem; }
.mate_agree_value{ display: inline-block; margin-left: 6px; font-size: 2.2rem; font-family: 'Noto Serif KR';}
.mate_agree_org{ margin: 14px 0 0; font-size: 1.35rem; color: #333; font-weight: 600; }
.mate_agree_btns{ margin-top: 22px; display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.mate_btn{ display: inline-flex; align-items: center; justify-content: center; border-radius: 5px; padding: 14px 22px; font-size: 1.45rem; font-weight: 700; text-decoration: none; color: #fff; min-width: 160px; line-height: 1; }
.mate_btn--primary{ background: #1a56b5; }
.mate_btn--dark{ background: #222222; }   
.mate_btn:hover,
.mate_btn:focus-visible{ filter: brightness(0.95); }  
.mate_btn:focus-visible{ outline: none; box-shadow: 0 0 0 3px rgba(26,86,181,.22); }
.wants_btn{padding:5px 10px; background: #1a56b5; border-radius: 10px; color:#fff; position: relative; cursor: pointer;}
.wants_btn::after{content: ''; display:inline-block; width:11px; height: 12px; background: url(/ibuilder/template/theme_skin/theme130/renewal/images/sub/icon_search.png)no-repeat; margin-left: 5px; vertical-align: middle;}
/* ==============================
   MJ-mate 상담자 찾기 모달
============================== */
.mj_modal[hidden]{ display:none; }
body.is_modal_open{ overflow:hidden; }
.mj_modal{ position:fixed; inset:0; z-index:2000; }
.mj_modal_dim{ position:absolute; inset:0; background:rgba(0,0,0,.45); }
.mj_modal_panel{ position:relative; width:min(920px, calc(100% - 40px)); max-height: calc(100vh - 60px); margin: 150px auto; background:#fff; border: 1px solid #0f2f62; border-radius: 10px; box-shadow: 0 14px 40px rgba(0,0,0,.22); overflow:hidden; display:flex; flex-direction:column; }
.mj_modal_head{ display:flex; align-items:center; justify-content:space-between; padding: 18px 20px 14px; border-bottom:1px solid #e6e9ef; }
.mj_modal_title{ margin:0; font-size: 2.1rem; font-weight: 800; color:#111; }
.mj_modal_close{ width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center; border-radius: 8px; border:1px solid #d8dbe3; background:#fff; font-size: 2.4rem; line-height: 1; color:#333; }
.mj_modal_close:hover{ background:#f5f9ff; }
.mj_modal_close:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(31,95,191,.25); }
.mj_modal_body{ padding: 16px 20px 18px; overflow:auto; }
.mj_modal_filter{ border:1px solid #d7dbe3; border-radius: 6px; padding: 14px 14px 10px; background:#fff; }
.mj_modal_row{ display:flex; gap:12px; align-items:center; }
.mj_modal_label{ flex:0 0 auto; font-size:1.4rem; font-weight:700; color:#111;}
.mj_modal_fields{ flex:1; display:flex; flex-wrap:wrap; gap: 10px 16px; }
.mj_modal_chk{ display:inline-flex; align-items:center; gap:8px; font-size:1.35rem; color:#333; cursor:pointer; }
.mj_modal_chk input[type="checkbox"]{ width:16px; height:16px; accent-color:#1f5fbf; cursor:pointer; }
.mj_modal_chk input[type="checkbox"]:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(31,95,191,.22); border-radius:999px; }
.mj_modal_row--grid{ margin-top: 10px; display:grid; grid-template-columns: 1.1fr 1fr 0.8fr 120px; gap: 10px 12px; align-items:end; }
.mj_modal_field{ min-width:0; }
.mj_modal_label2{ display:block; margin: 0 0 6px; font-size:1.3rem; font-weight:700; color:#222; }
.mj_modal_select,
.mj_modal_input{ width:100%; height:34px; border:1px solid #cfd5df; border-radius:4px; padding:0 10px; font-size:1.35rem; background:#fff; outline:none; }
.mj_modal_select:focus-visible,
.mj_modal_input:focus-visible{ border-color:#002967; box-shadow:0 0 0 3px rgba(0,41,103,.15); }
.mj_modal_actions{ display:flex; justify-content:flex-end; }
.mj_modal_btn{ display:inline-flex; align-items:center; justify-content:center; height:34px; padding:0 14px; border-radius:4px; font-size:1.35rem; font-weight:700; text-decoration:none; cursor:pointer; white-space:nowrap; }
.mj_modal_btn--primary{ background:#1f5fbf; color:#fff; }
.mj_modal_btn--primary:hover{ filter:brightness(.95); }
.mj_modal_btn--primary:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(31,95,191,.25); }
.mj_modal_btn--ghost{ background:#fff; border:1px solid #cfd5df; color:#111; }
.mj_modal_btn--ghost:hover{ background:#f8faff; }
.mj_modal_btn--ghost:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(31,95,191,.25); }
.mj_modal_tbl_wrap{ margin-top: 14px; overflow-x:auto; -webkit-overflow-scrolling: touch; }
.mj_modal_tbl{ width:100%; border-collapse:collapse; min-width: 640px; }
.mj_modal_tbl thead th{ background:#1f5fbf; color:#fff; font-weight:800; font-size:1.35rem; padding: 12px 10px; border-right: 1px solid rgba(255,255,255,.25); text-align:center; }
.mj_modal_tbl thead th:last-child{ border-right:0; }
.mj_modal_tbl tbody td{ padding: 12px 10px; font-size:1.35rem; border-top:1px solid #e6e9ef; border-right:1px solid #e6e9ef; text-align:center; background:#fff; }
.mj_modal_tbl tbody tr:nth-child(even) td{ background:#f8faff; }
.mj_modal_tbl tbody td:last-child{ border-right:0; }
.mj_modal_pick{ display:inline-flex; align-items:center; justify-content:center; min-width: 58px; height: 26px; border-radius: 3px; background:#0b4aa1; color:#fff; font-size:1.25rem; font-weight:700; text-decoration:none; }
.mj_modal_pick:hover{ filter:brightness(.95); }
.mj_modal_pick:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(31,95,191,.25); }
.mj_modal_foot{ margin-top: 14px; display:flex; justify-content:center; }

/* ==============================
    게시판
   ============================== */
    /*공지사항*/
.con05_body01{}
.con05_body01 .list_bar{margin:0; border-bottom: 0;}
    /*공지사항_view*/
.con05_body01_view{}
/* ==============================
    마이페이지
   ============================== */
    /*신청내담자목록*/
.con_mypage01{}
.con_mypage01 .list_bar{margin:0; border-bottom: 0; }
.con_mypage01 .board_tbl .td_title{text-align: center;}
.con_mypage01 .board_tbl thead th,
.con_mypage01 .board_tbl tbody td{ border-right: 1px solid #e6e6e6; }
.con_mypage01 .board_tbl thead th:last-child,
.con_mypage01 .board_tbl tbody td:last-child{ border-right: 0; }
.board_btn_submit{ display:inline-flex; align-items:center; justify-content:center; min-width:60px; height:28px; padding:0 10px; border-radius:4px; background:#1f5fbf; color:#fff; font-size:1.3rem; text-decoration:none; line-height: 28px;}
.board_btn_submit:after{content: ''; width: 14px; height: 14px; display: inline-block; background: url(/ibuilder/template/theme_skin/theme130/renewal/images/common/icon_file2.png)no-repeat; margin-left: 5px;}
.board_btn_submit:hover,
.board_btn_submit:focus-visible{ filter:brightness(0.95); }
.con_mypage01 .paging_wrap{ display:flex; align-items:center; justify-content:space-between; margin-top: 40px;}
.con_mypage01 .paging{ margin: 0 auto; }
.paging_btn_download{ display:inline-flex; align-items:center; gap:8px; height:40px; padding:0 18px; border-radius:6px; background:#e24a00; color:#fff; font-size:1.4rem; font-weight:600; text-decoration:none; white-space:nowrap; }
.paging_btn_download::after{ content:''; width:16px; height:16px; background:url('/ibuilder/template/theme_skin/theme130/renewal/images/common/icon_down.png') no-repeat; }
.paging_btn_download:hover,
.paging_btn_download:focus-visible{ filter:brightness(0.95); }
    /*나의 MJ-mate 활동관리*/
.con_mypage02{}
.mywork_acc{ margin-top: 10px; }
.mywork_acc_item + .mywork_acc_item{ margin-top: 12px; }
.mywork_acc_head{ display: flex; align-items: center; gap: 25px; width: 100%; padding: 16px 18px; border: 1px solid #e5e8ee; border-radius: 12px; background: #f8f8f8; color: #111; text-decoration: none; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.mywork_acc_head:hover,
.mywork_acc_head:focus-visible{ background: #f5f9ff; outline: none; box-shadow: 0 0 0 3px rgba(31,95,191,.18); }
.mywork_acc_title{ font-size: 2rem; font-weight: 700; color: #111; flex: 0 0 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;  flex: 0 0 auto; }
.mywork_acc_meta { flex: 0 0 auto; display: inline-flex; align-items: center; font-size: 1.35rem; color: #666; white-space: nowrap; }
.mywork_acc_tag{ color: #1b4c95; font-weight: 600; }
.mywork_acc_tag::after{ content: '|'; display: inline-block; margin: 0 8px; color: #bbb; font-weight: 400; }
.mywork_acc_date{ color: #1b4c95; font-weight: 600; }
.mywork_acc_head i{ font-size: 24px; color: #6b7280; flex: 0 0 auto; transition: transform .2s ease; font-weight: 700; margin-left: auto;  }
.mywork_acc_item.is_open .mywork_acc_head{ border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.mywork_acc_item.is_open .mywork_acc_head i{ transform: rotate(180deg); }
.mywork_acc_body{ border: 1px solid #e5e8ee; border-top: 0; border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; padding: 14px 18px 18px; }
.mywork_tbl{ overflow: hidden; background: #fff; }
.mywork_tr{display: grid;grid-template-columns: 90px 1fr 195px 110px;align-items: center;}
.mywork_tr + .mywork_tr{ border-top: 1px solid #e6e9ef; }
.mywork_td{ padding: 10px 12px; font-size: 1.35rem; color: #333; min-width: 0; }
.mywork_td--round{ text-align: center; font-weight: 700; color: #273346; }
.mywork_td--file{ }
.mywork_td--action{ text-align: center; }
.mywork_td--date{ text-align: center; color: #6b7280; }
.mywork_file_box{ height: 34px; border: 1px solid #d7dbe3; border-radius: 6px; padding: 0 10px; display: flex; align-items: center; font-size: 1.3rem; color: #333; background: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mywork_file_box.is_empty{ background: #fff; }
.mywork_file_btn{ display: inline-flex; align-items: center; justify-content: center; min-width: 84px; height: 30px; padding: 0 12px; border-radius: 6px; background: #002967; color: #fff; font-size: 1.3rem; font-weight: 700; text-decoration: none; }
.mywork_file_btn:hover,
.mywork_file_btn:focus-visible{ filter: brightness(0.95); outline: none; box-shadow: 0 0 0 3px rgba(0,41,103,.18); }


/* ==============================
    반응형
    ============================== */
@media (max-width: 1300px){
    .sub_layout{ max-width: none; width: 100%; gap: 24px; }
    .lnb{ width: 200px; flex: 0 0 200px; }
}

@media (max-width: 1024px){
    .sc_test_table_wrap,
    .sc_result_table_wrap{ overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .sc_test_table,
    .sc_result_table{ min-width: 980px;}
    .satis_box{ flex-direction: column; align-items: stretch; }
    .satis_right{ align-items: flex-start; }     
    .satis_form{ width: 100%; }
    .satis_input{ width: 100%; max-width: none; flex: 1; }
    .counsel_area_list{ gap: 16px; }
    .counsel_area_item{ padding: 20px 20px; min-height: 0; }
    .counsel_area_text{ padding-right: 84px; }
    .counsel_area_icon{ right: 16px; bottom: 16px; width: 72px; height: 68px; }
    .counsel_area_icon img{ width: 100%; height: 100%; object-fit: contain; display: block; }
    .mate_grid{ gap: 14px; }
    .mate_card{ gap: 18px; padding: 16px 18px; }
    .mate_photo{ width: 96px; height: 96px; }
    .sc_cta{ grid-template-columns: 1fr; gap: 14px; }
    .sc_cta a{ min-height: 120px; padding: 20px 22px 20px 200px; border-radius: 18px; }
    .sc_cta_apply{ background-position: left center; background-size: auto 100%; }
    .sc_cta_video{ background-position: left 14px center; background-size: auto 72%; }    
    .sc_cta_apply_txt{ font-size: 2rem; }
    .sc_cta_video_txt{ font-size: 2rem; }
    .sc_cta_apply_desc,
    .sc_cta_video_desc{ font-size: 1.45rem; margin-bottom: 8px; }
    .sc_cta_apply_arr,
    .sc_cta_video_arr{ right: 22px; top: 62%; }
}

@media (max-width: 768px){
    .sub_layout{ display: block; }
    .lnb{ display: none;}
    .lnb_head{ border-radius: 18px; }
    .lnb_nav{ border-radius: 12px; }
    .sub_content{ margin-top: 16px; }
    /*소개*/
    .cen_intro_head{padding:10px; gap:20px;}
    .cen_intro_icon{ width: 75px; flex: 0 0 auto; }
    .use_service_item{ grid-template-columns: 1fr; gap: 14px; padding: 22px 0; }    
    .use_service_head{ align-items: center; }
    .use_service_icon{ width: 88px; height: 88px; }
    .use_service_name{ font-size: 1.7rem; }
    .use_service_lead{ font-size: 1.5rem; }
    /*개인상담*/
    .counsel_desc{ font-size: 1.5rem; margin-bottom: 22px; }
    .counsel_area_list{ grid-template-columns: 1fr; gap: 14px; }
    .counsel_area_item{ padding: 18px 18px 20px; border-radius: 12px; }
    .counsel_area_name{ font-size: 1.6rem; }
    .counsel_area_desc li{ font-size: 1.45rem; line-height: 1.6; }
    .counsel_area_text{ padding-right: 78px; }
    .counsel_area_icon{ right: 14px; bottom: 14px; width: 64px; height: 60px; }
    .counsel_area_list{ grid-template-columns: 1fr; }
    .btn_counsel_apply{ width: 100%; max-width: 360px; height: 54px; }
    .counsel_ind_dl{ flex-direction: column; gap: 10px; }
    .counsel_ind_key{ min-width: 0; width: fit-content; }
    .counsel_ind_val{ margin-top: 0; }
    .olt_banner{ padding: 18px 18px; }
    .olt_banner_inner{ gap: 14px; }
    .olt_banner_ico{ width: 72px; }
    .olt_banner_line{ font-size: 1.6rem; }
    /*이용안내*/
    .useinfo_box{ padding: 22px 20px; gap: 18px; }
    .useinfo_icon{ width: 84px; }
    .useinfo_body{ flex-direction: column; gap: 12px; }
    .useinfo_title{ font-size: 1.8rem; }
    .map_info_bar{display: block;}
    .map_info_ico{display: inline-block;}
    .map_info_item{display: block;}
    .map_info_item ~ .map_info_item{margin-top: 10px;}
    /* 우울(Self-Care)*/
    .sc_intro{display: block; padding:20px;}
    .sc_intro_body{margin-top: 20px;}
    .sc_video_title{ font-size: 2rem; }
    .sc_video_item{ width: 100%; justify-content: center; }
    .sc_video_text{ text-align: center; }
    .sc_video_panel{ flex-direction: column; align-items: stretch; gap: 18px; }
    .sc_video_side{ flex: 0 0 auto; padding-right: 0; border-right: 0; border-bottom: 1px solid #d7dbe3; padding-bottom: 18px; }
    .sc_side_btn{ width: 100%; max-width: 360px; margin: 0 auto; }
    .mate_grid{ grid-template-columns: 1fr; }
    .mate_card{ padding: 16px; }
    .con04_body01_view .mate_view{ padding: 14px; }
    .mate_view_card{ grid-template-columns: 1fr; gap: 16px; padding: 18px 16px; }
    .mate_apply_btn{ grid-column: auto; justify-self: stretch; width: 100%; max-width: 360px; margin:0 auto; }
    .mate_view_content{padding:20px;}
    .mate_view_apply{ grid-column: auto; justify-self: end; width: 100%; max-width: 360px; margin-left: auto; }  
    .mate_view_photo{ aspect-ratio: 5 / 4; max-width: 230px; margin: 0 auto; }
    .mate_view_photo img{ display: block; object-fit: contain; }
    .client_info_table table,
    .client_info_table tbody,
    .client_info_table tr{ display: block; width: 100%; }
    .client_info_table tr{ border-bottom: 1px solid #dddddd; }
    .client_info_table tr:last-child{ border-bottom: 0; }
    .client_info_table th,
    .client_info_table td{ display: block; width: 100%; border-left: 0; border-right: 0; text-align: left; }
    .client_info_table th{ border-top: 0; padding: 10px 14px; }
    .client_info_table td{ border-top: 0; padding: 10px 14px 14px; }
    .client_info_mail{ flex-wrap: wrap; gap: 8px; }
    .client_info_input{ width: 100%; max-width: none; }
    .client_info_select{ width: 100%; }
    .want_checks{ gap: 8px 14px; }
    .con_mypage01 .paging_wrap{ flex-direction: column; gap:16px; }
    .mywork_acc_head{ flex-wrap: wrap; justify-content: space-between; }
    .mywork_acc_title{ width: 100%; white-space: normal; }
    .mywork_acc_meta{ width: 100%; justify-content: flex-start; }
    .mywork_tr{ grid-template-columns: 80px 1fr; grid-template-areas: "round file" "round action" "round date"; }
    .mywork_td--round{ grid-area: round; align-self: stretch; display: flex; align-items: center; justify-content: center; }
    .mywork_td--file{ grid-area: file; border-left: 1px solid #e6e9ef; }
    .mywork_td--action{ grid-area: action; border-left: 1px solid #e6e9ef; border-top: 1px solid #e6e9ef; }
    .mywork_td--date{ grid-area: date; border-left: 1px solid #e6e9ef;  }
    .mywork_td{ padding: 10px 10px; }
    .sc_cta{grid-template-columns:repeat(2, 1fr); gap: 12px; margin-top: 24px; }
    .sc_cta a{ padding: 120px 16px 16px; border-radius: 16px; background-position: top 10px center; background-size: auto 105px; }
    .sc_cta_apply_desc,
    .sc_cta_video_desc{ font-size: 1.3rem; margin-bottom: 6px; line-height: 1.35; }
    .sc_cta_apply_txt, 
    .sc_cta_video_txt{ font-size: 1.7rem; }
    .sc_cta_apply_arr,
    .sc_cta_video_arr{ position: static; transform: none; margin-top: 8px; width: 30px; height: 16px;}
    .mj_modal_panel{ width: calc(100% - 24px); margin: 12px auto; max-height: calc(100vh - 24px); }
    .mj_modal_body{ padding: 14px 14px 16px; }
    .mj_modal_row{ flex-direction:column; }
    .mj_modal_label{ padding-top:0; }
    .mj_modal_row--grid{ grid-template-columns: 1fr; }
    .mj_modal_actions{ justify-content:stretch; }
    .mj_modal_btn{ width:100%; }
    .mj_modal_tbl{ min-width: 560px; }
}
@media (max-width: 550px){
    .useinfo_box{ align-items: flex-start; gap: 14px; padding: 18px 16px; }
    .useinfo_icon{ width: 72px; }
    .useinfo_body{ flex-direction: column; gap: 10px; }
    .useinfo_title{ font-size: 1.7rem; margin: 0; }
    .useinfo_item{ display: grid; grid-template-columns: 90px 1fr;  gap: 10px; align-items: start; }
    .useinfo_badge{ width: 90px; justify-content: center; }
    .useinfo_text{ font-size: 1.4rem; }
    .use_service_icon{ width: 78px; height: 78px; }
    .use_step_item{ padding-left: 30px; }
    .use_step_item::before{ top: 1px; width: 20px; height: 20px; }
}

@media (max-width: 480px){
    .font_size_wrap{ gap: 6px; }
    .fs_label{ font-size: 1.15rem; color: #666; }
    .fs_pill{ padding: 2px 6px; gap: 6px; }
    .fs_btn{ width: 22px; height: 22px; font-size: 14px; }
    .fs_base{ font-size: 1.15rem; }
    .cen_intro_head{display: block;}
    .cen_intro_txt{margin-top:20px;}
    .satis_icon{width: 30px;}
    .satis_rate{ gap: 12px; }
    .satis_info{ flex-direction: column; align-items: flex-start; gap: 6px; }
    .counsel_title{ font-size: 2rem; margin: 24px 0 10px; }
    .counsel_area_item{ padding: 16px 16px 18px; }
    .counsel_area_text{ padding-right: 70px; }
    .counsel_area_icon{ right: 12px; bottom: 12px; width: 56px; height: 52px; }
    .olt_banner_inner{ flex-direction: column; align-items: flex-start; }
    .olt_banner_ico{ width: 80px; }
    .olt_banner_line{ font-size: 1.55rem; }
    .mate_card{ gap: 14px; padding: 14px; }
    .mate_photo{ width: 84px; height: 84px; }
    .mate_key{ min-width: 62px; padding: 0 8px; }
    .mate_view_apply{ justify-content: center; background-position: center bottom; }
    .mate_apply_btn{ width: 100%; max-width: 260px; }
    .mate_btn{ width: 100%; min-width: 0; }
    .sc_test_opts{ gap: 10px 14px; padding-left: 0; }
    .sc_cta a{ padding: 110px 14px 14px; background-size: auto 95px; }
    .sc_cta_apply_desc,
    .sc_cta_video_desc{ font-size: 1.35rem; }
    .sc_cta_apply_txt,
    .sc_cta_video_txt{ font-size: 1.6rem; }
}
@media (max-width: 420px){
    .mate_card{display: block;}
    .useinfo_box{display: block;}
    .useinfo_icon{margin:0 auto;}
    .useinfo_title{margin:5px auto;}
    .useinfo_item{grid-template-columns:70px 1fr; align-items: center;}
    .useinfo_badge{width: fit-content; min-width: 70px; font-size: 1.3rem; }
    .useinfo_text{font-size: 1.2rem;}
    .mywork_acc_head{padding:10px 18px; gap:10px;}
    .mywork_td{padding:5px;}
    .counsel_area_text{ padding-right: 40px; }
}