*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{word-break:keep-all;overflow-wrap:anywhere;font-family:"Noto Sans KR",sans-serif;color:#1d1d1d;background:#fff;-webkit-font-smoothing:antialiased;letter-spacing:-.03em;overflow-x:hidden}
a{color:inherit;text-decoration:none}
ul{list-style:none}
img{display:block;max-width:100%}
:root{--g:#8b2e21;--g2:#8b2e21;--grey:#e6e0d8;--gold:#c98f2a}

/* HEADER */
.hd{position:fixed;inset:0 0 auto;z-index:100;height:118px;transition:background .35s,height .35s}
.hd-in{max-width:1440px;height:100%;margin:0 auto;padding:0 93px;display:flex;align-items:center;justify-content:space-between}
.hd .logo img{height:46px;width:auto;transition:height .35s}
.hd.on{height:94px;background:rgba(139,46,33,.93)}
.gnb>ul{display:flex;gap:0}
.gnb>ul>li{position:relative}
.gnb>ul>li>a{display:block;padding:10px 15px;font-size:18px;font-weight:700;color:#fff;letter-spacing:-.02em}
.hd.on .gnb>ul>li>a{font-weight:400}
.gnb .sub::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.gnb .sub{position:absolute;left:50%;top:100%;transform:translate(-50%,0);min-width:120px;background:#fff;padding:10px 0;border-radius:2px;box-shadow:0 6px 18px rgba(0,0,0,.12);opacity:0;visibility:hidden;transition:.25s}
.gnb li:hover .sub,.gnb li:focus-within .sub{opacity:1;visibility:visible;transform:translate(-50%,0)}
.gnb .sub a{display:block;padding:10px 20px;font-size:13px;color:#212121;white-space:nowrap}
.gnb .sub a:hover{color:var(--g)}
.mbtn{display:none;background:none;border:0;width:30px;height:24px;flex-direction:column;justify-content:space-between;cursor:pointer}
.mbtn span{display:block;height:2px;background:#fff}

/* HERO */
.hero{position:relative;height:100vh;min-height:600px;overflow:hidden;background:#222}
.hero-v{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-dim{position:absolute;inset:0;background:rgba(0,0,0,.18)}
.hero-t{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);text-align:center;color:#fff;font-size:60px;font-weight:700;letter-spacing:-.05em;text-shadow:0 2px 14px rgba(0,0,0,.35)}
.typing::after{content:"";display:inline-block;width:3px;height:.9em;background:#fff;margin-left:6px;vertical-align:-.08em;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.scroll-ic{position:absolute;left:50%;bottom:27px;transform:translateX(-50%);opacity:.85}
.scroll-ic .wheel{animation:wheel 1.6s infinite}
@keyframes wheel{0%{transform:translateY(0);opacity:1}70%{transform:translateY(9px);opacity:0}100%{opacity:0}}

/* INTRO */
.intro{position:relative;max-width:1440px;margin:0 auto;height:1043px;padding:0 93px}
.intro-txt{position:absolute;left:93px;top:318px;width:720px}
.intro-txt h2{font-size:62px;font-weight:900;letter-spacing:-.06em;line-height:1.15;color:#161616}
.intro-txt p{margin-top:62px;font-size:20.5px;line-height:35px;color:#222;letter-spacing:-.05em}
.feat{display:flex;gap:0;margin-top:99px}
.feat li{display:flex;flex-direction:column;align-items:center;margin-right:52px}
.feat svg{width:74px;height:74px;fill:none;stroke:var(--g2);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.feat b{margin-top:14px;font-size:19px;font-weight:700;color:var(--g2);letter-spacing:-.05em}
.intro-img img{position:absolute;width:455px;height:244px;object-fit:cover;border-radius:7px}
.intro-img .r1{left:911px;top:151px}
.intro-img .r2{left:952px;top:422px}
.intro-img .r3{left:912px;top:694px}

/* SOLUTION */
.sol{position:relative;height:2114px;overflow:hidden}
.sol-bg{position:absolute;inset:0;background:var(--grey);clip-path:polygon(100% 40%,100% 100%,0 100%,0 77%)}
.sol-bg::before{content:"";position:absolute;right:-120px;top:560px;width:1150px;height:1150px;background:url(img/M07.jpg) center/cover no-repeat;opacity:.38;-webkit-mask-image:radial-gradient(circle at 55% 50%,#000 38%,transparent 70%);mask-image:radial-gradient(circle at 55% 50%,#000 38%,transparent 70%)}
.sol-grid{position:relative;max-width:1440px;margin:0 auto;height:1380px}
.col{position:absolute;width:360px}
.c1{left:120px;top:86px}
.c2{left:480px;top:219px}
.card{position:relative;display:block;width:360px;height:545px;margin-bottom:65px;overflow:hidden;border-radius:7px}
.card img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.card:hover img{transform:scale(1.05)}
.card::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 50%,rgba(0,0,0,.55))}
.cap{position:absolute;left:57px;bottom:50px;z-index:1;color:#fff}
.cap em{display:block;font-style:normal;font-size:18px;letter-spacing:-.04em;opacity:.95}
.cap strong{display:block;margin-top:6px;font-size:38px;font-weight:700;letter-spacing:-.06em;line-height:1.2}
.sol-txt{position:absolute;left:858px;top:230px;width:470px}
.sol-txt h2{font-size:62px;font-weight:900;letter-spacing:-.06em;color:#161616}
.sol-txt p{margin-top:60px;font-size:21px;line-height:38.6px;color:#222;letter-spacing:-.05em}
.more{display:inline-flex;align-items:center;gap:20px;margin-top:48px}
.more i{position:relative;width:60px;height:60px;border-radius:50%;background:var(--g2);transition:transform .3s}
.more i::after{content:"";position:absolute;left:22px;top:22px;width:12px;height:12px;border:solid #fff;border-width:3px 3px 0 0;transform:rotate(45deg)}
.more:hover i{transform:translateX(6px)}
.more span{font-size:16px;letter-spacing:-.06em;color:#222}
.haccp{position:relative;max-width:1440px;margin:0 auto;height:734px}
.haccp-txt{position:absolute;left:248px;top:397px}
.haccp-txt h3{font-size:34px;font-weight:400;letter-spacing:-.05em;color:#111}
.haccp-txt h2{margin-top:0;font-size:50px;font-weight:900;letter-spacing:-.07em;color:#111}
.haccp-txt p{margin-top:26px;font-size:17.5px;line-height:29px;color:#222;letter-spacing:-.06em}
.haccp-img{position:absolute;left:657px;top:267px;width:783px;height:330px}
.haccp-img img{width:100%;height:100%;object-fit:cover;border-radius:10px 0 0 10px;box-shadow:0 18px 30px rgba(0,0,0,.18)}
.badge{position:absolute;left:140px;top:60px;width:156px;height:156px;border-radius:50%;background:#fff;border:9px solid var(--gold);display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--g2);font-weight:900;font-size:22px;line-height:1.05;letter-spacing:-.02em;box-shadow:0 4px 12px rgba(0,0,0,.15)}
.badge b{font-size:27px}
.badge small{margin-top:6px;font-size:13px;font-weight:700;color:#fff;background:var(--gold);padding:2px 10px;border-radius:10px}

/* PRODUCTS */
.prd{position:relative;background:var(--grey);height:2043px;overflow:hidden}
.prd-grid{position:relative;max-width:1440px;margin:0 auto;height:1000px}
.p figcaption{text-align:right;font-size:22px;letter-spacing:-.05em;color:#222;margin-top:16px;padding-right:12px}
.p img{object-fit:cover;border-radius:7px}
.p1{position:absolute;left:120px;top:293px;width:360px}
.p1 img{width:360px;height:701px}
.pc2{position:absolute;left:487px;top:102px;width:346px}
.p2 img{width:346px;height:346px}
.p3{margin-top:39px}
.p3 img{width:344px;height:344px}
.prd-txt{position:absolute;left:862px;top:290px;width:480px}
.prd-txt h2{font-size:62px;font-weight:900;letter-spacing:-.06em;color:#161616}
.prd-txt .more{margin-top:22px}
.prd-txt p{margin-top:44px;font-size:21px;line-height:38px;color:#222;letter-spacing:-.05em}

/* Q&A + FOOTER */
.qna{position:absolute;left:0;right:0;bottom:0;height:1407px}
.qna-bg{position:absolute;inset:0;background:linear-gradient(rgba(110,33,22,.86),rgba(110,33,22,.86)),url(img/hands.jpg) center/cover no-repeat;clip-path:polygon(100% 0,100% 100%,0 100%,0 56.5%)}
.qna-in{position:absolute;right:calc(50% - 600px);top:479px;text-align:right;color:#fff}
.qna-in em{display:block;font-style:normal;font-size:27px;letter-spacing:-.02em;font-weight:300}
.qna-in h2{margin-top:24px;font-size:62px;font-weight:900;line-height:1.38;letter-spacing:-.06em}
.qbtn{display:flex;align-items:center;justify-content:center;gap:18px;width:493px;height:57px;margin-top:72px;margin-left:auto;background:#000;border-radius:6px;font-size:22px;font-weight:700;color:#fff;letter-spacing:-.04em;transition:background .3s}
.qbtn:hover{background:#5e1c14}
.qbtn i{position:relative;width:34px;height:34px;border-radius:50%;background:#fff}
.qbtn i::after{content:"";position:absolute;left:10px;top:11px;width:9px;height:9px;border:solid #000;border-width:3px 3px 0 0;transform:rotate(45deg)}
.ft{position:absolute;left:calc(50% - 436px);top:1197px;display:flex;gap:96px;color:#fff;align-items:flex-start}
.ft-logo{width:215px;height:auto;margin-top:4px}
.ft-info p{font-size:15px;line-height:27px;letter-spacing:-.04em}
.ft-info span{opacity:.75;margin-right:18px}
.ft-info b{font-weight:700}
.ft-info a{margin-left:26px;font-weight:700}
.ft-info .copy{margin-top:16px;opacity:.6;font-size:13px}

/* SUBPAGE */
.sub-vis{display:flex;height:678px;padding-top:94px;background:#111}
.sv{position:relative;flex:1;overflow:hidden}
.sv img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.sv:hover img{transform:scale(1.05)}
.sv::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.42)}
.sv span{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;font-size:18px}
.sv strong{font-size:48px;font-weight:700;letter-spacing:-.05em;margin-bottom:40px}
.plist{max-width:952px;margin:0 auto;padding:65px 0 60px;scroll-margin-top:60px}
.plist h2{font-size:38px;font-weight:700;color:#242c26}
.plist .note{margin-top:20px;font-size:14px;color:#656565}
.plist ul{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:50px}
.plist li img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:4px}
.plist h3{margin-top:18px;font-size:18px;font-weight:700;color:#242c26}
.ft-sub{position:static;background:var(--g);padding:70px calc(50% - 436px) 80px;margin-top:60px;display:flex}

/* INNER PAGES */
.pg-vis{position:relative;height:440px;padding-top:94px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;text-align:center;background:linear-gradient(rgba(0,0,0,.45),rgba(0,0,0,.45)),var(--bg) center/cover no-repeat}
.pg-vis h1{font-size:48px;font-weight:700;letter-spacing:-.05em}
.pg-vis p{margin-top:18px;font-size:18px;opacity:.95}
.pg-sec{max-width:1200px;margin:0 auto;padding:110px 40px 20px;scroll-margin-top:94px}
.pg-h{font-size:38px;font-weight:700;letter-spacing:-.05em;color:#242c26;margin-bottom:44px}
.pg-note{margin:-28px 0 40px;font-size:16px;color:#656565}
.two{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.two-txt .eyebrow{font-style:normal;font-size:18px;color:var(--g)}
.two-txt h2{margin-top:10px;font-size:56px;font-weight:900;letter-spacing:-.06em}
.two-txt p{margin-top:30px;font-size:18px;line-height:34px;color:#333}
.two-img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:7px}
.gal{display:grid;gap:24px}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.gal figure,.trim figure{position:relative;overflow:hidden;border-radius:7px}
.gal img{width:100%;aspect-ratio:1;object-fit:cover;transition:transform .6s}
.gal figure:hover img{transform:scale(1.05)}
.gal figcaption,.trim figcaption{position:absolute;left:0;right:0;bottom:0;padding:40px 20px 18px;background:linear-gradient(transparent,rgba(0,0,0,.6));color:#fff;font-size:17px;font-weight:700}
.trim{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:290px 290px;gap:24px}
.trim video{grid-row:1/3;width:100%;height:100%;object-fit:cover;border-radius:7px;background:#111}
.trim img{width:100%;height:100%;object-fit:cover}
.sup-t{width:100%;border-collapse:collapse;border-top:2px solid #242c26}
.sup-t th,.sup-t td{padding:22px 24px;border-bottom:1px solid #ddd;font-size:17px;text-align:left}
.sup-t th{width:45%;font-weight:700;color:#242c26;background:#f7f4f0}
.sup-t td{color:#666}
.sup-btn{margin:50px auto 0}

/* INQUIRY FORM */
.inq{max-width:860px}
.inq-note{margin:0 0 36px}
.inq-form{display:grid;gap:24px}
.inq-form label{display:grid;gap:10px;font-size:16px;font-weight:700;color:#242c26}
.inq-form b{color:var(--g)}
.inq-form input:not([type=checkbox]),.inq-form textarea{width:100%;padding:15px 16px;border:1px solid #cfc8bf;border-radius:4px;font:400 16px "Noto Sans KR",sans-serif;background:#fff;transition:border-color .2s}
.inq-form input:focus,.inq-form textarea:focus{outline:0;border-color:var(--g);box-shadow:0 0 0 3px rgba(139,46,33,.12)}
.inq-form .err{border-color:#c0392b!important}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.inq-form fieldset{border:1px solid #e2dcd4;border-radius:6px;padding:22px 24px}
.inq-form fieldset.err{border-color:#c0392b}
.inq-form legend{padding:0 8px;font-size:16px;font-weight:700;color:#242c26}
.pgrp{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px;margin-top:8px}
.pgrp+.pgrp{margin-top:20px;padding-top:18px;border-top:1px dashed #e2dcd4}
.pgrp-t{grid-column:1/-1;font-size:14px;font-weight:700;color:var(--g)}
.inq-form .ck{display:flex;align-items:center;gap:10px;font-weight:400;font-size:15px;cursor:pointer}
.inq-form .ck input{width:18px;height:18px;accent-color:var(--g);flex:none}
.consent{background:#f7f4f0;border-radius:6px;padding:22px 24px}
.consent-t{font-weight:700;font-size:15px;margin-bottom:10px}
.consent ul{list-style:disc;padding-left:18px;font-size:13px;line-height:1.8;color:#555;margin-bottom:14px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.inq-msg{min-height:24px;font-size:15px;font-weight:700;text-align:center}
.inq-msg.ok{color:#1e7a46}.inq-msg.bad{color:#c0392b}
.inq-btn{margin:0 auto;border:0;cursor:pointer;font-family:inherit}
.inq-btn:disabled{opacity:.6;cursor:wait}

/* FLOATING */
.flo{position:fixed;right:18px;bottom:82px;z-index:90;width:100px;height:100px;border-radius:50%;background:var(--g2);color:#fff;font-size:30px;font-weight:700;line-height:1.15;text-align:center;display:flex;align-items:center;justify-content:center;letter-spacing:-.04em;box-shadow:3px 4px 4px rgba(0,0,0,.35);border:2px solid rgba(255,255,255,.25);transition:transform .3s}
.flo:hover{transform:scale(1.06)}

/* REVEAL */
.rv{opacity:0;transform:translateY(40px);transition:opacity .9s ease,transform .9s ease}
.rv.in{opacity:1;transform:none}

/* RESPONSIVE */
@media (max-width:1439px){
  .intro,.sol-grid,.haccp,.prd-grid{zoom:calc(100vw / 1440px)}
}
@media (max-width:1100px){
  .intro,.sol-grid,.haccp,.prd-grid{zoom:1}
  .hd-in{padding:0 24px}
  .gnb{display:none}
  .gnb.open{display:block;position:fixed;top:70px;left:0;right:0;background:#8b2e21;padding:8px 0 14px;box-shadow:0 12px 24px rgba(0,0,0,.25);z-index:200}
  .gnb.open>ul>li>a{padding:12px 24px;border-bottom:1px solid rgba(255,255,255,.12)}
  .gnb.open>ul{flex-direction:column}
  .gnb.open .sub{display:none}
  .mbtn{display:flex}
  .hd,.hd.on{height:70px}
  .hd .logo img{height:34px}
  .hero-t{font-size:34px;padding:0 20px}
  .intro,.sol,.haccp,.prd,.sol-grid,.prd-grid,.qna{height:auto}
  .intro{padding:70px 24px}
  .intro-txt,.intro-img img,.col,.sol-txt,.haccp-txt,.haccp-img,.p1,.pc2,.prd-txt,.qna-in,.ft{position:static;width:auto;transform:none}
  .intro-txt h2,.sol-txt h2,.prd-txt h2{font-size:36px}
  .intro-txt p,.sol-txt p,.prd-txt p{margin-top:24px;font-size:16px;line-height:28px}
  .feat{margin-top:40px;flex-wrap:wrap;gap:20px}
  .feat li{margin:0;width:calc(50% - 10px)}
  .feat svg{width:56px;height:56px}
  .intro-img{display:grid;gap:14px;margin-top:40px}
  .intro-img img{width:100%;height:220px}
  .sol{padding:40px 24px 80px}
  .sol-bg{clip-path:none}
  .sol-bg::before{display:none}
  .sol-grid{display:flex;flex-direction:column;gap:0}
  .sol-txt{order:-1;margin-bottom:36px}
  .col{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
  .card{width:auto;height:260px;margin:0}
  .cap{left:18px;bottom:18px}.cap em{font-size:13px}.cap strong{font-size:22px}
  .haccp{margin-top:60px;display:flex;flex-direction:column-reverse;gap:30px}
  .haccp-txt h3{font-size:22px}.haccp-txt h2{font-size:32px}.haccp-txt p{margin-top:18px;font-size:15px}
  .haccp-img{height:240px;position:relative;left:auto;top:auto;width:auto}
  .haccp-img img{border-radius:10px}
  .badge{left:auto;right:14px;top:-30px;width:100px;height:100px;font-size:14px;border-width:6px}.badge b{font-size:17px}.badge small{font-size:12px}
  .prd{padding:70px 24px 0}
  .prd-grid{display:flex;flex-direction:column}
  .prd-txt{order:-1;margin-bottom:36px}
  .p1 img,.p2 img,.p3 img{width:100%;height:auto;aspect-ratio:1}
  .pc2{margin-top:24px}
  .qna{position:relative;margin:60px -24px 0;padding:140px 24px 50px}
  .qna-bg{clip-path:polygon(100% 0,100% 100%,0 100%,0 18%)}
  .qna-in{position:relative;right:auto;top:auto;z-index:1}
  .qna-in em{font-size:18px}.qna-in h2{font-size:34px}
  .qbtn{width:100%;margin-top:30px;font-size:18px}
  .ft{position:relative;left:auto;top:auto;flex-direction:column;gap:24px;margin-top:80px}
  .ft-sub{position:static}
  .mbtn{width:44px;height:44px;padding:11px 7px;margin-right:-7px;box-sizing:border-box}
  .inq-form .ck{min-height:40px}
  .ft-info a{padding:8px 0}
  .ft-logo{width:160px}
  .ft-info a{display:block;margin:4px 0 0}
  .pg-vis{height:300px;padding-top:70px}
  .pg-vis h1{font-size:32px}.pg-vis p{font-size:15px;padding:0 20px}
  .pg-sec{padding:60px 20px 10px;scroll-margin-top:70px}
  .pg-h{font-size:26px;margin-bottom:24px}
  .pg-note{margin:-12px 0 24px;font-size:14px}
  .two{grid-template-columns:1fr;gap:30px}
  .two-txt h2{font-size:36px}.two-txt p{font-size:15px;line-height:28px}
  .g3,.g4{grid-template-columns:1fr 1fr;gap:12px}
  .trim{grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:12px}
  .trim img{aspect-ratio:4/3;height:auto}
  .trim video{grid-row:auto;grid-column:1/3;aspect-ratio:16/10}
  .gal figcaption,.trim figcaption{font-size:14px;padding:30px 12px 10px}
  .sup-t th,.sup-t td{padding:16px 12px;font-size:14px}
  .row2,.pgrp{grid-template-columns:1fr}
  .inq-form fieldset,.consent{padding:18px 16px}
  .sub-vis{height:auto;padding-top:70px;flex-direction:column}
  .sv{flex:none;height:150px}
  .sv strong{font-size:30px;margin-bottom:10px}
  .plist{padding:50px 24px 20px}
  .plist h2{font-size:28px}
  .plist ul{grid-template-columns:1fr 1fr;gap:16px;margin-top:28px}
  .plist h3{font-size:15px;margin-top:10px}
  .ft-sub{padding:50px 24px;margin-top:40px}
  .flo{width:60px;height:60px;font-size:17px;right:10px;bottom:16px}
}

/* fixes: contact page + empty message + hamburger close icon */
.contact-page .flo{display:none}
.inq-msg:empty{display:none}
.mbtn span{transition:transform .25s,opacity .2s}
.mbtn.x span:nth-child(1){transform:translateY(10px) rotate(45deg)}
.mbtn.x span:nth-child(2){opacity:0}
.mbtn.x span:nth-child(3){transform:translateY(-10px) rotate(-45deg)}