@charset "UTF-8";

/*--------------------------------------
  For Chatbot under ce directory
  2026.4.10
---------------------------------------*/

/* ToTop disabled */
a.arrow-top {
  display: none;
  position: relative;
  width: 50px;
  height: 50px;
  color: #fff;
  text-decoration: none;
  background-color: #000;
}

.chatbot-bot-icon {
width: 100% !important;
height: 100% !important;
}
.chatbot-bot-icon-area {
background-color: #ffffff !important;
}
.chatbot-open-img {
width: 100% !important;
height: 100% !important;
}
.chatbot-open-btn-medium {
box-shadow: none !important;
background: none !important;
}
.chatbot-answer-comment {
text-align: left;
}

p#chatbot-toolTip-button-right {
  display: block;
  width: calc(100% + 170px);
  margin: 0 0 0 -55px;
  position: absolute;
  top: -50px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  background: #fbfbfb;
  padding: 7px 12px;
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 1.2;
  animation: fadeIn 2.5s;
  color: #557dbe;
  border-radius: 17px;
  filter: drop-shadow(0px 1px 4px #aaa);
  text-align: center;
  border: #557dbe solid 3px;
}

p#chatbot-toolTip-button-right::before {
  content: "";
  position: absolute;
  top: 100%;
  left: 70%;
  margin-left: -8px;
  border: 8px solid transparent;
  border-top: 8px solid #557dbe;
}

.chatbot-bot-icon-area {
  position: absolute;
  width: 30px;
  height: 37px;
  border-radius: 50%;
  margin: 0px 10px;
  background-color: var(--color-main);
}
.chatbot-bot-icon-area {
  background-color: transparent !important;
}

@media screen and (max-width: 768px) {
    .chatbot-open-btn-medium {
      width: 60px !important;
      height: 60px !important;
      bottom: 20px !important;
      right: 20px !important;
    }
    p#chatbot-toolTip-button-right {
      display: block;
      width: calc(100% + 180px);
      margin: 0 0 0 -80px;
      position: absolute;
      top: -50px;
      left: 50%;
      transform: translateX(-50%);
      z-index: 1;
      background: #fbfbfb;
      padding: 7px 12px;
      font-size: 1.4rem;
      font-weight: 600;
      line-height: 1.2;
      animation: fadeIn 2.5s;
      color: #557dbe;
      border-radius: 17px;
      filter: drop-shadow(0px 1px 4px #aaa);
      text-align: center;
      border: #557dbe solid 3px;
    }
    p#chatbot-toolTip-button-right::before {
      content: "";
      position: absolute;
      top: 100%;
      left: 80%;
      margin-left: -8px;
      border: 8px solid transparent;
      border-top: 8px solid #557dbe;
    }
}
