ul,ol{margin: 0;padding:0}
li{list-style: none;}
.qualityControl {
    overflow: hidden
}

.qualityControl .scrollIn {
    transition: transform 1s ease-in-out
}

.qualityControl .animateLeft {
    opacity: 0;
    transform: translate(-100vw)
}

.qualityControl .animateRight {
    opacity: 0;
    transform: translate(100vw)
}

.qualityControl .animateLeft.scrollActive,.qualityControl .animateRight.scrollActive {
    opacity: 1;
    transform: translate(0)
}

.qualityControl .animateUp {
    opacity: 0;
    transform: translateY(100vh)
}

.qualityControl .animateDown {
    opacity: 0;
    transform: translateY(-100vh)
}

.qualityControl .animateDown.scrollActive,.qualityControl .animateUp.scrollActive {
    opacity: 1;
    transform: translateY(0)
}

.qualityControl .delay0-3.scrollActive {
    transition-delay: .3s
}

.qualityControl .delay0-5.scrollActive {
    transition-delay: .5s
}

.qualityControl .delay0-8.scrollActive {
    transition-delay: .8s
}

.qualityControl .delay1.scrollActive {
    transition-delay: 1s
}

.qc_banner {
    color: #fff;
    padding: 120px 0 320px
}

.qc_banner h3 {
    font-size: 74px;
    line-height: 87px
}

.qc_banner p {
    font-size: 20px;
    line-height: 40px;
    margin-top: 30px
}

.qc_supplier {
    position: relative;
    z-index: 2
}

.qc_supplier>img {
    height: 100%;
    position: absolute;
    right: 0;
    top: 0
}

.qc_supplier:before {
    background-color: #f8f8f9;
    left: 0
}

.qc_supplier:after,.qc_supplier:before {
    content: "";
    height: 100%;
    position: absolute;
    top: 0;
    width: 50%;
    z-index: -1
}

.qc_supplier:after {
    background-color: #fff;
    right: 0
}

.qc_supMain {
    background-color: #fff;
    display: flex
}

.qc_supMain .qc_supMainLeft {
    flex: 0 0 338px;
    margin-right: 30px;
    position: relative
}

.qc_supMain .qc_supMainLeft .qc_supMLtitle {
    background-color: #00a3e4;
    color: #fff;
    font-size: 24px;
    left: 0;
    line-height: 36px;
    padding: 86px 0;
    position: absolute;
    text-align: center;
    top: -244px;
    width: 100%
}

.qc_supMain .qc_supMainLeft li>div {
    align-items: center;
    background-color: #eef0f2;
    border-bottom: 1px solid #fff;
    color: #576778;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    font-size: 18px;
    font-weight: 700;
    height: 244px;
    justify-content: center;
    text-align: center
}

.qc_supMain .qc_supMainLeft li img {
    display: block;
    margin: 0 auto 14px
}

.qc_supMain .qc_supMainLeft li .qc_supIconActive {
    display: none
}

.qc_supMain .qc_supMainLeft li.active {
    color: #00a3e4
}

.qc_supMain .qc_supMainLeft li.active>div {
    background-color: #fff
}

.qc_supMain .qc_supMainLeft li.active>div div {
    color: #00a3e4
}

.qc_supMain .qc_supMainLeft li.active .qc_supIcon {
    display: none
}

.qc_supMain .qc_supMainLeft li.active .qc_supIconActive {
    display: block
}

.qc_supMain .qc_supMainLeft li:first-of-type.scrollActive {
    transition-delay: .3s
}

.qc_supMain .qc_supMainLeft li:nth-of-type(2).scrollActive {
    transition-delay: .5s
}

.qc_supMain .qc_supMainLeft li:nth-of-type(3).scrollActive {
    transition-delay: .8s
}

.qc_supMain .qc_supMainRight {
    flex: 1;
    padding-left: 70px;
    padding-top: 80px
}
.qc_supMain .qc_supMainRight > div{display: none;}
.qc_supMain .qc_supMainRight > div.active{display: block;}
.qc_supMain .qc_supMainRight .qc_supMRtitle {
    font-size: 30px;
    font-weight: 700;
    margin-bottom: 54px
}

.qc_supMain .qc_supMainRight ul.showDot {
    list-style: disc;
    padding-left: 20px
}

.qc_supMain .qc_supMainRight ul.showDot li {
    position: relative
}

.qc_supMain .qc_supMainRight ul.showDot li:before {
    content: "";
    display: block
}

.qc_supMain .qc_supMainRight li {
    margin-bottom: 36px
}

.qc_supMain .qc_supMainRight li h3 {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 10px
}

.qc_supMain .qc_supMainRight li div {
    line-height: 24px
}

.qc_laboratory {
    padding: 56px 0
}

.qc_laboratory .container {
    border: 1px solid #617283;
    padding: 40px;
    position: relative
}

.qc_laboratory .container>h3 {
    font-size: 38px;
    margin-bottom: 56px;
    padding-left: 15%
}

.qc_laboratory .container>img {
    bottom: 10px;
    position: absolute;
    right: 10px
}

.qc_laboratory .qc_laboMain {
    display: flex
}

.qc_laboratory .qc_laboMain .qc_laboImg {
    flex: 0 0 826px;
    margin-right: 70px;
    overflow: hidden
}

.qc_laboratory .qc_laboMain .qc_laboCont {
    flex: 1;
    max-width: 400px;
    overflow: hidden;
    position: relative
}

.qc_laboratory .qc_laboImg {
    position: relative
}

.qc_laboratory .qc_laboImg .swiper-slide img {
    height: 460px;
    -o-object-fit: cover;
    object-fit: cover;
    width: 826px
}

.qc_laboratory .qc_laboImg .swiperBtn {
    bottom: 30px;
    display: flex;
    position: absolute;
    right: 20px;
    z-index: 2
}

.qc_laboratory .qc_laboImg .swiperBtn span {
    border: 1px solid #fff;
    border-radius: 50%;
    cursor: pointer;
    display: block;
    height: 40px;
    margin: 0 5px;
    position: relative;
    width: 40px
}

.qc_laboratory .qc_laboImg .swiperBtn span:after {
    border-bottom: 2px solid #fff;
    content: "";
    display: block;
    height: 12px;
    position: absolute;
    top: 50%;
    width: 12px
}

.qc_laboratory .qc_laboImg .swiperBtn span:first-of-type:after {
    border-left: 2px solid #fff;
    left: 15px;
    transform: translateY(-50%) rotate(45deg)
}

.qc_laboratory .qc_laboImg .swiperBtn span:nth-of-type(2):after {
    border-right: 2px solid #fff;
    right: 15px;
    transform: translateY(-50%) rotate(-45deg)
}

.qc_laboratory .qc_laboImg .swiperBtn span:hover {
    background-color: #00a3e4;
    border-color: #00a3e4
}

.qc_laboratory .laboText h3 {
    font-size: 20px;
    font-weight: 400;
    margin-bottom: 30px
}

.qc_laboratory .laboText p {
    font-size: 16px;
    line-height: 30px
}

.qc_inspection {
    padding: 64px 0 86px
}

.qc_inspection .container>h3 {
    font-size: 38px;
    margin-bottom: 50px;
    text-align: center
}

.qc_inspection .qc_inspMain {
    background-color: #fff;
    display: flex;
    overflow: hidden;
    padding: 50px
}

.qc_inspection .qc_inspMain .qc_inspMNav {
    flex: 0 0 500px
}

.qc_inspection .qc_inspMain .qc_inspMNav li {
    font-size: 16px;
    line-height: 20px;
    margin-bottom: 20px;
    position: relative
}

.qc_inspection .qc_inspMain .qc_inspMNav li span {
    cursor: pointer
}

.qc_inspection .qc_inspMain .qc_inspMNav li:before {
    background-color: transparent;
    content: "";
    display: block;
    height: 14px;
    left: -14px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 4px
}

.qc_inspection .qc_inspMain .qc_inspMNav li.active {
    color: #00a3e4
}

.qc_inspection .qc_inspMain .qc_inspMNav li.active:before {
    background-color: #00a3e4
}

.qc_inspection .qc_inspMain .qc_inspMCon {
    flex: 1;
    overflow: hidden
}

.qc_inspection .qc_inspMain .qc_inspMCon .qc_inspImgBanner {
    position: relative
}

.qc_inspection .qc_inspMain .qc_inspMCon .qc_inspImgBanner .inspSwiperImg .swiper-slide {
    align-items: center;
    cursor: pointer;
    display: flex;
    justify-content: center
}

.qc_inspection .qc_inspMain .qc_inspMCon .qc_inspImgBanner .inspSwiperModal {
    background-color: rgba(120,120,120,.1);
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 4
}

.qc_inspection .qc_inspMain .qc_inspMCon .qc_inspImgBanner:hover .inspSwiperModal {
    display: none
}

.qc_inspection .qc_inspMain .qc_inspMCon .qc_inspImgBanner .swiperBtn {
    bottom: 10px;
    display: flex;
    position: absolute;
    right: 10px;
    z-index: 5
}

.qc_inspection .qc_inspMain .qc_inspMCon .qc_inspImgBanner .swiperBtn span {
    border: 1px solid #fff;
    border-radius: 50%;
    box-shadow: 0 0 5px rgba(135,135,135,.5);
    cursor: pointer;
    display: block;
    height: 40px;
    margin: 0 5px;
    position: relative;
    width: 40px
}

.qc_inspection .qc_inspMain .qc_inspMCon .qc_inspImgBanner .swiperBtn span:after {
    border-bottom: 2px solid #fff;
    content: "";
    display: block;
    height: 12px;
    position: absolute;
    top: 50%;
    width: 12px
}

.qc_inspection .qc_inspMain .qc_inspMCon .qc_inspImgBanner .swiperBtn span:first-of-type:after {
    border-left: 2px solid #fff;
    left: 15px;
    transform: translateY(-50%) rotate(45deg)
}

.qc_inspection .qc_inspMain .qc_inspMCon .qc_inspImgBanner .swiperBtn span:nth-of-type(2):after {
    border-right: 2px solid #fff;
    right: 15px;
    transform: translateY(-50%) rotate(-45deg)
}

.qc_inspection .qc_inspMain .qc_inspMCon .qc_inspImgBanner .swiperBtn span:hover {
    background-color: #00a3e4;
    border-color: #00a3e4
}

.qc_inspection .qc_inspMain .qc_inspMCon>img {
    height: 326px;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.qc_inspection .qc_inspMain .qc_inspMCon>h3 {
    font-size: 20px;
    margin-bottom: 20px;
    margin-top: 38px
}

.qc_inspection .qc_inspMain .qc_inspMCon>p {
    color: #575757;
    font-size: 16px;
    line-height: 24px;
    min-height: 72px
}

.qc_quality {
    background-color: #f6f6f6;
    padding-bottom: 50px;
    padding-top: 110px;
    position: relative;
    z-index: 2
}

.qc_quality>img {
    display: block;
    height: 416px;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1
}

.qc_quality>h3 {
    color: #fff;
    font-size: 38px;
    margin-bottom: 50px;
    text-align: center
}

.qc_quality ul {
    background-color: #fff;
    display: flex
}

.qc_quality li {
    flex: 1;
    min-height: 480px;
    position: relative
}

.qc_quality li>div {
    padding: 58px 50px
}

.qc_quality li.active,.qc_quality li:hover {
    background-color: #00a3e4;
    color: #fff
}

.qc_quality li.active .qc_qualityIconImg,.qc_quality li:hover .qc_qualityIconImg {
    display: none
}

.qc_quality li.active .qc_qualityActiveIconImg,.qc_quality li:hover .qc_qualityActiveIconImg {
    display: block
}

.qc_quality li:first-of-type>div.scrollActive {
    transition-delay: .3s
}

.qc_quality li:nth-of-type(2)>div.scrollActive {
    transition-delay: .5s
}

.qc_quality li:nth-of-type(3)>div.scrollActive {
    transition-delay: .8s
}

.qc_quality li:nth-of-type(4)>div.scrollActive {
    transition-delay: 1.2s
}

.qc_quality .qc_qualityIcon .qc_qualityActiveIconImg {
    display: none
}

.qc_quality .qc_qualityIndex {
    color: #fff;
    font-size: 38px;
    font-weight: 700;
    position: absolute;
    right: 24px;
    top: 36px;
    z-index: 3
}

.qc_quality .qc_qualityIndex span {
    background-color: #fff;
    border-radius: 50%;
    display: block;
    height: 4px;
    margin: 0 auto;
    position: relative;
    width: 4px
}

.qc_quality .qc_qualityIndex span:after {
    background-color: #fff;
    content: "";
    display: block;
    height: 40px;
    left: 50%;
    position: absolute;
    top: 0;
    transform: translate(-50%);
    width: 1px
}

.qc_quality .qc_qualityCont h3 {
    font-size: 20px;
    line-height: 30px;
    margin-bottom: 20px;
    margin-top: 44px
}

.qc_quality .qc_qualityCont p {
    line-height: 30px
}

.qc_warehousing {
    background-color: #f6f6f6;
    padding: 80px 0 110px
}

.qc_warehousing .container>h3 {
    font-size: 38px;
    margin-bottom: 56px
}

.qc_warehousing .qc_warMain {
    display: flex
}

.qc_warehousing .qc_warMain .qc_warMLeft {
    flex: 0 0 650px;
    margin-right: 60px
}

.qc_warehousing .qc_warMain .qc_warMLeft img {
    width: 100%
}

.qc_warehousing .qc_warMain .qc_warMRight {
    flex: 1
}

.qc_warehousing .qc_warMain .qc_warMRight>p {
    font-size: 16px;
    line-height: 26px;
    margin-bottom: 50px
}

.qc_warehousing .qc_warMain .qc_warMRight>div {
    display: flex
}

.qc_warehousing .qc_warMain .qc_warMRight>div>div {
    flex: 1
}

.qc_warehousing .qc_warMain .qc_warMRight .qc_warItem {
    align-items: flex-start;
    display: flex;
    margin-bottom: 56px
}

.qc_warehousing .qc_warMain .qc_warMRight .qc_warItem img {
    flex: 0 0 58px;
    margin-right: 15px;
    width: 58px
}

.qc_warehousing .qc_warMain .qc_warMRight .qc_warItem>div {
    flex: 1
}

.qc_warehousing .qc_warMain .qc_warMRight .qc_warItem>div p:first-of-type {
    font-size: 16px;
    margin-bottom: 10px;
    padding-top: 4px
}

.qc_warehousing .qc_warMain .qc_warMRight .qc_warItem>div p:nth-of-type(2) {
    line-height: 26px
}

.qc_certification {
    padding: 100px 0 70px
}

.qc_certification .container>h3 {
    font-size: 38px;
    margin-bottom: 60px;
    text-align: center
}

.qc_certification ul {
    background-color: #fcfcfc;
    border: 1px solid #e6e6e6;
    display: flex;
    padding: 20px
}

.qc_certification ul li {
    flex: 1;
    padding: 20px 40px;
    position: relative;
    text-align: center
}

.qc_certification ul li:after {
    background-color: #e6e6e6;
    content: "";
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 1px
}

.qc_certification ul li img {
    display: block;
    height: 100px;
    margin: 0 auto;
    width: 100px
}

.qc_certification ul li h3 {
    font-size: 20px;
    margin: 14px 0
}

.qc_certification ul li p {
    line-height: 26px
}

.qc_certification ul li:last-of-type:after {
    display: none
}

@media screen and (max-width: 1400px) {
    .qc_laboratory .qc_laboMain .qc_laboImg {
        max-width:60%
    }
}

@media (max-width:768px) {
    .qc_certification ul{flex-wrap: wrap;}
    .qc_certification ul li{flex:0 0 100%;}
    .qc_certification ul li:after{background-color: #fff;}
    .qc_warehousing .qc_warMain{display: block;}
    .qc_warehousing .container>h3{font-size:30px}
    .qc_warehousing .qc_warMain .qc_warMLeft{margin-right: 0;margin-bottom: 20px;}
    .qc_warehousing .qc_warMain .qc_warMRight>div{display: block;}
    .qc_inspection .container>h3{font-size:30px}
    .qc_inspection .qc_inspMain{display: block;}
    .qc_laboratory .container>h3{font-size:30px}
    .qc_laboratory .qc_laboMain{display: block;}
    .qc_laboratory .qc_laboMain .qc_laboImg{max-width: 100%;}
    .qc_quality ul{display: block;}
    .qc_supMain{display: block;}
    .qc_supMain .qc_supMainLeft{width:100%;margin-right: 0;}
}