@charset "utf-8";
*{
    margin:0;
    padding:0;
}

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

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


/*1번 페이지*/
body{
        background: #212326;
        padding: 25px 0px;
        box-sizing: border-box;
        background-image: url(../image/scl_bg.jpg);
        background-size: cover;

}
/*
html, body{
    overflow-y: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar{
    width: 0;
    height: 0;
}
*/

    #card_main_area 
	{

        position: relative;
        width: 1300px;
        margin: 0px auto;
        height: 900px;
        box-sizing: border-box;
        /* background: #2b2d33; */
        /* border: 3px dashed #ffffff; */
        border-radius: 18px;
        color: white;
        padding: 20px 75px;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        background-image: url(../image/scl_banner.png?v=a1);
        background-size: cover;
        gap: 20px;
    }


#first_top
{
	position:relative;
}

.logo
{
        position: relative;
        text-align: center;
        color: #b1a096;
        font-size: 1rem;
        font-weight: bold;
        display: flex;
        width: 100%;
        justify-content: center;
        align-items: center;
        gap: 20px;
}

.logo img
{
	width:40px;
}

.title{
	position:relative;
    text-align:center;
    color:#b1a096;
    font-size:2.3rem;
    font-weight:900;
}

.sub
{
        position: relative;
        text-align: center;
        padding-top: 40px;
        font-size: 1.1rem;
        font-weight: 600;
        color: #ffd7ff;
}

.battle_box
{
	position:relative;
    border: 2px solid #ffffff;
    border-radius: 20px;
    padding: 50px 25px;
    background-color: #000000;
}

.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;
    gap:20px;
	        padding-bottom: 20px;
			line-height: 1.3;
}

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

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

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

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

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

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

.score .num
{
	position:relative;
    font-size:3rem;
    font-weight:900;
	line-height:1.1;
}

.left
{
	position:relative;
    
}

.right
{
	position:relative;
    
}

.bar
{
	position:relative;
    width:100%;
    height:34px;

    background:#1f2f59;

    border-radius:30px;
    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: 20px;
    display: inline-block;
    font-size: 3.5rem;
    cursor: pointer;
}

#bar_renewer:hover
{
	color:#dadada;
}

.remain
{
		position: relative;
        text-align: center;
        padding: 10px 0px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 30px;
}

.remain_title
{
	position:relative;
    font-size:2rem;
}

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

.vote_notice
{
	position:relative;
	list-style-type:none;
	text-align:left;
}

#votebtn_area
{
	position:relative;
	text-align:center;
}

.vote_btn
{
		position: relative;
        padding: 10px 20px;
        border: 1px solid #ffffff;
        border-radius: 10px;
        background: #000000;
        color: #ffffff;
        font-size: 1.5rem;
        font-weight: 900;
        cursor: pointer;
}

/**/

.scl_notopen
{
		font-size:2rem;
		text-align:center;
		color:#ffffff;
}

.scl_notopen
{
	position:relative;
	font-size:2rem;
	text-align:center;
	color:#ffffff;
	    padding: 20px 0px;
}
		
.scl_next_notice
{
position: relative;
        color: #ffffff;
        text-align: center;
        border: 1px dashed #ffffff;
        padding: 10px 20px;
        min-width: 900px;
        min-height: 300px;
        margin: 0px auto;
        font-size: 1.5rem;
        text-align: left;
        line-height: 2;
        display: flex;
        align-items: center;
}

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

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

.scl_next_dbcont
{
    display: inline-block;
    padding: 5px 10px;
    font-size: 1.6rem;
}

/**/
.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;

		
}


.pc_footer
{
position: relative;
        text-align: center;
        color: #d7d7d7;
        padding: 20px 0px;
        font-size: 0.8rem;
}

/*1번 여기까지*/

/*2번 페이지*/
	#second_top
	{
		position:relative;
		padding:20px 0px;
	}
	

	.second_vote_title
	{
		position:relative;
		text-align:center;
		font-size:2rem;
		font-weight:800;
	}

	.vs_wrap
	{
		position:relative;
		display:flex;
		justify-content:center;
		align-items:center;
		gap:20px;
	}

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


	.desc
	{
		position:relative;
		text-align:center;
		font-size:22px;
		font-weight:500;
		color:#f5f5f5;
	}
	
	.scl_agora
	{
		        position: absolute;
        top: 0px;
        right: 0px;
        border-bottom: 1px solid;
	}

	.second_card
	{
		position:relative;
		border-radius:24px;
		padding: 15px 30px;
		display:flex;
		justify-content:space-between;
		align-items:center;
		min-height:160px;
	}



	.info
	{
		width:60%;
	}

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



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



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



	.vote_after_character
	{
		position:relative;

	}

	.vote_after_notice
	{
	position: relative;
    text-align: center;
    color: #e6e6e6;
    font-size: 1rem;
	}
	
	/*second*/
	
	
	/* third */
	
	#third_toparea
	{
		position:relative;
	}
	
	.third_back
	{
		position:absolute;
		left:0px;
		right:0px;
		padding:10px;
		width:60px;
		font-size:2.7rem;
		cursor:pointer;
		z-index:1;
	}

	.team_view_title{
text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 10px;
		position:relative;
	}

	.team_view_title h1
	{
		font-size:2rem;
		font-weight:800;
	}

	.team_view_title p
	{
		position:relative;
        font-size: 1.2rem;
        color: #d7d7d7;
        padding: 10px 0px;
	}

	.team_character_card
	{
        position: relative;
        display: flex;
        gap: 15px;
        padding: 12px 45px;
        border-radius: 18px;
        color: #838383;
        align-items: center;
	}

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

	#third_teamview_rank
	{
position: relative;
        display: flex;
        flex-direction: column;
        gap: 20px;
        padding: 10px 5px;
        max-height: 600px;
        overflow-y: scroll;
	}
	
 #third_teamview_rank::-webkit-scrollbar {
        width: 10px;
        height: 30px;
    }	

#third_teamview_rank::-webkit-scrollbar-thumb
{
		background-color: #b1a096;
        border-radius: 5px;
        border: 2px solid #f0f0f0;
}		

	.gold
	{
		background:#f5c65d;
	}

	.silver
	{
		background:#d5d8df;
	}

	.bronze
	{
		background:#d79b63;
	}



	.vote_toon_thumbnail
	{
		position:relative;
		width:240px;
		height:240px;
		background:#111;
		border-radius:12px;
		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.7rem;
        font-weight: 700;
	}

	.owl_character_desc
	{
		position:relative;
		font-size:0.9rem;
		font-weight:700;
	}

	.owl_toon_desc
	{
		position:relative;
		font-size:1.1rem;
		line-height:1.4;
		font-weight:700;
	}

	.owl_toon_like
	{
		position:relative;
		color:#d94c6a;
		font-size:2rem;
		font-weight:800;
	}

	.third_team_view_box
	{
position: absolute;
        width: 110px;
        height: 110px;
        background: #ffd85a;
        border-radius: 10px;
        bottom: 0px;
        right: 0px;
	}
	
	.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
	{
		display:none;
	}	
	
	.pconly_forth_back
	{
		position: absolute;
    bottom: 0px;
    left: 0px;
		padding:10px;
		width:60px;
		font-size:2.7rem;
		cursor:pointer;
		z-index:1;
		font-weight:900;		
	}

.forth_card_plus
{
	gap:0px!important;
	padding:16px 53px !important
}

		/* 상단 캐릭터 영역 */

		.selected_character
		{
text-align: center;
        position: relative;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        height: 100px;
		}

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

        width: 1000px;
        justify-content: space-between;
		}

		.selected_owl_name
		{
			position:relative;
			font-weight:900;
		}


		.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: absolute;
        display: flex;
        align-items: center;
        gap: 20px;
        justify-content: space-between;
        right: 0px;
        top: 0px;
		}
		/* 캐릭터 자리 */

		.selected_owl_character
		{
position: relative;
        width: 100px;
        height: 100px;
        background: #111;
        padding-left: 10px;
        overflow: hidden;
        clip-path: polygon(10% 0%, 100% 0%, 100% 100%, 0% 100%);
		}

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

		/* 내용 카드 */

		.forth_ep_info
		{
			position:relative;
			padding-bottom:20px;
		}


/*instargram postview*/
#instar_postview_area
{
	position:relative;
	background-color:#0b0b0b;
}

#instar_postview_area>div
{
	position:relative;
	width:600px;
	margin:0px auto;
}



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

.insta_layout
{
	position:relative;
	width:1200px;
	margin:0px auto;
	display: flex;
    justify-content: space-between;	
}

.insta_content_box
{
	position:relative;
}

.instar_view
{
	position:relative;
	width:600px;
	height:600px;
	overflow:hidden;
}

#instar_view_all_view
{
	position:relative;
	width:800px;
	        height: auto;
        overflow: visible;
}

 .instar_view img
 {
	 width:100%;
 }

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


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

}

#instar_view_all_view > ul
{
	        position: relative;
        display: flex;
        list-style-type: none;
        padding-left: 0px;
        flex-direction: column;
        gap: 10px;
}

.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;
    justify-content: space-between;
    align-items: flex-start;
	color:#ffffff;
	font-size:1.1rem;
	padding:10px 0px;
	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:20px;
	right:20px;
	font-size:0.8rem;
}

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

.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: 15px;
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        flex-wrap: wrap;
        gap: 20px;
        width: 800px;
        margin: 0px auto;
        background-color: #000000;
        /* border: 2px solid #ffffff; */
        border: 3px solid;
        border-image: linear-gradient(to right, #22add7, #ce59a0);
        border-image-slice: 1;
		}

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

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

		.vote_item_real input
		{
			width:24px;
			height:24px;
		}
		
		.vote_form
		{
			position:relative;
			width:100%;
		}
		
		
		.view_vote_now
		{
			color: #ffff84;
			border-bottom: 1px solid;
			font-weight: 200;
		}			
		
					

		
		/*forth*/
		
		/*fifth*/



	/* 완료 */

	.vote_complete
	{
		position:relative;
		text-align:center;
		padding:10px;
	}

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



	/* 캐릭터 */

	.complete_owl_circle
	{
		position:relative;
		width:170px;
		height:170px;
		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: 18px;
        height: 400px;
        overflow-y: scroll;
	}

.complete_rank_box::-webkit-scrollbar {
        width: 20px;
        height: 30px;
    }	

.complete_rank_box::-webkit-scrollbar-thumb
{
		background-color: #b1a096;
        border-radius: 5px;
        border: 2px solid #f0f0f0;
}		

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

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

		/*
		*/

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

	.complete_madal
	{
		position:relative;
		width:42px;
		height:42px;
		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:48px;
		height:48px;
		border-radius:50%;
		background:#111;
		flex-shrink:0;
	}
	
 .complete_thumb img
 {
	 width:100%;
 }

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

	.complete_name
	{
		flex:1;
		font-size:1.3rem;
		font-weight:700;
	}

	.complete_score
	{
		font-size:1.3rem;
		font-weight:800;
	}

	/* 버튼 */
	
	
		

	.complete_re_come
	{
		position:relative;
		padding:10px 0px;
		border:none;
		font-size:1.2rem;
		font-weight:900;
		
	}
	
	.complete_after_go_link
	{
		    position: relative;
			display: flex;
			justify-content: space-around;
	}
	
	
	.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;
	}	

/* 캐릭터 굿즈 팝업 안내로 가는 완료페이지*/	
	.complete_goods_showwindow
	{
position: relative;
        border: 1px solid #ffffff;
        display: flex;
        align-items: center;
        padding: 60px 40px;
        box-sizing: border-box;
        justify-content: space-between;
		border-radius:20px;
		  box-shadow: 
		0 0 23px #16a3d9,       /* 얇고 밝은 외곽 광원 */   
		 0 0 7px #923979,      /* 중간 크기 광원 */    
		 0 0 20px #923979,      /* 넓게 퍼지는 배경 광원 */    
		 inset 0 0 15px #16a3d9  /* 테두리 안쪽으로 퍼지는 빛 */
	}
	
	.complete_goods_explain
	{
		position:relative;
	}
	
	.complete_goods_explain > h5
	{
		position: relative;
		padding: 7px 20px;
		border-radius: 10px;
		background: linear-gradient(90deg, #16a3d9, #923979);
		display: inline-block;
		font-size: 0.8rem;
		font-weight: 400;
	}
	
	.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;
	}
	
	
	.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:1.2rem;
	}
	
	.complete_after_go_shop_result
	{
        position: relative;
        display: flex;
        justify-content: center;
        gap: 60px;
        align-items: center;
        min-width: 90%;
        margin: 0px auto;
        padding: 20px 0px;
        border-radius: 20px;

	}


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

	#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:50%;
    top:50%;
    transform:translate(-50%,-50%);
    background:#232323;
    border-radius:15px;
    padding:35px 55px;
    text-align:center;
    box-shadow:0 10px 30px rgba(0,0,0,.3);
}

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

#vote_complete_box .text{
    margin-top:15px;
    font-size:28px;
    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;
			}
			/*투표 직전 기투표시 굿즈 연결 페이지 팝업창 여기까지*/		

	
		/*fifth*/
		
		
		/*sisxth*/
		/* 제목 */

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

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

		.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;
		}

		.come_menu_icon
		{
			position:relative;

		}

		.come_menu_select h3
		{
			position:relative;
			font-size:1.5rem;
			line-height:1.3;
		}
		
		.come_menu_select_desc
		{
			position:relative;
			font-size:1rem;
			padding: 10px 0px;
		}		


		.come_here_please
		{
			color: #fffc88!important;
		}
		/* 리그+버튼 영역 */

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

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

		.scl_banner_icon
		{
			position:relative;
			width:70px;
			height:70px;
			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;
        gap: 10px;
		}

		.scl_banner_text h3
		{
			font-size:1.6rem;
		}
		
		.scl_banner_desc h3
		{
font-size: 1.6rem;
        border-bottom: 1px solid #ffffff;
        color: #fffc88;
		}

		.scl_banner_text p
		{
			position:relative;
			font-size:1.3rem;
			line-height:1.5;
		}
		
		.scl_banner_desc p
		{
			position:relative;
			font-size:1.3rem;
			line-height:2;
		}		
		
		.scl_banner_desc
		{
position: relative;
        display: flex;
        justify-content: space-around;
        width: 100%;
        align-items: center;
        text-align: center;
        flex-direction: column;
        gap: 10px;
        border-top: 1px dashed #ffffff;
        padding: 15px 0px;
		}

		.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:100px;
		}

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

		.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;
        flex-wrap: nowrap;
        flex-direction: row;
		}

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

		.scl_now_info_label
		{
			        min-width: 140px;
			color:#555;
		}

		.scl_now_info_value
		{
font-weight: 800;
        display: flex;
        flex-direction: row;
        gap: 10px;
        flex-wrap: wrap;
        text-align: center;
		}		
		
		.scl_info_body
		{
			background: #212326!important;
		}
		
html:has(body.scl_info_body){
    -ms-overflow-style: auto;
    scrollbar-width: auto;
}

	
		.scl_info_cardmain
		{
        height: auto !important;
        background: #2b2d33 !important;
        border: 3px dashed #ffffff !important;
        top: 80px;
        margin: 20px auto !important;
		}
		
		.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: 2.5rem;
				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: 20px;
						padding: 10px 0px;
				}
				.season_goods_select > div
				{
					padding: 10px 20px;
						border-radius: 10px;
					
				}
				
				.season_goods_select > div:nth-child(1)
				{
						border: 1px solid #ffffff;
				}
				
				#season_goods_list
				{
    position: relative;
    display: flex;
    justify-content: flex-start;
    flex-direction: row;
    gap: 35px;
    padding: 10px 10px;
    height: 370px;
    overflow-y: scroll;
    flex-wrap: wrap;
				}
				
				.season_goods_each
				{
				position: relative;
					padding: 10px;
					border: 1px solid #ffffff;
					border-radius: 10px;
					box-sizing: border-box;
				}
				
				.season_goods_each > a
				{
					display: flex;
					gap: 10px;
					width:100%;
					height:100%;
					    align-items: center;
				}
				
				.season_goods_imgbox
				{
				position: relative;
				height: 250px;
				width: 250px;
				background: skyblue;
				}
				
				.season_goods_imgbox > img
				{
					width:100%;
				}
				
				.season_goods_descbox
				{
				    position: relative;
					padding: 10px 0px;
					text-align: center;
					max-width: 250px;
				}
				
				.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;
				}
				
				.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;
				}
				
				.season_goods_pride_text
				{
				position: relative;
					display: flex;
					list-style-type: none;
					justify-content: space-around;
					text-align: center;
					padding: 15px 20px;
					border-radius: 30px;
					background-color: #011c38;
					    font-size: 0.9rem;
						color: #dadada;
				}
				
				.season_goods_pride_text>li
				{
					display:flex;
					align-items: center;
				}
				
				.season_goods_pride_text>li:nth-child(2n)
				{
					
					border-right:1px solid #dadada;
				}
				
				.season_goods_emoticon
				{
					font-size:2rem;
				}
				
				.season_goods_title
				{
					font-size:1.2rem;
					font-weight:600;
				}
/*굿즈 구경하고 선택하는 페이지*/		
		

	/* 굿즈 구매가 이뤄지는 매인페이지 */

	.go_popup_store
	{
		font-size: 2.5rem;
		font-weight: 900;
	}
	
	.pc_goods_topleft
	{
		display: flex;
		gap: 10px;
	}

.goods_topleft_vote_btn
{	
	display: flex;
   
}

	.goods_top_scl_logo
	{
			position: relative;
			text-align: center;
			color: #b1a096;
			font-size: 1rem;
			font-weight: bold;
			display: flex;
			justify-content: center;
			align-items: center;
			gap: 20px;
			width: fit-content!important;
	}


	.goods_top_scl_logo img
	{
			width: 40px;
			}

	.season_goods_purchase
	{
	display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.season_goods_purchase_board
	{

		position: relative;
		border: 2px solid #2ec5ff;
		border-radius: 12px;
		padding: 10px;
		background: #090b15;
		height: 600px;
		overflow-y: scroll;
		box-sizing: border-box;

	}


	.season_goods_purchase_board::-webkit-scrollbar {
			width: 20px;
			height: 30px;
		}	

	.season_goods_purchase_board::-webkit-scrollbar-thumb
	{
			background-color: #b1a096;
			border-radius: 5px;
			border: 2px solid #f0f0f0;
	}		

	.goods_pucharse_info
	{
	position: relative;
		width: 570px;
		display: flex;
		flex-direction: column;
		justify-content: space-around;
	}





	.goods_purchase_content
	{

		display: flex;
		position: relative;
		gap: 15px;
		padding: 20px 0px;

	}



	.goods_purchase_img_gallery
	{

		display: flex;
		position: relative;
		flex-direction: row;
		gap: 20px;
		flex-wrap: wrap;
	}

	.goods_thumb_img_view
	{
		
	display: flex;
		flex-direction: column;
		gap: 5px;
		justify-content: center;
	}

	.goods_thumb_img_view > div
	{
		position: relative;
		height: 95px;
		width: 95px;
		background-color: #1b2035;
		border-radius: 10px;

	}

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

	.goods_img_viewer
	{

		background: #9fd6ca;
		height: 400px;
		width: 400px;
		position: relative;
		border-radius: 20px;
	}

	.goods_img_viewer > img
	{
		width:100%;
	}
	
	.goods_price_area
	{
		position:relative;
		text-align:right;
	}

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

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

		font-size:1.8rem;

		font-weight:bold;
	}
	
	.goods_delivery_fee
	{
		color:#dddddd;
	}

	.goods_total_money
	{
		position:relative;
		padding:5px 0px;
		font-size: 1.2rem;
	}



	.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: row;
		justify-content: space-between;


	}

	.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: row;
		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;
	}

	.goods_cartbtn
	{
		padding: 20px 30px;
		background:none;
		color:white;
		font-size: 1.2rem;
		border:1px solid #555;
		border-radius:12px;
		box-sizing: border-box;
	}
	
	.notice_law_area
	{
	 position: relative;
    display: flex;
    flex-direction: row;
    padding: 20px;
    background-color: #090b15;
    border-radius: 10px;
    border: 2px solid #ffb452;
    gap: 20px;
	}
	
	.warning_ment
	{
		    width: 70%;
    word-break: keep-all;
	}
	
	.warning_href
	{
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        gap: 5px;
	}
	
	.kbmark
	{
		overflow: hidden;
    width: 80px;
    height: 80px;
    border-radius: 50%;
	}
	
	/* 굿즈 구매가 이뤄지는 매인페이지 */