@charset "UTF-8";.nav * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0
}

.nav object {
  pointer-events: none
}

.nav ul,.nav li {
  list-style: none
}

.nav a {
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  color: #fff
}
.nav svg {
  display: block
}

.nav input {
  outline: 0
}

.nav i {
  font-style: normal
}

@font-face {
  font-family: "nav_all";
  src: url("https://www.pubgmobile.com/act/resource/long_cache_30d/fonts/all.ttf")
}

.nav {
  font-family: "nav_all",Arial,Helvetica,sans-serif
}

@font-face {
  font-family: "nav_tr";
  src: url("https://www.pubgmobile.com/act/resource/long_cache_30d/fonts/tr.otf")
}

.tr .nav {
  font-family: "nav_tr",Arial,Helvetica,sans-serif
}

@font-face {
  font-family: "nav_ar";
  src: url("https://www.pubgmobile.com/act/resource/long_cache_30d/fonts/ar.ttf")
}

.ar .nav {
  font-family: "nav_ar",Arial,Helvetica,sans-serif;
  direction: rtl;
  letter-spacing: 0
}

@font-face {
  font-family: "nav_ru";
  src: url("https://www.pubgmobile.com/act/resource/long_cache_30d/fonts/ru.ttf")
}

.ru .nav {
  font-family: "nav_ru",Arial,Helvetica,sans-serif
}

@font-face {
  font-family: "nav_th";
  src: url("https://www.pubgmobile.com/act/resource/long_cache_30d/fonts/th.ttf")
}

.th .nav {
  font-family: "nav_th";
  font-family: "nav_th",Arial,Helvetica,sans-serif;
  letter-spacing: 0
}

@font-face {
  font-family: "nav_vi";
  src: url("https://www.pubgmobile.com/act/resource/long_cache_30d/fonts/vi.ttf")
}

.vi .nav {
  font-family: "nav_vi",Arial,Helvetica,sans-serif;
  letter-spacing: 0
}

.HK .nav,.TW .nav,.zh .nav {
  font-family: "Noto Sans TC","Microsoft JhengHei","PingFangTC-Regular",sans-serif;
  letter-spacing: 0
}

.nav .auto_img {
  display: block;
  width: 100%
}

.nav .no_scrollbar::-webkit-scrollbar {
  width: 0;
  height: 0;
  border-radius: calc(50 / 1920 * 100vw)
}

.nav .no_scrollbar::-webkit-scrollbar-thumb {
  box-shadow: inset 0 0 2px #293988;
  -webkit-box-shadow: inset 0 0 0 #212f4c;
  background: #ffdf76;
  border-radius: calc(50 / 1920 * 100vw);
  border: 1px solid #231b3c
}

.nav .no_scrollbar::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,0);
  background-color: #21252c;
  border-radius: calc(50 / 1920 * 100vw)
}

.nav {
  height: 80px;
  background-color: #0c0c0c;
  position: fixed;
  width: 100%;
  top: 0;
  z-index: 13;
  line-height: initial;
  font-size: initial;
}

.nav .navlogo {
  width: 70px;
  line-height: 0;
  height: 53px;
  display: block;
  position: absolute;
  top: 14px;
  left: calc(37 / 1920 * 100vw)
}

.nav .nav_list {
  display: flex;
  position: absolute;
  top: 0;
  left: calc(160 / 1920 * 100vw)
}

.nav .nav_list_m {
  display: none
}

.nav .nav_item {
  color: #fff;
  justify-content: center;
  padding: 0 calc(15 / 1920 * 100vw);
  font-size: calc(28 / 1920 * 100vw);
  font-size: 18px;
  line-height: 80px;
  text-transform: uppercase;
  white-space: nowrap;
  transition: all .66s linear;
  background: #000;
  background: url(../img/nav_on.png) center bottom / 100% 0 no-repeat
}

.ar .nav .nav_list {
  direction: ltr
}

.ar .nav_list span {
  direction: rtl
}

.nav .nav_item:hover {
  color: #ffca13;
  background: url(../img/nav_on.png) center bottom / 100% 100% no-repeat
}

.nav .nav_right {
  display: flex;
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  justify-content: center;
  align-items: center
}

.ar .nav .nav_right {
  direction: ltr
}

.ar .nav .nav_right * {
  direction: rtl
}

.nav .btn_icon {
  display: flex;
  align-items: center;
  margin: 0 calc(14 / 1920 * 100vw);
  height: 100%
}

.nav .btn_icon.on:not(.btn_shop)::after {
  content: "";
  position: absolute;
  bottom: 0;
  height: 1px;
  width: 21px
}

.nav .btn_icon>a {
  display: block;
  position: relative;
}

.nav .btn_icon.btn_shop>a {
  width: 21px;
  height: 21px;
  line-height: 0;
}

.nav .btn_icon.btn_language>a {
  width: 20px;
  height: 20px;
  line-height: 0;
}

.nav .btn_icon.btn_menu {
  display: none
}

.nav .btn_icon.btn_menu>a {
  width: 21px;
  height: 20px
}

.nav .btn_icon.btn_download {
  width: 148px;
  height: 37px;
  background: #ffca13;
  border-radius: 7px;
  transition: all .3s linear;
  width: 37px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.nav .btn_icon.btn_download:hover {
  background-color: #ffbe21
}

.nav .btn_download_icon {
  position: absolute;
  left: 15px;
  width: 20px;
  height: 21px;
  line-height: 0;
  left: 9px
}

.nav .btn_icon .btn_download_text {
  position: relative;
  padding-left: 35px;
  text-align: center;
  line-height: 37px;
  text-transform: uppercase;
  color: #0c0c0c;
  font-size: 22px;
  display: none
}

.nav .language_list {
  position: absolute;
  right: 0;
  top: calc(100% - 1px);
  height: auto;
  max-height: calc(100%-80px);
  background-color: rgba(25,25,26,0.85);
  padding-bottom: calc(15 / 1920 * 100vw);
  display: none
}

.ar .nav .language_list {
  direction: ltr
}

.ar .nav .language_list span {
  direction: rtl
}

.nav .language_list_pc {
  max-height: calc(100vh - 80px);
  overflow: auto;
  width: 3rem;
}
.nav .btn_language{
  position: relative;
}
.nav .btn_language.on .language_list {
  display: block
}

.nav .language_item {
  color: #fff;
  white-space: nowrap;
  display: block;
  width: 100%;
  height: 36px;
  line-height: 36px;
  font-size: 16px;
  padding: 0 30px;
  transition: all .2s linear;
  background: url(../img/nav_language_on.png) center left / 0 100% no-repeat
}

.nav .language_item:hover,.nav .language_item.on {
  background-size: 100% 100%
}

@media only screen and (max-width: 1650px) and (min-width:1051px) {
  .nav .btn_icon {
      margin:0 14px
  }

  .nav .language_list {
      /* left: 0; */
      right: 0
  }

  .nav .btn_icon.btn_download {
      width: 37px;
      border-radius: 9px
  }

  .nav .btn_download_icon {
      top: 8px;
      left: 9px
  }

  .nav .btn_icon .btn_download_text {
      display: none
  }
}

@media only screen and (max-width: 1650px) {
  .nav .nav_list {
      display:none
  }

  .nav .nav_list_m.on {
      display: block
  }

  .nav .nav_list_m {
      position: absolute;
      left: unset;
      right: 0;
      top: calc(100% - 1px);
      height: auto;
      max-height: calc(100%-80px);
      background-color: rgba(25,25,26,0.85);
      padding-bottom: calc(15 / 1920 * 100vw);
      display: none;
      max-height: calc(100vh - 80px);
      overflow: auto
  }

  .nav .nav_list_m .on .nav_list {
      display: block
  }

  .nav .nav_list_m .nav_item {
      color: #fff;
      white-space: nowrap;
      display: block;
      width: 100%;
      height: 36px;
      line-height: 36px;
      font-size: 16px;
      padding: 0 30px;
      transition: all .2s linear;
      background: url(../img/nav_language_on.png) center left / 0 100% no-repeat
  }

  .nav .nav_list_m .nav_item:hover,.nav .nav_list_m .nav_item.on {
      background-size: 100% 100%
  }

  .nav .btn_icon.btn_menu {
      display: block
  }

  .nav .btn_icon {
      margin: 0 14px
  }
}

@media only screen and (max-width: 600px) {
  .nav .btn_icon.btn_download {
      width:51px
  }

  .nav .btn_download_icon {
      top: 12px;
      left: 13px
  }

  .nav .btn_icon .btn_download_text {
      display: none
  }

  .nav .nav_list {
      position: absolute;
      top: 80px;
      width: 100%;
      left: 0;
      height: calc(100vh - 80px);
      overflow: auto;
      background: rgba(0,0,0,0.9);
      display: none
  }

  .nav .nav_list.on {
      display: block
  }

  .nav .nav_list_m.on {
      display: none
  }

  .nav .nav_item {
      display: block;
      padding: 0;
      font-size: calc(28 / 640 * 100vw);
      height: calc(92 / 640 * 100vw);
      line-height: calc(92 / 640 * 100vw);
      margin-bottom: calc(28 / 640 * 100vw);
      width: calc(514 / 640 * 100vw);
      margin-left: calc(34 / 640 * 100vw);
      position: relative;
      transition: none
  }

  .nav .nav_item:hover {
      color: #fff;
      background: 0
  }

  .nav .nav_item::after {
      content: "";
      position: absolute;
      bottom: 0;
      width: 100%;
      height: 1px;
      background: rgba(255,255,255,0.21);
      left: 0
  }

  .nav .nav_item.on {
      color: #fff;
      background: 0
  }

  .nav .nav_item span {
      display: inline-block;
      position: relative
  }

  .nav .nav_item:hover span::after {
      content: "";
      position: absolute;
      bottom: 0;
      width: 100%;
      height: 1px;
      background: #ffca13;
      left: 0
  }

  .nav .btn_icon {
      margin: 0 calc(22 / 640 * 100vw)
  }

  .nav .btn_icon.on:not(.btn_shop)::after {
      width: calc(34 / 640 * 100vw)
  }

  .nav .btn_icon.btn_shop>a {
      width: calc(38 / 640 * 100vw);
      height: calc(38 / 640 * 100vw)
  }

  .nav .btn_icon.btn_language>a {
      width: calc(38 / 640 * 100vw);
      height: calc(38 / 640 * 100vw)
  }

  .nav .btn_icon.btn_menu>a {
      width: calc(38 / 640 * 100vw);
      height: calc(38 / 640 * 100vw)
  }

  .nav .btn_icon.btn_download {
      width: calc(75 / 640 * 100vw);
      height: calc(75 / 640 * 100vw);
      border-radius: calc(10 / 640 * 100vw)
  }

  .nav .btn_download_icon {
      top: calc(21 / 640 * 100vw);
      left: calc(21 / 640 * 100vw);
      width: calc(34 / 640 * 100vw);
      height: calc(34 / 640 * 100vw)
  }

  .nav .btn_language.on .language_list_pc {
      display: none
  }

  .nav .language_list_m.on {
      display: block
  }

  .nav .language_list_m.on {
      display: block;
      position: absolute;
      top: 80px;
      width: 100%;
      left: 0;
      background: rgba(0,0,0,0.9);
      height: calc(100vh - 80px);
      overflow: auto
  }

  .nav .language_item {
      display: block;
      padding: 0;
      font-size: calc(28 / 640 * 100vw);
      height: calc(92 / 640 * 100vw);
      line-height: calc(92 / 640 * 100vw);
      margin-bottom: calc(28 / 640 * 100vw);
      width: calc(514 / 640 * 100vw);
      margin-left: calc(34 / 640 * 100vw);
      position: relative;
      background: 0
  }

  .nav .language_item::after {
      content: "";
      position: absolute;
      bottom: 0;
      width: 100%;
      height: 1px;
      background: rgba(255,255,255,0.21);
      left: 0
  }

  .nav .language_item:hover {
      color: #fff;
      background: 0
  }

  .nav .language_item span {
      display: inline-block;
      position: relative
  }

  .nav .language_item:hover span::after {
      content: "";
      position: absolute;
      bottom: 0;
      width: 100%;
      height: 1px;
      background: #ffca13;
      left: 0
  }
}

@media only screen and (max-width: 500px) {
  .nav {
      height:calc(108 / 640 * 100vw);
  }
  .main{
    
    margin-top: calc(108 / 640 * 100vw);
  }

  .nav .navlogo {
      width: calc(94 / 640 * 100vw);
      height: calc(70 / 640 * 100vw);
      top: calc(18 / 640 * 100vw);
      left: calc(17 / 640 * 100vw)
  }

  .nav .nav_list {
      top: calc(108 / 640 * 100vw);
      height: calc(100vh - 108 / 640 * 100vw);
      padding-bottom: calc(108 * 2 / 640 * 100vw)
  }

  .nav .language_list_m.on {
      top: calc(108 / 640 * 100vw);
      height: calc(100vh - 108 / 640 * 100vw);
      padding-bottom: calc(108 * 2 / 640 * 100vw)
  }
}

.navar .nav_item {
  font-size: 13px
}

.navru .nav_item {
  font-size: 16px
}

.navpt .nav_item {
  font-size: 16px
}

.navmy .nav_item {
  font-size: 16px
}

.navuz .nav_item {
  font-size: 16px
}

.qrcode {
  position: relative
}

.downloadqrcode {
  position: absolute;
  right: -1000px;
  top: 70px;
  border-radius: 8px;
  background: #f0f0f0;
  width: 230px;
  height: 230px;
  transition: all .5s
}

.downloadqrcodeimg {
  transform: translateX(15px)translateY(15px);
  width: 200px;
  height: 200px
}

.downloadqrcode {
  direction: ltr !important;
  opacity: 0
}

a {
  text-decoration: none
}

;.ar .downloadqrcode {
  direction: ltr
}

.downloadicon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%)translateY(-50%);
  width: 50px;
  height: 50px
}

.ar .language_list li a {
  direction: ltr !important
}

.apk-btn,.apple-btn,.qrcode {
  visibility: hidden
}

.nav .qrcode {
  display: none
}

a[href="https://f.gbcass.com/PUBGMOBILE_Global_3.3.0_uawebsite_livik01_B6B3B7F5AE.apk"] {
  display: none !important
}
