@charset "utf-8";
/* =================================================================
   비즈니스형_2 (제조·기술기업형) — 애드플랜 테마
   모든 선택자는 .b2- 로 시작한다. 게시판 스킨과 겹치지 않는다.
   ================================================================= */

:root{
  --b2-blue:#1a76d2;
  --b2-blue-d:#0f5aa8;
  --b2-ink:#1b1b1b;
  --b2-body:#666;
  --b2-line:#e2e5ea;
  --b2-bg:#f5f6f8;
  --b2-dark:#333;
  --b2-wrap:1200px;
  --b2-gutter:24px;
}

.b2-wrap{ max-width:var(--b2-wrap); margin:0 auto; padding:0 var(--b2-gutter); }

body{
  font-family:'Noto Sans KR','맑은 고딕',Malgun Gothic,sans-serif;
  color:var(--b2-body); background:#fff; letter-spacing:-.01em;
  padding-top:var(--b2-fixedh,110px);
}
.b2-skip{ position:absolute; left:-9999px; }
.b2-skip:focus{ left:10px; top:10px; z-index:999; background:#fff; padding:10px 16px; }

img{ max-width:100%; }
.b2-empty{ padding:40px 0; text-align:center; color:#999; font-size:14px; }
.b2-empty a{ color:var(--b2-blue); text-decoration:underline; }

.b2-ico{ width:38px; height:41px; flex:none; color:var(--b2-blue); }

/* --------------------------------------------------------------- 고정 상단 */
.b2-fixed{ position:fixed; top:0; left:0; right:0; z-index:100; background:#fff; }

.b2-demo{
  background:#111827; color:rgba(255,255,255,.72); text-align:center;
  padding:9px var(--b2-gutter); display:flex; justify-content:center; gap:8px 26px; flex-wrap:wrap;
  font-size:11.5px;
}
.b2-demo b{ color:#fff; }
.b2-demo a{ color:#fff; border-bottom:1px solid rgba(255,255,255,.5); padding-bottom:2px; }

/* 유틸리티 바 */
.b2-util{ background:#f7f8fa; border-bottom:1px solid var(--b2-line); font-size:12px; }
.b2-util__in{
  max-width:var(--b2-wrap); margin:0 auto; padding:0 var(--b2-gutter); height:34px;
  display:flex; align-items:center; justify-content:space-between;
}
.b2-util__tel{ color:var(--b2-ink); font-weight:700; letter-spacing:0; }
.b2-util__tel i{ color:var(--b2-blue); font-style:normal; }
.b2-util__nav{ display:flex; align-items:center; }
.b2-util__nav li{ position:relative; padding:0 12px; }
.b2-util__nav li + li::before{
  content:''; position:absolute; left:0; top:50%; width:1px; height:9px;
  margin-top:-4px; background:var(--b2-line);
}
.b2-util__nav a{ color:#8a8f98; }
.b2-util__nav a:hover{ color:var(--b2-ink); }

/* 헤더 */
.b2-header{ background:#fff; border-bottom:1px solid var(--b2-line); }
.b2-header__in{
  max-width:var(--b2-wrap); margin:0 auto; padding:0 var(--b2-gutter); height:76px;
  display:flex; align-items:center; gap:24px;
}
.b2-logo{ display:flex; align-items:baseline; gap:9px; flex:none; }
.b2-logo strong{ font-size:23px; font-weight:800; letter-spacing:-.02em; color:var(--b2-ink); }
.b2-logo strong em{ font-style:normal; color:var(--b2-blue); }
.b2-logo small{ font-size:11px; color:#9aa0a8; letter-spacing:-.02em; }

.b2-gnb{ margin-left:auto; }
.b2-gnb__ul{ display:flex; }
.b2-gnb__li{ position:relative; }
.b2-gnb__li > a{
  display:block; padding:0 26px; line-height:75px; font-size:16px; font-weight:600;
  color:var(--b2-ink); border-bottom:3px solid transparent;
}
.b2-gnb__li:hover > a,
.b2-gnb__li.is-on > a{ color:var(--b2-blue); border-bottom-color:var(--b2-blue); }
.b2-gnb__sub{
  position:absolute; left:50%; top:100%; transform:translateX(-50%);
  min-width:160px; background:#fff; border:1px solid var(--b2-line); border-top:0;
  padding:8px 0; opacity:0; visibility:hidden; transition:opacity .16s ease;
  box-shadow:0 12px 24px rgba(0,0,0,.07);
}
.b2-gnb__li:hover .b2-gnb__sub,
.b2-gnb__li:focus-within .b2-gnb__sub{ opacity:1; visibility:visible; }
.b2-gnb__sub a{ display:block; padding:9px 20px; font-size:14px; color:#555; text-align:center; }
.b2-gnb__sub a:hover{ background:var(--b2-bg); color:var(--b2-blue); }
.b2-gnb__empty{ font-size:13px; color:#999; }
.b2-gnb__empty a{ color:var(--b2-blue); text-decoration:underline; }

.b2-burger{
  display:none; margin-left:auto; width:40px; height:40px; background:none; border:0;
  flex-direction:column; justify-content:center; gap:5px; cursor:pointer;
}
.b2-burger span{ display:block; height:2px; background:var(--b2-ink); }

/* 모바일 드로어 */
.b2-drawer{ position:fixed; inset:0; z-index:200; }
.b2-drawer__bg{ position:absolute; inset:0; background:rgba(0,0,0,.45); }
.b2-drawer__panel{
  position:absolute; right:0; top:0; bottom:0; width:min(320px,86vw);
  background:#fff; padding:64px 26px 30px; overflow-y:auto;
}
.b2-drawer__close{ position:absolute; right:18px; top:18px; background:none; border:0; font-size:19px; cursor:pointer; }
.b2-drawer__panel > ul > li > a{
  display:block; padding:14px 0; font-size:16px; font-weight:700; color:var(--b2-ink);
  border-bottom:1px solid var(--b2-line);
}
.b2-drawer__panel ul ul{ padding:8px 0 12px 12px; }
.b2-drawer__panel ul ul a{ display:block; padding:7px 0; font-size:14px; color:var(--b2-body); }

/* --------------------------------------------------------------- 히어로 */
.b2-hero{ position:relative; min-height:620px; overflow:hidden; color:#fff; }
.b2-hero > img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.b2-hero::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(12,26,45,.55) 0%, rgba(12,26,45,.35) 45%, rgba(12,26,45,.6) 100%);
}
.b2-hero__in{
  position:relative; z-index:2; max-width:var(--b2-wrap); margin:0 auto;
  padding:110px var(--b2-gutter) 110px; text-align:center;
}
.b2-hero__frame{ display:inline-block; position:relative; padding:14px 54px 8px; }
.b2-hero__frame::before,
.b2-hero__frame::after{
  content:''; position:absolute; top:0; bottom:0; width:22px;
  border:2px solid rgba(255,255,255,.55);
}
.b2-hero__frame::before{ left:0;  border-right:0; }
.b2-hero__frame::after { right:0; border-left:0; }
.b2-hero__top{ font-size:clamp(20px,2.4vw,31px); font-weight:700; text-shadow:0 2px 12px rgba(0,0,0,.35); }
.b2-hero__h{
  font-size:clamp(28px,3.6vw,46px); font-weight:800; color:#5eb0ff; margin-top:4px;
  text-shadow:0 2px 14px rgba(0,0,0,.4);
}
.b2-hero__d{
  margin-top:18px; font-size:14px; line-height:1.9; color:rgba(255,255,255,.88);
  text-shadow:0 1px 8px rgba(0,0,0,.4);
}

.b2-quick{ display:flex; justify-content:center; gap:clamp(28px,6vw,86px); margin-top:52px; }
.b2-quick a{ display:flex; flex-direction:column; align-items:center; gap:12px; color:#fff; }
.b2-quick .b2-ico{ width:52px; height:56px; color:#fff; transition:transform .2s ease, color .2s ease; }
.b2-quick a:hover .b2-ico{ transform:translateY(-4px); color:#7ec2ff; }
.b2-quick span{ font-size:13.5px; font-weight:600; text-shadow:0 1px 8px rgba(0,0,0,.45); }

/* --------------------------------------------------------------- 뉴스 & 공지 */
.b2-news{ max-width:var(--b2-wrap); margin:-88px auto 0; padding:0 var(--b2-gutter); position:relative; z-index:5; }
.b2-news__in{
  background:#fff; box-shadow:0 10px 30px rgba(20,35,60,.09);
  display:grid; grid-template-columns:270px 1fr; align-items:stretch;
}
.b2-news__head{ padding:34px 30px; text-align:right; border-right:1px solid var(--b2-line); }
.b2-news__head h2{ font-size:24px; font-weight:800; color:var(--b2-ink); line-height:1.25; }
.b2-news__head p{ margin-top:12px; font-size:12.5px; line-height:1.7; color:#9aa0a8; }
.b2-news__list{ display:grid; grid-template-columns:1fr 1fr; }
.b2-news__list li + li{ border-left:1px solid var(--b2-line); }
.b2-news__list a{ display:block; padding:34px 30px; height:100%; }
.b2-news__list strong{
  display:block; font-size:16px; font-weight:700; color:var(--b2-ink);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.b2-news__list a:hover strong{ color:var(--b2-blue); }
.b2-news__list span{ display:block; margin-top:12px; font-size:13px; line-height:1.7; color:#8a8f98; }
.b2-news__list time{ display:block; margin-top:14px; font-size:12px; color:#b0b5bc; }

/* --------------------------------------------------------------- 3분할 밴드 */
.b2-band{
  max-width:var(--b2-wrap); margin:96px auto 0; padding:0 var(--b2-gutter);
  display:grid; grid-template-columns:1fr 1fr 1fr;
}
.b2-band__fig{ position:relative; overflow:hidden; }
.b2-band__fig img{ width:100%; height:100%; object-fit:cover; display:block; }
.b2-band__fig::after{ content:''; position:absolute; inset:0; background:rgba(20,28,40,.4); }
.b2-band__fig figcaption{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:2;
  color:#fff; font-size:20px; font-weight:800; letter-spacing:.02em;
  border:2px solid rgba(255,255,255,.85); padding:12px 26px; white-space:nowrap;
}
.b2-band__mid{
  background:var(--b2-blue); color:#fff; text-align:center;
  padding:56px 34px; display:flex; flex-direction:column; justify-content:center;
}
.b2-band__mid h2{ font-size:26px; font-weight:800; }
.b2-band__mid p{ margin-top:18px; font-size:13.5px; line-height:1.95; color:rgba(255,255,255,.9); }

/* --------------------------------------------------------------- 섹션 공통 */
.b2-sec{ padding:96px 0; }
.b2-sechead{ text-align:center; margin-bottom:48px; position:relative; }
.b2-sechead::before{
  content:''; position:absolute; left:0; right:0; top:17px; height:1px; background:var(--b2-line);
}
.b2-sechead h2{
  position:relative; display:inline-block; background:#fff; padding:0 26px;
  font-size:27px; font-weight:800; color:var(--b2-ink);
}
.b2-sechead h2 em{ font-style:normal; color:var(--b2-blue); }
.b2-sechead p{ margin-top:16px; font-size:14px; color:#9aa0a8; }

.b2-btn{
  display:inline-block; padding:13px 26px; background:var(--b2-blue); color:#fff;
  font-size:13.5px; font-weight:700; transition:background .18s ease;
}
.b2-btn:hover{ background:var(--b2-blue-d); color:#fff; }
.b2-btn.is-dark{ background:rgba(0,0,0,.45); }
.b2-btn.is-dark:hover{ background:rgba(0,0,0,.62); }

/* --------------------------------------------------------------- 사업분야 */
.b2-biz__grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; }
.b2-card{
  border:1px solid var(--b2-line); background:#fff;
  display:flex; flex-direction:column; transition:border-color .18s ease, box-shadow .18s ease;
}
.b2-card:hover{ border-color:var(--b2-blue); box-shadow:0 8px 22px rgba(26,118,210,.12); }
.b2-card h3{
  display:flex; align-items:center; gap:16px; padding:30px 28px 0;
  font-size:19px; font-weight:800; color:var(--b2-ink);
}
.b2-card p{ padding:20px 28px 28px; font-size:13.5px; line-height:1.85; color:#8a8f98; flex:1; }
.b2-card__more{
  display:block; padding:15px; text-align:center; background:var(--b2-bg);
  font-size:13.5px; font-weight:700; color:var(--b2-blue); border-top:1px solid var(--b2-line);
}
.b2-card:hover .b2-card__more{ background:var(--b2-blue); color:#fff; }

/* --------------------------------------------------------------- 프로모 */
.b2-promo{ padding-bottom:96px; }
.b2-promo__in{ display:grid; grid-template-columns:1fr 1fr; gap:0; }
.b2-promo__big{ position:relative; overflow:hidden; min-height:460px; }
.b2-promo__big > img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.b2-promo__big::after{ content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(18,24,32,.88) 30%,rgba(18,24,32,.45) 100%); }
.b2-promo__txt{ position:relative; z-index:2; padding:56px 44px; color:#fff; }
.b2-promo__txt h2{ font-size:clamp(24px,2.6vw,32px); font-weight:800; line-height:1.35; }
.b2-promo__txt p{ margin-top:20px; font-size:13.5px; line-height:1.9; color:rgba(255,255,255,.8); }
.b2-promo__txt .b2-btn{ margin-top:28px; }

.b2-promo__side{ display:grid; grid-template-rows:1fr 1fr; }
.b2-promo__cell{ position:relative; overflow:hidden; padding:40px 44px; color:#fff; min-height:230px; }
.b2-promo__cell > img{
  position:absolute; right:0; bottom:0; width:46%; height:100%; object-fit:cover;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 42%);
          mask-image:linear-gradient(90deg,transparent,#000 42%);
}
.b2-promo__cell.is-blue{ background:var(--b2-blue); }
.b2-promo__cell.is-gray{ background:var(--b2-dark); }
.b2-promo__cell > div{ position:relative; z-index:2; max-width:56%; }
.b2-promo__cell h3{ font-size:22px; font-weight:800; }
.b2-promo__cell h3::after{ content:''; display:block; width:26px; height:2px; background:#fff; margin:14px 0 0; }
.b2-promo__cell p{ margin-top:14px; font-size:13px; line-height:1.8; color:rgba(255,255,255,.85); }
.b2-promo__cell .b2-btn{ margin-top:20px; background:rgba(0,0,0,.4); }
.b2-promo__cell .b2-btn:hover{ background:rgba(0,0,0,.6); }

/* --------------------------------------------------------------- 채용 */
.b2-recruit{ background:var(--b2-blue); color:#fff; padding:64px 0; }
.b2-recruit__in{ display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:center; }
.b2-recruit__txt h2{ font-size:28px; font-weight:800; }
.b2-recruit__txt p{ margin-top:16px; font-size:13.5px; line-height:1.9; color:rgba(255,255,255,.86); }
.b2-recruit__btns{ display:flex; gap:12px; margin-top:26px; flex-wrap:wrap; }
.b2-recruit__pics{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.b2-recruit__pics img{ width:100%; aspect-ratio:36/26; object-fit:cover; display:block; }

/* --------------------------------------------------------------- 오시는 길 */
.b2-map__in{ display:grid; grid-template-columns:1fr 1.35fr; gap:48px; align-items:center; }
.b2-map__txt h2{ font-size:27px; font-weight:800; color:var(--b2-ink); }
.b2-map__txt > p{ margin-top:18px; font-size:13.5px; line-height:1.9; }
.b2-map__tel{ margin-top:26px !important; font-size:15px; font-weight:700; color:var(--b2-ink); }
.b2-map__tel strong{ font-size:27px; font-weight:800; letter-spacing:-.02em; }
.b2-map__addr{ margin-top:12px !important; font-size:12.5px; line-height:1.8; color:#9aa0a8; }
.b2-map__list{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.b2-map__list a{ display:block; }
.b2-map__list img{ width:100%; aspect-ratio:56/40; object-fit:cover; display:block; }
.b2-map__list span{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  background:var(--b2-dark); color:#fff; padding:13px 16px; font-size:13.5px; font-weight:700;
}
.b2-map__list em{ font-style:normal; color:#5eb0ff; font-size:17px; }
.b2-map__list a:hover span{ background:var(--b2-blue); }

/* --------------------------------------------------------------- 서브페이지 */
.b2-sbanner{ position:relative; height:220px; overflow:hidden; }
.b2-sbanner > img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.b2-sbanner::after{ content:''; position:absolute; inset:0; background:rgba(14,26,44,.5); }
.b2-sbanner__in{
  position:relative; z-index:2; height:100%; display:flex; flex-direction:column;
  align-items:center; justify-content:center; color:#fff; text-align:center;
}
.b2-sbanner__top{ font-size:16px; color:rgba(255,255,255,.85); }
.b2-sbanner__h{ font-size:31px; font-weight:800; color:#fff; margin-top:6px; }

.b2-crumb{ background:var(--b2-bg); border-bottom:1px solid var(--b2-line); }
.b2-crumb__in{
  max-width:var(--b2-wrap); margin:0 auto; padding:0 var(--b2-gutter); height:46px;
  display:flex; align-items:center; justify-content:flex-end; gap:10px; font-size:12.5px; color:#8a8f98;
}
.b2-crumb__in span::before{ content:'›'; margin-right:10px; color:#c3c8ce; }
.b2-crumb__in a{ color:var(--b2-blue); }

.b2-sub{ padding:56px 0 96px; }
.b2-sub__in{
  max-width:var(--b2-wrap); margin:0 auto; padding:0 var(--b2-gutter);
  display:grid; grid-template-columns:210px 1fr; gap:52px; align-items:start;
}
.b2-sub__in.is-full{ grid-template-columns:1fr; gap:0; }
.b2-lnb h2{
  font-size:19px; font-weight:800; color:var(--b2-ink);
  padding-bottom:16px; border-bottom:2px solid var(--b2-ink);
}
.b2-lnb li a{
  display:block; padding:13px 16px; font-size:14px; color:#777;
  border-bottom:1px solid var(--b2-line);
}
.b2-lnb li a:hover{ color:var(--b2-blue); }
.b2-lnb li.is-on a{ background:#eef5fd; color:var(--b2-blue); font-weight:700; }
.b2-sub__h{ font-size:26px; font-weight:800; color:var(--b2-ink); margin-bottom:26px; }
.b2-sub__body #bo_list, .b2-sub__body #bo_v, .b2-sub__body #bo_w, .b2-sub__body #bo_vc{
  --adb-maxw:100%; --adb-gutter:0;
}

/* --------------------------------------------------------------- 푸터 */
.b2-footer{ background:#2b2b2b; color:#9a9a9a; padding:46px 0 40px; text-align:center; }
.b2-footer__in{ max-width:var(--b2-wrap); margin:0 auto; padding:0 var(--b2-gutter); }
.b2-logo--foot{ justify-content:center; }
.b2-logo--foot strong{ color:#fff; }
.b2-logo--foot strong em{ color:#5eb0ff; }
.b2-logo--foot small{ color:#8a8a8a; }
.b2-footer__nav{
  display:flex; justify-content:center; flex-wrap:wrap; margin-top:26px;
  padding-top:22px; border-top:1px solid rgba(255,255,255,.13); font-size:13px;
}
.b2-footer__nav li{ position:relative; padding:0 14px; }
.b2-footer__nav li + li::before{
  content:''; position:absolute; left:0; top:50%; width:1px; height:10px; margin-top:-5px;
  background:rgba(255,255,255,.2);
}
.b2-footer__nav a{ color:#b5b5b5; }
.b2-footer__nav a:hover{ color:#fff; }
.b2-footer__nav a.is-strong{ color:#fff; font-weight:700; }
.b2-footer__info{ margin-top:20px; font-size:12.5px; line-height:1.9; color:#8a8a8a; }
.b2-footer__info a{ color:#b5b5b5; }
.b2-footer__copy{ margin-top:16px; font-size:12px; color:#6e6e6e; }

.b2-top{
  position:fixed; right:22px; bottom:22px; z-index:90; width:44px; height:44px;
  background:var(--b2-dark); color:#fff; border:0; cursor:pointer; font-size:13px;
  opacity:0; visibility:hidden; transition:opacity .2s ease;
}
.b2-top.is-on{ opacity:.85; visibility:visible; }
.b2-top:hover{ opacity:1; background:var(--b2-blue); }

/* --------------------------------------------------------------- 반응형 */
@media (max-width:1100px){
  .b2-gnb__li > a{ padding:0 16px; font-size:15px; }
  .b2-news__in{ grid-template-columns:220px 1fr; }
}
@media (max-width:900px){
  .b2-gnb{ display:none; }
  .b2-burger{ display:flex; }
  .b2-header__in{ height:64px; }
  .b2-hero__in{ padding:80px var(--b2-gutter) 80px; }
  .b2-news{ margin-top:-60px; }
  .b2-news__in{ grid-template-columns:1fr; }
  .b2-news__head{ text-align:left; border-right:0; border-bottom:1px solid var(--b2-line); padding:26px 24px; }
  .b2-news__head h2{ font-size:21px; }
  .b2-band{ grid-template-columns:1fr 1fr; margin-top:64px; }
  .b2-band__mid{ grid-column:1 / -1; order:-1; padding:40px 26px; }
  .b2-biz__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .b2-promo__in{ grid-template-columns:1fr; }
  .b2-recruit__in{ grid-template-columns:1fr; gap:30px; }
  .b2-map__in{ grid-template-columns:1fr; gap:30px; }
  .b2-sub__in{ grid-template-columns:1fr; gap:30px; }
  .b2-lnb ul{ display:flex; flex-wrap:wrap; }
  .b2-lnb li a{ border-bottom:0; padding:10px 14px; }
}
@media (max-width:640px){
  :root{ --b2-gutter:18px; }
  .b2-util__tel{ display:none; }
  .b2-util__in{ justify-content:flex-end; }
  .b2-sec{ padding:60px 0; }
  .b2-hero{ min-height:520px; }
  .b2-hero__frame{ padding:12px 26px 6px; }
  .b2-hero__frame::before, .b2-hero__frame::after{ width:12px; }
  .b2-quick{ gap:22px; margin-top:38px; flex-wrap:wrap; }
  .b2-quick .b2-ico{ width:42px; height:46px; }
  .b2-news__list{ grid-template-columns:1fr; }
  .b2-news__list li + li{ border-left:0; border-top:1px solid var(--b2-line); }
  .b2-news__list a{ padding:24px; }
  .b2-band{ grid-template-columns:1fr; }
  .b2-biz__grid{ grid-template-columns:1fr; gap:16px; }
  .b2-sechead h2{ font-size:21px; padding:0 14px; }
  .b2-promo__txt{ padding:40px 26px; }
  .b2-promo__cell{ padding:32px 26px; }
  .b2-promo__cell > div{ max-width:100%; }
  .b2-promo__cell > img{ display:none; }
  .b2-recruit__pics{ gap:8px; }
  .b2-map__list{ grid-template-columns:1fr; }
  .b2-sbanner{ height:170px; }
  .b2-sbanner__h{ font-size:24px; }
}