{"id":112,"date":"2026-07-15T13:13:18","date_gmt":"2026-07-15T04:13:18","guid":{"rendered":"https:\/\/sunxogh.mycafe24.com\/?page_id=112"},"modified":"2026-07-16T09:07:49","modified_gmt":"2026-07-16T00:07:49","slug":"%ed%9a%8c%ec%82%ac%ec%86%8c%ea%b0%9c","status":"publish","type":"page","link":"https:\/\/salamander.co.kr\/?page_id=112","title":{"rendered":"\uc2dc\uacf5\uc0ac\ub840"},"content":{"rendered":"\n\n<!-- PORTFOLIO PAGE START -->\n\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@300;400;500;600;700&#038;family=Noto+Sans+KR:wght@300;400;500;600;700&#038;display=swap\" rel=\"stylesheet\">\n\n<link rel=\"stylesheet\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/aos@2.3.4\/dist\/aos.css\">\n\n<style>\n\n\/* ==================================================\n   PORTFOLIO PAGE\n================================================== *\/\n\nbody:has(#hnPortfolioHero){\n    --hn-black: #11130f;\n    --hn-deep: #19211c;\n    --hn-green: #305847;\n    --hn-green-light: #7d9a8a;\n    --hn-ivory: #f3f0e9;\n    --hn-white: #ffffff;\n    --hn-line: rgba(17, 19, 15, .15);\n    --hn-side: clamp(24px, 6vw, 110px);\n    --hn-content: 1320px;\n    --hn-ease: cubic-bezier(.22, .61, .36, 1);\n\n    color: var(--hn-black);\n    background: var(--hn-white);\n    font-family: \"Noto Sans KR\", sans-serif;\n    word-break: keep-all;\n    -webkit-font-smoothing: antialiased;\n}\n\n\/* \uae30\uc874 \uc6cc\ub4dc\ud504\ub808\uc2a4 \uc5ec\ubc31 \ubc0f \ud398\uc774\uc9c0 \uc81c\ubaa9 \uc81c\uac70 *\/\nbody:has(#hnPortfolioHero) .entry-header,\nbody:has(#hnPortfolioHero) .page-header,\nbody:has(#hnPortfolioHero) .entry-title{\n    display: none !important;\n}\n\nbody:has(#hnPortfolioHero) .entry-content,\nbody:has(#hnPortfolioHero) .site-content,\nbody:has(#hnPortfolioHero) .content-area{\n    margin-top: 0 !important;\n    padding-top: 0 !important;\n}\n\nbody:has(#hnPortfolioHero) .entry-content{\n    margin-bottom: 0 !important;\n}\n\n\/* \ud398\uc774\uc9c0 \uacf5\ud1b5 \ucd08\uae30\ud654 *\/\n.hn-portfolio-hero,\n.hn-portfolio-intro,\n.hn-portfolio-feature,\n.hn-portfolio-board-head,\n.hn-portfolio-cta{\n    width: 100vw;\n    max-width: none !important;\n    margin-right: 0;\n    margin-left: calc(50% - 50vw);\n    box-sizing: border-box;\n}\n\n.hn-portfolio-hero *,\n.hn-portfolio-intro *,\n.hn-portfolio-feature *,\n.hn-portfolio-board-head *,\n.hn-portfolio-cta *{\n    box-sizing: border-box;\n}\n\n.hn-portfolio-hero h1,\n.hn-portfolio-hero p,\n.hn-portfolio-intro h2,\n.hn-portfolio-intro p,\n.hn-portfolio-board-head h2,\n.hn-portfolio-board-head p,\n.hn-portfolio-cta h2,\n.hn-portfolio-cta p{\n    margin: 0;\n}\n\n.hn-portfolio-inner{\n    width: 100%;\n    max-width: var(--hn-content);\n    margin: 0 auto;\n}\n\n\n\/* ==================================================\n   SUB VISUAL\n================================================== *\/\n\n.hn-portfolio-hero{\n    position: relative;\n    display: flex;\n    min-height: clamp(580px, 76vh, 820px);\n    overflow: hidden;\n    color: var(--hn-white);\n    background: var(--hn-deep);\n    isolation: isolate;\n}\n\n.hn-portfolio-hero::before{\n    position: absolute;\n    inset: 0;\n    z-index: -3;\n    content: \"\";\n    background:\n        url(\"\/wp-content\/uploads\/2026\/07\/2.jpg\")\n        center 55% \/ cover no-repeat;\n    transform: scale(1.05);\n    animation: hnPortfolioHeroZoom 8s var(--hn-ease) forwards;\n}\n\n.hn-portfolio-hero::after{\n    position: absolute;\n    inset: 0;\n    z-index: -2;\n    content: \"\";\n    background:\n        linear-gradient(\n            90deg,\n            rgba(8, 14, 10, .88) 0%,\n            rgba(8, 14, 10, .64) 48%,\n            rgba(8, 14, 10, .17) 100%\n        ),\n        linear-gradient(\n            0deg,\n            rgba(8, 14, 10, .55) 0%,\n            transparent 55%\n        );\n}\n\n@keyframes hnPortfolioHeroZoom{\n    to{\n        transform: scale(1);\n    }\n}\n\n.hn-portfolio-hero-inner{\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    justify-content: flex-end;\n    width: 100%;\n    max-width: var(--hn-content);\n    min-height: inherit;\n    margin: 0 auto;\n    padding: 150px var(--hn-side) clamp(64px, 8vw, 112px);\n}\n\n.hn-portfolio-kicker{\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    margin-bottom: 24px !important;\n    font-family: \"Manrope\", sans-serif;\n    font-size: 11px;\n    font-weight: 700;\n    line-height: 1;\n    letter-spacing: .24em;\n    text-transform: uppercase;\n}\n\n.hn-portfolio-kicker::before{\n    display: block;\n    width: 38px;\n    height: 1px;\n    content: \"\";\n    background: currentColor;\n}\n\n.hn-portfolio-hero-title{\n    max-width: 940px;\n    margin-left: -5px !important;\n    color: var(--hn-white);\n    font-family: \"Manrope\", \"Noto Sans KR\", sans-serif !important;\n    font-size: clamp(56px, 7.3vw, 118px) !important;\n    font-weight: 400 !important;\n    line-height: .93 !important;\n    letter-spacing: -.065em;\n}\n\n.hn-portfolio-hero-title span{\n    display: block;\n    font-weight: 300;\n    color: rgba(255, 255, 255, .76);\n}\n\n.hn-portfolio-hero-bottom{\n    display: flex;\n    align-items: flex-end;\n    justify-content: space-between;\n    gap: 40px;\n    margin-top: clamp(42px, 7vh, 78px);\n    padding-top: 26px;\n    border-top: 1px solid rgba(255, 255, 255, .28);\n}\n\n.hn-portfolio-hero-desc{\n    width:100%;\n    color: rgba(255, 255, 255, .72);\n    font-size: clamp(13px, 1.1vw, 16px) !important;\n    font-weight: 300;\n    line-height: 1.85 !important;\n}\n\n.hn-portfolio-breadcrumb{\n    display: flex;\n    align-items: center;\n    gap: 11px;\n    flex: 0 0 auto;\n    color: rgba(255, 255, 255, .52);\n    font-family: \"Manrope\", \"Noto Sans KR\", sans-serif;\n    font-size: 10px;\n    font-weight: 600;\n    letter-spacing: .12em;\n    text-transform: uppercase;\n}\n\n.hn-portfolio-breadcrumb a{\n    color: inherit;\n    text-decoration: none;\n    transition: color .25s ease;\n}\n\n.hn-portfolio-breadcrumb a:hover,\n.hn-portfolio-breadcrumb strong{\n    color: var(--hn-white);\n}\n\n.hn-portfolio-breadcrumb i{\n    width: 18px;\n    height: 1px;\n    background: rgba(255, 255, 255, .38);\n}\n\n\n\/* ==================================================\n   INTRO\n================================================== *\/\n\n.hn-portfolio-intro{\n    padding: clamp(90px, 11vw, 170px) var(--hn-side);\n    background: var(--hn-ivory);\n}\n\n.hn-portfolio-intro-grid{\n    display: grid;\n    grid-template-columns: minmax(220px, .65fr) minmax(0, 1.7fr);\n    gap: clamp(56px, 10vw, 170px);\n    align-items: start;\n}\n\n.hn-portfolio-intro-index{\n    display: flex;\n    align-items: flex-start;\n    gap: 18px;\n    color: var(--hn-green);\n    font-family: \"Manrope\", sans-serif;\n}\n\n.hn-portfolio-intro-index strong{\n    font-size: clamp(68px, 8vw, 126px);\n    font-weight: 300;\n    line-height: .78;\n    letter-spacing: -.07em;\n}\n\n.hn-portfolio-intro-index span{\n    padding-top: 4px;\n    font-size: 10px;\n    font-weight: 700;\n    line-height: 1.5;\n    letter-spacing: .18em;\n    text-transform: uppercase;\n}\n\n.hn-portfolio-intro-content h2{\n    max-width: 900px;\n    color: var(--hn-black);\n    font-family: \"Manrope\", \"Noto Sans KR\", sans-serif !important;\n    font-size: clamp(36px, 4.2vw, 68px) !important;\n    font-weight: 400 !important;\n    line-height: 1.14 !important;\n    letter-spacing: -.055em;\n}\n\n.hn-portfolio-intro-content h2 em{\n    color: var(--hn-green);\n    font-style: normal;     font-weight: 500;\n}\n\n.hn-portfolio-intro-copy{\n    display: grid;\n    grid-template-columns: repeat(2, minmax(0, 1fr));\n    gap: clamp(30px, 5vw, 76px);\n    margin-top: clamp(42px, 6vw, 78px);\n    padding-top: 28px;\n    border-top: 1px solid var(--hn-line);\n}\n\n.hn-portfolio-intro-copy p{\n    color: rgba(17, 19, 15, .62);\n    font-size: 16px;\n    font-weight: 300;\n    line-height: 1.9;\n}\n\n.hn-portfolio-categories{\n    display: flex;\n    flex-wrap: wrap;\n    gap: 12px 30px;\n    margin-top: 38px;\n}\n\n.hn-portfolio-categories span{\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    gap: 10px;\n    color: var(--hn-black);\n    font-family: \"Manrope\", \"Noto Sans KR\", sans-serif;\n    font-size: 13px;\n    font-weight: 600;\n    letter-spacing: .08em;\n}\n\n.hn-portfolio-categories span::before{\n    width: 5px;\n    height: 5px;\n    content: \"\";\n    background: var(--hn-green);\n    border-radius: 50%;\n}\n\n\n\/* ==================================================\n   FEATURE IMAGE\n================================================== *\/\n\n.hn-portfolio-feature{\n    position: relative;\n    height: clamp(360px, 52vw, 680px);\n    overflow: hidden;\n    background: var(--hn-deep);\n}\n\n.hn-portfolio-feature-image{\n    position: absolute;\n    inset: 0;\n    background:\n        url(\"\/wp-content\/uploads\/2026\/07\/1-2.jpg\")\n        center \/ cover no-repeat;\n    transition: transform 1.4s var(--hn-ease);\n}\n\n.hn-portfolio-feature:hover .hn-portfolio-feature-image{\n    transform: scale(1.035);\n}\n\n.hn-portfolio-feature::after{\n    position: absolute;\n    inset: 0;\n    content: \"\";\n    background:\n        linear-gradient(\n            180deg,\n            rgba(8, 12, 9, .05) 30%,\n            rgba(8, 12, 9, .66) 100%\n        );\n}\n\n.hn-portfolio-feature-caption{\n    position: absolute;\n    right: var(--hn-side);\n    bottom: clamp(35px, 5vw, 72px);\n    left: var(--hn-side);\n    z-index: 2;\n    display: flex;\n    align-items: flex-end;\n    justify-content: space-between;\n    gap: 36px;\n    color: var(--hn-white);\n}\n\n.hn-portfolio-feature-caption small{\n    display: block;\n    margin-bottom: 10px;\n    font-family: \"Manrope\", sans-serif;\n    font-size: 10px;\n    font-weight: 700;\n    letter-spacing: .2em;\n    text-transform: uppercase;\n    opacity: .65;\n}\n\n.hn-portfolio-feature-caption h3{\n    margin: 0;\n    color: var(--hn-white);\n    font-family: \"Manrope\", \"Noto Sans KR\", sans-serif !important;\n    font-size: clamp(27px, 3.4vw, 54px) !important;\n    font-weight: 400 !important;\n    line-height: 1.15 !important;\n    letter-spacing: -.045em;\n}\n\n.hn-portfolio-feature-no{\n    color: rgba(255, 255, 255, .72);\n    font-family: \"Manrope\", sans-serif;\n    font-size: 11px;\n    font-weight: 600;\n    letter-spacing: .14em;\n}\n\n\n\/* ==================================================\n   BOARD HEAD\n================================================== *\/\n\n.hn-portfolio-board-head{\n    padding: clamp(90px, 11vw, 160px) var(--hn-side) 48px;\n    background: var(--hn-white);\n}\n\n.hn-portfolio-board-heading{\n    display: grid;\n    grid-template-columns: minmax(0, 1fr) auto;\n    gap: 40px;\n    align-items: end;\n    padding-bottom: 34px;\n    border-bottom: 1px solid var(--hn-line);\n}\n\n.hn-portfolio-board-head .hn-portfolio-kicker{\n    margin-bottom: 18px !important;\n    color: var(--hn-green);\n}\n\n.hn-portfolio-board-head h2{\n    color: var(--hn-black);\n    font-family: \"Manrope\", \"Noto Sans KR\", sans-serif !important;\n    font-size: clamp(42px, 5.4vw, 78px) !important;\n    font-weight: 400 !important;\n    line-height: .98 !important;\n    letter-spacing: -.06em;\n}\n\n.hn-portfolio-board-head h2 span{\n    color: var(--hn-green);\n    font-weight: 300;\n}\n\n.hn-portfolio-board-desc{\n    max-width: 400px;\n    padding-bottom: 4px;\n    color: rgba(17, 19, 15, .52);\n    font-size: 16px !important;\n    font-weight: 300;\n    line-height: 1.8 !important;\n    text-align: right;\n}\n\n\n\/* ==================================================\n   MANGBOARD SHORTCODE AREA\n================================================== *\/\n\nbody:has(#hnPortfolioHero) .hn-portfolio-board-wrap{\n    width: 100vw !important;\n    max-width: none !important;\n    margin: 0 0 0 calc(50% - 50vw) !important;\n    padding: 0 var(--hn-side) clamp(100px, 12vw, 180px) !important;\n    background: var(--hn-white);\n    box-sizing: border-box;\n}\n\nbody:has(#hnPortfolioHero) .hn-portfolio-board-wrap > *{\n    width: 100%;\n    max-width: var(--hn-content) !important;\n    margin-right: auto !important;\n    margin-left: auto !important;\n}\n\n\/* \ub9dd\ubcf4\ub4dc \uc804\uccb4 *\/\n.hn-portfolio-board-wrap .mb-board{\n    width: 100% !important;\n    color: var(--hn-black);\n    font-family: \"Noto Sans KR\", sans-serif !important;\n}\n\n\/* \uae30\ubcf8 \ud14c\ub450\ub9ac \uc0c9\uc0c1 \uc815\ub9ac *\/\n.hn-portfolio-board-wrap .mb-board table{\n    width: 100%;\n    border-collapse: collapse;\n    border-top-color: var(--hn-black) !important;\n}\n\n.hn-portfolio-board-wrap .mb-board th,\n.hn-portfolio-board-wrap .mb-board td{\n    border-color: rgba(17, 19, 15, .12) !important;\n}\n\n\/* \uc785\ub825 \uc694\uc18c *\/\n.hn-portfolio-board-wrap .mb-board input[type=\"text\"],\n.hn-portfolio-board-wrap .mb-board input[type=\"search\"],\n.hn-portfolio-board-wrap .mb-board select{\n    border: 1px solid rgba(17, 19, 15, .16) !important;\n    border-radius: 0 !important;\n    outline: none !important;\n    box-shadow: none !important;\n}\n\n\/* \ub9dd\ubcf4\ub4dc \ubc84\ud2bc *\/\n.hn-portfolio-board-wrap .mb-board button,\n.hn-portfolio-board-wrap .mb-board input[type=\"button\"],\n.hn-portfolio-board-wrap .mb-board input[type=\"submit\"],\n.hn-portfolio-board-wrap .mb-board .btn{\n    color: var(--hn-white) !important;\n    border: 1px solid var(--hn-green) !important;\n    border-radius: 999px !important;\n    background: var(--hn-green) !important;\n    box-shadow: none !important;\n    transition:\n        color .25s ease,\n        background .25s ease,\n        border-color .25s ease !important;\n}\n\n.hn-portfolio-board-wrap .mb-board button:hover,\n.hn-portfolio-board-wrap .mb-board input[type=\"button\"]:hover,\n.hn-portfolio-board-wrap .mb-board input[type=\"submit\"]:hover,\n.hn-portfolio-board-wrap .mb-board .btn:hover{\n    color: var(--hn-white) !important;\n    border-color: var(--hn-black) !important;\n    background: var(--hn-black) !important;\n}\n\n\/* \ud398\uc774\uc9c0\ub124\uc774\uc158 *\/\n.hn-portfolio-board-wrap .mb-board .pagination a,\n.hn-portfolio-board-wrap .mb-board .pagination span{\n    border-radius: 50% !important;\n}\n\n\n\/* ==================================================\n   CTA\n================================================== *\/\n\n.hn-portfolio-cta{\n    position: relative;\n    overflow: hidden;\n    padding: clamp(90px, 11vw, 155px) var(--hn-side);\n    color: var(--hn-white);\n    background: var(--hn-deep);\n}\n\n.hn-portfolio-cta::before{\n    position: absolute;\n    top: -180px;\n    right: -130px;\n    width: 520px;\n    height: 520px;\n    content: \"\";\n    border: 1px solid rgba(255, 255, 255, .08);\n    border-radius: 50%;\n}\n\n.hn-portfolio-cta::after{\n    position: absolute;\n    right: 110px;\n    bottom: -290px;\n    width: 620px;\n    height: 620px;\n    content: \"\";\n    border: 1px solid rgba(255, 255, 255, .05);\n    border-radius: 50%;\n}\n\n.hn-portfolio-cta-inner{\n    position: relative;\n    z-index: 2;\n    display: grid;\n    grid-template-columns: minmax(0, 1fr) auto;\n    gap: 50px;\n    align-items: end;\n}\n\n.hn-portfolio-cta .hn-portfolio-kicker{\n    color: rgba(255, 255, 255, .72);\n}\n\n.hn-portfolio-cta h2{\n    max-width: 870px;\n    color: var(--hn-white);\n    font-family: \"Manrope\", \"Noto Sans KR\", sans-serif !important;\n    font-size: clamp(42px, 5.4vw, 70px) !important;\n    font-weight: 400 !important;\n    line-height: 1.03 !important;\n    letter-spacing: -.06em;\n}\n\n.hn-portfolio-cta h2 span{\n    display: block;\n    color: rgba(255, 255, 255, .55);\n    font-weight: 300;\n}\n\n.hn-portfolio-cta-button{\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 34px;\n    width: 220px;\n    height: 62px;\n    padding: 0 26px;\n    overflow: hidden;\n    color: var(--hn-black) !important;\n    font-family: \"Manrope\", \"Noto Sans KR\", sans-serif;\n    font-size: 12px;\n    font-weight: 700;\n    letter-spacing: .05em;\n    text-decoration: none !important;\n    background: var(--hn-white);\n    border-radius: 999px;\n    transition:\n        color .35s ease,\n        background .35s ease,\n        transform .35s ease;\n}\n\n.hn-portfolio-cta-button:hover{\n    color: var(--hn-white) !important;\n    background: var(--hn-green);\n    transform: translateY(-3px);\n}\n\n.hn-portfolio-cta-button svg{\n    width: 18px;\n    height: 18px;\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.5;\n}\n\n\n\/* ==================================================\n   TABLET\n================================================== *\/\n\n@media (max-width: 1024px){\n\n    .hn-portfolio-intro-grid{\n        grid-template-columns: minmax(170px, .5fr) minmax(0, 1.5fr);\n        gap: 60px;\n    }\n\n    .hn-portfolio-board-heading{\n        grid-template-columns: 1fr;\n        gap: 22px;\n    }\n\n    .hn-portfolio-board-desc{\n        max-width: 540px;\n        text-align: left;\n    }\n\n    .hn-portfolio-cta-inner{\n        grid-template-columns: 1fr;\n    }\n\n}\n\n\n\/* ==================================================\n   MOBILE\n================================================== *\/\n\n@media (max-width: 767px){\n\n    body:has(#hnPortfolioHero){\n        --hn-side: 20px;\n    }\n\n    .hn-portfolio-hero{\n        min-height: 560px;\n    }\n\n    .hn-portfolio-hero::before{\n        background-position: 62% center;\n    }\n\n    .hn-portfolio-hero::after{\n        background:\n            linear-gradient(\n                90deg,\n                rgba(8, 14, 10, .86),\n                rgba(8, 14, 10, .36)\n            ),\n            linear-gradient(\n                0deg,\n                rgba(8, 14, 10, .55),\n                transparent 60%\n            );\n    }\n\n    .hn-portfolio-hero-inner{\n        justify-content: flex-end;\n        padding-top: 110px;\n        padding-bottom: 48px;\n    }\n\n    .hn-portfolio-kicker{\n        gap: 11px;\n        margin-bottom: 17px !important;\n        font-size: 9px;\n        letter-spacing: .18em;\n    }\n\n    .hn-portfolio-kicker::before{\n        width: 27px;\n    }\n\n    .hn-portfolio-hero-title{\n        margin-left: -2px !important;\n        font-size: clamp(48px, 15vw, 70px) !important;\n        line-height: .94 !important;\n    }\n\n    .hn-portfolio-hero-bottom{\n        display: block;\n        margin-top: 38px;\n        padding-top: 20px;\n    }\n\n    .hn-portfolio-hero-desc{\n        max-width: 92%;\n        font-size: 14px !important;\n        line-height: 1.75;\n    }\n\n    .hn-portfolio-breadcrumb{\n        margin-top: 28px;\n        font-size: 8px;\n    }\n\n    .hn-portfolio-intro{\n        padding-top: 82px;\n        padding-bottom: 82px;\n    }\n\n    .hn-portfolio-intro-grid{\n        display: block;\n    }\n\n    .hn-portfolio-intro-index{\n        margin-bottom: 45px;\n    }\n\n    .hn-portfolio-intro-index strong{\n        font-size: 68px;\n    }\n\n    .hn-portfolio-intro-content h2{\n        font-size: clamp(31px, 9.5vw, 32px) !important;\n        line-height: 1.22 !important;\n    }\n\n    .hn-portfolio-intro-copy{\n        grid-template-columns: 1fr;\n        gap: 18px;\n        margin-top: 36px;\n        padding-top: 23px;\n    }\n\n    .hn-portfolio-intro-copy p{\n        font-size: 14px;\n        line-height: 1.8;\n    }\n\n    .hn-portfolio-categories{\n        gap: 10px 20px;\n        margin-top: 30px;\n    }\n\n    .hn-portfolio-categories span{\n        font-size: 12px;\n    }\n\n    .hn-portfolio-feature{\n        height: 410px;\n    }\n\n    .hn-portfolio-feature-image{\n        background-position: center;\n    }\n\n    .hn-portfolio-feature-caption{\n        display: block;\n        bottom: 28px;\n    }\n\n    .hn-portfolio-feature-caption h3{\n        font-size: 26px !important;\n    }\n\n    .hn-portfolio-feature-no{\n        margin-top: 21px;\n        font-size: 9px;\n    }\n\n    .hn-portfolio-board-head{\n        padding-top: 82px;\n        padding-bottom: 30px;\n    }\n\n    .hn-portfolio-board-heading{\n        gap: 20px;\n        padding-bottom: 26px;\n    }\n\n    .hn-portfolio-board-head h2{\n        font-size: 42px !important;\n    }\n\n    .hn-portfolio-board-desc{\n        font-size: 14px !important;\n        line-height: 1.7;\n    }\n\n    body:has(#hnPortfolioHero) .hn-portfolio-board-wrap{\n        padding-bottom: 90px !important;\n    }\n\n    .hn-portfolio-cta{\n        padding-top: 84px;\n        padding-bottom: 84px;\n    }\n\n    .hn-portfolio-cta-inner{\n        gap: 38px;\n    }\n\n    .hn-portfolio-cta h2{\n        font-size: clamp(37px, 11vw, 40px) !important;\n        line-height: 1.08 !important;\n    }\n\n    .hn-portfolio-cta-button{\n        width: 100%; max-width:fit-content;\n        height: 56px;\n    }\n\n}\n\n\n\/* \uc791\uc740 \ubaa8\ubc14\uc77c *\/\n@media (max-width: 420px){\n\n    .hn-portfolio-hero{\n        min-height: 520px;\n    }\n\n    .hn-portfolio-hero-title{\n        font-size: 47px !important;\n    }\n\n    .hn-portfolio-intro-content h2{\n        font-size: 30px !important;\n    }\n\n}\n\n\n\/* \ubaa8\uc158 \ucd5c\uc18c\ud654 \uc124\uc815 *\/\n@media (prefers-reduced-motion: reduce){\n\n    .hn-portfolio-hero::before{\n        animation: none !important;\n        transform: none !important;\n    }\n\n    [data-aos]{\n        opacity: 1 !important;\n        transform: none !important;\n        transition: none !important;\n    }\n\n}\n\n<\/style>\n\n\n<!-- SUB VISUAL -->\n<section class=\"hn-portfolio-hero\" id=\"hnPortfolioHero\">\n\n    <div class=\"hn-portfolio-hero-inner\">\n\n        <p\n            class=\"hn-portfolio-kicker\"\n            data-aos=\"fade-up\"\n            data-aos-duration=\"800\">\n            Portfolio\n        <\/p>\n\n        <h1\n            class=\"hn-portfolio-hero-title\"\n            data-aos=\"fade-up\"\n            data-aos-delay=\"100\"\n            data-aos-duration=\"900\">\n            Built for better\n            <span>living spaces.<\/span>\n        <\/h1>\n\n        <div class=\"hn-portfolio-hero-bottom\">\n\n            <p\n                class=\"hn-portfolio-hero-desc\"\n                data-aos=\"fade-up\"\n                data-aos-delay=\"200\"\n                data-aos-duration=\"900\">\n                \uacf5\uac04\uc758 \uc870\uac74\uacfc \uc0ac\uc6a9 \ud658\uacbd\uc744 \uc138\uc2ec\ud558\uac8c \uace0\ub824\ud558\uc5ec \uc644\uc131\ud55c\n                \uc0b4\ub77c\ub9cc\ub354 \uc2dc\uc2a4\ud15c\ucc3d\ud638\uc758 \ub2e4\uc591\ud55c \uc2dc\uacf5 \uc0ac\ub840\ub97c \uc18c\uac1c\ud569\ub2c8\ub2e4.\n            <\/p>\n\n            <div\n                class=\"hn-portfolio-breadcrumb\"\n                data-aos=\"fade-left\"\n                data-aos-delay=\"280\"\n                data-aos-duration=\"800\">\n\n                <a href=\"\/\">Home<\/a>\n                <i><\/i>\n                <strong>Portfolio<\/strong>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n<!-- INTRO -->\n<section class=\"hn-portfolio-intro\">\n\n    <div class=\"hn-portfolio-inner hn-portfolio-intro-grid\">\n\n        <div\n            class=\"hn-portfolio-intro-index\"\n            data-aos=\"fade-up\"\n            data-aos-duration=\"850\">\n\n            <strong>01<\/strong>\n\n            <span>\n                Project<br>\n                Archive\n            <\/span>\n\n        <\/div>\n\n        <div class=\"hn-portfolio-intro-content\">\n\n            <h2\n                data-aos=\"fade-up\"\n                data-aos-duration=\"900\">\n\n                \ucc3d\ud638\ub294 \ub2e8\uc21c\ud55c \ub9c8\uac10\uc7ac\uac00 \uc544\ub2cc,<br>\n                \uacf5\uac04\uc758 <em>\uc131\ub2a5\uacfc \uc0dd\ud65c\uc744 \uacb0\uc815\ud558\ub294 \uc694\uc18c<\/em>\uc785\ub2c8\ub2e4.\n\n            <\/h2>\n\n            <div class=\"hn-portfolio-intro-copy\">\n\n                <p\n                    data-aos=\"fade-up\"\n                    data-aos-delay=\"100\"\n                    data-aos-duration=\"850\">\n\n                    \ud604\uc7a5\uc758 \uad6c\uc870\uc640 \ubc29\ud5a5, \ub2e8\uc5f4 \ubc0f \uae30\ubc00 \uc870\uac74\uc744 \uc815\ud655\ud788 \ud655\uc778\ud558\uace0\n                    \uacf5\uac04\uc5d0 \uac00\uc7a5 \uc801\ud569\ud55c \uc2dc\uc2a4\ud15c\ucc3d\ud638 \uc81c\ud488\uacfc \uc2dc\uacf5 \ubc29\uc2dd\uc744 \uc81c\uc548\ud569\ub2c8\ub2e4.\n\n                <\/p>\n\n                <p\n                    data-aos=\"fade-up\"\n                    data-aos-delay=\"180\"\n                    data-aos-duration=\"850\">\n\n                    \uc0c1\ub2f4\ubd80\ud130 \uc2e4\uce21, \uc2dc\uacf5\uacfc \ub9c8\uac10\uae4c\uc9c0 \uc9c1\uc811 \uad00\ub9ac\ud558\uba70\n                    \uc624\ub7ab\ub3d9\uc548 \uc548\uc815\uc801\uc778 \uc131\ub2a5\uc744 \uc720\uc9c0\ud560 \uc218 \uc788\ub3c4\ub85d \uc644\uc131\ud569\ub2c8\ub2e4.\n\n                <\/p>\n\n            <\/div>\n\n            <div\n                class=\"hn-portfolio-categories\"\n                data-aos=\"fade-up\"\n                data-aos-delay=\"250\"\n                data-aos-duration=\"850\">\n\n                <span>\uc8fc\uac70 \uacf5\uac04<\/span>\n                <span>\ub2e8\ub3c5\uc8fc\ud0dd<\/span>\n                <span>\uc0c1\uc5c5 \uacf5\uac04<\/span>\n                <span>\ub9ac\ubaa8\ub378\ub9c1<\/span>\n                <span>\uc2dc\uc2a4\ud15c\ucc3d\ud638<\/span>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n<!-- FEATURE IMAGE -->\n<section\n    class=\"hn-portfolio-feature\"\n    data-aos=\"fade-up\"\n    data-aos-duration=\"1100\">\n\n    <div class=\"hn-portfolio-feature-image\"><\/div>\n\n    <div class=\"hn-portfolio-feature-caption\">\n\n        <div>\n            <small>Salamander Window System<\/small>\n\n            <h3>\n                \uc2dc\uacf5\uc758 \uc644\uc131\ub3c4\ub294<br>\n                \ubcf4\uc774\uc9c0 \uc54a\ub294 \ub514\ud14c\uc77c\uc5d0\uc11c \uacb0\uc815\ub429\ub2c8\ub2e4.\n            <\/h3>\n        <\/div>\n\n        <span class=\"hn-portfolio-feature-no\">\n            PROJECT ARCHIVE \/ 2026\n        <\/span>\n\n    <\/div>\n\n<\/section>\n\n\n<!-- BOARD TITLE -->\n<section class=\"hn-portfolio-board-head\">\n\n    <div class=\"hn-portfolio-inner hn-portfolio-board-heading\">\n\n        <div>\n\n            <p\n                class=\"hn-portfolio-kicker\"\n                data-aos=\"fade-up\"\n                data-aos-duration=\"800\">\n                Our Projects\n            <\/p>\n\n            <h2\n                data-aos=\"fade-up\"\n                data-aos-delay=\"80\"\n                data-aos-duration=\"900\">\n\n                Project <span>Archive<\/span>\n\n            <\/h2>\n\n        <\/div>\n\n        <p\n            class=\"hn-portfolio-board-desc\"\n            data-aos=\"fade-up\"\n            data-aos-delay=\"160\"\n            data-aos-duration=\"850\">\n\n            \ub2e4\uc591\ud55c \ud604\uc7a5\uc5d0\uc11c \uc644\uc131\ub41c \uc2dc\uc2a4\ud15c\ucc3d\ud638 \uc2dc\uacf5 \uc0ac\ub840\ub97c \ud655\uc778\ud574 \ubcf4\uc138\uc694.\n            \uac8c\uc2dc\ubb3c\uc744 \uc120\ud0dd\ud558\uba74 \ud504\ub85c\uc81d\ud2b8 \uc0c1\uc138 \ub0b4\uc6a9\uc744 \ud655\uc778\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.\n\n        <\/p>\n\n    <\/div>\n\n<\/section>\n\n\n\n\n<!-- \ub9dd\ubcf4\ub4dc \uc20f\ucf54\ub4dc \uc601\uc5ed -->\n\n<div class=\"wp-block-group hn-portfolio-board-wrap\"><div class=\"wp-block-group__inner-container is-layout-constrained wp-block-group-is-layout-constrained\">\n\n<div class=\"clear\"><\/div><div id=\"mb_top\" class=\"mb-desktop\"><div id=\"portfolio_board\" class=\"mb-board\"><div class=\"mb-level-0 mb-name-portfolio mb-mode-list mb-skin-hometory-masonry-m11\"><script type=\"text\/javascript\">\r\n\r\nfunction resizeResponsive(){var nWidth\t= window.innerWidth;if(nWidth>=1200){jQuery(\".mb-desktop\").removeClass(\"mb-desktop\").addClass(\"mb-desktop-large\");jQuery(\".mb-tablet\").removeClass(\"mb-tablet\").addClass(\"mb-desktop-large\");jQuery(\".mb-mobile\").removeClass(\"mb-mobile\").addClass(\"mb-desktop-large\");}else if(nWidth>=992){jQuery(\".mb-desktop-large\").removeClass(\"mb-desktop-large\").addClass(\"mb-desktop\");jQuery(\".mb-tablet\").removeClass(\"mb-tablet\").addClass(\"mb-desktop\");jQuery(\".mb-mobile\").removeClass(\"mb-mobile\").addClass(\"mb-desktop\");}else if(nWidth>=768){jQuery(\".mb-desktop-large\").removeClass(\"mb-desktop-large\").addClass(\"mb-tablet\");jQuery(\".mb-desktop\").removeClass(\"mb-desktop\").addClass(\"mb-tablet\");jQuery(\".mb-mobile\").removeClass(\"mb-mobile\").addClass(\"mb-tablet\");}else if(nWidth<768){jQuery(\".mb-desktop-large\").removeClass(\"mb-desktop-large\").addClass(\"mb-mobile\");jQuery(\".mb-desktop\").removeClass(\"mb-desktop\").addClass(\"mb-mobile\");jQuery(\".mb-tablet\").removeClass(\"mb-tablet\").addClass(\"mb-mobile\");}}if(typeof jQuery != \"undefined\"){ jQuery(window).on(\"resize\",resizeResponsive);resizeResponsive();};var category_text\t\t\t\t= '';mb_categorys[\"value1\"]\t= \"\";mb_categorys[\"value2\"]\t= \"\";mb_categorys[\"value3\"]\t= \"\";mb_urls[\"base\"]\t\t\t\t\t\t= \"https:\/\/salamander.co.kr\/wp-content\/plugins\/mangboard\/\";mb_urls[\"image\"]\t\t\t\t\t\t= \"https:\/\/salamander.co.kr\/wp-content\/plugins\/mangboard\/includes\/mb-file.php\";mb_urls[\"file\"]\t\t\t\t\t\t\t= \"https:\/\/salamander.co.kr\/wp-content\/plugins\/mangboard\/includes\/mb-file.php\";mb_urls[\"search\"]\t\t\t\t\t\t= \"https:\/\/salamander.co.kr\/?page_id=112&mode=list\";mb_options[\"device_type\"]\t\t= \"desktop\";mb_options[\"mode\"]\t\t\t\t= \"list\";mb_options[\"board_action\"]\t\t\t\t= \"\";mb_options[\"board_name\"]\t\t= \"portfolio\";mb_options[\"board_type\"]\t\t\t= \"board\";mb_options[\"table_prefix\"]\t\t\t= \"mb_portfolio_\";mb_options[\"pid\"]\t\t\t\t\t= \"\";mb_options[\"nonce\"]\t\t\t\t= \"mb_nonce_value=c6c3874efe6e8989819853cf7b0fce36&mb_nonce_time=1784679186&wp_nonce_value=5e1e04f36a&lang=ko_KR\";mb_options[\"list_type\"]\t\t\t\t= \"gallery\";mb_options[\"search_field\"]\t\t= \"fn_title\";mb_options[\"search_text\"]\t\t\t= \"\";mb_languages[\"selectbox1\"]\t\t= \"\uc804\uccb4\";mb_languages[\"selectbox2\"]\t\t= \"\uc804\uccb4\";mb_languages[\"selectbox3\"]\t\t= \"\uc804\uccb4\";\r\nvar category_data\t\t\t\t= \"\";\r\ntry {\r\n\tif(isJsonType(category_text)){\r\n\t\tcategory_data\t\t\t= JSON.parse(category_text);\r\n\t}\r\n}catch(e) {}\r\n\r\n\r\n<\/script><style type=\"text\/css\">\r\n.mb-category button{margin-right:3px !important;}\r\n.gallery-list-body{min-height:58px;}\r\n.gallery-list-body > div {overflow: hidden;  opacity:0;}\r\n\r\n.gallery-item-box{\r\n\t\/*transition: all 0.5s; transform: translate(0,200px); opacity:0;*\/\r\n\ttransition: all 0.5s; opacity:0;\r\n}\r\n.mb-ani-tran1{\r\n\t\/*transform: translate(0,0) !important;*\/\r\n\topacity:1 !important;\r\n}\r\n\r\n<\/style>\r\n\r\n<script type=\"text\/javascript\">\r\nfunction selectTabMenu(obj,category,name,idx){\r\n\tif(typeof(idx)===\"undefined\" || idx==\"\") idx\t= \"1\";\r\n\tjQuery('.tab-menu-on').removeClass(\"tab-menu-on\").addClass(\"tab-menu-off\");\r\n\tjQuery(obj).removeClass(\"tab-menu-off\").addClass(\"tab-menu-on\");\r\n\tif(jQuery(\"input[name=category\"+idx+\"]\")) jQuery(\"input[name=category\"+idx+\"]\").val(category);\r\n\tsendMasonryListTemplateData({\"board_name\":name,\"category\":category,\"idx\":idx});\r\n}\r\n\r\n\r\nfunction sendSearchData(data){\r\n\tvar search_url\t\t\t\t\t= mb_urls[\"search\"];\r\n\tvar params\t\t\t\t\t\t= jQuery('#'+mb_options[\"board_name\"]+'_form_board_search').serialize();\r\n\r\n\tif(typeof(data)!=='undefined') params\t\t\t\t\t= params+\"&\"+data;\t\t\r\n\tif(params.indexOf('category')!=-1){\r\n\t\tif(search_url.indexOf('category')!=-1){\r\n\t\t\tsearch_url\t\t= search_url.replace(\/(category)(\\d{1})=\/g,\"category_old$2=\");\r\n\t\t}\r\n\t}\r\n\tsearch_url\t\t\t\t\t\t= search_url+\"&\"+params;\r\n\tmoveURL(search_url);\r\n}\r\n\r\n\r\nfunction showDeleteConfirm(){\t\r\n\tvar check_count\t= jQuery(\".mb-board input[name='check_array[]']\").filter(\":checked\").length;\r\n\tif(check_count > 0) {\r\n\t\tshowConfirmPopup(check_count+\"\uac1c\uc758 \ud56d\ubaa9\uc744 \uc0ad\uc81c\ud558\uc2dc\uaca0\uc2b5\ub2c8\uae4c?\", {\"board_action\":\"multi_delete\"}, sendBoardListData);\r\n\t}else{\r\n\t\tshowAlertPopup({\"code\":\"1000\",\"message\":\"\uc0ad\uc81c\ud560 \ud56d\ubaa9\uc744 \uc120\ud0dd\ud574 \uc8fc\uc138\uc694\"});\r\n\t}\r\n}\r\n\r\n\r\nfunction showMoveConfirm(type){\t\r\n\tvar check_count\t= jQuery(\".mb-board input[name='check_array[]']\").filter(\":checked\").length;\r\n\tif(check_count > 0) {\r\n\t\tif(type==\"multi_copy\"){\r\n\t\t\tshowConfirmPopup(check_count+\"\uac1c\uc758 \ud56d\ubaa9\uc744 \ubcf5\uc0ac\ud558\uc2dc\uaca0\uc2b5\ub2c8\uae4c?\", {\"board_action\":type}, sendBoardListData);\r\n\t\t}else if(type==\"multi_move\"){\r\n\t\t\tshowConfirmPopup(check_count+\"\uac1c\uc758 \ud56d\ubaa9\uc744 \uc774\ub3d9\ud558\uc2dc\uaca0\uc2b5\ub2c8\uae4c?\", {\"board_action\":type}, sendBoardListData);\r\n\t\t}\t\t\r\n\t}else{\r\n\t\tif(type==\"multi_copy\"){\r\n\t\t\tshowAlertPopup({\"code\":\"1000\",\"message\":\"\ubcf5\uc0ac\ud560 \ud56d\ubaa9\uc744 \uc120\ud0dd\ud574 \uc8fc\uc138\uc694\"});\r\n\t\t}else if(type==\"multi_move\"){\r\n\t\t\tshowAlertPopup({\"code\":\"1000\",\"message\":\"\uc774\ub3d9\ud560 \ud56d\ubaa9\uc744 \uc120\ud0dd\ud574 \uc8fc\uc138\uc694\"});\r\n\t\t}\r\n\t}\r\n}\r\n\r\nfunction sendBoardListData(args){\t\r\n\tif(args.board_action==\"multi_modify\"){\r\n\t\tjQuery('#'+mb_options[\"board_name\"]+'_form_board_list input[name=board_pid]').val(args.board_pid);\r\n\t}\r\n\r\n\tjQuery('#'+mb_options[\"board_name\"]+'_form_board_list input[name=board_action]').val(args.board_action);\r\n\tsendFormDataRequest(jQuery('#'+mb_options[\"board_name\"]+'_form_board_list'), mb_urls[\"board_api\"], sendBoardListDataHandler);\r\n}\r\n\r\nfunction sendBoardListDataHandler(response, state)\r\n{\r\n\tif(response.state == \"success\"){\r\n\t\tif(typeof(response.message)!=='undefined'){\r\n\t\t\t if(response.message!=\"\") alert(response.message);\r\n\t\t}\r\n\t\twindow.location.reload();\r\n\t}else{\t\t\t\r\n\t\tshowAlertPopup(response);\r\n\t}\r\n}\r\n<\/script>\r\n\r\n<div class=\"mb-style1 gallery-list\">\r\n\t<form name=\"portfolio_form_board_search\" id=\"portfolio_form_board_search\" method=\"post\">\r\n\t<input type=\"hidden\" name=\"board_name\" value=\"portfolio\" \/>\r\n\t\t<input type=\"hidden\" name=\"list_style\" value=\"none\" \/>\r\n\t\t\r\n\t<div class=\"list-head\">\r\n\r\n\t\t<div class=\"mb-category\"><input type=\"hidden\" name=\"category1\" value=\"\" \/><input type=\"hidden\" name=\"category2\" value=\"\" \/><input type=\"hidden\" name=\"category3\" value=\"\" \/><\/div>\r\n\t\t\t\t<div class=\"list-search\">\r\n\t\t\t<select id=\"search_field\" name=\"search_field\" class=\"search-field margin-right-5\" title=\"Search Field\"><option value=\"fn_title\"  selected>\uc81c\ubaa9<\/option><option value=\"fn_content\" >\ub0b4\uc6a9<\/option><option value=\"fn_user_name\" >\uc791\uc131\uc790<\/option><option value=\"fn_tag\" >\ud0dc\uadf8<\/option><\/select><input type=\"text\" id=\"search_text\" class=\"search-text\" name=\"search_text\" accesskey=\"s\" title=\"Search Text\" value=\"\" onkeypress=\"checkEnterKey(sendSearchData);\"\/><input style=\"display:none !important;\" type=\"text\"\/><button onclick=\"sendSearchData();return false;\" title=\"\uac80\uc0c9\" class=\"btn btn-default btn-search margin-left-5\" type=\"button\"><span>\uac80\uc0c9<\/span><\/button>\t\t<\/div>\r\n\t\t\t\t<div class=\"clear\"><\/div>\r\n\t<\/div>\r\n\t<div class=\"clear\"><\/div>\r\n\t<\/form> \t\r\n\t\t<form name=\"portfolio_form_board_list\" id=\"portfolio_form_board_list\" method=\"post\">\t\r\n\t<input type=\"hidden\" name=\"board_name\" id=\"board_name\" value=\"portfolio\" \/>\r\n\t<input type=\"hidden\" name=\"page_id\" id=\"page_id\" value=\"\" \/>\r\n\t<input type=\"hidden\" name=\"list_type\" id=\"list_type\" value=\"gallery\" \/>\r\n\t<input type=\"hidden\" name=\"page\" id=\"page\" value=\"1\" \/>\r\n\t<input type=\"hidden\" name=\"mode\" id=\"mode\" value=\"list\" \/>\r\n\t<input type=\"hidden\" name=\"board_action\" id=\"board_action\" value=\"\" \/>\r\n\t<input type=\"hidden\" name=\"board_pid\" id=\"board_pid\" value=\"\" \/>\r\n\t<input type=\"hidden\" name=\"responsive_class\" id=\"responsive_class\" value=\"col-321\" \/>\r\n\r\n\t<input type=\"hidden\" name=\"mb_nonce_value\" value=\"c6c3874efe6e8989819853cf7b0fce36\" \/><input type=\"hidden\" name=\"mb_nonce_time\" value=\"1784679186\" \/><input type=\"hidden\" id=\"wp_nonce_value\" name=\"wp_nonce_value\" value=\"5e1e04f36a\" \/><input type=\"hidden\" name=\"_wp_http_referer\" value=\"\/index.php?rest_route=%2Fwp%2Fv2%2Fpages%2F112\" \/><input type=\"hidden\" name=\"lang\" value=\"ko_KR\" \/>\r\n\t<div class=\"main-style1\" id=\"portfolio_board_box\">\t\t\r\n\t\t<div class=\"gallery-list-head\"><\/div><div class=\"gallery-list-body\" id=\"portfolio_board_body\"><div class=\"gallery-item-box  col-321\" style=\"\"><div class=\"gallery-item-wrap\"><div class=\"gallery-item-img\"><a href=\"https:\/\/salamander.co.kr\/?page_id=112&#038;vid=3\" title=\"[SAMPLE] \uc81c\uc8fc\ub3c4 \ub2e8\ub3c5\uc8fc\ud0dd\"><div class=\"img\" style=\"max-width:100%;width:100%;height:270px;margin:0 auto;background-image:url(https:\/\/salamander.co.kr\/wp-content\/uploads\/mangboard\/2026\/07\/15\/F5_sd_web_03.jpg);background-position:center center;background-size:cover;background-repeat:no-repeat;\" ><\/div><\/a><\/div><div class=\"gallery-title\"><a href=\"https:\/\/salamander.co.kr\/?page_id=112&#038;vid=3\" title=\"[SAMPLE] \uc81c\uc8fc\ub3c4 \ub2e8\ub3c5\uc8fc\ud0dd\"><div>[SAMPLE] \uc81c\uc8fc\ub3c4 \ub2e8\ub3c5\uc8fc\ud0dd<\/div><\/a><\/div><div class=\"gallery-date\"><span>2026-07-15<\/span><\/div><\/div><\/div><div class=\"gallery-item-box  col-321\" style=\"\"><div class=\"gallery-item-wrap\"><div class=\"gallery-item-img\"><a href=\"https:\/\/salamander.co.kr\/?page_id=112&#038;vid=2\" title=\"[SAMPLE] \uc591\ud3c9 \uc804\uc6d0\uc8fc\ud0dd\"><div class=\"img\" style=\"max-width:100%;width:100%;height:270px;margin:0 auto;background-image:url(https:\/\/salamander.co.kr\/wp-content\/uploads\/mangboard\/2026\/07\/15\/F3_v4c-2048x1188.jpg);background-position:center center;background-size:cover;background-repeat:no-repeat;\" ><\/div><\/a><\/div><div class=\"gallery-title\"><a href=\"https:\/\/salamander.co.kr\/?page_id=112&#038;vid=2\" title=\"[SAMPLE] \uc591\ud3c9 \uc804\uc6d0\uc8fc\ud0dd\"><div>[SAMPLE] \uc591\ud3c9 \uc804\uc6d0\uc8fc\ud0dd<\/div><\/a><\/div><div class=\"gallery-date\"><span>2026-07-15<\/span><\/div><\/div><\/div><div class=\"gallery-item-box  col-321\" style=\"\"><div class=\"gallery-item-wrap\"><div class=\"gallery-item-img\"><a href=\"https:\/\/salamander.co.kr\/?page_id=112&#038;vid=1\" title=\"[SAMPLE] \ud55c\ub0a8\ub3d9 \ud504\ub77c\uc774\ube57 \ud558\uc6b0\uc2a4\"><div class=\"img\" style=\"max-width:100%;width:100%;height:270px;margin:0 auto;background-image:url(https:\/\/salamander.co.kr\/wp-content\/uploads\/mangboard\/2026\/07\/15\/F1_1-1.jpg);background-position:center center;background-size:cover;background-repeat:no-repeat;\" ><\/div><\/a><\/div><div class=\"gallery-title\"><a href=\"https:\/\/salamander.co.kr\/?page_id=112&#038;vid=1\" title=\"[SAMPLE] \ud55c\ub0a8\ub3d9 \ud504\ub77c\uc774\ube57 \ud558\uc6b0\uc2a4\"><div>[SAMPLE] \ud55c\ub0a8\ub3d9 \ud504\ub77c\uc774\ube57 \ud558\uc6b0\uc2a4<\/div><\/a><\/div><div class=\"gallery-date\"><span>2026-07-15<\/span><\/div><\/div><\/div><div class=\"clear\"><\/div><\/div><div class=\"gallery-list-foot\"><\/div>\t\t\t\r\n\t<\/div>\r\n\t\r\n\t\t\t<div class=\"list-btn\">\r\n\t\t<div class=\"btn-box-right\" id=\"portfolio_btn_box\">\r\n\t\t\t<span class=\"btn-box-left\" style=\"float:left;\"><\/span>\t\t<\/div>\r\n\t<\/div>\r\n\t\t<\/form>\r\n\t\t<div id=\"portfolio_pagination_box\" class=\"pagination-box\"><div class=\"pagination-large\"><table cellspacing=\"0\" cellpadding=\"0\" border=\"0\" class=\"table table-page\" align=\"center\"><tbody><tr><td class=\"page_arrow mb-disabled mb-mobile-hide\"><a title=\"\ucc98\uc74c\" class=\"btn-start\" role=\"button\"><span><img decoding=\"async\" src=\"https:\/\/salamander.co.kr\/wp-content\/plugins\/mangboard\/skins\/hometory_masonry_m11\/images\/btn_paging_pprev.gif\" alt=\"\ucc98\uc74c\" style=\"width:15px;\" \/><\/span><\/a><\/td><td class=\"page_arrow mb-disabled\"><a title=\"\uc774\uc804\" class=\"btn-prev\" role=\"button\"><span><img decoding=\"async\" src=\"https:\/\/salamander.co.kr\/wp-content\/plugins\/mangboard\/skins\/hometory_masonry_m11\/images\/btn_paging_prev.gif\" alt=\"\uc774\uc804\" style=\"width:15px;\" \/><\/span><\/a><\/td><td class=\"btn-page active\"><a class=\"btn-page-num first\" title=\"Page 1 - Selected\">1<\/a><\/td><td class=\"page_arrow mb-disabled\"><a title=\"\ub2e4\uc74c\" class=\"btn-next\" role=\"button\"><span><img decoding=\"async\" src=\"https:\/\/salamander.co.kr\/wp-content\/plugins\/mangboard\/skins\/hometory_masonry_m11\/images\/btn_paging_next.gif\" alt=\"\ub2e4\uc74c\" style=\"width:15px;\" \/><\/span><\/a><\/td><td class=\"page_arrow mb-disabled mb-mobile-hide\"><a title=\"\ub9e8\ub05d\" class=\"btn-end\" role=\"button\"><span><img decoding=\"async\" src=\"https:\/\/salamander.co.kr\/wp-content\/plugins\/mangboard\/skins\/hometory_masonry_m11\/images\/btn_paging_nnext.gif\" alt=\"\ub9e8\ub05d\" style=\"width:15px;\" \/><\/span><\/a><\/td><\/tr><\/tbody><\/table><\/div><\/div><\/div>\r\n\r\n\r\n<script type=\"text\/javascript\">\r\n\tvar total_count\t\t= 3;\t\r\n\r\n\tvar page_size\t\t\t= 24;\r\n\tvar page\t\t\t\t\t= 1;\r\n\tvar total_page\t\t\t= 1;\r\n\tvar load_template\t\t= true;\r\n\r\n\t\tfunction sendListTemplateData(data){\r\n\t\tsendMasonryListTemplateData(data);\r\n\t}\r\n\tfunction sendMasonryListTemplateData(data){\r\n\t\tlistTemplateCheck\t= true;\r\n\t\tif(typeof(data)==='undefined') data = {};\r\n\t\tif(typeof(data.board_name)==='undefined' || data.board_name==='undefined' || data.board_name===\"\") board_name = mb_options[\"board_name\"];\r\n\t\telse board_name = data.board_name;\t\r\n\t\tif(typeof(data.mode)==='undefined' || data.mode==='undefined') mode = \"\";\r\n\t\telse mode = data.mode;\r\n\t\tif(typeof(data.page)==='undefined' || data.page==='undefined' || data.page===\"\") page = 1;\r\n\t\telse page = data.page;\t\r\n\t\t\r\n\t\tlistTemplateBoard\t\t\t\t\t= board_name;\r\n\t\tlistTemplateMode\t\t\t\t\t= mode;\r\n\t\tlistTemplateAction\t\t\t\t= document.forms[listTemplateBoard+'_form_board_list'].board_action.value;\r\n\t\tdocument.forms[listTemplateBoard+'_form_board_list'].board_action.value = \"load\";\r\n\t\tvar params\t\t= jQuery('#'+listTemplateBoard+'_form_board_search').serialize();\r\n\t\tparams\t\t= params+\"&\"+jQuery('#'+listTemplateBoard+'_form_board_list').serialize();\r\n\r\n\t\tif(typeof(data.category)!=='undefined'){\r\n\t\t\tif(typeof(data.idx)==='undefined' || data.idx==='undefined' || data.idx===\"\") idx = \"1\";\r\n\t\t\telse idx = data.idx;\r\n\t\t\tmb_categorys[\"value\"+idx]\t\t\t= data.category;\r\n\t\t\tparams\t\t\t\t\t= params+\"&category\"+idx+\"=\"+encodeURIComponent(data.category);\r\n\t\t}else{\r\n\t\t\tif(mb_categorys[\"value1\"]!=\"\"){\r\n\t\t\t\tparams\t\t\t\t\t= params+\"&category1=\"+encodeURIComponent(mb_categorys[\"value1\"]);\r\n\t\t\t\tif(mb_categorys[\"value2\"]!=\"\"){\r\n\t\t\t\t\tparams\t\t\t\t\t= params+\"&category2=\"+encodeURIComponent(mb_categorys[\"value2\"]);\r\n\t\t\t\t\tif(mb_categorys[\"value3\"]!=\"\"){\r\n\t\t\t\t\t\tparams\t\t\t\t\t= params+\"&category3=\"+encodeURIComponent(mb_categorys[\"value3\"]);\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\tif(typeof(data.page_type)!=='undefined'){\r\n\t\t\tparams\t\t\t\t\t= params+\"&page_type=\"+encodeURIComponent(data.page_type);\r\n\t\t}\t\t\r\n\t\tparams\t\t\t\t\t= params+\"&board_page=\"+page;\t\r\n\t\tsendDataRequest(mb_urls[\"template_api\"], params, sendMasonryListTemplateDataHandler);\t\t\r\n\t}\r\n\tfunction sendMasonryListTemplateDataHandler(response, state){\t\t\r\n\t\tdocument.forms[listTemplateBoard+'_form_board_list'].board_action.value\t\t= listTemplateAction;\r\n\t\tif(listTemplateCheck){\r\n\t\t\tif(response.state == \"success\"){\r\n\t\t\t\tif(listTemplateMode!=\"append\"){\r\n\t\t\t\t\tjQuery(\"#\"+listTemplateBoard+\"_board_body>tr\").remove();\r\n\t\t\t\t\tjQuery(\"#\"+listTemplateBoard+\"_board_body>div\").remove();\r\n\r\n\t\t\t\t\ttotal_count\t\t\t= parseInt(response.data[\"options\"].total_count);\r\n\t\t\t\t\tpage_size\t\t\t= parseInt(response.data[\"options\"].page_size);\r\n\t\t\t\t\tpage\t\t\t\t\t= parseInt(response.data[\"options\"].page);\r\n\t\t\t\t\ttotal_page\t\t\t= parseInt(response.data[\"options\"].total_page);\r\n\t\t\t\t}\r\n\t\t\t\tif(response.data[\"body\"]){\r\n\t\t\t\t\tjQuery(\"#\"+listTemplateBoard+\"_board_body\").append(response.data[\"body\"]);\r\n\t\t\t\t}\r\n\t\t\t\tif(response.data[\"pagination\"]!=\"\"){\r\n\t\t\t\t\tjQuery('#'+listTemplateBoard+'_pagination_box').html(response.data[\"pagination\"]);\r\n\t\t\t\t}else{\r\n\t\t\t\t\tjQuery('#'+listTemplateBoard+'_pagination_box').html(\"\");\r\n\t\t\t\t}\r\n\t\t\t\tif(listTemplateMode!=\"append\" && typeof(scrollToBoardTop)==='function'){\r\n\t\t\t\t\tscrollToBoardTop();\r\n\t\t\t\t}\r\n\t\t\t\tsetTimeout(function() {\r\n\t\t\t\t\tsetGalleryEffect(0);\r\n\t\t\t\t}, 600);\r\n\r\n\t\t\t\t\t\t\t}else{\r\n\t\t\t\tshowAlertPopup(response);\r\n\t\t\t}\r\n\t\t\tlistTemplateCheck\t\t= false;\r\n\t\t\tload_template\t\t\t\t= true;\r\n\t\t}\r\n\t}\r\n\tvar galleryAniStyle\t\t= 1;\r\n\tvar msnry;\r\n\tfunction setGalleryEffect(num){\r\n\t\t\t\r\n\t\tjQuery('.gallery-list-body > div ').each( function() {\r\n\t\t\tvar obj\t= jQuery(this);\r\n\t\t\tif(!obj.hasClass(\"mb-ani-tran\"+galleryAniStyle))\r\n\t\t\t{\r\n\t\t\t\tnum\t= num+0.1;\r\n\t\t\t\tobj.css(\"transition-delay\",num+\"s\");\r\n\t\t\t\tobj.addClass(\"mb-ani-tran\"+galleryAniStyle);\r\n\t\t\t}\r\n\t\t} );\t\r\n\t}\r\n\tjQuery(document).ready(function() {\r\n\t\tif(total_count>0){\r\n\t\t\tsetTimeout(function() {\r\n\t\t\t\tsetGalleryEffect(0);\r\n\t\t\t}, 0);\r\n\t\t\t\t\t}\r\n\t});\r\n<\/script><\/div><\/div><\/div><div style=\"display:none !important;\" class=\"mb-poweredby\"><a href=\"https:\/\/www.mangboard.com\" rel=\"nofollow\" target=\"_blank\" style=\"font-size:13px;\" title=\"Powered by MangBoard\">Powered by MangBoard | \ub9dd\ubcf4\ub4dc \uc2a4\ud1a0\uc5b4<\/a><\/div>\n\n\n<\/div><\/div>\n\n\n\n\n\n<!-- CTA -->\n<section class=\"hn-portfolio-cta\">\n\n    <div class=\"hn-portfolio-inner hn-portfolio-cta-inner\">\n\n        <div>\n\n            <p\n                class=\"hn-portfolio-kicker\"\n                data-aos=\"fade-up\"\n                data-aos-duration=\"800\">\n                Contact Us\n            <\/p>\n\n            <h2\n                data-aos=\"fade-up\"\n                data-aos-delay=\"100\"\n                data-aos-duration=\"900\">\n\n                \uacf5\uac04\uc5d0 \uac00\uc7a5 \uc801\ud569\ud55c \ucc3d\ud638,\n                <span>\uc0c1\ub2f4\ubd80\ud130 \ud568\uaed8 \uc2dc\uc791\ud569\ub2c8\ub2e4.<\/span>\n\n            <\/h2>\n\n        <\/div>\n\n<a href=\"\/?page_id=151\" class=\"hn-portfolio-cta-button\" data-aos=\"fade-left\" data-aos-delay=\"200\" data-aos-duration=\"850\">\n<span>\uacac\uc801 \ubb38\uc758\ud558\uae30<\/span>\n<svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M5 12h14M14 7l5 5-5 5\"\/><\/svg>\n<\/a>\n\n    <\/div>\n\n<\/section>\n\n\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/aos@2.3.4\/dist\/aos.js\"><\/script>\n\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", function () {\n\n    var boardWrap = document.querySelector(\".hn-portfolio-board-wrap\");\n\n    function removeFormAOS() {\n\n        if (!boardWrap) return;\n\n        var formRows = boardWrap.querySelectorAll(\"tr\");\n\n        formRows.forEach(function (row) {\n\n            var hasFormElement = row.querySelector(\n                'input,' +\n                'textarea,' +\n                'select,' +\n                'button,' +\n                'iframe,' +\n                '[contenteditable=\"true\"],' +\n                '.mb-editor,' +\n                '.mb-file,' +\n                '.smarteditor2,' +\n                '.se2_input_area'\n            );\n\n            if (!hasFormElement) return;\n\n            row.removeAttribute(\"data-aos\");\n            row.removeAttribute(\"data-aos-delay\");\n            row.removeAttribute(\"data-aos-duration\");\n            row.removeAttribute(\"data-aos-easing\");\n\n            row.classList.remove(\"aos-init\", \"aos-animate\");\n\n            row.style.removeProperty(\"opacity\");\n            row.style.removeProperty(\"transform\");\n            row.style.removeProperty(\"transition\");\n        });\n\n    }\n\n    function applyBoardAOS() {\n\n        if (!boardWrap) return;\n        var boardItems = boardWrap.querySelectorAll(\n            \".mb-list-item,\" +\n            \".mb-gallery-item,\" +\n            \".gallery-item,\" +\n            \".post-item,\" +\n            \".mb-board-list tbody tr,\" +\n            \".mb-board tbody tr\"\n        );\n\n        var visibleIndex = 0;\n\n        boardItems.forEach(function (item) {\n\n            \/*\n             * \uc785\ub825 \ud544\ub4dc\uac00 \ud3ec\ud568\ub41c \ud589\uc740 \uae00\uc4f0\uae30\u00b7\uc218\uc815 \ud654\uba74\uc774\ubbc0\ub85c \uc81c\uc678\n             *\/\n            if (\n                item.querySelector(\n                    'input,' +\n                    'textarea,' +\n                    'select,' +\n                    'button,' +\n                    'iframe,' +\n                    '[contenteditable=\"true\"],' +\n                    '.mb-editor,' +\n                    '.mb-file,' +\n                    '.smarteditor2,' +\n                    '.se2_input_area'\n                )\n            ) {\n                return;\n            }\n\n            \/*\n             * \ud14c\uc774\ube14 \ud589\uc778 \uacbd\uc6b0 \uac8c\uc2dc\ubb3c \ub9c1\ud06c\uac00 \uc5c6\ub294 \ud589\uc740 \uc81c\uc678\n             * \ud5e4\ub354, \ube48 \ud589, \uc548\ub0b4 \ud589 \ub4f1\uc774 AOS\uc5d0 \uc7a1\ud788\ub294 \uac83\uc744 \ubc29\uc9c0\n             *\/\n            if (\n                item.tagName === \"TR\" &&\n                !item.querySelector(\"a[href]\")\n            ) {\n                return;\n            }\n\n            if (item.hasAttribute(\"data-aos\")) return;\n\n            item.setAttribute(\"data-aos\", \"fade-up\");\n            item.setAttribute(\"data-aos-duration\", \"750\");\n            item.setAttribute(\n                \"data-aos-delay\",\n                String(Math.min(visibleIndex * 60, 300))\n            );\n\n            visibleIndex++;\n        });\n\n    }\n\n    removeFormAOS();\n    applyBoardAOS();\n\n    if (typeof AOS !== \"undefined\") {\n\n        AOS.init({\n            once: true,\n            offset: 70,\n            duration: 850,\n            easing: \"ease-out-cubic\",\n            anchorPlacement: \"top-bottom\",\n            disable: function () {\n                return window.matchMedia(\n                    \"(prefers-reduced-motion: reduce)\"\n                ).matches;\n            }\n        });\n\n        window.addEventListener(\"load\", function () {\n\n            removeFormAOS();\n\n            if (typeof AOS !== \"undefined\") {\n                AOS.refreshHard();\n            }\n\n        });\n\n    }\n\n    \/*\n     * \uac8c\uc2dc\ud310 \ud398\uc774\uc9c0 \uc774\ub3d9, \uac80\uc0c9, \uae00\uc4f0\uae30 \ud654\uba74 \uc804\ud658 \ub4f1\uc73c\ub85c\n     * \ub0b4\ubd80 HTML\uc774 \ubcc0\uacbd\ub420 \ub54c \ub2e4\uc2dc \uac80\uc0ac\n     *\/\n    if (boardWrap && \"MutationObserver\" in window) {\n\n        var refreshTimer = null;\n\n        var boardObserver = new MutationObserver(function () {\n\n            clearTimeout(refreshTimer);\n\n            refreshTimer = setTimeout(function () {\n\n                removeFormAOS();\n                applyBoardAOS();\n\n                if (typeof AOS !== \"undefined\") {\n                    AOS.refreshHard();\n                }\n\n            }, 80);\n\n        });\n\n        boardObserver.observe(boardWrap, {\n            childList: true,\n            subtree: true\n        });\n\n    }\n\n});\n<\/script>\n\n<!-- PORTFOLIO PAGE END -->\n\n","protected":false},"excerpt":{"rendered":"<p>Portfolio Built for better living spaces. \uacf5\uac04\uc758 \uc870\uac74\uacfc \uc0ac\uc6a9 \ud658\uacbd\uc744 \uc138\uc2ec\ud558\uac8c \uace0\ub824\ud558\uc5ec \uc644\uc131\ud55c \uc0b4\ub77c\ub9cc\ub354 \uc2dc\uc2a4\ud15c\ucc3d\ud638\uc758 \ub2e4\uc591\ud55c \uc2dc\uacf5 \uc0ac\ub840\ub97c \uc18c\uac1c\ud569\ub2c8\ub2e4. Home Portfolio 01 Project Archive \ucc3d\ud638\ub294 \ub2e8\uc21c\ud55c \ub9c8\uac10\uc7ac\uac00 \uc544\ub2cc, \uacf5\uac04\uc758 \uc131\ub2a5\uacfc \uc0dd\ud65c\uc744 \uacb0\uc815\ud558\ub294 \uc694\uc18c\uc785\ub2c8\ub2e4. \ud604\uc7a5\uc758 \uad6c\uc870\uc640 \ubc29\ud5a5, \ub2e8\uc5f4 \ubc0f \uae30\ubc00 \uc870\uac74\uc744 &hellip; <a href=\"https:\/\/salamander.co.kr\/?page_id=112\">Continued<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-fullwidth.php","meta":{"kt_blocks_editor_width":"","footnotes":""},"class_list":["post-112","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/salamander.co.kr\/index.php?rest_route=\/wp\/v2\/pages\/112","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/salamander.co.kr\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/salamander.co.kr\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/salamander.co.kr\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/salamander.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=112"}],"version-history":[{"count":29,"href":"https:\/\/salamander.co.kr\/index.php?rest_route=\/wp\/v2\/pages\/112\/revisions"}],"predecessor-version":[{"id":252,"href":"https:\/\/salamander.co.kr\/index.php?rest_route=\/wp\/v2\/pages\/112\/revisions\/252"}],"wp:attachment":[{"href":"https:\/\/salamander.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=112"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}