.common__login-modal { display: none; z-index: 2; position: fixed; background-color: rgba(0, 0, 0, 0.5); top: 0; left: 0; width: 100%; height: 100vh; justify-content: center; align-items: center; }

.common__login-modal .login-modal { max-width: 500px; background-color: white; }

.common__login-modal .login-modal__inner { display: flex; flex-direction: column; align-items: center; justify-content: center; }

.common__login-modal .login-modal__inner img { width: 70px; }

.common__login-modal .login-modal__text span { color: #3C82FA; }

.common__login-modal .login-modal__button { background: #3C82FA; width: 100%; border-radius: 4px; }

.toast { position: fixed; left: 50%; bottom: 20px; transform: translate(-50%, 15px); opacity: 0; transition: .5s; z-index: -1; }

.toast.show { transform: translate(-50%, 0px); opacity: 1; z-index: 2100; }

.toast__message { display: flex; align-items: center; }

.toast__container { width: 320px; color: #fff; box-shadow: 2px 4px 6px rgba(0, 0, 0, 0.15); border-radius: 4px; line-height: 20px; font-size: 15px; padding: 8px 12px; display: flex; justify-content: space-between; background-color: #3C82FA; }

.toast__container button { display: none; color: #fff; background-color: transparent; border: none; }

.toast__container button span { font-size: 15px; }

.toast__text { padding: 4px; }

.poomang-backdrop { display: none; position: fixed; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0, 0, 0, 0.3); z-index: 110; }

.poomang-modal { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); opacity: 0; z-index: -1; }

.poomang-modal.show { opacity: 1; z-index: 2000; }

.poomang-modal__container { display: flex; flex-direction: column; width: 280px; padding: 24px; border-radius: 4px; box-shadow: 2px 4px 6px rgba(0, 0, 0, 0.15); background-color: white; box-sizing: border-box; }

.poomang-modal__text { font-size: 15px; line-height: 20px; color: #000; }

.poomang-modal__actions { margin-top: 30px; display: flex; flex-direction: row-reverse; }

.poomang-modal__actions button { font-size: 15px; font-weight: 500; color: #3C82FA; background-color: transparent; border: none; }

.sentence-tooltip { z-index: 100; position: fixed; display: none; }

.sentence-tooltip:visible { display: block; }

.sentence-tooltip__container { position: relative; background-color: white; border-radius: 10px; box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1); height: 100px; width: 200px; }

.sentence-tooltip__container::after { position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 11px); height: 11px; width: 14px; content: ''; border-color: white; border-top: 11px solid #fff; border-left: 7px solid transparent; border-right: 7px solid transparent; }

.sentence-tooltip__container h6 { margin: 0 4px; padding: 3px 0; text-align: center; font-family: "Noto Sans KR", sans-serif; font-size: 15px; line-height: 21px; font-weight: 400; color: #4f4f4f; }

.sentence-tooltip__container hr { margin: 0; border-top: 1px solid #e0e0e0; }

.sentence-tooltip__button-group { margin: 5px 0; display: flex; }

.sentence-tooltip button { flex: 1; background: transparent; border: none; }

.sentence-tooltip button .sentence-toolip__button-group__image { margin-bottom: 3px; }

.sentence-tooltip button img { margin: auto; }

.sentence-tooltip button span { width: 100%; text-align: center; font-size: .6rem; line-height: 17px; color: #828282; }

.opinion_btn_wrapper { display: flex; justify-content: center; }

.opinion_btn_wrapper .opinion_btn { border: none; border-radius: 8px; }

.opinion_btn_wrapper .opinion_btn:not(:last-child) { margin-right: 0.75rem; }

.opinion_btn_wrapper .opinion_btn:focus { outline: none; }

.opinion_btn_wrapper [data-flag="false"] { background-color: white; border: 2px solid #EDF0F3; color: #25282B; }

.opinion_btn_wrapper [data-flag="true"] { background: #DBE7FF; border: 2px solid #4164FA; color: #4164FA; }

.opinion_btn_wrapper .btn_img { width: 36px; height: auto; }

.opinion_btn_wrapper .btn_txt { font-size: 14px; }

.sentence_btn_wrapper { position: relative; }

.sentence_btn_wrapper .sentence_btn { position: relative; padding: 0; text-align: inherit; color: inherit; font-family: inherit; font-size: inherit; line-height: inherit; font-weight: inherit; background: transparent; border: none; }

.vibrate_animation { animation: vibrate 7s infinite; }

@keyframes vibrate { 1.42857143% { transform: translateX(1px); }
  2.85714286% { transform: translateX(-1px); }
  4.28571429% { transform: translateX(1px); }
  5.71428571% { transform: translateX(-1px); }
  7.14285714% { transform: translateX(1px); }
  8.57142857% { transform: translateX(-1px); }
  10% { transform: translateX(1px); }
  11.42857143% { transform: translateX(-1px); }
  12.85714286% { transform: translateX(1px); }
  14.28571429% { transform: translateX(-1px); }
  15.71428571% { transform: translateX(1px); }
  17.14285714% { transform: translateX(-1px); }
  18.57142857% { transform: translateX(1px); }
  20% { transform: translateX(-1px); }
  21.42857143% { transform: translateX(1px); }
  22.85714286% { transform: translateX(-1px); }
  24.28571429% { transform: translateX(1px); }
  25.71428571% { transform: translateX(-1px); }
  27.14285714% { transform: translateX(1px); }
  28.57142857% { transform: translateX(-1px); } }
