@charset "utf-8";

@media (min-width:767px) {
	.pc-none {display: none !important;}
}
@media (max-width:767px) {
	.mobile-none {display: none !important;}
}

/*팝업*/
.gamespop,.servicepop,.eventpop {
  display: none;
  position: fixed;
  top: 0;
	left: 0;
  background-color: rgba(0, 0, 0, 0.3);
  z-index: 100;
	width: 100%;
	height: 100%;
}

.gamespop .btn-close, .servicepop .btn-close, .eventpop .btn-close {position: absolute; right: 15px; top: 10px; font-size: 14px; font-weight: bold; color: #fff;}
.gamespop .btn-close:hover, .servicepop .btn-close:hover, .eventpop .btn-colse:hover {color: #ff6c6c;}

.gamespop.show,.servicepop.show, .eventpop.show {
  display: block;
}
.gamespop.hide,.servicepop.hide, .eventpop.hide {
	display: none;
}

.pop-content {position: relative; top: 50%; left: 50%; transform: translate(-50%,-50%); max-width: 500px; background: #333; padding: 2rem;border-radius: 10px; box-shadow: 0px 3px 8px #2f2f2fb0; color: #fff;}
.pop-content .pop_tag {font-size: 1.5rem; margin-bottom: 1rem; font-weight: bold;}
.pop-content .pop_title {font-size: 16px; font-weight: bold;}
.pop-content .pop_title img {width: 25px; position: relative; top: -2px;}
.pop-content table {background: #fff; color: #333; border-color: #ddd;}

.eventpop .pop-content .event-view {display: flex; flex-wrap: wrap;}
.eventpop .pop-content .event-view span {flex: 0 0 49%; margin-left: 1%; margin-bottom: 1%; background: #fff; color: #333; font-weight: bold; text-align: center;}

.gamespop .pop-content {max-width: 800px; min-height: 500px; max-height: 600px; overflow: auto;}
.games_box h3 {font-size: 1.2rem; margin-bottom: 1rem; margin-left: 1%; color: #d3d3d3; margin-top: 1rem;}
.games_box div span {flex: 0 0 15.6%; text-align: center; background: #fff; color: #000; font-weight: bold; padding: 5px 0; border-radius: 5px; margin-left: 1%; margin-bottom: 1%;}

@media (max-width:480px) {
	.pop-content {max-width: 320px; padding: 2rem 1rem;}
	.pop-content h2 {font-size: 1.2rem;}

	.gamespop .pop-content {max-width: 320px; max-height: 400px; overflow: auto;}
	.games_box div span {flex: 0 0 32%; font-size: 12px;}
}

/* TOOLTIP */
[data-tooltip]{position:relative; cursor: pointer;}
[data-tooltip]:before,
[data-tooltip]:after{visibility:hidden;opacity:0;position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;transition:all .2s ease;font-size:11px;font-family:dotum;letter-spacing:-1px;}
[data-tooltip]:before{content:attr(data-tooltip);position:absolute;top:-20px;padding:7px 10px;border-radius:5px;color:#fff;background:#e52e2e;}
[data-tooltip]:after{content: '';border-left:5px solid transparent;top:2px;border-right:5px solid transparent;border-top:5px solid #e52e2e;}
[data-tooltip]:not([data-tooltip=""]):hover:before{visibility:visible;opacity:1;top:-42px}
[data-tooltip]:not([data-tooltip=""]):hover:after{visibility:visible;opacity:1;top:-8px}

@media (max-width:767px) {
	[data-tooltip]:not([data-tooltip=""]):hover:before {top: 23px;}
	[data-tooltip]:not([data-tooltip=""]):hover:after { top: 18px;}
	[data-tooltip]:after {border-bottom: 5px solid #e52e2e; border-top: 0;}
	[data-tooltip]:before {width: 320px; text-wrap: auto; transform:translateX(-53%)}

	#bo_v_infomation .faicon-info i {font-size: 18px !important;}
}

#bo_cate_wrap {padding: 2rem; border-radius: 5px; background: #fff; border: 1px solid #ddd;}
#bo_cate_wrap .list-group-item {border: 0; padding: 0;}
#bo_cate_wrap .row {margin: 0;}
#bo_cate_wrap .list-group-item .col-cate-title {flex: 0 0 80px;}
#bo_cate_wrap .list-group-item .col-cate-item {flex:auto;}
#bo_cate_wrap .col-form-label {line-height: 1; padding: 0;}
#bo_cate_wrap .list-group-item .col-cate-item label {margin: 0;}
#bo_cate_wrap .list-group-item .col-cate-item .inlabel {
	padding: 7px 10px;
	border-radius: 3px;
	background: #f7f8fa;
	border: 1px solid #ddd;
	line-height: 1;
}

#bo_cate_wrap .list-group-item .col-cate-item1 { display: flex; flex-wrap: wrap; margin-left: -1%;}
#bo_cate_wrap .list-group-item .col-cate-item1 label {
	margin: 0;
	background: #f7f8fa;
	border: 1px solid #ddd;
	padding: 2px 5px;
	margin-bottom: 5px;
	flex: 0 0 15.6%;
	margin-left: 1%;
}

#bo_cate_wrap .list-group-item .col-cate-item2 { display: flex; flex: auto;}
#bo_cate_wrap .list-group-item .col-cate-item2 label {
	margin: 0;
	background: #f7f8fa;
	border: 1px solid #ddd;
	padding: 2px 5px;
	margin-bottom: 5px;
	margin-right: 1%;
}

#bo_cate_wrap .cateline {border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}

.write_inlabel {
	margin: 0;
	background: #fff;
	border: 1px solid #ddd;
	padding: 2px 10px;
	margin-bottom: 5px;
	margin-right: 1%;
}

@media (max-width:767px) {
	#bo_cate_wrap .list-group-item .col-cate-item1 label {
		flex: 0 0 18.9%;
	}
}

@media (max-width:480px) {
	#bo_cate_wrap {padding: 1rem;}

	#bo_cate_wrap .list-group-item .col-cate-title { margin-bottom: 5px;}

	#bo_cate_wrap .list-group-item .col-cate-item label {flex: 0 0 49%; margin-bottom: 5px;}

	#bo_cate_wrap .list-group-item .col-cate-item {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	#bo_cate_wrap .list-group-item .col-cate-item .inlabel {
		flex: 0 0 49%;
		margin-bottom: 5px;
	}

	#bo_cate_wrap .list-group-item .col-cate-item2 {flex-wrap: wrap;}
	#bo_cate_wrap .list-group-item .col-cate-item2 label {
		flex: 0 0 49%;
		margin-left: 0;
	}

	#bo_cate_wrap .list-group-item .col-cate-item1 {margin-left: 0; justify-content: space-between;}
	#bo_cate_wrap .list-group-item .col-cate-item1 label {
		flex: 0 0 49%;
		margin-left: 0;
	}
}

.box-style {
  padding: 10px;
  border-radius: 10px;
  box-shadow: 2px 3px 6px 0px rgb(0 0 0 / 13%);
  -webkit-box-shadow: 2px 3px 6px 0px rgb(0 0 0 / 13%);
  -moz-box-shadow: 2px 3px 6px 0px rgb(0 0 0 / 13%);
}

.pn-box-style {
  border-radius: 10px;
  box-shadow: 2px 3px 6px 0px rgb(0 0 0 / 13%);
  -webkit-box-shadow: 2px 3px 6px 0px rgb(0 0 0 / 13%);
  -moz-box-shadow: 2px 3px 6px 0px rgb(0 0 0 / 13%);
}

/*제휴사이트 게시판*/
#bo_v_infomation .v-info-box { font-size: 15px;}
#bo_v_infomation #bo_v_img img {margin: 0;}

#bo_v_infomation .v-info-top-title {background: #fff; display: flex; justify-content: space-between; align-items: center; margin-top: 1rem;}
#bo_v_infomation .v-info-top-title a,#bo_v_infomation .v-info-top-title button {width: 49.5%; border: 2px solid #333; text-align: center; border-radius: 10px; padding: 10px; background: #fff; font-weight: bold;}
#bo_v_infomation .v-info-top-title img {width: 30px;}

#bo_v_infomation .v-info-txt {margin-top: 1rem;}
#bo_v_infomation .v-info-txt table {
  width: 100%;
  border-radius: 10px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0; box-shadow: 2px 5px 8px #9b9b9b59;
  -webkit-box-shadow:2px 5px 8px #9b9b9b59;
  -moz-box-shadow:2px 5px 8px #9b9b9b59;
}
#bo_v_infomation .v-info-txt .mobile-none th {background: #333; color: #fff; width: 120px; border-bottom: 1px solid #818181; text-align: center;}
#bo_v_infomation .v-info-txt .mobile-none td {border: 1px solid #ddd; border-bottom:0;}
#bo_v_infomation .v-info-txt .mobile-none tr:first-child th:nth-child(1) {border-radius: 10px 0 0 0;}
#bo_v_infomation .v-info-txt .mobile-none tr:first-child td:nth-child(4) {border-radius: 0 10px 0 0;}

#bo_v_infomation .v-info-txt .mobile-none tr:last-child th:nth-child(1) {border-radius: 0 0 0 10px;}
#bo_v_infomation .v-info-txt .mobile-none tr:last-child td:nth-child(4) {border-radius: 0 0 10px 0;}
#bo_v_infomation .v-info-txt .mobile-none tr:last-child td {border-bottom: 1px solid #ddd;}
#bo_v_infomation .v-info-txt .mobile-none .v-info-las-box {display: flex; gap: 5px; flex-wrap: wrap;}

#bo_v_infomation .v-info-txt .pc-none th {background: #333; color: #fff; width: 100px; border-bottom: 1px solid #818181; text-align: center;}
#bo_v_infomation .v-info-txt .pc-none td {border: 1px solid #ddd; border-bottom:0;}
#bo_v_infomation .v-info-txt .pc-none tr:first-child th:nth-child(1) {border-radius: 10px 0 0 0;}
#bo_v_infomation .v-info-txt .pc-none tr:first-child td:nth-child(2) {border-radius: 0 10px 0 0;}

#bo_v_infomation .v-info-txt .pc-none tr:last-child th:nth-child(1) {border-radius: 0 0 0 10px;}
#bo_v_infomation .v-info-txt .pc-none tr:last-child td:nth-child(2) {border-radius: 0 0 10px 0;}
#bo_v_infomation .v-info-txt .pc-none tr:last-child td {border-bottom: 1px solid #ddd;}

#bo_v_infomation .v-info-txt td a i {font-size: 14px; margin-left: 3px; color: #fff; background: linear-gradient(45deg, #498bde, #d176ff); padding: 5px; border-radius: 50rem;}
#bo_v_infomation .v-info-txt td a i:hover {background: linear-gradient(45deg, #d7d7d7, #d176ff);}
#bo_v_infomation .v-info-event {font-size: 14px;}
#bo_v_infomation .v-info-sites-cate span {background: #ebebeb; color: #111; padding: 7px 8px; display: inline-block; line-height: 1; border-radius: 5px; font-size: 14px;}
#bo_v_infomation .v-info-ex-img img {width: 23px; position: relative; top: -2px;}
#bo_v_infomation .faicon-info i {font-size: 21px; position: relative; top: 2px; color: #333;}
#bo_v_infomation .faicon-info:hover i {color: #e52e2e;}

#bo_v_con .bo_v_con_info_txt {margin-top: 1rem;}
#bo_v_con .bo_v_con_info_txt span {background: #fff; color: #333; font-weight: bold; font-size: 16px; padding: 7px 20px; border-radius: 10px; margin-left: 10px;}
#bo_v_con .bvc_info_txt2 {margin-top: 4rem;}
#bo_v_con .bvc_info_txt2 span {border-radius: 10px 10px 0 0;}
#bo_v_con .bo_v_con_info_txt p {background: #333; color: #fff; margin-top: -15px; margin-bottom: 2rem; padding: 22px 10px 10px 10px; border-radius: 10px;}
#bo_v_con .bvc_info_txt p {background: #efefef; color: #333; margin-top: -5px; padding: 10px;}
#bo_v_con .bo_v_con_info_txt p a {padding: 6px 13px 6px 9px; background: #ffcaca; color: #f75555; border-radius: 5px; font-size: 15px; font-weight: bold; position: relative; left: 15px;}
#bo_v_con .bo_v_con_info_txt p a img {width: 20px; position: relative; top: -1px;}
#bo_v_con .bo_v_con_info_txt p a:hover {background: #ff5959; color: #fff;}
#bo_v_con .bo_v_con_info_txt hr {display: block; height: 5px; background: #e7110a; margin-top: -4px; margin-bottom: 2rem;}

.list_col {margin-bottom: 1rem;}
.list_col .list_col_setup {background: #fff;}
.list_title_custom {border-radius: 10px; margin-bottom: 5px;}
.list_title_custom div,
.list_fast_menu div {text-align: center; font-weight: bold; width: 50%;}
.list_title_custom div { padding: 5px 0; background: #333; color: #fff;}
.list_title_custom div:first-child {border-radius: 5px 0 0 5px; position: relative;}
.list_title_custom div:last-child { border-radius: 0 5px 5px 0;}

.list_title_custom div img {width: 15px; position: absolute; top: 4px;}

.list_fast_event {
	text-align: center;
	line-height: 1.5em;
	min-height: 3em;
	font-size: 13px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	margin: 0.5rem 0;
}
.list_fast_event span {display: inline-block;}

.list_fast_menu {display: flex; justify-content: space-between;}
.list_fast_menu div {border: 2px solid #333; margin-bottom: 0; padding: 5px 0; width: 49%; border-radius: 5px;}
.list_fast_menu div a {display: block;}

@media all and (max-width:991px) {
  #bo_v_infomation .v-info-box, #bo_v_infomation .v-info-event, #bo_v_infomation .v-info-sites-cate span, #bo_v_infomation .v-info-txt td button { font-size: 12px;}
  #bo_v_infomation #bo_v_img img {width: 100%; height: auto; max-width: 360px;}
  #bo_v_infomation .v-info-ex-img img,#bo_v_infomation .v-info-top-title img {width: 21px; top: -1px;}
  #bo_v_con .bo_v_con_info_txt span {font-size: 16px;}
}

@media (max-width:767px) {
  #bo_v_btn_wrap {flex-wrap: wrap;}
  #bo_v_btn_wrap #bo_v_btn {width: 100%;}
  #bo_v_con .bo_v_con_info_txt p a {display: block; width: 50%; text-align: center; margin: 0 auto; margin-top: 0.5rem; position: unset;}
}

@media (max-width:576px) {
  .list_col .list_col_setup {font-size: 13px;}
  .list_col .list_col_setup .img-wrap a img {height: 100%;}
  .list_title_custom {margin-bottom: 3px;}
  .list_fast_menu div {margin-bottom: 0;}
  .list_title_custom div {width: 100%;}
  .list_fast_menu div {width: 49.5%; padding: 2px 0;}
	.list_title_custom div:first-child {border-radius: 5px;}
  .list_title_custom div:last-child {display: none;}

	#bo_v_infomation .v-info-txt td a i {font-size: 10px;}
	#bo_v_con .bo_v_con_info_txt p {font-size: 13px;}
}

/* 모바일 목록 */
@media all and (max-width:767px) {
	.responsive #bo_list .float-left.float-md-none {
		margin-right:0.75rem;
	}
	.responsive #bo_list .na-title {
		margin-bottom:0.14rem;
	}
}

/* gallery */
#bo_gallery .chk-box {
	position:absolute;
	bottom:5px;
	right:10px;
	z-index:2;
}
#bo_gallery .wr-now {
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	background:rgba(0,0,0,0.75);
	z-index:1;
}

/* 게시판 읽기 */
#bo_v_title {
	font-size: 1.5rem !important;
	text-align: center;
	padding: 2rem;
	background: linear-gradient(45deg, #ebebeb, #fdfdfd);
	border-radius: 10px;
	border: 1px solid #ddd;
}
#bo_v_con {
	min-height:200px;
	word-break:break-all;
	overflow:hidden
}
@media all and (max-width:575px) {
	.responsive #bo_v_title {
		font-size:20px;
		line-height:1.5;
	}
	.responsive #bo_v_con {
		min-height:140px;
	}
}

#bo_v_con img {
	max-width:100%;
	height:auto
}
#bo_v_img {
	width:100%;
	text-align:center;
	overflow:hidden;
	zoom:1;
}
#bo_v_img:after {
	display:block;
	visibility:hidden;
	clear:both;
	content:"";
}
#bo_v_img a.view_image {

}
#bo_v_img img {
	margin-bottom:1.0rem;
}

/* 게시판 읽기 : SNS 공유 */
#bo_v_sns_icon {
	margin:-5px auto;
}
#bo_v_sns_icon img {
	width:40px;
	border-radius:50%;
	margin:5px;
}

/* 게시판 댓글 : 내용 */
.cmt-reply {
	top:0;
	left:-16px;
}
.by-writer {
	background:#fbefef !important;
	border-top:1px solid #f6cece !important;
}
.cmt-content {
	word-break:break-all;
	overflow:hidden
}
.cmt-content img {
	max-width:100%;
	height:auto
}

/* 게시판 댓글 : 대댓글, 수정, 삭제 */
.cmt-btn ul {
	list-style: none;
	margin: 0;
}
.cmt-btn ul > li {
	float: left;
	font-size:12px;
	padding: 0 10px;
}
.cmt-btn ul > li::before {
	float: left;
	color:#ccc;
	content: "|";
	margin-left:-12px;
}
.cmt-btn ul > li:last-child {
	padding-right:0;
}
.cmt-btn ul > li:first-child::before,
.cmt-btn ul > li.no-bar::before {
	content: "";
	margin-left:0;
}
.cmt-btn ul > li > a {
	float:left;
	color:#888;
	white-space:nowrap;
}

/* 게시판 댓글 : 쓰기폼 */
#fviewcomment #wr_content {
	resize:none;
}
@media all and (max-width:575px) {
	.responsive .cmt-box {
		border-right:0 !important;
	}
	.responsive #bo_vc_w .cmt-box {
		border-left:0 !important;
		border-radius:0 !important;
	}
	.responsive #bo_vc_login {
		border-left:0 !important;
		border-right:0 !important;
		border-radius:0 !important;
	}
}

/* 게시판 댓글 : SNS 등록 */
#bo_vc_opt ol {
	margin:0;
	padding:0;
	list-style:none;
	zoom:1;
	background:#ccc;
	border-radius:3px;
}
#bo_vc_opt ol:after {
	display:block;
	visibility:hidden;
	clear:both;
	content:"";
}
#bo_vc_opt ol li {
	float:left;
	margin:0;
}
#bo_vc_send_sns ul {
	margin:0;
	padding:0;
	list-style:none;
	zoom:1;
}
#bo_vc_send_sns ul:after {
	display:block;
	visibility:hidden;
	clear:both;
	content:"";
}
#bo_vc_send_sns ul li {
	float:left;
	margin:0 1.0rem 0 0;
}
#bo_vc_send_sns input {
	margin:0 0 0 0.5rem;
}

/* 게시판 쓰기 */
#bo_w .list-group-item {
	padding-left:0;
	padding-right:0;
	border-left:0;
	border-right:0;
}
#bo_w #wr_content {
	margin-bottom:1.0rem !important;
}
@media all and (max-width:575px) {
	#bo_w .list-group-item {
		padding-left:1.0rem;
		padding-right:1.0rem;
	}
	.responsive #bo_w #wr_content {
		max-height:160px !important;
	}
}


/*서비스 테이블*/
.write_svc_table table {width: 100%; text-align: center; background: #fff;}

.wr-slot-search,
.wr-game-search {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
}

.wr-slot-search label,
.wr-game-search label {
	flex: 0 0 calc((100% - 4 * 5px) / 5);
	padding: 0 0 0 10px;
	margin: 0;
	background: #fff;
	border: 1px solid #eee;
}

.site-off-link {
	border: 0;
	outline: 0;
	display: flex;
	align-items: center;
	margin: 2rem auto 0;
	padding: 1rem 2rem;
	border-radius: 10px;
	background: #3568dc;
	color: #fff;
	font-weight: bold;
}
.site-off-link:hover {
	opacity: 0.9;
}

@media (max-width:767px) {
	.wr-slot-search label,
	.wr-game-search label {
		flex: 0 0 calc((100% - 3 * 2px) / 2)
	}
}
