html,body{
margin:0;
padding:0;
background-color:#000000;
-moz-user-select:none;
-webkit-user-select:none;
-ms-user-select:none;
-khtml-user-select:none;
user-select:none;
}
/*background-color:#FFFFFF;*/
/*opacity:0.5; IE9 + etc...modern browsers */
/*-webkit-opacity:0.5; older safari/Chrome browsers */
/*-moz-opacity:0.5; Netscape and Older than Firefox 0.9 */
/*-khtml-opacity:0.5; Safari 1.x (pre WebKit!) 老式khtml内核的Safari浏览器*/
/*filter:alpha(opacity=50); IE 4-9 */
/*-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; This works in IE 8 & 9 too*/
/*filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=50); IE4-IE9*/
/******自适应******/
/*背景---------------------------------------------------------------------*/
@media (min-width: 1000px){ /*Computer*/
#Background {position:absolute; overflow:hidden; z-index:1; opacity:1.0; display:none;/**/ width:100%; height:100%; left:0%; background-image:url('background.jpg'); background-position:center; background-size:cover; background-repeat:no-repeat;}
#Background- {position:absolute; overflow:hidden; z-index:2; opacity:1.0; display:none;/**/ width:50%; height:100%; left:0%;}
#Dot {position:absolute; overflow:hidden; z-index:3; opacity:1.0; display:none;/**/ width:100%; height:100%; background-image:url('contours.png'); background-position:center;}
#Shading {position:absolute; overflow:hidden; z-index:4; opacity:0.8; display:none;/**/ width:50%; height:100%; left:50%; background-image:url('shading.jpg'); background-position:center; background-size:cover; background-repeat:no-repeat;}
#Container {position:absolute; overflow:hidden; z-index:5; opacity:0.5; display:none;/**/ width:50%; height:100%; left:50%; background-color:#000000;}
#VideoBox {position:relative; overflow:hidden; z-index:2; opacity:1.0; /*display:none;*/ width:100%; height:100vh; background-color:#000000; /*进行视频裁剪*/ }
#VideoBox-Background {position:absolute; overflow:hidden; width:100%; height:100%; left:50%; top:50%; transform:translate(-50%, -50%); object-fit:cover; /*min-height:800px; 保证视频内容始终居中*/}
}
@media (max-width: 1000px){ /*Mobile*/
#Background {position:absolute; overflow:hidden; z-index:1; opacity:1.0; display:none;/**/ width:100%; height:100%; top:0%; background-image:url('background.jpg'); background-position:center; background-size:cover; background-repeat:no-repeat;}
#Background- {position:absolute; overflow:hidden; z-index:2; opacity:1.0; display:none;/**/ width:100%; height:100%; left:0%;}
#Dot {position:absolute; overflow:hidden; z-index:3; opacity:1.0; display:none;/**/ width:100%; height:100%; top:0%; background-image:url('contours.png'); background-position:center;}
#Shading {position:absolute; overflow:hidden; z-index:4; opacity:0.5; display:none;/**/ width:100%; height:50%; top:50%; background-image:url('shading.jpg'); background-position:center; background-size:cover; background-repeat:no-repeat;}
#Container {position:absolute; overflow:hidden; z-index:5; opacity:0.5; display:none;/**/ width:100%; height:100%; top:0%; background-color:#000000;}
#VideoBox {position:relative; overflow:hidden; z-index:2; opacity:1.0; /*display:none;*/ width:100%; height:100vh; background-color:#000000; /*进行视频裁剪*/ }
#VideoBox-Background {position:absolute; overflow:hidden; width:100%; height:100%; left:50%; top:50%; transform:translate(-50%, -50%); object-fit:cover; /*min-height:800px; 保证视频内容始终居中*/}
}
/*更多---------------------------------------------------------------------*/
@media (min-width: 1000px){ /*Computer*/
#More {position:absolute; overflow:hidden; z-index:98; width:50px; height:73px; left:25px; top:25px; /*mix-blend-mode: difference;*/}
.More {display:inline; width:50px; height:73px;}
/*图标*/.More-1 {fill:#FFFFFF; opacity:1; transition:all 0.5s linear;}
a:hover .More-1 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
/*英文*/.More-2 {fill:#FFFFFF; opacity:1; transition:all 0.5s linear;}
a:hover .More-2 {fill:#FFFFFF; opacity:0.0; transition:all 0.5s linear;}
/*中文*/.More-3 {fill:#FFFFFF; opacity:0.0; transition:all 0.5s linear;}
a:hover .More-3 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
}
@media (max-width: 1000px){ /*Mobile*/
#More {position:absolute; overflow:hidden; z-index:98; width:100px; height:146px; left:50px; top:50px; /*mix-blend-mode: difference;*/}
.More {display:inline; width:100px; height:146px;}
/*图标*/.More-1 {fill:#FFFFFF; opacity:1; transition:all 0.5s linear;}
a:hover .More-1 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
/*英文*/.More-2 {fill:#FFFFFF; opacity:0.0; transition:all 0.5s linear;}
a:hover .More-2 {fill:#FFFFFF; opacity:0.0; transition:all 0.5s linear;}
/*中文*/.More-3 {fill:#FFFFFF; opacity:1; transition:all 0.5s linear;}
a:hover .More-3 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
}
/*音乐---------------------------------------------------------------------*/
@media (min-width: 1000px){ /*Computer*/
#music {position:absolute; overflow:hidden; z-index:100; margin:0; padding:0; width:50px; height:73px; right:25px; top:25px;}
.open_music_div {position:absolute; overflow:hidden; margin:0; padding:0; width:50px; height:73px; right:0px; top:0px;}
.close_music_div {position:absolute; overflow:hidden; margin:0; padding:0; width:50px; height:73px; right:0px; top:0px;}
.music {display:inline; width:50px; height:73px;}
/*图标*/.music-1 {fill:#FFFFFF; opacity:1; transition:all 0.5s linear;}
a:hover .music-1 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
/*英播*/.music-2 {fill:#FFFFFF; opacity:1; transition:all 0.5s linear;}
a:hover .music-2 {fill:#FFFFFF; opacity:0.0; transition:all 0.5s linear;}
/*中播*/.music-3 {fill:#FFFFFF; opacity:0.0; transition:all 0.5s linear;}
a:hover .music-3 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
/*图标*/.music-4 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
a:hover .music-4 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
/*英停*/.music-5 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
a:hover .music-5 {fill:#FFFFFF; opacity:0.0; transition:all 0.5s linear;}
/*中停*/.music-6 {fill:#FFFFFF; opacity:0.0; transition:all 0.5s linear;}
a:hover .music-6 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
}
@media (max-width: 1000px){ /*Mobile*/
#music {position:absolute; overflow:hidden; z-index:100; margin:0; padding:0; width:100px; height:146px; right:50px; top:50px;}
.open_music_div {position:absolute; overflow:hidden; margin:0; padding:0; width:100px; height:146px; right:0px; top:0px;}
.close_music_div {position:absolute; overflow:hidden; margin:0; padding:0; width:100px; height:146px; right:0px; top:0px;}
.music {display:inline; width:100px; height:146px;}
/*图标*/.music-1 {fill:#FFFFFF; opacity:1; transition:all 0.5s linear;}
a:hover .music-1 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
/*英播*/.music-2 {fill:#000000; opacity:0.0; transition:all 0.5s linear;}
a:hover .music-2 {fill:#FFFFFF; opacity:0.0; transition:all 0.5s linear;}
/*中播*/.music-3 {fill:#FFFFFF; opacity:1; transition:all 0.5s linear;}
a:hover .music-3 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
/*图标*/.music-4 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
a:hover .music-4 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
/*英停*/.music-5 {fill:#FFFFFF; opacity:0.0; transition:all 0.5s linear;}
a:hover .music-5 {fill:#FFFFFF; opacity:0.0; transition:all 0.5s linear;}
/*中停*/.music-6 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
a:hover .music-6 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
}
/*标志---------------------------------------------------------------------*/
@media (min-width: 1000px){ /*Computer*/
#Logo {position:absolute; overflow:hidden; z-index:97; opacity:1.0; display:none;/**/ width:400px; height:276px; left:25%; top:50%; margin-left:-200px; margin-top:-138px; /*mix-blend-mode: difference;*/}
.Logo {display:inline; width:400px; height:276px;}
.Logo-1 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
a:hover .Logo-1 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
.Logo-2 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
a:hover .Logo-2 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
.Logo-3 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
a:hover .Logo-3 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
#LogoBoxC {position:absolute; overflow:hidden; z-index:98; opacity:1.0; display:none;/**/ width:300px; height:157px; left:75%; top:50%; margin-left:-225px; margin-top:-228.5px; background-color:#000000; /*进行视频裁剪*/ -webkit-mask-image: url('../img/logoc.svg'); mask-image: url('../img/logoc.svg');}
#LogoBoxC-Background {position:absolute; overflow:hidden; width:100%; height:100%; object-fit:cover; /*保证视频内容始终居中*/}
#LogoBoxM {position:absolute; overflow:hidden; z-index:98; opacity:1.0; display:none;/**/ width:500px; height:262px; left:50%; top:25%; margin-left:-250px; margin-top:-11px; background-color:#000000; /*进行视频裁剪*/ -webkit-mask-image: url('../img/logom.svg'); mask-image: url('../img/logom.svg');}
#LogoBoxM-Background {position:absolute; overflow:hidden; width:100%; height:100%; object-fit:cover; /*保证视频内容始终居中*/}
}
@media (max-width: 1000px){ /*Mobile*/
#Logo {position:absolute; overflow:hidden; z-index:97; opacity:1.0; display:none;/**/ width:550px; height:380px; left:50%; top:25%; margin-left:-275px; margin-top:0px; /*mix-blend-mode: difference;*/}
.Logo {display:inline; width:550px; height:380px;}
.Logo-1 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
a:hover .Logo-1 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
.Logo-2 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
a:hover .Logo-2 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
.Logo-3 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
a:hover .Logo-3 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
#LogoBoxC {position:absolute; overflow:hidden; z-index:98; opacity:1.0; display:none;/**/ width:300px; height:157px; left:75%; top:50%; margin-left:-225px; margin-top:-228.5px; background-color:#000000; /*进行视频裁剪*/ -webkit-mask-image: url('../img/logoc.svg'); mask-image: url('../img/logoc.svg');}
#LogoBoxC-Background {position:absolute; overflow:hidden; width:100%; height:100%; object-fit:cover; /*保证视频内容始终居中*/}
#LogoBoxM {position:absolute; overflow:hidden; z-index:98; opacity:1.0; display:none;/**/ width:500px; height:262px; left:50%; top:25%; margin-left:-250px; margin-top:-11px; background-color:#000000; /*进行视频裁剪*/ -webkit-mask-image: url('../img/logom.svg'); mask-image: url('../img/logom.svg');}
#LogoBoxM-Background {position:absolute; overflow:hidden; width:100%; height:100%; object-fit:cover; /*保证视频内容始终居中*/}
}
/*Hi-domain---------------------------------------------------------------------*/
@media (min-width: 1000px){ /*Computer*/
#Hi-domain {position:absolute; overflow:hidden; z-index:97; opacity:1.0; /*display:none;*/ width:300px; height:157px; left:75%; top:50%; margin-left:-225px; margin-top:-228.5px; /*mix-blend-mode: difference;*/}
.Hi-domain {display:inline; width:300px; height:157px;}
.Hi-domain-1 {fill:#111111; opacity:0.0; transition:all 0.5s linear; fill-rule:nonzero;}
a:hover .Hi-domain-1 {fill:#111111; opacity:0.0; transition:all 0.5s linear; fill-rule:nonzero;}
.Hi-domain-2 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
a:hover .Hi-domain-2 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
.Hi-domain-3 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
a:hover .Hi-domain-3 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
}
@media (max-width: 1000px){ /*Mobile*/
#Hi-domain {position:absolute; overflow:hidden; z-index:97; opacity:1.0; display:none;/**/ width:500px; height:262px; left:50%; top:25%; margin-left:-250px; margin-top:-11px; /*mix-blend-mode: difference;*/}
.Hi-domain {display:inline; width:500px; height:262px;}
.Hi-domain-1 {fill:#111111; opacity:0.0; transition:all 0.5s linear; fill-rule:nonzero;}
a:hover .Hi-domain-1 {fill:#111111; opacity:0.0; transition:all 0.5s linear; fill-rule:nonzero;}
.Hi-domain-2 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
a:hover .Hi-domain-2 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
.Hi-domain-3 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
a:hover .Hi-domain-3 {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear; fill-rule:nonzero;}
}
/*按钮---------------------------------------------------------------------*/
@media (min-width: 1000px){ /*Computer*/
/*常显*/.Button-A {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
a:hover .Button-A {fill:#FFFFFF; opacity:0.0; transition:all 0.5s linear;}
/*触碰*/.Button-B {fill:#FFFFFF; opacity:0.0; transition:all 0.5s linear;}
a:hover .Button-B {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
}
@media (max-width: 1000px){ /*Mobile*/
/*常显*/.Button-A {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
a:hover .Button-A {fill:#FFFFFF; opacity:0.0; transition:all 0.5s linear;}
/*触碰*/.Button-B {fill:#FFFFFF; opacity:0.0; transition:all 0.5s linear;}
a:hover .Button-B {fill:#FFFFFF; opacity:1.0; transition:all 0.5s linear;}
}
/*促销---------------------------------------------------------------------*/
@media (min-width: 1000px){ /*Computer*/
#Money70 {position:absolute; overflow:hidden; z-index:98; opacity:1.0; /*display:none;*/ width:60px; height:60px; right:25%; top:50%; margin-right:170px; margin-top:45px; /*mix-blend-mode: difference;*/}
#Money90 {position:absolute; overflow:hidden; z-index:98; opacity:1.0; /*display:none;*/ width:60px; height:60px; right:25%; top:50%; margin-right:90px; margin-top:45px; /*mix-blend-mode: difference;*/}
#Money100 {position:absolute; overflow:hidden; z-index:98; opacity:1.0; /*display:none;*/ width:60px; height:60px; right:25%; top:50%; margin-right:10px; margin-top:45px; /*mix-blend-mode: difference;*/}
.Money {display:inline; width:60px; height:30px;}
.Money-1 {fill:none;}
.Money-2 {fill:#FFFFFF; opacity:0.4; fill-rule:nonzero;}
}
@media (max-width: 1000px){ /*Mobile*/
#Money70 {position:absolute; overflow:hidden; z-index:98; opacity:1.0; /*display:none;*/ width:120px; height:60px; right:50%; top:75%; margin-right:120px; margin-top:-230px; /*mix-blend-mode: difference;*/}
#Money90 {position:absolute; overflow:hidden; z-index:98; opacity:1.0; /*display:none;*/ width:120px; height:60px; right:50%; top:75%; margin-right:-60px; margin-top:-230px; /*mix-blend-mode: difference;*/}
#Money100 {position:absolute; overflow:hidden; z-index:98; opacity:1.0; /*display:none;*/ width:120px; height:60px; right:50%; top:75%; margin-right:-240px; margin-top:-230px; /*mix-blend-mode: difference;*/}
.Money {display:inline; width:120px; height:60px;}
.Money-1 {fill:none;}
.Money-2 {fill:#FFFFFF; opacity:0.4; fill-rule:nonzero;}
}
/*自述---------------------------------------------------------------------*/
@media (min-width: 1000px){ /*Computer*/
#Readme {position:absolute; overflow:hidden; z-index:98; /*display:none;*/ width:460px; right:25%; top:50%; margin-right:-230px; margin-top:90px; /*mix-blend-mode: difference;*/}
.Readme {color:#FFFFFF; font-size:12px; text-decoration:none; text-indent:24px; opacity:0.4; transition:all 0.5s linear;}
.Readme p {line-height:18px;}
}
@media (max-width: 1000px){ /*Mobile*/
#Readme {position:absolute; overflow:hidden; z-index:98; display:none;/**/ width:460px; right:25%; top:50%; margin-right:-230px; margin-top:90px; /*mix-blend-mode: difference;*/}
.Readme {color:#FFFFFF; font-size:12px; text-decoration:none; text-indent:24px; opacity:0.4; transition:all 0.5s linear;}
.Readme p {line-height:18px;}
}
/*版权---------------------------------------------------------------------*/
@media (min-width: 1000px){ /*Computer*/
#Rights{position:absolute; z-index:99; display:none;/**/ height:25px; width:50%; bottom:30px; left:0%; text-align:center; /*mix-blend-mode: difference;*/}
.Rights {color:#FFFFFF; font-size:12px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Rights a {color:#FFFFFF; font-size:12px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Rights a:link {color:#FFFFFF; font-size:12px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Rights a:visited {color:#FFFFFF; font-size:12px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Rights a:active {color:#FFFFFF; font-size:12px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Rights a:hover {color:#FFFFFF; font-size:12px; text-decoration:none; opacity:1.0; transition:all 0.5s linear;}
}
@media (max-width: 1000px){ /*Mobile*/
#Rights{position:absolute; z-index:99; display:none;/**/ height:25px; width:100%; bottom:60px; left:0%; text-align:center; /*mix-blend-mode: difference;*/}
.Rights {color:#FFFFFF; font-size:20px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Rights a {color:#FFFFFF; font-size:20px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Rights a:link {color:#FFFFFF; font-size:20px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Rights a:visited {color:#FFFFFF; font-size:20px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Rights a:active {color:#FFFFFF; font-size:20px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Rights a:hover {color:#FFFFFF; font-size:20px; text-decoration:none; opacity:1.0; transition:all 0.5s linear;}
}
/*声明---------------------------------------------------------------------*/
@media (min-width: 1000px){ /*Computer*/
#Statement{position:absolute; z-index:99; /*display:none;*/ height:25px; width:50%; bottom:30px; right:0%; text-align:center; /*mix-blend-mode: difference;*/}
.Statement {color:#FFFFFF; font-size:12px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Statement a {color:#FFFFFF; font-size:12px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Statement a:link {color:#FFFFFF; font-size:12px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Statement a:visited {color:#FFFFFF; font-size:12px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Statement a:active {color:#FFFFFF; font-size:12px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Statement a:hover {color:#FFFFFF; font-size:12px; text-decoration:none; opacity:1.0; transition:all 0.5s linear;}
}
@media (max-width: 1000px){ /*Mobile*/
#Statement{position:absolute; z-index:99; /*display:none;*/ height:25px; width:100%; bottom:60px; right:0%; text-align:center; /*mix-blend-mode: difference;*/}
.Statement {color:#FFFFFF; font-size:20px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Statement a {color:#FFFFFF; font-size:20px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Statement a:link {color:#FFFFFF; font-size:20px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Statement a:visited {color:#FFFFFF; font-size:20px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Statement a:active {color:#FFFFFF; font-size:20px; text-decoration:none; opacity:0.4; transition:all 0.5s linear;}
.Statement a:hover {color:#FFFFFF; font-size:20px; text-decoration:none; opacity:1.0; transition:all 0.5s linear;}
}