[Сергей Ракипов]

const termsOfUse = document.querySelector(".terms_of_use");
const iAgree = document.querySelector(".i_agree");
const main = document.querySelector(".main");
const test = 50;

setTimeout(function (){
termsOfUse.style.transform = "translateY(0%)";
termsOfUse.style.position = "fixed";
termsOfUse.style.top = "0" + "px";
}, 10);

function appearance(){
let blockHeinght = termsOfUse.getBoundingClientRect().height;
let blockMargin = main.style.marginTop = blockHeinght + test + "px";

console.log(termsOfUse.getBoundingClientRect().height);

}
appearance();

function back(){
termsOfUse.style.transform = "translateY(-100%)";
termsOfUse.style.position = "";
termsOfUse.style.top = "0" + "px";	
	
let blockHeinght = termsOfUse.getBoundingClientRect().height;
let blockMargin = main.style.marginTop = "0" + "px";

console.log(termsOfUse.getBoundingClientRect().height);
}
iAgree.onclick = back;

Вот что то похоже получается, но чувство что код какой то корявый