@charset "utf-8";

/* =========================================================
   1. 基础 Reset（最小集）
   目的：防止浏览器默认 margin / box-model 影响布局
   ========================================================= */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
    border: 0;
}

a {
    text-decoration: none;
}

a:hover,
a:focus {
    text-decoration: underline;
}


/* =========================================================
   2. Container（Bootstrap 3 风格）
   用于 header-top 与内容区域居中
   ========================================================= */

.container {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}

/* container 固定宽度断点 */
@media (min-width: 768px) {
    .container { width: 750px; }
}

@media (min-width: 992px) {
    .container { width: 970px; }
    #content{ padding-top: 70px; }
}

@media (min-width: 1200px) {
    .container { width: 1170px; }
}


/* =========================================================
   3. Row / Clearfix（Bootstrap 3 栅格基础）
   ========================================================= */

.row {
    margin-left: -15px;
    margin-right: -15px;
}

.clearfix::before,
.clearfix::after,
.container::before,
.container::after,
.row::before,
.row::after {
    content: " ";
    display: table;
}

.clearfix::after,
.container::after,
.row::after {
    clear: both;
}


/* =========================================================
   4. Columns（仅保留本页实际使用的列）
   使用到的类：
   - col-xs-12
   - col-sm-6 / col-sm-3 / col-sm-1
   - col-md-12 / col-md-6 / col-md-3 / col-md-1
   ========================================================= */

[class^="col-"] {
    position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
}

/* XS（<768px） */
.col-xs-12 {
    float: left;
    width: 100%;
}

/* SM（≥768px） */
@media (min-width: 768px) {

    .col-sm-6,
    .col-sm-3,
    .col-sm-1 {
        float: left;
    }

    .col-sm-6 { width: 50%; }
    .col-sm-3 { width: 25%; }
    .col-sm-1 { width: 8.33333333%; }
}

/* MD（≥992px） */
@media (min-width: 992px) {

    .col-md-12,
    .col-md-6,
    .col-md-3,
    .col-md-1 {
        float: left;
    }

    .col-md-12 { width: 100%; }
    .col-md-6  { width: 50%; }
    .col-md-3  { width: 25%; }
    .col-md-1  { width: 8.33333333%; }
}


/* =========================================================
   5. Header Top（你页面顶部蓝色条）
   ========================================================= */

#header-top {
    padding: 5px 0;
    background-color: #0a314d;
    color: #fff;
}



/* 让 header-top 在一行里垂直居中，并增加上下内边距（解决“太贴顶”） */
#header-top .row{
  display:flex;
  align-items:center;
  padding:8px 0;   /* 你可以改成 10px/12px */
}

/* 修复 grid 的“内陷/左右留白”：container 和列默认 padding 造成的 */
#header-top .container{
  padding-left:10px;
  padding-right:10px;
}
#header-top [class*="col-"]{
  padding-left:8px;
  padding-right:8px;
}

/* 左侧文字：去掉 inline style，统一由 CSS 控制 */
#header-top p{
  margin:0;
}
#header-top a{
  color:#fff;
  text-decoration:none;
}
#header-top a:hover{
  text-decoration:underline;
}

/* 图片（GACC logo）垂直居中 */
#header-top picture,
#header-top img{
  display:inline-block;
  vertical-align:middle;
}



/* =========================================================
   6. 页面内容区间距
   ========================================================= */

#content {
    padding-top: 100px;
    padding-bottom: 55px;
}


/* =========================================================
   7. 移动端适配（仅本页需要）
   ========================================================= */

@media (max-width: 768px) {

    body {
        background-color: #fff;
    }

    /* 移动端隐藏 header-top */
    #header-top {
        display: none;
    }

    /* 缩小 row 的左右内边距 */
    .row {
        padding: 0 10px;
    }
}


/* =========================================================
   8. 图片对齐（用于菜单按钮）
   ========================================================= */

a img.alignright {
    float: right;
    margin: 10px;
}


/* =========================
   Sticky footer (no fixed)
   ========================= */

/* 页面整体高度基础 */
html, body{
  height:100%;
}

/* 内容区至少撑满视口高度（减去 footer 高度） */
#content{
  min-height: calc(100vh - 80px);
}

/* Footer 本体 */
.site-footer{
  width:100%;
  height:80px;                 /* 常规高度，可调 60~100 */
  background-color:#181828;
  color:#89888d;
  display:flex;
  align-items:center;          /* 垂直居中 */
  justify-content:center;  /* 水平居中 */
  font-size:.85rem;
  letter-spacing:.02em;
}

/* Footer 内部文字 */
.site-footer a{
  color:#fff;
  text-decoration:none;
}
.site-footer a:hover{
  text-decoration:underline;
}

.site-footer p{
  margin:0;
}

/* 手机端略微紧凑一点 */
@media (max-width:576px){
  .site-footer{
    height:70px;
    font-size:.85rem;
  }
}
.site-footer{
  border-top:1px solid rgba(255,255,255,.08);
}

.site-footer{min-height:72px;padding:12px 0}


/*SVG设置.*/
.home-icon{
  font-size:23px;
  justify-content:center;  /* 水平居中 */
  margin:6px;
  max-width:100%;
  padding:6px 0;         /* 让它“往下”一点 */
}
.home-icon svg{
  width:1em;
  height:1em;
  display:block;
}
.home-icon{
  display:flex;
  align-items:center;   /* 垂直居中 */
}


/* =========================
   Mobile top bar (logo + hr)
   ========================= */

/* 默认：PC 端不显示 */
#mobile-top{
  display:none;
}

/* 仅移动端启用 */
@media (max-width:768px){
  #mobile-top{
    display:block;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    background:#fff;          /* 防止内容滚动时“透上来” */
    z-index:1040;
  }

  /* Logo 本身 */
  #mobile-logo{
    display:block;
    padding:10px 12px;
  }
  #mobile-logo img{
    display:block;
    width:95px;
    height:auto;
  }

  /* 分隔线 */
  /* 页面内容整体下移，避免被 fixed 顶部覆盖 */
  #content{
    padding-top:62px;   /* logo + hr 的总高度，必要时微调 */
  }
}

 .mobile-divider{
  border-top:1px solid #e5e7eb;
  box-shadow:0 1px 0 rgba(0,0,0,.02);
}

/* Mobile */
@media (max-width: 768px) {
    #content {
        padding-top: 60px;
        padding-bottom: 40px;
    }
}