*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#171717;background:#fff;font-family:Pretendard,"Noto Sans KR",Arial,sans-serif;font-size:15px}a{color:inherit;text-decoration:none}.sidebar{position:fixed;inset:0 auto 0 0;width:205px;border-right:1px solid #e8e8e8;background:#fff;padding:25px 26px 22px;z-index:20;overflow:auto}.brand{display:block;text-align:center;margin-bottom:25px}.brand .mark{font-size:56px;font-weight:900;line-height:.9;letter-spacing:-5px}.brand strong{display:block;font-size:22px;margin-top:8px}.brand small{font-size:9px;color:#555}.mainnav,.cats{display:grid;gap:3px}.mainnav a,.cats a{padding:10px 9px;border-radius:4px;font-size:13px}.mainnav a.on{background:#f3f3f3;font-weight:700}.mainnav a span{margin-left:12px}.side-rule{border-top:1px solid #e6e6e6;margin:12px 0 18px}.sidebar h4{margin:0 0 8px;font-size:12px}.cats a{padding:7px 8px;color:#333}.quote{margin-top:30px;background:#f6f6f6;padding:18px 15px;line-height:1.8;font-size:12px}.quote:first-letter{font-size:25px;color:#aaa}.quote small{display:block;margin-top:10px}.social{text-align:center;margin:22px 0;font-size:15px}.copyright{display:block;font-size:9px;line-height:1.7;color:#555}.content{margin-left:205px;min-height:100vh;padding:54px 58px 0;overflow:hidden}.top-tools{position:absolute;right:35px;top:20px;font-size:25px}.section{max-width:1320px;margin:0 auto 30px}.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.section-head h2{font-size:19px;margin:0}.section-head>a{font-size:11px}.recent-grid{display:grid;grid-template-columns:repeat(5,minmax(190px,1fr));border-bottom:1px solid #eee;padding-bottom:28px}.recent-card{min-height:135px;padding:13px 18px;border-right:1px solid #e5e5e5}.recent-card:first-child{padding-left:0}.recent-card:last-child{border-right:0}.recent-card time{font-size:11px;color:#777}.recent-card h3{font-size:14px;line-height:1.55;margin:12px 0 22px;max-width:180px}.tag{display:inline-block;background:#f1f1f1;border-radius:3px;padding:4px 7px;font-size:10px;color:#555}.pipeline-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;padding-bottom:25px;border-bottom:1px solid #eee}.pipeline-card{height:75px;border:1px solid #ddd;display:flex;align-items:center;padding:13px 22px;gap:17px}.picon{font-size:34px;font-family:Arial;color:#222;min-width:38px;text-align:center}.pipeline-card h3{font-size:13px;margin:0 0 7px}.pipeline-card small{font-size:10px}.experience{margin-top:24px}.experience-track{display:flex;gap:22px;overflow-x:auto;padding-bottom:18px;scrollbar-width:thin}.exp-card{flex:0 0 315px}.exp-card img{width:315px;height:315px;object-fit:cover;background:#f1f1f1;display:block}.exp-copy{padding-top:14px}.exp-copy h3{font-size:15px;line-height:1.55;margin:8px 0}.exp-copy small{color:#777}.bottom-grid{max-width:1320px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr;gap:55px;border-top:1px solid #eee;padding:24px 0 45px}.tech-row{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid #eee;font-size:12px}.tech-row time{color:#777}.hobby article{display:flex;gap:16px;padding:10px 0;border-bottom:1px solid #eee}.hobby article img{width:105px;height:85px;object-fit:cover;background:#eee}.hobby h3{font-size:13px;line-height:1.5;margin:6px 0}.hobby article a{font-size:10px}footer{margin:0 -58px;border-top:1px solid #eee;padding:18px 58px;font-size:9px;color:#555}footer span{float:right}.mobile-menu{display:none}
@media(max-width:1100px){.content{padding-left:35px;padding-right:35px}.recent-grid{grid-template-columns:repeat(3,1fr)}.recent-card:nth-child(3){border-right:0}.recent-card:nth-child(n+4){display:none}.pipeline-grid{grid-template-columns:repeat(3,1fr)}.pipeline-card:nth-child(n+4){display:none}.bottom-grid{grid-template-columns:1fr}}
@media(max-width:760px){body{font-size:14px}.sidebar{transform:translateX(-100%);transition:.25s;width:240px;box-shadow:8px 0 30px rgba(0,0,0,.08)}.sidebar.open{transform:none}.mobile-menu{display:block;position:fixed;right:16px;top:14px;z-index:30;border:0;background:#fff;font-size:24px}.content{margin-left:0;padding:64px 18px 0}.top-tools{display:none}.section{margin-bottom:26px}.section-head h2{font-size:18px}.recent-grid{display:flex;overflow-x:auto;gap:10px;padding-bottom:16px}.recent-card,.recent-card:first-child{display:block!important;flex:0 0 235px;border:1px solid #e4e4e4;padding:16px;min-height:140px}.pipeline-grid{display:flex;overflow-x:auto;gap:10px;padding-bottom:18px}.pipeline-card,.pipeline-card:nth-child(n+4){display:flex;flex:0 0 235px;height:78px}.experience-track{gap:14px}.exp-card{flex-basis:78vw}.exp-card img{width:78vw;height:78vw}.bottom-grid{display:block;padding-top:10px}.hobby{margin-top:34px}.tech-row{gap:15px}.tech-row span{line-height:1.5}footer{margin:0 -18px;padding:18px;font-size:9px}footer span{float:none;display:block;margin-top:8px}}

/* sub pages */
.page-section,.article,.static-page{max-width:1320px;margin:0 auto 50px}.page-title{padding:35px 0 28px;border-bottom:1px solid #eee;margin-bottom:25px}.page-title h1,.static-page h1{font-size:42px;letter-spacing:-2px;margin:0 0 12px}.page-title p,.static-page p{color:#666;line-height:1.9}.filter-row{display:flex;gap:8px;margin-bottom:28px;flex-wrap:wrap}.filter-row a{border:1px solid #ddd;padding:8px 14px;font-size:12px}.filter-row a.on{background:#111;color:#fff;border-color:#111}.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:42px 24px}.post-thumb{aspect-ratio:1.25;background:#f3f3f3;display:grid;place-items:center;overflow:hidden}.post-thumb img{width:100%;height:100%;object-fit:cover}.post-thumb span{font-size:58px;color:#ddd;font-weight:800}.post-meta{display:flex;justify-content:space-between;margin-top:14px;color:#888;font-size:11px}.post-card h2{font-size:18px;line-height:1.55;margin:10px 0}.post-card p{font-size:12px;color:#777;line-height:1.7}.pagination{display:flex;justify-content:center;gap:5px;margin:45px 0}.pagination a{width:34px;height:34px;display:grid;place-items:center;border:1px solid #ddd}.pagination a.on{background:#111;color:#fff}.empty{padding:80px 0;text-align:center;color:#999}.article{max-width:900px}.article-head{padding:65px 0 30px;border-bottom:1px solid #eee}.article-head h1{font-size:44px;line-height:1.25;letter-spacing:-2px;margin:15px 0}.article-head p{color:#888}.article-cover{width:100%;margin:35px 0}.article-body{font-size:16px;line-height:2;padding:35px 0}.article-body h2{font-size:27px;margin:48px 0 15px}.article-body img{max-width:100%;height:auto}.article-body pre{background:#f5f5f5;padding:22px;overflow:auto;line-height:1.6}.article-tags{border-top:1px solid #eee;padding:20px 0}.article-tags span{margin-right:12px;color:#777}.article-back{padding:25px 0;border-top:1px solid #eee}.search-form{display:flex;max-width:700px;margin:30px 0}.search-form input{flex:1;border:0;border-bottom:2px solid #111;padding:15px;font-size:18px;outline:none}.search-form button,.black-btn{background:#111;color:#fff;border:0;padding:13px 22px}.search-list>a{display:block;padding:24px 0;border-bottom:1px solid #eee}.search-list h2{font-size:18px}.search-list p{color:#777}.pipeline-list{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.pipeline-big{display:flex;gap:25px;padding:35px;border:1px solid #ddd}.pipeline-big>span,.pipeline-detail-icon{font-size:55px}.pipeline-big h2{margin:7px 0}.pipeline-big p{color:#777}.static-page{max-width:850px;padding:70px 0;min-height:65vh}.static-page h2{margin-top:40px}.eyebrow{font-size:12px;letter-spacing:2px}.contact-form{display:grid;gap:18px;margin-top:35px}.contact-form label,.edit-form label{display:grid;gap:8px;font-size:12px}.contact-form input,.contact-form textarea{border:1px solid #ddd;padding:13px;font:inherit}.notice{background:#f4f4f4;padding:15px;margin:20px 0}.exp-thumb{width:315px;height:315px;background:#f1f1f1;display:grid;place-items:center;overflow:hidden}.exp-thumb img{width:100%;height:100%;object-fit:cover}.exp-thumb span,.hobby-thumb span{font-size:50px;color:#ccc;font-weight:800}.hobby-thumb{width:105px;height:85px;background:#eee;display:grid;place-items:center;overflow:hidden}.hobby-thumb img{width:100%;height:100%;object-fit:cover}
@media(max-width:900px){.post-grid{grid-template-columns:repeat(2,1fr)}.pipeline-list{grid-template-columns:1fr}.article-head h1{font-size:36px}}
@media(max-width:760px){.page-title h1,.static-page h1{font-size:32px}.post-grid{grid-template-columns:1fr;gap:30px}.article-head{padding-top:30px}.article-head h1{font-size:30px}.article-body{font-size:15px}.static-page{padding:35px 0}.exp-thumb{width:78vw;height:78vw}}


/* ===== ���� ��ü ��� ���̾ƿ� ���� �������̵� ===== */
.experience-track{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:30px 22px;
  overflow:visible;
  padding-bottom:18px;
}
.exp-card{width:100%;min-width:0;flex:none}
.exp-thumb{width:100%;height:auto;aspect-ratio:1/1;background:#f1f1f1;display:grid;place-items:center;overflow:hidden}
.exp-card img,.exp-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.pipeline-card:nth-child(n+4){display:flex}

@media(max-width:1100px){
  .pipeline-grid{grid-template-columns:repeat(3,1fr)}
  .pipeline-card:nth-child(n+4){display:flex}
  .experience-track{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media(max-width:760px){
  .pipeline-grid{display:flex;overflow-x:auto;gap:10px;padding-bottom:18px}
  .pipeline-card,.pipeline-card:nth-child(n+4){display:flex;flex:0 0 235px;height:78px}
  .experience-track{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:24px 12px;
    overflow:visible;
    padding-bottom:18px;
  }
  .exp-card{width:100%;min-width:0;flex:none}
  .exp-thumb{width:100%;height:auto;aspect-ratio:1/1}
  .exp-card img,.exp-thumb img{width:100%;height:100%;object-fit:cover}
}

/* ===== 2026-08 visual motion & main refinements ===== */
/* reveal: JS가 .is-visible을 붙이면 아래에서 위로 부드럽게 등장 */
.reveal-item{opacity:0;transform:translateY(34px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.reveal-item.is-visible{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion:reduce){.reveal-item{opacity:1;transform:none;transition:none}}

/* 공통 hover */
.recent-card,.pipeline-card,.exp-card,.post-card,.tech-row,.hobby article{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease,background .25s ease}
.recent-card:hover,.pipeline-card:hover,.exp-card:hover,.post-card:hover,.tech-row:hover,.hobby article:hover{transform:translateY(-5px)}
.pipeline-card:hover,.recent-card:hover{box-shadow:0 10px 28px rgba(0,0,0,.07);border-color:#cfcfcf}
.exp-thumb,.post-thumb,.hobby-thumb,.tech-thumb{transition:box-shadow .25s ease,border-color .25s ease}
.exp-thumb img,.post-thumb img,.hobby-thumb img,.tech-thumb img{transition:transform .4s ease}
.exp-card:hover img,.post-card:hover img,.hobby article:hover img,.tech-row:hover img{transform:scale(1.035)}

/* 경험노하우 / 기술해결 / 파이프라인 */
.exp-thumb{border:1px solid #dedede}
.exp-copy small{display:flex;align-items:center;gap:7px;color:#777}
.meta-dot{color:#bbb}

/* 기술 · 해결방법 */
.tech-row{justify-content:flex-start;align-items:center;gap:14px;padding:13px 0}
.tech-thumb{flex:0 0 82px;width:82px;height:64px;border:1px solid #dedede;overflow:hidden;background:#f3f3f3}
.tech-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.tech-copy{min-width:0;flex:1;display:flex;align-items:center;justify-content:space-between;gap:16px}
.tech-copy strong{font-size:15px;line-height:1.55;font-weight:700}
.tech-copy time{flex:0 0 auto;font-size:11px;color:#777}

@media(max-width:760px){
 .reveal-item{transform:translateY(24px)}
 .tech-thumb{flex-basis:72px;width:72px;height:58px}
 .tech-copy{display:block}
 .tech-copy strong{display:block;font-size:15px}
 .tech-copy time{display:block;margin-top:5px}
}

/* ===== External channels / affiliate items ===== */
.social-feed-section{max-width:1320px;margin:0 auto 34px;border-top:1px solid #eee;padding-top:26px}
.external-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.external-card{display:block;border:1px solid #e2e2e2;padding:18px;min-height:160px;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;background:#fff}
.external-card:hover{transform:translateY(-5px);box-shadow:0 12px 30px rgba(0,0,0,.07);border-color:#ccc}
.external-source{display:block;font-size:9px;letter-spacing:1.4px;color:#888;margin-bottom:9px}
.external-card h3{font-size:15px;line-height:1.55;margin:0 0 8px}.external-card p{font-size:12px;line-height:1.7;color:#666;margin:0 0 12px}.external-card time{font-size:10px;color:#999}
.external-thumb{display:block;height:150px;margin:-18px -18px 15px;overflow:hidden;border-bottom:1px solid #e2e2e2;background:#f7f7f7}.external-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}.external-card:hover .external-thumb img{transform:scale(1.035)}
.social-feed-section .external-grid:not(.threads-grid):not(.affiliate-grid){display:flex;overflow-x:auto;gap:16px;padding:0 0 14px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}.naver-card{flex:0 0 360px;scroll-snap-align:start}.naver-card .external-thumb{height:180px}
.thread-card{min-height:145px}.thread-text{font-size:14px!important;color:#222!important;line-height:1.75!important}
.affiliate-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.affiliate-card{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:150px}.affiliate-copy{display:block;flex:1;min-width:0}.affiliate-thumb{display:block;flex:0 0 118px;width:118px;height:118px;overflow:hidden;border:1px solid #e5e5e5;background:#f7f7f7}.affiliate-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}.affiliate-card:hover .affiliate-thumb img{transform:scale(1.04)}
.product-link{font-size:11px}.affiliate-notice{font-size:10px;color:#888;margin:13px 0 0}.feed-empty{grid-column:1/-1;padding:25px;border:1px dashed #ddd;color:#999;font-size:12px}
@media(max-width:760px){.social-feed-section{margin-bottom:28px}.naver-card{flex:0 0 78vw}.naver-card .external-thumb{height:150px}.threads-grid{display:flex;overflow-x:auto;gap:10px;padding-bottom:8px}.threads-grid .external-card{flex:0 0 78vw}.affiliate-grid{grid-template-columns:1fr}.affiliate-card{min-height:130px}.affiliate-thumb{flex-basis:96px;width:96px;height:96px}}


/* ===== 2026-08-31 main rounded panels + common notice bar ===== */
/* 전 페이지 공통 공지바 */
.site-notice-bar{max-width:1320px;height:34px;margin:0 auto 28px;background:#111;border-radius:7px;display:flex;align-items:center;justify-content:space-between;overflow:hidden}
.site-notice-open{height:100%;flex:1;min-width:0;border:0;background:transparent;color:#fff;text-align:left;padding:0 15px;font:inherit;font-size:12px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.site-notice-open:hover{text-decoration:underline}
.kakao-consult-btn{height:28px;margin-right:3px;padding:0 14px;border-radius:6px;background:#fee500;color:#191919;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;white-space:nowrap}
.kakao-consult-btn:before{content:'💬';font-size:12px;margin-right:5px}

/* 공지 레이어 */
.site-notice-modal{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:20px}
.site-notice-modal.open{display:flex}
.site-notice-dim{position:absolute;inset:0;background:rgba(0,0,0,.48)}
.site-notice-box{position:relative;z-index:1;width:min(520px,100%);max-height:80vh;overflow:auto;background:#fff;border-radius:18px;padding:30px;box-shadow:0 24px 70px rgba(0,0,0,.22)}
.site-notice-box h2{margin:0 35px 18px 0;font-size:22px}
.site-notice-content{font-size:14px;line-height:1.8;color:#555}
.site-notice-close{position:absolute;right:17px;top:13px;width:34px;height:34px;border:0;background:transparent;font-size:27px;line-height:1;cursor:pointer}
body.notice-modal-open{overflow:hidden}

/* 경험노하우 / 기술해결 / 파이프라인 : 참고 이미지처럼 연한 배경 + 라운드 */
.section.experience{background:#faf7f4;border:1px solid #eee7e1;border-radius:20px;padding:25px 24px 12px}
.section.experience .exp-card{background:#fff;border:1px solid #eadfd7;border-radius:16px;overflow:hidden;padding-bottom:15px}
.section.experience .exp-thumb{border:0;border-bottom:1px solid #eee7e1}
.section.experience .exp-copy{padding:14px 15px 0}

/* 쿠팡 추천 아이템 : 최근후기 카드 느낌 */
.affiliate-section{background:#faf7f4;border:1px solid #eee7e1;border-radius:20px;padding:25px 24px 18px}
.affiliate-section .affiliate-card{border:1px solid #eadfd7;border-radius:16px;background:#fff;overflow:hidden}
.affiliate-section .affiliate-thumb{border-radius:12px}

@media(max-width:760px){
  .site-notice-bar{height:34px;margin-bottom:22px;border-radius:6px}
  .site-notice-open{padding-left:11px;font-size:11px}
  .kakao-consult-btn{padding:0 9px;font-size:10px}
  .kakao-consult-btn:before{display:none}
  .site-notice-box{border-radius:14px;padding:24px 20px}
  .section.experience,.affiliate-section{border-radius:16px;padding:20px 14px 10px}
  .affiliate-section{padding-bottom:16px}
  .section.experience .exp-card{border-radius:13px}
  .affiliate-section .affiliate-card{border-radius:13px}
}