@import url(http://fonts.googleapis.com/earlyaccess/nanumpenscript.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(http://fonts.googleapis.com/earlyaccess/hanna.css);
@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400..700;1,400..700&family=Noto+Sans+KR:wght@100..900&display=swap');


@font-face {
	 font-family: "Nanum-square"; /* 폰트 이름을 정의합니다. */
     src: url("/storage/font/NanumSquareRoundR.ttf") format("truetype");
}
@font-face {
	 font-family: "Noto Sans KR"; /* 폰트 이름을 정의합니다. */
     src: url("/storage/font/NotoSansKR-VariableFont_wght.ttf") format("truetype");
}


.neon {
    font-family: neon;
    color: #FB4264;
    font-size: 1.2rem;
    text-shadow: 0 0 1vw #F40A35;
    /* margin-top:-2px; */
}

.neon {
    animation: neon 1s ease infinite;
    -moz-animation: neon 1s ease infinite;
    -webkit-animation: neon 1s ease infinite;
  }
  
  @keyframes neon {
    0%,
    100% {
      text-shadow: 0 0 1vw #f5ecec, 0 0 3vw #f5ecec, 0 0 10vw #f5ecec, 0 0 10vw #f5ecec, 0 0 .4vw #c9effa, .1vw .1vw .1vw #76c1fd;
      color: #f5ecec;
    }
    50% {
      text-shadow: 0 0 .5vw #76c1fd, 0 0 1.5vw #76c1fd, 0 0 5vw #76c1fd, 0 0 5vw #76c1fd, 0 0 .2vw #76c1fd, .1vw .1vw .1vw #40340A;
      color: #76c1fd;
    }
  }
/*
##Device = Desktops
##Screen = 1281px to higher resolution desktops
##Device = 데스크탑
##Screen = 1281px 이상 해상도 데스크탑
*/
body{
    font-family: '맑은 고딕','Noto Sans KR','Nanum-square','Nanum Gothic', serif;
    /*
    font-family: 'Nanum Gothic', serif;
    font-family: 'Nanum Pen Script', serif;	
    font-family: 'Jeju Hallasan', serif;
    font-family: 'Hanna', serif;
    */

    background:#232735;;
    color:white;
    width:100%;
	/*padding-top:20rem;*/
}

.table{
    margin-bottom:0px;
    color:black;
}

.topMember > table{
    color:white;
}

.table thead th, .table thead td, .table tbody th, .table tbody td, .table td, .table th{
    vertical-align:middle;
    text-align:center;
}

.table thead{
    background-color:#6c757d;
}

table.battingListTable th, table.battingListTable td{
    padding:0.25rem;

}
.list2{
    background : rgba(0,0,0,.05);
}

.layoutRow{
    margin-top:12px;
}

.tableUl{
    background: rgba(33,33,33,0.8);
    /*border : 2px solid black;*/
}
.tableUl li{
    background: rgba(33,33,33,0.8);
    text-align:center;
    display:table;
    table-layout:fixed;
}
.tableUl li div div{
    /* display:table-cell; */
    vertical-align: middle;
}
.tableUl li.titleLi{
    background: linear-gradient(to bottom, #222222 0%, #0e0e0e 100%);
    font-family: '맑은 고딕','Nanum Gothic', serif;
    display:table-cell;
    vertical-align: middle;
}

.card {
    padding:0px;
    margin:0px;
    border-radius:0px;
    border:0px;
    color:white;
	background:#232735;
}

.card .card-body {
    padding:0px;
    margin:0px;
    border-radius:0px;
    border:0px;
    
}

.card-header:first-child{
    border-radius:0px;
}

.card .card-header {
    background: #343a40;
    border:0px;
    font-family: '맑은 고딕', 'Nanum Gothic', serif;
    font-size:1.2rem;
    border-bottom:2px solid #464f5f;
}

.row{
    margin:0px;
    padding:0px;
    border-radius:0px;
    text-align:center;
}

.row > div {
    margin:0px;
    padding:0px;
    border-radius:0px;
}

.topMember .table th, .topMember .table td{
    padding:0.5rem 0.75rem;
}

#GameHistory .table td{
    background:#ececec;
}



.dropdown-item:hover{
    background-color:#3f5e7d;
}

.dropdown-item a{
    color:white;
}

.chargeListBtn:hover td:nth-child(1){
    color:#ecf56b;
}
.pointListBtn:hover td:nth-child(1){
    color:#ecf56b;
}
.memoListBtn:hover td:nth-child(1){
    color:#ecf56b;
}
.battingListBtn:hover td:nth-child(1){
    color:#ecf56b;
}

.memubar{
	background: linear-gradient(to right, #222633, #34416D, #222633);
}
.menubarList{
	
}
.menubarList div:nth-child(1){
	
	margin:0;
	padding:0;
}
.menubarList div:nth-child(1) div.row{
	height:10rem;
	margin:0;
	padding:0;
}

.menubarList div:nth-child(1) div.row div.col{
	height:10rem;
	display: flex;
    align-items: center;  /* 세로 중앙 정렬 */
    justify-content: center;  /* 가로 중앙 정렬 */
	cursor:pointer;
	color: #99A4CB;
	font-size:1.65rem;
	font-weight:bold;
	background-size: cover;
	background-size: center;
	position: relative;
	isolation: isolate;
	
}

.menubarList div:nth-child(1) div.row div.col::after{
	content: '';
	position: absolute;
	background: #222;
	z-index: -1;
	inset: 0;
	opacity: 0.65;
	
}
.menubarList div:nth-child(1) div.row div.col div:nth-child(1){
	margin-top:-30px;
	padding-top:60px;
	width:100%;
	height:60px;
}
.menubarList div:nth-child(1) div.row div.col:hover{
	color : #00FFFF;
}

.homeMenuAreaBg{
	background: url(/storage/img/menu/bg-home.png) no-repeat center;
}

.homeMenuAreaBg .homeMenuBg{
	background: url(/storage/img/icons/icon-gnb-home.png) no-repeat center;
}

.homeMenuAreaBg:hover .homeMenuBg {
	background: url(/storage/img/icons/icon-gnb-home-on.png) no-repeat center;	
}

.miniGameMenuAreaBg{
	background: url(/storage/img/menu/bg-minigame.png) no-repeat center;
}

.miniGameMenuAreaBg .miniGameMenuBg{
	background: url(/storage/img/icons/icon-gnb-powerball.png) no-repeat center;
}

.miniGameMenuAreaBg:hover .miniGameMenuBg {
	background: url(/storage/img/icons/icon-gnb-powerball-on.png) no-repeat center;	
}

.autoGameMenuAreaBg{
	background: url(/storage/img/menu/bg-autogame.png) no-repeat center;	
}

.autoGameMenuAreaBg .autoGameMenuBg{
	background: url(/storage/img/icons/icon-gnb-autogame.png) no-repeat center;
}

.autoGameMenuAreaBg:hover .autoGameMenuBg {
	background: url(/storage/img/icons/icon-gnb-autogame-on.png) no-repeat center;	
}

.listMenuAreaBg{
	background: url(/storage/img/menu/bg-list.png) no-repeat center;	
}

.listMenuAreaBg .listMenuBg{
	background: url(/storage/img/icons/icon-gnb-list.png) no-repeat center;
}

.listMenuAreaBg:hover .listMenuBg {
	background: url(/storage/img/icons/icon-gnb-list-on.png) no-repeat center;	
}

.chargeMenuAreaBg{
	background: url(/storage/img/menu/bg-charge.png) no-repeat center;	
}

.chargeMenuAreaBg .chargeMenuBg{
	background: url(/storage/img/icons/icon-gnb-charge.png) no-repeat center;
}

.chargeMenuAreaBg:hover .chargeMenuBg {
	background: url(/storage/img/icons/icon-gnb-charge-on.png) no-repeat center;	
}

.exchangeMenuAreaBg{
	background: url(/storage/img/menu/bg-exchange.png) no-repeat center;	
}

.exchangeMenuAreaBg .exchangeMenuBg{
	background: url(/storage/img/icons/icon-gnb-exchange.png) no-repeat center;
}

.exchangeMenuAreaBg:hover .exchangeMenuBg {
	background: url(/storage/img/icons/icon-gnb-exchange-on.png) no-repeat center;	
}

.csMenuAreaBg{
	background: url(/storage/img/menu/bg-cs.png) no-repeat center;	
}

.csMenuAreaBg .csMenuBg{
	background: url(/storage/img/icons/icon-gnb-cs.png) no-repeat center;
}

.csMenuAreaBg:hover .csMenuBg {
	background: url(/storage/img/icons/icon-gnb-cs-on.png) no-repeat center;	
}

.noticeMenuAreaBg{
	background: url(/storage/img/menu/bg-notice.png) no-repeat center;	
}

.noticeMenuAreaBg .noticeMenuBg{
	background: url(/storage/img/icons/icon-gnb-notice.png) no-repeat center;
}

.noticeMenuAreaBg:hover .noticeMenuBg {
	background: url(/storage/img/icons/icon-gnb-notice-on.png) no-repeat center;	
}






.menubarList a {
	font-family: '맑은 고딕', 'Nanum-square'; 
    display: inline-block;
    text-decoration: none;
    
}

.menuber{
	background:linear-gradient(#34457C, #171134);
	border:1px solid #
}

.menuber a {
    color: white;
    display: inline-block;
    text-decoration: none;
    font-size:1.4rem;
}

div.card.menuber > div.card-header{
    padding:0px;
}


.menuber > div > div > div:hover {
    background:#3f5e7d;
    color:#ecf56b;
   
}

.menuber > div > div > div:hover > a {
    
    color:#ecf56b;
   
}

.menuber > div > div:nth-child(1) {
    float:right;
}

.menuber > div > div:nth-child(2) {
    float:left;
}

.menuber > div > div > div {
    white-space:nowrap;
    float:left;
    padding:8px 10px;
}

.menuber > div > div > div.active {
    background:#3f5e7d;
}

.menuber > div > div > div.active a {
    color:#ecf56b;
}



.dropdown-menu.partnerBtn{
    background: #343a40;
    white-space: initial;
	color:white;
}

.partnerBtn > a{
	color:white;
}
.partnerBtn > a:hover{
	color:white;
}

.loginarea{
	display:flex;
	align-items:center;
	justify-content:flex-end;
}

.loginMobile{
	display:none;
}
.loginMobile img {
	width:'0.8rem';
}
.loginDesktop{
	display:flex;
}




#mTopBtn {
    background: #ccc;
    border:0px;
    margin:0px;
    padding:0px;
}

#mTopBtn .col a{
    width:100%;
    border-radius: 0px;
    
}

.scrollTab200{
    position: relative;
    max-height: 260px;
    overflow-y: scroll;
    background: rgba(33,33,33,0.8);
}






.cartLayer div.card-body{
        background: rgba(0,0,0,.2);
    
}

.cartLayer div.card-body > div.row{
    /*color:white;*/
    padding:8px 10px;
    border-bottom:1px solid black;
}

.cartLayer div.card-body > div > div.row{
    /*color:white;*/
    padding:8px 10px;
    border-bottom:1px solid black;
}

.cartLayer div.card-body div.moneyBtnTr{
    margin-top:4px;
    color:black;
}

.cartLayer div.card-body div.moneyBtnTr div.row{
    margin-top:4px;
    color:black;
    padding:0px 4px;
}

.moneyBtnTr div.row div.col-3{
    padding:1px 2px;
}

.moneyBtnTr div.row div.col-4{
    padding:1px 2px;
}
/* .moneyBtn a:visited{ color: red; } */


.battingTr{
    text-align:center;
}

.battingArea{
    background-color: #eee;
    border: 1px solid #333;
    overflow: hidden;
    max-height: 150px;
    overflow-y: auto;
    text-align:center;
}

.battingEnd{
    display:none;
    position: absolute;
    left: 0px;
    top: 0px;
    height: 100%;
    width: 100%;
}

.battingEnd table{
    height: 100%;
    background: white;
    opacity: 0.8;
    color: #262626;
    font-weight: 900;
}

.battingEnd table td {
    vertical-align: middle;
    text-align: center;
    font-size: 1.4rem;
}

.layoutRow{
    margin-top:12px;
}


.navbar{
    padding-top:6px;
    padding-bottom:6px;
}

.nav-link{
    font-family: '맑은 고딕', 'Nanum Gothic', serif;
    font-size:24px;
    color:white;
    padding:2px;
}

.nav-link > span{
    font-family: '맑은 고딕', 'Nanum Gothic', serif;
    font-size:12px;
    color:white;
    padding-left:4px;
}


.topUserPoint{
    cursor: pointer;
}

.strPlayTypeBtn{
    margin-bottom:0px;
}

.strPlayTypeBtn div.row a.col{
    border:1px solid #555;
    border-radius:0px;
    font-size:0.8rem;
    background:#333;
}

.strPlayTypeBtn div.row a.active{
    background:#ccc;
}

.pagination {
    margin-top: 10px;
    justify-content: center;
    margin-bottom: 10px;
}

.moneyBtnTr div.row div.col-12{
    padding : 1px 2px;
}

#sidebar > div:first-child{
    background-color:#343a40;
}
#sidebar{
    padding-bottom:4px;
	border: 2px solid white;
}

.modal-header{
    background: #343a40;
    border: 0px;
    font-family: '맑은 고딕','Nanum Gothic', serif;
    font-size: 1.4rem;
}

.modal-body{
    background:#ccc;
}

.modal-footer{
    background:#ccc;
}



.chargeListBtn, .pointListBtn, .memoListBtn, .battingListBtn, .chargeBtn, .exchangeBtn, .csBtn, .fa-trash-alt, .btn-Ok{
    cursor:pointer;
}

.redColor {
    color:#dd6060;
}

#topMember{
    color:white;
    border: 2px solid #E4B03F;
    /*background: linear-gradient(to bottom, #212121 0%, #1b1b1b 100%);*/
	background:linear-gradient(#34457C, #171134);
    box-shadow: 0px 0px 10px #000;
}



#topMember div div div div{
    padding:0.2rem 0.2rem;
    height:2rem;
	font-size:1.2rem;
}

#topMember div div div div.btnArea{
    display:flex;
	align-items:center;
	justify-content:center;

}

#topMember div.w-100 {
    padding:0px;
    height:0px;
}

#topMember .btn-Ok{
    margin-top:-4px;
    font-size:0.75rem;
}

.nick{
    color:#00adff;
    font-weight:bold;
}

.topUserMoney{
    color:#ccadff;
    font-weight:bold;
}

.topUserPoint{
    color:#ecf56b;
    font-weight:bold;
}



#cartBtn{
    height:0px;
    border:0px;
    font-size:0px;
    line-height:0px;
    padding:0px;
    margin:0px;
}

.page-link{
    color:gray;
}

.page-item.active .page-link {
    z-index: 1;
    color: #fff;
    background-color: #3b3b3b;
    border-color: #3b3b3b;
}

.text-blue{
    color:#377ef8;
}

.text-red{
    color:#fc4f4f;
}

.text-small{
    font-size:0.85rem;
}
/*
.span-blue{
    padding:4px 8px;
    background-color:#377ef8;
    color:white;
    border-radius:12px;
}

.span-red{
    padding:4px 8px;
    background-color:#fc4f4f;
    color:white;
    border-radius:12px;
}

.span-gray{
    padding:4px 8px;
    background-color:#6c757d;
    color:white;
    border-radius:12px;
}*/

.span-blue{
    color:#377ef8;
}

.span-red{
    color:#fc4f4f;
}

.span-gray{
    color:#6c757d;
}

/* .menuber a:nth-child(1),.menuber a:nth-child(2),.menuber a:nth-child(3) {
    padding:2px 4px;
    background:#eee;
    color:#3b3b3b;
    border-radius : 12px;

} */

.battingArea{
	color:black;
}


.card.tablediv{
	background:#171134;;
}

.card.tablediv .card-header{
	background:linear-gradient(#34457C, #171134);
}

.card .card-header{
	background:linear-gradient(#34457C, #171134);
}

code, kbd, pre, samp{
font-family:'맑은 고딕';
}

.table {
font-family:'맑은 고딕';
}


/*데스크탑 사이즈*/
@media all and (min-width: 993px) {

    .container-fluid{
        width:100%;
    }
    
    .layoutRow{
        margin-top:12px;
    }
    
    .layoutRow > .col-xl-9{
        padding-right:0px;
        padding-left:0px;
    
    }
    .layoutRow > .col-xl-3{
        padding-left: 4px;
    
    }

    .eventPopup{
        position: absolute;
        background: #6c757d;
    }
    
    .table{
        font-size:1rem;
    }

    #GameHistory .table th,#GameHistory .table td{
        font-size:1rem;
        padding:12px 8px;
    }
	.loginMobile{
		display:none !important;
	}
	.loginDesktop{
		display:flex !important;
	}
	
	.menubarList{
		display:block;
	}
	
	.menuber{
		display:none;
	}
	
	.paterBtn{
		display:block;
	}

}
/*데스트탑이 아닐경우 공통*/
@media all and (max-width: 992px) {
    .container-fluid{
        width:100%;
        padding-left: 0px;
        padding-right: 0px;
    }

    .layoutRow > .col-xl-9{
        width: 100%;
    }
    .layoutRow > .col-xl-3{
        width: 100%;
    }

    .eventPopup{
        position: absolute;
        background: #6c757d;
    }

    .eventPopup img{
        width:100%;
    }

    .card .card-header {
        font-size:1rem;
    }
	
	.menubarList{
		display:none;
	}
	
	.loginMobile{
		display:none !important;
	}
	.loginDesktop{
		display:flex !important;
	}
	
	.menubarList{
		display:none;
	}
	
	.menubarList{
		display:none;
	}
	
	.menuber{
		display:block;
	}
	
	.paterBtn{
		display:none;
	}

}

/*
테블릿 사이즈
*/
@media all and (min-width: 768px) and (max-width: 768px)  {

    .talbeUl{
        font-size:0.85rem;
    }    
    .table{
        font-size:0.85rem;
    }
	
	.loginMobile{
		display:none !important;
	}
	.loginDesktop{
		display:flex !important;
	}
}

/*
모바일 사이즈
*/

@media all and (max-width: 767px)  {
    body{
        font-size:0.75rem;
    }
    .talbeUl{
        font-size:0.75rem;
    }
    .table{
        font-size:0.75rem;
    }
	
	.eventPopup{
		width:100%;
        position: absolute;
        background: #6c757d;
    }
	
	.eventPopup img{
        width:80%;
    }

    #GameHistory .table th,#GameHistory .table td{
        font-size:0.5rem;
        padding:2px 4px;
    }

    .btn-money {
        font-size: 0.8rem;
        height: 32px;
        padding: 0.15rem 0.15rem;
        line-height: 25px;
    }

    .card .card-header {
        font-size:0.85rem;
        padding:0.45rem 0.25rem;
    }

    .table td, .table th{
        font-size:0.65rem;
    }

    .menuber a {
        color: white;
        display: inline-block;
        text-decoration: none;
        font-size:.8rem;
    }
	
	.loginMobile{
		display:flex !important;
	}
	.loginDesktop{
		display:none !important;
	}
	
	#topMember div div div div{
		padding:0.2rem 0.2rem;
		height:2rem;
		font-size:0.8rem;
	}
}