
/* 모바일 픽셀 font-size 3.7vw 인경우 픽셜 * 0.0757 */

body{
	background-color: #F7F7F7;
}

.cus-bg-gray{
	background: rgba(0, 0, 0, 0.3);
	width: 100%;
	height: 100%;
}

.usr-modal{
	width: 100%;
	height: 100%;
	display: block;
	position: fixed;
	left: 0;
	top: 0;
	display: none;
	background: rgba(0,0,0,0.5);
}

.usr-modal.on{
	display: block;
}

.usr-check{
    display: flex;
    align-items: center;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
}
.usr-check input{display: none;}
.usr-check input + label{
    display: inline-block;
    width: 1em;
    height: 1em;
    position: relative;
    background-color: #fff;
    border: 1px solid #CCCCCC;
	border-radius: 3px;

}

.usr-check label{
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
}


.usr-check input:checked + label::after{
    content:'';
    background-image: url(../images/20260617/icon_check.png);
    width: 1em;
    height: 1em;
    text-align: center;
    position: absolute;
    border-radius: 4px;
    background-size: cover;
}


.usr-dot{
    width: 100%;
    display: flex;
    flex-direction: column;
    row-gap: 0.5em;
    align-items: flex-start;
    justify-content: center;
}

.usr-dot > li{
    display: flex;
    align-items: flex-start;
    justify-content: center;
    column-gap: 10px;
    font-weight: 400;
    font-size: inherit;
    line-height: 28px;
    letter-spacing: -0.03em;
    color: #666666;
    line-height: 1.3em;
    position: relative;
    padding-left: 10px;
}

.usr-dot > li:before{
    content: '';
    display: block;
    width: 4px;
    height: 4px;
    background-color: #666;
    position: absolute;
    left:0;
    top:0.5em;
    border-radius: 50%;
}


.usr-agree-txt h2{
	font-weight: 800;
	font-size: 1.36em;
	line-height: 1.5em;
	letter-spacing: -0.02em;
	color: #000000;
	margin-bottom: 1em;
}

.usr-agree-txt .cus-box{
	background: #FFFFFF;
	border: 1px solid #E6E6E6;
	border-radius: 8px;
	display: flex;
	width: 100%;
	flex-direction: column;
	padding: 0.8em;
	font-size: 1.06em;
	row-gap: 1em;
	letter-spacing: -0.02em;
	color: #666666;
}

.usr-agree-txt .cus-table{
	display: block;
	white-space: nowrap;
	overflow: auto;
	width: 100%;
}

.usr-agree-txt .cus-table > table{
	width: 100%;
	border-collapse: collapse;
	table-layout: fixed;
	max-width: 520px;
	width: 520px;
}

.usr-agree-txt .cus-table > table th{
	background-color: #e6e6e6;
	padding: 0.4em;
	border: 1px solid #ccc;
}

.usr-agree-txt .cus-table > table td{
	background-color: #fff;
	padding: 0.4em;
	border: 1px solid #ccc;
	text-align: center;
	white-space: normal;
}

.usr-agree-txt .cus-table > table td.cus-left{
	text-align: left;
}

.usr-agree-txt .d2{
	margin-top: 2em;
}

.cus-button{
	flex: 1 1 0;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 3.3em;
	background: #FFFFFF;
	border-radius: 8px;
	border: 1px solid #333333;
	font-weight: 600;
	font-size: 1.21em;
	letter-spacing: -0.02em;
	max-width: 200px;
	margin: 0 auto;
}

.cus-privacy-cont *{
	box-sizing: border-box;
}


.cus-privacy-cont{
	font-size: 3.7vw;
}


.cus-privacy-cont .cus-main{
	display: flex;
	width: 100%;
	max-width:640px;
	margin: 0 auto;
	flex-direction: column;
	padding: 0 1.51em;
	box-sizing: border-box;
	padding-top: 2.27em;
}

.cus-privacy-cont .cus-box{
	padding: 4.54em 0px;
	background: #FFFFFF;
	border: 1px solid #E6E6E6;
	box-shadow: 0px 4px 12px rgba(20, 25, 50, 0.05);
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	padding:4.54em  1em;
	align-items: center;
	justify-content: center;
	row-gap:1.82em ;
}

.cus-privacy-cont .cus-box h1{
	max-width: 8.18em;
}

.cus-privacy-cont .cus-box h2{
	font-weight: 800;
	font-size: 1.36em;
	line-height: 1.5em;
	text-align: center;
	letter-spacing: -0.02em;
	color: #33333D;
}

.cus-privacy-cont .cus-agree{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    background: #D3BC9F;
    border-radius: 1.1em;
    padding: 0.6em 1em;
    margin-top: 1.21em;
    column-gap: 0.5em;
	padding: 0px 1.51em;
	height: 3.63em;
	background: #FFFFFF;
	border: 1px solid #E6E6E6;
	border-radius: 8px;
	
}

.cus-privacy-cont .cus-agree > div{
	display: flex;
	flex-direction: row;
	column-gap: 0.5em;
}

.cus-privacy-cont .cus-agree a{
    display: flex;
    align-items: center;
    font-weight: 400;
	font-size: 1.06em;
	letter-spacing: -0.02em;
	color: #000000;
}


.cus-privacy-cont .cus-agree a img{
    width: 1.21em;
    height: 1.21em;
}

.cus-privacy-cont .cus-agree .usr-check{
	font-size: 1.2em;
}


.cus-privacy-footer{
	display: flex;
	width: 100%;
	max-width:640px;
	flex-direction: column;
	box-sizing: border-box;
	position: fixed;
	bottom: 1em;
	padding: 0 1.51em;
	left: 50%;
	transform: translateX(-50%);
}

.cus-privacy-footer .cus-auth{
	font-weight: 600;
	font-size: 1.21em;
	letter-spacing: -0.02em;
	color: #FFFFFF;
	height: 3em;
	border-radius: 8px;
	align-items: center;
	justify-content: center;
}

.cus-privacy-footer .cus-auth{
	background-color: #0055FF;
}

.cus-privacy-footer .cus-auth:disabled{
	background-color: #CCCCCC;
}

/* agree.html */
.cus-privacy-agree-header{
	font-size: 3.7vw;
}

.cus-privacy-agree-header .cus-main{
	display: flex;
	width: 100%;
	flex-direction: row;
	height: 4.24em;
	align-items: center;
	padding: 0 1.51em;
	box-sizing: border-box;
	filter: drop-shadow(0px 0px 10px rgba(51, 51, 51, 0.2));
	background-color: #fff;
}

.cus-privacy-agree-header img{
	width: 1.3em;
}

.cus-privacy-agree-header a{
	display: flex;
	flex-direction: row;
	column-gap:0.5em ;
	align-items: center;
	justify-content: flex-start;
	font-weight: 700;
	font-size: 1.25em;
	letter-spacing: -0.02em;
	color: #000000;

}

.cus-privacy-agree-cont{
	font-size: 3.7vw;
}


.cus-privacy-agree-cont .cus-main{
	display: flex;
	width: 100%;
	max-width:640px;
	margin: 0 auto;
	flex-direction: column;
	padding: 2.42em 1.51em;
	box-sizing: border-box;
	row-gap: 3.03em;
}

.cus-privacy-agree-cont .cus-box{
	padding: 1.21em;
	background: #FFFFFF;
	border: 1px solid #E6E6E6;
	box-shadow: 0px 4px 12px rgba(20, 25, 50, 0.05);
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
}


.cus-privacy-agree-cont h2{
	font-weight: 800;
	font-size: 1.4em;
	letter-spacing: -0.02em;
	color: #000000;
	margin-bottom: 1em;
}

.cus-privacy-agree-cont p{
	font-weight: 400;
	font-size: 1.06em;
	line-height: 1.4em;
	letter-spacing: -0.02em;
	color: #666666;
} 

.cus-privacy-agree-cont p.cus-line{
	margin-bottom: 1em;
}

/* fail */
.cus-privacy-cont .icon-fail{
	max-width: 5.75em;
}

.cus-privacy-cont h3{
	font-weight: 400;
	font-size: 1.21em;
	line-height: 1.4em;
	text-align: center;
	letter-spacing: -0.02em;
	color: #666666;
}


/* 레이어 팝업 */
.cus-privacy-popup{
	font-size: 3.7vw;
}

.cus-privacy-popup .cus-main{
	display: none;
}

.cus-privacy-popup *{
	box-sizing: border-box;
}

.cus-privacy-popup.on .cus-main{
	position: fixed;
	display: flex;
	flex-direction: column;
	row-gap:1.82em;
	bottom: 0;
	width: 100%;
	max-width:26.25em ;
	padding: 1.82em;
	background: #FFFFFF;
	box-shadow: 0px 4px 12px rgba(20, 25, 50, 0.05);
	border-radius: 16px 16px 0px 0px;
    z-index: 1011;
	box-sizing: border-box;
	left:50%;
	transform: translateX(-50%);
}


.cus-privacy-popup .usr-check{
	margin-top: 0.2em;
}

.cus-privacy-popup .usr-check input + label{
	width: 1.21em;
	height: 1.21em;
}


.cus-privacy-popup .usr-check input:checked + label::after{
    width: 1.21em;
	height: 1.21em;
}

.cus-privacy-popup .cus-sel{
	display: flex;
	width: 100%;
	flex-direction: column;
	row-gap: 0.76em;
}

.cus-privacy-popup .cus-sel .g1{
	display: flex;
	width: 100%;
	flex-direction: row;
	align-items: flex-start;
	column-gap: 0.76em;
}

.cus-privacy-popup .cus-sel .g1 .cus-text{
	font-weight: 700;
	font-size: 1.21em;
	line-height: 1.5em;
	letter-spacing: -0.02em;
	color: #000000;
}

.cus-privacy-popup .cus-sel .g1 .cus-text .cus-red{
	color: #E50A59;
}

.cus-privacy-popup .cus-sel .g1 .cus-text .cus-view{
	font-weight: 700;
	font-size: 0.95em;
	line-height: 1.5em;
	letter-spacing: -0.02em;
	text-decoration-line: underline;
	color: #838383;
}

.cus-privacy-popup .cus-sel .cus-box{
	padding: 0.76em;
	width: 100%;
	background: #F7F7F7;
	border-radius: 8px;
	font-weight: 400;
	font-size: 1.06em;
	line-height: 1.4em;
	letter-spacing: -0.02em;
	color: #666666;
}

.cus-privacy-popup .d3{
	font-weight: 400;
	font-size: 1.06em;
	line-height: 1.4em;
	letter-spacing: -0.02em;
	color: #666666;
	margin-top: -0.5em;
}

.cus-privacy-popup .d4{
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	column-gap: 0.61em;
}

.cus-privacy-popup .d4 > *{
	flex: 1 1 0;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 2.8em;
	background: #FFFFFF;
	border-radius: 8px;
	border: 1px solid #333333;
	font-weight: 600;
	font-size: 1.21em;
	letter-spacing: -0.02em;
}

.cus-privacy-popup .d4 .g2{
	background: #0055FF;
	border: 1px solid #0055FF;
	color: #fff;
}



/* 개인정보 및 개인위치정보 수집·이용 약관 팝업 */
.cus-privacy-popup2{
	font-size: 3.7vw;
}

.cus-privacy-popup2 *{
	box-sizing: border-box;
}

.cus-privacy-popup2 .cus-main{
	position: fixed;
	display: none;
	flex-direction: column;
	row-gap:1.82em;
	bottom: 0;
	width: calc(100% - 3.02em);
	max-width:26.25em ;
	padding: 1.82em;
	background: #FFFFFF;
	box-shadow: 0px 4px 12px rgba(20, 25, 50, 0.05);
	border-radius: 16px;
    z-index: 1021;
	box-sizing: border-box;
	left:50%;
	top:50%;
	transform: translate(-50%,-50%);
	height:80vh;
}

.cus-privacy-popup2.on .cus-main{
	display: flex;
}

.cus-privacy-popup2 .cus-header{
	display: flex;
	flex-direction: row;
	width: 100%;
	align-items: center;
	justify-content: space-between;
	column-gap: 4em;
}

.cus-privacy-popup2 .cus-header h1{
	font-weight: 700;
	font-size: 1.36em;
	line-height: 1.4em;
	letter-spacing: -0.02em;
	color: #000000;
}

.cus-privacy-popup2 .cus-header.cus-close{
	max-width: 1.82em;
}

.cus-privacy-popup2 .cus-cont{
	overflow: auto;
}

@media screen and (min-width:440px){

	.cus-privacy-cont{
		font-size: 18px;
	}

	.cus-privacy-agree-header{
		font-size: 18px;
	}

	.cus-privacy-agree-cont{
		font-size: 18px;
	}
	.cus-privacy-popup{
		font-size: 18px;
	}

	.cus-privacy-popup2{
		font-size: 18px;
	}

	.cus-privacy-popup .cus-main{
		display: none;
	}

	.cus-privacy-popup.on .cus-main{
		bottom:initial;
		top:50%;
		left:50%;
		transform: translate(-50%,-50%);
		border-radius: 16px;
		max-width: 29em;
	}

	.cus-privacy-popup .d4 > *{
		height: 2.5em;
	}

	.cus-privacy-popup2.on .cus-main{
		max-width: 40em;
	}

	.usr-agree-txt .cus-table > table{
		width: 100%;
		max-width: 100%;
	}
}




