/* 公用样式 */
#c-placeholder {height: 1rem;}
header {position: fixed; left: 0; top: 0; z-index: 99; width: 100%;transition: .5s;height: 1rem;  box-shadow: -0.174px 4.997px 7px 0px rgba(1, 157, 90, 0.08); background: #fff;}
header .headBox{height: 100%;} 
.headBox .logo {padding:.1rem 0;height: 100%;display: flex;margin-left: 2%;}
.headBox .logo img {max-width: 100%; max-height: .23rem; object-fit: contain; }

.headBox .re{height: 100%;}
/* 导航 */

nav {height: 100%;/* width: 66%; */}
nav > ul {display: flex; height: 100%; align-items: center;justify-content: space-between;}
nav > ul > li {height: 100%;display: flex;align-items: center;position: relative;margin: 0 .28rem;}
nav > ul > li > a {color: #333; position: relative;  display: flex; align-items: center; text-transform: uppercase; transition: .5s;}
nav > ul > li > a i {}
nav > ul > li > a::after {content: '';position: absolute;right: -.08rem;bottom: 0.05rem;width: .05rem;height: .05rem;background: #009E5A;transition: .5s; opacity: 0;}
nav > ul > li.on > a{font-family: 'HarmonyOS_Sans_SC_Bold';}
nav > ul > li.on > a::after {opacity: 1;}
@media (any-hover: hover) {
  nav > ul > li:hover > a{font-family: 'HarmonyOS_Sans_SC_Bold';}
  nav > ul > li:hover > a::after {opacity: 1;}
}


/* 搜索 */
.head_search{height: 100%;}
.head_search a{cursor: pointer;position: relative;background: #0066CC;height: 100%;display: flex;padding: 0 .55rem;margin-left: .33rem;}
.head_search img{width: .2rem;}
.head_search em{text-transform: uppercase; margin-left: .16rem;}

.search-dropdown {position: absolute;top: 110%;right: 0;width: 3.5rem;background: #fff;box-shadow: 0 .1rem .3rem rgba(0, 0, 0, 0.1);padding: .2rem;border-radius: .1rem;margin-top: .15rem;opacity: 0;visibility: hidden;transform: translateX(3%);transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);z-index: 100;}
.search-dropdown.active {opacity: 1;visibility: visible; top: 100%;}
/* 小三角 */
.search-dropdown::before {content: "";position: absolute;bottom: 100%;right: 1.15rem;border-width: .1rem;border-style: solid;border-color: transparent transparent #fff transparent;}
.search-dropdown .search-form {display: flex;align-items: center;background: #f5f5f5;border-radius: .5rem;padding: .05rem .15rem;border: 1px solid transparent;transition: all 0.3s;width: 100%;}
.search-dropdown .search-form:focus-within {background: #fff;border-color: #0066CC;box-shadow: 0 0 .1rem rgba(102, 45, 145, 0.1);}
.search-dropdown .search-input {flex: 1;border: none;background: transparent;padding: .1rem;font-size: var(--font14);color: #333;outline: none;}
.search-dropdown .search-submit {background: transparent;border: none;color: #0066CC;font-size: var(--font18);cursor: pointer;display: flex;align-items: center;justify-content: center;transition: transform 0.3s;}
.search-dropdown .search-submit:hover {transform: scale(1.1);}
@media screen and (max-width: 767px) {
  .search-dropdown {position: fixed;top: 1.2rem; left: 5%;right: 5%;width: 90%;margin-top: 0;}
  .search-dropdown::before {display: none;}
}





/* =================头部 end!!!=================== */



/* ===============公用css star!!!!===================*/
.index-more{background: #0066CC;border-radius: .06rem;padding: .13rem .173rem;transition: .35s;display: inline-block;}
.index-more img{width: .16rem; margin-left: .16rem;}
@media (any-hover: hover) {
  .index-more:hover {
		-webkit-box-shadow: 0 0 0 0.1rem rgba(0, 102, 204,  .2);
		box-shadow: 0 0 0 0.1rem rgba(0, 102, 204, .2);
	}
}

/* ===============公用css end!!!!===================*/





/* ======首页======= */
.indexBanner { position: relative; overflow: hidden; }
.indexBanner .swiper {height: auto;}
.indexBanner .slide {position: relative; overflow: hidden;}
.indexBanner .slide .imgBox {position: relative; height: auto;}
.indexBanner .slide .imgBox img {width: 100%; object-fit: cover;  transition: 1s linear 2s;transform: scale(1.1, 1.1);}
.indexBanner .slide .box {position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; flex-direction: column; z-index: 2;}
.indexBanner .con {text-align: center;color: #fff;display: flex;flex-direction: column;align-items: center;}
.indexBanner .con span{background: rgba(0, 102, 204, .5);display: inline-block;border-radius: 100px;padding: .035rem .21rem; margin-bottom: .02rem;}
.indexBanner .con em{}
.indexBanner .con strong{font-size: .7rem; margin-bottom: .16rem; }
.indexBanner .con p{max-width: 43.35%; margin: 0 auto .47rem;}
.banner-link a {padding: .12rem .31rem;color: #fff;border: 1px solid #fff;border-radius: .06rem;background: transparent;transition: .35s;}
@media (any-hover: hover) {
  .banner-link a:hover {background: #0066CC; border-color: #0066CC;}
}

/* 当前 */
.indexBanner .swiper-slide-active .imgBox img, .indexBanner .swiper-slide-duplicate-active .imgBox img {transition: 6s linear;transform: scale(1, 1);}
/* 控件 */
.indexBanner .pagtion {text-align: left; left: 50%; transform: translateX(-50%); bottom: .5rem;width: 85%; z-index: 3;}
.indexBanner .pagtion span {width: .15rem; height: .15rem; background: #FFFFFF; opacity: .2; font-size: var(--font22);   position: relative; display: inline-flex; align-items: center;}
.indexBanner .pagtion span.swiper-pagination-bullet-active {opacity: 1;}


.company-bg {background: url(../images/company-bg.webp) no-repeat center top;background-size: cover; padding: 1.38rem  0 1.06rem;}
.index-top{align-items: flex-start;}
.index-title{width: 54.92%;}
.index-title b{font-family: "HarmonyOS_Sans_SC_Black"; display: block; text-transform: uppercase; }
.index-title img{max-width: 100%;}
.index-title h2{text-transform: uppercase; font-family: "HarmonyOS_Sans_SC_Bold";  line-height: 1.2;}
.index-title h3{color: #666666; margin-top: .3rem;}

.company-bg .index-title b{margin-bottom: 0.1rem;}
.company-bg .index-title h3{margin-top: .5rem;}

.company{margin-top: .85rem;}
.company-left{width: 38.5%;}
.company-left ul{gap: .15rem .23rem;}
.company-left ul li{background: #F2F2F2; border-radius: .04rem; padding: .26rem .47rem .29rem; transition: .6s;}
.company-left ul li b{color: #0066CC; font-family:"HarmonyOS_Sans_SC_Bold"; display: block;}
.company-left ul li span{text-transform: uppercase; }
@media (any-hover: hover) {
.company-left ul li:hover{border-radius: .04rem .3rem .04rem .3rem; background: #0066CC;}
.company-left ul li:hover b{color: #fff;}
.company-left ul li:hover span{color: #fff;}
}


.company-right{width: 51.28%;}
.company-right ul li{display: flex;align-items: flex-start;padding: .15rem 0;border-top: 1px solid #F2F2F2;color: #333;justify-content: space-between;}
.company-right ul li:last-child{border-bottom: 1px solid #F2F2F2;}
.company-right ul li b{width: 28%; flex-shrink: 0; font-family: "HarmonyOS_Sans_SC_Bold"; padding-left: .44rem;}
.company-right ul li span{flex: .7;margin-right: .5rem;}

.product {padding: .65rem 0 .6rem;}
.product .index-title{width: 64.92%;}


.product-list {margin-top: .42rem;}
.product-list b{font-family: "HarmonyOS_Sans_SC_Black"; display: block; text-transform: uppercase; margin-bottom: .28rem;}
.product-list ul{ gap: .18rem .26rem;}
.product-list ul li{background: #D8DDE3; border-radius: .04rem;   color: #333; transition: .6s; font-family: "HarmonyOS_Sans_SC_Medium"; height: 60px; text-align: center;}

.indoor-bg {padding: .7rem 0 .8rem; background: #FCFDFE;}
.indoor-top {margin-bottom: .78rem;gap: .2rem;}
.indoor-top b{font-family: "HarmonyOS_Sans_SC_Bold"; text-transform: uppercase; color: #333;}
.indoor-top span{background: rgba(0, 102, 204, .3);color: #0066CC;border-radius: 100px;padding: .02rem .15rem;text-transform: uppercase;font-family: "HarmonyOS_Sans_SC_Bold";}
.indoor-list ul{gap: .66rem;}
.indoor-list li{border: 1px solid #DFDFDF;border-radius: .1rem;padding: .73rem .6rem .58rem;display: flex;flex-direction: column;background: #FFFFFF;}
.indoor-list li .pic{position: relative;display: flex;align-items: center;justify-content: center;margin-bottom: .2rem;overflow: hidden; height: 3.08rem; min-height: 250px;}
.indoor-list li .pic img{position: relative;z-index: 2;height: 100%;width: auto;max-width: 100%;object-fit: contain;transition: .6s;transform: scale(.9);}
.indoor-list li .pic::after{position: absolute; content: ''; background: url(../images/indoor-logo.png) no-repeat center; background-size: contain; width: 100%; height: 100%;}
.indoor-list li .name{display: flex; align-items: flex-end; min-height: .83rem; margin-bottom: .1rem;}
.indoor-list li b{color: #333;line-height: 1.3;}
.indoor-list li span{color: #666;}
@media (any-hover: hover) {
  .indoor-list li:hover .pic img{transform: scale(1);}
}

.outdoor{padding: .62rem 0 .79rem;}
.outdoor .indoor-list ul{gap: .16rem;}
.outdoor .indoor-top span{background: rgba(0, 204, 34, .3); color: #0BCA2A;}
.outdoor .indoor-list li{padding: .73rem .38rem .29rem;}
.outdoor .indoor-list li .name{min-height: .9rem;}

.business-bg{background: #FCFDFE; padding: .8rem 0 .7rem;}
.business-list{margin-top: .5rem;}
.business-list ul{gap: .34rem;}
.business-list ul li{}
.business-list ul li .pic{overflow: hidden; margin-bottom: .33rem; border-radius: .04rem; border: 1px solid #F2F2F2;}
.business-list ul li .pic img{display: block; width: 100%;  object-fit: cover;}
.business-list ul li .info{}
.business-list ul li .info h4{font-family: "HarmonyOS_Sans_SC_Medium"; margin-bottom: .13rem;}
.business-list ul li .info h5{color: #666666;}



/* ===============公共底部 star!!!!===================*/
.footer {background: #1A1A1A;padding: .9rem 0 .3rem;color: #fff;}
.footer .contact-top {align-items: center;margin-bottom: .75rem;}
.footer .contact-top .index-title {width: auto;}
.footer .contact-top .index-title b {margin-bottom: .04rem;}
.footer .contact-top .index-title h2 {color: #fff; text-transform: uppercase;}


.footer .contact {gap: .3rem;margin-bottom: .53rem;}
.footer .contact-left,
.footer .contact-right {width: 48.21%;background: rgba(255,255,255,0.1);border: 1px solid #8E8E8E;border-radius: .12rem;padding: .42rem .37rem .36rem;}
.footer .contact-left > b,
.footer .contact-right > b {display: block;font-family: "HarmonyOS_Sans_SC_Bold";margin-bottom: .36rem;}

.footer .contact-left ul li {display: flex;align-items: flex-start;justify-content: space-between;padding: .22rem 0;border-top: 1px solid rgba(242, 242, 242, .1);color: #fff;}
.footer .contact-left ul li:last-child {border-bottom: 1px solid rgba(242, 242, 242, .1);}
.footer .contact-left ul li em {width: 32%;flex-shrink: 0;color: #858585;font-family: "HarmonyOS_Sans_SC_Bold";}
.footer .contact-left ul li span {flex: .7;}

.footer .contact-right form ul {gap: 0 .4rem;}
.footer .contact-right form ul li {border-bottom: 1px solid rgba(242, 242, 242, .1);padding: .15rem 0;margin-bottom: .19rem;}
.footer .contact-right form input,
.footer .contact-right form textarea {width: 100%;border: 0;background: transparent;color: #fff;outline: none;resize: none;font-family: "HarmonyOS_Sans_SC_Light";}
.footer .contact-right form input::placeholder,
.footer .contact-right form textarea::placeholder {color: rgba(255,255,255,.4);}
.footer .contact-right .message {border-bottom: 1px solid #3A3A3A; margin-top: .2rem; padding: .1rem 0 .15rem;}
.footer .contact-right .code {gap: .2rem;margin-top: .25rem;border-bottom: 1px solid rgba(242, 242, 242, .1);padding: .1rem 0 .18rem;width: 42%;}
.footer .contact-right .code input {flex: 1;}
.footer .contact-right .code img {height: .36rem;width: auto;border-radius: .04rem;cursor: pointer;flex-shrink: 0;}
.footer .contact-right button {margin-top: .3rem;background: #0066CC;color: #fff;border: 0;border-radius: .06rem;padding: .15rem .37rem;cursor: pointer;transition: .35s;}
@media (any-hover: hover) {
  .footer .contact-right button:hover {
    -webkit-box-shadow: 0 0 0 0.1rem rgba(0, 102, 204, .2);
    box-shadow: 0 0 0 0.1rem rgba(0, 102, 204, .2);
  }
}

.footer .copyright {color: #A19E9E;}
.footer .copyright em {margin-left: .5rem;}
.footer .copyright ul {gap: .35rem;}
.footer .copyright ul a {color: #6D6D6D;text-transform: uppercase;transition: .3s;font-family:"HarmonyOS_Sans_SC_Medium";}
@media (any-hover: hover) {
  .footer .copyright ul a:hover {color: #fff;}
}
/* ===============公共底部 end!!!!===================*/