/* 鍦嗚5/10/20/30/40/50/60{
	-ms-border-radius: 5px;  
	-moz-border-radius: 5px;  
	-o-border-radius: 5px;  
	-webkit-border-radius:5px;  
	border-radius: 5px;
} */

/* 閫忔槑搴?0{
	filter:alpha(opacity=50);  
	-moz-opacity:.5;  
	-webkit-opacity: .5;  
	-ms-opacity: .5;  
	-o-opacity: .5;  
	-khtml-opacity: .5;  
	opacity: .5; 
} */

/* 闃村奖{
	-webkit-box-shadow: 0 0 5px rgba(0,0,0,0.3);
	-moz-box-shadow: 0 0 5px rgba(0,0,0,0.3);
	-ms-box-shadow: 0 0 5px rgba(0,0,0,0.3);
	-o-box-shadow: 0 0 5px rgba(0,0,0,0.3);
	box-shadow: 0 0 5px rgba(0,0,0,0.3);
} */

/* 鏃嬭浆{
	transform:rotate(9deg);
	-ms-transform:rotate(9deg); 
	-moz-transform:rotate(9deg); 
	-webkit-transform:rotate(9deg); 
	-o-transform:rotate(9deg); 
} */

/* 鐗规畩绗﹀彿{
	漏  ©
	庐  ®
	<  <
	>  >
	&  &
} */

/* 寮哄埗鐏拌壊{
.gray { 
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
}

} */

/*
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@100;300;400;500;700;900&display=swap');
 *{font-family: "Noto Sans SC";} 

 */

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin: 0;padding: 0;border: 0;outline: 0; vertical-align: baseline;}
a{text-decoration: none;}
*{  font-family: "寰蒋闆呴粦","Microsoft Yahei", Arial, sans-serif;
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    -ms-box-sizing:border-box;
    -o-box-sizing:border-box;
    -webkit-box-sizing:border-box;
}
ul,li,ol{list-style: none;}
:root{
    --blue:#ff6900;
    --orange:#ff6900;

    --blueD:#e5851b;
    --blueW:#809AAE;
    --orangeD:#e5851b;

    --000:#000;
    --222:#222;
    --444:#444;
    --666:#666;
    --888:#888;
    --aaa:#aaa;
    --ccc:#ccc;
    --eee:#eee;
    --fff:#fff;
    --f3:#f3f3f3;
    --f8:#f8f8f8;
    --ae:#aeaeae;
}

.gray {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
}

/*瀛楅噸*/
.fontL{font-weight: lighter;}
.fontB{font-weight: bold;}
.fontB1{font-weight: 800;}
/*瀛楅噸 end*/

/*鎸夐挳*/

.btn{display: flex; justify-content: center; cursor: pointer;}
.btn .txt{font-size: 16px; line-height: 48px; }
.btn .icomoon{font-size: 16px;margin-left: 5px; line-height: 48px;  }


.btn-block{height: 48px; line-height: 48px;color: var(--fff);padding: 0 20px;}
.btn-block-blue{background:var(--blue);}
.btn-block-blue:hover{background:var(--blueD);}

.btn-block-orange{background:var(--orange); }
.btn-block-orange:hover{background:var(--orangeD); }

.btn-line{height: 48px; line-height: 46px;color: var(--222); border: 1px solid var(--eee);padding: 0 18px;}
.btn-line:hover{background: var(--f3);}

.btn-txt{display: inline-block;margin: 0 5px;padding: 0;}
.btn-txt .txt{ line-height: 16px;color: var(--blue);}
.btn-txt .txt:hover{
    text-decoration: underline;
}
.btn-txt .icomoon{ line-height: 16px;color: var(--blue);  }
/*鎸夐挳 end*/

/*澶嶉€?鍗曢€?/

.regular-checkbox{display:none}
.regular-checkbox+label{background-color:#fafafa;border:1px solid #cacece;box-shadow:0 1px 2px rgba(0,0,0,.05),inset 0 -15px 10px -12px rgba(0,0,0,.05);padding:9px;border-radius:3px;display:inline-block;position:relative}
.regular-checkbox+label:active,.regular-checkbox:checked+label:active{box-shadow:0 1px 2px rgba(0,0,0,.05),inset 0 1px 3px rgba(0,0,0,.1)}
.regular-checkbox:checked+label{border:1px solid #ffc339;background:#ffc339;box-shadow:0 1px 2px rgba(0,0,0,.05),inset 0 -15px 10px -12px rgba(0,0,0,.05),inset 15px 10px -12px rgba(255,255,255,.1);color:#99a1a7}
.regular-checkbox:checked+label:after{content:'\2714';font-size:14px;position:absolute;top:0;left:3px;color:#060606}
.big-checkbox+label{padding:18px}
.big-checkbox:checked+label:after{font-size:28px;left:6px}

.regular-radio{display:none}
.regular-radio+label{-webkit-appearance:none;background-color:#fafafa;border:1px solid #cacece;box-shadow:0 1px 2px rgba(0,0,0,.05),inset 0 -15px 10px -12px rgba(0,0,0,.05);padding:9px;border-radius:50px;display:inline-block;position:relative}
.regular-radio:checked+label:after{content:' ';width:12px;height:12px;border-radius:50px;position:absolute;top:3px;background:#ffc339;text-shadow:0;left:3px;font-size:32px}
.regular-radio:checked+label{color:#99a1a7;border:1px solid #adb8c0;box-shadow:0 1px 2px rgba(0,0,0,.05),inset 0 -15px 10px -12px rgba(0,0,0,.05),inset 15px 10px -12px rgba(255,255,255,.1),inset 0 0 10px rgba(0,0,0,.1)}
.regular-radio+label:active,.regular-radio:checked+label:active{box-shadow:0 1px 2px rgba(0,0,0,.05),inset 0 1px 3px rgba(0,0,0,.1)}
.big-radio+label{padding:16px}
.big-radio:checked+label:after{width:24px;height:24px;left:4px;top:4px}

/*澶嶉€?鍗曢€ end*/


/*鏍囬*/

.title{font-size: 24px;}
.mintitle{font-size: 16px;}
.maxtitle{font-size: 48px;}

/*鏍囬 end*/

/*鏉垮潡*/
.content{width: 100%;}
.main{max-width: 1200px;width:100%;margin: 0 auto;padding: 0 20px;}
/*鏉垮潡 end*/

/*--header--*/
.header{z-index:999;width:100%;background:rgba(255,255,255,0.9);position:fixed;top:0;left:0;padding:0;}
.headerfix{background:rgba(255,255,255,.9);}
.header-content{
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    padding: 0 20px;
}
.logo{padding:0;text-decoration:none;}
.logo .icomoon{
    font-size: 40px;
    color: var(--orange);
    line-height: 80px;
}
/* .logo .icomoon:hover{
    color: var(--orange);
} */
.header-right{
    display: flex;
    align-items: center;
}

.logo .logocolor{ height: 50px; margin-top: 15px; display: none;}
.logow {background: var(--fff);}
.logow .icomoon{   display: none;}
.logow .logocolor{ height: 50px; margin-top: 15px; display: block;}
.logow .nav-ul li a{color: var(--222);}
.logow .header-right .language{color: var(--222);border: 1px solid var(--222); display: inline-block}
.logow .header-right .language:hover{color: var(--fff);border: 1px solid var(--blue); background: var(--blue);}



.nav-ul{
    padding:0;
    position: relative;
    z-index: 90;
}
.nav-ul li{
    float:left;
    z-index:90;
}
.nav-ul li .nav-ul-a{font-size:16px;padding:0 20px;display:block;color:var(--444);text-decoration:none;text-align:center;float:left;line-height:80px;height:80px}
.nav-ul .current .nav-ul-a{color: var(--orange);}
.nav-ul .current .navline{height: 3px;}
.nav-content{
    width: 100%;
    position: relative;
}
.nav-sub{
    position: absolute;
    top:80px;
    left:0;
    width: 100%;
    background:rgba(255,255,255,0.9);
    height: 0;
    display: none;
    padding-bottom: 10px;
}

.nav-index{
    width: 104px;
    left: -14px;
}
.nav-sub a{
    display: block;
    padding:10px;
    color: var(--444);
    text-align: center;
}
.nav-ul li:hover .nav-sub{
    height:auto;
    display: block;
}
.nav-sub a:hover{
    color: var(--orange);
}
.header-right .language{
    display: inline-block;
    width:36px;
    height:30px;
    text-align: center;
    margin-left: 20px;
    color: var(--444);
    border: 1px solid var(--444);
    -ms-border-radius:20px;
    -moz-border-radius: 20px;
    -o-border-radius: 20px;
    -webkit-border-radius:20px;
    border-radius: 20px;
}
.header-right .language .icomm{
    text-align: center;
    font-size: 18px;
    line-height: 28px;
}
.header-right .language .icon-cart:hover{
    color: var(--orange);
}

.header-right .language:hover{
    color: var(--orange);
    border: 1px solid var(--orange);
}
.header-right .block {
    width: 48px;
    height:3px;
    z-index: -1;
    position: absolute;
    bottom: 20px;
    left: 20%;
    display: inline-block;
    background: var(--orange);
}

/*--header end--*/


/*footer*/

.footer{
    /*background: url(../images/footer-bg.jpg) no-repeat;*/
    background:#333333;
    background-size: cover;
    /*background-color: var(--000);*/
}
.footer .main{ overflow: hidden;}
.footer .footer-box{ width: 100%; padding-bottom: 110px; }

.footer-slogn-box {margin-top: 200px;overflow: hidden;}
.footer-slogn-box .maxtitle {font-size: 48px; line-height: 54px; color: var(--fff);letter-spacing:10px}
.footer-slogn-box .txt {font-size: 54px;text-transform: uppercase; color: var(--fff); line-height: 64px;margin-top: 40px;}


.footer-infon-box{overflow: hidden;width: 100%;margin-top: 120px;position: relative;}
.footer-infon-left{width: calc(100% - 500px);padding-right: 40px;float: left;position: absolute;height: 100%;}

.footer-ul-bg{overflow: hidden;}
.footer-ul-box{width: 50%; float: left;}
.footer-link-ul{width: 33.33%; float: left;}
.footer-link-ul .footer-link-li{}
.footer-link-ul .footer-link-li .footer-link-li-t{font-size: 12px; color: var(--fff);margin-bottom: 20px;line-height: 36px;}
.footer-link-ul .footer-link-li .footer-link-li-a{font-size: 12px; color: var(--ae);margin-bottom: 10px;}
.footer-link-ul .footer-link-li .footer-link-li-a:hover{text-decoration: underline;}

.copyright-box { width: 100%; position: absolute;bottom: 0;padding-right: 40px;}
.copyright-box .copyright-info{ position: absolute; left: 0;bottom: 0;}
.copyright-box .copyright-info .txt{color:var(--ae);font-size: 12px;margin-top: 10px;}
.copyright-box .copyright-info .txtlast{margin-top: 5px;}
.copyright-box .copyright-info .txtlast a{color: var(--ae);}
.copyright-box .copyright-info .web{
    border: 1px solid var(--ae);
    border-radius: 20px;
    line-height: 30px;
    padding: 0 10px;
    margin-right:8px;
    display: inline-block;
    cursor: pointer;
    color: var(--ae);
}
.copyright-box .copyright-info .web img{
    width: 20px;
    margin-right: 5px;
    vertical-align:middle;
    margin-top: -3px;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
}
.copyright-box .copyright-info .web .webimg{
    width: 16px;
}
.copyright-box .QRcode-box{width: 90px; float: right;
    position: relative;}
.copyright-box .btn-media{
    position: absolute;
    right: 120px;
    bottom: 0;
    margin-top: 20px;
    display: flex;
}
.copyright-box .btn-media a{
    margin-left: 14px;
}
.copyright-box .btn-media .icomoon{
    color:var(--ae);
}
.copyright-box .btn-media .icomoon:hover{
    color: var(--fff);
}
.copyright-box .QRcode-box .QRcode-pic-box{background: var(--fff);padding: 5px;width: 90px; height: 90px;}
.copyright-box .QRcode-box .QRcode-pic-box img{width: 100%; height: 100%;}
.copyright-box .QRcode-box .QRcode-title{font-size: 12px; color:var(--ae); text-align: center; margin-top: 5px;}


.footer-infon-right{padding-left: 40px;border-left: 1px solid var(--ae);width: 500px; float: right;}
.footer-infon-right .footer-logo{font-size: 50px; color: var(--orange); cursor: pointer;}
.footer-infon-right .footer-logo:hover{ color: var(--orange);}

.companyInfo-ul{margin-top: 40px;}
.companyInfo-ul .companyInfo-li{width: 100%;overflow: hidden;margin-top: 10px;}
.companyInfo-ul .companyInfo-li .icomoon{font-size: 16px; color:var(--ae);float: left;width: 16px;height: 16px;margin-right: 10px;display: inline-block;}
.companyInfo-ul .companyInfo-li .txt {width: calc(100% - 26px);display: inline-block;}
.companyInfo-ul .companyInfo-li .txt .cqt{width: 105px;}
.companyInfo-ul .companyInfo-li .txt .cqd{width: calc(100% - 105px);}

.companyInfo-ul .companyInfo-li .txt b{font-size: 14px; color:var(--ae);font-weight: normal;float: left;width: 45px;}
.companyInfo-ul .companyInfo-li .txt i , .companyInfo-ul .companyInfo-li .txt .btn_href{font-size: 14px; color:var(--ae);font-style: normal;float: left; width: calc(100% - 45px);}
.companyInfo-ul .addr-us{margin-top: 0;}
.companyInfo-ul .companyInfo-li .btn_href:hover{
    text-decoration: underline;
}

/*footer end*/

/*鍒嗛〉*/
.pagination{
    line-height:40px;
    overflow:hidden;
    margin: 40px auto;
    width: 80%;
    text-align:center;
    display: flex;
    align-items: center;
    justify-content: center;
}
.pagination button{
    padding:0 10px;
    margin:0 10px;
    height:26px;
    float:left;cursor:pointer;border:1px solid #eee;background:#fff;color:#060606;-ms-border-radius:2px;-moz-border-radius:2px;-o-border-radius:2px;-webkit-border-radius:2px;border-radius:2px}
.pagination button:hover{background:#f9f9f9}
.pagination .first-page,.pagination .last-page{margin:0}
.pagination .pageWrap{height:26px;float:left;overflow:hidden}
.pagination .pageWrap ul{width:100000px;height:40px;float:left}
.pagination .pageWrap ul li{
    width:38px;
    height:26px;
    float:left;
    padding: 0 6px;
}
.pagination .pageWrap ul li a{
    display:block;
    width:100%;
    height:100%;
    border:1px solid #ebebeb;
    line-height:26px;
    box-sizing:border-box;
    cursor:pointer;
    -ms-border-radius:26px;
    -moz-border-radius:26px;
    -o-border-radius:26px;
    -webkit-border-radius:26px;
    border-radius:26px;
}
.pagination .pageWrap ul li a:hover{background:var(--blue); color: var(--fff)}
.pagination .pageWrap ul .sel-page a{background:var(--blue);border:none;color: var(--fff)}
.pagination .pageWrap ul .sel-page a:hover{background:var(--blue);border:none; color: var(--fff)}
.pagination .jump-text{
    width:60px;
    height:26px;
    box-sizing:border-box;
    text-align:center;
    margin:0 5px;
    float:left;
    box-shadow:none;
    border:1px solid #eee;
    -ms-border-radius:2px;
    -moz-border-radius:2px;
    -o-border-radius:2px;
    -webkit-border-radius:2px;
    border-radius:2px;
}
.pagination .jump-button{margin:0;float:left}
.pagination .total-count,.pagination .total-pages{margin-left:10px;float:left;font-size:14px}

/*鍒嗛〉*/


/*banner*/
.flexslider{margin:0;padding:0}
.flexslider .slides>li{display:none;-webkit-backface-visibility:hidden;background: var(--f3);}
.flexslider .slides .slides-img{display:flex;align-items:center;justify-content:center;background:var(--f3); }
/* .flexslider .slides img{max-width:100%;display:block;max-height:100%} */
.no-js .slides>li:first-child{display:block}
.flexslider{margin:0 auto;position:relative;width:100%;zoom:1}
.flex-viewport{max-height:2000px;-webkit-transition:all 1s ease;-moz-transition:all 1s ease;transition:all 1s ease}
.flexslider .slides{zoom:1}
.flex-direction-nav a{width:90px;height:90px;margin:-45px 0 0;display:block;position:absolute;top:50%;z-index:10;cursor:pointer;text-indent:-9999px;background-size:90px 90px;-moz-opacity:0;-webkit-opacity:0;-ms-opacity:0;-o-opacity:0;-khtml-opacity:0;opacity:0}
.flex-direction-nav .flex-next{right:0;background:url(../images/ban_next.png) no-repeat;background-size:90px 90px}
.flex-direction-nav .flex-prev{left:0;background:url(../images/ban_pre.png) no-repeat;background-size:90px 90px}
.flexslider:hover .flex-next{background:rgba(0,0,0,.3) url(../images/ban_next.png) no-repeat;background-size:90px 90px}
.flexslider:hover .flex-prev{background:rgba(0,0,0,.3) url(../images/ban_pre.png) no-repeat;background-size:90px 90px}
.flexslider:hover .flex-next:hover{background:rgba(0,0,0,.5) url(../images/ban_next.png) no-repeat;background-size:90px 90px}
.flexslider:hover .flex-prev:hover{background:rgba(0,0,0,.5) url(../images/ban_pre.png) no-repeat;background-size:90px 90px}
.flexslider:hover .flex-direction-nav a{-moz-opacity:1;-webkit-opacity:1;-ms-opacity:1;-o-opacity:1;-khtml-opacity:1;opacity:1}
.flex-control-nav{width:100%;position:absolute;bottom:10px;text-align:center;padding:0;font-size:0;z-index: 9;}
.flex-control-nav li{margin:0 5px;display:inline-block;zoom:1}
.flex-control-paging li a{background:rgba(255,255,255,.2);display:block;height:4px;overflow:hidden;text-indent:-99em;width:60px;cursor:pointer;
    -ms-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    -webkit-border-radius:5px;
    border-radius: 5px;
}
.flex-control-paging li a.flex-active{background:var(--fff)}
/*--寮曞鎸夐挳--*/
.hovertree-upslide {
    position: absolute;
    display:inline-block;
    left:0px;
    right:0px;
    bottom:0px;
    margin-left:auto;
    margin-right:auto;

    width: 20px;
    height: 20px;
    z-index: 99;
    animation: hovertreemove 1.5s infinite ease-in-out;
    -webkit-animation: hovertreemove 1.5s infinite ease-in-out;
    /* background-image:url(http://hovertree.com/texiao/css3/29/hovertreeup.png); */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}
.hovertre-none{
    display: none;
}

@keyframes hovertreemove {
    0% {
        opacity: 0.1;
        transform: translate3d(0,8px,0);
    }
    50% {
        opacity: 1;
        transform: translate3d(0,-8px,0);
    }
    100% {
        opacity: 0.1;
        transform: translate3d(0,-16px,0);
    }
}
@-webkit-keyframes hovertreemove {
    0% {
        opacity: 0.1;
        -webkit-transform: translate3d(0,8px,0);
    }
    50% {
        opacity: 1;
        -webkit-transform: translate3d(0,-8px,0);
    }
    100% {
        opacity: 0.1;
        -webkit-transform: translate3d(0,-16px,0);
    }
}
/*banner end*/


/*index*/

.index-banner-box{height: 100vh;}
.index-banner-box .slides-img{position: relative;overflow: hidden; height: 100vh;}
.index-banner-box .text-box{
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.index-banner-box .text-box .maxtitle{font-size: 64px; color: var(--fff); line-height: 72px;letter-spacing:10px}
.index-banner-box .text-box .txt{font-size: 64px; color: var(--fff); text-transform: uppercase; line-height: 72px;margin-top: 40px;}
.index-banner-box .flex-control-nav{bottom:60px;}


/*.index-miyi {margin-top: 80px;}*/
.index-miyi .main{overflow: hidden; }
.miyi-pic{width: 1032px;height: 367px;position: relative;z-index: 2; float: left; background: var(--f3);}
.miyi-box{float: right; position: relative;margin-top: -260px; width: calc(100% - 160px);  background: var(--fff);padding: 60px;z-index: 3; margin-right: 24px;margin-bottom: 5px;
    -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.1);
    -moz-box-shadow: 0 0 5px rgba(0,0,0,0.1);
    -ms-box-shadow: 0 0 5px rgba(0,0,0,0.1);
    -o-box-shadow: 0 0 5px rgba(0,0,0,0.1);
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
}
.miyi-box .maxtitle{font-size: 48px;color: var(--222);}
.miyi-box .text-box{margin-top: 20px; overflow: hidden; padding-right: 80px;}
.miyi-box .text-box .text{margin-bottom: 20px;font-size: 16px; line-height:30px;color: var(--222);}
.miyi-box .text-box .btn-txt{font-size: 16px; color: var(--blue); text-align: right;float: right; margin-top: 40px;}
.miyi-box .text-box .btn-txt .txt{text-decoration: none;}
.miyi-box .text-box .btn-txt:hover .txt{color: var(--blueD); text-decoration: underline;}
.miyi-box .text-box .btn-txt:hover .icomoon{color: var(--blueD);}
.miyi-box .text-box .btn-block-blue{position: absolute; right: -24px; top: 50%; transform: translate(0,-50%);width: 48px;}
.miyi-box .watermark{font-size: 48px; color:rgba(0,0,0,0.1); text-transform: uppercase;}

.index-brand-top{
    background: var(--f3);
    height: 364px;
}
.index-brand {position: relative;}
.index-brand-logo{
    margin-top: 80px;
}
.index-brand .brand-bg {width: 100%;height: 100%;}
.index-brand .maxtitle {
    width: 100%;
    height: 100%;
    position: absolute;
    display: flex;align-items: center;justify-content: center;
    flex-direction: column;

    font-size: 48px; color: var(--fff); text-align: center; top: 0%; left: 0%;}


.brand-ul{overflow: hidden; text-align: center;}
.brand-ul .brand-li{  display: inline-block;margin: 0 40px; padding: 10px 20px;overflow: hidden; width: 340px; border: 1px solid var(--fff); }
.brand-ul .brand-li:hover{
    /*border: 1px solid var(--eee);*/
    /*background: var(--f8);*/
    -ms-border-radius: 10px;
    -moz-border-radius:  10px;
    -o-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius:  10px;
}
.brand-ul .brand-li:hover img{
    transform:scale(1.2);
    -ms-transform:scale(1.2);
    -moz-transform:scale(1.2);
    -webkit-transform:scale(1.2);
    -o-transform:scale(1.2);
}
.brand-ul .brand-li a{  display: block; display: flex;align-items: center;justify-content: center;height: 80px;position: relative;}
/*.brand-ul .brand-li a img{ position: absolute; top: 50%;left: 50%; transform: translate(-50%,-50%);}*/
.brand-ul .brand-li-AstroAI img{ height:46px; }
.brand-ul .brand-li-Hicozy img{ height: 40px; }



.index-new{overflow: hidden;background: var(--f8); padding: 80px 0;}

.index-new .maxtitle {text-align: center;font-size: 48px; color: var(--222);}
.index-new .btn-box { overflow: hidden;}
.index-new .btn-txt { text-align: right; float: right;margin-top: 20px;}

.index-new-ul {overflow: hidden; margin-top: 40px;}
.index-new-ul .index-new-li {width: calc((100% - 160px) / 3); float: left;margin-left: 80px;}
.index-new-ul .index-new-li:first-child { margin-left: 0;}


.index-new-ul .index-new-li .pic-box{overflow: hidden;display: flex;align-items: center;justify-content: center;flex-direction: column;background:var(--f3);}
.index-new-ul .index-new-li .pic-box img{ width: 100%; height: 100%;}
.index-new-ul .index-new-li:hover .pic-box img{
    transform:scale(1.1);
    -ms-transform:scale(1.1);
    -moz-transform:scale(1.1);
    -webkit-transform:scale(1.1);
    -o-transform:scale(1.1);
}
.index-new-ul .index-new-li .time{font-size: 14px; color: var(--222);margin-top: 20px;}
.index-new-ul .index-new-li .title{font-size: 16px; color: var(--222); line-height: 24px; max-height: 48px;margin-top: 10px;font-size: 18px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
}
.index-new-ul .index-new-li .index-new-a{display: block;}
.index-new-ul .index-new-li:hover .time{color: var(--blue);}
.index-new-ul .index-new-li:hover .title{color: var(--blue); text-decoration: underline;}


/*index end*/


/*--灏忔爣棰?-*/
.about-title{
    font-size:30px;
    color: var(--222);
    font-weight: normal;
}
.about-title .title-eng{
    font-size:32px;
    color: var(--blue);
    text-transform: uppercase;
}
.about-title .line{
    display: block;
    width: 120px;
    height: 4px;
    border-radius: 4px;
    background: var(--blue);
    margin-top:5px;
}
/*--灏忔爣棰 end--*/

/*--about-us--*/

/*banner*/
.about-banner{
    height: 700px;
    position: relative;
    background: url("../images/about/banner.jpg") center center no-repeat;
    background-size: cover;
    background-color:var(--000);
}
.about-banner .about-title{
    position: absolute;
    bottom:140px;
    font-size: 64px;
    color: var(--fff);
    line-height:80px;
}
/*banner end*/

/*--蹇€熷鑸?-*/
.nav-about ul{
    display: flex;
    justify-content: space-between;
    width: 50%;
    margin: 0 auto;
    margin-top: 80px;
    margin-bottom:10px;
}
.nav-about ul li{
    position: relative;
}
.nav-about ul li a{
    font-size: 24px;
    color: var(--222);
}
.title-tab li .line {
    position: absolute;
    bottom: -10px;
    display: block;
    width:100%;
    height:0px;
    margin-top: 10px;
    background: var(--blue);
    -ms-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}
.nav-about .title-tab li:hover .line{
    height:3px;
}
/*--蹇€熷鑸?-*/

/*楹︿竴浠嬬粛*/
.about-introduce{
    width: 100%;
    height: 825px;
    position: relative;
    background: url("../images/about/astroai-bg.jpg") no-repeat   center;
    /* background-size: cover; */
    background-color:var(--f3);
}
.about-introduce-content{
    height: 825px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.about-introduce-content .about-title .title-eng{
    text-transform: none;
}
.about-introduce-content .about-title{
    width: calc(100% - 60%);
    display: block;
    margin-top: -80px;
}
.about-introduce-content .about-introduce-right{
    width: calc(100% - 30%);
}
.about-introduce-content .about-introduce-right p{
    margin-top: 30px;
    font-size: 16px;
    color: var(--222);
    line-height: 30px;
}
.about-introduce-content .about-title{
    font-size: 46px;
}
/*楹︿竴浠嬬粛 end*/

/*浼佷笟鎰挎櫙*/
.about-vision .mySwiper {
    width: 100%;
    height: 830px;
    background:var(--aaa);
    position: relative;
}
.about-vision .mySwiper .swiper-slide {
    width: 86%;
    height:100%;
    /*position: relative;*/
    border-right: 1px solid #111;
    background-size: cover;
    background-color:var(--000);
}
.about-vision .mySwiper .about-vision-content{
    height: 100%;
    margin: 0 auto;
    position: absolute;
    left: 0;
    width:116.3%;
    /*border: 1px solid red;*/
    display: none;
    padding:0 20px;
    padding-top: 130px;
    z-index: 999;
}
.about-vision .mySwiper .about-vision-content .aboutent{
    /*background: #060606;*/
    max-width: 1192px;
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
    /*border: 1px solid red;*/
}
.about-vision .mySwiper .swiper-slide-active .about-vision-content{
    display: block!important;
}
.about-vision-content .about-vision-right{
    position: absolute;
    right:10px;
    z-index: 999;
    top: 0!important;
}
.about-vision-content .about-vision-right .vision-num{
    padding-top:98px;
}
.about-vision .mySwiper .btn-next{
    width: 100%;
    margin: 0 auto;
    height: 80px;
    position: absolute;
    bottom:50px;
    left:0;
    z-index: 99;
}
.about-vision .mySwiper .about-vision-title{
    font-size: 28px;
    color: var(--fff);
    line-height:40px;
}
.about-vision .mySwiper .btn-right{
    cursor: pointer;
}
.about-vision .mySwiper .about-vision-title .icomoon{
    font-size: 18px;
}
.about-vision .mySwiper .about-vision-title .titletext{
    font-size: 18px;
}
.about-vision .mySwiper .about-vision-zhong {
    margin-top:110px;
}
.about-vision .mySwiper .vision-num{
    font-size:42px;
    color: var(--fff);
    margin-top: 20px;
}
.about-vision-content .label{
    display: block;
    color: var(--fff);
}
.about-vision-content .vision-label-last{
    margin-top:100px;
}
.about-vision-content .vision-line{
    margin-top: 10px;
    width: 200px;
    height: 4px;
    background: var(--fff);
}
.about-vision-content .text{
    font-size: 12px;
    color: var(--fff);
    margin-top: 20px;
    line-height: 26px;
    font-weight: lighter;
}
.about-vision-content .vision-label{
    font-size: 48px;
    letter-spacing: 2px;
}
.about-vision-content .min-vision-label{
    font-size:30px;
    line-height: 48px;
}
.about-vision-content .vision-text{
    font-size: 30px;
    line-height: 50px;
}
.about-vision-content .vision-two{
    font-size: 24px;
}
.about-vision-left .values{
    display: flex;
    justify-content: space-between;
    margin-top:60px;
}
.about-vision-left .values li{
    list-style:inherit;
}
.about-vision-left .values li label{
    color: var(--fff);
    font-size: 30px;
}
.about-vision-zhong .labeltext{
    color: var(--fff);
    font-size: 22px;
    line-height:36px;
    margin-top: 50px;
}
.about-vision-left .values li .text{
    font-size: 14px;
    line-height: 30px;
    color: var(--f3);
    margin-top: 40px;
}
.about-vision .mySwiper .btn-next .btn-next-content{
    width: 100%;
    height: 80px;
    position: relative;
}
.btn-nextline{
    position: absolute;
    top: 50%;
    left: 4%;
    width:92%;
    height: 1px;
    background: var(--fff);
    text-align: center;
}
.btn-nextline img{
    margin-top: -32px;
}
.btn-nextline-right{
    position: absolute;
    top: 50%;
    right:-30%;
    width:32%;
    height: 1px;
    background: var(--fff);
    text-align: center;
}
.swiper-button-left{
    right: 30px;
}
.swiper-button-right{
    left: 30px;
}
.swiper-button-left:after{
    content: url("../images/about/vision-right.svg");
    width: 50px;
    height: 50px;
}
.swiper-button-right:after{
    content: url("../images/about/vision-left.svg");
    width: 50px;
    height: 50px;
}
/*浼佷笟鎰挎櫙 end*/

/*--浼佷笟鎰挎櫙1--*/
.desktop-wrapper {
    display: flex;
    justify-content: center;
    overflow: hidden;
    position: relative;
    background: var(--000);
}
.desktop-wrapper .btn-next{
    position: absolute;
    bottom:40px;
    left: 0;
    z-index: 1;
}
.desktop-wrapper  .btn-next .btn-next-content{
    width: 100%;
    height: 80px;
    position: relative;
}
.desktop-wrapper .btn-nextline{
    position: absolute;
    top: 50%;
    left: 3%;
    width:120%;
    height: 1px;
    background: var(--fff);
    text-align: center;
}
.desktop-wrapper .btn-nextline img{
    margin-top: -32px;
    margin-left: -22%;
}
.desktop-wrapper .swiper-button-left{
    right: 30px;
}
.desktop-wrapper .swiper-button-right{
    left: 30px;
}
.desktop-wrapper .swiper-button-left:after{
    content: url("../images/about/vision-right.svg");
    width: 50px;
    height: 50px;
}
.desktop-wrapper .swiper-button-right:after{
    content: url("../images/about/vision-left.svg");
    width: 50px;
    height: 50px;
}
.desktop-wrapper .options {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    overflow: hidden;
    min-width: 600px;
    width: 100%;
    height: 800px;
    /*border: 1px solid red;*/
}

.desktop-wrapper .options .option {
    position: relative;
    overflow: hidden;
    min-width:190px;
    background-repeat: no-repeat;
    cursor: pointer;
    transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
    color:var(--fff);
}

.desktop-wrapper .options .option.active {
    flex-grow: 10000;
    -webkit-transition-property: all;
    -moz-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.desktop-wrapper .options .option.active>.option-bg {
    z-index: 1;
}

.desktop-wrapper .options .option.active>.option-bg .info-wrapper {
    z-index: 999;
}

.desktop-wrapper .options .option.active>.option-bg .info-wrapper .title {
    /*font-size: 1.953rem;*/
    text-transform: uppercase;
    /*line-height: 1;*/
    opacity: 1;
    position: relative;
    /*margin: 0 0 .5rem;*/
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    transition-property: opacity;
    -webkit-transition-duration: 0.2s;
    -moz-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-transition-delay: 0.2s;
    -moz-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.desktop-wrapper .options .option.active>.option-bg .info-wrapper .subtitle {
    color: var(--fff);
    font-size: .9rem;
    letter-spacing: .035rem;
    line-height: 1.125;
    margin: 0;
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    transition-property: opacity;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-transition-delay: 0.5s;
    -moz-transition-delay: 0.5s;
    transition-delay: 0.5s;
}

.desktop-wrapper .options .option.active>.option-bg .info-wrapper .description {
    left: 0px;
    opacity: 1;
    margin-top: 1.5rem;
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    transition-property: opacity;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-transition-delay: 0.6s;
    -moz-transition-delay: 0.6s;
    transition-delay: 0.6s;
}

.desktop-wrapper .options .option.active>.option-bg .info-wrapper .description p {
    line-height: 1.5;
    margin-bottom: 1.5rem;
}

.desktop-wrapper .options .option.active>.option-bg .info-wrapper .ext-link {
    text-decoration: none;
    width: 6rem;
    color: #e9ecef;
    text-shadow: 1px 2px 4px rgba(33, 37, 41, 0.5);
    box-shadow: 2px 2px 4px rgba(33, 37, 41, 0.3);
    background: rgba(255, 255, 255, 0.1);
    padding: .35rem .75rem;
    position: relative;
    overflow: hidden;
    transition: all 0.2s linear 0s;
}

.desktop-wrapper .options .option.active>.option-bg .info-wrapper .ext-link:after {
    position: absolute;
    transition: .3s;
    content: '';
    width: 0;
    left: 0;
    bottom: 0;
    height: .15rem;
    background: rgba(255, 255, 255, 0.2);
}

.desktop-wrapper .options .option.active>.option-bg .info-wrapper .ext-link:hover {
    text-shadow: none;
    box-shadow: 3px 3px 8px rgba(33, 37, 41, 0.6);
    background: rgba(255, 255, 255, 0.15);
    color:var(--fff);
}

.desktop-wrapper .options .option.active>.option-bg .info-wrapper .ext-link:hover:after {
    left: 0;
    width: 100%;
}

.desktop-wrapper .options .option:not(.active) {
    flex-grow: 1;
    /*filter: grayscale(70%);*/
}

.desktop-wrapper .options .option:not(.active):hover {
    /*filter: grayscale(0%);*/
}

.desktop-wrapper .options .option:not(.active):hover>.option-bg:before {
    background: rgba(2, 24, 31, 0.5);
}

.desktop-wrapper .options .option:not(.active)>.option-bg .description{
    opacity: 0;
}


.desktop-wrapper .options .option:not(.active)>.option-bg:before {
    background: rgba(52, 58, 64, 0);
    content: "";
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transition-property: all;
    -moz-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.2s;
    -moz-transition-duration: 0.2s;
    transition-duration: 0.2s;
}

.desktop-wrapper .options .option>.option-bg {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    position: absolute;
    top: 0;
    left: 0;
    transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
}

.options> :nth-child(1) {
    background-color: #515272;
    background-image: url("../images/about/vision-1.jpg");
    background-position: center center;
    background-size: cover;
}

.options> :nth-child(2) {
    background-color: #6c3f31;
    background: url("../images/about/vision-2.jpg") no-repeat center/cover;
    background-position: center center;
    background-size: cover;
}

.options> :nth-child(3) {
    background-color: #323119;
    background-image: url("../images/about/vision-3.jpg") ;
    background-position: center center;
    background-size: cover;
}

.mobile-wrapper {
    height: initial;
    max-width: 320px;
    margin: 0 auto;
}

.mobile-wrapper .options {
    position: relative;
    height: auto;
    max-width: none !important;
    flex-basis: 100% !important;
}

.mobile-wrapper .options .option {
    position: relative;
    overflow: hidden;
    background-size: auto 120%;
    background-position: center;
    transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
    color:var(--fff);
}

.mobile-wrapper .options .option>.option-bg {
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    width: 100%;
    padding: 2rem 1rem 1rem;
    top: 0;
    left: 0;
    transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
}

.mobile-wrapper .options .option>.option-bg .info-wrapper {
    z-index: 999;
}

.mobile-wrapper .options .option>.option-bg .info-wrapper .title {
    font-size: 1.5rem;
    text-shadow: 1px 2px 4px rgba(33, 37, 41, 0.5);
    text-transform: uppercase;
    line-height: 1;
    opacity: 1;
    position: relative;
    margin: 0 0 .5rem;
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    transition-property: opacity;
    -webkit-transition-duration: 0.2s;
    -moz-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-transition-delay: 0.2s;
    -moz-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.mobile-wrapper .options .option>.option-bg .info-wrapper .subtitle {
    color:var(--fff);
    font-size: .8rem;
    letter-spacing: .06rem;
    line-height: 1.125;
    margin: 0;
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    transition-property: opacity;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-transition-delay: 0.5s;
    -moz-transition-delay: 0.5s;
    transition-delay: 0.5s;
}

.mobile-wrapper .options .option>.option-bg .info-wrapper .description {
    left: 0px;
    opacity: 1;
    margin-top: 1.5rem;
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    transition-property: opacity;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-transition-delay: 0.6s;
    -moz-transition-delay: 0.6s;
    transition-delay: 0.6s;
}

.mobile-wrapper .options .option>.option-bg .info-wrapper .description p {
    line-height: 1.5;
    margin-bottom: 1.5rem;
}

.mobile-wrapper .options .option>.option-bg .info-wrapper .ext-link {
    text-decoration: none;
    width: 6rem;
    color: #e9ecef;
    text-shadow: 1px 2px 4px rgba(33, 37, 41, 0.5);
    box-shadow: 2px 2px 4px rgba(33, 37, 41, 0.3);
    background: rgba(255, 255, 255, 0.1);
    padding: .35rem .75rem;
    position: relative;
    overflow: hidden;
    transition: all 0.2s linear 0s;
}

.mobile-wrapper .options .option>.option-bg .info-wrapper .ext-link:after {
    position: absolute;
    transition: .3s;
    content: '';
    width: 0;
    left: 0;
    bottom: 0;
    height: .15rem;
    background: rgba(255, 255, 255, 0.2);
}

.mobile-wrapper .options .option>.option-bg .info-wrapper .ext-link:hover {
    text-shadow: none;
    box-shadow: 3px 3px 8px rgba(33, 37, 41, 0.6);
    background: rgba(255, 255, 255, 0.15);
    color: var(--fff);
}

.mobile-wrapper .options .option>.option-bg .info-wrapper .ext-link:hover:after {
    left: 0;
    width: 100%;
}

.mobile-wrapper .options .option>.option-bg:before {
    content: "";
    position: absolute;
    height: 100%;
    width: 101%;
    top: 0;
    left: 0;
    z-index: 1;
    background: rgba(52, 58, 64, 0.7);
    -webkit-transition-property: all;
    -moz-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.2s;
    -moz-transition-duration: 0.2s;
    transition-duration: 0.2s;
}

.container .row h4:first-of-type {
    text-align: center;
    margin: 0 auto;
    padding-bottom: 1rem;
}
/*--浼佷笟鎰挎櫙1 end--*/

/*--浼佷笟鎰挎櫙2--*/

/* 鎰挎櫙 */
.about-vision{position: relative;}
.vision-bg{position: relative;width: 100%;}
.about-vision .min-tilte{font-size: 24px; color: var(--222);position: absolute; top: 80px;}

.vision-mian{position: absolute; top: 50%;transform: translate(0,-50%);z-index: 1;}

.about-vision .about-vision-title{font-size: 48px; color: var(--222);}
.about-vision .about-vision-info{font-size: 48px; color:var(--blue); text-transform: uppercase;margin-top: 20px;}
.about-vision .about-vision-text{font-size: 16px; color: var(--222);margin-top: 20px;}

/* 浣垮懡 */
.about-mission{position: relative;}
.mission-bg{position: relative;width: 100%;}
.about-mission .min-tilte{font-size: 24px; color: var(--222);position: absolute; top: 80px;}

.mission-mian{position: absolute; top: 50%;transform: translate(0,-50%);z-index: 1;background: rgba(255,255,255,.7);margin-left: -40px;padding: 40px;}
.about-mission .about-mission-title{font-size: 48px; color:var(--blue);}
.about-mission .about-mission-info{font-size: 36px; color: var(--222); text-transform: uppercase;margin-top: 20px;}
.about-mission .about-mission-text{font-size: 16px; color: var(--222);margin-top: 20px;}

/* 鏍稿績浠峰€艰 */

.about-values{padding: 80px 0 0 0; background:var(--fff);
    position: relative;}
.about-values .min-tilte{font-size: 24px; color: var(--222);   }

.portfolio-items{height:400px;overflow-x:scroll;overflow-y:hidden;white-space:nowrap;margin-bottom:30px;position:relative}
.portfolio-items>li{display:inline-block;vertical-align:top}
.item{width:270px;height:202px;margin:120px 40px 0 0;padding:5px;background:#fafafa;font-size:14px;position:relative;top:-300px;


    filter:alpha(opacity=0);  
    -moz-opacity:0;  
    -webkit-opacity: 0;  
    -ms-opacity: 0;  
    -o-opacity: 0;  
    -khtml-opacity: 0;  
    opacity: 0; 

    -ms-border-radius: 2px;  
    -moz-border-radius: 2px;  
    -o-border-radius: 2px;  
    -webkit-border-radius:2px;  
    border-radius: 2px;

    -webkit-transform:rotate(-135deg);
    -ms-transform:rotate(-135deg);
    -o-transform:rotate(-135deg);
    transform:rotate(-135deg);
    
}

.item:nth-child(1){
    -webkit-transition:all .3s ease,opacity 2s ease,top 1s ease;
    -o-transition:all .3s ease,opacity 2s ease,top 1s ease;
    transition:all .3s ease,opacity 2s ease,top 1s ease;
}
.item:nth-child(2){
    -webkit-transition:all .3s ease,opacity 2s ease,top 1.3s ease;
    -o-transition:all .3s ease,opacity 2s ease,top 1.3s ease;
    transition:all .3s ease,opacity 2s ease,top 1.3s ease;
}

.item:nth-child(3){
    -webkit-transition:all .3s ease,opacity 2s ease,top 1.6s ease;
    -o-transition:all .3s ease,opacity 2s ease,top 1.6s ease;
    transition:all .3s ease,opacity 2s ease,top 1.6s ease;
}
.item:nth-child(4){
    -webkit-transition:all .3s ease,opacity 2s ease,top 1.9s ease;
    -o-transition:all .3s ease,opacity 2s ease,top 1.9s ease;
    transition:all .3s ease,opacity 2s ease,top 1.9s ease;
}
.item:nth-child(5){
    -webkit-transition:all .3s ease,opacity 2s ease,top 2.2s ease;
    -o-transition:all .3s ease,opacity 2s ease,top 2.2s ease;
    transition:all .3s ease,opacity 2s ease,top 2.2s ease;
}
.item:nth-child(6){
    -webkit-transition:all .3s ease,opacity 2s ease,top 2.5s ease;
    -o-transition:all .3s ease,opacity 2s ease,top 2.5s ease;
    transition:all .3s ease,opacity 2s ease,top 2.5s ease;
}
.item:nth-child(7){
    -webkit-transition:all .3s ease,opacity 2s ease,top 2.8s ease;
    -o-transition:all .3s ease,opacity 2s ease,top 2.8s ease;
    transition:all .3s ease,opacity 2s ease,top 2.8s ease;
}






.item:hover{height:270px; -webkit-transform:translateY(-68px);-ms-transform:translateY(-68px);-o-transform:translateY(-68px);transform:translateY(-68px)}
.item:hover .date{bottom:auto; top: 50px;transform: translate(0, 0); left: 20px;
    /* -webkit-transform:translate3d(0,61px,0);
    -ms-transform:translate3d(0,61px,0);
    -o-transform:translate3d(0,61px,0);
    transform:translate3d(0,61px,0); */
}
.item:hover .figcaption{-webkit-animation:show .25s ease-in .12s forwards;-o-animation:show .25s ease-in .12s forwards;animation:show .25s ease-in .12s forwards}
.item:hover p:nth-of-type(1) span{-webkit-animation:slideOut .25s ease-out .15s forwards;-o-animation:slideOut .25s ease-out .15s forwards;animation:slideOut .25s ease-out .15s forwards}
.item:hover p:nth-of-type(2) span{-webkit-animation:slideOut .2s ease-out .3s forwards;-o-animation:slideOut .2s ease-out .3s forwards;animation:slideOut .2s ease-out .3s forwards}
.item:hover .view { text-align: right;height:170px;margin: 0;}
.item:hover .view .icomm{margin-right: -35px; color: #ff690029;font-size: 120px;}

.item:hover .view img{top:-20px;left:-20px}
.item .view .icomm{font-size: 100px; color: var(--blue);}
.falldown{top:0;opacity:1;-webkit-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0)}
.figure{width:100%;height:100%;padding: 0;margin: 0;}
.view{overflow:hidden;width:100%;height:100%;position:relative;text-align: center;margin-top: 15px;
    -webkit-transition:-webkit-transform .5s cubic-bezier(.12,1.6,.91,.92);
    -o-transition:-o-transform .5s cubic-bezier(.12,1.6,.91,.92);
    transition:-webkit-transform .5s cubic-bezier(.12,1.6,.91,.92);
    transition:-ms-transform .5s cubic-bezier(.12,1.6,.91,.92);
    transition:-o-transform .5s cubic-bezier(.12,1.6,.91,.92);
    transition:transform .5s cubic-bezier(.12,1.6,.91,.92);
}
.view img{width:300px;height:190px;-webkit-transition:width .3s ease;-o-transition:width .3s ease;transition:width .3s ease;position:absolute}

.figcaption{height:160px;width:calc(100% - 40px);padding:0;position:absolute;bottom:0;overflow:hidden;opacity:0;padding-left: 20px; margin-left: 27px; }
.figcaption li{line-height:25px!important;text-transform:uppercase;padding:0;margin:5px 0;width:100%;color:var(--222); list-style-type: disc;padding-right: 10px;}

.figcaption span{ word-break:break-all;white-space: pre-wrap;width: 100%;}
.figcaption a{color:var(--blue)}
.figure .line{display:block;background: var(--blue);width: 60px; height: 3;float: left; top: 70px;position: absolute;}

.portfolio-items>li:hover .figure .line{top: 100px; height: 3px; left: 40px;}


.date{z-index:1;padding: 0 20px; height:30px;line-height:30px;color:var(--blue); text-align:center;border-radius:1px;background-color:none;border: 1px solid var(--blue);position:absolute;bottom:30px;left:15px;left: 50%;transform: translate(-50%, 0);
    -ms-border-radius: 90px;  
    -moz-border-radius: 90px;  
    -o-border-radius: 90px;  
    -webkit-border-radius: 90px;  
    border-radius: 90px;
    -webkit-transition:-webkit-transform .5s cubic-bezier(.12,1.6,.91,.92);
    -o-transition:-o-transform .5s cubic-bezier(.12,1.6,.91,.92);
    transition:-webkit-transform .5s cubic-bezier(.12,1.6,.91,.92);
    transition:-ms-transform .5s cubic-bezier(.12,1.6,.91,.92);
    transition:-o-transform .5s cubic-bezier(.12,1.6,.91,.92);
    transition:transform .5s cubic-bezier(.12,1.6,.91,.92);
}
@keyframes slideOut{
    0%{left:-100%;opacity:0}
    95%{left:0;opacity:.2}
    100%{opacity:1;left:0}
}
@-webkit-keyframes slideOut{
    0%{left:-100%;opacity:0}
    95%{left:0;opacity:.2}
    100%{opacity:1;left:0}
}
@-o-keyframes slideOut{
    0%{left:-100%;opacity:0}
    95%{left:0;opacity:.2}
    100%{opacity:1;left:0}
}
@keyframes show{
    to{opacity:1}
}
@-webkit-keyframes show{
    to{opacity:1}
}
@-o-keyframes show{
    to{opacity:1}
}
.about-values ::-webkit-scrollbar{width:7px;height:3px;cursor:pointer}
.about-values ::-webkit-scrollbar-track{background:var(--eee);border-radius:10px}
.about-values ::-webkit-scrollbar-thumb{border-radius:10px;background-color:var(--blue)}

/**/
.item {
    height: 270px;
    -webkit-transform: translateY(-68px);
    -ms-transform: translateY(-68px);
    -o-transform: translateY(-68px);
    transform: translateY(-68px);
}
.item:hover{margin-top: 80px;}
.item .date {bottom: auto;top: 50px;transform: translate(0, 0);left: 20px;}
.item .view {text-align: right;height: 170px;margin: 0;}
.item .view .icomm {margin-right: -35px;color: #ff690029;font-size: 120px;}
.portfolio-items>li .figure .line {top: 100px;height: 3px;left: 40px;}
.item .figcaption {
    -webkit-animation: show .25s ease-in .12s forwards;
    -o-animation: show .25s ease-in .12s forwards;
    animation: show .25s ease-in .12s forwards;
}

/* .item:hover .date {bottom: auto;top: 50px;transform: translate(0, 0);left: 20px;}
.item:hover .view {text-align: right;height: 170px;margin: 0;}
.item:hover .view .icomm {margin-right: -35px;color: #ff690029;font-size: 120px;}
.portfolio-items>li:hover .figure .line {top: 100px;height: 3px;left: 40px;}
.item:hover .figcaption {
    -webkit-animation: show .25s ease-in .12s forwards;
    -o-animation: show .25s ease-in .12s forwards;
    animation: show .25s ease-in .12s forwards;
} */


/** end/

/*--鏍稿績浠峰€艰--*/
.mouse-main{
    margin: 0 auto;
    text-align: center;
    /*position: absolute;*/
    /*bottom: 10px;*/
    /*left: 50%;*/
    /*transform: translate(-50%,0);*/
}
.mouse-text {
    margin-top:15px;
    font-size: 12px;
    letter-spacing: 12px;
    text-indent: 12px;
    color:var(--eee);
    /*-webkit-animation: colorText 5s ease-out infinite, nudgeText 5s ease-out infinite;*/
    /*animation: colorText 5s ease-out infinite, nudgeText 5s ease-out infinite;*/
}

.mouse {
    /*background: var(--blue) linear-gradient(transparent 0%, transparent 50%, #ffffff 50%, #ffffff 100%);*/
    position: relative;
    width: 22px;
    height: 32px;
    border-radius: 100px;
    background-size: 100% 200%;
    -webkit-animation: colorSlide 5s linear infinite, nudgeMouse 5s ease-out infinite;
    animation: colorSlide 5s linear infinite, nudgeMouse 5s ease-out infinite;
    margin: 0 auto;
}

.mouse:before, .mouse:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
}

.mouse:before {
    width: 18px;
    height:28px;
    background-color: #eaeaea;
    border-radius: 100px;
}

.mouse:after {
    background-color: var(--orange);
    width: 4px;
    height:4px;
    border-radius: 100%;
    -webkit-animation: trackBallSlide 5s linear infinite;
    animation: trackBallSlide 5s linear infinite;
}

@-webkit-keyframes colorSlide {
    0% { background-position: 0% 100%; }
    20% { background-position: 0% 0%; }
    21% { background-color:var(--blue); }
    29.99% { background-color: #ffffff; background-position: 0% 0%; }
    30% { background-color: var(--blue); background-position: 0% 100%; }
    50% { background-position: 0% 0%; }
    51% { background-color: var(--blue); }
    59% { background-color: #ffffff; background-position: 0% 0%; }
    60% { background-color: var(--blue); background-position: 0% 100%; }
    80% { background-position: 0% 0%; }
    81% { background-color: var(--blue); }
    90%, 100% { background-color: #ffffff; }
}

@keyframes colorSlide {
    0% { background-position: 0% 100%; }
    20% { background-position: 0% 0%; }
    21% { background-color: var(--blue); }
    29.99% { background-color: #ffffff; background-position: 0% 0%; }
    30% { background-color: var(--blue); background-position: 0% 100%; }
    50% { background-position: 0% 0%; }
    51% { background-color: var(--blue); }
    59% { background-color: #ffffff; background-position: 0% 0%; }
    60% { background-color: var(--blue); background-position: 0% 100%; }
    80% { background-position: 0% 0%; }
    81% { background-color: var(--blue); }
    90%, 100% { background-color: #ffffff; }
}

@-webkit-keyframes trackBallSlide {
    0% { opacity: 1; -webkit-transform: scale(1) translateY(-8px); transform: scale(1) translateY(-8px); }
    6% { opacity: 1; -webkit-transform: scale(0.9) translateY(5px); transform: scale(0.9) translateY(5px); }
    14% { opacity: 0; -webkit-transform: scale(0.4) translateY(40px); transform: scale(0.4) translateY(40px); }
    15%, 19% { opacity: 0; -webkit-transform: scale(0.4) translateY(-8px); transform: scale(0.4) translateY(-8px); }
    28%, 29.99% { opacity: 1; -webkit-transform: scale(1) translateY(-8px); transform: scale(1) translateY(-8px); }
    30% { opacity: 1; -webkit-transform: scale(1) translateY(-8px); transform: scale(1) translateY(-12px); }
    36% { opacity: 1; -webkit-transform: scale(0.9) translateY(5px); transform: scale(0.9) translateY(5px); }
    44% { opacity: 0; -webkit-transform: scale(0.4) translateY(40px); transform: scale(0.4) translateY(40px); }
    45%, 49% { opacity: 0; -webkit-transform: scale(0.4) translateY(-8px); transform: scale(0.4) translateY(-8px); }
    58%, 59.99% { opacity: 1; -webkit-transform: scale(1) translateY(-8px); transform: scale(1) translateY(-8px); }
    60% { opacity: 1; -webkit-transform: scale(1) translateY(-8px); transform: scale(1) translateY(-8px); }
    66% { opacity: 1; -webkit-transform: scale(0.9) translateY(5px); transform: scale(0.9) translateY(5px); }
    74% { opacity: 0; -webkit-transform: scale(0.4) translateY(40px); transform: scale(0.4) translateY(40px); }
    75%, 79% { opacity: 0; -webkit-transform: scale(0.4) translateY(-8px); transform: scale(0.4) translateY(-8px); }
    88%, 100% { opacity: 1; -webkit-transform: scale(1) translateY(-8px); transform: scale(1) translateY(-8px); }
}

/*@keyframes trackBallSlide {*/
    /*0% { opacity: 1; -webkit-transform: scale(1) translateY(2px); transform: scale(1) translateY(2px); }*/
    /*6% { opacity: 1; -webkit-transform: scale(0.9) translateY(5px); transform: scale(0.9) translateY(5px); }*/
    /*14% { opacity: 0; -webkit-transform: scale(0.4) translateY(20px); transform: scale(0.4) translateY(20px); }*/
    /*15%, 19% { opacity: 0; -webkit-transform: scale(0.4) translateY(2px); transform: scale(0.4) translateY(2px); }*/
    /*28%, 29.99% { opacity: 1; -webkit-transform: scale(1) translateY(2px); transform: scale(1) translateY(2px); }*/
    /*30% { opacity: 1; -webkit-transform: scale(1) translateY(2px); transform: scale(1) translateY(2px); }*/
    /*36% { opacity: 1; -webkit-transform: scale(0.9) translateY(5px); transform: scale(0.9) translateY(5px); }*/
    /*44% { opacity: 0; -webkit-transform: scale(0.4) translateY(20px); transform: scale(0.4) translateY(20px); }*/
    /*45%, 49% { opacity: 0; -webkit-transform: scale(0.4) translateY(2px); transform: scale(0.4) translateY(2px); }*/
    /*58%, 59.99% { opacity: 1; -webkit-transform: scale(1) translateY(2px); transform: scale(1) translateY(2px); }*/
    /*60% { opacity: 1; -webkit-transform: scale(1) translateY(2px); transform: scale(1) translateY(2px); }*/
    /*66% { opacity: 1; -webkit-transform: scale(0.9) translateY(5px); transform: scale(0.9) translateY(5px); }*/
    /*74% { opacity: 0; -webkit-transform: scale(0.4) translateY(20px); transform: scale(0.4) translateY(20px); }*/
    /*75%, 79% { opacity: 0; -webkit-transform: scale(0.4) translateY(2px); transform: scale(0.4) translateY(2px); }*/
    /*88%, 100% { opacity: 1; -webkit-transform: scale(1) translateY(2px); transform: scale(1) translateY(2px); }*/
/*}*/

@-webkit-keyframes nudgeMouse {
    0% { -webkit-transform: translateY(0); transform: translateY(0); }
    20% { -webkit-transform: translateY(8px); transform: translateY(8px); }
    30% { -webkit-transform: translateY(0); transform: translateY(0); }
    50% { -webkit-transform: translateY(8px); transform: translateY(8px); }
    60% { -webkit-transform: translateY(0); transform: translateY(0); }
    80% { -webkit-transform: translateY(8px); transform: translateY(8px); }
    90% { -webkit-transform: translateY(0); transform: translateY(0); }
}

@keyframes nudgeMouse {
    0% { -webkit-transform: translateY(0); transform: translateY(0); }
    20% { -webkit-transform: translateY(8px); transform: translateY(8px); }
    30% { -webkit-transform: translateY(0); transform: translateY(0); }
    50% { -webkit-transform: translateY(8px); transform: translateY(8px); }
    60% { -webkit-transform: translateY(0); transform: translateY(0); }
    80% { -webkit-transform: translateY(8px); transform: translateY(8px); }
    90% { -webkit-transform: translateY(0); transform: translateY(0); }
}

@-webkit-keyframes nudgeText {
    0% { -webkit-transform: translateY(0); transform: translateY(0); }
    20% { -webkit-transform: translateY(2px); transform: translateY(2px); }
    30% { -webkit-transform: translateY(0); transform: translateY(0); }
    50% { -webkit-transform: translateY(2px); transform: translateY(2px); }
    60% { -webkit-transform: translateY(0); transform: translateY(0); }
    80% { -webkit-transform: translateY(2px); transform: translateY(2px); }
    90% { -webkit-transform: translateY(0); transform: translateY(0); }
}

@keyframes nudgeText {
    0% { -webkit-transform: translateY(0); transform: translateY(0); }
    20% { -webkit-transform: translateY(2px); transform: translateY(2px); }
    30% { -webkit-transform: translateY(0); transform: translateY(0); }
    50% { -webkit-transform: translateY(2px); transform: translateY(2px); }
    60% { -webkit-transform: translateY(0); transform: translateY(0); }
    80% { -webkit-transform: translateY(2px); transform: translateY(2px); }
    90% { -webkit-transform: translateY(0); transform: translateY(0); }
}

/*--鏍稿績浠峰€艰 end--*/

/*--浼佷笟鎰挎櫙2 end--*/

/*--澶т簨浠?-*/
.about-developing{
    /*margin-top: 70px;*/
}
.about-developingbottom{
    background:var(--f3);
    margin-top: 20px;
    position: relative;
}

.about-developing-content {
    margin: 0 auto;
}
.toptitle{
    margin: 0 auto;
    padding: 0 20px;
}

/* Menu style */
.timeline {
    width: 100%;
    height: 600px;
    overflow: hidden;
    margin: 20px auto;
    position: relative;
    padding: 80px 0;
    background: url('../images/about/line.svg') 139px top repeat-y;
}
.timeline .dates {
    width: 160px;
    height: 600px;
    overflow: hidden;
    float: left;
}
.timeline .dates li {
    list-style: none;
    width: 140px;
    height: 100px;
    line-height: 100px;
    font-size: 24px;
    padding-right:30px;
    text-align: right;
    position: relative;
}
.timeline .dates li a{
    font-size: 24px;
    color: var(--444);
}
.timeline .dates li a::before{
    display: inline-block;
    content: ' ';
    width: 13px;
    height: 13px;
    background:var(--aaa);
    -ms-border-radius: 20px;
    -moz-border-radius: 20px;
    -o-border-radius: 20px;
    -webkit-border-radius:20px;
    border-radius: 20px;
    position: absolute;
    right:-6px;
    top: 40%;
    z-index: 9;
}
.timeline .dates a {
    line-height: 38px;
    padding-bottom: 10px;
}
.timeline .dates .selected {
    font-size: 36px;
    color: var(--blue);
}
.timeline .dates .selected::before{
    display: inline-block;
    content: ' ';
    width: 13px;
    height: 13px;
    background:var(--blue);
    -ms-border-radius: 20px;
    -moz-border-radius: 20px;
    -o-border-radius: 20px;
    -webkit-border-radius:20px;
    border-radius: 20px;
    position: absolute;
    right:-6px;
    top: 40%;
    z-index: 9;
}
.timeline .issues {
    width: calc(100% - 160px);
    height: 600px;
    overflow: hidden;
    float: left;
    padding:0 0px 0 80px;
}
.timeline .issues .issues-li {
    width: 100%;
    height:600px;
    display: flex;
    position: relative;
    z-index:10;
}
.timeline .issues .issues-li .maiyi{
    font-size:250px;
    position: absolute;
    bottom:4px;
    right: 0;
    z-index: 9;
    line-height: 350px;
    color: rgba(255,255,255,0.5);
}
.timeline .issues .issues-li .maiyi .icomm{font-size: 200px;}
.timeline .issues li .years {
    padding: 0 100px 0 40px;
    font-size: 64px;
    color: var(--444);
    z-index: 99;
}
.timeline .issues .issues-li .event{
    font-size:24px;
    color: var(--444);
    margin-left:70px;
    z-index: 99;
}
.timeline .issues .issues-li .event p{
    list-style: disc;
    line-height: 36px;
    opacity: 1!important;
    margin-top: 20px;
    position: relative;
}
.timeline .issues .issues-li .event p::before{
    display: inline-block;
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 5px;
    position: absolute;
    top:16px;
    left: -10px;
    background: var(--444);
}
.timeline .grad_top,
.timeline .grad_bottom {
    width: 180px;
    height:60px;
    position: absolute;
    z-index: 99;
}
.timeline .grad_top {
    top: 0;
    background-image: linear-gradient(to top, var(--f3) 0%, var(--f3) 100%);
}
.timeline .grad_bottom {
    bottom: 0;
    background-image: linear-gradient(120deg, var(--f3) 0%, var(--f3) 100%);
}
.timeline .next,
.timeline .prev {
    position: absolute;
    right:0;
    bottom:30px;
    font-size: 20px;
    padding:10px;
    z-index:11;
    overflow: hidden;
    background:rgba(0,0,0,.1);
    cursor: pointer;
    color:var(--fff);
}
.timeline .next {
    transform:rotate(-90deg);
    -ms-transform:rotate(-90deg);
    -moz-transform:rotate(-90deg);
    -webkit-transform:rotate(-90deg);
    -o-transform:rotate(-90deg);
}
.timeline .prev {
    right: 50px;
    transform:rotate(90deg);
    -ms-transform:rotate(90deg);
    -moz-transform:rotate(90deg);
    -webkit-transform:rotate(90deg);
    -o-transform:rotate(90deg);
}
.timeline .next:hover,
.timeline .prev:hover {
    background:rgba(0,0,0,.2);
}
/*--澶т簨浠 end--*/

/*--涓氬姟鐗堝浘--*/
.tab_BMap{overflow:hidden;position:static;}
.mapBox{width:1100px;height:665px;margin:0 auto;position:relative;margin-top:50px}
.worldMap{position:relative;z-index:0}
.tab_BMap .m2{width:100%}
.mapBox .area{position:absolute;z-index:9;cursor:pointer;background:url("../images/about/map/null.png")}
.mapBox .area b{
    position:relative;z-index:10;width:17px;height:17px;background:url("../images/about/map/ico_adr.png") no-repeat;cursor:pointer;
    display:none;
}
.mapBox .area b .pop{
    position:absolute;
    width:170px;
    height:80px;
    top:-95px;
    left:-86px;
    background:var(--fff);
    /*display:none;*/
    text-align:center;
    padding:10px 20px 30px 20px;
    -webkit-box-shadow:0 3px 3px rgba(0,0,0,.15);
    -moz-box-shadow:0 3px 3px rgba(0,0,0,.15);
    box-shadow:0 3px 3px rgba(0,0,0,.15);
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    z-index: 99;;
}
.mapBox .area b .pop::before{
    content: url("../images/about/map/jiao.svg");
    width: 20px;
    height: 20px;
    position: absolute;
    bottom: -15px;
    left: 45%;
}
.mapBox .popTitle{font-size:16px;margin-bottom:10px;color:var(--444);font-weight:400}
.mapBox .popInfo{font-size:12px;color:var(--444);font-weight:400;line-height:22px}
.mapBox .area:hover b{display:block;z-index: 9;}
.mapBox .area b:hover{display:block}
.mapBox .area b:hover .pop{display:block}

.mapBox .picture{border:1px solid var(--fff); width: 76%;margin: 0 auto;margin-top:10px;}
.mapBox .areaChina{width:230px;height:167px;top:224px;left:285px}
.mapBox .areaChina b .pop{
    display: none;
}
.mapBox .areaChina:hover{background:url("../images/about/map/map_china.png") no-repeat}
.mapBox .placeCQ{left:102px;top:93px}
.mapBox .area .placeCQ .pop{height:200px;top:-217px;width:290px;text-align:left;left:-137px}
.mapBox .area .placeSH .pop{height:200px;top:-215px;width:285px;text-align:left;left:-137px}
.mapBox .area .placeHongKong .pop{top:-100px;text-align:left;left:-84px;text-align:center;}
.mapBox .areaChina .placeZJ{left:136px;top:91px;position:absolute}
.mapBox .areaChina .placeSH{left:138px;top:74px;position:absolute}
.mapBox .areaChina .placeHongKong{left:117px;top:113px;position:absolute;z-index: 9;}
.mapBox .areaJapan{width:73px;height:59px;top:264px;left:458px}
.mapBox .areaJapan:hover{background:url("../images/about/map/map_Japan.png") no-repeat}
.mapBox .placeJapan{left:21px;top:20px}
.mapBox .areaDubai{width:44px;height:40px;top:338px;left:218px}
.mapBox .areaDubai:hover{background:url("../images/about/map/map_Dubai.png") no-repeat}
.mapBox .placeDubai{left:8px;top:-6px;}
.mapBox .areaPakistan{width:64px;height:45px;top:303px;left:245px}
.mapBox .areaPakistan:hover{background:url("../images/about/map/map_Pakistan.png") no-repeat}
.mapBox .placePakistan{left:16px;top:13px}
.mapBox .areaIndia{width:92px;height:91px;top:307px;left:265px}
.mapBox .areaIndia:hover{background:url("../images/about/map/map_India.png") no-repeat}
.mapBox .placeIndia{left:22px;top:63px}
.mapBox .areaVietnam{width:53px;height:41px;top:350px;left:373px}
.mapBox .areaVietnam:hover{background:url("../images/about/map/map_Vietnam.png") no-repeat}
.mapBox .placeVietnam{left:5px;top:3px}
.mapBox .areaAustralia{width:124px;height:118px;top:467px;left:409px}
.mapBox .areaAustralia:hover{background:url("../images/about/map/map_Australia.png") no-repeat}
.mapBox .placeAustralia{left:70px;top:22px}
.mapBox .area .placeAustralia .pop{
    top: -95px;
    left: -84px;
}
.mapBox .areaCanada{width:266px;height:181px;top:98px;right:89px;z-index:12}
.mapBox .areaCanada:hover{background:url("../images/about/map/map_Canada.png") no-repeat}
.mapBox .placeCanada{left:76px;top:75px}
.mapBox .areaUSA{width:315px;height:246px;top:104px;right:124px;z-index:11}
.mapBox .areaUSA:hover{background:url("../images/about/map/map_USA.png") no-repeat}
.mapBox .placeUSA{left:155px;top:177px}
.mapBox .area .placeUSA .pop{height:200px;top:-40px;width:290px;text-align:left;left:-304px}
.mapBox .area .placeUSA .pop::before{
    bottom: 136px;
    right: -15px;
    left: unset;
    transform:rotate(-90deg);
    -ms-transform:rotate(-90deg); /* Internet Explorer */
    -moz-transform:rotate(-90deg); /* Firefox */
    -webkit-transform:rotate(-90deg); /* Safari 鍜 Chrome */
    -o-transform:rotate(-90deg); /* Opera */
}
.mapBox .areaUSA:hover .placeUSA .pop{display:block}
.mapBox .areaMexico{width:107px;height:61px;top:321px;right:185px}
.mapBox .areaMexico:hover{background:url("../images/about/map/map_Mexico.png") no-repeat}
.mapBox .placeMexico{left:53px;top:28px}
.mapBox .areaDominica{width:85px;height:18px;top:358px;right:54px}
.mapBox .areaDominica:hover{background:url("../images/about/map/map_Dominica.png") no-repeat}
.mapBox .placeDominica{left:4px;top:-7px}
.mapBox .areaLibya{width:56px;height:69px;top:312px;left:85px}
.mapBox .areaLibya:hover{background:url("../images/about/map/map_Libya.png") no-repeat}
.mapBox .placeLibya{left:24px;top:11px}
.mapBox .areaKenya{width:39px;height:50px;top:396px;left:157px}
.mapBox .areaKenya:hover{background:url("../images/about/map/map_Kenya.png") no-repeat}
.mapBox .placeKenya{left:13px;top:13px}
.mapBox .areaZambia{width:49px;height:38px;top:436px;left:117px}
.mapBox .areaZambia:hover{background:url("../images/about/map/map_Zambia.png") no-repeat}
.mapBox .placeZambia{left:14px;top:21px}
.mapBox .area .placeZambia .pop{
    top: -92px;
    left: -84px;
}
.mapBox .areaSpain{width:51px;height:44px;top:270px;left:17px}
.mapBox .areaSpain:hover{background:url("../images/about/map/map_Spain.png") no-repeat}
.mapBox .placeSpain{left:25px;top:4px}
.mapBox .area .placeSpain .pop{left:-40px}
.mapBox .area .placeSpain .pop::before{
    left: 20%;
}
.mapBox .areaFrance{width:68px;height:45px;top:236px;left:21px}
.mapBox .areaFrance:hover{background:url("../images/about/map/map_France.png") no-repeat}
.mapBox .placeFrance{left:39px;top:3px}
.mapBox .area .placeFrance .pop{left:-67px}
.mapBox .area .placeFrance .pop::before{
    left: 35%;
}
.mapBox .areaItaly{width:83px;height:39px;top:260px;left:79px}
.mapBox .areaItaly:hover{background:url("../images/about/map/map_Italy.png") no-repeat}
.mapBox .placeItaly{left:15px;top:3px}
.mapBox .areaAthens{width:32px;height:34px;top:278px;left:112px}
.mapBox .areaAthens:hover{background:url("../images/about/map/map_Athens.png") no-repeat}
.mapBox .placeAthens{left:12px;top:-6px}
.mapBox .areaGermany{width:59px;height:44px;top:215px;left:77px}
.mapBox .areaGermany:hover{background:url("../images/about/map/map_Germany.png") no-repeat}
.mapBox .placeGermany{left:7px;top:5px}
.mapBox .areaUK{width:51px;height:49px;top:189px;left:24px}
.mapBox .areaUK:hover{background:url("../images/about/map/map_UK.png") no-repeat}
.mapBox .placeUK{left:23px;top:18px}
.mapBox .area .placeUK .pop{left:-50px}
.mapBox .area .placeUK .pop::before{
    left: 25%;
}
.mapBox .areaSverige{width:51px;height:94px;top:117px;left:85px}
.mapBox .areaSverige:hover{background:url("../images/about/map/map_Sverige.png") no-repeat}
.mapBox .placeSverige{left:22px;top:53px}
.mapBox .area .placeSverige .pop{left:-82px}
.mapBox .areaDanmark{width:47px;height:33px;top:185px;left:65px}
.mapBox .areaDanmark:hover{background:url("../images/about/map/map_Danmark.png") no-repeat}
.mapBox .placeDanmark{left:26px;top:13px}
.mapBox .area .placeDanmark .pop{left:-83px}
.mapBox .areaNetherlands{width:32px;height:35px;top:199px;left:60px}
.mapBox .areaNetherlands:hover{background:url("../images/about/map/map_Netherlands.png") no-repeat}
.mapBox .placeNetherlands{left:9px;top:15px}
.mapBox .area .placeNetherlands .pop{left:-80px}
/*--涓氬姟鐗堝浘 end--*/

/*--涓氬姟鐗堝浘鏂?-*/
.tab_BMap{overflow:hidden;position:static;}
.mapBoxnew{
    width:1100px;
    padding: 50px 0;
    margin:0 auto;
    position:relative;
    margin-top:50px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.worldMap-new{position:relative;z-index:0;width: 100%;}
.tab_BMap .m2{width:100%}
.mapBoxnew .area{
    width: 18px;
    height:24px;
    position:absolute;
    z-index:9;
    cursor:pointer;
}
.mapBoxnew .area b{
    position:relative;
    z-index:10;
    width:18px;
    height:24px;
    background:url("../images/about/map1/ico_adr.png") no-repeat;
    cursor:pointer;
    display: none;
}
.mapBoxnew .area b .pop{
    position:absolute;
    width:170px;
    height:80px;
    top:-95px;
    left:-79px;
    background:var(--fff);
    display:none;
    text-align:center;
    padding:10px 20px 20px 20px;
    -webkit-box-shadow:0 3px 3px rgba(0,0,0,.15);
    -moz-box-shadow:0 3px 3px rgba(0,0,0,.15);
    box-shadow:0 3px 3px rgba(0,0,0,.15);
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    z-index: 99;;
    background:var(--fff);
    border: 1px solid var(--blue);
}
.mapBoxnew .area b .pop::before{
    content: url("../images/about/map1/jiao.svg");
    width: 20px;
    height: 20px;
    position: absolute;
    bottom: -12.5px;
    left: 45%;
}
.mapBoxnew .popTitle{font-size:16px;margin-bottom:10px;color:var(--444);font-weight:400}
.mapBoxnew .popInfo{font-size:12px;color:var(--444);font-weight:400;line-height:22px}
.mapBoxnew .area:hover b{display:block;z-index: 9;}
.mapBoxnew .area b:hover{display:block}
.mapBoxnew .area b:hover .pop{display:block}
.mapBoxnew .picture{
    border:1px solid var(--fff);
    width: 100%;
    margin: 0 auto;
    margin-top:10px;
    max-height: 100px;
}

.mapBoxnew .placeCQmain{
    right: 217px;
    top:198px;
}
.mapBoxnew .area .placeCQ .pop{
    height:200px;
    top:-217px;
    width:290px;
    text-align:left;
    left:-132px;
}
.mapBoxnew .placeZJmain{
    right: 183px;
    top:213px;
}
.mapBoxnew .placeSHmain{
    right: 183px;
    top:196px;
}
.mapBoxnew .area .placeSH .pop{
    height:180px;
    width: 200px;
    top:-193px;
    text-align:left;
    left:-93px;
}
.mapBoxnew .placeHongKongmain{
    right: 198px;
    top:223px;
}
.mapBoxnew .placeVietnammain{
    right: 216px;
    top:238px;
}
.mapBoxnew .placeJapanmian{
    right: 125px;
    top:192px;
}
.mapBoxnew .placeDubaimain{
    right:376px;
    top:208px;
}
.mapBoxnew .placeIndiamain{
    right:300px;
    top:221px;
}
.mapBoxnew .placePakistanmain{
    right:334px;
    top:184px;
}
.mapBoxnew .placeAustraliamain{
    right:54px;
    bottom:124px;
}
.mapBoxnew .placeUSAmain{
    left:169px;
    top:204px;
}
.mapBoxnew .area .placeUSA .pop{
    width: 200px;
    height: 200px;
    top: -215px;
    left: -90px;
    text-align:left;
}
.mapBoxnew .placeCanadamain{
    left:206px;
    top:139px;
}
.mapBoxnew .placeMexicomain{
    left:187px;
    top:246px;
}
.mapBoxnew .placeDominicamain{
    left:274px;
    top:238px;
}
.mapBoxnew .placeLibyamain{
    left:575px;
    top:192px;
}
.mapBoxnew .placeKenyamain{
    right:418px;
    top:266px;
}
.mapBoxnew .placeZambiamain{
    right:462px;
    bottom:184px;
}
.mapBoxnew .placeSpainmain{
    left:519px;
    top:148px;
}
.mapBoxnew .placeFrancemain{
    left:536px;
    top:127px;
}
.mapBoxnew .placeItalymain{
    left:575px;
    top:143px;
}
.mapBoxnew .placeAthensmain{
    left:594px;
    top:143px;
}
.mapBoxnew .placeUKmain{
    left:515px;
    top:103px;
}
.mapBoxnew .placeNetherlandsmain{
    left:546px;
    top:106px;
}
.mapBoxnew .placeGermanymian{
    left:558px;
    top:112px;
}
.mapBoxnew .placeDanmarkmain{
    left:566px;
    top:95px;
}
.mapBoxnew .placeSverigemain{
    left:566px;
    top:74px;
}
/*--涓氬姟鐗堝浘鏂 end--*/

/*--鑽ｈ獕--*/
.about-honor{
    margin: 0 0 120px 0;overflow: hidden;
}

.about-honorlist{
    margin-top: 20px;
    overflow: hidden;
}
.about-honorlist li{
    width:calc((100% - 90px)/4);
    /*height: 400px;*/
    background: var(--f3);
    -ms-border-radius: 20px;
    -moz-border-radius: 20px;
    -o-border-radius: 20px;
    -webkit-border-radius:20px;
    border-radius: 20px;
    margin-right: 30px;
    padding: 20px;
    padding-bottom: 40px;
    text-align: center;
    cursor: pointer;
    float: left;
    overflow: hidden;
}
.about-honorlist li:last-child{
    margin-right: 0;
}
.about-honorlist li .honorimg{
    height: 125px;
    margin-top:40px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.about-honorlist li .honorimg img{
    width: 100%;
}
.honorimg .icomoon{
    display: block;
    width: 100%;
    font-size: 110px;
    color: var(--blue);
}
.honorimg .icomoonyellow{
    font-size: 140px;
    color: var(--orange);
}
.honorimg .min-icomoon{
    font-size: 110px;
}
.about-honorlist .text{
    margin-top:50px;
    font-size: 14px;
    line-height: 24px;
    color: var(--222);
}
.about-honorlist li:hover .honorimg{
    /*margin-top: -10px;*/
    transform:scale(1.1);
    -ms-transform:scale(1.1);
    -moz-transform:scale(1.1);
    -webkit-transform:scale(1.1);
    -o-transform:scale(1.1);
}
/*--鑽ｈ獕 end--*/

/*--about-us end--*/

/*--鎴戜滑鐨勫搧鐗?-*/
.brand-banner .swiper {
    width: 100%;
    height: 700px;
    position: relative;
}

.brand-banner .swiper .swiper-slide {
    font-size: 18px;
    background: var(--f3);
}
.brand-banner .swiper .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.brand-banner .swiper .swiper-slide{
    /*background:url("../images/brand/brand-banner.jpg") no-repeat;*/
    /*background-size: cover;*/
    background-color: var(--000);
}
/*.brand-banner .swiper .swiper-slide:nth-child(2){*/
    /*background:url("../images/index/banner-2.jpg") no-repeat;*/
    /*background-size: cover;*/
    /*background-color: var(--000);*/
/*}*/
.brand-banner .swiper .swiper-pagination-bullet{
    display: block;
    width: 4px;
    height:60px;
    border-radius: 5px;
    background: var(--swiper-pagination-bullet-inactive-color, var(--fff));
}
.brand-banner .swiper-vertical > .swiper-pagination-bullets, .swiper-pagination-vertical.swiper-pagination-bullets{
    right: 60px;
}

.brand-banner .banner-text{
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 140px;
    z-index: 1;
    text-align: left;
}
.brand-banner .banner-text .about-title{
    font-size: 64px;
    color: var(--fff);
}
.supplier-banner-text{
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 50px;
    z-index: 1;
}
.supplier-banner-text .about-title{
    font-size: 64px;
    color: var(--fff);
}
.supplier-banner-text .supplier-download{
    font-size: 22px;
    color: var(--fff);
    background: var(--blue);
    padding: 10px 20px;
    -ms-border-radius:30px;
    -moz-border-radius:30px;
    -o-border-radius:30px;
    -webkit-border-radius:30px;
    border-radius:30px;
}
.supplier-banner-text .supplier-download:hover{
    background: var(--blueD);
}
.supplier-banner-text .email{
    margin-top:250px;
    color: var(--fff);
    font-size: 16px;
}
.supplier-banner-text .email span{
    margin-right: 40px;
}
.AstroAI , #index-miyi , #index-brand-top , #index-new , #about-vision , #about-developing , #tableItem , #about-honor,
#brand-introduce , #industry-dynamics , #new-culture , #news , #join-welfare , #supplier-category , #supplier-program{
    height: 80px;
    width: 100%;
}
#about-introduce{
    height: 0;
    width: 100%;
}
.brand-tab-ul{overflow: hidden; text-align: center;}
.brand-tab-ul .brand-li{
    display: inline-block;
    margin: 0 40px;
    padding: 10px 20px;
    overflow: hidden;
    width: 340px;
    border: 1px solid var(--fff);
    border: 0;
}
.brand-tab-ul .brand-li:first-child img{
    height: 46px;
}
.brand-tab-ul .brand-li:last-child img{
    height: 40px;
    margin-top: 8px;
}
.brand-tab-ul .brand-li a{
    display: block;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 80px;
    position: relative;
}
.brand-tab-ul .brand-li a .navline{
    position: absolute;
    bottom:-10px;
    left:15%;
    display: inline-block;
    width:70%;
    height:0px;
    border-radius: 5px;
    background: var(--orange);
}
.brand-tab-ul .brand-li:hover .navline , .brand-tab-ul .current a .navline{
    height: 3px;
}
.brand-astroAI{
    margin-top: 80px;
    width: 100%;
    background:url(../images/brand/brand-astroAI-bg.jpg);
    background-size: cover;
    background-color: var(--f3);
    background-attachment:fixed;
    height:400px;
    position:relative;
    display:flex;
    align-items:center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
}
.brand-Hicozy{
    margin-top: 80px;
    width: 100%;
    background:url(../images/brand/brand-hicozy-bg.jpg);
    background-color: var(--f3);
    background-attachment:fixed;
    height:400px;
    position:relative;
    display:flex;
    align-items:center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
}
.brand-astroAI .brand-astroAI-text{
    font-size: 64px;
    color:var(--fff);
    position: relative;
    display: block;
}
.brand-astroAI .brand-astroAI-text b{
    display: inline-block;
    height: 6px;
    width:60%;
    position: absolute;
    left:20%;
    bottom: -30px;
    background:var(--fff);
    -ms-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    -webkit-border-radius:5px;
    border-radius: 5px;
}
.brand-Hicozy .brand-astroAI-text b{
    width: 50%;
    left: 25%;
    bottom: -30px;
}
.brand-introduce{
    padding:50px 0 160px 0;
    position: relative;
    overflow: hidden;
}
.brand-introduce-content{
    max-width: 1300px;
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
}
.brand-introduce-content .introduce1-text{
    width: 80%;
    margin: 0 auto;
    text-indent:2em;
    font-size: 16px;
    line-height:38px;
    color: var(--222);
    z-index: 2;
    position: relative;
}
.introduce1-text .more{
    color: var(--blue);
    font-size: 18px;
}
.brand-introduce-maiyi{
    color:var(--f8);
    text-transform: uppercase;
    font-size: 246px;
    position: absolute;
    right:2%;
    bottom: -64px;
    z-index: 1;
}
.bigtitle{
    font-size: 48px;
    color: var(--222);
}
.brand-product{
    padding: 80px 0;
}
.brand-product .bigtitle{
    text-align: center;
}
.brand-product .brand-product-swiper {
    width: 100%;
    margin-top: 40px;
}
.brand-product .swiper-slide {
    width: 100%;
    margin: 0 auto;
}
.brand-product .swiper-slide .swiper-slide-content{
    width: 80%;
    height: 100%;
    margin: 0 auto;
}
.brand-product .swiper-button-left1{
    width: 50px;
    height: 50px;
    right:0px;
    background: rgba(0,0,0,.5);
    border-radius: 50px;
    z-index:9999999999;
}
.brand-product .swiper-button-right1{
    width: 50px;
    height: 50px;
    left:0px;
    background: rgba(0,0,0,.5);
    border-radius: 50px;
}

.brand-product .swiper-button-left1:after{
    content: 'next';
    width: 50px!important;
    height: 50px;
    font-size: 26px;
    color:var(--fff);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.brand-product .swiper-button-right1:after{
    content: 'prev';
    width: 200px!important;
    height: 50px;
    font-size: 26px;
    color:var(--fff);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.brand-product .swiper-button-right1:hover , .brand-product .swiper-button-left1:hover{
    background: var(--blue);
}
.product-top{
    display: flex;
    justify-content: space-between;
}
.product-top .product-box{
    width:48%;
    background-image: linear-gradient(to right, #f5f6f6 0%, #fdfdfc 100%);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-align: center;
    -ms-border-radius: 30px;
    -moz-border-radius: 30px;
    -o-border-radius: 30px;
    -webkit-border-radius:30px;
    border-radius: 30px;
    padding: 40px 0;
    position: relative;
    overflow: hidden;
}
.product-bottom .product-box{
    padding-bottom: 40px;
    padding-top: 0;
}
.product-top .product-box a{
    display: inline-block;
    width: 100%;
    height: 100%;
}
.product-top .product-box .featuredimg{
    width:60%;
    margin: 0 auto;
    /*height: 280px;*/
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-align: center;
    /*overflow: hidden;*/
}
.product-top .product-box .featuredimg img{
    max-width:100%;
    max-height: 100%;
}
.product-bottom .product-box{
    width: 31%;
    margin-top: 3%;
}
.product-top .product-box-text{
    font-size: 16px;
    color: var(--222);
}
.product-top .product-box-more{
    position: absolute;
    top:5%;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,.5);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 0;
    opacity:0;
}
.product-top .product-box-more .title{
    font-size: 20px;
    text-align: left;
    color: var(--orange);
}
.moretextlist{
    font-size: 12px;
    line-height: 20px;
    color:var(--fff);
    margin-top: 10px;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp:8;
    -webkit-box-orient: vertical;
}
.product-top .product-box-more .moretext{
    width: 80%;
    display: flex;
    align-items: left;
    justify-content: center;
    flex-direction: column;
    position: absolute;
    bottom:60px;
    text-align:left;
}
.product-top .product-box:hover .product-box-more{
    opacity: 1;
    top: 0;
}
.product-top .product-box:hover .featuredimg img{
    transform:scale(1.1);
    -ms-transform:scale(1.1);
    -moz-transform:scale(1.1);
    -webkit-transform:scale(1.1);
    -o-transform:scale(1.1);
}
.brand-hicozy-product{
    margin-top: 80px;
}

.brand-tool{
    position: relative;
}
.brand-tool .toolwiper {
    width: 100%;
    height:100%;
    margin-left: auto;
    margin-right: auto;
}
.brand-tool .toolwiper .left-icon, .right-icon{
    color: var(--fff);
}
.brand-tool .toolwiper .right-icon{
    left: 80px;
}
.brand-tool .toolwiper .left-icon{
    right: 80px;
}
.brand-tool .toolwiper .right-icon:hover, .brand-tool .toolwiper .left-icon:hover{
    color: var(--blue);
}
.brand-tool .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.brand-tool-ul{
    display: flex;
    justify-content: center;
    position: absolute;
    top: 60px;
    left: 0;
    z-index: 99;
    width: 100%;
    text-align: center;
}
.brand-tool-ul li{
    width:100px;
    height: 30px;
    line-height: 30px;
    background:rgba(0,0,0,.8);
    color: var(--fff);
    text-align: center;
    border-radius: 20px;
    cursor: pointer;
}
.brand-tool-ul li:last-child{
    margin-left: -23px;
}
.brand-tool-ul .current{
    background:var(--fff);
    color: var(--blue);
    height: 100%;
    z-index: 9;
}
.brand-tool-ul li:hover{
    background:var(--fff);
    color: var(--blue);
    z-index: 9;
}
.brand-tool-tab li{
    display: none;
}
.brand-tool-tab li:first-child{
    display: block;
}
.brand-jiabg{
    height: 700px;
    background: url("../images/brand/bg.jpg") no-repeat center/cover;
    background-color: var(--f3);
}
/*--鎴戜滑鐨勫搧鐗 end--*/

/*--楹︿竴鍔ㄦ€?-*/
.min-main{
    max-width: 1366px;
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
}
.news-banner{
    text-align: center;
}
.news-banner .banner-text{
    top: 40%;
    bottom: unset;
}
.news-banner .banner-text .about-title{
    color:var(--fff);
}
.dynamic-news{
    margin-top: 80px;
}
.dynamic-news .swiper {
    width: 100%;
}

.dynamic-news .swiper-slide{
    text-align: center;
}
.dynamic-news .swiper-slide a{
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
.dynamic-news .swiper-button-prev, .dynamic-news .swiper-button-next{
    color: var(--fff);
    display: none;
}

.dynamic-news .swiper-button-prev:after, .dynamic-news  .swiper-button-next:after{
    font-size: 30px;
}
.newswiper:hover .swiper-button-prev ,.newswiper:hover .swiper-button-next{
    display: block;
}
.dynamic-news .swiper-button-prev:hover , .dynamic-news  .swiper-button-next:hover{
    color: var(--blue);
}
.dynamic-news .swiper-button-next{
    right: 40%;
}
.dynamic-news .swiper-pagination-fraction, .swiper-pagination-custom, .swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal{
    bottom: 30px;
    left: 0;
    width: 100%;
}
.dynamic-news .swiper-pagination-bullet {
    width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 10px));
    height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 10px));
    display: inline-block;
    border-radius: 50%;
    background: var(--swiper-pagination-bullet-inactive-color, var(--fff));
    opacity: var(--swiper-pagination-bullet-inactive-opacity, 1);
}
.dynamic-news .swiper-pagination-bullet-active{
    background: var(--blue);
}
.news-left{
    width: calc(100% - 40%);
    height: 424px;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    background: var(--f3);
}
.news-left img{
    width: 100%;
    height:auto;
    /*height: auto;*/
    position: relative;
}
.news-left .news-bg{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../images/news/news-bg.png") ;
}
.news-left .news-left-text{
    position: absolute;
    bottom:32px;
    left: 0;
    text-align: left;
    color: var(--fff);
    padding-left: 40px;
    width: 70%;
}
.news-left .news-left-text .news-left-title{
    display: inline-block;
    width: 100%;
    font-size: 24px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.news-left .news-left-text .news-left-content{
    font-size:14px;
    margin-top: 8px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.news-right{
    width: calc(100% - 60%);
    background:#f6f6f6;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    padding: 0 40px;
}
.news-right-content{
    width: 80%;
}
.news-right .news-right-text{
    font-size: 16px;
    color: var(--222);
    line-height: 28px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    height: 80px;
}
.news-right  .news-right-time{
    display: inline-block;
    font-size: 24px;
    color: var(--blue);
    margin-top: 40px;
}
.industry-dynamics{
    overflow: hidden;
}
.industry-dynamics .title-tab{
    display: flex;
    justify-content: center;
}
.industry-dynamics .title-tab li{
    cursor: pointer;
    padding: 0 20px;
    font-size: 24px;
    color: var(--222);
    position: relative;
}
.industry-dynamics .title-tab li a{
    font-size: 24px;
    color: var(--222);
}
.industry-dynamics .title-tab li .line{
    position: absolute;
    bottom:-16px;
    display: block;
    width: 74%;
    height: 0px;
    margin-top: 10px;
    background: var(--blue);
    -ms-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -webkit-border-radius:3px;
    border-radius:3px;
}
.industry-dynamics .title-tab .current{
    color: var(--blue);
}
.industry-dynamics .title-tab .current .line{
    height: 3px;
}
.industry-dynamics .title-tab li:hover{
    color: var(--blue);
}
.industry-dynamics .title-tab li:hover .line{
    height: 3px;
}
.dynamics-tab .dyna-news{
    overflow: hidden;
    margin-top: 40px;
}
.dynamics-tab .dyna-news .dyna-newsli{
    width: 100%;
    background: var(--fff);
}
.dyna-newsli .dyna-newsli-text{
    padding: 40px 0;
    border-bottom: 1px solid var(--aaa);
}
.dyna-newsli-text .time{
    font-size: 14px;
    color: var(--888);
    float: right;
    line-height: 28px;
}
.dyna-newsli-text .title{
    font-size: 20px;
    color: var(--444);
    margin-top: 10px;
}
.dyna-newsli-text .text-content{
    margin-top: 30px;
    width: 60%;
    font-size: 14px;
    line-height: 22px;
    color: var(--888);
}
.dynamics-tab .show{
    display: block;
}
.dynamics-tab .hide{
    display: none;
}
.dynamics-tab .dyna-news .dyna-newsli:hover {
    background: var(--f3);
}
.page{
    display: flex;
    justify-content: space-between;
    padding: 40px 20px;
}
.page a{
    color: var(--222);
    font-size: 16px;
    line-height: 20px;
    cursor: pointer;
}
.page .icomoonn{
    margin-right: 5px;
}
.page .icomoon{
    margin-left: 5px;
}
.page .page-content{
    display: flex;
}
.page .page-content a{
    margin: 0 5px;
    display: block;
    text-align: center;
    /*line-height: 20px;*/
    width: 20px;
    height: 20px;
    border-radius: 20px;
    color: var(--222);
}
.page .page-content .current{
    width: 20px;
    height: 20px;
    border-radius: 20px;
    background: var(--blue);
    color: var(--fff);
}
.page .page-content .page-list:hover{
    background: var(--blue);
    color: var(--fff);
}
.page .page-content .page-list-none{
    color: var(--222)!important;
    background: none!important;
}
.page .jump:hover{
    color:var(--blue);
}
/*--楹︿竴鍔ㄦ€ end--*/

/*--鍔ㄦ€佽鎯呴〉--*/
.DetailsPage{
    margin: 120px 0 0 0;
}
.Details_header{
    border-bottom:1px solid var(--eee);
}
.Details_tilte{
    font-size:36px;
    line-height:36px;
    color:var(--222);
    font-weight:400;
    margin:30px 0;
}
.Details_description{
    font-size:14px;
    line-height:14px;
    color:var(--666);
    margin:15px 0;
}
.Details_description span{
    margin-right:5%;
}
.DetailsBody{
    padding:30px 0;
    line-height:32px;
    font-size:16px;
    min-height: 500px;
}
.DetailsMain{
    margin-bottom:30px;
}
.DetailsMain .title{
    font-size:24px;
    color:var(--222);
}
.Details_txt{
    font-size:16px;
    color:var(--222);
    line-height:28px;
    margin-top:15px;
}
.contactHr{
    padding:20px 40px;
    margin-bottom:60px;
    background:#f4fbff;
    margin-top: 50px;
}
.contactHr p{
    color:var(--666);
    font-size:18px;
    line-height:40px;
}
.contactHr p b{
    color:var(--222);
    font-weight:400;
}
.copyright .copyright-text{
    border-top:1px solid var(--eee);
    padding-top:20px;
    font-size:14px;
    color:var(--aaa);
    line-height:24px
}
.metPage{margin:40px 0;}
.metPage .main{
    overflow:hidden;
}
.metPageNext,.metPagePre{
    display:block;
    max-width:30%;
    height:40px;
    line-height:40px;
    text-align:center;
    padding:0 20px;
    font-size:18px;
    color:var(--222);
    border:1px solid var(--eee);
    float:left;
    margin-right:5%;
    cursor:pointer;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    -o-border-radius:5px;
    border-radius:5px;
}
.metPageNext:hover,.metPagePre:hover{
    border:1px solid var(--blue);
    color:var(--blue);
    background:var(--f3);
}
/*--鍔ㄦ€佽鎯呴〉 end--*/

/*--鍔犲叆鎴戜滑-鐞嗗康--*/
#join-idea , #join-social , #join-campus{
    width: 100%;
    height: 80px;
}
.join-idea .join-tab{
    display: flex;
    justify-content: center;
}
.join-idea .join-tab .join-tabli{
    margin: 0 30px;
}
.join-idea .join-tab .join-tabli a{
    font-size: 24px;
    color:var(--222);
    position: relative;
}
.join-idea .join-tab .join-tabli .line{
    position: absolute;
    bottom: -10px;
    display: block;
    width: 100%;
    height: 0;
    background: var(--blue);
}
.join-idea .join-tab .current a{
    color: var(--blue);
}
.join-idea .join-tab .current .line{
    height: 3px;
}
.join-idea .join-tab .join-tabli:hover a{
    color: var(--blue);
}
.join-idea .join-tab .join-tabli:hover .line{
    height: 3px;
}
.join-tablist{
    margin-top:40px;
    display: flex;
}
.join-tablist .join-tablist-li{
    width: calc((100% - 15px)/4);
    margin-right: 5px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
.environment-right{
    width: 400px;
    height: 400px;
    background: var(--f3);
}
.join-tablist .join-tablist-li:last-child{
    margin: 0;
}
.join-tablist .join-tablist-li .listimg{
    background: var(--f3);
    width: 100%;
    height: 100%;
    position: relative;
}
.join-tablist .join-tablist-li:nth-child(1) .listimg{
    background: url("../images/join/idea-1.jpg") no-repeat center/cover;
}
.join-tablist .join-tablist-li:nth-child(2) .listimg{
    background: url("../images/join/idea-2.jpg") no-repeat center/cover;
}
.join-tablist .join-tablist-li:nth-child(3) .listimg{
    background: url("../images/join/idea-3.jpg") no-repeat center/cover;
}
.join-tablist .join-tablist-li:nth-child(4) .listimg{
    background: url("../images/join/idea-4.jpg") no-repeat center/cover;
}
.join-tablist .join-tablist-li .listimg:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.2);
}
.join-idea-text{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    color:var(--fff);
    padding: 80px 0px 0 10px;
}
.join-idea-text .title{
    font-size: 20px;
}
.join-idea-text .join-line{
    display: block;
    width: 80px;
    height:4px;
    background: var(--fff);
    margin-top: 10px;
}
.join-idea-text .text{
    font-size: 12px;
    line-height: 20px;
    margin-top: 20px;
    /*transform:scale(calc(11 / 12));*/
    /*-ms-transform:scale(calc(11 / 12));*/
    /*-moz-transform:scale(calc(11 / 12));*/
    /*-webkit-transform:scale(calc(11 / 12));*/
    /*-o-transform:scale(calc(11 / 12));*/
}
.join-tablist .join-tablist-li:hover .listimg{
    transform:scale(1.1);
    -ms-transform:scale(1.1);
    -moz-transform:scale(1.1);
    -webkit-transform:scale(1.1);
    -o-transform:scale(1.1);
}
.join-tablist .join-tablist-li:hover .listimg:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.1);
}
.join-tablist .join-tablist-li:hover .title{
    font-size: 22px;
}
.join-tablist .join-tablist-li:hover .text{
    font-size: 13px;
    line-height: 22px;
}
.join-welfare{
    margin-top:150px;
}
.join-environment{
    margin-top: 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.join-environment .environment-left{
    width: calc(100% - 48%);
}
.join-environment .environment-left .text{
    font-size: 18px;
    line-height: 32px;
    color: var(--444);
    text-indent: 2em;
}
.join-welfare .about-title{
    margin-top: 80px;

}
.join-system{
    margin-top: 40px;
    background: var(--eee);
}
.join-systemul{
    display: flex;
    width: 100%;
}
.join-systemli{
    width: 60%;
    overflow: hidden;
}
.join-systemli:last-child{
    width: calc(100% - 60%);
    margin-left: -1px;
}
.li-box-top{
    position: relative;
}

.join-system .li-box-top {
    width: 100%;
    /*display: flex;*/
    overflow: hidden;
}
.join-systemli .li-box-top .text-main{
    width: 35%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: var(--f3);
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    cursor: pointer;
}
.join-systemli .li-box-top .text{
    /*height: 230px;*/
    display: block;
    font-size: 18px;
    color: var(--888);
    line-height: 32px;
    text-align: center;
    cursor: pointer;
    overflow: hidden;
}
.join-systemli .li-box-top:nth-child(2) .text-main{
    right: 0;
    left: unset;
}
.join-systemli .li-box-top:nth-child(2) .bottom-swiper{
    float: left;
}
.li-right-content{
    width: 100%;
    position: relative;
    overflow: hidden;
}
.join-systemli .li-box-right-text .text{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 18px;
    color: var(--888);
    line-height: 32px;
    text-align: center;
    cursor: pointer;
    overflow: hidden;
    background: var(--f3);
}
.join-systemli .li-box-right-text .text img{
    width: 100%;
    height: 100%;
}
.li-right-content .righttext{
    float: left;
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 18px;
    color: var(--888);
    line-height: 32px;
    text-align: center;
    cursor: pointer;
    overflow: hidden;
    background: var(--f3);
}
.verticalimg{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: var(--orange);
    color: var(--fff);
    font-size: 40px;
    cursor: pointer;
    float: left;
}
.verticalimg , .li-box-right-text , .li-right-content .text{
    width: 50%;
    overflow: hidden;
}
.verticalimg-swiper{
    width:50%;
    /*height: 460px;*/
    overflow: hidden;
    float: left;
}
.li-box-right-text{
    width:50%;
    float: right;
}
.join-systemli .right-content .text{
    width: 100%;
}

.welfare-swiper , .wel-swiper, .bottom-swiper{
    width:65%;
    height: 230px;
    overflow: hidden;
    float: right;
}
.welfare-swiper{
    /*position: absolute;*/
    /*right: 0;*/
}

.verticalimg-swiper img{
    width: 100%;
    height: 100%;
}
.welfare-swiper .swiper-slide , .bottom-swiper .swiper-slide ,.verticalimg-swiper .swiper-slide , .wel-swiper .swiper-slide{
    text-align: center;
    font-size: 18px;
    background:var(--f3);
    display: flex;align-items: center;justify-content: center;
    flex-direction: column;
    overflow: hidden;
}
.welfare-swiper .swiper-slide img , .bottom-swiper .swiper-slide img ,.verticalimg-swiper .swiper-slide img , .wel-swiper .swiper-slide img{
    width: 100%;
    height: 100%;
}
.li-box-right-text img{
    width: 100%;
    height:100%;
}


.join-systemli .text-main:hover .text , .li-right-content .righttext:hover{
    font-size: 20px;
}
.join-systemli .text img:hover , .join-systemli .verticalimg:hover .icomoon{
    transform:scale(1.1);
    -ms-transform:scale(1.1);
    -moz-transform:scale(1.1);
    -webkit-transform:scale(1.1);
    -o-transform:scale(1.1);
}


.join-environment .environment-left .text:last-child{
    margin-top:80px;
}
.join-recruitment{
    margin-top: 80px;
    background: #ebf4ff;
    padding: 50px 0 80px 0;
}
.join-recruitment .recruitment{
    margin-top: 30px;
    display: flex;
}
.join-recruitment .recruitment li{
    margin-right: 50px;
    width: calc((100% - 100px)/3);
    overflow: hidden;
}
.recruitment .recruitment-img{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    overflow: hidden;
    background: var(--f3);
}
.recruitment .recruitment-img img{
    width: 100%;
    height: auto;
}
.recruitment-text{
    margin-top:10px;
}
.recruitment-text .text{
    font-size: 16px;
    color: var(--222);
    margin-top: 5px;
}
.join-recruitment .recruitment li .recruitment-img img:hover {
    transform:scale(1.1);
    -ms-transform:scale(1.1);
    -moz-transform:scale(1.1);
    -webkit-transform:scale(1.1);
    -o-transform:scale(1.1);
}
/*--鍔犲叆鎴戜滑-鐞嗗康 end--*/

/*--绀句細鎷涜仒--*/
.join-social{
    margin-bottom: 40px;
}
.join-social-content{
    margin-top: 50px;
    margin-bottom: 20px;
}
.join-social-title{
    text-align: center;
    color:var(--blue);
    font-size: 28px;
    font-weight: normal;
}
.join-social .page{
    padding: 40px 0;
}
.social-choose{
    display: flex;
    justify-content: space-between;
    margin: 30px 0;
}
/**/
.select-menu{
    cursor:pointer;
}
.select-menu-div{
    position:relative;
    width: 100%;
    height:43px;
    -ms-border-radius: 30px;
    -moz-border-radius: 30px;
    -o-border-radius: 30px;
    -webkit-border-radius:30px;
    border-radius: 30px;
    outline: none;
    border: 1px solid var(--aaa);

}
.select-menu-ul{
    margin-top:50px;
    list-style:none;
    opacity:0;
    display:none;
    width:100%;
    text-align:left;
    border:1px solid #ddd;
    background:var(--fff);
    position:absolute;
    z-index:1;
}
.select-menu-input{
    width: 100%;
    height: 100%;
    -ms-border-radius: 30px;
    -moz-border-radius: 30px;
    -o-border-radius: 30px;
    -webkit-border-radius:30px;
    border-radius: 30px;
    outline: none;
    cursor: pointer;
    padding: 0 20px;
    color: var(--888);
    border: 0;
}
.select-menu-ul li{
    padding:2% 0 2% 3%;
}
.select-this{
    color: var(--fff);
    background:var(--blue);
}
.select-menu-ul li:hover{
    background:var(--blue)!important;
    color: var(--fff);
}
.select-menu-div i{
    position:absolute;
    right:20px;
    top:14px;
    transform:rotate(90deg);
    -ms-transform:rotate(90deg); /* Internet Explorer */
    -moz-transform:rotate(90deg); /* Firefox */
    -webkit-transform:rotate(90deg); /* Safari 鍜 Chrome */
    -o-transform:rotate(90deg); /* Opera */
}
.select-menu-i{
    transform:rotate(-90deg)!important;
}
.select-menu-div i , .select-menu-div{
    -webkit-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
/**/
.social-choose .choose-text{
    width:calc((100% - 60px)/5);
    position: relative;
}
.choose-text .input-text{
    width: 100%;
    padding: 12px 20px;
    -ms-border-radius: 30px;
    -moz-border-radius: 30px;
    -o-border-radius: 30px;
    -webkit-border-radius:30px;
    border-radius: 30px;
    outline: none;
    border: 1px solid var(--aaa);
    color: var(--888);
}

.choose-text .choose-search-text{
    position: absolute;
    right: 0;
    top: 1px;
    font-size: 16px;
    display: block;
    text-align: center;
    width:80px;
    height: 95%;
    line-height:43px;
    background: var(--blue);
    color: var(--fff);
    -ms-border-radius: 30px;
    -moz-border-radius: 30px;
    -o-border-radius: 30px;
    -webkit-border-radius:30px;
    border-radius: 30px;
    cursor: pointer;
}
.choose-text .choose-search-text:hover{
    background: var(--blueD);
}

/**/
.menu_head{
    padding:10px 20px;
    cursor:pointer;
    position:relative;
    background:var(--fff);
    border: 1px solid var(--aaa);
    margin-top:30px;
    font-size: 24px;
    color: var(--666);
}
.menu_head::before{
    content: '+';
    display: block;
    color:var(--444);
    width: 30px;
    height: 30px;
    font-size: 30px;
    line-height: 26px;
    text-align: center;
    color:var(--aaa);
    /*background: red;*/
    border: 2px solid var(--aaa);
    -ms-border-radius: 30px;
    -moz-border-radius: 30px;
    -o-border-radius: 30px;
    -webkit-border-radius:30px;
    border-radius: 30px;
    position: absolute;
    right: 20px;
    top: 9px;
}
.menu_head:hover{
    background: var(--f3);
}
.menu_list .current{
    background:var(--fff);
}
.menu_list .current::before{
    content: '-';
    display: block;
    color:var(--444);
    width: 30px;
    height: 30px;
    font-size: 30px;
    line-height: 26px;
    text-align: center;
    color:var(--aaa);
    /*background: red;*/
    border: 2px solid var(--aaa);
    -ms-border-radius: 30px;
    -moz-border-radius: 30px;
    -o-border-radius: 30px;
    -webkit-border-radius:30px;
    border-radius: 30px;
    position: absolute;
    right: 20px;
    top: 9px;
}
.menu_body{
    border: 1px solid var(--aaa);
    border-top: none;
    padding:15px 20px;
    background:var(--f3);
}
.menu_body .menu_body-ul{
    display: flex;
    justify-content: space-between;
}
.menu_body-ul li{
    font-size: 16px;
    color: var(--888);
}
.menu_body-content{
    display: none;
}
.menu_body-content .duty-text{
    margin-top: 20px;
}
.menu_body-content .duty-text:first-child{
    margin-top: 40px;
}
.menu_body-content .duty-text .title{
    font-size: 18px;
    color: var(--666);
}
.menu_body-content .duty-text .textp{
    margin-top: 12px;
    font-size: 14px;
    color: var(--666);
    line-height: 24px;
}
.menu_body-content .duty-text .textp p{
    font-size: 14px;
    color: var(--666);
    line-height: 24px;
}
.menu_body-content .duty-bottom{
    margin-top: 40px;
    overflow: hidden;
}
.menu_body-content .duty-bottom .link{
    width: 150px;
    text-align: center;
    -ms-border-radius: 30px;
    -moz-border-radius: 30px;
    -o-border-radius:30px;
    -webkit-border-radius:30px;
    border-radius: 30px;
    font-size: 18px;
    display: block;
    padding: 10px 0;
    background: var(--blue);
    color: var(--fff);
    float: left;
}
.menu_body-content .duty-bottom .pictext{
    margin-right: 50px;
    font-size: 16px;
    line-height: 28px;
    color: var(--444);
    float: right;
}
.menu_body .show{
    display: block;
}
.menu_body-content .duty-bottom .link:hover{background:var(--blueD);}
/**/

/*--绀句細鎷涜仒 end--*/

/*--鎷涜仒璇︽儏椤?-*/
.DetailsBody-join{
    padding-bottom: 0px;
}
.popbg{background:rgba(0,0,0,0.5);position:fixed;top:0;bottom:0;left:0;right:0;z-index:9999;display:none}
.popmain{position:fixed;width:400px;height:600px;overflow-y: auto; background:var(--fff);z-index:999999;left:50%;margin-left:-200px;top:50%;padding:40px;margin-top:-300px;display:none}
.popmain::-webkit-scrollbar {
    display: none; /* Chrome Safari */
}
.poptop{display:block;width:100%;overflow:hidden;margin-bottom:0}
.poptop .title{display:block;width:100%}
.poptop .title i{display:block;text-align:center;font-size:22px;font-style:normal;font-weight:400}
.poptop .title .jobname{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:16px;line-height:16px;margin:10px 0;color:#999}
.poptop .title .jobtxt{width:100%;color:#333}
.popmain .close{
    display:block;
    font-size: 30px;
    cursor:pointer;
    position:absolute;
    right:10px;
    top:10px;
    -moz-border-radius:50px;
    -webkit-border-radius:50px;
    -o-border-radius:50px;
    border-radius:50px;
    color: var(--blue);
}

.popmain .close:hover{color: var(--blueD)}
.span_input{display:block;height:64px;position:relative;margin-bottom:10px}
.span_input .mintitle{display:block;height:16px;position:absolute;z-index:0;background:var(--fff);margin-left:10px;padding:0 10px;font-size:16px;margin-top:28px;font-style:normal;color:#666}
.span_input .inputtxt{height:54px;background:0 0;position:absolute;z-index:7;margin-top:10px;width:100%;text-indent:20px;border:1px solid #eee;outline:0;-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px;border-radius:5px}
.span_input .inputtxt:focus{border:1px solid var(--blue)}
.span_input b{display:block;height:54px;background:0 0;position:absolute;float:right;right:10px;line-height:54px;margin-top:10px;padding:0 10px;cursor:pointer;z-index:10;font-size:16px;color:#444;font-weight:400;text-decoration:underline}
.max_span_input{height:95px}
.span_input .l_text{height:90px;line-height:26px;resize:none;padding:10px 20px;text-indent:0}
.codebg{display:block;margin-top:10px;overflow:hidden}
.codebg .span_input{width:60%;float:left}
.codepic{width:40%;padding-left:10px;display:block;height:54px;margin-top:10px;float:left;cursor:pointer}
.min_info{height:16px;color:#b81b1e;display:none;margin-bottom:20px;display:block;font-size:12px}
.popmain_min{width:320px;height:350px;background:var(--fff);position:fixed;z-index:9999999;left:50%;margin-left:-160px;top:50%;margin-top:-195px;padding:20px;text-align:center;-webkit-box-shadow:0 3px 3px rgba(0,0,0,.15);-moz-box-shadow:0 3px 3px rgba(0,0,0,.15);box-shadow:0 3px 3px rgba(0,0,0,.15)}
.popmain_min .ico{width:80px;height:80px;margin:30px 0}
.popmain_min .title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;margin:0 auto;margin-bottom:10px;width:80%}
.popmain_min .info{margin-bottom:20px}
/*.popmain_min .applyjob{width:80%;margin:0 auto;cursor:pointer;margin-bottom:10px}*/
.applyjob{
    width: 150px;
    text-align: center;
    -ms-border-radius: 30px;
    -moz-border-radius: 30px;
    -o-border-radius:30px;
    -webkit-border-radius:30px;
    border-radius: 30px;
    font-size: 18px;
    display: block;
    padding: 10px 0;
    background: var(--blue);
    color: var(--fff);
    cursor: pointer;
}
.applyjob:hover{
    background:var(--blueD);
    color: var(--fff);
}
.popmain_min .jobmore{color:var(--666)}
.popmain_min .jobmore:hover{color:var(--blue)}
.codepic span{line-height:54px;font-size:22px}
/*--鎷涜仒璇︽儏椤 end--*/

/*--渚涘簲鍟嗘嫑鍟嗘祦绋?-*/
.supplier-category{
    /*margin-top: 80px;*/
}
.category-list{
    width: 86%;
    margin: 0 auto;
}
.category-zhong{
    position: relative;
}
.supplier-category .max-main{
    max-width: 1366px;
    width: 100%;
    margin: 0 auto;
}
.supplier-category .categorySwiper {
    width: 100%;
    margin-top: 50px;
}
.categorySwiper .category-wrapper{
    /*width: 80%;*/
    margin: 0 auto;
}
.categorySwiper .swiper-slide {
    text-align: center;
    font-size: 18px;
    background:var(--f3);
}
.category-content{
    position: relative;
    margin: 0 auto;
    cursor: pointer;
}
.category-content .category-img{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.category-content .category-img img{
    width: 100%;
}
.category-list .swiper-button-left1{
    width: 50px;
    height: 50px;
    right: 30px;
    top: 64%;
    background: rgba(0,0,0,.5);
    border-radius: 50px;
}
.category-list .swiper-button-right1{
    width: 50px;
    height: 50px;
    left: 30px;
    top: 64%;
    background: rgba(0,0,0,.5);
    border-radius: 50px;
}
.category-list .swiper-button-left1:after{
    content: 'next';
    width: 50px!important;
    height: 50px;
    font-size: 26px;
    color:var(--fff);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.category-list .swiper-button-right1:after{
    content: 'prev';
    width: 200px!important;
    height: 50px;
    font-size: 26px;
    color:var(--fff);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.category-list .swiper-button-left1:hover , .category-list .swiper-button-right1:hover{
    background:var(--blue);
    border-radius: 50px;
}
.category-content .category-more{
    position: absolute;
    left: 0;
    bottom:0;
    width: 100%;
    height:80%;
    background:rgba(0,0,0,.64);
    padding:20px 0;
    opacity: 0;
}
.category-content:hover .category-more{
    height: 100%;
    opacity: 1;
}
.category-content:hover .showtitle{
    bottom: -120%;
}
.category-more .title{
    color: white;
    font-size: 18px;
}
.category-content .showtitle{
    width: 100%;
    color: white;
    font-size: 18px;
    background:rgba(0,0,0,.64);
    padding:20px 0;
    position: absolute;
    bottom: 0;
}
.category-content .more-text{
    width: 100%;
    height:100%;
    position: absolute;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 20px;
}
.category-more .textlist{
    width: 90%;
    margin: 0 auto;
    margin-top:5%;
    font-size: 12px;
    line-height: 20px;
    color: var(--fff);
    text-align: left;
    /*display: -webkit-box;*/
    /*overflow: hidden;*/
    /*-webkit-line-clamp: 15;*/
    /*-webkit-box-orient: vertical;*/
    overflow-y: auto;
}
.category-more .textlist::-webkit-scrollbar {
    display: none;
}

.supplier-program{
    /*margin-top: 80px;*/
    background: var(--f3);
}
.program-title{
    text-align: center;
    padding-top:50px;
    font-size: 32px;
    color: var(--666);
    font-weight: normal;
    letter-spacing: 2px;
}
.program-contentUL{
    width:100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    padding: 140px 60px;
    background:var(--fff);
    margin-top: 40px;
    text-align: center;
    z-index: 2;
    position: relative;
}
.program-contentUL .program-contentLi{
    width:12%;
}
.program-contentUL .btn-jiantou{
    width: 5%;
}
.program-contentLi .pro-img{
    width: 100%;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.program-contentLi .pro-img img{
    width: 80%;
}
.btn-jiantou .pro-img img{
    width:80%;
}
.program-contentLi .text{
    font-size: 14px;
    line-height: 24px;
    color: var(--222);
    margin-top: 20px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.program-contentLi .download{
    font-size: 12px;
    color: var(--888);
    margin-top: 10px;
}
.program-contentLi .download:hover{
    color: var(--blue);
}
.supplier-data{
    margin-bottom: 80px;
    background:var(--orange);
    margin-top: -60px;
    z-index: 1;
    padding-bottom:90px;
}
.supplier-data .program-title{
    padding-top:120px;
    color: var(--fff);
}
.supplier-data .dataul{
    width: 100%;
    margin: 0 auto;
    margin-top:70px;
    display: flex;
    justify-content: space-between;
    text-align: center;
    padding-bottom: 40px;
}
.supplier-data .dataul .datali{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.dataul .datali .datali-img{
    width: 100px;
    height: 100px;
}
.supplier-data .dataul .datali img{
    width: 100%;
}
.supplier-data .dataul .datali .text{
    font-size: 18px;
    color: var(--fff);
    margin-top: 20px;
}
/*--渚涘簲鍟嗘嫑鍟嗘祦绋 end--*/

/********杩囨浮鍔ㄧ敾********/

.btn ,
.headerfix,
.nav-ul li a .navline,
.copyright-box .btn-media .icomoon,
.brand-tab-ul .brand-li .navline,
.brand-ul .brand-li img,
.about-honorlist li .honorimg,
.dynamics-tab .dyna-news .dyna-newsli:hover,
.brand-li,.index-new-li .pic-box img,.footer-logo,.header,
.product-top .product-box .product-box-more,
.industry-dynamics .title-tab li,
.industry-dynamics .title-tab li .line,
.timeline .next,
.timeline .prev,
.brand-tool .toolwiper .right-icon:hover, .brand-tool .toolwiper .left-icon:hover,
.brand-tool-ul .current,
.product-top .product-box .featuredimg img,
.btn-txt .txt:hover,
.header-right .language:hover,
.logo .icomoon:hover,
.newswiper:hover .swiper-button-prev ,
.newswiper:hover .swiper-button-next ,
.dynamic-news .swiper-button-prev ,
.dynamic-news .swiper-button-next,
.join-idea .join-tab .join-tabli .line,
.join-idea .join-tab .join-tabli a,
.join-tablist .join-tablist-li .listimg,
.join-tablist .join-tablist-li .title,
.join-tablist .join-tablist-li .text,
.join-recruitment .recruitment li .recruitment-img img,
.join-systemli .text-main .text,
.li-right-content .righttext,
.choose-text .choose-search-text:hover,
.menu_body-content .duty-bottom .link:hover,
.popmain .close:hover,
.applyjob:hover,
.join-systemli .text img,
.join-systemli .verticalimg .icomoon,
.select-menu-ul li,
.menu_head,
.supplier-banner-text .supplier-download,
.category-list .swiper-button-left1 , .category-list .swiper-button-right1,
.brand-product .swiper-button-right1 , .brand-product .swiper-button-left1,
.category-content .category-more,
.category-content .showtitle,
.pagination .pageWrap ul li a, .pagination .pageWrap ul .sel-page a, .program-contentLi .download, .companyInfo-ul .companyInfo-li .btn_href,
.view .icomm,.view,.nav-about .title-tab li .line
{
    transition: all .3s;
    -moz-transition: all .3s;	/* Firefox 4 */
    -webkit-transition:all .3s;	/* Safari 鍜 Chrome */
    -o-transition:all .3s;	/* Opera */
}

@media (max-width: 1700px){
    .about-vision .mySwiper .about-vision-content{
        /*width: 83%;*/
    }
}
@media (max-width: 1600px){
    .about-vision-left .values{
        width: 90%;
    }
}
@media (max-width: 1440px){
    .about-vision .mySwiper .about-vision-zhong {
        margin-top:78px;
    }
    .about-vision-content .vision-label-last{
        margin-top: 70px;
    }
    .about-vision-content .vision-label{
        font-size:30px;
    }
    .about-vision-left .values li .text{
        font-size: 12px;
    }
    .program-contentLi .text{
        font-size: 14px;
    }
}
@media (max-width: 1366px){
    .brand-banner .swiper , .about-banner{
        height: 500px;
    }
    .about-banner .about-title, .brand-banner .banner-text .about-title , .supplier-banner-text .about-title{
        font-size: 48px;
        line-height: 64px;
    }
    .supplier-banner-text .supplier-download{
        font-size: 20px;
    }
    .supplier-banner-text .email{
        margin-top: 150px;
    }
    .news-banner .banner-text{
        top: 35%;
    }
    .about-vision .mySwiper .btn-next{
        bottom: 10px;
    }
    .about-vision .mySwiper {
        width: 100%;
        height: 600px;
        background:var(--aaa);
    }
    .about-vision .mySwiper .about-vision-content{
        padding-top: 70px;
    }
    .about-vision-content .about-vision-right{
        top: 70px;
    }
    .about-vision-content .about-vision-right .vision-num{
        padding-top: 77px;
    }
    .about-vision-left .values{
        margin-top: 50px;
        width: 88%;
    }
    .min-vision-label{
        width: 88%;
    }
    .timeline .issues li .event{
        margin-left: 0;
    }
}
@media (max-width: 1200px){
    .mapBoxnew{
        margin-left: -140px!important;
    }
    .mapBoxnew .area .placeUSA .pop{
        left: -31px;
    }
    .mapBoxnew .area .placeUSA .pop::before{
        left: 13%;
    }
    .mapBoxnew .area .placeMexico .pop{
        left: -53px;
    }
    .mapBoxnew .area .placeMexico .pop::before{
        left: 30%;
    }
    .mapBoxnew .area .placeAustralia .pop{
        left: -110px;
    }
    .mapBoxnew .area .placeAustralia .pop::before{
        left: 64%;
    }
}