/* Fonts */
/*通用*/
*{ margin:0; padding:0;}
html{}
body{margin:0;color:#252525; position: relative; font-family: "Arial"}
ul,li,p,h1,h2,h3,h4,h5,h6,dl,dt,dd {margin:0px;padding:0px;border:none;list-style:none; font-weight: normal;}
a{text-decoration:none;  text-shadow:none;font-weight:normal;}
ul{list-style:none;}
textarea,input,button,select{outline:none;-webkit-appearance:none; font-family:Arial, Helvetica, sans-serif;}
a{color:#6c6c6c;text-decoration:none;}
img{border:none; display: block;}
span{margin:0; padding:0; cursor: auto;}
span:focus,div:focus {outline: none;}

.flex{display:-webkit-box;display: -ms-flexbox;display:flex;flex-wrap:wrap;align-items:flex-start;}
.flexC{display:-webkit-box;display: -ms-flexbox;display:flex;align-items:center; flex-wrap:wrap;}
.fl-bet{-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content:space-between;}
.fl-cen{-webkit-box-pack: center;-ms-flex-pack: center;justify-content:center;}
.fl-end{-webkit-box-pack:right;-ms-flex-pack:right;justify-content:flex-end;}


html {scroll-behavior: smooth;}
body {font-weight: 300;}
main {max-width: var(--main-column-width);margin: 0 auto; text-align: center;}

.Huans {-webkit-box-sizing:border-box;box-sizing:border-box;}
/*header*/
.header{width:100%;background:#FFF; z-index:99; position:fixed; left:0;right:0; margin:0 auto; top:0; box-shadow:0 0 8px rgba(0,0,0,0.1);}
.headK{position:relative;}
.hdlogo p{ color:#b2a9f5;}
.hdlogo p span{ display:inline-block; margin-right:0;animation:Updown 1.5s infinite alternate;-webkit-animation:Updown 1.5s alternate infinite}
.headO{background:none;box-shadow:0 0 0 rgba(0,0,0,0); border-bottom:1px solid rgba(255,255,255,0.2);}
@keyframes Updown{
	from{margin-right:6px;}
	to{margin-right:0px;}
}
@-webkit-keyframes Updown{
	from{margin-right:6px;}
	to{margin-right:8px;}
}
/*footer*/
footer { color:#FFF;background:#211e36;}
.ftlog img{display: block;}
.ftlog p{color:#b2a9f5;}
.ftI{display:block;background-image:url("../images/icon/ftI01.png");background-size:100%;background-repeat:no-repeat;}
.ftI1{background-position: 0 0;}
.ftHT p{opacity:0.6;}
.ftHN{opacity:0.7;}
.ftM{display: block; text-align: center; color:#fff;}
.ftM img{width:100%; display: block;}
.ftC{text-align: center;color:#757a83;}
.ftC a{color:#757a83;}
@media  screen and ( min-width:1400px){
.ward{width:1200px; margin:0 auto}
/*header*/
.hdlogo p{ font-size:14px;line-height:18px; margin-left: 12px;}
.headK{ height:100px;}
.hdlogo img{width:171px; display: block;}
.hd_nav{ display: none;}
.Menu{ display: block;}
.Menu ul{}
.Menu ul li{ margin-right:55px; position: relative}
.MenuA{ line-height:100px;font-size:16px; color:#000; position: relative; display: block;}
.MenuA:before{display:block;content:'';position: absolute;transition:0.5s; background:#8556f8; width:0; height:2px; left:0;right:0; margin:0 auto; bottom:-1px;}
.Menu ul li .on,.Menu ul li .menuO,.Menu ul li .MenuA:hover{ color:#8556f8;}
.Menu ul li .on:before,.Menu ul li .menuO:before,.Menu ul li .MenuA:hover:before{ transition:0.5s;  width:100%;}
.headO .MenuA{ color:#FFF;}
.headO .Menu ul li .on,.headO .Menu ul li .menuO,.headO .Menu ul li .MenuA:hover{ color:#fff;}
.headO .Menu ul li .on:before, .headO .Menu ul li .menuO:before, .headO .Menu ul li .MenuA:hover:before{background:#fff;}
/*footer*/
.ftK{ padding:70px 0 50px}
.ftlog{width:171px;}
.ftlog img{width:171px;}
.ftlog p{ font-size:14px;line-height:20px; margin-top:5px;}
.ftH{}
.ftHT{}
.ftI{ width: 18px; height: 18px;}
.ftI2{background-position: 0 -18px;}
.ftI3{background-position: 0 -36px;}
.ftHT p{width:100%;font-size: 14px; line-height:20px; margin-top:10px;}
.ftHN{ font-size: 28px; line-height:34px;margin-top: 20px;}
.ftM{width:97px;}
.ftM p{ font-size:12px; line-height:20px; margin-top:5px;}
.ftC{border-top:1px solid #424054;line-height:32px; padding:10px 0; font-size: 12px;}
}
@media screen and (max-width:1439px ) and ( min-width:1280px){
.ward{width:1080px; margin:0 auto}
/*header*/
.hdlogo p{ font-size:13px;line-height:16px; margin-left: 12px;}
.headK{ height:82px;}
.hdlogo img{width:160px; display: block;}

.hd_nav{ display: none;}
.Menu{ display: block;}
.Menu ul{}
.Menu ul li{ margin-right:48px; position: relative}
.MenuA{ line-height:82px;font-size:15px; color:#000; position: relative; display: block;}
.MenuA:before{display:block;content:'';position: absolute;transition:0.5s; background:#8556f8; width:0; height:2px; left:0;right:0; margin:0 auto; bottom:-1px;}
.Menu ul li .on,.Menu ul li .menuO,.Menu ul li .MenuA:hover{ color:#8556f8;}
.Menu ul li .on:before,.Menu ul li .menuO:before,.Menu ul li .MenuA:hover:before{ transition:0.5s;  width:100%;}
.headO .MenuA{ color:#FFF;}
.headO .Menu ul li .on,.headO .Menu ul li .menuO,.headO .Menu ul li .MenuA:hover{ color:#fff;}
.headO .Menu ul li .on:before, .headO .Menu ul li .menuO:before, .headO .Menu ul li .MenuA:hover:before{background:#fff;}
/*footer*/
.ftK{ padding:60px 0 40px}
.ftlog{width:160px;}
.ftlog img{width:160px;}
.ftlog p{ font-size:13px;line-height:20px; margin-top:5px;}
.ftH{}
.ftHT{}
.ftI{ width: 18px; height: 18px;}
.ftI2{background-position: 0 -18px;}
.ftI3{background-position: 0 -36px;}
.ftHT p{width:100%; font-size: 14px; line-height:20px; margin-top:8px;}
.ftHN{ font-size: 26px; line-height:30px;margin-top: 20px;}
.ftM{width:90px;}
.ftM p{ font-size:12px; line-height:20px; margin-top:4px;}
.ftC{border-top:1px solid #424054;line-height:28px; padding:10px 0; font-size: 12px;}
}
@media screen and (max-width:1279px ) and ( min-width:960px){
.ward{width:900px; margin:0 auto}
/*header*/
.hdlogo p{ font-size:12px;line-height:15px; margin-left:8px;}
.headK{ height:66px;}
.hdlogo img{width:142px; display: block;}

.hd_nav{ display: none;}
.Menu{ display: block;}
.Menu ul{}
.Menu ul li{ margin-right:40px; position: relative}
.MenuA{ line-height:66px;font-size:14px; color:#000; position: relative; display: block;}
.MenuA:before{display:block;content:'';position: absolute;transition:0.5s; background:#8556f8; width:0; height:2px; left:0;right:0; margin:0 auto; bottom:-1px;}
.Menu ul li .on,.Menu ul li .menuO,.Menu ul li .MenuA:hover{ color:#8556f8;}
.Menu ul li .on:before,.Menu ul li .menuO:before,.Menu ul li .MenuA:hover:before{ transition:0.5s;  width:100%;}
.headO .MenuA{ color:#FFF;}
.headO .Menu ul li .on,.headO .Menu ul li .menuO,.headO .Menu ul li .MenuA:hover{ color:#fff;}
.headO .Menu ul li .on:before, .headO .Menu ul li .menuO:before, .headO .Menu ul li .MenuA:hover:before{background:#fff;}
/*footer*/
.ftK{ padding:50px 0 30px}
.ftlog{width:145px;}
.ftlog img{width:145px;}
.ftlog p{ font-size:12px;line-height:18px; margin-top:5px;}
.ftH{}
.ftHT{}
.ftI{ width: 18px; height: 18px;}
.ftI2{background-position: 0 -18px;}
.ftI3{background-position: 0 -36px;}
.ftHT p{width:100%; font-size: 13px; line-height:20px; margin-top:6px;}
.ftHN{ font-size: 22px; line-height:28px;margin-top:14px;}
.ftM{width:84px;}
.ftM p{ font-size:12px; line-height:18px; margin-top:4px;}
.ftC{border-top:1px solid #424054;line-height:24px; padding:9px 0; font-size: 12px;}
}
@media screen and (max-width:959px ) and ( min-width:640px){
.ward{width:600px; margin:0 auto}	
/*header*/
.headK{ height:56px; width: 92%; margin:0 auto;}
.hdlogo p{ font-size:12px;line-height:14px; margin-left:6px;}
.hdlogo img{width:130px; display: block;}
/*header*/
.hd_nav{width:30px;height:30px; position:relative; z-index:999;}
.hd_nav i{top:50%;margin-top:-1px;position:absolute;display:inline-block;height:3px;width:30px;border-radius:2px;background:#503dff;}
.hd_nav:before{margin-top: -10px;}
.hd_nav:after{margin-top:10px;}
.hd_nav:before,.hd_nav:after{content: '';position:absolute;top:50%;display:inline-block;height:3px;width:30px;border-radius:2rem;background:#503dff;transition:0.2s;}
.hd_nav.active i{display:none;}
.hd_nav.active:before{transform: rotate(45deg);}
.hd_nav.active:after{transform: rotate(-45deg);}
.hd_nav.active:before,.hd_nav.active:after{margin-top:0;background:#ffffff;}
.Menu{position:fixed;width:100%;height:100%;top:0;left:0;background:rgba(0, 0, 0, 0.8);z-index:997; display:none;}
.Menu ul{ padding-top:70px;}
.Menu ul li{width:100%; position: relative}
.MenuA{ line-height:56px;font-size:16px; color:#FFF; position: relative; display: block; padding:0 4%;}
.MenuA:before{display:block;content:'';position: absolute;transition:0.5s; background:#503dff; width:3px; height:0; left:0;top:0;}
.Menu ul li .on,.Menu ul li .menuO,.Menu ul li .MenuA:hover{ color:#503dff;}
.Menu ul li .on:before,.Menu ul li .menuO:before{ transition:0.5s; height:100%;}

/*footer*/
.ftK{ padding:40px 0 20px}
.ftlog{width:100%; margin-bottom:25px;}
.ftlog img{width:145px;}
.ftlog p{ font-size:12px;line-height:18px; margin-top:5px;}
.ftH{}
.ftHT{}
.ftI{ width: 18px; height: 18px;}
.ftI2{background-position: 0 -18px;}
.ftI3{background-position: 0 -36px;}
.ftHT p{font-size: 13px; line-height:20px; margin-left:6px;}
.ftHN{ font-size: 22px; line-height:25px;margin-top:10px;}
.ftM{width:100%; margin-top:26px;}
.ftM img{width:97px; margin:0 auto;}
.ftM p{ font-size:12px; line-height:18px; margin-top:4px;}
.ftC{border-top:1px solid #424054;line-height:22px; padding:7px 0; font-size: 12px;}
}
@media only screen and (max-width:639px){
/*header*/
.headK{ height:0.44rem; width: 92%; margin:0 auto;}
.hdlogo{height:0.18em;}
.hdlogo img{height:100%; display: block;}
.hdlogo p{ font-size:0.09rem;line-height:0.1rem; margin-left:0.03rem;}
/*header*/
.hd_nav{width:0.22rem;height:0.2rem; position:relative; z-index:999;}
.hd_nav i{top:50%;margin-top:-0.01rem;position:absolute;display:inline-block;height:0.02rem;width:100%;border-radius:2px;background:#503dff;}
.hd_nav:before{margin-top:-0.07rem;}
.hd_nav:after{margin-top:0.05rem;}
.hd_nav:before,.hd_nav:after{content: '';position:absolute;display:inline-block;height:3px;width:100%;border-radius:2rem;background:#503dff;transition:0.2s; top:50%}
.hd_nav.active i{display:none;}
.hd_nav.active:before{transform: rotate(45deg);}
.hd_nav.active:after{transform: rotate(-45deg);}
.hd_nav.active:before,.hd_nav.active:after{margin-top:0;background:#ffffff;}
.Menu{position:fixed;width:100%;height:100%;top:0;left:0;background:rgba(0, 0, 0, 0.8);z-index:997; display:none;}
.Menu ul{ padding-top:0.5rem;}
.Menu ul li{width:100%; position: relative}
.MenuA{ line-height:0.4rem;font-size:0.13rem; color:#FFF; position: relative; display: block; padding:0 5%;}
.MenuA:before{display:block;content:'';position: absolute;transition:0.5s; background:#503dff; width:0.03rem; height:0; left:0;top:0;}
.Menu ul li .on,.Menu ul li .menuO,.Menu ul li .MenuA:hover{ color:#503dff;}
.Menu ul li .on:before,.Menu ul li .menuO:before{ transition:0.5s; height:100%;}
	
/*footer*/
.ftK{ padding:0.24rem 4% 0.15rem}
.ftlog{width:100%; margin-bottom:0.18rem;}
.ftlog img{height:0.2rem;}
.ftlog p{ font-size:0.1rem;line-height:0.16rem; margin-top:0.03rem;}
.ftH{display:flex;align-items:center; margin-bottom:0.06rem;}
.ftHT{}
.ftI{ width:0.14rem; height: 0.14rem;}
.ftI2{background-position: 0 -0.14rem;}
.ftI3{background-position: 0 -0.28rem;}
.ftHT p{font-size: 0.11rem; line-height:0.2rem; margin-left:0.04rem;}
.ftHN{ font-size:0.16rem; line-height:0.2rem; margin-left: 0.06rem;}
.ftM{width:100%; margin-top:0.1rem;}
.ftM img{width:0.8rem; margin:0 auto;}
.ftM p{ font-size:0.1rem; line-height:0.18rem; margin-top:0.03rem;}
.ftC{border-top:0.01rem solid #424054;line-height:0.18rem; padding:0.05rem 4%; font-size:0.1rem;}
}


@media screen and (min-width:960px){
.Run{transition:All 0.6s ease-in-out;-webkit-transition:All 0.6s ease-in-out;-moz-transition:All 0.6s ease-in-out;-o-transition:All 0.6s ease-in-out;}
.Run:hover{transform:rotate(180deg);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-o-transform:rotate(180deg);-ms-transform: rotate(180deg);}
.Run2 img{transition:All 0.6s ease-in-out;-webkit-transition:All 0.6s ease-in-out;-moz-transition:All 0.6s ease-in-out;-o-transition:All 0.6s ease-in-out;}
.Run2 img:hover{transform:rotate(360deg);-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);-ms-transform: rotate(360deg);}
.Run1{transition:All 0.6s ease-in-out;-webkit-transition:All 0.6s ease-in-out;-moz-transition:All 0.6s ease-in-out;-o-transition:All 0.6s ease-in-out;}
.Run1:hover img{transform:rotatex(180deg);-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);-o-transform:rotateY(180deg);-ms-transform: rotateY(180deg);}
.Mover{transition:0.5s;transition:All 0.4s ease-in-out;-webkit-transition:All 0.4s ease-in-out;-moz-transition:All 0.4s ease-in-out;-o-transition:All 0.4s ease-in-out;}
.Mover:hover{transition:0.5s;ransform:translate(0,-10px);-webkit-transform:translate(0,-10px);-moz-transform:translate(0,-10px);-o-transform:translate(0,-10px);-ms-transform:translate(0,-10px);}
.Mover1{transition:0.5s;transition:All 0.4s ease-in-out;-webkit-transition:All 0.4s ease-in-out;-moz-transition:All 0.4s ease-in-out;-o-transition:All 0.4s ease-in-out;}
.Mover1:hover{transition:0.5s;ransform:translate(10px,0);-webkit-transform:translate(10px,0);-moz-transform:translate(10px,0);-o-transform:translate(10px,0);-ms-transform:translate(10px,0);}
.enlarge img{ width:100%;transition:0.5s;}
.enlarge:hover img{-ms-transform:scale(1.05);-moz-transform:scale(1.05);-webkit-transform:scale(1.05);-o-transform:scale(1.05);transform:scale(1.05); transition:0.5s;}
.IndSupA{ width:100%;transition:0.5s;}
.IndSupA:hover{-ms-transform:scale(1.05);-moz-transform:scale(1.05);-webkit-transform:scale(1.05);-o-transform:scale(1.05);transform:scale(1.05); transition:0.5s;}

}
html {font-size: 625%; /*100 ÷ 16 × 100% = 625%*/}
/*出的各分辨率媒体查询换算：*/
@media screen and (min-width:360px) and (max-width:374px) and (orientation:portrait){html{font-size:703%;}}
@media screen and (min-width:375px) and (max-width:383px) and (orientation:portrait){html{font-size:732.4%;}}
@media screen and (min-width:384px) and (max-width:399px) and (orientation:portrait){html{font-size:750%; }}
@media screen and (min-width:400px) and (max-width:413px) and (orientation:portrait){html{font-size:781.25%;}}
@media screen and (min-width:414px) and (max-width:431px) and (orientation:portrait){html{font-size:808.6%;}}
@media screen and (min-width:432px) and (max-width:479px) and (orientation:portrait){html {font-size:843.75%;}}

/*
display:flex;justify-content:space-between;align-items:center; flex-wrap:wrap;align-content:center
|flex-start|flex-end|center|space-between|space-around

overflow: hidden;text-overflow:ellipsis;white-space: nowrap;
display:-webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;

transition:0.5s;
.IndEnvT:before,.IndEnvT:after{display:block;content:'';position: absolute;}
*/

