@import url('sub.css'); 


/**** S:: 회사소개 > CEO 인사말 ****/
/* visual 위에 absolute 배치, 세로 중앙 */
.container:has(#visual.greeting) { position: relative; }
#contents:has(.greeting_content) { position: static; }
.greeting_content { position: absolute; top: 0; left: 0; right: 0; height: 100vh; z-index: 9; display: flex; flex-direction: column; justify-content: center; }

body[spellcheck] .greeting_content { background-color: var(--black); height: auto;}
.greeting_content .basic_in { width: 100%; }
.greeting_content .v_txt_en { color: var(--main); margin-bottom: 20px; text-transform: uppercase; }
.greeting_content h2 { color: var(--white); margin-bottom: 30px; }
.greeting_content .fs20 { color: var(--white); margin-bottom: 20px; }
.greeting_content .fs20:last-of-type { margin-bottom: 0; }
.greeting_content .ceo_name { display: flex; align-items: baseline; gap: 10px; margin-top: 20px; color: var(--white); }
.greeting_content .ceo_name span { font-weight: 700; color: var(--white); letter-spacing:5px;}
/**** E:: 회사소개 > CEO 인사말 ****/


/**** S:: 회사소개 > 회사개요 ****/
body[spellcheck] .about_cont { margin-top: 0; }
.about_cont { margin-top: -100px; }

/* 회사 정보 테이블 - Figma Frame 586 기준 */
.about_info_inner { max-width: var(--container-content); margin: 0 auto; padding: 40px 45px 0; background: var(--white); }
.about_info_table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.about_info_table th,
.about_info_table td { border: none; border-bottom: 1px solid var(--border); vertical-align: middle; text-align: left; line-height: 32px; }
.about_info_table th { color: var(--black); font-weight: 600; width: 100px; min-width: 100px; padding: 15px 0; }
.about_info_table td { padding: 15px 25px; color: var(--basic); }
.about_info_table tbody tr:first-child th,
.about_info_table tbody tr:first-child td { width: auto; }
.about_info_table tbody tr:first-child th { width: 100px; }
.about_info_address,
.about_info_contact { margin-right: 20px; }
.about_info_contact { display: inline-flex; align-items: center; gap: 6px; }
.about_info_contact .icon { font-size: 18px; line-height: 1; color: var(--basic); }

/* 사업분야·R&D 배너 (3개) */
.about_business { position: relative; width: 100%; height: 700px; overflow: hidden; display: flex; }
.about_business_area { flex: 1; position: relative; background: var(--blackBg); overflow: hidden; transition: flex 0.6s cubic-bezier(0.4, 0, 0.2, 1), transform 0.6s cubic-bezier(0.4, 0, 0.2, 1); display: block; text-decoration: none; color: inherit; transform: translateZ(0) scale(1); -webkit-transform: translateZ(0) scale(1); transform-origin: center center; will-change: transform; backface-visibility: hidden; -webkit-backface-visibility: hidden; min-width: 0; }
.about_business_area:nth-child(n+2) { margin-left: -1px; z-index: 1; }
.about_business_area:nth-child(2) { z-index: 2; }
.about_business_area:nth-child(3) { z-index: 3; }
.about_business_area:hover { transform: translateZ(0) scale(1.03); -webkit-transform: translateZ(0) scale(1.03); }
.about_business_bg { position: absolute; inset: 0; z-index: 1; }
.about_business_bg img { width: 100%; height: 100%; object-fit: cover; opacity: 0.5; transition: opacity 0.8s ease; }
.about_business_content { position: relative; z-index: 2; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; margin: 0 auto; padding: 0 20px; }
.about_business_txt { text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; min-height: 0; transition: justify-content 0.6s ease, opacity 0.6s ease; opacity: 1; }
.about_business_txt .fsE15 { color: var(--white); margin-bottom: 10px; text-transform: uppercase; }
.about_business_txt h2 { color: var(--white); margin-bottom: 20px; }
.about_business_detail { color: var(--white); opacity: 0; max-height: 0; overflow: hidden; transition: opacity 0.4s ease 0.05s, max-height 0.4s ease 0.05s, margin 0.4s ease 0.05s; margin-bottom: 0; }
.about_business_btn { text-align: center; margin-top: 0; opacity: 0; transform: scale(0.8); height: 0; pointer-events: none; }
.about_business_btn button { pointer-events: auto; }
.about_business_area:hover .about_business_txt { justify-content: flex-start; }
.about_business_area:hover .about_business_detail { opacity: 1; max-height: 200px; margin-bottom: 20px; }
.about_business_area:hover .about_business_btn { margin-top: 30px; height: auto; opacity: 1; transform: scale(1); }
/**** E:: 회사소개 > 회사개요 ****/


/**** S:: 회사소개 > 경영방침 ****/
.policy_dia { overflow: hidden; }
.policy_dia dl { position: relative; width: 880px; height: 810px; left: 50%; margin-left: -440px; transform-origin: top center; background: url('/company/img/policy_dia.png') no-repeat center/contain; }
.policy_dia dl dd { position: absolute; width: 205px; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.policy_dia dl dd::before { content: ''; display: block; background: no-repeat center/contain; }
.policy_dia dl dd span { font-weight: 600; letter-spacing: -0.04em; line-height: 190%; text-align: center; }
.policy_dia dl dd.one { left: 337px; top: 94px; }
.policy_dia dl dd.one::before { width: 100px; height: 92px; background-image: url('/company/img/policy_icon01.svg'); }
.policy_dia dl dd.one span { color: #c5013d; }
.policy_dia dl dd.two { left: 70px; top: 558px; }
.policy_dia dl dd.two::before { width: 100px; height: 100px; background-image: url('/company/img/policy_icon02.svg'); }
.policy_dia dl dd.two span { color: #2aaabd; }
.policy_dia dl dd.three { left: 606px; top: 558px; }
.policy_dia dl dd.three::before { width: 95px; height: 100px; background-image: url('/company/img/policy_icon03.svg'); }
.policy_dia dl dd.three span { color: #2f73a7; }
/**** E:: 회사소개 > 경영방침 ****/


/**** S:: 회사소개 > 오시는 길 ****/
.location_content { background: var(--white);}

/* 본사/구미사업장 - 좌우 2열 */
.location_content article { display: flex; gap: 60px; margin-bottom: 60px; align-items: center; }
.location_content article:last-of-type { margin-bottom: 0; }
.location_content article > div:first-child { flex: 0 0 380px; }
.location_content article h3 { color:var(--black); margin-bottom: 20px; }
.location_content article > div:first-child > p { color:var(--black); margin-bottom: 20px; }
.location_content article > div:first-child > div { display: flex; flex-direction: column; gap: 10px; margin-bottom: 30px; }
.location_content article > div:first-child > div > div { display: flex; align-items: center; gap: 10px; }
.location_content article > div:first-child > div .icon { font-size: 20px; color:var(--black); }
.location_content article > div:first-child > div .fs20_lbl { color:var(--black); margin-right: 12px; }
.location_content article > div:first-child > div .fs20:not([class*="btn"]) { color: var(--basic); }
.location_content article > div:first-child > div:last-of-type { flex-direction: row; margin-bottom: 0; }
	/* 지도 버튼 */
	.location_content article > div:first-child .location_btn { display: flex; gap:4px; }
	.location_content article > div:first-child .location_btn a { display: block; width: 60px; height: 60px; transition: all 0.3s linear; box-sizing: border-box; font-size: 0; text-indent: -9999px; overflow: hidden; }
	.location_content article > div:first-child .location_btn a.naverBtn { background: #10D265 url('/company/img/naver.svg') no-repeat center; }
	.location_content article .location_btn a.naverBtn:hover { background-color: #00E966; }
	.location_content article > div:first-child .location_btn a.kakaoBtn { background: #FAE100 url('/company/img/kakao.svg') no-repeat center; }
	.location_content article > div:first-child .location_btn a.kakaoBtn:hover { background-color: #FAF200; }
	.location_content article > div:first-child .location_btn a.googleBtn { background: var(--white) url('/company/img/google.png') no-repeat center; border: 1px solid var(--border); }
	.location_content article > div:first-child .location_btn a.googleBtn:hover { background-color: var(--grayBg); }

.location_content article > div:last-child { flex: 1; min-height: 600px;}
.location_content article > div:last-child > div { width: 100%; height: 100%; min-height: 600px; background:var(--grayBg) }
.location_content article > div:last-child > div .wrap_map{width: 100%; height: 600px !important;}
.location_content article > div:last-child > div .cont{display: none !important;}
.location_content article > div:last-child > div .map_border{display: none !important;}
.location_content article > div:last-child > div .wrap_controllers{display: none !important;}
.location_content article > div:last-child > div .map_area{width: 100%; height:600px; background:var(--grayBg);}
/**** E:: 회사소개 > 오시는 길 ****/





/* 반응형 */
@media all and (max-width: 1744px) {
	.about_cont { margin-top: -50px; }

}

@media all and (max-width: 1350px) {
	.location_content article > div:first-child { flex: 0 0 300px; }
}


@media all and (max-width: 980px) {
	
	/**** S:: 회사소개 > 회사개요 ****/
	.about_cont { margin-top: 0; }
	.about_info_inner { padding: 30px 40px 0; }
	.about_info_table { display: grid; grid-template-columns: auto 1fr; table-layout: auto; }
	.about_info_table tbody,
	.about_info_table tr { display: contents; }
	.about_info_table th,
	.about_info_table td { padding: 15px 15px; }
	.about_info_table th { width: auto; min-width: 0; padding: 15px 0}
	.about_info_table tbody tr:first-child th,
	.about_info_table tbody tr:first-child td { width: auto; }
	.about_info_address,
	.about_info_contact { margin-right: 16px; }
	.about_info_contact .icon { font-size: 16px; }
	.about_business { flex-direction: column !important; height: auto !important; }
	.about_business_area { flex: none !important; height: 400px !important; margin-left: 0 !important; }
	.about_business_txt .fsE15 { margin-bottom: 5px; }
	.about_business_txt h2 { margin-bottom: 10px; }
	.about_business_area:hover .about_business_detail { margin-bottom: 10px; }
	.about_business_area:hover .about_business_btn { margin-top: 0; }
	/**** E:: 회사소개 > 회사개요 ****/

	/**** S:: 회사소개 > 경영방침 ****/
	.policy_dia dl dd span { font-size: 1.78rem; }
	/**** E:: 회사소개 > 경영방침 ****/

	/**** S:: 회사소개 > 오시는 길 ****/
	.location_content article { flex-direction: column; gap:0; }
	.location_content article:first-child{border-top: 1px solid var(--border); padding-top: 60px;}
	.location_content article > div:first-child { flex: none; width: 100%; z-index: 10;}
	.location_content article h3 { margin-bottom: 10px; }
	.location_content article > div:first-child > p { margin-bottom: 10px; }
	.location_content article > div:first-child > div {gap: 5px; margin-bottom: 0; }
	.location_content article > div:first-child > div > div {gap: 5px; }
	.location_content article > div:first-child > div .icon { font-size: 16px; }
	.location_content article > div:first-child > div .fs20_lbl {margin-right: 10px; }
	
		/* 지도 버튼 */
		.location_content article > div:first-child .location_btn a {width: 50px; height: 50px;}
		.location_content article > div:first-child .location_btn a.naverBtn { background-size: 14px; }
		.location_content article > div:first-child .location_btn a.kakaoBtn { background-size: 9px; }
		.location_content article > div:first-child .location_btn a.googleBtn { background-size: 18px; }

	.location_content article > div:first-child > div { margin-bottom: 20px; }
	.location_content article > div:last-child{flex: none; width: 100%; min-height: 400px; margin-top:-30px}
	.location_content article > div:last-child > div {min-height: 400px;}
	.location_content article > div:last-child > div .wrap_map{height: 400px !important;}
	.location_content article > div:last-child > div .map_area{ height:400px;}
	/**** E:: 회사소개 > 오시는 길 ****/


}
/* 768px 이하 - index.php business와 동일 */
@media all and (max-width: 768px) {
	.about_business_area { height: 260px !important; }
	
	/**** S:: 회사소개 > 오시는 길 ****/
	.location_content article > div:last-child,
	.location_content article > div:last-child > div { min-height: 300px; }
	/**** E:: 회사소개 > 오시는 길 ****/
}
@media all and (max-width: 680px) {
	/**** S:: 회사소개 > CEO 인사말 ****/
	.greeting_content br { display: none; }
	/**** E:: 회사소개 > CEO 인사말 ****/


	/**** S:: 회사소개 > 회사개요 ****/
	.about_info_inner { padding: 20px 30px 0; }
	.about_info_table th,
	.about_info_table td { padding: 10px 12px; line-height: 28px; }
	.about_info_table th {padding: 10px 0}
	.about_info_address,
	.about_info_contact { margin-right: 12px; }
	.about_info_contact .icon { font-size: 14px; }
	/**** E:: 회사소개 > 회사개요 ****/


	/**** S:: 회사소개 > 경영방침 ****/
	.policy_dia dl dd span { font-size: 2.2rem; line-height: 125%;}
	/**** E:: 회사소개 > 경영방침 ****/



	/**** S:: 회사소개 > 오시는 길 ****/
	.location_content article h3 { margin-bottom: 8px; }
	.location_content article > div:first-child > p { margin-bottom: 8px; }
	.location_content article > div:first-child > div {gap: 4px;}
	.location_content article > div:first-child > div > div {gap: 4px; }
	.location_content article > div:first-child > div .icon { font-size: 14px; }

		/* 지도 버튼 */
		.location_content article > div:first-child .location_btn a {width: 44px; height: 44px;}
		.location_content article > div:first-child .location_btn a.naverBtn { background-size: 13px; }
		.location_content article > div:first-child .location_btn a.kakaoBtn { background-size: 8px; }
		.location_content article > div:first-child .location_btn a.googleBtn { background-size: 17px; }

	.location_content article > div:first-child > div { margin-bottom: 15px; }
	.location_content article > div:last-child{min-height: 290px; margin-top:-20px}
	.location_content article > div:last-child > div {min-height: 290px;}
	.location_content article > div:last-child > div .wrap_map{height: 290px !important;}
	.location_content article > div:last-child > div .map_area{ height:290px;}
	/**** E:: 회사소개 > 오시는 길 ****/

}