/*====== body =======*/
body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: Arial, Helvetica, sans-serif;
}
/*h2文字本身*/
h1,h2,h3{
    font-size: 36px;
    color: #1f365b;
    padding: 5px 20px;
    font-weight: 700;
}
/*===h3集体序号框子===*/
/*h3标题大框框子*/
.h3-title{
    margin-top: 5%;
    margin-left: 10%;
    display: inline-flex;
    align-items: center;
    width: fit-content;
}
/*h3标题数字*/
.h3-title-num{
    display: inline-block;
    margin-top: auto;
    margin-bottom: auto;
    margin-right: 10px;
    font-size: 90px;
    font-family:'Roboto';
    padding-left: 0cap;
    padding-right: 0cap;
    font-weight: 120;
    color: #ffffff;
}
/*h3标题文字框*/
.h3-title-text{
    margin-left: 10px;
    margin-top: 0;
    margin-bottom: 0;
    padding-top:20px;
    padding-bottom:auto;
}
/*h3标题h2h2h2h2*/
.h3-title-text h3{
    padding-left: 0;
    display: inline;
    color: #ffffff;
}
/*h3标题ppppp*/
.h3-title-text p{
    margin-top: auto;
    padding-left: 2px;
    color: #dbdbdb;
    letter-spacing: 2px;
}
/*===h3集体序号框子结束===*/





/* ======首页 图标和公司名====== */

/* 头部框 最外面的显形大框框子 */
.header-section{
    background-color: #274169;
}
/* 头部框 最外面的隐形大框框子 */
.invisible-space-header{
    width: 80%;
    max-width: 1000px;
    margin: 0 auto;
}
/* 头部框 最上面那一条框框子 */
.first-head{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
}
/* ====头部框 logo和公司名整体==== */
/* 头部框 logo和公司名整体*/
.img-title{
    display: flex;
    align-items: center;
    color: #ffffff;
    text-decoration: none;
}
/* 头部框 logo */
.logo{
    width: 10%;
    margin-right: 15px;
}
/* 头部框 公司名字 */
.company-name{
    font-size: 18px;
    font-weight: bold;
    max-width: 300px;
}
/* ====头部框 语言切换==== */
/* 头部框 语言切换整体框框子 */
.language-nav{
    display: flex;
    gap: 15px;
}
/* 头部框 语言切换p原语言 */
.language-nav p {
    color: #ffffff;
    display: flex;
    font-weight: bold;
    margin-top: auto;
}
/* 头部框 语言切换a样式 */
.language-nav a{
    text-decoration: none;
    color: #ecc976;
    font-weight: bold;
}
/* 头部框 中文 */
.chinease-language{
    margin-top: -3px;
}
/* 头部框 语言切换a:hover */
.language-nav a:hover{
    color: white;
}
/*头部框 语言切换a：active*/
.language-nav a:active {
    transform: translateY(3px);
}

/*头部框 面包屑导航*/
.nav-background-base{
    background-color: #d4b46a;
    padding: 10px 0;
}
/*头部框 面包屑导航 文字背景框*/
.nav-background{
    width: 80%;
    max-width: 980px;
    margin: 0 auto;
    display: flex;
    gap: 10px;
}
/*头部框 面包屑导航 文字背景框 a样式*/
.nav-background a{
    text-decoration: none;
    color: #1f365b;
    font-weight: 600;
}
/*头部框 面包屑导航 文字背景框 箭头图片*/
.nav-arrow{
    width: 15px;
    height: auto;
    margin-top: 4px;
}
/*头部框 面包屑导航 文字背景框 a样式hover*/
.nav-background a:hover{
    color: #ffffff;
}
/* ======首页 结束====== */




/*====== main =======*/

/*====== 主页 =======*/

/* ====主页 隐形框框子==== */
.intro-backgrond{
    position: relative;
    display: flex;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5%;
    margin-bottom: 5%;
    width: 85%;

}

/* ===主页 文字描述大框框=== */
.intro-backgrond-des{
    margin-top: auto;
    margin-bottom: auto;
    margin-left: 20px;
    margin-right: 20px;
    font-size: 18px;
    line-height: 1.6;
    text-align: justify;
    color: #555;
}


/*==主页 标题svg和文字容器==*/
.title{
    display: flex;
    align-items: center;
    width: fit-content;
}
/*主页 标题文字容器*/
.tttt-div{
    padding:0;
}
/*主页 标题文字*/
.title-text{
    font-size: 60px;
    margin:0;
    padding:0px;
    padding-left: 20px;
    padding-bottom: 3%;
}
/*主页 标题文字p*/
.title-text-p{    
    margin-top: -25px;
    padding-left: 25px;
    color: #6e6e6e;
    letter-spacing: 2px;
    font-size: 23px;
    font-weight: 500;
}
/*主页 介绍文字p*/
.intro-p{
    max-width: 85%;
    color: #777777;
    font-style: italic;
}
/*主页 地区列表*/
.area-list{
    list-style: none;
    padding-left: 2em;
    margin-left: -2em;
    margin-top:-10px;
}
/*主页 地区列表 li*/
.area-list li{
    line-height: 1.6;
    margin-bottom: 6px; 
}
.word-strong{
    color: #d4b46a;
}
/* 主页 背景图片 */
.intro-backgrond-img{
    aspect-ratio: 4/3;
    width: 50%;
    border-radius: 10px;
    box-shadow: 0 4px 8px #34373c;
}
/*====== 主页 结束=======*/


















/*====== 第一页 =======*/


/* ==第一页 滑动页背景板== */
.slider{
    width: 80%;
    margin: 0 auto;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

/* =第一页 滑动卡片窗口= */
.slider-window{
    overflow: hidden;
    width: 100%;
}
/* =第一页 滑动轨道 =*/
.slider-track{
    display: flex;
    transition: transform 0.5s ease;
}
/* 第一页 8/8每一页卡片 */
.slide{
    min-width: 100%;
    aspect-ratio: 5/3;
    background: #2f3e5c;
    border-radius: 12px;
    display: flex;
}
/* 第一页 按钮样式 */
.slider-btn{
    background: none;
    border: none;
    cursor: pointer;
    color: #a88534;
    transition: transform 0.3s, color 0.3s;
}
/* 第一页 按钮悬停效果 */
.slider-btn:hover{
    color: #2f3e5c;
}
/* 第一页 滑动点点容器 */
.slider-dots{
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 20px;
}
/* 第一页 8/8 点点 */
.dot{
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: rgba(168,133,52,0.4); /* 金色半透明 */
    cursor: pointer;
    transition: all 0.3s ease;
}
/* 第一页 8/8 点点 激活 */
.dot.active{
    background-color: #a88534;
    transform: scale(1.3);
}
/* 第一页 8/8 点点 悬浮 */
.dot:hover{
    background-color: #a88534;
}
/*8/8 图片背景板*/
.img-background{
    margin-top: 0%; 
    margin-left:-1%;   
    overflow: hidden;
    display: flex;
    background-color: #ecc976;
    width: 50%;
    height: 100%;
}
/*8/8 文字背景板*/
.text-background{
    display: flex;
    width: 45%;
    margin-left: auto;
    margin-right: auto;
}
/*8/8 文字标题*/
.text-h2{
    font-size: 23px;
}
/*========1/8========*/
/*1/8 图片容器*/
.s1-img-box{
    width: 85%;
    overflow: hidden;
    display: flex;
    padding: 5%;
}
/*1/8 图片本身*/
.s1-img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}
/*1/8 文字背景板 纯文字*/
.text8{
    margin: auto;
}
/*1/8 文字背景板 纯文字 标题框*/
.title8{
    display: flex;
}
/*1/8 文字背景板 纯文字 标题svg*/
.title8 svg{
    margin: auto;
    margin-top: 8px;
    margin-right: -5px;
}
/*1/8 文字背景板 纯文字 标题文字 h2*/
.title8 h2{
    color: #ffffff;
    margin: auto;
}
/*1/8 文字背景板 纯文字 pppp*/
.text8 p{
    color: #dbdbdb;
    line-height: 1.6;
    text-align: justify;
    margin-top: 10px;
}
.text8 ul{
    color: #dbdbdb;
    line-height: 1.6;
    text-align: justify;
    margin-top: 10px;
}
/*========1/8 结束========*/
/*========3/8========*/
/*3/8 图片本身*/
.s2-img{
    max-width: 100%;
    padding-left: 5%;
}
/*3/8 图片本身*/
.s3-img{
    padding-left: 3%;
}
/*========3/8 结束========*/
/*========4/8 结束========*/
/*4/8 图片本身*/
.s4-img{
    padding-left: 3%;
}
/*========4/8 结束========*/




/*====== 第一页 结束 =======*/






















/*====== main 结束 =======*/




/*====== footer =======*/
/* footer 默认背景 */
footer{
    color: #274169;
    padding: 100px 0 150px;
}
/* footer 最外面的隐形大框框子 */
.invisible-space-footer{
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
}
/* footer 联系方式部分 */
.footer-contact{
    margin-top: auto;
    margin-bottom: auto;
    flex: 1;
}
/* footer 标题文字 */
.footer-contact h2{
    color: #274169;
    padding-left: 0%;
}
/* footer 分割线 */
.footer-hr{
    border: none;
    margin-left: -1px;
    margin-bottom: 10px;
    margin-top: -15px;
    background-color: #a88534;
    height:5px;
    width:100px;
}
/* footer 电话link */
.contact-a{
    color: #a88534;
    text-decoration: none;
    margin-bottom: 10px;
}
/* footer 工作时间*/
.footer-h3{
    font-size: 20px;
    color: #1f365b;
    padding:0px;
    margin: 0px;
}
/* footer pppp */
.footer-contact p{
    color: rgb(135, 135, 135);
}
/* footer 地图 */
iframe{
    flex:2;
    min-width: 300px;
    max-width: 600px;
    height:400px;
    border: none;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}
/*====== footer 结束 =======*/











@media (max-width:500px){
    /* 头部框 一条框框子 */
    .first-head{
        height: 50px;
        margin: auto 5px;
    }
    /* 头部框 图标logo框 */
    .img-title{
        width: 100%;
        gap: 10px;
    }
    /* 头部框 公司logo */
    .logo{
        padding: 0%;
        margin: 0;
        width: 20%;
        margin-left: -15%;
    }
    /* 头部框 svg */
    .p1-svg{
        margin-left: -10px ;
        height: 60px;
        margin-top: -25px;
    }
    /* 头部框 公司名字 */
    .company-name{
        font-size: 10px;
        max-width: none;
        margin-left: -5px;
    }
    /* 头部框 语言切换 */
    .language-nav{
        font-size: 10px;
        padding: -5px;
        margin-right: -10%;
        gap: 6px;
    }
    /*面包屑 显示主页的导航栏*/
    .nav-background-base{
        width: 100%;
        padding: 5px 0;
    }
    /*面包屑 文字背景框*/
    .nav-background{
        width: 100%;
        padding: 3px 15px;
        font-size: 9px;
        margin: auto;
        gap: 1px;
    }
    /*面包屑 箭头*/
    .nav-arrow{
        width: 10px;
        height: 10px;
        margin-top: 0px;
    }
    /* 主页 svg */
    .title-svg{
        height: 60px;
    }
    /* 主页 文字框 */
    .tttt-div{
        margin-left: -15px;
    }
    /* 主页 标题文字 */
    .title-text{
        font-size: 25px;
        margin-bottom: 10px;
        margin-left: 2px;
    }
    /* 主页 标题文字p */
    .title-text-p{
        font-size: 8px;
        letter-spacing: 1px;
    }
    /* 主页 文字介绍 */
    .intro-p{
        font-size: 13px;
        margin: auto;
    }


    /* 第一页 滑动页背景板 */
    .slider{
        width: 100%;
        margin: auto;
        padding: auto;
    }
    /* 第一页 左右按钮 */
    .slider-btn {
        width: 20px;
        height: 20px;
        margin-right: 10px;
        margin: auto;
    }
    /* 第一页 左右按钮svg */
    .btn-svg {
        width: 20px;
        height: 20px;
        margin: 0;
        margin-right: 10px;
    }

    /* 第一页 文＋图背景板 */
    .slide{
        flex-direction: column;
        padding: 0%;  
        width: 100%;
    }
    /* 第一页 图背景板 */
    .img-background{
        width: 100%;
        height:235px;
    }
    /* 第一页 图 */
    .s1-img-box{
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }
    /* 第一页 文背景板 */
    .text-background{
        height: 500px;
        width: 90%;
        padding: 0%;
        align-self: flex-start;
        display: flex;
        align-items: flex-start;
    }
    /* 第一页 全部文字 */
    .text8{
        margin: 0;
        align-self: flex-start;
    }
    /* 第一页 标题套装*/
    .title8{
        margin: 0%;
        padding: 0%;
        width: 100%;
    }
    /* 第一页 文 标题 */
    .text-h2{
        font-size: 18px;
    }
    /* 第一页 文 svg */
    .title8 svg{
        height: 55px;
    }
    /* 第一页 文 p*/
    .text8 p{
        font-size: 12px;
    }
    /* 第一页 文 ul*/
    .word-ul li{
        font-size: 12px;
    }
}

@media (max-width: 768px) {
    /* 主页 隐形框框子 */
    .intro-backgrond {
        flex-direction: column;
        align-items: center;
    }
    /* 主页 标题和图片隐形框框子 */
    .intro-backgrond-des {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
    /* 主页 图片 */
    .intro-backgrond-img {
        width: 100%;
        margin-top: 20px;
    }
    /* 第一页 隐形框框子 */
    .p1-backgrond{
        width: 100%;
        flex-direction: column;
        align-items: center;
    }

    /* 第一页 文字描述大框框 */
    .p1-backgrond-des{
        width: 80%;
        margin-left: 0;
        margin-right: 0;
    }


    /* 第一页 左右按钮 */
    .slider-btn {
        width: 36px;
        height: 36px;
    }
    /* 第一页 左右按钮svg */
    .btn-svg {
        width: 36px;
        height: 36px;
    }
    /* 第一页 文 标题 */
    .text-h2{
        font-size: 15px;
    }
    /* 第一页 文 p*/
    .text8 p{
        font-size: 8px;
    }
    /* 第一页 文 ul*/
    .word-ul li{
        font-size: 8px;
    }
}