/* ---------------------------banner---------------------------------- */



.banner {

    width: 100%;

    overflow: hidden;

    margin-top: 74px;

}



@media all and (max-width:900px) {

    .banner {

        margin-top: 50px;

    }

}



.banner img {

    width: 100%;

    object-fit: cover;

}



/* ---------------------------patent-box---------------------------------- */



.patent-box {

    width: 100%;

    overflow: hidden;

    padding-bottom: 90px;

}



.patent {

    width: 1200px;

    margin: 0 auto;

}



.patent-matter {

    width: 100%;

}



.patent-matter ul li {

    width: 50%;

    float: left;

    position: relative;

}



.patent-matter ul li:nth-child(1) h4 {

    width: 91%;

    height: 256px;

    overflow: hidden;

}



.patent-matter ul li:nth-child(1) h4 img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    transition: all 1s ease-in-out;

}



.patent-matter ul li:nth-child(1) h4 img:hover {

    transform: scale(1.1);

}



.patent-matter ul li:nth-child(1) h5 {

    width: 91%;

    height: 256px;

    border: 3px solid #b7d200;

    position: absolute;

    left: 4%;

    top: 8%;

    z-index: -1;

}



.patent-matter ul li:nth-child(2) p {

    font-size: 16px;

    color: #555555;

    line-height: 26px;

    width: 95%;

    margin-left: 5%;

    margin-top: 8%;

}



/* ---------------------------------apply-box------------------------------------------ */



.apply-box {

    width: 100%;

    height: 718px;

    background-image: url('../images/public/apply_bg.png');

    overflow: hidden;

}



.apply {

    width: 1200px;

    margin: 0 auto;

}



.apply-matter {

    width: 100%;

    padding-bottom: 10px;

    overflow: hidden;

}



.apply-matter ul {}



.apply-matter ul li {

    width: 23%;

    margin-left: 1%;

    height: 457px;

    float: left;

    text-align: center;

}



.apply-icon {

    width: 86px;

    height: 86px;

    margin-top: 40px;

}



.apply-matter ul li h3 {

    font-size: 22px;

    color: #333333;

    width: 90%;

    margin-left: 5%;

    white-space: nowrap;

    text-overflow: ellipsis;

    overflow: hidden;

    margin-top: 30px;

}



.apply-line {

    width: 31px;

    height: 1px;

    margin: 20px 0 24px 0;

}



.apply-matter ul li p {

    font-size: 13px;

    color: #555555;

    text-align: left;

    line-height: 22px;

    width: 90%;

    margin-left: 5%;

    overflow: hidden;

    display: -webkit-box;

    text-overflow: ellipsis;

    -webkit-line-clamp: 8;

    -webkit-box-orient: vertical;

}



.apply-matter ul li:hover {

    -moz-box-shadow: 0 2px 10px 2px #0083a5;

    -webkit-box-shadow: 0 10px 5px 2px #0083a5;

    box-shadow: 0 2px 10px 2px #0083a5;

}



.apply-matter ul li:nth-child(1) {

    background-image: url('../images/patent/apply_icb1.jpg');

}



.apply-matter ul li:nth-child(2) {

    background-image: url('../images/patent/apply_icb2.jpg');

}



.apply-matter ul li:nth-child(3) {

    background-image: url('../images/patent/apply_icb3.jpg');

}



.apply-matter ul li:nth-child(4) {

    background-image: url('../images/patent/apply_icb4.jpg');

}



/* ----------------------------------server-box----------------------------------------- */



.server-box {

    width: 100%;

    overflow: hidden;

    padding-bottom: 50px;

}



.server {

    width: 1200px;

    margin: 0 auto;

}



.server-matter {

    width: 100%;

    padding: 10px 4px;

    overflow: hidden;

}



.server-matter ul {

    margin-left: -1.5%;

}



.server-matter ul li {

    float: left;

    width: 31.833333333333333333333333333%;

    margin-left: 1.5%;

    position: relative;

    border: 1px solid #f8f8f8;

    text-align: center;

    height: 344px;

}



.server-matter ul li h1 {

    width: 382px;

    height: 180px;

    overflow: hidden;

}



.server-matter ul li h1 img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    transition: .8s ease-in-out;

}



.server-matter ul li h2 {

    width: 96px;

    height: 96px;

    border-radius: 100%;

    text-align: center;

    background-color: #fff;

    position: absolute;

    left: 50%;

    top: 0%;

    margin-top: 130px;

    transform: translate(-50%, 0);

}



.server-matter ul li h2 img {

    margin-top: 24px;

}



.server-matter ul li h3 {

    font-size: 22px;

    color: #333333;

    margin-top: 48px;

}



.server-matter ul li p {

    font-size: 13px;

    color: #666666;

    margin-top: 10px;

    width: 80%;

    margin-left: 10%;

    line-height: 22px;

    overflow: hidden;

    display: -webkit-box;

    text-overflow: ellipsis;

    -webkit-line-clamp: 2;

    -webkit-box-orient: vertical;

}



.server-matter ul li:hover {

    -moz-box-shadow: 0 2px 5px 1px #f5f5f5;

    -webkit-box-shadow: 0 2px 5px 1px #f5f5f5;

    box-shadow: 0 2px 5px 1px #f5f5f5;

}



.server-matter ul li:hover .server-pic {

    transform: scale(1.1);

}



/* ---------------------------------flow-box------------------------------------------ */



.flow-box {

    width: 100%;

    height: 577px;

    background-image: url('../images/public/flow_bg.png');

    background-repeat: no-repeat;

    overflow: hidden;

}



.flow {

    width: 1200px;

    margin: 0 auto;

}



.flow-nav {

    width: 100%;

    height: 100px;

    overflow: hidden;

    position: relative;

}



.flow-line {

    width: 92%;

    margin-left: 4%;

    height: 3px;

    margin-top: 26px;

}



.flow-nav div {

    text-align: center;

}



.flow-nav h4 {

    width: 54px;

    height: 54px;

    background-color: #fff;

    border-radius: 100%;

    text-align: center;

}



.flow-nav h4 i {

    display: inline-block;

    transition: all .8s ease-in-out;

}



.flow-nav div:hover i {

    animation: 1s flowT ease-in-out;

}



@keyframes flowT {

    0% {

        transform: translateY(-12px);

    }

    100% {

        transform: translateY(0);

    }

}



.flow-nav p {

    font-size: 17px;

    color: #fff;

    margin-top: 14px;

}



.flow-1 i {

    width: 26px;

    height: 28px;

    margin-top: 14px;

    background-image: url('../images/patent/flow1.png');

}



.flow-1 p {

    margin-left: -24px;

}



.flow-1 {

    position: absolute;

    top: 0%;

    left: 3%;

}



.flow-2 i {

    width: 26px;

    height: 29px;

    margin-top: 13.5px;

    background-image: url('../images/patent/flow2.png');

}



.flow-2 p {

    margin-left: -32px;

}



.flow-2 {

    position: absolute;

    top: 0%;

    left: 20%;

}



.flow-3 i {

    width: 32px;

    height: 30px;

    margin-top: 13px;

    background-image: url('../images/patent/flow3.png');

}



.flow-3 p {

    margin-left: -32px;

}



.flow-3 {

    position: absolute;

    top: 0%;

    left: 38%;

}



.flow-4 i {

    width: 27px;

    height: 29px;

    margin-top: 13.5px;

    background-image: url('../images/patent/flow4.png');

}



.flow-4 p {

    margin-left: -8px;

}



.flow-4 {

    position: absolute;

    top: 0%;

    right: 38%;

}



.flow-5 i {

    width: 29px;

    height: 28px;

    margin-top: 14px;

    background-image: url('../images/patent/flow5.png');

}



.flow-5 p {

    margin-left: -8px;

}



.flow-5 {

    position: absolute;

    top: 0%;

    right: 20%;

}



.flow-6 i {

    width: 22px;

    height: 30px;

    margin-top: 13px;

    background-image: url('../images/patent/flow6.png');

}



.flow-6 p {

    margin-left: -8px;

}



.flow-6 {

    position: absolute;

    top: 0%;

    right: 3%;

}



.flow-matter {

    width: 100%;

    overflow: hidden;

    margin-top: 40px;

}



.flow-matter ul {

    margin-left: -5%;

}



.flow-matter ul li {

    width: 45%;

    margin-left: 5%;

    float: left;

}



.flow-matter ul li h4 {

    width: 100%;

    overflow: hidden;

    margin: 8px 0;

}



.flow-matter ul li h4 p {

    float: left;

    color: #fff;

    font-size: 13px;

    width: 80%;

    white-space: nowrap;

    text-overflow: ellipsis;

    overflow: hidden;

}



.flow-matter ul li h4 a {

    float: right;

    font-size: 14px;

    color: #fff;

    text-decoration: underline;

}



.flow-matter ul li h4 a:hover {

    color: #0083a5;

}



.flow-matter ul li img {

    width: 100%;

    height: 1px;

}



.flow-notice {

    width: 100%;

    overflow: hidden;

    margin-top: 40px;

}



.flow-notice h4 {

    width: 700px;

    height: 50px;

    margin: 0 auto;

    border-radius: 50px;

    border: 1px solid #fff;

    text-align: center;

    line-height: 50px;

    color: #fff;

    font-size: 15px;

    overflow: hidden;

    white-space: nowrap;

    text-overflow: ellipsis;

    overflow: hidden;

}



/* -------------------------------------ccic-box-------------------------------------- */



.ccic-box {

    width: 100%;

    overflow: hidden;

    margin-bottom: 40px;

}



.ccic {

    width: 1200px;

    margin: 0 auto;

}



.ccic-matter {

    width: 100%;

}



.ccic-matter ul li {

    float: left;

}



.ccic-matter ul li:nth-child(1) {

    width: 49%;

    height: 432px;

    overflow: hidden;

    text-align: center;

}



.ccic-matter ul li:nth-child(2) {

    width: 51%;

    height: 432px;

    overflow: hidden;

}



.ccic-matter ul li:nth-child(2) h4 {

    width: 31%;

    height: 260px;

    overflow: hidden;

    float: left;

    margin-left: 10px;

    margin-top: 60px;

}



.ccic-matter ul li:nth-child(2) h4 img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    transition: all 1s ease-in-out;

}



.ccic-matter ul li:nth-child(2) h4 img:hover {

    transform: scale(1.1);

}



/* ---------------------------------form-box------------------------------------------ */



.form-box {

    width: 100%;

    height: 580px;

    background-image: url('../images/patent/formPut.jpg');

    background-repeat: no-repeat;

    overflow: hidden;

}



.form {

    width: 1200px;

    margin: 0 auto;

}



.form-matter {

    width: 972px;

    margin: 0 auto;

}



.form-matter h6 {

    overflow: hidden;

    margin-bottom: 30px;

    margin-left: -1.3%;

}



.form-matter h6 p {

    width: 48.7%;

    height: 50px;

    background-color: rgba(255, 255, 255, 0.5);

    border-radius: 6px;

    text-indent: 1em;

    line-height: 50px;

    float: left;

    margin-left: 1.3%;

}



.form-matter h6 p span {

    font-size: 14px;

    color: #fff;

}



.form-matter h6 p label {

    top: 14px;

    font-size: 14px;

    color: rgb(255, 255, 255);

    margin-right: 6px;

}



.form-matter h6 p input[type="radio"] {

    display: none;

}



.form-matter h6 p input[type='radio']+label:before {

    margin-top: -2px;

    content: '';

    display: inline-block;

    width: 14px;

    height: 14px;

    margin-right: 6px;

    border-radius: 100%;

    vertical-align: middle;

    border: 1px solid #E4E4E4;

    background: #FFFFFF;

}



.form-matter h6 p input[type='radio']:checked+label:before {

    background-color: #adadad;

    background-position: center center;

}



.form-list {

    width: 48.7%;

    height: 50px;

    background-color: rgba(255, 255, 255, 0.5);

    border-radius: 6px;

    text-indent: 1em;

    border: none;

    font-size: 14px;

    color: #fff;

    margin-left: 1.3%;

    float: left;

}



.form-list::-webkit-input-placeholder {

    color: #fff;

    font-size: 14px;

}



.form-matter h6 textarea {

    width: 98.7%;

    height: 100px;

    margin-left: 1.3%;

    background-color: rgba(255, 255, 255, 0.5);

    border-radius: 6px;

    text-indent: 1em;

    border: none;

    font-size: 14px;

    color: #fff;

    padding: 10px 10px 0 0;

}



.form-matter h6 textarea::-webkit-input-placeholder {

    color: #fff;

    font-size: 14px;

}



.form-matter h4 {

    width: 100%;

    text-align: center;

}



.form-click {

    width: 170px;

    height: 44px;

    font-size: 18px;

    background-color: rgba(255, 255, 255, 0.5);

    color: #fff;

    border: none;

    border-radius: 30px;

    margin: 0 auto;

    cursor: pointer;

    background-color: #facf33;

}



.form-click:hover {

    background-color: #facf33;

}



.form-list:focus {

    border: 1px solid #fff;

}



.form-matter h6 textarea:focus {

    border: 1px solid #fff;

}



/* --------------------------------------------------------------------------- */



/* --------------------------------------------------------------------------- */



/* -------------------------PC端--------------------------- */



@media all and (max-width:1380px) {}



@media all and (max-width:1280px) {

    .patent {

        width: 94%;

        margin-left: 3%;

    }

    .apply {

        width: 94%;

        margin-left: 3%;

    }

    .server {

        width: 94%;

        margin-left: 3%;

    }

    .flow {

        width: 94%;

        margin-left: 3%;

    }

    .ccic {

        width: 94%;

        margin-left: 3%;

    }

    .form {

        width: 94%;

        margin-left: 3%;

    }

}





.apply-HH{

    display: none;

}

/* ------------------------手机端-------------------------- */



@media all and (max-width:900px) {

    .patent-matter ul li {

        width: 100%;

    }

    .patent-matter ul li:nth-child(2) p {

        font-size: 12px;

        line-height: 22px;

        width: 100%;

        margin-left: 0%;

        margin-top: 0%;

    }

    .patent-matter ul li:nth-child(2) {

        margin-top: 12%;

    }

    .patent-box {

        padding-bottom: 24px;

    }

    .apply-matter ul li {

        width: 49%;

        height: 290px;

        margin-top: 8PX;

    }

    .apply-icon {

        width: 66px;

        height: 66px;

        margin-top: 14px;

    }

    .apply-matter ul li h3 {

        font-size: 14px;

        margin-top: 16px;

    }

    .apply-line {

        margin: 10px 0 10px 0;

    }

    .apply-matter ul {

        margin-left: -1%;

    }

    .apply-matter ul li p {

        font-size: 12px;

        line-height: 20px;

        -webkit-line-clamp: 6;

    }

    .server-matter ul li {

        float: left;

        width: 100%;

        margin-left: 0%;

        height: 344px;

    }

    .server-matter ul li h3 {

        font-size: 18px;

    }

    .server-box {

        padding-bottom: 24px;

    }

    .flow-line {

        display: none;

    }

    .flow-nav {

        height: auto;

    }

    .flow-nav p {

        font-size: 13px;

        margin-top: 8px;

    }

    .flow-nav>div {

        position: static;

        float: left;

        width: 33.333333333333%;

        text-align: center;

        margin-top: 8px;

    }

    .flow-nav h4 {

        margin: 0 auto;

    }

    .flow-nav p {

        margin-left: 0;

    }

    .flow-matter ul li img {

        display: none;

    }

    .flow-matter ul {

        margin-left: 0%;

    }

    .flow-matter ul li {

        width: 100%;

        margin-left: 0%;

    }

    .flow-notice h4 {

        width: 300px;

        height: 44px;

        line-height: 44px;

        font-size: 12px;

    }

    .flow-notice {

        margin-top: 30px;

    }

    .ccic-matter ul li:nth-child(1) {

        width: 100%;

        height: auto;

    }

    .ccic-matter ul li:nth-child(2) {

        width: 100%;

        height: auto;

        overflow: hidden;

    }

    .ccic-matter ul li:nth-child(2) h4 {

        width: 31%;

        height: auto;

        margin-left: 2%;

        margin-top: 22px;

    }

    .form-matter {

        width: 100%;

        margin: 0 auto;

    }

    .form-matter h6 {

        margin-bottom: 0px;

    }

    .form-matter h6:nth-child(1) p {

        width: 98.7%;

        height: auto;

        line-height: 24px;

    }

    .apply-HH{

        display: block;

    }

    .form-matter h6 p label {

        margin-left: 5%;

    }

    .form-list {

        width: 98.7%;

        margin-top: 10px;

    }

    .form-matter h6 textarea {

        margin-top: 10px;

    }

    .form-matter h4 {

        margin-top: 16px;

    }

    .patent-matter ul li:nth-child(1) h4 {

        height: 130px;

    }

    .patent-matter ul li:nth-child(1) h5 {

        height: 134px;

    }

    .form-box {

        height: auto;

        padding-bottom: 40px;

        background-repeat: repeat;

    }

}