[data-dirtype] .wrapper{padding-bottom:0}
.Footer__footerContent__22G1u,.ProductFooter__productFooterContainer__Z6Bel.ProductFooter__productBackgroundBlack__24n1I,.ProductRecommenedRelated__productRecommendRelatedContainer__3Akgf,.ProductTabBar__productTabBarContainer__1e5nP,.overviewAwardsContent,.overviewSimpleContent{position:relative;z-index:2}
.ProductTabBar__productTabBarContainer__1e5nP{position:relative;z-index:3}
.Product__onFixed__119Rh{display:none}
.ProductTabBar__productTabBarContainer__1e5nP.ProductTabBar__isFixed__3fX1Q{position:relative}
.width-line-gray{background:0 0}
.clear-style{font-family:Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif;background:#070b15;color:#fff;font-size:16px;margin:0;padding:0;position:relative;overflow:hidden}
.clear-style *{text-decoration:none;list-style-type:none;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;word-wrap:break-word;word-break:break-word}
.clear-style * ::selection{background:#1d2124;color:#59bbff}
.clear-style * ::-moz-selection{background:#1d2124;color:#59bbff}
.clear-style figure,.clear-style li,.clear-style ul{margin:0;padding:0}
.clear-style a,.clear-style h1,.clear-style h2,.clear-style h3,.clear-style h4,.clear-style li,.clear-style p{font:inherit;padding:0;margin:0}
.clear-style img{display:block;height:auto;border:none;max-width:100%!important;margin:0}
.clear-style img.lazyload{opacity:0;-moz-transition:opacity .5s ease;-o-transition:opacity .5s ease;-webkit-transition:opacity .5s ease;transition:opacity .5s ease}
.clear-style iframe,.clear-style video{max-width:100%}
.clear-style button{background:0 0;border:none;border-radius:0;box-shadow:none;-webkit-appearance:none;appearance:none}
.clear-style .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.clear-style [role=button]:focus-visible,.clear-style [tabindex="0"]:focus-visible,.clear-style a:focus-visible,.clear-style button:focus-visible,.clear-style input:focus-visible,.clear-style select:focus-visible,.clear-style textarea:focus-visible{outline:1px solid #59bbff}
.clear-style [role=button]:focus:not(:focus-visible),.clear-style [tabindex="0"]:focus:not(:focus-visible),.clear-style a:focus:not(:focus-visible),.clear-style button:focus:not(:focus-visible),.clear-style input:focus:not(:focus-visible),.clear-style select:focus:not(:focus-visible),.clear-style textarea:focus:not(:focus-visible){outline:0}
@-webkit-keyframes zoomIn{
0%{opacity:0;-moz-transform:scale(.9,.9);-o-transform:scale(.9,.9);-ms-transform:scale(.9,.9);-webkit-transform:scale(.9,.9);transform:scale(.9,.9)}
100%{opacity:1;-moz-transform:scale(1,1);-o-transform:scale(1,1);-ms-transform:scale(1,1);-webkit-transform:scale(1,1);transform:scale(1,1)}
}
@-moz-keyframes zoomIn{
0%{opacity:0;-moz-transform:scale(.9,.9);-o-transform:scale(.9,.9);-ms-transform:scale(.9,.9);-webkit-transform:scale(.9,.9);transform:scale(.9,.9)}
100%{opacity:1;-moz-transform:scale(1,1);-o-transform:scale(1,1);-ms-transform:scale(1,1);-webkit-transform:scale(1,1);transform:scale(1,1)}
}
@-ms-keyframes zoomIn{
0%{opacity:0;-moz-transform:scale(.9,.9);-o-transform:scale(.9,.9);-ms-transform:scale(.9,.9);-webkit-transform:scale(.9,.9);transform:scale(.9,.9)}
100%{opacity:1;-moz-transform:scale(1,1);-o-transform:scale(1,1);-ms-transform:scale(1,1);-webkit-transform:scale(1,1);transform:scale(1,1)}
}
@-o-keyframes zoomIn{
0%{opacity:0;-moz-transform:scale(.9,.9);-o-transform:scale(.9,.9);-ms-transform:scale(.9,.9);-webkit-transform:scale(.9,.9);transform:scale(.9,.9)}
100%{opacity:1;-moz-transform:scale(1,1);-o-transform:scale(1,1);-ms-transform:scale(1,1);-webkit-transform:scale(1,1);transform:scale(1,1)}
}
@keyframes zoomIn{
0%{opacity:0;-moz-transform:scale(.9,.9);-o-transform:scale(.9,.9);-ms-transform:scale(.9,.9);-webkit-transform:scale(.9,.9);transform:scale(.9,.9)}
100%{opacity:1;-moz-transform:scale(1,1);-o-transform:scale(1,1);-ms-transform:scale(1,1);-webkit-transform:scale(1,1);transform:scale(1,1)}
}
@-webkit-keyframes showBtn{
0%{opacity:0;-moz-transform:scale(.4,.4) rotate(-90deg);-o-transform:scale(.4,.4) rotate(-90deg);-ms-transform:scale(.4,.4) rotate(-90deg);-webkit-transform:scale(.4,.4) rotate(-90deg);transform:scale(.4,.4) rotate(-90deg)}
50%{opacity:1}
70%{opacity:1;-moz-transform:scale(1,1);-o-transform:scale(1,1);-ms-transform:scale(1,1);-webkit-transform:scale(1,1);transform:scale(1,1)}
100%{opacity:1;-moz-transform:scale(1,1) rotate(0);-o-transform:scale(1,1) rotate(0);-ms-transform:scale(1,1) rotate(0);-webkit-transform:scale(1,1) rotate(0);transform:scale(1,1) rotate(0)}
}
@-moz-keyframes showBtn{
0%{opacity:0;-moz-transform:scale(.4,.4) rotate(-90deg);-o-transform:scale(.4,.4) rotate(-90deg);-ms-transform:scale(.4,.4) rotate(-90deg);-webkit-transform:scale(.4,.4) rotate(-90deg);transform:scale(.4,.4) rotate(-90deg)}
50%{opacity:1}
70%{opacity:1;-moz-transform:scale(1,1);-o-transform:scale(1,1);-ms-transform:scale(1,1);-webkit-transform:scale(1,1);transform:scale(1,1)}
100%{opacity:1;-moz-transform:scale(1,1) rotate(0);-o-transform:scale(1,1) rotate(0);-ms-transform:scale(1,1) rotate(0);-webkit-transform:scale(1,1) rotate(0);transform:scale(1,1) rotate(0)}
}
@-ms-keyframes showBtn{
0%{opacity:0;-moz-transform:scale(.4,.4) rotate(-90deg);-o-transform:scale(.4,.4) rotate(-90deg);-ms-transform:scale(.4,.4) rotate(-90deg);-webkit-transform:scale(.4,.4) rotate(-90deg);transform:scale(.4,.4) rotate(-90deg)}
50%{opacity:1}
70%{opacity:1;-moz-transform:scale(1,1);-o-transform:scale(1,1);-ms-transform:scale(1,1);-webkit-transform:scale(1,1);transform:scale(1,1)}
100%{opacity:1;-moz-transform:scale(1,1) rotate(0);-o-transform:scale(1,1) rotate(0);-ms-transform:scale(1,1) rotate(0);-webkit-transform:scale(1,1) rotate(0);transform:scale(1,1) rotate(0)}
}
@-o-keyframes showBtn{
0%{opacity:0;-moz-transform:scale(.4,.4) rotate(-90deg);-o-transform:scale(.4,.4) rotate(-90deg);-ms-transform:scale(.4,.4) rotate(-90deg);-webkit-transform:scale(.4,.4) rotate(-90deg);transform:scale(.4,.4) rotate(-90deg)}
50%{opacity:1}
70%{opacity:1;-moz-transform:scale(1,1);-o-transform:scale(1,1);-ms-transform:scale(1,1);-webkit-transform:scale(1,1);transform:scale(1,1)}
100%{opacity:1;-moz-transform:scale(1,1) rotate(0);-o-transform:scale(1,1) rotate(0);-ms-transform:scale(1,1) rotate(0);-webkit-transform:scale(1,1) rotate(0);transform:scale(1,1) rotate(0)}
}
@keyframes showBtn{
0%{opacity:0;-moz-transform:scale(.4,.4) rotate(-90deg);-o-transform:scale(.4,.4) rotate(-90deg);-ms-transform:scale(.4,.4) rotate(-90deg);-webkit-transform:scale(.4,.4) rotate(-90deg);transform:scale(.4,.4) rotate(-90deg)}
50%{opacity:1}
70%{opacity:1;-moz-transform:scale(1,1);-o-transform:scale(1,1);-ms-transform:scale(1,1);-webkit-transform:scale(1,1);transform:scale(1,1)}
100%{opacity:1;-moz-transform:scale(1,1) rotate(0);-o-transform:scale(1,1) rotate(0);-ms-transform:scale(1,1) rotate(0);-webkit-transform:scale(1,1) rotate(0);transform:scale(1,1) rotate(0)}
}
@-webkit-keyframes gradientTxt{
0%{background-position:0}
100%{background-position:60%}
}
@-moz-keyframes gradientTxt{
0%{background-position:0}
100%{background-position:60%}
}
@-ms-keyframes gradientTxt{
0%{background-position:0}
100%{background-position:60%}
}
@-o-keyframes gradientTxt{
0%{background-position:0}
100%{background-position:60%}
}
@keyframes gradientTxt{
0%{background-position:0}
100%{background-position:60%}
}
@-webkit-keyframes fadeIn{
0%{opacity:0}
100%{opacity:1}
}
@-moz-keyframes fadeIn{
0%{opacity:0}
100%{opacity:1}
}
@-ms-keyframes fadeIn{
0%{opacity:0}
100%{opacity:1}
}
@-o-keyframes fadeIn{
0%{opacity:0}
100%{opacity:1}
}
@keyframes fadeIn{
0%{opacity:0}
100%{opacity:1}
}
#hd .fadeIn{-webkit-animation-delay:0s;-webkit-animation-duration:.25s;-webkit-animation-name:fadeIn;-webkit-animation-timing-function:ease-in-out;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:both;-moz-animation-delay:0s;-moz-animation-duration:.25s;-moz-animation-name:fadeIn;-moz-animation-timing-function:ease-in-out;-moz-animation-iteration-count:1;-moz-animation-fill-mode:both;-o-animation-delay:0s;-o-animation-duration:.25s;-o-animation-name:fadeIn;-o-animation-timing-function:ease-in-out;-o-animation-iteration-count:1;-o-animation-fill-mode:both;animation-delay:0s;animation-duration:.25s;animation-name:fadeIn;animation-timing-function:ease-in-out;animation-iteration-count:1;animation-fill-mode:both}
@-webkit-keyframes fadeInUp{
0%{opacity:0;-moz-transform:translateY(30px);-o-transform:translateY(30px);-ms-transform:translateY(30px);-webkit-transform:translateY(30px);transform:translateY(30px)}
100%{opacity:1;-moz-transform:translateY(0);-o-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)}
}
@-moz-keyframes fadeInUp{
0%{opacity:0;-moz-transform:translateY(30px);-o-transform:translateY(30px);-ms-transform:translateY(30px);-webkit-transform:translateY(30px);transform:translateY(30px)}
100%{opacity:1;-moz-transform:translateY(0);-o-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)}
}
@-ms-keyframes fadeInUp{
0%{opacity:0;-moz-transform:translateY(30px);-o-transform:translateY(30px);-ms-transform:translateY(30px);-webkit-transform:translateY(30px);transform:translateY(30px)}
100%{opacity:1;-moz-transform:translateY(0);-o-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)}
}
@-o-keyframes fadeInUp{
0%{opacity:0;-moz-transform:translateY(30px);-o-transform:translateY(30px);-ms-transform:translateY(30px);-webkit-transform:translateY(30px);transform:translateY(30px)}
100%{opacity:1;-moz-transform:translateY(0);-o-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)}
}
@keyframes fadeInUp{
0%{opacity:0;-moz-transform:translateY(30px);-o-transform:translateY(30px);-ms-transform:translateY(30px);-webkit-transform:translateY(30px);transform:translateY(30px)}
100%{opacity:1;-moz-transform:translateY(0);-o-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)}
}
@-webkit-keyframes fadeInLeft{
0%{opacity:0;-moz-transform:translateX(-10px);-o-transform:translateX(-10px);-ms-transform:translateX(-10px);-webkit-transform:translateX(-10px);transform:translateX(-10px)}
100%{opacity:1;-moz-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);-webkit-transform:translateX(0);transform:translateX(0)}
}
@-moz-keyframes fadeInLeft{
0%{opacity:0;-moz-transform:translateX(-10px);-o-transform:translateX(-10px);-ms-transform:translateX(-10px);-webkit-transform:translateX(-10px);transform:translateX(-10px)}
100%{opacity:1;-moz-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);-webkit-transform:translateX(0);transform:translateX(0)}
}
@-ms-keyframes fadeInLeft{
0%{opacity:0;-moz-transform:translateX(-10px);-o-transform:translateX(-10px);-ms-transform:translateX(-10px);-webkit-transform:translateX(-10px);transform:translateX(-10px)}
100%{opacity:1;-moz-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);-webkit-transform:translateX(0);transform:translateX(0)}
}
@-o-keyframes fadeInLeft{
0%{opacity:0;-moz-transform:translateX(-10px);-o-transform:translateX(-10px);-ms-transform:translateX(-10px);-webkit-transform:translateX(-10px);transform:translateX(-10px)}
100%{opacity:1;-moz-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);-webkit-transform:translateX(0);transform:translateX(0)}
}
@keyframes fadeInLeft{
0%{opacity:0;-moz-transform:translateX(-10px);-o-transform:translateX(-10px);-ms-transform:translateX(-10px);-webkit-transform:translateX(-10px);transform:translateX(-10px)}
100%{opacity:1;-moz-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);-webkit-transform:translateX(0);transform:translateX(0)}
}
@font-face{font-family:Roboto;src:url(../fonts/Roboto-Light.woff2) format("woff2"),url(../fonts/Roboto-Light.woff) format("woff"),url(../fonts/Roboto-Light.ttf) format("truetype");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:Roboto;src:url(../fonts/Roboto-Regular.woff2) format("woff2"),url(../fonts/Roboto-Regular.woff) format("woff"),url(../fonts/Roboto-Regular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Roboto;src:url(../fonts/Roboto-Medium.woff2) format("woff2"),url(../fonts/Roboto-Medium.woff) format("woff"),url(../fonts/Roboto-Medium.ttf) format("truetype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:Roboto;src:url(../fonts/Roboto-Bold.woff2) format("woff2"),url(../fonts/Roboto-Bold.woff) format("woff"),url(../fonts/Roboto-Bold.ttf) format("truetype");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:ROGFonts;src:url(../fonts/ROGFonts-Regular_ES.woff2) format("woff2"),url(../fonts/ROGFonts-Regular_ES.woff) format("woff"),url(../fonts/ROGFonts-Regular_ES.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:TradeGothicLTPro;src:url(../fonts/TradeGothicLTPro-Bold.woff2) format("woff2"),url(../fonts/TradeGothicLTPro-Bold.woff) format("woff"),url(../fonts/TradeGothicLTPro-Bold.ttf) format("truetype");font-weight:700;font-style:normal;font-display:swap}
#hd{font-family:Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif;font-size:16px}
#hd .h2,#hd h2{font-family:TradeGothicLTPro,Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif;font-size:5.5em;font-weight:700;letter-spacing:0;line-height:1;color:#fff!important;word-break:normal;word-wrap:normal;margin-bottom:.125em}
#hd .h2.color-primary,#hd h2.color-primary{color:#59bbff!important}
#hd .h3,#hd h3{font-family:TradeGothicLTPro,Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif;font-size:3.5em;font-weight:700;color:#fff!important;letter-spacing:.018em;line-height:1.25;margin-bottom:.25em}
#hd .h4,#hd h4{font-family:TradeGothicLTPro,Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif;font-size:1.7em;font-weight:700;letter-spacing:0;line-height:1.2;margin-bottom:.25}
#hd .h4 strong,#hd h4 strong{font:inherit;font-size:1.9em;margin-bottom:-.1em}
#hd .h4 strong small,#hd h4 strong small{font:inherit;font-size:.5em}
#hd .h5,#hd h5{font-family:TradeGothicLTPro,Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif;font-size:1.5em;font-weight:700;letter-spacing:.018em;line-height:1.125}
#hd h6{font-family:TradeGothicLTPro,Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif;font-size:14px;font-weight:700;line-height:1.5}
#hd a,#hd li,#hd p,#hd small{font-family:Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif}
#hd p{font-size:1em;line-height:1.5;letter-spacing:.018em;font-weight:400}
#hd b{font-weight:700}
#hd small{font-size:.875em;font-weight:400}
#hd .align-center{text-align:center}
#hd .align-left{text-align:left}
#hd .align-right{text-align:right}
#hd .align-italic{font-style:italic}
#hd a.txt-link{display:inline-block;text-decoration:underline;font-weight:400;margin-top:.5em}
#hd a.txt-link:hover{color:#fff}
#hd .color-primary{color:#59bbff}
#hd .color-secondary{color:#155fff}
#hd .color-grey{color:#a7a7a7!important}
#hd .color-gradient{display:inline-block;color:#59bbff!important;background-color:#59bbff;background-image:-moz-linear-gradient(90deg,#59bbff,#be41ff 30%,#ff98ea);background-image:-webkit-linear-gradient(90deg,#59bbff,#be41ff 30%,#ff98ea);background-image:linear-gradient(90deg,#59bbff,#be41ff 30%,#ff98ea);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
#hd .color-gradient::selection,#hd .color-gradient>::selection{color:#fff;-webkit-background-clip:unset;-webkit-text-fill-color:#fff}
#hd .color-gradient::-moz-selection,#hd .color-gradient>::-moz-selection{color:#fff;-webkit-background-clip:unset;-webkit-text-fill-color:#fff}
#hd .font-rog{font-family:ROGFonts,TradeGothicLTPro,Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif;text-transform:uppercase;font-weight:400}
#hd .font-title{font-family:TradeGothicLTPro,Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif;font-weight:700}
#hd .font-content{font-family:Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif}
#hd .txt-stroke{-webkit-text-fill-color:transparent;-webkit-text-stroke-width:1px;-webkit-text-stroke-color:rgba(255,255,255,.75)}
#hd .hd-uppercase{text-transform:uppercase}
_:-ms-fullscreen,:root #hd .color-gradient{background:0 0!important}
@media screen and (min-width:2560px){
#hd{font-size:20px}
}
@media screen and (min-width:3000px){
#hd{font-size:28px}
}
@media screen and (max-width:1024px){
#hd{font-size:14px}
#hd .h2,#hd h2{font-size:5.75em}
#hd .h3,#hd h3{font-size:3em}
#hd .h4,#hd h4{font-size:1.5em}
}
@media screen and (max-width:480px){
#hd .h2,#hd h2{font-size:16vw}
#hd .h3,#hd h3{font-size:2em}
#hd .h4 strong,#hd h4 strong{font-size:1.6em}
#hd .h4 strong small,#hd h4 strong small{font-size:.75em}
}
#hd .w95{width:94%;margin:0 auto;position:relative}
#hd .hd-width{width:80%;max-width:42em;margin:0 auto;position:relative;z-index:2}
#hd .hd-width h2{pointer-events:none}
#hd .hd-width p{max-width:40em}
#hd .hd-w1000,#hd .hd-w1100,#hd .hd-w1200,#hd .hd-w1280,#hd .hd-w1366,#hd .hd-w1520,#hd .hd-w1680,#hd .hd-w900{width:80%;max-width:1200px;margin:0 auto;position:relative}
#hd .hd-w900{max-width:900px}
#hd .hd-w1000{max-width:1000px}
#hd .hd-w1100{max-width:1100px}
#hd .hd-w1280{max-width:1280px}
#hd .hd-w1366{width:90%;max-width:1366px}
#hd .hd-w1520{width:90%;max-width:1520px}
#hd .hd-w1680{width:90%;max-width:1680px}
#hd .hd-w2560{max-width:2560px;margin:0 auto;position:relative}
#hd .hd-mw900{max-width:900px}
#hd .hd-mw1000{max-width:1000px}
#hd .hd-mw700{max-width:700px}
#hd .hd-col20{width:20%}
#hd .hd-col25{width:25%}
#hd .hd-col30{width:30%}
#hd .hd-col33{width:33.3333%}
#hd .hd-col40{width:40%}
#hd .hd-col45{width:45%}
#hd .hd-col50{width:50%}
#hd .hd-col55{width:55%}
#hd .hd-col60{width:60%}
#hd .hd-col65{width:65%}
#hd .hd-col66{width:66.6666%}
#hd .hd-col70{width:70%}
#hd .hd-col75{width:75%}
#hd .hd-col80{width:80%}
#hd .hd-col100{width:100%}
#hd .ib-top{display:inline-block;vertical-align:top}
#hd .ib-bottom{display:inline-block;vertical-align:bottom}
#hd .flex-wrap{display:flex;flex-wrap:wrap}
#hd .flex-nowrap{display:flex;flex-wrap:nowrap}
#hd .align-items-center{align-items:center}
#hd .align-items-start{align-items:flex-start}
#hd .align-items-end{align-items:flex-end}
#hd .justify-content-center{justify-content:center}
#hd .justify-content-start{justify-content:flex-start}
#hd .justify-content-end{justify-content:flex-end}
#hd .justify-content-between{justify-content:space-between}
#hd .justify-content-around{justify-content:space-around}
#hd .flex-row-reverse{flex-direction:row-reverse}
#hd .hd-d-none{display:none!important}
#hd .hd-d-ib{display:inline-block!important}
#hd .mx-auto{margin-left:auto;margin-right:auto}
@media screen and (min-width:2560px){
#hd .hd-w900{max-width:1200px}
#hd .hd-w1000{max-width:1300px}
#hd .hd-w1100,#hd .hd-w1200,#hd .hd-w1280,#hd .hd-w1366{max-width:1600px}
#hd .hd-w1520,#hd .hd-w1680{width:90%;max-width:2000px}
#hd .hd-mw1000{max-width:1200px}
#hd .hd-mw900{max-width:1100px}
#hd .hd-mw700{max-width:1000px}
}
@media screen and (min-width:3000px){
#hd .hd-w900{max-width:1400px}
#hd .hd-w1000{max-width:2200px}
#hd .hd-w1100,#hd .hd-w1200,#hd .hd-w1280,#hd .hd-w1366{max-width:2560px}
#hd .hd-w1520,#hd .hd-w1680{width:90%;max-width:3000px}
}
@media screen and (max-width:1024px){
#hd .hd-container{width:90%}
#hd .hd-d-1024-none{display:none!important}
#hd .hd-d-1024-block{display:block!important}
}
@media screen and (max-width:1023px){
#hd .hd-w1000,#hd .hd-w1100,#hd .hd-w1200{width:90%}
}
@media screen and (max-width:1023px){
#hd .hd-d-1023-none{display:none!important}
#hd .hd-d-1023-block{display:block!important}
}
@media screen and (max-width:768px){
#hd .hd-d-768-none{display:none!important}
#hd .hd-d-768-block{display:block!important}
#hd .hd-d-768-flex{display:flex!important}
}
@media screen and (max-width:620px){
#hd .hd-d-620-none{display:none!important}
#hd .hd-d-620-block{display:block!important}
#hd .hd-d-620-flex{display:flex!important}
}
@media screen and (max-width:480px){
#hd .hd-d-480-none{display:none!important}
#hd .hd-d-480-block{display:block!important}
#hd .hd-d-480-flex{display:flex!important}
}
#hd .btn-arrow{display:block;width:6.5em;margin-bottom:.5em;cursor:pointer;-moz-transition:transform .4s ease;-o-transition:transform .4s ease;-webkit-transition:transform .4s ease;transition:transform .4s ease}
#hd .btn-arrow:focus-visible,#hd .btn-arrow:hover{-moz-transform:translate(10%,0);-o-transform:translate(10%,0);-ms-transform:translate(10%,0);-webkit-transform:translate(10%,0);transform:translate(10%,0)}
#hd .btn-arrow:active{-moz-transform:translate(10%,0) scale(.95,.95);-o-transform:translate(10%,0) scale(.95,.95);-ms-transform:translate(10%,0) scale(.95,.95);-webkit-transform:translate(10%,0) scale(.95,.95);transform:translate(10%,0) scale(.95,.95)}
#hd .btn-arrow img{width:100%}
#hd .btn-fast{font-weight:700;text-transform:uppercase;position:relative}
#hd .btn-fast .txt-container{display:block;position:relative}
#hd .btn-fast .txt-container>span{display:block;padding-top:3px;padding-right:.25em;position:absolute;top:0;left:0;white-space:nowrap}
#hd .btn-fast .txt-container>span.txt-main{position:relative;opacity:1}
#hd .btn-fast .txt-container>span:nth-child(2){clip-path:inset(0 60% 0 0)}
#hd .btn-fast .txt-container>span:nth-child(3){clip-path:inset(0 35% 0 35%)}
#hd .btn-fast .txt-container>span:nth-child(4){clip-path:inset(0 25% 0 45%)}
#hd .btn-fast .txt-container>span:nth-child(5){clip-path:inset(0 15% 0 60%)}
#hd .btn-fast .txt-container>span:nth-child(6){clip-path:inset(0 5% 0 75%)}
#hd .btn-fast .txt-container>span:nth-child(7){clip-path:inset(0 0 0 90%)}
#hd .btn-fast .txt-container>span:last-child{opacity:1!important}
#hd .btn-fast .txt-container>span span{display:block;-moz-transition:none;-o-transition:none;-webkit-transition:none;transition:none}
#hd .btn-fast .txt-container>span:nth-child(2) span{-moz-transform:translate(50%,0);-o-transform:translate(50%,0);-ms-transform:translate(50%,0);-webkit-transform:translate(50%,0);transform:translate(50%,0)}
#hd .btn-fast .txt-container>span:nth-child(3) span{-moz-transform:translate(75%,0);-o-transform:translate(75%,0);-ms-transform:translate(75%,0);-webkit-transform:translate(75%,0);transform:translate(75%,0)}
#hd .btn-fast .txt-container>span:nth-child(4) span{-moz-transform:translate(100%,0);-o-transform:translate(100%,0);-ms-transform:translate(100%,0);-webkit-transform:translate(100%,0);transform:translate(100%,0)}
#hd .btn-fast .txt-container>span:nth-child(5) span{-moz-transform:translate(125%,0);-o-transform:translate(125%,0);-ms-transform:translate(125%,0);-webkit-transform:translate(125%,0);transform:translate(125%,0)}
#hd .btn-fast .txt-container>span:nth-child(6) span{-moz-transform:translate(150%,0);-o-transform:translate(150%,0);-ms-transform:translate(150%,0);-webkit-transform:translate(150%,0);transform:translate(150%,0)}
#hd .btn-fast .txt-container>span:nth-child(7) span{-moz-transform:translate(175%,0);-o-transform:translate(175%,0);-ms-transform:translate(175%,0);-webkit-transform:translate(175%,0);transform:translate(175%,0)}
#hd .btn-fast.is-animated .txt-container>span.txt-main,#hd .btn-fast:focus-visible .txt-container>span.txt-main,#hd .btn-fast:hover .txt-container>span.txt-main{opacity:0}
#hd .btn-fast.is-animated .txt-container>span:nth-child(2) span,#hd .btn-fast:focus-visible .txt-container>span:nth-child(2) span,#hd .btn-fast:hover .txt-container>span:nth-child(2) span{-moz-transition:transform 1s 0s ease,opacity 1s 0s ease;-o-transition:transform 1s 0s ease,opacity 1s 0s ease;-webkit-transition:transform 1s 0s ease,opacity 1s 0s ease;transition:transform 1s 0s ease,opacity 1s 0s ease}
#hd .btn-fast.is-animated .txt-container>span:nth-child(3) span,#hd .btn-fast:focus-visible .txt-container>span:nth-child(3) span,#hd .btn-fast:hover .txt-container>span:nth-child(3) span{-moz-transition:transform 1s .1s ease,opacity 1s .1s ease;-o-transition:transform 1s .1s ease,opacity 1s .1s ease;-webkit-transition:transform 1s .1s ease,opacity 1s .1s ease;transition:transform 1s .1s ease,opacity 1s .1s ease}
#hd .btn-fast.is-animated .txt-container>span:nth-child(4) span,#hd .btn-fast:focus-visible .txt-container>span:nth-child(4) span,#hd .btn-fast:hover .txt-container>span:nth-child(4) span{-moz-transition:transform 1s .2s ease,opacity 1s .2s ease;-o-transition:transform 1s .2s ease,opacity 1s .2s ease;-webkit-transition:transform 1s .2s ease,opacity 1s .2s ease;transition:transform 1s .2s ease,opacity 1s .2s ease}
#hd .btn-fast.is-animated .txt-container>span:nth-child(5) span,#hd .btn-fast:focus-visible .txt-container>span:nth-child(5) span,#hd .btn-fast:hover .txt-container>span:nth-child(5) span{-moz-transition:transform 1s .3s ease,opacity 1s .3s ease;-o-transition:transform 1s .3s ease,opacity 1s .3s ease;-webkit-transition:transform 1s .3s ease,opacity 1s .3s ease;transition:transform 1s .3s ease,opacity 1s .3s ease}
#hd .btn-fast.is-animated .txt-container>span:nth-child(6) span,#hd .btn-fast:focus-visible .txt-container>span:nth-child(6) span,#hd .btn-fast:hover .txt-container>span:nth-child(6) span{-moz-transition:transform 1s .4s ease,opacity 1s .4s ease;-o-transition:transform 1s .4s ease,opacity 1s .4s ease;-webkit-transition:transform 1s .4s ease,opacity 1s .4s ease;transition:transform 1s .4s ease,opacity 1s .4s ease}
#hd .btn-fast.is-animated .txt-container>span:nth-child(7) span,#hd .btn-fast:focus-visible .txt-container>span:nth-child(7) span,#hd .btn-fast:hover .txt-container>span:nth-child(7) span{-moz-transition:transform 1s .5s ease,opacity 1s .5s ease;-o-transition:transform 1s .5s ease,opacity 1s .5s ease;-webkit-transition:transform 1s .5s ease,opacity 1s .5s ease;transition:transform 1s .5s ease,opacity 1s .5s ease}
#hd .btn-fast.is-animated .txt-container>span:nth-child(n) span,#hd .btn-fast:focus-visible .txt-container>span:nth-child(n) span,#hd .btn-fast:hover .txt-container>span:nth-child(n) span{-moz-transform:translate(0,0);-o-transform:translate(0,0);-ms-transform:translate(0,0);-webkit-transform:translate(0,0);transform:translate(0,0)}
#hd .btn-bright{display:inline-block;font-weight:700;text-transform:uppercase;-moz-transition:text-shadow 1s ease;-o-transition:text-shadow 1s ease;-webkit-transition:text-shadow 1s ease;transition:text-shadow 1s ease}
#hd .btn-bright.is-animated,#hd .btn-bright:focus-visible,#hd .btn-bright:hover{mix-blend-mode:lighten;text-shadow:0 0 .01em #fff,0 0 .05em #4e6bff,0 0 .5em #6b7aff,0 0 .75em #1b0ed7}
#hd .btn-vivid{display:inline-block;font-weight:700;text-transform:uppercase;-moz-transition:text-shadow 1s cubic-bezier(0,.89,.5,.98);-o-transition:text-shadow 1s cubic-bezier(0,.89,.5,.98);-webkit-transition:text-shadow 1s cubic-bezier(0,.89,.5,.98);transition:text-shadow 1s cubic-bezier(0,.89,.5,.98)}
#hd .btn-vivid.is-animated,#hd .btn-vivid:focus-visible,#hd .btn-vivid:hover{color:#59bbff!important;background-color:#59bbff;background-image:-moz-linear-gradient(90deg,#59bbff,#be41ff,#ff98ea,#59bbff,#be41ff,#ff98ea,#59bbff,#be41ff,#ff98ea);background-image:-webkit-linear-gradient(90deg,#59bbff,#be41ff,#ff98ea,#59bbff,#be41ff,#ff98ea,#59bbff,#be41ff,#ff98ea);background-image:linear-gradient(90deg,#59bbff,#be41ff,#ff98ea,#59bbff,#be41ff,#ff98ea,#59bbff,#be41ff,#ff98ea);-webkit-background-clip:text;-webkit-text-fill-color:transparent;-moz-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);background-size:300%;background-position:0;-webkit-animation-delay:0s;-webkit-animation-duration:2s;-webkit-animation-name:gradientTxt;-webkit-animation-timing-function:ease;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:both;-moz-animation-delay:0s;-moz-animation-duration:2s;-moz-animation-name:gradientTxt;-moz-animation-timing-function:ease;-moz-animation-iteration-count:1;-moz-animation-fill-mode:both;-o-animation-delay:0s;-o-animation-duration:2s;-o-animation-name:gradientTxt;-o-animation-timing-function:ease;-o-animation-iteration-count:1;-o-animation-fill-mode:both;animation-delay:0s;animation-duration:2s;animation-name:gradientTxt;animation-timing-function:ease;animation-iteration-count:1;animation-fill-mode:both;-moz-transition:text-shadow 1s cubic-bezier(0,.89,.5,.98);-o-transition:text-shadow 1s cubic-bezier(0,.89,.5,.98);-webkit-transition:text-shadow 1s cubic-bezier(0,.89,.5,.98);transition:text-shadow 1s cubic-bezier(0,.89,.5,.98)}
#hd .btn-vivid::selection{color:#59bbff;-webkit-background-clip:unset;-webkit-text-fill-color:#59bbff}
#hd .btn-vivid::-moz-selection{color:#59bbff;-webkit-background-clip:unset;-webkit-text-fill-color:#59bbff}
@media screen and (max-width:1280px){
#hd .hd-btn{font-size:1.125em}
#hd .btn-arrow{width:5em}
}
@media screen and (max-width:620px){
#hd .hd-btn{font-size:1em}
#hd .btn-arrow{width:3.5em}
}
#hd .hd-lightbox{display:none;align-items:center;justify-content:center;width:100%;height:100vh;padding:56px 3em 0;position:fixed;top:0;left:0;z-index:10;overflow-x:hidden;overflow-y:auto}
#hd .hd-lightbox::-webkit-scrollbar{width:4px}
#hd .hd-lightbox::-webkit-scrollbar-track{background:0 0}
#hd .hd-lightbox::-webkit-scrollbar-thumb{background:#a7a7a7}
#hd .hd-lightbox::-webkit-scrollbar-thumb:hover{background:#59bbff}
#hd .hd-lightbox.hd-active{display:flex;-webkit-animation-delay:0s;-webkit-animation-duration:.4s;-webkit-animation-name:fadeIn;-webkit-animation-timing-function:ease;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:both;-moz-animation-delay:0s;-moz-animation-duration:.4s;-moz-animation-name:fadeIn;-moz-animation-timing-function:ease;-moz-animation-iteration-count:1;-moz-animation-fill-mode:both;-o-animation-delay:0s;-o-animation-duration:.4s;-o-animation-name:fadeIn;-o-animation-timing-function:ease;-o-animation-iteration-count:1;-o-animation-fill-mode:both;animation-delay:0s;animation-duration:.4s;animation-name:fadeIn;animation-timing-function:ease;animation-iteration-count:1;animation-fill-mode:both}
#hd .hd-lightbox .hd-filter{width:100%;height:100%;background:rgba(0,0,0,.25);position:absolute;top:0;left:0}
#hd .hd-lightbox .hd-box{width:31vw;height:30vw;padding:1em 2em;position:absolute;top:50%;left:0;right:0;-moz-transform:translate(0,-50%);-o-transform:translate(0,-50%);-ms-transform:translate(0,-50%);-webkit-transform:translate(0,-50%);transform:translate(0,-50%);margin:0 auto;z-index:2}
#hd .hd-lightbox .hd-box:before{content:'';display:block;width:126%;height:116%;background:url(../img/bg-lightbox.png) center no-repeat;background-size:contain;position:absolute;left:-13%;top:-8%;z-index:-1}
#hd .hd-lightbox .hd-close{width:3em;height:3em;position:absolute;top:-1em;right:0;cursor:pointer;display:block!important;z-index:2}
#hd .hd-lightbox .hd-close:hover:after,#hd .hd-lightbox .hd-close:hover:before{background:#59bbff}
#hd .hd-lightbox .hd-close:after,#hd .hd-lightbox .hd-close:before{content:'';display:block;width:.125em;height:1.5em;background:#fff;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto}
#hd .hd-lightbox .hd-close:before{-moz-transform:rotate(45deg);-o-transform:rotate(45deg);-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg)}
#hd .hd-lightbox .hd-close:after{-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}
@media screen and (min-width:2560px){
#hd .hd-lightbox .hd-close{font-size:1.25em}
}
@media screen and (min-width:3000px){
#hd .hd-lightbox .hd-close{font-size:1.5em}
}
@media screen and (max-width:1440px){
#hd .hd-lightbox .hd-box{width:38vw;height:37vw}
}
@media screen and (max-width:1024px){
#hd .hd-lightbox .hd-box{width:47vw;height:47vw}
}
@media screen and (max-width:768px){
#hd .hd-lightbox .hd-box{width:90vw;height:90vw}
}
@media screen and (max-width:620px){
#hd .hd-lightbox .hd-box{padding-left:1em;padding-right:1em}
}
@media screen and (max-width:480px){
#hd .hd-lightbox .hd-box{height:140vw;min-width:318px}
#hd .hd-lightbox .hd-box:before{background-size:cover}
}
#hd .feature-list{margin:4em 0 0}
#hd .feature-list li{display:inline-block;margin-right:3em;margin-bottom:1.125em}
#hd .feature-list h4 sup{font-size:.55em;margin-top:-.5em}
@media screen and (max-width:1280px){
#hd .feature-list li{margin-right:1.5em}
}
@media screen and (max-width:480px){
#hd .feature-list li{width:100%;margin-right:0;margin-bottom:1em}
}
#hd .trigger-video-toggle{position:relative}
#hd .vid-container{width:100%;height:0;padding-bottom:59%;position:relative;overflow:hidden}
#hd .vid-container video{width:100%;height:100%;position:absolute;top:0;left:0;object-fit:cover}
#hd .vid-control{width:60px;height:60px;position:absolute;right:0;bottom:0;-moz-transition:all .3s ease-out;-o-transition:all .3s ease-out;-webkit-transition:all .3s ease-out;transition:all .3s ease-out;cursor:pointer}
#hd .vid-control img{width:45%!important;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto}
#hd .vid-control .play{display:none}
#hd .vid-control.hd-active .play{display:block}
#hd .vid-control.hd-active .pause{display:none}
@media screen and (max-width:620px){
#hd .vid-control{width:48px;height:48px}
}
.webp #hd .hd-deco-ani.is-loaded.deco-bucky{background-image:url(../img-webp/bucky-sprite.webp)}
.webp #hd .hd-deco-ani.is-loaded.deco-capsule{background-image:url(../img-webp/capsule-sprite.webp)}
.webp #hd .hd-deco-ani.is-loaded.deco-cube{background-image:url(../img-webp/cube-sprite.webp)}
.webp #hd .hd-deco-ani.is-loaded.deco-octa{background-image:url(../img-webp/octa-sprite.webp)}
.webp #hd .hd-deco-ani.is-loaded.deco-pyramid{background-image:url(../img-webp/pyramid-sprite.webp)}
.webp #hd .hd-deco-ani.is-loaded.deco-sphere{background-image:url(../img-webp/sphere-sprite.webp)}
.webp #hd .hd-deco-ani.is-loaded.deco-torus{background-image:url(../img-webp/torus-sprite.webp)}
.no-webp #hd .hd-deco-ani.is-loaded.deco-bucky{background-image:url(../img/bucky-sprite.png)}
.no-webp #hd .hd-deco-ani.is-loaded.deco-capsule{background-image:url(../img/capsule-sprite.png)}
.no-webp #hd .hd-deco-ani.is-loaded.deco-cube{background-image:url(../img/cube-sprite.png)}
.no-webp #hd .hd-deco-ani.is-loaded.deco-octa{background-image:url(../img/octa-sprite.png)}
.no-webp #hd .hd-deco-ani.is-loaded.deco-pyramid{background-image:url(../img/pyramid-sprite.png)}
.no-webp #hd .hd-deco-ani.is-loaded.deco-sphere{background-image:url(../img/sphere-sprite.png)}
.no-webp #hd .hd-deco-ani.is-loaded.deco-torus{background-image:url(../img/torus-sprite.png)}
#hd .hd-deco-ani{width:6em;height:6em;margin:0 auto;background-size:4900%;background-position:0 0;background-repeat:no-repeat}
#hd .hd-deco-ani.is-animated{animation:playSpriteH 3s steps(48) 1 forwards}
#hd .title-ani{font-size:8.25vw;letter-spacing:0;line-height:.9;-webkit-text-fill-color:transparent;-webkit-text-stroke-width:.5px;-webkit-text-stroke-color:rgba(255,255,255,.75);filter:url(#goovey)}
#hd .title-ani span{display:block}
#hd #goovey{-webkit-animation-delay:0s;-webkit-animation-duration:2s;-webkit-animation-name:colorrun;-webkit-animation-timing-function:linear;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:both;-moz-animation-delay:0s;-moz-animation-duration:2s;-moz-animation-name:colorrun;-moz-animation-timing-function:linear;-moz-animation-iteration-count:1;-moz-animation-fill-mode:both;-o-animation-delay:0s;-o-animation-duration:2s;-o-animation-name:colorrun;-o-animation-timing-function:linear;-o-animation-iteration-count:1;-o-animation-fill-mode:both;animation-delay:0s;animation-duration:2s;animation-name:colorrun;animation-timing-function:linear;animation-iteration-count:1;animation-fill-mode:both}
#hd .txt-frame{-webkit-text-fill-color:transparent;-webkit-text-stroke-width:.5px;-webkit-text-stroke-color:rgba(255,255,255,.75)}
@media screen and (max-width:480px){
#hd .hd-deco-ani{width:4em;height:4em;margin-left:0;margin-left:-1em}
}
#hd .tab-filter{width:100%;display:flex;flex-wrap:nowrap;align-items:flex-end;justify-content:flex-start;border-bottom:2px solid #fff;margin:0 auto 2em}
#hd .tab-filter li{font-family:Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif;font-size:1.125em;font-weight:400;padding:.75em 1.75em .75em 0;line-height:1;letter-spacing:0;position:relative;text-transform:uppercase;cursor:pointer}
#hd .tab-filter li:after{content:'';display:block;width:calc(100% - 1em);height:3px;background:#fff;position:absolute;bottom:0;left:0;transform-origin:left center;-moz-transform:scale(0,1) translate(-50%,0);-o-transform:scale(0,1) translate(-50%,0);-ms-transform:scale(0,1) translate(-50%,0);-webkit-transform:scale(0,1) translate(-50%,0);transform:scale(0,1) translate(-50%,0);-moz-transition:transform .4s ease;-o-transition:transform .4s ease;-webkit-transition:transform .4s ease;transition:transform .4s ease}
#hd .tab-filter li:last-child{margin-right:auto}
#hd .tab-filter li:hover{color:#a7a7a7}
#hd .tab-filter li.hd-active{color:#fff}
#hd .tab-filter li.hd-active:after{-moz-transform:scale(1,1) translate(0,0);-o-transform:scale(1,1) translate(0,0);-ms-transform:scale(1,1) translate(0,0);-webkit-transform:scale(1,1) translate(0,0);transform:scale(1,1) translate(0,0)}
@media screen and (max-width:1440px){
#hd .tab-filter li{font-size:1em}
}
@media screen and (max-width:1024px){
#hd .tab-filter li{padding-right:1em}
}
@media screen and (max-width:1024px) and (orientation:portrait),screen and (max-width:1023px){
#hd .tab-filter{overflow-x:auto;overflow-y:hidden}
#hd .tab-filter li{flex-shrink:0;padding-right:2em}
}
#hd .sec-kv{padding-bottom:1px;position:relative;overflow:hidden;z-index:3}
#hd .sec-kv .vid-container{width:100%;height:100vh;padding-bottom:0}
#hd .sec-kv .vid-container video{height:110%;top:-5%;filter:contrast(1.1) brightness(1.1)}
#hd .sec-kv .vid-control{margin:1em}
#hd .sec-kv .logo-container{width:100%;height:100%;position:absolute;top:0;left:0;z-index:2;opacity:0;pointer-events:none}
#hd .sec-kv .logo-container img{width:100%;max-width:none!important;max-height:none!important;height:106%;position:absolute;top:-5%;left:0;object-fit:cover}
#hd .sec-kv .hd-title{text-align:center;font-size:5em;position:absolute;bottom:0;left:0;right:0;margin:0 auto .5em;opacity:0;pointer-events:none}
#hd .sec-kv figure.is-animated .logo-container{opacity:1;-webkit-animation-delay:0s;-webkit-animation-duration:1s;-webkit-animation-name:zoomIn;-webkit-animation-timing-function:ease;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:both;-moz-animation-delay:0s;-moz-animation-duration:1s;-moz-animation-name:zoomIn;-moz-animation-timing-function:ease;-moz-animation-iteration-count:1;-moz-animation-fill-mode:both;-o-animation-delay:0s;-o-animation-duration:1s;-o-animation-name:zoomIn;-o-animation-timing-function:ease;-o-animation-iteration-count:1;-o-animation-fill-mode:both;animation-delay:0s;animation-duration:1s;animation-name:zoomIn;animation-timing-function:ease;animation-iteration-count:1;animation-fill-mode:both}
#hd .sec-kv figure.is-animated .hd-title{-webkit-animation-delay:.6s;-webkit-animation-duration:.6s;-webkit-animation-name:fadeInUp;-webkit-animation-timing-function:ease;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:both;-moz-animation-delay:.6s;-moz-animation-duration:.6s;-moz-animation-name:fadeInUp;-moz-animation-timing-function:ease;-moz-animation-iteration-count:1;-moz-animation-fill-mode:both;-o-animation-delay:.6s;-o-animation-duration:.6s;-o-animation-name:fadeInUp;-o-animation-timing-function:ease;-o-animation-iteration-count:1;-o-animation-fill-mode:both;animation-delay:.6s;animation-duration:.6s;animation-name:fadeInUp;animation-timing-function:ease;animation-iteration-count:1;animation-fill-mode:both}
#hd .sec-kv figure.is-animated .vid-control{opacity:0}
@media screen and (max-width:1024px){
#hd .sec-kv .hd-title{font-size:4em}
}
@media screen and (max-width:1024px) and (orientation:portrait),screen and (max-width:768px){
#hd .sec-kv .hd-title{font-size:9vw}
}
.webp #hd .sec-intro .tab-list a.is-loaded i:after{background-image:url(../img-webp/arrow-down.webp)}
.no-webp #hd .sec-intro .tab-list a.is-loaded i:after{background-image:url(../img/arrow-down.png)}
#hd .sec-intro{padding:8em 0;position:relative;z-index:2}
#hd .sec-intro .hd-bg{width:100%;height:auto;position:absolute;top:0;left:0}
#hd .sec-intro .tab-list{margin-bottom:1em}
#hd .sec-intro .tab-list a{display:inline-block;font-family:TradeGothicLTPro,Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif;font-size:7.5em;font-weight:700;font-weight:400;line-height:1;white-space:nowrap;color:#fff;padding-right:.5em;cursor:pointer;position:relative}
#hd .sec-intro .tab-list a i{display:block;width:.65em;height:.65em;position:absolute;top:.275em;left:100%;-moz-transition:transform .25s ease;-o-transition:transform .25s ease;-webkit-transition:transform .25s ease;transition:transform .25s ease}
#hd .sec-intro .tab-list a i:after{content:'';display:block;width:100%;height:100%;background:center no-repeat;background-size:contain;position:absolute;top:0;left:0;opacity:0}
#hd .sec-intro .tab-list a:focus-visible i:after,#hd .sec-intro .tab-list a:hover i:after{-webkit-animation-delay:.25s;-webkit-animation-duration:.4s;-webkit-animation-name:showBtn;-webkit-animation-timing-function:ease;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:both;-moz-animation-delay:.25s;-moz-animation-duration:.4s;-moz-animation-name:showBtn;-moz-animation-timing-function:ease;-moz-animation-iteration-count:1;-moz-animation-fill-mode:both;-o-animation-delay:.25s;-o-animation-duration:.4s;-o-animation-name:showBtn;-o-animation-timing-function:ease;-o-animation-iteration-count:1;-o-animation-fill-mode:both;animation-delay:.25s;animation-duration:.4s;animation-name:showBtn;animation-timing-function:ease;animation-iteration-count:1;animation-fill-mode:both}
#hd .sec-intro .tab-list a:active i{-moz-transform:scale(.9,.9);-o-transform:scale(.9,.9);-ms-transform:scale(.9,.9);-webkit-transform:scale(.9,.9);transform:scale(.9,.9)}
#hd .sec-intro p{font-family:TradeGothicLTPro,Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif;font-size:1.3em;font-weight:700;letter-spacing:0;max-width:27em;text-shadow:0 0 3px #000}
@media screen and (max-width:1280px){
#hd .sec-intro{padding:6em 0}
}
@media screen and (max-width:1024px) and (orientation:portrait),screen and (max-width:768px){
#hd .sec-intro{padding:4em 0}
#hd .sec-intro .hd-bg{height:110%;object-fit:cover}
}
@media screen and (max-width:620px){
#hd .sec-intro .tab-list a{font-size:16vw}
}
#hd .sec-bright,#hd .sec-fast,#hd .sec-vivid{padding:10em 0;position:relative;overflow:hidden;z-index:2}
#hd .sec-bright .feature-list li:last-child,#hd .sec-fast .feature-list li:last-child,#hd .sec-vivid .feature-list li:last-child{margin-right:-1.5em}
#hd .sec-bright figure,#hd .sec-fast figure,#hd .sec-vivid figure{width:90%;max-width:72em;margin:2em auto;position:relative;z-index:2}
#hd .sec-bright figure img,#hd .sec-fast figure img,#hd .sec-vivid figure img{width:100%}
#hd .sec-bright .vid-wrapper,#hd .sec-fast .vid-wrapper,#hd .sec-vivid .vid-wrapper{width:82.5%;position:absolute;top:2.5%;left:.5%;right:0;margin:0 auto}
#hd .sec-bright .vid-container,#hd .sec-fast .vid-container,#hd .sec-vivid .vid-container{padding-bottom:63.25%}
#hd .sec-bright .vid-container video,#hd .sec-fast .vid-container video,#hd .sec-vivid .vid-container video{width:110%;height:110%;top:-5%}
#hd .sec-bright .hd-content,#hd .sec-fast .hd-content,#hd .sec-vivid .hd-content{display:flex;flex-wrap:nowrap;align-items:flex-end}
#hd .sec-bright .hd-content .btn-arrow,#hd .sec-fast .hd-content .btn-arrow,#hd .sec-vivid .hd-content .btn-arrow{flex-shrink:0;margin-left:1em;margin-right:-6em}
@media screen and (max-width:1024px){
#hd .sec-bright,#hd .sec-fast,#hd .sec-vivid{padding:4em 0}
#hd .sec-bright .feature-list li:last-child,#hd .sec-fast .feature-list li:last-child,#hd .sec-vivid .feature-list li:last-child{margin-right:0}
}
@media screen and (max-width:1024px) and (orientation:portrait),screen and (max-width:768px){
#hd .sec-bright figure,#hd .sec-fast figure,#hd .sec-vivid figure{width:114%;margin-left:-7%}
#hd .sec-bright .hd-content .btn-arrow,#hd .sec-fast .hd-content .btn-arrow,#hd .sec-vivid .hd-content .btn-arrow{margin-right:0}
}
@media screen and (max-width:620px){
#hd .sec-bright .hd-content,#hd .sec-fast .hd-content,#hd .sec-vivid .hd-content{flex-direction:column}
#hd .sec-bright .hd-content .btn-arrow,#hd .sec-fast .hd-content .btn-arrow,#hd .sec-vivid .hd-content .btn-arrow{width:4em;margin:1em auto 0 0}
}
#hd .sec-bright{z-index:1;overflow:visible}
#hd .sec-bright .hd-bg{width:100%;height:auto;position:absolute;top:-30%;left:0}
#hd .sec-bright figure{max-width:60em;margin-top:-.5em;position:relative}
#hd .sec-bright .hd-cover{position:absolute;top:0;left:0}
#hd .sec-bright .feature-list li:last-child{margin-right:0}
@media screen and (max-width:1024px) and (orientation:portrait),screen and (max-width:768px){
#hd .sec-bright .hd-bg{height:110%;object-fit:cover}
#hd .sec-bright figure{width:98%;margin-left:auto;margin-right:auto;margin-top:1em}
}
#hd .sec-vivid figure{width:100%;margin-top:-18.5%;margin-bottom:-43.5%;max-width:none}
#hd .sec-vivid .hd-title{position:relative;z-index:4}
#hd .sec-vivid .vid-wrapper{width:71.25%;position:absolute;top:6.1%;left:1.6%;right:0;perspective:230vw}
#hd .sec-vivid .vid-container{padding-bottom:68.25%;-moz-transform:rotateX(-68deg);-o-transform:rotateX(-68deg);-ms-transform:rotateX(-68deg);-webkit-transform:rotateX(-68deg);transform:rotateX(-68deg)}
#hd .sec-vivid .vid-control{right:-2%;bottom:25%}
#hd .sec-vivid .hd-content p{text-shadow:0 0 3px #000}
@media screen and (max-width:1280px){
#hd .sec-vivid .vid-control{right:-5%}
}
@media screen and (max-width:1024px) and (orientation:portrait),screen and (max-width:768px){
#hd .sec-vivid figure{width:146%;margin-left:-24%}
#hd .sec-vivid .vid-wrapper{perspective:330vw}
#hd .sec-vivid .vid-control{right:5%;bottom:16%}
}
#hd .sec-features{padding:6em 0 4em;position:relative;overflow:hidden;z-index:2}
#hd .sec-features h2{margin-bottom:1em}
#hd .sec-features .hd-scroller{overflow-x:auto}
#hd .sec-features .hd-scroller::-webkit-scrollbar{height:4px}
#hd .sec-features .hd-scroller::-webkit-scrollbar-track{background:#f1f1f1}
#hd .sec-features .hd-scroller::-webkit-scrollbar-thumb{background-color:#59bbff;background-image:-moz-linear-gradient(90deg,#59bbff,#be41ff,#ff98ea);background-image:-webkit-linear-gradient(90deg,#59bbff,#be41ff,#ff98ea);background-image:linear-gradient(90deg,#59bbff,#be41ff,#ff98ea)}
#hd .sec-features .hd-container{padding-bottom:3em}
#hd .sec-features li{flex-shrink:0;width:33.3333%;padding:0 4.5%}
#hd .sec-features li img{width:100%}
#hd .sec-features .hd-content{padding:2em 0 0 2%}
#hd .sec-features .hd-content p{line-height:1.6}
@media screen and (max-width:1440px){
#hd .sec-features .hd-scroller{width:100%}
#hd .sec-features .hd-container{width:120%}
}
@media screen and (max-width:1024px){
#hd .sec-features li{padding:0 2%}
}
@media screen and (max-width:620px){
#hd .sec-features .hd-container{width:180%}
}
@media screen and (max-width:480px){
#hd .sec-features .hd-container{width:220%}
#hd .sec-features li{padding:0 .5em 0 1em}
}
#hd .sec-spec{padding:6em 0;position:relative;overflow:hidden;z-index:2}
#hd .sec-spec table{width:100%;border-collapse:collapse}
#hd .sec-spec tr{border-bottom:1px solid #1b233a}
#hd .sec-spec tr img{width:10em}
#hd .sec-spec td,#hd .sec-spec th{padding:.75em 0 .6em}
#hd .sec-spec th{font-family:TradeGothicLTPro,Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif;font-size:1.4em;font-weight:700;text-align:left}
#hd .sec-spec td{line-height:1.5;text-align:center}
#hd .sec-spec thead th{padding:1.25em .5em}
#hd .sec-spec tbody th{width:12em}
@media screen and (max-width:620px){
#hd .sec-spec table{display:block;width:100%}
#hd .sec-spec tbody,#hd .sec-spec thead{display:block}
#hd .sec-spec tr{display:block}
#hd .sec-spec thead tr{display:flex;flex-wrap:nowrap}
#hd .sec-spec thead th{width:50%;padding:.75em 0}
#hd .sec-spec thead td{display:none}
#hd .sec-spec thead img{width:10em;max-width:90%!important;margin:0 auto}
#hd .sec-spec tbody tr{padding:.75em 0 .25em}
#hd .sec-spec tbody td,#hd .sec-spec tbody th{padding:0}
#hd .sec-spec tbody th{display:block;width:100%;font-size:1em}
#hd .sec-spec tbody td{display:inline-block;width:calc(50% - .25em)}
#hd .sec-spec tbody td[colspan="2"]{width:100%}
}
#hd .sec-vid{padding:4em 0;position:relative}
#hd .sec-vid .hd-container{width:90%}
#hd .sec-vid img{width:100%; max-width: fit-content !important}
#hd .sec-vid a{width:50%;margin:0 1em;position:relative;overflow:hidden}
#hd .sec-vid a:focus-visible>picture:after,#hd .sec-vid a:hover>picture:after{opacity:0}
#hd .sec-vid a:focus-visible .hd-cover,#hd .sec-vid a:hover .hd-cover{opacity:1;-moz-transform:scale(1,1);-o-transform:scale(1,1);-ms-transform:scale(1,1);-webkit-transform:scale(1,1);transform:scale(1,1)}
#hd .sec-vid a:focus-visible .hd-content,#hd .sec-vid a:hover .hd-content{-webkit-animation-delay:0s;-webkit-animation-duration:.25s;-webkit-animation-name:fadeInUp;-webkit-animation-timing-function:ease;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:both;-moz-animation-delay:0s;-moz-animation-duration:.25s;-moz-animation-name:fadeInUp;-moz-animation-timing-function:ease;-moz-animation-iteration-count:1;-moz-animation-fill-mode:both;-o-animation-delay:0s;-o-animation-duration:.25s;-o-animation-name:fadeInUp;-o-animation-timing-function:ease;-o-animation-iteration-count:1;-o-animation-fill-mode:both;animation-delay:0s;animation-duration:.25s;animation-name:fadeInUp;animation-timing-function:ease;animation-iteration-count:1;animation-fill-mode:both}
#hd .sec-vid a:focus-visible i,#hd .sec-vid a:hover i{-webkit-animation-delay:.4s;-webkit-animation-duration:.25s;-webkit-animation-name:fadeInLeft;-webkit-animation-timing-function:ease;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:both;-moz-animation-delay:.4s;-moz-animation-duration:.25s;-moz-animation-name:fadeInLeft;-moz-animation-timing-function:ease;-moz-animation-iteration-count:1;-moz-animation-fill-mode:both;-o-animation-delay:.4s;-o-animation-duration:.25s;-o-animation-name:fadeInLeft;-o-animation-timing-function:ease;-o-animation-iteration-count:1;-o-animation-fill-mode:both;animation-delay:.4s;animation-duration:.25s;animation-name:fadeInLeft;animation-timing-function:ease;animation-iteration-count:1;animation-fill-mode:both}
#hd .sec-vid a>picture{display:block;position:relative}
#hd .sec-vid a>picture:after{content:'';display:block;width:5em;height:5em;background:none;background-size:contain;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;-moz-transition:opacity .25s ease;-o-transition:opacity .25s ease;-webkit-transition:opacity .25s ease;transition:opacity .25s ease;z-index:2}
/* #hd .sec-vid .hd-content{display:block;width:100%;height:100%;font-family:TradeGothicLTPro,Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif;font-size:3.5em;color:#fff;padding:.5em;position:absolute;top:0;left:0;z-index:2;opacity:0} */


#hd .sec-vid .swiper-wrapper .swiper-slide.videoPlay a picture:after {background:url(../img/play-icon.svg) center no-repeat;background-size: contain;}

#hd .sec-vid .swiper-wrapper {display: inline-flex;}
#hd .sec-vid .swiper-wrapper .swiper-slide {padding-right: 10px;}



#hd .sec-vid .hd-content{display:block;width:28vw;height:100%;font-family:TradeGothicLTPro,Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif;font-size:2.5em;color:#fff;padding:.5em;position:absolute;top:1vw;left:0;z-index:2;opacity:0}
@media screen and (min-width:2560px) {#hd .sec-vid .hd-content{width:21vw;top:0.3vw;}}   

#hd .sec-vid .hd-content i{width:1.5em;position:absolute;right:0;bottom:0;margin:.5em}
#hd .sec-vid .hd-cover{width:100%;height:100%;position:absolute;top:0;left:0;background-color:#59bbff;background-image:-moz-linear-gradient(315deg,#59bbff,#be41ff,#ff98ea);background-image:-webkit-linear-gradient(315deg,#59bbff,#be41ff,#ff98ea);background-image:linear-gradient(315deg,#59bbff,#be41ff,#ff98ea);mix-blend-mode:multiply;opacity:0;-moz-transform:scale(1.2,1.2);-o-transform:scale(1.2,1.2);-ms-transform:scale(1.2,1.2);-webkit-transform:scale(1.2,1.2);transform:scale(1.2,1.2);-moz-transition:all .5s ease;-o-transition:all .5s ease;-webkit-transition:all .5s ease;transition:all .5s ease}
@media screen and (max-width:2560px){
#hd .sec-vid .hd-content{width: 21vw; font-size:1.8em}
}
@media screen and (max-width: 5120px){
#hd .sec-vid .hd-content{width: 19vw;}
}
@media screen and (max-width:1440px){
#hd .sec-vid .hd-content{font-size:1.5em}
}

@media screen and (max-width:1024px) and (orientation:portrait),screen and (max-width:1023px){
#hd .sec-vid{padding-bottom:2em}
#hd .sec-vid .hd-container{width:100%;padding:0 .75em}
#hd .sec-vid a{margin:0 .5em}
#hd .sec-vid a:focus-visible>picture:after,#hd .sec-vid a:hover>picture:after{opacity:1}
#hd .sec-vid a:focus-visible .hd-content,#hd .sec-vid a:hover .hd-content{animation:none!important}
#hd .sec-vid a:focus-visible i,#hd .sec-vid a:hover i{animation:none!important}
#hd .sec-vid .hd-cover{display:none}
#hd .sec-vid .hd-content{height:auto;font-size:1.5em;padding-right:3em;position:relative;opacity:1;width: 45vw;}
}
@media screen and (max-width:768px){
#hd .sec-vid .hd-container{padding:0 .5em}
#hd .sec-vid .hd-content{width: 45vw;}
}
@media screen and (max-width:766px){
    #hd .sec-vid .hd-content{width: 97vw;}
}
@media screen and (max-width:480px){
#hd .sec-vid{padding:2em 0 1em}
#hd .sec-vid .hd-container{flex-direction:column}
#hd .sec-vid a{width:100%;margin:.25em 0}
#hd .sec-vid a>picture:after{width:4em;height:4em}
}
#hd .sec-products{padding-bottom:10em;position:relative;overflow:hidden}
#hd .sec-products .hd-belt{font-size:7.2vw;letter-spacing:.024em;white-space:nowrap}
#hd .sec-products .hd-belt span{display:inline-block;margin:0 .4em}
#hd .sec-products .tab-list{border-top:1px solid #1b233a;margin:1em 0}
#hd .sec-products .tab-list>li{border-bottom:1px solid #1b233a}
#hd .sec-products .tab-list button{display:block;width:100%;font-size:1em;padding:1.25em 0;cursor:pointer;filter:grayscale(100%);-moz-transition:filter .25s ease;-o-transition:filter .25s ease;-webkit-transition:filter .25s ease;transition:filter .25s ease}
#hd .sec-products .tab-list button img{flex-shrink:0;width:auto;max-width:none!important;height:3em;-moz-transition:transform .25s ease;-o-transition:transform .25s ease;-webkit-transition:transform .25s ease;transition:transform .25s ease}
#hd .sec-products .tab-list button i{flex-shrink:0;display:block;width:2.5em;height:2.5em;border-radius:50%;border:1px solid #fff;position:relative}
#hd .sec-products .tab-list button i:after,#hd .sec-products .tab-list button i:before{content:'';display:block;width:1.5em;height:1px;background:#fff;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;-moz-transition:transform .25s ease;-o-transition:transform .25s ease;-webkit-transition:transform .25s ease;transition:transform .25s ease}
#hd .sec-products .tab-list button i:after{-moz-transform:rotate(90deg);-o-transform:rotate(90deg);-ms-transform:rotate(90deg);-webkit-transform:rotate(90deg);transform:rotate(90deg)}
#hd .sec-products .tab-list button:focus-visible,#hd .sec-products .tab-list button:hover{filter:grayscale(0)}
#hd .sec-products .tab-list button:active img{-moz-transform:scale(.95,.95);-o-transform:scale(.95,.95);-ms-transform:scale(.95,.95);-webkit-transform:scale(.95,.95);transform:scale(.95,.95)}
#hd .sec-products .tab-list button[aria-current=true]{filter:grayscale(0)}
#hd .sec-products .tab-list button[aria-current=true] i:before{-moz-transform:rotate(45deg);-o-transform:rotate(45deg);-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg)}
#hd .sec-products .tab-list button[aria-current=true] i:after{-moz-transform:rotate(135deg);-o-transform:rotate(135deg);-ms-transform:rotate(135deg);-webkit-transform:rotate(135deg);transform:rotate(135deg)}
#hd .sec-products .tab-content{margin-bottom:1em;position:relative}
#hd .sec-products .tab-content a{display:block;padding:.5em;text-align:center;color:#fff}
#hd .sec-products .tab-content img{width:100%}
#hd .sec-products .tab-content p{line-height:1;font-size:1.2em;font-weight:400;letter-spacing:.04em;margin:.5em 0 1em}
#hd .sec-products .tab-content .btn-arrow{width:2.75em;margin:0 auto}
#hd .sec-products .swiper-wrapper{padding-bottom:2.5em; display: inline-flex}
#hd .sec-products .swiper-scrollbar{width:80%;max-width:70em;background:#fff;border-radius:0;left:0;right:0;margin:0 auto;z-index:2}
#hd .sec-products .swiper-scrollbar-drag{border-radius:0;background-color:#59bbff;background-image:-moz-linear-gradient(-90deg,#59bbff,#be41ff,#ff98ea);background-image:-webkit-linear-gradient(-90deg,#59bbff,#be41ff,#ff98ea);background-image:linear-gradient(-90deg,#59bbff,#be41ff,#ff98ea)}
@media screen and (max-width:1024px) and (orientation:portrait),screen and (max-width:768px){
#hd .sec-products .tab-list button img{height:2em}
#hd .sec-products .tab-list button i{width:2em;height:2em}
#hd .sec-products .tab-list button i:after,#hd .sec-products .tab-list button i:before{width:1em}
#hd .sec-products .tab-content p{font-size:1.25em}
}
@media screen and (max-width:480px){
#hd .sec-products .tab-list button .hd-width{width:90%}
#hd .sec-products .tab-list button img{height:7vw}
#hd .sec-products .tab-content p{font-size: 1.225em}
}
#hd .sec-extend{width:100vw;height:100vh;height:-webkit-fill-available;height:fill-available;will-change:transform;-moz-transform:translate(100%,0);-o-transform:translate(100%,0);-ms-transform:translate(100%,0);-webkit-transform:translate(100%,0);transform:translate(100%,0);-moz-transition:transform 1s ease-in-out;-o-transition:transform 1s ease-in-out;-webkit-transition:transform 1s ease-in-out;transition:transform 1s ease-in-out;position:fixed;top:0;right:0;z-index:5}
#hd .sec-extend.hd-active{-moz-transform:translate(0,0);-o-transform:translate(0,0);-ms-transform:translate(0,0);-webkit-transform:translate(0,0);transform:translate(0,0)}
#hd .sec-extend.hd-active .hd-scroller{visibility:visible}
#hd .sec-extend .hd-scroller{height:100%;visibility:hidden;-webkit-overflow-scrolling:none;overscroll-behavior:none;overscroll-behavior-y:contain;touch-action:pan-x;overflow-y:auto;overflow-x:hidden}
#hd .sec-extend .hd-wrapper{width:100%;height:100%;-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);background:rgba(0,0,0,.6);position:relative;pointer-events:none;overflow:hidden}
#hd .sec-extend ul{display:flex;align-items:center;padding:0 5%;position:fixed;top:100px;bottom:0;left:0;right:0;margin:auto;pointer-events:auto}
#hd .sec-extend li{width:30vw;flex-shrink:0;display:flex;flex-direction:column;justify-content:flex-start;padding:0 3%}
#hd .sec-extend li:nth-child(2n){flex-direction:column-reverse;justify-content:flex-end}
#hd .sec-extend li:nth-child(2n) .hd-content{margin-top:0;margin-bottom:3em}
#hd .sec-extend li img{width:100%}
#hd .sec-extend .hd-content{margin-top:3em;touch-action:pan-y}
#hd .sec-extend .btn-container{width:100%;position:fixed;bottom:0;left:0;padding:3em 8%;pointer-events:auto}
#hd .sec-extend .btn-container button{cursor:pointer}
#hd .sec-extend .btn-container button i{display:block;width:3em;height:3em;border-radius:50%;border:2px solid #fff;position:relative;-moz-transition:transform .25s ease;-o-transition:transform .25s ease;-webkit-transition:transform .25s ease;transition:transform .25s ease}
#hd .sec-extend .btn-container button i:after,#hd .sec-extend .btn-container button i:before{content:'';display:block;width:1.5em;height:2px;background:#fff;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;-moz-transition:transform .25s ease;-o-transition:transform .25s ease;-webkit-transition:transform .25s ease;transition:transform .25s ease;-moz-transform:rotate(45deg);-o-transform:rotate(45deg);-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg)}
#hd .sec-extend .btn-container button i:after{-moz-transform:rotate(135deg);-o-transform:rotate(135deg);-ms-transform:rotate(135deg);-webkit-transform:rotate(135deg);transform:rotate(135deg)}
#hd .sec-extend .btn-container button span{display:block;font-family:TradeGothicLTPro,Roboto,"Segoe UI",Arial,"PingFang TC","Microsoft JhengHei","Microsoft YaHei",sans-serif;font-weight:700;font-size:1.125em;text-align:center;color:#fff;margin-top:.5em}
#hd .sec-extend .btn-container button:focus-visible i,#hd .sec-extend .btn-container button:hover i{-moz-transform:scale(1.1,1.1);-o-transform:scale(1.1,1.1);-ms-transform:scale(1.1,1.1);-webkit-transform:scale(1.1,1.1);transform:scale(1.1,1.1)}
#hd .sec-extend .btn-container button:active i{-moz-transform:scale(1,1);-o-transform:scale(1,1);-ms-transform:scale(1,1);-webkit-transform:scale(1,1);transform:scale(1,1)}
#hd .sec-extend .progress-indicator{width:80%;max-width:20em;height:4px;background:#fff;margin-left:2em;margin-bottom:1em;position:relative}
#hd .sec-extend .progress-indicator-progress{width:100%;height:100%;background-color:#59bbff;background-image:-moz-linear-gradient(-90deg,#59bbff,#be41ff,#ff98ea);background-image:-webkit-linear-gradient(-90deg,#59bbff,#be41ff,#ff98ea);background-image:linear-gradient(-90deg,#59bbff,#be41ff,#ff98ea);transform-origin:left;position:absolute;top:0;left:0}
#hd .sec-extend .logo-tuv{width:5em;margin-left:1em}
@media screen and (max-width:1440px){
#hd .sec-extend ul{align-items:flex-start}
#hd .sec-extend li{width:55vw}
#hd .sec-extend li figure{width:75%}
}
@media screen and (max-width:1024px){
#hd .sec-extend .hd-wrapper{padding-top:50px}
#hd .sec-extend ul{top:50px}
}
@media (hover:none){
body.show-extend #hd>div,body.show-extend #hd>section:not(.sec-extend){-moz-transition:transform 1s ease;-o-transition:transform 1s ease;-webkit-transition:transform 1s ease;transition:transform 1s ease;-moz-transform:translate(-100%,0);-o-transform:translate(-100%,0);-ms-transform:translate(-100%,0);-webkit-transform:translate(-100%,0);transform:translate(-100%,0)}
}
@media screen and (max-width:1024px) and (orientation:portrait),screen and (max-width:768px){
#hd .sec-extend li{width:80vw;flex-direction:column!important;align-items:flex-start}
#hd .sec-extend li figure{width:100%;height:0;padding-bottom:60%;position:relative}
#hd .sec-extend li figure img,#hd .sec-extend li figure video{position:absolute;top:0;left:0}
#hd .sec-extend li .hd-content{width:100%;max-height:18em;padding:2em 1em 2em 0;margin:0!important;position:relative;overflow-y:auto}
#hd .sec-extend .btn-container{padding:1em 8% 2.5em}
#hd .sec-extend .btn-container button span{font-size:1em}
}
@media screen and (max-width:480px){
#hd .sec-extend .hd-content.flex-nowrap{display:block}
#hd .sec-extend .logo-tuv{margin-left:0;margin-bottom:1em}
}
#hd .addDisclaimer{text-align:center;margin:0 auto;position:relative;display:block;width:100%;color:#999;margin-top:20px;text-decoration:underline}
@media screen and (max-width:620px){
#hd .addDisclaimer{width:65%}
}

#hd .sec-led ul.flex-nowrap {
    flex-direction: column;
}

#hd .sec-led .hd-width {
    width: 100%;
    max-width: 71em;
    flex-direction: column;
}
#hd .sec-led li.wd-inner {
    display: flex;
    padding-bottom: 6vw;
    margin: 0 auto;
}

#hd .sec-led li.wd-inner {
    display: flex;
    padding-bottom: 4vw;
    /* margin: 0 auto; */
    margin: 0 5vw;
}
@media screen and (max-width:767px){
    #hd .sec-led li.wd-inner {
        flex-direction: column;
        padding-bottom: 18vw;
    }
}
@media screen and (max-width:767px) {
    #hd .sec-led li.wd-inner.wd-inner-video {
        flex-direction: column-reverse;
    }
}

#hd .sec-led li.wd-inner .h4 {
    font-size: 2.5em;
    margin-top: 0.5vw;
}

#hd .hdrVideo {
    width: 50%;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 0 3%;
}

@media screen and (max-width:767px){
    #hd .hdrVideo {
        width: 100%;
        padding-bottom: 2vw;
    }
}
/* @media screen and (min-width:1701px){
    #hd .hdrVideo {width: 22vw;}
}
@media screen and (max-width:1700px){
    #hd .hdrVideo {width: 26vw;}
}
@media screen and (max-width:1400px){
    #hd .hdrVideo {width: 43vw;}
} */

#hd .sec-led .miniLED-1 {
    width: 90%;
}

#hd .sec-led .oled-1 {
    width: 100%;
}
#hd .sec-led .wd-inner .disclaimer {
    color: #999999;
}

@media screen and (max-width:1024px){
    #hd .sec-led li.wd-inner img {
        max-width: max-content!important;
        
    }
}
  #hd .sec-vid .hd-content {
    background: #000;
  }