/* Css Flash */
.swiper1 { --swiper-pagination-color: #fff; --swiper-theme-color: #fff;}
.swiper1 .swiper-slide a{ display:block; width:100%; height:100%;}
.swiper1 .swiper-slide a img{ width:100%;}
.swiper1 .swiper-slide a img:nth-child(2){ display:none;}
.swiper-pagination1 { margin-bottom: 16px;}
@media screen and (max-width: 1024px) {
    .swiper1 .swiper-slide a img:nth-child(1){ display:none;}
    .swiper1 .swiper-slide a img:nth-child(2){ display:block;}
    .swiper-pagination1 { margin-bottom: 4px;}
}


/* Css About */
.ab-bg { background: url(../Images/abBg-01.jpg) no-repeat center top; background-size: cover;}
.ab-bg .ab-tx { width: 42%; padding: 136px 0 150px;}
.ab-bg .ab-tx h2 { font-family: 'Barlow'; font-size: 48px; font-weight: normal; color: #094098; text-transform: uppercase;}
.ab-bg .ab-tx h3 { font-family: 'OPPOSans-Bold'; font-size: 36px; font-weight: normal; color: #333; margin-top: 14px;}
.ab-bg .ab-tx p { font-size: 16px; color: #333; line-height: 36px; margin-top: 64px;}
.ab-bg .ab-tx ul { margin-top: 76px;}
.ab-bg .ab-tx ul li div h1 { font-family: 'Barlow Condensed'; font-size: 60px; font-weight: normal; color: #333; letter-spacing: 0; line-height: 46px;}
.ab-bg .ab-tx ul li div span { display: block; font-size: 16px; color: #666; margin-top: 11px;}
.ab-bg .ab-tx ul li dl { width: 20px; height: 20px; background-color: #e37825; border-radius: 50%; font-family: 'OPPOSans-Bold'; font-size: 12px; color: #fff; text-align: center; line-height: 20px; margin-left: 3px;}
.ab-bg .ab-tx a { display: block; width: 200px; height: 50px; background: #2a6bdc url(../Images/jt.png) no-repeat 150px center; margin-top: 82px; font-size: 18px; color: #fff; padding: 0 30px; line-height: 50px; -webkit-border-radius: 25px; border-radius: 25px; -webkit-transition: all .3s ease; transition: all .3s ease;}
.ab-bg .ab-tx a:hover{ padding: 0 20px; background-color: #e37825; background-position: 160px center;}
@media screen and (max-width: 1920px) {
    .ab-bg .ab-tx { width: 42%; padding: 111px 0 125px;}
    .ab-bg .ab-tx h3 { margin-top: 9px;}
    .ab-bg .ab-tx p { line-height: 30px; margin-top: 57px;}
    .ab-bg .ab-tx ul { margin-top: 69px;}
}
@media screen and (max-width: 1440px) {
    .ab-bg .ab-tx { width: 46%; padding: 89px 0 100px;}
    .ab-bg .ab-tx h2 { font-size: 36px;}
    .ab-bg .ab-tx h3 { font-size: 30px; margin-top: 12px;}
    .ab-bg .ab-tx p { font-size: 15px; line-height: 30px; margin-top: 40px;}
    .ab-bg .ab-tx ul { width: 85%; margin-top: 59px;}
    .ab-bg .ab-tx ul li div h1 { font-size: 54px; line-height: 44px;}
    .ab-bg .ab-tx ul li div span { font-size: 15px; margin-top: 9px;}
    .ab-bg .ab-tx a { width: 180px; height: 44px; background-position: 135px center; margin-top: 62px; font-size: 16px; padding: 0 25px; line-height: 44px;}
    .ab-bg .ab-tx a:hover{ padding: 0 15px; background-position: 125px center;}
}
@media screen and (max-width: 1024px) {
    .ab-bg { background-image: url(../Images/abBg-02.jpg);}
    .ab-bg .ab-tx { width: 100%; padding: 41px 0 50px;}
    .ab-bg .ab-tx h2 { font-size: 30px; text-align: center;}
    .ab-bg .ab-tx h3 { font-size: 24px; text-align: center; margin-top: 9px;}
    .ab-bg .ab-tx p { font-size: 14px; line-height: 28px; margin-top: 28px;}
    .ab-bg .ab-tx ul { width: 60%; margin: 43px auto 0;}
    .ab-bg .ab-tx ul li div h1 { font-size: 48px; line-height: 40px;}
    .ab-bg .ab-tx ul li div span { font-size: 14px; margin-top: 6px;}
    .ab-bg .ab-tx ul li dl { width: 16px; height: 16px; font-size: 10px; line-height: 16px; margin-left: 4px;}
    .ab-bg .ab-tx a { width: 150px; height: 35px; background-position: 115px center; background-size: 15px 9px; margin: 47px auto 0; font-size: 14px; padding: 0 20px; line-height: 35px;}
    .ab-bg .ab-tx a:hover{ padding: 0 20px; background-position: 115px center;}
}
@media screen and (max-width: 800px) {
    .ab-bg .ab-tx ul { width: 80%;}
}
@media screen and (max-width: 480px) {
    .ab-bg .ab-tx { padding: 28px 0 35px;}
    .ab-bg .ab-tx h2 { font-size: 24px;}
    .ab-bg .ab-tx h3 { font-size: 20px; margin-top: 8px;}
    .ab-bg .ab-tx p { margin-top: 22px;}
    .ab-bg .ab-tx ul { width: 100%; margin-top: 33px;}
    .ab-bg .ab-tx ul li div h1 { font-size: 42px; line-height: 34px;}
    .ab-bg .ab-tx ul li div span { margin-top: 5px;}
    .ab-bg .ab-tx ul li dl { margin-left: 3px;}
    .ab-bg .ab-tx a { width: 134px; height: 31px; background-position: 104px center; background-size: 15px 9px; margin-top: 37px; padding: 0 15px; line-height: 31px;}
    .ab-bg .ab-tx a:hover{ padding: 0 15px; background-position: 104px center;}
}


/* Css Application */
.fl-bg { background: url(../Images/flBg.jpg) no-repeat center; background-size: cover; padding-bottom: 125px;}
.title { color: #fff; text-align: center; padding: 86px 0 85px;}
.title h2 { font-family: 'Barlow'; font-size: 48px; font-weight: normal; text-transform: uppercase;}
.title h3 { font-family: 'OPPOSans-Bold'; font-size: 36px; font-weight: normal; margin-top: 14px;}
.fl-ls { flex-wrap: wrap;}
.fl-ls a { display: block; width: 32%; position: relative; overflow: hidden;}
.fl-ls a:nth-child(n+4) { margin-top: 2%;}
.fl-ls a img { width: 100%; -webkit-transition: all .75s ease; transition: all .75s ease;}
.fl-ls a:hover img { -webkit-transform: scale(1.2);transform: scale(1.2);}
.fl-ls a p { position: absolute; left: 0; bottom: 0; width: 100%; font-size: 18px; color: #fff; text-align: center; line-height: 35px; background-color: rgba(0,0,0,.4); -webkit-transition: all .5s ease; transition: all .5s ease;}
.fl-ls a:hover p { background-color: rgba(227,120,37,.75);}
@media screen and (max-width: 1440px) {
    .fl-bg { padding-bottom: 100px;}
    .title { color: #fff; text-align: center; padding: 74px 0 65px;}
    .title h2 { font-size: 36px;}
    .title h3 { font-size: 30px; margin-top: 12px;}
    .fl-ls a p { font-size: 16px; line-height: 32px;}
}
@media screen and (max-width: 1024px) {
    .fl-bg { padding-bottom: 65px}
    .title { padding: 41px 0 35px;}
    .title h2 { font-size: 30px;}
    .title h3 { font-size: 24px; margin-top: 9px;}
    .fl-ls a p { font-size: 15px; line-height: 28px;}
}
@media screen and (max-width: 640px) {
    .fl-ls a { width: 48.5%;}
    .fl-ls a:nth-child(n+3) { margin-top: 3%;}
}
@media screen and (max-width: 480px) {
    .fl-bg { padding-bottom: 40px}
    .title { padding: 28px 0 30px;}
    .title h2 { font-size: 24px;}
    .title h3 { font-size: 20px; margin-top: 8px;}
    .fl-ls a p { font-size: 14px; line-height: 24px;}
}
@media screen and (max-width: 375px) {
    .fl-ls a { padding: 10px 0;}
}


/* Css Products */
.ig-bg { background: url(../Images/igBg.jpg) no-repeat center bottom; background-size: cover; padding-bottom: 125px;}
.ig-bg .title h2 { color: #094098;}
.ig-bg .title h3 { color: #333;}
.ig-ls { flex-wrap: wrap;}
.ig-ls li { display: block; width: 23.285714%; background-color: #fff; border: 2px solid #fff; -webkit-transition: all .3s ease; transition: all .3s ease;}
.ig-ls li:nth-child(n+5) { margin-top: 2.85%;}
.ig-ls li:hover { border-color: #094098;}
.ig-ls li .ig-is { display: block; overflow: hidden;}
.ig-ls li .ig-is img { width: 100%;}
.ig-ls li .ig-nm { display: block; font-size: 16px; color: #333; text-align: center; margin-top: 11px;}
.ig-ls li .ig-an { width: 180px; height: 35px; background: url(../Images/igAn.jpg) no-repeat center; margin: 32px auto 33px; overflow: hidden; -webkit-border-radius: 5px; border-radius: 5px; -webkit-transition: all .3s ease; transition: all .3s ease;}
.ig-ls li:hover .ig-an { background-image: url(../Images/igAn02.jpg);}
.ig-ls li .ig-an a { display: block; width: 50%; font-size: 14px; color: #333; text-align: center; line-height: 35px;}
.ig-ls li .ig-an a:nth-child(1) { color: #fff;}
@media screen and (max-width: 1440px) {
    .ig-bg { padding-bottom: 100px;}
}
@media screen and (max-width: 1024px) {
    .ig-bg { padding-bottom: 65px;}
    .ig-ls li .ig-nm { font-size: 14px; margin-top: 10px;}
    .ig-ls li .ig-an { width: 128px; height: 25px; background-size: 128px 25px; margin: 17px auto 23px;}
    .ig-ls li .ig-an a { font-size: 12px; line-height: 25px;}
}
@media screen and (max-width: 640px) {
    .ig-ls li { width: 48.5%;}
    .ig-ls li:nth-child(n+3) { margin-top: 3%;}
}
@media screen and (max-width: 480px) {
    .ig-bg { padding-bottom: 40px;}
}


/* Css Strength */
.sl-bg { background-color: #f5f5f5; position: relative;}
.sl-bg .title { position: absolute; left: 0; top: 86px; z-index: 9999; width: 100%; padding: 0;}
.gallery-top .swiper-slide { position: relative;}
.gallery-top .swiper-slide img { width: 100%;}
.gallery-top .swiper-slide dl { position: absolute; left: 0; top: 40%; padding: 0 5%;}
.gallery-top .swiper-slide dl h4 { font-family: 'OPPOSans-Bold'; font-size: 30px; font-weight: normal; color: #fff;}
.gallery-top .swiper-slide dl p { font-size: 18px; color: #fff; line-height: 36px; margin-top: 29px;}
.sl-an { position: absolute; left: 0; bottom: 125px; width: 100%;}
.gallery-thumbs { max-width: 1400px; margin: auto;}
.gallery-thumbs .swiper-slide { font-family: 'OPPOSans-Bold'; font-size: 24px; font-weight: normal; color: #333; background-color: #fff; line-height: 88px; padding: 0 25px; cursor: pointer; -webkit-border-radius: 10px; border-radius: 10px; -webkit-transition: all .3s ease; transition: all .3s ease;}
.gallery-thumbs .swiper-slide dl { float: right; width: 44px; height: 44px; margin-top: 22px; background-repeat: no-repeat; background-position: center; background-size: cover; -webkit-transition: all .3s ease; transition: all .3s ease;}
.gallery-thumbs .swiper-slide:nth-child(1) dl { background-image: url(../Images/sl01.png);}
.gallery-thumbs .swiper-slide:nth-child(2) dl { background-image: url(../Images/sl02.png);}
.gallery-thumbs .swiper-slide:nth-child(3) dl { background-image: url(../Images/sl03.png);}
.gallery-thumbs .swiper-slide:nth-child(4) dl { background-image: url(../Images/sl04.png);}
.gallery-thumbs .swiper-slide:hover, .gallery-thumbs .swiper-slide-thumb-active { color: #fff; background-color: #2a6bdc;}
.gallery-thumbs .swiper-slide:nth-child(1):hover dl, .gallery-thumbs .swiper-slide-thumb-active:nth-child(1) dl { background-image: url(../Images/sl01-02.png);}
.gallery-thumbs .swiper-slide:nth-child(2):hover dl, .gallery-thumbs .swiper-slide-thumb-active:nth-child(2) dl { background-image: url(../Images/sl02-02.png);}
.gallery-thumbs .swiper-slide:nth-child(3):hover dl, .gallery-thumbs .swiper-slide-thumb-active:nth-child(3) dl { background-image: url(../Images/sl03-02.png);}
.gallery-thumbs .swiper-slide:nth-child(4):hover dl, .gallery-thumbs .swiper-slide-thumb-active:nth-child(4) dl { background-image: url(../Images/sl04-02.png);}
@media screen and (max-width: 1440px) {
    .sl-bg .title { top: 74px;}
    .gallery-top .swiper-slide dl { padding: 0 3.5%;}
    .gallery-top .swiper-slide dl h4 { font-size: 24px;}
    .gallery-top .swiper-slide dl p { font-size: 16px; line-height: 32px; margin-top: 26px;}
    .sl-an { bottom: 85px;}
    .gallery-thumbs { max-width: inherit; margin: 0 3.5%;}
    .gallery-thumbs .swiper-slide { font-size: 20px; line-height: 78px; padding: 0 20px;}
    .gallery-thumbs .swiper-slide dl { width: 38px; height: 38px; margin-top: 20px; background-size: 38px 38px;}
}
@media screen and (max-width: 1024px) {
    .sl-bg .title { top: 41px;}
    .gallery-top .swiper-slide dl { padding: 0 15px;}
    .gallery-top .swiper-slide dl h4 { font-size: 20px;}
    .gallery-top .swiper-slide dl p { font-size: 14px; line-height: 30px; margin-top: 17px;}
    .sl-an { bottom: 50px;}
    .gallery-thumbs { margin: 0 15px;}
    .gallery-thumbs .swiper-slide { font-size: 18px; line-height: 58px; padding: 0 15px;}
    .gallery-thumbs .swiper-slide dl { width: 28px; height: 28px; margin-top: 15px; background-size: 28px 28px;}
}
@media screen and (max-width: 768px) {
    .gallery-top .swiper-slide dl { top: inherit; bottom: 42px;}
    .sl-an { position: relative; left: inherit; bottom: inherit;}
    .gallery-thumbs { margin: 0;}
    .gallery-thumbs .swiper-slide { line-height: 50px; padding: 0 12px; color: #fff; background-color: #094098; -webkit-border-radius: 0; border-radius: 0;}
    .gallery-thumbs .swiper-slide dl { width: 24px; height: 24px; margin-top: 13px; background-size: 24px 24px;}
    .gallery-thumbs .swiper-slide:nth-child(1) dl { background-image: url(../Images/sl01-02.png);}
    .gallery-thumbs .swiper-slide:nth-child(2) dl { background-image: url(../Images/sl02-02.png);}
    .gallery-thumbs .swiper-slide:nth-child(3) dl { background-image: url(../Images/sl03-02.png);}
    .gallery-thumbs .swiper-slide:nth-child(4) dl { background-image: url(../Images/sl04-02.png);}
    .gallery-thumbs .swiper-slide:hover, .gallery-thumbs .swiper-slide-thumb-active { background-color: #e37825;}  
}
@media screen and (max-width: 640px) {
    .sl-bg .title { top: 21px;}
    .gallery-top .swiper-slide dl { bottom: 22px;}
}
@media screen and (max-width: 480px) {
    .gallery-top .swiper-slide dl { position: relative; left: inherit; bottom: inherit; margin-top: 25px; margin-bottom: 20px;}
    .gallery-top .swiper-slide dl h4 { color: #333;}
    .gallery-top .swiper-slide dl p { color: #666; line-height: 24px; margin-top: 12px;}
}


/* Css News */
.ns-bg { background-color: #f5f5f5; padding-bottom: 125px;}
.ns-bg .title h2 { color: #094098;}
.ns-bg .title h3 { color: #333;}
.ns-zb { width: 32%; flex-wrap: wrap; align-content: space-between; overflow: hidden;}
.ns-zb a { display: block; width: 100%; height: 100%; background: url(../Images/nsBg.jpg) no-repeat center; background-size: cover; -webkit-transition: all .5s ease; transition: all .5s ease;}
.ns-zb a:hover { -webkit-transform: scale(1.1);transform: scale(1.1);}
.ns-yb { width: 66%; flex-wrap: wrap;}
.ns-yb a { display: block; width: 48.484848%; height: 264px; background-color: #fff; padding: 40px; -webkit-transition: all .3s ease; transition: all .3s ease;}
.ns-yb a:nth-child(n+3) { margin-top: 3.030304%;}
.ns-yb a h5 { font-size: 14px; font-weight: normal; color: #999; letter-spacing: 1px; -webkit-transition: all .3s ease; transition: all .3s ease;}
.ns-yb a h4 { font-family: 'OPPOSans-Bold'; font-size: 24px; font-weight: normal; color: #333; margin: 17px 0 35px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; -webkit-transition: all .3s ease; transition: all .3s ease;}
.ns-yb a p { font-size: 14px; color: #666; line-height: 24px; -webkit-transition: all .3s ease; transition: all .3s ease;}
.ns-yb a:hover { background-color: #094098;}
.ns-yb a:hover h5, .ns-yb a:hover h4, .ns-yb a:hover p { color: #fff;}
@media screen and (max-width: 1440px) {
    .ns-bg { padding-bottom: 100px;}
    .ns-yb a h4 { font-size: 20px; margin: 17px 0 34px;}
}
@media screen and (max-width: 1280px) {
    .ns-yb a { padding: 30px;}
}
@media screen and (max-width: 1024px) {
    .ns-bg { padding-bottom: 65px;}
    .ns-zb { display: none;}
    .ns-yb { width: 100%;}
    .ns-yb a { height: 200px; padding: 25px;}
    .ns-yb a h5 { font-size: 13px;}
    .ns-yb a h4 { font-size: 18px; margin: 13px 0 20px;}
}
@media screen and (max-width: 640px) {
    .ns-yb a { width: 100%; height: auto;}
    .ns-yb a:nth-child(n+2) { margin-top: 25px;}
    .ns-yb a h4 { margin: 10px 0 16px; white-space: inherit;}
}
@media screen and (max-width: 480px) {
    .ns-bg { padding-bottom: 40px;}
    .ns-yb a { padding: 15px;}
    .ns-yb a:nth-child(n+2) { margin-top: 20px;}
}