/* A            A A                 :                   A                   :                   A                   :                   A                   :                   */
/* kakao */
#kakaoChat {
  width: auto;
  height: auto;
  position: fixed;
  top: clamp(260px, 14vw, 280px);
  right: 30px;
  z-index: 15;
}

#kakaoChat .popupWrap {
  width: clamp(50px, 3vw, 60px);
  height: clamp(50px, 3vw, 60px);
  display: flex;
  position: relative;
}

#kakaoChat .popupWrap .IconBox {
  width: 100%;
  height: 100%;
}

#kakaoChat .popupWrap .IconBox img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(2px 4px 6px #333);
}

#kakaoChat .popupWrap .textBox {
  width: clamp(130px, 6vw, 170px);
  height: auto;
  position: absolute;
  top: 50%;
  right: calc(100% + 10px);
  transform: translateY(-50%);
  background: #727070;
  border-radius: 10px;
  opacity: 0;
  pointer-events: none;
  transition: .2s;
}

#kakaoChat .popupWrap .textBox:after {
  border: none;
  content: "";
  position: absolute;
  top: 0;
  right: 0;
}

#kakaoChat .popupWrap:hover .textBox {
  opacity: 1;
  pointer-events: auto;
  transition: .2s;
}

#kakaoChat .popupWrap .textBox p {
  font-size: clamp(13px, 1.2vw, 14px);
  color: #fff;
  text-align: center;
  padding: 0.5em 0;
}

#kakaoChat .mobileBtn {
  font-size: 20px;
  color: #727070;
  position: absolute;
  left: -105px;
  top: -60px;
  display: none;
  cursor: pointer;
}

#kakaoChat .mobileBtn svg {
  font-size: inherit;
}

/* counsel */
#counselChat {
  width: auto;
  height: auto;
  position: fixed;
  top: clamp(340px, 17vw, 360px);
  right: 30px;
  z-index: 15;
}

#counselChat .popupWrap {
  width: clamp(50px, 3vw, 60px);
  height: clamp(50px, 3vw, 60px);
  display: flex;
  position: relative;
}

#counselChat .popupWrap .IconBox {
  width: 100%;
  height: 100%;
}

#counselChat .popupWrap .IconBox img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(2px 4px 6px #333);
  background-color: #359993;
  border-radius: 100%;
}

#counselChat .popupWrap .textBox {
  width: clamp(130px, 6vw, 170px);
  height: auto;
  position: absolute;
  top: 50%;
  right: calc(100% + 10px);
  transform: translateY(-50%);
  background: #727070;
  border-radius: 10px;
  opacity: 0;
  pointer-events: none;
  transition: .2s;
}

#counselChat .popupWrap .textBox:after {
  border: none;
  content: "";
  position: absolute;
  top: 0;
  right: 0;
}

#counselChat .popupWrap:hover .textBox {
  opacity: 1;
  pointer-events: auto;
  transition: .2s;
}

#counselChat .popupWrap .textBox p {
  font-size: clamp(13px, 1.2vw, 14px);
  color: #fff;
  text-align: center;
  padding: 0.5em 0;
}

#counselChat .mobileBtn {
  font-size: 20px;
  color: #727070;
  position: absolute;
  left: -105px;
  top: -60px;
  display: none;
  cursor: pointer;
}

#counselChat .mobileBtn svg {
  font-size: inherit;
}

/* capitalStandard */
#capitalStandard {
  width: auto;
  height: auto;
  position: fixed;
  top: clamp(180px, 11vw, 200px);
  right: 30px;
  z-index: 15;
}

#capitalStandard .popupWrap {
  width: clamp(50px, 3vw, 60px);
  height: clamp(50px, 3vw, 60px);
  display: flex;
  position: relative;
}

#capitalStandard .popupWrap .IconBox {
  width: 100%;
  height: 100%;
}

#capitalStandard .popupWrap .IconBox img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(2px 4px 6px #333);
}

#capitalStandard .popupWrap .textBox {
  width: clamp(130px, 6vw, 170px);
  height: auto;
  position: absolute;
  top: 50%;
  right: calc(100% + 10px);
  transform: translateY(-50%);
  background: #727070;
  border-radius: 10px;
  opacity: 0;
  pointer-events: none;
  transition: .2s;
}

#capitalStandard .popupWrap .textBox:after {
  border: none;
  content: "";
  position: absolute;
  top: 0;
  right: 0;
}

#capitalStandard .popupWrap:hover .textBox {
  opacity: 1;
  pointer-events: auto;
  transition: .2s;
}

#capitalStandard .popupWrap .textBox p {
  font-size: clamp(13px, 1.2vw, 14px);
  color: #fff;
  text-align: center;
  padding: 0.5em 0;
}

#capitalStandard .mobileBtn {
  font-size: 20px;
  color: #727070;
  position: absolute;
  left: -105px;
  top: -60px;
  display: none;
  cursor: pointer;
}

#capitalStandard .mobileBtn svg {
  font-size: inherit;
}

@media (min-width:641px) and (max-width:1024px) {


  /* **************************************************************************************************************************************************************************** */
  /*                                                                                                                                                                              */
  /*                                                                                                                                                                              */
  /*                                                                             1단 배경 Fixed                                                                                   */
  /*                                                                                                                                                                              */
  /*                                                                                                                                                                              */
  /* **************************************************************************************************************************************************************************** */
  /* A            A A                 :                   A                   :                   A                   :                   A                   :                   */
  /* kakao */
  #kakaoChat {
    right: 20px;
  }

  /* counsel */
  #counselChat {
    right: 20px;
  }

  /* capitalStandard */
  #capitalStandard {
    right: 20px;
  }
}


@media (max-width:640px) {


  /* **************************************************************************************************************************************************************************** */
  /*                                                                                                                                                                              */
  /*                                                                                                                                                                              */
  /*                                                                             1단 배경 Fixed                                                                                   */
  /*                                                                                                                                                                              */
  /*                                                                                                                                                                              */
  /* **************************************************************************************************************************************************************************** */
  /* A            A A                 :                   A                   :                   A                   :                   A                   :                   */
  /* kakao */
  #kakaoChat {
    top: unset;
    bottom: 30vw;
    right: 15px;
  }

  #kakaoChat .popupWrap {
    width: 45px;
    height: 45px;
    margin-bottom: 10px;
  }

  #kakaoChat .popupWrap .textBox {
    top: unset;
    bottom: calc(100% + 20px);
  }

  #kakaoChat .popupWrap:hover .textBox {
    opacity: 0;
    pointer-events: none;
  }

  #kakaoChat .popupWrap .textBox:after {
    border-top: 10px solid #727070;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 0px solid transparent;
    bottom: -10px;
    top: unset;
    right: 15px;
  }

  #kakaoChat .mobileBtn {
    display: block;
  }

  /* counsel */
  #counselChat {
    top: unset;
    bottom: 45vw;
    right: 15px;
  }

  #counselChat .popupWrap {
    width: 45px;
    height: 45px;
    margin-bottom: 10px;
  }

  #counselChat .popupWrap .textBox {
    top: unset;
    bottom: calc(100% + 20px);
  }

  #counselChat .popupWrap:hover .textBox {
    opacity: 0;
    pointer-events: none;
  }

  #counselChat .popupWrap .textBox:after {
    border-top: 10px solid #727070;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 0px solid transparent;
    bottom: -10px;
    top: unset;
    right: 15px;
  }

  #counselChat .mobileBtn {
    display: block;
  }

  /* capitalStandard */
  #capitalStandard {
    top: unset;
    bottom: 15vw;
    right: 15px;
  }

  #capitalStandard .popupWrap {
    width: 45px;
    height: 45px;
    margin-bottom: 10px;
  }

  #capitalStandard .popupWrap .textBox {
    top: unset;
    bottom: calc(100% + 20px);
  }

  #capitalStandard .popupWrap:hover .textBox {
    opacity: 0;
    pointer-events: none;
  }

  #capitalStandard .popupWrap .textBox:after {
    border-top: 10px solid #727070;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 0px solid transparent;
    bottom: -10px;
    top: unset;
    right: 15px;
  }

  #capitalStandard .mobileBtn {
    display: block;
  }


}