@charset "utf-8";
/* quick__02.css */
/* .quick__02{ z-index:100; width:100px; height:100px; border-radius:100%; position:fixed; bottom:50px; right:50px; background-color: #6ab3e1; transition: .5s ease-out;} */

/* 퀵버튼 */
.quick__02 .quick-wrap {position:fixed; bottom:90px; right:30px; z-index: 50;}
.quick__02 .quick-wrap .fixed_icon {position:fixed; bottom: 30px; right: 30px; display: inline-block; width: 60px;
  height: 60px; border-radius: 50%; background-color: #6ab3e1; background-image: url('../quick__02/quick_inquiry22.svg'); background-repeat: no-repeat;  background-position: 50% 50%;  background-size:auto 26px; transition: .3s;  box-shadow: 0 0 10px rgb(0 0 0 / 20%); cursor:pointer;}

/*엑스자로 변경*/
.quick__02 .quick-wrap.active .fixed_icon {background-image: url('../quick__02/res_menu_close_w.svg'); background-size:24px 24px; }

/*클릭 하고 나오는 아이콘*/
  .quick__02 .quick-wrap ul.quick-cont { display: none; opacity: 1; transform: translateY(20px); text-align: center;
  position: relative; z-index: -9999; }
  .quick__02 .quick-wrap.active ul.quick-cont {display: block; animation: transQiuck .5s forwards;}

  .quick__02 .quick-wrap ul.quick-cont li {margin-bottom: 10px;}
  .quick__02 .quick-wrap ul.quick-cont li a {display:flex; justify-content: center;
  align-items: center; overflow:hidden; position:relative; width:180px; height:50px;  border-radius: 7px; -webkit-border-radius:7px; background-color:#f8f9f8; font-size:1.5rem; box-shadow: 0 0 10px rgb(0 0 0 / 20%);}
  .quick__02 .quick-wrap ul.quick-cont li a img.q_mob_icon {display:none;}
  .quick__02 .quick-wrap ul.quick-cont li:first-child a img.q_pc_icon {height:50px;}
  .quick__02 .quick-wrap ul.quick-cont li:last-child a img.q_pc_icon {height:29px;}
  .quick__02 .quick-wrap ul.quick-cont li:hover a { animation-name: push; animation-duration: .4s; animation-timing-function: linear;  animation-iteration-count: 1;}
  .quick__02 .fixed_icon {animation: fixedmove 1.5s infinite linear;}

  @media(max-width:560px){
    .quick__02 .fixed_icon {bottom: 15px; right: 10px; }
    .quick__02 .quick-wrap ul.quick-cont li a { width:50px; height:50px;  border-radius: 30px; -webkit-border-radius:30px;}
    .quick__02 .quick-wrap ul.quick-cont li a img.q_mob_icon {display:block;}
    .quick__02 .quick-wrap ul.quick-cont li a img.q_pc_icon {display:none;}
  }
  

@keyframes push {
  50% {
    transform: scale(.9);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes transQiuck {
  0% {
    opacity: 0;
    transform: translateY(20px);
    z-index: -9999;
  }

  100% {
    opacity: 1;
    transform: translateY(0px);
    z-index: 9;
  }
}

@keyframes fixedmove {
  0%, 100% { transform:translate(0%,0)}
  50% {transform: translate(0,-15%); }
}