@charset "UTF-8";

.popup-contact-wrap { position: fixed; bottom: 32px; left: 30px; z-index: 10000; }
.popup-contact-dropdown {  }
.popup-contact-dropdown-toggle { position: relative; border: none; background: #e0671e; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; color: #fff; border-radius: 50%; padding: 5px; font-size: 11px; line-height: 1; }
.popup-contact-dropdown-toggle:after { display: none; }
.popup-contact-dropdown-toggle i.fa { font-size: 22px; margin-bottom: 5px; }
.popup-contact-dropdown .dropdown-menu { border-radius: 10px 10px 5px 5px; margin-bottom: 15px; }
.popup-contact-header { background: #e0671e; padding: 10px; color: #fff; border-radius: 5px 5px 0 0; font-weight: bold; }
.popup-contact-items { min-width: 300px; position: relative; }
.popup-contact-items:after { content: ""; position: absolute; bottom: -20px; right: 50px; width: 0; height: 0; border-style: solid; border-color: #fff transparent transparent transparent; border-width: 10px; }
.popup-contact-item { display: flex; align-items: center; justify-content: space-between; padding: 7px 10px; color: #333 !important; }
.popup-contact-item:hover { background: #eee; }
.popup-contact-item-icon { position: relative; width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; }
.popup-contact-item-icon svg { width: 24px; height: 24px; text-align: center; display: block; position: absolute; top: 50%; left: 50%; margin-top: -12px; margin-left: -12px; }

.popup-contact-dropdown:not(.show) .popup-contact-dropdown-toggle-close { display: none; }
.popup-contact-dropdown.show .popup-contact-dropdown-toggle-close { display: block; }
.popup-contact-dropdown:not(.show) .popup-contact-dropdown-toggle-title, 
.popup-contact-dropdown:not(.show) .icons {
	display: block;
}
.popup-contact-dropdown.show .popup-contact-dropdown-toggle-title,
.popup-contact-dropdown.show .icons {
	display: none;
}
.popup-contact-dropdown-toggle-title {
	position: absolute; top: 10px; bottom: 10px; right: 6px; left: 12px;
	width: 44px; height: 44px; text-align: center;
	transition: transform .2s, opacity .2s;
	transform: scale(1); opacity: 1;
}
.popup-contact-dropdown .icons {
	position: absolute; top: 8px; right: 8px; bottom: 10px; left: 13px;
	background: #fff; border-radius: 50%; width: 44px; height: 44px; padding: 8px 0; overflow: hidden;
	transition: all .2s;
	transform: scale(1); opacity: 1;
}
.popup-contact-dropdown .icons-line { display: flex; align-items: center; width: 264px; transition: all .1s; }
.popup-contact-dropdown .icons-line > span { display: block; margin: 0 10px; width: 24px; height: 24px; }

.popup-contact-dropdown .icons.hide { transform: scale(0); opacity: 0; visibility: hidden; }
.popup-contact-dropdown-toggle-title.hide { transform: scale(0); opacity: 0; }

.popup-contact-dropdown-toggle .pulsation {
	width: 84px;
    height: 84px;
    border-radius: 50px;
    position: absolute;
    left: -12px;
    top: -13px;
    z-index: -1;
    transform: scale(0);
    animation: pulse 2s infinite;
}
.popup-contact-dropdown-toggle .pulsation:nth-of-type(2n) {
	animation-delay: 0.5s
}

@keyframes pulse {
	0% {
		transform: scale(0);
		opacity: 1;
	}
	50% {
		opacity: .5;
	}
	100% {
		transform: scale(1);
    	opacity: 0;
	}
}
.tel {
    background: #f2f6f7;
    text-align: center;
}
