.footer-top{padding: 40px 0;display: flex;gap: 20px;justify-content: space-between;}
.footer-top p{font-weight: 400;font-size: 14px;line-height: 150%;color: #CCCCCC;margin-top: 8px;}
.footer-top .right {display: flex;gap: 20px;max-width: 1160px;width: 100%;justify-content: space-between;}
.footer-top .right .adress-wrap .adress li {font-weight: 400;font-size: 14px;line-height: 150%;letter-spacing: 0;color: #CCCCCC;padding: 0 0 4px;}
.footer-top .right .adress-wrap .adress li:last-child {padding: 0;}
.footer-top .right .adress-wrap > div {padding: 0 0 12px;}
.footer-top .right .adress-wrap > div:last-child {padding: 0;}

.footer-top .right .btn-footer {max-height: 36px;display: flex;}
.footer-top .right .btn-footer a {min-width: 161px;width: 100%;padding: 7px 12px;border: 1px solid #FFFFFF;border-radius: 4px;display: flex;height: auto;justify-content: space-between;align-items: center;font-weight: 400;font-size: 14px;line-height: 150%;letter-spacing: 0;color: #FFFFFF;position: relative;box-sizing: border-box;}
.footer-top .right .btn-footer a:after{background: url(/_res/csu/_share/img/common/ico-btn-footer.png);content: "";display: inline-block;width: 24px;height: 24px;}
.footer-bottom {display: flex;align-items: center;justify-content: space-between;flex-wrap: wrap;padding: 20px 0;gap: 10px;position: relative;}
.footer-bottom:before {content: "";position: absolute;width: 100vw;height: 1px;background: rgba(255, 255, 255, 0.2);top: 0;left: 49%;transform: translateX(-50%);}
.footer-bottom p {font-weight: 500;font-size: 16px;line-height: 150%;color: #666666;text-align: center;}
.footer-bottom > ul {display: flex;align-items: center;gap: 20px;flex-wrap: wrap;}
.footer-bottom > ul > li a {font-weight: 400;font-size: 14px;line-height: 150%;letter-spacing: -0.02em;text-align: center;vertical-align: middle;color: #C7C7C7;transition: all .3s;}
.footer-bottom > ul > li a:hover {color: #fff;font-weight: 700;}
.footer-bottom > ul > li a.active {color: #fff;font-weight: 700;}

.footer-dropdown { position: relative; display: inline-block; width: 161px; }
.footer-dropdown .btn-toggle { display: flex; align-items: center; justify-content: space-between; width: 161px; height: 36px; padding: 0 14px; background: transparent; border: 1px solid #ffffff; border-radius: 6px; color: #ffffff; font-size: 14px; font-weight: 500; line-height: 1; cursor: pointer; box-sizing: border-box; transition: all 0.25s ease; }
.footer-dropdown .btn-toggle:hover { background: rgba(255, 255, 255, 0.1); }
.footer-dropdown .ico-arrow { display: inline-block; width: 7px; height: 7px; border-top: 1.5px solid #ffffff; border-right: 1.5px solid #ffffff; transform: rotate(45deg); transition: transform 0.3s ease; margin-right: 2px; }
.footer-dropdown.is-active .ico-arrow { transform: rotate(-45deg); }
.footer-dropdown .dropdown-menu-wrap { display: none; position: absolute; left: 0; bottom: calc(100% + 6px); width: 100%; max-height: 220px; overflow-y: auto; background: #0d1b2a; border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 6px; box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.4); z-index: 100; }
.footer-dropdown.is-active .dropdown-menu-wrap { display: block; animation: dropUpFade 0.2s ease-out; }
.footer-dropdown .dropdown-list { margin: 0; padding: 6px 0; list-style: none; }
.footer-dropdown .dropdown-list li a { display: block; padding: 8px 14px; font-size: 13px; color: rgba(255, 255, 255, 0.85); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: background 0.2s, color 0.2s; }
.footer-dropdown .dropdown-list li a:hover { background: rgba(255, 255, 255, 0.15); color: #ffffff; }
.footer-dropdown .dropdown-menu-wrap::-webkit-scrollbar { width: 4px; }
.footer-dropdown .dropdown-menu-wrap::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.3); border-radius: 4px; }
@keyframes dropUpFade {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 1024px) {
	.footer-top {flex-direction: column;}
	.footer-top .right {max-width: unset;}
}

@media (max-width: 768px) {
	.footer-top .right .btn-footer a {width: auto;}
	.footer-bottom p {text-align: left;}
	.footer-bottom:before {width: calc(100% + 30px);left: 50%;}
	
	.footer-top .right {flex-direction: column;}
}

@media (max-width: 500px) {
	.footer-top .right {flex-direction: column;}
}