﻿/*公共的css*/
/*初始化的css*/
*{margin:0; padding:0; font-family:微软雅黑,Arial, Helvetica, sans-serif;letter-spacing:0.5px;box-sizing: border-box }
a{ color:#333; text-decoration:none;}
a:hover{text-decoration: none}
ul, ol{list-style-type:none;}
img{border:0; max-width:100%;}
.container{ margin:0 auto; position:relative;}
.w1220{width:1220px; margin:0 auto; }
.clear{clear:both;}
h1, h2, h3, h4, h5, h6,b{ font-weight:normal;}
input, textarea,select{outline:medium;}
p{ text-align:justify;}
.fl{ float:left;}
.fr{ float:right;}

.container-fluid {
    display: block;
    margin: 0 auto;
}
.disfixcen {
    display: flex;
    justify-content: center;
    align-items: center;
}
.disfixspace{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.disfixstart{
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.ellipsis {
    display: block;
    white-space: nowrap; /* 不换行 */
    overflow: hidden; /* 超出部分隐藏 */
    text-overflow: ellipsis; /* 溢出部分显示省略号 */
}


@media screen and (min-width: 1300px) {
    .container{
        width: 1300px;
        padding: 0 0;
    }
}

body{
    padding: 70px 0 0 0;
}

/*设置滚动条的样式*/
::-webkit-scrollbar{width:6px;height:6px ;}
::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.2);border-radius:10px}
::-webkit-scrollbar-thumb{border-radius:10px;background:rgba(0,0,0,.1);-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.4)}
::-webkit-scrollbar-thumb:window-inactive{background:rgba(127,125,125,.4);}





/*pc端顶部导航区域*/
.headerNav{
    width: 100%;
    height: 70px;
    background-color: #101e2b;
    background-image: -webkit-linear-gradient(-180deg, #2a27a7, #82308e);
}
.headerNav .logoname{
    color: #FFFFFF;
    line-height: 70px;
    font-size: 32px;
    font-weight: 600;
}
.headerNav ul li {
    display: inline-block;
}
.headerNav ul li a{
    width: 116px;
    list-style: none;
    line-height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 16px;
}
.headerNav ul li.active a,
.headerNav ul li a:hover{
    color: #d6b97f;
}
.headerNav .navbar{
    margin:  0  10px 0 0;
}


/*手机端头部*/
#mobile .nav-btn{
    z-index: 1000;
    height: 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 16px;
    background-image: -webkit-linear-gradient(-180deg, #2a27a7, #82308e);
}
#mobile .mobilelogo{
    font-size: 20px;
    color: #ffffff;
    font-weight: bold;
}
#mobile .mobile-nav-taggle {
    height: 35px;
    line-height: 35px;
    width: 35px;
    color: #fff;
    display: inline-block;
    text-align: center;
    cursor: pointer;
    float: right;
}

#mobile .mobile-nav .mobilebackbg{
    width: 100%;
    height: 100%;
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    content: " ";
    z-index: 10;
    background: rgba(0,0,0,0.6);
}
#mobile .mobile-nav ul{
    width: 50%;
    height: 100%;
    position: fixed;
    top:0;
    right: 0;
    background-color: rgb(129, 48, 142);
    z-index: 10000;
    transition: all .3s ease-in;
}
#mobile .mobile-nav.hide-nav ul {
    transform: translateX(100%);
}
#mobile .mobile-nav.show-nav ul {
    transform: translateX(0);
}
#mobile .mobile-nav.hide-nav .mobilebackbg {
   display: none;
}
#mobile .mobile-nav.show-nav .mobilebackbg {
    display: block;
}

#mobile .mobile-nav li{
    display: block;
}
#mobile .mobile-nav li a{
    display: block;
    font-size: 14px;
    color: #ffffff;
    line-height: 56px;
    padding: 0 20px;
    list-style: none;
    cursor: pointer;
    position: relative;
    box-sizing: border-box;
    white-space: nowrap;
}
#mobile .mobile-nav li.active a{
    color: rgb(214, 185, 127);
}










    /*页脚区域*/
.footerbox{
    padding: 50px 0px 30px 0;
    background-image: -webkit-linear-gradient(-180deg, #2a27a7, #82308e);
}
.footerbox .container{
    max-width: 1100px;
}
.footerbox .container .footerrow{
    display: block;
    overflow: hidden;
}
.footerbox .container .footerrow>div{
    display: inline-block;
    float: left;
}
.footerbox .container .footerrow>div.footerabout{
    margin-right: 120px;
    width: 400px;
}
.footerbox .container .footerrow>div.footerbtn{
    width: 250px;
}
.footerbox .container .footerrow>div.footercontact{
    width: 250px;
    float: right;
}
.footerbox .container h4{
    font-size: 20px;
    color: #fff;
    margin: 0 0 26px 0;
}
.footerbox .container p{
    width: 100%;
    color: #a39e9e;
    font-size: 16px;
    letter-spacing: 0;
    margin:  0 0 24px 0;
}
.footerbox .container p img{
    width: 17px;
    display: inline-block;
    vertical-align: middle;
    margin: -2px 3px 0 0;
}
.footerbox .container a{
    width: 400px;
    color: #a39e9e;
    font-size: 16px;
    padding: 0 20px 0 0 ;
    background: url("../img/footer1.png") no-repeat right center;
    background-size: 12px;
    letter-spacing: 0;
}
.footerbox .container a:hover{
    color: #1b76ee;
    background: url("../img/footer1h.png") no-repeat right center;
    background-size: 12px;
}







/*响应式区域*/
@media screen and (max-width: 1400px) {
    .container-fluid{
        overflow: hidden;
        padding-left: 0;
        padding-right: 0;
    }

}
@media screen and (max-width: 1200px) {
    .headerNav .container{
        width: 100%;
    }

    .headerNav .logoname {
        font-size: 27px;
    }
    .headerNav ul li a {
        width: 90px;
        font-size: 15px;
    }

    .footerbox .container {
        width: 100%;
    }
    .footerbox .container .footerrow>div.footerabout {
        margin-right: 90px;
    }
    .footerbox .container .footerrow>div.footerbtn {
        width: 170px;
    }
}
@media screen and (max-width: 1000px) {

    .footerbox .container .footerrow>div.footerabout {
        width: 37%;
        margin-right: 10%;
    }
    .footerbox .container h4 {
        font-size: 18px;
        margin: 0 0 18px 0;
    }
    .footerbox .container a,
    .footerbox .container p {
        font-size: 14px;
    }
    .footerbox .container .footerrow>div.footercontact {
        width: auto;
    }

}

@media screen and (max-width: 992px) {
    .container{
        width: 100%;
    }
}

@media screen and (max-width: 768px) {
    body {
        padding: 60px 0 0 0;
    }
    .footerbox {
        padding: 20px 0;
    }
    .footerbox .container .footerrow>div{
        width: 100% !important;
        margin: 0 0 20px 0;
    }
    .footerbox .container .footerrow>div h4{
        font-size: 18px;
        color: #d9d9d9;
    }
    .footerbox .container a,
    .footerbox .container p {
        line-height: 30px;
        color: #b5b5b5;
        font-size: 14px;
        margin: 0;
    }

}





















