/* 공통 헤더와 페이지별 콘텐츠. 기존 메인의 시각적 스타일은 styles.css에 있습니다. */
.header{gap:25px;padding-inline:36px;height:100px}
.brand{display:flex;align-items:center;gap:12px;flex-shrink:0}
.brand-wordmark{display:flex;flex-direction:column;line-height:1.2;white-space:nowrap}
.brand-wordmark strong{font-size:23px;font-weight:760;letter-spacing:.035em}
.brand-wordmark>span{font-size:13px;font-weight:500;margin-top:5px;letter-spacing:-.025em;color:#656565}
.desktop-nav{gap:clamp(13px,1.45vw,25px)}
.desktop-nav>a{font-size:14px;position:relative}
.desktop-nav>a[aria-current=page]:after{content:"";position:absolute;left:0;right:0;bottom:23px;height:2px;background:var(--ink)}
.header-cta{gap:16px;font-size:13px;padding:9px 12px}
.mobile-nav a[aria-current=page]{font-weight:750}
.footer-top .brand-wordmark strong{font-size:20px}
.footer-top .brand-wordmark>span{font-size:12px}
.footer-top>.brand{gap:11px}
.footer-top nav{flex-wrap:wrap}
.mobile-only{display:none}
.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:13px;font-size:12px;color:#888;margin-bottom:48px}
.breadcrumb a:hover{color:#111}
.breadcrumb>span:last-child{color:#555}
.page-heading{padding-top:30px;padding-bottom:65px;border-bottom:1px solid var(--line)}
.page-heading .section-kicker{margin-bottom:20px}
.page-heading h1{font-size:clamp(38px,4.3vw,66px);font-weight:600;letter-spacing:-.06em}
.page-heading>p{font-size:24px;color:#6c6c6c;line-height:1.6;letter-spacing:-.035em;margin-top:20px}
.page-heading>.button{margin-top:30px}
.service-intro{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;padding-block:65px 90px}
.service-art{height:470px;position:relative;overflow:hidden}
.service-art>img{width:100%;height:100%;object-fit:cover}
.service-art.art-ocean:after,.service-art.art-gallery:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#0005,transparent 65%);pointer-events:none}
.art-kicker{position:absolute;top:30px;left:30px;right:25px;font-size:12px;letter-spacing:.06em;z-index:1}
.art-ocean{color:white;background:#0b4c67}
.art-gallery .art-kicker{color:#222}
.service-art>strong{position:absolute;left:35px;bottom:82px;right:20px;font-size:52px;line-height:1.2;letter-spacing:-.065em;font-weight:500;color:#fff;z-index:1}
.art-foot{position:absolute;left:35px;bottom:33px;color:#fff;font-size:11px;letter-spacing:.08em;z-index:1}
.service-intro-copy .section-kicker{display:block;margin-bottom:23px;font-size:11px;color:#7c7c7c}
.service-intro-copy h2,.detail-section h2,.process-section h2,.project-description h2{font-size:clamp(28px,2.8vw,40px);font-weight:570;line-height:1.4;letter-spacing:-.05em}
.service-intro-copy>p{font-size:16px;color:#707070;line-height:1.95;margin-top:22px}
.service-intro-copy .tags{margin-top:27px}
.service-intro-copy .button{margin-top:32px}
.service-art>.project-image{height:100%;width:100%;display:block}
.service-art .image-arrow{display:none}
.service-art .project-paper-title{top:110px;font-size:83px}
.service-art .project-paper-title>span{font-size:167px;left:222px}
.service-art .project-next-title{top:154px;font-size:110px}
.detail-section{padding-block:50px 90px}
.detail-section .section-heading{margin-bottom:32px}
.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px}
.feature-grid.two-columns{grid-template-columns:repeat(2,minmax(0,1fr))}
.feature-grid article{border-top:1px solid #161616;padding-top:22px}
.feature-grid article>span{font-size:12px;color:#777;letter-spacing:.06em}
.feature-grid h3{font-size:21px;font-weight:550;margin-top:25px;line-height:1.45;letter-spacing:-.04em}
.feature-grid p{font-size:16px;color:#777;line-height:1.9;margin-top:14px}
.process-section{padding-block:80px;background:#f5f5f2}
.process-section .section-heading{margin-bottom:40px}
.process-steps{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:60px;margin:0;padding:0}
.process-steps li{border-top:1px solid #bbb;padding-top:28px}
.process-steps li>span{font-size:12px;letter-spacing:.05em;color:#777}
.process-steps h3{font-size:27px;font-weight:550;margin-top:19px;letter-spacing:-.04em;line-height:1.4}
.process-steps p{font-size:16px;line-height:1.95;color:#707070;margin-top:20px}
.process-steps small{display:block;font-size:13px;line-height:1.8;color:#888;margin-top:25px;padding-top:20px;border-top:1px solid #ddd}
.preparation{display:grid;grid-template-columns:1fr 1.2fr;gap:65px;padding-block:85px}
.preparation .section-kicker{margin-bottom:20px}
.preparation p{font-size:16px;line-height:1.9;color:#777;margin-top:18px}
.preparation ul{list-style:none;margin:0;padding:0;border-top:1px solid #222}
.preparation li{display:flex;gap:24px;padding:20px 0;font-size:16px;line-height:1.7;border-bottom:1px solid var(--line)}
.preparation li>span{font-size:12px;line-height:2.25;color:#888;flex-shrink:0}
.page-next{display:grid;grid-template-columns:1fr 1fr;gap:50px;padding-block:34px 55px;border-top:1px solid #222}
.page-next a{font-size:14px;color:#777}
.page-next strong{display:block;color:#222;font-size:18px;font-weight:550;margin-top:9px;line-height:1.5}
.page-next a:hover strong{text-decoration:underline;text-underline-offset:5px}
.service-overview{border-top:1px solid #222}
.service-overview>a{display:flex;align-items:center;gap:40px;padding:32px 10px 32px 0;border-bottom:1px solid var(--line);transition:background .2s}
.service-overview>a:hover{background:#f7f7f4}
.overview-number{font-size:12px;color:#888;min-width:15px}
.service-overview h3{font-size:27px;font-weight:550;line-height:1.4}
.service-overview p{font-size:16px;margin-top:9px;color:#888}
.overview-format{margin-left:auto;font-size:12px;letter-spacing:.04em;color:#888;white-space:nowrap}
.overview-arrow{font-size:30px}
.home-links{display:grid;grid-template-columns:1fr 1fr;gap:50px;margin-bottom:100px}
.home-links>a{border-top:1px solid #222;padding-top:27px}
.home-links>a>span:first-child{font-size:11px;color:#888;letter-spacing:.04em}
.home-links h2{font-size:34px;font-weight:550;line-height:1.4;margin-top:25px}
.home-links .text-link{margin-top:24px}
.delivery-visual{height:470px;padding:35px;background:#e9edf2;display:flex;flex-direction:column}
.delivery-visual .section-kicker{font-size:11px;margin-bottom:22px}
.delivery-visual h2{font-size:36px;font-weight:550;line-height:1.35;letter-spacing:-.05em}
.delivery-channels{margin-top:34px;border-top:1px solid #bbb}
.delivery-channels>div{display:flex;align-items:center;gap:20px;padding:13px 0;border-bottom:1px solid #bcc3cb}
.delivery-channels>div>span:first-child{font-size:11px;color:#777}
.delivery-channels strong{font-size:19px;font-weight:500}
.delivery-channels>div>span:last-child{margin-left:auto;font-size:24px}
.delivery-bottom{font-size:10px;color:#777;letter-spacing:.09em;margin-top:auto}
.board-section{padding-block:50px 85px}
.board-intro{display:flex;justify-content:space-between;align-items:flex-end;gap:25px;margin-bottom:30px}
.board-intro p{font-size:16px;color:#777;line-height:1.9}
.board-intro>span{font-size:14px;color:#888;white-space:nowrap}
.board-intro strong{color:#222}
.portfolio-page .filter{display:inline-block}
.faq-board{padding-top:65px;padding-bottom:90px}
.faq-heading .text-link{margin-top:25px}
.project-article{padding-top:50px;padding-bottom:60px}
.project-large-preview{max-width:1040px;margin-inline:auto}
.project-large-preview>.project-image{height:550px}
.project-large-preview .image-arrow{display:none}
.project-large-preview .project-overlay{font-size:90px;bottom:70px;left:55px}
.project-large-preview .project-ocean .project-overlay{left:50%;bottom:200px}
.project-large-preview .project-paper-title{font-size:120px;left:70px;top:115px}
.project-large-preview .project-paper-title>span{font-size:240px;left:310px}
.project-large-preview .project-next-title{font-size:170px;top:165px;left:65px}
.project-large-preview .project-next-title>span{font-size:155px}
.project-large-preview .project-paper-top,.project-large-preview .image-label{font-size:14px}
.project-large-preview .project-paper-bottom{font-size:18px;bottom:40px}
.project-description{display:grid;grid-template-columns:.85fr 1.2fr;gap:60px;padding-block:70px}
.project-description .section-kicker{display:block;margin-bottom:20px}
.project-description p{font-size:17px;color:#777;line-height:1.9}
.project-description p+p{margin-top:20px}
.project-description .portfolio-footnote{font-size:14px;margin-top:24px}
.detail-navigation{display:flex;justify-content:space-between;gap:25px;padding-top:25px;border-top:1px solid #222;font-size:14px}
.detail-separator{padding-inline:12px;color:#bbb}
@media(min-width:1600px){.header{padding-inline:48px;gap:35px}.desktop-nav{gap:28px}.desktop-nav>a{font-size:15px}.header-cta{font-size:14px}}
@media(max-width:1180px){
  .header{padding-inline:30px;height:86px;gap:22px;position:sticky;top:0}
  .desktop-nav{display:none}.header-cta{display:flex;margin-left:auto;font-size:14px}
  .menu-toggle{width:32px;height:40px;display:flex;flex-direction:column;gap:6px;justify-content:center;padding:3px}
  .menu-toggle span{display:block;height:1px;width:25px;background:#111;transition:transform .2s}
  .menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3.5px) rotate(45deg)}
  .menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
  .mobile-nav{position:fixed;display:flex;top:86px;left:0;right:0;background:white;z-index:19;flex-direction:column;padding:16px 30px 28px;border-bottom:1px solid #ddd;box-shadow:0 15px 20px #0001;max-height:calc(100dvh - 86px);overflow:auto}
  .mobile-nav a{display:flex;justify-content:space-between;padding:13px 0;font-size:16px;border-bottom:1px solid #eee}
  .mobile-nav a>span{font-size:15px;color:#777}
  .service-intro{gap:40px}.service-art,.delivery-visual{height:420px}.service-art>strong{font-size:43px}
  .service-art .project-paper-title{font-size:68px;left:25px}.service-art .project-paper-title>span{font-size:135px;left:180px}
  .service-art .project-next-title{font-size:86px;left:25px}.service-art .project-next-title>span{font-size:77px;margin-left:10px}
  .delivery-visual{padding:28px}.delivery-visual h2{font-size:32px}.delivery-channels{margin-top:25px}
  .process-steps{gap:35px}.feature-grid{gap:25px}.preparation{gap:40px}
  .footer-top>p{display:none}
}
@media(max-width:900px) and (min-width:761px){
  .service-art,.delivery-visual{height:400px}.service-intro{gap:28px}.service-intro-copy h2{font-size:29px}.service-intro-copy>p{font-size:15px}
  .service-art .project-paper-title{font-size:58px;left:22px}.service-art .project-paper-title>span{font-size:113px;left:143px}
  .service-art .project-next-title{font-size:72px;left:20px}.service-art .project-next-title>span{font-size:60px;margin-left:6px}
  .service-art .project-paper-bottom{font-size:12px;left:23px}.feature-grid h3{font-size:19px}.feature-grid p{font-size:15px}
}
@media(max-width:760px){
  .header{height:80px;padding-inline:20px;gap:18px}.brand img{width:43px;height:43px}.brand{gap:10px}
  .brand-wordmark strong{font-size:21px}.brand-wordmark>span{font-size:12px;margin-top:4px}
  .mobile-nav{top:80px;max-height:calc(100dvh - 80px);padding-inline:22px}
  .mobile-only{display:block}.breadcrumb{font-size:11px;margin-bottom:32px;gap:10px}
  .page-heading{padding-top:24px;padding-bottom:37px}.page-heading .section-kicker{font-size:10px;margin-bottom:17px}
  .page-heading h1{font-size:36px;line-height:1.3}.page-heading>p{font-size:21px;margin-top:17px}
  .service-intro{grid-template-columns:1fr;gap:33px;padding-top:35px;padding-bottom:42px}
  .service-art,.delivery-visual{height:370px}.service-art>strong{font-size:42px;left:28px;bottom:78px}
  .art-kicker{font-size:10px;left:25px;top:25px}.art-foot{font-size:10px;left:28px;bottom:29px}
  .service-intro-copy .section-kicker{font-size:10px;margin-bottom:18px}
  .service-intro-copy h2,.detail-section h2,.process-section h2,.project-description h2{font-size:29px}
  .service-intro-copy>p{font-size:16px;margin-top:18px}.service-intro-copy .tags{margin-top:23px}.service-intro-copy .button{margin-top:26px}
  .service-art .project-paper-title{font-size:71px;top:77px;left:29px}.service-art .project-paper-title>span{font-size:140px;left:181px}
  .service-art .project-next-title{font-size:88px;top:126px;left:26px}.service-art .project-next-title>span{font-size:77px;margin-left:10px}
  .detail-section{padding-block:30px 55px}.detail-section .section-heading{margin-bottom:25px}
  .feature-grid,.feature-grid.two-columns{grid-template-columns:1fr;gap:30px}.feature-grid article{padding-top:18px}.feature-grid h3{font-size:21px;margin-top:13px}.feature-grid p{font-size:16px;margin-top:12px}
  .process-section{padding-block:50px}.process-section .section-heading{margin-bottom:28px}.process-section .section-heading>p{margin-top:18px}
  .process-steps{grid-template-columns:1fr;gap:33px}.process-steps li{padding-top:22px}.process-steps h3{font-size:24px;margin-top:12px}.process-steps p{font-size:16px;margin-top:15px}.process-steps small{font-size:13px;margin-top:20px;padding-top:15px}
  .preparation{grid-template-columns:1fr;gap:30px;padding-block:52px}.preparation p{font-size:16px}.preparation li{font-size:15px;padding-block:18px;gap:18px}
  .page-next{grid-template-columns:1fr;gap:28px;padding-block:28px 45px}.page-next strong{font-size:17px}
  .home-services{padding-bottom:65px}.service-overview>a{gap:20px;padding-block:25px;align-items:flex-start}.service-overview h3{font-size:23px}.service-overview p{font-size:15px;line-height:1.7}.overview-number{padding-top:6px}.overview-format{display:none}.overview-arrow{font-size:25px;margin-left:auto}
  .home-links{grid-template-columns:1fr;gap:35px;margin-bottom:55px}.home-links h2{font-size:29px;margin-top:18px}.home-links .text-link{margin-top:19px}
  .board-section{padding-block:33px 50px}.board-intro{display:block;margin-bottom:24px}.board-intro p{font-size:16px}.board-intro>span{display:block;margin-top:16px}.portfolio-toolbar{margin-bottom:28px}
  .faq-board{padding-block:40px 55px}.faq-heading .text-link{margin-top:20px}.faq-list{margin-top:28px}
  .project-article{padding-top:30px;padding-bottom:40px}.project-large-preview>.project-image{height:330px}
  .project-large-preview .project-overlay{font-size:55px;left:30px;bottom:40px}.project-large-preview .project-ocean .project-overlay{left:50%;bottom:105px;white-space:nowrap}
  .project-large-preview .project-paper-title{font-size:65px;left:26px;top:68px}.project-large-preview .project-paper-title>span{font-size:127px;left:168px}
  .project-large-preview .project-next-title{font-size:88px;left:22px;top:100px}.project-large-preview .project-next-title>span{font-size:74px;margin-left:8px}
  .project-large-preview .project-paper-top,.project-large-preview .image-label{font-size:10px}.project-large-preview .project-paper-bottom{font-size:12px;bottom:27px}
  .project-description{grid-template-columns:1fr;gap:26px;padding-block:38px}.project-description p{font-size:16px}.project-description .dialog-facts{grid-template-columns:1fr 1fr}.project-description .portfolio-footnote{font-size:14px}
  .detail-navigation{font-size:13px;gap:15px}.detail-separator{padding-inline:5px}
  .footer-top{align-items:center}.footer-top nav{margin-top:9px}
}
@media(max-width:600px){.header-cta{display:none}.menu-toggle{margin-left:auto}}
@media(max-width:370px){
  .header{padding-inline:17px}.brand-wordmark strong{font-size:20px}.brand img{width:39px;height:39px}
  .page-heading h1{font-size:31px}.page-heading>p{font-size:20px}.service-art,.delivery-visual{height:330px}
  .service-art>strong{font-size:36px}.service-art .project-paper-title{font-size:57px;left:23px;top:74px}.service-art .project-paper-title>span{font-size:110px;left:147px}
  .service-art .project-next-title{font-size:72px;left:20px;top:109px}.service-art .project-next-title>span{font-size:59px;margin-left:5px}
  .service-art .project-paper-bottom{font-size:11px;left:23px}.delivery-visual{padding:24px}.delivery-visual h2{font-size:27px}.delivery-visual .section-kicker{font-size:10px;margin-bottom:15px}.delivery-channels{margin-top:22px}.delivery-channels>div{padding-block:9px}.delivery-channels strong{font-size:16px}.delivery-bottom{margin-top:20px;font-size:9px}
  .project-large-preview .project-next-title{font-size:73px;left:19px}.project-large-preview .project-next-title>span{font-size:60px;margin-left:4px}.project-large-preview .project-paper-title{font-size:58px;left:23px}.project-large-preview .project-paper-title>span{font-size:108px;left:145px}
}