footer {height: 70px; background-color: #090417; color: #fff; padding: 17px 70px 0 31px; z-index: 9998; position: relative;}
footer:after {content: ''; display: block; clear: both;}
footer .copyright-box {float: left; padding: 12px 0 0 0;}
footer .copyright-box .copyright {font-size: 15px; display: flex; font-weight: 500; color: #fff;}
footer .copyright-box .copyright span {display: inline-block; margin: 0 2px 0 0;}
footer .fnb-box {float: right;}
footer .fnb-box ul {margin: 0 47px 0 0;}
footer .fnb-box ul li {display: inline-block; margin: 0 0 0 31px; padding: 12px 0;}
footer .fnb-box ul li a {font-size: 15px; color: #fff; display: inline-block;}
footer .fnb-box ul li:last-child a {font-weight: 700;}
footer .family-site-box {float: right; background-color: #27262c; width: 159px; height: 34px; position: relative;}
footer .family-site-box:after {content: 'Family Site'; font-size: 14px; color: #f2eaea; padding: 10px 0 0 15px; display: block; width: 100%; height: 100%; box-sizing: border-box; word-spacing: -1px; cursor: pointer;}
footer .family-site-box:before {content: ''; display: block; width: 9px; height: 5px; background-image: url("/en/images/common/arrow_family_site_off.png"); position: absolute; top: 15px; right: 12px; transform: rotate(180deg); transition: all 0.2s;}
footer .family-site-box ul {display: none;}
footer .family-site-box ul li {height: 30px; padding: 7px 0 0 15px;}
footer .family-site-box ul li:hover {background-color: #edf0f2;}
footer .family-site-box ul li a {display: block; font-size: 14px; color: #f2eaea;}
footer .family-site-box ul li:hover a {color: #090417; font-weight: 500;}
footer .family-site-box.active:before {content: ''; display: block; width: 9px; height: 5px; background-image: url("/en/images/common/arrow_family_site_off.png"); position: absolute; top: 15px; right: 12px; transform: rotate(360deg);}
footer .family-site-box.active ul {display: inline-block; position: absolute; bottom: 34px; background-color: #27262c; width: 100%;}

@media (max-width: 1250px) {
}
@media (max-width: 980px) {
	footer {padding: 17px 30px 0 30px;}
	footer .fnb-box {display: none;}
}

@media (max-width: 500px) {
	footer {height: auto; padding: 20px 15px;}
	footer .copyright-box {padding: 0; width: 100%; margin-bottom: 20px;}
	footer .family-site-box {width: 100%; height: auto;}
	footer .family-site-box:after {padding: 12px;}
	footer .family-site-box:before {top: 50%; transform: translateY(-50%) rotate(180deg);}
	footer .family-site-box.active:before {top: 50%; transform: translateY(-50%) rotate(0deg);}
	footer .family-site-box ul li {padding: 0; height: auto;}
	footer .family-site-box ul li a {padding: 12px;}
	footer .family-site-box.active ul {height: auto; top: auto; bottom: 38px;}
}

@media (max-width: 340px) {
	
}