::after,
::before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #111; 
}
::-webkit-scrollbar-thumb {
  background: #005440;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #f42a41;
}
html { scroll-behavior: smooth; /* 點擊錨點時平滑捲動 */}
.rtConner{ border-top-right-radius: 15px;}
.dotlottie-bullet{
  width: 85px;
  height: 85px;
  display: inline-block;
  margin-top: -26px;
  margin-left: -40px;
}
.langstyle a{
  display: inline-block;
  width: 35px !important;
  height: 35px !important;
  background: #005440;
  border-radius: 35px;
  color: #FFF;
  padding: 0;
  text-align: center;
  line-height: 35px;
  font-weight: bolder;
  border: 2px solid #00ffb6;
}
.langstyle a:hover{ background: #FFF; color:#005440; border: 2px solid #999;}

/*↓===================================================
⫸ INDEX
==↑=================================================*/
section#top-section .slogans .cs-logo-en{ width:150px;}
nav.nav ul.right-links li.register-button{ padding: 0 2px;}

section#top-section .gamania-group-icons{ width: 360px; }
section#top-section .slogans h2{ margin: 6px 0px 0px 0px; }
section#top-section .slogans{ background: rgba(0,0,0,.55); border-radius: 25px; padding-top: 25px; padding-bottom: 25px; }
.indexTOPtarea{
  line-height: 20px;
  margin: 25px 0;
}
.indexTOPtarea p{ margin-top: 5px;}
.banner-left-btn {
  position: absolute;
  top: 46px;
  left: 15px;
  color: #fff;
  z-index: 100;
  cursor: pointer;
  display: none;
}
.banner-right-btn {
  position: absolute;
  top: 46px;
  right: 15px;
  color: #fff;
  z-index: 100;
  cursor: pointer;
  display: none;
}
.banner-progress {
  display: flex;
  position: absolute;
  z-index: 100;
  bottom: 10px;
  left: 50%;
  transform: translate(-50%, 0);
}
.banner-dot {
  width: 50px;
  border-top: 6px solid rgba(0, 0, 0, 0.5);
  margin-right: 5px;
  border-radius: 30px;
}
.banner-dot.active {
  border-top: 6px solid white;
}

/*↓===================================================
⫸ HEADER
==↑=================================================*/
section#mode-hero .mode-hero-text h2{
  font-size: 55px;
  width: 787px;
  font-weight: 500;
}
/*↓===================================================
⫸ MAIN
==↑=================================================*/
section#mode-intro .mode-details .mode-content-wrapper{
  padding: 16px;
  height: 410px;
  background: url("../jita/EventWWW/AFD/official2025/assets/img/game-mode/mode/mode-content-wrapper.png") 0 0 / 100% 100% no-repeat;
}
section#mode-intro .mode-details .mode-label{ margin-bottom: 0; }
section#mode-intro .mode-details .mode-content-wrapper.s2{ height: 480px;}
section#mode-intro .mode-details .mode-name{ max-width: 350px; font-size:27px; }
section#mode-intro .mode-details .mode-describe{ line-height: 26px;}
section#mode-intro .mode-details .yt-link .icon-with-text{ margin-top: -65px; height: 20px; font-size:16px;}

section#play-game-section{ background: rgba(0,0,0,.58);}

.herobox{
  width: 70%;
  margin: -110px auto 0;
  line-height: 26px;
}
.heroul{ margin-bottom: 15px; }
.heroul li{ text-indent: 28px; }

/*↓===================================================
⫸ FOOTER
==↑=================================================*/
.m-show {
    display: none;
}
.UNI-footer * {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    box-sizing: border-box;
}

.UNI-footer img {
    display: inline-block;
}
.UNI-footer {
    font-family: "PingFangTC-Regular", "Heiti TC", "Noto Sans TC", "Microsoft JhengHei", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

.UNI-footer.bfgame .gradeArea {
    display: none;
}
.UNI-footer.hasBF {
    /* margin-bottom: 35px; */
    padding-bottom: 35px;
    border-top: 3px solid #ff8300;
}

.UNI-footer.dark {
    background-color: #000;
    color: #fff !important;
}

.UNI-footer.dark p,
.UNI-footer.dark li {
    color: #fff !important;
}

.UNI-footer.light p,
.UNI-footer.light li {
    color: #000 !important;
}

.UNI-footer.light {
    background-color: #fff;
    color: #000 !important;
}

.UNI-footer.dark .inner-wrap {
    background-color: #000;
}

.UNI-footer.light .inner-wrap {
    background-color: #fff;
}

.UNI-footer .inner-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    /* width: 1024px; */
    padding: 10px 0;
    margin: 0 auto;
    font-size: 12px;
    text-align: left;
}
.UNI-footer .logoArea,
.UNI-footer .gradeArea {
    white-space: nowrap;
}
/*
.UNI-footer .logoArea:before {
  content: "";
  display: inline-block;
  height: 34px;
  width: 40px;
  margin-right: 10px;
  background: url('https://tw.hicdn.beanfun.com/beanfun/GamaWWW/allProducts/images/footer/logos/logo-gama.png') left top no-repeat;
} */

.UNI-footer .logoArea__link {
  display: inline-block;
  margin: 0 5px;
  cursor: default;
}

.UNI-footer .logoArea__link[href="javascript:;"] {
  pointer-events: none;
}

.UNI-footer .logoArea__link img {
  height: 34px;
  width: auto;
}
.UNI-footer.oneBrand .logoArea__link img {
  height: auto;
  width: auto;
  max-height:50px;
}
.UNI-footer.oneBrand .logoArea__link {
    vertical-align: middle;
}
.UNI-footer .gradeArea .gradeArea__img {
    display: inline-block;
    vertical-align: middle;
}
.UNI-footer .gradeArea .gradeArea__img img {
    height: 50px;
}
.UNI-footer .gradeArea .gradeArea__list {
    display: inline-block;
    vertical-align: middle;
    padding: 0;
    margin: 0 0 0 5px;
    list-style: none;
    max-width: 330px;
}
.UNI-footer .gradeArea .gradeArea__list li {
    /* font-size: 10px; */
    width: calc(100% * (12 / 10));
    transform: scale(0.83);
    transform-origin: 0%;
    line-height: 1.5em;
}
.UNI-footer .gradeArea .gradeArea__list li::before {
    content: "■ ";
    position: relative;
    top: -1px;
}
.UNI-footer .copyrightArea {
  text-align: center;
  max-width: 400px;
  padding: 0 15px;
  font-size: 13px;
}
.UNI-footer .copyrightArea p {
    margin: 0;
    /* font-size:10px */
    width: calc(100% * (12 / 10));
    transform: scale(0.83);
    transform-origin: 0%;
    line-height: 1.5em;
}
/*-----------壹版到底 Hack-----------*/
.UNI-footer.vp .copyrightArea { max-width: 600px;}
.UNI-footer.vp .copyrightArea p,
.UNI-footer.viewport .gradeArea .gradeArea__list li {
  font-size: 20px;
  width: inherit;
  transform: inherit;
}
.UNI-footer.vp .gradeArea .gradeArea__img img {height: 80px;}
/*-----------壹版到底 Hack end-----------*/

/*-----------IE Hack-----------*/
/*IE8+9*/
.UNI-footer.ieLet10 .inner-wrap { display: table;}
.UNI-footer.ieLet10 .logoArea,
.UNI-footer.ieLet10 .gradeArea,
.UNI-footer.ieLet10 .copyrightArea {
    display: table-cell;
    vertical-align: middle;
}
/*IE8*/
.UNI-footer.ie8 .copyrightArea p,
.UNI-footer.ie8 .gradeArea .gradeArea__list li { font-size: 10px;}
/*-----------IE Hack end-----------*/

@media screen and (max-width: 1024px) {
    .UNI-footer .inner-wrap {
      width: 100%;
      padding: 15px;
    }
}
@media screen and (max-width: 1024px) {
    .m-hide { display: none;}
    .m-show { display: block;}
    .UNI-footer .logoArea,
    .UNI-footer .groupLogoArea,
    .UNI-footer .gradeArea .gradeArea__list {
      display: none;
    }
    .UNI-footer .copyrightArea {
      min-width: auto;
      padding: 0 20px 0 0;
    }

    .UNI-footer.bfgame .copyrightArea {
      padding: 0;
    }
  
  .UNI-footer .copyrightArea p{
    text-align:center;
  }
}

/*↓===================================================
⫸ MEDIA
==↑=================================================*/
 @media screen and (min-width: 1280px) {
  .sound_link { display: block;}
  .sound_span { margin-right: 40px;}
  #sound_control {
    position: absolute;
    margin-top: 35px;
  }
}

@media screen and (max-width: 767px) {
  section#mode-intro .mode-details{
    margin: 5px auto 0 0 ;
  }
  section#mode-intro .mode-details .mode-name{
    top: 66px;
    left: 15px;
    font-size: 22px;
  }
  section#mode-intro .mode-details .mode-describe{
    margin-top: 50px;
    width: 315px;
  }
  section#play-game-section{ height: 275px; margin-top: 25px; padding-top: 25px;}
  section#play-game-section .play-game-wrapper{
    margin-top: 0;
  }

  #footer-logos img{
    width: 320px !important;
    margin-bottom: 20px !important;
    padding-left: 56px !important;
  }

  .toggle-nav-btn-mobile{ top: 18px;}
  nav.nav.is-open{ transform: translateX(2.2%);}
  nav.nav{ background: rgba(0,0,0,.95); }
  nav.nav ul.right-links li.link{ height: 18px;}
  nav.nav ul.right-links li.register-button{ margin-top: 5px;}
  nav.nav ul.right-links li a{ line-height: 34px;}
  nav.nav ul.right-links li.mobile-links{ flex-wrap: nowrap; }
  section#top-section .slogans { top: 52vw;}
  section#top-section .slogans p{ text-align: center; margin-left: 36px; }
  section#mode-intro .mode-details .mode-content-wrapper{ width: 400px; }

  .herobox{ width: 98%; margin:-30px auto 0;}
}

/*↓===================================================
⫸ LANGEUAGE [孟lang-bn(Default) / 英lang-en / 中lang-zh]
==↑=================================================*/
body.lang-bn section#top-section .slogans p{ margin-right: 0; }
body.lang-bn section#top-section .slogans p{ line-height: 27px;}
body.lang-bn section#mode-intro .mode-details .mode-describe{ line-height: 20px;}
body.lang-bn section#mode-intro .mode-details .hot-mode{ max-width: 330px; }
body.lang-bn section#mode-intro .mode-block.mBox1{ margin-bottom: 280px;}
body.lang-bn section#mode-intro .mode-details .mode-content-wrapper.mctBox1{ height: 600px;}
body.lang-bn section#mode-intro .mode-details .mode-content-wrapper.mctBox3{ height: 520px;}
body.lang-bn section#play-game-section .play-game-wrapper{ width: 458px;}
body.lang-bn section#play-game-section .play-game-wrapper div.social-medias div.header-with-icons:first-child{ width: 220px;}
body.lang-bn section#play-game-section .play-game-wrapper div.social-medias div.header-with-icons:last-child{ width: 120px;}

body.lang-en section#top-section .slogans p{ margin-right: 0; }
body.lang-en section#top-section .slogans p{ line-height: 27px;}
body.lang-en section#mode-intro .mode-details .mode-describe{ line-height: 20px;}
body.lang-en section#mode-intro .mode-details .hot-mode{ max-width: 330px; }
body.lang-en section#mode-intro .mode-block.mBox1{ margin-bottom: 235px;}
body.lang-en section#mode-intro .mode-details .mode-content-wrapper.mctBox1{ height: 555px;}
body.lang-en section#mode-intro .mode-details .mode-content-wrapper.mctBox3{ height: 520px;}
body.lang-en section#play-game-section .play-game-wrapper{ width: 458px;}
body.lang-en section#play-game-section .play-game-wrapper div.social-medias div.header-with-icons:first-child{ width: 198px;}
body.lang-en section#play-game-section .play-game-wrapper div.social-medias div.header-with-icons:last-child{ width: 148px;}
body.lang-en section#play-game-section .play-game-wrapper div.social-medias{ font-size: 14px;}

@media screen and (max-width: 767px) {
  body.lang-zh section#mode-intro .mode-details .mode-describe{ line-height: 22px;}
  body.lang-zh section#mode-intro .mode-details .mode-content-wrapper.mctBox2{ height: 368px;}
  body.lang-zh section#mode-intro .mode-details .mode-content-wrapper.mctBox3{ height: 408px;}
  body.lang-zh section#mode-intro .mode-details .mode-content-wrapper.mctBox4{ height: 322px;}

  body.lang-bn section#mode-intro .mode-details .mode-describe{ margin-top: 105px;}
  body.lang-bn section#mode-intro .mode-details .yt-link { margin: 7px 0 0 calc(90vw - 180px);}
  body.lang-bn section#mode-intro .mode-details .yt-link .icon-with-text{ font-size: 13px;}
  body.lang-bn section#mode-intro .mode-block.mBox1{ margin-bottom: 25px;}
  body.lang-bn section#mode-intro .mode-details .mode-content-wrapper.mctBox4{ height: 378px;}

  body.lang-en section#mode-intro .mode-details .mode-describe{ margin-top: 105px;}
  body.lang-en section#mode-intro .mode-details .yt-link { margin: 7px 0 0 calc(90vw - 180px);}
  body.lang-en section#mode-intro .mode-details .yt-link .icon-with-text{ font-size: 13px;}
  body.lang-en section#mode-intro .mode-block.mBox1{ margin-bottom: 25px;}
  body.lang-en section#mode-intro .mode-details .mode-content-wrapper.mctBox4{ height: 378px;}
}