@charset "utf-8";
/* =====================================================
   회사개요 — company/css/about.css
   ===================================================== */

/* ── 인사말 ── */
.abPic { position:relative; height:200px; margin-bottom:22px; border-radius:10px; background:var(--c_soft); overflow:hidden; }
.abPic img { width:100%; height:100%; object-fit:cover; aspect-ratio:12/4.5; display:block; }
.abPic:after { content:""; position:absolute; left:0; right:0; bottom:0; height:10px; background:linear-gradient(90deg, var(--c_base1), var(--c_base4)); }

.abTit {
	font-family:var(--f_en), var(--f_title), var(--f_base1), sans-serif;
	margin-bottom:16px; color:var(--c_ink);
	font-size:var(--fs22); font-weight:800; line-height:1.4; letter-spacing:-.04em;
}

.abTxt p { color:var(--c_muted); font-size:var(--fs16); line-height:1.85; }
.abTxt p + p { margin-top:14px; }

.abQuote { margin:20px 0 18px; padding:18px 16px; border-radius:10px; background:var(--c_soft); border-left:3px solid var(--c_base2); }
.abQuote .qLb {
	font-family:var(--f_en), sans-serif;
	display:block; margin-bottom:8px; color:var(--c_base2);
	font-size:var(--fs18); font-weight:800; letter-spacing:-.01em;
}
.abQuote p { color:var(--c_base3); font-size:var(--fs16); line-height:1.8; }

.abSign { color:var(--c_muted); font-size:var(--fs14); text-align:right; }
.abSign strong { margin-left:5px; color:var(--c_ink); font-size:var(--fs16); font-weight:800; letter-spacing:-.02em; }

/* ── VISION 밴드 ── */
.sec.vision { padding-top:26px; padding-bottom:52px; }

.visionBand {
	position:relative; overflow:hidden; padding:26px 18px; border-radius:12px;
	background:
		radial-gradient(130% 95% at 100% 15%, rgba(31,87,216,.55) 0%, rgba(31,87,216,0) 62%),
		linear-gradient(125deg, #04070f 0%, #091126 34%, #0e2160 70%, #17389b 100%);
	color:#fff;
}
.visionBand:before {
	content:"VISION";
	font-family:var(--f_en), sans-serif;
	position:absolute; right:-10px; top:-14px;
	color:rgba(255,255,255,.07); font-size:7rem; font-weight:800; letter-spacing:-.04em; line-height:1;
	pointer-events:none;
}

.vHead { position:relative; margin-bottom:18px; }
.vHead .eyebrow { display:block; margin-bottom:7px; color:var(--c_base4); font-size:var(--fs12); font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.vHead .vTit { font-family:var(--f_en), var(--f_title), var(--f_base1), sans-serif; font-size:var(--fs22); font-weight:800; letter-spacing:-.03em; line-height:1.35; }

.vGrid { position:relative; display:grid; gap:10px; }
.vCard {
	padding:16px 15px; border-radius:10px; background:#070c18;
	box-shadow:
		inset 0 0 0 1px rgba(255,255,255,.20),
		inset 0 0 34px 10px rgba(4,7,16,.60),
		0 14px 30px rgba(0,0,0,.50);
}
.vCard .vNo { font-family:var(--f_en), sans-serif; display:block; margin-bottom:9px; color:var(--c_base4); font-size:var(--fs13); font-weight:800; letter-spacing:.06em; }
.vCard strong { font-family:var(--f_en), var(--f_title), var(--f_base1), sans-serif; display:block; color:#fff; font-size:var(--fs18); font-weight:700; letter-spacing:-.03em; line-height:1.3; }
.vCard em { font-family:var(--f_en), sans-serif; display:block; margin:4px 0 11px; padding-bottom:11px; border-bottom:1px solid rgba(255,255,255,.16); color:#9dc0f5; font-size:var(--fs12); font-weight:600; font-style:normal; letter-spacing:.04em; }
.vCard ul li { position:relative; padding-left:11px; color:#fff; font-size:var(--fs14); line-height:1.6; }
.vCard ul li + li { margin-top:5px; }
.vCard ul li:before { content:""; position:absolute; left:0; top:.52em; width:3px; height:3px; border-radius:50%; background:var(--c_base4); }

/* VISION 카드 배경 이미지 */
.vCard.bg01, .vCard.bg02, .vCard.bg03 { background-position:center; background-size:cover; background-repeat:no-repeat; }
.vCard.bg01 { background-image:linear-gradient(170deg, rgba(6,10,22,.80) 0%, rgba(8,14,32,.4) 100%), url(/images/company/vision_bg01.webp); }
.vCard.bg02 { background-image:linear-gradient(170deg, rgba(6,10,22,.88) 0%, rgba(8,14,32,.4) 100%), url(/images/company/vision_bg02.webp); }
.vCard.bg03 { background-image:linear-gradient(170deg, rgba(6,10,22,.83) 0%, rgba(8,14,32,.4) 100%), url(/images/company/vision_bg03.webp); }

/* ── 경영이념 카드 ── */
.phGrid { display:grid; gap:10px; }
.phCard { padding:18px 16px; }
.phCard .phLb { display:inline-block; margin-bottom:10px; padding:5px 9px; border-radius:5px; background:var(--c_soft); color:var(--c_base1); font-size:var(--fs12); font-weight:700; letter-spacing:.04em; line-height:1; }
.phCard strong { font-family:var(--f_en), var(--f_title), var(--f_base1), sans-serif; display:block; color:var(--c_ink); font-size:var(--fs17); font-weight:800; letter-spacing:-.03em; line-height:1.35; }
.phCard p { margin-top:9px; color:var(--c_muted); font-size:var(--fs13); line-height:1.7; }

.phList { margin-top:11px; padding-top:11px; border-top:1px solid var(--c_line); }
.phList li { position:relative; padding-left:11px; color:var(--c_muted); font-size:var(--fs13); font-weight:600; line-height:1.6; }
.phList li + li { margin-top:5px; }
.phList li:before { content:""; position:absolute; left:0; top:.72em; width:3px; height:3px; border-radius:50%; background:var(--c_base4); }

/* 경영이념 강조 카드 */
.phCard.point { border-color:var(--c_base1); }
.phCard.point .phLb { background:var(--c_base1); color:#fff; }
.phCard.point strong { color:var(--c_base1); font-size:var(--fs20); }

/* ── Company Profile (글래스 카드) ── */
.profSec { position:relative; overflow:hidden; padding:34px 18px 40px; background:var(--c_soft); }
.profSec:before {
	content:""; position:absolute; inset:-14px;
	background:url(/images/company/company_profile_bg.webp) center 42%/cover no-repeat;
	filter:blur(2px) saturate(.85) contrast(1.02);
}
.profSec:after {
	content:""; position:absolute; inset:0;
	background:linear-gradient(160deg, rgba(240,245,252,.60) 0%, rgba(203,220,243,.52) 48%, rgba(228,237,250,.66) 100%);
}
.profInner { position:relative; z-index:1; }

.profHead { margin-bottom:18px; text-align:center; }
.profHead .tit { font-family:var(--f_en), var(--f_title), var(--f_base1), sans-serif; color:var(--c_ink); font-size:var(--fs24); font-weight:800; letter-spacing:-.03em; line-height:1.3; }

.profGrid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.profGrid .wide { grid-column:1 / -1; }

.glass {
	position:relative; overflow:hidden; padding:9px 10px 8px;
	border:1px solid rgba(255,255,255,.9); border-radius:10px;
	background:rgba(255,255,255,.62);
	-webkit-backdrop-filter:blur(12px) saturate(1.1); backdrop-filter:blur(12px) saturate(1.1);
	box-shadow:0 8px 22px rgba(16,32,64,.14);
	text-align:center;
}
.glass:before { content:""; position:absolute; left:12%; right:12%; top:0; height:1px; background:linear-gradient(90deg, transparent, rgba(255,255,255,1), transparent); }

.glass .ico { display:block; width:20px; height:20px; margin:0 auto 5px; }
.glass .ico svg { width:100%; height:100%; display:block; fill:none; stroke:var(--c_base2); stroke-width:1.3; stroke-linecap:round; stroke-linejoin:round; }

.glass dt { color:var(--c_ink); font-size:var(--fs14); font-weight:700; letter-spacing:-.02em; line-height:1.3; }
.glass dd { margin-top:4px; color:var(--c_base3); font-size:var(--fs13); font-weight:600; line-height:1.55; word-break:keep-all; }
.glass dd em { display:block; margin-top:2px; color:var(--c_muted); font-size:var(--fs12); font-weight:500; font-style:normal; letter-spacing:.01em; }
.glass dd .bar { padding:0 2px; color:#a9b7c8; }
.glass dd a { color:var(--c_base1); font-weight:700; }
.glass dd a:hover { text-decoration:underline; }
.glass.is-link { cursor:pointer; transition:transform .2s, box-shadow .2s; }
.glass.is-link:active { transform:scale(.98); box-shadow:0 4px 12px rgba(16,32,64,.14); }
.glass .glass-link { position:absolute; inset:0; z-index:1; }

@media screen and (max-width: 360px) {
	.abPic { height:170px; }
}

/* ── 태블릿 이상 (600px~) ── */
@media screen and (min-width: 600px) {
	.abPic { height:340px; margin-bottom:30px; }
	.abTit { margin-bottom:20px; font-size:var(--fs28); }
	.abTxt p {}
	.abQuote { margin:26px 0 22px; padding:24px 26px; }
	.abQuote p {  }
	.abSign strong { font-size:var(--fs18); }

	.sec.vision { padding-top:36px; padding-bottom:72px; }
	.visionBand { padding:36px 30px; }
	.visionBand:before { font-size:11rem; right:6px; top:-10px; }
	.vHead { margin-bottom:24px; }
	.vGrid { grid-template-columns:repeat(3, 1fr); gap:12px; }
	.vCard { padding:22px 20px; }

	.phGrid { grid-template-columns:1fr 1fr; gap:12px; }
	.phCard { padding:24px 22px; }

	.profSec { padding:48px 26px 56px; }
	.profHead { margin-bottom:24px; }
	.profGrid { grid-template-columns:repeat(3, 1fr); gap:12px; }
	.profGrid .wide { grid-column:auto; }
	.profGrid .full { grid-column:1 / -1; }
	.glass { padding:12px 14px 11px; }
	.glass .ico { width:22px; height:22px; margin-bottom:6px; }
}

/* ── PC (1024px~) ── */
@media screen and (min-width: 1024px) {
	.abPic { height:440px; }
	.profSec { padding:64px 40px 72px; }
}