.hotspotMap{display:flex;flex-direction:column;row-gap:1.6rem;position:relative}.hotspotMap .hotspotMapImg{position:relative;display:flex;align-items:center}.hotspotMap .hotspotMapImg img{max-width:100%;width:100%;height:auto;aspect-ratio:2/1;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center;border-radius:.8rem}.hotspotMap .hotspotMapImg .rectangle{width:100%;height:100%;position:absolute;top:0;left:0;display:flex;align-items:center}.hotspotMap .hotspotMapProduct{width:100vw;height:100dvh;display:none;flex-direction:column;align-items:center;justify-content:center;gap:2.4rem;position:fixed;top:0;left:0;background:#00000080;z-index:10}.hotspotMap .hotspotMapProduct .rectangle{width:100%;padding:0 2rem;display:flex;align-items:center;justify-content:flex-start;gap:.8rem;overflow-x:auto}.hotspotMap .hotspotMapProduct .rectangle::-webkit-scrollbar{display:none}.hotspotMap .hotspotMapProduct .rectangle>svg{display:none}.hotspotMap .hotspotMapProduct .rectangle .itemBox{padding:1.6rem;border-radius:.8rem;background:#fff;max-width:calc(80vw - 4rem);flex:0 0 auto;width:100%;height:auto;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;row-gap:.8rem;text-decoration:none;position:relative}.hotspotMap .hotspotMapProduct .rectangle .itemBox>*{width:60vw}.hotspotMap .item{position:absolute;top:0;left:0;display:flex;align-items:center;justify-content:center}.hotspotMap .item>svg{display:none;position:relative;left:-.8rem}.hotspotMap .item .circle{width:3.4rem;height:3.4rem;display:flex;align-items:center;justify-content:center;position:relative}.hotspotMap .item .circle .outer-circle{width:100%;height:100%;border-radius:50%;position:relative;display:flex;align-items:center;justify-content:center;opacity:.3;animation:pulse 3s ease-in-out infinite}.hotspotMap .item .circle .center-dot{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:50%;height:50%;border-radius:50%}.hotspotMap .item .itemBox{padding:1.6rem;border-radius:.8rem;background:#fff;width:32.6rem;height:auto;display:none;flex-direction:column;align-items:flex-start;justify-content:flex-start;row-gap:.8rem;text-decoration:none;position:absolute;left:calc(100% - .8rem)}.hotspotMap .item .itemBox>*{width:100%}.hotspotMap .item .itemBox .colorList,.hotspotMap .item .itemBox .tagList,.hotspotMap .item .itemBox .card--product{display:none}.hotspotMap .item:hover>svg{display:flex}.hotspotMap .item:hover .itemBox{display:flex}@media screen and (max-width: 960px){.hotspotMap .hotspotMapImg img{aspect-ratio:unset}.hotspotMap .item .circle{transform:scale(.5)}.hotspotMap .item svg{transition:transform .15s ease-out}.hotspotMap .item .itemBox{max-width:75vw;left:0;top:100%;margin-top:1.6rem}.hotspotMap .item:hover>svg,.hotspotMap .item.active>svg{display:none}.hotspotMap .item:hover .itemBox{display:none}.hotspotMap .item.active .itemBox{display:flex}}@keyframes pulse{0%{transform:scale(1.4);opacity:.6}50%{transform:scale(.7);opacity:.3}to{transform:scale(1.4);opacity:.6}}
/*# sourceMappingURL=/cdn/shop/t/16/assets/section-hotspot-map.css.map */
