/* Large Design */

	/* PC Size */
  @media(min-width: 1025px){
    .slot-btn:hover {
      margin-top: -30px;
      margin-bottom: 0;
      z-index: 3;
    }
    .slot-btn:hover .g-panel .c-bg {
      opacity: 1.0;
    }
    .slot-btn:hover .g-footer {
      margin-top: -10px;
    }
    .slot-btn:hover .g-footer:before {
      top: -50%;
    }
    .slot-btn.off .g-panel .c-char {
      filter: brightness(50%);
    }
  }


/* Mediam Design */

	/* Folder Size */
	@media(max-width:900px){ 
		.toggle-section .container {
			padding: 0;
		}
		.toggle-btn {
			height: 60px;
			font-size: 18px;
			margin-top: -1px;
		}
		.toggle-btn .indicator {
			font-size: 24px;
		}
		.toggle-btn .btn-panel {
			width: 100%;
		}
		.toggle-btn:first-child .icon-panel {
			margin-left: 0;
			margin-right: 15px;
		}
		.toggle-btn:last-child .icon-panel {
			margin-right: 0;
			margin-left: 15px;
		}
		.toggle-btn:first-child .btn-panel {
			margin-right: 0;
		}
		.toggle-btn:last-child .btn-panel {
			margin-left: 0;
		}
		.toggle-btn .icon-panel {
			width: 100px;
			height: 80px;
		}
		.toggle-btn .icon-panel img {
			max-height: 60px;
		}
		.toggle-btn .btn-panel:before {
			bottom: 3px;
		}
	}




/* Mobile */


	/* Basic Size */

	@media (max-width : 767px) {
    html {
      background-image: url('/asset/design/casino-01-gb/img/background/background-m.jpg');
    }
		.tab-content .tab-pane.casino {
			height : auto;
		}
		.tab-content {
			height: auto;
			padding-top: 0px;
		}
    .modal.mcasino .modal-dialog {
      width: 95%;
      margin: 5px auto;
    }
    .modal.mcasino .modal-banner {
      padding-top: 35px;
    }
    .modal-banner .modal-logo {
      width: 200px;
    }
		.toggle-btn .btn-panel .category {
			top: 2px;
		}
		.main-section-1 .col-xs-12:nth-child(2) {
			margin : 45px auto;
		}
		.tab-content.chex table td:nth-child(2) {
			font-size: 14px;
			width: 30%;
		}
  	.wrapper-table { margin-bottom: 0px; }
  	.wrapper-table .top-table ,
  	.wrapper-table .top {
  		height: auto;
  	}
  	.wrapper-table .top-table .logo-text {
  		font-size: 12px;
  		padding : 10px 0px;
  		margin-top: 0px;
  	}
  	.wrapper-table .top-table .logo-text p {
  		font-size: 16px;
  	}
  	.wrapper-table .top-table td:nth-child(2) {
  		padding-bottom: 0px;
  	}
  	.wrapper-table .top-table td:nth-child(1), 
  	.wrapper-table .top-table td:nth-child(3) {
  		width: 15%;
  	}
  	.wrapper-table .top-table .stars {
  		bottom: 50px;
  		left: 33px;
  	}
  	.wrapper-table .top-table .stars img {
  		width: 85px;
  		margin : 0 auto;
  	}
  	.wrapper-table .mid-table-left td {
  		padding : 12px 6px;
  		border-top: 3px groove wheat;
  		border-bottom: 3px groove wheat;
  		font-size: 14px;
  	}
  	.mid-table-right td b {
  		font-size: 13px;
  	}
  	.wrapper-table .mid-table-left td > a > i {
  		display: none;
  	}
  	.wrapper-table .mid-table-right td {
  		height: 50px;
  	}
  	.wrapper-table .bottom .col-xs-4 {
  		padding : 8px 8px;
  	}
  	.wrapper-table .bottom {
  		border-bottom: 1px solid #212121;
  	}
  	.wrapper-table .top-table .logo {
  		width: 75%;
  		margin-top: 10px;
  	}
  	.tab-pane .col-lg-2 {
  		padding: 0px 5px;
  	}
  	.nav-table-img tr:nth-child(1) > td > div {
  		padding : 3px;
  	}
  	.nav-bt {
  		margin : 5px auto;
  		width : 82%;
  		line-height: 38px;
  	}
  	.nav-table-img h2 {
  		font-size: 14px;
  	}
  	.nav-table-img .sub-name {
  		font-size: 10px;
  	}
  	.btn-6 span {
  		font-size: 14px;
  	}
  	.wrapper-table .mid hr {
  		height: 3px;
  	}
  	.main-section-1 .col-xs-12.mid {
  		margin-top: 40px;
  		margin-bottom: 50px;
  	}
  	.footer-img img {
  		width : 80px;
  		margin : 15px 20px;
  		filter : drop-shadow(0 2px 2px rgba(0, 0, 0, 1)) grayscale(80%);
  	}
  	.input-panel.dflex {
  		width: 95%;
  	}
  	#m-login .col-xs-4 {
  		padding : 5px 2px;
  	}
  	#m-login .login {
  		text-align: center;
  	}
  	#m-login .login .bt {
  		width: 85%;
  	}
  	.nav-footer .copyright:after {
  		top: 485px;
  	}
  	.mid-table-right img {
  		height: 20px;
  	}
  	.circle i {
  		font-size: 12px;
  	}
  	.mid-table-right .nav-cs:hover i {
  		font-size: 16px;
  	}
  	.wrapper-table .bottom .col-xs-4,
  	.wrapper-table .bottom .col-xs-3 {
  		padding-left: 2px;
  		padding-right: 2px;
  	}
  	.m-nav-menu {
  		text-align: center;
  		font-size: 22px;
  		width : 12%;
  		color : var(--color-bhit-1);
  	}
  	#m-menu table td {
  		text-align: center;
  		border : 1px solid #212121;
  		padding : 12px 0px;
  		font-size : 12px;
  		color : bisque;
  	}
  	#m-menu table td i {
  		font-size: 14px;
  		position: relative;
  		top: 2px;
  		right: 2px;
  	}
		.panel-body.board {
			min-height: 45vh;
		}
		.modal.mcasino .modal-body.modal-board-in {
			padding : 0 10px;
			height: 68vh;
		}
    .modal-dialog.board-in {
      width: 98%!important;
    }
    .mcasino .jumbotron {
    	padding-top: 15px;
    	padding-bottom: 15px;
    }
    .mcasino.board .bt-close {
    	margin : 5px auto 10px;
    }
    .board-in-title .title {
    	font-size: 18px;
    	margin-bottom: 15px;
    }
    .modal-head-panel.board {
    	margin-top: 13px;
    }
    .table_a.boardlist td {
      padding: 12px 0px;
      font-size: 14px;
    }
		.login .mid-table-right td:nth-child(1) {
			padding-left: 6px;
			padding-right: 3px;
		}
		.login .mid-table-right td:nth-child(2) {
			padding-left: 3px;
			padding-right: 6px;
		}
		.login .mid-table-left td i {
			top: 0px;
			right: 1px;
		}
    #joinModal { top : 0; }
		#joinModal .modal-body {
			padding : 30px 0px 50px;
		}
		#joinModal .modal-body i {
			font-size: 28px;
		}
		#joinModal .modal-body h4 {
			font-size: 16px;
			margin-bottom: 5px;
		}
		#joinModal .bt.full,
		#joinModal input {
			width: 90%!important;
			margin : 0 auto;
			margin-top: 15px;
		}
    .modal.join .modal-dialog {
      top: 0;
    }
    .modal.join .modal-header {
      padding : 5px 0px;
    }
    #joinModal .modal-body i, .modal.join .modal-header {
      margin : 10px 15px;
    }
    .modal.join .modal-body {
      padding : 10px;
    }
    .modal.casino-list .panel-body {
      padding: 15px 6px;
    }
    .modal.casino-list .panel-body .col-lg-2 {
      padding-left: 4px;
      padding-right: 4px;
    }
    .modal.casino-list .thumbnail .review {
      font-size: 11px;
    }
    .modal.casino-list .thumbnail .caption {
      padding : 3px;
    }
    .tab-content.chex {
      max-height: 100%;
    }
    .tab-content.chex table td:nth-child(3) {
      width: 30%;
    }
    .modal.letter .modal-body {
    	font-size: 20px;
    }
    .popup_box_admin {
    	width: 100%;
    }
    .pop-title-top {
    	padding : 30px 0px;
    }
    .popup_box_admin .pop-close {
    	font-size: 40px;
    }
	}
	
	/* XXS Size */

  @media(max-width:600px){ 
    .toggle-btn {
      width: calc(50% - 30px);
      font-size: 14px;
    }
    .toggle-btn .indicator {
      font-size: 18px;
      position: relative;
    }
  }

  /* XXXS Size */
  @media(max-width:500px){ 
    .main-menu li a {
      font-size: 12px;
    }
    .main-menu li a i {
      display: none;
    }
    .toggle-section {
      padding: 0 5px;
    }
    .toggle-btn {
      width: calc(50% - 8px);
      height: 50px;
      margin: 10px 4px 0;
    }
    .toggle-btn .btn-panel {
      border-radius: 5px;
    }
    .toggle-btn .btn-panel:after {
      display: none;
    }
    .toggle-btn .icon-panel {
      width: 80px;
      height: 50px;
    }
    .toggle-btn:first-child .icon-panel {
      margin-left: -10px;
      margin-right: 0;
    }
    .toggle-btn:last-child .icon-panel {
      margin-right: -10px;
      margin-left: 0;
    }
    .toggle-btn .icon-panel img {
      max-height: 44px;
    }
    .toggle-btn {
      font-size: 12px;
    }
    .toggle-btn .indicator {
      font-size: 14px;
    }
  }


	/* XXXXS Size */
  @media (max-width : 378px) {
    .toggle-btn .icon-panel img {
      max-height: 38px;
    }
    .toggle-btn {
      font-size: 13px;
    }
  }