@charset "utf-8";
/* =====================================================
   대리점 안내 — company/css/network.css
   본사 / 국내대리점(직영) · 해외대리점 · 해외법인 탭
   ===================================================== */

/* ── 아이콘 스프라이트 정의부(비표시) ── */
.netIcoDef { position:absolute; width:0; height:0; overflow:hidden; }

/* ── 그룹 타이틀 ── */
.netGroup + .netGroup { margin-top:26px; }
.netGtit {
	position:relative; margin-bottom:11px; padding-left:11px;
	color:var(--c_ink); font-size:var(--fs16); font-weight:800; letter-spacing:-.02em;
}
.netGtit:before {
	content:""; position:absolute; left:0; top:50%;
	width:3px; height:14px; border-radius:2px; background:var(--c_base1);
	transform:translateY(-50%);
}

/* ── 탭 버튼 ── */
.netTab.tabWrap {
	display:flex; gap:5px; margin-bottom:18px; padding:4px;
	border:1px solid var(--c_line); border-radius:10px; background:#fff;
}
.netTab .tabBtn {
	display:flex; align-items:center; justify-content:center;
	flex:1 1 0; width:auto; min-width:0; padding:13px 4px 11px;
	border-radius:7px; background:transparent;
	color:#7a889a; font-size:var(--fs14); font-weight:700; letter-spacing:-.03em;
	line-height:1.3; text-align:center; word-break:keep-all;
}
.netTab .tabBtn:hover { color:var(--c_base1); }
.netTab .tabBtn.on {
	background:var(--c_base2); color:#fff;
	box-shadow:0 5px 14px rgba(39,62,130,.26);
}

/* ── 탭 컨텐츠 전환 ── */
.netInner .tabItem.on { animation:netFade .3s ease; }
@keyframes netFade { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:none; } }

/* ── 지역(대륙) 헤딩 ── */
.netArea + .netArea { margin-top:24px; }
.netAtit {
	display:flex; align-items:center; gap:8px; margin-bottom:10px;
	font-family:var(--f_en), var(--f_base1), sans-serif;
	color:var(--c_base1); font-size:var(--fs20); font-weight:800; letter-spacing:.04em;
}
.netAtit:after { content:""; flex:1 1 auto; height:1px; background:var(--c_line); }

/* ── 카드 리스트 (전 해상도 1열) ── */
.netList { display:grid; grid-template-columns:1fr; gap:10px; }
.netList .card { overflow:hidden; padding:16px 15px 15px; }
.netList .card:before {
	content:""; position:absolute; left:0; top:0; width:3px; height:100%;
	background:linear-gradient(180deg, var(--c_base1), var(--c_base4));
	opacity:0; transition:opacity .25s;
}
.netList .card:hover { border-color:#c3d3e9; }
.netList .card:hover:before { opacity:1; }

.netList .area {
	display:inline-block; margin-bottom:12px; padding:5px 9px;
	border-radius:5px; background:var(--c_soft);
	color:var(--c_base1); font-size:var(--fs14); font-weight:700; letter-spacing:.03em; line-height:1;
}
.netList strong {
	font-family:var(--f_en), var(--f_title), var(--f_base1), sans-serif;
	display:block; color:#000; font-size:var(--fs20); font-weight:700; letter-spacing:-.02em; line-height:1.35;
}

/* ── 연락처 목록 ── */
/* reset.css의 `.d-page ul{margin:0;padding:0}`(0,1,1)보다 우선하도록 클래스 2개로 지정 */
.netList .netInfo { display:grid; gap:7px; margin-top:18px; padding-top:14px; border-top:1px solid var(--c_line); }
.netInfo li { display:grid; grid-template-columns:5.6em 1fr; gap:8px; align-items:start; }
.netInfo .lb {
	display:inline-flex; align-items:center; padding-top:2px;
	color:var(--c_muted); font-size:var(--fs16); font-weight:700; letter-spacing:-.01em; white-space:nowrap;
}
.netInfo .ico {
	flex:0 0 auto; width:16px; height:14px; margin-right:5px;
	fill:none; stroke:var(--c_base1); stroke-width:2; stroke-linecap:round; stroke-linejoin:round;
	transform: translateY(-2px);
}
.netInfo .vl {
	color:var(--c_ink); font-size:var(--fs16); font-weight:600; line-height:1.8; overflow-wrap:anywhere;
}
.netInfo .vl a { color:var(--c_base1); font-weight:700; }
.netInfo .vl a:hover { color:var(--c_base2); text-decoration:underline; }

/* 영문 라벨(Address / TEL / FAX / Email) 폭 보정 */
.netInfo.en li { grid-template-columns:6.6em 1fr; }

/* ── 태블릿 이상 (600px~) ── */
@media screen and (min-width: 600px) {
	.netGroup + .netGroup { margin-top:32px; }
	.netGtit { margin-bottom:14px; font-size:var(--fs18); }

	.netTab.tabWrap { gap:6px; margin-bottom:24px; }
	.netTab .tabBtn { padding:13px 6px; font-size:var(--fs15); }

	.netArea + .netArea { margin-top:30px; }
	.netAtit { margin-bottom:13px; font-size:var(--fs22); }

	.netList { gap:12px; }
	.netList .card { padding:28px 20px; }
	.netList strong { font-size:var(--fs20); }
	.netList .netInfo { margin-top:22px; padding-top:16px; }
}
