@import "../fonts/AvenirNextCyr/stylesheet.css";
/*
 * Подключаемые классы
 */
/*
 * Стили шаблона
 */
/*video youtube*/
/*
<div class="embed-responsive embed-responsive-16by9">
	<iframe class="embed-responsive-item" src="..."></iframe>
</div>
<div class="embed-responsive embed-responsive-4by3">
	<iframe class="embed-responsive-item" src="..."></iframe>
</div>
*/
.embed-responsive.embed-responsive-16by9 {
  padding-bottom: 56.25%;
}
.embed-responsive.embed-responsive-4by3 {
  padding-bottom: 75%;
}
.embed-responsive {
  position: relative;
  display: block;
  height: 0;
  padding: 0;
  overflow: hidden;
  width: 100%;
}
.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
html {
  font-size: 1vw;
  font-weight: 300;
}
body {
  background: #fff;
  padding: 0;
  margin: 0;
  font-size: 1.1rem;
  font-weight: 300;
}
.page_wrapper {
  overflow: hidden;
}
select {
  opacity: 0;
}
* {
  font-family: 'Avenir Next Cyr', 'Arial', sans-serif;
  box-sizing: border-box;
  outline: none !important;
}
.width_100 {
  width: 100% !important;
}
.btn-clipboard {
  cursor: pointer;
}
.btn {
  padding: 0 1.5rem;
  margin: 0;
  display: inline-flex;
  align-items: center;
  text-align: center;
  white-space: nowrap;
  background: var(--color-main);
  background-image: -webkit-linear-gradient(to left, var(--color-main), var(--color-main-dark));
  background-image: -moz-linear-gradient(to left, var(--color-main), var(--color-main-dark));
  background-image: -ms-linear-gradient(to left, var(--color-main), var(--color-main-dark));
  background-image: -o-linear-gradient(to left, var(--color-main), var(--color-main-dark));
  background-image: linear-gradient(to left, var(--color-main), var(--color-main-dark));
  flex-flow: nowrap row;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  width: auto;
  height: 3.5rem;
  border: none;
  font-size: 1.5rem;
  color: #fff;
  text-transform: uppercase;
  font-weight: 300;
  -webkit-box-shadow: 0 0 0 rgba(255, 255, 255, 0);
  -moz-box-shadow: 0 0 0 rgba(255, 255, 255, 0);
  box-shadow: 0 0 0 rgba(255, 255, 255, 0);
  -o-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.btn img {
  width: auto;
  height: 1.5rem;
  margin-right: 1rem;
  -o-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.btn span {
  display: block;
}
.btn:focus {
  outline: none;
}
.btn:hover {
  color: #fff;
  -webkit-box-shadow: 0.5rem 0.5rem 0 #ffffff;
  -moz-box-shadow: 0.5rem 0.5rem 0 #ffffff;
  box-shadow: 0.5rem 0.5rem 0 #ffffff;
}
.btn:hover img {
  -webkit-transform: translateX(-0.5rem);
  -moz-transform: translateX(-0.5rem);
  -ms-transform: translateX(-0.5rem);
  -o-transform: translateX(-0.5rem);
  transform: translateX(-0.5rem);
}
.wrapper_container {
  padding: 0 10rem;
}
header {
  background-image: -webkit-linear-gradient(-225deg, var(--color-grey-dark), var(--color-main));
  background-image: -moz-linear-gradient(-225deg, var(--color-grey-dark), var(--color-main));
  background-image: -ms-linear-gradient(-225deg, var(--color-grey-dark), var(--color-main));
  background-image: -o-linear-gradient(-225deg, var(--color-grey-dark), var(--color-main));
  background-image: linear-gradient(-225deg, var(--color-grey-dark), var(--color-main));
  position: relative;
}
header:before {
  content: '';
  display: block;
  position: absolute;
  z-index: 3;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 20rem;
  background-image: -webkit-linear-gradient(to top, #ffffff, rgba(255, 255, 255, 0));
  background-image: -moz-linear-gradient(to top, #ffffff, rgba(255, 255, 255, 0));
  background-image: -ms-linear-gradient(to top, #ffffff, rgba(255, 255, 255, 0));
  background-image: -o-linear-gradient(to top, #ffffff, rgba(255, 255, 255, 0));
  background-image: linear-gradient(to top, #ffffff, rgba(255, 255, 255, 0));
}
header:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url(../img/waves.svg) center center no-repeat;
  background-size: cover;
  z-index: 1;
  display: block;
  opacity: 0.1;
}
header .inner_wrapper {
  background: url(../img/header_p-min.png) bottom right no-repeat;
  background-size: contain;
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  display: block;
}
header .offer_pic_name {
  position: absolute;
  bottom: 10rem;
  right: 25rem;
  text-align: right;
  white-space: nowrap;
  z-index: 6;
}
header .offer_pic_name p {
  padding: 0;
  margin: 0;
  font-size: 0.8rem;
}
header .offer_pic_name p b {
  font-size: 1.2rem;
}
header .soc {
  position: absolute;
  top: 2rem;
  right: 2rem;
  z-index: 5;
  display: flex;
}
header .soc a {
  margin-left: 1rem;
  display: block;
}
header .soc a:hover {
  opacity: 0.8;
}
header .soc img {
  width: auto;
  height: 2.5rem;
  padding: 0;
  margin: 0;
}
@keyframes circle_h {
  0% {
    top: 0;
    height: 0;
  }
  12.5% {
    top: 0;
    height: 100%;
  }
  25% {
    top: 100%;
    height: 0;
  }
  37.5% {
    top: 100%;
    height: 100%;
  }
  50% {
    top: 200%;
    height: 0;
  }
  61.5% {
    top: 100%;
    height: 100%;
  }
  75% {
    top: 100%;
    height: 0;
  }
  87.5% {
    top: 0;
    height: 100%;
  }
  100% {
    top: 0;
    height: 0;
  }
}
.main_offer {
  position: relative;
  z-index: 5;
  padding-top: 2rem;
  padding-bottom: 10rem;
  width: 31rem;
}
.main_offer h1 {
  padding: 0;
  margin: 0 0 2rem;
  font-size: 2.5rem;
  font-weight: 600;
}
.main_offer .logo {
  display: flex;
  align-items: center;
  color: #fff;
  text-decoration: none;
}
.main_offer .logo img {
  width: auto;
  height: 10rem;
}
.main_offer .logo span {
  font-weight: 700;
  text-transform: uppercase;
  padding-left: 1rem;
}
.main_offer .offer_desc {
  padding-top: 3rem;
  font-size: 1.5rem;
  text-transform: uppercase;
  line-height: 1.5;
  font-weight: 400;
  color: #fff;
}
.main_offer .offer_desc ul {
  padding: 0;
  margin: 0;
  list-style: none;
  font-size: 1.3rem;
}
.main_offer .offer_desc ul li {
  display: block;
  position: relative;
  padding-left: 3rem;
  padding-bottom: 1rem;
}
.main_offer .offer_desc ul li .num {
  display: flex;
  position: absolute;
  width: 2rem;
  height: 2rem;
  text-align: center;
  align-items: center;
  justify-content: center;
  border: 2px #fff solid;
  top: 0;
  left: 0;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  font-weight: 700;
  font-size: 1rem;
  background: var(--color-main-medium);
  background-image: -webkit-linear-gradient(to left, var(--color-main-medium), var(--color-main-dark));
  background-image: -moz-linear-gradient(to left, var(--color-main-medium), var(--color-main-dark));
  background-image: -ms-linear-gradient(to left, var(--color-main-medium), var(--color-main-dark));
  background-image: -o-linear-gradient(to left, var(--color-main-medium), var(--color-main-dark));
  background-image: linear-gradient(to left, var(--color-main-medium), var(--color-main-dark));
  z-index: 2;
}
.main_offer .offer_desc ul li:before {
  content: '';
  display: block;
  height: 100%;
  width: 2px;
  background: #fff;
  position: absolute;
  top: 0.5rem;
  left: 1rem;
  margin-left: -1px;
  z-index: 1;
}
.main_offer .offer_desc ul li:after {
  width: auto;
  height: auto;
  content: '\2192';
  display: none;
  position: absolute;
  margin-top: -0.1rem;
  top: 0;
  left: 0;
  box-sizing: border-box;
  z-index: 1;
}
.main_offer .offer_desc ul li:last-of-type:before {
  display: none;
}
.main_offer .offer_desc ul li:nth-child(99999):before {
  width: 1rem;
  height: 0;
  padding-bottom: 1rem;
  content: '';
  display: none;
  position: absolute;
  margin-top: 0.35rem;
  top: 0;
  left: -0.2rem;
  box-sizing: content-box;
  border: 0.2rem #fff solid;
  -webkit-border-radius: 1rem;
  -moz-border-radius: 1rem;
  border-radius: 1rem;
  -o-animation: circle_h 10s ease-in-out infinite;
  -moz-animation: circle_h 10s ease-in-out infinite;
  -webkit-animation: circle_h 10s ease-in-out infinite;
  animation: circle_h 10s ease-in-out infinite;
  z-index: 2;
}
.main_offer .offer_btn {
  padding-right: 5rem;
  padding-top: 5rem;
}
.main_offer .offer_btn .btn {
  justify-content: center;
  padding: 0 3rem;
  font-size: 1.3rem;
}
.arrow_next_screen {
  position: absolute;
  left: 50%;
  bottom: 17rem;
  text-decoration: none;
  text-transform: uppercase;
  color: #fff;
  text-align: center;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 8;
}
.arrow_next_screen:hover {
  color: #fff;
  text-decoration: none;
}
.arrow_next_screen span {
  display: block;
  font-size: 0.8rem;
  padding-bottom: 0.5rem;
}
.arrow_next_screen img {
  width: auto;
  height: 1.5rem;
}
.video_main_page_wrapper {
  overflow: hidden;
  position: relative;
}
.video_main_page_wrapper video {
  display: block;
  width: 100%;
  height: auto;
}
.video_main_page_item {
  display: block;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  overflow: hidden;
  position: relative;
}
.video_main_page_item:before {
  content: '';
  z-index: 1;
  background: rgba(0, 0, 0, 0.3);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.video_main_page_wrapper .volume-mute {
  position: absolute;
  right: 40px;
  top: 40px;
  color: #fff;
  display: flex;
  z-index: 3;
}
.video_main_page_wrapper .volume-mute i {
  font-size: 30px;
  cursor: pointer;
}
.video_main_page_wrapper .volume-mute .fa-volume-up {
  display: none;
}
.video_main_page_wrapper .video_main_page_item.active .volume-mute .fa-volume-up {
  display: block;
}
.video_main_page_wrapper .video_main_page_item.active .volume-mute .fa-volume-mute {
  display: none;
}
.video_main_page_wrapper .video_time {
  position: absolute;
  right: 40px;
  bottom: 40px;
  color: #fff;
  display: flex;
  z-index: 3;
}
.section_video {
  position: relative;
}
.section_video .wrapper_container {
  position: relative;
}
.section_video .wrapper_container .video_join {
  color: var(--color-main);
  text-transform: uppercase;
  text-decoration: none;
  display: block;
  border-bottom: 1px var(--color-main) solid;
  position: absolute;
  top: 0;
  left: 0;
  padding-left: 10rem;
  font-size: 0.8rem;
  font-weight: 400;
  z-index: 9;
}
.section_video_text {
  padding-top: 10rem;
}
.section_video_text .l1 {
  font-weight: 600;
  font-size: 2rem;
  line-height: 1;
}
.section_video_text .l2 {
  font-weight: 600;
  font-size: 2.75rem;
  text-transform: uppercase;
}
.section_video_text .l3 {
  font-weight: 300;
  font-size: 1.75rem;
  line-height: 1.2;
}
.video_block {
  position: relative;
  padding: 10rem 5rem 0 5rem;
}
.video_block .video_block_t {
  display: block;
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 25rem;
  height: 25rem;
  border: 1.5rem var(--color-main) solid;
}
.video_block .video_block_t span {
  display: block;
  position: absolute;
  top: 7rem;
  left: 1rem;
  font-size: 0.8rem;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
  transform-origin: left;
}
.video_block .video_block_share {
  position: absolute;
  top: 4rem;
  right: 0;
  background: var(--color-grey);
  height: 18rem;
  padding: 2rem 5rem 2rem 2rem;
  z-index: 2;
  width: 35rem;
  line-height: 1.3;
  font-size: 0.9rem;
  text-align: right;
  display: flex;
  justify-content: flex-end;
}
.video_block .video_block_share img {
  width: auto;
  height: 2.2rem;
  margin-left: 0.5rem;
}
.video_block .video_src {
  position: relative;
  z-index: 3;
}
.video_block .video_src img {
  width: 100%;
  height: auto;
  padding: 0;
  margin: 0;
}
.section_goods {
  padding: 15rem 10rem 25rem;
  background: var(--color-main-medium);
  position: relative;
  text-align: center;
  color: #fff;
}
.section_goods:before,
.section_goods:after {
  content: '';
  display: block;
  position: absolute;
  z-index: 0;
  width: 100%;
  height: 15rem;
}
.section_goods:before {
  top: 0;
  left: 0;
  background-image: -webkit-linear-gradient(to top, var(--color-main-medium), #ffffff);
  background-image: -moz-linear-gradient(to top, var(--color-main-medium), #ffffff);
  background-image: -ms-linear-gradient(to top, var(--color-main-medium), #ffffff);
  background-image: -o-linear-gradient(to top, var(--color-main-medium), #ffffff);
  background-image: linear-gradient(to top, var(--color-main-medium), #ffffff);
}
.section_goods:after {
  bottom: 0;
  left: 0;
  height: 25rem;
  background-image: -webkit-linear-gradient(to top, #ffffff, var(--color-main-medium));
  background-image: -moz-linear-gradient(to top, #ffffff, var(--color-main-medium));
  background-image: -ms-linear-gradient(to top, #ffffff, var(--color-main-medium));
  background-image: -o-linear-gradient(to top, #ffffff, var(--color-main-medium));
  background-image: linear-gradient(to top, #ffffff, var(--color-main-medium));
}
.section_goods .block_header {
  padding-bottom: 5rem;
}
.section_goods .img img {
  width: 100%;
  height: auto;
}
.section_goods p {
  margin: 0 0 0.5rem;
  font-size: 0.9rem;
}
.section_goods p b {
  font-size: 1.1rem;
  font-weight: 700;
}
.block_header {
  text-align: center;
  color: #fff;
  font-size: 1.5rem;
}
.block_header span {
  color: var(--color-main);
}
form .rules {
  font-size: 0.8rem;
  padding-top: 3rem;
}
form .rules a {
  color: #000;
  text-decoration: underline;
}
form .select_block {
  display: block;
  position: relative;
}
form label,
form .label {
  display: block;
  cursor: pointer;
  margin-bottom: 1.5rem;
  position: relative;
}
form label .fields_name_lines,
form .label .fields_name_lines {
  padding-bottom: 0.5rem;
  display: block;
}
form label .fields_name,
form .label .fields_name {
  position: absolute;
  top: 0;
  left: 0;
  padding-left: 1rem;
  z-index: 1;
  display: flex;
  height: 3rem;
  align-items: center;
}
form label .fields_name .fields_name_inner,
form .label .fields_name .fields_name_inner {
  display: block;
  background: #fff;
  padding: 0 1rem;
}
form label .form-control:focus + .fields_name,
form .label .form-control:focus + .fields_name,
form label .form-control.no_empty + .fields_name,
form .label .form-control.no_empty + .fields_name {
  height: 1rem;
  top: -0.5rem;
  font-size: 0.9rem;
}
form label.error_active .error,
form .label.error_active .error {
  display: block;
}
form label .fields_input_flex,
form .label .fields_input_flex {
  display: flex;
  flex-flow: nowrap row;
  border: 1px var(--color-grey-dark) solid;
  -webkit-border-radius: 0.5rem;
  -moz-border-radius: 0.5rem;
  border-radius: 0.5rem;
}
form label .fields_input_flex input,
form .label .fields_input_flex input {
  display: none;
}
form label .fields_input_flex label,
form .label .fields_input_flex label {
  display: block;
  margin: 0;
  border-right: 1px var(--color-grey-dark) solid;
  width: 100%;
  overflow: hidden;
}
form label .fields_input_flex label span,
form .label .fields_input_flex label span {
  display: flex;
  width: 100%;
  text-align: center;
  margin: 0;
  height: 4rem;
  align-items: center;
  justify-content: center;
}
form label .fields_input_flex label:last-child,
form .label .fields_input_flex label:last-child {
  border: none;
}
form label .fields_input_flex label input:checked + span,
form .label .fields_input_flex label input:checked + span {
  background: rgba(0, 0, 0, 0.02);
  -webkit-box-shadow: inset 0.1rem 0.1rem 0.5rem rgba(0, 0, 0, 0.1);
  -moz-box-shadow: inset 0.1rem 0.1rem 0.5rem rgba(0, 0, 0, 0.1);
  box-shadow: inset 0.1rem 0.1rem 0.5rem rgba(0, 0, 0, 0.1);
}
form .form_row,
form label {
  cursor: pointer;
  margin-bottom: 1rem;
}
form .form_row .name,
form label .name {
  height: 3rem;
  display: flex;
  align-items: center;
}
form .form_row span.error,
form label span.error {
  color: var(--color-red);
  font-size: 0.8rem;
  padding-top: 0.5rem;
  display: none;
}
form .form_row.error_active .error,
form label.error_active .error {
  display: block;
}
form .form-control {
  border: 1px var(--color-grey-dark) solid;
  padding: 0 1rem;
  height: 4rem;
  -webkit-border-radius: 0.25rem;
  -moz-border-radius: 0.25rem;
  border-radius: 0.25rem;
  width: 100%;
}
form .form-control:focus {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  border-color: var(--color-main);
}
.section_form {
  padding: 0 10rem;
  position: relative;
  z-index: 2;
  margin-top: -15rem;
}
.section_form .wrapper_container {
  position: relative;
}
.section_form .form_lines {
  position: absolute;
  left: 0;
  top: 8rem;
  z-index: 0;
}
.section_form .form_lines img {
  width: 10rem;
  height: auto;
}
.section_form .form_main_block {
  display: block;
  border: 1px var(--color-main-dark) solid;
  background: #fff;
  padding: 4rem;
  position: relative;
  z-index: 3;
}
.section_form .form_main_block .block_header {
  color: #000;
  margin-bottom: 3rem;
}
.section_form .form_main_block:before {
  content: '';
  display: block;
  width: 100%;
  height: 2rem;
  background: var(--color-main-dark);
  position: absolute;
  top: 100%;
  left: 2rem;
}
.section_form .form_main_block:after {
  content: '';
  display: block;
  height: 100%;
  width: 2rem;
  background: var(--color-main-dark);
  position: absolute;
  top: 2rem;
  left: 100%;
}
footer {
  background-image: -webkit-linear-gradient(-275deg, var(--color-grey-dark), var(--color-main));
  background-image: -moz-linear-gradient(-275deg, var(--color-grey-dark), var(--color-main));
  background-image: -ms-linear-gradient(-275deg, var(--color-grey-dark), var(--color-main));
  background-image: -o-linear-gradient(-275deg, var(--color-grey-dark), var(--color-main));
  background-image: linear-gradient(-275deg, var(--color-grey-dark), var(--color-main));
  position: relative;
  padding: 17rem 0 5rem;
  z-index: 1;
  margin-top: -10rem;
}
footer a {
  color: #fff;
  text-decoration: underline;
}
footer:after {
  content: '';
  display: block;
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  width: 100%;
  height: 25rem;
  background-image: -webkit-linear-gradient(to bottom, #ffffff, rgba(255, 255, 255, 0));
  background-image: -moz-linear-gradient(to bottom, #ffffff, rgba(255, 255, 255, 0));
  background-image: -ms-linear-gradient(to bottom, #ffffff, rgba(255, 255, 255, 0));
  background-image: -o-linear-gradient(to bottom, #ffffff, rgba(255, 255, 255, 0));
  background-image: linear-gradient(to bottom, #ffffff, rgba(255, 255, 255, 0));
}
footer a {
  color: #fff;
  text-decoration: none;
}
footer a:hover {
  color: #fff;
  opacity: 0.8;
  text-decoration: none;
}
footer .block_header {
  position: relative;
  z-index: 9;
}
footer .block_header span {
  display: inline-block;
  padding: 0 0.2rem;
  -webkit-border-radius: 0.2rem;
  -moz-border-radius: 0.2rem;
  border-radius: 0.2rem;
  background: var(--color-red);
  color: #fff;
}
footer .l2 {
  margin: 2rem;
}
footer .soc {
  display: flex;
  align-items: center;
  justify-content: center;
}
footer .soc a {
  margin: 0 0.5rem;
  display: block;
}
footer .soc a:hover {
  opacity: 0.8;
}
footer .soc img {
  height: 3.5rem;
}
footer .f_email {
  margin-top: 3rem;
}
footer .dop {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 7;
}
footer .dop:after {
  content: '';
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  width: 15rem;
  height: 20rem;
  border-left: 2rem var(--color-main-dark) solid;
  border-top: 2rem var(--color-main-dark) solid;
  z-index: 3;
}
footer .dop:before {
  content: '';
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 20rem;
  background-image: linear-gradient(340deg, #0ad1c9, rgba(10, 209, 201, 0), rgba(10, 209, 201, 0));
  z-index: 4;
}
footer .dop2 {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 7;
}
footer .dop2:after {
  content: '';
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 28rem;
  height: 12rem;
  background-image: -webkit-linear-gradient(-275deg, #ffffff, var(--color-main));
  background-image: -moz-linear-gradient(-275deg, #ffffff, var(--color-main));
  background-image: -ms-linear-gradient(-275deg, #ffffff, var(--color-main));
  background-image: -o-linear-gradient(-275deg, #ffffff, var(--color-main));
  background-image: linear-gradient(-275deg, #ffffff, var(--color-main));
  z-index: 3;
}
footer .dop2:before {
  content: '';
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 26rem;
  height: 10rem;
  background: var(--color-grey-dark);
  z-index: 4;
}
.ok_wrapper {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.ok_wrapper .ok_img {
  padding-bottom: 2rem;
}
.ok_wrapper .ok_img img {
  width: auto;
  height: 4rem;
}
.ok_wrapper h2 {
  font-size: 1.5rem;
}
.auth_box {
  display: flex;
  position: relative;
  height: 100vh;
  background: var(--color-grey);
  padding: 3rem;
  justify-content: center;
  align-items: center;
}
.auth_box .auth_box_inner {
  background: #FFF;
  padding: 3rem;
  -webkit-box-shadow: 0 1rem 1rem rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 1rem 1rem rgba(0, 0, 0, 0.1);
  box-shadow: 0 1rem 1rem rgba(0, 0, 0, 0.1);
  -webkit-border-radius: 0.5rem;
  -moz-border-radius: 0.5rem;
  border-radius: 0.5rem;
  max-width: 100%;
  width: 30rem;
}
.auth_box .auth_h1_desc {
  padding-bottom: 2rem;
}
.auth_box .btn {
  -webkit-border-radius: 0.5rem;
  -moz-border-radius: 0.5rem;
  border-radius: 0.5rem;
  font-size: 1.25rem;
  text-transform: none;
}
@media screen and (max-width: 767px) {
  html {
    font-size: 4vw;
  }
  .wrapper_container {
    padding: 0 2rem;
  }
  header .offer_pic_name,
  header .inner_wrapper {
    display: block;
    width: 100%;
    height: 100%;
    background-position: center center;
    background-size: cover;
    opacity: 0.2;
  }
  header .main_offer {
    padding-top: 0;
    width: 100%;
    padding-bottom: 3rem;
  }
  header .main_offer h1 {
    font-size: 2rem;
  }
  header .main_offer .offer_btn {
    padding-right: 0;
    padding-top: 3rem;
  }
  header .main_offer .offer_desc {
    padding-top: 1rem;
    font-size: 1.4rem;
  }
  header .main_offer .offer_desc ul li {
    font-size: 1.3rem;
  }
  header .main_offer .offer_btn .btn {
    padding: 0;
    width: 100%;
  }
  header .soc {
    display: none;
  }
  .section_video .wrapper_container .video_join {
    top: 2rem;
    padding-left: 2rem;
  }
  .section_video .section_video_text {
    padding-top: 6rem;
  }
  .section_video .section_video_text .l3 {
    font-size: 1.3rem;
    padding-bottom: 3rem;
  }
  .section_video .section_video_text .l3 br {
    display: none;
  }
  .section_video .video_block {
    padding-left: 0;
    padding-right: 0;
    padding-top: 4rem;
  }
  .section_video .video_block .video_block_share {
    top: -1rem;
    right: -5rem;
    width: 16rem;
    height: 11rem;
    padding-top: 1.5rem;
  }
  .section_video .video_block_t {
    display: none;
  }
  .section_goods {
    margin-top: -5rem;
    padding: 10rem 0 5rem;
  }
  .section_goods:after {
    height: 10rem;
  }
  .section_goods .wrapper_container {
    position: relative;
    z-index: 5;
  }
  .section_goods .items {
    margin-bottom: 3rem;
  }
  .section_goods .items .name {
    font-size: 1.3rem;
  }
  .section_form {
    margin-top: 0;
    padding: 0;
  }
  .section_form form {
    padding: 3rem 2rem;
  }
  .section_form form .btn {
    font-size: 1.3rem;
  }
  .section_form form .btn_row {
    padding-top: 2rem;
  }
  footer .dop,
  footer .dop2 {
    display: none;
  }
  .arrow_next_screen {
    bottom: 2rem;
  }
}