@charset "utf-8";

/* =========================== SUB */
#shSubBnr{position:relative}
#shSubBnr p{overflow:hidden;position:relative;z-index:1;max-width:1400px;width:100%;margin:60px auto 0;font-size:46px;font-weight:600;color:#222;font-family:'Montserrat', 'Escoredream', sans-serif}
#shSubBnr p span{opacity:0;position:relative;bottom:-46px}
#shSubBnr .bg{height:350px;background:center no-repeat;background-size:cover;border-radius: 10px;margin:-20px 20px 0 120px;}


@media(max-width:1549px){
    #shSubBnr .bg{margin:-20px 20px 0 20px;}
}
@media(max-width:1380px){
    #shSubBnr p{padding:0 20px}
}
@media(max-width:1024px){
    #shSubBnr{background:#111}
    #shSubBnr p{position:absolute;left:50%;top:50%;z-index:10;transform:translate(-50%,-50%);width:max-content;margin:-3rem 0 0 0;font-size:32px;color:#fff}
    #shSubBnr .bg{opacity:.65;height:260px;margin:0;border-radius: 0;}
}
@media(max-width:900px){
    #shSubBnr p{margin:-1rem 0 0 0;}
    #shSubBnr .bg{height:350px;margin:0;border-radius: 0;}
}
@media(max-width:768px){
    #shSubBnr .bg{height:280px;}
}
@media(max-width:480px){
    #shSubBnr .bg{height:240px;}
}

/* =========================== SNB */
#shSnb ul{display:flex}
#shSnb ul li+li:before{display:inline-block;content:"";width:1px;height:13px;margin:0 20px;background:#d4d4d4}
#shSnb ul li a{font-size:17px;font-weight:500;color:#999}
#shSnb ul li.on a{position:relative;color:var(--primary)}
#shSnb ul li.on a:after{display:block;content:"";position:absolute;left:0;bottom:-15px;width:100%;height:4px;background:var(--primary)}


/****************/
/* 컨텐츠 */
/****************/
/* 공통 */
/* 준비중 */
.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 {width: 1400px;margin: 0 auto;}
@media only screen and (max-width:1399px){
    .wrap {width: auto;padding:0 4rem;}
}
@media only screen and (max-width:480px){
    .wrap {width: auto;padding:0 1.5rem;}
}

.flexbox {display:flex;}
.line_box {border:1px solid #ddd;padding:3rem;}



/* 사이트맵 */
.sitemap {}
/* 첫번째 */
.sitemap > ul {display: flex;flex-direction: column;gap:2rem;}
.sitemap > ul > li {display: flex;gap:2rem;border:2px solid #e2e5ed;padding:3rem 4rem;border-radius: 1rem;}
.sitemap > ul > li > a {line-height:1.5;flex-shrink:0;width: 20rem;border-right:1px solid #e2e5ed;font-size:2.6rem;font-weight: 700;color:var(--primary);transition: 0.4s;}
.sitemap > ul > li > a:hover {color:var(--primary2);}
/* 두번째 */
.sitemap > ul > li > ul {display: flex;flex-wrap: wrap;gap:3rem 2rem;flex-grow: 1;}
.sitemap > ul > li > ul > li {width: calc(33.3% - 2rem);}
.sitemap > ul > li > ul > li > a {font-size:1.8rem;font-weight: 600;color:#222;transition: 0.4s;}
.sitemap > ul > li > ul > li > a:hover {color:var(--primary2);}
/* 세번째 */
.sitemap > ul > li > ul > li > ul {margin-top:1rem;background: #f6f7fb;padding:3rem 2.5rem;border-radius: 1rem;}
.sitemap > ul > li > ul > li > ul > li {padding-top:2rem;margin-top:2rem;border-top:1px solid #ddd;}
.sitemap > ul > li > ul > li > ul > li:first-child {border-top:0;padding-top:0;margin-top:0;}
.sitemap > ul > li > ul > li > ul > li > a {font-weight: 500;font-size:1.8rem;color:#222;transition: 0.4s;}
.sitemap > ul > li > ul > li > ul > li > a:hover {color:var(--primary2);}
/* 네번째 */
.sitemap > ul > li > ul > li > ul > li > ul {margin:1rem 0;padding:1.5rem 1rem;background: #fff;border-radius: 1rem;box-shadow: 2px 2px 10px rgba(0,0,0,0.02);}
.sitemap > ul > li > ul > li > ul > li > ul > li {padding:0.4rem 1.4rem 0.4rem 1rem;transition: 0.4s;}
.sitemap > ul > li > ul > li > ul > li > ul > li:hover {padding:0.4rem 1.4rem 0.4rem 0.4rem;}
.sitemap > ul > li > ul > li > ul > li > ul > li > a {position:relative;font-weight: 400;font-size:1.6rem;color:#616161;display: block;padding-left:1rem;}
.sitemap > ul > li > ul > li > ul > li > ul > li > a:before {content:"";position:absolute;left:0;top:1rem;display: block;width: 3px;height: 3px;background: #222;vertical-align: middle;border-radius: 100%;margin-top:-2px;}
@media only screen and (max-width:1199px){
    .sitemap > ul > li {padding:2.5rem 2rem;}
    .sitemap > ul > li > a {width: 18rem;}
}
@media only screen and (max-width:1023px){
    .sitemap > ul > li {flex-direction: column;}
    .sitemap > ul > li > a {width: 100%;border-right:0;border-bottom:1px solid #e2e5ed;padding-bottom:1.6rem;}
    .sitemap > ul > li > ul {gap:2rem 2rem;}
}
@media only screen and (max-width:767px){
    .sitemap > ul > li > ul > li {width: calc(50% - 2rem);}
}
@media only screen and (max-width:539px){
    .sitemap > ul > li > ul > li {width: 100%;}
}


/* ===========================
   인사말 (Attached Image Style)
   =========================== */
.greeting_wrap_style2 {max-width: 140rem;margin: 0 auto;display: flex;gap: 5rem;align-items: stretch;}
.greeting_wrap_style2 .greet_left {flex: 1;padding-right: 2rem;display: flex;flex-direction: column;justify-content: center;}
.greeting_wrap_style2 .main_title {font-size: 5.6rem;font-weight: 800;color: var(--primary);line-height: 1.1;margin-bottom: 2rem;letter-spacing: -0.15rem;font-family: 'Montserrat', sans-serif;}
.greeting_wrap_style2 .main_title span {color:var(--accent);font-family: 'Montserrat', sans-serif;font-size: 4.6rem;}
.greeting_wrap_style2 .main_title span.font_eng {color:var(--primary);font-family: 'Montserrat', sans-serif;font-size: 4.6rem;}
.greeting_wrap_style2 .sub_title {font-size: 2.8rem;font-weight: 700;color: #222;line-height: 1.4;margin-top: 8rem;margin-bottom: 4rem;letter-spacing: -0.05rem;}
.greeting_wrap_style2 .greet_text {font-size: 1.6rem;color: #666;line-height: 1.8;margin-bottom: 6rem;word-break: keep-all;}
.greeting_wrap_style2 .greet_text p {margin-bottom: 2.5rem;}
.greeting_wrap_style2 .greet_text p:last-child {margin-bottom: 0;}
.greeting_wrap_style2 .greet_sign {font-size: 1.8rem;color: #222;margin-top: auto;}
.greeting_wrap_style2 .greet_sign span {font-weight: 500;/*margin-right: 1rem;*/}
.greeting_wrap_style2 .greet_sign > span {margin-right: 1rem;}
.greeting_wrap_style2 .greet_sign strong {font-weight: 800;font-size: 2.4rem;}
.greeting_wrap_style2 .greet_right {width: 50%;display: flex;gap: 2rem;align-items: flex-end;}
.greeting_wrap_style2 .img_box_main {flex: 7;overflow: hidden;}
.greeting_wrap_style2 .img_box_main img {width: 100%;height: 100%;object-fit: cover;display: block;min-height: 50rem;}
.greeting_wrap_style2 .img_box_sub {flex: 3;overflow: hidden;background: linear-gradient(135deg, var(--primary) 0%, var(--primary2) 100%);min-height: 50rem;position: relative;}
.greeting_wrap_style2 .img_box_sub::after {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0.3;mix-blend-mode: overlay;}
.greeting_wrap_style2 .parallax_item {will-change: transform; transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);}
@media(max-width: 1200px) {
    .greeting_wrap_style2 {gap: 3rem;}
    .greeting_wrap_style2 .main_title {font-size: 4.8rem;}
    .greeting_wrap_style2 .sub_title {font-size: 2.4rem;}
}

@media(max-width: 1024px) {
    .greeting_wrap_style2 {flex-direction: column;}
    .greeting_wrap_style2 .sub_title {margin-top: 4rem;margin-bottom: 2rem;}
    .greeting_wrap_style2 .greet_right {width: 100%;margin-top: 4rem;}
    .greeting_wrap_style2 .img_box_main img, .greeting_wrap_style2 .img_box_sub {min-height: 40rem;}
}

@media(max-width: 768px) {
    .greeting_wrap_style2 {padding: 4rem 2rem;}
    .greeting_wrap_style2 .main_title {font-size: 3.6rem;margin-bottom: 4rem;}
    .greeting_wrap_style2 .sub_title {font-size: 2rem;}
    .greeting_wrap_style2 .greet_text {font-size: 1.5rem;margin-bottom: 4rem;}
    .greeting_wrap_style2 .greet_right {gap: 1rem;}
    .greeting_wrap_style2 .img_box_main {flex: 1;}
    .greeting_wrap_style2 .img_box_sub {display: none;}
    .greeting_wrap_style2 .img_box_main img {min-height: 30rem;}
}


/* ===========================
   회사개요 (Company Overview)
   =========================== */
.overview_wrap { padding: 10rem 0; font-family: 'Montserrat', 'Escoredream', sans-serif; }

/* Top Header */
.overview_top { margin-bottom: 8rem; }
.overview_top .top_header { margin-bottom: 7rem; text-align: center; display: flex; flex-direction: column; align-items: center; }
.overview_top .top_header h2 { font-size: 5.5rem; font-weight: 800; color: #111; margin-bottom: 2rem; letter-spacing: -2px; line-height: 1.2; }
.overview_top .top_header h2 span { display: inline-block; transform: translateY(6px); font-size: 4.5rem; font-family: 'Montserrat', sans-serif; }
.overview_top .top_header p { font-size: 1.8rem; color: #555; line-height: 1.7; word-break: keep-all; font-weight: 400; }

/* Core Values (Cards) */
.core_values { display: flex; justify-content: center; gap: 3rem; flex-wrap: wrap; }
.val_wrap { flex: 1; min-width: 300px; display: flex; }
.val_item { width: 100%; background: #fff; padding: 6rem 4rem; text-align: center; border: 1px solid #eee; border-top: 4px solid var(--primary); transition: all 0.4s ease; }
.val_item:hover { border-top-color: var(--accent); box-shadow: 0 20px 40px rgba(14,36,75,0.1); transform: translateY(-5px); }
.val_item .icon { width: 90px; height: 90px; margin: 0 auto 3rem; background: var(--wm5); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 4rem; color: var(--primary); transition: all 0.4s ease; }
.val_item:hover .icon { background: var(--accent); color: #fff; }
.val_item strong { display: block; font-size: 3.2rem; font-weight: 800; color: var(--primary); margin-bottom: 1.5rem; font-family: 'Montserrat', 'Escoredream', sans-serif; transition: color 0.4s ease; }
.val_item:hover strong { color: var(--accent); }
.val_item .en_desc { font-size: 1.8rem; font-weight: 500; color: #888; margin-bottom: 2rem; font-family: 'Montserrat', sans-serif; }
.val_item .kr_desc { font-size: 1.6rem; color: #555; line-height: 1.6; word-break: keep-all; font-family: 'Escoredream', sans-serif; }

/* Company Info (Grid instead of Table, No rounding) */
.overview_info { border: 1px solid #eee; }
.info_header { background: var(--primary); padding: 4rem 5rem; position: relative; overflow: hidden; }
.info_header::before { content: ""; position: absolute; top: 0; right: 0; width: 40%; height: 100%; background: linear-gradient(90deg, transparent, var(--accent)); opacity: 0.15; }
.info_header h3 { position: relative; z-index: 1; font-size: 3.2rem; font-weight: 800; color: #fff; margin-bottom: 1rem; font-family: 'Montserrat', 'Escoredream', sans-serif; }
.info_header h3 span { display: inline-block; transform: translateX(5px); font-size: 2.5rem; font-family: 'Montserrat', sans-serif; }
.info_header p { position: relative; z-index: 1; font-size: 1.6rem; color: rgba(255,255,255,0.7); }

.info_grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: #eee; }
.info_box { padding: 4rem 5rem; background: #fff; }
.info_box.full { grid-column: 1 / -1; }
.info_box h4 { font-size: 2rem; font-weight: 700; color: var(--primary); margin-bottom: 1.5rem; }
.info_box p { font-size: 1.6rem; color: #555; line-height: 1.7; margin-bottom: 0.5rem; word-break: keep-all; }
.info_box p:last-child { margin-bottom: 0; }
.info_box p strong { font-weight: 600; color: #222; display: inline-block; min-width: 80px; }

/* Responsive */
@media(max-width: 1024px) {
    .overview_wrap { padding: 8rem 2rem; }
    .val_item { min-width: 45%; padding: 4rem 3rem; }
    .info_header { padding: 3rem; }
    .info_box { padding: 3rem; }
}
@media(max-width: 768px) {
    .overview_top .top_header h2 { font-size: 3.2rem; }
    .core_values { gap: 2rem; }
    .val_item { min-width: 100%; padding: 4rem 2rem; }
    .info_grid { grid-template-columns: 1fr; }
    .info_box.full { grid-column: 1; }
}


/* ===========================
   연혁 (History)
   =========================== */
.history_wrap { font-family: 'Montserrat', 'Escoredream', sans-serif; color: #211922; margin-top:10rem; }
.history_era { display: flex; align-items: center; margin-bottom: 4rem; position: sticky; top: 90px; z-index: 10; background: #fff; padding: 1.5rem 0; }
.history_era::after { content: ""; position: absolute; top: 100%; left: 0; width: 100%; height: 50px; background: linear-gradient(to bottom, #fff 0%, rgba(255,255,255,0) 100%); pointer-events: none; }
.era_badges { display: flex; margin-right: 3rem; }
.badge_step { display: flex; align-items: center; background: var(--accent, #e60023); color: #fff; padding: 0 4.5rem 0 3rem; font-size: 1.8rem; font-weight: 800; clip-path: polygon(0 0, 100% 0, 75% 100%, 0% 100%); margin-right: -3rem; position: relative; z-index: 2; }
.badge_year { background: var(--primary, #0b1a30); color: #ffffff; padding: 1.5rem 5rem 1.5rem 6rem; font-size: 2.8rem; font-weight: 800; clip-path: polygon(15% 0, 100% 0, 100% 100%, 0% 100%); position: relative; z-index: 1; margin-right: 2rem;}
.era_title { font-size: 3.6rem; font-weight: 800; color: #211922; letter-spacing: -1.5px; }

.history_era_group:last-child .history_list{margin-bottom:0;}
.history_list { border-top: 1px solid #e5e5e0; margin-bottom: 8rem; position: relative; z-index: 1; }
.history_item { display: flex; border-bottom: 1px solid #e5e5e0; }
.year_col { width: 280px; padding: 5rem 0; font-size: 3rem; font-weight: 800; color: var(--accent); position: sticky; top: 220px; align-self: flex-start; }
.event_col { flex: 1; padding: 6rem 0 5rem 0; }
.event_col ul { list-style: none; padding: 0; margin: 0; }
.event_col li { font-size: 1.6rem; color: #211922; margin-bottom: 1.8rem; display: flex; align-items: center; gap: 1.2rem; line-height: 1.6; }
.event_col li:last-child { margin-bottom: 0; }
.event_col li i { color: var(--accent, #e60023); font-size: 2rem; margin-top: 0.2rem; flex-shrink: 0; }
.event_col li span { display: flex; align-items: flex-start; }
.event_col li strong { display: inline-block; width: 4.5rem; color: var(--primary, #0b1a30); font-weight: 800; font-family: 'Montserrat', 'Escoredream', sans-serif; flex-shrink: 0; }

/* Responsive History */
@media (max-width: 1024px) {
    .history_wrap { padding: 6rem 2rem; }
    .history_era { flex-direction: column; align-items: flex-start; gap: 2rem; margin-bottom: 3rem; position: static; background: transparent; padding: 0; }
    .history_era::after { display: none; }
    .era_badges { margin-right: 0; }
    .era_title { font-size: 2.8rem; }
    .history_item { flex-direction: column; }
    .year_col { width: 100%; padding: 4rem 0 1rem; font-size: 2.4rem; position: static; }
    .event_col { padding: 1rem 0 4rem; }
}
@media (max-width: 767px) {
    .badge_step { padding: 1.2rem 3.5rem 1.2rem 2rem; font-size: 1.5rem; margin-right: -2.5rem; }
    .badge_year { padding: 1.2rem 3rem 1.2rem 4rem; font-size: 2.2rem; }
    .era_title { font-size: 2.6rem; }
    .year_col { padding: 2rem 0 1rem; font-size: 2.4rem; }
    .event_col li { font-size: 1.5rem; }
}


/* ===========================
   조직도 (Org Chart)
   =========================== */
.org_wrap { font-family: 'Montserrat', 'Escoredream', sans-serif; }
.org_tree { display: flex; justify-content: center; min-width: 900px; padding: 2rem; margin: 0 auto; }
.org_tree ul { position: relative; display: flex; justify-content: center; padding-top: 4rem; }
.org_tree ul::before {
    content: ''; position: absolute; top: 0; left: calc(50% - 1px);
    border-left: 2px solid #cbd5e1; width: 0; height: 4rem;
}
.org_tree > ul { padding-top: 0; }
.org_tree > ul::before { display: none; }
.org_tree li { position: relative; padding: 4rem 1rem 0 1rem; text-align: center; }

.org_tree li::before, .org_tree li::after {
    content: ''; position: absolute; top: 0; right: 50%;
    border-top: 2px solid #cbd5e1; width: 50%; height: 4rem;
}
.org_tree li::after { right: auto; left: 50%; border-left: 2px solid #cbd5e1; }
.org_tree li:only-child::after, .org_tree li:only-child::before { display: none; }
.org_tree li:only-child { padding-top: 0; }
.org_tree li:first-child::before, .org_tree li:last-child::after { border: 0 none; }
.org_tree li:last-child::before { border-right: 2px solid #cbd5e1; border-radius: 0; }
.org_tree li:first-child::after { border-radius: 0; }

/* The Nodes */
.org_node {
    display: inline-block;
    padding: 1.5rem 3rem;
    background: #fff;
    border: 2px solid var(--primary);
    border-radius: 0;
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--primary);
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    position: relative;
    z-index: 2;
    min-width: 16rem;
    transition: all 0.3s ease;
}
.org_node:hover {
    background: var(--primary); color: #fff;
    transform: translateY(-5px); box-shadow: 0 10px 20px rgba(14,36,75,0.15);
}

.org_node.ceo {
    width: 16rem; height: 16rem; border-radius: 50%;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    font-size: 2.2rem; padding: 0; margin: 0 auto;
    background: var(--primary); color: #fff;
    border: 5px solid var(--accent);
    box-shadow: 0 10px 25px rgba(14,36,75,0.2);
}
.org_node.ceo::before {
    content: '';
    display: block;
    width: 65%;
    height: 2.5rem;
    background: url('../../images/fs/layout/logo.png') no-repeat center / contain;
}
.org_node.ceo:hover { background: var(--accent); border-color: var(--primary); }

.org_node.division { background: #f8fafc; border-color: #94a3b8; color: #334155; border-radius: 0; }
.org_node.division:hover { background: var(--primary); color: #fff; border-color: var(--primary); }

.org_node.sub { background: #f8fafc; border-color: #cbd5e1; color: #64748b; font-weight: 500; box-shadow: none; }
.org_node.sub:hover { background: #e2e8f0; border-color: #94a3b8; color: #334155; transform: none; }

.staff_container {
    display: flex; justify-content: space-between; width: 52rem; margin: 0 auto; position: relative;
}
.staff_container::before {
    content: ''; position: absolute; top: 50%; left: 0; right: 0;
    height: 2px; background: #cbd5e1; z-index: 1;
}
.staff_container::after {
    content: ''; position: absolute; top: 0; bottom: 0; left: calc(50% - 1px);
    width: 2px; background: #cbd5e1; z-index: 1;
}
.org_node.staff { border-color: var(--accent); color: var(--accent); border-radius: 0; }
.org_node.staff:hover { background: var(--accent); color: #fff; }

/* Responsive Vertical Tree */
@media (max-width: 1024px) {
    .org_wrap { padding: 6rem 2rem; overflow-x: hidden; }
    .org_tree { display: block; min-width: 0; padding: 0; }

    /* Reset all ul margins, only Level 2 gets the CEO center offset */
    .org_tree ul { display: block; padding-top: 0; margin-left: 0; }
    .org_tree > ul > li > ul { margin-left: 5.0rem; }

    /* Base padding for all nodes */
    .org_tree li { display: block; padding: 3rem 0 0 3.0rem; text-align: left; position: relative; }
    .org_tree > ul > li { padding-left: 0; } /* root li no indent */

    /* Remove horizontal tree elements */
    .org_tree ul::before, .org_tree li::before, .org_tree li::after,
    .staff_container::before, .staff_container::after { display: none !important; }

    /* Vertical lines drop from the left edge of the parent container */
    .org_tree ul ul li::after {
        content: ''; display: block !important;
        position: absolute; top: 0; left: 0;
        width: 2px; height: 100%; background: #cbd5e1; border: none !important;
    }
    .org_tree ul ul li:last-child::after { height: 6.2rem; }

    /* Horizontal branch */
    .org_tree ul ul li::before {
        content: ''; display: block !important;
        position: absolute; top: 6.2rem; left: 0;
        width: 3.0rem; height: 2px; background: #cbd5e1;
        border: none !important; border-radius: 0;
    }

    .org_node { min-width: 0; width: 100%; padding: 2rem; text-align: left; display: flex; align-items: center; justify-content: flex-start; }
    .org_node.ceo { margin: 0; width: 15rem; height: 15rem; justify-content: center; }

    /* Staff container has 2 nodes, space them and add a branch for the second node */
    .staff_container { display: flex; flex-direction: column; width: 100%; gap: 3rem; margin: 0 0 4rem 0; position: relative; }
    .staff_container .org_node.staff { max-width: 100%; margin: 0; }

    /* Vertical trunk line through staff_container */
    .staff_container::before {
        content: ''; display: block !important;
        position: absolute; top: 3.2rem; bottom: -4rem; left: -3.0rem;
        width: 2px; height: auto; background: #cbd5e1; border: none !important;
    }

    /* Branch for the second node in staff_container (경영기획) */
    .staff_container::after {
        content: ''; display: block !important;
        position: absolute; top: 12.6rem; left: -3.0rem;
        width: 3.0rem; height: 2px; background: #cbd5e1; border: none !important;
    }

    /* ALIGN 사업부 WITH ESG & T and 경영기획 */
    .org_tree > ul > li > ul > li > ul {
        margin-left: -3.0rem;
    }
}

/* Compact Vertical Tree for Mobile */
@media (max-width: 767px) {
    .org_wrap { padding: 4rem 2rem; }

    .org_tree > ul > li > ul { margin-left: 4.0rem; }

    .org_tree li { padding-left: 2.0rem; padding-top: 2rem; }
    .org_tree > ul > li { padding-left: 0; }

    /* Adjust branches */
    .org_tree ul ul li::before { width: 2.0rem; top: 4.6rem; }
    .org_tree ul ul li:last-child::after { height: 4.6rem; }

    .org_node.ceo { width: 13rem; height: 13rem; }

    .staff_container { gap: 2rem; margin-bottom: 3rem; }
    .staff_container::before { left: -2.0rem; bottom: -3rem; top: 2.6rem; }
    .staff_container::after { left: -2.0rem; width: 2.0rem; top: 9.9rem; }

    .org_tree > ul > li > ul > li > ul { margin-left: -2.0rem; }

    .org_node { padding: 1.5rem 2rem; font-size: 1.5rem; }
}

/* ===========================
   비전 (Vision)
   =========================== */
.vision_wrap { font-family: 'Montserrat', 'Escoredream', sans-serif; }
.vision_scroll_container { height: 300vh; position: relative; }
.vision_sticky_box { position: sticky; top: 0; width: 100%; height: 100vh; overflow: hidden; display: flex; align-items: center; justify-content: center; background: #fff; }

.vision_bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-position: center; }

.vision_blobs_wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; filter: url('#goo'); }

.vision_text_wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; pointer-events: none; z-index: 10; }

.blob {
    position: absolute; width: 450px; height: 450px; border-radius: 50%;
    background: linear-gradient(135deg, var(--accent, #e60023), #ff4d4d);
    animation: blobWobble 6s infinite alternate ease-in-out;
}
.blob_right {
    background: linear-gradient(135deg, var(--primary, #0b1a30), #2c4a75);
    animation-delay: -3s;
}

/* Use CSS variable --p (0 to 1) updated by JS */
.blob_left { transform: translateX(calc(-25vw + (25vw * var(--p, 0)))); }
.blob_right { transform: translateX(calc(25vw - (25vw * var(--p, 0)))); }

@keyframes blobWobble {
    0% { border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%; }
    34% { border-radius: 70% 30% 50% 50% / 30% 30% 70% 70%; }
    67% { border-radius: 100% 60% 60% 100% / 100% 100% 60% 60%; }
    100% { border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%; }
}

.text_float { position: absolute; font-size: 4rem; font-weight: 800; color: #fff; text-align: center; line-height: 1.2; }
.text_float span { font-size: 3rem; font-weight: 700; opacity: 0.9; display: block; margin-top: 0.5rem; font-family:"Escoredream", sans-serif; }

.text_left { transform: translateX(calc(-25vw + (25vw * var(--p, 0)))); opacity: calc(1 - (var(--p, 0) * 1.5)); }
.text_right { transform: translateX(calc(25vw - (25vw * var(--p, 0)))); opacity: calc(1 - (var(--p, 0) * 1.5)); }

.text_merged { position: absolute; text-align: center; color: #fff; opacity: 0; transform: scale(0.8); transition: opacity 0.5s ease-out, transform 0.5s ease-out; }
.text_merged p { font-size: 2.5rem; font-weight: 400; line-height: 1.5; text-shadow: 0 6px 15px rgba(0,0,0,0.2); margin: 0; }
.text_merged strong { font-weight: 700; font-size: 4.5rem; display: block; margin-top: 1.5rem; }

.vision_sticky_box.merged .text_merged { opacity: 1; transform: scale(1); }

@media (max-width: 1024px) {
    .blob { width: 350px; height: 350px; }
    .text_float { font-size: 3rem; }
    .text_float span { font-size: 1.6rem; }
    .text_merged p { font-size: 2.2rem; }
    .text_merged strong { font-size: 3.2rem; }
}
@media (max-width: 767px) {
    .blob { width: 280px; height: 280px; }
    .blob_left { transform: translateX(calc(-35vw + (35vw * var(--p, 0)))); }
    .blob_right { transform: translateX(calc(35vw - (35vw * var(--p, 0)))); }
    .text_left { transform: translateX(calc(-35vw + (35vw * var(--p, 0)))); }
    .text_right { transform: translateX(calc(35vw - (35vw * var(--p, 0)))); }
    .text_float { font-size: 2.4rem; }
    .text_float span { font-size: 1.4rem; }
    .text_merged p { font-size: 1.8rem; }
    .text_merged strong { font-size: 2.6rem; }
}

/* 비전 특징 3단 레이아웃 */
.vision_content_wrap { padding: 8rem 2rem; font-family: 'Montserrat', 'Escoredream', sans-serif; color: #211922; }
.vision_features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; margin-bottom: 10rem; }

.vision_card {
    background: #f8f9fa; border-top: 4px solid var(--primary); padding: 5rem 4rem;
    position: relative; overflow: hidden; transition: all 0.4s ease;
    z-index: 1; box-shadow: 0 5px 15px rgba(0,0,0,0.03);
}
.vision_card::before {
    content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: var(--primary); z-index: -1; transform: translateY(100%); transition: transform 0.4s ease;
}
.vision_card:nth-child(2) { border-top-color: var(--accent); }
.vision_card:nth-child(2)::before { background: var(--accent); }

.vision_card .v_num {
    position: absolute; right: 1rem; bottom: -2rem; font-size: 15rem; font-weight: 800; font-family: 'Montserrat', sans-serif;
    color: rgba(0,0,0,0.03); line-height: 1; transition: color 0.4s ease; z-index: -1;
}
.vision_card .v_icon { font-size: 4rem; color: var(--primary); margin-bottom: 2rem; transition: color 0.4s ease; }
.vision_card:nth-child(2) .v_icon { color: var(--accent); }

.vision_card h4 { font-size: 2.4rem; font-weight: 700; line-height: 1.4; margin-bottom: 2rem; transition: color 0.4s ease; }
.vision_card p { font-size: 1.6rem; color: #555; line-height: 1.7; word-break: keep-all; transition: color 0.4s ease; }

.vision_card:hover { transform: translateY(-10px); box-shadow: 0 15px 30px rgba(0,0,0,0.1); }
.vision_card:hover::before { transform: translateY(0); }
.vision_card:hover .v_icon, .vision_card:hover h4, .vision_card:hover p { color: #fff; }
.vision_card:hover .v_num { color: rgba(255,255,255,0.1); }

/* 파트너쉽 (풀사이즈 백그라운드) */
.vision_partners_full {
    width: 100%;
    padding: 8rem 0 10rem 0;
    background: url('../../images/fs/content/sub01/img02.jpg') no-repeat center center / cover;
    position: relative;
}
.vision_partners_full::before {
    content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(11, 26, 48, 0.8); /* 어두운 네이비 오버레이 */
    z-index: 0;
}
.vision_partners { position: relative; z-index: 1; }

.part_title { font-size: 2.8rem; font-weight: 800; margin-bottom: 3rem; color: #fff; }
.part_title span { color: var(--accent); font-size: 1.8rem; vertical-align: middle; margin-right: 0.5rem; }

.part_grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 1.5rem; margin-top:2rem; }
.part_item { border-radius: 1rem; padding: 2.5rem 1rem; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; }
.part_item img { max-width: 140px; max-height: 50px; filter: grayscale(100%); opacity: 0.6; transition: all 0.3s ease; }

.part_item:hover { transform: translateY(-5px); }
.part_item:hover img { filter: grayscale(0%); opacity: 1; }

@media (max-width: 1024px) {
    .vision_features { grid-template-columns: 1fr; gap: 3rem; }
    .vision_card { padding: 4rem 3rem; }
    .part_grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 767px) {
    .vision_partners_full { padding: 6rem 0 8rem 0; margin-bottom: -8rem; }
    .part_grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
    .part_item { padding: 1.5rem 1rem; }
    .part_item img { max-width: 110px; max-height: 40px; }
}


/* ===========================
   CI소개 (CI)
   =========================== */
.ci_box_wrap {}
.ci_box_wrap .h4tit {text-align: center;font-size:3rem;font-weight: 700;color:#222;}
.ci_box_wrap .p {font-size: 1.8rem;color:#333;margin-top:2rem;line-height: 1.5;}
.ci_box_wrap .gray_box {background:#f5f5f5;padding:4.5rem 4rem;font-size:1.8rem;color:#222;line-height:1.5;text-align: center;}
.ci_box_wrap .grid_box .box {display:flex;flex-direction:column;width:100%;flex-grow:1;}
.ci_box_wrap .grid_box .box .h5 {text-align: left;}
.ci_box_wrap .grid_box .box .imgbox {flex-grow:1;display:flex;align-items:center;justify-content:center;gap:30rem;border:1px solid #ddd;padding:10rem 3rem;background:url('../../images/fs/content/sub01/grid_bg.png');}
.ci_box_wrap .grid_box .box .imgbox img {max-width: 23rem;}
.ci_box_wrap .btn_box {gap: 2rem;display: flex;margin:30px auto 0;justify-content: center;}
.ci_box_wrap .btn_box a {display:inline-flex;place-items:center;justify-content: center;width:25rem;padding:0 1rem;font-size:1.6rem;line-height: normal;height: 6rem;}
.ci_box_wrap .palette ol {display:flex;flex-wrap:wrap;gap:40px;line-height:1.2;}
.ci_box_wrap .palette ol > li {display:flex;flex-wrap:wrap;width:100%;max-width:calc(30% - 20px);border:1px solid #ddd;}
.ci_box_wrap .palette ol > li .color {display:flex;align-items:flex-end;width:120px;height:auto;aspect-ratio: 1/1;padding:15px;background:#0075C2;}
.ci_box_wrap .palette ol > li .color span {font-weight:bold;color:#fff;}
.ci_box_wrap .palette ol > li .c_txt {padding:20px;display:flex;align-items: center;font-size:.95em;}
.ci_box_wrap .palette ol > li .c_txt ul {display:flex;flex-direction:column;gap:5px;}
.ci_box_wrap .palette ol > li .c_txt ul li strong {display:inline-block;color:#222;width:7rem;}
.ci_box_wrap .palette ol.main_color > li:nth-child(1) .color {background:#10234b;}
.ci_box_wrap .palette ol.main_color > li:nth-child(2) .color {background:#d01120;}
.ci_box_wrap .palette ol.main_color > li:nth-child(3) .color {background:#666464;}
.ci_box_wrap .palette ol.sub_color > li:nth-child(1) .color {background:#eeeeee;}
.ci_box_wrap .palette ol.sub_color > li:nth-child(1) .color span {color:#222;}
.ci_box_wrap .palette ol.acc_color > li:nth-child(1) .color {background:#B0883D;}
.ci_box_wrap .palette ol.acc_color > li:nth-child(2) .color {background:#C9C9CA;}
@media only screen and (max-width:1199px){
    .ci_box_wrap .palette ol > li {max-width:calc(50% - 20px);}
}
@media only screen and (max-width:1023px){
    .ci_box_wrap .grid_box {flex-wrap: wrap;}
    .ci_box_wrap .grid_box .box {width: 100%;}
    .ci_box_wrap .grid_box .box .imgbox {gap:15rem;}
    .ci_box_wrap .grid_box .box .imgbox img {max-width:17rem;}
}
@media only screen and (max-width:767px){
    .ci_box_wrap .grid_box .box .imgbox img {max-width:96%;}
    .ci_box_wrap .palette ol > li {max-width:100%;}
    .ci_box_wrap .palette ol > li .color {width:100px;padding:10px;}
    .ci_box_wrap .palette ol > li .c_txt {padding:20px 10px;}

    .ci_box_wrap .bi_wrp .box1 .grid_box {flex-direction: column;align-items: center;}
    .ci_box_wrap .grid_box .box .imgbox {flex-direction: column;gap:10rem;padding:5rem 2rem}
}

/* ===========================
   오시는 길 (Location)
   =========================== */
.location_wrap { display: flex; flex-direction: column; gap: 8rem; }
.loc_item { display: flex; gap: 6rem; align-items: stretch; }

.loc_map_box { width: 45%; height: 420px; background: #e2e8f0; position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.loc_map_box::after { content: 'Map API Area'; font-size: 2rem; font-weight: 600; color: #94a3b8; letter-spacing: 2px; }
.loc_map_box iframe, .loc_map_box .map_inner { position: absolute; top:0; left:0; width:100%; height:100%; border:none; z-index: 10; }

.loc_info_box { flex: 1; display: flex; flex-direction: column; justify-content: center; padding: 2rem 0; }
.loc_title { font-size: 3.4rem; font-weight: 800; color: #111; margin-bottom: 1rem; display: flex; align-items: flex-start; align-items: flex-end; letter-spacing: -1px; }
.loc_title::after { content: ''; display: inline-block; width: 10px; height: 10px; background: #d01120; border-radius: 50%; margin-left: 0.8rem; transform: translateY(-17px); }

.loc_address { display: flex; align-items: flex-start; align-items: center; gap: 1.2rem; margin-bottom: 1rem; }
.loc_address i { font-size: 2.4rem; color: #555; margin-top: 0.2rem; vertical-align: middle; }
.loc_address p { font-size: 2.2rem; font-weight: 600; color: #222; word-break: keep-all; line-height: 1.4; letter-spacing: -0.5px; }

.loc_contact { display: flex; flex-direction: column; margin-bottom: 5rem; }
.loc_contact dl { display: flex; align-items: center; gap: 2rem; }
.loc_contact dt { width: 70px; font-size: 1.6rem; font-weight: 600; color: #111; letter-spacing: -0.5px; }
.loc_contact dd { font-size: 1.7rem; color: #444; font-weight: 600; font-family: 'Montserrat', sans-serif; }

.loc_btns { display: flex; gap: 2rem; }
.loc_btns .btn_map { width: 220px; display: flex; align-items: center; justify-content: center; gap: 1rem; height: 55px; border: 1px solid #666; border-radius: 40px; font-size: 1.6rem; font-weight: 600; color: #222; transition: all 0.3s ease; text-decoration: none; }
.loc_btns .btn_map i { font-size: 2rem; }
.loc_btns .btn_map.kakao i { color: #3a2929; }
.loc_btns .btn_map.google i { color: #4285f4; }
.loc_btns .btn_map:hover { background: #f8f9fa; border-color: #222; }

@media(max-width: 1024px) {
    .loc_item { flex-direction: column; gap: 4rem; }
    .loc_map_box { width: 100%; height: 350px; }
    .loc_info_box { width: 100%; padding: 0; }
    .loc_title { font-size: 3rem; margin-bottom: 3rem; }
    .loc_address { margin-bottom: 3rem; }
    .loc_address p { font-size: 1.9rem; }
    .loc_contact { margin-bottom: 4rem; }
    .loc_btns .btn_map { width: 100%; flex: 1; }
}
@media(max-width: 768px) {
    .loc_map_box { height: 280px; }
    .loc_title { font-size: 2.6rem; margin-bottom: 2.5rem; }
    .loc_title::after { width: 7px; height: 7px; transform: translateY(-10px); }
    .loc_address { gap: 1rem; margin-bottom: 2.5rem; }
    .loc_address i { font-size: 2rem; }
    .loc_address p { font-size: 1.7rem; }
    .loc_btns { flex-direction: column; gap: 1rem; }
    .loc_btns .btn_map { flex: none; height: 55px; }
}

/* ===========================
   인재상 (Ideal Employee)
   =========================== */
.ideal_list { display: flex; flex-direction: column; gap: 8rem; }
.ideal_card { background: transparent; border-radius: 0; border: none; display: flex; flex-direction: row; align-items: center; gap: 6rem; }
.ideal_card:nth-child(even) { flex-direction: row-reverse; }

.card_img { position: relative; width: 45%; padding-top: 32%; transform-style: preserve-3d; perspective: 1000px; }
.card_img img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275); z-index: 1; }
.ideal_card:hover .card_img img { transform: scale(1.03) rotateY(-5deg) rotateX(2deg); }
.ideal_card:nth-child(even):hover .card_img img { transform: scale(1.03) rotateY(5deg) rotateX(2deg); }

/* 화려한 3D 플로팅 아이콘 효과 */
@keyframes floatIcon {
    0%, 100% { transform: translateZ(50px) translateY(0) rotate(0); }
    50% { transform: translateZ(50px) translateY(-25px) rotate(15deg); }
}
.card_img .floating_icon { position: absolute; top: -10px; right: -30px; width: 90px; height: 90px; background: linear-gradient(135deg, var(--accent, #e60023), #ff4d6d); border-radius: 100%; display: flex; align-items: center; justify-content: center; font-size: 4.5rem; color: #fff; box-shadow: 0 20px 40px rgba(230,0,35,0.4); animation: floatIcon 4s ease-in-out infinite; z-index: 10; }
.ideal_card:nth-child(even) .floating_icon { right: auto; left: -30px; background: linear-gradient(135deg, #1e3c72, #2a5298); box-shadow: 0 20px 40px rgba(30,60,114,0.4); animation-delay: 1s; }
.ideal_card:nth-child(3) .floating_icon { background: linear-gradient(135deg, #11998e, #38ef7d); box-shadow: 0 20px 40px rgba(17,153,142,0.4); animation-delay: 2s; }

.card_cont { flex: 1; display: flex; flex-direction: column; }
.card_cont h3 { font-size: 3.5rem; font-weight: 800; color: #111; margin-bottom: 2rem; letter-spacing: -1.5px; }
.slogan { font-size: 2rem; line-height: 1.6; color: #555; font-weight: 500; margin-bottom: 3.5rem; word-break: keep-all; }

.attr_list { display: flex; flex-direction: column; gap: 1.5rem; border-top: 2px solid #111; padding-top: 3rem; }
.attr_list li { display: flex; align-items: flex-start; gap: 1.5rem; font-size: 1.7rem; color: #333; line-height: 1.5; word-break: keep-all; font-weight: 500; }
.attr_list li i { display: none; }
.attr_list li::before { content: ""; display: inline-block; width: 6px; height: 6px; background: #e60023; margin-top: 1rem; flex-shrink: 0; }

@media(max-width: 1024px) {
    .ideal_card { flex-direction: column !important; gap: 4rem; align-items: stretch; }
    .card_img { width: 100%; padding-top: 50%; }
    .card_img .floating_icon { width: 70px; height: 70px; font-size: 3.5rem; top: -20px; right: 20px !important; left: auto !important; }
    .ideal_card:hover .card_img img, .ideal_card:nth-child(even):hover .card_img img { transform: none; }
    .card_cont { text-align: left; }
}
@media(max-width: 768px) {
    .ideal_list { gap: 6rem; }
    .card_cont h3 { font-size: 2.8rem; }
    .slogan { font-size: 1.7rem; margin-bottom: 2.5rem; }
}


/* ===========================
   채용안내 (Recruitment)
   =========================== */
.recruit_wrap { position: relative; z-index: 1; }

.recruit_intro { margin-bottom: 8rem; display: flex; justify-content: space-between; gap: 5rem; }
.recruit_intro .intro_left { width: 45%; flex-shrink: 0; }
.recruit_intro .intro_right { flex: 1; }
.recruit_intro .intro_sub_title { font-size: 1.8rem; font-weight: 600; color: #666; margin-bottom: 2rem; font-family: 'Montserrat', 'Escoredream', sans-serif; }
.recruit_intro h3 { font-size: 4.2rem; font-weight: 800; color: #111; margin-bottom: 2rem; letter-spacing: -1.5px; word-break: keep-all; line-height: 1.3; }
.recruit_intro .intro_lead { font-size: 1.8rem; font-weight: 600; color: #333; line-height: 1.6; margin-bottom: 2rem; word-break: keep-all; }
.recruit_intro .intro_desc { font-size: 1.6rem; color: #666; line-height: 1.7; margin-bottom: 1.5rem; word-break: keep-all; }
.recruit_intro .intro_desc:last-child { margin-bottom: 0; }

.recruit_section { margin-bottom: 8rem; }
.recruit_section:last-child { margin-bottom: 0; }
.h4_title { font-size: 2.4rem; font-weight: 700; color: #111; margin-bottom: 3rem; display: flex; align-items: center; gap: 0.5rem; }
.h4_title i { color: var(--accent, #e60023); font-size: 2.8rem; font-weight: 400; }

.job_grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.job_card {
    position: relative;
    border-radius: 0;
    overflow: hidden;
    min-height: 380px;
    background-size: cover;
    background-position: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.job_card::before {
    content: '';
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.85) 100%);
    z-index: 1;
}
.job_card:hover { transform: translateY(-5px); box-shadow: 0 15px 30px rgba(0,0,0,0.15); }
.job_card .card_inner {
    position: absolute; bottom: 0; left: 0; width: 100%; padding: 3rem 2.5rem;
    z-index: 2; text-align: left;
}
.job_card .card_inner i { color: #fff; font-size: 3.2rem; margin-bottom: 1rem; display: block; }
.job_card .card_inner h5 { font-size: 2.2rem; font-weight: 700; color: #fff; margin-bottom: 1rem; }
.job_card .card_inner ul { display: flex; flex-wrap: wrap; gap: 0.5rem; flex-direction: row; }
.job_card .card_inner ul li { font-size: 1.45rem; color: rgba(255,255,255,0.85); font-weight: 400; display: flex; align-items: center; }
.job_card .card_inner ul li:not(:last-child)::after { content: '·'; margin-left: 0.8rem; color: rgba(255,255,255,0.4); font-size: 2rem; }

.job_card:nth-child(1) { grid-column: span 1; }
.job_card:nth-child(2) { grid-column: span 2; }
.job_card:nth-child(3) { grid-column: span 2; }
.job_card:nth-child(4) { grid-column: span 1; }
.job_card:nth-child(5) { grid-column: span 3; min-height: 300px; }

.process_flow { display: flex; align-items: stretch; justify-content: space-between; gap: 2rem; position: relative; counter-reset: step; }
.process_flow::before {
    content: ''; position: absolute; top: 120px; left: 10%; width: 80%; height: 2px;
    background: repeating-linear-gradient(to right, #e5e5e0 0, #e5e5e0 8px, transparent 8px, transparent 16px);
    z-index: 0;
}
.process_step {
    position: relative; z-index: 1; flex: 1; background: #fff; border: 1px solid #eee;
    padding: 4rem 2rem 3.5rem; text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    box-shadow: 0 4px 15px rgba(0,0,0,0.01);
}
.process_step::before {
    counter-increment: step; content: "STEP 0" counter(step);
    display: inline-block;
    background: #f4f5f8; color: #666; font-size: 1.3rem; font-weight: 700;
    padding: 0.6rem 1.8rem; border-radius: 50px; margin-bottom: 2.5rem;
    transition: all 0.3s ease;
}
.process_step:hover { border-color: #ddd; box-shadow: 0 10px 30px rgba(0,0,0,0.04); transform: translateY(-5px); }
.process_step:hover::before { background: var(--primary); color: #fff; }

.step_icon {
    width: 90px; height: 90px; margin: 0 auto 2.5rem;
    background: #fff; border: 1px solid #f0f0f0;
    border-radius: 100%; box-shadow: 0 5px 15px rgba(0,0,0,0.02);
    display: flex; align-items: center; justify-content: center;
    font-size: 3.6rem; color: #777; transition: all 0.3s ease;
    position: relative;
}
.process_step:hover .step_icon {
    background: var(--primary); color: #fff; border-color: var(--primary); transform: scale(1.05);
}

.step_info > strong { display: block; font-size: 2rem; font-weight: 700; color: #222; margin-bottom: 0.8rem; letter-spacing: -0.5px; line-height: 1; }
.step_info > span { display: block; font-size: 1.5rem; color: #777; font-weight: 500; }

.process_arrow { display: none !important; }

@media(max-width: 1024px) {
    .recruit_intro { flex-direction: column; gap: 3rem; }
    .recruit_intro .intro_left { width: 100%; }
    .recruit_intro h3 { font-size: 3.6rem; }
    .job_grid { grid-template-columns: repeat(2, 1fr); gap: 2rem; }
    .job_card:nth-child(n) { grid-column: span 1; min-height: 340px; }
    .job_card:nth-child(5) { grid-column: span 2; }
    .job_card .card_inner { padding: 2rem; }
    .process_flow { flex-wrap: wrap; justify-content: center; gap: 2rem; }
    .process_flow::before { display: none; }
    .process_step { flex: 1 0 calc(50% - 3rem); }
    .process_arrow { display: none; }
}
@media(max-width: 768px) {
    .recruit_intro { margin-bottom: 5rem; }
    .recruit_intro .intro_sub_title { font-size: 1.5rem; margin-bottom: 1.5rem; }
    .recruit_intro h3 { font-size: 2.8rem; }
    .recruit_intro .intro_lead { font-size: 1.6rem; margin-bottom: 2rem; }
    .job_grid { grid-template-columns: 1fr; gap: 1.5rem; }
    .job_card:nth-child(n) { grid-column: span 1; min-height: 280px; }
    .process_step { flex: 1 0 100%; padding: 3rem 2rem; }
}
@media(max-width: 480px) {
    .job_grid { grid-template-columns: 1fr; }
}

/* ===========================
   복리후생 (Welfare)
   =========================== */
.welfare_wrap { position: relative; z-index: 1; margin-top: 4rem; }

/* Top Section */
.welfare_top { margin-bottom: 10rem; }
.welfare_top .page_title { font-size: 3.2rem; font-weight: 800; color: #111; margin-bottom: 5rem; letter-spacing: -1px; }

.welfare_intro { display: flex; align-items: center; justify-content: space-between; position: relative; }
.welfare_intro .img_left { width: 35%; height: 400px; }
.welfare_intro .img_left img { width: 100%; height: 100%; object-fit: cover; }

.welfare_intro .img_right { width: 25%; height: 300px; align-self: flex-end; }
.welfare_intro .img_right img { width: 100%; height: 100%; object-fit: cover; }

.welfare_intro .intro_text { flex: 1; text-align: center; padding: 0 4rem; }
.welfare_intro .intro_text strong { display: block; font-size: 4rem; font-weight: 800; color: #111; line-height: 1.3; margin-bottom: 2rem; letter-spacing: -1.5px; }
.welfare_intro .intro_text p { font-size: 1.8rem; color: #555; word-break: keep-all; font-weight: 500; }

/* Welfare List */
.welfare_list_sec { display: flex; flex-direction: column; }

.wel_grid_new { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #e0e0e0; }
.wel_item { border-bottom: 1px solid #e0e0e0; padding: 4rem 3rem; position: relative; display: flex; flex-direction: column; }
.wel_item:not(:nth-child(3n)) { border-right: 1px solid #e0e0e0; }

.wel_item_head { display: flex; justify-content: space-between; align-items: center; }
.wel_item_head h4 { font-size: 1.8rem; font-weight: 400; color: #111; letter-spacing: -1px; margin: 0; line-height: 1.3; word-break: keep-all; }
.wel_item_head svg { width: 40px; height: 40px; stroke-width: 1; stroke: #111; fill: none; opacity: 0.8; flex-shrink: 0; }

/* Responsive */
@media(max-width: 1024px) {
    .welfare_intro { flex-direction: column; gap: 4rem; align-items: center; }
    .welfare_intro .img_left, .welfare_intro .img_right { width: 100%; height: 300px; align-self: auto; }
    .welfare_intro .intro_text { padding: 0 2rem; }
    .welfare_intro .intro_text strong { font-size: 3.6rem; }

    .wel_grid_new { grid-template-columns: repeat(2, 1fr); }
    .wel_item:not(:nth-child(3n)) { border-right: none; }
    .wel_item:not(:nth-child(2n)) { border-right: 1px solid #e0e0e0; }
}
@media(max-width: 768px) {
    .welfare_intro .intro_text strong { font-size: 2.8rem; }
    .welfare_intro .intro_text p { font-size: 1.6rem; }
    .welfare_intro .img_left, .welfare_intro .img_right { height: 200px; }

    .wel_grid_new { grid-template-columns: 1fr; }
    .wel_item:not(:nth-child(2n)) { border-right: none; }
    .wel_item { padding: 3rem 2rem; }
}
/* 영문 전용 폰트 */
.font_eng { font-family: 'Montserrat', sans-serif !important; }

/* 복리후생 애니메이션 */
.welfare_top { position: relative; height: 100vh; width: 100%; display: flex; align-items: center; justify-content: center; overflow: hidden; background: #fff; }
.welfare_intro { position: relative; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.welfare_intro .intro_text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; z-index: 10; text-align: center; }
.welfare_intro .intro_text strong { font-size: 4.2rem; line-height: 1.4; display: block; margin-bottom: 20px; color: #111; }
.welfare_intro .intro_text p { font-size: 18px; color: #333; }
.welfare_intro .img_box { position: absolute; top: 100%; left: 50%; width: 100vw; height: 100vh; z-index: 1; overflow: hidden; opacity: 0; }
.welfare_intro .img_box img { width: 100%; height: 100%; object-fit: cover; }
.welfare_intro .img_box::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.4); z-index: 2; }

/* 근무환경 슬라이드 */
.env_slider_wrap { position: relative; padding: 10rem 0; background: #fff; overflow: hidden; }
.env_swiper { width: 100%; max-width: 100%; margin: 0 auto; padding: 50px 0; overflow: hidden !important; }
.env_swiper .swiper-slide { width: 50vw; max-width: 800px; height: 500px; border-radius: 20px; overflow: hidden; transition: transform 0.3s, filter 0.3s; }
.env_swiper .swiper-slide img { width: 100%; height: 100%; object-fit: cover; }
.env_swiper .swiper-slide:not(.swiper-slide-active) { filter: brightness(0.7); }

/* 슬라이더 컨트롤 (화살표, 페이징) */
.env_nav { display: flex; align-items: center; justify-content: center; gap: 30px; margin-top: 2rem; position: relative; z-index: 15; }
.env_nav .swiper-button-prev, .env_nav .swiper-button-next { position: static; margin: 0; width: 40px; height: 40px; border-radius: 50%; background: #112B4D; color: #fff; }
.env_nav .swiper-button-prev:after, .env_nav .swiper-button-next:after { font-size: 1.4rem; }
.env_nav .swiper-pagination { position: static; width: auto; font-size: 1.6rem; font-weight: 600; color: #112B4D; letter-spacing: 2px; }
.env_nav .swiper-pagination .swiper-pagination-bullet { width: 10px; height: 10px; background: #ccc; opacity: 1; margin: 0 5px; }
.env_nav .swiper-pagination .swiper-pagination-bullet-active { background: #112B4D; width: 20px; border-radius: 5px; }

.env_text { position: relative; bottom: auto; left: 0; width: 100%; text-align: center; margin-top: 4rem; z-index: 10; }
.env_text p { font-size: 1.8rem; color: #555; font-weight: 500; }
.env_text h2 { font-size: 4.8rem; color: #112B4D; font-weight: 800; letter-spacing: -1px; line-height: 1; }

@media(max-width: 1024px) {
    .env_text h2 { font-size: 3.6rem; }
}
@media(max-width: 768px) {
    .env_swiper .swiper-slide { width: 200px; height: 280px; }
    .env_text h2 { font-size: 2.8rem; }
    .env_text p { font-size: 1.5rem; }
}


/* ESG경영 경영방침 - 둥둥 떠다니는 궤도 레이아웃 (Center Logo Orbit) */
.esg-floating-wrap { position: relative; overflow: hidden; }

.esg-floating-container { position: relative; height: 1100px; margin: 0 auto; }

/* 중앙 정원 다중 궤도 & 로고 */
.bg-orbit-wrap { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 750px; height: 750px; z-index: 0; display: flex; align-items: center; justify-content: center; }
.bg-circle-1, .bg-circle-2, .bg-circle-3 { position: absolute; top: 50%; left: 50%; border-radius: 50%; pointer-events: none; }
.bg-circle-1 { width: 750px; height: 750px; border: 1px solid #e2e2e2; animation: orbitPulse1 6s ease-in-out infinite; }
.bg-circle-2 { width: 790px; height: 790px; border: 2px dashed #d8d8d8; animation: orbitSpin 40s linear infinite; }
.bg-circle-3 { width: 710px; height: 710px; border: 1px solid #eeeeee; animation: orbitPulse2 8s ease-in-out infinite; }

@keyframes orbitPulse1 { 0% { transform: translate(-50%, -50%) scale(1); } 50% { transform: translate(-50%, -50%) scale(1.02); } 100% { transform: translate(-50%, -50%) scale(1); } }
@keyframes orbitPulse2 { 0% { transform: translate(-50%, -50%) scale(1); } 50% { transform: translate(-50%, -50%) scale(0.98); } 100% { transform: translate(-50%, -50%) scale(1); } }
@keyframes orbitSpin { 0% { transform: translate(-50%, -50%) rotate(0deg); } 100% { transform: translate(-50%, -50%) rotate(360deg); } }

.center-logo { position: relative; z-index: 2; }
.center-logo img { max-width: 220px; opacity: 0.9; }

/* 궤도 위 카드 배치 (Absolute) */
.float-item { position: absolute; z-index: 1; width: 520px; }
.float-item.pos-1 { top: 20px; left: 0; }
.float-item.pos-2 { top: 220px; right: 0; }
.float-item.pos-3 { top: 500px; left: 0; }
.float-item.pos-4 { top: 720px; right: 0; }

@keyframes floatAnim { 0% { transform: translateY(0); } 50% { transform: translateY(-15px); } 100% { transform: translateY(0); } }
.float-anim-1 { animation: floatAnim 4s ease-in-out infinite; }
.float-anim-2 { animation: floatAnim 4.5s ease-in-out infinite 0.5s; }
.float-anim-3 { animation: floatAnim 5s ease-in-out infinite 1s; }
.float-anim-4 { animation: floatAnim 4.2s ease-in-out infinite 1.5s; }

.esg-float-card { background: #fff; border: 1px solid #f0f0f0; padding: 40px 45px; box-shadow: 0 10px 30px rgba(0,0,0,0.04); display: flex; align-items: center; justify-content: space-between; gap: 20px; transition: box-shadow 0.3s; }
.esg-float-card:hover { box-shadow: 0 15px 40px rgba(0,0,0,0.08); }

.fc-text { flex: 1; }
.fc-text h3 { font-size: 24px; font-weight: 800; color: #111; margin-bottom: 5px; letter-spacing: -0.5px; }
.fc-text .fc-eng { display: block; font-size: 16px; font-weight: 600; color: #112B4D; margin-bottom: 20px; font-family: 'Montserrat', sans-serif; text-transform: uppercase; letter-spacing: 1px; }
.fc-list { list-style: none; padding: 0; margin: 0; }
.fc-list li { font-size: 15px; color: #666; line-height: 1.6; margin-bottom: 8px; word-break: keep-all; position: relative; padding-left: 10px; }
.fc-list li::before { content: '·'; position: absolute; left: 0; top: 0; font-weight: bold; color: #888; }

.fc-icon { width: 80px; height: 80px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.fc-icon i { font-size: 70px; color: #e8e8e8; transition: color 0.3s; }
.esg-float-card:hover .fc-icon i { color: #d0d5dc; }

@media screen and (max-width: 1100px) {
    .esg-floating-container { height: auto; display: flex; flex-direction: column; gap: 30px; margin: 40px auto; padding: 0 20px; }
    .bg-orbit-wrap { position: relative; width: 100%; height: auto; border: none; top: auto; left: auto; transform: none; margin-bottom: 40px; }
    .bg-circle-1, .bg-circle-2, .bg-circle-3 { display: none; }
    .float-item { position: relative; width: 100%; top: auto !important; left: auto !important; right: auto !important; bottom: auto !important; }
}
@media screen and (max-width: 768px) {
    .esg-float-card { flex-direction: column-reverse; padding: 30px; text-align: center; gap: 20px; }
    .fc-list li { padding-left: 0; }
    .fc-list li::before { display: none; }
    .fc-icon { width: 70px; height: 70px; margin: 0 auto; }
    .fc-icon i { font-size: 60px; }
}


/* ===========================
   Environmental (환경) - 신규 모던 디자인
   =========================== */
.esg-env-wrap {}

.esg-env-header { text-align: center; margin-bottom: 80px; position: relative; }
.esg-env-header .badge { display: inline-block; padding: 8px 24px; background: rgba(230,0,18,0.08); color: var(--accent); border-radius: 30px; font-size: 1.6rem; font-weight: 700; margin-bottom: 20px; letter-spacing: 2px; }
.esg-env-header .env-title { font-size: 5.5rem; font-weight: 800; color: #111; margin-bottom: 2rem; letter-spacing: -2px; line-height: 1.2; }
.esg-env-header .env-title .dot { display: inline-block; transform: translateY(2px); font-size: 4.5rem; font-family: 'Montserrat', sans-serif; color: var(--accent); }
.esg-env-header .env-desc { font-size: 1.9rem; color: #555; font-weight: 500; letter-spacing: -0.5px; }

/* Watermark typography in background */
.esg-env-header.modern-title::before { content: attr(data-watermark); position: absolute; top: 0; left: 50%; transform: translateX(-50%); font-size: 10rem; font-weight: 900; color: rgba(0,0,0,0.025); font-family: 'Montserrat', sans-serif; z-index: -1; white-space: nowrap; }

.esg-env-content { display: flex; gap: 40px; align-items: stretch; }

/* 인증서 영역 */
.env-cert-box { flex: 0 0 450px; background: #fff; padding: 40px; display: flex; flex-direction: column; text-align: center; justify-content: center; border: 1px solid #eaeaea; transition: transform 0.3s; }
.env-cert-box:hover { transform: translateY(-5px); }
.cert-img-wrap { background: #f8f9fa; border-radius: 12px; padding: 30px; margin-bottom: 25px; flex: 1; display: flex; align-items: center; justify-content: center; border: 1px dashed #d0d5dc; min-height: 450px; overflow: hidden; }
.cert-img-wrap img { max-width: 100%; height: auto; box-shadow: 0 5px 15px rgba(0,0,0,0.1); }
.cert-placeholder { color: #999; }
.cert-placeholder i { font-size: 48px; color: #cbd3dc; margin-bottom: 10px; }
.cert-placeholder p { font-size: 15px; line-height: 1.5; }
.cert-info strong { display: block; font-size: 26px; color: #112B4D; font-weight: 700; margin-bottom: 5px; }
.cert-info span { font-size: 16px; color: #666; font-weight: 500; }

/* 4개의 항목 카드 영역 */
.env-grid { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.env-card { background: #fff; padding: 35px 30px; border: 1px solid #eaeaea; transition: all 0.3s ease; position: relative; overflow: hidden; display: flex; flex-direction: column; }
.env-card:hover { box-shadow: 0 15px 35px rgba(17,43,77,0.08); border-color: #112B4D; transform: translateY(-5px); }
.env-card::before { content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 100%; background: #112B4D; opacity: 0; transition: 0.3s; }
.env-card:hover::before { opacity: 1; }

.card-icon { font-size: 42px; color: #112B4D; margin-bottom: 20px; opacity: 1; }

.card-text h4 { font-size: 20px; font-weight: 700; color: #222; margin-bottom: 15px; display: flex; align-items: center; gap: 8px; letter-spacing: -0.5px; }
.card-text h4 span { color: #112B4D; font-weight: 900; font-size: 16px; }
.card-text ul { list-style: none; padding: 0; margin: 0; flex: 1; }
.card-text ul li { font-size: 15.5px; color: #555; line-height: 1.6; margin-bottom: 10px; padding-left: 14px; position: relative; word-break: keep-all; }
.card-text ul li:last-child { margin-bottom: 0; }
.card-text ul li::before { content: ''; position: absolute; left: 0; top: 10px; width: 5px; height: 5px; border-radius: 50%; background: #9bb0c9; transition: background 0.3s; }
.env-card:hover .card-text ul li::before { background: #112B4D; }

@media screen and (max-width: 1100px) {
    .esg-env-content { flex-direction: column; }
    .env-cert-box { flex: auto; max-width: 600px; margin: 0 auto; width: 100%; }
    .cert-img-wrap { min-height: 350px; }
}
@media screen and (max-width: 768px) {
    .env-grid { grid-template-columns: 1fr; gap: 20px; }
}

/* ===========================
   Social (사회) - Circle Image Layout
   =========================== */
.esg-social-circle-wrap { display: flex; flex-direction: column; gap: 100px; margin: 80px auto 0; max-width: 1200px; }
.sc-item { display: flex; align-items: center; gap: 80px; }
.sc-item.reverse { flex-direction: row-reverse; }
.sc-img { flex: 1; display: flex; justify-content: center; align-items: center; position: relative; }
.img-circle { width: 520px; height: 520px; border-radius: 43% 57% 65% 35% / 44% 53% 47% 56%; /* Default Blob */ background-size: cover; background-position: center; box-shadow: 0 30px 60px rgba(0,0,0,0.15); transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1), border-radius 0.6s ease; border: 4px solid #fff; position: relative; z-index: 2; }
/* 2 Animated Background Blobs */
.sc-img::before, .sc-img::after { content: ''; position: absolute; width: 500px; height: 500px; z-index: 1; transition: transform 0.6s ease; }

.sc-img::before { background: #eef1f6; animation: blobAnim1 12s infinite alternate ease-in-out; }
.sc-img::after { background: #f8fafc; animation: blobAnim2 15s infinite alternate-reverse ease-in-out; }

@keyframes blobAnim1 {
    0% { transform: translate(10px, -20px) scale(1) rotate(0deg); border-radius: 61% 39% 49% 51% / 44% 63% 37% 56%; }
    50% { transform: translate(-15px, 10px) scale(1.05) rotate(15deg); border-radius: 41% 59% 37% 63% / 54% 68% 32% 46%; }
    100% { transform: translate(20px, 15px) scale(0.95) rotate(-10deg); border-radius: 58% 42% 64% 36% / 42% 58% 42% 58%; }
}
@keyframes blobAnim2 {
    0% { transform: translate(-20px, 10px) scale(0.95) rotate(0deg); border-radius: 43% 57% 65% 35% / 44% 53% 47% 56%; }
    50% { transform: translate(15px, -25px) scale(1) rotate(-15deg); border-radius: 52% 48% 69% 31% / 43% 59% 41% 57%; }
    100% { transform: translate(-10px, 20px) scale(1.05) rotate(10deg); border-radius: 32% 68% 49% 51% / 63% 39% 61% 37%; }
}

/* Random Organic Shapes for the Main Image */
.sc-item:nth-child(1) .img-circle { border-radius: 43% 57% 65% 35% / 44% 53% 47% 56%; }
.sc-item:nth-child(2) .img-circle { border-radius: 66% 34% 45% 55% / 54% 43% 57% 46%; }
.sc-item:nth-child(3) .img-circle { border-radius: 38% 62% 44% 56% / 62% 38% 62% 38%; }
.sc-item:nth-child(4) .img-circle { border-radius: 52% 48% 69% 31% / 43% 59% 41% 57%; }

/* Randomize Animation Delays to look distinct */
.sc-item:nth-child(1) .sc-img::before { animation-delay: 0s; }
.sc-item:nth-child(1) .sc-img::after { animation-delay: -2s; }
.sc-item:nth-child(2) .sc-img::before { animation-delay: -5s; }
.sc-item:nth-child(2) .sc-img::after { animation-delay: -7s; }
.sc-item:nth-child(3) .sc-img::before { animation-delay: -10s; }
.sc-item:nth-child(3) .sc-img::after { animation-delay: -12s; }
.sc-item:nth-child(4) .sc-img::before { animation-delay: -15s; }
.sc-item:nth-child(4) .sc-img::after { animation-delay: -17s; }

.sc-item:hover .img-circle { transform: scale(1.05) translateY(-10px); }
.sc-item:hover::before { transform: scale(0.95); }

.sc-text { flex: 1; padding: 20px; z-index: 2; }
.sc-text h3 { font-size: 34px; font-weight: 800; color: #111; margin-bottom: 35px; position: relative; padding-bottom: 25px; letter-spacing: -1.5px; font-family: 'Montserrat', 'Escoredream', sans-serif; }
.sc-text h3::after { content: ''; position: absolute; bottom: 0; left: 0; width: 60px; height: 5px; background: var(--primary, #112B4D); border-radius: 3px; }
.sc-text ul { list-style: none; padding: 0; margin: 0; }
.sc-text ul li { font-size: 19px; color: #444; line-height: 1.8; margin-bottom: 18px; padding-left: 28px; position: relative; word-break: keep-all; font-weight: 500; }
.sc-text ul li:last-child { margin-bottom: 0; }
.sc-text ul li::before { content: ''; position: absolute; top: 13px; left: 0; width: 8px; height: 8px; border-radius: 50%; background: var(--accent, #e60012); box-shadow: 0 0 10px rgba(230,0,18,0.3); }

@media (max-width: 1024px) {
    .sc-item, .sc-item.reverse { flex-direction: column; text-align: center; gap: 50px; }
    .sc-text h3::after { left: 50%; transform: translateX(-50%); }
    .sc-text ul { text-align: left; display: inline-block; }
    .sc-text ul li { width: 100%; }
    .img-circle { width: 400px; height: 400px; border-radius: 90px; border-width: 4px; }
    .sc-img::before, .sc-img::after { width: 380px; height: 380px; }
    .sc-item::before { display: none; }
}
@media (max-width: 768px) {
    .esg-env-header { margin-bottom: 40px; }
    .esg-env-header.modern-title::before { font-size: 5.5rem; top: 0; }

    .esg-social-circle-wrap { gap: 80px; margin-top: 40px; }
    .img-circle { width: 320px; height: 320px; border-radius: 70px; border-width: 4px; }
    .sc-img::before, .sc-img::after { width: 300px; height: 300px; }
    .sc-text h3 { margin-bottom: 25px; padding-bottom: 20px; }
    .sc-text ul li { font-size: 17px; }
}

/* ===========================
   Report (리포트) - Vision Section
   =========================== */
.gmb-vision-section { text-align: center; margin-bottom: 60px; padding: 100px 30px; position: relative; background-image: url('../../images/fs/content/sub03/img_report.jpg'); background-size: cover; background-position: center; background-attachment: fixed; overflow: hidden; }
.gmb-vision-section::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.55); z-index: 1; }
.gmb-vision-section .vision-tit { position: relative; z-index: 2; font-size: 3.8rem; font-weight: 800; color: #fff; line-height: 1.4; margin-bottom: 25px; letter-spacing: -1.5px; word-break: keep-all; }
.gmb-vision-section .vision-desc { position: relative; z-index: 2; font-size: 1.8rem; color: #fff; opacity: 0.9; line-height: 1.6; word-break: keep-all; font-weight: 400; }
.gmb-vision-section .vision-desc strong { color: #fff; font-weight: 700; opacity: 1; border-bottom: 1px solid rgba(255,255,255,0.5); padding-bottom: 2px; }

.esg-new-section { position: relative; overflow: hidden; margin: 40px 0 0 0; padding: 60px 0 40px 0; }

/* Scrolling Outline Text Background */
.bg-scrolling-text { position: absolute; top: 50%; left: 0; transform: translateY(-50%); white-space: nowrap; font-size: 24rem; font-weight: 900; color: transparent; -webkit-text-stroke: 2px #f4f4f4; z-index: 1; pointer-events: none; opacity: 0.8; animation: marquee-scroll 40s linear infinite; }
@keyframes marquee-scroll {
    0% { transform: translate(0, -50%); }
    100% { transform: translate(-50%, -50%); }
}

.esg-circle-wrap { display: flex; justify-content: space-between; align-items: center; max-width: 1240px; margin: 0 auto; position: relative; z-index: 2; padding: 0 20px; gap: 20px; }
.esg-circle { flex: 1; aspect-ratio: 1 / 1; max-width: 400px; border-radius: 50%; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; color: #fff; padding: 40px; box-shadow: 0 15px 40px rgba(0,0,0,0.1); transition: transform 0.4s ease, box-shadow 0.4s ease; margin: 0 auto; }
.esg-circle:hover { transform: translateY(-15px); box-shadow: 0 25px 50px rgba(0,0,0,0.15); }

/* Colors matching the design */
.esg-circle.item-env { background: #c5cacd; }
.esg-circle.item-soc { background: #a79c93; }
.esg-circle.item-gov { background: var(--accent); }

/* 궤도 위 카드 배치 (Absolute) */
.float-item { position: absolute; z-index: 1; width: 520px; }
.float-item.pos-1 { top: 20px; left: 0; }
.float-item.pos-2 { top: 220px; right: 0; }
.float-item.pos-3 { top: 500px; left: 0; }
.float-item.pos-4 { top: 720px; right: 0; }

@keyframes floatAnim { 0% { transform: translateY(0); } 50% { transform: translateY(-15px); } 100% { transform: translateY(0); } }
.float-anim-1 { animation: floatAnim 4s ease-in-out infinite; }
.float-anim-2 { animation: floatAnim 4.5s ease-in-out infinite 0.5s; }
.float-anim-3 { animation: floatAnim 5s ease-in-out infinite 1s; }
.float-anim-4 { animation: floatAnim 4.2s ease-in-out infinite 1.5s; }

.esg-float-card { background: #fff; border: 1px solid #f0f0f0; padding: 40px 45px; box-shadow: 0 10px 30px rgba(0,0,0,0.04); display: flex; align-items: center; justify-content: space-between; gap: 20px; transition: box-shadow 0.3s; }
.esg-float-card:hover { box-shadow: 0 15px 40px rgba(0,0,0,0.08); }

.fc-text { flex: 1; }
.fc-text h3 { font-size: 24px; font-weight: 800; color: #111; margin-bottom: 5px; letter-spacing: -0.5px; }
.fc-text .fc-eng { display: block; font-size: 16px; font-weight: 600; color: #112B4D; margin-bottom: 20px; font-family: 'Montserrat', sans-serif; text-transform: uppercase; letter-spacing: 1px; }
.fc-list { list-style: none; padding: 0; margin: 0; }
.fc-list li { font-size: 15px; color: #666; line-height: 1.6; margin-bottom: 8px; word-break: keep-all; position: relative; padding-left: 10px; }
.fc-list li::before { content: '·'; position: absolute; left: 0; top: 0; font-weight: bold; color: #888; }

.fc-icon { width: 80px; height: 80px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.fc-icon i { font-size: 70px; color: #e8e8e8; transition: color 0.3s; }
.esg-float-card:hover .fc-icon i { color: #d0d5dc; }

@media screen and (max-width: 1100px) {
    .esg-floating-container { height: auto; display: flex; flex-direction: column; gap: 30px; margin: 40px auto; padding: 0 20px; }
    .bg-orbit-wrap { position: relative; width: 100%; height: auto; border: none; top: auto; left: auto; transform: none; margin-bottom: 40px; }
    .bg-circle-1, .bg-circle-2, .bg-circle-3 { display: none; }
    .float-item { position: relative; width: 100%; top: auto !important; left: auto !important; right: auto !important; bottom: auto !important; }
}
@media screen and (max-width: 768px) {
    .esg-float-card { flex-direction: column-reverse; padding: 30px; text-align: center; gap: 20px; }
    .fc-list li { padding-left: 0; }
    .fc-list li::before { display: none; }
    .fc-icon { width: 70px; height: 70px; margin: 0 auto; }
    .fc-icon i { font-size: 60px; }
}


/* ===========================
   Environmental (환경) - 신규 모던 디자인
   =========================== */
.esg-env-wrap {}

.esg-env-header { text-align: center; margin-bottom: 80px; position: relative; }
.esg-env-header .badge { display: inline-block; padding: 8px 24px; background: rgba(230,0,18,0.08); color: var(--accent); border-radius: 30px; font-size: 1.6rem; font-weight: 700; margin-bottom: 20px; letter-spacing: 2px; }
.esg-env-header .env-title { font-size: 5.5rem; font-weight: 800; color: #111; margin-bottom: 2rem; letter-spacing: -2px; line-height: 1.2; }
.esg-env-header .env-title .dot { display: inline-block; transform: translateY(2px); font-size: 4.5rem; font-family: 'Montserrat', sans-serif; color: var(--accent); }
.esg-env-header .env-desc { font-size: 1.9rem; color: #555; font-weight: 500; letter-spacing: -0.5px; }

/* Watermark typography in background */
.esg-env-header.modern-title::before { content: attr(data-watermark); position: absolute; top: 0; left: 50%; transform: translateX(-50%); font-size: 10rem; font-weight: 900; color: rgba(0,0,0,0.025); font-family: 'Montserrat', sans-serif; z-index: -1; white-space: nowrap; }

.esg-env-content { display: flex; gap: 40px; align-items: stretch; }

/* 인증서 영역 */
.env-cert-box { flex: 0 0 450px; background: #fff; padding: 40px; display: flex; flex-direction: column; text-align: center; justify-content: center; border: 1px solid #eaeaea; transition: transform 0.3s; }
.env-cert-box:hover { transform: translateY(-5px); }
.cert-img-wrap { background: #f8f9fa; border-radius: 12px; padding: 30px; margin-bottom: 25px; flex: 1; display: flex; align-items: center; justify-content: center; border: 1px dashed #d0d5dc; min-height: 450px; overflow: hidden; }
.cert-img-wrap img { max-width: 100%; height: auto; box-shadow: 0 5px 15px rgba(0,0,0,0.1); }
.cert-placeholder { color: #999; }
.cert-placeholder i { font-size: 48px; color: #cbd3dc; margin-bottom: 10px; }
.cert-placeholder p { font-size: 15px; line-height: 1.5; }
.cert-info strong { display: block; font-size: 26px; color: #112B4D; font-weight: 700; margin-bottom: 5px; }
.cert-info span { font-size: 16px; color: #666; font-weight: 500; }

/* 4개의 항목 카드 영역 */
.env-grid { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.env-card { background: #fff; padding: 35px 30px; border: 1px solid #eaeaea; transition: all 0.3s ease; position: relative; overflow: hidden; display: flex; flex-direction: column; }
.env-card:hover { box-shadow: 0 15px 35px rgba(17,43,77,0.08); border-color: #112B4D; transform: translateY(-5px); }
.env-card::before { content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 100%; background: #112B4D; opacity: 0; transition: 0.3s; }
.env-card:hover::before { opacity: 1; }

.card-icon { font-size: 42px; color: #112B4D; margin-bottom: 20px; opacity: 1; }

.card-text h4 { font-size: 20px; font-weight: 700; color: #222; margin-bottom: 15px; display: flex; align-items: center; gap: 8px; letter-spacing: -0.5px; }
.card-text h4 span { color: #112B4D; font-weight: 900; font-size: 16px; }
.card-text ul { list-style: none; padding: 0; margin: 0; flex: 1; }
.card-text ul li { font-size: 15.5px; color: #555; line-height: 1.6; margin-bottom: 10px; padding-left: 14px; position: relative; word-break: keep-all; }
.card-text ul li:last-child { margin-bottom: 0; }
.card-text ul li::before { content: ''; position: absolute; left: 0; top: 10px; width: 5px; height: 5px; border-radius: 50%; background: #9bb0c9; transition: background 0.3s; }
.env-card:hover .card-text ul li::before { background: #112B4D; }

@media screen and (max-width: 1100px) {
    .esg-env-content { flex-direction: column; }
    .env-cert-box { flex: auto; max-width: 600px; margin: 0 auto; width: 100%; }
    .cert-img-wrap { min-height: 350px; }
}
@media screen and (max-width: 768px) {
    .env-grid { grid-template-columns: 1fr; gap: 20px; }
}

/* ===========================
   Social (사회) - Circle Image Layout
   =========================== */
.esg-social-circle-wrap { display: flex; flex-direction: column; gap: 100px; margin: 80px auto 0; max-width: 1200px; }
.sc-item { display: flex; align-items: center; gap: 80px; }
.sc-item.reverse { flex-direction: row-reverse; }
.sc-img { flex: 1; display: flex; justify-content: center; align-items: center; position: relative; }
.img-circle { width: 520px; height: 520px; border-radius: 43% 57% 65% 35% / 44% 53% 47% 56%; /* Default Blob */ background-size: cover; background-position: center; box-shadow: 0 30px 60px rgba(0,0,0,0.15); transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1), border-radius 0.6s ease; border: 4px solid #fff; position: relative; z-index: 2; }
/* 2 Animated Background Blobs */
.sc-img::before, .sc-img::after { content: ''; position: absolute; width: 500px; height: 500px; z-index: 1; transition: transform 0.6s ease; }

.sc-img::before { background: #eef1f6; animation: blobAnim1 12s infinite alternate ease-in-out; }
.sc-img::after { background: #f8fafc; animation: blobAnim2 15s infinite alternate-reverse ease-in-out; }

@keyframes blobAnim1 {
    0% { transform: translate(10px, -20px) scale(1) rotate(0deg); border-radius: 61% 39% 49% 51% / 44% 63% 37% 56%; }
    50% { transform: translate(-15px, 10px) scale(1.05) rotate(15deg); border-radius: 41% 59% 37% 63% / 54% 68% 32% 46%; }
    100% { transform: translate(20px, 15px) scale(0.95) rotate(-10deg); border-radius: 58% 42% 64% 36% / 42% 58% 42% 58%; }
}
@keyframes blobAnim2 {
    0% { transform: translate(-20px, 10px) scale(0.95) rotate(0deg); border-radius: 43% 57% 65% 35% / 44% 53% 47% 56%; }
    50% { transform: translate(15px, -25px) scale(1) rotate(-15deg); border-radius: 52% 48% 69% 31% / 43% 59% 41% 57%; }
    100% { transform: translate(-10px, 20px) scale(1.05) rotate(10deg); border-radius: 32% 68% 49% 51% / 63% 39% 61% 37%; }
}

/* Random Organic Shapes for the Main Image */
.sc-item:nth-child(1) .img-circle { border-radius: 43% 57% 65% 35% / 44% 53% 47% 56%; }
.sc-item:nth-child(2) .img-circle { border-radius: 66% 34% 45% 55% / 54% 43% 57% 46%; }
.sc-item:nth-child(3) .img-circle { border-radius: 38% 62% 44% 56% / 62% 38% 62% 38%; }
.sc-item:nth-child(4) .img-circle { border-radius: 52% 48% 69% 31% / 43% 59% 41% 57%; }

/* Randomize Animation Delays to look distinct */
.sc-item:nth-child(1) .sc-img::before { animation-delay: 0s; }
.sc-item:nth-child(1) .sc-img::after { animation-delay: -2s; }
.sc-item:nth-child(2) .sc-img::before { animation-delay: -5s; }
.sc-item:nth-child(2) .sc-img::after { animation-delay: -7s; }
.sc-item:nth-child(3) .sc-img::before { animation-delay: -10s; }
.sc-item:nth-child(3) .sc-img::after { animation-delay: -12s; }
.sc-item:nth-child(4) .sc-img::before { animation-delay: -15s; }
.sc-item:nth-child(4) .sc-img::after { animation-delay: -17s; }

.sc-item:hover .img-circle { transform: scale(1.05) translateY(-10px); }
.sc-item:hover::before { transform: scale(0.95); }

.sc-text { flex: 1; padding: 20px; z-index: 2; }
.sc-text h3 { font-size: 34px; font-weight: 800; color: #111; margin-bottom: 35px; position: relative; padding-bottom: 25px; letter-spacing: -1.5px; font-family: 'Montserrat', 'Escoredream', sans-serif; }
.sc-text h3::after { content: ''; position: absolute; bottom: 0; left: 0; width: 60px; height: 5px; background: var(--primary, #112B4D); border-radius: 3px; }
.sc-text ul { list-style: none; padding: 0; margin: 0; }
.sc-text ul li { font-size: 19px; color: #444; line-height: 1.8; margin-bottom: 18px; padding-left: 28px; position: relative; word-break: keep-all; font-weight: 500; }
.sc-text ul li:last-child { margin-bottom: 0; }
.sc-text ul li::before { content: ''; position: absolute; top: 13px; left: 0; width: 8px; height: 8px; border-radius: 50%; background: var(--accent, #e60012); box-shadow: 0 0 10px rgba(230,0,18,0.3); }

@media (max-width: 1024px) {
    .sc-item, .sc-item.reverse { flex-direction: column; text-align: center; gap: 50px; }
    .sc-text h3::after { left: 50%; transform: translateX(-50%); }
    .sc-text ul { text-align: left; display: inline-block; }
    .sc-text ul li { width: 100%; }
    .img-circle { width: 400px; height: 400px; border-radius: 90px; border-width: 4px; }
    .sc-img::before, .sc-img::after { width: 380px; height: 380px; }
    .sc-item::before { display: none; }
}
@media (max-width: 768px) {
    .esg-env-header { margin-bottom: 40px; }
    .esg-env-header.modern-title::before { font-size: 5.5rem; top: 0; }

    .esg-social-circle-wrap { gap: 80px; margin-top: 40px; }
    .img-circle { width: 320px; height: 320px; border-radius: 70px; border-width: 4px; }
    .sc-img::before, .sc-img::after { width: 300px; height: 300px; }
    .sc-text h3 { margin-bottom: 25px; padding-bottom: 20px; }
    .sc-text ul li { font-size: 17px; }
}

/* ===========================
   Report (리포트) - Vision Section
   =========================== */
.gmb-vision-section { text-align: center; margin-bottom: 60px; padding: 100px 30px; position: relative; background-image: url('../../images/fs/content/sub03/img_report.jpg'); background-size: cover; background-position: center; background-attachment: fixed; overflow: hidden; }
.gmb-vision-section::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.55); z-index: 1; }
.gmb-vision-section .vision-tit { position: relative; z-index: 2; font-size: 3.8rem; font-weight: 800; color: #fff; line-height: 1.4; margin-bottom: 25px; letter-spacing: -1.5px; word-break: keep-all; }
.gmb-vision-section .vision-desc { position: relative; z-index: 2; font-size: 1.8rem; color: #fff; opacity: 0.9; line-height: 1.6; word-break: keep-all; font-weight: 400; }
.gmb-vision-section .vision-desc strong { color: #fff; font-weight: 700; opacity: 1; border-bottom: 1px solid rgba(255,255,255,0.5); padding-bottom: 2px; }

.esg-new-section { position: relative; overflow: hidden; margin: 40px 0 0 0; padding: 60px 0 40px 0; }

/* Scrolling Outline Text Background */
.bg-scrolling-text { position: absolute; top: 50%; left: 0; transform: translateY(-50%); white-space: nowrap; font-size: 24rem; font-weight: 900; color: transparent; -webkit-text-stroke: 2px #f4f4f4; z-index: 1; pointer-events: none; opacity: 0.8; animation: marquee-scroll 40s linear infinite; }
@keyframes marquee-scroll {
    0% { transform: translate(0, -50%); }
    100% { transform: translate(-50%, -50%); }
}

.esg-circle-wrap { display: flex; justify-content: space-between; align-items: center; max-width: 1240px; margin: 0 auto; position: relative; z-index: 2; padding: 0 20px; gap: 20px; }
.esg-circle { flex: 1; aspect-ratio: 1 / 1; max-width: 400px; border-radius: 50%; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; color: #fff; padding: 40px; box-shadow: 0 15px 40px rgba(0,0,0,0.1); transition: transform 0.4s ease, box-shadow 0.4s ease; margin: 0 auto; }
.esg-circle:hover { transform: translateY(-15px); box-shadow: 0 25px 50px rgba(0,0,0,0.15); }

/* Colors matching the design */
.esg-circle.item-env { background: #c5cacd; }
.esg-circle.item-soc { background: #a79c93; }
.esg-circle.item-gov { background: var(--accent); }

.esg-circle .icon { margin-bottom: 25px; }
.esg-circle .icon svg { width: 70px; height: 70px; }

.esg-circle h4 { line-height: 1; font-size: 2.4rem; font-weight: 700; margin-bottom: 20px; letter-spacing: -0.5px; }

.esg-circle .desc p { font-size: 1.65rem; line-height: 1.6; word-break: keep-all; font-weight: 400; opacity: 0.95; }

/* Responsive */
@media screen and (max-width: 1200px) {
    .bg-scrolling-text { font-size: 18rem; }
    .esg-circle { max-width: 320px; padding: 30px; }
    .esg-circle .icon { margin-bottom: 20px; }
    .esg-circle .icon svg { width: 50px; height: 50px; }
    .esg-circle h3 { font-size: 2.8rem; margin-bottom: 15px; }
    .esg-circle .desc p { font-size: 1.45rem; }
}

@media screen and (max-width: 992px) {
    .esg-circle-wrap { flex-direction: column; gap: 40px; }
    .esg-circle { max-width: 350px; width: 100%; }
    .bg-scrolling-text { animation: marquee-scroll 20s linear infinite; font-size: 14rem; }
}

@media screen and (max-width: 768px) {
    .gmb-vision-section { padding: 60px 20px; margin-bottom: 40px; }
    .gmb-vision-section .vision-tit { font-size: 2.6rem; }
    .gmb-vision-section .vision-desc { font-size: 1.6rem; }

    .esg-new-section { margin: 20px 0 50px; padding: 40px 0; }
    .bg-scrolling-text { font-size: 10rem; }
    .esg-circle { max-width: 300px; padding: 25px; }
    .esg-circle h3 { font-size: 2.4rem; }
    .esg-circle .desc p { font-size: 1.4rem; }
}

/* ===========================
   핵심기술 (Core Tech)
   =========================== */
.tech_scroll_wrap { display: flex; align-items: flex-start; justify-content: space-between; gap: 5rem; padding: 10rem 0 10rem; font-family: 'Montserrat', 'Escoredream', sans-serif;}
.tech_left { width: 44.4%; position: sticky; top: 120px; height: calc(100vh - 200px); max-height: 550px; }
.tech_img_box { position: relative; width: 100%; height: 100%; overflow: hidden; background: #fafafa; }
.tech_img {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background-size: cover; background-position: center;
    display: flex; align-items: center; justify-content: center;
    font-size: 2.5rem; color: #999; font-weight: 700;
}

.tech_right { width: 55%; padding-bottom: 20vh; }
.tech_txt_block { display: flex; flex-direction: column; justify-content: center; min-height: 550px; padding: 5rem 0; border-bottom: 1px dashed #ddd; }
.tech_txt_block:last-child { border-bottom: none; }
.tech_num { font-size: 5.5rem; font-weight: 300; color: #e0e0e0; margin-bottom: -1rem; line-height: 1; font-family: 'Montserrat', sans-serif; letter-spacing: -2px; }
.tech_txt_block .h3tit { font-size: 3.2rem; font-weight: 800; color: #111; margin-bottom: 3.5rem; letter-spacing: -1px; position: relative; padding-bottom: 1.5rem; }
.tech_txt_block .h3tit::after { content: ''; position: absolute; bottom: 0; left: 0; width: 40px; height: 3px; background: #111; }
.tech_txt_block ul { display: flex; flex-direction: column; gap: 2rem; }
.tech_txt_block li { position: relative; padding-left: 1rem; }
.tech_txt_block li::before { content: ''; position: absolute; left: 0; top: 1.1rem; width: 5px; height: 5px; background: var(--accent); border-radius: 50%; }
.tech_txt_block li strong { display: inline-block; font-size: 1.8rem; font-weight: 600; color: #222; margin-bottom: 0.5rem; letter-spacing: -0.5px; }
.tech_txt_block li p { font-size: 1.6rem; color: #666; line-height: 1.6; word-break: keep-all; font-weight: 400; }
.tech_img_mobile { display: none; }

@media(max-width: 1024px) {
    .tech_scroll_wrap { flex-direction: column; gap: 3rem; padding: 4rem 0; }
    .tech_left { display: none; }
    .tech_right { width: 100%; padding-bottom: 0; }
    .tech_txt_block { min-height: auto; padding: 4rem 0; border-bottom: 1px dashed #ddd; }
    .tech_img_mobile {
        display: flex; align-items: center; justify-content: center;
        width: 100%; height: 350px; margin-top: 4rem;
        background-size: cover; background-position: center;
        font-size: 2.5rem; color: #999; font-weight: 700;
    }
}
@media(max-width: 768px) {
    .tech_txt_block .h3tit { font-size: 2.6rem; margin-bottom: 2.5rem; }
    .tech_txt_block li strong { font-size: 1.8rem; }
    .tech_txt_block li p { font-size: 1.5rem; }
    .tech_img_mobile { height: 250px; font-size: 2rem; margin-top: 3rem; }
}

/* ===========================
   Mold 변압기 (sub0202) - Split Layout
   =========================== */
.mold_split_wrap { display: flex; gap: 6rem; align-items: stretch; font-family: 'Pretendard', 'Escoredream', sans-serif; }
.mold_left { width: 45%; overflow: hidden; box-shadow: 0 15px 40px rgba(0,0,0,0.08); }
.mold_img_bg { width: 100%; height: 100%; min-height: 600px; background-size: cover; background-position: center; transition: transform 0.5s; }
.mold_left:hover .mold_img_bg { transform: scale(1.05); }

.mold_right { width: 55%; display: flex; flex-direction: column; justify-content: center; }
.mold_header { margin-bottom: 5rem; }
.mold_label { display: inline-block; padding: 0.6rem 1.6rem; background: var(--accent, #e60012); color: #fff; font-size: 1.4rem; font-weight: 600; border-radius: 30px; margin-bottom: 1.5rem; letter-spacing: -0.5px; }
.mold_tit { font-size: 4.2rem; font-weight: 800; color: #111; margin-bottom: 2rem; letter-spacing: -1.5px; }
.mold_tit span { font-size: 2.8rem; color: #777; font-weight: 600; display: inline-block; transform: translateY(-2px); }
.mold_tit span.font_eng { font-size: 4.2rem; font-weight: 800; color: #111; margin-bottom: 2rem; letter-spacing: -1.5px; }
.mold_subtit_box { padding-left: 2rem; border-left: 4px solid var(--accent, #e60012); margin-bottom: 2.5rem; }
.mold_subtit { font-size: 2.2rem; font-weight: 700; color: #222; letter-spacing: -1px; word-break: keep-all; line-height: 1.4; }
.mold_desc { background: #f8f9fa; padding: 2.5rem; border: 1px solid #eaeaea; }
.mold_desc p { font-size: 1.6rem; color: #555; line-height: 1.7; word-break: keep-all; font-weight: 400; }
.mold_desc p + p { margin-top: 1rem; }

.mold_location_card { display: flex; align-items: center; gap: 2.5rem; background: #fff; border: 1px solid #eaeaea; padding: 2.5rem 3rem; margin-bottom: 2rem; box-shadow: 0 5px 20px rgba(0,0,0,0.02); transition: 0.3s; }
.mold_location_card:hover { border-color: var(--accent, #e60012); box-shadow: 0 10px 30px rgba(0,0,0,0.06); }
.mold_location_card .loc_icon { width: 60px; height: 60px; background: #fdf2f2; color: var(--accent, #e60012); font-size: 2.4rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.mold_location_card .loc_info strong { display: block; font-size: 1.9rem; font-weight: 700; color: #111; margin-bottom: 0.5rem; letter-spacing: -0.5px; }
.mold_location_card .loc_info strong span { font-size: 1.5rem; color: #777; font-weight: 500; margin-left: 0.5rem; }
.mold_location_card .loc_info p { font-size: 1.6rem; color: #555; margin: 0; }

.mold_info_grid { display: flex; flex-wrap: wrap; gap: 2rem; }
.mold_info_card { flex: 1 1 240px; background: #fff; padding: 3.5rem 3rem; border: 1px solid #eaeaea; transition: border-color 0.3s; position: relative; overflow: hidden; }
.mold_info_card:hover { border-color: var(--accent, #e60012); }
.mold_info_card::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 4px; background: var(--accent, #e60012); opacity: 0; transition: 0.3s; }
.mold_info_card:hover::before { opacity: 1; }

.mold_info_card .icon { font-size: 3rem; color: var(--accent, #e60012); margin-bottom: 2rem; opacity: 0.8; }
.mold_info_card h5 { font-size: 2.2rem; font-weight: 700; color: #111; margin-bottom: 2rem; }
.mold_info_card ul { display: flex; flex-direction: column; gap: 1.2rem; }
.mold_info_card ul li { position: relative; padding-left: 1.8rem; font-size: 1.6rem; color: #555; line-height: 1.5; word-break: keep-all; }
.mold_info_card ul li::before { content: ''; position: absolute; left: 0; top: 1rem; width: 5px; height: 5px; background: #999; border-radius: 50%; transition: 0.3s; }
.mold_info_card:hover ul li::before { background: var(--accent, #e60012); }

.mold_icon_grid { display: flex; flex-wrap: wrap; gap: 2rem; margin-top: 2rem; }
.mold_icon_card { flex: 1 1 180px; background: #fff; padding: 3.5rem 2rem; border: 1px solid #eaeaea; text-align: center; transition: border-color 0.3s; position: relative; overflow: hidden; }
.mold_icon_card:hover { border-color: var(--accent, #e60012); }
.mold_icon_card::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 4px; background: var(--accent, #e60012); opacity: 0; transition: 0.3s; }
.mold_icon_card:hover::before { opacity: 1; }
.mold_icon_card .icon_circle { width: 80px; height: 80px; border-radius: 50%; border: 1px solid #ddd; display: flex; align-items: center; justify-content: center; font-size: 3rem; color: #999; margin: 0 auto 2rem; transition: 0.3s; }
.mold_icon_card:hover .icon_circle { border-color: var(--accent, #e60012); color: var(--accent, #e60012); }
.mold_icon_card h5 { font-size: 2.2rem; font-weight: 700; color: #111; margin-bottom: 1rem; }
.mold_icon_card p { font-size: 1.6rem; color: #666; word-break: keep-all; line-height: 1.5; }

/* Wide Cards (sub0205 bottom) - Glassmorphism Layout */
.mold_wide_grid { display: flex; flex-direction: column; gap: 2rem; margin-top: 5rem; padding: 5rem; background: url(../../images/fs/content/sub02/img0202_05.jpg) center/cover no-repeat; position: relative; }
.mold_wide_grid::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(17, 43, 77, 0.8); }

.mold_wide_card { display: flex; gap: 4rem; align-items: stretch; border: 1px solid rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); padding: 4rem 5rem; border-radius: 0; position: relative; z-index: 1; }
.mold_wide_card .wide_left { width: 45%; border-right: 1px solid rgba(255, 255, 255, 0.2); padding-right: 3rem; }
.mold_wide_card .wide_right { width: 55%; }

.mold_wide_card h5 { font-size: 2.2rem; font-weight: 700; color: #fff; margin-bottom: 2rem; line-height: 1.4; }
.mold_wide_card h5 span { font-size: 1.8rem; color: rgba(255,255,255,0.7); font-weight: 500; }
.mold_wide_card h5 span.font_eng { font-size: 2.2rem; font-weight: 700; color: #fff; margin-bottom: 2rem; line-height: 1.4; }
.mold_wide_card .stat_box { background: rgba(0, 0, 0, 0.2); padding: 1.5rem 2rem; border-left: 3px solid var(--accent, #e60012); }
.mold_wide_card .stat_box p { font-size: 1.6rem; color: #fff; line-height: 1.6; margin: 0; }
.mold_wide_card .dot_list { display: flex; flex-direction: column; gap: 1rem; }
.mold_wide_card .dot_list li { position: relative; padding-left: 1.5rem; font-size: 1.7rem; color: rgba(255,255,255,0.9); }
.mold_wide_card .dot_list li::before { content: ''; position: absolute; left: 0; top: 0.9rem; width: 4px; height: 4px; background: #fff; border-radius: 50%; }

@media(max-width: 1200px) {
    .mold_split_wrap { gap: 4rem; }
    .mold_tit { font-size: 3.6rem; }
}
@media(max-width: 1024px) {
    .mold_split_wrap { flex-direction: column; padding: 4rem 0 7rem; }
    .mold_left { width: 100%; }
    .mold_img_bg { min-height: 400px; }
    .mold_right { width: 100%; }
}
@media(max-width: 768px) {
    .mold_img_bg { min-height: 250px; }
    .mold_header { margin-bottom: 3.5rem; }
    .mold_tit { font-size: 2.8rem; }
    .mold_tit span { font-size: 2rem; }
    .mold_subtit { font-size: 1.8rem; }
    .mold_desc { font-size: 1.5rem; }
    .mold_location_card { flex-direction: column; text-align: center; gap: 1.5rem; padding: 2.5rem 2rem; }
    .mold_info_card { padding: 2.5rem; }
    .mold_info_card h5 { font-size: 2rem; }
    .mold_icon_card { padding: 2.5rem 2rem; }
    .mold_icon_card .icon_circle { width: 60px; height: 60px; font-size: 2.4rem; margin-bottom: 1.5rem; }
    .mold_icon_card h5 { font-size: 1.8rem; }
    .mold_icon_card p { font-size: 1.4rem; }
    .mold_wide_grid { gap: 2rem; margin-top: 3rem; padding: 2.5rem; }
    .mold_wide_card { flex-direction: column; gap: 2.5rem; padding: 3rem 2.5rem; align-items: stretch; text-align: left; }
    .mold_wide_card .wide_left { width: 100%; border-right: none; padding-right: 0; border-bottom: 1px solid rgba(255,255,255,0.2); padding-bottom: 2.5rem; }
    .mold_wide_card .wide_right { width: 100%; }
    .mold_wide_card h5 { font-size: 2rem; }
    .mold_wide_card h5 span { font-size: 1.6rem; }
    .mold_wide_card .stat_box p { font-size: 1.5rem; }
}




/* ===========================
   영문
   =========================== */
/* about us - Company Overview */
[lang="en"] .org_node {line-height:1.2;}

/* about us - vision */
[lang="en"] .text_merged p {font-size:1.8rem;}
[lang="en"] .text_merged strong {font-size:3.6rem;}

/* business - Core Technology */
[lang="en"] .tech_txt_block .h3tit {line-height:1.2;}
[lang="en"] .mold_tit span span.font_eng {font-size: 2.8rem;color: #777;font-weight: 600;display: inline-block;transform: translateY(-2px);}
@media(max-width: 768px) {
    [lang="en"] .mold_tit {line-height: 1;}
    [lang="en"] .mold_tit span.font_eng {margin-bottom:0;}
}

/* business - Mold Transformer */
[lang="en"] .mold_info_card h5 {line-height: 1;}

/* business - LV Coil & LV-TR */
[lang="en"] .mold_icon_card h5 {line-height: 1;}

/* business - R&D Center */
[lang="en"] .mold_location_card .loc_info strong span {margin-left:0;}
[lang="en"] .mold_location_card .loc_info strong {font-size: 1.5rem;color: #777;font-weight: 500;}

/* ESG Management - Social */
[lang="en"] .sc-text h3 {line-height:1.2;}

/* ESG Management - Report */
[lang="en"] .gmb-vision-section .vision-tit {font-size:3.2rem;}