﻿header{
  width: 90%;
  position: fixed;
  left: 5%;
  top: 25px;
  z-index: 3000;
}

.header-all{
  width: 100%;
  background: #fff;
  padding: 10px 15px;
  border: 1px solid #ccc;
  border-radius: 10px;
  position: relative;
  z-index: 3001;
}

/* 展开时：底部圆角变直，和下拉连成一体 */
.header-all.is-open{
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

header.current{ top: 0;}

.header-all .logo{ width:53px; height:36px; }
.header-all .logo a{ display:block; width:53px; height:36px; background:url(../images/logo.png) no-repeat; }

.header-nav ul li.resour{ position: relative;}
.header-nav ul li.resour ul{ display: none; position: absolute; left: 0; top: 30px; width: 200px; background: #FFFFFF; z-index: 666; border-radius:10px; box-shadow: 0 16px 50px rgba(0,0,0,.12);}
.header-nav ul li.resour ul li{ line-height: 40px; height: 40px;  font-size: 0.9rem; position:relative;}
.header-nav ul li.resour ul li a:hover:after{ width: 0; height: 0;}
.header-nav ul li.resour:hover ul.ul1{ display: block;}
.header-nav ul li.resour ul li:hover .ul2{ display: block;}

.header-nav ul li.resour ul ul{ display: none; position: absolute; left: 200px; top: 0; width: 200px; background: #FFFFFF; z-index: 666; border-radius:10px; box-shadow: 0 16px 50px rgba(0,0,0,.12);}
.header-nav ul li.resour ul li ul li{ line-height: 40px; height: 40px; overflow: hidden; font-size: 0.9rem; position:relative;}
.header-nav ul li.resour ul li a:hover:after{ width: 0; height: 0;}


.header-nav ul li{ font-size: 1rem; padding: 0 15px; }
.header-nav ul li a{ display:inline-block; position:relative; line-height:32px; }
.header-nav ul li a i{ margin-left:6px; font-size:1.2rem; position:relative; top:2px;}

.header-nav ul li a:hover:after,
.header-nav ul li a.active:after{
  content:"";
  position:absolute;
  left:0;
  bottom:-15px;
  width:100%;
  height:5px;
  background:#404040;
}


/* =========================
   Mega Menu (Windows)
   现在是 header 外部的 .header-item-box
   ========================= */
.header-item-box{
  display: none;
  position: fixed;        /* ✅ 固定定位，跟 header 一起悬浮 */
  left: 5%;               /* ✅ 跟 header 的 left 一致 */
  width: 90%;             /* ✅ 跟 header 的 width 一致 */
  top: 25px;              /* ✅ 先占位，实际 top 由 JS 动态计算 */
  transform: translateY(0);

  background: #fff;
  border: 1px solid #ccc;
  border-top: none;       /* ✅ 顶部不画线，衔接更自然 */
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  box-shadow: 0 16px 50px rgba(0,0,0,.12);
  z-index: 2999;          /* ✅ 比 header 低一点，这样“上面盖住下面” */
}

/* 可选：内容太高时滚动（避免溢出） */
.header-item-box{
  max-height: calc(100vh - 140px);
  overflow: auto;
}


.header-item-box-menu{ width: 100%; }
.header-item-box-menu-left{ width: 33.3%; padding: 30px 15px; justify-content: flex-end; display: flex;}
.header-item-box-menu-left li{ height: 52px; line-height: 52px; overflow: hidden; padding: 0 15px; width: 160px; display: flex; align-items: center; justify-content: center; cursor: pointer;}
.header-item-box-menu-left li i{ width: 16px; display: block; font-size: 1.2rem;}
.header-item-box-menu-left li b{ display: block; width: calc(100% - 16px); color: #111111;}
.header-item-box-menu-left li.active{ background: #f8f9fa;}


.header-item-box-menu-mid{ width: 33.3%; background: #f8f9fa; padding: 30px 40px;}
.header-item-box-menu-mid-list{ width: 100%; display: none;}
.header-item-box-menu-mid-listshow{ width: 100%; gap: 0;  grid-template-columns: repeat(2, 1fr);  display: grid;}

.header-item-box-menu-mid-listshow dl{ width: 100%; cursor: pointer; padding: 10px; border-radius:6px ;}
.header-item-box-menu-mid-listshow dl:hover{ background: #e4e7eb;}
.header-item-box-menu-mid-listshow dl dt{ width: 37px; height: 37px; overflow: hidden;}
.header-item-box-menu-mid-listshow dl dt img{ width: 37px; height: 37px;}
.header-item-box-menu-mid-listshow dl dd{ width: calc(100% - 37px); height: 37px; line-height: 37px; overflow: hidden; padding-left: 15px;}
.header-item-box-menu-mid-listshow dl dd a{ color: #111111; display: block;}
.header-item-box-menu-mid-listshow dl dd a:hover{ color: #000000;}


.header-item-box-menu-right{ width: 33.4%; background: #f8f9fa; padding: 30px 0; }
.header-item-box-menu-right-list{ width: 100%; border-left:1px solid #595959; height: 100%; padding: 0 80px;}

.header-item-box-menu-right-list dl{ width: 100%; margin-bottom: 20px;  cursor:pointer; padding:5px;  border-radius:6px ;}
.header-item-box-menu-right-list dl dt{ width: 79px; height: 79px; overflow: hidden;}
.header-item-box-menu-right-list dl dt img{ width: 79px; height: 79px;}
.header-item-box-menu-right-list dl:hover{background: #e4e7eb;}
.header-item-box-menu-right-list dl:hover dt img{  transform: scale(1.06);}
.header-item-box-menu-right-list dl dd{ width: calc(100% - 79px); padding-left: 10px; overflow: hidden;}
.header-item-box-menu-right-list dl dd a{ display: block; color: #111111; line-height: 20px; height: 20px; overflow: hidden;}
.header-item-box-menu-right-list dl dd a:hover{ color: #000000;}
.header-item-box-menu-right-list dl dd p{ line-height: 18px; height: 54px; overflow: hidden; font-size: 0.7rem; color: #999;}




.header-all .header-get{position: relative; z-index: 666;}
.header-all .header-get a{ display: inline-block; font-family: myFirstFont2; padding: 0 15px; background: #000000; color: #FFFFFF;  border-radius:10px; height: 32px; line-height: 32px;}
.header-all .header-get a:hover{border:1px solid #000000;  color:#000; background:none; }

.quote-warp{ display: none; width: 100%; height: 100%; z-index: 666; background: rgba(0,0,0,0.3);  position: fixed; left: 0; top: 0;}

.quote-box{ position: fixed; left:50%; top: 50%;  transform: translate(-50%, -50%); width:60%; background:url(../images/headerquobg.jpg) no-repeat center; background-size:cover; box-shadow:0 1px 20px rgba(0,0,0,.04); padding: 30px; z-index: 999; border-radius: 20px;}
.quote-box a{ position: absolute; right: 20px; top: 20px; font-size: 2rem; color: #ccc; z-index: 888;}
.quote-box a:hover{ color:#000000;}
.quote-box b{ display: block; font-size: 2rem; color: #000000; line-height: 42px; font-family: myFirstFont1;}
.quote-box p{ line-height: 32px; font-size: 1rem;}
.quote-box-list{ width: 100%; margin-top: 20px;}
.quote-box-list dl{ width: 47%; margin-bottom: 3px;}
.quote-box-list dl dt{ font-size: 1rem; color: #000000; line-height: 36px;}
.quote-box-list dl dd input{ width: 100%; background: none; border:1px solid #CCCCCC; border-radius:10px; padding: 0 15px; line-height: 42px;}
.quote-box-list dl dd textarea{ width: 100%; background: none; border:1px solid #CCCCCC; border-radius:10px; padding:15px; line-height: 26px; height: 100px;}
.quote-box-list dl:nth-child(5){ width: 100%;}
.quote-box-list dl:nth-child(6){ width: 100%;}

.quote-box-btn{ width: 100%; margin-top: 10px; text-align: right;}
.quote-box-btn button{  background: #000000; color: #FFFFFF; border:none; border-radius:6px;  height: 36px; line-height: 36px; font-size: 1rem; padding: 0 25px;}
.quote-box-btn button:hover{ border:1px solid #000000; color: #000; background:none;}

.submit-success-mask{
    position:fixed;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,.55);
    z-index:99999;
    display:none;
}

.submit-success-pop{
    position:absolute;
    left:50%;
    top:50%;
    width:420px;
    max-width:92%;
    background:#fff;
    border-radius:18px;
    padding:38px 32px 30px;
    box-sizing:border-box;
    transform:translate(-50%,-50%) scale(.85);
    opacity:0;
    box-shadow:0 20px 60px rgba(0,0,0,.18);
    text-align:center;
    transition:all .3s ease;
}

.submit-success-mask.show .submit-success-pop{
    transform:translate(-50%,-50%) scale(1);
    opacity:1;
}

.submit-success-close{
    position:absolute;
    right:16px;
    top:16px;
    width:30px;
    height:30px;
    border-radius:50%;
    background:#f5f5f5;
    color:#666;
    text-align:center;
    line-height:30px;
    font-size:14px;
    transition:all .3s ease;
}

.submit-success-close:before{
    content:"\f00d";
    font-family:"FontAwesome";
}

.submit-success-close:hover{
    background:#000;
    color:#fff;
}

.submit-success-icon{
    width:78px;
    height:78px;
    margin:0 auto 18px;
    border-radius:50%;
    background:linear-gradient(135deg,#22c55e,#16a34a);
    box-shadow:0 10px 25px rgba(34,197,94,.28);
    display:flex;
    align-items:center;
    justify-content:center;
}

.submit-success-icon i{
    font-size:34px;
    color:#fff;
}

.submit-success-pop h3{
    margin:0 0 12px;
    font-size:28px;
    color:#111;
    line-height:1.3;
    font-weight:700;
}

.submit-success-pop p{
    margin:0 auto;
    max-width:320px;
    font-size:15px;
    line-height:1.8;
    color:#666;
}

.submit-success-btns{
    margin-top:26px;
}

.submit-success-btn{
    display:inline-block;
    min-width:150px;
    height:46px;
    line-height:46px;
    text-align:center;
    background:#000;
    color:#fff;
    font-size:15px;
    border-radius:999px;
    transition:all .3s ease;
}

.submit-success-btn:hover{
    background:#222;
    color:#fff;
    transform:translateY(-2px);
}




@media (max-width: 1200px) {

.quote-box{  width:94%; padding: 20px; z-index: 999; border-radius: 20px;}
.quote-box a{  right: 10px; top: 10px; font-size: 1.6rem;}
.quote-box b{ font-size: 1.4rem; line-height: 32px;}
.quote-box p{ line-height:22px; font-size: 0.9rem;}
.quote-box-list{ margin-top: 20px;}
.quote-box-list dl dd textarea{  height: 60px;}

    .submit-success-pop{
        padding:30px 20px 24px;
        border-radius:14px;
    }
    .submit-success-icon{
        width:64px;
        height:64px;
    }
    .submit-success-icon i{
        font-size:28px;
    }
    .submit-success-pop h3{
        font-size:22px;
    }
    .submit-success-pop p{
        font-size:14px;
        line-height:1.7;
    }
    .submit-success-btn{
        width:100%;
        min-width:inherit;
    }

}




