*{margin:0;padding:0}body,html{height:100%;left:0;overflow:hidden;position:fixed;top:0;width:100%;background:#01112e}.logo2{position:absolute;width:2.56rem;height:19.5rem;left:1.5rem;top:1.5rem;background:url(../img/webp/logo2.webp) no-repeat top center/contain;z-index:10}.searchicon{position:absolute;left:50%;top:1.5rem;height:3rem;width:3rem;margin-left:-1.5rem;-webkit-transition:-webkit-transform .15s ease-out;transition:-webkit-transform .15s ease-out;transition:transform .15s ease-out;transition:transform .15s ease-out, -webkit-transform .15s ease-out;background:#896a43 url(../img/webp/searchicon.webp) no-repeat center/1.38rem;border-radius:50%;z-index:1;cursor:pointer}.searchicon:hover{-webkit-transform:scale(1.15);transform:scale(1.15)}.gridcardsbox{overflow:hidden;height:100vh;left:0;top:0;right:0;position:absolute}.gridcards{display:grid;grid-template-columns:repeat(5, 1fr);gap:min(3.5rem,3.88vw);margin-left:-3.5rem;margin-right:-3.5rem;margin-bottom:-1.75rem;margin-top:-1.75rem;padding-bottom:1.75rem;padding-top:1.75rem;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.gridcard{position:relative;aspect-ratio:450/630;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.gridcard .card{background:url(../img/webp/itembg.webp) no-repeat center/100% 100%;height:100%;-webkit-transition:-webkit-transform .3s ease-out;transition:-webkit-transform .3s ease-out;transition:transform .3s ease-out;transition:transform .3s ease-out, -webkit-transform .3s ease-out;border-radius:.5rem;cursor:pointer}.gridcard:hover>.card{-webkit-transform:scale(1.05);transform:scale(1.05);-webkit-backface-visibility:hidden;backface-visibility:hidden}.gridcard img{width:100%;height:100%;-o-object-fit:contain;object-fit:contain}.gridcard .name{position:absolute;width:100%;left:0;bottom:2rem;text-align:center;color:#e5e5e5;padding:0 1.2rem;-webkit-box-sizing:border-box;box-sizing:border-box;min-height:2em;font-family:"sk"}.gridcard .name i{font-size:1rem;display:block;font-style:normal;margin-bottom:.5rem}.gridcard .name h3{font-size:1.1rem;font-weight:normal}.gridcard .name h3.longname{font-size:1rem}.gridcard .colors{position:absolute;width:100%;bottom:0;display:-webkit-box;display:-ms-flexbox;display:flex}.gridcard .colors i{width:2rem;height:2rem}.gridoverlay{position:fixed;top:0;left:0;pointer-events:none;background:url(../img/gridoverlay.webp) no-repeat center/100% 100%;width:100%;height:100%}.gridsearchbox{display:none;z-index:2;height:100%;left:0;top:0;right:0;position:absolute;background-color:#01112e;overflow:auto}.gridsearchbox .close{position:fixed;right:1.5rem;top:2rem;width:2.5rem;height:2.5rem;background:url(../img/webp/close.webp) no-repeat center/contain;cursor:pointer}.wwselect,.searchbox{position:relative;margin-right:1rem;width:10rem;height:3rem;color:#9c8d75;line-height:3rem;-webkit-box-sizing:border-box;box-sizing:border-box}.searchbox{width:19rem;display:-webkit-box;display:-ms-flexbox;display:flex;border-radius:2rem;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-left:1rem;overflow:hidden;border:1px solid #896a43}.searchbox input[type=text]{width:75%;background:none;font-size:1.125rem;color:#896a43;font-family:"sk"}.searchbox input[type=text]::-webkit-input-placeholder{color:#896a43}.searchbox input[type=text]::-moz-placeholder{color:#896a43}.searchbox input[type=text]:-ms-input-placeholder{color:#896a43}.searchbox input[type=text]::-ms-input-placeholder{color:#896a43}.searchbox input[type=text]::placeholder{color:#896a43}.searchbox input[type=text]:focus{outline:none}.wwselect .box{position:relative;width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:#04234c;border-radius:2rem;padding:0 1rem;border:1px solid #04234c}.wwselect .box>span{display:block;width:80%;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.wwselect .box>i{position:absolute;width:1.2rem;height:1.2rem;right:1rem;background:url(../img/arrow1.png) no-repeat center/1rem;z-index:9}.wwselect .mask{position:fixed;top:0;bottom:0;right:0;left:0;display:none;z-index:1}.wwselect .list{position:absolute;top:2.2rem;right:0;left:0;display:none;overflow:auto;padding-top:1rem;padding-bottom:1rem;max-height:32rem;background:#04234c;z-index:100;-webkit-transition:all .5s ease;transition:all .5s ease;border:1px solid currentColor;border-top:0;border-bottom-left-radius:1rem;border-bottom-right-radius:1rem}.wwselect .list::before{content:"";position:absolute;height:1px;top:.6rem;right:0;left:10%;width:80%;-webkit-transform:scale(0);transform:scale(0);background-color:#1f3859;-webkit-transition:all .3s .3s;transition:all .3s .3s}.wwselect .list li{padding:.5rem 1rem;color:#9c8d75;cursor:pointer;line-height:1.2}.wwselect .list li:hover,.wwselect .list li.active{color:#eedfcc}.wwselect.colorselect .box span{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.wwselect.colorselect .box span i{border-radius:50%;height:1.6rem;width:1.6rem;position:relative;margin-right:.5rem}.wwselect.colorselect.active .box span i{top:-0.2rem}.wwselect.colorselect.active .list{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.wwselect.colorselect.active .list li{position:relative;width:2rem !important;height:2rem;border-radius:50%;font-size:0;margin:.5rem;-webkit-box-sizing:content-box;box-sizing:content-box;padding:0}.wwselect.colorselect.active .list li i{position:relative;display:block;width:100%;height:100%;border-radius:50%}.wwselect.colorselect.active .list li.active:before{content:"";position:absolute;top:3%;left:3%;width:94%;height:94%;border-radius:50%;-webkit-animation:active 1.5s linear infinite;animation:active 1.5s linear infinite}@-webkit-keyframes active{0%,100%{-webkit-box-shadow:0 0 5px 0 hsla(0,0%,100%,.4);box-shadow:0 0 5px 0 hsla(0,0%,100%,.4)}50%{-webkit-box-shadow:0 0 10px 5px hsla(0,0%,100%,.6);box-shadow:0 0 10px 5px hsla(0,0%,100%,.6)}}@keyframes active{0%,100%{-webkit-box-shadow:0 0 5px 0 hsla(0,0%,100%,.4);box-shadow:0 0 5px 0 hsla(0,0%,100%,.4)}50%{-webkit-box-shadow:0 0 10px 5px hsla(0,0%,100%,.6);box-shadow:0 0 10px 5px hsla(0,0%,100%,.6)}}.wwselect.active .box{border:1px solid currentColor;border-radius:1rem}.wwselect.active .box>i{background-image:url(../img/webp/close1.webp);background-size:contain;cursor:pointer}.wwselect.active .box span{color:#9c8d75}.wwselect.active .list{display:block}.wwselect.active .list::before{-webkit-transform:scale(1);transform:scale(1)}.wwselect.active .mask{display:block}.wwselect.hasdata .box{background-color:#0b5fac;border-color:#0b5fac}.wwselect.hasdata .box span{color:#fff}.wwselect.hasdata.active .box{background-color:#04234c;border-color:currentColor}.gridnav{position:fixed;top:0;width:80.2%;left:9.9%;padding:1.8rem 0;border-bottom:1px solid #896a43;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;z-index:1;background:#01112e;font-size:1.125rem;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-transition:all .3s ease;transition:all .3s ease}.gridnav .left{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.gridnav .right{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-negative:0;flex-shrink:0}.gridnav .searchbtn{position:absolute;right:0;top:0;width:6rem;text-align:center;color:#fff;background:#896a43;-webkit-transition:all .3s ease;transition:all .3s ease;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.gridnav .clearbtn{color:#9c8d75;margin-left:1rem;cursor:pointer}.gridnav .morebtn{display:-webkit-box;display:-ms-flexbox;display:flex;margin-left:3rem;cursor:pointer}.gridnav .morebtn span{font-size:1rem;color:#9c8d75}.gridnav .morebtn>i{width:1.2rem;height:1.2rem;background:url(../img/arrow1.png) no-repeat center/0.8rem;z-index:9;margin-left:.2rem;-webkit-transition:all .3s ease;transition:all .3s ease}.gridnav .moreselectbox{display:none;width:100%;margin-top:1rem}.gridnav.open{height:10.5rem}.gridnav.open .left{-ms-flex-wrap:wrap;flex-wrap:wrap}.gridnav.open .morebtn i{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.gridnav.open .moreselectbox{display:-webkit-box;display:-ms-flexbox;display:flex}.gridsearchcards{position:relative;display:grid;grid-template-columns:repeat(5, 1fr);gap:min(1.5rem,3.88vw);margin:0 auto 4rem;-webkit-transition:all .3s;transition:all .3s;opacity:0;-webkit-animation:gridsearchcards .5s .3s ease forwards;animation:gridsearchcards .5s .3s ease forwards}@-webkit-keyframes gridsearchcards{0%{width:100%;opacity:0}100%{margin-top:8rem;opacity:1;width:80%}}@keyframes gridsearchcards{0%{width:100%;opacity:0}100%{margin-top:8rem;opacity:1;width:80%}}.gridsearchcards .nodata{position:absolute;text-align:center;top:10rem;width:100%}.gridsearchcards .nodata p{margin-top:1rem;color:#d0b586;font-size:1.125rem}.gridsearchcards.open{opacity:1;width:80%;margin-top:8rem;-webkit-animation:gridsearchcards1 .5s 0s ease forwards;animation:gridsearchcards1 .5s 0s ease forwards}@-webkit-keyframes gridsearchcards1{0%{width:80%;opacity:1;margin-top:8rem}100%{margin-top:12rem;opacity:1;width:80%}}@keyframes gridsearchcards1{0%{width:80%;opacity:1;margin-top:8rem}100%{margin-top:12rem;opacity:1;width:80%}}.gridsearchcards.up{opacity:1;width:80%;margin-top:12rem;-webkit-animation:gridsearchcards2 .5s 0s ease forwards;animation:gridsearchcards2 .5s 0s ease forwards}@-webkit-keyframes gridsearchcards2{0%{margin-top:12rem;opacity:1;width:80%}100%{width:80%;opacity:1;margin-top:8rem}}@keyframes gridsearchcards2{0%{margin-top:12rem;opacity:1;width:80%}100%{width:80%;opacity:1;margin-top:8rem}}.backhome{position:absolute;right:0;bottom:0;width:5rem;height:5rem;background:url(../img/webp/home.webp) no-repeat center/2.4rem;cursor:pointer;-webkit-transition:all .5s;transition:all .5s}.backhome:hover{-webkit-transform:scale(1.1);transform:scale(1.1)}.pcbody .filterwrap{display:none}.wapbody .logo2{width:1.5rem;height:12rem;left:.8rem;top:1rem}.wapbody .gridcard{aspect-ratio:450/600}.wapbody .gridcard .name{bottom:1rem;padding:0 1rem}.wapbody .gridcard .name i{margin-bottom:.2rem}.wapbody .gridcards{margin-left:-0.8rem;margin-right:-0.8rem;margin-bottom:-1.2rem;margin-top:-1.2rem;padding-bottom:1.2rem;padding-top:1.2rem;gap:6.4vw;grid-template-columns:repeat(3, 1fr)}.wapbody .gridsearchcards{gap:4vw;grid-template-columns:repeat(2, 1fr)}.wapbody .gridsearchcards .gridcard .name{bottom:1.2rem}.wapbody .gridsearchcards .gridcard .name h3{font-size:1.2rem}.wapbody .filterwrap{display:none;z-index:11;height:100%;left:0;top:0;right:0;position:absolute;background-color:#01112e;overflow:hidden;padding:3rem 5rem;-webkit-box-sizing:border-box;box-sizing:border-box}.wapbody .filterwrap .filtertitle{font-size:1.5rem;color:#896a43;text-align:center}.wapbody .filterwrap .filterselectbox{font-size:1.2rem;max-height:calc(100vh - 14rem);overflow:auto;margin-bottom:1rem}.wapbody .filterwrap .filterselectbox .wwselect{width:100%;margin:1.5rem 0;height:auto}.wapbody .filterwrap .filterselectbox .wwselect .mask{position:absolute;height:3rem}.wapbody .filterwrap .filterselectbox .wwselect .list{position:relative;top:-0.8rem;max-height:-webkit-max-content;max-height:-moz-max-content;max-height:max-content}.wapbody .filterwrap .filterselectbox .wwselect .list:before{width:94%;left:3%}.wapbody .filterwrap .filterselectbox .wwselect .list li{width:33.3%}.wapbody .filterwrap .filterselectbox .wwselect.active .list{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.wapbody .filterwrap .filterselectbox .wwselect.materialselect .list li,.wapbody .filterwrap .filterselectbox .wwselect.typeselect .list li{width:25%}.wapbody .filterwrap .filterselectbox .wwselect.dynastyselect .list li,.wapbody .filterwrap .filterselectbox .wwselect.varietyselect .list li,.wapbody .filterwrap .filterselectbox .wwselect.originselect .list li,.wapbody .filterwrap .filterselectbox .wwselect.usageselect .list li{width:50%}.wapbody .filterwrap .morebtn{display:none}.wapbody .filterwrap .filterbtnbox{display:-webkit-box;display:-ms-flexbox;display:flex;font-size:1.2rem;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.wapbody .filterwrap .filterbtnbox>div{width:48%;height:3rem;border-radius:3rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.wapbody .filterwrap .filterbtnbox .confirmbtn{background-color:#896a43}.wapbody .filterwrap .filterbtnbox .clearbtn{color:#896a43;border:1px solid #896a43}.wapbody .gridnav .filterbtn{display:-webkit-box;display:-ms-flexbox;display:flex}.wapbody .gridnav .filterbtn i{width:1.2rem;height:1.2rem;background:url(../img/filter.png) no-repeat center/0.8rem}.wapbody .gridnav .filterbtn{color:#896a43}.wapbody .gridsearchbox .close{right:.6rem}