@charset "utf-8";
/* tooltip_box */
@keyframes pumping {
    0% { transform: scale(0); opacity: 0; }
    25% { transform: scale(1.07); opacity: 1; }
    50% { transform: scale(1); }
    75% { transform: scale(1.03); }
    100% { transform: scale(1); }
}
@keyframes pumping-center {
    0% { transform: translateX(-50%) scale(0); opacity: 0; }
    25% { transform: translateX(-50%) scale(1.07); opacity: 1; }
    50% { transform: translateX(-50%) scale(1); }
    75% { transform: translateX(-50%) scale(1.03); }
    100% { transform: translateX(-50%) scale(1); }
}
.tooltip_box { position: absolute; width: 100%; z-index: 5; } 
.tooltip_box .tooltip_wrap { position: relative; display: inline-block; padding: 8px 12px; background: var(--tag-green); border-radius: 8px; box-shadow: var(--shadow-08); } 
.tooltip_box .tooltip_wrap.type_btn { padding-right: 34px; }
.tooltip_box .tooltip_wrap::before { position: absolute; bottom: -14px; width: 16px; height: 0px; border: 8px solid transparent; border-top: 8px solid var(--tag-green); box-sizing: border-box; content: ''; display: block; } 
.tooltip_box .tooltip_wrap p { font-size: 13px; font-weight: 400; color: #ffffff; line-height: 18px; word-break: keep-all; } 
.tooltip_box .tooltip_wrap strong { font-weight: 500; }
.tooltip_box .tooltip_close { position: absolute; right: 8px; top: 8px; width: 18px; height: 18px; text-indent: -9999px; background: url(../../image/btn/btn_close_w.svg) no-repeat center center; background-size: contain; display: inline-block; overflow: hidden; }

/* type_left */
.tooltip_box.type_left { left: 0; top: -46px; transform: scale(0); } 
.tooltip_box.type_left.on { animation: pumping 0.5s ease-out 1 forwards; }
.tooltip_box.type_left .tooltip_wrap::before { left: 16px; }

/* type_center */
.tooltip_box.type_center { left: 50%; top: -46px; transform: translateX(-50%) scale(0); text-align: center; }
.tooltip_box.type_center.on { animation: pumping-center 0.5s ease-out 1 forwards; }
.tooltip_box.type_center .tooltip_wrap::before { left: 50%; transform: translateX(-50%); }