/*-------------------------------------------------------------------------*/
/*	3.0	Section Category-Block Type: grid, column, w
/*-------------------------------------------------------------------------*/
.column-12 > * {--col-gap-px:10; /* max=10 */ --col-gap-vw:0; /* max=0.6 */ }
/* Ширина блока в % */
.w10 {--col-nw:10%;width:10%}
.w15 {--col-nw:15%;width:15%}
.w20 {--col-nw:20%;width:20%}
.w25 {--col-nw:25%;width:25%}
.w30 {--col-nw:30%;width:30%}
.w35 {--col-nw:35%;width:35%}
.w40 {--col-nw:40%;width:40%}
.w45 {--col-nw:45%;width:45%}
.w50 {--col-nw:50%;width:50%}
.w60 {--col-nw:60%;width:60%}
.w70 {--col-nw:70%;width:70%}
.w75 {--col-nw:75%;width:75%}
.w80 {--col-nw:80%;width:80%}
.w90 {--col-nw:90%;width:90%}
.w100 {--col-nw:100%;width:100%}

.grid-1, .column-1 {--col-n:1}
.grid-2, .column-2 {--col-n:2}
.grid-3, .column-3 {--col-n:3}
.grid-4, .column-4 {--col-n:4}
.grid-5, .column-5 {--col-n:5}
.grid-6, .column-6 {--col-n:6}
.grid-7, .column-7 {--col-n:7}
.grid-8, .column-8 {--col-n:8}
.grid-9, .column-9 {--col-n:9}
.grid-10, .column-10 {--col-n:10}
.grid-11, .column-11 {--col-n:11}
.grid-12, .column-12 {--col-n:12}

/*-------------------------------------------------------------------------*/
/*	3.1	class="grid-N" GRID
/*-------------------------------------------------------------------------*/
.grid-2, .grid-3, .grid-4, .grid-5, .grid-6, .grid-7, .grid-8, .grid-9, .grid-10, .grid-11, .grid-12 { display:grid; margin-top: var(--margin-top); transition: all 0.3s; grid-gap:var(--col-gap); grid-template-columns: repeat(auto-fill, minmax(calc(100% / var(--col-n) - var(--col-gap)), 1fr));}

/*-------------------------------------------------------------------------*/
/*	3.2	class="column-N" COLUMN
/*-------------------------------------------------------------------------*/
.column-2, .column-3, .column-4, .column-5, .column-6, .column-7, .column-8, .column-9, .column-10, .column-11, .column-12 {display: flex; flex-flow: row wrap; justify-content: space-between; align-items: flex-start; margin-top: var(--margin-top);}
.column-2 > *, .column-3 > *, .column-4 > *, .column-5 > *, .column-6 > *, .column-7 > *, .column-8 > *, .column-9 > *, .column-10 > *, .column-11 > *, .column-12 > * {/*margin-right: var(--col-gap); */ width: calc(100%/var(--col-n) - var(--col-gap)*calc(var(--col-n) - 1)/var(--col-n)); margin-bottom: calc((100% - (100%/var(--col-n) - var(--col-gap)*calc(var(--col-n) - 1)/var(--col-n))*var(--col-n))/calc(var(--col-n) - 1)); /* min-width:var(--min-div-w) */}

.column-3.like-g::after {content: ""; flex: auto;}
.column-4.like-g::after {content: ""; flex: auto;}
.column-5.like-g::after {content: ""; flex: auto;}
.column-6.like-g::after {content: ""; flex: auto;}
.column-7.like-g::after {content: ""; flex: auto;}
.column-8.like-g::after {content: ""; flex: auto;}
.column-9.like-g::after {content: ""; flex: auto;}
.column-10.like-g::after {content: ""; flex: auto;}
.column-11.like-g::after {content: ""; flex: auto;}
.column-12.like-g::after {content: ""; flex: auto;}

.column-3.like-g > *:nth-child(3n+1):nth-last-child(-n+3) ~ * {margin-left:var(--col-gap);}
.column-4.like-g > *:nth-child(4n+1):nth-last-child(-n+4) ~ * {margin-left:var(--col-gap);}
.column-5.like-g > *:nth-child(5n+1):nth-last-child(-n+5) ~ * {margin-left:var(--col-gap);}
.column-6.like-g > *:nth-child(6n+1):nth-last-child(-n+6) ~ * {margin-left:var(--col-gap);}
.column-7.like-g > *:nth-child(7n+1):nth-last-child(-n+7) ~ * {margin-left:var(--col-gap);}
.column-8.like-g > *:nth-child(8n+1):nth-last-child(-n+8) ~ * {margin-left:var(--col-gap);}
.column-10.like-g > *:nth-child(10n+1):nth-last-child(-n+10) ~ * {margin-left:var(--col-gap);}
.column-12.like-g > *:nth-child(12n+1):nth-last-child(-n+12) ~ * {margin-left:var(--col-gap);}

.column-1 > *[class^="w"], .column-2 > *[class^="w"], .column-3 > *[class^="w"], .column-4 > *[class^="w"], .column-5 > *[class^="w"], .column-6 > *[class^="w"], .column-7 > *[class^="w"], .column-8 > *[class^="w"] {width:calc(var(--col-nw) - var(--col-gap)*(var(--col-n) - 1)/var(--col-n));}
.column-1 > *[class^="w"] {margin-bottom:var(--col-gap); width: calc(var(--col-nw) - var(--col-gap));}

/*-------------------------------------------------------------------------*/
/*	3.3	class="center" ONLY column-1
/*-------------------------------------------------------------------------*/
.column-1.center {justify-content: space-around;}
.column-1.center > * {margin-top: calc(1%*var(--col-gap)); margin-right: unset;     /* OR margin: calc(var(--col-gap) / 2); */}

/*-------------------------------------------------------------------------*/
/*	3.4	class="column-full"
/*-------------------------------------------------------------------------*/
.column-full {margin:var(--margin-top) calc(1vw*var(--wrap)/2 - 50vw); width: auto; /*width:100vw*/}
.column-full .section-title {width:calc(1%*var(--wrap)); margin: 0 auto;}
.column-full .section-desc {width:calc(1%*var(--wrap)); margin: 0 auto;}
.column-full .wrap-l {padding-left:calc((100vw - 1vw*var(--wrap))/2); padding-right: var(--margin-top);}
.column-full .wrap-r {padding-right:calc((100vw - 1vw*var(--wrap))/2); padding-left: var(--margin-top);}
.column-full .wrap-l *:last-child, .column-full .wrap-r *:last-child {margin-bottom: var(--margin-top)}

.wrap-2 > div {padding: var(--margin-top); }
.wrap-2 > div:first-child {padding-right:calc(var(--col-gap)/2); padding-left:calc((100vw - 1vw*var(--wrap))/2);}
.wrap-2 > div:last-child {padding-left:calc(var(--col-gap)/2); padding-right:calc((100vw - 1vw*var(--wrap))/2); /* width: 50%; */}
.wrap-2-g > div {padding: var(--margin-top) 0; width: var(--col-nw)!important; }
.wrap-2-g > div:first-child {padding-right:calc(var(--col-gap)/2); padding-left:calc((100vw - 1vw*var(--wrap))/2);}
.wrap-2-g > div:last-child {padding-left:calc(var(--col-gap)/2); padding-right:calc((100vw - 1vw*var(--wrap))/2);}

.wrap-3 > div {width: calc((100% - 1vw*(100 - var(--wrap)))/var(--col-n) - var(--col-gap)*calc(var(--col-n) - 1)/var(--col-n))!important;}
.wrap-3 > div:first-child {padding-right:var(--col-gap); padding-left:calc((100vw - 1vw*var(--wrap))/2); width:calc((100% - 1vw*(100 - var(--wrap)))/var(--col-n) - var(--col-gap)*calc(var(--col-n) - 1)/var(--col-n) + (100vw - 1vw*var(--wrap))/2 + var(--col-gap))!important;}
.wrap-3 > div:last-child {padding-left:var(--col-gap); padding-right:calc((100vw - 1vw*var(--wrap))/2); width:calc((100% - 1vw*(100 - var(--wrap)))/var(--col-n) - var(--col-gap)*calc(var(--col-n) - 1)/var(--col-n) + (100vw - 1vw*var(--wrap))/2 + var(--col-gap))!important}
.wrap-3-g > div {padding: var(--margin-top) calc(var(--col-gap)/2); width: calc((100% - 1vw*(100 - var(--wrap)))/var(--col-n) - var(--col-gap)*calc(var(--col-n) - 1)/var(--col-n) + var(--col-gap))!important;}
.wrap-3-g > div:first-child {padding-right:calc(var(--col-gap)/2); padding-left:calc((100vw - 1vw*var(--wrap))/2); width:calc((100% - 1vw*(100 - var(--wrap)))/var(--col-n) - var(--col-gap)*calc(var(--col-n) - 1)/var(--col-n) + (100vw - 1vw*var(--wrap))/2 + var(--col-gap)/2)!important}
.wrap-3-g > div:last-child {padding-left:calc(var(--col-gap)/2); padding-right:calc((100vw - 1vw*var(--wrap))/2); width:calc((100% - 1vw*(100 - var(--wrap)))/var(--col-n) - var(--col-gap)*calc(var(--col-n) - 1)/var(--col-n) + (100vw - 1vw*var(--wrap))/2 + var(--col-gap)/2)!important}

/*-------------------------------------------------------------------------*/
/*	3.5	class="column-center" - /* ONLY COLUMN NOT GRID*/
/*-------------------------------------------------------------------------*/
.column-center {justify-content: center; margin: calc(0vw - (1vw*var(--col-gap-vw) + 1px*var(--col-gap-px))/2);}
.column-center > * {width: calc(100%/var(--col-n) - (1vw*var(--col-gap-vw) + 1px*var(--col-gap-px))); margin: calc((1vw*var(--col-gap-vw) + 1px*var(--col-gap-px))/2);}
.column-center > *:nth-child(1n) {margin-right:calc((1vw*var(--col-gap-vw) + 1px*var(--col-gap-px))/2);}
.column-center > *:first-child {margin-left:calc((1vw*var(--col-gap-vw) + 1px*var(--col-gap-px))/2 + 0.11%);}
.column-center::after {content: ""; flex: none;}

.column-center > *.box-3 {padding: 0 0 calc(100%/4 - (1/4*(1vw*var(--col-gap-vw) + 1px*var(--col-gap-px))/2)*2 - var(--sq-bor)*2);}
.column-center .sq70 {padding: 0 0 calc((100%/var(--col-n) - (1vw*var(--col-gap-vw) + 1px*var(--col-gap-px)))*0.7);}
.column-center .sq120 {padding: 0 0 calc(100%/var(--col-n) - (1vw*var(--col-gap-vw) + 1px*var(--col-gap-px)));}
.column-center .sq150 {padding: 0 0 calc((100%/var(--col-n) - (1vw*var(--col-gap-vw) + 1px*var(--col-gap-px)))*1.5);}

/*-------------------------------------------------------------------------*/
/*	3.6	class="column-first" - 
/*-------------------------------------------------------------------------*/
.column-first *:first-child {width:100%; margin-right:0} /*WORK ONLY WITH COLUMN*/
.grid-2.column-first div:first-child {grid-column-start:1; grid-column-end:3;}
.grid-3.column-first div:first-child {grid-column-start:1; grid-column-end:4;}
.grid-4.column-first div:first-child {grid-column-start:1; grid-column-end:5;}
.grid-5.column-first div:first-child {grid-column-start:1; grid-column-end:6;}
.grid-6.column-first div:first-child {grid-column-start:1; grid-column-end:7;}
.grid-7.column-first div:first-child {grid-column-start:1; grid-column-end:8;}
.grid-8.column-first div:first-child {grid-column-start:1; grid-column-end:9;}

/*-------------------------------------------------------------------------*/
/*	3.7	class="column-parts" - ???????????
/*-------------------------------------------------------------------------*/
.parts-3 + .parts-1 {margin-top: calc(var(--col-gap-3)*3/2);}

/*-------------------------------------------------------------------------*/
/*	3.0	COLUMN-GRID - mobile
/*-------------------------------------------------------------------------*/
@media (max-width:1680px) {
.column-12 > * {--col-gap-px:8; /* max=8 */ --col-gap-vw:0; /* max=0.6 */ }
}
@media (max-width:1440px) {

}
@media (max-width:1366px) {/* 16px to 1024*/

}
@media (max-width:1300px) {
.column-12 > * {--col-gap-px:6; /* max=6 */ }
}
@media (max-width:1140px) {/* 16px to 1024*/

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

.grid-5, .column-5, .grid-6, .column-6 {--col-n:4}
.column-5.like-g > *:nth-child(5n+1):nth-last-child(-n+5) ~ *,
.column-6.like-g > *:nth-child(6n+1):nth-last-child(-n+6) ~ * {margin-left:unset;}
.column-5.like-g > *:nth-child(4n+1):nth-last-child(-n+4) ~ *,
.column-6.like-g > *:nth-child(4n+1):nth-last-child(-n+4) ~ * {margin-left:var(--col-gap);}
}
@media (max-width:1024px) {
.grid-4, .column-4 {--col-n:3}
.grid-8, .column-8 {--col-n:6;}
.grid-10, .column-10 {--col-n:5;}
.grid-12, .column-12 {--col-n:6;}
.grid-7, .column-7, .grid-9, .grid-11 {--col-n:3}
.column-4.like-g > *:nth-child(4n+1):nth-last-child(-n+4) ~ *,
.column-7.like-g > *:nth-child(7n+1):nth-last-child(-n+7) ~ *,
.column-8.like-g > *:nth-child(8n+1):nth-last-child(-n+8) ~ *,
.column-10.like-g > *:nth-child(10n+1):nth-last-child(-n+10) ~ *,
.column-12.like-g > *:nth-child(12n+1):nth-last-child(-n+12) ~ * {margin-left:unset;}
.column-4.like-g > *:nth-child(3n+1):nth-last-child(-n+3) ~ *,
.column-7.like-g > *:nth-child(3n+1):nth-last-child(-n+3) ~ *,
.column-8.like-g > *:nth-child(6n+1):nth-last-child(-n+6) ~ *,
.column-10.like-g > *:nth-child(5n+1):nth-last-child(-n+5) ~ *,
.column-12.like-g > *:nth-child(6n+1):nth-last-child(-n+6) ~ * {margin-left:var(--col-gap);}
}
@media (max-width:920px) { /* 14px to 780*/ 
	
}
@media (max-width:820px) {

}
@media (max-width:768px) { /* 18px to 680*/
.column-12 > * {--col-gap-px: 18;} /* !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */
.grid-3, .column-3, .grid-4, .column-4, .grid-5, .column-5, .grid-6, .column-6, .grid-7, .column-7 {--col-n:2}
.grid-8, .column-8, .grid-9, .column-9, .grid-10, .column-10, .grid-11, .column-11, .grid-12, .column-12 {--col-n:3}

.column-4.like-g > *:nth-child(3n+1):nth-last-child(-n+3) ~ *,
.column-5.like-g > *:nth-child(4n+1):nth-last-child(-n+4) ~ *,
.column-6.like-g > *:nth-child(4n+1):nth-last-child(-n+4) ~ *,
.column-7.like-g > *:nth-child(3n+1):nth-last-child(-n+3) ~ *,
.column-8.like-g > *:nth-child(6n+1):nth-last-child(-n+6) ~ *,
.column-10.like-g > *:nth-child(5n+1):nth-last-child(-n+5) ~ *,
.column-12.like-g > *:nth-child(6n+1):nth-last-child(-n+6) ~ * {margin-left:unset;}
	

.column-8.like-g > *:nth-child(3n+1):nth-last-child(-n+3) ~ *,
.column-9.like-g > *:nth-child(3n+1):nth-last-child(-n+3) ~ *,
.column-10.like-g > *:nth-child(3n+1):nth-last-child(-n+3) ~ *,
.column-11.like-g > *:nth-child(3n+1):nth-last-child(-n+3) ~ *,
.column-12.like-g > *:nth-child(3n+1):nth-last-child(-n+3) ~ * {margin-left:var(--col-gap);}
	
[class^="column-"]::after {content: ""; flex: auto; display: none}
}
@media (max-width:680px) {

}
@media (max-width:620px) { /* to 576*/
.grid-2, .column-2, .grid-3, .column-3, .grid-4, .column-4, .grid-5, .column-5, .grid-6, .column-6, .grid-7, .column-7 {--col-n:1}
.grid-8, .column-8, .grid-9, .column-9, .grid-10, .column-10, .grid-11, .column-11, .grid-12, .column-12 {--col-n:2}
.column-2 > *, .column-3 > *, .column-4 > *, .column-5 > *, .column-6 > *, .column-7 > * {width:100%; margin-bottom:var(--margin-top);}
.column-8.like-g > *:nth-child(3n+1):nth-last-child(-n+3) ~ *,
.column-9.like-g > *:nth-child(3n+1):nth-last-child(-n+3) ~ *,
.column-10.like-g > *:nth-child(3n+1):nth-last-child(-n+3) ~ *,
.column-11.like-g > *:nth-child(3n+1):nth-last-child(-n+3) ~ *,
.column-12.like-g > *:nth-child(3n+1):nth-last-child(-n+3) ~ * {margin-left:unset;}
}
@media (max-width:576px) {

.grid-2, .column-2, .grid-3, .column-3, .grid-4, .column-4, .grid-5, .column-5, .grid-6, .column-6, .grid-7, .column-7, .grid-8, .column-8, .grid-9, .column-9, .grid-10, .column-10, .grid-11, .column-11, .grid-12, .column-12 {--col-n:1}
.column-8 > *, .column-9 > *, .column-10 > *, .column-11 > *, .column-12 > * {width:100%; margin-bottom:var(--margin-top);}
	
[class^="column-"] > *:nth-child(3n+1):nth-last-child(-n+1) ~ * {margin-left:unset;}
[class^="column-"] > *:nth-child(3n+1){margin-left:unset;}
}
@media (max-width:480px) { /* to 380*/
}
@media (max-width:380px) {
	
}
