/* common */
header .max-width{ position:relative}

/* banner */
.banner {
    width: 100vw;
    height: 51.41vw;
    background: url(../images/about/about01.jpg) no-repeat;
    background-size: 100% 100%;
}
.banner .banner-text {
    width: 38.18vw;
    height: 7.87vw;
    align-items: center;
    padding: 17.23vw 0 0 30.72vw;
}
.banner .banner-text .item {
    width: 38.18vw;
    height: 7.87vw;
    font-size: 0;
    text-align: center;
    white-space: nowrap;
}
.banner .banner-text .item .text1 {
    width: 38.18vw;
    color: rgba(255, 255, 255, 1);
    font-size: 70px;
    text-align: left;
    white-space: nowrap;
}
.banner .banner-text .item .text2 {
    width: 38.18vw;
    color: rgba(255, 255, 255, 1);
    font-size: 100px;
    text-align: left;
    white-space: nowrap;
}

/* 板块一 */
.content-one {
    width: 89.59vw;
    height: 40.16vw;
    margin: 9.21vw 0 0 5.2vw;
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
}
.content-one img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.content-one .item-box1 {
    width: 33.13vw;
    height: 40.16vw;
}
.content-one .item-box2 {
    width: 28vw;
    word-wrap: break-word;
    overflow: hidden;
}
.content-one .item-box2 .title {
    font-size: 45px;
    font-weight: bold;
    color: #040000;
}
.content-one .item-box2 .detail {
    color: rgba(159, 160, 160, 1);
    font-size: 15px;
    margin-top: 2.82vw;
}
.content-one .item-box3 {
    width: 18.6vw;
    height: 22.92vw;
}

/* 板块二 */
.content-two {
    height: 43.91vw;
    margin-top: 10.11vw;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.content-two>div {
    position: relative;
    width: 50vw;
    height: 100%;
    background-color: #040000;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.content-two .item-box1 img {
    width: 21.46vw;
    height: 26.31vw;
}
.content-two .item-box1 .detail {
    width: 17.7vw;
    color: #ffffff;
    font-size: 18px;
    text-align: center;
    margin-top: 1.36vw;
}

.content-two .item-box2 img {
    width: 100%;
    height: 100%;
}
.content-two .item-box2 .detail {
    position: absolute;
    z-index: 3;
    color: #ffffff;
    font-size: 50px;
    font-weight: bold;
}

/* 板块3 */
.content-three {
    position: relative;
    width: 74.8vw;
    height: 26.72vw;
    display: flex;
    flex-direction: row;
    justify-content: center;
    justify-content: space-between;
    margin: 13.54vw 0 15.54vw 12.76vw;
}
.content-three  .images-box img {
    position: absolute;
    width: 19.95vw;
    height: 20.73vw;
}
.content-three .images-box img:nth-child(2) {
    top: 10vw;
    left: 15vw;
}
.content-three .intro-box {
    width: 29.74vw;
}
.content-three .intro-box .title {
    font-size:45px;
    font-weight: bold;
}
.content-three .intro-box .detail {
    font-size: 15px;
    color: #9FA0A0;
    margin-top: 2vw;
}


@media (max-width:1024px) { 
.banner{ text-align:center; height:auto; padding:25% 0;}
.banner .banner-text{ padding:0; width:auto; height:auto;}
.banner .banner-text .item{ text-align:center; width:auto; height:auto; padding:0; text-align:center;}
.content-one .item-box2 .title{ font-size:28px;}
.content-one .item-box2 .detail{ font-size:14px;}
.content-one,.content-three{ height:auto;}
.content-two .item-box2 .detail,.content-three .intro-box .title{ font-size:40px;}
.content-two .item-box1 .detail{ font-size:15px;} 
}


@media (max-width:768px) { 
.banner .banner-text .item .text1{ font-size:50px;}
.banner .banner-text .item .text2{ font-size:80px;}
.content-two .item-box2 .detail,.content-three .intro-box .title{ font-size:30px;}
.content-three .images-box img{width: 50%;height: auto;}

    .content-three {
        flex-wrap: wrap;
        height: auto;
    }
    .content-three > div {
        width: 100%;
    }
    .content-three .images-box {
        margin-left: 20vw;
    }
    .content-three .images-box img:nth-child(2) {
        left: 32vw;
    }
    .content-three .intro-box {
        margin-top: 70%;
        width: 100vw;
    }
}

@media (max-width:640px) {
.content-one .item-box1{ height:auto;}
.banner .banner-text .item .text1{ font-size:28px;}
.banner .banner-text .item .text2{ font-size:45px;}
.content-one .item-box2 .title{ font-size:22px;}
.content-two .item-box2 .detail,.content-three .intro-box .title{ font-size:24px;}
.content-three{ width:auto; margin:10% 15px;}
.content-three .intro-box .detail{ font-size:14px;}
.content-two .item-box1 img{ width:50%; height:auto;}
	
    .content-one {
        height: auto;
    }
    .content-one > div:first-child {
        flex: 0 1 100%;
    }
    .content-two {
        width: 50vw;
        height: auto;
        flex-direction: column;
    }
    .content-one .item-box2 {
        width: 100vw;
        padding-left: 0;
		margin:10% 0;
    }
    .content-one .item-box3 {
        width: 100vw;
        height: auto;
    }
    .content-two>div  {
        width: 100vw;
        height: 100vw;
    }
    .content-two .item-box1 .detail {
        width: 80vw;
        line-height: 4vw;
		margin-top:5%;
    }
 }
