@charset "utf-8";
/* media */
@media screen and (min-width: 991px) {
	/* pc device */
	.mob {
		display: none !important;
	}
}

.aside2.in {
	width: 100%;
	min-width: 320px;
}
.aside2 {
	background: url(../images/common/bg_popup.jpg) center top no-repeat;
	background-size: cover;
	position: fixed;
	width: 280px;
	min-width: 0px;
	top: var(--header-hight);
	right: 0;
	bottom: 0;
	transition: transform 0.35s ease;
	z-index: 1115;
	overflow: auto;
	transform: translateX(100%);
}
.aside2.on {
	transform: translateX(0);
}
.aside2 ul.category-box {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	align-items: center;
	padding: 0.2em 0.5em;
}
.aside2 ul.category-box>li {
	width: 50%;
	padding: 0.1em;
}
.aside2 ul.category-box>li a {
	display: block;
	padding: 10px 0;
	background-color: #00000099;
	text-align: center;
}
.aside2 .cash_wrap .info{
	border-top: solid 1px #065254;
	padding: 10px 15px;
	background: linear-gradient(rgba(61, 89, 137, 0.3), rgba(61, 89, 137, 0.2), rgba(9, 43, 68, 0), rgba(9, 43, 68, 0));
	color: white;
	font-size: 14px;
}
.popup_wrapper .input1::placeholder {
	opacity: 0;
}
.qna_wrapper {
	text-align: center;
	margin-top: 15px;
}
.input1 + b {
	margin: 0 .1em;
}

@media screen and (max-width: 990px) { /* mobile device */
	body {
		font-size: calc(.75rem + 1vmin);
	}
	body:has(.aside2.on) {
		overflow: hidden
	}
	.pc {
		display: none !important;
	}
	.out_login_wrap .login_content .footer {
		display: flex;
		flex: 1 1 auto;
	}
	.banner{display:none}
	.header_wrap{
		padding-top: 0;
	}
	.header_wrap .top {
		flex-direction:column;
		height: 120px;
		margin: 0 5px;
	}
	.header_wrap .top img.menu{
		width:35px;
		position:absolute;
		right: 10px;
		top: 20px;
	}
	.header_wrap .top .gnb {
		font-size: 12px;
		display: flex;
		gap: 0;
		justify-content: space-around;
		width: 100%;
		border-top: 1px solid;
		padding: 5px 0;
	}
	.header_wrap .top .gnb img {
		margin: 0;
	}
	.header_wrap .top .gnb li a {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.header_wrap .top .logo {
		height: 71px;
		margin-top: 12px;
	}
	.header_wrap .top .logo img{
		height:100%;
		max-height: 54px;
	}
	.header_wrap .top .info {
		position:relative;
		top: 0;
		font-size: 12px;
		flex-wrap: wrap;
		gap: 0px 15px;
		justify-content: space-around;
		height: 40px;
		align-items: center;
		overflow: hidden;
		display: flex;
	}
	.header_wrap .menu-wrap,
	.header_wrap .btn-wrap {
		position:absolute;
		top: 20px;
		right: 8px;
	}
	.header_wrap .menu-wrap button {
		background: unset;
		color: white;
		font-size: 20px;
	}
	.header_wrap .menu-wrap .menu.on > span:before{
		content:'\e9a7'
	}
	.header_wrap .btn-wrap >button{
		padding: 5px !important;
		font-size: 12px !important;
	}
	.sns_wrap {
		justify-content: center;
	}
	.banner_wrap {
		height: auto;
	}
	.game_list_wrap>ul {
		grid-template-columns:repeat(2, 1fr);
	}
	.game_list_wrap>ul>li .game-wrap .name {
		font-size:18px;
	}
	.main_popup_tab>li>a {
		font-size: 1em;
	}
	.main_popup_tab_box {
		width: inherit;
		padding: 5px;
	}
	.main_popup_tab {
		flex-direction:column;
		gap: 0;
	}
	.main_game_box {
		padding: .25rem;
	}

	.main_game_start {
		padding: .25rem;
	}

	.check {
		width: calc(100% - 5px);
		height: calc(100% - 5px);
		top: 2.5px;
		left: 2.5px;
	}

	.main_con_box {
		padding: 0 0.25rem;
		flex-direction: column;
	}
	.main_con1_wrap {
		width: 100%;
		margin: .25rem 0;
		max-width: initial;
	}
	.main_con1_wrap+.main_con1_wrap {
		margin-left: 0;
	}
	.main_con_wrap .more {
		right: 1.5em;
	}
	.main_con1_wrap .main_con1 table {
		width: 100%;
		min-width: initial;
	}

	.main_con1_title > img {
		max-width: 100%;
	}

	#wrap .sns_wrap {
		/* padding: 0 10px; */
		position: absolute;
		left: 4px;
		top: 10px;
	}
	#wrap .sns_wrap img {
		/* max-width: 100%; */
		/* width: 100%; */
	}
	.notice_popup_area {
		top: 4rem;
		left: 0;
		max-width: 100%;
	}
	.notice_popup * {
		word-break: break-all;
		max-width: 100%;
		height: auto;
		min-height: unset !important;
	}
	.notice_popup .notice_popup_text {
		padding: 1rem;
	}
   	.board-list ul.imgList {grid-template-columns: var(--mob-thumb-cnt);}
	.hamburger-active .login ul li.item-cash {
		display: none;
	}
	.hamburger-active .login ul li.item-logout,
	.hamburger-active .login ul li.item-partner {
		display: list-item !important;
	}

	/* sk_popup mobile styles (not popup exactly, subpage theme) */
	.popup_background:not(#notice_pop_background) {
		display: none !important;
	}
		
	#login_pop_background.popup_background {
		display: block !important;
		opacity: initial !important;
		background-color: rgb(28 18 59 / 50%) !important;
	}
	
	.popup_wrapper {
		margin-bottom: 70px;
	}
	#notice_pop_wrapper.popup_wrapper {
		top: 0px !important;
		overflow: auto !important;
	}
	
	.popup_wrapper .close_box {
		display: none;
	}
	.popup_wrapper .popup_wrap {
		font-size: 0.8em;
		width: 100%;
		padding: 10px;
		padding-bottom: 70px;
	}
	.popup_align {
		height: 0 !important;
	}
	.popup_wrapper .popup_content {
		display: block !important;
		width: 100%;
	}
	#notice_pop .notice_popup_text {
		min-width:initial;
		padding:1em;
	}

	#sms_popup {
		max-width:350px;
		margin:auto;
		
	}
	.popup_wrapper .popupbox {
		border-radius: 0;
		padding: 0;
		min-height: unset;
	}
	.popup_wrapper .popupbox .slot_loding {
		padding: .5em;
		font-size: 2em;
	}
	.popup_wrapper .popupbox .slot_loding img {
		max-width: 80vw;
	}
	.popup_wrapper .popupbox .pop_content {
		padding: 10px 5px;
		border: none;
	}

	.popup_wrapper .title1 {
	}
	.popup_wrapper .title1-search {
		height: 3em;
		background: url(../images/common/bg_popup.jpg) center center no-repeat;
		background-size: cover;
		margin: 0;
	}
	.popup_wrapper .title1-search .input1{
		min-width: initial;
	}
	.popup_wrapper .title1-search .clearable {
		width: 12em;
	}

	.popup_wrapper .popup-noheader .title1 {
		align-items: start;
	}
	.popup_wrapper .popup-noheader .title1 + .close_box {
		display: inline-flex;
		position: absolute;
		top: 0;
		justify-content: end;
		transform: scale(0.8);
		transform-origin: top right;
	}

	.popup_wrapper .title2 {
		float: initial;
		text-align: center;
		display: flex;
		flex-flow: column;
		justify-content: center;
		align-items: center;
	}

	.popup_wrapper .con_box00,
	.popup_wrapper .con_box10,
	.popup_wrapper .con_box20,
	.popup_wrapper .con_box30 {
		padding: 0 0.5em;
		/* float: initial; */
	}
	.popup_wrapper .con_box00 .btn_wrap_center,
	.popup_wrapper .con_box10 .btn_wrap_center,
	.popup_wrapper .con_box20 .btn_wrap_center,
	.popup_wrapper .con_box30 .btn_wrap_center {
		float: initial;
	}
	.popup_wrapper .input1::placeholder {
		opacity: 1;
	}
	.write_title {
		width:auto;
		padding: 5px;
		text-align: center;
	}
	.popup_wrapper .write_basic > .input1{
		flex-grow: 1;
		width: 4em;
		height: 45px;
	}
	.popup_wrapper .write_basic > .input1 + span {
		display: block;
		font-size: .8em;
		width: 100%;
		line-height: initial;
	}
	.popup_wrapper .write_basic > .input1 + a {
		margin-left: .3em;
	}

	.popup_wrapper .popup_tab {
		flex-wrap: wrap;
		gap: 5px;
	}
	.popup_tab li {
		width: 80px;
		height: 80px
	}
	.popup_tab li span.txt {
		font-size: 12px
	}
	#login_pop .popup_wrap .popupbox {
		padding: 20px;
	}
	#join_pop .popup_wrap .popupbox {
		padding: 15px
	}
	#join_pop .input_wrap select, #join_pop .input_wrap input {
		padding: 5px
	}
	.btn_plus_wrapper {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
		margin: .25em 0;
		flex: 0 0 100%;
		gap: 5px;
	}
	.btn_plus_wrapper > a {
		padding: .1em;
	}
	.btn_plus_wrapper > a > .btn {
		width: 100%;
		padding: 0 1em;
		line-height: 3.5em;
		height: 3.5em;
	}
	.qna_wrapper {
		width: 100%;
	}

	.list1,
	.list_title1,
	.list_notice1 {
		line-height: initial;
		padding: 1em .2em;
	}

	.slot_list>ul {
		grid-template-columns: var(--mob-slot-cnt);
		gap: .5em;
	}
	.slot_list>ul>li {
		margin-top: .6em;
		border: none;
	}
	.slot_list>ul>li .tit {
		padding: .75em .25em;
	}
	
	.pagination>li>a,
	.pagination>li>span {
		margin: 0.1em;
		border-radius: 0.2em;
		padding: 0.5em 1.25em;
		line-height: 2;
	}

	.popup_tab.flex .tab1 {
		flex-grow: 1;
		min-width: initial;
	}

	ul.comp_list {
		grid-template-columns: repeat(auto-fill, minmax(30%, 1fr));
		gap: 0.5em;
	}

	/*룰렛*/
	.roulette-container {
		position: relative;
		display: block;
		width: 100%;
		scale: initial;
		right: 0;
		top: 0;
		background: url(../images/common/roul-bg.png);
		z-index: 100;
	}

	.roulette .cash-font {
		font-size: 1.5em;
	}

	.attendance-reward-btn {
		position: inherit;
		margin-top: 4px;
		margin-bottom: 4px;
		float: right;
	}
	.footer {
		position:fixed;
		bottom:0;
		width: 100%;
		z-index: 1002;
	}
	.footer ul{
		display:grid;
		grid-template-columns:repeat(5, 1fr);
		background: #1b1b1b;
		border-radius: 15px 15px 0 0;
		padding: 7px 0;
		filter: drop-shadow(2px 4px 6px white);
	}
	.footer ul li{
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.footer ul li img{
		width: 25px;
		color: #956161;
		filter: invert(1);
	}
	.footer ul li p{
		color: white;
		font-size: 12px;
	}
	.footer ul li.home{
		position:relative;
		z-index: 0;
		margin-bottom: -5px;
	}
	.footer ul li.home::before{
		content:'';
		position:absolute;
		background: #ab7cd4;
		border: 6px solid #1b1b1b;
		width: 55px;
		height: 55px;
		bottom: 0;
		z-index: -1;
		border-radius: 50%;
	}
	.footer_wrap{
		padding: 20px 0 80px;
	}
	::-webkit-scrollbar{
		display:none
	}
	.tr_content {
		padding:15px
	}
	.reply-list table tbody tr {
		display: flex;
		flex-wrap: wrap;
		width: 100%;
	}
	.reply-list table tbody td {
		height:auto;
		text-align: left;
	}
	.reply-list table tbody td.user {
		flex: 1
	}
	.reply-list table tbody td.content {
		order: 1;
		width: 100%;
		border-top: 1px solid #414141;
	}
	.langs {
		position: absolute;
		left: 10px;
		top: 20px;
	}
	.langs .dynamic-select .dynamic-select-header {
		padding: 3px;
	}
}