html,body {
    width: 100%;
    height:100%;
    background:url("../img/goodfather04.png") no-repeat bottom left,url("../img/goodfather05.png") no-repeat bottom right ;
    background-color: #cceaf7;
    background-size:40%,40% ;
}

/*头部导航*/
.header {
    width: 100%;
    position: fixed;
    height:50px;
    z-index: 1000;
    top:0;
}
.logo {
    width: 15%;
    height:50px;
    line-height: 50px;
    vertical-align: middle;
}
.logo img {
    height:70%;
    vertical-align: middle;
}



/*7条颜色*/
.colorBar {
    position: fixed;
    width: 100%;
    height: 4px;
    overflow: hidden;
    z-index:999;
    top: 50px;
}

.colorBar ul {
    height: 4px;
    margin: 0 auto;

}
.colorBar ul li {
    float: left;
    height:4px;
}
.colorBar ul li:nth-child(1){
    background-color: #fa8c8e;
    width: 22%;
}
.colorBar ul li:nth-child(2){
    background-color: #fcb88b;
    width: 8%;
}
.colorBar ul li:nth-child(3){
    background-color: #f5e467;
    width:7.8%;
}
.colorBar ul li:nth-child(4){
    background-color: #c0ed98;
    width: 8.6%;
}
.colorBar ul li:nth-child(5){
    background-color: #88ebd5;
    width: 11%;
}
.colorBar ul li:nth-child(6){
    background-color: #8ec7ed;
    width: 11%;
}
.colorBar ul li:nth-child(7){
    background-color: #fac3f6;
    width:11%;
}
.colorBar ul li:nth-child(8){
    background-color: #fa8c8e;
    width:20.4%;
}

::-webkit-scrollbar {
    display: none;
}
/*隐藏导航栏*/

.menu {
    width: 44px;
    height: 34px;
    position: fixed;
    top:8px;
    right:8px;
    z-index: 2000;
    background: url(../img/haobaba17.png);
    cursor: pointer;
}

.navbar {
    position:fixed;
    width: 30%;
    background-color: #fff;
    font-size: 16px;
    top:50px;
    right:0;
    line-height: 30px;
    z-index: 1000;
    text-align: center;
    display: none;
}
.navbar li {
    height:40px;
    line-height:40px;
    text-align: center;

}
.navbar li a {
    display: inline-block;
    width: 80%;
    border-bottom:1px solid #ccc;
}




.content {
    width: 100%;
    padding:0 10px;
    position: relative;
    margin: 80px auto 0;
    overflow-scrolling: touch;

}
.content h2 {
    text-align: center;
    margin: 30px 0 15px;
}
.content p  {
    font-size: 16px;
    text-indent:2em;
}
.erweima {
    width: 180px;
    margin:0 auto;

}
.erweima img {
    width: 100%;
}

.contact p:nth-child(3){
    margin:20px 0;
}
.bear {
    position: absolute;
    left:600px;
    bottom: 100px;

}
.bear img {
    width: 400px;
}
.content .title-message{
    display: flex;
    justify-content: center;
    font-size:1rem;
    color:#333;
    padding:15px 0;
}
.content .title-message .title{
    padding-bottom: 10px;
    border-bottom: 3px solid #333;
    font-weight: bold;
    font-size: 1.2rem;
}

.img-show .ul-item{
    height: 128rem;
    display: flex;
    /* align-content: flex-end; */
    /* justify-content: space-around; */
    flex-direction: column;
    align-items: center;
}
.img-show .ul-item .li-item{
    margin-bottom: 2rem;
    
}
.img-show .ul-item .li-item img{
    width: 80%;
}
.img-show .ul-item .li-item:first-child{
    /* align-self: flex-end; */
}
.img-show .ul-item .li-item:first-child .li-img{
    margin-bottom: 20px;
}
.img-show .ul-item .li-item .li-img{
    display: flex;
    justify-content: center;
}
.img-show .ul-item .li-item:last-child{
    /* align-self: flex-end; */
}
.img-show .ul-item .li-item:last-child .li-img{
    margin-bottom: 20px;
}
.img-show .ul-item .li-item .li-title{
    text-align: center;
    color: #1D9FFF;
    font-size: 1.2rem;
}
.relate-item{
    font-size: 0.9rem;
    text-align: center;
    color:#4D4D4D;
}