@charset "utf-8";
html
{
		font-size:13px;
}
*{
    margin:0;
    padding:0;
}

[class ^="pc"]
{
	display:none;
}

a
{
	text-decoration:none;
	color:inherit;
}


			.phone_img_wrap
			{
					position:absolute;
					top:0px;
				    width:100%;
					height:auto;
					display:block;
			}
			
			.phone_img_wrap > img
			{
				width:100%;
			}

/*1번 페이지*/
body{
    background:#212326;
}

/*온라인 아카데미 메인 스클 현황판*/
#card_main_area
{
position: relative;

        width: 100%;

}
						
#first_top
{
position: relative;
        height: 100%;
        z-index: 1;
        margin: auto;
        left: 0px;
        right: 0px;
        gap: 30px;
        display: flex;
        flex-direction: column;
        padding-top: 20%;
}
						
.logo
{
position: relative;
        text-align: center;
        color: #b1a096;
        font-size: 0.8rem;
        font-weight: bold;
        padding: 15px 5px;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 10px;
        width: 75%;
        margin: 0px auto;
}

.logo img
{
	width:25px;
}						


.battle_box
{

		
	position:relative;
    border: 2px solid #ffffff;
    border-radius: 20px;
    padding: 30px 12px;

	        width: 70%;
        box-sizing: border-box;
        margin: 0px auto;
}

.season
{
	position:relative;
    text-align:center;
    color:#ffd7ff;
    font-size:1rem;
    font-weight:bold;

}

.match
{
position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
		         padding: 5px 0px 30px 0px;
}

.title
{
        position: relative;
        text-align: center;
        color: #b1a096;
        font-size: 0.9rem;
        font-weight: 900;
        padding: 0px 0px 10px 0px;
}

.sub
{
        position: relative;
        text-align: center;
        padding: 10px 0px 0px 0px;
        font-size: 0.95rem;
        font-weight: 600;
        color: #ffd7ff;
		
}

.team_left
{
	position:relative;
    
    font-size:2rem;
    font-weight:900;
}

.team_right
{
	position:relative;
    
    font-size:2rem;
    font-weight:900;
}

.vs
{
	position:relative;
    color:#ffd7ff;
    font-size:1.2rem;
    font-weight:bold;
}

.score_row
{
	position:relative;
    display:flex;
    justify-content:space-between;
    padding:5px 0px;
}

.score
{
	position:relative;
    width:45%;
    text-align:center;
}

.score .name
{
	position:relative;
    font-size:0.7rem;
}

.score .num
{
	position:relative;
    font-size:1.2rem;
    font-weight:900;
}

.left
{
	position:relative;
    
}

.right
{
	position:relative;
    
}

.bar
{
position: relative;
        width: 100%;
        height: 15px;
        background: #1f2f59;
        border-radius: 7px;
        overflow: hidden;
        font-size: 0px;
}

.bar > div
{
	display:inline-block;
}

.bar_inner
{
	position:relative;
    height:100%;

    background:#59e0c4;

}

.bar_right
{
	position:relative;
    height:100%;

    background:#ff5d8a;

}

#bar_renewer
{
position: absolute;
        right: 0px;
        top: 0px;
        padding: 10px;
        display: inline-block;
        font-size: 2rem;
        cursor: pointer;
        color: #ffffff;
				user-select: none;
		-webkit-user-select: none;
		-webkit-tap-highlight-color: transparent;
}

#bar_renewer:hover
{
	color:#dadada;
}

.remain
{
position: relative;
        text-align: center;
        width: 78%;
        margin: 0px auto;
		padding-top:15px;
}

.remain_title
{
	position:relative;
    font-size:1rem;
	color: #ffffff;
	display:inline-block;
}



.d_day
{
    position: relative;
    display: inline-block;
    background: #000000;
    border-radius: 10px;
    padding: 0px 30px;
    font-size: 1.5rem;
    font-weight: 900;
    color: #ffd7ff;
}

.vote_notice
{
position: relative;
        list-style-type: none;
        color: #ffffff;
        font-size: 0.95rem;
        padding: 10px 0px;
}

#votebtn_area
{
	position:relative;
	text-align:center;
	width:100%;
	padding:20px 0px;
}

.vote_btn
{
        position: relative;
        padding: 10px 10px;
        border: none;
        border-radius: 7px;
        background: #000000;
        color: #ffffff;
        font-size: 1.3rem;
        font-weight: 500;
        cursor: pointer;
        border: 1px solid #ffffff;
        width: 70%;
}

.vote_bg
{
	position: relative;
}
						
.vote_bg > img
{
	width:100%;
}
						
.scl_notopen
{
position: relative;
        font-size: 2rem;
        text-align: center;
        color: #ffffff;
        padding: 20px 0px;
        width: 75%;
        margin: 0px auto;
        word-break: keep-all;
}
		
.scl_next_notice
{
        position: relative;
        color: #ffffff;
        border: 1px dashed #ffffff;
        padding: 10px 10px;
        text-align: center;
        font-size: 1.5rem;
        /* text-align: left; */
        line-height: 2;
        width: 75%;
        margin: 0px auto;
        box-sizing: border-box;

}

.scl_next_notice > ul
{
	list-style-type:none;
}

.scl_next_title
{
		color: #ff90a3;
        font-size: 1.3rem;
        display: block;
}

.scl_next_dbcont
{
        display: inline-block;
        padding: 5px 0px;
        font-size: 1.3rem;
        word-break: keep-all;
}
		
						/*온라인 아카데미 메인 스클 현황판*/

.all_footer
{
		position: relative;
        color: #909090;
        font-weight: bold;
        text-align: center;
        padding: 15px 5px;
        font-size: 1rem;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: auto;
        left: 0px;
        right: 0px;
        flex-direction: column;
		word-break:keep-all;

		
}



/*1번 여기까지*/

/*2번 페이지*/
	#second_top
	{
		position: relative;
        color:#ffffff;
        z-index: 1;
        padding-top: 20%;
	}
	

	.second_vote_title
	{
        position: relative;
        text-align: center;
        font-size: 1rem;
        font-weight: 800;
        padding: 5px 0px;
	}

	.vs_wrap
	{
position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 5px;
        padding: 10px 0px;
        width: 75%;
        margin: 0px auto;
        flex-direction: column;
	}

	#second_vote_team_view
	{
		position:relative;
		display: flex;
		flex-wrap: wrap;
		flex-direction: column;
		gap: 20px;
	}
	


	.desc
	{
		position:relative;
		text-align:center;
		font-size:1rem;
		font-weight:500;
		color:#f5f5f5;
	}
	
	.scl_agora
	{
position: absolute;
        top: 10%;
        right: 0px;
        left: 0px;
        margin: auto;
        border-bottom: 1px solid;
        width: 75%;
        text-align: right;
	}	
	.scl_agora::after
	{
		content: 'PC only';
        font-size: 0.8rem;
	}

	.second_card
	{
        position: relative;
        border-radius: 10px;
        padding: 10px 10px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 10px;
        flex-direction: column;
        text-align: center;
        width: 75%;
        margin: 0px auto;
        box-sizing: border-box;
	}



	.info
	{
position: relative;
        word-break: keep-all;
	}

	.team_name
	{
		font-size:1.4rem;
		font-weight:900;
	}



	.team_text
	{
		font-size:1rem;
		line-height:1.5;
		font-weight:600;
	}



	.vote_after_teamview_btn
	{
		display:inline-block;
		border:none;
		padding:15px 28px;
		border-radius:50px;
		color:white;
		font-size:1.1rem;
		font-weight:700;
		cursor:pointer;
	}



	.vote_after_character
	{
		position:relative;

	}

	.vote_after_notice
	{
position: relative;
        padding: 10px 0px;
        text-align: center;
        color: #e6e6e6;
        font-size: 1rem;
        word-break: keep-all;
	}
	
	.vote_after_notice > span
	{
		display:block;
	}		
	
	/*second*/
	
	
	/* third */
	
	#third_toparea
	{
position: relative;
        padding-top: 20%;
	}
	
	.third_back
	{
position: absolute;
        top: 0px;
        left: 0px;
        right: 0px;
        padding-left: 10px;
        width: 60px;
        font-size: 2.7rem;
        cursor: pointer;
        color: #ffffff;
		z-index:1;
				user-select: none;
		-webkit-user-select: none;
		-webkit-tap-highlight-color: transparent;
	}

	.team_view_title
	{
text-align: center;
        position: relative;
        width: 75%;
        margin: 0px auto;
	}

	.team_view_title h1
	{
font-size: 1rem;
        font-weight: 800;
        word-break: keep-all;
	}

	.team_view_title p
	{
position: relative;
        font-size: 1.6rem;
        color: #d7d7d7;
        padding: 10px 0px;
        word-break: keep-all;
	}

	.team_character_card
	{
        position: relative;
        display: flex;
        padding: 15px 10px;
        border-radius: 18px;
        color: #838383;
        align-items: center;
        flex-direction: column;
        text-align: center;
        width: 75%;
        margin: 0px auto;
        box-sizing: border-box;
	}

	.team_character_rank{
		position:absolute;
		left:0px;
		top:-10px;
		width:25px;
		height:25px;
		border-radius:50%;
		display:flex;
		align-items:center;
		justify-content:center;
		font-weight:900;
		font-size:1.2rem;
		box-shadow:0 3px 8px rgba(0,0,0,.25);
		z-index:1;
	}

	#third_teamview_rank
	{
        position: relative;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        gap: 20px;
        padding: 10px 5px;
		overflow-y: scroll;
	}

	.gold
	{
		background:#f5c65d;
	}

	.silver
	{
		background:#d5d8df;
	}

	.bronze
	{
		background:#d79b63;
	}



	.vote_toon_thumbnail
	{
		position:relative;
		width:200px;
		height:200px;
		background:#111;
		flex-shrink:0;
	}
	
	.vote_toon_thumbnail img
	{
		width:100%;
	}
	
	.vote_toon_thumbnail video
	{
		width:100%;
	}	

	.owl_toon_info{
		flex:1;
	}

	.owl_name
	{
		position:relative;
font-size: 1.3rem;
        font-weight: 700;
	}

	.owl_character_desc
	{
position: relative;
        font-size: 1rem;
        word-break: keep-all;
        font-weight: 700;
        padding-bottom: 10px;
	}

	.owl_toon_desc
	{
        position: relative;
        font-size: 1rem;
        word-break: keep-all;
        line-height: 1.5;
        font-weight: 700;
		padding-top:5px;
	}

	.owl_toon_like
	{
position: relative;
        color: #d94c6a;
        font-size: 1.5rem;
        font-weight: 800;
        padding: 3px 0px;
	}

	.third_team_view_box
	{
		position:relative;
		width:50px;
		height:50px;
		background:#ffd85a;
		border-radius:10px;
	}
	
	.third_team_view_box img
	{
		width:100%;
	}
	
	.third_team_view_box video
	{
		width:100%;
	}	

	.third_team_more
	{
		position:relative;
		text-align:center;
		padding:20px 0 10px;
		font-size:2rem;
		font-weight:800;
		color:white;
	}
	
	/*third*/
	
	/*forth*/
	
	
	.mobileonly_forth_back
	{
position: absolute;
        top: 0px;
        left: 0px;
        right: 0px;
        padding-left: 10px;
        width: 60px;
        font-size: 2.7rem;
        cursor: pointer;
        color: #ffffff;
		z-index:1;
				user-select: none;
		-webkit-user-select: none;
		-webkit-tap-highlight-color: transparent;
	}	
	
	.pconly_forth_back
	{
		display:none;
	}

		/* 상단 캐릭터 영역 */

		.selected_character
		{
text-align: center;
        position: relative;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        flex-direction: column;
margin: 19% auto 0px auto;
        width: 75%;
		}

		.selected_rank
		{
        position: relative;
        height: 100%;
        color: #ffffff;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        font-size: 3rem;
        font-weight: 900;
        background: #ff6600;
        padding: 10px 0px 30px 20px;
        box-sizing: border-box;
        clip-path: polygon(0% 0%, 100% 0%, 00% 100%, 0% 100%);
        line-height: 0.8;
		}
		
		.selected_owl_infoarea
		{
position: relative;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
		}

		.selected_owl_name
		{
position: relative;
        font-weight: 900;
        font-size: 2rem;
        padding-left: 20px;
		}


		.selected_owl_catchphrase
		{
        position: relative;
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        font-size: 1.5rem;
        flex-wrap: wrap;
        flex-direction: row;
        max-width: 550px;
        white-space: normal;
        overflow-wrap: normal;
        word-break: keep-all;
        box-sizing: border-box;
		}
		
		.selected_owl_rightarea
		{
position: relative;
        display: flex;
        align-items: center;
        gap: 20px;
        justify-content: space-between;
        width: 100%;
		}
		/* 캐릭터 자리 */

		.selected_owl_character
		{
		position: relative;
        width: 80px;
        height: 80px;
        background: #111;
        
        overflow: hidden;
        
		border-radius: 50%;
		}

		.selected_owl_character img
			{
			width: 100%;
			}
			
			.selected_owl_character video
			{
width: 100%;
        transform: scale(1.1);
        transform-origin: 140px 40px;
			}	
		
		#forth_vote_area
		{
position: relative;
        padding: 5px 0px;
        width: 75%;
        margin: 0px auto;
		}

		/* 내용 카드 */

		.forth_ep_info
		{
			position:relative;
		}


/*instargram postview*/
#instar_postview_area
{
	position:relative;
	background-color:#2b2d33;
}

#instar_postview_area>div
{
	position:relative;

}



 #instargram_img_area
{
	position:relative;	 
	padding:50px 5px;
	background-color:#2c2f34;
}

.insta_layout
{
	position:relative;

	display: flex;
    justify-content: space-between;	
}

.insta_content_box
{
	position:relative;
}

.instar_view
{
	position:relative;
	overflow:hidden;
}

 .instar_view img
 {
	 width:100%;
 }
 
 .instar_view video
{
	width:100%;
	display:block;
}

/*26 07 01 아이폰 드래그 문제 추가사항*/
.instar_view img, .instar_view video
{
    -webkit-user-drag:none;
    user-select:none;
    -webkit-touch-callout:none;
}
/*26 07 01 아이폰 드래그 문제 추가사항*/

.instar_view > ul
{
	position:relative;
	display: flex;
	list-style-type:none;
	padding-left:0px;

}

.instar_view > ul > li
{
	position:relative;
	flex-shrink: 0; 
	width: 100%;
	height: 100%;
	cursor:pointer;
	display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
}

.instar_tool
{
	position:relative;
	display: flex;

    justify-content: space-between;
    align-items: center;
}

.instar_tool_text_view
{
	position:relative;
	display: flex;
	color:#ffffff;
    justify-content: space-between;
    align-items: flex-start;
	padding:10px 10px;
	flex-direction: column;
}

.instar_tool_text_view_date
{
	color:#cdcdcd;
	font-size:0.9rem;
}


.instar_tool>ul
{
	position:relative;
	display: flex;
    list-style-type: none;
    width: 150px;
    justify-content: space-between;	
	padding:5px 20px;
}

.instar_tool>div
{
	position:relative;
	padding:5px 20px;
}

.instar_tool span
{
	font-size:2rem;
	color:#ffffff;
	cursor:pointer;
}

.instar_tool span:hover
{
	color:red;
}

.cheerup_like_count
{
	font-size:1rem!important;
}

.cheerup_area
{
	display: flex;
    align-items: center;
    gap: 10px;
}


.instar_count
{
	position:absolute;
	top:10px;
	right:10px;
	font-size:0.8rem;
}

.instar_count_view
{
	position:relative;
	border-radius:20px;
	background-color:#19191950;
	padding: 3px 15px;
	color:#ffffff;
	font-size: 0.8rem;
}

.instar_button
{
	position:absolute!important;
	bottom:25px;
	right:0px;
	left:0px;
	margin:auto;
	width:120px;
}

.button_center
{
	position:relative;
	display:none;
	justify-content: space-evenly;
	align-items: center;
}

.button_center > span
{
	display:inline-block;
	width:6px;
	height:6px;
	background-color:#c1c1c150;
	border-radius:3px;
}



.button_center > span:nth-child(1)
{
	width:8px;
	height:8px;
	border-radius:4px;
	background-color:#2e83ff50;
}
/*instargram postview*/


		/* 투표 영역 */

		.vote_real
		{
        position: relative;
        padding: 5px 0px;
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        flex-wrap: wrap;
        gap: 20px;
        color: #ffffff;
		word-break: keep-all;
		}

		.vote_chk_name
		{	
			position: relative;
        display: flex;
        flex-direction: column;
        gap: 18px;
        align-items: center;
        padding: 10px 0px;
		}

		.vote_item_real
		{
			position:relative;
			display:flex;
			align-items:center;
			gap:12px;
			font-size:1rem;
			font-weight:700;
		}

		.vote_item_real input
		{
			width:15px;
			height:15px;
		}
		
		.vote_form
		{
			position:relative;
			width:100%;
		}
		
		#phone_vote_btn
		{
			width:100%!important;
		}
		
		.view_vote_now
		{
			color: #ffff84;
			border-bottom: 1px solid;
			display:block;
			font-weight: 200;
		}	

					
			/*투표 직전 기투표시 팝업창*/
			#already_vote_popup{
			display:none;
			position:fixed;
			left:0;
			top:0;
			width:100%;
			height:100%;
			background:rgba(0,0,0,.7);
			z-index:99999;
			}

			#already_vote_popup_box{
			position: absolute;
			left: 50%;
			top: 50%;
			transform: translate(-50%, -50%);
			width: 95%;
			max-width: 500px;
			background: #000000;
			border: 1px solid #ffffff;
			border-radius: 15px;
			padding: 25px 10px;
			box-sizing: border-box;
			text-align: center;
			word-break:keep-all;
			}

			#already_vote_popup_title
			{
			font-size: 1.4rem;
			font-weight: bold;
			margin-bottom: 20px;
			word-break: keep-all;
			}

			#already_vote_popup_text
			{
        position: relative;
        padding: 20px 0px;
        font-size: 1.2rem;
        word-break: keep-all;
			}
			#already_vote_popup_info
			{
        background: #f5f5f5;
        padding: 15px;
        border-radius: 10px;
        line-height: 1.8;
        color: #000000;
        word-break: keep-all;
        box-sizing: border-box;
        max-height: 250px;
        overflow-y: scroll;
        position: relative;
			}

			#already_vote_popup button{
padding: 15px 40px;
        font-size: 1.2rem;
        border: 0;
        border-radius: 8px;
        cursor: pointer;
			}
			/*투표 직전 기투표시 팝업창 여기까지*/				
		
		
		
		/*forth*/
		
		/*fifth*/



	/* 완료 */

	.vote_complete
	{
position: relative;
        text-align: center;
padding: 20% 0px 20px 0px;
	}

	.complete_check_area
	{
		position:relative;
		font-size:3rem;
		color:#f2cc6c;
	}



	/* 캐릭터 */

	.complete_owl_circle
	{
		position:relative;
		width:100px;
		height:100px;
		margin:0px auto;
		border-radius:50%;
		background:#111;
		border:5px solid #d8c086;
	}

	/* 결과 문구 */

	.complete_view_result
	{
		position:relative;
		text-align:center;
		line-height:1.5;
	}

	.complete_view_result .today
	{
		font-size:2.1rem;
		font-weight:800;
	}

	.complete_view_result .target
	{
		font-size:3rem;
		font-weight:900;
		color:#66e7c0;
	}

	.complete_view_result .desc
	{
		font-size:2.2rem;
		font-weight:800;
	}

	/* 순위 카드 */

	.complete_rank_box
	{
position: relative;
        border: 2px solid rgba(212, 176, 107, .4);
        border-radius: 15px;
        padding: 15px 3px;
        width: 75%;
        box-sizing: border-box;
        margin: 0px auto;
        color: #ffffff;
        overflow-y: scroll;
	}

	.match_all_rank_title
	{
        position: relative;
        text-align: center;
        font-size: 1.1rem;
        font-weight: 700;
        padding: 10px 0px;
	}


	/*
		*/
	.complete_rank_item_alink
	{
		position:relative;
		display:block;
		padding:10px 0px;
		border-bottom:1px solid rgba(255,255,255,.08);
	}
	
	.complete_rank_item_boxarea
	{
		position:relative;
		display:flex;
		align-items:center;
		gap:5px;
		flex-direction: column;
	}
	
	.complete_rank_item_alink:last-child
	{
		border-bottom:none;
	}		

		/*
		*/
		

	.complete_rank_item
	{
		position:relative;
		display:flex;
		align-items:center;
		gap:5px;
		padding:10px 0;
		border-bottom:1px solid rgba(255,255,255,.08);
		        flex-direction: column;
		
	}

	.complete_rank_item:last-child
	{
		border-bottom:none;
	}

	.complete_madal
	{
		position:relative;
		width:22px;
		height:22px;
		border-radius:50%;
		display:flex;
		justify-content:center;
		align-items:center;
		font-weight:900;
		font-size:1.5rem;
		color:#111;
	}

	.complete_gold
	{
		background:#f4c85f;
	}

	.complete_silver
	{
		background:#cfd4dd;
	}

	.complete_bronze
	{
		background:#d5925f;
	}

	.complete_normal
	{
		background:#36456d;
		color:white;
	}

	/* 캐릭터 썸네일 */

	.complete_thumb
	{
		position:relative;
		width:50px;
		height:50px;
		border-radius:50%;
		background:#111;
		flex-shrink:0;
	}
	
 .complete_thumb img
 {
	 width:100%;
 }

.complete_thumb video
{
	width:100%;
	display:block;
}	

	.complete_name
	{
		font-size:1.2rem;
		font-weight:700;
	}

	.complete_score
	{
        font-size: 1.25rem;
        font-weight: 800;
        color: #fff681;
	}

	/* 버튼 */

	.complete_re_come
	{
position: relative;
        padding: 10px 0px;
        border: none;
        font-size: 1.08rem;
        font-weight: 400;
        text-align: center;
        color: #ffffff;
	}
	
	.complete_re_come > span
	{
		display:block;
	}
	
	.complete_after_go_link
	{
position: relative;
        display: flex;
        justify-content: space-around;
        width: 75%;
        margin: 0px auto;
        flex-direction: column;
		gap:8px;
	}	

	.go_main_home
	{
position: relative;
        text-align: center;
        font-size: 1.4rem;
        color: #ffffff;
        cursor: pointer;
        padding: 8px 0px;
        word-break: keep-all;
        box-sizing: border-box;
        border: 2px solid #c50000;
        border-radius: 10px;
        width: 95%;
        margin: 0px auto;
        background: linear-gradient(1deg, #a21818, transparent);
	}		
	
	.go_main_home > span
	{
		display:inline-block;
	}
	
	
	
		/*fifth*/


	
/* 캐릭터 굿즈 팝업 안내로 가는 완료페이지*/	

	.vote_complete_goodsview
	{
		position: relative;
        text-align: center;
		padding: 12% 0px 20px 0px;
	}
	
	
	.complete_goods_showwindow
	{
position: relative;

        display: flex;
        align-items: center;
        box-sizing: border-box;
        justify-content: space-between;
		border-radius:20px;

		   width: 75%;
        margin: 0px auto;
		        flex-direction: column;
	}
	
	.complete_goods_explain
	{
        position: relative;
        padding: 10px 5px;
        width: 92%;
	}
	
	.complete_goods_explain > h5
	{
position: relative;
        padding: 10px 10px;
        border-radius: 20px;
        background: linear-gradient(90deg, #16a3d9, #923979);
        font-size: 1.2rem;
        font-weight: 400;
        text-align: center;
        color: #ffffff;
	}
	
	.complete_goods_explain > h3	
	{
		position:relative;
		padding: 15px 5px;
        font-size: 2.2rem;
	}
	
	.complete_goods_explain > h3 >div
	{
		  /* 1. 배경에 선형 그라데이션 적용 */
	  background: linear-gradient(90deg, #b7deff, #ffc0ed);
	  
	  /* 2. 배경을 글자 모양으로 잘라내기 (웹킷 접두사 필수) */
	  -webkit-background-clip: text;
	  background-clip: text;
	  
	  /* 3. 원래 글자 색상을 투명하게 만들기 */
	  -webkit-text-fill-color: transparent;
	  color: transparent;
	  width: fit-content;
	  margin:0px auto;
	  text-align:center;
	}
	
	
	.complete_goods_explain > h4
	{
		    position: relative;
    font-weight: 100;
    font-size: 1.2rem;
    padding: 10px 15px;
	}
	
	.complete_goods_explain > ul
	{
		position:relative;
		list-style-type:none;
font-size: 0.95rem;
        color: #ffffff;
	}
	
	.complete_goods_image
	{
		position:relative;
	}
	
	.complete_goods_image > img
	{
		width:100%;
	}
	
	.complete_after_go_shop_result
	{
        position: relative;
        display: flex;
        justify-content: center;
        gap: 7px;
        padding: 10px 10px;
        box-sizing: border-box;
        border-radius: 20px;
        flex-direction: column;
        color: #ffffff;
        width: 75%;
        margin: 0px auto;

	}
	
	.complete_after_go_shop_result_title
	{
		display:none;
	}


	
	.go_goods_shop
	{
		position: relative;
        text-align: center;
        font-size: 1.5rem;
        color: #ffffff;
        font-weight: 700;
        cursor: pointer;
        padding: 10px 0px;
        border-radius: 10px;
        box-sizing: border-box;
        background: linear-gradient(90deg, #16a3d9, #923979);
		        line-height: 1.2;
	}
	
	.go_goods_shop>div
	{
		font-size:1.1rem;
		font-weight: 400;
	}	
	
	.go_vote_result_view
	{
		        position: relative;
        text-align: center;
        font-size: 1.5rem;
        color: #ffffff;
        font-weight: 700;
        cursor: pointer;
        padding: 10px 0px;
        border-radius: 10px;
        box-sizing: border-box;
        border: 2px solid #5f5f5f;
	}
	
	.go_vote_result_view>div
	{
		font-size:1.1rem;
		font-weight: 400;
	}
	

	#vote_complete_popup{
    display:none;
    position:fixed;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.45);
    z-index:99999;
}

#vote_complete_box
{
        position: absolute;
        left: 0px;
        top: 0px;
        right: 0px;
        bottom: 0px;
        width: 180px;
        margin: auto;
        height: 200px;
        background: #232323;
        border: 2px solid #ffffff;
        border-radius: 15px;
        padding: 35px 55px;
        text-align: center;
        box-shadow: 0 10px 30px rgba(0, 0, 0, .3);
        color: #ffffff;
}

#vote_complete_box .check{
    font-size:60px;
    color:#27ae60;
    font-weight:bold;
}

#vote_complete_box .text
{
    font-size:2rem;
    font-weight:bold;
}
/* 캐릭터 굿즈 팝업 안내로 가는 완료페이지*/

			/*투표 직전 기투표시 굿즈 연결 페이지 팝업창 여기까지*/		
			#already_vote_popup{
			display:none;
			position:fixed;
			left:0;
			top:0;
			width:100%;
			height:100%;
			background:rgba(0,0,0,.7);
			z-index:99999;
			}

			#already_vote_popup_box{
			position: absolute;
				left: 50%;
				top: 50%;
				transform: translate(-50%, -50%);
				width: 90%;
				max-width: 500px;
				background: #000000;
				border: 1px solid #ffffff;
				border-radius: 15px;
				padding: 25px;
				box-sizing: border-box;
				text-align: center;
			}

			#already_vote_popup_title
			{
		font-size: 1.6rem;
        font-weight: bold;
        position: relative;
        padding: 10px 0px;
			}
			
			#already_vote_popup_text
			{
position: relative;
        padding: 10px 0px 20px 0px;
        font-size: 1rem;
			}

			#already_vote_popup_info
			{
background: #f5f5f5;
        padding: 15px;
        border-radius: 10px;
        position: relative;
        line-height: 1.8;
        color: #000000;
        box-sizing: border-box;
        max-height: 300px;
        overflow-y: scroll;
		position: relative;
			}

			#already_vote_popup button
			{
padding: 10px 40px;
        font-size: 18px;
        border: 0;
        border-radius: 8px;
        cursor: pointer;
			}
			/*투표 직전 기투표시 굿즈 연결 페이지 팝업창 여기까지*/		
		
		
		/*sisxth*/
		/* 제목 */

		.sixth_title
		{
			position:relative;
			text-align:center;
			padding: 20px 0px;
		}

		.sixth_title h1
		{
        position: relative;
        font-size: 2.1rem;
        font-weight: 900;
        color: #ffffff;
		}

		.sixth_title p
		{
			position:relative;
			font-size:1.3rem;
			color:#d8d8d8;
		}

		/* 메뉴영역 */

		.come_menu
		{
			position: relative;
			display: flex;
			gap: 15px;
			justify-content: center;
			flex-wrap: wrap;
			padding: 20px 0px;

		}

		.come_menu_select
		{
        position: relative;
        background: rgb(33, 35, 38);
        border: 1px solid #f3f3f3;
        border-radius: 18px;
        padding: 20px 30px;
        text-align: center;
        min-width: 200px;
        width: 95%;
        box-sizing: border-box;
		}

		.come_menu_icon
		{
			position:relative;

		}

		.come_menu_select h3
		{
			position:relative;
			font-size:1.5rem;
			line-height:1.3;
			color: #ffffff;
		}
		
		.come_menu_select_desc
		{
			position:relative;
			font-size:1rem;
			color: #ffffff;
			padding: 5px 0px;
		}				
		
		.come_menu_select h3 > span
		{
			display:inline-block;
			padding:5px 0px;
		}
		
		.come_here_please
		{
			color: #fffc88!important;
		}

		/* 리그+버튼 영역 */

		.scl_banner_area
		{
position: relative;
        padding: 15px 5px;
		}

		.scl_banner
		{
position: relative;
        background: #000000;
        border: 2px solid #ffffff;
        border-radius: 18px;
        padding: 20px;
        display: flex;
        gap: 30px;
        align-items: center;
        color: #ffffff;
        flex-direction: column;
		}

		.scl_banner_icon
		{
			position:relative;
			width:40px;
			height:40px;
			background:#111;
			border-radius:12px;
			flex-shrink:0;
		}

		.scl_banner_text
		{
position: relative;
        display: flex;
        justify-content: space-around;
        width: 100%;
        align-items: center;
        text-align: center;
        flex-direction: column;
        gap: 20px;
		}

		.scl_banner_text h3
		{
			font-size:1.6rem;
		}
		
		.scl_banner_desc h3		
		{
			font-size:1.6rem;
        color: #fffc88;
		}
		
		.scl_banner_desc h3 > span
		{
			display:block;
		}
		
		
		.scl_banner_desc h3 > span:first-child
		{
		    font-size: 3.5rem;
		}


		.scl_banner_text p
		{
			position:relative;
			font-size:1.3rem;
			line-height:1.5;
			word-break: keep-all;
		}

		 .scl_banner_desc p
		{
			position:relative;
			font-size:1.3rem;
			line-height:2;
			word-break: keep-all;
		}

		.scl_banner_desc
		{
position: relative;
        display: flex;
        justify-content: space-around;
        width: 100%;
        align-items: center;
        text-align: center;
        flex-direction: column;
        gap: 20px;
		}

		.scl_banner_btn
		{
        background: #f3f3f3;
        border: 5px solid #d4b06b;
        box-sizing: border-box;
        color: white;
        border-radius: 30px;
        padding: 12px 25px;
        font-size: 1.4rem;
        font-weight: 800;
        cursor: pointer;
		}
		
		.scl_banner_btn img
		{
			width:50px;
		}

		/* 시즌안내 */
		
		.scl_now_info_area
		{
position: relative;
        padding: 15px 5px;
        display: flex;
        flex-direction: column;
        gap: 10px;
		}

		.scl_now_info_box
		{
			position:relative;
			background:#f6f0e5;
			color:#222;
			border-radius:16px;
			padding:20px;
		}

		.scl_now_info_title
		{
			position:relative;
			font-size:1.5rem;
			font-weight:900;
		}

		.scl_now_info_row
		{
display: flex;
        padding: 16px 0;
        border-top: 1px solid #ddd;
        font-size: 1.3rem;
        justify-content: space-between;
        flex-direction: column;
        align-items: center;
		}

		.scl_now_info_row:first-of-type
		{
			border-top:none;
		}

		.scl_now_info_label
		{
        color: #555;
        display: flex;
        flex-direction: row;
        gap: 5px;
		}

		.scl_now_info_value
		{
        font-weight: 800;
        display: flex;
        gap: 10px;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		}		
		
		.scl_info_cardmain
		{
			top:80px;
		}
		
		
		.footer_end
		{
			position:relative;
			text-align:center;
			color:#ffffff;
			word-break:keep-all;
			padding:30px 0px;
			font-size:1.4rem;
		}
		/*sisxth*/
		
/*굿즈 구경하고 선택하는 페이지*/		
		
				.season_goods_gap
				{
				gap:10px!important;
				}
			
				#season_goods_title
				{
        position: relative;

				}
				
				.season_goods_uptitle
				{
				position: relative;
				        font-size: 1.7rem;
				font-weight: 900;
				text-align: center;
				  /* 1. 배경에 선형 그라데이션 적용 */
			  background: linear-gradient(90deg, #b7deff, #ffc0ed);
			  
			  /* 2. 배경을 글자 모양으로 잘라내기 (웹킷 접두사 필수) */
			  -webkit-background-clip: text;
			  background-clip: text;
			  
			  /* 3. 원래 글자 색상을 투명하게 만들기 */
			  -webkit-text-fill-color: transparent;
			  color: transparent;
			width: fit-content;	  
			margin:0px auto;
				}
				
				.season_goods_uptitle::before
				{
				content:'💎';
				-webkit-text-fill-color: initial;
				color: initial;
				}

				.season_goods_uptitle::after
				{
				content:'💎';
				-webkit-text-fill-color: initial;
				color: initial;
				}			

				.season_goods_who
				{
					position:relative;
					text-align:center;
					    font-size: 1.3rem;
					padding: 5px 0px;
				}
				
				.season_goods_select
				{
						display: flex;
						justify-content: center;
						gap: 15px;
						padding: 5px 0px;
				}
				.season_goods_select > div
				{
					padding: 10px 20px;
						border-radius: 10px;
					
				}
				
				.season_goods_select > div:nth-child(1)
				{
						border: 1px solid #ffffff;
						color: #ffffff;
				}
				
				#season_goods_list
				{
        position: relative;
        display: flex;
        justify-content: flex-start;
        flex-direction: column;
        gap: 35px;
        padding: 5px 0px;
		width:97%;
		margin:0px auto;
		
        box-sizing: border-box;
				}
				
				.season_goods_each
				{
				position: relative;
					padding: 10px;
					border: 1px solid #ffffff;
					border-radius: 10px;
					box-sizing: border-box;
				}
				
				.season_goods_each > a
				{
			display: flex;
        align-items: center;
        flex-direction: column;
				}
				
				.season_goods_imgbox
				{
        position: relative;
        width: 95%;
				}
				
				.season_goods_imgbox > img
				{
					width:100%;
				}
				
				.season_goods_descbox
				{
				    position: relative;
					padding: 10px 0px;
					text-align: center;
				}
				
				.season_goods_description
				{
					position:relative;
					
				}
				
				.season_goods_productname
				{
				    font-weight: 700;
					font-size: 1.8rem;
					word-break: keep-all;
					padding: 5px 0px;
				}
				
				.season_goods_explain
				{
position: relative;
        min-height: 85px;
        color: #ffffff;
				}
				
				.season_goods_buyarea
				{
				position: relative;
					display: flex;
					flex-direction: row;
					justify-content: space-between;
					padding: 5px 10px 0px 10px;
				}
				
				
				
				.season_goods_pricewon
				{
    font-size: 1.6rem;
    display: flex;
    align-items: center;
    position: relative;
    color: skyblue;
    font-weight: 700;

				}
				
				.season_goods_scl_logo
				{
					font-size:2.5rem;
					position:relative;
				}
				
				.season_goods_scl_logo > img
				{
					width:30px;
				}
				
				#season_goods_pride
				{
		position: relative;

        padding: 10px 0px 0px 0px;
        width: 100%;
				}
				
				.season_goods_pride_text
				{
position: relative;
        display: flex;
        list-style-type: none;
        justify-content: space-around;
        text-align: center;
        padding: 10px 10px;
        background-color: #011c38;
        font-size: 0.9rem;
        color: #dadada;
        flex-direction: column;
        width: 100%;
        align-items: center;
				}
				
				.season_goods_pride_text>li
				{
        display: flex;
        align-items: center;
        width: 95%;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-start;
        margin: 0px auto;
				}
				
				.season_goods_pride_text>li:nth-child(2n)
				{
					
					border-right:1px solid #dadada;
				}
				
				.season_goods_emoticon
				{
					font-size:2rem;
					        padding: 0px 20px;
				}
				
				.season_goods_title
				{
					font-size:1.2rem;
					font-weight:600;
					text-align: left;
				}
/*굿즈 구경하고 선택하는 페이지*/				
		
	/* 굿즈 구매가 이뤄지는 매인페이지 */

	.go_popup_store
	{
		font-size: 2.5rem;
		font-weight: 900;
	}

.goods_topleft_vote_btn
{	
	display: flex;
    flex-direction: column;
    align-items: center;
}

.goods_top_scl_logo
{
position: relative;
        text-align: center;
        color: #b1a096;
        font-size: 0.8rem;
        font-weight: bold;
        padding: 15px 5px;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 10px;
        width: 75%;
        margin: 0px auto;
}

.goods_top_scl_logo img
{
	width:25px;
}					

	.season_goods_purchase
	{
	display: flex;
        justify-content: space-between;
        align-items: center;
        
		        flex-direction: row;
				position:relative;
				        color: #ffffff;
						width: 95%;
        margin: 0px auto;
        padding: 3% 10px 0px 10px;
	}
	
	.goods_cart
	{
		font-size:2rem;
	}

	.season_goods_purchase_board
	{
        position: relative;
        box-sizing: border-box;
        width: 95%;
        margin: 0px auto;
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        gap: 50px;

	}


	

	.goods_pucharse_info
	{
        position: relative;
        color: #ffffff;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
	}





	.goods_purchase_content
	{

        display: flex;
        position: relative;
        gap: 5px;
        flex-direction: column;
	}



	.goods_purchase_img_gallery
	{

		display: flex;
		position: relative;
		flex-direction: row;
		flex-wrap: wrap;
	}

	.goods_thumb_img_view
	{
		
display: flex;
        flex-direction: row;
        justify-content: center;
        flex-wrap: nowrap;
	}

	.goods_thumb_img_view > div
	{
        position: relative;
        width: 25%;
        background-color: #1b2035;
        border-radius: 10px;
        box-sizing: border-box;
        padding: 3px;

	}

	.goods_thumb_img_view > div > img
	{
		width:100%;
	}

	.goods_img_viewer
	{
		position: relative;

	}

	.goods_img_viewer > img
	{
		width:100%;
	}

	.goods_pucharse_info h1
	{
        font-size: 1.8rem;
        position: relative;
        padding: 5px 0px;
        text-align: center;
	}

	.goods_purchase_price
	{
		position:relative;
		color:#32ffe2;

		font-size:1.8rem;

		font-weight:bold;
			text-align: right;
		padding:10px;

	}




	.goods_purchase_product_info
	{
		position: relative;
		background: #333;
		border-radius: 15px;
		padding: 10px;
	}



	.good_purchase_view_bottom
	{

        display: flex;
        position: relative;
        padding: 10px 0px;
        flex-direction: column;
        justify-content: space-between;
        color: #ffffff;
        border: 1px solid #ffffff;
        box-sizing: border-box;
        background-color: #0c0004;

	}

	.scl_goods_creator
	{
	padding: 10px 20px;
		display: flex;
		gap: 10px;
		flex-wrap: wrap;
		flex-direction: row;
		max-width: 500px;
	}

	.project
	{
		border: 1px solid #252a44;
		border-radius: 20px;
		padding: 10px 20px;
		display: flex;
		gap: 10px;
		flex-wrap: wrap;
		flex-direction: row;
		align-items: center;
	}

	.goods_buy_goarea
	{
        border: 1px solid #252a44;
        border-radius: 20px;
        padding: 10px 20px;
        display: flex;
        gap: 10px;
        flex-wrap: wrap;
        flex-direction: column;
        align-items: center;

	}

	#goods_qty
	{
		width: 50px;
		text-align: center;
		font-size: 1.8rem;
		height: 45px;
		box-sizing: border-box;
	}

	#goods_minus, #goods_plus
	{
	width: 30px;
		font-size: 2rem;
		text-align: center;
			height:45px;
	}




	.goods_buybtn
	{
		border: none;
		border-radius: 12px;
		background: linear-gradient(90deg, #37ffe4, #ff57b8);
		font-size: 1.2rem;
		font-weight: bold;
		padding: 20px 30px;
		box-sizing: border-box;
		width:100%;
	}

	.goods_cartbtn
	{
		padding: 20px 30px;
		background:none;
		color:white;
		font-size: 1.2rem;
		border:1px solid #555;
		border-radius:12px;
		box-sizing: border-box;
		width:100%;
	}
	

	.notice_law_area
	{
        position: relative;
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
        background-color: #090b15;
        border-radius: 10px;
        border: 2px solid #ffb452;
        gap: 10px;
        color: #ffffff;
        align-items: center;
        width: 95%;
        margin: 20px auto;
        padding: 20px 0px;
		font-size: 1.1rem;
	}
	
	.warning_ment
	{
		    width: 95%;
    word-break: keep-all;
	}
	
	.warning_href
	{
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        gap: 5px;
        align-items: center;
	}
	
	.kbmark
	{
		overflow: hidden;
    width: 80px;
    height: 80px;
    border-radius: 50%;
	}	
	/* 굿즈 구매가 이뤄지는 매인페이지 */
		
		
		/*************/

.phone_a_menu_right 
	{
        position: absolute;
        width: 60px;
        height: 60px;
        top: 10px;
        right: 10px;
        background-image: url(../../19image/index/phone_open.png);
        background-repeat: no-repeat;
        background-size: cover;
    }
	
	
    .phone_menu_close 
	{
        position: absolute;
        width: 50px;
        height: 50px;
        top: 20px;
        right: 20px;
        background-image: url(../../19image/index/phone_close.png);
        background-repeat: no-repeat;
        background-size: cover;
        z-index: 110;
    }

    .phone_menu_toparea 
	{
        position: fixed;
        margin-right: -100%;
        right: 0px;
        top: 0px;
        height: 100%;
        width: 100%;
        background-color: #1c0d0d;
        z-index: 110;
        color: #ffffff;
        font-size: 1rem;
        padding: 0px 20px;
        box-sizing: border-box;
    }
	
	.phone_menu_toparea li
	{
		list-style-type:none;
	}

    .phone_menu_toparea_de 
	{
			position: relative;
        display: flex;
        padding: 100px 0px;
        gap: 30px;
        flex-wrap: wrap;
    }	
	
	 .phone_menu_toparea_de > a
	 {
		 padding: 30px 20px;
    border: 1px solid #ffffff;
    border-radius: 10px;
    font-size: 1.5rem;
    text-align: center;

	 }		
		/*************/