* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Malgun Gothic','맑은 고딕','Microsoft JhengHei',sans-serif; color:#333; line-height:1.6; }
a { text-decoration:none; color:inherit; }

/* 顶部导航 */
header { position:fixed; top:0; left:0; width:100%; z-index:1000; background:rgba(255,255,255,0.98); box-shadow:0 2px 15px rgba(0,0,0,0.08); }
.nav-container { max-width:1200px; margin:0 auto; padding:0 30px; display:flex; align-items:center; gap:20px; height:72px; }
.logo { font-size:24px; font-weight:800; color:#0052cc; letter-spacing:1px; white-space:nowrap; }
.logo span { font-size:13px; color:#888; font-weight:400; display:block; letter-spacing:2px; }
nav { margin-left:auto; }
nav ul { display:flex; list-style:none; gap:26px; }
nav ul li a { font-size:16px; font-weight:600; color:#333; padding:8px 0; position:relative; transition:color .3s; white-space:nowrap; }
nav ul li a::after { content:''; position:absolute; bottom:0; left:0; width:0; height:2px; background:#0052cc; transition:width .3s; }
nav ul li a:hover, nav ul li a.active { color:#0052cc; }
nav ul li a:hover::after, nav ul li a.active::after { width:100%; }

/* 语言切换 */
.lang-switch { display:flex; align-items:center; gap:4px; font-size:14px; font-weight:600; }
.lang-switch button { border:none; background:none; cursor:pointer; color:#999; font-weight:600; font-size:14px; padding:4px 8px; border-radius:5px; transition:all .3s; white-space:nowrap; }
.lang-switch button.active { color:#0052cc; background:#eaf2ff; }
.lang-switch .divider { color:#ddd; }

/* 汉堡按钮 */
.hamburger { display:none; flex-direction:column; cursor:pointer; gap:5px; z-index:1100; }
.hamburger span { width:26px; height:3px; background:#0052cc; border-radius:2px; transition:all .3s; }
.hamburger.active span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
.hamburger.active span:nth-child(2){ opacity:0; }
.hamburger.active span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }

/* 左侧悬浮菜单栏 */
.side-nav { position:fixed; left:0; top:50%; transform:translateY(-50%); z-index:900; display:flex; flex-direction:column; gap:2px; }
.side-nav a { display:flex; align-items:center; background:#0052cc; color:#fff; width:52px; height:52px; overflow:hidden; white-space:nowrap; transition:width .35s ease; box-shadow:2px 2px 10px rgba(0,0,0,0.15); }
.side-nav a:first-child { border-top-right-radius:8px; }
.side-nav a:last-child { border-bottom-right-radius:8px; }
.side-nav a:hover { width:180px; background:#003d99; }
.side-nav a .icon { min-width:52px; text-align:center; font-size:20px; }
.side-nav a .txt { font-size:14px; font-weight:600; }
.side-nav a.top-btn { background:#1a2332; margin-top:8px; border-radius:8px; }
.side-nav a.top-btn:hover { background:#000; }

/* 轮播图 */
.slider { margin-top:72px; position:relative; width:100%; height:520px; overflow:hidden; }
.slides { display:flex; width:100%; height:100%; transition:transform .8s ease; }
.slide { min-width:100%; height:100%; position:relative; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#0052cc 0%,#0088ff 60%,#00b4d8 100%); color:#fff; text-align:center; }
.slide:nth-child(2){ background:linear-gradient(135deg,#003d99 0%,#0066cc 60%,#0099cc 100%); }
.slide:nth-child(3){ background:linear-gradient(135deg,#00408c 0%,#0077b6 60%,#48cae4 100%); }
.slide-content { z-index:2; animation:fadeUp 1s ease; padding:0 20px; }
.slide-content h2 { font-size:46px; font-weight:800; margin-bottom:18px; text-shadow:0 2px 12px rgba(0,0,0,0.2); }
.slide-content p { font-size:20px; opacity:0.95; }
@keyframes fadeUp { from{opacity:0;transform:translateY(30px);} to{opacity:1;transform:translateY(0);} }
.slider-btn { position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,0.2); border:none; color:#fff; width:48px; height:48px; border-radius:50%; font-size:24px; cursor:pointer; z-index:5; transition:background .3s; backdrop-filter:blur(4px); }
.slider-btn:hover { background:rgba(255,255,255,0.4); }
.prev { left:30px; } .next { right:30px; }
.dots { position:absolute; bottom:25px; left:50%; transform:translateX(-50%); display:flex; gap:12px; z-index:5; }
.dot { width:12px; height:12px; border-radius:50%; background:rgba(255,255,255,0.5); cursor:pointer; transition:all .3s; }
.dot.active { background:#fff; width:32px; border-radius:6px; }

/* 内页横幅 */
.page-banner { margin-top:72px; height:280px; background:linear-gradient(135deg,#0052cc 0%,#0088ff 60%,#00b4d8 100%); display:flex; align-items:center; justify-content:center; flex-direction:column; color:#fff; text-align:center; }
.page-banner h1 { font-size:42px; font-weight:800; margin-bottom:12px; animation:fadeUp .8s ease; }
.page-banner p { font-size:17px; opacity:0.9; animation:fadeUp 1s ease; }

/* 区块 */
section { padding:80px 30px; max-width:1200px; margin:0 auto; }
.section-title { font-size:32px; font-weight:800; margin-bottom:45px; color:#1a1a1a; border-left:5px solid #0052cc; padding-left:18px; }
.about-text { font-size:17px; color:#555; line-height:2; max-width:900px; }
.about-text strong { color:#0052cc; }

/* 公司数据卡片 */
.stats { display:grid; grid-template-columns:repeat(4,1fr); gap:25px; }
.stat-item { background:linear-gradient(135deg,#0052cc,#0088ff); color:#fff; border-radius:16px; padding:40px 20px; text-align:center; box-shadow:0 8px 25px rgba(0,82,204,0.2); transition:transform .4s; }
.stat-item:hover { transform:translateY(-8px); }
.stat-num { font-size:38px; font-weight:800; margin-bottom:8px; }
.stat-label { font-size:15px; opacity:0.9; }
.about-long p { font-size:16px; color:#555; line-height:2; margin-bottom:24px; text-align:justify; }
.about-long p:last-child { margin-bottom:0; }

/* 服务流程 */
.process-section { background:#f8faff; max-width:100%; }
.process-section > * { max-width:1200px; margin-left:auto; margin-right:auto; }
.process { display:flex; align-items:stretch; justify-content:center; gap:10px; flex-wrap:wrap; }
.process-step { background:#fff; border:1px solid #e8f0fe; border-radius:14px; padding:30px 24px; text-align:center; flex:1; min-width:180px; transition:all .3s; }
.process-step:hover { transform:translateY(-6px); box-shadow:0 10px 30px rgba(0,82,204,0.12); }
.ps-num { width:44px; height:44px; margin:0 auto 14px; background:linear-gradient(135deg,#0052cc,#0088ff); color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:20px; font-weight:800; }
.process-step h4 { font-size:17px; color:#0052cc; margin-bottom:8px; }
.process-step p { font-size:14px; color:#777; }
.process-arrow { display:flex; align-items:center; font-size:28px; color:#0052cc; font-weight:700; }

/* 服务卡片 */
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }
.card { background:#fff; border:1px solid #eee; border-radius:14px; padding:38px 32px; transition:all .4s; }
.card:hover { transform:translateY(-10px); box-shadow:0 15px 40px rgba(0,82,204,0.15); border-color:#0052cc; }
.card .num { font-size:28px; font-weight:800; color:#0052cc; margin-bottom:14px; }
.card h3 { font-size:20px; font-weight:700; margin-bottom:14px; }
.card p { font-size:15px; color:#777; line-height:1.8; }

/* 产品 */
.products { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.product-item { border-radius:14px; overflow:hidden; box-shadow:0 4px 20px rgba(0,0,0,0.06); transition:all .4s; background:#fff; }
.product-item:hover { transform:translateY(-8px); box-shadow:0 12px 35px rgba(0,0,0,0.12); }
.product-img { height:220px; background:linear-gradient(135deg,#e8f0fe,#d0e2ff); display:flex; align-items:center; justify-content:center; color:#0052cc; font-size:15px; font-weight:600; }
.product-info { padding:22px; }
.product-info h4 { font-size:18px; margin-bottom:8px; }
.product-info p { font-size:14px; color:#888; }

/* 联系 */
.contact-box { display:grid; grid-template-columns:repeat(2,1fr); gap:30px; margin-top:20px; }
.contact-item { background:#f8faff; border:1px solid #e8f0fe; border-radius:14px; padding:24px 30px; transition:all .3s; }
.contact-item:hover { box-shadow:0 10px 30px rgba(0,82,204,0.1); transform:translateY(-5px); }
.contact-item .ic { font-size:26px; margin-bottom:8px; }
.contact-item h4 { font-size:17px; color:#0052cc; margin-bottom:6px; }
.contact-item p { font-size:16px; color:#444; }

/* 图标链接卡片 */
.link-item { display:flex; align-items:center; gap:16px; text-decoration:none; }
.link-item img { width:48px; height:48px; object-fit:contain; border-radius:10px; flex-shrink:0; }
.link-item .link-text h4 { margin-bottom:4px; }
.link-item .link-text p { font-size:15px; color:#666; }

/* 页脚 */
footer { background:#1a2332; color:#aaa; padding:50px 30px 30px; text-align:center; margin-top:40px; }
footer .fcompany { font-size:20px; color:#fff; font-weight:700; margin-bottom:8px; }
footer p { font-size:14px; margin:4px 0; }
footer .copy { margin-top:20px; font-size:13px; color:#666; border-top:1px solid #333; padding-top:20px; }

/* ===== 平板/手机 (≤992) ===== */
@media(max-width:992px){
  .hamburger { display:flex; order:0; }
  .logo { order:1; font-size:20px; }
  .logo span { display:none; }
  nav { margin-left:0; }
  .lang-switch { order:2; margin-left:auto; }

    nav ul {
    position:fixed; top:72px; left:0; right:auto;
    width:30%; min-width:140px; max-width:220px; height:calc(100vh - 72px);
        background:rgba(255,255,255,0.55); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
    flex-direction:column; gap:0; padding:12px 0;
    box-shadow:2px 6px 24px rgba(0,0,0,0.12);
    transform:translateX(-105%); transition:transform .35s ease;
  }
  nav ul.open { transform:translateX(0); }
  nav ul li { width:100%; }
  nav ul li a { display:block; padding:16px 30px; font-size:16px; border-bottom:1px solid rgba(240,240,240,0.5); }
  nav ul li a::after { display:none; }
  nav ul li a:hover, nav ul li a.active { background:rgba(245,249,255,0.6); }
  nav ul.open { transform:translateX(0); }
  nav ul li { width:100%; }
  nav ul li a { display:block; padding:14px 28px; font-size:16px; border-bottom:1px solid rgba(240,240,240,0.5); }
  nav ul li a::after { display:none; }
  nav ul li a:hover, nav ul li a.active { background:rgba(245,249,255,0.7); }

  .side-nav { display:none; }
  .cards,.products { grid-template-columns:repeat(2,1fr); }
}

/* ===== 手机 (≤768) ===== */
@media(max-width:768px){
  .nav-container { padding:0 18px; gap:14px; }
  .cards,.products,.contact-box { grid-template-columns:1fr; }
  .stats { grid-template-columns:repeat(2,1fr); gap:15px; }
  .stat-num { font-size:28px; }
  .slider { height:400px; }
  .slide-content h2 { font-size:26px; }
  .slide-content p { font-size:15px; }
  .page-banner { height:200px; }
  .page-banner h1 { font-size:26px; }
  section { padding:50px 20px; }
  .section-title { font-size:24px; }
  .about-long p { font-size:15px; }
  .process-arrow { transform:rotate(90deg); }
  .process-step { min-width:100%; }
}
/* 修改原本的 logo 样式，加上 flex 布局让它横向排列 */
.logo {
    display: flex;          /* 让图片和文字横向并排 */
    align-items: center;    /* 关键：让Logo和右边文字垂直居中对齐（平行） */
}

/* 设置你的正方形Logo大小 */
.logo-img {
    height: 42px;           /* 根据你实际两行文字的高度进行调整，比如50px或60px */
    width: 42px;            /* 正方形，和高度保持一致 */
    margin-right: 10px;     /* Logo 和文字之间的间距，自己微调 */
    object-fit: contain;
}

/* 把文字上下排列 */
.logo-text {
    display: flex;
    flex-direction: column; /* 让韩文和英文上下分两行 */
    line-height: 1.2;       /* 调整行高，让两行字更紧凑，总高度刚好跟Logo一样 */
}
/* 外层容器：让Logo和文字横向排列，垂直居中对齐，并在页面中间 */
.footer-container {
  display: flex;
  justify-content: center; /* 整体居中，如果喜欢靠左，改为 flex-start */
  align-items: center;     /* 垂直居中（平行） */
  gap: 40px;               /* Logo与文字之间的间距 */
  padding: 40px 20px;      /* 上下左右留白，可根据您的实际页面微调 */
}

/* 控制Logo大小，不要太大显得突兀 */
.footer-logo-img {
  width: 80px;             /* 高度和宽度一样，正方形。可以按F12微调这个数值 */
  height: 80px;
  object-fit: contain;
  margin-top: -15px;
  
  /* 【防突兀秘诀】深色底+白底Logo会很刺眼。如果您的Logo是白底的，加上这句让它变白完美融入 */
  /* filter: brightness(0) invert(1); */
  
  /* 如果是透明Logo，不想变白，可以保留原本颜色，稍微给点透明度 */
  /* opacity: 0.9; */
  
  border-radius: 8px;      /* 如果Logo带白底，稍微给个圆角会柔和很多 */
}

/* 文字区域保持原有排版，建议左对齐 */
.footer-text-box {
  text-align: left;
}

/* 手机端适配（防止手机上挤成一团） */
@media (max-width: 768px) {
  .footer-container {
    flex-direction: column; /* 手机上变成上下排列 */
    gap: 20px;
  }
  .footer-text-box {
    text-align: center;    /* 手机上文字恢复居中 */
  }
}