/* ==================== tags ==================== */

* {

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

}



html,

body {

    width: 100%;

    height: 100%;

    background-color: transparent;

}



h1,

h2,

h3,

h4,

h5,

h6 {

    font-weight: normal;

    line-height: 1.6;

}



h1 {

    font-size: 48px;

}



h2 {

    font-size: 40px;

}



h3 {

    font-size: 24px;

}

h4 {

    font-size: 20px;

}

p {

    font-size: 16px;

    line-height: 1.75;

}

.fl {

    float: left;

}

.fr {

    float: right;

}

.pc {

    display: block;

}

.mobile {

    display: none;

}

.container {

    width: 100%;

    max-width: 1220px;

    margin: 0 auto;

    overflow: hidden;

}

.txt1 {

    color: #333;

    font-size: 24px;

    line-height: 35px;

    text-align: center;

}

/* banner */

#banner {

    position: relative;

    background: url("../image/bannerbg.png") no-repeat center center;

    height: 500px;

    background-size: cover;

    overflow: hidden;

}

#banner h1 {

    color: #fff;

    padding-left: 55px;

    padding-top: 140px;

}

#banner h1 span {

    color: #32f5ff;

}

#banner .b_group {

    margin-left: 15px;

}

.btn {

    position: relative;

    width: 242px;

    height: 40px;

    border: 1px solid #fff;

    background: none;

    cursor: pointer;

    margin-top: 50px;

}

.btn p {

    position: relative;

    color: #fff;

    font-size: 18px;

    line-height: 40px;

    outline: none;

}

.btn:hover {

    background: linear-gradient(to right, #ffb252 0%, #f18541 100%);

}

.btn:hover p {

    color: #fff;

}

#banner .b_group .btn {
    margin-left: 40px;
    height: 40px;
    background: linear-gradient(-90deg, #3059F9 0%, #59A3F6 100%);
    border-radius: 6px;
    font-size: 16px;
    color: #fff;
    text-align: center;
    line-height: 40px;
    margin-top: 0.35rem;
    border: none;

}

.titlss {

    float: right;

    width: 380px;

    height: 350px;

    background: #fff;

    box-shadow: 0 0 20px 2px rgba(153, 153, 153, .5);

    margin-top: 80px;

    margin-right: 50px;

    opacity: .95;

}

.titlss .tith3 {

    font-size: 24px !important;

    color: #000;

    font-weight: bold;

    padding-top: 33px;

    /*padding-left: 40px;*/

    text-align: center !important;

}

#titlsses {

    margin-left: 40px;

    padding-bottom: 30px;

}



#titlsses .outline {

    position: relative;

    width: 300px;

    height: 40px;

    line-height: 40px;



}

.titlss .inputTitle {

    position: absolute;

    top: 16px;

    left: 10px;

    z-index: -1;

    -webkit-transition: 0.5s;

    transition: 0.5s;

    color: #333;

}

.titlss input {

    display: block;

    width: 100%;

    padding: 24px 0 4px 18px;

    background-color: transparent;

    border: none;

    border-bottom: 1px solid #d6d6d6;

    font-size: 18px;

    font-family: Arial, "微软雅黑";

}

.titlss #submit_a {

    font-size: 16px;
    margin: 0 auto;
    display: block;
    margin-top: 15px;
    background: linear-gradient(to right, #ffb252 0%, #f18541 100%);
    width: 100%;
    padding: 7px 30px;
    margin-top: 10px;
    color: #fff;
    width: 80%;
    border-radius: 6px;

}

.titlss #submit_a:hover {
    color: #fff;
    background: linear-gradient(to right, #ffb252 0%, #f18541 100%);

}





.inputTitle {

    margin-bottom: 4px;

    font-size: 20px;

}



.inputTitle .requiredHint {

    margin-right: 4px;

    color: #fe5757;

}



.inputTitle .fillHint {

    color: #888;

    font-size: 14px;

}



.inputTitle .fa {

    display: none;

    margin-left: 4px;

    color: #ffa800;

    font-size: 14px;

}



.titlss.noInput .inputTitle .fa {

    display: inline-block;

}



.consult-cont {

    margin-top: 30px;

}



.consult-cont #contact-query {

    display: block;

    width: 100%;

    padding: 10px;

    border: 1px solid #d6d6d6;

    font-size: 16px;

    font-family: Arial, "微软雅黑";

    line-height: 27px;

}



.consult-cont .wordNum {

    font-size: 14px;

    margin: 0 0 0 10px;

}



.titlss .outline {

    position: relative;

    margin-bottom: 10px;

}







.titlss .inputTitle.focus {

    top: 0;

    font-size: 16px;

    color: #3798e4;

}



.titlss .inputTitle.focus .requiredHint {

    color: #3798e4;

}





.titlss input:focus {

    outline: none;

}



.titlss input.noInput+.inputTitle .fa {

    display: inline-block;

}



#sect1 {

    position: relative;

    background: url("../image/sect1bg1.png") no-repeat center center;

    height: 643px;

    background-size: cover;

    overflow: hidden;

    text-align: center;

    margin: 0 auto;

}

#sect1 h2 {

    padding: 80px 0 45px;

    color: #333;

}

#sect1 ul {

    margin: 0 auto;

    overflow: hidden;

    width: 1220px;

}

#sect1 ul li {

    float: left;

    width: 293px;

    height: 400px;

    margin-right: 13px;

    transition: all .6s ease-out;

    background: url("../image/sect1-1h.png") no-repeat;

}

#sect1 ul li:nth-of-type(2) {

    background: url("../image/sect1-2h.png") no-repeat;

}

#sect1 ul li:nth-of-type(3) {

    background: url("../image/sect1-3h.png") no-repeat;

}

#sect1 ul li h3 {

    color: #32f5ff;

    font-size: 24px;

    text-align: left;

    padding-left: 22px;

    padding-top: 28px;

}

.t_1 {

    color: #fff;

    text-align: left;

    padding-left: 22px;

}

.t_2 {

    display: none;

}

#sect1 li a .btn {

    display: none;

}

#sect1 ul .on {

    width: 594px;

    height: 400px;

}

#sect1 ul .on h3 {

    padding-left: 260px;

    transition: all .6s ease-out;

}

#sect1 ul .on .t_1 {

    transition: all .6s ease-out;

    padding-left: 260px;

}

#sect1 ul .on .t_2 {

    display: block;

    width: 289px;

    color: #fff;

    text-align: left;

    margin-top: 60px;

    margin-left: 260px;

}

#sect1 .on .btn {
    display: block;
    border: none;
    margin-left: 320px;
    height: 40px;
    background: linear-gradient(-90deg, #3059F9 0%, #59A3F6 100%);
    border-radius: 6px;
    font-size: 16px;
    color: #fff;
    text-align: center;
    line-height: 40px;


}

#sect1 .on .btn:hover {
    background: linear-gradient(90deg, #FFB351 0%, #F08541 100%);
}

#sect1 .on .btn p {
    font-size: 16px;
    color: #fff;

}



#sect2 {

    position: relative;

    margin: 0 auto;

    height: 1192px;

    overflow: hidden;

    background: #1d3d5b;

}

.c_tit {

    position: absolute;

    left: 50%;

    z-index: 10;

    top: 70px;

    margin-left: -610px;

    color: #32f5ff;

}

.c_tit h2 {

    font-size: 40px;

    color: #32f5ff;

}

.c_tit .c_txt {

    font-size: 24px;

    padding-bottom: 40px;

}

.L_cross {

    width: 1220px;

    height: 1px;

    margin: 0 auto;

    border: none;

    border-bottom: 1px solid #fff;

}

.L_vertical {

    position: absolute;

    width: 1px;

    height: 854px;

    border: none;

    border-right: 1px solid #fff;

    left: 50%;

    margin-left: -438px;

    top: 256px;

    z-index: 50;

}

.tab_tit {

    position: absolute;

    width: 172px;

    height: 900px;

    left: 50%;

    margin-left: -610px;

    top: 218px;

    z-index: 30;

}

.tab_tit li {

    margin-top: 40px;

    transition: all .5s;

    -webkit-transition: all .5s;

}

.tab_tit li p {

    color: #fff;

    /*padding-left: 15px;*/

    font-size: 16px;

    cursor: pointer;

}



.tab_tit .selected p:before {

    content: "";

    position: absolute;

    width: 0;

    height: 0;

    border-width: 8px;

    border-style: solid;

    border-color: transparent transparent transparent #32f5ff;

    margin-left: -15px;

    margin-top: 6px;

}

.tab_tit .selected p {

    color: #32f5ff;

    cursor: pointer;

}

.tab_img {

    margin: 0 auto;

    overflow: hidden;

}

.tab1 {

    background: url("../image/sect2bg1.png") no-repeat center top;

    height: 1192px;

    background-size: cover;

    overflow: hidden;

    position: relative;

    /*transition: all .5s linear;*/

    /*-webkit-transition:all .5s;*/

}

.tab2 {

    background: url("../image/sect2bg3.jpg") no-repeat center top;

    height: 1192px;

    background-size: cover;

    overflow: hidden;

    position: relative;

    /*transition: all .5s;*/

    /*-webkit-transition:all .5s ;*/

}

.tab3 {

    background: url("../image/sect2bg2.jpg") no-repeat center top;

    height: 1192px;

    background-size: cover;

    overflow: hidden;

    position: relative;

    /*transition: all .5s;*/

    /*-webkit-transition:all .5s;*/

}

.tab_img li {

    text-align: center;

}

.tab_img li .L_box {

    position: relative;

    width: 1030px;

    height: 852px;

    margin: 0 auto;

    margin-top: 262px;

    left: 120px;

}

.L_box h3 {

    position: relative;

    font-size: 30px;

    color: #fff;

    padding-left: 200px;

    padding-bottom: 20px;

}

.tab1 .L_box h3:before {

    position: absolute;

    content: url("../image/sect2L1.png");

    top: 3px;

    margin-left: -205px;

}

.tab2 .L_box h3:before {

    position: absolute;

    content: url("../image/sect2L2.png");

    top: 3px;

    margin-left: -165px;

}

.L_box .b_group {

    width: 220px;

    overflow: hidden;

    margin-right: 20px;

}

.L_box .btn {
    width: 220px;
    margin-top: 10px;
    display: block;
    border: none;
    height: 40px;
    background: linear-gradient(-90deg, #3059F9 0%, #59A3F6 100%);
    border-radius: 6px;
    font-size: 16px;
    color: #fff;
    text-align: center;
    line-height: 40px;

}

.L_box .top1 {

    margin-top: 28px;

}

.L_box .btn p {

    color: #fff;

}

.L_box .btn:hover {

    background: linear-gradient(90deg, #FFB351 0%, #F08541 100%);

}

.img2 {

    margin-top: 25px;

    margin-bottom: 45px;

}

.L_box .L_cross {

    width: 1005px;

    margin-left: 2px;

    margin-bottom: 25px;

}

.L_box h4 {

    text-align: left;

    color: #fff;

}

.L_box ul {

    margin: 0 auto;

    margin-left: 15px;

    overflow: hidden;

}

.L_box ul li {

    margin-top: 10px;

}

.L_box ul li p {

    color: #fff;

    text-align: left;

    cursor: pointer;

}

.L_box ul li:hover p {

    color: #32f5ff;

}

.L_box ul li p:before {

    content: "";

    position: absolute;

    width: 0;

    height: 0;

    border-width: 8px;

    border-style: solid;

    border-color: transparent transparent transparent #fff;

    margin-left: -15px;

    margin-top: 6px;

}

.L_box ul li:hover p:before {

    border-color: transparent transparent transparent #32f5ff;

}

.tab2 .fl h3 {

    padding-left: 100px;

}

.tab3 .fl h3 {

    margin: 0 auto;

    text-align: center;

    padding-left: 0;

}

.hide {

    display: none;

}

#sect3 {

    background: #eeeeee;

    overflow: hidden;

    margin: 0 auto;

}

#sect3 h2 {

    display: block;

    position: relative;

    height: 47px;

    margin: 75px 0 20px;

    text-align: center;

}

#sect3 h2 span {

    color: #000;

    font-size: 36px;

    font-weight: bold;

    padding-left: 260px;

}

#sect3 h2 span:before {

    position: absolute;

    content: url("../image/TV11.png");

    left: 250px;

}

#sect3 ul {

    margin: 0 auto;

    margin-top: 65px;

    margin-bottom: 80px;

    overflow: hidden;

}

#sect3 ul li {

    float: left;

    width: 286px;

    height: 345px;

    background: #fff;

    box-shadow: 7px 18px 18px rgba(0, 0, 0, .1);

    margin-right: 18px;

}

#sect3 ul li:last-child {

    margin-right: 0;

}

.lix_box {

    width: 100%;

    overflow: hidden;

    margin-top: 28px;

}

.lix_box .btn {

    border: none;

    width: 129px;

    height: 40px;

    color: #fff;

    border-radius: 20px;

    background: #2298fd;

    margin-left: 22px;

    margin-top: 0;

    font-size: 18px;

}

.lix_box img {

    margin-top: 10px;

    margin-right: 22px;

}

#sect4 {

    background: #0c1d29;

    overflow: hidden;

    text-align: center;

}

#sect4 .lim {

    font-size: 48px;

    color: #fff;

    font-weight: bold;

    padding: 80px 0 30px;

}

.lim br {

    display: none;

}

#sect4 ul {

    width: 856px;

    margin: 0 auto;

    margin-bottom: 70px;

    overflow: hidden;

}

#sect4 ul li {

    float: left;

    width: 153px;

    height: 59px;

    margin: 6px 8px;

}





@media (max-width:768px) {

    .pc {

        display: none;

    }

    .mobile {

        display: block;

    }

    h1 {

        font-size: 36px;

    }



    h2 {

        font-size: 28px;

    }



    h3 {

        font-size: 22px;

    }

    h4 {

        font-size: 18px;

    }

    p {

        font-size: 16px;

        line-height: 1.75;

    }

    .txt1 {

        padding: 0 5%;

        font-size: 20px;

        text-align: justify;

    }





    #banner .fl {

        float: none;

        margin: 0 auto;

    }

    #banner h1 {

        padding: 0 8%;

        padding-top: 20%;

    }

    #banner .b_group {

        margin: 0 auto;

    }

    #sect1 {

        background: #81eef9;

        height: auto;

    }

    #sect1 ul {

        width: 100%;

        margin: 0 auto;

    }

    #sect1 ul li {

        text-align: center;

        margin: 0 auto;

        margin-bottom: 5%;

        float: none;

    }

    #sect3 h2 {

        display: none;

    }

    #sect3 .l_t {

        margin: 20px auto 10px;

    }

    .k0 {

        font-size: 18px;

        text-align: center;

        color: #5e5d5d;

    }

    #sect3 ul {

        margin: 0 auto;

        margin-top: 15px;

        margin-bottom: 20px;

        overflow: hidden;

    }



    #sect3 ul li {

        float: none;

        width: 286px !important;

        height: 345px;

        background: #fff;

        box-shadow: 7px 18px 18px rgba(0, 0, 0, .1);

        margin: 0 auto;

        margin-bottom: 30px;

    }

    #sect3 ul li:last-child {

        margin: 0 auto;

    }



    .j0 {

        margin: 15px auto 40px;

    }

    #sect4 .lim {

        font-size: 24px;

        padding: 30px 0 20px;

    }

    .lim br {

        display: block;

    }

    #sect4 ul {

        width: 100%;

        margin: 0 auto;

        margin-bottom: 70px;

        overflow: hidden;

    }

    #sect4 ul li {

        width: 32%;

        margin: 6px 2px;

    }

}