@charset "UTF-8";

.btn-menu { display: none; padding: 1rem; z-index: 1; box-sizing: content-box;}
.btn-menu-in { position: relative; height: 1.9rem; width: 2.3rem;}
.btn-menu-in-line, 
.btn-menu-in:before, 
.btn-menu-in:after { width: 100%; height: 1px; background-color: #000; display: block; position: absolute; content: '';}
.btn-menu-in-line { left: 0; top: 50%; transition: .6s ease;}
.btn-menu-in:before { left: 0; top: 0%; transition: transform .3s ease, top .3s .3s ease;}
.btn-menu-in:after { left: 0; top: 100%; transition: transform .3s ease, top .3s .3s ease;}
.active-menu .btn-menu-in-line { opacity: 0;}
.active-menu .btn-menu-in:before { top: 50%; transform: rotate(45deg); transition: transform .3s .3s ease, top .3s ease;}
.active-menu .btn-menu-in:after { top: 50%; transform: rotate(-45deg); transition: transform .3s .3s ease, top .3s ease;}


@media ( max-width: 1280px ) {
	html { font-size: .55vw;}
	.content-acordeon-info .colum-group .colum { width: 48%;}
	.colum-txt { font-size: 1.8rem;}
}

@media ( max-width: 1100px ) {

	html { font-size: 10px;}
	body { font-size: 2.8rem;}

	.btn-small,
	.fancybox-infobar,
	.fancybox-caption,
	.colum-txt { font-size: 1.4rem;}

	:root {
		--und: 1rem;
		--und2: 2rem;
		--marg-l: 6.2rem;
		--marg-m: 5rem;
	}

	.footer { height: 30rem;}
	.footer .btn { width: 6rem; height: 6rem; padding: 0;}
	.footer .btn img { display: block; max-width: 2.8rem;}
	.footer .btn span { display: none;}
	.footer .btn-mail { padding: 0 2rem; width: auto;}
	.footer .btn-mail img { display: none;}
	.footer .btn-mail span { display: block;}

	.btn-small { height: 3rem;}

	.content-slider,
	.content-slider-item,
	.content-slider-item-in { height: calc(100vh - 12.4rem);}
	.content-slider-item-in { padding: var(--und2);}
	.content-slider .flickity-button { display: none;}
	.content-acordeon .content-slider,
	.content-acordeon .content-slider-item,
	.content-acordeon .content-slider-item-in { height: calc(100vh - 18.6rem);}
	.content-acordeon .content-acordeon .content-slider,
	.content-acordeon .content-acordeon .content-slider-item,
	.content-acordeon .content-acordeon .content-slider-item-in { height: calc(100vh - 31rem);}

	.mobile-device .content-slider,
	.mobile-device .content-slider-item,
	.mobile-device .content-slider-item-in { height: calc((var(--vh) * 100) - 12.4rem);}
	.mobile-device .content-acordeon .content-slider,
	.mobile-device .content-acordeon .content-slider-item,
	.mobile-device .content-acordeon .content-slider-item-in { height: calc((var(--vh) * 100) - 18.6rem);}
	.mobile-device .content-acordeon .content-acordeon .content-slider,
	.mobile-device .content-acordeon .content-acordeon .content-slider-item,
	.mobile-device .content-acordeon .content-acordeon .content-slider-item-in { height: calc((var(--vh) * 100) - 31rem);}

	.content-img-main { padding-left: 4.2rem; padding-right: 4.2rem; }
		
	.content-acordeon { border-width: 1px;}
	.content-acordeon-info .colum-group { padding: 0;}
	.content-acordeon-info .colum-group .colum { width: 100%; margin-bottom: var(--marg-m);}

	.content-grid-item.col3-12 { width: 50%;}

	.content-img-two { padding-left: 0; padding-right: 0;}
	.content-img-two figure { padding: var(--marg-l);}

	.fancybox-slide--image { padding: var(--marg-m) calc(var(--marg-m) * 2);}

	.fancybox-button.fancybox-button--close { position: absolute; right: var(--marg-m); top: var(--marg-m);  background: url(../img/icon-cross.svg) no-repeat center; background-size: contain; opacity: 1!important;}

	.fancybox-navigation .fancybox-button--arrow_right { right: var(--marg-m); }
	.fancybox-navigation .fancybox-button--arrow_left { left: var(--marg-m); }
	.fancybox-caption { height: var(--marg-m); line-height: var(--marg-m); padding: 0 var(--marg-m);}
	.fancybox-infobar { height: var(--marg-m); line-height: var(--marg-m); min-width: var(--marg-m); padding: 0 var(--marg-m);}

	.content-grid-item img,
	.content-grid-item h2 { transition: opacity .1s ease;}

	.content-prev-next-in { width: 19rem;}
	.content-prev-next a img { height: 6.5rem;}
	.content-prev-next a span { display: none;}
}

@media ( max-width: 760px ) {
	body { font-size: 2rem;}

	.btn-small,
	.fancybox-infobar,
	.fancybox-caption,
	.colum-txt { font-size: 1.2rem;}

	:root {
		--und: .75rem;
		--und2: 1.5rem;
		--marg-l: 5rem;
		--marg-m: 4rem;
	}	

	.header .col-main:after { content: ''; display: block; background-color: #FFF; position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: var(--marg-l);}
	.header .col-main > a { position: relative; z-index: 3;}
	.menu { position: absolute; z-index: 1; top: -200%; left: 0; width: 100%; display: block; transform: translateY(-105%); border-top: 1px solid #000;}
	.active-menu .menu { transform: translateY(0%); top: var(--marg-l); }
	.menu ul { display: block;}
	.menu ul li { height: var(--marg-l); padding: 0 var(--und2); display: flex; align-items: center; width: 100%; border-bottom: 1px solid #000; background: #FFF;}
	.menu ul li + li { margin: 0; }
	.btn-menu { display: block;}

	.footer { height: 20rem;}
	.footer .col-main { justify-content: flex-end;}
	.footer .btn { width: 4.8rem; height: 4.8rem; margin-left: var(--und); padding: 0; border-width: 1px;}
	.footer .btn img { display: block; max-width: 2.4rem; max-height: 2.4rem;}
	.footer .btn span { display: none;}

	.btn-small { height: 3rem;}

	.content-slider,
	.content-slider-item,
	.content-slider-item-in { height: calc(100vh - 10rem);}
	.content-acordeon .content-slider,
	.content-acordeon .content-slider-item,
	.content-acordeon .content-slider-item-in { height: calc(100vh - 15rem);}
	.content-acordeon .content-acordeon .content-slider,
	.content-acordeon .content-acordeon .content-slider-item,
	.content-acordeon .content-acordeon .content-slider-item-in { height: calc(100vh - 25rem);}

	.mobile-device .content-slider,
	.mobile-device .content-slider-item,
	.mobile-device .content-slider-item-in { height: calc((var(--vh) * 100) - 10rem);}
	.mobile-device .content-acordeon .content-slider,
	.mobile-device .content-acordeon .content-slider-item,
	.mobile-device .content-acordeon .content-slider-item-in { height: calc((var(--vh) * 100) - 15rem);}
	.mobile-device .content-acordeon .content-acordeon .content-slider,
	.mobile-device .content-acordeon .content-acordeon .content-slider-item,
	.mobile-device .content-acordeon .content-acordeon .content-slider-item-in { height: calc((var(--vh) * 100) - 25rem);}

	.content-img-main,
	.content-txt-main,
	.content-img-one { padding-right: 0; padding-left: 0;}

	.content-acordeon .content-txt-main,
	.content-acordeon .content-img-one { padding-right: var(--und2); padding-left: var(--und2); }
	.content-acordeon-info .colum-group { padding: 0;}
	.content-acordeon-info .colum-group .colum { width: 100%; margin-bottom: var(--marg-m);}
	.content-acordeon-info .colum-group .colum br { display: none; }
	.content-acordeon-info .colum-group .colum h2 { padding-bottom: 2rem;}
	.content-img-two .content-modul { display: block;}
	.content-img-two figure { padding: var(--marg-m);}

	.content-grid-item.col3-12,
	.col4-12, .col6-12, .col8-12 { width: 100%;}

	.fancybox-slide--image { padding: var(--marg-m) var(--und2);}
	.fancybox-button.fancybox-button--close { width: 2.2rem; height: 2.2rem; right: var(--und2); top: var(--und2);}
	.fancybox-navigation .fancybox-button { display: none;}
	.fancybox-caption { height: var(--marg-m); line-height: var(--marg-m); padding: 0 var(--und2);}
	.fancybox-infobar { height: var(--marg-m); line-height: var(--marg-m); min-width: var(--marg-m); padding: 0 var(--und2);}

	.content-prev-next-in { width: 15rem;}
	.content-prev-next a img { height: 5rem;}
}

@media ( max-width: 375px ) {
	html { font-size: 2.65vw;}
}

@media ( min-width: 1020px) {
	.content-project .content-img-main img { max-width: 100rem;}
	.content-project .content-img-one img,
	.content-practice .content-img-one img { max-width: 80rem;}
}

@media ( min-width: 1920px) {
	html { font-size: 10px;}
}