@font-face {font-family:'OS';font-style:normal;font-weight:700;font-display:block;src:url(fonts/700c.woff2) format('woff2');unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face {font-family:'OS';font-style:normal;font-weight:700;font-display:block;src:url(fonts/700le.woff2) format('woff2');unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face {font-family:'OS';font-style:normal;font-weight:700;font-display:block;src:url(fonts/700l.woff2) format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face {font-family:'OS';font-style:normal;font-weight:600;font-display:block;src:url(fonts/600c.woff2) format('woff2');unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face {font-family:'OS';font-style:normal;font-weight:600;font-display:block;src:url(fonts/600le.woff2) format('woff2');unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face {font-family:'OS';font-style:normal;font-weight:600;font-display:block;src:url(fonts/600l.woff2) format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face {font-family:'OS';font-style:normal;font-weight:400;font-display:block;src:url(fonts/400ce.woff2) format('woff2');unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
@font-face {font-family:'OS';font-style:normal;font-weight:400;font-display:block;src:url(fonts/400c.woff2) format('woff2');unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face {font-family:'OS';font-style:normal;font-weight:400;font-display:block;src:url(fonts/400le.woff2) format('woff2');unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face {font-family:'OS';font-style:normal;font-weight:400;font-display:block;src:url(fonts/400l.woff2) format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
html,body,div,ul,ol,li,dl,dt,dd,td,th,h1,h2,h3,h4,h5,h6,p,pre,blockquote,fieldset,form,input,button,textarea {margin:0;padding:0;}h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th {font-size:1.0em;font-weight:normal;font-style:normal;}ul, ul li, nav li,#menu li {list-style:none;}fieldset,img {border:none;}img {-ms-interpolation-mode:bicubic;}caption, th {text-align:left;}table {border-collapse:collapse;border-spacing:0;}input,textarea,select {font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select {font-size:100%;}button {background-color:transparent;text-decoration:none;}label {cursor:pointer;} *,* :after,* :before { box-sizing:border-box;-webkit-user-drag:none!important; }
body {--fs:18px;overflow:hidden;font: 400 calc(1.2*var(--fs))/1.25em OS;letter-spacing: 0.01em;}

::-webkit-scrollbar {	background-color:rgba(0,0,0,0);width:14px;height:1px;border-radius:14px;}::-webkit-scrollbar-thumb {background-color:#f06080;border-radius:10px;	}
::-moz-scrollbar {	background-color:rgba(0,0,0,0);width:14px;height:1px;border-radius:14px;}::-moz-scrollbar-thumb {background-color:#f06080;border-radius:10px;	}
::-ms-scrollbar {	background-color:rgba(0,0,0,0);width:14px;height:1px;border-radius:14px;}::-ms-scrollbar-thumb { background-color:#f06080;border-radius:10px;	}

[view="no"] { display:none; }
[view="yes"] { display:block; }

.justify { text-align:justify; }
.center { text-align:center; }
.left { text-align:left; }
.right { text-align:right; }
.middle { vertical-align:middle; }
.bottom { vertical-align:bottom; }
.nobottom {padding-bottom: 4em!important;}
.notop { padding-top:0px!important; }

a {color: inherit;text-decoration: none;text-decoration-skip-ink:none;user-select: none;}
a.button {color: inherit;text-decoration:none;}
b {display:inline-block;}
i {font: 400 1em/1.25em OS;}
h1 {font: 400 1.5em/1.33em OS;}
h2 {font: 400 1.5em/1.33em OS;}
h3 {font: 400 1.5em/1.25em OS;}
h4 {font: 400 1em/1.25em OS;}
p { position:relative;margin:0 0 1em 0;}

.bgr {position:fixed;top:0;left:0;right:0;bottom:0;background: #308060 url(bgr.jpg) center center / cover fixed no-repeat;}
#outer {position: absolute;top: 0;width: 50em;padding:0;text-align:left;margin: 0 -50% 0 0;left: 50%;transform: translateX(-50%);overflow: hidden;}

section {position:relative;width: 100%;padding: 0 2em;clear: both;}
section p {margin: 0px 0px 1em 0px;}
section i {font: 400 0.9em/1.25em OS;text-align:left;}

#vk {position:relative;float:right;width:1.6em;height:1.6em;margin:0 1em 0 0;background:url(vk.png) center center / contain no-repeat; }
#tg {position:relative;float:right;width:1.6em;height:1.6em;margin:0 1em 0 0;background:url(tg.png) center center / contain no-repeat; }


#logo {position:relative;float: left;vertical-align:middle;margin: 0;padding:0;font: 700 2em/1.6em OS;color:#000;border: 0;}
#logo b {position:relative;display:inline-block;font: 700 1em/1.5em OS;height: 1.6em;padding:0;background-color:#f06080;border-radius:2em;vertical-align:middle;padding: 0 0.5em;margin: 0 0.25em 0 0;color:#fff;}

#slogan {position:relative;text-align:center;vertical-align:middle;margin: 0 auto;padding:0;font: 700 4em/1.6em OS;color:#000;border: 0;}
#slogan b {position:relative;display:inline-block;font: 700 1em/1.5em OS;height: 1.6em;padding:0;background-color:#f06080;border-radius:2em;vertical-align:middle;padding: 0 0.5em;margin: 0 0.25em 0 0;color:#fff;}

h1 {position:relative;width: 10em;margin: 4em 0 2em 0;border-left: 1px solid #000;padding-left: 2em;}
h2 {position:relative;float:right;width: 15em;margin: 3em 0 2em 0;text-align:right;color: #fff;border-right: 1px solid #fff;padding-right: 2em;}

header {position:fixed;top:0;width: 100%;height:auto;margin: 0 -50% 0 0;padding: 3em 3em;left: 50%;transform: translateX(-50%);z-index: 1;}
header nav {position:relative;float: left;margin: 1.5em 1.75em 0 0;font: 400 1em/1em OS;color:#fff;}
header nav li {position:relative;float:left;width:auto;color:#fff;margin: 0 0 0 2em;cursor:pointer;}
header nav a { color:#fff;text-decoration:none;}

footer {position: relative;margin: 3em 0 2em 0;width: 100%;height:auto;color: #fff;}
footer section {height:auto;}
footer section p {margin:0;}

main {padding: 13vh 0 0em 0;position: relative;}

.fldtext {width:calc(100% - 6em);max-width: 100%;height: 2.5em;margin: 0.25em 0;padding: 0 0.5em;border:0;background-color: transparent;box-shadow: inset 0 -1px 0 0 rgb(0 0 0 / 50%);outline:none!important;vertical-align: middle;}
.send {width:100%;height:3em;font:400 1em/1em OS;padding: 0 1.5em;border:0;border-radius: 2em;margin: 1em 0px;background-color: #fff;box-shadow: 0 2px 5px -3px #000;outline:none!important;cursor:pointer;letter-spacing: 1px;}

button,
.button {position:relative;display:inline-block;text-align:center;margin:0.25em auto;font:600 1em/1em OS;border:0;border-radius:2em;color:#fff;padding:1.5em 2em;background-color:#f06080;cursor:pointer; }
button.center { margin: 0 auto; }

#f3 { text-align:center; }
#f3 button { font-size:1.25em;}
#f3 .inf {line-height:3em;width:3em;height:3em;padding:0;}


ul { margin:0px 0px 30px 0px;position:relative; }
ul li {list-style-type:disc;margin: 0.25em 0 0.25em 1em;}

.col  {position:relative;display:inline-block;width:33%;margin: 0 0 2em 0;padding-right: 2em;vertical-align:top;}
.col2 {position:relative;display:inline-block;width:50%;margin: 0 0 1em 0;padding-right: 3em;vertical-align:top;}
.col3 {position:relative;display:inline-block;width:66.66%;margin: 0 0 1em 0;padding-right:1em;vertical-align:top;}
.col1 {position:relative;display:inline-block;width:33.33%;margin: 0 0 1em 0;padding-right:1em;vertical-align:top;}
.col ul,.col1 ul,.col2 ul,.col3 ul { margin:0; }

.n {display:inline-block;width: 5em;font: 400 1em/1.25em OS;text-align:left;vertical-align: middle;}
.v {display:inline-block;width: calc(100% - 6em);text-align:left;}

.button:hover { -webkit-animation:pulse 4s infinite alternate ease-in-out;animation:pulse 4s infinite alternate ease-in-out; }
@-webkit-keyframes pulse { 10%,90% { box-shadow:0 0 0 0.2em rgba(250,250,250,0.25);} 0%,100% { box-shadow:0 0 0 2em rgba(255,255,255,0);} }
        @keyframes pulse { 10%,90% { box-shadow:0 0 0 0.2em rgba(250,250,250,0.25);} 0%,100% { box-shadow:0 0 0 2em rgba(255,255,255,0);} }


#info,
#quest {position: fixed;left:50%;top:50%;max-width: 95%;width:44em;max-height: 98%;padding: 3em 4em;margin:0 -50% 0 0;transform:translate(-50%,-50%) rotate(180deg) scale(0.0001);transition:transform 1s ease;border-radius: 1em;overflow:auto;background: rgba(255,255,255,1);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);z-index: 2;}
#info:target,
#quest:target {transform:translate(-50%,-50%) rotate(0deg) scale(1);}
#info h2,
#quest h2 {font-size: 1.5em;position: relative;margin: 0 0 1em 0;color: #000;text-align: center;border: 0;float: none;width: 100%;padding: 0;}
#quest .n {font-size: 1em;line-height: 1.8em;position: relative;float: left;width: 5em;clear:left;margin: 0.4em 0 1.5em 0;overflow: hidden;white-space: nowrap;}
#quest input,#quest textarea {position: relative;float: right;width: calc(100% - 5em);margin: 0 0 1em 0;clear: none;resize: none;overflow-x: hidden;}
#quest button {margin-top:1em;overflow:hidden; }
#quest button.no {float:left;transform: scale(0.75);transform-origin:left bottom;}
#quest button.yes { float:right; }

#quest_form { position:relative;width:100%;overflow:hidden; }

#info b { font:700 1em/1.25em OS;color:#f06080; }
#info h3 { font:700 1.5em/1.25em OS;margin-bottom:0.5em;color:#f06080; }
#info h4 { font:700 1.25em/1.25em OS;margin-bottom:0.5em;color:#f06080; }

#quest #info0 {position:relative;margin: 1em 0 0 2em;}
#quest #info0 a:before {content:'?';color: #000000;border: 1px solid rgba(0,0,0,0.5);position:relative;display:inline-block;text-align:center;font-size: 1em;line-height: 2em;width: 2em;height: 2em;border-radius: 1em;margin:0 0.5em 0 -2em;}

#quest #type {position:relative;margin-bottom: 2.5em;}

#quest .chk {position:relative;float:left;padding:0 2em 1em 1.5em;cursor:pointer;line-height: 1.3em;}
#quest .chk::before { content:'';position:absolute;left:0;top:0;width:1.2em;height:1.2em;border-radius:1em;border:1px solid rgba(0,0,0,0.5); }
#quest .chk[act="yes"]::before { background-color:#fff;border:2px solid #000; }

#quest .chk2 {position:relative;float:left;padding:0 2em 1em 1.5em;cursor:pointer;line-height: 1.3em;width: 100%;}
#quest .chk2::before { content:'';position:absolute;left:0;top:0;width:1.2em;height:1.2em;text-align:center;border-radius:1em;border:1px solid rgba(0,0,0,0.5); }
#quest .chk2[act="yes"]::before { content:'\2713';font-size:1.6em;font-weight:600;width:0.9em;height:0.6em;border:none; }

#quest #btns {position:relative;width: 100%;margin: 0 0 2em 0;overflow: hidden;}


#quest #optionsX,
#quest #org {position:relative;display:block;clear:both;height: 3.4em;overflow:hidden;transition:height 0.25s ease-out;transform-origin:top;}
#quest #optionsX[view="no"],
#quest #org[view="no"] { display:block;height:0;}
#quest h3 { margin-top:1em; }
#quest .n2 {font-size: 1em;line-height: 1.5em;position: relative;float: left;width:100%;clear:left;margin: 2em 0 0.5em 0;}


#msg {position:fixed;left:-100%;top:50%;width:30em;margin:0 -50% 0 0;transform:translate(-50%,-50%);background-color:#5cc390;box-shadow: 0 0 0 1px #fff, 0 0 1em 0 #fff, 0 0 5em 0 #fff;padding:0;font:400 1em/1.25em OS;padding: 3em;border-radius:0;color:#fff;text-align:center;z-index:500000000;}
#msg { -webkit-transition:left 0.3s ease-out;-moz-transition:left 0.3s ease-out;-o-transition:left 0.3s ease-out;transition:left 0.3s ease-out;}
#msg[view="yes"] {
-webkit-animation:msg 3s 1 alternate ease-in-out;
   -moz-animation:msg 3s 1 alternate ease-in-out;
     -o-animation:msg 3s 1 alternate ease-in-out;
        animation:msg 3s 1 alternate ease-in-out;
}
@-webkit-keyframes msg { 5%,95% { left:50%;} 0%,100% { left:-100%;} }
   @-moz-keyframes msg { 5%,95% { left:50%;} 0%,100% { left:-100%;} }
     @-o-keyframes msg { 5%,95% { left:50%;} 0%,100% { left:-100%;} }
        @keyframes msg { 5%,95% { left:50%;} 0%,100% { left:-100%;} }

@media (min-width:2401px) {
  body {--fs: 18px;}
}
@media (max-width:2400px) {
  body {--fs: 15px; }
  .bgr {background-size:cover;background-position: center 50%;}
  header{ padding:2em; }
  #logo { font-size:1.5em; }
  #slogan {font-size:3em;line-height:1.6em;}
  #outer {width:90%;max-width:54em;}
  main {padding-top:16vh;}
  h1 {font: 400 1.2em/1.25em OS;width:12em;margin:10vh 0 0 0;}
  h2 {display: block;font: 400 1.2em/1.25em OS;width: 15em;margin:10vh 0 5vh 0;color:#fff;}
  #f3 button { font-size: 1.1em; }
  footer {font-size:0.9em;line-height:1.25em;margin:2em 0;}
}
@media (max-width: 1400px) and (orientation: landscape) {
  body {--fs: 15px; }
  .bgr { background-size:auto 150%;background-position:55% 30%; }
  header{ padding:2em; }
  #logo { font-size:calc(100vw/34); }
  #slogan {font-size:calc(100vw/25);line-height:1.6em;}
  #outer {width:90%;max-width:54em;}
  main {padding-top:20vh;}
  h1 {font: 400 1.2em/1.25em OS;width:12em;margin:10vh 0 0 0;}
  h2 {display: block;font: 400 1.2em/1.25em OS;width: 15em;margin:2em 0;color:#fff;}
  #f3 button { font-size: 1.1em; }
  footer {font-size:0.9em;line-height:1.25em;margin:2em 0;}
}
@media (max-width: 960px) and (orientation: landscape) {
  body {--fs: 14px; }
  .bgr { background-size:auto 150%;background-position:80% 25%; }
  h1 {font: 400 1.15em/1.25em OS;width:12em;margin:5vh 0 0 0;}
  h2 {display: block;font: 400 1.15em/1.25em OS;width: 12em;margin:-1em 0 0 0;color:#fff;}
  #f3 button { font-size: 1em; }
  footer { font-size:0.8em;line-height:1.25em;margin:2em 0; }
}
@media (max-width:800px) and (orientation: landscape) {
  body {--fs: 13px; }
  .bgr { background-size:auto 110vw;background-position:65% 45%; }
  header{ padding:2em; }
  #logo { font-size:calc(100vw/34); }
  #slogan {font-size:calc(100vw/25);line-height:1.6em;}
  #outer {width: 95%;}
  main {padding-top:15vh;}
  h1 {font: 400 1em/1.25em OS;width:12em;margin:5vh 0 0 0;}
  h2 {font: 400 1em/1.25em OS;width:12em;margin:-1em 0 1em 0;color:#fff;}
  #f3 button { font-size: 1em; }
  footer { font-size:0.8em;line-height:1.25em;margin:1em 0; }
  .col3 {width:100%; }
}
@media (max-width:600px) and (orientation: landscape) {
  body {--fs: 13px; }
  .bgr { background-size:200% auto;background-position:60% 52%;}
  header{ padding:2em; }
  #logo { font-size:1.25em; }
  #slogan {font-size:1.75em;line-height:1.6em;}
  #outer { width:100%; }
  main {padding-top:15vw;}
  h1 {font: 400 1em/1.25em OS;width:15em;margin:18vh 0 0 0;color:#fff;float:right;text-align:right;border-right:1px solid #fff;border-left:none;padding:0 2em 0 0; }
  h2 {font: 400 1em/1.25em OS;width:15em;margin:1em 0;color:#fff;}
  #f3 button { font-size: 1em;padding:1em 1.25em; }
  footer { font-size:0.8em;line-height:1.25em; }
  .col2 { padding:0; }
  .nomobile { display:none; }
}
@media (max-width:1100px) and (orientation: portrait) {
  body {--fs: 13px; }
  #logo { font-size:calc(100vw/25); }
  #slogan {font-size:calc(100vw/15);line-height: 1.6em;}
  #outer {width: 95%;}
  main {padding-top:20vh;}
  h1 {font: 400 1.5em/1.25em OS;width:12em;margin:8vh 0 0 0;}
  h2 {font: 400 1.5em/1.25em OS;width:12em;margin:4em 0 3em 0;color:#fff;}
  .col3 {width:100%; }
}
@media (max-width:800px) and (orientation: portrait) {
  body {--fs: 14px; }
  .bgr { background-size: 240vw auto;}
  h1 {font: 400 1.5em/1.25em OS;width:15em;margin:25vh 0 0 0;color:#fff;float:right;text-align:right;border-right:1px solid #fff;border-left:none;padding:0 2em 0 0; }
  h2 {font: 400 1.5em/1.25em OS;width:15em;margin:2em 0;color:#fff;}
  .col,.col2 {width:50%;}
}
@media (max-width:700px) and (orientation: portrait) {
  main {padding-top: 11em;}
  h1 {font: 400 1.25em/1.25em OS;margin: 25vh 0 0 0;color:#fff;float:right;text-align:right;}
  h2 {font: 400 1.25em/1.25em OS;margin: 2em 0;color:#fff;}
  .col,.col2,.col3 {width:100%;padding-right: 0;}
  #info,
  #quest {padding:2em 2em;}

}
@media (max-width:599px) and (max-height:1100px) and (orientation: portrait) {
  body {--fs: 14px; }
  .bgr { background-size:auto 80%;background-position:50% top;}
  header{ padding:2em; }
  #logo { font-size:calc(100vw/20); }
  #slogan {font-size:calc(100vw/14);line-height:1.6em;}
  #outer { width:100%; }
  main {padding-top:36vw;}
  h1 {font: 400 1em/1.25em OS;width:13em;margin: 24vh 0 0 0;padding-right:1em;}
  h2 {font: 400 1em/1.25em OS;width:13em;margin: 2em 0;padding-right:1em;}
  #f3 button { font-size: 1em; }
  footer { font-size:0.8em;line-height:1.25em; }
  .col2 { padding:0; }
  .nomobile { display:none; }
  #quest .n { line-height:1em;float:none;clear:both;width:100%;margin:0;overflow: hidden;white-space: nowrap;}
  #quest .fldtext { width:100%; }
}
@media (max-width:599px) and (max-height:800px) and (orientation: portrait) {
  body {--fs: 14px; }
  .bgr { background-size:auto 80%;background-position:50% top;}
  header{ padding:2em; }
  #logo { font-size:calc(100vw/20); }
  #slogan {font-size:calc(100vw/14);line-height:1.6em;}
  #outer { width:100%; }
  main {padding-top:25vw;}
  h1 {font: 400 1em/1.25em OS;width:13em;margin: 20vh 0 0 0;padding-right:1em;}
  h2 {font: 400 1em/1.25em OS;width:13em;margin: 2em 0;padding-right:1em;}
  #f3 button { font-size: 1em; }
  footer { font-size:0.8em;line-height:1.25em; }
  .col2 { padding:0; }
  .nomobile { display:none; }
}
@media (max-width:360px) and (max-height:800px) and (orientation: portrait) {
  body {--fs: 14px; }
  .bgr { background-size:auto 75%;background-position:50% -20%;}
  header{ padding:2em; }
  #logo { font-size:calc(100vw/20); }
  #slogan {font-size:calc(100vw/14);line-height:1.6em;}
  #outer { width:100%; }
  main {padding-top:30vw;}
  h1 {font: 400 1em/1.25em OS;width:13em;margin:28vh 0 0 0;padding-right:0;border:0;}
  h2 {font: 400 1em/1.25em OS;width:13em;margin:1em 0;padding-right:0;border:0;}
  #f3 button { font-size: 1em; }
  footer { font-size:0.8em;line-height:1.25em; }
  .col2 { padding:0; }
  .nomobile { display:none; }
}
@media (max-height:420px) and (orientation: landscape) {
  body {--fs: 13px; }
  .bgr { background-size:auto 90vw;background-position:75% 45%; }
  #slogan { display:none;}
  h1 { margin-top:15vh;}
  h2 { margin:-3em 0 -1em 0;}
}