/* 公共样式 */
*{
    padding: 0;
    margin: 0;
    font-family: 'Microsoft YaHei', serif;
}
html{
    width:100%;
}
/* 所有的a标签都去除下划线 */
a{
    text-decoration: none !important;
    color:black;
}
/* 图片上的字水平垂直居中 */
.pic_title{
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
}
.pic_title h1{
    color:#fff;
    font-weight: bolder;
}
ul{
    list-style: none;
}
.container{
    width:750px;
    margin:0 auto;
}
.naver>img{
    width:100%;
}
.naver .nav{
    height:58px;
    line-height: 58px;
}
.product_list{
    display:none;
    z-index: 1;
}

.product:hover .product_list{
    display: block;
}

/* .pic>img{
    width:100%;
    height:280px;
    margin-top:15px;
} */

.footer{
    /* height:160px; */
    background-color: rgba(35, 35, 36,0.9);
}
.footer p{
    padding-top:30px;
    padding-left:40px;
    color: white;
}
.footer p a{
    text-decoration: none;
    color:white;
}
.foot>img{
    width:100%;
}
nav{
    height:58px;
    line-height: 58px;
    /* background-color: rgba(46, 82, 202,0.9); */
}
.burger{
    padding-top:20px !important;
    display:none;

}
.burger div {
    /* 设置汉堡按钮三层条 */
    width: 25px;
    height: 3px;
    background-color: #dadbdd;
    margin: 4px;
}
.nav-menu-list{
    display:flex; /* 弹性布局 */
    justify-content: space-between;  /* 让弹性元素均匀排列 */
}
.nav-menu-list{
    height:58px;
    line-height: 58px;
}
.nav-menu-list>li>a{
    /* color:#dadbdd; */
    font-size: 18px;
    /* font-weight: 600; */
    color:black;
}
/*超小屏幕 小于768Px 宽度为100%  */
@media screen and (max-width:768px){
    html{
        width:100%;
    }
    p{
        margin-left:12px !important;
        margin-right:12px !important;
    }
    hr{
        margin-top:2px !important;
        margin-bottom: 2px !important;
    }
    .container{
        width:100%;
    }
    .pic{
        width:100%;
        height:120px !important;
        margin-top:15px;
    }
    .pic_title h1{
        font-size: 20px;
    }
    .naver .nav{
        height:20px;
        line-height: 20px;
    }
    .col-xs-2{
        padding-left:2px !important;
        padding-right:2px !important;
    }
    .footer{
        height:200px;
    }
    .col-xs-3{
        padding:0px 1px !important;
    }
    .col-sm-12{
        padding:0px 8px !important;
    }
    .col-xs-12{
        padding:0px 8px !important;
    }
    .tel h3{
        font-size: 18px !important;
    }
    .tel h4{
        font-size: 14px;
    }
    .map{
        height:260px !important;
    }
    #dituContent,#map{
        height:260px !important;
    }
    .footer p{
        padding-top:15px !important;
        font-size: 12px !important;
        letter-spacing: 2px !important;
        padding-left:10px !important;
    }
    .foot>img{

        width:60px !important;
        height:60px !important;
        /* margin-top:10px !important; */
    }
    nav{
        margin-top:8px;
    }
    
    /* .nav-menu{
        display:none;
    } */
    .burger{
        display:block;
    }
    .nav-menu-list {
        position: absolute;
        top: 58px;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 235px;
        text-align: center;
        background-color: rgba(151, 152, 167, 0.9);
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        z-index:9999;
        /* 动画 */
        transform: translateX(100%);
        display:none;
    }
    .nav-menu-list a{
        color:#dadbdd !important;
    }
    /* 菜单打开时，滑到初始位置 */
    .nav-menu-list.open {
        display:block;
        text-align: center;
        margin-left:20px !important;
        transform: translateX(0);
        transition: 0.2s ease-in-out; /* 以0.2s的速度结束的过渡效果 */
    }
    .nav-menu-list.open a{
        padding-left:40% !important;
        /* text-align: center; */
    }
    /* 每个菜单项默认看不到，向右移动20象素 */
    .nav-menu-list li {
        /* 上下间距 */
        /* margin: 2vh; */
        text-align: left;
        height:35px !important;
        line-height: 35px !important;
        transform: translateX(0);
        /* opacity: 0; */
    }
    .nav-menu-list li :first-child{
        margin-top:0px !important;
    }
    
    /* 汉堡按钮被点开时，设置按钮过渡 */
    .burger.active div {
        transition: 0.2s ease-in-out 0.2s;
    }

    /* 第一条线旋转45度 */
    .burger.active .top-line {
        transform: rotate(45deg) translate(4px, 6px);
    }

    /* 第三条线旋转-45度 */
    .burger.active .bottom-line {
        transform: rotate(-45deg) translate(4px, -6px);
    }

    /* 中间线向右移动并变为透明 */
    .burger.active .middle-line {
        opacity: 0;
        transform: translateX(10px);
        transition: 0.1s ease-in-out;
    }

    /* 菜单项滑入动画 */
    @keyframes slideIn {
        from {
        transform: translateX(0px);
        opacity: 0;
        }
        to {
        transform: translateX(0);
        opacity: 1;
        }
    }
    .image_1>img{
        height:330px !important;
    }
}
/* 中等屏幕 大于等于992px 宽度为970px */
@media screen and (min-width:992px){
    .container{
        width:970px;
    }
    .foot>img{
        width:60px !important;
        height:60px !important;
        /* margin-top:10px !important; */
    }
}
/* 大屏幕 大于1120px 宽度为1170px */
@media screen and (min-width: 1120px){
    .container{
        width: 1170px;
    }
    /* .footer{
        height:100px;
    } */
}