@charset "utf-8";

#wrapper.is_startup_page,
#wrapper.is_startup_page #container,
#wrapper.is_startup_page .shop-content{display:block;width:100%;max-width:none;margin:0;padding:0;float:none}

.startup-page{
    --startup-yellow:#ffda00;
    --startup-charcoal:#2e2e2b;
    --startup-ink:#20201e;
    --startup-muted:#6f6f6a;
    --startup-line:#d9d9d4;
    --startup-cream:#f8f6f0;
    color:var(--startup-ink);
    background:#fff;
    font-family:"Pretendard","Noto Sans KR",sans-serif;
    word-break:keep-all;
}
.startup-page *{box-sizing:border-box}
.startup-inner{width:min(calc(100% - 48px),1120px);margin:0 auto}
.startup-page img{max-width:100%;height:auto}

/* 페이지 타이틀과 로컬 내비 */

/* 공통 섹션 */
.startup-section{padding:86px 0}
.startup-section:nth-of-type(odd){background:var(--startup-cream)}
.startup-section[id]{scroll-margin-top:140px}
.startup-eyebrow{margin:0 0 14px;color:#555;font-size:14px;font-weight:900;line-height:1.4;letter-spacing:.035em}
.startup-section h2{margin:0;color:var(--startup-ink);font-size:48px;font-weight:800;line-height:1.2;letter-spacing:-.045em}
.startup-lead{margin:16px 0 0;color:var(--startup-muted);font-size:18px;line-height:1.7}

/* 왜 성북당인가 */
.startup-reason-hero{display:grid;grid-template-columns:330px minmax(0,1fr);align-items:center;gap:72px;margin-top:52px;padding:38px 0;background:transparent}
.startup-reason-copy h3{margin:0;font-size:31px;font-weight:800;line-height:1.35;letter-spacing:-.04em}
.startup-reason-number{display:block;margin-bottom:18px;color:#9a8100;font-size:14px;font-weight:900;line-height:1}
.startup-reason-copy p{margin:23px 0 0;color:var(--startup-muted);font-size:18px;line-height:1.5}
.startup-reason-hero figure{display:flex;min-height:270px;margin:0;align-items:center;justify-content:center;overflow:hidden;}
.startup-reason-hero img{display:block;max-height:330px;object-fit:contain}
.startup-products{margin-top:38px;padding-top:32px;border-top:1px solid var(--startup-line)}
.startup-number-heading{display:flex;align-items:flex-start;gap:12px;margin-bottom:26px}
.startup-number-heading>b{flex:0 0 auto;padding-top:4px;color:#555;font-size:16px;font-weight:900;line-height:1.3}
.startup-number-heading h3{margin:0;font-size:24px;font-weight:800;line-height:1.35;letter-spacing:-.035em}
.startup-number-heading p{margin:9px 0 0;color:var(--startup-muted);font-size:18px;line-height:1.5}
.startup-product-slider{position:relative}
.startup-products-viewport{overflow:hidden}
.startup-products-track{display:flex;gap:16px;overflow-x:auto;padding-bottom:8px;scroll-behavior:smooth;scroll-snap-type:x mandatory;scrollbar-width:none}
.startup-products-track::-webkit-scrollbar{display:none}
.startup-product-card{min-width:calc((100% - 64px)/5);flex:0 0 calc((100% - 64px)/5);scroll-snap-align:start}
.startup-product-card img{
    display:block;
    width:100%;
    height:auto;
}
.startup-product-card strong,.startup-product-card span{display:block}
.startup-product-card strong{margin-top:14px;font-size:16px;line-height:1.4}
.startup-product-card span{margin-top:4px;color:#888;font-size:13px}
.startup-product-prev,.startup-product-next{position:absolute;z-index:3;top:42%;display:flex;width:42px;height:42px;padding:0;border:1px solid #ddd;border-radius:50%;align-items:center;justify-content:center;color:var(--startup-charcoal);background:rgba(255,255,255,.94);box-shadow:0 5px 18px rgba(0,0,0,.1);font-size:30px;line-height:1;cursor:pointer;transform:translateY(-50%)}
.startup-product-prev{left:-21px}.startup-product-next{right:-21px}
.startup-product-prev[hidden],.startup-product-next[hidden]{display:none}
.startup-product-prev:disabled,.startup-product-next:disabled{opacity:.25;cursor:default}
.startup-strengths{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px;margin:44px 0 0;padding:0;list-style:none}
.startup-strengths li{display:grid;grid-template-columns:42px 1fr;padding:22px 0;border-top:1px solid var(--startup-line)}
.startup-strengths b{grid-row:1/3;color:#777;font-size:13px}
.startup-strengths strong{font-size:22px;line-height:1.45}
.startup-strengths span{grid-column:2;margin-top:6px;color:var(--startup-muted);font-size:16px;line-height:1.6}

/* 지도와 요약 */
.startup-map{width:min(100%,840px);margin:46px auto 35px;background:#10110d}
.startup-map img{display:block;width:100%}
.startup-summary-list{margin:0;border-top:1px solid var(--startup-line)}
.startup-summary-list div{display:grid;grid-template-columns:150px 1fr;padding:16px 4px;border-bottom:1px solid var(--startup-line)}
.startup-summary-list dt{font-weight:800}.startup-summary-list dd{margin:0;color:var(--startup-muted);line-height:1.6}

/* 반응형 표 */
.startup-table-wrap{margin-top:42px;overflow-x:auto;border-top:2px solid var(--startup-charcoal);outline:none;-webkit-overflow-scrolling:touch}
.startup-table{width:100%;border-collapse:collapse;border-spacing:0;background:#fff;font-size:16px;line-height:1.55}
.startup-table th,.startup-table td{padding:16px 20px;border-right:1px solid var(--startup-line);border-bottom:1px solid var(--startup-line);text-align:left;vertical-align:middle}
.startup-table tr>*:first-child{border-left:1px solid var(--startup-line)}
.startup-table thead th{color:var(--startup-ink);background:#eceae4;font-weight:800;text-align:center}
.startup-table tbody th{width:17%;background:#f7f6f2;font-weight:800;text-align:center}
.startup-table tbody td:nth-child(2){width:29%;font-weight:400}
.startup-cost-total th,.startup-cost-total td{background:#fff2a4!important;font-weight:900!important}
.startup-table-note{margin:14px 0 0;color:#777;font-size:14px;line-height:1.65}

/* 인테리어 갤러리 */
.startup-interior-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;margin-top:44px}
.startup-gallery-main{overflow:hidden;background:#e9e8e3}
.startup-gallery-main img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;transition:opacity .2s}
.startup-gallery-thumbs{display:flex;gap:7px;overflow-x:auto;margin-top:8px;padding-bottom:4px;scroll-snap-type:x mandatory;scrollbar-width:thin}
.startup-gallery-thumbs button{min-width:calc((100% - 28px)/5);flex:0 0 calc((100% - 28px)/5);padding:0;border:2px solid transparent;background:none;cursor:pointer;scroll-snap-align:start}
.startup-gallery-thumbs button.is-active{border-color:var(--startup-yellow)}
.startup-gallery-thumbs img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.startup-gallery-label{display:block;margin-top:18px;color:#777;font-size:14px;font-weight:900;line-height:1.4;letter-spacing:.03em}
.startup-gallery h3{margin:7px 0 0;font-size:26px;line-height:1.35}
.startup-gallery>p{margin:7px 0 0;color:var(--startup-muted);font-size:18px;line-height:1.65}
.startup-interior-note{margin:30px 0 0;color:#777;font-size:13px;line-height:1.65}

/* 창업 절차 */
.startup-process-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 24px;margin:45px 0 0;padding:0;list-style:none}
.startup-process-list li{position:relative;padding-top:8px}
.startup-process-list b{display:inline;margin-right:6px;color:inherit;font-size:inherit;font-weight:inherit}
.startup-process-list i{display:flex;width:64px;height:64px;margin:10px 0 15px;border-radius:13px;align-items:center;justify-content:center;color:var(--startup-charcoal);background:var(--startup-yellow);font-size:22px;font-style:normal;font-weight:900}
.startup-process-list i img{display:block;width:38px;height:38px;object-fit:contain}
.startup-process-list strong,.startup-process-list span{display:block}
.startup-process-list strong{font-size:20px;line-height:1.4}
.startup-process-list span{margin-top:5px;color:var(--startup-muted);font-size:16px;line-height:1.5}

/* 상담 폼 */
.startup-contact-call{display:flex;margin-top:35px;padding:18px 24px;align-items:center;gap:38px;background:#fff1a1}
.startup-contact-call span{font-size:15px;font-weight:800}.startup-contact-call a{color:var(--startup-ink);font-size:23px;font-weight:900}
.startup-form{margin-top:32px}
.startup-required-note{margin:0 0 22px;color:#777;font-size:13px;line-height:1.5}
.startup-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 26px}
.startup-form label>span,.startup-field-title{display:block;margin-bottom:9px;font-size:14px;font-weight:800}
.startup-form em{color:#777;font-size:12px;font-style:normal;font-weight:500}
.startup-form input[type="text"],.startup-form input[type="tel"],.startup-form input[type="email"],.startup-form select,.startup-form textarea{display:block;width:100%;border:1px solid var(--startup-line);border-radius:4px;background:#f7f7f5;color:var(--startup-ink);font:inherit;font-size:15px;outline:none}
.startup-form input[type="text"],.startup-form input[type="tel"],.startup-form input[type="email"],.startup-form select{height:50px;padding:0 15px}
.startup-form textarea{min-height:145px;padding:15px;line-height:1.65;resize:vertical}
.startup-form input:focus,.startup-form select:focus,.startup-form textarea:focus{border-color:#b59a00;box-shadow:0 0 0 3px rgba(255,218,0,.2);background:#fff}
.startup-radio-field{min-width:0}
.startup-radio-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));min-height:50px;align-items:center;gap:12px 22px}
.startup-radio-options-three{grid-template-columns:repeat(3,minmax(0,1fr))}
.startup-radio-options label{display:inline-flex;margin:0;align-items:center;gap:7px;font-size:14px;cursor:pointer}
.startup-form input[type="radio"],.startup-form input[type="checkbox"]{width:18px;height:18px;margin:0;accent-color:var(--startup-yellow)}
.startup-region-selects{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.startup-field-help{display:block;margin-top:7px;color:#888;font-size:12px;line-height:1.5}
.startup-form-wide{grid-column:1/-1}
.startup-privacy-box{margin-top:24px;padding:21px 24px;background:#f4f3ef}
.startup-privacy-box strong{display:block;font-size:14px}.startup-privacy-box p{margin:8px 0 0;color:#777;font-size:13px;line-height:1.65}
.startup-agree{display:flex;max-width:610px;margin-top:18px;padding:18px 20px;border:1px solid var(--startup-line);border-radius:5px;align-items:flex-start;gap:11px;background:#fafafa;font-size:14px;cursor:pointer}
.startup-agree input{margin-top:2px}.startup-agree span{margin:0!important}
.startup-agree strong,.startup-agree small{display:block}.startup-agree small{margin-top:5px;color:#777;font-size:12px;font-weight:400}
.startup-submit{display:block;width:100%;height:58px;margin-top:25px;border:0;color:var(--startup-charcoal);background:var(--startup-yellow);font-size:17px;font-weight:900;cursor:pointer}
.startup-submit:hover,.startup-submit:focus-visible{background:#f1c900}
.startup-honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}

@media (max-width:1024px){
    .startup-page{padding-top:64px}
    #wrapper.is_startup_page,
    #wrapper.is_startup_page #container,
    #wrapper.is_startup_page .shop-content{overflow:visible!important}
    .startup-section{padding:70px 0}
    .startup-section h2{font-size:42px}
    .startup-reason-hero{grid-template-columns:280px 1fr;gap:35px;padding:32px}
    .startup-product-card{min-width:calc((100% - 32px)/3);flex-basis:calc((100% - 32px)/3)}
}

@media (max-width:768px){
    .startup-page{overflow:visible;padding-top:64px}
    .startup-inner{width:calc(100% - 36px);max-width:1120px}
    .startup-section{padding:58px 0}
    .startup-section[id]{scroll-margin-top:122px}
    .startup-section h2{font-size:34px;letter-spacing:-1.4px}
    .startup-lead{font-size:16px;line-height:1.65}
    .startup-eyebrow{margin-bottom:10px}
    .startup-reason-hero{grid-template-columns:1fr;margin-top:32px;padding:0;gap:25px}
    .startup-reason-copy h3{font-size:26px}
    .startup-reason-copy p{margin-top:16px;font-size:16px;line-height:1.65}
    .startup-reason-hero figure{min-height:0;order:-1}
    .startup-reason-hero img{width:100%;max-height:none}
    .startup-products{margin-top:34px;padding-top:28px}
    .startup-number-heading{gap:9px;margin-bottom:22px}
    .startup-number-heading>b{padding-top:3px;font-size:14px}
    .startup-number-heading h3{font-size:22px;line-height:1.4}
    .startup-number-heading p{margin-top:8px;font-size:16px;line-height:1.65}
    .startup-product-slider{margin-right:-18px;margin-left:-18px}
    .startup-products-viewport{padding:0 18px}
    .startup-product-card{min-width:calc((100% - 12px)/2);flex-basis:calc((100% - 12px)/2)}
    .startup-products-track{gap:12px;padding-bottom:10px;scroll-padding-left:18px}
    .startup-product-card img{width:100%;height:auto;object-fit:contain}
    .startup-product-prev{left:8px}.startup-product-next{right:8px}
    .startup-product-prev,.startup-product-next{width:38px;height:38px;font-size:27px}
    .startup-strengths{grid-template-columns:1fr;margin-top:30px}
    .startup-strengths li{grid-template-columns:34px minmax(0,1fr);padding:20px 0}
    .startup-strengths strong{font-size:19px}
    .startup-strengths span{font-size:15px}
    .startup-map{margin:32px auto 26px}
    .startup-summary-list div{grid-template-columns:100px 1fr}
    .startup-interior-grid{grid-template-columns:1fr;gap:48px}
    .startup-gallery-main img{aspect-ratio:4/3}
    .startup-gallery-thumbs button{min-width:24%;flex-basis:24%}
    .startup-gallery h3{font-size:23px}
    .startup-gallery>p{font-size:16px}
    .startup-process-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 18px}
    .startup-process-list strong{font-size:17px}
    .startup-process-list span{font-size:14px}
    .startup-contact-call{margin-top:28px}
    .startup-form-grid{grid-template-columns:1fr}
    .startup-form-wide{grid-column:auto}
    .startup-form-grid>*{min-width:0}
    .startup-region-selects{grid-template-columns:1fr 1fr}
    .startup-radio-options{min-height:auto;padding:12px 0}
    .startup-privacy-box{overflow-wrap:anywhere}
    .startup-agree{max-width:none}

    /* 모바일에서는 표의 각 행을 읽기 쉬운 카드로 변환 */
    .startup-table-wrap{overflow:visible;border-top:0}
    .startup-table,.startup-table tbody,.startup-table tr{display:block;width:100%}
    .startup-table thead{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0)}
    .startup-table tr{margin-bottom:13px;border:1px solid var(--startup-line);background:#fff}
    .startup-table th,.startup-table td{width:auto!important;border:0!important;border-bottom:1px solid #ecece8!important;text-align:left!important}
    .startup-table tr>*:last-child{border-bottom:0!important}
    .startup-table tbody th{display:block;padding:13px 16px;background:#eceae4;font-size:15px}
    .startup-table tbody td,
    .startup-table tbody td:nth-child(2){
        display:grid;
        min-height:49px;
        padding:14px 16px;
        grid-template-columns:84px minmax(0,1fr);
        align-items:start;
        gap:16px;
        font-weight:500!important;
        line-height:1.55;
        word-break:keep-all;
        overflow-wrap:break-word;
    }
    .startup-table tbody td:before{position:static;width:auto;color:#777;font-size:12px;font-weight:800;line-height:1.65;content:attr(data-label)}
    .startup-table [rowspan]{display:block;width:auto!important}
}

@media (max-width:480px){
    .startup-inner{width:calc(100% - 28px)}
    .startup-section{padding:46px 0}
    .startup-section h2{font-size:29px;line-height:1.25}
    .startup-eyebrow{font-size:12px}
    .startup-lead{margin-top:12px;font-size:15px}
    .startup-reason-hero{margin-top:26px;padding:0}
    .startup-reason-copy h3{font-size:23px}
    .startup-products{margin-top:30px;padding-top:25px}
    .startup-number-heading{display:grid;grid-template-columns:25px minmax(0,1fr);gap:7px}
    .startup-number-heading h3{font-size:20px;letter-spacing:-.035em}
    .startup-number-heading p{grid-column:2;font-size:15px}
    .startup-product-slider{margin-right:-14px;margin-left:-14px}
    .startup-products-viewport{padding:0 14px}
    .startup-products-track{scroll-padding-left:14px}
    .startup-product-card strong{font-size:15px}
    .startup-product-card span{font-size:12px}
    .startup-product-prev,.startup-product-next{top:40%;width:36px;height:36px;font-size:24px}
    .startup-summary-list div{grid-template-columns:1fr;gap:5px}
    .startup-table tbody td,
    .startup-table tbody td:nth-child(2){grid-template-columns:78px minmax(0,1fr);gap:12px;padding:13px 14px}
    .startup-interior-grid{gap:38px;margin-top:32px}
    .startup-gallery-thumbs{gap:6px}
    .startup-gallery-thumbs button{min-width:31%;flex-basis:31%}
    .startup-process-list{gap:27px 14px;margin-top:34px}
    .startup-process-list i{width:48px;height:48px;margin-bottom:12px}
    .startup-process-list i img{width:29px;height:29px}
    .startup-contact-call{padding:16px;gap:20px;justify-content:space-between}
    .startup-contact-call a{font-size:20px}
    .startup-region-selects{grid-template-columns:1fr}
    .startup-radio-options,.startup-radio-options-three{grid-template-columns:1fr;gap:12px;padding:10px 0}
    .startup-form input[type="text"],.startup-form input[type="tel"],.startup-form input[type="email"],.startup-form select{font-size:16px}
    .startup-form textarea{font-size:16px}
    .startup-privacy-box{padding:18px}
    .startup-agree{padding:16px}
    .startup-submit{height:54px;font-size:16px}
}
