/**  公共样式，含 header 、 footer 、   **/

:root {
    --主色:   #03bbe7;
    --主背景: #f8f8f8;
    --边框:   #f1f1f1;
    --字体: #f6f6f6;


    --字体-黑:black;
    --主背景-黑:white;


    --headerhight: 60px; /* header 高度 */

    --small:  12px;
    --nomel: 14px;
    --big:   22px;
}


@font-face{
    font-family:'siyuan-regular';
    src:;
}
@font-face{
    font-family:'siyuan-heavy';
    src:;
}

html,body{ width: 100%;min-height: 100%;background-color: var(--主背景);font-family: 'siyuan-regular',sourcehansanscn-regular;
    margin: 0;font-size: 14px;
}



body::-webkit-scrollbar {  width: 4px; }   /* 设置滚动条宽度 */
body::-webkit-scrollbar-track {  background-color: #f1f1f1; }  /* 设置轨道背景色 */
body::-webkit-scrollbar-thumb {  background-color: #888;  }  /* 设置滑块背景色 */
body::-webkit-scrollbar-thumb:hover {  background-color: #555;  } /* 设置滑块hover时背景色 */


.form-input-list textarea {font-family: 'siyuan-regular';}
a{ text-decoration: none; }
.img-show-content canvas { outline: none; }

.icon-pdd{ color: rgb(245,0,8); }

/*隐藏3d模型*/
.model-3d-box{ display: none; }

/*.content-body{ margin-top:var(--headerhight); }*/
.content-width{ margin: auto; }
.content-width-1200{ margin: auto;max-width: 1200px; }
.content-width-1600{ margin: auto;max-width: 1600px;padding: 0 10%; }
.top-60{  margin-top:calc(60px   var(--headerhight)); }



/**  iconfont 配置  **/
.iconfont {  width: 1em; height: 1em; vertical-align: -0.15em; fill: currentcolor; overflow: hidden;}
/**  ————————————  */






/**  公共  **/
.flex{ display: flex;align-items: flex-start; flex-wrap:wrap}
.space-between{ justify-content: space-between; }
.space-around{ justify-content: space-around; }
.flex-center { justify-content: center; }
.align-items-center{ align-items: center; }
.align-items-start{ align-items: flex-start; }
.text-center{ text-align: center; }
/**  ————————————  */



/*banner*/
.index-banner{ position: relative;margin: 0; }
.index-banner img{ width: 100%;height: auto; }
.index-banner .img-text{ position: absolute;top: 30%;left: 11%; }
.index-banner .img-text h2 { color: white;font-size: 50px;letter-spacing: 8px;font-weight: 550;}
.index-banner .img-text h4 { color: white;font-size: 22px;font-weight: 500;letter-spacing: 4px;}
.index-banner .img-text button {
    font-size: 16px;letter-spacing: 2px;color: #4349ac;
    font-weight: 500;padding: 10px 40px; cursor: pointer;border: none;margin-top: 30px;
}
.index-banner .center-title-box{ position: absolute;top: 30%;width: 100%;text-align: center; }
.index-banner .center-title-box h2 { color: #266fe7;font-size: 70px;letter-spacing: 20px;font-weight: 550;margin-top: 10px;}
.index-banner .center-title-box h4 { color: white;font-size: 40px;font-weight: 500;letter-spacing: 16px;margin-bottom: 20px;}
.index-banner .img-text p{  color: white;font-size: 15px;font-weight: 500;letter-spacing: 4px;width: 60%;line-height: 30px; }
.index-banner .img-text .call-us-btn{
    background-image: linear-gradient(to right, rgba(38,143,255,1), rgba(38, 154, 255, 0.8)); box-shadow: 0 7px 25px 2px rgba(53, 95, 168, 0.18);
    color: #ffffff;
}
.language-en .index-banner .center-title-box h2{ letter-spacing: 0; }
.language-en .index-banner .center-title-box h4{ letter-spacing: 0; }
    /*end--------banner*/


/*title*/

.index-title-box{ text-align: center;margin-top: 140px;position: relative; }
.index-title-box h4{ font-size: 20px;color: #323232;margin-bottom: 0;letter-spacing: 2px; }
.index-title-box h6{ font-size: 13px;color: #949494;margin-top: 28px;letter-spacing: 2px; padding: 0 10%;}
.index-title-box .bg-txt{
    position: absolute;text-align: center;width: 100%;top:0;margin-top: -60px;font-size: 120px;color: rgb(218 218 218 / 10%);
    letter-spacing: 20px;font-weight: 700;z-index: 0;user-select: none;font-family: 'siyuan-heavy';
}
/***-------***/



/*title*/
.base-img-show-box{ margin: 100px 0;padding: 0 8%;}
.base-img-show-box img:first-child{ width: 80%;height: auto;margin: 0 0 120px 10%; }
.base-img-show-box img{ width: 100%;height: auto; }
.base-img-show-box .list-2:first-child{width: 49%;margin: auto;}
.base-img-show-box .list-2{ width: 49%;!important;height: auto;display: inline-block; }
/***-------***/





/*swiper*/
.swiper-container {  width: 100%;  height: 100%;  overflow: hidden;position: relative; }
.swiper-wrapper{height: auto!important;}
.swiper-slide {  float: left;  width: 100%;  height: auto!important; }
.swiper-change{ position: absolute;left: 0;top: 40%;padding: 0 4%;width: 92%;color: white; }
.swiper-change svg{ width: 22px;height: 22px;cursor: pointer;padding: 8px;
    background-color: rgba(179, 179, 179, 0.31);color: white;border-radius: 50%;
}
/*end--------swiper*/




/***梯形swiper组件**/
.trapezoid-content-box{ margin: 80px 0 120px 0; }
.trapezoid-content-box .swiper-container{ width: 60%; }
.trapezoid-content-box{ position: relative; }
.trapezoid-content-box .swiper-slide img{ width: 100%;display: block; }
.trapezoid-content-box .trapezoid-box{
    float: right;height: 0;display: inline-block;
    position: absolute;width: 42%;top: 0;right: 0;
    border-left:100px solid transparent;
    border-right:0 solid transparent;
    border-bottom: 29.95vw solid rgba(9, 145, 240, 0.9);
    color: white;
}
.trapezoid-content-box .swiper-change {  width: 83%; }
.trapezoid-content-box .trapezoid-box h4{margin-top: 11vw;font-size: 20px;margin-left: 60px;letter-spacing: 2px;font-weight: 400;}
.trapezoid-content-box .trapezoid-box p{font-size: 14px;margin-left: 40px;margin-right: 80px;line-height: 30px;letter-spacing: 1px;}
/*end--------*/






/***优势 组件**/
.base-advantage-content{ margin:100px 0;align-items: stretch ; }
.base-advantage-content .advantage-list{
    border-radius: 10px;width: 200px;margin: 1.5vw;text-align: center;
    background-color: rgb(182 214 255 / 30%);  padding: 30px;
}
.base-advantage-content .a-bg{ background-color: rgb(182 214 255 / 30%);}
.base-advantage-content .advantage-list img{ height: 110px;width: auto;margin:10px auto; }
.base-advantage-content .advantage-list h5{ font-size: 16px;margin-top: 0; color: #485681;margin-bottom: 20px;}
.base-advantage-content .advantage-list p{
    font-size: 12px;margin-top: 0;padding: 0 10px;min-height: 60px;line-height: 24px;color: #4b658d;
}
/*end--------*/




/***layout __product 组件**/
.layout-product{ margin: 80px 0;text-align: center; }
.layout-product .layout-product-box{ margin-bottom:  20px ; }
.layout-product .layout-product-box .sy-p-list { width: 20%;margin: 1.5%;position: relative;padding: 0;background-color: rgba(255, 255, 255, 0); }
.layout-product .layout-product-box .sy-p-list div{ position: absolute;top: 50%;text-align: center;width: 100%;color: white;margin-top: -20px;}
.layout-product .layout-product-box .sy-p-list div h4{ margin: 0;font-size: 28px;letter-spacing: 2px;}
.layout-product .layout-product-box .sy-p-list div p{ margin: 5px 0 0;font-size: 12px;}
.layout-product .layout-product-box .sy-p-list img{ width: 100%;height: auto; }
.layout-product a{ padding: 12px 40px;color: white;background-color: #2badff; }
/*end--------*/




/***layout __product 组件**/
/*相关案例*/
.layout-case{ margin: 80px 0;text-align: center; }
.layout-case .layout-case-box{ margin-bottom:  40px ; }
.layout-case .layout-case-box .sy-p-list { width: 25%;margin: 0.5%;position: relative;background-color: white;padding: 0; }
.layout-case .layout-case-box .sy-p-list h4{
    position: absolute;top: 50%;text-align: center;width: 100%;color: white;margin-top: -15px;
    font-size: 20px;letter-spacing: 2px;z-index: 2;
}
.layout-case .layout-case-box .sy-p-list img{ width: 100%;height: auto;display: block; }
.layout-case .layout-case-box .sy-p-list .sy-p-shadow{ width: 100%;height: 100%;position: absolute;top: 0;background-color: rgba(0, 0, 0, 0.49);z-index: 1 }
.layout-case a{ padding: 12px 40px;color: white;background-color: #2badff; }

/*end--------*/















/**  顶部  */
.header{
    display: flex; height: var(--headerhight);; line-height: 40px;
    position: fixed; top:0; left: 0; z-index: 999; width: 100%;
}
.header .header-ul{ width: 100%;position: absolute;right:0;margin: 0; padding: 0; list-style:none;}
.header .header-ul li a{ color: var(--字体); font-size: 16px; text-decoration: none;display: block; }
.header .header-ul li span{ font-size: 16px; text-decoration: none; cursor: pointer;color: var(--字体);display: block; }

.header .header-ul li svg{ position: absolute;bottom: 0;margin:0 0 -6px -8px;display: none;fill: rgba(255, 255, 255, 0.9);font-size: 20px; }
.header .header-ul .nav-activity svg{ display: inline; }

.header .header-ul li{  flex: 1; box-sizing: border-box; text-align: center;}
.header .logo-img{height: 34px; width: auto;float: left;margin: 10px 60px 10px 50px;}
.header .logo-img-white{ display: none; }
.header .other-login{  display:none;float: right; margin-right: 30px;  height: var(--headerhight); line-height: var(--headerhight);
    padding: 0 10px; }
.header-scroll .other-login{ background-color: rgb(28,111,231); }
.header .other-login span{ color: var(--字体); display: inline-block; margin:0 8px; font-size: 12px; }
.header-mobile-menu{ color: white;font-size: 30px;line-height: var(--headerhight);position: absolute;right: 10px; }
.hide-menu{ display: none; }

/*.header-bg-black{ background-color: var(--主背景-黑); }*/
.header-bg-black .header-ul li a{ color: var(--字体-黑)}
.header-bg-black .header-ul li span{color: var(--字体-黑);}
.header-bg-black .header-ul li svg{fill: var(--字体-黑);}
.header-bg-black .other-login span{ color: var(--字体-黑);  }
.header-bg-black .language-select .select-show{ color: var(--字体-黑);  }

.header-scroll{ background-color: rgba(0, 0, 0, 0.95);box-shadow: 5px 5px 10px #a3a3a3; }
.header-scroll .header-ul li a{ color: var(--字体)}
.header-scroll .header-ul li span{color: var(--字体);}
.header-scroll .header-ul li svg{fill: var(--字体);}
.header-scroll .other-login span{ color: var(--字体);  }
.header-scroll .language-select .select-show{ color: var(--字体);  }

.header-scroll .logo-img-white{ display: block; }
.header-scroll .logo-img-blue{ display: none; }


.header .ul-menu-box{
    background-color: rgba(255, 255, 255, 0.97);  border-radius: 1px;
    width: 100%;position: fixed;left: 0;top: var(--headerhight);display: none;
    height: 400px;
}
.header .ul-menu-box .ul-menu-bg{
    height: 400px;width: auto;position: absolute;bottom: 0;background-color: white;z-index: -1;
}
.header .ul-menu-box .menu-box-list{ display: none; }
.header .ul-menu-box .menu-box-content{ margin-left: 250px;margin-right: 120px;}
.header .ul-menu-box .menu-box-list .flex div{ width: 20%;max-width: 220px; }
.header .ul-menu-box .menu-box-list h4{ margin-bottom: 10px;color: #282728;cursor: pointer;font-size: 16px;font-weight: 700;margin-top: 30px; }
.header .ul-menu-box .menu-box-list .h4{ margin-bottom: 10px;color: #282728;cursor: pointer;font-size: 16px;font-weight: 700;margin-top: 36px; }

.header .ul-menu-box .menu-box-list a{ display: block;margin-top:5px;line-height: 30px;color: #282728; }
.header .ul-menu-box .menu-box-list a:hover{color: #0991f0; }
.header .ul-menu-box .menu-box-list .children-activity{color: #0991f0; }

.header .ul-menu-box .menu-box-list .fir-a{ margin-bottom: 8px;cursor: pointer;font-size: 16px;font-weight: 700;margin-top: 25px;}


/*语言切换*/
.header .language-select{position: relative;color: white;}
.header .select-show{ font-size: 14px;margin:15px 20px 0 0;cursor: pointer;height: 30px;line-height: 30px;  padding: 0 20px;}
/*.header .select-show .iconfont{ opacity: 0.5; }*/
.header .select-show .change-down{ display: none; }
.header .select-option{
    background-color: #ffffff;  display: none; width: 80%;
    text-align: left; cursor: pointer; color: #8d8d8d; padding:4px;
}
.header .select-option  .line-l{ height: 1px;width: 100%;margin: auto;background-color: #e8e8e8; }
.header .select-option .select-list{ line-height: 30px;padding-left: 4px; }
.header .select-option .select-list:hover{ color: var(--主色); }
/**  ————————————  */








/**  产品展示  */
.product-info-body .pro-list{ padding-top: 60px;padding-bottom:30px; }
.product-info-body .img-show-list{ margin: 20px 0; }
.product-info-body .img-show-list div{
    width: 80px;height: 80px;border: 1px solid #d6dbe3;border-radius: 3px;margin: 0 4px 20px 4px;cursor: pointer;
    position: relative;
}
.product-info-body .img-show{ width: 32vw;max-width: 550px; }
.product-info-body .img-show-list .img-active{ border-color: #266fe7; }
.product-info-body .img-show-list div img{ width: 100%;height: 100%; }
.product-info-body .img-show-list div span{ display: inline-block;position: absolute;margin: auto;
    background-color: rgba(230, 234, 239, 0.79);width: 50px;height: 30px;text-align: center;line-height: 30px;left: 15px;top: 25px;
    border-radius: 2px;color: rgba(0, 0, 0, 0.72);
}
.product-info-body .img-show-content{ width: 100%;height: 32vw;max-height: 550px;background-color:#f4f6f8;margin: auto; }
.product-info-body .img-bg-gray{ background-color:#eef2f7; }
.product-info-body .img-show-content img{ width: 100%;height: 100%; }
.product-info-body .model-3d-show{ display: none;width: 100%;height: 100%;background-color: white; }
.product-info-body .device-info h4{ font-size: 22px;padding-top: 10px;color: #242c34;margin-bottom: 18px;letter-spacing: 4px;}
.product-info-body .device-info .device-version{ border-bottom: 1px solid #dde3e9;padding-bottom: 40px; }
.product-info-body .device-info .device-version span{ font-size: 12px;padding:4px 12px;display: inline-block;background-color: #363f4a;
    border-radius: 2px;color: white;
}
.product-info-body .device-info p{ font-size: 16px;margin-top: 18px; }
.device-content{ font-size: 13px;line-height: 28px;letter-spacing: 2px;color: #363f4a;font-family:'siyuan-regular',sourcehansanscn-regular;
    padding: 10px 0 20px 0;width: 70%;
}
.product-info-body .device-label{margin-bottom: 70px;}
.product-info-body .device-label span{ margin-right: 10px;color: #0991f0;font-size: 13px;}
.bg-gray{ background-color: #eef2f7;padding: 20px 0 20px 0;  }
.bg-white{ background-color: #f4f6f8;padding: 20px 0 20px 0; }
.device-info{ width: 41vw;padding: 0 3vw;  margin-top: 10px;max-width: 850px;}
.device-info .iconfont{ font-size: 34px;margin-right: 18px;cursor: pointer; }
/**  ————————————  */






/***右侧浮动box**/

.float-box{   position: fixed; right: 10px;  bottom: 34%;z-index: 20;background-color: #ffffff8c; }
.float-box .float-list{
    padding:  7px 5px;background-color: #266fe7;margin-top: 1px;position: relative;
    color: white;font-size: 12px;text-align: center;cursor: pointer;
}
.float-box .float-list:first-child{ margin-top: 0; }
.float-box .float-list .iconfont{font-size: 20px;font-weight: 600; }
.float-box .float-list p{ margin: 4px 0;font-size: 12px; }
.float-box .float-list .scrolltop{ margin: 8px 0;font-size: 24px;}


.float-box .tel-content{ position: absolute;right: 60px;top: 12px; }
.float-box .float-tel-left-content{
    background-color: rgb(70,128,246);color: white;font-size: 18px;width: 160px;
    height: 34px;line-height: 34px;margin-right: 20px;border-radius: 4px;text-align: center;
    display: none;
}

.float-tel-left-content::before{
    position: absolute;
    border-bottom: 5px solid transparent;
    border-top: 5px solid transparent;
    border-left: 10px solid rgb(70,128,246);
    content: '';
    display: block;
    width: 0;
    height: 0;
    top: 12px;
    left: 160px;
}



.form-shadow{
    width: 100%;  height: 100%; display: none; position: fixed;
    top: 0; z-index: 10000; background-color: rgba(0, 0, 0, 0.15);
}
.form-shadow .sub-form{
    width: 320px;height: 460px; background-color: white;
    top: 50%; left: 50%; position: fixed; margin: -230px 0 0 -160px;
    padding: 20px; border-radius: 5px;
}
.form-shadow .sub-form .close-form{ position: absolute; right: 10px; top: 10px; cursor: pointer;font-size: 18px;padding: 6px;}
.form-shadow .sub-form h3{  text-align: center;}
.form-shadow .sub-form p{  font-size: 13px; color: #6a6a6a;}


.form-input-list{padding: 16px 0;}
.form-input-list input{
    width: 95%;border: 1px solid #e6eaef;
    outline: none;padding: 10px; border-radius: 1px;font-size: 14px;
}
.form-input-list textarea{
    width: 95%;  border: 1px solid #e6eaef; outline: none;font-size: 14px;
    padding: 10px; border-radius: 4px;resize:vertical;min-height: 60px;
}
.form-input-list button{
    width: 100%;   color: #ffffff; padding: 10px 0;  font-size: 13px;  letter-spacing: 2px;
    border-radius: 4px; cursor: pointer;border: none;
    background-color: #0991f0;
}

.form-shadow .sub-form .form-input-list{ padding: 8px 0 }

/*****----------******/







/**  底部  */
.footer{ margin: auto;background-color: rgb(7,23,47);padding-top: 40px;color: #ffffff; }
.footer .content-width{ margin: auto;}
.footer .f-abo{ width: 820px; }
.footer .f-abo .width-23{ width: 150px;}
.footer .f-abo .abo-title{ font-size: 16px;margin-bottom: 20px; }
.footer .f-abo .width-23 a{ font-size: 13px;line-height: 30px;margin:0;color: #6a7382;cursor: pointer;display: block; }
.footer .f-abo .width-23 a:hover{ color: var(--主色); }

.footer .calling-us{ width: 250px;}
.footer .calling-us .abo-title{ font-size: 16px;margin-bottom: 30px; }
.footer .calling-us p{ line-height: 40px;color: #6a7382;margin: 0; }
.footer .calling-us .call-num{font-size: 24px;color: #0a92f0; }
.footer .mp-app-download{ width: 280px; }
.footer .mp-app-download h2{ font-size: 16px;  margin: 0 0 20px 10px;font-weight: normal;}
.footer .img-box img{  width: 100px;height: 100px;position: relative;left: 50%;margin-left: -50px; }
.footer .img-box p{ margin: auto; font-size: 13px;color: #cacaca;  line-height: 24px;text-align: center;}
.footer .mp-app-download .address{ font-size: 13px;line-height: 30px;color: #6a7382;margin-top: 30px;position: absolute; }
.footer .mp-app-download .address .map-point{ margin-right: 0; }
.footer .f-bottom{ border-top: 1px solid rgba(172, 172, 172, 0.42);padding: 14px 0;color: #929292; font-size: 13px;}
.footer .f-bottom a{ border: none;color: #929292;text-decoration: none;}
.footer .f-bottom .a-spl{ padding: 0 5px; }
.footer .a-link { margin-top: 20px;color: #6a7382; }
.footer .a-link a{ color: #6a7382;}
.footer .a-more { padding-bottom: 50px; }
/**  ————————————  */




.layout-call-us .bg-txt{ margin-top: 0;color: #0000001c;z-index: -1; }


#pagelist{margin: 20px 0;text-align: center;}