/* for bootstrap */
.bd_font .select,.bd_cnb *,.bd .cTab *,.bd_zine.card,.bd_zine.card li,.bd_pg *,.bd .profile,.bd .rd_vote a,.tmb_wrp .ribbon *,.tmb_wrp,.bd_faq .mrk,.guest_itm_nav{-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}

.display-toggle{
	display: none;
}

.stk_display{
	padding: 0;
	min-height: 200px;
	width: 100%;
	margin: 15px auto 0 auto;
	line-height: 0;
	background:#fff;
	border:1px solid #ededed;
	border-radius:8px;
	box-shadow: 0 2px 8px -2px rgba(26, 26, 26, 0.1);
}

.stk_display .stk_body{
	border-top:1px solid #ededed;
	/*width: 100%;*/
}

.stk_display .stk_head{
    box-sizing: border-box;
	text-align: center;
}

.stk_display .stk_head>ul>li{
	float: left;
	position: static;
	background: #fff;
}

.stk_display>.stk_head>ul>li.sticker_icon1 {
	display:inline-block;
	font-size: 20px;
	width: 20px;
	height: 20px;
	text-align: center;
	margin-top:15px;
	background-color: #EEE;
	line-height: 20px;
	color: #A0A0A0;
}


.stk_display>.stk_head>ul>li.sticker_icon {
	display:inline-block;
	_font-size: 20px;
	width: 45px;
	height: 45px;
	text-align: center;	
	line-height: 45px;
	
}

.stk_display>.stk_head>ul>li.sticker_icon:hover {
background-color: #f8f8f8;

}


.stk_display>.stk_head>ul>li:nth-child(n+2){
}

.stk_display>.stk_head>ul>li.sticker_icon a{
	text-decoration: none;
	color: #A0A0A0;
}

.stk_cmt .sticker_pack, .stk_cmt_reply .sticker_pack{
	padding: 0;
	margin: 0;
	display: inline-block;
	display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-flex-wrap:wrap; -ms-flex-wrap:wrap;flex-wrap:wrap; -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center;justify-content:center
}

.sticker_pack>li{
	display: inline-block;
    border-right: 1px solid #ededed;
}

.sticker_pack div>img{
	width:45px;
	height:45px;
	object-fit: cover;
}

.stk_display>.stk_body{
	padding: 3px;
}

.stk_display>.stk_body>ul{
	overflow-y:auto;
	_text-align: center;
	_min-height: 210px;
	max-height: 210px;
	padding: 10px 20px 10px 20px;
}

.stk_display>.stk_body>ul>li{
	display: inline;
}

.stk_display>.stk_body>ul>li>a{
	display: inline-block;
	background-size: cover;
	background-position: 50% 50%;
	width: 116px;
	height: 116px;
	margin: 5px;
	border-radius:3px;
}


@media screen and (max-width:768px) {
	.stk_display>.stk_body>ul>li>a{
	display: inline-block;
	background-size: cover;
	background-position: 50% 50%;
	width: 70px;
	height: 70px;
	margin: 5px;
	border-radius:3px;
  }
}

@media screen and (max-width:479px) {
	.stk_display>.stk_body>ul>li>a{
	display: inline-block;
	background-size: cover;
	background-position: 50% 50%;
	width: 64px;
	height: 64px;
	margin: 5px;
	border-radius:3px;
  }
}


.stk_display>.stk_body>ul>li>a:hover { 
	  background-color: #f8f8f8;
  border-radius: 3px;
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
  -webkit-box-shadow: 0 4px 24px rgba(26, 26, 26, 0.3);
          box-shadow: 0 4px 24px rgba(26, 26, 26, 0.3);
	
}

.srl, .srl1 { 
	_margin:3px; 
	_padding:3px; 
	_border:1px solid #ededed; 
	_border-bottom-color:#CCC; 
	_border-radius:8px;
	_box-shadow:0 1px 3px -1px rgba(0,0,0,.1);*zoom:1 
}

.srl1 .svg { 
	padding-top:8px
}

.srl:hover { 

}

/*대댓글일 경우 스티커 이미지 위로 닉네임이 위치하는 현상이 있음 .lulu.levels1를 빼면 단순 대댓글에도 줄바꿈이 되버림*/
.lulu.levels1 .sombra-content .somb-truncate {
    display: inline-block !important;
    float: none !important;
    margin-bottom: 8px !important;
}

@media screen and (max-width:479px) {
	.stk_display>.stk_head>ul>li.sticker_icon {
		display:inline-block;
		_font-size: 20px;
		width: 45px;
		height: 45px;
		text-align: center;
		line-height: 45px;
			}

	.sticker_pack div>img{
		width:45px;
		height:45px;
		object-fit: cover;
	}
}