/* 关于我们 */
.about {
    position: absolute;
    inset: 0;
}

.about a {
    text-decoration: none;
}

.about .background {
    position: absolute;
    inset: 0;
    background: linear-gradient(-38deg, #1E1129 0%, #2F1D3F 100%);
    opacity: 0.99;
}

.about .top-bg {
    position: absolute;
    top: 0;
    width: 100%;
    background-image: url(../images/about/top-bg.png);
    background-size: cover;
    background-position: center;
    height: 8.74rem;
}

.about .container {
    position: absolute;
    inset: 0;
    overflow: auto;
}

.title-line {
    width: 14.96rem;
    height: 0.91rem;
    margin: 0.81rem auto;
    background-size: cover;
    background-position: center;
}

.about .container .wrapper {
    position: relative;
}

/* banner */
.about .container .wrapper .banner {
    position: relative;
    display: flex;
    flex-direction: column;
    height: calc(6.425rem - .9375rem);
    transform: scale(0.8);
    justify-content: center;
    /* align-items: center; */
}

.about .container .wrapper .banner .title {
    margin-top: 2.825rem;
    margin-left: calc(0.3rem + 3.9375rem);
    height: 0.85rem;
    font-family: ChuangKeTieJinGangTi-2;
    font-size: 0.9rem;
    color: #FFFFFF;
    line-height: 0.12rem;
}

.about .container .wrapper .banner .desc {
    margin-top: -0.0625rem;
    margin-left: calc(0.3rem + 3.9375rem);
    font-weight: 800;
    font-size: .4125rem;
    color: #FFFFFF;
    line-height: 1;
}

/* company */
.about .container .wrapper .company {
    position: relative;
    padding: 0;
    margin-top: 2.5rem;
    transform: scale(0.8);
}

.about .container .wrapper .company .title-line {
    width: 14.98rem;
    height: 0.91rem;
    background-image: url(../images/about/company-title.png);
}

.about .container .wrapper .company .content {
    display: flex;
    justify-content: center;
    margin:  0 auto;
}

.about .container .wrapper .company .mark {
    position: absolute;
    right: -2rem;
    bottom: .875rem;
    font-family: "ChuangKeTieJinGangTi-2";
    font-weight: 400;
    font-size: 3.775rem;
    color: #7D6A92;
    opacity: 0.08;
    pointer-events: none;
}

.about .container .wrapper .company .info {
    position: relative;
    width: 9.7rem;
}

.about .container .wrapper .company .info .title {
    font-family: "ChuangKeTieJinGangTi-2";
    font-weight: 400;
    font-size: 1.0125rem;
    color: #FFFFFF;
}

.about .container .wrapper .company .info .desc {
    font-weight: 300;
    font-size: 0.25rem;
    line-height: .42rem;
    color: #FFFFFF;
    margin-top: 0;
}

.about .container .wrapper .company .info .desc span {
    font-weight: 800;
    font-size: 0.33rem;
}

.about .container .wrapper .company .img {
    position: relative;
    width: 4.7rem;
    height: 3.93rem;
    margin-right: 0.94rem;
}

/* corporate-culture */
.about .container .wrapper .corporate-culture {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: #160B22;
    padding: 0 0 0.1rem 0;
}

.about .container .wrapper .corporate-culture .title-line {
    background-image: url(../images/about/corporate-culture-title.png);
}

.about .container .wrapper .corporate-culture .content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transform: scale(0.8);
}

.about .container .wrapper .corporate-culture .title {
    font-family: "ChuangKeTieJinGangTi-2";
    font-weight: 400;
    font-size: 1.0125rem;
    color: #FFFFFF;
}

.about .container .wrapper .corporate-culture .list {
    display: flex;
    width: 95%;
    justify-content: space-between;
    margin-top: 0.5rem;
}

.about .container .wrapper .corporate-culture .list .item {
    display: flex;
    align-items: center;
}

.about .container .wrapper .corporate-culture .list .item:nth-child(1) img {
    width: 4.19rem;
    height: 2.01rem;
}

.about .container .wrapper .corporate-culture .list .item:nth-child(2) img {
    width: 4.55rem;
    height: 2.09rem;
}

.about .container .wrapper .corporate-culture .list .item:nth-child(3) img {
    width: 4.49rem;
    height: 2.17rem;
}

.about .container .wrapper .corporate-culture .list .item .icon {
    height: 2.625rem;
    margin-bottom: .625rem;
    margin-left: -0.375rem;
    margin-right: .3rem;
}

.about .container .wrapper .corporate-culture .list .item .name {
    font-weight: 800;
    font-size: .4625rem;
    color: #FFFFFF;
    margin-bottom: .2125rem;
}

.about .container .wrapper .corporate-culture .list .item .desc {
    font-weight: 400;
    font-size: .3rem;
    color: #FFFFFF;
}

/* future-development */
.about .container .wrapper .future-development {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0;
}

.about .container .wrapper .future-development .title-line {
    background-image: url(../images/about/future-development-title.png);
}

.about .container .wrapper .future-development .content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transform: scale(0.8);
}

.about .container .wrapper .future-development .title {
    font-family: "ChuangKeTieJinGangTi-2";
    font-weight: 400;
    font-size: 1.0125rem;
    color: #FFFFFF;
}

.about .container .wrapper .future-development .list {
    display: flex;
    height: 4.2625rem;
    margin-top: .9rem;
}

.about .container .wrapper .future-development .list .line{
    width: .1rem;
    height: 100%;
    background-color: #FFFFFF;
    border-radius: .1rem;
}

.about .container .wrapper .future-development .list .item {
    position: relative;
    width: 3.6rem;
    max-width: 3.6625rem;
    margin: 0 .7625rem;
}

.about .container .wrapper .future-development .list .item .mark {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    font-family: "ChuangKeTieJinGangTi-2";
    font-weight: 400;
    font-size: 5.1375rem;
    color: #D6ABFF;
    font-style: italic;
    opacity: 0.06;
    line-height: 1.05;
    pointer-events: none;
}

.about .container .wrapper .future-development .list .item .name {
    position: relative;
    font-weight: bold;
    font-size: .45rem;
    color: #FFFFFF;
    text-align: center;
}

.about .container .wrapper .future-development .list .item .desc {
    position: relative;
    font-weight: 400;
    font-size: .325rem;
    color: #FFFFFF;
}

/* join-us */
.about .container .wrapper .join-us {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0;
    height: 6.55rem;
    background-image: url(../images/about/join-bg.png);
    background-size: cover;
    background-position: center;
}

.about .container .wrapper .join-us .content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transform: scale(0.8) translateX(-4rem);
}

.about .container .wrapper .join-us .title {
    font-family: "ChuangKeTieJinGangTi-2";
    font-weight: 400;
    font-size: 0.85rem;
    color: #FFFFFF;
}

.about .container .wrapper .join-us .name1 {
    width: 10.5rem;
    margin-top: .875rem;
    font-weight: 500;
    font-size: .42rem;
    color: #FFFFFF;
    text-align: center;
}

.about .container .wrapper .join-us .name2 {
    margin-top: .525rem;
    font-weight: 400;
    font-size: .3rem;
    color: #FFFFFF;
}

.about .container .wrapper .join-us .view-jobs {
    margin-top: .9rem;
    font-weight: normal;
    font-size: .32rem;
    width: 3.24rem;
    height: 0.86rem;
    background: #EF8B2F;
    border-radius: 0.0875rem;
    color: #FFF;
    line-height: 0.86rem;
    text-align: center;
    cursor: pointer;
}

.about .container .wrapper .join-us .view-jobs:hover {
    opacity: 0.8;
}

/* contact-us */
.about .container .wrapper .contact-us {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0rem 0 1.5rem 0;
}

.about .container .wrapper .contact-us .title-line {
    background-image: url(../images/about/contact-us-title.png);
}

.about .container .wrapper .contact-us .content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transform: scale(0.8);
}

.about .container .wrapper .contact-us .mark {
    position: absolute;
    left: -2.5rem;
    top: 0;
    font-family: "ChuangKeTieJinGangTi-2";
    font-weight: 400;
    font-size: 3.775rem;
    color: #7D6A92;
    opacity: 0.08;
    line-height: 1.2;
    pointer-events: none;
    transform-origin: top left;
}

.about .container .wrapper .contact-us .title {
    font-family: "ChuangKeTieJinGangTi-2";
    font-weight: 400;
    font-size: 1.0125rem;
    color: #FFFFFF;
}

.about .container .wrapper .contact-us .box {
    display: flex;
    width: 12.25rem;
    height: 6.2375rem;
    margin-top: 1.125rem;
    background: #544362;
    box-shadow: 0 .1rem .2rem 0 rgba(38, 29, 46, 0.17);
    border-radius: .125rem;
}

.about .container .wrapper .contact-us .box .left {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
    flex: none;
    width: 3.4625rem;
    height: 100%;
    background: #62556D;
    box-shadow: .1rem .0125rem .2rem 0 rgba(38, 29, 46, 0.17);
    border-radius: .125rem;
}

.about .container .wrapper .contact-us .box .left .item {
    font-weight: 800;
    font-size: .45rem;
    color: #CBCBCB;
    cursor: pointer;
}

.about .container .wrapper .contact-us .box .left .active {
    color: #FFFFFF;
}

.about .container .wrapper .contact-us .box .left .item:hover {
    color: #FFFFFF
}

.about .container .wrapper .contact-us .box .right {
    flex: 1;
    display: flex;
    flex-direction: column;
    margin-left: .9125rem;
}

.about .container .wrapper .contact-us .box .right .name {
    margin-top: .275rem;
    font-weight: 800;
    font-size: .4rem;
    color: #FFFFFF;
}

.about .container .wrapper .contact-us .box .right .address {
    margin-top: .125rem;
    font-weight: 400;
    font-size: .3125rem;
    color: #FFFFFF;
}

.about .container .wrapper .contact-us .box .right .phone {
    margin-top: .0625rem;
    font-weight: 400;
    font-size: .3125rem;
    color: #FFFFFF;
}

.about .container .wrapper .contact-us .box .right .location {
    width: 6.4875rem;
    height: 3.425rem;
    margin-top: .25rem;
    margin-left: .1875rem;
}

.about .container .wrapper .contact-us .box .right .location .map {
    width: 100%;
    height: 100%;
}