/* 2026-10-08 직원 피드백 반영
   1) 고객사 로고: 흑백 대신 채도를 낮춘 컬러
   2) 교육 분야 태그·목록 정리
   3) 홈 고객사 줄·과정 검색
   4) 모바일 전용 간소화: 홈 섹션 축소, 하단 메뉴 압축 */

/* 1. 고객사 로고 */
/* 줄바꿈: 제목은 줄 길이를 고르게, 본문은 마지막 줄에 한두 글자만 남지 않게 */
h1,h2,h3,h2>a,h3>a,.ccard h3,.catalog-card h3{text-wrap:balance}
p,li,dd,figcaption,summary{text-wrap:pretty}
/* 2026-10-08 로고 교체: 공식 CI 기준 투명 배경, 시각 크기 보정(width·height 속성) */
.client-grid img.client-logo,.home-client-grid img.client-logo{mix-blend-mode:normal;max-width:100%;height:auto;filter:saturate(.45) contrast(.96);opacity:.9;transition:filter .2s ease,opacity .2s ease}
@media(hover:hover){.home-client-grid li:hover .client-logo{filter:none;opacity:1}}
@media(hover:hover){.client-grid li:hover .client-logo{filter:none;opacity:1}}

/* 2. 교육 분야 페이지: 태그와 목록 */
.edu-topics{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 14px}
.edu-topics span{display:inline-flex;align-items:center;height:32px;padding:0 12px;border:1px solid var(--line);background:#fbfaf6;color:var(--ink);font-size:14px;font-weight:600}
.edu-topics+ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.edu-topics+ul li{position:relative;padding:12px 0 12px 18px;border-bottom:1px solid var(--line);font-size:16px;color:var(--text)}
.edu-topics+ul li::before{content:"";position:absolute;left:2px;top:23px;width:6px;height:6px;background:var(--ink)}

/* 3. 홈: 고객사 이름 목록 (로고 대신 사이트 글꼴로) */
.home-clients{padding-top:40px;padding-bottom:32px}
.home-clients-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;border-top:1px solid var(--text);padding-top:18px;margin-bottom:6px}
.home-clients-head h2{font-family:var(--sans);font-size:16px;font-weight:600;letter-spacing:-.01em;color:var(--text);line-height:1.5}
.home-clients-head p{font-size:14px;color:var(--muted)}
.home-client-grid{list-style:none;margin:0 0 20px;padding:0;display:grid;grid-template-columns:repeat(6,1fr)}
.home-client-grid li{display:flex;align-items:center;justify-content:center;height:80px;border-bottom:1px solid var(--line);padding:0 10px}
.home-clients>.text-link{font-size:14px}

/* 3. 홈: 과정 검색 */
.home-course-search{margin:0 0 18px;max-width:640px}
.home-course-search label{display:block;font-size:14px;font-weight:600;color:var(--ink);margin-bottom:8px}
.home-course-search-row{display:flex;gap:8px}
.home-course-search input{flex:1;min-width:0;margin:0;height:52px;min-height:52px;font-size:16px}
.home-course-search .button{height:52px;padding:0 24px;flex:none}
.purpose-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 32px}
.purpose-chips a{display:inline-flex;align-items:center;height:38px;padding:0 14px;border:1px solid var(--line);background:#fbfaf6;font-size:14px;font-weight:600;color:var(--ink)}
.purpose-chips a:hover{border-color:var(--ink)}

/* 교육 과정 찾기: 가이드북 과정 묶음 */
.catalog-controls{grid-template-columns:1.5fr 1fr 1fr auto}
.catalog-group{margin-top:56px}
.catalog-group .catalog-results-heading p{margin-top:6px;font-size:15px}
.guide-course-card h3{font-size:19px}

/* 하단 모바일 링크: 넓은 화면에서는 숨김 */
.footer-mobile{display:none}

/* 영상 아래 음악 출처: 닫혀 있을 때는 공간을 차지하지 않고, 열면 화면 안쪽으로 펼침 */
.hero-video figcaption{position:relative}
.hero-music-credit:not([open]) p{display:none}
.hero-music-credit[open] p{position:absolute;right:0;top:100%;z-index:5;width:min(320px,calc(100vw - 40px));margin:6px 0 0;padding:10px 12px;background:var(--paper);border:1px solid var(--line);box-shadow:0 6px 16px rgba(0,0,0,.08)}

@media(max-width:1100px){.home-client-grid{grid-template-columns:repeat(4,1fr)}.catalog-controls{grid-template-columns:1fr 1fr}.catalog-controls .catalog-search{grid-column:1/-1}}

/* 4. 모바일 전용 */
@media(max-width:734px){
  /* 홈: 핵심만 남기기 */
  .education-story,.trust-feature,.planning-gateway,.home-insights,.purpose-grid{display:none!important}
  /* 고객사 로고는 첫 화면 바로 아래가 아니라 수행실적 앞에 둡니다 */
  #main:has(> .home-clients){display:flex;flex-direction:column}
  #main:has(> .home-clients)>*{width:100%}
  #main>.home-clients,#main>.home-clients~.records,#main>.home-clients~.home-insights,#main>.home-clients~.contact-strip{order:1}
  .home-clients{padding-top:40px;padding-bottom:0}
  .home-clients-head{flex-direction:column;gap:0}
  .home-client-grid{grid-template-columns:repeat(3,1fr);margin-bottom:16px}
  .home-client-grid li{height:62px;padding:0 6px}
  .home-client-grid img.client-logo{transform:scale(.86)}

  /* 만드는 지식: 작은 이미지 + 제목 + 두 줄 설명 */
  .contents .sec-head p{display:none}
  .contents .content-grid{gap:0;border-top:1px solid var(--text)}
  .contents .ccard{display:grid;grid-template-columns:96px minmax(0,1fr);column-gap:16px;align-items:start;padding:18px 0;border-bottom:1px solid var(--line)}
  .contents .ccard-media{grid-column:1;grid-row:1/span 3;aspect-ratio:1/1;margin:0}
  .contents .ccard-media img{width:100%;height:100%;object-fit:cover}
  .contents .editorial-stage{display:block;width:100%;height:100%}
  .contents .editorial-stage-type{padding:10px;gap:0;justify-content:center}
  .contents .editorial-stage-type strong{font-size:13px;line-height:1.4;letter-spacing:-.02em}
  .contents .editorial-stage-type>span{display:none}
  .contents .ccard-body{display:contents}
  .contents .ccard h3{grid-column:2;font-size:18px;line-height:1.4;margin:0 0 6px}
  .contents .ccard-desc{grid-column:2;font-size:14px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .contents .ccard-link{display:none}

  /* 추천 프로그램 → 검색과 분야 버튼 */
  .purpose-finder .section-actions{margin-top:0}
  .home-course-search .button{padding:0 18px}
  .purpose-chips{margin-bottom:20px}

  /* 제작 영상: 옆으로 넘기기 */
  .videos-dark .video-grid{position:relative;display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-20px;padding-inline:20px;scrollbar-width:none}
  .videos-dark .video-grid::-webkit-scrollbar{display:none}
  .videos-dark .vcard{flex:0 0 84%;scroll-snap-align:start}
  .videos-dark .vcard .ccard-desc{display:none}

  /* 수행실적: 앞부분만 */
  .records .sec-head p{display:none}
  .records .rec-edu li:nth-child(n+6){display:none}
  .records .records-grid>div:nth-child(2) li:nth-child(n+5){display:none}

  /* 하단 메뉴 압축 */
  .structured-footer .footer-columns{display:none}
  .structured-footer .footer-top{gap:12px;margin-bottom:12px}
  .structured-footer .footer-contact{gap:0}
  .structured-footer .footer-contact a{font-size:15px;line-height:26px}
  .footer-mobile{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;margin:8px 0 18px;border-top:1px solid var(--line)}
  .footer-mobile a{display:flex;align-items:center;min-height:46px;border-bottom:1px solid var(--line);font-size:15px;font-weight:600;color:var(--text)}

  /* 교육 과정 찾기: 검색칸을 한 줄 전체로 */
  .catalog-controls{grid-template-columns:1fr 1fr;gap:12px}
  .catalog-controls label:nth-child(3){grid-column:auto}
  .catalog-controls .catalog-search,.catalog-controls .catalog-reset{grid-column:1/-1}
  .catalog-group{margin-top:40px}

  /* 교육 분야 페이지: 결정에 필요한 부분만 */
  .edu-layout #selection,.edu-layout #composition,.edu-layout #preparation,.edu-layout ~ .related-reading{display:none}

  /* 과정 카드: 두 줄 설명 + 한 줄 정보 */
  .catalog-card{padding:20px}
  .catalog-card h3{font-size:18px;line-height:1.45}
  .catalog-card>p{font-size:14px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:8px}
  .catalog-card .catalog-card-meta{display:flex;flex-wrap:wrap;gap:2px 10px;list-style:none;padding:0;margin:12px 0 0;font-size:13px}
  .catalog-card .catalog-card-meta li{color:var(--muted)}
  .catalog-card .catalog-card-meta li+li::before{content:"·";margin-right:10px}
  .catalog-card .catalog-card-meta li:nth-child(n+3){display:none}
  .catalog-card h3 a{text-decoration:none}
  .catalog-selection{display:none}

  /* 강사진: 작은 사진 + 핵심 경력 한 줄 */
  .faculty-grid{gap:0!important}
  .faculty-card{display:grid!important;grid-template-columns:76px minmax(0,1fr);column-gap:16px;align-items:start;padding:18px 0!important;border-bottom:1px solid var(--line)}
  .faculty-card .faculty-portrait{width:76px;height:76px;margin:0;overflow:hidden;background:#ebe7de}
  .faculty-card .faculty-portrait img{width:100%;height:100%;object-fit:cover;object-position:center top}
  .faculty-card--text .faculty-card-copy{grid-column:1/-1}
  .faculty-card h3{font-size:19px;line-height:1.4;margin:0}
  .faculty-card--text h3{margin-bottom:4px}
  .faculty-card .faculty-profile{font-size:13px}
  .faculty-card .faculty-field-label{font-size:13px;margin:2px 0 4px}
  .faculty-card .faculty-topics{font-size:14px;margin:0 0 6px}
  .faculty-card .faculty-biography{margin:0;padding:0;list-style:none;font-size:13px;line-height:1.55}
  .faculty-card .faculty-biography li+li,.faculty-card .faculty-source{display:none}

  /* 수행사례: 지면 이미지 대신 표만, 분야 칸 생략 */
  #records .project-record-source figure{display:none}
  #records td[data-label="관련 분야"]{display:none}
  #records .content-table.content-table--stack tbody>tr{padding:12px 0 14px}
  #records .content-table.content-table--stack tbody>tr>th{padding-top:0;margin-bottom:2px;font-size:16px;line-height:24px}
  #records .content-table.content-table--stack tbody>tr>td{max-width:none;font-size:15px;line-height:23px}
  #records .content-table.content-table--stack td::before{display:none}
  .case-card .case-cover{min-height:0!important;height:150px;padding:16px 18px!important}
  .case-card .case-graphic{font-size:40px!important}
  .case-card .case-graphic span,.case-card .case-foot{display:none}
}

/* 2026-10-11: mobile card summaries show the first sentence only */
.keep-together{white-space:nowrap}
@media (max-width:734px){.m-hide{display:none}.catalog-card>p{-webkit-line-clamp:3}}

/* four topic cards: 2 x 2 on wide screens */
@media (min-width:735px){.topic-grid:has(>:nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}}

/* 상호작용 움직임 (transitions.dev 05 메뉴, 21 접힘 상자, 08 페이지 이동 기준). 0.15~0.3초, 움직임 줄이기 설정이면 끔 */
@keyframes hv-drop { from { opacity: 0; translate: 0 -6px; } to { opacity: 1; translate: 0 0; } }
.gnb-disclosure[open] .gnb-panel { animation: hv-drop .18s cubic-bezier(.22,1,.36,1); }
@media (max-width: 1068px) {
  .hv-header.gnb-ready.gnb-open #primary-navigation { animation: hv-drop .22s cubic-bezier(.22,1,.36,1); }
}
@supports selector(::details-content) {
  .faq-item, .faculty-details { interpolate-size: allow-keywords; }
  .faq-item::details-content, .faculty-details::details-content {
    block-size: 0; overflow-y: clip; opacity: 0;
    transition: block-size .25s cubic-bezier(.22,1,.36,1), opacity .2s ease, content-visibility .25s allow-discrete;
  }
  .faq-item[open]::details-content, .faculty-details[open]::details-content { block-size: auto; opacity: 1; }
}
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .2s; animation-timing-function: ease; }
@media (prefers-reduced-motion: reduce) {
  .gnb-disclosure[open] .gnb-panel, .hv-header.gnb-ready.gnb-open #primary-navigation { animation: none; }
  .faq-item::details-content, .faculty-details::details-content { transition: none; }
  @view-transition { navigation: none; }
}

/* 2026-10-17 기술 수정: 블록 안에 나란히 놓인 링크 간격, 모바일 빵부스러기 글자 크기와 누름 영역 */
.trust-feature-copy > .text-link:has(+ .text-link),
.inquiry-reference > .text-link:has(+ .text-link),
p > .text-link:has(+ .text-link) { margin-inline-end: 20px; }
.inquiry-aside > .button:has(+ a) { margin-inline-end: 16px; }
@media (max-width: 734px) {
  .breadcrumb, .page-hero .breadcrumb { font-size: 13px; }
  .breadcrumb a { padding-inline: 8px; margin-inline: -8px; }
  .page-hero .breadcrumb a { padding-block: 6px; margin-block: -6px; }
}

/* 2026-10-17 3단계 시안(강사진·신규 PB 과정·방송·출판): 사진 없는 밝은 머리말, 강사 사진 묶음, 방송·출판 작업 목록 */
.page-hero--paper { min-height:0; background:var(--paper); color:var(--text); border-bottom:1px solid var(--line); }
.page-hero--paper .page-hero-shell { min-height:0; }
.page-hero--paper .breadcrumb { color:var(--muted); }
.page-hero--paper .page-hero-content { padding:36px 0 52px; max-width:860px; }
.page-hero--paper h1 { color:var(--ink); text-shadow:none; }
.page-hero--paper :is(.intro-desc,.article-lead), .page-hero--paper .page-hero-content > p { color:var(--muted); }
.page-hero--paper a:not(.button):hover { color:var(--ink); }
.page-hero--paper a:focus-visible { outline-color:#8b5e13; }
.page-hero--split .page-hero-shell { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,480px); column-gap:56px; align-items:center; }
.page-hero--split .breadcrumb { grid-column:1 / -1; }
.hero-people { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; padding:24px 0 52px; }
.hero-people img { width:100%; height:auto; aspect-ratio:1 / 1; object-fit:cover; object-position:center 30%; background:var(--sage); }
.content-portfolio .sec-head { margin-bottom:0; }
.portfolio-group { margin-top:40px; padding-top:18px; border-top:1px solid var(--ink); }
.portfolio-head { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:8px 24px; margin-bottom:24px; }
.portfolio-head h3 { font:600 19px/28px var(--sans); color:var(--ink); letter-spacing:0; }
.portfolio-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:32px 24px; }
.portfolio-card { min-width:0; }
.portfolio-media, .portfolio-cover { display:block; overflow:hidden; background:var(--sage); }
.portfolio-media img { width:100%; height:auto; aspect-ratio:16 / 9; object-fit:cover; transition:transform .25s cubic-bezier(.22,1,.36,1); }
.portfolio-card:hover .portfolio-media img { transform:scale(1.03); }
.portfolio-meta { margin-top:14px; font-size:14px; line-height:22px; color:var(--muted); }
.portfolio-book .portfolio-meta { margin-top:0; }
.content-portfolio h4 { margin:6px 0 0; font:600 18px/27px var(--sans); color:var(--ink); }
.content-portfolio h4 a:hover, .portfolio-card:hover h4 a, .portfolio-book:hover h4 a { text-decoration:underline; text-underline-offset:5px; }
.content-portfolio h4 + p { margin-top:8px; font-size:15px; line-height:24px; }
.portfolio-books { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; }
.portfolio-book { display:grid; grid-template-columns:120px minmax(0,1fr); gap:24px; align-items:start; }
.portfolio-cover img { width:100%; height:auto; }
.portfolio-platform { display:grid; grid-template-columns:minmax(0,300px) minmax(0,1fr); gap:48px; align-items:center; }
.portfolio-logo img { width:100%; max-width:300px; height:auto; }
.portfolio-activities { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0 0; padding:0; list-style:none; }
.portfolio-activities li { padding:6px 12px; border:1px solid var(--line); color:var(--ink); font-size:15px; line-height:22px; }
.portfolio-other { font-size:17px; line-height:28px; }
.portfolio-other .text-link { margin-left:12px; }
@media (max-width:1068px) {
  .page-hero--split .page-hero-shell { grid-template-columns:minmax(0,1fr); }
  .page-hero--split .page-hero-content { padding-bottom:24px; }
  .hero-people { max-width:560px; padding-top:0; }
  .portfolio-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .portfolio-books { grid-template-columns:minmax(0,1fr); }
}
@media (max-width:734px) {
  .page-hero--paper .page-hero-content { padding:24px 0 32px; }
  .hero-people { gap:6px; padding-bottom:32px; }
  .hero-people img:nth-child(n+9) { display:none; }
  .portfolio-group { margin-top:32px; }
  .portfolio-grid { display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; padding-bottom:4px; }
  .portfolio-grid > .portfolio-card { flex:0 0 78%; scroll-snap-align:start; }
  .portfolio-book { grid-template-columns:88px minmax(0,1fr); gap:16px; }
  .portfolio-platform { grid-template-columns:minmax(0,1fr); gap:16px; }
  .portfolio-logo img { max-width:220px; }
  .portfolio-other .text-link { margin-left:0; }
}

/* 2026-10-17 3단계 전체 적용: 밝은 머리말 안의 버튼·링크·글 정보, 회사소개 스튜디오 사진, 홈 카드 실제 자료 */
.page-hero--paper .article-meta { color:var(--muted); border-top-color:var(--line); }
.page-hero--paper :is(.text-link,.hero-contact,.contact-quick a) { background:transparent; border-radius:0; padding:10px 0; color:var(--ink); border-bottom:1px solid var(--ink); }
.page-hero--paper :is(.text-link,.hero-contact,.contact-quick a):hover { background:transparent; color:var(--ink); border-bottom-color:#628347; text-decoration:none; }
.page-hero--paper .button { background:var(--ink); border-color:var(--ink); color:#fff; }
.page-hero--paper .button:hover { background:#24564a; border-color:#24564a; color:#fff; }
.hero-photo { margin:24px 0 52px; }
.hero-photo img { width:100%; height:auto; aspect-ratio:4 / 3; object-fit:cover; }
.hero-photo figcaption { margin-top:8px; font-size:13px; line-height:20px; color:var(--muted); }
.ccard-media .ccard-stage { display:flex; align-items:center; justify-content:center; gap:5%; width:100%; height:100%; padding:7% 8%; background:#e9e2d2; }
.ccard-media .ccard-stage img { width:auto; height:100%; max-width:29%; object-fit:contain; flex:0 1 auto; box-shadow:0 1px 3px #2a221433; }
.ccard-media .ccard-stage--books img { max-width:34%; }
.ccard-media .ccard-stage--logo { flex-direction:column; gap:18px; background:#f1eee6; }
.ccard-media .ccard-stage--logo img { height:auto; width:56%; max-width:56%; box-shadow:none; }
.ccard-stage--logo > span { font-size:15px; line-height:22px; color:var(--ink); letter-spacing:.02em; }
@media (max-width:1068px) { .hero-photo { margin-top:0; max-width:560px; } }
@media (max-width:734px) {
  .hero-photo { margin-bottom:32px; }
  .contents .ccard-media .ccard-stage { padding:12%; }
  .contents .ccard-media .ccard-stage img { max-width:100%; }
  .contents .ccard-stage--guides img:not(:last-child), .contents .ccard-stage--books img:not(:first-child), .contents .ccard-stage--logo > span { display:none; }
  .contents .ccard-media .ccard-stage--logo img { width:100%; max-width:100%; }
}

/* 2026-10-17 모바일 회사소개: 스튜디오 출입구 사진 숨김 */
@media (max-width:734px){.about-story .about-studio{display:none}}
/* 2026-10-17 문의 실제 접수 */
.hp-field{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}
.inquiry-submit[aria-busy="true"]{opacity:.6;cursor:progress}
.sent-result{padding:8px 0}
.sent-result h2{font-size:24px;line-height:1.4}
.sent-result p{margin-top:12px;font-size:16px;line-height:1.75;color:var(--muted)}
.sent-result .text-link{margin-top:20px;font-size:15px}
.sent-result:focus{outline:none}

/* 2026-10-17 홈 '현장의 지식을' 사진: 확대·자르기 없이 위 카드와 같은 베이지 판에 원래 비율로 */
.education-story-media .education-story-frame{display:flex;align-items:center;justify-content:center;background:#e9e2d2;padding:9% 8%}
.education-story-media .education-story-frame img{width:100%;max-width:540px;height:auto;aspect-ratio:1079/508;object-fit:contain;box-shadow:0 1px 3px #2a221433}
@media (max-width:734px){.education-story-media .education-story-frame{padding:7% 6%}}

/* 2026-10-17 흐리게 늘어난 사진 정리: 원본보다 키우지 않고 베이지 판 위에 원래 비율로 */
.photo-frame{display:flex;align-items:center;justify-content:center;background:#e9e2d2;padding:9% 8%}
.photo-frame img{display:block;width:100%;height:auto;box-shadow:0 1px 3px #2a221433}
.hero-photo--framed .photo-frame img{aspect-ratio:auto;object-fit:contain}
.project-production-visual .photo-frame img{max-width:480px;max-height:none;object-fit:contain}
.platform-opening > img{object-fit:scale-down}
@media (max-width:734px){.photo-frame{padding:7% 6%}}

/* 2026-10-17 모바일 전체 점검 */
.card-title-link{padding-block:4px}
.article-meta a{display:inline-block;padding-block:6px}
.guide-cover--2025 img,.guide-cover--2023 img{object-fit:cover;object-position:right center}
@media (max-width:734px){
  .course-toc{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:8px}
  .course-toc a{display:flex;align-items:center;min-height:44px;padding:8px 12px;font-size:14px;line-height:20px}
  .course-aside .text-link{font-size:14px}
  .content-table.is-scrollable .table-scroll-hint{font-size:13px}
  img[src*="assets/legacy/education-lecture-original"],img[src*="assets/legacy/knowledge-books-original"]{width:100%;max-width:240px;height:auto}
}
/* 2026-10-20 삼성 인터넷 강제 다크 모드: 삼성 인터넷은 사이트 설정과 무관하게 배경을 어둡게 바꾼다.
   삼성 인터넷에서만 밝은 바탕을 이미지에 넣은 로고(assets/clients/chip)로 바꾼다(app.js). 바탕색이 페이지와 같아 밝은 화면에서는 차이가 없다. */
.ua-samsung img.client-logo{filter:none;opacity:1;width:150px;max-width:100%;height:auto}