html, body { overflow-x: hidden !important; width: 100%; } 

html[lang="ko"] p,
html[lang="ko"] .text { word-break: keep-all; } 

body { padding-top: 70px; font-family: "Poppins",
-apple-system, BlinkMacSystemFont,
"Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell,
"Helvetica Neue", sans-serif; } 

#nav-placeholder { position: absolute; width: 100%; top: 0; } 

/* 한국어 페이지에만 Pretendard 적용 */
html[lang="ko"] body { font-family: 'Pretendard', -apple-system, BlinkMacSystemFont,
 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
 'Helvetica Neue', sans-serif !important; } 


:root { --main-color: #005EAD; --text-dark: #333; --text-light: #555555; --sub-text:#666666 } 

.py-8 { padding-top: 6rem; padding-bottom: 6rem; } 
.py-3 { padding-top: 3rem; padding-bottom: 3rem; } 
.pt-0 { padding-top: 0; } 
.mt-2 { margin-top: 2rem !important; } 
.mt-3 { margin-top: 2rem !important; } 
.mt-6 { margin-top: 4rem !important; } 
.mt-8 { margin-top: 4rem !important; } 
.mb-3 { margin-bottom: 3rem !important; } 
.mb-4 { margin-bottom: 4rem !important; } 
.mb-6 { margin-bottom: 6rem !important; } 
.mb-8 { margin-bottom: 4rem !important; } 

#nav-placeholder.nav-fixed { position: fixed; top: 0; width: 100%; z-index: 999; background: #fff; /* 덮여 보이지 않도록 배경 추가 */
 box-shadow: 0 2px 10px rgba(0,0,0,0.08); /* 선택 (고정 시 그림자) */}

#nav-placeholder.nav-fixed + * { margin-top: 100px; } 

.logo { height: 54px; width: auto; } 
.navbar-collapse { padding:10px 0 } 

.heading-main { color: var(--main-color); } 
.btn-main { background-color: var(--main-color); color: #fff; } 
.section-title { color: var(--main-color); font-size:25px !important; font-weight: 500 !important; } 

/* Sticky Header Shadow */
.navbar-brand { padding:0; } 
.navbar-toggler { border:0; padding:0; } 
.navbar-toggler:focus { box-shadow:none; } 
.navbar.sticky-top { box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08); } 
.navbar .nav-item { padding:0 10px; text-align:center; } 
.navbar .lang { justify-content: center; } 
.navbar .lang select { border:none; font-size:16px !important; } 
.navbar .nav-link.active, .navbar .nav-link.show { color: var(--main-color); } 
.navbar .nav-link { color: var(--text-dark); } 

.nav-link { font-size: 17px !important; } 

/* HERO SWIPER */
.hero-swiper { height: calc(60vh - 100px); /* nav 100px 기준 통일 */ } 
.hero-slide { height: 100%; background-size: cover; background-position: center; position: relative; } 

/* 슬라이드 내부 세로 중앙 정렬 */
.hero-inner { position: relative; z-index: 2; height: 100%; display: flex; align-items: center; /* 상하 가운데 */ } 
.swiper-pagination-bullet-active { background-color: #1075cd!important; opacity:1!important;; } 
.swiper-pagination-bullet { background-color:#fff; opacity:0.3; } 

.hero-overlay { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.45); z-index: 1; } 
.hero-content { margin-right:20px; color: #fff; /* margin-left 제거 */ } 
.hero-content h1 { font-size: 31px !important; line-height: 1.15; font-weight: 500 !important; margin-bottom: 25px; max-width:350px; } 
.hero-content p { font-size: 14px !important; font-weight: 300 !important; } 

.swiper-pagination { margin-bottom:10px; } 

.service-card img { width: 100%; } 
.service-card h5 { font-size: 19px !important; margin-bottom: .6rem; } 


.why-section { background: #f6f8fc; padding: 6rem 0; } 
.why-section h5,
.service-section h5 { font-size: 20px !important; color: var(--main-color); font-weight: 400 !important; margin-bottom: 12px; } 
.history .row p,
.why-section .row p,
.service-section .row p { padding:0; max-width: 570px; line-height: 1.6rem; } 

.footer { text-align: center; font-size: 11px; color: #666; } 

.row p { font-size: 14px !important; color: var(--sub-text); font-weight:300; padding: 0 2rem; } 
.text-muted { font-size: 15px !important; color: var(--sub-text)!important; font-weight: 300; padding: 0 2rem; } 

/* Buttons */
.btn, .btn-outline-primary, .btn-primary { font-size: 16px !important; padding: 18px 20px; min-width: 170px; } 
.btn-outline-primary, .btn-primary { --bs-btn-border-color: #005EAD; --bs-btn-hover-bg: #005EAD; font-size:16px!important; } 

.btn-outline-primary { --bs-btn-color: #005EAD; } 
.btn-primary { --bs-btn-bg: #005EAD; } 
/* NAV menu font */

/* ---------------service------------ */
.service-list { margin-top:15px; padding-left:1rem; } 
.service-list li { margin-bottom: 6px; font-size: 15px; color: var(--sub-text); font-weight: 300 !important; } 
.wel-img { height: 244px; /* 모바일에서는 낮게 */
 margin-bottom:20px; width: 100%; background-size: cover; background-position: center center; background-repeat: no-repeat; } 
.why-img { width: 100%; height: 280px; background-size: cover; background-position: center center; background-repeat: no-repeat; } 
.service-img { width: 100%; height: 210px; background-size: cover; background-position: center center; background-repeat: no-repeat; } 


/* ABOUT PAGE */
.history h4 { color: var(--main-color); font-size:20px; font-weight:700; } 
.history .row p { font-size: 14px !important; line-height: 1.9; margin-bottom:0 } 

/* .about-hero { height: 628px; background-image: url("../assets/img/office-building.jpg"); background-size: cover; background-position: center bottom; background-repeat: no-repeat; background-attachment: fixed; }  */

.about-hero {
    width: 100%;
    height: 180px; /* 기존 패럴럭스 섹션 높이 그대로 유지 */
    background-color: #ffffff; /* 흰 배경 */
    background-image: url("../assets/img/office-building.jpg"); /* 로고 이미지 경로 */
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain; /* 로고 전체 보이도록 */
}

/* 모바일 최적화 */
@media (max-width: 768px){

 .about-hero {height: 110px;}
 }

/* 아주 작은 화면 (아이폰 SE 등) */
@media (max-width: 480px){
 .about-hero { height: 35vh; } 
 }

.about-list { margin-top:10px; } 
.about-list li { margin-bottom: 6px; font-size: 15px; color: var(--sub-text); } 

.history .col-md-8 .exp-item:last-child { border:none; } 
.exp-item { box-sizing: border-box; width: 100%; border-bottom: 1px solid #e9ecef; padding: 30px 0; display: flex; flex-direction: column; } 

.exp-year { font-weight: 600; color: var(--main-color); font-size: 20px; margin-bottom: 6px; padding-right: 10px; } 
.exp-year span { display:block; font-size: 14px; color: var(--text-light); font-weight: 400; margin-bottom: 5px; } 
.exp-detail { color: #555; font-size: 15px; } 

/* Human Network Cards */
.network-card { background: #fff; padding: 30px 15px 10px; border-radius: 10px; box-shadow: 0 4px 15px rgba(0,0,0,0.05); min-height: 260px; } 
html[lang="ko"] .network-card { min-height: 242px; } 
.network-icon { width: 78px; margin-bottom: 20px; } 
.network-title { font-size:18px; font-weight: 600; color: var(--main-color); } 
.row .network-text { font-size: 13px !important; color: #777; padding:0 1rem; margin-bottom:0; } 

/* 화살표 공통 스타일 */
.arrow { display: inline-block; margin-left: 8px; transition: transform 0.3s ease; } 

.btn-custom { display: inline-flex; align-items: center; justify-content: center; padding: 19px 24px; min-width: 260px; border-radius: 5px; font-size: 18px; font-weight: 400; transition: all 0.3s ease; text-decoration: none; } 
/* -------------------------
 1) OUTLINE BUTTON
-------------------------- */
.btn-outline-custom { border: 2px solid #1e58a8; background: transparent; color: #1e58a8; } 

.btn-outline-custom:hover { background-color: #1e58a8; color: #fff; transform: translateY(-3px); } 

.btn-outline-custom:hover .arrow { transform: translateX(6px); /* 화살표 슬라이드 */}


/* -------------------------
 2) PRIMARY BUTTON
-------------------------- */
.btn-primary-custom { border: 3px solid #1e58a8; background-color: #1e58a8; color: #fff; margin:0 10px}

.btn-primary-custom:hover { background-color: #174a8c; border-color: #174a8c; transform: translateY(-3px); } 

.btn-primary-custom:hover .arrow { transform: translateX(6px); /* 화살표 슬라이드 */}


/* Floating Email Button */
.floating-email { position: fixed; right: 30px; bottom: 30px; display: flex; align-items: center; background: #e9f2ff; border-radius: 60px; box-shadow: 0 6px 14px rgba(0,0,0,0.15); cursor: pointer; z-index: 999; transition: all .3s ease; } 

/* icon circle */
.floating-email .email-icon { width: 70px; height: 70px; min-width: 54px; background: #205fa8; border-radius: 50%; display:flex; align-items:center; justify-content:center; transition: transform .3s; } 

/* text */
.floating-email .email-text { color: #205fa8; font-weight: 500; white-space: nowrap; opacity: 0; transform: translateX(20px); transition: opacity .4s ease, transform .4s ease; } 

/* show animation */
.floating-email.show .email-text { font-size: 18px; opacity: 1; transform: translateX(0); padding: 0 10px 0 20px; } 

/* hide text (collapse) */
.floating-email.hide-text .email-text { opacity: 0; transform: translateX(20px); pointer-events: none; font-size:0; padding: 0}

/* hover effect */
.floating-email:hover .email-icon { transform: translateY(-4px); } 

/* mobile: icon only */
@media (max-width: 768px){
 .floating-email { padding: 0; transform: scale(0.8); transform-origin: bottom right; right: 20px; bottom: 20px; } 
 .exp-item { flex-direction: column; padding:20px 0; } 
 }

/* -------------------------
 MOBILE RESPONSIVE
-------------------------- */
@media (max-width: 576px){
 .py-8 { padding-top: 4rem; padding-bottom: 4rem; } 

 .btn-outline-custom,
 .btn-primary-custom { padding: 16px 20px; font-size: 16px; min-width: 200px; margin:10px 0; } 
 .row>* { padding-right: 20px; padding-left: 20px; margin-top:30px; } 
 .contect .row > div:first-child { margin-top:0; } 
 .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl { padding-right: 20px; padding-left: 20px } 
 .service-block .row>* { margin-top:20px; } 
 .icon-row.row>* { padding-right: 5px; padding-left: 5px; margin-top: 10px; } 
}



@media (min-width: 992px) { body { padding-top: 100px; } 
 .row>* { padding-right: 20px; padding-left: 20px } 
 .icon-row.row>* { padding-right: 5px; padding-left: 5px } 
 .logo { height: 32px; } 

 .py-8 { padding-top: 9rem; padding-bottom: 9rem; } 
 .py-3 { padding-top: 4rem; padding-bottom: 4rem; } 
 .mt-2 { margin-top: 3rem !important; } 
 .mt-3 { margin-top: 4rem !important; } 
 .mt-6 { margin-top: 6rem !important; } 
 .mt-8 { margin-top: 8rem !important; } 
 .mb-3 { margin-bottom: 4rem !important; } 
 .mb-4 { margin-bottom: 5rem !important; } 
 .mb-6 { margin-bottom: 8rem !important; } 
 .mb-8 { margin-bottom: 9rem !important; } 

 .navbar { height: 100px; padding: 0; } 
 .navbar .container { height: 100%; } 
 .navbar-brand,
 .navbar-nav,
 .navbar-collapse { height: 100%; display: flex; align-items: center; padding:0; } 


 .logo { height: 72px; } 
 .align-items-center { min-width:151px; } 

 .hero-swiper { height: calc(70vh - 100px); /* nav 100px 기준 통일 */ } 

 /* HERO */
 .hero-content { max-width: 800px; } 
 .hero-content h1 { font-size: 68px !important; line-height: 1.15; font-weight: 600 !important; margin-bottom: 40px; max-width:fit-content } 

 .hero-content p { font-size: 24px !important; font-weight: 300 !important; } 

 .section-title { font-size: 42px !important; font-weight: 500 !important; margin-bottom:15px; } 
 .service-card h5 { font-size: 24px !important; margin-bottom: .8rem; } 
 .why-section { padding: 8rem 0; } 
 .why-section h5,
 .service-section h5 { font-size: 28px !important; font-weight: 400 !important; margin-bottom: 20px; } 
 .row p { font-size: 15px !important; } 

 /* General muted text */
 .text-muted { font-size: 18px !important; padding: 0 } 

 .service-list { margin-top:30px } 
 .wel-img { height: 388px; /* 기본 높이 (PC 기준) */
 margin-bottom:30px; } 
 .why-img { height: 541px; /* 기본 높이 (PC 기준) */}
 .service-img { height: 440px; } 
 .history .row p { font-size: 16px !important; } 
 .history h4 { font-size:28px; } 
 .exp-item { flex-direction: row; } 
 .exp-year { font-size: 23px; } 
 .network-card { padding: 50px 30px 30px; min-height: 310px; } 
 html[lang="ko"] .network-card { min-height: 310px; } 
 .network-icon { width: 92px; margin-bottom: 30px; } 
 .navbar .lang { justify-content: end; } 
 .navbar-toggler { padding: var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x); } 
 .network-title { font-size:21px; } 
 .row .network-text { font-size: 14px !important; padding:0 2rem; margin-bottom:0; } 
 html[lang="ko"] .text-muted br { display:none; } 
 }

@media (max-width: 991px) {.exp-year { width: auto; } 
 }

