﻿:root {
  --c1:#ff0000;
}
/* color: var(--c1); */
.text_red {color:#ef292a;}

select {background-image:url('/media/images/site/icon/dd_b.svg') !important; background-repeat:no-repeat !important; background-position:center right 1rem !important; background-size:auto !important;}

#nothing_found {width:100%; line-height:100px; text-align:center;}

#status_bar {
  height:100%;
  width:0;
  position:absolute;
  background-color:rgba(255,180,1,0.5);
  pointer-events:none;
  transition:0.1s;
  top:0;
  left:0;
}

.ui-widget-header {border:1px solid #dddddd; background:linear-gradient(0deg, #e38125 0%, #f0ba54 70%);}
.ui-widget.ui-widget-content {border:1px solid #d5d5d5; background-color:#ededed;}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
	border:1px solid #aaa;
	background:#fff;
	font-weight:normal;
	color:#ffffff;
}

#img_bx {
	width:100%;
	height:100%;
	position:fixed;
	z-index:100;
	left:0;
	top:0;
	background-color:rgba(0,0,0,0.9);
	background-repeat:no-repeat;
	background-position:center center;
	-webkit-transform:translateZ(0);
	-webkit-backface-visibility:hidden;
}

#img_bx:not(.act) {display:none;}
#img_bx.act {display:block;}

#img_bx > .bc, #img_bx > .bl, #img_bx > .br {
	width:50px;
	height:50px;
	position:absolute;
	cursor:pointer;
	background-color:transparent;
	background-image:url('/media/images/site/nav2.svg');
	background-repeat:repeat;
	background-size:200%;
	transition:0.2s;
}
#img_bx > .bc {top:2%; right:2%; z-index:3; background-position:0 50px;}
#img_bx > .bc:hover {background-position:-50px 50px;}
#img_bx > .bl {left:2%; top:50%; margin-top:-25px; z-index:1; background-position:0 -50px;}
#img_bx > .bl:hover {background-position:-50px -50px;}
#img_bx > .br {right:2%; top:50%; margin-top:-25px; z-index:1;background-position:0 0;}
#img_bx > .br:hover {background-position:50px 0;}
#img_bx > .st {position:absolute; z-index:2; top:2%; left:2%; color:#fff;}

main > h1 {padding:0 3rem; font-size:1.5rem; font-weight:bold; margin-top:1rem;}

main > .about {width:100%; display:flex; flex-flow:row wrap; justify-content:left; padding:1rem;}
main > .about > .img {width:30%; min-height:50vh; background:url(/media/images/site/pg_about_img.jpg) no-repeat center / cover;}
main > .about > .txt {width:70%; padding:0 1rem}
main > .about > .txt > p {border-left:2px solid #e38125; padding:1rem 0 1rem 2rem; margin-left:1rem;}
main > .about > .txt > p .txt_logo {width:5rem; margin-bottom:-.15rem; filter:grayscale(1) brightness(.6); content:url(/media/images/site/logo.svg);}

#h_menu_mb {
	width:50px;
	height:50px;
	position:absolute;
	z-index:12;
	right:10px;
	top:70px;
	-webkit-transform:translateZ(0);
	-webkit-backface-visibility:hidden;
	background:transparent url('/media/images/site/mob_menu.svg') repeat 0 0 / auto 100%;
	transition:0.2s;
	cursor:pointer;
	display:none;
}
#h_menu_mb:hover {background-position:-50px 0;}

#ovrl.img.act > .bx {padding:0 !important; border:none !important; background-color:transparent !important; box-shadow:none !important; overflow:visible !important;}
#ovrl.img.act > .bx > img {max-width:80vw; max-height:80vh;}

#ovrl.act > .bx > .it {width:22vw; display:block; float:left;}
#ovrl.act > .bx > .it > .img {width:100%; height:33vw; background-blend-mode:multiply; background-size:contain; background-repeat:no-repeat; background-position:50% 0%; /*border:1px solid #eee;*/}
#ovrl.act > .bx > .it.mle > .img {background-position:50% 4rem;}

#ovrl.act > .bx > .it > .img > .txt {width:100%; color:#fff; background-color:#0003; padding:1rem; line-height:1rem; text-align:left;}
#ovrl.act > .bx > .it > .img > .txt > span {width:100%; display:block;}
#ovrl.act > .bx > .it > .img > .txt > .cd {text-transform:uppercase;}
#ovrl.act > .bx > .it > .img > .txt > .nm {font-size:.8rem;}

#ovrl.act > .bx > .it > .tag {display:none;}

#ovrl.act > .bx > .menu {width:32vw; float:left; text-align:left; padding-left:2rem;}
#ovrl.act > .bx > .menu > label {width:100%; height:1.5rem; display:block; cursor:pointer; margin:.5rem 0; float:left;}

#ovrl.act > .bx > .menu label > input.rio {display:none;}
#ovrl.act > .bx > .menu > label > .emul.rio {width:1.5rem; height:1.5rem; float:left; border:.1rem solid #777; border-radius:50%;}
#ovrl.act > .bx > .menu > label > input[type="radio"]:checked+.emul.rio {background:radial-gradient(#e38125 0%, #e38125 20%, #fff 30%);}

#ovrl.act > .bx > .menu > .flgr {width:100%; display:flex; flex-flow:row wrap; justify-content:space-between;}
#ovrl.act > .bx > .menu label {width:33.33%;}
#ovrl.act > .bx > .menu label > .img {width:100%/*11rem*/; height:16.5rem; border:1px solid #eee; transition:.25s; cursor:pointer; background-repeat:no-repeat; background-position:center; background-size:cover; margin:0 auto;}
#ovrl.act > .bx > .menu label.no > .img {background-color:#fff;}
#ovrl.act > .bx > .menu label.no > .img::after {content:"+"; position:absolute; top:50%; left:50%; font-size:5rem; transform:rotate(45deg) translate(-100%, -18%); color:#b7b7b7;}

#ovrl.act > .bx > .menu label > .txt {width:100%; text-align:center;}
#ovrl.act > .bx > .menu label > input[type="radio"]:checked ~ .img {border:1px solid #e38125; transform:scale(1); /*filter:grayscale(0);*/}
#ovrl.act > .bx > .menu label > input[type="radio"]:not(:checked) ~ .img {transform:scale(.8); /*filter:grayscale(.5);*/}

#ovrl.act > .bx > .menu > label > .txt {line-height:1.5rem; float:left; margin-left:1rem; position:relative;}
#ovrl.act > .bx > .menu > label > .txt > .unln {width:0%; height:2px; position:absolute; bottom:0; left:0; transition:.3s; background-color:#e38125;}
#ovrl.act > .bx > .menu > label > input[type="radio"]:checked~.txt > .unln {width:100%;}

#ovrl.act > .bx > .menu > .sel.l, #ovrl.act > .bx > .menu > .txt.h {width:49%; float:left;}
#ovrl.act > .bx > .menu > .sel.r, #ovrl.act > .bx > .menu > .txt.w {width:49%; margin-left:2%; float:right;}
#ovrl.act > .bx > .menu > .sel.hide {display:none;}

#ovrl.act > .bx > .menu > .txt {border:1px solid #ddd; background:#fff; padding:.5rem 1rem;}

#ovrl.act > .bx .btns {width:100%; line-height:3rem; float:left;}
#ovrl.act > .bx .btns > .btn {width:48%; line-height:inherit; float:left; margin-top:3rem; text-align:center; color:#fff; cursor:pointer; transition:.2s;}
#ovrl.act > .bx .btns > .btn:hover {transform:scale(1.1);}

#ovrl.act > .bx .btns > .btn {position:relative;}
#ovrl.act > .bx .btns > .btn.cancel {background-color:#333;}
#ovrl.act > .bx .btns > .btn.proceed {margin-left:4%; background-color:#e38125;}
#ovrl.act > .bx .btns > .btn.zkz.send {margin:3rem auto 0; float:none; background-color:#e38125; display:inline-block; width:auto; min-width:30%; padding:0 1rem;}
#ovrl.act > .bx .btns > .btn.finalize {margin:1rem 26%; background-color:#e38125;}

#ovrl.act > .bx.patina > .menu {height:100%; display:flex; align-items:end; flex-flow:row wrap;}
#ovrl.act > .bx.patina > .menu > .txt {width:100%; float:left; text-align:center;text-transform:lowercase;}
#ovrl.act > .bx.patina > .menu > .btns > .btn {margin-top:0 !important;}

#ovrl.act > .bx > .menu > p {width:100%; margin-bottom:.5rem; float:left;}
#ovrl.act > .bx > .menu > p:first-child {margin-top:0;}
#ovrl.act > .bx > .menu > p:not(:first-child) {margin-top:2rem;}

#ovrl.act > .bx > .menu > .gr_sds {width:100%; height:34rem; position:relative; border:1px solid #eee; float:left;}
#ovrl.act > .bx > .menu > .gr_sds > .btn {position:absolute; cursor:pointer; z-index:2; background-repeat:no-repeat; background-size:auto; background-position:50%; transition:.25s;}
#ovrl.act > .bx > .menu > .gr_sds > .btn.t {width:50%; height:25%; top:0; left:25%; background-image:url(/media/images/site/icon/arw_b.svg);}
#ovrl.act > .bx > .menu > .gr_sds > .btn.t:hover {background-position:50% 60%;}
#ovrl.act > .bx > .menu > .gr_sds > .btn.r {width:25%; height:50%; top:25%; right:0; background-image:url(/media/images/site/icon/arw_l.svg);}
#ovrl.act > .bx > .menu > .gr_sds > .btn.r:hover {background-position:40% 50%;}
#ovrl.act > .bx > .menu > .gr_sds > .btn.b {width:50%; height:25%; bottom:0; left:25%; background-image:url(/media/images/site/icon/arw_t.svg);}
#ovrl.act > .bx > .menu > .gr_sds > .btn.b:hover {background-position:50% 40%;}
#ovrl.act > .bx > .menu > .gr_sds > .btn.l {width:25%; height:50%; top:25%; left:0; background-image:url(/media/images/site/icon/arw_r.svg);}
#ovrl.act > .bx > .menu > .gr_sds > .btn.l:hover {background-position:60% 50%;}
#ovrl.act > .bx > .menu > .gr_sds > .btn > input[type="checkbox"] {display:none;}
#ovrl.act > .bx > .menu > .gr_sds > .btn > .vis {width:100%; height:100%; border:3px solid transparent; transition:.25s;}
#ovrl.act > .bx > .menu > .gr_sds > .btn > input[type="checkbox"]:checked~.vis {animation:glow 1s infinite;}
#ovrl.act > .bx > .menu > .gr_sds > .btn.t > input[type="checkbox"]:checked~.vis {border-bottom:3px solid #e38125; animation-delay:0;}
#ovrl.act > .bx > .menu > .gr_sds > .btn.r > input[type="checkbox"]:checked~.vis {border-left:3px solid #e38125; animation-delay:.25s;}
#ovrl.act > .bx > .menu > .gr_sds > .btn.b > input[type="checkbox"]:checked~.vis {border-top:3px solid #e38125; animation-delay:.5s;}
#ovrl.act > .bx > .menu > .gr_sds > .btn.l > input[type="checkbox"]:checked~.vis {border-right:3px solid #e38125; animation-delay:.75s;}
#ovrl.act > .bx > .menu > .gr_sds > .txt {width:50%; height:50%; position:absolute; top:25%; left:25%; z-index:1; border:1px solid #eee; /*background-image:url(/media/images/upload/catalog/mlf/mdrn/x/max/webp/b4787ea9dd42e7c75372.webp), url(/media/images/upload/catalog/txr/pvc/strc/max/webp/4e285d2a755558019c81.webp); background-blend-mode:luminosity; background-repeat:no-repeat; background-position:center; background-size:cover;*/}
#ovrl.act > .bx > .menu > .gr_sds > .txt > label {position:absolute; color:#555; cursor:pointer;}
#ovrl.act > .bx > .menu > .gr_sds > .txt > .t {width:100%; text-align:center; top:0; padding:5% 2rem 1rem;}
#ovrl.act > .bx > .menu > .gr_sds > .txt > .r {width:50%; top:calc(50% - 2.5rem); right:0; padding:2rem 5% 2rem 1rem; text-align:right;}
#ovrl.act > .bx > .menu > .gr_sds > .txt > .b {width:100%; text-align:center; bottom:0; padding:1rem 2rem 5%;}
#ovrl.act > .bx > .menu > .gr_sds > .txt > .l {width:50%; top:calc(50% - 2.5rem); left:0; padding:2rem 1rem 2rem 5%;}

#ovrl.act > .bx > .menu > .sel_unsel {width:100%; padding:.5rem 0; float:left;}
#ovrl.act > .bx > .menu > .sel_unsel > .slct,
#ovrl.act > .bx > .menu > .sel_unsel > .unslct {width:48%; text-align:center; padding:.5rem 1rem; background-color:#8a8a8a; color:#fff; cursor:pointer; transition:.2s;}
#ovrl.act > .bx > .menu > .sel_unsel > .slct:hover,
#ovrl.act > .bx > .menu > .sel_unsel > .unslct:hover {background-color:#606060;}
#ovrl.act > .bx > .menu > .sel_unsel > .slct {float:left;}
#ovrl.act > .bx > .menu > .sel_unsel > .unslct {float:right;}

#ovrl .menu.x {width:60vw !important; padding:0 !important;}
#ovrl .menu.x > .dcr {width:100%; display:flex; flex-flow:row wrap; justify-content:space-between; float:left;}
#ovrl .menu.x > .dcr .z_it {text-align:center; margin:.1rem 0; padding:1rem; border:1px solid transparent; border-radius:0; cursor:pointer; transition:.3s;}
#ovrl .menu.x > .dcr .z_it:hover {border:1px solid #bbb; border-radius:.25rem;}
#ovrl .menu.x > .dcr .it, #ovrl .menu.x > .dcr .nm {transition:.2s;}
#ovrl .menu.x > .dcr .it {margin:.5rem auto; width:12rem; min-height:8rem; padding:1rem 0; position:relative; cursor:pointer; background-color:#fff; border:2px solid transparent; background-size:contain; background-position:center; background-repeat:no-repeat; background-blend-mode:multiply; border-radius:.25rem; overflow:hidden; display:flex; flex-flow:column wrap; justify-content:center;}
#ovrl .menu.x > .dcr .nm {width:100%; display:block;}
#ovrl .menu.x > .dcr input.denied ~ .it {background-color:#c13600;}
#ovrl .menu.x > .dcr .sz_bx {margin-top:1rem; height:0; overflow:hidden; transform:scale(0); -webkit-transform:scale(0) translateZ(0); transition:.3s;}
#ovrl .menu.x > .dcr .sz_bx > .sz {margin:0.3rem auto; width:auto; display:block;}
#ovrl .menu.x > .dcr .sz_bx > .sz > .txt {width:auto;}
#ovrl .menu.x > .dcr .sz_bx > .sz > .qu {width:30%; text-align:center; border:1px solid #ddd; transition:.3s;}
#ovrl .menu.x > .dcr input[type="checkbox"] {display:none;}
#ovrl .menu.x > .dcr input[type="radio"]:checked ~ .it,
#ovrl .menu.x > .dcr input[type="checkbox"]:checked ~ .it {transform:scale(1.1); z-index:2; border-color:#e38125;}
#ovrl .menu.x > .dcr input[type="checkbox"]:checked ~ .nm {color:#e38125}
#ovrl .menu.x > .dcr input[type="checkbox"]:checked ~ .sz_bx {height:auto; transform:scale(1); -webkit-transform:scaleY(1) translateZ(0);}
#ovrl .menu.x > .dcr input[type="checkbox"]:checked ~ .sz_bx .qu.act {border-color:#e38125;}
#ovrl .menu.x > .dcr .it > .nm {color:#fff; position:absolute; bottom:5%; left:5%;}

#ovrl .menu.x > .dcr .it > .sz {display:none;}
#ovrl .menu.x > .dcr input:checked ~ .it > .sz {width:100%; margin:.25em 0; display:block; color:#fff; font-size:0.7rem; padding:.03rem 0; /*background:linear-gradient(180deg, #e3812511 0%, #e38125aa 40%, #e38125aa 60%, #e3812511 100%);*/}
#ovrl .menu.x > .dcr input:checked ~ .it > .sz > .txt {width:55%; float:left;}
#ovrl .menu.x > .dcr input:checked ~ .it > .sz > .qu {width:25%; display:inline-block; text-align:center; background:inherit; color:inherit; font-size:inherit;}

#ovrl > .bx > .note {width:50vw;}
#ovrl > .bx > .note > span.note_ttl {display:block; text-align:left;}
#ovrl > .bx > .note > textarea.note_txt {width:100%; height:50vh; padding:1rem;}

#ovrl > .bx > .zm_txt {text-transform:uppercase; text-align:right; color:#fff;}
#ovrl > .bx > .zm_img {max-width:40vw; max-height:80vh;}
#ovrl > .bx > .zm_clr {width:40vw; height:80vh;}

#ovrl .finalize {}

#ovrl .finalize > .inp {border:1px solid #ddd; padding:1rem;}
#ovrl .finalize > .inp.name, #ovrl .finalize > .inp.email {width:33%; border-left:none; border-right:none;}
#ovrl .finalize > .inp.phone {width:33%;}
#ovrl .finalize > .inp.msg {width:100%; min-height:12rem; margin:1rem 0 0;}

#ovrl .finalize > h2 {margin:2rem 0; font-weight:bold;}

#ovrl .finalize > .dd_plc {border:2px solid #eee; border-radius:.25rem; display:block; position:relative; transition:.3s;}
#ovrl .finalize > .dd_plc > .f {width:50vw; height:15vh; margin:1rem; cursor:pointer; transition:.3s;}
#ovrl .finalize > .dd_plc > .txt {width:0; top:50%; position:absolute; text-align:center; font-size:0rem; line-height:0rem; color:#ddd; overflow:hidden; transition:.3s; left:0; right:0; margin:0 auto;}
#ovrl .finalize > .dd_plc.drag {border:2px dashed #ddd;}
#ovrl .finalize > .dd_plc.drag > .f {height:30vh;}
#ovrl .finalize > .dd_plc.drag > .txt {width:100%; top:calc(50% - 1.5rem); font-size:3rem; line-height:3rem;}
#ovrl .finalize > .dd_plc.drag.hov {border-color:#e38125;}
#ovrl .finalize > .inf {margin-top:1rem;}
#ovrl .finalize > .prv {width:100%; margin-top:2rem; padding-top:1rem; border-top:1px solid #a24c4c; position:relative;}
#ovrl .finalize > .inf.h,
#ovrl .finalize > .prv.h {display:none;}
#ovrl .finalize > .prv > .its {width:100%; display:flex; flex-flow:row wrap; justify-content:center;}
#ovrl .finalize > .prv > .ttl {position:absolute; top:-1.2rem; left:0; color:#a24c4c;}
#ovrl .finalize > .prv .it {max-width:15%; height:min-content; margin:.3rem; padding:.3rem; transform:scale(1); /*cursor:help;*/ transition:.5s;}
#ovrl .finalize > .prv .it.f_img {border:1px solid #ddd;}
#ovrl .finalize > .prv .it.h {transform:scale(0);}
#ovrl .finalize > .prv .it > .img {max-width:100%; max-height:5rem;}
#ovrl .finalize > .prv .it.f_img > .img {max-height:10rem; border-bottom:1px solid #eee;}
#ovrl .finalize > .prv .it > .nm {width:100%; display:block; text-align:center; margin:0 auto; word-wrap:break-word;}
#ovrl .finalize > .prv .it > .sz {font-weight:bold; font-size:.7rem;}

main > .app .inf>.ln {text-align:center;}
main > .app .inf>.ln>b {color:#a24c4c;}
main > .app .dcr_sz {font-size:.8rem; color:#bd8331;}
main > .app .dcr_dlm {color:#a24c4c;}
main > .app .inf_no_act * {color:#ddd !important;}
main > .app .dcr_it {position:relative; padding-left:2rem; transition:.3s;}
main > .app .dcr_it.hide > * {color:#ddd !important; transition:.3s;}
main > .app .dcr_it > img, main > .app .dcr_it > .trigger {position:absolute; z-index:2; top:0; left:0; transition:.3s; width:1rem;}
main > .app .dcr_it > .trigger {width:1rem; height:1rem;}
main > .app .dcr_it.ar_v > img {width:.5rem; left:.3rem;}
main > .app .dcr_it.ar_e > img {width:1rem;}
main > .app .dcr_it.ar_h > img {width:1.5rem; left:-.15rem;}
main > .app .dcr_it:hover > img {top:100%; left:50%; z-index:3; border:1px solid #e38125; border-radius:.5rem;}
main > .app .dcr_it.ar_v:hover > img {width:8rem; margin-left:-3rem;}
main > .app .dcr_it.ar_e:hover > img {width:12rem; margin-left:-5rem;}
main > .app .dcr_it.ar_h:hover > img {width:16rem; margin-left:-7rem;}

/*---------------------------------ALL-----------------------------------*/
header, #crumbs, #ann, #fltr, main, footer {width:100%; position:relative; float:left; z-index:1;}

#mm_cbx {display:none;}
#mm_lb {
	width:3rem;
	height:3rem;
	position:fixed;
	right:0;
	top:2vh;
	cursor:pointer;
	background:#fff url(/media/images/site/v2/m_menu.svg) no-repeat center / 70%;
	border-radius:.5rem 0 0 .5rem;
	transition:.2s;
	display:none;
	z-index:12;
	border:1px solid #8e8e8e;
	border-right:0;
}
#mm_lb:hover {transform:scale(1.25);}

/*---------------------------------HEADER-----------------------------------*/

header {width:100%; height:5rem; padding:1rem 2rem; display:flex; flex-flow:row; justify-content:space-between; align-items:center; z-index:11; background-color:#fff; border-bottom:1px solid #f0f0f0; top:0; left:0; position:fixed; z-index:11; transition:.7s; -webkit-transform:translateZ(0); -webkit-backface-visibility:hidden;}
header.act {background-color:#fffe;}

header a {margin:0 1rem; transition:.2s;}
header a.hl {color:#dc1f27; animation:glow 1s infinite;}
header a.active {color:#f7ad44;}
header a:hover:not(.h_logo) {color:#f7ad44; transform:scale(1.1);}
header > .h_menu, header > .h_menu > a {float:left;}
header > .h_lang, header > .h_lang > a {float:right;}

header > .h_call {width:2.5rem; height:2.5rem; background:#333 url(/media/images/site/icon/call.svg) no-repeat 50% / 50%; border-radius:50%; float:right; animation:shake 3s linear infinite; transition:.3s;}
header > .h_call:hover {background-color:#d91f26;}

/*-----SLIDER---[START]----------*/

#slider {width:100vw; height:33.33vw; overflow:hidden; position:relative; float:left; margin:0; margin-top:5rem}
	
#slider .pattern {width:100%; height:100%; background:url('/media/images/site/pattern.png') repeat; position:absolute; z-index:5;}

#slider .slide {width:0; height:100%; float:left; transition:1s; background-repeat:no-repeat; background-size:100% auto; background-position:center; position:absolute; left:0; opacity:0; z-index:1;}
#slider .slide.active {left:auto; right:0%; width:100%; opacity:1; z-index:2;}
#slider .slide .txt {display:none;}

#slider > .txt_bx {width:100%; height:100%; padding:20px; background-color:rgba(0,0,0,0.5); position:absolute; top:0; left:22.85%; box-sizing:border-box; transition:0.5s; text-transform:uppercase; z-index:3; display:flex; flex-flow:row wrap; align-items:center;}
#slider > .txt_bx > .txt {color:#eee; position:absolute; font-size:2rem;}

#slider > .timebar {width:100%; height:2px; position:absolute; bottom:0; z-index:4; background-color:#0002;}
#slider > .timebar > .fill {height:100%; float:left; background-color:#333;}
#slider > .timebar > .fill.min {width:0%; transition:none !important;}
#slider > .timebar > .fill.max {width:100%; background-color:#e38125;}


/*---------------------------------MAIN-----------------------------------*/
main {min-height:50vh; margin-top:5rem;}

/*-----HOMEPAGE---[START]----------*/

main > .bx {background-color:#fff; float:left; padding:3rem 0;}
main > .bx:not(.max) {width:80%; margin:0 10%;}
main > .bx.max {width:100%;}

main > .bx > .gr {float:left;}

main > .bx > .b1 {padding:1rem 0; margin:1rem 0 3rem;}
main > .bx > .b1:not(.l) {width:100%; text-align:center;}
main > .bx > .b1.l {width:20%; text-align:left; background-position:bottom left;}

main > .bx > .b1 .spr {width:50%; height:12px; background:url(/media/images/upload/pg_home/spr.png) no-repeat bottom center / contain; margin:0 auto;}
main > .bx > .b1.l .spr {background-position:center left; margin:0;}

main > .bx > .b1 > .ttl {font-size:1.5rem; text-transform:uppercase;}
main > .bx > .b1 > .txt {font-size:1.1rem;}
main > .bx > .b1.c > .txt {color:#818181; text-transform:uppercase; font-size:.9rem;}

main > .bx.n2 {background:#333 url(/media/images/upload/pg_home/video1.jpg) no-repeat center / 100% auto; background-blend-mode:soft-light; display:flex; flex-flow:row; align-items:center; padding:9rem 0;}
main > .bx.n2 > .play_vid {width:15vw; height:15vw; background:url(/media/images/upload/pg_home/play.png) no-repeat center / cover; margin:0 auto; border-radius:50%; cursor:pointer; transition:.2s;}
main > .bx.n2 > .play_vid:hover {transform:scale(1.1);}

main > .bx.n3 {display:flex; flex-flow:row wrap; justify-content:space-between; padding-left:2rem;}
main > .bx.n3 > .gr {float:left;}
main > .bx.n3 > .gr > .it {width:12vw; height:calc(12vw * 1.498233215547703); position:relative; background-color:#555b60; color:#fff; border-radius:.3rem; transition:.2s;}
main > .bx.n3 > .gr:hover > .it {background-color:#f3c16b;}
main > .bx.n3 > .gr > .it > .ttl {text-transform:uppercase; transform:rotateZ(90deg) translate3d(95%,120%,0); position:absolute; right:0; transform-origin:bottom right; transition:.2s;}
main > .bx.n3 > .gr > .it > img {width:inherit; height:inherit; position:absolute; left:-2rem; top:2rem;}
main > .bx.n3 > .gr > .it > .nr {width:4rem; border-radius:50%; background-color:#f3c16b; position:absolute; z-index:2; text-align:center; line-height:4rem; font-size:1.5rem; top:3rem; left:-1rem; transition:.2s;}
main > .bx.n3 > .gr:hover > .it > .nr {background-color:#555b60;}
main > .bx.n3 > .gr > .txt {margin-top:4rem; text-transform:uppercase; margin-left:-10%;}

main > .bx.n4 {background-color:#555b60; padding:3rem 10%; color:#fff;}
main > .bx.n4 > .b1.l {width:30%; float:left !important;}
main > .bx.n4 > .gr {width:70%; display:flex; flex-flow:row wrap; justify-content:space-between;}
main > .bx.n4 > .gr > .it {width:32%;}
main > .bx.n4 > .gr > .it > img {width:100%; float:left;}
main > .bx.n4 > .gr > .it > .sub {float:left; width:100%; position:relative; background-color:#44484c;}
main > .bx.n4 > .gr > .it > .sub > .txt {max-width:80%; background-color:inherit; margin-left:5%; float:left; padding:.5rem; font-weight:bold; position:relative; z-index:2;}
main > .bx.n4 > .gr > .it > .sub > .ln {height:3px; position:absolute; top:50%; bottom:0; right:0; width:0; background-color:#f3c16b; z-index:1; transition:.3s;}
main > .bx.n4 > .gr > .it:hover > .sub > .ln {left:0; right:auto; width:100%;}

main > .bx.n5 {text-transform:uppercase;}
main > .bx.n5 > .m {width:70%; float:left; position:relative;}
main > .bx.n5 > .m > .dot {width:2vw; height:2vw; position:absolute; cursor:pointer;}

main > .bx.n5 > .m > .dot > .t {width:40%; height:40%; position:absolute; z-index:2; background-color:#fff; border-radius:50%; top:30%; left:30%;}
main > .bx.n5 > .m > .dot > .b {width:100%; height:100%; background-color:#f3c16b; border-radius:50%; animation:anm1 1.5s ease-in-out infinite; transition:background-color .5s;}
main > .bx.n5 > .m > .dot:hover > .b {background-color:#ffa70f;}
main > .bx.n5 > .m > .dot > .b2 {width:100%; height:100%; background-color:#f3c16b; border-radius:50%; animation:anm2 1.5s ease-in-out infinite; position:absolute; z-index:1; top:0; opacity:0; transition:background-color .5s;}
main > .bx.n5 > .m > .dot:hover > .b2 {background-color:#ffa70f;}
main > .bx.n5 > .m > .dot > .inf {width:100%; height:100%; opacity:0; color:#ffa70f; position:absolute; top:0; left:0; z-index:3; transition:opacity .4s;}
main > .bx.n5 > .m > .dot:hover > .inf {opacity:1;}
main > .bx.n5 > .m > .dot > .inf > .ln {width:0; border-top:1px dashed; transform-origin:top left; position:absolute; transition:width .4s;}
main > .bx.n5 > .m > .dot > .inf > .txt {padding:.1rem 1rem; border:1px solid #ffa70f; position:absolute; color:#333; transition:top .4s, right .4s, bottom .4s, left .4s;}

main > .bx.n5 > .m > .dot.d1 {top:67%; left:22%;}
main > .bx.n5 > .m > .dot.d1 .ln {top:100%; left:100%; transform:rotateZ(53deg);}
main > .bx.n5 > .m > .dot.d1:hover .ln {width:500%;}
main > .bx.n5 > .m > .dot.d1 .txt {top:0; left:0;}
main > .bx.n5 > .m > .dot.d1:hover .txt {top:500%; left:400%;}

main > .bx.n5 > .m > .dot.d2 {top:55%; left:36%;}
main > .bx.n5 > .m > .dot.d2 .ln {transform:rotateZ(-32deg); top:20%; left:100%;}
main > .bx.n5 > .m > .dot.d2:hover .ln {width:230%;}
main > .bx.n5 > .m > .dot.d2 .txt {bottom:0; left:0;}
main > .bx.n5 > .m > .dot.d2:hover .txt {bottom:200%; left:300%;}

main > .bx.n5 > .m > .dot.d3 {top:25%; left:39%;}
main > .bx.n5 > .m > .dot.d3 .ln {top:100%; left:100%; transform:rotateZ(51deg);}
main > .bx.n5 > .m > .dot.d3:hover .ln {width:315%;}
main > .bx.n5 > .m > .dot.d3 .txt {top:0; left:0;}
main > .bx.n5 > .m > .dot.d3:hover .txt {top:350%; left:300%;}

main > .bx.n5 > .m > .dot.d4 {top:6%; left:45.5%;}
main > .bx.n5 > .m > .dot.d4 .ln {top:0; left:30%; transform:rotateZ(80deg);}
main > .bx.n5 > .m > .dot.d4:hover .ln {width:770%;}
main > .bx.n5 > .m > .dot.d4 .txt {top:0; left:0;}
main > .bx.n5 > .m > .dot.d4:hover .txt {top:750%; left:158%;}

main > .bx.n5 > .m > .dot.d5 {top:70%; left:53.5%;}
main > .bx.n5 > .m > .dot.d5 .ln {top:0; left:30%; transform:rotateZ(-102deg);}
main > .bx.n5 > .m > .dot.d5:hover .ln {width:420%;}
main > .bx.n5 > .m > .dot.d5 .txt {bottom:0; right:0;}
main > .bx.n5 > .m > .dot.d5:hover .txt {bottom:520%; right:158%;}

main > .bx.n5 > .m > .dot.d6 {top:14%; left:56.5%;}
main > .bx.n5 > .m > .dot.d6 .ln {top:100%; transform:rotateZ(101deg); left:50%;}
main > .bx.n5 > .m > .dot.d6:hover .ln {width:500%;}
main > .bx.n5 > .m > .dot.d6 .txt {top:0; right:0;}
main > .bx.n5 > .m > .dot.d6:hover .txt {top:600%; right:150%;}

main > .bx.n5 > .m > .dot.d7 {top:86%; left:62.5%;}
main > .bx.n5 > .m > .dot.d7 .ln {top:70%; transform:rotateZ(175deg);}
main > .bx.n5 > .m > .dot.d7:hover .ln {width:390%;}
main > .bx.n5 > .m > .dot.d7 .txt {top:0; right:0;}
main > .bx.n5 > .m > .dot.d7:hover .txt {top:100%; right:500%;}

main > .bx.n5 > .m > .dot.d8 {top:31%; left:66%;}
main > .bx.n5 > .m > .dot.d8 .ln {top:100%; left:0; transform:rotateZ(143deg);}
main > .bx.n5 > .m > .dot.d8:hover .ln {width:240%;}
main > .bx.n5 > .m > .dot.d8 .txt {top:0; right:0;}
main > .bx.n5 > .m > .dot.d8:hover .txt {top:250%; right:300%;}

main > .bx.n5 > .m > .dot.d9 {top:43%; left:74%;}
main > .bx.n5 > .m > .dot.d9 .ln {top:100%; left:100%; transform:rotateZ(45deg);}
main > .bx.n5 > .m > .dot.d9:hover .ln {width:70%;}
main > .bx.n5 > .m > .dot.d9 .txt {top:0; left:0;}
main > .bx.n5 > .m > .dot.d9:hover .txt {top:150%; left:150%;}

main > .bx.n5 > .m > .dot.d10 {top:78%; left:80%;}
main > .bx.n5 > .m > .dot.d10 .ln {transform:rotateZ(222deg);}
main > .bx.n5 > .m > .dot.d10:hover .ln {width:820%;}
main > .bx.n5 > .m > .dot.d10 .txt {bottom:0; right:0;}
main > .bx.n5 > .m > .dot.d10:hover .txt {bottom:650%; right:710%;}

main > .bx.n5 > .m > .dot.d11 {top:19%; left:83.5%;}
main > .bx.n5 > .m > .dot.d11 .ln {top:100%; transform:rotateZ(146deg);}
main > .bx.n5 > .m > .dot.d11:hover .ln {width:720%;}
main > .bx.n5 > .m > .dot.d11 .txt {top:0; right:0;}
main > .bx.n5 > .m > .dot.d11:hover .txt {top:500%; right:700%;}

main > .bx.n5 > .s {width:30%; float:left; position:relative;}
main > .bx.n5 > .s > input[type="radio"] {display:none; overflow:hidden;}
main > .bx.n5 > .s > .it {width:100%; opacity:0; transition:.3s; position:absolute; transform:scale(0); padding:1rem; border:1px solid #ddd;}
main > .bx.n5 > .s > input[type="radio"]:checked+.it {opacity:1; transform:scale(1);}
main > .bx.n5 > .s > .it > .ttl {color:#f3c16b;}
main > .bx.n5 > .s > .it > .txt.nm {font-size:1.3rem; margin:0;}
main > .bx.n5 > .s > .it > .txt.inf {padding:.5rem 0 0;}
main > .bx.n5 > .s > .it > img {width:100%;}
main > .bx.n5 > .s > .it.base > * {text-align:center;}

main > .bx.n6 img {border:1px solid #7770; transition:.3s;}
main > .bx.n6 img:hover {border:1px solid #777;}

/*-----PRODUCTION---[START]----------*/
#products .toggle {display:none;}
#products {width:100%; float:left; position:relative; padding-bottom:3rem;}

#crumbs {width:70%; margin:3rem auto 2rem; float:none;}
#crumbs.z1 {position:absolute; z-index:2; left:15%; top:0;}
#crumbs > * {text-transform:uppercase;}
#crumbs > b {color:#b0b0b0; font-weight:normal;}
#crumbs > a, #crumbs > span {color:#414143; font-size:.8rem; transition:.3s;}
#crumbs.z1 > a, #crumbs.z1 > span {color:#fff; text-shadow:0 0 3px #0007;}
#crumbs > a:hover {color:#f7ad44;}
/*#crumbs > span {color:#e38125;}*/

#products > .group {width:70%; margin:0 auto;}
#products > .group > .ttl {width:100%; border-bottom:2px solid; color:#414143; font-size:2.5rem;}
#products > .group > .its {display:flex; flex-flow:row wrap; justify-content:space-between; margin-top:3rem;}
#products > .group > .its > .it {background-color:#fff; padding:1rem; min-width:20%; margin:1rem 0.1rem; position:relative; overflow:hidden;}
#products > .group > .its > .it > .img {width:100%; height:4rem; background-repeat:no-repeat; background-size:contain; background-position:center; margin:0 0 1rem;}
#products > .group > .its > .it > .img_h {width:100%; height:100%; background-repeat:no-repeat; background-size:cover; background-position:center bottom; position:absolute; top:-100%; right:-100%; z-index:1; transition:.4s;}
#products > .group > .its > .it:hover > .img_h {top:0; right:0;}
#products > .group > .its > .it > .cnt {color:#777; text-transform:uppercase; font-size:.7rem; padding:0 .2rem;}
#products > .group > .its > .it > .nm {text-transform:uppercase; font-size:1.5rem; position:relative; z-index:2; padding:.2rem; display:table; white-space:nowrap; transition:.3s;}
#products > .group > .its > .it:hover > .nm {color:#fff; background-color:rgba(0,0,0,.7); margin-left:50%; transform:translatex(-50%);}
#products > .group > .its > .it > .ln {background-color:#e38125; position:absolute; left:0; bottom:0; z-index:2; transition:.3s;}
#products > .group > .its > .it > .ln.l1 {width:0; height:2px;}
#products > .group > .its > .it:hover > .ln.l1 {width:100%;}
#products > .group > .its > .it > .ln.l2 {width:2px; height:0;}
#products > .group > .its > .it:hover > .ln.l2 {height:100%;}

#products > .ctlg {width:70%; margin:0 auto;}

#products > .ctlg > .fltr {width:22%; float:left;}
#products > .ctlg > .fltr > .ttl {text-transform:uppercase; font-size:1.5rem; margin-bottom:2rem;}
#products > .ctlg > .fltr > .cnt .ttl {/*background:url('/media/images/site/icon/dd_b.svg') no-repeat center right 1rem / auto;*/ font-weight:bold; padding:1rem 0; text-transform:uppercase;}

#products > .ctlg > .fltr > .cnt > .rsz > .ttl {background:url('/media/images/site/icon/dd_b.svg') no-repeat center right 1rem / auto; cursor:pointer; display:block; transition:.3s;}
#products > .ctlg > .fltr > .cnt > .rsz > .ttl:hover {color:#e38125;}
#products > .ctlg > .fltr > .cnt > .rsz > .bx {height:0; overflow:hidden; transform:scaleY(0); transition:.3s;}
#products > .ctlg > .fltr > .cnt > .rsz > input:checked ~ .bx {height:auto; transform:scaleY(1);}

#products > .ctlg > .fltr > .cnt > .bx {margin:.5rem 0 1rem;}
#products > .ctlg > .fltr > .cnt > .bx > .inp.rng {width:45%; text-align:center; border:1px solid #aaa; border-radius:.3rem; display:inline-block; padding:.5rem .25rem;}
#products > .ctlg > .fltr > .cnt > .bx > .sep {width:10%; display:inline-block; text-align:center;}
#products > .ctlg > .fltr > .cnt > .bx > .jq_sld {width:90%; margin:1rem auto 0;}

#products > .ctlg > .fltr > .cnt > .btn.reset {width:100%; margin-top:3rem; text-align:center; border:1px solid #aaa; padding:.5rem; background-color:#fff; border-radius:.3rem; cursor:pointer; transition:.3s;}
#products > .ctlg > .fltr > .cnt > .btn.reset:hover {color:#dc1f27; border-color:#dc1f27;}

#products > .ctlg > .fltr > .cnt .bx.clr,
#products > .ctlg > .fltr > .cnt > .mat .inps {display:flex; flex-flow:row wrap; justify-content:space-between;}
#products > .ctlg > .fltr label {cursor:pointer;}
#products > .ctlg > .fltr label > input[type="checkbox"] {accent-color:#df7b1c; cursor:pointer;}

#products > .ctlg > .fltr > .cnt .bx.clr > label {width:22%; margin:.2rem .1rem; display:inherit; border:1px solid #ccc;}
#products > .ctlg > .fltr > .cnt .bx.clr > label > .img {width:100%; border:2px solid transparent; transition:.1s;}
#products > .ctlg > .fltr > .cnt .bx.clr > label > input:checked ~ .img {border-color:#e38125; animation:shaking 1s linear infinite;}

#products > .ctlg > .its {width:75%; margin-left:3%; float:left;}
#products > .ctlg > .its > .top {position:relative;}
#products > .ctlg > .its > .top > .ttl {text-transform:uppercase; font-size:3rem; line-height:3rem;}
#products > .ctlg > .its > .top > .sort {
	position:absolute; top:50%; right:0; transform:translateY(-50%); padding:.4rem 1.2rem .4rem .4rem;
	background-position:center right .5rem !important; background-color:transparent; border:1px solid #aaa; border-radius:.5rem;
}
#products > .ctlg > .its > .cnt {display:flex; flex-flow:row wrap; justify-content:space-between; transition:.5s;}
#products > .ctlg > .its > .cnt.hide {opacity:0;}
#products .set_its {display:flex; flex-flow:row wrap; justify-content:left; margin-top:5rem;}

#products .set_its > h3 {display:block; width:100%; font-size:1.3rem; text-transform:uppercase; border-bottom:3px solid #555;}

#products > .ctlg > .its > .cnt .it_wrap,
#products .set_its .it_wrap {width:32%; margin:.3rem; filter:drop-shadow(0 7px 2px rgba(0,0,0,.1)); position:relative; z-index:0; transition:.3s;}
#products .set_its .it_wrap {width:24%;}

#products > .ctlg > .its > .cnt .it_wrap:hover,
#products .set_its .it_wrap:hover {z-index:3;}

#products > .ctlg > .its > .cnt .it,
#products .set_its .it {width:100%; display:block; margin:.25rem; background-color:#fff; padding:.5rem; clip-path:polygon(0% 0%, 100% 0%, 100% 96.6%, 0px 100%); transform:scale(.85); transition:.3s;}

#products > .ctlg > .its > .cnt .it_wrap:hover > .it,
#products .set_its .it_wrap:hover > .it {transform:scale(1.05);}

#products > .ctlg > .its > .cnt .it > .nm,
#products .set_its .it > .nm {text-transform:uppercase;}

#products > .ctlg > .its > .cnt .it > .cot,
#products .set_its .it > .cot {}

#products > .ctlg > .its > .cnt .it > .cot > img,
#products .set_its .cnt .it > .cot > img {height:3rem; margin:.1rem; border:1px solid #eee;}

#products > .ctlg > .its > .cnt .it > .img,
#products .set_its .it > .img {width:100%;}

#products > .info {width:100%;}
#products > .info > .bg {width:100%; height:50vh; background-repeat:no-repeat; background-position:center; background-size:cover; background-color:#0009; background-blend-mode:hue; position:relative; transition:.75s;}
#products > .info > .toggle.bg1:checked + .bg > .txt {opacity:0; top:80%; transition:.4s;}
#products > .info > .bg > .txt {position:absolute; top:40%; left:15%; color:#fff; text-transform:uppercase; transition:.75s;}
#products > .info > .bg > .txt > * {width:100%; display:block;}
#products > .info > .bg > .txt > .gr {font-size:1.2rem; color:#ccc; margin-left:.4rem;}
#products > .info > .bg > .txt > .nm {font-size:3rem; line-height:3rem;}
#products > .info > .bg > .txt > .art {font-size:1.2rem; color:#ccc; line-height:1rem; margin-top:.5rem; margin-top:.25rem;}
#products > .info > .bg > .btn {padding:.75rem 3rem; color:#d9d9d9; border-radius:1rem 1rem 0 0; border:3px solid #ededed; display:inline-block; position:absolute; bottom:0; left:50%; transform:translate(-50%, 5%); text-transform:uppercase; cursor:pointer; transition:.3s;}
#products > .info > .bg > .btn:hover {padding:.75rem 7rem;}
#products > .info > .toggle.bg1:checked + .bg {height:calc(100vh - 5rem); background-color:#0005;}
#products > .info > .toggle.bg1:checked + .bg > .btn > .v1 {display:none;}
#products > .info > .toggle.bg1:not(:checked) + .bg > .btn > .v0 {display:none;}

#products > .info > .c {width:70%; margin:3rem auto 0; display:flex; flex-flow:row wrap; justify-content:space-between;}
#products > .info > .c > .img_wrap {width:45vh; min-height:40rem; background-color:#fff; position:relative; float:left; overflow:hidden;}
#products > .info > .c > .img_wrap > .img_bx {width:100%; height:100%; position:relative; z-index:1;}
#products > .info > .c > .img_wrap > .img_bx > img {width:90%; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); opacity:0; filter:blur(5px); z-index:1; transition:.5s;}
#products > .info > .c > .img_wrap > .img_bx > img.act {opacity:1; filter:blur(0); z-index:2; cursor:zoom-in;}
#products > .info > .c > .img_wrap > .dot_bx {position:absolute; z-index:3; bottom:.75rem; left:50%; transform:translateX(-50%);}
#products > .info > .c > .img_wrap > .dot_bx > .dot {width:.5rem; height:.5rem; margin:0 .5rem; padding:.25rem; background-color:#e1e1e1; border-radius:1rem; float:left; cursor:pointer; transition:.3s;}
#products > .info > .c > .img_wrap > .dot_bx > .dot:hover {background-color:#dc1f27;}
#products > .info > .c > .img_wrap > .dot_bx > .dot.act {padding:.25rem .5rem; background-color:#e38125;}
#products > .info > .c > .img_wrap > .btn {height:100%; position:absolute; z-index:2; top:0; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; font-size:2rem; cursor:pointer; transition:.15s;}
#products > .info > .c > .img_wrap > .btn.l {left:-5%; padding-right:15%; padding-left: 5%;}
#products > .info > .c > .img_wrap > .btn.r {right:-5%; padding-left:15%; padding-right:5%;}
#products > .info > .c > .img_wrap > .btn:hover {font-size:3rem; color:#e38125;}
	
#products > .info > .c > .dtl {width:calc(100% - 45vh - 3rem); float:right;}
#products > .info > .c > .dtl > .av {padding:1.5rem; padding-left:6rem; font-size:1.5rem; background:#fff none no-repeat left 1rem center / auto 4rem; text-transform:uppercase;}
#products > .info > .c > .dtl > .av.v1 {background-image:url(/media/images/site/av.svg);}
#products > .info > .c > .dtl > .av.v0 {background-image:url(/media/images/site/na.svg);}

#products > .info > .c > .dtl > .cot_ttl {border-bottom:1px solid; margin-top:2rem; font-size:1.2rem; text-transform:uppercase;}

#products > .info > .c > .dtl > .cot {display:flex; flex-flow:row wrap; justify-content:left;}
#products > .info > .c > .dtl > .cot > .it {text-align:center; margin:1rem 1rem 0;}
#products > .info > .c > .dtl > .cot > .it > img {border:1px solid #ccc; cursor:zoom-in;}
#products > .info > .c > .dtl > .cot > .it > .txt {display:block; text-transform:uppercase; font-size:.7rem;}

#products > .info > .c > .dtl > .bx {margin-top:1rem;}
#products > .info > .c > .dtl > .bx > .btns {width:100%; border-bottom:3px solid #ddd;}
#products > .info > .c > .dtl > .bx > .btns > .btn {padding:1rem 2rem 0 0; margin-bottom:-3px; display:inline-block; border-bottom:3px solid transparent; font-size:1.3rem; text-transform:uppercase; cursor:pointer; transition:.3s;}
#products > .info > .c > .dtl > .bx > .btns > .btn:hover {border-bottom-color:#aaa;}
#products > .info > .c > .dtl > .bx > .btns > .btn.act {border-bottom-color:#e38125;}

#products > .info > .c > .dtl > .bx > .toggle:not(:checked) + .bx {display:none;}	
#products > .info > .c > .dtl > .bx > .bx {margin-top:1rem;}
#products > .info > .c > .dtl > .bx > .spec {width:100%; text-transform:uppercase;}
#products > .info > .c > .dtl > .bx > .spec > .it {width:100%; padding:.5rem 1rem;}
#products > .info > .c > .dtl > .bx > .spec > .it:nth-child(odd/*even*/) {background-color:#fff;}
#products > .info > .c > .dtl > .bx > .spec > .it > span {width:50%; display:inline-block;}
#products > .info > .c > .dtl > .bx > .spec > .it > .nm {font-weight:bold;}
#products > .info > .c > .dtl > .bx > .spec > .it > .val {}
#products > .info > .c > .dtl > .bx > .spec > .it > .val > .unit {text-transform:lowercase;}

#products > .info > .c > .prc {margin-top:3rem; margin-left:auto; border-top:2px solid #e38125; padding-left:7rem; position:relative;}
#products > .info > .c > .prc > .txt {font-size:1.25rem;}
#products > .info > .c > .prc > .val {font-size:3rem;}
#products > .info > .c > .prc > .cur {font-size:2rem;}

#products .its_not_found {position:fixed; font-size:1.5rem; text-align:center; margin-top:10rem; transform:translateX(50%) translateZ(0); -webkit-transform:translateX(50%) translateZ(0); -webkit-backface-visibility:hidden; color:#acacac;}

/*-----APP---[START]----------*/

main > .app {width:max-content; min-height:100vh; float:left; overflow-x:hidden;}
main > .app > h2, main > .app .head, main > .app .body {width:100%;}
main > .app > h2 {font-size:1.3rem; padding:1rem 0 0 1rem; text-transform:uppercase;}

#zkz_tree {width:30%; height:3rem; margin-left:50%; transform:translateX(-50%); position:absolute; display:flex; flex-flow:row wrap; justify-content:space-between;}

#zkz_tree > .pos {width:1rem; height:1rem; border-radius:.3rem; background-color:#d9d9d9; transform:scale(.75); position:relative; transition:.3s;}
#zkz_tree > .pos.rdy {background-color:#6f6f6f;}
#zkz_tree > .pos.now {background-color:#e38125; transform:scale(1.2);}

#zkz_tree > .pos > .txt {display:none; width:max-content; position:absolute; left:50%; bottom:0; transform:translate3d(-50%, 150%, 0); font-size:.75rem;}
#zkz_tree > .pos.now > .txt {display:block;}

#zkz_tree > .spc {flex-grow:1; height:.1rem; margin:calc(.5rem - .05rem) .7rem 0; background-color:#ececec;}/*border-bottom:2px solid #ececec; height:calc(.5rem + 1px); margin:0 .7rem;*/
#zkz_tree > .spc.rdy {background-color:#6f6f6f;}

main > .app .head {padding:0 2.5rem; position:relative; margin-top:2rem;}
main > .app .head > .ttl {width:fit-content; font-size:1rem; text-align:center; position:absolute; left:0; top:-2rem; color:#444; text-transform:uppercase; border-bottom:2px solid #444; margin:0 auto; right:0; padding:0 1rem;}
main > .app .head > .menu {}
main > .app .menu > .sel, main > .app .menu > .txt, #ovrl .sel {max-width:100%; border:1px solid #ddd; background:#fff; padding:.5rem 2.5rem 0.5rem 1rem; transition:.3s;}
main > .app .menu > .sel.hide, main > .app .menu > .txt.hide {max-width:0%; padding:.5rem 0; border:1px solid transparent; transition:none; pointer-events:none;}

main > .app .menu .gr_lbl {cursor:pointer;}
main > .app .menu > .gr_lbl ~ .gr_lbl {margin:0 1rem 0 2rem;}
main > .app .menu > .gr_lbl > span {display:inline-block; transition:.2s; color:#ccc;}
main > .app .menu > .gr_lbl:hover > span {color:#e38125;}

main > .app .menu .sel[type="radio"] {display:none;}
main > .app .menu .sel[type="radio"]:checked+span {color:#e38125; font-size:1.2rem;}

main > .app .menu .os_bck {background-color:#a2a2a2; padding:.3rem 1rem; float:right; border-radius:.1rem; cursor:pointer;}

main > .app .body > .gr_it {width:15rem; height:25rem; cursor:pointer; margin:7rem .35rem 0; transition:.3s;}
main > .app .body > .gr_it > .img {width:100%; height:80%; background-repeat:no-repeat; background-position:center; background-size:auto 70%; border:1px solid #eee; transition:.25s;}
main > .app .body > .gr_it:hover > .img {background-size:auto 80%; border:1px solid #acacac;}
main > .app .body > .gr_it > .txt {width:100%; height:20%; text-align:center; padding-top:1rem; text-transform:uppercase;}

main > .app > .dcr {display:none; float:left;}

main > .app .no_el {text-align:center; padding:5rem;}

main > .app > .gr {width:99vw; max-height:999vh; float:left; transition:1s; margin-left:0%; padding:2rem; background:url('/media/images/site/icon/ang_tl.svg') no-repeat top 1rem left 1rem / auto, url('/media/images/site/icon/ang_tr.svg') no-repeat top 1rem right 1rem / auto, url('/media/images/site/icon/ang_br.svg') no-repeat bottom 1rem right 1rem / auto, url('/media/images/site/icon/ang_bl.svg') no-repeat bottom 1rem left 1rem / auto;}
main > .app > .gr.prev {margin-left:-100vw; opacity:0; max-height:0; overflow:hidden; pointer-events:none;}
main > .app > .gr > .nswr {display:none;}
main > .app .body {display:flex; flex-flow:row wrap; justify-content:left/*space-between*/; align-items:center; padding:2rem;}
/*main > .app .body::after {content:""; flex:auto;}*/
main > .app .it {display:block; margin:0.5rem; cursor:pointer; position:relative; transition:.3s;}
main > .app .it.mn_hide, main > .app .it.sb_hide, main > .app .it.sr_hide {position:absolute; opacity:0; top:0; left:0; transform:scale(0); transition:none;}
main > .app .it > .img {width:10vw; height:13.35vw; border:1px solid #e3e3e3; background-repeat:no-repeat; background-position:center; background-size:contain;}
main > .app .it.none::after {content:"+"; position:absolute; top:50%; left:50%; font-size:5rem; transform:rotate(45deg) translate(-100%, -18%); color:#b7b7b7;}
main > .app .it.none > .img {background-color:#fff;}

main > .app .it > .img > .txt {width:100%; color:#fff; background-color:#0003; padding:.3rem; line-height:.9rem;}
main > .app .it > .img > .txt > span {width:100%; display:block;}
main > .app .it > .img > .txt > .cd {text-transform:uppercase;}
main > .app .it > .img > .txt > .nm {font-size:.8rem;}

main > .app .it > .tag {display:none;}

main > .app .xgr_ttl {width:100%; line-height:1.5rem; font-size:1.5rem; text-transform:uppercase; margin-top:1rem; text-align:center; border-bottom:2px solid #ea8484; margin-bottom:2rem; position:relative;}
main > .app .xgr_ttl > .qu {font-size:1rem; line-height:1rem; color:#e35e5e; position:absolute; bottom:-.55rem; background-color:#fff; margin-left:1rem; border-left:2px solid #ea8484; border-right:2px solid #ea8484; padding:0 .2rem; cursor:help;}

main > .app .z_it {width:100%; max-height:999vh; border-bottom:1px dashed #ddd; padding-bottom:2rem; margin-bottom:2rem; transition:.5s;}
main > .app .z_it.hide {max-height:0; transform:scale(0); opacity:0; filter:blur(20px); overflow:hidden; margin:0; padding:0; border:0;}
main > .app .z_it > .dtl {width:calc(50% - 15rem); min-height:6rem; float:left; margin-left:2%; display:flex; flex-flow:row wrap; justify-content:space-between;}
main > .app .z_it > .inf {width:46%; min-height:15rem; float:right; margin-left:2%; border:1px solid #ddd; padding:.5rem 1rem; display:flex; flex-flow:column wrap; justify-content:space-evenly; align-items:center;}
main > .app .z_it > .inf > .brk {width:100%; display:flex; flex-flow:row; justify-content:space-around;}

main > .app .z_it input.txt, main > .app .z_it input.nmb, main > .app .z_it select {border:1px solid #ddd; padding:.5rem 1rem; background-color:#fff;}
main > .app .z_it label.h, main > .app .z_it input.nmb.qu, main > .app .z_it select {width:100%;}

main > .app .z_it label.h {width:49%; float:left;}
main > .app .z_it label.w {width:49%; float:right;}
main > .app .z_it label > .er_txt {width:100%; color:red; font-size:.7rem;}

main > .app .z_it input.nmb {width:100%;}

main > .app .z_it > .pos {width:fit-content; font-weight:bold; color:#444; padding:0 .2rem; border-radius:.2rem; text-align:center;}

main > .app .z_it .img_gr {width:15rem; min-height:15rem; float:left;}
main > .app .z_it .img_gr img {width:5rem; padding:.1rem;}
main > .app .z_it .img_gr img.mlf {width:10rem;}
main > .app .z_it .img_gr img.clr {width:calc(100% - .1rem); height:calc(100% - .1rem); border:1px solid #0003; padding:0; margin:.1rem 0 0 .1rem;}
main > .app .z_it .img_gr .img_wrap.txr {width:5rem; height:5rem; float:right; overflow:hidden; position:relative; margin:0 0 0.4rem 0; transition:.15s;}
main > .app .z_it .img_gr .img_wrap.txr > .vctr {width:1rem; height:2rem; margin:.3rem 0 0 .3rem; background:url(/media/images/site/dbl_arrow.svg) no-repeat center / contain; opacity:.5; position:absolute; z-index:3; transition:inherit;}
main > .app .z_it .img_gr .img_wrap.txr > img {transition:inherit;}
main > .app .z_it .img_gr .img_wrap.txr.hrzl {width:4.8rem; height:5rem; margin-right:.1rem;}
main > .app .z_it .img_gr .img_wrap.txr.hrzl > .vctr {margin:-.2rem 0 0 .7rem; transform:rotateZ(90deg); -webkit-transform:rotateZ(90deg) translateZ(0);}
main > .app .z_it .img_gr .img_wrap.txr.hrzl > img {transform:rotateZ(90deg) translateX(-15%); -webkit-transform:rotateZ(90deg) translateX(-15%) translateZ(0);}

main > .app .z_it .z_gr {width:100%;}
main > .app .z_it .z_gr:first-child p {margin:0;}
main > .app .z_it .z_gr:not(:first-child) p {margin:1rem 0 0 0;}

main > .app .btns {width:100%; margin-top:1rem; float:left; display:flex;}
main > .app .btns.all {padding-bottom:2rem;}
main > .app .btns.one, main > .app .btns.all {flex-flow:row wrap; justify-content:left;}
main > .app .btns.all .btn {min-width:20%; /*margin:0;*/}
main > .app .btn {color:#555; display:inline-block; padding:.5rem 2rem; text-align:center; cursor:pointer; transition:.5s; background:linear-gradient(270deg, #fff 20%, #f7ad44 40%, #f7ad44 60%, #fff 80%); border-radius:.25rem; background-size:450% 1px; background-position:-5%; margin:0 1rem 0 0; border:1px solid #ddd;}
main > .app .btn.calc {margin-left:auto;}
main > .app .btn.start {margin:0 auto 10rem; display:block; width:50%;}
main > .app .btn.file {margin-left:auto;}
main > .app .btn:hover {background-position:-78.5%; color:#fff; border-color:#fff;}

main > .app .btns.all.base {position:fixed; bottom:0; left:0; margin:0; justify-content:center; background-color:#0007; padding:1rem 0; z-index:3; -webkit-transform:translateZ(0);	-webkit-backface-visibility:hidden;}
main > .app .btns.all.base > .btn.calc {margin:0;}

/*-----APP---[END]----------*/

main > .txt_c {text-align:center; margin:3rem 0;}
main > .txt_c > h2 {font-size:2rem;}
main > .txt_c > p {font-size:1.2rem;}

/*-----CONTACTS PAGE---[START]----------*/
#cnt {width:90%; margin:2rem auto 0;}
#cnt > .bx {width:100%; float:left;}

#cnt > .bx > .ttl {width:100%; font-size:2rem; font-weight:bold; text-transform:uppercase; display:none;}
#cnt > .bx:first-child > .ttl {margin:0 0 2rem 0;}
#cnt > .bx:not(:first-child) > .ttl {margin:4rem 0 2rem 0;}

#cnt > .bx > .gr {display:flex; flex-flow:row wrap; justify-content:space-between;}
#cnt > .bx:first-child > .gr {margin-top:0;}
#cnt > .bx > .gr > .its {padding:2rem; border:1px solid #dfdfdf;}
#cnt > .bx > .gr > .its > .it:not(:first-child) {margin-top:3rem;}
#cnt > .bx > .gr > .its .img {width:3rem; height:3rem; mask-position:center left; mask-repeat:no-repeat; mask-size:contain; -webkit-mask-position:center left; -webkit-mask-repeat:no-repeat; -webkit-mask-size:contain; background-color:#e38125; float:left;}
	#cnt > .bx > .gr > .its > .adr > .img {mask-image:url(/media/images/site/icon/address.svg); -webkit-mask-image:url(/media/images/site/icon/address.svg);}
	#cnt > .bx > .gr > .its > .scd > .img {mask-image:url(/media/images/site/icon/schedule.svg); -webkit-mask-image:url(/media/images/site/icon/schedule.svg);}
	#cnt > .bx > .gr > .its > .phn > .img {mask-image:url(/media/images/site/icon/phones.svg); -webkit-mask-image:url(/media/images/site/icon/phones.svg);}
	#cnt > .bx > .gr > .its > .eml > .img {mask-image:url(/media/images/site/icon/email.svg); -webkit-mask-image:url(/media/images/site/icon/email.svg);}
	#cnt > .bx > .gr > .its > .scl > .img {mask-image:url(/media/images/site/icon/social.svg); -webkit-mask-image:url(/media/images/site/icon/social.svg);}
	#cnt > .bx > .gr > .its > .req > .img {mask-image:url(/media/images/site/icon/requisites.svg); -webkit-mask-image:url(/media/images/site/icon/requisites.svg);}
#cnt > .bx > .gr > .its .ttl {font-size:1.2rem; margin:0 0 0 4rem; line-height:3rem; border-bottom:1px solid #eee;}
#cnt > .bx > .gr > .its .txt {font-size:1.2rem; margin-top:1rem;}
#cnt > .bx > .gr > .its > .it.scd .txt > span {display:inline-block; width:50%;}

#cnt > .bx > .gr > .its > .it.req .txt {font-size:1rem;}
#cnt > .bx > .gr > .its > .it.req .txt > .r {width:100%; margin-top:.3rem; float:left;}
#cnt > .bx > .gr > .its > .it.req .txt > .r > .nm {/*color:#dc1f27; */font-weight:bold; float:left;}
#cnt > .bx > .gr > .its > .it.req .txt > .r > .val {padding-left:.3rem; float:left;}
#cnt > .bx > .gr > .its > .it.req .copy_txt {width:50%; text-align:center; background-color:#7d7d7d; color:#eee; padding:.5rem; margin:3rem 25% 0; float:left; cursor:pointer; transition:.3s;}
#cnt > .bx > .gr > .its > .it.req .copy_txt:hover {background-color:#444;}
#cnt > .bx > .gr > .its > .it.req .copy_txt.act {background-color:#e38125;}

#cnt > .bx > .gr > .its .txt > .sc {width:100%; margin-top:.5rem;}
#cnt > .bx > .gr > .its .txt > .sc > a {width:2rem; height:2rem; display:inline-block; background-color:transparent; background-repeat:no-repeat; background-position:left; background-size:contain; margin-right:1rem; transition:.2s;}
#cnt > .bx > .gr > .its .txt > .sc > a:hover {transform:scale(1.3);}

#cnt > .bx > .gr.cnt > .its {width:32%;}
#cnt > .bx > .gr.prtr > .its {}

#cnt > .bx > .gr.mlmp {margin:2rem 0; border:1px solid #dfdfdf;}

#cnt > .bx > .gr.mlmp > .ml {width:30%; overflow:hidden; padding:3rem;}
#cnt > .bx > .gr.mlmp > .ml > .ttl {text-transform:uppercase; padding:.9rem 0 .9rem 4rem; font-size:1.2rem; background:transparent url(/media/images/site/icon/mail2us.svg) no-repeat center left / 3rem auto;}

#cnt > .bx > .gr.mlmp > .ml > form > input[type="text"],
#cnt > .bx > .gr.mlmp > .ml > form > textarea {width:100%; padding:1rem; border-radius:.5rem; background-color:#f6f6f6; border:none; font-size:.9rem; color:#2f2f2f;}
#cnt > .bx > .gr.mlmp > .ml > form > input[type="text"]:first-child {margin-top:1rem;}
#cnt > .bx > .gr.mlmp > .ml > form > input[type="text"]:not(:first-child),
#cnt > .bx > .gr.mlmp > .ml > form > textarea {margin-top:.5rem;}
#cnt > .bx > .gr.mlmp > .ml > form > textarea {min-height:7rem;}
#cnt > .bx > .gr.mlmp > .ml > form > .agmt {margin:1rem 0;}
#cnt > .bx > .gr.mlmp > .ml > form > .agmt > .cbx {accent-color:#333; cursor:pointer;}
#cnt > .bx > .gr.mlmp > .ml > form > .agmt > .txt {color:#8c8c8c; font-size:.8rem;}
#cnt > .bx > .gr.mlmp > .ml > form > .agmt > .txt > .x {color:#333; text-decoration:underline;}
#cnt > .bx > .gr.mlmp > .ml > form > input[type="submit"] {background-color:#333; color:#fff; line-height:4rem; width:100%; text-align:center; border-radius:.5rem; font-size:1rem; cursor:pointer; transition:.2s;}
#cnt > .bx > .gr.mlmp > .ml > form > input[type="submit"]:hover {transform:scale(1.05);}

#cnt > .bx > .gr.mlmp > .mp {width:70%; overflow:hidden;}

#cnt > .bx > .vrtl {overflow:hidden; border-radius:1rem;}

#cnt > .bx > .prtr {width:100%; position:relative; margin-bottom:3rem;}

#cnt > .bx > .prtr > .hider {width:100%; overflow:hidden;}
#cnt > .bx > .prtr > .hider > .its {width:max-content; height:8rem; margin-left:0; transition:1s ease-out;}
#cnt > .bx > .prtr > .hider > .its.moving {transition:0s !important;}
#cnt > .bx > .prtr > .hider > .its > .it {width:10vw; height:100%; float:left; background-color:#fff; border-radius:1rem; background-position:center; background-repeat:no-repeat; background-size:8rem auto; transition:.2s;}
#cnt > .bx > .prtr > .hider > .its > .it:hover {transform:scale(.9);}
#cnt > .bx > .prtr > .hider > .its > .it:first-child {margin:0 1rem 0 0;}
#cnt > .bx > .prtr > .hider > .its > .it:not(:first-child):not(:last-child) {margin:0 1rem;}
#cnt > .bx > .prtr > .hider > .its > .it:last-child {margin:0 0 0 1rem;}

#cnt > .bx > .prtr > .ghost {position:absolute; width:100%; height:100%; background:linear-gradient(90deg, #f6f6f6 0%, transparent 10%), linear-gradient(270deg, #f6f6f6 0%, transparent 10%); top:0; z-index:2;}

#cnt > .bx > .prtr > .arw {width:3rem; height:3rem; position:absolute; z-index:3; top:calc(50% - 1.5rem); transition:.2s; background-color:#fff; cursor:pointer; border-radius:50%; box-shadow:3px 3px 5px 0 rgba(0,0,0,.1); background-position:center; background-repeat:no-repeat; background-size:1.5rem;}
#cnt > .bx > .prtr > .arw:hover {transform:scale(1.3);}
#cnt > .bx > .prtr > .arw.l {left:-1.5rem; background-image:url(/media/images/site/v2/c_arw_l.svg);}
#cnt > .bx > .prtr > .arw.r {right:-1.5rem; background-image:url(/media/images/site/v2/c_arw_r.svg);}
/*-----CONTACTS PAGE---[END]----------*/

/*---------------------------------FOOTER-----------------------------------*/
footer {background-color:#34393f; padding:5rem 1rem 2rem; box-shadow:inset 0 3rem 1em -1rem rgba(0,0,0,.1);}
footer a, footer span {color:#959595; transition:.2s;}
footer a:hover {color:#fff !important;}

footer > .gr {width:33%; float:left;}
footer > .gr > .fmn {display:flex; flex-flow:column wrap; width:min-content; margin:0 auto;}
footer > .gr > .fmn > a {width:max-content; margin:.5rem 0;}
footer > .gr > .fmn > div {width:max-content;}
footer > .gr > .fmn > div {margin:0 0 1rem;}
footer > .gr > .fmn > div.sc {margin:0;}
footer > .gr > .fmn > div.sc > a {width:1rem; height:1rem; display:block; float:left; margin:0 1rem 0 0; transition:.2s; background-color:#959595; mask-repeat:no-repeat; mask-size:contain; mask-position:center; -webkit-mask-repeat:no-repeat; -webkit-mask-size:contain; -webkit-mask-position:center;}
footer > .gr > .fmn > div.sc > a:hover {background-color:#fff;}
footer > .copyrights {width:100%; color:#959595; text-align:center; margin-top:2rem; padding-top:2rem; border-top:1px solid #fff1; float:left;}
footer > .copyrights > span {}
footer > .copyrights > span > b {color:#e38125;}/*#ffa03d #ffa70f*/
footer > .copyrights > span > b > i {color:#d91f26; font-size:.9rem;}
/* ______________________________________________ ANIMATION _____________________________________________ */
.blink {
    -webkit-animation-name: blinker;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;

    -moz-animation-name: blinker;
    -moz-animation-duration: 1s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
}

@keyframes glow {  
    0% { opacity:1.0; }
    50% { opacity:.7; }
    100% { opacity:1.0; }
}

@-moz-keyframes blink {  
    0% { opacity:1.0; }
    50% { opacity:0.0; }
    100% { opacity:1.0; }
}

@-webkit-keyframes blink {  
    0% { opacity:1.0; }
    50% { opacity:0.0; }
    100% { opacity:1.0; }
}

@keyframes slide_anim_1 {
	0% {left:45%;}
	100% {left:50%;}
}

@keyframes slide_anim_2 {
	0% {left:50%;}
	100% {left:45%;}
}

@keyframes slide_anim_3 {
	0% {left:10%;}
	100% {left:15%;}
}

@keyframes slide_anim_4 {
	0% {left:10%;}
	100% {left:20%;}
}

@keyframes slide_anim_5 {
	0% {left:40%;}
	100% {left:55%;}
}

@keyframes slide_anim_6 {
	0% {left:52%;}
	100% {left:47%;}
}

@keyframes anm1 {
	0% {transform:scale(1);}
	30% {transform:scale(1.2);}
	70% {transform:scale(1);}
	100% {transform:scale(1);}
}

@keyframes anm2 {
	0% {opacity:0;}
	30% {opacity:0; transform:scale(1.2);}
	31% {opacity:1; transform:scale(1.2);}
	100% {opacity:0; transform:scale(1.8);}
}

@keyframes rotate {
	0% {transform:translate(-50%, -50%) rotateZ(0deg);}
	100% {transform:translate(-50%, -50%) rotateZ(360deg);}
}

@keyframes shaking {
	0% {transform:rotateZ(0deg);}
	25% {transform:rotateZ(-1deg);}
	50% {transform:rotateZ(0deg);}
	75% {transform:rotateZ(1deg);}
	100% {transform:rotateZ(0deg);}
}