@import url('https://fonts.googleapis.com/css2?family=Gowun+Dodum&family=Noto+Sans+KR:wght@400;700&display=swap');
:root {
	--gs-backgroundcolor: #081617;
  --gs-primarycolor: #ffc111;
  --gs-neoncolor: #ffc111;
}
body {
	font-family: 'Noto Sans KR', sans-serif;
  font-size: 15px;
  background-color: var(--gs-backgroundcolor);
}
.wrapper {width: 100%; min-width: auto; height: auto; position: relative; overflow: hidden;}
.mw {width: 1500px; margin: 0 auto;}
.top_banner {position:relative;width: 100%;min-width:1500px;height: 500px;display: flex;justify-content: center;align-items: center;background-image: url('/front/images/main_background.jpg');background-size: cover;background-position:top center;box-shadow: 0px -4px 16px 0px rgba(0, 0, 0, 0.60) inset;padding-bottom: 0px;}
.top_banner--logo {height:300px;animation: bounceIn 10s infinite; position: relative;margin-top:-10%}
.bf-left {width:260px;position:absolute;left:5%;top:10%}
.bf-left2 {width:400px;position:absolute;left:10%;top:0%}
.bf-right {position:absolute;right:0;top:0}
		
@keyframes bounceIn {0%,5%,10%,15%,20%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}5%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}10%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}15%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}20%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}to{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes bounceIn{0%,10%,20%,30%,40%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}5%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}10%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}15%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}20%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}to{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}}.animate__bounceIn{-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-duration:calc(var(--animate-duration)*.75);animation-duration:calc(var(--animate-duration)*.75);-webkit-animation-name:bounceIn;animation-name:bounceIn}@-webkit-keyframes bounceInDown{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0) scaleY(3);transform:translate3d(0,-3000px,0) scaleY(3)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0) scaleY(.9);transform:translate3d(0,25px,0) scaleY(.9)}75%{-webkit-transform:translate3d(0,-10px,0) scaleY(.95);transform:translate3d(0,-10px,0) scaleY(.95)}90%{-webkit-transform:translate3d(0,5px,0) scaleY(.985);transform:translate3d(0,5px,0) scaleY(.985)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}
.header {width:100%;position: relative;margin-top:-62px;background: linear-gradient(0deg, #081617 0%, rgba(8, 22, 23, 0.80) 100%);box-shadow: 0px -16px 16px 0px rgba(0, 0, 0, 0.25);}
.header_login {display:flex;align-items:center;gap:16px;margin-left:auto;color:#fff}
.header_login i {color:#fff;font-size:18px;vertical-align:-2px}
.header_login input {width: 150px;border-radius: 8px;padding: 4px 12px;border: 1px solid #fff;  background: rgba(255, 255, 255, 0.60);}
.header_login--btn {width: 120px;color: #fff;border-radius: 20px;background-size: 100% auto;font-family: inherit;font-size: 15px;padding: 0.6em 1.5em;transition: 0.3s;}
.header_login--btn:hover {background-position: right center;background-size: 200% auto;-webkit-animation: pulse 2s infinite;animation: pulse512 1.5s infinite;}
.header_login--btn.btn-join:hover {background-position: right center;background-size: 200% auto;-webkit-animation: pulse 2s infinite;animation: pulse513 1.5s infinite;}
@keyframes pulse512 {
	0% {box-shadow: 0 0 0 0 #4ce3f770;}
	70% {box-shadow: 0 0 0 10px rgb(218 103 68 / 0%);}
	100% {box-shadow: 0 0 0 0 rgb(218 103 68 / 0%);}
}
@keyframes pulse513 {
	0% {box-shadow: 0 0 0 0 #f6745b70;}
	70% {box-shadow: 0 0 0 10px rgb(218 103 68 / 0%);}
	100% {box-shadow: 0 0 0 0 rgb(218 103 68 / 0%);}
}
.header_login--btn.btn-login {background-image: linear-gradient(to right, #314755 0%, #26a0da  51%, #314755  100%);}
.header_login--btn.btn-join {cursor:pointer;text-align:center;background-image: linear-gradient(to right, #FF512F 0%, #F09819  51%, #FF512F  100%);}
.header_logout--btn {cursor:pointer;width: 120px;color: #fff;border-radius: 20px;background-size: 100% auto;font-family: inherit;font-size: 15px;padding: 0.6em 1.5em;transition: 0.3s;text-align:center;background-image: linear-gradient(to right, #FF512F 0%, #F09819  51%, #FF512F  100%);}
.header_login--info {display: flex; gap: 16px; color: #fff; align-items: center;}
.header_login--info i {font-size:32px;}
.header_login--info button {color: #fff;}
.header_login--info span{font-weight: 700; padding-right: 4px; color: #f9d023;}

.header_menu {width:1500px;margin:0 auto;display:flex;gap:50px;padding:16px 32px;}
.header_menuItem {display: flex;gap: 8px;align-items: center;color: #fff;cursor: pointer;position: relative;}
.header_menuItem::before {content: '';position: absolute;width: 110%;height: 1px;background-color: var(--gs-neoncolor);bottom: -17px;left: 50%;transform: translateX(-50%);box-shadow: 0px 0px 4px var( --gs-neoncolor),0px -4px 16px var( --gs-neoncolor),0px -4px 32px var(--gs-neoncolor);transition: 0.3s;opacity: 0;}
.header_menuItem:hover::before {opacity: 1;}
.header_menuItem--icon {width: 30px;height: 30px;border-radius: 15px;overflow: hidden;background-color: var(--gs-primarycolor);position: relative;display: flex;align-items: center;justify-content: center;}
.header_menuItem--icon i {font-size: 20px;}
.header_menuItem--icon_hover {position: absolute;width: 30px;height: 30px;top: 0;left: 0;right: 0;bottom: 0;opacity: 0;transition: 0.3s;}
.header_menuItem:hover .header_menuItem--icon_hover {opacity: 1;animation: menuWheelAnim 1s linear infinite;}
@keyframes menuWheelAnim {
0% {transform: rotate(0deg);}
100% {transform: rotate(-360deg);}
}
.header_menuItem--text {color: var(--gs-primarycolor);transition: 0.3s;}
.header_menuItem:hover .header_menuItem--text {color: #fff;}

.main_content {width: 100%; height: 100%;position: relative;}
.main_content::before {content: '';width: 100%; height: 100%;position: absolute;top:0;left:0;right:0;bottom:0;opacity: 0.4;background-image: url(/front/images/main_bg.jpg);background-position: center;background-size: cover;background-attachment: fixed;z-index: -1;}
.main_gamelistWrap {width:1500px;margin:0 auto;display: flex;flex-direction: column;gap: 64px;padding: 64px 24px;}
.main_gamelist_tabmenu {display: flex;gap: 100px;padding: 0px 120px;margin: 0 auto;border-radius: 64px;border: 1px solid rgba(129, 227, 234, 0.60);background: rgba(8, 22, 23, 0.80);box-shadow: 0px 0px 16px 0px var(--gs-neoncolor), 0px 0px 32px 0px var(--gs-neoncolor), 0px 0px 64px 0px var(--gs-neoncolor);}
.main_gamelist_tabmenuItem {display: flex;gap: 16px;padding: 24px 0px;align-items: center;justify-content: center;cursor: pointer;}
.main_gamelist_tabmenuItem img {height: 80px; width: auto;mix-blend-mode: luminosity;transition: 0.3s;}
.main_gamelist_tabmenuItem_text {display: flex;flex-direction: column;gap: 8px;font-size: 15px;color: rgba(255, 255, 255, 0.50);text-align: center;}
.main_gamelist_tabmenuItem_text--title {font-size: 24px; font-weight: 700;}
.main_gamelist_tabmenuItem.on img, .main_gamelist_tabmenuItem:hover img {mix-blend-mode: inherit;}
.main_gamelist_tabmenuItem.on .main_gamelist_tabmenuItem_text--title, .main_gamelist_tabmenuItem:hover .main_gamelist_tabmenuItem_text--title {color: #fff;}
.main_gamelist_tabmenuItem.on .main_gamelist_tabmenuItem_text--sub, .main_gamelist_tabmenuItem:hover .main_gamelist_tabmenuItem_text--sub {color: #ffc111;}
.main_gamelist_tabcontent_gamelist {display: none;flex-wrap: wrap;gap: 16px;justify-content: center;}
.main_gamelist_tabcontent_gamelist.on {display: flex;}
.gamelistItem {width: calc(20% - 13px);position: relative;}
.gamelistItem_img {position: relative;width: 100%;padding-top: calc(182 / 284 * 100%);display: flex;justify-content: center;z-index: 1;}
.gamelistItem_img img {position: absolute;}
.gamelistItem_img--bg, .gamelistItem_img--gamebg, .gamelistItem_img--gamemain {width: 100%; height: auto; top: 0; left: 0; transition: 0.3s;}
.gamelistItem.off .gamelistItem_img--gamemain {filter: brightness(50%);}
.gamelistItem_img--bg {filter: drop-shadow(0 5px 5px rgba(0, 0, 0, 0.5));}
.gamelistItem_img--gamebg {opacity: 0.6;}
.gamelistItem_img--gamelogo {max-width: 100px; top: 24px; left: 16px; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 1.0));}
.main_gamelist_tabcontent_gamelist.on .gamelistItem_img--gamemain:not(.glitch) {animation:scaleUp 0.3s linear 1;}
.pvpdiv .gamelistItem_img--gamelogo{max-width: none;height: 38px;top: unset;bottom: 24px;left: 50%;transform: translateX(-50%);}
@keyframes scaleUp {
	0%{
		opacity: 0;
		transform: translateY(10%) scale(0.8);
	}
	100%{
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

.main_gamelist_tabcontent_gamelist.on .gamelistItem_img--gamebg, .main_gamelist_tabcontent_gamelist.on .gamelistItem_img--bg {animation:moveUp 0.3s linear 1;}
@keyframes moveUp {
	0%{
		transform: translateY(10%);
  }
  100%{
		transform: translateY(0);
  }
}
.main_gamelist_tabcontent_gamelist.on .gamelistItem_text {animation:opacityDown 0.3s linear 1;}
@keyframes opacityDown {
	0%{
		opacity: 0;
    transform: translateY(-10%);
  }
  100%{
		opacity: 0.6;
    transform: translateY(0);
  }
}
.main_gamelist_tabcontent_gamelist.on .gamelistItem_img--gamelogo {animation:opacity 0.7s ease 0.2s 1 backwards;}
@keyframes opacity {
	0%{
		opacity: 0;
  }
  100%{
		opacity: 1;
  }
}

.gamelistItem_img--gamemain.glitch {opacity: 0;mix-blend-mode:hard-light;}
.gamelistItem:hover .gamelistItem_img--gamemain.glitch{opacity: 0.3;animation: glitch .2s linear infinite;}
@keyframes glitch {
	0%{
		background-position: 0 0;
    filter:hue-rotate(0deg);
  }
  10%{
		background-position: 5px 0;
  }
  20%{
		background-position: -5px 0;
  }
  30%{
		background-position: 15px 0;
  }
  40%{
		background-position: 5px 0;
  }
  50%{
		background-position: -25px 0;
  }
  60%{
		background-position: -50px 0;
  }
  70%{
		background-position: 0 -20px;
  }
  80%{
		background-position: -60px -20px;
  }
  81%{
		background-position: 0 0;
  }
  100%{
		background-position: 0 0;
    filter:hue-rotate(360deg);
  }
}
.gamelistItem_img--btn {display: flex;gap: 8px;padding: 4px 16px;border-radius: 32px;background-color: #ffc111;color: #fff;align-items: center;border: 2px solid #fff;position: absolute;bottom: 16px;opacity: 0;transition: 0.3s;}
.gamelistItem:hover .gamelistItem_img--btn, .gamelistItem:hover .gamelistItem_img--gamebg {opacity: 1;}
.gamelistItem_img--btn i {font-size: 32px;}
.gamelistItem_img--btn_text {display: flex;flex-direction: column;gap: 8px;}
.gamelistItem_img--btn_bar {width: 100%;height: 3px;position: relative;border-radius: 2px;overflow: hidden;}
.gamelistItem_img--btn_bar::before {content: '';width: 100%;height: 100%;position: absolute;background-color: #fff;left: -60%;transition: 0.3s;border-radius: 2px;}
.gamelistItem:hover .gamelistItem_img--btn_bar::before {animation: barMove 1s linear infinite;}
@keyframes barMove {
	0% {
		left: -60%;
  }
  50% {
		left: 100%;
  }
  50.1% {
		left: -100%;
  }
  100% {
		left: -60%;
  }
}
.gamelistItem_text {display: flex;width: calc(100% - 16px);padding: 16px 10px;margin: 0 auto;justify-content: center;border-radius: 0px 0px 16px 16px;border: 1px solid #ffc111;background: rgb(8 22 23 / 80%);color:#ffc111;position: relative;margin-top: -12px;font-weight: 700;}
.gamelistItem_text::before {content: '';position: absolute;width: 50%;height: 20px;top: -30px;box-shadow: 0 0 50px #ffc111;}

/*social banner*/
.social_banner_wrap {display: flex;justify-content: center;padding-bottom: 64px;}
.social_banner {display: inline-flex;gap: 64px;padding: 16px 24px;border-radius: 60px;border: 1px solid var(--gs-neoncolor);color: #fff;align-items: center;background: rgba(129, 227, 234, 0.10);box-shadow: 0px 0px 20px 0px rgba(129, 227, 234, 0.60);backdrop-filter: blur(2px);animation: boxGlow 1s ease infinite;}
    @keyframes boxGlow {
        0% {
            box-shadow: 0px 0px 20px 0px rgba(129, 227, 234, 0.60);
        }
        33% {
            box-shadow: 0px 0px 10px 0px rgba(129, 227, 234, 0.60);
        }
        66% {
            box-shadow: 0px 0px 40px 0px rgba(129, 227, 234, 0.60);
        }
        100% {
            box-shadow: 0px 0px 20px 0px rgba(129, 227, 234, 0.60);
        }
    }
.social_banner img {height: 60px; width: auto;}
.social_banner_text {display: flex; flex-direction: column; align-items: center;}
.social_banner_text--title {font-size: 20px; font-weight: 700;}
.social_banner_text--id {font-size: 32px; font-weight: 700; color: var(--gs-neoncolor);}

/*board*/
.bottombox{width:100%;position:relative;padding-bottom:64px;}
.bottom-bigbox{width:1500px;margin:0 auto;position: relative;z-index: 9;padding: 0 100px;}
.content-alin{width:100%;display:flex;flex-wrap:wrap;gap:9px;}
.albox{background-color: #141518;border: 2px solid #383C45;}
.content-alin-box{width: calc(100%/2 - 6px);height: auto;}
.albox-title{background-color: #1F2125;height: 60px;line-height: 60px;color: #fff;font-size: 1.2rem;font-weight: 600;padding: 0 20px;display:flex;justify-content:space-between;align-items:center}
.albox-title>a {font-size:1rem;color:#fff}
.alin-table{width: 100%;}
.albox .alin-table{table-layout: fixed;}
.alin-table tr td{padding: 15px 4px;}
.alin-table .alin-table-th01{padding-left: 20px;}
.alin-table .alin-table-th01 a{font-size: 1rem;font-weight: 400;color: #C9C9C9;display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;height: 20px;}
.alin-table-user{font-size: 1rem;font-weight: 400;color: #C9C9C9;}
.alin-table .alin-table-th01 a:hover{color: #e7e7e7;}
.alin-table .alin-table-th02{text-align: right;padding-right: 20px;font-size: 0.875rem;color: #818181;}
/*.alin-table tr:nth-child(even){background-color: #222;}*/
.al-newbage{display: inline-block;width: 35px;height: 15px;line-height: 13px;border-radius: 50px;background: rgb(254,127,64);background: linear-gradient(180deg, rgba(254,127,64,1) 0%, rgba(147,33,4,1) 100%);color: #fff;font-size: 0.625rem;text-align: center;animation: blink-effect 1s step-end infinite;}
.alin-span{vertical-align: middle;}
    @keyframes blink-effect {
        50% {
            opacity: 0;
        }
    }
.money-tab-ul li{width: 50%;height: 60px;}
.money-tab-ul li button{width: 100%;height: 100%;background-color: #141518;border-top-left-radius:0px !important;border-top-right-radius:0px !important;border-bottom-left-radius: 0 !important;border-bottom-right-radius: 0 !important;color: #69696B;font-size: 1.2rem;font-weight: 600;}
.money-tab-ul li button:hover{color: #fff !important;}
.money-tab-ul li button.active{background-color: #383C45 !important;}

.tab-pane {padding:8px;}
.realtime-ticker {
    width: 100%;
    margin: 0 auto;
    position: relative;
    z-index: 2;
    top: -1px;
}

.realtime-ticker ul {width:100%}
.realtime-ticker ul li {
		display: flex;
    align-items: flex-start;
    justify-content: center;
    height: 46px;
    cursor: pointer;
    transition: 0.3s;
}

.realtime-ticker ul li div {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s;
    border-top: dashed 1px rgba(152, 177, 223, 0.25);
}

.realtime-ticker ul li:hover div {
    background-color: rgba(152, 177, 223, 0.15);
}

.realtime-ticker ul li div.user {
    color:#fff;
		width: 35%;
    justify-content: flex-start;
    padding-left: 5px;
}

.realtime-ticker ul li div.amount {
    width: 36%;
    font-size: 18px;
    padding-right: 5px;
    font-weight: 700;
    justify-content: flex-end;
		color:#ffc111
}

.realtime-ticker ul li div.date {
    width: 29%;
    color: #9fb3ca;
    justify-content: flex-end;
    padding-right: 8px;
}

.money-a-box{height: 50px;align-items: center;display: flex;justify-content: space-between;}
.money-a-box-name{display: flex;}
.money-a-box-name-user{display: flex;}
.money-a-box-name-user-name{font-size: 1rem;font-weight: 400;color: #C9C9C9;margin-left: 5px;width: 120px;}
.money-a-box-name-user-price{font-size: 1rem;font-weight: 600;color: #E9B726;}
.money-a-box-day{font-size: 0.875rem;color: #818181;}
.dd-box{border: 2px solid #383C45;background: rgb(56 60 69 / 60%);backdrop-filter: blur(2px);}

/*footer*/
.footer {display: flex;flex-direction: column;align-items: center;color: #fff;background-color: #131c20;border-top: 1px solid #23333b;}
.footer_logo {padding: 32px;text-align: center;}
.footer_logo img {max-width: 100px;max-height: 30px;margin: 10px 12px;}
.footer_text {width: 100%;text-align: center;padding: 32px;border-top: 1px solid #23333b;background-color: var(--gs-backgroundcolor);}

.popup-container {position:absolute;top:0;left:0;width:100%;/*background:rgba(0, 0, 0, .5);*/z-index:999999;}
.popup-wrap {width:1500px;margin:0 auto;display:flex;flex-wrap:wrap;gap:10px;align-items: flex-start;}
.popup-container .popup-wrap .popup-box {margin-top:120px;border:1px solid #EAEAEA;background:#000;color:#fff;width:calc(25% - 10px);overflow:hidden;animation:opacityIn .3s;transition:opacity .3s;}
.popup-container .popup-wrap .popup-box .popup-contents-box {max-height:calc(100vh - 150px);}
.popup-container .popup-wrap .popup-box .popup-contents-box img {width:100%;max-height:calc(100vh - 150px);}
.popup-container .popup-wrap .popup-box .popup-contents-box p {margin:0;padding:0}
.popup-container .popup-wrap .popup-box .popup-footer {display:flex;justify-content:flex-end;gap:6px;color:#000;background:#D5D5D5;border-top:1px solid #717171;}

.mm {display:none;width:30px;position:absolute;top: 10px;left:10px;text-align: center;}

.content {width:1500px;margin:0 auto;}

/* BS Table */
.bs-table {width: 100%;border-collapse: separate;border-spacing: 0 3px;}
.bs-table thead th {height: 50px;color: #ffc111;font-size: 14px;text-align: center;background-color: #000;vertical-align:middle}
.bs-table thead th:first-child {border-radius: 8px 0 0 8px;}
.bs-table thead th:last-child {border-radius: 0 8px 8px 0;}
.bs-table tr {cursor: pointer;}
.bs-table tr td {height: 48px;color:#ebebeb;text-align: center;padding: 1px;transition: 0.3s;background-color:#222;border-top: solid 1px rgba(255, 255, 255, 0.08);    border-bottom: solid 1px rgba(255, 255, 255, 0.08);vertical-align:middle}
.bs-table tr td:first-child {border-radius: 8px 0 0 8px;border-left: solid 1px rgba(255, 255, 255, 0.08);}
.bs-table tr td:last-child {border-radius: 0 8px 8px 0;border-right: solid 1px rgba(255, 255, 255, 0.08);}
/* .bs-table tr:hover td {background-color: rgba(180, 223, 255, 0.1);border-color: rgba(180, 223, 255, 0.15);} */
.bs-table tr td a {color: #ffffff;transition: 0.3s;display: inline-block;vertical-align: middle;max-width: 90%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;text-decoration: none;}
.bs-table tr td a:hover {color: #c7adff;text-decoration: underline;}
.bs-table tr .count-td {width: 50px;}
.bs-table tr .count-tag {width: 24px;height: 24px;position: relative;z-index: 1;display: flex;align-items: center;justify-content: center;margin: 0 auto; color: #ffffff;font-size: 12px;background-color: #7a6fed;border-radius: 6px;}
.bs-table tr .title-td {text-align: left;padding-left: 15px;max-width: 590px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.bs-table tr .status-td {width: 15%;padding-left: 5px;}
.status-tag {min-width: 68px;display: inline-block;padding: 2px 10px;background-color: #0075ff;border-radius: 4px;color: #ffffff;white-space: nowrap;font-size: 12px;}
.status-tag.green {background-color: #27ae27;}
.bs-table tr .date-td {width: 20%;color: #8fa4bd;font-size: 12px;}
.bs-table tr .nav-td {width: 40px;}
.bs-table tr td .delete-btn {background-color: transparent;border: none;color: #999999;font-size: 14px;transition: 0.3s;}
.bs-table tr td .delete-btn:hover {color: #d3131a;}
.bs-table tr td .nav-btn {background-color: transparent;border: none;position: relative;}
.bs-table tr td .nav-btn i {position: relative;color: #fff;font-size: 10px;transition: 0.3s;transform: rotate(0deg);}
.bs-table tr td .nav-btn:hover i {color: #ffca5f;}
.bs-table tr.active td .nav-btn i {transform: rotate(180deg);top: 5px;}
.bs-table tr td .plus-btn {width: 16px;height: 16px;background-color: #ffdf3d;border: none;border-radius: 50%;color: rgba(0, 0, 0, 0.75);font-size: 12px;padding: 0 0 0;display: inline-block;vertical-align: middle;position: relative;}
.bs-table tr td .plus-btn:hover {background-color: #cd4821;}
.bs-table tr td .plus-btn:before, .bs-table tr td .plus-btn:after {content: '';width: 2px;height: 50%;left: 0;right: 0;top: 0;bottom: 0;margin: auto;position: absolute;background-color: #444444;transition: 0.3s;}
.bs-table tr td .plus-btn:after {transform: rotate(90deg);}
.bs-table tr.active td .plus-btn:before {height: 0;}
.bs-table tr td .plus-btn:hover:before, .bs-table tr td .plus-btn:hover:after {background-color: #ffffff;}

.btn_wrap {display:flex;justify-content:center;align-items:center;gap:10px;padding:10px 0}
.btn_blue {background:#00b0f0;color:#000;border:none;text-align: center;text-decoration: none;display: inline-block;text-transform: uppercase;cursor: pointer;width: 120px;font-size: 14px;font-weight: 500;height: 32px;line-height: 32px;border-radius: 100px;box-sizing: border-box;box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3) inset;vertical-align: middle;}
.btn_yellow {background:#ffc111;color:#000;border:none;text-align: center;text-decoration: none;display: inline-block;text-transform: uppercase;cursor: pointer;width: 120px;font-size: 14px;font-weight: 500;height: 32px;line-height: 32px;border-radius: 100px;box-sizing: border-box;box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3) inset;vertical-align: middle;}
.btn_red {background:#f00;color:#fff;border:none;text-align: center;text-decoration: none;display: inline-block;text-transform: uppercase;cursor: pointer;width: 120px;font-size: 14px;font-weight: 500;height: 32px;line-height: 32px;border-radius: 100px;box-sizing: border-box;box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3) inset;vertical-align: middle;}
.btn_gray {background:#555;color:#fff;border:none;text-align: center;text-decoration: none;display: inline-block;text-transform: uppercase;cursor: pointer;width: 120px;font-size: 14px;font-weight: 500;height: 32px;line-height: 32px;border-radius: 100px;box-sizing: border-box;box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3) inset;vertical-align: middle;}
.btn_lg {width:240px;height:40px;line-height:40px}

/* Pagination */
.pagination li {float: left;}
.pagination>li>a {height:32px;color:#8fa4bd;text-decoration:none;background-color:rgba(0, 0, 0, 0.25);border:1px solid #222;display: flex;align-items: center;justify-content: center;padding:2px 8px 0;position: relative;z-index: 1;transition: 0.3s;}
.pagination li a:hover {color: #ffffff;}
.pagination .turn-pg a {width: 24px;color: #c9b0ff;font-size: 18px;background-color: rgba(255, 255, 255, 0);border: none;box-shadow: none;}
.pagination .turn-pg a:hover {color: #39f1f1;}
.pagination .active {color:#ffffff;background:#ffc111;}

.btnwrap {width:100%;margin-top:10px;display:grid;grid-template-columns: repeat(8, 1fr);gap:4px}
.btnwrap button {width:100%;cursor:pointer;padding: 8px 12px;font-size:14px;color:#fff;background:#555;border-radius:8px;border:1px solid #e2e8f0;}
.btnwrap button.bred {background:#f00}

.slotlist {width:100%;margin-top:10px;display:grid;grid-template-columns:repeat(6, 1fr);gap:10px}
.slotlist>a {display:flex;flex-flow:column}
.slotlist>a .g-panel {width:100%;overflow:hidden}
.slotlist>a .g-panel>img {width:100%}
.slotlist>a .g-footer {width:100%;background:#000;color:#fff;text-align:center;padding:4px;overflow:hidden}

@media (max-width:768px) {
	.popup-wrap {width:100%;flex-wrap:wrap;justify-content:center}
	.popup-container .popup-wrap .popup-box {margin-top:60px;width:calc(90% - 10px);}	
	
	.top_banner {min-width:100%;height:200px}
	.top_banner--logo {height:130px;margin-top:-20%}
	.bf-left {width:65px;position:absolute;left:5%;top:10%}
	.bf-left2 {width:100px;position:absolute;left:10%;top:0%}
	.bf-right {width:120px;position:absolute;right:0;top:0}
	
	.header {margin-top:0;background:#000}
	.header_menu {position:relative;width:100%;height:49px;margin-top:-49px;padding:8px;justify-content:center;align-items:center}
	.header_menu .header_menuItem {display:none}
	.header_menu .header_login {margin-left:0}
	.header_menu .header_login .userid {display:none}
	.header_menu .header_login a.header_logout--btn {display:none}
	
	.mm {display:block}
	
	.main_gamelistWrap {width:100%;padding:24px 10px}
	.main_gamelist_tabmenu {width: 100%;gap:10px;justify-content: space-between;padding: 24px;margin: 0 auto;border-radius: 16px;box-shadow: 0px 0px 24px 0px var(--gs-neoncolor);}
	.main_gamelist_tabmenuItem {display: flex;gap: 8px;padding:0;}
	.main_gamelist_tabmenuItem img {height: 40px;}
	.main_gamelist_tabmenuItem_text {font-size: 12px;}
	.main_gamelist_tabmenuItem_text--title {font-size: 15px;}
	.gamelistItem {width: calc(50% - 13px);position: relative;}
	.gamelistItem_img--gamelogo {max-width:80px;top:10px;}
	
	.bottom-bigbox {width:100%}
	.footer_logo {padding:12px;text-align: center;}
	.footer_logo img {max-width: 100px;max-height:30px;margin: 10px 12px;}
	.footer_text {padding:12px;}
	
	.content {width:100%}
	.bs-table tr td {font-size: 12px;}
  .bs-table tr .count-td {width: auto;}
  .bs-table tr td a {max-width: 180px;font-size: 12px;    }
  .bs-table tr .title-td {max-width: 180px;padding-left: 5px;}
  .bs-table tr .nav-td {width: auto;}
  .bs-table thead th {font-size: 12px;}
  .bs-table tr .count-tag {width: 24px;height: 24px;}
  .bs-table tr .date-td {font-size: 10px;}
	
	.btnwrap {grid-template-columns: repeat(4, 1fr);gap:4px}
	
	.slotlist {grid-template-columns:repeat(2, 1fr);gap:4px}
}