@charset "utf-8";

/* =========================== SUB */
#shSub{display:flex;align-items:center;justify-content:center;height:500px;margin:0 auto;background:url(../../images/fs/layout/sub_bg01.jpg) center no-repeat;background-size:cover}
#shSub .txt_area{padding-top:60px;color:#fff;text-align:center;font-family:'Paperlogy', sans-serif}
#shSub .txt_area p{margin-bottom:20px;font-size:46px;font-weight:700}
#shSub .txt_area div{display:flex;justify-content:center;align-items:center;font-size:16px;font-weight:500}
#shSub .txt_area div a{padding-top:3px}
#shSub .txt_area div svg{fill:#fff}
#shSub .txt_area div i{margin:0 20px;font-size:14px}
#shSub .sub_tit{display:none}
@media (max-width:1024px){
#shSub{height:300px}
#shSub .txt_area p{font-size:35px}
}
/* =========================== SNB */
#shSnb{display:flex;justify-content:center;margin:0 auto 50px;background:var(--primary)}
#shSnb li+li{border-left:1px solid rgba(255,255,255,.15)}
#shSnb li a{display:block;min-width:160px;height:62px;padding:0 20px;font-size:17px;font-weight:500;line-height:62px;text-align:center;color:#fff;font-family:'Paperlogy', sans-serif}
#shSnb li.on a{font-weight:600;color:var(--primary);background:#fff}

/* 반응형 [s] */
@media (max-width:1024px){
#shSnb{display:none}
}
/* 반응형 [e] */


/****************/
/* 컨텐츠 */
/****************/
/* 공통 */
/* 준비중 */
.img_ready {display:flex;justify-content:center;align-items: center;margin:10rem 0;}
.img_ready .left {}
.img_ready .left img {width: 41.7rem;}
.img_ready .right {padding-left:2rem;}
.img_ready .right strong {line-height:1.2;font-size:4rem;color:#1d1d1d;font-weight: 300;}
.img_ready .right strong em {font-weight: 700;}
.img_ready .right strong em br {}
.img_ready .right p {margin-top:2.5rem;line-height:1.5;font-size:1.8rem;color:#767676;}
@media only screen and (max-width:1023px){
    .img_ready .left img {}
}
@media only screen and (max-width:767px){
    .img_ready {flex-direction: column;gap:4rem;text-align: center;}
    .img_ready .right strong em br {display: none;}
}

.wrap {max-width: 1600px;margin: 0 auto;width: 100%;}
@media only screen and (max-width:1399px){
    .wrap {width: auto;}
}
@media only screen and (max-width:480px){
    .wrap {width: auto;}
}


/* =========================== LOCATION (오시는길) */
.loc_map_item {position: relative; margin-bottom: 8rem;}
.loc_map_item:last-child {margin-bottom: 0;}
.map_api {background: #f5f5f5; border: 1px solid #ddd; display: flex; align-items: center; justify-content: center; font-size: 2rem; color: #999;}
.map_api iframe {width: 100%; height: 50rem;}
.loc_info_card {position: absolute; left: 4rem; bottom: 4rem; background: #fff; padding: 4rem; box-shadow: 0 10px 30px rgba(0,0,0,0.1); width: 45rem; z-index: 10;}
.loc_info_card .loc_tit {font-size: 2.2rem; font-weight: 700; color: #111; margin-bottom: 1.5rem; display:block; line-height:1;}
.loc_info_card .addr {font-size: 1.6rem; color: #444; line-height: 1.6; margin-bottom: 2.5rem; word-break: keep-all;}
.loc_info_card .contact {display: flex; border-top: 1px solid #eee; padding-top: 2rem;}
.loc_info_card .contact span {flex: 1; font-size: 1.5rem; color: #666; display:flex; align-items:center; gap: 0.8rem; justify-content:center;}
.loc_info_card .contact span strong {font-weight: 700; color: #333;}
.loc_info_card .contact span:nth-child(2) {border-left: 1px solid #eee;}

@media only screen and (max-width: 1024px) {
    .loc_info_card {position: static;left: 2rem; bottom: 2rem; width: 100%; padding: 3rem; box-shadow: none;border:1px solid #ddd;border-radius: 0;}
}
@media only screen and (max-width: 768px) {
    .loc_map_item {margin-bottom: 5rem;}
    .map_api {height: 40rem;}
    .loc_info_card {width: 100%; padding: 2.5rem;}
    .loc_info_card .loc_tit {font-size: 2rem; margin-bottom: 1rem;}
    .loc_info_card .addr {font-size: 1.4rem; margin-bottom: 2rem;}
    .loc_info_card .contact {flex-direction: column; gap: 1rem; align-items:flex-start;}
    .loc_info_card .contact span {justify-content:flex-start;}
    .loc_info_card .contact span:nth-child(2) {border-left: 0; padding-left: 0; margin-left: 0; border-top: 1px solid #eee; padding-top: 1rem; width: 100%;}
}

/* =========================== HISTORY (연혁) */
.history_wrap {padding: 12rem 0; background: #fff;}
.history_section {display: flex; align-items: flex-start; justify-content: space-between; gap: 5rem;}

/* Left Title */
.history_title_area {position: sticky; top: 15rem; width: 35%;}
.history_title_area .sub_text {font-size: 1.6rem; font-weight: 700; color: var(--primary); letter-spacing: 2px; margin-bottom: 2rem; text-transform: uppercase;}
.history_title_area h2 {font-size: 4.2rem; font-weight: 300; color: var(--primary2); line-height: 1.3; letter-spacing: -1px; word-break: keep-all;}
.history_title_area h2 strong {font-weight: 800; display: block; margin-top: 1rem;}

/* Right Timeline */
.history_timeline_area {width: 60%; position: relative; padding-left: 5rem;}
.history_timeline_area::before {content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 1px; background: #eaeaea;}

.timeline_item {position: relative; margin-bottom: 10rem;}
.timeline_item:last-child {margin-bottom: 0;}

.timeline_node {position: absolute; left: -5rem; top: 0.8rem; width: 1.6rem; height: 1.6rem; background: #fff; border: 3px solid var(--primary); border-radius: 50%; transform: translateX(-50%); z-index: 2; box-shadow: 0 0 0 4px #fff;}

.timeline_content .year {font-size: 3.6rem; font-weight: 800; color: var(--primary2); line-height: 1; margin-bottom: 1.5rem; position: relative; z-index: 1; letter-spacing: -1px;}
.timeline_content .events {position: relative; z-index: 2; padding-top: 0;}
.timeline_content .events li {display: flex; align-items: flex-start; font-size: 1.8rem; font-weight: 500; color: #444; line-height: 1.6; margin-bottom: 1.2rem; position: relative; padding-left: 1.5rem; word-break: keep-all;}
.timeline_content .events li .month {font-weight: 700; color: var(--primary2); flex-shrink: 0; width: 5.5rem;}
.timeline_content .events li .txt {flex: 1;}
.timeline_content .events li::before {content: ''; position: absolute; left: 0; top: 1.1rem; width: 5px; height: 5px; background: var(--primary); border-radius: 50%;}
.timeline_content .events li:last-child {margin-bottom: 0;}

/* Left Title Image Box */
.history_title_area .left_image_box {margin-top: 4rem; border-radius: 2rem; overflow: hidden; box-shadow: 0 15px 35px rgba(0,0,0,0.08);}
.history_title_area .left_image_box img {width: 100%; height: auto; display: block;}



/* =========================== ORGANIZATION (조직도) */
/* Top Level */
.org_top {display: flex; justify-content: center; margin-bottom: 0; position: relative;}
.org_top::after {content: ''; position: absolute; bottom: -2rem; left: 50%; transform: translateX(-50%); width: 2px; height: 2rem; background: var(--primary);}
.ceo_card {background: var(--primary); padding: 3.5rem 5rem; border-radius: 1rem; text-align: center; min-width: 35rem; position: relative; z-index: 2;}
.ceo_card .icon {width: 6rem; height: 6rem; background: rgba(255,255,255,0.15); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 1.5rem;}
.ceo_card .icon span {font-size: 3rem; color: #fff;}
.ceo_card h3 {font-size: 2.4rem; font-weight: 800; color: #fff; margin-bottom: 0;}

/* Branches */
.org_branches {display: flex; gap: 4rem; justify-content: center; margin-top: 4rem;}
.org_branch {flex: 1; display: flex; flex-direction: column; align-items: center; position: relative;}
.org_branch::before {content: ''; position: absolute; top: -2rem; left: 50%; transform: translateX(-50%); width: 2px; height: 2rem; background: var(--primary);}
.org_branch::after {content: ''; position: absolute; top: -2rem; height: 2px; background: var(--primary);}
.org_branch:first-child::after {left: 50%; width: calc(50% + 2.5rem);}
.org_branch:last-child::after {right: 50%; width: calc(50% + 2.5rem);}

.branch_title {position: relative; display: flex; align-items: center; gap: 0.8rem; padding: 1.2rem 3.5rem; border-radius: 3rem; font-size: 1.8rem; font-weight: 700; color: #fff; margin-bottom: 0; background: var(--primary2); z-index: 2;}
.branch_title::after {content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); width: 1px; height: 2.5rem; background: #bbb; z-index: -1;}
.branch_title span {font-size: 2rem; color: #fff;}

.branch_depts {display: flex; gap: 2rem; width: 100%; justify-content: center; margin-top: 4.4rem;}
.dept_card {background: #fff; padding: 3rem 2.5rem; border-radius: 1rem; border: 1px solid #ddd; flex: 1; min-width: 25rem; position: relative; z-index: 2;}
.dept_card::before {content: ''; position: absolute; top: -2rem; left: 50%; transform: translateX(-50%); width: 1px; height: 2rem; background: #bbb;}
.dept_card::after {content: ''; position: absolute; top: -2rem; height: 1px; background: #bbb;}
.dept_card:first-child::after {left: 50%; width: calc(50% + 1.5rem);}
.dept_card:last-child::after {right: 50%; width: calc(50% + 1.5rem);}
.dept_card:not(:first-child):not(:last-child)::after {left: -1.5rem; width: calc(100% + 3rem);}

.dept_head {display: flex; align-items: center; gap: 1.5rem; margin-bottom: 2.5rem; border-bottom: 1px solid #f5f5f5; padding-bottom: 2.5rem;}
.dept_head .icon {width: 4.5rem; height: 4.5rem; background: #f0f4ff; border-radius: 0.8rem; display: flex; align-items: center; justify-content: center;}
.dept_head .icon span {font-size: 2.4rem; color: #4c6ef5;}
.dept_head h4 {font-size: 1.8rem; font-weight: 700; color: #222; line-height: 1.3;}

.dept_list li {font-size: 1.4rem; color: #555; line-height: 1.6; margin-bottom: 1rem; position: relative; padding-left: 2rem; font-weight: 500;}
.dept_list li::before {content: '✓'; position: absolute; left: 0; top: 0; color: #999; font-size: 1.4rem;}
.dept_list li:last-child {margin-bottom: 0;}

@media only screen and (max-width: 1200px) {
    .org_branches {flex-direction: column; gap: 8rem;}
    .branch_depts {flex-wrap: wrap;}
    .org_top::after, .org_branch::before, .org_branch::after, .branch_title::after, .dept_card::before, .dept_card::after {display: none;}
}

@media only screen and (max-width: 768px) {
    .org_wrap {padding: 6rem 0;}
    .ceo_card {padding: 3rem; min-width: 100%;}
    .branch_depts {flex-direction: column;}
    .dept_card {min-width: 100%;}
}

@media only screen and (max-width: 1024px) {
    .history_section {flex-direction: column; gap: 8rem;}
    .history_title_area {width: 100%; position: relative; top: 0;}
    .history_title_area .left_image_box {margin-top: 3rem; max-width: 60rem;}
    .history_timeline_area {width: 100%; padding-left: 4rem;}
    .timeline_node {left: -4rem;}
}
@media only screen and (max-width: 768px) {
    .history_wrap {padding: 8rem 0;}
    .history_title_area h2 {font-size: 3.2rem;}
    .history_timeline_area {padding-left: 3rem;}
    .timeline_node {left: -3rem; width: 1.4rem; height: 1.4rem; top: 0.6rem;}
    .timeline_item {margin-bottom: 6rem;}
    .timeline_content .year {font-size: 3rem; margin-bottom: 1.5rem;}
    .timeline_content .events li {font-size: 1.6rem; padding-left: 1.2rem;}
    .timeline_content .events li::before {top: 1rem; width: 4px; height: 4px;}
    .timeline_content .image_box {margin-top: 2.5rem; border-radius: 1.2rem;}
}


/* =========================== COMPANY (회사소개) */
/* .company_hero_wrap {position: relative; z-index: 1; padding: 30rem 2rem; text-align: center; background: radial-gradient(circle at top left, #b3d9ff 0%, #89c4f4 100%); overflow: hidden; box-shadow: inset 0 0 50px rgba(0, 0, 0, 0.05);}
.hero_bg_circles {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; z-index: -1; pointer-events: none;}
.hero_bg_circles .circle_1 {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 60rem; height: 60rem; background: radial-gradient(circle at 30% 30%, #ffffff 0%, #f0f7ff 100%); border-radius: 50%; box-shadow: 0 30px 60px rgba(20, 80, 150, 0.15), inset 0 5px 15px rgba(255, 255, 255, 1); animation: bgBreath 8s ease-in-out infinite;}
.hero_bg_circles .circle_2 {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100rem; height: 100rem; background: radial-gradient(circle at 30% 30%, #eef6ff 0%, #d4e8fb 100%); border-radius: 50%; z-index: -1; box-shadow: 0 40px 80px rgba(20, 80, 150, 0.1), inset 0 5px 20px rgba(255, 255, 255, 0.8); animation: bgBreath 10s ease-in-out infinite reverse;}
.hero_bg_circles .circle_3 {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 150rem; height: 150rem; background: radial-gradient(circle at 30% 30%, #e0f0ff 0%, #c4dff8 100%); border-radius: 50%; z-index: -2; box-shadow: 0 50px 100px rgba(20, 80, 150, 0.08), inset 0 5px 25px rgba(255, 255, 255, 0.6); animation: bgBreath 12s ease-in-out infinite;}
.hero_content {position: relative; z-index: 2;}
.hero_title {font-size: 5rem; font-weight: 800; color: #222; margin-bottom: 2rem; letter-spacing: 1px;}
.hero_title .highlight_red {color: var(--primary);}
.hero_subtitle {font-size: 2.2rem; color: #444; font-weight: 500; line-height: 1.6;}

@media only screen and (max-width: 768px) {
    .company_top_section {padding: 0 1rem;}
    .company_hero_wrap {padding: 6rem 1rem;}
    .hero_bg_circles .circle_1 {width: 60vw; height: 60vw;}
    .hero_bg_circles .circle_2 {width: 100vw; height: 100vw;}
    .hero_bg_circles .circle_3 {width: 150vw; height: 150vw;}
    .hero_title {font-size: 3.2rem; margin-bottom: 1.5rem;}
    .hero_subtitle {font-size: 1.6rem; word-break: keep-all;}
}

@keyframes bgBreath {
    0% { transform: translate(-50%, -50%) scale(1); }
    50% { transform: translate(-50%, -50%) scale(1.05); }
    100% { transform: translate(-50%, -50%) scale(1); }
} */

/* Company Info Board */
/* .company_info_board {background: #ffffff; box-shadow: 0 15px 40px rgba(0, 50, 150, 0.05); max-width: 1600px; margin: -6rem auto 10rem; position: relative; z-index: 10; padding: 4rem; display: flex; flex-direction: column; gap: 4rem;}
.info_grid_top {display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem;}
.info_stat {display: flex; align-items: flex-start; gap: 1.5rem;}
.stat_icon {width: 5rem; height: 5rem; background: #f4f7fb; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0;}
.stat_icon svg {width: 2.4rem; height: 2.4rem; stroke: var(--primary, #0056b3); filter: none;}
.stat_text {display: flex; flex-direction: column; gap: 0.5rem; justify-content: center;}
.stat_label {font-size: 1.4rem; color: #888; font-weight: 500;}
.stat_value {font-size: 1.8rem; color: #222; font-weight: 700; word-break: keep-all; line-height: 1.4;}
.info_grid_bottom {display: flex; align-items: flex-start; gap: 1.5rem; padding-top: 3rem; border-top: 1px solid #f0f4f8;}
.info_grid_bottom .stat_value {font-size: 1.6rem; font-weight: 500; line-height: 1.6;}
@media only screen and (max-width: 1024px) {
    .info_grid_top {grid-template-columns: repeat(2, 1fr); gap: 3rem;}
}
@media only screen and (max-width: 768px) {
    .company_info_board {margin: 0 auto 10rem;}
    .info_grid_top {grid-template-columns: 1fr;}
    .info_grid_bottom {flex-direction: column; align-items: flex-start;}
} */



/* =========================== CEO MESSAGE (인사말) */
.ceo_message_wrap {display: flex; gap: 13rem; align-items: center;}
.ceo_img_area {flex: 1; border-radius: 2rem; overflow: hidden; box-shadow: 0 20px 40px rgba(0,0,0,0.1); position: relative; max-width: 600px;}
.ceo_img_area::before {content: ''; display: block; padding-top: 130%;}
.ceo_img_area img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease;}
.ceo_img_area:hover img {transform: scale(1.05);}

.ceo_txt_area {flex: 1.2;}
.ceo_slogan {font-size: 3.6rem; font-weight: 300; line-height: 1.4; color: #111; margin-bottom: 4rem; word-break: keep-all; position: relative; padding-top: 5rem;}
.ceo_slogan::before {content: ''; position: absolute; left: 0; top: 0; display: block; width: 31px; height: 25px; font-size: 10rem; color: var(--primary); opacity: 0.15; line-height: 1;background:url(../../images/fs/content/sub01/dot.png) left top no-repeat;}
.ceo_slogan strong {font-weight: 800; color: var(--primary2);}
.ceo_slogan span {color: var(--primary); font-weight: 600;}

.ceo_desc {font-size: 1.8rem; color: #555; line-height: 1.8; margin-bottom: 2rem; word-break: keep-all;}
.ceo_desc:last-of-type {margin-bottom: 6rem;}

.ceo_sign {text-align: right; font-size: 2.2rem; font-weight: 700; color: #222; border-top: 1px solid #eee; padding-top: 3rem;}

@media only screen and (max-width: 1200px) {
    .ceo_message_wrap {padding: 10rem 2rem;}
    .ceo_slogan {font-size: 3.2rem;}
}
@media only screen and (max-width: 1024px) {
    .ceo_message_wrap {flex-direction: column; gap: 6rem;}
    .ceo_img_area {width: 100%; max-width: 60rem; margin: 0 auto;}
    .ceo_img_area::before {padding-top: 70%;}
    .ceo_txt_area {width: 100%;}
}
@media only screen and (max-width: 1024px) {
    .loc_info_card {position: static;left: 2rem; bottom: 2rem; width: 100%; padding: 3rem; box-shadow: none;border:1px solid #ddd;border-radius: 0;}
}
@media only screen and (max-width: 768px) {
    .loc_map_item {margin-bottom: 5rem;}
    .map_api {height: 40rem;}
    .loc_info_card {width: 100%; padding: 2.5rem;}
    .loc_info_card .loc_tit {font-size: 2rem; margin-bottom: 1rem;}
    .loc_info_card .addr {font-size: 1.4rem; margin-bottom: 2rem;}
    .loc_info_card .contact {flex-direction: column; gap: 1rem; align-items:flex-start;}
    .loc_info_card .contact span {justify-content:flex-start;}
    .loc_info_card .contact span:nth-child(2) {border-left: 0; padding-left: 0; margin-left: 0; border-top: 1px solid #eee; padding-top: 1rem; width: 100%;}
}

/* =========================== HISTORY (연혁) */
.history_wrap {padding: 12rem 0; background: #fff;}
.history_section {display: flex; align-items: flex-start; justify-content: space-between; gap: 5rem;}

/* Left Title */
.history_title_area {position: sticky; top: 15rem; width: 35%;}
.history_title_area .sub_text {font-size: 1.6rem; font-weight: 700; color: var(--primary); letter-spacing: 2px; margin-bottom: 2rem; text-transform: uppercase;}
.history_title_area h2 {font-size: 4.2rem; font-weight: 300; color: var(--primary2); line-height: 1.3; letter-spacing: -1px; word-break: keep-all;}
.history_title_area h2 strong {font-weight: 800; display: block; margin-top: 1rem;}

/* Right Timeline */
.history_timeline_area {width: 60%; position: relative; padding-left: 5rem;}
.history_timeline_area::before {content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 1px; background: #eaeaea;}

.timeline_item {position: relative; margin-bottom: 10rem;}
.timeline_item:last-child {margin-bottom: 0;}

.timeline_node {position: absolute; left: -5rem; top: 0.8rem; width: 1.6rem; height: 1.6rem; background: #fff; border: 3px solid var(--primary); border-radius: 50%; transform: translateX(-50%); z-index: 2; box-shadow: 0 0 0 4px #fff;}

.timeline_content .year {font-size: 3.6rem; font-weight: 800; color: var(--primary2); line-height: 1; margin-bottom: 1.5rem; position: relative; z-index: 1; letter-spacing: -1px;}
.timeline_content .events {position: relative; z-index: 2; padding-top: 0;}
.timeline_content .events li {display: flex; align-items: flex-start; font-size: 1.8rem; font-weight: 500; color: #444; line-height: 1.6; margin-bottom: 1.2rem; position: relative; padding-left: 1.5rem; word-break: keep-all;}
.timeline_content .events li .month {font-weight: 700; color: var(--primary2); flex-shrink: 0; width: 5.5rem;}
.timeline_content .events li .txt {flex: 1;}
.timeline_content .events li::before {content: ''; position: absolute; left: 0; top: 1.1rem; width: 5px; height: 5px; background: var(--primary); border-radius: 50%;}
.timeline_content .events li:last-child {margin-bottom: 0;}

/* Left Title Image Box */
.history_title_area .left_image_box {margin-top: 4rem; border-radius: 2rem; overflow: hidden; box-shadow: 0 15px 35px rgba(0,0,0,0.08);}
.history_title_area .left_image_box img {width: 100%; height: auto; display: block;}



/* =========================== ORGANIZATION (조직도) */
/* Top Level */
.org_top {display: flex; justify-content: center; margin-bottom: 0; position: relative;}
.org_top::after {content: ''; position: absolute; bottom: -2rem; left: 50%; transform: translateX(-50%); width: 2px; height: 2rem; background: var(--primary);}
.ceo_card {background: var(--primary); padding: 3.5rem 5rem; border-radius: 1rem; text-align: center; min-width: 35rem; position: relative; z-index: 2;}
.ceo_card .icon {width: 6rem; height: 6rem; background: rgba(255,255,255,0.15); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 1.5rem;}
.ceo_card .icon span {font-size: 3rem; color: #fff;}
.ceo_card h3 {font-size: 2.4rem; font-weight: 800; color: #fff; margin-bottom: 0;}

/* Branches */
.org_branches {display: flex; gap: 4rem; justify-content: center; margin-top: 4rem;}
.org_branch {flex: 1; display: flex; flex-direction: column; align-items: center; position: relative;}
.org_branch::before {content: ''; position: absolute; top: -2rem; left: 50%; transform: translateX(-50%); width: 2px; height: 2rem; background: var(--primary);}
.org_branch::after {content: ''; position: absolute; top: -2rem; height: 2px; background: var(--primary);}
.org_branch:first-child::after {left: 50%; width: calc(50% + 2.5rem);}
.org_branch:last-child::after {right: 50%; width: calc(50% + 2.5rem);}

.branch_title {position: relative; display: flex; align-items: center; gap: 0.8rem; padding: 1.2rem 3.5rem; border-radius: 3rem; font-size: 1.8rem; font-weight: 700; color: #fff; margin-bottom: 0; background: var(--primary2); z-index: 2;}
.branch_title::after {content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); width: 1px; height: 2.5rem; background: #bbb; z-index: -1;}
.branch_title span {font-size: 2rem; color: #fff;}

.branch_depts {display: flex; gap: 2rem; width: 100%; justify-content: center; margin-top: 4.4rem;}
.dept_card {background: #fff; padding: 3rem 2.5rem; border-radius: 1rem; border: 1px solid #ddd; flex: 1; min-width: 25rem; position: relative; z-index: 2;}
.dept_card::before {content: ''; position: absolute; top: -2rem; left: 50%; transform: translateX(-50%); width: 1px; height: 2rem; background: #bbb;}
.dept_card::after {content: ''; position: absolute; top: -2rem; height: 1px; background: #bbb;}
.dept_card:first-child::after {left: 50%; width: calc(50% + 1.5rem);}
.dept_card:last-child::after {right: 50%; width: calc(50% + 1.5rem);}
.dept_card:not(:first-child):not(:last-child)::after {left: -1.5rem; width: calc(100% + 3rem);}

.dept_head {display: flex; align-items: center; gap: 1.5rem; margin-bottom: 2.5rem; border-bottom: 1px solid #f5f5f5; padding-bottom: 2.5rem;}
.dept_head .icon {width: 4.5rem; height: 4.5rem; background: #f0f4ff; border-radius: 0.8rem; display: flex; align-items: center; justify-content: center;}
.dept_head .icon span {font-size: 2.4rem; color: #4c6ef5;}
.dept_head h4 {font-size: 1.8rem; font-weight: 700; color: #222; line-height: 1.3;}

.dept_list li {font-size: 1.4rem; color: #555; line-height: 1.6; margin-bottom: 1rem; position: relative; padding-left: 2rem; font-weight: 500;}
.dept_list li::before {content: '✓'; position: absolute; left: 0; top: 0; color: #999; font-size: 1.4rem;}
.dept_list li:last-child {margin-bottom: 0;}

@media only screen and (max-width: 1200px) {
    .org_branches {flex-direction: column; gap: 8rem;}
    .branch_depts {flex-wrap: wrap;}
    .org_top::after, .org_branch::before, .org_branch::after, .branch_title::after, .dept_card::before, .dept_card::after {display: none;}
}

@media only screen and (max-width: 768px) {
    .org_wrap {padding: 6rem 0;}
    .ceo_card {padding: 3rem; min-width: 100%;}
    .branch_depts {flex-direction: column;}
    .dept_card {min-width: 100%;}
}

@media only screen and (max-width: 1024px) {
    .history_section {flex-direction: column; gap: 8rem;}
    .history_title_area {width: 100%; position: relative; top: 0;}
    .history_title_area .left_image_box {margin-top: 3rem; max-width: 60rem;}
    .history_timeline_area {width: 100%; padding-left: 4rem;}
    .timeline_node {left: -4rem;}
}
@media only screen and (max-width: 768px) {
    .history_wrap {padding: 8rem 0;}
    .history_title_area h2 {font-size: 3.2rem;}
    .history_timeline_area {padding-left: 3rem;}
    .timeline_node {left: -3rem; width: 1.4rem; height: 1.4rem; top: 0.6rem;}
    .timeline_item {margin-bottom: 6rem;}
    .timeline_content .year {font-size: 3rem; margin-bottom: 1.5rem;}
    .timeline_content .events li {font-size: 1.6rem; padding-left: 1.2rem;}
    .timeline_content .events li::before {top: 1rem; width: 4px; height: 4px;}
    .timeline_content .image_box {margin-top: 2.5rem; border-radius: 1.2rem;}
}


/* =========================== COMPANY (회사소개) */
/* .company_hero_wrap {position: relative; z-index: 1; padding: 30rem 2rem; text-align: center; background: radial-gradient(circle at top left, #b3d9ff 0%, #89c4f4 100%); overflow: hidden; box-shadow: inset 0 0 50px rgba(0, 0, 0, 0.05);}
.hero_bg_circles {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; z-index: -1; pointer-events: none;}
.hero_bg_circles .circle_1 {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 60rem; height: 60rem; background: radial-gradient(circle at 30% 30%, #ffffff 0%, #f0f7ff 100%); border-radius: 50%; box-shadow: 0 30px 60px rgba(20, 80, 150, 0.15), inset 0 5px 15px rgba(255, 255, 255, 1); animation: bgBreath 8s ease-in-out infinite;}
.hero_bg_circles .circle_2 {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100rem; height: 100rem; background: radial-gradient(circle at 30% 30%, #eef6ff 0%, #d4e8fb 100%); border-radius: 50%; z-index: -1; box-shadow: 0 40px 80px rgba(20, 80, 150, 0.1), inset 0 5px 20px rgba(255, 255, 255, 0.8); animation: bgBreath 10s ease-in-out infinite reverse;}
.hero_bg_circles .circle_3 {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 150rem; height: 150rem; background: radial-gradient(circle at 30% 30%, #e0f0ff 0%, #c4dff8 100%); border-radius: 50%; z-index: -2; box-shadow: 0 50px 100px rgba(20, 80, 150, 0.08), inset 0 5px 25px rgba(255, 255, 255, 0.6); animation: bgBreath 12s ease-in-out infinite;}
.hero_content {position: relative; z-index: 2;}
.hero_title {font-size: 5rem; font-weight: 800; color: #222; margin-bottom: 2rem; letter-spacing: 1px;}
.hero_title .highlight_red {color: var(--primary);}
.hero_subtitle {font-size: 2.2rem; color: #444; font-weight: 500; line-height: 1.6;}

@media only screen and (max-width: 768px) {
    .company_top_section {padding: 0 1rem;}
    .company_hero_wrap {padding: 6rem 1rem;}
    .hero_bg_circles .circle_1 {width: 60vw; height: 60vw;}
    .hero_bg_circles .circle_2 {width: 100vw; height: 100vw;}
    .hero_bg_circles .circle_3 {width: 150vw; height: 150vw;}
    .hero_title {font-size: 3.2rem; margin-bottom: 1.5rem;}
    .hero_subtitle {font-size: 1.6rem; word-break: keep-all;}
}

@keyframes bgBreath {
    0% { transform: translate(-50%, -50%) scale(1); }
    50% { transform: translate(-50%, -50%) scale(1.05); }
    100% { transform: translate(-50%, -50%) scale(1); }
} */

/* Company Info Board */
/* .company_info_board {background: #ffffff; box-shadow: 0 15px 40px rgba(0, 50, 150, 0.05); max-width: 1600px; margin: -6rem auto 10rem; position: relative; z-index: 10; padding: 4rem; display: flex; flex-direction: column; gap: 4rem;}
.info_grid_top {display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem;}
.info_stat {display: flex; align-items: flex-start; gap: 1.5rem;}
.stat_icon {width: 5rem; height: 5rem; background: #f4f7fb; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0;}
.stat_icon svg {width: 2.4rem; height: 2.4rem; stroke: var(--primary, #0056b3); filter: none;}
.stat_text {display: flex; flex-direction: column; gap: 0.5rem; justify-content: center;}
.stat_label {font-size: 1.4rem; color: #888; font-weight: 500;}
.stat_value {font-size: 1.8rem; color: #222; font-weight: 700; word-break: keep-all; line-height: 1.4;}
.info_grid_bottom {display: flex; align-items: flex-start; gap: 1.5rem; padding-top: 3rem; border-top: 1px solid #f0f4f8;}
.info_grid_bottom .stat_value {font-size: 1.6rem; font-weight: 500; line-height: 1.6;}
@media only screen and (max-width: 1024px) {
    .info_grid_top {grid-template-columns: repeat(2, 1fr); gap: 3rem;}
}
@media only screen and (max-width: 768px) {
    .company_info_board {margin: 0 auto 10rem;}
    .info_grid_top {grid-template-columns: 1fr;}
    .info_grid_bottom {flex-direction: column; align-items: flex-start;}
} */



/* =========================== CEO MESSAGE (인사말) */
.ceo_message_wrap {display: flex; gap: 13rem; align-items: center;}
.ceo_img_area {flex: 1; border-radius: 2rem; overflow: hidden; box-shadow: 0 20px 40px rgba(0,0,0,0.1); position: relative; max-width: 600px;}
.ceo_img_area::before {content: ''; display: block; padding-top: 130%;}
.ceo_img_area img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease;}
.ceo_img_area:hover img {transform: scale(1.05);}

.ceo_txt_area {flex: 1.2;}
.ceo_slogan {font-size: 3.6rem; font-weight: 300; line-height: 1.4; color: #111; margin-bottom: 4rem; word-break: keep-all; position: relative; padding-top: 5rem;}
.ceo_slogan::before {content: ''; position: absolute; left: 0; top: 0; display: block; width: 31px; height: 25px; font-size: 10rem; color: var(--primary); opacity: 0.15; line-height: 1;background:url(../../images/fs/content/sub01/dot.png) left top no-repeat;}
.ceo_slogan strong {font-weight: 800; color: var(--primary2);}
.ceo_slogan span {color: var(--primary); font-weight: 600;}

.ceo_desc {font-size: 1.8rem; color: #555; line-height: 1.8; margin-bottom: 2rem; word-break: keep-all;}
.ceo_desc:last-of-type {margin-bottom: 6rem;}

.ceo_sign {text-align: right; font-size: 2.2rem; font-weight: 700; color: #222; border-top: 1px solid #eee; padding-top: 3rem;}

@media only screen and (max-width: 1200px) {
    .ceo_message_wrap {padding: 10rem 2rem;}
    .ceo_slogan {font-size: 3.2rem;}
}
@media only screen and (max-width: 1024px) {
    .ceo_message_wrap {flex-direction: column; gap: 6rem;}
    .ceo_img_area {width: 100%; max-width: 60rem; margin: 0 auto;}
    .ceo_img_area::before {padding-top: 70%;}
    .ceo_txt_area {width: 100%;}
}
@media only screen and (max-width: 768px) {
    .ceo_message_wrap {padding: 8rem 2rem;}
    .ceo_slogan {font-size: 2.6rem; padding-top: 3rem;}
    .ceo_slogan::before {font-size: 7rem; top: -1.5rem;}
    .ceo_desc {font-size: 1.6rem;}
    .ceo_sign {font-size: 1.8rem;}
    .ceo_sign span::after {width: 3.2rem; height: 3.2rem; font-size: 1.4rem;}
}

/* =========================== ESG (ESG경영) 스플릿 스크린 구조 */
.esg_split_container {display:flex; position:relative; width:100%; min-height:100vh; margin:0 auto; padding:0; align-items:flex-start; background:#fff;}

/* 좌측 고정 (Sticky) */
.split_left {width:45%; position:sticky; top:0; height:100vh; display:flex; flex-direction:column; justify-content:center; padding:5rem 5rem 5rem 0; z-index:10;}
.split_left .sticky_content {max-width:500px;}
.split_left .esg_sub_tit {font-size:1.8rem; font-weight:800; color:var(--primary); margin-bottom:2rem; display:inline-block; text-transform:uppercase; letter-spacing:2px;}
.split_left .esg_tit {font-size:4.8rem; font-weight:800; color:#111; line-height:1.2; margin-bottom:3rem; letter-spacing:-0.05em;}
.split_left .esg_desc {font-size:1.8rem; color:#666; line-height:1.7; word-break:keep-all;}

/* 우측 스크롤 (Normal Flow Panels) */
.split_right {width:55%; position:relative; padding-bottom:10rem; padding-top:5vh;}
.esg_panel {display:flex; flex-direction:column; justify-content:center; padding:0; position:relative; background:transparent; z-index:1; border-top:none; margin-bottom:12rem;}
.esg_panel:last-child {margin-bottom:0;}

.esg_panel .panel_img {width:100%; aspect-ratio:4/3; border-radius:3rem; overflow:hidden; box-shadow:0 30px 60px rgba(0,0,0,0.1); margin-bottom:4rem; transform:translateZ(0);}
.esg_panel .panel_img img {width:100%; height:100%; object-fit:cover;}
.esg_panel .panel_txt {padding:0 2rem;}
.esg_panel .tit {display:inline-block; font-size:1.8rem; font-weight:800; color:var(--primary); margin-bottom:1.5rem; letter-spacing:1px; text-transform:uppercase;}
.esg_panel .sub_tit {display:block; font-size:3.2rem; font-weight:800; color:#111; margin-bottom:2rem; letter-spacing:-0.05em;}
.esg_panel .desc {font-size:1.8rem; color:#666; line-height:1.7; word-break:keep-all;}

/* 메인 이미지 특별 패널 */
.main_img_panel {margin-bottom:15rem;}
.main_img_panel img {width:100%; aspect-ratio:4/5; border-radius:3rem; object-fit:cover; box-shadow:0 30px 60px rgba(0,0,0,0.15);}

/* 하단 100% 반전 메시지 패널 */
.esg_full_bottom_box {width:100%; background:#111; padding:15rem 0; position:relative; overflow:hidden; border-radius:3rem;}
.esg_full_bottom_box .bg_img {position:absolute; top:0; left:0; width:100%; height:100%; z-index:1;}
.esg_full_bottom_box .bg_img img {width:100%; height:100%; object-fit:cover; animation:autoPan 30s ease-in-out infinite alternate;}
.esg_full_bottom_box .bg_img::after {content:''; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.75);}
@keyframes autoPan {
    0% {transform: scale(1);}
    100% {transform: scale(1.15) rotate(1deg);}
}
.esg_full_bottom_box .bottom_content {max-width:1400px; margin:0 auto; padding:0 2rem; text-align:center; position:relative; z-index:2;}
.esg_full_bottom_box .bottom_content p {font-size:2.4rem; color:#fff; line-height:1.8; word-break:keep-all; margin-bottom:2rem; opacity:0.9;}
.esg_full_bottom_box .bottom_content p:last-child {margin-bottom:0;}
.esg_full_bottom_box .bottom_content p strong {font-weight:800; color:var(--primary); font-size:2.8rem;}



/* =========================== Contact Us (연락처) =========================== */
.contact_intro {text-align:center; margin-bottom:8rem;}
.contact_intro .sub_badge {display:inline-block; font-size:1.6rem; font-weight:800; color:var(--primary); background:rgba(0,102,255,0.08); padding:0.8rem 2.5rem; border-radius:5rem; margin-bottom:2rem; text-transform:uppercase; letter-spacing:1px;}
.contact_intro .title {font-size:4rem; font-weight:800; color:#111; margin-bottom:2rem; letter-spacing:-0.05em; word-break:keep-all; line-height:1.3;}
.contact_intro .desc {font-size:1.8rem; color:#666; line-height:1.6; word-break:keep-all;}

.contact_grid {display:grid; grid-template-columns:repeat(4, 1fr); gap:2rem;}

.contact_card {background:#f4f6f8; border-radius:3rem; padding:5rem 3rem; text-align:center; transition:background-color 0.3s ease;}
.contact_card:hover {background:#ebf0f5;}
.contact_card.domestic {background:#111;}
.contact_card.domestic:hover {background:#222;}

.contact_card .card_head {margin-bottom:4rem;}
.contact_card .card_head .icon {font-size:4.8rem; color:#111; margin-bottom:1.5rem;}
.contact_card.domestic .card_head .icon {color:#fff;}
.contact_card .card_head .part {font-size:2.2rem; font-weight:800; color:#111;}
.contact_card.domestic .card_head .part {color:#fff;}

.contact_card .card_body {}
.contact_card .person {margin-bottom:3rem;}
.contact_card .person .label {display:block; font-size:1.4rem; color:#666; margin-bottom:0.5rem;}
.contact_card.domestic .person .label {color:#999;}
.contact_card .person .name {display:block; font-size:3rem; font-weight:800; color:#111; letter-spacing:-1px;}
.contact_card.domestic .person .name {color:#fff;}

.contact_card .info_list {display:flex; flex-direction:column; gap:1rem;}
.contact_card .info_item {display:flex; align-items:center; justify-content:center; gap:0.8rem; padding:1.5rem 2rem; background:#fff; border-radius:5rem; text-decoration:none; transition:all 0.2s ease;}
.contact_card .info_item:hover {background:var(--primary); transform:translateY(-2px);}
.contact_card.domestic .info_item {background:#333;}
.contact_card.domestic .info_item:hover {background:var(--primary);}
.contact_card .info_item .material-symbols-outlined {font-size:2rem; color:#111; transition:all 0.2s ease;}
.contact_card.domestic .info_item .material-symbols-outlined {color:#fff;}
.contact_card .info_item:hover .material-symbols-outlined {color:#fff;}
.contact_card .info_item .txt {font-size:1.5rem; font-weight:600; color:#111; transition:all 0.2s ease; word-break:break-all;}
.contact_card.domestic .info_item .txt {color:#fff;}
.contact_card .info_item:hover .txt {color:#fff;}

/* 모바일 반응형 */
@media only screen and (max-width:1200px) {
    .contact_grid {grid-template-columns:repeat(2, 1fr); gap:2rem;}
}
@media only screen and (max-width:1024px) {
    .esg_split_container {flex-direction:column; display:block;}
    .split_left {width:100%; position:relative; height:auto; padding:8rem 2rem 4rem; text-align:center; z-index:1;}
    .split_left .sticky_content {max-width:100%; margin:0 auto;}
    .split_left .esg_tit {font-size:3.6rem;}
    .split_left .esg_desc {word-break:keep-all; line-height:1.6;}
    
    .split_right {width:100%; padding:0;}
    .esg_panel {min-height:auto; padding:0; position:relative; top:auto; border-top:none; margin-bottom:8rem;}
    .esg_panel .panel_img {aspect-ratio:3/2; margin-bottom:3rem; border-radius:2rem;}
    .esg_panel .panel_txt {padding:0 2rem;}
    
    .main_img_panel {min-height:auto; padding-top:0; margin-bottom:6rem; padding:0 2rem;}
    .main_img_panel img {aspect-ratio:3/2; border-radius:2rem;}
    
    .esg_full_bottom_box {padding:8rem 0; margin-top:10rem;}
    .esg_full_bottom_box .bottom_content {padding:0 2rem;}
    .esg_full_bottom_box .bottom_content p {font-size:2rem;}

    .contact_wrap {padding:8rem 0 10rem;}
    .contact_intro {margin-bottom:6rem;}
    .contact_intro .title {font-size:3.2rem;}
}
@media only screen and (max-width:768px) {
    .split_left .esg_tit {word-break:keep-all;}
    .esg_panel .sub_tit {word-break:keep-all;}
    .esg_panel .desc {word-break:keep-all;}
    .esg_panel .panel_img {aspect-ratio:4/3;}
    .main_img_panel img {aspect-ratio:4/3;}
    
    .contact_grid {grid-template-columns:1fr;}
    .contact_intro .title {font-size:2.6rem;}
    .contact_intro .desc {font-size:1.6rem;}
    
    .esg_full_bottom_box {padding:6rem 0;}
}

/* =========================== Product Detail (제품 공통 템플릿) =========================== */
/* 1. 상단 모델 탭 (Pill 형태 태그 방식) */
.product_tabs {margin-bottom:12rem;}
.product_tabs .tab_list {display:flex; flex-wrap:wrap; justify-content:center; gap:1rem; list-style:none; padding:0; margin:0;}
.product_tabs .tab_item {flex:none; display:flex;}
.product_tabs .tab_item a {display:flex; align-items:center; justify-content:center; width:100%; padding:1.2rem 2.5rem; font-size:1.6rem; font-weight:600; color:#666; background:#fff; border:1px solid #ddd; border-radius:5rem; text-align:center; text-decoration:none; transition:all 0.3s ease; word-break:keep-all; box-sizing:border-box;}
.product_tabs .tab_item.active a {color:#fff; background:var(--primary); border-color:var(--primary); font-weight:700; box-shadow:0 4px 12px rgba(0,102,255,0.2);}
.product_tabs .tab_item:hover a {border-color:var(--primary); color:var(--primary);}
.product_tabs .tab_item.active:hover a {color:#fff;}

/* 2. 제품 타이틀 영역 */
.product_hero {margin-bottom:8rem; text-align:center;}
.product_hero .category {display:inline-block; font-size:1.6rem; font-weight:800; color:var(--primary); margin-bottom:1.5rem; letter-spacing:1px; text-transform:uppercase; padding:0.6rem 2rem; background:rgba(0,102,255,0.08); border-radius:5rem;}
.product_hero .title {font-size:5rem; font-weight:800; color:#111; letter-spacing:-1px; line-height:1.2; word-break:keep-all;}

/* 3. 좌우 스플릿 레이아웃 */
.product_split {display:flex; gap:8rem; align-items:flex-start;}

/* 좌측 비주얼 (Sticky) */
.prod_visual {width:45%; position:sticky; top:120px;}
.prod_visual .img_box {background:#fff; border:1px solid #eaeaea; box-shadow:0 15px 40px rgba(0,0,0,0.04); border-radius:4rem; padding:4rem; text-align:center; position:relative; display:flex; align-items:center; justify-content:center; box-sizing:border-box;}
.prod_visual .img_box img {max-width:100%; max-height:650px; width:auto; object-fit:contain; transition:transform 0.5s ease;}
.prod_visual .img_box:hover img {transform:scale(1.03);}

/* 우측 스펙 상세 */
.prod_specs {width:55%; padding-top:2rem;}
.prod_specs .spec_group {margin-bottom:7rem;}
.prod_specs .spec_group:last-child {margin-bottom:0;}
.prod_specs .spec_group .grp_tit {font-size:2.4rem; font-weight:800; color:#111; margin-bottom:3rem; padding-bottom:1.5rem; border-bottom:2px solid #111; display:flex; align-items:center; gap:1rem; letter-spacing:-0.5px;}

.prod_specs .spec_list {list-style:none; padding:0; margin:0;}
.prod_specs .spec_list li {display:flex; align-items:flex-start; margin-bottom:2rem; font-size:1.7rem; color:#555; line-height:1.6; word-break:keep-all;}
.prod_specs .spec_list li:last-child {margin-bottom:0;}
.prod_specs .spec_list li::before {content:""; display:inline-block; width:6px; height:6px; background:var(--primary); border-radius:50%; margin-top:10px; margin-right:1.5rem; flex-shrink:0;}
.prod_specs .spec_list li strong {font-weight:700; color:#111; margin-right:2rem; width:220px; flex-shrink:0;}
.prod_specs .spec_list li span {flex:1;}

/* 모바일 반응형 추가 (Product) */
@media only screen and (max-width:1200px) {
    .product_split {gap:5rem;}
    .prod_visual {width:40%;}
    .prod_specs {width:60%;}
    .prod_specs .spec_list li strong {width:180px;}
}
@media only screen and (max-width:1024px) {
    .product_split {flex-direction:column; gap:6rem;}
    .prod_visual {width:100%; position:relative; top:0;}
    .prod_visual .img_box {padding:4rem 2rem;}
    .prod_specs {width:100%; padding-top:0;}
    .product_hero .title {font-size:3.6rem;}
}
@media only screen and (max-width:768px) {
    .product_hero .title {font-size:3rem;}
    .product_hero .category {font-size:1.6rem;}
    .product_tabs {margin-bottom:6rem;}
    .product_tabs .tab_list {gap:0.8rem;}
    .product_tabs .tab_item {flex:1 1 calc(33.333% - 0.8rem);}
    .product_tabs .tab_item a {font-size:1.4rem; padding:1.2rem 1rem;}
}
@media only screen and (max-width:480px) {
    .product_tabs .tab_item {flex:1 1 calc(50% - 0.8rem);}
    
    .prod_specs .spec_list li {flex-direction:column; position:relative; padding-left:1.5rem;}
    .prod_specs .spec_list li::before {display:none;}
    .prod_specs .spec_list li::after {content:""; position:absolute; left:0; top:12px; width:4px; height:4px; background:var(--primary); border-radius:50%;}
    .prod_specs .spec_list li strong {margin-bottom:0.5rem; width:100%; color:#111;}
}



/* 중국어 */
[lang="zh"] * {word-break: break-all;}