@charset "UTF-8";

/* ==================== 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;

}

a,
a:link,
a:visited,
a:hover {

    text-decoration: none !important;

    color: inherit;

}



.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("/project/sQMS/images/bannerbg.jpg") no-repeat center center;

    height: 500px;

    background-size: cover;

    overflow: hidden;

}

#banner h1 {

    font-size: 60px;

    padding-top: 125px;

    line-height: 1.5;

    color: #fff;

}

#banner h1 span {

    font-weight: bold;

    color: #44f792;

}

.btn {

    position: relative;

    width: 220px;

    height: 50px;

    background: none;

    border: 1px solid #fff;

    cursor: pointer;

    margin-top: 62px;

}

.btn p {

    display: block;

    position: relative;

    color: #fff;

    font-size: 18px;

    line-height: 48px;

    outline: none;

}



/*.btn:hover{*/

/*    border: none;*/

/*    background: #0090ff;*/

/*}*/







.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: 10px;

    /*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 {
    width: 300px;
    color: #fff;
    font-size: 16px;
    padding: 9px 48px;
    margin: 0 auto;
    display: block;
    background: linear-gradient(to right, #ffb252 0%, #f18541 100%);
    border: none;
    border-radius: 6px;

}

.titlss #submit_a:hover {


    color: #fff;

}





.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("/project/sQMS/images/sect1bg.png") no-repeat center center;

    height: 962px;

    background-size: cover;

    overflow: hidden;

    margin: 0 auto;

    text-align: center;

}

#sect1 h2,
#sect2 h2,
#sect4 h2,
#sect6 h2 {

    padding: 75px 0 30px;

    color: #074a68;

}

.btn {

    width: 360px;
    border: none;
    cursor: pointer;
    margin-top: 45px;
    height: 40px;
    background: linear-gradient(-90deg, #3059F9 0%, #59A3F6 100%);
    border-radius: 6px;
    font-size: 16px;
    color: #fff;
    text-align: center;
    line-height: 40px;

}

.btn:hover {

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

.btn p {

    display: block;

    position: relative;

    color: #fff;

    font-size: 18px;

    line-height: 1.8;

    outline: none;

}

#sect2 {

    margin: 0 auto;

    overflow: hidden;

    text-align: center;

}

#sect2 h2,
#sect4 h2 {

    color: #074a68;

}

#sect2 h2 span,
#sect4 h2 span {

    color: #008196;

}

#sect2 .btn {

    margin-bottom: 65px;

}

#sect3 {

    position: relative;

    background: url("/project/sQMS/images/sect3bg.png") no-repeat center center;

    height: 962px;

    background-size: cover;

    overflow: hidden;

    margin: 0 auto;

}

#sect3 h2 {

    text-align: left;

    padding-left: 68px;

    padding-top: 250px;

    color: #000;

}



.img1 {

    margin-right: 60px;

    margin-top: 110px;

}

#sect3 ul {

    margin: 0 auto;

    padding: 62px 68px 80px;

    overflow: hidden;

    width: 100%;

}

#sect3 ul li {

    position: relative;

    float: left;

    margin-right: 83px;

    overflow: hidden;

    cursor: pointer;

}

#sect3 ul li:last-child {

    margin-right: 0;

}

#sect3 ul li .fadeon {

    width: 299px;

    height: 304px;

    text-align: center;

}

#sect3 ul li:first-child .fadeon {

    background: url("/project/sQMS/images/s3-1.png");

}

#sect3 ul li:nth-child(2) .fadeon {

    background: url("/project/sQMS/images/s3-2.png");

}

#sect3 ul li:last-child .fadeon {

    background: url("/project/sQMS/images/s3-3.png");

}

#sect3 ul li .fadeon img {

    margin-bottom: 32px;

    margin-top: 25px;

    animation: dou 1.5s ease-out 0s infinite normal none running;

}

@keyframes dou {

    0% {

        transform: translate(0, 0);

    }

    50% {

        transform: translate(0, -5px);

    }

    100% {

        transform: translate(0, 0);

    }



}

#sect3 ul li .fadeon h3 {

    color: #fff;

}

#sect3 ul li .fadein {

    position: absolute;

    text-align: justify;

    width: 299px;

    height: 304px;

    top: -130%;

}

#sect3 ul li:first-child .fadein {

    background: url("/project/sQMS/images/s3-1-1.png");

}

#sect3 ul li:nth-child(2) .fadein {

    background: url("/project/sQMS/images/s3-2-2.png");

}

#sect3 ul li:last-child .fadein {

    background: url("/project/sQMS/images/s3-3-3.png");

}

#sect3 ul li .fadein p {

    color: #fff;

    padding-top: 110px;

    font-size: 14px;

    text-align: justify;

}

#sect3 ul li:first-child .fadein p {

    padding-left: 14px;

}

#sect3 ul li:nth-child(2) .fadein p {

    padding-left: 36px;

}

#sect3 ul li:last-child .fadein p {

    text-align: center;

}

#sect4 {

    position: relative;

    background: url("/project/sQMS/images/sect4bg.png") no-repeat center center;

    height: 1039px;

    background-size: cover;

    overflow: hidden;

    margin: 0 auto;

    text-align: center;

}



#sect5 {

    background: #edfcff;

    margin: 0 auto;

    text-align: center;

    overflow: hidden;

}

#sect5 h2 {

    text-align: left;

    padding-left: 55px;

    padding-top: 135px;

    color: #074a68;

}

.img2 {

    margin-right: 60px;

    margin-top: 90px;

}

.img3 {

    margin-bottom: 75px;

}

#sect6 {

    margin: 0 auto;

    overflow: hidden;

    text-align: center;

}

#sect6 .imgbox {

    margin: 0 auto;

    height: 416px;

    margin-bottom: 40px;

    overflow: hidden;

}

#sect6 .imgbox li {

    overflow: hidden;

    width: 806px;

    height: 416px;

    margin: 0 auto;

}

#sect6 .box_tit {

    width: 100%;

    margin: 0 auto;

    margin-bottom: 80px;

    overflow: hidden;

}

#sect6 .box_tit li {

    position: relative;

    float: left;

    width: 300px;

    cursor: pointer;

}

#sect6 .box_tit li .fadeon {

    width: 300px;

    height: 157px;

    background: #48b4c6;

}

#sect6 .box_tit li img {

    margin-bottom: 30px;

    margin-top: 20px;

    animation: dou 1.5s ease-out 0s infinite normal none running;

}

#sect6 .box_tit li .fadeon h4 {

    color: #fff;

}



#sect6 .box_tit li:nth-child(even) .fadeon,

#sect6 .box_tit li:nth-child(even) .fadein {

    background: #52c0d2;

}

#sect6 .box_tit li .fadein {

    position: absolute;

    width: 300px;

    height: 157px;

    top: 130%;

    background: #48b4c6;

}

#sect6 .box_tit li .fadein h4 {

    color: #fff;

    padding-top: 20px;

    padding-bottom: 10px;

}

#sect6 .box_tit li .fadein p {

    margin: 0 auto;

    color: #fff;

    text-align: justify;

    padding-left: 80px;

}



.in .fadeout {

    top: 0;

}

#mores {

    width: 100%;

    margin: 0 auto;

    position: relative;

    text-align: center;

    overflow: hidden;

}

#mores h2 {

    padding: 0 0 30px;

    color: #000;

}

#mores ul {

    width: 100%;

    overflow: hidden;

    position: relative;

    margin-bottom: 50px;

}

#mores ul li {

    float: left;

    width: 270px;

    height: 180px;

    margin-right: 40px;

    position: relative;

}

#mores ul li:last-child {

    margin-right: 0;

}

#mores ul li .txt3 {

    position: absolute;

    display: inline-block;

    width: 270px;

    height: 40px;

    line-height: 40px;

    color: #fff;

    background: #222;

    opacity: .85;

    bottom: 0;

    left: 0;

}

@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;

    }



}