@media screen and (min-width:1600px) {
    body .layui-tab-title {
        /* left: 7%; */
    }
}

@media screen and (min-width:1440px) {
    body .inside-header-box {
        /* padding: 120px 0px; */
    }
}



@media screen and (max-width:800px) {
    /*body .advantage-list-rig-icon{*/
    /*  display: none;*/
    /*}*/
    body .advantage-list-rig-content{
        width: 213px;
    }
body .structureImg-down-item p{
    height: 79px;
}
    body .advantage-list-rig-icon{
        display: none;
    }
    body .contact-rig-form-commit {
        margin-top: 5px;
    }
    body .inside-header-up-title-content{
        margin-top: 0;
    }
    body .inside-header-down-box{
        width: 90%;
        /*bottom: 20px;*/
    }
    body .mode-list .active{
        width: 94px;
    }
    body .contact-rig-form{
        position: relative;
        width: 100%;
        margin-left: 0;
    }
    body .layui-tab-box {
        margin-top: 60px;
    }

    body .structureImg-down-item {
        width: 49%;
    }

    body .contact-left-hardware-desc-item {
        width: 50%;
    }

    body .contact-left-software-desc-item-img {
        width: 100%;
    }

    body .structureImg-down {
        width     : 100%;
        height    : 100%;
        margin-top: 30px;
    }

    body .structureImg-up {
        height: 564px;
    }

    body .value-tab-item:hover .value-tab-item__content-text {
        transform: translateY(-40px);

    }

    body .value-tab-item {
        width: 100px;
    }

    body .module-banner-tab-list-box {
        width: 250px;
    }

    body .module-banner-tab-list {
        width: 125px;
    }

    body .layui-tab-title li {
        font-size  : 18px;
        margin-left: 0;

    }

    body .layui-tab-title {
        width : 100%;
        height: 100%;

        flex-flow: wrap;
    }

    body .inside-header-down {
        margin-top   : 11px;
        width        : 136px;
        height       : 35px;
        line-height  : 35px;
        border-radius: 22px;
        font-size    : 15px;
    }

    body .inside-header-box {
        min-height: 203px;
    }

    body .inside-header {
        width: 90%;
    }

    /* body .inside-header-box-bjBox{
        width: 100%;
        height: 190px;
        background-size:100% 100%;
    } */

    body .scene-img-item-txt {
        font-size: 19px;
    }

    body .scene-img-item-txt p {
        margin: 0;
        font-size: 15px;
    }

    body .value-tab-item__content {
        height   : 37px;
        font-size: 12px;
    }

    body .value-tab-box-ul {
        width    : 100%;
        flex-wrap: wrap;
        justify-content: center;
    }

    body .structureImg-down-item-img {
        height: 119px;
        width : 100%;
    }

    body .common-footer {
        /* margin-top: 265px; */
    }

    body .inside-header-up {
        width    : 81%;
        font-size: 17px;
    }

    body .inside-header-center {
        width      : 79%;
        line-height: 18px;
        font-size  : 10px;
        margin-top : 20px;
        /*display: -webkit-box;*/
        /*-webkit-box-orient: vertical;*/
        /*-webkit-line-clamp: 5;*/
        /*overflow: hidden;*/
    }

    .structureImg-down-item-img {
        height: 124px;
    }

    .inside-down .module-banner-box {
        width: 100%;
    }

    .inside-down .module-banner-tab .module-banner-tab-list .module-tab-nav li {
        font-size: 12px;
    }

    .inside-down .advantage-list-rig-title {
        font-size: 13px;
    }

    .inside-down .advantage-list-rig-desc-txt {
        font-size: 11px;
        width: 100%;
    }

    .structureImg .structureImg-up-title-imgbox {
        height: 440px;
        width : 90%;
    }

    .structureImg .structureImg-up-title-imgbox-img {

        height: 321px;
        width : 100%;
    }

    .structureImg .structureImg-down-item-img img {
        height: 119px;
    }

    body .contact {
        height: 100%;
    }

    .box .scene {
        /* margin-bottom: 191px; */
        /*height: 100%;*/
    }

    .box .scene-img {
        width: 100%;
    }

    .box .scene-img-item {
        height: 122px;
        width : 33%;
    }

    body .contact-box {
        width    : 100%;
        flex-wrap: wrap;
    }

    body .contact-left {
        width: 100%;
    }

    body .contact-rig {
        width      : 100%;
        margin-left: 0px;
    }

    body .contact-rig-form-input-item-name {
        font-size: 21px;
    }

    body .contact-rig-form-input-item input {
        width : 183px;
        height: 38px;
    }

    body .contact-rig-title {
        font-size: 30px;
    }

    body .contact-rig-title-txt {
        font-size: 24px;
    }

    body .contact-rig-title-line {
        margin-top: 30px;
    }

    body .contact-rig-form-textarea {
        padding-left: 0;
        margin-top  : -6px;
    }

    body .contact-rig-form-commit-btn {
        --height: 43px;
        --width : 153px;
    }

    body .contact-rig-form-commit {
        margin-top: 5px;
    }
}



body {
    /* overflow-x: hidden; */

}
.message-box{
    width: 150px;
    height: 150px;
    background: rgb(216, 213, 213);
    border-radius: 10px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    line-height: 150px;
    text-align: center;
}
.common-title{
    /* padding: 0 20px; */

    height: 24px;
    width: 224px;
    text-align: center;
    border-left: 2px solid rgba(16, 76, 195, 1);
    border-right: 2px solid rgba(16, 76, 195, 1);
    margin-top: 51px;
    text-align: center;
    font-size: 27px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color: rgba(30, 30, 30, 1);
    line-height: 20px;
}
.box {
    width             : 100%;
    /* width          : 100vw; */
    display           : flex;
    flex-direction    : column;
    align-items       : center;
    /* justify-content:center; */
    padding-top       : 100px;
    position: relative;
}

.inside-header-box {
    width: 100%;
    min-height: 380px;
    /* height: 528px; */
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* justify-content: center; */
    /* padding: 50px 0px; */
    position: relative;
    background: url(../img/header-bj.jpg) no-repeat;
    background-size: cover;
    background-position: 50%;
}

/* .inside-header-box-bjBox {
    width          : 1920px;
    height         : 308px;
    position       : absolute;

    z-index: -1;
} */

.inside-header {
    width          : 1022px;
    /* padding-left: 80px; */
}

.inside-header-up-title-content {
    display: none;
    margin-top: 78px;
}

.inside-header-up {
    width      : 40%;
    font-size  : 30px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(255, 255, 255, 1);

}

.inside-header-center {
    width      : 600px;
    /* height  : 73px; */
    font-size  : 12px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(255, 255, 255, 1);
    margin-top : 34px;
    line-height: 23px;
    /*display: -webkit-box;*/
    /*-webkit-box-orient: vertical;*/
    /*-webkit-line-clamp: 4;*/
    /*overflow: hidden;*/

}
.inside-header-down-box{
    width: 1022px;
    /* position: absolute; */
    /* bottom: 70px; */
    /* margin-top: 30px; */
    margin: 30px 0;
}
.inside-header-down {


    width          : 177px;
    height         : 43px;
    background     : linear-gradient(270deg, rgba(56, 75, 187, 1), rgba(50, 117, 215, 1));
    border-radius  : 21px;
    font-size      : 14px;
    font-family    : Microsoft YaHei;
    font-weight    : 400;
    color          : rgba(255, 255, 255, 1);
    line-height    : 43px;
    text-align     : center;
    cursor         : pointer;
    /* transition     : all 650ms linear; */
    text-decoration: none !important;
}

.inside-header-down:hover {
    transform: translateY(-6px);
}

insideHeaderBtn {
    position      : fixed;
    left          : 0;
    top           : 0;
    border-radius : 50%;
    pointer-events: none;
    opacity       : 0;
}

.inside-down {
    width           : 100%;
    /* height       : 500px;
    background-color: red; */
}

.layui-tab-box {
    margin-top: 0;
    padding-top         : 100px;
    width              : 100%;
    display            : flex;
    flex-direction     : column;
    align-items        : center;
    background:rgba(250,250,250,1);
    /* background-color: red; */
}

.inside-down .layui-tab-content {
    width  : 100%;
    padding: 0;
}
.content-box{
    width: 100%;
}
.content-box-show {
    width  : 100%;
    padding: 0;
}

.layui-tab-item {}

.layui-tab-title {
    border-bottom-style   : none;
    width                 : 1022px;
    display               : flex;
    justify-content       : space-between;
    /* left               : 3%; */
}

.layui-tab-brief>.layui-tab-title .layui-this {
    /* font-size  : 18px;
    font-family: Microsoft YaHei;
    font-weight: 400; */
    color: rgba(16, 76, 195, 1);
}

.layui-tab-brief>.layui-tab-title .layui-this:after {}

.inside-down .layui-tab-title .title-item:hover::after {
    transform       : scaleX(1);
    transform-origin: left;
    /* border       : none; */
}

.inside-down .layui-tab-title .title-item::after {
    border-bottom   : 3px solid rgba(16, 76, 195, 1);
    position        : absolute;
    content         : "";
    top             : 37px;
    left            : 0;
    width           : 100%;
    height          : 3px;
    background      : #275FBD;
    transform       : scaleX(0);
    transform-origin: right;
    transition      : transform 0.5s;
    /* border       : none; */
}

body .box .inside-down .layui-tab-title .layui-this:after {
    border-bottom: 3px solid rgba(16, 76, 195, 1);
    transform    : scaleX(1);
    top          : 37px;
}

.layui-tab-title li {
    padding    : 0 6px;
    margin-left: 20px;
    font-size  : 18px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(30, 30, 30, 0.6);
    position   : relative;
}

/* 方案优势 */

.advantage {
    width         : 100%;
    display       : flex;
    flex-direction: column;
    align-items   : center;
}

.advantage-txt {
    width: 100%;

    margin-top : 51px;
    text-align : center;
    font-size  : 27px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(30, 30, 30, 1);
}

.module-banner-box {
    width              : 1020px;
    background         : url("../img/youshi.png");
    background-size    : cover;
    background-position: center center;
    height             : 300px;
    margin-top         : 68px;
}

.module-banner-tab-list {
    width      : 188px;
    height     : 300px;
    display    : flex;
    align-items: center;
    background : rgba(255, 255, 255, 0.5);
}

.module-tab-nav {
    width: 100%;
}

.module-banner-tab .module-banner-tab-list .module-tab-nav li {
    width      : 100%;
    height     : 60px;
    color      : rgba(41, 216, 232, 0.6);
    font-size  : 18px;
    font-family: Microsoft YaHei;
    font-weight: bold;

}

.module-banner-tab .module-banner-tab-list .module-tab-nav .on {
    background: rgba(41, 216, 232, 0.2);

    color: rgba(41, 216, 232, 1);
    border-left: 3px solid #29D8E8;
}

.module-banner-tab-list-box {
    width      : 832px;
    padding    : 0;
    height     : 300px;
    display    : flex;
    align-items: center;
}

.advantage-list-rig-icon {
    width    : 145px;
    height   : 118px;
    position : absolute;
    right    : 98px;
    top      : 50%;
    transform: translateY(-50%);
}

.advantage-list-rig-icon img {
    width : 100%;
    height: 100%;
}

.module-tab-box-ma {
    width: 100%;
}

.advantage-list {

    width : 80%;
    height: 300px;

    border-radius: 3px;
    background   : #275FBD;
    margin-top   : 68px;
}

.advantage-list-left {
    width      : 250px;
    height     : 396px;
    background : rgba(255, 255, 255, 0.05);
    padding-top: 20px;
    float      : left;
}

.advantage-list-rig-desc {
    margin-top: 41px;
}

.advantage-list-left-item {
    margin-top: 26px;
    /* height : 80px; */

    font-size  : 18px;
    font-family: Microsoft YaHei;
    font-weight: bold;
    color      : rgba(41, 216, 232, 1);
    text-align : center;
    line-height: 80px;


}

.advantage-list-left-item-on {
    border-left: 4px solid #29D8E8;
    background : rgba(41, 216, 232, 0.2);
}

.advantage-list-rig {
    display        : flex;
    flex-direction : column;
    justify-content: center;
    /* padding-top : 109px; */
    box-sizing     : border-box;
    height         : 300px;

    position: relative;

}

.advantage-list-rig-content {
    position : absolute;
    top      : 50%;
    transform: translateY(-50%);
    left     : 13px;

}


.advantage-list-rig:nth-child(1){
    display: block;
}
.advantage-list-rig:nth-child(2){
    display: none;
}
.advantage-list-rig:nth-child(3){
    display: none;
}

.advantage-list-rig-title {
    font-size  : 23px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(255, 255, 255, 1);
}

.advantage-list-rig-desc-item {
    margin-top: 11px;
    /*height    : 20px;*/
    display   : flex;
}

.advantage-list-rig-desc-dot {
    width        : 10px;
    height       : 10px;
    background   : rgba(255, 255, 255, 1);
    border-radius: 50%;

    margin-top: 3px;

}

.advantage-list-rig-desc-txt {
    font-size  : 14px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(255, 255, 255, 1);
    width: 532px;
    margin-left: 11px;
}

/* 价值 */
.value {
    /* width         : 100%; */
    height           : 370px;
    display          : flex;
    flex-direction   : column;
    align-items      : center;
    justify-content  : center;
    background: #fff;
    /* margin-top    : 151px; */
    /* padding       : 114px 0; */
}

.value-title {
    width      : 100%;
    font-size  : 27px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(30, 30, 30, 1);
    text-align : center;

}

.value-tab-box-ul {
    margin-top     : 90px;
    width          : 1020px;
    display        : flex;
    justify-content: space-between;
    background: #FAFAFA;
}

.value-tab-item {
    display        : flex;
    justify-content: center;
    flex-direction : column;
    align-items    : center;
    position       : relative;
    /* padding     : 0 60px; */
    box-sizing     : border-box;
    text-align     : center;
    margin-top     : 10px;
}

.value-tab-item:hover .value-item-img {
    animation: imgRoate .1s 4;
}

@keyframes imgRoate {
    0% {
        transform: rotateZ(-10deg);
    }

    100% {
        transform: rotateZ(10deg);
    }
}

.value-tab-item__content {
    display        : flex;
    flex-direction : column;
    justify-content: flex-start;
    align-items    : center;
    position       : relative;
    width          : 100%;
    height         : 50px;
    overflow       : hidden;
    margin-top     : 20px;
    font-size      : 17px;
}

.value-tab-item:hover .value-tab-item__content-text {
    transform : translateY(-50px);
    transition: 300ms;
}

.value-item-img {
    width         : 34px;
    height        : 34px;

}
.value-tab-item:nth-child(4) .value-item-img{
    /*width: 44px;*/
    /*height: 30px;*/
}
.value-item-img img {
    width : 100%;
    height: 100%;
}

.value-item-txt1 {
    margin-top: 0px;
}

.value-tab-box.layui-tab-brief>.layui-tab-title .layui-this {
    font-size  : 20px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(44, 127, 254, 1);

}

.value-tab-box .value-tab-box-ul.layui-tab-title li {
    font-size  : 20px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(30, 30, 30, 1);
    line-height: 24px;
    position   : relative;
    padding    : 0 21px;
}

.value-tab-box.layui-tab-brief>.layui-tab-title .layui-this:after {
    border-bottom: none;
}

/* .value-tab-box .layui-tab-content {
    margin-top: 264px;
} */

.value-tab-item {}



.value-item-txt2 {}

.value-item-content-up {
    /* width        : 100vw;
    height          : 870px;
    background-color: aqua; */
}

/* 结构拓扑图 */
.structureImg {
    width         : 100%;
    display       : flex;
    flex-direction: column;
    align-items   : center;
    background-color: #fff;

}

.structureImg-up {
    width                    : 100%;
    height                   : 870px;
    background               : url("../img/img_chanpinzx.png") no-repeat;
    background-size          : cover;
    /* background-position   : center center; */
    display                  : flex;
    flex-direction           : column;
    align-items              : center;
    justify-content          : center;
    /* padding               : 47px 0; */
}

.structureImg-up-title {
    font-size  : 27px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(255, 255, 255, 1);
    text-align : center;
}

.structureImg-up-title-imgbox {
    margin-top     : 26px;
    width          : 803px;
    height         : 536px;
    display        : flex;
    justify-content: center;
    align-items    : center;
    background     : rgba(29, 94, 150, 0.26)
}

.structureImg-up-title-imgbox-img {
    width : 463px;
    height: 490px;
}

.structureImg-up-title-imgbox-img img {
    width : 100%;
    height: 100%;
}

.structureImg-down {
    width             : 1020px;
    height            : 370px;
    display           : flex;
    justify-content   : space-between;
    align-items       : center;
    margin-top: 112px;
    /* padding        : 49px 0; */
}

.structureImg-down-item {
    /* width     : 46%; */
    text-align: center;
}

.structureImg-down-item:hover .structureImg-down-item-img {
    transform : scale(1.03);
    box-shadow: 5px 8px 10px rgba(37, 36, 33, 0.2);
}

.structureImg-down-item-img {
    width     : 496px;
    height    : 285px;
    transition: all 350ms linear;
    box-shadow: 2px 5px 8px rgba(37, 36, 33, 0.2);
}

.structureImg-down-item-img img {
    width : 100%;
    height: 100%;
}

.structureImg-down-item p {
    margin-top : 34px;
    font-size  : 18px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(0, 0, 0, 1);
}

/* 应用场景 */
.scene {
    /*height: 420px;*/
    display              : flex;
    flex-direction       : column;
    align-items          : center;
    justify-content      : center;
    /* padding           : 70px 0; */
}

.scene-title {
    font-size  : 27px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(30, 30, 30, 1);
    text-align : center;

}

.scene-img {
    margin-top     : 80px;
    width          : 1020px;
    display        : flex;
    justify-content: start;
    flex-wrap: wrap;
}

.scene-img-item {
    margin-left: 19px;
    width          : 315px;
    height         : 225px;
    /* background  :rgba(51,51,51,0.5); */

    border-radius  : 5px;
    display        : flex;
    justify-content: center;
    align-items    : center;

    box-shadow     : 2px 5px 8px rgba(37, 36, 33, 0.2);
    position: relative;
    margin-top: 23px;
}




.scene-img-item-img{
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius  : 5px;
}
.scene-img-item-img img{
    width: 100%;
    height: 100%;
    transition     : all 350ms linear;
}
.scene-img-item:hover img{
    transform : scale(1.1);
    /* box-shadow: 5px 8px 10px rgba(37, 36, 33, 0.2); */
}
.scene-img-item-txt {
    font-size  : 23px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(255, 255, 255, 1);
    text-align : center;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50% ,-50%);
}

/* 联系我们 */
.contact {
    /* height         : 800px; */
    width          : 100%;
    display        : flex;
    justify-content: center;
    align-items    : center;
    background-color: #fff;
    margin-top: 50px;
}

.contact-box {
    width          : 1020px;
    display        : flex;
    justify-content: space-between;
    height: 650px;

}

.contact-left {
    width   : 361px;
    margin-top: 50px;
    /* float: left; */
}

.contact-left-hardware {
    /* width : 557px; */
    width     : 100%;
    /* height    : 324px; */
    margin-top: 20px;
    padding-top: 20px;
    background:rgba(250,250,250,1);
}

.contact-left-hardware-title {
    width      : 100%;
    font-size  : 19px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(30, 30, 30, 1);
    text-align : center;
}

.contact-left-hardware-desc {
    width          : 100%;
    /* height         : 271px; */
    display        : flex;
    justify-content: space-around;
    margin-top     : 18px;
    margin-bottom: 0;
}

.contact-left-hardware-desc-item-img {
    width: 180px;
    height: 99px;
}

.contact-left-hardware-desc-item-img img {
    width : 100%;
    height: 100%;
}

.contact-left-hardware-desc-item {
    width          : 45%;
    /* height         : 200px; */
    display        : flex;
    flex-direction : column;
    align-items    : center;
    justify-content: center;
}

.contact-left-hardware-desc-item p {
    font-size  : 10px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(0, 0, 0, 1);
    margin-top : 24px;
}

.item_btn_wrapper {
    height: 30px;
}

.contact-left-hardware-desc-item-btn {
    /* margin-top   : 18px; */
    /* width:81px;
    height:20px; */
    background   : linear-gradient(270deg, rgba(56, 75, 187, 1), rgba(50, 117, 215, 1));
    padding      : 4px 20px;
    border-radius: 13px;
    font-size    : 10px;
    font-family  : Microsoft YaHei;
    font-weight  : 400;
    color        : rgba(255, 255, 255, 1) !important;
    text-align   : center;
    line-height  : 20px;
    cursor       : pointer;
    display      : none;
}
.contact-left-hardware-desc-item-btn:link{
    text-decoration: none;
}
.contact-left-software-desc-item-img {
    width : 171px;
    height: 99px;
}

.contact-left-software-desc-item-img img {
    width : 100%;
    height: 100%;
}

.contact-left-software-desc-item-btn {
    width           : 19px;
    height          : 19px;
    background      : rgba(94, 113, 202, 1);
    border-radius   : 50%;
    text-align      : center;
    line-height     : 15px;
    color           : #fff;
    font-size       : 15px;
    /* margin-top   : 18px; */
    cursor          : pointer;

}

/* 联系我们表单 */
.contact-rig-form{
    width         : 557px;
    /* height     : 638px; */
    margin-left   : 225px;
    background: url("../img/contactRig.png");
    background-size: cover;
    background-position: 50%;
    position: absolute;
    bottom: 12px;

}
.contact-rig {
    width         : 557px;
    /* height     : 638px; */
    margin-left   : 92px;
    background: url("../img/contactRig.png");
    background-size: cover;
    background-position: 50%;
}

.contact-rig-title {
    font-size  : 27px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(30, 30, 30, 1);
    text-align : center;
}

.contact-rig-title-line {
    width:29px;


    border-top: 4px solid #000000;
    margin-top: 45px;
}

.contact-rig-title-txt {
    font-size  : 20px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(0, 0, 0, 1);
    margin-top : 20px;
}

.contact-rig-form-input {
    margin-top     : 18px;
    width          : 100%;
    display        : flex;
    flex-wrap      : wrap;
    justify-content: space-between;
}

.contact-rig-form-input-item {
    margin-top: 10px;
    width     : 50%;
}

.contact-rig-form-input-item-name {
    font-size  : 19px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(0, 0, 0, 1);
}

.contact-rig-form-input-item-icon {
    font-size: 19px;
    color    : #FA5959;
}

.contact-rig-form-input-item input {
    border    : none;
    width:205px;
    height:31px;
    background: rgba(0, 0, 0, 0.1);

    border-radius: 4px;
}

.contact-rig-form-need-txt {
    font-size  : 19px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(0, 0, 0, 1);
    margin-top : 25px;
}

.contact-rig-form-need-txt span {
    color: #FA5959;
}

.contact-rig-form-need {
    width      : 100%;
    font-size  : 16px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color      : rgba(0, 0, 0, 1);
    display    : flex;
    flex-wrap  : wrap;
    margin-top : 20px;
}

.contact-rig-form-need li {
    position: relative;
    width   : 25%;
    /*height  : 36px;*/
    margin-top: 15px;
}

.contact-rig-form-need span {
    display     : block;
    padding-left: 27px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.contact-rig-form-need input {
    position  : absolute;
    top       : 3px;
    width     : 16px;
    height    : 16px;
    background: rgba(0, 0, 0, 0.1);

    border-radius        : 2px;
    /* border            : none; */
    /* -webkit-appearance:none; */

}

.contact-rig-form-textarea {
    margin-top: 30px;
    width     : 100%;
    height    : 67px;
    background: rgba(0, 0, 0, 0.1);

    border-radius: 3px;
    border       : none;
    font-size    : 14px;
    padding-left : 12px;
}

.contact-rig-form-commit {
    margin-top     : 32px;
    display        : flex;
    justify-content: center;
}


.contact-rig-form-commit-btn {
    --color                    : #fff;
    --background               : linear-gradient(270deg, rgba(56, 75, 187, 1), rgba(50, 117, 215, 1));
    --height                   : 43px;
    --width                    : 177px;
    --icon                     : rgb(47, 136, 236);
    padding                    : 0;
    cursor                     : pointer;
    text-align                 : center;
    position                   : relative;
    border                     : none;
    outline                    : none;
    background                 : none;
    -webkit-appearance         : none;
    -webkit-tap-highlight-color: transparent;
    width                      : var(--width);
    letter-spacing             : .5px;
    font-size                  : 16px;
    font-family                : Microsoft YaHei;
    font-weight                : 400;
    color                      : var(--color);
    line-height                : var(--height);
    border-radius              : 21px;
    line-height                : 43px;
}

.contact-rig-form-commit-btn:before,
.contact-rig-form-commit-btn:after {
    content : '';
    display : block;
    position: absolute;
    top     : 50%;
    left    : 50%;
}

.contact-rig-form-commit-btn:before {
    -webkit-transform       : translate(-50%, -50%);
    transform               : translate(-50%, -50%);
    width                   : var(--before-w, var(--width));
    height                  : var(--before-h, var(--height));
    border-radius           :21px;
    background              : var(--background);
    -webkit-transform-origin: 50% 50%;
    transform-origin        : 50% 50%;
    -webkit-transition      : width .3s, height .3s, border-radius .2s;
    transition              : width .3s, height .3s, border-radius .2s;
    -webkit-transition-delay: .2s;
    transition-delay        : .2s;
}

.contact-rig-form-commit-btn:after {
    width               : 16px;
    height              : 16px;
    /* margin           : -8px 0 0 -8px; */
    background          : var(--background);
    z-index             : 2;
    border-radius       : 50%;
    -webkit-transform   : scale(0);
    transform           : scale(0);
}

.contact-rig-form-commit-btn span {
    z-index                 : 1;
    display                 : block;
    position                : relative;
    opacity                 : var(--span-o, 1);
    -webkit-transform       : scale(var(--span-s, 1));
    transform               : scale(var(--span-s, 1));
    -webkit-transition      : opacity .3s, -webkit-transform .2s;
    transition              : opacity .3s, -webkit-transform .2s;
    transition              : opacity .3s, transform .2s;
    transition              : opacity .3s, transform .2s, -webkit-transform .2s;
    -webkit-transition-delay: .2s;
    transition-delay        : .2s;
}

.contact-rig-form-commit-btn svg {
    width             : 15px;
    height            : 13px;
    display           : block;
    position          : absolute;
    left              : 50%;
    top               : 50%;
    stroke            : #fff;
    stroke-width      : 2px;
    stroke-linecap    : round;
    stroke-linejoin   : round;
    fill              : none;
    -webkit-transform : translate(-50%, -50%);
    transform         : translate(-50%, -50%);
    stroke-dasharray  : 17px;
    stroke-dashoffset : var(--svg-o, 17px);
    -webkit-transition: stroke-dashoffset .3s ease;
    transition        : stroke-dashoffset .3s ease;
}

.contact-rig-form-commit-btn.processing {
    --before-w: 41px;
    --before-h: 41px;
    --before-r: 22px;
    --span-o  : 0;
    --span-s  : .6;
    --after-s : 1;
    --svg-o   : 34px;
}

.contact-rig-form-commit-btn.processing:before {
    -webkit-animation: pulse 3s linear forwards;
    animation        : pulse 3s linear forwards;
}

.contact-rig-form-commit-btn.processing:after {
    -webkit-animation: dot 3s linear forwards;
    animation        : dot 3s linear forwards;
}

.contact-rig-form-commit-btn.processing svg {
    -webkit-transition-delay: 3s;
    transition-delay        : 3s;
}

@-webkit-keyframes pulse {
    4% {
        -webkit-transform: translate(-50%, -50%) scaleX(1.1);
        transform        : translate(-50%, -50%) scaleX(1.1);
    }

    8% {
        -webkit-transform: translate(-50%, -50%);
        transform        : translate(-50%, -50%);
    }

    24%,
    56%,
    88% {
        -webkit-transform: translate(-50%, -50%) scale(0.8);
        transform        : translate(-50%, -50%) scale(0.8);
    }

    40%,
    72% {
        -webkit-transform: translate(-50%, -50%) scale(1.2);
        transform        : translate(-50%, -50%) scale(1.2);
    }
}

@keyframes pulse {
    4% {
        -webkit-transform: translate(-50%, -50%) scaleX(1.1);
        transform        : translate(-50%, -50%) scaleX(1.1);
    }

    8% {
        -webkit-transform: translate(-50%, -50%);
        transform        : translate(-50%, -50%);
    }

    24%,
    56%,
    88% {
        -webkit-transform: translate(-50%, -50%) scale(0.8);
        transform        : translate(-50%, -50%) scale(0.8);
    }

    40%,
    72% {
        -webkit-transform: translate(-50%, -50%) scale(1.2);
        transform        : translate(-50%, -50%) scale(1.2);
    }
}

@-webkit-keyframes dot {
    8% {
        -webkit-transform: scale(0);
        transform        : scale(0);
    }

    16% {
        -webkit-transform: scale(1) rotate(30deg) translateX(48px);
        transform        : scale(1) rotate(30deg) translateX(48px);
    }

    95% {
        -webkit-transform: scale(1) rotate(1000deg) translateX(48px);
        transform        : scale(1) rotate(1000deg) translateX(48px);
    }

    100% {
        -webkit-transform: scale(0.125) rotate(1050deg) translate(52px, -6px);
        transform        : scale(0.125) rotate(1050deg) translate(52px, -6px);
    }
}

@keyframes dot {
    8% {
        -webkit-transform: scale(0);
        transform        : scale(0);
    }

    16% {
        -webkit-transform: scale(1) rotate(30deg) translateX(48px);
        transform        : scale(1) rotate(30deg) translateX(48px);
    }

    95% {
        -webkit-transform: scale(1) rotate(1000deg) translateX(48px);
        transform        : scale(1) rotate(1000deg) translateX(48px);
    }

    100% {
        -webkit-transform: scale(0.125) rotate(1050deg) translate(52px, -6px);
        transform        : scale(0.125) rotate(1050deg) translate(52px, -6px);
    }
}

.common-header {
    width   : 100%;
    position: fixed;
    top     : 0;
    z-index : 2;
}

.common-footer {
    width: 100%;
}