/* insight_view.css — Insight_view.html(뉴스/뉴스레터 상세) 전용 스타일. 공통 히어로(.sub_hero 등)는 sub_common.css에 있다 */

/* insight view section */
.insight_view_section{width:100%;padding:100px 0 160px;}
.insight_view_inner{display:flex;max-width:1560px;margin:0 auto;padding:0 30px;flex-direction:column;gap:60px;}

/* insight view head — 카테고리·날짜 메타 + 타이틀/공유버튼 */
.insight_view_head{display:flex;width:100%;flex-direction:column;gap:25px;}
.insight_view_meta{display:flex;align-items:center;gap:12px;}
.insight_view_category{font-family:'Inter',sans-serif;font-weight:700;font-size:16px;line-height:1.5;letter-spacing:-0.04em;color:var(--color-text-dark);}
.insight_view_dot{display:block;width:5px;height:5px;border-radius:50%;background:#D9D9D9;}
.insight_view_date{font-family:'Inter',sans-serif;font-weight:700;font-size:16px;line-height:1.5;letter-spacing:-0.04em;color:var(--color-text-dark);}

.insight_view_title_row{display:flex;width:100%;align-items:flex-start;justify-content:space-between;gap:100px;}
.insight_view_tit{flex:1;font-family:'Pretendard',sans-serif;font-weight:700;font-size:54px;line-height:1.07;letter-spacing:-0.05em;color:var(--color-text-dark);word-break:keep-all;}
.insight_view_actions{display:flex;flex-shrink:0;align-items:center;gap:20px;}
.insight_view_action_btn{display:flex;width:36px;height:36px;border:0;background:none;transition:opacity var(--transition-base);cursor:pointer;}
.insight_view_action_btn:hover{opacity:0.6;}
.insight_view_action_btn img{display:block;width:100%;height:100%;}

/* insight view divider */
.insight_view_divider{width:100%;height:2px;background:#333333;}

/* insight view attach — careers.css .apply_attach_row와 동일한 반투명 tan 오버레이 패턴(rgba(188,182,170,0.15))을 재사용한다 */
.insight_view_attach{display:flex;width:100%;padding:20px 30px;border-radius:2px;background:rgba(188,182,170,0.15);align-items:center;gap:40px;}
.insight_view_attach_label{font-family:'Pretendard',sans-serif;font-weight:700;font-size:18px;letter-spacing:-0.03em;color:var(--color-text-dark);}
.insight_view_attach_link{display:flex;font-family:'Pretendard',sans-serif;font-weight:600;font-size:16px;letter-spacing:-0.03em;color:var(--color-text-dark);text-decoration:underline;transition:opacity var(--transition-base);align-items:center;gap:2px;}
.insight_view_attach_link:hover{opacity:0.7;}
.insight_view_attach_link img{display:block;width:16px;height:16px;}

/* insight view body */
.insight_view_body{display:flex;width:100%;flex-direction:column;gap:20px;}
.insight_view_body p{font-family:'Pretendard',sans-serif;font-weight:600;font-size:18px;line-height:1.6;letter-spacing:-0.03em;color:#333333;word-break:keep-all;}

/* insight view photo */
.insight_view_photo{width:100%;}
.insight_view_photo img{display:block;width:100%;height:auto;}

/* insight view latest — 카드는 project.css의 .insight_card/.all_project_grid를 그대로 재사용한다 */
.insight_view_latest{display:flex;max-width:1560px;margin:30px auto 0;padding:0 30px;flex-direction:column;gap:20px;}  /* 30px = 피그마 실측(View List 버튼 하단 68673 → 롤링 상단 68703). 기존 100px 는 제거된 LIST(n) 제목 기준 여백이었다 */
.insight_view_latest_tit{font-family:'Inter',sans-serif;font-weight:800;font-size:24px;line-height:1.2;text-transform:uppercase;color:var(--color-text-dark);}
.insight_view_latest_grid{margin-bottom:0;}
.project_hero_tit_line{display:inline-flex;align-items:center;gap:25px;}
.project_hero_badge{display:inline-flex;flex-shrink:0;width:70px;height:50px;border-radius:234px;background:var(--color-accent-red);font-family:'Inter',sans-serif;font-weight:800;font-size:30px;letter-spacing:-0.02em;color:var(--color-white);justify-content:center;align-items:center;}

/* major project */
.major_project_section{overflow:hidden;width:100%;padding:100px 0 70px;}
.major_project_inner{max-width:1920px;margin:0 auto;padding:0 30px;}

/* major project head */
.major_project_head{display:flex;width:100%;margin-bottom:40px;align-items:center;gap:20px;}
.major_project_head_tit{flex-shrink:0;font-family:'Inter',sans-serif;font-weight:800;font-size:24px;line-height:90%;letter-spacing:-0.04em;color:var(--color-text-dark);}

/* major project head line — 슬라이드 진행률 게이지. fill의 width를 JS가 스와이퍼 progress(0~1)에 맞춰 갱신한다 (service.css의 .solution_head_line과 동일한 패턴) */
.major_project_head_line{overflow:hidden;position:relative;width:215px;height:1px;background:var(--color-border);flex-shrink:0;}
.major_project_head_line_fill{position:absolute;top:0;left:0;width:0%;height:100%;background:var(--color-accent-red);transition:width var(--transition-base);}

/* major project swiper */
.major_project_swiper_wrap{position:relative;width:100%;}
.major_project_swiper.swiper{overflow:visible;width:100%;}
.major_project_swiper .swiper-wrapper{align-items:stretch;}
.major_project_card.swiper-slide{width:min(880px,84vw);height:auto;flex-shrink:0;}
.major_project_card{display:flex;width:100%;flex-direction:column;}

/* major project card media */
.major_project_card_media{display:flex;overflow:hidden;position:relative;width:100%;height:460px;border-radius:2px;background:var(--color-surface);justify-content:center;align-items:center;}
.major_project_card_media img{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-slow);}
.major_project_card_media::after{content:'';display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(17,17,17,0.1);pointer-events:none;}
.major_project_card_arrow{display:flex;overflow:hidden;position:absolute;right:0;bottom:0;z-index:1;width:95px;height:95px;transition:transform var(--transition-base),background-color var(--transition-base);justify-content:center;align-items:center;}
.major_project_card_arrow img{width:100%;height:100%;object-fit:cover;}
.major_project_card:hover .major_project_card_arrow{background:rgba(0,0,0,0.3);transform:scale(1.1) rotate(10deg);}
.major_project_card:hover .major_project_card_media img{transform:scale(1.05);}

/* major project card body — 관리자가 등록하는 콘텐츠라 길이가 들쭉날쭉해도 카드 높이가 흔들리지 않도록 고정 높이(195px = padding 30+30 + 텍스트 영역 135px)를 준다 */
.major_project_card_body{display:flex;width:100%;height:195px;padding:30px;border-radius:2px;background:var(--color-white);align-items:flex-start;gap:35px;}
.major_project_card_text{display:flex;flex:1;min-width:0;flex-direction:column;gap:20px;}

/* 타이틀 1줄, 태그 1행은 nowrap으로, 설명은 항상 2줄만큼 공간을 차지하도록 고정 높이로 잡아 실제 줄 수와 무관하게 텍스트 영역 높이가 일정하게 유지되도록 한다 */
.major_project_card_tit{overflow:hidden;font-family:'Pretendard',sans-serif;font-weight:700;font-size:24px;line-height:1.2;letter-spacing:-0.04em;color:var(--color-text-dark);white-space:nowrap;text-overflow:ellipsis;}
.major_project_card_desc{display:-webkit-box;overflow:hidden;height:48px;font-family:'Pretendard',sans-serif;font-weight:600;font-size:16px;line-height:1.5;letter-spacing:-0.03em;color:var(--color-axis-line);word-break:keep-all;overflow-wrap:break-word;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;}
.major_project_card_tags{display:flex;overflow:hidden;flex-wrap:nowrap;gap:5px 10px;}
.major_project_card_tags li{overflow:hidden;font-family:'Pretendard',sans-serif;font-weight:600;font-size:13px;line-height:1.4;letter-spacing:-0.01em;color:#AFABA2;white-space:nowrap;text-overflow:ellipsis;flex-shrink:0;}
.major_project_card_badge{display:flex;flex-shrink:0;width:fit-content;padding:6px 10px;border-radius:4px;background:var(--color-bg-alt);font-family:'Inter',sans-serif;font-weight:700;font-size:12px;letter-spacing:-0.02em;color:var(--color-white);white-space:nowrap;justify-content:center;align-items:center;}

/* all project */
.all_project_section{width:100%;padding:100px 0 160px;}
.all_project_inner{max-width:1920px;margin:0 auto;padding:0 30px;}

/* all project head */
.all_project_head{display:flex;width:100%;margin-bottom:20px;padding-bottom:30px;border-bottom:2px solid #333;justify-content:space-between;align-items:flex-end;}
.all_project_head_tit{font-family:'Inter',sans-serif;font-weight:800;font-size:24px;line-height:90%;letter-spacing:-0.04em;color:var(--color-text-dark);}
.all_project_head_count{margin-left:5px;}

/* all project filter — 버튼/카운트 배지 베이스는 sub_common.css의 .pill_filter_btn, .pill_filter_count 공통 스타일을 따른다 */
.all_project_filter{display:flex;flex-direction:column;align-items:flex-end;gap:8px;}

/* all project grid */
.all_project_grid{display:grid;width:100%;margin-bottom:60px;grid-template-columns:repeat(4,1fr);gap:20px;}
.all_project_card{cursor:pointer;}
.all_project_card_thumb{display:flex;overflow:hidden;position:relative;width:100%;aspect-ratio:5/4;border-radius:2px;background:var(--color-surface);justify-content:center;align-items:center;}
.all_project_card_thumb img{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-slow);}
.all_project_card:hover .all_project_card_thumb img{transform:scale(1.05);}

/* all project card text — 타이틀+서브태그를 한 묶음으로 묶어 고정 높이를 준다. 관리자가 등록하는 콘텐츠라 길이가 제각각이어도 그리드 행 높이가 흔들리지 않도록 타이틀 2줄, 서브 1줄로 고정하고 넘치는 부분은 말줄임 처리한다 */
.all_project_card_text{display:flex;height:135px;padding:20px 90px 30px 10px;flex-direction:column;justify-content:space-between;}
.all_project_card_tit{display:-webkit-box;overflow:hidden;font-family:'Pretendard',sans-serif;font-weight:700;font-size:20px;line-height:1.2;letter-spacing:-0.02em;color:var(--color-text-dark);word-break:keep-all;overflow-wrap:break-word;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;}
.all_project_card_sub{display:flex;overflow:hidden;flex-wrap:wrap;align-items:center;gap:5px;}
.all_project_card_sub li{overflow:hidden;font-family:'Pretendard',sans-serif;font-weight:600;font-size:13px;line-height:1.2;letter-spacing:-0.03em;color:#AFABA2;white-space:nowrap;text-overflow:ellipsis;}
.all_project_card_sub li:not(:last-child)::after{content:'';display:inline-block;width:3px;height:3px;margin-left:5px;border-radius:50%;background:#D9D9D9;vertical-align:middle;}

/* insight card — Insight.html 게시판 카드. 그리드/스크롤 리빌 애니메이션은 all_project_grid, all_project_card 셀렉터를 그대로 공유하고, 카드 내부만 뉴스 리스트 형태(썸네일+타이틀+카테고리·날짜)로 구성한다. data-category 속성은 all_project_filter_btn의 data-filter 값과 매칭되도록 두어 추후 필터링 개발 시 그대로 연동할 수 있게 한다 */
.insight_grid.all_project_grid{grid-template-columns:repeat(3,1fr);}
.insight_card_link{display:flex;width:100%;flex-direction:column;}
.insight_card_thumb{display:flex;overflow:hidden;position:relative;width:100%;aspect-ratio:3/2;border-radius:2px;background:var(--color-surface);justify-content:center;align-items:center;}
.insight_card_thumb img{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-slow);}
.insight_card:hover .insight_card_thumb img{transform:scale(1.05);}
.insight_card_text{display:flex;width:100%;padding:20px 50px 30px 10px;flex-direction:column;gap:10px;}
.insight_card_tit{display:-webkit-box;overflow:hidden;font-family:Pretendard;font-weight:700;font-size:22px;font-style:normal;line-height:135%;letter-spacing:-0.88px;color:#222;word-break:keep-all;overflow-wrap:break-word;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;}
.insight_card_meta{display:flex;align-items:center;gap:15px;}
.insight_card_category{font-family:Inter;font-weight:600;font-size:14px;font-style:normal;line-height:135%;letter-spacing:-0.7px;color:#67635F;}
.insight_card_date{font-family:Pretendard;font-weight:600;font-size:14px;font-style:normal;line-height:140%;letter-spacing:-0.02em;color:var(--color-text-muted);}

/* all project pagination */
.all_project_pagination{display:flex;width:100%;justify-content:center;align-items:center;gap:15px;}
.all_project_page_btn{display:flex;width:52px;height:50px;border:1px solid #CCCCCC;border-radius:4px;font-family:'Inter',sans-serif;font-weight:500;font-size:16px;letter-spacing:-0.01em;color:#444444;transition:background-color var(--transition-base),color var(--transition-base),border-color var(--transition-base);justify-content:center;align-items:center;cursor:pointer;}
.all_project_page_btn:hover{background:var(--color-border);}
.all_project_page_btn.is_active{border-color:transparent;background:var(--color-accent-red);color:var(--color-white);}
.all_project_page_btn.is_active:hover{background:var(--color-accent-red);}
.all_project_page_ellipsis{display:flex;width:30px;height:50px;font-family:'Inter',sans-serif;font-weight:600;font-size:18px;letter-spacing:-0.01em;color:#444444;justify-content:center;align-items:center;}
.all_project_page_arrow{display:flex;width:52px;height:50px;border-radius:4px;background:#E8E7E2;transition:opacity var(--transition-base);justify-content:center;align-items:center;cursor:pointer;}
.all_project_page_arrow:hover{opacity:0.85;}
.all_project_page_arrow[disabled]{cursor:default;pointer-events:none;}
.all_project_page_arrow[disabled] img{opacity:0.4;}
.all_project_page_prev img{transform:rotate(180deg);}

/* ── Insights 상세 히어로(뉴스레터 구독 폼 포함) — 목록 페이지와 동일 컴포넌트 ── */
.newsletter_wrap.sub_hero {padding-bottom: 190px;}
/*GIF SIZE*/
.sub_hero_mascot{position: absolute;top: 260px;
    right: 0;
    width: 330px;height: 210px;}

/* newsletter subscribe — newsletter.html 히어로 우측 이메일 구독 폼. sub_hero_mascot·project_hero_figure와 같은 absolute 우측 배치 패턴을 따르되, 히어로 타이틀이 clamp()로 가변적이라 top 고정값 대신 수직 중앙 정렬로 높이 변화에 대응한다 */
.sub_mail_group .newsletter_subscribe_desc{font-family:'Pretendard',sans-serif;font-weight:600;font-size:18px;line-height:1.1;letter-spacing:-0.03em;color:var(--color-text-muted);}
.sub_mail_group .newsletter_subscribe_row{display:flex;width:100%;align-items:stretch;gap: 18px;}
.sub_mail_group .newsletter_subscribe_field{display:flex;width:490px;height:70px;border-bottom:2px solid var(--color-text-dark);align-items:center;gap:10px;flex-shrink:0;}
.sub_mail_group .newsletter_subscribe_field img{flex-shrink:0;}
.sub_mail_group .newsletter_subscribe_input{width:100%;font-family:'Pretendard',sans-serif;font-weight:700;font-size:28px;letter-spacing:-0.02em;color:var(--color-border-strong);}
.sub_mail_group .newsletter_subscribe_input::placeholder{color:var(--color-border-strong);}
.sub_mail_group .newsletter_subscribe_btn{display:flex;padding:0 20px; background: var(--color-accent-red);font-family: 'Pretendard', sans-serif; font-weight: 700;font-size: 22px;letter-spacing: -0.02em;color: var(--color-white);white-space: nowrap; transition: opacity var(--transition-base);justify-content: center; align-items: center; flex-shrink: 0;cursor: pointer; line-height: 110%;}
.sub_mail_group .newsletter_subscribe_btn:hover{opacity:0.85;}
.sub_mail_group .newsletter_subscribe_agree{display:flex;width:100%;margin-top:20px;align-items:center;gap:10px;}
.sub_mail_group .newsletter_subscribe_agree_label{display:flex;align-items:center;gap:5px;cursor:pointer;}
.sub_mail_group .newsletter_subscribe_check_input{display:block;width:27px;height:27px;border:2px solid #cacaca;border-radius:3px;background:var(--color-white);flex-shrink:0;cursor:pointer;transition:background-color var(--transition-base),border-color var(--transition-base);}
.sub_mail_group .newsletter_subscribe_check_input:checked{border-color:var(--color-accent-red);background:var(--color-accent-red) url('/main/images/common/check_ic.svg') no-repeat center/10px 7px;}
.sub_mail_group .newsletter_subscribe_agree_text{font-family:'Pretendard',sans-serif;font-weight:700;font-size:15px;letter-spacing:-0.02em;color:var(--color-text-dark);}
.sub_mail_group .newsletter_subscribe_agree_text em{font-style:normal;color:var(--color-accent-red);}
.sub_mail_group .newsletter_subscribe_agree_more{font-family:'Pretendard',sans-serif;font-weight:700;font-size:12px;letter-spacing:-0.02em;color:var(--color-text-muted);text-decoration:underline;}
.sub_mail_group {display: flex; justify-content: space-between;align-items: center;}

/* 상세 헤더 중앙 정렬 — 기존에는 insight_view.board.js 가 <style> 로 주입했으나
   페이지 CSS(js_content 와 함께 DB 관리)로 옮겨 재발행에도 유지되게 한다 */
.insight_view_head{align-items:center;}
.insight_view_meta{justify-content:center;}
.insight_view_title_row{justify-content:center;position:relative;}
.insight_view_tit{flex:0 1 auto;text-align:center;}
.insight_view_actions{position:absolute;top:0;right:0;}

@media screen and (min-width:1025px) and (max-width:1920px){
  .sub_hero_mascot{top:13.5417vw;right:0;width:17.1875vw;height:10.9375vw;}
}

/* ─────────────────────────────────────────────────────────────────────────────
   newsletter popup — 구독 관련 팝업 3종 + 안내 팝업.
     · 개인정보 이용 및 수집 동의(자세히보기)   : 762x704, 회색 박스 안 전문
     · 정상적으로 구독 신청이 완료되었습니다.   : 762x550 (공통 alert_popup 규격)
     · 이미 구독 신청이 완료된 메일입니다.      : 762x550
   오버레이/패널 모션 값은 공통 .alert_popup 과 동일하지만, common.js 가
   document.querySelector('.alert_popup') 로 헤더 문의 팝업 "하나만" 바인딩하므로
   래퍼 클래스를 .newsletter_popup 으로 분리해 충돌을 피한다.
   (내부 .alert_popup_panel / _tit / _desc 스타일은 그대로 재사용 — 노이즈 텍스처 ::before 포함)
   z-index 는 .gnb(100)·.solution_popup(300) 위, .cursor_dot(999) 아래로 둔다.
   ───────────────────────────────────────────────────────────────────────────── */
.newsletter_popup{display:flex;overflow:hidden;position:fixed;top:0;left:0;z-index:320;width:100%;height:100%;min-height:100dvh;justify-content:center;align-items:center;visibility:hidden;opacity:0;pointer-events:none;background:rgba(0,0,0,0.4);transition:opacity var(--transition-base),visibility var(--transition-base);}
.newsletter_popup.is_active{visibility:visible;opacity:1;pointer-events:auto;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);}
.newsletter_popup .alert_popup_panel{transform:scale(0.95);}
.newsletter_popup.is_active .alert_popup_panel{transform:scale(1);}
.newsletter_popup .project_submit_btn{width:318px;flex-shrink:0;cursor:pointer;}

/* 개인정보 동의 팝업 — 전문이 길어 회색 박스 내부만 스크롤시킨다(패널 높이는 디자인 704px 고정) */
.newsletter_agree_panel{height:704px;justify-content:flex-start;gap:40px;}
.newsletter_agree_box{width:100%;flex:1;min-height:0;overflow-y:auto;padding:27px 24px;border:1px solid #E5E3DF;border-radius:5px;background:#F1F0EE;text-align:left;}
.newsletter_agree_lead{font-family:'Pretendard',sans-serif;font-weight:700;font-size:14px;line-height:1.5;letter-spacing:-0.7px;color:var(--color-text-dark);}
.newsletter_agree_list{margin-top:20px;padding-left:18px;list-style:decimal;}
.newsletter_agree_list>li{font-family:'Pretendard',sans-serif;font-weight:700;font-size:14px;line-height:1.5;letter-spacing:-0.7px;color:var(--color-text-dark);}
.newsletter_agree_list>li+li{margin-top:20px;}
.newsletter_agree_list ul{margin-top:6px;padding-left:14px;list-style:none;}
.newsletter_agree_list ul li{font-weight:500;color:#444444;}
.newsletter_agree_list ul li::before{content:'- ';}
.newsletter_agree_note{margin-top:20px;font-family:'Pretendard',sans-serif;font-weight:700;font-size:14px;line-height:1.5;letter-spacing:-0.7px;color:var(--color-accent-red);}

/* 구독 폼 검증 실패 강조 — 이메일 미입력/형식오류 시 밑줄을 강조색으로 */
.sub_mail_group .newsletter_subscribe_field.is_error{border-bottom-color:var(--color-accent-red);}

/* 1920px~1025px 구간 — PC 디자인 비율 축소(위 PC 규칙과 동일 정책) */
@media screen and (min-width:1025px) and (max-width:1920px){
  .newsletter_popup .project_submit_btn{width:16.5625vw;}
  .newsletter_agree_panel{height:36.6667vw;gap:2.0833vw;}
  .newsletter_agree_box{padding:1.4063vw 1.25vw;border-radius:0.2604vw;}
  .newsletter_agree_lead,
  .newsletter_agree_list>li,
  .newsletter_agree_note{font-size:clamp(9px,0.7292vw,14px);letter-spacing:-0.0365vw;}
  .newsletter_agree_list{margin-top:1.0417vw;padding-left:0.9375vw;}
  .newsletter_agree_list>li+li{margin-top:1.0417vw;}
  .newsletter_agree_list ul{margin-top:0.3125vw;padding-left:0.7292vw;}
  .newsletter_agree_note{margin-top:1.0417vw;}
}

/* 1024px 이하 — 퍼블 전달분에 구독 폼/팝업 태블릿·모바일 규칙이 비어 있어(빈 @media)
   레이아웃이 깨지지 않을 최소 폴백만 얹는다. 모바일 상세 디자인 반영은 후속 퍼블 대상. */
@media only screen and (max-width:1024px){
  .newsletter_wrap.sub_hero{padding-bottom:120px;}
  .sub_mail_group{flex-direction:column;align-items:flex-start;gap:40px;}
  .sub_mail_group .newsletter_subscribe{width:100%;}
  .sub_mail_group .newsletter_subscribe_field{width:100%;height:56px;}
  .sub_mail_group .newsletter_subscribe_input{font-size:20px;}
  .sub_mail_group .newsletter_subscribe_btn{padding:0 18px;font-size:16px;}
  .insight_grid.all_project_grid{grid-template-columns:repeat(2,1fr);}
    .sub_mail_group .newsletter_subscribe_row {display: flex;flex-direction: column;}
button.newsletter_subscribe_btn {padding: 15px 10px;font-size: 18px;}

  .newsletter_popup .alert_popup_panel{width:90%;max-width:520px;height:auto;padding:32px 24px;gap:24px;}
  .newsletter_agree_panel{height:auto;max-height:80vh;}
  .newsletter_agree_box{max-height:46vh;flex:none;}
  .newsletter_popup .project_submit_btn{width:100%;max-width:318px;}
}

@media only screen and (max-width:768px){
  .sub_mail_group .newsletter_subscribe_row{flex-wrap:wrap;gap:12px;}
  .sub_mail_group .newsletter_subscribe_field{height:50px;}
  .sub_mail_group .newsletter_subscribe_input{font-size:18px;}
  .sub_mail_group .newsletter_subscribe_btn{width:100%;padding:16px 0;}
  .sub_mail_group .newsletter_subscribe_agree{flex-wrap:wrap;gap:8px;}
  .insight_grid.all_project_grid{grid-template-columns:1fr;}

  .newsletter_popup .alert_popup_panel{padding:24px 18px;gap:18px;}
  .newsletter_popup .alert_popup_tit{font-size:20px;letter-spacing:-0.8px;}
  .newsletter_popup .alert_popup_desc{font-size:14px;letter-spacing:-0.42px;}
}


/* 이전/다음 버튼 상태 구분 (2026-08-10) — 공통 sub_common.css 는 활성 색(--color-accent-red)만 정의해서
   ① 슬라이드가 노출 개수 이하로 잠겼을 때(watchOverflow) ② 첫/마지막 끝단일 때
   활성과 색이 완전히 같아 누를 수 있는지 구분이 안 됐다. Swiper 관례를 따른다(lock=숨김, disabled=흐림).
   ※ sub_common.css 의 .insight_view_latest_prev{display:flex} 가 Swiper 전역 .swiper-button-lock{display:none}
     을 같은 우선순위(0,1,0)로 덮으므로, 클래스 2개(0,2,0)로 확실히 이기게 쓴다. */
.insight_view_latest_prev.swiper-button-lock,
.insight_view_latest_next.swiper-button-lock{display:none;}
.insight_view_latest_prev.swiper-button-disabled,
.insight_view_latest_next.swiper-button-disabled{opacity:.3;cursor:default;pointer-events:none;}
/* ══ 하단 관련 목록 3건 — 2026-08-21 스와이퍼 이전 방식으로 회귀 ══════════════
   공통 sub.js 가 `.insight_view_latest_grid` 를 스와이퍼로 바꾸던 것을 되돌리면서
   그 훅 클래스와 공통 `.all_project_grid` 를 마크업(DB cms_page id=321)에서 떼었다.
   그래서 그리드 레이아웃을 이 화면이 직접 갖는다 — 공통 CSS/JS 는 무수정.
   열 수는 종전 스와이퍼 breakpoints(1025↑ 3 · 769~1024 2 · ~768 1)와 같게 맞췄다. */
.nv_latest_grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}
@media only screen and (max-width:1024px) {
    .nv_latest_grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media only screen and (max-width:768px) {
    .nv_latest_grid { grid-template-columns: 1fr; }
}