#wrapper {
  width: 100%;
  height: auto;
  position: relative;
}

/*==========================
l-header
==========================*/

#l-header {
  background: var(--background-light);
  width: 100%;
  height: auto;
  position: sticky;
  top: 0;
  z-index: 9;
}

@media screen and (max-width: 799px) {
  #l-header {
    display: none;
  }
} 

#l-header_inner {
  position: relative;
}

.l-header_item {
  border-bottom: 1px solid var(--border-light);
  padding: 15px 1.6%;
}

.l-header_item.nowrap {
  padding-right: 0;
}

.l-header_search {
  float: left;
  width: 650px;
  height: 42px;
}

.single .l-header_search {
  width: 600px;
}

.l-header_search form {
  width: 100%;
  height: 100%;
  position: relative;
}

.l-header_search svg {
  fill: #7f8191;
  width: 24px;
  height: 24px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 10px;
  margin: auto;
}

.l-header_search input {
  background-color: var(--tertiary-color);
  border-radius: 6px;
  width: 100%;
  height: 100%;
  padding: 0 20px 0 40px;
}

@media screen and (max-width: 887px) {
  .l-header_item {
    padding: 15px;
  }
  .l-header_search,
  .single .l-header_search {
    float: left;
    width: calc(100% - 120px);
    height: 42px;
  }
}

/*==========================
l-header_min
==========================*/

#l-header_min {
  background: var(--background-light);
  border-bottom: 1px solid var(--border-light);
  display: none;
  width: 100%;
  height: 54px;
  position: sticky;
  top: 0;
  z-index: 1000;
}

@media screen and (max-width: 799px) {
  #l-header_min {
    display: block;
  }
  .l-header_search {
    float: none;
    width: 100%;
  }
  .single .l-header_search {
    width: 100%;
  }
  .l-header_search,.single .l-header_search {
    height: 36px;
  }
  .l-header_search svg {
    width: 21px;
    height: 21px;
  }
  .l-header_search input {
    border-radius: 999px;
    padding: 0 10px 0 34px;
  }
} 

#l-header_min__inner {
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  justify-content: space-between;
  position: relative;
  padding: 9px 15px;
}

#l-header_min__inner .inner-left,
#l-header_min__inner .inner-right {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.min-logo {
  width: 90px;
}

.min-logo a {
  display: block;
}

.min-logo img {
  display: block;
  width: 100%;
}

.min-search {
  width: calc(100% - 120px);
  margin-left: 5px;
}

.min-bar {
  width: 28px;
  height: 28px;
  margin-right: 12px;
}

.min-bar .nav-bar {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24"><path fill="%2310122a" d="M3.5,7 C3.22385763,7 3,6.77614237 3,6.5 C3,6.22385763 3.22385763,6 3.5,6 L20.5,6 C20.7761424,6 21,6.22385763 21,6.5 C21,6.77614237 20.7761424,7 20.5,7 L3.5,7 Z M3.5,12 C3.22385763,12 3,11.7761424 3,11.5 C3,11.2238576 3.22385763,11 3.5,11 L20.5,11 C20.7761424,11 21,11.2238576 21,11.5 C21,11.7761424 20.7761424,12 20.5,12 L3.5,12 Z M3.5,17 C3.22385763,17 3,16.7761424 3,16.5 C3,16.2238576 3.22385763,16 3.5,16 L20.5,16 C20.7761424,16 21,16.2238576 21,16.5 C21,16.7761424 20.7761424,17 20.5,17 L3.5,17 Z"/></svg>');
  background-repeat: no-repeat;
  background-position: center;
  width: 28px;
  height: 28px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  position: relative;
}

.min-bar .nav-bar.btn-close {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24"><path fill="%2310122a" d="M12,11.2928932 L16.1464466,7.14644661 C16.3417088,6.95118446 16.6582912,6.95118446 16.8535534,7.14644661 C17.0488155,7.34170876 17.0488155,7.65829124 16.8535534,7.85355339 L12.7071068,12 L16.8535534,16.1464466 C17.0488155,16.3417088 17.0488155,16.6582912 16.8535534,16.8535534 C16.6582912,17.0488155 16.3417088,17.0488155 16.1464466,16.8535534 L12,12.7071068 L7.85355339,16.8535534 C7.65829124,17.0488155 7.34170876,17.0488155 7.14644661,16.8535534 C6.95118446,16.6582912 6.95118446,16.3417088 7.14644661,16.1464466 L11.2928932,12 L7.14644661,7.85355339 C6.95118446,7.65829124 6.95118446,7.34170876 7.14644661,7.14644661 C7.34170876,6.95118446 7.65829124,6.95118446 7.85355339,7.14644661 L12,11.2928932 Z"/></svg>');
}

.min-menu {
  width: 30px;
  height: 30px;
  position: relative;
}

.min-menu svg {
  fill: #7e818e;
  width: 28px;
  height: 28px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.min-game {
  margin-left: 10px;
}

.min-game a {
  border-radius: 50%;
  display: block;
  width: 30px;
  height: 30px;
  overflow: hidden;
}

.min-game img {
  display: block;
  width: 100%;
  height: auto;
}

/*==========================
drawer-nav
==========================*/

.drawer-nav {
  position: fixed;
  z-index: 999;
  top: 0;
  overflow: hidden;
  width: 100vw;
  height: 100%;
  color: var(--text-light);
  background-color: var(--background-light);
  overflow: hidden;
}

.drawer-nav {
  left: -100%;
  -webkit-transition: left .6s cubic-bezier(.19,1,.22,1);
  transition: left .4s cubic-bezier(.19,1,.22,1);
}

.drawer-nav.is-open {
  left: 0;
}

.drawer-nav_inner {
  width: 100%;
  height: 100%;
  padding: 54px 30px 20px;
  position: relative;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.drawer-nav .nav-close svg {
  width: 24px;
  height: 24px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.mid-nav_close {
  display: none;
  width: 30px;
  height: 30px;
  position: absolute;
  top: 20px;
  left: 20px;
}

.mid-nav_close svg {
  width: 30px;
  height: 30px;
  fill: var(--nav-text-light);
}

@media screen and (min-width: 500px) and (max-width: 1329px) {
  .drawer-nav {
    width: 260px;
  }
  .drawer-nav {
    left: -260px;
  }
  .drawer-nav .nav-close {
    display: block;
  }
  .mid-nav_close {
    display: block;
  }
}

.drawer-nav_block {
  border-bottom: 1px solid var(--border-light);
  padding: 30px 0 20px;
}

.drawer-nav_block:last-child {
  border-bottom: none;
}

.drawer-nav_heading {
  color: var(--nav-text-light);
  font-size: 13px;
  font-weight: bold;
  margin-bottom: 15px;
}

.drawer-nav_item a {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center; 
  padding: 10px 0;
  position: relative;
}

.game-list .drawer-nav_item a {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24"><path fill="%237e818e" d="M17.2928932,13 L7.5,13 C7.22385763,13 7,12.7761424 7,12.5 C7,12.2238576 7.22385763,12 7.5,12 L17.2928932,12 L14.1464466,8.85355339 C13.9511845,8.65829124 13.9511845,8.34170876 14.1464466,8.14644661 C14.3417088,7.95118446 14.6582912,7.95118446 14.8535534,8.14644661 L18.8535534,12.1464466 C19.0488155,12.3417088 19.0488155,12.6582912 18.8535534,12.8535534 L14.8535534,16.8535534 C14.6582912,17.0488155 14.3417088,17.0488155 14.1464466,16.8535534 C13.9511845,16.6582912 13.9511845,16.3417088 14.1464466,16.1464466 L17.2928932,13 Z"/></svg>');
  background-repeat: no-repeat;
  background-position: right;
}

.game-list .drawer-nav_item a:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24"><path fill="%233f8cff" d="M17.2928932,13 L7.5,13 C7.22385763,13 7,12.7761424 7,12.5 C7,12.2238576 7.22385763,12 7.5,12 L17.2928932,12 L14.1464466,8.85355339 C13.9511845,8.65829124 13.9511845,8.34170876 14.1464466,8.14644661 C14.3417088,7.95118446 14.6582912,7.95118446 14.8535534,8.14644661 L18.8535534,12.1464466 C19.0488155,12.3417088 19.0488155,12.6582912 18.8535534,12.8535534 L14.8535534,16.8535534 C14.6582912,17.0488155 14.3417088,17.0488155 14.1464466,16.8535534 C13.9511845,16.6582912 13.9511845,16.3417088 14.1464466,16.1464466 L17.2928932,13 Z"/></svg>');
}

.drawer-nav_item svg {
  fill: var(--nav-text-light);
  width: 24px;
  height: 24px;
  transition: .2s;
}

.drawer-nav_item span {
  color: var(--nav-text-light);
  font-size: 13px;
  padding-left: 10px;
  transition: .2s;
}

.drawer-nav_item.no-icon span {
  padding-left: 0;
}

.drawer-nav_item a:hover svg,
.drawer-nav_item a:hover span {
  color: var(--link-text);
  fill: var(--link-text);
}

@media screen and (max-width: 499px) {
  .drawer-nav_item a:hover svg,
  .drawer-nav_item a:hover span {
    color: var(--nav-text-light);
    fill: var(--nav-text-light);
  }
  .game-list .drawer-nav_item a:hover {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24"><path fill="%237e818e" d="M17.2928932,13 L7.5,13 C7.22385763,13 7,12.7761424 7,12.5 C7,12.2238576 7.22385763,12 7.5,12 L17.2928932,12 L14.1464466,8.85355339 C13.9511845,8.65829124 13.9511845,8.34170876 14.1464466,8.14644661 C14.3417088,7.95118446 14.6582912,7.95118446 14.8535534,8.14644661 L18.8535534,12.1464466 C19.0488155,12.3417088 19.0488155,12.6582912 18.8535534,12.8535534 L14.8535534,16.8535534 C14.6582912,17.0488155 14.3417088,17.0488155 14.1464466,16.8535534 C13.9511845,16.6582912 13.9511845,16.3417088 14.1464466,16.1464466 L17.2928932,13 Z"/></svg>');
  }
}

.drawer-nav_media {
  border: 1px solid var(--border-light);
  border-radius: 50%;
  width: 30px;
  height: 30px;
  overflow: hidden;
}

.drawer-nav_media img {
  display: block;
  width: 100%;
  height: auto;
}

.drawer-overlay {
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.5);
}

.fixed .drawer-overlay {
  display: block;
}

@media screen and (min-width: 1330px) {
  .drawer-nav {
    display: none;
  }
}

/*==========================
l-sidebar
==========================*/

#l-sidebar {
  background: var(--background-light);
  border-right: 1px solid var(--border-light);
  width: 260px;
  height: 100vh;
  padding: 0 20px 20px;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  overflow-y: scroll;
}

#l-sidebar_min {
  border-right: 1px solid var(--border-light);
  display: none;
  width: 72px;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 8;
  overflow-y: scroll;
}

#l-sidebar::-webkit-scrollbar,
#l-sidebar_min::-webkit-scrollbar {
  width: 0;
  height: 0;
}

#l-sidebar::-webkit-scrollbar-thumb,
#l-sidebar_min::-webkit-scrollbar-thumb {
  background-color: #3b4a5f;
  border-radius: 100px;
}

@media screen and (max-width: 1330px) {
  #l-sidebar {
    display: none;
  }
  #l-sidebar_min {
    display: block;
  }
}

@media screen and (max-width: 799px) {
  #l-sidebar_min {
    display: none;
  }
} 

/*==========================
l-sidebar_item
==========================*/

.l-sidebar_logo {
  padding: 25px 20px 0;
}

.l-sidebar_logo h1 a {
  display: block;
  width: 120px;
  height: auto;
}

.l-sidebar_logo h1 img {
  width: 100%;
}

.l-sidebar_block {
  border-bottom: 1px solid var(--border-light);
  padding: 15px 0;
}

.l-sidebar_block:last-child {
  border-bottom: none;
  padding: 15px 0 0 0;
}

.l-sidebar_nav__item,
.l-sidebar_menu__item {
  position: relative;
}

.l-sidebar_nav__item a,
.l-sidebar_menu__item a {
  border-radius: 10px;
  color: var(--nav-text-light);
  display: block;
  font-size: 13px;
  transition: .2s;
}

.l-sidebar_nav__item a:hover,
.l-sidebar_menu__item a:hover {
  background: var(--tertiary-color);
}

.l-sidebar_nav__item a,
.l-sidebar_menu__item a {
  padding: 20px 0 20px 60px;
}

.l-sidebar_menu__item a {
  padding: 20px 0 20px 20px;
}

.l-sidebar_nav__item svg {
  fill: var(--nav-text-light);
  width: 24px;
  height: 24px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 20px;
  margin: auto;
}

.l-sidebar_nav__item.is-active a,
.l-sidebar_menu__item.is-active a {
  background: var(--primary-color);
  color: #fff;
}

.l-sidebar_nav__item.is-active svg {
  fill: #fff;
}

.game-title_item a {
  border-radius: 8px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: 15px 0 15px 20px;
  position: relative;
  transition: .2s;
}

.game-title_item a:hover {
  background: var(--tertiary-color);
}

.game-title_item a:after {
  content: "";
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="%237e818e" d="M12.8414611,12 L10.1203717,8.82539569 C9.94066062,8.61573277 9.96494139,8.30008277 10.1746043,8.1203717 C10.3842672,7.94066062 10.6999172,7.96494139 10.8796283,8.17460431 L13.8796283,11.6746043 C14.0401239,11.8618492 14.0401239,12.1381508 13.8796283,12.3253957 L10.8796283,15.8253957 C10.6999172,16.0350586 10.3842672,16.0593394 10.1746043,15.8796283 C9.96494139,15.6999172 9.94066062,15.3842672 10.1203717,15.1746043 L12.8414611,12 Z"/></svg>');
  background-repeat: no-repeat;
  background-position: center;
  width: 24px;
  height: 24px;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 10px;
  margin: auto;
}

.game-title_icon {
  border: 1px solid var(--border-light);
  border-radius: 50%;
  overflow: hidden;
  -webkit-flex-basis: 28px;
  -ms-flex-preferred-size: 28px;
  flex-basis: 28px;
  height: 28px;
  margin-right: 15px;
}

.game-title_icon img {
  width: 100%;
  display: block;
}

.game-title_name {
  color: #8c8f9b;
  font-size: 13px;
  -webkit-flex-basis: auto;
  -ms-flex-preferred-size: auto;
  flex-basis: auto;
  line-height: 28px;
}

.game-title_item.is-active a {
  background: var(--primary-color);
}

.game-title_item.is-active .game-title_name {
  color: #fff;
  font-weight: 500;
}

/*.game-title_item.is-active .game-title_icon {
  border: 2px solid #fff;
}*/

.game-title_item.is-active a:after {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="%23ffffff" d="M12.8414611,12 L10.1203717,8.82539569 C9.94066062,8.61573277 9.96494139,8.30008277 10.1746043,8.1203717 C10.3842672,7.94066062 10.6999172,7.96494139 10.8796283,8.17460431 L13.8796283,11.6746043 C14.0401239,11.8618492 14.0401239,12.1381508 13.8796283,12.3253957 L10.8796283,15.8253957 C10.6999172,16.0350586 10.3842672,16.0593394 10.1746043,15.8796283 C9.96494139,15.6999172 9.94066062,15.3842672 10.1203717,15.1746043 L12.8414611,12 Z"/></svg>');
}

.copy {
  padding: 60px 20px 0;
  text-align: center;
}

.copy small {
  color: #888;
  font-size: 13px;
}

/*==========================
l-sidebar_min
==========================*/

.l-sidebar_min__inner {
  position: relative;
  height: 100%;
}

.nav-bar,
.min-nav_item{
  width: 72px;
  height: 60px;
  position: relative;
}

.min-nav_item a {
  display: block;
  width: 100%;
  height: 100%;
}

.nav-bar svg,
.min-nav_item a svg,
.min-nav_item a img {
  width: 24px;
  height: 24px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.min-nav_item a img {
  border: 1px solid var(--border-light);
  border-radius: 50%;
  width: 30px;
  height: 30px;
}

.min-nav_item a svg {
  fill: var(--nav-text-light);
}

.min-nav_item.is-active a {
  background: var(--tertiary-color);
}

.min-nav_item.is-active a svg {
  fill: var(--primary-color);
}

/*==========================
container
==========================*/

#l-container {
  width: 100%;
  height: auto;
  margin: 0 auto;
  padding: 0 0 0 260px;
  position: relative;
}

#l-container_inner {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: auto;
  margin: 0 auto;
}

.single #l-container_inner {
  justify-content: center;
}

@media screen and (min-width: 800px) and (max-width: 1330px) {
  #l-container {
    padding: 0 0 0 72px;
  }
}

@media screen and (max-width: 799px) {
  #l-container {
    padding: 0;
  }
}

/*==========================
l-container_main
==========================*/

#l-container #l-container_main {
  background-color: var(--background-light);
  width: 100%;
  height: auto;
  min-height: calc(100vh - 122px);
  padding: 0 0 60px 0;
}

.single #l-container #l-container_main,
.company #l-container #l-container_main,
.contact #l-container #l-container_main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  height: auto;
  margin: 0 auto;
  padding: 0 0 40px;
}

@media screen and (max-width: 1585px) {
  .single #l-container #l-container_main {
    padding: 0 1.6% 40px;
  }
}

@media screen and (max-width: 1078px) {
  .single #l-container #l-container_main {
    display: block;
  }
}

@media screen and (max-width: 887px) {
  .single #l-container #l-container_main {
    padding: 0 15px 30px;
  }
}

@media screen and (max-width: 799px) {
  .single #l-container #l-container_main {
    padding: 0 0 30px 0;
  }
}

@media screen and (min-width: 800px) {
  .company #l-container #l-container_main,
  .contact #l-container #l-container_main {
    background: #f7f7f8;
  }
}

.l-container_main__title {
  font-size: 18px;
  font-feature-settings: "palt";
  padding: 2% 1.6% 0;
}

@media screen and (max-width: 887px) {
  .l-container_main__title {
    padding: 0 15px;
  }
}

.l-container_main__title .count {
  font-size: 14px;
  padding-left: 10px;
}

@media screen and (max-width: 499px) {
  .l-container_main__title {
    margin-bottom: 15px;
    font-size: 15px;
  }
  .l-container_main__title .count {
    font-size: 12px;
    padding-left: 8px;
  }
}

/*==========================
l-container_sub
==========================*/

#l-container_sub {
  -webkit-flex-basis: 420px;
  -ms-flex-preferred-size: 420px;
  flex-basis: 420px;
  height: auto;
  padding: 40px 0 30px;
  position: relative;
}

@media screen and (max-width: 1585px) {
  #l-container_sub {
    padding: 20px 0 30px;
  }
}

@media screen and (max-width: 799px) {
  #l-container_sub {
    padding: 30px 15px 0;
  }
}

@media screen and (max-width: 499px) {
  #l-container_sub {
    padding: 0;
  }
}

.sub-block {
  margin-bottom: 40px;
}

.sub-block:last-child {
  margin-bottom: 0;
  width: 100%;
  height: auto;
  position: -webkit-sticky;
  position: sticky;
  top: 151px;
}

.sub-block_heading {
  font-size: 21px;
  font-weight: bold;
  margin-bottom: 20px;
  letter-spacing: normal;
}

.sub-block_heading a {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="%233f8cff" d="M12.8414611,12 L10.1203717,8.82539569 C9.94066062,8.61573277 9.96494139,8.30008277 10.1746043,8.1203717 C10.3842672,7.94066062 10.6999172,7.96494139 10.8796283,8.17460431 L13.8796283,11.6746043 C14.0401239,11.8618492 14.0401239,12.1381508 13.8796283,12.3253957 L10.8796283,15.8253957 C10.6999172,16.0350586 10.3842672,16.0593394 10.1746043,15.8796283 C9.96494139,15.6999172 9.94066062,15.3842672 10.1203717,15.1746043 L12.8414611,12 Z"/></svg>');
  background-repeat: no-repeat;
  background-position: right;
  color: #3f8cff;
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
  font-weight: normal;
  line-height: 18px;
  padding: 0 20px 0 10px;
}

@media screen and (max-width: 499px) {
  .sub-block_heading {
    font-size: 18px;
    padding: 0 15px;
    margin-bottom: 10px;
  }
  .sub-block_heading a {
    display: none;
  }
}