/* --  * * * * * * * * * * * * * * * * * * *  * -- */

/* --         H I G H 1 S L O T    M O D A L S        -- */

   /* --  * * * * * * * * * * * * * * * * * * *  * -- */


.highslot-modal{
	width:600px;
	height:auto;
	position:absolute;
	top:10%;
	right:0;
	left:0;
	margin:auto;
	z-index:1000;
	box-shadow:none;
	padding:1px;
	margin-bottom:30px;
}
.modal-backdrop {
   background-color:#222430;
}
.modal-backdrop.in{
    opacity:.96;
}

/* Header */

.highslot-modal .header{
	width:100%;
	height:auto;
	float:left;
	padding:10px;
	position:relative;
	text-align:center;
}
.highslot-modal .hs-logo{
	display:block;
	margin:0 auto;
	top:0;
	transform:translateY(0);
	float:none;
	left:10px;
	position:relative !important;
}
.highslot-modal .header p{
	margin:0;
}
.highslot-modal .header .title{
	width:100%;
	float:left;
    margin: 0 auto;
    z-index: 2;
    font-size: 20px;
    letter-spacing: 2px;
    text-transform: uppercase;
    line-height:40px;
    padding: 0px 10px;
    display: inline-block;
    vertical-align: top;
    position: relative;
    overflow: hidden;
    background: transparent;
    color:#fff;
	font-size:22px;
	font-family:SCDream6;
    font-weight:normal;
    border-top:solid 2px #363c45;
    border-bottom:solid 2px #363c45;
    margin-top:10px;
}
.highslot-modal .header .title:before, .highslot-modal .header .title:after{
    content: "";
    display: block;
    width: 100px;
    height:100px;
    position: absolute;
    background:transparent;
    z-index: 2;
    top: 0;
    bottom: 0;
    margin: auto 0;
    border:2px solid #363c45;
    -webkit-transform: rotate(45deg) skew(26deg,26deg);
    -moz-transform: rotate(45deg) skew(26deg,26deg);
    -ms-transform: rotate(45deg) skew(26deg,26deg);
    -o-transform: rotate(45deg) skew(26deg,26deg);
    transform: rotate(45deg) skew(26deg,26deg);
}
.highslot-modal .header .title:before{
    left: -77px;
}
.highslot-modal .header .title:after{
    right: -77px;
}
.highslot-modal .header .sub{
	color:#999999;
	font-size:12px;
	float:left;
	width:100%;
	margin-top:5px;
}
.highslot-modal .header .close-btn{
	float:right;
	border:none;
	color:#c6cbea;
	font-size:26px;
	position:absolute;
	top:5px;
	right:2px;
	background-image:none;
	background-color:transparent;
	padding:0;
}
.highslot-modal .header .close-btn:hover{
	background-color:transparent;
	color:#e51515;
}
.modal_body{
	width:100%;
	height:auto;
	float:left;
	text-align:center;
    border-radius:0 0 8px 8px;
    margin-top:0;
    padding:0;
    box-shadow:none;
}
.modal_body .form-group{
	width:100%;
	height:auto;
	float:left;
	margin-bottom:10px;
	position:relative;
}
.modal_body .form-group.all-text{
	margin-bottom:15px;
}
.modal_body .form-group:first-child{
	margin-top:10px;
}
.modal_body .form-group div{
	height:auto;
	float:left;
}
.modal_body .form-group div:first-child{
	width:100%;
	margin-bottom:5px;
}
.modal_body .form-group div:first-child p{
	float:left;
	color:#ffffff;
	font-size:14px;
	margin-top:9px;
	margin-bottom:0;
}
.modal_body .form-group div:first-child p i{
	font-size:16px;
	color:#a3ff12;
}
.modal_body .form-group div:last-child{
	width:100%;
}
.modal_body .form-group div:last-child p{
	color:#ffad18;
	font-size:30px;
	position:relative;
	margin:0;
}
.modal_body .form-group div:last-child input{
	width:100%;
	height:40px;
	float:left;
	background-color:#fff;
	border:none;
	padding:0 8px;
	color:#000000;
	font-size:12px;
	border-radius:3px;
}
.modal_body .form-group div.w-btn input{
	width:75%;
}
.modal_body .form-group div.w-btn button{
	width:24%;
	height:40px;
	border:solid 1px transparent;
	padding:0;
	white-space:nowrap;
	background-color:#29770e;
	margin-left:1%;
	border-radius:3px;
	color:#fff;
	font-size:12px;
	transition:0.3s;
}
.modal_body .form-group div.w-btn button:hover{
	background-color:#907d14;
	color:#fff;
}
.modal_body .form-group div:last-child input::-webkit-input-placeholder {
	color:gray;
	font-size:12px;
}
.modal_body .form-group div:last-child select{
	width:100%;
	height:40px;
	float:left;
	background-color:#cccccc;
	border:none;
	padding-left:10px;
	color:#000000;
	font-size:12px;
	border-radius:5px;
	position:relative;
}
.modal_body .form-group div:last-child label{
	position:relative;
	width:100%;
	height:40px;
	float:left;
}
.modal_body .form-group div:last-child label svg{
	position:absolute;
	right:3px;
	top:5px;
	color:#1a1a1a;
	font-size:32px;
	pointer-events:none;
}

.modal_body .form-group div.w-info{
	display:flex;
	flex-wrap:wrap;
	align-items: center;
	justify-content:flex-start;
}
.modal_body .form-group div.w-info .labels{
	width:auto;
	float:left;
	text-align:left;
}
.modal_body .form-group div.w-info .info{
	width:auto;
	float:left;
	color:#ffad18;
	font-size:30px;
	text-align:left;
	margin-left:10px;
}

/* Modal Footer */
.modal-btn-grp{
	width:100%;
	height:auto;
	float:left;
	margin:20px 0;
}
.modal-btn-grp button{
	height:40px;
	float:left;
	border:none;
	transition:0.5s;
	border-radius:3px;
	margin:0 1%;
	color:yellow;
	font-size:14px;
	font-family:SCDream6;
	background-color:#f9d405;
}
.modal-btn-grp button:first-child{
	margin-left:0;
	color:#fff;
	background-color:#dc3d1c;
}
.modal-btn-grp button:last-child{
	margin-right:0;
}
.modal-btn-grp.two button{
	width:49%;
}
.modal-btn-grp.one button{
	width:100%;
}

/* Category */

.modal_body .category-title{
	width:100%;
	height:auto;
	float:left;
	text-align:left;
	border-bottom:solid 1px #f9d504;
	margin:10px 0;
}
.modal_body .category-title p{
	color:#f9d504;
	font-size:16px;
}
.modal_body .category-title p i{
	font-size:18px;
	margin-right:5px;
}

/* Login Join */

.login-modal{
	width:500px;
}




.modal_body .terms-use{
	width:100%;
	height:auto;
	float:left;
}
.modal_body .terms-use .text-cont{
	width:100%;
	height:160px;
	float:left;
	background-color:#fff;
	padding:5px;
}
.modal_body .terms-use .text-cont .inner{
	width:100%;
	height:100%;
	float:left;
	overflow-y:scroll;
	text-align:left;
	padding:10px;
	color:#000;
	font-size:14px;
}
.modal_body .terms-use .text-cont .inner::-webkit-scrollbar {
    width:10px;
    background:#8c8c8c;
}
.modal_body .terms-use .text-cont .inner::-webkit-scrollbar-thumb {
    background:#333;
}
.modal_body .terms-use .text-cont .inner .title{
	color:#bf2100;
	font-size:14px;
	font-family:SCDream6;
}
.modal_body .terms-use .text-cont .inner .blue{
	color:#264b79;
	font-family:SCDream6;
}
.modal_body .terms-use .question{
	width:100%;
	height:auto;
	float:left;
	text-align:left;
	margin-top:5px;
}
.modal_body .terms-use .question .ques-txt{
	color:#fff;
	font-size:14px;
	display:inline-block;
	margin-right:5px;
}
.modal_body .terms-use .question .choice{
	color:#fff;
	font-size:14px;
	display:inline-block;
	margin-right:5px;
}

/* Deposit */

.modal_body .terms-use.notice{
	margin:10px 0;
}
.deposit-btn{
	width:100%;
	height:50px;
	float:left;
	margin:10px 0;
	border-radius:8px;
	border:none;
	background-color:#29770e;
	color:#fff;
	font-size:16px;
	font-family:SCDream6;
	transition:0.3s;
}
.deposit-btn.custom{
	margin-top:0;
}
.deposit-btn i{
	font-size:20px;
	margin-right:5px;
	position:relative;
	top:2px;
}
.deposit-btn:hover{
	background-color:#23B114;
}

/* Notice Event */

.not-eve-modal{
	width:700px;
}
.not-eve-tbl{
	width:100%;
	height:auto;
	float:left;
	margin-top:10px;
}
.not-eve-row{
	width:100%;
	height:auto;
	float:left;
	margin:2px 0;
}
.not-eve-row .detail{
	width:100%;
	height:35px;
	float:left;
	background-color:#484b5d;
	border-radius:3px;
	overflow:hidden;
	position:relative;
	padding-right:24px;
	cursor:pointer;
	transition:0.3s;
}
.not-eve-row .detail.active{
	border-radius:3px 3px 0 0;
	background-color:#7982b7;
}
.not-eve-row .detail:hover{
	background-color:#7982b7;
}
.not-eve-row .detail table{
	width:100%;
	height:100%;
	float:left;
}
.not-eve-row .detail td{
	text-align:center;
	color:#fff;
	font-size:14px;
}
.not-eve-row .detail td.count{
	width:10%;
}
.not-eve-row .detail td.about{
	text-align:left;
	width:60%;
	padding-left:10px;
}
.not-eve-row .detail td.date{
	width:30%;
}
.not-eve-row .detail .arrow{
	position:absolute;
	top:50%;
	transform:translateY(-50%) rotate(0deg);
	right:5px;
	margin:auto;
	color:#000;
	transition:0.3s;
}
.not-eve-row .detail .arrow.active{
	transform:translateY(-50%) rotate(180deg);
}
.not-eve-row .content{
	width:100%;
	height:auto;
	max-height:300px;
	float:left;
	background-color:#fff;
	padding:5px;
	border-radius:0 0 3px 3px;
	position:relative;
	overflow:hidden;
	display:none;
	overflow-y:scroll;
	text-align:left;
	padding:10px;
	color:#000;
	font-size:14px;
}
.not-eve-row .content::-webkit-scrollbar {
    width:10px;
    background:#8c8c8c;
    border:solid 2px #fff;
}
.not-eve-row .content::-webkit-scrollbar-thumb {
    background:#333;
    border:solid 2px #fff;
}
.not-eve-row .detail .delete-btn{
	width:auto;
	height:auto;
	border:none;
	background-color:transparent;
	color:#fff;
}
.not-eve-row .detail .delete-btn:hover{
	color:#f9d504;
}


.not-eve-row .detail.active2{
	border-radius:3px 3px 0 0;
	background-color:#ffffff;
	color:#000;
}

.not-eve-row .detail td.bh_content{
	width:50%;
	color:#000;
}

.not-eve-row .detail td.bh_amount{
	width:15%;
	color:#000;
}

.not-eve-row .detail td.bh_total{
	width:20%;
	color:#000;
}

.not-eve-row .detail td.bg_date{
	width:15%;
	color:#000;
}





/* Customer Service */

.customer-modal{
	width:700px;
}
.cs-textarea{
	width:100%;
	height:250px;
	float:left;
	background-color: rgba(83,100,237,0.47);
    border: solid 2px #7985e1;
    border-radius:8px;
    outline:none;
    resize:none;
    color:#fff;
    font-size:14px;
    padding:10px;
}


@media(max-width:768px){

	.mobile-modal {
		width:400px !important;
	}

}