@import url('https://fonts.googleapis.com/css2?family=Exo+2:wght@300;600;800&display=swap'); 
body{position:relative;margin:0;padding:0;background:#e7e7e7;font-family:'Exo 2';} body:after{position:absolute;content:"";background:url(/system/img/noise.gif);left:0;right:0;top:0;bottom:0;opacity:.065;pointer-events:none;z-index:101;} html{scroll-behavior:smooth;user-select:none;} a, a:hover{text-decoration:none;border-bottom:none;display:contents;color:inherit;} textarea, input, button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;transition:all .5s;} textarea:focus, input:focus, button:focus{outline:none;} .container{position:relative;margin:0 auto;max-width:1350px;}

.fade_up{opacity:0;transform:translateY(50px);transition:all 1s;} .fade_up.show{opacity:1;transform:translateY(0);}

@media(pointer: fine){ #cursor{position:fixed;transition:transform .1s;will-change:transform;border:2px solid #fff;border-radius:100%;width:25px;height:25px;z-index:102;mix-blend-mode:difference;pointer-events:none;} }

#preloader{position:fixed;left:50%;top:50%;transform:translate(-50%, -50%);background:#222;width:150vmax;height:150vmax;border-radius:50%;z-index:100;transition:transform 1.2s cubic-bezier(.77,0,.18,1);pointer-events:none;} #preloader .load{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:calc(100vw - 40px);max-width:1310px;height:5.5px;background:#555;} #preloader .load div{position:absolute;top:0;bottom:0;width:0;background:#fff;} #preloader .load strong{position:absolute;top:20px;right:-5px;color:#a5de3c;font-size:35px;}

#menu{position:fixed;height:55px;width:100%;z-index:10;display: flex;
    align-items: center;
    justify-content: space-between;}
#menu .logo{position:relative;margin:12.5px 20px;}
#menu .logo span{font-size:25px;color:#111;letter-spacing:-1.5px;font-weight:800;}
#menu .logo span:before{content:"A";position:absolute;color:#111;animation:noise 2.5s infinite;z-index:1;}
#menu .pm{position:relative;margin:0 20px;height:55px;line-height:55px;}

#main{position:relative;width:100%;height:100vh;display:flex;align-items:center;} #main video{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;z-index:-1;pointer-events:none;} #main .ttl{margin:50px 20px 0;text-align:center;} #main .ttl small{display:block;margin-bottom:15px;} #main .ttl h1{color:#111;font-size:80px;margin:0;} #main .ttl span{display:block;margin-top:25px;} @media screen and (max-width:700px){ #main .ttl h1{font-size:45px;} #main video{top:50%;}}








#marque{position:relative;padding:25px 0 15px;white-space:nowrap;overflow:hidden;} #marque span{font-family:'DINNextCYR-Bold';font-size:65px;color:transparent;text-transform:uppercase;-webkit-text-stroke-width:1.5px;-webkit-text-stroke-color:#ddd;}

#what{position:relative;width:100%;background:#fff;overflow:hidden;}
#what .row{position:relative;display:flex;flex-wrap:wrap;justify-content:flex-end;margin:80px 20px;}
#what .row .img{position:absolute;display:inline-block;left:0;width:50%;height:100%;}
#what .row .img:before{position:absolute;content:"";top:0;bottom:0;left:0;width:30%;border:65px solid rgba(0,0,0,.075);box-shadow:inset 0 0 0 10px rgba(0,0,0,.125);} #what .row .img img{position:relative;width:100%;height:100%;object-fit:contain;}
#what .row .txt{display:inline-block;width:50%;text-align:justify;} #what .row .txt span{font-family:'DINNextCYR-Light';font-size:17.5px;color:#222;}
#what .row .txt ul{position:relative;list-style:none;margin:25px 0 0 -10px;padding:0 0 0 35px;}
#what .row .txt ul li{margin-bottom:10px;font-family:'DINNextCYR-Light';color:#222;font-size:17.5px;}
#what .row .txt ul li:before{content:"-";position:absolute;color:#222;left:10px;}

@media screen and (max-width:800px){#what .row .img{display:none;}#what .row .txt{width:100%;}#what .row{margin-bottom:60px;}}

#whom, #why{position:relative;width:100%;background:#222;background:linear-gradient(150deg, #222 50%, #111 100%);overflow:hidden;}
#whom .colums, #why .colums{display:flex;flex-wrap:wrap;margin:70px 10px 95px;}
#whom .colums .col, #why .colums .col{position:relative;background:#fff;margin:10px;padding:35px 20px 20px;box-shadow:0 5px 15px 0 rgba(0,0,0,.5);width:calc(25% - 60px);overflow:hidden;}
#whom .colums .col:before, #why .colums .col:before{position:absolute;content:"";top:-40px;right:-40px;width:50px;height:50px;background:#FFD700;border-radius:100%;border:25px solid #ddd;animation:shadow 5s linear infinite;}
#whom .colums .col strong, #why .colums .col strong{position:relative;display:block;margin-bottom:15px;font-family:'DINNextCYR-Bold';font-size:18.5px;color:#222;z-index:1;}
#whom .colums .col span, #why .colums .col span{position:relative;font-family:'DINNextCYR-Light';font-size:17.5px;color:#222;z-index:1;}

@media screen and (max-width:950px){#whom .colums .col, #why .colums .col{width:calc(50% - 60px);}}
@media screen and (max-width:550px){#whom .colums .col, #why .colums .col{width:calc(100% - 60px);}}

#work{position:relative;width:100%;background:#fff;overflow:hidden;}
#work .colums{display:flex;flex-wrap:wrap;margin:70px 17.5px 40px;}
#work .colums .col{position:relative;display:inline-flex;margin:2.5px;width:calc(33.3333% - 5px);background:#222;background:linear-gradient(150deg,#222 0%,#000 100%);overflow:hidden;}
#work .colums .col img, #work .colums .col video{position:relative;margin:-5px;width:calc(100% + 10px);transition:all .3s;}
#work .colums .col:hover img, #work .colums .col:hover video{opacity:.25;transform:scale(1.1);filter:blur(2px);}
#work .colums .col .wraper{position:absolute;top:15px;left:15px;bottom:15px;right:15px;border:1.75px solid #fff;opacity:0;padding:25px;transition:all .3s;}
#work .colums .col:hover .wraper{opacity:1;}
#work .colums .col .wraper strong{display:block;font-family:'DINNextCYR-Bold';color:#fff;font-size:22.5px;}
#work .colums .col .wraper hr{width:25px;margin:10px 0 15px;height:3px;border:0;background:#fff;transition:all .3s;}
#work .colums .col .wraper span{font-family:'DINNextCYR-Light';font-size:17.5px;color:#fff;}
#work .colums .col .wraper .btn{position:absolute;display:block;right:20px;bottom:0;padding:5px 15px 7.5px;background:#fff;box-shadow:inset 0 -2.5px rgba(0,0,0,.15), 0 2.5px 15px rgba(0,0,0,.125);border-radius:5px;color:#222;font-family:'DINNextCYR-Light';font-size:15.5px;opacity:0;transition:all .3s;}
#work .colums .col:hover .wraper .btn{opacity:1;bottom:20px;}
#work .txt{display:inline-block;margin:15px 20px 65px;width:calc(100% - 350px);text-align:justify;font-family:'DINNextCYR-Light';font-size:18.5px;color:#222;}
#work .button{position:relative;display:block;margin:15px 20px;float:right;background:#FFD700;box-shadow:inset 0 -2.5px rgba(0,0,0,.15), 0 2.5px 15px rgba(0,0,0,.125);width:255px;height:45px;line-height:45px;border-radius:5px;transition:all .5s;text-align:center;color:#222;font-family:'DINNextCYR-Light';font-size:16.5px;overflow:hidden;} #work .button:hover{background:#ffff00;}
#work .button:before{position:absolute;content:"";background:rgba(255,255,255,.15);top:-25%;bottom:-25%;width:25px;transform:rotate(30deg);animation:blick 2.5s infinite ease;}

@media screen and (max-width:950px){#work .colums .col{width:calc(50% - 5px);}#work .txt{width:calc(100% - 40px);}#work .button{margin:-35px 20px 50px;}}
@media screen and (max-width:700px){#work .colums .col{width:calc(100% - 5px);}}

#form{position:relative;width:100%;background:#222;background:linear-gradient(150deg, #222 50%, #111 100%);overflow:hidden;}
#form .row{position:relative;display:flex;flex-wrap:wrap;margin-bottom:95px;}
#form .row .img{position:absolute;right:20px;width:calc(50% - 40px);height:100%;}
#form .row .img:before{position:absolute;content:"";top:0;bottom:0;right:0;width:30%;border:65px solid rgba(255,255,255,.05);box-shadow:inset 0 0 0 10px rgba(0,0,0,.085);} #form .row .img img{position:relative;left:50px;width:100%;height:100%;object-fit:contain;opacity:0;transition:all 1s;}
#form .row .txt{display:inline-block;margin:0 20px;width:calc(50% - 40px);}
#form .row .txt strong{display:block;margin-bottom:7.5px;font-family:'DINNextCYR-Bold';color:#fff;font-size:25px;}
#form .row .txt span{font-family:'DINNextCYR-Light';font-size:17.5px;color:#fff;}
#form .row .txt ul{position:relative;list-style:none;margin:25px 0 0 -10px;padding:0 0 0 35px;}
#form .row .txt ul li{margin-bottom:5px;font-family:'DINNextCYR-Light';font-size:17.5px;color:#fff;}
#form .row .txt ul li:before{content:"-";position:absolute;color:#ffd700;left:10px;}
#form .row .txt hr{height:1px;border:0;background:#ffd700;}
#form .row .txt .com{position:relative;display:block;margin:50px 0 0;border-radius:5px;box-shadow:0 2px #f1a003, 0 3px 5px 0 rgba(0, 0, 0, 0.5);width:calc(100% - 40px);background:#ffd700;text-align:justify;padding:25px 20px;font-family:'DINNextCYR-Light';color:#222;font-size:17px;}
#form .row .txt .com:before{position:absolute;content:"";left:25px;top:-12.5px;border-top:12.5px solid transparent;border-right:20px solid #ffd700;}
#form .row .txt .com:after{content:"///";position:absolute;right:20px;top:-17.5px;height:25px;overflow:hidden;font-size:35px;color:#fff;font-family:'DINNextCYR-Bold';}
#form .tabs{display:table;width:calc(100% - 20px);margin:0 10px 35px;}
#form .tabs div{display:table-cell;padding:10px;text-align:center;color:#aaa;font-family:'DINNextCYR-Light';font-size:17px;transition:all .5s;cursor:pointer;}
#form .tabs div.active, #form .tabs div:hover{color:#ffd700;font-weight:800;}
#form .tabs div:first-child{text-align:left;} #form .tabs div:last-child{text-align:right;}

@media screen and (max-width:800px){#form .row .txt{width:calc(100% - 40px);}#form .row .img{display:none;}#form .tabs div{display:inline-block;font-size:15px;}}
@media screen and (max-width:700px){#form .row .txt strong{font-size:26px;}}

#how{position:relative;width:100%;background:#fff;overflow:hidden;}
#how .colums{display:flex;flex-wrap:wrap;margin:-25px 10px 75px;}
#how .colums .col{position:relative;display:inline-block;margin:75px 10px 0;width:calc(25% - 20px);text-align:justify;vertical-align:top;}
#how .colums .col:before{position:absolute;content:attr(data-text);left:-10px;top:-15px;color:#FFD700;font-family:'DINNextCYR-Bold';font-size:27.5px;transform:rotate(-90deg);} #how .colums .col strong{display:block;margin:0 30px 10px;font-family:'DINNextCYR-Bold';color:#555;font-size:17.5px;}
#how .colums .col span{font-family:'DINNextCYR-Light';color:#222;font-size:16.5px;}

@media screen and (max-width:900px){#how .colums .col{width:calc(50% - 20px);margin:80px 10px 0;}}
@media screen and (max-width:550px){#how .colums .col{width:calc(100% - 20px);margin:60px 10px 0;}}

#review{position:relative;width:100%;background:#222;background:linear-gradient(150deg, #222 50%, #111 100%);overflow:hidden;}
#review .items{display:flex;margin:50px 10px 65px;scroll-behavior:smooth;scroll-snap-type:x mandatory;will-change:scroll-position;overflow:auto;scrollbar-width:none;-ms-overflow-style:none;} #review .items::-webkit-scrollbar{display:none;height:0;} #review .items::-moz-scrollbar{display:none;height:0;}
#review .items .item{position:relative;flex-shrink:0;margin:95px 10px 45px;padding:20px 20px 75px;background:#ffd700;border-radius:5px;box-shadow:0 3px #f1a003,0 3px 10px 0 rgba(0,0,0,.5);text-align:justify;box-sizing:border-box;scroll-snap-align:start;scroll-snap-stop:always;}
#review .items .item img{position:absolute;top:-85px;left:35px;width:65px;height:65px;border-radius:100%;box-shadow:0 0 0 3px #fff;}
#review .items .item:before{content:"";position:absolute;left:25px;top:-12.5px;border-top:12.5px solid transparent;border-right:20px solid #ffd700;}
#review .items .item:after{content:"///";position:absolute;right:20px;top:-17.5px;font-size:35px;color:#fff;font-family:'DINNextCYR-Bold';height:25px;overflow:hidden;}
#review .items .item span{font-family:'DINNextCYR-Light';font-size:17.5px;color:#222;}
#review .items .item strong{position:absolute;left:20px;bottom:15px;right:20px;text-align:right;font-family:'DINNextCYR-Bold';font-size:17.5px;color:#222;}
#review .items .nav{position:absolute;left:15px;right:15px;bottom:0;padding:0;margin:0;list-style:none;text-align:right;}
#review .items .nav li{position:relative;display:inline-block;width:10px;height:10px;border-radius:10px;border:2px solid #fff;margin:0 5px;cursor:pointer;box-shadow:0 2px 5px 0 rgba(0,0,0,.5);transition:all .5s;} #review .items .nav li.active{background:#fff;width:35px;}

#contct{position:relative;width:100%;background:url(/system/img/contct/bg.jpg) center / cover;padding:300px 0 50px;}
#contct .txt{position:relative;padding:25px;margin:0 25px;background:#fff;outline:5px solid #fff;border:1.75px solid #ddd;text-align:justify;}
#contct .txt:before{position:absolute;content:"";background:#FFD700;width:100%;height:100%;left:-10px;bottom:-10px;box-shadow:0 0 50px rgba(0,0,0,.05);z-index:-1;}
#contct .txt strong{display:block;margin-bottom:15px;font-family:'DINNextCYR-Bold';font-size:17.5px;color:#222;text-align:right;}
#contct .txt strong a{display:block;float:left;margin-top:2.5px;background:#eee;width:17.5px;height:17.5px;line-height:17.5px;border-radius:100%;text-align:center;font-size:12.5px;color:#aaa;}
#contct .txt span{font-family:'DINNextCYR-Light';font-size:17.5px;color:#222;}

@media screen and (max-width:800px){#contct .txt strong small{display:none;}}

#footer{position:relative;width:100%;background:#fff;} #footer span, #footer a{display:inline-block;margin:5px 20px;width:calc(50% - 40px);text-align:left;font-family:'DINNextCYR-Light';color:#aaa;font-size:16.5px;} #footer a{text-align:right;}

@media screen and (max-width:600px){#footer span, #footer a{width:calc(100% - 40px);text-align:center;}#footer a{margin-top:0;}}

.modal_book{position:fixed;top:55%;left:50%;transform:translate(-50%,-50%);max-width:400px;width:calc(100% - 40px);box-shadow:0 0 25px rgba(0,0,0,.25);display:none;opacity:0;z-index:101;}
.modal_book form{position:relative;background:#fff;margin:5px;padding:20px 25px;border:1.75px solid #ddd;outline:5px solid #fff;}
.modal_book form strong{display:block;margin:0 0 20px;font-size:20px;font-family:'DINNextCYR-Bold';}
.modal_book form span{display:block;margin-bottom:25px;font-family:'DINNextCYR-Light';font-size:17.5px;color:#222;}
.modal_book form input{border:1px #A9A9A9 solid;box-shadow:2px 2px 0 0 #eee inset;background:#FFF;color:#000;font-family:'DINNextCYR-Light';font-size:16px;padding:0 0 0 10px;position:relative;margin-bottom:5px;width:calc(100% - 12px);height:40px;line-height:40px;}
.modal_book form button{position:relative;margin-top:30px;width:100%;height:50px;line-height:50px;background:#FFD700;border:0px;color:#363f48;font-family:'DINNextCYR-Light';font-size:16.5px;box-shadow:0 3px #f1a003, 0 2px 4px rgba(0,0,0,.4);border-radius:5px;transition:all .5s;text-align:center;overflow:hidden;}
.modal_book form button:before{position:absolute;content:"";background:rgba(255,255,255,.15);top:-25%;bottom:-25%;width:25px;transform:rotate(30deg);animation:blick 2.5s infinite ease;} .modal_book form button:hover{background:#FFFF00;cursor:pointer;}
.modal_book form small{display:block;margin-top:15px;text-align:justify;color:#222;font-family:'DINNextCYR-Light';font-size:16px;}

@media screen and (max-width:450px){.modal_book .modal_close{top:-30px;right:0;writing-mode:inherit;transform:none;}}

.modal_work{position:fixed;top:55%;left:50%;transform:translate(-50%,-50%);max-width:1100px;max-height:625px;width:calc(100% - 40px);height:calc(100% - 40px);box-shadow:0 0 25px rgba(0,0,0,.25);display:none;opacity:0;z-index:101;}
.modal_work .text{position:absolute;background:#fff;top:5px;left:5px;right:5px;bottom:5px;padding:20px 25px 0;text-align:justify;color:#222;font-family:'DINNextCYR-Light';font-size:17.5px;overflow:auto;border:1.75px solid #ddd;outline:5px solid #fff;}
.modal_work .text strong{display:block;margin:20px 0;font-family:'DINNextCYR-Bold';font-size:20px;} .modal_work .text strong:first-child{margin-top:0;}
.modal_work .text img{display:block;margin:20px -25px 20px -25px;width:calc(100% + 25px);}
.modal_work .text .chat{position:relative;background:#ddd;margin:40px 0;width:100%;height:7px;box-shadow:0px 1px 1px rgba(0,0,0,.2);}
.modal_work .text .chat div{position:absolute;background:#555;margin:0;height:100%;}
.modal_work .text .chat:before{position:absolute;content:attr(data-parent);left:0;top:-25px;}
.modal_work .text .chat:after{position:absolute;content:attr(data-text);right:0;top:-25px;}
.modal_work .text .desc{position:relative;float:left;width:calc(100% - 280px);color:#888;font-size:15px;}
.modal_work .text .btn{position:relative;display:block;margin:30px 0 30px auto;width:215px;height:45px;background:#FFD700;box-shadow:inset 0 -2.5px rgba(0,0,0,.15), 0 2.5px 15px rgba(0,0,0,.125);border-radius:5px;transition:all .5s;line-height:45px;text-align:center;font-family:'DINNextCYR-Light';font-size:16.5px;color:#222;overflow:hidden;} .modal_work .text .btn:hover{background:#ffff00;}
.modal_work .text .btn:before{position:absolute;content:"";background:rgba(255,255,255,.15);top:-25%;bottom:-25%;width:25px;transform:rotate(30deg);animation:blick 2.5s infinite ease;}

.modal_text{position:fixed;top:55%;left:50%;transform:translate(-50%,-50%);max-width:1100px;max-height:625px;width:calc(100% - 40px);height:calc(100% - 40px);box-shadow:0 0 25px rgba(0,0,0,.25);display:none;opacity:0;z-index:101;}
.modal_text .text{position:absolute;background:#fff;top:5px;left:5px;right:5px;bottom:5px;padding:20px 25px 0;text-align:justify;color:#222;font-family:'DINNextCYR-Light';font-size:17.5px;overflow:auto;border:1.75px solid #ddd;outline:5px solid #fff;}
.modal_text .text .faq{display:block;margin:25px 0;background:#f8f8f8;overflow:hidden;}
.modal_text .text .faq .item{position:relative;width:100%;border-bottom:1px solid #fff;}
.modal_text .text .faq .item .qu{position:relative;background:#eee;padding:15px 50px 15px 15px;font-family:'DINNextCYR-Light';font-size:17.5px;color:#222;cursor:pointer;transition:all .5s;} .modal_text .text .faq .item .qu.active, .modal_text .text .faq .item .qu:hover{background:#FFD700;}
.modal_text .text .faq .item .qu:before{position:absolute;content:attr(data-text);top:50%;right:15px;color:#ff5c5c;font-family:'DINNextCYR-Bold';transform:translateY(-50%);} .modal_text .text .faq .item .qu.active:before{color:#fff;}
.modal_text .text .faq .item .an{display:none;margin:15px 15px 15px 35px;text-align:justify;font-family:'DINNextCYR-Light';font-size:17.5px;color:#222;}

@media screen and (max-width:1150px){.modal_text .close{top:-25px;right:0;writing-mode:inherit;transform:none;}}

.modal_book:before, .modal_video:before, .modal_work:before, .modal_text:before{position:absolute;content:"";background:#FFD700;width:100%;height:100%;left:-3.5px;bottom:-3.5px;}

@media screen and (max-width:1150px){.modal_book .close, .modal_video .close, .modal_work .close, .modal_text .close{top:-25px;right:0;writing-mode:inherit;transform:none;}}

.close{position:absolute;top:0;right:-20px;font-family:'DINNextCYR-Light';color:#fff;font-size:13.5px;writing-mode:vertical-lr;transform:rotate(180deg);transition:all .2s;cursor:pointer;}
.close:hover{color:#FFD700;}

#overlay{z-index:100;position:fixed;background:rgba(17,17,17,.95);background:linear-gradient(150deg,rgba(2,2,2,.85) 0%,#111 100%);top:0;bottom:0;left:0;right:0;display:none;cursor:pointer;}

.shake{animation:shake 1 linear 1s;border-color:red!important;}

.fade_lt, .fade_rt, .fade_up, .fade{opacity:0;transition: all 1s;}
.fade_rt{transform:translateX(-50px);} .fade_lt{transform:translateX(50px);} .fade_up{transform:translateY(50px);}
.fade_lt.active, .fade_rt.active, .fade_up.active, .fade.active{transform:translateX(0);opacity:1;}

@keyframes beg{0%{left:0;width:0;}50%{width:10px;}100%{left:100%;width:0;}}
@keyframes blick{0%{left:-25px;}25%, 50%, 100%{left:calc(100% + 25px);}}
@keyframes shadow{0%, 100%{box-shadow:inset 0 0 10px rgba(0,0,0,.15), 0 0 0 35px #eee;}50%{box-shadow:inset 0 0 10px rgba(0,0,0,.15), 0 0 0 50px #eee;}}
@keyframes pulse{0%{box-shadow:none;}50%{box-shadow:0 0 0 5px #777, 0 0 0 15px #555;}100%{box-shadow:0 0 0 10px transparent, 0 0 0 35px transparent;}}
@keyframes fly{0%, 100%{transform:translateY(0);}50%{transform:translateY(5%);}}
@keyframes shake{0%,100%{transform:translateX(0);}10%,30%,50%,70%,90%{transform:translateX(-2.5px);}20%,40%,60%,80%{transform:translateX(2.5px);}}

@keyframes noise{0%{clip:rect(40px,9999px,90px,0);}5%{clip:rect(10px,9999px,73px,0);}10%{clip:rect(20px,9999px,8px,0);}15%{clip:rect(40px,9999px,62px,0);}20%{clip:rect(44px,9999px,82px,0);}25%{clip:rect(80px,9999px,6px,0);}30%{clip:rect(54px,9999px,51px,0);}35%{clip:rect(27px,9999px,83px,0);}40%{clip:rect(30px,9999px,66px,0);}45%{clip:rect(37px,9999px,87px,0);}50%{clip:rect(67px,9999px,100px,0);}55%{clip:rect(16px, 9999px, 26px, 0);}60%{clip:rect(76px, 9999px, 66px, 0);}65%{clip:rect(7px,9999px,2px,0);}70%{clip:rect(80px,9999px,73px,0);}75%{clip:rect(46px,9999px,65px,0);}80%{clip:rect(45px,9999px,62px,0);}85%{clip:rect(65px,9999px,6px,0);}90%{clip:rect(13px,9999px,51px,0);}95%{clip:rect(70px,9999px,83px,0);}100%{clip:rect(75px,9999px,8px,0);}}