@charset "utf-8";
/* ADM 기반 인증 화면 구조 */
.rp-auth-document { width:100%; min-height:100vh; display:flex; flex-direction:column; background:var(--rp-page); }
.rp-auth-document > .rp-auth-layout { width:100%; flex:1 0 auto; }
.rp-auth-layout { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:48px 20px; background:var(--rp-page); box-sizing:border-box; }
.rp-auth-card { width:100%; max-width:440px; padding:32px; background:var(--rp-surface); border:1px solid var(--rp-border); border-radius:var(--rp-radius-lg); box-shadow:var(--rp-shadow); box-sizing:border-box; }
.rp-auth-card.rp-auth-card-wide { max-width:760px; }
.rp-auth-card .logo { height:auto !important; }
.rp-auth-logo { display:block; width:100%; height:auto; }
html[data-theme="dark"] .rp-auth-logo { filter:brightness(0) invert(1); }
.rp-auth-card .txt-box { margin-bottom:28px; }
.rp-auth-card .form-group { min-width:0; }
.rp-auth-status { text-align:center; }
.rp-auth-status .icon-box { margin:20px auto; }
.rp-auth-status > a { display:inline-flex; justify-content:center; padding:12px 24px; border-radius:var(--rp-radius-sm); background:var(--rp-primary); color:var(--rp-chrome-title); text-decoration:none; }
.auth-test-card { max-width:760px; margin:40px auto; }
.auth-test-card .txt-box h1,
.payment-success-card .txt-box h1 { color:var(--rp-text); font-size:1.75rem; font-weight:800; line-height:1.3; }
.auth-test-card .txt-box p,
.payment-success-card .txt-box p { margin-top:10px; color:var(--rp-text-muted); line-height:1.6; }
.auth-test-data { display:grid; grid-template-columns:minmax(90px, 140px) 1fr; gap:0; margin:24px 0; border:1px solid var(--rp-border); border-radius:var(--rp-radius); overflow:hidden; }
.auth-test-data dt,
.auth-test-data dd { margin:0; padding:14px 16px; border-bottom:1px solid var(--rp-border); line-height:1.5; }
.auth-test-data dt { background:var(--rp-surface-alt); color:var(--rp-text-muted); font-weight:700; }
.auth-test-data dd { color:var(--rp-text); overflow-wrap:anywhere; }
.auth-test-data dt:nth-last-of-type(1),
.auth-test-data dd:nth-last-of-type(1) { border-bottom:0; }
.auth-test-card .test-status { margin-top:20px; font-weight:700; line-height:1.6; }
.auth-test-result { margin-top:24px; color:var(--rp-text-muted); }
.auth-test-result pre { margin-top:12px; padding:16px; overflow:auto; border-radius:var(--rp-radius-sm); background:var(--rp-surface-alt); color:var(--rp-text); text-align:left; }
.payment-success-card { --page-circle-radius:50%; --page-check-shadow-empty:inset 0 0 0 0 var(--rp-primary); --page-check-shadow-full:inset 0 0 0 150px var(--rp-primary); text-align:center; }
.payment-success-logo { width:min(220px, 70%); margin:0 auto 24px; }
.payment-success-card .product-info-box { width:100%; max-width:520px; margin:32px auto 0; padding:24px; }
.payment-success-card .product-info-box dl { background:var(--rp-surface-alt); border:1px solid var(--rp-border); }
@media (max-width:560px) { .auth-test-data{grid-template-columns:95px 1fr}.auth-test-data dt,.auth-test-data dd{padding:12px 10px}.payment-success-card .product-info-box{padding:16px} }
@media (max-width:560px) { .rp-auth-layout{padding:24px 14px}.rp-auth-card{padding:24px 18px} }

/* 로그인페이지 */
.login-box,
.register-box,
.reset-box,
.forgot-id-result-box{
	--page-control-circle-radius: 50%;
}

#login{
	width: 100%; height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--rp-page);
}

#login .login-box{
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: var(--space-30);
}

#login .login-box .logo{
	display: block;
	width: 250px;
	margin: 0 auto;
}

#loginForm{}

#loginForm fieldset{
	position: relative;
}

#loginForm fieldset:not(:first-child){
	margin-top: var(--space-10);
}

#loginForm fieldset input,
#register form input:not([type="checkbox"]):not([type="radio"]),
#forgot form input:not([type="checkbox"]):not([type="radio"]){
	display: inline-block;
	font-size: 1rem;
	width: 100%;
	box-sizing: border-box;
	padding: 15px 20px;
	padding-left: 50px;
	border: 1px solid var(--rp-border);
	outline: none;
	border-radius: var(--rp-radius-sm);
	background-color: var(--rp-surface);
	color: var(--rp-text);
	transition: var(--transition);
}

#loginForm fieldset input:hover,
#loginForm fieldset input:focus,
#register form input:hover,
#register form input:focus,
#forgot form input:hover,
#forgot form input:focus{
	border-color: var(--red01);
	box-shadow: var(--rp-input-shadow);
}

#loginForm fieldset input:focus,
#loginForm fieldset input:valid{
	padding-left: 20px;
	padding-top: 25px;
}

#loginForm fieldset label,
#loginForm fieldset i{
	position: absolute;
	transition: var(--transition);
}

#loginForm fieldset label{
	left: 55px;
	top: 17px;
	color: var(--gray02);
	opacity: 0.5;
}

#loginForm fieldset input:hover + label{
	opacity: 0.8;
}

#loginForm fieldset input:focus + label,
#loginForm fieldset input:valid + label{
	opacity: 1;
	color: var(--red01);
	font-size: 0.8125rem;
	left: 20px;
	top: 10px;
}


#loginForm fieldset i{
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--red01);
	font-size: 1.0625rem;
	opacity: 1;
}

#loginForm fieldset input:focus ~ i,
#loginForm fieldset input:valid ~ i{
	opacity: 0;
}

#loginForm .btn_login,
#register .btn,
#forgot .btn{
	margin-top: var(--space-10);
	display: block;
	width: 100%;
	text-align: center;
	color: var(--rp-chrome-title);
	background-color: var(--red01);
	font-size: 1.125rem;
	font-weight: var(--fw-700);
	box-sizing: border-box;
	padding: 12px 20px;
	border-radius: var(--rp-radius-sm);
	transition: var(--transition);
}

#loginForm .btn_login:hover,
#register .btn:hover,
#forgot .btn:hover{
	opacity: 0.8;
}


#login .login-info{
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

#login .login-info a{
	font-size: 0.875rem;
	color: var(--gray02);
	transition: var(--transition);
}

#login .login-info a:hover{
	color: var(--gray01);
}

#login .social-login-box{
	margin-top: var(--space-10);
}

#login .social-login-box > a + a{
	margin-top: 10px;
}

/* 구글 로그인 버튼 (구글 브랜드 가이드: 흰 배경 + 얇은 테두리 + 4색 G 로고) */
#login .btn-google-login{
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 100%;
	height: 48px;
	padding: 0 20px 0 16px;
	gap: 6px;
	font-size: 1rem;
	font-weight: var(--fw-600, 600);
	border-radius: var(--rp-radius-sm, 8px);
	background-color: var(--rp-surface, #fff);
	border: 1px solid var(--rp-border, #dadce0);
	color: var(--gray01, #1f1f1f);
	text-decoration: none;
	transition: var(--transition);
}

#login .btn-google-login:hover{
	background-color: var(--rp-surface-alt, #f8f9fa);
}

#login .btn-google-login svg{
	flex-shrink: 0;
}

#login .social-login-box h3{
	text-align: center;
	color: var(--gray02);
	font-size: 0.875rem;
	position: relative;
	font-weight: var(--fw-500);
	opacity: 0.8;
}

#login .social-login-box h3::before,
#login .social-login-box h3::after{
	content: "";
	width: calc(50% - 20px);
	height: 1px;
	background-color: var(--gray02);
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	opacity: 0.5;
}

#login .social-login-box h3::before{
	left: 0;
}

#login .social-login-box h3::after{
	right: 0;
}

#login .social-login-list{
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: var(--space-20);
}

#login .social-login-list .social-login-item{}

#login .social-login-list .social-login-item a{
	display: block;
	width: 55px; height: 55px;
	border-radius: var(--page-control-circle-radius);
	overflow: hidden;
}

#login .social-login-list .social-login-item a img{}

#login .register-box{
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: 7px;
}

#login .register-box p{
	font-size: 0.875rem;
	color: var(--gray01);
}

#login .register-box a{
	display: inline-block;
	padding: 4px 12px;
	border: 1px solid var(--red01);
	font-size: 0.8125rem;
	border-radius: var(--rp-radius-sm);
	color: var(--red01);
	opacity: 0.7;
	transition: var(--transition);
}

#login .register-box a:hover{
	opacity: 1;
}

/* 회원가입, 아이디 비밀번호 찾기 */
#register,
#forgot{
	width: 100%;
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--rp-page);
}

#register .register-box,
#forgot .reset-box{
	background-color: var(--rp-surface);
	border: 1px solid var(--rp-border);
	border-radius: var(--rp-radius-lg);
	box-shadow: var(--rp-shadow);
	padding: 30px;
	width: 350px;
}

#register .txt-box{
	text-align: center;
}

#register .txt-box h1,
#forgot .txt-box h1{
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: 5px;
	font-size: 1.75rem;
	font-weight: var(--fw-700);
}

#register .txt-box h1 img,
#forgot .txt-box h1 img{
	width: 150px;
}

#register .txt-box .social-agree-heading{
	white-space: nowrap;
	font-size: 1.5rem;
}

#register .txt-box p{
	font-size: 0.875rem;
	color: var(--gray01);
	margin-top: var(--space-10);
}

#register .txt-box .social-agree-intro{
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 14px auto 0;
	line-height: 1.5;
}

#register .txt-box .social-agree-intro-title{
	color: var(--rp-text);
	font-size: 0.9375rem;
	font-weight: var(--fw-600);
}

#register .txt-box .social-agree-intro-desc{
	color: var(--gray01);
	font-size: 0.8125rem;
}

#register .txt-box .social-link-confirm-message{
	display: block;
	margin: 14px auto 0;
	line-height: 1.6;
}

#register .txt-box .social-link-confirm-message strong{
	display: inline-block;
	margin: 0 2px;
	color: var(--rp-text);
	font-weight: var(--fw-700);
}

#register form,
#forgot .forgot-btn-box{
	margin-top: var(--space-35);
}

#register .form-group,
#forgot .form-group{
	margin-bottom: 20px;
}

#register .social-agree-error{
	text-align: center;
}

#register .social-link-details{
	margin-top: 20px;
	border-top: 1px solid var(--rp-border);
	padding-top: 14px;
}

#register .social-link-details summary{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	cursor: pointer;
	list-style: none;
	color: var(--gray01);
	font-size: 0.875rem;
	font-weight: var(--fw-600);
}

#register .social-link-details summary::-webkit-details-marker{
	display: none;
}

#register .social-link-details summary i{
	font-size: 0.9rem;
	transition: transform var(--transition);
}

#register .social-link-details[open] summary i{
	transform: rotate(180deg);
}

#register .social-link-box{
	margin-top: 14px;
	padding: 16px;
	border: 1px solid var(--rp-border);
	border-radius: var(--rp-radius);
	background-color: var(--rp-page);
}

#register .social-link-box p{
	margin: 0 0 14px;
	color: var(--gray01);
	font-size: 0.8125rem;
	line-height: 1.6;
	text-align: center;
}

#register .social-link-box .social-link-description{
    font-size: 0.9375rem;
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin-bottom: 16px;
	line-height: 1.6;
}

#register .social-link-box .social-link-description strong{
	color: var(--rp-text);
	font-weight: var(--fw-600);
}

#register .social-link-box input{
	display: block;
	width: 100%;
	margin-top: 8px;
	box-sizing: border-box;
}

#register .social-link-box .btn{
	width: 100%;
	margin-top: 12px;
}

#register .social-link-confirm-btn{
	display: block;
	width: 100%;
	line-height: 1.4;
	text-align: center;
	white-space: normal;
}

#register .social-link-confirm-id{
	font-weight: var(--fw-700);
}

#register form input,
#forgot form input{
	padding: 12px 20px;
}
#register form input::placeholder{
	color: var(--gray02);
}
#register label,
#forgot label{
	display: block;
	margin-bottom: 5px;
	font-weight: bold;
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--gray01);
}

 #register .error-message,
 #forgot .error-message {
	color: var(--red01);
	font-size: 12px;
	margin-top: 5px;
}

#forgot .error-message{
	display: block;
	box-sizing: border-box;
	padding: 12px 15px;
	margin-top: 0;
	margin-bottom: 15px;
	font-size: 0.8125rem;
	font-weight: var(--fw-500);
	word-break: keep-all;
	border: 1px solid var(--orange01);
	color: var(--orange01);
	text-align: center;
	border-radius: var(--rp-radius-sm);
	background-color: color-mix(in srgb, var(--rp-warning) 14%, var(--rp-surface));
}

#forgot button:disabled{
	opacity: 0.6;
	cursor: not-allowed;
}

#register .check-btn {
	background-color: var(--orange01);
	color: var(--rp-surface);
	margin-top: 10px;
	cursor: pointer;
	border: none;
	border-radius: var(--rp-radius-sm);
	padding: 10px;
	width: 100%;
	font-size: 0.9375rem;
	font-weight: var(--fw-600);
	transition: var(--transition);
}
#register .check-btn:hover {
	opacity: 0.8;
 }

/* 회원가입 인증 방법 선택 라디오 */
#register .verify-method-box {
	margin-bottom: 20px;
}

#register .verify-method-radio {
	display: flex;
	flex-direction: row;
	align-items: center;
	box-sizing: border-box;
	padding: 4px;
	background-color: var(--rp-surface-alt);
	border: 1px solid var(--rp-border);
	border-radius: var(--rp-radius);
	gap: 4px;
	margin-bottom: 2px;
}

#register .verify-method-radio label {
	flex: 1;
	margin-bottom: 0;
	cursor: pointer;
	text-align: center;
	position: relative;
	user-select: none;
}

#register .verify-method-radio input[type="radio"] {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
	pointer-events: none;
	margin: 0;
	padding: 0;
}

#register .verify-method-radio label span {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
	padding: 9px 12px;
	border-radius: var(--rp-radius-sm);
	font-size: 0.875rem;
	font-weight: var(--fw-600, 600);
	color: var(--gray02);
	box-sizing: border-box;
	transition: var(--transition);
}

#register .verify-method-radio label span i {
	font-size: 1rem;
}

#register .verify-method-radio label:hover span {
	color: var(--rp-text, var(--gray01));
}

#register .verify-method-radio input[type="radio"]:checked + span {
	background-color: var(--rp-surface);
	color: var(--orange01);
	font-weight: 700;
	box-shadow: var(--rp-shadow-sm);
}

/* 인증 방법 선택에 따라 이메일/휴대폰 입력창을 슬라이드로 전환 */
#register .contact-field {
	overflow: hidden;
	max-height: 300px;
	opacity: 1;
	transition: max-height 0.25s ease, opacity 0.25s ease, margin-bottom 0.25s ease;
}

#register .contact-field.is-hidden {
	max-height: 0;
	opacity: 0;
	margin-bottom: 0;
	pointer-events: none;
}

 #forgot .txt-box h1{
	flex-direction: column;
	gap: 10px;
 }

#forgot .forgot-btn-box{
	display: flex;
	flex-direction: row;
	align-items: center;
	box-sizing: border-box;
	padding: 7px;
	background-color: var(--rp-surface-alt);
	border-radius: var(--rp-radius);
}

#forgot .forgot-btn-box .forgot-btn{
	width: 50%;
}

#forgot .forgot-btn-box .forgot-btn a{
	display: block;
	width: 100%;
	text-align: center;
	border-radius: var(--rp-radius-sm);
	padding: 10px 10px;
	font-size: 0.875rem;
	font-weight: var(--fw-600);
	color: var(--gray02);
}

#forgot .forgot-btn-box .forgot-btn a span{
	font-size: inherit;
	color: inherit;
	font-weight: inherit;
}

#forgot .forgot-btn-box .forgot-btn.active a{
	background-color: var(--rp-surface);
	color: var(--red01);
	box-shadow: var(--rp-shadow-sm);
}

#forgot form{
	margin-top: var(--space-25);
}

/* 아이디/비밀번호 찾기 — 이메일/휴대전화 조회 방식 전환 탭 */
#forgot .verify-method-box {
	margin-bottom: 20px;
}

#forgot .verify-method-radio {
	display: flex;
	flex-direction: row;
	align-items: center;
	box-sizing: border-box;
	padding: 4px;
	background-color: var(--rp-surface-alt);
	border: 1px solid var(--rp-border);
	border-radius: var(--rp-radius);
	gap: 4px;
	margin-bottom: 2px;
}

#forgot .verify-method-radio label {
	flex: 1;
	margin-bottom: 0;
	cursor: pointer;
	text-align: center;
	position: relative;
	user-select: none;
}

#forgot .verify-method-radio input[type="radio"] {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
	pointer-events: none;
	margin: 0;
	padding: 0;
}

#forgot .verify-method-radio label span {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
	padding: 9px 12px;
	border-radius: var(--rp-radius-sm);
	font-size: 0.875rem;
	font-weight: var(--fw-600, 600);
	color: var(--gray02);
	box-sizing: border-box;
	transition: var(--transition);
}

#forgot .verify-method-radio label span i {
	font-size: 1rem;
}

#forgot .verify-method-radio label:hover span {
	color: var(--rp-text, var(--gray01));
}

#forgot .verify-method-radio input[type="radio"]:checked + span {
	background-color: var(--rp-surface);
	color: var(--red01);
	font-weight: 700;
	box-shadow: var(--rp-shadow-sm);
}

/* 선택된 조회 방식에 따라 이메일/휴대전화 입력창을 슬라이드로 전환 */
#forgot .contact-field {
	overflow: hidden;
	max-height: 300px;
	opacity: 1;
	transition: max-height 0.25s ease, opacity 0.25s ease, margin-bottom 0.25s ease;
}

#forgot .contact-field.is-hidden {
	max-height: 0;
	opacity: 0;
	margin-bottom: 0;
	pointer-events: none;
}


#register .policy-agree-box{
	position: relative;
}

#register .policy-agree-box input[type="checkbox"]{
	position: absolute;
	width: 0px; height: 0px;
	opacity: 0;
}

#register .policy-agree-box label{
	cursor: auto;
}

#register .policy-agree-box label span{
	cursor: pointer;
	font-size: inherit;
	font-weight: var(--fw-600);
	color: var(--gray02);
	transition: var(--transition);
}

#register .policy-agree-box label span:hover{
	color: var(--gray01);
}



/* 결과화면 */
.forgot-id-result-box{
	box-sizing: border-box;
	padding: 15px 20px;
	border-radius: var(--rp-radius);
	background-color: var(--rp-primary-soft);
	margin-top: var(--space-25);
	text-align: center;
	border: 1px solid color-mix(in srgb, var(--rp-primary) 24%, var(--rp-border));
}

.forgot-id-result-box .check-box{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 45px; height: 45px;
	border-radius: var(--page-control-circle-radius);
	background-color: color-mix(in srgb, var(--rp-success) 16%, var(--rp-surface));
}

.forgot-id-result-box i{
	font-size: 2.5rem;
	color: var(--rp-success);
}

.forgot-id-result-box p{
	margin-top: 10px;
	font-size: 1rem;
	color: var(--gray01);
	font-weight: var(--fw-700);
	line-height: 1.3;
}

.forgot-id-result-box p strong{
	font-size: inherit;
	font-weight: var(--fw-700);
	color: var(--red01);
	letter-spacing: -0.02rem;
}

.forgot-id-toggle-btn{
	display: inline-block;
	margin-top: 12px;
	background: none;
	border: none;
	padding: 4px 8px;
	font-size: 0.8125rem;
	font-weight: var(--fw-600);
	color: var(--rp-primary);
	text-decoration: underline;
	cursor: pointer;
	transition: var(--transition);
}

.forgot-id-toggle-btn:hover{
	opacity: 0.8;
}

.forgot-id-toggle-btn:disabled{
	opacity: 0.6;
	cursor: not-allowed;
	text-decoration: none;
}

.forgot-id-toggle-msg{
	margin-top: 8px;
	font-size: 0.8125rem;
	font-weight: var(--fw-500);
	color: var(--red01);
}

.forgot-id-toggle-msg.is-success{
	color: var(--rp-success);
}

.forgot-result-link{
	display: block;
	margin-top: var(--space-20);
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	color: var(--rp-chrome-title);
	background-color: var(--red01);
	font-size: 0.9375rem;
	font-weight: var(--fw-700);
	padding: 12px 20px;
	border-radius: var(--rp-radius-sm);
	text-decoration: none;
	transition: var(--transition);
}

.forgot-result-link:hover{
	opacity: 0.85;
}

.forgot-retry-link{
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin-top: 10px;
	background: none;
	border: none;
	text-align: center;
	color: var(--gray02);
	font-size: 0.8125rem;
	font-weight: var(--fw-500);
	text-decoration: underline;
	cursor: pointer;
	transition: var(--transition);
}

.forgot-retry-link:hover{
	color: var(--gray01);
}


#resetPwForm,
#findPwVerifyForm{
	margin-top: var(--space-25);
	padding-top: var(--space-25);
	border-top: 1px dashed var(--rp-border-strong);
}

#resetPwForm h2{
	text-align: center;
	font-size: 1.0625rem;
	font-weight: var(--fw-700);
	margin-bottom: var(--space-15);
	opacity: 0.8;
}

.forgot-pw-verify-desc{
	text-align: center;
	font-size: 0.8125rem;
	color: var(--gray01);
	margin-bottom: var(--space-15);
	word-break: keep-all;
}

#findPwVerifyForm #findPwResendBtn{
	margin-top: 10px;
}


#login .error-message{
	display: block;
	box-sizing: border-box;
	padding: 15px 15px;
	word-break: keep-all;
	font-size: 0.8125rem;
	font-weight: var(--fw-500);
	border: 1px solid var(--orange01);
    color: var(--orange01);
    text-align: center;
    border-radius: var(--rp-radius-sm);
    background-color: color-mix(in srgb, var(--rp-warning) 14%, var(--rp-surface));
	margin-bottom: 7px;
	letter-spacing: -0.035rem;
	white-space: break-spaces;
}

/* 로그인 */
/* 오버레이 기본 숨김 */
.loading-box {
  --page-kakao-yellow: #ffeb00;
  --page-spinner-radius: 50%;
}

#loading-overlay {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: color-mix(in srgb, var(--rp-surface) 90%, transparent);
  z-index: 9999;
  align-items: center;
  justify-content: center;
}

/* 로딩 박스 */
.loading-box {
  text-align: center;
  padding: 20px;
}

/* 스피너 */
.spinner {
  border: 6px solid var(--rp-border);
  border-top: 6px solid var(--page-kakao-yellow); /* 카카오 노랑 포인트 */
  border-radius: var(--page-spinner-radius);
  width: 50px;
  height: 50px;
  margin: 0 auto 15px;
  animation: spin 1s linear infinite;
}

/* 스피너 애니메이션 */
@keyframes spin {
  100% { transform: rotate(360deg); }
}

/* 문구 */
.loading-box p {
  font-size: 1rem;
  color: var(--rp-text);
}

/* 반응형 */
@media (max-width: 480px) {
  .spinner {
    width: 40px;
    height: 40px;
    border-width: 5px;
  }
  .loading-box p {
    font-size: 0.9rem;
  }
}

.is-visually-hidden-action { visibility: hidden; }

/* 회원가입 완료 */
.welcome-box,
.swal2-container,
.reward-info {
  --page-pill-radius: 999px;
  --page-modal-radius: 28px;
  --page-welcome-shadow: 0 8px 20px rgba(255, 60, 40, 0.25);
  --page-cta-shadow: 0 8px 20px rgba(255, 0, 0, 0.6);
  --page-cta-shadow-hover: 0 12px 25px rgba(255, 60, 40, 0.8);
  --page-modal-shadow: 0 14px 44px rgba(0, 0, 0, 0.55);
  --page-confirm-shadow: 0 14px 38px rgba(255, 60, 40, 0.35);
  --page-reward-shadow: 0 0 25px rgba(255, 60, 40, 0.25);
  --page-reward-shadow-hover: 0 12px 30px rgba(255, 60, 40, 0.8);
}

.welcome-box {

  text-align: center;
  background: linear-gradient(135deg, color-mix(in srgb, var(--rp-danger) 8%, transparent), color-mix(in srgb, var(--rp-secondary) 5%, transparent));
  border: 1px solid color-mix(in srgb, var(--rp-chrome-title) 8%, transparent);
  border-radius: var(--rp-radius-lg);
  padding: 40px 30px;
  color: var(--rp-text);
  margin: 0 auto;
  max-width: 700px;
  animation: fadeInUp 0.8s ease;
  box-shadow: var(--page-welcome-shadow);
}
.welcome-logo { display: block; width: min(260px, 75%); margin: 0 auto 24px; }
.welcome-box h1 {
  margin: 0 0 12px;
  color: var(--rp-text);
  font-size: clamp(26px, 4vw, 36px);
  font-weight: 800;
}
.welcome-box h4 {
  font-size: 26px;
  font-weight: 800;
  color: var(--rp-danger);
  margin-bottom: 12px;
}
.welcome-box p {
  font-size: 17px;
  line-height: 1.6;
  color: var(--rp-text-muted);
  margin-bottom: 25px;
}
.welcome-box .welcome-login-link { margin: 22px 0 0; font-size: 14px; }
.welcome-box .welcome-login-link a { color: var(--rp-primary); font-weight: 700; }
.welcome-box .welcome-btn {
  display: inline-block;
  background: linear-gradient(45deg, var(--rp-primary), var(--rp-secondary));
  color: var(--rp-chrome-title);
  padding: 14px 36px;
  border-radius: var(--page-pill-radius);
  font-weight: 700;
  font-size: 18px;
  text-decoration: none;
  transition: all 0.25s ease-in-out;
  box-shadow: var(--page-cta-shadow);
}
.welcome-box .welcome-btn:hover {
  transform: scale(1.05);
  box-shadow: var(--page-cta-shadow-hover);
}
@keyframes fadeInUp {
  from {opacity: 0; transform: translateY(30px);}
  to {opacity: 1; transform: translateY(0);}
}

/* 컨테이너(모달 바깥 어둡게 + 살짝 레드 오라) */
  .swal2-container.dark-glow .swal2-backdrop-show{
    backdrop-filter: blur(3px);
    background: color-mix(in srgb, var(--rp-overlay) 72%, transparent);
  }
  /* 모달 박스 */
  /* 모달 박스 */
.swal2-popup.dark-card{
  background:var(--rp-surface);
  border:1px solid var(--rp-border);
  color:var(--rp-text);
  border-radius:var(--page-modal-radius);
  padding:28px 26px;
  box-shadow: var(--page-modal-shadow);
}

/* 컨테이너(뒤 배경 어둡게) */
.swal2-container.dark-glow .swal2-backdrop-show{
  backdrop-filter: blur(2px);
  background: color-mix(in srgb, var(--rp-overlay) 72%, transparent);
}

  .swal2-title{
    color:var(--rp-text); font-weight:800; letter-spacing:-.2px;
  }
  .swal2-html-container{color:var(--rp-text-muted); opacity:.85}

  /* 버튼(레드 그라데이션 + 글로우) */
  .swal2-styled.swal2-confirm.red-cta{
    background: linear-gradient(135deg, var(--rp-primary), var(--rp-secondary));
    box-shadow: var(--page-confirm-shadow);
    border:none; border-radius:var(--page-pill-radius);
    font-weight:800; text-transform:unset;
    padding:14px 26px;
  }
  .swal2-styled.swal2-confirm.red-cta:hover{
    filter:brightness(1.05); transform:translateY(-1px);
  }
  .swal2-styled.swal2-cancel.gray-ghost{
    background:var(--rp-surface-alt); color:var(--rp-text); border:1px solid var(--rp-border);
  }
  /* 아이콘 살짝 강조 */
  .swal2-icon.swal2-info{
    border-color:color-mix(in srgb, var(--rp-secondary) 45%, transparent); color:var(--rp-secondary);
  }

.btn-buy {
    background: linear-gradient(45deg, var(--rp-primary), var(--rp-secondary));
    color: var(--rp-chrome-title);
    font-size: 20px;
    font-weight: bold;
    padding: 18px 40px;
    border: none;
    border-radius: var(--page-pill-radius);
    cursor: pointer;
    text-transform: uppercase;
    box-shadow: var(--page-cta-shadow);
    animation: pulse 1.5s infinite;
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

.btn-buy:hover {
    transform: scale(1.1);
    box-shadow: var(--page-cta-shadow-hover);
}

@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

.reward-info {
  background: linear-gradient(135deg, var(--rp-chrome), var(--rp-chrome-elevated));
  padding: 80px 0;
  text-align: center;
  color: var(--rp-chrome-title);
  border-top: 1px solid color-mix(in srgb, var(--rp-chrome-title) 5%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--rp-chrome-title) 5%, transparent);
}

.reward-info .reward-box {
  max-width: 700px;
  margin: 0 auto;
  padding: 50px 40px;
  border-radius: var(--rp-radius-lg);
  background: linear-gradient(145deg, color-mix(in srgb, var(--rp-chrome-title) 5%, transparent), color-mix(in srgb, var(--rp-chrome-title) 2%, transparent));
  box-shadow: var(--page-reward-shadow);
  animation: fadeInUp 0.8s ease;
}

.reward-info h3 {
  font-size: 32px;
  margin-bottom: 16px;
  font-weight: 800;
  color: var(--rp-danger);
}

.reward-info p {
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 30px;
  color: var(--rp-chrome-text);
}

.reward-info .reward-btn {
  display: inline-block;
  background: linear-gradient(45deg, var(--rp-primary), var(--rp-secondary));
  color: var(--rp-chrome-title);
  padding: 16px 40px;
  border-radius: var(--page-pill-radius);
  font-weight: 700;
  font-size: 18px;
  box-shadow: var(--page-cta-shadow);
  text-decoration: none;
  transition: all 0.25s ease-in-out;
}

.reward-info .reward-btn:hover {
  transform: scale(1.05);
  box-shadow: var(--page-reward-shadow-hover);
}

@keyframes fadeInUp {
  from {opacity: 0; transform: translateY(30px);}
  to {opacity: 1; transform: translateY(0);}
}

.welcome-action { margin: 30px 0; text-align: center; }

/* 카카오 알림톡 테스트 */
.test-status.is-success { color: var(--rp-success); }
.test-status.is-error { color: var(--rp-danger); }

/* 요금제 테스트 */
#footer .wrapper{
	height: auto !important;
}

.sec01 {
	--page-circle-radius: 50%;
	--page-check-shadow-empty: inset 0 0 0 0 var(--rp-primary);
	--page-check-shadow-full: inset 0 0 0 150px var(--rp-primary);

	padding-top: calc(100px + 80px);
	padding-bottom: 140px;
}

.sec01 .wrapper{
	width: 92.5%;
	max-width: 1920px;
}

.sec01 .tit-box{}

.sec01 .tit-box h3{
	text-align: center;
}

.sec01 .tit-box h3 img,
.sec01 .tit-box h3 svg{
	display: inline-block;
	vertical-align: middle;
	width: 300px;
}

.sec01 .order-form{
	margin-top: 60px;
	background-color: var(--rp-chrome-elevated);
	border-radius: var(--rp-radius);
	position: relative;
}

.sec01 .order-form::before{
	content: "";
	width: 50%; height: 0;
	padding-bottom: 50%;
	background-color: var(--rp-surface);
	border-radius: var(--page-circle-radius);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	filter: blur(100px);
	z-index: -2;
	opacity: 0.25;
}

.sec01 .order-form .pricing-list{
	display: flex;
	flex-direction: row;
}

.sec01 .order-form .pricing-list .pricing{
	position: relative;
	width: calc( 100% / 3 );
	box-sizing: border-box;
	padding: 0;
	transition: var(--rp-transition);
	background-color: var(--rp-chrome-elevated);
	border-radius: var(--rp-radius);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}

.sec01 .order-form .pricing-list .pricing{
	--border-angle: 0turn;
	--main-bg: conic-gradient(
	  from var(--border-angle),
	  var(--rp-chrome),
	  var(--rp-chrome) 5%,
	  var(--rp-chrome) 60%,
	  var(--rp-chrome) 95%
	);
	border: solid 1px transparent;
	--gradient-border: conic-gradient(from var(--border-angle), var(--rp-text-muted) 25%, var(--rp-border-strong), var(--rp-text-muted) 99%, var(--rp-border-strong));
	background: var(--main-bg) padding-box, var(--gradient-border) border-box, var(--main-bg) border-box;
	background-position: center center;
	-webkit-animation: bg-spin 3s linear infinite;
	animation: bg-spin 3s linear infinite;
	box-shadow: none;

	
}

.sec01 .order-form .pricing-list .pricing:hover{
	--gradient-border: conic-gradient(from var(--border-angle), var(--rp-primary) 25%, var(--rp-gradient-end), var(--rp-primary) 99%, var(--rp-gradient-end));
	box-shadow: var(--rp-shadow-lg);
}

.sec01 .order-form .pricing-list .pricing.pricingPlus{
	--page-pricing-gold: #ffd43b;
	--page-pricing-gold-deep: #f79a14;
	--page-pricing-gold-soft: #fff5d0;
	--main-bg02: conic-gradient(
	  from var(--border-angle),
	  var(--rp-chrome-title),
	  var(--page-pricing-gold-deep) 5%,
	  var(--page-pricing-gold-deep) 60%,
	  var(--page-pricing-gold-deep) 95%
	);
	border: solid 3px transparent;
	--gradient-border-gold: conic-gradient(from var(--border-angle), var(--page-pricing-gold) 25%, var(--page-pricing-gold-soft), var(--page-pricing-gold) 99%, var(--page-pricing-gold-soft));
	background: var(--main-bg) padding-box, var(--gradient-border-gold) border-box, var(--main-bg) border-box;
	background-position: center center;
	-webkit-animation: bg-spin 3s linear infinite;
	animation: bg-spin 3s linear infinite;
	box-shadow: none;
}

.sec01 .order-form .pricing-list .pricing.pricingPlus:hover{
	--gradient-border-gold2: conic-gradient(from var(--border-angle), var(--page-pricing-gold-deep) 25%, var(--rp-chrome-title), var(--page-pricing-gold-deep) 99%, var(--page-pricing-gold-deep));
	box-shadow: var(--rp-shadow-lg);
}

.sec01 .order-form .pricing-list .pricing:first-child{
	/* border: none; */
}

@-webkit-keyframes bg-spin {
  to {
	--border-angle: 1turn;
  }
}
@keyframes bg-spin {
  to {
	--border-angle: 1turn;
  }
}

@property --border-angle {
  syntax: "<angle>";
  inherits: true;
  initial-value: 0turn;
}


.sec01 .order-form .pricing-list .pricing::before{
	content: "";
	width: 60%;
	height: 60%;
	background: linear-gradient(to right, var(--rp-primary), var(--rp-gradient-end));
	border-radius: var(--page-circle-radius);
	position: absolute;
	top: -60%;
	right: -15%;
	filter: blur(130px);
	transition: var(--rp-transition);
	opacity: 0;
}


.sec01 .order-form .pricing-list .pricing:hover::before{
	top: -25%;
	opacity: 1;
}

.sec01 .order-form .pricing-list .pricing.pricingPlus::before{
	background: linear-gradient(to right, var(--page-pricing-gold), var(--page-pricing-gold-deep));
}

.sec01 .order-form .pricing-list .pricing *{
	position: relative;
	z-index: 2;
}

.sec01 .order-form .pricing-list .pricing .top-content{
	padding: 20px;
}

.sec01 .order-form .pricing-list .pricing figure{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 50px; height: 50px;
	border-radius: var(--rp-radius);
	background-color: var(--rp-chrome-elevated);
}

.sec01 .order-form .pricing-list .pricing figure img{
	width: 30px;
}

.sec01 .order-form .pricing-list .pricing figure i{
	font-size: 1.125rem;
	background: linear-gradient(to bottom, var(--rp-primary), var(--rp-gradient-end));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	word-break: inherit;
}

.sec01 .order-form .pricing-list .pricing.pricingPlus figure i{
	background: linear-gradient(to bottom, color-mix(in srgb, var(--page-pricing-gold) 55%, var(--rp-surface)), var(--page-pricing-gold-deep));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	word-break: inherit;
}

.sec01 .order-form .pricing-list .pricing h4{
	margin-top: 15px;
	font-size: 1rem;
	font-weight: var(--fw-500);
	color: var(--rp-text-muted);
	word-break: keep-all;
}

.sec01 .order-form .pricing-list .pricing .price{
	margin-top: 35px;
	display: flex;
	flex-direction: row;
	align-items: flex-end;
	gap: 10px;
	position: relative;
}

.sec01 .order-form .pricing-list .pricing .price strong{
	font-size: 2rem;
	font-weight: var(--fw-700);
}

/* .sec01 .order-form .pricing-list .pricing.pricingPlus .price strong{
	background-image: linear-gradient(to right, var(--page-pricing-gold-deep), color-mix(in srgb, var(--page-pricing-gold) 25%, var(--rp-surface)));
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
} */

.sec01 .order-form .pricing-list .pricing .price strong::before{
	content: "";
	display: block;
	/* position: absolute; */
	top: -20px;
	left: 0;
	font-size: 1rem;
	/* font-weight: 500; */
	opacity: 0.4;
	/* text-decoration: line-through; */
    content: '    ';
	opacity: 1;
}

.sec01 .order-form .pricing-list .pricing:nth-child(2) .price strong::before,
.sec01 .order-form .pricing-list .pricing:nth-child(6) .price strong::before{
	content: '    ';
	opacity: 1;
}

.sec01 .order-form .pricing-list .pricing:nth-child(1) .price strong::before{
	content: '기본 무료 제공 서비스';
}
.sec01 .order-form .pricing-list .pricing:nth-child(2) .price strong::before{
	content: '가볍게 시작하기';
}
.sec01 .order-form .pricing-list .pricing:nth-child(3) .price strong::before{
	content: '전문적 블로그 육성';
}
/* .sec01 .order-form .pricing-list .pricing:nth-child(3) .price strong::before{
	content: '￦60,000';
} */

.sec01 .order-form .pricing-list .pricing:nth-child(4) .price strong::before{
	content: '대행사 / 실행사 기업 추천';
}

.sec01 .order-form .pricing-list .pricing:nth-child(5) .price strong::before{
	content: '￦120,000';
}

.sec01 .order-form .pricing-list .pricing .price small{
	color: var(--rp-text-muted);
	font-weight: var(--fw-600);
}

.sec01 .order-form .pricing-list .pricing table td small{
	color: var(--rp-text-muted);
	font-weight: var(--fw-600);
    font-size: 13px;
}

.sec01 .order-form .pricing-list .pricing .feature-list{
	margin-top: 30px;
	padding-top: 30px;
	border-top: 1px dashed var(--rp-border);
}

.sec01 .order-form .pricing-list .pricing .feature-list .feature{
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 5px;
}

.sec01 .order-form .pricing-list .pricing .feature-list .feature:not(:first-child){
	margin-top: 20px;
}

.sec01 .order-form .pricing-list .pricing .feature-list .feature i{
	opacity: 0.3;
	font-size: 1.25rem;
}

.sec01 .order-form .pricing-list .pricing .feature-list .feature span{
	opacity: 0.8;
}

.sec01 .order-form .pricing-list .pricing .btn-submit{
	margin-top: 20px;
	width: 100%;
	justify-content: center;
	background-color: var(--rp-border-strong);
	cursor: pointer;
	transition: var(--rp-transition);
	overflow: hidden;
	position: relative;
}

.sec01 .order-form .pricing-list .pricing.pricingPlus .btn-submit{
	background: linear-gradient(to bottom, color-mix(in srgb, var(--page-pricing-gold) 55%, var(--rp-surface)), var(--page-pricing-gold-deep));
}

.sec01 .order-form .pricing-list .pricing .btn-submit::before{
	content: "";
	width: 100%; height: 100%;
	background: linear-gradient(to bottom, var(--rp-primary), var(--rp-gradient-end));
	position: absolute;
	top: 0; left: 0;
	z-index: -1;
	opacity: 0;
	transition: var(--rp-transition);
}

.sec01 .order-form .pricing-list .pricing.pricingPlus .btn-submit::before{
	background: linear-gradient(to bottom, var(--page-pricing-gold-deep), var(--page-pricing-gold-deep));
}

.sec01 .order-form .pricing-list .pricing .btn-a{
	content: "";
	width: 100%; height: 100%;
	background: linear-gradient(to bottom, var(--rp-primary), var(--rp-gradient-end));
	position: absolute;
	top: 0; left: 0;
	z-index: -1;
	opacity: 0;
	transition: var(--rp-transition);
}



.sec01 .order-form .pricing-list .pricing:hover .btn-submit{
	background-color: transparent;
}

.sec01 .order-form .pricing-list .pricing:hover .btn-submit::before{
	opacity: 1;
}

.sec01 .order-form .pricing-list .pricing .btn-submit span{
	font-size: 0.9375rem;
}

.sec01 .order-form .pricing-list .pricing.pricingPlus .btn-submit span{
	color:var(--rp-chrome);
}

.sec01 .order-form .pricing-list .pricing.pricingPlus .btn-submit:hover span{
	color:var(--rp-chrome-title);
}

.sec01 .order-form .pricing-list{
	align-items: stretch;
}

.sec01 .order-form .pricing-list .pricing{
	height: 100%;
}

.sec01 .order-form .pricing-list .pricing table{
	border-collapse: collapse;
	table-layout: fixed;
	text-align: center;
	margin-top: 10px;
	width: 100%;
}

.sec01 .order-form .pricing-list .pricing table tbody{
	display: table-row-group;
}

.sec01 .order-form .pricing-list .pricing table tr{
	height: 50px;
	display: table-row;
}

.sec01 .order-form .pricing-list .pricing table td{
	vertical-align: middle;
}

.sec01 .order-form .pricing-list .pricing table th,
.sec01 .order-form .pricing-list .pricing table td{
	padding: 15px 5px;
	font-size: 0.9375rem;
	font-weight: var(--fw-500);
}

.sec01 .order-form .pricing-list .pricing table td i{
	font-size:0.9375rem;
}

.sec01 .order-form .pricing-list .pricing table tr:nth-child(odd){
	background-color: var(--rp-chrome-elevated);
}

.sec01 .order-form .pricing-list .pricing table tr:nth-child(even){
	background-color: var(--rp-surface-alt);
}

/* .sec01 .order-form .pricing-list .pricing.pricingPlus table tr:nth-child(odd){
	background-color: var(--page-pricing-gold);
}

.sec01 .order-form .pricing-list .pricing.pricingPlus table tr:nth-child(even){
	background-color: color-mix(in srgb, var(--page-pricing-gold) 72%, var(--rp-surface));
}

.sec01 .order-form .pricing-list .pricing.pricingPlus table tr:nth-child(odd) td{
	color:var(--rp-dark);
}

.sec01 .order-form .pricing-list .pricing.pricingPlus table tr:nth-child(even) td{
	color:var(--rp-dark);
} */

/* .sec01 .order-form .pricing-list .pricing:nth-child(1) table{
	border-radius: var(--rp-radius-sm) 0 0 var(--rp-radius-sm);
	overflow: hidden;
} */

.sec01 .order-form .pricing-list .pricing table .opacity{
	opacity: 0.5;
}


@media screen and (max-width: 1400px){
	.sec01 .order-form .pricing-list .pricing:first-child{
/*		display: none;*/
	}
	
	.sec01 .order-form .pricing-list .pricing table th,
	.sec01 .order-form .pricing-list .pricing table td{
		/* padding-top: 40px; */
		position: relative;
	}
	
	.sec01 .order-form .pricing-list .pricing table td::before{
		content: "";
		position: absolute;
		top: 17px;
		left: 50%;
		transform: translateX(-50%);
		font-size: 0.9375rem;
		font-weight: var(--fw-500);
		opacity: 0.8;
	}
	
	/* .sec01 .order-form .pricing-list .pricing table td:nth-child(1)::before{
		content: "AI 글쓰기";
	}
	
	.sec01 .order-form .pricing-list .pricing table td:nth-child(2)::before{
		content: "코인지급";
	}
	
	.sec01 .order-form .pricing-list .pricing table td:nth-child(3)::before{
		content: "라온픽 이용가능";
	}
	
	.sec01 .order-form .pricing-list .pricing table td:nth-child(4)::before{
		content: "이미지 생성기능";
	}
	
	.sec01 .order-form .pricing-list .pricing table td:nth-child(5)::before{
		content: "추가혜택 1";
	}
	
	.sec01 .order-form .pricing-list .pricing table td:nth-child(6)::before{
		content: "추가혜택 2";
	} */
}

@media screen and (max-width: 1200px){
	.sec01 .tit-box h3{
		line-height: 1.3;
	}
	.sec01 .tit-box h3 img, .sec01 .tit-box h3 svg{
		width: 270px;
	}
}


@media screen and (max-width: 1000px){
	.wrapper:not(#header .wrapper){
		height: auto !important;
	}
	.sec01 .order-form{
		background-color: transparent;
	}
	.sec01 .order-form .pricing-list{
		flex-wrap: wrap;
		gap: 20px 0;
	}
}


@media screen and (max-width: 767px){
	.sec01{
		padding-top: 150px;
	}
	
	.sec01 .tit-box h3{
		font-size: 2.25rem;
		word-break: keep-all;
	}
	
	.sec01 .tit-box h3 img,
	.sec01 .tit-box h3 svg{
		width: 200px;
	}
	
	.sec01 .order-form{
		margin-top: 40px;
	}
		
	
	.sec01 .order-form .pricing-list .pricing{
		width: calc(100% / 2);
	}
}


@media screen and (max-width: 460px){
	.sec01 .order-form .pricing-list .pricing .top-content{
		padding: 15px;
	}
	
	.sec01 .order-form .pricing-list .pricing figure{
		width: 40px; height: 40px;
	}
	
	.sec01 .order-form .pricing-list .pricing figure i{
		font-size: 1rem;
	}
	
	.sec01 .order-form .pricing-list .pricing h4{
		margin-top: 10px;
	}
	
	.sec01 .order-form .pricing-list .pricing .price{
		margin-top: 30px;
	}
	
	.sec01 .order-form .pricing-list .pricing .price strong{
		font-size: 1.5625rem;
	}
	
	.sec01 .order-form .pricing-list .pricing .price strong::before{
		font-size: 0.9375rem;
		top: -15px;
	}
	
	.sec01 .order-form .pricing-list .pricing .btn-submit span{
		font-size: 0.8125rem;
	}
	
	.sec01 .order-form .pricing-list .pricing table th,
	.sec01 .order-form .pricing-list .pricing table td{
		padding: 10px;
		padding-top: 30px;
	}
	
	.sec01 .order-form .pricing-list .pricing table td *{
		font-size: inherit;
	}
	
	.sec01 .order-form .pricing-list .pricing table td::before{
		font-size: 0.75rem;
		top: 10px;
	}

	.sec01 .order-form .pricing-list .pricing .price strong{
		font-size:1.5rem;
		word-break:keep-all;
	}
}



/* 충전성공 */
.checkmark__circle {
  stroke-dasharray: 166;
  stroke-dashoffset: 166;
  stroke-width: 2;
  stroke-miterlimit: 10;
  stroke: var(--rp-primary);
  fill: none;
  animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.checkmark {
  width: 150px;
  height: 150px;
  border-radius: var(--page-circle-radius);
  display: block;
  stroke-width: 2;
  stroke: var(--rp-chrome-title);
  stroke-miterlimit: 10;
  margin: 60px auto;
  box-shadow: var(--page-check-shadow-empty);
  animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
}

.checkmark__check {
  transform-origin: 50% 50%;
  stroke-dasharray: 48;
  stroke-dashoffset: 48;
  animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}

@keyframes stroke {
  100% {
	stroke-dashoffset: 0;
  }
}
@keyframes scale {
  0%, 100% {
	transform: none;
  }
  50% {
	transform: scale3d(1.1, 1.1, 1);
  }
}
@keyframes fill {
  100% {
	box-shadow: var(--page-check-shadow-full);
  }
}

.product-info-box{
	text-align: center;
	width: 400px;
	margin: 60px auto 0;
}

.product-info-box dl{
	width: 100%;
	margin: 0 auto;
	background-color: var(--rp-surface-alt);
	border: 1px solid var(--rp-border);
	box-sizing: border-box;
	padding: 30px;
	border-radius: var(--rp-radius);
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 15px 15px;
	flex-wrap: wrap;
}

.product-info-box dl dt{
	width: 15%;
	font-size: 0.9375rem;
	color: var(--rp-text-muted);
	font-weight: var(--fw-600);
	text-align: left;
}

.product-info-box dl dd{
	width: calc( 100% - 15% - 15px );
	text-align: left;
	font-size: 0.9375rem;
	opacity: 0.8;
	color: var(--rp-text);
}

.product-info-box .btn{
	margin-top: 40px;
	background: linear-gradient(to top, var(--rp-primary), var(--rp-gradient-end));
	transition: var(--rp-transition);
	justify-content: center;
}


 .sec01 .order-form .pricing-list .pricing01 .highlight{
 	border-left:2px solid var(--rp-primary);
 	border-right:2px solid var(--rp-primary);
 	box-sizing:border-box;
 	background: color-mix(in srgb, var(--rp-primary) 24%, transparent) !important;
 } 
 
 .sec01 .order-form .pricing-list .pricing01 .highlight th{
 	/* 강조 색상은 페이지 골드 변수를 사용합니다. */
 	font-weight:700;
 }
 
 .sec01 .order-form .pricing-list .pricing01 .highlight01{
 	border-top:2px solid var(--rp-primary);
 }
 
 .sec01 .order-form .pricing-list .pricing01 .highlight04{
 	border-bottom:2px solid var(--rp-primary);
 } 
 
 /* .sec01 .order-form .pricing-list .pricing01 .highlight:nth-child(even){
 	background-color:var(--rp-primary) !important;
 } */


 /* .sec01 .order-form .pricing-list .pricing01 .highlight{
 	background-color:var(--rp-primary) !important;
 } */
