@charset "utf-8";
/* Css Document */
@font-face { font-family: "OPPOSans3.0cn-Regular"; src: url(../Fonts/OPPOSans3.0cn-Regular.woff2) format("woff2"), url(../Fonts/OPPOSans3.0cn-Regular.woff) format("woff"), url(../Fonts/OPPOSans3.0cn-Regular.ttf) format("truetype"); font-variation-settings: 'wght' 300; font-style: normal; font-display: swap;}
@font-face { font-family: 'OPPOSans-Bold'; src: url(../Fonts/OPPOSans-B.woff2) format("woff2"), url(../Fonts/OPPOSans-B.woff) format("woff"), url(../Fonts/OPPOSans-B.ttf) format("truetype"); font-style: normal; font-display: swap;}
@font-face { font-family: 'Gotham Bold'; src: url('../Fonts/Gotham-Bold.woff2') format('woff2'), url('../Fonts/Gotham-Bold.woff') format('woff'), url('../Fonts/Gotham-Bold.ttf') format('truetype'); font-weight: bold; font-style: normal; font-display: swap;}
@font-face { font-family: 'Gotham Book'; src: url('../Fonts/Gotham-Book.woff2') format('woff2'), url('../Fonts/Gotham-Book.woff') format('woff'), url('../Fonts/Gotham-Book.ttf') format('truetype'); font-weight: normal; font-style: normal; font-display: swap;}
*, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box;}
html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
html,input,textarea{ font-family:-apple-system,BlinkMacSystemFont,"OPPOSans3.0cn-Regular",HarmonyOS Sans SC,PingFang SC,Helvetica Neue,Helvetica,Arial,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif; font-size:14px; color:#333;}
body { width: expression(document.body.clientWidth <= 1440? "1440px": "auto"); min-width: 1440px; background-color: #fff;}
body,div,ul,li,dl,dt,dd,ol,form,a,span,p,h1,h2,h3,h4,h5,h6,label,table,tbody,tr,th,td,object,iframe,icon { margin: 0; padding: 0;}
center { font-size: 18px; letter-spacing: 0.75px; text-transform: uppercase;}
html,body { height: 100%;}
main { max-width: 1920px; margin: auto;}
img { border: none; vertical-align: bottom;}
ul,li { list-style-type: none;}
a { color: #333; text-decoration: none;}
a:hover { color: #258000; text-decoration: none;}
a { outline: none;}
a:active { star: expression(this.onFocus=this.blur());}
:focus { outline: 0;}
.clear { width: 0; height: 0; padding: 0; margin: 0; clear: both;}
.flex { display: flex; justify-content: space-between;}
.main { max-width: 75%; margin: auto;}





/* Css Top */
.tp-bg { width: 100%; height: 150px; background: url(../Images/tpBg.jpg) repeat-x top;}
.tp-bg .tp-lg { width: 200px; height: 78px; background: url(../Images/logo.png) no-repeat center; background-size: 200px 78px; margin-top: 36px;}
.tp-bg .tp-lg a { display: block; width: 100%; height: 100%;}
.tp-bg .tp-dh { flex: 1 1 auto; margin: 53px 65px 0 0; justify-content: flex-end;}
.tp-bg .tp-dh a { font-size: 22px; color: #333; line-height: 42px; height: 44px; margin-left: 45px; -webkit-transition: all .3s ease; transition: all .3s ease;}
.tp-bg .tp-dh a:hover { color: #00b5ac;}
.tp-bg .tp-tl { width: 258px; height: 44px; background: url(../Images/tel.png) no-repeat center; background-size: 258px 44px; margin-top: 53px;}

@media screen and (max-width: 1680px) { 
    .tp-bg { height: 110px;}
    .tp-bg .tp-lg { width: 154px; height: 60px; background-size: 154px 60px; margin-top: 25px;}
    .tp-bg .tp-dh { margin: 38px 50px 0 0;}
    .tp-bg .tp-dh a { font-size: 20px; line-height: 30px; height: 32px; margin-left: 40px;}
    .tp-bg .tp-tl { width: 200px; height: 34px; background-size: 200px 34px; margin-top: 38px;}
}
@media screen and (max-width: 1440px) { 
    .tp-bg .tp-dh { margin: 38px 40px 0 0;}
    .tp-bg .tp-dh a { margin-left: 30px;}
}


/* Css Flash */
.swiper-container { width: 100%; --swiper-pagination-color: #000; --swiper-theme-color: #000;}
.swiper-container .swiper-pagination-bullet-active { background: #e58922;}
.swiper-container .swiper-slide a { display: block;}
.swiper-container .swiper-slide a img { width: 100%; cursor: pointer;}
.swiper-container .swiper-pagination { margin-bottom: 8px;}


/* Css Classification */
.fl-bg a { display: block;}
.fl-bg a img { width: 100%;}


/* Css About */
.ab-bg img { width: 100%;}


/* Css Workshop */
.sb-bg img { width: 100%;}


/* Css Products */
.ig-bg img { width: 100%;}
.ig-bg .ig-ls { position: relative;}
.ig-bg .ig-ls dl { position: absolute; left: 0; top: 0; width: 75%; height: 89.583333%; margin: 0 12.5%;}
.ig-bg .ig-ls dl a { display: block; width: 22.916667%;}
.ig-bg .ig-al { position: relative;}
.ig-bg .ig-al a { position: absolute; left: 50%; top: 14.705882%; display: block; width: 12.5%; height: 35.294118%; margin-left: -6.25%;}


/* Css Case */
.al-bg img { width: 100%;}


/* Css Process */
.lc-bg img { width: 100%;}


/* Css Bottom */
.db-bg { position: relative;}
.db-bg img { width: 100%;}
.db-bg a { position: absolute; left: 57.25%; bottom: 14.5%; display: block; width: 12.5%; height: 6.578947%;}


/* Page Products */
.flash img { width: 100%;}
.ps-bg { background: url(../Images/bg.jpg) repeat; padding: 100px 0;}
.ps-bg .ps-ls { flex-wrap: wrap;}
.ps-bg .ps-ls a { width: 47.5%;}
.ps-bg .ps-ls a:nth-child(n+3) { margin-top: 5%;}
.ps-bg .ps-ls a img { width: 100%;}
.ps-bg .ps-ls a .ps-tx { height: 120px; background-color: #00b5ac; padding: 27px 25px 0;}
.ps-bg .ps-ls a .ps-tx .ps-zb { width: 60%;}
.ps-bg .ps-ls a .ps-tx .ps-zb h3 { font-family: 'OPPOSans-Bold'; font-size: 30px; font-weight: normal; color: #fff;}
.ps-bg .ps-ls a .ps-tx .ps-zb p { font-size: 24px; color: #fff; margin-top: 3px;}
.ps-bg .ps-ls a .ps-tx .ps-yb { line-height: 36px; height: 36px; background-color: #fff; font-size: 18px; color: #00b5ac; text-transform: uppercase; padding: 0 15px; border-radius: 25px; margin-top: 15px;}

@media screen and (max-width: 1680px) { 
    .ps-bg .ps-ls a .ps-tx { height: 100px; padding: 24px 20px 0;}
    .ps-bg .ps-ls a .ps-tx .ps-zb h3 { font-size: 24px;}
    .ps-bg .ps-ls a .ps-tx .ps-zb p { font-size: 18px; margin-top: 5px;}
    .ps-bg .ps-ls a .ps-tx .ps-yb { line-height: 30px; height: 30px; font-size: 16px; padding: 0 12px; margin-top: 11px;}
}


/* Page ProductView */
.pv-bg { background-color: #fff; padding-bottom: 100px;}
.pv-bg .pv-nm { font-size: 48px; color: #333; padding: 50px 0 75px;}
.pv-bg .pv-nm span { color: #e58922; margin-right: 10px;}
.pv-bg .pv-ny .pv-zb { width: 75%;}
/*.pv-bg .pv-ny .pv-zb img { width: auto !important; max-width: 100%; height: auto !important;}*/
.pv-bg .pv-ny .pv-zb img { width: 100%;}
.pv-bg .pv-ny .pv-yb { width: 17.5%;}
.pv-bg .pv-ny .pv-yb .pv-ls a { display: block; position: relative;}
.pv-bg .pv-ny .pv-yb .pv-ls a:nth-child(n+2) { margin-top: 25px;}
.pv-bg .pv-ny .pv-yb .pv-ls a img { width: 100%;}
.pv-bg .pv-ny .pv-yb .pv-ls a h3 { position: absolute; left: 0; bottom: 0; width: 100%; font-size: 16px; font-weight: normal; color: #fff; text-align: center; background-color: rgba(0,0,0,.4); padding: 5px 10px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.pv-xy a { display: block; font-size: 18px; color: #999; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; -webkit-transition: all .3s ease; transition: all .3s ease;}
.pv-xy a:hover { color: #00b5ac;}


/* Page Contact */
.lx-ls ul { flex-wrap: wrap;}
.lx-ls ul li { display: block; color: #333; background-color: #fff; width: 30%; height: 300px; cursor: pointer; position: relative;}
.lx-ls ul li:nth-child(1), .lx-ls ul li:nth-child(2) { width: 47.5%;}
.lx-ls ul li:nth-child(n+3) { margin-top: 5%;}
.lx-ls ul li div { position: absolute; right: 30px; top: 30px;}
.lx-ls ul li img { width: 40px;}
.lx-ls ul li dl { position: absolute; left: 0; bottom: 0; padding: 0 35px 31px;}
.lx-ls ul li dl h3 { font-family: 'OPPOSans-Bold'; font-size: 30px; font-weight: normal;}
.lx-ls ul li dl h3:nth-child(3) { margin-top: 35px;}
.lx-ls ul li dl p { font-size: 24px; color: #666; margin-top: 15px;}
.lx-ls ul li dl p:nth-child(3) { margin-top: 5px;}

#container { overflow: hidden; width: 100%; height: 780px; margin: 0;}
.BMap_stdMpPan, .BMap_stdMpZoom .BMap_button, .BMap_stdMpSliderBgTop, .BMap_stdMpSliderBar, .BMap_stdMpSliderBgBot, .anchorBL{ width: 0 !important; height: 0 !important;}
.anchorBL img { width: 0 !important;}


/* Page About */
.gs-bg { padding: 86px 0 89px; font-size: 24px; color: #333; line-height: 48px;}
.gs-bg p:nth-child(n+2) { margin-top: 35px;}

.sb-bg { padding-bottom: 53px;}
.swiper2 img { width: 100%;}
.swiper2 .swiper-pagination2 { position: relative; margin-top: 36px;}
.swiper2 .swiper-pagination-bullet { opacity: 0.15; background: #000;}
.swiper2 .swiper-pagination-bullet-active { opacity: 1; background-color: #e58922;}


/* Page News */
.xw-bg { background-color: #f9f9f9; padding: 100px 0;}
.xw-ls a { padding-bottom: 50px; border-bottom: 1px solid #e9e9e9;}
.xw-ls a:nth-child(n+2) { margin-top: 50px;}
.xw-ls a:last-child { border-bottom: none;}
.xw-ls a .xw-sj { width: 100px;}
.xw-ls a .xw-sj h4 { font-family: 'Gotham Bold'; font-size: 30px; font-weight: normal; color: #00b5ac; margin: 3px 0 1px;}
.xw-ls a .xw-sj h5 { font-family: 'Gotham Book'; font-size: 16px; font-weight: normal; color: #666;}
.xw-ls a .xw-ig { width: 28.875%; margin: 0 5.125%; overflow: hidden;}
.xw-ls a .xw-ig img { width: 100%; -webkit-transition: all .75s ease; transition: all .75s ease;}
.xw-ls a:hover .xw-ig img { transform: scale(1.2,1.2); -webkit-transform: scale(1.2,1.2);}
.xw-ls a .xw-tx { width: calc(60.875% - 100px); position: relative;}
.xw-ls a .xw-tx h3 { font-size: 24px; font-weight: normal; color: #333; margin: 2px 0 13px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; -webkit-transition: all .3s ease; transition: all .3s ease;}
.xw-ls a:hover .xw-tx h3 { color: #00b5ac;}
.xw-ls a .xw-tx h6 { font-family: 'Gotham Book'; font-size: 14px; font-weight: normal; color: #a0a0a0; margin-bottom: 12px; display: none;}
.xw-ls a .xw-tx p { font-size: 16px; color: #666; line-height: 30px; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}
.xw-ls a .xw-tx dl { position: absolute; left: 0; bottom: 10px; width: 110px; height: 42px; line-height: 30px; background-color: #fff; padding: 6px; border-radius: 25px; -webkit-transition: all .5s ease; transition: all .5s ease;}
.xw-ls a:hover .xw-tx dl { background-color: #e58922;}
.xw-ls a .xw-tx dl font { display: block; width: calc(100% - 30px); font-size: 14px; color: #333; text-align: center; -webkit-transition: all .3s ease; transition: all .3s ease;}
.xw-ls a:hover .xw-tx dl font { color: #fff;}
.xw-ls a .xw-tx dl span { display: block; width: 30px; height: 30px; background-color: #e58922; background-image: url(../Images/jt.png); background-repeat: no-repeat; background-position: center; background-size: 6px 10px; border-radius: 50%;}


/* Page Page */
.flip { display: table; margin: 4.7% auto 0; clear: both;}
.flip a { display: block; float: left; padding: 0 12px; margin: 0 2px; color: #666; line-height: 28px; background-color: #fff; cursor: pointer; -webkit-transition: all .3s ease; transition: all .3s ease;}
.flip a:hover { color: #fff; background-color: #258000;}
.flip a.pgNt { color: #258000;}
.flip a.pgNt:hover { color: #fff;}
.flip a.pgCn { padding: 0 8px;}
.flip a.pgJt { font-family: "SimSun", "NSimSun", "FangSong"; color: #a0a0a0;}
.flip a.pgJt:hover { color: #fff;}
.flip02 a { background:#fff;}
.flip02 a:hover { background-color: #258000;}


/* Page NewView */
.xv-bg { padding: 100px 0 91px;}
.xv-nm { text-align: center;}
.xv-nm h1 { font-family: 'OPPOSans-Bold'; font-size: 48px; font-weight: normal; color: #333;}
.xv-nm dl { font-family: 'Gotham Book'; font-size: 18px; color: #666; text-transform: uppercase; margin-top: 26px;}
.xv-nm dl span { margin: 0 10px;}
.xv-js { font-size: 18px; color: #333; line-height: 36px; margin-top: 62px;}
.xv-js img { width: auto !important; max-width: 100%; height: auto !important;}
.xv-js strong {  font-family: 'OPPOSans-Bold'; font-weight: normal; color: #333;}
.xw-xy { margin-top: 58px;}
.xw-xy a { display: block; font-size: 18px; color: #666; line-height: 36px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; -webkit-transition: all .3s ease; transition: all .3s ease;}
.xw-xy a:hover { color: #00b5ac;}


/* Css BackTop */
.izl-rmenu { position: fixed; right: 20px; bottom: 100px; z-index: 999;}
.izl-rmenu .btn { width: 50px; height: 50px; cursor: pointer; position: relative;}
.izl-rmenu .btn-top { background: url(../images/fhdb.png) no-repeat; display: none;}