@charset "utf-8";

/*******************************************************************************************************************************************
*	LOGIN - 2025.01.10
*******************************************************************************************************************************************/
#login									{width:100%; max-width:400px; margin:0px auto 0px auto; letter-spacing:-0.03em;}

.loginWrap								{width:100%; margin:10px auto 60px auto; text-align:center; font-weight:600;}
.loginWrap H2							{display:block;  position:relative; font-size:var(--FS20); font-weight:700; color:#171717; margin:40px auto 30px auto;}
.loginWrap H2:before, 
.loginWrap H2:after						{content:''; position:absolute; left:0; top:50%; width:60px; height:1px; background-color:#AAA;}
.loginWrap H2:after						{left:auto; right:0;}
.loginWrap H2 em						{display:block; margin:10px auto; font-size:var(--FS-m-small); color:rgba(0, 0, 0, 0.5);}
.loginWrap .snslogin_subtxt				{display:flex; text-align:left; font-size:var(--FS14); font-weight:600; color:#999; margin:20px auto 20px auto; line-height:1.4}

/* Common */
a.loginBTN:hover						{opacity:0.85; filter:alpha(opacity=85); -moz-opacity:0.85; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=85)"; transition:opacity.3s; }
a.loginBTN								{display:flex; justify-content:center; align-items:center; position:relative; width:100%; height:var(--iptbtnHeight); border-radius:3px; font-size:var(--FS16);}
a.loginBTN.apple						{color:#3c1d1e; background-color:#FFFFFF; border:1px solid #DDD;}
a.loginBTN.kakao						{color:#3c1d1e; background-color:#f9e000;}
a.loginBTN.naver						{color:#FFFFFF; background-color:#03c75a;}
a.loginBTN.facebook						{color:#FFFFFF; background-color:#3C5999;}

.loginBTN i.svg_icon.svg_sns_apple		{position:absolute; top:12px; left:15px; width:22px; height:22px;}
.loginBTN i.svg_icon.svg_sns_kakao		{position:absolute; top:14px; left:16px; width:22px; height:22px;}
.loginBTN i.svg_icon.svg_sns_naver		{position:absolute; top:15px; left:20px; width:15px; height:15px;}
.loginBTN i.svg_icon.svg_sns_facebook	{position:absolute; top:15px; left:17px; width:20px; height:20px;}


@media screen and (max-width:500px) {
	.loginWrap H2:before, 
	.loginWrap H2:after			{display:none;}
}


/* Regist */
#registForm			{width:100%; max-width:600px; margin:0px auto 0px auto; letter-spacing:-0.03em;}
.registMSG			{display:flex; flex-direction:column; align-items:flex-start; margin-bottom:20px; text-align:left; font-size:var(--FS20); font-weight:700; color:#171717; letter-spacing:-1px;}
.registMSG p		{margin-top:10px; font-size:var(--FS16); color:rgba(0, 0, 0, 0.4); line-height:1.4}


/* Join OK */
#joinOk				{width:100%; max-width:600px; margin:30px auto 30px auto; letter-spacing:-0.03em;}
.joinOkBox			{display:flex; align-items:center; justify-content:center; position:relative; height:300px}
.joinokMSG			{position:relative; display:flex; flex-direction:column; align-items:center; margin-bottom:20px; text-align:center; font-size:var(--FS20); font-weight:700; color:#171717; letter-spacing:-1px; z-index:0}
.joinokMSG p		{margin-top:10px; font-size:var(--FS16); color:rgba(0, 0, 0, 0.4); line-height:1.4}

.joinOkBG			{position:absolute; animation: bgMove 6s linear infinite alternate;}
.joinOkBG			{content:""; position:absolute; top:0; left:0px; background:url(/dist/img/congratulationBG.png) no-repeat; background-position:center center; background-size:cover; width:100%; height:100%; z-index:-1;}
.joinOkBG:after		{content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(255, 255, 255, 0.7); z-index:-1;}

@keyframes bgMove{
	0%{transform:translateY(-50px);}
	100%{transform:translateY(50px);}
}

/* SNS LOGGED */
.sns_loggedWRAP							{display:inline-block; width:100%; height:42px; padding:0px; line-height:40px; font-size:0.875rem; font-weight:500; color:#444;}
.sns_loggedWRAP	.logged_kakao			{display:inline-block; margin-right:5px; position:relative; top:3px; background-color:#f9e000; border-radius:2px; width:34px; height:34px;}
.sns_loggedWRAP	.logged_naver			{display:inline-block; margin-right:5px; position:relative; top:3px; background-color:#03c75a; border-radius:2px; width:34px; height:34px;}
.sns_loggedWRAP	.logged_facebook		{display:inline-block; margin-right:5px; position:relative; top:3px; background-color:#3C5999; border-radius:2px; width:34px; height:34px;}
.sns_loggedWRAP	.logged_apple			{display:inline-block; margin-right:5px; position:relative; top:3px; background-color:#EEEEEE; border-radius:2px; width:34px; height:34px;}

.sns_loggedWRAP	.logged_kakao i			{position:relative; top:4px; left:5px; width:24px; height:24px;}
.sns_loggedWRAP	.logged_naver i			{position:relative; top:1px; left:8px; width:17px; height:17px;}
.sns_loggedWRAP	.logged_facebook i		{position:relative; top:2px; left:6px; width:20px; height:20px;}
.sns_loggedWRAP	.logged_apple i			{position:relative; top:2px; left:6px; width:22px; height:22px;}


/*******************************************************************************************************************************************
*	Login Advertisement Banner : 2023.12.19
*******************************************************************************************************************************************/
.login_adBanner			{display:inline-block; width:100%; margin-top:40px; overflow:hidden; position:relative; margin:40px auto; height:250px; border-radius:var(--round-basic);}
.login_adBanner:after	{position:absolute; left:0; top:0; width:100%; height:100%; border-radius:var(--round-basic); background-color:rgba(0,0,0,.3); content:'';}
.login_adBanner video	{position:absolute; top:50%; left:50%; width:100%; height:auto; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%);}

.LB_titArea				{position:absolute; font-family:celmonHG; min-width:340px; font-weight:900; letter-spacing:0px; text-align:center; top:50%; left:50%; z-index:1; font-size:var(--FS-xx-large); line-height:1.2; color:#fff; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%)}
.LB_tit					{position:relative; width:100%; display:block; letter-spacing:10px; font-weight:400; font-size:var(--FS-m-large); margin:0px auto 20px}
.LB_tit:after			{content:''; display:block; position:absolute; left:0px; top:50%; width:55px; height:1px; background-color:rgba(255,255,255,.65);}
.LB_tit:before			{content:''; display:block; position:absolute; right:0px; top:50%; width:55px; height:1px; background-color:rgba(255,255,255,.65);}

@media screen and (max-width:500px) {
	.login_adBanner			{height:200px;}
	.login_adBanner video	{width:140%;}

	.LB_titArea				{min-width:300px;}
	.LB_tit:after			{width:25px;}
	.LB_tit:before			{width:25px;}
}

/*******************************************************************************************************************************************
*	JOIN [S] - 2016.08.04 : FUNNY
*******************************************************************************************************************************************/
/* 약관 리스트 */
.agree_WRAP								{display:inline-block; width:100%; margin:15px auto; background:#fff; border:1px solid #EEE; border-radius:8px;}
.agree_WRAP .agreelist					{margin:0; list-style:none;}
.agree_WRAP .agreelist > li				{display:flex; align-items:center; justify-content:space-between; padding:17px 15px; border-top:1px solid #ededed; font-size:var(--FS14); color:#888;}
.agree_WRAP .agreelist > li:first-child	{border-top:0;}
.agree_WRAP .agreelist > li label		{flex:1; margin-left:5px;}
.agree_WRAP .agreelist > li input		{margin-right: 5px;}
.agree_WRAP .agreelist > li a.btnAll	{display:flex; align-items:center; justify-content:center; border:1px solid #c2c2c2; height:22px; padding:0 4px; font-size:var(--FS12); font-weight:600; color:#666; letter-spacing:-1px; border-radius:1px; background:linear-gradient(to bottom,#FFFFFF 50%,#EDEDED 50%);}
.agree_WRAP .agreelist > li.Allcheck	{border-top:1px solid #ddd; font-size:var(--FS16); color:#444;}
.agree_WRAP .agreelist > li.Allcheck label{font-weight:800;}
.agree_WRAP .agreelist > li label.error	{float:left; display:block; font-size:11px; line-height:22px; color:var(--IDTcolor); margin:5px 10px 0 0;}

.agree_WRAP .agreelist .policy_div		{overflow-x:hidden; overflow-y:auto; max-height:200px;}


/*******************************************************************************************************************************************
*	약관 (페이지내 모든 약관 컨트롤)
*******************************************************************************************************************************************/
.policy_WRAP					{display:inline-block; margin:0px 0; font-size:var(--FS12); line-height:17px; color:#777; padding:10px;}
.policy_WRAP.no_padding			{padding:5px;}
.policy_WRAP H8					{display:block; font-size:0.875rem; line-height:40px; letter-spacing:0.1em; color:#222;}
.policy_WRAP H9					{display:block; font-size:13px; margin-top:14px; line-height:25px; letter-spacing:0px; color:#333; border:0px;}
.policy_WRAP p					{margin-bottom:14px; font-size:var(--FS-m-small); line-height:17px;}

.policy_WRAP ol					{list-style-position:outside; padding-left:10px; color:#808080; text-align:justify; margin-bottom:10px;}
.policy_WRAP ol li				{margin-left:10px; list-style-type:Decimal; font-size:var(--FS-m-small); line-height:22px; letter-spacing:-1px;}
.policy_WRAP ol.depth2			{padding:3px 0; color:#808080; text-align:justify; margin-left:12px}
.policy_WRAP ol.depth2 li		{list-style-type:square;}

table.policyTBL					{width:100%; margin:10px 0; color:#808080; border-top:1px solid #BBB; border-collapse:collapse; padding:0px; border-spacing:0px;}
table.policyTBL thead th		{text-align:center; padding:5px 0; font-size:11px; line-height:16px; border-right:1px solid #FFF; letter-spacing:-0.1em; color:#FFF; background:#a4a4a4;}
table.policyTBL tbody th		{padding:5px 10px; text-align:center; border-right:1px solid #cdcdcd; background:#FFF;}
table.policyTBL tbody td		{padding:7px 10px 5px 10px; border-bottom:1px solid #cdcdcd; border-left:1px solid #cdcdcd; color:#808080;}
table.policyTBL tbody td.first	{border-left:0px; text-align:center; font-size:11px; line-height:20px; font-weight:600;}

@media screen and (max-width:600px) {
.policy_WRAP H8					{font-size:var(--FS-m-small); line-height:20px; letter-spacing:-0.01em; margin-bottom:5px;}
}


/* 회원가입 완료 */
.joinOK h2{text-align: center; font-size:18px; color: #333;}
.joinOK div.jointxt{padding: 50px 0;}
.joinOK div.jointxt p{font-size: 12px; color: #888; margin-top:8px; text-align: center; letter-spacing: -1px;}