.zn--wrapper{font-family:OPPOSans-Ver2-Regular,OPPOSans-Regular,PingFang SC,Hiragino Sans GB,STHeiti,Microsoft YaHei,WenQuanYi Micro Hei,Helvetica Neue,Helvetica,Arial,sans-serif}.zn--wrapper .font-b{font-family:OPPOSans-Ver2-Bold,OPPOSans-Bold,PingFang SC,Hiragino Sans GB,STHeiti,Microsoft YaHei,WenQuanYi Micro Hei,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:400}.zn--wrapper .font-m{font-family:OPPOSans-Ver2-Medium,OPPOSans-Medium,PingFang SC,Hiragino Sans GB,STHeiti,Microsoft YaHei,WenQuanYi Micro Hei,Helvetica Neue,Helvetica,Arial,sans-serif}.zn--wrapper .font-r,.zn--wrapper .font-l{font-family:OPPOSans-Ver2-Regular,OPPOSans-Regular,PingFang SC,Hiragino Sans GB,STHeiti,Microsoft YaHei,WenQuanYi Micro Hei,Helvetica Neue,Helvetica,Arial,sans-serif}html{overflow:unset!important}*,:after,:before{box-sizing:initial}@media (orientation: portrait) and (max-width: 1023px) and (min-width: 721px){#oc-header{overflow:hidden}}@media (orientation: portrait) and (max-width: 1023px){#oc-header.fixed{visibility:hidden}}#oc-wrapper{overflow:visible}#footer{overflow-x:hidden}#oc-wrapper{transition:none}#oc-wrapper .header-v2 .header-main-pc .header-right .search{-webkit-backdrop-filter:none;backdrop-filter:none}#oc-header{transition:none}#nps .icon,#contact-pop .contact-pop_icon,#goback-top{-webkit-backdrop-filter:none;backdrop-filter:none}.__ROOT_CLASS__,.__ROOT_CLASS__ .font-t{font-family:OnePlus Sans Regular,PingFang SC,Hiragino Sans GB,STHeiti,Microsoft YaHei,WenQuanYi Micro Hei,Helvetica Neue,Helvetica,Arial,sans-serif}.__ROOT_CLASS__ .font-b,.__ROOT_CLASS__ .font-m{font-family:OnePlus Sans Medium,PingFang SC,Hiragino Sans GB,STHeiti,Microsoft YaHei,WenQuanYi Micro Hei,Helvetica Neue,Helvetica,Arial,sans-serif}.__ROOT_CLASS__ .font-r{font-family:OnePlus Sans Regular,PingFang SC,Hiragino Sans GB,STHeiti,Microsoft YaHei,WenQuanYi Micro Hei,Helvetica Neue,Helvetica,Arial,sans-serif}.__ROOT_CLASS__ .font-l{font-family:OnePlus Sans Display Light,PingFang SC,Hiragino Sans GB,STHeiti,Microsoft YaHei,WenQuanYi Micro Hei,Helvetica Neue,Helvetica,Arial,sans-serif}.__ROOT_CLASS__ .font-d{font-family:OnePlus Sans Display,PingFang SC,Hiragino Sans GB,STHeiti,Microsoft YaHei,WenQuanYi Micro Hei,Helvetica Neue,Helvetica,Arial,sans-serif}body{overflow:unset;line-height:normal}body.hide-body{overflow:hidden}#header .nav{z-index:99}#header .nav .nav-right>li,#header .nav .nav-right>li a,#header .nav .nav-right>li .info{margin-right:0}#footer>.container-infinite>.container-text{overflow:hidden}#main-wrapper .container{padding:0;margin:0;width:auto}#main-wrapper .container:before,#main-wrapper .container:after{content:none}.exh-buy{width:218px;height:40px;border-radius:77px;font-size:16px;z-index:2;color:#fff;background:#000;cursor:pointer}@media (max-width: 649px){.exh-buy{font-size:14px;cursor:auto}}.rel{position:relative}.abs{position:absolute}.abs.clip{top:0;left:0}.abs.abs-c{top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.flex{display:flex}.flex.col{flex-direction:column}.flex.flex-c{justify-content:center;align-items:center}.full{width:100%;height:100%}.cursor{cursor:pointer}@media (max-width: 649px){.pc-only{display:none}}@media (min-width: 650px) and (max-width: 1023px){.pc-only{display:none}}@media (min-width: 1024px){.pc-hidden{display:none}}.exh-color{width:100%;z-index:2;-webkit-tap-highlight-color:transparent}.exh-color .color{min-width:100px;cursor:pointer}@media (max-width: 649px){.exh-color .color{cursor:auto}}.exh-color .color .color-t{margin-top:12px;font-size:14px;opacity:.4}@media (max-width: 649px){.exh-color .color .color-t{font-size:12px}}.exh-color .color .piece{width:30px;height:30px;border-radius:50%;position:relative;box-shadow:inset 0 0 3px #00000040}.exh-color .color .piece:before{content:"";position:absolute;width:35px;height:35px;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);border-radius:50%}@media (max-width: 649px){.exh-color .color .piece{width:24px;height:24px}.exh-color .color .piece:before{width:28px;height:28px}}.exh-color .color.active .color-t{opacity:1}.exh-color .color.active .piece:before{border:1px solid currentColor}.exh-intro{z-index:10}.exh-intro .text-1{font-size:16px}.exh-intro .text-2{font-size:32px;margin-top:16px}@media (min-width: 1024px) and (max-width: 1100px){.exh-intro .text-2{font-size:28px}}@media (max-width: 649px){.exh-intro{display:none}}.exh-progress{background:#f2f2f2;z-index:99;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-user-drag:none}.exh-progress.disappear{display:none;pointer-events:none}.exh-progress .phone-name{color:#000;font-size:32px}.exh-progress .bar{width:300px;height:7px;border-radius:10px;overflow:hidden;background:#fff;margin:15px 0}.exh-progress .bar .inner{width:100%;height:100%;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:left;transform-origin:left;border-radius:10px;background:#808080}.exh-control{position:absolute;bottom:60px;left:50%;-webkit-transform:translateX(-50%);transform:translate(-50%);color:#0009;z-index:10;gap:24px}@media (min-width: 650px) and (max-width: 1023px){.exh-control{-webkit-transform-origin:bottom;transform-origin:bottom;-webkit-transform:translate(-50%) scale(.6);transform:translate(-50%) scale(.6)}}.exh-control .exh-input{width:300px}.exh-control .exh-input .input{width:100%;height:5px;border-radius:5px;background:#d1d1d1;outline:none;padding:0;margin:0;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;line-height:normal;-webkit-tap-highlight-color:transparent}.exh-control .exh-input .input::-webkit-slider-thumb{-webkit-appearance:none;width:45px;height:24px;appearance:none;box-shadow:none;border:0;background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDUiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCA0NSAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3QgeD0iMC4zNDExODciIHdpZHRoPSI0NCIgaGVpZ2h0PSIyNCIgcng9IjEyIiBmaWxsPSJibGFjayIvPgo8cGF0aCBkPSJNMTYuMzQxMiAxNkwxMi4zNDEyIDEyTDE2LjM0MTIgOCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KPHBhdGggZD0iTTI4LjM0MTIgOEwzMi4zNDEyIDEyTDI4LjM0MTIgMTYiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS13aWR0aD0iMS41Ii8+Cjwvc3ZnPgo=) no-repeat}.exh-control .exh-input .input::-moz-range-thumb{width:45px;height:24px;-moz-appearance:none;appearance:none;box-shadow:none;border:0;background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDUiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCA0NSAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3QgeD0iMC4zNDExODciIHdpZHRoPSI0NCIgaGVpZ2h0PSIyNCIgcng9IjEyIiBmaWxsPSJibGFjayIvPgo8cGF0aCBkPSJNMTYuMzQxMiAxNkwxMi4zNDEyIDEyTDE2LjM0MTIgOCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KPHBhdGggZD0iTTI4LjM0MTIgOEwzMi4zNDEyIDEyTDI4LjM0MTIgMTYiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS13aWR0aD0iMS41Ii8+Cjwvc3ZnPgo=) no-repeat}.exh-control .exh-input p{font-size:14px;margin-top:16px;text-align:center}@media (max-width: 649px){.exh-control .exh-input p{font-size:10px;margin-top:8px}}.exh-control .open-close .icon{width:38px;height:38px;border-radius:50%;background-color:#fff;margin-bottom:4px}@media (max-width: 649px){.exh-control .open-close .icon{margin-bottom:0}}.exh-control .open-close .open,.exh-control .open-close .close{font-size:14px;cursor:pointer}@media (max-width: 649px){.exh-control .open-close .open,.exh-control .open-close .close{font-size:10px;line-height:1}}.exh-control .open-close .open{margin-left:20px}.exh-control.mall{height:90px;width:440px;border-radius:12px;bottom:12px;background-color:#fff}@media (max-width: 649px){.exh-control.mall{width:94.4444vw;height:20vw;gap:0}}.exh-control.mall .open-close{width:58px;margin-top:-6px}@media (max-width: 649px){.exh-control.mall .open-close{width:36px}}.exh-control.mall .open-close .open{display:none;margin-left:0}@media (max-width: 649px){.exh-control.mall .open-close{margin-top:-10px;margin-left:8px}}.exh-control.mall .exh-input{width:210px}@media (max-width: 649px){.exh-control.mall .exh-input{width:200px}}.exh-control.mall .open-close .open{margin-left:0;display:none}.exh-control.mall .open-close.unfold .open{display:flex}.exh-control.mall .open-close.unfold .close{display:none}.exh-control.mall .color-wrap{width:67px;cursor:pointer;-webkit-tap-highlight-color:transparent;margin-top:-6px;--select-color: #99bcb7}@media (max-width: 649px){.exh-control.mall .color-wrap{margin-left:4px;margin-top:-10px}}.exh-control.mall .color-wrap .text{font-size:14px;line-height:1;text-align:center;height:17px}@media (max-width: 649px){.exh-control.mall .color-wrap .text{height:14px;font-size:10px;line-height:1}}.exh-control.mall .color-wrap .circle-wrap{width:38px;height:38px;display:flex;justify-content:center;align-items:center;margin-bottom:4px}@media (max-width: 649px){.exh-control.mall .color-wrap .circle-wrap{margin-bottom:0}}.exh-control.mall .color-wrap .circle{width:20px;height:20px;border-radius:50%;background-color:var(--select-color);box-shadow:inset 0 0 3px #00000040}.exh-control.mall .color-wrap .icon{opacity:.6;bottom:0;right:-.75em;transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s,-webkit-transform .3s}@media (max-width: 649px){.exh-control.mall .color-wrap .icon{bottom:0}}.exh-control.mall .color-wrap.active{color:#000}.exh-control.mall .color-wrap.active .icon{opacity:1;-webkit-transform:rotate(180deg);transform:rotate(180deg)}.exh-control.mall .color-list{height:68px;top:-85%;right:0;background-color:#fff;border-radius:12px;justify-content:space-between;align-items:center;-webkit-transform:translateY(10px);transform:translateY(10px);opacity:0;transition:opacity .3s,-webkit-transform .3s;transition:opacity .3s,transform .3s;transition:opacity .3s,transform .3s,-webkit-transform .3s;pointer-events:none}@media (min-width: 650px) and (max-width: 1023px){.exh-control.mall .color-list{padding-bottom:4px}}@media (max-width: 649px){.exh-control.mall .color-list{height:62px;top:-100%}}.exh-control.mall .color-list.active{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);pointer-events:auto}.exh-control.mall .color-list .color{margin:4px 15px;color:#0006}.exh-control.mall .color-list .color .text{margin-top:8px;text-align:center}.exh-control.mall .color-list .color .circle{position:relative;width:18px;height:18px}.exh-control.mall .color-list .color .circle:after{content:"";width:22px;height:22px;position:absolute;border-radius:50%;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);border:1px solid transparent}.exh-control.mall .color-list .color.active{color:#0009}.exh-control.mall .color-list .color.active .circle:after{border-color:currentColor}body{margin:0}#exhibition{width:100%;height:100vh;overflow:hidden;background-color:#f5f5f5;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-user-drag:none}#exhibition .exh-intro{left:64px;top:220px}#exhibition .exh-canvas{z-index:1;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-user-drag:none}#exhibition .exh-buy,#exhibition .exh-color{z-index:2}#exhibition .exh-color{width:275px;left:64px;top:388px;margin-left:-25px}@media (max-width: 649px){#exhibition .exh-color{top:unset;bottom:80px;left:50%;-webkit-transform:translateX(-50%);transform:translate(-50%);margin:0;display:none}}#exhibition .exh-buy{left:50%;-webkit-transform:translateX(-50%);transform:translate(-50%);bottom:20px;-webkit-transform-origin:bottom;transform-origin:bottom}#exhibition .exh-buy.mall{bottom:135px}@media (min-width: 650px) and (max-width: 1023px){#exhibition .exh-buy.mall{bottom:130px}}@media (min-width: 650px) and (max-width: 1023px){#exhibition .exh-buy{-webkit-transform:translateX(-50%) scale(.6);transform:translate(-50%) scale(.6)}}#exhibition .exh-tips{position:absolute;bottom:60px;left:64px;font-size:12px;opacity:.4;text-align:center;z-index:2}@media (max-width: 649px){#exhibition .exh-tips{left:0;right:0;bottom:180px;font-size:10px;text-align:center}}@media (min-width: 650px) and (max-width: 1023px){#exhibition .exh-tips{width:100%;bottom:88px;left:50%;font-size:10px;-webkit-transform:translateX(-50%);transform:translate(-50%)}}#exhibition.with-nav{height:var(--content-height)}#exhibition.with-nav .exh-intro{top:160px}#exhibition.with-nav .exh-color{top:328px}@media (max-width: 649px){#exhibition.with-nav .exh-color{top:unset;bottom:20px}}@media (max-width: 649px){#exhibition.with-nav .exh-tips{left:0;right:0;bottom:100px;font-size:10px;text-align:center}}#exhibition.mall .exh-color{top:unset;left:50%;bottom:6.25vw;margin:0;-webkit-transform:translateX(-50%);transform:translate(-50%)}@media (max-width: 649px){#exhibition.mall .exh-color{top:unset;bottom:80px;left:50%;-webkit-transform:translateX(-50%);transform:translate(-50%);margin:0}}#exhibition.mall .mall-title{padding-top:3.6458vw;text-align:center;font-size:30px;position:relative;z-index:20}@media (max-width: 649px){#exhibition.mall .mall-title{font-size:22px;padding-top:50px}}#exhibition .s-only{display:none}@media (min-width: 1024px) and (max-width: 1100px){#exhibition .s-only{display:block}}