/* === 四川川拓律师事务所 === */
:root {
  --primary: #0a1628;
  --accent: #c9a84c;
  --header-h: 80px;
  --header-h-mobile: 60px;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family: "PingFang SC","Microsoft YaHei",Arial,sans-serif;
  font-size:16px; line-height:1.7;
  color:#2c3e50; background:#fff;
}
a { color:#2c3e50; text-decoration:none; transition:all .3s ease; }
a:hover { color:#c9a84c; }
img { max-width:100%; height:auto; display:block; }
ul, ol { list-style:none; }

/* ====== Header (homepage: wraps banner + nav) ====== */
.header {
  position:relative; width:100%;
  background:#0a1628;
}

/* ====== Hero Video Banner ====== */
.pc_banner {
  width:100%; height:520px; overflow:hidden; background:#000;
}
.pcbanner, .pcbanner .swiper-wrapper { width:100%; height:100%; }
.pcbanner .swiper-slide-box {
  position:relative; width:100%; height:100%; overflow:hidden;
}
.pcbanner .swiper-slide-box video { width:100%; height:100%; object-fit:cover; display:block; }
.pcbanner .swiper-slide-box::after {
  content:""; position:absolute; inset:0;
  background:linear-gradient(135deg,rgba(10,22,40,.6),transparent);
  pointer-events:none;
}

/* ====== Navigation Bar (sticky at top) ====== */
.head_top {
  height:var(--header-h); z-index:50;
  background:linear-gradient(0deg,rgba(10,22,40,.95),rgba(10,22,40,.8));
}
#header .head_top {
  position:sticky; top:0;
  background:#0a1628;
}
.head_top .center {
  max-width:1400px; margin:0 auto; padding:0 40px;
  height:100%;
}
.head_top .box {
  height:100%; display:flex; align-items:center;
}
.head_top .box .logo { flex-shrink:0; margin-right:40px; }
.head_top .box .logo a { display:block; }
.head_top .box .logo img { height:40px; display:block; }
.head_top .box .nav { flex:1; display:flex; align-items:center; }
.head_top .box .nav ul { display:flex; align-items:center; justify-content:center; gap:2px; width:100%; }
.head_top .box .nav ul > li { position:relative; list-style:none; }
.head_top .box .nav ul > li > a {
  display:block; padding:0 20px;
  height:var(--header-h); line-height:var(--header-h);
  color:#fff; font-size:15px; font-weight:500;
  white-space:nowrap;
}
.head_top .box .nav ul > li > a:hover { color:#c9a84c; }
.head_top .box .nav li .v_list {
  display:none; position:absolute;
  top:var(--header-h); left:50%; transform:translateX(-50%);
  min-width:160px; background:#fff;
  border-radius:0 0 8px 8px;
  box-shadow:0 8px 30px rgba(0,0,0,.15); z-index:100;
  padding:6px 0;
}
.head_top .box .nav li .v_list a {
  display:block; padding:10px 24px;
  color:#2c3e50; font-size:14px; white-space:nowrap;
}
#page_header .nav li:hover > .v_list { display:block; }
.head_top .box .nav li .v_list a:hover { color:#c9a84c; background:#f4f6f9; }
.head_top .box .search { flex-shrink:0; margin-left:20px; }
.head_top .box .search .so { position:relative; }
.head_top .box .search .inp1 {
  width:180px; height:36px;
  padding:0 36px 0 14px;
  border:1px solid rgba(255,255,255,.25);
  border-radius:18px; background:rgba(255,255,255,.1);
  color:#fff; font-size:13px; outline:none;
}
.head_top .box .search .inp1::placeholder { color:rgba(255,255,255,.4); }
.head_top .box .search .inp2 {
  position:absolute; right:3px; top:50%; transform:translateY(-50%);
  width:30px; height:30px; border:none; outline:none;
  background:#c9a84c; border-radius:50%; cursor:pointer;
  color:#fff; font-size:14px; display:flex;
  align-items:center; justify-content:center;
}

/* ====== Inner Page Header (nav only, no hero banner) ====== */
#page_header {
  position:sticky; top:0; z-index:1000;
  background:#0a1628;
}
#page_header .head_top {
  position:relative; background:#0a1628;
}

/* ====== Inner Page Banner ====== */
.page_banner {
  position:relative; width:100%; height:320px; overflow:hidden;
  background:#0a1628; display:flex; align-items:center; justify-content:center;
}
.page_banner .pcimg { display:block; width:100%; height:100%; object-fit:cover; }
.page_banner .text {
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  background:rgba(10,22,40,.55);
  z-index:2;
}
.page_banner .text .box_tit { margin-bottom:0; }
.page_banner .text .box_tit span { color:rgba(255,255,255,.6); font-size:14px; letter-spacing:4px; }
.page_banner .text .box_tit h3 { color:#fff; font-size:36px; }
.page_banner .text .box_tit h3::after { background:#c9a84c; }
.page_banner img[alt=""] { display:none; }

/* ====== Mobile Header ====== */
.m_header { display:none; }
.m_banner { display:none; }

/* ====== Content Area ====== */
.main { background:#fff; }
.center { max-width:1200px; margin:0 auto; padding:0 24px; }
section, [class^="i_box"] { padding:80px 0; }
[class^="i_box"]:nth-child(even) { background:#f4f6f9; }

.box_tit { text-align:center; margin-bottom:50px; }
.box_tit span {
  display:block; font-size:13px; color:#c9a84c;
  letter-spacing:3px; margin-bottom:6px; font-weight:600;
}
.box_tit h3 { font-size:34px; font-weight:700; color:#0a1628; margin-bottom:12px; }
.box_tit h3::after {
  content:""; display:block; width:50px; height:3px;
  background:#c9a84c; margin:14px auto 0; border-radius:2px;
}
.box_tit i { display:none; }
.box_tit p { color:#7f8c8d; font-size:15px; max-width:600px; margin:14px auto 0; }
.more { text-align:center; margin-top:40px; }
.more a {
  display:inline-block; padding:10px 30px;
  border:2px solid #c9a84c; color:#c9a84c;
  border-radius:30px; font-size:14px; font-weight:600;
}
.more a:hover { background:#c9a84c; color:#fff; }

/* Content page text */
.content { padding:30px 0; line-height:2; font-size:15px; color:#2c3e50; }
.content p { margin-bottom:16px; }

/* ====== Grid Sections (Homepage) ====== */
.i_box1 .box ul { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.i_box1 .box ul li {
  position:relative; background:#fff; border-radius:12px;
  box-shadow:0 2px 20px rgba(0,0,0,.08); overflow:hidden; transition:all .3s ease;
}
.i_box1 .box ul li:hover { transform:translateY(-4px); box-shadow:0 8px 40px rgba(0,0,0,.12); }
.i_box1 .box ul li .text { padding:36px 24px; text-align:center; position:relative; }
.i_box1 .box ul li .text img { width:56px; height:56px; margin:0 auto 16px; object-fit:contain; }
.i_box1 .box ul li .text span { display:block; font-size:17px; font-weight:700; color:#0a1628; margin-bottom:10px; }
.i_box1 .box ul li .text p { font-size:14px; color:#7f8c8d; line-height:1.8; }
.i_box1 .box ul li .text a { position:absolute; inset:0; z-index:1; }

.i_box3 .box ul { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.i_box3 .box ul li { position:relative; border-radius:12px; overflow:hidden; box-shadow:0 2px 20px rgba(0,0,0,.08); transition:all .3s ease; }
.i_box3 .box ul li:hover { transform:translateY(-4px); box-shadow:0 8px 40px rgba(0,0,0,.12); }
.i_box3 .box ul li img { width:100%; height:260px; object-fit:cover; }
.i_box3 .box ul li .text { position:absolute; inset:0; background:linear-gradient(0deg,rgba(10,22,40,.85),transparent 60%); display:flex; flex-direction:column; justify-content:flex-end; padding:24px; color:#fff; }
.i_box3 .box ul li .text span { font-size:18px; font-weight:700; margin-bottom:6px; }
.i_box3 .box ul li .text p { font-size:14px; opacity:.9; }

.pro_list ul { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.pro_list ul li a { display:block; background:#fff; border-radius:12px; overflow:hidden; box-shadow:0 2px 20px rgba(0,0,0,.08); text-align:center; transition:all .3s ease; }
.pro_list ul li a:hover { transform:translateY(-4px); box-shadow:0 8px 40px rgba(0,0,0,.12); }
.pro_list ul li a .imgauto { width:140px; height:140px; border-radius:50%; margin:24px auto 0; overflow:hidden; border:3px solid #f4f6f9; }
.pro_list ul li a .imgauto img { width:100%; height:100%; object-fit:cover; }
.pro_list ul li a .text { padding:16px; }
.pro_list ul li a .text span { font-size:17px; font-weight:700; color:#0a1628; }

.i_box5 .text { padding:30px 0; }
.i_box5 .text p { font-size:15px; color:#555; line-height:2; }

.box5_lisst { margin-top:40px; }
.box5_lisst .list ul { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.box5_lisst .list ul li { display:flex; align-items:flex-start; gap:14px; padding:20px; background:#fff; border-radius:8px; box-shadow:0 2px 20px rgba(0,0,0,.08); transition:all .3s ease; }
.box5_lisst .list ul li:hover { transform:translateY(-3px); box-shadow:0 8px 40px rgba(0,0,0,.12); }
.box5_lisst .list ul li img { width:44px; height:44px; flex-shrink:0; }
.box5_lisst .list ul li .text span { display:block; font-size:15px; font-weight:700; color:#0a1628; margin-bottom:4px; }

.i_box6 .box { display:grid; grid-template-columns:1fr 1fr; gap:36px; }
.i_box6 .box .fl ul { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.i_box6 .box .fl ul li a { display:block; background:#fff; border-radius:8px; overflow:hidden; box-shadow:0 2px 20px rgba(0,0,0,.08); transition:all .3s ease; }
.i_box6 .box .fl ul li a:hover { transform:translateY(-3px); box-shadow:0 8px 40px rgba(0,0,0,.12); }
.i_box6 .box .fl ul li a .pic { height:120px; overflow:hidden; }
.i_box6 .box .fl ul li a .pic img { width:100%; height:100%; object-fit:cover; }
.i_box6 .box .fl ul li a .text { padding:14px; text-align:center; }
.i_box6 .box .fl ul li a .text span { font-size:14px; font-weight:600; color:#0a1628; }
.fr_tit { display:flex; align-items:center; justify-content:space-between; padding-bottom:14px; border-bottom:2px solid #e8ecf1; margin-bottom:16px; }
.fr_tit p span { font-size:18px; font-weight:700; color:#0a1628; }
.fr_tit p i { font-size:12px; color:#7f8c8d; margin-left:8px; font-style:normal; }
.fr_tit a { font-size:13px; color:#c9a84c; font-weight:600; }
.fr .list ul li { display:flex; align-items:center; justify-content:space-between; padding:12px 0; border-bottom:1px solid #e8ecf1; }
.fr .list ul li a { font-size:14px; color:#2c3e50; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fr .list ul li a:hover { color:#c9a84c; }
.fr .list ul li span { font-size:12px; color:#7f8c8d; flex-shrink:0; margin-left:12px; }

/* ====== Sidebar Layout (inner detail pages) ====== */
.wrap { display:flex; gap:36px; padding:40px 0; }
.main_l { width:240px; flex-shrink:0; }
.main_r { flex:1; min-width:0; }
.mainl_text1 { background:#fff; border-radius:8px; box-shadow:0 2px 10px rgba(0,0,0,.06); overflow:hidden; }
.page_title { background:#0a1628; color:#fff; padding:14px 20px; }
.page_title h3 { font-size:16px; font-weight:700; color:#fff; margin:0; }
.page_title h3::after { display:none; }
.page_tit { padding:8px 0; }
.page_tit h3 { display:flex; align-items:center; justify-content:space-between; padding:10px 20px; font-size:14px; font-weight:400; cursor:pointer; margin:0; }
.page_tit h3::after { display:none; }
.page_tit h3 a { color:#2c3e50; font-size:14px; font-weight:400; flex:1; }
.page_tit h3 a:hover { color:#c9a84c; }
.page_tit h3.on a { color:#c9a84c; font-weight:600; }
.page_tit h3 span { font-size:12px; color:#7f8c8d; }
.cat_title { padding:0 0 16px; border-bottom:2px solid #e8ecf1; margin-bottom:20px; }
.cat_title h1, .cat_title h3 { font-size:22px; font-weight:700; color:#0a1628; }
.cat_title h1::after, .cat_title h3::after { display:none; }
.cat_title .info { font-size:13px; color:#7f8c8d; margin-top:8px; }
.cat_title .info span { margin-right:16px; }
.page_content { line-height:2; font-size:15px; color:#2c3e50; }

/* ====== About page ====== */
.about_content .list ul { display:flex; gap:24px; }
.about_content .list ul li { flex:1; text-align:center; padding:24px; background:#f4f6f9; border-radius:8px; }
.about_content .list ul li img { width:48px; height:48px; margin:0 auto 12px; object-fit:contain; }
.about_content .list ul li .text span { display:block; font-size:15px; font-weight:700; color:#0a1628; margin-bottom:4px; }
.about_content .list ul li .text p { font-size:13px; color:#7f8c8d; }
.about_content .list { margin-top:40px; }
.about_content .box_tit { margin-bottom:10px; }
.about_content .box_tit h3 { font-size:28px; }
.wapimg { display:none; }

/* ====== List / Pagination ====== */
.page_list { padding:20px 0; }
.page_list ul li { display:flex; align-items:center; justify-content:space-between; padding:16px 0; border-bottom:1px solid #e8ecf1; }
.page_list ul li a { font-size:15px; color:#2c3e50; flex:1; }
.page_list ul li a:hover { color:#c9a84c; }
.page_list ul li span { font-size:13px; color:#7f8c8d; flex-shrink:0; margin-left:16px; }
.pagination { text-align:center; padding:30px 0; display:flex; justify-content:center; gap:4px; flex-wrap:wrap; }
.pagination a { display:inline-block; padding:6px 14px; border:1px solid #e8ecf1; border-radius:4px; font-size:14px; color:#2c3e50; }
.pagination a:hover, .pagination a.cur { background:#c9a84c; color:#fff; border-color:#c9a84c; }

/* ====== IE Warning Banner ====== */
.iet { display:none; background:#ffeaa7; padding:10px 20px; text-align:center; font-size:14px; color:#2d3436; }
.iet a { color:#0984e3; text-decoration:underline; }
.iet .closed { float:right; cursor:pointer; font-weight:700; }

/* ====== Footer ====== */
.footer { background:#0a1628; color:rgba(255,255,255,.6); padding:50px 0 30px; }
.footer .box { display:grid; grid-template-columns:1fr 1fr; gap:36px; }
.footer h3 { font-size:16px; font-weight:700; color:#fff; margin-bottom:16px; padding-bottom:10px; border-bottom:2px solid #c9a84c; display:inline-block; }
.footer p { margin-bottom:8px; font-size:14px; }
.footer a { color:rgba(255,255,255,.6); }
.footer a:hover { color:#c9a84c; }
.copyright { background:#060e1a; padding:16px 0; text-align:center; color:rgba(255,255,255,.35); font-size:13px; }
.copyright a { color:rgba(255,255,255,.35); }
.copyright a:hover { color:#c9a84c; }

.link { padding:24px 0; background:#f4f6f9; }
.linklist, .arealist { display:flex; align-items:center; flex-wrap:wrap; gap:6px; margin-bottom:6px; }
.linklist span, .arealist span { font-size:13px; color:#7f8c8d; }
.linklist a, .arealist a { font-size:13px; color:#7f8c8d; padding:3px 10px; border:1px solid #e8ecf1; border-radius:4px; }
.linklist a:hover, .arealist a:hover { color:#c9a84c; border-color:#c9a84c; }

/* ====== Customer Service Float ====== */
.kf { position:fixed; right:-158px; bottom:120px; z-index:999; display:flex; align-items:center; }
.kf .kf-side {
  background:#c9a84c; color:#fff; cursor:pointer; padding:10px 6px;
  border-radius:6px 0 0 6px; writing-mode:vertical-lr; letter-spacing:4px;
  font-size:14px; display:flex; flex-direction:column; align-items:center; gap:2px;
}
.kf .kf-side .arrow { display:inline-block; transition:transform .3s; }
.kf .kf-side .arrow.on { transform:rotate(180deg); }
.kf .kt-top { background:#0a1628; color:#fff; padding:10px 16px; font-size:14px; border-radius:6px 6px 0 0; display:flex; justify-content:space-between; align-items:center; }
.kf .kt-top .close { cursor:pointer; width:20px; height:20px; position:relative; display:inline-block; }
.kf .kt-top .close b { position:absolute; width:14px; height:2px; background:#fff; top:50%; left:50%; }
.kf .kt-top .close b:first-child { transform:translate(-50%,-50%) rotate(45deg); }
.kf .kt-top .close b:last-child { transform:translate(-50%,-50%) rotate(-45deg); }
.kf .con { width:158px; background:#fff; box-shadow:0 4px 20px rgba(0,0,0,.15); }
.kf .con h5 { padding:12px 16px 4px; font-size:14px; color:#0a1628; }
.kf .con .contact { padding:6px 16px 16px; }
.kf .con .contact p { font-size:13px; color:#7f8c8d; line-height:1.8; }
.kf .con .contact p:nth-child(even) { color:#2c3e50; font-weight:600; }
.kf .backTop { text-align:center; padding:10px; border-top:1px solid #e8ecf1; cursor:pointer; font-size:13px; color:#7f8c8d; }
.kf .backTop:hover { color:#c9a84c; }

/* Utility */
.clearfix:after { content:""; display:table; clear:both; }
.imgauto { overflow:hidden; }
.imgauto img { transition:transform .5s ease; }
.imgauto:hover img { transform:scale(1.08); }

/* ====== Responsive ====== */
@media (max-width:1024px) {
  .head_top .center { padding:0 20px; }
  .head_top .box .nav ul > li > a { padding:0 12px; font-size:14px; }
  .head_top .box .search .inp1 { width:140px; }
  .pro_list ul { grid-template-columns:repeat(2,1fr); }
  .page_banner { height:240px; }
  .page_banner .text .box_tit h3 { font-size:28px; }
}

@media (max-width:768px) {
  .header { position:relative; }
  .head_top { display:none; }
  .pc_banner { display:none; }

  .m_header {
    display:block; position:fixed; top:0; left:0; right:0;
    height:var(--header-h-mobile); z-index:1000; background:#0a1628;
  }
  .m_head_content {
    display:flex; align-items:center; justify-content:space-between;
    height:var(--header-h-mobile); padding:0 16px;
  }
  .m_head_logo img { height:32px; }
  .menu { color:#fff; font-size:22px; cursor:pointer; padding:8px; }
  .app_menu {
    display:none; position:fixed; top:var(--header-h-mobile); left:0; right:0; bottom:0;
    background:#0a1628; overflow-y:auto; z-index:999;
  }
  .app_menu ul .v_list { display:none; }
  .app_menu ul li { border-bottom:1px solid rgba(255,255,255,.06); }
  .app_menu ul li a { display:block; padding:14px 20px; color:rgba(255,255,255,.8); font-size:15px; }
  .app_menu .v_list { display:none; padding-left:20px; background:rgba(0,0,0,.15); }
  .app_menu .v_list a { display:block; padding:10px 20px; color:rgba(255,255,255,.6); font-size:14px; }

  .m_header .swiper-wrapper-box {
    position:relative; width:100%; height:200px; margin-top:60px;
    background:#000; overflow:hidden;
  }
  .m_header .swiper-wrapper-box video { width:100%; height:100%; object-fit:cover; display:block; position:relative; z-index:2; }
  .m_header .swiper-slide-box { width:100%; height:100%; position:relative; z-index:1; }

  .m_banner { display:block; }
  #page_header { display:none; }
  .page_banner { display:none; }

  section, [class^="i_box"] { padding:40px 0; }
  .box_tit { margin-bottom:30px; }
  .box_tit h3 { font-size:24px; }
  .i_box1 .box ul { grid-template-columns:repeat(2,1fr); gap:16px; }
  .i_box3 .box ul { grid-template-columns:1fr; }
  .i_box3 .box ul li img { height:200px; }
  .pro_list ul { grid-template-columns:repeat(2,1fr); gap:16px; }
  .pro_list ul li a .imgauto { width:100px; height:100px; margin-top:16px; }
  .box5_lisst .list ul { grid-template-columns:1fr; }
  .i_box6 .box { grid-template-columns:1fr; }
  .i_box6 .box .fl ul { grid-template-columns:repeat(3,1fr); gap:10px; }
  .footer .box { grid-template-columns:1fr; gap:24px; }
  .footer { padding:30px 0 20px; }
  .wrap { flex-direction:column; gap:20px; }
  .main_l { width:100%; }
  .main_r { width:100%; }
  .about_content .list ul { flex-direction:column; gap:16px; }
  .about_content .list ul li { display:flex; text-align:left; gap:14px; align-items:center; }
  .about_content .list ul li img { margin:0; flex-shrink:0; }
  .pcimg { display:none; }
  .wapimg { display:block !important; }
  .kf { bottom:80px; }
}

@media (max-width:480px) {
  .i_box1 .box ul { grid-template-columns:1fr; }
  .pro_list ul { grid-template-columns:1fr; }
  .i_box6 .box .fl ul { grid-template-columns:1fr; }
}

/* ====== 右侧漂浮在线咨询 ====== */
.kf-float-chat {
  transition:opacity .3s ease;
}
.kf-float-chat:hover { opacity:.85; }

/* ====== 在线咨询按钮 ====== */
.online-consult {
  display:inline-flex; align-items:center; justify-content:center;
  height:36px; padding:0 18px; margin-left:12px;
  background:#c9a84c; color:#0a1628; font-size:14px; font-weight:600;
  border-radius:18px; cursor:pointer; white-space:nowrap;
  transition:all .3s ease; text-decoration:none; border:none;
  font-family:inherit; line-height:1;
}
.online-consult:hover { background:#d4b85a; color:#0a1628; }
.online-consult-m {
  display:block; padding:12px 20px; margin:10px 16px;
  text-align:center; background:#c9a84c; color:#0a1628;
  border-radius:6px; font-size:15px; font-weight:600;
  text-decoration:none;
}
.online-consult-m:hover { background:#d4b85a; color:#0a1628; }
