.f_tooltip{position:relative;display:inline-block;border-bottom:1px dotted #000;cursor:pointer}.f_tooltip .f_top,.f_tooltip .f_bottom,.f_tooltip .f_right,.f_tooltip .f_left{position:absolute;width:auto;color:var(--color-white);text-align:center;background-color:var(--color-black-500);border-radius:12px;padding:5px 10px 5px 10px;z-index:1;opacity:0;pointer-events:none;box-shadow:0 0 3px rgb(0 0 0 / .3)}.f_tooltip .f_top::after,.f_tooltip .f_bottom::after,.f_tooltip .f_right::after,.f_tooltip .f_left::after{content:"";position:absolute;border-width:5px;border-style:solid}.f_tooltip .f_top{bottom:calc(100% + 10px);left:50%;transform:translateX(-50%)}.f_tooltip .f_top::after{content:"";top:100%;left:50%;transform:translateX(-50%);border-width:5px;border-style:solid;border-color:#000 #fff0 #fff0 #fff0;box-shadow:-6px 0 12px rgb(0 0 0 / .1)}.f_tooltip .f_bottom{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);box-shadow:-6px 0 12px rgb(0 0 0 / .1)}.f_tooltip .f_bottom::after{content:"";position:absolute;bottom:100%;left:50%;transform:translateX(-50%);border-width:5px;border-style:solid;border-color:#fff0 #fff0 #000 #fff0}.f_tooltip .f_right{position:absolute;top:50%;left:calc(100% + 10px);transform:translateY(-50%);box-shadow:-6px 0 12px rgb(0 0 0 / .1)}.f_tooltip .f_right::after{content:"";position:absolute;top:50%;right:100%;transform:translateY(-50%);border-width:5px;border-style:solid;border-color:#fff0 #000 #fff0 #fff0}.f_tooltip .f_left{position:absolute;top:50%;right:calc(100% + 10px);transform:translateY(-50%);box-shadow:6px 0 12px rgb(0 0 0 / .1)}.f_tooltip .f_left::after{content:"";position:absolute;top:50%;left:100%;transform:translateY(-50%);border-width:5px;border-style:solid;border-color:#fff0 #fff0 #fff0 #000}.f_tooltip:hover .f_top,.f_tooltip:active .f_top,.f_tooltip:focus .f_top,.f_tooltip:hover .f_bottom,.f_tooltip:active .f_bottom,.f_tooltip:focus .f_bottom,.f_tooltip:hover .f_right,.f_tooltip:active .f_right,.f_tooltip:focus .f_right,.f_tooltip:hover .f_left,.f_tooltip:active .f_left,.f_tooltip:focus .f_left{opacity:1;pointer-events:auto;transition:opacity var(--transition-relax)}.f_tooltip .f_sm{width:150px}.f_tooltip .f_md{width:300px}.f_tooltip .f_lg{width:600px}.f_tooltip_js{position:absolute;z-index:3000;display:inline-block;padding:5px 10px 5px 10px;background-color:var(--color-black-500);color:var(--color-white);border-radius:12px;white-space:nowrap;opacity:0;pointer-events:none;box-shadow:0 0 3px rgb(0 0 0 / .3)}[data-f-toggle="tooltip_js"]{border-bottom:1px dotted #000}.f_tooltip_js::after{content:"";position:absolute;width:0;height:0;border:5px solid #fff0}.f_tooltip_js.f_show{opacity:1;transition:opacity var(--transition-relax)}.f_tooltip_js[data-f-dir="top"]{transform-origin:bottom center}.f_tooltip_js[data-f-dir="top"]::after{top:100%;left:50%;transform:translateX(-50%);border-top-color:var(--color-black-500)}.f_tooltip_js[data-f-dir="bottom"]{transform-origin:top center}.f_tooltip_js[data-f-dir="bottom"]::after{bottom:100%;left:50%;transform:translateX(-50%);border-bottom-color:var(--color-black-500)}.f_tooltip_js[data-f-dir="right"]{transform-origin:center left}.f_tooltip_js[data-f-dir="right"]::after{right:100%;top:50%;transform:translateY(-50%);border-right-color:var(--color-black-500)}.f_tooltip_js[data-f-dir="left"]{transform-origin:center right}.f_tooltip_js[data-f-dir="left"]::after{left:100%;top:50%;transform:translateY(-50%);border-left-color:var(--color-black-500)}